@umami/react-zen 0.63.0 → 0.64.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/dist/index.css +129 -101
- package/dist/index.d.ts +23 -7
- package/dist/index.js +4800 -4059
- package/dist/index.mjs +5237 -4496
- package/package.json +19 -13
- package/styles.css +129 -101
package/dist/index.css
CHANGED
|
@@ -1,24 +1,25 @@
|
|
|
1
1
|
/* virtual-css:css:fd9059b0b8139e56f974f8291736b4c8 */
|
|
2
|
-
.
|
|
2
|
+
.Icon_icon__NzNmN {
|
|
3
3
|
display: inline-block;
|
|
4
|
+
flex-shrink: 0;
|
|
4
5
|
}
|
|
5
|
-
.
|
|
6
|
+
.Icon_xs__MDhiY {
|
|
6
7
|
width: 12px;
|
|
7
8
|
height: 12px;
|
|
8
9
|
}
|
|
9
|
-
.
|
|
10
|
+
.Icon_sm__ZWU0N {
|
|
10
11
|
width: 16px;
|
|
11
12
|
height: 16px;
|
|
12
13
|
}
|
|
13
|
-
.
|
|
14
|
+
.Icon_md__YTY3Y {
|
|
14
15
|
width: 24px;
|
|
15
16
|
height: 24px;
|
|
16
17
|
}
|
|
17
|
-
.
|
|
18
|
+
.Icon_lg__ZGJlZ {
|
|
18
19
|
width: 32px;
|
|
19
20
|
height: 32px;
|
|
20
21
|
}
|
|
21
|
-
.
|
|
22
|
+
.Icon_xl__MDU3Y {
|
|
22
23
|
width: 48px;
|
|
23
24
|
height: 48px;
|
|
24
25
|
}
|
|
@@ -2236,7 +2237,7 @@
|
|
|
2236
2237
|
}
|
|
2237
2238
|
|
|
2238
2239
|
/* virtual-css:css:616ae3b49446388ff62e911490fa55d8 */
|
|
2239
|
-
.
|
|
2240
|
+
.Button_button__ZTY3M {
|
|
2240
2241
|
display: flex;
|
|
2241
2242
|
align-items: center;
|
|
2242
2243
|
justify-content: center;
|
|
@@ -2255,85 +2256,85 @@
|
|
|
2255
2256
|
line-height: 1.5;
|
|
2256
2257
|
--button-height: calc(1.5 * var(--font-size) + 2 * var(--padding-y)) ;
|
|
2257
2258
|
}
|
|
2258
|
-
.
|
|
2259
|
+
.Button_button__ZTY3M:disabled {
|
|
2259
2260
|
color: var(--font-color-muted);
|
|
2260
2261
|
pointer-events: none;
|
|
2261
2262
|
}
|
|
2262
|
-
.
|
|
2263
|
+
.Button_button__ZTY3M:hover {
|
|
2263
2264
|
background: color-mix(in srgb, var(--base-color-3), 5% var(--dark-color));
|
|
2264
2265
|
}
|
|
2265
|
-
.
|
|
2266
|
+
.Button_button__ZTY3M[data-pressed] {
|
|
2266
2267
|
background: color-mix(in srgb, var(--base-color-3), 10% var(--dark-color));
|
|
2267
2268
|
}
|
|
2268
|
-
.
|
|
2269
|
+
.Button_button__ZTY3M.Button_primary__YzkyZ {
|
|
2269
2270
|
color: var(--primary-font-color) !important;
|
|
2270
2271
|
background: var(--primary-color);
|
|
2271
2272
|
}
|
|
2272
|
-
.
|
|
2273
|
+
.Button_button__ZTY3M.Button_primary__YzkyZ:hover {
|
|
2273
2274
|
background: color-mix(in srgb, var(--primary-color), 10% var(--primary-font-color));
|
|
2274
2275
|
}
|
|
2275
|
-
.
|
|
2276
|
+
.Button_button__ZTY3M.Button_primary__YzkyZ[data-pressed] {
|
|
2276
2277
|
background: color-mix(in srgb, var(--primary-color), 20% var(--primary-font-color));
|
|
2277
2278
|
}
|
|
2278
|
-
.
|
|
2279
|
+
.Button_button__ZTY3M.Button_primary__YzkyZ:disabled {
|
|
2279
2280
|
color: var(--primary-font-color);
|
|
2280
2281
|
background: var(--base-color-9);
|
|
2281
2282
|
}
|
|
2282
|
-
.
|
|
2283
|
-
background:
|
|
2283
|
+
.Button_button__ZTY3M.Button_outline__OGU2Z {
|
|
2284
|
+
background: var(--background-color);
|
|
2284
2285
|
border: var(--border);
|
|
2285
2286
|
box-shadow: var(--box-shadow-1);
|
|
2286
2287
|
}
|
|
2287
|
-
.
|
|
2288
|
-
|
|
2288
|
+
.Button_button__ZTY3M.Button_outline__OGU2Z:hover {
|
|
2289
|
+
border-color: var(--border-color-3);
|
|
2289
2290
|
}
|
|
2290
|
-
.
|
|
2291
|
-
background:
|
|
2291
|
+
.Button_button__ZTY3M.Button_outline__OGU2Z[data-pressed] {
|
|
2292
|
+
background: var(--highlight-color);
|
|
2292
2293
|
}
|
|
2293
|
-
.
|
|
2294
|
+
.Button_button__ZTY3M.Button_quiet__ZTliZ {
|
|
2294
2295
|
background: transparent;
|
|
2295
2296
|
}
|
|
2296
|
-
.
|
|
2297
|
+
.Button_button__ZTY3M.Button_quiet__ZTliZ:hover {
|
|
2297
2298
|
background: var(--highlight-color);
|
|
2298
2299
|
}
|
|
2299
|
-
.
|
|
2300
|
+
.Button_button__ZTY3M.Button_quiet__ZTliZ[data-pressed] {
|
|
2300
2301
|
background: color-mix(in srgb, var(--highlight-color), 5% var(--dark-color));
|
|
2301
2302
|
}
|
|
2302
|
-
.
|
|
2303
|
+
.Button_button__ZTY3M.Button_danger__ZDc1M {
|
|
2303
2304
|
color: var(--light-color);
|
|
2304
2305
|
background: var(--danger-color);
|
|
2305
2306
|
}
|
|
2306
|
-
.
|
|
2307
|
+
.Button_button__ZTY3M.Button_danger__ZDc1M:hover {
|
|
2307
2308
|
background: color-mix(in srgb, var(--danger-color), 6% black);
|
|
2308
2309
|
}
|
|
2309
|
-
.
|
|
2310
|
+
.Button_button__ZTY3M.Button_danger__ZDc1M[data-pressed] {
|
|
2310
2311
|
background: color-mix(in srgb, var(--danger-color), 12% black);
|
|
2311
2312
|
}
|
|
2312
|
-
.
|
|
2313
|
+
.Button_button__ZTY3M.Button_danger__ZDc1M:disabled {
|
|
2313
2314
|
color: var(--primary-font-color);
|
|
2314
2315
|
background: var(--base-color-8);
|
|
2315
2316
|
}
|
|
2316
|
-
.
|
|
2317
|
+
.Button_button__ZTY3M.Button_sm__NzRiZ {
|
|
2317
2318
|
font-size: calc(0.9 * var(--font-size));
|
|
2318
2319
|
padding: calc(0.5 * var(--padding-y)) calc(0.75 * var(--padding-x));
|
|
2319
2320
|
min-height: calc(0.9 * var(--button-height));
|
|
2320
2321
|
}
|
|
2321
|
-
.
|
|
2322
|
+
.Button_button__ZTY3M.Button_md__ZTZiM {
|
|
2322
2323
|
font-size: var(--font-size);
|
|
2323
2324
|
padding: var(--padding);
|
|
2324
2325
|
min-height: var(--button-height);
|
|
2325
2326
|
}
|
|
2326
|
-
.
|
|
2327
|
+
.Button_button__ZTY3M.Button_lg__ODE0Z {
|
|
2327
2328
|
font-size: calc(1.25 * var(--font-size));
|
|
2328
2329
|
padding: var(--padding-y) calc(1.25 * var(--padding-x));
|
|
2329
2330
|
min-height: calc(1.25 * var(--button-height));
|
|
2330
2331
|
}
|
|
2331
|
-
.
|
|
2332
|
+
.Button_button__ZTY3M.Button_xl__NzE0M {
|
|
2332
2333
|
font-size: calc(1.5 * var(--font-size));
|
|
2333
2334
|
padding: calc(1.25 * var(--padding-y)) calc(1.25 * var(--padding-x));
|
|
2334
2335
|
min-height: calc(1.5 * var(--button-height));
|
|
2335
2336
|
}
|
|
2336
|
-
body a.
|
|
2337
|
+
body a.Button_button__ZTY3M {
|
|
2337
2338
|
color: inherit;
|
|
2338
2339
|
text-decoration: none;
|
|
2339
2340
|
}
|
|
@@ -2601,15 +2602,17 @@ body a.Button_button__NmQ1Z {
|
|
|
2601
2602
|
}
|
|
2602
2603
|
|
|
2603
2604
|
/* virtual-css:css:642a816d71e0e4e5346089e7fb2bf78b */
|
|
2604
|
-
.
|
|
2605
|
+
.Block_block__MmJiM {
|
|
2605
2606
|
display: flex;
|
|
2606
2607
|
flex-direction: row;
|
|
2607
2608
|
align-items: center;
|
|
2608
2609
|
font-size: var(--font-size);
|
|
2609
2610
|
gap: var(--gap);
|
|
2610
2611
|
padding: var(--padding);
|
|
2612
|
+
border: 1px solid transparent;
|
|
2611
2613
|
border-radius: var(--border-radius);
|
|
2612
2614
|
line-height: 1.5;
|
|
2615
|
+
min-height: calc((1.5 * var(--font-size)) + (2 * var(--padding-y)));
|
|
2613
2616
|
}
|
|
2614
2617
|
|
|
2615
2618
|
/* virtual-css:css:24928f94983bde06afba78ec92a4df4b */
|
|
@@ -2949,19 +2952,19 @@ body a.Button_button__NmQ1Z {
|
|
|
2949
2952
|
}
|
|
2950
2953
|
|
|
2951
2954
|
/* virtual-css:css:ac55918cdbb6b3a9ac9deedf05ce3806 */
|
|
2952
|
-
.
|
|
2955
|
+
.input_field__NGM0Z {
|
|
2953
2956
|
position: relative;
|
|
2954
2957
|
min-width: 240px;
|
|
2955
2958
|
}
|
|
2956
|
-
.
|
|
2957
|
-
.
|
|
2959
|
+
.input_field__NGM0Z,
|
|
2960
|
+
.input_row__NjY4Y {
|
|
2958
2961
|
position: relative;
|
|
2959
2962
|
}
|
|
2960
|
-
.
|
|
2961
|
-
.
|
|
2963
|
+
.input_field__NGM0Z[data-readonly] .input_input__MjUyM,
|
|
2964
|
+
.input_field__NGM0Z[data-disabled] .input_input__MjUyM {
|
|
2962
2965
|
background: var(--base-color-4);
|
|
2963
2966
|
}
|
|
2964
|
-
.
|
|
2967
|
+
.input_input__MjUyM {
|
|
2965
2968
|
font-size: var(--font-size);
|
|
2966
2969
|
color: var(--font-color);
|
|
2967
2970
|
border: var(--border);
|
|
@@ -2972,37 +2975,36 @@ body a.Button_button__NmQ1Z {
|
|
|
2972
2975
|
line-height: 1.5rem;
|
|
2973
2976
|
width: 100%;
|
|
2974
2977
|
}
|
|
2975
|
-
.
|
|
2978
|
+
.input_input__MjUyM:focus {
|
|
2976
2979
|
border-color: transparent;
|
|
2977
2980
|
outline: var(--outline);
|
|
2978
2981
|
}
|
|
2979
|
-
.
|
|
2982
|
+
.input_input__MjUyM::placeholder {
|
|
2980
2983
|
color: var(--font-color-muted);
|
|
2981
2984
|
}
|
|
2982
|
-
.
|
|
2985
|
+
.input_input__MjUyM:disabled {
|
|
2983
2986
|
color: var(--font-color-muted);
|
|
2984
2987
|
}
|
|
2985
|
-
.
|
|
2986
|
-
.
|
|
2988
|
+
.input_input__MjUyM::-webkit-search-cancel-button,
|
|
2989
|
+
.input_input__MjUyM::-webkit-search-decoration {
|
|
2987
2990
|
-webkit-appearance: none;
|
|
2988
2991
|
}
|
|
2989
|
-
.
|
|
2992
|
+
.input_icon__ZjY5O {
|
|
2990
2993
|
color: var(--font-color-muted);
|
|
2991
|
-
background: var(--background-color);
|
|
2992
2994
|
}
|
|
2993
|
-
.
|
|
2995
|
+
.input_icon__ZjY5O:hover {
|
|
2994
2996
|
color: var(--font-color);
|
|
2995
2997
|
cursor: pointer;
|
|
2996
2998
|
}
|
|
2997
2999
|
|
|
2998
3000
|
/* virtual-css:css:f85c857d13f820fa4badfb09996080b9 */
|
|
2999
|
-
.
|
|
3001
|
+
.TextField_allowCopy__Y2RhY {
|
|
3000
3002
|
padding-right: 32px;
|
|
3001
3003
|
}
|
|
3002
|
-
.
|
|
3004
|
+
.TextField_icon__MWVlN {
|
|
3003
3005
|
position: absolute;
|
|
3004
|
-
top: var(--
|
|
3005
|
-
right: var(--
|
|
3006
|
+
top: calc(var(--padding-y) + 4px);
|
|
3007
|
+
right: var(--padding-x);
|
|
3006
3008
|
background: none;
|
|
3007
3009
|
}
|
|
3008
3010
|
|
|
@@ -3083,7 +3085,7 @@ body a.Button_button__NmQ1Z {
|
|
|
3083
3085
|
}
|
|
3084
3086
|
|
|
3085
3087
|
/* virtual-css:css:e66162403f9946d7217dc462fee28120 */
|
|
3086
|
-
.
|
|
3088
|
+
.Dots_dots__YzQxM {
|
|
3087
3089
|
position: relative;
|
|
3088
3090
|
display: inline-flex;
|
|
3089
3091
|
justify-content: center;
|
|
@@ -3091,21 +3093,21 @@ body a.Button_button__NmQ1Z {
|
|
|
3091
3093
|
min-height: 50px;
|
|
3092
3094
|
gap: 8px;
|
|
3093
3095
|
}
|
|
3094
|
-
.
|
|
3095
|
-
width:
|
|
3096
|
-
height:
|
|
3096
|
+
.Dots_dot__ZDdiZ {
|
|
3097
|
+
width: 8px;
|
|
3098
|
+
height: 8px;
|
|
3097
3099
|
border-radius: 100%;
|
|
3098
3100
|
background: color-mix(in srgb, var(--font-color), 50% transparent);
|
|
3099
|
-
animation: Dots_dots-
|
|
3101
|
+
animation: Dots_dots-blink__NDE3Y 1.2s infinite;
|
|
3100
3102
|
animation-fill-mode: both;
|
|
3101
3103
|
}
|
|
3102
|
-
.
|
|
3104
|
+
.Dots_dot__ZDdiZ:nth-child(2) {
|
|
3103
3105
|
animation-delay: 0.2s;
|
|
3104
3106
|
}
|
|
3105
|
-
.
|
|
3107
|
+
.Dots_dot__ZDdiZ:nth-child(3) {
|
|
3106
3108
|
animation-delay: 0.4s;
|
|
3107
3109
|
}
|
|
3108
|
-
@keyframes Dots_dots-
|
|
3110
|
+
@keyframes Dots_dots-blink__NDE3Y {
|
|
3109
3111
|
0% {
|
|
3110
3112
|
opacity: 0.2;
|
|
3111
3113
|
}
|
|
@@ -3117,6 +3119,14 @@ body a.Button_button__NmQ1Z {
|
|
|
3117
3119
|
}
|
|
3118
3120
|
}
|
|
3119
3121
|
|
|
3122
|
+
/* virtual-css:css:a37d08939f4c2e286eced2d454e614ea */
|
|
3123
|
+
.FloatingTooltip_tooltip__YTcxZ {
|
|
3124
|
+
position: fixed;
|
|
3125
|
+
pointer-events: none;
|
|
3126
|
+
z-index: 9999;
|
|
3127
|
+
transform: translate(-50%, calc(-100% - 6px));
|
|
3128
|
+
}
|
|
3129
|
+
|
|
3120
3130
|
/* virtual-css:css:94870e251b7b77526d8ae103079be601 */
|
|
3121
3131
|
.Heading_heading__MGIyZ {
|
|
3122
3132
|
color: var(--heading-color);
|
|
@@ -3590,53 +3600,62 @@ body a.Button_button__NmQ1Z {
|
|
|
3590
3600
|
}
|
|
3591
3601
|
|
|
3592
3602
|
/* virtual-css:css:34d15f1efb5cfdf86de5abea08f767ce */
|
|
3593
|
-
.
|
|
3594
|
-
font-size: var(--font-size);
|
|
3595
|
-
color: var(--light-color);
|
|
3596
|
-
background: rgba(0, 0, 0, 0.8);
|
|
3603
|
+
.Tooltip_tooltip__ODVhY {
|
|
3597
3604
|
forced-color-adjust: none;
|
|
3598
3605
|
outline: none;
|
|
3606
|
+
}
|
|
3607
|
+
.Tooltip_bubble__OTMzY {
|
|
3608
|
+
color: var(--light-color);
|
|
3609
|
+
background: rgba(0, 0, 0, 0.8);
|
|
3599
3610
|
padding: var(--padding);
|
|
3600
3611
|
border-radius: var(--border-radius);
|
|
3601
|
-
max-width: 150px;
|
|
3602
|
-
transform: translate3d(0, 0, 0);
|
|
3603
3612
|
}
|
|
3604
|
-
.
|
|
3613
|
+
.Tooltip_floating__YWVjM {
|
|
3614
|
+
position: fixed;
|
|
3615
|
+
pointer-events: none;
|
|
3616
|
+
z-index: 9999;
|
|
3617
|
+
transform: translate(-50%, calc(-100% - 5px));
|
|
3618
|
+
}
|
|
3619
|
+
.Tooltip_tooltip__ODVhY[data-placement=top] {
|
|
3605
3620
|
margin-bottom: 8px;
|
|
3606
3621
|
--origin: translateY(4px);
|
|
3607
3622
|
}
|
|
3608
|
-
.
|
|
3623
|
+
.Tooltip_tooltip__ODVhY[data-placement=bottom] {
|
|
3609
3624
|
margin-top: 8px;
|
|
3610
3625
|
--origin: translateY(-4px);
|
|
3611
3626
|
}
|
|
3612
|
-
.
|
|
3627
|
+
.Tooltip_tooltip__ODVhY[data-placement=bottom] .Tooltip_arrow__ZmMyY svg {
|
|
3613
3628
|
transform: rotate(180deg);
|
|
3614
3629
|
}
|
|
3615
|
-
.
|
|
3630
|
+
.Tooltip_tooltip__ODVhY[data-placement=right] {
|
|
3616
3631
|
margin-left: 8px;
|
|
3617
3632
|
--origin: translateX(-4px);
|
|
3618
3633
|
}
|
|
3619
|
-
.
|
|
3634
|
+
.Tooltip_tooltip__ODVhY[data-placement=right] .Tooltip_arrow__ZmMyY svg {
|
|
3620
3635
|
transform: rotate(90deg);
|
|
3621
3636
|
}
|
|
3622
|
-
.
|
|
3637
|
+
.Tooltip_tooltip__ODVhY[data-placement=left] {
|
|
3623
3638
|
margin-right: 8px;
|
|
3624
3639
|
--origin: translateX(4px);
|
|
3625
3640
|
}
|
|
3626
|
-
.
|
|
3641
|
+
.Tooltip_tooltip__ODVhY[data-placement=left] .Tooltip_arrow__ZmMyY svg {
|
|
3627
3642
|
transform: rotate(-90deg);
|
|
3628
3643
|
}
|
|
3629
|
-
.
|
|
3644
|
+
.Tooltip_tooltip__ODVhY .Tooltip_arrow__ZmMyY {
|
|
3645
|
+
width: 8px;
|
|
3646
|
+
height: 8px;
|
|
3647
|
+
}
|
|
3648
|
+
.Tooltip_tooltip__ODVhY .Tooltip_arrow__ZmMyY svg {
|
|
3630
3649
|
display: block;
|
|
3631
3650
|
fill: rgba(0, 0, 0, 0.8);
|
|
3632
3651
|
}
|
|
3633
|
-
.
|
|
3634
|
-
animation:
|
|
3652
|
+
.Tooltip_tooltip__ODVhY[data-entering] {
|
|
3653
|
+
animation: Tooltip_slide__OWE0Z 200ms;
|
|
3635
3654
|
}
|
|
3636
|
-
.
|
|
3637
|
-
animation:
|
|
3655
|
+
.Tooltip_tooltip__ODVhY[data-exiting] {
|
|
3656
|
+
animation: Tooltip_slide__OWE0Z 200ms reverse ease-in;
|
|
3638
3657
|
}
|
|
3639
|
-
@keyframes
|
|
3658
|
+
@keyframes Tooltip_slide__OWE0Z {
|
|
3640
3659
|
from {
|
|
3641
3660
|
transform: var(--origin);
|
|
3642
3661
|
opacity: 0;
|
|
@@ -3648,52 +3667,63 @@ body a.Button_button__NmQ1Z {
|
|
|
3648
3667
|
}
|
|
3649
3668
|
|
|
3650
3669
|
/* virtual-css:css:12d12fae43d9120371ddbb4f1c814f07 */
|
|
3651
|
-
.
|
|
3670
|
+
.SideNav_sidenav__NTNmY {
|
|
3652
3671
|
height: 100%;
|
|
3653
3672
|
font-size: var(--font-size);
|
|
3654
3673
|
background-color: var(--base-color-1);
|
|
3655
3674
|
border-right: 1px solid var(--border-color);
|
|
3656
3675
|
width: 200px;
|
|
3676
|
+
transition: width 0.1s ease-out;
|
|
3677
|
+
overflow: hidden;
|
|
3657
3678
|
}
|
|
3658
|
-
.
|
|
3679
|
+
.SideNav_header__NzhjN {
|
|
3659
3680
|
display: flex;
|
|
3660
3681
|
align-items: center;
|
|
3661
3682
|
gap: var(--gap);
|
|
3662
3683
|
padding: var(--padding);
|
|
3663
3684
|
}
|
|
3664
|
-
.
|
|
3685
|
+
.SideNav_name__ZWUxM {
|
|
3665
3686
|
font-weight: var(--font-weight-bold);
|
|
3666
3687
|
}
|
|
3667
|
-
.
|
|
3688
|
+
.SideNav_section__MmE3N {
|
|
3668
3689
|
padding: var(--spacing-3);
|
|
3690
|
+
overflow: hidden;
|
|
3669
3691
|
}
|
|
3670
|
-
.
|
|
3692
|
+
.SideNav_title__N2Y0O {
|
|
3671
3693
|
font-weight: var(--font-weight-bold);
|
|
3672
3694
|
}
|
|
3673
|
-
.
|
|
3695
|
+
.SideNav_content__MzA2M {
|
|
3674
3696
|
display: grid;
|
|
3697
|
+
min-height: 40px;
|
|
3675
3698
|
gap: var(--gap);
|
|
3699
|
+
overflow: hidden;
|
|
3676
3700
|
}
|
|
3677
|
-
.
|
|
3701
|
+
.SideNav_item__OGU5M {
|
|
3678
3702
|
display: flex;
|
|
3679
3703
|
align-items: center;
|
|
3680
3704
|
justify-content: flex-start;
|
|
3681
3705
|
width: 100%;
|
|
3706
|
+
min-height: 40px;
|
|
3682
3707
|
color: var(--font-color-muted);
|
|
3683
3708
|
gap: var(--gap);
|
|
3684
3709
|
padding: var(--padding);
|
|
3685
3710
|
cursor: pointer;
|
|
3711
|
+
white-space: nowrap;
|
|
3712
|
+
overflow: hidden;
|
|
3686
3713
|
}
|
|
3687
|
-
.
|
|
3714
|
+
.SideNav_item__OGU5M:hover {
|
|
3688
3715
|
color: var(--font-color);
|
|
3689
3716
|
background-color: var(--base-color-2);
|
|
3690
3717
|
}
|
|
3691
|
-
.
|
|
3692
|
-
|
|
3718
|
+
.SideNav_label__NjFiY {
|
|
3719
|
+
transition: opacity 0.3s;
|
|
3693
3720
|
}
|
|
3694
|
-
.
|
|
3695
|
-
|
|
3696
|
-
|
|
3721
|
+
.SideNav_collapsed__NTBlM .SideNav_label__NjFiY {
|
|
3722
|
+
opacity: 0;
|
|
3723
|
+
}
|
|
3724
|
+
.SideNav_collapsed__NTBlM {
|
|
3725
|
+
width: 68px;
|
|
3726
|
+
transition: width 0.2s ease-in-out;
|
|
3697
3727
|
}
|
|
3698
3728
|
|
|
3699
3729
|
/* virtual-css:css:02d4c53a13519acb012573b18f89110d */
|
|
@@ -3788,34 +3818,32 @@ body a.Button_button__NmQ1Z {
|
|
|
3788
3818
|
}
|
|
3789
3819
|
|
|
3790
3820
|
/* virtual-css:css:25b38ea4838450cf917453747a735c4a */
|
|
3791
|
-
.
|
|
3792
|
-
font-size: var(--font-size);
|
|
3793
|
-
color: var(--font-color);
|
|
3821
|
+
.StatusLight_statuslight__MTliM {
|
|
3794
3822
|
display: inline-flex;
|
|
3795
3823
|
align-items: center;
|
|
3796
3824
|
gap: 12px;
|
|
3797
3825
|
}
|
|
3798
|
-
.
|
|
3799
|
-
.
|
|
3826
|
+
.StatusLight_status__MDNmO,
|
|
3827
|
+
.StatusLight_bg__MjVjN {
|
|
3800
3828
|
width: 10px;
|
|
3801
3829
|
height: 10px;
|
|
3802
3830
|
border-radius: 100%;
|
|
3803
3831
|
background: #fff;
|
|
3804
3832
|
position: relative;
|
|
3805
3833
|
}
|
|
3806
|
-
.
|
|
3834
|
+
.StatusLight_status__MDNmO.StatusLight_success__ZWI1N {
|
|
3807
3835
|
background: var(--success-color);
|
|
3808
3836
|
}
|
|
3809
|
-
.
|
|
3837
|
+
.StatusLight_status__MDNmO.StatusLight_warning__YWRmM {
|
|
3810
3838
|
background: var(--warning-color);
|
|
3811
3839
|
}
|
|
3812
|
-
.
|
|
3840
|
+
.StatusLight_status__MDNmO.StatusLight_error__NjdjM {
|
|
3813
3841
|
background: var(--danger-color);
|
|
3814
3842
|
}
|
|
3815
|
-
.
|
|
3843
|
+
.StatusLight_status__MDNmO.StatusLight_active__NGZiY {
|
|
3816
3844
|
background: var(--active-color);
|
|
3817
3845
|
}
|
|
3818
|
-
.
|
|
3846
|
+
.StatusLight_status__MDNmO.StatusLight_inactive__NDI0Z {
|
|
3819
3847
|
background: var(--inactive-color);
|
|
3820
3848
|
}
|
|
3821
3849
|
|
package/dist/index.d.ts
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
// ../../@/components/Block
|
|
9
9
|
|
|
10
10
|
declare module '@umami/react-zen' {
|
|
11
|
-
import { DialogTrigger, FileTrigger, MenuTrigger, SubmenuTrigger, TooltipTrigger, RouterProvider } from 'react-aria-components';
|
|
11
|
+
import { DialogTrigger, FileTrigger, MenuTrigger, SubmenuTrigger, TooltipTrigger, RouterProvider, Focusable, Pressable } from 'react-aria-components';
|
|
12
12
|
import { Form } from '@umami/react-zen/forms/Form';
|
|
13
13
|
import { FormButtons } from '@umami/react-zen/forms/FormButtons';
|
|
14
14
|
import { FormField } from '@umami/react-zen/forms/FormField';
|
|
@@ -39,6 +39,7 @@ declare module '@umami/react-zen' {
|
|
|
39
39
|
import { DataTable, DataColumn } from '@umami/react-zen/DataTable';
|
|
40
40
|
import { Dots } from '@umami/react-zen/Dots';
|
|
41
41
|
import { Flexbox } from '@umami/react-zen/Flexbox';
|
|
42
|
+
import { FloatingTooltip } from '@umami/react-zen/FloatingTooltip';
|
|
42
43
|
import { Grid } from '@umami/react-zen/Grid';
|
|
43
44
|
import { Heading } from '@umami/react-zen/Heading';
|
|
44
45
|
import { HoverTrigger } from '@umami/react-zen/HoverTrigger';
|
|
@@ -75,9 +76,9 @@ declare module '@umami/react-zen' {
|
|
|
75
76
|
import { ThemeButton } from '@umami/react-zen/ThemeButton';
|
|
76
77
|
import { Toggle } from '@umami/react-zen/Toggle';
|
|
77
78
|
import { ToggleGroup, ToggleGroupItem } from '@umami/react-zen/ToggleGroup';
|
|
78
|
-
import { Tooltip } from '@umami/react-zen/Tooltip';
|
|
79
|
+
import { Tooltip, TooltipBubble } from '@umami/react-zen/Tooltip';
|
|
79
80
|
import { ZenProvider } from '@umami/react-zen/ZenProvider';
|
|
80
|
-
export { useDebounce, useTheme, useToast, Accordion, AccordionItem, AlertBanner, AlertDialog, Block, Blockquote, Box, Breadcrumb, Breadcrumbs, Button, Calendar, Checkbox, Code, Column, Combobox, Container, ConfirmationDialog, DataTable, DataColumn, Dialog, DialogTrigger, Dots, FileTrigger, Flexbox, Form, FormButtons, FormField, FormResetButton, FormSubmitButton, Grid, NavBar, NavBarItem, Heading, HoverTrigger, Icon, Icons, Image, InlineEditField, Label, List, ListItem, ListSection, ListSeparator, Loading, LoadingButton, Menu, MenuItem, MenuSection, MenuSeparator, MenuTrigger, Modal, PasswordField, Popover, ProgressBar, ProgressCircle, Radio, RadioGroup, Row, RouterProvider, SearchField, Select, SideNav, SideNavHeader, SideNavItem, SideNavSection, Slider, Slot, Spinner, StatusLight, SubmenuTrigger, Switch, Table, TableHeader, TableBody, TableRow, TableColumn, TableCell, Tab, Tabs, TabList, TabPanel, Text, TextField, TextArea, ThemeButton, Toast, Toaster, ToastProvider, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipTrigger, ZenProvider, };
|
|
81
|
+
export { useDebounce, useTheme, useToast, Accordion, AccordionItem, AlertBanner, AlertDialog, Block, Blockquote, Box, Breadcrumb, Breadcrumbs, Button, Calendar, Checkbox, Code, Column, Combobox, Container, ConfirmationDialog, DataTable, DataColumn, Dialog, DialogTrigger, Dots, FileTrigger, Flexbox, FloatingTooltip, Focusable, Form, FormButtons, FormField, FormResetButton, FormSubmitButton, Grid, NavBar, NavBarItem, Heading, HoverTrigger, Icon, Icons, Image, InlineEditField, Label, List, ListItem, ListSection, ListSeparator, Loading, LoadingButton, Menu, MenuItem, MenuSection, MenuSeparator, MenuTrigger, Modal, PasswordField, Popover, Pressable, ProgressBar, ProgressCircle, Radio, RadioGroup, Row, RouterProvider, SearchField, Select, SideNav, SideNavHeader, SideNavItem, SideNavSection, Slider, Slot, Spinner, StatusLight, SubmenuTrigger, Switch, Table, TableHeader, TableBody, TableRow, TableColumn, TableCell, Tab, Tabs, TabList, TabPanel, Text, TextField, TextArea, ThemeButton, Toast, Toaster, ToastProvider, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipBubble, TooltipTrigger, ZenProvider, };
|
|
81
82
|
}
|
|
82
83
|
|
|
83
84
|
declare module '@umami/react-zen/forms/Form' {
|
|
@@ -485,6 +486,13 @@ declare module '@umami/react-zen/Flexbox' {
|
|
|
485
486
|
export function Flexbox({ display, direction, wrap, justifyContent, justifyItems, alignContent, alignItems, gap, gapX, gapY, className, style, children, ...props }: FlexboxProps): import("react").JSX.Element;
|
|
486
487
|
}
|
|
487
488
|
|
|
489
|
+
declare module '@umami/react-zen/FloatingTooltip' {
|
|
490
|
+
import { ReactNode } from 'react';
|
|
491
|
+
export function FloatingTooltip({ children }: {
|
|
492
|
+
children: ReactNode;
|
|
493
|
+
}): import("react").JSX.Element;
|
|
494
|
+
}
|
|
495
|
+
|
|
488
496
|
declare module '@umami/react-zen/Grid' {
|
|
489
497
|
import { GridDisplay, GridAutoFlow, Responsive, Spacing, GridTemplateRows, GridTemplateColumns, GridTemplateAreas, AlignContent, AlignItems, JustifyContent, JustifyItems } from '@/lib/types';
|
|
490
498
|
import { BoxProps } from '@umami/react-zen/Box';
|
|
@@ -586,6 +594,7 @@ declare module '@umami/react-zen/Image' {
|
|
|
586
594
|
declare module '@umami/react-zen/InlineEditField' {
|
|
587
595
|
import { ReactNode } from 'react';
|
|
588
596
|
interface InlineEditFieldProps {
|
|
597
|
+
name?: string;
|
|
589
598
|
value: string;
|
|
590
599
|
defaultEdit?: boolean;
|
|
591
600
|
onChange?: (value: string) => void;
|
|
@@ -594,7 +603,7 @@ declare module '@umami/react-zen/InlineEditField' {
|
|
|
594
603
|
className?: string;
|
|
595
604
|
children?: ReactNode;
|
|
596
605
|
}
|
|
597
|
-
function InlineEditField({ value: defaultValue, defaultEdit, className, children, onChange, onCommit, onCancel, ...props }: InlineEditFieldProps): import("react").JSX.Element;
|
|
606
|
+
function InlineEditField({ name, value: defaultValue, defaultEdit, className, children, onChange, onCommit, onCancel, ...props }: InlineEditFieldProps): import("react").JSX.Element;
|
|
598
607
|
export { InlineEditField };
|
|
599
608
|
export type { InlineEditFieldProps };
|
|
600
609
|
}
|
|
@@ -959,9 +968,16 @@ declare module '@umami/react-zen/ToggleGroup' {
|
|
|
959
968
|
}
|
|
960
969
|
|
|
961
970
|
declare module '@umami/react-zen/Tooltip' {
|
|
962
|
-
import {
|
|
963
|
-
|
|
964
|
-
|
|
971
|
+
import { ReactNode } from 'react';
|
|
972
|
+
import { TooltipProps as AriaTooltipProps } from 'react-aria-components';
|
|
973
|
+
interface TooltipProps extends AriaTooltipProps {
|
|
974
|
+
showArrow?: boolean;
|
|
975
|
+
}
|
|
976
|
+
function Tooltip({ children, className, showArrow, ...props }: TooltipProps): import("react").JSX.Element;
|
|
977
|
+
function TooltipBubble({ children }: {
|
|
978
|
+
children?: ReactNode;
|
|
979
|
+
}): import("react").JSX.Element;
|
|
980
|
+
export { Tooltip, TooltipBubble };
|
|
965
981
|
export type { TooltipProps };
|
|
966
982
|
}
|
|
967
983
|
|