@zovaris/sephiro 0.4.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 +36 -0
- package/dist/index.css +2343 -0
- package/dist/index.d.ts +318 -0
- package/dist/index.js +1351 -0
- package/dist/index.js.map +1 -0
- package/package.json +60 -0
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,318 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { HTMLAttributes, ButtonHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, TableHTMLAttributes } from 'react';
|
|
3
|
+
import { ExternalToast, ToasterProps } from 'sonner';
|
|
4
|
+
export { toast } from 'sonner';
|
|
5
|
+
|
|
6
|
+
type RenderableElement = {
|
|
7
|
+
type: any;
|
|
8
|
+
props: any;
|
|
9
|
+
key?: any;
|
|
10
|
+
};
|
|
11
|
+
type Renderable = string | number | boolean | null | undefined | Iterable<Renderable> | RenderableElement;
|
|
12
|
+
|
|
13
|
+
type ControlSize = "sm" | "md" | "lg";
|
|
14
|
+
|
|
15
|
+
type BadgeProps = Omit<HTMLAttributes<HTMLSpanElement>, "children"> & {
|
|
16
|
+
variant?: "neutral" | "accent" | "success" | "warning" | "danger";
|
|
17
|
+
size?: ControlSize;
|
|
18
|
+
children?: Renderable;
|
|
19
|
+
};
|
|
20
|
+
declare function Badge({ variant, size, className, children, ...props }: BadgeProps): react.JSX.Element;
|
|
21
|
+
|
|
22
|
+
type ButtonProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children"> & {
|
|
23
|
+
variant?: "primary" | "secondary" | "quiet";
|
|
24
|
+
size?: ControlSize;
|
|
25
|
+
loading?: boolean;
|
|
26
|
+
children?: Renderable;
|
|
27
|
+
};
|
|
28
|
+
declare function Button({ variant, size, loading, disabled, className, type, children, "aria-busy": ariaBusy, ...props }: ButtonProps): react.JSX.Element;
|
|
29
|
+
|
|
30
|
+
type CheckboxProps = Omit<InputHTMLAttributes<HTMLInputElement>, "size"> & {
|
|
31
|
+
label?: Renderable;
|
|
32
|
+
size?: ControlSize;
|
|
33
|
+
invalid?: boolean;
|
|
34
|
+
};
|
|
35
|
+
declare function Checkbox({ label, size, invalid, className, ...props }: CheckboxProps): react.JSX.Element;
|
|
36
|
+
|
|
37
|
+
type IconButtonProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children"> & {
|
|
38
|
+
icon: Renderable;
|
|
39
|
+
label: string;
|
|
40
|
+
size?: ControlSize;
|
|
41
|
+
variant?: "ghost" | "solid" | "outline";
|
|
42
|
+
loading?: boolean;
|
|
43
|
+
};
|
|
44
|
+
declare function IconButton({ icon, label, size, variant, loading, disabled, className, type, ...props }: IconButtonProps): react.JSX.Element;
|
|
45
|
+
|
|
46
|
+
type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "size"> & {
|
|
47
|
+
invalid?: boolean;
|
|
48
|
+
size?: ControlSize;
|
|
49
|
+
};
|
|
50
|
+
declare function Input({ invalid, size, className, "aria-invalid": ariaInvalid, ...props }: InputProps): react.JSX.Element;
|
|
51
|
+
|
|
52
|
+
type SeparatorProps = Omit<HTMLAttributes<HTMLHRElement>, "children"> & {
|
|
53
|
+
orientation?: "horizontal" | "vertical";
|
|
54
|
+
decorative?: boolean;
|
|
55
|
+
};
|
|
56
|
+
declare function Separator({ orientation, decorative, className, ...props }: SeparatorProps): react.JSX.Element;
|
|
57
|
+
|
|
58
|
+
type SkeletonProps = HTMLAttributes<HTMLSpanElement> & {
|
|
59
|
+
width?: string | number;
|
|
60
|
+
height?: string | number;
|
|
61
|
+
};
|
|
62
|
+
declare function Skeleton({ width, height, className, style, "aria-label": ariaLabel, ...props }: SkeletonProps): react.JSX.Element;
|
|
63
|
+
|
|
64
|
+
type SliderProps = Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type" | "value" | "defaultValue" | "onChange" | "children" | "min" | "max" | "step"> & {
|
|
65
|
+
value: number;
|
|
66
|
+
onValueChange: (value: number) => void;
|
|
67
|
+
label: Renderable;
|
|
68
|
+
min?: number;
|
|
69
|
+
max?: number;
|
|
70
|
+
step?: number;
|
|
71
|
+
size?: ControlSize;
|
|
72
|
+
valueLabel?: Renderable;
|
|
73
|
+
invalid?: boolean;
|
|
74
|
+
};
|
|
75
|
+
declare function Slider({ value, onValueChange, label, min, max, step, size, valueLabel, invalid, className, disabled, style, id, "aria-label": ariaLabel, "aria-valuetext": ariaValueText, "aria-invalid": ariaInvalid, ...props }: SliderProps): react.JSX.Element;
|
|
76
|
+
|
|
77
|
+
type SpinnerProps = HTMLAttributes<HTMLSpanElement> & {
|
|
78
|
+
size?: ControlSize;
|
|
79
|
+
label?: string;
|
|
80
|
+
};
|
|
81
|
+
declare function Spinner({ size, label, className, ...props }: SpinnerProps): react.JSX.Element;
|
|
82
|
+
|
|
83
|
+
type SurfaceProps = Omit<HTMLAttributes<HTMLDivElement>, "children"> & {
|
|
84
|
+
children?: Renderable;
|
|
85
|
+
tone?: "base" | "elevated" | "raised";
|
|
86
|
+
padding?: "none" | "sm" | "md" | "lg";
|
|
87
|
+
};
|
|
88
|
+
declare function Surface({ tone, padding, className, children, ...props }: SurfaceProps): react.JSX.Element;
|
|
89
|
+
|
|
90
|
+
type TextareaProps = TextareaHTMLAttributes<HTMLTextAreaElement> & {
|
|
91
|
+
invalid?: boolean;
|
|
92
|
+
size?: ControlSize;
|
|
93
|
+
};
|
|
94
|
+
declare function Textarea({ invalid, size, className, "aria-invalid": ariaInvalid, ...props }: TextareaProps): react.JSX.Element;
|
|
95
|
+
|
|
96
|
+
type ToggleProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, "onChange" | "onClick"> & {
|
|
97
|
+
checked: boolean;
|
|
98
|
+
onCheckedChange: (checked: boolean) => void;
|
|
99
|
+
label: string;
|
|
100
|
+
size?: ControlSize;
|
|
101
|
+
onClick?: (event: {
|
|
102
|
+
preventDefault(): void;
|
|
103
|
+
}) => void;
|
|
104
|
+
};
|
|
105
|
+
declare function Toggle({ checked, onCheckedChange, label, className, disabled, onClick, size, "aria-checked": ariaChecked, "aria-label": ariaLabel, ...props }: ToggleProps): react.JSX.Element;
|
|
106
|
+
|
|
107
|
+
type AlertProps = Omit<HTMLAttributes<HTMLDivElement>, "children" | "title"> & {
|
|
108
|
+
variant?: "info" | "success" | "warning" | "danger";
|
|
109
|
+
title?: Renderable;
|
|
110
|
+
children?: Renderable;
|
|
111
|
+
dismissible?: boolean;
|
|
112
|
+
onDismiss?: () => void;
|
|
113
|
+
};
|
|
114
|
+
declare function Alert({ variant, title, children, dismissible, onDismiss, className, role, ...props }: AlertProps): react.JSX.Element | null;
|
|
115
|
+
declare const Notice: typeof Alert;
|
|
116
|
+
type NoticeProps = AlertProps;
|
|
117
|
+
|
|
118
|
+
type CardProps = Omit<HTMLAttributes<HTMLElement>, "children" | "title"> & {
|
|
119
|
+
title?: Renderable;
|
|
120
|
+
description?: Renderable;
|
|
121
|
+
header?: Renderable;
|
|
122
|
+
footer?: Renderable;
|
|
123
|
+
children?: Renderable;
|
|
124
|
+
interactive?: boolean;
|
|
125
|
+
selected?: boolean;
|
|
126
|
+
};
|
|
127
|
+
declare function Card({ title, description, header, footer, children, interactive, selected, className, ...props }: CardProps): react.JSX.Element;
|
|
128
|
+
|
|
129
|
+
type DialogProps = {
|
|
130
|
+
open: boolean;
|
|
131
|
+
onClose: () => void;
|
|
132
|
+
title: Renderable;
|
|
133
|
+
description?: Renderable;
|
|
134
|
+
children?: Renderable;
|
|
135
|
+
footer?: Renderable;
|
|
136
|
+
closeLabel?: string;
|
|
137
|
+
closeOnOverlayClick?: boolean;
|
|
138
|
+
className?: string;
|
|
139
|
+
};
|
|
140
|
+
declare function Dialog({ open, onClose, title, description, children, footer, closeLabel, closeOnOverlayClick, className, }: DialogProps): react.JSX.Element | null;
|
|
141
|
+
|
|
142
|
+
type FieldMessageProps = Omit<HTMLAttributes<HTMLParagraphElement>, "children"> & {
|
|
143
|
+
variant?: "hint" | "error" | "success";
|
|
144
|
+
children?: Renderable;
|
|
145
|
+
};
|
|
146
|
+
declare function FieldMessage({ variant, className, children, ...props }: FieldMessageProps): react.JSX.Element | null;
|
|
147
|
+
|
|
148
|
+
type FieldProps = {
|
|
149
|
+
label?: Renderable;
|
|
150
|
+
htmlFor?: string;
|
|
151
|
+
description?: Renderable;
|
|
152
|
+
message?: Renderable;
|
|
153
|
+
messageType?: FieldMessageProps["variant"];
|
|
154
|
+
required?: boolean;
|
|
155
|
+
className?: string;
|
|
156
|
+
children?: Renderable;
|
|
157
|
+
};
|
|
158
|
+
declare function Field({ label, htmlFor, description, message, messageType, required, className, children, }: FieldProps): react.JSX.Element;
|
|
159
|
+
|
|
160
|
+
type MenuItem = {
|
|
161
|
+
value?: string;
|
|
162
|
+
label?: Renderable;
|
|
163
|
+
icon?: Renderable;
|
|
164
|
+
shortcut?: Renderable;
|
|
165
|
+
disabled?: boolean;
|
|
166
|
+
danger?: boolean;
|
|
167
|
+
separator?: boolean;
|
|
168
|
+
};
|
|
169
|
+
type MenuProps = {
|
|
170
|
+
trigger: Renderable;
|
|
171
|
+
items: MenuItem[];
|
|
172
|
+
onSelect?: (value: string) => void;
|
|
173
|
+
label?: string;
|
|
174
|
+
align?: "start" | "end";
|
|
175
|
+
disabled?: boolean;
|
|
176
|
+
className?: string;
|
|
177
|
+
};
|
|
178
|
+
declare function Menu({ trigger, items, onSelect, label, align, disabled, className, }: MenuProps): react.JSX.Element;
|
|
179
|
+
|
|
180
|
+
type PopoverProps = {
|
|
181
|
+
trigger: Renderable;
|
|
182
|
+
children: Renderable;
|
|
183
|
+
open?: boolean;
|
|
184
|
+
defaultOpen?: boolean;
|
|
185
|
+
onOpenChange?: (open: boolean) => void;
|
|
186
|
+
ariaLabel?: string;
|
|
187
|
+
placement?: "start" | "end";
|
|
188
|
+
disabled?: boolean;
|
|
189
|
+
className?: string;
|
|
190
|
+
};
|
|
191
|
+
declare function Popover({ trigger, children, open, defaultOpen, onOpenChange, ariaLabel, placement, disabled, className, }: PopoverProps): react.JSX.Element;
|
|
192
|
+
|
|
193
|
+
type RadioOption = {
|
|
194
|
+
value: string;
|
|
195
|
+
label: Renderable;
|
|
196
|
+
description?: Renderable;
|
|
197
|
+
disabled?: boolean;
|
|
198
|
+
};
|
|
199
|
+
type RadioGroupProps = {
|
|
200
|
+
value: string;
|
|
201
|
+
options: RadioOption[];
|
|
202
|
+
onValueChange: (value: string) => void;
|
|
203
|
+
name: string;
|
|
204
|
+
label?: Renderable;
|
|
205
|
+
description?: Renderable;
|
|
206
|
+
size?: ControlSize;
|
|
207
|
+
orientation?: "horizontal" | "vertical";
|
|
208
|
+
disabled?: boolean;
|
|
209
|
+
className?: string;
|
|
210
|
+
};
|
|
211
|
+
declare function RadioGroup({ value, options, onValueChange, name, label, description, size, orientation, disabled, className, }: RadioGroupProps): react.JSX.Element;
|
|
212
|
+
|
|
213
|
+
type SelectOption = {
|
|
214
|
+
value: string;
|
|
215
|
+
label: Renderable;
|
|
216
|
+
disabled?: boolean;
|
|
217
|
+
};
|
|
218
|
+
type SelectProps = {
|
|
219
|
+
value: string;
|
|
220
|
+
options: SelectOption[];
|
|
221
|
+
onValueChange: (value: string) => void;
|
|
222
|
+
id?: string;
|
|
223
|
+
className?: string;
|
|
224
|
+
placeholder?: Renderable;
|
|
225
|
+
ariaLabel?: string;
|
|
226
|
+
ariaLabelledBy?: string;
|
|
227
|
+
disabled?: boolean;
|
|
228
|
+
size?: ControlSize;
|
|
229
|
+
};
|
|
230
|
+
declare function Select({ value, options, onValueChange, id, className, placeholder, ariaLabel, ariaLabelledBy, disabled, size, }: SelectProps): react.JSX.Element;
|
|
231
|
+
|
|
232
|
+
type TabItem = {
|
|
233
|
+
value: string;
|
|
234
|
+
label: Renderable;
|
|
235
|
+
disabled?: boolean;
|
|
236
|
+
content?: Renderable;
|
|
237
|
+
};
|
|
238
|
+
type TabsProps = {
|
|
239
|
+
items: TabItem[];
|
|
240
|
+
value?: string;
|
|
241
|
+
defaultValue?: string;
|
|
242
|
+
onValueChange?: (value: string) => void;
|
|
243
|
+
children?: Renderable;
|
|
244
|
+
ariaLabel?: string;
|
|
245
|
+
orientation?: "horizontal" | "vertical";
|
|
246
|
+
className?: string;
|
|
247
|
+
};
|
|
248
|
+
declare function Tabs({ items, value, defaultValue, onValueChange, children, ariaLabel, orientation, className, }: TabsProps): react.JSX.Element;
|
|
249
|
+
|
|
250
|
+
type ToastProps = {
|
|
251
|
+
open?: boolean;
|
|
252
|
+
id?: string | number;
|
|
253
|
+
title: Renderable;
|
|
254
|
+
description?: Renderable;
|
|
255
|
+
variant?: "neutral" | "success" | "warning" | "danger";
|
|
256
|
+
action?: ExternalToast["action"];
|
|
257
|
+
duration?: number;
|
|
258
|
+
closeButton?: boolean;
|
|
259
|
+
className?: string;
|
|
260
|
+
};
|
|
261
|
+
declare function Toast({ open, id, title, description, variant, action, duration, closeButton, className, }: ToastProps): null;
|
|
262
|
+
type ToastViewportProps = Omit<ToasterProps, "className" | "containerAriaLabel" | "icons" | "toastOptions"> & {
|
|
263
|
+
label?: string;
|
|
264
|
+
className?: string;
|
|
265
|
+
toastOptions?: ToasterProps["toastOptions"];
|
|
266
|
+
};
|
|
267
|
+
declare function ToastViewport({ label, className, toastOptions, theme, position, closeButton, expand, ...props }: ToastViewportProps): react.JSX.Element;
|
|
268
|
+
|
|
269
|
+
type ToolbarProps = Omit<HTMLAttributes<HTMLDivElement>, "children"> & {
|
|
270
|
+
label?: string;
|
|
271
|
+
orientation?: "horizontal" | "vertical";
|
|
272
|
+
size?: ControlSize;
|
|
273
|
+
start?: Renderable;
|
|
274
|
+
end?: Renderable;
|
|
275
|
+
children?: Renderable;
|
|
276
|
+
};
|
|
277
|
+
declare function Toolbar({ label, orientation, size, start, end, children, className, ...props }: ToolbarProps): react.JSX.Element;
|
|
278
|
+
|
|
279
|
+
type TooltipProps = {
|
|
280
|
+
content: Renderable;
|
|
281
|
+
children: Renderable;
|
|
282
|
+
side?: "top" | "right" | "bottom" | "left";
|
|
283
|
+
delay?: number;
|
|
284
|
+
disabled?: boolean;
|
|
285
|
+
className?: string;
|
|
286
|
+
};
|
|
287
|
+
declare function Tooltip({ content, children, side, delay, disabled, className, }: TooltipProps): react.JSX.Element;
|
|
288
|
+
|
|
289
|
+
type EmptyStateProps = Omit<HTMLAttributes<HTMLElement>, "children" | "title"> & {
|
|
290
|
+
title: Renderable;
|
|
291
|
+
description?: Renderable;
|
|
292
|
+
icon?: Renderable;
|
|
293
|
+
action?: Renderable;
|
|
294
|
+
compact?: boolean;
|
|
295
|
+
};
|
|
296
|
+
declare function EmptyState({ title, description, icon, action, compact, className, ...props }: EmptyStateProps): react.JSX.Element;
|
|
297
|
+
|
|
298
|
+
type TableColumn<Row extends Record<string, unknown> = Record<string, unknown>> = {
|
|
299
|
+
key: string;
|
|
300
|
+
label: Renderable;
|
|
301
|
+
align?: "start" | "center" | "end";
|
|
302
|
+
width?: string;
|
|
303
|
+
render?: (row: Row, index: number) => Renderable;
|
|
304
|
+
};
|
|
305
|
+
type TableProps<Row extends Record<string, unknown> = Record<string, unknown>> = Omit<TableHTMLAttributes<HTMLTableElement>, "children" | "rows" | "className" | "cellPadding" | "cellSpacing"> & {
|
|
306
|
+
columns: TableColumn<Row>[];
|
|
307
|
+
rows: Row[];
|
|
308
|
+
caption?: Renderable;
|
|
309
|
+
emptyMessage?: Renderable;
|
|
310
|
+
rowKey?: keyof Row & string;
|
|
311
|
+
density?: "compact" | "comfortable";
|
|
312
|
+
striped?: boolean;
|
|
313
|
+
stickyHeader?: boolean;
|
|
314
|
+
className?: string;
|
|
315
|
+
};
|
|
316
|
+
declare function Table<Row extends Record<string, unknown> = Record<string, unknown>>({ columns, rows, caption, emptyMessage, rowKey, density, striped, stickyHeader, className, ...props }: TableProps<Row>): react.JSX.Element;
|
|
317
|
+
|
|
318
|
+
export { Alert, type AlertProps, Badge, type BadgeProps, Button, type ButtonProps, Card, type CardProps, Checkbox, type CheckboxProps, type ControlSize, Dialog, type DialogProps, EmptyState, type EmptyStateProps, Field, FieldMessage, type FieldMessageProps, type FieldProps, IconButton, type IconButtonProps, Input, type InputProps, Menu, type MenuItem, type MenuProps, Notice, type NoticeProps, Popover, type PopoverProps, RadioGroup, type RadioGroupProps, type RadioOption, type Renderable, type RenderableElement, Select, type SelectOption, type SelectProps, Separator, type SeparatorProps, Skeleton, type SkeletonProps, Slider, type SliderProps, Spinner, type SpinnerProps, Surface, type SurfaceProps, type TabItem, Table, type TableColumn, type TableProps, Tabs, type TabsProps, Textarea, type TextareaProps, Toast, type ToastProps, ToastViewport, type ToastViewportProps, Toggle, type ToggleProps, Toolbar, type ToolbarProps, Tooltip, type TooltipProps };
|