@accelint/design-system 1.1.5 → 1.1.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/button/button.css.d.ts +25 -24
- package/dist/components/button/index.d.ts +9 -40
- package/dist/components/button/index.js +23 -17
- package/dist/components/button/index.js.map +1 -1
- package/dist/components/button/types.d.ts +3 -2
- package/dist/components/checkbox/checkbox.css.d.ts +23 -23
- package/dist/components/chip/chip.css.d.ts +18 -18
- package/dist/components/collection/index.d.ts +2 -2
- package/dist/components/collection/index.js.map +1 -1
- package/dist/components/combo-box/combo-box.css.d.ts +9 -9
- package/dist/components/date-field/date-field.css.d.ts +17 -17
- package/dist/components/date-input/date-input.css.d.ts +25 -25
- package/dist/components/date-input/index.js +4 -1
- package/dist/components/date-input/index.js.map +1 -1
- package/dist/components/dialog/dialog.css.d.ts +16 -15
- package/dist/components/dialog/index.d.ts +1 -0
- package/dist/components/dialog/types.d.ts +1 -0
- package/dist/components/drawer/drawer.css.d.ts +17 -17
- package/dist/components/drawer/index.d.ts +1 -1
- package/dist/components/drawer/types.d.ts +1 -1
- package/dist/components/group/group.css.d.ts +7 -7
- package/dist/components/icon/icon.css.d.ts +9 -9
- package/dist/components/index.d.ts +2 -2
- package/dist/components/input/input.css.d.ts +20 -20
- package/dist/components/menu/index.d.ts +2 -2
- package/dist/components/menu/index.js +1 -1
- package/dist/components/menu/index.js.map +1 -1
- package/dist/components/menu/menu.css.d.ts +42 -42
- package/dist/components/merge-provider/index.js +15 -7
- package/dist/components/merge-provider/index.js.map +1 -1
- package/dist/components/number-field/index.d.ts +1 -1
- package/dist/components/number-field/number-field.css.d.ts +12 -12
- package/dist/components/number-field/types.d.ts +1 -1
- package/dist/components/options/index.js +1 -1
- package/dist/components/options/index.js.map +1 -1
- package/dist/components/options/options.css.d.ts +44 -44
- package/dist/components/picker/index.js.map +1 -1
- package/dist/components/picker/picker.css.d.ts +18 -18
- package/dist/components/popover/popover.css.d.ts +12 -12
- package/dist/components/query-builder/query-builder.css.d.ts +53 -53
- package/dist/components/radio/radio.css.d.ts +22 -22
- package/dist/components/search-field/search-field.css.d.ts +9 -9
- package/dist/components/select/select.css.d.ts +12 -12
- package/dist/components/slider/slider.css.d.ts +27 -27
- package/dist/components/switch/switch.css.d.ts +16 -16
- package/dist/components/tabs/tabs.css.d.ts +25 -25
- package/dist/components/text-field/index.d.ts +3 -128
- package/dist/components/text-field/index.js +3 -3
- package/dist/components/text-field/index.js.map +1 -1
- package/dist/components/text-field/text-field.css.d.ts +8 -8
- package/dist/components/textarea/textarea.css.d.ts +22 -22
- package/dist/components/time-field/time-field.css.d.ts +17 -17
- package/dist/components/tooltip/tooltip.css.d.ts +11 -11
- package/dist/components/tree/index.js +5 -2
- package/dist/components/tree/index.js.map +1 -1
- package/dist/components/tree/tree.css.d.ts +45 -45
- package/dist/hooks/index.d.ts +11 -11
- package/dist/hooks/use-collection-render/index.d.ts +1 -1
- package/dist/hooks/use-collection-render/index.js +2 -3
- package/dist/hooks/use-collection-render/index.js.map +1 -1
- package/dist/hooks/use-context-props/index.js.map +1 -1
- package/dist/hooks/use-defaults/index.d.ts +32 -80
- package/dist/hooks/use-defaults/index.js +1 -4
- package/dist/hooks/use-defaults/index.js.map +1 -1
- package/dist/hooks/use-defaults/types.d.ts +1 -1
- package/dist/hooks/use-theme/index.d.ts +1 -1
- package/dist/hooks/use-theme/types.d.ts +1 -1
- package/dist/hooks/use-tree/index.js +3 -2
- package/dist/hooks/use-tree/index.js.map +1 -1
- package/dist/hooks/use-tree/utils.js +6 -9
- package/dist/hooks/use-tree/utils.js.map +1 -1
- package/dist/hooks/use-update-effect/index.js.map +1 -1
- package/dist/index.css +32 -32
- package/dist/index.d.ts +5 -5
- package/dist/ladle/actions.js.map +1 -1
- package/dist/styles/theme.css.d.ts +200 -200
- package/dist/test/setup.js +646 -1387
- package/dist/test/setup.js.map +1 -1
- package/dist/utils/css/index.d.ts +1 -1
- package/dist/utils/props/index.d.ts +1 -2
- package/dist/utils/props/index.js.map +1 -1
- package/package.json +27 -27
|
@@ -4,41 +4,42 @@ import 'react-aria-components';
|
|
|
4
4
|
import '../../types/props.js';
|
|
5
5
|
import '../../types/react-aria.js';
|
|
6
6
|
import '../button/types.js';
|
|
7
|
+
import '../../types/generic.js';
|
|
7
8
|
import '../icon/types.js';
|
|
8
9
|
import '../group/types.js';
|
|
9
10
|
import '@react-types/shared';
|
|
10
11
|
|
|
11
12
|
declare const dialogContainer: string;
|
|
12
13
|
declare const dialogColorVars: {
|
|
13
|
-
overlay: `var(--${string})`;
|
|
14
|
+
overlay: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
14
15
|
content: {
|
|
15
|
-
color: `var(--${string})`;
|
|
16
|
+
color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
16
17
|
};
|
|
17
18
|
};
|
|
18
19
|
declare const dialogSpaceVars: {
|
|
19
|
-
width: `var(--${string})`;
|
|
20
|
-
x: `var(--${string})`;
|
|
21
|
-
y: `var(--${string})`;
|
|
20
|
+
width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
21
|
+
x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
22
|
+
y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
22
23
|
gap: {
|
|
23
|
-
default: `var(--${string})`;
|
|
24
|
+
default: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
24
25
|
header: {
|
|
25
|
-
after: `var(--${string})`;
|
|
26
|
+
after: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
26
27
|
};
|
|
27
28
|
content: {
|
|
28
|
-
before: `var(--${string})`;
|
|
29
|
+
before: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
29
30
|
};
|
|
30
31
|
footer: {
|
|
31
|
-
before: `var(--${string})`;
|
|
32
|
+
before: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
32
33
|
};
|
|
33
34
|
};
|
|
34
35
|
};
|
|
35
36
|
declare const dialogStateVars: {
|
|
36
|
-
hasHeader: `var(--${string})`;
|
|
37
|
-
size: `var(--${string})`;
|
|
38
|
-
isEntering: `var(--${string})`;
|
|
39
|
-
isExiting: `var(--${string})`;
|
|
40
|
-
isGlobal: `var(--${string})`;
|
|
41
|
-
isOpen: `var(--${string})`;
|
|
37
|
+
hasHeader: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
38
|
+
size: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
39
|
+
isEntering: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
40
|
+
isExiting: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
41
|
+
isGlobal: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
42
|
+
isOpen: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
42
43
|
};
|
|
43
44
|
declare const dialogClassNames: DialogClassNames;
|
|
44
45
|
|
|
@@ -5,6 +5,7 @@ import { RenderPropsChildren } from '../../types/react-aria.js';
|
|
|
5
5
|
import { DialogRenderProps, DialogMapping, DialogSizes, DialogProps } from './types.js';
|
|
6
6
|
import '../../types/props.js';
|
|
7
7
|
import '../button/types.js';
|
|
8
|
+
import '../../types/generic.js';
|
|
8
9
|
import '../icon/types.js';
|
|
9
10
|
import '../group/types.js';
|
|
10
11
|
import '@react-types/shared';
|
|
@@ -4,6 +4,7 @@ import { OmitProtectedProps } from '../../types/props.js';
|
|
|
4
4
|
import { RenderPropsChildren } from '../../types/react-aria.js';
|
|
5
5
|
import { ButtonProps } from '../button/types.js';
|
|
6
6
|
import { GroupProps } from '../group/types.js';
|
|
7
|
+
import '../../types/generic.js';
|
|
7
8
|
import '../icon/types.js';
|
|
8
9
|
import '@react-types/shared';
|
|
9
10
|
|
|
@@ -8,40 +8,40 @@ import '../../types/props.js';
|
|
|
8
8
|
import '../../types/react-aria.js';
|
|
9
9
|
import '../button/types.js';
|
|
10
10
|
import 'react-aria-components';
|
|
11
|
+
import '../../types/generic.js';
|
|
11
12
|
import '../icon/types.js';
|
|
12
13
|
import '../tabs/types.js';
|
|
13
|
-
import '../../types/generic.js';
|
|
14
14
|
|
|
15
15
|
declare const drawerContainer: string;
|
|
16
16
|
declare const drawerAnimationVars: {
|
|
17
|
-
delay: `var(--${string})`;
|
|
18
|
-
duration: `var(--${string})`;
|
|
19
|
-
easing: `var(--${string})`;
|
|
17
|
+
delay: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
18
|
+
duration: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
19
|
+
easing: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
20
20
|
};
|
|
21
21
|
declare const drawerColorVars: {
|
|
22
|
-
background: `var(--${string})`;
|
|
23
|
-
color: `var(--${string})`;
|
|
22
|
+
background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
23
|
+
color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
24
24
|
};
|
|
25
25
|
declare const drawerSpaceVars: {
|
|
26
26
|
drawer: {
|
|
27
|
-
width: `var(--${string})`;
|
|
28
|
-
gap: `var(--${string})`;
|
|
29
|
-
x: `var(--${string})`;
|
|
30
|
-
y: `var(--${string})`;
|
|
27
|
+
width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
28
|
+
gap: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
29
|
+
x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
30
|
+
y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
31
31
|
};
|
|
32
32
|
list: {
|
|
33
|
-
top: `var(--${string})`;
|
|
34
|
-
translateY: `var(--${string})`;
|
|
33
|
+
top: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
34
|
+
translateY: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
35
35
|
};
|
|
36
36
|
};
|
|
37
37
|
declare const drawerStateVars: {
|
|
38
|
-
anchor: `var(--${string})`;
|
|
39
|
-
layoutShift: `var(--${string})`;
|
|
40
|
-
isChild: `var(--${string})`;
|
|
41
|
-
isOpen: `var(--${string})`;
|
|
38
|
+
anchor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
39
|
+
layoutShift: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
40
|
+
isChild: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
41
|
+
isOpen: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
42
42
|
};
|
|
43
43
|
declare const drawerDialogStateVars: {
|
|
44
|
-
isChild: `var(--${string})`;
|
|
44
|
+
isChild: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
45
45
|
};
|
|
46
46
|
declare const drawerClassNames: DrawerClassNames;
|
|
47
47
|
|
|
@@ -9,9 +9,9 @@ import 'type-fest';
|
|
|
9
9
|
import '../../types/props.js';
|
|
10
10
|
import '../../types/react-aria.js';
|
|
11
11
|
import '../button/types.js';
|
|
12
|
+
import '../../types/generic.js';
|
|
12
13
|
import '../icon/types.js';
|
|
13
14
|
import '../tabs/types.js';
|
|
14
|
-
import '../../types/generic.js';
|
|
15
15
|
|
|
16
16
|
declare function Drawer(props: DrawerProps): react_jsx_runtime.JSX.Element;
|
|
17
17
|
declare function DrawerTabList<T extends object>(props: DrawerTabListProps<T>): react_jsx_runtime.JSX.Element;
|
|
@@ -8,8 +8,8 @@ import { RenderPropsChildren } from '../../types/react-aria.js';
|
|
|
8
8
|
import { ButtonClassNames, ButtonProps } from '../button/types.js';
|
|
9
9
|
import { TabsProps, TabsClassNames, TabProps, TabRenderProps, TabListProps } from '../tabs/types.js';
|
|
10
10
|
import 'react-aria-components';
|
|
11
|
-
import '../icon/types.js';
|
|
12
11
|
import '../../types/generic.js';
|
|
12
|
+
import '../icon/types.js';
|
|
13
13
|
|
|
14
14
|
type DrawerClassNames = PartialDeep<{
|
|
15
15
|
container: string;
|
|
@@ -5,15 +5,15 @@ import 'react-aria-components';
|
|
|
5
5
|
|
|
6
6
|
declare const groupContainer: string;
|
|
7
7
|
declare const groupSpaceVars: {
|
|
8
|
-
gap: `var(--${string})`;
|
|
9
|
-
x: `var(--${string})`;
|
|
10
|
-
y: `var(--${string})`;
|
|
8
|
+
gap: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
9
|
+
x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
10
|
+
y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
11
11
|
};
|
|
12
12
|
declare const groupStateVars: {
|
|
13
|
-
count: `var(--${string})`;
|
|
14
|
-
orientation: `var(--${string})`;
|
|
15
|
-
reverse: `var(--${string})`;
|
|
16
|
-
type: `var(--${string})`;
|
|
13
|
+
count: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
14
|
+
orientation: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
15
|
+
reverse: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
16
|
+
type: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
17
17
|
};
|
|
18
18
|
declare const groupClassNames: GroupClassNames;
|
|
19
19
|
|
|
@@ -4,19 +4,19 @@ import 'react-aria-components';
|
|
|
4
4
|
|
|
5
5
|
declare const iconContainer: string;
|
|
6
6
|
declare const iconColorVars: {
|
|
7
|
-
color: `var(--${string})`;
|
|
8
|
-
fill: `var(--${string})`;
|
|
9
|
-
stroke: `var(--${string})`;
|
|
7
|
+
color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
8
|
+
fill: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
9
|
+
stroke: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
10
10
|
};
|
|
11
11
|
declare const iconSpaceVars: {
|
|
12
|
-
width: `var(--${string})`;
|
|
13
|
-
height: `var(--${string})`;
|
|
12
|
+
width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
13
|
+
height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
14
14
|
};
|
|
15
15
|
declare const iconStateVars: {
|
|
16
|
-
color: `var(--${string})`;
|
|
17
|
-
fill: `var(--${string})`;
|
|
18
|
-
size: `var(--${string})`;
|
|
19
|
-
stroke: `var(--${string})`;
|
|
16
|
+
color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
17
|
+
fill: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
18
|
+
size: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
19
|
+
stroke: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
20
20
|
};
|
|
21
21
|
declare const iconClassNames: IconClassNames;
|
|
22
22
|
|
|
@@ -92,15 +92,15 @@ export { TooltipClassNames, TooltipMapping, TooltipProps, TooltipRenderProps, To
|
|
|
92
92
|
export { TreeClassNames, TreeGroupProps, TreeGroupRenderProps, TreeGroupState, TreeIndicatorRenderProps, TreeIndicatorState, TreeItemProps, TreeItemRenderProps, TreeItemState, TreeMapping, TreeProps, TreeRenderProps, TreeSizes, TreeState, TreeStateContextValue } from './tree/types.js';
|
|
93
93
|
import 'react';
|
|
94
94
|
import 'react-aria-components';
|
|
95
|
-
import '../types/react-aria.js';
|
|
96
95
|
import '@react-types/shared';
|
|
96
|
+
import '../types/react-aria.js';
|
|
97
97
|
import 'react/jsx-runtime';
|
|
98
98
|
import '@react-stately/datepicker';
|
|
99
99
|
import 'react-querybuilder';
|
|
100
100
|
import 'type-fest';
|
|
101
101
|
import '@react-aria/datepicker';
|
|
102
|
-
import '../types/props.js';
|
|
103
102
|
import '../types/generic.js';
|
|
103
|
+
import '../types/props.js';
|
|
104
104
|
import '@react-aria/overlays';
|
|
105
105
|
import '@react-stately/overlays';
|
|
106
106
|
import '../types/use-tree.js';
|
|
@@ -4,30 +4,30 @@ import '../../types/generic.js';
|
|
|
4
4
|
|
|
5
5
|
declare const inputContainer: string;
|
|
6
6
|
declare const inputColorVars: {
|
|
7
|
-
background: `var(--${string})`;
|
|
8
|
-
border: `var(--${string})`;
|
|
9
|
-
color: `var(--${string})`;
|
|
7
|
+
background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
8
|
+
border: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
9
|
+
color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
10
10
|
};
|
|
11
11
|
declare const inputSpaceVars: {
|
|
12
|
-
minWidth: `var(--${string})`;
|
|
13
|
-
width: `var(--${string})`;
|
|
14
|
-
maxWidth: `var(--${string})`;
|
|
15
|
-
x: `var(--${string})`;
|
|
16
|
-
y: `var(--${string})`;
|
|
12
|
+
minWidth: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
13
|
+
width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
14
|
+
maxWidth: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
15
|
+
x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
16
|
+
y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
17
17
|
};
|
|
18
18
|
declare const inputStateVars: {
|
|
19
|
-
length: `var(--${string})`;
|
|
20
|
-
size: `var(--${string})`;
|
|
21
|
-
type: `var(--${string})`;
|
|
22
|
-
isDisabled: `var(--${string})`;
|
|
23
|
-
isEmpty: `var(--${string})`;
|
|
24
|
-
isFocused: `var(--${string})`;
|
|
25
|
-
isFocusVisible: `var(--${string})`;
|
|
26
|
-
isHovered: `var(--${string})`;
|
|
27
|
-
isInvalid: `var(--${string})`;
|
|
28
|
-
isPlaceholder: `var(--${string})`;
|
|
29
|
-
isReadOnly: `var(--${string})`;
|
|
30
|
-
isRequired: `var(--${string})`;
|
|
19
|
+
length: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
20
|
+
size: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
21
|
+
type: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
22
|
+
isDisabled: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
23
|
+
isEmpty: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
24
|
+
isFocused: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
25
|
+
isFocusVisible: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
26
|
+
isHovered: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
27
|
+
isInvalid: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
28
|
+
isPlaceholder: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
29
|
+
isReadOnly: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
30
|
+
isRequired: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
31
31
|
};
|
|
32
32
|
declare const inputClassNames: InputClassNames;
|
|
33
33
|
|
|
@@ -16,13 +16,13 @@ declare const Menu: (props: Omit<react_aria_components.PopoverProps, "className"
|
|
|
16
16
|
mapping?: Partial<MenuMapping>;
|
|
17
17
|
size?: MenuSizes;
|
|
18
18
|
} & react.RefAttributes<HTMLElement>) => react.ReactElement | null;
|
|
19
|
-
declare const MenuListContext: react.Context<ContextValue<MenuListProps<
|
|
19
|
+
declare const MenuListContext: react.Context<ContextValue<MenuListProps<object>, HTMLDivElement>>;
|
|
20
20
|
declare const MenuList: <T extends object>(props: Omit<react_aria_components.MenuProps<T>, "className" | "style"> & {
|
|
21
21
|
classNames?: MenuClassNames;
|
|
22
22
|
mapping?: Partial<MenuMapping>;
|
|
23
23
|
size?: MenuSizes;
|
|
24
24
|
} & react.RefAttributes<HTMLDivElement>) => react.ReactElement | null;
|
|
25
|
-
declare const MenuItemContext: react.Context<ContextValue<MenuItemProps<
|
|
25
|
+
declare const MenuItemContext: react.Context<ContextValue<MenuItemProps<object>, HTMLDivElement>>;
|
|
26
26
|
declare const MenuItem: <T extends object>(props: Omit<react_aria_components.MenuItemProps<T>, "className" | "style"> & {
|
|
27
27
|
classNames?: MenuClassNames;
|
|
28
28
|
mapping?: Partial<MenuMapping>;
|
|
@@ -138,7 +138,7 @@ var MenuList = forwardRef(function MenuList2(props, ref) {
|
|
|
138
138
|
return /* @__PURE__ */ jsx(AriaMenuSection, { className: classNames?.list?.list, children: typeof childrenProp === "function" ? /* @__PURE__ */ jsx(Collection, { items, children: childrenProp }) : childrenProp });
|
|
139
139
|
}, [childrenProp, classNames?.list?.list, items]);
|
|
140
140
|
const renderer = useMemo(
|
|
141
|
-
// @ts-expect-error
|
|
141
|
+
// @ts-expect-error Type '{ readonly collection: Collection<Node<object>>; }' is missing the following properties from type 'TreeState<any>': disabledKeys, expandedKeys, toggleKey, setExpandedKeys, selectionManager ts
|
|
142
142
|
() => createCollectionRenderer(MenuStateContext, values),
|
|
143
143
|
[values]
|
|
144
144
|
);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/menu/index.tsx"],"names":["Menu","MenuList","RACMenu","MenuItem","RACMenuItem"],"mappings":";;;;;;;;;;;;;;;;AAiEA,IAAM,cAAA,GAA8B;AAAA,EAClC,WAAA,EAAa;AAAA,IACX,IAAI,MAAA,CAAO,EAAA;AAAA,IACX,IAAI,MAAA,CAAO;AAAA,GACb;AAAA,EACA,MAAA,EAAQ;AAAA,IACN,IAAI,QAAA,CAAS,EAAA;AAAA,IACb,IAAI,QAAA,CAAS;AAAA,GACf;AAAA,EACA,KAAA,EAAO;AAAA,IACL,IAAI,MAAA,CAAO,EAAA;AAAA,IACX,IAAI,MAAA,CAAO;AAAA,GACb;AAAA,EACA,QAAA,EAAU;AAAA,IACR,IAAI,MAAA,CAAO,EAAA;AAAA,IACX,IAAI,MAAA,CAAO;AAAA;AAEf,CAAA;AAEA,IAAM,WAAA,GAAc,IAAA;AAEb,IAAM,WAAA,GACX,cAAoD,IAAI;AAMnD,IAAM,IAAA,GAAO,UAAA,CAAW,SAASA,KAAAA,CACtC,OACA,GAAA,EACA;AACA,EAAA,MAAM,CAAC,WAAA,EAAa,SAAS,IAAI,eAAA,CAAgB,KAAA,EAAO,KAAK,WAAW,CAAA;AACxE,EAAA,MAAM,UAAA,GAAa,eAAA,CAAgB,WAAA,EAAa,MAAM,CAAA;AAEtD,EAAA,MAAM;AAAA,IACJ,QAAA,EAAU,YAAA;AAAA,IACV,UAAA,EAAY,cAAA;AAAA,IACZ,OAAA,EAAS,WAAA;AAAA,IACT,IAAA,GAAO,WAAA;AAAA,IACP,GAAG;AAAA,GACL,GAAI,UAAA;AAEJ,EAAA,MAAM,QAAQ,QAAA,EAAS;AAEvB,EAAA,MAAM,UAAA,GAAa,OAAA;AAAA,IACjB,MACE,eAAA,CAAgB,cAAA,EAAgB,cAAA,EAAgB,MAAM,IAAA,EAAM;AAAA,MAC1D,IAAA,EAAM,EAAE,SAAA,EAAW,KAAA,CAAM,SAAA;AAAU;AAAA,KACpC,CAAA;AAAA,IACH,CAAC,cAAA,EAAgB,KAAA,CAAM,IAAA,EAAM,MAAM,SAAS;AAAA,GAC9C;AAEA,EAAA,MAAM,OAAA,GAAU,OAAA;AAAA,IACd,OAAO;AAAA,MACL,GAAG,cAAA;AAAA,MACH,GAAG;AAAA,KACL,CAAA;AAAA,IACA,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,MAAM,KAAA,GAAQ,WAAA;AAAA,IACZ,CAAC,WAAA,MAAqC;AAAA,MACpC,GAAG,KAAA,CAAM,KAAA;AAAA;AAAA,MACT,GAAG,WAAW,aAAA,EAAe;AAAA,QAC3B,GAAG,WAAA;AAAA,QACH;AAAA,OACD;AAAA,KACH,CAAA;AAAA,IACA,CAAC,KAAA,CAAM,KAAA,EAAO,IAAI;AAAA,GACpB;AAEA,EAAA,MAAM,MAAA,GAAS,OAAA;AAAA,IAQb,MAAM,CAAC,CAAC,eAAA,EAAiB,EAAE,UAAA,EAAY,OAAA,EAAS,IAAA,EAAM,CAAC,CAAA;AAAA,IACvD,CAAC,UAAA,EAAY,OAAA,EAAS,IAAI;AAAA,GAC5B;AAEA,EAAA,MAAM,QAAA,GAAW,WAAA;AAAA,IACf,CAAC,WAAA,qBACC,GAAA,CAAC,QAAA,EAAA,EAAS,MAAA,EACR,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,UAAA,EAAY,IAAA,EAAM,IAAA,EAC/B,QAAA,EAAA,eAAA,CAAgB,YAAA,EAAc;AAAA,MAC7B,GAAG,WAAA;AAAA,MACH,IAAA;AAAA,MACA,eAAA,EAAiB;AAAA,KAClB,GACH,CAAA,EACF,CAAA;AAAA,IAEF,CAAC,YAAA,EAAc,UAAA,EAAY,IAAA,EAAM,IAAA,EAAM,MAAM,MAAM;AAAA,GACrD;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,GAAA,EAAK,SAAA;AAAA,MACL,SAAA,EAAW,YAAY,IAAA,EAAM,SAAA;AAAA,MAC7B,KAAA;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ,CAAC;AAEM,IAAM,eAAA,GACX,cAAoE,IAAI;AAkBnE,IAAM,QAAA,GAAW,UAAA,CAAW,SAASC,SAAAA,CAC1C,OACA,GAAA,EACA;AACA,EAAA,MAAM,CAAC,WAAA,EAAa,SAAS,IAAI,eAAA,CAAgB,KAAA,EAAO,KAAK,eAAe,CAAA;AAC5E,EAAA,MAAM,UAAA,GAAa,eAAA,CAAgB,WAAA,EAAa,MAAM,CAAA;AAEtD,EAAA,MAAM;AAAA,IACJ,QAAA,EAAU,YAAA;AAAA,IACV,UAAA,EAAY,cAAA;AAAA,IACZ,KAAA;AAAA,IACA,OAAA,EAAS,WAAA;AAAA,IACT,aAAA,GAAgB,QAAA;AAAA,IAChB,IAAA,GAAO,WAAA;AAAA,IACP,YAAA,EAAc,SAAA;AAAA,IACd,iBAAA,EAAmB,cAAA;AAAA,IACnB,GAAG;AAAA,GACL,GAAI,UAAA;AAEJ,EAAA,MAAM,QAAQ,QAAA,EAAS;AAEvB,EAAA,MAAM,OAAA,GAAU,OAAA;AAAA,IACd,OAAO;AAAA,MACL,GAAG,cAAA;AAAA,MACH,GAAG;AAAA,KACL,CAAA;AAAA,IACA,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,MAAM,UAAA,GAAa,OAAA;AAAA,IACjB,MACE,eAAA,CAAgB,cAAA,EAAgB,KAAA,CAAM,MAAM,cAAA,EAAgB;AAAA,MAC1D,MAAM,EAAE,MAAA,EAAQ,OAAA,CAAQ,MAAA,CAAO,IAAI,CAAA;AAAE,KACtC,CAAA;AAAA,IACH,CAAC,KAAA,CAAM,IAAA,EAAM,cAAA,EAAgB,OAAA,CAAQ,QAAQ,IAAI;AAAA,GACnD;AAEA,EAAA,MAAM,MAAA,GAAS,OAAA;AAAA,IACb,MAAM;AAAA,MACJ,CAAC,eAAA,EAAiB,EAAE,UAAA,EAAY,OAAA,EAAS,MAAM,CAAA;AAAA,MAC/C,CAAC,sBAAA,EAAwB,EAAE,WAAW,UAAA,EAAY,IAAA,EAAM,SAAS,CAAA;AAAA,MACjE,CAAC,iBAAA,EAAmB,EAAE,WAAW,UAAA,EAAY,IAAA,EAAM,QAAQ,CAAA;AAAA,MAC3D,CAAC,oBAAA,EAAsB,EAAE,WAAW,UAAA,EAAY,IAAA,EAAM,WAAW;AAAA,KACnE;AAAA,IACA,CAAC,UAAA,EAAY,OAAA,EAAS,IAAI;AAAA,GAC5B;AAEA,EAAA,MAAM,QAAA,GAAW,QAAQ,MAAM;AAC7B,IAAA,IAAI,EAAE,gBAAgB,KAAA,CAAA,EAAQ;AAC5B,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,uBACE,GAAA,CAAC,eAAA,EAAA,EAAgB,SAAA,EAAW,UAAA,EAAY,MAAM,IAAA,EAC3C,QAAA,EAAA,OAAO,YAAA,KAAiB,UAAA,mBACvB,GAAA,CAAC,UAAA,EAAA,EAAW,KAAA,EAAe,QAAA,EAAA,YAAA,EAAa,IAExC,YAAA,EAEJ,CAAA;AAAA,EAEJ,GAAG,CAAC,YAAA,EAAc,YAAY,IAAA,EAAM,IAAA,EAAM,KAAK,CAAC,CAAA;AAEhD,EAAA,MAAM,QAAA,GAAW,OAAA;AAAA;AAAA,IAEf,MAAM,wBAAA,CAAyB,gBAAA,EAAkB,MAAM,CAAA;AAAA,IACvD,CAAC,MAAM;AAAA,GACT;AAEA,EAAA,uBACE,GAAA,CAAC,0BAA0B,QAAA,EAA1B,EAAmC,OAAO,QAAA,EACzC,QAAA,kBAAA,GAAA,CAAC,YAAS,MAAA,EACR,QAAA,kBAAA,GAAA;AAAA,IAACC,MAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,GAAA,EAAK,SAAA;AAAA,MACL,SAAA,EAAW,YAAY,IAAA,EAAM,SAAA;AAAA,MAC7B,KAAA;AAAA,MACA,aAAA;AAAA,MACA,YAAA,EAAY,SAAA;AAAA,MACZ,iBAAA,EAAiB,cAAA;AAAA,MAEhB;AAAA;AAAA,KAEL,CAAA,EACF,CAAA;AAEJ,CAAC;AAEM,IAAM,eAAA,GACX,cAAoE,IAAI;AAEnE,IAAM,QAAA,GAAW,UAAA,CAAW,SAASC,SAAAA,CAC1C,OACA,GAAA,EACA;AACA,EAAA,MAAM,CAAC,WAAA,EAAa,SAAS,IAAI,eAAA,CAAgB,KAAA,EAAO,KAAK,eAAe,CAAA;AAC5E,EAAA,MAAM,UAAA,GAAa,eAAA,CAAgB,WAAA,EAAa,UAAU,CAAA;AAE1D,EAAA,MAAM;AAAA,IACJ,EAAA;AAAA,IACA,QAAA,EAAU,YAAA;AAAA,IACV,UAAA,EAAY,cAAA;AAAA,IACZ,OAAA,EAAS,WAAA;AAAA,IACT,IAAA,GAAO,WAAA;AAAA,IACP,SAAA,GAAY,OAAO,YAAA,KAAiB,QAAA,GAAW,YAAA,GAAe,MAAA;AAAA,IAC9D,GAAG;AAAA,GACL,GAAI,UAAA;AAEJ,EAAA,MAAM,QAAQ,QAAA,EAAS;AAEvB,EAAA,MAAM,OAAA,GAAU,OAAA;AAAA,IACd,OAAO;AAAA,MACL,GAAG,cAAA;AAAA,MACH,GAAG;AAAA,KACL,CAAA;AAAA,IACA,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,MAAM,UAAA,GAAa,OAAA;AAAA,IACjB,MACE,eAAA,CAAgB,cAAA,EAAgB,cAAA,EAAgB,MAAM,IAAA,EAAM;AAAA,MAC1D,IAAA,EAAM;AAAA,QACJ,WAAA,EAAa,OAAA,CAAQ,WAAA,CAAY,IAAI,CAAA;AAAA,QACrC,KAAA,EAAO,OAAA,CAAQ,KAAA,CAAM,IAAI,CAAA;AAAA,QACzB,QAAA,EAAU,OAAA,CAAQ,QAAA,CAAS,IAAI;AAAA;AACjC,KACD,CAAA;AAAA,IACH,CAAC,KAAA,CAAM,IAAA,EAAM,cAAA,EAAgB,SAAS,IAAI;AAAA,GAC5C;AAEA,EAAA,MAAM,CAAC,cAAA,EAAgB,cAAc,CAAA,GAAI,OAAA,EAAQ;AAEjD,EAAA,MAAM,KAAA,GAAQ,WAAA;AAAA,IACZ,CAAC,gBACC,UAAA,CAAW,iBAAA,EAAmB,EAAE,GAAG,WAAA,EAAa,IAAA,EAAM,cAAA,EAAgB,CAAA;AAAA,IACxE,CAAC,gBAAgB,IAAI;AAAA,GACvB;AAEA,EAAA,MAAM,MAAA,GAAS,OAAA;AAAA,IAUb,MAAM;AAAA,MACJ;AAAA,QACE,eAAA;AAAA,QACA;AAAA,UACE,KAAA,EAAO;AAAA,YACL,CAAC,YAAY,GAAG,EAAC;AAAA,YACjB,KAAA,EAAO,EAAE,SAAA,EAAW,UAAA,EAAY,MAAM,KAAA,EAAM;AAAA,YAC5C,WAAA,EAAa;AAAA,cACX,GAAA,EAAK,cAAA;AAAA,cACL,SAAA,EAAW,YAAY,IAAA,EAAM;AAAA;AAC/B;AACF;AACF,OACF;AAAA,MACA;AAAA,QACE,WAAA;AAAA,QACA;AAAA,UACE,KAAA,EAAO;AAAA,YACL,CAAC,YAAY,GAAG,EAAE,UAAA,EAAY,UAAA,EAAY,MAAM,IAAA,EAAK;AAAA,YACrD,IAAA,EAAM,EAAE,UAAA,EAAY,UAAA,EAAY,MAAM,IAAA;AAAK;AAC7C;AACF,OACF;AAAA,MACA,CAAC,mBAAA,EAAqB,EAAE,WAAW,UAAA,EAAY,IAAA,EAAM,UAAU;AAAA,KACjE;AAAA,IACA;AAAA,MACE,YAAY,IAAA,EAAM,KAAA;AAAA,MAClB,cAAA;AAAA,MACA,YAAY,IAAA,EAAM,WAAA;AAAA,MAClB,YAAY,IAAA,EAAM,IAAA;AAAA,MAClB,YAAY,IAAA,EAAM,IAAA;AAAA,MAClB,YAAY,IAAA,EAAM;AAAA;AACpB,GACF;AAEA,EAAA,MAAM,QAAA,GAAW,WAAA;AAAA,IACf,CAAC,WAAA,KAAwC;AACvC,MAAA,MAAM,OAAA,GAAU,gBAAgB,YAAA,EAAc;AAAA,QAC5C,GAAG,WAAA;AAAA,QACH,IAAA;AAAA,QACA,eAAA,EAAiB;AAAA,OAClB,CAAA;AAED,MAAA,2BACG,QAAA,EAAA,EAAS,MAAA,EACR,8BAAC,KAAA,EAAA,EAAI,SAAA,EAAW,YAAY,IAAA,EAAM,IAAA,EAC/B,iBAAO,OAAA,KAAY,QAAA,uBACjB,QAAA,EAAA,EAAS,IAAA,EAAK,SAAS,QAAA,EAAA,OAAA,EAAQ,CAAA,GAEhC,SAEJ,CAAA,EACF,CAAA;AAAA,IAEJ,CAAA;AAAA,IACA,CAAC,YAAA,EAAc,UAAA,EAAY,IAAA,EAAM,IAAA,EAAM,MAAM,MAAM;AAAA,GACrD;AAEA,EAAA,uBACE,GAAA;AAAA,IAACC,UAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,IAAI,EAAA,IAAM,SAAA;AAAA,MACV,GAAA,EAAK,SAAA;AAAA,MACL,SAAA,EAAW,YAAY,IAAA,EAAM,SAAA;AAAA,MAC7B,KAAA;AAAA,MACA,SAAA;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ,CAAC","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n createContext,\n type ForwardedRef,\n forwardRef,\n type HTMLAttributes,\n type Ref,\n useCallback,\n useMemo,\n} from 'react';\nimport {\n Collection,\n type CollectionRenderer,\n CollectionRendererContext,\n type ContextValue,\n DEFAULT_SLOT,\n type MenuSectionProps,\n MenuStateContext,\n Popover,\n type PopoverRenderProps,\n Provider,\n Menu as RACMenu,\n MenuItem as RACMenuItem,\n type MenuItemRenderProps as RACMenuItemRenderProps,\n type SeparatorProps,\n type TextProps,\n} from 'react-aria-components';\nimport { useContextProps } from '../../hooks/use-context-props';\nimport { useDefaultProps } from '../../hooks/use-defaults';\nimport { useSlot } from '../../hooks/use-slot';\nimport { useTheme } from '../../hooks/use-theme';\nimport { bodies, headings } from '../../styles/typography.css';\nimport { inlineVars } from '../../utils/css';\nimport { callRenderProps, mergeClassNames } from '../../utils/props';\nimport {\n AriaHeaderContext,\n AriaKeyboardContext,\n AriaMenuSection,\n AriaMenuSectionContext,\n AriaSeparatorContext,\n AriaText,\n AriaTextContext,\n} from '../aria';\nimport { createCollectionRenderer } from '../collection';\nimport { IconContext } from '../icon';\nimport { menuClassNames, menuItemStateVars, menuStateVars } from './menu.css';\nimport type { IconProps } from '../icon/types';\nimport type {\n MenuItemProps,\n MenuListProps,\n MenuMapping,\n MenuProps,\n} from './types';\n\nconst defaultMapping: MenuMapping = {\n description: {\n sm: bodies.xs,\n lg: bodies.xs,\n },\n header: {\n sm: headings.v4,\n lg: headings.v5,\n },\n label: {\n sm: bodies.sm,\n lg: bodies.sm,\n },\n shortcut: {\n sm: bodies.xs,\n lg: bodies.xs,\n },\n};\n\nconst defaultSize = 'lg';\n\nexport const MenuContext =\n createContext<ContextValue<MenuProps, HTMLElement>>(null);\n\n/**\n * Menu component that supports display and selection of menu items via a trigger (right-click or click)\n * Customization of React Aria's Menu and Menu Item components https://react-spectrum.adobe.com/react-aria/Menu.html\n */\nexport const Menu = forwardRef(function Menu(\n props: MenuProps,\n ref: ForwardedRef<HTMLElement>,\n) {\n const [mergedProps, mergedRef] = useContextProps(props, ref, MenuContext);\n const finalProps = useDefaultProps(mergedProps, 'Menu');\n\n const {\n children: childrenProp,\n classNames: classNamesProp,\n mapping: mappingProp,\n size = defaultSize,\n ...rest\n } = finalProps;\n\n const theme = useTheme();\n\n const classNames = useMemo(\n () =>\n mergeClassNames(menuClassNames, classNamesProp, theme.Menu, {\n menu: { container: theme.className }, // required to consume global theme within Popover\n }),\n [classNamesProp, theme.Menu, theme.className],\n );\n\n const mapping = useMemo(\n () => ({\n ...defaultMapping,\n ...mappingProp,\n }),\n [mappingProp],\n );\n\n const style = useCallback(\n (renderProps: PopoverRenderProps) => ({\n ...theme.style, // required to consume global styles within Popover\n ...inlineVars(menuStateVars, {\n ...renderProps,\n size,\n }),\n }),\n [theme.style, size],\n );\n\n const values = useMemo<\n [\n [\n typeof MenuListContext,\n ContextValue<MenuListProps<unknown>, HTMLDivElement>,\n ],\n ]\n >(\n () => [[MenuListContext, { classNames, mapping, size }]],\n [classNames, mapping, size],\n );\n\n const children = useCallback(\n (renderProps: PopoverRenderProps) => (\n <Provider values={values}>\n <div className={classNames?.menu?.menu}>\n {callRenderProps(childrenProp, {\n ...renderProps,\n size,\n defaultChildren: null,\n })}\n </div>\n </Provider>\n ),\n [childrenProp, classNames?.menu?.menu, size, values],\n );\n\n return (\n <Popover\n {...rest}\n ref={mergedRef}\n className={classNames?.menu?.container}\n style={style}\n >\n {children}\n </Popover>\n );\n});\n\nexport const MenuListContext =\n createContext<ContextValue<MenuListProps<unknown>, HTMLDivElement>>(null);\n\ntype MenuListContexts = [\n [\n typeof MenuItemContext,\n ContextValue<MenuItemProps<unknown>, HTMLDivElement>,\n ],\n [\n typeof AriaMenuSectionContext,\n ContextValue<MenuSectionProps<object>, HTMLElement>,\n ],\n [\n typeof AriaHeaderContext,\n ContextValue<HTMLAttributes<HTMLElement>, HTMLElement>,\n ],\n [typeof AriaSeparatorContext, ContextValue<SeparatorProps, HTMLElement>],\n];\n\nexport const MenuList = forwardRef(function MenuList<T extends object>(\n props: MenuListProps<T>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const [mergedProps, mergedRef] = useContextProps(props, ref, MenuListContext);\n const finalProps = useDefaultProps(mergedProps, 'Menu');\n\n const {\n children: childrenProp,\n classNames: classNamesProp,\n items,\n mapping: mappingProp,\n selectionMode = 'single',\n size = defaultSize,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n ...rest\n } = finalProps;\n\n const theme = useTheme();\n\n const mapping = useMemo(\n () => ({\n ...defaultMapping,\n ...mappingProp,\n }),\n [mappingProp],\n );\n\n const classNames = useMemo(\n () =>\n mergeClassNames(menuClassNames, theme.Menu, classNamesProp, {\n list: { header: mapping.header[size] },\n }),\n [theme.Menu, classNamesProp, mapping.header, size],\n );\n\n const values = useMemo<MenuListContexts>(\n () => [\n [MenuItemContext, { classNames, mapping, size }],\n [AriaMenuSectionContext, { className: classNames?.list?.section }],\n [AriaHeaderContext, { className: classNames?.list?.header }],\n [AriaSeparatorContext, { className: classNames?.list?.separator }],\n ],\n [classNames, mapping, size],\n );\n\n const children = useMemo(() => {\n if (!(childrenProp || items)) {\n return null;\n }\n\n return (\n <AriaMenuSection className={classNames?.list?.list}>\n {typeof childrenProp === 'function' ? (\n <Collection items={items}>{childrenProp}</Collection>\n ) : (\n childrenProp\n )}\n </AriaMenuSection>\n );\n }, [childrenProp, classNames?.list?.list, items]);\n\n const renderer = useMemo<CollectionRenderer>(\n // @ts-expect-error ts unnecessarily guarding against null state\n () => createCollectionRenderer(MenuStateContext, values),\n [values],\n );\n\n return (\n <CollectionRendererContext.Provider value={renderer}>\n <Provider values={values}>\n <RACMenu<T>\n {...rest}\n ref={mergedRef}\n className={classNames?.list?.container}\n items={items}\n selectionMode={selectionMode}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n >\n {children}\n </RACMenu>\n </Provider>\n </CollectionRendererContext.Provider>\n );\n});\n\nexport const MenuItemContext =\n createContext<ContextValue<MenuItemProps<unknown>, HTMLDivElement>>(null);\n\nexport const MenuItem = forwardRef(function MenuItem<T extends object>(\n props: MenuItemProps<T>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const [mergedProps, mergedRef] = useContextProps(props, ref, MenuItemContext);\n const finalProps = useDefaultProps(mergedProps, 'MenuItem');\n\n const {\n id,\n children: childrenProp,\n classNames: classNamesProp,\n mapping: mappingProp,\n size = defaultSize,\n textValue = typeof childrenProp === 'string' ? childrenProp : undefined,\n ...rest\n } = finalProps;\n\n const theme = useTheme();\n\n const mapping = useMemo(\n () => ({\n ...defaultMapping,\n ...mappingProp,\n }),\n [mappingProp],\n );\n\n const classNames = useMemo(\n () =>\n mergeClassNames(menuClassNames, classNamesProp, theme.Menu, {\n item: {\n description: mapping.description[size],\n label: mapping.label[size],\n shortcut: mapping.shortcut[size],\n },\n }),\n [theme.Menu, classNamesProp, mapping, size],\n );\n\n const [descriptionRef, hasDescription] = useSlot();\n\n const style = useCallback(\n (renderProps: RACMenuItemRenderProps) =>\n inlineVars(menuItemStateVars, { ...renderProps, size, hasDescription }),\n [hasDescription, size],\n );\n\n const values = useMemo<\n [\n [typeof AriaTextContext, ContextValue<TextProps, HTMLElement>],\n [typeof IconContext, ContextValue<IconProps, HTMLDivElement>],\n [\n typeof AriaKeyboardContext,\n ContextValue<HTMLAttributes<HTMLElement>, HTMLElement>,\n ],\n ]\n >(\n () => [\n [\n AriaTextContext,\n {\n slots: {\n [DEFAULT_SLOT]: {},\n label: { className: classNames?.item?.label },\n description: {\n ref: descriptionRef,\n className: classNames?.item?.description,\n },\n },\n },\n ],\n [\n IconContext,\n {\n slots: {\n [DEFAULT_SLOT]: { classNames: classNames?.item?.icon },\n more: { classNames: classNames?.item?.more },\n },\n },\n ],\n [AriaKeyboardContext, { className: classNames?.item?.shortcut }],\n ],\n [\n classNames?.item?.label,\n descriptionRef,\n classNames?.item?.description,\n classNames?.item?.icon,\n classNames?.item?.more,\n classNames?.item?.shortcut,\n ],\n );\n\n const children = useCallback(\n (renderProps: RACMenuItemRenderProps) => {\n const content = callRenderProps(childrenProp, {\n ...renderProps,\n size,\n defaultChildren: null,\n });\n\n return (\n <Provider values={values}>\n <div className={classNames?.item?.item}>\n {typeof content === 'string' ? (\n <AriaText slot='label'>{content}</AriaText>\n ) : (\n content\n )}\n </div>\n </Provider>\n );\n },\n [childrenProp, classNames?.item?.item, size, values],\n );\n\n return (\n <RACMenuItem<T>\n {...rest}\n id={id ?? textValue}\n ref={mergedRef as unknown as Ref<T>}\n className={classNames?.item?.container}\n style={style}\n textValue={textValue}\n >\n {children}\n </RACMenuItem>\n );\n});\n"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/menu/index.tsx"],"names":["Menu","MenuList","RACMenu","MenuItem","RACMenuItem"],"mappings":";;;;;;;;;;;;;;;;AAgEA,IAAM,cAAA,GAA8B;AAAA,EAClC,WAAA,EAAa;AAAA,IACX,IAAI,MAAA,CAAO,EAAA;AAAA,IACX,IAAI,MAAA,CAAO;AAAA,GACb;AAAA,EACA,MAAA,EAAQ;AAAA,IACN,IAAI,QAAA,CAAS,EAAA;AAAA,IACb,IAAI,QAAA,CAAS;AAAA,GACf;AAAA,EACA,KAAA,EAAO;AAAA,IACL,IAAI,MAAA,CAAO,EAAA;AAAA,IACX,IAAI,MAAA,CAAO;AAAA,GACb;AAAA,EACA,QAAA,EAAU;AAAA,IACR,IAAI,MAAA,CAAO,EAAA;AAAA,IACX,IAAI,MAAA,CAAO;AAAA;AAEf,CAAA;AAEA,IAAM,WAAA,GAAc,IAAA;AAEb,IAAM,WAAA,GACX,cAAoD,IAAI;AAMnD,IAAM,IAAA,GAAO,UAAA,CAAW,SAASA,KAAAA,CACtC,OACA,GAAA,EACA;AACA,EAAA,MAAM,CAAC,WAAA,EAAa,SAAS,IAAI,eAAA,CAAgB,KAAA,EAAO,KAAK,WAAW,CAAA;AACxE,EAAA,MAAM,UAAA,GAAa,eAAA,CAAgB,WAAA,EAAa,MAAM,CAAA;AAEtD,EAAA,MAAM;AAAA,IACJ,QAAA,EAAU,YAAA;AAAA,IACV,UAAA,EAAY,cAAA;AAAA,IACZ,OAAA,EAAS,WAAA;AAAA,IACT,IAAA,GAAO,WAAA;AAAA,IACP,GAAG;AAAA,GACL,GAAI,UAAA;AAEJ,EAAA,MAAM,QAAQ,QAAA,EAAS;AAEvB,EAAA,MAAM,UAAA,GAAa,OAAA;AAAA,IACjB,MACE,eAAA,CAAgB,cAAA,EAAgB,cAAA,EAAgB,MAAM,IAAA,EAAM;AAAA,MAC1D,IAAA,EAAM,EAAE,SAAA,EAAW,KAAA,CAAM,SAAA;AAAU;AAAA,KACpC,CAAA;AAAA,IACH,CAAC,cAAA,EAAgB,KAAA,CAAM,IAAA,EAAM,MAAM,SAAS;AAAA,GAC9C;AAEA,EAAA,MAAM,OAAA,GAAU,OAAA;AAAA,IACd,OAAO;AAAA,MACL,GAAG,cAAA;AAAA,MACH,GAAG;AAAA,KACL,CAAA;AAAA,IACA,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,MAAM,KAAA,GAAQ,WAAA;AAAA,IACZ,CAAC,WAAA,MAAqC;AAAA,MACpC,GAAG,KAAA,CAAM,KAAA;AAAA;AAAA,MACT,GAAG,WAAW,aAAA,EAAe;AAAA,QAC3B,GAAG,WAAA;AAAA,QACH;AAAA,OACD;AAAA,KACH,CAAA;AAAA,IACA,CAAC,KAAA,CAAM,KAAA,EAAO,IAAI;AAAA,GACpB;AAEA,EAAA,MAAM,MAAA,GAAS,OAAA;AAAA,IAQb,MAAM,CAAC,CAAC,eAAA,EAAiB,EAAE,UAAA,EAAY,OAAA,EAAS,IAAA,EAAM,CAAC,CAAA;AAAA,IACvD,CAAC,UAAA,EAAY,OAAA,EAAS,IAAI;AAAA,GAC5B;AAEA,EAAA,MAAM,QAAA,GAAW,WAAA;AAAA,IACf,CAAC,WAAA,qBACC,GAAA,CAAC,QAAA,EAAA,EAAS,MAAA,EACR,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,UAAA,EAAY,IAAA,EAAM,IAAA,EAC/B,QAAA,EAAA,eAAA,CAAgB,YAAA,EAAc;AAAA,MAC7B,GAAG,WAAA;AAAA,MACH,IAAA;AAAA,MACA,eAAA,EAAiB;AAAA,KAClB,GACH,CAAA,EACF,CAAA;AAAA,IAEF,CAAC,YAAA,EAAc,UAAA,EAAY,IAAA,EAAM,IAAA,EAAM,MAAM,MAAM;AAAA,GACrD;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,GAAA,EAAK,SAAA;AAAA,MACL,SAAA,EAAW,YAAY,IAAA,EAAM,SAAA;AAAA,MAC7B,KAAA;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ,CAAC;AAEM,IAAM,eAAA,GACX,cAAmE,IAAI;AAelE,IAAM,QAAA,GAAW,UAAA,CAAW,SAASC,SAAAA,CAC1C,OACA,GAAA,EACA;AACA,EAAA,MAAM,CAAC,WAAA,EAAa,SAAS,IAAI,eAAA,CAAgB,KAAA,EAAO,KAAK,eAAe,CAAA;AAC5E,EAAA,MAAM,UAAA,GAAa,eAAA,CAAgB,WAAA,EAAa,MAAM,CAAA;AAEtD,EAAA,MAAM;AAAA,IACJ,QAAA,EAAU,YAAA;AAAA,IACV,UAAA,EAAY,cAAA;AAAA,IACZ,KAAA;AAAA,IACA,OAAA,EAAS,WAAA;AAAA,IACT,aAAA,GAAgB,QAAA;AAAA,IAChB,IAAA,GAAO,WAAA;AAAA,IACP,YAAA,EAAc,SAAA;AAAA,IACd,iBAAA,EAAmB,cAAA;AAAA,IACnB,GAAG;AAAA,GACL,GAAI,UAAA;AAEJ,EAAA,MAAM,QAAQ,QAAA,EAAS;AAEvB,EAAA,MAAM,OAAA,GAAU,OAAA;AAAA,IACd,OAAO;AAAA,MACL,GAAG,cAAA;AAAA,MACH,GAAG;AAAA,KACL,CAAA;AAAA,IACA,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,MAAM,UAAA,GAAa,OAAA;AAAA,IACjB,MACE,eAAA,CAAgB,cAAA,EAAgB,KAAA,CAAM,MAAM,cAAA,EAAgB;AAAA,MAC1D,MAAM,EAAE,MAAA,EAAQ,OAAA,CAAQ,MAAA,CAAO,IAAI,CAAA;AAAE,KACtC,CAAA;AAAA,IACH,CAAC,KAAA,CAAM,IAAA,EAAM,cAAA,EAAgB,OAAA,CAAQ,QAAQ,IAAI;AAAA,GACnD;AAEA,EAAA,MAAM,MAAA,GAAS,OAAA;AAAA,IACb,MAAM;AAAA,MACJ,CAAC,eAAA,EAAiB,EAAE,UAAA,EAAY,OAAA,EAAS,MAAM,CAAA;AAAA,MAC/C,CAAC,sBAAA,EAAwB,EAAE,WAAW,UAAA,EAAY,IAAA,EAAM,SAAS,CAAA;AAAA,MACjE,CAAC,iBAAA,EAAmB,EAAE,WAAW,UAAA,EAAY,IAAA,EAAM,QAAQ,CAAA;AAAA,MAC3D,CAAC,oBAAA,EAAsB,EAAE,WAAW,UAAA,EAAY,IAAA,EAAM,WAAW;AAAA,KACnE;AAAA,IACA,CAAC,UAAA,EAAY,OAAA,EAAS,IAAI;AAAA,GAC5B;AAEA,EAAA,MAAM,QAAA,GAAW,QAAQ,MAAM;AAC7B,IAAA,IAAI,EAAE,gBAAgB,KAAA,CAAA,EAAQ;AAC5B,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,uBACE,GAAA,CAAC,eAAA,EAAA,EAAgB,SAAA,EAAW,UAAA,EAAY,MAAM,IAAA,EAC3C,QAAA,EAAA,OAAO,YAAA,KAAiB,UAAA,mBACvB,GAAA,CAAC,UAAA,EAAA,EAAW,KAAA,EAAe,QAAA,EAAA,YAAA,EAAa,IAExC,YAAA,EAEJ,CAAA;AAAA,EAEJ,GAAG,CAAC,YAAA,EAAc,YAAY,IAAA,EAAM,IAAA,EAAM,KAAK,CAAC,CAAA;AAEhD,EAAA,MAAM,QAAA,GAAW,OAAA;AAAA;AAAA,IAEf,MAAM,wBAAA,CAAyB,gBAAA,EAAkB,MAAM,CAAA;AAAA,IACvD,CAAC,MAAM;AAAA,GACT;AAEA,EAAA,uBACE,GAAA,CAAC,0BAA0B,QAAA,EAA1B,EAAmC,OAAO,QAAA,EACzC,QAAA,kBAAA,GAAA,CAAC,YAAS,MAAA,EACR,QAAA,kBAAA,GAAA;AAAA,IAACC,MAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,GAAA,EAAK,SAAA;AAAA,MACL,SAAA,EAAW,YAAY,IAAA,EAAM,SAAA;AAAA,MAC7B,KAAA;AAAA,MACA,aAAA;AAAA,MACA,YAAA,EAAY,SAAA;AAAA,MACZ,iBAAA,EAAiB,cAAA;AAAA,MAEhB;AAAA;AAAA,KAEL,CAAA,EACF,CAAA;AAEJ,CAAC;AAEM,IAAM,eAAA,GACX,cAAmE,IAAI;AAElE,IAAM,QAAA,GAAW,UAAA,CAAW,SAASC,SAAAA,CAC1C,OACA,GAAA,EACA;AACA,EAAA,MAAM,CAAC,WAAA,EAAa,SAAS,IAAI,eAAA,CAAgB,KAAA,EAAO,KAAK,eAAe,CAAA;AAC5E,EAAA,MAAM,UAAA,GAAa,eAAA,CAAgB,WAAA,EAAa,UAAU,CAAA;AAE1D,EAAA,MAAM;AAAA,IACJ,EAAA;AAAA,IACA,QAAA,EAAU,YAAA;AAAA,IACV,UAAA,EAAY,cAAA;AAAA,IACZ,OAAA,EAAS,WAAA;AAAA,IACT,IAAA,GAAO,WAAA;AAAA,IACP,SAAA,GAAY,OAAO,YAAA,KAAiB,QAAA,GAAW,YAAA,GAAe,MAAA;AAAA,IAC9D,GAAG;AAAA,GACL,GAAI,UAAA;AAEJ,EAAA,MAAM,QAAQ,QAAA,EAAS;AAEvB,EAAA,MAAM,OAAA,GAAU,OAAA;AAAA,IACd,OAAO;AAAA,MACL,GAAG,cAAA;AAAA,MACH,GAAG;AAAA,KACL,CAAA;AAAA,IACA,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,MAAM,UAAA,GAAa,OAAA;AAAA,IACjB,MACE,eAAA,CAAgB,cAAA,EAAgB,cAAA,EAAgB,MAAM,IAAA,EAAM;AAAA,MAC1D,IAAA,EAAM;AAAA,QACJ,WAAA,EAAa,OAAA,CAAQ,WAAA,CAAY,IAAI,CAAA;AAAA,QACrC,KAAA,EAAO,OAAA,CAAQ,KAAA,CAAM,IAAI,CAAA;AAAA,QACzB,QAAA,EAAU,OAAA,CAAQ,QAAA,CAAS,IAAI;AAAA;AACjC,KACD,CAAA;AAAA,IACH,CAAC,KAAA,CAAM,IAAA,EAAM,cAAA,EAAgB,SAAS,IAAI;AAAA,GAC5C;AAEA,EAAA,MAAM,CAAC,cAAA,EAAgB,cAAc,CAAA,GAAI,OAAA,EAAQ;AAEjD,EAAA,MAAM,KAAA,GAAQ,WAAA;AAAA,IACZ,CAAC,gBACC,UAAA,CAAW,iBAAA,EAAmB,EAAE,GAAG,WAAA,EAAa,IAAA,EAAM,cAAA,EAAgB,CAAA;AAAA,IACxE,CAAC,gBAAgB,IAAI;AAAA,GACvB;AAEA,EAAA,MAAM,MAAA,GAAS,OAAA;AAAA,IAUb,MAAM;AAAA,MACJ;AAAA,QACE,eAAA;AAAA,QACA;AAAA,UACE,KAAA,EAAO;AAAA,YACL,CAAC,YAAY,GAAG,EAAC;AAAA,YACjB,KAAA,EAAO,EAAE,SAAA,EAAW,UAAA,EAAY,MAAM,KAAA,EAAM;AAAA,YAC5C,WAAA,EAAa;AAAA,cACX,GAAA,EAAK,cAAA;AAAA,cACL,SAAA,EAAW,YAAY,IAAA,EAAM;AAAA;AAC/B;AACF;AACF,OACF;AAAA,MACA;AAAA,QACE,WAAA;AAAA,QACA;AAAA,UACE,KAAA,EAAO;AAAA,YACL,CAAC,YAAY,GAAG,EAAE,UAAA,EAAY,UAAA,EAAY,MAAM,IAAA,EAAK;AAAA,YACrD,IAAA,EAAM,EAAE,UAAA,EAAY,UAAA,EAAY,MAAM,IAAA;AAAK;AAC7C;AACF,OACF;AAAA,MACA,CAAC,mBAAA,EAAqB,EAAE,WAAW,UAAA,EAAY,IAAA,EAAM,UAAU;AAAA,KACjE;AAAA,IACA;AAAA,MACE,YAAY,IAAA,EAAM,KAAA;AAAA,MAClB,cAAA;AAAA,MACA,YAAY,IAAA,EAAM,WAAA;AAAA,MAClB,YAAY,IAAA,EAAM,IAAA;AAAA,MAClB,YAAY,IAAA,EAAM,IAAA;AAAA,MAClB,YAAY,IAAA,EAAM;AAAA;AACpB,GACF;AAEA,EAAA,MAAM,QAAA,GAAW,WAAA;AAAA,IACf,CAAC,WAAA,KAAwC;AACvC,MAAA,MAAM,OAAA,GAAU,gBAAgB,YAAA,EAAc;AAAA,QAC5C,GAAG,WAAA;AAAA,QACH,IAAA;AAAA,QACA,eAAA,EAAiB;AAAA,OAClB,CAAA;AAED,MAAA,2BACG,QAAA,EAAA,EAAS,MAAA,EACR,8BAAC,KAAA,EAAA,EAAI,SAAA,EAAW,YAAY,IAAA,EAAM,IAAA,EAC/B,iBAAO,OAAA,KAAY,QAAA,uBACjB,QAAA,EAAA,EAAS,IAAA,EAAK,SAAS,QAAA,EAAA,OAAA,EAAQ,CAAA,GAEhC,SAEJ,CAAA,EACF,CAAA;AAAA,IAEJ,CAAA;AAAA,IACA,CAAC,YAAA,EAAc,UAAA,EAAY,IAAA,EAAM,IAAA,EAAM,MAAM,MAAM;AAAA,GACrD;AAEA,EAAA,uBACE,GAAA;AAAA,IAACC,UAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,IAAI,EAAA,IAAM,SAAA;AAAA,MACV,GAAA,EAAK,SAAA;AAAA,MACL,SAAA,EAAW,YAAY,IAAA,EAAM,SAAA;AAAA,MAC7B,KAAA;AAAA,MACA,SAAA;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ,CAAC","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n createContext,\n type ForwardedRef,\n forwardRef,\n type HTMLAttributes,\n useCallback,\n useMemo,\n} from 'react';\nimport {\n Collection,\n type CollectionRenderer,\n CollectionRendererContext,\n type ContextValue,\n DEFAULT_SLOT,\n type MenuSectionProps,\n MenuStateContext,\n Popover,\n type PopoverRenderProps,\n Provider,\n Menu as RACMenu,\n MenuItem as RACMenuItem,\n type MenuItemRenderProps as RACMenuItemRenderProps,\n type SeparatorProps,\n type TextProps,\n} from 'react-aria-components';\nimport { useContextProps } from '../../hooks/use-context-props';\nimport { useDefaultProps } from '../../hooks/use-defaults';\nimport { useSlot } from '../../hooks/use-slot';\nimport { useTheme } from '../../hooks/use-theme';\nimport { bodies, headings } from '../../styles/typography.css';\nimport { inlineVars } from '../../utils/css';\nimport { callRenderProps, mergeClassNames } from '../../utils/props';\nimport {\n AriaHeaderContext,\n AriaKeyboardContext,\n AriaMenuSection,\n AriaMenuSectionContext,\n AriaSeparatorContext,\n AriaText,\n AriaTextContext,\n} from '../aria';\nimport { createCollectionRenderer } from '../collection';\nimport { IconContext } from '../icon';\nimport { menuClassNames, menuItemStateVars, menuStateVars } from './menu.css';\nimport type { IconProps } from '../icon/types';\nimport type {\n MenuItemProps,\n MenuListProps,\n MenuMapping,\n MenuProps,\n} from './types';\n\nconst defaultMapping: MenuMapping = {\n description: {\n sm: bodies.xs,\n lg: bodies.xs,\n },\n header: {\n sm: headings.v4,\n lg: headings.v5,\n },\n label: {\n sm: bodies.sm,\n lg: bodies.sm,\n },\n shortcut: {\n sm: bodies.xs,\n lg: bodies.xs,\n },\n};\n\nconst defaultSize = 'lg';\n\nexport const MenuContext =\n createContext<ContextValue<MenuProps, HTMLElement>>(null);\n\n/**\n * Menu component that supports display and selection of menu items via a trigger (right-click or click)\n * Customization of React Aria's Menu and Menu Item components https://react-spectrum.adobe.com/react-aria/Menu.html\n */\nexport const Menu = forwardRef(function Menu(\n props: MenuProps,\n ref: ForwardedRef<HTMLElement>,\n) {\n const [mergedProps, mergedRef] = useContextProps(props, ref, MenuContext);\n const finalProps = useDefaultProps(mergedProps, 'Menu');\n\n const {\n children: childrenProp,\n classNames: classNamesProp,\n mapping: mappingProp,\n size = defaultSize,\n ...rest\n } = finalProps;\n\n const theme = useTheme();\n\n const classNames = useMemo(\n () =>\n mergeClassNames(menuClassNames, classNamesProp, theme.Menu, {\n menu: { container: theme.className }, // required to consume global theme within Popover\n }),\n [classNamesProp, theme.Menu, theme.className],\n );\n\n const mapping = useMemo(\n () => ({\n ...defaultMapping,\n ...mappingProp,\n }),\n [mappingProp],\n );\n\n const style = useCallback(\n (renderProps: PopoverRenderProps) => ({\n ...theme.style, // required to consume global styles within Popover\n ...inlineVars(menuStateVars, {\n ...renderProps,\n size,\n }),\n }),\n [theme.style, size],\n );\n\n const values = useMemo<\n [\n [\n typeof MenuListContext,\n ContextValue<MenuListProps<object>, HTMLDivElement>,\n ],\n ]\n >(\n () => [[MenuListContext, { classNames, mapping, size }]],\n [classNames, mapping, size],\n );\n\n const children = useCallback(\n (renderProps: PopoverRenderProps) => (\n <Provider values={values}>\n <div className={classNames?.menu?.menu}>\n {callRenderProps(childrenProp, {\n ...renderProps,\n size,\n defaultChildren: null,\n })}\n </div>\n </Provider>\n ),\n [childrenProp, classNames?.menu?.menu, size, values],\n );\n\n return (\n <Popover\n {...rest}\n ref={mergedRef}\n className={classNames?.menu?.container}\n style={style}\n >\n {children}\n </Popover>\n );\n});\n\nexport const MenuListContext =\n createContext<ContextValue<MenuListProps<object>, HTMLDivElement>>(null);\n\ntype MenuListContexts = [\n [typeof MenuItemContext, ContextValue<MenuItemProps<object>, HTMLDivElement>],\n [\n typeof AriaMenuSectionContext,\n ContextValue<MenuSectionProps<object>, HTMLElement>,\n ],\n [\n typeof AriaHeaderContext,\n ContextValue<HTMLAttributes<HTMLElement>, HTMLElement>,\n ],\n [typeof AriaSeparatorContext, ContextValue<SeparatorProps, HTMLElement>],\n];\n\nexport const MenuList = forwardRef(function MenuList<T extends object>(\n props: MenuListProps<T>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const [mergedProps, mergedRef] = useContextProps(props, ref, MenuListContext);\n const finalProps = useDefaultProps(mergedProps, 'Menu');\n\n const {\n children: childrenProp,\n classNames: classNamesProp,\n items,\n mapping: mappingProp,\n selectionMode = 'single',\n size = defaultSize,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n ...rest\n } = finalProps;\n\n const theme = useTheme();\n\n const mapping = useMemo(\n () => ({\n ...defaultMapping,\n ...mappingProp,\n }),\n [mappingProp],\n );\n\n const classNames = useMemo(\n () =>\n mergeClassNames(menuClassNames, theme.Menu, classNamesProp, {\n list: { header: mapping.header[size] },\n }),\n [theme.Menu, classNamesProp, mapping.header, size],\n );\n\n const values = useMemo<MenuListContexts>(\n () => [\n [MenuItemContext, { classNames, mapping, size }],\n [AriaMenuSectionContext, { className: classNames?.list?.section }],\n [AriaHeaderContext, { className: classNames?.list?.header }],\n [AriaSeparatorContext, { className: classNames?.list?.separator }],\n ],\n [classNames, mapping, size],\n );\n\n const children = useMemo(() => {\n if (!(childrenProp || items)) {\n return null;\n }\n\n return (\n <AriaMenuSection className={classNames?.list?.list}>\n {typeof childrenProp === 'function' ? (\n <Collection items={items}>{childrenProp}</Collection>\n ) : (\n childrenProp\n )}\n </AriaMenuSection>\n );\n }, [childrenProp, classNames?.list?.list, items]);\n\n const renderer = useMemo<CollectionRenderer>(\n // @ts-expect-error Type '{ readonly collection: Collection<Node<object>>; }' is missing the following properties from type 'TreeState<any>': disabledKeys, expandedKeys, toggleKey, setExpandedKeys, selectionManager ts\n () => createCollectionRenderer(MenuStateContext, values),\n [values],\n );\n\n return (\n <CollectionRendererContext.Provider value={renderer}>\n <Provider values={values}>\n <RACMenu<T>\n {...rest}\n ref={mergedRef}\n className={classNames?.list?.container}\n items={items}\n selectionMode={selectionMode}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n >\n {children}\n </RACMenu>\n </Provider>\n </CollectionRendererContext.Provider>\n );\n});\n\nexport const MenuItemContext =\n createContext<ContextValue<MenuItemProps<object>, HTMLDivElement>>(null);\n\nexport const MenuItem = forwardRef(function MenuItem<T extends object>(\n props: MenuItemProps<T>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const [mergedProps, mergedRef] = useContextProps(props, ref, MenuItemContext);\n const finalProps = useDefaultProps(mergedProps, 'MenuItem');\n\n const {\n id,\n children: childrenProp,\n classNames: classNamesProp,\n mapping: mappingProp,\n size = defaultSize,\n textValue = typeof childrenProp === 'string' ? childrenProp : undefined,\n ...rest\n } = finalProps;\n\n const theme = useTheme();\n\n const mapping = useMemo(\n () => ({\n ...defaultMapping,\n ...mappingProp,\n }),\n [mappingProp],\n );\n\n const classNames = useMemo(\n () =>\n mergeClassNames(menuClassNames, classNamesProp, theme.Menu, {\n item: {\n description: mapping.description[size],\n label: mapping.label[size],\n shortcut: mapping.shortcut[size],\n },\n }),\n [theme.Menu, classNamesProp, mapping, size],\n );\n\n const [descriptionRef, hasDescription] = useSlot();\n\n const style = useCallback(\n (renderProps: RACMenuItemRenderProps) =>\n inlineVars(menuItemStateVars, { ...renderProps, size, hasDescription }),\n [hasDescription, size],\n );\n\n const values = useMemo<\n [\n [typeof AriaTextContext, ContextValue<TextProps, HTMLElement>],\n [typeof IconContext, ContextValue<IconProps, HTMLDivElement>],\n [\n typeof AriaKeyboardContext,\n ContextValue<HTMLAttributes<HTMLElement>, HTMLElement>,\n ],\n ]\n >(\n () => [\n [\n AriaTextContext,\n {\n slots: {\n [DEFAULT_SLOT]: {},\n label: { className: classNames?.item?.label },\n description: {\n ref: descriptionRef,\n className: classNames?.item?.description,\n },\n },\n },\n ],\n [\n IconContext,\n {\n slots: {\n [DEFAULT_SLOT]: { classNames: classNames?.item?.icon },\n more: { classNames: classNames?.item?.more },\n },\n },\n ],\n [AriaKeyboardContext, { className: classNames?.item?.shortcut }],\n ],\n [\n classNames?.item?.label,\n descriptionRef,\n classNames?.item?.description,\n classNames?.item?.icon,\n classNames?.item?.more,\n classNames?.item?.shortcut,\n ],\n );\n\n const children = useCallback(\n (renderProps: RACMenuItemRenderProps) => {\n const content = callRenderProps(childrenProp, {\n ...renderProps,\n size,\n defaultChildren: null,\n });\n\n return (\n <Provider values={values}>\n <div className={classNames?.item?.item}>\n {typeof content === 'string' ? (\n <AriaText slot='label'>{content}</AriaText>\n ) : (\n content\n )}\n </div>\n </Provider>\n );\n },\n [childrenProp, classNames?.item?.item, size, values],\n );\n\n return (\n <RACMenuItem<T>\n {...rest}\n id={id ?? textValue}\n ref={mergedRef as unknown as React.Ref<T>}\n className={classNames?.item?.container}\n style={style}\n textValue={textValue}\n >\n {children}\n </RACMenuItem>\n );\n});\n"]}
|
|
@@ -11,71 +11,71 @@ declare const menuContainers: {
|
|
|
11
11
|
item: string;
|
|
12
12
|
};
|
|
13
13
|
declare const menuStateVars: {
|
|
14
|
-
placement: `var(--${string})`;
|
|
15
|
-
size: `var(--${string})`;
|
|
16
|
-
isExiting: `var(--${string})`;
|
|
17
|
-
isEntering: `var(--${string})`;
|
|
14
|
+
placement: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
15
|
+
size: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
16
|
+
isExiting: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
17
|
+
isEntering: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
18
18
|
};
|
|
19
19
|
declare const menuItemStateVars: {
|
|
20
|
-
selectionMode: `var(--${string})`;
|
|
21
|
-
selectionBehavior: `var(--${string})`;
|
|
22
|
-
size: `var(--${string})`;
|
|
23
|
-
hasDescription: `var(--${string})`;
|
|
24
|
-
hasSubmenu: `var(--${string})`;
|
|
25
|
-
isOpen: `var(--${string})`;
|
|
26
|
-
isDisabled: `var(--${string})`;
|
|
27
|
-
isHovered: `var(--${string})`;
|
|
28
|
-
isPressed: `var(--${string})`;
|
|
29
|
-
isSelected: `var(--${string})`;
|
|
30
|
-
isFocused: `var(--${string})`;
|
|
31
|
-
isFocusVisible: `var(--${string})`;
|
|
20
|
+
selectionMode: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
21
|
+
selectionBehavior: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
22
|
+
size: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
23
|
+
hasDescription: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
24
|
+
hasSubmenu: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
25
|
+
isOpen: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
26
|
+
isDisabled: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
27
|
+
isHovered: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
28
|
+
isPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
29
|
+
isSelected: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
30
|
+
isFocused: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
31
|
+
isFocusVisible: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
32
32
|
};
|
|
33
33
|
declare const menuColorVars: {
|
|
34
34
|
list: {
|
|
35
|
-
background: `var(--${string})`;
|
|
36
|
-
border: `var(--${string})`;
|
|
37
|
-
color: `var(--${string})`;
|
|
35
|
+
background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
36
|
+
border: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
37
|
+
color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
38
38
|
};
|
|
39
39
|
header: {
|
|
40
|
-
background: `var(--${string})`;
|
|
41
|
-
border: `var(--${string})`;
|
|
42
|
-
color: `var(--${string})`;
|
|
40
|
+
background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
41
|
+
border: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
42
|
+
color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
43
43
|
};
|
|
44
|
-
separator: `var(--${string})`;
|
|
44
|
+
separator: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
45
45
|
item: {
|
|
46
|
-
background: `var(--${string})`;
|
|
47
|
-
border: `var(--${string})`;
|
|
48
|
-
color: `var(--${string})`;
|
|
46
|
+
background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
47
|
+
border: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
48
|
+
color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
49
49
|
};
|
|
50
|
-
label: `var(--${string})`;
|
|
51
|
-
description: `var(--${string})`;
|
|
50
|
+
label: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
51
|
+
description: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
52
52
|
};
|
|
53
53
|
declare const menuSpaceVars: {
|
|
54
54
|
menu: {
|
|
55
|
-
minWidth: `var(--${string})`;
|
|
56
|
-
x: `var(--${string})`;
|
|
57
|
-
y: `var(--${string})`;
|
|
55
|
+
minWidth: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
56
|
+
x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
57
|
+
y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
58
58
|
};
|
|
59
59
|
list: {
|
|
60
|
-
x: `var(--${string})`;
|
|
61
|
-
y: `var(--${string})`;
|
|
60
|
+
x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
61
|
+
y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
62
62
|
};
|
|
63
63
|
section: {
|
|
64
|
-
x: `var(--${string})`;
|
|
65
|
-
y: `var(--${string})`;
|
|
64
|
+
x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
65
|
+
y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
66
66
|
};
|
|
67
67
|
header: {
|
|
68
|
-
x: `var(--${string})`;
|
|
69
|
-
y: `var(--${string})`;
|
|
68
|
+
x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
69
|
+
y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
70
70
|
};
|
|
71
71
|
separator: {
|
|
72
|
-
x: `var(--${string})`;
|
|
73
|
-
y: `var(--${string})`;
|
|
72
|
+
x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
73
|
+
y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
74
74
|
};
|
|
75
75
|
item: {
|
|
76
|
-
x: `var(--${string})`;
|
|
77
|
-
y: `var(--${string})`;
|
|
78
|
-
gap: `var(--${string})`;
|
|
76
|
+
x: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
77
|
+
y: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
78
|
+
gap: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
79
79
|
};
|
|
80
80
|
};
|
|
81
81
|
declare const menuClassNames: MenuClassNames;
|
|
@@ -2,6 +2,17 @@ import '../../chunk-PZ5AY32C.js';
|
|
|
2
2
|
import { mergeProps } from '../../utils/props/index.js';
|
|
3
3
|
import { jsx, Fragment } from 'react/jsx-runtime';
|
|
4
4
|
|
|
5
|
+
var mergeSlotReducer = (acc, key, prevSlots, nextSlots) => {
|
|
6
|
+
const value = nextSlots[key];
|
|
7
|
+
const hasPrev = Object.hasOwn(prevSlots, key);
|
|
8
|
+
const prevValue = hasPrev ? prevSlots[key] : void 0;
|
|
9
|
+
if (hasPrev) {
|
|
10
|
+
acc[key] = mergeProps(prevValue ?? {}, value ?? {});
|
|
11
|
+
} else if (value != null) {
|
|
12
|
+
acc[key] = value;
|
|
13
|
+
}
|
|
14
|
+
return acc;
|
|
15
|
+
};
|
|
5
16
|
function merge(context, next, children) {
|
|
6
17
|
return function Consumer(prev) {
|
|
7
18
|
let merged = next;
|
|
@@ -15,13 +26,10 @@ function merge(context, next, children) {
|
|
|
15
26
|
slots: {
|
|
16
27
|
...prevSlots,
|
|
17
28
|
...nextSlots,
|
|
18
|
-
...Reflect.ownKeys(nextSlots).reduce(
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
}
|
|
23
|
-
return acc;
|
|
24
|
-
}, {})
|
|
29
|
+
...Reflect.ownKeys(nextSlots).reduce(
|
|
30
|
+
(acc, key) => mergeSlotReducer(acc, key, prevSlots, nextSlots),
|
|
31
|
+
{}
|
|
32
|
+
)
|
|
25
33
|
}
|
|
26
34
|
};
|
|
27
35
|
} else if (!(prevSlots || nextSlots)) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/merge-provider/index.tsx"],"names":[],"mappings":";;;;AAgBA,SAAS,KAAA,CAAS,OAAA,EAAqB,IAAA,EAAS,QAAA,EAAqB;AACnE,EAAA,OAAO,SAAS,SAAS,IAAA,EAAS;AAChC,IAAA,IAAI,MAAA,GAAS,IAAA;AAEb,IAAA,IACE,IAAA,IAAQ,QACR,IAAA,IAAQ,IAAA,IACR,OAAO,IAAA,KAAS,QAAA,IAChB,OAAO,IAAA,KAAS,QAAA,EAChB;AACA,MAAA,MAAM,SAAA,GACJ,OAAA,IAAW,IAAA,IAAS,IAAA,CAAK,KAAA;AAE3B,MAAA,MAAM,SAAA,GACJ,OAAA,IAAW,IAAA,IAAS,IAAA,CAAK,KAAA;AAE3B,MAAA,IAAI,aAAa,SAAA,EAAW;AAC1B,QAAA,MAAA,GAAS;AAAA,UACP,GAAG,IAAA;AAAA,UACH,GAAG,IAAA;AAAA,UACH,KAAA,EAAO;AAAA,YACL,GAAG,SAAA;AAAA,YACH,GAAG,SAAA;AAAA,YACH,GAAG,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/merge-provider/index.tsx"],"names":[],"mappings":";;;;AAgBA,IAAM,gBAAA,GAAmB,CACvB,GAAA,EACA,GAAA,EACA,WACA,SAAA,KACG;AACH,EAAA,MAAM,KAAA,GAAQ,UAAU,GAAG,CAAA;AAE3B,EAAA,MAAM,OAAA,GAAU,MAAA,CAAO,MAAA,CAAO,SAAA,EAAW,GAAG,CAAA;AAC5C,EAAA,MAAM,SAAA,GAAY,OAAA,GAAU,SAAA,CAAU,GAAG,CAAA,GAAI,MAAA;AAE7C,EAAA,IAAI,OAAA,EAAS;AACX,IAAA,GAAA,CAAI,GAAG,IAAI,UAAA,CAAW,SAAA,IAAa,EAAC,EAAG,KAAA,IAAS,EAAE,CAAA;AAAA,EACpD,CAAA,MAAA,IAAW,SAAS,IAAA,EAAM;AACxB,IAAA,GAAA,CAAI,GAAG,CAAA,GAAI,KAAA;AAAA,EACb;AAEA,EAAA,OAAO,GAAA;AACT,CAAA;AAEA,SAAS,KAAA,CAAS,OAAA,EAAqB,IAAA,EAAS,QAAA,EAAqB;AACnE,EAAA,OAAO,SAAS,SAAS,IAAA,EAAS;AAChC,IAAA,IAAI,MAAA,GAAS,IAAA;AAEb,IAAA,IACE,IAAA,IAAQ,QACR,IAAA,IAAQ,IAAA,IACR,OAAO,IAAA,KAAS,QAAA,IAChB,OAAO,IAAA,KAAS,QAAA,EAChB;AACA,MAAA,MAAM,SAAA,GACJ,OAAA,IAAW,IAAA,IAAS,IAAA,CAAK,KAAA;AAE3B,MAAA,MAAM,SAAA,GACJ,OAAA,IAAW,IAAA,IAAS,IAAA,CAAK,KAAA;AAE3B,MAAA,IAAI,aAAa,SAAA,EAAW;AAC1B,QAAA,MAAA,GAAS;AAAA,UACP,GAAG,IAAA;AAAA,UACH,GAAG,IAAA;AAAA,UACH,KAAA,EAAO;AAAA,YACL,GAAG,SAAA;AAAA,YACH,GAAG,SAAA;AAAA,YACH,GAAG,OAAA,CAAQ,OAAA,CAAQ,SAAS,CAAA,CAAE,MAAA;AAAA,cAG5B,CAAC,GAAA,EAAK,GAAA,KAAQ,iBAAiB,GAAA,EAAK,GAAA,EAAK,WAAW,SAAS,CAAA;AAAA,cAC7D;AAAC;AACH;AACF,SACF;AAAA,MACF,CAAA,MAAA,IAAW,EAAE,SAAA,IAAa,SAAA,CAAA,EAAY;AACpC,QAAA,MAAA,GAAS,UAAA,CAAW,MAAgB,IAAc,CAAA;AAAA,MACpD;AAAA,IACF;AAEA,IAAA,2BAAQ,OAAA,CAAQ,QAAA,EAAR,EAAiB,KAAA,EAAO,QAAS,QAAA,EAAS,CAAA;AAAA,EACpD,CAAA;AACF;AAcO,SAAS,aAAA,CAA+C;AAAA,EAC7D,MAAA;AAAA,EACA;AACF,CAAA,EAAwD;AACtD,EAAA,KAAA,MAAW,CAAC,OAAA,EAAS,IAAI,CAAA,IAAK,MAAA,EAAQ;AACpC,IAAA,QAAA,mBACE,GAAA,CAAC,QAAQ,QAAA,EAAR,EACE,gBAAM,OAAA,EAAiC,IAAA,EAAM,QAAQ,CAAA,EACxD,CAAA;AAAA,EAEJ;AAEA,EAAA,uCAAU,QAAA,EAAS,CAAA;AACrB","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { mergeProps } from '../../utils/props';\nimport type { Context, ReactNode } from 'react';\nimport type { MergeProviderProps } from './types';\n\nconst mergeSlotReducer = (\n acc: Record<string | symbol, object>,\n key: PropertyKey,\n prevSlots: Record<string | symbol, object>,\n nextSlots: Record<string | symbol, object>,\n) => {\n const value = nextSlots[key];\n\n const hasPrev = Object.hasOwn(prevSlots, key);\n const prevValue = hasPrev ? prevSlots[key] : undefined;\n\n if (hasPrev) {\n acc[key] = mergeProps(prevValue ?? {}, value ?? {});\n } else if (value != null) {\n acc[key] = value;\n }\n\n return acc;\n};\n\nfunction merge<T>(context: Context<T>, next: T, children: ReactNode) {\n return function Consumer(prev: T) {\n let merged = next;\n\n if (\n prev != null &&\n next != null &&\n typeof prev === 'object' &&\n typeof next === 'object'\n ) {\n const prevSlots =\n 'slots' in prev && (prev.slots as Record<string | symbol, object>);\n\n const nextSlots =\n 'slots' in next && (next.slots as Record<string | symbol, object>);\n\n if (prevSlots && nextSlots) {\n merged = {\n ...prev,\n ...next,\n slots: {\n ...prevSlots,\n ...nextSlots,\n ...Reflect.ownKeys(nextSlots).reduce<\n Record<string | symbol, object>\n >(\n (acc, key) => mergeSlotReducer(acc, key, prevSlots, nextSlots),\n {},\n ),\n },\n } as T;\n } else if (!(prevSlots || nextSlots)) {\n merged = mergeProps(prev as object, next as object) as T;\n }\n }\n\n return <context.Provider value={merged}>{children}</context.Provider>;\n };\n}\n\n/**\n * Merges provided contexts with parent contexts, if available and of the same structure\n * If parent context doesn't exist or differs in structure (slotted vs non-slotted) from\n * the context being provided, the provided context will override the parent context\n *\n * This is typically used in conjunction with React Aria Component's contexts, where a\n * RAC may provide a slotted context (ex: ButtonContext, with a slot of \"remove\") where\n * that slot has a number of attributes and event listeners, but we want to merge in our\n * own to supplement things for stylistic or additional functionality purposes\n *\n * See tests for examples\n */\nexport function MergeProvider<A, B, C, D, E, F, G, H, I, J, K>({\n values,\n children,\n}: MergeProviderProps<A, B, C, D, E, F, G, H, I, J, K>) {\n for (const [context, next] of values) {\n children = (\n <context.Consumer>\n {merge(context as Context<typeof next>, next, children)}\n </context.Consumer>\n );\n }\n\n return <>{children}</>;\n}\n"]}
|
|
@@ -5,10 +5,10 @@ import * as react from 'react';
|
|
|
5
5
|
import 'type-fest';
|
|
6
6
|
import '../../types/props.js';
|
|
7
7
|
import '../button/types.js';
|
|
8
|
+
import '../../types/generic.js';
|
|
8
9
|
import '../../types/react-aria.js';
|
|
9
10
|
import '../icon/types.js';
|
|
10
11
|
import '../input/types.js';
|
|
11
|
-
import '../../types/generic.js';
|
|
12
12
|
|
|
13
13
|
declare const NumberFieldContext: react.Context<ContextValue<NumberFieldProps, HTMLDivElement>>;
|
|
14
14
|
declare const NumberField: (props: Omit<react_aria_components.NumberFieldProps, "className" | "style"> & {
|