@gravity-ui/navigation 4.0.17 → 4.0.19

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 (132) hide show
  1. package/build/cjs/components/AsideHeader/AsideHeader.js +2 -2
  2. package/build/cjs/components/AsideHeader/AsideHeader.js.map +1 -1
  3. package/build/cjs/components/AsideHeader/components/CompositeBar/CompositeBar.js +42 -36
  4. package/build/cjs/components/AsideHeader/components/CompositeBar/CompositeBar.js.map +1 -1
  5. package/build/cjs/components/AsideHeader/components/CompositeBar/HighlightedItem/HighlightedItem.js +2 -2
  6. package/build/cjs/components/AsideHeader/components/CompositeBar/HighlightedItem/HighlightedItem.js.map +1 -1
  7. package/build/cjs/components/AsideHeader/components/CompositeBar/MultipleTooltip/MultipleTooltip.js +1 -1
  8. package/build/cjs/components/AsideHeader/components/CompositeBar/MultipleTooltip/MultipleTooltip.js.map +1 -1
  9. package/build/cjs/components/AsideHeader/components/Panels.js +2 -2
  10. package/build/cjs/components/AsideHeader/components/Panels.js.map +1 -1
  11. package/build/cjs/components/Footer/MenuItem/MenuItem.js +2 -2
  12. package/build/cjs/components/Footer/MenuItem/MenuItem.js.map +1 -1
  13. package/build/cjs/components/HotkeysPanel/HotkeysPanel.js +2 -2
  14. package/build/cjs/components/HotkeysPanel/HotkeysPanel.js.map +1 -1
  15. package/build/cjs/components/Logo/Logo.js +2 -2
  16. package/build/cjs/components/Logo/Logo.js.map +1 -1
  17. package/build/cjs/components/MobileHeader/MobileHeader.js +2 -2
  18. package/build/cjs/components/MobileHeader/MobileHeader.js.map +1 -1
  19. package/build/cjs/components/Settings/Settings.js +4 -4
  20. package/build/cjs/components/Settings/Settings.js.map +1 -1
  21. package/build/cjs/components/Settings/SettingsSearch/AllResultsPage.js +2 -2
  22. package/build/cjs/components/Settings/SettingsSearch/AllResultsPage.js.map +1 -1
  23. package/build/cjs/components/Settings/SettingsSearch/SettingsSearch.js +3 -3
  24. package/build/cjs/components/Settings/SettingsSearch/SettingsSearch.js.map +1 -1
  25. package/build/cjs/components/Settings/SettingsSection.js +2 -2
  26. package/build/cjs/components/Settings/SettingsSection.js.map +1 -1
  27. package/build/cjs/components/TopAlert/useTopAlertHeight.js +2 -2
  28. package/build/cjs/components/TopAlert/useTopAlertHeight.js.map +1 -1
  29. package/build/cjs/hooks/useOverflowingHorizontalListItems/useOverflowingHorizontalListItems.js +2 -2
  30. package/build/cjs/hooks/useOverflowingHorizontalListItems/useOverflowingHorizontalListItems.js.map +1 -1
  31. package/build/esm/components/AsideHeader/AsideHeader.js +1 -1
  32. package/build/esm/components/AsideHeader/components/CompositeBar/CompositeBar.js +43 -37
  33. package/build/esm/components/AsideHeader/components/CompositeBar/CompositeBar.js.map +1 -1
  34. package/build/esm/components/AsideHeader/components/CompositeBar/HighlightedItem/HighlightedItem.js +1 -1
  35. package/build/esm/components/AsideHeader/components/CompositeBar/MultipleTooltip/MultipleTooltip.js +1 -1
  36. package/build/esm/components/AsideHeader/components/CompositeBar/MultipleTooltip/MultipleTooltip.js.map +1 -1
  37. package/build/esm/components/AsideHeader/components/Panels.js +1 -1
  38. package/build/esm/components/Footer/MenuItem/MenuItem.js +1 -1
  39. package/build/esm/components/HotkeysPanel/HotkeysPanel.js +1 -1
  40. package/build/esm/components/Logo/Logo.js +1 -1
  41. package/build/esm/components/MobileHeader/MobileHeader.js +1 -1
  42. package/build/esm/components/Settings/Settings.js +2 -2
  43. package/build/esm/components/Settings/SettingsSearch/AllResultsPage.js +1 -1
  44. package/build/esm/components/Settings/SettingsSearch/SettingsSearch.js +1 -1
  45. package/build/esm/components/Settings/SettingsSection.js +1 -1
  46. package/build/esm/components/TopAlert/useTopAlertHeight.js +1 -1
  47. package/build/esm/hooks/useOverflowingHorizontalListItems/useOverflowingHorizontalListItems.js +1 -1
  48. package/package.json +4 -2
  49. package/build/cjs/_virtual/_commonjsHelpers.js +0 -11
  50. package/build/cjs/_virtual/_commonjsHelpers.js.map +0 -1
  51. package/build/cjs/_virtual/debounce.js +0 -12
  52. package/build/cjs/_virtual/debounce.js.map +0 -1
  53. package/build/cjs/_virtual/identity.js +0 -12
  54. package/build/cjs/_virtual/identity.js.map +0 -1
  55. package/build/cjs/_virtual/last.js +0 -12
  56. package/build/cjs/_virtual/last.js.map +0 -1
  57. package/build/cjs/node_modules/lodash/_Symbol.js +0 -21
  58. package/build/cjs/node_modules/lodash/_Symbol.js.map +0 -1
  59. package/build/cjs/node_modules/lodash/_baseGetTag.js +0 -45
  60. package/build/cjs/node_modules/lodash/_baseGetTag.js.map +0 -1
  61. package/build/cjs/node_modules/lodash/_baseTrim.js +0 -34
  62. package/build/cjs/node_modules/lodash/_baseTrim.js.map +0 -1
  63. package/build/cjs/node_modules/lodash/_freeGlobal.js +0 -20
  64. package/build/cjs/node_modules/lodash/_freeGlobal.js.map +0 -1
  65. package/build/cjs/node_modules/lodash/_getRawTag.js +0 -61
  66. package/build/cjs/node_modules/lodash/_getRawTag.js.map +0 -1
  67. package/build/cjs/node_modules/lodash/_objectToString.js +0 -36
  68. package/build/cjs/node_modules/lodash/_objectToString.js.map +0 -1
  69. package/build/cjs/node_modules/lodash/_root.js +0 -24
  70. package/build/cjs/node_modules/lodash/_root.js.map +0 -1
  71. package/build/cjs/node_modules/lodash/_trimmedEndIndex.js +0 -33
  72. package/build/cjs/node_modules/lodash/_trimmedEndIndex.js.map +0 -1
  73. package/build/cjs/node_modules/lodash/debounce.js +0 -208
  74. package/build/cjs/node_modules/lodash/debounce.js.map +0 -1
  75. package/build/cjs/node_modules/lodash/identity.js +0 -35
  76. package/build/cjs/node_modules/lodash/identity.js.map +0 -1
  77. package/build/cjs/node_modules/lodash/isObject.js +0 -45
  78. package/build/cjs/node_modules/lodash/isObject.js.map +0 -1
  79. package/build/cjs/node_modules/lodash/isObjectLike.js +0 -43
  80. package/build/cjs/node_modules/lodash/isObjectLike.js.map +0 -1
  81. package/build/cjs/node_modules/lodash/isSymbol.js +0 -45
  82. package/build/cjs/node_modules/lodash/isSymbol.js.map +0 -1
  83. package/build/cjs/node_modules/lodash/last.js +0 -34
  84. package/build/cjs/node_modules/lodash/last.js.map +0 -1
  85. package/build/cjs/node_modules/lodash/now.js +0 -38
  86. package/build/cjs/node_modules/lodash/now.js.map +0 -1
  87. package/build/cjs/node_modules/lodash/toNumber.js +0 -81
  88. package/build/cjs/node_modules/lodash/toNumber.js.map +0 -1
  89. package/build/cjs/node_modules/tslib/tslib.es6.js +0 -38
  90. package/build/cjs/node_modules/tslib/tslib.es6.js.map +0 -1
  91. package/build/esm/_virtual/_commonjsHelpers.js +0 -8
  92. package/build/esm/_virtual/_commonjsHelpers.js.map +0 -1
  93. package/build/esm/_virtual/debounce.js +0 -8
  94. package/build/esm/_virtual/debounce.js.map +0 -1
  95. package/build/esm/_virtual/identity.js +0 -8
  96. package/build/esm/_virtual/identity.js.map +0 -1
  97. package/build/esm/_virtual/last.js +0 -8
  98. package/build/esm/_virtual/last.js.map +0 -1
  99. package/build/esm/node_modules/lodash/_Symbol.js +0 -19
  100. package/build/esm/node_modules/lodash/_Symbol.js.map +0 -1
  101. package/build/esm/node_modules/lodash/_baseGetTag.js +0 -43
  102. package/build/esm/node_modules/lodash/_baseGetTag.js.map +0 -1
  103. package/build/esm/node_modules/lodash/_baseTrim.js +0 -32
  104. package/build/esm/node_modules/lodash/_baseTrim.js.map +0 -1
  105. package/build/esm/node_modules/lodash/_freeGlobal.js +0 -18
  106. package/build/esm/node_modules/lodash/_freeGlobal.js.map +0 -1
  107. package/build/esm/node_modules/lodash/_getRawTag.js +0 -59
  108. package/build/esm/node_modules/lodash/_getRawTag.js.map +0 -1
  109. package/build/esm/node_modules/lodash/_objectToString.js +0 -34
  110. package/build/esm/node_modules/lodash/_objectToString.js.map +0 -1
  111. package/build/esm/node_modules/lodash/_root.js +0 -22
  112. package/build/esm/node_modules/lodash/_root.js.map +0 -1
  113. package/build/esm/node_modules/lodash/_trimmedEndIndex.js +0 -31
  114. package/build/esm/node_modules/lodash/_trimmedEndIndex.js.map +0 -1
  115. package/build/esm/node_modules/lodash/debounce.js +0 -206
  116. package/build/esm/node_modules/lodash/debounce.js.map +0 -1
  117. package/build/esm/node_modules/lodash/identity.js +0 -33
  118. package/build/esm/node_modules/lodash/identity.js.map +0 -1
  119. package/build/esm/node_modules/lodash/isObject.js +0 -43
  120. package/build/esm/node_modules/lodash/isObject.js.map +0 -1
  121. package/build/esm/node_modules/lodash/isObjectLike.js +0 -41
  122. package/build/esm/node_modules/lodash/isObjectLike.js.map +0 -1
  123. package/build/esm/node_modules/lodash/isSymbol.js +0 -43
  124. package/build/esm/node_modules/lodash/isSymbol.js.map +0 -1
  125. package/build/esm/node_modules/lodash/last.js +0 -32
  126. package/build/esm/node_modules/lodash/last.js.map +0 -1
  127. package/build/esm/node_modules/lodash/now.js +0 -36
  128. package/build/esm/node_modules/lodash/now.js.map +0 -1
  129. package/build/esm/node_modules/lodash/toNumber.js +0 -79
  130. package/build/esm/node_modules/lodash/toNumber.js.map +0 -1
  131. package/build/esm/node_modules/tslib/tslib.es6.js +0 -36
  132. package/build/esm/node_modules/tslib/tslib.es6.js.map +0 -1
@@ -1,13 +1,13 @@
1
1
  import './AsideHeader.css';
2
2
  'use strict';
3
3
 
4
- var tslib_es6 = require('../../node_modules/tslib/tslib.es6.js');
4
+ var tslib = require('tslib');
5
5
  var React = require('react');
6
6
  var PageLayout = require('./components/PageLayout/PageLayout.js');
7
7
  var PageLayoutAside = require('./components/PageLayout/PageLayoutAside.js');
8
8
 
9
9
  const AsideHeader = React.forwardRef((_a, ref) => {
10
- var { compact, className, topAlert } = _a, props = tslib_es6.__rest(_a, ["compact", "className", "topAlert"]);
10
+ var { compact, className, topAlert } = _a, props = tslib.__rest(_a, ["compact", "className", "topAlert"]);
11
11
  return (React.createElement(PageLayout.PageLayout, { compact: compact, className: className, topAlert: topAlert },
12
12
  React.createElement(PageLayoutAside.PageLayoutAside, Object.assign({ ref: ref }, props)),
13
13
  React.createElement(PageLayout.PageLayout.Content, { renderContent: props.renderContent })));
@@ -1 +1 @@
1
- {"version":3,"file":"AsideHeader.js","sources":["../../../../../src/components/AsideHeader/AsideHeader.tsx"],"sourcesContent":["import React from 'react';\n\nimport {PageLayout} from './components/PageLayout/PageLayout';\nimport {PageLayoutAside} from './components/PageLayout/PageLayoutAside';\nimport {AsideHeaderProps} from './types';\n\nexport const AsideHeader = React.forwardRef<HTMLDivElement, AsideHeaderProps>(\n ({compact, className, topAlert, ...props}, ref) => {\n return (\n <PageLayout compact={compact} className={className} topAlert={topAlert}>\n <PageLayoutAside ref={ref} {...props} />\n <PageLayout.Content renderContent={props.renderContent} />\n </PageLayout>\n );\n },\n);\n\nAsideHeader.displayName = 'AsideHeader';\n"],"names":["__rest","PageLayout","PageLayoutAside"],"mappings":";;;;;;;AAMO,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CACvC,CAAC,EAAwC,EAAE,GAAG,KAAI;QAAjD,EAAC,OAAO,EAAE,SAAS,EAAE,QAAQ,OAAW,EAAN,KAAK,GAAvCA,gBAAA,CAAA,EAAA,EAAA,CAAA,SAAA,EAAA,WAAA,EAAA,UAAA,CAAwC,CAAD;AACpC,IAAA,QACI,KAAA,CAAA,aAAA,CAACC,qBAAU,EAAA,EAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAA;AAClE,QAAA,KAAA,CAAA,aAAA,CAACC,+BAAe,EAAC,MAAA,CAAA,MAAA,CAAA,EAAA,GAAG,EAAE,GAAG,EAAA,EAAM,KAAK,CAAI,CAAA;AACxC,QAAA,KAAA,CAAA,aAAA,CAACD,qBAAU,CAAC,OAAO,EAAA,EAAC,aAAa,EAAE,KAAK,CAAC,aAAa,EAAA,CAAI,CACjD;AAErB,CAAC;AAGL,WAAW,CAAC,WAAW,GAAG,aAAa;;;;"}
1
+ {"version":3,"file":"AsideHeader.js","sources":["../../../../../src/components/AsideHeader/AsideHeader.tsx"],"sourcesContent":["import React from 'react';\n\nimport {PageLayout} from './components/PageLayout/PageLayout';\nimport {PageLayoutAside} from './components/PageLayout/PageLayoutAside';\nimport {AsideHeaderProps} from './types';\n\nexport const AsideHeader = React.forwardRef<HTMLDivElement, AsideHeaderProps>(\n ({compact, className, topAlert, ...props}, ref) => {\n return (\n <PageLayout compact={compact} className={className} topAlert={topAlert}>\n <PageLayoutAside ref={ref} {...props} />\n <PageLayout.Content renderContent={props.renderContent} />\n </PageLayout>\n );\n },\n);\n\nAsideHeader.displayName = 'AsideHeader';\n"],"names":["__rest","PageLayout","PageLayoutAside"],"mappings":";;;;;;;AAMO,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CACvC,CAAC,EAAwC,EAAE,GAAG,KAAI;QAAjD,EAAC,OAAO,EAAE,SAAS,EAAE,QAAQ,OAAW,EAAN,KAAK,GAAvCA,YAAA,CAAA,EAAA,EAAA,CAAA,SAAA,EAAA,WAAA,EAAA,UAAA,CAAwC,CAAD;AACpC,IAAA,QACI,KAAA,CAAA,aAAA,CAACC,qBAAU,EAAA,EAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAA;AAClE,QAAA,KAAA,CAAA,aAAA,CAACC,+BAAe,EAAC,MAAA,CAAA,MAAA,CAAA,EAAA,GAAG,EAAE,GAAG,EAAA,EAAM,KAAK,CAAI,CAAA;AACxC,QAAA,KAAA,CAAA,aAAA,CAACD,qBAAU,CAAC,OAAO,EAAA,EAAC,aAAa,EAAE,KAAK,CAAC,aAAa,EAAA,CAAI,CACjD;AAErB,CAAC;AAGL,WAAW,CAAC,WAAW,GAAG,aAAa;;;;"}
@@ -14,10 +14,31 @@ var utils = require('./utils.js');
14
14
  var CompositeBar_module = require('./CompositeBar.module.scss.js');
15
15
 
16
16
  const b = cn.createBlock('composite-bar', CompositeBar_module.default);
17
+ const CompositeBarList = React.memo(function CompositeBarList({ compact, compositeId, collapseItems, items, listRef, multipleTooltip, onItemClickByIndex, onMouseEnterByIndex, onMouseLeave, type, }) {
18
+ return (React.createElement(uikit.List, { id: compositeId, ref: listRef, items: items, selectedItemIndex: type === 'menu' ? utils.getSelectedItemIndex(items) : undefined, itemHeight: utils.getItemHeight, itemsHeight: utils.getItemsHeight, itemClassName: b('root-menu-item'), virtualized: false, filterable: false, sortable: false, renderItem: (item, _isItemActive, itemIndex) => (React.createElement(Item.Item, Object.assign({}, item, { enableTooltip: multipleTooltip ? false : item.enableTooltip, compact: compact, onMouseEnter: onMouseEnterByIndex(itemIndex), onMouseLeave: onMouseLeave, onItemClick: onItemClickByIndex(itemIndex, item.onItemClick), collapseItems: collapseItems }))) }));
19
+ });
17
20
  const CompositeBarView = ({ type, items, onItemClick, onMoreClick, collapseItems, multipleTooltip = false, compact, compositeId, }) => {
18
21
  const ref = React.useRef(null);
19
22
  const tooltipRef = React.useRef(null);
20
23
  const { setValue: setMultipleTooltipContextValue, active: multipleTooltipActive, activeIndex, lastClickedItemIndex, } = React.useContext(MultipleTooltipContext.MultipleTooltipContext);
24
+ const multipleTooltipStateRef = React.useRef({
25
+ active: multipleTooltipActive,
26
+ activeIndex,
27
+ lastClickedItemIndex,
28
+ });
29
+ const onItemClickRef = React.useRef(onItemClick);
30
+ const onMoreClickRef = React.useRef(onMoreClick);
31
+ const setMultipleTooltipContextValueRef = React.useRef(setMultipleTooltipContextValue);
32
+ React.useLayoutEffect(() => {
33
+ multipleTooltipStateRef.current = {
34
+ active: multipleTooltipActive,
35
+ activeIndex,
36
+ lastClickedItemIndex,
37
+ };
38
+ onItemClickRef.current = onItemClick;
39
+ onMoreClickRef.current = onMoreClick;
40
+ setMultipleTooltipContextValueRef.current = setMultipleTooltipContextValue;
41
+ });
21
42
  React.useEffect(() => {
22
43
  function handleBlurWindow() {
23
44
  if (multipleTooltip && multipleTooltipActive) {
@@ -58,76 +79,61 @@ const CompositeBarView = ({ type, items, onItemClick, onMoreClick, collapseItems
58
79
  }, [multipleTooltip, multipleTooltipActive, setMultipleTooltipContextValue]);
59
80
  const onMouseEnterByIndex = React.useCallback((itemIndex) => () => {
60
81
  if (multipleTooltip && document.hasFocus()) {
61
- let multipleTooltipActiveValue = multipleTooltipActive;
62
- if (!multipleTooltipActive && itemIndex !== lastClickedItemIndex) {
63
- multipleTooltipActiveValue = true;
82
+ const { active: multipleTooltipActiveValue, activeIndex: currentActiveIndex, lastClickedItemIndex: currentLastClickedItemIndex, } = multipleTooltipStateRef.current;
83
+ let nextMultipleTooltipActive = multipleTooltipActiveValue;
84
+ if (!multipleTooltipActiveValue && itemIndex !== currentLastClickedItemIndex) {
85
+ nextMultipleTooltipActive = true;
64
86
  }
65
- if (activeIndex === itemIndex &&
66
- multipleTooltipActive === multipleTooltipActiveValue) {
87
+ if (currentActiveIndex === itemIndex &&
88
+ multipleTooltipActiveValue === nextMultipleTooltipActive) {
67
89
  return;
68
90
  }
69
- setMultipleTooltipContextValue({
91
+ setMultipleTooltipContextValueRef.current({
70
92
  activeIndex: itemIndex,
71
- active: multipleTooltipActiveValue,
93
+ active: nextMultipleTooltipActive,
72
94
  });
73
95
  }
74
- }, [
75
- multipleTooltip,
76
- multipleTooltipActive,
77
- lastClickedItemIndex,
78
- activeIndex,
79
- setMultipleTooltipContextValue,
80
- ]);
96
+ }, [multipleTooltip]);
81
97
  const onMouseLeave = React.useCallback(() => {
82
98
  var _a;
83
99
  if (compact && document.hasFocus()) {
84
100
  (_a = ref.current) === null || _a === undefined ? undefined : _a.activateItem(undefined);
101
+ const { activeIndex: currentActiveIndex, lastClickedItemIndex: currentLastClickedItemIndex, } = multipleTooltipStateRef.current;
85
102
  if (multipleTooltip &&
86
- (activeIndex !== undefined || lastClickedItemIndex !== undefined)) {
87
- setMultipleTooltipContextValue({
103
+ (currentActiveIndex !== undefined || currentLastClickedItemIndex !== undefined)) {
104
+ setMultipleTooltipContextValueRef.current({
88
105
  activeIndex: undefined,
89
106
  lastClickedItemIndex: undefined,
90
107
  });
91
108
  }
92
109
  }
93
- }, [
94
- activeIndex,
95
- compact,
96
- lastClickedItemIndex,
97
- multipleTooltip,
98
- setMultipleTooltipContextValue,
99
- ]);
110
+ }, [compact, multipleTooltip]);
100
111
  const onItemClickByIndex = React.useCallback((itemIndex, orginalItemClick) => (item, collapsed, event) => {
112
+ var _a, _b;
113
+ const { lastClickedItemIndex: currentLastClickedItemIndex } = multipleTooltipStateRef.current;
101
114
  if (compact &&
102
115
  multipleTooltip &&
103
- itemIndex !== lastClickedItemIndex &&
116
+ itemIndex !== currentLastClickedItemIndex &&
104
117
  item.id !== constants$1.COLLAPSE_ITEM_ID) {
105
- setMultipleTooltipContextValue({
118
+ setMultipleTooltipContextValueRef.current({
106
119
  lastClickedItemIndex: itemIndex,
107
120
  active: false,
108
121
  });
109
122
  }
110
123
  // Handle clicks on the "more" button (collapse item)
111
124
  if (item.id === constants$1.COLLAPSE_ITEM_ID && collapsed) {
112
- onMoreClick === null || onMoreClick === undefined ? undefined : onMoreClick();
125
+ (_a = onMoreClickRef.current) === null || _a === undefined ? undefined : _a.call(onMoreClickRef);
113
126
  }
114
127
  else {
115
- onItemClick === null || onItemClick === undefined ? undefined : onItemClick(Object.assign(Object.assign({}, item), {
128
+ (_b = onItemClickRef.current) === null || _b === undefined ? undefined : _b.call(onItemClickRef, Object.assign(Object.assign({}, item), {
116
129
  // For collapsed popup items, preserve the item's own onItemClick
117
130
  // since orginalItemClick belongs to the collapse button, not the item
118
131
  onItemClick: collapsed ? item.onItemClick : orginalItemClick }), collapsed, event);
119
132
  }
120
- }, [
121
- compact,
122
- lastClickedItemIndex,
123
- multipleTooltip,
124
- onItemClick,
125
- onMoreClick,
126
- setMultipleTooltipContextValue,
127
- ]);
133
+ }, [compact, multipleTooltip]);
128
134
  return (React.createElement(React.Fragment, null,
129
135
  React.createElement("div", { ref: tooltipRef, onMouseEnter: onTooltipMouseEnter, onMouseLeave: onTooltipMouseLeave },
130
- 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'), virtualized: false, filterable: false, sortable: false, renderItem: (item, _isItemActive, itemIndex) => (React.createElement(Item.Item, Object.assign({}, item, { enableTooltip: multipleTooltip ? false : item.enableTooltip, compact: compact, onMouseEnter: onMouseEnterByIndex(itemIndex), onMouseLeave: onMouseLeave, onItemClick: onItemClickByIndex(itemIndex, item.onItemClick), collapseItems: collapseItems }))) })),
136
+ React.createElement(CompositeBarList, { compositeId: compositeId, type: type, compact: compact, items: items, listRef: ref, multipleTooltip: multipleTooltip, onItemClickByIndex: onItemClickByIndex, onMouseEnterByIndex: onMouseEnterByIndex, onMouseLeave: onMouseLeave, collapseItems: collapseItems })),
131
137
  type === 'menu' && multipleTooltip && (React.createElement(MultipleTooltip.MultipleTooltip, { open: compact && multipleTooltipActive, anchorRef: tooltipRef, placement: ['right-start'], items: items }))));
132
138
  };
133
139
  const CompositeBar = ({ type, items, menuMoreTitle, onItemClick, onMoreClick, multipleTooltip = false, compact, compositeId, }) => {
@@ -1 +1 @@
1
- {"version":3,"file":"CompositeBar.js","sources":["../../../../../../../src/components/AsideHeader/components/CompositeBar/CompositeBar.tsx"],"sourcesContent":["import React, {FC, ReactNode, useCallback, useContext, useRef} from 'react';\n\nimport {List} from '@gravity-ui/uikit';\nimport AutoSizer, {Size} from 'react-virtualized-auto-sizer';\n\nimport {ASIDE_HEADER_COMPACT_WIDTH} from '../../../constants';\nimport {createBlock} from '../../../utils/cn';\nimport {AsideHeaderItem} from '../../types';\n\nimport {Item, ItemProps} from './Item/Item';\nimport {MultipleTooltip, MultipleTooltipContext, MultipleTooltipProvider} from './MultipleTooltip';\nimport {COLLAPSE_ITEM_ID} from './constants';\nimport {\n getAutosizeListItems,\n getItemHeight,\n getItemsHeight,\n getItemsMinHeight,\n getMoreButtonItem,\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 onItemClick?: (\n item: AsideHeaderItem,\n collapsed: boolean,\n event: React.MouseEvent<HTMLElement, MouseEvent>,\n ) => void;\n multipleTooltip?: boolean;\n menuMoreTitle?: string;\n onMoreClick?: () => void;\n compact: boolean;\n compositeId?: string;\n};\n\ntype CompositeBarViewProps = CompositeBarProps & {\n collapseItems?: AsideHeaderItem[];\n};\n\nconst CompositeBarView: FC<CompositeBarViewProps> = ({\n type,\n items,\n onItemClick,\n onMoreClick,\n collapseItems,\n multipleTooltip = false,\n compact,\n compositeId,\n}) => {\n const ref = useRef<List<AsideHeaderItem>>(null);\n const tooltipRef = useRef<HTMLDivElement>(null);\n\n const {\n setValue: setMultipleTooltipContextValue,\n active: multipleTooltipActive,\n activeIndex,\n lastClickedItemIndex,\n } = useContext(MultipleTooltipContext);\n\n React.useEffect(() => {\n function handleBlurWindow() {\n if (multipleTooltip && multipleTooltipActive) {\n setMultipleTooltipContextValue({active: false});\n }\n }\n\n window.addEventListener('blur', handleBlurWindow);\n\n return () => {\n window.removeEventListener('blur', handleBlurWindow);\n };\n }, [multipleTooltip, multipleTooltipActive, setMultipleTooltipContextValue]);\n\n const onTooltipMouseEnter = useCallback(\n (e: {clientX: number}) => {\n if (\n multipleTooltip &&\n compact &&\n !multipleTooltipActive &&\n document.hasFocus() &&\n activeIndex !== lastClickedItemIndex &&\n e.clientX <= ASIDE_HEADER_COMPACT_WIDTH\n ) {\n setMultipleTooltipContextValue?.({\n active: true,\n });\n }\n },\n [\n multipleTooltip,\n compact,\n multipleTooltipActive,\n activeIndex,\n lastClickedItemIndex,\n setMultipleTooltipContextValue,\n ],\n );\n\n const onTooltipMouseLeave = useCallback(() => {\n if (multipleTooltip && multipleTooltipActive && document.hasFocus()) {\n setMultipleTooltipContextValue?.({\n active: false,\n lastClickedItemIndex: undefined,\n });\n }\n }, [multipleTooltip, multipleTooltipActive, setMultipleTooltipContextValue]);\n\n const onMouseEnterByIndex = useCallback(\n (itemIndex: number) => () => {\n if (multipleTooltip && document.hasFocus()) {\n let multipleTooltipActiveValue = multipleTooltipActive;\n if (!multipleTooltipActive && itemIndex !== lastClickedItemIndex) {\n multipleTooltipActiveValue = true;\n }\n if (\n activeIndex === itemIndex &&\n multipleTooltipActive === multipleTooltipActiveValue\n ) {\n return;\n }\n setMultipleTooltipContextValue({\n activeIndex: itemIndex,\n active: multipleTooltipActiveValue,\n });\n }\n },\n [\n multipleTooltip,\n multipleTooltipActive,\n lastClickedItemIndex,\n activeIndex,\n setMultipleTooltipContextValue,\n ],\n );\n\n const onMouseLeave = useCallback(() => {\n if (compact && document.hasFocus()) {\n ref.current?.activateItem(undefined as unknown as number);\n if (\n multipleTooltip &&\n (activeIndex !== undefined || lastClickedItemIndex !== undefined)\n ) {\n setMultipleTooltipContextValue({\n activeIndex: undefined,\n lastClickedItemIndex: undefined,\n });\n }\n }\n }, [\n activeIndex,\n compact,\n lastClickedItemIndex,\n multipleTooltip,\n setMultipleTooltipContextValue,\n ]);\n\n const onItemClickByIndex = useCallback(\n (\n itemIndex: number,\n orginalItemClick: AsideHeaderItem['onItemClick'],\n ): ItemProps['onItemClick'] =>\n (item, collapsed, event) => {\n if (\n compact &&\n multipleTooltip &&\n itemIndex !== lastClickedItemIndex &&\n item.id !== COLLAPSE_ITEM_ID\n ) {\n setMultipleTooltipContextValue({\n lastClickedItemIndex: itemIndex,\n active: false,\n });\n }\n\n // Handle clicks on the \"more\" button (collapse item)\n if (item.id === COLLAPSE_ITEM_ID && collapsed) {\n onMoreClick?.();\n } else {\n onItemClick?.(\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 [\n compact,\n lastClickedItemIndex,\n multipleTooltip,\n onItemClick,\n onMoreClick,\n setMultipleTooltipContextValue,\n ],\n );\n\n return (\n <React.Fragment>\n <div\n ref={tooltipRef}\n onMouseEnter={onTooltipMouseEnter}\n onMouseLeave={onTooltipMouseLeave}\n >\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')}\n virtualized={false}\n filterable={false}\n sortable={false}\n renderItem={(item, _isItemActive, itemIndex) => (\n <Item\n {...item}\n enableTooltip={multipleTooltip ? false : item.enableTooltip}\n compact={compact}\n onMouseEnter={onMouseEnterByIndex(itemIndex)}\n onMouseLeave={onMouseLeave}\n onItemClick={onItemClickByIndex(itemIndex, item.onItemClick)}\n collapseItems={collapseItems}\n />\n )}\n />\n </div>\n {type === 'menu' && multipleTooltip && (\n <MultipleTooltip\n open={compact && multipleTooltipActive}\n anchorRef={tooltipRef}\n placement={['right-start']}\n items={items}\n />\n )}\n </React.Fragment>\n );\n};\n\nexport const CompositeBar: FC<CompositeBarProps> = ({\n type,\n items,\n menuMoreTitle,\n onItemClick,\n onMoreClick,\n multipleTooltip = false,\n compact,\n compositeId,\n}) => {\n if (items.length === 0) {\n return null;\n }\n let node: ReactNode;\n\n if (type === 'menu') {\n const minHeight = getItemsMinHeight(items);\n const collapseItem = getMoreButtonItem(menuMoreTitle);\n node = (\n <div className={b({autosizer: true})} style={{minHeight}}>\n {items.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 items,\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 collapseItems={collapseItems}\n multipleTooltip={multipleTooltip}\n />\n </div>\n );\n }}\n </AutoSizer>\n )}\n </div>\n );\n } else {\n node = (\n <div className={b({subheader: true})}>\n <CompositeBarView\n type=\"subheader\"\n compact={compact}\n items={items}\n onItemClick={onItemClick}\n />\n </div>\n );\n }\n return <MultipleTooltipProvider>{node}</MultipleTooltipProvider>;\n};\n"],"names":["createBlock","styles","useRef","useContext","MultipleTooltipContext","useCallback","ASIDE_HEADER_COMPACT_WIDTH","COLLAPSE_ITEM_ID","List","getSelectedItemIndex","getItemHeight","getItemsHeight","Item","MultipleTooltip","getItemsMinHeight","getMoreButtonItem","getAutosizeListItems","MultipleTooltipProvider"],"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, useContext, useRef} from 'react';\n\nimport {List} from '@gravity-ui/uikit';\nimport AutoSizer, {Size} from 'react-virtualized-auto-sizer';\n\nimport {ASIDE_HEADER_COMPACT_WIDTH} from '../../../constants';\nimport {createBlock} from '../../../utils/cn';\nimport {AsideHeaderItem} from '../../types';\n\nimport {Item, ItemProps} from './Item/Item';\nimport {MultipleTooltip, MultipleTooltipContext, MultipleTooltipProvider} from './MultipleTooltip';\nimport {COLLAPSE_ITEM_ID} from './constants';\nimport {\n getAutosizeListItems,\n getItemHeight,\n getItemsHeight,\n getItemsMinHeight,\n getMoreButtonItem,\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 onItemClick?: (\n item: AsideHeaderItem,\n collapsed: boolean,\n event: React.MouseEvent<HTMLElement, MouseEvent>,\n ) => void;\n multipleTooltip?: boolean;\n menuMoreTitle?: string;\n onMoreClick?: () => void;\n compact: boolean;\n compositeId?: string;\n};\n\ntype CompositeBarViewProps = CompositeBarProps & {\n collapseItems?: AsideHeaderItem[];\n};\n\ntype CompositeBarListProps = {\n compact: boolean;\n compositeId?: string;\n collapseItems?: AsideHeaderItem[];\n items: AsideHeaderItem[];\n listRef: React.RefObject<List<AsideHeaderItem>>;\n multipleTooltip: boolean;\n onItemClickByIndex: (\n itemIndex: number,\n orginalItemClick: AsideHeaderItem['onItemClick'],\n ) => ItemProps['onItemClick'];\n onMouseEnterByIndex: (itemIndex: number) => () => void;\n onMouseLeave: () => void;\n type: CompositeBarProps['type'];\n};\n\nconst CompositeBarList = React.memo(function CompositeBarList({\n compact,\n compositeId,\n collapseItems,\n items,\n listRef,\n multipleTooltip,\n onItemClickByIndex,\n onMouseEnterByIndex,\n onMouseLeave,\n type,\n}: CompositeBarListProps) {\n return (\n <List<AsideHeaderItem>\n id={compositeId}\n ref={listRef}\n items={items}\n selectedItemIndex={type === 'menu' ? getSelectedItemIndex(items) : undefined}\n itemHeight={getItemHeight}\n itemsHeight={getItemsHeight}\n itemClassName={b('root-menu-item')}\n virtualized={false}\n filterable={false}\n sortable={false}\n renderItem={(item, _isItemActive, itemIndex) => (\n <Item\n {...item}\n enableTooltip={multipleTooltip ? false : item.enableTooltip}\n compact={compact}\n onMouseEnter={onMouseEnterByIndex(itemIndex)}\n onMouseLeave={onMouseLeave}\n onItemClick={onItemClickByIndex(itemIndex, item.onItemClick)}\n collapseItems={collapseItems}\n />\n )}\n />\n );\n});\n\nconst CompositeBarView: FC<CompositeBarViewProps> = ({\n type,\n items,\n onItemClick,\n onMoreClick,\n collapseItems,\n multipleTooltip = false,\n compact,\n compositeId,\n}) => {\n const ref = useRef<List<AsideHeaderItem>>(null);\n const tooltipRef = useRef<HTMLDivElement>(null);\n\n const {\n setValue: setMultipleTooltipContextValue,\n active: multipleTooltipActive,\n activeIndex,\n lastClickedItemIndex,\n } = useContext(MultipleTooltipContext);\n const multipleTooltipStateRef = useRef({\n active: multipleTooltipActive,\n activeIndex,\n lastClickedItemIndex,\n });\n const onItemClickRef = useRef(onItemClick);\n const onMoreClickRef = useRef(onMoreClick);\n const setMultipleTooltipContextValueRef = useRef(setMultipleTooltipContextValue);\n\n React.useLayoutEffect(() => {\n multipleTooltipStateRef.current = {\n active: multipleTooltipActive,\n activeIndex,\n lastClickedItemIndex,\n };\n onItemClickRef.current = onItemClick;\n onMoreClickRef.current = onMoreClick;\n setMultipleTooltipContextValueRef.current = setMultipleTooltipContextValue;\n });\n\n React.useEffect(() => {\n function handleBlurWindow() {\n if (multipleTooltip && multipleTooltipActive) {\n setMultipleTooltipContextValue({active: false});\n }\n }\n\n window.addEventListener('blur', handleBlurWindow);\n\n return () => {\n window.removeEventListener('blur', handleBlurWindow);\n };\n }, [multipleTooltip, multipleTooltipActive, setMultipleTooltipContextValue]);\n\n const onTooltipMouseEnter = useCallback(\n (e: {clientX: number}) => {\n if (\n multipleTooltip &&\n compact &&\n !multipleTooltipActive &&\n document.hasFocus() &&\n activeIndex !== lastClickedItemIndex &&\n e.clientX <= ASIDE_HEADER_COMPACT_WIDTH\n ) {\n setMultipleTooltipContextValue?.({\n active: true,\n });\n }\n },\n [\n multipleTooltip,\n compact,\n multipleTooltipActive,\n activeIndex,\n lastClickedItemIndex,\n setMultipleTooltipContextValue,\n ],\n );\n\n const onTooltipMouseLeave = useCallback(() => {\n if (multipleTooltip && multipleTooltipActive && document.hasFocus()) {\n setMultipleTooltipContextValue?.({\n active: false,\n lastClickedItemIndex: undefined,\n });\n }\n }, [multipleTooltip, multipleTooltipActive, setMultipleTooltipContextValue]);\n\n const onMouseEnterByIndex = useCallback(\n (itemIndex: number) => () => {\n if (multipleTooltip && document.hasFocus()) {\n const {\n active: multipleTooltipActiveValue,\n activeIndex: currentActiveIndex,\n lastClickedItemIndex: currentLastClickedItemIndex,\n } = multipleTooltipStateRef.current;\n let nextMultipleTooltipActive = multipleTooltipActiveValue;\n if (!multipleTooltipActiveValue && itemIndex !== currentLastClickedItemIndex) {\n nextMultipleTooltipActive = true;\n }\n if (\n currentActiveIndex === itemIndex &&\n multipleTooltipActiveValue === nextMultipleTooltipActive\n ) {\n return;\n }\n setMultipleTooltipContextValueRef.current({\n activeIndex: itemIndex,\n active: nextMultipleTooltipActive,\n });\n }\n },\n [multipleTooltip],\n );\n\n const onMouseLeave = useCallback(() => {\n if (compact && document.hasFocus()) {\n ref.current?.activateItem(undefined as unknown as number);\n const {\n activeIndex: currentActiveIndex,\n lastClickedItemIndex: currentLastClickedItemIndex,\n } = multipleTooltipStateRef.current;\n if (\n multipleTooltip &&\n (currentActiveIndex !== undefined || currentLastClickedItemIndex !== undefined)\n ) {\n setMultipleTooltipContextValueRef.current({\n activeIndex: undefined,\n lastClickedItemIndex: undefined,\n });\n }\n }\n }, [compact, multipleTooltip]);\n\n const onItemClickByIndex = useCallback(\n (\n itemIndex: number,\n orginalItemClick: AsideHeaderItem['onItemClick'],\n ): ItemProps['onItemClick'] =>\n (item, collapsed, event) => {\n const {lastClickedItemIndex: currentLastClickedItemIndex} =\n multipleTooltipStateRef.current;\n if (\n compact &&\n multipleTooltip &&\n itemIndex !== currentLastClickedItemIndex &&\n item.id !== COLLAPSE_ITEM_ID\n ) {\n setMultipleTooltipContextValueRef.current({\n lastClickedItemIndex: itemIndex,\n active: false,\n });\n }\n\n // Handle clicks on the \"more\" button (collapse item)\n if (item.id === COLLAPSE_ITEM_ID && collapsed) {\n onMoreClickRef.current?.();\n } else {\n onItemClickRef.current?.(\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 [compact, multipleTooltip],\n );\n\n return (\n <React.Fragment>\n <div\n ref={tooltipRef}\n onMouseEnter={onTooltipMouseEnter}\n onMouseLeave={onTooltipMouseLeave}\n >\n <CompositeBarList\n compositeId={compositeId}\n type={type}\n compact={compact}\n items={items}\n listRef={ref}\n multipleTooltip={multipleTooltip}\n onItemClickByIndex={onItemClickByIndex}\n onMouseEnterByIndex={onMouseEnterByIndex}\n onMouseLeave={onMouseLeave}\n collapseItems={collapseItems}\n />\n </div>\n {type === 'menu' && multipleTooltip && (\n <MultipleTooltip\n open={compact && multipleTooltipActive}\n anchorRef={tooltipRef}\n placement={['right-start']}\n items={items}\n />\n )}\n </React.Fragment>\n );\n};\n\nexport const CompositeBar: FC<CompositeBarProps> = ({\n type,\n items,\n menuMoreTitle,\n onItemClick,\n onMoreClick,\n multipleTooltip = false,\n compact,\n compositeId,\n}) => {\n if (items.length === 0) {\n return null;\n }\n let node: ReactNode;\n\n if (type === 'menu') {\n const minHeight = getItemsMinHeight(items);\n const collapseItem = getMoreButtonItem(menuMoreTitle);\n node = (\n <div className={b({autosizer: true})} style={{minHeight}}>\n {items.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 items,\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 collapseItems={collapseItems}\n multipleTooltip={multipleTooltip}\n />\n </div>\n );\n }}\n </AutoSizer>\n )}\n </div>\n );\n } else {\n node = (\n <div className={b({subheader: true})}>\n <CompositeBarView\n type=\"subheader\"\n compact={compact}\n items={items}\n onItemClick={onItemClick}\n />\n </div>\n );\n }\n return <MultipleTooltipProvider>{node}</MultipleTooltipProvider>;\n};\n"],"names":["createBlock","styles","List","getSelectedItemIndex","getItemHeight","getItemsHeight","Item","useRef","useContext","MultipleTooltipContext","useCallback","ASIDE_HEADER_COMPACT_WIDTH","COLLAPSE_ITEM_ID","MultipleTooltip","getItemsMinHeight","getMoreButtonItem","getAutosizeListItems","MultipleTooltipProvider"],"mappings":"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"}
@@ -3,7 +3,7 @@ import './HighlightedItem.css';
3
3
 
4
4
  var React = require('react');
5
5
  var uikit = require('@gravity-ui/uikit');
6
- var debounce = require('../../../../../_virtual/debounce.js');
6
+ var debounceFn = require('lodash/debounce');
7
7
  var cn = require('../../../../utils/cn.js');
8
8
  var AsideHeaderContext = require('../../../AsideHeaderContext.js');
9
9
  var HighlightedItem_module = require('./HighlightedItem.module.scss.js');
@@ -20,7 +20,7 @@ const HighlightedItem = ({ iconRef, iconNode, onClick, onClickCapture, }) => {
20
20
  height: 0,
21
21
  });
22
22
  const [isModalOpen, setIsModalOpen] = React.useState(false);
23
- const handleResizeDebounced = React.useMemo(() => debounce.default(() => {
23
+ const handleResizeDebounced = React.useMemo(() => debounceFn(() => {
24
24
  var _a;
25
25
  const { top = 0, left = 0, width = 0, height = 0, } = ((_a = iconRef === null || iconRef === undefined ? undefined : iconRef.current) === null || _a === undefined ? undefined : _a.getBoundingClientRect()) || {};
26
26
  setPosition({
@@ -1 +1 @@
1
- {"version":3,"file":"HighlightedItem.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/HighlightedItem/HighlightedItem.tsx"],"sourcesContent":["import React, {useCallback, useEffect, useMemo, useState} from 'react';\n\nimport {Portal} from '@gravity-ui/uikit';\nimport debounceFn from 'lodash/debounce';\n\nimport {block, createBlock} from '../../../../utils/cn';\nimport {useAsideHeaderInnerContext} from '../../../AsideHeaderContext';\n\nimport styles from './HighlightedItem.module.scss';\n\nconst b = createBlock('composite-bar-highlighted-item', styles);\nconst bGlobal = block('composite-bar-highlighted-item');\n\ninterface ItemInnerProps {\n iconRef: React.RefObject<HTMLDivElement>;\n iconNode: React.ReactNode;\n onClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;\n onClickCapture?: (event: React.SyntheticEvent) => void;\n}\n\nconst DEBOUNCE_TIME = 200;\n\nexport const HighlightedItem: React.FC<ItemInnerProps> = ({\n iconRef,\n iconNode,\n onClick,\n onClickCapture,\n}: ItemInnerProps) => {\n const {openModalSubscriber} = useAsideHeaderInnerContext();\n const [position, setPosition] = useState({\n top: 0,\n left: 0,\n width: 0,\n height: 0,\n });\n const [isModalOpen, setIsModalOpen] = useState<boolean>(false);\n\n const handleResizeDebounced = useMemo(\n () =>\n debounceFn(\n () => {\n const {\n top = 0,\n left = 0,\n width = 0,\n height = 0,\n } = iconRef?.current?.getBoundingClientRect() || {};\n\n setPosition({\n top: top + window.scrollY,\n left: left + window.scrollX,\n width,\n height,\n });\n },\n DEBOUNCE_TIME,\n {leading: true},\n ),\n [iconRef],\n );\n\n const handleResize = useCallback(() => handleResizeDebounced(), [handleResizeDebounced]);\n\n useEffect(() => {\n if (!isModalOpen) {\n return undefined;\n }\n\n handleResize();\n\n window.addEventListener('resize', handleResize);\n\n return () => {\n window.removeEventListener('resize', handleResize);\n };\n }, [handleResize, isModalOpen]);\n\n openModalSubscriber?.((open: boolean) => {\n setIsModalOpen(open);\n });\n\n if (!iconNode || !isModalOpen) {\n return null;\n }\n\n return (\n <Portal>\n <div\n className={`${b()} ${bGlobal()}`}\n style={position}\n onClick={onClick}\n onClickCapture={onClickCapture}\n data-toast\n >\n <div className={b('icon')}>{iconNode}</div>\n </div>\n </Portal>\n );\n};\n\nHighlightedItem.displayName = 'HighlightedItem';\n"],"names":["createBlock","styles","block","useAsideHeaderInnerContext","useState","useMemo","debounceFn","useCallback","useEffect","Portal"],"mappings":";;;;;;;;;AAUA,MAAM,CAAC,GAAGA,cAAW,CAAC,gCAAgC,EAAEC,8BAAM,CAAC;AAC/D,MAAM,OAAO,GAAGC,QAAK,CAAC,gCAAgC,CAAC;AASvD,MAAM,aAAa,GAAG,GAAG;AAElB,MAAM,eAAe,GAA6B,CAAC,EACtD,OAAO,EACP,QAAQ,EACR,OAAO,EACP,cAAc,GACD,KAAI;AACjB,IAAA,MAAM,EAAC,mBAAmB,EAAC,GAAGC,6CAA0B,EAAE;AAC1D,IAAA,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAGC,cAAQ,CAAC;AACrC,QAAA,GAAG,EAAE,CAAC;AACN,QAAA,IAAI,EAAE,CAAC;AACP,QAAA,KAAK,EAAE,CAAC;AACR,QAAA,MAAM,EAAE,CAAC;AACZ,KAAA,CAAC;IACF,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAGA,cAAQ,CAAU,KAAK,CAAC;IAE9D,MAAM,qBAAqB,GAAGC,aAAO,CACjC,MACIC,gBAAU,CACN,MAAK;;AACD,QAAA,MAAM,EACF,GAAG,GAAG,CAAC,EACP,IAAI,GAAG,CAAC,EACR,KAAK,GAAG,CAAC,EACT,MAAM,GAAG,CAAC,GACb,GAAG,CAAA,CAAA,EAAA,GAAA,OAAO,KAAA,IAAA,IAAP,OAAO,KAAP,SAAA,GAAA,SAAA,GAAA,OAAO,CAAE,OAAO,MAAE,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAA,qBAAqB,EAAE,KAAI,EAAE;AAEnD,QAAA,WAAW,CAAC;AACR,YAAA,GAAG,EAAE,GAAG,GAAG,MAAM,CAAC,OAAO;AACzB,YAAA,IAAI,EAAE,IAAI,GAAG,MAAM,CAAC,OAAO;YAC3B,KAAK;YACL,MAAM;AACT,SAAA,CAAC;AACN,KAAC,EACD,aAAa,EACb,EAAC,OAAO,EAAE,IAAI,EAAC,CAClB,EACL,CAAC,OAAO,CAAC,CACZ;AAED,IAAA,MAAM,YAAY,GAAGC,iBAAW,CAAC,MAAM,qBAAqB,EAAE,EAAE,CAAC,qBAAqB,CAAC,CAAC;IAExFC,eAAS,CAAC,MAAK;QACX,IAAI,CAAC,WAAW,EAAE;AACd,YAAA,OAAO,SAAS;;AAGpB,QAAA,YAAY,EAAE;AAEd,QAAA,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,CAAC;AAE/C,QAAA,OAAO,MAAK;AACR,YAAA,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,YAAY,CAAC;AACtD,SAAC;AACL,KAAC,EAAE,CAAC,YAAY,EAAE,WAAW,CAAC,CAAC;IAE/B,mBAAmB,KAAA,IAAA,IAAnB,mBAAmB,KAAnB,SAAA,GAAA,SAAA,GAAA,mBAAmB,CAAG,CAAC,IAAa,KAAI;QACpC,cAAc,CAAC,IAAI,CAAC;AACxB,KAAC,CAAC;AAEF,IAAA,IAAI,CAAC,QAAQ,IAAI,CAAC,WAAW,EAAE;AAC3B,QAAA,OAAO,IAAI;;IAGf,QACI,oBAACC,YAAM,EAAA,IAAA;QACH,KACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAG,EAAA,CAAC,EAAE,CAAI,CAAA,EAAA,OAAO,EAAE,CAAE,CAAA,EAChC,KAAK,EAAE,QAAQ,EACf,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,EAAA,YAAA,EAAA,IAAA,EAAA;AAG9B,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAG,EAAA,QAAQ,CAAO,CACzC,CACD;AAEjB;AAEA,eAAe,CAAC,WAAW,GAAG,iBAAiB;;;;"}
1
+ {"version":3,"file":"HighlightedItem.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/HighlightedItem/HighlightedItem.tsx"],"sourcesContent":["import React, {useCallback, useEffect, useMemo, useState} from 'react';\n\nimport {Portal} from '@gravity-ui/uikit';\nimport debounceFn from 'lodash/debounce';\n\nimport {block, createBlock} from '../../../../utils/cn';\nimport {useAsideHeaderInnerContext} from '../../../AsideHeaderContext';\n\nimport styles from './HighlightedItem.module.scss';\n\nconst b = createBlock('composite-bar-highlighted-item', styles);\nconst bGlobal = block('composite-bar-highlighted-item');\n\ninterface ItemInnerProps {\n iconRef: React.RefObject<HTMLDivElement>;\n iconNode: React.ReactNode;\n onClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;\n onClickCapture?: (event: React.SyntheticEvent) => void;\n}\n\nconst DEBOUNCE_TIME = 200;\n\nexport const HighlightedItem: React.FC<ItemInnerProps> = ({\n iconRef,\n iconNode,\n onClick,\n onClickCapture,\n}: ItemInnerProps) => {\n const {openModalSubscriber} = useAsideHeaderInnerContext();\n const [position, setPosition] = useState({\n top: 0,\n left: 0,\n width: 0,\n height: 0,\n });\n const [isModalOpen, setIsModalOpen] = useState<boolean>(false);\n\n const handleResizeDebounced = useMemo(\n () =>\n debounceFn(\n () => {\n const {\n top = 0,\n left = 0,\n width = 0,\n height = 0,\n } = iconRef?.current?.getBoundingClientRect() || {};\n\n setPosition({\n top: top + window.scrollY,\n left: left + window.scrollX,\n width,\n height,\n });\n },\n DEBOUNCE_TIME,\n {leading: true},\n ),\n [iconRef],\n );\n\n const handleResize = useCallback(() => handleResizeDebounced(), [handleResizeDebounced]);\n\n useEffect(() => {\n if (!isModalOpen) {\n return undefined;\n }\n\n handleResize();\n\n window.addEventListener('resize', handleResize);\n\n return () => {\n window.removeEventListener('resize', handleResize);\n };\n }, [handleResize, isModalOpen]);\n\n openModalSubscriber?.((open: boolean) => {\n setIsModalOpen(open);\n });\n\n if (!iconNode || !isModalOpen) {\n return null;\n }\n\n return (\n <Portal>\n <div\n className={`${b()} ${bGlobal()}`}\n style={position}\n onClick={onClick}\n onClickCapture={onClickCapture}\n data-toast\n >\n <div className={b('icon')}>{iconNode}</div>\n </div>\n </Portal>\n );\n};\n\nHighlightedItem.displayName = 'HighlightedItem';\n"],"names":["createBlock","styles","block","useAsideHeaderInnerContext","useState","useMemo","useCallback","useEffect","Portal"],"mappings":";;;;;;;;;AAUA,MAAM,CAAC,GAAGA,cAAW,CAAC,gCAAgC,EAAEC,8BAAM,CAAC;AAC/D,MAAM,OAAO,GAAGC,QAAK,CAAC,gCAAgC,CAAC;AASvD,MAAM,aAAa,GAAG,GAAG;AAElB,MAAM,eAAe,GAA6B,CAAC,EACtD,OAAO,EACP,QAAQ,EACR,OAAO,EACP,cAAc,GACD,KAAI;AACjB,IAAA,MAAM,EAAC,mBAAmB,EAAC,GAAGC,6CAA0B,EAAE;AAC1D,IAAA,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAGC,cAAQ,CAAC;AACrC,QAAA,GAAG,EAAE,CAAC;AACN,QAAA,IAAI,EAAE,CAAC;AACP,QAAA,KAAK,EAAE,CAAC;AACR,QAAA,MAAM,EAAE,CAAC;AACZ,KAAA,CAAC;IACF,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAGA,cAAQ,CAAU,KAAK,CAAC;IAE9D,MAAM,qBAAqB,GAAGC,aAAO,CACjC,MACI,UAAU,CACN,MAAK;;AACD,QAAA,MAAM,EACF,GAAG,GAAG,CAAC,EACP,IAAI,GAAG,CAAC,EACR,KAAK,GAAG,CAAC,EACT,MAAM,GAAG,CAAC,GACb,GAAG,CAAA,CAAA,EAAA,GAAA,OAAO,KAAA,IAAA,IAAP,OAAO,KAAP,SAAA,GAAA,SAAA,GAAA,OAAO,CAAE,OAAO,MAAE,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAA,qBAAqB,EAAE,KAAI,EAAE;AAEnD,QAAA,WAAW,CAAC;AACR,YAAA,GAAG,EAAE,GAAG,GAAG,MAAM,CAAC,OAAO;AACzB,YAAA,IAAI,EAAE,IAAI,GAAG,MAAM,CAAC,OAAO;YAC3B,KAAK;YACL,MAAM;AACT,SAAA,CAAC;AACN,KAAC,EACD,aAAa,EACb,EAAC,OAAO,EAAE,IAAI,EAAC,CAClB,EACL,CAAC,OAAO,CAAC,CACZ;AAED,IAAA,MAAM,YAAY,GAAGC,iBAAW,CAAC,MAAM,qBAAqB,EAAE,EAAE,CAAC,qBAAqB,CAAC,CAAC;IAExFC,eAAS,CAAC,MAAK;QACX,IAAI,CAAC,WAAW,EAAE;AACd,YAAA,OAAO,SAAS;;AAGpB,QAAA,YAAY,EAAE;AAEd,QAAA,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,CAAC;AAE/C,QAAA,OAAO,MAAK;AACR,YAAA,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,YAAY,CAAC;AACtD,SAAC;AACL,KAAC,EAAE,CAAC,YAAY,EAAE,WAAW,CAAC,CAAC;IAE/B,mBAAmB,KAAA,IAAA,IAAnB,mBAAmB,KAAnB,SAAA,GAAA,SAAA,GAAA,mBAAmB,CAAG,CAAC,IAAa,KAAI;QACpC,cAAc,CAAC,IAAI,CAAC;AACxB,KAAC,CAAC;AAEF,IAAA,IAAI,CAAC,QAAQ,IAAI,CAAC,WAAW,EAAE;AAC3B,QAAA,OAAO,IAAI;;IAGf,QACI,oBAACC,YAAM,EAAA,IAAA;QACH,KACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAG,EAAA,CAAC,EAAE,CAAI,CAAA,EAAA,OAAO,EAAE,CAAE,CAAA,EAChC,KAAK,EAAE,QAAQ,EACf,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,EAAA,YAAA,EAAA,IAAA,EAAA;AAG9B,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAG,EAAA,QAAQ,CAAO,CACzC,CACD;AAEjB;AAEA,eAAe,CAAC,WAAW,GAAG,iBAAiB;;;;"}
@@ -13,7 +13,7 @@ const POPUP_OFFSET = { mainAxis: 4, crossAxis: -32 };
13
13
  const MultipleTooltip = ({ items, open, anchorRef, placement, }) => {
14
14
  const { activeIndex, hideCollapseItemTooltip } = React.useContext(MultipleTooltipContext.MultipleTooltipContext);
15
15
  const activeItem = activeIndex === undefined ? null : items[activeIndex];
16
- return (React.createElement(uikit.Popup, { open: open, className: b('popup'), anchorElement: anchorRef.current, strategy: "fixed", placement: placement, offset: POPUP_OFFSET },
16
+ return (React.createElement(uikit.Popup, { open: open, className: b('popup'), anchorElement: anchorRef.current, strategy: "fixed", placement: placement, offset: POPUP_OFFSET, returnFocus: false },
17
17
  React.createElement("div", { className: b() },
18
18
  React.createElement("div", { className: b('items-container') }, items
19
19
  .filter(({ type = 'regular', id }) => !hideCollapseItemTooltip ||
@@ -1 +1 @@
1
- {"version":3,"file":"MultipleTooltip.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/MultipleTooltip/MultipleTooltip.tsx"],"sourcesContent":["import React from 'react';\n\nimport {Popup, PopupProps} from '@gravity-ui/uikit';\n\nimport {AsideHeaderItem} from 'src/components/AsideHeader/types';\n\nimport {createBlock} from '../../../../utils/cn';\nimport {COLLAPSE_ITEM_ID} from '../constants';\n\nimport {MultipleTooltipContext} from './MultipleTooltipContext';\n\nimport styles from './MultipleTooltip.module.scss';\n\nconst b = createBlock('multiple-tooltip', styles);\n\nconst POPUP_OFFSET: PopupProps['offset'] = {mainAxis: 4, crossAxis: -32};\n\ntype MultipleTooltipProps = Pick<PopupProps, 'open' | 'placement'> & {\n anchorRef: React.RefObject<HTMLElement>;\n items: AsideHeaderItem[];\n};\n\nexport const MultipleTooltip: React.FC<MultipleTooltipProps> = ({\n items,\n open,\n anchorRef,\n placement,\n}) => {\n const {activeIndex, hideCollapseItemTooltip} = React.useContext(MultipleTooltipContext);\n const activeItem = activeIndex === undefined ? null : items[activeIndex];\n\n return (\n <Popup\n open={open}\n className={b('popup')}\n anchorElement={anchorRef.current}\n strategy=\"fixed\"\n placement={placement}\n offset={POPUP_OFFSET}\n >\n <div className={b()}>\n <div className={b('items-container')}>\n {items\n .filter(\n ({type = 'regular', id}) =>\n !hideCollapseItemTooltip ||\n (id !== COLLAPSE_ITEM_ID && type !== 'action'),\n )\n .map((currentItem, idx) => {\n switch (currentItem.type) {\n case 'divider':\n return (\n <div className={b('item', {divider: true})} key={idx}>\n {currentItem.tooltipText || currentItem.title}\n </div>\n );\n default:\n return (\n <div\n className={b('item', {\n active: currentItem === activeItem,\n })}\n key={idx}\n >\n {currentItem.tooltipText || currentItem.title}\n </div>\n );\n }\n })}\n </div>\n </div>\n </Popup>\n );\n};\n"],"names":["createBlock","styles","MultipleTooltipContext","Popup","COLLAPSE_ITEM_ID"],"mappings":";;;;;;;;;AAaA,MAAM,CAAC,GAAGA,cAAW,CAAC,kBAAkB,EAAEC,8BAAM,CAAC;AAEjD,MAAM,YAAY,GAAyB,EAAC,QAAQ,EAAE,CAAC,EAAE,SAAS,EAAE,GAAG,EAAC;AAOjE,MAAM,eAAe,GAAmC,CAAC,EAC5D,KAAK,EACL,IAAI,EACJ,SAAS,EACT,SAAS,GACZ,KAAI;AACD,IAAA,MAAM,EAAC,WAAW,EAAE,uBAAuB,EAAC,GAAG,KAAK,CAAC,UAAU,CAACC,6CAAsB,CAAC;AACvF,IAAA,MAAM,UAAU,GAAG,WAAW,KAAK,SAAS,GAAG,IAAI,GAAG,KAAK,CAAC,WAAW,CAAC;AAExE,IAAA,QACI,KAAA,CAAA,aAAA,CAACC,WAAK,EAAA,EACF,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,EACrB,aAAa,EAAE,SAAS,CAAC,OAAO,EAChC,QAAQ,EAAC,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,YAAY,EAAA;QAEpB,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,EAAE,EAAA;AACf,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,IAC/B;AACI,iBAAA,MAAM,CACH,CAAC,EAAC,IAAI,GAAG,SAAS,EAAE,EAAE,EAAC,KACnB,CAAC,uBAAuB;iBACvB,EAAE,KAAKC,0BAAgB,IAAI,IAAI,KAAK,QAAQ,CAAC;AAErD,iBAAA,GAAG,CAAC,CAAC,WAAW,EAAE,GAAG,KAAI;AACtB,gBAAA,QAAQ,WAAW,CAAC,IAAI;AACpB,oBAAA,KAAK,SAAS;AACV,wBAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,EAAE,GAAG,EAAE,GAAG,EAC/C,EAAA,WAAW,CAAC,WAAW,IAAI,WAAW,CAAC,KAAK,CAC3C;AAEd,oBAAA;AACI,wBAAA,QACI,KACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE;gCACjB,MAAM,EAAE,WAAW,KAAK,UAAU;AACrC,6BAAA,CAAC,EACF,GAAG,EAAE,GAAG,IAEP,WAAW,CAAC,WAAW,IAAI,WAAW,CAAC,KAAK,CAC3C;;AAGtB,aAAC,CAAC,CACJ,CACJ,CACF;AAEhB;;;;"}
1
+ {"version":3,"file":"MultipleTooltip.js","sources":["../../../../../../../../src/components/AsideHeader/components/CompositeBar/MultipleTooltip/MultipleTooltip.tsx"],"sourcesContent":["import React from 'react';\n\nimport {Popup, PopupProps} from '@gravity-ui/uikit';\n\nimport {AsideHeaderItem} from 'src/components/AsideHeader/types';\n\nimport {createBlock} from '../../../../utils/cn';\nimport {COLLAPSE_ITEM_ID} from '../constants';\n\nimport {MultipleTooltipContext} from './MultipleTooltipContext';\n\nimport styles from './MultipleTooltip.module.scss';\n\nconst b = createBlock('multiple-tooltip', styles);\n\nconst POPUP_OFFSET: PopupProps['offset'] = {mainAxis: 4, crossAxis: -32};\n\ntype MultipleTooltipProps = Pick<PopupProps, 'open' | 'placement'> & {\n anchorRef: React.RefObject<HTMLElement>;\n items: AsideHeaderItem[];\n};\n\nexport const MultipleTooltip: React.FC<MultipleTooltipProps> = ({\n items,\n open,\n anchorRef,\n placement,\n}) => {\n const {activeIndex, hideCollapseItemTooltip} = React.useContext(MultipleTooltipContext);\n const activeItem = activeIndex === undefined ? null : items[activeIndex];\n\n return (\n <Popup\n open={open}\n className={b('popup')}\n anchorElement={anchorRef.current}\n strategy=\"fixed\"\n placement={placement}\n offset={POPUP_OFFSET}\n returnFocus={false}\n >\n <div className={b()}>\n <div className={b('items-container')}>\n {items\n .filter(\n ({type = 'regular', id}) =>\n !hideCollapseItemTooltip ||\n (id !== COLLAPSE_ITEM_ID && type !== 'action'),\n )\n .map((currentItem, idx) => {\n switch (currentItem.type) {\n case 'divider':\n return (\n <div className={b('item', {divider: true})} key={idx}>\n {currentItem.tooltipText || currentItem.title}\n </div>\n );\n default:\n return (\n <div\n className={b('item', {\n active: currentItem === activeItem,\n })}\n key={idx}\n >\n {currentItem.tooltipText || currentItem.title}\n </div>\n );\n }\n })}\n </div>\n </div>\n </Popup>\n );\n};\n"],"names":["createBlock","styles","MultipleTooltipContext","Popup","COLLAPSE_ITEM_ID"],"mappings":";;;;;;;;;AAaA,MAAM,CAAC,GAAGA,cAAW,CAAC,kBAAkB,EAAEC,8BAAM,CAAC;AAEjD,MAAM,YAAY,GAAyB,EAAC,QAAQ,EAAE,CAAC,EAAE,SAAS,EAAE,GAAG,EAAC;AAOjE,MAAM,eAAe,GAAmC,CAAC,EAC5D,KAAK,EACL,IAAI,EACJ,SAAS,EACT,SAAS,GACZ,KAAI;AACD,IAAA,MAAM,EAAC,WAAW,EAAE,uBAAuB,EAAC,GAAG,KAAK,CAAC,UAAU,CAACC,6CAAsB,CAAC;AACvF,IAAA,MAAM,UAAU,GAAG,WAAW,KAAK,SAAS,GAAG,IAAI,GAAG,KAAK,CAAC,WAAW,CAAC;AAExE,IAAA,QACI,KAAA,CAAA,aAAA,CAACC,WAAK,EAAA,EACF,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,EACrB,aAAa,EAAE,SAAS,CAAC,OAAO,EAChC,QAAQ,EAAC,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,YAAY,EACpB,WAAW,EAAE,KAAK,EAAA;QAElB,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,EAAE,EAAA;AACf,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,IAC/B;AACI,iBAAA,MAAM,CACH,CAAC,EAAC,IAAI,GAAG,SAAS,EAAE,EAAE,EAAC,KACnB,CAAC,uBAAuB;iBACvB,EAAE,KAAKC,0BAAgB,IAAI,IAAI,KAAK,QAAQ,CAAC;AAErD,iBAAA,GAAG,CAAC,CAAC,WAAW,EAAE,GAAG,KAAI;AACtB,gBAAA,QAAQ,WAAW,CAAC,IAAI;AACpB,oBAAA,KAAK,SAAS;AACV,wBAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,EAAE,GAAG,EAAE,GAAG,EAC/C,EAAA,WAAW,CAAC,WAAW,IAAI,WAAW,CAAC,KAAK,CAC3C;AAEd,oBAAA;AACI,wBAAA,QACI,KACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE;gCACjB,MAAM,EAAE,WAAW,KAAK,UAAU;AACrC,6BAAA,CAAC,EACF,GAAG,EAAE,GAAG,IAEP,WAAW,CAAC,WAAW,IAAI,WAAW,CAAC,KAAK,CAC3C;;AAGtB,aAAC,CAAC,CACJ,CACJ,CACF;AAEhB;;;;"}
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var tslib_es6 = require('../../../node_modules/tslib/tslib.es6.js');
3
+ var tslib = require('tslib');
4
4
  var React = require('react');
5
5
  var uikit = require('@gravity-ui/uikit');
6
6
  var AsideHeaderContext = require('../AsideHeaderContext.js');
@@ -9,7 +9,7 @@ var utils = require('../utils.js');
9
9
  const Panels = () => {
10
10
  const { panelItems, onClosePanel, size } = AsideHeaderContext.useAsideHeaderInnerContext();
11
11
  return panelItems ? (React.createElement(React.Fragment, null, panelItems.map((_a) => {
12
- var { id, className, style: itemStyle } = _a, rest = tslib_es6.__rest(_a, ["id", "className", "style"]);
12
+ var { id, className, style: itemStyle } = _a, rest = tslib.__rest(_a, ["id", "className", "style"]);
13
13
  return (React.createElement(uikit.Drawer, Object.assign({}, rest, { key: id, className: utils.b('panels'), onOpenChange: (open) => !open && (onClosePanel === null || onClosePanel === undefined ? undefined : onClosePanel()), style: Object.assign(Object.assign({}, itemStyle), { left: size, top: 'var(--gn-top-alert-height, 0px)' }), contentClassName: utils.b('panel', className) })));
14
14
  }))) : null;
15
15
  };
@@ -1 +1 @@
1
- {"version":3,"file":"Panels.js","sources":["../../../../../../src/components/AsideHeader/components/Panels.tsx"],"sourcesContent":["import React from 'react';\n\nimport {Drawer} from '@gravity-ui/uikit';\n\nimport {useAsideHeaderInnerContext} from '../AsideHeaderContext';\nimport {b} from '../utils';\n\nexport const Panels = () => {\n const {panelItems, onClosePanel, size} = useAsideHeaderInnerContext();\n\n return panelItems ? (\n <React.Fragment>\n {panelItems.map(({id, className, style: itemStyle, ...rest}) => (\n <Drawer\n {...rest}\n key={id}\n className={b('panels')}\n onOpenChange={(open) => !open && onClosePanel?.()}\n style={{...itemStyle, left: size, top: 'var(--gn-top-alert-height, 0px)'}}\n contentClassName={b('panel', className)}\n />\n ))}\n </React.Fragment>\n ) : null;\n};\n"],"names":["useAsideHeaderInnerContext","__rest","Drawer","b"],"mappings":";;;;;;;;AAOO,MAAM,MAAM,GAAG,MAAK;IACvB,MAAM,EAAC,UAAU,EAAE,YAAY,EAAE,IAAI,EAAC,GAAGA,6CAA0B,EAAE;AAErE,IAAA,OAAO,UAAU,IACb,oBAAC,KAAK,CAAC,QAAQ,EAAA,IAAA,EACV,UAAU,CAAC,GAAG,CAAC,CAAC,EAA0C,KAAI;AAA9C,QAAA,IAAA,EAAC,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAA,GAAA,EAAU,EAAL,IAAI,GAAzCC,gBAAA,CAAA,EAAA,EAAA,CAAA,IAAA,EAAA,WAAA,EAAA,OAAA,CAA0C,CAAD;QAAM,QAC5D,KAAC,CAAA,aAAA,CAAAC,YAAM,EACC,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,IAAI,EACR,EAAA,GAAG,EAAE,EAAE,EACP,SAAS,EAAEC,OAAC,CAAC,QAAQ,CAAC,EACtB,YAAY,EAAE,CAAC,IAAI,KAAK,CAAC,IAAI,KAAI,YAAY,aAAZ,YAAY,KAAA,SAAA,GAAA,SAAA,GAAZ,YAAY,EAAI,CAAA,EACjD,KAAK,EAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAM,SAAS,CAAA,EAAA,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,iCAAiC,EAAA,CAAA,EACxE,gBAAgB,EAAEA,OAAC,CAAC,OAAO,EAAE,SAAS,CAAC,EACzC,CAAA,CAAA;AACL,KAAA,CAAC,CACW,IACjB,IAAI;AACZ;;;;"}
1
+ {"version":3,"file":"Panels.js","sources":["../../../../../../src/components/AsideHeader/components/Panels.tsx"],"sourcesContent":["import React from 'react';\n\nimport {Drawer} from '@gravity-ui/uikit';\n\nimport {useAsideHeaderInnerContext} from '../AsideHeaderContext';\nimport {b} from '../utils';\n\nexport const Panels = () => {\n const {panelItems, onClosePanel, size} = useAsideHeaderInnerContext();\n\n return panelItems ? (\n <React.Fragment>\n {panelItems.map(({id, className, style: itemStyle, ...rest}) => (\n <Drawer\n {...rest}\n key={id}\n className={b('panels')}\n onOpenChange={(open) => !open && onClosePanel?.()}\n style={{...itemStyle, left: size, top: 'var(--gn-top-alert-height, 0px)'}}\n contentClassName={b('panel', className)}\n />\n ))}\n </React.Fragment>\n ) : null;\n};\n"],"names":["useAsideHeaderInnerContext","__rest","Drawer","b"],"mappings":";;;;;;;;AAOO,MAAM,MAAM,GAAG,MAAK;IACvB,MAAM,EAAC,UAAU,EAAE,YAAY,EAAE,IAAI,EAAC,GAAGA,6CAA0B,EAAE;AAErE,IAAA,OAAO,UAAU,IACb,oBAAC,KAAK,CAAC,QAAQ,EAAA,IAAA,EACV,UAAU,CAAC,GAAG,CAAC,CAAC,EAA0C,KAAI;AAA9C,QAAA,IAAA,EAAC,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAA,GAAA,EAAU,EAAL,IAAI,GAAzCC,YAAA,CAAA,EAAA,EAAA,CAAA,IAAA,EAAA,WAAA,EAAA,OAAA,CAA0C,CAAD;QAAM,QAC5D,KAAC,CAAA,aAAA,CAAAC,YAAM,EACC,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,IAAI,EACR,EAAA,GAAG,EAAE,EAAE,EACP,SAAS,EAAEC,OAAC,CAAC,QAAQ,CAAC,EACtB,YAAY,EAAE,CAAC,IAAI,KAAK,CAAC,IAAI,KAAI,YAAY,aAAZ,YAAY,KAAA,SAAA,GAAA,SAAA,GAAZ,YAAY,EAAI,CAAA,EACjD,KAAK,EAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAM,SAAS,CAAA,EAAA,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,iCAAiC,EAAA,CAAA,EACxE,gBAAgB,EAAEA,OAAC,CAAC,OAAO,EAAE,SAAS,CAAC,EACzC,CAAA,CAAA;AACL,KAAA,CAAC,CACW,IACjB,IAAI;AACZ;;;;"}
@@ -1,7 +1,7 @@
1
1
  import './MenuItem.css';
2
2
  'use strict';
3
3
 
4
- var tslib_es6 = require('../../../node_modules/tslib/tslib.es6.js');
4
+ var tslib = require('tslib');
5
5
  var React = require('react');
6
6
  var uikit = require('@gravity-ui/uikit');
7
7
  var cn = require('../../utils/cn.js');
@@ -9,7 +9,7 @@ var MenuItem_module = require('./MenuItem.module.scss.js');
9
9
 
10
10
  const b = cn.createBlock('footer-menu-item', MenuItem_module.default);
11
11
  const MenuItem = (_a) => {
12
- var { text, className } = _a, menuItemProps = tslib_es6.__rest(_a, ["text", "className"]);
12
+ var { text, className } = _a, menuItemProps = tslib.__rest(_a, ["text", "className"]);
13
13
  return (React.createElement(uikit.Menu.Item, Object.assign({ className: b(null, className) }, menuItemProps), text));
14
14
  };
15
15
 
@@ -1 +1 @@
1
- {"version":3,"file":"MenuItem.js","sources":["../../../../../../src/components/Footer/MenuItem/MenuItem.tsx"],"sourcesContent":["import React from 'react';\nimport type {FC} from 'react';\n\nimport {Menu} from '@gravity-ui/uikit';\n\nimport {createBlock} from '../../utils/cn';\nimport {FooterMenuItem} from '../types';\n\nimport styles from './MenuItem.module.scss';\n\nconst b = createBlock('footer-menu-item', styles);\n\ntype MenuItemProps = FooterMenuItem;\n\nexport const MenuItem: FC<MenuItemProps> = ({text, className, ...menuItemProps}) => {\n return (\n <Menu.Item className={b(null, className)} {...menuItemProps}>\n {text}\n </Menu.Item>\n );\n};\n"],"names":["createBlock","styles","__rest","Menu"],"mappings":";;;;;;;;AAUA,MAAM,CAAC,GAAGA,cAAW,CAAC,kBAAkB,EAAEC,uBAAM,CAAC;AAIpC,MAAA,QAAQ,GAAsB,CAAC,EAAmC,KAAI;QAAvC,EAAC,IAAI,EAAE,SAAS,EAAA,GAAA,EAAmB,EAAd,aAAa,GAAAC,gBAAA,CAAA,EAAA,EAAlC,qBAAmC,CAAD;IAC1E,QACI,oBAACC,UAAI,CAAC,IAAI,EAAC,MAAA,CAAA,MAAA,CAAA,EAAA,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAM,EAAA,aAAa,GACtD,IAAI,CACG;AAEpB;;;;"}
1
+ {"version":3,"file":"MenuItem.js","sources":["../../../../../../src/components/Footer/MenuItem/MenuItem.tsx"],"sourcesContent":["import React from 'react';\nimport type {FC} from 'react';\n\nimport {Menu} from '@gravity-ui/uikit';\n\nimport {createBlock} from '../../utils/cn';\nimport {FooterMenuItem} from '../types';\n\nimport styles from './MenuItem.module.scss';\n\nconst b = createBlock('footer-menu-item', styles);\n\ntype MenuItemProps = FooterMenuItem;\n\nexport const MenuItem: FC<MenuItemProps> = ({text, className, ...menuItemProps}) => {\n return (\n <Menu.Item className={b(null, className)} {...menuItemProps}>\n {text}\n </Menu.Item>\n );\n};\n"],"names":["createBlock","styles","__rest","Menu"],"mappings":";;;;;;;;AAUA,MAAM,CAAC,GAAGA,cAAW,CAAC,kBAAkB,EAAEC,uBAAM,CAAC;AAIpC,MAAA,QAAQ,GAAsB,CAAC,EAAmC,KAAI;QAAvC,EAAC,IAAI,EAAE,SAAS,EAAA,GAAA,EAAmB,EAAd,aAAa,GAAAC,YAAA,CAAA,EAAA,EAAlC,qBAAmC,CAAD;IAC1E,QACI,oBAACC,UAAI,CAAC,IAAI,EAAC,MAAA,CAAA,MAAA,CAAA,EAAA,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAM,EAAA,aAAa,GACtD,IAAI,CACG;AAEpB;;;;"}
@@ -1,7 +1,7 @@
1
1
  import './HotkeysPanel.css';
2
2
  'use strict';
3
3
 
4
- var tslib_es6 = require('../../node_modules/tslib/tslib.es6.js');
4
+ var tslib = require('tslib');
5
5
  var React = require('react');
6
6
  var uikit = require('@gravity-ui/uikit');
7
7
  var AsideHeaderContext = require('../AsideHeader/AsideHeaderContext.js');
@@ -13,7 +13,7 @@ var HotkeysPanel_module = require('./HotkeysPanel.module.scss.js');
13
13
  const b = cn.createBlock('hotkeys-panel', HotkeysPanel_module.default);
14
14
  function HotkeysPanel(_a) {
15
15
  var _b;
16
- var { open, onClose, leftOffset, topOffset, className, drawerItemClassName, filterClassName, titleClassName, listClassName, itemContentClassName, hotkeys, itemClassName, filterable = true, filterPlaceholder, title, togglePanelHotkey, emptyState, platform, drawerProps, style: styleProp, disableNavigationOffset = false } = _a, listProps = tslib_es6.__rest(_a, ["open", "onClose", "leftOffset", "topOffset", "className", "drawerItemClassName", "filterClassName", "titleClassName", "listClassName", "itemContentClassName", "hotkeys", "itemClassName", "filterable", "filterPlaceholder", "title", "togglePanelHotkey", "emptyState", "platform", "drawerProps", "style", "disableNavigationOffset"]);
16
+ var { open, onClose, leftOffset, topOffset, className, drawerItemClassName, filterClassName, titleClassName, listClassName, itemContentClassName, hotkeys, itemClassName, filterable = true, filterPlaceholder, title, togglePanelHotkey, emptyState, platform, drawerProps, style: styleProp, disableNavigationOffset = false } = _a, listProps = tslib.__rest(_a, ["open", "onClose", "leftOffset", "topOffset", "className", "drawerItemClassName", "filterClassName", "titleClassName", "listClassName", "itemContentClassName", "hotkeys", "itemClassName", "filterable", "filterPlaceholder", "title", "togglePanelHotkey", "emptyState", "platform", "drawerProps", "style", "disableNavigationOffset"]);
17
17
  const textInputRef = React.useRef(null);
18
18
  const [filter, setFilter] = React.useState('');
19
19
  const { size } = (_b = AsideHeaderContext.useSafeAsideHeaderContext()) !== null && _b !== undefined ? _b : { size: 0 };
@@ -1 +1 @@
1
- {"version":3,"file":"HotkeysPanel.js","sources":["../../../../../src/components/HotkeysPanel/HotkeysPanel.tsx"],"sourcesContent":["import React, {useCallback, useMemo, useRef, useState} from 'react';\nimport type {ReactNode} from 'react';\n\nimport {Drawer, HelpMark, Hotkey, List, Text, TextInput} from '@gravity-ui/uikit';\nimport type {DrawerProps, HotkeyProps, ListProps} from '@gravity-ui/uikit';\n\nimport {useSafeAsideHeaderContext} from '../AsideHeader/AsideHeaderContext';\nimport {createBlock} from '../utils/cn';\n\nimport type {HotkeysGroup, HotkeysListItem} from './types';\nimport {filterHotkeys} from './utils/filterHotkeys';\nimport {flattenHotkeyGroups} from './utils/flattenHotkeyGroups';\n\nimport styles from './HotkeysPanel.module.scss';\n\nconst b = createBlock('hotkeys-panel', styles);\n\nexport type HotkeysPanelProps<T> = {\n hotkeys: HotkeysGroup<T>[];\n title?: ReactNode;\n togglePanelHotkey?: string;\n filterable?: boolean;\n filterPlaceholder?: string;\n emptyState?: ReactNode;\n open: boolean;\n onClose?: () => void;\n className?: string;\n drawerItemClassName?: string;\n filterClassName?: string;\n titleClassName?: string;\n itemContentClassName?: string;\n listClassName?: string;\n leftOffset?: number | string;\n topOffset?: number | string;\n style?: React.CSSProperties;\n platform?: HotkeyProps['platform'];\n drawerProps?: Omit<DrawerProps, 'style' | 'contentClassName' | 'open' | 'className'>;\n disableNavigationOffset?: boolean;\n} & Omit<\n ListProps<HotkeysListItem>,\n | 'items'\n | 'emptyPlaceholder'\n | 'className'\n | 'size'\n | 'renderItem'\n | 'filterable'\n | 'autoFocus'\n | 'filterPlaceholder'\n | 'filterClassName'\n | 'filter'\n | 'filterItem'\n | 'onFilterEnd'\n | 'onFilterUpdate'\n>;\n\nexport function HotkeysPanel<T = {}>({\n open,\n onClose,\n leftOffset,\n topOffset,\n className,\n drawerItemClassName,\n filterClassName,\n titleClassName,\n listClassName,\n itemContentClassName,\n hotkeys,\n itemClassName,\n filterable = true,\n filterPlaceholder,\n title,\n togglePanelHotkey,\n emptyState,\n platform,\n drawerProps,\n style: styleProp,\n disableNavigationOffset = false,\n ...listProps\n}: HotkeysPanelProps<T>) {\n const textInputRef = useRef<HTMLInputElement>(null);\n\n const [filter, setFilter] = useState('');\n\n const {size} = useSafeAsideHeaderContext() ?? {size: 0};\n\n const hotkeysList = useMemo(() => {\n const filteredHotkeys = filterHotkeys(hotkeys, filter);\n return flattenHotkeyGroups(filteredHotkeys);\n }, [hotkeys, filter]);\n\n const renderItem = useCallback(\n (item: HotkeysListItem) => (\n <Text\n as={item.group ? ('h3' as const) : ('p' as const)}\n variant={item.group ? 'subheader-2' : 'body-1'}\n className={b(\n 'item-content',\n {type: item.group ? 'group' : 'item'},\n itemContentClassName,\n )}\n key={item.title}\n >\n <span>\n {item.title}\n {item.hint && (\n <HelpMark\n aria-hidden\n popoverProps={{className: b('item-hint-tooltip')}}\n className={b('item-hint')}\n >\n {item.hint}\n </HelpMark>\n )}\n </span>\n {item.value && (\n <Hotkey className={b('hotkey')} value={item.value} platform={platform} />\n )}\n </Text>\n ),\n [itemContentClassName, platform],\n );\n\n const drawerItemContent = (\n <React.Fragment>\n <Text variant=\"subheader-3\" as={'h2' as const} className={b('title', titleClassName)}>\n {title}\n {togglePanelHotkey && <Hotkey value={togglePanelHotkey} platform={platform} />}\n </Text>\n {filterable && (\n <TextInput\n controlRef={textInputRef}\n value={filter}\n onUpdate={setFilter}\n placeholder={filterPlaceholder}\n autoFocus\n className={b('search', filterClassName)}\n hasClear\n />\n )}\n <List<HotkeysListItem>\n className={b('list', listClassName)}\n virtualized={false}\n filterable={false}\n items={hotkeysList}\n renderItem={renderItem}\n itemClassName={b('item', itemClassName)}\n emptyPlaceholder={emptyState}\n {...listProps}\n />\n </React.Fragment>\n );\n\n const onOpenChange = useCallback(\n (newOpen: boolean) => {\n if (!newOpen) {\n onClose?.();\n }\n\n drawerProps?.onOpenChange?.(newOpen);\n },\n [drawerProps, onClose],\n );\n\n const style = useMemo<React.CSSProperties>(\n () => ({\n position: 'fixed',\n left: disableNavigationOffset ? undefined : size,\n ...styleProp,\n ...(leftOffset !== undefined && {left: leftOffset}),\n ...(topOffset !== undefined && {top: topOffset}),\n }),\n [disableNavigationOffset, styleProp, leftOffset, size, topOffset],\n );\n\n return (\n <Drawer\n className={b(null, className)}\n open={open}\n initialFocus={filterable ? textInputRef : undefined}\n onOpenChange={onOpenChange}\n style={style}\n contentClassName={b('drawer-item', drawerItemClassName)}\n {...drawerProps}\n >\n {drawerItemContent}\n </Drawer>\n );\n}\n"],"names":["createBlock","styles","__rest","useRef","useState","useSafeAsideHeaderContext","useMemo","filterHotkeys","flattenHotkeyGroups","useCallback","Text","HelpMark","Hotkey","TextInput","List","Drawer"],"mappings":"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"}
1
+ {"version":3,"file":"HotkeysPanel.js","sources":["../../../../../src/components/HotkeysPanel/HotkeysPanel.tsx"],"sourcesContent":["import React, {useCallback, useMemo, useRef, useState} from 'react';\nimport type {ReactNode} from 'react';\n\nimport {Drawer, HelpMark, Hotkey, List, Text, TextInput} from '@gravity-ui/uikit';\nimport type {DrawerProps, HotkeyProps, ListProps} from '@gravity-ui/uikit';\n\nimport {useSafeAsideHeaderContext} from '../AsideHeader/AsideHeaderContext';\nimport {createBlock} from '../utils/cn';\n\nimport type {HotkeysGroup, HotkeysListItem} from './types';\nimport {filterHotkeys} from './utils/filterHotkeys';\nimport {flattenHotkeyGroups} from './utils/flattenHotkeyGroups';\n\nimport styles from './HotkeysPanel.module.scss';\n\nconst b = createBlock('hotkeys-panel', styles);\n\nexport type HotkeysPanelProps<T> = {\n hotkeys: HotkeysGroup<T>[];\n title?: ReactNode;\n togglePanelHotkey?: string;\n filterable?: boolean;\n filterPlaceholder?: string;\n emptyState?: ReactNode;\n open: boolean;\n onClose?: () => void;\n className?: string;\n drawerItemClassName?: string;\n filterClassName?: string;\n titleClassName?: string;\n itemContentClassName?: string;\n listClassName?: string;\n leftOffset?: number | string;\n topOffset?: number | string;\n style?: React.CSSProperties;\n platform?: HotkeyProps['platform'];\n drawerProps?: Omit<DrawerProps, 'style' | 'contentClassName' | 'open' | 'className'>;\n disableNavigationOffset?: boolean;\n} & Omit<\n ListProps<HotkeysListItem>,\n | 'items'\n | 'emptyPlaceholder'\n | 'className'\n | 'size'\n | 'renderItem'\n | 'filterable'\n | 'autoFocus'\n | 'filterPlaceholder'\n | 'filterClassName'\n | 'filter'\n | 'filterItem'\n | 'onFilterEnd'\n | 'onFilterUpdate'\n>;\n\nexport function HotkeysPanel<T = {}>({\n open,\n onClose,\n leftOffset,\n topOffset,\n className,\n drawerItemClassName,\n filterClassName,\n titleClassName,\n listClassName,\n itemContentClassName,\n hotkeys,\n itemClassName,\n filterable = true,\n filterPlaceholder,\n title,\n togglePanelHotkey,\n emptyState,\n platform,\n drawerProps,\n style: styleProp,\n disableNavigationOffset = false,\n ...listProps\n}: HotkeysPanelProps<T>) {\n const textInputRef = useRef<HTMLInputElement>(null);\n\n const [filter, setFilter] = useState('');\n\n const {size} = useSafeAsideHeaderContext() ?? {size: 0};\n\n const hotkeysList = useMemo(() => {\n const filteredHotkeys = filterHotkeys(hotkeys, filter);\n return flattenHotkeyGroups(filteredHotkeys);\n }, [hotkeys, filter]);\n\n const renderItem = useCallback(\n (item: HotkeysListItem) => (\n <Text\n as={item.group ? ('h3' as const) : ('p' as const)}\n variant={item.group ? 'subheader-2' : 'body-1'}\n className={b(\n 'item-content',\n {type: item.group ? 'group' : 'item'},\n itemContentClassName,\n )}\n key={item.title}\n >\n <span>\n {item.title}\n {item.hint && (\n <HelpMark\n aria-hidden\n popoverProps={{className: b('item-hint-tooltip')}}\n className={b('item-hint')}\n >\n {item.hint}\n </HelpMark>\n )}\n </span>\n {item.value && (\n <Hotkey className={b('hotkey')} value={item.value} platform={platform} />\n )}\n </Text>\n ),\n [itemContentClassName, platform],\n );\n\n const drawerItemContent = (\n <React.Fragment>\n <Text variant=\"subheader-3\" as={'h2' as const} className={b('title', titleClassName)}>\n {title}\n {togglePanelHotkey && <Hotkey value={togglePanelHotkey} platform={platform} />}\n </Text>\n {filterable && (\n <TextInput\n controlRef={textInputRef}\n value={filter}\n onUpdate={setFilter}\n placeholder={filterPlaceholder}\n autoFocus\n className={b('search', filterClassName)}\n hasClear\n />\n )}\n <List<HotkeysListItem>\n className={b('list', listClassName)}\n virtualized={false}\n filterable={false}\n items={hotkeysList}\n renderItem={renderItem}\n itemClassName={b('item', itemClassName)}\n emptyPlaceholder={emptyState}\n {...listProps}\n />\n </React.Fragment>\n );\n\n const onOpenChange = useCallback(\n (newOpen: boolean) => {\n if (!newOpen) {\n onClose?.();\n }\n\n drawerProps?.onOpenChange?.(newOpen);\n },\n [drawerProps, onClose],\n );\n\n const style = useMemo<React.CSSProperties>(\n () => ({\n position: 'fixed',\n left: disableNavigationOffset ? undefined : size,\n ...styleProp,\n ...(leftOffset !== undefined && {left: leftOffset}),\n ...(topOffset !== undefined && {top: topOffset}),\n }),\n [disableNavigationOffset, styleProp, leftOffset, size, topOffset],\n );\n\n return (\n <Drawer\n className={b(null, className)}\n open={open}\n initialFocus={filterable ? textInputRef : undefined}\n onOpenChange={onOpenChange}\n style={style}\n contentClassName={b('drawer-item', drawerItemClassName)}\n {...drawerProps}\n >\n {drawerItemContent}\n </Drawer>\n );\n}\n"],"names":["createBlock","styles","__rest","useRef","useState","useSafeAsideHeaderContext","useMemo","filterHotkeys","flattenHotkeyGroups","useCallback","Text","HelpMark","Hotkey","TextInput","List","Drawer"],"mappings":"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"}
@@ -1,7 +1,7 @@
1
1
  import './Logo.css';
2
2
  'use strict';
3
3
 
4
- var tslib_es6 = require('../../node_modules/tslib/tslib.es6.js');
4
+ var tslib = require('tslib');
5
5
  var React = require('react');
6
6
  var uikit = require('@gravity-ui/uikit');
7
7
  var cn = require('../utils/cn.js');
@@ -34,7 +34,7 @@ const Logo = ({ text, icon, iconSrc, iconClassName, iconPlaceClassName, iconSize
34
34
  'aria-label': ariaLabel,
35
35
  'aria-labelledby': ariaLabelledby,
36
36
  }
37
- : { tag: 'span' }, { tag: Button } = _a, buttonProps = tslib_es6.__rest(_a, ["tag"]);
37
+ : { tag: 'span' }, { tag: Button } = _a, buttonProps = tslib.__rest(_a, ["tag"]);
38
38
  const button = (React.createElement(Button, Object.assign({}, buttonProps, { className: b('btn-logo', buttonClassName), onClick: onClick }),
39
39
  React.createElement("span", { className: b('logo-icon-place', iconPlaceClassName) }, buttonIcon),
40
40
  !compact && logo));
@@ -1 +1 @@
1
- {"version":3,"file":"Logo.js","sources":["../../../../../src/components/Logo/Logo.tsx"],"sourcesContent":["import React from 'react';\n\nimport {Icon} from '@gravity-ui/uikit';\n\nimport {LogoProps} from '../types';\nimport {createBlock} from '../utils/cn';\n\nimport styles from './Logo.module.scss';\n\nconst b = createBlock('logo', styles);\n\nexport const Logo: React.FC<\n LogoProps & {compact?: boolean; buttonClassName?: string; iconPlaceClassName?: string}\n> = ({\n text,\n icon,\n iconSrc,\n iconClassName,\n iconPlaceClassName,\n iconSize = 24,\n textSize = 15,\n href,\n target = '_self',\n wrapper,\n onClick,\n compact,\n className,\n buttonClassName,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n}) => {\n const hasWrapper = typeof wrapper === 'function';\n\n let buttonIcon;\n\n if (iconSrc) {\n buttonIcon = (\n <span className={iconClassName}>\n <img alt=\"logo icon\" src={iconSrc} width={iconSize} height={iconSize} />\n </span>\n );\n } else if (icon) {\n buttonIcon = <Icon data={icon} size={iconSize} className={iconClassName} />;\n }\n\n let logo: React.ReactNode;\n\n if (typeof text === 'function') {\n logo = text();\n } else {\n logo = (\n <div className={b('logo')} style={{fontSize: textSize}}>\n {text}\n </div>\n );\n }\n\n const {tag: Button, ...buttonProps} = href\n ? ({\n tag: 'a',\n target,\n rel: target === '_self' ? undefined : 'noreferrer',\n href,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n } as const)\n : ({tag: 'span'} as const);\n\n const button = (\n <Button {...buttonProps} className={b('btn-logo', buttonClassName)} onClick={onClick}>\n <span className={b('logo-icon-place', iconPlaceClassName)}>{buttonIcon}</span>\n {!compact && logo}\n </Button>\n );\n\n return (\n <div className={b(null, className)}>\n {hasWrapper ? wrapper(button, Boolean(compact)) : button}\n </div>\n );\n};\n"],"names":["createBlock","styles","Icon","__rest"],"mappings":";;;;;;;;AASA,MAAM,CAAC,GAAGA,cAAW,CAAC,MAAM,EAAEC,mBAAM,CAAC;MAExB,IAAI,GAEb,CAAC,EACD,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,aAAa,EACb,kBAAkB,EAClB,QAAQ,GAAG,EAAE,EACb,QAAQ,GAAG,EAAE,EACb,IAAI,EACJ,MAAM,GAAG,OAAO,EAChB,OAAO,EACP,OAAO,EACP,OAAO,EACP,SAAS,EACT,eAAe,EACf,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,GACpC,KAAI;AACD,IAAA,MAAM,UAAU,GAAG,OAAO,OAAO,KAAK,UAAU;AAEhD,IAAA,IAAI,UAAU;IAEd,IAAI,OAAO,EAAE;AACT,QAAA,UAAU,IACN,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,aAAa,EAAA;AAC1B,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAC,WAAW,EAAC,GAAG,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAI,CAAA,CACrE,CACV;;SACE,IAAI,IAAI,EAAE;AACb,QAAA,UAAU,GAAG,KAAC,CAAA,aAAA,CAAAC,UAAI,EAAC,EAAA,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,GAAI;;AAG/E,IAAA,IAAI,IAAqB;AAEzB,IAAA,IAAI,OAAO,IAAI,KAAK,UAAU,EAAE;QAC5B,IAAI,GAAG,IAAI,EAAE;;SACV;QACH,IAAI,IACA,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,KAAK,EAAE,EAAC,QAAQ,EAAE,QAAQ,EAAC,EACjD,EAAA,IAAI,CACH,CACT;;AAGL,IAAA,MAAM,KAAgC;AAClC,UAAG;AACG,YAAA,GAAG,EAAE,GAAG;YACR,MAAM;YACN,GAAG,EAAE,MAAM,KAAK,OAAO,GAAG,SAAS,GAAG,YAAY;YAClD,IAAI;AACJ,YAAA,YAAY,EAAE,SAAS;AACvB,YAAA,iBAAiB,EAAE,cAAc;AAC1B;AACb,UAAG,EAAC,GAAG,EAAE,MAAM,EAAW,EATxB,EAAC,GAAG,EAAE,MAAM,EASY,GAAA,EAAA,EATP,WAAW,GAA5BC,gBAAA,CAAA,EAAA,EAAA,CAAA,KAAA,CAA6B,CASL;AAE9B,IAAA,MAAM,MAAM,IACR,oBAAC,MAAM,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,WAAW,EAAE,EAAA,SAAS,EAAE,CAAC,CAAC,UAAU,EAAE,eAAe,CAAC,EAAE,OAAO,EAAE,OAAO,EAAA,CAAA;QAChF,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,iBAAiB,EAAE,kBAAkB,CAAC,EAAG,EAAA,UAAU,CAAQ;AAC7E,QAAA,CAAC,OAAO,IAAI,IAAI,CACZ,CACZ;AAED,IAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAC7B,EAAA,UAAU,GAAG,OAAO,CAAC,MAAM,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC,GAAG,MAAM,CACtD;AAEd;;;;"}
1
+ {"version":3,"file":"Logo.js","sources":["../../../../../src/components/Logo/Logo.tsx"],"sourcesContent":["import React from 'react';\n\nimport {Icon} from '@gravity-ui/uikit';\n\nimport {LogoProps} from '../types';\nimport {createBlock} from '../utils/cn';\n\nimport styles from './Logo.module.scss';\n\nconst b = createBlock('logo', styles);\n\nexport const Logo: React.FC<\n LogoProps & {compact?: boolean; buttonClassName?: string; iconPlaceClassName?: string}\n> = ({\n text,\n icon,\n iconSrc,\n iconClassName,\n iconPlaceClassName,\n iconSize = 24,\n textSize = 15,\n href,\n target = '_self',\n wrapper,\n onClick,\n compact,\n className,\n buttonClassName,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n}) => {\n const hasWrapper = typeof wrapper === 'function';\n\n let buttonIcon;\n\n if (iconSrc) {\n buttonIcon = (\n <span className={iconClassName}>\n <img alt=\"logo icon\" src={iconSrc} width={iconSize} height={iconSize} />\n </span>\n );\n } else if (icon) {\n buttonIcon = <Icon data={icon} size={iconSize} className={iconClassName} />;\n }\n\n let logo: React.ReactNode;\n\n if (typeof text === 'function') {\n logo = text();\n } else {\n logo = (\n <div className={b('logo')} style={{fontSize: textSize}}>\n {text}\n </div>\n );\n }\n\n const {tag: Button, ...buttonProps} = href\n ? ({\n tag: 'a',\n target,\n rel: target === '_self' ? undefined : 'noreferrer',\n href,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n } as const)\n : ({tag: 'span'} as const);\n\n const button = (\n <Button {...buttonProps} className={b('btn-logo', buttonClassName)} onClick={onClick}>\n <span className={b('logo-icon-place', iconPlaceClassName)}>{buttonIcon}</span>\n {!compact && logo}\n </Button>\n );\n\n return (\n <div className={b(null, className)}>\n {hasWrapper ? wrapper(button, Boolean(compact)) : button}\n </div>\n );\n};\n"],"names":["createBlock","styles","Icon","__rest"],"mappings":";;;;;;;;AASA,MAAM,CAAC,GAAGA,cAAW,CAAC,MAAM,EAAEC,mBAAM,CAAC;MAExB,IAAI,GAEb,CAAC,EACD,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,aAAa,EACb,kBAAkB,EAClB,QAAQ,GAAG,EAAE,EACb,QAAQ,GAAG,EAAE,EACb,IAAI,EACJ,MAAM,GAAG,OAAO,EAChB,OAAO,EACP,OAAO,EACP,OAAO,EACP,SAAS,EACT,eAAe,EACf,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,GACpC,KAAI;AACD,IAAA,MAAM,UAAU,GAAG,OAAO,OAAO,KAAK,UAAU;AAEhD,IAAA,IAAI,UAAU;IAEd,IAAI,OAAO,EAAE;AACT,QAAA,UAAU,IACN,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,aAAa,EAAA;AAC1B,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAC,WAAW,EAAC,GAAG,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAI,CAAA,CACrE,CACV;;SACE,IAAI,IAAI,EAAE;AACb,QAAA,UAAU,GAAG,KAAC,CAAA,aAAA,CAAAC,UAAI,EAAC,EAAA,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,GAAI;;AAG/E,IAAA,IAAI,IAAqB;AAEzB,IAAA,IAAI,OAAO,IAAI,KAAK,UAAU,EAAE;QAC5B,IAAI,GAAG,IAAI,EAAE;;SACV;QACH,IAAI,IACA,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,KAAK,EAAE,EAAC,QAAQ,EAAE,QAAQ,EAAC,EACjD,EAAA,IAAI,CACH,CACT;;AAGL,IAAA,MAAM,KAAgC;AAClC,UAAG;AACG,YAAA,GAAG,EAAE,GAAG;YACR,MAAM;YACN,GAAG,EAAE,MAAM,KAAK,OAAO,GAAG,SAAS,GAAG,YAAY;YAClD,IAAI;AACJ,YAAA,YAAY,EAAE,SAAS;AACvB,YAAA,iBAAiB,EAAE,cAAc;AAC1B;AACb,UAAG,EAAC,GAAG,EAAE,MAAM,EAAW,EATxB,EAAC,GAAG,EAAE,MAAM,EASY,GAAA,EAAA,EATP,WAAW,GAA5BC,YAAA,CAAA,EAAA,EAAA,CAAA,KAAA,CAA6B,CASL;AAE9B,IAAA,MAAM,MAAM,IACR,oBAAC,MAAM,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,WAAW,EAAE,EAAA,SAAS,EAAE,CAAC,CAAC,UAAU,EAAE,eAAe,CAAC,EAAE,OAAO,EAAE,OAAO,EAAA,CAAA;QAChF,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,iBAAiB,EAAE,kBAAkB,CAAC,EAAG,EAAA,UAAU,CAAQ;AAC7E,QAAA,CAAC,OAAO,IAAI,IAAI,CACZ,CACZ;AAED,IAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAC7B,EAAA,UAAU,GAAG,OAAO,CAAC,MAAM,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC,GAAG,MAAM,CACtD;AAEd;;;;"}
@@ -1,7 +1,7 @@
1
1
  import './MobileHeader.css';
2
2
  'use strict';
3
3
 
4
- var tslib_es6 = require('../../node_modules/tslib/tslib.es6.js');
4
+ var tslib = require('tslib');
5
5
  var React = require('react');
6
6
  var uikit = require('@gravity-ui/uikit');
7
7
  var useForwardRef = require('../../hooks/useForwardRef.js');
@@ -149,7 +149,7 @@ const MobileHeader = React.forwardRef(({ logo, burgerMenu, burgerCloseTitle = in
149
149
  React.createElement(MobileLogo.MobileLogo, Object.assign({}, logo, { compact: compact, onClick: onLogoClick })),
150
150
  React.createElement("div", { className: b('side-item') }, sideItemRenderContent === null || sideItemRenderContent === undefined ? undefined : sideItemRenderContent({ size })))),
151
151
  allPanelItems.map((_a) => {
152
- var { id, className } = _a, rest = tslib_es6.__rest(_a, ["id", "className"]);
152
+ var { id, className } = _a, rest = tslib.__rest(_a, ["id", "className"]);
153
153
  return (React.createElement(uikit.Drawer, Object.assign({}, rest, { key: id, className: b('panels'), open: openPanel === id, onOpenChange: (open) => !open && onCloseDrawer(), style: { top: `calc(${size}px + var(--gn-top-alert-height, 0px))` }, contentClassName: b('panel-item', className), size: 320 })));
154
154
  }),
155
155
  overlapPanel && (React.createElement(OverlapPanel.OverlapPanel, { topOffset: size, className: b('overlap-panel'), title: overlapPanel.title, onClose: onOverlapClose, action: overlapPanel.action, open: overlapPanelVisible, renderContent: overlapPanel.renderContent })),