npm - @gravity-ui/navigation - Versions diffs - 5.0.0-beta.3 → 5.0.0 - Mend

@gravity-ui/navigation 5.0.0-beta.3 → 5.0.0

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.

Files changed (395) hide show

package/build/esm/components/AsideHeader/components/CompositeBar/CompositeBar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CompositeBar.js","sources":["../../../../../../../src/components/AsideHeader/components/CompositeBar/CompositeBar.tsx"],"sourcesContent":["import React, {FC, ReactNode, useCallback, useContext, useRef, useState} from 'react';\n\nimport {ChevronDown, ChevronRight} from '@gravity-ui/icons';\nimport {List, ListSortParams} from '@gravity-ui/uikit';\n\nimport {ASIDE_HEADER_COMPACT_WIDTH} from '../../../constants';\nimport {createBlock} from '../../../utils/cn';\nimport {AsideHeaderItem, MenuItemsWithGroups} from '../../types';\nimport {UNGROUPED_ID} from '../AllPagesPanel/constants';\n\nimport {Item, ItemProps} from './Item/Item';\nimport {MultipleTooltip, MultipleTooltipContext, MultipleTooltipProvider} from './MultipleTooltip';\nimport {COLLAPSE_ITEM_ID, ITEM_TYPE_REGULAR} from './constants';\nimport {getItemHeight, getItemsHeight, getSelectedItemIndex} from './utils';\n\nimport styles from './CompositeBar.module.scss';\n\nconst b = createBlock('composite-bar', styles);\n\ntype CompositeBarProps = {\n type: 'menu' \| 'subheader';\n\n items?: MenuItemsWithGroups[];\n onItemClick?: (\n item: AsideHeaderItem,\n collapsed: boolean,\n event: React.MouseEvent<HTMLElement, MouseEvent>,\n ) => void;\n multipleTooltip?: boolean;\n menuMoreTitle?: string;\n onMoreClick?: () => void;\n compact: boolean;\n compositeId?: string;\n className?: string;\n groupClassName?: string;\n menuItemClassName?: string;\n editMode?: boolean;\n onToggleGroupCollapsed?: (groupId: string) => void;\n};\n\ntype CompositeBarViewProps = CompositeBarProps & {\n compositeId?: string;\n items?: MenuItemsWithGroups[];\n collapsedIds?: Record<string, boolean>;\n enableSorting?: boolean;\n editMode?: boolean;\n onToggleGroupCollapsed?: (groupId: string) => void;\n onToggleMenuItemVisibility?: (item: AsideHeaderItem) => void;\n onToggleMenuGroupVisibility?: (groupId: string) => void;\n onFirstLevelSortEnd?: (params: {oldIndex: number; newIndex: number}) => void;\n onSecondLevelSortEnd?: (\n groupIndex: number,\n ) => (params: {oldIndex: number; newIndex: number}) => void;\n};\n\nexport const CompositeBarView: FC<CompositeBarViewProps> = ({\n type,\n items,\n onItemClick,\n onMoreClick,\n multipleTooltip = false,\n compositeId,\n className,\n groupClassName,\n menuItemClassName,\n enableSorting = false,\n editMode = false,\n compact,\n onToggleGroupCollapsed,\n onToggleMenuGroupVisibility,\n onToggleMenuItemVisibility,\n onFirstLevelSortEnd,\n onSecondLevelSortEnd,\n}) => {\n const ref = useRef<List<AsideHeaderItem>>(null);\n const tooltipRef = useRef<HTMLDivElement>(null);\n const [hoveredGroupId, setHoveredGroupId] = useState<string \| null>(null);\n\n const {\n setValue: setMultipleTooltipContextValue,\n active: multipleTooltipActive,\n activeIndex,\n lastClickedItemIndex,\n } = useContext(MultipleTooltipContext);\n\n React.useEffect(() => {\n function handleBlurWindow() {\n if (multipleTooltip && multipleTooltipActive) {\n setMultipleTooltipContextValue({active: false});\n }\n }\n\n window.addEventListener('blur', handleBlurWindow);\n\n return () => {\n window.removeEventListener('blur', handleBlurWindow);\n };\n }, [multipleTooltip, multipleTooltipActive, setMultipleTooltipContextValue]);\n\n const onTooltipMouseEnter = useCallback(\n (e: {clientX: number}) => {\n if (\n multipleTooltip &&\n compact &&\n !multipleTooltipActive &&\n document.hasFocus() &&\n activeIndex !== lastClickedItemIndex &&\n e.clientX <= ASIDE_HEADER_COMPACT_WIDTH\n ) {\n setMultipleTooltipContextValue?.({\n active: true,\n });\n }\n },\n [\n multipleTooltip,\n compact,\n multipleTooltipActive,\n activeIndex,\n lastClickedItemIndex,\n setMultipleTooltipContextValue,\n ],\n );\n\n const onTooltipMouseLeave = useCallback(() => {\n if (multipleTooltip && multipleTooltipActive && document.hasFocus()) {\n setMultipleTooltipContextValue?.({\n active: false,\n lastClickedItemIndex: undefined,\n });\n }\n }, [multipleTooltip, multipleTooltipActive, setMultipleTooltipContextValue]);\n\n const onMouseEnterByIndex = useCallback(\n (itemIndex: number) => () => {\n if (multipleTooltip && document.hasFocus()) {\n let multipleTooltipActiveValue = multipleTooltipActive;\n if (!multipleTooltipActive && itemIndex !== lastClickedItemIndex) {\n multipleTooltipActiveValue = true;\n }\n if (\n activeIndex === itemIndex &&\n multipleTooltipActive === multipleTooltipActiveValue\n ) {\n return;\n }\n setMultipleTooltipContextValue({\n activeIndex: itemIndex,\n active: multipleTooltipActiveValue,\n });\n }\n },\n [\n multipleTooltip,\n multipleTooltipActive,\n lastClickedItemIndex,\n activeIndex,\n setMultipleTooltipContextValue,\n ],\n );\n\n const onMouseLeave = useCallback(() => {\n if (compact && document.hasFocus()) {\n ref.current?.activateItem(undefined as unknown as number);\n if (\n multipleTooltip &&\n (activeIndex !== undefined \|\| lastClickedItemIndex !== undefined)\n ) {\n setMultipleTooltipContextValue({\n activeIndex: undefined,\n lastClickedItemIndex: undefined,\n });\n }\n }\n }, [\n activeIndex,\n compact,\n lastClickedItemIndex,\n multipleTooltip,\n setMultipleTooltipContextValue,\n ]);\n\n const onItemClickByIndex = useCallback(\n (\n itemIndex: number,\n orginalItemClick: AsideHeaderItem['onItemClick'],\n ): ItemProps['onItemClick'] =>\n (item, collapsed, event) => {\n if (\n compact &&\n multipleTooltip &&\n itemIndex !== lastClickedItemIndex &&\n item.id !== COLLAPSE_ITEM_ID\n ) {\n setMultipleTooltipContextValue({\n lastClickedItemIndex: itemIndex,\n active: false,\n });\n }\n\n // Handle clicks on the \"more\" button (collapse item)\n if (item.id === COLLAPSE_ITEM_ID && collapsed) {\n onMoreClick?.();\n } else {\n onItemClick?.({...item, onItemClick: orginalItemClick}, collapsed, event);\n }\n },\n [\n compact,\n lastClickedItemIndex,\n multipleTooltip,\n onItemClick,\n onMoreClick,\n setMultipleTooltipContextValue,\n ],\n );\n\n const handleFirstLevelSortEnd = useCallback(\n ({oldIndex, newIndex}: ListSortParams) => {\n if (onFirstLevelSortEnd) {\n onFirstLevelSortEnd({oldIndex, newIndex});\n }\n },\n [onFirstLevelSortEnd],\n );\n\n const handleSecondLevelSortEnd = useCallback(\n (groupIndex: number) =>\n ({oldIndex, newIndex}: ListSortParams) => {\n if (onSecondLevelSortEnd) {\n onSecondLevelSortEnd(groupIndex)({oldIndex, newIndex});\n }\n },\n [onSecondLevelSortEnd],\n );\n\n if (!items \|\| items.length === 0) {\n return null;\n }\n\n return (\n <React.Fragment>\n <div\n className={className}\n ref={tooltipRef}\n onMouseEnter={onTooltipMouseEnter}\n onMouseLeave={onTooltipMouseLeave}\n >\n <List<MenuItemsWithGroups>\n id={compositeId}\n ref={ref}\n items={items}\n selectedItemIndex={type === 'menu' ? getSelectedItemIndex(items) : undefined}\n itemHeight={getItemHeight}\n itemsHeight={getItemsHeight}\n itemClassName={b('root-menu-item', {compact})}\n virtualized={false}\n filterable={false}\n sortable={enableSorting}\n onSortEnd={enableSorting ? handleFirstLevelSortEnd : undefined}\n renderItem={(item, _isItemActive, itemIndex) => {\n const groupId = item.groupId;\n const itemType = item.type \|\| ITEM_TYPE_REGULAR;\n\n if (!groupId) {\n return (\n <Item\n {...item}\n className={b(\n 'menu-item',\n {compact, type: itemType},\n menuItemClassName,\n )}\n compact={compact}\n editMode={editMode}\n onMouseEnter={onMouseEnterByIndex(itemIndex)}\n onMouseLeave={onMouseLeave}\n onItemClick={onItemClickByIndex(itemIndex, item.onItemClick)}\n onToggleVisibility={\n onToggleMenuItemVisibility\n ? () => onToggleMenuItemVisibility(item)\n : undefined\n }\n />\n );\n }\n\n const isCollapsible = Boolean('collapsible' in item && item.collapsible);\n const isCollapsed = Boolean('isCollapsed' in item && item.isCollapsed);\n const groupListItems = ('items' in item && item.items) \|\| [];\n const hasHeader = item.title \|\| item.icon \|\| isCollapsible;\n\n const isUngrouped = item.id === UNGROUPED_ID;\n const isGroupHovered = hoveredGroupId === item.id;\n\n let groupIcon = item.icon;\n\n if (!isCollapsed) {\n groupIcon = ChevronDown;\n } else if (isGroupHovered) {\n groupIcon = ChevronRight;\n }\n\n return (\n <div\n className={b(\n 'menu-group',\n {expanded: !isCollapsed},\n groupClassName,\n )}\n >\n {hasHeader && !isUngrouped && (\n <Item\n {...item}\n className={b('menu-group-header', {collapsed: isCollapsed})}\n icon={groupIcon}\n compact={compact}\n editMode={editMode}\n onMouseEnter={() => {\n setHoveredGroupId(item.id);\n }}\n onMouseLeave={() => {\n setHoveredGroupId(null);\n }}\n onItemClick={onItemClickByIndex(\n itemIndex,\n onToggleGroupCollapsed\n ? () => onToggleGroupCollapsed(groupId)\n : undefined,\n )}\n onToggleVisibility={\n onToggleMenuGroupVisibility\n ? () => onToggleMenuGroupVisibility(groupId)\n : undefined\n }\n />\n )}\n\n {!isCollapsed && (\n <List<MenuItemsWithGroups>\n items={groupListItems}\n sortable={enableSorting}\n onSortEnd={handleSecondLevelSortEnd(itemIndex)}\n virtualized={false}\n filterable={false}\n itemClassName={b('menu-group-item', {\n edit: enableSorting,\n compact,\n })}\n itemHeight={getItemHeight}\n itemsHeight={getItemsHeight}\n renderItem={(\n nestedItem,\n _isNestedItemActive,\n _nestedItemIndex,\n ) => {\n return (\n <Item\n {...nestedItem}\n compact={compact}\n editMode={editMode}\n onMouseEnter={() => {\n setHoveredGroupId(nestedItem.id);\n }}\n onMouseLeave={() => {\n setHoveredGroupId(null);\n }}\n onItemClick={onItemClickByIndex(\n itemIndex,\n item.onItemClick,\n )}\n onToggleVisibility={\n onToggleMenuItemVisibility\n ? () =>\n onToggleMenuItemVisibility(\n nestedItem,\n )\n : undefined\n }\n />\n );\n }}\n />\n )}\n </div>\n );\n }}\n />\n </div>\n {type === 'menu' && multipleTooltip && (\n <MultipleTooltip\n open={compact && multipleTooltipActive}\n anchorRef={tooltipRef}\n placement={['right-start']}\n items={items}\n />\n )}\n </React.Fragment>\n );\n};\n\nexport const CompositeBar: FC<CompositeBarProps> = ({\n type,\n items,\n onItemClick,\n onMoreClick,\n onToggleGroupCollapsed,\n multipleTooltip = false,\n compact,\n compositeId,\n className,\n groupClassName,\n menuItemClassName,\n editMode = false,\n}) => {\n const visibleItems = items\n ?.filter((item) => !item.hidden)\n ?.map((item) => ({\n ...item,\n items: 'items' in item ? item.items?.filter((item) => !item.hidden) : [],\n }));\n\n if (!visibleItems \|\| visibleItems.length === 0) {\n return null;\n }\n\n let node: ReactNode;\n\n if (type === 'menu') {\n node = (\n <div className={b({scrollable: true}, className)}>\n <CompositeBarView\n compositeId={compositeId}\n groupClassName={groupClassName}\n menuItemClassName={menuItemClassName}\n type=\"menu\"\n compact={compact}\n items={visibleItems}\n onItemClick={onItemClick}\n onMoreClick={onMoreClick}\n multipleTooltip={multipleTooltip}\n onToggleGroupCollapsed={onToggleGroupCollapsed}\n editMode={editMode}\n />\n </div>\n );\n } else {\n node = (\n <div className={b({subheader: true}, className)}>\n <CompositeBarView\n groupClassName={groupClassName}\n menuItemClassName={menuItemClassName}\n type=\"subheader\"\n compact={compact}\n items={visibleItems}\n onItemClick={onItemClick}\n editMode={editMode}\n />\n </div>\n );\n }\n return <MultipleTooltipProvider>{node}</MultipleTooltipProvider>;\n};\n"],"names":["React"],"mappings":"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"}
1	+ {"version":3,"file":"CompositeBar.js","sources":["../../../../../../../src/components/AsideHeader/components/CompositeBar/CompositeBar.tsx"],"sourcesContent":["import React, {FC, useCallback, useRef, useState} from 'react';\n\nimport {ChevronDown, ChevronRight} from '@gravity-ui/icons';\nimport {List, ListSortParams} from '@gravity-ui/uikit';\n\nimport {createBlock} from '../../../utils/cn';\nimport {AsideHeaderItem, MenuItemsWithGroups, SetCollapseBlocker} from '../../types';\nimport {UNGROUPED_ID} from '../AllPagesPanel/constants';\n\nimport {Item, ItemProps} from './Item/Item';\nimport {ScrollableWithScrollbar} from './ScrollableWithScrollbar';\nimport {COLLAPSE_ITEM_ID, ITEM_TYPE_REGULAR} from './constants';\nimport {getItemHeight, getItemsHeight, getSelectedItemIndex} from './utils';\n\nimport styles from './CompositeBar.module.scss';\n\nconst b = createBlock('composite-bar', styles);\n\ntype CompositeBarProps = {\n type: 'menu' \| 'subheader';\n setCollapseBlocker?: SetCollapseBlocker;\n items?: MenuItemsWithGroups[];\n onItemClick?: (\n item: AsideHeaderItem,\n collapsed: boolean,\n event: React.MouseEvent<HTMLElement, MouseEvent>,\n options: {setCollapseBlocker: SetCollapseBlocker \| undefined},\n ) => void;\n menuMoreTitle?: string;\n onMoreClick?: () => void;\n /** When `true`, the navigation is expanded. When `false`, it is collapsed. /\n isExpanded: boolean;\n compositeId?: string;\n className?: string;\n menuItemClassName?: string;\n editMode?: boolean;\n onToggleGroupCollapsed?: (groupId: string) => void;\n /* When `true`, menu items use compact height. /\n isCompactMode?: boolean;\n};\n\ntype CompositeBarViewProps = CompositeBarProps & {\n compositeId?: string;\n items?: MenuItemsWithGroups[];\n collapsedIds?: Record<string, boolean>;\n enableSorting?: boolean;\n editMode?: boolean;\n onToggleGroupCollapsed?: (groupId: string) => void;\n onToggleMenuItemVisibility?: (item: AsideHeaderItem) => void;\n onToggleMenuGroupVisibility?: (groupId: string) => void;\n onFirstLevelSortEnd?: (params: {oldIndex: number; newIndex: number}) => void;\n onSecondLevelSortEnd?: (\n groupIndex: number,\n ) => (params: {oldIndex: number; newIndex: number}) => void;\n /* When `true`, menu items use compact height. */\n isCompactMode?: boolean;\n};\n\nexport const CompositeBarView: FC<CompositeBarViewProps> = ({\n type,\n items,\n onItemClick,\n onMoreClick,\n compositeId,\n className,\n menuItemClassName,\n enableSorting = false,\n editMode = false,\n isExpanded,\n onToggleGroupCollapsed,\n onToggleMenuGroupVisibility,\n onToggleMenuItemVisibility,\n onFirstLevelSortEnd,\n onSecondLevelSortEnd,\n setCollapseBlocker,\n isCompactMode,\n}) => {\n const ref = useRef<List<AsideHeaderItem>>(null);\n const [hoveredGroupId, setHoveredGroupId] = useState<string \| null>(null);\n\n const onMouseLeave = useCallback(() => {\n if (!isExpanded && document.hasFocus()) {\n ref.current?.activateItem(undefined as unknown as number);\n }\n }, [isExpanded]);\n\n const onItemClickByIndex = useCallback(\n (\n _itemIndex: number,\n orginalItemClick: AsideHeaderItem['onItemClick'],\n ): ItemProps['onItemClick'] =>\n (item, collapsed, event, options) => {\n // Handle clicks on the \"more\" button (collapse item)\n if (item.id === COLLAPSE_ITEM_ID && collapsed) {\n onMoreClick?.();\n } else {\n onItemClick?.(\n {...item, onItemClick: orginalItemClick},\n collapsed,\n event,\n options,\n );\n }\n },\n [onItemClick, onMoreClick],\n );\n\n const handleFirstLevelSortEnd = useCallback(\n ({oldIndex, newIndex}: ListSortParams) => {\n if (onFirstLevelSortEnd) {\n onFirstLevelSortEnd({oldIndex, newIndex});\n }\n },\n [onFirstLevelSortEnd],\n );\n\n const handleSecondLevelSortEnd = useCallback(\n (groupIndex: number) =>\n ({oldIndex, newIndex}: ListSortParams) => {\n if (onSecondLevelSortEnd) {\n onSecondLevelSortEnd(groupIndex)({oldIndex, newIndex});\n }\n },\n [onSecondLevelSortEnd],\n );\n\n if (!items \|\| items.length === 0) {\n return null;\n }\n\n return (\n <div className={className}>\n <List<MenuItemsWithGroups>\n id={compositeId}\n ref={ref}\n items={items}\n selectedItemIndex={type === 'menu' ? getSelectedItemIndex(items) : undefined}\n itemHeight={(item) => getItemHeight(item, isCompactMode)}\n itemsHeight={(items) => getItemsHeight(items, isCompactMode)}\n itemClassName={b('root-menu-item', {collapsed: !isExpanded}, menuItemClassName)}\n virtualized={false}\n filterable={false}\n sortable={enableSorting}\n onSortEnd={enableSorting ? handleFirstLevelSortEnd : undefined}\n renderItem={(item, _isItemActive, itemIndex) => {\n const groupId = item.groupId;\n const itemType = item.type \|\| ITEM_TYPE_REGULAR;\n\n if (!groupId) {\n return (\n <Item\n {...item}\n className={b('menu-item', {\n collapsed: !isExpanded,\n type: itemType,\n })}\n isExpanded={isExpanded}\n editMode={editMode}\n onMouseLeave={onMouseLeave}\n onItemClick={onItemClickByIndex(itemIndex, item.onItemClick)}\n setCollapseBlocker={setCollapseBlocker}\n onToggleVisibility={\n onToggleMenuItemVisibility\n ? () => onToggleMenuItemVisibility(item)\n : undefined\n }\n />\n );\n }\n\n const isCollapsible = Boolean('collapsible' in item && item.collapsible);\n const isCollapsed = Boolean('isCollapsed' in item && item.isCollapsed);\n const groupListItems = ('items' in item && item.items) \|\| [];\n const hasHeader = item.title \|\| item.icon \|\| isCollapsible;\n\n const isUngrouped = item.id === UNGROUPED_ID;\n const isGroupHovered = hoveredGroupId === item.id;\n\n let groupIcon = item.icon;\n\n if (isGroupHovered) {\n groupIcon = isCollapsed ? ChevronRight : ChevronDown;\n }\n\n return (\n <div className={b('menu-group', {expanded: !isCollapsed, wrapper: true})}>\n {hasHeader && !isUngrouped && (\n <Item\n {...item}\n className={b('menu-group-header', {collapsed: isCollapsed})}\n icon={groupIcon}\n isExpanded={isExpanded}\n editMode={editMode}\n setCollapseBlocker={setCollapseBlocker}\n onMouseEnter={() => {\n setHoveredGroupId(item.id);\n }}\n onMouseLeave={() => {\n setHoveredGroupId(null);\n }}\n onItemClick={onItemClickByIndex(\n itemIndex,\n onToggleGroupCollapsed\n ? () => onToggleGroupCollapsed(groupId)\n : undefined,\n )}\n onToggleVisibility={\n onToggleMenuGroupVisibility\n ? () => onToggleMenuGroupVisibility(groupId)\n : undefined\n }\n />\n )}\n\n {!isCollapsed && (\n <List<MenuItemsWithGroups>\n items={groupListItems}\n sortable={enableSorting}\n onSortEnd={handleSecondLevelSortEnd(itemIndex)}\n virtualized={false}\n filterable={false}\n itemClassName={b('menu-group-item', {\n edit: enableSorting,\n collapsed: !isExpanded,\n })}\n itemHeight={(item) => getItemHeight(item, isCompactMode)}\n itemsHeight={(items) => getItemsHeight(items, isCompactMode)}\n renderItem={(\n nestedItem,\n _isNestedItemActive,\n nestedItemIndex,\n ) => {\n return (\n <Item\n {...nestedItem}\n isExpanded={isExpanded}\n className={b('group-item')}\n editMode={editMode}\n setCollapseBlocker={setCollapseBlocker}\n onMouseEnter={() => {\n setHoveredGroupId(nestedItem.id);\n }}\n onMouseLeave={() => {\n setHoveredGroupId(null);\n }}\n onItemClick={onItemClickByIndex(\n // +1 because the first item is the group header\n itemIndex + nestedItemIndex + 1,\n nestedItem.onItemClick,\n )}\n onToggleVisibility={\n onToggleMenuItemVisibility\n ? () =>\n onToggleMenuItemVisibility(nestedItem)\n : undefined\n }\n />\n );\n }}\n />\n )}\n </div>\n );\n }}\n />\n </div>\n );\n};\n\nexport const CompositeBar: FC<CompositeBarProps> = ({\n type,\n items,\n onItemClick,\n onMoreClick,\n onToggleGroupCollapsed,\n setCollapseBlocker,\n isExpanded,\n compositeId,\n className,\n menuItemClassName,\n editMode = false,\n isCompactMode,\n}) => {\n if (!items \|\| items.length === 0) {\n return null;\n }\n\n if (type === 'menu') {\n return (\n <ScrollableWithScrollbar className={b(null, className)} recalcDeps={[items.length]}>\n <CompositeBarView\n compositeId={compositeId}\n menuItemClassName={menuItemClassName}\n type=\"menu\"\n isExpanded={isExpanded}\n items={items}\n onItemClick={onItemClick}\n onMoreClick={onMoreClick}\n onToggleGroupCollapsed={onToggleGroupCollapsed}\n setCollapseBlocker={setCollapseBlocker}\n editMode={editMode}\n isCompactMode={isCompactMode}\n />\n </ScrollableWithScrollbar>\n );\n }\n\n return (\n <div className={b({subheader: true}, className)}>\n <CompositeBarView\n menuItemClassName={menuItemClassName}\n type=\"subheader\"\n isExpanded={isExpanded}\n items={items}\n onItemClick={onItemClick}\n setCollapseBlocker={setCollapseBlocker}\n editMode={editMode}\n isCompactMode={isCompactMode}\n />\n </div>\n );\n};\n"],"names":["React"],"mappings":"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"}

package/build/esm/components/AsideHeader/components/CompositeBar/CompositeBar.module.scss.js CHANGED Viewed

@@ -1,4 +1,4 @@
-var styles = {"gn-composite-bar":"CompositeBar-module__gn-composite-bar___WoCDY","gnCompositeBar":"CompositeBar-module__gn-composite-bar___WoCDY","gn-composite-bar__root-menu-item":"CompositeBar-module__gn-composite-bar__root-menu-item___oxCuF","gnCompositeBarRootMenuItem":"CompositeBar-module__gn-composite-bar__root-menu-item___oxCuF","gn-composite-bar__menu-group-item":"CompositeBar-module__gn-composite-bar__menu-group-item___TLcnI","gnCompositeBarMenuGroupItem":"CompositeBar-module__gn-composite-bar__menu-group-item___TLcnI","gn-composite-bar__menu-group-header":"CompositeBar-module__gn-composite-bar__menu-group-header___Yvr21","gnCompositeBarMenuGroupHeader":"CompositeBar-module__gn-composite-bar__menu-group-header___Yvr21","gn-composite-bar_scrollable":"CompositeBar-module__gn-composite-bar_scrollable___W2xYo","gnCompositeBarScrollable":"CompositeBar-module__gn-composite-bar_scrollable___W2xYo","gn-composite-bar__menu-group":"CompositeBar-module__gn-composite-bar__menu-group___3hCzS","gnCompositeBarMenuGroup":"CompositeBar-module__gn-composite-bar__menu-group___3hCzS","gn-composite-bar__root-menu-item_compact":"CompositeBar-module__gn-composite-bar__root-menu-item_compact___vvKTD","gnCompositeBarRootMenuItemCompact":"CompositeBar-module__gn-composite-bar__root-menu-item_compact___vvKTD","gn-composite-bar__menu-group-item_edit":"CompositeBar-module__gn-composite-bar__menu-group-item_edit___Es8er","gnCompositeBarMenuGroupItemEdit":"CompositeBar-module__gn-composite-bar__menu-group-item_edit___Es8er","gn-composite-bar__menu-group-item_compact":"CompositeBar-module__gn-composite-bar__menu-group-item_compact___-7tZl","gnCompositeBarMenuGroupItemCompact":"CompositeBar-module__gn-composite-bar__menu-group-item_compact___-7tZl","gn-composite-bar__menu-group-header_collapsed":"CompositeBar-module__gn-composite-bar__menu-group-header_collapsed___bTXn1","gnCompositeBarMenuGroupHeaderCollapsed":"CompositeBar-module__gn-composite-bar__menu-group-header_collapsed___bTXn1","gn-composite-bar__menu-item_type_regular":"CompositeBar-module__gn-composite-bar__menu-item_type_regular___8DHUR","gnCompositeBarMenuItemTypeRegular":"CompositeBar-module__gn-composite-bar__menu-item_type_regular___8DHUR","gn-composite-bar__menu-group_expanded":"CompositeBar-module__gn-composite-bar__menu-group_expanded___GY0oS","gnCompositeBarMenuGroupExpanded":"CompositeBar-module__gn-composite-bar__menu-group_expanded___GY0oS","gn-composite-bar__menu-group-toggle":"CompositeBar-module__gn-composite-bar__menu-group-toggle___4--VW","gnCompositeBarMenuGroupToggle":"CompositeBar-module__gn-composite-bar__menu-group-toggle___4--VW","gn-composite-bar__menu-group-toggle-placeholder":"CompositeBar-module__gn-composite-bar__menu-group-toggle-placeholder___vAqkn","gnCompositeBarMenuGroupTogglePlaceholder":"CompositeBar-module__gn-composite-bar__menu-group-toggle-placeholder___vAqkn","gn-composite-bar__menu-group-icon":"CompositeBar-module__gn-composite-bar__menu-group-icon___YVg-C","gnCompositeBarMenuGroupIcon":"CompositeBar-module__gn-composite-bar__menu-group-icon___YVg-C"};
+var styles = {"gn-composite-bar":"CompositeBar-module__gn-composite-bar___WoCDY","gnCompositeBar":"CompositeBar-module__gn-composite-bar___WoCDY","gn-composite-bar__root-menu-item":"CompositeBar-module__gn-composite-bar__root-menu-item___oxCuF","gnCompositeBarRootMenuItem":"CompositeBar-module__gn-composite-bar__root-menu-item___oxCuF","gn-composite-bar__menu-group-item":"CompositeBar-module__gn-composite-bar__menu-group-item___TLcnI","gnCompositeBarMenuGroupItem":"CompositeBar-module__gn-composite-bar__menu-group-item___TLcnI","gn-composite-bar__menu-group-header":"CompositeBar-module__gn-composite-bar__menu-group-header___Yvr21","gnCompositeBarMenuGroupHeader":"CompositeBar-module__gn-composite-bar__menu-group-header___Yvr21","gn-composite-bar__menu-group":"CompositeBar-module__gn-composite-bar__menu-group___3hCzS","gnCompositeBarMenuGroup":"CompositeBar-module__gn-composite-bar__menu-group___3hCzS","gn-composite-bar__root-menu-item_compact":"CompositeBar-module__gn-composite-bar__root-menu-item_compact___vvKTD","gnCompositeBarRootMenuItemCompact":"CompositeBar-module__gn-composite-bar__root-menu-item_compact___vvKTD","gn-composite-bar__group-item":"CompositeBar-module__gn-composite-bar__group-item___L1pJ8","gnCompositeBarGroupItem":"CompositeBar-module__gn-composite-bar__group-item___L1pJ8","gn-composite-bar__menu-group-item_edit":"CompositeBar-module__gn-composite-bar__menu-group-item_edit___Es8er","gnCompositeBarMenuGroupItemEdit":"CompositeBar-module__gn-composite-bar__menu-group-item_edit___Es8er","gn-composite-bar__menu-group-item_compact":"CompositeBar-module__gn-composite-bar__menu-group-item_compact___-7tZl","gnCompositeBarMenuGroupItemCompact":"CompositeBar-module__gn-composite-bar__menu-group-item_compact___-7tZl","gn-composite-bar__menu-group-header_collapsed":"CompositeBar-module__gn-composite-bar__menu-group-header_collapsed___bTXn1","gnCompositeBarMenuGroupHeaderCollapsed":"CompositeBar-module__gn-composite-bar__menu-group-header_collapsed___bTXn1","gn-composite-bar__menu-item_type_regular":"CompositeBar-module__gn-composite-bar__menu-item_type_regular___8DHUR","gnCompositeBarMenuItemTypeRegular":"CompositeBar-module__gn-composite-bar__menu-item_type_regular___8DHUR","gn-composite-bar__menu-group_expanded":"CompositeBar-module__gn-composite-bar__menu-group_expanded___GY0oS","gnCompositeBarMenuGroupExpanded":"CompositeBar-module__gn-composite-bar__menu-group_expanded___GY0oS","gn-composite-bar__menu-group-toggle":"CompositeBar-module__gn-composite-bar__menu-group-toggle___4--VW","gnCompositeBarMenuGroupToggle":"CompositeBar-module__gn-composite-bar__menu-group-toggle___4--VW","gn-composite-bar__menu-group-toggle-placeholder":"CompositeBar-module__gn-composite-bar__menu-group-toggle-placeholder___vAqkn","gnCompositeBarMenuGroupTogglePlaceholder":"CompositeBar-module__gn-composite-bar__menu-group-toggle-placeholder___vAqkn","gn-composite-bar__menu-group-icon":"CompositeBar-module__gn-composite-bar__menu-group-icon___YVg-C","gnCompositeBarMenuGroupIcon":"CompositeBar-module__gn-composite-bar__menu-group-icon___YVg-C","gn-composite-bar__menu-item":"CompositeBar-module__gn-composite-bar__menu-item___zaw-R","gnCompositeBarMenuItem":"CompositeBar-module__gn-composite-bar__menu-item___zaw-R"};
 export { styles as default };
 //# sourceMappingURL=CompositeBar.module.scss.js.map

package/build/esm/components/AsideHeader/components/CompositeBar/HighlightedItem/HighlightedItem.css CHANGED Viewed

	@@ -1 +1 @@
1	- .HighlightedItem-module__gn-composite-bar-highlighted-item___8jg4a{--_--background-color:var(--g-color-base-background);--_--item-~~icon-~~background-~~size:38px;--_--item-background-~~color-hover:var(--g-color-base-selection-hover);--_--item-selected-background-color-active:var(--g-color-base-selection);display:flex;justify-content:center;position:absolute;z-index:10000}.HighlightedItem-module__gn-composite-bar-highlighted-item__icon___zlo6v{align-items:center;background-color:var(--gn-aside-header-background-color,var(--_--background-color));border-radius:7px;box-shadow:0 8px 20px 0 var(--g-color-sfx-shadow);cursor:pointer;display:flex;height:var(--~~gn-aside-header-item-icon-background-size,var(--~~_--item-~~icon-background-size~~));justify-content:center;overflow:hidden;position:relative;transform:translateY(1px);width:var(--~~gn-aside-header-item-icon-background-size,var(--~~_--item-~~icon-background-size~~))}.HighlightedItem-module__gn-composite-bar-highlighted-item__icon___zlo6v:before{background-color:var(--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color-active));content:"";height:100%;position:absolute;width:100%;z-index:-1}.HighlightedItem-module__gn-composite-bar-highlighted-item__icon___zlo6v:hover:before{background-color:var(--gn-aside-header-item-background-color-hover,var(--_--item-background-color-hover))}
1	+ .HighlightedItem-module__gn-composite-bar-highlighted-item___8jg4a{--_--background-color:var(--g-color-base-background);--_--item-background-color-hover:var(--g-color-base-selection-hover);--_--item-selected-background-color-active:var(--g-color-base-selection);display:flex;justify-content:center;position:absolute;z-index:10000}.HighlightedItem-module__gn-composite-bar-highlighted-item__icon___zlo6v{align-items:center;background-color:var(--gn-aside-header-background-color,var(--_--background-color));border-radius:7px;box-shadow:0 8px 20px 0 var(--g-color-sfx-shadow);cursor:pointer;display:flex;height:var(--_--item-height,36px);justify-content:center;overflow:hidden;position:relative;transform:translateY(1px);width:var(--_--item-height,36px)}.HighlightedItem-module__gn-composite-bar-highlighted-item__icon___zlo6v:before{background-color:var(--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color-active));content:"";height:100%;position:absolute;width:100%;z-index:-1}.HighlightedItem-module__gn-composite-bar-highlighted-item__icon___zlo6v:hover:before{background-color:var(--gn-aside-header-item-background-color-hover,var(--_--item-background-color-hover))}

package/build/esm/components/AsideHeader/components/CompositeBar/Item/Item.css CHANGED Viewed

@@ -1 +1,25 @@
-.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;--_--item-icon-background-size:36px;--_--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-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%;min-width:0;padding:0;width:100%}.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-icon-background-size,36px)}.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;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 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(--g-color-base-float);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(--g-color-base-float-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_item-type_action___HUhUR{margin-left:10px}.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))}.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)))}.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))}.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%;margin-left:-18px;margin-top:-18px;position:absolute;top: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%;margin-left:-18px;margin-top:-18px;position:absolute;top: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%;margin-left:-18px;margin-top:-18px;position:absolute;top:50%;width:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));z-index:-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(
+      --gn-aside-header-item-background-color-hover,var(--_--item-background-color-hover)
+  );--_--zone-current-bg:var(
+      --gn-aside-header-item-current-background-color,var(--_--item-selected-background-color)
+  );--_--zone-current-bg-hover:var(
+      --gn-aside-header-item-current-background-color-hover,var(--_--zone-current-bg)
+  );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(
+      --gn-aside-top-item-background-color-hover,var(--_--item-background-color-hover)
+  );--_--zone-current-bg:var(
+      --gn-aside-top-item-current-background-color,var(--_--item-selected-background-color)
+  );--_--zone-current-bg-hover:var(
+      --gn-aside-top-item-current-background-color-hover,var(--_--zone-current-bg)
+  )}.gn-composite-bar__menu-group_wrapper .Item-module__gn-composite-bar-item___-pkx5{--_--zone-bg-hover:var(
+      --gn-aside-main-group-item-background-color-hover,var(--_--item-background-color-hover)
+  );--_--zone-current-bg:var(
+      --gn-aside-main-group-item-current-background-color,var(--_--item-selected-background-color)
+  );--_--zone-current-bg-hover:var(
+      --gn-aside-main-group-item-current-background-color-hover,var(--_--zone-current-bg)
+  )}.gn-footer-item .Item-module__gn-composite-bar-item___-pkx5{--_--zone-bg-hover:var(
+      --gn-aside-bottom-item-background-color-hover,var(--_--item-background-color-hover)
+  );--_--zone-current-bg:var(
+      --gn-aside-bottom-item-current-background-color,var(--_--item-selected-background-color)
+  );--_--zone-current-bg-hover:var(
+      --gn-aside-bottom-item-current-background-color-hover,var(--_--zone-current-bg)
+  )}.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}

package/build/esm/components/AsideHeader/components/CompositeBar/Item/Item.d.ts CHANGED Viewed

@@ -1,9 +1,14 @@
 import React from 'react';
-import { AsideHeaderItem } from 'src/components/AsideHeader/types';
+import { AsideHeaderItem, SetCollapseBlocker } from '../../../types';
 export interface ItemProps extends AsideHeaderItem {
 }
 interface ItemInnerProps extends ItemProps {
-    compact?: boolean;
+    /** Registers a temporary block on collapse (e.g. while dropdown is open). Returns release function. */
+    setCollapseBlocker?: SetCollapseBlocker;
+    /** When `true`, the item is displayed in expanded form. */
+    isExpanded?: boolean;
+    /** Layout mode: 'horizontal' shows icon only, 'vertical' shows icon and title. Used in FooterBar. */
+    layout?: 'horizontal' | 'vertical';
     className?: string;
     onMouseEnter?: () => void;
     onMouseLeave?: () => void;

package/build/esm/components/AsideHeader/components/CompositeBar/Item/Item.js CHANGED Viewed

@@ -30,10 +30,22 @@ function renderItemTitle(params) {
 const defaultPopupPlacement = ['right-end'];
 const defaultPopupOffset = { mainAxis: 8, crossAxis: -20 };
 const Item = (props) => {
-    const { className, onMouseLeave, onMouseEnter, popupVisible = false, popupRef: anchoreRefProp, popupPlacement = defaultPopupPlacement, popupOffset = defaultPopupOffset, popupKeepMounted, renderPopupContent, onOpenChangePopup, onItemClick, onItemClickCapture, itemWrapper, bringForward, rightAdornment, title, href, qa, compact, editMode = false, onToggleVisibility, hidden, preventUserRemoving, } = props;
+    const { className, onMouseLeave, onMouseEnter, popupVisible = false, popupRef: anchoreRefProp, popupPlacement = defaultPopupPlacement, popupOffset = defaultPopupOffset, popupKeepMounted, renderPopupContent, onOpenChangePopup, onItemClick, onItemClickCapture, itemWrapper, bringForward, rightAdornment, title, href, qa, isExpanded = true, layout = 'vertical', editMode = false, onToggleVisibility, setCollapseBlocker, hidden, preventUserRemoving, } = props;
     const ref = React__default.useRef(null);
     const anchorRef = (anchoreRefProp === null || anchoreRefProp === undefined ? undefined : anchoreRefProp.current) ? anchoreRefProp : ref;
     const highlightedRef = React__default.useRef(null);
+    React__default.useEffect(() => {
+        let didBlock = false;
+        if (popupVisible) {
+            didBlock = true;
+            setCollapseBlocker === null || setCollapseBlocker === undefined ? undefined : setCollapseBlocker(true);
+        }
+        return () => {
+            if (didBlock) {
+                setCollapseBlocker === null || setCollapseBlocker === undefined ? undefined : setCollapseBlocker(false);
+            }
+        };
+    }, [popupVisible, setCollapseBlocker]);
     const type = props.type || ITEM_TYPE_REGULAR;
     const current = props.current || false;
     const icon = props.icon;
@@ -57,21 +69,22 @@ const Item = (props) => {
         return React__default.createElement("div", { className: b('menu-divider') });
     }
     const makeIconNode = (iconEl) => {
-        return compact ? React__default.createElement("div", { className: b('btn-icon') }, iconEl) : iconEl;
+        return isExpanded ? iconEl : React__default.createElement("div", { className: b('btn-icon') }, iconEl);
     };
     const makeNode = ({ icon: iconEl, title: titleEl }) => {
         const [Tag, tagProps] = href ? ['a', { href }] : ['button', {}];
+        const ariaLabel = typeof title === 'string' ? title : undefined;
         const createdNode = (React__default.createElement(React__default.Fragment, null,
-            React__default.createElement(Tag, Object.assign({}, tagProps, { className: b({ type, current, compact }, className), ref: ref, "data-qa": qa, onClick: (event) => {
-                    onItemClick === null || onItemClick === undefined ? undefined : onItemClick(props, false, event);
+            React__default.createElement(Tag, Object.assign({}, tagProps, { className: b({ type, current, collapsed: !isExpanded }, className), ref: ref, "data-qa": qa, "data-type": type, "aria-label": ariaLabel, onClick: (event) => {
+                    onItemClick === null || onItemClick === undefined ? undefined : onItemClick(props, false, event, { setCollapseBlocker });
                 }, onClickCapture: onItemClickCapture, onMouseEnter: () => {
                     onMouseEnter === null || onMouseEnter === undefined ? undefined : onMouseEnter();
                 }, onMouseLeave: () => {
                     onMouseLeave === null || onMouseLeave === undefined ? undefined : onMouseLeave();
                 } }),
                 React__default.createElement("div", { className: b('icon-place'), ref: highlightedRef }, makeIconNode(iconEl)),
-                React__default.createElement(CSSTransition, { in: !compact, timeout: ASIDE_HEADER_EXPAND_TRANSITION_DELAY, classNames: itemTransitionClasses },
-                    React__default.createElement("div", { className: b('title'), title: typeof title === 'string' ? title : undefined }, titleEl)),
+                layout === 'vertical' && (React__default.createElement(CSSTransition, { in: isExpanded, timeout: ASIDE_HEADER_EXPAND_TRANSITION_DELAY, classNames: itemTransitionClasses },
+                    React__default.createElement("div", { className: b('title'), title: typeof title === 'string' ? title : undefined }, titleEl))),
                 editMode && !preventUserRemoving && onToggleVisibility ? (React__default.createElement(Button, { onClick: onPinButtonClick, view: hidden ? 'flat-secondary' : 'flat-action', className: b('visibility-button') },
                     React__default.createElement(Button.Icon, null, hidden ? React__default.createElement(Pin, null) : React__default.createElement(PinFill, null)))) : null),
             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()))));
@@ -82,7 +95,12 @@ const Item = (props) => {
     const params = { icon: iconNode, title: titleNode };
     let highlightedNode = null;
     let node;
-    const opts = { compact: Boolean(compact), collapsed: false, item: props, ref };
+    const opts = {
+        isExpanded,
+        item: props,
+        ref,
+        setCollapseBlocker,
+    };
     if (typeof itemWrapper === 'function') {
         node = itemWrapper(params, makeNode, opts);
         highlightedNode =
@@ -94,7 +112,7 @@ const Item = (props) => {
         highlightedNode = bringForward && makeIconNode(iconNode);
     }
     return (React__default.createElement(React__default.Fragment, null,
-        bringForward && (React__default.createElement(HighlightedItem, { iconNode: highlightedNode, iconRef: highlightedRef, onClick: (event) => onItemClick === null || onItemClick === undefined ? undefined : onItemClick(props, false, event), onClickCapture: onItemClickCapture })),
+        bringForward && (React__default.createElement(HighlightedItem, { iconNode: highlightedNode, iconRef: highlightedRef, onClick: (event) => onItemClick === null || onItemClick === undefined ? undefined : onItemClick(props, false, event, { setCollapseBlocker }), onClickCapture: onItemClickCapture })),
         node));
 };
 Item.displayName = 'Item';

package/build/esm/components/AsideHeader/components/CompositeBar/Item/Item.js.map CHANGED Viewed

	@@ -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 {AsideHeaderItem} from 'src/components/AsideHeader/types';\n\nimport {ASIDE_HEADER_EXPAND_TRANSITION_DELAY, ASIDE_HEADER_ICON_SIZE} from '../../../../constants';\nimport {MakeItemParams} from '../../../../types';\nimport {createBlock} from '../../../../utils/cn';\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 compact?: boolean;\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 compact,\n editMode = false,\n onToggleVisibility,\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 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 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 compact ? <div className={b('btn-icon')}>{iconEl}</div> : iconEl;\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 createdNode = (\n <React.Fragment>\n <Tag\n {...tagProps}\n className={b({type, current, compact}, className)}\n ref={ref}\n data-qa={qa}\n onClick={(event: React.MouseEvent<HTMLElement, MouseEvent>) => {\n onItemClick?.(props, false, event);\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 <CSSTransition\n in={!compact}\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 {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 = {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	+ {"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":";;;;;;;;;;AAeA,MAAM,CAAC,GAAG,WAAW,CAAC,oBAAoB,EAAE,MAAM,CAAC;AAEnD,MAAM,qBAAqB,GAAG;AAC1B,IAAA,KAAK,EAAE,CAAC,CAAC,wBAAwB,CAAC;AAClC,IAAA,WAAW,EAAE,CAAC,CAAC,+BAA+B,CAAC;AAC/C,IAAA,SAAS,EAAE,CAAC,CAAC,6BAA6B,CAAC;AAC3C,IAAA,IAAI,EAAE,CAAC,CAAC,uBAAuB,CAAC;AAChC,IAAA,UAAU,EAAE,CAAC,CAAC,8BAA8B,CAAC;AAC7C,IAAA,QAAQ,EAAE,CAAC,CAAC,4BAA4B,CAAC;CAC5C;AAkBD,SAAS,eAAe,CAAC,MAAyD,EAAA;AAC9E,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;AAEA,MAAM,qBAAqB,GAAmB,CAAC,WAAW,CAAC;AAC3D,MAAM,kBAAkB,GAAsC,EAAC,QAAQ,EAAE,CAAC,EAAE,SAAS,EAAE,GAAG,EAAC;AAE9E,MAAA,IAAI,GAA6B,CAAC,KAAK,KAAI;AACpD,IAAA,MAAM,EACF,SAAS,EACT,YAAY,EACZ,YAAY,EACZ,YAAY,GAAG,KAAK,EACpB,QAAQ,EAAE,cAAc,EACxB,cAAc,GAAG,qBAAqB,EACtC,WAAW,GAAG,kBAAkB,EAChC,gBAAgB,EAChB,kBAAkB,EAClB,iBAAiB,EACjB,WAAW,EACX,kBAAkB,EAClB,WAAW,EACX,YAAY,EACZ,cAAc,EACd,KAAK,EACL,IAAI,EACJ,EAAE,EACF,UAAU,GAAG,IAAI,EACjB,MAAM,GAAG,UAAU,EACnB,QAAQ,GAAG,KAAK,EAChB,kBAAkB,EAClB,kBAAkB,EAClB,MAAM,EACN,mBAAmB,GACtB,GAAG,KAAK;IAET,MAAM,GAAG,GAAGA,cAAK,CAAC,MAAM,CAAwC,IAAI,CAAC;AACrE,IAAA,MAAM,SAAS,GAAG,CAAA,cAAc,KAAd,IAAA,IAAA,cAAc,6BAAd,cAAc,CAAE,OAAO,IAAG,cAAc,GAAG,GAAG;IAChE,MAAM,cAAc,GAAGA,cAAK,CAAC,MAAM,CAAiB,IAAI,CAAC;AAEzD,IAAAA,cAAK,CAAC,SAAS,CAAC,MAAK;QACjB,IAAI,QAAQ,GAAG,KAAK;QAEpB,IAAI,YAAY,EAAE;YACd,QAAQ,GAAG,IAAI;AAEf,YAAA,kBAAkB,aAAlB,kBAAkB,KAAA,SAAA,GAAA,SAAA,GAAlB,kBAAkB,CAAG,IAAI,CAAC;;AAG9B,QAAA,OAAO,MAAK;YACR,IAAI,QAAQ,EAAE;AACV,gBAAA,kBAAkB,aAAlB,kBAAkB,KAAA,SAAA,GAAA,SAAA,GAAlB,kBAAkB,CAAG,KAAK,CAAC;;AAEnC,SAAC;AACL,KAAC,EAAE,CAAC,YAAY,EAAE,kBAAkB,CAAC,CAAC;AAEtC,IAAA,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,IAAI,iBAAiB;AAC5C,IAAA,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,IAAI,KAAK;AACtC,IAAA,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI;AACvB,IAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,QAAQ,IAAI,sBAAsB;AACzD,IAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM;IAE3B,MAAM,gBAAgB,GAAGA,cAAK,CAAC,WAAW,CACtC,CAAC,CAAsC,KAAI;QACvC,CAAC,CAAC,eAAe,EAAE;QACnB,CAAC,CAAC,cAAc,EAAE;AAClB,QAAA,kBAAkB,KAAlB,IAAA,IAAA,kBAAkB,KAAlB,SAAA,GAAA,SAAA,GAAA,kBAAkB,EAAI;AAC1B,KAAC,EACD,CAAC,kBAAkB,CAAC,CACvB;AAED,IAAA,MAAM,qBAAqB,GAAGA,cAAK,CAAC,WAAW,CAC3C,CAAC,OAAO,EAAE,KAAK,EAAE,MAAM,KAAI;;QACvB,IACI,KAAK,YAAY,UAAU;AAC3B,YAAA,KAAK,CAAC,MAAM;AACZ,aAAA,CAAA,EAAA,GAAA,GAAG,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC,CAAA,EAC7C;YACE;;QAGJ,iBAAiB,KAAA,IAAA,IAAjB,iBAAiB,KAAA,SAAA,GAAA,SAAA,GAAjB,iBAAiB,CAAG,OAAO,EAAE,KAAK,EAAE,MAAM,CAAC;AAC/C,KAAC,EACD,CAAC,iBAAiB,CAAC,CACtB;AAED,IAAA,IAAI,IAAI,KAAK,SAAS,EAAE;QACpB,OAAOA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,cAAc,CAAC,GAAI;;AAGhD,IAAA,MAAM,YAAY,GAAG,CAAC,MAAuB,KAAqB;AAC9D,QAAA,OAAO,UAAU,GAAG,MAAM,GAAGA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,UAAU,CAAC,EAAG,EAAA,MAAM,CAAO;AAC9E,KAAC;AAED,IAAA,MAAM,QAAQ,GAAG,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAiB,KAAI;QAChE,MAAM,CAAC,GAAG,EAAE,QAAQ,CAAC,GAAG,IAAI,GAAG,CAAC,GAAY,EAAE,EAAC,IAAI,EAAC,CAAC,GAAG,CAAC,QAAiB,EAAE,EAAE,CAAC;AAC/E,QAAA,MAAM,SAAS,GAAG,OAAO,KAAK,KAAK,QAAQ,GAAG,KAAK,GAAG,SAAS;AAE/D,QAAA,MAAM,WAAW,IACbA,cAAC,CAAA,aAAA,CAAAA,cAAK,CAAC,QAAQ,EAAA,IAAA;AACX,YAAAA,cAAA,CAAA,aAAA,CAAC,GAAG,EACI,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,QAAQ,EACZ,EAAA,SAAS,EAAE,CAAC,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,UAAU,EAAC,EAAE,SAAS,CAAC,EAChE,GAAG,EAAE,GAAG,aACC,EAAE,EAAA,WAAA,EACA,IAAI,EAAA,YAAA,EACH,SAAS,EACrB,OAAO,EAAE,CAAC,KAAgD,KAAI;AAC1D,oBAAA,WAAW,KAAX,IAAA,IAAA,WAAW,KAAX,SAAA,GAAA,SAAA,GAAA,WAAW,CAAG,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,EAAC,kBAAkB,EAAC,CAAC;iBAC3D,EACD,cAAc,EAAE,kBAAkB,EAClC,YAAY,EAAE,MAAK;AACf,oBAAA,YAAY,KAAZ,IAAA,IAAA,YAAY,KAAZ,SAAA,GAAA,SAAA,GAAA,YAAY,EAAI;AACpB,iBAAC,EACD,YAAY,EAAE,MAAK;AACf,oBAAA,YAAY,KAAZ,IAAA,IAAA,YAAY,KAAZ,SAAA,GAAA,SAAA,GAAA,YAAY,EAAI;iBACnB,EAAA,CAAA;AAED,gBAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,EAAE,GAAG,EAAE,cAAc,EAC/C,EAAA,YAAY,CAAC,MAAM,CAAC,CACnB;AAEL,gBAAA,MAAM,KAAK,UAAU,KAClBA,cAAA,CAAA,aAAA,CAAC,aAAa,EACV,EAAA,EAAE,EAAE,UAAU,EACd,OAAO,EAAE,oCAAoC,EAC7C,UAAU,EAAE,qBAAqB,EAAA;oBAEjCA,cACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,EACrB,KAAK,EAAE,OAAO,KAAK,KAAK,QAAQ,GAAG,KAAK,GAAG,SAAS,EAEnD,EAAA,OAAO,CACN,CACM,CACnB;AAEA,gBAAA,QAAQ,IAAI,CAAC,mBAAmB,IAAI,kBAAkB,IACnDA,cAAC,CAAA,aAAA,CAAA,MAAM,EACH,EAAA,OAAO,EAAE,gBAAgB,EACzB,IAAI,EAAE,MAAM,GAAG,gBAAgB,GAAG,aAAa,EAC/C,SAAS,EAAE,CAAC,CAAC,mBAAmB,CAAC,EAAA;oBAEjCA,cAAC,CAAA,aAAA,CAAA,MAAM,CAAC,IAAI,EAAE,IAAA,EAAA,MAAM,GAAGA,cAAC,CAAA,aAAA,CAAA,GAAG,EAAG,IAAA,CAAA,GAAGA,cAAA,CAAA,aAAA,CAAC,OAAO,EAAA,IAAA,CAAG,CAAe,CACtD,IACT,IAAI,CACN;YACL,kBAAkB,IAAI,OAAO,CAAC,SAAS,KAAA,IAAA,IAAT,SAAS,KAAT,SAAA,GAAA,SAAA,GAAA,SAAS,CAAE,OAAO,CAAC,KAC9CA,cAAC,CAAA,aAAA,CAAA,KAAK,EACF,EAAA,QAAQ,EAAC,OAAO,EAChB,IAAI,EAAE,YAAY,EAClB,WAAW,EAAE,gBAAgB,EAC7B,SAAS,EAAE,cAAc,EACzB,MAAM,EAAE,WAAW,EACnB,aAAa,EAAE,SAAS,CAAC,OAAO,EAChC,YAAY,EAAE,qBAAqB,EAElC,EAAA,kBAAkB,EAAE,CACjB,CACX,CACY,CACpB;AAED,QAAA,OAAO,WAAW;AACtB,KAAC;AAED,IAAA,MAAM,QAAQ,GAAG,IAAI,IACjBA,cAAC,CAAA,aAAA,CAAA,IAAI,IAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,GAAI,IACtE,IAAI;IACR,MAAM,SAAS,GAAG,eAAe,CAAC,EAAC,KAAK,EAAE,cAAc,EAAC,CAAC;IAC1D,MAAM,MAAM,GAAG,EAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAC;IACjD,IAAI,eAAe,GAAG,IAAI;AAC1B,IAAA,IAAI,IAAI;AAER,IAAA,MAAM,IAAI,GAAG;QACT,UAAU;AACV,QAAA,IAAI,EAAE,KAAK;QACX,GAAG;QACH,kBAAkB;KACrB;AAED,IAAA,IAAI,OAAO,WAAW,KAAK,UAAU,EAAE;QACnC,IAAI,GAAG,WAAW,CAAC,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAuB;QAChE,eAAe;YACX,YAAY;AACX,gBAAA,WAAW,CACR,MAAM,EACN,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,KAAK,YAAY,CAAC,MAAM,CAAC,EACxC,IAAI,CACgB;;SACzB;AACH,QAAA,IAAI,GAAG,QAAQ,CAAC,MAAM,CAAC;AACvB,QAAA,eAAe,GAAG,YAAY,IAAI,YAAY,CAAC,QAAQ,CAAC;;AAG5D,IAAA,QACIA,cAAA,CAAA,aAAA,CAACA,cAAK,CAAC,QAAQ,EAAA,IAAA;AACV,QAAA,YAAY,KACTA,cAAA,CAAA,aAAA,CAAC,eAAe,EACZ,EAAA,QAAQ,EAAE,eAAe,EACzB,OAAO,EAAE,cAAc,EACvB,OAAO,EAAE,CAAC,KAAgD,KACtD,WAAW,KAAA,IAAA,IAAX,WAAW,KAAX,SAAA,GAAA,SAAA,GAAA,WAAW,CAAG,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,EAAC,kBAAkB,EAAC,CAAC,EAE5D,cAAc,EAAE,kBAAkB,GACpC,CACL;QACA,IAAI,CACQ;AAEzB;AAEA,IAAI,CAAC,WAAW,GAAG,MAAM;;;;"}

package/build/esm/components/AsideHeader/components/CompositeBar/Item/Item.module.scss.js CHANGED Viewed

@@ -1,4 +1,4 @@
-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__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__transition-title-enter":"Item-module__gn-composite-bar-item__transition-title-enter___4n6yR","gnCompositeBarItemTransitionTitleEnter":"Item-module__gn-composite-bar-item__transition-title-enter___4n6yR","gn-composite-bar-item__transition-title-enter-active":"Item-module__gn-composite-bar-item__transition-title-enter-active___AAvSZ","gnCompositeBarItemTransitionTitleEnterActive":"Item-module__gn-composite-bar-item__transition-title-enter-active___AAvSZ","gn-composite-bar-item__transition-title-enter-done":"Item-module__gn-composite-bar-item__transition-title-enter-done___Ilzkv","gnCompositeBarItemTransitionTitleEnterDone":"Item-module__gn-composite-bar-item__transition-title-enter-done___Ilzkv","gn-composite-bar-item__transition-title-exit":"Item-module__gn-composite-bar-item__transition-title-exit___5-JKk","gnCompositeBarItemTransitionTitleExit":"Item-module__gn-composite-bar-item__transition-title-exit___5-JKk","gn-composite-bar-item__transition-title-exit-active":"Item-module__gn-composite-bar-item__transition-title-exit-active___Dif7T","gnCompositeBarItemTransitionTitleExitActive":"Item-module__gn-composite-bar-item__transition-title-exit-active___Dif7T","gn-composite-bar-item__transition-title-exit-done":"Item-module__gn-composite-bar-item__transition-title-exit-done___PJvzY","gnCompositeBarItemTransitionTitleExitDone":"Item-module__gn-composite-bar-item__transition-title-exit-done___PJvzY","gn-composite-bar-item__visibility-button":"Item-module__gn-composite-bar-item__visibility-button___QaJg-","gnCompositeBarItemVisibilityButton":"Item-module__gn-composite-bar-item__visibility-button___QaJg-","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_compact":"Item-module__gn-composite-bar-item_compact___PVTeM","gnCompositeBarItemCompact":"Item-module__gn-composite-bar-item_compact___PVTeM","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"};
+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__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_current":"Item-module__gn-composite-bar-item_current___NT2hB","gnCompositeBarItemCurrent":"Item-module__gn-composite-bar-item_current___NT2hB","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__transition-title-enter":"Item-module__gn-composite-bar-item__transition-title-enter___4n6yR","gnCompositeBarItemTransitionTitleEnter":"Item-module__gn-composite-bar-item__transition-title-enter___4n6yR","gn-composite-bar-item__transition-title-enter-active":"Item-module__gn-composite-bar-item__transition-title-enter-active___AAvSZ","gnCompositeBarItemTransitionTitleEnterActive":"Item-module__gn-composite-bar-item__transition-title-enter-active___AAvSZ","gn-composite-bar-item__transition-title-enter-done":"Item-module__gn-composite-bar-item__transition-title-enter-done___Ilzkv","gnCompositeBarItemTransitionTitleEnterDone":"Item-module__gn-composite-bar-item__transition-title-enter-done___Ilzkv","gn-composite-bar-item__transition-title-exit":"Item-module__gn-composite-bar-item__transition-title-exit___5-JKk","gnCompositeBarItemTransitionTitleExit":"Item-module__gn-composite-bar-item__transition-title-exit___5-JKk","gn-composite-bar-item__transition-title-exit-active":"Item-module__gn-composite-bar-item__transition-title-exit-active___Dif7T","gnCompositeBarItemTransitionTitleExitActive":"Item-module__gn-composite-bar-item__transition-title-exit-active___Dif7T","gn-composite-bar-item__transition-title-exit-done":"Item-module__gn-composite-bar-item__transition-title-exit-done___PJvzY","gnCompositeBarItemTransitionTitleExitDone":"Item-module__gn-composite-bar-item__transition-title-exit-done___PJvzY","gn-composite-bar-item__visibility-button":"Item-module__gn-composite-bar-item__visibility-button___QaJg-","gnCompositeBarItemVisibilityButton":"Item-module__gn-composite-bar-item__visibility-button___QaJg-","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_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_collapsed":"Item-module__gn-composite-bar-item_collapsed___Ichlf","gnCompositeBarItemCollapsed":"Item-module__gn-composite-bar-item_collapsed___Ichlf"};
 export { styles as default };
 //# sourceMappingURL=Item.module.scss.js.map

package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.css ADDED Viewed

@@ -0,0 +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:hidden auto;scrollbar-width:none;width:100%}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollable-inner___yRIza::-webkit-scrollbar{display:none}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollbar___igCbU{bottom:0;box-sizing:border-box;padding:2px 0;position:absolute;right:2px;top:0;width:var(--g-spacing-1)}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollbar-track___u6MVN{background:var(--gn-aside-scrollbar-track-color,transparent);cursor:pointer;height:100%;position:relative;width:100%}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollbar-thumb___bLf6h{background:var(--gn-aside-scrollbar-handle-color,var(--g-color-line-generic-solid));cursor:grab;left:0;min-height:20px;position:absolute;width:100%}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollbar-thumb___bLf6h:hover{background:var(--gn-aside-scrollbar-handle-color-hover,var(--gn-aside-scrollbar-handle-color,var(--g-color-line-generic-solid)))}.ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollbar-thumb___bLf6h:active{cursor:grabbing}.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 80%,transparent 0,rgba(0,0,0,.4))}

package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.d.ts ADDED Viewed

@@ -0,0 +1,8 @@
+import React, { FC, ReactNode } from 'react';
+type ScrollableWithScrollbarProps = {
+    children: ReactNode;
+    className?: string;
+    recalcDeps?: React.DependencyList;
+};
+export declare const ScrollableWithScrollbar: FC<ScrollableWithScrollbarProps>;
+export {};

package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.js ADDED Viewed

@@ -0,0 +1,25 @@
+import './ScrollableWithScrollbar.css';
+import React__default, { useId } from 'react';
+import { createBlock } from '../../../../utils/cn.js';
+import { useScrollbar } from './useScrollbar.js';
+import styles from './ScrollableWithScrollbar.module.scss.js';
+const b = createBlock('scrollable-with-scrollbar', styles);
+const EMPTY_DEPS = [];
+const ScrollableWithScrollbar = ({ children, className, recalcDeps = EMPTY_DEPS, }) => {
+    const scrollableContentId = useId();
+    const { scrollRef, scrollState, updateScrollState, showScrollbar, thumbHeight, thumbTop, handleThumbMouseDown, handleTrackClick, handleScrollbarKeyDown, } = useScrollbar({ recalcDeps });
+    const hasContentBelow = scrollState.scrollHeight > scrollState.clientHeight &&
+        scrollState.scrollTop + scrollState.clientHeight < scrollState.scrollHeight - 1;
+    return (React__default.createElement("div", { className: b({ 'bottom-shadow': hasContentBelow }, className) },
+        React__default.createElement("div", { id: scrollableContentId, ref: scrollRef, className: b('scrollable-inner'), onScroll: updateScrollState }, children),
+        showScrollbar && (React__default.createElement("div", { className: b('scrollbar'), role: "scrollbar", "aria-controls": scrollableContentId, "aria-orientation": "vertical", "aria-valuenow": scrollState.scrollTop, "aria-valuemin": 0, "aria-valuemax": scrollState.scrollHeight - scrollState.clientHeight, tabIndex: 0, onKeyDown: handleScrollbarKeyDown },
+            React__default.createElement("div", { className: b('scrollbar-track'), onClick: handleTrackClick },
+                React__default.createElement("div", { className: b('scrollbar-thumb'), style: {
+                        height: thumbHeight,
+                        transform: `translateY(${thumbTop}px)`,
+                    }, onMouseDown: handleThumbMouseDown }))))));
+};
+export { ScrollableWithScrollbar };
+//# sourceMappingURL=ScrollableWithScrollbar.js.map

package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ScrollableWithScrollbar.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.tsx"],"sourcesContent":["import React, {FC, ReactNode, useId} from 'react';\n\nimport {createBlock} from '../../../../utils/cn';\n\nimport {useScrollbar} from './useScrollbar';\n\nimport styles from './ScrollableWithScrollbar.module.scss';\n\nconst b = createBlock('scrollable-with-scrollbar', styles);\n\nconst EMPTY_DEPS: React.DependencyList = [];\n\ntype ScrollableWithScrollbarProps = {\n children: ReactNode;\n className?: string;\n recalcDeps?: React.DependencyList;\n};\n\nexport const ScrollableWithScrollbar: FC<ScrollableWithScrollbarProps> = ({\n children,\n className,\n recalcDeps = EMPTY_DEPS,\n}) => {\n const scrollableContentId = useId();\n const {\n scrollRef,\n scrollState,\n updateScrollState,\n showScrollbar,\n thumbHeight,\n thumbTop,\n handleThumbMouseDown,\n handleTrackClick,\n handleScrollbarKeyDown,\n } = useScrollbar({recalcDeps});\n\n const hasContentBelow =\n scrollState.scrollHeight > scrollState.clientHeight &&\n scrollState.scrollTop + scrollState.clientHeight < scrollState.scrollHeight - 1;\n\n return (\n <div className={b({'bottom-shadow': hasContentBelow}, className)}>\n <div\n id={scrollableContentId}\n ref={scrollRef}\n className={b('scrollable-inner')}\n onScroll={updateScrollState}\n >\n {children}\n </div>\n\n {showScrollbar && (\n <div\n className={b('scrollbar')}\n role=\"scrollbar\"\n aria-controls={scrollableContentId}\n aria-orientation=\"vertical\"\n aria-valuenow={scrollState.scrollTop}\n aria-valuemin={0}\n aria-valuemax={scrollState.scrollHeight - scrollState.clientHeight}\n tabIndex={0}\n onKeyDown={handleScrollbarKeyDown}\n >\n <div className={b('scrollbar-track')} onClick={handleTrackClick}>\n <div\n className={b('scrollbar-thumb')}\n style={{\n height: thumbHeight,\n transform: `translateY(${thumbTop}px)`,\n }}\n onMouseDown={handleThumbMouseDown}\n />\n </div>\n </div>\n )}\n </div>\n );\n};\n"],"names":["React"],"mappings":";;;;;AAQA,MAAM,CAAC,GAAG,WAAW,CAAC,2BAA2B,EAAE,MAAM,CAAC;AAE1D,MAAM,UAAU,GAAyB,EAAE;AAQpC,MAAM,uBAAuB,GAAqC,CAAC,EACtE,QAAQ,EACR,SAAS,EACT,UAAU,GAAG,UAAU,GAC1B,KAAI;AACD,IAAA,MAAM,mBAAmB,GAAG,KAAK,EAAE;IACnC,MAAM,EACF,SAAS,EACT,WAAW,EACX,iBAAiB,EACjB,aAAa,EACb,WAAW,EACX,QAAQ,EACR,oBAAoB,EACpB,gBAAgB,EAChB,sBAAsB,GACzB,GAAG,YAAY,CAAC,EAAC,UAAU,EAAC,CAAC;IAE9B,MAAM,eAAe,GACjB,WAAW,CAAC,YAAY,GAAG,WAAW,CAAC,YAAY;AACnD,QAAA,WAAW,CAAC,SAAS,GAAG,WAAW,CAAC,YAAY,GAAG,WAAW,CAAC,YAAY,GAAG,CAAC;AAEnF,IAAA,QACIA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,EAAC,eAAe,EAAE,eAAe,EAAC,EAAE,SAAS,CAAC,EAAA;QAC5DA,cACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,EAAE,EAAE,mBAAmB,EACvB,GAAG,EAAE,SAAS,EACd,SAAS,EAAE,CAAC,CAAC,kBAAkB,CAAC,EAChC,QAAQ,EAAE,iBAAiB,EAAA,EAE1B,QAAQ,CACP;AAEL,QAAA,aAAa,KACVA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,EACzB,IAAI,EAAC,WAAW,mBACD,mBAAmB,EAAA,kBAAA,EACjB,UAAU,EACZ,eAAA,EAAA,WAAW,CAAC,SAAS,mBACrB,CAAC,EAAA,eAAA,EACD,WAAW,CAAC,YAAY,GAAG,WAAW,CAAC,YAAY,EAClE,QAAQ,EAAE,CAAC,EACX,SAAS,EAAE,sBAAsB,EAAA;YAEjCA,cAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAA;gBAC3DA,cACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAC/B,KAAK,EAAE;AACH,wBAAA,MAAM,EAAE,WAAW;wBACnB,SAAS,EAAE,CAAc,WAAA,EAAA,QAAQ,CAAK,GAAA,CAAA;qBACzC,EACD,WAAW,EAAE,oBAAoB,EAAA,CACnC,CACA,CACJ,CACT,CACC;AAEd;;;;"}

package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.module.scss.js ADDED Viewed

@@ -0,0 +1,4 @@
+var styles = {"gn-scrollable-with-scrollbar":"ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar___S-GKS","gnScrollableWithScrollbar":"ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar___S-GKS","gn-scrollable-with-scrollbar_bottom-shadow":"ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar_bottom-shadow___YoCCZ","gnScrollableWithScrollbarBottomShadow":"ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar_bottom-shadow___YoCCZ","gn-scrollable-with-scrollbar__scrollable-inner":"ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollable-inner___yRIza","gnScrollableWithScrollbarScrollableInner":"ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollable-inner___yRIza","gn-scrollable-with-scrollbar__scrollbar":"ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollbar___igCbU","gnScrollableWithScrollbarScrollbar":"ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollbar___igCbU","gn-scrollable-with-scrollbar__scrollbar-track":"ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollbar-track___u6MVN","gnScrollableWithScrollbarScrollbarTrack":"ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollbar-track___u6MVN","gn-scrollable-with-scrollbar__scrollbar-thumb":"ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollbar-thumb___bLf6h","gnScrollableWithScrollbarScrollbarThumb":"ScrollableWithScrollbar-module__gn-scrollable-with-scrollbar__scrollbar-thumb___bLf6h"};
+export { styles as default };
+//# sourceMappingURL=ScrollableWithScrollbar.module.scss.js.map

package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/ScrollableWithScrollbar.module.scss.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"ScrollableWithScrollbar.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/index.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export { ScrollableWithScrollbar } from './ScrollableWithScrollbar';

package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollbar.d.ts ADDED Viewed

@@ -0,0 +1,21 @@
+import React from 'react';
+type ScrollbarState = {
+    scrollTop: number;
+    scrollHeight: number;
+    clientHeight: number;
+};
+type UseScrollbarOptions = {
+    recalcDeps?: React.DependencyList;
+};
+export declare function useScrollbar(options?: UseScrollbarOptions): {
+    scrollRef: React.RefObject<HTMLDivElement>;
+    scrollState: ScrollbarState;
+    updateScrollState: () => void;
+    showScrollbar: boolean;
+    thumbHeight: number;
+    thumbTop: number;
+    handleThumbMouseDown: (e: React.MouseEvent) => void;
+    handleTrackClick: (e: React.MouseEvent<HTMLDivElement>) => void;
+    handleScrollbarKeyDown: (e: React.KeyboardEvent) => void;
+};
+export {};