Skip to main content

Version 2.2.0

Welcome to the Open Design System v.2.2.0!

This minor release introduces important updates to our components library and themes. Read on to learn more!

Resources​

You can download icons, foundations, and components from the Open Design System v.2.2.0.

Components
External link icon
Foundations
External link icon
Icons
External link icon

New component: Full-screen modal​

Full-screen modal is a new component in the Surfaces group. It covers 90% of the screen, disabling all other app functions until dismissed or an action is taken.

New component: Sticky bar​

Sticky bar is another addition to the Surfaces group. This component serves as a container for the features users interact with the most, even while scrolling.

Updates and improvements​

  • Autocomplete: Aligned the Extended and Regular variants. Both autocomplete variants now display a dropdown before an out click.
  • Menu context: Introduced a new variant—icon with cascade menu. We've also enabled the ability to add subtitles and dividers simultaneously.
  • Side modal: Added a scroll state feature.
  • Modal: Simplified the component structure, deprecated the Danger variant, and renamed the Warning variant to "Destructive."
  • Tree: Updated the overflow behavior: long labels will now wrap onto the following line.
  • Avatar: Introduced Logo, a new type of Avatar. The Icon avatar is now separated into the Icon variant, and any outdated instances will now be marked as Missing Variant. We've added L and XL sizes for the Icon type. The Avatar type is now called User, and Avatar group is now called User group.
  • List item: Added missing states for the After Text: Toggle variant. The Subtitle font style is updated. Additionally, we've fixed some minor bugs.
  • Select: Updated the behavior of Actions.
  • Date picker: Replaced the date separator with a hyphen in the Date Range input and changed the properties structure.
  • Autocomplete, Counter, Combined input: Added size S, Label component, and the missing Helper text. Finally, we've updated the component properties structure.
  • Sidebar: Added a right vertical divider and a Sub-items group. We've also updated the component properties structure.
  • Toast: Added the ability to modify toast icons and include additional text info. We've also introduced visual changes and a new type of toast, App Notification. The previous toast type has been renamed to System Notification.
  • Inline message: Implemented color changes for Warning and Info messages in the size M (to warning/200 and grey/300, respectively).

Bug fixes​

  • Theming: We have resolved an issue regarding the first argument in the createTheme & resolveTheme methods.
  • Toast: We've fixed an issue where the margin between components was missing in React Examples. Also, we've resolved the issues with paddings around toasts.
  • File upload: Previously, the system did not support .rar files. We've updated our File Upload feature to accommodate .rar files, broadening the range of file types users can upload. Also, an error message appeared in the console after canceling a file upload. This bug is resolved, and users can cancel uploads without console errors.
  • Top bar: Two issues needed fixing. First, there was a problem with the icon flipping after opening the second dropdown, which is now resolved. The icon behaves as expected. Second, there was an incorrect margin in the last item. This has been corrected to ensure proper alignment.
  • Card: An issue was identified with the label color in the disabled state. Initially, the label color did not indicate the disabled state, but now the label switches to Grey/500 when the card is disabled for better visibility.
  • Horizontal stepper: We've adjusted the auto-layout settings. Previously, the background on the Horizontal Stepper did not resize along with the text size, but this has now been fixed for better user experience.