Skip to main content

Version 2.15.1

Welcome to the WPP Open Design System v.2.15.1!   This extended release of 2.15.0 introduces updates and bug fixes to our components' library. 

Read on to learn more! 

Resources  

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

Updates and improvements 

Figma libraries

  • Pagination: Enhanced the visibility of the selected pagination item to make it easier to identify.

Development specific

  • Pagination: Updated the selected pagination item to enhance visual distinction. Changed the background color for the selected pagination item to align with Figma design specifications. The selected item now has:

    • background color matching “wpp-primary-color-100".

    • text color matching “pagination-item-text-color-selected".

  • Stepper: Enhanced the Stepper component to support decimal values such as 1.1, 1.2, 1.3, etc. The steps are now in integer values while the sub-steps are in decimal values––users can activate sub-steps automatically by clicking on the step. This update allows users to define and navigate through sub-steps within main steps more precisely and provides an intuitive user experience.

Bug fixes

Development specific

  • Sticky Bar: Updated the Sticky Bar behavior so that it appears correctly below the OS Bar when triggered and doesn’t appear behind the OS Bar.

  • Popover: Adjusted the behavior to handle non-interactive elements used as triggers for popovers. Now, the dropdown of the popover opens correctly even when a non-interactive element, such as an icon, is used as the trigger.

  • Multiple components: Added validation to ensure that components only proceed when the ResizeObserver is successfully created, preventing errors and test failures.

  • Dropdown: Fixed dropdown rendering for OS-based applications––now it is placed in <div id="root"> or in the body of the page instead of <div id="micro-app">––providing consistent dropdown behavior across platforms.

  • Slider: Implemented text truncation for longer slider marks, ensuring that text no longer overlaps with other elements. Displayed a tooltip with the full text when users hover over the mark for improved readability and user experience.