@gravity-ui/navigation 3.0.0-beta.1 → 3.0.0-beta.3

package/build/cjs/components/AllPagesPanel/AllPagesPanel.js

@@ -0,0 +1,101 @@
+'use strict';
+
+var React = require('react');
+var icons = require('@gravity-ui/icons');
+var uikit = require('@gravity-ui/uikit');
+var AsideHeaderContext = require('../AsideHeader/AsideHeaderContext.js');
+var cn = require('../utils/cn.js');
+var AllPagesListItem = require('./AllPagesListItem/AllPagesListItem.js');
+var constants = require('./constants.js');
+var index = require('./i18n/index.js');
+var useGroupedMenuItems = require('./useGroupedMenuItems.js');
+require('./AllPagesPanel.scss.js');
+
+const b = cn.block('all-pages-panel');
+const AllPagesPanel = (props) => {
+    const { startEditIcon, onEditModeChanged, className } = props;
+    const { menuItems, defaultMenuItems, onMenuItemsChanged, editMenuProps } = AsideHeaderContext.useAsideHeaderInnerContext();
+    const menuItemsRef = React.useRef(menuItems);
+    menuItemsRef.current = menuItems;
+    const [isEditMode, setIsEditMode] = React.useState(false);
+    const [draggingItemTitle, setDraggingItemTitle] = React.useState(null);
+    const toggleEditMode = React.useCallback(() => {
+        setIsEditMode((prev) => !prev);
+    }, []);
+    const groupedItems = useGroupedMenuItems.useGroupedMenuItems(menuItems);
+    React.useEffect(() => {
+        var _a;
+        onEditModeChanged === null || onEditModeChanged === undefined ? undefined : onEditModeChanged(isEditMode);
+        if (isEditMode) {
+            (_a = editMenuProps === null || editMenuProps === undefined ? undefined : editMenuProps.onOpenEditMode) === null || _a === undefined ? undefined : _a.call(editMenuProps);
+        }
+    }, [isEditMode, onEditModeChanged, editMenuProps]);
+    const onItemClick = React.useCallback((item) => {
+        var _a;
+        //@ts-ignore TODO fix when @gravity-ui/uikit/List will provide event arg on item click
+        (_a = item.onItemClick) === null || _a === undefined ? undefined : _a.call(item, item, false);
+    }, []);
+    const togglePageVisibility = React.useCallback((item) => {
+        var _a;
+        if (!onMenuItemsChanged) {
+            return;
+        }
+        const changedItem = Object.assign(Object.assign({}, item), { hidden: !item.hidden });
+        const originItems = menuItemsRef.current.filter((menuItem) => menuItem.id !== constants.ALL_PAGES_ID);
+        (_a = editMenuProps === null || editMenuProps === undefined ? undefined : editMenuProps.onToggleMenuItem) === null || _a === undefined ? undefined : _a.call(editMenuProps, changedItem);
+        onMenuItemsChanged(originItems.map((menuItem) => {
+            if (menuItem.id !== changedItem.id) {
+                return menuItem;
+            }
+            return changedItem;
+        }));
+    }, [onMenuItemsChanged, editMenuProps]);
+    const onDragEnd = React.useCallback(() => {
+        setDraggingItemTitle(null);
+    }, [setDraggingItemTitle]);
+    const itemRender = React.useCallback((item, _isActive, _itemIndex) => {
+        const onDragStart = () => {
+            setDraggingItemTitle(item.title);
+        };
+        return (React.createElement(AllPagesListItem.AllPagesListItem, { item: item, onDragStart: onDragStart, onDragEnd: onDragEnd, editMode: isEditMode, onToggle: () => togglePageVisibility(item), enableSorting: editMenuProps === null || editMenuProps === undefined ? undefined : editMenuProps.enableSorting }));
+    }, [isEditMode, togglePageVisibility, onDragEnd, setDraggingItemTitle, editMenuProps]);
+    const onResetToDefaultClick = React.useCallback(() => {
+        var _a;
+        if (!onMenuItemsChanged) {
+            return;
+        }
+        (_a = editMenuProps === null || editMenuProps === undefined ? undefined : editMenuProps.onResetSettingsToDefault) === null || _a === undefined ? undefined : _a.call(editMenuProps);
+        const originItems = defaultMenuItems === null || defaultMenuItems === undefined ? undefined : defaultMenuItems.filter((item) => item.id !== constants.ALL_PAGES_ID);
+        if (originItems) {
+            onMenuItemsChanged(originItems);
+        }
+    }, [onMenuItemsChanged, editMenuProps, defaultMenuItems]);
+    const changeItemsOrder = React.useCallback(({ oldIndex, newIndex }) => {
+        var _a;
+        const newItems = menuItemsRef.current.filter((item) => item.id !== constants.ALL_PAGES_ID);
+        const element = newItems.splice(oldIndex, 1)[0];
+        newItems.splice(newIndex, 0, element);
+        onMenuItemsChanged === null || onMenuItemsChanged === undefined ? undefined : onMenuItemsChanged(newItems.filter((item) => item.type !== 'divider'));
+        setDraggingItemTitle(null);
+        (_a = editMenuProps === null || editMenuProps === undefined ? undefined : editMenuProps.onChangeItemsOrder) === null || _a === undefined ? undefined : _a.call(editMenuProps, element, oldIndex, newIndex);
+    }, [onMenuItemsChanged, editMenuProps]);
+    const sortableItems = React.useMemo(() => {
+        return menuItemsRef.current.filter((item) => item.id !== constants.ALL_PAGES_ID && !item.afterMoreButton && item.type !== 'divider');
+    }, [menuItems]);
+    return (React.createElement(uikit.Flex, { className: b(null, className), gap: "5", direction: "column" },
+        React.createElement(uikit.Flex, { gap: "4", alignItems: "center", justifyContent: "space-between" },
+            React.createElement(uikit.Text, { variant: "subheader-2" }, isEditMode ? index('all-panel.title.editing') : index('all-panel.title.main')),
+            React.createElement(uikit.Tooltip, { content: index('all-panel.title.editing') },
+                React.createElement(uikit.Button, { selected: isEditMode, view: "normal", onClick: toggleEditMode }, startEditIcon ? startEditIcon : React.createElement(uikit.Icon, { data: icons.Gear })))),
+        React.createElement(uikit.Flex, { className: b('content'), gap: "5", direction: "column" }, isEditMode && (editMenuProps === null || editMenuProps === undefined ? undefined : editMenuProps.enableSorting) ? (React.createElement("div", null,
+            React.createElement(uikit.List, { itemClassName: b('item', { editMode: true }), itemHeight: 40, onSortEnd: changeItemsOrder, sortable: true, virtualized: false, filterable: false, items: sortableItems, onItemClick: onItemClick, renderItem: itemRender }),
+            draggingItemTitle && (React.createElement("div", { className: b('drag-placeholder') }, draggingItemTitle)))) : (Object.keys(groupedItems).map((category) => {
+            return (React.createElement(uikit.Flex, { key: category, direction: "column", gap: "3" },
+                React.createElement(uikit.Text, { className: b('category'), variant: "body-1", color: "secondary" }, category),
+                React.createElement(uikit.List, { virtualized: false, filterable: false, items: groupedItems[category], onItemClick: onItemClick, renderItem: itemRender })));
+        }))),
+        isEditMode && (React.createElement(uikit.Button, { onClick: onResetToDefaultClick }, index('all-panel.resetToDefault')))));
+};
+
+exports.AllPagesPanel = AllPagesPanel;
+//# sourceMappingURL=AllPagesPanel.js.map

package/build/cjs/components/AllPagesPanel/AllPagesPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AllPagesPanel.js","sources":["../../../../../src/components/AllPagesPanel/AllPagesPanel.tsx"],"sourcesContent":["import React, {ReactNode, useCallback, useEffect, useMemo, useRef, useState} from 'react';\n\nimport {Gear} from '@gravity-ui/icons';\nimport {Button, Flex, Icon, List, ListItemData, Text, Tooltip} from '@gravity-ui/uikit';\n\nimport {useAsideHeaderInnerContext} from '../AsideHeader/AsideHeaderContext';\nimport {MenuItem} from '../types';\nimport {block} from '../utils/cn';\n\nimport {AllPagesListItem} from './AllPagesListItem';\nimport {ALL_PAGES_ID} from './constants';\nimport i18n from './i18n';\nimport {useGroupedMenuItems} from './useGroupedMenuItems';\n\nimport './AllPagesPanel.scss';\n\nconst b = block('all-pages-panel');\n\ninterface AllPagesPanelProps {\n    className?: string;\n    startEditIcon?: React.ReactNode;\n    onEditModeChanged?: (isEditMode: boolean) => void;\n}\n\nexport const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {\n    const {startEditIcon, onEditModeChanged, className} = props;\n    const {menuItems, defaultMenuItems, onMenuItemsChanged, editMenuProps} =\n        useAsideHeaderInnerContext();\n\n    const menuItemsRef = useRef(menuItems);\n    menuItemsRef.current = menuItems;\n\n    const [isEditMode, setIsEditMode] = useState(false);\n\n    const [draggingItemTitle, setDraggingItemTitle] = useState<ReactNode | null>(null);\n\n    const toggleEditMode = useCallback(() => {\n        setIsEditMode((prev) => !prev);\n    }, []);\n\n    const groupedItems = useGroupedMenuItems(menuItems);\n\n    useEffect(() => {\n        onEditModeChanged?.(isEditMode);\n\n        if (isEditMode) {\n            editMenuProps?.onOpenEditMode?.();\n        }\n    }, [isEditMode, onEditModeChanged, editMenuProps]);\n\n    const onItemClick = useCallback((item: ListItemData<MenuItem>) => {\n        //@ts-ignore TODO fix when @gravity-ui/uikit/List will provide event arg on item click\n        item.onItemClick?.(item, false);\n    }, []);\n\n    const togglePageVisibility = useCallback(\n        (item: MenuItem) => {\n            if (!onMenuItemsChanged) {\n                return;\n            }\n            const changedItem: MenuItem = {...item, hidden: !item.hidden};\n\n            const originItems = menuItemsRef.current.filter(\n                (menuItem) => menuItem.id !== ALL_PAGES_ID,\n            );\n            editMenuProps?.onToggleMenuItem?.(changedItem);\n            onMenuItemsChanged(\n                originItems.map((menuItem) => {\n                    if (menuItem.id !== changedItem.id) {\n                        return menuItem;\n                    }\n                    return changedItem;\n                }),\n            );\n        },\n        [onMenuItemsChanged, editMenuProps],\n    );\n\n    const onDragEnd = useCallback(() => {\n        setDraggingItemTitle(null);\n    }, [setDraggingItemTitle]);\n\n    const itemRender = useCallback(\n        (item: ListItemData<MenuItem>, _isActive: boolean, _itemIndex: number) => {\n            const onDragStart = () => {\n                setDraggingItemTitle(item.title);\n            };\n\n            return (\n                <AllPagesListItem\n                    item={item}\n                    onDragStart={onDragStart}\n                    onDragEnd={onDragEnd}\n                    editMode={isEditMode}\n                    onToggle={() => togglePageVisibility(item)}\n                    enableSorting={editMenuProps?.enableSorting}\n                />\n            );\n        },\n        [isEditMode, togglePageVisibility, onDragEnd, setDraggingItemTitle, editMenuProps],\n    );\n\n    const onResetToDefaultClick = useCallback(() => {\n        if (!onMenuItemsChanged) {\n            return;\n        }\n        editMenuProps?.onResetSettingsToDefault?.();\n        const originItems = defaultMenuItems?.filter((item) => item.id !== ALL_PAGES_ID);\n\n        if (originItems) {\n            onMenuItemsChanged(originItems);\n        }\n    }, [onMenuItemsChanged, editMenuProps, defaultMenuItems]);\n\n    const changeItemsOrder = useCallback(\n        ({oldIndex, newIndex}: {oldIndex: number; newIndex: number}) => {\n            const newItems = menuItemsRef.current.filter((item) => item.id !== ALL_PAGES_ID);\n\n            const element = newItems.splice(oldIndex, 1)[0];\n            newItems.splice(newIndex, 0, element);\n\n            onMenuItemsChanged?.(newItems.filter((item) => item.type !== 'divider'));\n\n            setDraggingItemTitle(null);\n            editMenuProps?.onChangeItemsOrder?.(element, oldIndex, newIndex);\n        },\n        [onMenuItemsChanged, editMenuProps],\n    );\n\n    const sortableItems = useMemo(() => {\n        return menuItemsRef.current.filter(\n            (item) => item.id !== ALL_PAGES_ID && !item.afterMoreButton && item.type !== 'divider',\n        );\n    }, [menuItems]);\n\n    return (\n        <Flex className={b(null, className)} gap=\"5\" direction=\"column\">\n            <Flex gap=\"4\" alignItems=\"center\" justifyContent=\"space-between\">\n                <Text variant=\"subheader-2\">\n                    {isEditMode ? i18n('all-panel.title.editing') : i18n('all-panel.title.main')}\n                </Text>\n                <Tooltip content={i18n('all-panel.title.editing')}>\n                    <Button selected={isEditMode} view=\"normal\" onClick={toggleEditMode}>\n                        {startEditIcon ? startEditIcon : <Icon data={Gear} />}\n                    </Button>\n                </Tooltip>\n            </Flex>\n            <Flex className={b('content')} gap=\"5\" direction=\"column\">\n                {isEditMode && editMenuProps?.enableSorting ? (\n                    <div>\n                        <List\n                            itemClassName={b('item', {editMode: true})}\n                            itemHeight={40}\n                            onSortEnd={changeItemsOrder}\n                            sortable\n                            virtualized={false}\n                            filterable={false}\n                            items={sortableItems}\n                            onItemClick={onItemClick}\n                            renderItem={itemRender}\n                        />\n\n                        {draggingItemTitle && (\n                            <div className={b('drag-placeholder')}>{draggingItemTitle}</div>\n                        )}\n                    </div>\n                ) : (\n                    Object.keys(groupedItems).map((category) => {\n                        return (\n                            <Flex key={category} direction=\"column\" gap=\"3\">\n                                <Text className={b('category')} variant=\"body-1\" color=\"secondary\">\n                                    {category}\n                                </Text>\n                                <List\n                                    virtualized={false}\n                                    filterable={false}\n                                    items={groupedItems[category]}\n                                    onItemClick={onItemClick}\n                                    renderItem={itemRender}\n                                />\n                            </Flex>\n                        );\n                    })\n                )}\n            </Flex>\n            {isEditMode && (\n                <Button onClick={onResetToDefaultClick}>{i18n('all-panel.resetToDefault')}</Button>\n            )}\n        </Flex>\n    );\n};\n"],"names":["block","useAsideHeaderInnerContext","useRef","useState","useCallback","useGroupedMenuItems","useEffect","ALL_PAGES_ID","AllPagesListItem","useMemo","Flex","Text","i18n","Tooltip","Button","Icon","Gear","List"],"mappings":";;;;;;;;;;;;;AAgBA,MAAM,CAAC,GAAGA,QAAK,CAAC,iBAAiB,CAAC;AAQrB,MAAA,aAAa,GAAiC,CAAC,KAAK,KAAI;IACjE,MAAM,EAAC,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAC,GAAG,KAAK;AAC3D,IAAA,MAAM,EAAC,SAAS,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,aAAa,EAAC,GAClEC,6CAA0B,EAAE;AAEhC,IAAA,MAAM,YAAY,GAAGC,YAAM,CAAC,SAAS,CAAC;AACtC,IAAA,YAAY,CAAC,OAAO,GAAG,SAAS;IAEhC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAGC,cAAQ,CAAC,KAAK,CAAC;IAEnD,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAGA,cAAQ,CAAmB,IAAI,CAAC;AAElF,IAAA,MAAM,cAAc,GAAGC,iBAAW,CAAC,MAAK;QACpC,aAAa,CAAC,CAAC,IAAI,KAAK,CAAC,IAAI,CAAC;KACjC,EAAE,EAAE,CAAC;AAEN,IAAA,MAAM,YAAY,GAAGC,uCAAmB,CAAC,SAAS,CAAC;IAEnDC,eAAS,CAAC,MAAK;;AACX,QAAA,iBAAiB,aAAjB,iBAAiB,KAAA,SAAA,GAAA,SAAA,GAAjB,iBAAiB,CAAG,UAAU,CAAC;QAE/B,IAAI,UAAU,EAAE;YACZ,CAAA,EAAA,GAAA,aAAa,aAAb,aAAa,KAAA,SAAA,GAAA,SAAA,GAAb,aAAa,CAAE,cAAc,mEAAI;;KAExC,EAAE,CAAC,UAAU,EAAE,iBAAiB,EAAE,aAAa,CAAC,CAAC;AAElD,IAAA,MAAM,WAAW,GAAGF,iBAAW,CAAC,CAAC,IAA4B,KAAI;;;QAE7D,CAAA,EAAA,GAAA,IAAI,CAAC,WAAW,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAA,IAAA,CAAA,IAAA,EAAG,IAAI,EAAE,KAAK,CAAC;KAClC,EAAE,EAAE,CAAC;AAEN,IAAA,MAAM,oBAAoB,GAAGA,iBAAW,CACpC,CAAC,IAAc,KAAI;;QACf,IAAI,CAAC,kBAAkB,EAAE;YACrB;;QAEJ,MAAM,WAAW,GAAiB,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,IAAI,CAAE,EAAA,EAAA,MAAM,EAAE,CAAC,IAAI,CAAC,MAAM,EAAA,CAAC;AAE7D,QAAA,MAAM,WAAW,GAAG,YAAY,CAAC,OAAO,CAAC,MAAM,CAC3C,CAAC,QAAQ,KAAK,QAAQ,CAAC,EAAE,KAAKG,sBAAY,CAC7C;QACD,CAAA,EAAA,GAAA,aAAa,KAAb,IAAA,IAAA,aAAa,KAAb,SAAA,GAAA,SAAA,GAAA,aAAa,CAAE,gBAAgB,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAA,IAAA,CAAA,aAAA,EAAG,WAAW,CAAC;QAC9C,kBAAkB,CACd,WAAW,CAAC,GAAG,CAAC,CAAC,QAAQ,KAAI;YACzB,IAAI,QAAQ,CAAC,EAAE,KAAK,WAAW,CAAC,EAAE,EAAE;AAChC,gBAAA,OAAO,QAAQ;;AAEnB,YAAA,OAAO,WAAW;SACrB,CAAC,CACL;AACL,KAAC,EACD,CAAC,kBAAkB,EAAE,aAAa,CAAC,CACtC;AAED,IAAA,MAAM,SAAS,GAAGH,iBAAW,CAAC,MAAK;QAC/B,oBAAoB,CAAC,IAAI,CAAC;AAC9B,KAAC,EAAE,CAAC,oBAAoB,CAAC,CAAC;IAE1B,MAAM,UAAU,GAAGA,iBAAW,CAC1B,CAAC,IAA4B,EAAE,SAAkB,EAAE,UAAkB,KAAI;QACrE,MAAM,WAAW,GAAG,MAAK;AACrB,YAAA,oBAAoB,CAAC,IAAI,CAAC,KAAK,CAAC;AACpC,SAAC;AAED,QAAA,QACI,KAAC,CAAA,aAAA,CAAAI,iCAAgB,IACb,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,UAAU,EACpB,QAAQ,EAAE,MAAM,oBAAoB,CAAC,IAAI,CAAC,EAC1C,aAAa,EAAE,aAAa,KAAA,IAAA,IAAb,aAAa,KAAb,SAAA,GAAA,SAAA,GAAA,aAAa,CAAE,aAAa,EAAA,CAC7C;AAEV,KAAC,EACD,CAAC,UAAU,EAAE,oBAAoB,EAAE,SAAS,EAAE,oBAAoB,EAAE,aAAa,CAAC,CACrF;AAED,IAAA,MAAM,qBAAqB,GAAGJ,iBAAW,CAAC,MAAK;;QAC3C,IAAI,CAAC,kBAAkB,EAAE;YACrB;;QAEJ,CAAA,EAAA,GAAA,aAAa,aAAb,aAAa,KAAA,SAAA,GAAA,SAAA,GAAb,aAAa,CAAE,wBAAwB,mEAAI;QAC3C,MAAM,WAAW,GAAG,gBAAgB,KAAA,IAAA,IAAhB,gBAAgB,KAAhB,SAAA,GAAA,SAAA,GAAA,gBAAgB,CAAE,MAAM,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,EAAE,KAAKG,sBAAY,CAAC;QAEhF,IAAI,WAAW,EAAE;YACb,kBAAkB,CAAC,WAAW,CAAC;;KAEtC,EAAE,CAAC,kBAAkB,EAAE,aAAa,EAAE,gBAAgB,CAAC,CAAC;IAEzD,MAAM,gBAAgB,GAAGH,iBAAW,CAChC,CAAC,EAAC,QAAQ,EAAE,QAAQ,EAAuC,KAAI;;AAC3D,QAAA,MAAM,QAAQ,GAAG,YAAY,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,EAAE,KAAKG,sBAAY,CAAC;AAEhF,QAAA,MAAM,OAAO,GAAG,QAAQ,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;QAC/C,QAAQ,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,EAAE,OAAO,CAAC;QAErC,kBAAkB,KAAA,IAAA,IAAlB,kBAAkB,KAAlB,SAAA,GAAA,SAAA,GAAA,kBAAkB,CAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC;QAExE,oBAAoB,CAAC,IAAI,CAAC;AAC1B,QAAA,CAAA,EAAA,GAAA,aAAa,KAAA,IAAA,IAAb,aAAa,KAAA,SAAA,GAAA,SAAA,GAAb,aAAa,CAAE,kBAAkB,MAAG,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAA,IAAA,CAAA,aAAA,EAAA,OAAO,EAAE,QAAQ,EAAE,QAAQ,CAAC;AACpE,KAAC,EACD,CAAC,kBAAkB,EAAE,aAAa,CAAC,CACtC;AAED,IAAA,MAAM,aAAa,GAAGE,aAAO,CAAC,MAAK;AAC/B,QAAA,OAAO,YAAY,CAAC,OAAO,CAAC,MAAM,CAC9B,CAAC,IAAI,KAAK,IAAI,CAAC,EAAE,KAAKF,sBAAY,IAAI,CAAC,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,CACzF;AACL,KAAC,EAAE,CAAC,SAAS,CAAC,CAAC;AAEf,IAAA,QACI,KAAC,CAAA,aAAA,CAAAG,UAAI,IAAC,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,GAAG,EAAC,GAAG,EAAC,SAAS,EAAC,QAAQ,EAAA;AAC3D,QAAA,KAAA,CAAA,aAAA,CAACA,UAAI,EAAA,EAAC,GAAG,EAAC,GAAG,EAAC,UAAU,EAAC,QAAQ,EAAC,cAAc,EAAC,eAAe,EAAA;YAC5D,KAAC,CAAA,aAAA,CAAAC,UAAI,IAAC,OAAO,EAAC,aAAa,EACtB,EAAA,UAAU,GAAGC,KAAI,CAAC,yBAAyB,CAAC,GAAGA,KAAI,CAAC,sBAAsB,CAAC,CACzE;AACP,YAAA,KAAA,CAAA,aAAA,CAACC,aAAO,EAAC,EAAA,OAAO,EAAED,KAAI,CAAC,yBAAyB,CAAC,EAAA;AAC7C,gBAAA,KAAA,CAAA,aAAA,CAACE,YAAM,EAAA,EAAC,QAAQ,EAAE,UAAU,EAAE,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,cAAc,EAC9D,EAAA,aAAa,GAAG,aAAa,GAAG,KAAC,CAAA,aAAA,CAAAC,UAAI,EAAC,EAAA,IAAI,EAAEC,UAAI,EAAI,CAAA,CAChD,CACH,CACP;AACP,QAAA,KAAA,CAAA,aAAA,CAACN,UAAI,EAAA,EAAC,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,EAAE,GAAG,EAAC,GAAG,EAAC,SAAS,EAAC,QAAQ,EAAA,EACpD,UAAU,KAAI,aAAa,KAAA,IAAA,IAAb,aAAa,KAAA,SAAA,GAAA,SAAA,GAAb,aAAa,CAAE,aAAa,CAAA,IACvC,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,IAAA;YACI,KAAC,CAAA,aAAA,CAAAO,UAAI,IACD,aAAa,EAAE,CAAC,CAAC,MAAM,EAAE,EAAC,QAAQ,EAAE,IAAI,EAAC,CAAC,EAC1C,UAAU,EAAE,EAAE,EACd,SAAS,EAAE,gBAAgB,EAC3B,QAAQ,EAAA,IAAA,EACR,WAAW,EAAE,KAAK,EAClB,UAAU,EAAE,KAAK,EACjB,KAAK,EAAE,aAAa,EACpB,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACxB,CAAA;AAED,YAAA,iBAAiB,KACd,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,kBAAkB,CAAC,EAAA,EAAG,iBAAiB,CAAO,CACnE,CACC,KAEN,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC,CAAC,QAAQ,KAAI;AACvC,YAAA,QACI,KAAA,CAAA,aAAA,CAACP,UAAI,EAAA,EAAC,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAC,QAAQ,EAAC,GAAG,EAAC,GAAG,EAAA;AAC3C,gBAAA,KAAA,CAAA,aAAA,CAACC,UAAI,EAAC,EAAA,SAAS,EAAE,CAAC,CAAC,UAAU,CAAC,EAAE,OAAO,EAAC,QAAQ,EAAC,KAAK,EAAC,WAAW,EAAA,EAC7D,QAAQ,CACN;gBACP,KAAC,CAAA,aAAA,CAAAM,UAAI,EACD,EAAA,WAAW,EAAE,KAAK,EAClB,UAAU,EAAE,KAAK,EACjB,KAAK,EAAE,YAAY,CAAC,QAAQ,CAAC,EAC7B,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EAAA,CACxB,CACC;SAEd,CAAC,CACL,CACE;AACN,QAAA,UAAU,KACP,KAAA,CAAA,aAAA,CAACH,YAAM,EAAA,EAAC,OAAO,EAAE,qBAAqB,EAAG,EAAAF,KAAI,CAAC,0BAA0B,CAAC,CAAU,CACtF,CACE;AAEf;;;;"}

package/build/cjs/components/AllPagesPanel/AllPagesPanel.scss.js

@@ -0,0 +1,9 @@
+'use strict';
+
+var styleInject_es = require('../../node_modules/style-inject/dist/style-inject.es.js');
+
+var css_248z = ".gn-all-pages-panel{box-sizing:border-box;height:100%;min-width:300px;padding:var(--g-spacing-4) var(--g-spacing-6)}.gn-all-pages-panel__content{flex:1;margin:0 calc(var(--g-spacing-6)*-1);overflow:auto}.gn-all-pages-panel__category{padding:0 var(--g-spacing-6)}.gn-all-pages-panel__discoverable-feature-wrapper{display:flex}.gn-all-pages-panel__item_editMode{padding:0 var(--g-spacing-6)}.gn-all-pages-panel__drag-placeholder{text-wrap:nowrap;padding-left:88px;padding-right:68px;visibility:hidden}";
+styleInject_es(css_248z);
+
+module.exports = css_248z;
+//# sourceMappingURL=AllPagesPanel.scss.js.map

package/build/cjs/components/AllPagesPanel/AllPagesPanel.scss.js.map

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

package/build/cjs/components/AllPagesPanel/constants.js

@@ -0,0 +1,18 @@
+'use strict';
+
+var icons = require('@gravity-ui/icons');
+var index = require('./i18n/index.js');
+
+const ALL_PAGES_ID = 'all-pages';
+function getAllPagesMenuItem() {
+    return {
+        id: ALL_PAGES_ID,
+        title: index('menu-item.all-pages.title'),
+        tooltipText: index('menu-item.all-pages.title'),
+        icon: icons.Ellipsis,
+    };
+}
+
+exports.ALL_PAGES_ID = ALL_PAGES_ID;
+exports.getAllPagesMenuItem = getAllPagesMenuItem;
+//# sourceMappingURL=constants.js.map

package/build/cjs/components/AllPagesPanel/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../../../src/components/AllPagesPanel/constants.ts"],"sourcesContent":["import {Ellipsis} from '@gravity-ui/icons';\n\nimport {MenuItem} from '../types';\n\nimport i18n from './i18n';\n\nexport const ALL_PAGES_ID = 'all-pages' as const;\n\nexport function getAllPagesMenuItem(): MenuItem {\n    return {\n        id: ALL_PAGES_ID,\n        title: i18n('menu-item.all-pages.title'),\n        tooltipText: i18n('menu-item.all-pages.title'),\n        icon: Ellipsis,\n    };\n}\n"],"names":["i18n","Ellipsis"],"mappings":";;;;;AAMO,MAAM,YAAY,GAAG;SAEZ,mBAAmB,GAAA;IAC/B,OAAO;AACH,QAAA,EAAE,EAAE,YAAY;AAChB,QAAA,KAAK,EAAEA,KAAI,CAAC,2BAA2B,CAAC;AACxC,QAAA,WAAW,EAAEA,KAAI,CAAC,2BAA2B,CAAC;AAC9C,QAAA,IAAI,EAAEC,cAAQ;KACjB;AACL;;;;;"}

package/build/cjs/components/AllPagesPanel/i18n/en.json.js

@@ -0,0 +1,12 @@
+'use strict';
+
+var en = {
+	"menu-item.all-pages.title": "All pages",
+	"all-panel.menu.category.allOther": "All other",
+	"all-panel.resetToDefault": "Reset to default",
+	"all-panel.title.editing": "Configuring the menu bar",
+	"all-panel.title.main": "All pages"
+};
+
+module.exports = en;
+//# sourceMappingURL=en.json.js.map

package/build/cjs/components/AllPagesPanel/i18n/en.json.js.map

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

package/build/cjs/components/AllPagesPanel/i18n/index.d.ts

@@ -1,2 +1,6 @@
-declare const _default: (key: "menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main", params?: import("@gravity-ui/i18n").Params | undefined) => string;
+declare const _default: ((key: "menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main", params?: import("@gravity-ui/i18n").Params) => string) & {
+    keysetData: {
+        "gn-AllPagesPanel": Record<"menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main", import("@gravity-ui/i18n").KeyData>;
+    };
+};
 export default _default;

package/build/cjs/components/AllPagesPanel/i18n/index.js

@@ -0,0 +1,12 @@
+'use strict';
+
+var i18n$1 = require('@gravity-ui/uikit/i18n');
+var cn = require('../../utils/cn.js');
+var en = require('./en.json.js');
+var ru = require('./ru.json.js');
+
+const COMPONENT = 'AllPagesPanel';
+var i18n = i18n$1.addComponentKeysets({ en, ru }, `${cn.NAMESPACE}${COMPONENT}`);
+
+module.exports = i18n;
+//# sourceMappingURL=index.js.map

package/build/cjs/components/AllPagesPanel/i18n/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../src/components/AllPagesPanel/i18n/index.ts"],"sourcesContent":["import {addComponentKeysets} from '@gravity-ui/uikit/i18n';\n\nimport {NAMESPACE} from '../../utils/cn';\n\nimport en from './en.json';\nimport ru from './ru.json';\n\nconst COMPONENT = 'AllPagesPanel';\nexport default addComponentKeysets({en, ru}, `${NAMESPACE}${COMPONENT}`);\n"],"names":["addComponentKeysets","NAMESPACE"],"mappings":";;;;;;;AAOA,MAAM,SAAS,GAAG,eAAe;AACjC,WAAeA,0BAAmB,CAAC,EAAC,EAAE,EAAE,EAAE,EAAC,EAAE,CAAA,EAAGC,YAAS,CAAA,EAAG,SAAS,CAAA,CAAE,CAAC;;;;"}

package/build/cjs/components/AllPagesPanel/i18n/ru.json.js

@@ -0,0 +1,12 @@
+'use strict';
+
+var ru = {
+	"menu-item.all-pages.title": "Все страницы",
+	"all-panel.menu.category.allOther": "Остальное",
+	"all-panel.resetToDefault": "Сбросить по умолчанию",
+	"all-panel.title.editing": "Настройка панели меню",
+	"all-panel.title.main": "Все страницы"
+};
+
+module.exports = ru;
+//# sourceMappingURL=ru.json.js.map

package/build/cjs/components/AllPagesPanel/i18n/ru.json.js.map

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

package/build/cjs/components/AllPagesPanel/useGroupedMenuItems.js

@@ -0,0 +1,33 @@
+'use strict';
+
+var React = require('react');
+var constants = require('./constants.js');
+var index = require('./i18n/index.js');
+
+const useGroupedMenuItems = (items) => {
+    const allPagesMenuItems = React.useMemo(() => {
+        const filteredItems = items.filter((item) => item.type !== 'divider' && item.id !== constants.ALL_PAGES_ID);
+        filteredItems.sort((a, b) => {
+            if (a.type === 'action') {
+                return 1;
+            }
+            if (b.type === 'action') {
+                return -1;
+            }
+            return 0;
+        });
+        const groupedItems = filteredItems.reduce((acc, item) => {
+            const category = item.category || index('all-panel.menu.category.allOther');
+            if (!acc[category]) {
+                acc[category] = [];
+            }
+            acc[category].push(item);
+            return acc;
+        }, {});
+        return groupedItems;
+    }, [items]);
+    return allPagesMenuItems;
+};
+
+exports.useGroupedMenuItems = useGroupedMenuItems;
+//# sourceMappingURL=useGroupedMenuItems.js.map

package/build/cjs/components/AllPagesPanel/useGroupedMenuItems.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useGroupedMenuItems.js","sources":["../../../../../src/components/AllPagesPanel/useGroupedMenuItems.ts"],"sourcesContent":["import {useMemo} from 'react';\n\nimport {MenuItem} from '../types';\n\nimport {ALL_PAGES_ID} from './constants';\nimport i18n from './i18n';\n\nexport const useGroupedMenuItems = (items: MenuItem[]) => {\n    const allPagesMenuItems = useMemo(() => {\n        const filteredItems = items.filter(\n            (item) => item.type !== 'divider' && item.id !== ALL_PAGES_ID,\n        );\n        filteredItems.sort((a, b) => {\n            if (a.type === 'action') {\n                return 1;\n            }\n            if (b.type === 'action') {\n                return -1;\n            }\n            return 0;\n        });\n        const groupedItems = filteredItems.reduce(\n            (acc, item) => {\n                const category = item.category || i18n('all-panel.menu.category.allOther');\n                if (!acc[category]) {\n                    acc[category] = [];\n                }\n                acc[category].push(item);\n                return acc;\n            },\n            {} as {[key: string]: MenuItem[]},\n        );\n        return groupedItems;\n    }, [items]);\n\n    return allPagesMenuItems;\n};\n"],"names":["useMemo","ALL_PAGES_ID","i18n"],"mappings":";;;;;;AAOa,MAAA,mBAAmB,GAAG,CAAC,KAAiB,KAAI;AACrD,IAAA,MAAM,iBAAiB,GAAGA,aAAO,CAAC,MAAK;QACnC,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,CAC9B,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,EAAE,KAAKC,sBAAY,CAChE;QACD,aAAa,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,KAAI;AACxB,YAAA,IAAI,CAAC,CAAC,IAAI,KAAK,QAAQ,EAAE;AACrB,gBAAA,OAAO,CAAC;;AAEZ,YAAA,IAAI,CAAC,CAAC,IAAI,KAAK,QAAQ,EAAE;gBACrB,OAAO,EAAE;;AAEb,YAAA,OAAO,CAAC;AACZ,SAAC,CAAC;QACF,MAAM,YAAY,GAAG,aAAa,CAAC,MAAM,CACrC,CAAC,GAAG,EAAE,IAAI,KAAI;YACV,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,IAAIC,KAAI,CAAC,kCAAkC,CAAC;AAC1E,YAAA,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE;AAChB,gBAAA,GAAG,CAAC,QAAQ,CAAC,GAAG,EAAE;;YAEtB,GAAG,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;AACxB,YAAA,OAAO,GAAG;SACb,EACD,EAAiC,CACpC;AACD,QAAA,OAAO,YAAY;AACvB,KAAC,EAAE,CAAC,KAAK,CAAC,CAAC;AAEX,IAAA,OAAO,iBAAiB;AAC5B;;;;"}

package/build/cjs/components/AllPagesPanel/useVisibleMenuItems.js

@@ -0,0 +1,29 @@
+'use strict';
+
+var React = require('react');
+var AsideHeaderContext = require('../AsideHeader/AsideHeaderContext.js');
+
+const useVisibleMenuItems = () => {
+    const { menuItems, allPagesIsAvailable } = AsideHeaderContext.useAsideHeaderInnerContext();
+    return React.useMemo(() => {
+        if (!allPagesIsAvailable) {
+            return menuItems;
+        }
+        let lastVisibleIndex = 0;
+        return menuItems.filter((item, index, items) => {
+            if (item.hidden) {
+                return false;
+            }
+            if (index > 0 &&
+                item.type === 'divider' &&
+                (items[lastVisibleIndex].type === 'divider' || items[lastVisibleIndex].hidden)) {
+                return false;
+            }
+            lastVisibleIndex = index;
+            return true;
+        });
+    }, [allPagesIsAvailable, menuItems]);
+};
+
+exports.useVisibleMenuItems = useVisibleMenuItems;
+//# sourceMappingURL=useVisibleMenuItems.js.map

package/build/cjs/components/AllPagesPanel/useVisibleMenuItems.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useVisibleMenuItems.js","sources":["../../../../../src/components/AllPagesPanel/useVisibleMenuItems.ts"],"sourcesContent":["import {useMemo} from 'react';\n\nimport {useAsideHeaderInnerContext} from '../AsideHeader/AsideHeaderContext';\nimport {MenuItem} from '../types';\n\nexport const useVisibleMenuItems = (): MenuItem[] => {\n    const {menuItems, allPagesIsAvailable} = useAsideHeaderInnerContext();\n    return useMemo(() => {\n        if (!allPagesIsAvailable) {\n            return menuItems;\n        }\n        let lastVisibleIndex = 0;\n        return menuItems.filter((item: MenuItem, index: number, items: MenuItem[]): boolean => {\n            if (item.hidden) {\n                return false;\n            }\n\n            if (\n                index > 0 &&\n                item.type === 'divider' &&\n                (items[lastVisibleIndex].type === 'divider' || items[lastVisibleIndex].hidden)\n            ) {\n                return false;\n            }\n            lastVisibleIndex = index;\n            return true;\n        });\n    }, [allPagesIsAvailable, menuItems]);\n};\n"],"names":["useAsideHeaderInnerContext","useMemo"],"mappings":";;;;;AAKO,MAAM,mBAAmB,GAAG,MAAiB;IAChD,MAAM,EAAC,SAAS,EAAE,mBAAmB,EAAC,GAAGA,6CAA0B,EAAE;IACrE,OAAOC,aAAO,CAAC,MAAK;QAChB,IAAI,CAAC,mBAAmB,EAAE;AACtB,YAAA,OAAO,SAAS;;QAEpB,IAAI,gBAAgB,GAAG,CAAC;QACxB,OAAO,SAAS,CAAC,MAAM,CAAC,CAAC,IAAc,EAAE,KAAa,EAAE,KAAiB,KAAa;AAClF,YAAA,IAAI,IAAI,CAAC,MAAM,EAAE;AACb,gBAAA,OAAO,KAAK;;YAGhB,IACI,KAAK,GAAG,CAAC;gBACT,IAAI,CAAC,IAAI,KAAK,SAAS;AACvB,iBAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,IAAI,KAAK,SAAS,IAAI,KAAK,CAAC,gBAAgB,CAAC,CAAC,MAAM,CAAC,EAChF;AACE,gBAAA,OAAO,KAAK;;YAEhB,gBAAgB,GAAG,KAAK;AACxB,YAAA,OAAO,IAAI;AACf,SAAC,CAAC;AACN,KAAC,EAAE,CAAC,mBAAmB,EAAE,SAAS,CAAC,CAAC;AACxC;;;;"}

package/build/cjs/components/AsideHeader/AsideHeader.js

@@ -0,0 +1,17 @@
+'use strict';
+
+var tslib_es6 = require('../../node_modules/tslib/tslib.es6.js');
+var React = require('react');
+var PageLayout = require('./components/PageLayout/PageLayout.js');
+var PageLayoutAside = require('./components/PageLayout/PageLayoutAside.js');
+
+const AsideHeader = React.forwardRef((_a, ref) => {
+    var { compact, className, topAlert } = _a, props = tslib_es6.__rest(_a, ["compact", "className", "topAlert"]);
+    return (React.createElement(PageLayout.PageLayout, { compact: compact, className: className, topAlert: topAlert },
+        React.createElement(PageLayoutAside.PageLayoutAside, Object.assign({ ref: ref }, props)),
+        React.createElement(PageLayout.PageLayout.Content, { renderContent: props.renderContent })));
+});
+AsideHeader.displayName = 'AsideHeader';
+
+exports.AsideHeader = AsideHeader;
+//# sourceMappingURL=AsideHeader.js.map

package/build/cjs/components/AsideHeader/AsideHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AsideHeader.js","sources":["../../../../../src/components/AsideHeader/AsideHeader.tsx"],"sourcesContent":["import React from 'react';\n\nimport {PageLayout} from './components/PageLayout/PageLayout';\nimport {PageLayoutAside} from './components/PageLayout/PageLayoutAside';\nimport {AsideHeaderProps} from './types';\n\nexport const AsideHeader = React.forwardRef<HTMLDivElement, AsideHeaderProps>(\n    ({compact, className, topAlert, ...props}, ref) => {\n        return (\n            <PageLayout compact={compact} className={className} topAlert={topAlert}>\n                <PageLayoutAside ref={ref} {...props} />\n                <PageLayout.Content renderContent={props.renderContent} />\n            </PageLayout>\n        );\n    },\n);\n\nAsideHeader.displayName = 'AsideHeader';\n"],"names":["__rest","PageLayout","PageLayoutAside"],"mappings":";;;;;;;AAMO,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CACvC,CAAC,EAAwC,EAAE,GAAG,KAAI;QAAjD,EAAC,OAAO,EAAE,SAAS,EAAE,QAAQ,OAAW,EAAN,KAAK,GAAvCA,gBAAA,CAAA,EAAA,EAAA,CAAA,SAAA,EAAA,WAAA,EAAA,UAAA,CAAwC,CAAD;AACpC,IAAA,QACI,KAAA,CAAA,aAAA,CAACC,qBAAU,EAAA,EAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAA;AAClE,QAAA,KAAA,CAAA,aAAA,CAACC,+BAAe,EAAC,MAAA,CAAA,MAAA,CAAA,EAAA,GAAG,EAAE,GAAG,EAAA,EAAM,KAAK,CAAI,CAAA;AACxC,QAAA,KAAA,CAAA,aAAA,CAACD,qBAAU,CAAC,OAAO,EAAA,EAAC,aAAa,EAAE,KAAK,CAAC,aAAa,EAAA,CAAI,CACjD;AAErB,CAAC;AAGL,WAAW,CAAC,WAAW,GAAG,aAAa;;;;"}

package/build/cjs/components/AsideHeader/AsideHeader.scss.js

@@ -0,0 +1,9 @@
+'use strict';
+
+var styleInject_es = require('../../node_modules/style-inject/dist/style-inject.es.js');
+
+var css_248z = ".g-root{--gn-aside-top-panel-height:0px}.g-root_theme_light{--gn-ah-background-color:var(--g-color-private-black-50-solid);--gn-ah-decoration-background-color:var(--g-color-private-yellow-200);--gn-ah-selected-item-background-color:var(--g-color-private-orange-200);--gn-ah-hovered-item-background-color:var(--g-color-private-black-50)}.g-root_theme_light-hc{--gn-ah-background-color:var(--g-color-private-black-50-solid);--gn-ah-decoration-background-color:var(--g-color-private-yellow-300);--gn-ah-selected-item-background-color:var(--g-color-private-orange-300);--gn-ah-hovered-item-background-color:var(--g-color-private-black-150)}.g-root_theme_dark{--gn-ah-background-color:#110e11;--gn-ah-decoration-background-color:var(--g-color-private-yellow-150);--gn-ah-selected-item-background-color:var(--g-color-private-orange-200);--gn-ah-hovered-item-background-color:var(--g-color-private-white-150)}.g-root_theme_dark-hc{--gn-ah-background-color:#050505;--gn-ah-decoration-background-color:var(--g-color-private-yellow-250);--gn-ah-selected-item-background-color:var(--g-color-private-orange-250);--gn-ah-hovered-item-background-color:var(--g-color-private-white-250)}.gn-aside-header{--gn-aside-header-min-width:56px;--_--item-icon-background-size:38px;--_--background-color:var(--gn-ah-background-color);--_--decoration-collapsed-background-color:var(--gn-ah-decoration-background-color);--_--decoration-expanded-background-color:var(--gn-ah-decoration-background-color);--_--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%}.gn-aside-header__aside{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)}.gn-aside-header__aside: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}.gn-aside-header__aside-popup-anchor{inset:0;position:absolute;z-index:1}.gn-aside-header__aside-content{--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}.gn-aside-header__aside-content>.gn-aside-header-logo{margin:8px 0}.gn-aside-header__aside-content_with-decoration{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))}.gn-aside-header__aside-custom-background{bottom:0;display:flex;position:absolute;top:0;width:var(--gn-aside-header-size);z-index:-1}.gn-aside-header_compact .gn-aside-header__aside{background-color:var(--gn-aside-header-collapsed-background-color,var(--gn-aside-header-background-color,var(--_--background-color)))}.gn-aside-header_compact .gn-aside-header__aside-content{background:transparent}.gn-aside-header__header{--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}.gn-aside-header__header .gn-aside-header__header-divider{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}.gn-aside-header__header_with-decoration: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}.gn-aside-header__header: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}.gn-aside-header_compact .gn-aside-header__header:before,.gn-aside-header_compact .gn-aside-header__header_with-decoration .gn-aside-header__header-divider{display:block}.gn-aside-header_compact .gn-aside-header__header_with-decoration:after{display:none}.gn-aside-header__logo-button .gn-aside-header__logo-icon-place{height:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));width:var(--gn-aside-header-min-width)}.gn-aside-header__menu-items{flex-grow:1}.gn-aside-header__footer{display:flex;flex-direction:column;flex-shrink:0;margin:8px 0;width:100%}.gn-aside-header__panels{inset:var(--gn-top-alert-height,0) 0 0;max-height:calc(100vh - var(--gn-top-alert-height, 0));overflow:auto;position:fixed;z-index:var(--gn-aside-header-panel-z-index,98)}.gn-aside-header__panel{height:100%}.gn-aside-header__pane-container{display:flex;flex-direction:row;outline:none;overflow:visible;user-select:text}.gn-aside-header__top-alert{background:var(--g-color-base-background);position:fixed;top:0;width:100%;z-index:var(--gn-aside-header-pane-top-z-index,98)}.gn-aside-header__content{margin-top:var(--gn-top-alert-height,0);overflow-x:auto;width:calc(100% - var(--gn-aside-header-size));z-index:var(--gn-aside-header-content-z-index,95)}";
+styleInject_es(css_248z);
+
+module.exports = css_248z;
+//# sourceMappingURL=AsideHeader.scss.js.map

package/build/cjs/components/AsideHeader/AsideHeader.scss.js.map

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

package/build/cjs/components/AsideHeader/AsideHeaderContext.d.ts

@@ -5,7 +5,7 @@ export interface AsideHeaderInnerContextType extends AsideHeaderInnerProps {
     menuItems: MenuItem[];
     defaultMenuItems?: MenuItem[];
     allPagesIsAvailable: boolean;
-    onItemClick: (item: MenuItem, collapsed: boolean, event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    onItemClick: (item: MenuItem, collapsed: boolean, event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
 }
 export declare const AsideHeaderInnerContext: React.Context<AsideHeaderInnerContextType | undefined>;
 export declare const AsideHeaderInnerContextProvider: React.Provider<AsideHeaderInnerContextType | undefined>;

package/build/cjs/{AsideHeaderContext.js → components/AsideHeader/AsideHeaderContext.js}

@@ -1,32 +1,26 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var React = require('react');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
-const AsideHeaderInnerContext = React__default["default"].createContext(undefined);
+const AsideHeaderInnerContext = React.createContext(undefined);
 AsideHeaderInnerContext.displayName = 'AsideHeaderInnerContext';
 const AsideHeaderInnerContextProvider = AsideHeaderInnerContext.Provider;
 const useAsideHeaderInnerContext = () => {
-    const contextValue = React__default["default"].useContext(AsideHeaderInnerContext);
+    const contextValue = React.useContext(AsideHeaderInnerContext);
     if (contextValue === undefined) {
         throw new Error(`AsideHeaderInnerContext is not initialized.
         Please check if you wrapped your component with AsideHeaderInnerContext.Provider`);
     }
     return contextValue;
 };
-const AsideHeaderContext = React__default["default"].createContext({
+const AsideHeaderContext = React.createContext({
     compact: false,
     size: 0,
 });
 AsideHeaderContext.displayName = 'AsideHeaderContext';
 const AsideHeaderContextProvider = AsideHeaderContext.Provider;
 const useAsideHeaderContext = () => {
-    const contextValue = React__default["default"].useContext(AsideHeaderContext);
+    const contextValue = React.useContext(AsideHeaderContext);
     if (contextValue === undefined) {
         throw new Error(`AsideHeaderContext is not initialized.
         Please check if you wrapped your component with AsideHeader

package/build/cjs/components/AsideHeader/AsideHeaderContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AsideHeaderContext.js","sources":["../../../../../src/components/AsideHeader/AsideHeaderContext.ts"],"sourcesContent":["import React from 'react';\n\nimport {MenuItem} from '../types';\n\nimport {AsideHeaderInnerProps} from './types';\n\nexport interface AsideHeaderInnerContextType extends AsideHeaderInnerProps {\n    menuItems: MenuItem[];\n    defaultMenuItems?: MenuItem[];\n    allPagesIsAvailable: boolean;\n    onItemClick: (\n        item: MenuItem,\n        collapsed: boolean,\n        event: React.MouseEvent<HTMLElement, MouseEvent>,\n    ) => void;\n}\n\nexport const AsideHeaderInnerContext = React.createContext<AsideHeaderInnerContextType | undefined>(\n    undefined,\n);\nAsideHeaderInnerContext.displayName = 'AsideHeaderInnerContext';\n\nexport const AsideHeaderInnerContextProvider = AsideHeaderInnerContext.Provider;\n\nexport const useAsideHeaderInnerContext = (): AsideHeaderInnerContextType => {\n    const contextValue = React.useContext(AsideHeaderInnerContext);\n    if (contextValue === undefined) {\n        throw new Error(`AsideHeaderInnerContext is not initialized.\n        Please check if you wrapped your component with AsideHeaderInnerContext.Provider`);\n    }\n    return contextValue;\n};\n\nexport interface AsideHeaderContextType {\n    compact: boolean;\n    size: number;\n}\n\nexport const AsideHeaderContext = React.createContext<AsideHeaderContextType | undefined>({\n    compact: false,\n    size: 0,\n});\n\nAsideHeaderContext.displayName = 'AsideHeaderContext';\n\nexport const AsideHeaderContextProvider = AsideHeaderContext.Provider;\n\nexport const useAsideHeaderContext = (): AsideHeaderContextType => {\n    const contextValue = React.useContext(AsideHeaderContext);\n    if (contextValue === undefined) {\n        throw new Error(`AsideHeaderContext is not initialized.\n        Please check if you wrapped your component with AsideHeader\n        Context.Provider`);\n    }\n    return contextValue;\n};\n"],"names":[],"mappings":";;;;AAiBa,MAAA,uBAAuB,GAAG,KAAK,CAAC,aAAa,CACtD,SAAS;AAEb,uBAAuB,CAAC,WAAW,GAAG,yBAAyB;AAElD,MAAA,+BAA+B,GAAG,uBAAuB,CAAC;AAEhE,MAAM,0BAA0B,GAAG,MAAkC;IACxE,MAAM,YAAY,GAAG,KAAK,CAAC,UAAU,CAAC,uBAAuB,CAAC;AAC9D,IAAA,IAAI,YAAY,KAAK,SAAS,EAAE;QAC5B,MAAM,IAAI,KAAK,CAAC,CAAA;AACiE,wFAAA,CAAA,CAAC;;AAEtF,IAAA,OAAO,YAAY;AACvB;AAOa,MAAA,kBAAkB,GAAG,KAAK,CAAC,aAAa,CAAqC;AACtF,IAAA,OAAO,EAAE,KAAK;AACd,IAAA,IAAI,EAAE,CAAC;AACV,CAAA;AAED,kBAAkB,CAAC,WAAW,GAAG,oBAAoB;AAExC,MAAA,0BAA0B,GAAG,kBAAkB,CAAC;AAEtD,MAAM,qBAAqB,GAAG,MAA6B;IAC9D,MAAM,YAAY,GAAG,KAAK,CAAC,UAAU,CAAC,kBAAkB,CAAC;AACzD,IAAA,IAAI,YAAY,KAAK,SAAS,EAAE;QAC5B,MAAM,IAAI,KAAK,CAAC,CAAA;;AAEC,wBAAA,CAAA,CAAC;;AAEtB,IAAA,OAAO,YAAY;AACvB;;;;;;;;;"}

package/build/cjs/components/AsideHeader/__stories__/AsideHeader.stories.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { Meta } from '@storybook/react';
+declare const _default: Meta;
+export default _default;
+export declare const Showcase: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("@storybook/csf").Args>;
+export declare const Compact: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("@storybook/csf").Args>;
+export declare const MultipleTooltip: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("@storybook/csf").Args>;
+export declare const CustomTheme: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("@storybook/csf").Args>;
+export declare const CustomBackground: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("@storybook/csf").Args>;
+export declare const AdvancedUsage: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("@storybook/csf").Args>;
+export declare const HeaderAlert: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("@storybook/csf").Args>;
+export declare const HeaderAlertCentered: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("@storybook/csf").Args>;
+export declare const Fallback: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, {
+    headerDecoration: boolean;
+    subheaderItemsCount: number;
+}>;
+/** @type {StoryFn} */
+export declare function LineClamp(): React.JSX.Element;

package/build/cjs/components/AsideHeader/__stories__/AsideHeaderShowcase.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { TopAlertProps } from '../..';
+import './AsideHeaderShowcase.scss';
+interface AsideHeaderShowcaseProps {
+    multipleTooltip?: boolean;
+    initialCompact?: boolean;
+    topAlert?: TopAlertProps;
+    customBackground?: React.ReactNode;
+    customBackgroundClassName?: string;
+    headerDecoration?: boolean;
+    hideCollapseButton?: boolean;
+}
+export declare const AsideHeaderShowcase: React.FC<AsideHeaderShowcaseProps>;
+export {};

package/build/cjs/components/AsideHeader/__stories__/getAsideHeaderWrapper.d.ts

@@ -0,0 +1,3 @@
+import React, { FC } from 'react';
+import { AsideHeaderProps } from '../types';
+export declare function getAsideHeaderWrapper(props?: AsideHeaderProps): (Story: FC) => React.JSX.Element;

package/build/cjs/components/AsideHeader/__stories__/moc.d.ts

@@ -0,0 +1,6 @@
+import { AsideHeaderContextType } from '../AsideHeaderContext';
+import { AsideHeaderProps } from '../types';
+export declare const EMPTY_CONTEXT_VALUE: AsideHeaderContextType;
+export declare const menuItemsShowcase: AsideHeaderProps['menuItems'];
+export declare const text = "\nDid you attend? He sang by grove ripe -\nThe bard of love, the singer of his mourning.\nWhen fields were silent by the early morning,\nTo sad and simple sounds of a pipe\nDid you attend?\n\nDid you behold in dark of forest leaf\nThe bard of love, the singer of his sadness?\nThe trace of tears, the smile, the utter paleness,\nThe quiet look, full of eternal grief,\nDid you behold?\n\nThen did you sigh when hearing how cries\nThe bard of love, the singer of his dole?\nWhen in the woods you saw the young man, sole,\nAnd met the look of his extinguished eyes,\nThen did you sigh?\n";
+export declare const menuItemsClamped: import("../..").MenuItem[];

package/build/cjs/components/AsideHeader/__tests__/helpersPlaywright.d.ts

@@ -1,2 +1,2 @@
 import * as DefaultAsideHeaderStories from '../__stories__/AsideHeader.stories';
-export declare const AsideHeaderStories: Omit<import("@storybook/types").StoriesWithPartialProps<import("@storybook/react/dist/types-0fc72a6d").R, typeof DefaultAsideHeaderStories>, keyof import("@storybook/types").Store_CSFExports<import("@storybook/types").Renderer, import("@storybook/types").Args>>;
+export declare const AsideHeaderStories: Omit<import("@storybook/core/types").StoriesWithPartialProps<import("@storybook/react").ReactRenderer, typeof DefaultAsideHeaderStories>, keyof import("@storybook/core/types").Store_CSFExports>;

package/build/cjs/components/AsideHeader/components/CollapseButton/CollapseButton.js

@@ -0,0 +1,25 @@
+'use strict';
+
+var React = require('react');
+var uikit = require('@gravity-ui/uikit');
+var cn = require('../../../utils/cn.js');
+var AsideHeaderContext = require('../../AsideHeaderContext.js');
+var index = require('../../i18n/index.js');
+var controlMenuButton = require('../../../../assets/icons/control-menu-button.svg.js');
+require('./CollapseButton.scss.js');
+
+const b = cn.block('collapse-button');
+const CollapseButton = ({ className }) => {
+    const { onChangeCompact, compact, expandTitle, collapseTitle } = AsideHeaderContext.useAsideHeaderInnerContext();
+    const onCollapseButtonClick = React.useCallback(() => {
+        onChangeCompact === null || onChangeCompact === undefined ? undefined : onChangeCompact(!compact);
+    }, [compact, onChangeCompact]);
+    const buttonTitle = compact
+        ? expandTitle || index('button_expand')
+        : collapseTitle || index('button_collapse');
+    return (React.createElement("button", { className: b({ compact }, className), onClick: onCollapseButtonClick, title: buttonTitle },
+        React.createElement(uikit.Icon, { data: controlMenuButton, className: b('icon'), width: "16", height: "10" })));
+};
+
+exports.CollapseButton = CollapseButton;
+//# sourceMappingURL=CollapseButton.js.map

package/build/cjs/components/AsideHeader/components/CollapseButton/CollapseButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollapseButton.js","sources":["../../../../../../../src/components/AsideHeader/components/CollapseButton/CollapseButton.tsx"],"sourcesContent":["import React, {useCallback} from 'react';\n\nimport {Icon} from '@gravity-ui/uikit';\n\nimport {block} from '../../../utils/cn';\nimport {useAsideHeaderInnerContext} from '../../AsideHeaderContext';\nimport i18n from '../../i18n';\n\nimport controlMenuButtonIcon from '../../../../../assets/icons/control-menu-button.svg';\n\nimport './CollapseButton.scss';\n\nconst b = block('collapse-button');\n\nexport interface CollapseButtonProps {\n    className?: string;\n}\n\nexport const CollapseButton = ({className}: CollapseButtonProps) => {\n    const {onChangeCompact, compact, expandTitle, collapseTitle} = useAsideHeaderInnerContext();\n\n    const onCollapseButtonClick = useCallback(() => {\n        onChangeCompact?.(!compact);\n    }, [compact, onChangeCompact]);\n\n    const buttonTitle = compact\n        ? expandTitle || i18n('button_expand')\n        : collapseTitle || i18n('button_collapse');\n    return (\n        <button\n            className={b({compact}, className)}\n            onClick={onCollapseButtonClick}\n            title={buttonTitle}\n        >\n            <Icon data={controlMenuButtonIcon} className={b('icon')} width=\"16\" height=\"10\" />\n        </button>\n    );\n};\n"],"names":["block","useAsideHeaderInnerContext","useCallback","i18n","Icon","controlMenuButtonIcon"],"mappings":";;;;;;;;;;AAYA,MAAM,CAAC,GAAGA,QAAK,CAAC,iBAAiB,CAAC;MAMrB,cAAc,GAAG,CAAC,EAAC,SAAS,EAAsB,KAAI;AAC/D,IAAA,MAAM,EAAC,eAAe,EAAE,OAAO,EAAE,WAAW,EAAE,aAAa,EAAC,GAAGC,6CAA0B,EAAE;AAE3F,IAAA,MAAM,qBAAqB,GAAGC,iBAAW,CAAC,MAAK;QAC3C,eAAe,KAAA,IAAA,IAAf,eAAe,KAAf,SAAA,GAAA,SAAA,GAAA,eAAe,CAAG,CAAC,OAAO,CAAC;AAC/B,KAAC,EAAE,CAAC,OAAO,EAAE,eAAe,CAAC,CAAC;IAE9B,MAAM,WAAW,GAAG;AAChB,UAAE,WAAW,IAAIC,KAAI,CAAC,eAAe;AACrC,UAAE,aAAa,IAAIA,KAAI,CAAC,iBAAiB,CAAC;AAC9C,IAAA,QACI,KACI,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,EAAC,OAAO,EAAC,EAAE,SAAS,CAAC,EAClC,OAAO,EAAE,qBAAqB,EAC9B,KAAK,EAAE,WAAW,EAAA;QAElB,KAAC,CAAA,aAAA,CAAAC,UAAI,IAAC,IAAI,EAAEC,iBAAqB,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAA,CAAG,CAC7E;AAEjB;;;;"}

package/build/cjs/components/AsideHeader/components/CollapseButton/CollapseButton.scss.js

@@ -0,0 +1,9 @@
+'use strict';
+
+var styleInject_es = require('../../../../node_modules/style-inject/dist/style-inject.es.js');
+
+var css_248z = ".gn-collapse-button{--_--focus-outline-color:var(--g-color-line-focus);--_--focus-outline-offset:0;align-items:center;background:none;border:none;border-top:1px solid var(--gn-aside-header-divider-horizontal-color,var(--_--horizontal-divider-line-color));box-sizing:content-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;min-height:20px;outline:none;padding:0;position:relative;width:100%}.gn-collapse-button:before{content:\"\";inset:0 2px 2px;position:absolute;z-index:-1}.gn-collapse-button:focus-visible:before{outline:var(--_--focus-outline-color) solid 2px;outline-offset:var(--_--focus-outline-offset)}.gn-collapse-button:not(.gn-collapse-button_compact) .gn-collapse-button__icon{transform:rotate(180deg)}.gn-collapse-button:hover .gn-collapse-button__icon{color:var(--g-color-text-primary)}.gn-collapse-button__icon{color:var(--g-color-text-secondary)}";
+styleInject_es(css_248z);
+
+module.exports = css_248z;
+//# sourceMappingURL=CollapseButton.scss.js.map

package/build/cjs/components/AsideHeader/components/CollapseButton/CollapseButton.scss.js.map

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

package/build/cjs/components/AsideHeader/components/FirstPanel.js

@@ -0,0 +1,42 @@
+'use strict';
+
+var React = require('react');
+var uikit = require('@gravity-ui/uikit');
+require('../../AllPagesPanel/AllPagesPanel.js');
+require('@gravity-ui/icons');
+require('../../AllPagesPanel/i18n/index.js');
+var useVisibleMenuItems = require('../../AllPagesPanel/useVisibleMenuItems.js');
+var CompositeBar = require('../../CompositeBar/CompositeBar.js');
+var AsideHeaderContext = require('../AsideHeaderContext.js');
+var index = require('../i18n/index.js');
+var utils = require('../utils.js');
+var CollapseButton = require('./CollapseButton/CollapseButton.js');
+var Header = require('./Header.js');
+var Panels = require('./Panels.js');
+
+const FirstPanel = React.forwardRef((_props, ref) => {
+    const { size, onItemClick, headerDecoration, multipleTooltip, menuMoreTitle, onMenuMoreClick, renderFooter, compact, customBackground, customBackgroundClassName, className, hideCollapseButton, qa, } = AsideHeaderContext.useAsideHeaderInnerContext();
+    const visibleMenuItems = useVisibleMenuItems.useVisibleMenuItems();
+    const asideRef = React.useRef(null);
+    React.useEffect(() => {
+        uikit.setRef(ref, asideRef.current);
+    }, [ref]);
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: utils.b('aside', className), style: { width: size }, "data-qa": qa },
+            React.createElement("div", { className: utils.b('aside-popup-anchor'), ref: asideRef }),
+            customBackground && (React.createElement("div", { className: utils.b('aside-custom-background', customBackgroundClassName) }, customBackground)),
+            React.createElement("div", { className: utils.b('aside-content', { ['with-decoration']: headerDecoration }) },
+                React.createElement(Header.Header, null),
+                (visibleMenuItems === null || visibleMenuItems === undefined ? undefined : visibleMenuItems.length) ? (React.createElement(CompositeBar.CompositeBar, { type: "menu", items: visibleMenuItems, menuMoreTitle: menuMoreTitle !== null && menuMoreTitle !== undefined ? menuMoreTitle : index('label_more'), onItemClick: onItemClick, onMoreClick: onMenuMoreClick, multipleTooltip: multipleTooltip })) : (React.createElement("div", { className: utils.b('menu-items') })),
+                React.createElement("div", { className: utils.b('footer') }, renderFooter === null || renderFooter === undefined ? undefined : renderFooter({
+                    size,
+                    compact: Boolean(compact),
+                    asideRef,
+                })),
+                !hideCollapseButton && React.createElement(CollapseButton.CollapseButton, null))),
+        React.createElement(Panels.Panels, null)));
+});
+FirstPanel.displayName = 'FirstPanel';
+
+exports.FirstPanel = FirstPanel;
+//# sourceMappingURL=FirstPanel.js.map

package/build/cjs/components/AsideHeader/components/FirstPanel.js.map

@@ -0,0 +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 {useVisibleMenuItems} from '../../AllPagesPanel';\nimport {CompositeBar} from '../../CompositeBar/CompositeBar';\nimport {useAsideHeaderInnerContext} from '../AsideHeaderContext';\nimport i18n from '../i18n';\nimport {b} from '../utils';\n\nimport {CollapseButton} from './CollapseButton/CollapseButton';\nimport {Header} from './Header';\nimport {Panels} from './Panels';\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                            type=\"menu\"\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":["useAsideHeaderInnerContext","useVisibleMenuItems","useRef","setRef","b","Header","CompositeBar","i18n","CollapseButton","Panels"],"mappings":";;;;;;;;;;;;;;;;AAcO,MAAM,UAAU,GAAG,KAAK,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,GAAGA,6CAA0B,EAAE;AAChC,IAAA,MAAM,gBAAgB,GAAGC,uCAAmB,EAAE;AAE9C,IAAA,MAAM,QAAQ,GAAGC,YAAM,CAAiB,IAAI,CAAC;AAE7C,IAAA,KAAK,CAAC,SAAS,CAAC,MAAK;AACjB,QAAAC,YAAM,CAAiB,GAAG,EAAE,QAAQ,CAAC,OAAO,CAAC;AACjD,KAAC,EAAE,CAAC,GAAG,CAAC,CAAC;AAET,IAAA,QACI,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,QAAQ,EAAA,IAAA;AACX,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEC,OAAC,CAAC,OAAO,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,EAAC,KAAK,EAAE,IAAI,EAAC,aAAW,EAAE,EAAA;YACpE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEA,OAAC,CAAC,oBAAoB,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAI,CAAA;AACzD,YAAA,gBAAgB,KACb,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEA,OAAC,CAAC,yBAAyB,EAAE,yBAAyB,CAAC,EAClE,EAAA,gBAAgB,CACf,CACT;AAED,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEA,OAAC,CAAC,eAAe,EAAE,EAAC,CAAC,iBAAiB,GAAG,gBAAgB,EAAC,CAAC,EAAA;AACvE,gBAAA,KAAA,CAAA,aAAA,CAACC,aAAM,EAAG,IAAA,CAAA;AACT,gBAAA,CAAA,gBAAgB,KAAA,IAAA,IAAhB,gBAAgB,KAAA,SAAA,GAAA,SAAA,GAAhB,gBAAgB,CAAE,MAAM,KACrB,KAAA,CAAA,aAAA,CAACC,yBAAY,EAAA,EACT,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,gBAAgB,EACvB,aAAa,EAAE,aAAa,KAAA,IAAA,IAAb,aAAa,KAAA,SAAA,GAAb,aAAa,GAAIC,KAAI,CAAC,YAAY,CAAC,EAClD,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,eAAe,EAC5B,eAAe,EAAE,eAAe,EAClC,CAAA,KAEF,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEH,OAAC,CAAC,YAAY,CAAC,EAAA,CAAI,CACtC;AACD,gBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEA,OAAC,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,IAAI,KAAA,CAAA,aAAA,CAACI,6BAAc,EAAA,IAAA,CAAG,CACxC,CACJ;AACN,QAAA,KAAA,CAAA,aAAA,CAACC,aAAM,EAAA,IAAA,CAAG,CACG;AAEzB,CAAC;AAED,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}