npm - @gravity-ui/navigation - Versions diffs - 6.0.0-beta.0 → 6.0.0-beta.2 - Mend

@gravity-ui/navigation 6.0.0-beta.0 → 6.0.0-beta.2

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 (113) hide show

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

@@ -1,6 +1,6 @@
 import { Ellipsis } from '@gravity-ui/icons';
 import { ITEM_HEIGHT, POPUP_REGULAR_ITEM_HEIGHT } from '../../../constants.js';
-import { COLLAPSE_ITEM_ID } from './constants.js';
+import { COLLAPSE_ITEM_ID, COMPOSITE_BAR_GROUP_HEADER_ID_PREFIX } from './constants.js';
 function getItemHeight(compositeItem) {
     switch (compositeItem.type) {
@@ -61,47 +61,128 @@ function getMoreButtonItem(menuMoreTitle) {
         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: [] };
+function makeGroupHeaderAsideItem(group) {
+    return {
+        id: `${COMPOSITE_BAR_GROUP_HEADER_ID_PREFIX}${group.id}`,
+        title: group.title,
+        icon: group.icon,
+        // Do not set `current` from children: only nested items should show selection;
+        // otherwise the group header and root List row highlight the whole group block.
+    };
+}
+function makeOverflowGroupAsideItem(group, children) {
+    return {
+        id: `__gn-composite-bar__group-overflow__${group.id}`,
+        title: group.title,
+        icon: group.icon,
+        compositeBarMenuPopupItems: children,
+        compositeBarMenuPopupTitle: group.popupTitle,
+    };
+}
+function getCompositeBarRowLayoutHeight(row) {
+    if (row.kind === 'item') {
+        return getItemHeight(row.item);
+    }
+    return getItemHeight(makeGroupHeaderAsideItem(row.group));
+}
+/**
+ * Moves rows whose item has `afterMoreButton` to the end (parity with scroll vs collapse DOM order).
+ *
+ * @param rows Composite bar rows before ordering.
+ * @returns Rows with `afterMoreButton` item rows last, or the same array reference when none.
+ */
+function getReorderedCompositeBarRows(rows) {
+    const afterMoreRows = rows.filter((r) => r.kind === 'item' && r.item.afterMoreButton);
+    if (afterMoreRows.length === 0) {
+        return rows;
+    }
+    const regularRows = rows.filter((r) => !(r.kind === 'item' && r.item.afterMoreButton));
+    return [...regularRows, ...afterMoreRows];
+}
+function compositeBarRowsToFlatForMinHeight(rows) {
+    const out = [];
+    for (const row of rows) {
+        if (row.kind === 'item') {
+            out.push(row.item);
+        }
+        else {
+            out.push(makeGroupHeaderAsideItem(row.group));
+        }
+    }
+    return out;
+}
+function getCompositeBarRowsMinHeight(rows) {
+    return getItemsMinHeight(compositeBarRowsToFlatForMinHeight(rows));
+}
+function getSelectedCompositeBarRowIndex(rows) {
+    const index = rows.findIndex((row) => {
+        if (row.kind === 'item') {
+            return Boolean(row.item.current);
+        }
+        // Group rows embed their own List; selection is on nested items, not this root row.
+        return false;
+    });
+    return index === -1 ? undefined : index;
+}
+function getAutosizeCompositeBarRows(rows, height, collapseItem) {
+    const ordered = getReorderedCompositeBarRows(rows);
+    const afterMoreRows = ordered.filter((r) => r.kind === 'item' && r.item.afterMoreButton);
+    const regularRows = ordered.filter((r) => !(r.kind === 'item' && r.item.afterMoreButton));
+    const listRows = [...regularRows, ...afterMoreRows];
+    const allRowsHeight = listRows.reduce((sum, row) => sum + getCompositeBarRowLayoutHeight(row), 0);
+    if (allRowsHeight <= height) {
+        return { listRows, collapseItems: [] };
     }
     const collapseItemHeight = getItemHeight(collapseItem);
-    listItems.splice(regularItems.length, 0, collapseItem);
+    listRows.splice(regularRows.length, 0, { kind: 'item', item: collapseItem });
     const collapseItems = [];
-    let listHeight = allItemsHeight + collapseItemHeight;
-    let index = listItems.length;
+    let listHeight = allRowsHeight + collapseItemHeight;
+    let index = listRows.length;
     while (listHeight > height) {
         if (index === 0) {
             break;
         }
         index--;
-        const compositeItem = listItems[index];
-        if (compositeItem.pinned ||
-            compositeItem.id === COLLAPSE_ITEM_ID ||
-            compositeItem.afterMoreButton) {
-            continue;
+        const row = listRows[index];
+        if (row.kind === 'item') {
+            const compositeItem = row.item;
+            if (compositeItem.pinned ||
+                compositeItem.id === COLLAPSE_ITEM_ID ||
+                compositeItem.afterMoreButton) {
+                continue;
+            }
+            if (compositeItem.type === 'divider') {
+                const nextRow = listRows[index + 1];
+                if (index + 1 < listRows.length &&
+                    (nextRow === null || nextRow === undefined ? undefined : nextRow.kind) === 'item' &&
+                    nextRow.item.type === 'divider') {
+                    listHeight -= getItemHeight(compositeItem);
+                    listRows.splice(index, 1);
+                }
+                continue;
+            }
+            listHeight -= getItemHeight(compositeItem);
+            collapseItems.unshift(...listRows
+                .splice(index, 1)
+                .map((r) => r.item));
         }
-        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);
+        else {
+            listHeight -= getCompositeBarRowLayoutHeight(row);
+            const [removed] = listRows.splice(index, 1);
+            if ((removed === null || removed === undefined ? undefined : removed.kind) === 'group') {
+                collapseItems.unshift(makeOverflowGroupAsideItem(removed.group, removed.items));
             }
-            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);
+    const at = listRows[index];
+    const prev = listRows[index - 1];
+    if ((at === null || at === undefined ? undefined : at.kind) === 'item' &&
+        at.item.type === 'divider' &&
+        (index === 0 || ((prev === null || prev === undefined ? undefined : prev.kind) === 'item' && prev.item.type === 'divider'))) {
+        listRows.splice(index, 1);
     }
-    return { listItems, collapseItems };
+    return { listRows, collapseItems };
 }
-export { getAutosizeListItems, getItemHeight, getItemsHeight, getItemsMinHeight, getMoreButtonItem, getPopupItemHeight, getPopupItemsHeight, getSelectedItemIndex };
+export { getAutosizeCompositeBarRows, getCompositeBarRowsMinHeight, getItemHeight, getItemsHeight, getMoreButtonItem, getPopupItemHeight, getPopupItemsHeight, getReorderedCompositeBarRows, getSelectedCompositeBarRowIndex, getSelectedItemIndex, makeGroupHeaderAsideItem };
 //# 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 {Ellipsis} from '@gravity-ui/icons';\n\nimport {ITEM_HEIGHT, POPUP_REGULAR_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 getPopupItemHeight(compositeItem: AsideHeaderItem) {\n switch (compositeItem.type) {\n case 'action':\n return 50;\n case 'divider':\n return 15;\n\n default:\n return POPUP_REGULAR_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 getPopupItemsHeight<T extends AsideHeaderItem>(items: T[]) {\n return items.reduce((sum, item) => sum + getPopupItemHeight(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,kBAAkB,CAAC,aAA8B,EAAA;AAC7D,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,yBAAyB;;AAE5C;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,mBAAmB,CAA4B,KAAU,EAAA;IACrE,OAAO,KAAK,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,IAAI,KAAK,GAAG,GAAG,kBAAkB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzE;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;;;;"}
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, POPUP_REGULAR_ITEM_HEIGHT} from '../../../constants';\nimport {MenuGroup} from '../../../types';\nimport {AsideHeaderItem} from '../../types';\n\nimport {COLLAPSE_ITEM_ID, COMPOSITE_BAR_GROUP_HEADER_ID_PREFIX} from './constants';\nimport type {CompositeBarRow} from './grouping';\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 getPopupItemHeight(compositeItem: AsideHeaderItem) {\n switch (compositeItem.type) {\n case 'action':\n return 50;\n case 'divider':\n return 15;\n\n default:\n return POPUP_REGULAR_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 getPopupItemsHeight<T extends AsideHeaderItem>(items: T[]) {\n return items.reduce((sum, item) => sum + getPopupItemHeight(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\nfunction 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 makeGroupHeaderAsideItem(group: MenuGroup): AsideHeaderItem {\n return {\n id: `${COMPOSITE_BAR_GROUP_HEADER_ID_PREFIX}${group.id}`,\n title: group.title,\n icon: group.icon,\n // Do not set `current` from children: only nested items should show selection;\n // otherwise the group header and root List row highlight the whole group block.\n };\n}\n\nfunction makeOverflowGroupAsideItem(\n group: MenuGroup,\n children: AsideHeaderItem[],\n): AsideHeaderItem {\n return {\n id: `__gn-composite-bar__group-overflow__${group.id}`,\n title: group.title,\n icon: group.icon,\n compositeBarMenuPopupItems: children,\n compositeBarMenuPopupTitle: group.popupTitle,\n };\n}\n\nfunction getCompositeBarRowLayoutHeight(row: CompositeBarRow): number {\n if (row.kind === 'item') {\n return getItemHeight(row.item);\n }\n return getItemHeight(makeGroupHeaderAsideItem(row.group));\n}\n\n/*\n Moves rows whose item has `afterMoreButton` to the end (parity with scroll vs collapse DOM order).\n \n @param rows Composite bar rows before ordering.\n * @returns Rows with `afterMoreButton` item rows last, or the same array reference when none.\n */\nexport function getReorderedCompositeBarRows(rows: CompositeBarRow[]): CompositeBarRow[] {\n const afterMoreRows = rows.filter((r) => r.kind === 'item' && r.item.afterMoreButton);\n\n if (afterMoreRows.length === 0) {\n return rows;\n }\n\n const regularRows = rows.filter((r) => !(r.kind === 'item' && r.item.afterMoreButton));\n\n return [...regularRows, ...afterMoreRows];\n}\n\nfunction compositeBarRowsToFlatForMinHeight(rows: CompositeBarRow[]): AsideHeaderItem[] {\n const out: AsideHeaderItem[] = [];\n for (const row of rows) {\n if (row.kind === 'item') {\n out.push(row.item);\n } else {\n out.push(makeGroupHeaderAsideItem(row.group));\n }\n }\n return out;\n}\n\nexport function getCompositeBarRowsMinHeight(rows: CompositeBarRow[]): number {\n return getItemsMinHeight(compositeBarRowsToFlatForMinHeight(rows));\n}\n\nexport function getSelectedCompositeBarRowIndex(rows: CompositeBarRow[]): number \| undefined {\n const index = rows.findIndex((row) => {\n if (row.kind === 'item') {\n return Boolean(row.item.current);\n }\n // Group rows embed their own List; selection is on nested items, not this root row.\n return false;\n });\n return index === -1 ? undefined : index;\n}\n\nexport function getAutosizeCompositeBarRows(\n rows: CompositeBarRow[],\n height: number,\n collapseItem: AsideHeaderItem,\n): {\n listRows: CompositeBarRow[];\n collapseItems: AsideHeaderItem[];\n} {\n const ordered = getReorderedCompositeBarRows(rows);\n const afterMoreRows = ordered.filter((r) => r.kind === 'item' && r.item.afterMoreButton);\n const regularRows = ordered.filter((r) => !(r.kind === 'item' && r.item.afterMoreButton));\n const listRows: CompositeBarRow[] = [...regularRows, ...afterMoreRows];\n\n const allRowsHeight = listRows.reduce(\n (sum, row) => sum + getCompositeBarRowLayoutHeight(row),\n 0,\n );\n if (allRowsHeight <= height) {\n return {listRows, collapseItems: []};\n }\n\n const collapseItemHeight = getItemHeight(collapseItem);\n\n listRows.splice(regularRows.length, 0, {kind: 'item', item: collapseItem});\n const collapseItems: AsideHeaderItem[] = [];\n\n let listHeight = allRowsHeight + collapseItemHeight;\n let index = listRows.length;\n while (listHeight > height) {\n if (index === 0) {\n break;\n }\n index--;\n\n const row = listRows[index];\n if (row.kind === 'item') {\n const compositeItem = row.item;\n if (\n compositeItem.pinned \|\|\n compositeItem.id === COLLAPSE_ITEM_ID \|\|\n compositeItem.afterMoreButton\n ) {\n continue;\n }\n if (compositeItem.type === 'divider') {\n const nextRow = listRows[index + 1];\n if (\n index + 1 < listRows.length &&\n nextRow?.kind === 'item' &&\n nextRow.item.type === 'divider'\n ) {\n listHeight -= getItemHeight(compositeItem);\n listRows.splice(index, 1);\n }\n continue;\n }\n listHeight -= getItemHeight(compositeItem);\n collapseItems.unshift(\n ...listRows\n .splice(index, 1)\n .map((r) => (r as Extract<CompositeBarRow, {kind: 'item'}>).item),\n );\n } else {\n listHeight -= getCompositeBarRowLayoutHeight(row);\n const [removed] = listRows.splice(index, 1);\n if (removed?.kind === 'group') {\n collapseItems.unshift(makeOverflowGroupAsideItem(removed.group, removed.items));\n }\n }\n }\n const at = listRows[index];\n const prev = listRows[index - 1];\n if (\n at?.kind === 'item' &&\n at.item.type === 'divider' &&\n (index === 0 \|\| (prev?.kind === 'item' && prev.item.type === 'divider'))\n ) {\n listRows.splice(index, 1);\n }\n\n return {listRows, collapseItems};\n}\n"],"names":[],"mappings":"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"}

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

@@ -5,6 +5,7 @@ import i18n from '../i18n/index.js';
 import { b } from '../utils.js';
 import './AllPagesPanel/AllPagesPanel.js';
 import '@gravity-ui/icons';
+import '../types.js';
 import './AllPagesPanel/i18n/index.js';
 import { useVisibleMenuItems } from './AllPagesPanel/useVisibleMenuItems.js';
 import { CollapseButton } from './CollapseButton/CollapseButton.js';
@@ -14,19 +15,19 @@ import { Panels } from './Panels.js';
 const MENU_ITEMS_COMPOSITE_ID = 'gravity-ui/navigation-menu-items-composite-bar';
 const FirstPanel = React__default.forwardRef((_props, ref) => {
-    const { size, onItemClick, headerDecoration, menuMoreTitle, onMenuMoreClick, renderFooter, compact, customBackground, customBackgroundClassName, className, hideCollapseButton, menuGroups, qa, } = useAsideHeaderInnerContext();
+    const { size, onItemClick, headerDecoration, menuMoreTitle, onMenuMoreClick, renderFooter, compact, customBackground, customBackgroundClassName, className, hideCollapseButton, menuGroups, menuOverflow, collapsedMenuGroupIds, defaultCollapsedMenuGroupIds, onToggleMenuGroupCollapsed, qa, } = useAsideHeaderInnerContext();
     const visibleMenuItems = useVisibleMenuItems();
     const asideRef = useRef(null);
     React__default.useEffect(() => {
         setRef(ref, asideRef.current);
     }, [ref]);
     return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement("div", { className: b('aside', className), style: { width: size }, "data-qa": qa },
+        React__default.createElement("div", { className: b('aside', { 'menu-overflow-scroll': menuOverflow === 'scroll' && !compact }, 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, { menuItemClassName: b('menu-item'), compositeId: MENU_ITEMS_COMPOSITE_ID, type: "menu", compact: compact, items: visibleMenuItems, menuGroups: menuGroups, menuMoreTitle: menuMoreTitle !== null && menuMoreTitle !== undefined ? menuMoreTitle : i18n('label_more'), onItemClick: onItemClick, onMoreClick: onMenuMoreClick })) : (React__default.createElement("div", { className: b('menu-items') })),
+                (visibleMenuItems === null || visibleMenuItems === undefined ? undefined : visibleMenuItems.length) ? (React__default.createElement(CompositeBar, { menuItemClassName: b('menu-item'), compositeId: MENU_ITEMS_COMPOSITE_ID, type: "menu", compact: compact, items: visibleMenuItems, menuGroups: menuGroups, menuMoreTitle: menuMoreTitle !== null && menuMoreTitle !== undefined ? menuMoreTitle : i18n('label_more'), onItemClick: onItemClick, onMoreClick: onMenuMoreClick, menuOverflow: menuOverflow, collapsedMenuGroupIds: collapsedMenuGroupIds, defaultCollapsedMenuGroupIds: defaultCollapsedMenuGroupIds, onToggleMenuGroupCollapsed: onToggleMenuGroupCollapsed })) : (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),

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';\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 menuMoreTitle,\n onMenuMoreClick,\n renderFooter,\n compact,\n customBackground,\n customBackgroundClassName,\n className,\n hideCollapseButton,\n menuGroups,\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 menuItemClassName={b('menu-item')}\n compositeId={MENU_ITEMS_COMPOSITE_ID}\n type=\"menu\"\n compact={compact}\n items={visibleMenuItems}\n menuGroups={menuGroups}\n menuMoreTitle={menuMoreTitle ?? i18n('label_more')}\n onItemClick={onItemClick}\n onMoreClick={onMenuMoreClick}\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,aAAa,EACb,eAAe,EACf,YAAY,EACZ,OAAO,EACP,gBAAgB,EAChB,yBAAyB,EACzB,SAAS,EACT,kBAAkB,EAClB,UAAU,EACV,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,cAAA,CAAA,aAAA,CAAC,YAAY,EAAA,~~EACT,~~iBAAiB,EAAE,CAAC,CAAC,WAAW,CAAC,EACjC,WAAW,EAAE,uBAAuB,EACpC,IAAI,EAAC,MAAM,EACX,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,gBAAgB,EACvB,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,~~aAAb~~,aAAa,~~KAAA~~,SAAA,~~GAAb~~,aAAa,GAAI,IAAI,CAAC,YAAY,CAAC,EAClD,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,eAAe,EAAA,~~CAC9B~~,KAEFA,~~cAAK~~,CAAA,aAAA,CAAA,KAAA,EAAA,~~EAAA~~,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;;;;"}
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 menuMoreTitle,\n onMenuMoreClick,\n renderFooter,\n compact,\n customBackground,\n customBackgroundClassName,\n className,\n hideCollapseButton,\n menuGroups,\n menuOverflow,\n collapsedMenuGroupIds,\n defaultCollapsedMenuGroupIds,\n onToggleMenuGroupCollapsed,\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\n className={b(\n 'aside',\n {'menu-overflow-scroll': menuOverflow === 'scroll' && !compact},\n className,\n )}\n style={{width: size}}\n data-qa={qa}\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 {visibleMenuItems?.length ? (\n <CompositeBar\n menuItemClassName={b('menu-item')}\n compositeId={MENU_ITEMS_COMPOSITE_ID}\n type=\"menu\"\n compact={compact}\n items={visibleMenuItems}\n menuGroups={menuGroups}\n menuMoreTitle={menuMoreTitle ?? i18n('label_more')}\n onItemClick={onItemClick}\n onMoreClick={onMenuMoreClick}\n menuOverflow={menuOverflow}\n collapsedMenuGroupIds={collapsedMenuGroupIds}\n defaultCollapsedMenuGroupIds={defaultCollapsedMenuGroupIds}\n onToggleMenuGroupCollapsed={onToggleMenuGroupCollapsed}\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,aAAa,EACb,eAAe,EACf,YAAY,EACZ,OAAO,EACP,gBAAgB,EAChB,yBAAyB,EACzB,SAAS,EACT,kBAAkB,EAClB,UAAU,EACV,YAAY,EACZ,qBAAqB,EACrB,4BAA4B,EAC5B,0BAA0B,EAC1B,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,EACI,SAAS,EAAE,CAAC,CACR,OAAO,EACP,EAAC,sBAAsB,EAAE,YAAY,KAAK,QAAQ,IAAI,CAAC,OAAO,EAAC,EAC/D,SAAS,CACZ,EACD,KAAK,EAAE,EAAC,KAAK,EAAE,IAAI,EAAC,EAAA,SAAA,EACX,EAAE,EAAA;YAEXA,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,KAAhB,IAAA,IAAA,gBAAgB,6BAAhB,gBAAgB,CAAE,MAAM,KACrBA,cAAA,CAAA,aAAA,CAAC,YAAY,EACT,EAAA,iBAAiB,EAAE,CAAC,CAAC,WAAW,CAAC,EACjC,WAAW,EAAE,uBAAuB,EACpC,IAAI,EAAC,MAAM,EACX,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,gBAAgB,EACvB,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,KAAA,IAAA,IAAb,aAAa,KAAb,SAAA,GAAA,aAAa,GAAI,IAAI,CAAC,YAAY,CAAC,EAClD,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,eAAe,EAC5B,YAAY,EAAE,YAAY,EAC1B,qBAAqB,EAAE,qBAAqB,EAC5C,4BAA4B,EAAE,4BAA4B,EAC1D,0BAA0B,EAAE,0BAA0B,EAAA,CACxD,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/PageLayout/AsideFallback.css CHANGED Viewed

@@ -1,2 +1,2 @@
 .AsideHeader-module__g-root___EuNRw{--gn-aside-top-panel-height:0px}
-.AsideHeader-module__gn-aside-header___Z0Sa7{--gn-aside-header-min-width:56px;--_--item-margin-inline:8px;--gn-aside-header-item-expanded-radius:8px;--_--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__menu-item___q2y31:not(:has([data-type=action])){margin-inline:var(--_--item-margin-inline)}.AsideHeader-module__gn-aside-header__menu-item___q2y31:has([data-type=regular]), .AsideHeader-module__gn-aside-header__menu-item_type_regular___XYYbc, .AsideHeader-module__gn-aside-header__root-menu-item___eNfkk[class]:hover{border-radius:var(--gn-aside-header-item-expanded-radius,8px)}.AsideHeader-module__gn-aside-header__footer___vmoTl{display:flex;flex-direction:column;flex-shrink:0;margin:var(--g-spacing-2) var(--_--item-margin-inline)}.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}
+.AsideHeader-module__gn-aside-header___Z0Sa7{--gn-aside-header-min-width:56px;--_--item-margin-inline:8px;--gn-aside-header-item-expanded-radius:8px;--_--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_menu-overflow-scroll___l-td6 .AsideHeader-module__gn-aside-header__aside-content___w5GOS{min-height:0;overflow:hidden}.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__menu-item___q2y31:not(:has([data-type=action])){margin-inline:var(--_--item-margin-inline)}.AsideHeader-module__gn-aside-header__menu-item___q2y31:has([data-type=regular]), .AsideHeader-module__gn-aside-header__menu-item_type_regular___XYYbc, .AsideHeader-module__gn-aside-header__root-menu-item___eNfkk[class]:hover{border-radius:var(--gn-aside-header-item-expanded-radius,8px)}.AsideHeader-module__gn-aside-header__footer___vmoTl{display:flex;flex-direction:column;flex-shrink:0;margin:var(--g-spacing-2) var(--_--item-margin-inline)}.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.css CHANGED Viewed

@@ -1,2 +1,2 @@
 .AsideHeader-module__g-root___EuNRw{--gn-aside-top-panel-height:0px}
-.AsideHeader-module__gn-aside-header___Z0Sa7{--gn-aside-header-min-width:56px;--_--item-margin-inline:8px;--gn-aside-header-item-expanded-radius:8px;--_--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__menu-item___q2y31:not(:has([data-type=action])){margin-inline:var(--_--item-margin-inline)}.AsideHeader-module__gn-aside-header__menu-item___q2y31:has([data-type=regular]), .AsideHeader-module__gn-aside-header__menu-item_type_regular___XYYbc, .AsideHeader-module__gn-aside-header__root-menu-item___eNfkk[class]:hover{border-radius:var(--gn-aside-header-item-expanded-radius,8px)}.AsideHeader-module__gn-aside-header__footer___vmoTl{display:flex;flex-direction:column;flex-shrink:0;margin:var(--g-spacing-2) var(--_--item-margin-inline)}.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}
+.AsideHeader-module__gn-aside-header___Z0Sa7{--gn-aside-header-min-width:56px;--_--item-margin-inline:8px;--gn-aside-header-item-expanded-radius:8px;--_--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_menu-overflow-scroll___l-td6 .AsideHeader-module__gn-aside-header__aside-content___w5GOS{min-height:0;overflow:hidden}.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__menu-item___q2y31:not(:has([data-type=action])){margin-inline:var(--_--item-margin-inline)}.AsideHeader-module__gn-aside-header__menu-item___q2y31:has([data-type=regular]), .AsideHeader-module__gn-aside-header__menu-item_type_regular___XYYbc, .AsideHeader-module__gn-aside-header__root-menu-item___eNfkk[class]:hover{border-radius:var(--gn-aside-header-item-expanded-radius,8px)}.AsideHeader-module__gn-aside-header__footer___vmoTl{display:flex;flex-direction:column;flex-shrink:0;margin:var(--g-spacing-2) var(--_--item-margin-inline)}.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/PageLayoutAside.css CHANGED Viewed

@@ -1,2 +1,2 @@
 .AsideHeader-module__g-root___EuNRw{--gn-aside-top-panel-height:0px}
-.AsideHeader-module__gn-aside-header___Z0Sa7{--gn-aside-header-min-width:56px;--_--item-margin-inline:8px;--gn-aside-header-item-expanded-radius:8px;--_--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__menu-item___q2y31:not(:has([data-type=action])){margin-inline:var(--_--item-margin-inline)}.AsideHeader-module__gn-aside-header__menu-item___q2y31:has([data-type=regular]), .AsideHeader-module__gn-aside-header__menu-item_type_regular___XYYbc, .AsideHeader-module__gn-aside-header__root-menu-item___eNfkk[class]:hover{border-radius:var(--gn-aside-header-item-expanded-radius,8px)}.AsideHeader-module__gn-aside-header__footer___vmoTl{display:flex;flex-direction:column;flex-shrink:0;margin:var(--g-spacing-2) var(--_--item-margin-inline)}.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}
+.AsideHeader-module__gn-aside-header___Z0Sa7{--gn-aside-header-min-width:56px;--_--item-margin-inline:8px;--gn-aside-header-item-expanded-radius:8px;--_--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_menu-overflow-scroll___l-td6 .AsideHeader-module__gn-aside-header__aside-content___w5GOS{min-height:0;overflow:hidden}.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__menu-item___q2y31:not(:has([data-type=action])){margin-inline:var(--_--item-margin-inline)}.AsideHeader-module__gn-aside-header__menu-item___q2y31:has([data-type=regular]), .AsideHeader-module__gn-aside-header__menu-item_type_regular___XYYbc, .AsideHeader-module__gn-aside-header__root-menu-item___eNfkk[class]:hover{border-radius:var(--gn-aside-header-item-expanded-radius,8px)}.AsideHeader-module__gn-aside-header__footer___vmoTl{display:flex;flex-direction:column;flex-shrink:0;margin:var(--g-spacing-2) var(--_--item-margin-inline)}.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/types.d.ts CHANGED Viewed

@@ -17,13 +17,32 @@ interface EditMenuProps {
     onResetSettingsToDefault?: () => void;
     enableSorting?: boolean;
     onChangeItemsOrder?: (changedItem: AsideHeaderItem, oldIndex: number, newIndex: number) => void;
+    /**
+     * Fired when visibility of a menu group is toggled from the All pages panel (pin on group header).
+     * Use with `onMenuGroupsChanged` / controlled `menuGroups`.
+     */
+    onToggleMenuGroup?: (changedGroup: MenuGroup) => void;
 }
+/**
+ * Menu overflow behavior.
+ * - `collapse` — extra items collapse under a "More" popup (default).
+ * - `scroll` — all items remain visible inside a scrollable container with a native thin scrollbar.
+ *
+ * In compact mode the menu always falls back to `collapse` regardless of this value
+ * because a scrollbar over icon-only items is awkward.
+ */
+export type AsideHeaderMenuOverflow = 'collapse' | 'scroll';
 interface AsideHeaderGeneralProps extends QAProps {
     logo?: LogoProps;
     className?: string;
     collapseTitle?: string;
     expandTitle?: string;
     menuMoreTitle?: string;
+    /**
+     * @see AsideHeaderMenuOverflow
+     * @default 'collapse'
+     */
+    menuOverflow?: AsideHeaderMenuOverflow;
     topAlert?: TopAlertProps;
     customBackground?: React.ReactNode;
     customBackgroundClassName?: string;
@@ -50,9 +69,28 @@ interface AsideHeaderDefaultProps {
     subheaderItems?: AsideHeaderItem[];
     menuItems?: AsideHeaderItem[];
     menuGroups?: MenuGroup[];
+    /**
+     * Called only from **All pages** edit mode when the user toggles visibility of a **menu group** (group header pin), updating `menuGroup.hidden`.
+     * Use with controlled `menuGroups`; not emitted for programmatic `menuGroups` changes outside All pages.
+     */
+    onMenuGroupsChanged?: (menuGroups: MenuGroup[]) => void;
     defaultMenuItems?: AsideHeaderItem[];
     onMenuItemsChanged?: (items: AsideHeaderItem[]) => void;
     headerDecoration?: boolean;
+    /**
+     * When provided, the map is the source of truth for which menu groups are collapsed
+     * in inline (`menuOverflow: 'scroll'`) layout. Keys are `MenuGroup.id`, values mean collapsed.
+     */
+    collapsedMenuGroupIds?: Record<string, boolean>;
+    /**
+     * Initial collapsed state for groups when `collapsedMenuGroupIds` is not controlled.
+     */
+    defaultCollapsedMenuGroupIds?: Record<string, boolean>;
+    /**
+     * Called when the user toggles a group in inline layout. The parent should update
+     * `collapsedMenuGroupIds` when using controlled mode.
+     */
+    onToggleMenuGroupCollapsed?: (groupId: string) => void;
 }
 export type AsideHeaderInnerProps = AsideHeaderGeneralProps & AsideHeaderDefaultProps & AsideHeaderContextType;
 export interface AsideHeaderProps extends AsideHeaderGeneralProps, LayoutProps, Partial<AsideHeaderDefaultProps> {
@@ -60,6 +98,8 @@ export interface AsideHeaderProps extends AsideHeaderGeneralProps, LayoutProps,
 export declare enum InnerPanels {
     AllPages = "all-pages"
 }
+/** Menu item id for the All pages row (same value as {@link InnerPanels.AllPages}). */
+export declare const ALL_PAGES_ID = InnerPanels.AllPages;
 export interface AsideHeaderItem extends MenuItem {
     enableTooltip?: boolean;
     onItemClick?: (item: AsideHeaderItem, collapsed: boolean, event: React.MouseEvent<HTMLElement, MouseEvent>) => void;

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

@@ -2,6 +2,8 @@ var InnerPanels;
 (function (InnerPanels) {
     InnerPanels["AllPages"] = "all-pages";
 })(InnerPanels || (InnerPanels = {}));
+/** Menu item id for the All pages row (same value as {@link InnerPanels.AllPages}). */
+const ALL_PAGES_ID = InnerPanels.AllPages;
-export { InnerPanels };
+export { ALL_PAGES_ID, InnerPanels };
 //# sourceMappingURL=types.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","sources":["../../../../../src/components/AsideHeader/types.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {DrawerProps, PopupProps, QAProps} from '@gravity-ui/uikit';\n\nimport {RenderContentType} from '../Content';\nimport {LogoProps, MenuGroup, MenuItem, OpenModalSubscriber, TopAlertProps} from '../types';\n\nimport {AsideHeaderContextType} from './AsideHeaderContext';\n\nexport interface PanelItemProps extends DrawerProps {\n id: string;\n}\n\nexport interface LayoutProps {\n compact: boolean;\n className?: string;\n topAlert?: TopAlertProps;\n}\n\ninterface EditMenuProps {\n onOpenEditMode?: () => void;\n onToggleMenuItem?: (changedItem: AsideHeaderItem) => void;\n onResetSettingsToDefault?: () => void;\n enableSorting?: boolean;\n onChangeItemsOrder?: (changedItem: AsideHeaderItem, oldIndex: number, newIndex: number) => void;\n}\n\ninterface AsideHeaderGeneralProps extends QAProps {\n logo?: LogoProps;\n className?: string;\n collapseTitle?: string;\n expandTitle?: string;\n menuMoreTitle?: string;\n topAlert?: TopAlertProps;\n customBackground?: React.ReactNode;\n customBackgroundClassName?: string;\n hideCollapseButton?: boolean;\n renderContent?: RenderContentType;\n renderFooter?: (data: {\n size: number;\n compact: boolean;\n asideRef: React.RefObject<HTMLDivElement>;\n }) => React.ReactNode;\n collapseButtonWrapper?: (\n defaultButton: React.ReactNode,\n data: {\n compact: boolean;\n onChangeCompact?: (compact: boolean) => void;\n },\n ) => React.ReactNode;\n editMenuProps?: EditMenuProps;\n onClosePanel?: () => void;\n onChangeCompact?: (compact: boolean) => void;\n onMenuMoreClick?: () => void;\n onAllPagesClick?: () => void;\n openModalSubscriber?: (subscriber: OpenModalSubscriber) => void;\n}\n\ninterface AsideHeaderDefaultProps {\n panelItems?: PanelItemProps[];\n subheaderItems?: AsideHeaderItem[];\n menuItems?: AsideHeaderItem[];\n menuGroups?: MenuGroup[];\n defaultMenuItems?: AsideHeaderItem[];\n onMenuItemsChanged?: (items: AsideHeaderItem[]) => void;\n headerDecoration?: boolean;\n}\n\nexport type AsideHeaderInnerProps = AsideHeaderGeneralProps &\n AsideHeaderDefaultProps &\n AsideHeaderContextType;\n\nexport interface AsideHeaderProps\n extends AsideHeaderGeneralProps,\n LayoutProps,\n Partial<AsideHeaderDefaultProps> {}\n\nexport enum InnerPanels {\n AllPages = 'all-pages',\n}\n\nexport interface AsideHeaderItem extends MenuItem {\n enableTooltip?: boolean;\n onItemClick?: (\n item: AsideHeaderItem,\n collapsed: boolean,\n event: React.MouseEvent<HTMLElement, MouseEvent>,\n ) => void;\n bringForward?: boolean;\n compact?: boolean;\n\n /*\n @deprecated Use itemWrapper instead for popup functionality\n /\n popupVisible?: PopupProps['open'];\n /\n Floating element anchor ref object\n \n @deprecated Use itemWrapper instead for popup functionality\n /\n popupRef?: React.RefObject<HTMLElement>;\n /\n @deprecated Use itemWrapper instead for popup functionality\n /\n popupPlacement?: PopupProps['placement'];\n /\n @deprecated Use itemWrapper instead for popup functionality\n /\n popupOffset?: PopupProps['offset'];\n /\n @deprecated Use itemWrapper instead for popup functionality\n /\n popupKeepMounted?: PopupProps['keepMounted'];\n /\n @deprecated Use itemWrapper instead for popup functionality\n /\n renderPopupContent?: () => React.ReactNode;\n /\n This callback will be called when Escape key pressed on keyboard, or click outside was made\n * This behaviour could be disabled with `disableEscapeKeyDown`\n * and `disableOutsideClick` options\n \n @deprecated Use itemWrapper instead for popup functionality\n */\n onOpenChangePopup?: PopupProps['onOpenChange'];\n}\n"],"names":[],"mappings":"~~IA6EY~~;AAAZ,CAAA,UAAY,WAAW,EAAA;AACnB,IAAA,WAAA,CAAA,UAAA,CAAA,GAAA,WAAsB;AAC1B,CAAC,EAFW,WAAW,KAAX,WAAW,GAEtB,EAAA,CAAA,CAAA;;;;"}
1	+ {"version":3,"file":"types.js","sources":["../../../../../src/components/AsideHeader/types.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {DrawerProps, PopupProps, QAProps} from '@gravity-ui/uikit';\n\nimport {RenderContentType} from '../Content';\nimport {LogoProps, MenuGroup, MenuItem, OpenModalSubscriber, TopAlertProps} from '../types';\n\nimport {AsideHeaderContextType} from './AsideHeaderContext';\n\nexport interface PanelItemProps extends DrawerProps {\n id: string;\n}\n\nexport interface LayoutProps {\n compact: boolean;\n className?: string;\n topAlert?: TopAlertProps;\n}\n\ninterface EditMenuProps {\n onOpenEditMode?: () => void;\n onToggleMenuItem?: (changedItem: AsideHeaderItem) => void;\n onResetSettingsToDefault?: () => void;\n enableSorting?: boolean;\n onChangeItemsOrder?: (changedItem: AsideHeaderItem, oldIndex: number, newIndex: number) => void;\n /*\n Fired when visibility of a menu group is toggled from the All pages panel (pin on group header).\n * Use with `onMenuGroupsChanged` / controlled `menuGroups`.\n /\n onToggleMenuGroup?: (changedGroup: MenuGroup) => void;\n}\n\n/\n Menu overflow behavior.\n * - `collapse` — extra items collapse under a \"More\" popup (default).\n * - `scroll` — all items remain visible inside a scrollable container with a native thin scrollbar.\n \n In compact mode the menu always falls back to `collapse` regardless of this value\n * because a scrollbar over icon-only items is awkward.\n /\nexport type AsideHeaderMenuOverflow = 'collapse' \| 'scroll';\n\ninterface AsideHeaderGeneralProps extends QAProps {\n logo?: LogoProps;\n className?: string;\n collapseTitle?: string;\n expandTitle?: string;\n menuMoreTitle?: string;\n /\n @see AsideHeaderMenuOverflow\n * @default 'collapse'\n /\n menuOverflow?: AsideHeaderMenuOverflow;\n topAlert?: TopAlertProps;\n customBackground?: React.ReactNode;\n customBackgroundClassName?: string;\n hideCollapseButton?: boolean;\n renderContent?: RenderContentType;\n renderFooter?: (data: {\n size: number;\n compact: boolean;\n asideRef: React.RefObject<HTMLDivElement>;\n }) => React.ReactNode;\n collapseButtonWrapper?: (\n defaultButton: React.ReactNode,\n data: {\n compact: boolean;\n onChangeCompact?: (compact: boolean) => void;\n },\n ) => React.ReactNode;\n editMenuProps?: EditMenuProps;\n onClosePanel?: () => void;\n onChangeCompact?: (compact: boolean) => void;\n onMenuMoreClick?: () => void;\n onAllPagesClick?: () => void;\n openModalSubscriber?: (subscriber: OpenModalSubscriber) => void;\n}\n\ninterface AsideHeaderDefaultProps {\n panelItems?: PanelItemProps[];\n subheaderItems?: AsideHeaderItem[];\n menuItems?: AsideHeaderItem[];\n menuGroups?: MenuGroup[];\n /\n Called only from All pages edit mode when the user toggles visibility of a menu group (group header pin), updating `menuGroup.hidden`.\n * Use with controlled `menuGroups`; not emitted for programmatic `menuGroups` changes outside All pages.\n /\n onMenuGroupsChanged?: (menuGroups: MenuGroup[]) => void;\n defaultMenuItems?: AsideHeaderItem[];\n onMenuItemsChanged?: (items: AsideHeaderItem[]) => void;\n headerDecoration?: boolean;\n /\n When provided, the map is the source of truth for which menu groups are collapsed\n * in inline (`menuOverflow: 'scroll'`) layout. Keys are `MenuGroup.id`, values mean collapsed.\n /\n collapsedMenuGroupIds?: Record<string, boolean>;\n /\n Initial collapsed state for groups when `collapsedMenuGroupIds` is not controlled.\n /\n defaultCollapsedMenuGroupIds?: Record<string, boolean>;\n /\n Called when the user toggles a group in inline layout. The parent should update\n * `collapsedMenuGroupIds` when using controlled mode.\n /\n onToggleMenuGroupCollapsed?: (groupId: string) => void;\n}\n\nexport type AsideHeaderInnerProps = AsideHeaderGeneralProps &\n AsideHeaderDefaultProps &\n AsideHeaderContextType;\n\nexport interface AsideHeaderProps\n extends AsideHeaderGeneralProps,\n LayoutProps,\n Partial<AsideHeaderDefaultProps> {}\n\nexport enum InnerPanels {\n AllPages = 'all-pages',\n}\n\n/* Menu item id for the All pages row (same value as {@link InnerPanels.AllPages}). /\nexport const ALL_PAGES_ID = InnerPanels.AllPages;\n\nexport interface AsideHeaderItem extends MenuItem {\n /\n @internal CompositeBar: group children rendered from the \"More\" overflow popover.\n /\n compositeBarMenuPopupItems?: AsideHeaderItem[];\n /\n @internal CompositeBar: optional heading in the overflow popover for a group row.\n /\n compositeBarMenuPopupTitle?: string;\n enableTooltip?: boolean;\n onItemClick?: (\n item: AsideHeaderItem,\n collapsed: boolean,\n event: React.MouseEvent<HTMLElement, MouseEvent>,\n ) => void;\n bringForward?: boolean;\n compact?: boolean;\n\n /\n @deprecated Use itemWrapper instead for popup functionality\n /\n popupVisible?: PopupProps['open'];\n /\n Floating element anchor ref object\n \n @deprecated Use itemWrapper instead for popup functionality\n /\n popupRef?: React.RefObject<HTMLElement>;\n /\n @deprecated Use itemWrapper instead for popup functionality\n /\n popupPlacement?: PopupProps['placement'];\n /\n @deprecated Use itemWrapper instead for popup functionality\n /\n popupOffset?: PopupProps['offset'];\n /\n @deprecated Use itemWrapper instead for popup functionality\n /\n popupKeepMounted?: PopupProps['keepMounted'];\n /\n @deprecated Use itemWrapper instead for popup functionality\n /\n renderPopupContent?: () => React.ReactNode;\n /\n This callback will be called when Escape key pressed on keyboard, or click outside was made\n * This behaviour could be disabled with `disableEscapeKeyDown`\n * and `disableOutsideClick` options\n \n @deprecated Use itemWrapper instead for popup functionality\n */\n onOpenChangePopup?: PopupProps['onOpenChange'];\n}\n"],"names":[],"mappings":"IAoHY;AAAZ,CAAA,UAAY,WAAW,EAAA;AACnB,IAAA,WAAA,CAAA,UAAA,CAAA,GAAA,WAAsB;AAC1B,CAAC,EAFW,WAAW,KAAX,WAAW,GAEtB,EAAA,CAAA,CAAA;AAED;AACa,MAAA,YAAY,GAAG,WAAW,CAAC;;;;"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/navigation",
-  "version": "6.0.0-beta.0",
+  "version": "6.0.0-beta.2",
   "description": "Gravity UI Navigation components",
   "license": "MIT",
   "repository": {