polaris

Major Changes

• #11844 a89e61478 Thanks @jesstelford! - Miniumum required node version updated to v20.10.0. No action required if using the extension in VSCode.

• #11799 aa8e0f42b Thanks @ryanwilsonperkin! - [Internal] Migrate repo from yarn to pnpm. No action required.

Major Changes

• #11844 a89e61478 Thanks @jesstelford! - Miniumum required node version updated to v20.10.0

Major Changes

• #11844 a89e61478 Thanks @jesstelford! - Miniumum required node version updated to v20.10.0

• #11799 aa8e0f42b Thanks @ryanwilsonperkin! - [Internal] Migrate repo from yarn to pnpm. No action required.

Major Changes

• #11844 a89e61478 Thanks @jesstelford! - Miniumum required node version updated to v20.10.0

• #11799 aa8e0f42b Thanks @ryanwilsonperkin! - [Internal] Migrate repo from yarn to pnpm. No action required.

• #11799 aa8e0f42b Thanks @ryanwilsonperkin! - react is now a required peerDependency (even when importing non-React SVG assets). More info

Major Changes

• #11844 a89e61478 Thanks @jesstelford! - Miniumum required node version updated to v20.10.0

• #11799 aa8e0f42b Thanks @ryanwilsonperkin! - [Internal] Migrate repo from yarn to pnpm. No action required.

Minor Changes

• #11609 c9e217d9d Thanks @sam-b-rose! - Updated icon set with consistency improvements

Minor Changes

• #11602 ae04f0d37 Thanks @mrcthms! - Updated Page sub-components to only restrict the width of the subtitle if secondary actions or action groups are present

Patch Changes

• #11564 9839180d9 Thanks @jesstelford! - Remove .Polaris-Summer-Editions-2023 class from html element.

• #11605 ef91b21e2 Thanks @yurm04! - Reduced ActionList.Item padding and gap

Patch Changes

• Updated dependencies [f63177602, 27a0fba87, 1d2f51ee9]:
  • @shopify/[email protected]

Patch Changes

• #6062 1d2f51ee9 Thanks @chazdean! - Add keyboard shortcut

Minor Changes

• #6022 78bb4f3d3 Thanks @jorgenunezsiri! - Added 'onActionRollup' prop to Page component.

• #6055 4d4891bf0 Thanks @kyledurand! - Added row and column props to Grid.Cell

Patch Changes

• #5812 7d13e95d0 Thanks @developit! - Fixed Listbox to preserve scroll position when lazy-loading additional items

• #6039 a1b5ce122 Thanks @jorgenunezsiri! - Fixed rolled up action groups to include section title.
  • Fixed action items inside action groups to be disabled if the action group is disabled.

• #6062 1d2f51ee9 Thanks @chazdean! - Add keyboard shortcut

• #6063 594379006 Thanks @mateus! - Add TopBar logoSuffix prop

• Updated dependencies [bb777601a]:
  • @shopify/[email protected]

Minor Changes

• #6004 27a0fba87 Thanks @samrose3! - Added dark variants for the light scheme color tokens

Patch Changes

• #6054 f63177602 Thanks @chazdean! - Implement icons modal

Minor Changes

• #5539 4366b2b52 Thanks @JeremyLudwigDev! - Added hasFixedFirstColumn and firstColumnMinWidth props to DataTable

Patch Changes

• #6060 7bacb9342 Thanks @kyledurand! - Removed image background fallback

• #6054 f63177602 Thanks @chazdean! - Implement icons modal

• #6027 d08935693 Thanks @samrose3! - The CustomProperties component and the colorScheme prop in all components have been deprecated. Please see the v9 to v10 migration guide for upgrade options.

• #5966 1185d7fed Thanks @kyledurand! - Simplified the Grid component and improved its performance

• #6044 dcdf862bb Thanks @aaronccasanova! - Updated the sticky-manager to use a valid spacing token

• #5840 04ce5c6a3 Thanks @Berhell! - Fixed Badge and Pip having different background colors for new and info status (#5840)

• #6029 c779008f8 Thanks @kyledurand! - Fixed a bug in Image where the loading class wasn't reliably getting removed on load due to server side rendering

• Updated dependencies [f63177602, 27a0fba87]:
  • @shopify/[email protected]

🛑 Unsafe release

This release stops all CSS animations from working in @shopify/polaris. A fix is coming soon. Thank you @mbaumbach for flagging this regression in https://github.com/Shopify/polaris/issues/5985.

Minor Changes

• #5962 3a64ee7e3 Thanks @alex-page! - Updated @rollup/pluginutils to v4.1.0

• #5473 f04a387bc Thanks @kyledurand! - Add graceful fallbacks for Image and Avatar

Patch Changes

• #5957 e51901656 Thanks @chloerice! - Fixed TextField blocking text selection within verticalContent

• #5874 814bef39e Thanks @kyledurand! - Fixed an accessibility bug in modal where clicking or tapping the backdrop would not close the modal

Patch Changes

• #5984 c3e7f2ef7 Thanks @zakwarsame! - changes divider padding on page component

• #6006 92ca0e5b2 Thanks @kyledurand! - Fixed a bug where keyframes weren't being properly added to builds

Enhancements

• Ported internal breakpoint and layout functions to SCSS variables (#5722)
• Added extraSmall to the available sizes of the Thumbnail and SkeletonThumbnail (#5770)
• Updated experimental breakpoint values (#5804, #5830)
• Added support for tooltips on Navigation items (#5750)
• Change types for DataTable totalsName prop to allow for ReactNode (#5454)
• Implemented accessibility role and attributes in SettingToggle (#5470)

Bug fixes

• Fixed vertical scroll on small screens in EmptyState (#5779)
• Fixed broken links in documentation (#5824)
• Fixed key prop error introduced in sticky header (#5826)

Documentation

• Replaced deprecationNotice with notice object (#5841)

Enhancements

• Replaced hardcoded padding or margin values with spacing tokens (#5528)
• Added border-width-4 and border-width-5 tokens and replaced hardcoded values (#5528)
• Replaced any hardcoded outline-width with border-width (#5528)
• Added the ability to disable specific dates in the DatePicker, to go along with date ranges (#5356)
• Added breakpoint CSS custom properties and SCSS media conditions (#5558)
• Replaced 768px breakpoint mixins and variables with custom media conditions (#5629)
• Added customListId prop to Listbox (5627)
• Pass domId as an argument to onActiveOptionChange prop on Listbox (5627)
• Adding min-height to Popover.Pane when the Popover contains a height prop (#5685)
• Adjusted a hardcoded padding value for FileUpload and replaced it with a spacing token (#5675)
• Added disable prop to the action groups title of the Page header (#5702)
• Added onClick prop to the action groups title of the Page header (#5751)

Bug fixes

• Used prop-provided selectable value in IndexTable (#5661)
• Fixed passing inline styles to the root element of the CustomProperties component (#5661)
• Replaced incorrect usage of aria-expanded on Collapsible with aria-hidden (#5661)
• Removed usage of deprecated and removed in v18 React types (#5704)
• Fixed plain-button-backdrop background color on colored backgrounds (#5687)
• Fixed scrolling bug in DataTable sticky header (#5700)

Documentation

• Added wrapper with height on Combobox example for autocomplete with loading (#5624)

Dependency upgrades

• Removed lodash (#5544)
• Uses more permissive dependency for @types/react and @types/react-dom (#5575)

Code quality

• Replaced skeleton-content and thumbnail-size mixins with css values (#5630)

https://github.com/Shopify/polaris/compare/tokens-v5.0.0...tokens-v5.0.1

Fixes

• https://github.com/Shopify/polaris/pull/5689 Exposes .scss file
• https://github.com/Shopify/polaris/pull/5686 Fixes and issue with ESM interoperability

Polaris Tokens v5.0.0 features an overhaul of the package and the APIs for accessing tokens. Documentation on all of the available tokens can be found at polaris.shopify.com/tokens/getting-started-with-tokens.

The Sass variables, maps, functions, mixins, and CSS Filters have all been removed. In addition to deprecating access to tokens via the Rails assets pipelines. This new version leverages JavaScript objects for each Token Group which are passed through various build transforms to compose the distributed artifacts.

This new version standardizes the token naming across all of the package outputs. Each token is formatted in kebab-case following common CSS variable name conventions.

Bug fixes

• Fixed documentation example for ComboBox (#5622)

Bug fixes

• Fixed default Pip color in Badge (#5616)