@umami/react-zen 0.24.0 → 0.26.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 CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  **zen** is a modern, minimalist React component library.
4
4
 
5
- - Built on top of [React Aria](https://react-spectrum.adobe.com/react-aria/) and [Radix](https://www.radix-ui.com/primitives) primitives.
5
+ - Built on top of [React Aria](https://react-spectrum.adobe.com/react-aria/) primitives.
6
6
  - No Tailwind, pure CSS.
7
7
  - Out-of-the-box accessibility.
8
8
 
package/dist/index.css CHANGED
@@ -2388,6 +2388,117 @@ body a.Button_button__YmM3M {
2388
2388
  }
2389
2389
  }
2390
2390
 
2391
+ /* virtual-css:css:d2946ea0055c0d1ebfac02670168114b */
2392
+ .Toast_toast__YjU0N {
2393
+ display: grid;
2394
+ grid-template-areas: "icon title action" "icon description action";
2395
+ grid-template-columns: auto 1fr auto;
2396
+ grid-auto-columns: auto;
2397
+ align-items: center;
2398
+ background-color: var(--background-color);
2399
+ border-radius: var(--border-radius);
2400
+ box-shadow: var(--box-shadow-3);
2401
+ padding: var(--spacing-4) var(--spacing-5);
2402
+ border: var(--border);
2403
+ position: relative;
2404
+ }
2405
+ .Toast_toast__YjU0N:has(.Toast_icon__YmFhZ) {
2406
+ grid-template-columns: auto 1fr auto;
2407
+ column-gap: var(--gap);
2408
+ }
2409
+ .Toast_icon__YmFhZ {
2410
+ grid-area: icon;
2411
+ }
2412
+ .Toast_icon__YmFhZ:empty {
2413
+ display: none;
2414
+ }
2415
+ .Toast_title__OGRhM {
2416
+ grid-area: title;
2417
+ color: var(--font-color);
2418
+ font-weight: 700;
2419
+ }
2420
+ .Toast_description__MDBkN {
2421
+ grid-area: description;
2422
+ }
2423
+ .Toast_action__MjUxO {
2424
+ grid-area: action;
2425
+ border: 0;
2426
+ background: transparent;
2427
+ }
2428
+ .Toast_close__ZDVjN {
2429
+ display: none;
2430
+ color: currentColor;
2431
+ position: absolute;
2432
+ right: var(--spacing-3);
2433
+ top: 50%;
2434
+ transform: translateY(-50%);
2435
+ }
2436
+ .Toast_toast__YjU0N:hover .Toast_close__ZDVjN {
2437
+ display: block;
2438
+ cursor: pointer;
2439
+ }
2440
+ .Toast_toast__YjU0N.Toast_info__ZDRhY {
2441
+ color: var(--primary-font-color);
2442
+ background: var(--primary-color);
2443
+ border: 0;
2444
+ }
2445
+ .Toast_toast__YjU0N.Toast_error__NmEwO {
2446
+ color: var(--danger-font-color);
2447
+ background: var(--danger-color);
2448
+ border: 0;
2449
+ }
2450
+
2451
+ /* virtual-css:css:11394aec644bbe21859c5e1cb74970ec */
2452
+ .Toaster_toaster__OGJjM {
2453
+ position: fixed;
2454
+ display: flex;
2455
+ flex-direction: column;
2456
+ padding: var(--spacing-6);
2457
+ gap: var(--spacing-5);
2458
+ width: 460px;
2459
+ max-width: 100vw;
2460
+ margin: 0;
2461
+ list-style: none;
2462
+ z-index: 2147483647;
2463
+ outline: none;
2464
+ }
2465
+ .Toaster_position-top__Y2YyM {
2466
+ top: 0;
2467
+ left: 50%;
2468
+ transform: translateX(-50%);
2469
+ }
2470
+ .Toaster_position-top-right__Y2I1Y {
2471
+ top: 0;
2472
+ right: 0;
2473
+ }
2474
+ .Toaster_position-top-left__ZGZlM {
2475
+ top: 0;
2476
+ left: 0;
2477
+ }
2478
+ .Toaster_position-bottom__NjJmM {
2479
+ bottom: 0;
2480
+ left: 50%;
2481
+ transform: translateX(-50%);
2482
+ }
2483
+ .Toaster_position-bottom-right__MGVjY {
2484
+ bottom: 0;
2485
+ right: 0;
2486
+ }
2487
+ .Toaster_position-bottom-left__ODBhZ {
2488
+ bottom: 0;
2489
+ left: 0;
2490
+ }
2491
+ .Toaster_position-left__MWMzM {
2492
+ left: 0;
2493
+ top: 50%;
2494
+ transform: translateY(-50%);
2495
+ }
2496
+ .Toaster_position-right__YWYzZ {
2497
+ right: 0;
2498
+ top: 50%;
2499
+ transform: translateY(-50%);
2500
+ }
2501
+
2391
2502
  /* virtual-css:css:fa53717340120f23a623f1ff98237d94 */
2392
2503
  .Accordion_accordion__ODg3O {
2393
2504
  display: flex;
@@ -2609,6 +2720,54 @@ body a.Button_button__YmM3M {
2609
2720
  padding: var(--spacing-1);
2610
2721
  }
2611
2722
 
2723
+ /* virtual-css:css:0fb02723d81c5960ed149d3d9f58f1ba */
2724
+ .List_list__NmQyZ {
2725
+ min-width: 100px;
2726
+ outline: none;
2727
+ }
2728
+ .List_separator__NTYwN {
2729
+ border-bottom: var(--border);
2730
+ }
2731
+ .List_section__MzJkM {
2732
+ margin-bottom: var(--spacing-4);
2733
+ }
2734
+ .List_header__MjllY {
2735
+ font-size: var(--font-size-2);
2736
+ font-weight: var(--font-weight-bold);
2737
+ padding: var(--padding);
2738
+ }
2739
+ .List_item__MWE2M {
2740
+ display: flex;
2741
+ align-items: center;
2742
+ justify-content: space-between;
2743
+ font-size: var(--font-size);
2744
+ color: var(--font-color);
2745
+ background: var(--background-color);
2746
+ padding: var(--padding);
2747
+ gap: var(--gap);
2748
+ min-width: 120px;
2749
+ cursor: pointer;
2750
+ outline: none;
2751
+ border-radius: var(--border-radius);
2752
+ }
2753
+ .List_item__MWE2M[data-focus],
2754
+ .List_item__MWE2M[data-focus-visible] {
2755
+ outline: var(--outline);
2756
+ background: var(--highlight-color);
2757
+ }
2758
+ .List_item__MWE2M:hover {
2759
+ background: var(--highlight-color);
2760
+ }
2761
+ .List_item__MWE2M[data-selected] {
2762
+ font-weight: bold;
2763
+ }
2764
+ .List_item__MWE2M[data-selected] .List_check__NTFkY {
2765
+ display: block;
2766
+ }
2767
+ .List_check__NTFkY {
2768
+ display: none;
2769
+ }
2770
+
2612
2771
  /* virtual-css:css:22e6c8058c0151ab54d204a5cd8c6d11 */
2613
2772
  .ListItem_item__MzQ0Z {
2614
2773
  display: flex;
@@ -2640,19 +2799,6 @@ body a.Button_button__YmM3M {
2640
2799
  display: none;
2641
2800
  }
2642
2801
 
2643
- /* virtual-css:css:0fb02723d81c5960ed149d3d9f58f1ba */
2644
- .List_list__MjlhZ {
2645
- overflow: hidden;
2646
- min-width: 100px;
2647
- outline: none;
2648
- }
2649
- .List_item__MmJiZ {
2650
- border: var(--border-radius);
2651
- }
2652
- .List_separator__OTRkO {
2653
- border-bottom: var(--border);
2654
- }
2655
-
2656
2802
  /* virtual-css:css:f94974973c639ccc39a8a6465cbebeb2 */
2657
2803
  .Popover_popover__YmFhM[data-placement=top] {
2658
2804
  --origin: translateY(8px);
@@ -3450,23 +3596,23 @@ body a.Button_button__YmM3M {
3450
3596
  }
3451
3597
 
3452
3598
  /* virtual-css:css:10b212fa8a7332a22ad571a388244d38 */
3453
- .Tabs_tabs__MzI2N {
3599
+ .Tabs_tabs__NTRlO {
3454
3600
  font-size: var(--font-size);
3455
3601
  color: var(--font-color);
3456
3602
  position: relative;
3457
3603
  width: 100%;
3458
3604
  }
3459
- .Tabs_list__N2ZhO {
3605
+ .Tabs_list__Yjc4M {
3460
3606
  display: flex;
3461
3607
  align-items: center;
3462
3608
  border-bottom: 2px solid var(--border-color);
3463
- gap: var(--gap);
3609
+ gap: var(--spacing-6);
3464
3610
  margin-bottom: var(--spacing-6);
3465
3611
  }
3466
- .Tabs_list__N2ZhO.Tabs_quiet__OWFhN {
3612
+ .Tabs_list__Yjc4M.Tabs_quiet__ZTViO {
3467
3613
  border: 0;
3468
3614
  }
3469
- .Tabs_tab__M2M2Y {
3615
+ .Tabs_tab__OTEyN {
3470
3616
  display: flex;
3471
3617
  align-items: center;
3472
3618
  justify-content: center;
@@ -3477,14 +3623,14 @@ body a.Button_button__YmM3M {
3477
3623
  margin: 0 0 -2px 0;
3478
3624
  cursor: pointer;
3479
3625
  }
3480
- .Tabs_tab__M2M2Y:hover {
3626
+ .Tabs_tab__OTEyN:hover {
3481
3627
  color: var(--font-color);
3482
3628
  }
3483
- .Tabs_tab__M2M2Y[data-selected] {
3629
+ .Tabs_tab__OTEyN[data-selected] {
3484
3630
  color: var(--font-color);
3485
3631
  border-bottom: 2px solid var(--primary-color);
3486
3632
  }
3487
- .Tabs_tab__M2M2Y[data-disabled] {
3633
+ .Tabs_tab__OTEyN[data-disabled] {
3488
3634
  color: var(--font-faded-color);
3489
3635
  cursor: default;
3490
3636
  }
@@ -3515,125 +3661,6 @@ body a.Button_button__YmM3M {
3515
3661
  resize: vertical;
3516
3662
  }
3517
3663
 
3518
- /* virtual-css:css:2660738c02b9f8e6e348a808b81b16d8 */
3519
- .Toast_viewport__NzVhM {
3520
- --viewport-padding: 25px;
3521
- position: fixed;
3522
- bottom: 0;
3523
- right: 0;
3524
- display: flex;
3525
- flex-direction: column;
3526
- padding: var(--viewport-padding);
3527
- gap: 10px;
3528
- width: 460px;
3529
- max-width: 100vw;
3530
- margin: 0;
3531
- list-style: none;
3532
- z-index: 2147483647;
3533
- outline: none;
3534
- }
3535
- .Toast_toast__YWM3Z {
3536
- display: grid;
3537
- grid-template-areas: "icon title action" "icon description action";
3538
- grid-template-columns: auto 1fr auto;
3539
- grid-auto-columns: auto;
3540
- align-items: center;
3541
- background-color: var(--background-color);
3542
- border-radius: var(--border-radius);
3543
- box-shadow: var(--box-shadow-3);
3544
- padding: 1.25rem 1.5rem;
3545
- border: var(--border);
3546
- position: relative;
3547
- }
3548
- .Toast_toast__YWM3Z[data-state=open] {
3549
- animation: Toast_slide-in__ZDZhN 150ms cubic-bezier(0.16, 1, 0.3, 1);
3550
- }
3551
- .Toast_toast__YWM3Z[data-state=closed] {
3552
- animation: Toast_hide__NjM0N 100ms ease-in;
3553
- }
3554
- .Toast_toast__YWM3Z[data-swipe=move] {
3555
- transform: translateX(0);
3556
- }
3557
- .Toast_toast__YWM3Z[data-swipe=cancel] {
3558
- transform: translateX(0);
3559
- transition: transform 200ms ease-out;
3560
- }
3561
- .Toast_toast__YWM3Z[data-swipe=end] {
3562
- animation: Toast_swipe-out__NzI3N 100ms ease-out;
3563
- }
3564
- .Toast_toast__YWM3Z:has(.Toast_icon__MmY1Y) {
3565
- grid-template-columns: auto 1fr auto;
3566
- column-gap: var(--gap);
3567
- }
3568
- .Toast_icon__MmY1Y {
3569
- grid-area: icon;
3570
- }
3571
- .Toast_icon__MmY1Y:empty {
3572
- display: none;
3573
- }
3574
- .Toast_title__OTU5Z {
3575
- grid-area: title;
3576
- color: var(--font-color);
3577
- font-weight: 700;
3578
- }
3579
- .Toast_description__OWJkZ {
3580
- grid-area: description;
3581
- }
3582
- .Toast_action__NjZiZ {
3583
- grid-area: action;
3584
- border: 0;
3585
- background: transparent;
3586
- }
3587
- .Toast_close__MjU1N {
3588
- color: currentColor;
3589
- position: absolute;
3590
- right: 10px;
3591
- top: 10px;
3592
- display: none;
3593
- border: 0;
3594
- background: transparent;
3595
- }
3596
- .Toast_toast__YWM3Z:hover .Toast_close__MjU1N {
3597
- display: block;
3598
- cursor: pointer;
3599
- }
3600
- .Toast_toast__YWM3Z.Toast_info__MTZkO {
3601
- color: var(--primary-font-color);
3602
- background: var(--primary-color);
3603
- border: 0;
3604
- }
3605
- .Toast_toast__YWM3Z.Toast_error__NTA3M {
3606
- color: var(--danger-font-color);
3607
- background: var(--danger-color);
3608
- border: 0;
3609
- }
3610
- @keyframes Toast_hide__NjM0N {
3611
- from {
3612
- opacity: 1;
3613
- transform: translateY(0);
3614
- }
3615
- to {
3616
- opacity: 0;
3617
- transform: translateY(50px);
3618
- }
3619
- }
3620
- @keyframes Toast_slide-in__ZDZhN {
3621
- from {
3622
- transform: translateX(calc(100% + var(--viewport-padding)));
3623
- }
3624
- to {
3625
- transform: translateX(0);
3626
- }
3627
- }
3628
- @keyframes Toast_swipe-out__NzI3N {
3629
- from {
3630
- transform: translateX(0);
3631
- }
3632
- to {
3633
- transform: translateX(calc(100% + var(--viewport-padding)));
3634
- }
3635
- }
3636
-
3637
3664
  /* virtual-css:css:9e5c8c52b82d4f77f80ba529f88ddc39 */
3638
3665
  .Toggle_toggle__OWVjZ {
3639
3666
  font-size: var(--font-size);
package/dist/index.d.ts CHANGED
@@ -1,21 +1,20 @@
1
1
  // Generated by dts-bundle v0.7.3
2
2
  // Dependencies for this module:
3
3
  // ../../react-aria-components
4
- // ../../@/components/forms/Form
5
- // ../../@/components/forms/FormField
6
- // ../../@/components/forms/FormResetButton
7
- // ../../@/components/forms/FormSubmitButton
8
4
  // ../../react
5
+ // ../../react-hook-form
9
6
  // ../../@/lib/types
10
- // ../../@radix-ui/react-slot
11
- // ../../@radix-ui/react-toast
7
+ // ../../@/components/toast/Toaster
12
8
 
13
9
  declare module '@umami/react-zen' {
14
10
  import { DialogTrigger, FileTrigger, MenuTrigger, SubmenuTrigger, TooltipTrigger } from 'react-aria-components';
15
- import { Form } from '@/components/forms/Form';
16
- import { FormField } from '@/components/forms/FormField';
17
- import { FormResetButton } from '@/components/forms/FormResetButton';
18
- import { FormSubmitButton } from '@/components/forms/FormSubmitButton';
11
+ import { Form } from '@umami/react-zen/forms/Form';
12
+ import { FormField } from '@umami/react-zen/forms/FormField';
13
+ import { FormResetButton } from '@umami/react-zen/forms/FormResetButton';
14
+ import { FormSubmitButton } from '@umami/react-zen/forms/FormSubmitButton';
15
+ import { Toast } from '@umami/react-zen/toast/Toast';
16
+ import { Toaster } from '@umami/react-zen/toast/Toaster';
17
+ import { ToastProvider } from '@umami/react-zen/toast/ToastProvider';
19
18
  import { useDebounce } from '@umami/react-zen/hooks/useDebounce';
20
19
  import { useTheme } from '@umami/react-zen/hooks/useTheme';
21
20
  import { useToast } from '@umami/react-zen/hooks/useToast';
@@ -44,8 +43,7 @@ declare module '@umami/react-zen' {
44
43
  import { Icons } from '@umami/react-zen/Icons';
45
44
  import { InlineEditField } from '@umami/react-zen/InlineEditField';
46
45
  import { Label } from '@umami/react-zen/Label';
47
- import { List } from '@umami/react-zen/List';
48
- import { ListItem } from '@umami/react-zen/ListItem';
46
+ import { List, ListItem, ListSeparator, ListSection } from '@umami/react-zen/List';
49
47
  import { Loading } from '@umami/react-zen/Loading';
50
48
  import { LoadingButton } from '@umami/react-zen/LoadingButton';
51
49
  import { Menu } from '@umami/react-zen/Menu';
@@ -71,12 +69,97 @@ declare module '@umami/react-zen' {
71
69
  import { TextOverflow } from '@umami/react-zen/TextOverflow';
72
70
  import { TextField } from '@umami/react-zen/TextField';
73
71
  import { TextArea } from '@umami/react-zen/TextArea';
74
- import { Toast, ToastProvider, Toaster } from '@umami/react-zen/Toast';
75
72
  import { Toggle } from '@umami/react-zen/Toggle';
76
73
  import { ToggleGroup, ToggleGroupItem } from '@umami/react-zen/ToggleGroup';
77
74
  import { Tooltip } from '@umami/react-zen/Tooltip';
78
75
  import { ZenProvider } from '@umami/react-zen/ZenProvider';
79
- export { Form, FormField, FormResetButton, FormSubmitButton, useDebounce, useTheme, useToast, Accordion, AccordionItem, AlertBanner, AlertDialog, Blockquote, Box, Breadcrumb, Breadcrumbs, Button, Calendar, Checkbox, Code, Column, Combobox, Container, ConfirmationDialog, DataTable, DataColumn, Dialog, DialogTrigger, Dots, FileTrigger, Flexbox, Grid, Heading, HoverTrigger, Icon, Icons, InlineEditField, Label, List, ListItem, Loading, LoadingButton, Menu, MenuItem, MenuTrigger, Modal, NavigationMenu, NavigationMenuItem, PasswordField, Popover, ProgressBar, ProgressCircle, Radio, RadioGroup, Row, SearchField, Select, Slider, Slot, Spinner, StatusLight, SubmenuTrigger, Switch, Table, TableHeader, TableBody, TableRow, TableColumn, TableCell, Tab, Tabs, TabList, TabPanel, Text, TextOverflow, TextField, TextArea, Toast, ToastProvider, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipTrigger, ZenProvider, };
76
+ export { Form, FormField, FormResetButton, FormSubmitButton, Toast, Toaster, ToastProvider, useDebounce, useTheme, useToast, Accordion, AccordionItem, AlertBanner, AlertDialog, Blockquote, Box, Breadcrumb, Breadcrumbs, Button, Calendar, Checkbox, Code, Column, Combobox, Container, ConfirmationDialog, DataTable, DataColumn, Dialog, DialogTrigger, Dots, FileTrigger, Flexbox, Grid, Heading, HoverTrigger, Icon, Icons, InlineEditField, Label, List, ListItem, ListSection, Loading, LoadingButton, Menu, MenuItem, MenuTrigger, Modal, NavigationMenu, NavigationMenuItem, PasswordField, Popover, ProgressBar, ProgressCircle, Radio, RadioGroup, Row, SearchField, Select, ListSeparator, Slider, Slot, Spinner, StatusLight, SubmenuTrigger, Switch, Table, TableHeader, TableBody, TableRow, TableColumn, TableCell, Tab, Tabs, TabList, TabPanel, Text, TextOverflow, TextField, TextArea, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipTrigger, ZenProvider, };
77
+ }
78
+
79
+ declare module '@umami/react-zen/forms/Form' {
80
+ import { HTMLAttributes, ReactNode } from 'react';
81
+ import { UseFormProps, SubmitHandler, UseFormReturn } from 'react-hook-form';
82
+ import { Responsive, Spacing } from '@/lib/types';
83
+ interface FormProps extends UseFormProps, Omit<HTMLAttributes<HTMLFormElement>, 'children'> {
84
+ gap?: Responsive<Spacing>;
85
+ autoComplete?: string;
86
+ onSubmit?: SubmitHandler<any>;
87
+ error?: ReactNode;
88
+ preventSubmit?: boolean;
89
+ children?: ReactNode | ((e: UseFormReturn) => ReactNode);
90
+ }
91
+ function Form({ gap, autoComplete, onSubmit, error, preventSubmit, mode, disabled, reValidateMode, defaultValues, values, errors, resetOptions, resolver, context, shouldFocusError, shouldUnregister, shouldUseNativeValidation, progressive, criteriaMode, delayError, className, children, ...props }: FormProps): import("react").JSX.Element;
92
+ export { Form };
93
+ export type { FormProps };
94
+ }
95
+
96
+ declare module '@umami/react-zen/forms/FormField' {
97
+ import { HTMLAttributes } from 'react';
98
+ import { RegisterOptions, UseFormReturn, FieldValues } from 'react-hook-form';
99
+ interface FormFieldProps extends HTMLAttributes<HTMLDivElement>, Partial<UseFormReturn> {
100
+ name: string;
101
+ description?: string;
102
+ label?: string;
103
+ rules?: RegisterOptions<FieldValues, string>;
104
+ children: any;
105
+ }
106
+ const FormField: import("react").ForwardRefExoticComponent<FormFieldProps & import("react").RefAttributes<any>>;
107
+ export { FormField };
108
+ export type { FormFieldProps };
109
+ }
110
+
111
+ declare module '@umami/react-zen/forms/FormResetButton' {
112
+ import { FieldValues } from 'react-hook-form';
113
+ import { ButtonProps } from '@umami/react-zen/Button';
114
+ interface FormResetButtonProps extends ButtonProps {
115
+ values?: FieldValues | {
116
+ [p: string]: any;
117
+ };
118
+ }
119
+ function FormResetButton({ values, children, onPress, ...props }: FormResetButtonProps): import("react").JSX.Element;
120
+ export { FormResetButton };
121
+ export type { FormResetButtonProps };
122
+ }
123
+
124
+ declare module '@umami/react-zen/forms/FormSubmitButton' {
125
+ import { LoadingButtonProps } from '@umami/react-zen/LoadingButton';
126
+ function FormSubmitButton({ children, disabled, isLoading, ...props }: LoadingButtonProps): import("react").JSX.Element;
127
+ export { FormSubmitButton };
128
+ }
129
+
130
+ declare module '@umami/react-zen/toast/Toast' {
131
+ import { HTMLAttributes } from 'react';
132
+ interface ToastProps extends HTMLAttributes<HTMLDivElement> {
133
+ id: string;
134
+ message: string;
135
+ title?: string;
136
+ actions?: string[];
137
+ allowClose?: boolean;
138
+ variant?: 'info' | 'error';
139
+ onClose?: (action?: string) => void;
140
+ }
141
+ function Toast({ id, message, title, actions, allowClose, variant, className, children, onClose, ...props }: ToastProps): import("react").JSX.Element;
142
+ export { Toast };
143
+ export type { ToastProps };
144
+ }
145
+
146
+ declare module '@umami/react-zen/toast/Toaster' {
147
+ export type ToastPosition = 'top-left' | 'top' | 'top-right' | 'bottom-left' | 'bottom' | 'bottom-right' | 'left' | 'right';
148
+ export interface ToasterProps {
149
+ duration?: number;
150
+ position?: ToastPosition;
151
+ }
152
+ export function Toaster({ duration, position }: ToasterProps): import("react").JSX.Element;
153
+ }
154
+
155
+ declare module '@umami/react-zen/toast/ToastProvider' {
156
+ import { ReactNode } from 'react';
157
+ import { ToasterProps } from '@/components/toast/Toaster';
158
+ export interface ToastProviderProps extends ToasterProps {
159
+ children: ReactNode;
160
+ }
161
+ export const ToastContext: import("react").Context<{}>;
162
+ export function ToastProvider({ children, ...config }: ToastProviderProps): import("react").JSX.Element;
80
163
  }
81
164
 
82
165
  declare module '@umami/react-zen/hooks/useDebounce' {
@@ -96,18 +179,24 @@ declare module '@umami/react-zen/hooks/useTheme' {
96
179
  }
97
180
 
98
181
  declare module '@umami/react-zen/hooks/useToast' {
99
- import { ToastProps } from '@umami/react-zen/Toast';
100
- interface ToastState {
101
- id: number;
182
+ export interface ToastOptions {
183
+ duration?: number;
184
+ title?: string;
185
+ actions?: string[];
186
+ allowClose?: boolean;
187
+ variant?: 'info' | 'error';
188
+ onClose?: (action?: string) => void;
189
+ }
190
+ export interface ToastState extends ToastOptions {
191
+ id: string;
102
192
  message: string;
103
- props: ToastProps;
193
+ timestamp: number;
104
194
  }
105
- function toast(message: string, props?: ToastProps): void;
106
- function useToast(): {
107
- toast: typeof toast;
195
+ export function removeToast(id: string): void;
196
+ export function useToast(): {
197
+ toast: (message: string, options?: ToastOptions) => void;
108
198
  toasts: ToastState[];
109
199
  };
110
- export { useToast, toast };
111
200
  }
112
201
 
113
202
  declare module '@umami/react-zen/Accordion' {
@@ -479,22 +568,18 @@ declare module '@umami/react-zen/Label' {
479
568
 
480
569
  declare module '@umami/react-zen/List' {
481
570
  import { ReactNode } from 'react';
482
- import { ListBoxProps } from 'react-aria-components';
483
- interface ListProps extends ListBoxProps<any> {
571
+ import { ListBoxProps, SeparatorProps, ListBoxSectionProps, ListBoxItemProps } from 'react-aria-components';
572
+ export interface ListProps extends ListBoxProps<any> {
484
573
  items?: any[];
485
574
  className?: string;
486
575
  children?: ReactNode;
487
576
  }
488
- function List({ items, className, children, ...props }: ListProps): import("react").JSX.Element;
489
- export { List };
490
- export type { ListProps };
491
- }
492
-
493
- declare module '@umami/react-zen/ListItem' {
494
- import { ListBoxItemProps } from 'react-aria-components';
495
- function ListItem({ children, className, ...props }: ListBoxItemProps<any>): import("react").JSX.Element;
496
- export { ListItem };
497
- export type { ListBoxItemProps as ListItemProps };
577
+ export function List({ items, className, children, ...props }: ListProps): import("react").JSX.Element;
578
+ export function ListItem({ children, className, ...props }: ListBoxItemProps<any>): import("react").JSX.Element;
579
+ export function ListSeparator({ className, ...props }: SeparatorProps): import("react").JSX.Element;
580
+ export function ListSection({ title, className, children, ...props }: ListBoxSectionProps<any> & {
581
+ title?: string;
582
+ }): ReactNode;
498
583
  }
499
584
 
500
585
  declare module '@umami/react-zen/Loading' {
@@ -660,7 +745,11 @@ declare module '@umami/react-zen/Slider' {
660
745
  }
661
746
 
662
747
  declare module '@umami/react-zen/Slot' {
663
- export { Slot } from '@radix-ui/react-slot';
748
+ import { ReactElement, ReactNode } from 'react';
749
+ export function Slot({ children, ...props }: {
750
+ children: ReactElement | ReactNode;
751
+ [key: string]: any;
752
+ }): ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | null;
664
753
  }
665
754
 
666
755
  declare module '@umami/react-zen/Spinner' {
@@ -775,21 +864,6 @@ declare module '@umami/react-zen/TextArea' {
775
864
  export type { TextAreaProps };
776
865
  }
777
866
 
778
- declare module '@umami/react-zen/Toast' {
779
- import { ToastProvider, ToastProviderProps, ToastProps, ToastViewportProps } from '@radix-ui/react-toast';
780
- interface _ToastProps extends ToastProps {
781
- title?: string;
782
- description?: string;
783
- actionText?: string;
784
- allowClose?: boolean;
785
- variant?: 'info' | 'error';
786
- }
787
- function Toast({ title, description, actionText, allowClose, variant, className, children, ...props }: _ToastProps): import("react").JSX.Element;
788
- function Toaster(props: ToastViewportProps): import("react").JSX.Element;
789
- export { Toast, ToastProvider, Toaster };
790
- export type { _ToastProps as ToastProps, ToastProviderProps, ToastViewportProps as ToasterProps };
791
- }
792
-
793
867
  declare module '@umami/react-zen/Toggle' {
794
868
  import { ToggleButtonProps } from 'react-aria-components';
795
869
  interface ToggleProps extends ToggleButtonProps {
@@ -822,16 +896,14 @@ declare module '@umami/react-zen/Tooltip' {
822
896
 
823
897
  declare module '@umami/react-zen/ZenProvider' {
824
898
  import { ReactNode } from 'react';
825
- import { ToastProviderProps } from '@umami/react-zen/Toast';
899
+ import { ToasterProps } from '@/components/toast/Toaster';
826
900
  interface ZenProviderProps {
827
- config?: {
828
- theme?: string;
829
- colorScheme?: 'light' | 'dark' | 'system';
830
- toast?: ToastProviderProps;
831
- };
901
+ theme?: string;
902
+ colorScheme?: 'light' | 'dark' | 'system';
903
+ toast?: ToasterProps;
832
904
  children: ReactNode;
833
905
  }
834
- function ZenProvider({ config, children }: ZenProviderProps): import("react").JSX.Element;
906
+ function ZenProvider({ children, ...props }: ZenProviderProps): import("react").JSX.Element;
835
907
  export { ZenProvider };
836
908
  export type { ZenProviderProps };
837
909
  }