@stack-spot/portal-layout 0.0.32 → 0.0.34
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/Layout.d.ts +1 -2
- package/dist/Layout.d.ts.map +1 -1
- package/dist/Layout.js +6 -4
- package/dist/Layout.js.map +1 -1
- package/dist/components/PortalSwitcher.d.ts.map +1 -1
- package/dist/components/PortalSwitcher.js +2 -3
- package/dist/components/PortalSwitcher.js.map +1 -1
- package/dist/components/SelectionList.d.ts.map +1 -1
- package/dist/components/SelectionList.js +22 -2
- package/dist/components/SelectionList.js.map +1 -1
- package/dist/components/menu/MenuSections.d.ts.map +1 -1
- package/dist/components/menu/MenuSections.js +42 -26
- package/dist/components/menu/MenuSections.js.map +1 -1
- package/dist/components/menu/types.d.ts +0 -1
- package/dist/components/menu/types.d.ts.map +1 -1
- package/dist/components/menu/use-keyboard-controls.d.ts +16 -3
- package/dist/components/menu/use-keyboard-controls.d.ts.map +1 -1
- package/dist/components/menu/use-keyboard-controls.js +21 -46
- package/dist/components/menu/use-keyboard-controls.js.map +1 -1
- package/dist/layout.css +14 -8
- package/dist/svg/AI.d.ts.map +1 -1
- package/dist/svg/AI.js +5 -1
- package/dist/svg/AI.js.map +1 -1
- package/package.json +1 -1
- package/src/Layout.tsx +6 -5
- package/src/components/PortalSwitcher.tsx +2 -3
- package/src/components/SelectionList.tsx +24 -2
- package/src/components/menu/MenuSections.tsx +47 -29
- package/src/components/menu/types.ts +0 -1
- package/src/components/menu/use-keyboard-controls.tsx +32 -50
- package/src/layout.css +14 -8
- package/src/svg/AI.tsx +34 -31
package/dist/Layout.d.ts
CHANGED
|
@@ -18,12 +18,11 @@ interface RawProps extends WithStyle {
|
|
|
18
18
|
menuContent?: ReactElement;
|
|
19
19
|
header?: ReactElement;
|
|
20
20
|
children?: ReactNode;
|
|
21
|
-
compactMenu?: boolean;
|
|
22
21
|
extra?: ReactNode;
|
|
23
22
|
errorDescriptor?: DescriptionFn;
|
|
24
23
|
onError?: ErrorHandler;
|
|
25
24
|
}
|
|
26
|
-
export declare const RawLayout: ({ menuSections, menuContent, header,
|
|
25
|
+
export declare const RawLayout: ({ menuSections, menuContent, header, children, extra, errorDescriptor, onError, className, style }: RawProps) => import("react/jsx-runtime").JSX.Element;
|
|
27
26
|
export declare const Layout: ({ menu, header, children, extra, errorDescriptor, onError, className, style }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
28
27
|
export {};
|
|
29
28
|
//# sourceMappingURL=Layout.d.ts.map
|
package/dist/Layout.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Layout.d.ts","sourceRoot":"","sources":["../src/Layout.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAmC,SAAS,EAAE,MAAM,0BAA0B,CAAA;AACrF,OAAO,yCAAyC,CAAA;AAChD,OAAO,EAAE,YAAY,EAAE,SAAS,EAAa,MAAM,OAAO,CAAA;AAE1D,OAAO,EAAE,aAAa,EAAE,YAAY,EAAgB,MAAM,iCAAiC,CAAA;AAE3F,OAAO,EAAU,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAGzD,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAA;AAGnD,OAAO,cAAc,CAAA;AAGrB,UAAU,KAAM,SAAQ,SAAS;IAC/B,IAAI,EAAE,SAAS,CAAC;IAChB,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,eAAe,CAAC,EAAE,aAAa,CAAC;IAChC,OAAO,CAAC,EAAE,YAAY,CAAC;CACxB;AAED,UAAU,QAAS,SAAQ,SAAS;IAClC,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,
|
|
1
|
+
{"version":3,"file":"Layout.d.ts","sourceRoot":"","sources":["../src/Layout.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAmC,SAAS,EAAE,MAAM,0BAA0B,CAAA;AACrF,OAAO,yCAAyC,CAAA;AAChD,OAAO,EAAE,YAAY,EAAE,SAAS,EAAa,MAAM,OAAO,CAAA;AAE1D,OAAO,EAAE,aAAa,EAAE,YAAY,EAAgB,MAAM,iCAAiC,CAAA;AAE3F,OAAO,EAAU,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAGzD,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAA;AAGnD,OAAO,cAAc,CAAA;AAGrB,UAAU,KAAM,SAAQ,SAAS;IAC/B,IAAI,EAAE,SAAS,CAAC;IAChB,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,eAAe,CAAC,EAAE,aAAa,CAAC;IAChC,OAAO,CAAC,EAAE,YAAY,CAAC;CACxB;AAED,UAAU,QAAS,SAAQ,SAAS;IAClC,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,eAAe,CAAC,EAAE,aAAa,CAAC;IAChC,OAAO,CAAC,EAAE,YAAY,CAAC;CACxB;AAED,eAAO,MAAM,SAAS,uGAGlB,QAAQ,4CA0CX,CAAA;AAOD,eAAO,MAAM,MAAM,kFAAmF,KAAK,4CAgB1G,CAAA"}
|
package/dist/Layout.js
CHANGED
|
@@ -9,17 +9,19 @@ import { Header } from './components/Header.js';
|
|
|
9
9
|
import { MenuContent } from './components/menu/MenuContent.js';
|
|
10
10
|
import { MenuSections } from './components/menu/MenuSections.js';
|
|
11
11
|
import { Toaster } from './components/Toaster.js';
|
|
12
|
-
import { elementIds } from './elements.js';
|
|
12
|
+
import { elementIds, getLayoutElements } from './elements.js';
|
|
13
13
|
import './layout.css';
|
|
14
14
|
import { overlay } from './LayoutOverlayManager.js';
|
|
15
|
-
export const RawLayout = ({ menuSections, menuContent, header,
|
|
15
|
+
export const RawLayout = ({ menuSections, menuContent, header, children, extra, errorDescriptor, onError, className, style }) => {
|
|
16
16
|
// @ts-ignore
|
|
17
17
|
const { bottomDialog, modal, rightPanel } = overlay.useOverlays();
|
|
18
|
+
const { layout } = getLayoutElements();
|
|
19
|
+
const isCompactedOnlyIcons = layout?.classList.contains('menu-compact');
|
|
18
20
|
const classes = [
|
|
19
21
|
menuContent ? 'menu-content-visible' : undefined,
|
|
20
|
-
compactMenu ? 'menu-compact' : undefined,
|
|
21
22
|
menuSections ? undefined : 'no-menu-sections',
|
|
22
23
|
className,
|
|
24
|
+
isCompactedOnlyIcons ? 'menu-compact' : undefined,
|
|
23
25
|
];
|
|
24
26
|
useEffect(() => {
|
|
25
27
|
if (errorDescriptor)
|
|
@@ -35,5 +37,5 @@ const MenuContentRenderer = ({ content }) => {
|
|
|
35
37
|
};
|
|
36
38
|
export const Layout = ({ menu, header, children, extra, errorDescriptor, onError, className, style }) => (_jsx(RawLayout, { header: _jsx(Header, { ...header }), menuSections: menu.sections ? _jsx(MenuSections, { ...menu }) : undefined, menuContent: menu.content
|
|
37
39
|
? _jsx(MenuContentRenderer, { content: menu.content }, 'contentKey' in menu ? menu.contentKey : undefined)
|
|
38
|
-
: undefined,
|
|
40
|
+
: undefined, errorDescriptor: errorDescriptor, onError: onError, extra: extra, className: className, style: style, children: children }));
|
|
39
41
|
//# sourceMappingURL=Layout.js.map
|
package/dist/Layout.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Layout.js","sourceRoot":"","sources":["../src/Layout.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,kBAAkB,EAAE,WAAW,EAAa,MAAM,0BAA0B,CAAA;AACrF,OAAO,yCAAyC,CAAA;AAChD,OAAO,EAA2B,SAAS,EAAE,MAAM,OAAO,CAAA;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAA;AAChE,OAAO,EAA+B,YAAY,EAAE,MAAM,iCAAiC,CAAA;AAC3F,OAAO,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAA;AAC5E,OAAO,EAAE,MAAM,EAAe,MAAM,qBAAqB,CAAA;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAC3D,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAA;AAE7D,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAA;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA;
|
|
1
|
+
{"version":3,"file":"Layout.js","sourceRoot":"","sources":["../src/Layout.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PortalSwitcher.d.ts","sourceRoot":"","sources":["../../src/components/PortalSwitcher.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AASvC,MAAM,WAAW,MAAM;IAAG,OAAO,EAAE,aAAa,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE;AAE/D,MAAM,WAAW,mBAAmB;IAClC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACpB;AA8DD,eAAO,MAAM,cAAc,gBAAsB,mBAAmB,
|
|
1
|
+
{"version":3,"file":"PortalSwitcher.d.ts","sourceRoot":"","sources":["../../src/components/PortalSwitcher.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AASvC,MAAM,WAAW,MAAM;IAAG,OAAO,EAAE,aAAa,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE;AAE/D,MAAM,WAAW,mBAAmB;IAClC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACpB;AA8DD,eAAO,MAAM,cAAc,gBAAsB,mBAAmB,4CA6CnE,CAAA"}
|
|
@@ -79,7 +79,7 @@ export const PortalSwitcher = ({ portals = [] }) => {
|
|
|
79
79
|
const t = useTranslate(translations);
|
|
80
80
|
const currentPortal = portals?.find(portal => location.href.startsWith(portal.url));
|
|
81
81
|
return _jsxs(PortalSwitcherBox, { children: [currentPortal ?
|
|
82
|
-
_jsx(Button, { className: "current-portal", appearance: "text", colorScheme: "light", "aria-controls": PORTAL_SWITCHER_ID, "aria-expanded": visible, "aria-label": t.portalSwitcher
|
|
82
|
+
_jsx(Button, { className: "current-portal", appearance: "text", colorScheme: "light", "aria-controls": PORTAL_SWITCHER_ID, "aria-expanded": visible, "aria-label": `${t.portalSwitcher}: ${currentPortal?.acronym} ${t.selected}`, onClick: () => {
|
|
83
83
|
setVisible(true);
|
|
84
84
|
announce(`${t.portalSwitcher} ${t.selected}`);
|
|
85
85
|
}, children: _jsxs(Flex, { alignItems: "center", children: [Logos[currentPortal.acronym], _jsx(IconBox, { size: "xs", ml: 3, children: _jsx(Select, {}) })] }) }) :
|
|
@@ -91,8 +91,7 @@ export const PortalSwitcher = ({ portals = [] }) => {
|
|
|
91
91
|
target: '_self',
|
|
92
92
|
href: portal.url,
|
|
93
93
|
active: currentPortal?.acronym == portal.acronym,
|
|
94
|
-
|
|
95
|
-
iconRight: portal.acronym === currentPortal?.acronym ? _jsx(CheckCircleFill, {}) : _jsx(ArrowRight, {}),
|
|
94
|
+
iconRight: portal.acronym === currentPortal?.acronym ? _jsx(CheckCircleFill, { "aria-label": t.selected }) : _jsx(ArrowRight, {}),
|
|
96
95
|
})), visible: visible, maxHeight: "21rem", onHide: () => setVisible(false) })] });
|
|
97
96
|
};
|
|
98
97
|
const translations = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PortalSwitcher.js","sourceRoot":"","sources":["../../src/components/PortalSwitcher.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AACnE,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAC3D,OAAO,EAAa,QAAQ,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,IAAI,CAAA;AAC5C,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAA;AAC9B,OAAO,EAAE,GAAG,EAAE,MAAM,YAAY,CAAA;AAChC,OAAO,EAAE,GAAG,EAAE,MAAM,YAAY,CAAA;AAChC,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAA;AAIlC,MAAM,KAAK,GAAqC;IAC9C,IAAI,EAAE,KAAC,EAAE,KAAG;IACZ,KAAK,EAAE,KAAC,GAAG,KAAG;IACd,KAAK,EAAE,KAAC,GAAG,KAAG;CACf,CAAA;AAQD,MAAM,iBAAiB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;;;;;;;;;0BAUZ,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;;;;;;sBAc1B,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC;;;;;;;;;;4BAUlB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC;;;wBAG5B,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC;;;;8BAIlB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC;;;;;;;;;;;;;;;;CAgBrD,CAAA;AACD,MAAM,kBAAkB,GAAG,gBAAgB,CAAA;AAE3C,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,OAAO,GAAG,EAAE,EAAuB,EAAE,EAAE;IACtE,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAA;IACtD,MAAM,CAAC,GAAG,YAAY,CAAC,YAAY,CAAC,CAAA;IACpC,MAAM,aAAa,GAAG,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAA;IAEnF,OAAO,MAAC,iBAAiB,eACtB,aAAa,CAAC,CAAC;gBACd,KAAC,MAAM,IACL,SAAS,EAAC,gBAAgB,EAC1B,UAAU,EAAC,MAAM,EACjB,WAAW,EAAC,OAAO,mBACJ,kBAAkB,mBAClB,OAAO,gBACV,CAAC,CAAC,cAAc,
|
|
1
|
+
{"version":3,"file":"PortalSwitcher.js","sourceRoot":"","sources":["../../src/components/PortalSwitcher.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectionList.d.ts","sourceRoot":"","sources":["../../src/components/SelectionList.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAsB,MAAM,0BAA0B,CAAA;AAExE,OAAO,EAAE,YAAY,
|
|
1
|
+
{"version":3,"file":"SelectionList.d.ts","sourceRoot":"","sources":["../../src/components/SelectionList.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAsB,MAAM,0BAA0B,CAAA;AAExE,OAAO,EAAE,YAAY,EAA6C,MAAM,OAAO,CAAA;AAG/E,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAEhC,UAAU,YAAY;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC1B,SAAS,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;CAChC;AAED,MAAM,WAAW,UAAW,SAAQ,YAAY,EAAE,MAAM;IACtD,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,UAAU,SAAS;IACjB,IAAI,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC;IACjC,QAAQ,EAAE,QAAQ,EAAE,CAAC;CACtB;AAED,UAAU,WAAY,SAAQ,SAAS;IACrC,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,UAAU,eAAgB,SAAQ,SAAS,EAAE,YAAY;IACvD,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,KAAK,QAAQ,GAAG,WAAW,GAAG,eAAe,GAAG,UAAU,CAAA;AAW1D,MAAM,WAAW,kBAAmB,SAAQ,SAAS;IACnD,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAqHD,eAAO,MAAM,aAAa,wFAEvB,kBAAkB,4CA6EpB,CAAA"}
|
|
@@ -4,7 +4,7 @@ import { ArrowLeft, Check, ChevronRight } from '@citric/icons';
|
|
|
4
4
|
import { IconButton } from '@citric/ui';
|
|
5
5
|
import { listToClass, theme } from '@stack-spot/portal-theme';
|
|
6
6
|
import { useTranslate } from '@stack-spot/portal-translate';
|
|
7
|
-
import { useMemo, useState } from 'react';
|
|
7
|
+
import { useCallback, useEffect, useMemo, useState } from 'react';
|
|
8
8
|
import { styled } from 'styled-components';
|
|
9
9
|
import { useKeyboardControls } from './menu/use-keyboard-controls.js';
|
|
10
10
|
const ANIMATION_DURATION_MS = 300;
|
|
@@ -91,12 +91,32 @@ function renderItem(item, options) {
|
|
|
91
91
|
export const SelectionList = ({ id, items, className, style, visible = true, maxHeight = '300px', onHide, before, after, scroll, }) => {
|
|
92
92
|
const t = useTranslate(dictionary);
|
|
93
93
|
const [current, setCurrent] = useState({ items });
|
|
94
|
+
const { keyboardControlledElement: wrapper, attachKeyboardListeners, detachKeyboardListeners } = useKeyboardControls({ onPressEscape: onHide, querySelectors: 'li.action a, li.collapsible a, button' });
|
|
94
95
|
const listItems = useMemo(() => current.items.map(i => renderItem(i, {
|
|
95
96
|
setCurrent: (next) => setCurrent({ ...next, parent: current }),
|
|
96
97
|
onClose: onHide,
|
|
97
98
|
controllerId: id,
|
|
98
99
|
})), [current]);
|
|
99
|
-
const
|
|
100
|
+
const hide = useCallback((event) => {
|
|
101
|
+
const target = event.target;
|
|
102
|
+
// if the element is not in the DOM anymore, we'll consider the click was inside the selection list
|
|
103
|
+
const isClickInsideSelectionList = !target?.isConnected || wrapper.current?.contains(target);
|
|
104
|
+
const isAction = target?.classList?.contains('action') || !!target?.closest('.action');
|
|
105
|
+
if (!isClickInsideSelectionList || isAction)
|
|
106
|
+
onHide?.();
|
|
107
|
+
}, []);
|
|
108
|
+
useEffect(() => {
|
|
109
|
+
if (visible) {
|
|
110
|
+
setCurrent({ items });
|
|
111
|
+
attachKeyboardListeners();
|
|
112
|
+
if (onHide)
|
|
113
|
+
setTimeout(() => document.addEventListener('click', hide), 50);
|
|
114
|
+
}
|
|
115
|
+
else {
|
|
116
|
+
detachKeyboardListeners();
|
|
117
|
+
document.removeEventListener('click', hide);
|
|
118
|
+
}
|
|
119
|
+
}, [visible]);
|
|
100
120
|
return (_jsx(SelectionBox, { id: id, ref: wrapper, "$maxHeight": maxHeight, style: style, className: listToClass(['selection-list', visible ? 'visible' : undefined, className]), "$scroll": scroll, "aria-hidden": !visible, children: _jsxs("div", { className: "selection-list-content", children: [before, current.parent
|
|
101
121
|
? (_jsxs(Flex, { mt: 5, mb: 1, alignItems: "center", children: [_jsx(IconButton, { onClick: (ev) => {
|
|
102
122
|
// accessibility: this will tell the screen reader the section was collapsed before this button is removed from the DOM.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectionList.js","sourceRoot":"","sources":["../../src/components/SelectionList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAClD,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAA;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA;AACvC,OAAO,EAAa,WAAW,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AACxE,OAAO,EAAc,YAAY,EAAE,MAAM,8BAA8B,CAAA;AACvE,OAAO,EAAgB,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"SelectionList.js","sourceRoot":"","sources":["../../src/components/SelectionList.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuSections.d.ts","sourceRoot":"","sources":["../../../src/components/menu/MenuSections.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"MenuSections.d.ts","sourceRoot":"","sources":["../../../src/components/menu/MenuSections.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,SAAS,EAAe,MAAM,SAAS,CAAA;AAuBhD,wBAAgB,sBAAsB,SAOrC;AAyHD,eAAO,MAAM,YAAY,2BAAiC,SAAS,4CA+FlE,CAAA"}
|
|
@@ -3,20 +3,33 @@ import { Flex, IconBox, Text } from '@citric/core';
|
|
|
3
3
|
import { ChevronRight, Cog, Collapse, Expand } from '@citric/icons';
|
|
4
4
|
import { interpolate, useTranslate } from '@stack-spot/portal-translate';
|
|
5
5
|
import { useCallback, useMemo, useState } from 'react';
|
|
6
|
+
import { getLayoutElements } from '../../elements.js';
|
|
7
|
+
import { elementIds } from '../../elements.js';
|
|
6
8
|
import { MenuContent } from './MenuContent.js';
|
|
7
9
|
import { useKeyboardControls } from './use-keyboard-controls.js';
|
|
8
10
|
const ARROW_HEIGHT = 24;
|
|
9
11
|
const HIDE_OVERLAY_DELAY_MS = 400;
|
|
10
12
|
const MENU_OVERLAY_ID = 'menuContentOverlay';
|
|
11
13
|
let hideOverlayTask;
|
|
14
|
+
// fixme: this should definitely not be handled like this...
|
|
15
|
+
let attachKeyboardListenersForOverlay;
|
|
16
|
+
let detachKeyboardListenersForOverlay;
|
|
12
17
|
function hideOverlay() {
|
|
13
18
|
if (hideOverlayTask !== undefined)
|
|
14
19
|
return;
|
|
15
20
|
hideOverlayTask = window.setTimeout(hideOverlayImmediately, HIDE_OVERLAY_DELAY_MS);
|
|
16
21
|
}
|
|
22
|
+
function getAccessibilityButtonOfSectionWithActiveOverlay() {
|
|
23
|
+
return document.getElementById(elementIds.menuSections)?.querySelector('button[aria-expanded="true"]');
|
|
24
|
+
}
|
|
17
25
|
// eslint-disable-next-line react-refresh/only-export-components
|
|
18
26
|
export function hideOverlayImmediately() {
|
|
19
|
-
|
|
27
|
+
detachKeyboardListenersForOverlay?.();
|
|
28
|
+
const overlay = document.getElementById(MENU_OVERLAY_ID);
|
|
29
|
+
overlay?.setAttribute('inert', '');
|
|
30
|
+
overlay?.setAttribute('aria-hidden', '');
|
|
31
|
+
overlay?.classList.remove('visible');
|
|
32
|
+
getAccessibilityButtonOfSectionWithActiveOverlay()?.setAttribute('aria-expanded', 'false');
|
|
20
33
|
}
|
|
21
34
|
function cancelHideOverlayTask() {
|
|
22
35
|
if (hideOverlayTask === undefined)
|
|
@@ -26,7 +39,11 @@ function cancelHideOverlayTask() {
|
|
|
26
39
|
}
|
|
27
40
|
function showOverlay() {
|
|
28
41
|
cancelHideOverlayTask();
|
|
29
|
-
document.getElementById(MENU_OVERLAY_ID)
|
|
42
|
+
const overlay = document.getElementById(MENU_OVERLAY_ID);
|
|
43
|
+
overlay?.removeAttribute('inert');
|
|
44
|
+
overlay?.removeAttribute('aria-hidden');
|
|
45
|
+
overlay?.classList.add('visible');
|
|
46
|
+
attachKeyboardListenersForOverlay?.();
|
|
30
47
|
}
|
|
31
48
|
function isMenuContentVisible() {
|
|
32
49
|
return !!document.getElementById('layout')?.classList?.contains('menu-content-visible');
|
|
@@ -38,19 +55,20 @@ const Section = ({ icon, label, href, target, onClick, active, content, customCo
|
|
|
38
55
|
/* The overlay should appear if:
|
|
39
56
|
* 1. The menu is compacted showing only the icons
|
|
40
57
|
* 2. The section has some content to render OR:
|
|
41
|
-
*
|
|
42
|
-
* 3. The section is inactive OR:
|
|
43
|
-
* 2.1. The contextual menu is hidden.
|
|
58
|
+
* 3. The section is active and there is a contextual menu for the active page.
|
|
44
59
|
*/
|
|
45
|
-
const layout =
|
|
46
|
-
const isCompactedOnlyIcons = layout?.classList.contains('menu-compact
|
|
47
|
-
return isCompactedOnlyIcons && (!!contentToRender || !!customContent || (hasContent && active))
|
|
60
|
+
const { layout } = getLayoutElements();
|
|
61
|
+
const isCompactedOnlyIcons = layout?.classList.contains('menu-compact');
|
|
62
|
+
return isCompactedOnlyIcons && (!!contentToRender || !!customContent || (hasContent && active));
|
|
48
63
|
}
|
|
49
64
|
function showOverlayAndFixArrowPosition(event) {
|
|
50
65
|
if (!shouldShowOverlay())
|
|
51
66
|
return;
|
|
52
67
|
onOpen?.();
|
|
53
|
-
const
|
|
68
|
+
const anchorElement = event.target;
|
|
69
|
+
const accessibilityButton = anchorElement?.parentElement?.querySelector('button');
|
|
70
|
+
accessibilityButton?.setAttribute('aria-expanded', 'true');
|
|
71
|
+
const rect = anchorElement?.getBoundingClientRect();
|
|
54
72
|
const arrow = document.querySelector(`#${MENU_OVERLAY_ID} .arrow`);
|
|
55
73
|
setCurrentOverlay(id);
|
|
56
74
|
showOverlay();
|
|
@@ -64,8 +82,8 @@ const Section = ({ icon, label, href, target, onClick, active, content, customCo
|
|
|
64
82
|
hideOverlayImmediately();
|
|
65
83
|
}
|
|
66
84
|
const labelText = typeof label === 'string' ? label : label.id;
|
|
67
|
-
return (_jsx(_Fragment, { children: _jsxs("li", { title: labelText, className: `section-submenu ${className || ''} ${active ? 'active' : ''}`, children: [_jsx("a", { href: href, target: target, onClick: click, onMouseEnter: showOverlayAndFixArrowPosition, onMouseLeave: () => shouldShowOverlay() && hideOverlay(), title: labelText, "aria-label": labelText, onKeyDown: onClick ? e => e.key === 'Enter' && onClick() : undefined, ...(active ? { 'aria-current': 'page' } : undefined), ...(!href ? { 'tabIndex': 0 } : undefined), children: _jsxs(Flex, { alignItems: "center", justifyContent: "center", px: 5, children: [icon, typeof label === 'string' ? _jsx(Text, { appearance: "microtext1", className: "section-label", ml: 3, children: label }) : label.element] }) }), shouldShowOverlay() &&
|
|
68
|
-
_jsx(IconBox, { size: "sm", className: "section-submenu-icon", as: "button", "aria-label": interpolate(t.menuOptions, label), "aria-controls": MENU_OVERLAY_ID, "aria-expanded":
|
|
85
|
+
return (_jsx(_Fragment, { children: _jsxs("li", { title: labelText, className: `section-submenu ${className || ''} ${active ? 'active' : ''}`, children: [_jsx("a", { href: href, target: target, onClick: click, onMouseEnter: showOverlayAndFixArrowPosition, onMouseLeave: () => shouldShowOverlay() && hideOverlay(), title: labelText, "aria-label": labelText, onKeyDown: onClick ? e => e.key === 'Enter' && onClick() : undefined, ...(active ? { 'aria-current': 'page' } : undefined), ...(!href ? { 'tabIndex': 0 } : undefined), children: _jsxs(Flex, { alignItems: "center", justifyContent: "center", px: 5, children: [_jsx(IconBox, { children: icon }), typeof label === 'string' ? _jsx(Text, { appearance: "microtext1", className: "section-label", ml: 3, children: label }) : label.element] }) }), shouldShowOverlay() &&
|
|
86
|
+
_jsx(IconBox, { size: "sm", className: "section-submenu-icon", as: "button", "aria-label": interpolate(t.menuOptions, label), "aria-controls": MENU_OVERLAY_ID, "aria-expanded": false, onKeyDown: (event) => {
|
|
69
87
|
if (event.key === 'Enter') {
|
|
70
88
|
showOverlayAndFixArrowPosition(event);
|
|
71
89
|
}
|
|
@@ -73,7 +91,7 @@ const Section = ({ icon, label, href, target, onClick, active, content, customCo
|
|
|
73
91
|
};
|
|
74
92
|
const OverlayRenderer = ({ content, customContent }) => {
|
|
75
93
|
if (customContent) {
|
|
76
|
-
return _jsxs(
|
|
94
|
+
return _jsxs("div", { id: "custom-selectable-item", children: [" ", customContent, " "] });
|
|
77
95
|
}
|
|
78
96
|
const data = typeof content === 'function' ? content() : content;
|
|
79
97
|
return _jsx(MenuContent, { ...data });
|
|
@@ -82,16 +100,15 @@ export const MenuSections = ({ sections = [], ...props }) => {
|
|
|
82
100
|
const t = useTranslate(dictionary);
|
|
83
101
|
// this is a mock state only used to force an update on the component.
|
|
84
102
|
const [_, setUpdate] = useState(0);
|
|
85
|
-
const onHide = () => hideOverlay();
|
|
86
103
|
const toggleMenu = useCallback((hasContent) => {
|
|
87
104
|
const layout = document.getElementById('layout');
|
|
88
105
|
if (!layout)
|
|
89
106
|
return;
|
|
90
|
-
if (layout.classList.contains('menu-compact
|
|
91
|
-
layout.classList.remove('menu-compact
|
|
107
|
+
if (layout.classList.contains('menu-compact')) {
|
|
108
|
+
layout.classList.remove('menu-compact');
|
|
92
109
|
}
|
|
93
110
|
else {
|
|
94
|
-
layout.classList.add('menu-compact
|
|
111
|
+
layout.classList.add('menu-compact');
|
|
95
112
|
}
|
|
96
113
|
if (hasContent) {
|
|
97
114
|
if (layout.classList.contains('menu-content-visible')) {
|
|
@@ -107,17 +124,16 @@ export const MenuSections = ({ sections = [], ...props }) => {
|
|
|
107
124
|
const [currentOverlay, setCurrentOverlay] = useState();
|
|
108
125
|
const sectionItems = useMemo(() => sections.map((s, i) => _jsx(Section, { id: i, ...s, setCurrentOverlay: setCurrentOverlay, hasContent: !!props.content || !!props.customContent }, i)), [sections]);
|
|
109
126
|
function onPressEscape() {
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
if (!!items && !!currentOverlay && items.length > currentOverlay && items[currentOverlay].children.length > 1) {
|
|
113
|
-
items[currentOverlay].children[1].focus();
|
|
114
|
-
}
|
|
127
|
+
getAccessibilityButtonOfSectionWithActiveOverlay()?.focus();
|
|
128
|
+
hideOverlayImmediately();
|
|
115
129
|
}
|
|
116
|
-
const
|
|
117
|
-
|
|
130
|
+
const { keyboardControlledElement: overlayRef, attachKeyboardListeners, detachKeyboardListeners } = useKeyboardControls({
|
|
131
|
+
onPressEscape,
|
|
118
132
|
querySelectors: 'li a.action, #custom-selectable-item button, #custom-selectable-item input',
|
|
119
|
-
onPressEscape: () => onPressEscape(),
|
|
120
133
|
});
|
|
134
|
+
// fixme: this should definitely not be handled like this...
|
|
135
|
+
attachKeyboardListenersForOverlay = attachKeyboardListeners;
|
|
136
|
+
detachKeyboardListenersForOverlay = detachKeyboardListeners;
|
|
121
137
|
/* This function renders the section preview in the overlay in normal circumstances. If the menu is hidden and the section is active,
|
|
122
138
|
instead of rendering the section preview, it will render the actual menu content, which would be invisible otherwise.
|
|
123
139
|
Below, the key is of extreme importance. It ensures React will consider every section content to be an entirely different
|
|
@@ -132,8 +148,8 @@ export const MenuSections = ({ sections = [], ...props }) => {
|
|
|
132
148
|
? _jsx(OverlayRenderer, { content: props.content, customContent: props.customContent }, 'contentKey' in props ? props.contentKey : undefined)
|
|
133
149
|
: _jsx(OverlayRenderer, { content: sections[currentOverlay].content, customContent: sections[currentOverlay].customContent }, currentOverlay);
|
|
134
150
|
}
|
|
135
|
-
return (_jsxs(_Fragment, { children: [_jsx("ul", { children: sectionItems }), _jsxs(Flex, { mb: 7, alignItems: "center", children: [_jsxs("button", { className: "toggle sections-footer", onClick: () => toggleMenu(!!props.content || !!props.customContent), title: t.toggle, tabIndex: -1,
|
|
136
|
-
_jsx("a", { href: props.settings?.href, onClick: props.settings?.onClick, className: "sections-footer", ...(props.settings.active ? { 'aria-current': 'page' } : undefined), children: _jsxs(Flex, { alignItems: "center", children: [_jsx(IconBox, { "aria-label": t.settingsIcon, children: _jsx(Cog, {}) }), _jsx(Text, { appearance: "microtext1", ml: 2, children: t.settings })] }) })] }), _jsxs("div", { id: MENU_OVERLAY_ID, onMouseEnter: showOverlay, onMouseLeave: hideOverlay, ref:
|
|
151
|
+
return (_jsxs(_Fragment, { children: [_jsx("ul", { children: sectionItems }), _jsxs(Flex, { mb: 7, alignItems: "center", children: [_jsxs("button", { className: "toggle sections-footer", onClick: () => toggleMenu(!!props.content || !!props.customContent), title: t.toggle, tabIndex: -1, children: [_jsxs(IconBox, { children: [_jsx(Expand, { className: "expand" }), _jsx(Collapse, { className: "collapse" })] }), _jsx(Text, { appearance: "microtext1", ml: 8, className: "collapse", colorScheme: "light.contrastText", children: t.hide })] }), (props.settings?.show) &&
|
|
152
|
+
_jsx("a", { href: props.settings?.href, onClick: props.settings?.onClick, className: "sections-footer", ...(props.settings.active ? { 'aria-current': 'page' } : undefined), children: _jsxs(Flex, { alignItems: "center", justifyContent: "center", children: [_jsx(IconBox, { "aria-label": t.settingsIcon, children: _jsx(Cog, {}) }), _jsx(Text, { appearance: "microtext1", ml: 2, children: t.settings })] }) })] }), _jsxs("div", { id: MENU_OVERLAY_ID, onMouseEnter: showOverlay, onMouseLeave: hideOverlay, ref: overlayRef, children: [renderMenuOverlay(), _jsx("div", { className: "arrow" })] })] }));
|
|
137
153
|
};
|
|
138
154
|
const dictionary = {
|
|
139
155
|
en: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuSections.js","sourceRoot":"","sources":["../../../src/components/menu/MenuSections.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAClD,OAAO,EAAE,YAAY,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AACnE,OAAO,EAAc,WAAW,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAA;AACpF,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE3C,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAA;AAE7D,MAAM,YAAY,GAAG,EAAE,CAAA;AACvB,MAAM,qBAAqB,GAAG,GAAG,CAAA;AACjC,MAAM,eAAe,GAAG,oBAAoB,CAAA;AAE5C,IAAI,eAAmC,CAAA;AAEvC,SAAS,WAAW;IAClB,IAAI,eAAe,KAAK,SAAS;QAAE,OAAM;IACzC,eAAe,GAAG,MAAM,CAAC,UAAU,CAAC,sBAAsB,EAAE,qBAAqB,CAAC,CAAA;AACpF,CAAC;AAED,gEAAgE;AAChE,MAAM,UAAU,sBAAsB;IACpC,QAAQ,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"MenuSections.js","sourceRoot":"","sources":["../../../src/components/menu/MenuSections.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/menu/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,UAAU,YAAY;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC3B;;;OAGG;IACH,QAAQ,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,UAAU,CAAC;CAC3C;AAED,MAAM,WAAW,SAAU,SAAQ,YAAY;IAC7C,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,QAAQ,EAAE,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,UAAW,SAAQ,MAAM,EAAE,YAAY;IACtD,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,UAAU,CAAA;AAE7C,MAAM,WAAW,UAAW,SAAQ,MAAM;IACxC,IAAI,CAAC,EAAE,YAAY,CAAC;CACrB;AAED,MAAM,WAAW,YAAa,SAAQ,MAAM;IAC1C,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,YAAY,CAAC;CACrB;AAED,MAAM,WAAW,QAAQ;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,kBAAkB;IACjC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,YAAY,CAAC,EAAE,QAAQ,CAAC;IACxB,OAAO,CAAC,EAAE,QAAQ,EAAE,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,WAAY,SAAQ,MAAM;IACzC,IAAI,EAAE,YAAY,CAAC;IACnB;;;;OAIG;IACH,OAAO,CAAC,EAAE,kBAAkB,GAAG,CAAC,MAAM,kBAAkB,CAAC,CAAC;IAC1D;;;;;OAKG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,UAAU,aAAa;IACrB,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAC;IACzB,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/menu/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,10 +1,23 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
interface Props {
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* A query selector that returns every html element that must be navigable through the keyboard.
|
|
5
|
+
*/
|
|
5
6
|
querySelectors: string;
|
|
7
|
+
/**
|
|
8
|
+
* Function to call when ESC is pressed. or when TAB is pressed at the last item in the list of items returned by the query selector.
|
|
9
|
+
*/
|
|
6
10
|
onPressEscape?: () => void;
|
|
11
|
+
/**
|
|
12
|
+
* Function to call when TAB is pressed at the last item in the list of items returned by the query selector. Will be the same as
|
|
13
|
+
* onPressEscape if not specified.
|
|
14
|
+
*/
|
|
15
|
+
onPressLastTab?: () => void;
|
|
7
16
|
}
|
|
8
|
-
export declare function useKeyboardControls({
|
|
17
|
+
export declare function useKeyboardControls({ querySelectors, onPressEscape, onPressLastTab }: Props): {
|
|
18
|
+
keyboardControlledElement: import("react").RefObject<HTMLDivElement>;
|
|
19
|
+
attachKeyboardListeners: () => void;
|
|
20
|
+
detachKeyboardListeners: () => void;
|
|
21
|
+
};
|
|
9
22
|
export {};
|
|
10
23
|
//# sourceMappingURL=use-keyboard-controls.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-keyboard-controls.d.ts","sourceRoot":"","sources":["../../../src/components/menu/use-keyboard-controls.tsx"],"names":[],"mappings":";AAEA,UAAU,KAAK;IACb,
|
|
1
|
+
{"version":3,"file":"use-keyboard-controls.d.ts","sourceRoot":"","sources":["../../../src/components/menu/use-keyboard-controls.tsx"],"names":[],"mappings":";AAEA,UAAU,KAAK;IACb;;OAEG;IACH,cAAc,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B;AAED,wBAAgB,mBAAmB,CAAC,EAAE,cAAc,EAAE,aAAa,EAAE,cAA8B,EAAE,EAAE,KAAK;;;;EAmD3G"}
|
|
@@ -1,14 +1,12 @@
|
|
|
1
|
-
import { useCallback,
|
|
2
|
-
export function useKeyboardControls({
|
|
3
|
-
const
|
|
4
|
-
const
|
|
5
|
-
|
|
6
|
-
document.removeEventListener('click', hide);
|
|
7
|
-
};
|
|
1
|
+
import { useCallback, useRef } from 'react';
|
|
2
|
+
export function useKeyboardControls({ querySelectors, onPressEscape, onPressLastTab = onPressEscape }) {
|
|
3
|
+
const keyboardControlledElement = useRef(null);
|
|
4
|
+
const listeners = useRef({});
|
|
5
|
+
listeners.current = { onPressEscape, onPressLastTab };
|
|
8
6
|
const keyboardControls = useCallback((event) => {
|
|
9
7
|
const target = event?.target;
|
|
10
8
|
function getSelectableAnchors() {
|
|
11
|
-
return
|
|
9
|
+
return keyboardControlledElement.current?.querySelectorAll(querySelectors) ?? [];
|
|
12
10
|
}
|
|
13
11
|
function handleArrows(key = event.key) {
|
|
14
12
|
const anchors = getSelectableAnchors();
|
|
@@ -20,9 +18,9 @@ export function useKeyboardControls({ onHide, visible, querySelectors, onPressEs
|
|
|
20
18
|
}
|
|
21
19
|
const handlers = {
|
|
22
20
|
Escape: () => {
|
|
23
|
-
onPressEscape?.();
|
|
24
|
-
|
|
25
|
-
|
|
21
|
+
listeners.current.onPressEscape?.();
|
|
22
|
+
event.stopPropagation();
|
|
23
|
+
event.preventDefault();
|
|
26
24
|
},
|
|
27
25
|
Enter: () => {
|
|
28
26
|
target?.click();
|
|
@@ -30,45 +28,22 @@ export function useKeyboardControls({ onHide, visible, querySelectors, onPressEs
|
|
|
30
28
|
Tab: () => {
|
|
31
29
|
const anchors = getSelectableAnchors();
|
|
32
30
|
if (document.activeElement === anchors[anchors.length - 1])
|
|
33
|
-
|
|
34
|
-
else
|
|
31
|
+
listeners.current.onPressLastTab?.();
|
|
32
|
+
else
|
|
35
33
|
handleArrows('ArrowDown');
|
|
36
|
-
|
|
37
|
-
}
|
|
38
|
-
},
|
|
39
|
-
ArrowUp: () => {
|
|
40
|
-
handleArrows();
|
|
41
|
-
},
|
|
42
|
-
ArrowDown: () => {
|
|
43
|
-
handleArrows();
|
|
34
|
+
event.preventDefault();
|
|
44
35
|
},
|
|
36
|
+
ArrowUp: handleArrows,
|
|
37
|
+
ArrowDown: handleArrows,
|
|
45
38
|
};
|
|
46
39
|
handlers[event.key]?.();
|
|
47
|
-
}, [onPressEscape, visible]);
|
|
48
|
-
const hide = useCallback((event) => {
|
|
49
|
-
const target = event.target;
|
|
50
|
-
// if the element is not in the DOM anymore, we'll consider the click was inside the selection list
|
|
51
|
-
const isClickInsideSelectionList = !target?.isConnected || wrapper.current?.contains(target);
|
|
52
|
-
const isAction = target?.classList?.contains('action') || !!target?.closest('.action');
|
|
53
|
-
if (!isClickInsideSelectionList || isAction)
|
|
54
|
-
onHide?.();
|
|
55
40
|
}, []);
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
else {
|
|
64
|
-
onRemoveListeners();
|
|
65
|
-
}
|
|
66
|
-
return () => {
|
|
67
|
-
// Remove the event listener
|
|
68
|
-
document.removeEventListener('keydown', keyboardControls);
|
|
69
|
-
document.removeEventListener('click', hide);
|
|
70
|
-
};
|
|
71
|
-
}, [visible, keyboardControls]);
|
|
72
|
-
return wrapper;
|
|
41
|
+
const attachKeyboardListeners = useCallback(() => {
|
|
42
|
+
document.addEventListener('keydown', keyboardControls);
|
|
43
|
+
}, []);
|
|
44
|
+
const detachKeyboardListeners = useCallback(() => {
|
|
45
|
+
document.removeEventListener('keydown', keyboardControls);
|
|
46
|
+
}, []);
|
|
47
|
+
return { keyboardControlledElement, attachKeyboardListeners, detachKeyboardListeners };
|
|
73
48
|
}
|
|
74
49
|
//# sourceMappingURL=use-keyboard-controls.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-keyboard-controls.js","sourceRoot":"","sources":["../../../src/components/menu/use-keyboard-controls.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,
|
|
1
|
+
{"version":3,"file":"use-keyboard-controls.js","sourceRoot":"","sources":["../../../src/components/menu/use-keyboard-controls.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAkB3C,MAAM,UAAU,mBAAmB,CAAC,EAAE,cAAc,EAAE,aAAa,EAAE,cAAc,GAAG,aAAa,EAAS;IAC1G,MAAM,yBAAyB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAC9D,MAAM,SAAS,GAAG,MAAM,CAAkD,EAAE,CAAC,CAAA;IAC7E,SAAS,CAAC,OAAO,GAAG,EAAE,aAAa,EAAE,cAAc,EAAE,CAAA;IAErD,MAAM,gBAAgB,GAAG,WAAW,CAAC,CAAC,KAAoB,EAAE,EAAE;QAC5D,MAAM,MAAM,GAAG,KAAK,EAAE,MAA4B,CAAA;QAElD,SAAS,oBAAoB;YAC3B,OAAO,yBAAyB,CAAC,OAAO,EAAE,gBAAgB,CAAC,cAAc,CAAC,IAAI,EAAE,CAAA;QAClF,CAAC;QAED,SAAS,YAAY,CAAC,GAAG,GAAG,KAAK,CAAC,GAAG;YACnC,MAAM,OAAO,GAAG,oBAAoB,EAAE,CAAA;YACtC,IAAI,CAAC,GAAG,CAAC,CAAA;YACT,OAAO,CAAC,GAAG,OAAO,CAAC,MAAM,IAAI,QAAQ,CAAC,aAAa,KAAK,OAAO,CAAC,CAAC,CAAC;gBAAE,CAAC,EAAE,CAAA;YACvE,MAAM,IAAI,GAAQ,GAAG,KAAK,WAAW,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,OAAO,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAA;YACxH,IAAI,EAAE,KAAK,EAAE,EAAE,CAAA;QACjB,CAAC;QAED,MAAM,QAAQ,GAA6C;YACzD,MAAM,EAAE,GAAG,EAAE;gBACX,SAAS,CAAC,OAAO,CAAC,aAAa,EAAE,EAAE,CAAA;gBACnC,KAAK,CAAC,eAAe,EAAE,CAAA;gBACvB,KAAK,CAAC,cAAc,EAAE,CAAA;YACxB,CAAC;YACD,KAAK,EAAE,GAAG,EAAE;gBACV,MAAM,EAAE,KAAK,EAAE,CAAA;YACjB,CAAC;YACD,GAAG,EAAE,GAAG,EAAE;gBACR,MAAM,OAAO,GAAG,oBAAoB,EAAE,CAAA;gBACtC,IAAI,QAAQ,CAAC,aAAa,KAAK,OAAO,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC;oBAAE,SAAS,CAAC,OAAO,CAAC,cAAc,EAAE,EAAE,CAAA;;oBAC1F,YAAY,CAAC,WAAW,CAAC,CAAA;gBAC/B,KAAK,CAAC,cAAc,EAAE,CAAA;YACxB,CAAC;YACD,OAAO,EAAE,YAAY;YACrB,SAAS,EAAE,YAAY;SACxB,CAAA;QAED,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,EAAE,CAAA;IACzB,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,uBAAuB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC/C,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,gBAAgB,CAAC,CAAA;IACxD,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,uBAAuB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC/C,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,gBAAgB,CAAC,CAAA;IAC3D,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO,EAAE,yBAAyB,EAAE,uBAAuB,EAAE,uBAAuB,EAAE,CAAA;AACxF,CAAC"}
|