@saas-ui/react 3.0.0-alpha.23 → 3.0.0-alpha.25
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 +23 -0
- package/dist/{chunk-BU7QENBQ.js → chunk-3JZ42NYM.js} +1 -1
- package/dist/chunk-52XM5VXJ.js +9 -0
- package/dist/chunk-6MMPBMKN.js +54 -0
- package/dist/chunk-CZVNG73V.js +63 -0
- package/dist/chunk-GRUMUCSL.js +109 -0
- package/dist/chunk-IVLUAUU5.js +10 -0
- package/dist/chunk-JMYI6YXR.js +1 -0
- package/dist/{chunk-CD2JUFI2.js → chunk-K2SPPLAY.js} +2 -2
- package/dist/chunk-KE5AC3TZ.js +63 -0
- package/dist/{chunk-FJFNGSPL.js → chunk-NGGISORT.js} +12 -6
- package/dist/chunk-RLIAFHVM.js +66 -0
- package/dist/components/badge/index.d.cts +2 -0
- package/dist/components/badge/index.d.ts +2 -0
- package/dist/components/close-button/index.js +2 -1
- package/dist/components/data-list/index.cjs +33 -0
- package/dist/components/data-list/index.d.cts +1 -0
- package/dist/components/data-list/index.d.ts +1 -0
- package/dist/components/data-list/index.js +10 -0
- package/dist/components/dialog/index.cjs +35 -35
- package/dist/components/dialog/index.d.cts +35 -17
- package/dist/components/dialog/index.d.ts +35 -17
- package/dist/components/dialog/index.js +5 -4
- package/dist/components/drawer/index.cjs +34 -36
- package/dist/components/drawer/index.d.cts +33 -18
- package/dist/components/drawer/index.d.ts +33 -18
- package/dist/components/drawer/index.js +5 -4
- package/dist/components/empty-state/index.cjs +12 -10
- package/dist/components/empty-state/index.js +1 -1
- package/dist/components/file-upload/index.cjs +254 -0
- package/dist/components/file-upload/index.d.cts +43 -0
- package/dist/components/file-upload/index.d.ts +43 -0
- package/dist/components/file-upload/index.js +10 -0
- package/dist/components/grid-list/index.d.cts +1 -1
- package/dist/components/grid-list/index.d.ts +1 -1
- package/dist/components/navbar/index.d.cts +3 -3
- package/dist/components/navbar/index.d.ts +3 -3
- package/dist/components/password-input/index.cjs +2 -2
- package/dist/components/password-input/index.js +1 -1
- package/dist/components/persona/index.d.cts +4 -9
- package/dist/components/persona/index.d.ts +4 -9
- package/dist/components/popover/index.cjs +214 -0
- package/dist/components/popover/index.d.cts +37 -0
- package/dist/components/popover/index.d.ts +37 -0
- package/dist/components/popover/index.js +11 -0
- package/dist/components/select/index.js +3 -2
- package/dist/components/sidebar/index.d.cts +11 -11
- package/dist/components/sidebar/index.d.ts +11 -11
- package/dist/components/tabs/index.cjs +35 -0
- package/dist/components/tabs/index.d.cts +1 -0
- package/dist/components/tabs/index.d.ts +1 -0
- package/dist/components/tabs/index.js +12 -0
- package/dist/components/toaster/index.cjs +161 -11
- package/dist/components/toaster/index.d.cts +6 -5
- package/dist/components/toaster/index.d.ts +6 -5
- package/dist/components/toaster/index.js +3 -1
- package/dist/index.cjs +2253 -1968
- package/dist/index.d.cts +5 -1
- package/dist/index.d.ts +5 -1
- package/dist/index.js +1531 -1415
- package/package.json +2 -2
- package/dist/chunk-EQ7Q6HRE.js +0 -63
- package/dist/chunk-HELHPHIQ.js +0 -35
- package/dist/chunk-VJ4NCA6R.js +0 -56
- /package/dist/{chunk-BKYGKH3L.js → chunk-YXGJOOMM.js} +0 -0
package/dist/index.js
CHANGED
@@ -1,28 +1,51 @@
|
|
1
1
|
import {
|
2
2
|
Status
|
3
3
|
} from "./chunk-YKSY7UOM.js";
|
4
|
+
import {
|
5
|
+
Toaster,
|
6
|
+
toast
|
7
|
+
} from "./chunk-RLIAFHVM.js";
|
8
|
+
import {
|
9
|
+
Tooltip
|
10
|
+
} from "./chunk-QSNSWCTM.js";
|
11
|
+
import {
|
12
|
+
colors
|
13
|
+
} from "./chunk-3MO37LYW.js";
|
14
|
+
import {
|
15
|
+
namespace_exports
|
16
|
+
} from "./chunk-3JZ42NYM.js";
|
17
|
+
import {
|
18
|
+
SegmentedControl
|
19
|
+
} from "./chunk-SKXSBAOS.js";
|
20
|
+
import {
|
21
|
+
sidebar_exports,
|
22
|
+
useSidebar,
|
23
|
+
useSidebarItemStyles,
|
24
|
+
useSidebarStyles
|
25
|
+
} from "./chunk-U23VDAWJ.js";
|
4
26
|
import {
|
5
27
|
steps_exports
|
6
28
|
} from "./chunk-VZG7EJ64.js";
|
7
29
|
import {
|
8
30
|
Switch
|
9
31
|
} from "./chunk-SA3OGTOO.js";
|
32
|
+
import {
|
33
|
+
Tabs,
|
34
|
+
useTabsContext,
|
35
|
+
useTabsStyles
|
36
|
+
} from "./chunk-IVLUAUU5.js";
|
10
37
|
import {
|
11
38
|
Tag
|
12
39
|
} from "./chunk-IEWHAXXU.js";
|
13
40
|
import {
|
14
|
-
|
15
|
-
|
16
|
-
} from "./chunk-HELHPHIQ.js";
|
17
|
-
import {
|
18
|
-
Tooltip
|
19
|
-
} from "./chunk-QSNSWCTM.js";
|
41
|
+
NumberInput
|
42
|
+
} from "./chunk-S5J6REMC.js";
|
20
43
|
import {
|
21
|
-
|
22
|
-
} from "./chunk-
|
44
|
+
pagination_exports
|
45
|
+
} from "./chunk-MLJN6IOJ.js";
|
23
46
|
import {
|
24
47
|
PasswordInput
|
25
|
-
} from "./chunk-
|
48
|
+
} from "./chunk-K2SPPLAY.js";
|
26
49
|
import {
|
27
50
|
Persona,
|
28
51
|
PersonaAvatar,
|
@@ -31,6 +54,9 @@ import {
|
|
31
54
|
import {
|
32
55
|
PinInput
|
33
56
|
} from "./chunk-2EUACKRH.js";
|
57
|
+
import {
|
58
|
+
popover_exports
|
59
|
+
} from "./chunk-KE5AC3TZ.js";
|
34
60
|
import {
|
35
61
|
Radio,
|
36
62
|
RadioGroup
|
@@ -39,17 +65,14 @@ import {
|
|
39
65
|
SearchInput
|
40
66
|
} from "./chunk-46ISJZBS.js";
|
41
67
|
import {
|
42
|
-
|
43
|
-
} from "./chunk-
|
68
|
+
IconButton
|
69
|
+
} from "./chunk-MS2ELLDY.js";
|
44
70
|
import {
|
45
|
-
|
46
|
-
} from "./chunk-
|
71
|
+
IconBadge
|
72
|
+
} from "./chunk-I2RXEKTB.js";
|
47
73
|
import {
|
48
|
-
|
49
|
-
|
50
|
-
useSidebarItemStyles,
|
51
|
-
useSidebarStyles
|
52
|
-
} from "./chunk-U23VDAWJ.js";
|
74
|
+
InputGroup
|
75
|
+
} from "./chunk-PKI6YH2V.js";
|
53
76
|
import {
|
54
77
|
Link
|
55
78
|
} from "./chunk-TZBAM4AD.js";
|
@@ -74,50 +97,43 @@ import {
|
|
74
97
|
useSui
|
75
98
|
} from "./chunk-O2WVT2BP.js";
|
76
99
|
import {
|
77
|
-
|
78
|
-
} from "./chunk-
|
100
|
+
Command
|
101
|
+
} from "./chunk-UASXI64E.js";
|
79
102
|
import {
|
80
|
-
|
81
|
-
|
103
|
+
DataList,
|
104
|
+
useDataListStyles
|
105
|
+
} from "./chunk-52XM5VXJ.js";
|
82
106
|
import {
|
83
|
-
|
84
|
-
} from "./chunk-
|
107
|
+
drawer_exports
|
108
|
+
} from "./chunk-6MMPBMKN.js";
|
85
109
|
import {
|
86
|
-
|
87
|
-
} from "./chunk-
|
110
|
+
EmptyState
|
111
|
+
} from "./chunk-NGGISORT.js";
|
88
112
|
import {
|
89
|
-
|
90
|
-
} from "./chunk-
|
113
|
+
dialog_exports
|
114
|
+
} from "./chunk-CZVNG73V.js";
|
115
|
+
import "./chunk-JMYI6YXR.js";
|
91
116
|
import {
|
92
|
-
|
93
|
-
} from "./chunk-
|
117
|
+
file_upload_exports
|
118
|
+
} from "./chunk-GRUMUCSL.js";
|
94
119
|
import {
|
95
120
|
CloseButton
|
96
|
-
} from "./chunk-
|
121
|
+
} from "./chunk-YXGJOOMM.js";
|
97
122
|
import "./chunk-4TPVIHNO.js";
|
98
|
-
import {
|
99
|
-
EmptyState
|
100
|
-
} from "./chunk-FJFNGSPL.js";
|
101
123
|
import {
|
102
124
|
grid_list_exports
|
103
125
|
} from "./chunk-NSD5HRIP.js";
|
104
|
-
import {
|
105
|
-
IconBadge
|
106
|
-
} from "./chunk-I2RXEKTB.js";
|
107
|
-
import {
|
108
|
-
IconButton
|
109
|
-
} from "./chunk-MS2ELLDY.js";
|
110
126
|
import {
|
111
127
|
AppShell
|
112
128
|
} from "./chunk-6ZNR6N2K.js";
|
113
|
-
import {
|
114
|
-
Badge
|
115
|
-
} from "./chunk-INV6RT5B.js";
|
116
129
|
import "./chunk-YHQ5JGCC.js";
|
117
130
|
import {
|
118
131
|
Avatar,
|
119
132
|
AvatarGroup
|
120
133
|
} from "./chunk-JO4WJVYO.js";
|
134
|
+
import {
|
135
|
+
Badge
|
136
|
+
} from "./chunk-INV6RT5B.js";
|
121
137
|
import {
|
122
138
|
breadcrumb_exports
|
123
139
|
} from "./chunk-TT4C5VXB.js";
|
@@ -222,7 +238,6 @@ import { defineGlobalStyles } from "@chakra-ui/react";
|
|
222
238
|
var empty = "var(--chakra-empty,/*!*/ /*!*/)";
|
223
239
|
var globalCss = defineGlobalStyles({
|
224
240
|
"*": {
|
225
|
-
fontFeatureSettings: '"cv11"',
|
226
241
|
"--ring-inset": empty,
|
227
242
|
"--ring-offset-width": "0px",
|
228
243
|
"--ring-offset-color": "#fff",
|
@@ -259,8 +274,14 @@ var globalCss = defineGlobalStyles({
|
|
259
274
|
"--global-color-border": "colors.border",
|
260
275
|
"--cursor-button": "default",
|
261
276
|
"--radius-factor": "1",
|
277
|
+
"--radius-control": "1",
|
278
|
+
"--radius-panel": "1",
|
279
|
+
"--radius-indicator": "1",
|
262
280
|
"--radius-full": "9999px",
|
263
|
-
"--scale-factor": "1"
|
281
|
+
"--scale-factor": "1",
|
282
|
+
"--overlay-translucency": "90%",
|
283
|
+
"--overlay-effect": "blur({blurs.lg})",
|
284
|
+
"--backdrop-effect": "none"
|
264
285
|
},
|
265
286
|
body: {
|
266
287
|
color: "fg",
|
@@ -273,41 +294,6 @@ var globalCss = defineGlobalStyles({
|
|
273
294
|
},
|
274
295
|
"*::selection": {
|
275
296
|
bg: "colorPalette.muted/80"
|
276
|
-
},
|
277
|
-
'[data-radius="none"]': {
|
278
|
-
"--radius-factor": "0",
|
279
|
-
"--radius-full": "0"
|
280
|
-
},
|
281
|
-
'[data-radius="sm"]': {
|
282
|
-
"--radius-factor": "0.9",
|
283
|
-
"--radius-full": "0"
|
284
|
-
},
|
285
|
-
'[data-radius="md"]': {
|
286
|
-
"--radius-factor": "1",
|
287
|
-
"--radius-full": "0"
|
288
|
-
},
|
289
|
-
'[data-radius="lg"]': {
|
290
|
-
"--radius-factor": "1.5",
|
291
|
-
"--radius-full": "0"
|
292
|
-
},
|
293
|
-
'[data-radius="full"]': {
|
294
|
-
"--radius-factor": "1.5",
|
295
|
-
"--radius-full": "9999px"
|
296
|
-
},
|
297
|
-
'[data-scale="xs"]': {
|
298
|
-
"--scale-factor": "0.9"
|
299
|
-
},
|
300
|
-
'[data-scale="sm"]': {
|
301
|
-
"--scale-factor": "0.95"
|
302
|
-
},
|
303
|
-
'[data-scale="md"]': {
|
304
|
-
"--scale-factor": "1"
|
305
|
-
},
|
306
|
-
'[data-scale="lg"]': {
|
307
|
-
"--scale-factor": "1.05"
|
308
|
-
},
|
309
|
-
'[data-scale="xl"]': {
|
310
|
-
"--scale-factor": "1.1"
|
311
297
|
}
|
312
298
|
});
|
313
299
|
|
@@ -421,6 +407,20 @@ var layerStyles = defineLayerStyles({
|
|
421
407
|
},
|
422
408
|
none: {
|
423
409
|
value: {}
|
410
|
+
},
|
411
|
+
overlay: {
|
412
|
+
value: {
|
413
|
+
bg: "bg.overlay",
|
414
|
+
backdropFilter: "var(--overlay-effect)",
|
415
|
+
borderRadius: "panel.lg",
|
416
|
+
boxShadow: "lg"
|
417
|
+
}
|
418
|
+
},
|
419
|
+
backdrop: {
|
420
|
+
value: {
|
421
|
+
bg: "bg.backdrop",
|
422
|
+
backdropFilter: "var(--backdrop-effect)"
|
423
|
+
}
|
424
424
|
}
|
425
425
|
});
|
426
426
|
|
@@ -1661,6 +1661,18 @@ var semanticColors = defineSemanticTokens.colors({
|
|
1661
1661
|
panel: {
|
1662
1662
|
value: { _light: "{colors.white}", _dark: "{colors.gray.950}" }
|
1663
1663
|
},
|
1664
|
+
overlay: {
|
1665
|
+
value: {
|
1666
|
+
_light: "color-mix(in oklch, {colors.white} var(--overlay-translucency), transparent)",
|
1667
|
+
_dark: "color-mix(in srgb, var(--overlay-translucency), {colors.gray.950} 100%)"
|
1668
|
+
}
|
1669
|
+
},
|
1670
|
+
backdrop: {
|
1671
|
+
value: {
|
1672
|
+
_light: "{colors.black/30}",
|
1673
|
+
_dark: "{colors.black/30}"
|
1674
|
+
}
|
1675
|
+
},
|
1664
1676
|
error: {
|
1665
1677
|
value: { _light: "{colors.red.50}", _dark: "{colors.red.950}" }
|
1666
1678
|
},
|
@@ -2268,7 +2280,40 @@ import { defineSemanticTokens as defineSemanticTokens2 } from "@chakra-ui/react"
|
|
2268
2280
|
var semanticRadii = defineSemanticTokens2.radii({
|
2269
2281
|
l1: { value: "{radii.xs}" },
|
2270
2282
|
l2: { value: "{radii.sm}" },
|
2271
|
-
l3: { value: "{radii.md}" }
|
2283
|
+
l3: { value: "{radii.md}" },
|
2284
|
+
control: {
|
2285
|
+
sm: {
|
2286
|
+
value: "calc({radii.xs} * var(--scale-factor) * var(--radius-control))"
|
2287
|
+
},
|
2288
|
+
md: {
|
2289
|
+
value: "calc({radii.sm} * var(--scale-factor) * var(--radius-control))"
|
2290
|
+
},
|
2291
|
+
lg: {
|
2292
|
+
value: "calc({radii.md} * var(--scale-factor) * var(--radius-control))"
|
2293
|
+
}
|
2294
|
+
},
|
2295
|
+
panel: {
|
2296
|
+
sm: {
|
2297
|
+
value: "calc({radii.sm} * var(--scale-factor) * var(--radius-panel))"
|
2298
|
+
},
|
2299
|
+
md: {
|
2300
|
+
value: "calc({radii.md} * var(--scale-factor) * var(--radius-panel))"
|
2301
|
+
},
|
2302
|
+
lg: {
|
2303
|
+
value: "calc({radii.lg} * var(--scale-factor) * var(--radius-panel))"
|
2304
|
+
}
|
2305
|
+
},
|
2306
|
+
indicator: {
|
2307
|
+
sm: {
|
2308
|
+
value: "calc({radii.xs} * var(--scale-factor) * var(--radius-indicator))"
|
2309
|
+
},
|
2310
|
+
md: {
|
2311
|
+
value: "calc({radii.sm} * var(--scale-factor) * var(--radius-indicator))"
|
2312
|
+
},
|
2313
|
+
lg: {
|
2314
|
+
value: "calc({radii.md} * var(--scale-factor) * var(--radius-indicator))"
|
2315
|
+
}
|
2316
|
+
}
|
2272
2317
|
});
|
2273
2318
|
|
2274
2319
|
// src/theme/semantic-tokens/shadows.ts
|
@@ -2276,37 +2321,37 @@ import { defineSemanticTokens as defineSemanticTokens3 } from "@chakra-ui/react"
|
|
2276
2321
|
var semanticShadows = defineSemanticTokens3.shadows({
|
2277
2322
|
xs: {
|
2278
2323
|
value: {
|
2279
|
-
_light: "0px 1px 2px {colors.gray.900/5}, 0px 0px 1px {colors.gray.900/
|
2324
|
+
_light: "0px 1px 2px {colors.gray.900/5}, 0px 0px 1px {colors.gray.900/5}",
|
2280
2325
|
_dark: "0px 1px 1px {black/64}, 0px 0px 1px inset {colors.gray.300/20}"
|
2281
2326
|
}
|
2282
2327
|
},
|
2283
2328
|
sm: {
|
2284
2329
|
value: {
|
2285
|
-
_light: "0px 2px 4px {colors.gray.900/5}, 0px 0px
|
2330
|
+
_light: "0px 2px 4px {colors.gray.900/5}, 0px 0px 2px {colors.gray.900/5}",
|
2286
2331
|
_dark: "0px 2px 4px {black/64}, 0px 0px 1px inset {colors.gray.300/30}"
|
2287
2332
|
}
|
2288
2333
|
},
|
2289
2334
|
md: {
|
2290
2335
|
value: {
|
2291
|
-
_light: "0px 4px 8px {colors.gray.900/5}, 0px 0px
|
2336
|
+
_light: "0px 4px 8px {colors.gray.900/5}, 0px 0px 3px {colors.gray.900/5}",
|
2292
2337
|
_dark: "0px 4px 8px {black/64}, 0px 0px 1px inset {colors.gray.300/30}"
|
2293
2338
|
}
|
2294
2339
|
},
|
2295
2340
|
lg: {
|
2296
2341
|
value: {
|
2297
|
-
_light: "0px 8px 16px {colors.gray.900/5}, 0px 0px
|
2342
|
+
_light: "0px 8px 16px {colors.gray.900/5}, 0px 0px 4px {colors.gray.900/5}",
|
2298
2343
|
_dark: "0px 8px 16px {black/64}, 0px 0px 1px inset {colors.gray.300/30}"
|
2299
2344
|
}
|
2300
2345
|
},
|
2301
2346
|
xl: {
|
2302
2347
|
value: {
|
2303
|
-
_light: "0px 16px 24px {colors.gray.900/5}, 0px 0px
|
2348
|
+
_light: "0px 16px 24px {colors.gray.900/5}, 0px 0px 5px {colors.gray.900/5}",
|
2304
2349
|
_dark: "0px 16px 24px {black/64}, 0px 0px 1px inset {colors.gray.300/30}"
|
2305
2350
|
}
|
2306
2351
|
},
|
2307
2352
|
"2xl": {
|
2308
2353
|
value: {
|
2309
|
-
_light: "0px 24px 40px {colors.gray.900/10}, 0px 0px
|
2354
|
+
_light: "0px 24px 40px {colors.gray.900/10}, 0px 0px 6px {colors.gray.900/5}",
|
2310
2355
|
_dark: "0px 24px 40px {black/64}, 0px 0px 1px inset {colors.gray.300/30}"
|
2311
2356
|
}
|
2312
2357
|
},
|
@@ -2503,15 +2548,95 @@ var avatarSlotRecipe = defineSlotRecipe2({
|
|
2503
2548
|
}
|
2504
2549
|
});
|
2505
2550
|
|
2506
|
-
// src/components/
|
2551
|
+
// src/components/data-list/data-list.recipe.ts
|
2507
2552
|
import { defineSlotRecipe as defineSlotRecipe3 } from "@chakra-ui/react";
|
2553
|
+
import { dataListAnatomy } from "@chakra-ui/react/anatomy";
|
2554
|
+
var dataListSlotRecipe = defineSlotRecipe3({
|
2555
|
+
slots: dataListAnatomy.keys(),
|
2556
|
+
className: "chakra-data-list",
|
2557
|
+
base: {
|
2558
|
+
itemLabel: {
|
2559
|
+
color: "fg.muted",
|
2560
|
+
display: "flex",
|
2561
|
+
alignItems: "center",
|
2562
|
+
gap: "1"
|
2563
|
+
},
|
2564
|
+
itemValue: {
|
2565
|
+
display: "flex",
|
2566
|
+
minWidth: "0",
|
2567
|
+
flex: "1"
|
2568
|
+
}
|
2569
|
+
},
|
2570
|
+
variants: {
|
2571
|
+
orientation: {
|
2572
|
+
horizontal: {
|
2573
|
+
root: {
|
2574
|
+
display: "flex",
|
2575
|
+
flexDirection: "column"
|
2576
|
+
},
|
2577
|
+
item: {
|
2578
|
+
display: "inline-flex",
|
2579
|
+
alignItems: "center",
|
2580
|
+
gap: "4"
|
2581
|
+
},
|
2582
|
+
itemLabel: {
|
2583
|
+
minWidth: "120px"
|
2584
|
+
}
|
2585
|
+
},
|
2586
|
+
vertical: {
|
2587
|
+
root: {
|
2588
|
+
display: "flex",
|
2589
|
+
flexDirection: "column"
|
2590
|
+
},
|
2591
|
+
item: {
|
2592
|
+
display: "flex",
|
2593
|
+
flexDirection: "column",
|
2594
|
+
gap: "1"
|
2595
|
+
}
|
2596
|
+
}
|
2597
|
+
},
|
2598
|
+
size: {
|
2599
|
+
sm: {
|
2600
|
+
root: {
|
2601
|
+
gap: "3"
|
2602
|
+
},
|
2603
|
+
item: {
|
2604
|
+
textStyle: "xs"
|
2605
|
+
}
|
2606
|
+
},
|
2607
|
+
md: {
|
2608
|
+
root: {
|
2609
|
+
gap: "4"
|
2610
|
+
},
|
2611
|
+
item: {
|
2612
|
+
textStyle: "sm"
|
2613
|
+
}
|
2614
|
+
},
|
2615
|
+
lg: {
|
2616
|
+
root: {
|
2617
|
+
gap: "5"
|
2618
|
+
},
|
2619
|
+
item: {
|
2620
|
+
textStyle: "md"
|
2621
|
+
}
|
2622
|
+
}
|
2623
|
+
}
|
2624
|
+
},
|
2625
|
+
defaultVariants: {
|
2626
|
+
size: "md",
|
2627
|
+
orientation: "vertical"
|
2628
|
+
}
|
2629
|
+
});
|
2630
|
+
|
2631
|
+
// src/components/dialog/dialog.recipe.ts
|
2632
|
+
import { defineSlotRecipe as defineSlotRecipe4 } from "@chakra-ui/react";
|
2508
2633
|
import { dialogAnatomy } from "@chakra-ui/react/anatomy";
|
2509
|
-
var dialogSlotRecipe =
|
2634
|
+
var dialogSlotRecipe = defineSlotRecipe4({
|
2510
2635
|
slots: dialogAnatomy.keys(),
|
2511
2636
|
className: "chakra-dialog",
|
2512
2637
|
base: {
|
2513
2638
|
backdrop: {
|
2514
|
-
|
2639
|
+
layerStyle: "backdrop",
|
2515
2640
|
pos: "fixed",
|
2516
2641
|
left: 0,
|
2517
2642
|
top: 0,
|
@@ -2534,7 +2659,7 @@ var dialogSlotRecipe = defineSlotRecipe3({
|
|
2534
2659
|
position: "fixed",
|
2535
2660
|
left: 0,
|
2536
2661
|
top: 0,
|
2537
|
-
"--dialog-z-index": "zIndex.
|
2662
|
+
"--dialog-z-index": "zIndex.layer-4",
|
2538
2663
|
zIndex: "calc(var(--dialog-z-index) + var(--layer-index, 0))",
|
2539
2664
|
justifyContent: "center",
|
2540
2665
|
overscrollBehaviorY: "none"
|
@@ -2545,13 +2670,11 @@ var dialogSlotRecipe = defineSlotRecipe3({
|
|
2545
2670
|
position: "relative",
|
2546
2671
|
width: "100%",
|
2547
2672
|
outline: 0,
|
2548
|
-
borderRadius: "l3",
|
2549
2673
|
textStyle: "sm",
|
2550
2674
|
my: "var(--dialog-margin, var(--dialog-base-margin))",
|
2551
|
-
"--dialog-z-index": "zIndex.
|
2675
|
+
"--dialog-z-index": "zIndex.layer-4",
|
2552
2676
|
zIndex: "calc(var(--dialog-z-index) + var(--layer-index, 0))",
|
2553
|
-
|
2554
|
-
boxShadow: "lg",
|
2677
|
+
layerStyle: "overlay",
|
2555
2678
|
_open: {
|
2556
2679
|
animationDuration: "moderate"
|
2557
2680
|
},
|
@@ -2728,14 +2851,14 @@ var dialogSlotRecipe = defineSlotRecipe3({
|
|
2728
2851
|
});
|
2729
2852
|
|
2730
2853
|
// src/components/drawer/drawer.recipe.ts
|
2731
|
-
import { defineSlotRecipe as
|
2854
|
+
import { defineSlotRecipe as defineSlotRecipe5 } from "@chakra-ui/react";
|
2732
2855
|
import { drawerAnatomy } from "@chakra-ui/react/anatomy";
|
2733
|
-
var drawerSlotRecipe =
|
2856
|
+
var drawerSlotRecipe = defineSlotRecipe5({
|
2734
2857
|
slots: drawerAnatomy.keys(),
|
2735
2858
|
className: "chakra-drawer",
|
2736
2859
|
base: {
|
2737
2860
|
backdrop: {
|
2738
|
-
|
2861
|
+
layerStyle: "backdrop",
|
2739
2862
|
pos: "fixed",
|
2740
2863
|
insetInlineStart: 0,
|
2741
2864
|
top: 0,
|
@@ -2756,6 +2879,7 @@ var drawerSlotRecipe = defineSlotRecipe4({
|
|
2756
2879
|
width: "100vw",
|
2757
2880
|
height: "100dvh",
|
2758
2881
|
position: "fixed",
|
2882
|
+
padding: 2,
|
2759
2883
|
insetInlineStart: 0,
|
2760
2884
|
top: 0,
|
2761
2885
|
zIndex: "modal",
|
@@ -2767,12 +2891,12 @@ var drawerSlotRecipe = defineSlotRecipe4({
|
|
2767
2891
|
position: "relative",
|
2768
2892
|
width: "100%",
|
2769
2893
|
outline: 0,
|
2770
|
-
|
2894
|
+
"--drawer-z-index": "zIndex.layer-4",
|
2895
|
+
zIndex: "calc(var(--drawer-z-index) + var(--layer-index, 0))",
|
2771
2896
|
textStyle: "sm",
|
2772
2897
|
maxH: "100dvh",
|
2773
2898
|
color: "inherit",
|
2774
|
-
|
2775
|
-
boxShadow: "lg",
|
2899
|
+
layerStyle: "overlay",
|
2776
2900
|
_open: {
|
2777
2901
|
animationDuration: "slowest",
|
2778
2902
|
animationTimingFunction: "ease-in-smooth"
|
@@ -2908,72 +3032,288 @@ var drawerSlotRecipe = defineSlotRecipe4({
|
|
2908
3032
|
}
|
2909
3033
|
}
|
2910
3034
|
},
|
2911
|
-
|
3035
|
+
attached: {
|
2912
3036
|
true: {
|
2913
3037
|
positioner: {
|
2914
|
-
padding:
|
3038
|
+
padding: 0
|
2915
3039
|
},
|
2916
3040
|
content: {
|
2917
|
-
borderRadius: "
|
3041
|
+
borderRadius: "none"
|
2918
3042
|
}
|
2919
3043
|
}
|
2920
3044
|
}
|
2921
3045
|
},
|
2922
3046
|
defaultVariants: {
|
2923
3047
|
size: "xs",
|
2924
|
-
placement: "end"
|
2925
|
-
contained: true
|
3048
|
+
placement: "end"
|
2926
3049
|
}
|
2927
3050
|
});
|
2928
3051
|
|
2929
|
-
// src/components/
|
2930
|
-
import { defineSlotRecipe as
|
2931
|
-
|
2932
|
-
|
2933
|
-
slots:
|
3052
|
+
// src/components/empty-state/empty-state.recipe.ts
|
3053
|
+
import { defineSlotRecipe as defineSlotRecipe6 } from "@chakra-ui/react";
|
3054
|
+
import { emptyStateAnatomy } from "@chakra-ui/react/anatomy";
|
3055
|
+
var emptyStateSlotRecipe = defineSlotRecipe6({
|
3056
|
+
slots: emptyStateAnatomy.extendWith("actions").keys(),
|
3057
|
+
className: "chakra-empty-state",
|
2934
3058
|
base: {
|
2935
3059
|
root: {
|
2936
|
-
|
3060
|
+
width: "full",
|
3061
|
+
height: "full",
|
3062
|
+
display: "flex",
|
3063
|
+
flexDirection: "column",
|
3064
|
+
alignItems: "center",
|
3065
|
+
justifyContent: "center"
|
2937
3066
|
},
|
2938
|
-
|
3067
|
+
content: {
|
2939
3068
|
display: "flex",
|
2940
|
-
flexDirection: "
|
3069
|
+
flexDirection: "column",
|
2941
3070
|
alignItems: "center",
|
2942
|
-
justifyContent: "
|
2943
|
-
flex: 1,
|
2944
|
-
userSelect: "none",
|
2945
|
-
borderRadius: "inherit",
|
2946
|
-
outline: "none",
|
2947
|
-
_focusVisible: {
|
2948
|
-
boxShadow: "outline"
|
2949
|
-
},
|
2950
|
-
_disabled: {
|
2951
|
-
cursor: "disabled",
|
2952
|
-
opacity: 0.5,
|
2953
|
-
_hover: {
|
2954
|
-
bg: "transparent",
|
2955
|
-
_dark: {
|
2956
|
-
bg: "transparent"
|
2957
|
-
}
|
2958
|
-
},
|
2959
|
-
_active: {
|
2960
|
-
bg: "transparent",
|
2961
|
-
_dark: {
|
2962
|
-
bg: "transparent"
|
2963
|
-
}
|
2964
|
-
}
|
2965
|
-
}
|
3071
|
+
justifyContent: "center"
|
2966
3072
|
},
|
2967
|
-
|
3073
|
+
indicator: {
|
2968
3074
|
display: "flex",
|
2969
|
-
|
2970
|
-
|
2971
|
-
|
2972
|
-
|
3075
|
+
alignItems: "center",
|
3076
|
+
justifyContent: "center",
|
3077
|
+
color: "colorPalette.solid",
|
3078
|
+
_icon: {
|
3079
|
+
boxSize: "1em"
|
3080
|
+
}
|
3081
|
+
},
|
3082
|
+
title: {
|
3083
|
+
fontWeight: "semibold"
|
3084
|
+
},
|
3085
|
+
description: {
|
3086
|
+
textStyle: "sm",
|
2973
3087
|
color: "fg.muted"
|
2974
3088
|
},
|
2975
|
-
|
2976
|
-
|
3089
|
+
actions: {
|
3090
|
+
display: "flex",
|
3091
|
+
flexDirection: "row",
|
3092
|
+
gap: "2"
|
3093
|
+
}
|
3094
|
+
},
|
3095
|
+
variants: {
|
3096
|
+
size: {
|
3097
|
+
sm: {
|
3098
|
+
root: {
|
3099
|
+
px: "4",
|
3100
|
+
py: "6"
|
3101
|
+
},
|
3102
|
+
indicator: {
|
3103
|
+
textStyle: "3xl",
|
3104
|
+
mb: "2"
|
3105
|
+
},
|
3106
|
+
title: {
|
3107
|
+
textStyle: "md"
|
3108
|
+
},
|
3109
|
+
description: {
|
3110
|
+
textStyle: "xs"
|
3111
|
+
},
|
3112
|
+
content: {},
|
3113
|
+
actions: {
|
3114
|
+
mt: "2"
|
3115
|
+
}
|
3116
|
+
},
|
3117
|
+
md: {
|
3118
|
+
root: {
|
3119
|
+
px: "8",
|
3120
|
+
py: "12"
|
3121
|
+
},
|
3122
|
+
indicator: {
|
3123
|
+
textStyle: "4xl",
|
3124
|
+
mb: "3"
|
3125
|
+
},
|
3126
|
+
title: {
|
3127
|
+
textStyle: "lg"
|
3128
|
+
},
|
3129
|
+
description: {
|
3130
|
+
textStyle: "sm"
|
3131
|
+
},
|
3132
|
+
content: {},
|
3133
|
+
actions: {
|
3134
|
+
mt: "3"
|
3135
|
+
}
|
3136
|
+
},
|
3137
|
+
lg: {
|
3138
|
+
root: {
|
3139
|
+
px: "12",
|
3140
|
+
py: "16"
|
3141
|
+
},
|
3142
|
+
indicator: {
|
3143
|
+
textStyle: "6xl",
|
3144
|
+
mb: "4"
|
3145
|
+
},
|
3146
|
+
title: {
|
3147
|
+
textStyle: "xl"
|
3148
|
+
},
|
3149
|
+
description: {
|
3150
|
+
textStyle: "md"
|
3151
|
+
},
|
3152
|
+
content: {},
|
3153
|
+
actions: {
|
3154
|
+
mt: "4"
|
3155
|
+
}
|
3156
|
+
}
|
3157
|
+
},
|
3158
|
+
align: {
|
3159
|
+
start: {
|
3160
|
+
content: {
|
3161
|
+
alignItems: "flex-start"
|
3162
|
+
}
|
3163
|
+
},
|
3164
|
+
center: {
|
3165
|
+
content: {
|
3166
|
+
alignItems: "center"
|
3167
|
+
}
|
3168
|
+
}
|
3169
|
+
}
|
3170
|
+
},
|
3171
|
+
defaultVariants: {
|
3172
|
+
size: "md",
|
3173
|
+
align: "center"
|
3174
|
+
}
|
3175
|
+
});
|
3176
|
+
|
3177
|
+
// src/components/file-upload/file-upload.recipe.ts
|
3178
|
+
import { defineSlotRecipe as defineSlotRecipe7 } from "@chakra-ui/react";
|
3179
|
+
import { fileUploadAnatomy } from "@chakra-ui/react/anatomy";
|
3180
|
+
var fileUploadSlotRecipe = defineSlotRecipe7({
|
3181
|
+
className: "chakra-file-upload",
|
3182
|
+
slots: fileUploadAnatomy.keys(),
|
3183
|
+
base: {
|
3184
|
+
root: {
|
3185
|
+
display: "flex",
|
3186
|
+
flexDirection: "column",
|
3187
|
+
gap: "4",
|
3188
|
+
width: "100%",
|
3189
|
+
alignItems: "flex-start"
|
3190
|
+
},
|
3191
|
+
label: {
|
3192
|
+
fontWeight: "medium",
|
3193
|
+
textStyle: "sm"
|
3194
|
+
},
|
3195
|
+
dropzone: {
|
3196
|
+
background: "bg",
|
3197
|
+
borderRadius: "panel.md",
|
3198
|
+
borderWidth: "1px",
|
3199
|
+
borderStyle: "dashed",
|
3200
|
+
display: "flex",
|
3201
|
+
alignItems: "center",
|
3202
|
+
flexDirection: "column",
|
3203
|
+
gap: "4",
|
3204
|
+
justifyContent: "center",
|
3205
|
+
p: "4",
|
3206
|
+
transition: "backgrounds",
|
3207
|
+
focusVisibleRing: "outside",
|
3208
|
+
_dragging: {
|
3209
|
+
bg: "colorPalette.subtle",
|
3210
|
+
borderStyle: "solid",
|
3211
|
+
borderColor: "colorPalette.solid"
|
3212
|
+
}
|
3213
|
+
},
|
3214
|
+
dropzoneContent: {
|
3215
|
+
display: "flex",
|
3216
|
+
flexDirection: "column",
|
3217
|
+
alignItems: "center",
|
3218
|
+
textAlign: "center",
|
3219
|
+
gap: "4",
|
3220
|
+
textStyle: "sm"
|
3221
|
+
},
|
3222
|
+
item: {
|
3223
|
+
textStyle: "sm",
|
3224
|
+
animationName: "fade-in",
|
3225
|
+
animationDuration: "moderate",
|
3226
|
+
background: "bg",
|
3227
|
+
borderRadius: "panel.md",
|
3228
|
+
borderWidth: "1px",
|
3229
|
+
width: "100%",
|
3230
|
+
display: "flex",
|
3231
|
+
alignItems: "center",
|
3232
|
+
gap: "3",
|
3233
|
+
px: "4",
|
3234
|
+
py: "2"
|
3235
|
+
},
|
3236
|
+
itemGroup: {
|
3237
|
+
width: "100%",
|
3238
|
+
display: "flex",
|
3239
|
+
flexDirection: "column",
|
3240
|
+
gap: "3"
|
3241
|
+
},
|
3242
|
+
itemName: {
|
3243
|
+
color: "fg",
|
3244
|
+
fontWeight: "medium",
|
3245
|
+
lineClamp: "1"
|
3246
|
+
},
|
3247
|
+
itemContent: {
|
3248
|
+
display: "flex",
|
3249
|
+
flexDirection: "column",
|
3250
|
+
gap: "0.5",
|
3251
|
+
flex: "1"
|
3252
|
+
},
|
3253
|
+
itemSizeText: {
|
3254
|
+
color: "fg.muted",
|
3255
|
+
textStyle: "xs"
|
3256
|
+
},
|
3257
|
+
itemDeleteTrigger: {
|
3258
|
+
alignSelf: "flex-start"
|
3259
|
+
},
|
3260
|
+
itemPreviewImage: {
|
3261
|
+
width: "10",
|
3262
|
+
height: "10",
|
3263
|
+
objectFit: "scale-down"
|
3264
|
+
}
|
3265
|
+
},
|
3266
|
+
defaultVariants: {}
|
3267
|
+
});
|
3268
|
+
|
3269
|
+
// src/components/grid-list/grid-list.recipe.ts
|
3270
|
+
import { defineSlotRecipe as defineSlotRecipe8 } from "@chakra-ui/react";
|
3271
|
+
var gridListSlotRecipe = defineSlotRecipe8({
|
3272
|
+
className: "sui-grid-list",
|
3273
|
+
slots: ["root", "item", "header", "cell"],
|
3274
|
+
base: {
|
3275
|
+
root: {
|
3276
|
+
position: "relative"
|
3277
|
+
},
|
3278
|
+
item: {
|
3279
|
+
display: "flex",
|
3280
|
+
flexDirection: "row",
|
3281
|
+
alignItems: "center",
|
3282
|
+
justifyContent: "space-between",
|
3283
|
+
flex: 1,
|
3284
|
+
userSelect: "none",
|
3285
|
+
borderRadius: "inherit",
|
3286
|
+
outline: "none",
|
3287
|
+
_focusVisible: {
|
3288
|
+
boxShadow: "outline"
|
3289
|
+
},
|
3290
|
+
_disabled: {
|
3291
|
+
cursor: "disabled",
|
3292
|
+
opacity: 0.5,
|
3293
|
+
_hover: {
|
3294
|
+
bg: "transparent",
|
3295
|
+
_dark: {
|
3296
|
+
bg: "transparent"
|
3297
|
+
}
|
3298
|
+
},
|
3299
|
+
_active: {
|
3300
|
+
bg: "transparent",
|
3301
|
+
_dark: {
|
3302
|
+
bg: "transparent"
|
3303
|
+
}
|
3304
|
+
}
|
3305
|
+
}
|
3306
|
+
},
|
3307
|
+
header: {
|
3308
|
+
display: "flex",
|
3309
|
+
flexDirection: "row",
|
3310
|
+
position: "sticky",
|
3311
|
+
fontSize: "md",
|
3312
|
+
fontWeight: "semibold",
|
3313
|
+
color: "fg.muted"
|
3314
|
+
},
|
3315
|
+
cell: {
|
3316
|
+
flexShrink: 0
|
2977
3317
|
}
|
2978
3318
|
},
|
2979
3319
|
variants: {
|
@@ -3061,8 +3401,8 @@ var gridListSlotRecipe = defineSlotRecipe5({
|
|
3061
3401
|
});
|
3062
3402
|
|
3063
3403
|
// src/components/loading-overlay/loading-overlay.recipe.ts
|
3064
|
-
import { defineSlotRecipe as
|
3065
|
-
var loadingOverlaySlotRecipe =
|
3404
|
+
import { defineSlotRecipe as defineSlotRecipe9 } from "@chakra-ui/react";
|
3405
|
+
var loadingOverlaySlotRecipe = defineSlotRecipe9({
|
3066
3406
|
className: "sui-loading-overlay",
|
3067
3407
|
slots: ["root", "text"],
|
3068
3408
|
base: {
|
@@ -3122,9 +3462,133 @@ var loadingOverlaySlotRecipe = defineSlotRecipe6({
|
|
3122
3462
|
}
|
3123
3463
|
});
|
3124
3464
|
|
3465
|
+
// src/components/menu/menu.recipe.ts
|
3466
|
+
import { defineSlotRecipe as defineSlotRecipe10 } from "@chakra-ui/react";
|
3467
|
+
import { menuAnatomy } from "@chakra-ui/react/anatomy";
|
3468
|
+
var menuSlotRecipe = defineSlotRecipe10({
|
3469
|
+
className: "chakra-menu",
|
3470
|
+
slots: menuAnatomy.keys(),
|
3471
|
+
base: {
|
3472
|
+
content: {
|
3473
|
+
layerStyle: "overlay",
|
3474
|
+
boxShadow: "md",
|
3475
|
+
borderWidth: "1px",
|
3476
|
+
borderColor: "border",
|
3477
|
+
outline: 0,
|
3478
|
+
color: "fg",
|
3479
|
+
maxHeight: "var(--available-height)",
|
3480
|
+
"--menu-z-index": "zIndex.layer-3",
|
3481
|
+
zIndex: "calc(var(--menu-z-index) + var(--layer-index, 0))",
|
3482
|
+
overflow: "hidden",
|
3483
|
+
_open: {
|
3484
|
+
animationStyle: "slide-fade-in",
|
3485
|
+
animationDuration: "fast"
|
3486
|
+
},
|
3487
|
+
_closed: {
|
3488
|
+
animationStyle: "slide-fade-out",
|
3489
|
+
animationDuration: "faster"
|
3490
|
+
}
|
3491
|
+
},
|
3492
|
+
item: {
|
3493
|
+
textDecoration: "none",
|
3494
|
+
color: "fg",
|
3495
|
+
userSelect: "none",
|
3496
|
+
borderRadius: "control.md",
|
3497
|
+
width: "100%",
|
3498
|
+
display: "flex",
|
3499
|
+
cursor: "menuitem",
|
3500
|
+
alignItems: "center",
|
3501
|
+
textAlign: "start",
|
3502
|
+
position: "relative",
|
3503
|
+
flex: "0 0 auto",
|
3504
|
+
outline: 0,
|
3505
|
+
_disabled: {
|
3506
|
+
layerStyle: "disabled"
|
3507
|
+
}
|
3508
|
+
},
|
3509
|
+
itemText: {
|
3510
|
+
flex: "1"
|
3511
|
+
},
|
3512
|
+
itemGroupLabel: {
|
3513
|
+
px: "2",
|
3514
|
+
py: "1.5",
|
3515
|
+
fontWeight: "semibold",
|
3516
|
+
textStyle: "sm"
|
3517
|
+
},
|
3518
|
+
indicator: {
|
3519
|
+
display: "inline-flex",
|
3520
|
+
alignItems: "center",
|
3521
|
+
justifyContent: "center",
|
3522
|
+
flexShrink: "0"
|
3523
|
+
},
|
3524
|
+
itemCommand: {
|
3525
|
+
opacity: "0.6",
|
3526
|
+
textStyle: "xs",
|
3527
|
+
ms: "auto",
|
3528
|
+
ps: "4",
|
3529
|
+
letterSpacing: "widest"
|
3530
|
+
},
|
3531
|
+
separator: {
|
3532
|
+
height: "1px",
|
3533
|
+
bg: "bg.muted",
|
3534
|
+
my: "1",
|
3535
|
+
mx: "-1"
|
3536
|
+
}
|
3537
|
+
},
|
3538
|
+
variants: {
|
3539
|
+
variant: {
|
3540
|
+
subtle: {
|
3541
|
+
item: {
|
3542
|
+
_highlighted: {
|
3543
|
+
bg: "bg.subtle"
|
3544
|
+
}
|
3545
|
+
}
|
3546
|
+
},
|
3547
|
+
solid: {
|
3548
|
+
item: {
|
3549
|
+
_highlighted: {
|
3550
|
+
bg: "colorPalette.solid",
|
3551
|
+
color: "colorPalette.contrast"
|
3552
|
+
}
|
3553
|
+
}
|
3554
|
+
}
|
3555
|
+
},
|
3556
|
+
size: {
|
3557
|
+
sm: {
|
3558
|
+
content: {
|
3559
|
+
minW: "8rem",
|
3560
|
+
padding: "0.5"
|
3561
|
+
},
|
3562
|
+
item: {
|
3563
|
+
gap: "1",
|
3564
|
+
textStyle: "xs",
|
3565
|
+
py: "1",
|
3566
|
+
px: "1.5"
|
3567
|
+
}
|
3568
|
+
},
|
3569
|
+
md: {
|
3570
|
+
content: {
|
3571
|
+
minW: "8rem",
|
3572
|
+
padding: "1"
|
3573
|
+
},
|
3574
|
+
item: {
|
3575
|
+
gap: "2",
|
3576
|
+
textStyle: "sm",
|
3577
|
+
py: "1.5",
|
3578
|
+
px: "2"
|
3579
|
+
}
|
3580
|
+
}
|
3581
|
+
}
|
3582
|
+
},
|
3583
|
+
defaultVariants: {
|
3584
|
+
size: "md",
|
3585
|
+
variant: "subtle"
|
3586
|
+
}
|
3587
|
+
});
|
3588
|
+
|
3125
3589
|
// src/components/navbar/navbar.recipe.ts
|
3126
|
-
import { defineSlotRecipe as
|
3127
|
-
var navbarSlotRecipe =
|
3590
|
+
import { defineSlotRecipe as defineSlotRecipe11 } from "@chakra-ui/react";
|
3591
|
+
var navbarSlotRecipe = defineSlotRecipe11({
|
3128
3592
|
className: "sui-navbar",
|
3129
3593
|
slots: ["root", "content", "brand", "item", "link"],
|
3130
3594
|
base: {
|
@@ -3234,7 +3698,7 @@ var navbarSlotRecipe = defineSlotRecipe7({
|
|
3234
3698
|
|
3235
3699
|
// src/components/persona/persona.recipe.ts
|
3236
3700
|
import {
|
3237
|
-
defineSlotRecipe as
|
3701
|
+
defineSlotRecipe as defineSlotRecipe12,
|
3238
3702
|
defineStyle
|
3239
3703
|
} from "@chakra-ui/react";
|
3240
3704
|
var baseStyleLabel = defineStyle({
|
@@ -3244,7 +3708,7 @@ var baseStyleLabel = defineStyle({
|
|
3244
3708
|
minW: 0,
|
3245
3709
|
color: "fg"
|
3246
3710
|
});
|
3247
|
-
var personaSlotRecipe =
|
3711
|
+
var personaSlotRecipe = defineSlotRecipe12({
|
3248
3712
|
className: "sui-persona",
|
3249
3713
|
slots: [
|
3250
3714
|
"root",
|
@@ -3287,54 +3751,267 @@ var personaSlotRecipe = defineSlotRecipe8({
|
|
3287
3751
|
...baseStyleLabel,
|
3288
3752
|
color: "fg/60"
|
3289
3753
|
},
|
3290
|
-
tertiaryLabel: {
|
3291
|
-
...baseStyleLabel,
|
3292
|
-
color: "fg/60"
|
3754
|
+
tertiaryLabel: {
|
3755
|
+
...baseStyleLabel,
|
3756
|
+
color: "fg/60"
|
3757
|
+
}
|
3758
|
+
},
|
3759
|
+
variants: {
|
3760
|
+
size: {
|
3761
|
+
"2xs": {
|
3762
|
+
details: { ms: 1 },
|
3763
|
+
label: { fontSize: "xs" },
|
3764
|
+
secondaryLabel: { display: "none" },
|
3765
|
+
tertiaryLabel: { display: "none" }
|
3766
|
+
},
|
3767
|
+
xs: {
|
3768
|
+
details: { ms: 1.5 },
|
3769
|
+
label: { fontSize: "xs" },
|
3770
|
+
secondaryLabel: { display: "none" },
|
3771
|
+
tertiaryLabel: { display: "none" }
|
3772
|
+
},
|
3773
|
+
sm: {
|
3774
|
+
details: { ms: 2 },
|
3775
|
+
label: { fontSize: "sm" },
|
3776
|
+
secondaryLabel: { fontSize: "xs" },
|
3777
|
+
tertiaryLabel: { display: "none" }
|
3778
|
+
},
|
3779
|
+
md: {
|
3780
|
+
details: { ms: 2 },
|
3781
|
+
label: { fontSize: "sm" },
|
3782
|
+
secondaryLabel: { fontSize: "xs" },
|
3783
|
+
tertiaryLabel: { display: "none" }
|
3784
|
+
},
|
3785
|
+
lg: {
|
3786
|
+
details: { ms: 3 },
|
3787
|
+
label: { fontSize: "md" },
|
3788
|
+
secondaryLabel: { fontSize: "sm" },
|
3789
|
+
tertiaryLabel: { fontSize: "sm" }
|
3790
|
+
},
|
3791
|
+
xl: {
|
3792
|
+
details: { ms: 4 },
|
3793
|
+
label: { fontSize: "lg" },
|
3794
|
+
secondaryLabel: { fontSize: "md" },
|
3795
|
+
tertiaryLabel: { fontSize: "md" }
|
3796
|
+
},
|
3797
|
+
"2xl": {
|
3798
|
+
details: { ms: 4 },
|
3799
|
+
label: { fontSize: "xl" },
|
3800
|
+
secondaryLabel: { fontSize: "lg" },
|
3801
|
+
tertiaryLabel: { fontSize: "lg" }
|
3802
|
+
}
|
3803
|
+
}
|
3804
|
+
},
|
3805
|
+
defaultVariants: {
|
3806
|
+
size: "md"
|
3807
|
+
}
|
3808
|
+
});
|
3809
|
+
|
3810
|
+
// src/components/popover/popover.recipe.ts
|
3811
|
+
import { defineSlotRecipe as defineSlotRecipe13 } from "@chakra-ui/react";
|
3812
|
+
import { popoverAnatomy } from "@chakra-ui/react/anatomy";
|
3813
|
+
var popoverSlotRecipe = defineSlotRecipe13({
|
3814
|
+
className: "chakra-popover",
|
3815
|
+
slots: popoverAnatomy.keys(),
|
3816
|
+
base: {
|
3817
|
+
content: {
|
3818
|
+
layerStyle: "overlay",
|
3819
|
+
position: "relative",
|
3820
|
+
display: "flex",
|
3821
|
+
flexDirection: "column",
|
3822
|
+
textStyle: "sm",
|
3823
|
+
"--popover-bg": "colors.bg.panel",
|
3824
|
+
bg: "var(--popover-bg)",
|
3825
|
+
"--popover-size": "sizes.xs",
|
3826
|
+
"--popover-mobile-size": "calc(100dvw - 1rem)",
|
3827
|
+
width: {
|
3828
|
+
base: "min(var(--popover-mobile-size), var(--popover-size))",
|
3829
|
+
sm: "var(--popover-size)"
|
3830
|
+
},
|
3831
|
+
"--popover-z-index": "zIndex.layer-2",
|
3832
|
+
zIndex: "calc(var(--popover-z-index) + var(--layer-index, 0))",
|
3833
|
+
borderWidth: "1px",
|
3834
|
+
outline: "0",
|
3835
|
+
transformOrigin: "var(--transform-origin)",
|
3836
|
+
_open: {
|
3837
|
+
animationStyle: "scale-fade-in",
|
3838
|
+
animationDuration: "fast"
|
3839
|
+
},
|
3840
|
+
_closed: {
|
3841
|
+
animationStyle: "scale-fade-out",
|
3842
|
+
animationDuration: "faster"
|
3843
|
+
}
|
3844
|
+
},
|
3845
|
+
header: {
|
3846
|
+
paddingInline: "var(--popover-padding)",
|
3847
|
+
paddingTop: "var(--popover-padding)"
|
3848
|
+
},
|
3849
|
+
body: {
|
3850
|
+
padding: "var(--popover-padding)",
|
3851
|
+
flex: "1"
|
3852
|
+
},
|
3853
|
+
footer: {
|
3854
|
+
display: "flex",
|
3855
|
+
alignItems: "center",
|
3856
|
+
paddingInline: "var(--popover-padding)",
|
3857
|
+
paddingBottom: "var(--popover-padding)"
|
3858
|
+
},
|
3859
|
+
arrow: {
|
3860
|
+
"--arrow-size": "sizes.3",
|
3861
|
+
"--arrow-background": "var(--popover-bg)"
|
3862
|
+
},
|
3863
|
+
arrowTip: {
|
3864
|
+
borderTopWidth: "1px",
|
3865
|
+
borderInlineStartWidth: "1px"
|
3866
|
+
}
|
3867
|
+
},
|
3868
|
+
variants: {
|
3869
|
+
size: {
|
3870
|
+
xs: {
|
3871
|
+
content: {
|
3872
|
+
"--popover-padding": "spacing.3"
|
3873
|
+
}
|
3874
|
+
},
|
3875
|
+
sm: {
|
3876
|
+
content: {
|
3877
|
+
"--popover-padding": "spacing.4"
|
3878
|
+
}
|
3879
|
+
},
|
3880
|
+
md: {
|
3881
|
+
content: {
|
3882
|
+
"--popover-padding": "spacing.5"
|
3883
|
+
}
|
3884
|
+
},
|
3885
|
+
lg: {
|
3886
|
+
content: {
|
3887
|
+
"--popover-padding": "spacing.6"
|
3888
|
+
}
|
3889
|
+
}
|
3890
|
+
}
|
3891
|
+
},
|
3892
|
+
defaultVariants: {
|
3893
|
+
size: "md"
|
3894
|
+
}
|
3895
|
+
});
|
3896
|
+
|
3897
|
+
// src/components/segmented-control/segment-group.recipe.ts
|
3898
|
+
import { defineSlotRecipe as defineSlotRecipe14 } from "@chakra-ui/react";
|
3899
|
+
import { segmentGroupAnatomy } from "@chakra-ui/react/anatomy";
|
3900
|
+
var segmentGroupSlotRecipe = defineSlotRecipe14({
|
3901
|
+
className: "chakra-segment-group",
|
3902
|
+
slots: segmentGroupAnatomy.keys(),
|
3903
|
+
base: {
|
3904
|
+
root: {
|
3905
|
+
"--segment-radius": "radii.md",
|
3906
|
+
borderRadius: "md",
|
3907
|
+
display: "inline-flex",
|
3908
|
+
boxShadow: "inset",
|
3909
|
+
minW: "max-content",
|
3910
|
+
textAlign: "center",
|
3911
|
+
position: "relative",
|
3912
|
+
isolation: "isolate",
|
3913
|
+
bg: "bg.muted",
|
3914
|
+
borderWidth: "1px"
|
3915
|
+
},
|
3916
|
+
item: {
|
3917
|
+
display: "flex",
|
3918
|
+
alignItems: "center",
|
3919
|
+
userSelect: "none",
|
3920
|
+
fontSize: "sm",
|
3921
|
+
position: "relative",
|
3922
|
+
color: "fg.subtle",
|
3923
|
+
cursor: "button",
|
3924
|
+
borderRadius: "var(--segment-radius)",
|
3925
|
+
_disabled: {
|
3926
|
+
opacity: "0.5"
|
3927
|
+
},
|
3928
|
+
_hover: {
|
3929
|
+
color: "fg"
|
3930
|
+
},
|
3931
|
+
"&:has(input:focus-visible)": {
|
3932
|
+
focusRing: "inside",
|
3933
|
+
focusRingWidth: "1px"
|
3934
|
+
},
|
3935
|
+
_before: {
|
3936
|
+
content: '""',
|
3937
|
+
position: "absolute",
|
3938
|
+
insetInlineStart: 0,
|
3939
|
+
insetBlock: "0",
|
3940
|
+
bg: "border",
|
3941
|
+
width: "1px",
|
3942
|
+
transition: "opacity 0.2s"
|
3943
|
+
},
|
3944
|
+
_checked: {
|
3945
|
+
color: "fg"
|
3946
|
+
},
|
3947
|
+
"& + &[data-state=checked], &[data-state=checked] + &, &:first-of-type": {
|
3948
|
+
_before: {
|
3949
|
+
opacity: "0"
|
3950
|
+
}
|
3951
|
+
},
|
3952
|
+
"&[data-state=checked][data-ssr]": {
|
3953
|
+
shadow: "sm",
|
3954
|
+
bg: "bg",
|
3955
|
+
color: "fg",
|
3956
|
+
borderRadius: "var(--segment-radius)"
|
3957
|
+
}
|
3958
|
+
},
|
3959
|
+
indicator: {
|
3960
|
+
shadow: "sm",
|
3961
|
+
pos: "absolute",
|
3962
|
+
bg: {
|
3963
|
+
base: "bg",
|
3964
|
+
_dark: "bg.emphasized"
|
3965
|
+
},
|
3966
|
+
width: "var(--width)",
|
3967
|
+
height: "var(--height)",
|
3968
|
+
top: "var(--top)",
|
3969
|
+
left: "var(--left)",
|
3970
|
+
zIndex: -1,
|
3971
|
+
borderRadius: "var(--segment-radius)"
|
3293
3972
|
}
|
3294
3973
|
},
|
3295
3974
|
variants: {
|
3296
3975
|
size: {
|
3297
|
-
"2xs": {
|
3298
|
-
details: { ms: 1 },
|
3299
|
-
label: { fontSize: "xs" },
|
3300
|
-
secondaryLabel: { display: "none" },
|
3301
|
-
tertiaryLabel: { display: "none" }
|
3302
|
-
},
|
3303
3976
|
xs: {
|
3304
|
-
|
3305
|
-
|
3306
|
-
|
3307
|
-
|
3977
|
+
root: {
|
3978
|
+
height: "6"
|
3979
|
+
},
|
3980
|
+
item: {
|
3981
|
+
textStyle: "xs",
|
3982
|
+
px: "3",
|
3983
|
+
gap: "1"
|
3984
|
+
}
|
3308
3985
|
},
|
3309
3986
|
sm: {
|
3310
|
-
|
3311
|
-
|
3312
|
-
|
3313
|
-
|
3987
|
+
root: {
|
3988
|
+
height: "7"
|
3989
|
+
},
|
3990
|
+
item: {
|
3991
|
+
textStyle: "sm",
|
3992
|
+
px: "4",
|
3993
|
+
gap: "2"
|
3994
|
+
}
|
3314
3995
|
},
|
3315
3996
|
md: {
|
3316
|
-
|
3317
|
-
|
3318
|
-
|
3319
|
-
|
3997
|
+
root: {
|
3998
|
+
height: "8"
|
3999
|
+
},
|
4000
|
+
item: {
|
4001
|
+
textStyle: "md",
|
4002
|
+
px: "4",
|
4003
|
+
gap: "2"
|
4004
|
+
}
|
3320
4005
|
},
|
3321
4006
|
lg: {
|
3322
|
-
|
3323
|
-
|
3324
|
-
|
3325
|
-
|
3326
|
-
|
3327
|
-
|
3328
|
-
|
3329
|
-
|
3330
|
-
secondaryLabel: { fontSize: "md" },
|
3331
|
-
tertiaryLabel: { fontSize: "md" }
|
3332
|
-
},
|
3333
|
-
"2xl": {
|
3334
|
-
details: { ms: 4 },
|
3335
|
-
label: { fontSize: "xl" },
|
3336
|
-
secondaryLabel: { fontSize: "lg" },
|
3337
|
-
tertiaryLabel: { fontSize: "lg" }
|
4007
|
+
root: {
|
4008
|
+
height: "10"
|
4009
|
+
},
|
4010
|
+
item: {
|
4011
|
+
textStyle: "md",
|
4012
|
+
px: "5",
|
4013
|
+
gap: "3"
|
4014
|
+
}
|
3338
4015
|
}
|
3339
4016
|
}
|
3340
4017
|
},
|
@@ -3344,8 +4021,8 @@ var personaSlotRecipe = defineSlotRecipe8({
|
|
3344
4021
|
});
|
3345
4022
|
|
3346
4023
|
// src/components/sidebar/sidebar-item.recipe.ts
|
3347
|
-
import { defineSlotRecipe as
|
3348
|
-
var sidebarNavItemSlotRecipe =
|
4024
|
+
import { defineSlotRecipe as defineSlotRecipe15 } from "@chakra-ui/react";
|
4025
|
+
var sidebarNavItemSlotRecipe = defineSlotRecipe15({
|
3349
4026
|
className: "sui-sidebar-nav-item",
|
3350
4027
|
slots: ["item", "button", "endElement"],
|
3351
4028
|
base: {
|
@@ -3430,8 +4107,8 @@ var sidebarNavItemSlotRecipe = defineSlotRecipe9({
|
|
3430
4107
|
});
|
3431
4108
|
|
3432
4109
|
// src/components/sidebar/sidebar.recipe.ts
|
3433
|
-
import { defineSlotRecipe as
|
3434
|
-
var sidebarSlotRecipe =
|
4110
|
+
import { defineSlotRecipe as defineSlotRecipe16 } from "@chakra-ui/react";
|
4111
|
+
var sidebarSlotRecipe = defineSlotRecipe16({
|
3435
4112
|
className: "sui-sidebar",
|
3436
4113
|
slots: [
|
3437
4114
|
"root",
|
@@ -3667,9 +4344,9 @@ var sidebarSlotRecipe = defineSlotRecipe10({
|
|
3667
4344
|
});
|
3668
4345
|
|
3669
4346
|
// src/components/status/status.recipe.ts
|
3670
|
-
import { defineSlotRecipe as
|
4347
|
+
import { defineSlotRecipe as defineSlotRecipe17 } from "@chakra-ui/react";
|
3671
4348
|
import { statusAnatomy } from "@chakra-ui/react/anatomy";
|
3672
|
-
var statusSlotRecipe =
|
4349
|
+
var statusSlotRecipe = defineSlotRecipe17({
|
3673
4350
|
className: "chakra-status",
|
3674
4351
|
slots: statusAnatomy.keys(),
|
3675
4352
|
base: {
|
@@ -3679,45 +4356,359 @@ var statusSlotRecipe = defineSlotRecipe11({
|
|
3679
4356
|
alignItems: "center",
|
3680
4357
|
gap: "2"
|
3681
4358
|
},
|
3682
|
-
indicator: {
|
3683
|
-
width: "0.64em",
|
3684
|
-
height: "0.64em",
|
3685
|
-
flexShrink: 0,
|
3686
|
-
borderRadius: "full",
|
3687
|
-
forcedColorAdjust: "none",
|
3688
|
-
bg: "colorPalette.solid"
|
3689
|
-
}
|
3690
|
-
},
|
3691
|
-
variants: {
|
4359
|
+
indicator: {
|
4360
|
+
width: "0.64em",
|
4361
|
+
height: "0.64em",
|
4362
|
+
flexShrink: 0,
|
4363
|
+
borderRadius: "full",
|
4364
|
+
forcedColorAdjust: "none",
|
4365
|
+
bg: "colorPalette.solid"
|
4366
|
+
}
|
4367
|
+
},
|
4368
|
+
variants: {
|
4369
|
+
size: {
|
4370
|
+
sm: {
|
4371
|
+
root: {
|
4372
|
+
textStyle: "xs"
|
4373
|
+
}
|
4374
|
+
},
|
4375
|
+
md: {
|
4376
|
+
root: {
|
4377
|
+
textStyle: "sm"
|
4378
|
+
}
|
4379
|
+
},
|
4380
|
+
lg: {
|
4381
|
+
root: {
|
4382
|
+
textStyle: "md"
|
4383
|
+
}
|
4384
|
+
}
|
4385
|
+
}
|
4386
|
+
},
|
4387
|
+
defaultVariants: {
|
4388
|
+
size: "md"
|
4389
|
+
}
|
4390
|
+
});
|
4391
|
+
|
4392
|
+
// src/components/tabs/tabs.recipe.ts
|
4393
|
+
import { defineSlotRecipe as defineSlotRecipe18 } from "@chakra-ui/react";
|
4394
|
+
import { tabsAnatomy } from "@chakra-ui/react/anatomy";
|
4395
|
+
var tabsSlotRecipe = defineSlotRecipe18({
|
4396
|
+
slots: tabsAnatomy.keys(),
|
4397
|
+
className: "chakra-tabs",
|
4398
|
+
base: {
|
4399
|
+
root: {
|
4400
|
+
colorPalette: "gray",
|
4401
|
+
"--tabs-trigger-radius": "radii.control.md",
|
4402
|
+
position: "relative",
|
4403
|
+
_horizontal: {
|
4404
|
+
display: "block"
|
4405
|
+
},
|
4406
|
+
_vertical: {
|
4407
|
+
display: "flex"
|
4408
|
+
}
|
4409
|
+
},
|
4410
|
+
list: {
|
4411
|
+
display: "inline-flex",
|
4412
|
+
position: "relative",
|
4413
|
+
isolation: "isolate",
|
4414
|
+
"--tabs-indicator-shadow": "shadows.xs",
|
4415
|
+
"--tabs-indicator-bg": "colors.bg",
|
4416
|
+
minH: "var(--tabs-height)",
|
4417
|
+
_horizontal: {
|
4418
|
+
flexDirection: "row"
|
4419
|
+
},
|
4420
|
+
_vertical: {
|
4421
|
+
flexDirection: "column"
|
4422
|
+
}
|
4423
|
+
},
|
4424
|
+
trigger: {
|
4425
|
+
outline: "0",
|
4426
|
+
minW: "var(--tabs-height)",
|
4427
|
+
height: "var(--tabs-height)",
|
4428
|
+
display: "flex",
|
4429
|
+
alignItems: "center",
|
4430
|
+
fontWeight: "medium",
|
4431
|
+
position: "relative",
|
4432
|
+
cursor: "button",
|
4433
|
+
gap: "2",
|
4434
|
+
_focusVisible: {
|
4435
|
+
zIndex: 1,
|
4436
|
+
focusVisibleRing: "outside"
|
4437
|
+
},
|
4438
|
+
_disabled: {
|
4439
|
+
cursor: "not-allowed",
|
4440
|
+
opacity: 0.5
|
4441
|
+
}
|
4442
|
+
},
|
4443
|
+
content: {
|
4444
|
+
focusVisibleRing: "inside",
|
4445
|
+
_horizontal: {
|
4446
|
+
width: "100%",
|
4447
|
+
pt: "var(--tabs-content-padding)"
|
4448
|
+
},
|
4449
|
+
_vertical: {
|
4450
|
+
height: "100%",
|
4451
|
+
ps: "var(--tabs-content-padding)"
|
4452
|
+
}
|
4453
|
+
},
|
4454
|
+
indicator: {
|
4455
|
+
width: "var(--width)",
|
4456
|
+
height: "var(--height)",
|
4457
|
+
borderRadius: "var(--tabs-indicator-radius)",
|
4458
|
+
bg: "var(--tabs-indicator-bg)",
|
4459
|
+
shadow: "var(--tabs-indicator-shadow)",
|
4460
|
+
zIndex: -1
|
4461
|
+
}
|
4462
|
+
},
|
4463
|
+
variants: {
|
4464
|
+
fitted: {
|
4465
|
+
true: {
|
4466
|
+
list: {
|
4467
|
+
display: "flex"
|
4468
|
+
},
|
4469
|
+
trigger: {
|
4470
|
+
flex: 1,
|
4471
|
+
textAlign: "center",
|
4472
|
+
justifyContent: "center"
|
4473
|
+
}
|
4474
|
+
}
|
4475
|
+
},
|
4476
|
+
justify: {
|
4477
|
+
start: {
|
4478
|
+
list: {
|
4479
|
+
justifyContent: "flex-start"
|
4480
|
+
}
|
4481
|
+
},
|
4482
|
+
center: {
|
4483
|
+
list: {
|
4484
|
+
justifyContent: "center"
|
4485
|
+
}
|
4486
|
+
},
|
4487
|
+
end: {
|
4488
|
+
list: {
|
4489
|
+
justifyContent: "flex-end"
|
4490
|
+
}
|
4491
|
+
}
|
4492
|
+
},
|
3692
4493
|
size: {
|
3693
|
-
|
4494
|
+
xs: {
|
3694
4495
|
root: {
|
4496
|
+
"--tabs-height": "sizes.6",
|
4497
|
+
"--tabs-content-padding": "spacing.2"
|
4498
|
+
},
|
4499
|
+
trigger: {
|
4500
|
+
py: "1",
|
4501
|
+
px: "2",
|
3695
4502
|
textStyle: "xs"
|
3696
4503
|
}
|
3697
4504
|
},
|
4505
|
+
sm: {
|
4506
|
+
root: {
|
4507
|
+
"--tabs-height": "sizes.7",
|
4508
|
+
"--tabs-content-padding": "spacing.3"
|
4509
|
+
},
|
4510
|
+
trigger: {
|
4511
|
+
py: "1",
|
4512
|
+
px: "3",
|
4513
|
+
textStyle: "sm"
|
4514
|
+
}
|
4515
|
+
},
|
3698
4516
|
md: {
|
3699
4517
|
root: {
|
4518
|
+
"--tabs-height": "sizes.8",
|
4519
|
+
"--tabs-content-padding": "spacing.4"
|
4520
|
+
},
|
4521
|
+
trigger: {
|
4522
|
+
py: "2",
|
4523
|
+
px: "4",
|
3700
4524
|
textStyle: "sm"
|
3701
4525
|
}
|
3702
4526
|
},
|
3703
4527
|
lg: {
|
3704
4528
|
root: {
|
4529
|
+
"--tabs-height": "sizes.10",
|
4530
|
+
"--tabs-content-padding": "spacing.4.5"
|
4531
|
+
},
|
4532
|
+
trigger: {
|
4533
|
+
py: "2",
|
4534
|
+
px: "4.5",
|
3705
4535
|
textStyle: "md"
|
3706
4536
|
}
|
3707
4537
|
}
|
4538
|
+
},
|
4539
|
+
variant: {
|
4540
|
+
line: {
|
4541
|
+
list: {
|
4542
|
+
display: "flex",
|
4543
|
+
borderColor: "border",
|
4544
|
+
_horizontal: {
|
4545
|
+
borderBottomWidth: "1px"
|
4546
|
+
},
|
4547
|
+
_vertical: {
|
4548
|
+
borderEndWidth: "1px"
|
4549
|
+
}
|
4550
|
+
},
|
4551
|
+
trigger: {
|
4552
|
+
color: "fg.muted",
|
4553
|
+
_hover: {
|
4554
|
+
color: "fg.subtle"
|
4555
|
+
},
|
4556
|
+
_disabled: {
|
4557
|
+
_active: { bg: "initial" }
|
4558
|
+
},
|
4559
|
+
_selected: {
|
4560
|
+
color: "fg !important",
|
4561
|
+
_horizontal: {
|
4562
|
+
layerStyle: "indicator.bottom",
|
4563
|
+
"--indicator-offset-y": "-1px",
|
4564
|
+
"--indicator-color": "colors.colorPalette.solid"
|
4565
|
+
},
|
4566
|
+
_vertical: {
|
4567
|
+
layerStyle: "indicator.end",
|
4568
|
+
"--indicator-offset-x": "-1px"
|
4569
|
+
}
|
4570
|
+
}
|
4571
|
+
}
|
4572
|
+
},
|
4573
|
+
pills: {
|
4574
|
+
list: {
|
4575
|
+
gap: 2
|
4576
|
+
},
|
4577
|
+
trigger: {
|
4578
|
+
borderRadius: "var(--tabs-trigger-radius)",
|
4579
|
+
color: "fg.muted",
|
4580
|
+
borderWidth: "1px",
|
4581
|
+
borderColor: "border.emphasized",
|
4582
|
+
_hover: {
|
4583
|
+
bg: "bg.muted",
|
4584
|
+
color: "fg.subtle"
|
4585
|
+
},
|
4586
|
+
_selected: {
|
4587
|
+
bg: "colorPalette.subtle !important",
|
4588
|
+
color: "colorPalette.fg !important",
|
4589
|
+
borderColor: "colorPalette.solid/50"
|
4590
|
+
}
|
4591
|
+
}
|
4592
|
+
},
|
4593
|
+
ghost: {
|
4594
|
+
list: {
|
4595
|
+
gap: 2
|
4596
|
+
},
|
4597
|
+
trigger: {
|
4598
|
+
borderRadius: "var(--tabs-trigger-radius)",
|
4599
|
+
color: "fg.muted",
|
4600
|
+
_hover: {
|
4601
|
+
bg: "bg.muted",
|
4602
|
+
color: "fg.subtle"
|
4603
|
+
},
|
4604
|
+
_selected: {
|
4605
|
+
bg: "colorPalette.subtle !important",
|
4606
|
+
color: "colorPalette.fg !important"
|
4607
|
+
}
|
4608
|
+
}
|
4609
|
+
},
|
4610
|
+
enclosed: {
|
4611
|
+
list: {
|
4612
|
+
bg: "bg.muted",
|
4613
|
+
boxShadow: "inset",
|
4614
|
+
borderRadius: "md",
|
4615
|
+
borderWidth: "1px",
|
4616
|
+
minH: "calc(var(--tabs-height) - 4px)"
|
4617
|
+
},
|
4618
|
+
trigger: {
|
4619
|
+
justifyContent: "center",
|
4620
|
+
color: "fg.muted",
|
4621
|
+
borderRadius: "var(--tabs-trigger-radius)",
|
4622
|
+
_selected: {
|
4623
|
+
bg: "bg",
|
4624
|
+
color: "colorPalette.fg",
|
4625
|
+
shadow: "sm"
|
4626
|
+
}
|
4627
|
+
}
|
4628
|
+
},
|
4629
|
+
outline: {
|
4630
|
+
list: {
|
4631
|
+
"--line-thickness": "1px",
|
4632
|
+
"--line-offset": "calc(var(--line-thickness) * -1)",
|
4633
|
+
borderColor: "border",
|
4634
|
+
display: "flex",
|
4635
|
+
_horizontal: {
|
4636
|
+
_before: {
|
4637
|
+
content: '""',
|
4638
|
+
position: "absolute",
|
4639
|
+
bottom: "0px",
|
4640
|
+
width: "100%",
|
4641
|
+
borderBottomWidth: "var(--line-thickness)",
|
4642
|
+
borderBottomColor: "border"
|
4643
|
+
}
|
4644
|
+
},
|
4645
|
+
_vertical: {
|
4646
|
+
_before: {
|
4647
|
+
content: '""',
|
4648
|
+
position: "absolute",
|
4649
|
+
insetInline: "var(--line-offset)",
|
4650
|
+
height: "calc(100% - calc(var(--line-thickness) * 2))",
|
4651
|
+
borderEndWidth: "var(--line-thickness)",
|
4652
|
+
borderEndColor: "border"
|
4653
|
+
}
|
4654
|
+
}
|
4655
|
+
},
|
4656
|
+
trigger: {
|
4657
|
+
color: "fg.muted",
|
4658
|
+
borderWidth: "1px",
|
4659
|
+
borderColor: "transparent",
|
4660
|
+
_selected: {
|
4661
|
+
bg: "currentBg",
|
4662
|
+
color: "colorPalette.fg"
|
4663
|
+
},
|
4664
|
+
_horizontal: {
|
4665
|
+
borderTopRadius: "var(--tabs-trigger-radius)",
|
4666
|
+
marginBottom: "var(--line-offset)",
|
4667
|
+
marginEnd: { _notLast: "var(--line-offset)" },
|
4668
|
+
_selected: {
|
4669
|
+
borderColor: "border",
|
4670
|
+
borderBottomColor: "transparent"
|
4671
|
+
}
|
4672
|
+
},
|
4673
|
+
_vertical: {
|
4674
|
+
borderStartRadius: "var(--tabs-trigger-radius)",
|
4675
|
+
marginEnd: "var(--line-offset)",
|
4676
|
+
marginBottom: { _notLast: "var(--line-offset)" },
|
4677
|
+
_selected: {
|
4678
|
+
borderColor: "border",
|
4679
|
+
borderEndColor: "transparent"
|
4680
|
+
}
|
4681
|
+
}
|
4682
|
+
}
|
4683
|
+
},
|
4684
|
+
plain: {
|
4685
|
+
trigger: {
|
4686
|
+
color: "fg.muted",
|
4687
|
+
_selected: {
|
4688
|
+
color: "colorPalette.fg"
|
4689
|
+
},
|
4690
|
+
borderRadius: "var(--tabs-trigger-radius)",
|
4691
|
+
"&[data-selected][data-ssr]": {
|
4692
|
+
bg: "var(--tabs-indicator-bg)",
|
4693
|
+
shadow: "var(--tabs-indicator-shadow)",
|
4694
|
+
borderRadius: "var(--tabs-indicator-radius)"
|
4695
|
+
}
|
4696
|
+
}
|
4697
|
+
}
|
3708
4698
|
}
|
3709
4699
|
},
|
3710
4700
|
defaultVariants: {
|
3711
|
-
size: "md"
|
4701
|
+
size: "md",
|
4702
|
+
variant: "line"
|
3712
4703
|
}
|
3713
4704
|
});
|
3714
4705
|
|
3715
4706
|
// src/components/tag/tag.recipe.ts
|
3716
|
-
import { defineSlotRecipe as
|
4707
|
+
import { defineSlotRecipe as defineSlotRecipe19 } from "@chakra-ui/react";
|
3717
4708
|
import { tagAnatomy } from "@chakra-ui/react/anatomy";
|
3718
4709
|
var _a;
|
3719
4710
|
var badgeVariant = (_a = badgeRecipe.variants) == null ? void 0 : _a.variant;
|
3720
|
-
var tagSlotRecipe =
|
4711
|
+
var tagSlotRecipe = defineSlotRecipe19({
|
3721
4712
|
slots: tagAnatomy.keys(),
|
3722
4713
|
className: "chakra-tag",
|
3723
4714
|
base: {
|
@@ -3847,31 +4838,177 @@ var tagSlotRecipe = defineSlotRecipe12({
|
|
3847
4838
|
}
|
3848
4839
|
}
|
3849
4840
|
},
|
3850
|
-
variant: {
|
3851
|
-
subtle: {
|
3852
|
-
root: badgeVariant == null ? void 0 : badgeVariant.subtle
|
3853
|
-
},
|
3854
|
-
solid: {
|
3855
|
-
root: badgeVariant == null ? void 0 : badgeVariant.solid
|
3856
|
-
},
|
3857
|
-
outline: {
|
3858
|
-
root: badgeVariant == null ? void 0 : badgeVariant.outline
|
4841
|
+
variant: {
|
4842
|
+
subtle: {
|
4843
|
+
root: badgeVariant == null ? void 0 : badgeVariant.subtle
|
4844
|
+
},
|
4845
|
+
solid: {
|
4846
|
+
root: badgeVariant == null ? void 0 : badgeVariant.solid
|
4847
|
+
},
|
4848
|
+
outline: {
|
4849
|
+
root: badgeVariant == null ? void 0 : badgeVariant.outline
|
4850
|
+
},
|
4851
|
+
surface: {
|
4852
|
+
root: badgeVariant == null ? void 0 : badgeVariant.surface
|
4853
|
+
}
|
4854
|
+
}
|
4855
|
+
},
|
4856
|
+
defaultVariants: {
|
4857
|
+
size: "md",
|
4858
|
+
variant: "surface"
|
4859
|
+
}
|
4860
|
+
});
|
4861
|
+
|
4862
|
+
// src/components/toaster/toast.recipe.ts
|
4863
|
+
import { defineSlotRecipe as defineSlotRecipe20 } from "@chakra-ui/react";
|
4864
|
+
import { toastAnatomy } from "@chakra-ui/react/anatomy";
|
4865
|
+
var toastSlotRecipe = defineSlotRecipe20({
|
4866
|
+
slots: toastAnatomy.keys(),
|
4867
|
+
className: "chakra-toast",
|
4868
|
+
base: {
|
4869
|
+
root: {
|
4870
|
+
width: "full",
|
4871
|
+
display: "flex",
|
4872
|
+
alignItems: "flex-start",
|
4873
|
+
position: "relative",
|
4874
|
+
gap: "2",
|
4875
|
+
py: "3",
|
4876
|
+
ps: "3",
|
4877
|
+
pe: "6",
|
4878
|
+
borderRadius: "md",
|
4879
|
+
borderWidth: "1px",
|
4880
|
+
translate: "var(--x) var(--y)",
|
4881
|
+
scale: "var(--scale)",
|
4882
|
+
zIndex: "var(--z-index)",
|
4883
|
+
height: "var(--height, var(--toast-height))",
|
4884
|
+
opacity: "var(--opacity)",
|
4885
|
+
willChange: "translate, opacity, scale, height",
|
4886
|
+
transition: "translate 400ms, scale 400ms, opacity 400ms, height 200ms, box-shadow 200ms",
|
4887
|
+
transitionTimingFunction: "bounce-in",
|
4888
|
+
_closed: {
|
4889
|
+
transition: "translate 400ms, scale 400ms, height 200ms, opacity 200ms",
|
4890
|
+
transitionTimingFunction: "bounce-out"
|
4891
|
+
},
|
4892
|
+
bg: "bg.panel",
|
4893
|
+
color: "fg",
|
4894
|
+
boxShadow: "lg",
|
4895
|
+
overflow: "hidden",
|
4896
|
+
"--toast-indicated-color": "colors.fg.muted",
|
4897
|
+
"&[data-type=warning]": {
|
4898
|
+
"--toast-indicated-color": "colors.fg.warning"
|
4899
|
+
},
|
4900
|
+
"&[data-type=success]": {
|
4901
|
+
"--toast-indicated-color": "colors.fg.success"
|
4902
|
+
},
|
4903
|
+
"&[data-type=error]": {
|
4904
|
+
"--toast-indicated-color": "colors.fg.error"
|
4905
|
+
},
|
4906
|
+
"&[data-overlap]": {
|
4907
|
+
_before: {
|
4908
|
+
content: '""',
|
4909
|
+
position: "absolute",
|
4910
|
+
inset: "0",
|
4911
|
+
maskImage: "linear-gradient(to bottom, transparent, black 50%)"
|
4912
|
+
}
|
4913
|
+
}
|
4914
|
+
},
|
4915
|
+
title: {
|
4916
|
+
fontWeight: "medium",
|
4917
|
+
textStyle: "sm",
|
4918
|
+
marginEnd: "2"
|
4919
|
+
},
|
4920
|
+
description: {
|
4921
|
+
display: "inline",
|
4922
|
+
textStyle: "sm",
|
4923
|
+
opacity: "0.8"
|
4924
|
+
},
|
4925
|
+
indicator: {
|
4926
|
+
flexShrink: "0",
|
4927
|
+
boxSize: "5",
|
4928
|
+
color: "var(--toast-indicated-color)"
|
4929
|
+
},
|
4930
|
+
actionTrigger: {
|
4931
|
+
cursor: "button",
|
4932
|
+
textStyle: "sm",
|
4933
|
+
fontWeight: "medium",
|
4934
|
+
height: "6",
|
4935
|
+
px: "3",
|
4936
|
+
ms: "-3",
|
4937
|
+
borderRadius: "sm",
|
4938
|
+
alignSelf: "flex-start",
|
4939
|
+
transition: "background 200ms",
|
4940
|
+
color: "colorPalette.solid/80",
|
4941
|
+
_hover: {
|
4942
|
+
bg: "bg.subtle",
|
4943
|
+
color: "colorPalette.solid"
|
4944
|
+
}
|
4945
|
+
},
|
4946
|
+
closeTrigger: {
|
4947
|
+
position: "absolute",
|
4948
|
+
top: "2",
|
4949
|
+
insetEnd: "2"
|
4950
|
+
}
|
4951
|
+
}
|
4952
|
+
});
|
4953
|
+
|
4954
|
+
// src/components/tooltip/tooltip.recipe.ts
|
4955
|
+
import { defineSlotRecipe as defineSlotRecipe21 } from "@chakra-ui/react";
|
4956
|
+
import { tooltipAnatomy } from "@chakra-ui/react/anatomy";
|
4957
|
+
var tooltipSlotRecipe = defineSlotRecipe21({
|
4958
|
+
slots: tooltipAnatomy.keys(),
|
4959
|
+
className: "chakra-tooltip",
|
4960
|
+
base: {
|
4961
|
+
content: {
|
4962
|
+
"--tooltip-bg": "colors.bg",
|
4963
|
+
display: "flex",
|
4964
|
+
alignItems: "center",
|
4965
|
+
bg: "var(--tooltip-bg)",
|
4966
|
+
color: "fg",
|
4967
|
+
px: "2.5",
|
4968
|
+
py: "1",
|
4969
|
+
borderRadius: "l2",
|
4970
|
+
fontWeight: "medium",
|
4971
|
+
textStyle: "xs",
|
4972
|
+
boxShadow: "md",
|
4973
|
+
maxW: "xs",
|
4974
|
+
zIndex: "tooltip",
|
4975
|
+
transformOrigin: "var(--transform-origin)",
|
4976
|
+
_open: {
|
4977
|
+
animationStyle: "scale-fade-in",
|
4978
|
+
animationDuration: "fast"
|
3859
4979
|
},
|
3860
|
-
|
3861
|
-
|
4980
|
+
_closed: {
|
4981
|
+
animationStyle: "scale-fade-out",
|
4982
|
+
animationDuration: "fast"
|
3862
4983
|
}
|
4984
|
+
},
|
4985
|
+
arrow: {
|
4986
|
+
"--arrow-size": "sizes.2",
|
4987
|
+
"--arrow-background": "var(--tooltip-bg)",
|
4988
|
+
zIndex: "-1"
|
4989
|
+
},
|
4990
|
+
arrowTip: {
|
4991
|
+
borderTopWidth: "1px",
|
4992
|
+
borderInlineStartWidth: "1px",
|
4993
|
+
borderColor: "var(--tooltip-bg)"
|
3863
4994
|
}
|
3864
4995
|
},
|
3865
|
-
|
3866
|
-
|
3867
|
-
|
4996
|
+
variants: {
|
4997
|
+
variant: {
|
4998
|
+
inverted: {
|
4999
|
+
content: {
|
5000
|
+
"--tooltip-bg": "colors.bg.inverted",
|
5001
|
+
color: "fg.inverted"
|
5002
|
+
}
|
5003
|
+
}
|
5004
|
+
}
|
3868
5005
|
}
|
3869
5006
|
});
|
3870
5007
|
|
3871
5008
|
// src/theme/recipes/chakra/accordion.ts
|
3872
|
-
import { defineSlotRecipe as
|
5009
|
+
import { defineSlotRecipe as defineSlotRecipe22 } from "@chakra-ui/react";
|
3873
5010
|
import { accordionAnatomy } from "@chakra-ui/react/anatomy";
|
3874
|
-
var accordionSlotRecipe =
|
5011
|
+
var accordionSlotRecipe = defineSlotRecipe22({
|
3875
5012
|
className: "chakra-accordion",
|
3876
5013
|
slots: accordionAnatomy.keys(),
|
3877
5014
|
base: {
|
@@ -4009,9 +5146,9 @@ var accordionSlotRecipe = defineSlotRecipe13({
|
|
4009
5146
|
});
|
4010
5147
|
|
4011
5148
|
// src/theme/recipes/chakra/action-bar.ts
|
4012
|
-
import { defineSlotRecipe as
|
5149
|
+
import { defineSlotRecipe as defineSlotRecipe23 } from "@chakra-ui/react";
|
4013
5150
|
import { actionBarAnatomy } from "@chakra-ui/react/anatomy";
|
4014
|
-
var actionBarSlotRecipe =
|
5151
|
+
var actionBarSlotRecipe = defineSlotRecipe23({
|
4015
5152
|
className: "chakra-action-bar",
|
4016
5153
|
slots: actionBarAnatomy.keys(),
|
4017
5154
|
base: {
|
@@ -4067,9 +5204,9 @@ var actionBarSlotRecipe = defineSlotRecipe14({
|
|
4067
5204
|
});
|
4068
5205
|
|
4069
5206
|
// src/theme/recipes/chakra/alert.ts
|
4070
|
-
import { defineSlotRecipe as
|
5207
|
+
import { defineSlotRecipe as defineSlotRecipe24 } from "@chakra-ui/react";
|
4071
5208
|
import { alertAnatomy } from "@chakra-ui/react/anatomy";
|
4072
|
-
var alertSlotRecipe =
|
5209
|
+
var alertSlotRecipe = defineSlotRecipe24({
|
4073
5210
|
slots: alertAnatomy.keys(),
|
4074
5211
|
className: "chakra-alert",
|
4075
5212
|
base: {
|
@@ -4216,9 +5353,9 @@ var alertSlotRecipe = defineSlotRecipe15({
|
|
4216
5353
|
});
|
4217
5354
|
|
4218
5355
|
// src/theme/recipes/chakra/blockquote.ts
|
4219
|
-
import { defineSlotRecipe as
|
5356
|
+
import { defineSlotRecipe as defineSlotRecipe25 } from "@chakra-ui/react";
|
4220
5357
|
import { blockquoteAnatomy } from "@chakra-ui/react/anatomy";
|
4221
|
-
var blockquoteSlotRecipe =
|
5358
|
+
var blockquoteSlotRecipe = defineSlotRecipe25({
|
4222
5359
|
className: "chakra-blockquote",
|
4223
5360
|
slots: blockquoteAnatomy.keys(),
|
4224
5361
|
base: {
|
@@ -4295,9 +5432,9 @@ var blockquoteSlotRecipe = defineSlotRecipe16({
|
|
4295
5432
|
});
|
4296
5433
|
|
4297
5434
|
// src/theme/recipes/chakra/breadcrumb.ts
|
4298
|
-
import { defineSlotRecipe as
|
5435
|
+
import { defineSlotRecipe as defineSlotRecipe26 } from "@chakra-ui/react";
|
4299
5436
|
import { breadcrumbAnatomy } from "@chakra-ui/react/anatomy";
|
4300
|
-
var breadcrumbSlotRecipe =
|
5437
|
+
var breadcrumbSlotRecipe = defineSlotRecipe26({
|
4301
5438
|
className: "chakra-breadcrumb",
|
4302
5439
|
slots: breadcrumbAnatomy.keys(),
|
4303
5440
|
base: {
|
@@ -4387,9 +5524,9 @@ var breadcrumbSlotRecipe = defineSlotRecipe17({
|
|
4387
5524
|
});
|
4388
5525
|
|
4389
5526
|
// src/theme/recipes/chakra/card.ts
|
4390
|
-
import { defineSlotRecipe as
|
5527
|
+
import { defineSlotRecipe as defineSlotRecipe27 } from "@chakra-ui/react";
|
4391
5528
|
import { cardAnatomy } from "@chakra-ui/react/anatomy";
|
4392
|
-
var cardSlotRecipe =
|
5529
|
+
var cardSlotRecipe = defineSlotRecipe27({
|
4393
5530
|
className: "chakra-card",
|
4394
5531
|
slots: cardAnatomy.keys(),
|
4395
5532
|
base: {
|
@@ -4509,10 +5646,10 @@ var cardSlotRecipe = defineSlotRecipe18({
|
|
4509
5646
|
});
|
4510
5647
|
|
4511
5648
|
// src/theme/recipes/chakra/checkbox.ts
|
4512
|
-
import { defineSlotRecipe as
|
5649
|
+
import { defineSlotRecipe as defineSlotRecipe28 } from "@chakra-ui/react";
|
4513
5650
|
import { checkboxAnatomy } from "@chakra-ui/react/anatomy";
|
4514
5651
|
var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
|
4515
|
-
var checkboxSlotRecipe =
|
5652
|
+
var checkboxSlotRecipe = defineSlotRecipe28({
|
4516
5653
|
slots: checkboxAnatomy.keys(),
|
4517
5654
|
className: "chakra-checkbox",
|
4518
5655
|
base: {
|
@@ -4574,10 +5711,10 @@ var checkboxSlotRecipe = defineSlotRecipe19({
|
|
4574
5711
|
});
|
4575
5712
|
|
4576
5713
|
// src/theme/recipes/chakra/checkbox-card.ts
|
4577
|
-
import { defineSlotRecipe as
|
5714
|
+
import { defineSlotRecipe as defineSlotRecipe29 } from "@chakra-ui/react";
|
4578
5715
|
import { checkboxCardAnatomy } from "@chakra-ui/react/anatomy";
|
4579
5716
|
var _a3, _b2, _c2, _d2, _e2, _f2, _g2;
|
4580
|
-
var checkboxCardSlotRecipe =
|
5717
|
+
var checkboxCardSlotRecipe = defineSlotRecipe29({
|
4581
5718
|
slots: checkboxCardAnatomy.keys(),
|
4582
5719
|
className: "chakra-checkbox-card",
|
4583
5720
|
base: {
|
@@ -4777,9 +5914,9 @@ var checkboxCardSlotRecipe = defineSlotRecipe20({
|
|
4777
5914
|
});
|
4778
5915
|
|
4779
5916
|
// src/theme/recipes/chakra/collapsible.ts
|
4780
|
-
import { defineSlotRecipe as
|
5917
|
+
import { defineSlotRecipe as defineSlotRecipe30 } from "@chakra-ui/react";
|
4781
5918
|
import { collapsibleAnatomy } from "@chakra-ui/react/anatomy";
|
4782
|
-
var collapsibleSlotRecipe =
|
5919
|
+
var collapsibleSlotRecipe = defineSlotRecipe30({
|
4783
5920
|
slots: collapsibleAnatomy.keys(),
|
4784
5921
|
className: "chakra-collapsible",
|
4785
5922
|
base: {
|
@@ -4797,88 +5934,8 @@ var collapsibleSlotRecipe = defineSlotRecipe21({
|
|
4797
5934
|
}
|
4798
5935
|
});
|
4799
5936
|
|
4800
|
-
// src/theme/recipes/chakra/data-list.ts
|
4801
|
-
import { defineSlotRecipe as defineSlotRecipe22 } from "@chakra-ui/react";
|
4802
|
-
import { dataListAnatomy } from "@chakra-ui/react/anatomy";
|
4803
|
-
var dataListSlotRecipe = defineSlotRecipe22({
|
4804
|
-
slots: dataListAnatomy.keys(),
|
4805
|
-
className: "chakra-data-list",
|
4806
|
-
base: {
|
4807
|
-
itemLabel: {
|
4808
|
-
color: "fg.muted",
|
4809
|
-
display: "flex",
|
4810
|
-
alignItems: "center",
|
4811
|
-
gap: "1"
|
4812
|
-
},
|
4813
|
-
itemValue: {
|
4814
|
-
display: "flex",
|
4815
|
-
minWidth: "0",
|
4816
|
-
flex: "1"
|
4817
|
-
}
|
4818
|
-
},
|
4819
|
-
variants: {
|
4820
|
-
orientation: {
|
4821
|
-
horizontal: {
|
4822
|
-
root: {
|
4823
|
-
display: "flex",
|
4824
|
-
flexDirection: "column"
|
4825
|
-
},
|
4826
|
-
item: {
|
4827
|
-
display: "inline-flex",
|
4828
|
-
alignItems: "center",
|
4829
|
-
gap: "4"
|
4830
|
-
},
|
4831
|
-
itemLabel: {
|
4832
|
-
minWidth: "120px"
|
4833
|
-
}
|
4834
|
-
},
|
4835
|
-
vertical: {
|
4836
|
-
root: {
|
4837
|
-
display: "flex",
|
4838
|
-
flexDirection: "column"
|
4839
|
-
},
|
4840
|
-
item: {
|
4841
|
-
display: "flex",
|
4842
|
-
flexDirection: "column",
|
4843
|
-
gap: "1"
|
4844
|
-
}
|
4845
|
-
}
|
4846
|
-
},
|
4847
|
-
size: {
|
4848
|
-
sm: {
|
4849
|
-
root: {
|
4850
|
-
gap: "3"
|
4851
|
-
},
|
4852
|
-
item: {
|
4853
|
-
textStyle: "xs"
|
4854
|
-
}
|
4855
|
-
},
|
4856
|
-
md: {
|
4857
|
-
root: {
|
4858
|
-
gap: "4"
|
4859
|
-
},
|
4860
|
-
item: {
|
4861
|
-
textStyle: "sm"
|
4862
|
-
}
|
4863
|
-
},
|
4864
|
-
lg: {
|
4865
|
-
root: {
|
4866
|
-
gap: "5"
|
4867
|
-
},
|
4868
|
-
item: {
|
4869
|
-
textStyle: "md"
|
4870
|
-
}
|
4871
|
-
}
|
4872
|
-
}
|
4873
|
-
},
|
4874
|
-
defaultVariants: {
|
4875
|
-
size: "md",
|
4876
|
-
orientation: "vertical"
|
4877
|
-
}
|
4878
|
-
});
|
4879
|
-
|
4880
5937
|
// src/theme/recipes/chakra/editable.ts
|
4881
|
-
import { defineSlotRecipe as
|
5938
|
+
import { defineSlotRecipe as defineSlotRecipe31, defineStyle as defineStyle2 } from "@chakra-ui/react";
|
4882
5939
|
import { editableAnatomy } from "@chakra-ui/react/anatomy";
|
4883
5940
|
var sharedStyles = defineStyle2({
|
4884
5941
|
fontSize: "inherit",
|
@@ -4887,7 +5944,7 @@ var sharedStyles = defineStyle2({
|
|
4887
5944
|
bg: "transparent",
|
4888
5945
|
borderRadius: "l2"
|
4889
5946
|
});
|
4890
|
-
var editableSlotRecipe =
|
5947
|
+
var editableSlotRecipe = defineSlotRecipe31({
|
4891
5948
|
slots: editableAnatomy.keys(),
|
4892
5949
|
className: "chakra-editable",
|
4893
5950
|
base: {
|
@@ -4930,122 +5987,30 @@ var editableSlotRecipe = defineSlotRecipe23({
|
|
4930
5987
|
display: "inline-flex",
|
4931
5988
|
alignItems: "center",
|
4932
5989
|
gap: "1.5"
|
4933
|
-
}
|
4934
|
-
},
|
4935
|
-
variants: {
|
4936
|
-
size: {
|
4937
|
-
sm: {
|
4938
|
-
root: {
|
4939
|
-
textStyle: "sm"
|
4940
|
-
},
|
4941
|
-
preview: { minH: "8" },
|
4942
|
-
input: { minH: "8" }
|
4943
|
-
},
|
4944
|
-
md: {
|
4945
|
-
root: {
|
4946
|
-
textStyle: "sm"
|
4947
|
-
},
|
4948
|
-
preview: { minH: "9" },
|
4949
|
-
input: { minH: "9" }
|
4950
|
-
},
|
4951
|
-
lg: {
|
4952
|
-
root: {
|
4953
|
-
textStyle: "md"
|
4954
|
-
},
|
4955
|
-
preview: { minH: "10" },
|
4956
|
-
input: { minH: "10" }
|
4957
|
-
}
|
4958
|
-
}
|
4959
|
-
},
|
4960
|
-
defaultVariants: {
|
4961
|
-
size: "md"
|
4962
|
-
}
|
4963
|
-
});
|
4964
|
-
|
4965
|
-
// src/theme/recipes/chakra/empty-state.ts
|
4966
|
-
import { defineSlotRecipe as defineSlotRecipe24 } from "@chakra-ui/react";
|
4967
|
-
import { emptyStateAnatomy } from "@chakra-ui/react/anatomy";
|
4968
|
-
var emptyStateSlotRecipe = defineSlotRecipe24({
|
4969
|
-
slots: emptyStateAnatomy.keys(),
|
4970
|
-
className: "chakra-empty-state",
|
4971
|
-
base: {
|
4972
|
-
root: {
|
4973
|
-
width: "full",
|
4974
|
-
height: "full",
|
4975
|
-
display: "flex",
|
4976
|
-
flexDirection: "column",
|
4977
|
-
alignItems: "center",
|
4978
|
-
justifyContent: "center"
|
4979
|
-
},
|
4980
|
-
content: {
|
4981
|
-
display: "flex",
|
4982
|
-
flexDirection: "column",
|
4983
|
-
alignItems: "center",
|
4984
|
-
justifyContent: "center"
|
4985
|
-
},
|
4986
|
-
indicator: {
|
4987
|
-
display: "flex",
|
4988
|
-
alignItems: "center",
|
4989
|
-
justifyContent: "center",
|
4990
|
-
color: "fg.subtle",
|
4991
|
-
_icon: {
|
4992
|
-
boxSize: "1em"
|
4993
|
-
}
|
4994
|
-
},
|
4995
|
-
title: {
|
4996
|
-
fontWeight: "semibold"
|
4997
|
-
},
|
4998
|
-
description: {
|
4999
|
-
textStyle: "sm",
|
5000
|
-
color: "fg.muted"
|
5001
|
-
}
|
5002
|
-
},
|
5003
|
-
variants: {
|
5004
|
-
size: {
|
5005
|
-
sm: {
|
5006
|
-
root: {
|
5007
|
-
px: "4",
|
5008
|
-
py: "6"
|
5009
|
-
},
|
5010
|
-
title: {
|
5011
|
-
textStyle: "md"
|
5012
|
-
},
|
5013
|
-
content: {
|
5014
|
-
gap: "4"
|
5990
|
+
}
|
5991
|
+
},
|
5992
|
+
variants: {
|
5993
|
+
size: {
|
5994
|
+
sm: {
|
5995
|
+
root: {
|
5996
|
+
textStyle: "sm"
|
5015
5997
|
},
|
5016
|
-
|
5017
|
-
|
5018
|
-
}
|
5998
|
+
preview: { minH: "8" },
|
5999
|
+
input: { minH: "8" }
|
5019
6000
|
},
|
5020
6001
|
md: {
|
5021
6002
|
root: {
|
5022
|
-
|
5023
|
-
py: "12"
|
5024
|
-
},
|
5025
|
-
title: {
|
5026
|
-
textStyle: "lg"
|
5027
|
-
},
|
5028
|
-
content: {
|
5029
|
-
gap: "6"
|
6003
|
+
textStyle: "sm"
|
5030
6004
|
},
|
5031
|
-
|
5032
|
-
|
5033
|
-
}
|
6005
|
+
preview: { minH: "9" },
|
6006
|
+
input: { minH: "9" }
|
5034
6007
|
},
|
5035
6008
|
lg: {
|
5036
6009
|
root: {
|
5037
|
-
|
5038
|
-
py: "16"
|
5039
|
-
},
|
5040
|
-
title: {
|
5041
|
-
textStyle: "xl"
|
5042
|
-
},
|
5043
|
-
content: {
|
5044
|
-
gap: "8"
|
6010
|
+
textStyle: "md"
|
5045
6011
|
},
|
5046
|
-
|
5047
|
-
|
5048
|
-
}
|
6012
|
+
preview: { minH: "10" },
|
6013
|
+
input: { minH: "10" }
|
5049
6014
|
}
|
5050
6015
|
}
|
5051
6016
|
},
|
@@ -5055,9 +6020,9 @@ var emptyStateSlotRecipe = defineSlotRecipe24({
|
|
5055
6020
|
});
|
5056
6021
|
|
5057
6022
|
// src/theme/recipes/chakra/field.ts
|
5058
|
-
import { defineSlotRecipe as
|
6023
|
+
import { defineSlotRecipe as defineSlotRecipe32 } from "@chakra-ui/react";
|
5059
6024
|
import { fieldAnatomy } from "@chakra-ui/react/anatomy";
|
5060
|
-
var fieldSlotRecipe =
|
6025
|
+
var fieldSlotRecipe = defineSlotRecipe32({
|
5061
6026
|
className: "chakra-field",
|
5062
6027
|
slots: fieldAnatomy.keys(),
|
5063
6028
|
base: {
|
@@ -5130,106 +6095,10 @@ var fieldSlotRecipe = defineSlotRecipe25({
|
|
5130
6095
|
}
|
5131
6096
|
});
|
5132
6097
|
|
5133
|
-
// src/theme/recipes/chakra/file-upload.ts
|
5134
|
-
import { defineSlotRecipe as defineSlotRecipe26 } from "@chakra-ui/react";
|
5135
|
-
import { fileUploadAnatomy } from "@chakra-ui/react/anatomy";
|
5136
|
-
var fileUploadSlotRecipe = defineSlotRecipe26({
|
5137
|
-
className: "chakra-file-upload",
|
5138
|
-
slots: fileUploadAnatomy.keys(),
|
5139
|
-
base: {
|
5140
|
-
root: {
|
5141
|
-
display: "flex",
|
5142
|
-
flexDirection: "column",
|
5143
|
-
gap: "4",
|
5144
|
-
width: "100%",
|
5145
|
-
alignItems: "flex-start"
|
5146
|
-
},
|
5147
|
-
label: {
|
5148
|
-
fontWeight: "medium",
|
5149
|
-
textStyle: "sm"
|
5150
|
-
},
|
5151
|
-
dropzone: {
|
5152
|
-
background: "bg",
|
5153
|
-
borderRadius: "l3",
|
5154
|
-
borderWidth: "2px",
|
5155
|
-
borderStyle: "dashed",
|
5156
|
-
display: "flex",
|
5157
|
-
alignItems: "center",
|
5158
|
-
flexDirection: "column",
|
5159
|
-
gap: "4",
|
5160
|
-
justifyContent: "center",
|
5161
|
-
minHeight: "2xs",
|
5162
|
-
px: "3",
|
5163
|
-
py: "2",
|
5164
|
-
transition: "backgrounds",
|
5165
|
-
focusVisibleRing: "outside",
|
5166
|
-
_hover: {
|
5167
|
-
bg: "bg.subtle"
|
5168
|
-
},
|
5169
|
-
_dragging: {
|
5170
|
-
bg: "colorPalette.subtle",
|
5171
|
-
borderStyle: "solid",
|
5172
|
-
borderColor: "colorPalette.solid"
|
5173
|
-
}
|
5174
|
-
},
|
5175
|
-
dropzoneContent: {
|
5176
|
-
display: "flex",
|
5177
|
-
flexDirection: "column",
|
5178
|
-
alignItems: "center",
|
5179
|
-
textAlign: "center",
|
5180
|
-
gap: "1",
|
5181
|
-
textStyle: "sm"
|
5182
|
-
},
|
5183
|
-
item: {
|
5184
|
-
textStyle: "sm",
|
5185
|
-
animationName: "fade-in",
|
5186
|
-
animationDuration: "moderate",
|
5187
|
-
background: "bg",
|
5188
|
-
borderRadius: "l2",
|
5189
|
-
borderWidth: "1px",
|
5190
|
-
width: "100%",
|
5191
|
-
display: "flex",
|
5192
|
-
alignItems: "center",
|
5193
|
-
gap: "3",
|
5194
|
-
p: "4"
|
5195
|
-
},
|
5196
|
-
itemGroup: {
|
5197
|
-
width: "100%",
|
5198
|
-
display: "flex",
|
5199
|
-
flexDirection: "column",
|
5200
|
-
gap: "3"
|
5201
|
-
},
|
5202
|
-
itemName: {
|
5203
|
-
color: "fg",
|
5204
|
-
fontWeight: "medium",
|
5205
|
-
lineClamp: "1"
|
5206
|
-
},
|
5207
|
-
itemContent: {
|
5208
|
-
display: "flex",
|
5209
|
-
flexDirection: "column",
|
5210
|
-
gap: "0.5",
|
5211
|
-
flex: "1"
|
5212
|
-
},
|
5213
|
-
itemSizeText: {
|
5214
|
-
color: "fg.muted",
|
5215
|
-
textStyle: "xs"
|
5216
|
-
},
|
5217
|
-
itemDeleteTrigger: {
|
5218
|
-
alignSelf: "flex-start"
|
5219
|
-
},
|
5220
|
-
itemPreviewImage: {
|
5221
|
-
width: "10",
|
5222
|
-
height: "10",
|
5223
|
-
objectFit: "scale-down"
|
5224
|
-
}
|
5225
|
-
},
|
5226
|
-
defaultVariants: {}
|
5227
|
-
});
|
5228
|
-
|
5229
6098
|
// src/theme/recipes/chakra/hover-card.ts
|
5230
|
-
import { defineSlotRecipe as
|
6099
|
+
import { defineSlotRecipe as defineSlotRecipe33 } from "@chakra-ui/react";
|
5231
6100
|
import { hoverCardAnatomy } from "@chakra-ui/react/anatomy";
|
5232
|
-
var hoverCardSlotRecipe =
|
6101
|
+
var hoverCardSlotRecipe = defineSlotRecipe33({
|
5233
6102
|
className: "chakra-hover-card",
|
5234
6103
|
slots: hoverCardAnatomy.keys(),
|
5235
6104
|
base: {
|
@@ -5294,9 +6163,9 @@ var hoverCardSlotRecipe = defineSlotRecipe27({
|
|
5294
6163
|
});
|
5295
6164
|
|
5296
6165
|
// src/theme/recipes/chakra/list.ts
|
5297
|
-
import { defineSlotRecipe as
|
6166
|
+
import { defineSlotRecipe as defineSlotRecipe34 } from "@chakra-ui/react";
|
5298
6167
|
import { listAnatomy } from "@chakra-ui/react/anatomy";
|
5299
|
-
var listSlotRecipe =
|
6168
|
+
var listSlotRecipe = defineSlotRecipe34({
|
5300
6169
|
className: "chakra-list",
|
5301
6170
|
slots: listAnatomy.keys(),
|
5302
6171
|
base: {
|
@@ -5328,166 +6197,43 @@ var listSlotRecipe = defineSlotRecipe28({
|
|
5328
6197
|
listStylePosition: "inside"
|
5329
6198
|
},
|
5330
6199
|
item: {
|
5331
|
-
_marker: {
|
5332
|
-
color: "fg.subtle"
|
5333
|
-
}
|
5334
|
-
}
|
5335
|
-
},
|
5336
|
-
plain: {
|
5337
|
-
item: {
|
5338
|
-
alignItems: "flex-start",
|
5339
|
-
display: "inline-flex"
|
5340
|
-
}
|
5341
|
-
}
|
5342
|
-
},
|
5343
|
-
align: {
|
5344
|
-
center: {
|
5345
|
-
item: { alignItems: "center" }
|
5346
|
-
},
|
5347
|
-
start: {
|
5348
|
-
item: { alignItems: "flex-start" }
|
5349
|
-
},
|
5350
|
-
end: {
|
5351
|
-
item: { alignItems: "flex-end" }
|
5352
|
-
}
|
5353
|
-
}
|
5354
|
-
},
|
5355
|
-
defaultVariants: {
|
5356
|
-
variant: "marker"
|
5357
|
-
}
|
5358
|
-
});
|
5359
|
-
|
5360
|
-
// src/theme/recipes/chakra/menu.ts
|
5361
|
-
import { defineSlotRecipe as defineSlotRecipe29 } from "@chakra-ui/react";
|
5362
|
-
import { menuAnatomy } from "@chakra-ui/react/anatomy";
|
5363
|
-
var menuSlotRecipe = defineSlotRecipe29({
|
5364
|
-
className: "chakra-menu",
|
5365
|
-
slots: menuAnatomy.keys(),
|
5366
|
-
base: {
|
5367
|
-
content: {
|
5368
|
-
outline: 0,
|
5369
|
-
bg: "bg.panel",
|
5370
|
-
boxShadow: "lg",
|
5371
|
-
color: "fg",
|
5372
|
-
maxHeight: "var(--available-height)",
|
5373
|
-
"--menu-z-index": "zIndex.dropdown",
|
5374
|
-
zIndex: "calc(var(--menu-z-index) + var(--layer-index, 0))",
|
5375
|
-
borderRadius: "l2",
|
5376
|
-
overflow: "hidden",
|
5377
|
-
_open: {
|
5378
|
-
animationStyle: "slide-fade-in",
|
5379
|
-
animationDuration: "fast"
|
5380
|
-
},
|
5381
|
-
_closed: {
|
5382
|
-
animationStyle: "slide-fade-out",
|
5383
|
-
animationDuration: "faster"
|
5384
|
-
}
|
5385
|
-
},
|
5386
|
-
item: {
|
5387
|
-
textDecoration: "none",
|
5388
|
-
color: "fg",
|
5389
|
-
userSelect: "none",
|
5390
|
-
borderRadius: "l3",
|
5391
|
-
width: "100%",
|
5392
|
-
display: "flex",
|
5393
|
-
cursor: "menuitem",
|
5394
|
-
alignItems: "center",
|
5395
|
-
textAlign: "start",
|
5396
|
-
position: "relative",
|
5397
|
-
flex: "0 0 auto",
|
5398
|
-
outline: 0,
|
5399
|
-
_disabled: {
|
5400
|
-
layerStyle: "disabled"
|
5401
|
-
}
|
5402
|
-
},
|
5403
|
-
itemText: {
|
5404
|
-
flex: "1"
|
5405
|
-
},
|
5406
|
-
itemGroupLabel: {
|
5407
|
-
px: "2",
|
5408
|
-
py: "1.5",
|
5409
|
-
fontWeight: "semibold",
|
5410
|
-
textStyle: "sm"
|
5411
|
-
},
|
5412
|
-
indicator: {
|
5413
|
-
display: "inline-flex",
|
5414
|
-
alignItems: "center",
|
5415
|
-
justifyContent: "center",
|
5416
|
-
flexShrink: "0"
|
5417
|
-
},
|
5418
|
-
itemCommand: {
|
5419
|
-
opacity: "0.6",
|
5420
|
-
textStyle: "xs",
|
5421
|
-
ms: "auto",
|
5422
|
-
ps: "4",
|
5423
|
-
letterSpacing: "widest"
|
5424
|
-
},
|
5425
|
-
separator: {
|
5426
|
-
height: "1px",
|
5427
|
-
bg: "bg.muted",
|
5428
|
-
my: "1",
|
5429
|
-
mx: "-1"
|
5430
|
-
}
|
5431
|
-
},
|
5432
|
-
variants: {
|
5433
|
-
variant: {
|
5434
|
-
subtle: {
|
5435
|
-
item: {
|
5436
|
-
_highlighted: {
|
5437
|
-
bg: "bg.subtle"
|
5438
|
-
}
|
5439
|
-
}
|
5440
|
-
},
|
5441
|
-
solid: {
|
5442
|
-
item: {
|
5443
|
-
_highlighted: {
|
5444
|
-
bg: "colorPalette.solid",
|
5445
|
-
color: "colorPalette.contrast"
|
5446
|
-
}
|
5447
|
-
}
|
5448
|
-
}
|
5449
|
-
},
|
5450
|
-
size: {
|
5451
|
-
sm: {
|
5452
|
-
content: {
|
5453
|
-
minW: "8rem",
|
5454
|
-
padding: "1"
|
5455
|
-
},
|
5456
|
-
item: {
|
5457
|
-
gap: "1",
|
5458
|
-
textStyle: "xs",
|
5459
|
-
py: "1",
|
5460
|
-
px: "1.5"
|
6200
|
+
_marker: {
|
6201
|
+
color: "fg.subtle"
|
6202
|
+
}
|
5461
6203
|
}
|
5462
6204
|
},
|
5463
|
-
|
5464
|
-
content: {
|
5465
|
-
minW: "8rem",
|
5466
|
-
padding: "1.5"
|
5467
|
-
},
|
6205
|
+
plain: {
|
5468
6206
|
item: {
|
5469
|
-
|
5470
|
-
|
5471
|
-
py: "1.5",
|
5472
|
-
px: "2"
|
6207
|
+
alignItems: "flex-start",
|
6208
|
+
display: "inline-flex"
|
5473
6209
|
}
|
5474
6210
|
}
|
6211
|
+
},
|
6212
|
+
align: {
|
6213
|
+
center: {
|
6214
|
+
item: { alignItems: "center" }
|
6215
|
+
},
|
6216
|
+
start: {
|
6217
|
+
item: { alignItems: "flex-start" }
|
6218
|
+
},
|
6219
|
+
end: {
|
6220
|
+
item: { alignItems: "flex-end" }
|
6221
|
+
}
|
5475
6222
|
}
|
5476
6223
|
},
|
5477
6224
|
defaultVariants: {
|
5478
|
-
|
5479
|
-
variant: "subtle"
|
6225
|
+
variant: "marker"
|
5480
6226
|
}
|
5481
6227
|
});
|
5482
6228
|
|
5483
6229
|
// src/theme/recipes/chakra/native-select.ts
|
5484
|
-
import { defineSlotRecipe as
|
6230
|
+
import { defineSlotRecipe as defineSlotRecipe36 } from "@chakra-ui/react";
|
5485
6231
|
import { nativeSelectAnatomy } from "@chakra-ui/react/anatomy";
|
5486
6232
|
|
5487
6233
|
// src/theme/recipes/chakra/select.ts
|
5488
|
-
import { defineSlotRecipe as
|
6234
|
+
import { defineSlotRecipe as defineSlotRecipe35 } from "@chakra-ui/react";
|
5489
6235
|
import { selectAnatomy } from "@chakra-ui/react/anatomy";
|
5490
|
-
var selectSlotRecipe =
|
6236
|
+
var selectSlotRecipe = defineSlotRecipe35({
|
5491
6237
|
className: "chakra-select",
|
5492
6238
|
slots: selectAnatomy.keys(),
|
5493
6239
|
base: {
|
@@ -5772,7 +6518,7 @@ var selectSlotRecipe = defineSlotRecipe30({
|
|
5772
6518
|
|
5773
6519
|
// src/theme/recipes/chakra/native-select.ts
|
5774
6520
|
var _a4, _b3;
|
5775
|
-
var nativeSelectSlotRecipe =
|
6521
|
+
var nativeSelectSlotRecipe = defineSlotRecipe36({
|
5776
6522
|
className: "chakra-native-select",
|
5777
6523
|
slots: nativeSelectAnatomy.keys(),
|
5778
6524
|
base: {
|
@@ -5905,7 +6651,7 @@ var nativeSelectSlotRecipe = defineSlotRecipe31({
|
|
5905
6651
|
});
|
5906
6652
|
|
5907
6653
|
// src/theme/recipes/chakra/number-input.ts
|
5908
|
-
import { defineSlotRecipe as
|
6654
|
+
import { defineSlotRecipe as defineSlotRecipe37, defineStyle as defineStyle3 } from "@chakra-ui/react";
|
5909
6655
|
import { numberInputAnatomy } from "@chakra-ui/react/anatomy";
|
5910
6656
|
|
5911
6657
|
// src/theme/utils.ts
|
@@ -5920,9 +6666,6 @@ function mapEntries(obj, f) {
|
|
5920
6666
|
function scaleToken(value) {
|
5921
6667
|
return `calc(${value} * var(--scale-factor))`;
|
5922
6668
|
}
|
5923
|
-
function radiusToken(value) {
|
5924
|
-
return `calc(${value} * var(--scale-factor) * var(--radius-factor))`;
|
5925
|
-
}
|
5926
6669
|
|
5927
6670
|
// src/theme/recipes/chakra/number-input.ts
|
5928
6671
|
var triggerStyle = defineStyle3({
|
@@ -5949,7 +6692,7 @@ var triggerStyle = defineStyle3({
|
|
5949
6692
|
bg: "bg.emphasized"
|
5950
6693
|
}
|
5951
6694
|
});
|
5952
|
-
var numberInputSlotRecipe =
|
6695
|
+
var numberInputSlotRecipe = defineSlotRecipe37({
|
5953
6696
|
className: "chakra-number-input",
|
5954
6697
|
slots: numberInputAnatomy.keys(),
|
5955
6698
|
base: {
|
@@ -6034,10 +6777,10 @@ var numberInputSlotRecipe = defineSlotRecipe32({
|
|
6034
6777
|
});
|
6035
6778
|
|
6036
6779
|
// src/theme/recipes/chakra/pin-input.ts
|
6037
|
-
import { defineSlotRecipe as
|
6780
|
+
import { defineSlotRecipe as defineSlotRecipe38 } from "@chakra-ui/react";
|
6038
6781
|
import { pinInputAnatomy } from "@chakra-ui/react/anatomy";
|
6039
6782
|
var { variants: variants2, defaultVariants: defaultVariants2 } = inputRecipe;
|
6040
|
-
var pinInputSlotRecipe =
|
6783
|
+
var pinInputSlotRecipe = defineSlotRecipe38({
|
6041
6784
|
className: "chakra-pin-input",
|
6042
6785
|
slots: pinInputAnatomy.keys(),
|
6043
6786
|
base: {
|
@@ -6065,97 +6808,10 @@ var pinInputSlotRecipe = defineSlotRecipe33({
|
|
6065
6808
|
defaultVariants: defaultVariants2
|
6066
6809
|
});
|
6067
6810
|
|
6068
|
-
// src/theme/recipes/chakra/popover.ts
|
6069
|
-
import { defineSlotRecipe as defineSlotRecipe34 } from "@chakra-ui/react";
|
6070
|
-
import { popoverAnatomy } from "@chakra-ui/react/anatomy";
|
6071
|
-
var popoverSlotRecipe = defineSlotRecipe34({
|
6072
|
-
className: "chakra-popover",
|
6073
|
-
slots: popoverAnatomy.keys(),
|
6074
|
-
base: {
|
6075
|
-
content: {
|
6076
|
-
position: "relative",
|
6077
|
-
display: "flex",
|
6078
|
-
flexDirection: "column",
|
6079
|
-
textStyle: "sm",
|
6080
|
-
"--popover-bg": "colors.bg.panel",
|
6081
|
-
bg: "var(--popover-bg)",
|
6082
|
-
boxShadow: "lg",
|
6083
|
-
"--popover-size": "sizes.xs",
|
6084
|
-
"--popover-mobile-size": "calc(100dvw - 1rem)",
|
6085
|
-
width: {
|
6086
|
-
base: "min(var(--popover-mobile-size), var(--popover-size))",
|
6087
|
-
sm: "var(--popover-size)"
|
6088
|
-
},
|
6089
|
-
borderRadius: "l3",
|
6090
|
-
"--popover-z-index": "zIndex.popover",
|
6091
|
-
zIndex: "calc(var(--popover-z-index) + var(--layer-index, 0))",
|
6092
|
-
outline: "0",
|
6093
|
-
transformOrigin: "var(--transform-origin)",
|
6094
|
-
_open: {
|
6095
|
-
animationStyle: "scale-fade-in",
|
6096
|
-
animationDuration: "fast"
|
6097
|
-
},
|
6098
|
-
_closed: {
|
6099
|
-
animationStyle: "scale-fade-out",
|
6100
|
-
animationDuration: "faster"
|
6101
|
-
}
|
6102
|
-
},
|
6103
|
-
header: {
|
6104
|
-
paddingInline: "var(--popover-padding)",
|
6105
|
-
paddingTop: "var(--popover-padding)"
|
6106
|
-
},
|
6107
|
-
body: {
|
6108
|
-
padding: "var(--popover-padding)",
|
6109
|
-
flex: "1"
|
6110
|
-
},
|
6111
|
-
footer: {
|
6112
|
-
display: "flex",
|
6113
|
-
alignItems: "center",
|
6114
|
-
paddingInline: "var(--popover-padding)",
|
6115
|
-
paddingBottom: "var(--popover-padding)"
|
6116
|
-
},
|
6117
|
-
arrow: {
|
6118
|
-
"--arrow-size": "sizes.3",
|
6119
|
-
"--arrow-background": "var(--popover-bg)"
|
6120
|
-
},
|
6121
|
-
arrowTip: {
|
6122
|
-
borderTopWidth: "1px",
|
6123
|
-
borderInlineStartWidth: "1px"
|
6124
|
-
}
|
6125
|
-
},
|
6126
|
-
variants: {
|
6127
|
-
size: {
|
6128
|
-
xs: {
|
6129
|
-
content: {
|
6130
|
-
"--popover-padding": "spacing.3"
|
6131
|
-
}
|
6132
|
-
},
|
6133
|
-
sm: {
|
6134
|
-
content: {
|
6135
|
-
"--popover-padding": "spacing.4"
|
6136
|
-
}
|
6137
|
-
},
|
6138
|
-
md: {
|
6139
|
-
content: {
|
6140
|
-
"--popover-padding": "spacing.5"
|
6141
|
-
}
|
6142
|
-
},
|
6143
|
-
lg: {
|
6144
|
-
content: {
|
6145
|
-
"--popover-padding": "spacing.6"
|
6146
|
-
}
|
6147
|
-
}
|
6148
|
-
}
|
6149
|
-
},
|
6150
|
-
defaultVariants: {
|
6151
|
-
size: "md"
|
6152
|
-
}
|
6153
|
-
});
|
6154
|
-
|
6155
6811
|
// src/theme/recipes/chakra/progress.ts
|
6156
|
-
import { defineSlotRecipe as
|
6812
|
+
import { defineSlotRecipe as defineSlotRecipe39 } from "@chakra-ui/react";
|
6157
6813
|
import { progressAnatomy } from "@chakra-ui/react/anatomy";
|
6158
|
-
var progressSlotRecipe =
|
6814
|
+
var progressSlotRecipe = defineSlotRecipe39({
|
6159
6815
|
slots: progressAnatomy.keys(),
|
6160
6816
|
className: "chakra-progress",
|
6161
6817
|
base: {
|
@@ -6275,9 +6931,9 @@ var progressSlotRecipe = defineSlotRecipe35({
|
|
6275
6931
|
});
|
6276
6932
|
|
6277
6933
|
// src/theme/recipes/chakra/progress-circle.ts
|
6278
|
-
import { defineSlotRecipe as
|
6934
|
+
import { defineSlotRecipe as defineSlotRecipe40 } from "@chakra-ui/react";
|
6279
6935
|
import { progressAnatomy as progressAnatomy2 } from "@chakra-ui/react/anatomy";
|
6280
|
-
var progressCircleSlotRecipe =
|
6936
|
+
var progressCircleSlotRecipe = defineSlotRecipe40({
|
6281
6937
|
className: "chakra-progress-circle",
|
6282
6938
|
slots: progressAnatomy2.keys(),
|
6283
6939
|
base: {
|
@@ -6368,10 +7024,10 @@ var progressCircleSlotRecipe = defineSlotRecipe36({
|
|
6368
7024
|
});
|
6369
7025
|
|
6370
7026
|
// src/theme/recipes/chakra/radio-card.ts
|
6371
|
-
import { defineSlotRecipe as
|
7027
|
+
import { defineSlotRecipe as defineSlotRecipe41 } from "@chakra-ui/react";
|
6372
7028
|
import { radioCardAnatomy } from "@chakra-ui/react/anatomy";
|
6373
7029
|
var _a5, _b4, _c3, _d3, _e3, _f3, _g3;
|
6374
|
-
var radioCardSlotRecipe =
|
7030
|
+
var radioCardSlotRecipe = defineSlotRecipe41({
|
6375
7031
|
className: "chakra-radio-card",
|
6376
7032
|
slots: radioCardAnatomy.keys(),
|
6377
7033
|
base: {
|
@@ -6579,10 +7235,10 @@ var radioCardSlotRecipe = defineSlotRecipe37({
|
|
6579
7235
|
});
|
6580
7236
|
|
6581
7237
|
// src/theme/recipes/chakra/radio-group.ts
|
6582
|
-
import { defineSlotRecipe as
|
7238
|
+
import { defineSlotRecipe as defineSlotRecipe42 } from "@chakra-ui/react";
|
6583
7239
|
import { radioGroupAnatomy } from "@chakra-ui/react/anatomy";
|
6584
7240
|
var _a6, _b5, _c4, _d4, _e4, _f4, _g4, _h2, _i2, _j2, _k2, _l2, _m2, _n2;
|
6585
|
-
var radioGroupSlotRecipe =
|
7241
|
+
var radioGroupSlotRecipe = defineSlotRecipe42({
|
6586
7242
|
className: "chakra-radio-group",
|
6587
7243
|
slots: radioGroupAnatomy.keys(),
|
6588
7244
|
base: {
|
@@ -6642,9 +7298,9 @@ var radioGroupSlotRecipe = defineSlotRecipe38({
|
|
6642
7298
|
});
|
6643
7299
|
|
6644
7300
|
// src/theme/recipes/chakra/rating-group.ts
|
6645
|
-
import { defineSlotRecipe as
|
7301
|
+
import { defineSlotRecipe as defineSlotRecipe43 } from "@chakra-ui/react";
|
6646
7302
|
import { ratingGroupAnatomy } from "@chakra-ui/react/anatomy";
|
6647
|
-
var ratingGroupSlotRecipe =
|
7303
|
+
var ratingGroupSlotRecipe = defineSlotRecipe43({
|
6648
7304
|
className: "chakra-rating-group",
|
6649
7305
|
slots: ratingGroupAnatomy.keys(),
|
6650
7306
|
base: {
|
@@ -6716,133 +7372,7 @@ var ratingGroupSlotRecipe = defineSlotRecipe39({
|
|
6716
7372
|
},
|
6717
7373
|
lg: {
|
6718
7374
|
item: {
|
6719
|
-
textStyle: "2xl"
|
6720
|
-
}
|
6721
|
-
}
|
6722
|
-
}
|
6723
|
-
},
|
6724
|
-
defaultVariants: {
|
6725
|
-
size: "md"
|
6726
|
-
}
|
6727
|
-
});
|
6728
|
-
|
6729
|
-
// src/theme/recipes/chakra/segment-group.ts
|
6730
|
-
import { defineSlotRecipe as defineSlotRecipe40 } from "@chakra-ui/react";
|
6731
|
-
import { segmentGroupAnatomy } from "@chakra-ui/react/anatomy";
|
6732
|
-
var segmentGroupSlotRecipe = defineSlotRecipe40({
|
6733
|
-
className: "chakra-segment-group",
|
6734
|
-
slots: segmentGroupAnatomy.keys(),
|
6735
|
-
base: {
|
6736
|
-
root: {
|
6737
|
-
"--segment-radius": "radii.md",
|
6738
|
-
borderRadius: "md",
|
6739
|
-
display: "inline-flex",
|
6740
|
-
boxShadow: "inset",
|
6741
|
-
minW: "max-content",
|
6742
|
-
textAlign: "center",
|
6743
|
-
position: "relative",
|
6744
|
-
isolation: "isolate",
|
6745
|
-
bg: "bg.muted",
|
6746
|
-
borderWidth: "1px"
|
6747
|
-
},
|
6748
|
-
item: {
|
6749
|
-
display: "flex",
|
6750
|
-
alignItems: "center",
|
6751
|
-
userSelect: "none",
|
6752
|
-
fontSize: "sm",
|
6753
|
-
position: "relative",
|
6754
|
-
color: "fg.subtle",
|
6755
|
-
cursor: "button",
|
6756
|
-
borderRadius: "var(--segment-radius)",
|
6757
|
-
_disabled: {
|
6758
|
-
opacity: "0.5"
|
6759
|
-
},
|
6760
|
-
_hover: {
|
6761
|
-
color: "fg"
|
6762
|
-
},
|
6763
|
-
"&:has(input:focus-visible)": {
|
6764
|
-
focusRing: "inside",
|
6765
|
-
focusRingWidth: "1px"
|
6766
|
-
},
|
6767
|
-
_before: {
|
6768
|
-
content: '""',
|
6769
|
-
position: "absolute",
|
6770
|
-
insetInlineStart: 0,
|
6771
|
-
insetBlock: "0",
|
6772
|
-
bg: "border",
|
6773
|
-
width: "1px",
|
6774
|
-
transition: "opacity 0.2s"
|
6775
|
-
},
|
6776
|
-
_checked: {
|
6777
|
-
color: "fg"
|
6778
|
-
},
|
6779
|
-
"& + &[data-state=checked], &[data-state=checked] + &, &:first-of-type": {
|
6780
|
-
_before: {
|
6781
|
-
opacity: "0"
|
6782
|
-
}
|
6783
|
-
},
|
6784
|
-
"&[data-state=checked][data-ssr]": {
|
6785
|
-
shadow: "sm",
|
6786
|
-
bg: "bg",
|
6787
|
-
color: "fg",
|
6788
|
-
borderRadius: "var(--segment-radius)"
|
6789
|
-
}
|
6790
|
-
},
|
6791
|
-
indicator: {
|
6792
|
-
shadow: "sm",
|
6793
|
-
pos: "absolute",
|
6794
|
-
bg: {
|
6795
|
-
base: "bg",
|
6796
|
-
_dark: "bg.emphasized"
|
6797
|
-
},
|
6798
|
-
width: "var(--width)",
|
6799
|
-
height: "var(--height)",
|
6800
|
-
top: "var(--top)",
|
6801
|
-
left: "var(--left)",
|
6802
|
-
zIndex: -1,
|
6803
|
-
borderRadius: "var(--segment-radius)"
|
6804
|
-
}
|
6805
|
-
},
|
6806
|
-
variants: {
|
6807
|
-
size: {
|
6808
|
-
xs: {
|
6809
|
-
root: {
|
6810
|
-
height: "6"
|
6811
|
-
},
|
6812
|
-
item: {
|
6813
|
-
textStyle: "xs",
|
6814
|
-
px: "3",
|
6815
|
-
gap: "1"
|
6816
|
-
}
|
6817
|
-
},
|
6818
|
-
sm: {
|
6819
|
-
root: {
|
6820
|
-
height: "7"
|
6821
|
-
},
|
6822
|
-
item: {
|
6823
|
-
textStyle: "sm",
|
6824
|
-
px: "4",
|
6825
|
-
gap: "2"
|
6826
|
-
}
|
6827
|
-
},
|
6828
|
-
md: {
|
6829
|
-
root: {
|
6830
|
-
height: "8"
|
6831
|
-
},
|
6832
|
-
item: {
|
6833
|
-
textStyle: "sm",
|
6834
|
-
px: "4",
|
6835
|
-
gap: "2"
|
6836
|
-
}
|
6837
|
-
},
|
6838
|
-
lg: {
|
6839
|
-
root: {
|
6840
|
-
height: "10"
|
6841
|
-
},
|
6842
|
-
item: {
|
6843
|
-
textStyle: "md",
|
6844
|
-
px: "5",
|
6845
|
-
gap: "3"
|
7375
|
+
textStyle: "2xl"
|
6846
7376
|
}
|
6847
7377
|
}
|
6848
7378
|
}
|
@@ -6853,9 +7383,9 @@ var segmentGroupSlotRecipe = defineSlotRecipe40({
|
|
6853
7383
|
});
|
6854
7384
|
|
6855
7385
|
// src/theme/recipes/chakra/slider.ts
|
6856
|
-
import { defineSlotRecipe as
|
7386
|
+
import { defineSlotRecipe as defineSlotRecipe44 } from "@chakra-ui/react";
|
6857
7387
|
import { sliderAnatomy } from "@chakra-ui/react/anatomy";
|
6858
|
-
var sliderSlotRecipe =
|
7388
|
+
var sliderSlotRecipe = defineSlotRecipe44({
|
6859
7389
|
className: "chakra-slider",
|
6860
7390
|
slots: sliderAnatomy.keys(),
|
6861
7391
|
base: {
|
@@ -7030,9 +7560,9 @@ var sliderSlotRecipe = defineSlotRecipe41({
|
|
7030
7560
|
});
|
7031
7561
|
|
7032
7562
|
// src/theme/recipes/chakra/stat.ts
|
7033
|
-
import { defineSlotRecipe as
|
7563
|
+
import { defineSlotRecipe as defineSlotRecipe45 } from "@chakra-ui/react";
|
7034
7564
|
import { statAnatomy } from "@chakra-ui/react/anatomy";
|
7035
|
-
var statSlotRecipe =
|
7565
|
+
var statSlotRecipe = defineSlotRecipe45({
|
7036
7566
|
className: "chakra-stat",
|
7037
7567
|
slots: statAnatomy.keys(),
|
7038
7568
|
base: {
|
@@ -7108,9 +7638,9 @@ var statSlotRecipe = defineSlotRecipe42({
|
|
7108
7638
|
});
|
7109
7639
|
|
7110
7640
|
// src/theme/recipes/chakra/steps.ts
|
7111
|
-
import { defineSlotRecipe as
|
7641
|
+
import { defineSlotRecipe as defineSlotRecipe46 } from "@chakra-ui/react";
|
7112
7642
|
import { stepsAnatomy } from "@chakra-ui/react/anatomy";
|
7113
|
-
var stepsSlotRecipe =
|
7643
|
+
var stepsSlotRecipe = defineSlotRecipe46({
|
7114
7644
|
className: "chakra-steps",
|
7115
7645
|
slots: stepsAnatomy.keys(),
|
7116
7646
|
base: {
|
@@ -7323,9 +7853,9 @@ var stepsSlotRecipe = defineSlotRecipe43({
|
|
7323
7853
|
});
|
7324
7854
|
|
7325
7855
|
// src/theme/recipes/chakra/switch.ts
|
7326
|
-
import { defineSlotRecipe as
|
7856
|
+
import { defineSlotRecipe as defineSlotRecipe47 } from "@chakra-ui/react";
|
7327
7857
|
import { switchAnatomy } from "@chakra-ui/react/anatomy";
|
7328
|
-
var switchSlotRecipe =
|
7858
|
+
var switchSlotRecipe = defineSlotRecipe47({
|
7329
7859
|
slots: switchAnatomy.keys(),
|
7330
7860
|
className: "chakra-switch",
|
7331
7861
|
base: {
|
@@ -7481,9 +8011,9 @@ var switchSlotRecipe = defineSlotRecipe44({
|
|
7481
8011
|
});
|
7482
8012
|
|
7483
8013
|
// src/theme/recipes/chakra/table.ts
|
7484
|
-
import { defineSlotRecipe as
|
8014
|
+
import { defineSlotRecipe as defineSlotRecipe48 } from "@chakra-ui/react";
|
7485
8015
|
import { tableAnatomy } from "@chakra-ui/react/anatomy";
|
7486
|
-
var tableSlotRecipe =
|
8016
|
+
var tableSlotRecipe = defineSlotRecipe48({
|
7487
8017
|
className: "chakra-table",
|
7488
8018
|
slots: tableAnatomy.keys(),
|
7489
8019
|
base: {
|
@@ -7566,358 +8096,87 @@ var tableSlotRecipe = defineSlotRecipe45({
|
|
7566
8096
|
line: {
|
7567
8097
|
columnHeader: {
|
7568
8098
|
borderBottomWidth: "1px"
|
7569
|
-
},
|
7570
|
-
cell: {
|
7571
|
-
borderBottomWidth: "1px"
|
7572
|
-
},
|
7573
|
-
row: {
|
7574
|
-
bg: "bg"
|
7575
|
-
}
|
7576
|
-
},
|
7577
|
-
outline: {
|
7578
|
-
root: {
|
7579
|
-
boxShadow: "0 0 0 1px {colors.border}",
|
7580
|
-
overflow: "hidden"
|
7581
|
-
},
|
7582
|
-
columnHeader: {
|
7583
|
-
borderBottomWidth: "1px"
|
7584
|
-
},
|
7585
|
-
header: {
|
7586
|
-
bg: "bg.muted"
|
7587
|
-
},
|
7588
|
-
row: {
|
7589
|
-
"&:not(:last-of-type)": {
|
7590
|
-
borderBottomWidth: "1px"
|
7591
|
-
}
|
7592
|
-
},
|
7593
|
-
footer: {
|
7594
|
-
borderTopWidth: "1px"
|
7595
|
-
}
|
7596
|
-
}
|
7597
|
-
},
|
7598
|
-
size: {
|
7599
|
-
sm: {
|
7600
|
-
root: {
|
7601
|
-
textStyle: "sm"
|
7602
|
-
},
|
7603
|
-
columnHeader: {
|
7604
|
-
px: "2",
|
7605
|
-
py: "2"
|
7606
|
-
},
|
7607
|
-
cell: {
|
7608
|
-
px: "2",
|
7609
|
-
py: "2"
|
7610
|
-
}
|
7611
|
-
},
|
7612
|
-
md: {
|
7613
|
-
root: {
|
7614
|
-
textStyle: "sm"
|
7615
|
-
},
|
7616
|
-
columnHeader: {
|
7617
|
-
px: "3",
|
7618
|
-
py: "3"
|
7619
|
-
},
|
7620
|
-
cell: {
|
7621
|
-
px: "3",
|
7622
|
-
py: "3"
|
7623
|
-
}
|
7624
|
-
},
|
7625
|
-
lg: {
|
7626
|
-
root: {
|
7627
|
-
textStyle: "md"
|
7628
|
-
},
|
7629
|
-
columnHeader: {
|
7630
|
-
px: "4",
|
7631
|
-
py: "3"
|
7632
|
-
},
|
7633
|
-
cell: {
|
7634
|
-
px: "4",
|
7635
|
-
py: "3"
|
7636
|
-
}
|
7637
|
-
}
|
7638
|
-
}
|
7639
|
-
},
|
7640
|
-
defaultVariants: {
|
7641
|
-
variant: "line",
|
7642
|
-
size: "md"
|
7643
|
-
}
|
7644
|
-
});
|
7645
|
-
|
7646
|
-
// src/theme/recipes/chakra/tabs.ts
|
7647
|
-
import { defineSlotRecipe as defineSlotRecipe46 } from "@chakra-ui/react";
|
7648
|
-
import { tabsAnatomy } from "@chakra-ui/react/anatomy";
|
7649
|
-
var tabsSlotRecipe = defineSlotRecipe46({
|
7650
|
-
slots: tabsAnatomy.keys(),
|
7651
|
-
className: "chakra-tabs",
|
7652
|
-
base: {
|
7653
|
-
root: {
|
7654
|
-
"--tabs-trigger-radius": "radii.l2",
|
7655
|
-
position: "relative",
|
7656
|
-
_horizontal: {
|
7657
|
-
display: "block"
|
7658
|
-
},
|
7659
|
-
_vertical: {
|
7660
|
-
display: "flex"
|
7661
|
-
}
|
7662
|
-
},
|
7663
|
-
list: {
|
7664
|
-
display: "inline-flex",
|
7665
|
-
position: "relative",
|
7666
|
-
isolation: "isolate",
|
7667
|
-
"--tabs-indicator-shadow": "shadows.xs",
|
7668
|
-
"--tabs-indicator-bg": "colors.bg",
|
7669
|
-
minH: "var(--tabs-height)",
|
7670
|
-
_horizontal: {
|
7671
|
-
flexDirection: "row"
|
7672
|
-
},
|
7673
|
-
_vertical: {
|
7674
|
-
flexDirection: "column"
|
7675
|
-
}
|
7676
|
-
},
|
7677
|
-
trigger: {
|
7678
|
-
outline: "0",
|
7679
|
-
minW: "var(--tabs-height)",
|
7680
|
-
height: "var(--tabs-height)",
|
7681
|
-
display: "flex",
|
7682
|
-
alignItems: "center",
|
7683
|
-
fontWeight: "medium",
|
7684
|
-
position: "relative",
|
7685
|
-
cursor: "button",
|
7686
|
-
gap: "2",
|
7687
|
-
_focusVisible: {
|
7688
|
-
zIndex: 1,
|
7689
|
-
focusVisibleRing: "outside"
|
7690
|
-
},
|
7691
|
-
_disabled: {
|
7692
|
-
cursor: "not-allowed",
|
7693
|
-
opacity: 0.5
|
7694
|
-
}
|
7695
|
-
},
|
7696
|
-
content: {
|
7697
|
-
focusVisibleRing: "inside",
|
7698
|
-
_horizontal: {
|
7699
|
-
width: "100%",
|
7700
|
-
pt: "var(--tabs-content-padding)"
|
7701
|
-
},
|
7702
|
-
_vertical: {
|
7703
|
-
height: "100%",
|
7704
|
-
ps: "var(--tabs-content-padding)"
|
7705
|
-
}
|
7706
|
-
},
|
7707
|
-
indicator: {
|
7708
|
-
width: "var(--width)",
|
7709
|
-
height: "var(--height)",
|
7710
|
-
borderRadius: "var(--tabs-indicator-radius)",
|
7711
|
-
bg: "var(--tabs-indicator-bg)",
|
7712
|
-
shadow: "var(--tabs-indicator-shadow)",
|
7713
|
-
zIndex: -1
|
7714
|
-
}
|
7715
|
-
},
|
7716
|
-
variants: {
|
7717
|
-
fitted: {
|
7718
|
-
true: {
|
7719
|
-
list: {
|
7720
|
-
display: "flex"
|
7721
|
-
},
|
7722
|
-
trigger: {
|
7723
|
-
flex: 1,
|
7724
|
-
textAlign: "center",
|
7725
|
-
justifyContent: "center"
|
7726
|
-
}
|
7727
|
-
}
|
7728
|
-
},
|
7729
|
-
justify: {
|
7730
|
-
start: {
|
7731
|
-
list: {
|
7732
|
-
justifyContent: "flex-start"
|
7733
|
-
}
|
7734
|
-
},
|
7735
|
-
center: {
|
7736
|
-
list: {
|
7737
|
-
justifyContent: "center"
|
7738
|
-
}
|
7739
|
-
},
|
7740
|
-
end: {
|
7741
|
-
list: {
|
7742
|
-
justifyContent: "flex-end"
|
7743
|
-
}
|
7744
|
-
}
|
7745
|
-
},
|
7746
|
-
size: {
|
7747
|
-
sm: {
|
7748
|
-
root: {
|
7749
|
-
"--tabs-height": "sizes.9",
|
7750
|
-
"--tabs-content-padding": "spacing.3"
|
7751
|
-
},
|
7752
|
-
trigger: {
|
7753
|
-
py: "1",
|
7754
|
-
px: "3",
|
7755
|
-
textStyle: "sm"
|
7756
|
-
}
|
7757
|
-
},
|
7758
|
-
md: {
|
7759
|
-
root: {
|
7760
|
-
"--tabs-height": "sizes.10",
|
7761
|
-
"--tabs-content-padding": "spacing.4"
|
7762
|
-
},
|
7763
|
-
trigger: {
|
7764
|
-
py: "2",
|
7765
|
-
px: "4",
|
7766
|
-
textStyle: "sm"
|
7767
|
-
}
|
7768
|
-
},
|
7769
|
-
lg: {
|
7770
|
-
root: {
|
7771
|
-
"--tabs-height": "sizes.11",
|
7772
|
-
"--tabs-content-padding": "spacing.4.5"
|
7773
|
-
},
|
7774
|
-
trigger: {
|
7775
|
-
py: "2",
|
7776
|
-
px: "4.5",
|
7777
|
-
textStyle: "md"
|
7778
|
-
}
|
7779
|
-
}
|
7780
|
-
},
|
7781
|
-
variant: {
|
7782
|
-
line: {
|
7783
|
-
list: {
|
7784
|
-
display: "flex",
|
7785
|
-
borderColor: "border",
|
7786
|
-
_horizontal: {
|
7787
|
-
borderBottomWidth: "1px"
|
7788
|
-
},
|
7789
|
-
_vertical: {
|
7790
|
-
borderEndWidth: "1px"
|
7791
|
-
}
|
7792
|
-
},
|
7793
|
-
trigger: {
|
7794
|
-
color: "fg.muted",
|
7795
|
-
_disabled: {
|
7796
|
-
_active: { bg: "initial" }
|
7797
|
-
},
|
7798
|
-
_selected: {
|
7799
|
-
color: "fg",
|
7800
|
-
_horizontal: {
|
7801
|
-
layerStyle: "indicator.bottom",
|
7802
|
-
"--indicator-offset-y": "-1px",
|
7803
|
-
"--indicator-color": "colors.colorPalette.solid"
|
7804
|
-
},
|
7805
|
-
_vertical: {
|
7806
|
-
layerStyle: "indicator.end",
|
7807
|
-
"--indicator-offset-x": "-1px"
|
7808
|
-
}
|
7809
|
-
}
|
7810
|
-
}
|
7811
|
-
},
|
7812
|
-
subtle: {
|
7813
|
-
trigger: {
|
7814
|
-
borderRadius: "var(--tabs-trigger-radius)",
|
7815
|
-
color: "fg.muted",
|
7816
|
-
_selected: {
|
7817
|
-
bg: "colorPalette.subtle",
|
7818
|
-
color: "colorPalette.fg"
|
7819
|
-
}
|
8099
|
+
},
|
8100
|
+
cell: {
|
8101
|
+
borderBottomWidth: "1px"
|
8102
|
+
},
|
8103
|
+
row: {
|
8104
|
+
bg: "bg"
|
7820
8105
|
}
|
7821
8106
|
},
|
7822
|
-
|
7823
|
-
|
7824
|
-
|
7825
|
-
|
7826
|
-
borderRadius: "l3",
|
7827
|
-
minH: "calc(var(--tabs-height) - 4px)"
|
8107
|
+
outline: {
|
8108
|
+
root: {
|
8109
|
+
boxShadow: "0 0 0 1px {colors.border}",
|
8110
|
+
overflow: "hidden"
|
7828
8111
|
},
|
7829
|
-
|
7830
|
-
|
7831
|
-
|
7832
|
-
|
7833
|
-
|
7834
|
-
|
7835
|
-
|
7836
|
-
|
8112
|
+
columnHeader: {
|
8113
|
+
borderBottomWidth: "1px"
|
8114
|
+
},
|
8115
|
+
header: {
|
8116
|
+
bg: "bg.muted"
|
8117
|
+
},
|
8118
|
+
row: {
|
8119
|
+
"&:not(:last-of-type)": {
|
8120
|
+
borderBottomWidth: "1px"
|
7837
8121
|
}
|
8122
|
+
},
|
8123
|
+
footer: {
|
8124
|
+
borderTopWidth: "1px"
|
8125
|
+
}
|
8126
|
+
}
|
8127
|
+
},
|
8128
|
+
size: {
|
8129
|
+
sm: {
|
8130
|
+
root: {
|
8131
|
+
textStyle: "sm"
|
8132
|
+
},
|
8133
|
+
columnHeader: {
|
8134
|
+
px: "2",
|
8135
|
+
py: "2"
|
8136
|
+
},
|
8137
|
+
cell: {
|
8138
|
+
px: "2",
|
8139
|
+
py: "2"
|
7838
8140
|
}
|
7839
8141
|
},
|
7840
|
-
|
7841
|
-
|
7842
|
-
|
7843
|
-
"--line-offset": "calc(var(--line-thickness) * -1)",
|
7844
|
-
borderColor: "border",
|
7845
|
-
display: "flex",
|
7846
|
-
_horizontal: {
|
7847
|
-
_before: {
|
7848
|
-
content: '""',
|
7849
|
-
position: "absolute",
|
7850
|
-
bottom: "0px",
|
7851
|
-
width: "100%",
|
7852
|
-
borderBottomWidth: "var(--line-thickness)",
|
7853
|
-
borderBottomColor: "border"
|
7854
|
-
}
|
7855
|
-
},
|
7856
|
-
_vertical: {
|
7857
|
-
_before: {
|
7858
|
-
content: '""',
|
7859
|
-
position: "absolute",
|
7860
|
-
insetInline: "var(--line-offset)",
|
7861
|
-
height: "calc(100% - calc(var(--line-thickness) * 2))",
|
7862
|
-
borderEndWidth: "var(--line-thickness)",
|
7863
|
-
borderEndColor: "border"
|
7864
|
-
}
|
7865
|
-
}
|
8142
|
+
md: {
|
8143
|
+
root: {
|
8144
|
+
textStyle: "sm"
|
7866
8145
|
},
|
7867
|
-
|
7868
|
-
|
7869
|
-
|
7870
|
-
|
7871
|
-
|
7872
|
-
|
7873
|
-
|
7874
|
-
},
|
7875
|
-
_horizontal: {
|
7876
|
-
borderTopRadius: "var(--tabs-trigger-radius)",
|
7877
|
-
marginBottom: "var(--line-offset)",
|
7878
|
-
marginEnd: { _notLast: "var(--line-offset)" },
|
7879
|
-
_selected: {
|
7880
|
-
borderColor: "border",
|
7881
|
-
borderBottomColor: "transparent"
|
7882
|
-
}
|
7883
|
-
},
|
7884
|
-
_vertical: {
|
7885
|
-
borderStartRadius: "var(--tabs-trigger-radius)",
|
7886
|
-
marginEnd: "var(--line-offset)",
|
7887
|
-
marginBottom: { _notLast: "var(--line-offset)" },
|
7888
|
-
_selected: {
|
7889
|
-
borderColor: "border",
|
7890
|
-
borderEndColor: "transparent"
|
7891
|
-
}
|
7892
|
-
}
|
8146
|
+
columnHeader: {
|
8147
|
+
px: "3",
|
8148
|
+
py: "3"
|
8149
|
+
},
|
8150
|
+
cell: {
|
8151
|
+
px: "3",
|
8152
|
+
py: "3"
|
7893
8153
|
}
|
7894
8154
|
},
|
7895
|
-
|
7896
|
-
|
7897
|
-
|
7898
|
-
|
7899
|
-
|
7900
|
-
|
7901
|
-
|
7902
|
-
|
7903
|
-
|
7904
|
-
|
7905
|
-
|
7906
|
-
}
|
8155
|
+
lg: {
|
8156
|
+
root: {
|
8157
|
+
textStyle: "md"
|
8158
|
+
},
|
8159
|
+
columnHeader: {
|
8160
|
+
px: "4",
|
8161
|
+
py: "3"
|
8162
|
+
},
|
8163
|
+
cell: {
|
8164
|
+
px: "4",
|
8165
|
+
py: "3"
|
7907
8166
|
}
|
7908
8167
|
}
|
7909
8168
|
}
|
7910
8169
|
},
|
7911
8170
|
defaultVariants: {
|
7912
|
-
|
7913
|
-
|
8171
|
+
variant: "line",
|
8172
|
+
size: "md"
|
7914
8173
|
}
|
7915
8174
|
});
|
7916
8175
|
|
7917
8176
|
// src/theme/recipes/chakra/timeline.ts
|
7918
|
-
import { defineSlotRecipe as
|
8177
|
+
import { defineSlotRecipe as defineSlotRecipe49 } from "@chakra-ui/react";
|
7919
8178
|
import { timelineAnatomy } from "@chakra-ui/react/anatomy";
|
7920
|
-
var timelineSlotRecipe =
|
8179
|
+
var timelineSlotRecipe = defineSlotRecipe49({
|
7921
8180
|
slots: timelineAnatomy.keys(),
|
7922
8181
|
className: "chakra-timeline",
|
7923
8182
|
base: {
|
@@ -8050,156 +8309,6 @@ var timelineSlotRecipe = defineSlotRecipe47({
|
|
8050
8309
|
}
|
8051
8310
|
});
|
8052
8311
|
|
8053
|
-
// src/theme/recipes/chakra/toast.ts
|
8054
|
-
import { defineSlotRecipe as defineSlotRecipe48 } from "@chakra-ui/react";
|
8055
|
-
import { toastAnatomy } from "@chakra-ui/react/anatomy";
|
8056
|
-
var toastSlotRecipe = defineSlotRecipe48({
|
8057
|
-
slots: toastAnatomy.keys(),
|
8058
|
-
className: "chakra-toast",
|
8059
|
-
base: {
|
8060
|
-
root: {
|
8061
|
-
width: "full",
|
8062
|
-
display: "flex",
|
8063
|
-
alignItems: "flex-start",
|
8064
|
-
position: "relative",
|
8065
|
-
gap: "3",
|
8066
|
-
py: "4",
|
8067
|
-
ps: "4",
|
8068
|
-
pe: "6",
|
8069
|
-
borderRadius: "l2",
|
8070
|
-
translate: "var(--x) var(--y)",
|
8071
|
-
scale: "var(--scale)",
|
8072
|
-
zIndex: "var(--z-index)",
|
8073
|
-
height: "var(--height)",
|
8074
|
-
opacity: "var(--opacity)",
|
8075
|
-
willChange: "translate, opacity, scale",
|
8076
|
-
transition: "translate 400ms, scale 400ms, opacity 400ms, height 400ms, box-shadow 200ms",
|
8077
|
-
transitionTimingFunction: "cubic-bezier(0.21, 1.02, 0.73, 1)",
|
8078
|
-
_closed: {
|
8079
|
-
transition: "translate 400ms, scale 400ms, opacity 200ms",
|
8080
|
-
transitionTimingFunction: "cubic-bezier(0.06, 0.71, 0.55, 1)"
|
8081
|
-
},
|
8082
|
-
bg: "bg.panel",
|
8083
|
-
color: "fg",
|
8084
|
-
boxShadow: "xl",
|
8085
|
-
"--toast-trigger-bg": "colors.bg.muted",
|
8086
|
-
"&[data-type=warning]": {
|
8087
|
-
bg: "orange.solid",
|
8088
|
-
color: "orange.contrast",
|
8089
|
-
"--toast-trigger-bg": "{white/10}",
|
8090
|
-
"--toast-border-color": "{white/40}"
|
8091
|
-
},
|
8092
|
-
"&[data-type=success]": {
|
8093
|
-
bg: "green.solid",
|
8094
|
-
color: "green.contrast",
|
8095
|
-
"--toast-trigger-bg": "{white/10}",
|
8096
|
-
"--toast-border-color": "{white/40}"
|
8097
|
-
},
|
8098
|
-
"&[data-type=error]": {
|
8099
|
-
bg: "red.solid",
|
8100
|
-
color: "red.contrast",
|
8101
|
-
"--toast-trigger-bg": "{white/10}",
|
8102
|
-
"--toast-border-color": "{white/40}"
|
8103
|
-
}
|
8104
|
-
},
|
8105
|
-
title: {
|
8106
|
-
fontWeight: "medium",
|
8107
|
-
textStyle: "sm",
|
8108
|
-
marginEnd: "2"
|
8109
|
-
},
|
8110
|
-
description: {
|
8111
|
-
display: "inline",
|
8112
|
-
textStyle: "sm",
|
8113
|
-
opacity: "0.8"
|
8114
|
-
},
|
8115
|
-
indicator: {
|
8116
|
-
flexShrink: "0",
|
8117
|
-
boxSize: "5"
|
8118
|
-
},
|
8119
|
-
actionTrigger: {
|
8120
|
-
textStyle: "sm",
|
8121
|
-
fontWeight: "medium",
|
8122
|
-
height: "8",
|
8123
|
-
px: "3",
|
8124
|
-
borderRadius: "l2",
|
8125
|
-
alignSelf: "center",
|
8126
|
-
borderWidth: "1px",
|
8127
|
-
borderColor: "var(--toast-border-color, inherit)",
|
8128
|
-
transition: "background 200ms",
|
8129
|
-
_hover: {
|
8130
|
-
bg: "var(--toast-trigger-bg)"
|
8131
|
-
}
|
8132
|
-
},
|
8133
|
-
closeTrigger: {
|
8134
|
-
position: "absolute",
|
8135
|
-
top: "1",
|
8136
|
-
insetEnd: "1",
|
8137
|
-
padding: "1",
|
8138
|
-
display: "inline-flex",
|
8139
|
-
alignItems: "center",
|
8140
|
-
justifyContent: "center",
|
8141
|
-
color: "{currentColor/60}",
|
8142
|
-
borderRadius: "l2",
|
8143
|
-
textStyle: "md",
|
8144
|
-
transition: "background 200ms"
|
8145
|
-
}
|
8146
|
-
}
|
8147
|
-
});
|
8148
|
-
|
8149
|
-
// src/theme/recipes/chakra/tooltip.ts
|
8150
|
-
import { defineSlotRecipe as defineSlotRecipe49 } from "@chakra-ui/react";
|
8151
|
-
import { tooltipAnatomy } from "@chakra-ui/react/anatomy";
|
8152
|
-
var tooltipSlotRecipe = defineSlotRecipe49({
|
8153
|
-
slots: tooltipAnatomy.keys(),
|
8154
|
-
className: "chakra-tooltip",
|
8155
|
-
base: {
|
8156
|
-
content: {
|
8157
|
-
"--tooltip-bg": "colors.bg",
|
8158
|
-
display: "flex",
|
8159
|
-
alignItems: "center",
|
8160
|
-
bg: "var(--tooltip-bg)",
|
8161
|
-
color: "fg",
|
8162
|
-
px: "2.5",
|
8163
|
-
py: "1",
|
8164
|
-
borderRadius: "l2",
|
8165
|
-
fontWeight: "medium",
|
8166
|
-
textStyle: "xs",
|
8167
|
-
boxShadow: "md",
|
8168
|
-
maxW: "xs",
|
8169
|
-
zIndex: "tooltip",
|
8170
|
-
transformOrigin: "var(--transform-origin)",
|
8171
|
-
_open: {
|
8172
|
-
animationStyle: "scale-fade-in",
|
8173
|
-
animationDuration: "fast"
|
8174
|
-
},
|
8175
|
-
_closed: {
|
8176
|
-
animationStyle: "scale-fade-out",
|
8177
|
-
animationDuration: "fast"
|
8178
|
-
}
|
8179
|
-
},
|
8180
|
-
arrow: {
|
8181
|
-
"--arrow-size": "sizes.2",
|
8182
|
-
"--arrow-background": "var(--tooltip-bg)",
|
8183
|
-
zIndex: "-1"
|
8184
|
-
},
|
8185
|
-
arrowTip: {
|
8186
|
-
borderTopWidth: "1px",
|
8187
|
-
borderInlineStartWidth: "1px",
|
8188
|
-
borderColor: "var(--tooltip-bg)"
|
8189
|
-
}
|
8190
|
-
},
|
8191
|
-
variants: {
|
8192
|
-
variant: {
|
8193
|
-
inverted: {
|
8194
|
-
content: {
|
8195
|
-
"--tooltip-bg": "colors.bg.inverted",
|
8196
|
-
color: "fg.inverted"
|
8197
|
-
}
|
8198
|
-
}
|
8199
|
-
}
|
8200
|
-
}
|
8201
|
-
});
|
8202
|
-
|
8203
8312
|
// src/theme/slot-recipes.ts
|
8204
8313
|
var slotRecipes = {
|
8205
8314
|
// Chakra UI Recipes
|
@@ -8613,17 +8722,17 @@ var lineHeights = defineTokens12.lineHeights({
|
|
8613
8722
|
import { defineTokens as defineTokens13 } from "@chakra-ui/react";
|
8614
8723
|
var radii = defineTokens13.radii({
|
8615
8724
|
"2xs": {
|
8616
|
-
value:
|
8617
|
-
},
|
8618
|
-
xs: { value:
|
8619
|
-
sm: { value:
|
8620
|
-
md: { value:
|
8621
|
-
lg: { value:
|
8622
|
-
xl: { value:
|
8623
|
-
"2xl": { value:
|
8624
|
-
"3xl": { value:
|
8625
|
-
"4xl": { value:
|
8626
|
-
full: { value: "
|
8725
|
+
value: "0.0625rem"
|
8726
|
+
},
|
8727
|
+
xs: { value: "0.125rem" },
|
8728
|
+
sm: { value: "0.25rem" },
|
8729
|
+
md: { value: "0.375rem" },
|
8730
|
+
lg: { value: "0.5rem" },
|
8731
|
+
xl: { value: "0.75rem" },
|
8732
|
+
"2xl": { value: "1rem" },
|
8733
|
+
"3xl": { value: "1.5rem" },
|
8734
|
+
"4xl": { value: "2rem" },
|
8735
|
+
full: { value: "9999px" }
|
8627
8736
|
});
|
8628
8737
|
|
8629
8738
|
// src/theme/tokens/sizes.ts
|
@@ -8885,9 +8994,11 @@ export {
|
|
8885
8994
|
Checkbox,
|
8886
8995
|
CloseButton,
|
8887
8996
|
Command,
|
8888
|
-
|
8889
|
-
|
8997
|
+
DataList,
|
8998
|
+
dialog_exports as Dialog,
|
8999
|
+
drawer_exports as Drawer,
|
8890
9000
|
EmptyState,
|
9001
|
+
file_upload_exports as FileUpload,
|
8891
9002
|
grid_list_exports as GridList,
|
8892
9003
|
IconBadge,
|
8893
9004
|
IconButton,
|
@@ -8902,11 +9013,12 @@ export {
|
|
8902
9013
|
Persona,
|
8903
9014
|
PersonaAvatar,
|
8904
9015
|
PinInput,
|
9016
|
+
popover_exports as Popover,
|
8905
9017
|
Radio,
|
8906
9018
|
RadioGroup,
|
8907
9019
|
SearchInput,
|
8908
9020
|
SegmentedControl,
|
8909
|
-
|
9021
|
+
namespace_exports as Select,
|
8910
9022
|
sidebar_exports as Sidebar,
|
8911
9023
|
Spinner,
|
8912
9024
|
Status,
|
@@ -8914,6 +9026,7 @@ export {
|
|
8914
9026
|
SuiContext,
|
8915
9027
|
SuiProvider,
|
8916
9028
|
Switch,
|
9029
|
+
Tabs,
|
8917
9030
|
Tag,
|
8918
9031
|
Toaster,
|
8919
9032
|
Tooltip,
|
@@ -8922,10 +9035,13 @@ export {
|
|
8922
9035
|
defaultPresenceOptions,
|
8923
9036
|
defaultSystem,
|
8924
9037
|
toast,
|
9038
|
+
useDataListStyles,
|
8925
9039
|
useLink,
|
8926
9040
|
useLoadingOverlayStyles,
|
8927
9041
|
useSidebar,
|
8928
9042
|
useSidebarItemStyles,
|
8929
9043
|
useSidebarStyles,
|
8930
|
-
useSui
|
9044
|
+
useSui,
|
9045
|
+
useTabsContext,
|
9046
|
+
useTabsStyles
|
8931
9047
|
};
|