@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 +1 -1
- package/dist/index.css +167 -140
- package/dist/index.d.ts +129 -57
- package/dist/index.js +5217 -3122
- package/dist/index.mjs +4737 -2640
- package/dist/styles.css +167 -140
- package/package.json +9 -9
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/)
|
|
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
|
-
.
|
|
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
|
-
.
|
|
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(--
|
|
3609
|
+
gap: var(--spacing-6);
|
|
3464
3610
|
margin-bottom: var(--spacing-6);
|
|
3465
3611
|
}
|
|
3466
|
-
.
|
|
3612
|
+
.Tabs_list__Yjc4M.Tabs_quiet__ZTViO {
|
|
3467
3613
|
border: 0;
|
|
3468
3614
|
}
|
|
3469
|
-
.
|
|
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
|
-
.
|
|
3626
|
+
.Tabs_tab__OTEyN:hover {
|
|
3481
3627
|
color: var(--font-color);
|
|
3482
3628
|
}
|
|
3483
|
-
.
|
|
3629
|
+
.Tabs_tab__OTEyN[data-selected] {
|
|
3484
3630
|
color: var(--font-color);
|
|
3485
3631
|
border-bottom: 2px solid var(--primary-color);
|
|
3486
3632
|
}
|
|
3487
|
-
.
|
|
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
|
-
//
|
|
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 '
|
|
16
|
-
import { FormField } from '
|
|
17
|
-
import { FormResetButton } from '
|
|
18
|
-
import { FormSubmitButton } from '
|
|
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,
|
|
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
|
-
|
|
100
|
-
|
|
101
|
-
|
|
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
|
-
|
|
193
|
+
timestamp: number;
|
|
104
194
|
}
|
|
105
|
-
function
|
|
106
|
-
function useToast(): {
|
|
107
|
-
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 {
|
|
490
|
-
export
|
|
491
|
-
}
|
|
492
|
-
|
|
493
|
-
|
|
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
|
-
|
|
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 {
|
|
899
|
+
import { ToasterProps } from '@/components/toast/Toaster';
|
|
826
900
|
interface ZenProviderProps {
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
toast?: ToastProviderProps;
|
|
831
|
-
};
|
|
901
|
+
theme?: string;
|
|
902
|
+
colorScheme?: 'light' | 'dark' | 'system';
|
|
903
|
+
toast?: ToasterProps;
|
|
832
904
|
children: ReactNode;
|
|
833
905
|
}
|
|
834
|
-
function ZenProvider({
|
|
906
|
+
function ZenProvider({ children, ...props }: ZenProviderProps): import("react").JSX.Element;
|
|
835
907
|
export { ZenProvider };
|
|
836
908
|
export type { ZenProviderProps };
|
|
837
909
|
}
|