@owodesign/owoui 0.1.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/README.md +70 -0
- package/dist/index.d.ts +364 -0
- package/dist/index.min.js +1 -0
- package/dist/storybook/catalog.d.ts +22 -0
- package/dist/storybook/catalog.js +221 -0
- package/dist/storybook/catalog.json +220 -0
- package/dist/storybook/index.d.ts +37 -0
- package/dist/storybook/index.min.js +96 -0
- package/dist/tokens.d.ts +32 -0
- package/dist/tokens.min.js +1 -0
- package/package.json +91 -0
- package/src/elevated.css +20 -0
- package/src/flat.css +1 -0
- package/src/glass.css +17 -0
- package/src/style.css +20 -0
- package/src/styles/tokens.css +188 -0
- package/src/styles/ui/avatar.css +13 -0
- package/src/styles/ui/badge.css +52 -0
- package/src/styles/ui/button.css +49 -0
- package/src/styles/ui/dialog.css +37 -0
- package/src/styles/ui/drawer.css +15 -0
- package/src/styles/ui/dropdown-menu.css +132 -0
- package/src/styles/ui/empty-state.css +34 -0
- package/src/styles/ui/field.css +12 -0
- package/src/styles/ui/icon-button.css +29 -0
- package/src/styles/ui/input.css +16 -0
- package/src/styles/ui/panel.css +23 -0
- package/src/styles/ui/segmented-control.css +28 -0
- package/src/styles/ui/select.css +52 -0
- package/src/styles/ui/skeleton.css +99 -0
- package/src/styles/ui/status-notice.css +41 -0
- package/src/styles/ui/switch.css +17 -0
- package/src/styles/ui/toast.css +57 -0
- package/src/styles/ui/tooltip.css +26 -0
- package/src/tokens.css +1 -0
package/README.md
ADDED
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
# owoui
|
|
2
|
+
|
|
3
|
+
Reusable UI foundation components and default style preset.
|
|
4
|
+
|
|
5
|
+
## Usage
|
|
6
|
+
|
|
7
|
+
```tsx
|
|
8
|
+
import '@owodesign/owoui/style.css';
|
|
9
|
+
import { Button, Dialog, Select } from '@owodesign/owoui';
|
|
10
|
+
```
|
|
11
|
+
|
|
12
|
+
This package ships:
|
|
13
|
+
|
|
14
|
+
- reusable React UI primitives
|
|
15
|
+
- a default style preset
|
|
16
|
+
- a standalone token stylesheet via `@owodesign/owoui/tokens.css`
|
|
17
|
+
- token metadata via `@owodesign/owoui/tokens`
|
|
18
|
+
- data-state hooks on complex components
|
|
19
|
+
- component-level customization surfaces for complex widgets
|
|
20
|
+
- a packaged storybook registry consumable via `@owodesign/owoui/storybook`
|
|
21
|
+
- a static storybook catalog consumable via `@owodesign/owoui/storybook/catalog`
|
|
22
|
+
|
|
23
|
+
## Token Exports
|
|
24
|
+
|
|
25
|
+
For CSS-only token consumption:
|
|
26
|
+
|
|
27
|
+
```tsx
|
|
28
|
+
import '@owodesign/owoui/tokens.css';
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
For programmatic token metadata:
|
|
32
|
+
|
|
33
|
+
```ts
|
|
34
|
+
import { tokenGroups, semanticTokenKeys, presetNames } from '@owodesign/owoui/tokens';
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
## Presets
|
|
38
|
+
|
|
39
|
+
- `@owodesign/owoui/style.css`: default preset
|
|
40
|
+
- `@owodesign/owoui/flat.css`: explicit flat preset alias
|
|
41
|
+
- `@owodesign/owoui/elevated.css`: elevated preset with stronger surfaces and shadows
|
|
42
|
+
- `@owodesign/owoui/glass.css`: glass preset with translucent surfaces and stronger blur
|
|
43
|
+
|
|
44
|
+
## Storybook Artifact
|
|
45
|
+
|
|
46
|
+
`owoui` also ships a packaged storybook registry entry:
|
|
47
|
+
|
|
48
|
+
```ts
|
|
49
|
+
import { storybookStoryPaths, getStoriesByGroupAndComponent } from '@owodesign/owoui/storybook';
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
This is intended for host apps that want to mount the package stories under their own route shell.
|
|
53
|
+
|
|
54
|
+
For host apps that prefer a static navigation/catalog artifact, `owoui` also ships:
|
|
55
|
+
|
|
56
|
+
```ts
|
|
57
|
+
import storybookCatalog from '@owodesign/owoui/storybook/catalog';
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
## Release Checks
|
|
61
|
+
|
|
62
|
+
From the repo root:
|
|
63
|
+
|
|
64
|
+
```bash
|
|
65
|
+
npm run release:owoui:check
|
|
66
|
+
```
|
|
67
|
+
|
|
68
|
+
Publishing notes live in:
|
|
69
|
+
|
|
70
|
+
- [PUBLISHING.md](/home/qq/proj/qblog/packages/owoui/PUBLISHING.md)
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,364 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { HTMLAttributes, ReactNode, ButtonHTMLAttributes, AnchorHTMLAttributes, ReactElement, ElementType, InputHTMLAttributes, TextareaHTMLAttributes } from 'react';
|
|
3
|
+
|
|
4
|
+
type AvatarSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
5
|
+
type AvatarTone = 'neutral' | 'subtle';
|
|
6
|
+
interface AvatarProps {
|
|
7
|
+
src?: string;
|
|
8
|
+
alt?: string;
|
|
9
|
+
name?: string;
|
|
10
|
+
size?: AvatarSize;
|
|
11
|
+
tone?: AvatarTone;
|
|
12
|
+
className?: string;
|
|
13
|
+
}
|
|
14
|
+
declare function Avatar({ src, alt, name, size, tone, className }: AvatarProps): react_jsx_runtime.JSX.Element;
|
|
15
|
+
|
|
16
|
+
type BadgeTone = 'neutral' | 'info' | 'success' | 'warning' | 'danger';
|
|
17
|
+
type BadgeVariant = 'soft' | 'outline';
|
|
18
|
+
type BadgeSize = 'xs' | 'sm';
|
|
19
|
+
interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
|
|
20
|
+
tone?: BadgeTone;
|
|
21
|
+
variant?: BadgeVariant;
|
|
22
|
+
size?: BadgeSize;
|
|
23
|
+
children: ReactNode;
|
|
24
|
+
}
|
|
25
|
+
declare function Badge({ tone, variant, size, className, children, ...props }: BadgeProps): react_jsx_runtime.JSX.Element;
|
|
26
|
+
|
|
27
|
+
type ButtonVariant = 'primary' | 'secondary' | 'ghost' | 'danger';
|
|
28
|
+
type ButtonSize = 'sm' | 'md';
|
|
29
|
+
type SharedProps$1 = {
|
|
30
|
+
variant?: ButtonVariant;
|
|
31
|
+
size?: ButtonSize;
|
|
32
|
+
loading?: boolean;
|
|
33
|
+
leadingIcon?: ReactNode;
|
|
34
|
+
trailingIcon?: ReactNode;
|
|
35
|
+
className?: string;
|
|
36
|
+
children: ReactNode;
|
|
37
|
+
};
|
|
38
|
+
type ButtonElementProps = SharedProps$1 & Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children'> & {
|
|
39
|
+
href?: undefined;
|
|
40
|
+
};
|
|
41
|
+
type LinkElementProps = SharedProps$1 & Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'children' | 'href'> & {
|
|
42
|
+
href: string;
|
|
43
|
+
};
|
|
44
|
+
type ButtonProps = ButtonElementProps | LinkElementProps;
|
|
45
|
+
declare function buttonClassName({ variant, size, loading, className, }: Pick<ButtonProps, 'variant' | 'size' | 'loading' | 'className'>): string;
|
|
46
|
+
declare function Button(props: ButtonProps): react_jsx_runtime.JSX.Element;
|
|
47
|
+
|
|
48
|
+
type ConfirmVariant = 'primary' | 'danger';
|
|
49
|
+
interface ConfirmOptions {
|
|
50
|
+
title: string;
|
|
51
|
+
description: string | ReactNode;
|
|
52
|
+
confirmLabel?: string;
|
|
53
|
+
cancelLabel?: string;
|
|
54
|
+
variant?: ConfirmVariant;
|
|
55
|
+
}
|
|
56
|
+
type ConfirmFn = (options: ConfirmOptions) => Promise<boolean>;
|
|
57
|
+
declare function useConfirm(): ConfirmFn;
|
|
58
|
+
declare function ConfirmProvider({ children }: {
|
|
59
|
+
children: ReactNode;
|
|
60
|
+
}): react_jsx_runtime.JSX.Element;
|
|
61
|
+
|
|
62
|
+
type DialogSize = 'sm' | 'md';
|
|
63
|
+
interface DialogProps extends HTMLAttributes<HTMLDivElement> {
|
|
64
|
+
open: boolean;
|
|
65
|
+
onClose: () => void;
|
|
66
|
+
size?: DialogSize;
|
|
67
|
+
children: ReactNode;
|
|
68
|
+
overlayClassName?: string;
|
|
69
|
+
panelClassName?: string;
|
|
70
|
+
}
|
|
71
|
+
declare function DialogHeader({ className, children, ...props }: HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
|
|
72
|
+
declare function DialogBody({ className, children, ...props }: HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
|
|
73
|
+
declare function DialogFooter({ className, children, ...props }: HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
|
|
74
|
+
declare function Dialog({ open, onClose, size, children, className, overlayClassName, panelClassName, ...props }: DialogProps): react_jsx_runtime.JSX.Element | null;
|
|
75
|
+
declare namespace Dialog {
|
|
76
|
+
var Header: typeof DialogHeader;
|
|
77
|
+
var Body: typeof DialogBody;
|
|
78
|
+
var Footer: typeof DialogFooter;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
type DropdownMenuSide = 'top' | 'bottom' | 'left' | 'right';
|
|
82
|
+
type DropdownMenuAlign = 'start' | 'center' | 'end';
|
|
83
|
+
type DropdownMenuRole = 'menu' | 'listbox';
|
|
84
|
+
interface DropdownMenuProps {
|
|
85
|
+
open?: boolean;
|
|
86
|
+
defaultOpen?: boolean;
|
|
87
|
+
onOpenChange?: (open: boolean) => void;
|
|
88
|
+
side?: DropdownMenuSide;
|
|
89
|
+
align?: DropdownMenuAlign;
|
|
90
|
+
sideOffset?: number;
|
|
91
|
+
alignOffset?: number;
|
|
92
|
+
collisionPadding?: number;
|
|
93
|
+
portal?: boolean;
|
|
94
|
+
contentRole?: DropdownMenuRole;
|
|
95
|
+
children: ReactNode;
|
|
96
|
+
}
|
|
97
|
+
interface DropdownMenuTriggerProps {
|
|
98
|
+
asChild?: boolean;
|
|
99
|
+
disabled?: boolean;
|
|
100
|
+
className?: string;
|
|
101
|
+
children: ReactElement;
|
|
102
|
+
}
|
|
103
|
+
interface DropdownMenuContentProps extends HTMLAttributes<HTMLDivElement> {
|
|
104
|
+
matchTriggerWidth?: boolean;
|
|
105
|
+
maxHeight?: number;
|
|
106
|
+
}
|
|
107
|
+
interface DropdownMenuGroupProps extends HTMLAttributes<HTMLDivElement> {
|
|
108
|
+
children: ReactNode;
|
|
109
|
+
}
|
|
110
|
+
interface DropdownMenuLabelProps extends HTMLAttributes<HTMLDivElement> {
|
|
111
|
+
children: ReactNode;
|
|
112
|
+
}
|
|
113
|
+
interface DropdownMenuItemProps extends Omit<HTMLAttributes<HTMLButtonElement>, 'onSelect'> {
|
|
114
|
+
children: ReactNode;
|
|
115
|
+
inset?: boolean;
|
|
116
|
+
disabled?: boolean;
|
|
117
|
+
selected?: boolean;
|
|
118
|
+
destructive?: boolean;
|
|
119
|
+
closeOnSelect?: boolean;
|
|
120
|
+
shortcut?: ReactNode;
|
|
121
|
+
indicator?: ReactNode;
|
|
122
|
+
onSelect?: () => void;
|
|
123
|
+
}
|
|
124
|
+
interface DropdownMenuSeparatorProps extends HTMLAttributes<HTMLDivElement> {
|
|
125
|
+
}
|
|
126
|
+
interface DropdownSubmenuProps extends Omit<DropdownMenuProps, 'contentRole'> {
|
|
127
|
+
children: ReactNode;
|
|
128
|
+
}
|
|
129
|
+
interface DropdownSubTriggerProps extends Omit<DropdownMenuItemProps, 'indicator' | 'selected' | 'closeOnSelect'> {
|
|
130
|
+
}
|
|
131
|
+
declare function DropdownMenuRoot({ open, defaultOpen, onOpenChange, side, align, sideOffset, alignOffset, collisionPadding, portal, contentRole, children, }: DropdownMenuProps): react_jsx_runtime.JSX.Element;
|
|
132
|
+
declare function DropdownMenuTrigger({ asChild, disabled, className, children, }: DropdownMenuTriggerProps): react_jsx_runtime.JSX.Element;
|
|
133
|
+
declare function DropdownMenuContent({ className, children, style, matchTriggerWidth, maxHeight, ...props }: DropdownMenuContentProps): react_jsx_runtime.JSX.Element | null;
|
|
134
|
+
declare function DropdownMenuGroup({ className, children, ...props }: DropdownMenuGroupProps): react_jsx_runtime.JSX.Element;
|
|
135
|
+
declare function DropdownMenuLabel({ className, children, ...props }: DropdownMenuLabelProps): react_jsx_runtime.JSX.Element;
|
|
136
|
+
declare function DropdownMenuSeparator({ className, ...props }: DropdownMenuSeparatorProps): react_jsx_runtime.JSX.Element;
|
|
137
|
+
declare function DropdownMenuItem({ className, children, inset, disabled, selected, destructive, closeOnSelect, shortcut, indicator, onSelect, onMouseEnter, onClick, ...props }: DropdownMenuItemProps): react_jsx_runtime.JSX.Element;
|
|
138
|
+
declare function DropdownMenuSubmenu(props: DropdownSubmenuProps): react_jsx_runtime.JSX.Element;
|
|
139
|
+
declare function DropdownMenuSubTrigger({ className, children, inset, disabled, destructive, shortcut, onSelect, onMouseEnter, onClick, ...props }: DropdownSubTriggerProps): react_jsx_runtime.JSX.Element;
|
|
140
|
+
declare const DropdownMenu: typeof DropdownMenuRoot & {
|
|
141
|
+
Trigger: typeof DropdownMenuTrigger;
|
|
142
|
+
Content: typeof DropdownMenuContent;
|
|
143
|
+
Group: typeof DropdownMenuGroup;
|
|
144
|
+
Label: typeof DropdownMenuLabel;
|
|
145
|
+
Item: typeof DropdownMenuItem;
|
|
146
|
+
Separator: typeof DropdownMenuSeparator;
|
|
147
|
+
Submenu: typeof DropdownMenuSubmenu;
|
|
148
|
+
SubTrigger: typeof DropdownMenuSubTrigger;
|
|
149
|
+
};
|
|
150
|
+
|
|
151
|
+
type DrawerSide = 'left' | 'right';
|
|
152
|
+
type DrawerPosition = 'fixed' | 'absolute';
|
|
153
|
+
interface DrawerProps extends HTMLAttributes<HTMLElement> {
|
|
154
|
+
as?: ElementType;
|
|
155
|
+
open: boolean;
|
|
156
|
+
children: ReactNode;
|
|
157
|
+
side?: DrawerSide;
|
|
158
|
+
position?: DrawerPosition;
|
|
159
|
+
showBackdrop?: boolean;
|
|
160
|
+
onClose?: () => void;
|
|
161
|
+
closeLabel?: string;
|
|
162
|
+
backdropClassName?: string;
|
|
163
|
+
}
|
|
164
|
+
declare function Drawer({ as: Component, open, children, side, position, showBackdrop, onClose, closeLabel, backdropClassName, className, ...props }: DrawerProps): react_jsx_runtime.JSX.Element;
|
|
165
|
+
|
|
166
|
+
type EmptyStateTone = 'neutral' | 'notice' | 'warning';
|
|
167
|
+
interface EmptyStateProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
|
|
168
|
+
tone?: EmptyStateTone;
|
|
169
|
+
icon?: ReactNode;
|
|
170
|
+
title?: ReactNode;
|
|
171
|
+
description?: ReactNode;
|
|
172
|
+
action?: ReactNode;
|
|
173
|
+
children?: ReactNode;
|
|
174
|
+
}
|
|
175
|
+
declare function EmptyState({ tone, icon, title, description, action, className, children, ...props }: EmptyStateProps): react_jsx_runtime.JSX.Element;
|
|
176
|
+
|
|
177
|
+
interface FieldProps extends HTMLAttributes<HTMLDivElement> {
|
|
178
|
+
label: ReactNode;
|
|
179
|
+
help?: ReactNode;
|
|
180
|
+
htmlFor?: string;
|
|
181
|
+
children: ReactNode;
|
|
182
|
+
}
|
|
183
|
+
declare function Field({ label, help, htmlFor, children, className, ...props }: FieldProps): react_jsx_runtime.JSX.Element;
|
|
184
|
+
|
|
185
|
+
type IconButtonVariant = 'ghost' | 'subtle';
|
|
186
|
+
type IconButtonSize = 'sm' | 'md';
|
|
187
|
+
type SharedProps = {
|
|
188
|
+
variant?: IconButtonVariant;
|
|
189
|
+
size?: IconButtonSize;
|
|
190
|
+
label: string;
|
|
191
|
+
icon: ReactNode;
|
|
192
|
+
className?: string;
|
|
193
|
+
};
|
|
194
|
+
type ButtonIconButtonProps = SharedProps & Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children'> & {
|
|
195
|
+
href?: undefined;
|
|
196
|
+
};
|
|
197
|
+
type LinkIconButtonProps = SharedProps & Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'children' | 'href'> & {
|
|
198
|
+
href: string;
|
|
199
|
+
};
|
|
200
|
+
type IconButtonProps = ButtonIconButtonProps | LinkIconButtonProps;
|
|
201
|
+
declare function IconButton({ variant, size, label, icon, className, ...props }: IconButtonProps): react_jsx_runtime.JSX.Element;
|
|
202
|
+
|
|
203
|
+
type InputBaseProps = {
|
|
204
|
+
className?: string;
|
|
205
|
+
tone?: 'default' | 'warning';
|
|
206
|
+
};
|
|
207
|
+
type TextInputProps = InputBaseProps & InputHTMLAttributes<HTMLInputElement> & {
|
|
208
|
+
as?: 'input';
|
|
209
|
+
};
|
|
210
|
+
type TextareaProps = InputBaseProps & TextareaHTMLAttributes<HTMLTextAreaElement> & {
|
|
211
|
+
as: 'textarea';
|
|
212
|
+
};
|
|
213
|
+
type InputProps = TextInputProps | TextareaProps;
|
|
214
|
+
declare function Input(props: InputProps): react_jsx_runtime.JSX.Element;
|
|
215
|
+
|
|
216
|
+
type PanelVariant = 'default' | 'subtle' | 'raised';
|
|
217
|
+
type PanelPadding = 'none' | 'sm' | 'md' | 'lg';
|
|
218
|
+
interface PanelProps extends HTMLAttributes<HTMLElement> {
|
|
219
|
+
as?: ElementType;
|
|
220
|
+
variant?: PanelVariant;
|
|
221
|
+
padding?: PanelPadding;
|
|
222
|
+
children: ReactNode;
|
|
223
|
+
}
|
|
224
|
+
interface PanelSectionProps extends HTMLAttributes<HTMLDivElement> {
|
|
225
|
+
children: ReactNode;
|
|
226
|
+
}
|
|
227
|
+
declare function Panel({ as: Component, variant, padding, className, children, ...props }: PanelProps): react_jsx_runtime.JSX.Element;
|
|
228
|
+
declare function PanelHeader({ className, children, ...props }: PanelSectionProps): react_jsx_runtime.JSX.Element;
|
|
229
|
+
declare function PanelBody({ className, children, ...props }: PanelSectionProps): react_jsx_runtime.JSX.Element;
|
|
230
|
+
declare function PanelFooter({ className, children, ...props }: PanelSectionProps): react_jsx_runtime.JSX.Element;
|
|
231
|
+
|
|
232
|
+
interface SegmentedOption<T extends string> {
|
|
233
|
+
value: T;
|
|
234
|
+
label: string;
|
|
235
|
+
disabled?: boolean;
|
|
236
|
+
}
|
|
237
|
+
interface SegmentedControlProps<T extends string> {
|
|
238
|
+
value: T;
|
|
239
|
+
onChange: (value: T) => void;
|
|
240
|
+
options: Array<SegmentedOption<T>>;
|
|
241
|
+
size?: 'sm' | 'md';
|
|
242
|
+
className?: string;
|
|
243
|
+
ariaLabel: string;
|
|
244
|
+
}
|
|
245
|
+
declare function SegmentedControl<T extends string>({ value, onChange, options, size, className, ariaLabel, }: SegmentedControlProps<T>): react_jsx_runtime.JSX.Element;
|
|
246
|
+
|
|
247
|
+
interface SelectOption<T extends string> {
|
|
248
|
+
value: T;
|
|
249
|
+
label: string;
|
|
250
|
+
disabled?: boolean;
|
|
251
|
+
}
|
|
252
|
+
interface SelectRenderValueArgs<T extends string> {
|
|
253
|
+
open: boolean;
|
|
254
|
+
placeholder: string;
|
|
255
|
+
selectedOption?: SelectOption<T>;
|
|
256
|
+
}
|
|
257
|
+
interface SelectRenderOptionArgs<T extends string> {
|
|
258
|
+
option: SelectOption<T>;
|
|
259
|
+
index: number;
|
|
260
|
+
selected: boolean;
|
|
261
|
+
highlighted: boolean;
|
|
262
|
+
}
|
|
263
|
+
interface SelectProps<T extends string> {
|
|
264
|
+
value: T | '';
|
|
265
|
+
onChange: (value: T) => void;
|
|
266
|
+
options: Array<SelectOption<T>>;
|
|
267
|
+
placeholder?: string;
|
|
268
|
+
size?: 'sm' | 'md';
|
|
269
|
+
tone?: 'default' | 'warning';
|
|
270
|
+
disabled?: boolean;
|
|
271
|
+
className?: string;
|
|
272
|
+
ariaLabel: string;
|
|
273
|
+
renderValue?: (args: SelectRenderValueArgs<T>) => ReactNode;
|
|
274
|
+
renderOption?: (args: SelectRenderOptionArgs<T>) => ReactNode;
|
|
275
|
+
}
|
|
276
|
+
declare function Select<T extends string>({ value, onChange, options, placeholder, size, tone, disabled, className, ariaLabel, renderValue, renderOption, }: SelectProps<T>): react_jsx_runtime.JSX.Element;
|
|
277
|
+
|
|
278
|
+
type SkeletonAnimation = 'pulse' | 'scan';
|
|
279
|
+
type SkeletonTone = 'default' | 'emphasis' | 'warm';
|
|
280
|
+
type SkeletonSpeed = 'slow' | 'default' | 'fast';
|
|
281
|
+
interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {
|
|
282
|
+
animation?: SkeletonAnimation;
|
|
283
|
+
tone?: SkeletonTone;
|
|
284
|
+
speed?: SkeletonSpeed;
|
|
285
|
+
}
|
|
286
|
+
declare function Skeleton({ className, animation, tone, speed, style, ...props }: SkeletonProps): react_jsx_runtime.JSX.Element;
|
|
287
|
+
|
|
288
|
+
type SpinnerSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
289
|
+
type SpinnerVariant = 'ring' | 'arc' | 'dots' | 'bars' | 'bounce' | 'pulse' | 'orbit' | 'flow';
|
|
290
|
+
interface SpinnerProps {
|
|
291
|
+
variant?: SpinnerVariant;
|
|
292
|
+
size?: SpinnerSize | number;
|
|
293
|
+
className?: string;
|
|
294
|
+
label?: string;
|
|
295
|
+
}
|
|
296
|
+
declare function Spinner({ variant, size, className, label }: SpinnerProps): react_jsx_runtime.JSX.Element;
|
|
297
|
+
|
|
298
|
+
type StatusNoticeTone = 'neutral' | 'info' | 'success' | 'warning' | 'danger';
|
|
299
|
+
interface StatusNoticeProps extends HTMLAttributes<HTMLDivElement> {
|
|
300
|
+
tone?: StatusNoticeTone;
|
|
301
|
+
icon?: ReactNode;
|
|
302
|
+
children: ReactNode;
|
|
303
|
+
}
|
|
304
|
+
declare function StatusNotice({ tone, icon, className, children, ...props }: StatusNoticeProps): react_jsx_runtime.JSX.Element;
|
|
305
|
+
|
|
306
|
+
type SwitchSize = 'sm' | 'md';
|
|
307
|
+
interface SwitchProps {
|
|
308
|
+
checked: boolean;
|
|
309
|
+
onChange: (checked: boolean) => void;
|
|
310
|
+
size?: SwitchSize;
|
|
311
|
+
disabled?: boolean;
|
|
312
|
+
className?: string;
|
|
313
|
+
ariaLabel: string;
|
|
314
|
+
}
|
|
315
|
+
declare function Switch({ checked, onChange, size, disabled, className, ariaLabel, }: SwitchProps): react_jsx_runtime.JSX.Element;
|
|
316
|
+
|
|
317
|
+
type ToastTone = 'success' | 'warning' | 'danger' | 'info';
|
|
318
|
+
interface ToastInput {
|
|
319
|
+
title?: string;
|
|
320
|
+
message: string;
|
|
321
|
+
duration?: number;
|
|
322
|
+
}
|
|
323
|
+
interface ToastItem {
|
|
324
|
+
id: number;
|
|
325
|
+
title?: string;
|
|
326
|
+
message: string;
|
|
327
|
+
tone: ToastTone;
|
|
328
|
+
duration: number;
|
|
329
|
+
}
|
|
330
|
+
interface ToastAPI {
|
|
331
|
+
success: (input: string | ToastInput, duration?: number) => void;
|
|
332
|
+
warning: (input: string | ToastInput, duration?: number) => void;
|
|
333
|
+
danger: (input: string | ToastInput, duration?: number) => void;
|
|
334
|
+
info: (input: string | ToastInput, duration?: number) => void;
|
|
335
|
+
}
|
|
336
|
+
interface ToastRenderArgs {
|
|
337
|
+
item: ToastItem;
|
|
338
|
+
dismiss: () => void;
|
|
339
|
+
icon: ReactNode;
|
|
340
|
+
}
|
|
341
|
+
declare function useToast(): ToastAPI;
|
|
342
|
+
declare function ToastProvider({ children, renderToast, }: {
|
|
343
|
+
children: ReactNode;
|
|
344
|
+
renderToast?: (args: ToastRenderArgs) => ReactNode;
|
|
345
|
+
}): react_jsx_runtime.JSX.Element;
|
|
346
|
+
|
|
347
|
+
type Placement = 'top' | 'bottom' | 'left' | 'right';
|
|
348
|
+
type TooltipDensity = 'compact' | 'default';
|
|
349
|
+
interface TooltipProps {
|
|
350
|
+
content: ReactNode;
|
|
351
|
+
placement?: Placement;
|
|
352
|
+
density?: TooltipDensity;
|
|
353
|
+
showDelay?: number;
|
|
354
|
+
hideDelay?: number;
|
|
355
|
+
arrow?: boolean;
|
|
356
|
+
renderArrow?: (args: {
|
|
357
|
+
placement: Placement;
|
|
358
|
+
}) => ReactNode;
|
|
359
|
+
className?: string;
|
|
360
|
+
children: ReactElement;
|
|
361
|
+
}
|
|
362
|
+
declare function Tooltip({ content, placement: preferredPlacement, density, showDelay, hideDelay, arrow, renderArrow, className, children, }: TooltipProps): react_jsx_runtime.JSX.Element;
|
|
363
|
+
|
|
364
|
+
export { Avatar, Badge, type BadgeProps, Button, type ButtonProps, ConfirmProvider, Dialog, Drawer, DropdownMenu, type DropdownMenuAlign, type DropdownMenuContentProps, type DropdownMenuItemProps, type DropdownMenuProps, type DropdownMenuRole, type DropdownMenuSide, type DropdownMenuTriggerProps, EmptyState, type EmptyStateProps, Field, IconButton, type IconButtonProps, Input, type InputProps, Panel, PanelBody, PanelFooter, PanelHeader, SegmentedControl, type SegmentedOption, Select, type SelectOption, type SelectRenderOptionArgs, type SelectRenderValueArgs, Skeleton, type SkeletonAnimation, type SkeletonSpeed, type SkeletonTone, Spinner, StatusNotice, type StatusNoticeProps, Switch, type ToastInput, ToastProvider, type ToastRenderArgs, Tooltip, buttonClassName, useConfirm, useToast };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{clsx as kt}from"clsx";import{useState as At}from"react";import{jsx as ye}from"react/jsx-runtime";var Ht={xs:"h-6 w-6 text-[10px]",sm:"h-8 w-8 text-xs",md:"h-10 w-10 text-sm",lg:"h-14 w-14 text-lg"};function Bt(e){let t=e.trim().split(/\s+/);return t.length>=2?(t[0][0]+t[t.length-1][0]).toUpperCase():e.slice(0,2).toUpperCase()}function He({src:e,alt:t,name:n,size:o="md",tone:r="neutral",className:i}){let[s,c]=At(!1),u=e&&!s,a=n?Bt(n):"?";return ye("span",{"data-tone":r,className:kt("ui-avatar inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full font-medium select-none",Ht[o],i),children:u?ye("img",{src:e,alt:t??n??"",className:"h-full w-full object-cover",onError:()=>c(!0)}):ye("span",{"aria-label":t??n,children:a})})}import{clsx as _t}from"clsx";import{jsx as Ot}from"react/jsx-runtime";function Be({tone:e="neutral",variant:t="soft",size:n="xs",className:o,children:r,...i}){return Ot("span",{"data-tone":e,"data-variant":t,"data-size":n,className:_t("ui-badge inline-flex items-center rounded-full border text-[var(--badge-text)]",n==="xs"?"px-2.5 py-1 text-[11px]":"px-3 py-1 text-xs font-medium",o),...i,children:r})}import{clsx as Zt}from"clsx";import{clsx as zt}from"clsx";import{jsx as y,jsxs as G}from"react/jsx-runtime";var Ft={xs:12,sm:14,md:16,lg:24};function Vt({px:e}){let n=Math.PI*2*9;return G("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",children:[y("circle",{cx:"12",cy:"12",r:9,stroke:"currentColor",strokeWidth:"3",opacity:"0.2"}),y("circle",{cx:"12",cy:"12",r:9,stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeDasharray:`${n*.28} ${n*.72}`})]})}function $t({px:e}){return G("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",children:[y("path",{d:"M12 2a10 10 0 0 1 10 10",opacity:"0.9"}),y("path",{d:"M12 2a10 10 0 0 0-7.07 2.93",opacity:"0.2"}),y("path",{d:"M4.93 4.93A10 10 0 0 0 2 12",opacity:"0.2"}),y("path",{d:"M2 12a10 10 0 0 0 2.93 7.07",opacity:"0.2"}),y("path",{d:"M4.93 19.07A10 10 0 0 0 12 22",opacity:"0.2"}),y("path",{d:"M12 22a10 10 0 0 0 7.07-2.93",opacity:"0.2"}),y("path",{d:"M19.07 19.07A10 10 0 0 0 22 12",opacity:"0.2"})]})}function Wt({px:e}){return y("svg",{width:e,height:e,viewBox:"0 0 24 24",children:[0,1,2,3,4,5,6,7].map(n=>{let o=n/8*360,r=.15+n/8*.85;return y("circle",{cx:"12",cy:"3.5",r:"1.8",fill:"currentColor",opacity:r,transform:`rotate(${o} 12 12)`},n)})})}function Kt({px:e}){return y("svg",{width:e,height:e,viewBox:"0 0 24 24",children:[0,1,2,3].map(t=>G("rect",{x:3+t*5.5,y:"4",width:"3",height:"16",rx:"1.5",fill:"currentColor",opacity:"0.3",children:[y("animate",{attributeName:"opacity",values:"0.3;1;0.3",dur:"1s",begin:`${t*.15}s`,repeatCount:"indefinite"}),y("animate",{attributeName:"height",values:"16;8;16",dur:"1s",begin:`${t*.15}s`,repeatCount:"indefinite"}),y("animate",{attributeName:"y",values:"4;8;4",dur:"1s",begin:`${t*.15}s`,repeatCount:"indefinite"})]},t))})}function Ut({px:e}){let t=e*.14,n=e*.33,o=e/2-n,r=e/2,i=e/2+n,s=e/2;return y("svg",{width:e,height:e,viewBox:`0 0 ${e} ${e}`,children:[o,r,i].map((c,u)=>G("circle",{cx:c,cy:s,r:t,fill:"currentColor",opacity:"0.4",children:[y("animate",{attributeName:"cy",values:`${s};${s-e*.25};${s}`,dur:"0.6s",begin:`${u*.12}s`,repeatCount:"indefinite",calcMode:"spline",keySplines:"0.4 0 0.2 1;0.4 0 0.2 1"}),y("animate",{attributeName:"opacity",values:"0.4;1;0.4",dur:"0.6s",begin:`${u*.12}s`,repeatCount:"indefinite"})]},u))})}function Gt({px:e}){return G("svg",{width:e,height:e,viewBox:"0 0 24 24",children:[G("circle",{cx:"12",cy:"12",r:"0",fill:"currentColor",opacity:"0",children:[y("animate",{attributeName:"r",values:"4;10;4",dur:"1.2s",repeatCount:"indefinite"}),y("animate",{attributeName:"opacity",values:"0.8;0.1;0.8",dur:"1.2s",repeatCount:"indefinite"})]}),y("circle",{cx:"12",cy:"12",r:"3.5",fill:"currentColor",opacity:"0.7"})]})}function qt({px:e}){return G("svg",{width:e,height:e,viewBox:"0 0 24 24",children:[y("circle",{cx:"12",cy:"12",r:"8",stroke:"currentColor",strokeWidth:"1.5",fill:"none",opacity:"0.15"}),y("circle",{cx:"12",cy:"4",r:"2.2",fill:"currentColor",children:y("animateTransform",{attributeName:"transform",type:"rotate",from:"0 12 12",to:"360 12 12",dur:"0.9s",repeatCount:"indefinite"})}),y("circle",{cx:"12",cy:"20",r:"1.5",fill:"currentColor",opacity:"0.5",children:y("animateTransform",{attributeName:"transform",type:"rotate",from:"0 12 12",to:"-360 12 12",dur:"0.9s",repeatCount:"indefinite"})})]})}function Xt({px:e}){let t=e*.14,n=e*.33,o=e/2-n,r=e/2,i=e/2+n,s=e/2;return y("svg",{width:e,height:e,viewBox:`0 0 ${e} ${e}`,children:[o,r,i].map((c,u)=>y("circle",{cx:c,cy:s,r:t,fill:"currentColor",opacity:"0.25",children:y("animate",{attributeName:"opacity",values:"0.25;1;0.25",dur:"0.9s",begin:`${u*.2}s`,repeatCount:"indefinite"})},u))})}var Yt={ring:Vt,arc:$t,dots:Wt,bars:Kt,bounce:Ut,pulse:Gt,orbit:qt,flow:Xt},Jt=new Set(["ring","arc","dots"]);function ue({variant:e="ring",size:t="md",className:n,label:o}){let r=typeof t=="number"?t:Ft[t],i=Yt[e];return y("span",{"aria-hidden":!o,"aria-label":o,role:o?"img":void 0,className:zt("ui-spinner inline-flex",Jt.has(e)&&"motion-safe:animate-spin",n),children:y(i,{px:r})})}import{Fragment as jt,jsx as q,jsxs as Qt}from"react/jsx-runtime";function _e({variant:e="secondary",size:t="md",loading:n=!1,className:o}){return Zt("ui-button","inline-flex items-center justify-center gap-2 rounded-md border font-medium transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-inset disabled:cursor-not-allowed disabled:opacity-[var(--button-disabled-opacity)]",t==="sm"?"min-h-8 px-3 text-xs":"min-h-9 px-4 text-sm",n&&"pointer-events-none cursor-wait",o)}function ee(e){let{variant:t="secondary",size:n="md",loading:o=!1,leadingIcon:r,trailingIcon:i,className:s,children:c,...u}=e,a=Qt(jt,{children:[o?q("span",{className:"shrink-0",children:q(ue,{size:n==="sm"?"sm":"md"})}):r?q("span",{className:"shrink-0",children:r}):null,q("span",{children:c}),!o&&i?q("span",{className:"shrink-0",children:i}):null]}),d=_e({variant:t,size:n,loading:o,className:s});if("href"in e&&e.href){let{href:p,...m}=u;return q("a",{href:p,"data-variant":t,"data-size":n,"data-loading":o?"true":void 0,"aria-disabled":o||void 0,tabIndex:o?-1:void 0,className:d,onClick:o?h=>h.preventDefault():void 0,...m,children:a})}let l=u;return q("button",{type:l.type??"button","data-variant":t,"data-size":n,"data-loading":o?"true":void 0,disabled:l.disabled||o,className:d,...l,children:a})}import{createContext as an,useCallback as ze,useContext as ln,useRef as un,useState as dn}from"react";import{clsx as te}from"clsx";import{useEffect as en,useRef as Oe,useCallback as tn}from"react";import{jsx as ne,jsxs as sn}from"react/jsx-runtime";function nn({className:e,children:t,...n}){return ne("div",{className:te("ui-dialog__header px-5 pt-5 pb-1 text-base font-semibold",e),...n,children:t})}function on({className:e,children:t,...n}){return ne("div",{className:te("ui-dialog__body px-5 py-3 text-sm",e),...n,children:t})}function rn({className:e,children:t,...n}){return ne("div",{className:te("ui-dialog__footer flex items-center justify-end gap-2 px-5 pt-3 pb-5",e),...n,children:t})}function z({open:e,onClose:t,size:n="sm",children:o,className:r,overlayClassName:i,panelClassName:s,...c}){let u=Oe(null),a=Oe(null),d=tn(l=>{l.key==="Escape"&&(l.stopPropagation(),t())},[t]);return en(()=>(e?(a.current=document.activeElement,document.body.style.overflow="hidden",requestAnimationFrame(()=>{let l=u.current;if(!l)return;let p=l.querySelector('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');p?p.focus():l.focus()}),document.addEventListener("keydown",d)):(document.body.style.overflow="",a.current?.focus()),()=>{document.removeEventListener("keydown",d),document.body.style.overflow=""}),[e,d]),e?sn("div",{"data-state":"open",className:"ui-dialog-overlay fixed inset-0 z-50 flex items-center justify-center",children:[ne("button",{type:"button","aria-label":"Close dialog","data-state":"open",className:te("ui-dialog-backdrop absolute inset-0 bg-black/30",i),onClick:t}),ne("div",{ref:u,role:"dialog","aria-modal":"true",tabIndex:-1,"data-state":"open","data-size":n,className:te("ui-dialog relative z-10 w-full rounded-xl shadow-xl","animate-[dialog-in_0.2s_var(--ease-standard)]",n==="sm"?"max-w-[26rem]":"max-w-[32rem]",s,r),...c,children:o})]}):null}z.Header=nn;z.Body=on;z.Footer=rn;import{Fragment as fn,jsx as Z,jsxs as Te}from"react/jsx-runtime";var Fe=an(null);function cn(){let e=ln(Fe);if(!e)throw new Error("useConfirm must be used within <ConfirmProvider>");return e}function pn({children:e}){let[t,n]=dn(null),o=un(null),r=ze(s=>(o.current&&o.current.resolve(!1),new Promise(c=>{let u={options:s,resolve:c};o.current=u,n(u)})),[]),i=ze(s=>{o.current&&(o.current.resolve(s),o.current=null),n(null)},[]);return Te(Fe.Provider,{value:r,children:[e,Z(z,{open:t!==null,onClose:()=>i(!1),children:t&&Te(fn,{children:[Z(z.Header,{children:t.options.title}),Z(z.Body,{children:typeof t.options.description=="string"?Z("p",{className:"whitespace-pre-wrap",children:t.options.description}):t.options.description}),Te(z.Footer,{children:[Z(ee,{variant:"ghost",size:"sm",onClick:()=>i(!1),children:t.options.cancelLabel??"\u53D6\u6D88"}),Z(ee,{variant:t.options.variant??"primary",size:"sm",onClick:()=>i(!0),children:t.options.confirmLabel??"\u786E\u8BA4"})]})]})})]})}import{clsx as K}from"clsx";import{Children as mn,cloneElement as gn,createContext as Ve,isValidElement as bn,useCallback as A,useContext as Me,useEffect as X,useId as de,useLayoutEffect as hn,useMemo as pe,useRef as W,useState as oe}from"react";import{createPortal as vn}from"react-dom";import{jsx as B,jsxs as Ge}from"react/jsx-runtime";var $e=Ve(null),Se=Ve(null);function Re(e){let t=Me($e);if(!t)throw new Error(`${e} must be used within DropdownMenu.`);return t}function We(e){let t=Me(Se);if(!t)throw new Error(`${e} must be used within DropdownMenu.Content.`);return t}function j(e,t){return n=>{e?.(n),t(n)}}function Ke(...e){return t=>{for(let n of e)n&&(typeof n=="function"?n(t):n.current=t)}}function ce(e){return typeof e=="string"||typeof e=="number"?String(e):Array.isArray(e)?e.map(ce).join(" "):!e||typeof e=="boolean"?"":bn(e)?ce(e.props.children):""}function wn(e){return[...e].sort((t,n)=>{let o=t.ref.current,r=n.ref.current;if(!o||!r)return 0;let i=o.compareDocumentPosition(r);return i&Node.DOCUMENT_POSITION_FOLLOWING?-1:i&Node.DOCUMENT_POSITION_PRECEDING?1:0})}function xn(e){let{anchorRect:t,contentRect:n,sideOffset:o,alignOffset:r,collisionPadding:i}=e,s=window.innerWidth,c=window.innerHeight;function u(g,b){let M=0,w=0;return g==="bottom"?(M=t.bottom+o,b==="start"?w=t.left+r:b==="end"?w=t.right-n.width+r:w=t.left+(t.width-n.width)/2+r):g==="top"?(M=t.top-n.height-o,b==="start"?w=t.left+r:b==="end"?w=t.right-n.width+r:w=t.left+(t.width-n.width)/2+r):g==="right"?(w=t.right+o,b==="start"?M=t.top+r:b==="end"?M=t.bottom-n.height+r:M=t.top+(t.height-n.height)/2+r):(w=t.left-n.width-o,b==="start"?M=t.top+r:b==="end"?M=t.bottom-n.height+r:M=t.top+(t.height-n.height)/2+r),{top:M,left:w}}let a={top:"bottom",bottom:"top",left:"right",right:"left"},d=e.side,l=e.align,p=u(d,l);if(p.left<i||p.top<i||p.left+n.width>s-i||p.top+n.height>c-i){let g=u(a[d],l);g.left>=i&&g.top>=i&&g.left+n.width<=s-i&&g.top+n.height<=c-i&&(d=a[d],p=g)}let h=s-n.width-i,R=c-n.height-i;return p.left=Math.max(i,Math.min(p.left,h)),p.top=Math.max(i,Math.min(p.top,R)),{top:p.top,left:p.left,side:d,align:l}}function Ue({open:e,defaultOpen:t=!1,onOpenChange:n,side:o="bottom",align:r="start",sideOffset:i=8,alignOffset:s=0,collisionPadding:c=8,portal:u=!0,contentRole:a="menu",children:d}){let l=Me(Se),[p,m]=oe(t),h=e!==void 0,R=h?e:p,g=W(null),b=W(null),M=W("selected"),w=de(),N=de(),x=A(S=>{h||m(S),n?.(S)},[h,n]),D=A(()=>{x(!1)},[x]),I=A(()=>{x(!1),l?.closeTree()},[l,x]),C=A(()=>{x(!R)},[R,x]),P=A(()=>{g.current?.focus()},[]),f=pe(()=>({open:R,setOpen:x,toggleOpen:C,triggerRef:g,contentRef:b,side:o,align:r,sideOffset:i,alignOffset:s,collisionPadding:c,portal:u,contentRole:a,triggerId:w,contentId:N,focusIntentRef:M,parentList:l,isSubmenu:!!l,closeSelf:D,closeTree:I,focusTrigger:P}),[R,r,s,D,I,c,a,l,u,x,o,i,C,w,N,P]);return B($e.Provider,{value:f,children:d})}function yn({asChild:e=!1,disabled:t=!1,className:n,children:o}){let{open:r,setOpen:i,toggleOpen:s,triggerRef:c,contentRole:u,triggerId:a,contentId:d,focusIntentRef:l,isSubmenu:p}=Re("DropdownMenu.Trigger"),m=mn.only(o),h=m.props??{},R=typeof h.className=="string"?h.className:void 0,g={id:a,"data-state":r?"open":"closed","aria-expanded":r,"aria-haspopup":u,"aria-controls":r?d:void 0,onClick:j(h.onClick,b=>{if(t){b.preventDefault();return}l.current="selected",s()}),onKeyDown:j(h.onKeyDown,b=>{t||(b.key==="ArrowDown"?(b.preventDefault(),l.current="first",i(!0)):b.key==="ArrowUp"?(b.preventDefault(),l.current="last",i(!0)):!p&&(b.key==="Enter"||b.key===" ")&&(b.preventDefault(),l.current="selected",s()))})};return e?gn(m,{...g,ref:Ke(c,h.ref),className:K(n,R),type:m.type==="button"?h.type??"button":h.type}):B("button",{ref:c,disabled:t,type:"button",className:K("ui-dropdown-menu__trigger",n),...g,children:m})}function Tn({className:e,children:t,style:n,matchTriggerWidth:o=!1,maxHeight:r=320,...i}){let{open:s,setOpen:c,triggerRef:u,contentRef:a,side:d,align:l,sideOffset:p,alignOffset:m,collisionPadding:h,portal:R,contentRole:g,triggerId:b,contentId:M,focusIntentRef:w,parentList:N,isSubmenu:x,closeSelf:D,closeTree:I,focusTrigger:C}=Re("DropdownMenu.Content"),P=W([]),[f,S]=oe(null),[H,U]=oe(null),[le,Dt]=oe(null),[ve,It]=oe(!1),we=W(""),Y=W(null),Le=A(v=>(P.current=[...P.current.filter(E=>E.id!==v.id),v],()=>{P.current=P.current.filter(E=>E.id!==v.id)}),[]),_=A(()=>wn(P.current),[]),Ce=A(v=>{w.current=v},[w]);X(()=>{It(!0)},[]);let Lt=pe(()=>({role:g,highlightedId:f,setHighlightedId:S,registerItem:Le,getItems:_,requestFocusIntent:Ce,closeTree:I,closeSelf:D,focusTrigger:C,activeSubmenuId:H,setActiveSubmenuId:U,contentRef:a}),[H,D,I,a,g,C,_,f,Le,Ce]),J=A(()=>{if(!u.current||!a.current)return;let v=u.current.getBoundingClientRect(),E=a.current.getBoundingClientRect();Dt(xn({anchorRect:v,contentRect:E,side:d,align:l,sideOffset:p,alignOffset:m,collisionPadding:h}))},[l,m,h,a,d,p,u]);hn(()=>{if(!(!s||!ve))return J(),window.addEventListener("resize",J),window.addEventListener("scroll",J,!0),()=>{window.removeEventListener("resize",J),window.removeEventListener("scroll",J,!0)}},[ve,s,J]),X(()=>{if(!s){S(null),U(null);return}let v=_().filter(T=>!T.disabled);if(v.length===0)return;let E=v[0];w.current==="last"?E=v[v.length-1]:w.current==="selected"&&(E=v.find(T=>T.selected)??v[0]),S(E.id),requestAnimationFrame(()=>{a.current?.focus(),E.ref.current?.scrollIntoView({block:"nearest"})})},[a,w,_,s]),X(()=>{if(!s)return;function v(E){let T=E.target,k=u.current?.contains(T),F=a.current?.contains(T);if(!k&&!F){let O=N?.contentRef.current?.contains(T);if(x&&O){D(),N?.setActiveSubmenuId(null);return}I()}}return document.addEventListener("mousedown",v),()=>document.removeEventListener("mousedown",v)},[D,I,a,x,s,N,u]),X(()=>{if(s)return()=>{Y.current&&clearTimeout(Y.current)}},[s]);let $=A(v=>{if(S(v),!v){U(null);return}_().find(T=>T.id===v)?.submenu||U(null)},[_]),xe=A((v,E="first")=>{let T=_().filter(V=>!V.disabled);if(T.length===0)return;let k=T.findIndex(V=>V.id===f);if(k===-1){$(E==="last"?T[T.length-1].id:T[0].id);return}let F=(k+v+T.length)%T.length,O=T[F];$(O.id),O.ref.current?.scrollIntoView({block:"nearest"})},[_,f,$]),ke=A(v=>{let E=v.length===1?v.toLowerCase():"";if(!E)return;Y.current&&clearTimeout(Y.current),we.current+=E,Y.current=setTimeout(()=>{we.current="",Y.current=null},350);let T=_().filter(V=>!V.disabled);if(T.length===0)return;let k=T.findIndex(V=>V.id===f),O=(k>=0?[...T.slice(k+1),...T.slice(0,k+1)]:T).find(V=>V.textValue.toLowerCase().startsWith(we.current));O&&($(O.id),O.ref.current?.scrollIntoView({block:"nearest"}))},[_,f,$]),Ct=A(v=>{let E=_(),T=E.find(k=>k.id===f)??null;switch(v.key){case"ArrowDown":v.preventDefault(),xe(1);break;case"ArrowUp":v.preventDefault(),xe(-1,"last");break;case"Home":v.preventDefault();{let k=E.find(F=>!F.disabled);k&&$(k.id)}break;case"End":v.preventDefault();{let k=E.filter(O=>!O.disabled),F=k[k.length-1];F&&$(F.id)}break;case"Enter":case" ":T&&!T.disabled&&(v.preventDefault(),T.click());break;case"ArrowRight":T?.submenu&&(v.preventDefault(),T.openSubmenu?.());break;case"ArrowLeft":x&&(v.preventDefault(),D(),C(),N?.setActiveSubmenuId(null));break;case"Tab":I();break;case"Escape":v.preventDefault(),D(),C(),x&&N?.setActiveSubmenuId(null);break;default:ke(v.key)}},[D,I,C,_,ke,f,$,x,xe,N]);if(!s||!ve)return null;let Ae=B(Se.Provider,{value:Lt,children:B("div",{ref:a,id:M,role:g,tabIndex:-1,"aria-labelledby":g==="menu"?b:void 0,"data-state":"open","data-side":le?.side??d,"data-align":le?.align??l,className:K("ui-dropdown-menu__content",x&&"ui-dropdown-menu__content--submenu",e),style:{...n,position:"fixed",top:le?.top??0,left:le?.left??0,maxHeight:r,minWidth:o?u.current?.getBoundingClientRect().width:void 0},onKeyDown:Ct,...i,children:t})});return R?vn(Ae,document.body):Ae}function Mn({className:e,children:t,...n}){return B("div",{className:K("ui-dropdown-menu__group",e),...n,children:t})}function Sn({className:e,children:t,...n}){return B("div",{className:K("ui-dropdown-menu__label",e),...n,children:t})}function Rn({className:e,...t}){return B("div",{role:"separator",className:K("ui-dropdown-menu__separator",e),...t})}function Pn({className:e,children:t,inset:n=!1,disabled:o=!1,selected:r=!1,destructive:i=!1,closeOnSelect:s=!0,shortcut:c,indicator:u,onSelect:a,onMouseEnter:d,onClick:l,...p}){let m=de(),h=W(null),{role:R,highlightedId:g,setHighlightedId:b,registerItem:M,closeTree:w,setActiveSubmenuId:N}=We("DropdownMenu.Item"),x=pe(()=>ce(t),[t]),D=g===m,I=A(()=>{o||(a?.(),s&&w())},[s,w,o,a]);return X(()=>M({id:m,ref:h,disabled:o,submenu:!1,selected:r,textValue:x,closeOnSelect:s,click:I}),[s,o,I,m,M,r,x]),Ge("button",{ref:h,id:m,type:"button",role:R==="listbox"?"option":"menuitem",tabIndex:-1,disabled:o,"aria-selected":R==="listbox"?r:void 0,"data-highlighted":D||void 0,"data-selected":r||void 0,"data-disabled":o||void 0,"data-destructive":i||void 0,className:K("ui-dropdown-menu__item",n&&"ui-dropdown-menu__item--inset",e),onMouseEnter:j(d,()=>{o||(b(m),N(null))}),onClick:j(l,C=>{C.preventDefault(),I()}),...p,children:[B("span",{className:"ui-dropdown-menu__item-main",children:t}),c?B("span",{className:"ui-dropdown-menu__shortcut",children:c}):null,r?B("span",{className:"ui-dropdown-menu__indicator",children:u??"\u2713"}):null]})}function Nn(e){return B(Ue,{side:"right",align:"start",sideOffset:6,...e,contentRole:"menu"})}function En({className:e,children:t,inset:n=!1,disabled:o=!1,destructive:r=!1,shortcut:i,onSelect:s,onMouseEnter:c,onClick:u,...a}){let d=de(),l=W(null),p=Re("DropdownMenu.SubTrigger"),{highlightedId:m,setHighlightedId:h,registerItem:R,setActiveSubmenuId:g,activeSubmenuId:b}=We("DropdownMenu.SubTrigger"),M=pe(()=>ce(t),[t]),w=m===d,N=p.open&&b===d,x=A(()=>{o||(p.focusIntentRef.current="first",h(d),g(d),p.setOpen(!0))},[o,d,g,h,p]);return X(()=>R({id:d,ref:l,disabled:o,submenu:!0,selected:!1,textValue:M,closeOnSelect:!1,click:x,openSubmenu:x}),[o,d,x,R,M]),X(()=>{b!==d&&p.open&&p.setOpen(!1)},[b,d,p]),Ge("button",{ref:Ke(l,p.triggerRef),id:p.triggerId,type:"button",role:"menuitem",tabIndex:-1,"aria-haspopup":"menu","aria-expanded":p.open,"aria-controls":p.open?p.contentId:void 0,"data-highlighted":w||void 0,"data-state":N?"open":"closed","data-disabled":o||void 0,"data-destructive":r||void 0,className:K("ui-dropdown-menu__item ui-dropdown-menu__sub-trigger",n&&"ui-dropdown-menu__item--inset",e),onMouseEnter:j(c,()=>{x()}),onClick:j(u,D=>{D.preventDefault(),x(),s?.()}),...a,children:[B("span",{className:"ui-dropdown-menu__item-main",children:t}),i?B("span",{className:"ui-dropdown-menu__shortcut",children:i}):null,B("span",{className:"ui-dropdown-menu__submenu-indicator","aria-hidden":"true",children:"\u203A"})]})}var Dn=Object.assign(Ue,{Trigger:yn,Content:Tn,Group:Mn,Label:Sn,Item:Pn,Separator:Rn,Submenu:Nn,SubTrigger:En}),In=Dn;import{clsx as qe}from"clsx";import{Fragment as Ln,jsx as Xe,jsxs as Cn}from"react/jsx-runtime";function Ye({as:e="aside",open:t,children:n,side:o="right",position:r="fixed",showBackdrop:i=!0,onClose:s,closeLabel:c="\u5173\u95ED\u62BD\u5C49",backdropClassName:u,className:a,...d}){let l=o==="left"?"-translate-x-full":"translate-x-full",p=o==="left"?"left-0 top-0":"right-0 top-0",m=r==="fixed"?"fixed":"absolute";return Cn(Ln,{children:[i&&t&&s&&Xe("button",{type:"button","aria-label":c,"data-state":"open",className:qe("ui-drawer-backdrop inset-0 z-10",m,u),onClick:s}),Xe(e,{"aria-hidden":!t,"data-state":t?"open":"closed","data-side":o,className:qe("ui-drawer",m,p,"z-20 flex max-w-full transform flex-col transition-transform duration-200 ease-in-out",t?"pointer-events-auto visible translate-x-0":`pointer-events-none invisible ${l}`,a),...d,children:n})]})}import{clsx as kn}from"clsx";import{jsx as re,jsxs as An}from"react/jsx-runtime";function Je({tone:e="neutral",icon:t,title:n,description:o,action:r,className:i,children:s,...c}){let u=t||n||o||r;return re("div",{"data-tone":e,className:kn("ui-empty-state rounded-lg border px-4 py-3 text-sm",i),...c,children:u?An("div",{className:"flex flex-col items-center gap-2 py-4 text-center",children:[t&&re("div",{className:"ui-empty-state__icon text-lg",children:t}),n&&re("div",{className:"ui-empty-state__title font-medium",children:n}),o&&re("div",{className:"ui-empty-state__description",children:o}),r&&re("div",{className:"mt-2",children:r})]}):s})}import{clsx as Hn}from"clsx";import{jsx as Ze,jsxs as Bn}from"react/jsx-runtime";function je({label:e,help:t,htmlFor:n,children:o,className:r,...i}){return Bn("div",{className:Hn("ui-field block",r),...i,children:[Ze("label",{htmlFor:n,className:"ui-field__label mb-1 block text-xs",children:e}),o,t?Ze("span",{className:"ui-field__help mt-1 block text-xs",children:t}):null]})}import{clsx as _n}from"clsx";import{jsx as Qe}from"react/jsx-runtime";function et({variant:e="ghost",size:t="md",label:n,icon:o,className:r,...i}){let s=_n("ui-icon-button","inline-flex items-center justify-center rounded-md transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-inset disabled:cursor-not-allowed disabled:opacity-50",t==="sm"?"h-7 w-7":"h-8 w-8",r);if("href"in i&&i.href){let{href:u,...a}=i;return Qe("a",{href:u,"aria-label":n,title:a.title??n,"data-variant":e,"data-size":t,className:s,...a,children:o})}let c=i;return Qe("button",{type:c.type??"button","aria-label":n,title:c.title??n,"data-variant":e,"data-size":t,className:s,...c,children:o})}import{clsx as On}from"clsx";import{jsx as nt}from"react/jsx-runtime";function tt(e){return On("ui-input w-full rounded-lg px-3 py-2 text-sm placeholder:text-[var(--field-placeholder)] focus:outline-none focus:ring-1",e)}function ot(e){let{className:t,tone:n="default",...o}=e;return e.as==="textarea"?nt("textarea",{"data-tone":n,className:tt(t),...o}):nt("input",{"data-tone":n,className:tt(t),...o})}import{clsx as fe}from"clsx";import{jsx as me}from"react/jsx-runtime";function zn(e){switch(e){case"none":return"";case"sm":return"p-4";case"lg":return"p-6";default:return"p-5"}}function rt({as:e="section",variant:t="default",padding:n="none",className:o,children:r,...i}){return me(e,{"data-variant":t,className:fe("ui-panel rounded-lg border",zn(n),o),...i,children:r})}function Fn({className:e,children:t,...n}){return me("div",{className:fe("ui-panel-header border-b px-6 py-5",e),...n,children:t})}function Vn({className:e,children:t,...n}){return me("div",{className:fe("px-6 py-5",e),...n,children:t})}function $n({className:e,children:t,...n}){return me("div",{className:fe("ui-panel-footer border-t px-6 py-4",e),...n,children:t})}import{clsx as it}from"clsx";import{jsx as st}from"react/jsx-runtime";function at({value:e,onChange:t,options:n,size:o="sm",className:r,ariaLabel:i}){return st("div",{role:"tablist","aria-label":i,className:it("ui-segmented-control inline-flex rounded-md p-0.5 ring-1",o==="sm"?"text-xs":"text-sm",r),children:n.map(s=>{let c=s.value===e;return st("button",{type:"button",role:"tab","aria-selected":c,disabled:s.disabled,"data-active":c?"true":void 0,className:it("ui-segmented-control__item rounded font-medium transition-colors focus:outline-none focus-visible:ring-1 focus-visible:ring-inset disabled:cursor-not-allowed disabled:opacity-50",o==="sm"?"px-2.5 py-1":"px-3 py-1.5"),onClick:()=>t(s.value),children:s.label},s.value)})})}import{clsx as Q}from"clsx";import{useCallback as Pe,useEffect as lt,useId as Wn,useMemo as Kn,useRef as ut,useState as dt}from"react";import{jsx as ie,jsxs as ct}from"react/jsx-runtime";function pt({value:e,onChange:t,options:n,placeholder:o="Select\u2026",size:r="md",tone:i="default",disabled:s=!1,className:c,ariaLabel:u,renderValue:a,renderOption:d}){let[l,p]=dt(!1),[m,h]=dt(-1),R=ut(null),g=ut(null),b=Wn(),M=n.find(f=>f.value===e),w=Kn(()=>n.reduce((f,S,H)=>(S.disabled||f.push(H),f),[]),[n]),N=Pe(()=>{if(s||n.length===0)return;p(!0);let f=n.findIndex(S=>S.value===e);h(f>=0?f:w[0]??-1)},[s,n,e,w]),x=Pe(()=>{p(!1),h(-1)},[]),D=Pe(f=>{f.disabled||(t(f.value),x())},[t,x]);lt(()=>{if(!l)return;function f(S){R.current&&!R.current.contains(S.target)&&x()}return document.addEventListener("mousedown",f),()=>document.removeEventListener("mousedown",f)},[l,x]),lt(()=>{if(!l||m<0)return;g.current?.children[m]?.scrollIntoView({block:"nearest"})},[l,m]);function I(f){if(!s)switch(f.key){case"Enter":case" ":{f.preventDefault(),l?m>=0&&n[m]&&!n[m].disabled&&D(n[m]):N();break}case"ArrowDown":{if(f.preventDefault(),!l)N();else{let S=w.indexOf(m),H=w[S+1];H!==void 0&&h(H)}break}case"ArrowUp":{if(f.preventDefault(),!l)N();else{let S=w.indexOf(m),H=w[S-1];H!==void 0&&h(H)}break}case"Escape":{l&&(f.preventDefault(),x());break}case"Tab":{l&&x();break}}}let C=e!==""&&M,P=a?a({open:l,placeholder:o,selectedOption:M}):ie("span",{className:Q("truncate",!C&&"ui-select__placeholder"),children:C?M.label:o});return ct("div",{ref:R,"data-state":l?"open":"closed","data-disabled":s||void 0,"data-size":r,"data-tone":i,className:Q("ui-select relative inline-block",c),children:[ct("button",{type:"button",role:"combobox","aria-expanded":l,"aria-haspopup":"listbox","aria-controls":b,"aria-label":u,"aria-activedescendant":l&&m>=0?`${b}-opt-${m}`:void 0,"data-state":l?"open":"closed","data-disabled":s||void 0,"data-tone":i,"data-size":r,"data-open":l||void 0,"data-has-value":C||void 0,disabled:s,className:Q("ui-select__trigger flex w-full items-center justify-between gap-2 rounded-lg text-left transition-colors focus:outline-none focus:ring-1",r==="sm"?"min-h-7 px-2 py-1 text-xs":"min-h-9 px-3 py-2 text-sm"),onClick:()=>l?x():N(),onKeyDown:I,children:[P,ie("svg",{"aria-hidden":"true",className:Q("ui-select__chevron h-3.5 w-3.5 shrink-0 transition-transform",l&&"rotate-180"),viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:ie("path",{d:"M4 6l4 4 4-4"})})]}),l&&ie("ul",{ref:g,id:b,role:"listbox","aria-label":u,"data-state":"open",className:Q("ui-select__dropdown absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-lg py-1 ring-1",r==="sm"?"text-xs":"text-sm"),children:n.map((f,S)=>ie("li",{id:`${b}-opt-${S}`,role:"option","aria-selected":f.value===e,"aria-disabled":f.disabled||void 0,"data-state":f.value===e?"selected":S===m?"highlighted":"idle","data-focused":S===m||void 0,"data-selected":f.value===e||void 0,"data-disabled":f.disabled||void 0,"data-highlighted":S===m||void 0,className:Q("ui-select__option cursor-default select-none px-3 py-1.5 transition-colors",f.disabled&&"cursor-not-allowed opacity-50"),onClick:()=>D(f),onMouseEnter:()=>!f.disabled&&h(S),children:d?d({option:f,index:S,selected:f.value===e,highlighted:S===m}):f.label},f.value))})]})}import{clsx as Un}from"clsx";import{jsx as qn}from"react/jsx-runtime";var Gn={slow:"4s",default:"3s",fast:"2s"};function ft({className:e,animation:t="scan",tone:n="default",speed:o="default",style:r,...i}){let s=n==="warm"?"emphasis":n,c={...r,"--ui-skeleton-scan-duration":Gn[o]};return qn("div",{className:Un("ui-skeleton rounded",e),"data-animation":t,"data-tone":s,"aria-hidden":"true",style:c,...i})}import{clsx as Xn}from"clsx";import{Fragment as Yn,jsx as Ne,jsxs as Jn}from"react/jsx-runtime";function mt({tone:e="neutral",icon:t,className:n,children:o,...r}){return Ne("div",{"data-tone":e,className:Xn("ui-status-notice rounded-md border px-4 py-3 text-sm",t&&"ui-status-notice--with-icon grid grid-cols-[auto_minmax(0,1fr)] gap-3",n),...r,children:t?Jn(Yn,{children:[Ne("span",{className:"ui-status-notice__icon mt-0.5 shrink-0","aria-hidden":"true",children:t}),Ne("div",{className:"min-w-0",children:o})]}):o})}import{clsx as gt}from"clsx";import{jsx as bt}from"react/jsx-runtime";var Zn={sm:"h-5 w-9",md:"h-6 w-11"},jn={sm:"h-3.5 w-3.5",md:"h-4.5 w-4.5"},Qn={sm:"translate-x-4",md:"translate-x-5"};function ht({checked:e,onChange:t,size:n="md",disabled:o=!1,className:r,ariaLabel:i}){return bt("button",{type:"button",role:"switch","aria-checked":e,"aria-label":i,disabled:o,"data-size":n,className:gt("ui-switch relative inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",Zn[n],o&&"cursor-not-allowed opacity-50",r),onClick:()=>t(!e),children:bt("span",{"aria-hidden":"true",className:gt("ui-switch__thumb pointer-events-none inline-block rounded-full bg-white shadow transition-transform",jn[n],e?Qn[n]:"translate-x-0.5")})})}import{clsx as vt}from"clsx";import{createContext as eo,useCallback as wt,useContext as to,useMemo as no,useRef as xt,useState as oo}from"react";import{jsx as L,jsxs as se}from"react/jsx-runtime";var Tt=eo(null),Ee=5,yt=4e3;function ro(){let e=to(Tt);if(!e)throw new Error("useToast must be used within <ToastProvider>");return e}function io({tone:e}){let t={width:16,height:16,viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"};switch(e){case"success":return L("svg",{...t,children:L("path",{d:"M3.5 8.5l3 3 6-7"})});case"warning":return se("svg",{...t,children:[L("path",{d:"M8 5v4"}),L("circle",{cx:"8",cy:"11.5",r:"0.5",fill:"currentColor",stroke:"none"})]});case"danger":return L("svg",{...t,children:L("path",{d:"M4.5 4.5l7 7M11.5 4.5l-7 7"})});case"info":return se("svg",{...t,children:[L("circle",{cx:"8",cy:"3.5",r:"1.2",fill:"currentColor",stroke:"none"}),L("path",{d:"M8 7v5.5"})]})}}function so(e,t){return typeof e=="string"?{message:e,duration:t??yt}:{title:e.title,message:e.message,duration:e.duration??t??yt}}function ao({item:e,onDismiss:t,renderToast:n}){let o=()=>t(e.id),r=L(io,{tone:e.tone});return n?L("div",{role:"status","aria-live":"polite","data-state":"open","data-tone":e.tone,className:vt("ui-toast pointer-events-auto rounded-lg border text-sm backdrop-blur-sm","animate-[toast-in_0.25s_var(--ease-standard)]"),children:n({item:e,dismiss:o,icon:r})}):se("div",{role:"status","aria-live":"polite","data-state":"open","data-tone":e.tone,className:vt("ui-toast pointer-events-auto flex items-start gap-2 rounded-lg border px-4 py-3 text-sm backdrop-blur-sm","animate-[toast-in_0.25s_var(--ease-standard)]"),children:[L("span",{className:"ui-toast__icon mt-0.5 shrink-0","aria-hidden":"true",children:r}),se("span",{className:"min-w-0 flex-1",children:[e.title?L("span",{className:"ui-toast__title block font-medium",children:e.title}):null,L("span",{className:"block",children:e.message})]}),L("button",{type:"button",onClick:o,className:"ui-toast__close -mr-1 -mt-0.5 shrink-0 rounded p-0.5 text-current opacity-50 transition-opacity hover:opacity-100","aria-label":"Dismiss",children:L("svg",{width:"14",height:"14",viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",children:L("path",{d:"M4 4l8 8M12 4l-8 8"})})})]})}function lo({children:e,renderToast:t}){let[n,o]=oo([]),r=xt(0),i=xt(new Map),s=wt(a=>{let d=i.current.get(a);d&&clearTimeout(d),i.current.delete(a),o(l=>l.filter(p=>p.id!==a))},[]),c=wt((a,d,l)=>{let p=r.current++,m=so(d,l),h={id:p,tone:a,...m};o(R=>{let g=[...R,h];if(g.length>Ee){let b=g.slice(0,g.length-Ee);for(let M of b){let w=i.current.get(M.id);w&&clearTimeout(w),i.current.delete(M.id)}return g.slice(-Ee)}return g}),h.duration>0&&i.current.set(p,setTimeout(()=>s(p),h.duration))},[s]),u=no(()=>({success:(a,d)=>c("success",a,d),warning:(a,d)=>c("warning",a,d),danger:(a,d)=>c("danger",a,d),info:(a,d)=>c("info",a,d)}),[c]);return se(Tt.Provider,{value:u,children:[e,L("div",{"aria-label":"Notifications","data-state":n.length>0?"open":"closed",className:"pointer-events-none fixed bottom-4 right-4 z-[9999] flex flex-col-reverse gap-2",children:n.map(a=>L(ao,{item:a,onDismiss:s,renderToast:t},a.id))})]})}import{clsx as uo}from"clsx";import{cloneElement as co,isValidElement as po,useCallback as ge,useEffect as Mt,useId as fo,useLayoutEffect as mo,useRef as be,useState as De}from"react";import{createPortal as go}from"react-dom";import{Fragment as yo,jsx as Ie,jsxs as Nt}from"react/jsx-runtime";var ae=6,St=8,he=4,bo={top:"bottom",bottom:"top",left:"right",right:"left"},ho={top:{left:"50%",top:"100%",transform:"translateX(-50%)"},bottom:{left:"50%",top:-ae,transform:"translateX(-50%) rotate(180deg)"},left:{top:"50%",left:"100%",transform:"translateY(-50%) rotate(-90deg)"},right:{top:"50%",left:-ae,transform:"translateY(-50%) rotate(90deg)"}};function Rt(e,t,n,o){switch(e){case"top":return{top:t.top-n.height-o,left:t.left+t.width/2-n.width/2};case"bottom":return{top:t.bottom+o,left:t.left+t.width/2-n.width/2};case"left":return{top:t.top+t.height/2-n.height/2,left:t.left-n.width-o};case"right":return{top:t.top+t.height/2-n.height/2,left:t.right+o}}}function Pt(e,t){let n=window.innerWidth,o=window.innerHeight;return e.top>=0&&e.left>=0&&e.top+t.height<=o&&e.left+t.width<=n}function vo(e,t,n,o){let r=o?St+ae:St,i=Rt(n,e,t,r),s=n,c=i;if(!Pt(i,t)){let p=bo[n],m=Rt(p,e,t,r);Pt(m,t)&&(s=p,c=m)}let u=window.innerWidth,a=window.innerHeight,d=Math.max(he,Math.min(c.left,u-t.width-he)),l=Math.max(he,Math.min(c.top,a-t.height-he));return{placement:s,top:l,left:d}}function wo(e,t){return n=>{e.current=n;let o=t.props.ref;typeof o=="function"?o(n):o&&typeof o=="object"&&"current"in o&&(o.current=n)}}var xo={compact:"px-2 py-1 text-[11px] max-w-[200px]",default:"px-3 py-2 text-xs max-w-xs"};function Et({content:e,placement:t="top",density:n="default",showDelay:o=300,hideDelay:r=150,arrow:i=!0,renderArrow:s,className:c,children:u}){let[a,d]=De(!1),[l,p]=De(null),[m,h]=De(t),R=be(null),g=be(null),b=be(void 0),M=be(void 0),w=fo(),N=ge(()=>{clearTimeout(b.current),clearTimeout(M.current)},[]),x=ge(()=>{N(),b.current=setTimeout(()=>d(!0),o)},[N,o]),D=ge(()=>{N(),M.current=setTimeout(()=>d(!1),r)},[N,r]),I=ge(P=>{P.key==="Escape"&&a&&d(!1)},[a]);if(mo(()=>{if(!a||!R.current||!g.current)return;function P(){if(!R.current||!g.current)return;let f=R.current.getBoundingClientRect(),S=g.current.getBoundingClientRect(),H=vo(f,S,t,i),U=document.body.getBoundingClientRect();p({top:H.top+window.scrollY-U.top,left:H.left+window.scrollX-U.left}),h(H.placement)}return P(),window.addEventListener("scroll",P,!0),window.addEventListener("resize",P),()=>{window.removeEventListener("scroll",P,!0),window.removeEventListener("resize",P)}},[a,t,i]),Mt(()=>{if(a)return document.addEventListener("keydown",I),()=>document.removeEventListener("keydown",I)},[a,I]),Mt(()=>N,[N]),!po(u))return u;let C=co(u,{ref:wo(R,u),"data-state":a?"open":"closed",onMouseEnter:P=>{x();let f=u.props.onMouseEnter;f?.(P)},onMouseLeave:P=>{D();let f=u.props.onMouseLeave;f?.(P)},onFocus:P=>{x();let f=u.props.onFocus;f?.(P)},onBlur:P=>{D();let f=u.props.onBlur;f?.(P)},"aria-describedby":a?w:void 0});return Nt(yo,{children:[C,a&&go(Nt("div",{ref:g,id:w,role:"tooltip","data-state":a?"open":"closed","data-placement":m,"data-density":n,className:uo("ui-tooltip absolute z-[9999] rounded-lg leading-relaxed",xo[n],"animate-[tooltip-in_0.15s_var(--ease-standard)]",c),style:l?{top:l.top,left:l.left}:{position:"fixed",visibility:"hidden"},onMouseEnter:x,onMouseLeave:D,children:[e,i&&Ie("span",{className:"ui-tooltip__arrow absolute",style:ho[m],children:s?s({placement:m}):Ie("svg",{width:ae*2,height:ae,viewBox:"0 0 12 6",children:Ie("path",{d:"M0 0l6 6 6-6z",fill:"currentColor"})})})]}),document.body)]})}export{He as Avatar,Be as Badge,ee as Button,pn as ConfirmProvider,z as Dialog,Ye as Drawer,In as DropdownMenu,Je as EmptyState,je as Field,et as IconButton,ot as Input,rt as Panel,Vn as PanelBody,$n as PanelFooter,Fn as PanelHeader,at as SegmentedControl,pt as Select,ft as Skeleton,ue as Spinner,mt as StatusNotice,ht as Switch,lo as ToastProvider,Et as Tooltip,_e as buttonClassName,cn as useConfirm,ro as useToast};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
export interface StorybookCatalogPath {
|
|
2
|
+
group: string;
|
|
3
|
+
componentId: string;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
export interface StorybookCatalogItem extends StorybookCatalogPath {
|
|
7
|
+
componentName: string;
|
|
8
|
+
description: string | null;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
export interface StorybookCatalogGroup {
|
|
12
|
+
id: string;
|
|
13
|
+
label: string;
|
|
14
|
+
items: StorybookCatalogItem[];
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
declare const catalog: {
|
|
18
|
+
groups: StorybookCatalogGroup[];
|
|
19
|
+
paths: StorybookCatalogPath[];
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
export default catalog;
|