v5.2.0

5.2.0 (2023-08-10)

Features

• add Disclosure component (#796) (df1eefd)
• export hook useActionHandlers (#836) (1ee8f3c)
• hooks: export useUniqId hook (#880) (a329789)
• Pagination: add className prop (#803) (b0cc6cd)
• Persona: add style prop (#855) (5d455e6)
• Persona: extend text property (#876) (84f31df)
• Popover: add props to improve accessibility (#868) (8d2bf81)
• Select.SelectPopup: add width modes (#854) (d4ccfcf)
• Select: add renderOptionGroup, getOptionGroupHeight props (#828) (7f93637)
• Select: loading indicator (#761) (aa1a963)
• Select: selected values appearance (#848) (17e11f6)

Bug Fixes

• add menu-item-content-children class name (#839) (4519ea5)
• Disclosure: readme (#852) (6065c56)
• Label: actions icon size fix (#851) (1bce6e4)
• Menu: set properly QA attributes names (#844) (b3a9f1e)
• Select: disable option selection (#870) (09c2e7d)
• Select: do not show cursor:pointer on control when Select is disabled (#874) (5d7c8b4)
• Select: popup width fit mode with identation (#873) (61a4c9a)
• TextArea: fix incorrect type (#867) (831bf5f)
• useRestoreFocus: correctly set current restore element (#865) (35bc0d5)

v5.1.0

5.1.0 (2023-07-20)

Features

• LayerManager: export getLayersCount (#830) (2ce4304)

Bug Fixes

• Table: remove redundant height with enabled sorting (#826) (c5c09b6)

v5.0.2

5.0.2 (2023-07-18)

Bug Fixes

• Card: prevent keyboard handler form abort (#825) (273d316)

v5.0.1

5.0.1 (2023-07-17)

Bug Fixes

• fix color palette (#823) (bb77d87)

v5.0.0

5.0.0 (2023-07-14)

⚠️ Breaking Changes

Components

• These components are moved to @gravity-ui/components repo: ChangelogDialog, Stories, StoriesGroup, HelpPopover, SharePopover, PromoSheet, StoreBadge
• Toast: removed deprecated prop isOverride
• Popup: prop className is now assigned to the root node, added new contentClassName for content node
• SharePopover: removed deprecated prop handleMetrika
• SharePopover: prop tooltipClassName is now named tooltipContentClassName
• Label: removed prop style, use theme variables for overriding border radius. Later style may be used for CSSObjectProperties
• Progress: view prop is replaced by size with new values (m, s, xs)
• Button: updated component layout
• Button: selected state supported for all views
• Popover: used div instead of span on trigger node
• Popover: prop tooltipClassName is now named tooltipContentClassName
• TextInput: component split into TextInput and TextArea

Theme

• useTheme: now only returns theme string, without setter
• useThemeSettings: now only returns theme setting object, without setter

The only way to change theme or theme settings now is to provide new props to the ThemeProvider component

CSS

• Color palette updated with new colors, including main accent color, which is now yellow instead of blue. Read “Branding” section of Storybook to apply color customization

• removed --yc-*-my-* vars, use plain vars directly:

  Old Variable	New Variable
  --yc-my-scrollbar-width	--g-scrollbar-width
  --yc-my-border-radius-s	--g-border-radius-s
  --yc-my-border-radius-m	--g-border-radius-m
  --yc-my-border-radius-l	--g-border-radius-l
  --yc-my-border-radius-xl	--g-border-radius-xl
  --yc-my-color-brand-normal	--g-color-base-brand
  --yc-my-color-brand-normal-hover	--g-color-base-brand-hover
  --yc-my-color-brand-light	No alternative
  --yc-my-color-brand-selection	--g-color-base-selection
  --yc-my-color-brand-selection-hover	--g-color-base-selection-hover
  --yc-my-color-brand-text	--g-color-text-brand
  --yc-my-color-brand-text-contrast	--g-color-text-brand-contrast
  --yc-my-color-brand-link	--g-color-text-link
  --yc-my-color-brand-link-hover	--g-color-text-link-hover
  --yc-my-color-brand-link-visited	--g-color-text-link-visited
  --yc-my-color-brand-link-visited-hover	--g-color-text-link-visited-hover

• removed --yc-color-promo-* vars. If you need different non-semantic colors, define them by yourself

• removed “social” color vars (facebook, twitter, telegram, …)

• renamed brand variables:

  Old Variable	New Variable
  --yc-color-brand-normal	--g-color-base-brand
  --yc-color-brand-normal-hover	--g-color-base-brand-hover
  --yc-color-brand-light	No alternative
  --yc-color-brand-selection	--g-color-base-selection
  --yc-color-brand-selection-hover	--g-color-base-selection-hover
  --yc-color-brand-link	--g-color-text-link
  --yc-color-brand-link-hover	--g-color-text-link-hover
  --yc-color-brand-link-visited	--g-color-text-link-visited
  --yc-color-brand-link-visited-hover	--g-color-text-link-visited-hover
  --yc-color-brand-text	--g-color-text-brand
  --yc-color-brand-text-contrast	--g-color-text-brand-contrast

⌛️ Deprecations

• All --yc-* variables will be removed in the next major update. For almost all variables it is enough to change prefix to the --g-*, except for the variables below, which will be replaced by the new ones.

  Old Variable	New Variable
  --yc-color-base-special	--g-color-base-brand
  --yc-color-base-special-hover	--g-color-base-brand-hover
  --yc-color-base-action	--g-color-base-brand
  --yc-color-base-action-hover	--g-color-base-brand-hover
  --yc-color-base-info	--g-color-base-info-light
  --yc-color-base-info-hover	--g-color-base-info-light-hover
  --yc-color-base-positive	--g-color-base-positive-light
  --yc-color-base-positive-hover	--g-color-base-positive-light-hover
  --yc-color-base-warning	--g-color-base-warning-light
  --yc-color-base-warning-hover	--g-color-base-warning-light-hover
  --yc-color-base-danger	--g-color-base-danger-light
  --yc-color-base-danger-hover	--g-color-base-danger-light-hover
  --yc-color-base-misc	--g-color-base-misc-light
  --yc-color-base-misc-hover	--g-color-base-misc-light-hover
  --yc-color-base-neutral	--g-color-base-neutral-light
  --yc-color-base-neutral-hover	--g-color-base-neutral-light-hover
  --yc-color-text-special	--g-color-text-brand
  --yc-color-line-selection-hover	No alternative
  --yc-color-line-selection-active	--g-color-line-brand
  --yc-color-line-link	--g-color-line-brand
  --yc-color-line-hint	--g-color-line-brand
  --yc-color-line-solid	--g-color-line-generic-solid
  --yc-color-text-yandex-red	No alternative
  --yc-color-infographics-*-{light|medium|heavy}	--g-color-base-*-{light|medium|heavy}
  --yc-alert-*	No alternative
  --yc-button-*	No alternative
  --yc-card-*	No alternative
  --yc-dialog-*	No alternative
  --yc-list-*	No alternative
  --yc-modal-*	No alternative
  --yc-popover-*	No alternative
  --yc-popup-*	No alternative
  --yc-radio-button-*	No alternative
  --yc-sheet-*	No alternative
  --yc-tab-*	No alternative
  --yc-tabs-*	No alternative
  --yc-toast-*	No alternative
  --yc-toaster-*	No alternative

--yc-{alert|button|...} variables are always considered as private. Consider using props and if it's not possible, open the issue and describe your use case.

🚀 Features

• All icons used in the components are now from @gravity-ui/icons package
• Size of xs border radius is changed from 5px to 3px
• Updated most of semantic colors
• Tooltip: visible state is toggled on focus/blur events as well
• Button: added new views: outlined-action, flat-action, outlined-success, flat-success, outlined-warning, flat-warning

v4.24.0

4.24.0 (2023-07-14)

Features

• ArrowToggle: use icon from gravity-ui/icons (#811) (7113923)

Bug Fixes

• Hotkey: setting a key property of a span in Hotkey's content (#813) (d7aa609)
• LayerManager: ignore clicks on Toast (#792) (ba7d7b0)
• useListNavigation: remove navigation with right and left arrows (#817) (0aab910)

v4.23.0

4.23.0 (2023-07-07)

Features

• Button: use aria-pressed attribute for selected (#799) (36490a9)
• Card: added accessibility via keyboard (#771) (24113e3)
• Toaster: new look (#746) (5a9054e)

v4.22.1

4.22.1 (2023-07-03)

Bug Fixes

• Label: use proper Button size (#776) (81395ad)
• Select: fix vertical align for SelectControl (#790) (0abdc4a)

v4.22.0

4.22.0 (2023-06-30)

Features

• SelectFilter: pass styles to renderFilter and remove wrapper (#786) (29a6d3b)

v4.21.4

4.21.4 (2023-06-29)

Bug Fixes

• Select: fix selectControl height & bg hover style (#784) (f2fa9e9)