@plasmicapp/react-web 0.2.201 → 0.2.202
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/all.d.ts +1926 -1925
- package/dist/auth/PlasmicPageGuard.d.ts +11 -11
- package/dist/common.d.ts +10 -10
- package/dist/data-sources/index.d.ts +1 -1
- package/dist/host/index.d.ts +1 -1
- package/dist/index-common.d.ts +18 -18
- package/dist/index-skinny.d.ts +1 -1
- package/dist/index.cjs.js +3495 -3495
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.d.ts +11 -11
- package/dist/plume/button/index.d.ts +36 -36
- package/dist/plume/checkbox/index.d.ts +47 -47
- package/dist/plume/collection-utils.d.ts +191 -191
- package/dist/plume/collection-utils.spec.d.ts +1 -1
- package/dist/plume/menu/context.d.ts +8 -8
- package/dist/plume/menu/index.d.ts +3 -3
- package/dist/plume/menu/menu-group.d.ts +23 -23
- package/dist/plume/menu/menu-item.d.ts +23 -23
- package/dist/plume/menu/menu.d.ts +39 -39
- package/dist/plume/menu-button/DropdownMenu.d.ts +34 -34
- package/dist/plume/menu-button/index.d.ts +2 -2
- package/dist/plume/menu-button/menu-button.d.ts +72 -72
- package/dist/plume/menu-button/menu-trigger.d.ts +21 -21
- package/dist/plume/plume-utils.d.ts +41 -41
- package/dist/plume/props-utils.d.ts +15 -15
- package/dist/plume/select/context.d.ts +3 -3
- package/dist/plume/select/index.d.ts +4 -4
- package/dist/plume/select/select-option-group.d.ts +23 -23
- package/dist/plume/select/select-option.d.ts +23 -23
- package/dist/plume/select/select.d.ts +111 -111
- package/dist/plume/switch/index.d.ts +39 -39
- package/dist/plume/text-input/index.d.ts +36 -36
- package/dist/plume/triggered-overlay/context.d.ts +14 -14
- package/dist/plume/triggered-overlay/index.d.ts +2 -2
- package/dist/plume/triggered-overlay/triggered-overlay.d.ts +24 -24
- package/dist/query/index.d.ts +1 -1
- package/dist/react-utils.d.ts +21 -21
- package/dist/react-utils.spec.d.ts +1 -1
- package/dist/react-web.esm.js +3496 -3496
- package/dist/react-web.esm.js.map +1 -1
- package/dist/render/PlasmicHead/index.d.ts +37 -37
- package/dist/render/PlasmicIcon.d.ts +4 -4
- package/dist/render/PlasmicImg/index.d.ts +81 -81
- package/dist/render/PlasmicLink.d.ts +2 -2
- package/dist/render/PlasmicSlot.d.ts +11 -11
- package/dist/render/Stack.d.ts +51 -51
- package/dist/render/elements.d.ts +74 -74
- package/dist/render/global-variants.d.ts +1 -1
- package/dist/render/screen-variants.d.ts +5 -5
- package/dist/render/ssr.d.ts +21 -21
- package/dist/render/translation.d.ts +19 -19
- package/dist/render/triggers.d.ts +39 -39
- package/dist/states/errors.d.ts +13 -13
- package/dist/states/graph.d.ts +25 -25
- package/dist/states/helpers.d.ts +43 -43
- package/dist/states/index.d.ts +4 -4
- package/dist/states/types.d.ts +66 -66
- package/dist/states/valtio.d.ts +10 -10
- package/dist/states/vanilla.d.ts +3 -3
- package/dist/stories/PlasmicImg.stories.d.ts +6 -6
- package/dist/stories/UseDollarState.stories.d.ts +78 -78
- package/lib/data-sources/index.d.ts +1 -1
- package/lib/host/index.d.ts +1 -1
- package/lib/query/index.d.ts +1 -1
- package/package.json +8 -9
- package/skinny/dist/auth/PlasmicPageGuard.d.ts +11 -11
- package/skinny/dist/{collection-utils-0967eaf0.js → collection-utils-2f28e4eb.js} +297 -297
- package/skinny/dist/{collection-utils-0967eaf0.js.map → collection-utils-2f28e4eb.js.map} +1 -1
- package/skinny/dist/{common-9d6d348d.js → common-ed411407.js} +130 -130
- package/skinny/dist/{common-9d6d348d.js.map → common-ed411407.js.map} +1 -1
- package/skinny/dist/common.d.ts +10 -10
- package/skinny/dist/data-sources/index.d.ts +1 -1
- package/skinny/dist/host/index.d.ts +1 -1
- package/skinny/dist/index-common.d.ts +18 -18
- package/skinny/dist/index-skinny.d.ts +1 -1
- package/skinny/dist/index.d.ts +11 -11
- package/skinny/dist/index.js +1559 -1559
- package/skinny/dist/index.js.map +1 -1
- package/skinny/dist/plume/button/index.d.ts +36 -36
- package/skinny/dist/plume/button/index.js +21 -21
- package/skinny/dist/plume/checkbox/index.d.ts +47 -47
- package/skinny/dist/plume/checkbox/index.js +64 -64
- package/skinny/dist/plume/collection-utils.d.ts +191 -191
- package/skinny/dist/plume/collection-utils.spec.d.ts +1 -1
- package/skinny/dist/plume/menu/context.d.ts +8 -8
- package/skinny/dist/plume/menu/index.d.ts +3 -3
- package/skinny/dist/plume/menu/index.js +165 -165
- package/skinny/dist/plume/menu/menu-group.d.ts +23 -23
- package/skinny/dist/plume/menu/menu-item.d.ts +23 -23
- package/skinny/dist/plume/menu/menu.d.ts +39 -39
- package/skinny/dist/plume/menu-button/DropdownMenu.d.ts +34 -34
- package/skinny/dist/plume/menu-button/index.d.ts +2 -2
- package/skinny/dist/plume/menu-button/index.js +125 -125
- package/skinny/dist/plume/menu-button/index.js.map +1 -1
- package/skinny/dist/plume/menu-button/menu-button.d.ts +72 -72
- package/skinny/dist/plume/menu-button/menu-trigger.d.ts +21 -21
- package/skinny/dist/plume/plume-utils.d.ts +41 -41
- package/skinny/dist/plume/props-utils.d.ts +15 -15
- package/skinny/dist/plume/select/context.d.ts +3 -3
- package/skinny/dist/plume/select/index.d.ts +4 -4
- package/skinny/dist/plume/select/index.js +250 -250
- package/skinny/dist/plume/select/index.js.map +1 -1
- package/skinny/dist/plume/select/select-option-group.d.ts +23 -23
- package/skinny/dist/plume/select/select-option.d.ts +23 -23
- package/skinny/dist/plume/select/select.d.ts +111 -111
- package/skinny/dist/plume/switch/index.d.ts +39 -39
- package/skinny/dist/plume/switch/index.js +61 -61
- package/skinny/dist/plume/text-input/index.d.ts +36 -36
- package/skinny/dist/plume/text-input/index.js +45 -45
- package/skinny/dist/plume/triggered-overlay/context.d.ts +14 -14
- package/skinny/dist/plume/triggered-overlay/index.d.ts +2 -2
- package/skinny/dist/plume/triggered-overlay/index.js +100 -100
- package/skinny/dist/plume/triggered-overlay/index.js.map +1 -1
- package/skinny/dist/plume/triggered-overlay/triggered-overlay.d.ts +24 -24
- package/skinny/dist/{plume-utils-7d68bcc0.js → plume-utils-e699cd08.js} +30 -30
- package/skinny/dist/{plume-utils-7d68bcc0.js.map → plume-utils-e699cd08.js.map} +1 -1
- package/skinny/dist/{props-utils-9f9c761a.js → props-utils-9d74371f.js} +4 -4
- package/skinny/dist/{props-utils-9f9c761a.js.map → props-utils-9d74371f.js.map} +1 -1
- package/skinny/dist/query/index.d.ts +1 -1
- package/skinny/dist/{react-utils-ee4e03ba.js → react-utils-5ff031c2.js} +195 -195
- package/skinny/dist/{react-utils-ee4e03ba.js.map → react-utils-5ff031c2.js.map} +1 -1
- package/skinny/dist/react-utils.d.ts +21 -21
- package/skinny/dist/react-utils.spec.d.ts +1 -1
- package/skinny/dist/render/PlasmicHead/index.d.ts +37 -37
- package/skinny/dist/render/PlasmicHead/index.js +54 -54
- package/skinny/dist/render/PlasmicIcon.d.ts +4 -4
- package/skinny/dist/render/PlasmicImg/index.d.ts +81 -81
- package/skinny/dist/render/PlasmicImg/index.js +297 -297
- package/skinny/dist/render/PlasmicLink.d.ts +2 -2
- package/skinny/dist/render/PlasmicSlot.d.ts +11 -11
- package/skinny/dist/render/Stack.d.ts +51 -51
- package/skinny/dist/render/elements.d.ts +74 -74
- package/skinny/dist/render/global-variants.d.ts +1 -1
- package/skinny/dist/render/screen-variants.d.ts +5 -5
- package/skinny/dist/render/ssr.d.ts +21 -21
- package/skinny/dist/render/translation.d.ts +19 -19
- package/skinny/dist/render/triggers.d.ts +39 -39
- package/skinny/dist/{ssr-c9834f50.js → ssr-8625df04.js} +107 -107
- package/skinny/dist/{ssr-c9834f50.js.map → ssr-8625df04.js.map} +1 -1
- package/skinny/dist/states/errors.d.ts +13 -13
- package/skinny/dist/states/graph.d.ts +25 -25
- package/skinny/dist/states/helpers.d.ts +43 -43
- package/skinny/dist/states/index.d.ts +4 -4
- package/skinny/dist/states/types.d.ts +66 -66
- package/skinny/dist/states/valtio.d.ts +10 -10
- package/skinny/dist/states/vanilla.d.ts +3 -3
- package/skinny/dist/stories/PlasmicImg.stories.d.ts +6 -6
- package/skinny/dist/stories/UseDollarState.stories.d.ts +78 -78
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import { b as __assign, p as pick, d as __spreadArray, e as __read, c as __rest } from '../../common-
|
|
1
|
+
import { b as __assign, p as pick, d as __spreadArray, e as __read, c as __rest } from '../../common-ed411407.js';
|
|
2
2
|
import { useMenu as useMenu$1, useMenuSection, useMenuItem as useMenuItem$1 } from '@react-aria/menu';
|
|
3
3
|
import { useTreeState } from '@react-stately/tree';
|
|
4
4
|
import * as React from 'react';
|
|
5
|
-
import { m as mergeProps } from '../../react-utils-
|
|
6
|
-
import { a as useEnsureSSRProvider } from '../../ssr-
|
|
7
|
-
import { r as renderCollectionNode, u as useDerivedItemsFromChildren, a as renderAsCollectionChild } from '../../collection-utils-
|
|
8
|
-
import { n as noOutline, m as mergeVariantToggles } from '../../plume-utils-
|
|
9
|
-
import { g as getStyleProps } from '../../props-utils-
|
|
5
|
+
import { m as mergeProps } from '../../react-utils-5ff031c2.js';
|
|
6
|
+
import { a as useEnsureSSRProvider } from '../../ssr-8625df04.js';
|
|
7
|
+
import { r as renderCollectionNode, u as useDerivedItemsFromChildren, a as renderAsCollectionChild } from '../../collection-utils-2f28e4eb.js';
|
|
8
|
+
import { n as noOutline, m as mergeVariantToggles } from '../../plume-utils-e699cd08.js';
|
|
9
|
+
import { g as getStyleProps } from '../../props-utils-9d74371f.js';
|
|
10
10
|
import { T as TriggeredOverlayContext } from '../../context-034b8d25.js';
|
|
11
11
|
import { useSeparator } from '@react-aria/separator';
|
|
12
12
|
import 'classnames';
|
|
@@ -17,169 +17,169 @@ import '@react-stately/collections';
|
|
|
17
17
|
|
|
18
18
|
var MenuContext = React.createContext(undefined);
|
|
19
19
|
|
|
20
|
-
var COLLECTION_OPTS = {
|
|
21
|
-
itemPlumeType: "menu-item",
|
|
22
|
-
sectionPlumeType: "menu-group"
|
|
23
|
-
};
|
|
24
|
-
/**
|
|
25
|
-
* Converts props from BaseMenuProps to react-aria's useMenu() props.
|
|
26
|
-
*/
|
|
27
|
-
function asAriaMenuProps(props) {
|
|
28
|
-
var children = props.children, rest = __rest(props, ["children"]);
|
|
29
|
-
var _a = useDerivedItemsFromChildren(children, __assign(__assign({}, COLLECTION_OPTS), { invalidChildError: "Can only use Menu.Item and Menu.Group as children to Menu", requireItemValue: false })), items = _a.items, disabledKeys = _a.disabledKeys;
|
|
30
|
-
var collectionChildRenderer = React.useCallback(function (child) { return renderAsCollectionChild(child, COLLECTION_OPTS); }, []);
|
|
31
|
-
return {
|
|
32
|
-
ariaProps: __assign(__assign({}, rest), { children: collectionChildRenderer, items: items, disabledKeys: disabledKeys })
|
|
33
|
-
};
|
|
34
|
-
}
|
|
35
|
-
function useMenu(plasmicClass, props, config, ref) {
|
|
36
|
-
var _a, _b;
|
|
37
|
-
if (ref === void 0) { ref = null; }
|
|
38
|
-
useEnsureSSRProvider();
|
|
39
|
-
var ariaProps = asAriaMenuProps(props).ariaProps;
|
|
40
|
-
var triggerContext = React.useContext(TriggeredOverlayContext);
|
|
41
|
-
var rootRef = React.useRef(null);
|
|
42
|
-
var state = useTreeState(ariaProps);
|
|
43
|
-
var menuListRef = React.useRef(null);
|
|
44
|
-
var menuProps = useMenu$1(__assign(__assign({}, ariaProps), { autoFocus: triggerContext === null || triggerContext === void 0 ? void 0 : triggerContext.autoFocus }), state, menuListRef).menuProps;
|
|
45
|
-
var contextValue = React.useMemo(function () { return ({ state: state, menuProps: props }); }, [
|
|
46
|
-
state,
|
|
47
|
-
props,
|
|
48
|
-
]);
|
|
49
|
-
var variants = __assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps), false)));
|
|
50
|
-
var overrides = (_a = {},
|
|
51
|
-
_a[config.root] = {
|
|
52
|
-
props: mergeProps(getStyleProps(props), {
|
|
53
|
-
ref: rootRef
|
|
54
|
-
})
|
|
55
|
-
},
|
|
56
|
-
_a[config.itemsContainer] = {
|
|
57
|
-
as: "ul",
|
|
58
|
-
props: mergeProps(menuProps, {
|
|
59
|
-
ref: menuListRef,
|
|
60
|
-
style: __assign({}, noOutline())
|
|
61
|
-
})
|
|
62
|
-
},
|
|
63
|
-
_a);
|
|
64
|
-
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps), false))), (_b = {}, _b[config.itemsSlot] = (React.createElement(MenuContext.Provider, { value: contextValue }, Array.from(state.collection).map(function (node) { return renderCollectionNode(node); }))), _b));
|
|
65
|
-
var plumeState = React.useMemo(function () { return ({
|
|
66
|
-
getFocusedValue: function () { return state.selectionManager.focusedKey; },
|
|
67
|
-
setFocusedValue: function (value) {
|
|
68
|
-
return state.selectionManager.setFocusedKey(value);
|
|
69
|
-
}
|
|
70
|
-
}); }, [state]);
|
|
71
|
-
React.useImperativeHandle(ref, function () { return ({
|
|
72
|
-
getRoot: function () { return rootRef.current; },
|
|
73
|
-
getFocusedValue: function () { return plumeState.getFocusedValue(); },
|
|
74
|
-
setFocusedValue: function (key) { return plumeState.setFocusedValue(key); }
|
|
75
|
-
}); }, [rootRef, plumeState]);
|
|
76
|
-
return {
|
|
77
|
-
plasmicProps: {
|
|
78
|
-
variants: variants,
|
|
79
|
-
args: args,
|
|
80
|
-
overrides: overrides
|
|
81
|
-
},
|
|
82
|
-
state: plumeState
|
|
83
|
-
};
|
|
20
|
+
var COLLECTION_OPTS = {
|
|
21
|
+
itemPlumeType: "menu-item",
|
|
22
|
+
sectionPlumeType: "menu-group",
|
|
23
|
+
};
|
|
24
|
+
/**
|
|
25
|
+
* Converts props from BaseMenuProps to react-aria's useMenu() props.
|
|
26
|
+
*/
|
|
27
|
+
function asAriaMenuProps(props) {
|
|
28
|
+
var children = props.children, rest = __rest(props, ["children"]);
|
|
29
|
+
var _a = useDerivedItemsFromChildren(children, __assign(__assign({}, COLLECTION_OPTS), { invalidChildError: "Can only use Menu.Item and Menu.Group as children to Menu", requireItemValue: false })), items = _a.items, disabledKeys = _a.disabledKeys;
|
|
30
|
+
var collectionChildRenderer = React.useCallback(function (child) { return renderAsCollectionChild(child, COLLECTION_OPTS); }, []);
|
|
31
|
+
return {
|
|
32
|
+
ariaProps: __assign(__assign({}, rest), { children: collectionChildRenderer, items: items, disabledKeys: disabledKeys }),
|
|
33
|
+
};
|
|
34
|
+
}
|
|
35
|
+
function useMenu(plasmicClass, props, config, ref) {
|
|
36
|
+
var _a, _b;
|
|
37
|
+
if (ref === void 0) { ref = null; }
|
|
38
|
+
useEnsureSSRProvider();
|
|
39
|
+
var ariaProps = asAriaMenuProps(props).ariaProps;
|
|
40
|
+
var triggerContext = React.useContext(TriggeredOverlayContext);
|
|
41
|
+
var rootRef = React.useRef(null);
|
|
42
|
+
var state = useTreeState(ariaProps);
|
|
43
|
+
var menuListRef = React.useRef(null);
|
|
44
|
+
var menuProps = useMenu$1(__assign(__assign({}, ariaProps), { autoFocus: triggerContext === null || triggerContext === void 0 ? void 0 : triggerContext.autoFocus }), state, menuListRef).menuProps;
|
|
45
|
+
var contextValue = React.useMemo(function () { return ({ state: state, menuProps: props }); }, [
|
|
46
|
+
state,
|
|
47
|
+
props,
|
|
48
|
+
]);
|
|
49
|
+
var variants = __assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps), false)));
|
|
50
|
+
var overrides = (_a = {},
|
|
51
|
+
_a[config.root] = {
|
|
52
|
+
props: mergeProps(getStyleProps(props), {
|
|
53
|
+
ref: rootRef,
|
|
54
|
+
}),
|
|
55
|
+
},
|
|
56
|
+
_a[config.itemsContainer] = {
|
|
57
|
+
as: "ul",
|
|
58
|
+
props: mergeProps(menuProps, {
|
|
59
|
+
ref: menuListRef,
|
|
60
|
+
style: __assign({}, noOutline()),
|
|
61
|
+
}),
|
|
62
|
+
},
|
|
63
|
+
_a);
|
|
64
|
+
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps), false))), (_b = {}, _b[config.itemsSlot] = (React.createElement(MenuContext.Provider, { value: contextValue }, Array.from(state.collection).map(function (node) { return renderCollectionNode(node); }))), _b));
|
|
65
|
+
var plumeState = React.useMemo(function () { return ({
|
|
66
|
+
getFocusedValue: function () { return state.selectionManager.focusedKey; },
|
|
67
|
+
setFocusedValue: function (value) {
|
|
68
|
+
return state.selectionManager.setFocusedKey(value);
|
|
69
|
+
},
|
|
70
|
+
}); }, [state]);
|
|
71
|
+
React.useImperativeHandle(ref, function () { return ({
|
|
72
|
+
getRoot: function () { return rootRef.current; },
|
|
73
|
+
getFocusedValue: function () { return plumeState.getFocusedValue(); },
|
|
74
|
+
setFocusedValue: function (key) { return plumeState.setFocusedValue(key); },
|
|
75
|
+
}); }, [rootRef, plumeState]);
|
|
76
|
+
return {
|
|
77
|
+
plasmicProps: {
|
|
78
|
+
variants: variants,
|
|
79
|
+
args: args,
|
|
80
|
+
overrides: overrides,
|
|
81
|
+
},
|
|
82
|
+
state: plumeState,
|
|
83
|
+
};
|
|
84
84
|
}
|
|
85
85
|
|
|
86
|
-
function useMenuGroup(plasmicClass, props, config) {
|
|
87
|
-
var _a, _b;
|
|
88
|
-
var context = React.useContext(MenuContext);
|
|
89
|
-
var node = props._node;
|
|
90
|
-
if (!context || !node) {
|
|
91
|
-
{
|
|
92
|
-
throw new Error("You can only use a Menu.Group within a Menu component.");
|
|
93
|
-
}
|
|
94
|
-
}
|
|
95
|
-
var _c = useMenuSection({
|
|
96
|
-
heading: props.title,
|
|
97
|
-
"aria-label": props["aria-label"]
|
|
98
|
-
}), headingProps = _c.headingProps, groupProps = _c.groupProps;
|
|
99
|
-
var separatorProps = useSeparator({
|
|
100
|
-
elementType: "li"
|
|
101
|
-
}).separatorProps;
|
|
102
|
-
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps), false))), mergeVariantToggles({ def: config.noTitleVariant, active: !props.title }, {
|
|
103
|
-
def: config.isFirstVariant,
|
|
104
|
-
active: context.state.collection.getFirstKey() === node.key
|
|
105
|
-
}));
|
|
106
|
-
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps), false))), (_a = {}, _a[config.titleSlot] = props.title, _a[config.itemsSlot] = Array.from(node.childNodes).map(function (childNode) {
|
|
107
|
-
return renderCollectionNode(childNode);
|
|
108
|
-
}), _a));
|
|
109
|
-
var overrides = (_b = {},
|
|
110
|
-
_b[config.root] = {
|
|
111
|
-
props: getStyleProps(props)
|
|
112
|
-
},
|
|
113
|
-
_b[config.separator] = {
|
|
114
|
-
props: __assign({}, separatorProps),
|
|
115
|
-
as: "li"
|
|
116
|
-
},
|
|
117
|
-
_b[config.titleContainer] = __assign({ props: __assign({ role: "presentation" }, headingProps) }, (!props.title && {
|
|
118
|
-
render: function () { return null; }
|
|
119
|
-
})),
|
|
120
|
-
_b[config.itemsContainer] = {
|
|
121
|
-
props: __assign({}, groupProps),
|
|
122
|
-
as: "ul"
|
|
123
|
-
},
|
|
124
|
-
_b);
|
|
125
|
-
return {
|
|
126
|
-
plasmicProps: {
|
|
127
|
-
variants: variants,
|
|
128
|
-
args: args,
|
|
129
|
-
overrides: overrides
|
|
130
|
-
}
|
|
131
|
-
};
|
|
86
|
+
function useMenuGroup(plasmicClass, props, config) {
|
|
87
|
+
var _a, _b;
|
|
88
|
+
var context = React.useContext(MenuContext);
|
|
89
|
+
var node = props._node;
|
|
90
|
+
if (!context || !node) {
|
|
91
|
+
{
|
|
92
|
+
throw new Error("You can only use a Menu.Group within a Menu component.");
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
var _c = useMenuSection({
|
|
96
|
+
heading: props.title,
|
|
97
|
+
"aria-label": props["aria-label"],
|
|
98
|
+
}), headingProps = _c.headingProps, groupProps = _c.groupProps;
|
|
99
|
+
var separatorProps = useSeparator({
|
|
100
|
+
elementType: "li",
|
|
101
|
+
}).separatorProps;
|
|
102
|
+
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps), false))), mergeVariantToggles({ def: config.noTitleVariant, active: !props.title }, {
|
|
103
|
+
def: config.isFirstVariant,
|
|
104
|
+
active: context.state.collection.getFirstKey() === node.key,
|
|
105
|
+
}));
|
|
106
|
+
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps), false))), (_a = {}, _a[config.titleSlot] = props.title, _a[config.itemsSlot] = Array.from(node.childNodes).map(function (childNode) {
|
|
107
|
+
return renderCollectionNode(childNode);
|
|
108
|
+
}), _a));
|
|
109
|
+
var overrides = (_b = {},
|
|
110
|
+
_b[config.root] = {
|
|
111
|
+
props: getStyleProps(props),
|
|
112
|
+
},
|
|
113
|
+
_b[config.separator] = {
|
|
114
|
+
props: __assign({}, separatorProps),
|
|
115
|
+
as: "li",
|
|
116
|
+
},
|
|
117
|
+
_b[config.titleContainer] = __assign({ props: __assign({ role: "presentation" }, headingProps) }, (!props.title && {
|
|
118
|
+
render: function () { return null; },
|
|
119
|
+
})),
|
|
120
|
+
_b[config.itemsContainer] = {
|
|
121
|
+
props: __assign({}, groupProps),
|
|
122
|
+
as: "ul",
|
|
123
|
+
},
|
|
124
|
+
_b);
|
|
125
|
+
return {
|
|
126
|
+
plasmicProps: {
|
|
127
|
+
variants: variants,
|
|
128
|
+
args: args,
|
|
129
|
+
overrides: overrides,
|
|
130
|
+
},
|
|
131
|
+
};
|
|
132
132
|
}
|
|
133
133
|
|
|
134
|
-
function useMenuItem(plasmicClass, props, config) {
|
|
135
|
-
var _a, _b;
|
|
136
|
-
var menuContext = React.useContext(MenuContext);
|
|
137
|
-
var triggerContext = React.useContext(TriggeredOverlayContext);
|
|
138
|
-
if (!menuContext) {
|
|
139
|
-
{
|
|
140
|
-
throw new Error("You can only use a Menu.Item within a Menu component.");
|
|
141
|
-
}
|
|
142
|
-
}
|
|
143
|
-
var children = props.children, onAction = props.onAction;
|
|
144
|
-
var state = menuContext.state, menuProps = menuContext.menuProps;
|
|
145
|
-
// We pass in the Node secretly as an undocumented prop from <Select />
|
|
146
|
-
var node = props._node;
|
|
147
|
-
var isDisabled = state.disabledKeys.has(node.key);
|
|
148
|
-
var isHighlighted = state.selectionManager.isFocused &&
|
|
149
|
-
state.selectionManager.focusedKey === node.key;
|
|
150
|
-
var ref = React.useRef(null);
|
|
151
|
-
var _c = useMenuItem$1(mergeProps({
|
|
152
|
-
// We need to merge both the onAction on MenuItem and the onAction
|
|
153
|
-
// on Menu
|
|
154
|
-
onAction: onAction
|
|
155
|
-
}, {
|
|
156
|
-
onAction: menuProps.onAction,
|
|
157
|
-
onClose: triggerContext === null || triggerContext === void 0 ? void 0 : triggerContext.state.close
|
|
158
|
-
}, {
|
|
159
|
-
isDisabled: isDisabled,
|
|
160
|
-
"aria-label": node && node["aria-label"],
|
|
161
|
-
key: node.key,
|
|
162
|
-
isVirtualized: false,
|
|
163
|
-
closeOnSelect: true
|
|
164
|
-
}), state, ref), menuItemProps = _c.menuItemProps, labelProps = _c.labelProps;
|
|
165
|
-
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps), false))), mergeVariantToggles({ def: config.isDisabledVariant, active: isDisabled }, { def: config.isHighlightedVariant, active: isHighlighted }));
|
|
166
|
-
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps), false))), (_a = {}, _a[config.labelSlot] = children, _a));
|
|
167
|
-
var overrides = (_b = {},
|
|
168
|
-
_b[config.root] = {
|
|
169
|
-
as: "li",
|
|
170
|
-
props: mergeProps(menuItemProps, { ref: ref, style: noOutline() })
|
|
171
|
-
},
|
|
172
|
-
_b[config.labelContainer] = {
|
|
173
|
-
props: __assign({}, labelProps)
|
|
174
|
-
},
|
|
175
|
-
_b);
|
|
176
|
-
return {
|
|
177
|
-
plasmicProps: {
|
|
178
|
-
variants: variants,
|
|
179
|
-
args: args,
|
|
180
|
-
overrides: overrides
|
|
181
|
-
}
|
|
182
|
-
};
|
|
134
|
+
function useMenuItem(plasmicClass, props, config) {
|
|
135
|
+
var _a, _b;
|
|
136
|
+
var menuContext = React.useContext(MenuContext);
|
|
137
|
+
var triggerContext = React.useContext(TriggeredOverlayContext);
|
|
138
|
+
if (!menuContext) {
|
|
139
|
+
{
|
|
140
|
+
throw new Error("You can only use a Menu.Item within a Menu component.");
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
var children = props.children, onAction = props.onAction;
|
|
144
|
+
var state = menuContext.state, menuProps = menuContext.menuProps;
|
|
145
|
+
// We pass in the Node secretly as an undocumented prop from <Select />
|
|
146
|
+
var node = props._node;
|
|
147
|
+
var isDisabled = state.disabledKeys.has(node.key);
|
|
148
|
+
var isHighlighted = state.selectionManager.isFocused &&
|
|
149
|
+
state.selectionManager.focusedKey === node.key;
|
|
150
|
+
var ref = React.useRef(null);
|
|
151
|
+
var _c = useMenuItem$1(mergeProps({
|
|
152
|
+
// We need to merge both the onAction on MenuItem and the onAction
|
|
153
|
+
// on Menu
|
|
154
|
+
onAction: onAction,
|
|
155
|
+
}, {
|
|
156
|
+
onAction: menuProps.onAction,
|
|
157
|
+
onClose: triggerContext === null || triggerContext === void 0 ? void 0 : triggerContext.state.close,
|
|
158
|
+
}, {
|
|
159
|
+
isDisabled: isDisabled,
|
|
160
|
+
"aria-label": node && node["aria-label"],
|
|
161
|
+
key: node.key,
|
|
162
|
+
isVirtualized: false,
|
|
163
|
+
closeOnSelect: true,
|
|
164
|
+
}), state, ref), menuItemProps = _c.menuItemProps, labelProps = _c.labelProps;
|
|
165
|
+
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps), false))), mergeVariantToggles({ def: config.isDisabledVariant, active: isDisabled }, { def: config.isHighlightedVariant, active: isHighlighted }));
|
|
166
|
+
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps), false))), (_a = {}, _a[config.labelSlot] = children, _a));
|
|
167
|
+
var overrides = (_b = {},
|
|
168
|
+
_b[config.root] = {
|
|
169
|
+
as: "li",
|
|
170
|
+
props: mergeProps(menuItemProps, { ref: ref, style: noOutline() }),
|
|
171
|
+
},
|
|
172
|
+
_b[config.labelContainer] = {
|
|
173
|
+
props: __assign({}, labelProps),
|
|
174
|
+
},
|
|
175
|
+
_b);
|
|
176
|
+
return {
|
|
177
|
+
plasmicProps: {
|
|
178
|
+
variants: variants,
|
|
179
|
+
args: args,
|
|
180
|
+
overrides: overrides,
|
|
181
|
+
},
|
|
182
|
+
};
|
|
183
183
|
}
|
|
184
184
|
|
|
185
185
|
export { useMenu, useMenuGroup, useMenuItem };
|
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
import { SectionLikeProps } from "../collection-utils";
|
|
2
|
-
import { AnyPlasmicClass, PlasmicClassArgs, PlasmicClassOverrides, PlasmicClassVariants } from "../plume-utils";
|
|
3
|
-
import { StyleProps } from "../props-utils";
|
|
4
|
-
export interface BaseMenuGroupProps extends SectionLikeProps, StyleProps {
|
|
5
|
-
}
|
|
6
|
-
interface MenuGroupConfig<C extends AnyPlasmicClass> {
|
|
7
|
-
noTitleVariant: PlasmicClassVariants<C>;
|
|
8
|
-
isFirstVariant: PlasmicClassVariants<C>;
|
|
9
|
-
itemsSlot: keyof PlasmicClassArgs<C>;
|
|
10
|
-
titleSlot: keyof PlasmicClassArgs<C>;
|
|
11
|
-
root: keyof PlasmicClassOverrides<C>;
|
|
12
|
-
separator: keyof PlasmicClassOverrides<C>;
|
|
13
|
-
titleContainer: keyof PlasmicClassOverrides<C>;
|
|
14
|
-
itemsContainer: keyof PlasmicClassOverrides<C>;
|
|
15
|
-
}
|
|
16
|
-
export declare function useMenuGroup<P extends BaseMenuGroupProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: MenuGroupConfig<C>): {
|
|
17
|
-
plasmicProps: {
|
|
18
|
-
variants: PlasmicClassVariants<C>;
|
|
19
|
-
args: PlasmicClassArgs<C>;
|
|
20
|
-
overrides: PlasmicClassOverrides<C>;
|
|
21
|
-
};
|
|
22
|
-
};
|
|
23
|
-
export {};
|
|
1
|
+
import { SectionLikeProps } from "../collection-utils";
|
|
2
|
+
import { AnyPlasmicClass, PlasmicClassArgs, PlasmicClassOverrides, PlasmicClassVariants } from "../plume-utils";
|
|
3
|
+
import { StyleProps } from "../props-utils";
|
|
4
|
+
export interface BaseMenuGroupProps extends SectionLikeProps, StyleProps {
|
|
5
|
+
}
|
|
6
|
+
interface MenuGroupConfig<C extends AnyPlasmicClass> {
|
|
7
|
+
noTitleVariant: PlasmicClassVariants<C>;
|
|
8
|
+
isFirstVariant: PlasmicClassVariants<C>;
|
|
9
|
+
itemsSlot: keyof PlasmicClassArgs<C>;
|
|
10
|
+
titleSlot: keyof PlasmicClassArgs<C>;
|
|
11
|
+
root: keyof PlasmicClassOverrides<C>;
|
|
12
|
+
separator: keyof PlasmicClassOverrides<C>;
|
|
13
|
+
titleContainer: keyof PlasmicClassOverrides<C>;
|
|
14
|
+
itemsContainer: keyof PlasmicClassOverrides<C>;
|
|
15
|
+
}
|
|
16
|
+
export declare function useMenuGroup<P extends BaseMenuGroupProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: MenuGroupConfig<C>): {
|
|
17
|
+
plasmicProps: {
|
|
18
|
+
variants: PlasmicClassVariants<C>;
|
|
19
|
+
args: PlasmicClassArgs<C>;
|
|
20
|
+
overrides: PlasmicClassOverrides<C>;
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
|
+
export {};
|
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
import { ItemLikeProps } from "../collection-utils";
|
|
2
|
-
import { AnyPlasmicClass, PlasmicClassArgs, PlasmicClassOverrides, PlasmicClassVariants, VariantDef } from "../plume-utils";
|
|
3
|
-
export interface BaseMenuItemProps extends ItemLikeProps {
|
|
4
|
-
/**
|
|
5
|
-
* Called when this item is selected
|
|
6
|
-
*/
|
|
7
|
-
onAction?: (key: string) => void;
|
|
8
|
-
}
|
|
9
|
-
interface MenuItemConfig<C extends AnyPlasmicClass> {
|
|
10
|
-
isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
11
|
-
isHighlightedVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
12
|
-
labelSlot: keyof PlasmicClassArgs<C>;
|
|
13
|
-
root: keyof PlasmicClassOverrides<C>;
|
|
14
|
-
labelContainer: keyof PlasmicClassOverrides<C>;
|
|
15
|
-
}
|
|
16
|
-
export declare function useMenuItem<P extends BaseMenuItemProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: MenuItemConfig<C>): {
|
|
17
|
-
plasmicProps: {
|
|
18
|
-
variants: PlasmicClassVariants<C>;
|
|
19
|
-
args: PlasmicClassArgs<C>;
|
|
20
|
-
overrides: PlasmicClassOverrides<C>;
|
|
21
|
-
};
|
|
22
|
-
};
|
|
23
|
-
export {};
|
|
1
|
+
import { ItemLikeProps } from "../collection-utils";
|
|
2
|
+
import { AnyPlasmicClass, PlasmicClassArgs, PlasmicClassOverrides, PlasmicClassVariants, VariantDef } from "../plume-utils";
|
|
3
|
+
export interface BaseMenuItemProps extends ItemLikeProps {
|
|
4
|
+
/**
|
|
5
|
+
* Called when this item is selected
|
|
6
|
+
*/
|
|
7
|
+
onAction?: (key: string) => void;
|
|
8
|
+
}
|
|
9
|
+
interface MenuItemConfig<C extends AnyPlasmicClass> {
|
|
10
|
+
isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
11
|
+
isHighlightedVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
12
|
+
labelSlot: keyof PlasmicClassArgs<C>;
|
|
13
|
+
root: keyof PlasmicClassOverrides<C>;
|
|
14
|
+
labelContainer: keyof PlasmicClassOverrides<C>;
|
|
15
|
+
}
|
|
16
|
+
export declare function useMenuItem<P extends BaseMenuItemProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: MenuItemConfig<C>): {
|
|
17
|
+
plasmicProps: {
|
|
18
|
+
variants: PlasmicClassVariants<C>;
|
|
19
|
+
args: PlasmicClassArgs<C>;
|
|
20
|
+
overrides: PlasmicClassOverrides<C>;
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
|
+
export {};
|
|
@@ -1,39 +1,39 @@
|
|
|
1
|
-
import { AriaLabelingProps, DOMProps } from "@react-types/shared";
|
|
2
|
-
import * as React from "react";
|
|
3
|
-
import { AnyPlasmicClass, PlasmicClassArgs, PlasmicClassOverrides, PlasmicClassVariants, VariantDef } from "../plume-utils";
|
|
4
|
-
import { StyleProps } from "../props-utils";
|
|
5
|
-
export interface BaseMenuProps extends DOMProps, AriaLabelingProps, StyleProps {
|
|
6
|
-
/**
|
|
7
|
-
* List of `Menu.Item`s or `Menu.Group`s that make up the menu
|
|
8
|
-
*/
|
|
9
|
-
children?: React.ReactNode;
|
|
10
|
-
/**
|
|
11
|
-
* Called with the value of a `Menu.Item` when it is selected.
|
|
12
|
-
*/
|
|
13
|
-
onAction?: (value: string) => void;
|
|
14
|
-
}
|
|
15
|
-
export type MenuRef = React.Ref<MenuRefValue>;
|
|
16
|
-
export interface MenuRefValue extends MenuState {
|
|
17
|
-
getRoot: () => HTMLElement | null;
|
|
18
|
-
}
|
|
19
|
-
export interface MenuConfig<C extends AnyPlasmicClass> {
|
|
20
|
-
isPlacedTopVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
21
|
-
isPlacedBottomVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
22
|
-
isPlacedLeftVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
23
|
-
isPlacedRightVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
24
|
-
itemsSlot: keyof PlasmicClassArgs<C>;
|
|
25
|
-
itemsContainer: keyof PlasmicClassOverrides<C>;
|
|
26
|
-
root: keyof PlasmicClassOverrides<C>;
|
|
27
|
-
}
|
|
28
|
-
export interface MenuState {
|
|
29
|
-
getFocusedValue: () => string | null;
|
|
30
|
-
setFocusedValue: (value: string) => void;
|
|
31
|
-
}
|
|
32
|
-
export declare function useMenu<P extends BaseMenuProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: MenuConfig<C>, ref?: MenuRef): {
|
|
33
|
-
plasmicProps: {
|
|
34
|
-
variants: PlasmicClassVariants<C>;
|
|
35
|
-
args: PlasmicClassArgs<C>;
|
|
36
|
-
overrides: PlasmicClassOverrides<C>;
|
|
37
|
-
};
|
|
38
|
-
state: MenuState;
|
|
39
|
-
};
|
|
1
|
+
import { AriaLabelingProps, DOMProps } from "@react-types/shared";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
import { AnyPlasmicClass, PlasmicClassArgs, PlasmicClassOverrides, PlasmicClassVariants, VariantDef } from "../plume-utils";
|
|
4
|
+
import { StyleProps } from "../props-utils";
|
|
5
|
+
export interface BaseMenuProps extends DOMProps, AriaLabelingProps, StyleProps {
|
|
6
|
+
/**
|
|
7
|
+
* List of `Menu.Item`s or `Menu.Group`s that make up the menu
|
|
8
|
+
*/
|
|
9
|
+
children?: React.ReactNode;
|
|
10
|
+
/**
|
|
11
|
+
* Called with the value of a `Menu.Item` when it is selected.
|
|
12
|
+
*/
|
|
13
|
+
onAction?: (value: string) => void;
|
|
14
|
+
}
|
|
15
|
+
export type MenuRef = React.Ref<MenuRefValue>;
|
|
16
|
+
export interface MenuRefValue extends MenuState {
|
|
17
|
+
getRoot: () => HTMLElement | null;
|
|
18
|
+
}
|
|
19
|
+
export interface MenuConfig<C extends AnyPlasmicClass> {
|
|
20
|
+
isPlacedTopVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
21
|
+
isPlacedBottomVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
22
|
+
isPlacedLeftVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
23
|
+
isPlacedRightVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
24
|
+
itemsSlot: keyof PlasmicClassArgs<C>;
|
|
25
|
+
itemsContainer: keyof PlasmicClassOverrides<C>;
|
|
26
|
+
root: keyof PlasmicClassOverrides<C>;
|
|
27
|
+
}
|
|
28
|
+
export interface MenuState {
|
|
29
|
+
getFocusedValue: () => string | null;
|
|
30
|
+
setFocusedValue: (value: string) => void;
|
|
31
|
+
}
|
|
32
|
+
export declare function useMenu<P extends BaseMenuProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: MenuConfig<C>, ref?: MenuRef): {
|
|
33
|
+
plasmicProps: {
|
|
34
|
+
variants: PlasmicClassVariants<C>;
|
|
35
|
+
args: PlasmicClassArgs<C>;
|
|
36
|
+
overrides: PlasmicClassOverrides<C>;
|
|
37
|
+
};
|
|
38
|
+
state: MenuState;
|
|
39
|
+
};
|
|
@@ -1,34 +1,34 @@
|
|
|
1
|
-
import { Placement } from "@react-types/overlays";
|
|
2
|
-
import * as React from "react";
|
|
3
|
-
import { BaseMenuProps } from "../menu/menu";
|
|
4
|
-
export interface DropdownMenuProps {
|
|
5
|
-
/**
|
|
6
|
-
* A ReactElement that takes in a `ref` as well as the usual mouse and
|
|
7
|
-
* pointer events. The dropdown menu will be positioned relative to this
|
|
8
|
-
* trigger.
|
|
9
|
-
*/
|
|
10
|
-
children: React.ReactElement;
|
|
11
|
-
/**
|
|
12
|
-
* The menu to show; must be either a ReactElement of Menu type, or
|
|
13
|
-
* a function that creates one if you prefer to delay creating it until
|
|
14
|
-
* the menu has been triggered.
|
|
15
|
-
*/
|
|
16
|
-
menu: React.ReactElement<BaseMenuProps> | (() => React.ReactElement<BaseMenuProps>);
|
|
17
|
-
/**
|
|
18
|
-
* Where to place the menu relative to the trigger.
|
|
19
|
-
*/
|
|
20
|
-
placement?: Placement;
|
|
21
|
-
/**
|
|
22
|
-
* Whether the menu is currently shown.
|
|
23
|
-
*/
|
|
24
|
-
isOpen?: boolean;
|
|
25
|
-
/**
|
|
26
|
-
* Uncontrolled open state.
|
|
27
|
-
*/
|
|
28
|
-
defaultOpen?: boolean;
|
|
29
|
-
/**
|
|
30
|
-
* Event handler fired when Menu's open state changes
|
|
31
|
-
*/
|
|
32
|
-
onOpenChange?: (isOpen: boolean) => void;
|
|
33
|
-
}
|
|
34
|
-
export declare function DropdownMenu(props: DropdownMenuProps): JSX.Element;
|
|
1
|
+
import { Placement } from "@react-types/overlays";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
import { BaseMenuProps } from "../menu/menu";
|
|
4
|
+
export interface DropdownMenuProps {
|
|
5
|
+
/**
|
|
6
|
+
* A ReactElement that takes in a `ref` as well as the usual mouse and
|
|
7
|
+
* pointer events. The dropdown menu will be positioned relative to this
|
|
8
|
+
* trigger.
|
|
9
|
+
*/
|
|
10
|
+
children: React.ReactElement;
|
|
11
|
+
/**
|
|
12
|
+
* The menu to show; must be either a ReactElement of Menu type, or
|
|
13
|
+
* a function that creates one if you prefer to delay creating it until
|
|
14
|
+
* the menu has been triggered.
|
|
15
|
+
*/
|
|
16
|
+
menu: React.ReactElement<BaseMenuProps> | (() => React.ReactElement<BaseMenuProps>);
|
|
17
|
+
/**
|
|
18
|
+
* Where to place the menu relative to the trigger.
|
|
19
|
+
*/
|
|
20
|
+
placement?: Placement;
|
|
21
|
+
/**
|
|
22
|
+
* Whether the menu is currently shown.
|
|
23
|
+
*/
|
|
24
|
+
isOpen?: boolean;
|
|
25
|
+
/**
|
|
26
|
+
* Uncontrolled open state.
|
|
27
|
+
*/
|
|
28
|
+
defaultOpen?: boolean;
|
|
29
|
+
/**
|
|
30
|
+
* Event handler fired when Menu's open state changes
|
|
31
|
+
*/
|
|
32
|
+
onOpenChange?: (isOpen: boolean) => void;
|
|
33
|
+
}
|
|
34
|
+
export declare function DropdownMenu(props: DropdownMenuProps): JSX.Element;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { DropdownMenu } from "./DropdownMenu";
|
|
2
|
-
export { BaseMenuButtonProps, MenuButtonRef, MenuButtonRefValue, useMenuButton, } from "./menu-button";
|
|
1
|
+
export { DropdownMenu } from "./DropdownMenu";
|
|
2
|
+
export { BaseMenuButtonProps, MenuButtonRef, MenuButtonRefValue, useMenuButton, } from "./menu-button";
|