@accelint/design-system 0.8.1 → 0.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/aria/index.d.ts +32 -3
- package/dist/components/aria/index.js +36 -1
- package/dist/components/aria/index.js.map +1 -1
- package/dist/components/button/index.d.ts +45 -6
- package/dist/components/button/index.js +105 -3
- package/dist/components/button/index.js.map +1 -1
- package/dist/components/checkbox/index.d.ts +28 -7
- package/dist/components/checkbox/index.js +124 -3
- package/dist/components/checkbox/index.js.map +1 -1
- package/dist/components/chip/index.d.ts +36 -6
- package/dist/components/chip/index.js +171 -3
- package/dist/components/chip/index.js.map +1 -1
- package/dist/components/collection/index.d.ts +16 -5
- package/dist/components/collection/index.js +19 -1
- package/dist/components/collection/index.js.map +1 -1
- package/dist/components/combo-box/index.d.ts +13 -5
- package/dist/components/combo-box/index.js +116 -3
- package/dist/components/combo-box/index.js.map +1 -1
- package/dist/components/date-field/index.d.ts +13 -5
- package/dist/components/date-field/index.js +106 -2
- package/dist/components/date-field/index.js.map +1 -1
- package/dist/components/date-input/index.d.ts +19 -7
- package/dist/components/date-input/index.js +134 -2
- package/dist/components/date-input/index.js.map +1 -1
- package/dist/components/dialog/index.d.ts +24 -6
- package/dist/components/dialog/index.js +187 -3
- package/dist/components/dialog/index.js.map +1 -1
- package/dist/components/drawer/index.d.ts +19 -7
- package/dist/components/drawer/index.js +306 -3
- package/dist/components/drawer/index.js.map +1 -1
- package/dist/components/element/index.d.ts +15 -4
- package/dist/components/element/index.js +21 -2
- package/dist/components/element/index.js.map +1 -1
- package/dist/components/group/index.d.ts +15 -5
- package/dist/components/group/index.js +60 -3
- package/dist/components/group/index.js.map +1 -1
- package/dist/components/icon/index.d.ts +17 -5
- package/dist/components/icon/index.js +39 -3
- package/dist/components/icon/index.js.map +1 -1
- package/dist/components/index.d.ts +35 -35
- package/dist/components/index.js +58 -28
- package/dist/components/input/index.d.ts +12 -5
- package/dist/components/input/index.js +141 -3
- package/dist/components/input/index.js.map +1 -1
- package/dist/components/menu/index.d.ts +29 -5
- package/dist/components/menu/index.js +253 -3
- package/dist/components/menu/index.js.map +1 -1
- package/dist/components/merge-provider/index.d.ts +18 -3
- package/dist/components/merge-provider/index.js +43 -2
- package/dist/components/merge-provider/index.js.map +1 -1
- package/dist/components/number-field/index.d.ts +14 -6
- package/dist/components/number-field/index.js +127 -2
- package/dist/components/number-field/index.js.map +1 -1
- package/dist/components/number-field/number-field.css.d.ts +1 -1
- package/dist/components/number-field/types.d.ts +1 -1
- package/dist/components/options/index.d.ts +25 -5
- package/dist/components/options/index.js +254 -3
- package/dist/components/options/index.js.map +1 -1
- package/dist/components/picker/index.d.ts +23 -5
- package/dist/components/picker/index.js +113 -3
- package/dist/components/picker/index.js.map +1 -1
- package/dist/components/popover/index.d.ts +14 -6
- package/dist/components/popover/index.js +140 -3
- package/dist/components/popover/index.js.map +1 -1
- package/dist/components/query-builder/group.js +1 -1
- package/dist/components/query-builder/group.js.map +1 -1
- package/dist/components/query-builder/index.d.ts +7 -7
- package/dist/components/query-builder/index.js +198 -5
- package/dist/components/query-builder/index.js.map +1 -1
- package/dist/components/query-builder/rule.js +1 -1
- package/dist/components/query-builder/rule.js.map +1 -1
- package/dist/components/query-builder/value-editor.js.map +1 -1
- package/dist/components/query-builder/value-selector.js +1 -1
- package/dist/components/query-builder/value-selector.js.map +1 -1
- package/dist/components/radio/index.d.ts +22 -6
- package/dist/components/radio/index.js +114 -3
- package/dist/components/radio/index.js.map +1 -1
- package/dist/components/search-field/index.d.ts +15 -6
- package/dist/components/search-field/index.js +92 -3
- package/dist/components/search-field/index.js.map +1 -1
- package/dist/components/select/index.d.ts +13 -5
- package/dist/components/select/index.js +109 -3
- package/dist/components/select/index.js.map +1 -1
- package/dist/components/slider/index.d.ts +41 -7
- package/dist/components/slider/index.js +232 -3
- package/dist/components/slider/index.js.map +1 -1
- package/dist/components/slider/slider.css.d.ts +1 -1
- package/dist/components/slider/types.d.ts +1 -1
- package/dist/components/switch/index.d.ts +9 -5
- package/dist/components/switch/index.js +60 -3
- package/dist/components/switch/index.js.map +1 -1
- package/dist/components/tabs/index.d.ts +74 -7
- package/dist/components/tabs/index.js +259 -3
- package/dist/components/tabs/index.js.map +1 -1
- package/dist/components/text-field/index.d.ts +61 -6
- package/dist/components/text-field/index.js +93 -2
- package/dist/components/text-field/index.js.map +1 -1
- package/dist/components/textarea/index.d.ts +18 -5
- package/dist/components/textarea/index.js +134 -3
- package/dist/components/textarea/index.js.map +1 -1
- package/dist/components/time-field/index.d.ts +14 -6
- package/dist/components/time-field/index.js +103 -2
- package/dist/components/time-field/index.js.map +1 -1
- package/dist/components/tooltip/index.d.ts +29 -6
- package/dist/components/tooltip/index.js +112 -3
- package/dist/components/tooltip/index.js.map +1 -1
- package/dist/components/tree/index.d.ts +17 -5
- package/dist/components/tree/index.js +491 -3
- package/dist/components/tree/index.js.map +1 -1
- package/dist/components/tree/utils.js.map +1 -1
- package/dist/hooks/index.d.ts +12 -12
- package/dist/hooks/use-collection-render/index.d.ts +11 -3
- package/dist/hooks/use-collection-render/index.js +25 -1
- package/dist/hooks/use-collection-render/index.js.map +1 -1
- package/dist/hooks/use-context-props/index.d.ts +10 -3
- package/dist/hooks/use-context-props/index.js +15 -1
- package/dist/hooks/use-context-props/index.js.map +1 -1
- package/dist/hooks/use-defaults/index.d.ts +99 -31
- package/dist/hooks/use-defaults/index.js +33 -2
- package/dist/hooks/use-defaults/index.js.map +1 -1
- package/dist/hooks/use-defaults/types.d.ts +6 -6
- package/dist/hooks/use-propagating-press/index.d.ts +13 -2
- package/dist/hooks/use-propagating-press/index.js +19 -1
- package/dist/hooks/use-propagating-press/index.js.map +1 -1
- package/dist/hooks/use-slot/index.d.ts +16 -2
- package/dist/hooks/use-slot/index.js +18 -1
- package/dist/hooks/use-slot/index.js.map +1 -1
- package/dist/hooks/use-theme/index.d.ts +37 -8
- package/dist/hooks/use-theme/index.js +105 -2
- package/dist/hooks/use-theme/index.js.map +1 -1
- package/dist/hooks/use-theme/types.d.ts +2 -2
- package/dist/hooks/use-tree/index.d.ts +5 -2
- package/dist/hooks/use-tree/index.js +259 -1
- package/dist/hooks/use-tree/index.js.map +1 -1
- package/dist/hooks/use-tree/utils.js.map +1 -1
- package/dist/hooks/use-update-effect/index.d.ts +3 -1
- package/dist/hooks/use-update-effect/index.js +20 -1
- package/dist/hooks/use-update-effect/index.js.map +1 -1
- package/dist/index.css +119 -119
- package/dist/index.d.ts +47 -47
- package/dist/ladle/actions.js.map +1 -1
- package/dist/styles/layers.css.d.ts +3 -3
- package/dist/styles/surfaces.css.d.ts +1 -1
- package/dist/test/setup.js +78 -8
- package/dist/test/setup.js.map +1 -1
- package/dist/utils/{css.d.ts → css/index.d.ts} +2 -2
- package/dist/utils/{css.js → css/index.js} +5 -5
- package/dist/utils/css/index.js.map +1 -0
- package/dist/utils/events/index.js +10 -0
- package/dist/utils/events/index.js.map +1 -0
- package/dist/utils/index.d.ts +4 -4
- package/dist/utils/index.js +4 -4
- package/dist/utils/{props.d.ts → props/index.d.ts} +2 -2
- package/dist/utils/{props.js → props/index.js} +3 -3
- package/dist/utils/props/index.js.map +1 -0
- package/dist/utils/{validators.d.ts → validators/index.d.ts} +1 -1
- package/dist/utils/{validators.js → validators/index.js} +3 -3
- package/dist/utils/validators/index.js.map +1 -0
- package/dist/vanilla.d.ts +1 -1
- package/dist/vanilla.js +1 -1
- package/package.json +7 -8
- package/dist/components/aria/aria.d.ts +0 -32
- package/dist/components/aria/aria.js +0 -39
- package/dist/components/aria/aria.js.map +0 -1
- package/dist/components/button/button.d.ts +0 -47
- package/dist/components/button/button.js +0 -104
- package/dist/components/button/button.js.map +0 -1
- package/dist/components/checkbox/checkbox.d.ts +0 -30
- package/dist/components/checkbox/checkbox.js +0 -123
- package/dist/components/checkbox/checkbox.js.map +0 -1
- package/dist/components/chip/chip.d.ts +0 -41
- package/dist/components/chip/chip.js +0 -171
- package/dist/components/chip/chip.js.map +0 -1
- package/dist/components/collection/collection.d.ts +0 -17
- package/dist/components/collection/collection.js +0 -22
- package/dist/components/collection/collection.js.map +0 -1
- package/dist/components/combo-box/combo-box.d.ts +0 -21
- package/dist/components/combo-box/combo-box.js +0 -116
- package/dist/components/combo-box/combo-box.js.map +0 -1
- package/dist/components/date-field/date-field.d.ts +0 -20
- package/dist/components/date-field/date-field.js +0 -106
- package/dist/components/date-field/date-field.js.map +0 -1
- package/dist/components/date-input/date-input.d.ts +0 -42
- package/dist/components/date-input/date-input.js +0 -128
- package/dist/components/date-input/date-input.js.map +0 -1
- package/dist/components/dialog/dialog.d.ts +0 -29
- package/dist/components/dialog/dialog.js +0 -186
- package/dist/components/dialog/dialog.js.map +0 -1
- package/dist/components/drawer/drawer.d.ts +0 -28
- package/dist/components/drawer/drawer.js +0 -305
- package/dist/components/drawer/drawer.js.map +0 -1
- package/dist/components/element/element.d.ts +0 -16
- package/dist/components/element/element.js +0 -24
- package/dist/components/element/element.js.map +0 -1
- package/dist/components/group/group.d.ts +0 -16
- package/dist/components/group/group.js +0 -61
- package/dist/components/group/group.js.map +0 -1
- package/dist/components/icon/icon.d.ts +0 -17
- package/dist/components/icon/icon.js +0 -39
- package/dist/components/icon/icon.js.map +0 -1
- package/dist/components/input/input.d.ts +0 -13
- package/dist/components/input/input.js +0 -141
- package/dist/components/input/input.js.map +0 -1
- package/dist/components/menu/menu.d.ts +0 -32
- package/dist/components/menu/menu.js +0 -252
- package/dist/components/menu/menu.js.map +0 -1
- package/dist/components/merge-provider/merge-provider.d.ts +0 -20
- package/dist/components/merge-provider/merge-provider.js +0 -46
- package/dist/components/merge-provider/merge-provider.js.map +0 -1
- package/dist/components/number-field/number-field.d.ts +0 -20
- package/dist/components/number-field/number-field.js +0 -125
- package/dist/components/number-field/number-field.js.map +0 -1
- package/dist/components/options/options.d.ts +0 -28
- package/dist/components/options/options.js +0 -253
- package/dist/components/options/options.js.map +0 -1
- package/dist/components/picker/picker.d.ts +0 -24
- package/dist/components/picker/picker.js +0 -113
- package/dist/components/picker/picker.js.map +0 -1
- package/dist/components/popover/popover.d.ts +0 -22
- package/dist/components/popover/popover.js +0 -139
- package/dist/components/popover/popover.js.map +0 -1
- package/dist/components/query-builder/query-builder.d.ts +0 -23
- package/dist/components/query-builder/query-builder.js +0 -200
- package/dist/components/query-builder/query-builder.js.map +0 -1
- package/dist/components/radio/radio.d.ts +0 -23
- package/dist/components/radio/radio.js +0 -114
- package/dist/components/radio/radio.js.map +0 -1
- package/dist/components/search-field/search-field.d.ts +0 -21
- package/dist/components/search-field/search-field.js +0 -92
- package/dist/components/search-field/search-field.js.map +0 -1
- package/dist/components/select/select.d.ts +0 -20
- package/dist/components/select/select.js +0 -109
- package/dist/components/select/select.js.map +0 -1
- package/dist/components/slider/slider.d.ts +0 -49
- package/dist/components/slider/slider.js +0 -230
- package/dist/components/slider/slider.js.map +0 -1
- package/dist/components/switch/switch.d.ts +0 -10
- package/dist/components/switch/switch.js +0 -60
- package/dist/components/switch/switch.js.map +0 -1
- package/dist/components/tabs/tabs.d.ts +0 -75
- package/dist/components/tabs/tabs.js +0 -258
- package/dist/components/tabs/tabs.js.map +0 -1
- package/dist/components/text-field/text-field.d.ts +0 -64
- package/dist/components/text-field/text-field.js +0 -92
- package/dist/components/text-field/text-field.js.map +0 -1
- package/dist/components/textarea/textarea.d.ts +0 -19
- package/dist/components/textarea/textarea.js +0 -134
- package/dist/components/textarea/textarea.js.map +0 -1
- package/dist/components/time-field/time-field.d.ts +0 -21
- package/dist/components/time-field/time-field.js +0 -106
- package/dist/components/time-field/time-field.js.map +0 -1
- package/dist/components/tooltip/tooltip.d.ts +0 -30
- package/dist/components/tooltip/tooltip.js +0 -112
- package/dist/components/tooltip/tooltip.js.map +0 -1
- package/dist/components/tree/tree.d.ts +0 -29
- package/dist/components/tree/tree.js +0 -491
- package/dist/components/tree/tree.js.map +0 -1
- package/dist/hooks/use-collection-render/use-collection-render.d.ts +0 -11
- package/dist/hooks/use-collection-render/use-collection-render.js +0 -28
- package/dist/hooks/use-collection-render/use-collection-render.js.map +0 -1
- package/dist/hooks/use-context-props/use-context-props.d.ts +0 -10
- package/dist/hooks/use-context-props/use-context-props.js +0 -18
- package/dist/hooks/use-context-props/use-context-props.js.map +0 -1
- package/dist/hooks/use-defaults/use-defaults.d.ts +0 -110
- package/dist/hooks/use-defaults/use-defaults.js +0 -36
- package/dist/hooks/use-defaults/use-defaults.js.map +0 -1
- package/dist/hooks/use-propagating-press/use-propagating-press.d.ts +0 -13
- package/dist/hooks/use-propagating-press/use-propagating-press.js +0 -21
- package/dist/hooks/use-propagating-press/use-propagating-press.js.map +0 -1
- package/dist/hooks/use-slot/use-slot.d.ts +0 -16
- package/dist/hooks/use-slot/use-slot.js +0 -21
- package/dist/hooks/use-slot/use-slot.js.map +0 -1
- package/dist/hooks/use-theme/use-theme.d.ts +0 -77
- package/dist/hooks/use-theme/use-theme.js +0 -108
- package/dist/hooks/use-theme/use-theme.js.map +0 -1
- package/dist/hooks/use-tree/use-tree.d.ts +0 -7
- package/dist/hooks/use-tree/use-tree.js +0 -262
- package/dist/hooks/use-tree/use-tree.js.map +0 -1
- package/dist/hooks/use-update-effect/use-update-effect.d.ts +0 -3
- package/dist/hooks/use-update-effect/use-update-effect.js +0 -23
- package/dist/hooks/use-update-effect/use-update-effect.js.map +0 -1
- package/dist/utils/css.js.map +0 -1
- package/dist/utils/events.js +0 -10
- package/dist/utils/events.js.map +0 -1
- package/dist/utils/props.js.map +0 -1
- package/dist/utils/validators.js.map +0 -1
- /package/dist/utils/{events.d.ts → events/index.d.ts} +0 -0
|
@@ -1,6 +1,256 @@
|
|
|
1
1
|
import '../../chunk-PZ5AY32C.js';
|
|
2
|
-
|
|
3
|
-
import '
|
|
4
|
-
|
|
2
|
+
import { createContext, forwardRef, useMemo, useCallback } from 'react';
|
|
3
|
+
import { Provider, Popover, Collection, MenuStateContext, UNSTABLE_CollectionRendererContext, Menu as Menu$1, DEFAULT_SLOT, MenuItem as MenuItem$1 } from 'react-aria-components';
|
|
4
|
+
import { useContextProps } from '../../hooks/use-context-props/index.js';
|
|
5
|
+
import { useDefaultProps } from '../../hooks/use-defaults/index.js';
|
|
6
|
+
import { useSlot } from '../../hooks/use-slot/index.js';
|
|
7
|
+
import { useTheme } from '../../hooks/use-theme/index.js';
|
|
8
|
+
import { bodies, headings } from '../../styles/typography.css.js';
|
|
9
|
+
import { inlineVars } from '../../utils/css/index.js';
|
|
10
|
+
import { mergeClassNames, callRenderProps } from '../../utils/props/index.js';
|
|
11
|
+
import { AriaSectionContext, AriaHeaderContext, AriaSeparatorContext, AriaSection, AriaTextContext, AriaKeyboardContext, AriaText } from '../aria/index.js';
|
|
12
|
+
import { createCollectionRenderer } from '../collection/index.js';
|
|
13
|
+
import { IconContext } from '../icon/index.js';
|
|
14
|
+
import { menuClassNames, menuStateVars, menuItemStateVars } from './menu.css.js';
|
|
15
|
+
import { jsx } from 'react/jsx-runtime';
|
|
16
|
+
|
|
17
|
+
var defaultMapping = {
|
|
18
|
+
description: {
|
|
19
|
+
sm: bodies.xs,
|
|
20
|
+
lg: bodies.xs
|
|
21
|
+
},
|
|
22
|
+
header: {
|
|
23
|
+
sm: headings.v4,
|
|
24
|
+
lg: headings.v5
|
|
25
|
+
},
|
|
26
|
+
label: {
|
|
27
|
+
sm: bodies.sm,
|
|
28
|
+
lg: bodies.sm
|
|
29
|
+
},
|
|
30
|
+
shortcut: {
|
|
31
|
+
sm: bodies.xs,
|
|
32
|
+
lg: bodies.xs
|
|
33
|
+
}
|
|
34
|
+
};
|
|
35
|
+
var defaultSize = "lg";
|
|
36
|
+
var MenuContext = createContext(null);
|
|
37
|
+
var Menu = forwardRef(function Menu2(props, ref) {
|
|
38
|
+
[props, ref] = useContextProps(props, ref, MenuContext);
|
|
39
|
+
props = useDefaultProps(props, "Menu");
|
|
40
|
+
const {
|
|
41
|
+
children: childrenProp,
|
|
42
|
+
classNames: classNamesProp,
|
|
43
|
+
mapping: mappingProp,
|
|
44
|
+
size = defaultSize,
|
|
45
|
+
...rest
|
|
46
|
+
} = props;
|
|
47
|
+
const theme = useTheme();
|
|
48
|
+
const classNames = useMemo(
|
|
49
|
+
() => mergeClassNames(menuClassNames, classNamesProp, theme.Menu, {
|
|
50
|
+
menu: { container: theme.className }
|
|
51
|
+
// required to consume global theme within Popover
|
|
52
|
+
}),
|
|
53
|
+
[classNamesProp, theme.Menu, theme.className]
|
|
54
|
+
);
|
|
55
|
+
const mapping = useMemo(
|
|
56
|
+
() => ({
|
|
57
|
+
...defaultMapping,
|
|
58
|
+
...mappingProp
|
|
59
|
+
}),
|
|
60
|
+
[mappingProp]
|
|
61
|
+
);
|
|
62
|
+
const style = useCallback(
|
|
63
|
+
(renderProps) => ({
|
|
64
|
+
...theme.style,
|
|
65
|
+
// required to consume global styles within Popover
|
|
66
|
+
...inlineVars(menuStateVars, {
|
|
67
|
+
...renderProps,
|
|
68
|
+
size
|
|
69
|
+
})
|
|
70
|
+
}),
|
|
71
|
+
[theme.style, size]
|
|
72
|
+
);
|
|
73
|
+
const values = useMemo(
|
|
74
|
+
() => [[MenuListContext, { classNames, mapping, size }]],
|
|
75
|
+
[classNames, mapping, size]
|
|
76
|
+
);
|
|
77
|
+
const children = useCallback(
|
|
78
|
+
(renderProps) => /* @__PURE__ */ jsx(Provider, { values, children: /* @__PURE__ */ jsx("div", { className: classNames?.menu?.menu, children: callRenderProps(childrenProp, {
|
|
79
|
+
...renderProps,
|
|
80
|
+
size,
|
|
81
|
+
defaultChildren: null
|
|
82
|
+
}) }) }),
|
|
83
|
+
[childrenProp, classNames?.menu?.menu, size, values]
|
|
84
|
+
);
|
|
85
|
+
return /* @__PURE__ */ jsx(
|
|
86
|
+
Popover,
|
|
87
|
+
{
|
|
88
|
+
...rest,
|
|
89
|
+
ref,
|
|
90
|
+
className: classNames?.menu?.container,
|
|
91
|
+
style,
|
|
92
|
+
children
|
|
93
|
+
}
|
|
94
|
+
);
|
|
95
|
+
});
|
|
96
|
+
var MenuListContext = createContext(null);
|
|
97
|
+
var MenuList = forwardRef(function MenuList2(props, ref) {
|
|
98
|
+
[props, ref] = useContextProps(props, ref, MenuListContext);
|
|
99
|
+
props = useDefaultProps(props, "Menu");
|
|
100
|
+
const {
|
|
101
|
+
children: childrenProp,
|
|
102
|
+
classNames: classNamesProp,
|
|
103
|
+
items,
|
|
104
|
+
mapping: mappingProp,
|
|
105
|
+
selectionMode = "single",
|
|
106
|
+
size = defaultSize,
|
|
107
|
+
"aria-label": ariaLabel,
|
|
108
|
+
"aria-labelledby": ariaLabelledBy,
|
|
109
|
+
...rest
|
|
110
|
+
} = props;
|
|
111
|
+
const theme = useTheme();
|
|
112
|
+
const mapping = useMemo(
|
|
113
|
+
() => ({
|
|
114
|
+
...defaultMapping,
|
|
115
|
+
...mappingProp
|
|
116
|
+
}),
|
|
117
|
+
[mappingProp]
|
|
118
|
+
);
|
|
119
|
+
const classNames = useMemo(
|
|
120
|
+
() => mergeClassNames(menuClassNames, theme.Menu, classNamesProp, {
|
|
121
|
+
list: { header: mapping.header[size] }
|
|
122
|
+
}),
|
|
123
|
+
[theme.Menu, classNamesProp, mapping.header, size]
|
|
124
|
+
);
|
|
125
|
+
const values = useMemo(
|
|
126
|
+
() => [
|
|
127
|
+
[MenuItemContext, { classNames, mapping, size }],
|
|
128
|
+
[AriaSectionContext, { className: classNames?.list?.section }],
|
|
129
|
+
[AriaHeaderContext, { className: classNames?.list?.header }],
|
|
130
|
+
[AriaSeparatorContext, { className: classNames?.list?.separator }]
|
|
131
|
+
],
|
|
132
|
+
[classNames, mapping, size]
|
|
133
|
+
);
|
|
134
|
+
const children = useMemo(() => {
|
|
135
|
+
if (!(childrenProp || items)) {
|
|
136
|
+
return null;
|
|
137
|
+
}
|
|
138
|
+
return /* @__PURE__ */ jsx(AriaSection, { className: classNames?.list?.list, children: typeof childrenProp === "function" ? /* @__PURE__ */ jsx(Collection, { items, children: childrenProp }) : childrenProp });
|
|
139
|
+
}, [childrenProp, classNames?.list?.list, items]);
|
|
140
|
+
const renderer = useMemo(
|
|
141
|
+
() => createCollectionRenderer(MenuStateContext, values),
|
|
142
|
+
[values]
|
|
143
|
+
);
|
|
144
|
+
return /* @__PURE__ */ jsx(UNSTABLE_CollectionRendererContext.Provider, { value: renderer, children: /* @__PURE__ */ jsx(Provider, { values, children: /* @__PURE__ */ jsx(
|
|
145
|
+
Menu$1,
|
|
146
|
+
{
|
|
147
|
+
...rest,
|
|
148
|
+
ref,
|
|
149
|
+
className: classNames?.list?.container,
|
|
150
|
+
items,
|
|
151
|
+
selectionMode,
|
|
152
|
+
"aria-label": ariaLabel,
|
|
153
|
+
"aria-labelledby": ariaLabelledBy,
|
|
154
|
+
children
|
|
155
|
+
}
|
|
156
|
+
) }) });
|
|
157
|
+
});
|
|
158
|
+
var MenuItemContext = createContext(null);
|
|
159
|
+
var MenuItem = forwardRef(function MenuItem2(props, ref) {
|
|
160
|
+
[props, ref] = useContextProps(props, ref, MenuItemContext);
|
|
161
|
+
props = useDefaultProps(props, "MenuItem");
|
|
162
|
+
const {
|
|
163
|
+
id,
|
|
164
|
+
children: childrenProp,
|
|
165
|
+
classNames: classNamesProp,
|
|
166
|
+
mapping: mappingProp,
|
|
167
|
+
size = defaultSize,
|
|
168
|
+
textValue = typeof childrenProp === "string" ? childrenProp : void 0,
|
|
169
|
+
...rest
|
|
170
|
+
} = props;
|
|
171
|
+
const theme = useTheme();
|
|
172
|
+
const mapping = useMemo(
|
|
173
|
+
() => ({
|
|
174
|
+
...defaultMapping,
|
|
175
|
+
...mappingProp
|
|
176
|
+
}),
|
|
177
|
+
[mappingProp]
|
|
178
|
+
);
|
|
179
|
+
const classNames = useMemo(
|
|
180
|
+
() => mergeClassNames(menuClassNames, classNamesProp, theme.Menu, {
|
|
181
|
+
item: {
|
|
182
|
+
description: mapping.description[size],
|
|
183
|
+
label: mapping.label[size],
|
|
184
|
+
shortcut: mapping.shortcut[size]
|
|
185
|
+
}
|
|
186
|
+
}),
|
|
187
|
+
[theme.Menu, classNamesProp, mapping, size]
|
|
188
|
+
);
|
|
189
|
+
const [descriptionRef, hasDescription] = useSlot();
|
|
190
|
+
const style = useCallback(
|
|
191
|
+
(renderProps) => inlineVars(menuItemStateVars, { ...renderProps, size, hasDescription }),
|
|
192
|
+
[hasDescription, size]
|
|
193
|
+
);
|
|
194
|
+
const values = useMemo(
|
|
195
|
+
() => [
|
|
196
|
+
[
|
|
197
|
+
AriaTextContext,
|
|
198
|
+
{
|
|
199
|
+
slots: {
|
|
200
|
+
[DEFAULT_SLOT]: {},
|
|
201
|
+
label: { className: classNames?.item?.label },
|
|
202
|
+
description: {
|
|
203
|
+
ref: descriptionRef,
|
|
204
|
+
className: classNames?.item?.description
|
|
205
|
+
}
|
|
206
|
+
}
|
|
207
|
+
}
|
|
208
|
+
],
|
|
209
|
+
[
|
|
210
|
+
IconContext,
|
|
211
|
+
{
|
|
212
|
+
slots: {
|
|
213
|
+
[DEFAULT_SLOT]: { classNames: classNames?.item?.icon },
|
|
214
|
+
more: { classNames: classNames?.item?.more }
|
|
215
|
+
}
|
|
216
|
+
}
|
|
217
|
+
],
|
|
218
|
+
[AriaKeyboardContext, { className: classNames?.item?.shortcut }]
|
|
219
|
+
],
|
|
220
|
+
[
|
|
221
|
+
classNames?.item?.label,
|
|
222
|
+
descriptionRef,
|
|
223
|
+
classNames?.item?.description,
|
|
224
|
+
classNames?.item?.icon,
|
|
225
|
+
classNames?.item?.more,
|
|
226
|
+
classNames?.item?.shortcut
|
|
227
|
+
]
|
|
228
|
+
);
|
|
229
|
+
const children = useCallback(
|
|
230
|
+
(renderProps) => {
|
|
231
|
+
const content = callRenderProps(childrenProp, {
|
|
232
|
+
...renderProps,
|
|
233
|
+
size,
|
|
234
|
+
defaultChildren: null
|
|
235
|
+
});
|
|
236
|
+
return /* @__PURE__ */ jsx(Provider, { values, children: /* @__PURE__ */ jsx("div", { className: classNames?.item?.item, children: typeof content === "string" ? /* @__PURE__ */ jsx(AriaText, { slot: "label", children: content }) : content }) });
|
|
237
|
+
},
|
|
238
|
+
[childrenProp, classNames?.item?.item, size, values]
|
|
239
|
+
);
|
|
240
|
+
return /* @__PURE__ */ jsx(
|
|
241
|
+
MenuItem$1,
|
|
242
|
+
{
|
|
243
|
+
...rest,
|
|
244
|
+
id: id ?? textValue,
|
|
245
|
+
ref,
|
|
246
|
+
className: classNames?.item?.container,
|
|
247
|
+
style,
|
|
248
|
+
textValue,
|
|
249
|
+
children
|
|
250
|
+
}
|
|
251
|
+
);
|
|
252
|
+
});
|
|
253
|
+
|
|
254
|
+
export { Menu, MenuContext, MenuItem, MenuItemContext, MenuList, MenuListContext };
|
|
5
255
|
//# sourceMappingURL=index.js.map
|
|
6
256
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js","sourcesContent":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/menu/index.tsx"],"names":["Menu","MenuList","RACMenu","MenuItem","RACMenuItem"],"mappings":"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","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 type ForwardedRef,\n type HTMLAttributes,\n createContext,\n forwardRef,\n useCallback,\n useMemo,\n} from 'react';\nimport {\n Collection,\n type CollectionRenderer,\n type ContextValue,\n DEFAULT_SLOT,\n MenuStateContext,\n Popover,\n type PopoverRenderProps,\n Provider,\n Menu as RACMenu,\n MenuItem as RACMenuItem,\n type MenuItemRenderProps as RACMenuItemRenderProps,\n type SectionProps,\n type SeparatorProps,\n type TextProps,\n UNSTABLE_CollectionRendererContext,\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 AriaSection,\n AriaSectionContext,\n AriaSeparatorContext,\n AriaText,\n AriaTextContext,\n} from '../aria';\nimport { createCollectionRenderer } from '../collection';\nimport { IconContext } from '../icon';\nimport type { IconProps } from '../icon/types';\nimport { menuClassNames, menuItemStateVars, menuStateVars } from './menu.css';\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 [props, ref] = useContextProps(props, ref, MenuContext);\n props = useDefaultProps(props, 'Menu');\n\n const {\n children: childrenProp,\n classNames: classNamesProp,\n mapping: mappingProp,\n size = defaultSize,\n ...rest\n } = props;\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={ref}\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 [typeof AriaSectionContext, ContextValue<SectionProps<object>, HTMLElement>],\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 [props, ref] = useContextProps(props, ref, MenuListContext);\n props = useDefaultProps(props, '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 } = props;\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 [AriaSectionContext, { 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 <AriaSection className={classNames?.list?.list}>\n {typeof childrenProp === 'function' ? (\n <Collection items={items}>{childrenProp}</Collection>\n ) : (\n childrenProp\n )}\n </AriaSection>\n );\n }, [childrenProp, classNames?.list?.list, items]);\n\n const renderer = useMemo<CollectionRenderer>(\n () => createCollectionRenderer(MenuStateContext, values),\n [values],\n );\n\n return (\n <UNSTABLE_CollectionRendererContext.Provider value={renderer}>\n <Provider values={values}>\n <RACMenu<T>\n {...rest}\n ref={ref}\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 </UNSTABLE_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 [props, ref] = useContextProps(props, ref, MenuItemContext);\n props = useDefaultProps(props, '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 } = props;\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={ref as ForwardedRef<T>}\n className={classNames?.item?.container}\n style={style}\n textValue={textValue}\n >\n {children}\n </RACMenuItem>\n );\n});\n"]}
|
|
@@ -1,5 +1,20 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import 'react/jsx-runtime';
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { MergeProviderProps } from './types.js';
|
|
4
3
|
import 'react';
|
|
5
4
|
import '../../types/react-aria.js';
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* Merges provided contexts with parent contexts, if available and of the same structure
|
|
8
|
+
* If parent context doesn't exist or differs in structure (slotted vs non-slotted) from
|
|
9
|
+
* the context being provided, the provided context will override the parent context
|
|
10
|
+
*
|
|
11
|
+
* This is typically used in conjunction with React Aria Component's contexts, where a
|
|
12
|
+
* RAC may provide a slotted context (ex: ButtonContext, with a slot of "remove") where
|
|
13
|
+
* that slot has a number of attributes and event listeners, but we want to merge in our
|
|
14
|
+
* own to supplement things for stylistic or additional functionality purposes
|
|
15
|
+
*
|
|
16
|
+
* See tests for examples
|
|
17
|
+
*/
|
|
18
|
+
declare function MergeProvider<A, B, C, D, E, F, G, H, I, J, K>({ values, children, }: MergeProviderProps<A, B, C, D, E, F, G, H, I, J, K>): react_jsx_runtime.JSX.Element;
|
|
19
|
+
|
|
20
|
+
export { MergeProvider };
|
|
@@ -1,5 +1,46 @@
|
|
|
1
1
|
import '../../chunk-PZ5AY32C.js';
|
|
2
|
-
|
|
3
|
-
import '
|
|
2
|
+
import { mergeProps } from '../../utils/props/index.js';
|
|
3
|
+
import { jsx, Fragment } from 'react/jsx-runtime';
|
|
4
|
+
|
|
5
|
+
function merge(context, next, children) {
|
|
6
|
+
return function Consumer(prev) {
|
|
7
|
+
let merged = next;
|
|
8
|
+
if (prev != null && next != null && typeof prev === "object" && typeof next === "object") {
|
|
9
|
+
const prevSlots = "slots" in prev && prev.slots;
|
|
10
|
+
const nextSlots = "slots" in next && next.slots;
|
|
11
|
+
if (prevSlots && nextSlots) {
|
|
12
|
+
merged = {
|
|
13
|
+
...prev,
|
|
14
|
+
...next,
|
|
15
|
+
slots: {
|
|
16
|
+
...prevSlots,
|
|
17
|
+
...nextSlots,
|
|
18
|
+
...Reflect.ownKeys(nextSlots).reduce((acc, key) => {
|
|
19
|
+
const value = nextSlots[key];
|
|
20
|
+
if (Object.hasOwn(prevSlots, key)) {
|
|
21
|
+
acc[key] = mergeProps(prevSlots[key], value);
|
|
22
|
+
}
|
|
23
|
+
return acc;
|
|
24
|
+
}, {})
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
} else if (!(prevSlots || nextSlots)) {
|
|
28
|
+
merged = mergeProps(prev, next);
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
return /* @__PURE__ */ jsx(context.Provider, { value: merged, children });
|
|
32
|
+
};
|
|
33
|
+
}
|
|
34
|
+
function MergeProvider({
|
|
35
|
+
values,
|
|
36
|
+
children
|
|
37
|
+
}) {
|
|
38
|
+
for (const [context, next] of values) {
|
|
39
|
+
children = /* @__PURE__ */ jsx(context.Consumer, { children: merge(context, next, children) });
|
|
40
|
+
}
|
|
41
|
+
return /* @__PURE__ */ jsx(Fragment, { children });
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
export { MergeProvider };
|
|
4
45
|
//# sourceMappingURL=index.js.map
|
|
5
46
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js","sourcesContent":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/merge-provider/index.tsx"],"names":[],"mappings":";;;;AAgBA,SAAS,KAAA,CAAS,OAAqB,EAAA,IAAA,EAAS,QAAqB,EAAA;AACnE,EAAO,OAAA,SAAS,SAAS,IAAS,EAAA;AAChC,IAAA,IAAI,MAAS,GAAA,IAAA;AAEb,IACE,IAAA,IAAA,IAAQ,QACR,IAAQ,IAAA,IAAA,IACR,OAAO,IAAS,KAAA,QAAA,IAChB,OAAO,IAAA,KAAS,QAChB,EAAA;AACA,MAAM,MAAA,SAAA,GACJ,OAAW,IAAA,IAAA,IAAS,IAAK,CAAA,KAAA;AAE3B,MAAM,MAAA,SAAA,GACJ,OAAW,IAAA,IAAA,IAAS,IAAK,CAAA,KAAA;AAE3B,MAAA,IAAI,aAAa,SAAW,EAAA;AAC1B,QAAS,MAAA,GAAA;AAAA,UACP,GAAG,IAAA;AAAA,UACH,GAAG,IAAA;AAAA,UACH,KAAO,EAAA;AAAA,YACL,GAAG,SAAA;AAAA,YACH,GAAG,SAAA;AAAA,YACH,GAAG,QAAQ,OAAQ,CAAA,SAAS,EAAE,MAE5B,CAAA,CAAC,KAAK,GAAQ,KAAA;AACd,cAAM,MAAA,KAAA,GAAQ,UAAU,GAAG,CAAA;AAE3B,cAAA,IAAI,MAAO,CAAA,MAAA,CAAO,SAAW,EAAA,GAAG,CAAG,EAAA;AACjC,gBAAA,GAAA,CAAI,GAAG,CAAI,GAAA,UAAA,CAAW,SAAU,CAAA,GAAG,GAAG,KAAK,CAAA;AAAA;AAG7C,cAAO,OAAA,GAAA;AAAA,aACT,EAAG,EAAE;AAAA;AACP,SACF;AAAA,OACF,MAAA,IAAW,EAAE,SAAA,IAAa,SAAY,CAAA,EAAA;AACpC,QAAS,MAAA,GAAA,UAAA,CAAW,MAAgB,IAAc,CAAA;AAAA;AACpD;AAGF,IAAA,2BAAQ,OAAQ,CAAA,QAAA,EAAR,EAAiB,KAAA,EAAO,QAAS,QAAS,EAAA,CAAA;AAAA,GACpD;AACF;AAcO,SAAS,aAA+C,CAAA;AAAA,EAC7D,MAAA;AAAA,EACA;AACF,CAAwD,EAAA;AACtD,EAAA,KAAA,MAAW,CAAC,OAAA,EAAS,IAAI,CAAA,IAAK,MAAQ,EAAA;AACpC,IACE,QAAA,mBAAA,GAAA,CAAC,QAAQ,QAAR,EAAA,EACE,gBAAM,OAAiC,EAAA,IAAA,EAAM,QAAQ,CACxD,EAAA,CAAA;AAAA;AAIJ,EAAA,uCAAU,QAAS,EAAA,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 type { Context, ReactNode } from 'react';\nimport { mergeProps } from '../../utils/props';\nimport type { MergeProviderProps } from './types';\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 >((acc, key) => {\n const value = nextSlots[key];\n\n if (Object.hasOwn(prevSlots, key)) {\n acc[key] = mergeProps(prevSlots[key], value);\n }\n\n return acc;\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"]}
|
|
@@ -1,12 +1,20 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
import 'react
|
|
5
|
-
import 'react';
|
|
1
|
+
import { NumberFieldClassNames, NumberFieldMapping, NumberFieldSizes, NumberFieldProps } from './types.js';
|
|
2
|
+
import * as react_aria_components from 'react-aria-components';
|
|
3
|
+
import { ContextValue } from 'react-aria-components';
|
|
4
|
+
import * as react from 'react';
|
|
6
5
|
import 'type-fest';
|
|
7
|
-
import '../button/types.js';
|
|
8
6
|
import '../../types/props.js';
|
|
7
|
+
import '../button/types.js';
|
|
9
8
|
import '../../types/react-aria.js';
|
|
10
9
|
import '../icon/types.js';
|
|
11
10
|
import '../input/types.js';
|
|
12
11
|
import '../../types/generic.js';
|
|
12
|
+
|
|
13
|
+
declare const NumberFieldContext: react.Context<ContextValue<NumberFieldProps, HTMLDivElement>>;
|
|
14
|
+
declare const NumberField: (props: Omit<react_aria_components.NumberFieldProps, "className" | "style"> & {
|
|
15
|
+
classNames?: NumberFieldClassNames;
|
|
16
|
+
mapping?: Partial<NumberFieldMapping>;
|
|
17
|
+
size?: NumberFieldSizes;
|
|
18
|
+
} & react.RefAttributes<HTMLDivElement>) => react.ReactElement | null;
|
|
19
|
+
|
|
20
|
+
export { NumberField, NumberFieldContext };
|
|
@@ -1,5 +1,130 @@
|
|
|
1
1
|
import '../../chunk-PZ5AY32C.js';
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
import { createContext, forwardRef, useMemo, useCallback } from 'react';
|
|
3
|
+
import { LabelContext, Provider, NumberField as NumberField$1 } from 'react-aria-components';
|
|
4
|
+
import { useContextProps } from '../../hooks/use-context-props/index.js';
|
|
5
|
+
import { useDefaultProps } from '../../hooks/use-defaults/index.js';
|
|
6
|
+
import { useTheme } from '../../hooks/use-theme/index.js';
|
|
7
|
+
import { bodies } from '../../styles/typography.css.js';
|
|
8
|
+
import { inlineVars } from '../../utils/css/index.js';
|
|
9
|
+
import { mergeClassNames, callRenderProps } from '../../utils/props/index.js';
|
|
10
|
+
import { AriaTextContext, AriaFieldErrorContext, AriaGroupContext } from '../aria/index.js';
|
|
11
|
+
import { ButtonContext } from '../button/index.js';
|
|
12
|
+
import { InputContext } from '../input/index.js';
|
|
13
|
+
import { numberFieldClassNames, numberFieldStateVars } from './number-field.css.js';
|
|
14
|
+
import { jsx } from 'react/jsx-runtime';
|
|
15
|
+
|
|
16
|
+
var defaultMapping = {
|
|
17
|
+
description: {
|
|
18
|
+
sm: bodies.xs,
|
|
19
|
+
lg: bodies.xs
|
|
20
|
+
},
|
|
21
|
+
error: {
|
|
22
|
+
sm: bodies.xs,
|
|
23
|
+
lg: bodies.xs
|
|
24
|
+
},
|
|
25
|
+
increment: {
|
|
26
|
+
sm: { size: "xs", variant: "bare" },
|
|
27
|
+
lg: { size: "sm", variant: "bare" }
|
|
28
|
+
},
|
|
29
|
+
decrement: {
|
|
30
|
+
sm: { size: "xs", variant: "bare" },
|
|
31
|
+
lg: { size: "sm", variant: "bare" }
|
|
32
|
+
}
|
|
33
|
+
};
|
|
34
|
+
var NumberFieldContext = createContext(null);
|
|
35
|
+
var NumberField = forwardRef(function NumberField2(props, ref) {
|
|
36
|
+
[props, ref] = useContextProps(props, ref, NumberFieldContext);
|
|
37
|
+
props = useDefaultProps(props, "NumberField");
|
|
38
|
+
const {
|
|
39
|
+
children: childrenProp,
|
|
40
|
+
classNames: classNamesProp,
|
|
41
|
+
mapping: mappingProp,
|
|
42
|
+
size = "lg",
|
|
43
|
+
...rest
|
|
44
|
+
} = props;
|
|
45
|
+
const theme = useTheme();
|
|
46
|
+
const mapping = useMemo(
|
|
47
|
+
() => ({
|
|
48
|
+
...defaultMapping,
|
|
49
|
+
...mappingProp
|
|
50
|
+
}),
|
|
51
|
+
[mappingProp]
|
|
52
|
+
);
|
|
53
|
+
const classNames = useMemo(
|
|
54
|
+
() => mergeClassNames(
|
|
55
|
+
numberFieldClassNames,
|
|
56
|
+
theme.NumberField,
|
|
57
|
+
classNamesProp,
|
|
58
|
+
{
|
|
59
|
+
description: mapping.description[size],
|
|
60
|
+
error: mapping.error[size]
|
|
61
|
+
}
|
|
62
|
+
),
|
|
63
|
+
[theme.NumberField, classNamesProp, mapping, size]
|
|
64
|
+
);
|
|
65
|
+
const style = useCallback(
|
|
66
|
+
(renderProps) => inlineVars(numberFieldStateVars, {
|
|
67
|
+
...renderProps,
|
|
68
|
+
size
|
|
69
|
+
}),
|
|
70
|
+
[size]
|
|
71
|
+
);
|
|
72
|
+
const values = useMemo(
|
|
73
|
+
() => [
|
|
74
|
+
[LabelContext, { className: classNames?.label }],
|
|
75
|
+
[
|
|
76
|
+
AriaTextContext,
|
|
77
|
+
{
|
|
78
|
+
slots: {
|
|
79
|
+
description: { className: classNames?.description }
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
],
|
|
83
|
+
[AriaFieldErrorContext, { className: classNames?.error }],
|
|
84
|
+
[
|
|
85
|
+
AriaGroupContext,
|
|
86
|
+
{
|
|
87
|
+
className: classNames?.group
|
|
88
|
+
}
|
|
89
|
+
],
|
|
90
|
+
[
|
|
91
|
+
ButtonContext,
|
|
92
|
+
{
|
|
93
|
+
slots: {
|
|
94
|
+
increment: {
|
|
95
|
+
...mapping.increment[size],
|
|
96
|
+
classNames: classNames?.increment
|
|
97
|
+
},
|
|
98
|
+
decrement: {
|
|
99
|
+
...mapping.decrement[size],
|
|
100
|
+
classNames: classNames?.decrement
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
],
|
|
105
|
+
[InputContext, { classNames: classNames?.input, size }]
|
|
106
|
+
],
|
|
107
|
+
[classNames, mapping, size]
|
|
108
|
+
);
|
|
109
|
+
const children = useCallback(
|
|
110
|
+
(renderProps) => /* @__PURE__ */ jsx(Provider, { values, children: /* @__PURE__ */ jsx("div", { className: classNames?.numberField, children: callRenderProps(childrenProp, {
|
|
111
|
+
...renderProps,
|
|
112
|
+
defaultChildren: null
|
|
113
|
+
}) }) }),
|
|
114
|
+
[childrenProp, classNames?.numberField, values]
|
|
115
|
+
);
|
|
116
|
+
return /* @__PURE__ */ jsx(
|
|
117
|
+
NumberField$1,
|
|
118
|
+
{
|
|
119
|
+
...rest,
|
|
120
|
+
ref,
|
|
121
|
+
className: classNames?.container,
|
|
122
|
+
style,
|
|
123
|
+
children
|
|
124
|
+
}
|
|
125
|
+
);
|
|
126
|
+
});
|
|
127
|
+
|
|
128
|
+
export { NumberField, NumberFieldContext };
|
|
4
129
|
//# sourceMappingURL=index.js.map
|
|
5
130
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js","sourcesContent":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/number-field/index.tsx"],"names":["NumberField","RACNumberField"],"mappings":"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","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 type ForwardedRef,\n createContext,\n forwardRef,\n useCallback,\n useMemo,\n} from 'react';\nimport {\n type ContextValue,\n type FieldErrorProps,\n LabelContext,\n type LabelProps,\n type NumberFieldRenderProps,\n Provider,\n type GroupProps as RACGroupProps,\n NumberField as RACNumberField,\n type TextProps,\n} from 'react-aria-components';\nimport { useContextProps } from '../../hooks/use-context-props';\nimport { useDefaultProps } from '../../hooks/use-defaults';\nimport { useTheme } from '../../hooks/use-theme';\nimport { bodies } from '../../styles/typography.css';\nimport { inlineVars } from '../../utils/css';\nimport { callRenderProps, mergeClassNames } from '../../utils/props';\nimport {\n AriaFieldErrorContext,\n AriaGroupContext,\n type AriaLabelContext,\n AriaTextContext,\n} from '../aria';\nimport { ButtonContext } from '../button';\nimport type { ButtonProps } from '../button/types';\nimport { InputContext } from '../input';\nimport type { InputProps } from '../input/types';\nimport {\n numberFieldClassNames,\n numberFieldStateVars,\n} from './number-field.css';\nimport type { NumberFieldMapping, NumberFieldProps } from './types';\n\nconst defaultMapping: NumberFieldMapping = {\n description: {\n sm: bodies.xs,\n lg: bodies.xs,\n },\n error: {\n sm: bodies.xs,\n lg: bodies.xs,\n },\n increment: {\n sm: { size: 'xs', variant: 'bare' },\n lg: { size: 'sm', variant: 'bare' },\n },\n decrement: {\n sm: { size: 'xs', variant: 'bare' },\n lg: { size: 'sm', variant: 'bare' },\n },\n};\n\nexport const NumberFieldContext =\n createContext<ContextValue<NumberFieldProps, HTMLDivElement>>(null);\n\nexport const NumberField = forwardRef(function NumberField(\n props: NumberFieldProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n [props, ref] = useContextProps(props, ref, NumberFieldContext);\n\n props = useDefaultProps(props, 'NumberField');\n\n const {\n children: childrenProp,\n classNames: classNamesProp,\n mapping: mappingProp,\n size = 'lg',\n ...rest\n } = props;\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(\n numberFieldClassNames,\n theme.NumberField,\n classNamesProp,\n {\n description: mapping.description[size],\n error: mapping.error[size],\n },\n ),\n [theme.NumberField, classNamesProp, mapping, size],\n );\n\n const style = useCallback(\n (renderProps: NumberFieldRenderProps) =>\n inlineVars(numberFieldStateVars, {\n ...renderProps,\n size,\n }),\n [size],\n );\n const values = useMemo<\n [\n [typeof AriaLabelContext, ContextValue<LabelProps, HTMLLabelElement>],\n [typeof AriaTextContext, ContextValue<TextProps, HTMLElement>],\n [\n typeof AriaFieldErrorContext,\n ContextValue<FieldErrorProps, HTMLElement>,\n ],\n [typeof AriaGroupContext, ContextValue<RACGroupProps, HTMLDivElement>],\n [typeof ButtonContext, ContextValue<ButtonProps, HTMLButtonElement>],\n [typeof InputContext, ContextValue<InputProps, HTMLInputElement>],\n ]\n >(\n () => [\n [LabelContext, { className: classNames?.label }],\n [\n AriaTextContext,\n {\n slots: {\n description: { className: classNames?.description },\n },\n },\n ],\n [AriaFieldErrorContext, { className: classNames?.error }],\n [\n AriaGroupContext,\n {\n className: classNames?.group,\n },\n ],\n [\n ButtonContext,\n {\n slots: {\n increment: {\n ...mapping.increment[size],\n classNames: classNames?.increment,\n },\n decrement: {\n ...mapping.decrement[size],\n classNames: classNames?.decrement,\n },\n },\n },\n ],\n [InputContext, { classNames: classNames?.input, size }],\n ],\n [classNames, mapping, size],\n );\n\n const children = useCallback(\n (renderProps: NumberFieldRenderProps) => (\n <Provider values={values}>\n <div className={classNames?.numberField}>\n {callRenderProps(childrenProp, {\n ...renderProps,\n defaultChildren: null,\n })}\n </div>\n </Provider>\n ),\n [childrenProp, classNames?.numberField, values],\n );\n return (\n <RACNumberField\n {...rest}\n ref={ref}\n className={classNames?.container}\n style={style}\n >\n {children}\n </RACNumberField>\n );\n});\n"]}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { NumberFieldClassNames } from './types.js';
|
|
2
2
|
import 'react-aria-components';
|
|
3
3
|
import 'type-fest';
|
|
4
|
-
import '../button/types.js';
|
|
5
4
|
import '../../types/props.js';
|
|
5
|
+
import '../button/types.js';
|
|
6
6
|
import '../../types/react-aria.js';
|
|
7
7
|
import 'react';
|
|
8
8
|
import '../icon/types.js';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { NumberFieldProps as NumberFieldProps$1, NumberFieldRenderProps as NumberFieldRenderProps$1 } from 'react-aria-components';
|
|
2
2
|
import { PartialDeep } from 'type-fest';
|
|
3
|
-
import { ButtonClassNames, ButtonProps } from '../button/types.js';
|
|
4
3
|
import { OmitProtectedProps } from '../../types/props.js';
|
|
4
|
+
import { ButtonClassNames, ButtonProps } from '../button/types.js';
|
|
5
5
|
import { InputClassNames } from '../input/types.js';
|
|
6
6
|
import '../../types/react-aria.js';
|
|
7
7
|
import 'react';
|
|
@@ -1,8 +1,28 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
import 'react
|
|
5
|
-
import 'react';
|
|
1
|
+
import { OptionsClassNames, OptionsMapping, OptionsSizes, OptionsProps, OptionsItemProps, OptionsListProps } from './types.js';
|
|
2
|
+
import * as react_aria_components from 'react-aria-components';
|
|
3
|
+
import { ContextValue } from 'react-aria-components';
|
|
4
|
+
import * as react from 'react';
|
|
6
5
|
import 'type-fest';
|
|
7
6
|
import '../../types/generic.js';
|
|
8
7
|
import '../icon/types.js';
|
|
8
|
+
|
|
9
|
+
declare const OptionsContext: react.Context<ContextValue<OptionsProps, HTMLElement>>;
|
|
10
|
+
declare const Options: (props: Omit<react_aria_components.PopoverProps, "className" | "style"> & {
|
|
11
|
+
classNames?: OptionsClassNames;
|
|
12
|
+
mapping?: Partial<OptionsMapping>;
|
|
13
|
+
size?: OptionsSizes;
|
|
14
|
+
} & react.RefAttributes<HTMLElement>) => react.ReactElement | null;
|
|
15
|
+
declare const OptionsListContext: react.Context<ContextValue<OptionsListProps<object>, HTMLDivElement>>;
|
|
16
|
+
declare const OptionsList: <T extends object>(props: Omit<react_aria_components.ListBoxProps<T>, "className" | "style" | "orientation" | "dragAndDropHooks"> & {
|
|
17
|
+
classNames?: OptionsClassNames;
|
|
18
|
+
mapping?: Partial<OptionsMapping>;
|
|
19
|
+
size?: OptionsSizes;
|
|
20
|
+
} & react.RefAttributes<HTMLDivElement>) => react.ReactElement | null;
|
|
21
|
+
declare const OptionsItemContext: react.Context<ContextValue<OptionsItemProps<object>, HTMLDivElement>>;
|
|
22
|
+
declare const OptionsItem: <T extends object>(props: Omit<react_aria_components.ListBoxItemProps<T>, "className" | "style"> & {
|
|
23
|
+
classNames?: OptionsClassNames;
|
|
24
|
+
mapping?: Partial<OptionsMapping>;
|
|
25
|
+
size?: OptionsSizes;
|
|
26
|
+
} & react.RefAttributes<HTMLDivElement>) => react.ReactElement | null;
|
|
27
|
+
|
|
28
|
+
export { Options, OptionsContext, OptionsItem, OptionsItemContext, OptionsList, OptionsListContext };
|