@basic-ui/core 0.0.47 → 0.0.48
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/index.js +52 -19
- package/build/cjs/index.js.map +1 -1
- package/build/esm/Menu/ContextMenuTrigger.js +14 -5
- package/build/esm/Menu/ContextMenuTrigger.js.map +1 -1
- package/build/esm/Menu/Menu.js +17 -9
- package/build/esm/Menu/Menu.js.map +1 -1
- package/build/esm/Menu/MenuButton.js +5 -3
- package/build/esm/Menu/MenuButton.js.map +1 -1
- package/build/esm/Menu/MenuItem.js +4 -2
- package/build/esm/Menu/MenuItem.js.map +1 -1
- package/build/esm/Menu/MenuList.js +25 -9
- package/build/esm/Menu/MenuList.js.map +1 -1
- package/build/esm/Menu/MenuPopover.js +3 -1
- package/build/esm/Menu/MenuPopover.js.map +1 -1
- package/build/esm/Menu/context.d.ts +4 -4
- package/build/esm/Menu/context.js.map +1 -1
- package/build/tsconfig-build.tsbuildinfo +1 -1
- package/package.json +2 -2
- package/src/Menu/ContextMenuTrigger.tsx +21 -8
- package/src/Menu/Menu.tsx +15 -12
- package/src/Menu/MenuButton.tsx +4 -3
- package/src/Menu/MenuItem.tsx +3 -1
- package/src/Menu/MenuList.tsx +29 -12
- package/src/Menu/MenuPopover.tsx +2 -1
- package/src/Menu/context.ts +5 -3
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
-
var _excluded = ["as", "id", "onContextMenu", "disabled"];
|
|
3
|
+
var _excluded = ["as", "innerAs", "id", "onContextMenu", "disabled"];
|
|
4
4
|
import { forwardRef, useId } from 'react';
|
|
5
5
|
import { useMenuContext } from './context';
|
|
6
6
|
import { wrapEvent } from '../utils/wrap-event';
|
|
7
7
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
-
export var ContextMenuTrigger = /*#__PURE__*/forwardRef(function
|
|
8
|
+
export var ContextMenuTrigger = /*#__PURE__*/forwardRef(function ContextMenuTrigger(props, forwardedRef) {
|
|
9
9
|
var _props$as = props.as,
|
|
10
10
|
Comp = _props$as === void 0 ? 'div' : _props$as,
|
|
11
|
+
innerAs = props.innerAs,
|
|
11
12
|
preferredId = props.id,
|
|
12
13
|
onContextMenu = props.onContextMenu,
|
|
13
14
|
disabled = props.disabled,
|
|
@@ -18,7 +19,7 @@ export var ContextMenuTrigger = /*#__PURE__*/forwardRef(function MenuButton(prop
|
|
|
18
19
|
open = _useMenuContext.open,
|
|
19
20
|
buttonRef = _useMenuContext.buttonRef,
|
|
20
21
|
onChange = _useMenuContext.onChange,
|
|
21
|
-
|
|
22
|
+
setOffsetFn = _useMenuContext.setOffsetFn,
|
|
22
23
|
isContextMenu = _useMenuContext.isContextMenu;
|
|
23
24
|
|
|
24
25
|
var idGenerated = useId();
|
|
@@ -30,15 +31,23 @@ export var ContextMenuTrigger = /*#__PURE__*/forwardRef(function MenuButton(prop
|
|
|
30
31
|
}
|
|
31
32
|
|
|
32
33
|
var rect = e.currentTarget.getBoundingClientRect();
|
|
33
|
-
offset.current = [e.nativeEvent.x - rect.x, e.nativeEvent.y - rect.y];
|
|
34
34
|
isContextMenu.current = true;
|
|
35
35
|
buttonRef.current = e.currentTarget;
|
|
36
|
-
onChange
|
|
36
|
+
onChange(e, true);
|
|
37
|
+
var mouseX = e.nativeEvent.x;
|
|
38
|
+
var mouseY = e.nativeEvent.y;
|
|
39
|
+
setOffsetFn(function () {
|
|
40
|
+
return function (_ref) {
|
|
41
|
+
var reference = _ref.reference;
|
|
42
|
+
return [mouseX - rect.x, mouseY - rect.y - reference.height];
|
|
43
|
+
};
|
|
44
|
+
});
|
|
37
45
|
e.preventDefault();
|
|
38
46
|
};
|
|
39
47
|
|
|
40
48
|
return /*#__PURE__*/_jsx(Comp, _extends({
|
|
41
49
|
ref: forwardedRef,
|
|
50
|
+
as: innerAs,
|
|
42
51
|
id: id,
|
|
43
52
|
"aria-haspopup": true,
|
|
44
53
|
"aria-controls": menuListIdRef.current,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenuTrigger.js","names":["forwardRef","useId","useMenuContext","wrapEvent","ContextMenuTrigger","
|
|
1
|
+
{"version":3,"file":"ContextMenuTrigger.js","names":["forwardRef","useId","useMenuContext","wrapEvent","ContextMenuTrigger","props","forwardedRef","as","Comp","innerAs","preferredId","id","onContextMenu","disabled","otherProps","menuListIdRef","open","buttonRef","onChange","setOffsetFn","isContextMenu","idGenerated","handleContextMenu","e","rect","currentTarget","getBoundingClientRect","current","mouseX","nativeEvent","x","mouseY","y","reference","height","preventDefault","undefined"],"sources":["../../../src/Menu/ContextMenuTrigger.tsx"],"sourcesContent":["import type {\n ElementType,\n HTMLAttributes,\n MouseEvent as ReactMouseEvent,\n} from 'react';\nimport { forwardRef, useId } from 'react';\n\nimport { useMenuContext } from './context';\nimport { wrapEvent } from '../utils/wrap-event';\nimport type { OffsetsFunction } from '../Popper';\n\nexport type ContextMenuTriggerProps = HTMLAttributes<HTMLElement> & {\n as?: ElementType<any>;\n innerAs?: ElementType<any>;\n disabled?: boolean;\n};\n\nexport const ContextMenuTrigger = forwardRef<\n HTMLElement,\n ContextMenuTriggerProps\n>(function ContextMenuTrigger(props, forwardedRef) {\n const {\n as: Comp = 'div',\n innerAs,\n id: preferredId,\n onContextMenu,\n disabled,\n ...otherProps\n } = props;\n const {\n menuListIdRef,\n open,\n buttonRef,\n onChange,\n setOffsetFn,\n isContextMenu,\n } = useMenuContext();\n\n const idGenerated = useId();\n const id = preferredId || idGenerated;\n\n const handleContextMenu = (e: ReactMouseEvent<HTMLElement>) => {\n if (disabled) {\n return;\n }\n const rect = e.currentTarget.getBoundingClientRect();\n isContextMenu.current = true;\n\n buttonRef.current = e.currentTarget;\n onChange(e, true);\n\n const mouseX = e.nativeEvent.x;\n const mouseY = e.nativeEvent.y;\n setOffsetFn(\n (): OffsetsFunction =>\n ({ reference }) =>\n [mouseX - rect.x, mouseY - rect.y - reference.height]\n );\n e.preventDefault();\n };\n\n return (\n <Comp\n ref={forwardedRef}\n as={innerAs}\n id={id}\n aria-haspopup={true}\n aria-controls={menuListIdRef.current}\n aria-expanded={open ? true : undefined}\n data-menu-trigger=\"\"\n onContextMenu={wrapEvent(onContextMenu, handleContextMenu)}\n disabled={disabled}\n {...otherProps}\n />\n );\n});\n"],"mappings":";;;AAKA,SAASA,UAAT,EAAqBC,KAArB,QAAkC,OAAlC;AAEA,SAASC,cAAT,QAA+B,WAA/B;AACA,SAASC,SAAT,QAA0B,qBAA1B;;AASA,OAAO,IAAMC,kBAAkB,gBAAGJ,UAAU,CAG1C,SAASI,kBAAT,CAA4BC,KAA5B,EAAmCC,YAAnC,EAAiD;EACjD,gBAOID,KAPJ,CACEE,EADF;EAAA,IACMC,IADN,0BACa,KADb;EAAA,IAEEC,OAFF,GAOIJ,KAPJ,CAEEI,OAFF;EAAA,IAGMC,WAHN,GAOIL,KAPJ,CAGEM,EAHF;EAAA,IAIEC,aAJF,GAOIP,KAPJ,CAIEO,aAJF;EAAA,IAKEC,QALF,GAOIR,KAPJ,CAKEQ,QALF;EAAA,IAMKC,UANL,4BAOIT,KAPJ;;EAQA,sBAOIH,cAAc,EAPlB;EAAA,IACEa,aADF,mBACEA,aADF;EAAA,IAEEC,IAFF,mBAEEA,IAFF;EAAA,IAGEC,SAHF,mBAGEA,SAHF;EAAA,IAIEC,QAJF,mBAIEA,QAJF;EAAA,IAKEC,WALF,mBAKEA,WALF;EAAA,IAMEC,aANF,mBAMEA,aANF;;EASA,IAAMC,WAAW,GAAGpB,KAAK,EAAzB;EACA,IAAMU,EAAE,GAAGD,WAAW,IAAIW,WAA1B;;EAEA,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,CAAD,EAAqC;IAC7D,IAAIV,QAAJ,EAAc;MACZ;IACD;;IACD,IAAMW,IAAI,GAAGD,CAAC,CAACE,aAAF,CAAgBC,qBAAhB,EAAb;IACAN,aAAa,CAACO,OAAd,GAAwB,IAAxB;IAEAV,SAAS,CAACU,OAAV,GAAoBJ,CAAC,CAACE,aAAtB;IACAP,QAAQ,CAACK,CAAD,EAAI,IAAJ,CAAR;IAEA,IAAMK,MAAM,GAAGL,CAAC,CAACM,WAAF,CAAcC,CAA7B;IACA,IAAMC,MAAM,GAAGR,CAAC,CAACM,WAAF,CAAcG,CAA7B;IACAb,WAAW,CACT;MAAA,OACE;QAAA,IAAGc,SAAH,QAAGA,SAAH;QAAA,OACE,CAACL,MAAM,GAAGJ,IAAI,CAACM,CAAf,EAAkBC,MAAM,GAAGP,IAAI,CAACQ,CAAd,GAAkBC,SAAS,CAACC,MAA9C,CADF;MAAA,CADF;IAAA,CADS,CAAX;IAKAX,CAAC,CAACY,cAAF;EACD,CAlBD;;EAoBA,oBACE,KAAC,IAAD;IACE,GAAG,EAAE7B,YADP;IAEE,EAAE,EAAEG,OAFN;IAGE,EAAE,EAAEE,EAHN;IAIE,iBAAe,IAJjB;IAKE,iBAAeI,aAAa,CAACY,OAL/B;IAME,iBAAeX,IAAI,GAAG,IAAH,GAAUoB,SAN/B;IAOE,qBAAkB,EAPpB;IAQE,aAAa,EAAEjC,SAAS,CAACS,aAAD,EAAgBU,iBAAhB,CAR1B;IASE,QAAQ,EAAET;EATZ,GAUMC,UAVN,EADF;AAcD,CA1D2C,CAArC"}
|
package/build/esm/Menu/Menu.js
CHANGED
|
@@ -1,14 +1,15 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
3
3
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
4
|
-
var _excluded = ["as", "open", "defaultOpen", "onChange"];
|
|
5
|
-
import {
|
|
4
|
+
var _excluded = ["as", "innerAs", "open", "defaultOpen", "onChange"];
|
|
5
|
+
import { useState, forwardRef, useRef, Fragment, useId } from 'react';
|
|
6
6
|
import { MenuProvider } from './context';
|
|
7
7
|
import { useControlledState } from '../hooks';
|
|
8
8
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
9
|
export var Menu = /*#__PURE__*/forwardRef(function Menu(props, forwardedRef) {
|
|
10
10
|
var _props$as = props.as,
|
|
11
11
|
Comp = _props$as === void 0 ? Fragment : _props$as,
|
|
12
|
+
innerAs = props.innerAs,
|
|
12
13
|
openProp = props.open,
|
|
13
14
|
_props$defaultOpen = props.defaultOpen,
|
|
14
15
|
defaultOpen = _props$defaultOpen === void 0 ? false : _props$defaultOpen,
|
|
@@ -28,26 +29,33 @@ export var Menu = /*#__PURE__*/forwardRef(function Menu(props, forwardedRef) {
|
|
|
28
29
|
open = _useControlledState2[0],
|
|
29
30
|
onChange = _useControlledState2[1];
|
|
30
31
|
|
|
32
|
+
var _useState = useState(undefined),
|
|
33
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
34
|
+
offsetFn = _useState2[0],
|
|
35
|
+
setOffsetFn = _useState2[1];
|
|
36
|
+
|
|
31
37
|
menuListIdRef.current = useId();
|
|
32
|
-
var offset = useRef([0, 0]);
|
|
33
|
-
var offsetFn = useCallback(function (_ref) {
|
|
34
|
-
var reference = _ref.reference;
|
|
35
|
-
return [offset.current[0], offset.current[1] - reference.height];
|
|
36
|
-
}, []);
|
|
37
38
|
var isContextMenu = useRef(false);
|
|
39
|
+
|
|
40
|
+
if (!open && offsetFn) {
|
|
41
|
+
setOffsetFn(undefined);
|
|
42
|
+
}
|
|
43
|
+
|
|
38
44
|
var value = {
|
|
39
45
|
menuListIdRef: menuListIdRef,
|
|
40
46
|
openWithArrowKeyRef: openWithArrowKeyRef,
|
|
41
47
|
open: open,
|
|
42
48
|
onChange: onChange,
|
|
43
49
|
buttonRef: buttonRef,
|
|
44
|
-
offset: offset,
|
|
45
50
|
offsetFn: offsetFn,
|
|
51
|
+
setOffsetFn: setOffsetFn,
|
|
46
52
|
isContextMenu: isContextMenu
|
|
47
53
|
};
|
|
48
54
|
return /*#__PURE__*/_jsx(MenuProvider, {
|
|
49
55
|
value: value,
|
|
50
|
-
children: /*#__PURE__*/_jsx(Comp, _extends({
|
|
56
|
+
children: /*#__PURE__*/_jsx(Comp, _extends(_extends({}, Comp !== Fragment ? {
|
|
57
|
+
as: innerAs
|
|
58
|
+
} : {}), {}, {
|
|
51
59
|
ref: forwardedRef
|
|
52
60
|
}, otherProps))
|
|
53
61
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Menu.js","names":["
|
|
1
|
+
{"version":3,"file":"Menu.js","names":["useState","forwardRef","useRef","Fragment","useId","MenuProvider","useControlledState","Menu","props","forwardedRef","as","Comp","innerAs","openProp","open","defaultOpen","onChangeProp","onChange","otherProps","menuListIdRef","openWithArrowKeyRef","buttonRef","setState","e","isOpen","undefined","offsetFn","setOffsetFn","current","isContextMenu","value"],"sources":["../../../src/Menu/Menu.tsx"],"sourcesContent":["import type {\n KeyboardEvent,\n MouseEvent,\n PointerEvent,\n ReactNode,\n ElementType,\n} from 'react';\nimport { useState, forwardRef, useRef, Fragment, useId } from 'react';\n\nimport type { MenuContextProps } from './context';\nimport { MenuProvider } from './context';\nimport { useControlledState } from '../hooks';\nimport type { OffsetsFunction } from '../Popper';\n\nexport interface MenuProps {\n as?: ElementType<any>;\n innerAs?: ElementType<any>;\n children?: ReactNode;\n onChange?: (\n e:\n | KeyboardEvent<HTMLElement>\n | MouseEvent<HTMLElement>\n | PointerEvent<HTMLElement>,\n isOpen: boolean\n ) => void;\n open?: boolean;\n defaultOpen?: boolean;\n}\n\nexport const Menu = forwardRef<HTMLDivElement, MenuProps>(function Menu(\n props,\n forwardedRef\n) {\n const {\n as: Comp = Fragment,\n innerAs,\n open: openProp,\n defaultOpen = false,\n onChange: onChangeProp,\n ...otherProps\n } = props;\n const menuListIdRef = useRef<string>();\n const openWithArrowKeyRef = useRef<'ArrowUp' | 'ArrowDown' | null>(null);\n const buttonRef = useRef<HTMLButtonElement>(null);\n const [open, onChange] = useControlledState(\n openProp,\n onChangeProp,\n defaultOpen,\n (setState) => (e, isOpen) => {\n setState(isOpen);\n }\n );\n const [offsetFn, setOffsetFn] = useState<OffsetsFunction | undefined>(\n undefined\n );\n menuListIdRef.current = useId();\n const isContextMenu = useRef(false);\n\n if (!open && offsetFn) {\n setOffsetFn(undefined);\n }\n\n const value: MenuContextProps = {\n menuListIdRef,\n openWithArrowKeyRef,\n open,\n onChange,\n buttonRef,\n offsetFn,\n setOffsetFn,\n isContextMenu,\n };\n\n return (\n <MenuProvider value={value}>\n <Comp\n {...(Comp !== Fragment ? { as: innerAs } : {})}\n ref={forwardedRef}\n {...otherProps}\n />\n </MenuProvider>\n );\n});\n"],"mappings":";;;;AAOA,SAASA,QAAT,EAAmBC,UAAnB,EAA+BC,MAA/B,EAAuCC,QAAvC,EAAiDC,KAAjD,QAA8D,OAA9D;AAGA,SAASC,YAAT,QAA6B,WAA7B;AACA,SAASC,kBAAT,QAAmC,UAAnC;;AAkBA,OAAO,IAAMC,IAAI,gBAAGN,UAAU,CAA4B,SAASM,IAAT,CACxDC,KADwD,EAExDC,YAFwD,EAGxD;EACA,gBAOID,KAPJ,CACEE,EADF;EAAA,IACMC,IADN,0BACaR,QADb;EAAA,IAEES,OAFF,GAOIJ,KAPJ,CAEEI,OAFF;EAAA,IAGQC,QAHR,GAOIL,KAPJ,CAGEM,IAHF;EAAA,yBAOIN,KAPJ,CAIEO,WAJF;EAAA,IAIEA,WAJF,mCAIgB,KAJhB;EAAA,IAKYC,YALZ,GAOIR,KAPJ,CAKES,QALF;EAAA,IAMKC,UANL,4BAOIV,KAPJ;;EAQA,IAAMW,aAAa,GAAGjB,MAAM,EAA5B;EACA,IAAMkB,mBAAmB,GAAGlB,MAAM,CAAiC,IAAjC,CAAlC;EACA,IAAMmB,SAAS,GAAGnB,MAAM,CAAoB,IAApB,CAAxB;;EACA,0BAAyBI,kBAAkB,CACzCO,QADyC,EAEzCG,YAFyC,EAGzCD,WAHyC,EAIzC,UAACO,QAAD;IAAA,OAAc,UAACC,CAAD,EAAIC,MAAJ,EAAe;MAC3BF,QAAQ,CAACE,MAAD,CAAR;IACD,CAFD;EAAA,CAJyC,CAA3C;EAAA;EAAA,IAAOV,IAAP;EAAA,IAAaG,QAAb;;EAQA,gBAAgCjB,QAAQ,CACtCyB,SADsC,CAAxC;EAAA;EAAA,IAAOC,QAAP;EAAA,IAAiBC,WAAjB;;EAGAR,aAAa,CAACS,OAAd,GAAwBxB,KAAK,EAA7B;EACA,IAAMyB,aAAa,GAAG3B,MAAM,CAAC,KAAD,CAA5B;;EAEA,IAAI,CAACY,IAAD,IAASY,QAAb,EAAuB;IACrBC,WAAW,CAACF,SAAD,CAAX;EACD;;EAED,IAAMK,KAAuB,GAAG;IAC9BX,aAAa,EAAbA,aAD8B;IAE9BC,mBAAmB,EAAnBA,mBAF8B;IAG9BN,IAAI,EAAJA,IAH8B;IAI9BG,QAAQ,EAARA,QAJ8B;IAK9BI,SAAS,EAATA,SAL8B;IAM9BK,QAAQ,EAARA,QAN8B;IAO9BC,WAAW,EAAXA,WAP8B;IAQ9BE,aAAa,EAAbA;EAR8B,CAAhC;EAWA,oBACE,KAAC,YAAD;IAAc,KAAK,EAAEC,KAArB;IAAA,uBACE,KAAC,IAAD,wBACOnB,IAAI,KAAKR,QAAT,GAAoB;MAAEO,EAAE,EAAEE;IAAN,CAApB,GAAsC,EAD7C;MAEE,GAAG,EAAEH;IAFP,GAGMS,UAHN;EADF,EADF;AASD,CArD6B,CAAvB"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
-
var _excluded = ["as", "id", "onClick", "onKeyDown", "disabled"];
|
|
3
|
+
var _excluded = ["as", "innerAs", "id", "onClick", "onKeyDown", "disabled"];
|
|
4
4
|
import { forwardRef, useId } from 'react';
|
|
5
5
|
import { useMenuContext } from './context';
|
|
6
6
|
import { wrapEvent } from '../utils/wrap-event';
|
|
@@ -8,6 +8,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
8
8
|
export var MenuButton = /*#__PURE__*/forwardRef(function MenuButton(props, forwardedRef) {
|
|
9
9
|
var _props$as = props.as,
|
|
10
10
|
Comp = _props$as === void 0 ? 'button' : _props$as,
|
|
11
|
+
innerAs = props.innerAs,
|
|
11
12
|
preferredId = props.id,
|
|
12
13
|
onClick = props.onClick,
|
|
13
14
|
onKeyDown = props.onKeyDown,
|
|
@@ -47,7 +48,7 @@ export var MenuButton = /*#__PURE__*/forwardRef(function MenuButton(props, forwa
|
|
|
47
48
|
openWithArrowKeyRef.current = e.key;
|
|
48
49
|
}
|
|
49
50
|
|
|
50
|
-
onChange
|
|
51
|
+
onChange(e, true);
|
|
51
52
|
e.preventDefault();
|
|
52
53
|
}
|
|
53
54
|
};
|
|
@@ -58,11 +59,12 @@ export var MenuButton = /*#__PURE__*/forwardRef(function MenuButton(props, forwa
|
|
|
58
59
|
}
|
|
59
60
|
|
|
60
61
|
buttonRef.current = e.currentTarget;
|
|
61
|
-
onChange
|
|
62
|
+
onChange(e, !open);
|
|
62
63
|
};
|
|
63
64
|
|
|
64
65
|
return /*#__PURE__*/_jsx(Comp, _extends({
|
|
65
66
|
ref: forwardedRef,
|
|
67
|
+
as: innerAs,
|
|
66
68
|
id: buttonId,
|
|
67
69
|
role: "button",
|
|
68
70
|
type: "button",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuButton.js","names":["forwardRef","useId","useMenuContext","wrapEvent","MenuButton","props","forwardedRef","as","Comp","preferredId","id","onClick","onKeyDown","disabled","otherProps","menuListIdRef","openWithArrowKeyRef","open","buttonRef","onChange","buttonIdGenerated","buttonId","handleKeyDown","e","current","currentTarget","isArrowKey","includes","key","isEnterKey","openedWithArrow","preventDefault","handleClick","undefined"],"sources":["../../../src/Menu/MenuButton.tsx"],"sourcesContent":["import type {\n ButtonHTMLAttributes,\n ElementType,\n KeyboardEvent,\n MouseEvent,\n} from 'react';\nimport { forwardRef, useId } from 'react';\n\nimport { useMenuContext } from './context';\nimport { wrapEvent } from '../utils/wrap-event';\n\nexport type MenuButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n as?: ElementType<any>;\n innerAs?: ElementType<any>;\n onClick?: (\n e: MouseEvent<HTMLButtonElement> | KeyboardEvent<HTMLButtonElement>\n ) => void;\n};\n\nexport const MenuButton = forwardRef<HTMLButtonElement, MenuButtonProps>(\n function MenuButton(props, forwardedRef) {\n const {\n as: Comp = 'button',\n id: preferredId,\n onClick,\n onKeyDown,\n disabled,\n ...otherProps\n } = props;\n const { menuListIdRef, openWithArrowKeyRef, open, buttonRef, onChange } =\n useMenuContext();\n\n const buttonIdGenerated = useId();\n const buttonId = preferredId || buttonIdGenerated;\n\n const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\n if (disabled) {\n return;\n }\n buttonRef.current = e.currentTarget;\n\n const isArrowKey = () => ['ArrowUp', 'ArrowDown'].includes(e.key);\n const isEnterKey = () => [' ', 'Enter'].includes(e.key);\n\n const openedWithArrow = isArrowKey();\n if (openedWithArrow || isEnterKey()) {\n if (openedWithArrow) {\n // Used to make it open at the end or begining of the list\n openWithArrowKeyRef.current = e.key;\n }\n onChange
|
|
1
|
+
{"version":3,"file":"MenuButton.js","names":["forwardRef","useId","useMenuContext","wrapEvent","MenuButton","props","forwardedRef","as","Comp","innerAs","preferredId","id","onClick","onKeyDown","disabled","otherProps","menuListIdRef","openWithArrowKeyRef","open","buttonRef","onChange","buttonIdGenerated","buttonId","handleKeyDown","e","current","currentTarget","isArrowKey","includes","key","isEnterKey","openedWithArrow","preventDefault","handleClick","undefined"],"sources":["../../../src/Menu/MenuButton.tsx"],"sourcesContent":["import type {\n ButtonHTMLAttributes,\n ElementType,\n KeyboardEvent,\n MouseEvent,\n} from 'react';\nimport { forwardRef, useId } from 'react';\n\nimport { useMenuContext } from './context';\nimport { wrapEvent } from '../utils/wrap-event';\n\nexport type MenuButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n as?: ElementType<any>;\n innerAs?: ElementType<any>;\n onClick?: (\n e: MouseEvent<HTMLButtonElement> | KeyboardEvent<HTMLButtonElement>\n ) => void;\n};\n\nexport const MenuButton = forwardRef<HTMLButtonElement, MenuButtonProps>(\n function MenuButton(props, forwardedRef) {\n const {\n as: Comp = 'button',\n innerAs,\n id: preferredId,\n onClick,\n onKeyDown,\n disabled,\n ...otherProps\n } = props;\n const { menuListIdRef, openWithArrowKeyRef, open, buttonRef, onChange } =\n useMenuContext();\n\n const buttonIdGenerated = useId();\n const buttonId = preferredId || buttonIdGenerated;\n\n const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\n if (disabled) {\n return;\n }\n buttonRef.current = e.currentTarget;\n\n const isArrowKey = () => ['ArrowUp', 'ArrowDown'].includes(e.key);\n const isEnterKey = () => [' ', 'Enter'].includes(e.key);\n\n const openedWithArrow = isArrowKey();\n if (openedWithArrow || isEnterKey()) {\n if (openedWithArrow) {\n // Used to make it open at the end or begining of the list\n openWithArrowKeyRef.current = e.key;\n }\n onChange(e, true);\n e.preventDefault();\n }\n };\n\n const handleClick = (e: MouseEvent<HTMLButtonElement>) => {\n if (disabled) {\n return;\n }\n buttonRef.current = e.currentTarget;\n onChange(e, !open);\n };\n\n return (\n <Comp\n ref={forwardedRef}\n as={innerAs}\n id={buttonId}\n role=\"button\"\n type=\"button\"\n aria-haspopup={true}\n aria-controls={menuListIdRef.current}\n aria-expanded={open ? true : undefined}\n data-menu-button=\"\"\n onClick={wrapEvent(onClick, handleClick)}\n onKeyDown={wrapEvent(onKeyDown, handleKeyDown)}\n disabled={disabled}\n {...otherProps}\n />\n );\n }\n);\n"],"mappings":";;;AAMA,SAASA,UAAT,EAAqBC,KAArB,QAAkC,OAAlC;AAEA,SAASC,cAAT,QAA+B,WAA/B;AACA,SAASC,SAAT,QAA0B,qBAA1B;;AAUA,OAAO,IAAMC,UAAU,gBAAGJ,UAAU,CAClC,SAASI,UAAT,CAAoBC,KAApB,EAA2BC,YAA3B,EAAyC;EACvC,gBAQID,KARJ,CACEE,EADF;EAAA,IACMC,IADN,0BACa,QADb;EAAA,IAEEC,OAFF,GAQIJ,KARJ,CAEEI,OAFF;EAAA,IAGMC,WAHN,GAQIL,KARJ,CAGEM,EAHF;EAAA,IAIEC,OAJF,GAQIP,KARJ,CAIEO,OAJF;EAAA,IAKEC,SALF,GAQIR,KARJ,CAKEQ,SALF;EAAA,IAMEC,QANF,GAQIT,KARJ,CAMES,QANF;EAAA,IAOKC,UAPL,4BAQIV,KARJ;;EASA,sBACEH,cAAc,EADhB;EAAA,IAAQc,aAAR,mBAAQA,aAAR;EAAA,IAAuBC,mBAAvB,mBAAuBA,mBAAvB;EAAA,IAA4CC,IAA5C,mBAA4CA,IAA5C;EAAA,IAAkDC,SAAlD,mBAAkDA,SAAlD;EAAA,IAA6DC,QAA7D,mBAA6DA,QAA7D;;EAGA,IAAMC,iBAAiB,GAAGpB,KAAK,EAA/B;EACA,IAAMqB,QAAQ,GAAGZ,WAAW,IAAIW,iBAAhC;;EAEA,IAAME,aAAa,GAAG,SAAhBA,aAAgB,CAACC,CAAD,EAAyC;IAC7D,IAAIV,QAAJ,EAAc;MACZ;IACD;;IACDK,SAAS,CAACM,OAAV,GAAoBD,CAAC,CAACE,aAAtB;;IAEA,IAAMC,UAAU,GAAG,SAAbA,UAAa;MAAA,OAAM,CAAC,SAAD,EAAY,WAAZ,EAAyBC,QAAzB,CAAkCJ,CAAC,CAACK,GAApC,CAAN;IAAA,CAAnB;;IACA,IAAMC,UAAU,GAAG,SAAbA,UAAa;MAAA,OAAM,CAAC,GAAD,EAAM,OAAN,EAAeF,QAAf,CAAwBJ,CAAC,CAACK,GAA1B,CAAN;IAAA,CAAnB;;IAEA,IAAME,eAAe,GAAGJ,UAAU,EAAlC;;IACA,IAAII,eAAe,IAAID,UAAU,EAAjC,EAAqC;MACnC,IAAIC,eAAJ,EAAqB;QACnB;QACAd,mBAAmB,CAACQ,OAApB,GAA8BD,CAAC,CAACK,GAAhC;MACD;;MACDT,QAAQ,CAACI,CAAD,EAAI,IAAJ,CAAR;MACAA,CAAC,CAACQ,cAAF;IACD;EACF,CAlBD;;EAoBA,IAAMC,WAAW,GAAG,SAAdA,WAAc,CAACT,CAAD,EAAsC;IACxD,IAAIV,QAAJ,EAAc;MACZ;IACD;;IACDK,SAAS,CAACM,OAAV,GAAoBD,CAAC,CAACE,aAAtB;IACAN,QAAQ,CAACI,CAAD,EAAI,CAACN,IAAL,CAAR;EACD,CAND;;EAQA,oBACE,KAAC,IAAD;IACE,GAAG,EAAEZ,YADP;IAEE,EAAE,EAAEG,OAFN;IAGE,EAAE,EAAEa,QAHN;IAIE,IAAI,EAAC,QAJP;IAKE,IAAI,EAAC,QALP;IAME,iBAAe,IANjB;IAOE,iBAAeN,aAAa,CAACS,OAP/B;IAQE,iBAAeP,IAAI,GAAG,IAAH,GAAUgB,SAR/B;IASE,oBAAiB,EATnB;IAUE,OAAO,EAAE/B,SAAS,CAACS,OAAD,EAAUqB,WAAV,CAVpB;IAWE,SAAS,EAAE9B,SAAS,CAACU,SAAD,EAAYU,aAAZ,CAXtB;IAYE,QAAQ,EAAET;EAZZ,GAaMC,UAbN,EADF;AAiBD,CA9DiC,CAA7B"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
-
var _excluded = ["as", "disabled", "onSelect", "onClick", "onKeyDown"];
|
|
3
|
+
var _excluded = ["as", "innerAs", "disabled", "onSelect", "onClick", "onKeyDown"];
|
|
4
4
|
import { forwardRef, useRef, useId } from 'react';
|
|
5
5
|
import { useMenuContext, useMenuListContext } from './context';
|
|
6
6
|
import { assignMultipleRefs } from '../utils/assign-ref';
|
|
@@ -9,6 +9,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
9
9
|
export var MenuItem = /*#__PURE__*/forwardRef(function MenuItem(props, forwardedRef) {
|
|
10
10
|
var _props$as = props.as,
|
|
11
11
|
Comp = _props$as === void 0 ? 'li' : _props$as,
|
|
12
|
+
innerAs = props.innerAs,
|
|
12
13
|
disabled = props.disabled,
|
|
13
14
|
onSelect = props.onSelect,
|
|
14
15
|
onClick = props.onClick,
|
|
@@ -29,7 +30,7 @@ export var MenuItem = /*#__PURE__*/forwardRef(function MenuItem(props, forwarded
|
|
|
29
30
|
var handleSelect = wrapEvent(onSelect, function (e) {
|
|
30
31
|
var _buttonRef$current;
|
|
31
32
|
|
|
32
|
-
onChange
|
|
33
|
+
onChange(e, false);
|
|
33
34
|
(_buttonRef$current = buttonRef.current) === null || _buttonRef$current === void 0 ? void 0 : _buttonRef$current.focus();
|
|
34
35
|
e.preventDefault();
|
|
35
36
|
});
|
|
@@ -55,6 +56,7 @@ export var MenuItem = /*#__PURE__*/forwardRef(function MenuItem(props, forwarded
|
|
|
55
56
|
|
|
56
57
|
return /*#__PURE__*/_jsx(Comp, _extends({
|
|
57
58
|
ref: assignMultipleRefs(ref, forwardedRef),
|
|
59
|
+
as: innerAs,
|
|
58
60
|
id: disabled ? undefined : itemId,
|
|
59
61
|
"data-menu-item": "",
|
|
60
62
|
"data-highlighted": isActive ? '' : undefined,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuItem.js","names":["forwardRef","useRef","useId","useMenuContext","useMenuListContext","assignMultipleRefs","wrapEvent","MenuItem","props","forwardedRef","as","Comp","disabled","onSelect","onClick","onKeyDown","otherProps","onChange","buttonRef","navigationItem","onNavigate","ref","itemId","isActive","current","handleSelect","e","focus","preventDefault","handleClick","handleKeyDown","key","undefined"],"sources":["../../../src/Menu/MenuItem.tsx"],"sourcesContent":["import type {\n LiHTMLAttributes,\n ElementType,\n MouseEvent,\n KeyboardEvent,\n KeyboardEventHandler,\n} from 'react';\nimport { forwardRef, useRef, useId } from 'react';\n\nimport { useMenuContext, useMenuListContext } from './context';\nimport { assignMultipleRefs } from '../utils/assign-ref';\nimport { wrapEvent } from '../utils';\n\nexport interface MenuItemProps extends LiHTMLAttributes<HTMLLIElement> {\n as?: ElementType<any>;\n innerAs?: ElementType<any>;\n onSelect?: (\n e: MouseEvent<HTMLLIElement> | KeyboardEvent<HTMLLIElement>\n ) => void;\n disabled?: boolean;\n}\n\nexport const MenuItem = forwardRef<any, MenuItemProps>(function MenuItem(\n props,\n forwardedRef\n) {\n const {\n as: Comp = 'li',\n disabled,\n onSelect,\n onClick,\n onKeyDown,\n ...otherProps\n } = props;\n const { onChange, buttonRef } = useMenuContext();\n const { navigationItem, onNavigate } = useMenuListContext();\n const ref = useRef<HTMLLIElement>();\n const itemId = useId();\n\n const isActive = ref.current && ref.current === navigationItem;\n\n const handleSelect = wrapEvent(\n onSelect,\n (e: KeyboardEvent<HTMLLIElement> | MouseEvent<HTMLLIElement>) => {\n onChange
|
|
1
|
+
{"version":3,"file":"MenuItem.js","names":["forwardRef","useRef","useId","useMenuContext","useMenuListContext","assignMultipleRefs","wrapEvent","MenuItem","props","forwardedRef","as","Comp","innerAs","disabled","onSelect","onClick","onKeyDown","otherProps","onChange","buttonRef","navigationItem","onNavigate","ref","itemId","isActive","current","handleSelect","e","focus","preventDefault","handleClick","handleKeyDown","key","undefined"],"sources":["../../../src/Menu/MenuItem.tsx"],"sourcesContent":["import type {\n LiHTMLAttributes,\n ElementType,\n MouseEvent,\n KeyboardEvent,\n KeyboardEventHandler,\n} from 'react';\nimport { forwardRef, useRef, useId } from 'react';\n\nimport { useMenuContext, useMenuListContext } from './context';\nimport { assignMultipleRefs } from '../utils/assign-ref';\nimport { wrapEvent } from '../utils';\n\nexport interface MenuItemProps extends LiHTMLAttributes<HTMLLIElement> {\n as?: ElementType<any>;\n innerAs?: ElementType<any>;\n onSelect?: (\n e: MouseEvent<HTMLLIElement> | KeyboardEvent<HTMLLIElement>\n ) => void;\n disabled?: boolean;\n}\n\nexport const MenuItem = forwardRef<any, MenuItemProps>(function MenuItem(\n props,\n forwardedRef\n) {\n const {\n as: Comp = 'li',\n innerAs,\n disabled,\n onSelect,\n onClick,\n onKeyDown,\n ...otherProps\n } = props;\n const { onChange, buttonRef } = useMenuContext();\n const { navigationItem, onNavigate } = useMenuListContext();\n const ref = useRef<HTMLLIElement>();\n const itemId = useId();\n\n const isActive = ref.current && ref.current === navigationItem;\n\n const handleSelect = wrapEvent(\n onSelect,\n (e: KeyboardEvent<HTMLLIElement> | MouseEvent<HTMLLIElement>) => {\n onChange(e, false);\n buttonRef.current?.focus();\n e.preventDefault();\n }\n );\n\n const handleClick = (e: MouseEvent<HTMLLIElement>) => {\n if (!disabled) {\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n onNavigate && onNavigate(ref.current!);\n handleSelect(e);\n }\n };\n\n const handleKeyDown: KeyboardEventHandler<HTMLLIElement> = (e) => {\n switch (e.key) {\n case 'Enter':\n if (!disabled) {\n handleSelect(e);\n }\n break;\n }\n };\n\n return (\n <Comp\n ref={assignMultipleRefs(ref, forwardedRef)}\n as={innerAs}\n id={disabled ? undefined : itemId}\n data-menu-item=\"\"\n data-highlighted={isActive ? '' : undefined}\n role=\"menuitem\"\n onClick={wrapEvent(onClick, handleClick)}\n tabIndex={disabled ? -1 : 0}\n onKeyDown={wrapEvent(onKeyDown, handleKeyDown)}\n data-disabled={disabled ? '' : undefined}\n aria-disabled={disabled ? '' : undefined}\n disabled={disabled}\n {...otherProps}\n />\n );\n});\n"],"mappings":";;;AAOA,SAASA,UAAT,EAAqBC,MAArB,EAA6BC,KAA7B,QAA0C,OAA1C;AAEA,SAASC,cAAT,EAAyBC,kBAAzB,QAAmD,WAAnD;AACA,SAASC,kBAAT,QAAmC,qBAAnC;AACA,SAASC,SAAT,QAA0B,UAA1B;;AAWA,OAAO,IAAMC,QAAQ,gBAAGP,UAAU,CAAqB,SAASO,QAAT,CACrDC,KADqD,EAErDC,YAFqD,EAGrD;EACA,gBAQID,KARJ,CACEE,EADF;EAAA,IACMC,IADN,0BACa,IADb;EAAA,IAEEC,OAFF,GAQIJ,KARJ,CAEEI,OAFF;EAAA,IAGEC,QAHF,GAQIL,KARJ,CAGEK,QAHF;EAAA,IAIEC,QAJF,GAQIN,KARJ,CAIEM,QAJF;EAAA,IAKEC,OALF,GAQIP,KARJ,CAKEO,OALF;EAAA,IAMEC,SANF,GAQIR,KARJ,CAMEQ,SANF;EAAA,IAOKC,UAPL,4BAQIT,KARJ;;EASA,sBAAgCL,cAAc,EAA9C;EAAA,IAAQe,QAAR,mBAAQA,QAAR;EAAA,IAAkBC,SAAlB,mBAAkBA,SAAlB;;EACA,0BAAuCf,kBAAkB,EAAzD;EAAA,IAAQgB,cAAR,uBAAQA,cAAR;EAAA,IAAwBC,UAAxB,uBAAwBA,UAAxB;;EACA,IAAMC,GAAG,GAAGrB,MAAM,EAAlB;EACA,IAAMsB,MAAM,GAAGrB,KAAK,EAApB;EAEA,IAAMsB,QAAQ,GAAGF,GAAG,CAACG,OAAJ,IAAeH,GAAG,CAACG,OAAJ,KAAgBL,cAAhD;EAEA,IAAMM,YAAY,GAAGpB,SAAS,CAC5BQ,QAD4B,EAE5B,UAACa,CAAD,EAAiE;IAAA;;IAC/DT,QAAQ,CAACS,CAAD,EAAI,KAAJ,CAAR;IACA,sBAAAR,SAAS,CAACM,OAAV,0EAAmBG,KAAnB;IACAD,CAAC,CAACE,cAAF;EACD,CAN2B,CAA9B;;EASA,IAAMC,WAAW,GAAG,SAAdA,WAAc,CAACH,CAAD,EAAkC;IACpD,IAAI,CAACd,QAAL,EAAe;MACb;MACAQ,UAAU,IAAIA,UAAU,CAACC,GAAG,CAACG,OAAL,CAAxB;MACAC,YAAY,CAACC,CAAD,CAAZ;IACD;EACF,CAND;;EAQA,IAAMI,aAAkD,GAAG,SAArDA,aAAqD,CAACJ,CAAD,EAAO;IAChE,QAAQA,CAAC,CAACK,GAAV;MACE,KAAK,OAAL;QACE,IAAI,CAACnB,QAAL,EAAe;UACba,YAAY,CAACC,CAAD,CAAZ;QACD;;QACD;IALJ;EAOD,CARD;;EAUA,oBACE,KAAC,IAAD;IACE,GAAG,EAAEtB,kBAAkB,CAACiB,GAAD,EAAMb,YAAN,CADzB;IAEE,EAAE,EAAEG,OAFN;IAGE,EAAE,EAAEC,QAAQ,GAAGoB,SAAH,GAAeV,MAH7B;IAIE,kBAAe,EAJjB;IAKE,oBAAkBC,QAAQ,GAAG,EAAH,GAAQS,SALpC;IAME,IAAI,EAAC,UANP;IAOE,OAAO,EAAE3B,SAAS,CAACS,OAAD,EAAUe,WAAV,CAPpB;IAQE,QAAQ,EAAEjB,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAR5B;IASE,SAAS,EAAEP,SAAS,CAACU,SAAD,EAAYe,aAAZ,CATtB;IAUE,iBAAelB,QAAQ,GAAG,EAAH,GAAQoB,SAVjC;IAWE,iBAAepB,QAAQ,GAAG,EAAH,GAAQoB,SAXjC;IAYE,QAAQ,EAAEpB;EAZZ,GAaMI,UAbN,EADF;AAiBD,CAhEiC,CAA3B"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
3
3
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
4
|
-
var _excluded = ["as", "onKeyDown", "id", "defaultActiveItemValue"];
|
|
5
|
-
import { forwardRef, useEffect, useRef, useState, useLayoutEffect } from 'react';
|
|
4
|
+
var _excluded = ["as", "innerAs", "onKeyDown", "id", "defaultActiveItemValue"];
|
|
5
|
+
import { useCallback, forwardRef, useEffect, useRef, useState, useLayoutEffect } from 'react';
|
|
6
6
|
import { useMenuContext, MenuListProvider } from './context';
|
|
7
7
|
import { assignMultipleRefs } from '../utils/assign-ref';
|
|
8
8
|
import { useOnClickOutside } from '../hooks/useOnClickOutside';
|
|
@@ -16,11 +16,13 @@ export var MenuList = /*#__PURE__*/forwardRef(function MenuList(props, forwarded
|
|
|
16
16
|
|
|
17
17
|
var _props$as = props.as,
|
|
18
18
|
Comp = _props$as === void 0 ? 'ul' : _props$as,
|
|
19
|
+
innerAs = props.innerAs,
|
|
19
20
|
onKeyDown = props.onKeyDown,
|
|
20
21
|
preferredId = props.id,
|
|
21
22
|
defaultActiveItemValue = props.defaultActiveItemValue,
|
|
22
23
|
otherProps = _objectWithoutProperties(props, _excluded);
|
|
23
24
|
|
|
25
|
+
var interactedOutside = useRef(false);
|
|
24
26
|
var itemSearchStr = useRef('');
|
|
25
27
|
var itemSearchClearTimeout = useRef();
|
|
26
28
|
|
|
@@ -73,17 +75,29 @@ export var MenuList = /*#__PURE__*/forwardRef(function MenuList(props, forwarded
|
|
|
73
75
|
openWithArrowKeyRef.current = null;
|
|
74
76
|
setMounted(true);
|
|
75
77
|
}, [mounted, navigationItem, onNavigate, openWithArrowKeyRef, scope, defaultActiveItemValue]);
|
|
76
|
-
|
|
77
|
-
|
|
78
|
+
var handleClickOutside = useCallback(function (e) {
|
|
79
|
+
if (!interactedOutside.current) {
|
|
80
|
+
// First interaction should be ignored, because
|
|
81
|
+
// this is what triggered the context menu to open
|
|
82
|
+
interactedOutside.current = true;
|
|
83
|
+
return;
|
|
84
|
+
}
|
|
78
85
|
|
|
79
|
-
|
|
86
|
+
if (isContextMenu.current) {
|
|
87
|
+
if (e.button === 0) {
|
|
88
|
+
onChange(e, false);
|
|
89
|
+
}
|
|
90
|
+
} else {
|
|
91
|
+
var _buttonRef$current;
|
|
80
92
|
|
|
81
|
-
|
|
82
|
-
|
|
93
|
+
if (e.target instanceof HTMLElement && e.target !== buttonRef.current && !((_buttonRef$current = buttonRef.current) !== null && _buttonRef$current !== void 0 && _buttonRef$current.contains(e.target))) {
|
|
94
|
+
onChange(e, false);
|
|
95
|
+
}
|
|
83
96
|
}
|
|
84
97
|
|
|
85
98
|
e.preventDefault();
|
|
86
|
-
},
|
|
99
|
+
}, [buttonRef, isContextMenu, onChange]);
|
|
100
|
+
useOnClickOutside(menuListRef, handleClickOutside, open);
|
|
87
101
|
|
|
88
102
|
function handleKeyDown(e) {
|
|
89
103
|
switch (e.key) {
|
|
@@ -92,7 +106,7 @@ export var MenuList = /*#__PURE__*/forwardRef(function MenuList(props, forwarded
|
|
|
92
106
|
{
|
|
93
107
|
var _buttonRef$current2;
|
|
94
108
|
|
|
95
|
-
onChange
|
|
109
|
+
onChange(e, false);
|
|
96
110
|
e.preventDefault(); // prevents focusing on next element, because we will be handling it
|
|
97
111
|
|
|
98
112
|
itemSearchStr.current = '';
|
|
@@ -187,6 +201,7 @@ export var MenuList = /*#__PURE__*/forwardRef(function MenuList(props, forwarded
|
|
|
187
201
|
}
|
|
188
202
|
|
|
189
203
|
if (!open) {
|
|
204
|
+
interactedOutside.current = false;
|
|
190
205
|
return null;
|
|
191
206
|
}
|
|
192
207
|
|
|
@@ -197,6 +212,7 @@ export var MenuList = /*#__PURE__*/forwardRef(function MenuList(props, forwarded
|
|
|
197
212
|
},
|
|
198
213
|
children: /*#__PURE__*/_jsx(Comp, _extends({
|
|
199
214
|
ref: assignMultipleRefs(forwardedRef, menuListRef),
|
|
215
|
+
as: innerAs,
|
|
200
216
|
id: menuListIdRef.current,
|
|
201
217
|
role: "menu",
|
|
202
218
|
"aria-labelledby": (_buttonRef$current3 = buttonRef.current) === null || _buttonRef$current3 === void 0 ? void 0 : _buttonRef$current3.id,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuList.js","names":["forwardRef","useEffect","useRef","useState","useLayoutEffect","useMenuContext","MenuListProvider","assignMultipleRefs","useOnClickOutside","useScope","queryScope","getCircularIndex","wrapEvent","useEnhancedEffect","window","MenuList","props","forwardedRef","as","Comp","onKeyDown","preferredId","id","defaultActiveItemValue","otherProps","itemSearchStr","itemSearchClearTimeout","menuListIdRef","buttonRef","onChange","openWithArrowKeyRef","open","isContextMenu","navigationItem","setNavigationItem","mounted","setMounted","menuListRef","scope","onNavigate","el","focus","current","allItems","queryAllNodes","index","length","i","dataset","value","e","console","log","target","HTMLElement","contains","preventDefault","handleKeyDown","key","currentIndex","findIndex","nextIndex","ctrlKey","altKey","slice","clearTimeout","setTimeout","searchStr","idx","dom","domText","innerText","toLowerCase","startsWith"],"sources":["../../../src/Menu/MenuList.tsx"],"sourcesContent":["import type { HTMLAttributes, ElementType, KeyboardEvent } from 'react';\nimport {\n forwardRef,\n useEffect,\n useRef,\n useState,\n useLayoutEffect,\n} from 'react';\n\nimport { useMenuContext, MenuListProvider } from './context';\nimport { assignMultipleRefs } from '../utils/assign-ref';\nimport { useOnClickOutside } from '../hooks/useOnClickOutside';\nimport { useScope } from '../hooks';\nimport { queryScope } from './scope';\nimport { getCircularIndex, wrapEvent } from '../utils';\n\nconst useEnhancedEffect =\n typeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\nexport interface MenuListProps extends HTMLAttributes<HTMLUListElement> {\n as?: ElementType<any>;\n innerAs?: ElementType<any>;\n defaultActiveItemValue?: string;\n}\n\nexport const MenuList = forwardRef<HTMLUListElement, MenuListProps>(\n function MenuList(props, forwardedRef) {\n const {\n as: Comp = 'ul',\n onKeyDown,\n id: preferredId,\n defaultActiveItemValue,\n ...otherProps\n } = props;\n\n const itemSearchStr = useRef('');\n const itemSearchClearTimeout = useRef<ReturnType<typeof setTimeout>>();\n\n const {\n menuListIdRef,\n buttonRef,\n onChange,\n openWithArrowKeyRef,\n open,\n isContextMenu,\n } = useMenuContext();\n\n const [navigationItem, setNavigationItem] = useState<\n HTMLElement | undefined\n >();\n\n const [mounted, setMounted] = useState(false);\n\n const menuListRef = useRef<HTMLUListElement>();\n\n const scope = useScope<HTMLLIElement, HTMLUListElement>(menuListRef);\n\n const onNavigate = (el: HTMLElement) => {\n el.focus();\n setNavigationItem(el);\n };\n\n menuListIdRef.current = preferredId || menuListIdRef.current;\n\n useEnhancedEffect(() => {\n if (!mounted) {\n const allItems = scope.current.queryAllNodes(queryScope);\n let index = getCircularIndex(\n openWithArrowKeyRef.current === 'ArrowUp' ? -1 : 0,\n allItems.length\n );\n\n if (defaultActiveItemValue) {\n for (let i = 0; i < allItems.length; i++) {\n if (allItems[i].dataset.value === defaultActiveItemValue) {\n index = i;\n break;\n }\n }\n }\n\n if (index !== null) {\n onNavigate && onNavigate(allItems[index]);\n }\n }\n\n openWithArrowKeyRef.current = null;\n setMounted(true);\n }, [\n mounted,\n navigationItem,\n onNavigate,\n openWithArrowKeyRef,\n scope,\n defaultActiveItemValue,\n ]);\n\n useOnClickOutside(\n menuListRef,\n (e) => {\n console.log(isContextMenu.current);\n if (\n isContextMenu.current ||\n (e.target instanceof HTMLElement &&\n e.target !== buttonRef.current &&\n !buttonRef.current?.contains(e.target))\n ) {\n onChange && onChange(e as any, false);\n }\n e.preventDefault();\n },\n true\n );\n\n function handleKeyDown(e: KeyboardEvent<HTMLUListElement>) {\n switch (e.key) {\n case 'Escape':\n case 'Tab': {\n onChange && onChange(e, false);\n e.preventDefault(); // prevents focusing on next element, because we will be handling it\n itemSearchStr.current = '';\n buttonRef.current?.focus();\n break;\n }\n case 'Home':\n case 'End':\n case 'ArrowDown':\n case 'ArrowUp':\n e.preventDefault();\n itemSearchStr.current = '';\n const allItems = scope ? scope.current.queryAllNodes(queryScope) : [];\n const currentIndex = allItems.findIndex((e) => e === navigationItem);\n if (allItems.length === 0) {\n return;\n }\n let nextIndex: number = currentIndex;\n switch (e.key) {\n case 'ArrowUp':\n nextIndex += -1;\n break;\n case 'ArrowDown':\n nextIndex += 1;\n break;\n case 'Home':\n nextIndex = 0;\n break;\n case 'End':\n nextIndex = -1;\n break;\n }\n // We already checked if allItems.length = 0 above\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n nextIndex = getCircularIndex(nextIndex, allItems.length)!;\n onNavigate && onNavigate(allItems[nextIndex]);\n break;\n default: {\n if (e.key.length === 1 && !e.ctrlKey && !e.altKey) {\n // A-Z\n e.preventDefault();\n\n if (\n itemSearchStr.current.length === 0 ||\n itemSearchStr.current.slice(-1) !== e.key\n ) {\n itemSearchStr.current = itemSearchStr.current + e.key;\n }\n clearTimeout(itemSearchClearTimeout.current as any);\n itemSearchClearTimeout.current = setTimeout(() => {\n itemSearchStr.current = '';\n }, 500);\n\n const allItems = scope\n ? scope.current.queryAllNodes(queryScope)\n : [];\n const currentIndex = allItems.findIndex(\n (e) => e === navigationItem\n );\n const searchStr = itemSearchStr.current;\n let nextIndex = -1;\n for (\n let i = searchStr.length === 1 ? 1 : 0;\n i < allItems.length;\n i++\n ) {\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n const idx = getCircularIndex(currentIndex + i, allItems.length)!;\n const dom = allItems[idx];\n const domText = dom.innerText.toLowerCase();\n if (domText.length > 0 && domText.startsWith(searchStr)) {\n nextIndex = idx;\n break;\n }\n }\n if (nextIndex >= 0 && nextIndex < allItems.length) {\n onNavigate && onNavigate(allItems[nextIndex]);\n }\n }\n }\n }\n }\n\n if (!open) {\n return null;\n }\n\n return (\n <MenuListProvider\n value={{\n navigationItem,\n onNavigate,\n }}\n >\n <Comp\n ref={assignMultipleRefs(forwardedRef, menuListRef)}\n id={menuListIdRef.current}\n role=\"menu\"\n aria-labelledby={buttonRef.current?.id}\n data-menu-list=\"\"\n tabIndex=\"-1\"\n onKeyDown={wrapEvent(onKeyDown, handleKeyDown)}\n {...otherProps}\n />\n </MenuListProvider>\n );\n }\n);\n"],"mappings":";;;;AACA,SACEA,UADF,EAEEC,SAFF,EAGEC,MAHF,EAIEC,QAJF,EAKEC,eALF,QAMO,OANP;AAQA,SAASC,cAAT,EAAyBC,gBAAzB,QAAiD,WAAjD;AACA,SAASC,kBAAT,QAAmC,qBAAnC;AACA,SAASC,iBAAT,QAAkC,4BAAlC;AACA,SAASC,QAAT,QAAyB,UAAzB;AACA,SAASC,UAAT,QAA2B,SAA3B;AACA,SAASC,gBAAT,EAA2BC,SAA3B,QAA4C,UAA5C;;AAEA,IAAMC,iBAAiB,GACrB,OAAOC,MAAP,KAAkB,WAAlB,GAAgCV,eAAhC,GAAkDH,SADpD;AASA,OAAO,IAAMc,QAAQ,gBAAGf,UAAU,CAChC,SAASe,QAAT,CAAkBC,KAAlB,EAAyBC,YAAzB,EAAuC;EAAA;;EACrC,gBAMID,KANJ,CACEE,EADF;EAAA,IACMC,IADN,0BACa,IADb;EAAA,IAEEC,SAFF,GAMIJ,KANJ,CAEEI,SAFF;EAAA,IAGMC,WAHN,GAMIL,KANJ,CAGEM,EAHF;EAAA,IAIEC,sBAJF,GAMIP,KANJ,CAIEO,sBAJF;EAAA,IAKKC,UALL,4BAMIR,KANJ;;EAQA,IAAMS,aAAa,GAAGvB,MAAM,CAAC,EAAD,CAA5B;EACA,IAAMwB,sBAAsB,GAAGxB,MAAM,EAArC;;EAEA,sBAOIG,cAAc,EAPlB;EAAA,IACEsB,aADF,mBACEA,aADF;EAAA,IAEEC,SAFF,mBAEEA,SAFF;EAAA,IAGEC,QAHF,mBAGEA,QAHF;EAAA,IAIEC,mBAJF,mBAIEA,mBAJF;EAAA,IAKEC,IALF,mBAKEA,IALF;EAAA,IAMEC,aANF,mBAMEA,aANF;;EASA,gBAA4C7B,QAAQ,EAApD;EAAA;EAAA,IAAO8B,cAAP;EAAA,IAAuBC,iBAAvB;;EAIA,iBAA8B/B,QAAQ,CAAC,KAAD,CAAtC;EAAA;EAAA,IAAOgC,OAAP;EAAA,IAAgBC,UAAhB;;EAEA,IAAMC,WAAW,GAAGnC,MAAM,EAA1B;EAEA,IAAMoC,KAAK,GAAG7B,QAAQ,CAAkC4B,WAAlC,CAAtB;;EAEA,IAAME,UAAU,GAAG,SAAbA,UAAa,CAACC,EAAD,EAAqB;IACtCA,EAAE,CAACC,KAAH;IACAP,iBAAiB,CAACM,EAAD,CAAjB;EACD,CAHD;;EAKAb,aAAa,CAACe,OAAd,GAAwBrB,WAAW,IAAIM,aAAa,CAACe,OAArD;EAEA7B,iBAAiB,CAAC,YAAM;IACtB,IAAI,CAACsB,OAAL,EAAc;MACZ,IAAMQ,QAAQ,GAAGL,KAAK,CAACI,OAAN,CAAcE,aAAd,CAA4BlC,UAA5B,CAAjB;MACA,IAAImC,KAAK,GAAGlC,gBAAgB,CAC1BmB,mBAAmB,CAACY,OAApB,KAAgC,SAAhC,GAA4C,CAAC,CAA7C,GAAiD,CADvB,EAE1BC,QAAQ,CAACG,MAFiB,CAA5B;;MAKA,IAAIvB,sBAAJ,EAA4B;QAC1B,KAAK,IAAIwB,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGJ,QAAQ,CAACG,MAA7B,EAAqCC,CAAC,EAAtC,EAA0C;UACxC,IAAIJ,QAAQ,CAACI,CAAD,CAAR,CAAYC,OAAZ,CAAoBC,KAApB,KAA8B1B,sBAAlC,EAA0D;YACxDsB,KAAK,GAAGE,CAAR;YACA;UACD;QACF;MACF;;MAED,IAAIF,KAAK,KAAK,IAAd,EAAoB;QAClBN,UAAU,IAAIA,UAAU,CAACI,QAAQ,CAACE,KAAD,CAAT,CAAxB;MACD;IACF;;IAEDf,mBAAmB,CAACY,OAApB,GAA8B,IAA9B;IACAN,UAAU,CAAC,IAAD,CAAV;EACD,CAxBgB,EAwBd,CACDD,OADC,EAEDF,cAFC,EAGDM,UAHC,EAIDT,mBAJC,EAKDQ,KALC,EAMDf,sBANC,CAxBc,CAAjB;EAiCAf,iBAAiB,CACf6B,WADe,EAEf,UAACa,CAAD,EAAO;IAAA;;IACLC,OAAO,CAACC,GAAR,CAAYpB,aAAa,CAACU,OAA1B;;IACA,IACEV,aAAa,CAACU,OAAd,IACCQ,CAAC,CAACG,MAAF,YAAoBC,WAApB,IACCJ,CAAC,CAACG,MAAF,KAAazB,SAAS,CAACc,OADxB,IAEC,wBAACd,SAAS,CAACc,OAAX,+CAAC,mBAAmBa,QAAnB,CAA4BL,CAAC,CAACG,MAA9B,CAAD,CAJJ,EAKE;MACAxB,QAAQ,IAAIA,QAAQ,CAACqB,CAAD,EAAW,KAAX,CAApB;IACD;;IACDA,CAAC,CAACM,cAAF;EACD,CAbc,EAcf,IAde,CAAjB;;EAiBA,SAASC,aAAT,CAAuBP,CAAvB,EAA2D;IACzD,QAAQA,CAAC,CAACQ,GAAV;MACE,KAAK,QAAL;MACA,KAAK,KAAL;QAAY;UAAA;;UACV7B,QAAQ,IAAIA,QAAQ,CAACqB,CAAD,EAAI,KAAJ,CAApB;UACAA,CAAC,CAACM,cAAF,GAFU,CAEU;;UACpB/B,aAAa,CAACiB,OAAd,GAAwB,EAAxB;UACA,uBAAAd,SAAS,CAACc,OAAV,4EAAmBD,KAAnB;UACA;QACD;;MACD,KAAK,MAAL;MACA,KAAK,KAAL;MACA,KAAK,WAAL;MACA,KAAK,SAAL;QACES,CAAC,CAACM,cAAF;QACA/B,aAAa,CAACiB,OAAd,GAAwB,EAAxB;QACA,IAAMC,QAAQ,GAAGL,KAAK,GAAGA,KAAK,CAACI,OAAN,CAAcE,aAAd,CAA4BlC,UAA5B,CAAH,GAA6C,EAAnE;QACA,IAAMiD,YAAY,GAAGhB,QAAQ,CAACiB,SAAT,CAAmB,UAACV,CAAD;UAAA,OAAOA,CAAC,KAAKjB,cAAb;QAAA,CAAnB,CAArB;;QACA,IAAIU,QAAQ,CAACG,MAAT,KAAoB,CAAxB,EAA2B;UACzB;QACD;;QACD,IAAIe,SAAiB,GAAGF,YAAxB;;QACA,QAAQT,CAAC,CAACQ,GAAV;UACE,KAAK,SAAL;YACEG,SAAS,IAAI,CAAC,CAAd;YACA;;UACF,KAAK,WAAL;YACEA,SAAS,IAAI,CAAb;YACA;;UACF,KAAK,MAAL;YACEA,SAAS,GAAG,CAAZ;YACA;;UACF,KAAK,KAAL;YACEA,SAAS,GAAG,CAAC,CAAb;YACA;QAZJ,CATF,CAuBE;QACA;;;QACAA,SAAS,GAAGlD,gBAAgB,CAACkD,SAAD,EAAYlB,QAAQ,CAACG,MAArB,CAA5B;QACAP,UAAU,IAAIA,UAAU,CAACI,QAAQ,CAACkB,SAAD,CAAT,CAAxB;QACA;;MACF;QAAS;UACP,IAAIX,CAAC,CAACQ,GAAF,CAAMZ,MAAN,KAAiB,CAAjB,IAAsB,CAACI,CAAC,CAACY,OAAzB,IAAoC,CAACZ,CAAC,CAACa,MAA3C,EAAmD;YACjD;YACAb,CAAC,CAACM,cAAF;;YAEA,IACE/B,aAAa,CAACiB,OAAd,CAAsBI,MAAtB,KAAiC,CAAjC,IACArB,aAAa,CAACiB,OAAd,CAAsBsB,KAAtB,CAA4B,CAAC,CAA7B,MAAoCd,CAAC,CAACQ,GAFxC,EAGE;cACAjC,aAAa,CAACiB,OAAd,GAAwBjB,aAAa,CAACiB,OAAd,GAAwBQ,CAAC,CAACQ,GAAlD;YACD;;YACDO,YAAY,CAACvC,sBAAsB,CAACgB,OAAxB,CAAZ;YACAhB,sBAAsB,CAACgB,OAAvB,GAAiCwB,UAAU,CAAC,YAAM;cAChDzC,aAAa,CAACiB,OAAd,GAAwB,EAAxB;YACD,CAF0C,EAExC,GAFwC,CAA3C;;YAIA,IAAMC,SAAQ,GAAGL,KAAK,GAClBA,KAAK,CAACI,OAAN,CAAcE,aAAd,CAA4BlC,UAA5B,CADkB,GAElB,EAFJ;;YAGA,IAAMiD,aAAY,GAAGhB,SAAQ,CAACiB,SAAT,CACnB,UAACV,CAAD;cAAA,OAAOA,CAAC,KAAKjB,cAAb;YAAA,CADmB,CAArB;;YAGA,IAAMkC,SAAS,GAAG1C,aAAa,CAACiB,OAAhC;;YACA,IAAImB,UAAS,GAAG,CAAC,CAAjB;;YACA,KACE,IAAId,CAAC,GAAGoB,SAAS,CAACrB,MAAV,KAAqB,CAArB,GAAyB,CAAzB,GAA6B,CADvC,EAEEC,CAAC,GAAGJ,SAAQ,CAACG,MAFf,EAGEC,CAAC,EAHH,EAIE;cACA;cACA,IAAMqB,GAAG,GAAGzD,gBAAgB,CAACgD,aAAY,GAAGZ,CAAhB,EAAmBJ,SAAQ,CAACG,MAA5B,CAA5B;cACA,IAAMuB,GAAG,GAAG1B,SAAQ,CAACyB,GAAD,CAApB;cACA,IAAME,OAAO,GAAGD,GAAG,CAACE,SAAJ,CAAcC,WAAd,EAAhB;;cACA,IAAIF,OAAO,CAACxB,MAAR,GAAiB,CAAjB,IAAsBwB,OAAO,CAACG,UAAR,CAAmBN,SAAnB,CAA1B,EAAyD;gBACvDN,UAAS,GAAGO,GAAZ;gBACA;cACD;YACF;;YACD,IAAIP,UAAS,IAAI,CAAb,IAAkBA,UAAS,GAAGlB,SAAQ,CAACG,MAA3C,EAAmD;cACjDP,UAAU,IAAIA,UAAU,CAACI,SAAQ,CAACkB,UAAD,CAAT,CAAxB;YACD;UACF;QACF;IAlFH;EAoFD;;EAED,IAAI,CAAC9B,IAAL,EAAW;IACT,OAAO,IAAP;EACD;;EAED,oBACE,KAAC,gBAAD;IACE,KAAK,EAAE;MACLE,cAAc,EAAdA,cADK;MAELM,UAAU,EAAVA;IAFK,CADT;IAAA,uBAME,KAAC,IAAD;MACE,GAAG,EAAEhC,kBAAkB,CAACU,YAAD,EAAeoB,WAAf,CADzB;MAEE,EAAE,EAAEV,aAAa,CAACe,OAFpB;MAGE,IAAI,EAAC,MAHP;MAIE,0CAAiBd,SAAS,CAACc,OAA3B,wDAAiB,oBAAmBpB,EAJtC;MAKE,kBAAe,EALjB;MAME,QAAQ,EAAC,IANX;MAOE,SAAS,EAAEV,SAAS,CAACQ,SAAD,EAAYqC,aAAZ;IAPtB,GAQMjC,UARN;EANF,EADF;AAmBD,CAvM+B,CAA3B"}
|
|
1
|
+
{"version":3,"file":"MenuList.js","names":["useCallback","forwardRef","useEffect","useRef","useState","useLayoutEffect","useMenuContext","MenuListProvider","assignMultipleRefs","useOnClickOutside","useScope","queryScope","getCircularIndex","wrapEvent","useEnhancedEffect","window","MenuList","props","forwardedRef","as","Comp","innerAs","onKeyDown","preferredId","id","defaultActiveItemValue","otherProps","interactedOutside","itemSearchStr","itemSearchClearTimeout","menuListIdRef","buttonRef","onChange","openWithArrowKeyRef","open","isContextMenu","navigationItem","setNavigationItem","mounted","setMounted","menuListRef","scope","onNavigate","el","focus","current","allItems","queryAllNodes","index","length","i","dataset","value","handleClickOutside","e","button","target","HTMLElement","contains","preventDefault","handleKeyDown","key","currentIndex","findIndex","nextIndex","ctrlKey","altKey","slice","clearTimeout","setTimeout","searchStr","idx","dom","domText","innerText","toLowerCase","startsWith"],"sources":["../../../src/Menu/MenuList.tsx"],"sourcesContent":["import type { HTMLAttributes, ElementType, KeyboardEvent } from 'react';\nimport {\n useCallback,\n forwardRef,\n useEffect,\n useRef,\n useState,\n useLayoutEffect,\n} from 'react';\n\nimport { useMenuContext, MenuListProvider } from './context';\nimport { assignMultipleRefs } from '../utils/assign-ref';\nimport { useOnClickOutside } from '../hooks/useOnClickOutside';\nimport { useScope } from '../hooks';\nimport { queryScope } from './scope';\nimport { getCircularIndex, wrapEvent } from '../utils';\n\nconst useEnhancedEffect =\n typeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\nexport interface MenuListProps extends HTMLAttributes<HTMLUListElement> {\n as?: ElementType<any>;\n innerAs?: ElementType<any>;\n defaultActiveItemValue?: string;\n}\n\nexport const MenuList = forwardRef<HTMLUListElement, MenuListProps>(\n function MenuList(props, forwardedRef) {\n const {\n as: Comp = 'ul',\n innerAs,\n onKeyDown,\n id: preferredId,\n defaultActiveItemValue,\n ...otherProps\n } = props;\n\n const interactedOutside = useRef(false);\n const itemSearchStr = useRef('');\n const itemSearchClearTimeout = useRef<ReturnType<typeof setTimeout>>();\n\n const {\n menuListIdRef,\n buttonRef,\n onChange,\n openWithArrowKeyRef,\n open,\n isContextMenu,\n } = useMenuContext();\n\n const [navigationItem, setNavigationItem] = useState<\n HTMLElement | undefined\n >();\n\n const [mounted, setMounted] = useState(false);\n\n const menuListRef = useRef<HTMLUListElement>();\n\n const scope = useScope<HTMLLIElement, HTMLUListElement>(menuListRef);\n\n const onNavigate = (el: HTMLElement) => {\n el.focus();\n setNavigationItem(el);\n };\n\n menuListIdRef.current = preferredId || menuListIdRef.current;\n\n useEnhancedEffect(() => {\n if (!mounted) {\n const allItems = scope.current.queryAllNodes(queryScope);\n let index = getCircularIndex(\n openWithArrowKeyRef.current === 'ArrowUp' ? -1 : 0,\n allItems.length\n );\n\n if (defaultActiveItemValue) {\n for (let i = 0; i < allItems.length; i++) {\n if (allItems[i].dataset.value === defaultActiveItemValue) {\n index = i;\n break;\n }\n }\n }\n\n if (index !== null) {\n onNavigate && onNavigate(allItems[index]);\n }\n }\n\n openWithArrowKeyRef.current = null;\n setMounted(true);\n }, [\n mounted,\n navigationItem,\n onNavigate,\n openWithArrowKeyRef,\n scope,\n defaultActiveItemValue,\n ]);\n\n const handleClickOutside = useCallback(\n (e: PointerEvent) => {\n if (!interactedOutside.current) {\n // First interaction should be ignored, because\n // this is what triggered the context menu to open\n interactedOutside.current = true;\n return;\n }\n\n if (isContextMenu.current) {\n if (e.button === 0) {\n onChange(e as any, false);\n }\n } else {\n if (\n e.target instanceof HTMLElement &&\n e.target !== buttonRef.current &&\n !buttonRef.current?.contains(e.target)\n ) {\n onChange(e as any, false);\n }\n }\n e.preventDefault();\n },\n [buttonRef, isContextMenu, onChange]\n );\n\n useOnClickOutside(menuListRef, handleClickOutside, open);\n\n function handleKeyDown(e: KeyboardEvent<HTMLUListElement>) {\n switch (e.key) {\n case 'Escape':\n case 'Tab': {\n onChange(e, false);\n e.preventDefault(); // prevents focusing on next element, because we will be handling it\n itemSearchStr.current = '';\n buttonRef.current?.focus();\n break;\n }\n case 'Home':\n case 'End':\n case 'ArrowDown':\n case 'ArrowUp':\n e.preventDefault();\n itemSearchStr.current = '';\n const allItems = scope ? scope.current.queryAllNodes(queryScope) : [];\n const currentIndex = allItems.findIndex((e) => e === navigationItem);\n if (allItems.length === 0) {\n return;\n }\n let nextIndex: number = currentIndex;\n switch (e.key) {\n case 'ArrowUp':\n nextIndex += -1;\n break;\n case 'ArrowDown':\n nextIndex += 1;\n break;\n case 'Home':\n nextIndex = 0;\n break;\n case 'End':\n nextIndex = -1;\n break;\n }\n // We already checked if allItems.length = 0 above\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n nextIndex = getCircularIndex(nextIndex, allItems.length)!;\n onNavigate && onNavigate(allItems[nextIndex]);\n break;\n default: {\n if (e.key.length === 1 && !e.ctrlKey && !e.altKey) {\n // A-Z\n e.preventDefault();\n\n if (\n itemSearchStr.current.length === 0 ||\n itemSearchStr.current.slice(-1) !== e.key\n ) {\n itemSearchStr.current = itemSearchStr.current + e.key;\n }\n clearTimeout(itemSearchClearTimeout.current as any);\n itemSearchClearTimeout.current = setTimeout(() => {\n itemSearchStr.current = '';\n }, 500);\n\n const allItems = scope\n ? scope.current.queryAllNodes(queryScope)\n : [];\n const currentIndex = allItems.findIndex(\n (e) => e === navigationItem\n );\n const searchStr = itemSearchStr.current;\n let nextIndex = -1;\n for (\n let i = searchStr.length === 1 ? 1 : 0;\n i < allItems.length;\n i++\n ) {\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n const idx = getCircularIndex(currentIndex + i, allItems.length)!;\n const dom = allItems[idx];\n const domText = dom.innerText.toLowerCase();\n if (domText.length > 0 && domText.startsWith(searchStr)) {\n nextIndex = idx;\n break;\n }\n }\n if (nextIndex >= 0 && nextIndex < allItems.length) {\n onNavigate && onNavigate(allItems[nextIndex]);\n }\n }\n }\n }\n }\n\n if (!open) {\n interactedOutside.current = false;\n return null;\n }\n\n return (\n <MenuListProvider\n value={{\n navigationItem,\n onNavigate,\n }}\n >\n <Comp\n ref={assignMultipleRefs(forwardedRef, menuListRef)}\n as={innerAs}\n id={menuListIdRef.current}\n role=\"menu\"\n aria-labelledby={buttonRef.current?.id}\n data-menu-list=\"\"\n tabIndex=\"-1\"\n onKeyDown={wrapEvent(onKeyDown, handleKeyDown)}\n {...otherProps}\n />\n </MenuListProvider>\n );\n }\n);\n"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
-
var _excluded = ["as"];
|
|
3
|
+
var _excluded = ["as", "innerAs"];
|
|
4
4
|
import { forwardRef } from 'react';
|
|
5
5
|
import { Popper } from '../Popper';
|
|
6
6
|
import { useMenuContext } from './context';
|
|
@@ -8,6 +8,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
8
8
|
export var MenuPopover = /*#__PURE__*/forwardRef(function MenuPopover(props, forwardedRef) {
|
|
9
9
|
var _props$as = props.as,
|
|
10
10
|
as = _props$as === void 0 ? 'div' : _props$as,
|
|
11
|
+
innerAs = props.innerAs,
|
|
11
12
|
otherProps = _objectWithoutProperties(props, _excluded);
|
|
12
13
|
|
|
13
14
|
var _useMenuContext = useMenuContext(),
|
|
@@ -22,6 +23,7 @@ export var MenuPopover = /*#__PURE__*/forwardRef(function MenuPopover(props, for
|
|
|
22
23
|
|
|
23
24
|
return /*#__PURE__*/_jsx(Popper, _extends({
|
|
24
25
|
as: as,
|
|
26
|
+
innerAs: innerAs,
|
|
25
27
|
ref: forwardedRef,
|
|
26
28
|
anchorEl: buttonRef,
|
|
27
29
|
offsetFn: offsetFn,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuPopover.js","names":["forwardRef","Popper","useMenuContext","MenuPopover","props","forwardedRef","as","otherProps","buttonRef","open","offsetFn","isContextMenu","current","undefined"],"sources":["../../../src/Menu/MenuPopover.tsx"],"sourcesContent":["import type { ElementType, ReactNode } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { PopperProps } from '../Popper';\nimport { Popper } from '../Popper';\nimport { useMenuContext } from './context';\n\nexport interface MenuPopoverProps extends Omit<PopperProps, 'anchorEl'> {\n as?: ElementType<any>;\n innerAs?: ElementType<any>;\n children?: ReactNode;\n}\n\nexport const MenuPopover = forwardRef<HTMLDivElement, MenuPopoverProps>(\n function MenuPopover(props, forwardedRef) {\n const { as = 'div', ...otherProps } = props;\n const { buttonRef, open, offsetFn, isContextMenu } = useMenuContext();\n\n if (!open) {\n return null;\n }\n\n return (\n <Popper\n as={as}\n ref={forwardedRef}\n anchorEl={buttonRef}\n offsetFn={offsetFn}\n placement={isContextMenu.current ? 'bottom-start' : undefined}\n {...otherProps}\n />\n );\n }\n);\n"],"mappings":";;;AACA,SAASA,UAAT,QAA2B,OAA3B;AAGA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,cAAT,QAA+B,WAA/B;;AAQA,OAAO,IAAMC,WAAW,gBAAGH,UAAU,CACnC,SAASG,WAAT,CAAqBC,KAArB,EAA4BC,YAA5B,EAA0C;EACxC,
|
|
1
|
+
{"version":3,"file":"MenuPopover.js","names":["forwardRef","Popper","useMenuContext","MenuPopover","props","forwardedRef","as","innerAs","otherProps","buttonRef","open","offsetFn","isContextMenu","current","undefined"],"sources":["../../../src/Menu/MenuPopover.tsx"],"sourcesContent":["import type { ElementType, ReactNode } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { PopperProps } from '../Popper';\nimport { Popper } from '../Popper';\nimport { useMenuContext } from './context';\n\nexport interface MenuPopoverProps extends Omit<PopperProps, 'anchorEl'> {\n as?: ElementType<any>;\n innerAs?: ElementType<any>;\n children?: ReactNode;\n}\n\nexport const MenuPopover = forwardRef<HTMLDivElement, MenuPopoverProps>(\n function MenuPopover(props, forwardedRef) {\n const { as = 'div', innerAs, ...otherProps } = props;\n const { buttonRef, open, offsetFn, isContextMenu } = useMenuContext();\n\n if (!open) {\n return null;\n }\n\n return (\n <Popper\n as={as}\n innerAs={innerAs}\n ref={forwardedRef}\n anchorEl={buttonRef}\n offsetFn={offsetFn}\n placement={isContextMenu.current ? 'bottom-start' : undefined}\n {...otherProps}\n />\n );\n }\n);\n"],"mappings":";;;AACA,SAASA,UAAT,QAA2B,OAA3B;AAGA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,cAAT,QAA+B,WAA/B;;AAQA,OAAO,IAAMC,WAAW,gBAAGH,UAAU,CACnC,SAASG,WAAT,CAAqBC,KAArB,EAA4BC,YAA5B,EAA0C;EACxC,gBAA+CD,KAA/C,CAAQE,EAAR;EAAA,IAAQA,EAAR,0BAAa,KAAb;EAAA,IAAoBC,OAApB,GAA+CH,KAA/C,CAAoBG,OAApB;EAAA,IAAgCC,UAAhC,4BAA+CJ,KAA/C;;EACA,sBAAqDF,cAAc,EAAnE;EAAA,IAAQO,SAAR,mBAAQA,SAAR;EAAA,IAAmBC,IAAnB,mBAAmBA,IAAnB;EAAA,IAAyBC,QAAzB,mBAAyBA,QAAzB;EAAA,IAAmCC,aAAnC,mBAAmCA,aAAnC;;EAEA,IAAI,CAACF,IAAL,EAAW;IACT,OAAO,IAAP;EACD;;EAED,oBACE,KAAC,MAAD;IACE,EAAE,EAAEJ,EADN;IAEE,OAAO,EAAEC,OAFX;IAGE,GAAG,EAAEF,YAHP;IAIE,QAAQ,EAAEI,SAJZ;IAKE,QAAQ,EAAEE,QALZ;IAME,SAAS,EAAEC,aAAa,CAACC,OAAd,GAAwB,cAAxB,GAAyCC;EANtD,GAOMN,UAPN,EADF;AAWD,CApBkC,CAA9B"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { OffsetsFunction } from '@popperjs/core/lib/modifiers/offset';
|
|
2
|
-
import type { KeyboardEvent, MouseEvent, MutableRefObject, PointerEvent } from 'react';
|
|
2
|
+
import type { Dispatch, KeyboardEvent, MouseEvent, MutableRefObject, PointerEvent, SetStateAction } from 'react';
|
|
3
3
|
export declare type ItemObject = {
|
|
4
4
|
text: string;
|
|
5
5
|
value: any;
|
|
@@ -9,10 +9,10 @@ export interface MenuContextProps {
|
|
|
9
9
|
buttonRef: MutableRefObject<HTMLElement | null>;
|
|
10
10
|
menuListIdRef: MutableRefObject<undefined | string>;
|
|
11
11
|
openWithArrowKeyRef: MutableRefObject<string | null>;
|
|
12
|
-
onChange
|
|
12
|
+
onChange: (e: KeyboardEvent<HTMLElement> | MouseEvent<HTMLElement> | PointerEvent<HTMLElement>, isOpen: boolean) => void;
|
|
13
13
|
open: boolean;
|
|
14
|
-
|
|
15
|
-
|
|
14
|
+
offsetFn: OffsetsFunction | undefined;
|
|
15
|
+
setOffsetFn: Dispatch<SetStateAction<OffsetsFunction | undefined>>;
|
|
16
16
|
isContextMenu: MutableRefObject<boolean>;
|
|
17
17
|
}
|
|
18
18
|
export declare const MenuProvider: import("react").Provider<MenuContextProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"context.js","names":["createContext","useContext","menuContext","MenuProvider","Provider","useMenuContext","menuListContext","MenuListProvider","useMenuListContext"],"sources":["../../../src/Menu/context.ts"],"sourcesContent":["import type { OffsetsFunction } from '@popperjs/core/lib/modifiers/offset';\nimport type {\n KeyboardEvent,\n MouseEvent,\n MutableRefObject,\n PointerEvent,\n} from 'react';\nimport { createContext, useContext } from 'react';\n\nexport type ItemObject = { text: string; value: any; id: string | undefined };\n\n// MenuRoot\nexport interface MenuContextProps {\n buttonRef: MutableRefObject<HTMLElement | null>;\n menuListIdRef: MutableRefObject<undefined | string>;\n openWithArrowKeyRef: MutableRefObject<string | null>;\n onChange
|
|
1
|
+
{"version":3,"file":"context.js","names":["createContext","useContext","menuContext","MenuProvider","Provider","useMenuContext","menuListContext","MenuListProvider","useMenuListContext"],"sources":["../../../src/Menu/context.ts"],"sourcesContent":["import type { OffsetsFunction } from '@popperjs/core/lib/modifiers/offset';\nimport type {\n Dispatch,\n KeyboardEvent,\n MouseEvent,\n MutableRefObject,\n PointerEvent,\n SetStateAction,\n} from 'react';\nimport { createContext, useContext } from 'react';\n\nexport type ItemObject = { text: string; value: any; id: string | undefined };\n\n// MenuRoot\nexport interface MenuContextProps {\n buttonRef: MutableRefObject<HTMLElement | null>;\n menuListIdRef: MutableRefObject<undefined | string>;\n openWithArrowKeyRef: MutableRefObject<string | null>;\n onChange: (\n e:\n | KeyboardEvent<HTMLElement>\n | MouseEvent<HTMLElement>\n | PointerEvent<HTMLElement>,\n isOpen: boolean\n ) => void;\n open: boolean;\n offsetFn: OffsetsFunction | undefined;\n setOffsetFn: Dispatch<SetStateAction<OffsetsFunction | undefined>>;\n isContextMenu: MutableRefObject<boolean>;\n}\n\nconst menuContext = createContext<MenuContextProps>(null as any);\nexport const { Provider: MenuProvider } = menuContext;\nexport const useMenuContext = () => useContext(menuContext);\n\n// MenuList\nexport interface MenuListContextProps {\n navigationItem: HTMLElement | undefined;\n onNavigate: undefined | ((idx: HTMLElement) => void);\n}\n\nconst menuListContext = createContext<MenuListContextProps>(null as any);\nexport const MenuListProvider = menuListContext.Provider;\nexport const useMenuListContext = () => useContext(menuListContext);\n"],"mappings":"AASA,SAASA,aAAT,EAAwBC,UAAxB,QAA0C,OAA1C;AAsBA,IAAMC,WAAW,gBAAGF,aAAa,CAAmB,IAAnB,CAAjC;AACO,IAAkBG,YAAlB,GAAmCD,WAAnC,CAAQE,QAAR;;AACP,OAAO,IAAMC,cAAc,GAAG,SAAjBA,cAAiB;EAAA,OAAMJ,UAAU,CAACC,WAAD,CAAhB;AAAA,CAAvB,C,CAEP;;AAMA,IAAMI,eAAe,gBAAGN,aAAa,CAAuB,IAAvB,CAArC;AACA,OAAO,IAAMO,gBAAgB,GAAGD,eAAe,CAACF,QAAzC;AACP,OAAO,IAAMI,kBAAkB,GAAG,SAArBA,kBAAqB;EAAA,OAAMP,UAAU,CAACK,eAAD,CAAhB;AAAA,CAA3B"}
|