@luxfi/ui 7.4.10 → 7.4.12
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/accordion.cjs +107 -166
- package/dist/accordion.d.cts +18 -51
- package/dist/accordion.d.ts +18 -51
- package/dist/accordion.js +109 -166
- package/dist/alert.cjs +68 -46
- package/dist/alert.js +69 -46
- package/dist/avatar.cjs +49 -46
- package/dist/avatar.js +52 -48
- package/dist/badge.cjs +82 -49
- package/dist/badge.js +83 -50
- package/dist/checkbox.cjs +42 -75
- package/dist/checkbox.js +43 -76
- package/dist/chrome.cjs +196 -386
- package/dist/chrome.js +198 -386
- package/dist/close-button.cjs +3 -7
- package/dist/close-button.js +3 -7
- package/dist/collapsible.cjs +35 -26
- package/dist/collapsible.d.cts +2 -1
- package/dist/collapsible.d.ts +2 -1
- package/dist/collapsible.js +34 -24
- package/dist/dialog.cjs +3 -7
- package/dist/dialog.d.cts +1 -1
- package/dist/dialog.d.ts +1 -1
- package/dist/dialog.js +3 -7
- package/dist/drawer.cjs +95 -122
- package/dist/drawer.d.cts +43 -10
- package/dist/drawer.d.ts +43 -10
- package/dist/drawer.js +97 -122
- package/dist/empty-state.cjs +13 -13
- package/dist/empty-state.js +13 -13
- package/dist/expiration-selector.cjs +58 -63
- package/dist/expiration-selector.js +58 -63
- package/dist/field.cjs +60 -109
- package/dist/field.d.cts +0 -1
- package/dist/field.d.ts +0 -1
- package/dist/field.js +61 -109
- package/dist/greeks-display.cjs +48 -39
- package/dist/greeks-display.js +48 -39
- package/dist/heading.cjs +10 -17
- package/dist/heading.d.cts +0 -2
- package/dist/heading.d.ts +0 -2
- package/dist/heading.js +10 -17
- package/dist/icon-button.cjs +82 -82
- package/dist/icon-button.d.cts +16 -12
- package/dist/icon-button.d.ts +16 -12
- package/dist/icon-button.js +82 -82
- package/dist/index.cjs +1812 -2105
- package/dist/index.d.cts +1 -5
- package/dist/index.d.ts +1 -5
- package/dist/index.js +1814 -2100
- package/dist/input-group.cjs +11 -12
- package/dist/input-group.js +11 -12
- package/dist/input.cjs +27 -27
- package/dist/input.d.cts +21 -1
- package/dist/input.d.ts +21 -1
- package/dist/input.js +25 -28
- package/dist/menu.cjs +160 -271
- package/dist/menu.d.cts +41 -57
- package/dist/menu.d.ts +41 -57
- package/dist/menu.js +161 -251
- package/dist/option-chain.cjs +89 -67
- package/dist/option-chain.js +89 -67
- package/dist/option-position.cjs +88 -85
- package/dist/option-position.js +88 -85
- package/dist/pnl-diagram.cjs +20 -20
- package/dist/pnl-diagram.js +20 -20
- package/dist/popover.cjs +4 -8
- package/dist/popover.js +4 -8
- package/dist/progress.cjs +15 -22
- package/dist/progress.d.cts +6 -6
- package/dist/progress.d.ts +6 -6
- package/dist/progress.js +15 -22
- package/dist/radio.cjs +35 -67
- package/dist/radio.d.cts +18 -18
- package/dist/radio.d.ts +18 -18
- package/dist/radio.js +36 -68
- package/dist/select.cjs +40 -39
- package/dist/select.d.cts +35 -4
- package/dist/select.d.ts +35 -4
- package/dist/select.js +40 -38
- package/dist/separator.cjs +8 -33
- package/dist/separator.js +8 -33
- package/dist/slider.cjs +33 -49
- package/dist/slider.js +34 -50
- package/dist/switch.cjs +48 -55
- package/dist/switch.js +49 -56
- package/dist/tabs.cjs +108 -197
- package/dist/tabs.d.cts +16 -60
- package/dist/tabs.d.ts +16 -60
- package/dist/tabs.js +109 -196
- package/dist/tag.cjs +112 -69
- package/dist/tag.js +113 -69
- package/dist/textarea.cjs +56 -27
- package/dist/textarea.js +57 -28
- package/dist/toaster.cjs +97 -79
- package/dist/toaster.d.cts +7 -8
- package/dist/toaster.d.ts +7 -8
- package/dist/toaster.js +78 -80
- package/dist/tooltip.cjs +28 -17
- package/dist/tooltip.js +30 -18
- package/package.json +2 -16
- package/src/accordion.tsx +173 -227
- package/src/alert.tsx +78 -45
- package/src/avatar.tsx +54 -37
- package/src/badge.tsx +65 -44
- package/src/checkbox.tsx +70 -89
- package/src/close-button.tsx +3 -8
- package/src/collapsible.tsx +55 -52
- package/src/drawer.tsx +123 -115
- package/src/empty-state.tsx +21 -17
- package/src/expiration-selector.tsx +84 -66
- package/src/field.tsx +68 -124
- package/src/greeks-display.tsx +59 -51
- package/src/heading.tsx +22 -26
- package/src/icon-button.tsx +134 -141
- package/src/ink.tsx +37 -0
- package/src/input-group.tsx +59 -36
- package/src/input.tsx +41 -32
- package/src/menu.tsx +224 -397
- package/src/option-chain.tsx +154 -104
- package/src/option-position.tsx +136 -114
- package/src/pin-input.tsx +37 -29
- package/src/pnl-diagram.tsx +36 -28
- package/src/popover.tsx +1 -1
- package/src/progress.tsx +17 -21
- package/src/radio.tsx +56 -75
- package/src/select.tsx +80 -59
- package/src/separator.tsx +13 -34
- package/src/slider.tsx +43 -44
- package/src/strategy-builder.tsx +245 -156
- package/src/switch.tsx +63 -64
- package/src/tabs.tsx +166 -296
- package/src/tag.tsx +89 -51
- package/src/textarea.tsx +19 -29
- package/src/toaster.tsx +118 -86
- package/src/tooltip.tsx +21 -13
- package/tokens.css +79 -0
package/dist/menu.d.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { Menu, Text, View } from '@hanzo/gui';
|
|
1
2
|
import * as React from 'react';
|
|
2
3
|
|
|
3
4
|
interface Positioning {
|
|
@@ -15,70 +16,53 @@ interface MenuRootProps {
|
|
|
15
16
|
open: boolean;
|
|
16
17
|
}) => void;
|
|
17
18
|
readonly positioning?: Positioning;
|
|
18
|
-
readonly lazyMount?: boolean;
|
|
19
|
-
readonly unmountOnExit?: boolean;
|
|
20
19
|
readonly modal?: boolean;
|
|
21
20
|
}
|
|
22
|
-
declare const MenuRoot: (
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
declare const MenuTrigger: React.ForwardRefExoticComponent<MenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
27
|
-
interface MenuContentProps extends React.ComponentPropsWithoutRef<'div'> {
|
|
21
|
+
declare const MenuRoot: ({ children, open, defaultOpen, onOpenChange, positioning, modal, }: MenuRootProps) => React.ReactElement;
|
|
22
|
+
type MenuTriggerProps = React.ComponentProps<typeof Menu.Trigger>;
|
|
23
|
+
declare const MenuTrigger: ({ asChild, ...rest }: MenuTriggerProps) => React.ReactElement;
|
|
24
|
+
type MenuContentProps = React.ComponentProps<typeof Menu.Content> & {
|
|
28
25
|
readonly portalled?: boolean;
|
|
29
|
-
readonly portalRef?: React.RefObject<HTMLElement>;
|
|
30
|
-
/** Legacy Chakra zIndex prop - mapped to inline style */
|
|
31
|
-
readonly zIndex?: string | number;
|
|
32
|
-
/** Legacy Chakra minW prop - mapped to inline style */
|
|
33
26
|
readonly minW?: string | number;
|
|
34
|
-
}
|
|
35
|
-
declare const MenuContent:
|
|
36
|
-
|
|
37
|
-
/** Informational
|
|
27
|
+
};
|
|
28
|
+
declare const MenuContent: ({ portalled, minW, children, ...rest }: MenuContentProps) => React.ReactElement;
|
|
29
|
+
type MenuItemProps = React.ComponentProps<typeof Menu.Item> & {
|
|
30
|
+
/** Informational identifier — the row's own name, not read by the engine. */
|
|
38
31
|
readonly value?: string;
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
declare const
|
|
48
|
-
|
|
49
|
-
}
|
|
50
|
-
declare const MenuItemCommand: React.ForwardRefExoticComponent<MenuItemCommandProps & React.RefAttributes<HTMLSpanElement>>;
|
|
51
|
-
interface MenuSeparatorProps extends React.ComponentPropsWithoutRef<'div'> {
|
|
52
|
-
}
|
|
53
|
-
declare const MenuSeparator: React.ForwardRefExoticComponent<MenuSeparatorProps & React.RefAttributes<HTMLDivElement>>;
|
|
54
|
-
interface MenuItemGroupProps extends React.ComponentPropsWithoutRef<'div'> {
|
|
32
|
+
};
|
|
33
|
+
declare const MenuItem: ({ children, value: _value, asChild, ...rest }: MenuItemProps) => React.ReactElement;
|
|
34
|
+
type MenuItemTextProps = React.ComponentProps<typeof Text>;
|
|
35
|
+
declare const MenuItemText: (props: MenuItemTextProps) => React.ReactElement;
|
|
36
|
+
type MenuItemCommandProps = React.ComponentProps<typeof Text>;
|
|
37
|
+
/** The keyboard shortcut on the trailing edge of a row. */
|
|
38
|
+
declare const MenuItemCommand: (props: MenuItemCommandProps) => React.ReactElement;
|
|
39
|
+
type MenuSeparatorProps = React.ComponentProps<typeof Menu.Separator>;
|
|
40
|
+
declare const MenuSeparator: (props: MenuSeparatorProps) => React.ReactElement;
|
|
41
|
+
type MenuItemGroupProps = React.ComponentProps<typeof Menu.Group> & {
|
|
55
42
|
readonly title?: string;
|
|
56
|
-
}
|
|
57
|
-
declare const MenuItemGroup:
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
declare const
|
|
66
|
-
|
|
67
|
-
readonly value?: string;
|
|
68
|
-
readonly onValueChange?: (value: string) => void;
|
|
69
|
-
}
|
|
70
|
-
declare const MenuRadioItemGroup: React.ForwardRefExoticComponent<MenuRadioItemGroupProps & React.RefAttributes<HTMLDivElement>>;
|
|
71
|
-
interface MenuRadioItemProps extends React.ComponentPropsWithoutRef<'div'> {
|
|
72
|
-
readonly value: string;
|
|
73
|
-
}
|
|
74
|
-
declare const MenuRadioItem: React.ForwardRefExoticComponent<MenuRadioItemProps & React.RefAttributes<HTMLDivElement>>;
|
|
75
|
-
interface MenuContextTriggerProps extends React.ComponentPropsWithoutRef<'span'> {
|
|
43
|
+
};
|
|
44
|
+
declare const MenuItemGroup: ({ title, children, ...rest }: MenuItemGroupProps) => React.ReactElement;
|
|
45
|
+
type MenuArrowProps = React.ComponentProps<typeof Menu.Arrow>;
|
|
46
|
+
declare const MenuArrow: (props: MenuArrowProps) => React.ReactElement;
|
|
47
|
+
type MenuCheckboxItemProps = React.ComponentProps<typeof Menu.CheckboxItem>;
|
|
48
|
+
declare const MenuCheckboxItem: ({ children, ...rest }: MenuCheckboxItemProps) => React.ReactElement;
|
|
49
|
+
type MenuRadioItemGroupProps = React.ComponentProps<typeof Menu.RadioGroup>;
|
|
50
|
+
declare const MenuRadioItemGroup: (props: MenuRadioItemGroupProps) => React.ReactElement;
|
|
51
|
+
type MenuRadioItemProps = React.ComponentProps<typeof Menu.RadioItem>;
|
|
52
|
+
declare const MenuRadioItem: ({ children, ...rest }: MenuRadioItemProps) => React.ReactElement;
|
|
53
|
+
type MenuContextTriggerProps = React.ComponentProps<typeof View> & {
|
|
76
54
|
readonly asChild?: boolean;
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
|
|
55
|
+
};
|
|
56
|
+
/**
|
|
57
|
+
* A right-click target. This menu is a DROPDOWN — it opens from its trigger, not
|
|
58
|
+
* from a pointer position — so the wrapper passes its children through. gui does
|
|
59
|
+
* ship a real `ContextMenu`; a surface that wants one should reach for that
|
|
60
|
+
* rather than have this quietly behave like it.
|
|
61
|
+
*/
|
|
62
|
+
declare const MenuContextTrigger: ({ asChild: _asChild, ...rest }: MenuContextTriggerProps) => React.ReactElement;
|
|
63
|
+
type MenuTriggerItemProps = React.ComponentProps<typeof Menu.SubTrigger> & {
|
|
80
64
|
readonly startIcon?: React.ReactNode;
|
|
81
|
-
}
|
|
82
|
-
declare const MenuTriggerItem:
|
|
65
|
+
};
|
|
66
|
+
declare const MenuTriggerItem: ({ startIcon, children, ...rest }: MenuTriggerItemProps) => React.ReactElement;
|
|
83
67
|
|
|
84
68
|
export { MenuArrow, type MenuArrowProps, MenuCheckboxItem, type MenuCheckboxItemProps, MenuContent, type MenuContentProps, MenuContextTrigger, type MenuContextTriggerProps, MenuItem, MenuItemCommand, type MenuItemCommandProps, MenuItemGroup, type MenuItemGroupProps, type MenuItemProps, MenuItemText, type MenuItemTextProps, MenuRadioItem, MenuRadioItemGroup, type MenuRadioItemGroupProps, type MenuRadioItemProps, MenuRoot, type MenuRootProps, MenuSeparator, type MenuSeparatorProps, MenuTrigger, MenuTriggerItem, type MenuTriggerItemProps, type MenuTriggerProps };
|
package/dist/menu.js
CHANGED
|
@@ -1,269 +1,179 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import {
|
|
5
|
-
import { clsx } from 'clsx';
|
|
6
|
-
import { twMerge } from 'tailwind-merge';
|
|
2
|
+
import { Menu, Text, View, XStack } from '@hanzo/gui';
|
|
3
|
+
import { ChevronRight, Check } from 'lucide-react';
|
|
4
|
+
import { Children, createElement } from 'react';
|
|
7
5
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
8
6
|
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
7
|
+
var ink = (children, Wrap = Text, props = {}) => {
|
|
8
|
+
let hasText = false;
|
|
9
|
+
Children.forEach(children, (child) => {
|
|
10
|
+
if (typeof child === "string" || typeof child === "number") hasText = true;
|
|
11
|
+
});
|
|
12
|
+
if (!hasText) return children;
|
|
13
|
+
return Children.map(children, (child) => typeof child === "string" || typeof child === "number" ? createElement(Wrap, props, child) : child);
|
|
14
|
+
};
|
|
15
|
+
var ITEM_HOVER = "var(--color-popover-item-hover)";
|
|
16
|
+
var TEXT = "var(--color-text-primary)";
|
|
17
|
+
var ROW = {
|
|
18
|
+
position: "relative",
|
|
19
|
+
flexDirection: "row",
|
|
20
|
+
alignItems: "center",
|
|
21
|
+
cursor: "pointer",
|
|
22
|
+
userSelect: "none",
|
|
23
|
+
borderRadius: 6,
|
|
24
|
+
fontSize: 14,
|
|
25
|
+
backgroundColor: "transparent",
|
|
26
|
+
hoverStyle: { backgroundColor: ITEM_HOVER },
|
|
27
|
+
focusStyle: { backgroundColor: ITEM_HOVER }
|
|
28
|
+
};
|
|
29
|
+
var MenuRoot = ({
|
|
30
|
+
children,
|
|
31
|
+
open,
|
|
32
|
+
defaultOpen,
|
|
33
|
+
onOpenChange,
|
|
34
|
+
positioning,
|
|
35
|
+
modal = true
|
|
36
|
+
}) => /* @__PURE__ */ jsx(
|
|
37
|
+
Menu,
|
|
38
|
+
{
|
|
36
39
|
open,
|
|
37
40
|
defaultOpen,
|
|
38
|
-
onOpenChange,
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
44
|
-
lazyMount: _lazyMount,
|
|
45
|
-
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
46
|
-
unmountOnExit: _unmountOnExit
|
|
47
|
-
} = props;
|
|
48
|
-
const mergedPositioning = {
|
|
49
|
-
placement: "bottom-start",
|
|
50
|
-
...positioning,
|
|
51
|
-
offset: {
|
|
52
|
-
mainAxis: 4,
|
|
53
|
-
...positioning?.offset
|
|
54
|
-
}
|
|
55
|
-
};
|
|
56
|
-
const { side, align } = parsePlacement(mergedPositioning.placement);
|
|
57
|
-
const positioningValue = React.useMemo(() => ({
|
|
58
|
-
side,
|
|
59
|
-
align,
|
|
60
|
-
sideOffset: mergedPositioning.offset?.mainAxis ?? 4,
|
|
61
|
-
alignOffset: mergedPositioning.offset?.crossAxis ?? 0
|
|
62
|
-
}), [side, align, mergedPositioning.offset?.mainAxis, mergedPositioning.offset?.crossAxis]);
|
|
63
|
-
const handleOpenChange = React.useCallback((isOpen) => {
|
|
64
|
-
onOpenChange?.({ open: isOpen });
|
|
65
|
-
}, [onOpenChange]);
|
|
66
|
-
return /* @__PURE__ */ jsx(PositioningContext.Provider, { value: positioningValue, children: /* @__PURE__ */ jsx(
|
|
67
|
-
DropdownMenu.Root,
|
|
68
|
-
{
|
|
69
|
-
open,
|
|
70
|
-
defaultOpen,
|
|
71
|
-
onOpenChange: handleOpenChange,
|
|
72
|
-
modal,
|
|
73
|
-
children
|
|
74
|
-
}
|
|
75
|
-
) });
|
|
76
|
-
};
|
|
77
|
-
var MenuTrigger = React.forwardRef(function MenuTrigger2(props, ref) {
|
|
78
|
-
const { asChild = false, ...rest } = props;
|
|
79
|
-
return /* @__PURE__ */ jsx(DropdownMenu.Trigger, { asChild, ref, ...rest });
|
|
80
|
-
});
|
|
81
|
-
var MenuContent = React.forwardRef(function MenuContent2(props, ref) {
|
|
82
|
-
const { portalled = true, portalRef, className, zIndex, minW, style, ...rest } = props;
|
|
83
|
-
const positioning = React.useContext(PositioningContext);
|
|
84
|
-
const mergedStyle = {
|
|
85
|
-
...style,
|
|
86
|
-
...zIndex !== void 0 ? { zIndex: typeof zIndex === "string" ? `var(--z-index-${zIndex}, ${zIndex})` : zIndex } : {},
|
|
87
|
-
...minW !== void 0 ? { minWidth: minW } : {}
|
|
88
|
-
};
|
|
89
|
-
const content = /* @__PURE__ */ jsx(
|
|
90
|
-
DropdownMenu.Content,
|
|
91
|
-
{
|
|
92
|
-
ref,
|
|
93
|
-
side: positioning.side,
|
|
94
|
-
align: positioning.align,
|
|
95
|
-
sideOffset: positioning.sideOffset,
|
|
96
|
-
alignOffset: positioning.alignOffset,
|
|
97
|
-
className: cn(
|
|
98
|
-
"z-50 min-w-[8rem] overflow-hidden rounded-lg p-1",
|
|
99
|
-
"border border-[var(--color-popover-border,var(--color-border-divider))]",
|
|
100
|
-
"bg-[var(--color-popover-bg,var(--color-dialog-bg))]",
|
|
101
|
-
"shadow-[0_4px_12px_var(--color-popover-shadow)]",
|
|
102
|
-
"outline-none",
|
|
103
|
-
"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
|
|
104
|
-
"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
|
|
105
|
-
"data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2",
|
|
106
|
-
"data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
|
107
|
-
className
|
|
108
|
-
),
|
|
109
|
-
style: Object.keys(mergedStyle).length > 0 ? mergedStyle : void 0,
|
|
110
|
-
...rest
|
|
111
|
-
}
|
|
112
|
-
);
|
|
113
|
-
if (!portalled) {
|
|
114
|
-
return content;
|
|
41
|
+
onOpenChange: onOpenChange ? (isOpen) => onOpenChange({ open: isOpen }) : void 0,
|
|
42
|
+
modal,
|
|
43
|
+
placement: positioning?.placement ?? "bottom-start",
|
|
44
|
+
offset: positioning?.offset?.mainAxis ?? 4,
|
|
45
|
+
children
|
|
115
46
|
}
|
|
116
|
-
|
|
117
|
-
});
|
|
118
|
-
var
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
47
|
+
);
|
|
48
|
+
var MenuTrigger = ({ asChild = false, ...rest }) => /* @__PURE__ */ jsx(Menu.Trigger, { asChild, ...rest });
|
|
49
|
+
var MenuContent = ({
|
|
50
|
+
portalled = true,
|
|
51
|
+
minW,
|
|
52
|
+
children,
|
|
53
|
+
...rest
|
|
54
|
+
}) => {
|
|
55
|
+
const content = /* @__PURE__ */ jsx(
|
|
56
|
+
Menu.Content,
|
|
122
57
|
{
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
58
|
+
unstyled: true,
|
|
59
|
+
zIndex: 50,
|
|
60
|
+
minWidth: minW ?? 128,
|
|
61
|
+
overflow: "hidden",
|
|
62
|
+
borderRadius: 8,
|
|
63
|
+
padding: 4,
|
|
64
|
+
borderWidth: 1,
|
|
65
|
+
borderColor: "var(--color-popover-border)",
|
|
66
|
+
backgroundColor: "var(--color-popover-bg)",
|
|
67
|
+
transition: "quick",
|
|
68
|
+
enterStyle: { opacity: 0, scale: 0.95 },
|
|
69
|
+
exitStyle: { opacity: 0, scale: 0.95 },
|
|
135
70
|
...rest,
|
|
136
71
|
children
|
|
137
72
|
}
|
|
138
73
|
);
|
|
139
|
-
});
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
ref,
|
|
150
|
-
className: cn("ml-auto text-xs tracking-widest opacity-60", className),
|
|
151
|
-
...rest
|
|
152
|
-
}
|
|
153
|
-
);
|
|
154
|
-
});
|
|
155
|
-
var MenuSeparator = React.forwardRef(function MenuSeparator2(props, ref) {
|
|
156
|
-
const { className, ...rest } = props;
|
|
157
|
-
return /* @__PURE__ */ jsx(
|
|
158
|
-
DropdownMenu.Separator,
|
|
159
|
-
{
|
|
160
|
-
ref,
|
|
161
|
-
className: cn("-mx-1 my-1 h-px bg-[var(--color-border-divider)]", className),
|
|
162
|
-
...rest
|
|
163
|
-
}
|
|
164
|
-
);
|
|
165
|
-
});
|
|
166
|
-
var MenuItemGroup = React.forwardRef(function MenuItemGroup2(props, ref) {
|
|
167
|
-
const { title, children, className, ...rest } = props;
|
|
168
|
-
return /* @__PURE__ */ jsxs(DropdownMenu.Group, { ref, className, ...rest, children: [
|
|
169
|
-
title && /* @__PURE__ */ jsx(DropdownMenu.Label, { className: "px-2 py-1.5 text-xs font-semibold select-none opacity-60", children: title }),
|
|
170
|
-
children
|
|
171
|
-
] });
|
|
172
|
-
});
|
|
173
|
-
var MenuArrow = React.forwardRef(function MenuArrow2(props, ref) {
|
|
174
|
-
const { className, ...rest } = props;
|
|
175
|
-
return /* @__PURE__ */ jsx(
|
|
176
|
-
DropdownMenu.Arrow,
|
|
177
|
-
{
|
|
178
|
-
ref,
|
|
179
|
-
className: cn("fill-[var(--color-popover-bg,var(--color-dialog-bg))]", className),
|
|
180
|
-
...rest
|
|
181
|
-
}
|
|
182
|
-
);
|
|
183
|
-
});
|
|
184
|
-
var MenuCheckboxItem = React.forwardRef(function MenuCheckboxItem2(props, ref) {
|
|
185
|
-
const { className, children, checked, onCheckedChange, onClick, ...rest } = props;
|
|
186
|
-
return /* @__PURE__ */ jsxs(
|
|
187
|
-
DropdownMenu.CheckboxItem,
|
|
74
|
+
return portalled ? /* @__PURE__ */ jsx(Menu.Portal, { children: content }) : content;
|
|
75
|
+
};
|
|
76
|
+
var MenuItem = ({ children, value: _value, asChild, ...rest }) => (
|
|
77
|
+
// `asChild` means the caller brought its own element and owns the look. Its
|
|
78
|
+
// props are then forwarded to that element verbatim, so the skin must NOT be
|
|
79
|
+
// applied: `unstyled` and friends are not DOM attributes and React rejects
|
|
80
|
+
// them out loud ("Received `true` for a non-boolean attribute `unstyled`").
|
|
81
|
+
// Two shapes, said once, rather than one shape that is wrong in one of them.
|
|
82
|
+
asChild ? /* @__PURE__ */ jsx(Menu.Item, { asChild: true, ...rest, children }) : /* @__PURE__ */ jsx(
|
|
83
|
+
Menu.Item,
|
|
188
84
|
{
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
"outline-none transition-colors",
|
|
196
|
-
"data-[highlighted]:bg-[var(--color-popover-item-hover,rgba(0,0,0,0.04))]",
|
|
197
|
-
"data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
|
198
|
-
className
|
|
199
|
-
),
|
|
85
|
+
unstyled: true,
|
|
86
|
+
...ROW,
|
|
87
|
+
gap: 8,
|
|
88
|
+
paddingHorizontal: 8,
|
|
89
|
+
paddingVertical: 6,
|
|
90
|
+
disabledStyle: { opacity: 0.5, pointerEvents: "none" },
|
|
200
91
|
...rest,
|
|
201
|
-
children:
|
|
202
|
-
/* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenu.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) }) }),
|
|
203
|
-
children
|
|
204
|
-
]
|
|
205
|
-
}
|
|
206
|
-
);
|
|
207
|
-
});
|
|
208
|
-
var MenuRadioItemGroup = React.forwardRef(function MenuRadioItemGroup2(props, ref) {
|
|
209
|
-
const { value, onValueChange, ...rest } = props;
|
|
210
|
-
return /* @__PURE__ */ jsx(
|
|
211
|
-
DropdownMenu.RadioGroup,
|
|
212
|
-
{
|
|
213
|
-
ref,
|
|
214
|
-
value,
|
|
215
|
-
onValueChange,
|
|
216
|
-
...rest
|
|
92
|
+
children: ink(children, void 0, { fontSize: 14, color: TEXT })
|
|
217
93
|
}
|
|
218
|
-
)
|
|
219
|
-
|
|
220
|
-
var
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
94
|
+
)
|
|
95
|
+
);
|
|
96
|
+
var MenuItemText = (props) => /* @__PURE__ */ jsx(Text, { flex: 1, fontSize: 14, color: TEXT, ...props });
|
|
97
|
+
var MenuItemCommand = (props) => /* @__PURE__ */ jsx(Text, { marginLeft: "auto", fontSize: 12, letterSpacing: 1, opacity: 0.6, color: TEXT, ...props });
|
|
98
|
+
var MenuSeparator = (props) => /* @__PURE__ */ jsx(
|
|
99
|
+
Menu.Separator,
|
|
100
|
+
{
|
|
101
|
+
unstyled: true,
|
|
102
|
+
height: 1,
|
|
103
|
+
marginVertical: 4,
|
|
104
|
+
marginHorizontal: -4,
|
|
105
|
+
backgroundColor: "var(--color-border-divider)",
|
|
106
|
+
...props
|
|
107
|
+
}
|
|
108
|
+
);
|
|
109
|
+
var MenuItemGroup = ({ title, children, ...rest }) => /* @__PURE__ */ jsxs(Menu.Group, { unstyled: true, ...rest, children: [
|
|
110
|
+
title && /* @__PURE__ */ jsx(
|
|
111
|
+
Menu.Label,
|
|
225
112
|
{
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
),
|
|
236
|
-
children: [
|
|
237
|
-
/* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenu.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) }) }),
|
|
238
|
-
/* @__PURE__ */ jsx("span", { children })
|
|
239
|
-
]
|
|
113
|
+
unstyled: true,
|
|
114
|
+
paddingHorizontal: 8,
|
|
115
|
+
paddingVertical: 6,
|
|
116
|
+
fontSize: 12,
|
|
117
|
+
fontWeight: "600",
|
|
118
|
+
userSelect: "none",
|
|
119
|
+
opacity: 0.6,
|
|
120
|
+
color: TEXT,
|
|
121
|
+
children: title
|
|
240
122
|
}
|
|
241
|
-
)
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
})
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
)
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
123
|
+
),
|
|
124
|
+
children
|
|
125
|
+
] });
|
|
126
|
+
var MenuArrow = (props) => /* @__PURE__ */ jsx(Menu.Arrow, { backgroundColor: "var(--color-popover-bg)", ...props });
|
|
127
|
+
var Indicator = () => /* @__PURE__ */ jsx(View, { position: "absolute", left: 8, width: 14, height: 14, alignItems: "center", justifyContent: "center", children: /* @__PURE__ */ jsx(Menu.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { size: 16 }) }) });
|
|
128
|
+
var MenuCheckboxItem = ({ children, ...rest }) => /* @__PURE__ */ jsxs(
|
|
129
|
+
Menu.CheckboxItem,
|
|
130
|
+
{
|
|
131
|
+
unstyled: true,
|
|
132
|
+
...ROW,
|
|
133
|
+
paddingLeft: 32,
|
|
134
|
+
paddingRight: 8,
|
|
135
|
+
paddingVertical: 6,
|
|
136
|
+
disabledStyle: { opacity: 0.5, pointerEvents: "none" },
|
|
137
|
+
...rest,
|
|
138
|
+
children: [
|
|
139
|
+
/* @__PURE__ */ jsx(Indicator, {}),
|
|
140
|
+
ink(children, void 0, { fontSize: 14, color: TEXT })
|
|
141
|
+
]
|
|
142
|
+
}
|
|
143
|
+
);
|
|
144
|
+
var MenuRadioItemGroup = (props) => /* @__PURE__ */ jsx(Menu.RadioGroup, { ...props });
|
|
145
|
+
var MenuRadioItem = ({ children, ...rest }) => /* @__PURE__ */ jsxs(
|
|
146
|
+
Menu.RadioItem,
|
|
147
|
+
{
|
|
148
|
+
unstyled: true,
|
|
149
|
+
...ROW,
|
|
150
|
+
paddingLeft: 32,
|
|
151
|
+
paddingRight: 8,
|
|
152
|
+
paddingVertical: 6,
|
|
153
|
+
disabledStyle: { opacity: 0.5, pointerEvents: "none" },
|
|
154
|
+
...rest,
|
|
155
|
+
children: [
|
|
156
|
+
/* @__PURE__ */ jsx(Indicator, {}),
|
|
157
|
+
ink(children, void 0, { fontSize: 14, color: TEXT })
|
|
158
|
+
]
|
|
159
|
+
}
|
|
160
|
+
);
|
|
161
|
+
var MenuContextTrigger = ({ asChild: _asChild, ...rest }) => /* @__PURE__ */ jsx(View, { ...rest });
|
|
162
|
+
var MenuTriggerItem = ({ startIcon, children, ...rest }) => /* @__PURE__ */ jsx(Menu.Sub, { children: /* @__PURE__ */ jsxs(
|
|
163
|
+
Menu.SubTrigger,
|
|
164
|
+
{
|
|
165
|
+
unstyled: true,
|
|
166
|
+
...ROW,
|
|
167
|
+
gap: 8,
|
|
168
|
+
paddingHorizontal: 8,
|
|
169
|
+
paddingVertical: 6,
|
|
170
|
+
...rest,
|
|
171
|
+
children: [
|
|
172
|
+
startIcon,
|
|
173
|
+
/* @__PURE__ */ jsx(XStack, { flex: 1, children: ink(children, void 0, { fontSize: 14, color: TEXT }) }),
|
|
174
|
+
/* @__PURE__ */ jsx(ChevronRight, { size: 16 })
|
|
175
|
+
]
|
|
176
|
+
}
|
|
177
|
+
) });
|
|
268
178
|
|
|
269
179
|
export { MenuArrow, MenuCheckboxItem, MenuContent, MenuContextTrigger, MenuItem, MenuItemCommand, MenuItemGroup, MenuItemText, MenuRadioItem, MenuRadioItemGroup, MenuRoot, MenuSeparator, MenuTrigger, MenuTriggerItem };
|