@gravity-ui/navigation 6.0.0-beta.1 → 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 (93) hide show
  1. package/build/cjs/components/AsideHeader/AsideHeader.css +1 -1
  2. package/build/cjs/components/AsideHeader/AsideHeader.module.scss.js +1 -1
  3. package/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.js +52 -16
  4. package/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.js.map +1 -1
  5. package/build/cjs/components/AsideHeader/components/AllPagesPanel/allPagesEditDisplay.d.ts +20 -0
  6. package/build/cjs/components/AsideHeader/components/AllPagesPanel/allPagesEditDisplay.js +56 -0
  7. package/build/cjs/components/AsideHeader/components/AllPagesPanel/allPagesEditDisplay.js.map +1 -0
  8. package/build/cjs/components/AsideHeader/components/AllPagesPanel/allPagesSortable.d.ts +7 -0
  9. package/build/cjs/components/AsideHeader/components/AllPagesPanel/allPagesSortable.js +26 -0
  10. package/build/cjs/components/AsideHeader/components/AllPagesPanel/allPagesSortable.js.map +1 -0
  11. package/build/cjs/components/AsideHeader/components/AllPagesPanel/constants.d.ts +1 -1
  12. package/build/cjs/components/AsideHeader/components/AllPagesPanel/constants.js +3 -3
  13. package/build/cjs/components/AsideHeader/components/AllPagesPanel/constants.js.map +1 -1
  14. package/build/cjs/components/AsideHeader/components/AllPagesPanel/useGroupedMenuItems.d.ts +10 -1
  15. package/build/cjs/components/AsideHeader/components/AllPagesPanel/useGroupedMenuItems.js +28 -6
  16. package/build/cjs/components/AsideHeader/components/AllPagesPanel/useGroupedMenuItems.js.map +1 -1
  17. package/build/cjs/components/AsideHeader/components/CompositeBar/CompositeBar.css +1 -1
  18. package/build/cjs/components/AsideHeader/components/CompositeBar/CompositeBar.d.ts +4 -0
  19. package/build/cjs/components/AsideHeader/components/CompositeBar/CompositeBar.js +89 -30
  20. package/build/cjs/components/AsideHeader/components/CompositeBar/CompositeBar.js.map +1 -1
  21. package/build/cjs/components/AsideHeader/components/CompositeBar/CompositeBar.module.scss.js +1 -1
  22. package/build/cjs/components/AsideHeader/components/CompositeBar/Item/Item.js +14 -15
  23. package/build/cjs/components/AsideHeader/components/CompositeBar/Item/Item.js.map +1 -1
  24. package/build/cjs/components/AsideHeader/components/CompositeBar/Item/Item.types.d.ts +8 -0
  25. package/build/cjs/components/AsideHeader/components/CompositeBar/Item/ItemPopupNestContext.d.ts +2 -1
  26. package/build/cjs/components/AsideHeader/components/CompositeBar/Item/ItemPopupNestContext.js.map +1 -1
  27. package/build/cjs/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollableScrollbarSync.d.ts +2 -1
  28. package/build/cjs/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollableScrollbarSync.js +2 -1
  29. package/build/cjs/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollableScrollbarSync.js.map +1 -1
  30. package/build/cjs/components/AsideHeader/components/CompositeBar/constants.d.ts +2 -0
  31. package/build/cjs/components/AsideHeader/components/CompositeBar/constants.js +3 -0
  32. package/build/cjs/components/AsideHeader/components/CompositeBar/constants.js.map +1 -1
  33. package/build/cjs/components/AsideHeader/components/CompositeBar/grouping.d.ts +27 -8
  34. package/build/cjs/components/AsideHeader/components/CompositeBar/grouping.js +53 -24
  35. package/build/cjs/components/AsideHeader/components/CompositeBar/grouping.js.map +1 -1
  36. package/build/cjs/components/AsideHeader/components/CompositeBar/utils.d.ts +11 -10
  37. package/build/cjs/components/AsideHeader/components/CompositeBar/utils.js +114 -48
  38. package/build/cjs/components/AsideHeader/components/CompositeBar/utils.js.map +1 -1
  39. package/build/cjs/components/AsideHeader/components/FirstPanel.js +4 -3
  40. package/build/cjs/components/AsideHeader/components/FirstPanel.js.map +1 -1
  41. package/build/cjs/components/AsideHeader/components/PageLayout/AsideFallback.css +1 -1
  42. package/build/cjs/components/AsideHeader/components/PageLayout/PageLayout.css +1 -1
  43. package/build/cjs/components/AsideHeader/components/PageLayout/PageLayoutAside.css +1 -1
  44. package/build/cjs/components/AsideHeader/types.d.ts +26 -0
  45. package/build/cjs/components/AsideHeader/types.js +4 -0
  46. package/build/cjs/components/AsideHeader/types.js.map +1 -1
  47. package/build/esm/components/AsideHeader/AsideHeader.css +1 -1
  48. package/build/esm/components/AsideHeader/AsideHeader.module.scss.js +1 -1
  49. package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.js +50 -14
  50. package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.js.map +1 -1
  51. package/build/esm/components/AsideHeader/components/AllPagesPanel/allPagesEditDisplay.d.ts +20 -0
  52. package/build/esm/components/AsideHeader/components/AllPagesPanel/allPagesEditDisplay.js +50 -0
  53. package/build/esm/components/AsideHeader/components/AllPagesPanel/allPagesEditDisplay.js.map +1 -0
  54. package/build/esm/components/AsideHeader/components/AllPagesPanel/allPagesSortable.d.ts +7 -0
  55. package/build/esm/components/AsideHeader/components/AllPagesPanel/allPagesSortable.js +23 -0
  56. package/build/esm/components/AsideHeader/components/AllPagesPanel/allPagesSortable.js.map +1 -0
  57. package/build/esm/components/AsideHeader/components/AllPagesPanel/constants.d.ts +1 -1
  58. package/build/esm/components/AsideHeader/components/AllPagesPanel/constants.js +1 -1
  59. package/build/esm/components/AsideHeader/components/AllPagesPanel/constants.js.map +1 -1
  60. package/build/esm/components/AsideHeader/components/AllPagesPanel/useGroupedMenuItems.d.ts +10 -1
  61. package/build/esm/components/AsideHeader/components/AllPagesPanel/useGroupedMenuItems.js +28 -6
  62. package/build/esm/components/AsideHeader/components/AllPagesPanel/useGroupedMenuItems.js.map +1 -1
  63. package/build/esm/components/AsideHeader/components/CompositeBar/CompositeBar.css +1 -1
  64. package/build/esm/components/AsideHeader/components/CompositeBar/CompositeBar.d.ts +4 -0
  65. package/build/esm/components/AsideHeader/components/CompositeBar/CompositeBar.js +92 -33
  66. package/build/esm/components/AsideHeader/components/CompositeBar/CompositeBar.js.map +1 -1
  67. package/build/esm/components/AsideHeader/components/CompositeBar/CompositeBar.module.scss.js +1 -1
  68. package/build/esm/components/AsideHeader/components/CompositeBar/Item/Item.js +15 -16
  69. package/build/esm/components/AsideHeader/components/CompositeBar/Item/Item.js.map +1 -1
  70. package/build/esm/components/AsideHeader/components/CompositeBar/Item/Item.types.d.ts +8 -0
  71. package/build/esm/components/AsideHeader/components/CompositeBar/Item/ItemPopupNestContext.d.ts +2 -1
  72. package/build/esm/components/AsideHeader/components/CompositeBar/Item/ItemPopupNestContext.js.map +1 -1
  73. package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollableScrollbarSync.d.ts +2 -1
  74. package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollableScrollbarSync.js +2 -1
  75. package/build/esm/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollableScrollbarSync.js.map +1 -1
  76. package/build/esm/components/AsideHeader/components/CompositeBar/constants.d.ts +2 -0
  77. package/build/esm/components/AsideHeader/components/CompositeBar/constants.js +3 -1
  78. package/build/esm/components/AsideHeader/components/CompositeBar/constants.js.map +1 -1
  79. package/build/esm/components/AsideHeader/components/CompositeBar/grouping.d.ts +27 -8
  80. package/build/esm/components/AsideHeader/components/CompositeBar/grouping.js +52 -23
  81. package/build/esm/components/AsideHeader/components/CompositeBar/grouping.js.map +1 -1
  82. package/build/esm/components/AsideHeader/components/CompositeBar/utils.d.ts +11 -10
  83. package/build/esm/components/AsideHeader/components/CompositeBar/utils.js +105 -41
  84. package/build/esm/components/AsideHeader/components/CompositeBar/utils.js.map +1 -1
  85. package/build/esm/components/AsideHeader/components/FirstPanel.js +4 -3
  86. package/build/esm/components/AsideHeader/components/FirstPanel.js.map +1 -1
  87. package/build/esm/components/AsideHeader/components/PageLayout/AsideFallback.css +1 -1
  88. package/build/esm/components/AsideHeader/components/PageLayout/PageLayout.css +1 -1
  89. package/build/esm/components/AsideHeader/components/PageLayout/PageLayoutAside.css +1 -1
  90. package/build/esm/components/AsideHeader/types.d.ts +26 -0
  91. package/build/esm/components/AsideHeader/types.js +3 -1
  92. package/build/esm/components/AsideHeader/types.js.map +1 -1
  93. package/package.json +1 -1
@@ -13,7 +13,9 @@ var utils = require('./utils.js');
13
13
  var CompositeBar_module = require('./CompositeBar.module.scss.js');
14
14
 
15
15
  const b = cn.createBlock('composite-bar', CompositeBar_module.default);
16
- const CompositeBarView = ({ type, items, onItemClick, onMoreClick, collapseItems, compact, compositeId, menuItemClassName, }) => {
16
+ /** Row L-connector: vertical segment + rounded hook. viewBox matches `variables.$item-height`. */
17
+ const MENU_GROUP_NESTED_TREE_CONNECTOR_PATH = 'M8.03125 0V10.07935C8.03125 15.558375 11.5846 20 15.9678 20';
18
+ const CompositeBarView = ({ type, rows, onItemClick, onMoreClick, collapseItems, compact, compositeId, menuItemClassName, inlineGroupChildren, isGroupCollapsed, onToggleGroupCollapsed, }) => {
17
19
  const ref = React.useRef(null);
18
20
  const onMouseLeave = React.useCallback(() => {
19
21
  var _a;
@@ -22,61 +24,118 @@ const CompositeBarView = ({ type, items, onItemClick, onMoreClick, collapseItems
22
24
  }
23
25
  }, [compact]);
24
26
  const onItemClickByIndex = React.useCallback((orginalItemClick) => (item, collapsed, event) => {
25
- // Handle clicks on the "more" button (collapse item)
26
27
  if (item.id === constants.COLLAPSE_ITEM_ID && collapsed) {
27
28
  onMoreClick === null || onMoreClick === undefined ? undefined : onMoreClick();
28
29
  }
29
30
  else {
30
- onItemClick === null || onItemClick === undefined ? undefined : onItemClick(Object.assign(Object.assign({}, item), {
31
- // For collapsed popup items, preserve the item's own onItemClick
32
- // since orginalItemClick belongs to the collapse button, not the item
33
- onItemClick: collapsed ? item.onItemClick : orginalItemClick }), collapsed, event);
31
+ onItemClick === null || onItemClick === undefined ? undefined : onItemClick(Object.assign(Object.assign({}, item), { onItemClick: collapsed ? item.onItemClick : orginalItemClick }), collapsed, event);
34
32
  }
35
33
  }, [onItemClick, onMoreClick]);
36
- return (React.createElement(uikit.List, { id: compositeId, ref: ref, items: items, selectedItemIndex: type === 'menu' ? utils.getSelectedItemIndex(items) : undefined, itemHeight: utils.getItemHeight, itemsHeight: utils.getItemsHeight, itemClassName: b('root-menu-item', menuItemClassName), virtualized: false, filterable: false, sortable: false, renderItem: (item) => {
37
- let menuPopupItems;
38
- let menuPopupTitle;
39
- if (item.id === constants.COLLAPSE_ITEM_ID) {
40
- menuPopupItems = collapseItems;
34
+ const onSyntheticHeaderItemClick = React.useMemo(() => onItemClickByIndex(undefined), [onItemClickByIndex]);
35
+ const itemHeight = React.useCallback((row) => {
36
+ if (row.kind === 'item') {
37
+ return utils.getItemHeight(row.item);
38
+ }
39
+ const headerH = utils.getItemHeight(utils.makeGroupHeaderAsideItem(row.group));
40
+ if (!inlineGroupChildren || isGroupCollapsed(row.group.id)) {
41
+ return headerH;
42
+ }
43
+ return headerH + utils.getItemsHeight(row.items);
44
+ }, [inlineGroupChildren, isGroupCollapsed]);
45
+ const itemsHeight = React.useCallback((listRows) => listRows.reduce((sum, row) => sum + itemHeight(row), 0), [itemHeight]);
46
+ return (React.createElement(uikit.List, { id: compositeId, ref: ref, items: rows, selectedItemIndex: type === 'menu' ? utils.getSelectedCompositeBarRowIndex(rows) : undefined, itemHeight: itemHeight, itemsHeight: itemsHeight, itemClassName: b('root-menu-item', menuItemClassName), virtualized: false, filterable: false, sortable: false, renderItem: (row) => {
47
+ if (row.kind === 'item') {
48
+ const item = row.item;
49
+ let menuPopupItems;
50
+ let menuPopupTitle;
51
+ if (item.id === constants.COLLAPSE_ITEM_ID) {
52
+ menuPopupItems = collapseItems;
53
+ }
54
+ else {
55
+ menuPopupItems = item.compositeBarMenuPopupItems;
56
+ menuPopupTitle = item.compositeBarMenuPopupTitle;
57
+ }
58
+ return (React.createElement(Item.Item, Object.assign({}, item, { compact: compact, popupItemClassName: menuItemClassName, menuPopupItems: menuPopupItems, menuPopupTitle: menuPopupTitle, onMouseLeave: onMouseLeave, onItemClick: onItemClickByIndex(item.onItemClick) })));
41
59
  }
42
- else if (grouping.isGroupHeaderItem(item)) {
43
- menuPopupItems = item.groupChildren;
44
- menuPopupTitle = item.groupPopupTitle;
60
+ const headerItem = utils.makeGroupHeaderAsideItem(row.group);
61
+ const groupIsCollapsed = isGroupCollapsed(row.group.id);
62
+ if (!inlineGroupChildren) {
63
+ return (React.createElement(Item.Item, Object.assign({}, headerItem, { compact: compact, popupItemClassName: menuItemClassName, menuPopupItems: row.items, menuPopupTitle: row.group.popupTitle, className: b('menu-group-header'), onMouseLeave: onMouseLeave, onItemClick: onSyntheticHeaderItemClick })));
45
64
  }
46
- return (React.createElement(Item.Item, Object.assign({}, item, { compact: compact, popupItemClassName: menuItemClassName, menuPopupItems: menuPopupItems, menuPopupTitle: menuPopupTitle, onMouseLeave: onMouseLeave, onItemClick: onItemClickByIndex(item.onItemClick) })));
65
+ const selectedItemIndex = utils.getSelectedItemIndex(row.items);
66
+ return (React.createElement("div", { className: b('menu-group', {
67
+ expanded: !groupIsCollapsed,
68
+ collapsed: groupIsCollapsed,
69
+ }) },
70
+ React.createElement(Item.Item, Object.assign({}, headerItem, { compact: compact, popupItemClassName: menuItemClassName, className: b('menu-group-header'), groupHeaderExpanded: !groupIsCollapsed, onMouseLeave: onMouseLeave, onItemClick: (item, isItemCollapsed, event) => {
71
+ onToggleGroupCollapsed(row.group.id);
72
+ onSyntheticHeaderItemClick(item, isItemCollapsed, event);
73
+ } })),
74
+ !groupIsCollapsed && (React.createElement(uikit.List, { items: row.items, selectedItemIndex: selectedItemIndex, itemHeight: utils.getItemHeight, itemsHeight: utils.getItemsHeight, itemClassName: b('menu-group-nested-list-item'), virtualized: false, filterable: false, sortable: false, renderItem: (nestedItem, _isActive, groupItemIndex) => {
75
+ const spineActive = selectedItemIndex !== undefined &&
76
+ groupItemIndex < selectedItemIndex;
77
+ return (React.createElement("div", { className: b('menu-group-nested-row-inner') },
78
+ React.createElement(Item.Item, Object.assign({}, nestedItem, { className: [
79
+ nestedItem.className,
80
+ b('menu-group-nested-item'),
81
+ ]
82
+ .filter(Boolean)
83
+ .join(' '), compact: compact, menuGroupNestedTreeConnector: React.createElement("span", { className: b('menu-group-nested-connector', { 'spine-active': spineActive }), "aria-hidden": true },
84
+ React.createElement("svg", { className: b('menu-group-nested-tree-svg', {
85
+ active: selectedItemIndex ===
86
+ groupItemIndex,
87
+ }), viewBox: "0 0 16 40", xmlns: "http://www.w3.org/2000/svg" },
88
+ React.createElement("path", { d: MENU_GROUP_NESTED_TREE_CONNECTOR_PATH, fill: "none", strokeLinecap: "butt", strokeWidth: "1.3", vectorEffect: "non-scaling-stroke" }))), onMouseLeave: onMouseLeave, onItemClick: onItemClickByIndex(nestedItem.onItemClick) }))));
89
+ } }))));
47
90
  } }));
48
91
  };
49
- const CompositeBar = ({ type, items, menuGroups, menuMoreTitle, onItemClick, onMoreClick, compact, compositeId, menuItemClassName, menuOverflow = 'collapse', }) => {
50
- const groupedItems = React.useMemo(() => grouping.getGroupedItems(items, menuGroups), [items, menuGroups]);
51
- // Respect `afterMoreButton` ordering for DOM stability when items are rendered
52
- // inside a scroll container (no collapse button to anchor them against).
53
- const scrollableItems = React.useMemo(() => utils.getReorderedItems(groupedItems), [groupedItems]);
54
- if (groupedItems.length === 0) {
92
+ const CompositeBar = ({ type, className, items, menuGroups, menuMoreTitle, onItemClick, onMoreClick, compact, compositeId, menuItemClassName, menuOverflow = 'collapse', collapsedMenuGroupIds: collapsedMenuGroupIdsProp, defaultCollapsedMenuGroupIds, onToggleMenuGroupCollapsed, }) => {
93
+ const rows = React.useMemo(() => grouping.buildCompositeBarRows(items, menuGroups), [items, menuGroups]);
94
+ const isCollapsedControlled = collapsedMenuGroupIdsProp !== undefined;
95
+ const [uncontrolledCollapsed, setUncontrolledCollapsed] = React.useState(() => defaultCollapsedMenuGroupIds !== null && defaultCollapsedMenuGroupIds !== undefined ? defaultCollapsedMenuGroupIds : {});
96
+ const collapsedMap = isCollapsedControlled ? collapsedMenuGroupIdsProp : uncontrolledCollapsed;
97
+ const onToggleGroupCollapsed = React.useCallback((groupId) => {
98
+ onToggleMenuGroupCollapsed === null || onToggleMenuGroupCollapsed === undefined ? undefined : onToggleMenuGroupCollapsed(groupId);
99
+ if (!isCollapsedControlled) {
100
+ setUncontrolledCollapsed((prev) => (Object.assign(Object.assign({}, prev), { [groupId]: !prev[groupId] })));
101
+ }
102
+ }, [isCollapsedControlled, onToggleMenuGroupCollapsed]);
103
+ const isGroupCollapsed = React.useCallback((groupId) => Boolean(collapsedMap[groupId]), [collapsedMap]);
104
+ const inlineGroupChildren = !compact && menuOverflow === 'scroll' && type === 'menu' && Boolean(menuGroups === null || menuGroups === undefined ? undefined : menuGroups.length);
105
+ const scrollableRows = React.useMemo(() => utils.getReorderedCompositeBarRows(rows), [rows]);
106
+ const scrollRecalcKey = React.useMemo(() => {
107
+ var _a;
108
+ return `${items.length}:${(_a = menuGroups === null || menuGroups === undefined ? undefined : menuGroups.length) !== null && _a !== undefined ? _a : 0}:${JSON.stringify(Object.keys(collapsedMap)
109
+ .sort()
110
+ .reduce((acc, k) => {
111
+ acc[k] = Boolean(collapsedMap[k]);
112
+ return acc;
113
+ }, {}))}`;
114
+ }, [items.length, menuGroups === null || menuGroups === undefined ? undefined : menuGroups.length, collapsedMap]);
115
+ if (rows.length === 0) {
55
116
  return null;
56
117
  }
57
118
  let node;
58
119
  if (type === 'menu') {
59
- // `scroll` mode is intentionally disabled in `compact` mode — there the
60
- // classic "More" popup gives a better UX for icon-only items.
61
120
  if (menuOverflow === 'scroll' && !compact) {
62
- node = (React.createElement(ScrollableWithScrollbar.ScrollableWithScrollbar, { recalcDeps: [scrollableItems] },
63
- React.createElement(CompositeBarView, { compositeId: compositeId, type: "menu", compact: compact, items: scrollableItems, onItemClick: onItemClick, menuItemClassName: menuItemClassName })));
121
+ node = (React.createElement(ScrollableWithScrollbar.ScrollableWithScrollbar, { className: className, recalcDeps: [scrollRecalcKey] },
122
+ React.createElement(CompositeBarView, { compositeId: compositeId, type: "menu", compact: compact, rows: scrollableRows, onItemClick: onItemClick, onMoreClick: onMoreClick, menuItemClassName: menuItemClassName, inlineGroupChildren: inlineGroupChildren, isGroupCollapsed: isGroupCollapsed, onToggleGroupCollapsed: onToggleGroupCollapsed })));
64
123
  }
65
124
  else {
66
- const minHeight = utils.getItemsMinHeight(groupedItems);
125
+ const minHeight = utils.getCompositeBarRowsMinHeight(rows);
67
126
  const collapseItem = utils.getMoreButtonItem(menuMoreTitle);
68
- node = (React.createElement("div", { className: b({ autosizer: true }), style: { minHeight } }, groupedItems.length !== 0 && (React.createElement(AutoSizer, null, (size) => {
127
+ node = (React.createElement("div", { className: b({ autosizer: true }), style: { minHeight } }, rows.length !== 0 && (React.createElement(AutoSizer, null, (size) => {
69
128
  const width = Number.isNaN(size.width) ? 0 : size.width;
70
129
  const height = Number.isNaN(size.height) ? 0 : size.height;
71
- const { listItems, collapseItems } = utils.getAutosizeListItems(groupedItems, height, collapseItem);
130
+ const { listRows, collapseItems } = utils.getAutosizeCompositeBarRows(rows, height, collapseItem);
72
131
  return (React.createElement("div", { style: { width, height } },
73
- React.createElement(CompositeBarView, { compositeId: compositeId, type: "menu", compact: compact, items: listItems, onItemClick: onItemClick, onMoreClick: onMoreClick, menuItemClassName: menuItemClassName, collapseItems: collapseItems })));
132
+ React.createElement(CompositeBarView, { compositeId: compositeId, type: "menu", compact: compact, rows: listRows, onItemClick: onItemClick, onMoreClick: onMoreClick, menuItemClassName: menuItemClassName, collapseItems: collapseItems, inlineGroupChildren: false, isGroupCollapsed: isGroupCollapsed, onToggleGroupCollapsed: onToggleGroupCollapsed })));
74
133
  }))));
75
134
  }
76
135
  }
77
136
  else {
78
137
  node = (React.createElement("div", { className: b({ subheader: true }) },
79
- React.createElement(CompositeBarView, { type: "subheader", menuItemClassName: menuItemClassName, compact: compact, items: groupedItems, onItemClick: onItemClick })));
138
+ React.createElement(CompositeBarView, { type: "subheader", menuItemClassName: menuItemClassName, compact: compact, rows: rows, onItemClick: onItemClick, inlineGroupChildren: false, isGroupCollapsed: isGroupCollapsed, onToggleGroupCollapsed: onToggleGroupCollapsed })));
80
139
  }
81
140
  return node;
82
141
  };
@@ -1 +1 @@
1
- {"version":3,"file":"CompositeBar.js","sources":["../../../../../../../src/components/AsideHeader/components/CompositeBar/CompositeBar.tsx"],"sourcesContent":["import React, {FC, ReactNode, useCallback, useMemo, useRef} from 'react';\n\nimport {List} from '@gravity-ui/uikit';\nimport AutoSizer, {Size} from 'react-virtualized-auto-sizer';\n\nimport {MenuGroup} from '../../../types';\nimport {createBlock} from '../../../utils/cn';\nimport {AsideHeaderItem, AsideHeaderMenuOverflow} from '../../types';\n\nimport {Item} from './Item/Item';\nimport {ItemProps} from './Item/Item.types';\nimport {ScrollableWithScrollbar} from './ScrollableWithScrollbar';\nimport {COLLAPSE_ITEM_ID} from './constants';\nimport {getGroupedItems, isGroupHeaderItem} from './grouping';\nimport {\n getAutosizeListItems,\n getItemHeight,\n getItemsHeight,\n getItemsMinHeight,\n getMoreButtonItem,\n getReorderedItems,\n getSelectedItemIndex,\n} from './utils';\n\nimport styles from './CompositeBar.module.scss';\n\nconst b = createBlock('composite-bar', styles);\n\ntype CompositeBarProps = {\n type: 'menu' | 'subheader';\n items: AsideHeaderItem[];\n menuGroups?: MenuGroup[];\n onItemClick?: (\n item: AsideHeaderItem,\n collapsed: boolean,\n event: React.MouseEvent<HTMLElement, MouseEvent>,\n ) => void;\n menuMoreTitle?: string;\n onMoreClick?: () => void;\n compact: boolean;\n compositeId?: string;\n menuItemClassName?: string;\n /**\n * @see AsideHeaderMenuOverflow\n */\n menuOverflow?: AsideHeaderMenuOverflow;\n};\n\ntype CompositeBarViewProps = Omit<CompositeBarProps, 'menuOverflow'> & {\n collapseItems?: AsideHeaderItem[];\n};\n\nconst CompositeBarView: FC<CompositeBarViewProps> = ({\n type,\n items,\n onItemClick,\n onMoreClick,\n collapseItems,\n compact,\n compositeId,\n menuItemClassName,\n}) => {\n const ref = useRef<List<AsideHeaderItem>>(null);\n\n const onMouseLeave = useCallback(() => {\n if (compact && document.hasFocus()) {\n ref.current?.activateItem(undefined as unknown as number);\n }\n }, [compact]);\n\n const onItemClickByIndex = useCallback(\n (orginalItemClick: AsideHeaderItem['onItemClick']): ItemProps['onItemClick'] =>\n (item, collapsed, event) => {\n // Handle clicks on the \"more\" button (collapse item)\n if (item.id === COLLAPSE_ITEM_ID && collapsed) {\n onMoreClick?.();\n } else {\n onItemClick?.(\n {\n ...item,\n // For collapsed popup items, preserve the item's own onItemClick\n // since orginalItemClick belongs to the collapse button, not the item\n onItemClick: collapsed ? item.onItemClick : orginalItemClick,\n },\n collapsed,\n event,\n );\n }\n },\n [onItemClick, onMoreClick],\n );\n\n return (\n <List<AsideHeaderItem>\n id={compositeId}\n ref={ref}\n items={items}\n selectedItemIndex={type === 'menu' ? getSelectedItemIndex(items) : undefined}\n itemHeight={getItemHeight}\n itemsHeight={getItemsHeight}\n itemClassName={b('root-menu-item', menuItemClassName)}\n virtualized={false}\n filterable={false}\n sortable={false}\n renderItem={(item) => {\n let menuPopupItems: AsideHeaderItem[] | undefined;\n let menuPopupTitle: string | undefined;\n\n if (item.id === COLLAPSE_ITEM_ID) {\n menuPopupItems = collapseItems;\n } else if (isGroupHeaderItem(item)) {\n menuPopupItems = item.groupChildren;\n menuPopupTitle = item.groupPopupTitle;\n }\n\n return (\n <Item\n {...item}\n compact={compact}\n popupItemClassName={menuItemClassName}\n menuPopupItems={menuPopupItems}\n menuPopupTitle={menuPopupTitle}\n onMouseLeave={onMouseLeave}\n onItemClick={onItemClickByIndex(item.onItemClick)}\n />\n );\n }}\n />\n );\n};\n\nexport const CompositeBar: FC<CompositeBarProps> = ({\n type,\n items,\n menuGroups,\n menuMoreTitle,\n onItemClick,\n onMoreClick,\n compact,\n compositeId,\n menuItemClassName,\n menuOverflow = 'collapse',\n}) => {\n const groupedItems = useMemo(() => getGroupedItems(items, menuGroups), [items, menuGroups]);\n\n // Respect `afterMoreButton` ordering for DOM stability when items are rendered\n // inside a scroll container (no collapse button to anchor them against).\n const scrollableItems = useMemo(() => getReorderedItems(groupedItems), [groupedItems]);\n\n if (groupedItems.length === 0) {\n return null;\n }\n let node: ReactNode;\n\n if (type === 'menu') {\n // `scroll` mode is intentionally disabled in `compact` mode — there the\n // classic \"More\" popup gives a better UX for icon-only items.\n if (menuOverflow === 'scroll' && !compact) {\n node = (\n <ScrollableWithScrollbar recalcDeps={[scrollableItems]}>\n <CompositeBarView\n compositeId={compositeId}\n type=\"menu\"\n compact={compact}\n items={scrollableItems}\n onItemClick={onItemClick}\n menuItemClassName={menuItemClassName}\n />\n </ScrollableWithScrollbar>\n );\n } else {\n const minHeight = getItemsMinHeight(groupedItems);\n const collapseItem = getMoreButtonItem(menuMoreTitle);\n node = (\n <div className={b({autosizer: true})} style={{minHeight}}>\n {groupedItems.length !== 0 && (\n <AutoSizer>\n {(size: Size) => {\n const width = Number.isNaN(size.width) ? 0 : size.width;\n const height = Number.isNaN(size.height) ? 0 : size.height;\n\n const {listItems, collapseItems} = getAutosizeListItems(\n groupedItems,\n height,\n collapseItem,\n );\n return (\n <div style={{width, height}}>\n <CompositeBarView\n compositeId={compositeId}\n type=\"menu\"\n compact={compact}\n items={listItems}\n onItemClick={onItemClick}\n onMoreClick={onMoreClick}\n menuItemClassName={menuItemClassName}\n collapseItems={collapseItems}\n />\n </div>\n );\n }}\n </AutoSizer>\n )}\n </div>\n );\n }\n } else {\n node = (\n <div className={b({subheader: true})}>\n <CompositeBarView\n type=\"subheader\"\n menuItemClassName={menuItemClassName}\n compact={compact}\n items={groupedItems}\n onItemClick={onItemClick}\n />\n </div>\n );\n }\n return node;\n};\n"],"names":["createBlock","styles","useRef","useCallback","COLLAPSE_ITEM_ID","List","getSelectedItemIndex","getItemHeight","getItemsHeight","isGroupHeaderItem","Item","useMemo","getGroupedItems","getReorderedItems","ScrollableWithScrollbar","getItemsMinHeight","getMoreButtonItem","getAutosizeListItems"],"mappings":"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"}
1
+ {"version":3,"file":"CompositeBar.js","sources":["../../../../../../../src/components/AsideHeader/components/CompositeBar/CompositeBar.tsx"],"sourcesContent":["import React, {FC, ReactNode, useCallback, useMemo, useRef, useState} from 'react';\n\nimport {List} from '@gravity-ui/uikit';\nimport AutoSizer, {Size} from 'react-virtualized-auto-sizer';\n\nimport {MenuGroup} from '../../../types';\nimport {createBlock} from '../../../utils/cn';\nimport {AsideHeaderItem, AsideHeaderMenuOverflow} from '../../types';\n\nimport {Item} from './Item/Item';\nimport {ItemProps} from './Item/Item.types';\nimport {ScrollableWithScrollbar} from './ScrollableWithScrollbar';\nimport {COLLAPSE_ITEM_ID} from './constants';\nimport {buildCompositeBarRows} from './grouping';\nimport type {CompositeBarRow} from './grouping';\nimport {\n getAutosizeCompositeBarRows,\n getCompositeBarRowsMinHeight,\n getItemHeight,\n getItemsHeight,\n getMoreButtonItem,\n getReorderedCompositeBarRows,\n getSelectedCompositeBarRowIndex,\n getSelectedItemIndex,\n makeGroupHeaderAsideItem,\n} from './utils';\n\nimport styles from './CompositeBar.module.scss';\n\nconst b = createBlock('composite-bar', styles);\n\n/** Row L-connector: vertical segment + rounded hook. viewBox matches `variables.$item-height`. */\nconst MENU_GROUP_NESTED_TREE_CONNECTOR_PATH =\n 'M8.03125 0V10.07935C8.03125 15.558375 11.5846 20 15.9678 20';\n\ntype CompositeBarProps = {\n type: 'menu' | 'subheader';\n items: AsideHeaderItem[];\n className?: string;\n menuGroups?: MenuGroup[];\n onItemClick?: (\n item: AsideHeaderItem,\n collapsed: boolean,\n event: React.MouseEvent<HTMLElement, MouseEvent>,\n ) => void;\n menuMoreTitle?: string;\n onMoreClick?: () => void;\n compact: boolean;\n compositeId?: string;\n menuItemClassName?: string;\n /**\n * @see AsideHeaderMenuOverflow\n */\n menuOverflow?: AsideHeaderMenuOverflow;\n collapsedMenuGroupIds?: Record<string, boolean>;\n defaultCollapsedMenuGroupIds?: Record<string, boolean>;\n onToggleMenuGroupCollapsed?: (groupId: string) => void;\n};\n\ntype CompositeBarViewProps = {\n type: 'menu' | 'subheader';\n compositeId?: string;\n compact: boolean;\n menuItemClassName?: string;\n rows: CompositeBarRow[];\n onItemClick?: CompositeBarProps['onItemClick'];\n onMoreClick?: () => void;\n collapseItems?: AsideHeaderItem[];\n /** Nested group list + tree connectors (expanded menu + scroll overflow only). */\n inlineGroupChildren: boolean;\n isGroupCollapsed: (groupId: string) => boolean;\n onToggleGroupCollapsed: (groupId: string) => void;\n};\n\nconst CompositeBarView: FC<CompositeBarViewProps> = ({\n type,\n rows,\n onItemClick,\n onMoreClick,\n collapseItems,\n compact,\n compositeId,\n menuItemClassName,\n inlineGroupChildren,\n isGroupCollapsed,\n onToggleGroupCollapsed,\n}) => {\n const ref = useRef<List<CompositeBarRow>>(null);\n\n const onMouseLeave = useCallback(() => {\n if (compact && document.hasFocus()) {\n ref.current?.activateItem(undefined as unknown as number);\n }\n }, [compact]);\n\n const onItemClickByIndex = useCallback(\n (orginalItemClick: AsideHeaderItem['onItemClick']): ItemProps['onItemClick'] =>\n (item, collapsed, event) => {\n if (item.id === COLLAPSE_ITEM_ID && collapsed) {\n onMoreClick?.();\n } else {\n onItemClick?.(\n {\n ...item,\n onItemClick: collapsed ? item.onItemClick : orginalItemClick,\n },\n collapsed,\n event,\n );\n }\n },\n [onItemClick, onMoreClick],\n );\n\n const onSyntheticHeaderItemClick = useMemo(\n () => onItemClickByIndex(undefined) as NonNullable<ItemProps['onItemClick']>,\n [onItemClickByIndex],\n );\n\n const itemHeight = useCallback(\n (row: CompositeBarRow) => {\n if (row.kind === 'item') {\n return getItemHeight(row.item);\n }\n const headerH = getItemHeight(makeGroupHeaderAsideItem(row.group));\n if (!inlineGroupChildren || isGroupCollapsed(row.group.id)) {\n return headerH;\n }\n return headerH + getItemsHeight(row.items);\n },\n [inlineGroupChildren, isGroupCollapsed],\n );\n\n const itemsHeight = useCallback(\n (listRows: CompositeBarRow[]) => listRows.reduce((sum, row) => sum + itemHeight(row), 0),\n [itemHeight],\n );\n\n return (\n <List<CompositeBarRow>\n id={compositeId}\n ref={ref}\n items={rows}\n selectedItemIndex={type === 'menu' ? getSelectedCompositeBarRowIndex(rows) : undefined}\n itemHeight={itemHeight}\n itemsHeight={itemsHeight}\n itemClassName={b('root-menu-item', menuItemClassName)}\n virtualized={false}\n filterable={false}\n sortable={false}\n renderItem={(row) => {\n if (row.kind === 'item') {\n const item = row.item;\n let menuPopupItems: AsideHeaderItem[] | undefined;\n let menuPopupTitle: string | undefined;\n\n if (item.id === COLLAPSE_ITEM_ID) {\n menuPopupItems = collapseItems;\n } else {\n menuPopupItems = item.compositeBarMenuPopupItems;\n menuPopupTitle = item.compositeBarMenuPopupTitle;\n }\n\n return (\n <Item\n {...item}\n compact={compact}\n popupItemClassName={menuItemClassName}\n menuPopupItems={menuPopupItems}\n menuPopupTitle={menuPopupTitle}\n onMouseLeave={onMouseLeave}\n onItemClick={onItemClickByIndex(item.onItemClick)}\n />\n );\n }\n\n const headerItem = makeGroupHeaderAsideItem(row.group);\n const groupIsCollapsed = isGroupCollapsed(row.group.id);\n\n if (!inlineGroupChildren) {\n return (\n <Item\n {...headerItem}\n compact={compact}\n popupItemClassName={menuItemClassName}\n menuPopupItems={row.items}\n menuPopupTitle={row.group.popupTitle}\n className={b('menu-group-header')}\n onMouseLeave={onMouseLeave}\n onItemClick={onSyntheticHeaderItemClick}\n />\n );\n }\n\n const selectedItemIndex = getSelectedItemIndex(row.items);\n\n return (\n <div\n className={b('menu-group', {\n expanded: !groupIsCollapsed,\n collapsed: groupIsCollapsed,\n })}\n >\n <Item\n {...headerItem}\n compact={compact}\n popupItemClassName={menuItemClassName}\n className={b('menu-group-header')}\n groupHeaderExpanded={!groupIsCollapsed}\n onMouseLeave={onMouseLeave}\n onItemClick={(item, isItemCollapsed, event) => {\n onToggleGroupCollapsed(row.group.id);\n onSyntheticHeaderItemClick(item, isItemCollapsed, event);\n }}\n />\n {!groupIsCollapsed && (\n <List<AsideHeaderItem>\n items={row.items}\n selectedItemIndex={selectedItemIndex}\n itemHeight={getItemHeight}\n itemsHeight={getItemsHeight}\n itemClassName={b('menu-group-nested-list-item')}\n virtualized={false}\n filterable={false}\n sortable={false}\n renderItem={(nestedItem, _isActive, groupItemIndex) => {\n const spineActive =\n selectedItemIndex !== undefined &&\n groupItemIndex < selectedItemIndex;\n\n return (\n <div className={b('menu-group-nested-row-inner')}>\n <Item\n {...nestedItem}\n className={[\n nestedItem.className,\n b('menu-group-nested-item'),\n ]\n .filter(Boolean)\n .join(' ')}\n compact={compact}\n menuGroupNestedTreeConnector={\n <span\n className={b(\n 'menu-group-nested-connector',\n {'spine-active': spineActive},\n )}\n aria-hidden\n >\n <svg\n className={b(\n 'menu-group-nested-tree-svg',\n {\n active:\n selectedItemIndex ===\n groupItemIndex,\n },\n )}\n viewBox=\"0 0 16 40\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d={\n MENU_GROUP_NESTED_TREE_CONNECTOR_PATH\n }\n fill=\"none\"\n strokeLinecap=\"butt\"\n strokeWidth=\"1.3\"\n vectorEffect=\"non-scaling-stroke\"\n />\n </svg>\n </span>\n }\n onMouseLeave={onMouseLeave}\n onItemClick={onItemClickByIndex(\n nestedItem.onItemClick,\n )}\n />\n </div>\n );\n }}\n />\n )}\n </div>\n );\n }}\n />\n );\n};\n\nexport const CompositeBar: FC<CompositeBarProps> = ({\n type,\n className,\n items,\n menuGroups,\n menuMoreTitle,\n onItemClick,\n onMoreClick,\n compact,\n compositeId,\n menuItemClassName,\n menuOverflow = 'collapse',\n collapsedMenuGroupIds: collapsedMenuGroupIdsProp,\n defaultCollapsedMenuGroupIds,\n onToggleMenuGroupCollapsed,\n}) => {\n const rows = useMemo(() => buildCompositeBarRows(items, menuGroups), [items, menuGroups]);\n\n const isCollapsedControlled = collapsedMenuGroupIdsProp !== undefined;\n const [uncontrolledCollapsed, setUncontrolledCollapsed] = useState<Record<string, boolean>>(\n () => defaultCollapsedMenuGroupIds ?? {},\n );\n\n const collapsedMap = isCollapsedControlled ? collapsedMenuGroupIdsProp : uncontrolledCollapsed;\n\n const onToggleGroupCollapsed = useCallback(\n (groupId: string) => {\n onToggleMenuGroupCollapsed?.(groupId);\n if (!isCollapsedControlled) {\n setUncontrolledCollapsed((prev) => ({...prev, [groupId]: !prev[groupId]}));\n }\n },\n [isCollapsedControlled, onToggleMenuGroupCollapsed],\n );\n\n const isGroupCollapsed = useCallback(\n (groupId: string) => Boolean(collapsedMap[groupId]),\n [collapsedMap],\n );\n\n const inlineGroupChildren =\n !compact && menuOverflow === 'scroll' && type === 'menu' && Boolean(menuGroups?.length);\n\n const scrollableRows = useMemo(() => getReorderedCompositeBarRows(rows), [rows]);\n\n const scrollRecalcKey = useMemo(\n () =>\n `${items.length}:${menuGroups?.length ?? 0}:${JSON.stringify(\n Object.keys(collapsedMap)\n .sort()\n .reduce<Record<string, boolean>>((acc, k) => {\n acc[k] = Boolean(collapsedMap[k]);\n return acc;\n }, {}),\n )}`,\n [items.length, menuGroups?.length, collapsedMap],\n );\n\n if (rows.length === 0) {\n return null;\n }\n\n let node: ReactNode;\n\n if (type === 'menu') {\n if (menuOverflow === 'scroll' && !compact) {\n node = (\n <ScrollableWithScrollbar className={className} recalcDeps={[scrollRecalcKey]}>\n <CompositeBarView\n compositeId={compositeId}\n type=\"menu\"\n compact={compact}\n rows={scrollableRows}\n onItemClick={onItemClick}\n onMoreClick={onMoreClick}\n menuItemClassName={menuItemClassName}\n inlineGroupChildren={inlineGroupChildren}\n isGroupCollapsed={isGroupCollapsed}\n onToggleGroupCollapsed={onToggleGroupCollapsed}\n />\n </ScrollableWithScrollbar>\n );\n } else {\n const minHeight = getCompositeBarRowsMinHeight(rows);\n const collapseItem = getMoreButtonItem(menuMoreTitle);\n node = (\n <div className={b({autosizer: true})} style={{minHeight}}>\n {rows.length !== 0 && (\n <AutoSizer>\n {(size: Size) => {\n const width = Number.isNaN(size.width) ? 0 : size.width;\n const height = Number.isNaN(size.height) ? 0 : size.height;\n\n const {listRows, collapseItems} = getAutosizeCompositeBarRows(\n rows,\n height,\n collapseItem,\n );\n return (\n <div style={{width, height}}>\n <CompositeBarView\n compositeId={compositeId}\n type=\"menu\"\n compact={compact}\n rows={listRows}\n onItemClick={onItemClick}\n onMoreClick={onMoreClick}\n menuItemClassName={menuItemClassName}\n collapseItems={collapseItems}\n inlineGroupChildren={false}\n isGroupCollapsed={isGroupCollapsed}\n onToggleGroupCollapsed={onToggleGroupCollapsed}\n />\n </div>\n );\n }}\n </AutoSizer>\n )}\n </div>\n );\n }\n } else {\n node = (\n <div className={b({subheader: true})}>\n <CompositeBarView\n type=\"subheader\"\n menuItemClassName={menuItemClassName}\n compact={compact}\n rows={rows}\n onItemClick={onItemClick}\n inlineGroupChildren={false}\n isGroupCollapsed={isGroupCollapsed}\n onToggleGroupCollapsed={onToggleGroupCollapsed}\n />\n </div>\n );\n }\n return node;\n};\n"],"names":["createBlock","styles","useRef","useCallback","COLLAPSE_ITEM_ID","useMemo","getItemHeight","makeGroupHeaderAsideItem","getItemsHeight","List","getSelectedCompositeBarRowIndex","Item","getSelectedItemIndex","buildCompositeBarRows","useState","getReorderedCompositeBarRows","ScrollableWithScrollbar","getCompositeBarRowsMinHeight","getMoreButtonItem","getAutosizeCompositeBarRows"],"mappings":"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"}
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var styles = {"gn-composite-bar":"CompositeBar-module__gn-composite-bar___WoCDY","gnCompositeBar":"CompositeBar-module__gn-composite-bar___WoCDY","gn-composite-bar__root-menu-item":"CompositeBar-module__gn-composite-bar__root-menu-item___oxCuF","gnCompositeBarRootMenuItem":"CompositeBar-module__gn-composite-bar__root-menu-item___oxCuF"};
5
+ var styles = {"gn-composite-bar":"CompositeBar-module__gn-composite-bar___WoCDY","gnCompositeBar":"CompositeBar-module__gn-composite-bar___WoCDY","gn-composite-bar__root-menu-item":"CompositeBar-module__gn-composite-bar__root-menu-item___oxCuF","gnCompositeBarRootMenuItem":"CompositeBar-module__gn-composite-bar__root-menu-item___oxCuF","gn-composite-bar__menu-group":"CompositeBar-module__gn-composite-bar__menu-group___3hCzS","gnCompositeBarMenuGroup":"CompositeBar-module__gn-composite-bar__menu-group___3hCzS","gn-composite-bar__menu-group-header":"CompositeBar-module__gn-composite-bar__menu-group-header___Yvr21","gnCompositeBarMenuGroupHeader":"CompositeBar-module__gn-composite-bar__menu-group-header___Yvr21","gn-composite-bar__menu-group-nested-item":"CompositeBar-module__gn-composite-bar__menu-group-nested-item___9gea-","gnCompositeBarMenuGroupNestedItem":"CompositeBar-module__gn-composite-bar__menu-group-nested-item___9gea-","gn-composite-bar__menu-group-nested-list-item":"CompositeBar-module__gn-composite-bar__menu-group-nested-list-item___-IygH","gnCompositeBarMenuGroupNestedListItem":"CompositeBar-module__gn-composite-bar__menu-group-nested-list-item___-IygH","gn-composite-bar__menu-group-nested-connector":"CompositeBar-module__gn-composite-bar__menu-group-nested-connector___uiegb","gnCompositeBarMenuGroupNestedConnector":"CompositeBar-module__gn-composite-bar__menu-group-nested-connector___uiegb","gn-composite-bar__menu-group-nested-connector_spine-active":"CompositeBar-module__gn-composite-bar__menu-group-nested-connector_spine-active___qVoAX","gnCompositeBarMenuGroupNestedConnectorSpineActive":"CompositeBar-module__gn-composite-bar__menu-group-nested-connector_spine-active___qVoAX","gn-composite-bar__menu-group-nested-tree-svg":"CompositeBar-module__gn-composite-bar__menu-group-nested-tree-svg___FJny7","gnCompositeBarMenuGroupNestedTreeSvg":"CompositeBar-module__gn-composite-bar__menu-group-nested-tree-svg___FJny7","gn-composite-bar__menu-group-nested-tree-svg_active":"CompositeBar-module__gn-composite-bar__menu-group-nested-tree-svg_active___Gmthf","gnCompositeBarMenuGroupNestedTreeSvgActive":"CompositeBar-module__gn-composite-bar__menu-group-nested-tree-svg_active___Gmthf","gn-composite-bar__menu-group-nested-row-inner":"CompositeBar-module__gn-composite-bar__menu-group-nested-row-inner___jJLTe","gnCompositeBarMenuGroupNestedRowInner":"CompositeBar-module__gn-composite-bar__menu-group-nested-row-inner___jJLTe"};
6
6
 
7
7
  exports.default = styles;
8
8
  //# sourceMappingURL=CompositeBar.module.scss.js.map
@@ -8,7 +8,6 @@ var constants$1 = require('../../../../constants.js');
8
8
  var cn = require('../../../../utils/cn.js');
9
9
  var HighlightedItem = require('../HighlightedItem/HighlightedItem.js');
10
10
  var constants = require('../constants.js');
11
- var grouping = require('../grouping.js');
12
11
  var ItemPopup = require('./ItemPopup.js');
13
12
  var ItemPopupNestContext = require('./ItemPopupNestContext.js');
14
13
  var renderItemTitle = require('./renderItemTitle.js');
@@ -20,7 +19,7 @@ const defaultPopupOffset = { mainAxis: 14 };
20
19
  const CHEVRON_SIZE = 16;
21
20
  const CHEVRON_SIZE_COMPACT = 10;
22
21
  const Item = (props) => {
23
- const { className, popupItemClassName, menuPopupItems, menuPopupTitle, compact, onMouseLeave, onMouseEnter, enableTooltip = true, popupVisible = false, popupRef: anchoreRefProp, popupPlacement = defaultPopupPlacement, popupOffset = defaultPopupOffset, popupKeepMounted, renderPopupContent, onOpenChangePopup, onItemClick, onItemClickCapture, itemWrapper, bringForward, rightAdornment, title, href, qa, hideIcon = false, stopClickPropagation = false, } = props;
22
+ const { className, popupItemClassName, menuPopupItems, menuPopupTitle, groupHeaderExpanded, compact, onMouseLeave, onMouseEnter, enableTooltip = true, popupVisible = false, popupRef: anchoreRefProp, popupPlacement = defaultPopupPlacement, popupOffset = defaultPopupOffset, popupKeepMounted, renderPopupContent, onOpenChangePopup, onItemClick, onItemClickCapture, itemWrapper, bringForward, rightAdornment, title, href, qa, hideIcon = false, stopClickPropagation = false, menuGroupNestedTreeConnector, } = props;
24
23
  const [compactNavPopoverOpen, setCompactNavPopoverOpen] = React.useState(false);
25
24
  const ref = React.useRef(null);
26
25
  const anchorRef = (anchoreRefProp === null || anchoreRefProp === undefined ? undefined : anchoreRefProp.current) ? anchoreRefProp : ref;
@@ -31,13 +30,9 @@ const Item = (props) => {
31
30
  const iconSize = props.iconSize || constants$1.ASIDE_HEADER_ICON_SIZE;
32
31
  const iconQa = props.iconQa;
33
32
  const collapsedItem = props.id === constants.COLLAPSE_ITEM_ID;
34
- const isGroupHeader = grouping.isGroupHeaderItem(props);
35
- let resolvedMenuPopupItems = menuPopupItems;
36
- let resolvedMenuPopupTitle = menuPopupTitle;
37
- if (isGroupHeader) {
38
- resolvedMenuPopupItems = menuPopupItems !== null && menuPopupItems !== undefined ? menuPopupItems : props.groupChildren;
39
- resolvedMenuPopupTitle = menuPopupTitle !== null && menuPopupTitle !== undefined ? menuPopupTitle : props.groupPopupTitle;
40
- }
33
+ const inlineGroupHeader = groupHeaderExpanded !== undefined;
34
+ const resolvedMenuPopupItems = menuPopupItems !== null && menuPopupItems !== undefined ? menuPopupItems : props.compositeBarMenuPopupItems;
35
+ const resolvedMenuPopupTitle = menuPopupTitle !== null && menuPopupTitle !== undefined ? menuPopupTitle : props.compositeBarMenuPopupTitle;
41
36
  const handleOpenChangePopup = React.useCallback((newOpen, event, reason) => {
42
37
  var _a;
43
38
  if (event instanceof MouseEvent &&
@@ -51,17 +46,19 @@ const Item = (props) => {
51
46
  onOpenChangePopup === null || onOpenChangePopup === undefined ? undefined : onOpenChangePopup(newOpen, event, reason);
52
47
  }, [onOpenChangePopup]);
53
48
  const isDivider = type === 'divider';
54
- const hasSubmenuPopup = !isDivider && Boolean(resolvedMenuPopupItems === null || resolvedMenuPopupItems === undefined ? undefined : resolvedMenuPopupItems.length) && (collapsedItem || isGroupHeader);
49
+ const showMenuPopup = !isDivider &&
50
+ Boolean(resolvedMenuPopupItems === null || resolvedMenuPopupItems === undefined ? undefined : resolvedMenuPopupItems.length) &&
51
+ (collapsedItem || !inlineGroupHeader);
55
52
  const submenuNest = React.useContext(ItemPopupNestContext.ItemPopupNestContext);
56
53
  React.useEffect(() => {
57
- if (!submenuNest || !hasSubmenuPopup || !compactNavPopoverOpen) {
54
+ if (!submenuNest || !showMenuPopup || !compactNavPopoverOpen) {
58
55
  return undefined;
59
56
  }
60
57
  submenuNest.registerNestedOpen(1);
61
58
  return () => {
62
59
  submenuNest.registerNestedOpen(-1);
63
60
  };
64
- }, [submenuNest, hasSubmenuPopup, compactNavPopoverOpen]);
61
+ }, [submenuNest, showMenuPopup, compactNavPopoverOpen]);
65
62
  if (isDivider) {
66
63
  return React.createElement("div", { className: b('menu-divider') });
67
64
  }
@@ -99,12 +96,14 @@ const Item = (props) => {
99
96
  onMouseLeave === null || onMouseLeave === undefined ? undefined : onMouseLeave();
100
97
  }
101
98
  } }),
99
+ menuGroupNestedTreeConnector,
102
100
  React.createElement("div", { className: b('icon-place'), ref: highlightedRef }, makeIconNode(iconEl)),
103
101
  React.createElement("div", { className: b('title'), title: typeof title === 'string' ? title : undefined }, titleEl),
104
- Boolean(resolvedMenuPopupItems === null || resolvedMenuPopupItems === undefined ? undefined : resolvedMenuPopupItems.length) && (isGroupHeader || collapsedItem) && (React.createElement("div", { className: b('chevron') },
105
- React.createElement(uikit.Icon, { data: icons.ChevronRight, size: compact ? CHEVRON_SIZE_COMPACT : CHEVRON_SIZE })))));
102
+ inlineGroupHeader ? (React.createElement("div", { className: b('chevron') },
103
+ React.createElement(uikit.Icon, { data: groupHeaderExpanded ? icons.ChevronUp : icons.ChevronDown, size: compact ? CHEVRON_SIZE_COMPACT : CHEVRON_SIZE }))) : (Boolean(resolvedMenuPopupItems === null || resolvedMenuPopupItems === undefined ? undefined : resolvedMenuPopupItems.length) && (React.createElement("div", { className: b('chevron') },
104
+ React.createElement(uikit.Icon, { data: icons.ChevronRight, size: compact ? CHEVRON_SIZE_COMPACT : CHEVRON_SIZE }))))));
106
105
  const expandedMenuRows = resolvedMenuPopupItems;
107
- const wrappedTagNode = hasSubmenuPopup && expandedMenuRows ? (React.createElement(ItemPopup.ItemPopup, { items: expandedMenuRows, title: isGroupHeader ? resolvedMenuPopupTitle : undefined, open: compactNavPopoverOpen, itemClassName: popupItemClassName, onOpenChange: setCompactNavPopoverOpen, collapsed: collapsedItem ? true : compact, onItemClick: onItemClick }, tagNode)) : (tagNode);
106
+ const wrappedTagNode = showMenuPopup && expandedMenuRows ? (React.createElement(ItemPopup.ItemPopup, { items: expandedMenuRows, title: resolvedMenuPopupTitle, open: compactNavPopoverOpen, itemClassName: popupItemClassName, onOpenChange: setCompactNavPopoverOpen, collapsed: collapsedItem ? true : compact, onItemClick: onItemClick }, tagNode)) : (tagNode);
108
107
  const createdNode = (React.createElement(React.Fragment, null,
109
108
  wrappedTagNode,
110
109
  renderPopupContent && Boolean(anchorRef === null || anchorRef === undefined ? undefined : anchorRef.current) && (React.createElement(uikit.Popup, { strategy: "fixed", open: popupVisible, keepMounted: popupKeepMounted, placement: popupPlacement, offset: popupOffset, anchorElement: anchorRef.current, onOpenChange: handleOpenChangePopup }, renderPopupContent()))));
@@ -1 +1 @@
1
- {"version":3,"file":"Item.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/Item/Item.tsx"],"sourcesContent":["import React from 'react';\n\nimport {ChevronRight} from '@gravity-ui/icons';\nimport {Icon, Popup, PopupPlacement, PopupProps} from '@gravity-ui/uikit';\n\nimport {ASIDE_HEADER_ICON_SIZE} from '../../../../constants';\nimport {MakeItemParams} from '../../../../types';\nimport {createBlock} from '../../../../utils/cn';\nimport {HighlightedItem} from '../HighlightedItem/HighlightedItem';\nimport {COLLAPSE_ITEM_ID, ITEM_TYPE_REGULAR} from '../constants';\nimport {isGroupHeaderItem} from '../grouping';\n\nimport {ItemInnerProps, ItemProps} from './Item.types';\nimport {ItemPopup} from './ItemPopup';\nimport {ItemPopupNestContext} from './ItemPopupNestContext';\nimport {renderItemTitle} from './renderItemTitle';\n\nimport styles from './Item.module.scss';\n\nconst b = createBlock('composite-bar-item', styles);\n\nconst defaultPopupPlacement: PopupPlacement = ['right-end'];\nconst defaultPopupOffset: NonNullable<PopupProps['offset']> = {mainAxis: 14};\nconst CHEVRON_SIZE = 16;\nconst CHEVRON_SIZE_COMPACT = 10;\n\nexport const Item: React.FC<ItemInnerProps> = (props) => {\n const {\n className,\n popupItemClassName,\n menuPopupItems,\n menuPopupTitle,\n compact,\n onMouseLeave,\n onMouseEnter,\n enableTooltip = true,\n popupVisible = false,\n popupRef: anchoreRefProp,\n popupPlacement = defaultPopupPlacement,\n popupOffset = defaultPopupOffset,\n popupKeepMounted,\n renderPopupContent,\n onOpenChangePopup,\n onItemClick,\n onItemClickCapture,\n itemWrapper,\n bringForward,\n rightAdornment,\n title,\n href,\n qa,\n hideIcon = false,\n stopClickPropagation = false,\n } = props;\n\n const [compactNavPopoverOpen, setCompactNavPopoverOpen] = React.useState(false);\n\n const ref = React.useRef<HTMLAnchorElement & HTMLButtonElement>(null);\n const anchorRef = anchoreRefProp?.current ? anchoreRefProp : ref;\n const highlightedRef = React.useRef<HTMLDivElement>(null);\n\n const type = props.type || ITEM_TYPE_REGULAR;\n const current = props.current || false;\n const icon = props.icon;\n const iconSize = props.iconSize || ASIDE_HEADER_ICON_SIZE;\n const iconQa = props.iconQa;\n const collapsedItem = props.id === COLLAPSE_ITEM_ID;\n const isGroupHeader = isGroupHeaderItem(props);\n\n let resolvedMenuPopupItems = menuPopupItems;\n let resolvedMenuPopupTitle = menuPopupTitle;\n\n if (isGroupHeader) {\n resolvedMenuPopupItems = menuPopupItems ?? props.groupChildren;\n resolvedMenuPopupTitle = menuPopupTitle ?? props.groupPopupTitle;\n }\n\n const handleOpenChangePopup = React.useCallback<NonNullable<ItemProps['onOpenChangePopup']>>(\n (newOpen, event, reason) => {\n if (\n event instanceof MouseEvent &&\n event.target &&\n ref.current?.contains(event.target as Node)\n ) {\n return;\n }\n\n if (newOpen) {\n setCompactNavPopoverOpen(false);\n }\n\n onOpenChangePopup?.(newOpen, event, reason);\n },\n [onOpenChangePopup],\n );\n\n const isDivider = type === 'divider';\n const hasSubmenuPopup =\n !isDivider && Boolean(resolvedMenuPopupItems?.length) && (collapsedItem || isGroupHeader);\n\n const submenuNest = React.useContext(ItemPopupNestContext);\n\n React.useEffect(() => {\n if (!submenuNest || !hasSubmenuPopup || !compactNavPopoverOpen) {\n return undefined;\n }\n\n submenuNest.registerNestedOpen(1);\n\n return () => {\n submenuNest.registerNestedOpen(-1);\n };\n }, [submenuNest, hasSubmenuPopup, compactNavPopoverOpen]);\n\n if (isDivider) {\n return <div className={b('menu-divider')} />;\n }\n\n const compactPopoverDisabled = !enableTooltip || popupVisible || type === 'action';\n\n const makeIconNode = (iconEl: React.ReactNode): React.ReactNode => {\n if (!compact) {\n return iconEl;\n }\n\n const iconButton = (\n <div\n onMouseEnter={() => onMouseEnter?.()}\n onMouseLeave={() => onMouseLeave?.()}\n className={b('btn-icon')}\n >\n {iconEl}\n </div>\n );\n\n if (resolvedMenuPopupItems?.length) {\n return iconButton;\n }\n\n return (\n <ItemPopup\n items={[props]}\n open={compactNavPopoverOpen}\n onOpenChange={(nextOpen) => {\n if (nextOpen && compactPopoverDisabled) return;\n setCompactNavPopoverOpen(nextOpen);\n }}\n hideIcon\n itemClassName={popupItemClassName}\n disabled={compactPopoverDisabled}\n type={type}\n collapsed={compact}\n onItemClick={onItemClick}\n >\n {iconButton}\n </ItemPopup>\n );\n };\n\n const makeNode = ({icon: iconEl, title: titleEl}: MakeItemParams) => {\n const [Tag, tagProps] = href ? ['a' as const, {href}] : ['button' as const, {}];\n\n const tagNode = (\n <Tag\n {...tagProps}\n className={b({type, current, compact, 'hide-icon': hideIcon}, className)}\n ref={ref}\n data-type={type}\n data-qa={qa}\n onClick={(event: React.MouseEvent<HTMLElement, MouseEvent>) => {\n if (stopClickPropagation) {\n event.stopPropagation();\n }\n\n if (compact && !collapsedItem) {\n setCompactNavPopoverOpen(false);\n }\n\n onItemClick?.(props, collapsedItem, event);\n }}\n onClickCapture={onItemClickCapture}\n onMouseEnter={() => {\n if (!compact) {\n onMouseEnter?.();\n }\n }}\n onMouseLeave={() => {\n if (!compact) {\n onMouseLeave?.();\n }\n }}\n >\n <div className={b('icon-place')} ref={highlightedRef}>\n {makeIconNode(iconEl)}\n </div>\n\n <div className={b('title')} title={typeof title === 'string' ? title : undefined}>\n {titleEl}\n </div>\n\n {Boolean(resolvedMenuPopupItems?.length) && (isGroupHeader || collapsedItem) && (\n <div className={b('chevron')}>\n <Icon\n data={ChevronRight}\n size={compact ? CHEVRON_SIZE_COMPACT : CHEVRON_SIZE}\n />\n </div>\n )}\n </Tag>\n );\n\n const expandedMenuRows = resolvedMenuPopupItems;\n\n const wrappedTagNode =\n hasSubmenuPopup && expandedMenuRows ? (\n <ItemPopup\n items={expandedMenuRows}\n title={isGroupHeader ? resolvedMenuPopupTitle : undefined}\n open={compactNavPopoverOpen}\n itemClassName={popupItemClassName}\n onOpenChange={setCompactNavPopoverOpen}\n collapsed={collapsedItem ? true : compact}\n onItemClick={onItemClick}\n >\n {tagNode}\n </ItemPopup>\n ) : (\n tagNode\n );\n\n const createdNode = (\n <React.Fragment>\n {wrappedTagNode}\n {renderPopupContent && Boolean(anchorRef?.current) && (\n <Popup\n strategy=\"fixed\"\n open={popupVisible}\n keepMounted={popupKeepMounted}\n placement={popupPlacement}\n offset={popupOffset}\n anchorElement={anchorRef.current}\n onOpenChange={handleOpenChangePopup}\n >\n {renderPopupContent()}\n </Popup>\n )}\n </React.Fragment>\n );\n\n return createdNode;\n };\n\n const iconNode =\n hideIcon || !icon ? null : (\n <Icon qa={iconQa} data={icon} size={iconSize} className={b('icon')} />\n );\n const titleNode = renderItemTitle({title, rightAdornment});\n const params = {icon: iconNode, title: titleNode};\n let highlightedNode = null;\n let node;\n\n const opts = {compact: Boolean(compact), collapsed: false, item: props, ref};\n\n if (typeof itemWrapper === 'function') {\n node = itemWrapper(params, makeNode, opts) as React.ReactElement;\n highlightedNode =\n bringForward &&\n (itemWrapper(\n params,\n ({icon: iconEl}) => makeIconNode(iconEl),\n opts,\n ) as React.ReactElement);\n } else {\n node = makeNode(params);\n highlightedNode = bringForward && makeIconNode(iconNode);\n }\n\n return (\n <React.Fragment>\n {bringForward && (\n <HighlightedItem\n iconNode={highlightedNode}\n iconRef={highlightedRef}\n onClick={(event: React.MouseEvent<HTMLElement, MouseEvent>) =>\n onItemClick?.(props, false, event)\n }\n onClickCapture={onItemClickCapture}\n />\n )}\n {node}\n </React.Fragment>\n );\n};\n\nItem.displayName = 'Item';\n"],"names":["createBlock","styles","ITEM_TYPE_REGULAR","ASIDE_HEADER_ICON_SIZE","COLLAPSE_ITEM_ID","isGroupHeaderItem","ItemPopupNestContext","ItemPopup","Icon","ChevronRight","Popup","renderItemTitle","HighlightedItem"],"mappings":"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"}
1
+ {"version":3,"file":"Item.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/Item/Item.tsx"],"sourcesContent":["import React from 'react';\n\nimport {ChevronDown, ChevronRight, ChevronUp} from '@gravity-ui/icons';\nimport {Icon, Popup, PopupPlacement, PopupProps} from '@gravity-ui/uikit';\n\nimport {ASIDE_HEADER_ICON_SIZE} from '../../../../constants';\nimport {MakeItemParams} from '../../../../types';\nimport {createBlock} from '../../../../utils/cn';\nimport {HighlightedItem} from '../HighlightedItem/HighlightedItem';\nimport {COLLAPSE_ITEM_ID, ITEM_TYPE_REGULAR} from '../constants';\n\nimport {ItemInnerProps, ItemProps} from './Item.types';\nimport {ItemPopup} from './ItemPopup';\nimport {ItemPopupNestContext} from './ItemPopupNestContext';\nimport {renderItemTitle} from './renderItemTitle';\n\nimport styles from './Item.module.scss';\n\nconst b = createBlock('composite-bar-item', styles);\n\nconst defaultPopupPlacement: PopupPlacement = ['right-end'];\nconst defaultPopupOffset: NonNullable<PopupProps['offset']> = {mainAxis: 14};\nconst CHEVRON_SIZE = 16;\nconst CHEVRON_SIZE_COMPACT = 10;\n\nexport const Item: React.FC<ItemInnerProps> = (props) => {\n const {\n className,\n popupItemClassName,\n menuPopupItems,\n menuPopupTitle,\n groupHeaderExpanded,\n compact,\n onMouseLeave,\n onMouseEnter,\n enableTooltip = true,\n popupVisible = false,\n popupRef: anchoreRefProp,\n popupPlacement = defaultPopupPlacement,\n popupOffset = defaultPopupOffset,\n popupKeepMounted,\n renderPopupContent,\n onOpenChangePopup,\n onItemClick,\n onItemClickCapture,\n itemWrapper,\n bringForward,\n rightAdornment,\n title,\n href,\n qa,\n hideIcon = false,\n stopClickPropagation = false,\n menuGroupNestedTreeConnector,\n } = props;\n\n const [compactNavPopoverOpen, setCompactNavPopoverOpen] = React.useState(false);\n\n const ref = React.useRef<HTMLAnchorElement & HTMLButtonElement>(null);\n const anchorRef = anchoreRefProp?.current ? anchoreRefProp : ref;\n const highlightedRef = React.useRef<HTMLDivElement>(null);\n\n const type = props.type || ITEM_TYPE_REGULAR;\n const current = props.current || false;\n const icon = props.icon;\n const iconSize = props.iconSize || ASIDE_HEADER_ICON_SIZE;\n const iconQa = props.iconQa;\n const collapsedItem = props.id === COLLAPSE_ITEM_ID;\n const inlineGroupHeader = groupHeaderExpanded !== undefined;\n const resolvedMenuPopupItems = menuPopupItems ?? props.compositeBarMenuPopupItems;\n const resolvedMenuPopupTitle = menuPopupTitle ?? props.compositeBarMenuPopupTitle;\n\n const handleOpenChangePopup = React.useCallback<NonNullable<ItemProps['onOpenChangePopup']>>(\n (newOpen, event, reason) => {\n if (\n event instanceof MouseEvent &&\n event.target &&\n ref.current?.contains(event.target as Node)\n ) {\n return;\n }\n\n if (newOpen) {\n setCompactNavPopoverOpen(false);\n }\n\n onOpenChangePopup?.(newOpen, event, reason);\n },\n [onOpenChangePopup],\n );\n\n const isDivider = type === 'divider';\n const showMenuPopup =\n !isDivider &&\n Boolean(resolvedMenuPopupItems?.length) &&\n (collapsedItem || !inlineGroupHeader);\n\n const submenuNest = React.useContext(ItemPopupNestContext);\n\n React.useEffect(() => {\n if (!submenuNest || !showMenuPopup || !compactNavPopoverOpen) {\n return undefined;\n }\n\n submenuNest.registerNestedOpen(1);\n\n return () => {\n submenuNest.registerNestedOpen(-1);\n };\n }, [submenuNest, showMenuPopup, compactNavPopoverOpen]);\n\n if (isDivider) {\n return <div className={b('menu-divider')} />;\n }\n\n const compactPopoverDisabled = !enableTooltip || popupVisible || type === 'action';\n\n const makeIconNode = (iconEl: React.ReactNode): React.ReactNode => {\n if (!compact) {\n return iconEl;\n }\n\n const iconButton = (\n <div\n onMouseEnter={() => onMouseEnter?.()}\n onMouseLeave={() => onMouseLeave?.()}\n className={b('btn-icon')}\n >\n {iconEl}\n </div>\n );\n\n if (resolvedMenuPopupItems?.length) {\n return iconButton;\n }\n\n return (\n <ItemPopup\n items={[props]}\n open={compactNavPopoverOpen}\n onOpenChange={(nextOpen) => {\n if (nextOpen && compactPopoverDisabled) return;\n setCompactNavPopoverOpen(nextOpen);\n }}\n hideIcon\n itemClassName={popupItemClassName}\n disabled={compactPopoverDisabled}\n type={type}\n collapsed={compact}\n onItemClick={onItemClick}\n >\n {iconButton}\n </ItemPopup>\n );\n };\n\n const makeNode = ({icon: iconEl, title: titleEl}: MakeItemParams) => {\n const [Tag, tagProps] = href ? ['a' as const, {href}] : ['button' as const, {}];\n\n const tagNode = (\n <Tag\n {...tagProps}\n className={b({type, current, compact, 'hide-icon': hideIcon}, className)}\n ref={ref}\n data-type={type}\n data-qa={qa}\n onClick={(event: React.MouseEvent<HTMLElement, MouseEvent>) => {\n if (stopClickPropagation) {\n event.stopPropagation();\n }\n\n if (compact && !collapsedItem) {\n setCompactNavPopoverOpen(false);\n }\n\n onItemClick?.(props, collapsedItem, event);\n }}\n onClickCapture={onItemClickCapture}\n onMouseEnter={() => {\n if (!compact) {\n onMouseEnter?.();\n }\n }}\n onMouseLeave={() => {\n if (!compact) {\n onMouseLeave?.();\n }\n }}\n >\n {menuGroupNestedTreeConnector}\n <div className={b('icon-place')} ref={highlightedRef}>\n {makeIconNode(iconEl)}\n </div>\n\n <div className={b('title')} title={typeof title === 'string' ? title : undefined}>\n {titleEl}\n </div>\n\n {inlineGroupHeader ? (\n <div className={b('chevron')}>\n <Icon\n data={groupHeaderExpanded ? ChevronUp : ChevronDown}\n size={compact ? CHEVRON_SIZE_COMPACT : CHEVRON_SIZE}\n />\n </div>\n ) : (\n Boolean(resolvedMenuPopupItems?.length) && (\n <div className={b('chevron')}>\n <Icon\n data={ChevronRight}\n size={compact ? CHEVRON_SIZE_COMPACT : CHEVRON_SIZE}\n />\n </div>\n )\n )}\n </Tag>\n );\n\n const expandedMenuRows = resolvedMenuPopupItems;\n\n const wrappedTagNode =\n showMenuPopup && expandedMenuRows ? (\n <ItemPopup\n items={expandedMenuRows}\n title={resolvedMenuPopupTitle}\n open={compactNavPopoverOpen}\n itemClassName={popupItemClassName}\n onOpenChange={setCompactNavPopoverOpen}\n collapsed={collapsedItem ? true : compact}\n onItemClick={onItemClick}\n >\n {tagNode}\n </ItemPopup>\n ) : (\n tagNode\n );\n\n const createdNode = (\n <React.Fragment>\n {wrappedTagNode}\n {renderPopupContent && Boolean(anchorRef?.current) && (\n <Popup\n strategy=\"fixed\"\n open={popupVisible}\n keepMounted={popupKeepMounted}\n placement={popupPlacement}\n offset={popupOffset}\n anchorElement={anchorRef.current}\n onOpenChange={handleOpenChangePopup}\n >\n {renderPopupContent()}\n </Popup>\n )}\n </React.Fragment>\n );\n\n return createdNode;\n };\n\n const iconNode =\n hideIcon || !icon ? null : (\n <Icon qa={iconQa} data={icon} size={iconSize} className={b('icon')} />\n );\n const titleNode = renderItemTitle({title, rightAdornment});\n const params = {icon: iconNode, title: titleNode};\n let highlightedNode = null;\n let node;\n\n const opts = {compact: Boolean(compact), collapsed: false, item: props, ref};\n\n if (typeof itemWrapper === 'function') {\n node = itemWrapper(params, makeNode, opts) as React.ReactElement;\n highlightedNode =\n bringForward &&\n (itemWrapper(\n params,\n ({icon: iconEl}) => makeIconNode(iconEl),\n opts,\n ) as React.ReactElement);\n } else {\n node = makeNode(params);\n highlightedNode = bringForward && makeIconNode(iconNode);\n }\n\n return (\n <React.Fragment>\n {bringForward && (\n <HighlightedItem\n iconNode={highlightedNode}\n iconRef={highlightedRef}\n onClick={(event: React.MouseEvent<HTMLElement, MouseEvent>) =>\n onItemClick?.(props, false, event)\n }\n onClickCapture={onItemClickCapture}\n />\n )}\n {node}\n </React.Fragment>\n );\n};\n\nItem.displayName = 'Item';\n"],"names":["createBlock","styles","ITEM_TYPE_REGULAR","ASIDE_HEADER_ICON_SIZE","COLLAPSE_ITEM_ID","ItemPopupNestContext","ItemPopup","Icon","ChevronUp","ChevronDown","ChevronRight","Popup","renderItemTitle","HighlightedItem"],"mappings":"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"}
@@ -1,3 +1,4 @@
1
+ import * as React from 'react';
1
2
  import { AsideHeaderItem } from 'src/components/AsideHeader/types';
2
3
  export interface ItemProps extends AsideHeaderItem {
3
4
  }
@@ -8,6 +9,11 @@ export interface ItemInnerProps extends ItemProps {
8
9
  menuPopupItems?: AsideHeaderItem[];
9
10
  /** Optional title rendered at the top of the popup listing `menuPopupItems`. */
10
11
  menuPopupTitle?: string;
12
+ /**
13
+ * When set, the row is an inline (expanded sidebar) group header: chevron up/down
14
+ * instead of a flyout chevron, and children render in a nested list.
15
+ */
16
+ groupHeaderExpanded?: boolean;
11
17
  onMouseEnter?: () => void;
12
18
  onMouseLeave?: () => void;
13
19
  /** When true, the icon slot is not rendered (e.g. compact popover: icon stays in the bar). */
@@ -17,4 +23,6 @@ export interface ItemInnerProps extends ItemProps {
17
23
  * the parent Item's onClick in the React tree.
18
24
  */
19
25
  stopClickPropagation?: boolean;
26
+ /** Inline menu-group tree (L-connector) rendered inside the row, before the icon slot. */
27
+ menuGroupNestedTreeConnector?: React.ReactNode;
20
28
  }
@@ -1,5 +1,6 @@
1
1
  import React from 'react';
2
- export type ItemPopupNestContextValue = {
2
+ type ItemPopupNestContextValue = {
3
3
  registerNestedOpen: (delta: number) => void;
4
4
  };
5
5
  export declare const ItemPopupNestContext: React.Context<ItemPopupNestContextValue | null>;
6
+ export {};
@@ -1 +1 @@
1
- {"version":3,"file":"ItemPopupNestContext.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/Item/ItemPopupNestContext.tsx"],"sourcesContent":["import React from 'react';\n\nexport type ItemPopupNestContextValue = {\n registerNestedOpen: (delta: number) => void;\n};\n\nexport const ItemPopupNestContext = React.createContext<ItemPopupNestContextValue | null>(null);\n"],"names":[],"mappings":";;;;AAMa,MAAA,oBAAoB,GAAG,KAAK,CAAC,aAAa,CAAmC,IAAI;;;;"}
1
+ {"version":3,"file":"ItemPopupNestContext.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/Item/ItemPopupNestContext.tsx"],"sourcesContent":["import React from 'react';\n\ntype ItemPopupNestContextValue = {\n registerNestedOpen: (delta: number) => void;\n};\n\nexport const ItemPopupNestContext = React.createContext<ItemPopupNestContextValue | null>(null);\n"],"names":[],"mappings":";;;;AAMa,MAAA,oBAAoB,GAAG,KAAK,CAAC,aAAa,CAAmC,IAAI;;;;"}
@@ -18,7 +18,8 @@ type UseScrollableScrollbarSyncResult = {
18
18
  * Keeps a custom scrollbar thumb and bottom shadow in sync with a native
19
19
  * scroll layer. The scroll element handles touch/keyboard; wheel events on the
20
20
  * overlay track are forwarded to it (the track sits above the scroller, so
21
- * they would not scroll otherwise).
21
+ * they would not scroll otherwise). Wheel, touch, and keyboard on the
22
+ * scrollable area itself are unchanged.
22
23
  *
23
24
  * @param recalcDeps - extra deps that should trigger thumb/shadow recalculation
24
25
  * @returns refs, scroll state, thumb geometry, and pointer handlers for the UI
@@ -8,7 +8,8 @@ const MIN_THUMB_HEIGHT = 24;
8
8
  * Keeps a custom scrollbar thumb and bottom shadow in sync with a native
9
9
  * scroll layer. The scroll element handles touch/keyboard; wheel events on the
10
10
  * overlay track are forwarded to it (the track sits above the scroller, so
11
- * they would not scroll otherwise).
11
+ * they would not scroll otherwise). Wheel, touch, and keyboard on the
12
+ * scrollable area itself are unchanged.
12
13
  *
13
14
  * @param recalcDeps - extra deps that should trigger thumb/shadow recalculation
14
15
  * @returns refs, scroll state, thumb geometry, and pointer handlers for the UI
@@ -1 +1 @@
1
- {"version":3,"file":"useScrollableScrollbarSync.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollableScrollbarSync.ts"],"sourcesContent":["import React, {useCallback, useEffect, useLayoutEffect, useRef, useState} from 'react';\n\nconst EMPTY_DEPS: React.DependencyList = [];\n\nconst MIN_THUMB_HEIGHT = 24;\n\ntype ThumbGeometry = {\n top: number;\n height: number;\n};\n\ntype UseScrollableScrollbarSyncResult = {\n scrollRef: React.RefObject<HTMLDivElement>;\n trackRef: React.RefObject<HTMLDivElement>;\n thumbRef: React.RefObject<HTMLDivElement>;\n hasContentBelow: boolean;\n overflows: boolean;\n thumb: ThumbGeometry;\n scheduleUpdate: () => void;\n handleThumbPointerDown: (event: React.PointerEvent<HTMLDivElement>) => void;\n handleTrackPointerDown: (event: React.PointerEvent<HTMLDivElement>) => void;\n};\n\n/**\n * Keeps a custom scrollbar thumb and bottom shadow in sync with a native\n * scroll layer. The scroll element handles touch/keyboard; wheel events on the\n * overlay track are forwarded to it (the track sits above the scroller, so\n * they would not scroll otherwise).\n *\n * @param recalcDeps - extra deps that should trigger thumb/shadow recalculation\n * @returns refs, scroll state, thumb geometry, and pointer handlers for the UI\n */\nexport function useScrollableScrollbarSync(\n recalcDeps: React.DependencyList = EMPTY_DEPS,\n): UseScrollableScrollbarSyncResult {\n const scrollRef = useRef<HTMLDivElement>(null);\n const trackRef = useRef<HTMLDivElement>(null);\n const thumbRef = useRef<HTMLDivElement>(null);\n\n const [hasContentBelow, setHasContentBelow] = useState(false);\n const [overflows, setOverflows] = useState(false);\n const [thumb, setThumb] = useState<ThumbGeometry>({top: 0, height: 0});\n\n const rafIdRef = useRef<number | null>(null);\n const scheduleUpdate = useCallback(() => {\n if (rafIdRef.current !== null) {\n return;\n }\n\n rafIdRef.current = requestAnimationFrame(() => {\n rafIdRef.current = null;\n\n const el = scrollRef.current;\n\n if (!el) {\n return;\n }\n\n const {scrollTop, scrollHeight, clientHeight} = el;\n const isOverflowing = scrollHeight > clientHeight;\n // `-1` guards against subpixel rounding at the bottom.\n const notAtBottom = scrollTop + clientHeight < scrollHeight - 1;\n\n setOverflows(isOverflowing);\n setHasContentBelow(isOverflowing && notAtBottom);\n\n if (!isOverflowing) {\n setThumb({top: 0, height: 0});\n return;\n }\n\n const ratio = clientHeight / scrollHeight;\n const rawHeight = clientHeight * ratio;\n const height = Math.max(rawHeight, MIN_THUMB_HEIGHT);\n const maxTop = clientHeight - height;\n const scrollRatio =\n scrollHeight - clientHeight > 0 ? scrollTop / (scrollHeight - clientHeight) : 0;\n const top = maxTop * scrollRatio;\n\n setThumb({top, height});\n });\n }, []);\n\n useEffect(() => {\n const el = scrollRef.current;\n\n if (!el) {\n return undefined;\n }\n\n scheduleUpdate();\n\n if (typeof ResizeObserver === 'undefined') {\n return undefined;\n }\n\n const observer = new ResizeObserver(scheduleUpdate);\n observer.observe(el);\n return () => observer.disconnect();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [scheduleUpdate, ...recalcDeps]);\n\n useEffect(() => {\n return () => {\n if (rafIdRef.current !== null) {\n cancelAnimationFrame(rafIdRef.current);\n rafIdRef.current = null;\n }\n };\n }, []);\n\n // Wheel events do not reach the native scroll layer when the cursor is over\n // the overlay track — forward them explicitly. `passive: false` is required\n // so `preventDefault` works in all browsers.\n useLayoutEffect(() => {\n if (!overflows) {\n return undefined;\n }\n\n const track = trackRef.current;\n const scrollEl = scrollRef.current;\n\n if (!track || !scrollEl) {\n return undefined;\n }\n\n const onWheel = (e: WheelEvent) => {\n e.preventDefault();\n scrollEl.scrollTop += e.deltaY;\n };\n\n track.addEventListener('wheel', onWheel, {passive: false});\n return () => track.removeEventListener('wheel', onWheel);\n }, [overflows]);\n\n const cancelProgrammaticSmoothScroll = useCallback((scrollEl: HTMLDivElement) => {\n const top = scrollEl.scrollTop;\n scrollEl.scrollTo({top, behavior: 'auto'});\n }, []);\n\n const handleThumbPointerDown = useCallback(\n (event: React.PointerEvent<HTMLDivElement>) => {\n const scrollEl = scrollRef.current;\n const thumbEl = thumbRef.current;\n\n if (!scrollEl || !thumbEl || event.button !== 0) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n cancelProgrammaticSmoothScroll(scrollEl);\n\n const startY = event.clientY;\n const startScrollTop = scrollEl.scrollTop;\n const {scrollHeight, clientHeight} = scrollEl;\n const thumbHeight = thumbEl.getBoundingClientRect().height;\n const trackHeight = clientHeight;\n const maxThumbTop = trackHeight - thumbHeight;\n const maxScrollTop = scrollHeight - clientHeight;\n\n if (maxThumbTop <= 0 || maxScrollTop <= 0) {\n return;\n }\n\n const handlePointerMove = (moveEvent: PointerEvent) => {\n const deltaY = moveEvent.clientY - startY;\n const deltaScroll = (deltaY / maxThumbTop) * maxScrollTop;\n scrollEl.scrollTop = startScrollTop + deltaScroll;\n };\n\n const handlePointerUp = () => {\n window.removeEventListener('pointermove', handlePointerMove);\n window.removeEventListener('pointerup', handlePointerUp);\n window.removeEventListener('pointercancel', handlePointerUp);\n };\n\n window.addEventListener('pointermove', handlePointerMove);\n window.addEventListener('pointerup', handlePointerUp);\n window.addEventListener('pointercancel', handlePointerUp);\n },\n [cancelProgrammaticSmoothScroll],\n );\n\n const handleTrackPointerDown = useCallback(\n (event: React.PointerEvent<HTMLDivElement>) => {\n const scrollEl = scrollRef.current;\n const thumbEl = thumbRef.current;\n\n if (\n !scrollEl ||\n !thumbEl ||\n event.button !== 0 ||\n event.target !== event.currentTarget\n ) {\n return;\n }\n\n cancelProgrammaticSmoothScroll(scrollEl);\n\n const trackRect = event.currentTarget.getBoundingClientRect();\n const thumbHeight = thumbEl.getBoundingClientRect().height;\n const clickY = event.clientY - trackRect.top;\n const targetThumbTop = Math.max(\n 0,\n Math.min(clickY - thumbHeight / 2, trackRect.height - thumbHeight),\n );\n const maxThumbTop = trackRect.height - thumbHeight;\n const maxScrollTop = scrollEl.scrollHeight - scrollEl.clientHeight;\n\n if (maxThumbTop <= 0 || maxScrollTop <= 0) {\n return;\n }\n\n // `auto` avoids racing with a subsequent thumb drag (smooth scroll would\n // still animate while pointer handlers update `scrollTop`).\n scrollEl.scrollTo({\n top: (targetThumbTop / maxThumbTop) * maxScrollTop,\n behavior: 'auto',\n });\n },\n [cancelProgrammaticSmoothScroll],\n );\n\n return {\n scrollRef,\n trackRef,\n thumbRef,\n hasContentBelow,\n overflows,\n thumb,\n scheduleUpdate,\n handleThumbPointerDown,\n handleTrackPointerDown,\n };\n}\n"],"names":["useRef","useState","useCallback","useEffect","useLayoutEffect"],"mappings":"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"}
1
+ {"version":3,"file":"useScrollableScrollbarSync.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/ScrollableWithScrollbar/useScrollableScrollbarSync.ts"],"sourcesContent":["import React, {useCallback, useEffect, useLayoutEffect, useRef, useState} from 'react';\n\nconst EMPTY_DEPS: React.DependencyList = [];\n\nconst MIN_THUMB_HEIGHT = 24;\n\ntype ThumbGeometry = {\n top: number;\n height: number;\n};\n\ntype UseScrollableScrollbarSyncResult = {\n scrollRef: React.RefObject<HTMLDivElement>;\n trackRef: React.RefObject<HTMLDivElement>;\n thumbRef: React.RefObject<HTMLDivElement>;\n hasContentBelow: boolean;\n overflows: boolean;\n thumb: ThumbGeometry;\n scheduleUpdate: () => void;\n handleThumbPointerDown: (event: React.PointerEvent<HTMLDivElement>) => void;\n handleTrackPointerDown: (event: React.PointerEvent<HTMLDivElement>) => void;\n};\n\n/**\n * Keeps a custom scrollbar thumb and bottom shadow in sync with a native\n * scroll layer. The scroll element handles touch/keyboard; wheel events on the\n * overlay track are forwarded to it (the track sits above the scroller, so\n * they would not scroll otherwise). Wheel, touch, and keyboard on the\n * scrollable area itself are unchanged.\n *\n * @param recalcDeps - extra deps that should trigger thumb/shadow recalculation\n * @returns refs, scroll state, thumb geometry, and pointer handlers for the UI\n */\nexport function useScrollableScrollbarSync(\n recalcDeps: React.DependencyList = EMPTY_DEPS,\n): UseScrollableScrollbarSyncResult {\n const scrollRef = useRef<HTMLDivElement>(null);\n const trackRef = useRef<HTMLDivElement>(null);\n const thumbRef = useRef<HTMLDivElement>(null);\n\n const [hasContentBelow, setHasContentBelow] = useState(false);\n const [overflows, setOverflows] = useState(false);\n const [thumb, setThumb] = useState<ThumbGeometry>({top: 0, height: 0});\n\n const rafIdRef = useRef<number | null>(null);\n const scheduleUpdate = useCallback(() => {\n if (rafIdRef.current !== null) {\n return;\n }\n\n rafIdRef.current = requestAnimationFrame(() => {\n rafIdRef.current = null;\n\n const el = scrollRef.current;\n\n if (!el) {\n return;\n }\n\n const {scrollTop, scrollHeight, clientHeight} = el;\n const isOverflowing = scrollHeight > clientHeight;\n // `-1` guards against subpixel rounding at the bottom.\n const notAtBottom = scrollTop + clientHeight < scrollHeight - 1;\n\n setOverflows(isOverflowing);\n setHasContentBelow(isOverflowing && notAtBottom);\n\n if (!isOverflowing) {\n setThumb({top: 0, height: 0});\n return;\n }\n\n const ratio = clientHeight / scrollHeight;\n const rawHeight = clientHeight * ratio;\n const height = Math.max(rawHeight, MIN_THUMB_HEIGHT);\n const maxTop = clientHeight - height;\n const scrollRatio =\n scrollHeight - clientHeight > 0 ? scrollTop / (scrollHeight - clientHeight) : 0;\n const top = maxTop * scrollRatio;\n\n setThumb({top, height});\n });\n }, []);\n\n useEffect(() => {\n const el = scrollRef.current;\n\n if (!el) {\n return undefined;\n }\n\n scheduleUpdate();\n\n if (typeof ResizeObserver === 'undefined') {\n return undefined;\n }\n\n const observer = new ResizeObserver(scheduleUpdate);\n observer.observe(el);\n return () => observer.disconnect();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [scheduleUpdate, ...recalcDeps]);\n\n useEffect(() => {\n return () => {\n if (rafIdRef.current !== null) {\n cancelAnimationFrame(rafIdRef.current);\n rafIdRef.current = null;\n }\n };\n }, []);\n\n // Wheel events do not reach the native scroll layer when the cursor is over\n // the overlay track — forward them explicitly. `passive: false` is required\n // so `preventDefault` works in all browsers.\n useLayoutEffect(() => {\n if (!overflows) {\n return undefined;\n }\n\n const track = trackRef.current;\n const scrollEl = scrollRef.current;\n\n if (!track || !scrollEl) {\n return undefined;\n }\n\n const onWheel = (e: WheelEvent) => {\n e.preventDefault();\n scrollEl.scrollTop += e.deltaY;\n };\n\n track.addEventListener('wheel', onWheel, {passive: false});\n return () => track.removeEventListener('wheel', onWheel);\n }, [overflows]);\n\n const cancelProgrammaticSmoothScroll = useCallback((scrollEl: HTMLDivElement) => {\n const top = scrollEl.scrollTop;\n scrollEl.scrollTo({top, behavior: 'auto'});\n }, []);\n\n const handleThumbPointerDown = useCallback(\n (event: React.PointerEvent<HTMLDivElement>) => {\n const scrollEl = scrollRef.current;\n const thumbEl = thumbRef.current;\n\n if (!scrollEl || !thumbEl || event.button !== 0) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n cancelProgrammaticSmoothScroll(scrollEl);\n\n const startY = event.clientY;\n const startScrollTop = scrollEl.scrollTop;\n const {scrollHeight, clientHeight} = scrollEl;\n const thumbHeight = thumbEl.getBoundingClientRect().height;\n const trackHeight = clientHeight;\n const maxThumbTop = trackHeight - thumbHeight;\n const maxScrollTop = scrollHeight - clientHeight;\n\n if (maxThumbTop <= 0 || maxScrollTop <= 0) {\n return;\n }\n\n const handlePointerMove = (moveEvent: PointerEvent) => {\n const deltaY = moveEvent.clientY - startY;\n const deltaScroll = (deltaY / maxThumbTop) * maxScrollTop;\n scrollEl.scrollTop = startScrollTop + deltaScroll;\n };\n\n const handlePointerUp = () => {\n window.removeEventListener('pointermove', handlePointerMove);\n window.removeEventListener('pointerup', handlePointerUp);\n window.removeEventListener('pointercancel', handlePointerUp);\n };\n\n window.addEventListener('pointermove', handlePointerMove);\n window.addEventListener('pointerup', handlePointerUp);\n window.addEventListener('pointercancel', handlePointerUp);\n },\n [cancelProgrammaticSmoothScroll],\n );\n\n const handleTrackPointerDown = useCallback(\n (event: React.PointerEvent<HTMLDivElement>) => {\n const scrollEl = scrollRef.current;\n const thumbEl = thumbRef.current;\n\n if (\n !scrollEl ||\n !thumbEl ||\n event.button !== 0 ||\n event.target !== event.currentTarget\n ) {\n return;\n }\n\n cancelProgrammaticSmoothScroll(scrollEl);\n\n const trackRect = event.currentTarget.getBoundingClientRect();\n const thumbHeight = thumbEl.getBoundingClientRect().height;\n const clickY = event.clientY - trackRect.top;\n const targetThumbTop = Math.max(\n 0,\n Math.min(clickY - thumbHeight / 2, trackRect.height - thumbHeight),\n );\n const maxThumbTop = trackRect.height - thumbHeight;\n const maxScrollTop = scrollEl.scrollHeight - scrollEl.clientHeight;\n\n if (maxThumbTop <= 0 || maxScrollTop <= 0) {\n return;\n }\n\n // `auto` avoids racing with a subsequent thumb drag (smooth scroll would\n // still animate while pointer handlers update `scrollTop`).\n scrollEl.scrollTo({\n top: (targetThumbTop / maxThumbTop) * maxScrollTop,\n behavior: 'auto',\n });\n },\n [cancelProgrammaticSmoothScroll],\n );\n\n return {\n scrollRef,\n trackRef,\n thumbRef,\n hasContentBelow,\n overflows,\n thumb,\n scheduleUpdate,\n handleThumbPointerDown,\n handleTrackPointerDown,\n };\n}\n"],"names":["useRef","useState","useCallback","useEffect","useLayoutEffect"],"mappings":"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"}
@@ -1,2 +1,4 @@
1
1
  export declare const ITEM_TYPE_REGULAR = "regular";
2
2
  export declare const COLLAPSE_ITEM_ID = "collapse-item-id";
3
+ /** Prefix for synthetic CompositeBar row ids for grouped section headers ({@link makeGroupHeaderAsideItem}). */
4
+ export declare const COMPOSITE_BAR_GROUP_HEADER_ID_PREFIX: "__gn-composite-bar__group-header__";
@@ -2,7 +2,10 @@
2
2
 
3
3
  const ITEM_TYPE_REGULAR = 'regular';
4
4
  const COLLAPSE_ITEM_ID = 'collapse-item-id';
5
+ /** Prefix for synthetic CompositeBar row ids for grouped section headers ({@link makeGroupHeaderAsideItem}). */
6
+ const COMPOSITE_BAR_GROUP_HEADER_ID_PREFIX = '__gn-composite-bar__group-header__';
5
7
 
6
8
  exports.COLLAPSE_ITEM_ID = COLLAPSE_ITEM_ID;
9
+ exports.COMPOSITE_BAR_GROUP_HEADER_ID_PREFIX = COMPOSITE_BAR_GROUP_HEADER_ID_PREFIX;
7
10
  exports.ITEM_TYPE_REGULAR = ITEM_TYPE_REGULAR;
8
11
  //# sourceMappingURL=constants.js.map