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

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (454) hide show

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 {ActionTooltip, Icon, List, Popup, PopupPlacement, PopupProps} from '@gravity-ui/uikit';\n\nimport {AsideHeaderItem} from 'src/components/AsideHeader/types';\n\nimport {ASIDE_HEADER_ICON_SIZE} from '../../../../constants';\nimport {MakeItemParams} from '../../../../types';\nimport {createBlock} from '../../../../utils/cn';\nimport {useAsideHeaderInnerContext} from '../../../AsideHeaderContext';\nimport {HighlightedItem} from '../HighlightedItem/HighlightedItem';\nimport {\n COLLAPSE_ITEM_ID,\n ITEM_TYPE_REGULAR,\n POPUP_ITEM_HEIGHT,\n POPUP_PLACEMENT,\n} from '../constants';\nimport {getSelectedItemIndex} from '../utils';\n\nimport styles from './Item.module.scss';\n\nconst b = createBlock('composite-bar-item', styles);\n\nexport interface ItemProps extends AsideHeaderItem {}\n\ninterface ItemInnerProps extends ItemProps {\n className?: string;\n collapseItems?: AsideHeaderItem[];\n onMouseEnter?: () => void;\n onMouseLeave?: () => 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 collapseItems,\n compact,\n onMouseLeave,\n onMouseEnter,\n enableTooltip = true,\n popupVisible = false,\n popupRef: anchoreRefProp,\n popupPlacement = defaultPopupPlacement,\n popupOffset = defaultPopupOffset,\n popupKeepMounted,\n renderPopupContent,\n onOpenChangePopup,\n onItemClick,\n onItemClickCapture,\n itemWrapper,\n bringForward,\n rightAdornment,\n title,\n href,\n qa,\n } = props;\n\n const [open, toggleOpen] = React.useState<boolean>(false);\n\n const ref = React.useRef<HTMLAnchorElement & HTMLButtonElement>(null);\n const anchorRef = anchoreRefProp?.current ? anchoreRefProp : ref;\n const highlightedRef = React.useRef<HTMLDivElement>(null);\n\n const type = props.type \|\| ITEM_TYPE_REGULAR;\n const current = props.current \|\| false;\n const tooltipText = props.tooltipText \|\| props.title;\n const icon = props.icon;\n const iconSize = props.iconSize \|\| ASIDE_HEADER_ICON_SIZE;\n const iconQa = props.iconQa;\n const collapsedItem = props.id === COLLAPSE_ITEM_ID;\n\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 ? (\n <ActionTooltip\n title=\"\"\n description={tooltipText}\n disabled={!enableTooltip \|\| (collapsedItem && open) \|\| popupVisible}\n placement=\"right\"\n className={b('icon-tooltip', {'item-type': type})}\n >\n <div\n onMouseEnter={() => onMouseEnter?.()}\n onMouseLeave={() => onMouseLeave?.()}\n className={b('btn-icon')}\n >\n {iconEl}\n </div>\n </ActionTooltip>\n ) : (\n iconEl\n );\n };\n\n const makeNode = ({icon: iconEl, title: titleEl}: MakeItemParams) => {\n const [Tag, tagProps] = href ? ['a' as const, {href}] : ['button' as const, {}];\n\n const 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 if (collapsedItem) {\n /*\n This is the \"more\" button (three dots) that shows additional menu items in a popup.\n * We call onItemClick with collapsed=true to indicate this is a collapse action.\n /\n toggleOpen(!open);\n onItemClick?.(props, true, event);\n } else {\n onItemClick?.(props, false, event);\n }\n }}\n onClickCapture={onItemClickCapture}\n onMouseEnter={() => {\n if (!compact) {\n onMouseEnter?.();\n }\n }}\n onMouseLeave={() => {\n if (!compact) {\n onMouseLeave?.();\n }\n }}\n >\n <div className={b('icon-place')} ref={highlightedRef}>\n {makeIconNode(iconEl)}\n </div>\n\n <div\n className={b('title')}\n title={typeof title === 'string' ? title : undefined}\n >\n {titleEl}\n </div>\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 {open && collapsedItem && collapseItems?.length && Boolean(anchorRef?.current) && (\n <CollapsedPopup\n {...props}\n anchorRef={anchorRef}\n onOpenChange={() => toggleOpen(false)}\n />\n )}\n </React.Fragment>\n );\n};\n\nItem.displayName = 'Item';\n\ninterface CollapsedPopupProps {\n anchorRef: React.RefObject<HTMLElement>;\n onOpenChange: () => void;\n}\n\nfunction CollapsedPopup({\n onItemClick,\n collapseItems,\n anchorRef,\n onOpenChange,\n}: ItemInnerProps & CollapsedPopupProps) {\n const {compact} = useAsideHeaderInnerContext();\n return collapseItems?.length ? (\n <Popup\n strategy=\"fixed\"\n placement={POPUP_PLACEMENT}\n open={true}\n anchorElement={anchorRef.current}\n onOpenChange={onOpenChange}\n >\n <div className={b('collapse-items-popup-content')}>\n <List\n itemClassName={b('root-collapse-item')}\n items={collapseItems}\n selectedItemIndex={getSelectedItemIndex(collapseItems)}\n itemHeight={POPUP_ITEM_HEIGHT}\n itemsHeight={collapseItems.length POPUP_ITEM_HEIGHT}\n virtualized={false}\n filterable={false}\n sortable={false}\n onItemClick={onOpenChange}\n renderItem={(item) => {\n const makeCollapseNode = ({\n title: titleEl,\n icon: iconEl,\n }: MakeItemParams) => {\n const [Tag, tagProps] = item.href\n ? ['a' as const, {href: item.href}]\n : ['button' as const, {}];\n\n return (\n <Tag\n {...tagProps}\n className={b('collapse-item')}\n onClick={(event: React.MouseEvent<HTMLElement, MouseEvent>) => {\n onItemClick?.(item, true, event);\n }}\n >\n {iconEl}\n {titleEl}\n </Tag>\n );\n };\n\n const titleNode = renderItemTitle(item);\n const iconNode = item.icon && (\n <Icon data={item.icon} size={14} className={b('collapse-item-icon')} />\n );\n\n const params = {title: titleNode, icon: iconNode};\n const opts = {\n compact: Boolean(compact),\n collapsed: true,\n item,\n ref: anchorRef,\n };\n if (typeof item.itemWrapper === 'function') {\n return item.itemWrapper(params, makeCollapseNode, opts);\n } else {\n return makeCollapseNode(params);\n }\n }}\n />\n </div>\n </Popup>\n ) : null;\n}\n"],"names":["React"],"mappings":";;;;;;;;;;AAqBA,MAAM,CAAC,GAAG,WAAW,CAAC,oBAAoB,EAAE,MAAM,CAAC;AAWnD,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;IACpD,MAAM,EACF,SAAS,EACT,aAAa,EACb,OAAO,EACP,YAAY,EACZ,YAAY,EACZ,aAAa,GAAG,IAAI,EACpB,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,GACL,GAAG,KAAK;AAET,IAAA,MAAM,CAAC,IAAI,EAAE,UAAU,CAAC,GAAGA,cAAK,CAAC,QAAQ,CAAU,KAAK,CAAC;IAEzD,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,IAAA,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,IAAI,iBAAiB;AAC5C,IAAA,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,IAAI,KAAK;IACtC,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,IAAI,KAAK,CAAC,KAAK;AACpD,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;AAC3B,IAAA,MAAM,aAAa,GAAG,KAAK,CAAC,EAAE,KAAK,gBAAgB;AAEnD,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;;QAEJ,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;QAC9D,OAAO,OAAO,IACVA,cAAC,CAAA,aAAA,CAAA,aAAa,IACV,KAAK,EAAC,EAAE,EACR,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,CAAC,aAAa,KAAK,aAAa,IAAI,IAAI,CAAC,IAAI,YAAY,EACnE,SAAS,EAAC,OAAO,EACjB,SAAS,EAAE,CAAC,CAAC,cAAc,EAAE,EAAC,WAAW,EAAE,IAAI,EAAC,CAAC,EAAA;AAEjD,YAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACI,YAAY,EAAE,MAAM,YAAY,aAAZ,YAAY,KAAA,SAAA,GAAA,SAAA,GAAZ,YAAY,EAAI,EACpC,YAAY,EAAE,MAAM,YAAY,KAAZ,IAAA,IAAA,YAAY,KAAZ,SAAA,GAAA,SAAA,GAAA,YAAY,EAAI,EACpC,SAAS,EAAE,CAAC,CAAC,UAAU,CAAC,EAAA,EAEvB,MAAM,CACL,CACM,KAEhB,MAAM,CACT;AACL,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;AAE/E,QAAA,MAAM,WAAW,IACbA,cAAC,CAAA,aAAA,CAAAA,cAAK,CAAC,QAAQ,EAAA,IAAA;AACX,YAAAA,cAAA,CAAA,aAAA,CAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACI,QAAQ,EAAA,EACZ,SAAS,EAAE,CAAC,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAC,EAAE,SAAS,CAAC,EACjD,GAAG,EAAE,GAAG,EAAA,SAAA,EACC,EAAE,EACX,OAAO,EAAE,CAAC,KAAgD,KAAI;oBAC1D,IAAI,aAAa,EAAE;AACf;;;AAGG;AACH,wBAAA,UAAU,CAAC,CAAC,IAAI,CAAC;wBACjB,WAAW,KAAA,IAAA,IAAX,WAAW,KAAA,SAAA,GAAA,SAAA,GAAX,WAAW,CAAG,KAAK,EAAE,IAAI,EAAE,KAAK,CAAC;;yBAC9B;wBACH,WAAW,KAAA,IAAA,IAAX,WAAW,KAAA,SAAA,GAAA,SAAA,GAAX,WAAW,CAAG,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;;iBAEzC,EACD,cAAc,EAAE,kBAAkB,EAClC,YAAY,EAAE,MAAK;oBACf,IAAI,CAAC,OAAO,EAAE;AACV,wBAAA,YAAY,KAAZ,IAAA,IAAA,YAAY,KAAZ,SAAA,GAAA,SAAA,GAAA,YAAY,EAAI;;AAExB,iBAAC,EACD,YAAY,EAAE,MAAK;oBACf,IAAI,CAAC,OAAO,EAAE;AACV,wBAAA,YAAY,KAAZ,IAAA,IAAA,YAAY,KAAZ,SAAA,GAAA,SAAA,GAAA,YAAY,EAAI;;iBAEvB,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;gBAENA,cACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,EACrB,KAAK,EAAE,OAAO,KAAK,KAAK,QAAQ,GAAG,KAAK,GAAG,SAAS,EAAA,EAEnD,OAAO,CACN,CACJ;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;IAER,MAAM,IAAI,GAAG,EAAC,OAAO,EAAE,OAAO,CAAC,OAAO,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,EAAC;AAE5E,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,EAAA,EACZ,QAAQ,EAAE,eAAe,EACzB,OAAO,EAAE,cAAc,EACvB,OAAO,EAAE,CAAC,KAAgD,KACtD,WAAW,KAAX,IAAA,IAAA,WAAW,KAAX,SAAA,GAAA,SAAA,GAAA,WAAW,CAAG,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,EAEtC,cAAc,EAAE,kBAAkB,GACpC,CACL;QACA,IAAI;QACJ,IAAI,IAAI,aAAa,KAAI,aAAa,aAAb,aAAa,KAAA,SAAA,GAAA,SAAA,GAAb,aAAa,CAAE,MAAM,CAAA,IAAI,OAAO,CAAC,SAAS,KAAA,IAAA,IAAT,SAAS,KAAT,SAAA,GAAA,SAAA,GAAA,SAAS,CAAE,OAAO,CAAC,KAC1EA,cAAC,CAAA,aAAA,CAAA,cAAc,oBACP,KAAK,EAAA,EACT,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,MAAM,UAAU,CAAC,KAAK,CAAC,EACvC,CAAA,CAAA,CACL,CACY;AAEzB;AAEA,IAAI,CAAC,WAAW,GAAG,MAAM;AAOzB,SAAS,cAAc,CAAC,EACpB,WAAW,EACX,aAAa,EACb,SAAS,EACT,YAAY,GACuB,EAAA;AACnC,IAAA,MAAM,EAAC,OAAO,EAAC,GAAG,0BAA0B,EAAE;AAC9C,IAAA,OAAO,CAAA,aAAa,KAAb,IAAA,IAAA,aAAa,6BAAb,aAAa,CAAE,MAAM,KACxBA,cAAC,CAAA,aAAA,CAAA,KAAK,IACF,QAAQ,EAAC,OAAO,EAChB,SAAS,EAAE,eAAe,EAC1B,IAAI,EAAE,IAAI,EACV,aAAa,EAAE,SAAS,CAAC,OAAO,EAChC,YAAY,EAAE,YAAY,EAAA;AAE1B,QAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,8BAA8B,CAAC,EAAA;YAC7CA,cAAC,CAAA,aAAA,CAAA,IAAI,EACD,EAAA,aAAa,EAAE,CAAC,CAAC,oBAAoB,CAAC,EACtC,KAAK,EAAE,aAAa,EACpB,iBAAiB,EAAE,oBAAoB,CAAC,aAAa,CAAC,EACtD,UAAU,EAAE,iBAAiB,EAC7B,WAAW,EAAE,aAAa,CAAC,MAAM,GAAG,iBAAiB,EACrD,WAAW,EAAE,KAAK,EAClB,UAAU,EAAE,KAAK,EACjB,QAAQ,EAAE,KAAK,EACf,WAAW,EAAE,YAAY,EACzB,UAAU,EAAE,CAAC,IAAI,KAAI;AACjB,oBAAA,MAAM,gBAAgB,GAAG,CAAC,EACtB,KAAK,EAAE,OAAO,EACd,IAAI,EAAE,MAAM,GACC,KAAI;wBACjB,MAAM,CAAC,GAAG,EAAE,QAAQ,CAAC,GAAG,IAAI,CAAC;8BACvB,CAAC,GAAY,EAAE,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAC;AAClC,8BAAE,CAAC,QAAiB,EAAE,EAAE,CAAC;AAE7B,wBAAA,QACIA,cAAC,CAAA,aAAA,CAAA,GAAG,oBACI,QAAQ,EAAA,EACZ,SAAS,EAAE,CAAC,CAAC,eAAe,CAAC,EAC7B,OAAO,EAAE,CAAC,KAAgD,KAAI;gCAC1D,WAAW,KAAA,IAAA,IAAX,WAAW,KAAA,SAAA,GAAA,SAAA,GAAX,WAAW,CAAG,IAAI,EAAE,IAAI,EAAE,KAAK,CAAC;6BACnC,EAAA,CAAA;4BAEA,MAAM;4BACN,OAAO,CACN;AAEd,qBAAC;AAED,oBAAA,MAAM,SAAS,GAAG,eAAe,CAAC,IAAI,CAAC;AACvC,oBAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,KACtBA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,oBAAoB,CAAC,EAAI,CAAA,CAC1E;oBAED,MAAM,MAAM,GAAG,EAAC,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,QAAQ,EAAC;AACjD,oBAAA,MAAM,IAAI,GAAG;AACT,wBAAA,OAAO,EAAE,OAAO,CAAC,OAAO,CAAC;AACzB,wBAAA,SAAS,EAAE,IAAI;wBACf,IAAI;AACJ,wBAAA,GAAG,EAAE,SAAS;qBACjB;AACD,oBAAA,IAAI,OAAO,IAAI,CAAC,WAAW,KAAK,UAAU,EAAE;wBACxC,OAAO,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE,gBAAgB,EAAE,IAAI,CAAC;;yBACpD;AACH,wBAAA,OAAO,gBAAgB,CAAC,MAAM,CAAC;;iBAEtC,EAAA,CACH,CACA,CACF,IACR,IAAI;AACZ;;;;"}

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__icon":"Item-module__gn-composite-bar-item__icon___ORFNf","gnCompositeBarItemIcon":"Item-module__gn-composite-bar-item__icon___ORFNf","gn-composite-bar-item_current":"Item-module__gn-composite-bar-item_current___NT2hB","gnCompositeBarItemCurrent":"Item-module__gn-composite-bar-item_current___NT2hB","gn-composite-bar-item__icon-tooltip":"Item-module__gn-composite-bar-item__icon-tooltip___PxU2i","gnCompositeBarItemIconTooltip":"Item-module__gn-composite-bar-item__icon-tooltip___PxU2i","g-action-tooltip__description":"Item-module__g-action-tooltip__description___UsHcG","gActionTooltipDescription":"Item-module__g-action-tooltip__description___UsHcG","gn-composite-bar-item__icon-place":"Item-module__gn-composite-bar-item__icon-place___jPKRh","gnCompositeBarItemIconPlace":"Item-module__gn-composite-bar-item__icon-place___jPKRh","gn-composite-bar-item__title":"Item-module__gn-composite-bar-item__title___wj5L5","gnCompositeBarItemTitle":"Item-module__gn-composite-bar-item__title___wj5L5","gn-composite-bar-item__title-text":"Item-module__gn-composite-bar-item__title-text___cILJo","gnCompositeBarItemTitleText":"Item-module__gn-composite-bar-item__title-text___cILJo","gn-composite-bar-item__title-adornment":"Item-module__gn-composite-bar-item__title-adornment___Xcopn","gnCompositeBarItemTitleAdornment":"Item-module__gn-composite-bar-item__title-adornment___Xcopn","gn-composite-bar-item__collapse-item":"Item-module__gn-composite-bar-item__collapse-item___Up6IX","gnCompositeBarItemCollapseItem":"Item-module__gn-composite-bar-item__collapse-item___Up6IX","gn-composite-bar-item__collapse-item-icon":"Item-module__gn-composite-bar-item__collapse-item-icon___CD-ao","gnCompositeBarItemCollapseItemIcon":"Item-module__gn-composite-bar-item__collapse-item-icon___CD-ao","gn-composite-bar-item__menu-divider":"Item-module__gn-composite-bar-item__menu-divider___hkm-Z","gnCompositeBarItemMenuDivider":"Item-module__gn-composite-bar-item__menu-divider___hkm-Z","gn-composite-bar-item__collapse-items-popup-content":"Item-module__gn-composite-bar-item__collapse-items-popup-content___a82to","gnCompositeBarItemCollapseItemsPopupContent":"Item-module__gn-composite-bar-item__collapse-items-popup-content___a82to","gn-composite-bar-item__link":"Item-module__gn-composite-bar-item__link___McAVN","gnCompositeBarItemLink":"Item-module__gn-composite-bar-item__link___McAVN","gn-composite-bar-item__btn-icon":"Item-module__gn-composite-bar-item__btn-icon___SwT65","gnCompositeBarItemBtnIcon":"Item-module__gn-composite-bar-item__btn-icon___SwT65","gn-composite-bar-item_type_action":"Item-module__gn-composite-bar-item_type_action___2jxO8","gnCompositeBarItemTypeAction":"Item-module__gn-composite-bar-item_type_action___2jxO8","gn-composite-bar-item__icon-tooltip_item-type_action":"Item-module__gn-composite-bar-item__icon-tooltip_item-type_action___HUhUR","gnCompositeBarItemIconTooltipItemTypeAction":"Item-module__gn-composite-bar-item__icon-tooltip_item-type_action___HUhUR","gn-composite-bar-item_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"};
 export { styles as default };
 //# sourceMappingURL=Item.module.scss.js.map

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

@@ -1,9 +1,7 @@
-.MultipleTooltip-module__g-root_theme_dark-hc___sdXJ2 .MultipleTooltip-module__gn-multiple-tooltip___UCYs0, .MultipleTooltip-module__g-root_theme_dark___C5nrp .MultipleTooltip-module__gn-multiple-tooltip___UCYs0{--multiple-tooltip-item-bg-color:var(
+.g-root_theme_dark .MultipleTooltip-module__gn-multiple-tooltip___UCYs0, .g-root_theme_dark-hc .MultipleTooltip-module__gn-multiple-tooltip___UCYs0{--multiple-tooltip-item-bg-color:var(
       --g-color-base-float-medium,var(--g-color-private-white-100-solid)
-  );--multiple-tooltip-item-active-bg-color:var(--g-color-base-float-heavy);--multiple-tooltip-backdrop-background:linear-gradient(90deg,var(--g-color-base-background) 50%,transparent);--multiple-tooltip-backdrop-filter:blur(16px)}.MultipleTooltip-module__g-root_theme_dark-hc___sdXJ2 .MultipleTooltip-module__gn-multiple-tooltip___UCYs0{--multiple-tooltip-item-bg-color:var(
+  );--multiple-tooltip-item-active-bg-color:var(--g-color-base-float-heavy);--multiple-tooltip-backdrop-background:linear-gradient(90deg,var(--g-color-base-background) 50%,transparent);--multiple-tooltip-backdrop-filter:blur(16px)}.g-root_theme_dark-hc .MultipleTooltip-module__gn-multiple-tooltip___UCYs0{--multiple-tooltip-item-bg-color:var(
       --g-color-base-float-medium,var(--g-color-private-white-150-solid)
-  )}.MultipleTooltip-module__g-root_theme_light-hc___75Wfu .MultipleTooltip-module__gn-multiple-tooltip___UCYs0, .MultipleTooltip-module__g-root_theme_light___B7ecO .MultipleTooltip-module__gn-multiple-tooltip___UCYs0{--multiple-tooltip-item-bg-color:var(
+  )}.g-root_theme_light .MultipleTooltip-module__gn-multiple-tooltip___UCYs0, .g-root_theme_light-hc .MultipleTooltip-module__gn-multiple-tooltip___UCYs0{--multiple-tooltip-item-bg-color:var(
       --g-color-base-float-medium,var(--g-color-private-black-550-solid)
-  );--multiple-tooltip-item-active-bg-color:var(--g-color-base-float-heavy);--multiple-tooltip-backdrop-background:linear-gradient(90deg,var(--g-color-base-background) 50%,transparent);--multiple-tooltip-backdrop-filter:blur(12px)}
-.MultipleTooltip-module__gn-multiple-tooltip___UCYs0:before{background:var(--multiple-tooltip-backdrop-background);box-shadow:none;content:"";filter:var(--multiple-tooltip-backdrop-filter);height:100%;opacity:.7;position:absolute;width:100%;z-index:-1}.MultipleTooltip-module__gn-multiple-tooltip__popup___wE4Fl{--g-popup-background-color:transparent;--g-popup-border-color:transparent;--g-popup-border-width:0;background-color:transparent;box-shadow:none}.MultipleTooltip-module__gn-multiple-tooltip__items-container___1N4u-{align-items:flex-start;display:flex;flex-direction:column;padding:32px 40px 32px 12px}.MultipleTooltip-module__gn-multiple-tooltip__item___sz4Q6{align-items:center;background-color:var(--multiple-tooltip-item-bg-color);border-radius:5px;box-sizing:border-box;color:var(--g-color-text-light-primary);display:flex;height:30px;margin-bottom:5px;padding:8px 12px;position:relative;transition:transform .1s ease-in-out}.MultipleTooltip-module__gn-multiple-tooltip__item___sz4Q6:first-child, .MultipleTooltip-module__gn-multiple-tooltip__item___sz4Q6:not(.MultipleTooltip-module__gn-multiple-tooltip__item_divider___vF10S)+.MultipleTooltip-module__gn-multiple-tooltip__item___sz4Q6:not(.MultipleTooltip-module__gn-multiple-tooltip__item_divider___vF10S){margin-top:5px}.MultipleTooltip-module__gn-multiple-tooltip__item_divider___vF10S+.MultipleTooltip-module__gn-multiple-tooltip__item___sz4Q6:not(.MultipleTooltip-module__gn-multiple-tooltip__item_divider___vF10S){margin-top:4px}.MultipleTooltip-module__gn-multiple-tooltip__item_active___CP4PC{background-color:var(--multiple-tooltip-item-active-bg-color);transform:translateX(-12px)}.MultipleTooltip-module__gn-multiple-tooltip__item_divider___vF10S{height:15px;margin:0;visibility:hidden}
-.MultipleTooltip-module__g-popup___GO-A5.MultipleTooltip-module__gn-multiple-tooltip__popup___wE4Fl{--g-popup-background-color:transparent;--g-popup-border-color:transparent;--g-popup-border-width:0;background-color:transparent;box-shadow:none}
+  );--multiple-tooltip-item-active-bg-color:var(--g-color-base-float-heavy);--multiple-tooltip-backdrop-background:linear-gradient(90deg,var(--g-color-base-background) 50%,transparent);--multiple-tooltip-backdrop-filter:blur(12px)}.MultipleTooltip-module__gn-multiple-tooltip___UCYs0:before{background:var(--multiple-tooltip-backdrop-background);box-shadow:none;content:"";filter:var(--multiple-tooltip-backdrop-filter);height:100%;opacity:.7;position:absolute;width:100%;z-index:-1}.MultipleTooltip-module__gn-multiple-tooltip__popup___wE4Fl, .g-popup.MultipleTooltip-module__gn-multiple-tooltip__popup___wE4Fl{--g-popup-background-color:transparent;--g-popup-border-color:transparent;--g-popup-border-width:0;background-color:transparent;box-shadow:none}.MultipleTooltip-module__gn-multiple-tooltip__items-container___1N4u-{align-items:flex-start;display:flex;flex-direction:column;padding:32px 40px 32px 12px}.MultipleTooltip-module__gn-multiple-tooltip__item___sz4Q6{align-items:center;background-color:var(--multiple-tooltip-item-bg-color);border-radius:5px;box-sizing:border-box;color:var(--g-color-text-light-primary);display:flex;height:30px;margin-bottom:5px;padding:8px 12px;position:relative;transition:transform .1s ease-in-out}.MultipleTooltip-module__gn-multiple-tooltip__item___sz4Q6:first-child, .MultipleTooltip-module__gn-multiple-tooltip__item___sz4Q6:not(.MultipleTooltip-module__gn-multiple-tooltip__item_divider___vF10S)+.MultipleTooltip-module__gn-multiple-tooltip__item___sz4Q6:not(.MultipleTooltip-module__gn-multiple-tooltip__item_divider___vF10S){margin-top:5px}.MultipleTooltip-module__gn-multiple-tooltip__item_divider___vF10S+.MultipleTooltip-module__gn-multiple-tooltip__item___sz4Q6:not(.MultipleTooltip-module__gn-multiple-tooltip__item_divider___vF10S){margin-top:4px}.MultipleTooltip-module__gn-multiple-tooltip__item_active___CP4PC{background-color:var(--multiple-tooltip-item-active-bg-color);transform:translateX(-12px)}.MultipleTooltip-module__gn-multiple-tooltip__item_divider___vF10S{height:15px;margin:0;visibility:hidden}

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

@@ -19,11 +19,11 @@ const MultipleTooltip = ({ items, open, anchorRef, placement, }) => {
                 .map((currentItem, idx) => {
                 switch (currentItem.type) {
                     case 'divider':
-                        return (React__default.createElement("div", { className: b('item', { divider: true }), key: idx }, currentItem.title));
+                        return (React__default.createElement("div", { className: b('item', { divider: true }), key: idx }, currentItem.tooltipText || currentItem.title));
                     default:
                         return (React__default.createElement("div", { className: b('item', {
                                 active: currentItem === activeItem,
-                            }), key: idx }, currentItem.title));
+                            }), key: idx }, currentItem.tooltipText || currentItem.title));
                 }
             })))));
 };

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

	@@ -1 +1 @@
1	- {"version":3,"file":"MultipleTooltip.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/MultipleTooltip/MultipleTooltip.tsx"],"sourcesContent":["import React from 'react';\n\nimport {Popup, PopupProps} from '@gravity-ui/uikit';\n\nimport {AsideHeaderItem} from 'src/components/AsideHeader/types';\n\nimport {createBlock} from '../../../../utils/cn';\nimport {COLLAPSE_ITEM_ID} from '../constants';\n\nimport {MultipleTooltipContext} from './MultipleTooltipContext';\n\nimport styles from './MultipleTooltip.module.scss';\n\nconst b = createBlock('multiple-tooltip', styles);\n\nconst POPUP_OFFSET: PopupProps['offset'] = {mainAxis: 4, crossAxis: -32};\n\ntype MultipleTooltipProps = Pick<PopupProps, 'open' \| 'placement'> & {\n anchorRef: React.RefObject<HTMLElement>;\n items: AsideHeaderItem[];\n};\n\nexport const MultipleTooltip: React.FC<MultipleTooltipProps> = ({\n items,\n open,\n anchorRef,\n placement,\n}) => {\n const {activeIndex, hideCollapseItemTooltip} = React.useContext(MultipleTooltipContext);\n const activeItem = activeIndex === undefined ? null : items[activeIndex];\n\n return (\n <Popup\n open={open}\n className={b('popup')}\n anchorElement={anchorRef.current}\n strategy=\"fixed\"\n placement={placement}\n offset={POPUP_OFFSET}\n >\n <div className={b()}>\n <div className={b('items-container')}>\n {items\n .filter(\n ({type = 'regular', id}) =>\n !hideCollapseItemTooltip \|\|\n (id !== COLLAPSE_ITEM_ID && type !== 'action'),\n )\n .map((currentItem, idx) => {\n switch (currentItem.type) {\n case 'divider':\n return (\n <div className={b('item', {divider: true})} key={idx}>\n {currentItem.title}\n </div>\n );\n default:\n return (\n <div\n className={b('item', {\n active: currentItem === activeItem,\n })}\n key={idx}\n >\n {currentItem.title}\n </div>\n );\n }\n })}\n </div>\n </div>\n </Popup>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;AAaA,MAAM,CAAC,GAAG,WAAW,CAAC,kBAAkB,EAAE,MAAM,CAAC;AAEjD,MAAM,YAAY,GAAyB,EAAC,QAAQ,EAAE,CAAC,EAAE,SAAS,EAAE,GAAG,EAAC;AAOjE,MAAM,eAAe,GAAmC,CAAC,EAC5D,KAAK,EACL,IAAI,EACJ,SAAS,EACT,SAAS,GACZ,KAAI;AACD,IAAA,MAAM,EAAC,WAAW,EAAE,uBAAuB,EAAC,GAAGA,cAAK,CAAC,UAAU,CAAC,sBAAsB,CAAC;AACvF,IAAA,MAAM,UAAU,GAAG,WAAW,KAAK,SAAS,GAAG,IAAI,GAAG,KAAK,CAAC,WAAW,CAAC;AAExE,IAAA,QACIA,cAAA,CAAA,aAAA,CAAC,KAAK,EAAA,EACF,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,EACrB,aAAa,EAAE,SAAS,CAAC,OAAO,EAChC,QAAQ,EAAC,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,YAAY,EAAA;QAEpBA,cAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,EAAE,EAAA;AACf,YAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,IAC/B;AACI,iBAAA,MAAM,CACH,CAAC,EAAC,IAAI,GAAG,SAAS,EAAE,EAAE,EAAC,KACnB,CAAC,uBAAuB;iBACvB,EAAE,KAAK,gBAAgB,IAAI,IAAI,KAAK,QAAQ,CAAC;AAErD,iBAAA,GAAG,CAAC,CAAC,WAAW,EAAE,GAAG,KAAI;AACtB,gBAAA,QAAQ,WAAW,CAAC,IAAI;AACpB,oBAAA,KAAK,SAAS;~~wBACV~~,QACIA,~~cAAK~~,CAAA,aAAA,CAAA,KAAA,EAAA,~~EAAA~~,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,EAAE,GAAG,EAAE,GAAG,~~EAAA,~~EAC/C,WAAW,CAAC,KAAK,~~CAChB~~;AAEd,oBAAA;AACI,wBAAA,QACIA,cACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE;gCACjB,MAAM,EAAE,WAAW,KAAK,UAAU;~~6BACrC~~,CAAC,EACF,GAAG,EAAE,GAAG,~~EAAA~~,~~EAEP~~,WAAW,CAAC,KAAK,~~CAChB~~;;AAGtB,aAAC,CAAC,CACJ,CACJ,CACF;AAEhB;;;;"}
1	+ {"version":3,"file":"MultipleTooltip.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/MultipleTooltip/MultipleTooltip.tsx"],"sourcesContent":["import React from 'react';\n\nimport {Popup, PopupProps} from '@gravity-ui/uikit';\n\nimport {AsideHeaderItem} from 'src/components/AsideHeader/types';\n\nimport {createBlock} from '../../../../utils/cn';\nimport {COLLAPSE_ITEM_ID} from '../constants';\n\nimport {MultipleTooltipContext} from './MultipleTooltipContext';\n\nimport styles from './MultipleTooltip.module.scss';\n\nconst b = createBlock('multiple-tooltip', styles);\n\nconst POPUP_OFFSET: PopupProps['offset'] = {mainAxis: 4, crossAxis: -32};\n\ntype MultipleTooltipProps = Pick<PopupProps, 'open' \| 'placement'> & {\n anchorRef: React.RefObject<HTMLElement>;\n items: AsideHeaderItem[];\n};\n\nexport const MultipleTooltip: React.FC<MultipleTooltipProps> = ({\n items,\n open,\n anchorRef,\n placement,\n}) => {\n const {activeIndex, hideCollapseItemTooltip} = React.useContext(MultipleTooltipContext);\n const activeItem = activeIndex === undefined ? null : items[activeIndex];\n\n return (\n <Popup\n open={open}\n className={b('popup')}\n anchorElement={anchorRef.current}\n strategy=\"fixed\"\n placement={placement}\n offset={POPUP_OFFSET}\n >\n <div className={b()}>\n <div className={b('items-container')}>\n {items\n .filter(\n ({type = 'regular', id}) =>\n !hideCollapseItemTooltip \|\|\n (id !== COLLAPSE_ITEM_ID && type !== 'action'),\n )\n .map((currentItem, idx) => {\n switch (currentItem.type) {\n case 'divider':\n return (\n <div className={b('item', {divider: true})} key={idx}>\n {currentItem.tooltipText \|\| currentItem.title}\n </div>\n );\n default:\n return (\n <div\n className={b('item', {\n active: currentItem === activeItem,\n })}\n key={idx}\n >\n {currentItem.tooltipText \|\| currentItem.title}\n </div>\n );\n }\n })}\n </div>\n </div>\n </Popup>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;AAaA,MAAM,CAAC,GAAG,WAAW,CAAC,kBAAkB,EAAE,MAAM,CAAC;AAEjD,MAAM,YAAY,GAAyB,EAAC,QAAQ,EAAE,CAAC,EAAE,SAAS,EAAE,GAAG,EAAC;AAOjE,MAAM,eAAe,GAAmC,CAAC,EAC5D,KAAK,EACL,IAAI,EACJ,SAAS,EACT,SAAS,GACZ,KAAI;AACD,IAAA,MAAM,EAAC,WAAW,EAAE,uBAAuB,EAAC,GAAGA,cAAK,CAAC,UAAU,CAAC,sBAAsB,CAAC;AACvF,IAAA,MAAM,UAAU,GAAG,WAAW,KAAK,SAAS,GAAG,IAAI,GAAG,KAAK,CAAC,WAAW,CAAC;AAExE,IAAA,QACIA,cAAA,CAAA,aAAA,CAAC,KAAK,EAAA,EACF,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,EACrB,aAAa,EAAE,SAAS,CAAC,OAAO,EAChC,QAAQ,EAAC,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,YAAY,EAAA;QAEpBA,cAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,EAAE,EAAA;AACf,YAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,IAC/B;AACI,iBAAA,MAAM,CACH,CAAC,EAAC,IAAI,GAAG,SAAS,EAAE,EAAE,EAAC,KACnB,CAAC,uBAAuB;iBACvB,EAAE,KAAK,gBAAgB,IAAI,IAAI,KAAK,QAAQ,CAAC;AAErD,iBAAA,GAAG,CAAC,CAAC,WAAW,EAAE,GAAG,KAAI;AACtB,gBAAA,QAAQ,WAAW,CAAC,IAAI;AACpB,oBAAA,KAAK,SAAS;AACV,wBAAA,QACIA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,EAAE,GAAG,EAAE,GAAG,EAC/C,EAAA,WAAW,CAAC,WAAW,IAAI,WAAW,CAAC,KAAK,CAC3C;AAEd,oBAAA;AACI,wBAAA,QACIA,cACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE;gCACjB,MAAM,EAAE,WAAW,KAAK,UAAU;AACrC,6BAAA,CAAC,EACF,GAAG,EAAE,GAAG,IAEP,WAAW,CAAC,WAAW,IAAI,WAAW,CAAC,KAAK,CAC3C;;AAGtB,aAAC,CAAC,CACJ,CACJ,CACF;AAEhB;;;;"}

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

@@ -1,4 +1,4 @@
-var styles = {"g-root_theme_dark":"MultipleTooltip-module__g-root_theme_dark___C5nrp","gRootThemeDark":"MultipleTooltip-module__g-root_theme_dark___C5nrp","gn-multiple-tooltip":"MultipleTooltip-module__gn-multiple-tooltip___UCYs0","gnMultipleTooltip":"MultipleTooltip-module__gn-multiple-tooltip___UCYs0","g-root_theme_dark-hc":"MultipleTooltip-module__g-root_theme_dark-hc___sdXJ2","gRootThemeDarkHc":"MultipleTooltip-module__g-root_theme_dark-hc___sdXJ2","g-root_theme_light":"MultipleTooltip-module__g-root_theme_light___B7ecO","gRootThemeLight":"MultipleTooltip-module__g-root_theme_light___B7ecO","g-root_theme_light-hc":"MultipleTooltip-module__g-root_theme_light-hc___75Wfu","gRootThemeLightHc":"MultipleTooltip-module__g-root_theme_light-hc___75Wfu","g-popup":"MultipleTooltip-module__g-popup___GO-A5","gPopup":"MultipleTooltip-module__g-popup___GO-A5","gn-multiple-tooltip__popup":"MultipleTooltip-module__gn-multiple-tooltip__popup___wE4Fl","gnMultipleTooltipPopup":"MultipleTooltip-module__gn-multiple-tooltip__popup___wE4Fl","gn-multiple-tooltip__items-container":"MultipleTooltip-module__gn-multiple-tooltip__items-container___1N4u-","gnMultipleTooltipItemsContainer":"MultipleTooltip-module__gn-multiple-tooltip__items-container___1N4u-","gn-multiple-tooltip__item":"MultipleTooltip-module__gn-multiple-tooltip__item___sz4Q6","gnMultipleTooltipItem":"MultipleTooltip-module__gn-multiple-tooltip__item___sz4Q6","gn-multiple-tooltip__item_divider":"MultipleTooltip-module__gn-multiple-tooltip__item_divider___vF10S","gnMultipleTooltipItemDivider":"MultipleTooltip-module__gn-multiple-tooltip__item_divider___vF10S","gn-multiple-tooltip__item_active":"MultipleTooltip-module__gn-multiple-tooltip__item_active___CP4PC","gnMultipleTooltipItemActive":"MultipleTooltip-module__gn-multiple-tooltip__item_active___CP4PC"};
+var styles = {"gn-multiple-tooltip":"MultipleTooltip-module__gn-multiple-tooltip___UCYs0","gnMultipleTooltip":"MultipleTooltip-module__gn-multiple-tooltip___UCYs0","gn-multiple-tooltip__popup":"MultipleTooltip-module__gn-multiple-tooltip__popup___wE4Fl","gnMultipleTooltipPopup":"MultipleTooltip-module__gn-multiple-tooltip__popup___wE4Fl","gn-multiple-tooltip__items-container":"MultipleTooltip-module__gn-multiple-tooltip__items-container___1N4u-","gnMultipleTooltipItemsContainer":"MultipleTooltip-module__gn-multiple-tooltip__items-container___1N4u-","gn-multiple-tooltip__item":"MultipleTooltip-module__gn-multiple-tooltip__item___sz4Q6","gnMultipleTooltipItem":"MultipleTooltip-module__gn-multiple-tooltip__item___sz4Q6","gn-multiple-tooltip__item_divider":"MultipleTooltip-module__gn-multiple-tooltip__item_divider___vF10S","gnMultipleTooltipItemDivider":"MultipleTooltip-module__gn-multiple-tooltip__item_divider___vF10S","gn-multiple-tooltip__item_active":"MultipleTooltip-module__gn-multiple-tooltip__item_active___CP4PC","gnMultipleTooltipItemActive":"MultipleTooltip-module__gn-multiple-tooltip__item_active___CP4PC"};
 export { styles as default };
 //# sourceMappingURL=MultipleTooltip.module.scss.js.map

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

@@ -1,2 +1,5 @@
+import { PopupPlacement } from '@gravity-ui/uikit';
 export declare const ITEM_TYPE_REGULAR = "regular";
 export declare const COLLAPSE_ITEM_ID = "collapse-item-id";
+export declare const POPUP_PLACEMENT: PopupPlacement;
+export declare const POPUP_ITEM_HEIGHT = 28;

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

@@ -1,5 +1,7 @@
 const ITEM_TYPE_REGULAR = 'regular';
 const COLLAPSE_ITEM_ID = 'collapse-item-id';
+const POPUP_PLACEMENT = ['right-start', 'right-end', 'right'];
+const POPUP_ITEM_HEIGHT = 28;
-export { COLLAPSE_ITEM_ID, ITEM_TYPE_REGULAR };
+export { COLLAPSE_ITEM_ID, ITEM_TYPE_REGULAR, POPUP_ITEM_HEIGHT, POPUP_PLACEMENT };
 //# sourceMappingURL=constants.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"constants.js","sources":["../../../../../../../src/components/AsideHeader/components/CompositeBar/constants.ts"],"sourcesContent":["~~export~~ const ITEM_TYPE_REGULAR = 'regular';\nexport const COLLAPSE_ITEM_ID = 'collapse-item-id';\n"],"names":[],"mappings":"~~AAAO~~,MAAM,iBAAiB,GAAG;AAC1B,MAAM,gBAAgB,GAAG;;;;"}
1	+ {"version":3,"file":"constants.js","sources":["../../../../../../../src/components/AsideHeader/components/CompositeBar/constants.ts"],"sourcesContent":["import {PopupPlacement} from '@gravity-ui/uikit';\n\nexport const ITEM_TYPE_REGULAR = 'regular';\nexport const COLLAPSE_ITEM_ID = 'collapse-item-id';\n\nexport const POPUP_PLACEMENT: PopupPlacement = ['right-start', 'right-end', 'right'];\nexport const POPUP_ITEM_HEIGHT = 28;\n"],"names":[],"mappings":"AAEO,MAAM,iBAAiB,GAAG;AAC1B,MAAM,gBAAgB,GAAG;AAEnB,MAAA,eAAe,GAAmB,CAAC,aAAa,EAAE,WAAW,EAAE,OAAO;AAC5E,MAAM,iBAAiB,GAAG;;;;"}

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

@@ -1,4 +1,10 @@
-import { AsideHeaderItem, MenuItemsWithGroups } from '../../types';
-export declare function getItemHeight(compositeItem: MenuItemsWithGroups): number;
+import { AsideHeaderItem } from '../../types';
+export declare function getItemHeight(compositeItem: AsideHeaderItem): 40 | 50 | 15;
 export declare function getItemsHeight<T extends AsideHeaderItem>(items: T[]): number;
 export declare function getSelectedItemIndex(compositeItems: AsideHeaderItem[]): number | undefined;
+export declare function getItemsMinHeight(compositeItems: AsideHeaderItem[]): number;
+export declare function getMoreButtonItem(menuMoreTitle?: string): AsideHeaderItem;
+export declare function getAutosizeListItems(compositeItems: AsideHeaderItem[], height: number, collapseItem: AsideHeaderItem): {
+    listItems: AsideHeaderItem[];
+    collapseItems: AsideHeaderItem[];
+};

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

@@ -1,15 +1,8 @@
+import { Ellipsis } from '@gravity-ui/icons';
 import { ITEM_HEIGHT } from '../../../constants.js';
-import { getGroupBlockHeight } from '../../utils/getGroupHeight.js';
+import { COLLAPSE_ITEM_ID } from './constants.js';
-function getGroupHeight(compositeItem) {
-    const visibleGroupItems = compositeItem.isCollapsed ? [] : compositeItem.items;
-    return getGroupBlockHeight(visibleGroupItems);
-}
 function getItemHeight(compositeItem) {
-    var _a;
-    if ('items' in compositeItem && compositeItem.items && ((_a = compositeItem.items) === null || _a === undefined ? undefined : _a.length) > 0) {
-        return getGroupHeight(compositeItem);
-    }
     switch (compositeItem.type) {
         case 'action':
             return 50;
@@ -26,6 +19,76 @@ function getSelectedItemIndex(compositeItems) {
     const index = compositeItems.findIndex(({ current }) => Boolean(current));
     return index === -1 ? undefined : index;
 }
+function getPinnedItems(compositeItems) {
+    const pinnedItems = [];
+    for (const compositeItem of compositeItems) {
+        if (compositeItem.pinned) {
+            pinnedItems.push(compositeItem);
+        }
+        else if (compositeItem.type === 'divider') {
+            if (pinnedItems.length > 0 && pinnedItems[pinnedItems.length - 1].type !== 'divider') {
+                pinnedItems.push(compositeItem);
+            }
+        }
+    }
+    return pinnedItems;
+}
+function getItemsMinHeight(compositeItems) {
+    const pinnedItems = getPinnedItems(compositeItems);
+    const afterMoreButtonItems = compositeItems.filter(({ afterMoreButton }) => afterMoreButton);
+    return (getItemsHeight(pinnedItems) +
+        getItemsHeight(afterMoreButtonItems) +
+        (pinnedItems.length === compositeItems.length ? 0 : ITEM_HEIGHT));
+}
+function getMoreButtonItem(menuMoreTitle) {
+    return {
+        id: COLLAPSE_ITEM_ID,
+        title: menuMoreTitle,
+        icon: Ellipsis,
+        iconSize: 18,
+    };
+}
+function getAutosizeListItems(compositeItems, height, collapseItem) {
+    var _a, _b, _c;
+    const afterMoreButtonItems = compositeItems.filter(({ afterMoreButton }) => afterMoreButton);
+    const regularItems = compositeItems.filter(({ afterMoreButton }) => !afterMoreButton);
+    const listItems = [...regularItems, ...afterMoreButtonItems];
+    const allItemsHeight = getItemsHeight(listItems);
+    if (allItemsHeight <= height) {
+        return { listItems, collapseItems: [] };
+    }
+    const collapseItemHeight = getItemHeight(collapseItem);
+    listItems.splice(regularItems.length, 0, collapseItem);
+    const collapseItems = [];
+    let listHeight = allItemsHeight + collapseItemHeight;
+    let index = listItems.length;
+    while (listHeight > height) {
+        if (index === 0) {
+            break;
+        }
+        index--;
+        const compositeItem = listItems[index];
+        if (compositeItem.pinned ||
+            compositeItem.id === COLLAPSE_ITEM_ID ||
+            compositeItem.afterMoreButton) {
+            continue;
+        }
+        if (compositeItem.type === 'divider') {
+            if (index + 1 < listItems.length && ((_a = listItems[index + 1]) === null || _a === undefined ? undefined : _a.type) === 'divider') {
+                listHeight -= getItemHeight(compositeItem);
+                listItems.splice(index, 1);
+            }
+            continue;
+        }
+        listHeight -= getItemHeight(compositeItem);
+        collapseItems.unshift(...listItems.splice(index, 1));
+    }
+    if (((_b = listItems[index]) === null || _b === undefined ? undefined : _b.type) === 'divider' &&
+        (index === 0 || ((_c = listItems[index - 1]) === null || _c === undefined ? undefined : _c.type) === 'divider')) {
+        listItems.splice(index, 1);
+    }
+    return { listItems, collapseItems };
+}
-export { getItemHeight, getItemsHeight, getSelectedItemIndex };
+export { getAutosizeListItems, getItemHeight, getItemsHeight, getItemsMinHeight, getMoreButtonItem, getSelectedItemIndex };
 //# sourceMappingURL=utils.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.js","sources":["../../../../../../../src/components/AsideHeader/components/CompositeBar/utils.ts"],"sourcesContent":["import {~~ITEM_HEIGHT~~} from '~~../../../constants~~';\nimport {~~AsideHeaderItem, GroupedMenuItem, MenuItemsWithGroups~~} from '~~../../types~~';\nimport {~~getGroupBlockHeight~~} from '../../~~utils/getGroupHeight~~';\n\~~nfunction~~ ~~getGroupHeight(compositeItem: GroupedMenuItem)~~ {~~\n const~~ ~~visibleGroupItems~~ ~~= compositeItem.isCollapsed ? [] : compositeItem.items~~;\n\~~n return getGroupBlockHeight(visibleGroupItems);\n}\n\~~nexport function getItemHeight(compositeItem: ~~MenuItemsWithGroups~~) {\n ~~if ('items' in compositeItem && compositeItem.items && compositeItem.items?.length > 0) {\n return getGroupHeight(compositeItem);\n }\n\n~~ switch (compositeItem.type) {\n case 'action':\n return 50;\n case 'divider':\n return 15;\n\n default:\n return ITEM_HEIGHT;\n }\n}\n\nexport function getItemsHeight<T extends AsideHeaderItem>(items: T[]) {\n return items.reduce((sum, item) => sum + getItemHeight(item), 0);\n}\n\nexport function getSelectedItemIndex(compositeItems: AsideHeaderItem[]) {\n const index = compositeItems.findIndex(({current}) => Boolean(current));\n return index === -1 ? undefined : index;\n}\n"],"names":[],"mappings":"~~;;;AAIA~~,~~SAAS~~,~~cAAc~~,CAAC,aAA8B,EAAA;~~AAClD~~,IAAA,~~MAAM~~,~~iBAAiB,GAAG,~~aAAa,CAAC,WAAW,GAAG,EAAE,GAAG,aAAa,CAAC,~~KAAK~~;~~AAE9E~~,IAAA,OAAO,~~mBAAmB~~,CAAC,~~iBAAiB~~,CAAC;~~AACjD~~;~~AAEM~~,~~SAAU~~,~~aAAa~~,CAAC,~~aAAkC~~,EAAA~~;;AAC5D~~,IAAA,IAAI,~~OAAO~~,IAAI,aAAa,IAAI,aAAa,CAAC,KAAK,IAAI,~~CAAA~~,~~CAAA~~,~~EAAA~~,~~GAAA~~,~~aAAa~~,CAAC,KAAK,~~MAAA~~,~~IAAA~~,IAAA,~~EAAA~~,~~KAAA~~,~~SAAA~~,~~GAAA~~,~~SAAA~~,~~GAAA~~,EAAA,~~CAAE~~,MAAM,~~IAAG~~,CAAC,~~EAAE~~;~~AACpF~~,~~QAAA~~,~~OAAO~~,cAAc,CAAC,~~aAAa~~,CAAC~~;;AAGxC~~,IAAA,~~QAAQ~~,~~aAAa~~,CAAC,~~IAAI~~;~~AACtB~~,~~QAAA~~,KAAK,~~QAAQ~~;~~AACT~~,~~YAAA~~,OAAO,EAAE;~~AACb~~,QAAA,KAAK,~~SAAS~~;~~AACV~~,~~YAAA~~,~~OAAO~~,EAAE;~~AAEb~~,QAAA;~~AACI~~,~~YAAA~~,~~OAAO~~,~~WAAW~~;;~~AAE9B;AAEM~~,~~SAAU~~,cAAc,~~CAA4B~~,~~KAAU~~,~~EAAA~~;~~IAChE~~,~~OAAO~~,KAAK,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,IAAI,~~KAAK~~,GAAG,GAAG,~~aAAa~~,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;~~AACpE~~;~~AAEM~~,~~SAAU~~,~~oBAAoB~~,CAAC,~~cAAiC~~,~~EAAA~~;~~AAClE~~,~~IAAA~~,MAAM,KAAK,GAAG,~~cAAc~~,CAAC,SAAS,CAAC,CAAC,~~EAAC~~,~~OAAO~~,~~EAAC~~,KAAK,~~OAAO~~,CAAC,~~OAAO~~,CAAC,CAAC;~~AACvE~~,~~IAAA~~,OAAO,~~KAAK~~,KAAK,EAAE,~~GAAG~~,SAAS,GAAG,KAAK;~~AAC3C~~;;;;"}
1	+ {"version":3,"file":"utils.js","sources":["../../../../../../../src/components/AsideHeader/components/CompositeBar/utils.ts"],"sourcesContent":["import {Ellipsis} from '@gravity-ui/icons';\n\nimport {ITEM_HEIGHT} from '../../../constants';\nimport {AsideHeaderItem} from '../../types';\n\nimport {COLLAPSE_ITEM_ID} from './constants';\n\nexport function getItemHeight(compositeItem: AsideHeaderItem) {\n switch (compositeItem.type) {\n case 'action':\n return 50;\n case 'divider':\n return 15;\n\n default:\n return ITEM_HEIGHT;\n }\n}\n\nexport function getItemsHeight<T extends AsideHeaderItem>(items: T[]) {\n return items.reduce((sum, item) => sum + getItemHeight(item), 0);\n}\n\nexport function getSelectedItemIndex(compositeItems: AsideHeaderItem[]) {\n const index = compositeItems.findIndex(({current}) => Boolean(current));\n return index === -1 ? undefined : index;\n}\n\nfunction getPinnedItems(compositeItems: AsideHeaderItem[]) {\n const pinnedItems: AsideHeaderItem[] = [];\n for (const compositeItem of compositeItems) {\n if (compositeItem.pinned) {\n pinnedItems.push(compositeItem);\n } else if (compositeItem.type === 'divider') {\n if (pinnedItems.length > 0 && pinnedItems[pinnedItems.length - 1].type !== 'divider') {\n pinnedItems.push(compositeItem);\n }\n }\n }\n return pinnedItems;\n}\n\nexport function getItemsMinHeight(compositeItems: AsideHeaderItem[]) {\n const pinnedItems = getPinnedItems(compositeItems);\n const afterMoreButtonItems = compositeItems.filter(({afterMoreButton}) => afterMoreButton);\n\n return (\n getItemsHeight(pinnedItems) +\n getItemsHeight(afterMoreButtonItems) +\n (pinnedItems.length === compositeItems.length ? 0 : ITEM_HEIGHT)\n );\n}\n\nexport function getMoreButtonItem(menuMoreTitle?: string): AsideHeaderItem {\n return {\n id: COLLAPSE_ITEM_ID,\n title: menuMoreTitle,\n icon: Ellipsis,\n iconSize: 18,\n };\n}\n\nexport function getAutosizeListItems(\n compositeItems: AsideHeaderItem[],\n height: number,\n collapseItem: AsideHeaderItem,\n): {\n listItems: AsideHeaderItem[];\n collapseItems: AsideHeaderItem[];\n} {\n const afterMoreButtonItems = compositeItems.filter(({afterMoreButton}) => afterMoreButton);\n const regularItems = compositeItems.filter(({afterMoreButton}) => !afterMoreButton);\n const listItems = [...regularItems, ...afterMoreButtonItems];\n\n const allItemsHeight = getItemsHeight(listItems);\n if (allItemsHeight <= height) {\n return {listItems, collapseItems: []};\n }\n\n const collapseItemHeight = getItemHeight(collapseItem);\n\n listItems.splice(regularItems.length, 0, collapseItem);\n const collapseItems: AsideHeaderItem[] = [];\n\n let listHeight = allItemsHeight + collapseItemHeight;\n let index = listItems.length;\n while (listHeight > height) {\n if (index === 0) {\n break;\n }\n index--;\n\n const compositeItem = listItems[index];\n if (\n compositeItem.pinned \|\|\n compositeItem.id === COLLAPSE_ITEM_ID \|\|\n compositeItem.afterMoreButton\n ) {\n continue;\n }\n if (compositeItem.type === 'divider') {\n if (index + 1 < listItems.length && listItems[index + 1]?.type === 'divider') {\n listHeight -= getItemHeight(compositeItem);\n listItems.splice(index, 1);\n }\n continue;\n }\n listHeight -= getItemHeight(compositeItem);\n collapseItems.unshift(...listItems.splice(index, 1));\n }\n if (\n listItems[index]?.type === 'divider' &&\n (index === 0 \|\| listItems[index - 1]?.type === 'divider')\n ) {\n listItems.splice(index, 1);\n }\n\n return {listItems, collapseItems};\n}\n"],"names":[],"mappings":";;;;AAOM,SAAU,aAAa,CAAC,aAA8B,EAAA;AACxD,IAAA,QAAQ,aAAa,CAAC,IAAI;AACtB,QAAA,KAAK,QAAQ;AACT,YAAA,OAAO,EAAE;AACb,QAAA,KAAK,SAAS;AACV,YAAA,OAAO,EAAE;AAEb,QAAA;AACI,YAAA,OAAO,WAAW;;AAE9B;AAEM,SAAU,cAAc,CAA4B,KAAU,EAAA;IAChE,OAAO,KAAK,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,IAAI,KAAK,GAAG,GAAG,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACpE;AAEM,SAAU,oBAAoB,CAAC,cAAiC,EAAA;AAClE,IAAA,MAAM,KAAK,GAAG,cAAc,CAAC,SAAS,CAAC,CAAC,EAAC,OAAO,EAAC,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;AACvE,IAAA,OAAO,KAAK,KAAK,EAAE,GAAG,SAAS,GAAG,KAAK;AAC3C;AAEA,SAAS,cAAc,CAAC,cAAiC,EAAA;IACrD,MAAM,WAAW,GAAsB,EAAE;AACzC,IAAA,KAAK,MAAM,aAAa,IAAI,cAAc,EAAE;AACxC,QAAA,IAAI,aAAa,CAAC,MAAM,EAAE;AACtB,YAAA,WAAW,CAAC,IAAI,CAAC,aAAa,CAAC;;AAC5B,aAAA,IAAI,aAAa,CAAC,IAAI,KAAK,SAAS,EAAE;AACzC,YAAA,IAAI,WAAW,CAAC,MAAM,GAAG,CAAC,IAAI,WAAW,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,IAAI,KAAK,SAAS,EAAE;AAClF,gBAAA,WAAW,CAAC,IAAI,CAAC,aAAa,CAAC;;;;AAI3C,IAAA,OAAO,WAAW;AACtB;AAEM,SAAU,iBAAiB,CAAC,cAAiC,EAAA;AAC/D,IAAA,MAAM,WAAW,GAAG,cAAc,CAAC,cAAc,CAAC;AAClD,IAAA,MAAM,oBAAoB,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC,EAAC,eAAe,EAAC,KAAK,eAAe,CAAC;AAE1F,IAAA,QACI,cAAc,CAAC,WAAW,CAAC;QAC3B,cAAc,CAAC,oBAAoB,CAAC;AACpC,SAAC,WAAW,CAAC,MAAM,KAAK,cAAc,CAAC,MAAM,GAAG,CAAC,GAAG,WAAW,CAAC;AAExE;AAEM,SAAU,iBAAiB,CAAC,aAAsB,EAAA;IACpD,OAAO;AACH,QAAA,EAAE,EAAE,gBAAgB;AACpB,QAAA,KAAK,EAAE,aAAa;AACpB,QAAA,IAAI,EAAE,QAAQ;AACd,QAAA,QAAQ,EAAE,EAAE;KACf;AACL;SAEgB,oBAAoB,CAChC,cAAiC,EACjC,MAAc,EACd,YAA6B,EAAA;;AAK7B,IAAA,MAAM,oBAAoB,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC,EAAC,eAAe,EAAC,KAAK,eAAe,CAAC;AAC1F,IAAA,MAAM,YAAY,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC,EAAC,eAAe,EAAC,KAAK,CAAC,eAAe,CAAC;IACnF,MAAM,SAAS,GAAG,CAAC,GAAG,YAAY,EAAE,GAAG,oBAAoB,CAAC;AAE5D,IAAA,MAAM,cAAc,GAAG,cAAc,CAAC,SAAS,CAAC;AAChD,IAAA,IAAI,cAAc,IAAI,MAAM,EAAE;AAC1B,QAAA,OAAO,EAAC,SAAS,EAAE,aAAa,EAAE,EAAE,EAAC;;AAGzC,IAAA,MAAM,kBAAkB,GAAG,aAAa,CAAC,YAAY,CAAC;IAEtD,SAAS,CAAC,MAAM,CAAC,YAAY,CAAC,MAAM,EAAE,CAAC,EAAE,YAAY,CAAC;IACtD,MAAM,aAAa,GAAsB,EAAE;AAE3C,IAAA,IAAI,UAAU,GAAG,cAAc,GAAG,kBAAkB;AACpD,IAAA,IAAI,KAAK,GAAG,SAAS,CAAC,MAAM;AAC5B,IAAA,OAAO,UAAU,GAAG,MAAM,EAAE;AACxB,QAAA,IAAI,KAAK,KAAK,CAAC,EAAE;YACb;;AAEJ,QAAA,KAAK,EAAE;AAEP,QAAA,MAAM,aAAa,GAAG,SAAS,CAAC,KAAK,CAAC;QACtC,IACI,aAAa,CAAC,MAAM;YACpB,aAAa,CAAC,EAAE,KAAK,gBAAgB;YACrC,aAAa,CAAC,eAAe,EAC/B;YACE;;AAEJ,QAAA,IAAI,aAAa,CAAC,IAAI,KAAK,SAAS,EAAE;YAClC,IAAI,KAAK,GAAG,CAAC,GAAG,SAAS,CAAC,MAAM,IAAI,CAAA,CAAA,EAAA,GAAA,SAAS,CAAC,KAAK,GAAG,CAAC,CAAC,gDAAE,IAAI,MAAK,SAAS,EAAE;AAC1E,gBAAA,UAAU,IAAI,aAAa,CAAC,aAAa,CAAC;AAC1C,gBAAA,SAAS,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;;YAE9B;;AAEJ,QAAA,UAAU,IAAI,aAAa,CAAC,aAAa,CAAC;AAC1C,QAAA,aAAa,CAAC,OAAO,CAAC,GAAG,SAAS,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;;IAExD,IACI,CAAA,MAAA,SAAS,CAAC,KAAK,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,IAAI,MAAK,SAAS;AACpC,SAAC,KAAK,KAAK,CAAC,IAAI,CAAA,CAAA,EAAA,GAAA,SAAS,CAAC,KAAK,GAAG,CAAC,CAAC,MAAE,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAA,IAAI,MAAK,SAAS,CAAC,EAC3D;AACE,QAAA,SAAS,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;;AAG9B,IAAA,OAAO,EAAC,SAAS,EAAE,aAAa,EAAC;AACrC;;;;"}

package/build/esm/components/AsideHeader/components/FirstPanel.js CHANGED Viewed

@@ -1,43 +1,38 @@
 import React__default, { useRef } from 'react';
 import { setRef } from '@gravity-ui/uikit';
-import { CSSTransition } from 'react-transition-group';
-import { ASIDE_HEADER_EXPAND_TRANSITION_DELAY } from '../../constants.js';
 import { useAsideHeaderInnerContext } from '../AsideHeaderContext.js';
+import i18n from '../i18n/index.js';
 import { b } from '../utils.js';
-import { useGroupedMenuItems } from './AllPagesPanel/useGroupedMenuItems.js';
+import './AllPagesPanel/AllPagesPanel.js';
+import '@gravity-ui/icons';
+import './AllPagesPanel/i18n/index.js';
+import { useVisibleMenuItems } from './AllPagesPanel/useVisibleMenuItems.js';
+import { CollapseButton } from './CollapseButton/CollapseButton.js';
 import { CompositeBar } from './CompositeBar/CompositeBar.js';
 import { Header } from './Header.js';
 import { Panels } from './Panels.js';
 const MENU_ITEMS_COMPOSITE_ID = 'gravity-ui/navigation-menu-items-composite-bar';
-const asideTransitionClassNames = {
-    enter: b('aside-transition-enter'),
-    enterActive: b('aside-transition-enter-active'),
-    enterDone: b('aside-transition-enter-done'),
-    exit: b('aside-transition-exit'),
-    exitActive: b('aside-transition-exit-active'),
-};
 const FirstPanel = React__default.forwardRef((_props, ref) => {
-    const { size, onItemClick, headerDecoration, multipleTooltip, onMenuMoreClick, renderFooter, onToggleGroupCollapsed, compact, customBackground, customBackgroundClassName, className, menuItems, menuGroups, qa, onExpand, onFold, isExpanded, } = useAsideHeaderInnerContext();
-    const flatListItems = useGroupedMenuItems(menuItems, menuGroups);
+    const { size, onItemClick, headerDecoration, multipleTooltip, menuMoreTitle, onMenuMoreClick, renderFooter, compact, customBackground, customBackgroundClassName, className, hideCollapseButton, qa, } = useAsideHeaderInnerContext();
+    const visibleMenuItems = useVisibleMenuItems();
     const asideRef = useRef(null);
     React__default.useEffect(() => {
         setRef(ref, asideRef.current);
     }, [ref]);
-    const isExpandedByHover = compact && isExpanded;
     return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement(CSSTransition, { in: isExpandedByHover, timeout: ASIDE_HEADER_EXPAND_TRANSITION_DELAY, classNames: asideTransitionClassNames },
-            React__default.createElement("div", { className: b('aside', className), style: { width: size }, "data-qa": qa, onMouseEnter: onExpand, onMouseLeave: onFold },
-                React__default.createElement("div", { className: b('aside-popup-anchor'), ref: asideRef }),
-                customBackground && (React__default.createElement("div", { className: b('aside-custom-background', customBackgroundClassName) }, customBackground)),
-                React__default.createElement("div", { className: b('aside-content', { ['with-decoration']: headerDecoration }) },
-                    React__default.createElement(Header, null),
-                    (flatListItems === null || flatListItems === undefined ? undefined : flatListItems.length) ? (React__default.createElement(CompositeBar, { compositeId: MENU_ITEMS_COMPOSITE_ID, className: b('menu-items'), groupClassName: b('menu-items-group'), menuItemClassName: b('menu-item'), compact: !isExpanded, type: "menu", items: flatListItems, onItemClick: onItemClick, onMoreClick: onMenuMoreClick, onToggleGroupCollapsed: onToggleGroupCollapsed, multipleTooltip: multipleTooltip })) : (React__default.createElement("div", { className: b('menu-items') })),
-                    React__default.createElement("div", { className: b('footer') }, renderFooter === null || renderFooter === undefined ? undefined : renderFooter({
-                        size,
-                        compact: Boolean(!isExpanded),
-                        asideRef,
-                    }))))),
+        React__default.createElement("div", { className: b('aside', className), style: { width: size }, "data-qa": qa },
+            React__default.createElement("div", { className: b('aside-popup-anchor'), ref: asideRef }),
+            customBackground && (React__default.createElement("div", { className: b('aside-custom-background', customBackgroundClassName) }, customBackground)),
+            React__default.createElement("div", { className: b('aside-content', { ['with-decoration']: headerDecoration }) },
+                React__default.createElement(Header, null),
+                (visibleMenuItems === null || visibleMenuItems === undefined ? undefined : visibleMenuItems.length) ? (React__default.createElement(CompositeBar, { compositeId: MENU_ITEMS_COMPOSITE_ID, type: "menu", compact: compact, items: visibleMenuItems, menuMoreTitle: menuMoreTitle !== null && menuMoreTitle !== undefined ? menuMoreTitle : i18n('label_more'), onItemClick: onItemClick, onMoreClick: onMenuMoreClick, multipleTooltip: multipleTooltip })) : (React__default.createElement("div", { className: b('menu-items') })),
+                React__default.createElement("div", { className: b('footer') }, renderFooter === null || renderFooter === undefined ? undefined : renderFooter({
+                    size,
+                    compact: Boolean(compact),
+                    asideRef,
+                })),
+                !hideCollapseButton && React__default.createElement(CollapseButton, null))),
         React__default.createElement(Panels, null)));
 });
 FirstPanel.displayName = 'FirstPanel';

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

	@@ -1 +1 @@
1	- {"version":3,"file":"FirstPanel.js","sources":["../../../../../../src/components/AsideHeader/components/FirstPanel.tsx"],"sourcesContent":["import React, {useRef} from 'react';\n\nimport {setRef} from '@gravity-ui/uikit';\nimport {~~CSSTransition~~} from '~~react-transition-group~~';\n\nimport ~~{ASIDE_HEADER_EXPAND_TRANSITION_DELAY}~~ from '~~../../constants~~';\nimport {~~useAsideHeaderInnerContext~~} from '../~~AsideHeaderContext~~';\nimport {b} from '~~../utils~~';\n\nimport {~~useGroupedMenuItems~~} from './~~AllPagesPanel~~/~~useGroupedMenuItems~~';\nimport {CompositeBar} from './CompositeBar';\nimport {Header} from './Header';\nimport {Panels} from './Panels';\n\nconst MENU_ITEMS_COMPOSITE_ID = 'gravity-ui/navigation-menu-items-composite-bar';\n\nconst asideTransitionClassNames = {\n enter: b('aside-transition-enter'),\n enterActive: b('aside-transition-enter-active'),\n enterDone: b('aside-transition-enter-done'),\n exit: b('aside-transition-exit'),\n exitActive: b('aside-transition-exit-active'),\n};\n\nexport const FirstPanel = React.forwardRef<HTMLDivElement>((_props, ref) => {\n const {\n size,\n onItemClick,\n headerDecoration,\n multipleTooltip,\n ~~onMenuMoreClick~~,\n ~~renderFooter~~,\n ~~onToggleGroupCollapsed~~,\n compact,\n customBackground,\n customBackgroundClassName,\n className,\n ~~menuItems~~,\n ~~menuGroups,\n~~ qa,\n ~~onExpand,\n onFold,\n isExpanded,\n~~ } = useAsideHeaderInnerContext();\n\n const ~~flatListItems~~ = ~~useGroupedMenuItems~~(~~menuItems, menuGroups~~);\n\n const asideRef = useRef<HTMLDivElement>(null);\n\n React.useEffect(() => {\n setRef<HTMLDivElement>(ref, asideRef.current);\n }, [ref]);\n\n ~~const isExpandedByHover = compact && isExpanded;\n\n~~ return (\n <React.Fragment>\n <CSSTransition\n in={isExpandedByHover}\n timeout={ASIDE_HEADER_EXPAND_TRANSITION_DELAY}\n classNames={asideTransitionClassNames}\n >\n <div\n className={b('aside', className)}\n style={{width: size}}\n data-qa={qa}\n ~~onMouseEnter={onExpand}\n onMouseLeave={onFold}\n~~ ~~>\n~~ <div className={b('aside-popup-anchor')} ref={asideRef} />\n {customBackground && (\n <div className={b('aside-custom-background', customBackgroundClassName)}>\n {customBackground}\n </div>\n )}\n\n <div className={b('aside-content', {['with-decoration']: headerDecoration})}>\n <Header />\n\n {~~flatListItems~~?.length ? (\n <CompositeBar\n compositeId={MENU_ITEMS_COMPOSITE_ID}\n ~~className~~={~~b('menu-items')~~}\n ~~groupClassName~~={~~b('menu-items-group')~~}\n ~~menuItemClassName~~={b('~~menu-item~~')}\n ~~compact={!isExpanded}\n type=\"menu\"\n items={flatListItems}\n~~ onItemClick={onItemClick}\n onMoreClick={onMenuMoreClick}\n ~~onToggleGroupCollapsed={onToggleGroupCollapsed}\n~~ multipleTooltip={multipleTooltip}\n />\n ) : (\n <div className={b('menu-items')} />\n )}\n\n <div className={b('footer')}>\n {renderFooter?.({\n size,\n compact: Boolean(~~!isExpanded~~),\n asideRef,\n })}\n </div>\n ~~</div>\~~n </div>\n </~~CSSTransition~~>\n <Panels />\n </React.Fragment>\n );\n});\n\nFirstPanel.displayName = 'FirstPanel';\n"],"names":["React"],"mappings":"~~;;;;;;;;;;;~~AAcA,MAAM,uBAAuB,GAAG,gDAAgD;~~AAEhF~~,MAAM,~~yBAAyB,GAAG;AAC9B,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;CAChD;AAEM,MAAM,UAAU,~~GAAGA,cAAK,CAAC,UAAU,CAAiB,CAAC,MAAM,EAAE,GAAG,KAAI;AACvE,IAAA,MAAM,EACF,IAAI,EACJ,WAAW,EACX,gBAAgB,EAChB,eAAe,EACf,eAAe,EACf,YAAY,EACZ,~~sBAAsB,EACtB,~~OAAO,EACP,gBAAgB,EAChB,yBAAyB,EACzB,SAAS,EACT,~~SAAS~~,~~EACT~~,~~UAAU,EACV,~~EAAE,~~EACF~~,~~QAAQ,EACR,MAAM,EACN,UAAU,GACb,~~GAAG,0BAA0B,EAAE;~~IAEhC~~,MAAM,~~aAAa~~,GAAG,mBAAmB,~~CAAC,SAAS,~~EAAE~~,UAAU,CAAC~~;~~AAEhE~~,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC;AAE7C,IAAAA,cAAK,CAAC,SAAS,CAAC,MAAK;AACjB,QAAA,MAAM,CAAiB,GAAG,EAAE,QAAQ,CAAC,OAAO,CAAC;AACjD,KAAC,EAAE,CAAC,GAAG,CAAC,CAAC;AAET,IAAA,~~MAAM,iBAAiB,GAAG,OAAO,IAAI,UAAU;AAE/C,IAAA,~~QACIA,cAAA,CAAA,aAAA,CAACA,cAAK,CAAC,QAAQ,EAAA,IAAA;AACX,QAAAA,cAAA,CAAA,aAAA,~~CAAC,aAAa,EAAA,EACV,EAAE,EAAE,iBAAiB,EACrB,OAAO,EAAE,oCAAoC,EAC7C,UAAU,EAAE,yBAAyB,EAAA;YAErCA,cACI,~~CAAA,~~aAAA,CAAA,~~KAAA,EAAA,~~EAAA~~,SAAS,EAAE,CAAC,CAAC,OAAO,EAAE,SAAS,CAAC,~~EAChC~~,KAAK,EAAE,EAAC,KAAK,EAAE,IAAI,EAAC,~~EAAA~~,~~SAAA,EACX,~~EAAE,~~EACX,YAAY,EAAE,QAAQ,EACtB,YAAY,EAAE,MAAM,~~EAAA;~~gBAEpBA~~,cAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,oBAAoB,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAI,CAAA;AACzD,~~gBAAA~~,gBAAgB,KACbA,cAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,yBAAyB,EAAE,yBAAyB,CAAC,EAClE,EAAA,gBAAgB,CACf,CACT;AAED,~~gBAAAA~~,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,eAAe,EAAE,EAAC,CAAC,iBAAiB,GAAG,gBAAgB,EAAC,CAAC,EAAA;AACvE,~~oBAAAA~~,cAAA,CAAA,aAAA,CAAC,MAAM,EAAG,IAAA,CAAA;~~AAET~~,~~oBAAA~~,CAAA,~~aAAa~~,~~KAAb~~,IAAA,~~IAAA~~,~~aAAa~~,~~KAAb~~,SAAA,GAAA,SAAA,~~GAAA~~,~~aAAa~~,CAAE,MAAM,~~KAClBA~~,cAAC,CAAA,aAAA,CAAA,YAAY,IACT,WAAW,EAAE,uBAAuB,EACpC,~~SAAS~~,~~EAAE~~,~~CAAC~~,~~CAAC~~,~~YAAY~~,~~CAAC~~,~~EAC1B~~,~~cAAc~~,EAAE,~~CAAC~~,~~CAAC~~,~~kBAAkB~~,~~CAAC,EACrC,iBAAiB,~~EAAE,~~CAAC~~,~~CAAC~~,~~WAAW~~,~~CAAC~~,~~EACjC~~,~~OAAO~~,~~EAAE~~,~~CAAC~~,~~UAAU~~,~~EACpB~~,IAAI,~~EAAC~~,~~MAAM~~,~~EACX~~,~~KAAK~~,~~EAAE,aAAa,EACpB,~~WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,eAAe,EAC5B,~~sBAAsB,EAAE,sBAAsB,EAC9C,~~eAAe,EAAE,eAAe,EAClC,CAAA,KAEFA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,GAAI,CACtC;~~AAED~~,~~oBAAAA~~,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,EACtB,EAAA,YAAY,KAAZ,IAAA,IAAA,YAAY,KAAZ,SAAA,GAAA,SAAA,GAAA,YAAY,CAAG;~~wBACZ~~,IAAI;AACJ,~~wBAAA~~,OAAO,EAAE,OAAO,CAAC,~~CAAC~~,~~UAAU,~~CAAC;~~wBAC7B~~,QAAQ;~~qBACX~~,CAAC,CACA,~~CACJ~~,CACJ~~,CACM~~;~~AAChB~~,QAAAA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,IAAA,CAAG,CACG;AAEzB,CAAC;AAED,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}
1	+ {"version":3,"file":"FirstPanel.js","sources":["../../../../../../src/components/AsideHeader/components/FirstPanel.tsx"],"sourcesContent":["import React, {useRef} from 'react';\n\nimport {setRef} from '@gravity-ui/uikit';\n\nimport {useAsideHeaderInnerContext} from '../AsideHeaderContext';\nimport i18n from '../i18n';\nimport {b} from '../utils';\n\nimport {useVisibleMenuItems} from './AllPagesPanel';\nimport {CollapseButton} from './CollapseButton/CollapseButton';\nimport {CompositeBar} from './CompositeBar';\nimport {Header} from './Header';\nimport {Panels} from './Panels';\n\nconst MENU_ITEMS_COMPOSITE_ID = 'gravity-ui/navigation-menu-items-composite-bar';\n\nexport const FirstPanel = React.forwardRef<HTMLDivElement>((_props, ref) => {\n const {\n size,\n onItemClick,\n headerDecoration,\n multipleTooltip,\n menuMoreTitle,\n onMenuMoreClick,\n renderFooter,\n compact,\n customBackground,\n customBackgroundClassName,\n className,\n hideCollapseButton,\n qa,\n } = useAsideHeaderInnerContext();\n const visibleMenuItems = useVisibleMenuItems();\n\n const asideRef = useRef<HTMLDivElement>(null);\n\n React.useEffect(() => {\n setRef<HTMLDivElement>(ref, asideRef.current);\n }, [ref]);\n\n return (\n <React.Fragment>\n <div className={b('aside', className)} style={{width: size}} data-qa={qa}>\n <div className={b('aside-popup-anchor')} ref={asideRef} />\n {customBackground && (\n <div className={b('aside-custom-background', customBackgroundClassName)}>\n {customBackground}\n </div>\n )}\n\n <div className={b('aside-content', {['with-decoration']: headerDecoration})}>\n <Header />\n {visibleMenuItems?.length ? (\n <CompositeBar\n compositeId={MENU_ITEMS_COMPOSITE_ID}\n type=\"menu\"\n compact={compact}\n items={visibleMenuItems}\n menuMoreTitle={menuMoreTitle ?? i18n('label_more')}\n onItemClick={onItemClick}\n onMoreClick={onMenuMoreClick}\n multipleTooltip={multipleTooltip}\n />\n ) : (\n <div className={b('menu-items')} />\n )}\n <div className={b('footer')}>\n {renderFooter?.({\n size,\n compact: Boolean(compact),\n asideRef,\n })}\n </div>\n {!hideCollapseButton && <CollapseButton />}\n </div>\n </div>\n <Panels />\n </React.Fragment>\n );\n});\n\nFirstPanel.displayName = 'FirstPanel';\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;AAcA,MAAM,uBAAuB,GAAG,gDAAgD;AAEzE,MAAM,UAAU,GAAGA,cAAK,CAAC,UAAU,CAAiB,CAAC,MAAM,EAAE,GAAG,KAAI;AACvE,IAAA,MAAM,EACF,IAAI,EACJ,WAAW,EACX,gBAAgB,EAChB,eAAe,EACf,aAAa,EACb,eAAe,EACf,YAAY,EACZ,OAAO,EACP,gBAAgB,EAChB,yBAAyB,EACzB,SAAS,EACT,kBAAkB,EAClB,EAAE,GACL,GAAG,0BAA0B,EAAE;AAChC,IAAA,MAAM,gBAAgB,GAAG,mBAAmB,EAAE;AAE9C,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC;AAE7C,IAAAA,cAAK,CAAC,SAAS,CAAC,MAAK;AACjB,QAAA,MAAM,CAAiB,GAAG,EAAE,QAAQ,CAAC,OAAO,CAAC;AACjD,KAAC,EAAE,CAAC,GAAG,CAAC,CAAC;AAET,IAAA,QACIA,cAAA,CAAA,aAAA,CAACA,cAAK,CAAC,QAAQ,EAAA,IAAA;AACX,QAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,OAAO,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,EAAC,KAAK,EAAE,IAAI,EAAC,aAAW,EAAE,EAAA;YACpEA,cAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,oBAAoB,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAI,CAAA;AACzD,YAAA,gBAAgB,KACbA,cAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,yBAAyB,EAAE,yBAAyB,CAAC,EAClE,EAAA,gBAAgB,CACf,CACT;AAED,YAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,eAAe,EAAE,EAAC,CAAC,iBAAiB,GAAG,gBAAgB,EAAC,CAAC,EAAA;AACvE,gBAAAA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAG,IAAA,CAAA;AACT,gBAAA,CAAA,gBAAgB,KAAA,IAAA,IAAhB,gBAAgB,KAAA,SAAA,GAAA,SAAA,GAAhB,gBAAgB,CAAE,MAAM,KACrBA,cAAC,CAAA,aAAA,CAAA,YAAY,IACT,WAAW,EAAE,uBAAuB,EACpC,IAAI,EAAC,MAAM,EACX,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,gBAAgB,EACvB,aAAa,EAAE,aAAa,KAAA,IAAA,IAAb,aAAa,KAAA,SAAA,GAAb,aAAa,GAAI,IAAI,CAAC,YAAY,CAAC,EAClD,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,eAAe,EAC5B,eAAe,EAAE,eAAe,EAClC,CAAA,KAEFA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,GAAI,CACtC;AACD,gBAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,EACtB,EAAA,YAAY,KAAZ,IAAA,IAAA,YAAY,KAAZ,SAAA,GAAA,SAAA,GAAA,YAAY,CAAG;oBACZ,IAAI;AACJ,oBAAA,OAAO,EAAE,OAAO,CAAC,OAAO,CAAC;oBACzB,QAAQ;AACX,iBAAA,CAAC,CACA;AACL,gBAAA,CAAC,kBAAkB,IAAIA,cAAA,CAAA,aAAA,CAAC,cAAc,EAAA,IAAA,CAAG,CACxC,CACJ;AACN,QAAAA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,IAAA,CAAG,CACG;AAEzB,CAAC;AAED,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}

package/build/esm/components/AsideHeader/components/FooterItem/FooterItem.css CHANGED Viewed

@@ -1,2 +1,2 @@
-.FooterItem-module__gn-footer-item___Hi7NH{--gn-aside-header-item-expanded-radius:6px;border-radius:var(--gn-aside-header-item-expanded-radius);height:36px;margin-bottom:2px;width:100%}.FooterItem-module__gn-footer-item___Hi7NH:last-child{margin-bottom:0}
+.FooterItem-module__gn-footer-item___Hi7NH{width:100%}
 .FooterItem-module__gn-mobile-header-footer-item___dk-Wo{flex-grow:1;position:relative}.FooterItem-module__gn-mobile-header-footer-item__button___KSu25{align-items:center;background:none;border:none;box-sizing:border-box;color:inherit;cursor:pointer;display:flex;font-family:var(--g-text-body-font-family);font-size:inherit;font-weight:var(--g-text-body-font-weight);justify-content:center;outline:none;padding:13px 10px;width:100%}.FooterItem-module__gn-mobile-header-footer-item___dk-Wo .FooterItem-module__gn-mobile-header-footer-item__icon___Spltd{color:var(--g-color-text-misc)}.FooterItem-module__gn-mobile-header-footer-item___dk-Wo+.FooterItem-module__gn-mobile-header-footer-item___dk-Wo:before{border-left:1px solid var(--g-color-base-generic);bottom:8px;content:"";left:0;position:absolute;top:8px}.FooterItem-module__gn-mobile-header-footer-item___dk-Wo:empty{display:none}

package/build/esm/components/AsideHeader/components/Header.js CHANGED Viewed

@@ -4,27 +4,21 @@ import { Logo } from '../../Logo/Logo.js';
 import { ASIDE_HEADER_COMPACT_WIDTH, HEADER_DIVIDER_HEIGHT } from '../../constants.js';
 import { useAsideHeaderInnerContext } from '../AsideHeaderContext.js';
 import { b } from '../utils.js';
-import { useGroupedMenuItems } from './AllPagesPanel/useGroupedMenuItems.js';
-import { CollapseButton } from './CollapseButton/CollapseButton.js';
 import { CompositeBar } from './CompositeBar/CompositeBar.js';
 import SvgDividerCollapsed from '../../../assets/icons/divider-collapsed.svg.js';
 const DEFAULT_SUBHEADER_ITEMS = [];
 const HEADER_COMPOSITE_ID = 'gravity-ui/navigation-header-composite-bar';
 const Header = () => {
-    const { logo, isExpanded, onItemClick, onClosePanel, headerDecoration, subheaderItems, hideCollapseButton, } = useAsideHeaderInnerContext();
-    const compact = !isExpanded;
-    const items = useGroupedMenuItems(subheaderItems || DEFAULT_SUBHEADER_ITEMS);
+    const { logo, onItemClick, onClosePanel, headerDecoration, subheaderItems, compact } = useAsideHeaderInnerContext();
     const onLogoClick = useCallback((event) => {
         var _a;
         onClosePanel === null || onClosePanel === undefined ? undefined : onClosePanel();
         (_a = logo === null || logo === undefined ? undefined : logo.onClick) === null || _a === undefined ? undefined : _a.call(logo, event);
     }, [onClosePanel, logo]);
     return (React__default.createElement("div", { className: b('header', { ['with-decoration']: headerDecoration }) },
-        React__default.createElement("div", { className: b('logo-container', { 'without-logo': !logo }) },
-            logo && (React__default.createElement(Logo, Object.assign({}, logo, { onClick: onLogoClick, compact: compact, buttonClassName: b('logo-button'), iconPlaceClassName: b('logo-icon-place') }))),
-            !hideCollapseButton && React__default.createElement(CollapseButton, { className: b('pin-button', { compact }) })),
-        React__default.createElement(CompositeBar, { compositeId: HEADER_COMPOSITE_ID, menuItemClassName: b('menu-item'), type: "subheader", compact: compact, items: items, onItemClick: onItemClick }),
+        logo && (React__default.createElement(Logo, Object.assign({}, logo, { onClick: onLogoClick, compact: compact, buttonClassName: b('logo-button'), iconPlaceClassName: b('logo-icon-place') }))),
+        React__default.createElement(CompositeBar, { compositeId: HEADER_COMPOSITE_ID, type: "subheader", compact: compact, items: subheaderItems || DEFAULT_SUBHEADER_ITEMS, onItemClick: onItemClick }),
         headerDecoration && (React__default.createElement(Icon, { data: SvgDividerCollapsed, className: b('header-divider'), width: ASIDE_HEADER_COMPACT_WIDTH, height: HEADER_DIVIDER_HEIGHT }))));
 };

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Header.js","sources":["../../../../../../src/components/AsideHeader/components/Header.tsx"],"sourcesContent":["import React, {useCallback} from 'react';\n\nimport {Icon} from '@gravity-ui/uikit';\n\nimport {Logo} from '../../Logo';\nimport {ASIDE_HEADER_COMPACT_WIDTH, HEADER_DIVIDER_HEIGHT} from '../../constants';\nimport {useAsideHeaderInnerContext} from '../AsideHeaderContext';\nimport {AsideHeaderItem} from '../types';\nimport {b} from '../utils';\n\nimport {~~useGroupedMenuItems} from './AllPagesPanel/useGroupedMenuItems';\nimport {CollapseButton} from './CollapseButton/CollapseButton';\nimport {~~CompositeBar} from './CompositeBar';\n\nimport headerDividerCollapsedIcon from '../../../../assets/icons/divider-collapsed.svg';\n\nconst DEFAULT_SUBHEADER_ITEMS: AsideHeaderItem[] = [];\nconst HEADER_COMPOSITE_ID = 'gravity-ui/navigation-header-composite-bar';\n\nexport const Header = () => {\n const {\n logo~~,\n isExpanded,\n~~ onItemClick~~,\n~~ onClosePanel~~,\n~~ headerDecoration~~,\n~~ subheaderItems~~,\n hideCollapseButton,\n }~~ ~~= useAsideHeaderInnerContext();\n\n const~~ compact ~~= !isExpanded;\~~n~~\n const items = useGroupedMenuItems~~(~~subheaderItems \|\| DEFAULT_SUBHEADER_ITEMS~~);\n\n const onLogoClick = useCallback(\n (event: React.MouseEvent<HTMLElement, MouseEvent>) => {\n onClosePanel?.();\n logo?.onClick?.(event);\n },\n [onClosePanel, logo],\n );\n\n return (\n <div className={b('header', {['with-decoration']: headerDecoration})}>\n ~~<div className=~~{~~b('~~logo~~-container',~~ ~~{'without-logo': !logo})}>\n {logo~~ && (\n <Logo\n {...logo}\n onClick={onLogoClick}\n compact={compact}\n buttonClassName={b('logo-button')}\n iconPlaceClassName={b('logo-icon-place')}\n />\n )}\n\n ~~{!hideCollapseButton && <CollapseButton className={b('pin-button', {compact})} />}\n~~ ~~</div>\n\n~~ <CompositeBar\n compositeId={HEADER_COMPOSITE_ID}\n ~~menuItemClassName={b('menu-item')}\n~~ type=\"subheader\"\n compact={compact}\n items={~~items~~}\n onItemClick={onItemClick}\n />\n\n {headerDecoration && (\n <Icon\n data={headerDividerCollapsedIcon}\n className={b('header-divider')}\n width={ASIDE_HEADER_COMPACT_WIDTH}\n height={HEADER_DIVIDER_HEIGHT}\n />\n )}\n </div>\n );\n};\n"],"names":["React","headerDividerCollapsedIcon"],"mappings":"~~;;;;;;;;;;;AAgBA~~,MAAM,uBAAuB,GAAsB,EAAE;AACrD,MAAM,mBAAmB,GAAG,4CAA4C;AAEjE,MAAM,MAAM,GAAG,MAAK;AACvB,IAAA,MAAM,~~EACF~~,IAAI,~~EACJ~~,~~UAAU,EACV,~~WAAW,~~EACX~~,YAAY,~~EACZ~~,gBAAgB,~~EAChB~~,cAAc,~~EACd~~,~~kBAAkB~~,~~GACrB~~,~~GAAG~~,0BAA0B,EAAE;AAEhC,IAAA,MAAM,~~OAAO,GAAG,CAAC,UAAU;IAE3B,MAAM,KAAK,GAAG,mBAAmB,CAAC,cAAc,IAAI,uBAAuB,CAAC;AAE5E,IAAA,MAAM,~~WAAW,GAAG,WAAW,CAC3B,CAAC,KAAgD,KAAI;;AACjD,QAAA,YAAY,KAAZ,IAAA,IAAA,YAAY,KAAZ,SAAA,GAAA,SAAA,GAAA,YAAY,EAAI;QAChB,CAAA,EAAA,GAAA,IAAI,KAAJ,IAAA,IAAA,IAAI,KAAJ,SAAA,GAAA,SAAA,GAAA,IAAI,CAAE,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAA,IAAA,CAAA,IAAA,EAAG,KAAK,CAAC;AAC1B,KAAC,EACD,CAAC,YAAY,EAAE,IAAI,CAAC,CACvB;AAED,IAAA,QACIA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,QAAQ,EAAE,EAAC,CAAC,iBAAiB,GAAG,gBAAgB,EAAC,CAAC,EAAA;~~AAChE~~,~~QAAAA~~,~~cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAAE,EAAC,cAAc,EAAE,CAAC,~~IAAI,~~EAAC,CAAC,EAAA;AACvD,YAAA,IAAI,~~KACDA,cAAC,CAAA,aAAA,CAAA,IAAI,EACG,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,IAAI,EACR,EAAA,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,OAAO,EAChB,eAAe,EAAE,CAAC,CAAC,aAAa,CAAC,EACjC,kBAAkB,EAAE,CAAC,CAAC,iBAAiB,CAAC,IAC1C,CACL;~~AAEA~~,~~YAAA~~,~~CAAC,kBAAkB,IAAIA,cAAA,~~CAAA,aAAA,~~CAAC,cAAc,EAAA,EAAC,SAAS,EAAE,CAAC,CAAC,YAAY,EAAE,EAAC,OAAO,EAAC,CAAC,GAAI,CAC/E;AAEN,QAAAA,cAAA,~~CAAA,~~aAAA,CAAC,~~YAAY,~~EAAA~~,~~EACT,~~WAAW,EAAE,mBAAmB,EAChC,~~iBAAiB,EAAE,CAAC,CAAC,WAAW,CAAC,EACjC,~~IAAI,EAAC,WAAW,EAChB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,~~KAAK~~,~~EACZ~~,WAAW,EAAE,WAAW,EAC1B,CAAA;QAED,gBAAgB,KACbA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EACD,IAAI,EAAEC,mBAA0B,EAChC,SAAS,EAAE,CAAC,CAAC,gBAAgB,CAAC,EAC9B,KAAK,EAAE,0BAA0B,EACjC,MAAM,EAAE,qBAAqB,EAC/B,CAAA,CACL,CACC;AAEd;;;;"}
1	+ {"version":3,"file":"Header.js","sources":["../../../../../../src/components/AsideHeader/components/Header.tsx"],"sourcesContent":["import React, {useCallback} from 'react';\n\nimport {Icon} from '@gravity-ui/uikit';\n\nimport {Logo} from '../../Logo';\nimport {ASIDE_HEADER_COMPACT_WIDTH, HEADER_DIVIDER_HEIGHT} from '../../constants';\nimport {useAsideHeaderInnerContext} from '../AsideHeaderContext';\nimport {AsideHeaderItem} from '../types';\nimport {b} from '../utils';\n\nimport {CompositeBar} from './CompositeBar';\n\nimport headerDividerCollapsedIcon from '../../../../assets/icons/divider-collapsed.svg';\n\nconst DEFAULT_SUBHEADER_ITEMS: AsideHeaderItem[] = [];\nconst HEADER_COMPOSITE_ID = 'gravity-ui/navigation-header-composite-bar';\n\nexport const Header = () => {\n const {logo, onItemClick, onClosePanel, headerDecoration, subheaderItems, compact} =\n useAsideHeaderInnerContext();\n\n const onLogoClick = useCallback(\n (event: React.MouseEvent<HTMLElement, MouseEvent>) => {\n onClosePanel?.();\n logo?.onClick?.(event);\n },\n [onClosePanel, logo],\n );\n\n return (\n <div className={b('header', {['with-decoration']: headerDecoration})}>\n {logo && (\n <Logo\n {...logo}\n onClick={onLogoClick}\n compact={compact}\n buttonClassName={b('logo-button')}\n iconPlaceClassName={b('logo-icon-place')}\n />\n )}\n\n <CompositeBar\n compositeId={HEADER_COMPOSITE_ID}\n type=\"subheader\"\n compact={compact}\n items={subheaderItems \|\| DEFAULT_SUBHEADER_ITEMS}\n onItemClick={onItemClick}\n />\n\n {headerDecoration && (\n <Icon\n data={headerDividerCollapsedIcon}\n className={b('header-divider')}\n width={ASIDE_HEADER_COMPACT_WIDTH}\n height={HEADER_DIVIDER_HEIGHT}\n />\n )}\n </div>\n );\n};\n"],"names":["React","headerDividerCollapsedIcon"],"mappings":";;;;;;;;;AAcA,MAAM,uBAAuB,GAAsB,EAAE;AACrD,MAAM,mBAAmB,GAAG,4CAA4C;AAEjE,MAAM,MAAM,GAAG,MAAK;AACvB,IAAA,MAAM,EAAC,IAAI,EAAE,WAAW,EAAE,YAAY,EAAE,gBAAgB,EAAE,cAAc,EAAE,OAAO,EAAC,GAC9E,0BAA0B,EAAE;AAEhC,IAAA,MAAM,WAAW,GAAG,WAAW,CAC3B,CAAC,KAAgD,KAAI;;AACjD,QAAA,YAAY,KAAZ,IAAA,IAAA,YAAY,KAAZ,SAAA,GAAA,SAAA,GAAA,YAAY,EAAI;QAChB,CAAA,EAAA,GAAA,IAAI,KAAJ,IAAA,IAAA,IAAI,KAAJ,SAAA,GAAA,SAAA,GAAA,IAAI,CAAE,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAA,IAAA,CAAA,IAAA,EAAG,KAAK,CAAC;AAC1B,KAAC,EACD,CAAC,YAAY,EAAE,IAAI,CAAC,CACvB;AAED,IAAA,QACIA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,QAAQ,EAAE,EAAC,CAAC,iBAAiB,GAAG,gBAAgB,EAAC,CAAC,EAAA;AAC/D,QAAA,IAAI,KACDA,cAAC,CAAA,aAAA,CAAA,IAAI,EACG,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,IAAI,EACR,EAAA,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,OAAO,EAChB,eAAe,EAAE,CAAC,CAAC,aAAa,CAAC,EACjC,kBAAkB,EAAE,CAAC,CAAC,iBAAiB,CAAC,IAC1C,CACL;QAEDA,cAAC,CAAA,aAAA,CAAA,YAAY,IACT,WAAW,EAAE,mBAAmB,EAChC,IAAI,EAAC,WAAW,EAChB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,cAAc,IAAI,uBAAuB,EAChD,WAAW,EAAE,WAAW,EAC1B,CAAA;QAED,gBAAgB,KACbA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EACD,IAAI,EAAEC,mBAA0B,EAChC,SAAS,EAAE,CAAC,CAAC,gBAAgB,CAAC,EAC9B,KAAK,EAAE,0BAA0B,EACjC,MAAM,EAAE,qBAAqB,EAC/B,CAAA,CACL,CACC;AAEd;;;;"}

package/build/esm/components/AsideHeader/components/PageLayout/AsideFallback.css ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ .AsideHeader-module__g-root___EuNRw{--gn-aside-top-panel-height:0px}
2	+ .AsideHeader-module__gn-aside-header___Z0Sa7{--gn-aside-header-min-width:56px;--_--item-icon-background-size:38px;--_--background-color:var(--g-color-base-background);--_--decoration-collapsed-background-color:var(--g-color-base-warning-light);--_--decoration-expanded-background-color:var(--g-color-base-warning-light);--_--vertical-divider-line-color:var(--g-color-line-generic);--_--horizontal-divider-line-color:var(--g-color-line-generic);background-color:var(--g-color-base-background);height:100%;position:relative;width:100%}.AsideHeader-module__gn-aside-header__aside___AyP0y{background-color:var(--gn-aside-header-expanded-background-color,var(--gn-aside-header-background-color,var(--_--background-color)));box-sizing:border-box;display:flex;flex-direction:column;height:100vh;left:0;margin-top:var(--gn-top-alert-height,0);max-height:calc(100vh - var(--gn-top-alert-height, 0));position:sticky;top:var(--gn-top-alert-height,0);width:inherit;z-index:var(--gn-aside-header-z-index,100)}.AsideHeader-module__gn-aside-header__aside___AyP0y:after{background-color:var(--gn-aside-header-divider-vertical-color,var(--_--vertical-divider-line-color));content:"";height:100%;position:absolute;right:0;top:0;width:1px;z-index:2}.AsideHeader-module__gn-aside-header__aside-popup-anchor___N3tgM{inset:0;position:absolute;z-index:1}.AsideHeader-module__gn-aside-header__aside-content___w5GOS{--gradient-height:334px;display:flex;flex-direction:column;height:inherit;overflow-x:hidden;padding-top:var(--gn-aside-header-padding-top);position:relative;user-select:none;width:inherit;z-index:2}.AsideHeader-module__gn-aside-header__aside-content___w5GOS>.AsideHeader-module__gn-aside-header-logo___6MdXx{margin:8px 0}.AsideHeader-module__gn-aside-header__aside-content_with-decoration___UsCye{background:linear-gradient(180deg,var(--gn-aside-header-decoration-expanded-background-color,var(--_--decoration-expanded-background-color)) calc(var(--gradient-height).33),transparent calc(var(--gradient-height).88))}.AsideHeader-module__gn-aside-header__aside-custom-background___-bqdE{bottom:0;display:flex;position:absolute;top:0;width:var(--gn-aside-header-size);z-index:-1}.AsideHeader-module__gn-aside-header_compact___z-nL- .AsideHeader-module__gn-aside-header__aside___AyP0y{background-color:var(--gn-aside-header-collapsed-background-color,var(--gn-aside-header-background-color,var(--_--background-color)))}.AsideHeader-module__gn-aside-header_compact___z-nL- .AsideHeader-module__gn-aside-header__aside-content___w5GOS{background:transparent}.AsideHeader-module__gn-aside-header__header___m5aIU{--gn-aside-header-header-divider-height:29px;box-sizing:border-box;flex:none;padding-bottom:22px;padding-top:8px;position:relative;width:100%;z-index:1}.AsideHeader-module__gn-aside-header__header___m5aIU .AsideHeader-module__gn-aside-header__header-divider___lIG-e{bottom:0;color:var(--gn-aside-header-decoration-collapsed-background-color,var(--_--decoration-collapsed-background-color));display:none;left:0;position:absolute;z-index:-2}.AsideHeader-module__gn-aside-header__header_with-decoration___3dTJO:before{background-color:var(--gn-aside-header-decoration-collapsed-background-color,var(--_--decoration-collapsed-background-color));content:"";display:none;height:calc(100% - var(--gn-aside-header-header-divider-height));left:0;position:absolute;top:0;width:100%;z-index:-2}.AsideHeader-module__gn-aside-header__header___m5aIU:after{background-color:var(--gn-aside-header-divider-horizontal-color,var(--_--horizontal-divider-line-color));bottom:12px;content:"";height:1px;left:0;position:absolute;width:100%;z-index:-2}.AsideHeader-module__gn-aside-header_compact___z-nL- .AsideHeader-module__gn-aside-header__header___m5aIU:before, .AsideHeader-module__gn-aside-header_compact___z-nL- .AsideHeader-module__gn-aside-header__header_with-decoration___3dTJO .AsideHeader-module__gn-aside-header__header-divider___lIG-e{display:block}.AsideHeader-module__gn-aside-header_compact___z-nL- .AsideHeader-module__gn-aside-header__header_with-decoration___3dTJO:after{display:none}.AsideHeader-module__gn-aside-header__logo-button___5u2iH .AsideHeader-module__gn-aside-header__logo-icon-place___3Oo9i{height:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));width:var(--gn-aside-header-min-width)}.AsideHeader-module__gn-aside-header__menu-items___SOI2-{flex-grow:1}.AsideHeader-module__gn-aside-header__footer___vmoTl{display:flex;flex-direction:column;flex-shrink:0;margin:8px 0;width:100%}.AsideHeader-module__gn-aside-header__panels___-fdu4{z-index:var(--gn-aside-header-panel-z-index,98)}.AsideHeader-module__gn-aside-header__panel___HywH6, .AsideHeader-module__gn-aside-header__panel___HywH6.g-drawer__item{bottom:0;height:auto;top:0}.AsideHeader-module__gn-aside-header__pane-container___y-v2e{display:flex;flex-direction:row;outline:none;overflow:visible;user-select:text}.AsideHeader-module__gn-aside-header__top-alert___hY12r{background:var(--g-color-base-background);position:fixed;top:0;width:100%;z-index:var(--gn-aside-header-pane-top-z-index,98)}.AsideHeader-module__gn-aside-header__content___4-mBl{margin-top:var(--gn-top-alert-height,0);width:calc(100% - var(--gn-aside-header-size));z-index:var(--gn-aside-header-content-z-index,95)}.AsideHeader-module__gn-aside-header__all-pages-panel___O94IU{width:fit-content!important}

package/build/esm/components/AsideHeader/components/PageLayout/AsideFallback.js CHANGED Viewed

@@ -1,3 +1,4 @@
+import './AsideFallback.css';
 import React__default from 'react';
 import { Icon } from '@gravity-ui/uikit';
 import { ASIDE_HEADER_COMPACT_WIDTH, HEADER_DIVIDER_HEIGHT, ITEM_HEIGHT } from '../../../constants.js';

package/build/esm/components/AsideHeader/components/PageLayout/PageLayout.css ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ .AsideHeader-module__g-root___EuNRw{--gn-aside-top-panel-height:0px}
2	+ .AsideHeader-module__gn-aside-header___Z0Sa7{--gn-aside-header-min-width:56px;--_--item-icon-background-size:38px;--_--background-color:var(--g-color-base-background);--_--decoration-collapsed-background-color:var(--g-color-base-warning-light);--_--decoration-expanded-background-color:var(--g-color-base-warning-light);--_--vertical-divider-line-color:var(--g-color-line-generic);--_--horizontal-divider-line-color:var(--g-color-line-generic);background-color:var(--g-color-base-background);height:100%;position:relative;width:100%}.AsideHeader-module__gn-aside-header__aside___AyP0y{background-color:var(--gn-aside-header-expanded-background-color,var(--gn-aside-header-background-color,var(--_--background-color)));box-sizing:border-box;display:flex;flex-direction:column;height:100vh;left:0;margin-top:var(--gn-top-alert-height,0);max-height:calc(100vh - var(--gn-top-alert-height, 0));position:sticky;top:var(--gn-top-alert-height,0);width:inherit;z-index:var(--gn-aside-header-z-index,100)}.AsideHeader-module__gn-aside-header__aside___AyP0y:after{background-color:var(--gn-aside-header-divider-vertical-color,var(--_--vertical-divider-line-color));content:"";height:100%;position:absolute;right:0;top:0;width:1px;z-index:2}.AsideHeader-module__gn-aside-header__aside-popup-anchor___N3tgM{inset:0;position:absolute;z-index:1}.AsideHeader-module__gn-aside-header__aside-content___w5GOS{--gradient-height:334px;display:flex;flex-direction:column;height:inherit;overflow-x:hidden;padding-top:var(--gn-aside-header-padding-top);position:relative;user-select:none;width:inherit;z-index:2}.AsideHeader-module__gn-aside-header__aside-content___w5GOS>.AsideHeader-module__gn-aside-header-logo___6MdXx{margin:8px 0}.AsideHeader-module__gn-aside-header__aside-content_with-decoration___UsCye{background:linear-gradient(180deg,var(--gn-aside-header-decoration-expanded-background-color,var(--_--decoration-expanded-background-color)) calc(var(--gradient-height).33),transparent calc(var(--gradient-height).88))}.AsideHeader-module__gn-aside-header__aside-custom-background___-bqdE{bottom:0;display:flex;position:absolute;top:0;width:var(--gn-aside-header-size);z-index:-1}.AsideHeader-module__gn-aside-header_compact___z-nL- .AsideHeader-module__gn-aside-header__aside___AyP0y{background-color:var(--gn-aside-header-collapsed-background-color,var(--gn-aside-header-background-color,var(--_--background-color)))}.AsideHeader-module__gn-aside-header_compact___z-nL- .AsideHeader-module__gn-aside-header__aside-content___w5GOS{background:transparent}.AsideHeader-module__gn-aside-header__header___m5aIU{--gn-aside-header-header-divider-height:29px;box-sizing:border-box;flex:none;padding-bottom:22px;padding-top:8px;position:relative;width:100%;z-index:1}.AsideHeader-module__gn-aside-header__header___m5aIU .AsideHeader-module__gn-aside-header__header-divider___lIG-e{bottom:0;color:var(--gn-aside-header-decoration-collapsed-background-color,var(--_--decoration-collapsed-background-color));display:none;left:0;position:absolute;z-index:-2}.AsideHeader-module__gn-aside-header__header_with-decoration___3dTJO:before{background-color:var(--gn-aside-header-decoration-collapsed-background-color,var(--_--decoration-collapsed-background-color));content:"";display:none;height:calc(100% - var(--gn-aside-header-header-divider-height));left:0;position:absolute;top:0;width:100%;z-index:-2}.AsideHeader-module__gn-aside-header__header___m5aIU:after{background-color:var(--gn-aside-header-divider-horizontal-color,var(--_--horizontal-divider-line-color));bottom:12px;content:"";height:1px;left:0;position:absolute;width:100%;z-index:-2}.AsideHeader-module__gn-aside-header_compact___z-nL- .AsideHeader-module__gn-aside-header__header___m5aIU:before, .AsideHeader-module__gn-aside-header_compact___z-nL- .AsideHeader-module__gn-aside-header__header_with-decoration___3dTJO .AsideHeader-module__gn-aside-header__header-divider___lIG-e{display:block}.AsideHeader-module__gn-aside-header_compact___z-nL- .AsideHeader-module__gn-aside-header__header_with-decoration___3dTJO:after{display:none}.AsideHeader-module__gn-aside-header__logo-button___5u2iH .AsideHeader-module__gn-aside-header__logo-icon-place___3Oo9i{height:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));width:var(--gn-aside-header-min-width)}.AsideHeader-module__gn-aside-header__menu-items___SOI2-{flex-grow:1}.AsideHeader-module__gn-aside-header__footer___vmoTl{display:flex;flex-direction:column;flex-shrink:0;margin:8px 0;width:100%}.AsideHeader-module__gn-aside-header__panels___-fdu4{z-index:var(--gn-aside-header-panel-z-index,98)}.AsideHeader-module__gn-aside-header__panel___HywH6, .AsideHeader-module__gn-aside-header__panel___HywH6.g-drawer__item{bottom:0;height:auto;top:0}.AsideHeader-module__gn-aside-header__pane-container___y-v2e{display:flex;flex-direction:row;outline:none;overflow:visible;user-select:text}.AsideHeader-module__gn-aside-header__top-alert___hY12r{background:var(--g-color-base-background);position:fixed;top:0;width:100%;z-index:var(--gn-aside-header-pane-top-z-index,98)}.AsideHeader-module__gn-aside-header__content___4-mBl{margin-top:var(--gn-top-alert-height,0);width:calc(100% - var(--gn-aside-header-size));z-index:var(--gn-aside-header-content-z-index,95)}.AsideHeader-module__gn-aside-header__all-pages-panel___O94IU{width:fit-content!important}

package/build/esm/components/AsideHeader/components/PageLayout/PageLayout.d.ts CHANGED Viewed

@@ -2,9 +2,8 @@ import React, { PropsWithChildren } from 'react';
 import { ContentProps } from '../../../Content';
 import { LayoutProps } from '../../types';
 export interface PageLayoutProps extends PropsWithChildren<LayoutProps> {
-    onChangeCompact?: (compact: boolean) => void;
 }
-declare const PageLayout: (({ compact, className, children, topAlert, onChangeCompact }: PageLayoutProps) => React.JSX.Element) & {
+declare const PageLayout: (({ compact, className, children, topAlert }: PageLayoutProps) => React.JSX.Element) & {
     Content: React.FC<React.PropsWithChildren<Pick<ContentProps, "renderContent">>>;
 };
 export { PageLayout };