@flipdish/ui-library 0.26.2 → 0.27.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/dist/components/molecules/Select/components/multi-select.cjs +5 -3
- package/dist/components/molecules/Select/components/multi-select.cjs.map +1 -1
- package/dist/components/molecules/Select/components/multi-select.d.ts.map +1 -1
- package/dist/components/molecules/Select/components/multi-select.js +5 -3
- package/dist/components/molecules/Select/components/multi-select.js.map +1 -1
- package/dist/components/organisms/ApplicationHeader/applicationHeader.types.d.ts +54 -0
- package/dist/components/organisms/ApplicationHeader/applicationHeader.types.d.ts.map +1 -0
- package/dist/components/organisms/ApplicationHeader/applicationHeader.utils.cjs +15 -0
- package/dist/components/organisms/ApplicationHeader/applicationHeader.utils.cjs.map +1 -0
- package/dist/components/organisms/ApplicationHeader/applicationHeader.utils.d.ts +5 -0
- package/dist/components/organisms/ApplicationHeader/applicationHeader.utils.d.ts.map +1 -0
- package/dist/components/organisms/ApplicationHeader/applicationHeader.utils.js +12 -0
- package/dist/components/organisms/ApplicationHeader/applicationHeader.utils.js.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/avatar-button.cjs +14 -0
- package/dist/components/organisms/ApplicationHeader/components/avatar-button.cjs.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/avatar-button.d.ts +11 -0
- package/dist/components/organisms/ApplicationHeader/components/avatar-button.d.ts.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/avatar-button.js +12 -0
- package/dist/components/organisms/ApplicationHeader/components/avatar-button.js.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/header-action.cjs +11 -0
- package/dist/components/organisms/ApplicationHeader/components/header-action.cjs.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/header-action.d.ts +17 -0
- package/dist/components/organisms/ApplicationHeader/components/header-action.d.ts.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/header-action.js +9 -0
- package/dist/components/organisms/ApplicationHeader/components/header-action.js.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/menu-button.cjs +11 -0
- package/dist/components/organisms/ApplicationHeader/components/menu-button.cjs.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/menu-button.d.ts +11 -0
- package/dist/components/organisms/ApplicationHeader/components/menu-button.d.ts.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/menu-button.js +9 -0
- package/dist/components/organisms/ApplicationHeader/components/menu-button.js.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/search-trigger.cjs +19 -0
- package/dist/components/organisms/ApplicationHeader/components/search-trigger.cjs.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/search-trigger.d.ts +25 -0
- package/dist/components/organisms/ApplicationHeader/components/search-trigger.d.ts.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/search-trigger.js +17 -0
- package/dist/components/organisms/ApplicationHeader/components/search-trigger.js.map +1 -0
- package/dist/components/organisms/ApplicationHeader/index.cjs +48 -0
- package/dist/components/organisms/ApplicationHeader/index.cjs.map +1 -0
- package/dist/components/organisms/ApplicationHeader/index.d.ts +43 -0
- package/dist/components/organisms/ApplicationHeader/index.d.ts.map +1 -0
- package/dist/components/organisms/ApplicationHeader/index.js +46 -0
- package/dist/components/organisms/ApplicationHeader/index.js.map +1 -0
- package/dist/components/organisms/CommandMenu/index.cjs +1 -1
- package/dist/components/organisms/CommandMenu/index.d.ts.map +1 -1
- package/dist/components/organisms/CommandMenu/index.js +1 -1
- package/dist/native/components/organisms/ApplicationHeader/index.d.ts +12 -0
- package/dist/utilities/__internal__/hotkeysUtils/hotkeys.utils.cjs +105 -0
- package/dist/utilities/__internal__/hotkeysUtils/hotkeys.utils.cjs.map +1 -0
- package/dist/{components/organisms/CommandMenu → utilities/__internal__/hotkeysUtils}/hotkeys.utils.d.ts +10 -0
- package/dist/utilities/__internal__/hotkeysUtils/hotkeys.utils.d.ts.map +1 -0
- package/dist/utilities/__internal__/hotkeysUtils/hotkeys.utils.js +98 -0
- package/dist/utilities/__internal__/hotkeysUtils/hotkeys.utils.js.map +1 -0
- package/package.json +1 -1
- package/dist/components/organisms/CommandMenu/hotkeys.utils.cjs +0 -64
- package/dist/components/organisms/CommandMenu/hotkeys.utils.cjs.map +0 -1
- package/dist/components/organisms/CommandMenu/hotkeys.utils.d.ts.map +0 -1
- package/dist/components/organisms/CommandMenu/hotkeys.utils.js +0 -61
- package/dist/components/organisms/CommandMenu/hotkeys.utils.js.map +0 -1
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var uiIcons = require('@flipdish/ui-icons');
|
|
5
|
+
var FlipdishLogo = require('@flipdish/ui-library/components/atoms/FlipdishLogo');
|
|
6
|
+
var useBreakpoints = require('@flipdish/ui-library/hooks/useBreakpoints');
|
|
7
|
+
var cx = require('@flipdish/ui-library/utilities/cx');
|
|
8
|
+
var testIdUtils = require('@flipdish/ui-library/utilities/testIdUtils');
|
|
9
|
+
var React = require('react');
|
|
10
|
+
var reactAriaComponents = require('react-aria-components');
|
|
11
|
+
var reactHotkeysHook = require('react-hotkeys-hook');
|
|
12
|
+
var hotkeys_utils = require('../../../utilities/__internal__/hotkeysUtils/hotkeys.utils.cjs');
|
|
13
|
+
var applicationHeader_utils = require('./applicationHeader.utils.cjs');
|
|
14
|
+
var avatarButton = require('./components/avatar-button.cjs');
|
|
15
|
+
var headerAction = require('./components/header-action.cjs');
|
|
16
|
+
var menuButton = require('./components/menu-button.cjs');
|
|
17
|
+
var searchTrigger = require('./components/search-trigger.cjs');
|
|
18
|
+
|
|
19
|
+
const DEFAULT_SHORTCUT = 'mod+k';
|
|
20
|
+
const subscribeToNothing = () => () => { };
|
|
21
|
+
/**
|
|
22
|
+
* App-shell top bar that sits above every page: a search trigger on desktop, and
|
|
23
|
+
* notifications, assistant and avatar actions at every width. Below `lg` the search gives
|
|
24
|
+
* way to a navigation menu toggle and the Flipdish logo. Every section is data-driven and
|
|
25
|
+
* optional — the header owns layout, labelling and the search shortcut, while the app owns
|
|
26
|
+
* what each press does. Sticks to the top of the scrolling page.
|
|
27
|
+
*
|
|
28
|
+
* @summary app-shell top bar with search, notifications, assistant and avatar
|
|
29
|
+
*/
|
|
30
|
+
const ApplicationHeader = ({ search, notifications, assistant, avatar, menu, homeHref = '/', className, 'data-testid': dataTestId, }) => {
|
|
31
|
+
const rootTestId = testIdUtils.useResolvedTestId({ testId: dataTestId, segment: 'application-header', rootName: 'application-header' });
|
|
32
|
+
const isDesktop = useBreakpoints.useBreakpoints('lg');
|
|
33
|
+
// Server snapshot is `false` so the hint hydrates consistently, then settles on the real platform.
|
|
34
|
+
const isApple = React.useSyncExternalStore(subscribeToNothing, hotkeys_utils.isApplePlatform, () => false);
|
|
35
|
+
const shortcut = search ? (search.shortcut === undefined ? DEFAULT_SHORTCUT : search.shortcut) : null;
|
|
36
|
+
const onSearchPress = search?.onPress;
|
|
37
|
+
reactHotkeysHook.useHotkeys(shortcut ?? '', () => onSearchPress?.(),
|
|
38
|
+
// The search trigger is hidden below `lg`, so the shortcut is too.
|
|
39
|
+
{ enabled: Boolean(shortcut && isDesktop), preventDefault: true, enableOnFormTags: true, enableOnContentEditable: true }, [onSearchPress]);
|
|
40
|
+
const notificationsLabel = notifications?.label ?? 'Notifications';
|
|
41
|
+
const assistantLabel = assistant?.label ?? 'Assistant';
|
|
42
|
+
const menuLabel = menu?.label ?? (menu?.isOpen ? 'Close navigation menu' : 'Open navigation menu');
|
|
43
|
+
const hasActions = Boolean(notifications || assistant || avatar);
|
|
44
|
+
return (jsxRuntime.jsx(testIdUtils.TestIdProvider, { value: rootTestId, children: jsxRuntime.jsxs("header", { "data-testid": rootTestId, className: cx.cx('sticky top-0 z-30 flex h-14 w-full items-center gap-2 border-b border-secondary bg-primary pr-3 pl-4 lg:h-16 lg:px-6', className), children: [menu && (jsxRuntime.jsx(menuButton.MenuButton, { isOpen: menu.isOpen, onPress: () => menu.onOpenChange(!menu.isOpen), label: menuLabel, controls: menu.controls, className: "lg:hidden", "data-testid": menu['data-testid'] ?? testIdUtils.joinTestId(rootTestId, 'menu') })), jsxRuntime.jsx("div", { className: "flex min-w-0 flex-1 items-center lg:hidden", children: jsxRuntime.jsx(reactAriaComponents.Link, { href: homeHref, "aria-label": "Go to homepage", "data-testid": testIdUtils.joinTestId(rootTestId, 'logo'), className: "rounded-xs outline-focus-ring focus-visible:outline-2 focus-visible:outline-offset-2", children: jsxRuntime.jsx(FlipdishLogo.FlipdishLogo, { size: "sm", "aria-hidden": "true" }) }) }), search && (jsxRuntime.jsx(searchTrigger.SearchTrigger, { size: "sm", placeholder: search.placeholder ?? 'Search', label: search.label ?? 'Search', onPress: search.onPress, shortcutHint: shortcut ? hotkeys_utils.formatHotkeyHint(shortcut, isApple) : undefined, className: "w-80 max-lg:hidden", "data-testid": search['data-testid'] ?? testIdUtils.joinTestId(rootTestId, 'search') })), hasActions && (jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-2 lg:ml-auto", children: [notifications && (jsxRuntime.jsx(headerAction.HeaderAction, { icon: uiIcons.Bell01, label: applicationHeader_utils.getNotificationsLabel(notificationsLabel, notifications.count), tooltip: notificationsLabel, badge: applicationHeader_utils.formatBadgeCount(notifications.count), onPress: notifications.onPress, "data-testid": notifications['data-testid'] ?? testIdUtils.joinTestId(rootTestId, 'notifications') })), assistant && (jsxRuntime.jsx(headerAction.HeaderAction, { icon: uiIcons.Stars01, label: assistantLabel, tooltip: assistantLabel, onPress: assistant.onPress, "data-testid": assistant['data-testid'] ?? testIdUtils.joinTestId(rootTestId, 'assistant') })), avatar && (jsxRuntime.jsx(avatarButton.AvatarButton, { name: avatar.name, src: avatar.src, initials: avatar.initials, label: avatar.label ?? avatar.name, onPress: avatar.onPress, "data-testid": avatar['data-testid'] ?? testIdUtils.joinTestId(rootTestId, 'avatar') }))] }))] }) }));
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
exports.ApplicationHeader = ApplicationHeader;
|
|
48
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../../src/components/organisms/ApplicationHeader/index.tsx"],"sourcesContent":[null],"names":["useResolvedTestId","useBreakpoints","useSyncExternalStore","isApplePlatform","useHotkeys","_jsx","TestIdProvider","_jsxs","cx","MenuButton","joinTestId","AriaLink","FlipdishLogo","SearchTrigger","formatHotkeyHint","HeaderAction","Bell01","getNotificationsLabel","formatBadgeCount","Stars01","AvatarButton"],"mappings":"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"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import type { ApplicationHeaderAssistant, ApplicationHeaderAvatar, ApplicationHeaderMenu, ApplicationHeaderNotifications, ApplicationHeaderSearch } from './applicationHeader.types';
|
|
2
|
+
export type { ApplicationHeaderAssistant, ApplicationHeaderAvatar, ApplicationHeaderMenu, ApplicationHeaderNotifications, ApplicationHeaderSearch, } from './applicationHeader.types';
|
|
3
|
+
export interface ApplicationHeaderProps {
|
|
4
|
+
/**
|
|
5
|
+
* Search trigger, shown from `lg`. It is a button dressed as a search field — pressing it (or its
|
|
6
|
+
* shortcut) calls `onPress` so the app can open its own search surface. Omit to hide.
|
|
7
|
+
*/
|
|
8
|
+
search?: ApplicationHeaderSearch;
|
|
9
|
+
/** Notifications button with an unread badge. Omit to hide. */
|
|
10
|
+
notifications?: ApplicationHeaderNotifications;
|
|
11
|
+
/** AI assistant button. Omit to hide. */
|
|
12
|
+
assistant?: ApplicationHeaderAssistant;
|
|
13
|
+
/** Avatar button for the current organisation, store or user. Omit to hide. */
|
|
14
|
+
avatar?: ApplicationHeaderAvatar;
|
|
15
|
+
/**
|
|
16
|
+
* Navigation menu toggle, shown below `lg`. Share its state with
|
|
17
|
+
* `SidebarNavigation`'s `mobileMenuOpen` / `onMobileMenuOpenChange`. Omit to hide.
|
|
18
|
+
*/
|
|
19
|
+
menu?: ApplicationHeaderMenu;
|
|
20
|
+
/**
|
|
21
|
+
* Destination of the logo link shown below `lg`.
|
|
22
|
+
* @default "/"
|
|
23
|
+
*/
|
|
24
|
+
homeHref?: string;
|
|
25
|
+
/** Extra classes merged onto the root `<header>`. */
|
|
26
|
+
className?: string;
|
|
27
|
+
/**
|
|
28
|
+
* Overrides the root `data-testid`. Defaults to `fd-application-header`. Child
|
|
29
|
+
* elements derive their testids from this prefix (e.g. `<root>--search`).
|
|
30
|
+
*/
|
|
31
|
+
'data-testid'?: string;
|
|
32
|
+
}
|
|
33
|
+
/**
|
|
34
|
+
* App-shell top bar that sits above every page: a search trigger on desktop, and
|
|
35
|
+
* notifications, assistant and avatar actions at every width. Below `lg` the search gives
|
|
36
|
+
* way to a navigation menu toggle and the Flipdish logo. Every section is data-driven and
|
|
37
|
+
* optional — the header owns layout, labelling and the search shortcut, while the app owns
|
|
38
|
+
* what each press does. Sticks to the top of the scrolling page.
|
|
39
|
+
*
|
|
40
|
+
* @summary app-shell top bar with search, notifications, assistant and avatar
|
|
41
|
+
*/
|
|
42
|
+
export declare const ApplicationHeader: ({ search, notifications, assistant, avatar, menu, homeHref, className, "data-testid": dataTestId, }: ApplicationHeaderProps) => import("react").JSX.Element;
|
|
43
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/ApplicationHeader/index.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EACV,0BAA0B,EAC1B,uBAAuB,EACvB,qBAAqB,EACrB,8BAA8B,EAC9B,uBAAuB,EACxB,MAAM,2BAA2B,CAAC;AAOnC,YAAY,EACV,0BAA0B,EAC1B,uBAAuB,EACvB,qBAAqB,EACrB,8BAA8B,EAC9B,uBAAuB,GACxB,MAAM,2BAA2B,CAAC;AAMnC,MAAM,WAAW,sBAAsB;IACrC;;;OAGG;IACH,MAAM,CAAC,EAAE,uBAAuB,CAAC;IACjC,+DAA+D;IAC/D,aAAa,CAAC,EAAE,8BAA8B,CAAC;IAC/C,yCAAyC;IACzC,SAAS,CAAC,EAAE,0BAA0B,CAAC;IACvC,+EAA+E;IAC/E,MAAM,CAAC,EAAE,uBAAuB,CAAC;IACjC;;;OAGG;IACH,IAAI,CAAC,EAAE,qBAAqB,CAAC;IAC7B;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,iBAAiB,GAAI,qGAS/B,sBAAsB,gCAuGxB,CAAC"}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
+
import { Bell01, Stars01 } from '@flipdish/ui-icons';
|
|
3
|
+
import { FlipdishLogo } from '@flipdish/ui-library/components/atoms/FlipdishLogo';
|
|
4
|
+
import { useBreakpoints } from '@flipdish/ui-library/hooks/useBreakpoints';
|
|
5
|
+
import { cx } from '@flipdish/ui-library/utilities/cx';
|
|
6
|
+
import { useResolvedTestId, TestIdProvider, joinTestId } from '@flipdish/ui-library/utilities/testIdUtils';
|
|
7
|
+
import { useSyncExternalStore } from 'react';
|
|
8
|
+
import { Link } from 'react-aria-components';
|
|
9
|
+
import { useHotkeys } from 'react-hotkeys-hook';
|
|
10
|
+
import { isApplePlatform, formatHotkeyHint } from '../../../utilities/__internal__/hotkeysUtils/hotkeys.utils.js';
|
|
11
|
+
import { formatBadgeCount, getNotificationsLabel } from './applicationHeader.utils.js';
|
|
12
|
+
import { AvatarButton } from './components/avatar-button.js';
|
|
13
|
+
import { HeaderAction } from './components/header-action.js';
|
|
14
|
+
import { MenuButton } from './components/menu-button.js';
|
|
15
|
+
import { SearchTrigger } from './components/search-trigger.js';
|
|
16
|
+
|
|
17
|
+
const DEFAULT_SHORTCUT = 'mod+k';
|
|
18
|
+
const subscribeToNothing = () => () => { };
|
|
19
|
+
/**
|
|
20
|
+
* App-shell top bar that sits above every page: a search trigger on desktop, and
|
|
21
|
+
* notifications, assistant and avatar actions at every width. Below `lg` the search gives
|
|
22
|
+
* way to a navigation menu toggle and the Flipdish logo. Every section is data-driven and
|
|
23
|
+
* optional — the header owns layout, labelling and the search shortcut, while the app owns
|
|
24
|
+
* what each press does. Sticks to the top of the scrolling page.
|
|
25
|
+
*
|
|
26
|
+
* @summary app-shell top bar with search, notifications, assistant and avatar
|
|
27
|
+
*/
|
|
28
|
+
const ApplicationHeader = ({ search, notifications, assistant, avatar, menu, homeHref = '/', className, 'data-testid': dataTestId, }) => {
|
|
29
|
+
const rootTestId = useResolvedTestId({ testId: dataTestId, segment: 'application-header', rootName: 'application-header' });
|
|
30
|
+
const isDesktop = useBreakpoints('lg');
|
|
31
|
+
// Server snapshot is `false` so the hint hydrates consistently, then settles on the real platform.
|
|
32
|
+
const isApple = useSyncExternalStore(subscribeToNothing, isApplePlatform, () => false);
|
|
33
|
+
const shortcut = search ? (search.shortcut === undefined ? DEFAULT_SHORTCUT : search.shortcut) : null;
|
|
34
|
+
const onSearchPress = search?.onPress;
|
|
35
|
+
useHotkeys(shortcut ?? '', () => onSearchPress?.(),
|
|
36
|
+
// The search trigger is hidden below `lg`, so the shortcut is too.
|
|
37
|
+
{ enabled: Boolean(shortcut && isDesktop), preventDefault: true, enableOnFormTags: true, enableOnContentEditable: true }, [onSearchPress]);
|
|
38
|
+
const notificationsLabel = notifications?.label ?? 'Notifications';
|
|
39
|
+
const assistantLabel = assistant?.label ?? 'Assistant';
|
|
40
|
+
const menuLabel = menu?.label ?? (menu?.isOpen ? 'Close navigation menu' : 'Open navigation menu');
|
|
41
|
+
const hasActions = Boolean(notifications || assistant || avatar);
|
|
42
|
+
return (jsx(TestIdProvider, { value: rootTestId, children: jsxs("header", { "data-testid": rootTestId, className: cx('sticky top-0 z-30 flex h-14 w-full items-center gap-2 border-b border-secondary bg-primary pr-3 pl-4 lg:h-16 lg:px-6', className), children: [menu && (jsx(MenuButton, { isOpen: menu.isOpen, onPress: () => menu.onOpenChange(!menu.isOpen), label: menuLabel, controls: menu.controls, className: "lg:hidden", "data-testid": menu['data-testid'] ?? joinTestId(rootTestId, 'menu') })), jsx("div", { className: "flex min-w-0 flex-1 items-center lg:hidden", children: jsx(Link, { href: homeHref, "aria-label": "Go to homepage", "data-testid": joinTestId(rootTestId, 'logo'), className: "rounded-xs outline-focus-ring focus-visible:outline-2 focus-visible:outline-offset-2", children: jsx(FlipdishLogo, { size: "sm", "aria-hidden": "true" }) }) }), search && (jsx(SearchTrigger, { size: "sm", placeholder: search.placeholder ?? 'Search', label: search.label ?? 'Search', onPress: search.onPress, shortcutHint: shortcut ? formatHotkeyHint(shortcut, isApple) : undefined, className: "w-80 max-lg:hidden", "data-testid": search['data-testid'] ?? joinTestId(rootTestId, 'search') })), hasActions && (jsxs("div", { className: "flex shrink-0 items-center gap-2 lg:ml-auto", children: [notifications && (jsx(HeaderAction, { icon: Bell01, label: getNotificationsLabel(notificationsLabel, notifications.count), tooltip: notificationsLabel, badge: formatBadgeCount(notifications.count), onPress: notifications.onPress, "data-testid": notifications['data-testid'] ?? joinTestId(rootTestId, 'notifications') })), assistant && (jsx(HeaderAction, { icon: Stars01, label: assistantLabel, tooltip: assistantLabel, onPress: assistant.onPress, "data-testid": assistant['data-testid'] ?? joinTestId(rootTestId, 'assistant') })), avatar && (jsx(AvatarButton, { name: avatar.name, src: avatar.src, initials: avatar.initials, label: avatar.label ?? avatar.name, onPress: avatar.onPress, "data-testid": avatar['data-testid'] ?? joinTestId(rootTestId, 'avatar') }))] }))] }) }));
|
|
43
|
+
};
|
|
44
|
+
|
|
45
|
+
export { ApplicationHeader };
|
|
46
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/organisms/ApplicationHeader/index.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","AriaLink"],"mappings":";;;;;;;;;;;;;;;;AAgCA,MAAM,gBAAgB,GAAG,OAAO;AAEhC,MAAM,kBAAkB,GAAG,MAAM,MAAK,EAAE,CAAC;AAiCzC;;;;;;;;AAQG;AACI,MAAM,iBAAiB,GAAG,CAAC,EAChC,MAAM,EACN,aAAa,EACb,SAAS,EACT,MAAM,EACN,IAAI,EACJ,QAAQ,GAAG,GAAG,EACd,SAAS,EACT,aAAa,EAAE,UAAU,GACF,KAAI;AAC3B,IAAA,MAAM,UAAU,GAAG,iBAAiB,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,oBAAoB,EAAE,QAAQ,EAAE,oBAAoB,EAAE,CAAC;AAC3H,IAAA,MAAM,SAAS,GAAG,cAAc,CAAC,IAAI,CAAC;;AAEtC,IAAA,MAAM,OAAO,GAAG,oBAAoB,CAAC,kBAAkB,EAAE,eAAe,EAAE,MAAM,KAAK,CAAC;IAEtF,MAAM,QAAQ,GAAG,MAAM,IAAI,MAAM,CAAC,QAAQ,KAAK,SAAS,GAAG,gBAAgB,GAAG,MAAM,CAAC,QAAQ,IAAI,IAAI;AACrG,IAAA,MAAM,aAAa,GAAG,MAAM,EAAE,OAAO;IAErC,UAAU,CACR,QAAQ,IAAI,EAAE,EACd,MAAM,aAAa,IAAI;;IAEvB,EAAE,OAAO,EAAE,OAAO,CAAC,QAAQ,IAAI,SAAS,CAAC,EAAE,cAAc,EAAE,IAAI,EAAE,gBAAgB,EAAE,IAAI,EAAE,uBAAuB,EAAE,IAAI,EAAE,EACxH,CAAC,aAAa,CAAC,CAChB;AAED,IAAA,MAAM,kBAAkB,GAAG,aAAa,EAAE,KAAK,IAAI,eAAe;AAClE,IAAA,MAAM,cAAc,GAAG,SAAS,EAAE,KAAK,IAAI,WAAW;AACtD,IAAA,MAAM,SAAS,GAAG,IAAI,EAAE,KAAK,KAAK,IAAI,EAAE,MAAM,GAAG,uBAAuB,GAAG,sBAAsB,CAAC;IAClG,MAAM,UAAU,GAAG,OAAO,CAAC,aAAa,IAAI,SAAS,IAAI,MAAM,CAAC;AAEhE,IAAA,QACEA,GAAA,CAAC,cAAc,EAAA,EAAC,KAAK,EAAE,UAAU,EAAA,QAAA,EAC/BC,IAAA,CAAA,QAAA,EAAA,EAAA,aAAA,EACe,UAAU,EACvB,SAAS,EAAE,EAAE,CACX,sHAAsH,EACtH,SAAS,CACV,EAAA,QAAA,EAAA,CAEA,IAAI,KACHD,GAAA,CAAC,UAAU,EAAA,EACT,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,EAC9C,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAC,WAAW,EAAA,aAAA,EACR,IAAI,CAAC,aAAa,CAAC,IAAI,UAAU,CAAC,UAAU,EAAE,MAAM,CAAC,EAAA,CAClE,CACH,EAEDA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,4CAA4C,EAAA,QAAA,EACzDA,IAACE,IAAQ,EAAA,EACP,IAAI,EAAE,QAAQ,EAAA,YAAA,EACH,gBAAgB,EAAA,aAAA,EACd,UAAU,CAAC,UAAU,EAAE,MAAM,CAAC,EAC3C,SAAS,EAAC,sFAAsF,EAAA,QAAA,EAEhGF,GAAA,CAAC,YAAY,EAAA,EAAC,IAAI,EAAC,IAAI,iBAAa,MAAM,EAAA,CAAG,EAAA,CACpC,EAAA,CACP,EAEL,MAAM,KACLA,GAAA,CAAC,aAAa,EAAA,EACZ,IAAI,EAAC,IAAI,EACT,WAAW,EAAE,MAAM,CAAC,WAAW,IAAI,QAAQ,EAC3C,KAAK,EAAE,MAAM,CAAC,KAAK,IAAI,QAAQ,EAC/B,OAAO,EAAE,MAAM,CAAC,OAAO,EACvB,YAAY,EAAE,QAAQ,GAAG,gBAAgB,CAAC,QAAQ,EAAE,OAAO,CAAC,GAAG,SAAS,EACxE,SAAS,EAAC,oBAAoB,EAAA,aAAA,EACjB,MAAM,CAAC,aAAa,CAAC,IAAI,UAAU,CAAC,UAAU,EAAE,QAAQ,CAAC,EAAA,CACtE,CACH,EAEA,UAAU,KACTC,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,6CAA6C,aACzD,aAAa,KACZD,GAAA,CAAC,YAAY,EAAA,EACX,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE,qBAAqB,CAAC,kBAAkB,EAAE,aAAa,CAAC,KAAK,CAAC,EACrE,OAAO,EAAE,kBAAkB,EAC3B,KAAK,EAAE,gBAAgB,CAAC,aAAa,CAAC,KAAK,CAAC,EAC5C,OAAO,EAAE,aAAa,CAAC,OAAO,EAAA,aAAA,EACjB,aAAa,CAAC,aAAa,CAAC,IAAI,UAAU,CAAC,UAAU,EAAE,eAAe,CAAC,EAAA,CACpF,CACH,EAEA,SAAS,KACRA,IAAC,YAAY,EAAA,EACX,IAAI,EAAE,OAAO,EACb,KAAK,EAAE,cAAc,EACrB,OAAO,EAAE,cAAc,EACvB,OAAO,EAAE,SAAS,CAAC,OAAO,EAAA,aAAA,EACb,SAAS,CAAC,aAAa,CAAC,IAAI,UAAU,CAAC,UAAU,EAAE,WAAW,CAAC,GAC5E,CACH,EAEA,MAAM,KACLA,IAAC,YAAY,EAAA,EACX,IAAI,EAAE,MAAM,CAAC,IAAI,EACjB,GAAG,EAAE,MAAM,CAAC,GAAG,EACf,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,KAAK,EAAE,MAAM,CAAC,KAAK,IAAI,MAAM,CAAC,IAAI,EAClC,OAAO,EAAE,MAAM,CAAC,OAAO,EAAA,aAAA,EACV,MAAM,CAAC,aAAa,CAAC,IAAI,UAAU,CAAC,UAAU,EAAE,QAAQ,CAAC,GACtE,CACH,CAAA,EAAA,CACG,CACP,CAAA,EAAA,CACM,EAAA,CACM;AAErB;;;;"}
|
|
@@ -7,12 +7,12 @@ var React = require('react');
|
|
|
7
7
|
var reactAriaComponents = require('react-aria-components');
|
|
8
8
|
var reactHotkeysHook = require('react-hotkeys-hook');
|
|
9
9
|
var children_utils = require('../../../utilities/__internal__/childrenUtils/children.utils.cjs');
|
|
10
|
+
var hotkeys_utils = require('../../../utilities/__internal__/hotkeysUtils/hotkeys.utils.cjs');
|
|
10
11
|
var commandMenu_utils = require('./commandMenu.utils.cjs');
|
|
11
12
|
var commandInput = require('./components/command-input.cjs');
|
|
12
13
|
var commandMenuFooter = require('./components/command-menu-footer.cjs');
|
|
13
14
|
var commandMenuHeader = require('./components/command-menu-header.cjs');
|
|
14
15
|
var commandMenuItem = require('./components/command-menu-item.cjs');
|
|
15
|
-
var hotkeys_utils = require('./hotkeys.utils.cjs');
|
|
16
16
|
|
|
17
17
|
const CommandMenuContext = React.createContext({
|
|
18
18
|
hasFooter: false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/CommandMenu/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,GAAG,EAAE,YAAY,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC9I,OAAO,EAEL,UAAU,IAAI,cAAc,EAE5B,aAAa,IAAI,iBAAiB,EAOnC,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/CommandMenu/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,GAAG,EAAE,YAAY,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC9I,OAAO,EAEL,UAAU,IAAI,cAAc,EAE5B,aAAa,IAAI,iBAAiB,EAOnC,MAAM,uBAAuB,CAAC;AAM/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,kCAAkC,CAAC;AAErE,OAAO,EAAE,uBAAuB,EAAE,KAAK,4BAA4B,EAAE,MAAM,gCAAgC,CAAC;AAE5G,MAAM,MAAM,oBAAoB,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,4BAA4B,EAAE,CAAA;CAAE,CAAC;AA8BzG,MAAM,WAAW,oBACf,SAAQ,IAAI,CAAC,YAAY,CAAC,oBAAoB,CAAC,EAAE,UAAU,GAAG,cAAc,GAAG,WAAW,CAAC,EACzF,IAAI,CAAC,iBAAiB,EAAE,QAAQ,CAAC,EACjC,kBAAkB;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,eAAe,CAAC,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;IACjD,gBAAgB,CAAC,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;IAClD,KAAK,CAAC,EAAE,oBAAoB,EAAE,CAAC;IAC/B,YAAY,CAAC,EAAE,oBAAoB,EAAE,CAAC;IACtC,WAAW,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,CAAC;IACjE,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,MAAM,CAAC,EAAE,KAAK,GAAG,iBAAiB,CAAC,QAAQ,CAAC,CAAC;IAC7C;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,QAAA,MAAM,eAAe,GAAI,+NAgBtB,oBAAoB,gCAmFtB,CAAC;AAEF,UAAU,gBAAiB,SAAQ,iBAAiB;IAClD,eAAe,CAAC,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;IACjD,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,eAAO,MAAM,aAAa,GAAI,uFAAuF,gBAAgB,gCAgCpI,CAAC;AAEF,UAAU,oBAAqB,SAAQ,IAAI,CAAC,YAAY,CAAC,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAAG;AAE3F,eAAO,MAAM,eAAe,GAAI,wCAAmD,oBAAoB,gCAwBtG,CAAC;AAEF,UAAU,uBAAwB,SAAQ,mBAAmB,CAAC,4BAA4B,CAAC;IACzF,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,kBAAkB,GAAI,sCAAsC,uBAAuB,gCAW/F,CAAC;AAEF,UAAU,oBAAoB;IAC5B;;OAEG;IACH,UAAU,EAAE,GAAG,CAAC;CACjB;AAED,UAAU,uBAAwB,SAAQ,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC;IACtF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,CAAC,EAAE,UAAU,EAAE,EAAE,oBAAoB,KAAK,SAAS,GAAG,SAAS,CAAC;CAC3E;AAED,eAAO,MAAM,kBAAkB,GAAI,iCAAiC,uBAAuB,uCAa1F,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,yBAAyB,qBAAqB,CAAC,KAAK,CAAC,gCAErF,CAAC;AAEF,QAAA,MAAM,WAAW,EAAsB,OAAO,eAAe,GAAG;IAC9D,IAAI,EAAE,OAAO,uBAAuB,CAAC;IACrC,IAAI,EAAE,OAAO,eAAe,CAAC;IAC7B,KAAK,EAAE,OAAO,gBAAgB,CAAC;IAC/B,MAAM,EAAE,OAAO,iBAAiB,CAAC;IACjC,OAAO,EAAE,OAAO,kBAAkB,CAAC;IACnC,OAAO,EAAE,OAAO,kBAAkB,CAAC;IACnC,OAAO,EAAE,OAAO,iBAAiB,CAAC;IAClC,UAAU,EAAE,OAAO,cAAc,CAAC;CACnC,CAAC;AAWF,OAAO,EAAE,WAAW,EAAE,CAAC"}
|
|
@@ -5,12 +5,12 @@ import { createContext, useRef, useState, useMemo, isValidElement, useContext, F
|
|
|
5
5
|
import { ModalOverlay, Modal, Dialog, useFilter, Autocomplete, TextField, ListBox, ListBoxSection, Collection, DialogTrigger } from 'react-aria-components';
|
|
6
6
|
import { useHotkeys } from 'react-hotkeys-hook';
|
|
7
7
|
import { flattenChildren } from '../../../utilities/__internal__/childrenUtils/children.utils.js';
|
|
8
|
+
import { parseHotkey } from '../../../utilities/__internal__/hotkeysUtils/hotkeys.utils.js';
|
|
8
9
|
import { isDeepEqual, mergeRefs } from './commandMenu.utils.js';
|
|
9
10
|
import { CommandInput } from './components/command-input.js';
|
|
10
11
|
import { CommandMenuFooter } from './components/command-menu-footer.js';
|
|
11
12
|
import { CommandMenuHeader } from './components/command-menu-header.js';
|
|
12
13
|
import { CommandDropdownMenuItem } from './components/command-menu-item.js';
|
|
13
|
-
import { parseHotkey } from './hotkeys.utils.js';
|
|
14
14
|
|
|
15
15
|
const CommandMenuContext = createContext({
|
|
16
16
|
hasFooter: false,
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* `ApplicationHeader` has no React Native implementation.
|
|
3
|
+
*
|
|
4
|
+
* This is a generated types-only stub (scripts/emit-native-stubs.mjs). It exists so
|
|
5
|
+
* that importing `@flipdish/ui-library/components/organisms/ApplicationHeader` from React Native fails at
|
|
6
|
+
* compile time rather than resolving to the web build's types. There is no
|
|
7
|
+
* matching `index.js`, so Metro cannot bundle this module either.
|
|
8
|
+
*
|
|
9
|
+
* To make `ApplicationHeader` available on React Native, add an `index.native.tsx` beside
|
|
10
|
+
* its `index.tsx` — the build picks it up automatically and this stub disappears.
|
|
11
|
+
*/
|
|
12
|
+
export declare const __NO_REACT_NATIVE_IMPLEMENTATION__: never;
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
/*
|
|
4
|
+
* Helpers for `react-hotkeys-hook` hotkey strings (`mod+k`). INTERNAL: imported by components as
|
|
5
|
+
* `#internal/utilities/hotkeysUtils/hotkeys.utils`.
|
|
6
|
+
*
|
|
7
|
+
* The parser section is a 1:1 copy of the library's `parseHotkeys.ts`, which cannot be imported from the
|
|
8
|
+
* package directly. Keep it in sync with the source rather than editing it:
|
|
9
|
+
* https://github.com/JohannesKlauss/react-hotkeys-hook/blob/main/packages/react-hotkeys-hook/src/lib/parseHotkeys.ts
|
|
10
|
+
*
|
|
11
|
+
* The display section below it is ours: platform detection and hint formatting built on that parser.
|
|
12
|
+
*/
|
|
13
|
+
const reservedModifierKeywords = ['shift', 'alt', 'meta', 'mod', 'ctrl', 'control'];
|
|
14
|
+
const mappedKeys = {
|
|
15
|
+
esc: 'escape',
|
|
16
|
+
return: 'enter',
|
|
17
|
+
left: 'arrowleft',
|
|
18
|
+
right: 'arrowright',
|
|
19
|
+
up: 'arrowup',
|
|
20
|
+
down: 'arrowdown',
|
|
21
|
+
ShiftLeft: 'shift',
|
|
22
|
+
ShiftRight: 'shift',
|
|
23
|
+
AltLeft: 'alt',
|
|
24
|
+
AltRight: 'alt',
|
|
25
|
+
MetaLeft: 'meta',
|
|
26
|
+
MetaRight: 'meta',
|
|
27
|
+
OSLeft: 'meta',
|
|
28
|
+
OSRight: 'meta',
|
|
29
|
+
ControlLeft: 'ctrl',
|
|
30
|
+
ControlRight: 'ctrl',
|
|
31
|
+
};
|
|
32
|
+
function mapCode(key) {
|
|
33
|
+
return (mappedKeys[key.trim()] || key.trim()).toLowerCase().replace(/key|digit|numpad/, '');
|
|
34
|
+
}
|
|
35
|
+
function isHotkeyModifier(key) {
|
|
36
|
+
return reservedModifierKeywords.includes(key);
|
|
37
|
+
}
|
|
38
|
+
function parseKeysHookInput(keys, delimiter = ',') {
|
|
39
|
+
return keys.toLowerCase().split(delimiter);
|
|
40
|
+
}
|
|
41
|
+
function parseHotkey(hotkey, splitKey = '+', sequenceSplitKey = '>', useKey = false, description) {
|
|
42
|
+
let keys = [];
|
|
43
|
+
let isSequence = false;
|
|
44
|
+
if (hotkey.includes(sequenceSplitKey)) {
|
|
45
|
+
isSequence = true;
|
|
46
|
+
keys = hotkey
|
|
47
|
+
.toLocaleLowerCase()
|
|
48
|
+
.split(sequenceSplitKey)
|
|
49
|
+
.map((k) => mapCode(k));
|
|
50
|
+
}
|
|
51
|
+
else {
|
|
52
|
+
keys = hotkey
|
|
53
|
+
.toLocaleLowerCase()
|
|
54
|
+
.split(splitKey)
|
|
55
|
+
.map((k) => mapCode(k));
|
|
56
|
+
}
|
|
57
|
+
const modifiers = {
|
|
58
|
+
alt: keys.includes('alt'),
|
|
59
|
+
ctrl: keys.includes('ctrl') || keys.includes('control'),
|
|
60
|
+
shift: keys.includes('shift'),
|
|
61
|
+
meta: keys.includes('meta'),
|
|
62
|
+
mod: keys.includes('mod'),
|
|
63
|
+
useKey,
|
|
64
|
+
};
|
|
65
|
+
const singleCharKeys = keys.filter((k) => !reservedModifierKeywords.includes(k));
|
|
66
|
+
return {
|
|
67
|
+
...modifiers,
|
|
68
|
+
hotkey,
|
|
69
|
+
keys: singleCharKeys,
|
|
70
|
+
description,
|
|
71
|
+
isSequence,
|
|
72
|
+
};
|
|
73
|
+
}
|
|
74
|
+
// #endregion
|
|
75
|
+
// #region Display
|
|
76
|
+
const APPLE_MODIFIERS = { mod: '⌘', meta: '⌘', ctrl: '⌃', control: '⌃', alt: '⌥', shift: '⇧' };
|
|
77
|
+
const OTHER_MODIFIERS = { mod: 'Ctrl', meta: 'Win', ctrl: 'Ctrl', control: 'Ctrl', alt: 'Alt', shift: 'Shift' };
|
|
78
|
+
/**
|
|
79
|
+
* Whether `mod` means ⌘ on this device. Mirrors `react-hotkeys-hook`'s own rule exactly (macOS only, not
|
|
80
|
+
* iOS/iPadOS) so a hint always names the key that fires the hotkey. Always `false` on the server.
|
|
81
|
+
*/
|
|
82
|
+
const isApplePlatform = () => typeof navigator !== 'undefined' && /mac/i.test(navigator.userAgent) && !/iphone|ipad|ipod/i.test(navigator.userAgent);
|
|
83
|
+
/**
|
|
84
|
+
* Formats a hotkey for display: `mod+k` reads `⌘K` on macOS and `Ctrl K` elsewhere.
|
|
85
|
+
* When several comma-separated alternatives are given, only the first is shown.
|
|
86
|
+
*/
|
|
87
|
+
const formatHotkeyHint = (hotkey, isApple) => {
|
|
88
|
+
const modifiers = isApple ? APPLE_MODIFIERS : OTHER_MODIFIERS;
|
|
89
|
+
const [firstHotkey = ''] = parseKeysHookInput(hotkey);
|
|
90
|
+
return firstHotkey
|
|
91
|
+
.split('+')
|
|
92
|
+
.map(mapCode)
|
|
93
|
+
.filter(Boolean)
|
|
94
|
+
.map((key) => (isHotkeyModifier(key) ? modifiers[key] : key.toUpperCase()))
|
|
95
|
+
.join(isApple ? '' : ' ');
|
|
96
|
+
};
|
|
97
|
+
// #endregion
|
|
98
|
+
|
|
99
|
+
exports.formatHotkeyHint = formatHotkeyHint;
|
|
100
|
+
exports.isApplePlatform = isApplePlatform;
|
|
101
|
+
exports.isHotkeyModifier = isHotkeyModifier;
|
|
102
|
+
exports.mapCode = mapCode;
|
|
103
|
+
exports.parseHotkey = parseHotkey;
|
|
104
|
+
exports.parseKeysHookInput = parseKeysHookInput;
|
|
105
|
+
//# sourceMappingURL=hotkeys.utils.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hotkeys.utils.cjs","sources":["../../../../src/utilities/__internal__/hotkeysUtils/hotkeys.utils.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}
|
|
@@ -16,5 +16,15 @@ export declare function mapCode(key: string): string;
|
|
|
16
16
|
export declare function isHotkeyModifier(key: string): boolean;
|
|
17
17
|
export declare function parseKeysHookInput(keys: string, delimiter?: string): string[];
|
|
18
18
|
export declare function parseHotkey(hotkey: string, splitKey?: string, sequenceSplitKey?: string, useKey?: boolean, description?: string): Hotkey;
|
|
19
|
+
/**
|
|
20
|
+
* Whether `mod` means ⌘ on this device. Mirrors `react-hotkeys-hook`'s own rule exactly (macOS only, not
|
|
21
|
+
* iOS/iPadOS) so a hint always names the key that fires the hotkey. Always `false` on the server.
|
|
22
|
+
*/
|
|
23
|
+
export declare const isApplePlatform: () => boolean;
|
|
24
|
+
/**
|
|
25
|
+
* Formats a hotkey for display: `mod+k` reads `⌘K` on macOS and `Ctrl K` elsewhere.
|
|
26
|
+
* When several comma-separated alternatives are given, only the first is shown.
|
|
27
|
+
*/
|
|
28
|
+
export declare const formatHotkeyHint: (hotkey: string, isApple: boolean) => string;
|
|
19
29
|
export {};
|
|
20
30
|
//# sourceMappingURL=hotkeys.utils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hotkeys.utils.d.ts","sourceRoot":"","sources":["../../../../src/utilities/__internal__/hotkeysUtils/hotkeys.utils.ts"],"names":[],"mappings":"AAaA,UAAU,iBAAiB;IACzB,GAAG,EAAE,OAAO,CAAC;IACb,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,OAAO,CAAC;IACf,IAAI,EAAE,OAAO,CAAC;IACd,GAAG,EAAE,OAAO,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,UAAU,MAAO,SAAQ,iBAAiB;IACxC,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;CACrB;AAuBD,wBAAgB,OAAO,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAE3C;AAED,wBAAgB,gBAAgB,CAAC,GAAG,EAAE,MAAM,WAE3C;AAED,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,MAAM,EAAE,SAAS,SAAM,GAAG,MAAM,EAAE,CAE1E;AAED,wBAAgB,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,SAAM,EAAE,gBAAgB,SAAM,EAAE,MAAM,UAAQ,EAAE,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAmChI;AAOD;;;GAGG;AACH,eAAO,MAAM,eAAe,QAAO,OACqF,CAAC;AAEzH;;;GAGG;AACH,eAAO,MAAM,gBAAgB,GAAI,QAAQ,MAAM,EAAE,SAAS,OAAO,KAAG,MAUnE,CAAC"}
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Helpers for `react-hotkeys-hook` hotkey strings (`mod+k`). INTERNAL: imported by components as
|
|
3
|
+
* `#internal/utilities/hotkeysUtils/hotkeys.utils`.
|
|
4
|
+
*
|
|
5
|
+
* The parser section is a 1:1 copy of the library's `parseHotkeys.ts`, which cannot be imported from the
|
|
6
|
+
* package directly. Keep it in sync with the source rather than editing it:
|
|
7
|
+
* https://github.com/JohannesKlauss/react-hotkeys-hook/blob/main/packages/react-hotkeys-hook/src/lib/parseHotkeys.ts
|
|
8
|
+
*
|
|
9
|
+
* The display section below it is ours: platform detection and hint formatting built on that parser.
|
|
10
|
+
*/
|
|
11
|
+
const reservedModifierKeywords = ['shift', 'alt', 'meta', 'mod', 'ctrl', 'control'];
|
|
12
|
+
const mappedKeys = {
|
|
13
|
+
esc: 'escape',
|
|
14
|
+
return: 'enter',
|
|
15
|
+
left: 'arrowleft',
|
|
16
|
+
right: 'arrowright',
|
|
17
|
+
up: 'arrowup',
|
|
18
|
+
down: 'arrowdown',
|
|
19
|
+
ShiftLeft: 'shift',
|
|
20
|
+
ShiftRight: 'shift',
|
|
21
|
+
AltLeft: 'alt',
|
|
22
|
+
AltRight: 'alt',
|
|
23
|
+
MetaLeft: 'meta',
|
|
24
|
+
MetaRight: 'meta',
|
|
25
|
+
OSLeft: 'meta',
|
|
26
|
+
OSRight: 'meta',
|
|
27
|
+
ControlLeft: 'ctrl',
|
|
28
|
+
ControlRight: 'ctrl',
|
|
29
|
+
};
|
|
30
|
+
function mapCode(key) {
|
|
31
|
+
return (mappedKeys[key.trim()] || key.trim()).toLowerCase().replace(/key|digit|numpad/, '');
|
|
32
|
+
}
|
|
33
|
+
function isHotkeyModifier(key) {
|
|
34
|
+
return reservedModifierKeywords.includes(key);
|
|
35
|
+
}
|
|
36
|
+
function parseKeysHookInput(keys, delimiter = ',') {
|
|
37
|
+
return keys.toLowerCase().split(delimiter);
|
|
38
|
+
}
|
|
39
|
+
function parseHotkey(hotkey, splitKey = '+', sequenceSplitKey = '>', useKey = false, description) {
|
|
40
|
+
let keys = [];
|
|
41
|
+
let isSequence = false;
|
|
42
|
+
if (hotkey.includes(sequenceSplitKey)) {
|
|
43
|
+
isSequence = true;
|
|
44
|
+
keys = hotkey
|
|
45
|
+
.toLocaleLowerCase()
|
|
46
|
+
.split(sequenceSplitKey)
|
|
47
|
+
.map((k) => mapCode(k));
|
|
48
|
+
}
|
|
49
|
+
else {
|
|
50
|
+
keys = hotkey
|
|
51
|
+
.toLocaleLowerCase()
|
|
52
|
+
.split(splitKey)
|
|
53
|
+
.map((k) => mapCode(k));
|
|
54
|
+
}
|
|
55
|
+
const modifiers = {
|
|
56
|
+
alt: keys.includes('alt'),
|
|
57
|
+
ctrl: keys.includes('ctrl') || keys.includes('control'),
|
|
58
|
+
shift: keys.includes('shift'),
|
|
59
|
+
meta: keys.includes('meta'),
|
|
60
|
+
mod: keys.includes('mod'),
|
|
61
|
+
useKey,
|
|
62
|
+
};
|
|
63
|
+
const singleCharKeys = keys.filter((k) => !reservedModifierKeywords.includes(k));
|
|
64
|
+
return {
|
|
65
|
+
...modifiers,
|
|
66
|
+
hotkey,
|
|
67
|
+
keys: singleCharKeys,
|
|
68
|
+
description,
|
|
69
|
+
isSequence,
|
|
70
|
+
};
|
|
71
|
+
}
|
|
72
|
+
// #endregion
|
|
73
|
+
// #region Display
|
|
74
|
+
const APPLE_MODIFIERS = { mod: '⌘', meta: '⌘', ctrl: '⌃', control: '⌃', alt: '⌥', shift: '⇧' };
|
|
75
|
+
const OTHER_MODIFIERS = { mod: 'Ctrl', meta: 'Win', ctrl: 'Ctrl', control: 'Ctrl', alt: 'Alt', shift: 'Shift' };
|
|
76
|
+
/**
|
|
77
|
+
* Whether `mod` means ⌘ on this device. Mirrors `react-hotkeys-hook`'s own rule exactly (macOS only, not
|
|
78
|
+
* iOS/iPadOS) so a hint always names the key that fires the hotkey. Always `false` on the server.
|
|
79
|
+
*/
|
|
80
|
+
const isApplePlatform = () => typeof navigator !== 'undefined' && /mac/i.test(navigator.userAgent) && !/iphone|ipad|ipod/i.test(navigator.userAgent);
|
|
81
|
+
/**
|
|
82
|
+
* Formats a hotkey for display: `mod+k` reads `⌘K` on macOS and `Ctrl K` elsewhere.
|
|
83
|
+
* When several comma-separated alternatives are given, only the first is shown.
|
|
84
|
+
*/
|
|
85
|
+
const formatHotkeyHint = (hotkey, isApple) => {
|
|
86
|
+
const modifiers = isApple ? APPLE_MODIFIERS : OTHER_MODIFIERS;
|
|
87
|
+
const [firstHotkey = ''] = parseKeysHookInput(hotkey);
|
|
88
|
+
return firstHotkey
|
|
89
|
+
.split('+')
|
|
90
|
+
.map(mapCode)
|
|
91
|
+
.filter(Boolean)
|
|
92
|
+
.map((key) => (isHotkeyModifier(key) ? modifiers[key] : key.toUpperCase()))
|
|
93
|
+
.join(isApple ? '' : ' ');
|
|
94
|
+
};
|
|
95
|
+
// #endregion
|
|
96
|
+
|
|
97
|
+
export { formatHotkeyHint, isApplePlatform, isHotkeyModifier, mapCode, parseHotkey, parseKeysHookInput };
|
|
98
|
+
//# sourceMappingURL=hotkeys.utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hotkeys.utils.js","sources":["../../../../src/utilities/__internal__/hotkeysUtils/hotkeys.utils.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,64 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
// This is a 1:1 copy of the `parseHotkeys.ts` file from `react-hotkeys-hook`.
|
|
4
|
-
// We need this because there's no way to import it from the package directly.
|
|
5
|
-
// Source: https://github.com/JohannesKlauss/react-hotkeys-hook/blob/main/packages/react-hotkeys-hook/src/lib/parseHotkeys.ts
|
|
6
|
-
const reservedModifierKeywords = ['shift', 'alt', 'meta', 'mod', 'ctrl', 'control'];
|
|
7
|
-
const mappedKeys = {
|
|
8
|
-
esc: 'escape',
|
|
9
|
-
return: 'enter',
|
|
10
|
-
left: 'arrowleft',
|
|
11
|
-
right: 'arrowright',
|
|
12
|
-
up: 'arrowup',
|
|
13
|
-
down: 'arrowdown',
|
|
14
|
-
ShiftLeft: 'shift',
|
|
15
|
-
ShiftRight: 'shift',
|
|
16
|
-
AltLeft: 'alt',
|
|
17
|
-
AltRight: 'alt',
|
|
18
|
-
MetaLeft: 'meta',
|
|
19
|
-
MetaRight: 'meta',
|
|
20
|
-
OSLeft: 'meta',
|
|
21
|
-
OSRight: 'meta',
|
|
22
|
-
ControlLeft: 'ctrl',
|
|
23
|
-
ControlRight: 'ctrl',
|
|
24
|
-
};
|
|
25
|
-
function mapCode(key) {
|
|
26
|
-
return (mappedKeys[key.trim()] || key.trim()).toLowerCase().replace(/key|digit|numpad/, '');
|
|
27
|
-
}
|
|
28
|
-
function parseHotkey(hotkey, splitKey = '+', sequenceSplitKey = '>', useKey = false, description) {
|
|
29
|
-
let keys = [];
|
|
30
|
-
let isSequence = false;
|
|
31
|
-
if (hotkey.includes(sequenceSplitKey)) {
|
|
32
|
-
isSequence = true;
|
|
33
|
-
keys = hotkey
|
|
34
|
-
.toLocaleLowerCase()
|
|
35
|
-
.split(sequenceSplitKey)
|
|
36
|
-
.map((k) => mapCode(k));
|
|
37
|
-
}
|
|
38
|
-
else {
|
|
39
|
-
keys = hotkey
|
|
40
|
-
.toLocaleLowerCase()
|
|
41
|
-
.split(splitKey)
|
|
42
|
-
.map((k) => mapCode(k));
|
|
43
|
-
}
|
|
44
|
-
const modifiers = {
|
|
45
|
-
alt: keys.includes('alt'),
|
|
46
|
-
ctrl: keys.includes('ctrl') || keys.includes('control'),
|
|
47
|
-
shift: keys.includes('shift'),
|
|
48
|
-
meta: keys.includes('meta'),
|
|
49
|
-
mod: keys.includes('mod'),
|
|
50
|
-
useKey,
|
|
51
|
-
};
|
|
52
|
-
const singleCharKeys = keys.filter((k) => !reservedModifierKeywords.includes(k));
|
|
53
|
-
return {
|
|
54
|
-
...modifiers,
|
|
55
|
-
hotkey,
|
|
56
|
-
keys: singleCharKeys,
|
|
57
|
-
description,
|
|
58
|
-
isSequence,
|
|
59
|
-
};
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
exports.mapCode = mapCode;
|
|
63
|
-
exports.parseHotkey = parseHotkey;
|
|
64
|
-
//# sourceMappingURL=hotkeys.utils.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"hotkeys.utils.cjs","sources":["../../../../src/components/organisms/CommandMenu/hotkeys.utils.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAAA;AACA;AACA;AAkBA,MAAM,wBAAwB,GAAG,CAAC,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,CAAC;AAEnF,MAAM,UAAU,GAA2B;AACzC,IAAA,GAAG,EAAE,QAAQ;AACb,IAAA,MAAM,EAAE,OAAO;AACf,IAAA,IAAI,EAAE,WAAW;AACjB,IAAA,KAAK,EAAE,YAAY;AACnB,IAAA,EAAE,EAAE,SAAS;AACb,IAAA,IAAI,EAAE,WAAW;AACjB,IAAA,SAAS,EAAE,OAAO;AAClB,IAAA,UAAU,EAAE,OAAO;AACnB,IAAA,OAAO,EAAE,KAAK;AACd,IAAA,QAAQ,EAAE,KAAK;AACf,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,SAAS,EAAE,MAAM;AACjB,IAAA,MAAM,EAAE,MAAM;AACd,IAAA,OAAO,EAAE,MAAM;AACf,IAAA,WAAW,EAAE,MAAM;AACnB,IAAA,YAAY,EAAE,MAAM;CACrB;AAEK,SAAU,OAAO,CAAC,GAAW,EAAA;IACjC,OAAO,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,IAAI,GAAG,CAAC,IAAI,EAAE,EAAE,WAAW,EAAE,CAAC,OAAO,CAAC,kBAAkB,EAAE,EAAE,CAAC;AAC7F;SAUgB,WAAW,CAAC,MAAc,EAAE,QAAQ,GAAG,GAAG,EAAE,gBAAgB,GAAG,GAAG,EAAE,MAAM,GAAG,KAAK,EAAE,WAAoB,EAAA;IACtH,IAAI,IAAI,GAAa,EAAE;IACvB,IAAI,UAAU,GAAG,KAAK;AAEtB,IAAA,IAAI,MAAM,CAAC,QAAQ,CAAC,gBAAgB,CAAC,EAAE;QACrC,UAAU,GAAG,IAAI;AACjB,QAAA,IAAI,GAAG;AACJ,aAAA,iBAAiB;aACjB,KAAK,CAAC,gBAAgB;aACtB,GAAG,CAAC,CAAC,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC;IAC3B;SAAO;AACL,QAAA,IAAI,GAAG;AACJ,aAAA,iBAAiB;aACjB,KAAK,CAAC,QAAQ;aACd,GAAG,CAAC,CAAC,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC;IAC3B;AAEA,IAAA,MAAM,SAAS,GAAsB;AACnC,QAAA,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;AACzB,QAAA,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC;AACvD,QAAA,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC;AAC7B,QAAA,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC;AAC3B,QAAA,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;QACzB,MAAM;KACP;AAED,IAAA,MAAM,cAAc,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAEhF,OAAO;AACL,QAAA,GAAG,SAAS;QACZ,MAAM;AACN,QAAA,IAAI,EAAE,cAAc;QACpB,WAAW;QACX,UAAU;KACX;AACH;;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"hotkeys.utils.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/CommandMenu/hotkeys.utils.ts"],"names":[],"mappings":"AAIA,UAAU,iBAAiB;IACzB,GAAG,EAAE,OAAO,CAAC;IACb,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,OAAO,CAAC;IACf,IAAI,EAAE,OAAO,CAAC;IACd,GAAG,EAAE,OAAO,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,UAAU,MAAO,SAAQ,iBAAiB;IACxC,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;CACrB;AAuBD,wBAAgB,OAAO,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAE3C;AAED,wBAAgB,gBAAgB,CAAC,GAAG,EAAE,MAAM,WAE3C;AAED,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,MAAM,EAAE,SAAS,SAAM,GAAG,MAAM,EAAE,CAE1E;AAED,wBAAgB,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,SAAM,EAAE,gBAAgB,SAAM,EAAE,MAAM,UAAQ,EAAE,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAmChI"}
|
|
@@ -1,61 +0,0 @@
|
|
|
1
|
-
// This is a 1:1 copy of the `parseHotkeys.ts` file from `react-hotkeys-hook`.
|
|
2
|
-
// We need this because there's no way to import it from the package directly.
|
|
3
|
-
// Source: https://github.com/JohannesKlauss/react-hotkeys-hook/blob/main/packages/react-hotkeys-hook/src/lib/parseHotkeys.ts
|
|
4
|
-
const reservedModifierKeywords = ['shift', 'alt', 'meta', 'mod', 'ctrl', 'control'];
|
|
5
|
-
const mappedKeys = {
|
|
6
|
-
esc: 'escape',
|
|
7
|
-
return: 'enter',
|
|
8
|
-
left: 'arrowleft',
|
|
9
|
-
right: 'arrowright',
|
|
10
|
-
up: 'arrowup',
|
|
11
|
-
down: 'arrowdown',
|
|
12
|
-
ShiftLeft: 'shift',
|
|
13
|
-
ShiftRight: 'shift',
|
|
14
|
-
AltLeft: 'alt',
|
|
15
|
-
AltRight: 'alt',
|
|
16
|
-
MetaLeft: 'meta',
|
|
17
|
-
MetaRight: 'meta',
|
|
18
|
-
OSLeft: 'meta',
|
|
19
|
-
OSRight: 'meta',
|
|
20
|
-
ControlLeft: 'ctrl',
|
|
21
|
-
ControlRight: 'ctrl',
|
|
22
|
-
};
|
|
23
|
-
function mapCode(key) {
|
|
24
|
-
return (mappedKeys[key.trim()] || key.trim()).toLowerCase().replace(/key|digit|numpad/, '');
|
|
25
|
-
}
|
|
26
|
-
function parseHotkey(hotkey, splitKey = '+', sequenceSplitKey = '>', useKey = false, description) {
|
|
27
|
-
let keys = [];
|
|
28
|
-
let isSequence = false;
|
|
29
|
-
if (hotkey.includes(sequenceSplitKey)) {
|
|
30
|
-
isSequence = true;
|
|
31
|
-
keys = hotkey
|
|
32
|
-
.toLocaleLowerCase()
|
|
33
|
-
.split(sequenceSplitKey)
|
|
34
|
-
.map((k) => mapCode(k));
|
|
35
|
-
}
|
|
36
|
-
else {
|
|
37
|
-
keys = hotkey
|
|
38
|
-
.toLocaleLowerCase()
|
|
39
|
-
.split(splitKey)
|
|
40
|
-
.map((k) => mapCode(k));
|
|
41
|
-
}
|
|
42
|
-
const modifiers = {
|
|
43
|
-
alt: keys.includes('alt'),
|
|
44
|
-
ctrl: keys.includes('ctrl') || keys.includes('control'),
|
|
45
|
-
shift: keys.includes('shift'),
|
|
46
|
-
meta: keys.includes('meta'),
|
|
47
|
-
mod: keys.includes('mod'),
|
|
48
|
-
useKey,
|
|
49
|
-
};
|
|
50
|
-
const singleCharKeys = keys.filter((k) => !reservedModifierKeywords.includes(k));
|
|
51
|
-
return {
|
|
52
|
-
...modifiers,
|
|
53
|
-
hotkey,
|
|
54
|
-
keys: singleCharKeys,
|
|
55
|
-
description,
|
|
56
|
-
isSequence,
|
|
57
|
-
};
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
export { mapCode, parseHotkey };
|
|
61
|
-
//# sourceMappingURL=hotkeys.utils.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"hotkeys.utils.js","sources":["../../../../src/components/organisms/CommandMenu/hotkeys.utils.ts"],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AAkBA,MAAM,wBAAwB,GAAG,CAAC,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,CAAC;AAEnF,MAAM,UAAU,GAA2B;AACzC,IAAA,GAAG,EAAE,QAAQ;AACb,IAAA,MAAM,EAAE,OAAO;AACf,IAAA,IAAI,EAAE,WAAW;AACjB,IAAA,KAAK,EAAE,YAAY;AACnB,IAAA,EAAE,EAAE,SAAS;AACb,IAAA,IAAI,EAAE,WAAW;AACjB,IAAA,SAAS,EAAE,OAAO;AAClB,IAAA,UAAU,EAAE,OAAO;AACnB,IAAA,OAAO,EAAE,KAAK;AACd,IAAA,QAAQ,EAAE,KAAK;AACf,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,SAAS,EAAE,MAAM;AACjB,IAAA,MAAM,EAAE,MAAM;AACd,IAAA,OAAO,EAAE,MAAM;AACf,IAAA,WAAW,EAAE,MAAM;AACnB,IAAA,YAAY,EAAE,MAAM;CACrB;AAEK,SAAU,OAAO,CAAC,GAAW,EAAA;IACjC,OAAO,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,IAAI,GAAG,CAAC,IAAI,EAAE,EAAE,WAAW,EAAE,CAAC,OAAO,CAAC,kBAAkB,EAAE,EAAE,CAAC;AAC7F;SAUgB,WAAW,CAAC,MAAc,EAAE,QAAQ,GAAG,GAAG,EAAE,gBAAgB,GAAG,GAAG,EAAE,MAAM,GAAG,KAAK,EAAE,WAAoB,EAAA;IACtH,IAAI,IAAI,GAAa,EAAE;IACvB,IAAI,UAAU,GAAG,KAAK;AAEtB,IAAA,IAAI,MAAM,CAAC,QAAQ,CAAC,gBAAgB,CAAC,EAAE;QACrC,UAAU,GAAG,IAAI;AACjB,QAAA,IAAI,GAAG;AACJ,aAAA,iBAAiB;aACjB,KAAK,CAAC,gBAAgB;aACtB,GAAG,CAAC,CAAC,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC;IAC3B;SAAO;AACL,QAAA,IAAI,GAAG;AACJ,aAAA,iBAAiB;aACjB,KAAK,CAAC,QAAQ;aACd,GAAG,CAAC,CAAC,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC;IAC3B;AAEA,IAAA,MAAM,SAAS,GAAsB;AACnC,QAAA,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;AACzB,QAAA,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC;AACvD,QAAA,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC;AAC7B,QAAA,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC;AAC3B,QAAA,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;QACzB,MAAM;KACP;AAED,IAAA,MAAM,cAAc,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAEhF,OAAO;AACL,QAAA,GAAG,SAAS;QACZ,MAAM;AACN,QAAA,IAAI,EAAE,cAAc;QACpB,WAAW;QACX,UAAU;KACX;AACH;;;;"}
|