@glyphui/ui 0.0.0-stage → 0.1.1
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/LICENSE +21 -0
- package/README.md +137 -2
- package/dist/data-table.d.ts +110 -0
- package/dist/data-table.js +225 -0
- package/dist/field-DXZD0l8w.js +107 -0
- package/dist/field-context-B8cYheXz.js +321 -0
- package/dist/form.d.ts +79 -0
- package/dist/form.js +84 -0
- package/dist/index-BWK4czIG.d.ts +233 -0
- package/dist/index.d.ts +2155 -0
- package/dist/index.js +1529 -0
- package/dist/registry-BGSJoiLq.d.ts +9 -0
- package/dist/states-BxPjCUxz.js +287 -0
- package/dist/tv-DuMh7UH2.d.ts +6 -0
- package/package.json +113 -3
- package/src/components/avatar/avatar.styles.ts +22 -0
- package/src/components/avatar/avatar.tsx +62 -0
- package/src/components/avatar/index.ts +2 -0
- package/src/components/badge/badge.styles.ts +69 -0
- package/src/components/badge/badge.tsx +30 -0
- package/src/components/badge/index.ts +2 -0
- package/src/components/button/button.styles.ts +43 -0
- package/src/components/button/button.tsx +77 -0
- package/src/components/button/index.ts +2 -0
- package/src/components/card/card.styles.ts +32 -0
- package/src/components/card/card.tsx +91 -0
- package/src/components/card/index.ts +11 -0
- package/src/components/checkbox/checkbox.tsx +39 -0
- package/src/components/checkbox/index.ts +1 -0
- package/src/components/container/container.tsx +35 -0
- package/src/components/container/index.ts +1 -0
- package/src/components/eyebrow/eyebrow.styles.ts +14 -0
- package/src/components/eyebrow/eyebrow.tsx +19 -0
- package/src/components/eyebrow/index.ts +2 -0
- package/src/components/field/field-context.ts +40 -0
- package/src/components/field/field.styles.ts +23 -0
- package/src/components/field/field.tsx +109 -0
- package/src/components/field/index.ts +3 -0
- package/src/components/heading/heading.styles.ts +16 -0
- package/src/components/heading/heading.tsx +26 -0
- package/src/components/heading/index.ts +2 -0
- package/src/components/input/index.ts +2 -0
- package/src/components/input/input.styles.ts +36 -0
- package/src/components/input/input.tsx +33 -0
- package/src/components/kbd/index.ts +1 -0
- package/src/components/kbd/kbd.tsx +21 -0
- package/src/components/label/index.ts +1 -0
- package/src/components/label/label.tsx +21 -0
- package/src/components/section/index.ts +1 -0
- package/src/components/section/section.tsx +39 -0
- package/src/components/segmented-control/index.ts +6 -0
- package/src/components/segmented-control/segmented-control.tsx +79 -0
- package/src/components/select/index.ts +1 -0
- package/src/components/select/select.tsx +133 -0
- package/src/components/separator/index.ts +1 -0
- package/src/components/separator/separator.tsx +29 -0
- package/src/components/skeleton/index.ts +1 -0
- package/src/components/skeleton/skeleton.tsx +20 -0
- package/src/components/spinner/index.ts +2 -0
- package/src/components/spinner/spinner.styles.ts +19 -0
- package/src/components/spinner/spinner.tsx +42 -0
- package/src/components/stack/index.ts +1 -0
- package/src/components/stack/stack.tsx +62 -0
- package/src/components/switch/index.ts +1 -0
- package/src/components/switch/switch.tsx +48 -0
- package/src/components/table/index.ts +10 -0
- package/src/components/table/table.tsx +90 -0
- package/src/components/tabs/index.ts +1 -0
- package/src/components/tabs/tabs.tsx +92 -0
- package/src/components/text/index.ts +2 -0
- package/src/components/text/text.styles.ts +32 -0
- package/src/components/text/text.tsx +17 -0
- package/src/components/textarea/index.ts +1 -0
- package/src/components/textarea/textarea.tsx +27 -0
- package/src/components/tooltip/index.ts +1 -0
- package/src/components/tooltip/tooltip.tsx +42 -0
- package/src/hooks/index.ts +4 -0
- package/src/hooks/use-component-config.ts +42 -0
- package/src/hooks/use-controllable-state.ts +27 -0
- package/src/hooks/use-media-query.ts +14 -0
- package/src/hooks/use-scrolled.ts +14 -0
- package/src/index.ts +52 -0
- package/src/internal/icons.tsx +99 -0
- package/src/patterns/app-shell/app-shell-context.ts +27 -0
- package/src/patterns/app-shell/app-shell.styles.ts +127 -0
- package/src/patterns/app-shell/app-shell.tsx +81 -0
- package/src/patterns/app-shell/index.ts +16 -0
- package/src/patterns/app-shell/navbar.tsx +119 -0
- package/src/patterns/app-shell/page-header.tsx +30 -0
- package/src/patterns/app-shell/sidebar.tsx +163 -0
- package/src/patterns/async/async.tsx +83 -0
- package/src/patterns/async/index.ts +10 -0
- package/src/patterns/async/states.tsx +128 -0
- package/src/patterns/data-table/data-table.tsx +367 -0
- package/src/patterns/data-table/index.ts +2 -0
- package/src/patterns/form/form.tsx +150 -0
- package/src/patterns/form/index.ts +13 -0
- package/src/provider/color-mode.tsx +133 -0
- package/src/provider/glyph-context.ts +42 -0
- package/src/provider/glyph-provider.tsx +41 -0
- package/src/provider/index.ts +18 -0
- package/src/provider/theme-scope.tsx +36 -0
- package/src/provider/theme-style.tsx +19 -0
- package/src/register.ts +69 -0
- package/src/themes.ts +56 -0
- package/src/utils/cn.ts +12 -0
- package/src/utils/compose-refs.ts +11 -0
- package/src/utils/registry.ts +9 -0
- package/src/utils/styles.ts +13 -0
- package/src/utils/tv.ts +7 -0
- package/src/utils/tw-merge-config.ts +14 -0
- package/styles.css +178 -0
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,2155 @@
|
|
|
1
|
+
import { n as tv, t as VariantProps } from "./tv-DuMh7UH2.js";
|
|
2
|
+
import { a as IconButton, c as fieldStyles, i as ButtonProps, l as ButtonVariants, n as FieldProps, o as IconButtonProps, r as Button, s as FieldVariants, t as Field, u as buttonStyles } from "./index-BWK4czIG.js";
|
|
3
|
+
import { t as StylesEntry } from "./registry-BGSJoiLq.js";
|
|
4
|
+
import { ColorMode, ColorMode as ColorMode$1, ColorToken, ComponentName, ComponentOverrides, GlyphComponentRegistry, RadiusToken, ShadowToken, TextToken, Theme, Theme as Theme$1, ThemeInput, Tone, defineTheme, themeToCss, tokenVar } from "@glyphui/tokens";
|
|
5
|
+
import { Avatar as Avatar$1, Checkbox as Checkbox$1, Label as Label$1, Select as Select$1, Separator as Separator$1, Switch as Switch$1, Tabs as Tabs$1, Tooltip as Tooltip$1 } from "radix-ui";
|
|
6
|
+
import { ComponentProps, DependencyList, ElementType, MouseEvent, MouseEventHandler, ReactNode } from "react";
|
|
7
|
+
import { ClassValue } from "clsx";
|
|
8
|
+
//#region src/components/avatar/avatar.styles.d.ts
|
|
9
|
+
export declare const avatarStyles: import("tailwind-variants").TVReturnType<{
|
|
10
|
+
size: {
|
|
11
|
+
xs: {
|
|
12
|
+
root: string;
|
|
13
|
+
fallback: string;
|
|
14
|
+
};
|
|
15
|
+
sm: {
|
|
16
|
+
root: string;
|
|
17
|
+
fallback: string;
|
|
18
|
+
};
|
|
19
|
+
md: {
|
|
20
|
+
root: string;
|
|
21
|
+
fallback: string;
|
|
22
|
+
};
|
|
23
|
+
lg: {
|
|
24
|
+
root: string;
|
|
25
|
+
fallback: string;
|
|
26
|
+
};
|
|
27
|
+
};
|
|
28
|
+
}, {
|
|
29
|
+
root: string;
|
|
30
|
+
image: string;
|
|
31
|
+
fallback: string;
|
|
32
|
+
group: string;
|
|
33
|
+
}, undefined, {
|
|
34
|
+
size: {
|
|
35
|
+
xs: {
|
|
36
|
+
root: string;
|
|
37
|
+
fallback: string;
|
|
38
|
+
};
|
|
39
|
+
sm: {
|
|
40
|
+
root: string;
|
|
41
|
+
fallback: string;
|
|
42
|
+
};
|
|
43
|
+
md: {
|
|
44
|
+
root: string;
|
|
45
|
+
fallback: string;
|
|
46
|
+
};
|
|
47
|
+
lg: {
|
|
48
|
+
root: string;
|
|
49
|
+
fallback: string;
|
|
50
|
+
};
|
|
51
|
+
};
|
|
52
|
+
}, {
|
|
53
|
+
root: string;
|
|
54
|
+
image: string;
|
|
55
|
+
fallback: string;
|
|
56
|
+
group: string;
|
|
57
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
58
|
+
size: {
|
|
59
|
+
xs: {
|
|
60
|
+
root: string;
|
|
61
|
+
fallback: string;
|
|
62
|
+
};
|
|
63
|
+
sm: {
|
|
64
|
+
root: string;
|
|
65
|
+
fallback: string;
|
|
66
|
+
};
|
|
67
|
+
md: {
|
|
68
|
+
root: string;
|
|
69
|
+
fallback: string;
|
|
70
|
+
};
|
|
71
|
+
lg: {
|
|
72
|
+
root: string;
|
|
73
|
+
fallback: string;
|
|
74
|
+
};
|
|
75
|
+
};
|
|
76
|
+
}, {
|
|
77
|
+
root: string;
|
|
78
|
+
image: string;
|
|
79
|
+
fallback: string;
|
|
80
|
+
group: string;
|
|
81
|
+
}>>;
|
|
82
|
+
type AvatarVariants = VariantProps<typeof avatarStyles>;
|
|
83
|
+
//#endregion
|
|
84
|
+
//#region src/components/badge/badge.styles.d.ts
|
|
85
|
+
export declare const badgeStyles: import("tailwind-variants").TVReturnType<{
|
|
86
|
+
tone: {
|
|
87
|
+
neutral: {};
|
|
88
|
+
primary: {};
|
|
89
|
+
success: {};
|
|
90
|
+
warning: {};
|
|
91
|
+
danger: {};
|
|
92
|
+
info: {};
|
|
93
|
+
};
|
|
94
|
+
variant: {
|
|
95
|
+
soft: {};
|
|
96
|
+
solid: {};
|
|
97
|
+
outline: {
|
|
98
|
+
base: string;
|
|
99
|
+
};
|
|
100
|
+
};
|
|
101
|
+
}, {
|
|
102
|
+
base: string[];
|
|
103
|
+
dot: string;
|
|
104
|
+
}, undefined, {
|
|
105
|
+
tone: {
|
|
106
|
+
neutral: {};
|
|
107
|
+
primary: {};
|
|
108
|
+
success: {};
|
|
109
|
+
warning: {};
|
|
110
|
+
danger: {};
|
|
111
|
+
info: {};
|
|
112
|
+
};
|
|
113
|
+
variant: {
|
|
114
|
+
soft: {};
|
|
115
|
+
solid: {};
|
|
116
|
+
outline: {
|
|
117
|
+
base: string;
|
|
118
|
+
};
|
|
119
|
+
};
|
|
120
|
+
}, {
|
|
121
|
+
base: string[];
|
|
122
|
+
dot: string;
|
|
123
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
124
|
+
tone: {
|
|
125
|
+
neutral: {};
|
|
126
|
+
primary: {};
|
|
127
|
+
success: {};
|
|
128
|
+
warning: {};
|
|
129
|
+
danger: {};
|
|
130
|
+
info: {};
|
|
131
|
+
};
|
|
132
|
+
variant: {
|
|
133
|
+
soft: {};
|
|
134
|
+
solid: {};
|
|
135
|
+
outline: {
|
|
136
|
+
base: string;
|
|
137
|
+
};
|
|
138
|
+
};
|
|
139
|
+
}, {
|
|
140
|
+
base: string[];
|
|
141
|
+
dot: string;
|
|
142
|
+
}>>;
|
|
143
|
+
type BadgeVariants = VariantProps<typeof badgeStyles>;
|
|
144
|
+
//#endregion
|
|
145
|
+
//#region src/components/card/card.styles.d.ts
|
|
146
|
+
export declare const cardStyles: import("tailwind-variants").TVReturnType<{
|
|
147
|
+
variant: {
|
|
148
|
+
outline: {
|
|
149
|
+
root: string;
|
|
150
|
+
};
|
|
151
|
+
elevated: {
|
|
152
|
+
root: string;
|
|
153
|
+
};
|
|
154
|
+
ghost: {
|
|
155
|
+
root: string;
|
|
156
|
+
};
|
|
157
|
+
interactive: {
|
|
158
|
+
root: string;
|
|
159
|
+
};
|
|
160
|
+
};
|
|
161
|
+
padding: {
|
|
162
|
+
none: {
|
|
163
|
+
root: string;
|
|
164
|
+
};
|
|
165
|
+
sm: {
|
|
166
|
+
root: string;
|
|
167
|
+
};
|
|
168
|
+
md: {
|
|
169
|
+
root: string;
|
|
170
|
+
};
|
|
171
|
+
lg: {
|
|
172
|
+
root: string;
|
|
173
|
+
};
|
|
174
|
+
};
|
|
175
|
+
}, {
|
|
176
|
+
root: string[];
|
|
177
|
+
header: string;
|
|
178
|
+
title: string;
|
|
179
|
+
description: string;
|
|
180
|
+
body: string;
|
|
181
|
+
footer: string;
|
|
182
|
+
}, undefined, {
|
|
183
|
+
variant: {
|
|
184
|
+
outline: {
|
|
185
|
+
root: string;
|
|
186
|
+
};
|
|
187
|
+
elevated: {
|
|
188
|
+
root: string;
|
|
189
|
+
};
|
|
190
|
+
ghost: {
|
|
191
|
+
root: string;
|
|
192
|
+
};
|
|
193
|
+
interactive: {
|
|
194
|
+
root: string;
|
|
195
|
+
};
|
|
196
|
+
};
|
|
197
|
+
padding: {
|
|
198
|
+
none: {
|
|
199
|
+
root: string;
|
|
200
|
+
};
|
|
201
|
+
sm: {
|
|
202
|
+
root: string;
|
|
203
|
+
};
|
|
204
|
+
md: {
|
|
205
|
+
root: string;
|
|
206
|
+
};
|
|
207
|
+
lg: {
|
|
208
|
+
root: string;
|
|
209
|
+
};
|
|
210
|
+
};
|
|
211
|
+
}, {
|
|
212
|
+
root: string[];
|
|
213
|
+
header: string;
|
|
214
|
+
title: string;
|
|
215
|
+
description: string;
|
|
216
|
+
body: string;
|
|
217
|
+
footer: string;
|
|
218
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
219
|
+
variant: {
|
|
220
|
+
outline: {
|
|
221
|
+
root: string;
|
|
222
|
+
};
|
|
223
|
+
elevated: {
|
|
224
|
+
root: string;
|
|
225
|
+
};
|
|
226
|
+
ghost: {
|
|
227
|
+
root: string;
|
|
228
|
+
};
|
|
229
|
+
interactive: {
|
|
230
|
+
root: string;
|
|
231
|
+
};
|
|
232
|
+
};
|
|
233
|
+
padding: {
|
|
234
|
+
none: {
|
|
235
|
+
root: string;
|
|
236
|
+
};
|
|
237
|
+
sm: {
|
|
238
|
+
root: string;
|
|
239
|
+
};
|
|
240
|
+
md: {
|
|
241
|
+
root: string;
|
|
242
|
+
};
|
|
243
|
+
lg: {
|
|
244
|
+
root: string;
|
|
245
|
+
};
|
|
246
|
+
};
|
|
247
|
+
}, {
|
|
248
|
+
root: string[];
|
|
249
|
+
header: string;
|
|
250
|
+
title: string;
|
|
251
|
+
description: string;
|
|
252
|
+
body: string;
|
|
253
|
+
footer: string;
|
|
254
|
+
}>>;
|
|
255
|
+
type CardVariants = VariantProps<typeof cardStyles>;
|
|
256
|
+
//#endregion
|
|
257
|
+
//#region src/components/checkbox/checkbox.d.ts
|
|
258
|
+
export declare const checkboxStyles: import("tailwind-variants").TVReturnType<{
|
|
259
|
+
[key: string]: {
|
|
260
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
261
|
+
root?: import("tailwind-variants").ClassValue;
|
|
262
|
+
indicator?: import("tailwind-variants").ClassValue;
|
|
263
|
+
};
|
|
264
|
+
};
|
|
265
|
+
} | {
|
|
266
|
+
[x: string]: {
|
|
267
|
+
[x: string]: import("tailwind-variants").ClassValue | {
|
|
268
|
+
root?: import("tailwind-variants").ClassValue;
|
|
269
|
+
indicator?: import("tailwind-variants").ClassValue;
|
|
270
|
+
};
|
|
271
|
+
};
|
|
272
|
+
} | {}, {
|
|
273
|
+
root: string[];
|
|
274
|
+
indicator: string;
|
|
275
|
+
}, undefined, {
|
|
276
|
+
[key: string]: {
|
|
277
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
278
|
+
root?: import("tailwind-variants").ClassValue;
|
|
279
|
+
indicator?: import("tailwind-variants").ClassValue;
|
|
280
|
+
};
|
|
281
|
+
};
|
|
282
|
+
} | {}, {
|
|
283
|
+
root: string[];
|
|
284
|
+
indicator: string;
|
|
285
|
+
}, import("tailwind-variants").TVReturnTypeLike<unknown, {
|
|
286
|
+
root: string[];
|
|
287
|
+
indicator: string;
|
|
288
|
+
}>>;
|
|
289
|
+
export declare function Checkbox(inProps: ComponentProps<typeof Checkbox$1.Root>): import("react").JSX.Element;
|
|
290
|
+
//#endregion
|
|
291
|
+
//#region src/components/eyebrow/eyebrow.styles.d.ts
|
|
292
|
+
export declare const eyebrowStyles: import("tailwind-variants").TVReturnType<{
|
|
293
|
+
tone: {
|
|
294
|
+
muted: {
|
|
295
|
+
base: string;
|
|
296
|
+
};
|
|
297
|
+
primary: {
|
|
298
|
+
base: string;
|
|
299
|
+
};
|
|
300
|
+
};
|
|
301
|
+
}, {
|
|
302
|
+
base: string;
|
|
303
|
+
}, undefined, {
|
|
304
|
+
tone: {
|
|
305
|
+
muted: {
|
|
306
|
+
base: string;
|
|
307
|
+
};
|
|
308
|
+
primary: {
|
|
309
|
+
base: string;
|
|
310
|
+
};
|
|
311
|
+
};
|
|
312
|
+
}, {
|
|
313
|
+
base: string;
|
|
314
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
315
|
+
tone: {
|
|
316
|
+
muted: {
|
|
317
|
+
base: string;
|
|
318
|
+
};
|
|
319
|
+
primary: {
|
|
320
|
+
base: string;
|
|
321
|
+
};
|
|
322
|
+
};
|
|
323
|
+
}, {
|
|
324
|
+
base: string;
|
|
325
|
+
}>>;
|
|
326
|
+
type EyebrowVariants = VariantProps<typeof eyebrowStyles>;
|
|
327
|
+
//#endregion
|
|
328
|
+
//#region src/components/heading/heading.styles.d.ts
|
|
329
|
+
export declare const headingStyles: import("tailwind-variants").TVReturnType<{
|
|
330
|
+
size: {
|
|
331
|
+
display: {
|
|
332
|
+
base: string;
|
|
333
|
+
};
|
|
334
|
+
h1: {
|
|
335
|
+
base: string;
|
|
336
|
+
};
|
|
337
|
+
h2: {
|
|
338
|
+
base: string;
|
|
339
|
+
};
|
|
340
|
+
h3: {
|
|
341
|
+
base: string;
|
|
342
|
+
};
|
|
343
|
+
h4: {
|
|
344
|
+
base: string;
|
|
345
|
+
};
|
|
346
|
+
};
|
|
347
|
+
}, {
|
|
348
|
+
base: string;
|
|
349
|
+
}, undefined, {
|
|
350
|
+
size: {
|
|
351
|
+
display: {
|
|
352
|
+
base: string;
|
|
353
|
+
};
|
|
354
|
+
h1: {
|
|
355
|
+
base: string;
|
|
356
|
+
};
|
|
357
|
+
h2: {
|
|
358
|
+
base: string;
|
|
359
|
+
};
|
|
360
|
+
h3: {
|
|
361
|
+
base: string;
|
|
362
|
+
};
|
|
363
|
+
h4: {
|
|
364
|
+
base: string;
|
|
365
|
+
};
|
|
366
|
+
};
|
|
367
|
+
}, {
|
|
368
|
+
base: string;
|
|
369
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
370
|
+
size: {
|
|
371
|
+
display: {
|
|
372
|
+
base: string;
|
|
373
|
+
};
|
|
374
|
+
h1: {
|
|
375
|
+
base: string;
|
|
376
|
+
};
|
|
377
|
+
h2: {
|
|
378
|
+
base: string;
|
|
379
|
+
};
|
|
380
|
+
h3: {
|
|
381
|
+
base: string;
|
|
382
|
+
};
|
|
383
|
+
h4: {
|
|
384
|
+
base: string;
|
|
385
|
+
};
|
|
386
|
+
};
|
|
387
|
+
}, {
|
|
388
|
+
base: string;
|
|
389
|
+
}>>;
|
|
390
|
+
type HeadingVariants = VariantProps<typeof headingStyles>;
|
|
391
|
+
//#endregion
|
|
392
|
+
//#region src/components/input/input.styles.d.ts
|
|
393
|
+
/** Shared by Input, Textarea and the Select trigger so all fields look alike. */
|
|
394
|
+
export declare const fieldControl: string[];
|
|
395
|
+
export declare const inputStyles: import("tailwind-variants").TVReturnType<{
|
|
396
|
+
size: {
|
|
397
|
+
sm: {
|
|
398
|
+
root: string;
|
|
399
|
+
};
|
|
400
|
+
md: {
|
|
401
|
+
root: string;
|
|
402
|
+
};
|
|
403
|
+
lg: {
|
|
404
|
+
root: string;
|
|
405
|
+
};
|
|
406
|
+
};
|
|
407
|
+
}, {
|
|
408
|
+
root: string[];
|
|
409
|
+
input: string;
|
|
410
|
+
adornment: string;
|
|
411
|
+
}, undefined, {
|
|
412
|
+
size: {
|
|
413
|
+
sm: {
|
|
414
|
+
root: string;
|
|
415
|
+
};
|
|
416
|
+
md: {
|
|
417
|
+
root: string;
|
|
418
|
+
};
|
|
419
|
+
lg: {
|
|
420
|
+
root: string;
|
|
421
|
+
};
|
|
422
|
+
};
|
|
423
|
+
}, {
|
|
424
|
+
root: string[];
|
|
425
|
+
input: string;
|
|
426
|
+
adornment: string;
|
|
427
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
428
|
+
size: {
|
|
429
|
+
sm: {
|
|
430
|
+
root: string;
|
|
431
|
+
};
|
|
432
|
+
md: {
|
|
433
|
+
root: string;
|
|
434
|
+
};
|
|
435
|
+
lg: {
|
|
436
|
+
root: string;
|
|
437
|
+
};
|
|
438
|
+
};
|
|
439
|
+
}, {
|
|
440
|
+
root: string[];
|
|
441
|
+
input: string;
|
|
442
|
+
adornment: string;
|
|
443
|
+
}>>;
|
|
444
|
+
type InputVariants = VariantProps<typeof inputStyles>;
|
|
445
|
+
//#endregion
|
|
446
|
+
//#region src/components/kbd/kbd.d.ts
|
|
447
|
+
export declare const kbdStyles: import("tailwind-variants").TVReturnType<{
|
|
448
|
+
[key: string]: {
|
|
449
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
450
|
+
base?: import("tailwind-variants").ClassValue;
|
|
451
|
+
};
|
|
452
|
+
};
|
|
453
|
+
} | {
|
|
454
|
+
[x: string]: {
|
|
455
|
+
[x: string]: import("tailwind-variants").ClassValue | {
|
|
456
|
+
base?: import("tailwind-variants").ClassValue;
|
|
457
|
+
};
|
|
458
|
+
};
|
|
459
|
+
} | {}, {
|
|
460
|
+
base: string;
|
|
461
|
+
}, undefined, {
|
|
462
|
+
[key: string]: {
|
|
463
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
464
|
+
base?: import("tailwind-variants").ClassValue;
|
|
465
|
+
};
|
|
466
|
+
};
|
|
467
|
+
} | {}, {
|
|
468
|
+
base: string;
|
|
469
|
+
}, import("tailwind-variants").TVReturnTypeLike<unknown, {
|
|
470
|
+
base: string;
|
|
471
|
+
}>>;
|
|
472
|
+
/** A keyboard key, e.g. `<Kbd>⌘K</Kbd>`. */
|
|
473
|
+
export declare function Kbd(inProps: ComponentProps<'kbd'>): import("react").JSX.Element;
|
|
474
|
+
//#endregion
|
|
475
|
+
//#region src/components/label/label.d.ts
|
|
476
|
+
export declare const labelStyles: import("tailwind-variants").TVReturnType<{
|
|
477
|
+
[key: string]: {
|
|
478
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
479
|
+
base?: import("tailwind-variants").ClassValue;
|
|
480
|
+
};
|
|
481
|
+
};
|
|
482
|
+
} | {
|
|
483
|
+
[x: string]: {
|
|
484
|
+
[x: string]: import("tailwind-variants").ClassValue | {
|
|
485
|
+
base?: import("tailwind-variants").ClassValue;
|
|
486
|
+
};
|
|
487
|
+
};
|
|
488
|
+
} | {}, {
|
|
489
|
+
base: string;
|
|
490
|
+
}, undefined, {
|
|
491
|
+
[key: string]: {
|
|
492
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
493
|
+
base?: import("tailwind-variants").ClassValue;
|
|
494
|
+
};
|
|
495
|
+
};
|
|
496
|
+
} | {}, {
|
|
497
|
+
base: string;
|
|
498
|
+
}, import("tailwind-variants").TVReturnTypeLike<unknown, {
|
|
499
|
+
base: string;
|
|
500
|
+
}>>;
|
|
501
|
+
export declare function Label(inProps: ComponentProps<typeof Label$1.Root>): import("react").JSX.Element;
|
|
502
|
+
//#endregion
|
|
503
|
+
//#region src/components/segmented-control/segmented-control.d.ts
|
|
504
|
+
export declare const segmentedControlStyles: import("tailwind-variants").TVReturnType<{
|
|
505
|
+
size: {
|
|
506
|
+
sm: {
|
|
507
|
+
root: string;
|
|
508
|
+
item: string;
|
|
509
|
+
};
|
|
510
|
+
md: {
|
|
511
|
+
root: string;
|
|
512
|
+
item: string;
|
|
513
|
+
};
|
|
514
|
+
};
|
|
515
|
+
fullWidth: {
|
|
516
|
+
true: {
|
|
517
|
+
root: string;
|
|
518
|
+
item: string;
|
|
519
|
+
};
|
|
520
|
+
};
|
|
521
|
+
}, {
|
|
522
|
+
root: string[];
|
|
523
|
+
item: string[];
|
|
524
|
+
}, undefined, {
|
|
525
|
+
size: {
|
|
526
|
+
sm: {
|
|
527
|
+
root: string;
|
|
528
|
+
item: string;
|
|
529
|
+
};
|
|
530
|
+
md: {
|
|
531
|
+
root: string;
|
|
532
|
+
item: string;
|
|
533
|
+
};
|
|
534
|
+
};
|
|
535
|
+
fullWidth: {
|
|
536
|
+
true: {
|
|
537
|
+
root: string;
|
|
538
|
+
item: string;
|
|
539
|
+
};
|
|
540
|
+
};
|
|
541
|
+
}, {
|
|
542
|
+
root: string[];
|
|
543
|
+
item: string[];
|
|
544
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
545
|
+
size: {
|
|
546
|
+
sm: {
|
|
547
|
+
root: string;
|
|
548
|
+
item: string;
|
|
549
|
+
};
|
|
550
|
+
md: {
|
|
551
|
+
root: string;
|
|
552
|
+
item: string;
|
|
553
|
+
};
|
|
554
|
+
};
|
|
555
|
+
fullWidth: {
|
|
556
|
+
true: {
|
|
557
|
+
root: string;
|
|
558
|
+
item: string;
|
|
559
|
+
};
|
|
560
|
+
};
|
|
561
|
+
}, {
|
|
562
|
+
root: string[];
|
|
563
|
+
item: string[];
|
|
564
|
+
}>>;
|
|
565
|
+
interface SegmentedOption<T extends string> {
|
|
566
|
+
value: T;
|
|
567
|
+
label: ReactNode;
|
|
568
|
+
disabled?: boolean;
|
|
569
|
+
}
|
|
570
|
+
interface SegmentedControlProps<T extends string> extends VariantProps<typeof segmentedControlStyles> {
|
|
571
|
+
options: readonly SegmentedOption<T>[];
|
|
572
|
+
value?: T;
|
|
573
|
+
defaultValue?: T;
|
|
574
|
+
onValueChange?: (value: T) => void;
|
|
575
|
+
'aria-label': string;
|
|
576
|
+
className?: string;
|
|
577
|
+
id?: string;
|
|
578
|
+
}
|
|
579
|
+
/**
|
|
580
|
+
* Pick exactly one of a few options. `T` is inferred from `options`, so `onValueChange`
|
|
581
|
+
* receives your union type, not `string`.
|
|
582
|
+
*/
|
|
583
|
+
export declare function SegmentedControl<T extends string>(inProps: SegmentedControlProps<T>): import("react").JSX.Element;
|
|
584
|
+
//#endregion
|
|
585
|
+
//#region src/components/select/select.d.ts
|
|
586
|
+
export declare const selectStyles: import("tailwind-variants").TVReturnType<{
|
|
587
|
+
size: {
|
|
588
|
+
sm: {
|
|
589
|
+
trigger: string;
|
|
590
|
+
};
|
|
591
|
+
md: {
|
|
592
|
+
trigger: string;
|
|
593
|
+
};
|
|
594
|
+
lg: {
|
|
595
|
+
trigger: string;
|
|
596
|
+
};
|
|
597
|
+
};
|
|
598
|
+
}, {
|
|
599
|
+
trigger: string[];
|
|
600
|
+
icon: string;
|
|
601
|
+
content: string[];
|
|
602
|
+
viewport: string;
|
|
603
|
+
item: string[];
|
|
604
|
+
indicator: string;
|
|
605
|
+
}, undefined, {
|
|
606
|
+
size: {
|
|
607
|
+
sm: {
|
|
608
|
+
trigger: string;
|
|
609
|
+
};
|
|
610
|
+
md: {
|
|
611
|
+
trigger: string;
|
|
612
|
+
};
|
|
613
|
+
lg: {
|
|
614
|
+
trigger: string;
|
|
615
|
+
};
|
|
616
|
+
};
|
|
617
|
+
}, {
|
|
618
|
+
trigger: string[];
|
|
619
|
+
icon: string;
|
|
620
|
+
content: string[];
|
|
621
|
+
viewport: string;
|
|
622
|
+
item: string[];
|
|
623
|
+
indicator: string;
|
|
624
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
625
|
+
size: {
|
|
626
|
+
sm: {
|
|
627
|
+
trigger: string;
|
|
628
|
+
};
|
|
629
|
+
md: {
|
|
630
|
+
trigger: string;
|
|
631
|
+
};
|
|
632
|
+
lg: {
|
|
633
|
+
trigger: string;
|
|
634
|
+
};
|
|
635
|
+
};
|
|
636
|
+
}, {
|
|
637
|
+
trigger: string[];
|
|
638
|
+
icon: string;
|
|
639
|
+
content: string[];
|
|
640
|
+
viewport: string;
|
|
641
|
+
item: string[];
|
|
642
|
+
indicator: string;
|
|
643
|
+
}>>;
|
|
644
|
+
type RootProps<T extends string> = Omit<ComponentProps<typeof Select$1.Root>, 'value' | 'defaultValue' | 'onValueChange'> & {
|
|
645
|
+
value?: T;
|
|
646
|
+
defaultValue?: T;
|
|
647
|
+
onValueChange?: (value: T) => void;
|
|
648
|
+
};
|
|
649
|
+
interface SelectProps<T extends string = string> extends RootProps<T>, VariantProps<typeof selectStyles> {
|
|
650
|
+
placeholder?: ReactNode;
|
|
651
|
+
id?: string;
|
|
652
|
+
className?: string;
|
|
653
|
+
contentClassName?: string;
|
|
654
|
+
'aria-label'?: string;
|
|
655
|
+
'aria-describedby'?: string;
|
|
656
|
+
'aria-invalid'?: boolean;
|
|
657
|
+
}
|
|
658
|
+
/**
|
|
659
|
+
* A dropdown select. `value` is typed by the `T` you use:
|
|
660
|
+
* `<Select<Plan> value={plan} onValueChange={setPlan}>` only accepts `Plan` values.
|
|
661
|
+
*/
|
|
662
|
+
export declare function Select<T extends string = string>(inProps: SelectProps<T>): import("react").JSX.Element;
|
|
663
|
+
interface SelectItemProps extends ComponentProps<typeof Select$1.Item> {}
|
|
664
|
+
export declare function SelectItem({ className, children, ...props }: SelectItemProps): import("react").JSX.Element;
|
|
665
|
+
//#endregion
|
|
666
|
+
//#region src/components/separator/separator.d.ts
|
|
667
|
+
export declare const separatorStyles: import("tailwind-variants").TVReturnType<{
|
|
668
|
+
orientation: {
|
|
669
|
+
horizontal: {
|
|
670
|
+
base: string;
|
|
671
|
+
};
|
|
672
|
+
vertical: {
|
|
673
|
+
base: string;
|
|
674
|
+
};
|
|
675
|
+
};
|
|
676
|
+
}, {
|
|
677
|
+
base: string;
|
|
678
|
+
}, undefined, {
|
|
679
|
+
orientation: {
|
|
680
|
+
horizontal: {
|
|
681
|
+
base: string;
|
|
682
|
+
};
|
|
683
|
+
vertical: {
|
|
684
|
+
base: string;
|
|
685
|
+
};
|
|
686
|
+
};
|
|
687
|
+
}, {
|
|
688
|
+
base: string;
|
|
689
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
690
|
+
orientation: {
|
|
691
|
+
horizontal: {
|
|
692
|
+
base: string;
|
|
693
|
+
};
|
|
694
|
+
vertical: {
|
|
695
|
+
base: string;
|
|
696
|
+
};
|
|
697
|
+
};
|
|
698
|
+
}, {
|
|
699
|
+
base: string;
|
|
700
|
+
}>>;
|
|
701
|
+
export declare function Separator(inProps: ComponentProps<typeof Separator$1.Root>): import("react").JSX.Element;
|
|
702
|
+
//#endregion
|
|
703
|
+
//#region src/components/skeleton/skeleton.d.ts
|
|
704
|
+
export declare const skeletonStyles: import("tailwind-variants").TVReturnType<{
|
|
705
|
+
[key: string]: {
|
|
706
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
707
|
+
base?: import("tailwind-variants").ClassValue;
|
|
708
|
+
};
|
|
709
|
+
};
|
|
710
|
+
} | {
|
|
711
|
+
[x: string]: {
|
|
712
|
+
[x: string]: import("tailwind-variants").ClassValue | {
|
|
713
|
+
base?: import("tailwind-variants").ClassValue;
|
|
714
|
+
};
|
|
715
|
+
};
|
|
716
|
+
} | {}, {
|
|
717
|
+
base: string;
|
|
718
|
+
}, undefined, {
|
|
719
|
+
[key: string]: {
|
|
720
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
721
|
+
base?: import("tailwind-variants").ClassValue;
|
|
722
|
+
};
|
|
723
|
+
};
|
|
724
|
+
} | {}, {
|
|
725
|
+
base: string;
|
|
726
|
+
}, import("tailwind-variants").TVReturnTypeLike<unknown, {
|
|
727
|
+
base: string;
|
|
728
|
+
}>>;
|
|
729
|
+
/** Placeholder block shown while content loads. Size it with classes: `h-4 w-32`. */
|
|
730
|
+
export declare function Skeleton(inProps: ComponentProps<'div'>): import("react").JSX.Element;
|
|
731
|
+
//#endregion
|
|
732
|
+
//#region src/components/spinner/spinner.styles.d.ts
|
|
733
|
+
export declare const spinnerStyles: import("tailwind-variants").TVReturnType<{
|
|
734
|
+
size: {
|
|
735
|
+
sm: {
|
|
736
|
+
base: string;
|
|
737
|
+
};
|
|
738
|
+
md: {
|
|
739
|
+
base: string;
|
|
740
|
+
};
|
|
741
|
+
lg: {
|
|
742
|
+
base: string;
|
|
743
|
+
};
|
|
744
|
+
};
|
|
745
|
+
}, {
|
|
746
|
+
base: string;
|
|
747
|
+
track: string;
|
|
748
|
+
arc: string;
|
|
749
|
+
}, undefined, {
|
|
750
|
+
size: {
|
|
751
|
+
sm: {
|
|
752
|
+
base: string;
|
|
753
|
+
};
|
|
754
|
+
md: {
|
|
755
|
+
base: string;
|
|
756
|
+
};
|
|
757
|
+
lg: {
|
|
758
|
+
base: string;
|
|
759
|
+
};
|
|
760
|
+
};
|
|
761
|
+
}, {
|
|
762
|
+
base: string;
|
|
763
|
+
track: string;
|
|
764
|
+
arc: string;
|
|
765
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
766
|
+
size: {
|
|
767
|
+
sm: {
|
|
768
|
+
base: string;
|
|
769
|
+
};
|
|
770
|
+
md: {
|
|
771
|
+
base: string;
|
|
772
|
+
};
|
|
773
|
+
lg: {
|
|
774
|
+
base: string;
|
|
775
|
+
};
|
|
776
|
+
};
|
|
777
|
+
}, {
|
|
778
|
+
base: string;
|
|
779
|
+
track: string;
|
|
780
|
+
arc: string;
|
|
781
|
+
}>>;
|
|
782
|
+
type SpinnerVariants = VariantProps<typeof spinnerStyles>;
|
|
783
|
+
//#endregion
|
|
784
|
+
//#region src/components/switch/switch.d.ts
|
|
785
|
+
export declare const switchStyles: import("tailwind-variants").TVReturnType<{
|
|
786
|
+
size: {
|
|
787
|
+
sm: {
|
|
788
|
+
root: string;
|
|
789
|
+
thumb: string;
|
|
790
|
+
};
|
|
791
|
+
md: {
|
|
792
|
+
root: string;
|
|
793
|
+
thumb: string;
|
|
794
|
+
};
|
|
795
|
+
};
|
|
796
|
+
}, {
|
|
797
|
+
root: string[];
|
|
798
|
+
thumb: string;
|
|
799
|
+
}, undefined, {
|
|
800
|
+
size: {
|
|
801
|
+
sm: {
|
|
802
|
+
root: string;
|
|
803
|
+
thumb: string;
|
|
804
|
+
};
|
|
805
|
+
md: {
|
|
806
|
+
root: string;
|
|
807
|
+
thumb: string;
|
|
808
|
+
};
|
|
809
|
+
};
|
|
810
|
+
}, {
|
|
811
|
+
root: string[];
|
|
812
|
+
thumb: string;
|
|
813
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
814
|
+
size: {
|
|
815
|
+
sm: {
|
|
816
|
+
root: string;
|
|
817
|
+
thumb: string;
|
|
818
|
+
};
|
|
819
|
+
md: {
|
|
820
|
+
root: string;
|
|
821
|
+
thumb: string;
|
|
822
|
+
};
|
|
823
|
+
};
|
|
824
|
+
}, {
|
|
825
|
+
root: string[];
|
|
826
|
+
thumb: string;
|
|
827
|
+
}>>;
|
|
828
|
+
interface SwitchProps extends ComponentProps<typeof Switch$1.Root>, VariantProps<typeof switchStyles> {}
|
|
829
|
+
export declare function Switch(inProps: SwitchProps): import("react").JSX.Element;
|
|
830
|
+
//#endregion
|
|
831
|
+
//#region src/components/table/table.d.ts
|
|
832
|
+
export declare const tableStyles: import("tailwind-variants").TVReturnType<{
|
|
833
|
+
[key: string]: {
|
|
834
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
835
|
+
header?: import("tailwind-variants").ClassValue;
|
|
836
|
+
body?: import("tailwind-variants").ClassValue;
|
|
837
|
+
wrapper?: import("tailwind-variants").ClassValue;
|
|
838
|
+
table?: import("tailwind-variants").ClassValue;
|
|
839
|
+
row?: import("tailwind-variants").ClassValue;
|
|
840
|
+
head?: import("tailwind-variants").ClassValue;
|
|
841
|
+
cell?: import("tailwind-variants").ClassValue;
|
|
842
|
+
caption?: import("tailwind-variants").ClassValue;
|
|
843
|
+
};
|
|
844
|
+
};
|
|
845
|
+
} | {
|
|
846
|
+
[x: string]: {
|
|
847
|
+
[x: string]: import("tailwind-variants").ClassValue | {
|
|
848
|
+
header?: import("tailwind-variants").ClassValue;
|
|
849
|
+
body?: import("tailwind-variants").ClassValue;
|
|
850
|
+
wrapper?: import("tailwind-variants").ClassValue;
|
|
851
|
+
table?: import("tailwind-variants").ClassValue;
|
|
852
|
+
row?: import("tailwind-variants").ClassValue;
|
|
853
|
+
head?: import("tailwind-variants").ClassValue;
|
|
854
|
+
cell?: import("tailwind-variants").ClassValue;
|
|
855
|
+
caption?: import("tailwind-variants").ClassValue;
|
|
856
|
+
};
|
|
857
|
+
};
|
|
858
|
+
} | {}, {
|
|
859
|
+
wrapper: string;
|
|
860
|
+
table: string;
|
|
861
|
+
header: string;
|
|
862
|
+
body: string;
|
|
863
|
+
row: string;
|
|
864
|
+
head: string;
|
|
865
|
+
cell: string;
|
|
866
|
+
caption: string;
|
|
867
|
+
}, undefined, {
|
|
868
|
+
[key: string]: {
|
|
869
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
870
|
+
header?: import("tailwind-variants").ClassValue;
|
|
871
|
+
body?: import("tailwind-variants").ClassValue;
|
|
872
|
+
wrapper?: import("tailwind-variants").ClassValue;
|
|
873
|
+
table?: import("tailwind-variants").ClassValue;
|
|
874
|
+
row?: import("tailwind-variants").ClassValue;
|
|
875
|
+
head?: import("tailwind-variants").ClassValue;
|
|
876
|
+
cell?: import("tailwind-variants").ClassValue;
|
|
877
|
+
caption?: import("tailwind-variants").ClassValue;
|
|
878
|
+
};
|
|
879
|
+
};
|
|
880
|
+
} | {}, {
|
|
881
|
+
wrapper: string;
|
|
882
|
+
table: string;
|
|
883
|
+
header: string;
|
|
884
|
+
body: string;
|
|
885
|
+
row: string;
|
|
886
|
+
head: string;
|
|
887
|
+
cell: string;
|
|
888
|
+
caption: string;
|
|
889
|
+
}, import("tailwind-variants").TVReturnTypeLike<unknown, {
|
|
890
|
+
wrapper: string;
|
|
891
|
+
table: string;
|
|
892
|
+
header: string;
|
|
893
|
+
body: string;
|
|
894
|
+
row: string;
|
|
895
|
+
head: string;
|
|
896
|
+
cell: string;
|
|
897
|
+
caption: string;
|
|
898
|
+
}>>;
|
|
899
|
+
/** Semantic table primitives styled by the theme. For sorting and pagination use DataTable. */
|
|
900
|
+
export declare function Table({ className, ...props }: ComponentProps<'table'>): import("react").JSX.Element;
|
|
901
|
+
export declare function TableHeader({ className, ...props }: ComponentProps<'thead'>): import("react").JSX.Element;
|
|
902
|
+
export declare function TableBody({ className, ...props }: ComponentProps<'tbody'>): import("react").JSX.Element;
|
|
903
|
+
export declare function TableRow({ className, ...props }: ComponentProps<'tr'>): import("react").JSX.Element;
|
|
904
|
+
export declare function TableHead({ className, ...props }: ComponentProps<'th'>): import("react").JSX.Element;
|
|
905
|
+
export declare function TableCell({ className, ...props }: ComponentProps<'td'>): import("react").JSX.Element;
|
|
906
|
+
export declare function TableCaption({ className, ...props }: ComponentProps<'caption'>): import("react").JSX.Element;
|
|
907
|
+
//#endregion
|
|
908
|
+
//#region src/components/tabs/tabs.d.ts
|
|
909
|
+
export declare const tabsStyles: import("tailwind-variants").TVReturnType<{
|
|
910
|
+
variant: {
|
|
911
|
+
underline: {
|
|
912
|
+
list: string;
|
|
913
|
+
trigger: string;
|
|
914
|
+
};
|
|
915
|
+
pill: {
|
|
916
|
+
list: string[];
|
|
917
|
+
trigger: string;
|
|
918
|
+
};
|
|
919
|
+
};
|
|
920
|
+
}, {
|
|
921
|
+
root: string;
|
|
922
|
+
list: string;
|
|
923
|
+
trigger: string[];
|
|
924
|
+
content: string;
|
|
925
|
+
}, undefined, {
|
|
926
|
+
variant: {
|
|
927
|
+
underline: {
|
|
928
|
+
list: string;
|
|
929
|
+
trigger: string;
|
|
930
|
+
};
|
|
931
|
+
pill: {
|
|
932
|
+
list: string[];
|
|
933
|
+
trigger: string;
|
|
934
|
+
};
|
|
935
|
+
};
|
|
936
|
+
}, {
|
|
937
|
+
root: string;
|
|
938
|
+
list: string;
|
|
939
|
+
trigger: string[];
|
|
940
|
+
content: string;
|
|
941
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
942
|
+
variant: {
|
|
943
|
+
underline: {
|
|
944
|
+
list: string;
|
|
945
|
+
trigger: string;
|
|
946
|
+
};
|
|
947
|
+
pill: {
|
|
948
|
+
list: string[];
|
|
949
|
+
trigger: string;
|
|
950
|
+
};
|
|
951
|
+
};
|
|
952
|
+
}, {
|
|
953
|
+
root: string;
|
|
954
|
+
list: string;
|
|
955
|
+
trigger: string[];
|
|
956
|
+
content: string;
|
|
957
|
+
}>>;
|
|
958
|
+
type TabsVariants = VariantProps<typeof tabsStyles>;
|
|
959
|
+
interface TabsProps extends ComponentProps<typeof Tabs$1.Root>, TabsVariants {}
|
|
960
|
+
export declare function Tabs(inProps: TabsProps): import("react").JSX.Element;
|
|
961
|
+
export declare function TabsList({ className, ...props }: ComponentProps<typeof Tabs$1.List>): import("react").JSX.Element;
|
|
962
|
+
export declare function TabsTrigger({ className, ...props }: ComponentProps<typeof Tabs$1.Trigger>): import("react").JSX.Element;
|
|
963
|
+
export declare function TabsContent({ className, ...props }: ComponentProps<typeof Tabs$1.Content>): import("react").JSX.Element;
|
|
964
|
+
//#endregion
|
|
965
|
+
//#region src/components/text/text.styles.d.ts
|
|
966
|
+
export declare const textStyles: import("tailwind-variants").TVReturnType<{
|
|
967
|
+
size: {
|
|
968
|
+
lead: {
|
|
969
|
+
base: string;
|
|
970
|
+
};
|
|
971
|
+
body: {
|
|
972
|
+
base: string;
|
|
973
|
+
};
|
|
974
|
+
small: {
|
|
975
|
+
base: string;
|
|
976
|
+
};
|
|
977
|
+
caption: {
|
|
978
|
+
base: string;
|
|
979
|
+
};
|
|
980
|
+
};
|
|
981
|
+
tone: {
|
|
982
|
+
default: {
|
|
983
|
+
base: string;
|
|
984
|
+
};
|
|
985
|
+
muted: {
|
|
986
|
+
base: string;
|
|
987
|
+
};
|
|
988
|
+
faint: {
|
|
989
|
+
base: string;
|
|
990
|
+
};
|
|
991
|
+
primary: {
|
|
992
|
+
base: string;
|
|
993
|
+
};
|
|
994
|
+
success: {
|
|
995
|
+
base: string;
|
|
996
|
+
};
|
|
997
|
+
warning: {
|
|
998
|
+
base: string;
|
|
999
|
+
};
|
|
1000
|
+
danger: {
|
|
1001
|
+
base: string;
|
|
1002
|
+
};
|
|
1003
|
+
};
|
|
1004
|
+
weight: {
|
|
1005
|
+
regular: {
|
|
1006
|
+
base: string;
|
|
1007
|
+
};
|
|
1008
|
+
medium: {
|
|
1009
|
+
base: string;
|
|
1010
|
+
};
|
|
1011
|
+
semibold: {
|
|
1012
|
+
base: string;
|
|
1013
|
+
};
|
|
1014
|
+
};
|
|
1015
|
+
mono: {
|
|
1016
|
+
true: {
|
|
1017
|
+
base: string;
|
|
1018
|
+
};
|
|
1019
|
+
};
|
|
1020
|
+
truncate: {
|
|
1021
|
+
true: {
|
|
1022
|
+
base: string;
|
|
1023
|
+
};
|
|
1024
|
+
};
|
|
1025
|
+
}, {
|
|
1026
|
+
base: string;
|
|
1027
|
+
}, undefined, {
|
|
1028
|
+
size: {
|
|
1029
|
+
lead: {
|
|
1030
|
+
base: string;
|
|
1031
|
+
};
|
|
1032
|
+
body: {
|
|
1033
|
+
base: string;
|
|
1034
|
+
};
|
|
1035
|
+
small: {
|
|
1036
|
+
base: string;
|
|
1037
|
+
};
|
|
1038
|
+
caption: {
|
|
1039
|
+
base: string;
|
|
1040
|
+
};
|
|
1041
|
+
};
|
|
1042
|
+
tone: {
|
|
1043
|
+
default: {
|
|
1044
|
+
base: string;
|
|
1045
|
+
};
|
|
1046
|
+
muted: {
|
|
1047
|
+
base: string;
|
|
1048
|
+
};
|
|
1049
|
+
faint: {
|
|
1050
|
+
base: string;
|
|
1051
|
+
};
|
|
1052
|
+
primary: {
|
|
1053
|
+
base: string;
|
|
1054
|
+
};
|
|
1055
|
+
success: {
|
|
1056
|
+
base: string;
|
|
1057
|
+
};
|
|
1058
|
+
warning: {
|
|
1059
|
+
base: string;
|
|
1060
|
+
};
|
|
1061
|
+
danger: {
|
|
1062
|
+
base: string;
|
|
1063
|
+
};
|
|
1064
|
+
};
|
|
1065
|
+
weight: {
|
|
1066
|
+
regular: {
|
|
1067
|
+
base: string;
|
|
1068
|
+
};
|
|
1069
|
+
medium: {
|
|
1070
|
+
base: string;
|
|
1071
|
+
};
|
|
1072
|
+
semibold: {
|
|
1073
|
+
base: string;
|
|
1074
|
+
};
|
|
1075
|
+
};
|
|
1076
|
+
mono: {
|
|
1077
|
+
true: {
|
|
1078
|
+
base: string;
|
|
1079
|
+
};
|
|
1080
|
+
};
|
|
1081
|
+
truncate: {
|
|
1082
|
+
true: {
|
|
1083
|
+
base: string;
|
|
1084
|
+
};
|
|
1085
|
+
};
|
|
1086
|
+
}, {
|
|
1087
|
+
base: string;
|
|
1088
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
1089
|
+
size: {
|
|
1090
|
+
lead: {
|
|
1091
|
+
base: string;
|
|
1092
|
+
};
|
|
1093
|
+
body: {
|
|
1094
|
+
base: string;
|
|
1095
|
+
};
|
|
1096
|
+
small: {
|
|
1097
|
+
base: string;
|
|
1098
|
+
};
|
|
1099
|
+
caption: {
|
|
1100
|
+
base: string;
|
|
1101
|
+
};
|
|
1102
|
+
};
|
|
1103
|
+
tone: {
|
|
1104
|
+
default: {
|
|
1105
|
+
base: string;
|
|
1106
|
+
};
|
|
1107
|
+
muted: {
|
|
1108
|
+
base: string;
|
|
1109
|
+
};
|
|
1110
|
+
faint: {
|
|
1111
|
+
base: string;
|
|
1112
|
+
};
|
|
1113
|
+
primary: {
|
|
1114
|
+
base: string;
|
|
1115
|
+
};
|
|
1116
|
+
success: {
|
|
1117
|
+
base: string;
|
|
1118
|
+
};
|
|
1119
|
+
warning: {
|
|
1120
|
+
base: string;
|
|
1121
|
+
};
|
|
1122
|
+
danger: {
|
|
1123
|
+
base: string;
|
|
1124
|
+
};
|
|
1125
|
+
};
|
|
1126
|
+
weight: {
|
|
1127
|
+
regular: {
|
|
1128
|
+
base: string;
|
|
1129
|
+
};
|
|
1130
|
+
medium: {
|
|
1131
|
+
base: string;
|
|
1132
|
+
};
|
|
1133
|
+
semibold: {
|
|
1134
|
+
base: string;
|
|
1135
|
+
};
|
|
1136
|
+
};
|
|
1137
|
+
mono: {
|
|
1138
|
+
true: {
|
|
1139
|
+
base: string;
|
|
1140
|
+
};
|
|
1141
|
+
};
|
|
1142
|
+
truncate: {
|
|
1143
|
+
true: {
|
|
1144
|
+
base: string;
|
|
1145
|
+
};
|
|
1146
|
+
};
|
|
1147
|
+
}, {
|
|
1148
|
+
base: string;
|
|
1149
|
+
}>>;
|
|
1150
|
+
type TextVariants = VariantProps<typeof textStyles>;
|
|
1151
|
+
//#endregion
|
|
1152
|
+
//#region src/components/textarea/textarea.d.ts
|
|
1153
|
+
export declare const textareaStyles: import("tailwind-variants").TVReturnType<{
|
|
1154
|
+
[key: string]: {
|
|
1155
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
1156
|
+
base?: import("tailwind-variants").ClassValue;
|
|
1157
|
+
};
|
|
1158
|
+
};
|
|
1159
|
+
} | {
|
|
1160
|
+
[x: string]: {
|
|
1161
|
+
[x: string]: import("tailwind-variants").ClassValue | {
|
|
1162
|
+
base?: import("tailwind-variants").ClassValue;
|
|
1163
|
+
};
|
|
1164
|
+
};
|
|
1165
|
+
} | {}, {
|
|
1166
|
+
base: string[];
|
|
1167
|
+
}, undefined, {
|
|
1168
|
+
[key: string]: {
|
|
1169
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
1170
|
+
base?: import("tailwind-variants").ClassValue;
|
|
1171
|
+
};
|
|
1172
|
+
};
|
|
1173
|
+
} | {}, {
|
|
1174
|
+
base: string[];
|
|
1175
|
+
}, import("tailwind-variants").TVReturnTypeLike<unknown, {
|
|
1176
|
+
base: string[];
|
|
1177
|
+
}>>;
|
|
1178
|
+
export declare function Textarea(inProps: ComponentProps<'textarea'>): import("react").JSX.Element;
|
|
1179
|
+
//#endregion
|
|
1180
|
+
//#region src/components/tooltip/tooltip.d.ts
|
|
1181
|
+
export declare const tooltipStyles: import("tailwind-variants").TVReturnType<{
|
|
1182
|
+
[key: string]: {
|
|
1183
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
1184
|
+
content?: import("tailwind-variants").ClassValue;
|
|
1185
|
+
};
|
|
1186
|
+
};
|
|
1187
|
+
} | {
|
|
1188
|
+
[x: string]: {
|
|
1189
|
+
[x: string]: import("tailwind-variants").ClassValue | {
|
|
1190
|
+
content?: import("tailwind-variants").ClassValue;
|
|
1191
|
+
};
|
|
1192
|
+
};
|
|
1193
|
+
} | {}, {
|
|
1194
|
+
content: string;
|
|
1195
|
+
}, undefined, {
|
|
1196
|
+
[key: string]: {
|
|
1197
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
1198
|
+
content?: import("tailwind-variants").ClassValue;
|
|
1199
|
+
};
|
|
1200
|
+
};
|
|
1201
|
+
} | {}, {
|
|
1202
|
+
content: string;
|
|
1203
|
+
}, import("tailwind-variants").TVReturnTypeLike<unknown, {
|
|
1204
|
+
content: string;
|
|
1205
|
+
}>>;
|
|
1206
|
+
interface TooltipProps extends Omit<ComponentProps<typeof Tooltip$1.Content>, 'content'> {
|
|
1207
|
+
content: ReactNode;
|
|
1208
|
+
children: ReactNode;
|
|
1209
|
+
/** Skip the tooltip entirely, e.g. when the label is already visible. */
|
|
1210
|
+
disabled?: boolean;
|
|
1211
|
+
delayDuration?: number;
|
|
1212
|
+
}
|
|
1213
|
+
/** A short hint on hover or focus. The child must be focusable (a button or link). */
|
|
1214
|
+
export declare function Tooltip(inProps: TooltipProps): string | number | bigint | boolean | import("react").JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
|
|
1215
|
+
//#endregion
|
|
1216
|
+
//#region src/patterns/app-shell/app-shell.styles.d.ts
|
|
1217
|
+
export declare const appShellStyles: import("tailwind-variants").TVReturnType<{
|
|
1218
|
+
layout: {
|
|
1219
|
+
page: {
|
|
1220
|
+
root: string;
|
|
1221
|
+
sidebar: string;
|
|
1222
|
+
mobileBar: string;
|
|
1223
|
+
};
|
|
1224
|
+
embedded: {
|
|
1225
|
+
root: string;
|
|
1226
|
+
sidebar: string;
|
|
1227
|
+
main: string;
|
|
1228
|
+
};
|
|
1229
|
+
};
|
|
1230
|
+
}, {
|
|
1231
|
+
root: string;
|
|
1232
|
+
sidebar: string;
|
|
1233
|
+
main: string;
|
|
1234
|
+
mobileBar: string[];
|
|
1235
|
+
overlay: string;
|
|
1236
|
+
drawer: string;
|
|
1237
|
+
}, undefined, {
|
|
1238
|
+
layout: {
|
|
1239
|
+
page: {
|
|
1240
|
+
root: string;
|
|
1241
|
+
sidebar: string;
|
|
1242
|
+
mobileBar: string;
|
|
1243
|
+
};
|
|
1244
|
+
embedded: {
|
|
1245
|
+
root: string;
|
|
1246
|
+
sidebar: string;
|
|
1247
|
+
main: string;
|
|
1248
|
+
};
|
|
1249
|
+
};
|
|
1250
|
+
}, {
|
|
1251
|
+
root: string;
|
|
1252
|
+
sidebar: string;
|
|
1253
|
+
main: string;
|
|
1254
|
+
mobileBar: string[];
|
|
1255
|
+
overlay: string;
|
|
1256
|
+
drawer: string;
|
|
1257
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
1258
|
+
layout: {
|
|
1259
|
+
page: {
|
|
1260
|
+
root: string;
|
|
1261
|
+
sidebar: string;
|
|
1262
|
+
mobileBar: string;
|
|
1263
|
+
};
|
|
1264
|
+
embedded: {
|
|
1265
|
+
root: string;
|
|
1266
|
+
sidebar: string;
|
|
1267
|
+
main: string;
|
|
1268
|
+
};
|
|
1269
|
+
};
|
|
1270
|
+
}, {
|
|
1271
|
+
root: string;
|
|
1272
|
+
sidebar: string;
|
|
1273
|
+
main: string;
|
|
1274
|
+
mobileBar: string[];
|
|
1275
|
+
overlay: string;
|
|
1276
|
+
drawer: string;
|
|
1277
|
+
}>>;
|
|
1278
|
+
type AppShellVariants = VariantProps<typeof appShellStyles>;
|
|
1279
|
+
export declare const sidebarStyles: import("tailwind-variants").TVReturnType<{
|
|
1280
|
+
[key: string]: {
|
|
1281
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
1282
|
+
root?: import("tailwind-variants").ClassValue;
|
|
1283
|
+
footer?: import("tailwind-variants").ClassValue;
|
|
1284
|
+
header?: import("tailwind-variants").ClassValue;
|
|
1285
|
+
item?: import("tailwind-variants").ClassValue;
|
|
1286
|
+
content?: import("tailwind-variants").ClassValue;
|
|
1287
|
+
section?: import("tailwind-variants").ClassValue;
|
|
1288
|
+
sectionLabel?: import("tailwind-variants").ClassValue;
|
|
1289
|
+
itemIcon?: import("tailwind-variants").ClassValue;
|
|
1290
|
+
itemLabel?: import("tailwind-variants").ClassValue;
|
|
1291
|
+
itemBadge?: import("tailwind-variants").ClassValue;
|
|
1292
|
+
};
|
|
1293
|
+
};
|
|
1294
|
+
} | {
|
|
1295
|
+
[x: string]: {
|
|
1296
|
+
[x: string]: import("tailwind-variants").ClassValue | {
|
|
1297
|
+
root?: import("tailwind-variants").ClassValue;
|
|
1298
|
+
footer?: import("tailwind-variants").ClassValue;
|
|
1299
|
+
header?: import("tailwind-variants").ClassValue;
|
|
1300
|
+
item?: import("tailwind-variants").ClassValue;
|
|
1301
|
+
content?: import("tailwind-variants").ClassValue;
|
|
1302
|
+
section?: import("tailwind-variants").ClassValue;
|
|
1303
|
+
sectionLabel?: import("tailwind-variants").ClassValue;
|
|
1304
|
+
itemIcon?: import("tailwind-variants").ClassValue;
|
|
1305
|
+
itemLabel?: import("tailwind-variants").ClassValue;
|
|
1306
|
+
itemBadge?: import("tailwind-variants").ClassValue;
|
|
1307
|
+
};
|
|
1308
|
+
};
|
|
1309
|
+
} | {}, {
|
|
1310
|
+
root: string[];
|
|
1311
|
+
header: string;
|
|
1312
|
+
content: string;
|
|
1313
|
+
section: string;
|
|
1314
|
+
sectionLabel: string;
|
|
1315
|
+
item: string[];
|
|
1316
|
+
itemIcon: string;
|
|
1317
|
+
itemLabel: string;
|
|
1318
|
+
itemBadge: string;
|
|
1319
|
+
footer: string[];
|
|
1320
|
+
}, undefined, {
|
|
1321
|
+
[key: string]: {
|
|
1322
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
1323
|
+
root?: import("tailwind-variants").ClassValue;
|
|
1324
|
+
footer?: import("tailwind-variants").ClassValue;
|
|
1325
|
+
header?: import("tailwind-variants").ClassValue;
|
|
1326
|
+
item?: import("tailwind-variants").ClassValue;
|
|
1327
|
+
content?: import("tailwind-variants").ClassValue;
|
|
1328
|
+
section?: import("tailwind-variants").ClassValue;
|
|
1329
|
+
sectionLabel?: import("tailwind-variants").ClassValue;
|
|
1330
|
+
itemIcon?: import("tailwind-variants").ClassValue;
|
|
1331
|
+
itemLabel?: import("tailwind-variants").ClassValue;
|
|
1332
|
+
itemBadge?: import("tailwind-variants").ClassValue;
|
|
1333
|
+
};
|
|
1334
|
+
};
|
|
1335
|
+
} | {}, {
|
|
1336
|
+
root: string[];
|
|
1337
|
+
header: string;
|
|
1338
|
+
content: string;
|
|
1339
|
+
section: string;
|
|
1340
|
+
sectionLabel: string;
|
|
1341
|
+
item: string[];
|
|
1342
|
+
itemIcon: string;
|
|
1343
|
+
itemLabel: string;
|
|
1344
|
+
itemBadge: string;
|
|
1345
|
+
footer: string[];
|
|
1346
|
+
}, import("tailwind-variants").TVReturnTypeLike<unknown, {
|
|
1347
|
+
root: string[];
|
|
1348
|
+
header: string;
|
|
1349
|
+
content: string;
|
|
1350
|
+
section: string;
|
|
1351
|
+
sectionLabel: string;
|
|
1352
|
+
item: string[];
|
|
1353
|
+
itemIcon: string;
|
|
1354
|
+
itemLabel: string;
|
|
1355
|
+
itemBadge: string;
|
|
1356
|
+
footer: string[];
|
|
1357
|
+
}>>;
|
|
1358
|
+
export declare const navbarStyles: import("tailwind-variants").TVReturnType<{
|
|
1359
|
+
sticky: {
|
|
1360
|
+
true: {
|
|
1361
|
+
root: string;
|
|
1362
|
+
};
|
|
1363
|
+
false: {
|
|
1364
|
+
root: string;
|
|
1365
|
+
};
|
|
1366
|
+
};
|
|
1367
|
+
blur: {
|
|
1368
|
+
true: {
|
|
1369
|
+
root: string;
|
|
1370
|
+
};
|
|
1371
|
+
false: {
|
|
1372
|
+
root: string;
|
|
1373
|
+
};
|
|
1374
|
+
};
|
|
1375
|
+
}, {
|
|
1376
|
+
root: string[];
|
|
1377
|
+
inner: string;
|
|
1378
|
+
brand: string;
|
|
1379
|
+
links: string;
|
|
1380
|
+
link: string[];
|
|
1381
|
+
actions: string;
|
|
1382
|
+
menuButton: string;
|
|
1383
|
+
overlay: string;
|
|
1384
|
+
panel: string[];
|
|
1385
|
+
panelHeader: string;
|
|
1386
|
+
panelLinks: string;
|
|
1387
|
+
panelLink: string[];
|
|
1388
|
+
panelActions: string[];
|
|
1389
|
+
}, undefined, {
|
|
1390
|
+
sticky: {
|
|
1391
|
+
true: {
|
|
1392
|
+
root: string;
|
|
1393
|
+
};
|
|
1394
|
+
false: {
|
|
1395
|
+
root: string;
|
|
1396
|
+
};
|
|
1397
|
+
};
|
|
1398
|
+
blur: {
|
|
1399
|
+
true: {
|
|
1400
|
+
root: string;
|
|
1401
|
+
};
|
|
1402
|
+
false: {
|
|
1403
|
+
root: string;
|
|
1404
|
+
};
|
|
1405
|
+
};
|
|
1406
|
+
}, {
|
|
1407
|
+
root: string[];
|
|
1408
|
+
inner: string;
|
|
1409
|
+
brand: string;
|
|
1410
|
+
links: string;
|
|
1411
|
+
link: string[];
|
|
1412
|
+
actions: string;
|
|
1413
|
+
menuButton: string;
|
|
1414
|
+
overlay: string;
|
|
1415
|
+
panel: string[];
|
|
1416
|
+
panelHeader: string;
|
|
1417
|
+
panelLinks: string;
|
|
1418
|
+
panelLink: string[];
|
|
1419
|
+
panelActions: string[];
|
|
1420
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
1421
|
+
sticky: {
|
|
1422
|
+
true: {
|
|
1423
|
+
root: string;
|
|
1424
|
+
};
|
|
1425
|
+
false: {
|
|
1426
|
+
root: string;
|
|
1427
|
+
};
|
|
1428
|
+
};
|
|
1429
|
+
blur: {
|
|
1430
|
+
true: {
|
|
1431
|
+
root: string;
|
|
1432
|
+
};
|
|
1433
|
+
false: {
|
|
1434
|
+
root: string;
|
|
1435
|
+
};
|
|
1436
|
+
};
|
|
1437
|
+
}, {
|
|
1438
|
+
root: string[];
|
|
1439
|
+
inner: string;
|
|
1440
|
+
brand: string;
|
|
1441
|
+
links: string;
|
|
1442
|
+
link: string[];
|
|
1443
|
+
actions: string;
|
|
1444
|
+
menuButton: string;
|
|
1445
|
+
overlay: string;
|
|
1446
|
+
panel: string[];
|
|
1447
|
+
panelHeader: string;
|
|
1448
|
+
panelLinks: string;
|
|
1449
|
+
panelLink: string[];
|
|
1450
|
+
panelActions: string[];
|
|
1451
|
+
}>>;
|
|
1452
|
+
export declare const pageHeaderStyles: import("tailwind-variants").TVReturnType<{
|
|
1453
|
+
[key: string]: {
|
|
1454
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
1455
|
+
root?: import("tailwind-variants").ClassValue;
|
|
1456
|
+
actions?: import("tailwind-variants").ClassValue;
|
|
1457
|
+
text?: import("tailwind-variants").ClassValue;
|
|
1458
|
+
description?: import("tailwind-variants").ClassValue;
|
|
1459
|
+
title?: import("tailwind-variants").ClassValue;
|
|
1460
|
+
eyebrow?: import("tailwind-variants").ClassValue;
|
|
1461
|
+
};
|
|
1462
|
+
};
|
|
1463
|
+
} | {
|
|
1464
|
+
[x: string]: {
|
|
1465
|
+
[x: string]: import("tailwind-variants").ClassValue | {
|
|
1466
|
+
root?: import("tailwind-variants").ClassValue;
|
|
1467
|
+
actions?: import("tailwind-variants").ClassValue;
|
|
1468
|
+
text?: import("tailwind-variants").ClassValue;
|
|
1469
|
+
description?: import("tailwind-variants").ClassValue;
|
|
1470
|
+
title?: import("tailwind-variants").ClassValue;
|
|
1471
|
+
eyebrow?: import("tailwind-variants").ClassValue;
|
|
1472
|
+
};
|
|
1473
|
+
};
|
|
1474
|
+
} | {}, {
|
|
1475
|
+
root: string[];
|
|
1476
|
+
text: string;
|
|
1477
|
+
eyebrow: string;
|
|
1478
|
+
title: string;
|
|
1479
|
+
description: string;
|
|
1480
|
+
actions: string;
|
|
1481
|
+
}, undefined, {
|
|
1482
|
+
[key: string]: {
|
|
1483
|
+
[key: string]: import("tailwind-variants").ClassValue | {
|
|
1484
|
+
root?: import("tailwind-variants").ClassValue;
|
|
1485
|
+
actions?: import("tailwind-variants").ClassValue;
|
|
1486
|
+
text?: import("tailwind-variants").ClassValue;
|
|
1487
|
+
description?: import("tailwind-variants").ClassValue;
|
|
1488
|
+
title?: import("tailwind-variants").ClassValue;
|
|
1489
|
+
eyebrow?: import("tailwind-variants").ClassValue;
|
|
1490
|
+
};
|
|
1491
|
+
};
|
|
1492
|
+
} | {}, {
|
|
1493
|
+
root: string[];
|
|
1494
|
+
text: string;
|
|
1495
|
+
eyebrow: string;
|
|
1496
|
+
title: string;
|
|
1497
|
+
description: string;
|
|
1498
|
+
actions: string;
|
|
1499
|
+
}, import("tailwind-variants").TVReturnTypeLike<unknown, {
|
|
1500
|
+
root: string[];
|
|
1501
|
+
text: string;
|
|
1502
|
+
eyebrow: string;
|
|
1503
|
+
title: string;
|
|
1504
|
+
description: string;
|
|
1505
|
+
actions: string;
|
|
1506
|
+
}>>;
|
|
1507
|
+
//#endregion
|
|
1508
|
+
//#region src/patterns/async/states.d.ts
|
|
1509
|
+
export declare const stateStyles: import("tailwind-variants").TVReturnType<{
|
|
1510
|
+
tone: {
|
|
1511
|
+
neutral: {};
|
|
1512
|
+
danger: {
|
|
1513
|
+
icon: string;
|
|
1514
|
+
};
|
|
1515
|
+
};
|
|
1516
|
+
}, {
|
|
1517
|
+
root: string;
|
|
1518
|
+
icon: string;
|
|
1519
|
+
text: string;
|
|
1520
|
+
title: string;
|
|
1521
|
+
description: string;
|
|
1522
|
+
action: string;
|
|
1523
|
+
}, undefined, {
|
|
1524
|
+
tone: {
|
|
1525
|
+
neutral: {};
|
|
1526
|
+
danger: {
|
|
1527
|
+
icon: string;
|
|
1528
|
+
};
|
|
1529
|
+
};
|
|
1530
|
+
}, {
|
|
1531
|
+
root: string;
|
|
1532
|
+
icon: string;
|
|
1533
|
+
text: string;
|
|
1534
|
+
title: string;
|
|
1535
|
+
description: string;
|
|
1536
|
+
action: string;
|
|
1537
|
+
}, import("tailwind-variants").TVReturnTypeLike<{
|
|
1538
|
+
tone: {
|
|
1539
|
+
neutral: {};
|
|
1540
|
+
danger: {
|
|
1541
|
+
icon: string;
|
|
1542
|
+
};
|
|
1543
|
+
};
|
|
1544
|
+
}, {
|
|
1545
|
+
root: string;
|
|
1546
|
+
icon: string;
|
|
1547
|
+
text: string;
|
|
1548
|
+
title: string;
|
|
1549
|
+
description: string;
|
|
1550
|
+
action: string;
|
|
1551
|
+
}>>;
|
|
1552
|
+
interface StateProps extends Omit<ComponentProps<'div'>, 'title'> {
|
|
1553
|
+
icon?: ReactNode;
|
|
1554
|
+
title: ReactNode;
|
|
1555
|
+
description?: ReactNode;
|
|
1556
|
+
action?: ReactNode;
|
|
1557
|
+
}
|
|
1558
|
+
/** Shown when a list or page has no content yet. Say what will appear and how to add it. */
|
|
1559
|
+
export declare function EmptyState(inProps: StateProps): import("react").JSX.Element;
|
|
1560
|
+
interface ErrorStateProps extends Omit<StateProps, 'title'> {
|
|
1561
|
+
title?: ReactNode;
|
|
1562
|
+
/** The caught error. Its message is shown when no `description` is given. */
|
|
1563
|
+
error?: unknown;
|
|
1564
|
+
/** Shows a "Try again" button. */
|
|
1565
|
+
onRetry?: (() => unknown) | undefined;
|
|
1566
|
+
}
|
|
1567
|
+
/** Shown when loading failed. Explains what went wrong and offers a retry. */
|
|
1568
|
+
export declare function ErrorState(inProps: ErrorStateProps): import("react").JSX.Element;
|
|
1569
|
+
interface LoadingStateProps extends ComponentProps<'div'> {
|
|
1570
|
+
label?: string;
|
|
1571
|
+
}
|
|
1572
|
+
/** A centered spinner with a label, for content that has no natural skeleton. */
|
|
1573
|
+
export declare function LoadingState({ label, className, ...props }: LoadingStateProps): import("react").JSX.Element;
|
|
1574
|
+
//#endregion
|
|
1575
|
+
//#region src/register.d.ts
|
|
1576
|
+
declare module '@glyphui/tokens' {
|
|
1577
|
+
interface GlyphComponentRegistry {
|
|
1578
|
+
AppShell: StylesEntry<typeof appShellStyles>;
|
|
1579
|
+
Avatar: StylesEntry<typeof avatarStyles>;
|
|
1580
|
+
Badge: StylesEntry<typeof badgeStyles>;
|
|
1581
|
+
Button: StylesEntry<typeof buttonStyles>;
|
|
1582
|
+
Card: StylesEntry<typeof cardStyles>;
|
|
1583
|
+
Checkbox: StylesEntry<typeof checkboxStyles>;
|
|
1584
|
+
EmptyState: StylesEntry<typeof stateStyles>;
|
|
1585
|
+
Eyebrow: StylesEntry<typeof eyebrowStyles>;
|
|
1586
|
+
Field: StylesEntry<typeof fieldStyles>;
|
|
1587
|
+
Heading: StylesEntry<typeof headingStyles>;
|
|
1588
|
+
Input: StylesEntry<typeof inputStyles>;
|
|
1589
|
+
Kbd: StylesEntry<typeof kbdStyles>;
|
|
1590
|
+
Label: StylesEntry<typeof labelStyles>;
|
|
1591
|
+
Navbar: StylesEntry<typeof navbarStyles>;
|
|
1592
|
+
PageHeader: StylesEntry<typeof pageHeaderStyles>;
|
|
1593
|
+
SegmentedControl: StylesEntry<typeof segmentedControlStyles>;
|
|
1594
|
+
Select: StylesEntry<typeof selectStyles>;
|
|
1595
|
+
Separator: StylesEntry<typeof separatorStyles>;
|
|
1596
|
+
Sidebar: StylesEntry<typeof sidebarStyles>;
|
|
1597
|
+
Skeleton: StylesEntry<typeof skeletonStyles>;
|
|
1598
|
+
Spinner: StylesEntry<typeof spinnerStyles>;
|
|
1599
|
+
Switch: StylesEntry<typeof switchStyles>;
|
|
1600
|
+
Table: StylesEntry<typeof tableStyles>;
|
|
1601
|
+
Tabs: StylesEntry<typeof tabsStyles>;
|
|
1602
|
+
Text: StylesEntry<typeof textStyles>;
|
|
1603
|
+
Textarea: StylesEntry<typeof textareaStyles>;
|
|
1604
|
+
Tooltip: StylesEntry<typeof tooltipStyles>;
|
|
1605
|
+
}
|
|
1606
|
+
}
|
|
1607
|
+
//#endregion
|
|
1608
|
+
//#region src/components/avatar/avatar.d.ts
|
|
1609
|
+
interface AvatarProps extends ComponentProps<typeof Avatar$1.Root>, AvatarVariants {
|
|
1610
|
+
/** Used for the image alt text and the initials fallback. */
|
|
1611
|
+
name: string;
|
|
1612
|
+
src?: string | undefined;
|
|
1613
|
+
}
|
|
1614
|
+
export declare function Avatar(inProps: AvatarProps): import("react").JSX.Element;
|
|
1615
|
+
export declare function AvatarGroup({ className, ...props }: ComponentProps<'div'>): import("react").JSX.Element;
|
|
1616
|
+
//#endregion
|
|
1617
|
+
//#region src/components/badge/badge.d.ts
|
|
1618
|
+
interface BadgeProps extends ComponentProps<'span'>, BadgeVariants {
|
|
1619
|
+
/** Leading status dot in the badge's color. */
|
|
1620
|
+
dot?: boolean;
|
|
1621
|
+
asChild?: boolean;
|
|
1622
|
+
}
|
|
1623
|
+
export declare function Badge(inProps: BadgeProps): import("react").JSX.Element;
|
|
1624
|
+
//#endregion
|
|
1625
|
+
//#region src/components/card/card.d.ts
|
|
1626
|
+
interface CardProps extends ComponentProps<'div'>, CardVariants {
|
|
1627
|
+
asChild?: boolean;
|
|
1628
|
+
}
|
|
1629
|
+
/** A surface that groups related content. Compose with CardHeader, CardTitle, CardBody, CardFooter. */
|
|
1630
|
+
export declare function Card(inProps: CardProps): import("react").JSX.Element;
|
|
1631
|
+
export declare function CardHeader({ className, ...props }: ComponentProps<'div'>): import("react").JSX.Element;
|
|
1632
|
+
interface CardTitleProps extends ComponentProps<'h3'> {
|
|
1633
|
+
asChild?: boolean;
|
|
1634
|
+
}
|
|
1635
|
+
export declare function CardTitle({ asChild, className, ...props }: CardTitleProps): import("react").JSX.Element;
|
|
1636
|
+
export declare function CardDescription({ className, ...props }: ComponentProps<'p'>): import("react").JSX.Element;
|
|
1637
|
+
export declare function CardBody({ className, ...props }: ComponentProps<'div'>): import("react").JSX.Element;
|
|
1638
|
+
export declare function CardFooter({ className, ...props }: ComponentProps<'div'>): import("react").JSX.Element;
|
|
1639
|
+
//#endregion
|
|
1640
|
+
//#region src/components/container/container.d.ts
|
|
1641
|
+
export declare const containerStyles: import("tailwind-variants").TVReturnType<{
|
|
1642
|
+
size: {
|
|
1643
|
+
sm: "max-w-2xl";
|
|
1644
|
+
md: "max-w-3xl";
|
|
1645
|
+
lg: "max-w-5xl";
|
|
1646
|
+
xl: "max-w-7xl";
|
|
1647
|
+
full: "max-w-none";
|
|
1648
|
+
};
|
|
1649
|
+
}, undefined, "mx-auto w-full px-4 sm:px-6", {
|
|
1650
|
+
size: {
|
|
1651
|
+
sm: "max-w-2xl";
|
|
1652
|
+
md: "max-w-3xl";
|
|
1653
|
+
lg: "max-w-5xl";
|
|
1654
|
+
xl: "max-w-7xl";
|
|
1655
|
+
full: "max-w-none";
|
|
1656
|
+
};
|
|
1657
|
+
}, undefined, import("tailwind-variants").TVReturnTypeLike<{
|
|
1658
|
+
size: {
|
|
1659
|
+
sm: "max-w-2xl";
|
|
1660
|
+
md: "max-w-3xl";
|
|
1661
|
+
lg: "max-w-5xl";
|
|
1662
|
+
xl: "max-w-7xl";
|
|
1663
|
+
full: "max-w-none";
|
|
1664
|
+
};
|
|
1665
|
+
}, undefined>>;
|
|
1666
|
+
interface ContainerProps extends ComponentProps<'div'>, VariantProps<typeof containerStyles> {
|
|
1667
|
+
asChild?: boolean;
|
|
1668
|
+
}
|
|
1669
|
+
/** Centers content at a readable max width with consistent side gutters. */
|
|
1670
|
+
export declare function Container({ size, asChild, className, ...props }: ContainerProps): import("react").JSX.Element;
|
|
1671
|
+
//#endregion
|
|
1672
|
+
//#region src/components/eyebrow/eyebrow.d.ts
|
|
1673
|
+
interface EyebrowProps extends ComponentProps<'p'>, EyebrowVariants {
|
|
1674
|
+
asChild?: boolean;
|
|
1675
|
+
}
|
|
1676
|
+
/** Small uppercase label that sits above a heading. */
|
|
1677
|
+
export declare function Eyebrow(inProps: EyebrowProps): import("react").JSX.Element;
|
|
1678
|
+
//#endregion
|
|
1679
|
+
//#region src/components/field/field-context.d.ts
|
|
1680
|
+
interface FieldContextValue {
|
|
1681
|
+
id: string;
|
|
1682
|
+
descriptionId: string | undefined;
|
|
1683
|
+
errorId: string | undefined;
|
|
1684
|
+
invalid: boolean;
|
|
1685
|
+
required: boolean;
|
|
1686
|
+
disabled: boolean;
|
|
1687
|
+
}
|
|
1688
|
+
export declare const FieldContext: import("react").Context<FieldContextValue | null>;
|
|
1689
|
+
interface ControlProps {
|
|
1690
|
+
id?: string | undefined;
|
|
1691
|
+
disabled?: boolean | undefined;
|
|
1692
|
+
required?: boolean | undefined;
|
|
1693
|
+
'aria-describedby'?: string | undefined;
|
|
1694
|
+
'aria-invalid'?: boolean | 'true' | 'false' | 'grammar' | 'spelling' | undefined;
|
|
1695
|
+
}
|
|
1696
|
+
/**
|
|
1697
|
+
* Connects a form control to the surrounding `Field`: id for the label, `aria-describedby`
|
|
1698
|
+
* for description and error, `aria-invalid`, `required`, `disabled`. Props passed directly win.
|
|
1699
|
+
*/
|
|
1700
|
+
export declare function useFieldControl<P extends ControlProps>(props: P): P;
|
|
1701
|
+
//#endregion
|
|
1702
|
+
//#region src/components/heading/heading.d.ts
|
|
1703
|
+
type Level = 1 | 2 | 3 | 4 | 5 | 6;
|
|
1704
|
+
interface HeadingProps extends ComponentProps<'h2'>, HeadingVariants {
|
|
1705
|
+
/** Document outline level (h1–h6). Visual size follows it unless `size` is set. */
|
|
1706
|
+
level?: Level;
|
|
1707
|
+
asChild?: boolean;
|
|
1708
|
+
}
|
|
1709
|
+
/** A heading whose semantic level and visual size are set independently. */
|
|
1710
|
+
export declare function Heading(inProps: HeadingProps): import("react").JSX.Element;
|
|
1711
|
+
//#endregion
|
|
1712
|
+
//#region src/components/input/input.d.ts
|
|
1713
|
+
interface InputProps extends Omit<ComponentProps<'input'>, 'size' | 'prefix'>, InputVariants {
|
|
1714
|
+
/** Content before the text, e.g. an icon or `https://`. */
|
|
1715
|
+
prefix?: ReactNode;
|
|
1716
|
+
/** Content after the text, e.g. a unit or a Kbd hint. */
|
|
1717
|
+
suffix?: ReactNode;
|
|
1718
|
+
/** Classes for the `<input>` element itself. `className` styles the outer frame. */
|
|
1719
|
+
inputClassName?: string;
|
|
1720
|
+
}
|
|
1721
|
+
export declare function Input(inProps: InputProps): import("react").JSX.Element;
|
|
1722
|
+
//#endregion
|
|
1723
|
+
//#region src/components/section/section.d.ts
|
|
1724
|
+
export declare const sectionStyles: import("tailwind-variants").TVReturnType<{
|
|
1725
|
+
spacing: {
|
|
1726
|
+
none: "py-0";
|
|
1727
|
+
sm: "py-10 sm:py-12";
|
|
1728
|
+
md: "py-16 sm:py-20";
|
|
1729
|
+
lg: "py-20 sm:py-28";
|
|
1730
|
+
};
|
|
1731
|
+
tone: {
|
|
1732
|
+
default: "";
|
|
1733
|
+
subtle: "bg-subtle";
|
|
1734
|
+
};
|
|
1735
|
+
divided: {
|
|
1736
|
+
true: "border-t-(length:--glyph-border-width) border-border";
|
|
1737
|
+
};
|
|
1738
|
+
}, undefined, "w-full", {
|
|
1739
|
+
spacing: {
|
|
1740
|
+
none: "py-0";
|
|
1741
|
+
sm: "py-10 sm:py-12";
|
|
1742
|
+
md: "py-16 sm:py-20";
|
|
1743
|
+
lg: "py-20 sm:py-28";
|
|
1744
|
+
};
|
|
1745
|
+
tone: {
|
|
1746
|
+
default: "";
|
|
1747
|
+
subtle: "bg-subtle";
|
|
1748
|
+
};
|
|
1749
|
+
divided: {
|
|
1750
|
+
true: "border-t-(length:--glyph-border-width) border-border";
|
|
1751
|
+
};
|
|
1752
|
+
}, undefined, import("tailwind-variants").TVReturnTypeLike<{
|
|
1753
|
+
spacing: {
|
|
1754
|
+
none: "py-0";
|
|
1755
|
+
sm: "py-10 sm:py-12";
|
|
1756
|
+
md: "py-16 sm:py-20";
|
|
1757
|
+
lg: "py-20 sm:py-28";
|
|
1758
|
+
};
|
|
1759
|
+
tone: {
|
|
1760
|
+
default: "";
|
|
1761
|
+
subtle: "bg-subtle";
|
|
1762
|
+
};
|
|
1763
|
+
divided: {
|
|
1764
|
+
true: "border-t-(length:--glyph-border-width) border-border";
|
|
1765
|
+
};
|
|
1766
|
+
}, undefined>>;
|
|
1767
|
+
interface SectionProps extends ComponentProps<'section'>, VariantProps<typeof sectionStyles> {
|
|
1768
|
+
asChild?: boolean;
|
|
1769
|
+
}
|
|
1770
|
+
/** A full-width page band with consistent vertical rhythm. Put a Container inside. */
|
|
1771
|
+
export declare function Section({ spacing, tone, divided, asChild, className, ...props }: SectionProps): import("react").JSX.Element;
|
|
1772
|
+
//#endregion
|
|
1773
|
+
//#region src/components/spinner/spinner.d.ts
|
|
1774
|
+
interface SpinnerProps extends Omit<ComponentProps<'svg'>, 'children'>, SpinnerVariants {
|
|
1775
|
+
/** Accessible label. Omit when the spinner sits inside an element that already says it's busy. */
|
|
1776
|
+
label?: string;
|
|
1777
|
+
}
|
|
1778
|
+
export declare function Spinner(inProps: SpinnerProps): import("react").JSX.Element;
|
|
1779
|
+
//#endregion
|
|
1780
|
+
//#region src/components/stack/stack.d.ts
|
|
1781
|
+
export declare const stackStyles: import("tailwind-variants").TVReturnType<{
|
|
1782
|
+
direction: {
|
|
1783
|
+
column: "flex-col";
|
|
1784
|
+
row: "flex-row";
|
|
1785
|
+
};
|
|
1786
|
+
gap: {
|
|
1787
|
+
0: "gap-0";
|
|
1788
|
+
1: "gap-1";
|
|
1789
|
+
2: "gap-2";
|
|
1790
|
+
3: "gap-3";
|
|
1791
|
+
4: "gap-4";
|
|
1792
|
+
5: "gap-5";
|
|
1793
|
+
6: "gap-6";
|
|
1794
|
+
8: "gap-8";
|
|
1795
|
+
10: "gap-10";
|
|
1796
|
+
12: "gap-12";
|
|
1797
|
+
};
|
|
1798
|
+
align: {
|
|
1799
|
+
start: "items-start";
|
|
1800
|
+
center: "items-center";
|
|
1801
|
+
end: "items-end";
|
|
1802
|
+
stretch: "items-stretch";
|
|
1803
|
+
baseline: "items-baseline";
|
|
1804
|
+
};
|
|
1805
|
+
justify: {
|
|
1806
|
+
start: "justify-start";
|
|
1807
|
+
center: "justify-center";
|
|
1808
|
+
end: "justify-end";
|
|
1809
|
+
between: "justify-between";
|
|
1810
|
+
};
|
|
1811
|
+
wrap: {
|
|
1812
|
+
true: "flex-wrap";
|
|
1813
|
+
};
|
|
1814
|
+
}, undefined, "flex", {
|
|
1815
|
+
direction: {
|
|
1816
|
+
column: "flex-col";
|
|
1817
|
+
row: "flex-row";
|
|
1818
|
+
};
|
|
1819
|
+
gap: {
|
|
1820
|
+
0: "gap-0";
|
|
1821
|
+
1: "gap-1";
|
|
1822
|
+
2: "gap-2";
|
|
1823
|
+
3: "gap-3";
|
|
1824
|
+
4: "gap-4";
|
|
1825
|
+
5: "gap-5";
|
|
1826
|
+
6: "gap-6";
|
|
1827
|
+
8: "gap-8";
|
|
1828
|
+
10: "gap-10";
|
|
1829
|
+
12: "gap-12";
|
|
1830
|
+
};
|
|
1831
|
+
align: {
|
|
1832
|
+
start: "items-start";
|
|
1833
|
+
center: "items-center";
|
|
1834
|
+
end: "items-end";
|
|
1835
|
+
stretch: "items-stretch";
|
|
1836
|
+
baseline: "items-baseline";
|
|
1837
|
+
};
|
|
1838
|
+
justify: {
|
|
1839
|
+
start: "justify-start";
|
|
1840
|
+
center: "justify-center";
|
|
1841
|
+
end: "justify-end";
|
|
1842
|
+
between: "justify-between";
|
|
1843
|
+
};
|
|
1844
|
+
wrap: {
|
|
1845
|
+
true: "flex-wrap";
|
|
1846
|
+
};
|
|
1847
|
+
}, undefined, import("tailwind-variants").TVReturnTypeLike<{
|
|
1848
|
+
direction: {
|
|
1849
|
+
column: "flex-col";
|
|
1850
|
+
row: "flex-row";
|
|
1851
|
+
};
|
|
1852
|
+
gap: {
|
|
1853
|
+
0: "gap-0";
|
|
1854
|
+
1: "gap-1";
|
|
1855
|
+
2: "gap-2";
|
|
1856
|
+
3: "gap-3";
|
|
1857
|
+
4: "gap-4";
|
|
1858
|
+
5: "gap-5";
|
|
1859
|
+
6: "gap-6";
|
|
1860
|
+
8: "gap-8";
|
|
1861
|
+
10: "gap-10";
|
|
1862
|
+
12: "gap-12";
|
|
1863
|
+
};
|
|
1864
|
+
align: {
|
|
1865
|
+
start: "items-start";
|
|
1866
|
+
center: "items-center";
|
|
1867
|
+
end: "items-end";
|
|
1868
|
+
stretch: "items-stretch";
|
|
1869
|
+
baseline: "items-baseline";
|
|
1870
|
+
};
|
|
1871
|
+
justify: {
|
|
1872
|
+
start: "justify-start";
|
|
1873
|
+
center: "justify-center";
|
|
1874
|
+
end: "justify-end";
|
|
1875
|
+
between: "justify-between";
|
|
1876
|
+
};
|
|
1877
|
+
wrap: {
|
|
1878
|
+
true: "flex-wrap";
|
|
1879
|
+
};
|
|
1880
|
+
}, undefined>>;
|
|
1881
|
+
interface StackProps extends ComponentProps<'div'>, VariantProps<typeof stackStyles> {
|
|
1882
|
+
asChild?: boolean;
|
|
1883
|
+
}
|
|
1884
|
+
/** Flex layout with spacing from the scale. `direction="row"` for horizontal. */
|
|
1885
|
+
export declare function Stack({ direction, gap, align, justify, wrap, asChild, className, ...props }: StackProps): import("react").JSX.Element;
|
|
1886
|
+
//#endregion
|
|
1887
|
+
//#region src/components/text/text.d.ts
|
|
1888
|
+
interface TextProps extends ComponentProps<'p'>, TextVariants {
|
|
1889
|
+
/** Render the child element (e.g. `<span>`, `<label>`) with text styles instead of a `<p>`. */
|
|
1890
|
+
asChild?: boolean;
|
|
1891
|
+
}
|
|
1892
|
+
export declare function Text(inProps: TextProps): import("react").JSX.Element;
|
|
1893
|
+
//#endregion
|
|
1894
|
+
//#region src/hooks/use-component-config.d.ts
|
|
1895
|
+
type SlotsOf<K extends ComponentName> = GlyphComponentRegistry[K] extends {
|
|
1896
|
+
slots: infer S extends string;
|
|
1897
|
+
} ? S : never;
|
|
1898
|
+
type SlotClasses<K extends ComponentName> = Partial<Record<SlotsOf<K>, string>>;
|
|
1899
|
+
/**
|
|
1900
|
+
* Applies the theme's per-component settings (`theme.components[name]`):
|
|
1901
|
+
* fills unset variant props from `defaultVariants` and returns the extra slot classes.
|
|
1902
|
+
* Every styled component calls this first.
|
|
1903
|
+
*/
|
|
1904
|
+
export declare function useComponentConfig<K extends ComponentName, P extends object>(name: K, props: P): [props: P, slotClasses: SlotClasses<K>];
|
|
1905
|
+
//#endregion
|
|
1906
|
+
//#region src/hooks/use-controllable-state.d.ts
|
|
1907
|
+
interface Options<T> {
|
|
1908
|
+
value?: T | undefined;
|
|
1909
|
+
defaultValue: T;
|
|
1910
|
+
onChange?: ((value: T) => void) | undefined;
|
|
1911
|
+
}
|
|
1912
|
+
/** State that can be controlled by a parent (`value` + `onChange`) or left uncontrolled. */
|
|
1913
|
+
export declare function useControllableState<T>({ value, defaultValue, onChange }: Options<T>): readonly [T, (next: T | ((prev: T) => T)) => void];
|
|
1914
|
+
//#endregion
|
|
1915
|
+
//#region src/hooks/use-media-query.d.ts
|
|
1916
|
+
/** Subscribes to a CSS media query. Returns `fallback` during SSR. */
|
|
1917
|
+
export declare function useMediaQuery(query: string, fallback?: boolean): boolean;
|
|
1918
|
+
//#endregion
|
|
1919
|
+
//#region src/hooks/use-scrolled.d.ts
|
|
1920
|
+
/** True once the window has scrolled past `threshold` pixels. */
|
|
1921
|
+
export declare function useScrolled(threshold?: number, enabled?: boolean): boolean;
|
|
1922
|
+
//#endregion
|
|
1923
|
+
//#region src/patterns/app-shell/app-shell.d.ts
|
|
1924
|
+
interface AppShellProps extends Omit<ComponentProps<'div'>, 'children'>, AppShellVariants {
|
|
1925
|
+
/** A `<Sidebar>`. Shown fixed on desktop and in a drawer on mobile. */
|
|
1926
|
+
sidebar: ReactNode;
|
|
1927
|
+
children: ReactNode;
|
|
1928
|
+
collapsed?: boolean;
|
|
1929
|
+
defaultCollapsed?: boolean;
|
|
1930
|
+
onCollapsedChange?: (collapsed: boolean) => void;
|
|
1931
|
+
/** Shown next to the menu button in the mobile top bar. */
|
|
1932
|
+
mobileBrand?: ReactNode;
|
|
1933
|
+
}
|
|
1934
|
+
/**
|
|
1935
|
+
* App layout: sidebar plus main content. Handles desktop collapse to an icon rail,
|
|
1936
|
+
* the mobile drawer (focus-trapped, closes on navigation), and the mobile top bar.
|
|
1937
|
+
*
|
|
1938
|
+
* `layout="page"` fills the viewport; `layout="embedded"` fills its parent.
|
|
1939
|
+
*/
|
|
1940
|
+
export declare function AppShell(inProps: AppShellProps): import("react").JSX.Element;
|
|
1941
|
+
//#endregion
|
|
1942
|
+
//#region src/patterns/app-shell/app-shell-context.d.ts
|
|
1943
|
+
interface AppShellContextValue {
|
|
1944
|
+
/** Desktop sidebar is collapsed to an icon rail. */
|
|
1945
|
+
collapsed: boolean;
|
|
1946
|
+
setCollapsed: (collapsed: boolean) => void;
|
|
1947
|
+
/** Mobile navigation drawer is open. */
|
|
1948
|
+
mobileOpen: boolean;
|
|
1949
|
+
setMobileOpen: (open: boolean) => void;
|
|
1950
|
+
/** True for the sidebar copy rendered inside the mobile drawer. */
|
|
1951
|
+
inDrawer: boolean;
|
|
1952
|
+
}
|
|
1953
|
+
/** Sidebar state. Works outside an AppShell too (always expanded). */
|
|
1954
|
+
export declare function useAppShell(): AppShellContextValue;
|
|
1955
|
+
//#endregion
|
|
1956
|
+
//#region src/patterns/app-shell/navbar.d.ts
|
|
1957
|
+
interface NavLink {
|
|
1958
|
+
label: ReactNode;
|
|
1959
|
+
href: string;
|
|
1960
|
+
active?: boolean;
|
|
1961
|
+
}
|
|
1962
|
+
interface NavbarProps extends Omit<ComponentProps<'header'>, 'children'> {
|
|
1963
|
+
brand: ReactNode;
|
|
1964
|
+
links?: readonly NavLink[];
|
|
1965
|
+
/** Right side on desktop; bottom of the menu panel on mobile. */
|
|
1966
|
+
actions?: ReactNode;
|
|
1967
|
+
/** Stick to the top of the viewport. Default true. */
|
|
1968
|
+
sticky?: boolean;
|
|
1969
|
+
/** Transparent at the top; translucent with blur and a border once scrolled. Default true. */
|
|
1970
|
+
blurOnScroll?: boolean;
|
|
1971
|
+
containerSize?: ContainerProps['size'];
|
|
1972
|
+
}
|
|
1973
|
+
/**
|
|
1974
|
+
* Site header from data: brand, links, actions. Responsive out of the box: links collapse
|
|
1975
|
+
* into a focus-trapped menu panel on small screens.
|
|
1976
|
+
*/
|
|
1977
|
+
export declare function Navbar(inProps: NavbarProps): import("react").JSX.Element;
|
|
1978
|
+
//#endregion
|
|
1979
|
+
//#region src/patterns/app-shell/page-header.d.ts
|
|
1980
|
+
interface PageHeaderProps extends Omit<ComponentProps<'div'>, 'title'> {
|
|
1981
|
+
title: ReactNode;
|
|
1982
|
+
description?: ReactNode;
|
|
1983
|
+
eyebrow?: ReactNode;
|
|
1984
|
+
/** Buttons aligned to the end on desktop. */
|
|
1985
|
+
actions?: ReactNode;
|
|
1986
|
+
}
|
|
1987
|
+
/** Title block at the top of a page: optional eyebrow, title, description, actions. */
|
|
1988
|
+
export declare function PageHeader(inProps: PageHeaderProps): import("react").JSX.Element;
|
|
1989
|
+
//#endregion
|
|
1990
|
+
//#region src/patterns/app-shell/sidebar.d.ts
|
|
1991
|
+
/** Navigation sidebar. Place inside `AppShell`'s `sidebar` prop. */
|
|
1992
|
+
export declare function Sidebar({ className, ...props }: ComponentProps<'aside'>): import("react").JSX.Element;
|
|
1993
|
+
export declare function SidebarHeader({ className, ...props }: ComponentProps<'div'>): import("react").JSX.Element;
|
|
1994
|
+
export declare function SidebarContent({ className, ...props }: ComponentProps<'nav'>): import("react").JSX.Element;
|
|
1995
|
+
interface SidebarSectionProps extends ComponentProps<'div'> {
|
|
1996
|
+
label?: ReactNode;
|
|
1997
|
+
}
|
|
1998
|
+
export declare function SidebarSection({ label, className, children, ...props }: SidebarSectionProps): import("react").JSX.Element;
|
|
1999
|
+
interface SidebarItemProps {
|
|
2000
|
+
/** Renders a link through the provider's `linkComponent`. Without it, renders a button. */
|
|
2001
|
+
href?: string;
|
|
2002
|
+
icon?: ReactNode;
|
|
2003
|
+
/** Count or short status shown at the end. */
|
|
2004
|
+
badge?: ReactNode;
|
|
2005
|
+
active?: boolean;
|
|
2006
|
+
onClick?: (event: MouseEvent<HTMLElement>) => void;
|
|
2007
|
+
className?: string;
|
|
2008
|
+
children: ReactNode;
|
|
2009
|
+
}
|
|
2010
|
+
export declare function SidebarItem({ href, icon, badge, active, onClick, className, children }: SidebarItemProps): import("react").JSX.Element;
|
|
2011
|
+
export declare function SidebarFooter({ className, ...props }: ComponentProps<'div'>): import("react").JSX.Element;
|
|
2012
|
+
/** Collapses the sidebar on desktop; opens the navigation drawer on mobile. */
|
|
2013
|
+
export declare function SidebarTrigger(props: Partial<IconButtonProps>): import("react").JSX.Element | null;
|
|
2014
|
+
//#endregion
|
|
2015
|
+
//#region src/patterns/async/async.d.ts
|
|
2016
|
+
type AsyncStatus = 'pending' | 'error' | 'success';
|
|
2017
|
+
/**
|
|
2018
|
+
* The shape of an async result. TanStack Query's `useQuery()` result matches it, as does
|
|
2019
|
+
* Glyph's own `useAsync()`.
|
|
2020
|
+
*/
|
|
2021
|
+
interface AsyncResult<T> {
|
|
2022
|
+
status: AsyncStatus;
|
|
2023
|
+
data?: T | undefined;
|
|
2024
|
+
error?: unknown;
|
|
2025
|
+
refetch?: () => unknown;
|
|
2026
|
+
}
|
|
2027
|
+
interface AsyncProps<T> {
|
|
2028
|
+
result: AsyncResult<T>;
|
|
2029
|
+
/** Rendered once data is ready and not empty. */
|
|
2030
|
+
children: (data: NonNullable<T>) => ReactNode;
|
|
2031
|
+
/** Treat ready data as empty. Defaults to: an empty array. */
|
|
2032
|
+
isEmpty?: (data: NonNullable<T>) => boolean;
|
|
2033
|
+
loading?: ReactNode;
|
|
2034
|
+
empty?: ReactNode;
|
|
2035
|
+
error?: ReactNode | ((error: unknown, retry: (() => unknown) | undefined) => ReactNode);
|
|
2036
|
+
}
|
|
2037
|
+
/**
|
|
2038
|
+
* Renders the right UI for every state of an async result: loading, error (with retry),
|
|
2039
|
+
* empty, or your content. One convention for every data-driven screen.
|
|
2040
|
+
*
|
|
2041
|
+
* ```tsx
|
|
2042
|
+
* <Async result={useQuery(...)} empty={<EmptyState title="No invoices yet" />}>
|
|
2043
|
+
* {(invoices) => <InvoiceList invoices={invoices} />}
|
|
2044
|
+
* </Async>
|
|
2045
|
+
* ```
|
|
2046
|
+
*/
|
|
2047
|
+
export declare function Async<T>({ result, children, isEmpty, loading, empty, error }: AsyncProps<T>): string | number | bigint | boolean | import("react").JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
|
|
2048
|
+
/**
|
|
2049
|
+
* Runs an async function and tracks its state as an `AsyncResult`. Re-runs when `deps`
|
|
2050
|
+
* change; stale responses are ignored. For caching and deduping, use TanStack Query.
|
|
2051
|
+
*/
|
|
2052
|
+
export declare function useAsync<T>(fn: () => Promise<T>, deps: DependencyList): AsyncResult<T>;
|
|
2053
|
+
//#endregion
|
|
2054
|
+
//#region src/provider/color-mode.d.ts
|
|
2055
|
+
type ColorModePreference = ColorMode$1 | 'system';
|
|
2056
|
+
interface ColorModeContextValue {
|
|
2057
|
+
/** What the user chose. */
|
|
2058
|
+
mode: ColorModePreference;
|
|
2059
|
+
/** What is shown: `system` resolved against the OS setting. */
|
|
2060
|
+
resolvedMode: ColorMode$1;
|
|
2061
|
+
setMode: (mode: ColorModePreference) => void;
|
|
2062
|
+
}
|
|
2063
|
+
interface ColorModeOptions {
|
|
2064
|
+
/** Used when nothing is stored yet. */
|
|
2065
|
+
defaultMode?: ColorModePreference;
|
|
2066
|
+
/** localStorage key. Set to `null` to disable persistence. */
|
|
2067
|
+
storageKey?: string | null;
|
|
2068
|
+
}
|
|
2069
|
+
export declare function ColorModeProvider({ children, defaultMode, storageKey }: ColorModeOptions & {
|
|
2070
|
+
children: ReactNode;
|
|
2071
|
+
}): import("react").JSX.Element;
|
|
2072
|
+
/** Read and change the color mode. */
|
|
2073
|
+
export declare function useColorMode(): ColorModeContextValue;
|
|
2074
|
+
/**
|
|
2075
|
+
* Inline script that sets `data-mode` on `<html>` before first paint, so a dark-mode
|
|
2076
|
+
* visitor never sees a light flash. Put it in `<head>`.
|
|
2077
|
+
*/
|
|
2078
|
+
export declare function getColorModeScript({ defaultMode, storageKey }?: ColorModeOptions): string;
|
|
2079
|
+
/** `<script>` element version of `getColorModeScript` for SSR frameworks. */
|
|
2080
|
+
export declare function ColorModeScript(props: ColorModeOptions): import("react").JSX.Element;
|
|
2081
|
+
//#endregion
|
|
2082
|
+
//#region src/provider/glyph-context.d.ts
|
|
2083
|
+
/** Props Glyph passes to your router's link component. */
|
|
2084
|
+
interface LinkComponentProps {
|
|
2085
|
+
href: string;
|
|
2086
|
+
className?: string;
|
|
2087
|
+
children?: ReactNode;
|
|
2088
|
+
onClick?: MouseEventHandler<HTMLAnchorElement>;
|
|
2089
|
+
'aria-current'?: 'page' | undefined;
|
|
2090
|
+
}
|
|
2091
|
+
/**
|
|
2092
|
+
* Any component that renders a link from these props. Plain `'a'` by default.
|
|
2093
|
+
* React Router: `({ href, ...props }) => <Link to={href} {...props} />`
|
|
2094
|
+
*/
|
|
2095
|
+
type LinkComponent = ElementType<LinkComponentProps>;
|
|
2096
|
+
interface GlyphContextValue {
|
|
2097
|
+
theme: Theme$1;
|
|
2098
|
+
linkComponent: LinkComponent;
|
|
2099
|
+
}
|
|
2100
|
+
/** The active theme and app-level settings. Must be used under `GlyphProvider`. */
|
|
2101
|
+
export declare function useGlyph(): GlyphContextValue;
|
|
2102
|
+
/** The router-aware link component configured on `GlyphProvider`. */
|
|
2103
|
+
export declare function useLinkComponent(): LinkComponent;
|
|
2104
|
+
//#endregion
|
|
2105
|
+
//#region src/provider/glyph-provider.d.ts
|
|
2106
|
+
interface GlyphProviderProps {
|
|
2107
|
+
children: ReactNode;
|
|
2108
|
+
/** The theme for the whole app. Defaults to the `glyph` preset. */
|
|
2109
|
+
theme?: Theme$1;
|
|
2110
|
+
/** Color mode used until the user picks one. */
|
|
2111
|
+
defaultMode?: ColorModePreference;
|
|
2112
|
+
/** localStorage key for the user's color mode. `null` disables persistence. */
|
|
2113
|
+
storageKey?: string | null;
|
|
2114
|
+
/** Your router's link, used by Navbar, Sidebar and other navigation components. */
|
|
2115
|
+
linkComponent?: LinkComponent;
|
|
2116
|
+
}
|
|
2117
|
+
/** Provides the theme, color mode and app settings. Render once at the root. */
|
|
2118
|
+
export declare function GlyphProvider({ children, theme, defaultMode, storageKey, linkComponent }: GlyphProviderProps): import("react").JSX.Element;
|
|
2119
|
+
//#endregion
|
|
2120
|
+
//#region src/provider/theme-scope.d.ts
|
|
2121
|
+
interface ThemeScopeProps extends ComponentProps<'div'> {
|
|
2122
|
+
theme: Theme$1;
|
|
2123
|
+
/** Force a color mode for this subtree. Follows the page by default. */
|
|
2124
|
+
mode?: ColorMode$1;
|
|
2125
|
+
asChild?: boolean;
|
|
2126
|
+
}
|
|
2127
|
+
/** Renders a subtree with a different theme, e.g. to compare themes side by side. */
|
|
2128
|
+
export declare function ThemeScope({ theme, mode, asChild, children, ...props }: ThemeScopeProps): import("react").JSX.Element;
|
|
2129
|
+
//#endregion
|
|
2130
|
+
//#region src/themes.d.ts
|
|
2131
|
+
/**
|
|
2132
|
+
* Built-in themes: the token presets from @glyphui/tokens plus per-component recipes.
|
|
2133
|
+
* Extend any of them in your theme file: `defineTheme({ name: 'acme', extends: presets.glyph, ... })`.
|
|
2134
|
+
*/
|
|
2135
|
+
/** Precise, dark-first, one electric-blue accent, layered soft shadows, Geist. */
|
|
2136
|
+
export declare const glyph: import("@glyphui/tokens").Theme;
|
|
2137
|
+
/** Zero radius, heavy borders, hard offset shadows, loud color. */
|
|
2138
|
+
export declare const brutalist: import("@glyphui/tokens").Theme;
|
|
2139
|
+
/** Serif display type, warm paper neutrals, deep green ink, hairlines instead of shadows. */
|
|
2140
|
+
export declare const editorial: import("@glyphui/tokens").Theme;
|
|
2141
|
+
/** Pill shapes, lavender and mint, chunky rounded type, springy motion. */
|
|
2142
|
+
export declare const playful: import("@glyphui/tokens").Theme;
|
|
2143
|
+
export declare const presets: {
|
|
2144
|
+
readonly glyph: import("@glyphui/tokens").Theme;
|
|
2145
|
+
readonly brutalist: import("@glyphui/tokens").Theme;
|
|
2146
|
+
readonly editorial: import("@glyphui/tokens").Theme;
|
|
2147
|
+
readonly playful: import("@glyphui/tokens").Theme;
|
|
2148
|
+
};
|
|
2149
|
+
type PresetName = keyof typeof presets;
|
|
2150
|
+
//#endregion
|
|
2151
|
+
//#region src/utils/cn.d.ts
|
|
2152
|
+
/** Joins class names and resolves Tailwind conflicts (last one wins). */
|
|
2153
|
+
export declare function cn(...inputs: ClassValue[]): string;
|
|
2154
|
+
//#endregion
|
|
2155
|
+
export { type AppShellContextValue, type AppShellProps, type AsyncProps, type AsyncResult, type AsyncStatus, type AvatarProps, type AvatarVariants, type BadgeProps, type BadgeVariants, Button, type ButtonProps, type ButtonVariants, type CardProps, type CardTitleProps, type CardVariants, type ClassValue, type ColorMode, type ColorModeContextValue, type ColorModeOptions, type ColorModePreference, type ColorToken, type ComponentOverrides, type ContainerProps, type ErrorStateProps, type EyebrowProps, type EyebrowVariants, Field, type FieldContextValue, type FieldProps, type FieldVariants, type GlyphContextValue, type GlyphProviderProps, type HeadingProps, type HeadingVariants, IconButton, type IconButtonProps, type InputProps, type InputVariants, type LinkComponent, type LinkComponentProps, type LoadingStateProps, type NavLink, type NavbarProps, type PageHeaderProps, type PresetName, type RadiusToken, type SectionProps, type SegmentedControlProps, type SegmentedOption, type SelectItemProps, type SelectProps, type ShadowToken, type SidebarItemProps, type SidebarSectionProps, type SlotClasses, type SpinnerProps, type SpinnerVariants, type StackProps, type StateProps, type SwitchProps, type TabsProps, type TextProps, type TextToken, type TextVariants, type Theme, type ThemeInput, type ThemeScopeProps, type Tone, type TooltipProps, type VariantProps, buttonStyles, defineTheme, fieldStyles, themeToCss, tokenVar, tv };
|