@gravity-ui/navigation 3.6.0 → 3.6.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/cjs/components/HotkeysPanel/HotkeysPanel.d.ts +2 -2
- package/build/cjs/{index-Cycm1qkC.js → index-7Lbn5kHV.js} +6 -6
- package/build/{esm/index-BR3lwtrQ.js.map → cjs/index-7Lbn5kHV.js.map} +1 -1
- package/build/cjs/{index-DQNATx6t.js → index-BNFk3vPj.js} +2 -2
- package/build/cjs/{index-DQNATx6t.js.map → index-BNFk3vPj.js.map} +1 -1
- package/build/cjs/index.js +1 -1
- package/build/esm/components/HotkeysPanel/HotkeysPanel.d.ts +2 -2
- package/build/esm/{index-DM3j7oy5.js → index-BRKfM06_.js} +2 -2
- package/build/esm/{index-DM3j7oy5.js.map → index-BRKfM06_.js.map} +1 -1
- package/build/esm/{index-BR3lwtrQ.js → index-pc2tk-sb.js} +6 -6
- package/build/{cjs/index-Cycm1qkC.js.map → esm/index-pc2tk-sb.js.map} +1 -1
- package/build/esm/index.js +1 -1
- package/package.json +1 -1
|
@@ -6,7 +6,7 @@ import './HotkeysPanel.scss';
|
|
|
6
6
|
export type HotkeysPanelProps<T> = {
|
|
7
7
|
hotkeys: HotkeysGroup<T>[];
|
|
8
8
|
title?: ReactNode;
|
|
9
|
-
|
|
9
|
+
togglePanelHotkey?: string;
|
|
10
10
|
filterable?: boolean;
|
|
11
11
|
filterPlaceholder?: string;
|
|
12
12
|
emptyState?: ReactNode;
|
|
@@ -21,4 +21,4 @@ export type HotkeysPanelProps<T> = {
|
|
|
21
21
|
leftOffset?: number | string;
|
|
22
22
|
topOffset?: number | string;
|
|
23
23
|
} & Omit<ListProps<HotkeysListItem>, 'items' | 'emptyPlaceholder' | 'className' | 'size' | 'renderItem' | 'filterable' | 'autoFocus' | 'filterPlaceholder' | 'filterClassName' | 'filter' | 'filterItem' | 'onFilterEnd' | 'onFilterUpdate'>;
|
|
24
|
-
export declare function HotkeysPanel<T = {}>({ visible, onClose, leftOffset, topOffset, className, drawerItemClassName, filterClassName, titleClassName, listClassName, itemContentClassName, hotkeys, itemClassName, filterable, filterPlaceholder, title,
|
|
24
|
+
export declare function HotkeysPanel<T = {}>({ visible, onClose, leftOffset, topOffset, className, drawerItemClassName, filterClassName, titleClassName, listClassName, itemContentClassName, hotkeys, itemClassName, filterable, filterPlaceholder, title, togglePanelHotkey, emptyState, ...listProps }: HotkeysPanelProps<T>): React.JSX.Element;
|
|
@@ -141,7 +141,7 @@ function styleInject(css, ref) {
|
|
|
141
141
|
var css_248z$u = ".g-root{--gn-aside-top-panel-height:0px}.gn-aside-header{--gn-aside-header-min-width:56px;--_--item-icon-background-size:38px;--_--background-color:var(--g-color-base-background);--_--decoration-collapsed-background-color:var(--g-color-base-warning-light);--_--decoration-expanded-background-color:var(--g-color-base-warning-light);--_--vertical-divider-line-color:var(--g-color-line-generic);--_--horizontal-divider-line-color:var(--g-color-line-generic);background-color:var(--g-color-base-background);height:100%;position:relative;width:100%}.gn-aside-header__aside{background-color:var(--gn-aside-header-expanded-background-color,var(--gn-aside-header-background-color,var(--_--background-color)));box-sizing:border-box;display:flex;flex-direction:column;height:100vh;left:0;margin-top:var(--gn-top-alert-height,0);max-height:calc(100vh - var(--gn-top-alert-height, 0));position:sticky;top:var(--gn-top-alert-height,0);width:inherit;z-index:var(--gn-aside-header-z-index,100)}.gn-aside-header__aside:after{background-color:var(--gn-aside-header-divider-vertical-color,var(--_--vertical-divider-line-color));content:\"\";height:100%;position:absolute;right:0;top:0;width:1px;z-index:2}.gn-aside-header__aside-popup-anchor{inset:0;position:absolute;z-index:1}.gn-aside-header__aside-content{--gradient-height:334px;display:flex;flex-direction:column;height:inherit;overflow-x:hidden;padding-top:var(--gn-aside-header-padding-top);position:relative;user-select:none;width:inherit;z-index:2}.gn-aside-header__aside-content>.gn-aside-header-logo{margin:8px 0}.gn-aside-header__aside-content_with-decoration{background:linear-gradient(180deg,var(--gn-aside-header-decoration-expanded-background-color,var(--_--decoration-expanded-background-color)) calc(var(--gradient-height)*.33),transparent calc(var(--gradient-height)*.88))}.gn-aside-header__aside-custom-background{bottom:0;display:flex;position:absolute;top:0;width:var(--gn-aside-header-size);z-index:-1}.gn-aside-header_compact .gn-aside-header__aside{background-color:var(--gn-aside-header-collapsed-background-color,var(--gn-aside-header-background-color,var(--_--background-color)))}.gn-aside-header_compact .gn-aside-header__aside-content{background:transparent}.gn-aside-header__header{--gn-aside-header-header-divider-height:29px;box-sizing:border-box;flex:none;padding-bottom:22px;padding-top:8px;position:relative;width:100%;z-index:1}.gn-aside-header__header .gn-aside-header__header-divider{bottom:0;color:var(--gn-aside-header-decoration-collapsed-background-color,var(--_--decoration-collapsed-background-color));display:none;left:0;position:absolute;z-index:-2}.gn-aside-header__header_with-decoration:before{background-color:var(--gn-aside-header-decoration-collapsed-background-color,var(--_--decoration-collapsed-background-color));content:\"\";display:none;height:calc(100% - var(--gn-aside-header-header-divider-height));left:0;position:absolute;top:0;width:100%;z-index:-2}.gn-aside-header__header:after{background-color:var(--gn-aside-header-divider-horizontal-color,var(--_--horizontal-divider-line-color));bottom:12px;content:\"\";height:1px;left:0;position:absolute;width:100%;z-index:-2}.gn-aside-header_compact .gn-aside-header__header:before,.gn-aside-header_compact .gn-aside-header__header_with-decoration .gn-aside-header__header-divider{display:block}.gn-aside-header_compact .gn-aside-header__header_with-decoration:after{display:none}.gn-aside-header__logo-button .gn-aside-header__logo-icon-place{height:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));width:var(--gn-aside-header-min-width)}.gn-aside-header__menu-items{flex-grow:1}.gn-aside-header__footer{display:flex;flex-direction:column;flex-shrink:0;margin:8px 0;width:100%}.gn-aside-header__panels{inset:var(--gn-top-alert-height,0) 0 0;max-height:calc(100vh - var(--gn-top-alert-height, 0));overflow:auto;position:fixed;z-index:var(--gn-aside-header-panel-z-index,98)}.gn-aside-header__panel{height:100%}.gn-aside-header__pane-container{display:flex;flex-direction:row;outline:none;overflow:visible;user-select:text}.gn-aside-header__top-alert{background:var(--g-color-base-background);position:fixed;top:0;width:100%;z-index:var(--gn-aside-header-pane-top-z-index,98)}.gn-aside-header__content{margin-top:var(--gn-top-alert-height,0);width:calc(100% - var(--gn-aside-header-size));z-index:var(--gn-aside-header-content-z-index,95)}";
|
|
142
142
|
styleInject(css_248z$u);
|
|
143
143
|
|
|
144
|
-
const TopAlert$1 = React.lazy(() => Promise.resolve().then(function () { return require('./index-
|
|
144
|
+
const TopAlert$1 = React.lazy(() => Promise.resolve().then(function () { return require('./index-BNFk3vPj.js'); }).then((module) => ({ default: module.TopAlert })));
|
|
145
145
|
const Layout = ({ compact, className, children, topAlert }) => {
|
|
146
146
|
const size = compact ? ASIDE_HEADER_COMPACT_WIDTH : ASIDE_HEADER_EXPANDED_WIDTH;
|
|
147
147
|
const asideHeaderContextValue = React.useMemo(() => ({ size, compact }), [compact, size]);
|
|
@@ -1913,7 +1913,7 @@ const CollapseButton = ({ className }) => {
|
|
|
1913
1913
|
return defaultButton;
|
|
1914
1914
|
};
|
|
1915
1915
|
|
|
1916
|
-
var css_248z$m = ".gn-logo{height:40px}.gn-logo,.gn-logo__btn-logo{align-items:center;display:flex}.gn-logo__btn-logo{cursor:pointer;flex-shrink:0;justify-content:
|
|
1916
|
+
var css_248z$m = ".gn-logo{height:40px}.gn-logo,.gn-logo__btn-logo{align-items:center;display:flex}.gn-logo__btn-logo{cursor:pointer;flex-shrink:0;justify-content:flex-start;overflow-wrap:break-word;width:100%;word-break:break-word}.gn-logo__btn-logo,.gn-logo__btn-logo:active,.gn-logo__btn-logo:focus,.gn-logo__btn-logo:hover,.gn-logo__btn-logo:visited{color:inherit;outline:none;text-decoration:none}.gn-logo__btn-logo:focus-visible{outline:solid var(--g-color-line-misc);outline-offset:-2px}.gn-logo__logo-icon-place{align-items:center;display:flex;flex-shrink:0;justify-content:center;width:36px}";
|
|
1917
1917
|
styleInject(css_248z$m);
|
|
1918
1918
|
|
|
1919
1919
|
const b$n = block('logo');
|
|
@@ -4817,7 +4817,7 @@ styleInject(css_248z$d);
|
|
|
4817
4817
|
|
|
4818
4818
|
const b$e = block('hotkeys-panel');
|
|
4819
4819
|
function HotkeysPanel(_a) {
|
|
4820
|
-
var { visible, onClose, leftOffset, topOffset, className, drawerItemClassName, filterClassName, titleClassName, listClassName, itemContentClassName, hotkeys, itemClassName, filterable = true, filterPlaceholder, title,
|
|
4820
|
+
var { visible, onClose, leftOffset, topOffset, className, drawerItemClassName, filterClassName, titleClassName, listClassName, itemContentClassName, hotkeys, itemClassName, filterable = true, filterPlaceholder, title, togglePanelHotkey, emptyState } = _a, listProps = __rest(_a, ["visible", "onClose", "leftOffset", "topOffset", "className", "drawerItemClassName", "filterClassName", "titleClassName", "listClassName", "itemContentClassName", "hotkeys", "itemClassName", "filterable", "filterPlaceholder", "title", "togglePanelHotkey", "emptyState"]);
|
|
4821
4821
|
const [filter, setFilter] = React.useState('');
|
|
4822
4822
|
const hotkeysList = React.useMemo(() => {
|
|
4823
4823
|
const filteredHotkeys = filterHotkeys(hotkeys, filter);
|
|
@@ -4831,7 +4831,7 @@ function HotkeysPanel(_a) {
|
|
|
4831
4831
|
const drawerItemContent = (React.createElement(React.Fragment, null,
|
|
4832
4832
|
React.createElement(uikit.Text, { variant: "subheader-3", as: 'h2', className: b$e('title', titleClassName) },
|
|
4833
4833
|
title,
|
|
4834
|
-
|
|
4834
|
+
togglePanelHotkey && React.createElement(uikit.Hotkey, { value: togglePanelHotkey })),
|
|
4835
4835
|
filterable && (React.createElement(uikit.TextInput, { value: filter, onUpdate: setFilter, placeholder: filterPlaceholder, autoFocus: true, className: b$e('search', filterClassName), hasClear: true })),
|
|
4836
4836
|
React.createElement(uikit.List, Object.assign({ className: b$e('list', listClassName), virtualized: false, filterable: false, items: hotkeysList, renderItem: renderItem, itemClassName: b$e('item', itemClassName), emptyPlaceholder: emptyState }, listProps))));
|
|
4837
4837
|
return (React.createElement(Drawer, { className: b$e(null, className), onVeilClick: onClose, onEscape: onClose, style: {
|
|
@@ -5687,7 +5687,7 @@ const OverlapPanel = ({ title, renderContent, className, onClose, action, closeT
|
|
|
5687
5687
|
var css_248z$4 = ".gn-mobile-header{--mobile-header-min-heigth:50px;--mobile-header-icon-size:20px;background-color:var(--g-color-base-background)}.gn-mobile-header__header-container{background-color:var(--g-color-base-background);position:sticky;top:0;z-index:var(--gn-mobile-header-z-index,100)}.gn-mobile-header__header{align-items:center;border-bottom:1px solid var(--g-color-line-generic);box-sizing:border-box;display:flex;justify-content:space-between;padding:0 10px}.gn-mobile-header__burger{padding:12px}.gn-mobile-header__panel-item{--gn-drawer-item-position:var(--gn-mobile-header-panel-position,absolute)}.gn-mobile-header__burger-menu,.gn-mobile-header__panel-item{background-color:var(--g-color-base-background);max-height:100%;max-width:90vw;width:320px}.gn-mobile-header__user-menu{overflow-y:auto}.gn-mobile-header__overlap-panel,.gn-mobile-header__panels{z-index:var(--gn-mobile-header-panel-z-index,98)}.gn-mobile-header__panels{inset:var(--mobile-header-min-heigth) 0 0;overflow:hidden;position:fixed}.gn-mobile-header__panel-item{top:unset}.gn-mobile-header__content{overflow:auto}";
|
|
5688
5688
|
styleInject(css_248z$4);
|
|
5689
5689
|
|
|
5690
|
-
const TopAlert = React.lazy(() => Promise.resolve().then(function () { return require('./index-
|
|
5690
|
+
const TopAlert = React.lazy(() => Promise.resolve().then(function () { return require('./index-BNFk3vPj.js'); }).then((module) => ({ default: module.TopAlert })));
|
|
5691
5691
|
const b$4 = block('mobile-header');
|
|
5692
5692
|
const MobileHeader = React.forwardRef(({ logo, burgerMenu, burgerCloseTitle = i18n('burger_button_close'), burgerOpenTitle = i18n('burger_button_open'), panelItems = [], renderContent, sideItemRenderContent, onClosePanel, onEvent, className, contentClassName, overlapPanel, topAlert, }, ref) => {
|
|
5693
5693
|
const targetRef = useForwardRef(ref);
|
|
@@ -6003,4 +6003,4 @@ exports.styleInject = styleInject;
|
|
|
6003
6003
|
exports.useAsideHeaderContext = useAsideHeaderContext;
|
|
6004
6004
|
exports.useSettingsContext = useSettingsContext;
|
|
6005
6005
|
exports.useSettingsSelectionContext = useSettingsSelectionContext;
|
|
6006
|
-
//# sourceMappingURL=index-
|
|
6006
|
+
//# sourceMappingURL=index-7Lbn5kHV.js.map
|