@gravity-ui/navigation 0.6.1 → 0.8.0
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.
- package/CHANGELOG.md +20 -0
- package/build/cjs/components/CompositeBar/Item/Item.d.ts +1 -0
- package/build/cjs/components/HotkeysPanel/HotkeysPanel.d.ts +18 -0
- package/build/cjs/components/HotkeysPanel/__stories__/HotkeysPanel.stories.d.ts +4 -0
- package/build/cjs/components/HotkeysPanel/__stories__/HotkeysPanelShowcase.d.ts +3 -0
- package/build/cjs/components/HotkeysPanel/__stories__/moc.d.ts +2 -0
- package/build/cjs/components/HotkeysPanel/index.d.ts +2 -0
- package/build/cjs/components/HotkeysPanel/types.d.ts +13 -0
- package/build/cjs/components/HotkeysPanel/utils/filterHotkeys.d.ts +2 -0
- package/build/cjs/components/HotkeysPanel/utils/flattenHotkeyGroups.d.ts +2 -0
- package/build/cjs/components/MobileHeader/BurgerMenu/BurgerMenu.d.ts +1 -1
- package/build/cjs/components/Settings/Settings.d.ts +1 -0
- package/build/cjs/components/Settings/__stories__/SettingsDemo.d.ts +2 -1
- package/build/cjs/components/Settings/__stories__/SettingsMobileDemo.d.ts +2 -2
- package/build/cjs/components/Settings/collect-settings.d.ts +1 -1
- package/build/cjs/components/Title/Title.d.ts +12 -0
- package/build/cjs/components/Title/index.d.ts +1 -0
- package/build/cjs/components/index.d.ts +2 -0
- package/build/cjs/index.js +185 -123
- package/build/cjs/index.js.map +1 -1
- package/build/esm/components/CompositeBar/Item/Item.d.ts +1 -0
- package/build/esm/components/HotkeysPanel/HotkeysPanel.d.ts +18 -0
- package/build/esm/components/HotkeysPanel/__stories__/HotkeysPanel.stories.d.ts +4 -0
- package/build/esm/components/HotkeysPanel/__stories__/HotkeysPanelShowcase.d.ts +3 -0
- package/build/esm/components/HotkeysPanel/__stories__/moc.d.ts +2 -0
- package/build/esm/components/HotkeysPanel/index.d.ts +2 -0
- package/build/esm/components/HotkeysPanel/types.d.ts +13 -0
- package/build/esm/components/HotkeysPanel/utils/filterHotkeys.d.ts +2 -0
- package/build/esm/components/HotkeysPanel/utils/flattenHotkeyGroups.d.ts +2 -0
- package/build/esm/components/MobileHeader/BurgerMenu/BurgerMenu.d.ts +1 -1
- package/build/esm/components/Settings/Settings.d.ts +1 -0
- package/build/esm/components/Settings/__stories__/SettingsDemo.d.ts +2 -1
- package/build/esm/components/Settings/__stories__/SettingsMobileDemo.d.ts +2 -2
- package/build/esm/components/Settings/collect-settings.d.ts +1 -1
- package/build/esm/components/Title/Title.d.ts +12 -0
- package/build/esm/components/Title/index.d.ts +1 -0
- package/build/esm/components/index.d.ts +2 -0
- package/build/esm/index.js +186 -126
- package/build/esm/index.js.map +1 -1
- package/package.json +3 -1
package/build/esm/index.js
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import React__default, { Children, isValidElement, cloneElement, createElement, PureComponent } from 'react';
|
|
3
|
-
import { Button, Icon, Popup, List, Tooltip, TextInput, Tabs, Loader } from '@gravity-ui/uikit';
|
|
2
|
+
import React__default, { Children, isValidElement, cloneElement, createElement, PureComponent, useState, useMemo, useCallback } from 'react';
|
|
3
|
+
import { useBodyScrollLock, Button, Icon, Popup, List, Tooltip, Text, Hotkey, TextInput, Tabs, Loader } from '@gravity-ui/uikit';
|
|
4
4
|
import ReactDOM from 'react-dom';
|
|
5
|
+
import { Xmark } from '@gravity-ui/icons';
|
|
5
6
|
|
|
6
7
|
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
|
7
8
|
|
|
@@ -87,48 +88,48 @@ function styleInject(css, ref) {
|
|
|
87
88
|
}
|
|
88
89
|
}
|
|
89
90
|
|
|
90
|
-
var css_248z$
|
|
91
|
-
styleInject(css_248z$
|
|
91
|
+
var css_248z$f = ".ycn-action-bar-group {\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n justify-content: flex-start;\n margin: 0;\n padding: 0;\n}\n.ycn-action-bar-group_pull_left {\n margin-left: 0;\n margin-right: auto;\n}\n.ycn-action-bar-group_pull_right {\n margin-left: auto;\n margin-right: 0;\n}\n.ycn-action-bar-group_pull_center {\n margin-left: auto;\n margin-right: auto;\n}";
|
|
92
|
+
styleInject(css_248z$f);
|
|
92
93
|
|
|
93
|
-
const b$
|
|
94
|
+
const b$g = block('action-bar-group');
|
|
94
95
|
const ActionBarGroup = ({ children, className, pull }) => {
|
|
95
|
-
return (React__default.createElement("ul", { className: b$
|
|
96
|
+
return (React__default.createElement("ul", { className: b$g({ pull }, className), role: "group" }, children));
|
|
96
97
|
};
|
|
97
98
|
ActionBarGroup.displayName = 'ActionBar.Group';
|
|
98
99
|
|
|
99
|
-
var css_248z$
|
|
100
|
-
styleInject(css_248z$
|
|
100
|
+
var css_248z$e = ".ycn-action-bar-item {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n.ycn-action-bar-item_pull_left {\n margin-left: 0;\n margin-right: auto;\n}\n.ycn-action-bar-item_pull_right {\n margin-left: auto;\n margin-right: 0;\n}\n.ycn-action-bar-item_pull_center {\n margin-left: auto;\n margin-right: auto;\n}\n.ycn-action-bar-item + .ycn-action-bar-item_spacing {\n margin-left: 8px;\n}";
|
|
101
|
+
styleInject(css_248z$e);
|
|
101
102
|
|
|
102
|
-
const b$
|
|
103
|
+
const b$f = block('action-bar-item');
|
|
103
104
|
const ActionBarItem = ({ children, className, pull, spacing = true }) => {
|
|
104
|
-
return React__default.createElement("li", { className: b$
|
|
105
|
+
return React__default.createElement("li", { className: b$f({ pull, spacing }, className) }, children);
|
|
105
106
|
};
|
|
106
107
|
ActionBarItem.displayName = 'ActionBar.Item';
|
|
107
108
|
|
|
108
|
-
var css_248z$
|
|
109
|
-
styleInject(css_248z$
|
|
109
|
+
var css_248z$d = ".ycn-action-bar-section {\n display: flex;\n flex-flow: row nowrap;\n justify-content: flex-start;\n align-items: stretch;\n}\n.ycn-action-bar-section + .ycn-action-bar-section {\n border-left: solid 1px var(--yc-color-line-generic);\n}\n.ycn-action-bar-section_type_primary {\n flex: 1 1 auto;\n padding-left: 20px;\n padding-right: 20px;\n}\n.ycn-action-bar-section_type_secondary {\n padding-left: 6px;\n padding-right: 6px;\n}";
|
|
110
|
+
styleInject(css_248z$d);
|
|
110
111
|
|
|
111
|
-
const b$
|
|
112
|
+
const b$e = block('action-bar-section');
|
|
112
113
|
const ActionBarSection = ({ children, type = 'primary' }) => {
|
|
113
|
-
return React__default.createElement("div", { className: b$
|
|
114
|
+
return React__default.createElement("div", { className: b$e({ type }) }, children);
|
|
114
115
|
};
|
|
115
116
|
ActionBarSection.displayName = 'ActionBar.Section';
|
|
116
117
|
|
|
117
|
-
var css_248z$
|
|
118
|
-
styleInject(css_248z$
|
|
118
|
+
var css_248z$c = ".ycn-action-bar-separator {\n list-style: none;\n margin: 0;\n padding: 0;\n margin-left: 6px;\n margin-right: 6px;\n border-right: solid 1px var(--yc-color-line-generic);\n height: 40px;\n}";
|
|
119
|
+
styleInject(css_248z$c);
|
|
119
120
|
|
|
120
|
-
const b$
|
|
121
|
+
const b$d = block('action-bar-separator');
|
|
121
122
|
const ActionBarSeparator = () => {
|
|
122
|
-
return React__default.createElement("li", { role: "separator", className: b$
|
|
123
|
+
return React__default.createElement("li", { role: "separator", className: b$d() });
|
|
123
124
|
};
|
|
124
125
|
ActionBarSeparator.displayName = 'ActionBar.Separator';
|
|
125
126
|
|
|
126
|
-
var css_248z$
|
|
127
|
-
styleInject(css_248z$
|
|
127
|
+
var css_248z$b = ".ycn-action-bar {\n box-sizing: border-box;\n height: 40px;\n border-bottom: solid 1px var(--yc-color-line-generic);\n display: flex;\n flex-flow: row nowrap;\n justify-content: flex-start;\n align-items: stretch;\n}";
|
|
128
|
+
styleInject(css_248z$b);
|
|
128
129
|
|
|
129
|
-
const b$
|
|
130
|
+
const b$c = block('action-bar');
|
|
130
131
|
const ActionBar = ({ children, className, 'aria-label': ariaLabel }) => {
|
|
131
|
-
return (React__default.createElement("section", { className: b$
|
|
132
|
+
return (React__default.createElement("section", { className: b$c(null, className), "aria-label": ariaLabel }, children));
|
|
132
133
|
};
|
|
133
134
|
ActionBar.displayName = 'ActionBar';
|
|
134
135
|
const PublicActionBar = Object.assign(ActionBar, {
|
|
@@ -153,7 +154,7 @@ var Dict;
|
|
|
153
154
|
const ASIDE_HEADER_FOOTER_ICON_SIZE = 20;
|
|
154
155
|
const ASIDE_HEADER_COMPACT_WIDTH = 56;
|
|
155
156
|
const ASIDE_HEADER_EXPANDED_WIDTH = 236;
|
|
156
|
-
const defaultDict$
|
|
157
|
+
const defaultDict$2 = {
|
|
157
158
|
[Dict.CollapseButton]: 'Collapse',
|
|
158
159
|
[Dict.ExpandButton]: 'Expand',
|
|
159
160
|
[Dict.MoreButton]: 'More',
|
|
@@ -3180,15 +3181,15 @@ SwitchTransition.defaultProps = {
|
|
|
3180
3181
|
mode: modes.out
|
|
3181
3182
|
};
|
|
3182
3183
|
|
|
3183
|
-
var css_248z$
|
|
3184
|
-
styleInject(css_248z$
|
|
3184
|
+
var css_248z$a = ".ycn-drawer__item {\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n height: 100%;\n will-change: transform;\n background-color: var(--yc-color-base-background);\n}\n.ycn-drawer__item_direction_right {\n left: auto;\n right: 0;\n}\n.ycn-drawer__item-transition-enter {\n transform: translate(-100%, 0);\n}\n.ycn-drawer__item-transition_direction_right-enter {\n transform: translate(100%, 0);\n}\n.ycn-drawer__item-transition-enter-active, .ycn-drawer__item-transition_direction_right-enter-active {\n transform: translate(0, 0);\n transition: transform 300ms;\n}\n.ycn-drawer__item-transition-enter-done, .ycn-drawer__item-transition_direction_right-enter-done {\n filter: blur(0px);\n transform: translateZ(0);\n}\n.ycn-drawer__item-transition-exit, .ycn-drawer__item-transition_direction_right-exit {\n transform: translate(0, 0);\n}\n.ycn-drawer__item-transition-exit-active, .ycn-drawer__item-transition_direction_right-exit-active {\n transition: transform 300ms;\n}\n.ycn-drawer__item-transition-exit-active {\n transform: translate(-100%, 0);\n}\n.ycn-drawer__item-transition_direction_right-exit-active {\n transform: translate(100%, 0);\n}\n.ycn-drawer__item-transition-exit-done, .ycn-drawer__item-transition_direction_right-exit-done {\n visibility: hidden;\n}\n.ycn-drawer__veil {\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n top: 0;\n background-color: var(--yc-color-sfx-veil);\n}\n.ycn-drawer__veil-transition-enter {\n opacity: 0;\n}\n.ycn-drawer__veil-transition-enter-active {\n opacity: 1;\n transition: opacity 300ms;\n}\n.ycn-drawer__veil-transition-exit {\n opacity: 1;\n}\n.ycn-drawer__veil-transition-exit-active {\n opacity: 0;\n transition: opacity 300ms;\n}\n.ycn-drawer__veil-transition-exit-done {\n visibility: hidden;\n}";
|
|
3185
|
+
styleInject(css_248z$a);
|
|
3185
3186
|
|
|
3186
|
-
const b$
|
|
3187
|
+
const b$b = block('drawer');
|
|
3187
3188
|
const TIMEOUT = 300;
|
|
3188
3189
|
const DrawerItem = ({ visible, content, direction, className }) => {
|
|
3189
3190
|
const itemRef = React__default.useRef(null);
|
|
3190
|
-
return (React__default.createElement(CSSTransition, { in: visible, timeout: TIMEOUT, unmountOnExit: true, classNames: b$
|
|
3191
|
-
React__default.createElement("div", { ref: itemRef, className: b$
|
|
3191
|
+
return (React__default.createElement(CSSTransition, { in: visible, timeout: TIMEOUT, unmountOnExit: true, classNames: b$b('item-transition', { direction }), nodeRef: itemRef },
|
|
3192
|
+
React__default.createElement("div", { ref: itemRef, className: b$b('item', { direction }, className) }, content)));
|
|
3192
3193
|
};
|
|
3193
3194
|
const Drawer = ({ className, children, style, onVeilClick, onEscape, preventScrollBody = true, }) => {
|
|
3194
3195
|
let someItemVisible = false;
|
|
@@ -3214,41 +3215,14 @@ const Drawer = ({ className, children, style, onVeilClick, onEscape, preventScro
|
|
|
3214
3215
|
window.removeEventListener('keydown', onKeyDown);
|
|
3215
3216
|
};
|
|
3216
3217
|
}, [onEscape, someItemVisible]);
|
|
3217
|
-
|
|
3218
|
-
const prevPreventScrollBody = preventScrollBody;
|
|
3219
|
-
const cleanupPreventScrollBody = () => {
|
|
3220
|
-
document.body.style.paddingRight = '';
|
|
3221
|
-
document.body.style.paddingBottom = '';
|
|
3222
|
-
document.body.style.overflow = '';
|
|
3223
|
-
};
|
|
3224
|
-
const setPreventScrollBody = () => {
|
|
3225
|
-
const vw = window.innerWidth - document.documentElement.clientWidth;
|
|
3226
|
-
const hw = window.innerHeight - document.documentElement.clientHeight;
|
|
3227
|
-
document.body.style.paddingRight = vw + 'px';
|
|
3228
|
-
document.body.style.paddingBottom = hw + 'px';
|
|
3229
|
-
document.body.style.overflow = 'hidden';
|
|
3230
|
-
};
|
|
3231
|
-
if (prevPreventScrollBody) {
|
|
3232
|
-
if (someItemVisible) {
|
|
3233
|
-
setPreventScrollBody();
|
|
3234
|
-
}
|
|
3235
|
-
else {
|
|
3236
|
-
cleanupPreventScrollBody();
|
|
3237
|
-
}
|
|
3238
|
-
}
|
|
3239
|
-
return () => {
|
|
3240
|
-
if (prevPreventScrollBody) {
|
|
3241
|
-
cleanupPreventScrollBody();
|
|
3242
|
-
}
|
|
3243
|
-
};
|
|
3244
|
-
}, [someItemVisible, preventScrollBody]);
|
|
3218
|
+
useBodyScrollLock({ enabled: preventScrollBody && someItemVisible });
|
|
3245
3219
|
const containerRef = React__default.useRef(null);
|
|
3246
3220
|
const veilRef = React__default.useRef(null);
|
|
3247
3221
|
return (React__default.createElement(Transition, { in: someItemVisible, timeout: { enter: 0, exit: TIMEOUT }, mountOnEnter: true, unmountOnExit: true, nodeRef: containerRef }, (state) => {
|
|
3248
3222
|
const childrenVisible = someItemVisible && state === 'entered';
|
|
3249
|
-
return (React__default.createElement("div", { ref: containerRef, className: b$
|
|
3250
|
-
React__default.createElement(CSSTransition, { in: childrenVisible, timeout: TIMEOUT, unmountOnExit: true, classNames: b$
|
|
3251
|
-
React__default.createElement("div", { ref: veilRef, className: b$
|
|
3223
|
+
return (React__default.createElement("div", { ref: containerRef, className: b$b(null, className), style: style },
|
|
3224
|
+
React__default.createElement(CSSTransition, { in: childrenVisible, timeout: TIMEOUT, unmountOnExit: true, classNames: b$b('veil-transition'), nodeRef: veilRef },
|
|
3225
|
+
React__default.createElement("div", { ref: veilRef, className: b$b('veil'), onClick: onVeilClick })),
|
|
3252
3226
|
React__default.Children.map(children, (child) => {
|
|
3253
3227
|
const childElem = child;
|
|
3254
3228
|
if (childElem.type === DrawerItem) {
|
|
@@ -3260,10 +3234,10 @@ const Drawer = ({ className, children, style, onVeilClick, onEscape, preventScro
|
|
|
3260
3234
|
}));
|
|
3261
3235
|
};
|
|
3262
3236
|
|
|
3263
|
-
var css_248z$
|
|
3264
|
-
styleInject(css_248z$
|
|
3237
|
+
var css_248z$9 = ".ycn-logo {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n height: 40px;\n}\n.ycn-logo__logo-btn-place {\n flex-shrink: 0;\n width: var(--aside-header-min-width);\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n}\n.ycn-logo__logo-btn-place .yc-button::before {\n background-color: transparent;\n}\n.ycn-logo__btn-logo.yc-button_view_flat.yc-button_size_l {\n --yc-button-height: 38px;\n}\n.ycn-logo__logo {\n font-size: var(--yc-text-body-2-font-size);\n line-height: var(--yc-text-body-2-line-height);\n font-weight: var(--yc-text-body-font-weight);\n vertical-align: middle;\n cursor: pointer;\n}\n.ycn-logo__logo-link, .ycn-logo__logo-link:hover, .ycn-logo__logo-link:active, .ycn-logo__logo-link:visited, .ycn-logo__logo-link:focus {\n text-decoration: none;\n outline: none;\n color: inherit;\n}\n.yc-root .ycn-logo__btn-logo.button2_theme_flat.button2_hovered_yes::before {\n background-color: transparent;\n}";
|
|
3238
|
+
styleInject(css_248z$9);
|
|
3265
3239
|
|
|
3266
|
-
const b$
|
|
3240
|
+
const b$a = block('logo');
|
|
3267
3241
|
const Logo = ({ text, compact, icon, iconSrc, iconClassName, iconSize = 24, textSize = 15, href = '/', wrapper, onClick, }) => {
|
|
3268
3242
|
const hasClickHandler = typeof onClick === 'function';
|
|
3269
3243
|
const hasWrapper = typeof wrapper === 'function';
|
|
@@ -3281,18 +3255,18 @@ const Logo = ({ text, compact, icon, iconSrc, iconClassName, iconSize = 24, text
|
|
|
3281
3255
|
else if (icon) {
|
|
3282
3256
|
buttonIcon = React__default.createElement(Icon, { data: icon, size: iconSize, className: iconClassName });
|
|
3283
3257
|
}
|
|
3284
|
-
const button = (React__default.createElement(Button, Object.assign({ view: "flat", size: "l", className: b$
|
|
3258
|
+
const button = (React__default.createElement(Button, Object.assign({ view: "flat", size: "l", className: b$a('btn-logo'), component: hasWrapper ? 'span' : undefined, onClick: onClick }, linkProps), buttonIcon));
|
|
3285
3259
|
let logo;
|
|
3286
3260
|
if (typeof text === 'function') {
|
|
3287
3261
|
logo = text();
|
|
3288
3262
|
}
|
|
3289
3263
|
else {
|
|
3290
|
-
logo = (React__default.createElement("div", { className: b$
|
|
3264
|
+
logo = (React__default.createElement("div", { className: b$a('logo'), style: { fontSize: textSize } }, text));
|
|
3291
3265
|
}
|
|
3292
|
-
return (React__default.createElement("div", { className: b$
|
|
3293
|
-
React__default.createElement("div", { className: b$
|
|
3266
|
+
return (React__default.createElement("div", { className: b$a() },
|
|
3267
|
+
React__default.createElement("div", { className: b$a('logo-btn-place') }, hasWrapper ? wrapper(button, compact) : button),
|
|
3294
3268
|
!compact &&
|
|
3295
|
-
(hasWrapper ? (React__default.createElement("div", { onClick: onClick }, wrapper(logo, compact))) : (React__default.createElement("a", Object.assign({}, linkProps, { className: b$
|
|
3269
|
+
(hasWrapper ? (React__default.createElement("div", { onClick: onClick }, wrapper(logo, compact))) : (React__default.createElement("a", Object.assign({}, linkProps, { className: b$a('logo-link'), onClick: onClick }), logo)))));
|
|
3296
3270
|
};
|
|
3297
3271
|
|
|
3298
3272
|
var classCallCheck = function (instance, Constructor) {
|
|
@@ -3824,25 +3798,25 @@ function getItemsMinHeight(items) {
|
|
|
3824
3798
|
(pinnedItems.length === items.length ? 0 : ITEM_HEIGHT));
|
|
3825
3799
|
}
|
|
3826
3800
|
|
|
3827
|
-
var css_248z$
|
|
3828
|
-
styleInject(css_248z$
|
|
3801
|
+
var css_248z$8 = ".ycn-composite-bar-item {\n --composite-bar-item-action-size: 36px;\n display: flex;\n width: 100%;\n height: 100%;\n align-items: center;\n cursor: pointer;\n}\n.ycn-composite-bar-item__icon {\n color: var(--yc-color-text-misc);\n}\n.ycn-composite-bar-item__icon-place {\n flex-shrink: 0;\n width: var(--aside-header-min-width);\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n}\n.ycn-composite-bar-item__title {\n display: flex;\n overflow: hidden;\n}\n.ycn-composite-bar-item__title-text {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.ycn-composite-bar-item__title-adornment {\n margin: 0 10px;\n}\n.ycn-composite-bar-item__collapse-item {\n display: flex;\n padding: 0 16px;\n align-items: center;\n width: 100%;\n height: 100%;\n cursor: pointer;\n}\n.ycn-composite-bar-item__collapse-item .ycn-composite-bar-item__title-adornment {\n margin-right: 0;\n}\n.ycn-composite-bar-item__menu-divider {\n margin: 0 8px;\n width: 100%;\n border-top: 1px solid var(--yc-color-line-generic);\n cursor: default;\n}\n.ycn-composite-bar-item__collapse-items-popup-content {\n padding: 4px 0;\n}\n.ycn-composite-bar-item__link {\n display: flex;\n width: 100%;\n height: 100%;\n align-items: center;\n}\n.ycn-composite-bar-item__link, .ycn-composite-bar-item__link:hover, .ycn-composite-bar-item__link:active, .ycn-composite-bar-item__link:visited, .ycn-composite-bar-item__link:focus {\n text-decoration: none;\n outline: none;\n color: inherit;\n}\n.ycn-composite-bar-item__btn-icon {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.ycn-composite-bar-item_type_action {\n justify-content: center;\n height: var(--composite-bar-item-action-size);\n margin: 0 10px 8px;\n background: var(--yc-color-base-float);\n box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.03), 0px 5px 6px rgba(0, 0, 0, 0.12);\n border-radius: var(--composite-bar-item-action-size);\n transition: transform 0.1s ease-out, background-color 0.15s linear;\n}\n.ycn-composite-bar-item_type_action:focus {\n box-shadow: 0 0 0 2px var(--yc-color-line-misc);\n}\n.ycn-composite-bar-item_type_action:focus:not(:focus-visible) {\n box-shadow: none;\n}\n.ycn-composite-bar-item_type_action:hover {\n background-color: var(--yc-color-base-float-hover);\n}\n.ycn-composite-bar-item_type_action:active {\n box-shadow: 0 1px 2px var(--yc-color-sfx-shadow);\n transition: none;\n transform: scale(0.96);\n}\n.ycn-composite-bar-item_type_action .ycn-composite-bar-item__icon-place {\n width: var(--composite-bar-item-action-size);\n}\n.ycn-composite-bar-item_type_action .ycn-composite-bar-item__title {\n margin-right: 16px;\n}\n.ycn-composite-bar-item__icon-tooltip_item-type_action {\n margin-left: 10px;\n}\n.ycn-composite-bar-item:not(.ycn-composite-bar-item_compact).ycn-composite-bar-item_current.ycn-composite-bar-item_type_regular {\n background-color: var(--yc-color-base-selection);\n}\n.ycn-composite-bar-item:not(.ycn-composite-bar-item_compact):not(.ycn-composite-bar-item_current):hover.ycn-composite-bar-item_type_regular {\n background-color: var(--yc-color-base-simple-hover);\n}\n.ycn-composite-bar-item_compact.ycn-composite-bar-item_type_action {\n width: var(--composite-bar-item-action-size);\n}\n.ycn-composite-bar-item_compact.ycn-composite-bar-item_type_action .ycn-composite-bar-item__title {\n margin: 0;\n}\n.ycn-composite-bar-item_compact.ycn-composite-bar-item_current.ycn-composite-bar-item_type_regular .ycn-composite-bar-item__btn-icon {\n position: relative;\n background-color: transparent;\n}\n.ycn-composite-bar-item_compact.ycn-composite-bar-item_current.ycn-composite-bar-item_type_regular .ycn-composite-bar-item__btn-icon::before {\n content: \"\";\n position: absolute;\n top: 50%;\n left: 50%;\n z-index: -1;\n width: 38px;\n height: 38px;\n margin-top: -19px;\n margin-left: -19px;\n border-radius: 7px;\n}\n.ycn-composite-bar-item_compact.ycn-composite-bar-item_current.ycn-composite-bar-item_type_regular .ycn-composite-bar-item__btn-icon::before {\n background-color: var(--yc-color-base-selection);\n}\n.ycn-composite-bar-item_compact:not(.ycn-composite-bar-item_current):hover.ycn-composite-bar-item_type_regular .ycn-composite-bar-item__btn-icon {\n position: relative;\n background-color: transparent;\n}\n.ycn-composite-bar-item_compact:not(.ycn-composite-bar-item_current):hover.ycn-composite-bar-item_type_regular .ycn-composite-bar-item__btn-icon::before {\n content: \"\";\n position: absolute;\n top: 50%;\n left: 50%;\n z-index: -1;\n width: 38px;\n height: 38px;\n margin-top: -19px;\n margin-left: -19px;\n border-radius: 7px;\n}\n.ycn-composite-bar-item_compact:not(.ycn-composite-bar-item_current):hover.ycn-composite-bar-item_type_regular .ycn-composite-bar-item__btn-icon::before {\n background-color: var(--yc-color-base-simple-hover);\n}";
|
|
3802
|
+
styleInject(css_248z$8);
|
|
3829
3803
|
|
|
3830
|
-
const b$
|
|
3804
|
+
const b$9 = block('composite-bar-item');
|
|
3831
3805
|
function renderItemTitle(item) {
|
|
3832
|
-
let titleNode = React__default.createElement("div", { className: b$
|
|
3806
|
+
let titleNode = React__default.createElement("div", { className: b$9('title-text') }, item.title);
|
|
3833
3807
|
if (item.rightAdornment) {
|
|
3834
3808
|
titleNode = (React__default.createElement(React__default.Fragment, null,
|
|
3835
3809
|
titleNode,
|
|
3836
|
-
React__default.createElement("div", { className: b$
|
|
3810
|
+
React__default.createElement("div", { className: b$9('title-adornment') }, item.rightAdornment)));
|
|
3837
3811
|
}
|
|
3838
3812
|
return titleNode;
|
|
3839
3813
|
}
|
|
3840
3814
|
const defaultPopupPlacement = ['right-end'];
|
|
3841
3815
|
const defaultPopupOffset = [-20, 8];
|
|
3842
3816
|
const Item = (props) => {
|
|
3843
|
-
const { item, compact, className, collapseItems, onMouseLeave, onMouseEnter, enableTooltip = true, popupVisible = false, popupAnchor, popupPlacement = defaultPopupPlacement, popupOffset = defaultPopupOffset, renderPopupContent, onClosePopup, onItemClick, } = props;
|
|
3817
|
+
const { item, compact, className, collapseItems, onMouseLeave, onMouseEnter, enableTooltip = true, popupVisible = false, popupAnchor, popupPlacement = defaultPopupPlacement, popupOffset = defaultPopupOffset, popupKeepMounted, renderPopupContent, onClosePopup, onItemClick, } = props;
|
|
3844
3818
|
if (item.type === 'divider') {
|
|
3845
|
-
return React__default.createElement("div", { className: b$
|
|
3819
|
+
return React__default.createElement("div", { className: b$9('menu-divider') });
|
|
3846
3820
|
}
|
|
3847
3821
|
const [open, toggleOpen] = React__default.useState(false);
|
|
3848
3822
|
const ref = React__default.useRef(null);
|
|
@@ -3863,7 +3837,7 @@ const Item = (props) => {
|
|
|
3863
3837
|
onClosePopup === null || onClosePopup === void 0 ? void 0 : onClosePopup();
|
|
3864
3838
|
}, [onClosePopup]);
|
|
3865
3839
|
const makeNode = ({ icon: iconEl, title: titleEl }) => {
|
|
3866
|
-
const createdNode = (React__default.createElement("div", { className: b$
|
|
3840
|
+
const createdNode = (React__default.createElement("div", { className: b$9({ type, current, compact }, className), ref: ref, onClick: () => {
|
|
3867
3841
|
if (collapsedItem) {
|
|
3868
3842
|
/**
|
|
3869
3843
|
* If we call onItemClick for collapsedItem then:
|
|
@@ -3884,13 +3858,13 @@ const Item = (props) => {
|
|
|
3884
3858
|
onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave();
|
|
3885
3859
|
}
|
|
3886
3860
|
} },
|
|
3887
|
-
React__default.createElement("div", { className: b$
|
|
3888
|
-
React__default.createElement("div", { onMouseEnter: () => onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(), onMouseLeave: () => onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave(), className: b$
|
|
3889
|
-
React__default.createElement("div", { className: b$
|
|
3890
|
-
renderPopupContent && Boolean(anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current) && (React__default.createElement(Popup, { className: b$
|
|
3891
|
-
return item.link ? (React__default.createElement("a", { href: item.link, className: b$
|
|
3861
|
+
React__default.createElement("div", { className: b$9('icon-place') }, compact ? (React__default.createElement(Tooltip, { content: tooltipText, disabled: !enableTooltip || (collapsedItem && open), placement: "right", className: b$9('icon-tooltip', { 'item-type': type }) },
|
|
3862
|
+
React__default.createElement("div", { onMouseEnter: () => onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(), onMouseLeave: () => onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave(), className: b$9('btn-icon') }, iconEl))) : (iconEl)),
|
|
3863
|
+
React__default.createElement("div", { className: b$9('title'), title: typeof item.title === 'string' ? item.title : undefined }, titleEl),
|
|
3864
|
+
renderPopupContent && Boolean(anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current) && (React__default.createElement(Popup, { className: b$9('popup'), open: popupVisible, keepMounted: popupKeepMounted, placement: popupPlacement, offset: popupOffset, anchorRef: anchorRef, onClose: onClose }, renderPopupContent()))));
|
|
3865
|
+
return item.link ? (React__default.createElement("a", { href: item.link, className: b$9('link') }, createdNode)) : (createdNode);
|
|
3892
3866
|
};
|
|
3893
|
-
const iconNode = icon ? React__default.createElement(Icon, { data: icon, size: iconSize, className: b$
|
|
3867
|
+
const iconNode = icon ? React__default.createElement(Icon, { data: icon, size: iconSize, className: b$9('icon') }) : null;
|
|
3894
3868
|
const titleNode = renderItemTitle(item);
|
|
3895
3869
|
const params = { icon: iconNode, title: titleNode };
|
|
3896
3870
|
let node;
|
|
@@ -3908,13 +3882,13 @@ const Item = (props) => {
|
|
|
3908
3882
|
Item.displayName = 'Item';
|
|
3909
3883
|
function CollapsedPopup({ compact, onItemClick, collapseItems, anchorRef, onClose, }) {
|
|
3910
3884
|
return (collapseItems === null || collapseItems === void 0 ? void 0 : collapseItems.length) ? (React__default.createElement(Popup, { placement: POPUP_PLACEMENT, open: true, anchorRef: anchorRef, onClose: onClose },
|
|
3911
|
-
React__default.createElement("div", { className: b$
|
|
3912
|
-
React__default.createElement(List, { itemClassName: b$
|
|
3885
|
+
React__default.createElement("div", { className: b$9('collapse-items-popup-content') },
|
|
3886
|
+
React__default.createElement(List, { itemClassName: b$9('root-collapse-item'), items: collapseItems, selectedItemIndex: getSelectedItemIndex(collapseItems), itemHeight: POPUP_ITEM_HEIGHT, itemsHeight: collapseItems.length * POPUP_ITEM_HEIGHT, virtualized: false, filterable: false, sortable: false, renderItem: (collapseItem) => {
|
|
3913
3887
|
const makeCollapseNode = ({ title: titleEl }) => {
|
|
3914
|
-
const res = (React__default.createElement("div", { className: b$
|
|
3888
|
+
const res = (React__default.createElement("div", { className: b$9('collapse-item'), onClick: () => {
|
|
3915
3889
|
onItemClick === null || onItemClick === void 0 ? void 0 : onItemClick(collapseItem, true);
|
|
3916
3890
|
} }, titleEl));
|
|
3917
|
-
return collapseItem.link ? (React__default.createElement("a", { href: collapseItem.link, className: b$
|
|
3891
|
+
return collapseItem.link ? (React__default.createElement("a", { href: collapseItem.link, className: b$9('link') }, res)) : (res);
|
|
3918
3892
|
};
|
|
3919
3893
|
const titleNode = renderItemTitle(collapseItem);
|
|
3920
3894
|
const params = { title: titleNode };
|
|
@@ -3944,10 +3918,10 @@ var SvgDots = function SvgDots(props) {
|
|
|
3944
3918
|
};
|
|
3945
3919
|
var dotsIcon = SvgDots;
|
|
3946
3920
|
|
|
3947
|
-
var css_248z$
|
|
3948
|
-
styleInject(css_248z$
|
|
3921
|
+
var css_248z$7 = ".ycn-composite-bar {\n flex: 1 0 auto;\n width: 100%;\n min-height: 40px;\n}\n.ycn-composite-bar .ycn-composite-bar__root-menu-item[class] {\n background-color: transparent;\n}";
|
|
3922
|
+
styleInject(css_248z$7);
|
|
3949
3923
|
|
|
3950
|
-
const b$
|
|
3924
|
+
const b$8 = block('composite-bar');
|
|
3951
3925
|
class CompositeBar extends React__default.Component {
|
|
3952
3926
|
constructor() {
|
|
3953
3927
|
super(...arguments);
|
|
@@ -3962,10 +3936,10 @@ class CompositeBar extends React__default.Component {
|
|
|
3962
3936
|
return null;
|
|
3963
3937
|
}
|
|
3964
3938
|
if (!enableCollapsing) {
|
|
3965
|
-
return React__default.createElement("div", { className: b$
|
|
3939
|
+
return React__default.createElement("div", { className: b$8() }, this.renderMenu());
|
|
3966
3940
|
}
|
|
3967
3941
|
const minHeight = getItemsMinHeight(items);
|
|
3968
|
-
return (React__default.createElement("div", { className: b$
|
|
3942
|
+
return (React__default.createElement("div", { className: b$8({ autosizer: true }), style: { minHeight } }, items.length !== 0 && (React__default.createElement(AutoSizer, null, ({ width, height }) => {
|
|
3969
3943
|
const style = {
|
|
3970
3944
|
width,
|
|
3971
3945
|
height,
|
|
@@ -3976,7 +3950,7 @@ class CompositeBar extends React__default.Component {
|
|
|
3976
3950
|
renderAutosizeMenu(height) {
|
|
3977
3951
|
const { compact, onItemClick } = this.props;
|
|
3978
3952
|
const { listItems, collapseItems } = this.getAutosizeListItems(height);
|
|
3979
|
-
return (React__default.createElement(List, { ref: this.listRef, items: listItems, selectedItemIndex: getSelectedItemIndex(listItems), itemHeight: getItemHeight, itemClassName: b$
|
|
3953
|
+
return (React__default.createElement(List, { ref: this.listRef, items: listItems, selectedItemIndex: getSelectedItemIndex(listItems), itemHeight: getItemHeight, itemClassName: b$8('root-menu-item'), itemsHeight: getItemsHeight, virtualized: false, filterable: false, sortable: false, renderItem: (item) => (React__default.createElement(Item, { item: item, onMouseLeave: () => {
|
|
3980
3954
|
var _a;
|
|
3981
3955
|
if (compact) {
|
|
3982
3956
|
(_a = this.listRef.current) === null || _a === void 0 ? void 0 : _a.activateItem(undefined);
|
|
@@ -3985,7 +3959,7 @@ class CompositeBar extends React__default.Component {
|
|
|
3985
3959
|
}
|
|
3986
3960
|
renderMenu() {
|
|
3987
3961
|
const { items, onItemClick, compact } = this.props;
|
|
3988
|
-
return (React__default.createElement(List, { ref: this.listRef, items: items, selectedItemIndex: getSelectedItemIndex(items), itemHeight: getItemHeight, itemClassName: b$
|
|
3962
|
+
return (React__default.createElement(List, { ref: this.listRef, items: items, selectedItemIndex: getSelectedItemIndex(items), itemHeight: getItemHeight, itemClassName: b$8('root-menu-item'), itemsHeight: getItemsHeight, virtualized: false, filterable: false, sortable: false, renderItem: (item) => (React__default.createElement(Item, { item: item, onMouseLeave: () => {
|
|
3989
3963
|
var _a;
|
|
3990
3964
|
if (compact) {
|
|
3991
3965
|
(_a = this.listRef.current) === null || _a === void 0 ? void 0 : _a.activateItem(undefined);
|
|
@@ -3995,7 +3969,7 @@ class CompositeBar extends React__default.Component {
|
|
|
3995
3969
|
getMoreButtonItem() {
|
|
3996
3970
|
var _a;
|
|
3997
3971
|
const { dict } = this.props;
|
|
3998
|
-
const title = (_a = dict === null || dict === void 0 ? void 0 : dict[Dict.MoreButton]) !== null && _a !== void 0 ? _a : defaultDict$
|
|
3972
|
+
const title = (_a = dict === null || dict === void 0 ? void 0 : dict[Dict.MoreButton]) !== null && _a !== void 0 ? _a : defaultDict$2[Dict.MoreButton];
|
|
3999
3973
|
return {
|
|
4000
3974
|
id: COLLAPSE_ITEM_ID,
|
|
4001
3975
|
title,
|
|
@@ -4004,6 +3978,7 @@ class CompositeBar extends React__default.Component {
|
|
|
4004
3978
|
};
|
|
4005
3979
|
}
|
|
4006
3980
|
getAutosizeListItems(height) {
|
|
3981
|
+
var _a, _b, _c;
|
|
4007
3982
|
const { items } = this.props;
|
|
4008
3983
|
const afterMoreButtonItems = items.filter((item) => item.afterMoreButton);
|
|
4009
3984
|
const regularItems = items.filter((item) => !item.afterMoreButton);
|
|
@@ -4028,7 +4003,7 @@ class CompositeBar extends React__default.Component {
|
|
|
4028
4003
|
continue;
|
|
4029
4004
|
}
|
|
4030
4005
|
if (item.type === 'divider') {
|
|
4031
|
-
if (index + 1 < listItems.length && listItems[index + 1].type === 'divider') {
|
|
4006
|
+
if (index + 1 < listItems.length && ((_a = listItems[index + 1]) === null || _a === void 0 ? void 0 : _a.type) === 'divider') {
|
|
4032
4007
|
listHeight -= getItemHeight(item);
|
|
4033
4008
|
listItems.splice(index, 1);
|
|
4034
4009
|
}
|
|
@@ -4037,8 +4012,8 @@ class CompositeBar extends React__default.Component {
|
|
|
4037
4012
|
listHeight -= getItemHeight(item);
|
|
4038
4013
|
collapseItems.unshift(...listItems.splice(index, 1));
|
|
4039
4014
|
}
|
|
4040
|
-
if (listItems[index].type === 'divider' &&
|
|
4041
|
-
(index === 0 || listItems[index - 1].type === 'divider')) {
|
|
4015
|
+
if (((_b = listItems[index]) === null || _b === void 0 ? void 0 : _b.type) === 'divider' &&
|
|
4016
|
+
(index === 0 || ((_c = listItems[index - 1]) === null || _c === void 0 ? void 0 : _c.type) === 'divider')) {
|
|
4042
4017
|
listItems.splice(index, 1);
|
|
4043
4018
|
}
|
|
4044
4019
|
return { listItems, collapseItems };
|
|
@@ -4084,10 +4059,10 @@ var SvgDividerCollapsed = function SvgDividerCollapsed(props) {
|
|
|
4084
4059
|
};
|
|
4085
4060
|
var headerDividerCollapsedIcon = SvgDividerCollapsed;
|
|
4086
4061
|
|
|
4087
|
-
var css_248z$
|
|
4088
|
-
styleInject(css_248z$
|
|
4062
|
+
var css_248z$6 = ".yc-root {\n --aside-header-background-color: var(--yc-color-base-info);\n --aside-header-collapse-button-divider-line-color: var(\n --aside-header-header-divider-line-color\n );\n}\n\n.yc-root_theme_light,\n.yc-root_theme_light-hc {\n --aside-header-divider-line-color: transparent;\n --aside-header-header-divider-line-color: var(--yc-color-line-generic);\n}\n\n.yc-root_theme_dark,\n.yc-root_theme_dark-hc {\n --aside-header-divider-line-color: var(--yc-color-line-solid);\n --aside-header-header-divider-line-color: var(--yc-color-line-solid);\n}\n\n.ycn-aside-header {\n --aside-header-min-width: 56px;\n height: 100%;\n width: 100%;\n position: relative;\n background-color: var(--yc-color-base-background);\n}\n.ycn-aside-header__aside {\n position: sticky;\n top: 0;\n left: 0;\n height: 100vh;\n width: inherit;\n display: flex;\n flex-direction: column;\n background-color: var(--yc-color-base-background);\n z-index: 100;\n box-sizing: border-box;\n}\n.ycn-aside-header__aside::after {\n position: absolute;\n top: 0;\n right: 0;\n z-index: 2;\n width: 1px;\n height: 100%;\n content: \"\";\n background-color: var(--aside-header-divider-line-color);\n}\n.ycn-aside-header__aside-popup-anchor {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 1;\n}\n.ycn-aside-header__aside-content {\n --gradient-height: 334px;\n display: flex;\n flex-direction: column;\n overflow-x: hidden;\n width: inherit;\n height: inherit;\n position: relative;\n z-index: 2;\n user-select: none;\n}\n.ycn-aside-header__aside-content::after {\n position: absolute;\n top: 0;\n right: -100px;\n bottom: 0;\n width: 100px;\n content: \"\";\n box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.1), 0px 0px 24px rgba(0, 0, 0, 0.08);\n}\n.ycn-aside-header__aside-content > .ycn-aside-header-logo {\n margin: 8px 0;\n}\n.ycn-aside-header__aside-content_with-decoration {\n background: linear-gradient(180deg, var(--aside-header-background-color) calc(var(--gradient-height) * 0.33), transparent calc(var(--gradient-height) * 0.88));\n}\n.ycn-aside-header_compact .ycn-aside-header__aside-content {\n background: transparent;\n}\n.ycn-aside-header__header {\n --aside-header-header-divider-height: 29px;\n position: relative;\n z-index: 1;\n flex: none;\n box-sizing: border-box;\n width: 100%;\n padding-top: 8px;\n padding-bottom: 22px;\n}\n.ycn-aside-header__header .ycn-aside-header__header-divider {\n position: absolute;\n bottom: 0;\n left: 0;\n z-index: -2;\n display: none;\n color: var(--aside-header-background-color);\n}\n.ycn-aside-header__header_with-decoration::before {\n position: absolute;\n top: 0;\n left: 0;\n z-index: -2;\n display: none;\n width: 100%;\n height: calc(100% - var(--aside-header-header-divider-height));\n content: \"\";\n background-color: var(--aside-header-background-color);\n}\n.ycn-aside-header__header::after {\n position: absolute;\n bottom: 12px;\n left: 0;\n z-index: -2;\n width: 100%;\n height: 1px;\n content: \"\";\n background-color: var(--aside-header-header-divider-line-color);\n}\n.ycn-aside-header_compact .ycn-aside-header__header::before {\n display: block;\n}\n.ycn-aside-header_compact .ycn-aside-header__header_with-decoration .ycn-aside-header__header-divider {\n display: block;\n}\n.ycn-aside-header_compact .ycn-aside-header__header_with-decoration::after {\n display: none;\n}\n.ycn-aside-header__menu-items {\n flex-grow: 1;\n}\n.ycn-aside-header__footer {\n flex-shrink: 0;\n width: 100%;\n margin: 8px 0;\n display: flex;\n flex-direction: column;\n}\n.ycn-aside-header__panels {\n z-index: 98;\n position: fixed;\n left: 0;\n right: 0;\n bottom: 0;\n top: 0;\n overflow: auto;\n}\n.ycn-aside-header__panel {\n height: 100%;\n}\n.ycn-aside-header__pane-container {\n display: flex;\n outline: none;\n overflow: visible;\n user-select: text;\n flex-direction: row;\n}\n.ycn-aside-header__content {\n width: calc(100% - var(--aside-header-size));\n z-index: 95;\n}\n.ycn-aside-header__collapse-button {\n --yc-button-background-color-hover: transparent;\n overflow: hidden;\n box-sizing: border-box;\n flex: none;\n width: 100%;\n height: 20px;\n border-top: 1px solid var(--aside-header-collapse-button-divider-line-color);\n margin-top: auto;\n}\n.ycn-aside-header__collapse-button:not(.ycn-aside-header__collapse-button_compact) .ycn-aside-header__collapse-icon {\n transform: rotate(180deg);\n}\n.ycn-aside-header__collapse-button .ycn-aside-header__collapse-icon {\n color: var(--yc-color-text-secondary);\n}\n.ycn-aside-header__collapse-button:hover .ycn-aside-header__collapse-icon {\n color: var(--yc-color-text-primary);\n}";
|
|
4063
|
+
styleInject(css_248z$6);
|
|
4089
4064
|
|
|
4090
|
-
const b$
|
|
4065
|
+
const b$7 = block('aside-header');
|
|
4091
4066
|
class AsideHeader extends React__default.Component {
|
|
4092
4067
|
constructor() {
|
|
4093
4068
|
super(...arguments);
|
|
@@ -4095,26 +4070,26 @@ class AsideHeader extends React__default.Component {
|
|
|
4095
4070
|
this.renderFirstPane = (size) => {
|
|
4096
4071
|
const { dict, menuItems, panelItems, compact, headerDecoration } = this.props;
|
|
4097
4072
|
return (React__default.createElement(React__default.Fragment, null,
|
|
4098
|
-
React__default.createElement("div", { className: b$
|
|
4099
|
-
React__default.createElement("div", { className: b$
|
|
4100
|
-
React__default.createElement("div", { className: b$
|
|
4073
|
+
React__default.createElement("div", { className: b$7('aside'), style: { width: size } },
|
|
4074
|
+
React__default.createElement("div", { className: b$7('aside-popup-anchor'), ref: this.asideRef }),
|
|
4075
|
+
React__default.createElement("div", { className: b$7('aside-content', { ['with-decoration']: headerDecoration }) },
|
|
4101
4076
|
this.renderHeader(),
|
|
4102
|
-
(menuItems === null || menuItems === void 0 ? void 0 : menuItems.length) ? (React__default.createElement(CompositeBar, { items: menuItems, compact: compact, enableCollapsing: true, dict: dict, onItemClick: this.onItemClick })) : (React__default.createElement("div", { className: b$
|
|
4077
|
+
(menuItems === null || menuItems === void 0 ? void 0 : menuItems.length) ? (React__default.createElement(CompositeBar, { items: menuItems, compact: compact, enableCollapsing: true, dict: dict, onItemClick: this.onItemClick })) : (React__default.createElement("div", { className: b$7('menu-items') })),
|
|
4103
4078
|
this.renderFooter(size),
|
|
4104
4079
|
this.renderCollapseButton())),
|
|
4105
4080
|
panelItems && this.renderPanels(size)));
|
|
4106
4081
|
};
|
|
4107
4082
|
this.renderSecondPane = (size) => {
|
|
4108
|
-
return (React__default.createElement(Content, { size: size, renderContent: this.props.renderContent, className: b$
|
|
4083
|
+
return (React__default.createElement(Content, { size: size, renderContent: this.props.renderContent, className: b$7('content') }));
|
|
4109
4084
|
};
|
|
4110
4085
|
this.renderLogo = () => (React__default.createElement(Logo, Object.assign({}, this.props.logo, { compact: this.props.compact, onClick: this.onLogoClick })));
|
|
4111
|
-
this.renderHeader = () => (React__default.createElement("div", { className: b$
|
|
4086
|
+
this.renderHeader = () => (React__default.createElement("div", { className: b$7('header', { ['with-decoration']: this.props.headerDecoration }) },
|
|
4112
4087
|
this.renderLogo(),
|
|
4113
4088
|
React__default.createElement(CompositeBar, { items: this.props.subheaderItems, compact: this.props.compact, enableCollapsing: false, onItemClick: this.onItemClick }),
|
|
4114
|
-
React__default.createElement(Icon, { data: headerDividerCollapsedIcon, className: b$
|
|
4089
|
+
React__default.createElement(Icon, { data: headerDividerCollapsedIcon, className: b$7('header-divider'), width: ASIDE_HEADER_COMPACT_WIDTH, height: "29" })));
|
|
4115
4090
|
this.renderFooter = (size) => {
|
|
4116
4091
|
const { compact, renderFooter } = this.props;
|
|
4117
|
-
return (React__default.createElement("div", { className: b$
|
|
4092
|
+
return (React__default.createElement("div", { className: b$7('footer') }, renderFooter === null || renderFooter === void 0 ? void 0 : renderFooter({
|
|
4118
4093
|
size,
|
|
4119
4094
|
compact,
|
|
4120
4095
|
asideRef: this.asideRef,
|
|
@@ -4122,14 +4097,14 @@ class AsideHeader extends React__default.Component {
|
|
|
4122
4097
|
};
|
|
4123
4098
|
this.renderPanels = (size) => {
|
|
4124
4099
|
const { panelItems } = this.props;
|
|
4125
|
-
return (React__default.createElement(Drawer, { className: b$
|
|
4100
|
+
return (React__default.createElement(Drawer, { className: b$7('panels'), onVeilClick: this.onCloseDrawer, onEscape: this.onCloseDrawer, style: { left: size } }, panelItems.map((item) => (React__default.createElement(DrawerItem, Object.assign({ key: item.id }, item))))));
|
|
4126
4101
|
};
|
|
4127
4102
|
this.renderCollapseButton = () => {
|
|
4128
4103
|
var _a;
|
|
4129
4104
|
const { compact, dict } = this.props;
|
|
4130
4105
|
const typeButton = compact ? Dict.ExpandButton : Dict.CollapseButton;
|
|
4131
|
-
return (React__default.createElement(Button, { className: b$
|
|
4132
|
-
React__default.createElement(Icon, { data: controlMenuButtonIcon, className: b$
|
|
4106
|
+
return (React__default.createElement(Button, { className: b$7('collapse-button', { compact }), view: "flat", onClick: this.onCollapseButtonClick, title: (_a = dict === null || dict === void 0 ? void 0 : dict[typeButton]) !== null && _a !== void 0 ? _a : defaultDict$2[typeButton] },
|
|
4107
|
+
React__default.createElement(Icon, { data: controlMenuButtonIcon, className: b$7('collapse-icon'), width: "16", height: "10" })));
|
|
4133
4108
|
};
|
|
4134
4109
|
this.onCollapseButtonClick = () => {
|
|
4135
4110
|
var _a, _b;
|
|
@@ -4153,8 +4128,8 @@ class AsideHeader extends React__default.Component {
|
|
|
4153
4128
|
render() {
|
|
4154
4129
|
const { className, compact } = this.props;
|
|
4155
4130
|
const size = compact ? ASIDE_HEADER_COMPACT_WIDTH : ASIDE_HEADER_EXPANDED_WIDTH;
|
|
4156
|
-
return (React__default.createElement("div", { className: b$
|
|
4157
|
-
React__default.createElement("div", { className: b$
|
|
4131
|
+
return (React__default.createElement("div", { className: b$7({ compact }, className) },
|
|
4132
|
+
React__default.createElement("div", { className: b$7('pane-container') },
|
|
4158
4133
|
this.renderFirstPane(size),
|
|
4159
4134
|
this.renderSecondPane(size))));
|
|
4160
4135
|
}
|
|
@@ -4193,15 +4168,84 @@ function __rest(s, e) {
|
|
|
4193
4168
|
return t;
|
|
4194
4169
|
}
|
|
4195
4170
|
|
|
4196
|
-
var css_248z$
|
|
4197
|
-
styleInject(css_248z$
|
|
4171
|
+
var css_248z$5 = ".ycn-footer-item {\n width: 100%;\n height: 40px;\n}";
|
|
4172
|
+
styleInject(css_248z$5);
|
|
4198
4173
|
|
|
4199
|
-
const b$
|
|
4174
|
+
const b$6 = block('footer-item');
|
|
4200
4175
|
const FooterItem = (_a) => {
|
|
4201
4176
|
var { item } = _a, props = __rest(_a, ["item"]);
|
|
4202
|
-
return (React__default.createElement(Item, Object.assign({}, props, { item: Object.assign({ iconSize: ASIDE_HEADER_FOOTER_ICON_SIZE }, item), className: b$
|
|
4177
|
+
return (React__default.createElement(Item, Object.assign({}, props, { item: Object.assign({ iconSize: ASIDE_HEADER_FOOTER_ICON_SIZE }, item), className: b$6({ compact: props.compact }), onItemClick: item.onItemClick })));
|
|
4203
4178
|
};
|
|
4204
4179
|
|
|
4180
|
+
var css_248z$4 = ".ycn-title {\n box-sizing: border-box;\n padding: 14px 10px 14px 20px;\n min-height: 64px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n}\n.ycn-title_separator {\n border-bottom: 1px solid var(--yc-color-line-generic);\n}\n.ycn-title__text {\n margin: 0;\n margin-right: 20px;\n}";
|
|
4181
|
+
styleInject(css_248z$4);
|
|
4182
|
+
|
|
4183
|
+
const b$5 = block('title');
|
|
4184
|
+
const defaultDict$1 = {
|
|
4185
|
+
close: 'Close',
|
|
4186
|
+
};
|
|
4187
|
+
const Title = ({ children, closeIconSize = 23, hasSeparator, dict = defaultDict$1, onClose, }) => {
|
|
4188
|
+
return (React__default.createElement("div", { className: b$5({ separator: hasSeparator }) },
|
|
4189
|
+
React__default.createElement(Text, { className: b$5('text'), as: 'h3', variant: 'subheader-3' }, children),
|
|
4190
|
+
onClose && (React__default.createElement(Button, { onClick: onClose, view: "flat", size: "l", extraProps: {
|
|
4191
|
+
'aria-label': dict['close'],
|
|
4192
|
+
} },
|
|
4193
|
+
React__default.createElement(Icon, { data: Xmark, size: closeIconSize })))));
|
|
4194
|
+
};
|
|
4195
|
+
Title.displayName = 'Title';
|
|
4196
|
+
|
|
4197
|
+
function flattenHotkeyGroups(hotkeys) {
|
|
4198
|
+
const result = [];
|
|
4199
|
+
for (const hotkeysGroup of hotkeys) {
|
|
4200
|
+
result.push({
|
|
4201
|
+
title: hotkeysGroup.title,
|
|
4202
|
+
group: true,
|
|
4203
|
+
});
|
|
4204
|
+
result.push(...hotkeysGroup.items);
|
|
4205
|
+
}
|
|
4206
|
+
return result;
|
|
4207
|
+
}
|
|
4208
|
+
|
|
4209
|
+
function filterHotkeys(hotkeys, filter) {
|
|
4210
|
+
if (filter) {
|
|
4211
|
+
const result = [];
|
|
4212
|
+
const normalizedFilter = filter.toLowerCase();
|
|
4213
|
+
for (const hotkeysBlock of hotkeys) {
|
|
4214
|
+
const filteredItems = hotkeysBlock.items.filter((item) => item.title.toLowerCase().includes(normalizedFilter));
|
|
4215
|
+
if (filteredItems.length > 0) {
|
|
4216
|
+
result.push(Object.assign(Object.assign({}, hotkeysBlock), { items: filteredItems }));
|
|
4217
|
+
}
|
|
4218
|
+
}
|
|
4219
|
+
return result;
|
|
4220
|
+
}
|
|
4221
|
+
return hotkeys;
|
|
4222
|
+
}
|
|
4223
|
+
|
|
4224
|
+
var css_248z$3 = ".ycn-hotkeys-panel {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n --hotkeys-panel-width: 400px;\n --hotkeys-panel-vertical-padding: 18px;\n --hotkeys-panel-horizontal-padding: 24px;\n}\n.ycn-hotkeys-panel__drawer-item {\n width: var(--hotkeys-panel-width);\n padding: var(--hotkeys-panel-vertical-padding) 0;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n}\n.ycn-hotkeys-panel__title {\n margin: 0 var(--hotkeys-panel-horizontal-padding) 16px var(--hotkeys-panel-horizontal-padding);\n}\n.ycn-hotkeys-panel__search {\n padding: 0 var(--hotkeys-panel-horizontal-padding);\n margin-bottom: 14px;\n}\n.ycn-hotkeys-panel__list {\n flex: 1;\n overflow-y: auto;\n}\n.ycn-hotkeys-panel__item {\n height: auto;\n padding: 8px var(--hotkeys-panel-horizontal-padding);\n}\n.ycn-hotkeys-panel__item.yc-list__item_active {\n background: inherit;\n}\n.ycn-hotkeys-panel__item-content {\n display: flex;\n align-items: baseline;\n justify-content: space-between;\n width: 100%;\n font-size: var(--yc-text-body-1-font-size);\n line-height: var(--yc-text-body-1-line-height);\n color: var(--yc-color-text-primary);\n}\n.ycn-hotkeys-panel__item-content_group {\n font-size: var(--yc-text-body-2-font-size);\n font-weight: 500;\n line-height: var(--yc-text-body-2-line-height);\n}\n.ycn-hotkeys-panel__hotkey {\n color: var(--yc-color-text-complementary);\n}";
|
|
4225
|
+
styleInject(css_248z$3);
|
|
4226
|
+
|
|
4227
|
+
const b$4 = block('hotkeys-panel');
|
|
4228
|
+
function HotkeysPanel(_a) {
|
|
4229
|
+
var { visible, onClose, leftOffset, topOffset, className, preventScrollBody, hotkeys, itemClassName, filterPlaceholder, title, emptyState } = _a, listProps = __rest(_a, ["visible", "onClose", "leftOffset", "topOffset", "className", "preventScrollBody", "hotkeys", "itemClassName", "filterPlaceholder", "title", "emptyState"]);
|
|
4230
|
+
const [filter, setFilter] = useState('');
|
|
4231
|
+
const hotkeysList = useMemo(() => {
|
|
4232
|
+
const filteredHotkeys = filterHotkeys(hotkeys, filter);
|
|
4233
|
+
return flattenHotkeyGroups(filteredHotkeys);
|
|
4234
|
+
}, [hotkeys, filter]);
|
|
4235
|
+
const renderItem = useCallback((item) => (React__default.createElement("div", { className: b$4('item-content', { group: item.group }), key: item.title },
|
|
4236
|
+
item.title,
|
|
4237
|
+
item.value && React__default.createElement(Hotkey, { className: b$4('hotkey'), value: item.value }))), []);
|
|
4238
|
+
const drawerItemContent = (React__default.createElement(React__default.Fragment, null,
|
|
4239
|
+
React__default.createElement("h2", { className: b$4('title') }, title),
|
|
4240
|
+
React__default.createElement(TextInput, { value: filter, onUpdate: setFilter, placeholder: filterPlaceholder, autoFocus: true, className: b$4('search') }),
|
|
4241
|
+
React__default.createElement(List, Object.assign({ className: b$4('list'), virtualized: false, filterable: false, items: hotkeysList, renderItem: renderItem, itemClassName: b$4('item', itemClassName), emptyPlaceholder: emptyState }, listProps))));
|
|
4242
|
+
return (React__default.createElement(Drawer, { className: b$4(null, className), onVeilClick: onClose, onEscape: onClose, preventScrollBody: preventScrollBody, style: {
|
|
4243
|
+
left: leftOffset,
|
|
4244
|
+
top: topOffset,
|
|
4245
|
+
} },
|
|
4246
|
+
React__default.createElement(DrawerItem, { id: "hotkeys", visible: visible, className: b$4('drawer-item'), content: drawerItemContent })));
|
|
4247
|
+
}
|
|
4248
|
+
|
|
4205
4249
|
/**
|
|
4206
4250
|
* This method returns the first argument it receives.
|
|
4207
4251
|
*
|
|
@@ -5027,7 +5071,7 @@ function getSettingsItemsFromChildren(children, filterRe) {
|
|
|
5027
5071
|
return { items, hidden };
|
|
5028
5072
|
}
|
|
5029
5073
|
|
|
5030
|
-
var css_248z = ".ycn-settings {\n display: grid;\n grid-template-columns: 216px 1fr;\n width: 834px;\n height: 100%;\n}\n.ycn-settings_view_mobile {\n display: block;\n width: auto;\n height: calc(
|
|
5074
|
+
var css_248z = ".ycn-settings {\n display: grid;\n grid-template-columns: 216px 1fr;\n width: 834px;\n height: 100%;\n}\n.ycn-settings_view_mobile {\n display: block;\n width: auto;\n height: calc(80vh - 56px);\n overflow-x: hidden;\n}\n@supports (height: 90dvh) {\n .ycn-settings_view_mobile {\n /* stylelint-disable-next-line */\n height: calc(90dvh - 56px);\n }\n}\n.ycn-settings_view_mobile.ycn-settings_loading {\n text-align: center;\n}\n.ycn-settings_view_mobile .ycn-settings__loader {\n margin-top: 20px;\n}\n.ycn-settings_view_mobile .ycn-settings__search {\n padding: 0 20px;\n margin: 4px 0 16px;\n}\n.ycn-settings_view_mobile .ycn-settings__page {\n overflow-y: visible;\n}\n.ycn-settings_view_mobile .ycn-settings__tabs .yc-tabs__item:first-child {\n margin-left: 20px;\n}\n.ycn-settings_view_mobile .ycn-settings__tabs .yc-tabs__item:last-child {\n margin-right: 20px;\n}\n.ycn-settings_view_mobile .ycn-settings__section-heading {\n font-size: var(--yc-text-subheader-3-font-size);\n line-height: var(--yc-text-subheader-3-line-height);\n font-weight: var(--yc-text-subheader-font-weight);\n}\n.ycn-settings_view_mobile .ycn-settings__section-subheader {\n color: var(--yc-color-text-secondary);\n}\n.ycn-settings_view_mobile .ycn-settings__section-heading + .ycn-settings-subheader {\n margin-top: 8px;\n}\n.ycn-settings_view_mobile .ycn-settings__section-item {\n margin-top: 0;\n}\n.ycn-settings_view_mobile .ycn-settings__section-heading + .ycn-settings__section-item, .ycn-settings_view_mobile .ycn-settings__section-subheader + .ycn-settings__section-item {\n margin-top: 30px;\n}\n.ycn-settings_view_mobile .ycn-settings__section-item + .ycn-settings__section-item {\n margin-top: 22px;\n}\n.ycn-settings_view_mobile .ycn-settings__item:not(.ycn-settings_view_mobile .ycn-settings__item_mode_row) {\n grid-template-columns: 1fr;\n gap: 8px;\n}\n.ycn-settings_view_mobile .ycn-settings__item-heading {\n font-size: var(--yc-text-body-2-font-size);\n line-height: var(--yc-text-body-2-line-height);\n font-weight: var(--yc-text-body-font-weight);\n}\n.ycn-settings_view_mobile .ycn-settings__item-description {\n font-size: var(--yc-text-body-1-font-size);\n line-height: var(--yc-text-body-1-line-height);\n font-weight: var(--yc-text-body-font-weight);\n}\n.ycn-settings_view_mobile .ycn-settings__item_mode_row {\n grid-template-columns: 1fr auto;\n}\n.ycn-settings_view_mobile .ycn-settings__item_mode_row .ycn-settings__item-heading {\n padding-right: 20px;\n}\n.ycn-settings_view_mobile .ycn-settings__item-content {\n width: 100%;\n}\n.ycn-settings_loading {\n grid-template-columns: auto;\n}\n.ycn-settings__loader {\n align-self: center;\n justify-self: center;\n}\n.ycn-settings__not-found {\n display: grid;\n align-items: center;\n justify-items: center;\n height: 100%;\n}\n.ycn-settings__menu {\n border-right: 1px solid var(--yc-color-line-generic);\n}\n.ycn-settings__heading {\n font-size: var(--yc-text-subheader-2-font-size);\n line-height: var(--yc-text-subheader-2-line-height);\n font-weight: var(--yc-text-subheader-font-weight);\n margin: 20px 20px 0;\n}\n.ycn-settings__search {\n margin: 0 20px 16px;\n}\n.ycn-settings__page {\n overflow-y: auto;\n}\n.ycn-settings__content {\n padding: 20px;\n}\n.ycn-settings__section-heading {\n font-size: var(--yc-text-subheader-2-font-size);\n line-height: var(--yc-text-subheader-2-line-height);\n font-weight: var(--yc-text-subheader-font-weight);\n margin: 0;\n}\n.ycn-settings__section-item {\n margin-top: 24px;\n}\n.ycn-settings__section + .ycn-settings__section {\n margin-top: 32px;\n}\n.ycn-settings__item {\n display: grid;\n grid-template-columns: 216px 1fr;\n justify-items: start;\n}\n.ycn-settings__item_align_top {\n align-items: start;\n}\n.ycn-settings__item_align_center {\n align-items: center;\n}\n.ycn-settings__item-title_badge {\n position: relative;\n}\n.ycn-settings__item-title_badge::after {\n content: \"\";\n display: block;\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background-color: var(--yc-color-text-danger);\n position: absolute;\n right: -8px;\n top: 1px;\n}\n.ycn-settings__item-description {\n font-size: var(--yc-text-caption-2-font-size);\n line-height: var(--yc-text-caption-2-line-height);\n font-weight: var(--yc-text-caption-font-weight);\n display: block;\n margin-top: 2px;\n padding-right: 20px;\n color: var(--yc-color-text-secondary);\n}\n.ycn-settings__found {\n font-weight: var(--yc-text-accent-font-weight);\n background: var(--yc-color-base-selection);\n}";
|
|
5031
5075
|
styleInject(css_248z);
|
|
5032
5076
|
|
|
5033
5077
|
const b = block('settings');
|
|
@@ -5043,10 +5087,22 @@ function Settings(_a) {
|
|
|
5043
5087
|
}
|
|
5044
5088
|
return (React__default.createElement(SettingsContent, Object.assign({ view: view }, props), children));
|
|
5045
5089
|
}
|
|
5090
|
+
const getPageTitleById = (menu, activePage) => {
|
|
5091
|
+
for (const firstLevel of menu) {
|
|
5092
|
+
if ('groupTitle' in firstLevel) {
|
|
5093
|
+
for (const secondLevel of firstLevel.items)
|
|
5094
|
+
if (secondLevel.id === activePage)
|
|
5095
|
+
return secondLevel.title;
|
|
5096
|
+
}
|
|
5097
|
+
else if (firstLevel.id === activePage)
|
|
5098
|
+
return firstLevel.title;
|
|
5099
|
+
}
|
|
5100
|
+
return '';
|
|
5101
|
+
};
|
|
5046
5102
|
Settings.defaultProps = {
|
|
5047
5103
|
dict: defaultDict,
|
|
5048
5104
|
};
|
|
5049
|
-
function SettingsContent({ initialPage,
|
|
5105
|
+
function SettingsContent({ initialPage, children, renderNotFound, dict, view, onPageChange, onClose, }) {
|
|
5050
5106
|
var _a, _b;
|
|
5051
5107
|
const [search, setSearch] = React__default.useState('');
|
|
5052
5108
|
const { menu, pages } = getSettingsFromChildren(children, search);
|
|
@@ -5090,12 +5146,16 @@ function SettingsContent({ initialPage, onPageChange, children, renderNotFound,
|
|
|
5090
5146
|
if (!activePage) {
|
|
5091
5147
|
return typeof renderNotFound === 'function' ? (renderNotFound()) : (React__default.createElement("div", { className: b('not-found') }, dict === null || dict === void 0 ? void 0 : dict.not_found));
|
|
5092
5148
|
}
|
|
5093
|
-
|
|
5094
|
-
|
|
5095
|
-
|
|
5096
|
-
|
|
5097
|
-
|
|
5098
|
-
|
|
5149
|
+
const filteredSections = pages[activePage].sections.filter((section) => !section.hidden);
|
|
5150
|
+
return (React__default.createElement(React__default.Fragment, null,
|
|
5151
|
+
!isMobile && (React__default.createElement(Title, { hasSeparator: true, onClose: onClose }, getPageTitleById(menu, activePage))),
|
|
5152
|
+
React__default.createElement("div", { className: b('content') }, filteredSections.map((section) => (React__default.createElement("div", { key: section.title, className: b('section') },
|
|
5153
|
+
section.showTitle && (React__default.createElement("h3", { className: b('section-heading') }, section.title)),
|
|
5154
|
+
section.header &&
|
|
5155
|
+
(isMobile ? (React__default.createElement("div", { className: b('section-subheader') }, section.header)) : (section.header)),
|
|
5156
|
+
section.items.map(({ hidden, title, element }) => hidden ? null : (React__default.createElement("div", { key: title, className: b('section-item') }, React__default.cloneElement(element, Object.assign(Object.assign({}, element.props), { title: search && title
|
|
5157
|
+
? prepareTitle(title, search)
|
|
5158
|
+
: title })))))))))));
|
|
5099
5159
|
};
|
|
5100
5160
|
return (React__default.createElement("div", { className: b({ view }) },
|
|
5101
5161
|
isMobile ? (React__default.createElement(React__default.Fragment, null,
|
|
@@ -5111,7 +5171,7 @@ function SettingsContent({ initialPage, onPageChange, children, renderNotFound,
|
|
|
5111
5171
|
}
|
|
5112
5172
|
}
|
|
5113
5173
|
} },
|
|
5114
|
-
React__default.createElement(
|
|
5174
|
+
React__default.createElement(Title, null, dict === null || dict === void 0 ? void 0 : dict.heading_settings),
|
|
5115
5175
|
React__default.createElement(SettingsSearch, { inputRef: searchInputRef, className: b('search'), onChange: setSearch, placeholder: dict === null || dict === void 0 ? void 0 : dict.placeholder_search, autoFocus: true }),
|
|
5116
5176
|
React__default.createElement(SettingsMenu, { ref: menuRef, items: menu, onChange: handlePageChange, activeItemId: activePage }))),
|
|
5117
5177
|
React__default.createElement("div", { className: b('page') }, renderPageContent())));
|
|
@@ -5156,5 +5216,5 @@ function prepareTitle(string, search) {
|
|
|
5156
5216
|
return title;
|
|
5157
5217
|
}
|
|
5158
5218
|
|
|
5159
|
-
export { PublicActionBar as ActionBar, AsideHeader, Dict, Drawer, DrawerItem, FooterItem, MobileHeaderDict, Settings };
|
|
5219
|
+
export { PublicActionBar as ActionBar, AsideHeader, Dict, Drawer, DrawerItem, FooterItem, HotkeysPanel, MobileHeaderDict, Settings, Title };
|
|
5160
5220
|
//# sourceMappingURL=index.js.map
|