@gravity-ui/navigation 5.0.0 → 6.0.0-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/cjs/assets/icons/{divider-collapsed-compact.svg.js → control-menu-button.svg.js} +7 -7
- package/build/cjs/assets/icons/control-menu-button.svg.js.map +1 -0
- package/build/cjs/components/AsideHeader/AsideHeader.css +1 -1
- package/build/cjs/components/AsideHeader/AsideHeader.js +3 -3
- package/build/cjs/components/AsideHeader/AsideHeader.js.map +1 -1
- package/build/cjs/components/AsideHeader/AsideHeader.module.scss.js +1 -1
- package/build/cjs/components/AsideHeader/AsideHeaderContext.d.ts +4 -28
- package/build/cjs/components/AsideHeader/AsideHeaderContext.js +8 -9
- package/build/cjs/components/AsideHeader/AsideHeaderContext.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.css +1 -0
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.d.ts +12 -0
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.js +44 -0
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.js.map +1 -0
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.module.scss.js +8 -0
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.module.scss.js.map +1 -0
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/index.d.ts +1 -0
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.css +1 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.js +45 -103
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.module.scss.js +1 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/constants.d.ts +0 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/constants.js +0 -2
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/constants.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/i18n/en.json.js +1 -0
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/i18n/en.json.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/i18n/index.d.ts +4 -4
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/i18n/ru.json.js +1 -0
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/i18n/ru.json.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/index.d.ts +1 -0
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/useGroupedMenuItems.d.ts +4 -3
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/useGroupedMenuItems.js +15 -67
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/useGroupedMenuItems.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/useVisibleMenuItems.d.ts +2 -0
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/useVisibleMenuItems.js +29 -0
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/useVisibleMenuItems.js.map +1 -0
- package/build/cjs/components/AsideHeader/components/CollapseButton/CollapseButton.css +1 -1
- package/build/cjs/components/AsideHeader/components/CollapseButton/CollapseButton.d.ts +1 -2
- package/build/cjs/components/AsideHeader/components/CollapseButton/CollapseButton.js +11 -16
- package/build/cjs/components/AsideHeader/components/CollapseButton/CollapseButton.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/CollapseButton/CollapseButton.module.scss.js +1 -1
- package/build/cjs/components/AsideHeader/components/CompositeBar/CompositeBar.css +1 -1
- package/build/cjs/components/AsideHeader/components/CompositeBar/CompositeBar.d.ts +10 -34
- package/build/cjs/components/AsideHeader/components/CompositeBar/CompositeBar.js +51 -75
- package/build/cjs/components/AsideHeader/components/CompositeBar/CompositeBar.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/CompositeBar/CompositeBar.module.scss.js +1 -1
- package/build/cjs/components/AsideHeader/components/CompositeBar/HighlightedItem/HighlightedItem.css +1 -1
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/Item.css +1 -25
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/Item.d.ts +1 -17
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/Item.js +73 -60
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/Item.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/Item.module.scss.js +1 -1
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/Item.types.d.ts +20 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/ItemPopup.d.ts +18 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/ItemPopup.js +45 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/ItemPopup.js.map +1 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/ItemPopupNestContext.d.ts +5 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/ItemPopupNestContext.js +8 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/ItemPopupNestContext.js.map +1 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/renderItemTitle.d.ts +3 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/renderItemTitle.js +19 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/Item/renderItemTitle.js.map +1 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.css +1 -1
- package/build/cjs/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.d.ts +4 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.js +9 -12
- package/build/cjs/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.module.scss.js +1 -1
- package/build/cjs/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollableScrollbarSync.d.ts +27 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollableScrollbarSync.js +171 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollableScrollbarSync.js.map +1 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/grouping.d.ts +11 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/grouping.js +68 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/grouping.js.map +1 -0
- package/build/cjs/components/AsideHeader/components/CompositeBar/utils.d.ts +21 -5
- package/build/cjs/components/AsideHeader/components/CompositeBar/utils.js +104 -55
- package/build/cjs/components/AsideHeader/components/CompositeBar/utils.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/FirstPanel.js +20 -45
- package/build/cjs/components/AsideHeader/components/FirstPanel.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/FooterItem/FooterItem.css +1 -1
- package/build/cjs/components/AsideHeader/components/FooterItem/FooterItem.d.ts +0 -2
- package/build/cjs/components/AsideHeader/components/FooterItem/FooterItem.js +1 -12
- package/build/cjs/components/AsideHeader/components/FooterItem/FooterItem.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/FooterItem/FooterItem.module.scss.js +1 -1
- package/build/cjs/components/AsideHeader/components/Header.js +4 -13
- package/build/cjs/components/AsideHeader/components/Header.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/PageLayout/AsideFallback.css +1 -1
- package/build/cjs/components/AsideHeader/components/PageLayout/AsideFallback.js +3 -3
- package/build/cjs/components/AsideHeader/components/PageLayout/AsideFallback.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/PageLayout/PageLayout.css +1 -1
- package/build/cjs/components/AsideHeader/components/PageLayout/PageLayout.d.ts +1 -4
- package/build/cjs/components/AsideHeader/components/PageLayout/PageLayout.js +6 -18
- package/build/cjs/components/AsideHeader/components/PageLayout/PageLayout.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/PageLayout/PageLayoutAside.css +1 -1
- package/build/cjs/components/AsideHeader/components/PageLayout/PageLayoutAside.d.ts +1 -1
- package/build/cjs/components/AsideHeader/components/PageLayout/PageLayoutAside.js +2 -7
- package/build/cjs/components/AsideHeader/components/PageLayout/PageLayoutAside.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/Panels.d.ts +1 -1
- package/build/cjs/components/AsideHeader/components/Panels.js +3 -17
- package/build/cjs/components/AsideHeader/components/Panels.js.map +1 -1
- package/build/cjs/components/AsideHeader/i18n/en.json.js +1 -4
- package/build/cjs/components/AsideHeader/i18n/en.json.js.map +1 -1
- package/build/cjs/components/AsideHeader/i18n/index.d.ts +4 -4
- package/build/cjs/components/AsideHeader/i18n/ru.json.js +1 -4
- package/build/cjs/components/AsideHeader/i18n/ru.json.js.map +1 -1
- package/build/cjs/components/AsideHeader/index.d.ts +3 -3
- package/build/cjs/components/AsideHeader/types.d.ts +22 -39
- package/build/cjs/components/AsideHeader/types.js.map +1 -1
- package/build/cjs/components/AsideHeader/useAsideHeaderInnerContextValue.d.ts +1 -6
- package/build/cjs/components/AsideHeader/useAsideHeaderInnerContextValue.js +6 -41
- package/build/cjs/components/AsideHeader/useAsideHeaderInnerContextValue.js.map +1 -1
- package/build/cjs/components/Footer/desktop/Footer.js +1 -1
- package/build/cjs/components/Footer/desktop/Footer.js.map +1 -1
- package/build/cjs/components/Footer/mobile/Footer.js +1 -1
- package/build/cjs/components/Footer/mobile/Footer.js.map +1 -1
- package/build/cjs/components/HotkeysPanel/HotkeysPanel.d.ts +4 -2
- package/build/cjs/components/HotkeysPanel/HotkeysPanel.js +13 -2
- package/build/cjs/components/HotkeysPanel/HotkeysPanel.js.map +1 -1
- package/build/cjs/components/Logo/Logo.css +1 -1
- package/build/cjs/components/Logo/Logo.d.ts +3 -7
- package/build/cjs/components/Logo/Logo.js +6 -19
- package/build/cjs/components/Logo/Logo.js.map +1 -1
- package/build/cjs/components/Logo/Logo.module.scss.js +1 -1
- package/build/cjs/components/MobileHeader/BurgerMenu/BurgerCompositeBar/BurgerCompositeBar.css +1 -1
- package/build/cjs/components/MobileHeader/BurgerMenu/BurgerCompositeBar/BurgerCompositeBar.module.scss.js +1 -1
- package/build/cjs/components/MobileHeader/MobileHeader.d.ts +1 -1
- package/build/cjs/components/MobileHeader/MobileHeader.js +7 -7
- package/build/cjs/components/MobileHeader/MobileHeader.js.map +1 -1
- package/build/cjs/components/MobileHeader/types.d.ts +1 -1
- package/build/cjs/components/MobileLogo/MobileLogo.d.ts +1 -1
- package/build/cjs/components/MobileLogo/MobileLogo.js +2 -2
- package/build/cjs/components/MobileLogo/MobileLogo.js.map +1 -1
- package/build/cjs/components/constants.d.ts +5 -10
- package/build/cjs/components/constants.js +7 -17
- package/build/cjs/components/constants.js.map +1 -1
- package/build/cjs/components/types.d.ts +19 -15
- package/build/cjs/index.js +0 -4
- package/build/cjs/index.js.map +1 -1
- package/build/esm/assets/icons/{divider-collapsed-compact.svg.js → control-menu-button.svg.js} +7 -7
- package/build/esm/assets/icons/control-menu-button.svg.js.map +1 -0
- package/build/esm/components/AsideHeader/AsideHeader.css +1 -1
- package/build/esm/components/AsideHeader/AsideHeader.js +3 -3
- package/build/esm/components/AsideHeader/AsideHeader.js.map +1 -1
- package/build/esm/components/AsideHeader/AsideHeader.module.scss.js +1 -1
- package/build/esm/components/AsideHeader/AsideHeaderContext.d.ts +4 -28
- package/build/esm/components/AsideHeader/AsideHeaderContext.js +8 -9
- package/build/esm/components/AsideHeader/AsideHeaderContext.js.map +1 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.css +1 -0
- package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.d.ts +12 -0
- package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.js +42 -0
- package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.js.map +1 -0
- package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.module.scss.js +4 -0
- package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.module.scss.js.map +1 -0
- package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/index.d.ts +1 -0
- package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.css +1 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.js +46 -104
- package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.js.map +1 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.module.scss.js +1 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/constants.d.ts +0 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/constants.js +1 -2
- package/build/esm/components/AsideHeader/components/AllPagesPanel/constants.js.map +1 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/i18n/en.json.js +1 -0
- package/build/esm/components/AsideHeader/components/AllPagesPanel/i18n/en.json.js.map +1 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/i18n/index.d.ts +4 -4
- package/build/esm/components/AsideHeader/components/AllPagesPanel/i18n/ru.json.js +1 -0
- package/build/esm/components/AsideHeader/components/AllPagesPanel/i18n/ru.json.js.map +1 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/index.d.ts +1 -0
- package/build/esm/components/AsideHeader/components/AllPagesPanel/useGroupedMenuItems.d.ts +4 -3
- package/build/esm/components/AsideHeader/components/AllPagesPanel/useGroupedMenuItems.js +15 -67
- package/build/esm/components/AsideHeader/components/AllPagesPanel/useGroupedMenuItems.js.map +1 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/useVisibleMenuItems.d.ts +2 -0
- package/build/esm/components/AsideHeader/components/AllPagesPanel/useVisibleMenuItems.js +27 -0
- package/build/esm/components/AsideHeader/components/AllPagesPanel/useVisibleMenuItems.js.map +1 -0
- package/build/esm/components/AsideHeader/components/CollapseButton/CollapseButton.css +1 -1
- package/build/esm/components/AsideHeader/components/CollapseButton/CollapseButton.d.ts +1 -2
- package/build/esm/components/AsideHeader/components/CollapseButton/CollapseButton.js +13 -18
- package/build/esm/components/AsideHeader/components/CollapseButton/CollapseButton.js.map +1 -1
- package/build/esm/components/AsideHeader/components/CollapseButton/CollapseButton.module.scss.js +1 -1
- package/build/esm/components/AsideHeader/components/CompositeBar/CompositeBar.css +1 -1
- package/build/esm/components/AsideHeader/components/CompositeBar/CompositeBar.d.ts +10 -34
- package/build/esm/components/AsideHeader/components/CompositeBar/CompositeBar.js +55 -78
- package/build/esm/components/AsideHeader/components/CompositeBar/CompositeBar.js.map +1 -1
- package/build/esm/components/AsideHeader/components/CompositeBar/CompositeBar.module.scss.js +1 -1
- package/build/esm/components/AsideHeader/components/CompositeBar/HighlightedItem/HighlightedItem.css +1 -1
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/Item.css +1 -25
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/Item.d.ts +1 -17
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/Item.js +76 -63
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/Item.js.map +1 -1
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/Item.module.scss.js +1 -1
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/Item.types.d.ts +20 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/ItemPopup.d.ts +18 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/ItemPopup.js +43 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/ItemPopup.js.map +1 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/ItemPopupNestContext.d.ts +5 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/ItemPopupNestContext.js +6 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/ItemPopupNestContext.js.map +1 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/renderItemTitle.d.ts +3 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/renderItemTitle.js +17 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/Item/renderItemTitle.js.map +1 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.css +1 -1
- package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.d.ts +4 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.js +10 -13
- package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.js.map +1 -1
- package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.module.scss.js +1 -1
- package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollableScrollbarSync.d.ts +27 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollableScrollbarSync.js +169 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollableScrollbarSync.js.map +1 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/grouping.d.ts +11 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/grouping.js +65 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/grouping.js.map +1 -0
- package/build/esm/components/AsideHeader/components/CompositeBar/utils.d.ts +21 -5
- package/build/esm/components/AsideHeader/components/CompositeBar/utils.js +100 -55
- package/build/esm/components/AsideHeader/components/CompositeBar/utils.js.map +1 -1
- package/build/esm/components/AsideHeader/components/FirstPanel.js +21 -46
- package/build/esm/components/AsideHeader/components/FirstPanel.js.map +1 -1
- package/build/esm/components/AsideHeader/components/FooterItem/FooterItem.css +1 -1
- package/build/esm/components/AsideHeader/components/FooterItem/FooterItem.d.ts +0 -2
- package/build/esm/components/AsideHeader/components/FooterItem/FooterItem.js +1 -12
- package/build/esm/components/AsideHeader/components/FooterItem/FooterItem.js.map +1 -1
- package/build/esm/components/AsideHeader/components/FooterItem/FooterItem.module.scss.js +1 -1
- package/build/esm/components/AsideHeader/components/Header.js +5 -14
- package/build/esm/components/AsideHeader/components/Header.js.map +1 -1
- package/build/esm/components/AsideHeader/components/PageLayout/AsideFallback.css +1 -1
- package/build/esm/components/AsideHeader/components/PageLayout/AsideFallback.js +4 -4
- package/build/esm/components/AsideHeader/components/PageLayout/AsideFallback.js.map +1 -1
- package/build/esm/components/AsideHeader/components/PageLayout/PageLayout.css +1 -1
- package/build/esm/components/AsideHeader/components/PageLayout/PageLayout.d.ts +1 -4
- package/build/esm/components/AsideHeader/components/PageLayout/PageLayout.js +7 -19
- package/build/esm/components/AsideHeader/components/PageLayout/PageLayout.js.map +1 -1
- package/build/esm/components/AsideHeader/components/PageLayout/PageLayoutAside.css +1 -1
- package/build/esm/components/AsideHeader/components/PageLayout/PageLayoutAside.d.ts +1 -1
- package/build/esm/components/AsideHeader/components/PageLayout/PageLayoutAside.js +2 -7
- package/build/esm/components/AsideHeader/components/PageLayout/PageLayoutAside.js.map +1 -1
- package/build/esm/components/AsideHeader/components/Panels.d.ts +1 -1
- package/build/esm/components/AsideHeader/components/Panels.js +4 -18
- package/build/esm/components/AsideHeader/components/Panels.js.map +1 -1
- package/build/esm/components/AsideHeader/i18n/en.json.js +2 -4
- package/build/esm/components/AsideHeader/i18n/en.json.js.map +1 -1
- package/build/esm/components/AsideHeader/i18n/index.d.ts +4 -4
- package/build/esm/components/AsideHeader/i18n/ru.json.js +2 -4
- package/build/esm/components/AsideHeader/i18n/ru.json.js.map +1 -1
- package/build/esm/components/AsideHeader/index.d.ts +3 -3
- package/build/esm/components/AsideHeader/types.d.ts +22 -39
- package/build/esm/components/AsideHeader/types.js.map +1 -1
- package/build/esm/components/AsideHeader/useAsideHeaderInnerContextValue.d.ts +1 -6
- package/build/esm/components/AsideHeader/useAsideHeaderInnerContextValue.js +6 -41
- package/build/esm/components/AsideHeader/useAsideHeaderInnerContextValue.js.map +1 -1
- package/build/esm/components/Footer/desktop/Footer.js +1 -1
- package/build/esm/components/Footer/desktop/Footer.js.map +1 -1
- package/build/esm/components/Footer/mobile/Footer.js +1 -1
- package/build/esm/components/Footer/mobile/Footer.js.map +1 -1
- package/build/esm/components/HotkeysPanel/HotkeysPanel.d.ts +4 -2
- package/build/esm/components/HotkeysPanel/HotkeysPanel.js +13 -2
- package/build/esm/components/HotkeysPanel/HotkeysPanel.js.map +1 -1
- package/build/esm/components/Logo/Logo.css +1 -1
- package/build/esm/components/Logo/Logo.d.ts +3 -7
- package/build/esm/components/Logo/Logo.js +6 -19
- package/build/esm/components/Logo/Logo.js.map +1 -1
- package/build/esm/components/Logo/Logo.module.scss.js +1 -1
- package/build/esm/components/MobileHeader/BurgerMenu/BurgerCompositeBar/BurgerCompositeBar.css +1 -1
- package/build/esm/components/MobileHeader/BurgerMenu/BurgerCompositeBar/BurgerCompositeBar.module.scss.js +1 -1
- package/build/esm/components/MobileHeader/MobileHeader.d.ts +1 -1
- package/build/esm/components/MobileHeader/MobileHeader.js +8 -8
- package/build/esm/components/MobileHeader/MobileHeader.js.map +1 -1
- package/build/esm/components/MobileHeader/types.d.ts +1 -1
- package/build/esm/components/MobileLogo/MobileLogo.d.ts +1 -1
- package/build/esm/components/MobileLogo/MobileLogo.js +2 -2
- package/build/esm/components/MobileLogo/MobileLogo.js.map +1 -1
- package/build/esm/components/constants.d.ts +5 -10
- package/build/esm/components/constants.js +6 -11
- package/build/esm/components/constants.js.map +1 -1
- package/build/esm/components/types.d.ts +19 -15
- package/build/esm/index.js +1 -2
- package/build/esm/index.js.map +1 -1
- package/codemods/bin/cli.js +6 -19
- package/codemods/transforms/unifyInterfaces.ts +0 -1
- package/package.json +4 -3
- package/build/cjs/assets/icons/divider-collapsed-compact.svg.js.map +0 -1
- package/build/cjs/components/AsideHeader/FooterLayoutContext.d.ts +0 -7
- package/build/cjs/components/AsideHeader/FooterLayoutContext.js +0 -10
- package/build/cjs/components/AsideHeader/FooterLayoutContext.js.map +0 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/buildExpandedFromFlatList.d.ts +0 -3
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/buildExpandedFromFlatList.js +0 -17
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/buildExpandedFromFlatList.js.map +0 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/getExpandedIndexForSortableIndex.d.ts +0 -9
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/getExpandedIndexForSortableIndex.js +0 -27
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/getExpandedIndexForSortableIndex.js.map +0 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/getIsMenuItem.d.ts +0 -2
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/getIsMenuItem.js +0 -13
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/getIsMenuItem.js.map +0 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/getRealIndexInGroup.d.ts +0 -73
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/getRealIndexInGroup.js +0 -144
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/getRealIndexInGroup.js.map +0 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/sortMenuItemsWithDividers.d.ts +0 -5
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/sortMenuItemsWithDividers.js +0 -45
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/utils/sortMenuItemsWithDividers.js.map +0 -1
- package/build/cjs/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollbar.d.ts +0 -21
- package/build/cjs/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollbar.js +0 -146
- package/build/cjs/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollbar.js.map +0 -1
- package/build/cjs/components/AsideHeader/components/FooterBar/FooterBar.css +0 -1
- package/build/cjs/components/AsideHeader/components/FooterBar/FooterBar.d.ts +0 -19
- package/build/cjs/components/AsideHeader/components/FooterBar/FooterBar.js +0 -95
- package/build/cjs/components/AsideHeader/components/FooterBar/FooterBar.js.map +0 -1
- package/build/cjs/components/AsideHeader/components/FooterBar/FooterBar.module.scss.js +0 -8
- package/build/cjs/components/AsideHeader/components/FooterBar/FooterBar.module.scss.js.map +0 -1
- package/build/cjs/components/AsideHeader/components/FooterBar/constants.d.ts +0 -1
- package/build/cjs/components/AsideHeader/components/FooterBar/constants.js +0 -6
- package/build/cjs/components/AsideHeader/components/FooterBar/constants.js.map +0 -1
- package/build/cjs/components/AsideHeader/components/FooterBar/index.d.ts +0 -1
- package/build/cjs/components/AsideHeader/hooks/useDelayedToggle.d.ts +0 -6
- package/build/cjs/components/AsideHeader/hooks/useDelayedToggle.js +0 -57
- package/build/cjs/components/AsideHeader/hooks/useDelayedToggle.js.map +0 -1
- package/build/cjs/components/AsideHeader/hooks/useIsExpanded.d.ts +0 -9
- package/build/cjs/components/AsideHeader/hooks/useIsExpanded.js +0 -67
- package/build/cjs/components/AsideHeader/hooks/useIsExpanded.js.map +0 -1
- package/build/cjs/components/AsideHeader/utils/getGroupHeight.d.ts +0 -2
- package/build/cjs/components/AsideHeader/utils/getGroupHeight.js +0 -16
- package/build/cjs/components/AsideHeader/utils/getGroupHeight.js.map +0 -1
- package/build/cjs/components/utils/getCollapsedWidth.d.ts +0 -1
- package/build/cjs/components/utils/getCollapsedWidth.js +0 -10
- package/build/cjs/components/utils/getCollapsedWidth.js.map +0 -1
- package/build/esm/assets/icons/divider-collapsed-compact.svg.js.map +0 -1
- package/build/esm/components/AsideHeader/FooterLayoutContext.d.ts +0 -7
- package/build/esm/components/AsideHeader/FooterLayoutContext.js +0 -7
- package/build/esm/components/AsideHeader/FooterLayoutContext.js.map +0 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/buildExpandedFromFlatList.d.ts +0 -3
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/buildExpandedFromFlatList.js +0 -15
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/buildExpandedFromFlatList.js.map +0 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/getExpandedIndexForSortableIndex.d.ts +0 -9
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/getExpandedIndexForSortableIndex.js +0 -25
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/getExpandedIndexForSortableIndex.js.map +0 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/getIsMenuItem.d.ts +0 -2
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/getIsMenuItem.js +0 -11
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/getIsMenuItem.js.map +0 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/getRealIndexInGroup.d.ts +0 -73
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/getRealIndexInGroup.js +0 -136
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/getRealIndexInGroup.js.map +0 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/sortMenuItemsWithDividers.d.ts +0 -5
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/sortMenuItemsWithDividers.js +0 -43
- package/build/esm/components/AsideHeader/components/AllPagesPanel/utils/sortMenuItemsWithDividers.js.map +0 -1
- package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollbar.d.ts +0 -21
- package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollbar.js +0 -144
- package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollbar.js.map +0 -1
- package/build/esm/components/AsideHeader/components/FooterBar/FooterBar.css +0 -1
- package/build/esm/components/AsideHeader/components/FooterBar/FooterBar.d.ts +0 -19
- package/build/esm/components/AsideHeader/components/FooterBar/FooterBar.js +0 -93
- package/build/esm/components/AsideHeader/components/FooterBar/FooterBar.js.map +0 -1
- package/build/esm/components/AsideHeader/components/FooterBar/FooterBar.module.scss.js +0 -4
- package/build/esm/components/AsideHeader/components/FooterBar/FooterBar.module.scss.js.map +0 -1
- package/build/esm/components/AsideHeader/components/FooterBar/constants.d.ts +0 -1
- package/build/esm/components/AsideHeader/components/FooterBar/constants.js +0 -4
- package/build/esm/components/AsideHeader/components/FooterBar/constants.js.map +0 -1
- package/build/esm/components/AsideHeader/components/FooterBar/index.d.ts +0 -1
- package/build/esm/components/AsideHeader/hooks/useDelayedToggle.d.ts +0 -6
- package/build/esm/components/AsideHeader/hooks/useDelayedToggle.js +0 -55
- package/build/esm/components/AsideHeader/hooks/useDelayedToggle.js.map +0 -1
- package/build/esm/components/AsideHeader/hooks/useIsExpanded.d.ts +0 -9
- package/build/esm/components/AsideHeader/hooks/useIsExpanded.js +0 -65
- package/build/esm/components/AsideHeader/hooks/useIsExpanded.js.map +0 -1
- package/build/esm/components/AsideHeader/utils/getGroupHeight.d.ts +0 -2
- package/build/esm/components/AsideHeader/utils/getGroupHeight.js +0 -14
- package/build/esm/components/AsideHeader/utils/getGroupHeight.js.map +0 -1
- package/build/esm/components/utils/getCollapsedWidth.d.ts +0 -1
- package/build/esm/components/utils/getCollapsedWidth.js +0 -8
- package/build/esm/components/utils/getCollapsedWidth.js.map +0 -1
- package/codemods/transforms/compactToIsExpanded.ts +0 -345
- package/codemods/transforms/compactToPinned.ts +0 -135
- package/codemods/transforms/v5.ts +0 -36
|
@@ -1,25 +1 @@
|
|
|
1
|
-
.Item-module__gn-composite-bar-item___-pkx5{background:none;border:none;color:inherit;font:inherit;outline:inherit;text-decoration:inherit}.Item-module__gn-composite-bar-item___-pkx5:focus-visible{outline:solid var(--g-color-line-misc);outline-offset:-2px}.Item-module__gn-composite-bar-item___-pkx5{--gn-composite-bar-item-action-size:var(--_--item-height);--_--horizontal-divider-line-color:var(--g-color-line-generic);--_--item-background-color-hover:var(--g-color-base-simple-hover);--_--item-general-icon-color:var(--g-color-text-primary);--_--item-icon-color:var(--g-color-text-complementary);--_--item-text-color:var(--g-color-text-primary);--_--item-collapsed-radius:7px;--_--item-action-color:var(--g-color-base-float);--_--item-action-color-hover:var(--g-color-base-float-hover);--_--item-selected-text-color:var(--g-color-text-primary);--_--item-selected-background-color:var(--g-color-base-selection);--_--zone-bg:transparent;--_--zone-bg-hover:var(
|
|
2
|
-
--gn-aside-header-item-background-color-hover,var(--_--item-background-color-hover)
|
|
3
|
-
);--_--zone-current-bg:var(
|
|
4
|
-
--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color)
|
|
5
|
-
);--_--zone-current-bg-hover:var(
|
|
6
|
-
--gn-aside-header-item-current-background-color-hover,var(--_--zone-current-bg)
|
|
7
|
-
);align-items:center;cursor:pointer;display:flex;height:var(--_--item-height,36px);min-width:0;padding:0;width:100%}.gn-composite-bar_subheader .Item-module__gn-composite-bar-item___-pkx5{--_--zone-bg:var(--gn-aside-top-item-background-color,transparent);--_--zone-bg-hover:var(
|
|
8
|
-
--gn-aside-top-item-background-color-hover,var(--_--item-background-color-hover)
|
|
9
|
-
);--_--zone-current-bg:var(
|
|
10
|
-
--gn-aside-top-item-current-background-color,var(--_--item-selected-background-color)
|
|
11
|
-
);--_--zone-current-bg-hover:var(
|
|
12
|
-
--gn-aside-top-item-current-background-color-hover,var(--_--zone-current-bg)
|
|
13
|
-
)}.gn-composite-bar__menu-group_wrapper .Item-module__gn-composite-bar-item___-pkx5{--_--zone-bg-hover:var(
|
|
14
|
-
--gn-aside-main-group-item-background-color-hover,var(--_--item-background-color-hover)
|
|
15
|
-
);--_--zone-current-bg:var(
|
|
16
|
-
--gn-aside-main-group-item-current-background-color,var(--_--item-selected-background-color)
|
|
17
|
-
);--_--zone-current-bg-hover:var(
|
|
18
|
-
--gn-aside-main-group-item-current-background-color-hover,var(--_--zone-current-bg)
|
|
19
|
-
)}.gn-footer-item .Item-module__gn-composite-bar-item___-pkx5{--_--zone-bg-hover:var(
|
|
20
|
-
--gn-aside-bottom-item-background-color-hover,var(--_--item-background-color-hover)
|
|
21
|
-
);--_--zone-current-bg:var(
|
|
22
|
-
--gn-aside-bottom-item-current-background-color,var(--_--item-selected-background-color)
|
|
23
|
-
);--_--zone-current-bg-hover:var(
|
|
24
|
-
--gn-aside-bottom-item-current-background-color-hover,var(--_--zone-current-bg)
|
|
25
|
-
)}.Item-module__gn-composite-bar-item___-pkx5.Item-module__gn-composite-bar-item_type_regular___wkhsT{background-color:var(--_--zone-bg)}.Item-module__gn-composite-bar-item___-pkx5.Item-module__gn-composite-bar-item_type_regular___wkhsT .Item-module__gn-composite-bar-item__btn-icon___SwT65{background-color:transparent;position:relative}.Item-module__gn-composite-bar-item___-pkx5.Item-module__gn-composite-bar-item_type_regular___wkhsT .Item-module__gn-composite-bar-item__btn-icon___SwT65:before{border-radius:var(--gn-aside-header-item-collapsed-radius,var(--_--item-collapsed-radius));content:"";height:var(--_--item-height);left:50%;margin-left:calc(var(--_--item-height)/-2);margin-top:calc(var(--_--item-height)/-2);position:absolute;top:50%;width:var(--_--item-height);z-index:-1}.Item-module__gn-composite-bar-item___-pkx5.Item-module__gn-composite-bar-item_current___NT2hB.Item-module__gn-composite-bar-item_type_regular___wkhsT{background-color:var(--_--zone-current-bg)}.Item-module__gn-composite-bar-item___-pkx5:hover.Item-module__gn-composite-bar-item_type_regular___wkhsT{background-color:var(--_--zone-current-bg-hover)}.Item-module__gn-composite-bar-item___-pkx5:not(.Item-module__gn-composite-bar-item_current___NT2hB):hover.Item-module__gn-composite-bar-item_type_regular___wkhsT{background-color:var(--_--zone-bg-hover)}.Item-module__gn-composite-bar-item__icon-place___jPKRh{align-items:center;color:var(--gn-aside-header-item-icon-color,var(--_--item-icon-color));display:flex;flex-shrink:0;height:100%;justify-content:center;width:var(--_--item-height,36px)}.Item-module__gn-composite-bar-item_current___NT2hB .Item-module__gn-composite-bar-item__icon-place___jPKRh{color:var(--gn-aside-main-group-item-current-background-color,var(--gn-aside-header-item-current-icon-color,var(--gn-aside-header-item-icon-color,var(--_--item-icon-color))))}.gn-composite-bar-highlighted-item .Item-module__gn-composite-bar-item__icon-place___jPKRh{color:var(--gn-aside-header-general-item-icon-color,var(--_--item-general-icon-color))}.gn-composite-bar-highlighted-item .Item-module__gn-composite-bar-item_current___NT2hB .Item-module__gn-composite-bar-item__icon-place___jPKRh{color:var(--gn-aside-header-item-current-icon-color,var(--gn-aside-header-general-item-icon-color,var(--_--item-general-icon-color)))}.gn-composite-bar_subheader .Item-module__gn-composite-bar-item__icon-place___jPKRh{color:var(--gn-aside-top-item-icon-color,var(--gn-aside-header-general-item-icon-color,var(--_--item-general-icon-color)))}.gn-composite-bar_subheader .Item-module__gn-composite-bar-item_current___NT2hB .Item-module__gn-composite-bar-item__icon-place___jPKRh{color:var(--gn-aside-top-item-current-icon-color,var(--gn-aside-header-item-current-icon-color,var(--gn-aside-header-general-item-icon-color,var(--_--item-general-icon-color))))}.gn-footer-item .Item-module__gn-composite-bar-item__icon-place___jPKRh{color:var(--gn-aside-bottom-item-icon-color,var(--gn-aside-header-general-item-icon-color,var(--_--item-general-icon-color)))}.gn-footer-item .Item-module__gn-composite-bar-item_current___NT2hB .Item-module__gn-composite-bar-item__icon-place___jPKRh{color:var(--gn-aside-bottom-item-current-icon-color,var(--gn-aside-header-item-current-icon-color,var(--_--item-general-icon-color)))}.Item-module__gn-composite-bar-item__title___wj5L5{align-items:center;display:flex;justify-content:space-between;margin:0 var(--g-spacing-4) 0 var(--g-spacing-2);overflow:hidden}.Item-module__gn-composite-bar-item__transition-title-enter-active___AAvSZ, .Item-module__gn-composite-bar-item__transition-title-enter___4n6yR{opacity:0}.Item-module__gn-composite-bar-item__transition-title-enter-done___Ilzkv, .Item-module__gn-composite-bar-item__transition-title-exit___5-JKk{opacity:1;transition:opacity 50ms ease-in-out}.Item-module__gn-composite-bar-item__transition-title-exit-active___Dif7T, .Item-module__gn-composite-bar-item__transition-title-exit-done___PJvzY{opacity:0}.Item-module__gn-composite-bar-item__visibility-button___QaJg-{margin-left:auto}.Item-module__gn-composite-bar-item__title-text___cILJo{-webkit-box-orient:vertical;-webkit-line-clamp:2;color:var(--gn-aside-header-item-text-color,var(--_--item-text-color));display:-webkit-box;font-size:var(--g-text-body-short-font-size);line-height:var(--g-text-body-short-line-height);overflow:hidden;text-align:start}.Item-module__gn-composite-bar-item_current___NT2hB .Item-module__gn-composite-bar-item__title-text___cILJo{color:var(--gn-aside-header-item-current-text-color,var(--_--item-selected-text-color))}.gn-composite-bar_subheader .Item-module__gn-composite-bar-item__title-text___cILJo{color:var(--gn-aside-top-item-text-color,var(--_--item-text-color))}.gn-composite-bar_subheader .Item-module__gn-composite-bar-item_current___NT2hB .Item-module__gn-composite-bar-item__title-text___cILJo{color:var(--gn-aside-top-item-current-text-color,var(--_--item-selected-text-color))}.gn-footer-item .Item-module__gn-composite-bar-item__title-text___cILJo{color:var(--gn-aside-bottom-item-text-color,var(--_--item-text-color))}.gn-footer-item .Item-module__gn-composite-bar-item_current___NT2hB .Item-module__gn-composite-bar-item__title-text___cILJo{color:var(--gn-aside-bottom-item-current-text-color,var(--_--item-selected-text-color))}.Item-module__gn-composite-bar-item__title-adornment___Xcopn{margin:0 10px}.Item-module__gn-composite-bar-item__collapse-item___Up6IX{background:none;border:none;color:inherit;font:inherit;outline:inherit;text-decoration:inherit}.Item-module__gn-composite-bar-item__collapse-item___Up6IX:focus-visible{outline:solid var(--g-color-line-misc);outline-offset:-2px}.Item-module__gn-composite-bar-item__collapse-item___Up6IX{--_--item-icon-color:var(--g-color-text-misc);align-items:center;cursor:pointer;display:flex;height:100%;padding:0 16px;width:100%}.Item-module__gn-composite-bar-item__collapse-item-icon___CD-ao{color:var(--gn-aside-header-item-icon-color,var(--_--item-icon-color));margin-right:10px}.Item-module__gn-composite-bar-item__collapse-item___Up6IX .Item-module__gn-composite-bar-item__title-adornment___Xcopn{margin-right:0}.Item-module__gn-composite-bar-item__menu-divider___hkm-Z{border-top:1px solid var(--gn-aside-header-divider-horizontal-color,var(--_--horizontal-divider-line-color));cursor:default;margin:0 10px;width:100%}.Item-module__gn-composite-bar-item__collapse-items-popup-content___a82to{padding:4px 0}.Item-module__gn-composite-bar-item__link___McAVN{align-items:center;display:flex;height:100%;width:100%}.Item-module__gn-composite-bar-item__link___McAVN, .Item-module__gn-composite-bar-item__link___McAVN:active, .Item-module__gn-composite-bar-item__link___McAVN:focus, .Item-module__gn-composite-bar-item__link___McAVN:hover, .Item-module__gn-composite-bar-item__link___McAVN:visited{color:inherit;outline:none;text-decoration:none}.Item-module__gn-composite-bar-item__btn-icon___SwT65{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.Item-module__gn-composite-bar-item_type_action___2jxO8{background:var(--gn-aside-header-item-action-color,var(--_--item-action-color));border-radius:var(--gn-composite-bar-item-action-size);box-shadow:0 0 0 1px rgba(0,0,0,.03),0 5px 6px rgba(0,0,0,.12);height:var(--gn-composite-bar-item-action-size);justify-content:center;margin-bottom:var(--g-spacing-2);transition:transform .1s ease-out,background-color .15s linear}.Item-module__gn-composite-bar-item_type_action___2jxO8:focus-visible{box-shadow:0 0 0 2px var(--g-color-line-misc)}.Item-module__gn-composite-bar-item_type_action___2jxO8:hover{background-color:var(--gn-aside-header-item-action-color-hover,var(--_--item-action-color-hover))}.Item-module__gn-composite-bar-item_type_action___2jxO8:active{box-shadow:0 1px 2px var(--g-color-sfx-shadow);transform:scale(.96);transition:none}.Item-module__gn-composite-bar-item_type_action___2jxO8 .Item-module__gn-composite-bar-item__icon-place___jPKRh{width:var(--gn-composite-bar-item-action-size)}.Item-module__gn-composite-bar-item_type_action___2jxO8.gn-footer-item{width:calc(100% - var(--_--item-margin-inline)*2)}.Item-module__gn-composite-bar-item_collapsed___Ichlf.Item-module__gn-composite-bar-item_type_action___2jxO8{width:var(--gn-composite-bar-item-action-size)}.Item-module__gn-composite-bar-item_collapsed___Ichlf.Item-module__gn-composite-bar-item_type_action___2jxO8 .Item-module__gn-composite-bar-item__title___wj5L5{margin:0}
|
|
1
|
+
.Item-module__gn-composite-bar-item___-pkx5{background:none;border:none;color:inherit;font:inherit;outline:inherit;text-decoration:inherit}.Item-module__gn-composite-bar-item___-pkx5:focus-visible{outline:solid var(--g-color-line-misc);outline-offset:-2px}.Item-module__gn-composite-bar-item___-pkx5{--gn-composite-bar-item-action-size:36px;--gn-aside-header-item-expanded-radius:8px;--_--horizontal-divider-line-color:var(--g-color-line-generic);--_--item-background-color-hover:var(--g-color-base-simple-hover);--_--item-general-icon-color:var(--g-color-text-primary);--_--item-icon-color:var(--g-color-text-complementary);--_--item-text-color:var(--g-color-text-primary);--_--item-collapsed-radius:7px;--_--item-action-color:var(--g-color-base-float);--_--item-action-color-hover:var(--g-color-base-float-hover);--_--item-selected-text-color:var(--g-color-text-primary);--_--item-selected-background-color:var(--g-color-base-selection);align-items:center;cursor:pointer;display:flex;height:100%;margin-inline:auto;min-width:0;padding:0;width:100%}.Item-module__gn-composite-bar-item___-pkx5.gn-footer-item.Item-module__gn-composite-bar-item_type_regular___wkhsT{--gn-aside-header-item-icon-background-size:32px;height:32px}.Item-module__gn-composite-bar-item__icon___ORFNf{color:var(--gn-aside-header-item-icon-color,var(--_--item-icon-color))}.Item-module__gn-composite-bar-item_current___NT2hB .Item-module__gn-composite-bar-item__icon___ORFNf{color:var(--gn-aside-header-item-current-icon-color,var(--gn-aside-header-item-icon-color,var(--_--item-icon-color)))}.gn-composite-bar-highlighted-item .Item-module__gn-composite-bar-item__icon___ORFNf, .gn-composite-bar_subheader .Item-module__gn-composite-bar-item__icon___ORFNf, .gn-footer-item .Item-module__gn-composite-bar-item__icon___ORFNf{color:var(--gn-aside-header-general-item-icon-color,var(--_--item-general-icon-color))}.gn-composite-bar-highlighted-item .Item-module__gn-composite-bar-item_current___NT2hB .Item-module__gn-composite-bar-item__icon___ORFNf, .gn-composite-bar_subheader .Item-module__gn-composite-bar-item_current___NT2hB .Item-module__gn-composite-bar-item__icon___ORFNf, .gn-footer-item .Item-module__gn-composite-bar-item_current___NT2hB .Item-module__gn-composite-bar-item__icon___ORFNf{color:var(--gn-aside-header-item-current-icon-color,var(--gn-aside-header-general-item-icon-color,var(--_--item-general-icon-color)))}.Item-module__gn-composite-bar-item__icon-tooltip___PxU2i .Item-module__g-action-tooltip__description___UsHcG{color:var(--g-color-text-light-primary);margin-block-start:0}.Item-module__gn-composite-bar-item__icon-place___jPKRh{align-items:center;display:flex;flex-shrink:0;height:100%;justify-content:center;width:var(--_--item-height,40px)}.Item-module__gn-composite-bar-item__title___wj5L5{align-items:center;display:flex;margin:0 var(--g-spacing-4) 0 var(--g-spacing-2);overflow:hidden}.Item-module__gn-composite-bar-item__title-text___cILJo{-webkit-box-orient:vertical;-webkit-line-clamp:2;color:var(--gn-aside-header-item-text-color,var(--_--item-text-color));display:-webkit-box;overflow:hidden;text-align:start}.Item-module__gn-composite-bar-item_current___NT2hB .Item-module__gn-composite-bar-item__title-text___cILJo{color:var(--gn-aside-header-item-current-text-color,var(--_--item-selected-text-color))}.Item-module__gn-composite-bar-item__title-adornment___Xcopn{margin:0 10px}.Item-module__gn-composite-bar-item__collapse-item___Up6IX{background:none;border:none;color:inherit;font:inherit;outline:inherit;text-decoration:inherit}.Item-module__gn-composite-bar-item__collapse-item___Up6IX:focus-visible{outline:solid var(--g-color-line-misc);outline-offset:-2px}.Item-module__gn-composite-bar-item__collapse-item___Up6IX{--_--item-icon-color:var(--g-color-text-misc);align-items:center;cursor:pointer;display:flex;height:100%;padding:0 16px;width:100%}.Item-module__gn-composite-bar-item__collapse-item-icon___CD-ao{color:var(--gn-aside-header-item-icon-color,var(--_--item-icon-color));margin-right:10px}.Item-module__gn-composite-bar-item__collapse-item___Up6IX .Item-module__gn-composite-bar-item__title-adornment___Xcopn{margin-right:0}.Item-module__gn-composite-bar-item__menu-divider___hkm-Z{border-top:1px solid var(--gn-aside-header-divider-horizontal-color,var(--_--horizontal-divider-line-color));cursor:default;margin:0 8px;width:100%}.Item-module__gn-composite-bar-item__collapse-items-popup-content___a82to{padding:4px 0}.Item-module__gn-composite-bar-item__link___McAVN{align-items:center;display:flex;height:100%;width:100%}.Item-module__gn-composite-bar-item__link___McAVN, .Item-module__gn-composite-bar-item__link___McAVN:active, .Item-module__gn-composite-bar-item__link___McAVN:focus, .Item-module__gn-composite-bar-item__link___McAVN:hover, .Item-module__gn-composite-bar-item__link___McAVN:visited{color:inherit;outline:none;text-decoration:none}.Item-module__gn-composite-bar-item__btn-icon___SwT65{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.Item-module__gn-composite-bar-item_type_action___2jxO8{background:var(--gn-aside-header-item-action-color,var(--_--item-action-color));border-radius:var(--gn-composite-bar-item-action-size);box-shadow:0 0 0 1px rgba(0,0,0,.03),0 5px 6px rgba(0,0,0,.12);height:var(--gn-composite-bar-item-action-size);justify-content:center;margin:0 10px 8px;transition:transform .1s ease-out,background-color .15s linear}.Item-module__gn-composite-bar-item_type_action___2jxO8:focus-visible{box-shadow:0 0 0 2px var(--g-color-line-misc)}.Item-module__gn-composite-bar-item_type_action___2jxO8:hover{background-color:var(--gn-aside-header-item-action-color-hover,var(--_--item-action-color-hover))}.Item-module__gn-composite-bar-item_type_action___2jxO8:active{box-shadow:0 1px 2px var(--g-color-sfx-shadow);transform:scale(.96);transition:none}.Item-module__gn-composite-bar-item_type_action___2jxO8 .Item-module__gn-composite-bar-item__icon-place___jPKRh{width:var(--gn-composite-bar-item-action-size)}.Item-module__gn-composite-bar-item_type_action___2jxO8.gn-footer-item{width:calc(100% - 20px)}.Item-module__gn-composite-bar-item__icon-tooltip___PxU2i{align-items:center;box-sizing:border-box;display:flex;height:30px;padding:8px 12px}.Item-module__gn-composite-bar-item__icon-tooltip___PxU2i .g-action-tooltip__description{color:var(--g-color-text-light-primary);margin:0;margin-block:0}.Item-module__gn-composite-bar-item__icon-tooltip_item-type_action___HUhUR{margin-left:10px}.Item-module__gn-composite-bar-item__icon-popover___euq-P{align-items:center;border-radius:12px;box-sizing:border-box;display:flex;padding:var(--g-spacing-2)}.Item-module__gn-composite-bar-item__icon-popover_item-type_action___ep-D3{margin-left:10px}.Item-module__gn-composite-bar-item__popup-content___oys3t{border-radius:var(--gn-aside-header-item-expanded-radius);box-sizing:border-box;min-width:var(--gn-aside-header-size,240px)}.Item-module__gn-composite-bar-item__popup-content_collapsed___LGcy2{min-width:auto;width:var(--gn-aside-header-size,240px)}.Item-module__gn-composite-bar-item__popup-content___oys3t .Item-module__gn-composite-bar-item__root-menu-item___nlpvH[class]{background-color:transparent}.Item-module__gn-composite-bar-item__popup-title___2-tGd{color:var(--g-color-text-primary);font-size:var(--g-text-subheader-2-font-size);font-weight:var(--g-text-subheader-font-weight);line-height:var(--g-text-subheader-2-line-height);padding:var(--g-spacing-2) var(--g-spacing-2) 2px}.Item-module__gn-composite-bar-item__popup-item___MPgm3{box-sizing:border-box}.Item-module__gn-composite-bar-item__popup-item___MPgm3.Item-module__gn-composite-bar-item_type_regular___wkhsT{border-radius:var(--gn-aside-header-item-expanded-radius);height:32px}.Item-module__gn-composite-bar-item_hide-icon___bf5h3 .Item-module__gn-composite-bar-item__icon-place___jPKRh{display:none}.Item-module__gn-composite-bar-item_hide-icon___bf5h3 .Item-module__gn-composite-bar-item__title___wj5L5{margin-left:var(--g-spacing-4)}.Item-module__gn-composite-bar-item___-pkx5:not(.Item-module__gn-composite-bar-item_compact___PVTeM).Item-module__gn-composite-bar-item_current___NT2hB.Item-module__gn-composite-bar-item_type_regular___wkhsT{background-color:var(--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color));border-radius:var(--gn-aside-header-item-expanded-radius)}.Item-module__gn-composite-bar-item___-pkx5:not(.Item-module__gn-composite-bar-item_compact___PVTeM):hover.Item-module__gn-composite-bar-item_type_regular___wkhsT{background-color:var(--gn-aside-header-item-current-background-color-hover,var(--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color)));border-radius:var(--gn-aside-header-item-expanded-radius)}.Item-module__gn-composite-bar-item___-pkx5:not(.Item-module__gn-composite-bar-item_compact___PVTeM):not(.Item-module__gn-composite-bar-item_current___NT2hB):hover.Item-module__gn-composite-bar-item_type_regular___wkhsT{background-color:var(--gn-aside-header-item-background-color-hover,var(--_--item-background-color-hover));border-radius:var(--gn-aside-header-item-expanded-radius)}.Item-module__gn-composite-bar-item__chevron___ZZ-vf{align-items:center;display:flex;flex-shrink:0;margin-left:auto;margin-right:var(--g-spacing-1)}.Item-module__gn-composite-bar-item_compact___PVTeM .Item-module__gn-composite-bar-item__chevron___ZZ-vf{margin:0;position:absolute;right:8px}.Item-module__gn-composite-bar-item_compact___PVTeM .Item-module__gn-composite-bar-item__chevron___ZZ-vf svg{stroke:currentColor;stroke-width:1}.Item-module__gn-composite-bar-item_compact___PVTeM.Item-module__gn-composite-bar-item_type_action___2jxO8{width:var(--gn-composite-bar-item-action-size)}.Item-module__gn-composite-bar-item_compact___PVTeM.Item-module__gn-composite-bar-item_type_action___2jxO8 .Item-module__gn-composite-bar-item__title___wj5L5{margin:0}.Item-module__gn-composite-bar-item_compact___PVTeM.Item-module__gn-composite-bar-item_current___NT2hB.Item-module__gn-composite-bar-item_type_regular___wkhsT .Item-module__gn-composite-bar-item__btn-icon___SwT65{background-color:transparent;position:relative}.Item-module__gn-composite-bar-item_compact___PVTeM.Item-module__gn-composite-bar-item_current___NT2hB.Item-module__gn-composite-bar-item_type_regular___wkhsT .Item-module__gn-composite-bar-item__btn-icon___SwT65:before{background-color:var(--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color));border-radius:var(--gn-aside-header-item-collapsed-radius,var(--_--item-collapsed-radius));content:"";height:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));z-index:-1}.Item-module__gn-composite-bar-item_compact___PVTeM:hover.Item-module__gn-composite-bar-item_type_regular___wkhsT .Item-module__gn-composite-bar-item__btn-icon___SwT65{background-color:transparent;position:relative}.Item-module__gn-composite-bar-item_compact___PVTeM:hover.Item-module__gn-composite-bar-item_type_regular___wkhsT .Item-module__gn-composite-bar-item__btn-icon___SwT65:before{background-color:var(--gn-aside-header-item-current-background-color-hover,var(--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color)));border-radius:var(--gn-aside-header-item-collapsed-radius,var(--_--item-collapsed-radius));content:"";height:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));z-index:-1}.Item-module__gn-composite-bar-item_compact___PVTeM:not(.Item-module__gn-composite-bar-item_current___NT2hB):hover.Item-module__gn-composite-bar-item_type_regular___wkhsT .Item-module__gn-composite-bar-item__btn-icon___SwT65{background-color:transparent;position:relative}.Item-module__gn-composite-bar-item_compact___PVTeM:not(.Item-module__gn-composite-bar-item_current___NT2hB):hover.Item-module__gn-composite-bar-item_type_regular___wkhsT .Item-module__gn-composite-bar-item__btn-icon___SwT65:before{background-color:var(--gn-aside-header-item-background-color-hover,var(--_--item-background-color-hover));border-radius:var(--gn-aside-header-item-collapsed-radius,var(--_--item-collapsed-radius));content:"";height:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));z-index:-1}
|
|
@@ -1,19 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
export interface ItemProps extends AsideHeaderItem {
|
|
4
|
-
}
|
|
5
|
-
interface ItemInnerProps extends ItemProps {
|
|
6
|
-
/** Registers a temporary block on collapse (e.g. while dropdown is open). Returns release function. */
|
|
7
|
-
setCollapseBlocker?: SetCollapseBlocker;
|
|
8
|
-
/** When `true`, the item is displayed in expanded form. */
|
|
9
|
-
isExpanded?: boolean;
|
|
10
|
-
/** Layout mode: 'horizontal' shows icon only, 'vertical' shows icon and title. Used in FooterBar. */
|
|
11
|
-
layout?: 'horizontal' | 'vertical';
|
|
12
|
-
className?: string;
|
|
13
|
-
onMouseEnter?: () => void;
|
|
14
|
-
onMouseLeave?: () => void;
|
|
15
|
-
editMode?: boolean;
|
|
16
|
-
onToggleVisibility?: () => void;
|
|
17
|
-
}
|
|
2
|
+
import { ItemInnerProps } from './Item.types';
|
|
18
3
|
export declare const Item: React.FC<ItemInnerProps>;
|
|
19
|
-
export {};
|
|
@@ -1,61 +1,41 @@
|
|
|
1
1
|
import './Item.css';
|
|
2
2
|
import React__default from 'react';
|
|
3
|
-
import {
|
|
4
|
-
import { Icon,
|
|
5
|
-
import {
|
|
6
|
-
import { ASIDE_HEADER_ICON_SIZE, ASIDE_HEADER_EXPAND_TRANSITION_DELAY } from '../../../../constants.js';
|
|
3
|
+
import { ChevronRight } from '@gravity-ui/icons';
|
|
4
|
+
import { Icon, Popup } from '@gravity-ui/uikit';
|
|
5
|
+
import { ASIDE_HEADER_ICON_SIZE } from '../../../../constants.js';
|
|
7
6
|
import { createBlock } from '../../../../utils/cn.js';
|
|
8
7
|
import { HighlightedItem } from '../HighlightedItem/HighlightedItem.js';
|
|
9
|
-
import { ITEM_TYPE_REGULAR } from '../constants.js';
|
|
8
|
+
import { ITEM_TYPE_REGULAR, COLLAPSE_ITEM_ID } from '../constants.js';
|
|
9
|
+
import { isGroupHeaderItem } from '../grouping.js';
|
|
10
|
+
import { ItemPopup } from './ItemPopup.js';
|
|
11
|
+
import { ItemPopupNestContext } from './ItemPopupNestContext.js';
|
|
12
|
+
import { renderItemTitle } from './renderItemTitle.js';
|
|
10
13
|
import styles from './Item.module.scss.js';
|
|
11
14
|
|
|
12
15
|
const b = createBlock('composite-bar-item', styles);
|
|
13
|
-
const itemTransitionClasses = {
|
|
14
|
-
enter: b('transition-title-enter'),
|
|
15
|
-
enterActive: b('transition-title-enter-active'),
|
|
16
|
-
enterDone: b('transition-title-enter-done'),
|
|
17
|
-
exit: b('transition-title-exit'),
|
|
18
|
-
exitActive: b('transition-title-exit-active'),
|
|
19
|
-
exitDone: b('transition-title-exit-done'),
|
|
20
|
-
};
|
|
21
|
-
function renderItemTitle(params) {
|
|
22
|
-
let titleNode = React__default.createElement("div", { className: b('title-text') }, params.title);
|
|
23
|
-
if (params.rightAdornment) {
|
|
24
|
-
titleNode = (React__default.createElement(React__default.Fragment, null,
|
|
25
|
-
titleNode,
|
|
26
|
-
React__default.createElement("div", { className: b('title-adornment') }, params.rightAdornment)));
|
|
27
|
-
}
|
|
28
|
-
return titleNode;
|
|
29
|
-
}
|
|
30
16
|
const defaultPopupPlacement = ['right-end'];
|
|
31
|
-
const defaultPopupOffset = { mainAxis:
|
|
17
|
+
const defaultPopupOffset = { mainAxis: 14 };
|
|
18
|
+
const CHEVRON_SIZE = 16;
|
|
19
|
+
const CHEVRON_SIZE_COMPACT = 10;
|
|
32
20
|
const Item = (props) => {
|
|
33
|
-
const { className, onMouseLeave, onMouseEnter, popupVisible = false, popupRef: anchoreRefProp, popupPlacement = defaultPopupPlacement, popupOffset = defaultPopupOffset, popupKeepMounted, renderPopupContent, onOpenChangePopup, onItemClick, onItemClickCapture, itemWrapper, bringForward, rightAdornment, title, href, qa,
|
|
21
|
+
const { className, popupItemClassName, menuPopupItems, menuPopupTitle, compact, onMouseLeave, onMouseEnter, enableTooltip = true, popupVisible = false, popupRef: anchoreRefProp, popupPlacement = defaultPopupPlacement, popupOffset = defaultPopupOffset, popupKeepMounted, renderPopupContent, onOpenChangePopup, onItemClick, onItemClickCapture, itemWrapper, bringForward, rightAdornment, title, href, qa, hideIcon = false, stopClickPropagation = false, } = props;
|
|
22
|
+
const [compactNavPopoverOpen, setCompactNavPopoverOpen] = React__default.useState(false);
|
|
34
23
|
const ref = React__default.useRef(null);
|
|
35
24
|
const anchorRef = (anchoreRefProp === null || anchoreRefProp === undefined ? undefined : anchoreRefProp.current) ? anchoreRefProp : ref;
|
|
36
25
|
const highlightedRef = React__default.useRef(null);
|
|
37
|
-
React__default.useEffect(() => {
|
|
38
|
-
let didBlock = false;
|
|
39
|
-
if (popupVisible) {
|
|
40
|
-
didBlock = true;
|
|
41
|
-
setCollapseBlocker === null || setCollapseBlocker === undefined ? undefined : setCollapseBlocker(true);
|
|
42
|
-
}
|
|
43
|
-
return () => {
|
|
44
|
-
if (didBlock) {
|
|
45
|
-
setCollapseBlocker === null || setCollapseBlocker === undefined ? undefined : setCollapseBlocker(false);
|
|
46
|
-
}
|
|
47
|
-
};
|
|
48
|
-
}, [popupVisible, setCollapseBlocker]);
|
|
49
26
|
const type = props.type || ITEM_TYPE_REGULAR;
|
|
50
27
|
const current = props.current || false;
|
|
51
28
|
const icon = props.icon;
|
|
52
29
|
const iconSize = props.iconSize || ASIDE_HEADER_ICON_SIZE;
|
|
53
30
|
const iconQa = props.iconQa;
|
|
54
|
-
const
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
31
|
+
const collapsedItem = props.id === COLLAPSE_ITEM_ID;
|
|
32
|
+
const isGroupHeader = isGroupHeaderItem(props);
|
|
33
|
+
let resolvedMenuPopupItems = menuPopupItems;
|
|
34
|
+
let resolvedMenuPopupTitle = menuPopupTitle;
|
|
35
|
+
if (isGroupHeader) {
|
|
36
|
+
resolvedMenuPopupItems = menuPopupItems !== null && menuPopupItems !== undefined ? menuPopupItems : props.groupChildren;
|
|
37
|
+
resolvedMenuPopupTitle = menuPopupTitle !== null && menuPopupTitle !== undefined ? menuPopupTitle : props.groupPopupTitle;
|
|
38
|
+
}
|
|
59
39
|
const handleOpenChangePopup = React__default.useCallback((newOpen, event, reason) => {
|
|
60
40
|
var _a;
|
|
61
41
|
if (event instanceof MouseEvent &&
|
|
@@ -63,44 +43,77 @@ const Item = (props) => {
|
|
|
63
43
|
((_a = ref.current) === null || _a === undefined ? undefined : _a.contains(event.target))) {
|
|
64
44
|
return;
|
|
65
45
|
}
|
|
46
|
+
if (newOpen) {
|
|
47
|
+
setCompactNavPopoverOpen(false);
|
|
48
|
+
}
|
|
66
49
|
onOpenChangePopup === null || onOpenChangePopup === undefined ? undefined : onOpenChangePopup(newOpen, event, reason);
|
|
67
50
|
}, [onOpenChangePopup]);
|
|
68
|
-
|
|
51
|
+
const isDivider = type === 'divider';
|
|
52
|
+
const hasSubmenuPopup = !isDivider && Boolean(resolvedMenuPopupItems === null || resolvedMenuPopupItems === undefined ? undefined : resolvedMenuPopupItems.length) && (collapsedItem || isGroupHeader);
|
|
53
|
+
const submenuNest = React__default.useContext(ItemPopupNestContext);
|
|
54
|
+
React__default.useEffect(() => {
|
|
55
|
+
if (!submenuNest || !hasSubmenuPopup || !compactNavPopoverOpen) {
|
|
56
|
+
return undefined;
|
|
57
|
+
}
|
|
58
|
+
submenuNest.registerNestedOpen(1);
|
|
59
|
+
return () => {
|
|
60
|
+
submenuNest.registerNestedOpen(-1);
|
|
61
|
+
};
|
|
62
|
+
}, [submenuNest, hasSubmenuPopup, compactNavPopoverOpen]);
|
|
63
|
+
if (isDivider) {
|
|
69
64
|
return React__default.createElement("div", { className: b('menu-divider') });
|
|
70
65
|
}
|
|
66
|
+
const compactPopoverDisabled = !enableTooltip || popupVisible || type === 'action';
|
|
71
67
|
const makeIconNode = (iconEl) => {
|
|
72
|
-
|
|
68
|
+
if (!compact) {
|
|
69
|
+
return iconEl;
|
|
70
|
+
}
|
|
71
|
+
const iconButton = (React__default.createElement("div", { onMouseEnter: () => onMouseEnter === null || onMouseEnter === undefined ? undefined : onMouseEnter(), onMouseLeave: () => onMouseLeave === null || onMouseLeave === undefined ? undefined : onMouseLeave(), className: b('btn-icon') }, iconEl));
|
|
72
|
+
if (resolvedMenuPopupItems === null || resolvedMenuPopupItems === undefined ? undefined : resolvedMenuPopupItems.length) {
|
|
73
|
+
return iconButton;
|
|
74
|
+
}
|
|
75
|
+
return (React__default.createElement(ItemPopup, { items: [props], open: compactNavPopoverOpen, onOpenChange: (nextOpen) => {
|
|
76
|
+
if (nextOpen && compactPopoverDisabled)
|
|
77
|
+
return;
|
|
78
|
+
setCompactNavPopoverOpen(nextOpen);
|
|
79
|
+
}, hideIcon: true, itemClassName: popupItemClassName, disabled: compactPopoverDisabled, type: type, collapsed: compact, onItemClick: onItemClick }, iconButton));
|
|
73
80
|
};
|
|
74
81
|
const makeNode = ({ icon: iconEl, title: titleEl }) => {
|
|
75
82
|
const [Tag, tagProps] = href ? ['a', { href }] : ['button', {}];
|
|
76
|
-
const
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
83
|
+
const tagNode = (React__default.createElement(Tag, Object.assign({}, tagProps, { className: b({ type, current, compact, 'hide-icon': hideIcon }, className), ref: ref, "data-type": type, "data-qa": qa, onClick: (event) => {
|
|
84
|
+
if (stopClickPropagation) {
|
|
85
|
+
event.stopPropagation();
|
|
86
|
+
}
|
|
87
|
+
if (compact && !collapsedItem) {
|
|
88
|
+
setCompactNavPopoverOpen(false);
|
|
89
|
+
}
|
|
90
|
+
onItemClick === null || onItemClick === undefined ? undefined : onItemClick(props, collapsedItem, event);
|
|
91
|
+
}, onClickCapture: onItemClickCapture, onMouseEnter: () => {
|
|
92
|
+
if (!compact) {
|
|
81
93
|
onMouseEnter === null || onMouseEnter === undefined ? undefined : onMouseEnter();
|
|
82
|
-
}
|
|
94
|
+
}
|
|
95
|
+
}, onMouseLeave: () => {
|
|
96
|
+
if (!compact) {
|
|
83
97
|
onMouseLeave === null || onMouseLeave === undefined ? undefined : onMouseLeave();
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
98
|
+
}
|
|
99
|
+
} }),
|
|
100
|
+
React__default.createElement("div", { className: b('icon-place'), ref: highlightedRef }, makeIconNode(iconEl)),
|
|
101
|
+
React__default.createElement("div", { className: b('title'), title: typeof title === 'string' ? title : undefined }, titleEl),
|
|
102
|
+
Boolean(resolvedMenuPopupItems === null || resolvedMenuPopupItems === undefined ? undefined : resolvedMenuPopupItems.length) && (isGroupHeader || collapsedItem) && (React__default.createElement("div", { className: b('chevron') },
|
|
103
|
+
React__default.createElement(Icon, { data: ChevronRight, size: compact ? CHEVRON_SIZE_COMPACT : CHEVRON_SIZE })))));
|
|
104
|
+
const expandedMenuRows = resolvedMenuPopupItems;
|
|
105
|
+
const wrappedTagNode = hasSubmenuPopup && expandedMenuRows ? (React__default.createElement(ItemPopup, { items: expandedMenuRows, title: isGroupHeader ? resolvedMenuPopupTitle : undefined, open: compactNavPopoverOpen, itemClassName: popupItemClassName, onOpenChange: setCompactNavPopoverOpen, collapsed: collapsedItem ? true : compact, onItemClick: onItemClick }, tagNode)) : (tagNode);
|
|
106
|
+
const createdNode = (React__default.createElement(React__default.Fragment, null,
|
|
107
|
+
wrappedTagNode,
|
|
90
108
|
renderPopupContent && Boolean(anchorRef === null || anchorRef === undefined ? undefined : anchorRef.current) && (React__default.createElement(Popup, { strategy: "fixed", open: popupVisible, keepMounted: popupKeepMounted, placement: popupPlacement, offset: popupOffset, anchorElement: anchorRef.current, onOpenChange: handleOpenChangePopup }, renderPopupContent()))));
|
|
91
109
|
return createdNode;
|
|
92
110
|
};
|
|
93
|
-
const iconNode = icon ? (React__default.createElement(Icon, { qa: iconQa, data: icon, size: iconSize, className: b('icon') }))
|
|
111
|
+
const iconNode = hideIcon || !icon ? null : (React__default.createElement(Icon, { qa: iconQa, data: icon, size: iconSize, className: b('icon') }));
|
|
94
112
|
const titleNode = renderItemTitle({ title, rightAdornment });
|
|
95
113
|
const params = { icon: iconNode, title: titleNode };
|
|
96
114
|
let highlightedNode = null;
|
|
97
115
|
let node;
|
|
98
|
-
const opts = {
|
|
99
|
-
isExpanded,
|
|
100
|
-
item: props,
|
|
101
|
-
ref,
|
|
102
|
-
setCollapseBlocker,
|
|
103
|
-
};
|
|
116
|
+
const opts = { compact: Boolean(compact), collapsed: false, item: props, ref };
|
|
104
117
|
if (typeof itemWrapper === 'function') {
|
|
105
118
|
node = itemWrapper(params, makeNode, opts);
|
|
106
119
|
highlightedNode =
|
|
@@ -112,7 +125,7 @@ const Item = (props) => {
|
|
|
112
125
|
highlightedNode = bringForward && makeIconNode(iconNode);
|
|
113
126
|
}
|
|
114
127
|
return (React__default.createElement(React__default.Fragment, null,
|
|
115
|
-
bringForward && (React__default.createElement(HighlightedItem, { iconNode: highlightedNode, iconRef: highlightedRef, onClick: (event) => onItemClick === null || onItemClick === undefined ? undefined : onItemClick(props, false, event
|
|
128
|
+
bringForward && (React__default.createElement(HighlightedItem, { iconNode: highlightedNode, iconRef: highlightedRef, onClick: (event) => onItemClick === null || onItemClick === undefined ? undefined : onItemClick(props, false, event), onClickCapture: onItemClickCapture })),
|
|
116
129
|
node));
|
|
117
130
|
};
|
|
118
131
|
Item.displayName = 'Item';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Item.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/Item/Item.tsx"],"sourcesContent":["import React from 'react';\n\nimport {Pin, PinFill} from '@gravity-ui/icons';\nimport {Button, Icon, Popup, PopupPlacement, PopupProps} from '@gravity-ui/uikit';\nimport {CSSTransition} from 'react-transition-group';\n\nimport {ASIDE_HEADER_EXPAND_TRANSITION_DELAY, ASIDE_HEADER_ICON_SIZE} from '../../../../constants';\nimport {MakeItemParams} from '../../../../types';\nimport {createBlock} from '../../../../utils/cn';\nimport {AsideHeaderItem, SetCollapseBlocker} from '../../../types';\nimport {HighlightedItem} from '../HighlightedItem/HighlightedItem';\nimport {ITEM_TYPE_REGULAR} from '../constants';\n\nimport styles from './Item.module.scss';\n\nconst b = createBlock('composite-bar-item', styles);\n\nconst itemTransitionClasses = {\n enter: b('transition-title-enter'),\n enterActive: b('transition-title-enter-active'),\n enterDone: b('transition-title-enter-done'),\n exit: b('transition-title-exit'),\n exitActive: b('transition-title-exit-active'),\n exitDone: b('transition-title-exit-done'),\n};\n\nexport interface ItemProps extends AsideHeaderItem {}\n\ninterface ItemInnerProps extends ItemProps {\n /** Registers a temporary block on collapse (e.g. while dropdown is open). Returns release function. */\n setCollapseBlocker?: SetCollapseBlocker;\n /** When `true`, the item is displayed in expanded form. */\n isExpanded?: boolean;\n /** Layout mode: 'horizontal' shows icon only, 'vertical' shows icon and title. Used in FooterBar. */\n layout?: 'horizontal' | 'vertical';\n className?: string;\n onMouseEnter?: () => void;\n onMouseLeave?: () => void;\n editMode?: boolean;\n onToggleVisibility?: () => void;\n}\n\nfunction renderItemTitle(params: Pick<AsideHeaderItem, 'title' | 'rightAdornment'>) {\n let titleNode = <div className={b('title-text')}>{params.title}</div>;\n\n if (params.rightAdornment) {\n titleNode = (\n <React.Fragment>\n {titleNode}\n <div className={b('title-adornment')}>{params.rightAdornment}</div>\n </React.Fragment>\n );\n }\n\n return titleNode;\n}\n\nconst defaultPopupPlacement: PopupPlacement = ['right-end'];\nconst defaultPopupOffset: NonNullable<PopupProps['offset']> = {mainAxis: 8, crossAxis: -20};\n\nexport const Item: React.FC<ItemInnerProps> = (props) => {\n const {\n className,\n onMouseLeave,\n onMouseEnter,\n popupVisible = false,\n popupRef: anchoreRefProp,\n popupPlacement = defaultPopupPlacement,\n popupOffset = defaultPopupOffset,\n popupKeepMounted,\n renderPopupContent,\n onOpenChangePopup,\n onItemClick,\n onItemClickCapture,\n itemWrapper,\n bringForward,\n rightAdornment,\n title,\n href,\n qa,\n isExpanded = true,\n layout = 'vertical',\n editMode = false,\n onToggleVisibility,\n setCollapseBlocker,\n hidden,\n preventUserRemoving,\n } = props;\n\n const ref = React.useRef<HTMLAnchorElement & HTMLButtonElement>(null);\n const anchorRef = anchoreRefProp?.current ? anchoreRefProp : ref;\n const highlightedRef = React.useRef<HTMLDivElement>(null);\n\n React.useEffect(() => {\n let didBlock = false;\n\n if (popupVisible) {\n didBlock = true;\n\n setCollapseBlocker?.(true);\n }\n\n return () => {\n if (didBlock) {\n setCollapseBlocker?.(false);\n }\n };\n }, [popupVisible, setCollapseBlocker]);\n\n const type = props.type || ITEM_TYPE_REGULAR;\n const current = props.current || false;\n const icon = props.icon;\n const iconSize = props.iconSize || ASIDE_HEADER_ICON_SIZE;\n const iconQa = props.iconQa;\n\n const onPinButtonClick = React.useCallback(\n (e: React.MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n e.preventDefault();\n onToggleVisibility?.();\n },\n [onToggleVisibility],\n );\n\n const handleOpenChangePopup = React.useCallback<NonNullable<ItemProps['onOpenChangePopup']>>(\n (newOpen, event, reason) => {\n if (\n event instanceof MouseEvent &&\n event.target &&\n ref.current?.contains(event.target as Node)\n ) {\n return;\n }\n\n onOpenChangePopup?.(newOpen, event, reason);\n },\n [onOpenChangePopup],\n );\n\n if (type === 'divider') {\n return <div className={b('menu-divider')} />;\n }\n\n const makeIconNode = (iconEl: React.ReactNode): React.ReactNode => {\n return isExpanded ? iconEl : <div className={b('btn-icon')}>{iconEl}</div>;\n };\n\n const makeNode = ({icon: iconEl, title: titleEl}: MakeItemParams) => {\n const [Tag, tagProps] = href ? ['a' as const, {href}] : ['button' as const, {}];\n const ariaLabel = typeof title === 'string' ? title : undefined;\n\n const createdNode = (\n <React.Fragment>\n <Tag\n {...tagProps}\n className={b({type, current, collapsed: !isExpanded}, className)}\n ref={ref}\n data-qa={qa}\n data-type={type}\n aria-label={ariaLabel}\n onClick={(event: React.MouseEvent<HTMLElement, MouseEvent>) => {\n onItemClick?.(props, false, event, {setCollapseBlocker});\n }}\n onClickCapture={onItemClickCapture}\n onMouseEnter={() => {\n onMouseEnter?.();\n }}\n onMouseLeave={() => {\n onMouseLeave?.();\n }}\n >\n <div className={b('icon-place')} ref={highlightedRef}>\n {makeIconNode(iconEl)}\n </div>\n\n {layout === 'vertical' && (\n <CSSTransition\n in={isExpanded}\n timeout={ASIDE_HEADER_EXPAND_TRANSITION_DELAY}\n classNames={itemTransitionClasses}\n >\n <div\n className={b('title')}\n title={typeof title === 'string' ? title : undefined}\n >\n {titleEl}\n </div>\n </CSSTransition>\n )}\n\n {editMode && !preventUserRemoving && onToggleVisibility ? (\n <Button\n onClick={onPinButtonClick}\n view={hidden ? 'flat-secondary' : 'flat-action'}\n className={b('visibility-button')}\n >\n <Button.Icon>{hidden ? <Pin /> : <PinFill />}</Button.Icon>\n </Button>\n ) : null}\n </Tag>\n {renderPopupContent && Boolean(anchorRef?.current) && (\n <Popup\n strategy=\"fixed\"\n open={popupVisible}\n keepMounted={popupKeepMounted}\n placement={popupPlacement}\n offset={popupOffset}\n anchorElement={anchorRef.current}\n onOpenChange={handleOpenChangePopup}\n >\n {renderPopupContent()}\n </Popup>\n )}\n </React.Fragment>\n );\n\n return createdNode;\n };\n\n const iconNode = icon ? (\n <Icon qa={iconQa} data={icon} size={iconSize} className={b('icon')} />\n ) : null;\n const titleNode = renderItemTitle({title, rightAdornment});\n const params = {icon: iconNode, title: titleNode};\n let highlightedNode = null;\n let node;\n\n const opts = {\n isExpanded,\n item: props,\n ref,\n setCollapseBlocker,\n };\n\n if (typeof itemWrapper === 'function') {\n node = itemWrapper(params, makeNode, opts) as React.ReactElement;\n highlightedNode =\n bringForward &&\n (itemWrapper(\n params,\n ({icon: iconEl}) => makeIconNode(iconEl),\n opts,\n ) as React.ReactElement);\n } else {\n node = makeNode(params);\n highlightedNode = bringForward && makeIconNode(iconNode);\n }\n\n return (\n <React.Fragment>\n {bringForward && (\n <HighlightedItem\n iconNode={highlightedNode}\n iconRef={highlightedRef}\n onClick={(event: React.MouseEvent<HTMLElement, MouseEvent>) =>\n onItemClick?.(props, false, event, {setCollapseBlocker})\n }\n onClickCapture={onItemClickCapture}\n />\n )}\n {node}\n </React.Fragment>\n );\n};\n\nItem.displayName = 'Item';\n"],"names":["React"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Item.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/Item/Item.tsx"],"sourcesContent":["import React from 'react';\n\nimport {ChevronRight} from '@gravity-ui/icons';\nimport {Icon, Popup, PopupPlacement, PopupProps} from '@gravity-ui/uikit';\n\nimport {ASIDE_HEADER_ICON_SIZE} from '../../../../constants';\nimport {MakeItemParams} from '../../../../types';\nimport {createBlock} from '../../../../utils/cn';\nimport {HighlightedItem} from '../HighlightedItem/HighlightedItem';\nimport {COLLAPSE_ITEM_ID, ITEM_TYPE_REGULAR} from '../constants';\nimport {isGroupHeaderItem} from '../grouping';\n\nimport {ItemInnerProps, ItemProps} from './Item.types';\nimport {ItemPopup} from './ItemPopup';\nimport {ItemPopupNestContext} from './ItemPopupNestContext';\nimport {renderItemTitle} from './renderItemTitle';\n\nimport styles from './Item.module.scss';\n\nconst b = createBlock('composite-bar-item', styles);\n\nconst defaultPopupPlacement: PopupPlacement = ['right-end'];\nconst defaultPopupOffset: NonNullable<PopupProps['offset']> = {mainAxis: 14};\nconst CHEVRON_SIZE = 16;\nconst CHEVRON_SIZE_COMPACT = 10;\n\nexport const Item: React.FC<ItemInnerProps> = (props) => {\n const {\n className,\n popupItemClassName,\n menuPopupItems,\n menuPopupTitle,\n compact,\n onMouseLeave,\n onMouseEnter,\n enableTooltip = true,\n popupVisible = false,\n popupRef: anchoreRefProp,\n popupPlacement = defaultPopupPlacement,\n popupOffset = defaultPopupOffset,\n popupKeepMounted,\n renderPopupContent,\n onOpenChangePopup,\n onItemClick,\n onItemClickCapture,\n itemWrapper,\n bringForward,\n rightAdornment,\n title,\n href,\n qa,\n hideIcon = false,\n stopClickPropagation = false,\n } = props;\n\n const [compactNavPopoverOpen, setCompactNavPopoverOpen] = React.useState(false);\n\n const ref = React.useRef<HTMLAnchorElement & HTMLButtonElement>(null);\n const anchorRef = anchoreRefProp?.current ? anchoreRefProp : ref;\n const highlightedRef = React.useRef<HTMLDivElement>(null);\n\n const type = props.type || ITEM_TYPE_REGULAR;\n const current = props.current || false;\n const icon = props.icon;\n const iconSize = props.iconSize || ASIDE_HEADER_ICON_SIZE;\n const iconQa = props.iconQa;\n const collapsedItem = props.id === COLLAPSE_ITEM_ID;\n const isGroupHeader = isGroupHeaderItem(props);\n\n let resolvedMenuPopupItems = menuPopupItems;\n let resolvedMenuPopupTitle = menuPopupTitle;\n\n if (isGroupHeader) {\n resolvedMenuPopupItems = menuPopupItems ?? props.groupChildren;\n resolvedMenuPopupTitle = menuPopupTitle ?? props.groupPopupTitle;\n }\n\n const handleOpenChangePopup = React.useCallback<NonNullable<ItemProps['onOpenChangePopup']>>(\n (newOpen, event, reason) => {\n if (\n event instanceof MouseEvent &&\n event.target &&\n ref.current?.contains(event.target as Node)\n ) {\n return;\n }\n\n if (newOpen) {\n setCompactNavPopoverOpen(false);\n }\n\n onOpenChangePopup?.(newOpen, event, reason);\n },\n [onOpenChangePopup],\n );\n\n const isDivider = type === 'divider';\n const hasSubmenuPopup =\n !isDivider && Boolean(resolvedMenuPopupItems?.length) && (collapsedItem || isGroupHeader);\n\n const submenuNest = React.useContext(ItemPopupNestContext);\n\n React.useEffect(() => {\n if (!submenuNest || !hasSubmenuPopup || !compactNavPopoverOpen) {\n return undefined;\n }\n\n submenuNest.registerNestedOpen(1);\n\n return () => {\n submenuNest.registerNestedOpen(-1);\n };\n }, [submenuNest, hasSubmenuPopup, compactNavPopoverOpen]);\n\n if (isDivider) {\n return <div className={b('menu-divider')} />;\n }\n\n const compactPopoverDisabled = !enableTooltip || popupVisible || type === 'action';\n\n const makeIconNode = (iconEl: React.ReactNode): React.ReactNode => {\n if (!compact) {\n return iconEl;\n }\n\n const iconButton = (\n <div\n onMouseEnter={() => onMouseEnter?.()}\n onMouseLeave={() => onMouseLeave?.()}\n className={b('btn-icon')}\n >\n {iconEl}\n </div>\n );\n\n if (resolvedMenuPopupItems?.length) {\n return iconButton;\n }\n\n return (\n <ItemPopup\n items={[props]}\n open={compactNavPopoverOpen}\n onOpenChange={(nextOpen) => {\n if (nextOpen && compactPopoverDisabled) return;\n setCompactNavPopoverOpen(nextOpen);\n }}\n hideIcon\n itemClassName={popupItemClassName}\n disabled={compactPopoverDisabled}\n type={type}\n collapsed={compact}\n onItemClick={onItemClick}\n >\n {iconButton}\n </ItemPopup>\n );\n };\n\n const makeNode = ({icon: iconEl, title: titleEl}: MakeItemParams) => {\n const [Tag, tagProps] = href ? ['a' as const, {href}] : ['button' as const, {}];\n\n const tagNode = (\n <Tag\n {...tagProps}\n className={b({type, current, compact, 'hide-icon': hideIcon}, className)}\n ref={ref}\n data-type={type}\n data-qa={qa}\n onClick={(event: React.MouseEvent<HTMLElement, MouseEvent>) => {\n if (stopClickPropagation) {\n event.stopPropagation();\n }\n\n if (compact && !collapsedItem) {\n setCompactNavPopoverOpen(false);\n }\n\n onItemClick?.(props, collapsedItem, event);\n }}\n onClickCapture={onItemClickCapture}\n onMouseEnter={() => {\n if (!compact) {\n onMouseEnter?.();\n }\n }}\n onMouseLeave={() => {\n if (!compact) {\n onMouseLeave?.();\n }\n }}\n >\n <div className={b('icon-place')} ref={highlightedRef}>\n {makeIconNode(iconEl)}\n </div>\n\n <div className={b('title')} title={typeof title === 'string' ? title : undefined}>\n {titleEl}\n </div>\n\n {Boolean(resolvedMenuPopupItems?.length) && (isGroupHeader || collapsedItem) && (\n <div className={b('chevron')}>\n <Icon\n data={ChevronRight}\n size={compact ? CHEVRON_SIZE_COMPACT : CHEVRON_SIZE}\n />\n </div>\n )}\n </Tag>\n );\n\n const expandedMenuRows = resolvedMenuPopupItems;\n\n const wrappedTagNode =\n hasSubmenuPopup && expandedMenuRows ? (\n <ItemPopup\n items={expandedMenuRows}\n title={isGroupHeader ? resolvedMenuPopupTitle : undefined}\n open={compactNavPopoverOpen}\n itemClassName={popupItemClassName}\n onOpenChange={setCompactNavPopoverOpen}\n collapsed={collapsedItem ? true : compact}\n onItemClick={onItemClick}\n >\n {tagNode}\n </ItemPopup>\n ) : (\n tagNode\n );\n\n const createdNode = (\n <React.Fragment>\n {wrappedTagNode}\n {renderPopupContent && Boolean(anchorRef?.current) && (\n <Popup\n strategy=\"fixed\"\n open={popupVisible}\n keepMounted={popupKeepMounted}\n placement={popupPlacement}\n offset={popupOffset}\n anchorElement={anchorRef.current}\n onOpenChange={handleOpenChangePopup}\n >\n {renderPopupContent()}\n </Popup>\n )}\n </React.Fragment>\n );\n\n return createdNode;\n };\n\n const iconNode =\n hideIcon || !icon ? null : (\n <Icon qa={iconQa} data={icon} size={iconSize} className={b('icon')} />\n );\n const titleNode = renderItemTitle({title, rightAdornment});\n const params = {icon: iconNode, title: titleNode};\n let highlightedNode = null;\n let node;\n\n const opts = {compact: Boolean(compact), collapsed: false, item: props, ref};\n\n if (typeof itemWrapper === 'function') {\n node = itemWrapper(params, makeNode, opts) as React.ReactElement;\n highlightedNode =\n bringForward &&\n (itemWrapper(\n params,\n ({icon: iconEl}) => makeIconNode(iconEl),\n opts,\n ) as React.ReactElement);\n } else {\n node = makeNode(params);\n highlightedNode = bringForward && makeIconNode(iconNode);\n }\n\n return (\n <React.Fragment>\n {bringForward && (\n <HighlightedItem\n iconNode={highlightedNode}\n iconRef={highlightedRef}\n onClick={(event: React.MouseEvent<HTMLElement, MouseEvent>) =>\n onItemClick?.(props, false, event)\n }\n onClickCapture={onItemClickCapture}\n />\n )}\n {node}\n </React.Fragment>\n );\n};\n\nItem.displayName = 'Item';\n"],"names":["React"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var styles = {"gn-composite-bar-item":"Item-module__gn-composite-bar-item___-pkx5","gnCompositeBarItem":"Item-module__gn-composite-bar-item___-pkx5","gn-composite-bar-item_type_regular":"Item-module__gn-composite-bar-item_type_regular___wkhsT","gnCompositeBarItemTypeRegular":"Item-module__gn-composite-bar-item_type_regular___wkhsT","gn-composite-bar-
|
|
1
|
+
var styles = {"gn-composite-bar-item":"Item-module__gn-composite-bar-item___-pkx5","gnCompositeBarItem":"Item-module__gn-composite-bar-item___-pkx5","gn-composite-bar-item_type_regular":"Item-module__gn-composite-bar-item_type_regular___wkhsT","gnCompositeBarItemTypeRegular":"Item-module__gn-composite-bar-item_type_regular___wkhsT","gn-composite-bar-item__icon":"Item-module__gn-composite-bar-item__icon___ORFNf","gnCompositeBarItemIcon":"Item-module__gn-composite-bar-item__icon___ORFNf","gn-composite-bar-item_current":"Item-module__gn-composite-bar-item_current___NT2hB","gnCompositeBarItemCurrent":"Item-module__gn-composite-bar-item_current___NT2hB","gn-composite-bar-item__icon-tooltip":"Item-module__gn-composite-bar-item__icon-tooltip___PxU2i","gnCompositeBarItemIconTooltip":"Item-module__gn-composite-bar-item__icon-tooltip___PxU2i","g-action-tooltip__description":"Item-module__g-action-tooltip__description___UsHcG","gActionTooltipDescription":"Item-module__g-action-tooltip__description___UsHcG","gn-composite-bar-item__icon-place":"Item-module__gn-composite-bar-item__icon-place___jPKRh","gnCompositeBarItemIconPlace":"Item-module__gn-composite-bar-item__icon-place___jPKRh","gn-composite-bar-item__title":"Item-module__gn-composite-bar-item__title___wj5L5","gnCompositeBarItemTitle":"Item-module__gn-composite-bar-item__title___wj5L5","gn-composite-bar-item__title-text":"Item-module__gn-composite-bar-item__title-text___cILJo","gnCompositeBarItemTitleText":"Item-module__gn-composite-bar-item__title-text___cILJo","gn-composite-bar-item__title-adornment":"Item-module__gn-composite-bar-item__title-adornment___Xcopn","gnCompositeBarItemTitleAdornment":"Item-module__gn-composite-bar-item__title-adornment___Xcopn","gn-composite-bar-item__collapse-item":"Item-module__gn-composite-bar-item__collapse-item___Up6IX","gnCompositeBarItemCollapseItem":"Item-module__gn-composite-bar-item__collapse-item___Up6IX","gn-composite-bar-item__collapse-item-icon":"Item-module__gn-composite-bar-item__collapse-item-icon___CD-ao","gnCompositeBarItemCollapseItemIcon":"Item-module__gn-composite-bar-item__collapse-item-icon___CD-ao","gn-composite-bar-item__menu-divider":"Item-module__gn-composite-bar-item__menu-divider___hkm-Z","gnCompositeBarItemMenuDivider":"Item-module__gn-composite-bar-item__menu-divider___hkm-Z","gn-composite-bar-item__collapse-items-popup-content":"Item-module__gn-composite-bar-item__collapse-items-popup-content___a82to","gnCompositeBarItemCollapseItemsPopupContent":"Item-module__gn-composite-bar-item__collapse-items-popup-content___a82to","gn-composite-bar-item__link":"Item-module__gn-composite-bar-item__link___McAVN","gnCompositeBarItemLink":"Item-module__gn-composite-bar-item__link___McAVN","gn-composite-bar-item__btn-icon":"Item-module__gn-composite-bar-item__btn-icon___SwT65","gnCompositeBarItemBtnIcon":"Item-module__gn-composite-bar-item__btn-icon___SwT65","gn-composite-bar-item_type_action":"Item-module__gn-composite-bar-item_type_action___2jxO8","gnCompositeBarItemTypeAction":"Item-module__gn-composite-bar-item_type_action___2jxO8","gn-composite-bar-item__icon-tooltip_item-type_action":"Item-module__gn-composite-bar-item__icon-tooltip_item-type_action___HUhUR","gnCompositeBarItemIconTooltipItemTypeAction":"Item-module__gn-composite-bar-item__icon-tooltip_item-type_action___HUhUR","gn-composite-bar-item__icon-popover":"Item-module__gn-composite-bar-item__icon-popover___euq-P","gnCompositeBarItemIconPopover":"Item-module__gn-composite-bar-item__icon-popover___euq-P","gn-composite-bar-item__icon-popover_item-type_action":"Item-module__gn-composite-bar-item__icon-popover_item-type_action___ep-D3","gnCompositeBarItemIconPopoverItemTypeAction":"Item-module__gn-composite-bar-item__icon-popover_item-type_action___ep-D3","gn-composite-bar-item__popup-content":"Item-module__gn-composite-bar-item__popup-content___oys3t","gnCompositeBarItemPopupContent":"Item-module__gn-composite-bar-item__popup-content___oys3t","gn-composite-bar-item__popup-content_collapsed":"Item-module__gn-composite-bar-item__popup-content_collapsed___LGcy2","gnCompositeBarItemPopupContentCollapsed":"Item-module__gn-composite-bar-item__popup-content_collapsed___LGcy2","gn-composite-bar-item__root-menu-item":"Item-module__gn-composite-bar-item__root-menu-item___nlpvH","gnCompositeBarItemRootMenuItem":"Item-module__gn-composite-bar-item__root-menu-item___nlpvH","gn-composite-bar-item__popup-title":"Item-module__gn-composite-bar-item__popup-title___2-tGd","gnCompositeBarItemPopupTitle":"Item-module__gn-composite-bar-item__popup-title___2-tGd","gn-composite-bar-item__popup-item":"Item-module__gn-composite-bar-item__popup-item___MPgm3","gnCompositeBarItemPopupItem":"Item-module__gn-composite-bar-item__popup-item___MPgm3","gn-composite-bar-item_hide-icon":"Item-module__gn-composite-bar-item_hide-icon___bf5h3","gnCompositeBarItemHideIcon":"Item-module__gn-composite-bar-item_hide-icon___bf5h3","gn-composite-bar-item_compact":"Item-module__gn-composite-bar-item_compact___PVTeM","gnCompositeBarItemCompact":"Item-module__gn-composite-bar-item_compact___PVTeM","gn-composite-bar-item__chevron":"Item-module__gn-composite-bar-item__chevron___ZZ-vf","gnCompositeBarItemChevron":"Item-module__gn-composite-bar-item__chevron___ZZ-vf"};
|
|
2
2
|
|
|
3
3
|
export { styles as default };
|
|
4
4
|
//# sourceMappingURL=Item.module.scss.js.map
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { AsideHeaderItem } from 'src/components/AsideHeader/types';
|
|
2
|
+
export interface ItemProps extends AsideHeaderItem {
|
|
3
|
+
}
|
|
4
|
+
export interface ItemInnerProps extends ItemProps {
|
|
5
|
+
className?: string;
|
|
6
|
+
popupItemClassName?: string;
|
|
7
|
+
/** Items shown in the compact (or expanded overflow) popover: group children or overflow list. */
|
|
8
|
+
menuPopupItems?: AsideHeaderItem[];
|
|
9
|
+
/** Optional title rendered at the top of the popup listing `menuPopupItems`. */
|
|
10
|
+
menuPopupTitle?: string;
|
|
11
|
+
onMouseEnter?: () => void;
|
|
12
|
+
onMouseLeave?: () => void;
|
|
13
|
+
/** When true, the icon slot is not rendered (e.g. compact popover: icon stays in the bar). */
|
|
14
|
+
hideIcon?: boolean;
|
|
15
|
+
/**
|
|
16
|
+
* Stops click bubbling so portaled content (e.g. compact popover duplicate) does not trigger
|
|
17
|
+
* the parent Item's onClick in the React tree.
|
|
18
|
+
*/
|
|
19
|
+
stopClickPropagation?: boolean;
|
|
20
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { AsideHeaderItem } from '../../../types';
|
|
3
|
+
interface Props {
|
|
4
|
+
items: AsideHeaderItem[];
|
|
5
|
+
/** Optional title rendered at the top of the popup. */
|
|
6
|
+
title?: string;
|
|
7
|
+
open?: boolean;
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
type?: string;
|
|
10
|
+
collapsed?: boolean;
|
|
11
|
+
hideIcon?: boolean;
|
|
12
|
+
itemClassName?: string;
|
|
13
|
+
children: React.ReactElement;
|
|
14
|
+
onOpenChange?: (open: boolean) => void;
|
|
15
|
+
onItemClick?: AsideHeaderItem['onItemClick'];
|
|
16
|
+
}
|
|
17
|
+
export declare const ItemPopup: React.FC<Props>;
|
|
18
|
+
export {};
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
import { List, Popover } from '@gravity-ui/uikit';
|
|
3
|
+
import { createBlock } from '../../../../utils/cn.js';
|
|
4
|
+
import { getSelectedItemIndex, getPopupItemHeight, getPopupItemsHeight } from '../utils.js';
|
|
5
|
+
import { Item } from './Item.js';
|
|
6
|
+
import { ItemPopupNestContext } from './ItemPopupNestContext.js';
|
|
7
|
+
import styles from './Item.module.scss.js';
|
|
8
|
+
|
|
9
|
+
const b = createBlock('composite-bar-item', styles);
|
|
10
|
+
const defaultPopupOffset = { mainAxis: 14 };
|
|
11
|
+
const DEFAULT_POPUP_DELAY = 100;
|
|
12
|
+
const ItemPopup = ({ items, itemClassName, title, open, disabled, type, collapsed = false, hideIcon = false, children, onItemClick, onOpenChange, }) => {
|
|
13
|
+
const nestedOpenCountRef = React__default.useRef(0);
|
|
14
|
+
const registerNestedOpen = React__default.useCallback((delta) => {
|
|
15
|
+
nestedOpenCountRef.current = Math.max(0, nestedOpenCountRef.current + delta);
|
|
16
|
+
}, []);
|
|
17
|
+
const nestContextValue = React__default.useMemo(() => ({ registerNestedOpen }), [registerNestedOpen]);
|
|
18
|
+
const wrappedOnOpenChange = React__default.useCallback((next) => {
|
|
19
|
+
if (!next && nestedOpenCountRef.current > 0) {
|
|
20
|
+
return;
|
|
21
|
+
}
|
|
22
|
+
onOpenChange === null || onOpenChange === undefined ? undefined : onOpenChange(next);
|
|
23
|
+
}, [onOpenChange]);
|
|
24
|
+
if (!items.length) {
|
|
25
|
+
return children;
|
|
26
|
+
}
|
|
27
|
+
const content = (React__default.createElement(ItemPopupNestContext.Provider, { value: nestContextValue },
|
|
28
|
+
React__default.createElement("div", { className: b('popup-content', { collapsed }) },
|
|
29
|
+
title && React__default.createElement("div", { className: b('popup-title') }, title),
|
|
30
|
+
React__default.createElement(List, { items: items, selectedItemIndex: getSelectedItemIndex(items), itemHeight: getPopupItemHeight, itemsHeight: getPopupItemsHeight, itemClassName: b('root-menu-item', itemClassName), virtualized: false, filterable: false, sortable: false, renderItem: (item) => (React__default.createElement(Item, Object.assign({}, item, { qa: undefined, compact: false, className: b('popup-item'), hideIcon: hideIcon, stopClickPropagation: true, enableTooltip: false, bringForward: false, popupVisible: false, renderPopupContent: undefined, onOpenChangePopup: undefined, popupRef: undefined, onItemClick: (_innerItem, _innerCollapsed, event) => {
|
|
31
|
+
onOpenChange === null || onOpenChange === undefined ? undefined : onOpenChange(false);
|
|
32
|
+
onItemClick === null || onItemClick === undefined ? undefined : onItemClick(item, collapsed, event);
|
|
33
|
+
} }))) }))));
|
|
34
|
+
return (React__default.createElement(Popover, { disabled: disabled, open: open, onOpenChange: (nextOpen) => {
|
|
35
|
+
if (nextOpen && disabled)
|
|
36
|
+
return;
|
|
37
|
+
wrappedOnOpenChange(nextOpen);
|
|
38
|
+
}, placement: "right-start", strategy: "fixed", openDelay: DEFAULT_POPUP_DELAY, closeDelay: DEFAULT_POPUP_DELAY, offset: defaultPopupOffset, enableSafePolygon: true, className: b('icon-popover', { 'item-type': type }), content: content }, children));
|
|
39
|
+
};
|
|
40
|
+
ItemPopup.displayName = 'ItemPopup';
|
|
41
|
+
|
|
42
|
+
export { ItemPopup };
|
|
43
|
+
//# sourceMappingURL=ItemPopup.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ItemPopup.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/Item/ItemPopup.tsx"],"sourcesContent":["import React from 'react';\n\nimport {List, Popover, PopupProps} from '@gravity-ui/uikit';\n\nimport {createBlock} from '../../../../utils/cn';\nimport {AsideHeaderItem} from '../../../types';\nimport {getPopupItemHeight, getPopupItemsHeight, getSelectedItemIndex} from '../utils';\n\nimport {Item} from './Item';\nimport {ItemPopupNestContext} from './ItemPopupNestContext';\n\nimport styles from './Item.module.scss';\n\nconst b = createBlock('composite-bar-item', styles);\n\nconst defaultPopupOffset: NonNullable<PopupProps['offset']> = {mainAxis: 14};\n\nconst DEFAULT_POPUP_DELAY = 100;\n\ninterface Props {\n items: AsideHeaderItem[];\n /** Optional title rendered at the top of the popup. */\n title?: string;\n open?: boolean;\n disabled?: boolean;\n type?: string;\n collapsed?: boolean;\n hideIcon?: boolean;\n itemClassName?: string;\n children: React.ReactElement;\n onOpenChange?: (open: boolean) => void;\n onItemClick?: AsideHeaderItem['onItemClick'];\n}\n\nexport const ItemPopup: React.FC<Props> = ({\n items,\n itemClassName,\n title,\n open,\n disabled,\n type,\n collapsed = false,\n hideIcon = false,\n children,\n onItemClick,\n onOpenChange,\n}) => {\n const nestedOpenCountRef = React.useRef(0);\n\n const registerNestedOpen = React.useCallback((delta: number) => {\n nestedOpenCountRef.current = Math.max(0, nestedOpenCountRef.current + delta);\n }, []);\n\n const nestContextValue = React.useMemo(() => ({registerNestedOpen}), [registerNestedOpen]);\n\n const wrappedOnOpenChange = React.useCallback(\n (next: boolean) => {\n if (!next && nestedOpenCountRef.current > 0) {\n return;\n }\n\n onOpenChange?.(next);\n },\n [onOpenChange],\n );\n\n if (!items.length) {\n return children;\n }\n\n const content = (\n <ItemPopupNestContext.Provider value={nestContextValue}>\n <div className={b('popup-content', {collapsed})}>\n {title && <div className={b('popup-title')}>{title}</div>}\n <List\n items={items}\n selectedItemIndex={getSelectedItemIndex(items)}\n itemHeight={getPopupItemHeight}\n itemsHeight={getPopupItemsHeight}\n itemClassName={b('root-menu-item', itemClassName)}\n virtualized={false}\n filterable={false}\n sortable={false}\n renderItem={(item) => (\n <Item\n {...item}\n qa={undefined}\n compact={false}\n className={b('popup-item')}\n hideIcon={hideIcon}\n stopClickPropagation\n enableTooltip={false}\n bringForward={false}\n popupVisible={false}\n renderPopupContent={undefined}\n onOpenChangePopup={undefined}\n popupRef={undefined}\n onItemClick={(_innerItem, _innerCollapsed, event) => {\n onOpenChange?.(false);\n onItemClick?.(item, collapsed, event);\n }}\n />\n )}\n />\n </div>\n </ItemPopupNestContext.Provider>\n );\n\n return (\n <Popover\n disabled={disabled}\n open={open}\n onOpenChange={(nextOpen) => {\n if (nextOpen && disabled) return;\n wrappedOnOpenChange(nextOpen);\n }}\n placement=\"right-start\"\n strategy=\"fixed\"\n openDelay={DEFAULT_POPUP_DELAY}\n closeDelay={DEFAULT_POPUP_DELAY}\n offset={defaultPopupOffset}\n enableSafePolygon\n className={b('icon-popover', {'item-type': type})}\n content={content}\n >\n {children}\n </Popover>\n );\n};\n\nItemPopup.displayName = 'ItemPopup';\n"],"names":["React"],"mappings":"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"}
|
package/build/esm/components/AsideHeader/components/CompositeBar/Item/ItemPopupNestContext.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ItemPopupNestContext.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/Item/ItemPopupNestContext.tsx"],"sourcesContent":["import React from 'react';\n\nexport type ItemPopupNestContextValue = {\n registerNestedOpen: (delta: number) => void;\n};\n\nexport const ItemPopupNestContext = React.createContext<ItemPopupNestContextValue | null>(null);\n"],"names":["React"],"mappings":";;AAMa,MAAA,oBAAoB,GAAGA,cAAK,CAAC,aAAa,CAAmC,IAAI;;;;"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
import { createBlock } from '../../../../utils/cn.js';
|
|
3
|
+
import styles from './Item.module.scss.js';
|
|
4
|
+
|
|
5
|
+
const b = createBlock('composite-bar-item', styles);
|
|
6
|
+
function renderItemTitle(params) {
|
|
7
|
+
let titleNode = React__default.createElement("div", { className: b('title-text') }, params.title);
|
|
8
|
+
if (params.rightAdornment) {
|
|
9
|
+
titleNode = (React__default.createElement(React__default.Fragment, null,
|
|
10
|
+
titleNode,
|
|
11
|
+
React__default.createElement("div", { className: b('title-adornment') }, params.rightAdornment)));
|
|
12
|
+
}
|
|
13
|
+
return titleNode;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
export { renderItemTitle };
|
|
17
|
+
//# sourceMappingURL=renderItemTitle.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"renderItemTitle.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/Item/renderItemTitle.tsx"],"sourcesContent":["import React from 'react';\n\nimport {AsideHeaderItem} from 'src/components/AsideHeader/types';\n\nimport {createBlock} from '../../../../utils/cn';\n\nimport styles from './Item.module.scss';\n\nconst b = createBlock('composite-bar-item', styles);\n\nexport function renderItemTitle(params: Pick<AsideHeaderItem, 'title' | 'rightAdornment'>) {\n let titleNode = <div className={b('title-text')}>{params.title}</div>;\n\n if (params.rightAdornment) {\n titleNode = (\n <React.Fragment>\n {titleNode}\n <div className={b('title-adornment')}>{params.rightAdornment}</div>\n </React.Fragment>\n );\n }\n\n return titleNode;\n}\n"],"names":["React"],"mappings":";;;;AAQA,MAAM,CAAC,GAAG,WAAW,CAAC,oBAAoB,EAAE,MAAM,CAAC;AAE7C,SAAU,eAAe,CAAC,MAAyD,EAAA;AACrF,IAAA,IAAI,SAAS,GAAGA,cAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,EAAG,EAAA,MAAM,CAAC,KAAK,CAAO;AAErE,IAAA,IAAI,MAAM,CAAC,cAAc,EAAE;AACvB,QAAA,SAAS,IACLA,cAAC,CAAA,aAAA,CAAAA,cAAK,CAAC,QAAQ,EAAA,IAAA;YACV,SAAS;AACV,YAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAAG,EAAA,MAAM,CAAC,cAAc,CAAO,CACtD,CACpB;;AAGL,IAAA,OAAO,SAAS;AACpB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar___S-GKS{flex:1 1 auto;min-height:0;position:relative;width:100%}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar___S-GKS:before{background:var(--gn-aside-bottom-shadow-color,linear-gradient(to bottom,transparent 0,transparent 50%,rgba(0,0,0,.08) 100%));bottom:0;content:"";height:100%;left:0;opacity:0;pointer-events:none;position:absolute;right:0;transition:opacity .3s ease-in-out}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar___S-GKS.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar_bottom-shadow___YoCCZ:before{opacity:1}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollable-inner___yRIza{-ms-overflow-style:none;height:100%;overflow:
|
|
1
|
+
.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar___S-GKS{--_--scrollbar-width:var(--gn-aside-scrollbar-width,8px);--_--scrollbar-thumb-width:var(--gn-aside-scrollbar-thumb-width,4px);flex:1 1 auto;min-height:0;position:relative;width:100%}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar___S-GKS:before{background:var(--gn-aside-bottom-shadow-color,linear-gradient(to bottom,transparent 0,transparent 50%,rgba(0,0,0,.08) 100%));bottom:0;content:"";height:100%;left:0;opacity:0;pointer-events:none;position:absolute;right:0;transition:opacity .3s ease-in-out}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar___S-GKS.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar_bottom-shadow___YoCCZ:before{opacity:1}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollable-inner___yRIza{-ms-overflow-style:none;height:100%;overflow-y:auto;scrollbar-width:none;width:100%}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollable-inner___yRIza::-webkit-scrollbar{display:none;height:0;width:0}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollbar-track___u6MVN{background:var(--gn-aside-scrollbar-track-color,transparent);bottom:0;pointer-events:auto;position:absolute;right:0;top:0;width:var(--_--scrollbar-width);z-index:3}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollbar-thumb___bLf6h{background:var(--gn-aside-scrollbar-handle-color,var(--g-color-base-simple-hover));border-radius:calc(var(--_--scrollbar-thumb-width)/2);opacity:0;position:absolute;right:calc((var(--_--scrollbar-width) - var(--_--scrollbar-thumb-width))/2);top:0;touch-action:none;transition:opacity .15s ease-in-out;width:var(--_--scrollbar-thumb-width)}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar___S-GKS:hover .ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollbar-thumb___bLf6h{opacity:1}.g-root_theme_light .ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar___S-GKS, .g-root_theme_light-hc .ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar___S-GKS{--gn-aside-bottom-shadow-color:linear-gradient(180deg,transparent 0%,transparent 50%,rgba(0,0,0,.08))}.g-root_theme_dark .ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar___S-GKS, .g-root_theme_dark-hc .ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar___S-GKS{--gn-aside-bottom-shadow-color:linear-gradient(180deg,transparent 0%,transparent 80%,rgba(0,0,0,.4))}
|
|
@@ -2,6 +2,10 @@ import React, { FC, ReactNode } from 'react';
|
|
|
2
2
|
type ScrollableWithScrollbarProps = {
|
|
3
3
|
children: ReactNode;
|
|
4
4
|
className?: string;
|
|
5
|
+
/**
|
|
6
|
+
* Extra dependencies that should trigger a recalculation of the bottom
|
|
7
|
+
* shadow and custom scrollbar thumb (e.g. when the rendered items change).
|
|
8
|
+
*/
|
|
5
9
|
recalcDeps?: React.DependencyList;
|
|
6
10
|
};
|
|
7
11
|
export declare const ScrollableWithScrollbar: FC<ScrollableWithScrollbarProps>;
|