@gravity-ui/navigation 6.3.0 → 6.4.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/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.js +4 -2
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/i18n/en.json.js +3 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/i18n/en.json.js.map +1 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/i18n/index.d.ts +4 -4
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/i18n/ru.json.js +3 -1
- package/build/cjs/components/AsideHeader/components/AllPagesPanel/i18n/ru.json.js.map +1 -1
- package/build/cjs/components/HotkeysPanel/HotkeysPanel.css +1 -1
- package/build/cjs/components/HotkeysPanel/HotkeysPanel.js +1 -1
- package/build/cjs/components/HotkeysPanel/HotkeysPanel.js.map +1 -1
- package/build/cjs/components/HotkeysPanel/HotkeysPanel.module.scss.js +1 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.js +5 -3
- package/build/esm/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.js.map +1 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/i18n/en.json.js +3 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/i18n/en.json.js.map +1 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/i18n/index.d.ts +4 -4
- package/build/esm/components/AsideHeader/components/AllPagesPanel/i18n/ru.json.js +3 -1
- package/build/esm/components/AsideHeader/components/AllPagesPanel/i18n/ru.json.js.map +1 -1
- package/build/esm/components/HotkeysPanel/HotkeysPanel.css +1 -1
- package/build/esm/components/HotkeysPanel/HotkeysPanel.js +1 -1
- package/build/esm/components/HotkeysPanel/HotkeysPanel.js.map +1 -1
- package/build/esm/components/HotkeysPanel/HotkeysPanel.module.scss.js +1 -1
- package/package.json +1 -1
|
@@ -5,6 +5,7 @@ var React = require('react');
|
|
|
5
5
|
var icons = require('@gravity-ui/icons');
|
|
6
6
|
var uikit = require('@gravity-ui/uikit');
|
|
7
7
|
var cn = require('../../../../utils/cn.js');
|
|
8
|
+
var index = require('../i18n/index.js');
|
|
8
9
|
var AllPagesListItem_module = require('./AllPagesListItem.module.scss.js');
|
|
9
10
|
|
|
10
11
|
const b = cn.createBlock('all-pages-list-item', AllPagesListItem_module.default);
|
|
@@ -27,8 +28,9 @@ const AllPagesListItem = (props) => {
|
|
|
27
28
|
return (React.createElement(Tag, Object.assign({}, tagProps, { className: b(), onClick: onItemClick, ref: ref }),
|
|
28
29
|
params.icon,
|
|
29
30
|
React.createElement("span", { className: b('text') }, params.title),
|
|
30
|
-
editMode && !item.preventUserRemoving && (React.createElement(uikit.
|
|
31
|
-
React.createElement(uikit.Button
|
|
31
|
+
editMode && !item.preventUserRemoving && (React.createElement(uikit.Tooltip, { content: index.default(item.hidden ? 'all-panel.item.pin' : 'all-panel.item.unpin') },
|
|
32
|
+
React.createElement(uikit.Button, { "aria-label": index.default(item.hidden ? 'all-panel.item.pin' : 'all-panel.item.unpin'), onClick: onPinButtonClick, view: item.hidden ? 'flat-secondary' : 'flat-action' },
|
|
33
|
+
React.createElement(uikit.Button.Icon, null, item.hidden ? React.createElement(icons.Pin, null) : React.createElement(icons.PinFill, null)))))));
|
|
32
34
|
}, [Tag, tagProps, editMode, item, onPinButtonClick]);
|
|
33
35
|
const iconNode = item.icon ? (React.createElement(uikit.Icon, { className: b('icon'), data: item.icon, size: item.iconSize })) : null;
|
|
34
36
|
const titleNode = item.title;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AllPagesListItem.js","sources":["../../../../../../../../src/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.tsx"],"sourcesContent":["import React, {MouseEvent, useCallback, useRef} from 'react';\n\nimport {Pin, PinFill} from '@gravity-ui/icons';\nimport {Button, Icon} from '@gravity-ui/uikit';\n\nimport {AsideHeaderItem} from 'src/components/AsideHeader/types';\nimport {MakeItemParams} from 'src/components/types';\n\nimport {createBlock} from '../../../../utils/cn';\n\nimport styles from './AllPagesListItem.module.scss';\n\nconst b = createBlock('all-pages-list-item', styles);\n\ninterface AllPagesListItemProps {\n item: AsideHeaderItem;\n editMode?: boolean;\n enableSorting?: boolean;\n onToggle: () => void;\n onDragStart?: () => void;\n onDragEnd?: () => void;\n}\n\nexport const AllPagesListItem: React.FC<AllPagesListItemProps> = (props) => {\n const {item, editMode, onToggle} = props;\n const ref = useRef<HTMLAnchorElement & HTMLButtonElement>(null);\n\n const onPinButtonClick = useCallback(\n (e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n e.stopPropagation();\n e.preventDefault();\n onToggle();\n },\n [onToggle],\n );\n\n const [Tag, tagProps] = item.href ? ['a' as const, {href: item.href}] : ['button' as const, {}];\n\n const makeNode = useCallback(\n (params: MakeItemParams) => {\n const onItemClick = (e: MouseEvent<HTMLElement>) => {\n if (editMode) {\n e.stopPropagation();\n e.preventDefault();\n }\n };\n\n return (\n <Tag {...tagProps} className={b()} onClick={onItemClick} ref={ref}>\n {params.icon}\n <span className={b('text')}>{params.title}</span>\n {editMode && !item.preventUserRemoving && (\n <Button\n
|
|
1
|
+
{"version":3,"file":"AllPagesListItem.js","sources":["../../../../../../../../src/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.tsx"],"sourcesContent":["import React, {MouseEvent, useCallback, useRef} from 'react';\n\nimport {Pin, PinFill} from '@gravity-ui/icons';\nimport {Button, Icon, Tooltip} from '@gravity-ui/uikit';\n\nimport {AsideHeaderItem} from 'src/components/AsideHeader/types';\nimport {MakeItemParams} from 'src/components/types';\n\nimport {createBlock} from '../../../../utils/cn';\nimport i18n from '../i18n';\n\nimport styles from './AllPagesListItem.module.scss';\n\nconst b = createBlock('all-pages-list-item', styles);\n\ninterface AllPagesListItemProps {\n item: AsideHeaderItem;\n editMode?: boolean;\n enableSorting?: boolean;\n onToggle: () => void;\n onDragStart?: () => void;\n onDragEnd?: () => void;\n}\n\nexport const AllPagesListItem: React.FC<AllPagesListItemProps> = (props) => {\n const {item, editMode, onToggle} = props;\n const ref = useRef<HTMLAnchorElement & HTMLButtonElement>(null);\n\n const onPinButtonClick = useCallback(\n (e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n e.stopPropagation();\n e.preventDefault();\n onToggle();\n },\n [onToggle],\n );\n\n const [Tag, tagProps] = item.href ? ['a' as const, {href: item.href}] : ['button' as const, {}];\n\n const makeNode = useCallback(\n (params: MakeItemParams) => {\n const onItemClick = (e: MouseEvent<HTMLElement>) => {\n if (editMode) {\n e.stopPropagation();\n e.preventDefault();\n }\n };\n\n return (\n <Tag {...tagProps} className={b()} onClick={onItemClick} ref={ref}>\n {params.icon}\n <span className={b('text')}>{params.title}</span>\n {editMode && !item.preventUserRemoving && (\n <Tooltip\n content={i18n(\n item.hidden ? 'all-panel.item.pin' : 'all-panel.item.unpin',\n )}\n >\n <Button\n aria-label={i18n(\n item.hidden ? 'all-panel.item.pin' : 'all-panel.item.unpin',\n )}\n onClick={onPinButtonClick}\n view={item.hidden ? 'flat-secondary' : 'flat-action'}\n >\n <Button.Icon>{item.hidden ? <Pin /> : <PinFill />}</Button.Icon>\n </Button>\n </Tooltip>\n )}\n </Tag>\n );\n },\n [Tag, tagProps, editMode, item, onPinButtonClick],\n );\n\n const iconNode = item.icon ? (\n <Icon className={b('icon')} data={item.icon} size={item.iconSize} />\n ) : null;\n const titleNode = item.title;\n const params: MakeItemParams = {icon: iconNode, title: titleNode};\n const opts = {collapsed: false, compact: false, item, ref};\n\n if (typeof item.itemWrapper === 'function') {\n return item.itemWrapper(params, makeNode, opts) as React.ReactElement;\n }\n\n return makeNode(params);\n};\n"],"names":["createBlock","styles","useRef","useCallback","Tooltip","i18n","Button","Pin","PinFill","Icon"],"mappings":"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"}
|
|
@@ -7,7 +7,9 @@ var en = {
|
|
|
7
7
|
"all-panel.menu.category.allOther": "All other",
|
|
8
8
|
"all-panel.resetToDefault": "Reset to default",
|
|
9
9
|
"all-panel.title.editing": "Configuring the menu bar",
|
|
10
|
-
"all-panel.title.main": "All pages"
|
|
10
|
+
"all-panel.title.main": "All pages",
|
|
11
|
+
"all-panel.item.pin": "Pin",
|
|
12
|
+
"all-panel.item.unpin": "Unpin"
|
|
11
13
|
};
|
|
12
14
|
|
|
13
15
|
exports.default = en;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"en.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"en.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
declare const _default: ((key: "menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main", params?: import("@gravity-ui/i18n").Params) => string) & {
|
|
1
|
+
declare const _default: ((key: "menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main" | "all-panel.item.pin" | "all-panel.item.unpin", params?: import("@gravity-ui/i18n").Params) => string) & {
|
|
2
2
|
Translation: import("react").ComponentType<{
|
|
3
3
|
children: (props: {
|
|
4
|
-
t: (key: "menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main", params?: import("@gravity-ui/i18n").Params) => string;
|
|
4
|
+
t: (key: "menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main" | "all-panel.item.pin" | "all-panel.item.unpin", params?: import("@gravity-ui/i18n").Params) => string;
|
|
5
5
|
}) => React.ReactNode;
|
|
6
6
|
}>;
|
|
7
7
|
useTranslation: () => {
|
|
8
|
-
t: (key: "menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main", params?: import("@gravity-ui/i18n").Params) => string;
|
|
8
|
+
t: (key: "menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main" | "all-panel.item.pin" | "all-panel.item.unpin", params?: import("@gravity-ui/i18n").Params) => string;
|
|
9
9
|
};
|
|
10
10
|
keysetData: {
|
|
11
|
-
"gn-AllPagesPanel": Record<"menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main", import("@gravity-ui/i18n").KeyData>;
|
|
11
|
+
"gn-AllPagesPanel": Record<"menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main" | "all-panel.item.pin" | "all-panel.item.unpin", import("@gravity-ui/i18n").KeyData>;
|
|
12
12
|
};
|
|
13
13
|
};
|
|
14
14
|
export default _default;
|
|
@@ -7,7 +7,9 @@ var ru = {
|
|
|
7
7
|
"all-panel.menu.category.allOther": "Остальное",
|
|
8
8
|
"all-panel.resetToDefault": "Сбросить по умолчанию",
|
|
9
9
|
"all-panel.title.editing": "Настройка панели меню",
|
|
10
|
-
"all-panel.title.main": "Все страницы"
|
|
10
|
+
"all-panel.title.main": "Все страницы",
|
|
11
|
+
"all-panel.item.pin": "Закрепить",
|
|
12
|
+
"all-panel.item.unpin": "Открепить"
|
|
11
13
|
};
|
|
12
14
|
|
|
13
15
|
exports.default = ru;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ru.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ru.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.HotkeysPanel-module__gn-hotkeys-panel___Aab92{--hotkeys-panel-width:400px;--hotkeys-panel-vertical-padding:18px;--hotkeys-panel-horizontal-padding:var(--g-spacing-6);inset:0;position:fixed}.HotkeysPanel-module__gn-hotkeys-panel__drawer-item___T-3tZ{box-sizing:border-box;
|
|
1
|
+
.HotkeysPanel-module__gn-hotkeys-panel___Aab92{--hotkeys-panel-width:400px;--hotkeys-panel-vertical-padding:18px;--hotkeys-panel-horizontal-padding:var(--g-spacing-6);inset:0;position:fixed}.HotkeysPanel-module__gn-hotkeys-panel__drawer-item___T-3tZ{box-sizing:border-box;padding-top:var(--hotkeys-panel-vertical-padding);width:var(--hotkeys-panel-width)}.HotkeysPanel-module__gn-hotkeys-panel__drawer-content___P1nwO{display:flex;flex-direction:column;height:100%;min-height:0}.HotkeysPanel-module__gn-hotkeys-panel__title___dPviy{align-items:baseline;display:flex;gap:var(--g-spacing-2);justify-content:space-between;margin:0 var(--hotkeys-panel-horizontal-padding) var(--g-spacing-4) var(--hotkeys-panel-horizontal-padding)}.HotkeysPanel-module__gn-hotkeys-panel__search___olv3P{box-sizing:border-box;margin-bottom:var(--g-spacing-4);padding:0 var(--hotkeys-panel-horizontal-padding)}.HotkeysPanel-module__gn-hotkeys-panel__list___ToMip{flex:1;min-height:0;overflow-y:auto}.HotkeysPanel-module__gn-hotkeys-panel__list___ToMip:after{content:"";display:block;height:var(--hotkeys-panel-vertical-padding)}.HotkeysPanel-module__gn-hotkeys-panel__item___BKagb[class]{height:auto;margin:0 var(--hotkeys-panel-horizontal-padding);padding:var(--g-spacing-2) 0}.HotkeysPanel-module__gn-hotkeys-panel__item___BKagb[class].g-list__item_active, .HotkeysPanel-module__gn-hotkeys-panel__item___BKagb[class]:hover{background:inherit}.HotkeysPanel-module__gn-hotkeys-panel__item___BKagb[class]:not(:first-child):has(.HotkeysPanel-module__gn-hotkeys-panel__item-content_type_group___q8vt0){border-top:1px solid var(--g-color-line-generic);margin-top:var(--g-spacing-3);padding-top:var(--g-spacing-4)}.HotkeysPanel-module__gn-hotkeys-panel__item-content___Wqp2t{align-items:baseline;color:var(--g-color-text-primary);display:flex;justify-content:space-between;margin:0;width:100%}.HotkeysPanel-module__gn-hotkeys-panel__item-hint___QbgP4{margin-left:var(--g-spacing-1)}.HotkeysPanel-module__gn-hotkeys-panel__item-hint-tooltip___xdDtY{max-width:217px}.HotkeysPanel-module__gn-hotkeys-panel__hotkey___-LPxF{color:var(--g-color-text-complementary)}
|
|
@@ -25,7 +25,7 @@ function HotkeysPanel(_a) {
|
|
|
25
25
|
item.title,
|
|
26
26
|
item.hint && (React.createElement(uikit.HelpMark, { "aria-hidden": true, popoverProps: { className: b('item-hint-tooltip') }, className: b('item-hint') }, item.hint))),
|
|
27
27
|
item.value && (React.createElement(uikit.Hotkey, { className: b('hotkey'), value: item.value, platform: platform })))), [itemContentClassName, platform]);
|
|
28
|
-
const drawerItemContent = (React.createElement(
|
|
28
|
+
const drawerItemContent = (React.createElement("div", { className: b('drawer-content') },
|
|
29
29
|
React.createElement(uikit.Text, { variant: "subheader-3", as: 'h2', className: b('title', titleClassName) },
|
|
30
30
|
title,
|
|
31
31
|
togglePanelHotkey && React.createElement(uikit.Hotkey, { value: togglePanelHotkey, platform: platform })),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HotkeysPanel.js","sources":["../../../../../src/components/HotkeysPanel/HotkeysPanel.tsx"],"sourcesContent":["import React, {useCallback, useMemo, 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 [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 <
|
|
1
|
+
{"version":3,"file":"HotkeysPanel.js","sources":["../../../../../src/components/HotkeysPanel/HotkeysPanel.tsx"],"sourcesContent":["import React, {useCallback, useMemo, 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 [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 <div className={b('drawer-content')}>\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 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 </div>\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 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","useState","useSafeAsideHeaderContext","useMemo","filterHotkeys","flattenHotkeyGroups","useCallback","Text","HelpMark","Hotkey","TextInput","List","Drawer"],"mappings":"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"}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var styles = {"gn-hotkeys-panel":"HotkeysPanel-module__gn-hotkeys-panel___Aab92","gnHotkeysPanel":"HotkeysPanel-module__gn-hotkeys-panel___Aab92","gn-hotkeys-panel__drawer-item":"HotkeysPanel-module__gn-hotkeys-panel__drawer-item___T-3tZ","gnHotkeysPanelDrawerItem":"HotkeysPanel-module__gn-hotkeys-panel__drawer-item___T-3tZ","gn-hotkeys-panel__title":"HotkeysPanel-module__gn-hotkeys-panel__title___dPviy","gnHotkeysPanelTitle":"HotkeysPanel-module__gn-hotkeys-panel__title___dPviy","gn-hotkeys-panel__search":"HotkeysPanel-module__gn-hotkeys-panel__search___olv3P","gnHotkeysPanelSearch":"HotkeysPanel-module__gn-hotkeys-panel__search___olv3P","gn-hotkeys-panel__list":"HotkeysPanel-module__gn-hotkeys-panel__list___ToMip","gnHotkeysPanelList":"HotkeysPanel-module__gn-hotkeys-panel__list___ToMip","gn-hotkeys-panel__item":"HotkeysPanel-module__gn-hotkeys-panel__item___BKagb","gnHotkeysPanelItem":"HotkeysPanel-module__gn-hotkeys-panel__item___BKagb","gn-hotkeys-panel__item-content_type_group":"HotkeysPanel-module__gn-hotkeys-panel__item-content_type_group___q8vt0","gnHotkeysPanelItemContentTypeGroup":"HotkeysPanel-module__gn-hotkeys-panel__item-content_type_group___q8vt0","gn-hotkeys-panel__item-content":"HotkeysPanel-module__gn-hotkeys-panel__item-content___Wqp2t","gnHotkeysPanelItemContent":"HotkeysPanel-module__gn-hotkeys-panel__item-content___Wqp2t","gn-hotkeys-panel__item-hint":"HotkeysPanel-module__gn-hotkeys-panel__item-hint___QbgP4","gnHotkeysPanelItemHint":"HotkeysPanel-module__gn-hotkeys-panel__item-hint___QbgP4","gn-hotkeys-panel__item-hint-tooltip":"HotkeysPanel-module__gn-hotkeys-panel__item-hint-tooltip___xdDtY","gnHotkeysPanelItemHintTooltip":"HotkeysPanel-module__gn-hotkeys-panel__item-hint-tooltip___xdDtY","gn-hotkeys-panel__hotkey":"HotkeysPanel-module__gn-hotkeys-panel__hotkey___-LPxF","gnHotkeysPanelHotkey":"HotkeysPanel-module__gn-hotkeys-panel__hotkey___-LPxF"};
|
|
5
|
+
var styles = {"gn-hotkeys-panel":"HotkeysPanel-module__gn-hotkeys-panel___Aab92","gnHotkeysPanel":"HotkeysPanel-module__gn-hotkeys-panel___Aab92","gn-hotkeys-panel__drawer-item":"HotkeysPanel-module__gn-hotkeys-panel__drawer-item___T-3tZ","gnHotkeysPanelDrawerItem":"HotkeysPanel-module__gn-hotkeys-panel__drawer-item___T-3tZ","gn-hotkeys-panel__drawer-content":"HotkeysPanel-module__gn-hotkeys-panel__drawer-content___P1nwO","gnHotkeysPanelDrawerContent":"HotkeysPanel-module__gn-hotkeys-panel__drawer-content___P1nwO","gn-hotkeys-panel__title":"HotkeysPanel-module__gn-hotkeys-panel__title___dPviy","gnHotkeysPanelTitle":"HotkeysPanel-module__gn-hotkeys-panel__title___dPviy","gn-hotkeys-panel__search":"HotkeysPanel-module__gn-hotkeys-panel__search___olv3P","gnHotkeysPanelSearch":"HotkeysPanel-module__gn-hotkeys-panel__search___olv3P","gn-hotkeys-panel__list":"HotkeysPanel-module__gn-hotkeys-panel__list___ToMip","gnHotkeysPanelList":"HotkeysPanel-module__gn-hotkeys-panel__list___ToMip","gn-hotkeys-panel__item":"HotkeysPanel-module__gn-hotkeys-panel__item___BKagb","gnHotkeysPanelItem":"HotkeysPanel-module__gn-hotkeys-panel__item___BKagb","gn-hotkeys-panel__item-content_type_group":"HotkeysPanel-module__gn-hotkeys-panel__item-content_type_group___q8vt0","gnHotkeysPanelItemContentTypeGroup":"HotkeysPanel-module__gn-hotkeys-panel__item-content_type_group___q8vt0","gn-hotkeys-panel__item-content":"HotkeysPanel-module__gn-hotkeys-panel__item-content___Wqp2t","gnHotkeysPanelItemContent":"HotkeysPanel-module__gn-hotkeys-panel__item-content___Wqp2t","gn-hotkeys-panel__item-hint":"HotkeysPanel-module__gn-hotkeys-panel__item-hint___QbgP4","gnHotkeysPanelItemHint":"HotkeysPanel-module__gn-hotkeys-panel__item-hint___QbgP4","gn-hotkeys-panel__item-hint-tooltip":"HotkeysPanel-module__gn-hotkeys-panel__item-hint-tooltip___xdDtY","gnHotkeysPanelItemHintTooltip":"HotkeysPanel-module__gn-hotkeys-panel__item-hint-tooltip___xdDtY","gn-hotkeys-panel__hotkey":"HotkeysPanel-module__gn-hotkeys-panel__hotkey___-LPxF","gnHotkeysPanelHotkey":"HotkeysPanel-module__gn-hotkeys-panel__hotkey___-LPxF"};
|
|
6
6
|
|
|
7
7
|
exports.default = styles;
|
|
8
8
|
//# sourceMappingURL=HotkeysPanel.module.scss.js.map
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import './AllPagesListItem.css';
|
|
2
2
|
import React__default, { useRef, useCallback } from 'react';
|
|
3
3
|
import { Pin, PinFill } from '@gravity-ui/icons';
|
|
4
|
-
import { Button, Icon } from '@gravity-ui/uikit';
|
|
4
|
+
import { Tooltip, Button, Icon } from '@gravity-ui/uikit';
|
|
5
5
|
import { createBlock } from '../../../../utils/cn.js';
|
|
6
|
+
import i18n from '../i18n/index.js';
|
|
6
7
|
import styles from './AllPagesListItem.module.scss.js';
|
|
7
8
|
|
|
8
9
|
const b = createBlock('all-pages-list-item', styles);
|
|
@@ -25,8 +26,9 @@ const AllPagesListItem = (props) => {
|
|
|
25
26
|
return (React__default.createElement(Tag, Object.assign({}, tagProps, { className: b(), onClick: onItemClick, ref: ref }),
|
|
26
27
|
params.icon,
|
|
27
28
|
React__default.createElement("span", { className: b('text') }, params.title),
|
|
28
|
-
editMode && !item.preventUserRemoving && (React__default.createElement(
|
|
29
|
-
React__default.createElement(Button
|
|
29
|
+
editMode && !item.preventUserRemoving && (React__default.createElement(Tooltip, { content: i18n(item.hidden ? 'all-panel.item.pin' : 'all-panel.item.unpin') },
|
|
30
|
+
React__default.createElement(Button, { "aria-label": i18n(item.hidden ? 'all-panel.item.pin' : 'all-panel.item.unpin'), onClick: onPinButtonClick, view: item.hidden ? 'flat-secondary' : 'flat-action' },
|
|
31
|
+
React__default.createElement(Button.Icon, null, item.hidden ? React__default.createElement(Pin, null) : React__default.createElement(PinFill, null)))))));
|
|
30
32
|
}, [Tag, tagProps, editMode, item, onPinButtonClick]);
|
|
31
33
|
const iconNode = item.icon ? (React__default.createElement(Icon, { className: b('icon'), data: item.icon, size: item.iconSize })) : null;
|
|
32
34
|
const titleNode = item.title;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AllPagesListItem.js","sources":["../../../../../../../../src/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.tsx"],"sourcesContent":["import React, {MouseEvent, useCallback, useRef} from 'react';\n\nimport {Pin, PinFill} from '@gravity-ui/icons';\nimport {Button, Icon} from '@gravity-ui/uikit';\n\nimport {AsideHeaderItem} from 'src/components/AsideHeader/types';\nimport {MakeItemParams} from 'src/components/types';\n\nimport {createBlock} from '../../../../utils/cn';\n\nimport styles from './AllPagesListItem.module.scss';\n\nconst b = createBlock('all-pages-list-item', styles);\n\ninterface AllPagesListItemProps {\n item: AsideHeaderItem;\n editMode?: boolean;\n enableSorting?: boolean;\n onToggle: () => void;\n onDragStart?: () => void;\n onDragEnd?: () => void;\n}\n\nexport const AllPagesListItem: React.FC<AllPagesListItemProps> = (props) => {\n const {item, editMode, onToggle} = props;\n const ref = useRef<HTMLAnchorElement & HTMLButtonElement>(null);\n\n const onPinButtonClick = useCallback(\n (e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n e.stopPropagation();\n e.preventDefault();\n onToggle();\n },\n [onToggle],\n );\n\n const [Tag, tagProps] = item.href ? ['a' as const, {href: item.href}] : ['button' as const, {}];\n\n const makeNode = useCallback(\n (params: MakeItemParams) => {\n const onItemClick = (e: MouseEvent<HTMLElement>) => {\n if (editMode) {\n e.stopPropagation();\n e.preventDefault();\n }\n };\n\n return (\n <Tag {...tagProps} className={b()} onClick={onItemClick} ref={ref}>\n {params.icon}\n <span className={b('text')}>{params.title}</span>\n {editMode && !item.preventUserRemoving && (\n <Button\n
|
|
1
|
+
{"version":3,"file":"AllPagesListItem.js","sources":["../../../../../../../../src/components/AsideHeader/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.tsx"],"sourcesContent":["import React, {MouseEvent, useCallback, useRef} from 'react';\n\nimport {Pin, PinFill} from '@gravity-ui/icons';\nimport {Button, Icon, Tooltip} from '@gravity-ui/uikit';\n\nimport {AsideHeaderItem} from 'src/components/AsideHeader/types';\nimport {MakeItemParams} from 'src/components/types';\n\nimport {createBlock} from '../../../../utils/cn';\nimport i18n from '../i18n';\n\nimport styles from './AllPagesListItem.module.scss';\n\nconst b = createBlock('all-pages-list-item', styles);\n\ninterface AllPagesListItemProps {\n item: AsideHeaderItem;\n editMode?: boolean;\n enableSorting?: boolean;\n onToggle: () => void;\n onDragStart?: () => void;\n onDragEnd?: () => void;\n}\n\nexport const AllPagesListItem: React.FC<AllPagesListItemProps> = (props) => {\n const {item, editMode, onToggle} = props;\n const ref = useRef<HTMLAnchorElement & HTMLButtonElement>(null);\n\n const onPinButtonClick = useCallback(\n (e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n e.stopPropagation();\n e.preventDefault();\n onToggle();\n },\n [onToggle],\n );\n\n const [Tag, tagProps] = item.href ? ['a' as const, {href: item.href}] : ['button' as const, {}];\n\n const makeNode = useCallback(\n (params: MakeItemParams) => {\n const onItemClick = (e: MouseEvent<HTMLElement>) => {\n if (editMode) {\n e.stopPropagation();\n e.preventDefault();\n }\n };\n\n return (\n <Tag {...tagProps} className={b()} onClick={onItemClick} ref={ref}>\n {params.icon}\n <span className={b('text')}>{params.title}</span>\n {editMode && !item.preventUserRemoving && (\n <Tooltip\n content={i18n(\n item.hidden ? 'all-panel.item.pin' : 'all-panel.item.unpin',\n )}\n >\n <Button\n aria-label={i18n(\n item.hidden ? 'all-panel.item.pin' : 'all-panel.item.unpin',\n )}\n onClick={onPinButtonClick}\n view={item.hidden ? 'flat-secondary' : 'flat-action'}\n >\n <Button.Icon>{item.hidden ? <Pin /> : <PinFill />}</Button.Icon>\n </Button>\n </Tooltip>\n )}\n </Tag>\n );\n },\n [Tag, tagProps, editMode, item, onPinButtonClick],\n );\n\n const iconNode = item.icon ? (\n <Icon className={b('icon')} data={item.icon} size={item.iconSize} />\n ) : null;\n const titleNode = item.title;\n const params: MakeItemParams = {icon: iconNode, title: titleNode};\n const opts = {collapsed: false, compact: false, item, ref};\n\n if (typeof item.itemWrapper === 'function') {\n return item.itemWrapper(params, makeNode, opts) as React.ReactElement;\n }\n\n return makeNode(params);\n};\n"],"names":["React"],"mappings":"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"}
|
|
@@ -3,7 +3,9 @@ var en = {
|
|
|
3
3
|
"all-panel.menu.category.allOther": "All other",
|
|
4
4
|
"all-panel.resetToDefault": "Reset to default",
|
|
5
5
|
"all-panel.title.editing": "Configuring the menu bar",
|
|
6
|
-
"all-panel.title.main": "All pages"
|
|
6
|
+
"all-panel.title.main": "All pages",
|
|
7
|
+
"all-panel.item.pin": "Pin",
|
|
8
|
+
"all-panel.item.unpin": "Unpin"
|
|
7
9
|
};
|
|
8
10
|
|
|
9
11
|
export { en as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"en.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"en.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
declare const _default: ((key: "menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main", params?: import("@gravity-ui/i18n").Params) => string) & {
|
|
1
|
+
declare const _default: ((key: "menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main" | "all-panel.item.pin" | "all-panel.item.unpin", params?: import("@gravity-ui/i18n").Params) => string) & {
|
|
2
2
|
Translation: import("react").ComponentType<{
|
|
3
3
|
children: (props: {
|
|
4
|
-
t: (key: "menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main", params?: import("@gravity-ui/i18n").Params) => string;
|
|
4
|
+
t: (key: "menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main" | "all-panel.item.pin" | "all-panel.item.unpin", params?: import("@gravity-ui/i18n").Params) => string;
|
|
5
5
|
}) => React.ReactNode;
|
|
6
6
|
}>;
|
|
7
7
|
useTranslation: () => {
|
|
8
|
-
t: (key: "menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main", params?: import("@gravity-ui/i18n").Params) => string;
|
|
8
|
+
t: (key: "menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main" | "all-panel.item.pin" | "all-panel.item.unpin", params?: import("@gravity-ui/i18n").Params) => string;
|
|
9
9
|
};
|
|
10
10
|
keysetData: {
|
|
11
|
-
"gn-AllPagesPanel": Record<"menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main", import("@gravity-ui/i18n").KeyData>;
|
|
11
|
+
"gn-AllPagesPanel": Record<"menu-item.all-pages.title" | "all-panel.menu.category.allOther" | "all-panel.resetToDefault" | "all-panel.title.editing" | "all-panel.title.main" | "all-panel.item.pin" | "all-panel.item.unpin", import("@gravity-ui/i18n").KeyData>;
|
|
12
12
|
};
|
|
13
13
|
};
|
|
14
14
|
export default _default;
|
|
@@ -3,7 +3,9 @@ var ru = {
|
|
|
3
3
|
"all-panel.menu.category.allOther": "Остальное",
|
|
4
4
|
"all-panel.resetToDefault": "Сбросить по умолчанию",
|
|
5
5
|
"all-panel.title.editing": "Настройка панели меню",
|
|
6
|
-
"all-panel.title.main": "Все страницы"
|
|
6
|
+
"all-panel.title.main": "Все страницы",
|
|
7
|
+
"all-panel.item.pin": "Закрепить",
|
|
8
|
+
"all-panel.item.unpin": "Открепить"
|
|
7
9
|
};
|
|
8
10
|
|
|
9
11
|
export { ru as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ru.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ru.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.HotkeysPanel-module__gn-hotkeys-panel___Aab92{--hotkeys-panel-width:400px;--hotkeys-panel-vertical-padding:18px;--hotkeys-panel-horizontal-padding:var(--g-spacing-6);inset:0;position:fixed}.HotkeysPanel-module__gn-hotkeys-panel__drawer-item___T-3tZ{box-sizing:border-box;
|
|
1
|
+
.HotkeysPanel-module__gn-hotkeys-panel___Aab92{--hotkeys-panel-width:400px;--hotkeys-panel-vertical-padding:18px;--hotkeys-panel-horizontal-padding:var(--g-spacing-6);inset:0;position:fixed}.HotkeysPanel-module__gn-hotkeys-panel__drawer-item___T-3tZ{box-sizing:border-box;padding-top:var(--hotkeys-panel-vertical-padding);width:var(--hotkeys-panel-width)}.HotkeysPanel-module__gn-hotkeys-panel__drawer-content___P1nwO{display:flex;flex-direction:column;height:100%;min-height:0}.HotkeysPanel-module__gn-hotkeys-panel__title___dPviy{align-items:baseline;display:flex;gap:var(--g-spacing-2);justify-content:space-between;margin:0 var(--hotkeys-panel-horizontal-padding) var(--g-spacing-4) var(--hotkeys-panel-horizontal-padding)}.HotkeysPanel-module__gn-hotkeys-panel__search___olv3P{box-sizing:border-box;margin-bottom:var(--g-spacing-4);padding:0 var(--hotkeys-panel-horizontal-padding)}.HotkeysPanel-module__gn-hotkeys-panel__list___ToMip{flex:1;min-height:0;overflow-y:auto}.HotkeysPanel-module__gn-hotkeys-panel__list___ToMip:after{content:"";display:block;height:var(--hotkeys-panel-vertical-padding)}.HotkeysPanel-module__gn-hotkeys-panel__item___BKagb[class]{height:auto;margin:0 var(--hotkeys-panel-horizontal-padding);padding:var(--g-spacing-2) 0}.HotkeysPanel-module__gn-hotkeys-panel__item___BKagb[class].g-list__item_active, .HotkeysPanel-module__gn-hotkeys-panel__item___BKagb[class]:hover{background:inherit}.HotkeysPanel-module__gn-hotkeys-panel__item___BKagb[class]:not(:first-child):has(.HotkeysPanel-module__gn-hotkeys-panel__item-content_type_group___q8vt0){border-top:1px solid var(--g-color-line-generic);margin-top:var(--g-spacing-3);padding-top:var(--g-spacing-4)}.HotkeysPanel-module__gn-hotkeys-panel__item-content___Wqp2t{align-items:baseline;color:var(--g-color-text-primary);display:flex;justify-content:space-between;margin:0;width:100%}.HotkeysPanel-module__gn-hotkeys-panel__item-hint___QbgP4{margin-left:var(--g-spacing-1)}.HotkeysPanel-module__gn-hotkeys-panel__item-hint-tooltip___xdDtY{max-width:217px}.HotkeysPanel-module__gn-hotkeys-panel__hotkey___-LPxF{color:var(--g-color-text-complementary)}
|
|
@@ -23,7 +23,7 @@ function HotkeysPanel(_a) {
|
|
|
23
23
|
item.title,
|
|
24
24
|
item.hint && (React__default.createElement(HelpMark, { "aria-hidden": true, popoverProps: { className: b('item-hint-tooltip') }, className: b('item-hint') }, item.hint))),
|
|
25
25
|
item.value && (React__default.createElement(Hotkey, { className: b('hotkey'), value: item.value, platform: platform })))), [itemContentClassName, platform]);
|
|
26
|
-
const drawerItemContent = (React__default.createElement(
|
|
26
|
+
const drawerItemContent = (React__default.createElement("div", { className: b('drawer-content') },
|
|
27
27
|
React__default.createElement(Text, { variant: "subheader-3", as: 'h2', className: b('title', titleClassName) },
|
|
28
28
|
title,
|
|
29
29
|
togglePanelHotkey && React__default.createElement(Hotkey, { value: togglePanelHotkey, platform: platform })),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HotkeysPanel.js","sources":["../../../../../src/components/HotkeysPanel/HotkeysPanel.tsx"],"sourcesContent":["import React, {useCallback, useMemo, 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 [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 <
|
|
1
|
+
{"version":3,"file":"HotkeysPanel.js","sources":["../../../../../src/components/HotkeysPanel/HotkeysPanel.tsx"],"sourcesContent":["import React, {useCallback, useMemo, 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 [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 <div className={b('drawer-content')}>\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 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 </div>\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 onOpenChange={onOpenChange}\n style={style}\n contentClassName={b('drawer-item', drawerItemClassName)}\n {...drawerProps}\n >\n {drawerItemContent}\n </Drawer>\n );\n}\n"],"names":["React"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var styles = {"gn-hotkeys-panel":"HotkeysPanel-module__gn-hotkeys-panel___Aab92","gnHotkeysPanel":"HotkeysPanel-module__gn-hotkeys-panel___Aab92","gn-hotkeys-panel__drawer-item":"HotkeysPanel-module__gn-hotkeys-panel__drawer-item___T-3tZ","gnHotkeysPanelDrawerItem":"HotkeysPanel-module__gn-hotkeys-panel__drawer-item___T-3tZ","gn-hotkeys-panel__title":"HotkeysPanel-module__gn-hotkeys-panel__title___dPviy","gnHotkeysPanelTitle":"HotkeysPanel-module__gn-hotkeys-panel__title___dPviy","gn-hotkeys-panel__search":"HotkeysPanel-module__gn-hotkeys-panel__search___olv3P","gnHotkeysPanelSearch":"HotkeysPanel-module__gn-hotkeys-panel__search___olv3P","gn-hotkeys-panel__list":"HotkeysPanel-module__gn-hotkeys-panel__list___ToMip","gnHotkeysPanelList":"HotkeysPanel-module__gn-hotkeys-panel__list___ToMip","gn-hotkeys-panel__item":"HotkeysPanel-module__gn-hotkeys-panel__item___BKagb","gnHotkeysPanelItem":"HotkeysPanel-module__gn-hotkeys-panel__item___BKagb","gn-hotkeys-panel__item-content_type_group":"HotkeysPanel-module__gn-hotkeys-panel__item-content_type_group___q8vt0","gnHotkeysPanelItemContentTypeGroup":"HotkeysPanel-module__gn-hotkeys-panel__item-content_type_group___q8vt0","gn-hotkeys-panel__item-content":"HotkeysPanel-module__gn-hotkeys-panel__item-content___Wqp2t","gnHotkeysPanelItemContent":"HotkeysPanel-module__gn-hotkeys-panel__item-content___Wqp2t","gn-hotkeys-panel__item-hint":"HotkeysPanel-module__gn-hotkeys-panel__item-hint___QbgP4","gnHotkeysPanelItemHint":"HotkeysPanel-module__gn-hotkeys-panel__item-hint___QbgP4","gn-hotkeys-panel__item-hint-tooltip":"HotkeysPanel-module__gn-hotkeys-panel__item-hint-tooltip___xdDtY","gnHotkeysPanelItemHintTooltip":"HotkeysPanel-module__gn-hotkeys-panel__item-hint-tooltip___xdDtY","gn-hotkeys-panel__hotkey":"HotkeysPanel-module__gn-hotkeys-panel__hotkey___-LPxF","gnHotkeysPanelHotkey":"HotkeysPanel-module__gn-hotkeys-panel__hotkey___-LPxF"};
|
|
1
|
+
var styles = {"gn-hotkeys-panel":"HotkeysPanel-module__gn-hotkeys-panel___Aab92","gnHotkeysPanel":"HotkeysPanel-module__gn-hotkeys-panel___Aab92","gn-hotkeys-panel__drawer-item":"HotkeysPanel-module__gn-hotkeys-panel__drawer-item___T-3tZ","gnHotkeysPanelDrawerItem":"HotkeysPanel-module__gn-hotkeys-panel__drawer-item___T-3tZ","gn-hotkeys-panel__drawer-content":"HotkeysPanel-module__gn-hotkeys-panel__drawer-content___P1nwO","gnHotkeysPanelDrawerContent":"HotkeysPanel-module__gn-hotkeys-panel__drawer-content___P1nwO","gn-hotkeys-panel__title":"HotkeysPanel-module__gn-hotkeys-panel__title___dPviy","gnHotkeysPanelTitle":"HotkeysPanel-module__gn-hotkeys-panel__title___dPviy","gn-hotkeys-panel__search":"HotkeysPanel-module__gn-hotkeys-panel__search___olv3P","gnHotkeysPanelSearch":"HotkeysPanel-module__gn-hotkeys-panel__search___olv3P","gn-hotkeys-panel__list":"HotkeysPanel-module__gn-hotkeys-panel__list___ToMip","gnHotkeysPanelList":"HotkeysPanel-module__gn-hotkeys-panel__list___ToMip","gn-hotkeys-panel__item":"HotkeysPanel-module__gn-hotkeys-panel__item___BKagb","gnHotkeysPanelItem":"HotkeysPanel-module__gn-hotkeys-panel__item___BKagb","gn-hotkeys-panel__item-content_type_group":"HotkeysPanel-module__gn-hotkeys-panel__item-content_type_group___q8vt0","gnHotkeysPanelItemContentTypeGroup":"HotkeysPanel-module__gn-hotkeys-panel__item-content_type_group___q8vt0","gn-hotkeys-panel__item-content":"HotkeysPanel-module__gn-hotkeys-panel__item-content___Wqp2t","gnHotkeysPanelItemContent":"HotkeysPanel-module__gn-hotkeys-panel__item-content___Wqp2t","gn-hotkeys-panel__item-hint":"HotkeysPanel-module__gn-hotkeys-panel__item-hint___QbgP4","gnHotkeysPanelItemHint":"HotkeysPanel-module__gn-hotkeys-panel__item-hint___QbgP4","gn-hotkeys-panel__item-hint-tooltip":"HotkeysPanel-module__gn-hotkeys-panel__item-hint-tooltip___xdDtY","gnHotkeysPanelItemHintTooltip":"HotkeysPanel-module__gn-hotkeys-panel__item-hint-tooltip___xdDtY","gn-hotkeys-panel__hotkey":"HotkeysPanel-module__gn-hotkeys-panel__hotkey___-LPxF","gnHotkeysPanelHotkey":"HotkeysPanel-module__gn-hotkeys-panel__hotkey___-LPxF"};
|
|
2
2
|
|
|
3
3
|
export { styles as default };
|
|
4
4
|
//# sourceMappingURL=HotkeysPanel.module.scss.js.map
|