@saas-ui/react 3.0.0-alpha.17 → 3.0.0-alpha.19
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/CHANGELOG.md +25 -0
- package/dist/{chunk-5ILYOY27.js → chunk-MLJN6IOJ.js} +2 -1
- package/dist/chunk-QVFJV6HJ.js +8 -0
- package/dist/{chunk-ULAJ3JEO.js → chunk-S5J6REMC.js} +9 -1
- package/dist/components/card/index.cjs +31 -0
- package/dist/components/card/index.d.cts +1 -0
- package/dist/components/card/index.d.ts +1 -0
- package/dist/components/card/index.js +8 -0
- package/dist/components/command/index.d.cts +2 -5
- package/dist/components/command/index.d.ts +2 -5
- package/dist/components/grid-list/index.d.cts +67 -5
- package/dist/components/grid-list/index.d.ts +67 -5
- package/dist/components/icon-button/index.cjs +31 -0
- package/dist/components/icon-button/index.d.cts +1 -0
- package/dist/components/icon-button/index.d.ts +1 -0
- package/dist/components/icon-button/index.js +8 -0
- package/dist/components/number-input/index.cjs +9 -1
- package/dist/components/number-input/index.js +1 -1
- package/dist/components/pagination/index.cjs +2 -1
- package/dist/components/pagination/index.d.cts +5 -1
- package/dist/components/pagination/index.d.ts +5 -1
- package/dist/components/pagination/index.js +1 -1
- package/dist/index.cjs +525 -360
- package/dist/index.d.cts +2 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +321 -166
- package/dist/types-DnFoUudY.d.cts +10 -0
- package/dist/types-DnFoUudY.d.ts +10 -0
- package/package.json +2 -2
package/dist/index.cjs
CHANGED
@@ -43,6 +43,7 @@ __export(src_exports, {
|
|
43
43
|
EmptyState: () => EmptyState,
|
44
44
|
GridList: () => grid_list_exports,
|
45
45
|
IconBadge: () => IconBadge,
|
46
|
+
IconButton: () => import_react123.IconButton,
|
46
47
|
InputGroup: () => InputGroup,
|
47
48
|
Link: () => Link,
|
48
49
|
LoadingOverlay: () => loading_overlay_exports,
|
@@ -67,7 +68,7 @@ __export(src_exports, {
|
|
67
68
|
Switch: () => Switch,
|
68
69
|
Toaster: () => Toaster,
|
69
70
|
Tooltip: () => Tooltip,
|
70
|
-
createSystem: () =>
|
71
|
+
createSystem: () => import_react164.createSystem,
|
71
72
|
defaultConfig: () => defaultConfig,
|
72
73
|
defaultPresenceOptions: () => defaultPresenceOptions,
|
73
74
|
defaultSystem: () => defaultSystem,
|
@@ -165,7 +166,8 @@ var conditions = (0, import_react2.defineConditions)({
|
|
165
166
|
groupChecked: ".group:is(:checked, [data-checked], [aria-checked=true], [data-state=checked]) &, [role=group]:is(:checked, [data-checked], [aria-checked=true], [data-state=checked]) &",
|
166
167
|
groupExpanded: ".group:is([aria-expanded=true], [data-expanded], [data-state=expanded]) &, [role=group]:is([aria-expanded=true], [data-expanded], [data-state=expanded]) &",
|
167
168
|
groupInvalid: ".group:invalid &, [role=group]:invalid &",
|
168
|
-
parentHover: "button:hover
|
169
|
+
parentHover: "button:hover &, a:hover &, [role=button]:hover &",
|
170
|
+
pressable: "&:is(a, button, [role=button])"
|
169
171
|
});
|
170
172
|
|
171
173
|
// src/theme/global-css.ts
|
@@ -419,7 +421,7 @@ var buttonRecipe = (0, import_react5.defineRecipe)({
|
|
419
421
|
sm: {
|
420
422
|
gap: "2",
|
421
423
|
h: "7",
|
422
|
-
minW: "
|
424
|
+
minW: "7",
|
423
425
|
textStyle: "sm",
|
424
426
|
borderRadius: "md",
|
425
427
|
px: "2.5"
|
@@ -532,10 +534,10 @@ var buttonRecipe = (0, import_react5.defineRecipe)({
|
|
532
534
|
ghost: {
|
533
535
|
color: "colorPalette.fg",
|
534
536
|
_hover: {
|
535
|
-
bg: "colorPalette.
|
537
|
+
bg: "colorPalette.subtle"
|
536
538
|
},
|
537
539
|
_expanded: {
|
538
|
-
bg: "colorPalette.
|
540
|
+
bg: "colorPalette.subtle"
|
539
541
|
}
|
540
542
|
},
|
541
543
|
plain: {
|
@@ -543,6 +545,14 @@ var buttonRecipe = (0, import_react5.defineRecipe)({
|
|
543
545
|
}
|
544
546
|
}
|
545
547
|
},
|
548
|
+
compoundVariants: [
|
549
|
+
{
|
550
|
+
variant: "plain",
|
551
|
+
css: {
|
552
|
+
px: 0
|
553
|
+
}
|
554
|
+
}
|
555
|
+
],
|
546
556
|
defaultVariants: {
|
547
557
|
size: "md",
|
548
558
|
variant: "solid",
|
@@ -954,7 +964,14 @@ var inputRecipe = (0, import_react14.defineRecipe)({
|
|
954
964
|
bg: "transparent",
|
955
965
|
borderWidth: "1px",
|
956
966
|
borderColor: "border",
|
957
|
-
focusVisibleRing: "inside"
|
967
|
+
focusVisibleRing: "inside",
|
968
|
+
focusRingWidth: "0",
|
969
|
+
_hover: {
|
970
|
+
borderColor: "border.emphasized",
|
971
|
+
_focusVisible: {
|
972
|
+
borderColor: "var(--focus-ring-color)"
|
973
|
+
}
|
974
|
+
}
|
958
975
|
},
|
959
976
|
subtle: {
|
960
977
|
borderWidth: "1px",
|
@@ -1157,9 +1174,7 @@ var radiomarkRecipe = (0, import_react19.defineRecipe)({
|
|
1157
1174
|
borderRadius: "full",
|
1158
1175
|
cursor: "radio",
|
1159
1176
|
_focusVisible: {
|
1160
|
-
|
1161
|
-
outlineColor: "colorPalette.focusRing",
|
1162
|
-
outlineOffset: "2px"
|
1177
|
+
focusVisibleRing: "outside"
|
1163
1178
|
},
|
1164
1179
|
_invalid: {
|
1165
1180
|
colorPalette: "red",
|
@@ -1435,29 +1450,29 @@ var textareaRecipe = (0, import_react24.defineRecipe)({
|
|
1435
1450
|
borderRadius: "sm",
|
1436
1451
|
textStyle: "xs",
|
1437
1452
|
px: "2",
|
1438
|
-
py: "1
|
1439
|
-
scrollPaddingBottom: "1
|
1453
|
+
py: "1",
|
1454
|
+
scrollPaddingBottom: "1"
|
1440
1455
|
},
|
1441
1456
|
sm: {
|
1442
1457
|
borderRadius: "sm",
|
1443
1458
|
textStyle: "sm",
|
1444
1459
|
px: "2.5",
|
1445
|
-
py: "
|
1446
|
-
scrollPaddingBottom: "
|
1460
|
+
py: "1.5",
|
1461
|
+
scrollPaddingBottom: "1.5"
|
1447
1462
|
},
|
1448
1463
|
md: {
|
1449
1464
|
borderRadius: "md",
|
1450
1465
|
textStyle: "sm",
|
1451
1466
|
px: "3",
|
1452
|
-
py: "
|
1453
|
-
scrollPaddingBottom: "
|
1467
|
+
py: "1.5",
|
1468
|
+
scrollPaddingBottom: "1.5"
|
1454
1469
|
},
|
1455
1470
|
lg: {
|
1456
1471
|
borderRadius: "md",
|
1457
1472
|
textStyle: "md",
|
1458
1473
|
px: "4",
|
1459
|
-
py: "
|
1460
|
-
scrollPaddingBottom: "
|
1474
|
+
py: "2",
|
1475
|
+
scrollPaddingBottom: "2"
|
1461
1476
|
},
|
1462
1477
|
xl: {
|
1463
1478
|
borderRadius: "lg",
|
@@ -1472,7 +1487,8 @@ var textareaRecipe = (0, import_react24.defineRecipe)({
|
|
1472
1487
|
bg: "transparent",
|
1473
1488
|
borderWidth: "1px",
|
1474
1489
|
borderColor: "border",
|
1475
|
-
focusVisibleRing: "inside"
|
1490
|
+
focusVisibleRing: "inside",
|
1491
|
+
focusRingWidth: 0
|
1476
1492
|
},
|
1477
1493
|
subtle: {
|
1478
1494
|
borderWidth: "1px",
|
@@ -1547,7 +1563,7 @@ var semanticColors = import_react25.defineSemanticTokens.colors({
|
|
1547
1563
|
},
|
1548
1564
|
sidebar: {
|
1549
1565
|
bg: {
|
1550
|
-
value: { _light: "{colors.gray.
|
1566
|
+
value: { _light: "{colors.gray.100}", _dark: "{colors.gray.900}" }
|
1551
1567
|
},
|
1552
1568
|
fg: {
|
1553
1569
|
value: { _light: "{colors.gray.900}", _dark: "{colors.gray.200}" }
|
@@ -1557,7 +1573,7 @@ var semanticColors = import_react25.defineSemanticTokens.colors({
|
|
1557
1573
|
},
|
1558
1574
|
accent: {
|
1559
1575
|
bg: {
|
1560
|
-
value: { _light: "{colors.gray.200/
|
1576
|
+
value: { _light: "{colors.gray.200/80}", _dark: "{colors.gray.900}" }
|
1561
1577
|
},
|
1562
1578
|
fg: {
|
1563
1579
|
value: { _light: "{colors.gray.900}", _dark: "{colors.gray.200}" }
|
@@ -1654,9 +1670,6 @@ var semanticColors = import_react25.defineSemanticTokens.colors({
|
|
1654
1670
|
value: { _light: "{colors.blue.500}", _dark: "{colors.blue.400}" }
|
1655
1671
|
}
|
1656
1672
|
},
|
1657
|
-
focusRing: {
|
1658
|
-
value: { _light: "{colors.blue.600/50}", _dark: "{colors.blue.500/50}" }
|
1659
|
-
},
|
1660
1673
|
accent: {
|
1661
1674
|
contrast: {
|
1662
1675
|
value: { _light: "white", _dark: "white" }
|
@@ -2201,44 +2214,50 @@ var import_react27 = require("@chakra-ui/react");
|
|
2201
2214
|
var semanticShadows = import_react27.defineSemanticTokens.shadows({
|
2202
2215
|
xs: {
|
2203
2216
|
value: {
|
2204
|
-
|
2205
|
-
_dark: "0px 1px 1px {
|
2217
|
+
_light: "0px 1px 2px {colors.gray.900/10}, 0px 0px 1px {colors.gray.900/20}",
|
2218
|
+
_dark: "0px 1px 1px {black/64}, 0px 0px 1px inset {colors.gray.300/20}"
|
2206
2219
|
}
|
2207
2220
|
},
|
2208
2221
|
sm: {
|
2209
2222
|
value: {
|
2210
|
-
|
2211
|
-
_dark: "0px 2px 4px {
|
2223
|
+
_light: "0px 2px 4px {colors.gray.900/10}, 0px 0px 1px {colors.gray.900/30}",
|
2224
|
+
_dark: "0px 2px 4px {black/64}, 0px 0px 1px inset {colors.gray.300/30}"
|
2212
2225
|
}
|
2213
2226
|
},
|
2214
2227
|
md: {
|
2215
2228
|
value: {
|
2216
|
-
|
2217
|
-
_dark: "0px 4px 8px {
|
2229
|
+
_light: "0px 4px 8px {colors.gray.900/10}, 0px 0px 1px {colors.gray.900/30}",
|
2230
|
+
_dark: "0px 4px 8px {black/64}, 0px 0px 1px inset {colors.gray.300/30}"
|
2218
2231
|
}
|
2219
2232
|
},
|
2220
2233
|
lg: {
|
2221
2234
|
value: {
|
2222
|
-
|
2223
|
-
_dark: "0px 8px 16px {
|
2235
|
+
_light: "0px 8px 16px {colors.gray.900/10}, 0px 0px 1px {colors.gray.900/30}",
|
2236
|
+
_dark: "0px 8px 16px {black/64}, 0px 0px 1px inset {colors.gray.300/30}"
|
2224
2237
|
}
|
2225
2238
|
},
|
2226
2239
|
xl: {
|
2227
2240
|
value: {
|
2228
|
-
|
2229
|
-
_dark: "0px 16px 24px {
|
2241
|
+
_light: "0px 16px 24px {colors.gray.900/10}, 0px 0px 1px {colors.gray.900/30}",
|
2242
|
+
_dark: "0px 16px 24px {black/64}, 0px 0px 1px inset {colors.gray.300/30}"
|
2230
2243
|
}
|
2231
2244
|
},
|
2232
2245
|
"2xl": {
|
2233
2246
|
value: {
|
2234
|
-
|
2235
|
-
_dark: "0px 24px 40px {
|
2247
|
+
_light: "0px 24px 40px {colors.gray.900/16}, 0px 0px 1px {colors.gray.900/30}",
|
2248
|
+
_dark: "0px 24px 40px {black/64}, 0px 0px 1px inset {colors.gray.300/30}"
|
2249
|
+
}
|
2250
|
+
},
|
2251
|
+
inner: {
|
2252
|
+
value: {
|
2253
|
+
_light: "inset 0 2px 4px 0 {black/5}",
|
2254
|
+
_dark: "inset 0 2px 4px 0 black"
|
2236
2255
|
}
|
2237
2256
|
},
|
2238
2257
|
inset: {
|
2239
2258
|
value: {
|
2240
|
-
|
2241
|
-
_dark: "inset 0
|
2259
|
+
_light: "inset 0 1px 2px 0 {black/5}",
|
2260
|
+
_dark: "inset 0 1px 2px 0 {colors.gray.300/5}"
|
2242
2261
|
}
|
2243
2262
|
}
|
2244
2263
|
});
|
@@ -2270,7 +2289,7 @@ var appShellSlotRecipe = (0, import_react28.defineSlotRecipe)({
|
|
2270
2289
|
position: {
|
2271
2290
|
static: {
|
2272
2291
|
root: {
|
2273
|
-
height: "
|
2292
|
+
height: "100dvh"
|
2274
2293
|
}
|
2275
2294
|
},
|
2276
2295
|
fullscreen: {
|
@@ -2281,18 +2300,12 @@ var appShellSlotRecipe = (0, import_react28.defineSlotRecipe)({
|
|
2281
2300
|
}
|
2282
2301
|
},
|
2283
2302
|
variant: {
|
2284
|
-
plain: {}
|
2285
|
-
raised: {
|
2286
|
-
main: {
|
2287
|
-
boxShadow: "xs",
|
2288
|
-
zIndex: "layer-1"
|
2289
|
-
}
|
2290
|
-
}
|
2303
|
+
plain: {}
|
2291
2304
|
}
|
2292
2305
|
},
|
2293
2306
|
defaultVariants: {
|
2294
2307
|
position: "static",
|
2295
|
-
variant: "
|
2308
|
+
variant: "plain"
|
2296
2309
|
}
|
2297
2310
|
});
|
2298
2311
|
|
@@ -2303,7 +2316,6 @@ var gridListSlotRecipe = (0, import_react29.defineSlotRecipe)({
|
|
2303
2316
|
slots: ["root", "item", "header", "cell"],
|
2304
2317
|
base: {
|
2305
2318
|
root: {
|
2306
|
-
py: 2,
|
2307
2319
|
position: "relative"
|
2308
2320
|
},
|
2309
2321
|
item: {
|
@@ -2312,35 +2324,14 @@ var gridListSlotRecipe = (0, import_react29.defineSlotRecipe)({
|
|
2312
2324
|
alignItems: "center",
|
2313
2325
|
justifyContent: "space-between",
|
2314
2326
|
flex: 1,
|
2315
|
-
cursor: "pointer",
|
2316
2327
|
userSelect: "none",
|
2317
|
-
transitionProperty: "common",
|
2318
|
-
transitionDuration: "normal",
|
2319
2328
|
borderRadius: "inherit",
|
2320
2329
|
outline: "none",
|
2321
|
-
_hover: {
|
2322
|
-
bg: "blackAlpha.50",
|
2323
|
-
_dark: {
|
2324
|
-
bg: "whiteAlpha.50"
|
2325
|
-
}
|
2326
|
-
},
|
2327
2330
|
_focusVisible: {
|
2328
2331
|
boxShadow: "outline"
|
2329
2332
|
},
|
2330
|
-
_focus: {
|
2331
|
-
bg: "blackAlpha.50",
|
2332
|
-
_dark: {
|
2333
|
-
bg: "whiteAlpha.50"
|
2334
|
-
}
|
2335
|
-
},
|
2336
|
-
_active: {
|
2337
|
-
bg: "blackAlpha.100",
|
2338
|
-
_dark: {
|
2339
|
-
bg: "whiteAlpha.100"
|
2340
|
-
}
|
2341
|
-
},
|
2342
2333
|
_disabled: {
|
2343
|
-
cursor: "
|
2334
|
+
cursor: "disabled",
|
2344
2335
|
opacity: 0.5,
|
2345
2336
|
_hover: {
|
2346
2337
|
bg: "transparent",
|
@@ -2362,50 +2353,92 @@ var gridListSlotRecipe = (0, import_react29.defineSlotRecipe)({
|
|
2362
2353
|
position: "sticky",
|
2363
2354
|
fontSize: "md",
|
2364
2355
|
fontWeight: "semibold",
|
2365
|
-
color: "muted"
|
2356
|
+
color: "fg.muted"
|
2366
2357
|
},
|
2367
2358
|
cell: {
|
2368
|
-
display: "flex",
|
2369
2359
|
flexShrink: 0
|
2370
2360
|
}
|
2371
2361
|
},
|
2372
2362
|
variants: {
|
2363
|
+
interactive: {
|
2364
|
+
true: {
|
2365
|
+
item: {
|
2366
|
+
cursor: "button",
|
2367
|
+
transitionProperty: "bg",
|
2368
|
+
transitionDuration: "fast",
|
2369
|
+
_hover: {
|
2370
|
+
bg: "bg.subtle"
|
2371
|
+
},
|
2372
|
+
_active: {
|
2373
|
+
bg: "bg.subtle"
|
2374
|
+
}
|
2375
|
+
}
|
2376
|
+
}
|
2377
|
+
},
|
2378
|
+
variant: {
|
2379
|
+
simple: {},
|
2380
|
+
rounded: {
|
2381
|
+
item: {
|
2382
|
+
borderRadius: "md",
|
2383
|
+
mb: 0.5
|
2384
|
+
}
|
2385
|
+
}
|
2386
|
+
},
|
2373
2387
|
size: {
|
2374
2388
|
sm: {
|
2375
2389
|
root: {
|
2376
|
-
|
2390
|
+
textStyle: "sm",
|
2391
|
+
py: 0.5
|
2377
2392
|
},
|
2378
2393
|
item: {
|
2379
2394
|
py: 1,
|
2380
|
-
px:
|
2395
|
+
px: 2,
|
2396
|
+
gap: 1
|
2381
2397
|
},
|
2382
2398
|
header: {
|
2383
2399
|
py: 1,
|
2384
|
-
px:
|
2385
|
-
},
|
2386
|
-
cell: {
|
2387
|
-
px: 1
|
2400
|
+
px: 2
|
2388
2401
|
}
|
2389
2402
|
},
|
2390
2403
|
md: {
|
2391
2404
|
root: {
|
2392
|
-
|
2405
|
+
textStyle: "md",
|
2406
|
+
py: 1
|
2393
2407
|
},
|
2394
2408
|
item: {
|
2395
2409
|
py: 2,
|
2396
|
-
px:
|
2410
|
+
px: 3,
|
2411
|
+
gap: 2
|
2397
2412
|
},
|
2398
2413
|
header: {
|
2399
2414
|
py: 2,
|
2400
|
-
px:
|
2401
|
-
},
|
2402
|
-
cell: {
|
2403
|
-
px: 2
|
2415
|
+
px: 3
|
2404
2416
|
}
|
2405
2417
|
}
|
2406
2418
|
}
|
2407
2419
|
},
|
2420
|
+
compoundVariants: [
|
2421
|
+
{
|
2422
|
+
variant: "rounded",
|
2423
|
+
size: "sm",
|
2424
|
+
css: {
|
2425
|
+
root: {
|
2426
|
+
p: 1
|
2427
|
+
}
|
2428
|
+
}
|
2429
|
+
},
|
2430
|
+
{
|
2431
|
+
variant: "rounded",
|
2432
|
+
size: "md",
|
2433
|
+
css: {
|
2434
|
+
root: {
|
2435
|
+
p: 2
|
2436
|
+
}
|
2437
|
+
}
|
2438
|
+
}
|
2439
|
+
],
|
2408
2440
|
defaultVariants: {
|
2441
|
+
variant: "simple",
|
2409
2442
|
size: "md"
|
2410
2443
|
}
|
2411
2444
|
});
|
@@ -2488,7 +2521,7 @@ var navbarSlotRecipe = (0, import_react31.defineSlotRecipe)({
|
|
2488
2521
|
top: 0,
|
2489
2522
|
insetX: 0,
|
2490
2523
|
transitionProperty: "common",
|
2491
|
-
transitionDuration: "
|
2524
|
+
transitionDuration: "moderate",
|
2492
2525
|
transitionTimingFunction: "ease-in-out",
|
2493
2526
|
_hidden: {
|
2494
2527
|
transform: "translateY(-100%)"
|
@@ -2524,7 +2557,7 @@ var navbarSlotRecipe = (0, import_react31.defineSlotRecipe)({
|
|
2524
2557
|
boxSizing: "border-box",
|
2525
2558
|
borderRadius: "md",
|
2526
2559
|
transitionProperty: "common",
|
2527
|
-
transitionDuration: "
|
2560
|
+
transitionDuration: "moderate",
|
2528
2561
|
lineHeight: 1,
|
2529
2562
|
_focusVisible: {
|
2530
2563
|
outline: "none",
|
@@ -2588,7 +2621,8 @@ var baseStyleLabel = (0, import_react32.defineStyle)({
|
|
2588
2621
|
overflow: "hidden",
|
2589
2622
|
whiteSpace: "nowrap",
|
2590
2623
|
textOverflow: "ellipsis",
|
2591
|
-
minW: 0
|
2624
|
+
minW: 0,
|
2625
|
+
color: "fg"
|
2592
2626
|
});
|
2593
2627
|
var personaSlotRecipe = (0, import_react32.defineSlotRecipe)({
|
2594
2628
|
className: "sui-persona",
|
@@ -2631,11 +2665,11 @@ var personaSlotRecipe = (0, import_react32.defineSlotRecipe)({
|
|
2631
2665
|
label: baseStyleLabel,
|
2632
2666
|
secondaryLabel: {
|
2633
2667
|
...baseStyleLabel,
|
2634
|
-
color: "fg
|
2668
|
+
color: "fg/60"
|
2635
2669
|
},
|
2636
2670
|
tertiaryLabel: {
|
2637
2671
|
...baseStyleLabel,
|
2638
|
-
color: "fg
|
2672
|
+
color: "fg/60"
|
2639
2673
|
}
|
2640
2674
|
},
|
2641
2675
|
variants: {
|
@@ -2712,7 +2746,8 @@ var sidebarNavItemSlotRecipe = (0, import_react33.defineSlotRecipe)({
|
|
2712
2746
|
cursor: "button",
|
2713
2747
|
transitionProperty: "common",
|
2714
2748
|
transitionDuration: "fast",
|
2715
|
-
focusVisibleRing: "
|
2749
|
+
focusVisibleRing: "inside",
|
2750
|
+
focusRingWidth: "1px",
|
2716
2751
|
"& > svg": {
|
2717
2752
|
boxSize: 4,
|
2718
2753
|
color: "var(--sidebar-item-icon-color)"
|
@@ -2724,7 +2759,12 @@ var sidebarNavItemSlotRecipe = (0, import_react33.defineSlotRecipe)({
|
|
2724
2759
|
endElement: {
|
2725
2760
|
display: "flex",
|
2726
2761
|
gap: "1px",
|
2727
|
-
ms: "auto"
|
2762
|
+
ms: "auto",
|
2763
|
+
"& button": {
|
2764
|
+
_hover: {
|
2765
|
+
bg: "transparent"
|
2766
|
+
}
|
2767
|
+
}
|
2728
2768
|
}
|
2729
2769
|
},
|
2730
2770
|
variants: {
|
@@ -2868,7 +2908,10 @@ var sidebarSlotRecipe = (0, import_react34.defineSlotRecipe)({
|
|
2868
2908
|
},
|
2869
2909
|
groupEndElement: {
|
2870
2910
|
"& > button": {
|
2871
|
-
boxSize: 6
|
2911
|
+
boxSize: 6,
|
2912
|
+
_hover: {
|
2913
|
+
bg: "transparent"
|
2914
|
+
}
|
2872
2915
|
}
|
2873
2916
|
},
|
2874
2917
|
groupContent: {
|
@@ -2979,11 +3022,6 @@ var sidebarSlotRecipe = (0, import_react34.defineSlotRecipe)({
|
|
2979
3022
|
},
|
2980
3023
|
compact: {}
|
2981
3024
|
},
|
2982
|
-
variant: {
|
2983
|
-
muted: {},
|
2984
|
-
solid: {},
|
2985
|
-
subtle: {}
|
2986
|
-
},
|
2987
3025
|
size: {
|
2988
3026
|
md: {
|
2989
3027
|
header: {
|
@@ -3003,7 +3041,6 @@ var sidebarSlotRecipe = (0, import_react34.defineSlotRecipe)({
|
|
3003
3041
|
},
|
3004
3042
|
defaultVariants: {
|
3005
3043
|
mode: "collapsible",
|
3006
|
-
variant: "muted",
|
3007
3044
|
size: "md"
|
3008
3045
|
}
|
3009
3046
|
});
|
@@ -3671,7 +3708,7 @@ var cardSlotRecipe = (0, import_react41.defineSlotRecipe)({
|
|
3671
3708
|
position: "relative",
|
3672
3709
|
minWidth: "0",
|
3673
3710
|
wordWrap: "break-word",
|
3674
|
-
borderRadius: "
|
3711
|
+
borderRadius: "lg",
|
3675
3712
|
color: "fg",
|
3676
3713
|
textAlign: "start"
|
3677
3714
|
},
|
@@ -3683,14 +3720,15 @@ var cardSlotRecipe = (0, import_react41.defineSlotRecipe)({
|
|
3683
3720
|
fontSize: "sm"
|
3684
3721
|
},
|
3685
3722
|
header: {
|
3686
|
-
|
3687
|
-
|
3723
|
+
padding: "var(--card-padding)",
|
3724
|
+
paddingBlock: "calc(var(--card-padding) / 1.5)",
|
3688
3725
|
display: "flex",
|
3689
3726
|
flexDirection: "column",
|
3690
3727
|
gap: "1.5"
|
3691
3728
|
},
|
3692
3729
|
body: {
|
3693
3730
|
padding: "var(--card-padding)",
|
3731
|
+
paddingBlock: "calc(var(--card-padding) / 1.5)",
|
3694
3732
|
flex: "1",
|
3695
3733
|
display: "flex",
|
3696
3734
|
flexDirection: "column"
|
@@ -3699,15 +3737,15 @@ var cardSlotRecipe = (0, import_react41.defineSlotRecipe)({
|
|
3699
3737
|
display: "flex",
|
3700
3738
|
alignItems: "center",
|
3701
3739
|
gap: "2",
|
3702
|
-
|
3703
|
-
|
3740
|
+
padding: "var(--card-padding)",
|
3741
|
+
paddingBlock: "calc(var(--card-padding) / 1.5)"
|
3704
3742
|
}
|
3705
3743
|
},
|
3706
3744
|
variants: {
|
3707
3745
|
size: {
|
3708
3746
|
sm: {
|
3709
3747
|
root: {
|
3710
|
-
"--card-padding": "spacing.
|
3748
|
+
"--card-padding": "spacing.2"
|
3711
3749
|
},
|
3712
3750
|
title: {
|
3713
3751
|
textStyle: "md"
|
@@ -3715,7 +3753,7 @@ var cardSlotRecipe = (0, import_react41.defineSlotRecipe)({
|
|
3715
3753
|
},
|
3716
3754
|
md: {
|
3717
3755
|
root: {
|
3718
|
-
"--card-padding": "spacing.
|
3756
|
+
"--card-padding": "spacing.3"
|
3719
3757
|
},
|
3720
3758
|
title: {
|
3721
3759
|
textStyle: "lg"
|
@@ -3723,7 +3761,7 @@ var cardSlotRecipe = (0, import_react41.defineSlotRecipe)({
|
|
3723
3761
|
},
|
3724
3762
|
lg: {
|
3725
3763
|
root: {
|
3726
|
-
"--card-padding": "spacing.
|
3764
|
+
"--card-padding": "spacing.6"
|
3727
3765
|
},
|
3728
3766
|
title: {
|
3729
3767
|
textStyle: "xl"
|
@@ -3734,19 +3772,41 @@ var cardSlotRecipe = (0, import_react41.defineSlotRecipe)({
|
|
3734
3772
|
elevated: {
|
3735
3773
|
root: {
|
3736
3774
|
bg: "bg.panel",
|
3737
|
-
boxShadow: "md"
|
3775
|
+
boxShadow: "md",
|
3776
|
+
borderWidth: "0.5px",
|
3777
|
+
borderColor: "border",
|
3778
|
+
_pressable: {
|
3779
|
+
transitionProperty: "common",
|
3780
|
+
transitionDuration: "fast",
|
3781
|
+
_hover: {
|
3782
|
+
borderColor: "border.emphasized"
|
3783
|
+
}
|
3784
|
+
}
|
3738
3785
|
}
|
3739
3786
|
},
|
3740
3787
|
outline: {
|
3741
3788
|
root: {
|
3742
3789
|
bg: "bg.panel",
|
3743
3790
|
borderWidth: "1px",
|
3744
|
-
borderColor: "border"
|
3791
|
+
borderColor: "border",
|
3792
|
+
_pressable: {
|
3793
|
+
transitionProperty: "common",
|
3794
|
+
transitionDuration: "fast",
|
3795
|
+
_hover: {
|
3796
|
+
borderColor: "border.emphasized"
|
3797
|
+
}
|
3798
|
+
}
|
3745
3799
|
}
|
3746
3800
|
},
|
3747
3801
|
subtle: {
|
3748
3802
|
root: {
|
3749
|
-
bg: "
|
3803
|
+
bg: "colorPalette.muted"
|
3804
|
+
}
|
3805
|
+
},
|
3806
|
+
solid: {
|
3807
|
+
root: {
|
3808
|
+
bg: "colorPalette.solid",
|
3809
|
+
color: "colorPalette.contrast"
|
3750
3810
|
}
|
3751
3811
|
}
|
3752
3812
|
}
|
@@ -4033,14 +4093,14 @@ var collapsibleSlotRecipe = (0, import_react44.defineSlotRecipe)({
|
|
4033
4093
|
className: "chakra-collapsible",
|
4034
4094
|
base: {
|
4035
4095
|
content: {
|
4036
|
-
overflow: "hidden",
|
4037
4096
|
_open: {
|
4038
4097
|
animationName: "expand-height, fade-in",
|
4039
4098
|
animationDuration: "moderate"
|
4040
4099
|
},
|
4041
4100
|
_closed: {
|
4042
4101
|
animationName: "collapse-height, fade-out",
|
4043
|
-
animationDuration: "moderate"
|
4102
|
+
animationDuration: "moderate",
|
4103
|
+
overflow: "hidden"
|
4044
4104
|
}
|
4045
4105
|
}
|
4046
4106
|
}
|
@@ -4570,7 +4630,7 @@ var editableSlotRecipe = (0, import_react48.defineSlotRecipe)({
|
|
4570
4630
|
display: "inline-flex",
|
4571
4631
|
alignItems: "center",
|
4572
4632
|
transitionProperty: "common",
|
4573
|
-
transitionDuration: "
|
4633
|
+
transitionDuration: "moderate",
|
4574
4634
|
cursor: "text",
|
4575
4635
|
_hover: {
|
4576
4636
|
bg: "bg.muted"
|
@@ -4585,7 +4645,7 @@ var editableSlotRecipe = (0, import_react48.defineSlotRecipe)({
|
|
4585
4645
|
py: "1",
|
4586
4646
|
px: "1",
|
4587
4647
|
transitionProperty: "common",
|
4588
|
-
transitionDuration: "
|
4648
|
+
transitionDuration: "moderate",
|
4589
4649
|
width: "full",
|
4590
4650
|
focusVisibleRing: "inside",
|
4591
4651
|
focusRingWidth: "2px",
|
@@ -4635,7 +4695,12 @@ var emptyStateSlotRecipe = (0, import_react49.defineSlotRecipe)({
|
|
4635
4695
|
className: "chakra-empty-state",
|
4636
4696
|
base: {
|
4637
4697
|
root: {
|
4638
|
-
width: "full"
|
4698
|
+
width: "full",
|
4699
|
+
height: "full",
|
4700
|
+
display: "flex",
|
4701
|
+
flexDirection: "column",
|
4702
|
+
alignItems: "center",
|
4703
|
+
justifyContent: "center"
|
4639
4704
|
},
|
4640
4705
|
content: {
|
4641
4706
|
display: "flex",
|
@@ -4766,12 +4831,21 @@ var fieldSlotRecipe = (0, import_react50.defineSlotRecipe)({
|
|
4766
4831
|
},
|
4767
4832
|
horizontal: {
|
4768
4833
|
root: {
|
4769
|
-
|
4834
|
+
display: "grid",
|
4835
|
+
gridTemplateColumns: "var(--field-label-width, 8rem) 1fr",
|
4770
4836
|
alignItems: "center",
|
4771
|
-
|
4837
|
+
"&:has(textarea)": {
|
4838
|
+
alignItems: "flex-start",
|
4839
|
+
"& label": {
|
4840
|
+
pt: 1.5
|
4841
|
+
}
|
4842
|
+
}
|
4772
4843
|
},
|
4773
|
-
|
4774
|
-
|
4844
|
+
helperText: {
|
4845
|
+
gridColumn: 2
|
4846
|
+
},
|
4847
|
+
errorText: {
|
4848
|
+
gridColumn: 2
|
4775
4849
|
}
|
4776
4850
|
}
|
4777
4851
|
}
|
@@ -5158,6 +5232,7 @@ var selectSlotRecipe = (0, import_react55.defineSlotRecipe)({
|
|
5158
5232
|
userSelect: "none",
|
5159
5233
|
textAlign: "start",
|
5160
5234
|
focusVisibleRing: "inside",
|
5235
|
+
focusRingWidth: 0,
|
5161
5236
|
_placeholderShown: {
|
5162
5237
|
color: "fg.muted"
|
5163
5238
|
},
|
@@ -5166,6 +5241,12 @@ var selectSlotRecipe = (0, import_react55.defineSlotRecipe)({
|
|
5166
5241
|
},
|
5167
5242
|
_invalid: {
|
5168
5243
|
borderColor: "border.error"
|
5244
|
+
},
|
5245
|
+
_hover: {
|
5246
|
+
borderColor: "border.emphasized",
|
5247
|
+
_focusVisible: {
|
5248
|
+
borderColor: "var(--focus-ring-color)"
|
5249
|
+
}
|
5169
5250
|
}
|
5170
5251
|
},
|
5171
5252
|
indicatorGroup: {
|
@@ -5600,7 +5681,8 @@ var numberInputSlotRecipe = (0, import_react57.defineSlotRecipe)({
|
|
5600
5681
|
root: {
|
5601
5682
|
position: "relative",
|
5602
5683
|
zIndex: "0",
|
5603
|
-
isolation: "isolate"
|
5684
|
+
isolation: "isolate",
|
5685
|
+
width: "full"
|
5604
5686
|
},
|
5605
5687
|
input: {
|
5606
5688
|
...inputRecipe.base,
|
@@ -6377,15 +6459,16 @@ var segmentGroupSlotRecipe = (0, import_react65.defineSlotRecipe)({
|
|
6377
6459
|
slots: import_anatomy31.segmentGroupAnatomy.keys(),
|
6378
6460
|
base: {
|
6379
6461
|
root: {
|
6380
|
-
"--segment-radius": "radii.
|
6381
|
-
borderRadius: "
|
6462
|
+
"--segment-radius": "radii.md",
|
6463
|
+
borderRadius: "md",
|
6382
6464
|
display: "inline-flex",
|
6383
6465
|
boxShadow: "inset",
|
6384
6466
|
minW: "max-content",
|
6385
6467
|
textAlign: "center",
|
6386
6468
|
position: "relative",
|
6387
6469
|
isolation: "isolate",
|
6388
|
-
bg: "bg.muted"
|
6470
|
+
bg: "bg.muted",
|
6471
|
+
borderWidth: "1px"
|
6389
6472
|
},
|
6390
6473
|
item: {
|
6391
6474
|
display: "flex",
|
@@ -6393,23 +6476,31 @@ var segmentGroupSlotRecipe = (0, import_react65.defineSlotRecipe)({
|
|
6393
6476
|
userSelect: "none",
|
6394
6477
|
fontSize: "sm",
|
6395
6478
|
position: "relative",
|
6396
|
-
color: "fg",
|
6479
|
+
color: "fg.subtle",
|
6480
|
+
cursor: "button",
|
6397
6481
|
borderRadius: "var(--segment-radius)",
|
6398
6482
|
_disabled: {
|
6399
6483
|
opacity: "0.5"
|
6400
6484
|
},
|
6485
|
+
_hover: {
|
6486
|
+
color: "fg"
|
6487
|
+
},
|
6401
6488
|
"&:has(input:focus-visible)": {
|
6402
|
-
focusRing: "
|
6489
|
+
focusRing: "inside",
|
6490
|
+
focusRingWidth: "1px"
|
6403
6491
|
},
|
6404
6492
|
_before: {
|
6405
6493
|
content: '""',
|
6406
6494
|
position: "absolute",
|
6407
6495
|
insetInlineStart: 0,
|
6408
|
-
insetBlock: "
|
6496
|
+
insetBlock: "0",
|
6409
6497
|
bg: "border",
|
6410
6498
|
width: "1px",
|
6411
6499
|
transition: "opacity 0.2s"
|
6412
6500
|
},
|
6501
|
+
_checked: {
|
6502
|
+
color: "fg"
|
6503
|
+
},
|
6413
6504
|
"& + &[data-state=checked], &[data-state=checked] + &, &:first-of-type": {
|
6414
6505
|
_before: {
|
6415
6506
|
opacity: "0"
|
@@ -6418,13 +6509,17 @@ var segmentGroupSlotRecipe = (0, import_react65.defineSlotRecipe)({
|
|
6418
6509
|
"&[data-state=checked][data-ssr]": {
|
6419
6510
|
shadow: "sm",
|
6420
6511
|
bg: "bg",
|
6512
|
+
color: "fg",
|
6421
6513
|
borderRadius: "var(--segment-radius)"
|
6422
6514
|
}
|
6423
6515
|
},
|
6424
6516
|
indicator: {
|
6425
6517
|
shadow: "sm",
|
6426
6518
|
pos: "absolute",
|
6427
|
-
bg: {
|
6519
|
+
bg: {
|
6520
|
+
base: "bg",
|
6521
|
+
_dark: "bg.emphasized"
|
6522
|
+
},
|
6428
6523
|
width: "var(--width)",
|
6429
6524
|
height: "var(--height)",
|
6430
6525
|
top: "var(--top)",
|
@@ -6447,7 +6542,7 @@ var segmentGroupSlotRecipe = (0, import_react65.defineSlotRecipe)({
|
|
6447
6542
|
},
|
6448
6543
|
sm: {
|
6449
6544
|
root: {
|
6450
|
-
height: "
|
6545
|
+
height: "7"
|
6451
6546
|
},
|
6452
6547
|
item: {
|
6453
6548
|
textStyle: "sm",
|
@@ -6457,7 +6552,7 @@ var segmentGroupSlotRecipe = (0, import_react65.defineSlotRecipe)({
|
|
6457
6552
|
},
|
6458
6553
|
md: {
|
6459
6554
|
root: {
|
6460
|
-
height: "
|
6555
|
+
height: "8"
|
6461
6556
|
},
|
6462
6557
|
item: {
|
6463
6558
|
textStyle: "sm",
|
@@ -7056,9 +7151,7 @@ var switchSlotRecipe = (0, import_react70.defineSlotRecipe)({
|
|
7056
7151
|
cursor: "not-allowed"
|
7057
7152
|
},
|
7058
7153
|
_invalid: {
|
7059
|
-
|
7060
|
-
outlineColor: "border.error",
|
7061
|
-
outlineOffset: "2px"
|
7154
|
+
focusRingColor: "border.error"
|
7062
7155
|
}
|
7063
7156
|
},
|
7064
7157
|
thumb: {
|
@@ -7363,8 +7456,7 @@ var tabsSlotRecipe = (0, import_react72.defineSlotRecipe)({
|
|
7363
7456
|
gap: "2",
|
7364
7457
|
_focusVisible: {
|
7365
7458
|
zIndex: 1,
|
7366
|
-
|
7367
|
-
outlineColor: "colorPalette.focusRing"
|
7459
|
+
focusVisibleRing: "outside"
|
7368
7460
|
},
|
7369
7461
|
_disabled: {
|
7370
7462
|
cursor: "not-allowed",
|
@@ -8893,12 +8985,67 @@ var zIndices = import_react95.defineTokens.zIndex({
|
|
8893
8985
|
max: { value: 2147483647 }
|
8894
8986
|
});
|
8895
8987
|
|
8988
|
+
// src/theme/utilities.ts
|
8989
|
+
var createFocusRing = (selector) => {
|
8990
|
+
return {
|
8991
|
+
values: ["outside", "inside", "mixed", "none"],
|
8992
|
+
transform(value, { token }) {
|
8993
|
+
var _a8;
|
8994
|
+
const focusRingColor = token("colors.colorPalette.focusRing");
|
8995
|
+
const styles = {
|
8996
|
+
inside: {
|
8997
|
+
"--focus-ring-color": focusRingColor,
|
8998
|
+
[selector]: {
|
8999
|
+
outlineOffset: "0px",
|
9000
|
+
outlineWidth: "var(--focus-ring-width, 0)",
|
9001
|
+
outlineColor: "var(--focus-ring-color)",
|
9002
|
+
outlineStyle: "var(--focus-ring-style, solid)",
|
9003
|
+
borderColor: "var(--focus-ring-color)"
|
9004
|
+
}
|
9005
|
+
},
|
9006
|
+
outside: {
|
9007
|
+
"--focus-ring-color": focusRingColor,
|
9008
|
+
[selector]: {
|
9009
|
+
outlineWidth: "var(--focus-ring-width, 1px)",
|
9010
|
+
outlineOffset: "var(--focus-ring-offset, 2px)",
|
9011
|
+
outlineStyle: "var(--focus-ring-style, solid)",
|
9012
|
+
outlineColor: "var(--focus-ring-color)"
|
9013
|
+
}
|
9014
|
+
},
|
9015
|
+
mixed: {
|
9016
|
+
"--focus-ring-color": focusRingColor,
|
9017
|
+
[selector]: {
|
9018
|
+
outlineWidth: "var(--focus-ring-width, 3px)",
|
9019
|
+
outlineStyle: "var(--focus-ring-style, solid)",
|
9020
|
+
outlineColor: "color-mix(in srgb, var(--focus-ring-color), transparent 60%)",
|
9021
|
+
borderColor: "var(--focus-ring-color)"
|
9022
|
+
}
|
9023
|
+
},
|
9024
|
+
none: {
|
9025
|
+
"--focus-ring-color": focusRingColor,
|
9026
|
+
[selector]: {
|
9027
|
+
outline: "none"
|
9028
|
+
}
|
9029
|
+
}
|
9030
|
+
};
|
9031
|
+
return (_a8 = styles[value]) != null ? _a8 : {};
|
9032
|
+
}
|
9033
|
+
};
|
9034
|
+
};
|
9035
|
+
var utilities = {
|
9036
|
+
focusRing: createFocusRing("&:is(:focus, [data-focus])"),
|
9037
|
+
focusVisibleRing: createFocusRing(
|
9038
|
+
"&:is(:focus-visible, [data-focus-visible])"
|
9039
|
+
)
|
9040
|
+
};
|
9041
|
+
|
8896
9042
|
// src/theme/index.ts
|
8897
9043
|
var defaultThemeConfig = (0, import_react96.defineConfig)({
|
8898
9044
|
preflight: true,
|
8899
9045
|
cssVarsPrefix: "chakra",
|
8900
9046
|
cssVarsRoot: ":where(html, .chakra-theme)",
|
8901
9047
|
globalCss,
|
9048
|
+
utilities,
|
8902
9049
|
theme: {
|
8903
9050
|
breakpoints,
|
8904
9051
|
keyframes,
|
@@ -8937,10 +9084,15 @@ var defaultThemeConfig = (0, import_react96.defineConfig)({
|
|
8937
9084
|
|
8938
9085
|
// src/preset.ts
|
8939
9086
|
var defaultConfig = (0, import_react97.mergeConfigs)(import_react97.defaultBaseConfig, defaultThemeConfig);
|
9087
|
+
var _a7;
|
9088
|
+
defaultConfig.utilities = Object.assign(
|
9089
|
+
(_a7 = defaultConfig.utilities) != null ? _a7 : {},
|
9090
|
+
utilities
|
9091
|
+
);
|
8940
9092
|
var defaultSystem = (0, import_react97.createSystem)(defaultConfig);
|
8941
9093
|
|
8942
9094
|
// src/index.ts
|
8943
|
-
var
|
9095
|
+
var import_react164 = require("@chakra-ui/react");
|
8944
9096
|
|
8945
9097
|
// src/provider/sui-provider.tsx
|
8946
9098
|
var React = __toESM(require("react"), 1);
|
@@ -9237,8 +9389,8 @@ var EllipsisIcon = createIcon({
|
|
9237
9389
|
var import_jsx_runtime8 = require("react/jsx-runtime");
|
9238
9390
|
var CloseButton = (0, import_react111.forwardRef)(
|
9239
9391
|
function CloseButton2(props, ref) {
|
9240
|
-
var
|
9241
|
-
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react112.IconButton, { variant: "ghost", "aria-label": "Close", ref, ...props, children: (
|
9392
|
+
var _a8;
|
9393
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react112.IconButton, { variant: "ghost", "aria-label": "Close", ref, ...props, children: (_a8 = props.children) != null ? _a8 : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CloseIcon, {}) });
|
9242
9394
|
}
|
9243
9395
|
);
|
9244
9396
|
|
@@ -9466,11 +9618,14 @@ var IconBadge = React2.forwardRef(
|
|
9466
9618
|
}
|
9467
9619
|
);
|
9468
9620
|
|
9621
|
+
// src/components/icon-button/index.ts
|
9622
|
+
var import_react123 = require("@chakra-ui/react");
|
9623
|
+
|
9469
9624
|
// src/components/input-group/input-group.tsx
|
9470
|
-
var
|
9471
|
-
var
|
9625
|
+
var import_react124 = require("react");
|
9626
|
+
var import_react125 = require("@chakra-ui/react");
|
9472
9627
|
var import_jsx_runtime14 = require("react/jsx-runtime");
|
9473
|
-
var InputGroup = (0,
|
9628
|
+
var InputGroup = (0, import_react124.forwardRef)(
|
9474
9629
|
function InputGroup2(props, ref) {
|
9475
9630
|
const {
|
9476
9631
|
startElement,
|
@@ -9480,26 +9635,26 @@ var InputGroup = (0, import_react123.forwardRef)(
|
|
9480
9635
|
children,
|
9481
9636
|
...rest
|
9482
9637
|
} = props;
|
9483
|
-
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
|
9484
|
-
startElement && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
9485
|
-
(0,
|
9638
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react125.Group, { ref, display: "flex", ...rest, children: [
|
9639
|
+
startElement && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react125.InputElement, { pointerEvents: "none", ...startElementProps, children: startElement }),
|
9640
|
+
(0, import_react124.isValidElement)(children) && (0, import_react124.cloneElement)(children, {
|
9486
9641
|
...startElement && { ps: "calc(var(--input-height) - 6px)" },
|
9487
9642
|
...endElement && { pe: "calc(var(--input-height) - 6px)" },
|
9488
9643
|
...children.props
|
9489
9644
|
}),
|
9490
|
-
endElement && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
9645
|
+
endElement && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react125.InputElement, { placement: "end", ...endElementProps, children: endElement })
|
9491
9646
|
] });
|
9492
9647
|
}
|
9493
9648
|
);
|
9494
9649
|
|
9495
9650
|
// src/components/link/link.tsx
|
9496
|
-
var
|
9497
|
-
var
|
9651
|
+
var import_react126 = __toESM(require("react"), 1);
|
9652
|
+
var import_react127 = require("@chakra-ui/react");
|
9498
9653
|
var import_jsx_runtime15 = require("react/jsx-runtime");
|
9499
|
-
var Link =
|
9654
|
+
var Link = import_react126.default.forwardRef(
|
9500
9655
|
(props, ref) => {
|
9501
9656
|
const LinkComponent = useLink();
|
9502
|
-
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
9657
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react127.Link, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(LinkComponent, { ref, ...props }) });
|
9503
9658
|
}
|
9504
9659
|
);
|
9505
9660
|
Link.displayName = "Link";
|
@@ -9512,29 +9667,29 @@ __export(loading_overlay_exports, {
|
|
9512
9667
|
Text: () => LoadingOverlayText
|
9513
9668
|
});
|
9514
9669
|
var import_presence = require("@ark-ui/react/presence");
|
9515
|
-
var
|
9670
|
+
var import_react131 = require("@chakra-ui/react");
|
9516
9671
|
|
9517
9672
|
// src/components/spinner/spinner.tsx
|
9518
|
-
var
|
9519
|
-
var
|
9673
|
+
var import_react128 = require("react");
|
9674
|
+
var import_react129 = require("@chakra-ui/react");
|
9520
9675
|
var import_jsx_runtime16 = require("react/jsx-runtime");
|
9521
|
-
var Spinner2 = (0,
|
9676
|
+
var Spinner2 = (0, import_react128.forwardRef)(
|
9522
9677
|
function Spinner3(props, ref) {
|
9523
9678
|
const { loading, children, ...rest } = props;
|
9524
9679
|
if (loading === false) {
|
9525
9680
|
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_jsx_runtime16.Fragment, { children });
|
9526
9681
|
}
|
9527
|
-
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
9682
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react129.Spinner, { ref, ...rest });
|
9528
9683
|
}
|
9529
9684
|
);
|
9530
9685
|
|
9531
9686
|
// src/components/loading-overlay/loading-overlay.context.ts
|
9532
|
-
var
|
9687
|
+
var import_react130 = require("@chakra-ui/react");
|
9533
9688
|
var {
|
9534
9689
|
useStyles: useLoadingOverlayStyles,
|
9535
9690
|
withContext: withContext4,
|
9536
9691
|
withProvider: withProvider3
|
9537
|
-
} = (0,
|
9692
|
+
} = (0, import_react130.createSlotRecipeContext)({
|
9538
9693
|
key: "suiLoadingOverlay"
|
9539
9694
|
});
|
9540
9695
|
|
@@ -9543,7 +9698,7 @@ var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
9543
9698
|
var LoadingOverlay = (props) => {
|
9544
9699
|
const { children, loading = true, ...rest } = props;
|
9545
9700
|
const [presenceProps, rootProps] = (0, import_presence.splitPresenceProps)(rest);
|
9546
|
-
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_presence.Presence, { present: loading, ...presenceProps, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
9701
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_presence.Presence, { present: loading, ...presenceProps, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react131.chakra.div, { ...rootProps, children }) });
|
9547
9702
|
};
|
9548
9703
|
var LoadingOverlayRoot = withProvider3(
|
9549
9704
|
LoadingOverlay,
|
@@ -9565,16 +9720,16 @@ __export(navbar_exports, {
|
|
9565
9720
|
Link: () => NavbarLink,
|
9566
9721
|
Root: () => NavbarRoot
|
9567
9722
|
});
|
9568
|
-
var
|
9723
|
+
var import_react133 = require("react");
|
9569
9724
|
var import_navbar = require("@saas-ui/core/navbar");
|
9570
9725
|
|
9571
9726
|
// src/components/navbar/navbar.context.ts
|
9572
|
-
var
|
9727
|
+
var import_react132 = require("@chakra-ui/react");
|
9573
9728
|
var {
|
9574
9729
|
withProvider: withProvider4,
|
9575
9730
|
withContext: withContext5,
|
9576
9731
|
useStyles: useNavbarStyles
|
9577
|
-
} = (0,
|
9732
|
+
} = (0, import_react132.createSlotRecipeContext)({
|
9578
9733
|
key: "suiNavbar"
|
9579
9734
|
});
|
9580
9735
|
|
@@ -9597,7 +9752,7 @@ var NavbarItem = withContext5(
|
|
9597
9752
|
"item"
|
9598
9753
|
);
|
9599
9754
|
var NavbarLink = withContext5(
|
9600
|
-
(0,
|
9755
|
+
(0, import_react133.forwardRef)((props, ref) => {
|
9601
9756
|
const Link2 = useLink();
|
9602
9757
|
const { active, ...rest } = props;
|
9603
9758
|
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_navbar.Navbar.Link, { asChild: true, ...rest, ref, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Link2, { "data-active": active ? "" : void 0, ...props }) });
|
@@ -9609,10 +9764,10 @@ var NavbarLink = withContext5(
|
|
9609
9764
|
);
|
9610
9765
|
|
9611
9766
|
// src/components/number-input/number-input.tsx
|
9612
|
-
var
|
9613
|
-
var
|
9767
|
+
var import_react134 = require("react");
|
9768
|
+
var import_react135 = require("@chakra-ui/react");
|
9614
9769
|
var import_jsx_runtime19 = require("react/jsx-runtime");
|
9615
|
-
var NumberInput = (0,
|
9770
|
+
var NumberInput = (0, import_react134.forwardRef)(
|
9616
9771
|
function NumberInput2(props, ref) {
|
9617
9772
|
const {
|
9618
9773
|
hideControls,
|
@@ -9622,11 +9777,19 @@ var NumberInput = (0, import_react133.forwardRef)(
|
|
9622
9777
|
rootRef,
|
9623
9778
|
...rest
|
9624
9779
|
} = props;
|
9625
|
-
return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
|
9626
|
-
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
9627
|
-
|
9628
|
-
|
9629
|
-
|
9780
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react135.NumberInput.Root, { ref: rootRef, ...rest, children: [
|
9781
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
9782
|
+
InputGroup,
|
9783
|
+
{
|
9784
|
+
startElement,
|
9785
|
+
endElement,
|
9786
|
+
width: "full",
|
9787
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react135.NumberInput.Input, { ref, ...inputProps })
|
9788
|
+
}
|
9789
|
+
),
|
9790
|
+
!hideControls && !endElement ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react135.NumberInput.Control, { children: [
|
9791
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react135.NumberInput.IncrementTrigger, {}),
|
9792
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react135.NumberInput.DecrementTrigger, {})
|
9630
9793
|
] }) : null
|
9631
9794
|
] });
|
9632
9795
|
}
|
@@ -9652,72 +9815,73 @@ __export(menu_exports, {
|
|
9652
9815
|
Trigger: () => MenuTrigger,
|
9653
9816
|
TriggerItem: () => MenuTriggerItem
|
9654
9817
|
});
|
9655
|
-
var
|
9656
|
-
var
|
9818
|
+
var import_react136 = require("react");
|
9819
|
+
var import_react137 = require("@chakra-ui/react");
|
9657
9820
|
var import_jsx_runtime20 = require("react/jsx-runtime");
|
9658
|
-
var MenuContent = (0,
|
9821
|
+
var MenuContent = (0, import_react136.forwardRef)(
|
9659
9822
|
function MenuContent2(props, ref) {
|
9660
9823
|
const { portalled = true, portalRef, ...rest } = props;
|
9661
|
-
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
9824
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.Content, { ref, ...rest }) }) });
|
9662
9825
|
}
|
9663
9826
|
);
|
9664
|
-
var MenuArrow = (0,
|
9827
|
+
var MenuArrow = (0, import_react136.forwardRef)(
|
9665
9828
|
function MenuArrow2(props, ref) {
|
9666
|
-
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
9829
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.Arrow, { ref, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.ArrowTip, {}) });
|
9667
9830
|
}
|
9668
9831
|
);
|
9669
|
-
var MenuCheckboxItem = (0,
|
9670
|
-
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
9671
|
-
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
9832
|
+
var MenuCheckboxItem = (0, import_react136.forwardRef)(function MenuCheckboxItem2(props, ref) {
|
9833
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react137.Menu.CheckboxItem, { ref, ...props, children: [
|
9834
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.ItemIndicator, { hidden: false, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CheckIcon, {}) }),
|
9672
9835
|
props.children
|
9673
9836
|
] });
|
9674
9837
|
});
|
9675
|
-
var MenuRadioItem = (0,
|
9838
|
+
var MenuRadioItem = (0, import_react136.forwardRef)(
|
9676
9839
|
function MenuRadioItem2(props, ref) {
|
9677
9840
|
const { children, ...rest } = props;
|
9678
|
-
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
9679
|
-
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
9680
|
-
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
9841
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react137.Menu.RadioItem, { ps: "8", ref, ...rest, children: [
|
9842
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.AbsoluteCenter, { axis: "horizontal", left: "4", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CheckIcon, {}) }) }),
|
9843
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.ItemText, { children })
|
9681
9844
|
] });
|
9682
9845
|
}
|
9683
9846
|
);
|
9684
|
-
var MenuItemGroup = (0,
|
9847
|
+
var MenuItemGroup = (0, import_react136.forwardRef)(
|
9685
9848
|
function MenuItemGroup2(props, ref) {
|
9686
9849
|
const { title, children, ...rest } = props;
|
9687
|
-
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
9688
|
-
title && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
9850
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react137.Menu.ItemGroup, { ref, ...rest, children: [
|
9851
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.ItemGroupLabel, { userSelect: "none", children: title }),
|
9689
9852
|
children
|
9690
9853
|
] });
|
9691
9854
|
}
|
9692
9855
|
);
|
9693
|
-
var MenuTriggerItem = (0,
|
9856
|
+
var MenuTriggerItem = (0, import_react136.forwardRef)(
|
9694
9857
|
function MenuTriggerItem2(props, ref) {
|
9695
9858
|
const { startIcon, children, ...rest } = props;
|
9696
|
-
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
9859
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react137.Menu.TriggerItem, { ref, ...rest, children: [
|
9697
9860
|
startIcon,
|
9698
9861
|
children,
|
9699
9862
|
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChevronRightIcon, {})
|
9700
9863
|
] });
|
9701
9864
|
}
|
9702
9865
|
);
|
9703
|
-
var MenuButton = (0,
|
9866
|
+
var MenuButton = (0, import_react136.forwardRef)(
|
9704
9867
|
function MenuButton2(props, ref) {
|
9705
9868
|
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(MenuTrigger, { ref, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Button, { ...props }) });
|
9706
9869
|
}
|
9707
9870
|
);
|
9708
|
-
var MenuRadioItemGroup =
|
9709
|
-
var MenuContextTrigger =
|
9710
|
-
var MenuRoot =
|
9711
|
-
var MenuSeparator =
|
9712
|
-
var MenuContext =
|
9713
|
-
var MenuItem =
|
9714
|
-
var MenuItemText =
|
9715
|
-
var MenuItemCommand =
|
9716
|
-
var MenuTrigger =
|
9871
|
+
var MenuRadioItemGroup = import_react137.Menu.RadioItemGroup;
|
9872
|
+
var MenuContextTrigger = import_react137.Menu.ContextTrigger;
|
9873
|
+
var MenuRoot = import_react137.Menu.Root;
|
9874
|
+
var MenuSeparator = import_react137.Menu.Separator;
|
9875
|
+
var MenuContext = import_react137.Menu.Context;
|
9876
|
+
var MenuItem = import_react137.Menu.Item;
|
9877
|
+
var MenuItemText = import_react137.Menu.ItemText;
|
9878
|
+
var MenuItemCommand = import_react137.Menu.ItemCommand;
|
9879
|
+
var MenuTrigger = import_react137.Menu.Trigger;
|
9717
9880
|
|
9718
9881
|
// src/components/pagination/pagination.tsx
|
9719
9882
|
var pagination_exports = {};
|
9720
9883
|
__export(pagination_exports, {
|
9884
|
+
Context: () => Context,
|
9721
9885
|
Ellipsis: () => Ellipsis,
|
9722
9886
|
Item: () => Item,
|
9723
9887
|
Items: () => Items,
|
@@ -9728,10 +9892,10 @@ __export(pagination_exports, {
|
|
9728
9892
|
PrevTrigger: () => PrevTrigger,
|
9729
9893
|
Root: () => Root
|
9730
9894
|
});
|
9731
|
-
var
|
9732
|
-
var
|
9895
|
+
var import_react138 = require("react");
|
9896
|
+
var import_react139 = require("@chakra-ui/react");
|
9733
9897
|
var import_jsx_runtime21 = require("react/jsx-runtime");
|
9734
|
-
var [RootPropsProvider, useRootProps] = (0,
|
9898
|
+
var [RootPropsProvider, useRootProps] = (0, import_react139.createContext)({
|
9735
9899
|
name: "RootPropsProvider"
|
9736
9900
|
});
|
9737
9901
|
var variantMap = {
|
@@ -9739,66 +9903,66 @@ var variantMap = {
|
|
9739
9903
|
solid: { default: "outline", ellipsis: "outline", current: "solid" },
|
9740
9904
|
subtle: { default: "ghost", ellipsis: "plain", current: "subtle" }
|
9741
9905
|
};
|
9742
|
-
var Root = (0,
|
9906
|
+
var Root = (0, import_react138.forwardRef)(
|
9743
9907
|
function PaginationRoot(props, ref) {
|
9744
9908
|
const { size = "sm", variant = "outline", ...rest } = props;
|
9745
|
-
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(RootPropsProvider, { value: { size, variantMap: variantMap[variant] }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
9909
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(RootPropsProvider, { value: { size, variantMap: variantMap[variant] }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react139.Pagination.Root, { ref, type: "button", ...rest }) });
|
9746
9910
|
}
|
9747
9911
|
);
|
9748
|
-
var Ellipsis = (0,
|
9749
|
-
var
|
9912
|
+
var Ellipsis = (0, import_react138.forwardRef)(function PaginationEllipsis(props, ref) {
|
9913
|
+
var _a8;
|
9750
9914
|
const { size, variantMap: variantMap2 } = useRootProps();
|
9751
|
-
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
9915
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react139.Pagination.Ellipsis, { ref, ...props, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react139.Button, { as: "span", variant: variantMap2.ellipsis, size, children: (_a8 = props.children) != null ? _a8 : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(EllipsisIcon, {}) }) });
|
9752
9916
|
});
|
9753
|
-
var Item = (0,
|
9917
|
+
var Item = (0, import_react138.forwardRef)(
|
9754
9918
|
function PaginationItem(props, ref) {
|
9755
|
-
const { page } = (0,
|
9919
|
+
const { page } = (0, import_react139.usePaginationContext)();
|
9756
9920
|
const { size, variantMap: variantMap2 } = useRootProps();
|
9757
9921
|
const current = page === props.value;
|
9758
9922
|
const variant = current ? variantMap2.current : variantMap2.default;
|
9759
|
-
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
9923
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react139.Pagination.Item, { ref, ...props, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react139.Button, { variant, size, children: props.value }) });
|
9760
9924
|
}
|
9761
9925
|
);
|
9762
|
-
var PrevButton = (0,
|
9763
|
-
var
|
9926
|
+
var PrevButton = (0, import_react138.forwardRef)(function PaginationPrevTrigger(props, ref) {
|
9927
|
+
var _a8;
|
9764
9928
|
const { size, variantMap: variantMap2 } = useRootProps();
|
9765
|
-
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
9929
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react139.Pagination.PrevTrigger, { ref, asChild: true, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react139.IconButton, { variant: variantMap2.default, size, children: (_a8 = props.children) != null ? _a8 : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ChevronLeftIcon, {}) }) });
|
9766
9930
|
});
|
9767
|
-
var NextButton = (0,
|
9768
|
-
var
|
9931
|
+
var NextButton = (0, import_react138.forwardRef)(function PaginationNextTrigger(props, ref) {
|
9932
|
+
var _a8;
|
9769
9933
|
const { size, variantMap: variantMap2 } = useRootProps();
|
9770
|
-
|
9771
|
-
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react138.Pagination.NextTrigger, { ref, asChild: true, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react138.IconButton, { variant: variantMap2.default, size, children: (_a7 = props.children) != null ? _a7 : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ChevronRightIcon, {}) }) });
|
9934
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react139.Pagination.NextTrigger, { ref, asChild: true, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react139.IconButton, { variant: variantMap2.default, size, children: (_a8 = props.children) != null ? _a8 : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ChevronRightIcon, {}) }) });
|
9772
9935
|
});
|
9773
9936
|
var Items = (props) => {
|
9774
|
-
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
9937
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react139.Pagination.Context, { children: ({ pages }) => pages.map((page, index) => {
|
9775
9938
|
return page.type === "ellipsis" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Ellipsis, { index, ...props }, index) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Item, { type: "page", value: page.value, ...props }, index);
|
9776
9939
|
}) });
|
9777
9940
|
};
|
9778
|
-
var PageText = (0,
|
9941
|
+
var PageText = (0, import_react138.forwardRef)(
|
9779
9942
|
function PaginationPageText(props, ref) {
|
9780
9943
|
const { format = "compact", ...rest } = props;
|
9781
|
-
const { page, pages, pageRange, count } = (0,
|
9782
|
-
const content = (0,
|
9944
|
+
const { page, pages, pageRange, count } = (0, import_react139.usePaginationContext)();
|
9945
|
+
const content = (0, import_react138.useMemo)(() => {
|
9783
9946
|
if (format === "short") return `${page} / ${pages.length}`;
|
9784
9947
|
if (format === "compact") return `${page} of ${pages.length}`;
|
9785
9948
|
return `${pageRange.start + 1} - ${pageRange.end} of ${count}`;
|
9786
9949
|
}, [format, page, pages.length, pageRange, count]);
|
9787
|
-
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
9950
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react139.Text, { fontWeight: "medium", ref, ...rest, children: content });
|
9788
9951
|
}
|
9789
9952
|
);
|
9790
|
-
var PrevTrigger =
|
9791
|
-
var NextTrigger =
|
9953
|
+
var PrevTrigger = import_react139.Pagination.PrevTrigger;
|
9954
|
+
var NextTrigger = import_react139.Pagination.NextTrigger;
|
9955
|
+
var Context = import_react139.Pagination.Context;
|
9792
9956
|
|
9793
9957
|
// src/components/password-input/password-input.tsx
|
9794
|
-
var
|
9795
|
-
var
|
9958
|
+
var import_react142 = require("react");
|
9959
|
+
var import_react143 = require("@chakra-ui/react");
|
9796
9960
|
|
9797
9961
|
// ../../node_modules/react-icons/lib/iconBase.mjs
|
9798
|
-
var
|
9962
|
+
var import_react141 = __toESM(require("react"), 1);
|
9799
9963
|
|
9800
9964
|
// ../../node_modules/react-icons/lib/iconContext.mjs
|
9801
|
-
var
|
9965
|
+
var import_react140 = __toESM(require("react"), 1);
|
9802
9966
|
var DefaultContext = {
|
9803
9967
|
color: void 0,
|
9804
9968
|
size: void 0,
|
@@ -9806,7 +9970,7 @@ var DefaultContext = {
|
|
9806
9970
|
style: void 0,
|
9807
9971
|
attr: void 0
|
9808
9972
|
};
|
9809
|
-
var IconContext =
|
9973
|
+
var IconContext = import_react140.default.createContext && /* @__PURE__ */ import_react140.default.createContext(DefaultContext);
|
9810
9974
|
|
9811
9975
|
// ../../node_modules/react-icons/lib/iconBase.mjs
|
9812
9976
|
var _excluded = ["attr", "size", "title"];
|
@@ -9895,12 +10059,12 @@ function _toPrimitive(t, r) {
|
|
9895
10059
|
return ("string" === r ? String : Number)(t);
|
9896
10060
|
}
|
9897
10061
|
function Tree2Element(tree) {
|
9898
|
-
return tree && tree.map((node, i) => /* @__PURE__ */
|
10062
|
+
return tree && tree.map((node, i) => /* @__PURE__ */ import_react141.default.createElement(node.tag, _objectSpread({
|
9899
10063
|
key: i
|
9900
10064
|
}, node.attr), Tree2Element(node.child)));
|
9901
10065
|
}
|
9902
10066
|
function GenIcon(data) {
|
9903
|
-
return (props) => /* @__PURE__ */
|
10067
|
+
return (props) => /* @__PURE__ */ import_react141.default.createElement(IconBase, _extends({
|
9904
10068
|
attr: _objectSpread({}, data.attr)
|
9905
10069
|
}, props), Tree2Element(data.child));
|
9906
10070
|
}
|
@@ -9915,7 +10079,7 @@ function IconBase(props) {
|
|
9915
10079
|
var className;
|
9916
10080
|
if (conf.className) className = conf.className;
|
9917
10081
|
if (props.className) className = (className ? className + " " : "") + props.className;
|
9918
|
-
return /* @__PURE__ */
|
10082
|
+
return /* @__PURE__ */ import_react141.default.createElement("svg", _extends({
|
9919
10083
|
stroke: "currentColor",
|
9920
10084
|
fill: "currentColor",
|
9921
10085
|
strokeWidth: "0"
|
@@ -9927,9 +10091,9 @@ function IconBase(props) {
|
|
9927
10091
|
height: computedSize,
|
9928
10092
|
width: computedSize,
|
9929
10093
|
xmlns: "http://www.w3.org/2000/svg"
|
9930
|
-
}), title && /* @__PURE__ */
|
10094
|
+
}), title && /* @__PURE__ */ import_react141.default.createElement("title", null, title), props.children);
|
9931
10095
|
};
|
9932
|
-
return IconContext !== void 0 ? /* @__PURE__ */
|
10096
|
+
return IconContext !== void 0 ? /* @__PURE__ */ import_react141.default.createElement(IconContext.Consumer, null, (conf) => elem(conf)) : elem(DefaultContext);
|
9933
10097
|
}
|
9934
10098
|
|
9935
10099
|
// ../../node_modules/react-icons/lu/index.mjs
|
@@ -9942,7 +10106,7 @@ function LuEye(props) {
|
|
9942
10106
|
|
9943
10107
|
// src/components/password-input/password-input.tsx
|
9944
10108
|
var import_jsx_runtime22 = require("react/jsx-runtime");
|
9945
|
-
var PasswordInput = (0,
|
10109
|
+
var PasswordInput = (0, import_react142.forwardRef)(
|
9946
10110
|
function PasswordInput2(props, ref) {
|
9947
10111
|
const {
|
9948
10112
|
rootProps,
|
@@ -9952,12 +10116,12 @@ var PasswordInput = (0, import_react141.forwardRef)(
|
|
9952
10116
|
visibilityIcon = { on: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LuEye, {}), off: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LuEyeOff, {}) },
|
9953
10117
|
...rest
|
9954
10118
|
} = props;
|
9955
|
-
const [visible, setVisible] = (0,
|
10119
|
+
const [visible, setVisible] = (0, import_react143.useControllableState)({
|
9956
10120
|
value: visibleProp,
|
9957
10121
|
defaultValue: defaultVisible || false,
|
9958
10122
|
onChange: onVisibleChange
|
9959
10123
|
});
|
9960
|
-
const inputRef = (0,
|
10124
|
+
const inputRef = (0, import_react142.useRef)(null);
|
9961
10125
|
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
9962
10126
|
InputGroup,
|
9963
10127
|
{
|
@@ -9977,10 +10141,10 @@ var PasswordInput = (0, import_react141.forwardRef)(
|
|
9977
10141
|
),
|
9978
10142
|
...rootProps,
|
9979
10143
|
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
9980
|
-
|
10144
|
+
import_react143.Input,
|
9981
10145
|
{
|
9982
10146
|
...rest,
|
9983
|
-
ref: (0,
|
10147
|
+
ref: (0, import_react143.mergeRefs)(ref, inputRef),
|
9984
10148
|
type: visible ? "text" : "password"
|
9985
10149
|
}
|
9986
10150
|
)
|
@@ -9988,10 +10152,10 @@ var PasswordInput = (0, import_react141.forwardRef)(
|
|
9988
10152
|
);
|
9989
10153
|
}
|
9990
10154
|
);
|
9991
|
-
var VisibilityTrigger = (0,
|
10155
|
+
var VisibilityTrigger = (0, import_react142.forwardRef)(
|
9992
10156
|
function VisibilityTrigger2(props, ref) {
|
9993
10157
|
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
9994
|
-
|
10158
|
+
import_react143.IconButton,
|
9995
10159
|
{
|
9996
10160
|
tabIndex: -1,
|
9997
10161
|
ref,
|
@@ -10012,27 +10176,27 @@ var VisibilityTrigger = (0, import_react141.forwardRef)(
|
|
10012
10176
|
var React7 = __toESM(require("react"), 1);
|
10013
10177
|
|
10014
10178
|
// src/components/persona/persona-primitive.tsx
|
10015
|
-
var
|
10016
|
-
var
|
10179
|
+
var import_react145 = require("react");
|
10180
|
+
var import_react146 = require("@chakra-ui/react");
|
10017
10181
|
var import_utils8 = require("@saas-ui/core/utils");
|
10018
10182
|
|
10019
10183
|
// src/components/persona/persona.context.ts
|
10020
|
-
var
|
10184
|
+
var import_react144 = require("@chakra-ui/react");
|
10021
10185
|
var {
|
10022
10186
|
useStyles: usePersonaStyles,
|
10023
10187
|
withProvider: withProvider5,
|
10024
10188
|
withContext: withContext6
|
10025
|
-
} = (0,
|
10189
|
+
} = (0, import_react144.createSlotRecipeContext)({
|
10026
10190
|
key: "suiPersona"
|
10027
10191
|
});
|
10028
10192
|
|
10029
10193
|
// src/components/persona/persona-primitive.tsx
|
10030
10194
|
var import_jsx_runtime23 = require("react/jsx-runtime");
|
10031
10195
|
var PersonaRoot = withProvider5(
|
10032
|
-
(0,
|
10196
|
+
(0, import_react145.forwardRef)((props, ref) => {
|
10033
10197
|
const { outOfOffice, presence, ...rest } = props;
|
10034
10198
|
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
10035
|
-
|
10199
|
+
import_react146.chakra.div,
|
10036
10200
|
{
|
10037
10201
|
ref,
|
10038
10202
|
...rest,
|
@@ -10049,7 +10213,7 @@ var PersonaRoot = withProvider5(
|
|
10049
10213
|
}),
|
10050
10214
|
"root"
|
10051
10215
|
);
|
10052
|
-
var PersonaAvatar = (0,
|
10216
|
+
var PersonaAvatar = (0, import_react145.forwardRef)(
|
10053
10217
|
(props, ref) => {
|
10054
10218
|
const {
|
10055
10219
|
name,
|
@@ -10062,10 +10226,10 @@ var PersonaAvatar = (0, import_react144.forwardRef)(
|
|
10062
10226
|
children,
|
10063
10227
|
...rest
|
10064
10228
|
} = props;
|
10065
|
-
return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
|
10066
|
-
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
10229
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_react146.Avatar.Root, { ref, ...rest, children: [
|
10230
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react146.Avatar.Fallback, { children: getInitials2(name) }),
|
10067
10231
|
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
10068
|
-
|
10232
|
+
import_react146.Avatar.Image,
|
10069
10233
|
{
|
10070
10234
|
src,
|
10071
10235
|
srcSet,
|
@@ -10184,10 +10348,10 @@ var defaultPresenceOptions = {
|
|
10184
10348
|
};
|
10185
10349
|
|
10186
10350
|
// src/components/pin-input/pin-input.tsx
|
10187
|
-
var
|
10188
|
-
var
|
10351
|
+
var import_react147 = require("react");
|
10352
|
+
var import_react148 = require("@chakra-ui/react");
|
10189
10353
|
var import_jsx_runtime25 = require("react/jsx-runtime");
|
10190
|
-
var PinInput = (0,
|
10354
|
+
var PinInput = (0, import_react147.forwardRef)(
|
10191
10355
|
function PinInput2(props, ref) {
|
10192
10356
|
const {
|
10193
10357
|
pinLength = 4,
|
@@ -10197,35 +10361,35 @@ var PinInput = (0, import_react146.forwardRef)(
|
|
10197
10361
|
gap = attached ? 0 : 2,
|
10198
10362
|
...rest
|
10199
10363
|
} = props;
|
10200
|
-
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
|
10201
|
-
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
10202
|
-
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
10364
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react148.PinInput.Root, { ref: rootRef, ...rest, children: [
|
10365
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react148.PinInput.HiddenInput, { ref, ...inputProps }),
|
10366
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react148.PinInput.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react148.Group, { attached, gap, children: Array.from({ length: pinLength }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react148.PinInput.Input, { index }, index)) }) })
|
10203
10367
|
] });
|
10204
10368
|
}
|
10205
10369
|
);
|
10206
10370
|
|
10207
10371
|
// src/components/radio/radio.tsx
|
10208
|
-
var
|
10209
|
-
var
|
10372
|
+
var import_react149 = require("react");
|
10373
|
+
var import_react150 = require("@chakra-ui/react");
|
10210
10374
|
var import_jsx_runtime26 = require("react/jsx-runtime");
|
10211
|
-
var Radio = (0,
|
10375
|
+
var Radio = (0, import_react149.forwardRef)(
|
10212
10376
|
function Radio2(props, ref) {
|
10213
10377
|
const { children, inputProps, rootRef, ...rest } = props;
|
10214
|
-
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
10215
|
-
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
10216
|
-
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
10217
|
-
children && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
10378
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react150.RadioGroup.Item, { ref: rootRef, ...rest, children: [
|
10379
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react150.RadioGroup.ItemHiddenInput, { ref, ...inputProps }),
|
10380
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react150.RadioGroup.ItemIndicator, {}),
|
10381
|
+
children && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react150.RadioGroup.ItemText, { children })
|
10218
10382
|
] });
|
10219
10383
|
}
|
10220
10384
|
);
|
10221
|
-
var RadioGroup =
|
10385
|
+
var RadioGroup = import_react150.RadioGroup.Root;
|
10222
10386
|
|
10223
10387
|
// src/components/search-input/search-input.tsx
|
10224
|
-
var
|
10225
|
-
var
|
10388
|
+
var import_react151 = __toESM(require("react"), 1);
|
10389
|
+
var import_react152 = require("@chakra-ui/react");
|
10226
10390
|
var import_utils9 = require("@saas-ui/core/utils");
|
10227
10391
|
var import_jsx_runtime27 = require("react/jsx-runtime");
|
10228
|
-
var SearchInput = (0,
|
10392
|
+
var SearchInput = (0, import_react151.forwardRef)(
|
10229
10393
|
(props, ref) => {
|
10230
10394
|
const {
|
10231
10395
|
placeholder = "Search",
|
@@ -10243,18 +10407,18 @@ var SearchInput = (0, import_react150.forwardRef)(
|
|
10243
10407
|
disabled,
|
10244
10408
|
...inputProps
|
10245
10409
|
} = props;
|
10246
|
-
const inputRef =
|
10247
|
-
const [value, setValue] = (0,
|
10410
|
+
const inputRef = import_react151.default.useRef(null);
|
10411
|
+
const [value, setValue] = (0, import_react152.useControllableState)({
|
10248
10412
|
value: valueProp,
|
10249
10413
|
defaultValue: defaultValueProp
|
10250
10414
|
});
|
10251
|
-
const onChange =
|
10415
|
+
const onChange = import_react151.default.useCallback(
|
10252
10416
|
(e) => {
|
10253
10417
|
setValue(e.target.value);
|
10254
10418
|
},
|
10255
10419
|
[setValue]
|
10256
10420
|
);
|
10257
|
-
const onKeyDown =
|
10421
|
+
const onKeyDown = import_react151.default.useCallback(
|
10258
10422
|
(event) => {
|
10259
10423
|
if (event.key === "Escape") {
|
10260
10424
|
setValue("");
|
@@ -10264,16 +10428,16 @@ var SearchInput = (0, import_react150.forwardRef)(
|
|
10264
10428
|
[onResetProp, setValue]
|
10265
10429
|
);
|
10266
10430
|
const onReset = () => {
|
10267
|
-
var
|
10431
|
+
var _a8;
|
10268
10432
|
setValue("");
|
10269
10433
|
onResetProp == null ? void 0 : onResetProp();
|
10270
|
-
(
|
10434
|
+
(_a8 = inputRef.current) == null ? void 0 : _a8.focus();
|
10271
10435
|
};
|
10272
10436
|
const showReset = value && !props.disabled;
|
10273
10437
|
const endElement = showReset ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(SearchInputResetButton, { size, children: resetIcon }) : endElementProp;
|
10274
|
-
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
10438
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react152.Group, { width, children: [
|
10275
10439
|
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
10276
|
-
|
10440
|
+
import_react152.InputElement,
|
10277
10441
|
{
|
10278
10442
|
placement: "start",
|
10279
10443
|
px: "0",
|
@@ -10283,7 +10447,7 @@ var SearchInput = (0, import_react150.forwardRef)(
|
|
10283
10447
|
}
|
10284
10448
|
),
|
10285
10449
|
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
10286
|
-
|
10450
|
+
import_react152.Input,
|
10287
10451
|
{
|
10288
10452
|
type: "text",
|
10289
10453
|
placeholder,
|
@@ -10291,7 +10455,7 @@ var SearchInput = (0, import_react150.forwardRef)(
|
|
10291
10455
|
size,
|
10292
10456
|
value,
|
10293
10457
|
disabled,
|
10294
|
-
ref: (0,
|
10458
|
+
ref: (0, import_react152.mergeRefs)(ref, inputRef),
|
10295
10459
|
onChange: (0, import_utils9.callAll)(onChange, onChangeProp),
|
10296
10460
|
onKeyDown: (0, import_utils9.callAll)(onKeyDown, onKeyDownProp),
|
10297
10461
|
ps: "calc(var(--input-height) - var(--input-height) / 10)",
|
@@ -10299,15 +10463,15 @@ var SearchInput = (0, import_react150.forwardRef)(
|
|
10299
10463
|
...inputProps
|
10300
10464
|
}
|
10301
10465
|
),
|
10302
|
-
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
10466
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react152.InputElement, { placement: "end", children: endElement })
|
10303
10467
|
] });
|
10304
10468
|
}
|
10305
10469
|
);
|
10306
|
-
var SearchInputResetButton = (0,
|
10470
|
+
var SearchInputResetButton = (0, import_react151.forwardRef)(
|
10307
10471
|
(props, ref) => {
|
10308
10472
|
const { children = /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(CloseIcon, {}), ...rest } = props;
|
10309
10473
|
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
10310
|
-
|
10474
|
+
import_react152.IconButton,
|
10311
10475
|
{
|
10312
10476
|
ref,
|
10313
10477
|
variant: "ghost",
|
@@ -10337,23 +10501,23 @@ __export(namespace_exports3, {
|
|
10337
10501
|
});
|
10338
10502
|
|
10339
10503
|
// src/components/select/select.tsx
|
10340
|
-
var
|
10341
|
-
var
|
10504
|
+
var import_react153 = require("react");
|
10505
|
+
var import_react154 = require("@chakra-ui/react");
|
10342
10506
|
var import_jsx_runtime28 = require("react/jsx-runtime");
|
10343
|
-
var SelectTrigger = (0,
|
10507
|
+
var SelectTrigger = (0, import_react153.forwardRef)(
|
10344
10508
|
function SelectTrigger2(props, ref) {
|
10345
10509
|
const { children, clearable, ...rest } = props;
|
10346
|
-
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
10347
|
-
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
10348
|
-
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
10510
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_react154.Select.Control, { ...rest, children: [
|
10511
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react154.Select.Trigger, { ref, children }),
|
10512
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_react154.Select.IndicatorGroup, { children: [
|
10349
10513
|
clearable && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(SelectClearTrigger, {}),
|
10350
|
-
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
10514
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react154.Select.Indicator, {})
|
10351
10515
|
] })
|
10352
10516
|
] });
|
10353
10517
|
}
|
10354
10518
|
);
|
10355
|
-
var SelectClearTrigger = (0,
|
10356
|
-
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
10519
|
+
var SelectClearTrigger = (0, import_react153.forwardRef)(function SelectClearTrigger2(props, ref) {
|
10520
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react154.Select.ClearTrigger, { asChild: true, ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
10357
10521
|
CloseButton,
|
10358
10522
|
{
|
10359
10523
|
size: "xs",
|
@@ -10364,24 +10528,24 @@ var SelectClearTrigger = (0, import_react152.forwardRef)(function SelectClearTri
|
|
10364
10528
|
}
|
10365
10529
|
) });
|
10366
10530
|
});
|
10367
|
-
var SelectContent = (0,
|
10531
|
+
var SelectContent = (0, import_react153.forwardRef)(
|
10368
10532
|
function SelectContent2(props, ref) {
|
10369
10533
|
const { portalled = true, portalRef, ...rest } = props;
|
10370
|
-
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
10534
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react154.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react154.Select.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react154.Select.Content, { ...rest, ref }) }) });
|
10371
10535
|
}
|
10372
10536
|
);
|
10373
|
-
var SelectItem = (0,
|
10537
|
+
var SelectItem = (0, import_react153.forwardRef)(
|
10374
10538
|
function SelectItem2(props, ref) {
|
10375
10539
|
const { item, children, ...rest } = props;
|
10376
|
-
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
10540
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_react154.Select.Item, { item, ...rest, ref, children: [
|
10377
10541
|
children,
|
10378
|
-
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
10542
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react154.Select.ItemIndicator, {})
|
10379
10543
|
] }, item.value);
|
10380
10544
|
}
|
10381
10545
|
);
|
10382
|
-
var SelectValueText = (0,
|
10546
|
+
var SelectValueText = (0, import_react153.forwardRef)(function SelectValueText2(props, ref) {
|
10383
10547
|
const { children, ...rest } = props;
|
10384
|
-
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
10548
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react154.Select.ValueText, { ...rest, ref, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react154.Select.Context, { children: (select) => {
|
10385
10549
|
const items = select.selectedItems;
|
10386
10550
|
if (items.length === 0) return props.placeholder;
|
10387
10551
|
if (children) return children(items);
|
@@ -10390,9 +10554,9 @@ var SelectValueText = (0, import_react152.forwardRef)(function SelectValueText2(
|
|
10390
10554
|
return `${items.length} selected`;
|
10391
10555
|
} }) });
|
10392
10556
|
});
|
10393
|
-
var SelectRoot = (0,
|
10557
|
+
var SelectRoot = (0, import_react153.forwardRef)(function SelectRoot2(props, ref) {
|
10394
10558
|
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
10395
|
-
|
10559
|
+
import_react154.Select.Root,
|
10396
10560
|
{
|
10397
10561
|
...props,
|
10398
10562
|
ref,
|
@@ -10400,21 +10564,21 @@ var SelectRoot = (0, import_react152.forwardRef)(function SelectRoot2(props, ref
|
|
10400
10564
|
}
|
10401
10565
|
);
|
10402
10566
|
});
|
10403
|
-
var SelectItemGroup = (0,
|
10567
|
+
var SelectItemGroup = (0, import_react153.forwardRef)(
|
10404
10568
|
function SelectItemGroup2(props, ref) {
|
10405
10569
|
const { children, label, ...rest } = props;
|
10406
|
-
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
10407
|
-
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
10570
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_react154.Select.ItemGroup, { ...rest, ref, children: [
|
10571
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react154.Select.ItemGroupLabel, { children: label }),
|
10408
10572
|
children
|
10409
10573
|
] });
|
10410
10574
|
}
|
10411
10575
|
);
|
10412
|
-
var SelectLabel =
|
10413
|
-
var SelectItemText =
|
10576
|
+
var SelectLabel = import_react154.Select.Label;
|
10577
|
+
var SelectItemText = import_react154.Select.ItemText;
|
10414
10578
|
|
10415
10579
|
// src/components/segmented-control/segmented-control.tsx
|
10416
|
-
var
|
10417
|
-
var
|
10580
|
+
var import_react155 = require("react");
|
10581
|
+
var import_react156 = require("@chakra-ui/react");
|
10418
10582
|
var import_jsx_runtime29 = require("react/jsx-runtime");
|
10419
10583
|
function normalize(items) {
|
10420
10584
|
return items.map((item) => {
|
@@ -10422,19 +10586,19 @@ function normalize(items) {
|
|
10422
10586
|
return item;
|
10423
10587
|
});
|
10424
10588
|
}
|
10425
|
-
var SegmentedControl = (0,
|
10589
|
+
var SegmentedControl = (0, import_react155.forwardRef)(function SegmentedControl2(props, ref) {
|
10426
10590
|
const { items, ...rest } = props;
|
10427
|
-
const data = (0,
|
10428
|
-
return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
|
10429
|
-
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
10430
|
-
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
10431
|
-
|
10591
|
+
const data = (0, import_react155.useMemo)(() => normalize(items), [items]);
|
10592
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react156.SegmentGroup.Root, { ref, ...rest, children: [
|
10593
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react156.SegmentGroup.Indicator, {}),
|
10594
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react156.For, { each: data, children: (item) => /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
|
10595
|
+
import_react156.SegmentGroup.Item,
|
10432
10596
|
{
|
10433
10597
|
value: item.value,
|
10434
10598
|
disabled: item.disabled,
|
10435
10599
|
children: [
|
10436
|
-
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
10437
|
-
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
10600
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react156.SegmentGroup.ItemText, { children: item.label }),
|
10601
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react156.SegmentGroup.ItemHiddenInput, {})
|
10438
10602
|
]
|
10439
10603
|
},
|
10440
10604
|
item.value
|
@@ -10466,21 +10630,21 @@ __export(sidebar_exports, {
|
|
10466
10630
|
var import_sidebar = require("@saas-ui/core/sidebar");
|
10467
10631
|
|
10468
10632
|
// src/components/sidebar/sidebar.context.ts
|
10469
|
-
var
|
10633
|
+
var import_react157 = require("@chakra-ui/react");
|
10470
10634
|
var {
|
10471
10635
|
withContext: withContext7,
|
10472
10636
|
useRecipeResult,
|
10473
10637
|
StylesProvider,
|
10474
10638
|
ClassNamesProvider,
|
10475
10639
|
useStyles: useSidebarStyles
|
10476
|
-
} = (0,
|
10640
|
+
} = (0, import_react157.createSlotRecipeContext)({
|
10477
10641
|
key: "suiSidebar"
|
10478
10642
|
});
|
10479
10643
|
var {
|
10480
10644
|
withProvider: withItemProvider,
|
10481
10645
|
withContext: withItemContext,
|
10482
10646
|
useStyles: useSidebarItemStyles
|
10483
|
-
} = (0,
|
10647
|
+
} = (0, import_react157.createSlotRecipeContext)({
|
10484
10648
|
key: "suiSidebarNavItem"
|
10485
10649
|
});
|
10486
10650
|
|
@@ -10583,99 +10747,99 @@ __export(steps_exports, {
|
|
10583
10747
|
NextTrigger: () => StepsNextTrigger,
|
10584
10748
|
PrevTrigger: () => StepsPrevTrigger,
|
10585
10749
|
Root: () => StepsRoot,
|
10586
|
-
useContext: () =>
|
10750
|
+
useContext: () => import_react158.useStepsContext
|
10587
10751
|
});
|
10588
|
-
var
|
10752
|
+
var import_react158 = require("@chakra-ui/react");
|
10589
10753
|
var import_jsx_runtime31 = require("react/jsx-runtime");
|
10590
10754
|
var StepsItem = (props) => {
|
10591
10755
|
const { title, description, completedIcon, icon, ...rest } = props;
|
10592
|
-
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
10593
|
-
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
10594
|
-
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
10595
|
-
|
10756
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react158.Steps.Item, { ...rest, children: [
|
10757
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react158.Steps.Trigger, { children: [
|
10758
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react158.Steps.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
10759
|
+
import_react158.Steps.Status,
|
10596
10760
|
{
|
10597
10761
|
complete: completedIcon || /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(CheckIcon, {}),
|
10598
|
-
incomplete: icon || /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
10762
|
+
incomplete: icon || /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react158.Steps.Number, {})
|
10599
10763
|
}
|
10600
10764
|
) }),
|
10601
10765
|
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(StepInfo, { title, description })
|
10602
10766
|
] }),
|
10603
|
-
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
10767
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react158.Steps.Separator, {})
|
10604
10768
|
] });
|
10605
10769
|
};
|
10606
10770
|
var StepInfo = (props) => {
|
10607
10771
|
const { title, description } = props;
|
10608
10772
|
if (title && description) {
|
10609
|
-
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
10610
|
-
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
10611
|
-
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
10773
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react158.Box, { children: [
|
10774
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react158.Steps.Title, { children: title }),
|
10775
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react158.Steps.Description, { children: description })
|
10612
10776
|
] });
|
10613
10777
|
}
|
10614
10778
|
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_jsx_runtime31.Fragment, { children: [
|
10615
|
-
title && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
10616
|
-
description && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
10779
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react158.Steps.Title, { children: title }),
|
10780
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react158.Steps.Description, { children: description })
|
10617
10781
|
] });
|
10618
10782
|
};
|
10619
10783
|
var StepsIndicator = (props) => {
|
10620
|
-
const { icon = /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
10621
|
-
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
10784
|
+
const { icon = /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react158.Steps.Number, {}), completedIcon } = props;
|
10785
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react158.Steps.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react158.Steps.Status, { complete: completedIcon, incomplete: icon }) });
|
10622
10786
|
};
|
10623
|
-
var StepsList =
|
10624
|
-
var StepsRoot =
|
10625
|
-
var StepsContent =
|
10626
|
-
var StepsCompletedContent =
|
10787
|
+
var StepsList = import_react158.Steps.List;
|
10788
|
+
var StepsRoot = import_react158.Steps.Root;
|
10789
|
+
var StepsContent = import_react158.Steps.Content;
|
10790
|
+
var StepsCompletedContent = import_react158.Steps.CompletedContent;
|
10627
10791
|
var StepsNextTrigger = (props) => {
|
10628
|
-
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
10792
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react158.Steps.NextTrigger, { ...props });
|
10629
10793
|
};
|
10630
10794
|
var StepsPrevTrigger = (props) => {
|
10631
|
-
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
10795
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react158.Steps.PrevTrigger, { ...props });
|
10632
10796
|
};
|
10633
10797
|
|
10634
10798
|
// src/components/switch/switch.tsx
|
10635
|
-
var
|
10636
|
-
var
|
10799
|
+
var import_react159 = require("@chakra-ui/react");
|
10800
|
+
var import_react160 = require("react");
|
10637
10801
|
var import_jsx_runtime32 = require("react/jsx-runtime");
|
10638
|
-
var Switch = (0,
|
10802
|
+
var Switch = (0, import_react160.forwardRef)(
|
10639
10803
|
function Switch2(props, ref) {
|
10640
10804
|
const { inputProps, children, rootRef, trackLabel, thumbLabel, ...rest } = props;
|
10641
|
-
return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
|
10642
|
-
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
10643
|
-
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
|
10644
|
-
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
10645
|
-
trackLabel && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
10805
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react159.Switch.Root, { ref: rootRef, ...rest, children: [
|
10806
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react159.Switch.HiddenInput, { ref, ...inputProps }),
|
10807
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react159.Switch.Control, { children: [
|
10808
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react159.Switch.Thumb, { children: thumbLabel && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react159.Switch.ThumbIndicator, { fallback: thumbLabel == null ? void 0 : thumbLabel.off, children: thumbLabel == null ? void 0 : thumbLabel.on }) }),
|
10809
|
+
trackLabel && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react159.Switch.Indicator, { fallback: trackLabel.off, children: trackLabel.on })
|
10646
10810
|
] }),
|
10647
|
-
children != null && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
10811
|
+
children != null && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react159.Switch.Label, { children })
|
10648
10812
|
] });
|
10649
10813
|
}
|
10650
10814
|
);
|
10651
10815
|
|
10652
10816
|
// src/components/toaster/toaster.tsx
|
10653
|
-
var
|
10817
|
+
var import_react161 = require("@chakra-ui/react");
|
10654
10818
|
var import_jsx_runtime33 = require("react/jsx-runtime");
|
10655
|
-
var toast = (0,
|
10819
|
+
var toast = (0, import_react161.createToaster)({
|
10656
10820
|
placement: "bottom-end",
|
10657
10821
|
pauseOnPageIdle: true
|
10658
10822
|
});
|
10659
10823
|
var Toaster = () => {
|
10660
|
-
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
10661
|
-
var
|
10662
|
-
return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
|
10663
|
-
toast2.type === "loading" ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
10664
|
-
/* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
|
10665
|
-
toast2.title && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
10666
|
-
toast2.description && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
10824
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react161.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react161.Toaster, { toaster: toast, insetInline: { mdDown: "4" }, children: (toast2) => {
|
10825
|
+
var _a8;
|
10826
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react161.Toast.Root, { width: { md: "sm" }, children: [
|
10827
|
+
toast2.type === "loading" ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react161.Spinner, { size: "sm", color: "colorPalette.solid" }) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react161.Toast.Indicator, {}),
|
10828
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react161.Stack, { gap: "1", flex: "1", maxWidth: "100%", children: [
|
10829
|
+
toast2.title && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react161.Toast.Title, { children: toast2.title }),
|
10830
|
+
toast2.description && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react161.Toast.Description, { children: toast2.description })
|
10667
10831
|
] }),
|
10668
|
-
toast2.action && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
10669
|
-
((
|
10832
|
+
toast2.action && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react161.Toast.ActionTrigger, { children: toast2.action.label }),
|
10833
|
+
((_a8 = toast2.meta) == null ? void 0 : _a8.closable) && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react161.Toast.CloseTrigger, {})
|
10670
10834
|
] });
|
10671
10835
|
} }) });
|
10672
10836
|
};
|
10673
10837
|
|
10674
10838
|
// src/components/tooltip/tooltip.tsx
|
10675
|
-
var
|
10676
|
-
var
|
10839
|
+
var import_react162 = require("react");
|
10840
|
+
var import_react163 = require("@chakra-ui/react");
|
10677
10841
|
var import_jsx_runtime34 = require("react/jsx-runtime");
|
10678
|
-
var Tooltip = (0,
|
10842
|
+
var Tooltip = (0, import_react162.forwardRef)(
|
10679
10843
|
function Tooltip2(props, ref) {
|
10680
10844
|
const {
|
10681
10845
|
showArrow,
|
@@ -10688,10 +10852,10 @@ var Tooltip = (0, import_react161.forwardRef)(
|
|
10688
10852
|
...rest
|
10689
10853
|
} = props;
|
10690
10854
|
if (disabled) return children;
|
10691
|
-
return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
10692
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
10693
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
10694
|
-
showArrow && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
10855
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_react163.Tooltip.Root, { ...rest, children: [
|
10856
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_react163.Tooltip.Trigger, { asChild: true, children }),
|
10857
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_react163.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_react163.Tooltip.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_react163.Tooltip.Content, { ref, ...contentProps, children: [
|
10858
|
+
showArrow && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_react163.Tooltip.Arrow, { children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_react163.Tooltip.ArrowTip, {}) }),
|
10695
10859
|
content
|
10696
10860
|
] }) }) })
|
10697
10861
|
] });
|
@@ -10712,6 +10876,7 @@ var Tooltip = (0, import_react161.forwardRef)(
|
|
10712
10876
|
EmptyState,
|
10713
10877
|
GridList,
|
10714
10878
|
IconBadge,
|
10879
|
+
IconButton,
|
10715
10880
|
InputGroup,
|
10716
10881
|
Link,
|
10717
10882
|
LoadingOverlay,
|