@qasa/qds-ui 1.0.2 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +1616 -1570
- package/dist/index.js +1 -58
- package/dist/index.js.map +1 -1
- package/package.json +5 -5
package/dist/index.d.ts
CHANGED
|
@@ -1,35 +1,42 @@
|
|
|
1
|
-
|
|
2
|
-
import * as react from 'react';
|
|
3
|
-
import { ReactNode, ElementType, ComponentPropsWithoutRef, SVGAttributes, ReactElement, useLayoutEffect } from 'react';
|
|
4
|
-
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
5
|
-
import { VariantProps } from 'class-variance-authority';
|
|
6
|
-
import { Checkbox as Checkbox$1, DropdownMenu as DropdownMenu$1, RadioGroup as RadioGroup$1, Switch as Switch$1, Toast as Toast$1 } from 'radix-ui';
|
|
7
|
-
import { LucideIcon } from 'lucide-react';
|
|
1
|
+
'use client';
|
|
8
2
|
|
|
9
|
-
|
|
3
|
+
import * as React$1 from "react";
|
|
4
|
+
import { ComponentPropsWithoutRef, ElementType, ReactElement, ReactNode, SVGAttributes, useLayoutEffect } from "react";
|
|
5
|
+
import { Checkbox as Checkbox$1, DropdownMenu as DropdownMenu$1, RadioGroup as RadioGroup$1, Switch as Switch$1, Toast as Toast$1 } from "radix-ui";
|
|
6
|
+
import { LucideIcon } from "lucide-react";
|
|
7
|
+
import { VariantProps } from "class-variance-authority";
|
|
10
8
|
|
|
9
|
+
//#region src/i18n/locales.d.ts
|
|
10
|
+
type LanguageCode = 'en' | 'sv' | 'fi' | 'fr' | 'nb';
|
|
11
|
+
//#endregion
|
|
12
|
+
//#region src/qds-provider.d.ts
|
|
11
13
|
type QdsProviderProps = {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
+
children: ReactNode;
|
|
15
|
+
locale: LanguageCode;
|
|
14
16
|
};
|
|
15
|
-
declare function QdsProvider({
|
|
16
|
-
|
|
17
|
+
declare function QdsProvider({
|
|
18
|
+
children,
|
|
19
|
+
locale
|
|
20
|
+
}: QdsProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
21
|
+
//#endregion
|
|
22
|
+
//#region src/types.d.ts
|
|
17
23
|
type LegitimateAny = any;
|
|
18
24
|
type PartialRecord<K extends string | number | symbol, T> = Partial<Record<K, T>>;
|
|
19
25
|
type Merge<P1 = {}, P2 = {}> = Omit<P1, keyof P2> & P2;
|
|
20
26
|
type HTMLQdsProps<T extends ElementType> = ComponentPropsWithoutRef<T>;
|
|
21
|
-
|
|
27
|
+
//#endregion
|
|
28
|
+
//#region src/utils/responsive-classes.d.ts
|
|
22
29
|
declare const BREAKPOINTS: {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
30
|
+
readonly base: "";
|
|
31
|
+
readonly sm: "sm:";
|
|
32
|
+
readonly md: "md:";
|
|
33
|
+
readonly lg: "lg:";
|
|
34
|
+
readonly xl: "xl:";
|
|
35
|
+
readonly '2xl': "2xl:";
|
|
29
36
|
};
|
|
30
37
|
type BreakpointKey = keyof typeof BREAKPOINTS;
|
|
31
38
|
type BreakpointsConfig$1<T> = PartialRecord<Exclude<BreakpointKey, 'base'>, T> & {
|
|
32
|
-
|
|
39
|
+
base: T;
|
|
33
40
|
};
|
|
34
41
|
type ResponsiveProp<T> = T | BreakpointsConfig$1<T>;
|
|
35
42
|
/**
|
|
@@ -43,8 +50,8 @@ type ResponsiveProp<T> = T | BreakpointsConfig$1<T>;
|
|
|
43
50
|
* breakpoint-prefixed variants.
|
|
44
51
|
*/
|
|
45
52
|
type ResponsiveClassMap<T extends string> = {
|
|
46
|
-
|
|
47
|
-
|
|
53
|
+
readonly classes: Record<T, string>;
|
|
54
|
+
readonly default: T;
|
|
48
55
|
};
|
|
49
56
|
/**
|
|
50
57
|
* Derives the size literal union from a class map.
|
|
@@ -54,41 +61,36 @@ type ResponsiveClassMap<T extends string> = {
|
|
|
54
61
|
* type ButtonSize = ResponsiveSize<typeof SIZE_CLASSES>
|
|
55
62
|
*/
|
|
56
63
|
type ResponsiveSize<M> = M extends ResponsiveClassMap<infer T> ? T : never;
|
|
57
|
-
|
|
58
|
-
|
|
64
|
+
//#endregion
|
|
65
|
+
//#region src/components/avatar/avatar.d.ts
|
|
66
|
+
declare const SIZE_CLASSES$7: ResponsiveClassMap<"2xl" | "sm" | "md" | "lg" | "xl" | "xs">;
|
|
59
67
|
type AvatarSize = ResponsiveSize<typeof SIZE_CLASSES$7>;
|
|
60
68
|
type AvatarOptions = {
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
69
|
+
/**
|
|
70
|
+
* Source url of the image to display. If not passed
|
|
71
|
+
* it will display a fallback icon.
|
|
72
|
+
*/
|
|
73
|
+
src?: string;
|
|
74
|
+
/**
|
|
75
|
+
* Name of the user. Used to generate the initials
|
|
76
|
+
* if no image is provided, but also for accessibility.
|
|
77
|
+
*/
|
|
78
|
+
name?: string;
|
|
79
|
+
/**
|
|
80
|
+
* Size of the avatar
|
|
81
|
+
* @default 'md'
|
|
82
|
+
*/
|
|
83
|
+
size?: ResponsiveProp<AvatarSize>;
|
|
84
|
+
/**
|
|
85
|
+
* A custom alt text for the image. If not passed it
|
|
86
|
+
* defaults to the `name` prop.
|
|
87
|
+
*/
|
|
88
|
+
imageAlt?: string;
|
|
81
89
|
};
|
|
82
90
|
type AvatarProps = {} & HTMLQdsProps<'span'> & AvatarOptions;
|
|
83
|
-
declare const Avatar: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & AvatarOptions & react.RefAttributes<HTMLSpanElement>>;
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
* This file is originally from `@radix-ui/react-polymorphic` before the package
|
|
87
|
-
* was deprecated. The original source for this lived in the URL below.
|
|
88
|
-
*
|
|
89
|
-
* @see https://github.com/radix-ui/primitives/blob/17ffcb7aaa42cbd36b3c210ba86d7d73d218e5be/packages/react/polymorphic/src/polymorphic.ts
|
|
90
|
-
*/
|
|
91
|
-
|
|
91
|
+
declare const Avatar: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & AvatarOptions & import("react").RefAttributes<HTMLSpanElement>>;
|
|
92
|
+
//#endregion
|
|
93
|
+
//#region src/utils/polymorphic.d.ts
|
|
92
94
|
/**
|
|
93
95
|
* Infers the OwnProps if E is a ForwardRefExoticComponentWithAs
|
|
94
96
|
*/
|
|
@@ -97,391 +99,397 @@ type OwnProps<E> = E extends ForwardRefComponent<any, infer P> ? P : {};
|
|
|
97
99
|
* Infers the JSX.IntrinsicElement if E is a ForwardRefExoticComponentWithAs
|
|
98
100
|
*/
|
|
99
101
|
type IntrinsicElement<E> = E extends ForwardRefComponent<infer I, any> ? I : never;
|
|
100
|
-
type ForwardRefExoticComponent<E, OwnProps> =
|
|
101
|
-
|
|
102
|
+
type ForwardRefExoticComponent<E, OwnProps> = React$1.ForwardRefExoticComponent<Merge<E extends React$1.ElementType ? React$1.ComponentPropsWithRef<E> : never, OwnProps & {
|
|
103
|
+
as?: E;
|
|
102
104
|
}>>;
|
|
103
105
|
type ForwardRefComponent<IntrinsicElementString, OwnProps = {}> = {
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
106
|
+
/**
|
|
107
|
+
* When `as` prop is passed, use this overload.
|
|
108
|
+
* Merges original own props (without DOM props) and the inferred props
|
|
109
|
+
* from `as` element with the own props taking precendence.
|
|
110
|
+
*
|
|
111
|
+
* We explicitly avoid `React.ElementType` and manually narrow the prop types
|
|
112
|
+
* so that events are typed when using JSX.IntrinsicElements.
|
|
113
|
+
*/
|
|
114
|
+
<As = IntrinsicElementString>(props: As extends '' ? {
|
|
115
|
+
as: keyof React$1.JSX.IntrinsicElements;
|
|
116
|
+
} : As extends React$1.ComponentType<infer P> ? Merge<P, OwnProps & {
|
|
117
|
+
as: As;
|
|
118
|
+
}> : As extends keyof React$1.JSX.IntrinsicElements ? Merge<React$1.JSX.IntrinsicElements[As], OwnProps & {
|
|
119
|
+
as: As;
|
|
120
|
+
}> : never): React$1.ReactElement | null;
|
|
119
121
|
} & ForwardRefExoticComponent<IntrinsicElementString, OwnProps>;
|
|
120
122
|
/**
|
|
121
123
|
* Infers the props of a React component
|
|
122
124
|
*/
|
|
123
|
-
type PropsOf<E> = E extends
|
|
124
|
-
|
|
125
|
+
type PropsOf<E> = E extends React$1.ComponentType<infer P> ? P : never;
|
|
126
|
+
//#endregion
|
|
127
|
+
//#region src/components/icon/create-icon.d.ts
|
|
125
128
|
/**
|
|
126
129
|
* This function is heavily inspired by the `createIcon` function from
|
|
127
130
|
* Chakra UI (https://chakra-ui.com/).
|
|
128
131
|
*/
|
|
129
132
|
type CreateIconOptions = {
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
133
|
+
/**
|
|
134
|
+
* The `svg`'s `viewBox` attribute
|
|
135
|
+
*/
|
|
136
|
+
viewBox: string;
|
|
137
|
+
/**
|
|
138
|
+
* If the `svg` has a single path, simply copy the path's `d` attribute
|
|
139
|
+
*/
|
|
140
|
+
d?: string;
|
|
141
|
+
/**
|
|
142
|
+
* The `svg` path or group element
|
|
143
|
+
*
|
|
144
|
+
* @example
|
|
145
|
+
* ```jsx
|
|
146
|
+
* createIcon({
|
|
147
|
+
* viewBox: '0 0 512 512',
|
|
148
|
+
* path: [
|
|
149
|
+
* <circle cx="50" cy="50" r="50" />,
|
|
150
|
+
* <path d="M10 10" />,
|
|
151
|
+
* ],
|
|
152
|
+
* displayName: 'ExampleIcon',
|
|
153
|
+
* })
|
|
154
|
+
* ```
|
|
155
|
+
*/
|
|
156
|
+
path?: React.ReactElement | React.ReactElement[];
|
|
157
|
+
/**
|
|
158
|
+
* The display name of the icon. Useful for debugging
|
|
159
|
+
* and internal use.
|
|
160
|
+
*/
|
|
161
|
+
displayName?: string;
|
|
159
162
|
};
|
|
160
163
|
/**
|
|
161
164
|
* Helper function to create an icon component.
|
|
162
165
|
*/
|
|
163
|
-
declare const createIcon: (options: CreateIconOptions) => react.ForwardRefExoticComponent<Omit<react.SVGAttributes<SVGElement>, "
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
} & react.RefAttributes<SVGSVGElement>>;
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
166
|
+
declare const createIcon: (options: CreateIconOptions) => import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
167
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
168
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
169
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
170
|
+
//#endregion
|
|
171
|
+
//#region src/components/icon/create-lucide-icon.d.ts
|
|
172
|
+
declare const createLucideIcon: (Icon: LucideIcon) => import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
173
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
174
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
175
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
176
|
+
//#endregion
|
|
177
|
+
//#region src/components/icon/icons.d.ts
|
|
178
|
+
declare const AlertCircleIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
179
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
180
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
181
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
182
|
+
declare const AlertTriangleIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
183
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
184
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
185
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
186
|
+
declare const ArrowDownIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
187
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
188
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
189
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
190
|
+
declare const ArrowLeftIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
191
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
192
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
193
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
194
|
+
declare const ArrowRightIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
195
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
196
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
197
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
198
|
+
declare const ArrowUpIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
199
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
200
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
201
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
202
|
+
declare const BellIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
203
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
204
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
205
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
206
|
+
declare const BellOffIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
207
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
208
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
209
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
210
|
+
declare const BookmarkFilledIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
211
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
212
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
213
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
214
|
+
declare const BookmarkIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
215
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
216
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
217
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
218
|
+
declare const CalendarIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
219
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
220
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
221
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
222
|
+
declare const CameraIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
223
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
224
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
225
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
226
|
+
declare const CheckCircleIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
227
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
228
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
229
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
230
|
+
declare const CheckIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
231
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
232
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
233
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
234
|
+
declare const ChevronDownIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
235
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
236
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
237
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
238
|
+
declare const ChevronLeftIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
239
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
240
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
241
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
242
|
+
declare const ChevronRightIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
243
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
244
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
245
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
246
|
+
declare const ChevronUpIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
247
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
248
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
249
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
250
|
+
declare const GlobeIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
251
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
252
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
253
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
254
|
+
declare const HeartFilledIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
255
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
256
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
257
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
258
|
+
declare const HeartIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
259
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
260
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
261
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
262
|
+
declare const HelpCircleIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
263
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
264
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
265
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
266
|
+
declare const HistoryIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
267
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
268
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
269
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
270
|
+
declare const HomeIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
271
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
272
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
273
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
274
|
+
declare const ImageIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
275
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
276
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
277
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
278
|
+
declare const InfoIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
279
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
280
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
281
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
282
|
+
declare const ListIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
283
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
284
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
285
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
286
|
+
declare const ListFilterIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
287
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
288
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
289
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
290
|
+
declare const LogOutIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
291
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
292
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
293
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
294
|
+
declare const MapIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
295
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
296
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
297
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
298
|
+
declare const MapPinIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
299
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
300
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
301
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
302
|
+
declare const MenuIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
303
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
304
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
305
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
306
|
+
declare const MessageCircleIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
307
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
308
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
309
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
310
|
+
declare const MinusIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
311
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
312
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
313
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
314
|
+
declare const MoreHorizontalIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
315
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
316
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
317
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
318
|
+
declare const MoreVerticalIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
319
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
320
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
321
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
322
|
+
declare const PenIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
323
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
324
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
325
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
326
|
+
declare const PlusIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
327
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
328
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
329
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
330
|
+
declare const SearchIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
331
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
332
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
333
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
334
|
+
declare const SettingsIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
335
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
336
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
337
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
338
|
+
declare const ShareIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
339
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
340
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
341
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
342
|
+
declare const SlidersIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
343
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
344
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
345
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
346
|
+
declare const StarFilledIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
347
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
348
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
349
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
350
|
+
declare const StarIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
351
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
352
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
353
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
354
|
+
declare const TrashIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
355
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
356
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
357
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
358
|
+
declare const UserIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
359
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
360
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
361
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
362
|
+
declare const XCircleIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
363
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
364
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
365
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
366
|
+
declare const XIcon: import("react").ForwardRefExoticComponent<Omit<import("react").SVGAttributes<SVGElement>, "height" | "width" | "color" | "onClick" | "fontSize"> & {
|
|
367
|
+
size?: 16 | 12 | 20 | 24 | 32;
|
|
368
|
+
color?: "strong" | "disabled" | "default" | "subtle" | "negative" | "warning" | "positive" | "onBrandPrimary" | "onBrandSecondary" | "onBrandTertiary" | "currentColor";
|
|
369
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
370
|
+
//#endregion
|
|
371
|
+
//#region src/components/icon/icon-shared.d.ts
|
|
366
372
|
declare const ICON_COLOR_CLASSES: {
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
373
|
+
readonly default: "text-[color:var(--stroke-default)]";
|
|
374
|
+
readonly strong: "text-[color:var(--stroke-strong)]";
|
|
375
|
+
readonly subtle: "text-[color:var(--stroke-subtle)]";
|
|
376
|
+
readonly disabled: "text-[color:var(--stroke-disabled)]";
|
|
377
|
+
readonly negative: "text-[color:var(--stroke-negative)]";
|
|
378
|
+
readonly warning: "text-[color:var(--stroke-warning)]";
|
|
379
|
+
readonly positive: "text-[color:var(--stroke-positive)]";
|
|
380
|
+
readonly onBrandPrimary: "text-[color:var(--stroke-onBrandPrimary)]";
|
|
381
|
+
readonly onBrandSecondary: "text-[color:var(--stroke-onBrandSecondary)]";
|
|
382
|
+
readonly onBrandTertiary: "text-[color:var(--stroke-onBrandTertiary)]";
|
|
377
383
|
};
|
|
378
384
|
type IconSize = 12 | 16 | 20 | 24 | 32;
|
|
379
385
|
type IconColor = keyof typeof ICON_COLOR_CLASSES | 'currentColor';
|
|
380
386
|
type IconOptions = {
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
387
|
+
/**
|
|
388
|
+
* The size of the icon.
|
|
389
|
+
*
|
|
390
|
+
* @default 24
|
|
391
|
+
*/
|
|
392
|
+
size?: IconSize;
|
|
393
|
+
/**
|
|
394
|
+
* The color of the icon.
|
|
395
|
+
*
|
|
396
|
+
* @default 'default'
|
|
397
|
+
*/
|
|
398
|
+
color?: IconColor;
|
|
393
399
|
};
|
|
394
400
|
type OmittedProps$9 = 'color' | 'onClick' | 'width' | 'height' | 'fontSize';
|
|
395
401
|
type IconProps = {} & Omit<SVGAttributes<SVGElement>, OmittedProps$9> & IconOptions;
|
|
396
|
-
|
|
402
|
+
//#endregion
|
|
403
|
+
//#region src/components/button/button.d.ts
|
|
397
404
|
declare const SIZE_CLASSES$6: ResponsiveClassMap<"sm" | "md" | "lg" | "xl" | "xs">;
|
|
398
405
|
declare const buttonVariants: (props?: ({
|
|
399
|
-
|
|
400
|
-
} &
|
|
406
|
+
variant?: "primary" | "secondary" | "tertiary" | "danger" | null | undefined;
|
|
407
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
401
408
|
type ButtonSize = ResponsiveSize<typeof SIZE_CLASSES$6>;
|
|
402
409
|
type ButtonVariant = NonNullable<VariantProps<typeof buttonVariants>['variant']>;
|
|
403
410
|
type ButtonOptions = {
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
411
|
+
/**
|
|
412
|
+
* Sets the size of the button
|
|
413
|
+
* @default 'md'
|
|
414
|
+
*/
|
|
415
|
+
size?: ResponsiveProp<ButtonSize>;
|
|
416
|
+
/**
|
|
417
|
+
* Sets the style variant of the button
|
|
418
|
+
* @default 'secondary'
|
|
419
|
+
*/
|
|
420
|
+
variant?: ButtonVariant;
|
|
421
|
+
/**
|
|
422
|
+
* If `true` the button will fill its container
|
|
423
|
+
* @default false
|
|
424
|
+
*/
|
|
425
|
+
isFullWidth?: boolean;
|
|
426
|
+
/**
|
|
427
|
+
* If `true` the button will show a spinner
|
|
428
|
+
* @default false
|
|
429
|
+
*/
|
|
430
|
+
isLoading?: boolean;
|
|
431
|
+
/**
|
|
432
|
+
* If `true` the button will be disabled
|
|
433
|
+
* @default false
|
|
434
|
+
*/
|
|
435
|
+
isDisabled?: boolean;
|
|
436
|
+
/**
|
|
437
|
+
* Icon to display before the button label
|
|
438
|
+
*/
|
|
439
|
+
iconLeft?: ElementType<IconProps>;
|
|
440
|
+
/**
|
|
441
|
+
* Icon to display after the button label
|
|
442
|
+
*/
|
|
443
|
+
iconRight?: ElementType<IconProps>;
|
|
444
|
+
/**
|
|
445
|
+
* The HTML `type` attribute
|
|
446
|
+
* @default 'button'
|
|
447
|
+
*/
|
|
448
|
+
type?: 'button' | 'submit' | 'reset';
|
|
442
449
|
};
|
|
443
450
|
type PolymorphicButton = ForwardRefComponent<'button', ButtonOptions>;
|
|
444
451
|
type ButtonProps = PropsOf<PolymorphicButton>;
|
|
445
452
|
declare const Button: PolymorphicButton;
|
|
446
|
-
|
|
447
|
-
|
|
453
|
+
//#endregion
|
|
454
|
+
//#region src/components/display-text/display-text.d.ts
|
|
455
|
+
declare const SIZE_CLASSES$5: ResponsiveClassMap<"2xl" | "sm" | "md" | "lg" | "xl" | "xs" | "3xl" | "2xs">;
|
|
448
456
|
declare const TEXT_ALIGN_CLASSES$2: {
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
457
|
+
readonly left: "text-left";
|
|
458
|
+
readonly center: "text-center";
|
|
459
|
+
readonly right: "text-right";
|
|
452
460
|
};
|
|
453
461
|
declare const TEXT_WRAP_CLASSES: {
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
462
|
+
readonly pretty: "text-pretty";
|
|
463
|
+
readonly balance: "text-balance";
|
|
464
|
+
readonly wrap: "text-wrap";
|
|
465
|
+
readonly nowrap: "text-nowrap";
|
|
466
|
+
readonly stable: "[text-wrap:stable]";
|
|
459
467
|
};
|
|
460
468
|
type DisplaySize = ResponsiveSize<typeof SIZE_CLASSES$5>;
|
|
461
469
|
type DisplayTextAlign = keyof typeof TEXT_ALIGN_CLASSES$2;
|
|
462
470
|
type DisplayTextWrap = keyof typeof TEXT_WRAP_CLASSES;
|
|
463
471
|
type DisplayTextOptions = {
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
472
|
+
/**
|
|
473
|
+
* Sets the visual size of the display text.
|
|
474
|
+
* To override the rendered tag, use the `as` prop.
|
|
475
|
+
*
|
|
476
|
+
* @default 'md'
|
|
477
|
+
*/
|
|
478
|
+
size?: ResponsiveProp<DisplaySize>;
|
|
479
|
+
/**
|
|
480
|
+
* Sets the text alignment
|
|
481
|
+
*
|
|
482
|
+
* @default 'left'
|
|
483
|
+
*/
|
|
484
|
+
textAlign?: DisplayTextAlign;
|
|
485
|
+
/**
|
|
486
|
+
* Sets the text wrapping
|
|
487
|
+
*
|
|
488
|
+
* See [MDN Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/text-wrap)
|
|
489
|
+
*
|
|
490
|
+
* @default 'pretty'
|
|
491
|
+
*/
|
|
492
|
+
textWrap?: DisplayTextWrap;
|
|
485
493
|
};
|
|
486
494
|
type DisplayTextComponent = ForwardRefComponent<'h2', DisplayTextOptions>;
|
|
487
495
|
/**
|
|
@@ -492,288 +500,296 @@ type DisplayTextProps = PropsOf<DisplayTextComponent>;
|
|
|
492
500
|
* @deprecated Use Tailwind CSS instead.
|
|
493
501
|
*/
|
|
494
502
|
declare const DisplayText: DisplayTextComponent;
|
|
495
|
-
|
|
503
|
+
//#endregion
|
|
504
|
+
//#region src/components/checkbox/checkbox.d.ts
|
|
496
505
|
type CheckboxOptions = {
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
506
|
+
/**
|
|
507
|
+
* The label for the checkbox. Accepts a string, or a React component for rendering links within the label.
|
|
508
|
+
*
|
|
509
|
+
* @example
|
|
510
|
+
* ```jsx
|
|
511
|
+
* <Checkbox label="I agree to the terms and conditions" />
|
|
512
|
+
* ```
|
|
513
|
+
*
|
|
514
|
+
* @example
|
|
515
|
+
* ```jsx
|
|
516
|
+
* <Checkbox
|
|
517
|
+
* label={
|
|
518
|
+
* <>
|
|
519
|
+
* I agree to <Link href="/terms">the terms and conditions</Link>
|
|
520
|
+
* </>
|
|
521
|
+
* }
|
|
522
|
+
* />
|
|
523
|
+
* ```
|
|
524
|
+
*/
|
|
525
|
+
label: string | ReactElement<unknown>;
|
|
526
|
+
/**
|
|
527
|
+
* Text that provides additional guidance to the user
|
|
528
|
+
*/
|
|
529
|
+
helperText?: string;
|
|
530
|
+
/**
|
|
531
|
+
* The checked state of the checkbox when it is initially rendered. Use when you do not need to control its checked state.
|
|
532
|
+
*/
|
|
533
|
+
isDefaultChecked?: boolean;
|
|
534
|
+
/**
|
|
535
|
+
* The checked state of the checkbox when it is initially rendered. Use when you do not need to control its checked state.
|
|
536
|
+
*/
|
|
537
|
+
defaultChecked?: boolean;
|
|
538
|
+
/**
|
|
539
|
+
* The controlled checked state of the checkbox. Must be used in conjunction with `onCheckedChange`.
|
|
540
|
+
*/
|
|
541
|
+
isChecked?: boolean;
|
|
542
|
+
/**
|
|
543
|
+
* The controlled checked state of the checkbox. Must be used in conjunction with `onCheckedChange`.
|
|
544
|
+
*/
|
|
545
|
+
checked?: boolean;
|
|
546
|
+
/**
|
|
547
|
+
* Event handler called when the checked state of the checkbox changes.
|
|
548
|
+
*/
|
|
549
|
+
onCheckedChange?: (checked: boolean) => void;
|
|
550
|
+
/**
|
|
551
|
+
* If `true` the checkbox will render in its invalid state.
|
|
552
|
+
* @default false
|
|
553
|
+
*/
|
|
554
|
+
isInvalid?: boolean;
|
|
555
|
+
/**
|
|
556
|
+
* The error message to display if `isInvalid` is `true`
|
|
557
|
+
*/
|
|
558
|
+
errorMessage?: string;
|
|
559
|
+
/**
|
|
560
|
+
* If `true` it prevents the user from interacting with the checkbox.
|
|
561
|
+
* @default false
|
|
562
|
+
*/
|
|
563
|
+
isDisabled?: boolean;
|
|
564
|
+
/**
|
|
565
|
+
* If `true` the user must check the checkbox before the owning form can be submitted.
|
|
566
|
+
* @default false
|
|
567
|
+
*/
|
|
568
|
+
isRequired?: boolean;
|
|
569
|
+
/**
|
|
570
|
+
* The name of the checkbox. Submitted with its owning form as part of a name/value pair.
|
|
571
|
+
*/
|
|
572
|
+
name?: string;
|
|
573
|
+
/**
|
|
574
|
+
* The value given as data when submitted with a `name`.
|
|
575
|
+
*/
|
|
576
|
+
value?: string;
|
|
568
577
|
};
|
|
569
578
|
type CheckboxProps = Omit<Checkbox$1.CheckboxProps, 'asChild' | 'children' | 'checked' | 'defaultChecked' | keyof CheckboxOptions> & CheckboxOptions;
|
|
570
|
-
declare const Checkbox: react.ForwardRefExoticComponent<Omit<Checkbox$1.CheckboxProps, "children" | "asChild" | keyof CheckboxOptions> & CheckboxOptions & react.RefAttributes<HTMLButtonElement>>;
|
|
571
|
-
|
|
579
|
+
declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<Checkbox$1.CheckboxProps, "children" | "asChild" | keyof CheckboxOptions> & CheckboxOptions & import("react").RefAttributes<HTMLButtonElement>>;
|
|
580
|
+
//#endregion
|
|
581
|
+
//#region src/components/divider/divider.d.ts
|
|
572
582
|
type DividerOptions = {
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
583
|
+
/**
|
|
584
|
+
* The orientation of the divider.
|
|
585
|
+
*
|
|
586
|
+
* @default 'horizontal'
|
|
587
|
+
*/
|
|
588
|
+
orientation?: 'horizontal' | 'vertical';
|
|
579
589
|
};
|
|
580
590
|
type DividerProps = {} & HTMLQdsProps<'span'> & DividerOptions;
|
|
581
|
-
declare const Divider: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & DividerOptions & react.RefAttributes<HTMLSpanElement>>;
|
|
582
|
-
|
|
591
|
+
declare const Divider: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & DividerOptions & import("react").RefAttributes<HTMLSpanElement>>;
|
|
592
|
+
//#endregion
|
|
593
|
+
//#region src/components/dropdown-menu/dropdown-menu-content.d.ts
|
|
583
594
|
type PrimitiveContentProps = DropdownMenu$1.DropdownMenuContentProps;
|
|
584
595
|
type DropdownMenuContentOptions = {
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
634
|
-
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
596
|
+
/**
|
|
597
|
+
* Event handler called when focus moves to the trigger after closing.
|
|
598
|
+
* It can be prevented by calling `event.preventDefault`.
|
|
599
|
+
*/
|
|
600
|
+
onCloseAutofocus?: PrimitiveContentProps['onCloseAutoFocus'];
|
|
601
|
+
/**
|
|
602
|
+
* Event handler called when the escape key is down.
|
|
603
|
+
* It can be prevented by calling `event.preventDefault`.
|
|
604
|
+
*/
|
|
605
|
+
onEscapeKeyDown?: PrimitiveContentProps['onEscapeKeyDown'];
|
|
606
|
+
/**
|
|
607
|
+
* Event handler called when a pointer event occurs outside the bounds of the component.
|
|
608
|
+
* It can be prevented by calling `event.preventDefault`.
|
|
609
|
+
*/
|
|
610
|
+
onPointerDownOutside?: PrimitiveContentProps['onPointerDownOutside'];
|
|
611
|
+
/**
|
|
612
|
+
* Event handler called when focus moves outside the bounds of the component.
|
|
613
|
+
* It can be prevented by calling `event.preventDefault`.
|
|
614
|
+
*/
|
|
615
|
+
onFocusOutside?: PrimitiveContentProps['onFocusOutside'];
|
|
616
|
+
/**
|
|
617
|
+
* Event handler called when an interaction (pointer or focus event) happens outside the bounds of the component.
|
|
618
|
+
* It can be prevented by calling `event.preventDefault`.
|
|
619
|
+
*/
|
|
620
|
+
onInteractOutside?: PrimitiveContentProps['onInteractOutside'];
|
|
621
|
+
/**
|
|
622
|
+
* The preferred side of the trigger to render against when open.
|
|
623
|
+
* Will be reversed when collisions occur and `avoidCollisions` is enabled.
|
|
624
|
+
*
|
|
625
|
+
* @default "bottom"
|
|
626
|
+
*/
|
|
627
|
+
side?: PrimitiveContentProps['side'];
|
|
628
|
+
/**
|
|
629
|
+
* The distance in pixels from the trigger.
|
|
630
|
+
*
|
|
631
|
+
* @default 8
|
|
632
|
+
*/
|
|
633
|
+
sideOffset?: PrimitiveContentProps['sideOffset'];
|
|
634
|
+
/**
|
|
635
|
+
* The preferred alignment against the trigger. May change when collisions occur.
|
|
636
|
+
*
|
|
637
|
+
* @default "center"
|
|
638
|
+
*/
|
|
639
|
+
align?: PrimitiveContentProps['align'];
|
|
640
|
+
/**
|
|
641
|
+
* The element used as the collision boundary.
|
|
642
|
+
* By default this is the viewport, though you can provide additional element(s) to be included in this check.
|
|
643
|
+
*
|
|
644
|
+
* @default []
|
|
645
|
+
*/
|
|
646
|
+
collisionBoundary?: PrimitiveContentProps['collisionBoundary'];
|
|
647
|
+
/**
|
|
648
|
+
* Whether to hide the content when the trigger becomes fully occluded.
|
|
649
|
+
*
|
|
650
|
+
* @default false
|
|
651
|
+
*/
|
|
652
|
+
hideWhenDetached?: PrimitiveContentProps['hideWhenDetached'];
|
|
642
653
|
};
|
|
643
654
|
type DropdownMenuContentProps = {} & HTMLQdsProps<'div'> & DropdownMenuContentOptions;
|
|
644
|
-
|
|
655
|
+
//#endregion
|
|
656
|
+
//#region src/components/dropdown-menu/dropdown-menu-divider.d.ts
|
|
645
657
|
type DropdownMenuDividerProps = HTMLQdsProps<'div'>;
|
|
646
|
-
|
|
658
|
+
//#endregion
|
|
659
|
+
//#region src/components/dropdown-menu/dropdown-menu-item.d.ts
|
|
647
660
|
type DropdownMenuItemOptions = {
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
661
|
+
/**
|
|
662
|
+
* If `true`, the item will be disabled
|
|
663
|
+
*/
|
|
664
|
+
isDisabled?: boolean;
|
|
665
|
+
/**
|
|
666
|
+
* Event handler called when the user selects an item (via mouse or keyboard).
|
|
667
|
+
* Calling `event.preventDefault` in this handler will prevent the dropdown from closing when selecting that item.
|
|
668
|
+
*/
|
|
669
|
+
onSelect?: (event: Event) => void;
|
|
670
|
+
/**
|
|
671
|
+
* Optional text used for typeahead purposes.
|
|
672
|
+
* By default the typeahead behavior will use the `.textContent` of the item.
|
|
673
|
+
* Use this when the content is complex, or you have non-textual content inside.
|
|
674
|
+
*/
|
|
675
|
+
textValue?: string;
|
|
676
|
+
/**
|
|
677
|
+
* Optional icon to display on the left side of the item content.
|
|
678
|
+
*/
|
|
679
|
+
icon?: ElementType<IconProps>;
|
|
667
680
|
};
|
|
668
681
|
type DropdownMenuItemProps = {} & Omit<DropdownMenu$1.DropdownMenuItemProps, 'asChild' | keyof DropdownMenuItemOptions> & DropdownMenuItemOptions;
|
|
669
|
-
|
|
682
|
+
//#endregion
|
|
683
|
+
//#region src/components/dropdown-menu/dropdown-menu-trigger.d.ts
|
|
670
684
|
type DropdownTriggerComponent = ForwardRefComponent<'button'>;
|
|
671
685
|
type DropdownMenuTriggerProps = PropsOf<DropdownTriggerComponent>;
|
|
672
|
-
|
|
686
|
+
//#endregion
|
|
687
|
+
//#region src/components/dropdown-menu/dropdown-menu.d.ts
|
|
673
688
|
type DropdownMenuRootProps = {
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
689
|
+
children: ReactNode;
|
|
690
|
+
/**
|
|
691
|
+
* If `true` the dropdown menu will be open
|
|
692
|
+
*/
|
|
693
|
+
isOpen?: boolean;
|
|
694
|
+
/**
|
|
695
|
+
* The open state of the submenu when it is initially rendered.
|
|
696
|
+
* Use when you do not need to control its open state.
|
|
697
|
+
*/
|
|
698
|
+
defaultOpen?: boolean;
|
|
699
|
+
/**
|
|
700
|
+
* Callback invoked open state changes
|
|
701
|
+
*/
|
|
702
|
+
onOpenChange?: (isOpen: boolean) => void;
|
|
688
703
|
};
|
|
689
|
-
declare function DropdownMenuRoot(props: DropdownMenuRootProps):
|
|
704
|
+
declare function DropdownMenuRoot(props: DropdownMenuRootProps): import("react/jsx-runtime").JSX.Element;
|
|
690
705
|
declare const DropdownMenu: typeof DropdownMenuRoot & {
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
|
|
730
|
-
|
|
731
|
-
|
|
706
|
+
Trigger: (<As = "button">(props: As extends "" ? {
|
|
707
|
+
as: keyof React.JSX.IntrinsicElements;
|
|
708
|
+
} : As extends import("react").ComponentType<infer P> ? Merge<P, {
|
|
709
|
+
as: As;
|
|
710
|
+
}> : As extends keyof import("react").JSX.IntrinsicElements ? Merge<import("react").JSX.IntrinsicElements[As], {
|
|
711
|
+
as: As;
|
|
712
|
+
}> : never) => React.ReactElement | null) & import("react").ForwardRefExoticComponent<Merge<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
|
|
713
|
+
as?: "button" | undefined;
|
|
714
|
+
}>>;
|
|
715
|
+
Content: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
716
|
+
onCloseAutofocus?: ((event: Event) => void) | undefined;
|
|
717
|
+
onEscapeKeyDown?: ((event: KeyboardEvent) => void) | undefined;
|
|
718
|
+
onPointerDownOutside?: ((event: CustomEvent<{
|
|
719
|
+
originalEvent: PointerEvent;
|
|
720
|
+
}>) => void) | undefined;
|
|
721
|
+
onFocusOutside?: ((event: CustomEvent<{
|
|
722
|
+
originalEvent: FocusEvent;
|
|
723
|
+
}>) => void) | undefined;
|
|
724
|
+
onInteractOutside?: ((event: CustomEvent<{
|
|
725
|
+
originalEvent: PointerEvent;
|
|
726
|
+
}> | CustomEvent<{
|
|
727
|
+
originalEvent: FocusEvent;
|
|
728
|
+
}>) => void) | undefined;
|
|
729
|
+
side?: "top" | "right" | "bottom" | "left" | undefined;
|
|
730
|
+
sideOffset?: number | undefined;
|
|
731
|
+
align?: "center" | "end" | "start" | undefined;
|
|
732
|
+
collisionBoundary?: (Element | null) | (Element | null)[] | undefined;
|
|
733
|
+
hideWhenDetached?: boolean | undefined;
|
|
734
|
+
} & import("react").RefAttributes<HTMLDivElement>>;
|
|
735
|
+
Item: import("react").ForwardRefExoticComponent<Omit<DropdownMenu$1.DropdownMenuItemProps, "asChild" | keyof {
|
|
736
|
+
isDisabled?: boolean;
|
|
737
|
+
onSelect?: (event: Event) => void;
|
|
738
|
+
textValue?: string;
|
|
739
|
+
icon?: import("react").ElementType<IconProps>;
|
|
740
|
+
}> & {
|
|
741
|
+
isDisabled?: boolean;
|
|
742
|
+
onSelect?: (event: Event) => void;
|
|
743
|
+
textValue?: string;
|
|
744
|
+
icon?: import("react").ElementType<IconProps>;
|
|
745
|
+
} & import("react").RefAttributes<HTMLDivElement>>;
|
|
746
|
+
Divider: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
732
747
|
};
|
|
733
|
-
|
|
748
|
+
//#endregion
|
|
749
|
+
//#region src/components/heading/heading.d.ts
|
|
734
750
|
declare const SIZE_CLASSES$4: ResponsiveClassMap<"sm" | "md" | "lg" | "xs" | "2xs" | "3xs">;
|
|
735
751
|
declare const COLOR_CLASSES$2: {
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
752
|
+
readonly default: "text-default";
|
|
753
|
+
readonly strong: "text-strong";
|
|
754
|
+
readonly subtle: "text-subtle";
|
|
755
|
+
readonly disabled: "text-disabled";
|
|
756
|
+
readonly negative: "text-negative";
|
|
757
|
+
readonly warning: "text-warning";
|
|
758
|
+
readonly positive: "text-positive";
|
|
759
|
+
readonly onBrandPrimary: "text-onBrandPrimary";
|
|
760
|
+
readonly onBrandSecondary: "text-onBrandSecondary";
|
|
761
|
+
readonly onBrandTertiary: "text-onBrandTertiary";
|
|
746
762
|
};
|
|
747
763
|
declare const TEXT_ALIGN_CLASSES$1: {
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
764
|
+
readonly left: "text-left";
|
|
765
|
+
readonly center: "text-center";
|
|
766
|
+
readonly right: "text-right";
|
|
751
767
|
};
|
|
752
768
|
type HeadingSize = ResponsiveSize<typeof SIZE_CLASSES$4>;
|
|
753
769
|
type HeadingColor = keyof typeof COLOR_CLASSES$2;
|
|
754
770
|
type HeadingTextAlign = keyof typeof TEXT_ALIGN_CLASSES$1;
|
|
755
771
|
type HeadingOptions = {
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
|
|
765
|
-
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
|
|
769
|
-
|
|
770
|
-
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
|
|
772
|
+
/**
|
|
773
|
+
* Sets the visual size of the heading.
|
|
774
|
+
* To override the rendered tag, use the `as` prop.
|
|
775
|
+
*
|
|
776
|
+
* @default 'md'
|
|
777
|
+
*/
|
|
778
|
+
size?: ResponsiveProp<HeadingSize>;
|
|
779
|
+
/**
|
|
780
|
+
* Sets the color of the heading
|
|
781
|
+
* @default 'default'
|
|
782
|
+
*/
|
|
783
|
+
color?: HeadingColor;
|
|
784
|
+
/**
|
|
785
|
+
* Truncates the heading after a specific number of lines
|
|
786
|
+
*/
|
|
787
|
+
numberOfLines?: number;
|
|
788
|
+
/**
|
|
789
|
+
* Alignment of the heading
|
|
790
|
+
* @default 'left'
|
|
791
|
+
*/
|
|
792
|
+
textAlign?: HeadingTextAlign;
|
|
777
793
|
};
|
|
778
794
|
type HeadingComponent = ForwardRefComponent<'h2', HeadingOptions>;
|
|
779
795
|
/**
|
|
@@ -784,204 +800,212 @@ type HeadingProps = PropsOf<HeadingComponent>;
|
|
|
784
800
|
* @deprecated Use Tailwind CSS instead.
|
|
785
801
|
*/
|
|
786
802
|
declare const Heading: HeadingComponent;
|
|
787
|
-
|
|
803
|
+
//#endregion
|
|
804
|
+
//#region src/components/hint-box/hint-box.d.ts
|
|
788
805
|
type HintBoxTitleProps = HTMLQdsProps<'p'>;
|
|
789
806
|
type HintBoxProps = HTMLQdsProps<'aside'>;
|
|
790
|
-
declare const HintBox: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & react.RefAttributes<HTMLElement>> & {
|
|
791
|
-
|
|
807
|
+
declare const HintBox: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import("react").RefAttributes<HTMLElement>> & {
|
|
808
|
+
Title: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
|
|
792
809
|
};
|
|
793
|
-
|
|
810
|
+
//#endregion
|
|
811
|
+
//#region src/components/icon-button/icon-button.d.ts
|
|
794
812
|
declare const SIZE_CLASSES$3: ResponsiveClassMap<"sm" | "md" | "xs">;
|
|
795
813
|
declare const iconButtonVariants: (props?: ({
|
|
796
|
-
|
|
797
|
-
} &
|
|
814
|
+
variant?: "primary" | "secondary" | "tertiary" | "danger" | "ghost" | "white" | null | undefined;
|
|
815
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
798
816
|
type IconButtonSize = ResponsiveSize<typeof SIZE_CLASSES$3>;
|
|
799
817
|
type IconButtonVariant = NonNullable<VariantProps<typeof iconButtonVariants>['variant']>;
|
|
800
818
|
type IconButtonOptions = {
|
|
801
|
-
|
|
802
|
-
|
|
803
|
-
|
|
804
|
-
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
|
|
817
|
-
|
|
819
|
+
icon: ElementType<IconProps>;
|
|
820
|
+
/**
|
|
821
|
+
* A visually hidden label read by screen readers.
|
|
822
|
+
*/
|
|
823
|
+
label: string;
|
|
824
|
+
/**
|
|
825
|
+
* Defines the size of the button
|
|
826
|
+
*/
|
|
827
|
+
size?: ResponsiveProp<IconButtonSize>;
|
|
828
|
+
/**
|
|
829
|
+
* Sets the style variant of the button
|
|
830
|
+
*/
|
|
831
|
+
variant?: IconButtonVariant;
|
|
832
|
+
/**
|
|
833
|
+
* If `true` the button will be disabled
|
|
834
|
+
*/
|
|
835
|
+
isDisabled?: boolean;
|
|
818
836
|
};
|
|
819
837
|
type IconButtonComponent = ForwardRefComponent<'button', IconButtonOptions>;
|
|
820
838
|
type IconButtonProps = PropsOf<IconButtonComponent>;
|
|
821
839
|
declare const IconButton: IconButtonComponent;
|
|
822
|
-
|
|
840
|
+
//#endregion
|
|
841
|
+
//#region src/components/primitives/input-base/input-base.d.ts
|
|
823
842
|
type InputBaseOptions = {
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
843
|
+
/**
|
|
844
|
+
* If `true`, the input will be invalid
|
|
845
|
+
*/
|
|
846
|
+
isInvalid?: boolean;
|
|
847
|
+
/**
|
|
848
|
+
* If `true`, the input will be disabled
|
|
849
|
+
*/
|
|
850
|
+
isDisabled?: boolean;
|
|
851
|
+
/**
|
|
852
|
+
* If `true` the input will be required
|
|
853
|
+
*/
|
|
854
|
+
isRequired?: boolean;
|
|
836
855
|
};
|
|
837
856
|
type OmittedProps$8 = 'children' | 'readOnly' | 'size' | 'disabled' | 'required';
|
|
838
857
|
type InputBaseProps = {} & Omit<HTMLQdsProps<'input'>, OmittedProps$8> & InputBaseOptions;
|
|
839
|
-
declare const InputBase: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, OmittedProps$8> & InputBaseOptions & react.RefAttributes<HTMLInputElement>>;
|
|
840
|
-
|
|
858
|
+
declare const InputBase: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, OmittedProps$8> & InputBaseOptions & import("react").RefAttributes<HTMLInputElement>>;
|
|
859
|
+
//#endregion
|
|
860
|
+
//#region src/components/text-field/text-field.d.ts
|
|
841
861
|
type TextFieldOptions = {
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
|
|
861
|
-
|
|
862
|
-
|
|
863
|
-
|
|
862
|
+
/**
|
|
863
|
+
* The label for the input
|
|
864
|
+
*/
|
|
865
|
+
label: string;
|
|
866
|
+
/**
|
|
867
|
+
* The error message to display if `isInvalid` is `true`
|
|
868
|
+
*/
|
|
869
|
+
errorMessage?: string;
|
|
870
|
+
/**
|
|
871
|
+
* If `true`, the input will display an optional indicator.
|
|
872
|
+
* If the `isRequired` prop is also `true`, this prop will be ignored.
|
|
873
|
+
*/
|
|
874
|
+
isOptional?: boolean;
|
|
875
|
+
/**
|
|
876
|
+
* Text that provides additional guidance to the user
|
|
877
|
+
*/
|
|
878
|
+
helperText?: string;
|
|
879
|
+
/**
|
|
880
|
+
* Suffixed text to display after the input.
|
|
881
|
+
* This is useful for e.g. displaying units of measurement.
|
|
882
|
+
*/
|
|
883
|
+
suffix?: string;
|
|
864
884
|
} & InputBaseOptions;
|
|
865
885
|
type OmittedProps$7 = 'children' | 'readOnly' | 'size';
|
|
866
886
|
type TextFieldProps = {} & Omit<HTMLQdsProps<'input'>, OmittedProps$7> & TextFieldOptions;
|
|
867
|
-
declare const TextField: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, OmittedProps$7> & {
|
|
868
|
-
|
|
869
|
-
|
|
870
|
-
|
|
871
|
-
|
|
872
|
-
|
|
873
|
-
|
|
874
|
-
|
|
875
|
-
|
|
876
|
-
|
|
877
|
-
|
|
878
|
-
|
|
879
|
-
|
|
880
|
-
|
|
881
|
-
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
885
|
-
|
|
886
|
-
|
|
887
|
-
|
|
888
|
-
|
|
889
|
-
|
|
890
|
-
} & InputBaseOptions & react.RefAttributes<HTMLInputElement>>;
|
|
891
|
-
|
|
887
|
+
declare const TextField: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, OmittedProps$7> & {
|
|
888
|
+
/**
|
|
889
|
+
* The label for the input
|
|
890
|
+
*/
|
|
891
|
+
label: string;
|
|
892
|
+
/**
|
|
893
|
+
* The error message to display if `isInvalid` is `true`
|
|
894
|
+
*/
|
|
895
|
+
errorMessage?: string;
|
|
896
|
+
/**
|
|
897
|
+
* If `true`, the input will display an optional indicator.
|
|
898
|
+
* If the `isRequired` prop is also `true`, this prop will be ignored.
|
|
899
|
+
*/
|
|
900
|
+
isOptional?: boolean;
|
|
901
|
+
/**
|
|
902
|
+
* Text that provides additional guidance to the user
|
|
903
|
+
*/
|
|
904
|
+
helperText?: string;
|
|
905
|
+
/**
|
|
906
|
+
* Suffixed text to display after the input.
|
|
907
|
+
* This is useful for e.g. displaying units of measurement.
|
|
908
|
+
*/
|
|
909
|
+
suffix?: string;
|
|
910
|
+
} & InputBaseOptions & import("react").RefAttributes<HTMLInputElement>>;
|
|
911
|
+
//#endregion
|
|
912
|
+
//#region src/components/label/label.d.ts
|
|
892
913
|
declare const SIZE_CLASSES$2: ResponsiveClassMap<"sm" | "md">;
|
|
893
914
|
declare const COLOR_CLASSES$1: {
|
|
894
|
-
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
|
|
898
|
-
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
902
|
-
|
|
903
|
-
|
|
915
|
+
readonly strong: "text-strong";
|
|
916
|
+
readonly default: "text-default";
|
|
917
|
+
readonly subtle: "text-subtle";
|
|
918
|
+
readonly disabled: "text-disabled";
|
|
919
|
+
readonly negative: "text-negative";
|
|
920
|
+
readonly warning: "text-warning";
|
|
921
|
+
readonly positive: "text-positive";
|
|
922
|
+
readonly onBrandPrimary: "text-onBrandPrimary";
|
|
923
|
+
readonly onBrandSecondary: "text-onBrandSecondary";
|
|
924
|
+
readonly onBrandTertiary: "text-onBrandTertiary";
|
|
904
925
|
};
|
|
905
926
|
type LabelSize = ResponsiveSize<typeof SIZE_CLASSES$2>;
|
|
906
927
|
type LabelColor = keyof typeof COLOR_CLASSES$1;
|
|
907
928
|
type LabelOptions = {
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
|
|
914
|
-
|
|
915
|
-
|
|
916
|
-
|
|
929
|
+
/**
|
|
930
|
+
* Size of the label
|
|
931
|
+
*/
|
|
932
|
+
size?: ResponsiveProp<LabelSize>;
|
|
933
|
+
/**
|
|
934
|
+
* Sets the color of the label
|
|
935
|
+
* @default 'default'
|
|
936
|
+
*/
|
|
937
|
+
color?: LabelColor;
|
|
917
938
|
};
|
|
918
939
|
type LabelComponent = ForwardRefComponent<'label', LabelOptions>;
|
|
919
940
|
type LabelProps = PropsOf<LabelComponent>;
|
|
920
941
|
declare const Label: LabelComponent;
|
|
921
|
-
|
|
942
|
+
//#endregion
|
|
943
|
+
//#region src/components/link/link.d.ts
|
|
922
944
|
type LinkOptions = {
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
|
|
945
|
+
/**
|
|
946
|
+
* The URL to link to.
|
|
947
|
+
*/
|
|
948
|
+
href?: string;
|
|
949
|
+
/**
|
|
950
|
+
* If `true`, the link will open in new tab
|
|
951
|
+
*/
|
|
952
|
+
isExternal?: boolean;
|
|
931
953
|
};
|
|
932
954
|
type LinkComponent = ForwardRefComponent<'a', LinkOptions>;
|
|
933
955
|
type LinkProps = PropsOf<LinkComponent>;
|
|
934
956
|
declare const Link: LinkComponent;
|
|
935
|
-
|
|
957
|
+
//#endregion
|
|
958
|
+
//#region src/components/loading-dots/loading-dots.d.ts
|
|
936
959
|
declare const SIZE_CLASSES$1: ResponsiveClassMap<"sm" | "md">;
|
|
937
960
|
type LoadingDotsSize = ResponsiveSize<typeof SIZE_CLASSES$1>;
|
|
938
961
|
type LoadingDotsOptions = {
|
|
939
|
-
|
|
962
|
+
size?: ResponsiveProp<LoadingDotsSize>;
|
|
940
963
|
};
|
|
941
964
|
type LoadingDotsProps = {} & HTMLQdsProps<'span'> & LoadingDotsOptions;
|
|
942
|
-
declare const LoadingDots: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & LoadingDotsOptions & react.RefAttributes<HTMLSpanElement>>;
|
|
943
|
-
|
|
965
|
+
declare const LoadingDots: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & LoadingDotsOptions & import("react").RefAttributes<HTMLSpanElement>>;
|
|
966
|
+
//#endregion
|
|
967
|
+
//#region src/components/paragraph/paragraph.d.ts
|
|
944
968
|
declare const SIZE_CLASSES: ResponsiveClassMap<"sm" | "md" | "lg" | "xl" | "xs">;
|
|
945
969
|
declare const COLOR_CLASSES: {
|
|
946
|
-
|
|
947
|
-
|
|
948
|
-
|
|
949
|
-
|
|
950
|
-
|
|
951
|
-
|
|
952
|
-
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
|
|
970
|
+
readonly default: "text-default";
|
|
971
|
+
readonly strong: "text-strong";
|
|
972
|
+
readonly subtle: "text-subtle";
|
|
973
|
+
readonly disabled: "text-disabled";
|
|
974
|
+
readonly negative: "text-negative";
|
|
975
|
+
readonly warning: "text-warning";
|
|
976
|
+
readonly positive: "text-positive";
|
|
977
|
+
readonly onBrandPrimary: "text-onBrandPrimary";
|
|
978
|
+
readonly onBrandSecondary: "text-onBrandSecondary";
|
|
979
|
+
readonly onBrandTertiary: "text-onBrandTertiary";
|
|
956
980
|
};
|
|
957
981
|
declare const TEXT_ALIGN_CLASSES: {
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
|
|
982
|
+
readonly left: "text-left";
|
|
983
|
+
readonly center: "text-center";
|
|
984
|
+
readonly right: "text-right";
|
|
961
985
|
};
|
|
962
986
|
type ParagraphSize = ResponsiveSize<typeof SIZE_CLASSES>;
|
|
963
987
|
type ParagraphColor = keyof typeof COLOR_CLASSES;
|
|
964
988
|
type ParagraphTextAlign = keyof typeof TEXT_ALIGN_CLASSES;
|
|
965
989
|
type ParagraphOptions = {
|
|
966
|
-
|
|
967
|
-
|
|
968
|
-
|
|
969
|
-
|
|
970
|
-
|
|
971
|
-
|
|
972
|
-
|
|
973
|
-
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
|
|
977
|
-
|
|
978
|
-
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
|
|
984
|
-
|
|
990
|
+
/**
|
|
991
|
+
* Sets the visual size of the text
|
|
992
|
+
* @default 'md'
|
|
993
|
+
*/
|
|
994
|
+
size?: ResponsiveProp<ParagraphSize>;
|
|
995
|
+
/**
|
|
996
|
+
* Sets the color of the text
|
|
997
|
+
* @default 'normal'
|
|
998
|
+
*/
|
|
999
|
+
color?: ParagraphColor;
|
|
1000
|
+
/**
|
|
1001
|
+
* Truncates the text after a specific number of lines
|
|
1002
|
+
*/
|
|
1003
|
+
numberOfLines?: number;
|
|
1004
|
+
/**
|
|
1005
|
+
* Alignment of the paragraph
|
|
1006
|
+
* @default 'left'
|
|
1007
|
+
*/
|
|
1008
|
+
textAlign?: ParagraphTextAlign;
|
|
985
1009
|
};
|
|
986
1010
|
type ParagraphComponent = ForwardRefComponent<'p', ParagraphOptions>;
|
|
987
1011
|
/**
|
|
@@ -992,228 +1016,237 @@ type ParagraphProps = PropsOf<ParagraphComponent>;
|
|
|
992
1016
|
* @deprecated Use Tailwind CSS instead.
|
|
993
1017
|
*/
|
|
994
1018
|
declare const Paragraph: ParagraphComponent;
|
|
995
|
-
|
|
1019
|
+
//#endregion
|
|
1020
|
+
//#region src/components/primitives/select-base/select-base.d.ts
|
|
996
1021
|
type SelectBaseOptions = {
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
|
|
1000
|
-
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
|
|
1004
|
-
|
|
1005
|
-
|
|
1006
|
-
|
|
1007
|
-
|
|
1008
|
-
|
|
1009
|
-
|
|
1010
|
-
|
|
1011
|
-
|
|
1012
|
-
|
|
1013
|
-
|
|
1014
|
-
|
|
1015
|
-
|
|
1016
|
-
|
|
1017
|
-
|
|
1022
|
+
/**
|
|
1023
|
+
* The placeholder for the select. We render an `<option/>` element that has
|
|
1024
|
+
* empty value.
|
|
1025
|
+
*
|
|
1026
|
+
* ```jsx
|
|
1027
|
+
* <option value="">{placeholder}</option>
|
|
1028
|
+
* ```
|
|
1029
|
+
*/
|
|
1030
|
+
placeholder?: string;
|
|
1031
|
+
/**
|
|
1032
|
+
* If `true`, the select will be invalid
|
|
1033
|
+
*/
|
|
1034
|
+
isInvalid?: boolean;
|
|
1035
|
+
/**
|
|
1036
|
+
* If `true`, the select will be disabled
|
|
1037
|
+
*/
|
|
1038
|
+
isDisabled?: boolean;
|
|
1039
|
+
/**
|
|
1040
|
+
* If `true` the select will be required
|
|
1041
|
+
*/
|
|
1042
|
+
isRequired?: boolean;
|
|
1018
1043
|
};
|
|
1019
1044
|
type OmittedProps$6 = 'readOnly' | 'size' | 'multiple' | 'disabled' | 'required';
|
|
1020
|
-
declare const SelectBase: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, "ref">, OmittedProps$6> & SelectBaseOptions & react.RefAttributes<HTMLSelectElement>>;
|
|
1021
|
-
|
|
1045
|
+
declare const SelectBase: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, "ref">, OmittedProps$6> & SelectBaseOptions & import("react").RefAttributes<HTMLSelectElement>>;
|
|
1046
|
+
//#endregion
|
|
1047
|
+
//#region src/components/primitives/textarea-base/textarea-base.d.ts
|
|
1022
1048
|
type ResizeProp = 'none' | 'both' | 'horizontal' | 'vertical';
|
|
1023
1049
|
type TextareaBaseOptions = {
|
|
1024
|
-
|
|
1025
|
-
|
|
1026
|
-
|
|
1027
|
-
|
|
1028
|
-
|
|
1029
|
-
|
|
1030
|
-
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
|
|
1036
|
-
|
|
1037
|
-
|
|
1038
|
-
|
|
1039
|
-
|
|
1040
|
-
|
|
1041
|
-
|
|
1042
|
-
|
|
1043
|
-
|
|
1044
|
-
|
|
1045
|
-
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
|
|
1050
|
+
/**
|
|
1051
|
+
* If `true`, the textarea will be invalid
|
|
1052
|
+
*/
|
|
1053
|
+
isInvalid?: boolean;
|
|
1054
|
+
/**
|
|
1055
|
+
* If `true`, the textarea will be disabled
|
|
1056
|
+
*/
|
|
1057
|
+
isDisabled?: boolean;
|
|
1058
|
+
/**
|
|
1059
|
+
* If `true` the textarea will be required
|
|
1060
|
+
*/
|
|
1061
|
+
isRequired?: boolean;
|
|
1062
|
+
/**
|
|
1063
|
+
* The resize behavior of the textarea
|
|
1064
|
+
*
|
|
1065
|
+
* @default 'vertical'
|
|
1066
|
+
*/
|
|
1067
|
+
resize?: ResizeProp;
|
|
1068
|
+
/**
|
|
1069
|
+
* The minimum number of rows to display without requiring scrolling or resizing.
|
|
1070
|
+
* To disabled resizing use the `resize` prop.
|
|
1071
|
+
*
|
|
1072
|
+
* @default 3
|
|
1073
|
+
*/
|
|
1074
|
+
minRows?: number;
|
|
1049
1075
|
};
|
|
1050
1076
|
type OmittedProps$5 = 'children' | 'readOnly' | 'size' | 'disabled' | 'required' | 'rows' | 'cols';
|
|
1051
1077
|
type TextareaBaseProps = {} & Omit<HTMLQdsProps<'textarea'>, OmittedProps$5> & TextareaBaseOptions;
|
|
1052
|
-
declare const TextareaBase: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref">, OmittedProps$5> & TextareaBaseOptions & react.RefAttributes<HTMLTextAreaElement>>;
|
|
1053
|
-
|
|
1078
|
+
declare const TextareaBase: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref">, OmittedProps$5> & TextareaBaseOptions & import("react").RefAttributes<HTMLTextAreaElement>>;
|
|
1079
|
+
//#endregion
|
|
1080
|
+
//#region src/components/radio-group/radio-card/radio-card.d.ts
|
|
1054
1081
|
type RadioCardOptions = {
|
|
1055
|
-
|
|
1056
|
-
|
|
1057
|
-
|
|
1058
|
-
|
|
1059
|
-
|
|
1060
|
-
|
|
1061
|
-
|
|
1062
|
-
|
|
1063
|
-
|
|
1064
|
-
|
|
1065
|
-
|
|
1066
|
-
|
|
1067
|
-
|
|
1068
|
-
|
|
1069
|
-
|
|
1070
|
-
|
|
1071
|
-
|
|
1072
|
-
|
|
1082
|
+
/**
|
|
1083
|
+
* The label for the radio card
|
|
1084
|
+
*/
|
|
1085
|
+
label: string;
|
|
1086
|
+
/**
|
|
1087
|
+
* Text that provides additional guidance to the user
|
|
1088
|
+
*/
|
|
1089
|
+
helperText?: string;
|
|
1090
|
+
/**
|
|
1091
|
+
* If `true` the user must check the radio item before the owning form can be submitted.
|
|
1092
|
+
* @default false
|
|
1093
|
+
*/
|
|
1094
|
+
isRequired?: boolean;
|
|
1095
|
+
/**
|
|
1096
|
+
* If `true` it prevents the user from interacting with the radio item.
|
|
1097
|
+
* @default false
|
|
1098
|
+
*/
|
|
1099
|
+
isDisabled?: boolean;
|
|
1073
1100
|
};
|
|
1074
1101
|
type RadioCardProps = {} & Omit<RadioGroup$1.RadioGroupItemProps, 'asChild' | keyof RadioCardOptions> & RadioCardOptions;
|
|
1075
|
-
|
|
1102
|
+
//#endregion
|
|
1103
|
+
//#region src/components/radio-group/radio-button/radio-button.d.ts
|
|
1076
1104
|
type RadioButtonOptions = {
|
|
1077
|
-
|
|
1078
|
-
|
|
1079
|
-
|
|
1080
|
-
|
|
1081
|
-
|
|
1082
|
-
|
|
1083
|
-
|
|
1084
|
-
|
|
1085
|
-
|
|
1086
|
-
|
|
1087
|
-
|
|
1088
|
-
|
|
1089
|
-
|
|
1090
|
-
|
|
1105
|
+
/**
|
|
1106
|
+
* The label for the radio button
|
|
1107
|
+
*/
|
|
1108
|
+
label: string;
|
|
1109
|
+
/**
|
|
1110
|
+
* If `true` the user must check the radio item before the owning form can be submitted.
|
|
1111
|
+
* @default false
|
|
1112
|
+
*/
|
|
1113
|
+
isRequired?: boolean;
|
|
1114
|
+
/**
|
|
1115
|
+
* If `true` it prevents the user from interacting with the radio item.
|
|
1116
|
+
* @default false
|
|
1117
|
+
*/
|
|
1118
|
+
isDisabled?: boolean;
|
|
1091
1119
|
};
|
|
1092
1120
|
type RadioButtonProps = {} & Omit<RadioGroup$1.RadioGroupItemProps, 'asChild' | keyof RadioButtonOptions> & RadioButtonOptions;
|
|
1093
|
-
|
|
1121
|
+
//#endregion
|
|
1122
|
+
//#region src/components/radio-group/radio-group-label.d.ts
|
|
1094
1123
|
type RadioGroupLabelProps = HTMLQdsProps<'span'>;
|
|
1095
|
-
|
|
1124
|
+
//#endregion
|
|
1125
|
+
//#region src/components/radio-group/radio-group.d.ts
|
|
1096
1126
|
type RadioGroupOptions = {
|
|
1097
|
-
|
|
1098
|
-
|
|
1099
|
-
|
|
1100
|
-
|
|
1101
|
-
|
|
1102
|
-
|
|
1103
|
-
|
|
1104
|
-
|
|
1105
|
-
|
|
1106
|
-
|
|
1107
|
-
|
|
1108
|
-
|
|
1109
|
-
|
|
1110
|
-
|
|
1111
|
-
|
|
1112
|
-
|
|
1113
|
-
|
|
1114
|
-
|
|
1115
|
-
|
|
1116
|
-
|
|
1117
|
-
|
|
1118
|
-
|
|
1119
|
-
|
|
1120
|
-
|
|
1121
|
-
|
|
1122
|
-
|
|
1123
|
-
|
|
1124
|
-
|
|
1125
|
-
|
|
1126
|
-
|
|
1127
|
-
|
|
1128
|
-
|
|
1129
|
-
|
|
1130
|
-
|
|
1131
|
-
|
|
1132
|
-
|
|
1133
|
-
|
|
1127
|
+
/**
|
|
1128
|
+
* The value of the radio item that should be checked when initially rendered.
|
|
1129
|
+
* Use when you do not need to control the state of the radio items.
|
|
1130
|
+
*/
|
|
1131
|
+
defaultValue?: string;
|
|
1132
|
+
/**
|
|
1133
|
+
* The controlled value of the radio item to check.
|
|
1134
|
+
* Should be used in conjunction with `onValueChange`.
|
|
1135
|
+
*/
|
|
1136
|
+
value?: string;
|
|
1137
|
+
/**
|
|
1138
|
+
* Event handler called when the value changes.
|
|
1139
|
+
*/
|
|
1140
|
+
onValueChange?: (value: string) => void;
|
|
1141
|
+
/**
|
|
1142
|
+
* The name of the group. Submitted with its owning form as part of a name/value pair.
|
|
1143
|
+
*/
|
|
1144
|
+
name?: string;
|
|
1145
|
+
/**
|
|
1146
|
+
* If `true` all child radio items will be disabled.
|
|
1147
|
+
* @default false
|
|
1148
|
+
*/
|
|
1149
|
+
isDisabled?: boolean;
|
|
1150
|
+
/**
|
|
1151
|
+
* If `true` the user must check a radio item before the owning form can be submitted.
|
|
1152
|
+
* @default false
|
|
1153
|
+
*/
|
|
1154
|
+
isRequired?: boolean;
|
|
1155
|
+
/**
|
|
1156
|
+
* If `true` the radio group will be invalid.
|
|
1157
|
+
* @default false
|
|
1158
|
+
*/
|
|
1159
|
+
isInvalid?: boolean;
|
|
1160
|
+
/**
|
|
1161
|
+
* The error message to display if `isInvalid` is `true`
|
|
1162
|
+
*/
|
|
1163
|
+
errorMessage?: string;
|
|
1134
1164
|
};
|
|
1135
1165
|
type RadioGroupProps = {} & Omit<RadioGroup$1.RadioGroupProps, 'asChild' | keyof RadioGroupOptions> & RadioGroupOptions;
|
|
1136
|
-
declare const RadioGroup: react.ForwardRefExoticComponent<Omit<RadioGroup$1.RadioGroupProps, "asChild" | keyof RadioGroupOptions> & RadioGroupOptions & react.RefAttributes<HTMLDivElement>> & {
|
|
1137
|
-
|
|
1138
|
-
|
|
1139
|
-
|
|
1140
|
-
|
|
1141
|
-
|
|
1142
|
-
|
|
1143
|
-
|
|
1144
|
-
|
|
1145
|
-
|
|
1146
|
-
|
|
1147
|
-
|
|
1148
|
-
|
|
1149
|
-
|
|
1150
|
-
|
|
1151
|
-
|
|
1152
|
-
|
|
1153
|
-
|
|
1154
|
-
|
|
1155
|
-
|
|
1156
|
-
|
|
1157
|
-
|
|
1166
|
+
declare const RadioGroup: import("react").ForwardRefExoticComponent<Omit<RadioGroup$1.RadioGroupProps, "asChild" | keyof RadioGroupOptions> & RadioGroupOptions & import("react").RefAttributes<HTMLDivElement>> & {
|
|
1167
|
+
Card: import("react").ForwardRefExoticComponent<Omit<RadioGroup$1.RadioGroupItemProps, "asChild" | keyof {
|
|
1168
|
+
label: string;
|
|
1169
|
+
helperText?: string;
|
|
1170
|
+
isRequired?: boolean;
|
|
1171
|
+
isDisabled?: boolean;
|
|
1172
|
+
}> & {
|
|
1173
|
+
label: string;
|
|
1174
|
+
helperText?: string;
|
|
1175
|
+
isRequired?: boolean;
|
|
1176
|
+
isDisabled?: boolean;
|
|
1177
|
+
} & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1178
|
+
Button: import("react").ForwardRefExoticComponent<Omit<RadioGroup$1.RadioGroupItemProps, "asChild" | keyof {
|
|
1179
|
+
label: string;
|
|
1180
|
+
isRequired?: boolean;
|
|
1181
|
+
isDisabled?: boolean;
|
|
1182
|
+
}> & {
|
|
1183
|
+
label: string;
|
|
1184
|
+
isRequired?: boolean;
|
|
1185
|
+
isDisabled?: boolean;
|
|
1186
|
+
} & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1187
|
+
Label: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
|
|
1158
1188
|
};
|
|
1159
|
-
|
|
1189
|
+
//#endregion
|
|
1190
|
+
//#region src/components/select/select-option.d.ts
|
|
1160
1191
|
type SelectOptionOptions = {
|
|
1161
|
-
|
|
1192
|
+
isDisabled?: boolean;
|
|
1162
1193
|
};
|
|
1163
1194
|
type OmittedProps$4 = 'disabled' | 'label';
|
|
1164
1195
|
type SelectOptionProps = {} & Omit<HTMLQdsProps<'option'>, OmittedProps$4> & SelectOptionOptions;
|
|
1165
|
-
|
|
1196
|
+
//#endregion
|
|
1197
|
+
//#region src/components/select/select.d.ts
|
|
1166
1198
|
type SelectOptions = {
|
|
1167
|
-
|
|
1168
|
-
|
|
1169
|
-
|
|
1170
|
-
|
|
1171
|
-
|
|
1172
|
-
|
|
1173
|
-
|
|
1174
|
-
|
|
1175
|
-
|
|
1176
|
-
|
|
1177
|
-
|
|
1178
|
-
|
|
1179
|
-
|
|
1180
|
-
|
|
1181
|
-
|
|
1182
|
-
|
|
1183
|
-
|
|
1199
|
+
/**
|
|
1200
|
+
* The label for the select field
|
|
1201
|
+
*/
|
|
1202
|
+
label: string;
|
|
1203
|
+
/**
|
|
1204
|
+
* The error message to display if `isInvalid` is `true`
|
|
1205
|
+
*/
|
|
1206
|
+
errorMessage?: string;
|
|
1207
|
+
/**
|
|
1208
|
+
* Text that provides additional guidance to the user
|
|
1209
|
+
*/
|
|
1210
|
+
helperText?: string;
|
|
1211
|
+
/**
|
|
1212
|
+
* If `true`, the select field will display an optional indicator.
|
|
1213
|
+
* If the `isRequired` prop is also `true`, this prop will be ignored.
|
|
1214
|
+
*/
|
|
1215
|
+
isOptional?: boolean;
|
|
1184
1216
|
} & SelectBaseOptions;
|
|
1185
1217
|
type OmittedProps$3 = 'readOnly' | 'size';
|
|
1186
1218
|
type SelectProps = {} & Omit<HTMLQdsProps<'select'>, OmittedProps$3> & SelectOptions;
|
|
1187
|
-
declare const Select: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, "ref">, OmittedProps$3> & {
|
|
1188
|
-
|
|
1189
|
-
|
|
1190
|
-
|
|
1191
|
-
|
|
1192
|
-
|
|
1193
|
-
|
|
1194
|
-
|
|
1195
|
-
|
|
1196
|
-
|
|
1197
|
-
|
|
1198
|
-
|
|
1199
|
-
|
|
1200
|
-
|
|
1201
|
-
|
|
1202
|
-
|
|
1203
|
-
|
|
1204
|
-
|
|
1205
|
-
} & SelectBaseOptions & react.RefAttributes<HTMLSelectElement>> & {
|
|
1206
|
-
|
|
1207
|
-
|
|
1208
|
-
|
|
1219
|
+
declare const Select: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, "ref">, OmittedProps$3> & {
|
|
1220
|
+
/**
|
|
1221
|
+
* The label for the select field
|
|
1222
|
+
*/
|
|
1223
|
+
label: string;
|
|
1224
|
+
/**
|
|
1225
|
+
* The error message to display if `isInvalid` is `true`
|
|
1226
|
+
*/
|
|
1227
|
+
errorMessage?: string;
|
|
1228
|
+
/**
|
|
1229
|
+
* Text that provides additional guidance to the user
|
|
1230
|
+
*/
|
|
1231
|
+
helperText?: string;
|
|
1232
|
+
/**
|
|
1233
|
+
* If `true`, the select field will display an optional indicator.
|
|
1234
|
+
* If the `isRequired` prop is also `true`, this prop will be ignored.
|
|
1235
|
+
*/
|
|
1236
|
+
isOptional?: boolean;
|
|
1237
|
+
} & SelectBaseOptions & import("react").RefAttributes<HTMLSelectElement>> & {
|
|
1238
|
+
Option: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>, "ref">, "label" | "disabled"> & {
|
|
1239
|
+
isDisabled?: boolean;
|
|
1240
|
+
} & import("react").RefAttributes<HTMLOptionElement>>;
|
|
1209
1241
|
};
|
|
1210
|
-
|
|
1242
|
+
//#endregion
|
|
1243
|
+
//#region src/components/spacer/spacer.d.ts
|
|
1211
1244
|
declare const X_SIZE_CLASSES: ResponsiveClassMap<"0x" | "1x" | "2x" | "3x" | "4x" | "5x" | "6x" | "8x" | "10x" | "12x" | "14x" | "16x" | "20x" | "24x">;
|
|
1212
1245
|
declare const Y_SIZE_CLASSES: ResponsiveClassMap<"0x" | "1x" | "2x" | "3x" | "4x" | "5x" | "6x" | "8x" | "10x" | "12x" | "14x" | "16x" | "20x" | "24x">;
|
|
1213
1246
|
type Spacing = ResponsiveSize<typeof X_SIZE_CLASSES> & ResponsiveSize<typeof Y_SIZE_CLASSES>;
|
|
1214
1247
|
type SpacerOptions = {
|
|
1215
|
-
|
|
1216
|
-
|
|
1248
|
+
axis?: 'x' | 'y';
|
|
1249
|
+
size: ResponsiveProp<Spacing>;
|
|
1217
1250
|
};
|
|
1218
1251
|
/**
|
|
1219
1252
|
* @deprecated
|
|
@@ -1222,16 +1255,17 @@ type SpacerProps = {} & HTMLQdsProps<'span'> & SpacerOptions;
|
|
|
1222
1255
|
/**
|
|
1223
1256
|
* @deprecated Use Tailwind CSS instead.
|
|
1224
1257
|
*/
|
|
1225
|
-
declare const Spacer: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & SpacerOptions & react.RefAttributes<HTMLSpanElement>>;
|
|
1226
|
-
|
|
1227
|
-
|
|
1228
|
-
declare const
|
|
1229
|
-
declare const
|
|
1258
|
+
declare const Spacer: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & SpacerOptions & import("react").RefAttributes<HTMLSpanElement>>;
|
|
1259
|
+
//#endregion
|
|
1260
|
+
//#region src/components/stack/stack.d.ts
|
|
1261
|
+
declare const DIRECTION_CLASSES: ResponsiveClassMap<"row" | "row-reverse" | "column" | "column-reverse">;
|
|
1262
|
+
declare const JUSTIFY_CONTENT_CLASSES: ResponsiveClassMap<"center" | "flex-start" | "flex-end" | "space-between" | "space-around" | "space-evenly">;
|
|
1263
|
+
declare const ALIGN_ITEMS_CLASSES: ResponsiveClassMap<"center" | "baseline" | "flex-start" | "flex-end" | "stretch">;
|
|
1230
1264
|
declare const GAP_CLASSES: ResponsiveClassMap<"0x" | "1x" | "2x" | "3x" | "4x" | "5x" | "6x" | "8x" | "10x" | "12x" | "14x" | "16x" | "20x" | "24x">;
|
|
1231
1265
|
declare const WRAP_CLASSES: {
|
|
1232
|
-
|
|
1233
|
-
|
|
1234
|
-
|
|
1266
|
+
readonly wrap: "flex-wrap";
|
|
1267
|
+
readonly nowrap: "flex-nowrap";
|
|
1268
|
+
readonly 'wrap-reverse': "flex-wrap-reverse";
|
|
1235
1269
|
};
|
|
1236
1270
|
type FlexDirection = ResponsiveSize<typeof DIRECTION_CLASSES>;
|
|
1237
1271
|
type JustifyContent = ResponsiveSize<typeof JUSTIFY_CONTENT_CLASSES>;
|
|
@@ -1239,38 +1273,38 @@ type AlignItems = ResponsiveSize<typeof ALIGN_ITEMS_CLASSES>;
|
|
|
1239
1273
|
type GapProp = ResponsiveSize<typeof GAP_CLASSES>;
|
|
1240
1274
|
type FlexWrap = keyof typeof WRAP_CLASSES;
|
|
1241
1275
|
type StackOptions = {
|
|
1242
|
-
|
|
1243
|
-
|
|
1244
|
-
|
|
1245
|
-
|
|
1246
|
-
|
|
1247
|
-
|
|
1248
|
-
|
|
1249
|
-
|
|
1250
|
-
|
|
1251
|
-
|
|
1252
|
-
|
|
1253
|
-
|
|
1254
|
-
|
|
1255
|
-
|
|
1256
|
-
|
|
1257
|
-
|
|
1258
|
-
|
|
1259
|
-
|
|
1260
|
-
|
|
1261
|
-
|
|
1262
|
-
|
|
1263
|
-
|
|
1264
|
-
|
|
1265
|
-
|
|
1266
|
-
|
|
1267
|
-
|
|
1268
|
-
|
|
1269
|
-
|
|
1270
|
-
|
|
1271
|
-
|
|
1272
|
-
|
|
1273
|
-
|
|
1276
|
+
/**
|
|
1277
|
+
* The direction of the stack.
|
|
1278
|
+
* @default 'column'
|
|
1279
|
+
*/
|
|
1280
|
+
direction?: ResponsiveProp<FlexDirection>;
|
|
1281
|
+
/**
|
|
1282
|
+
* The CSS `justify-content` property.
|
|
1283
|
+
* Controls the alignment of items on the main axis.
|
|
1284
|
+
*/
|
|
1285
|
+
justifyContent?: ResponsiveProp<JustifyContent>;
|
|
1286
|
+
/**
|
|
1287
|
+
* The CSS `align-items` property.
|
|
1288
|
+
* Controls the alignment of items on the cross axis.
|
|
1289
|
+
*/
|
|
1290
|
+
alignItems?: ResponsiveProp<AlignItems>;
|
|
1291
|
+
/**
|
|
1292
|
+
* The CSS `flex-wrap` property.
|
|
1293
|
+
* Controls whether children can wrap onto multiple lines.
|
|
1294
|
+
* @default 'nowrap'
|
|
1295
|
+
*/
|
|
1296
|
+
wrap?: FlexWrap;
|
|
1297
|
+
/**
|
|
1298
|
+
* The gap between each child element.
|
|
1299
|
+
*/
|
|
1300
|
+
gap?: ResponsiveProp<GapProp>;
|
|
1301
|
+
/**
|
|
1302
|
+
* A divider element to be rendered between each child element.
|
|
1303
|
+
*
|
|
1304
|
+
* _Note: For the divider to be rendered, the child elements can't be loose strings or numbers.
|
|
1305
|
+
* Wrap them in a `div` or other element._
|
|
1306
|
+
*/
|
|
1307
|
+
divider?: ReactNode;
|
|
1274
1308
|
};
|
|
1275
1309
|
type StackComponent = ForwardRefComponent<'div', StackOptions>;
|
|
1276
1310
|
/**
|
|
@@ -1281,88 +1315,91 @@ type StackProps = PropsOf<StackComponent>;
|
|
|
1281
1315
|
* @deprecated Use Tailwind CSS instead.
|
|
1282
1316
|
*/
|
|
1283
1317
|
declare const Stack: StackComponent;
|
|
1284
|
-
|
|
1318
|
+
//#endregion
|
|
1319
|
+
//#region src/components/switch/switch.d.ts
|
|
1285
1320
|
type SwitchOptions = {
|
|
1286
|
-
|
|
1287
|
-
|
|
1288
|
-
|
|
1289
|
-
|
|
1290
|
-
|
|
1291
|
-
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
|
|
1301
|
-
|
|
1302
|
-
|
|
1303
|
-
|
|
1304
|
-
|
|
1305
|
-
|
|
1306
|
-
|
|
1307
|
-
|
|
1308
|
-
|
|
1309
|
-
|
|
1310
|
-
|
|
1311
|
-
|
|
1312
|
-
|
|
1321
|
+
/**
|
|
1322
|
+
* The label for the switch
|
|
1323
|
+
*/
|
|
1324
|
+
label: string;
|
|
1325
|
+
/**
|
|
1326
|
+
* The text that appears below the label
|
|
1327
|
+
* to provide additional guidance to the user
|
|
1328
|
+
*/
|
|
1329
|
+
helperText?: string;
|
|
1330
|
+
/**
|
|
1331
|
+
* The checked state of the checkbox when it is initially rendered. Use when you do not need to control its checked state.
|
|
1332
|
+
*/
|
|
1333
|
+
isDefaultChecked?: boolean;
|
|
1334
|
+
/**
|
|
1335
|
+
* If `true`, the switch will be checked
|
|
1336
|
+
*/
|
|
1337
|
+
isChecked?: boolean;
|
|
1338
|
+
/**
|
|
1339
|
+
* If `true`, the switch will be disabled and
|
|
1340
|
+
* cannot be interacted with
|
|
1341
|
+
*/
|
|
1342
|
+
isDisabled?: boolean;
|
|
1343
|
+
/**
|
|
1344
|
+
* If `true`, indicates that the switch is required
|
|
1345
|
+
*/
|
|
1346
|
+
isRequired?: boolean;
|
|
1347
|
+
onCheckedChange?: (isChecked: boolean) => void;
|
|
1313
1348
|
};
|
|
1314
1349
|
type SwitchProps = {} & Omit<Switch$1.SwitchProps, 'asChild' | keyof SwitchOptions> & SwitchOptions;
|
|
1315
|
-
declare const Switch: react.ForwardRefExoticComponent<Omit<Switch$1.SwitchProps, "asChild" | keyof SwitchOptions> & SwitchOptions & react.RefAttributes<HTMLButtonElement>>;
|
|
1316
|
-
|
|
1350
|
+
declare const Switch: import("react").ForwardRefExoticComponent<Omit<Switch$1.SwitchProps, "asChild" | keyof SwitchOptions> & SwitchOptions & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1351
|
+
//#endregion
|
|
1352
|
+
//#region src/components/textarea/textarea.d.ts
|
|
1317
1353
|
type TextareaOptions = {
|
|
1318
|
-
|
|
1319
|
-
|
|
1320
|
-
|
|
1321
|
-
|
|
1322
|
-
|
|
1323
|
-
|
|
1324
|
-
|
|
1325
|
-
|
|
1326
|
-
|
|
1327
|
-
|
|
1328
|
-
|
|
1329
|
-
|
|
1330
|
-
|
|
1331
|
-
|
|
1332
|
-
|
|
1333
|
-
|
|
1334
|
-
|
|
1354
|
+
/**
|
|
1355
|
+
* The label for the textarea field
|
|
1356
|
+
*/
|
|
1357
|
+
label: string;
|
|
1358
|
+
/**
|
|
1359
|
+
* The error message to display if `isInvalid` is `true`
|
|
1360
|
+
*/
|
|
1361
|
+
errorMessage?: string;
|
|
1362
|
+
/**
|
|
1363
|
+
* Text that provides additional guidance to the user
|
|
1364
|
+
*/
|
|
1365
|
+
helperText?: string;
|
|
1366
|
+
/**
|
|
1367
|
+
* If `true`, the input will display an optional indicator.
|
|
1368
|
+
* If the `isRequired` prop is also `true`, this prop will be ignored.
|
|
1369
|
+
*/
|
|
1370
|
+
isOptional?: boolean;
|
|
1335
1371
|
} & TextareaBaseOptions;
|
|
1336
1372
|
type OmittedProps$2 = 'children' | 'readOnly' | 'size';
|
|
1337
1373
|
type TextareaProps = {} & Omit<HTMLQdsProps<'textarea'>, OmittedProps$2> & TextareaOptions;
|
|
1338
|
-
declare const Textarea: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref">, OmittedProps$2> & {
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
|
|
1342
|
-
|
|
1343
|
-
|
|
1344
|
-
|
|
1345
|
-
|
|
1346
|
-
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
|
|
1351
|
-
|
|
1352
|
-
|
|
1353
|
-
|
|
1354
|
-
|
|
1355
|
-
|
|
1356
|
-
} & TextareaBaseOptions & react.RefAttributes<HTMLTextAreaElement>>;
|
|
1357
|
-
|
|
1374
|
+
declare const Textarea: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref">, OmittedProps$2> & {
|
|
1375
|
+
/**
|
|
1376
|
+
* The label for the textarea field
|
|
1377
|
+
*/
|
|
1378
|
+
label: string;
|
|
1379
|
+
/**
|
|
1380
|
+
* The error message to display if `isInvalid` is `true`
|
|
1381
|
+
*/
|
|
1382
|
+
errorMessage?: string;
|
|
1383
|
+
/**
|
|
1384
|
+
* Text that provides additional guidance to the user
|
|
1385
|
+
*/
|
|
1386
|
+
helperText?: string;
|
|
1387
|
+
/**
|
|
1388
|
+
* If `true`, the input will display an optional indicator.
|
|
1389
|
+
* If the `isRequired` prop is also `true`, this prop will be ignored.
|
|
1390
|
+
*/
|
|
1391
|
+
isOptional?: boolean;
|
|
1392
|
+
} & TextareaBaseOptions & import("react").RefAttributes<HTMLTextAreaElement>>;
|
|
1393
|
+
//#endregion
|
|
1394
|
+
//#region src/components/toast/toast.d.ts
|
|
1358
1395
|
declare const VARIANT_CLASSES: {
|
|
1359
|
-
|
|
1360
|
-
|
|
1396
|
+
readonly neutral: "bg-black text-white";
|
|
1397
|
+
readonly error: "bg-negative text-white";
|
|
1361
1398
|
};
|
|
1362
1399
|
type ToastVariant = keyof typeof VARIANT_CLASSES;
|
|
1363
1400
|
type ToastOptions$1 = {
|
|
1364
|
-
|
|
1365
|
-
|
|
1401
|
+
text: string;
|
|
1402
|
+
variant?: ToastVariant;
|
|
1366
1403
|
};
|
|
1367
1404
|
type OmittedProps$1 = 'children';
|
|
1368
1405
|
type ToastProps = {} & Omit<HTMLQdsProps<'div'>, OmittedProps$1> & ToastOptions$1;
|
|
@@ -1371,465 +1408,469 @@ type ToastProps = {} & Omit<HTMLQdsProps<'div'>, OmittedProps$1> & ToastOptions$
|
|
|
1371
1408
|
* Radix uses <ol> and <li> elements for Toast elements in combination with role="status", which is not allowed according to a11y standards
|
|
1372
1409
|
* @see https://github.com/radix-ui/primitives/issues/1750
|
|
1373
1410
|
*/
|
|
1374
|
-
declare function Toast(props: ToastProps & Toast$1.ToastProps):
|
|
1375
|
-
|
|
1411
|
+
declare function Toast(props: ToastProps & Toast$1.ToastProps): import("react/jsx-runtime").JSX.Element;
|
|
1412
|
+
//#endregion
|
|
1413
|
+
//#region src/components/toast/toast-store.d.ts
|
|
1376
1414
|
type Id = number | string;
|
|
1377
1415
|
type ToastOptions = {
|
|
1378
|
-
|
|
1379
|
-
|
|
1380
|
-
|
|
1381
|
-
|
|
1382
|
-
|
|
1383
|
-
|
|
1416
|
+
/**
|
|
1417
|
+
* Unique identifier for the toast (can be used for removing it prematurely). If a toast with this
|
|
1418
|
+
* identifier already exists it will be removed before the new toast is added.
|
|
1419
|
+
* @default a random unique id will be set and returned
|
|
1420
|
+
*/
|
|
1421
|
+
id?: Id;
|
|
1384
1422
|
};
|
|
1385
1423
|
declare const toast: ((text: string, options?: ToastOptions) => Id) & {
|
|
1386
|
-
|
|
1387
|
-
|
|
1388
|
-
|
|
1424
|
+
error: (text: string, options?: ToastOptions) => Id;
|
|
1425
|
+
remove: (id: Id) => void;
|
|
1426
|
+
removeAll: () => void;
|
|
1389
1427
|
};
|
|
1390
|
-
|
|
1428
|
+
//#endregion
|
|
1429
|
+
//#region src/styles/css-utils.d.ts
|
|
1391
1430
|
/**
|
|
1392
1431
|
* @deprecated Use Tailwind spacing utilities instead, eg. `p-4` for 16px padding.
|
|
1393
1432
|
* If you need a raw value, reference the CSS variable directly: `var(--spacing-4)`.
|
|
1394
1433
|
*/
|
|
1395
1434
|
declare const pxToRem: (px: number) => string;
|
|
1396
|
-
|
|
1435
|
+
//#endregion
|
|
1436
|
+
//#region src/theme/theme.d.ts
|
|
1397
1437
|
/**
|
|
1398
1438
|
* @deprecated The `theme` object is deprecated and will be removed in a future version.
|
|
1399
1439
|
* Use Tailwind CSS instead.
|
|
1400
1440
|
*/
|
|
1401
1441
|
declare const theme: {
|
|
1402
|
-
|
|
1403
|
-
|
|
1404
|
-
|
|
1405
|
-
|
|
1406
|
-
|
|
1407
|
-
|
|
1408
|
-
|
|
1409
|
-
|
|
1410
|
-
|
|
1411
|
-
|
|
1442
|
+
/**
|
|
1443
|
+
* @deprecated Using QDS with `@emotion` is deprecated and will be removed in a future version.
|
|
1444
|
+
* Use Tailwind CSS instead.
|
|
1445
|
+
*/
|
|
1446
|
+
mediaQueries: {
|
|
1447
|
+
readonly smUp: "@media(min-width: 480px)";
|
|
1448
|
+
readonly mdUp: "@media(min-width: 768px)";
|
|
1449
|
+
readonly lgUp: "@media(min-width: 1024px)";
|
|
1450
|
+
readonly xlUp: "@media(min-width: 1280px)";
|
|
1451
|
+
readonly '2xlUp': "@media(min-width: 1536px)";
|
|
1452
|
+
};
|
|
1453
|
+
spacing: {
|
|
1454
|
+
'0x': string;
|
|
1455
|
+
'1x': string;
|
|
1456
|
+
'2x': string;
|
|
1457
|
+
'3x': string;
|
|
1458
|
+
'4x': string;
|
|
1459
|
+
'5x': string;
|
|
1460
|
+
'6x': string;
|
|
1461
|
+
'8x': string;
|
|
1462
|
+
'10x': string;
|
|
1463
|
+
'12x': string;
|
|
1464
|
+
'14x': string;
|
|
1465
|
+
'16x': string;
|
|
1466
|
+
'20x': string;
|
|
1467
|
+
'24x': string;
|
|
1468
|
+
};
|
|
1469
|
+
breakpoints: {
|
|
1470
|
+
readonly base: 0;
|
|
1471
|
+
readonly sm: 480;
|
|
1472
|
+
readonly md: 768;
|
|
1473
|
+
readonly lg: 1024;
|
|
1474
|
+
readonly xl: 1280;
|
|
1475
|
+
readonly '2xl': 1536;
|
|
1476
|
+
};
|
|
1477
|
+
zIndices: {
|
|
1478
|
+
hide: number;
|
|
1479
|
+
auto: string;
|
|
1480
|
+
base: number;
|
|
1481
|
+
docked: number;
|
|
1482
|
+
dropdown: number;
|
|
1483
|
+
sticky: number;
|
|
1484
|
+
banner: number;
|
|
1485
|
+
overlay: number;
|
|
1486
|
+
modal: number;
|
|
1487
|
+
popover: number;
|
|
1488
|
+
skipLink: number;
|
|
1489
|
+
toast: number;
|
|
1490
|
+
tooltip: number;
|
|
1491
|
+
};
|
|
1492
|
+
colors: {
|
|
1493
|
+
core: {
|
|
1494
|
+
black: string;
|
|
1495
|
+
white: string;
|
|
1496
|
+
gray90: string;
|
|
1497
|
+
gray80: string;
|
|
1498
|
+
gray70: string;
|
|
1499
|
+
gray60: string;
|
|
1500
|
+
gray50: string;
|
|
1501
|
+
gray40: string;
|
|
1502
|
+
gray30: string;
|
|
1503
|
+
gray20: string;
|
|
1504
|
+
gray10: string;
|
|
1505
|
+
pink: string;
|
|
1506
|
+
uiPink: string;
|
|
1507
|
+
uiPinkDark: string;
|
|
1508
|
+
uiPinkLight: string;
|
|
1509
|
+
brown: string;
|
|
1510
|
+
brownDark: string;
|
|
1511
|
+
brownLight: string;
|
|
1512
|
+
offWhite: string;
|
|
1513
|
+
offWhiteDark: string;
|
|
1514
|
+
offWhiteLight: string;
|
|
1515
|
+
softPink: string;
|
|
1516
|
+
warmYellow: string;
|
|
1517
|
+
softYellow: string;
|
|
1518
|
+
red90: string;
|
|
1519
|
+
red80: string;
|
|
1520
|
+
red70: string;
|
|
1521
|
+
red60: string;
|
|
1522
|
+
red50: string;
|
|
1523
|
+
red40: string;
|
|
1524
|
+
red30: string;
|
|
1525
|
+
red20: string;
|
|
1526
|
+
red10: string;
|
|
1527
|
+
green90: string;
|
|
1528
|
+
green80: string;
|
|
1529
|
+
green70: string;
|
|
1530
|
+
green60: string;
|
|
1531
|
+
green50: string;
|
|
1532
|
+
green40: string;
|
|
1533
|
+
green30: string;
|
|
1534
|
+
green20: string;
|
|
1535
|
+
green10: string;
|
|
1536
|
+
blue90: string;
|
|
1537
|
+
blue80: string;
|
|
1538
|
+
blue70: string;
|
|
1539
|
+
blue60: string;
|
|
1540
|
+
blue50: string;
|
|
1541
|
+
blue40: string;
|
|
1542
|
+
blue30: string;
|
|
1543
|
+
blue20: string;
|
|
1544
|
+
blue10: string;
|
|
1545
|
+
yellow90: string;
|
|
1546
|
+
yellow80: string;
|
|
1547
|
+
yellow70: string;
|
|
1548
|
+
yellow60: string;
|
|
1549
|
+
yellow50: string;
|
|
1550
|
+
yellow40: string;
|
|
1551
|
+
yellow30: string;
|
|
1552
|
+
yellow20: string;
|
|
1553
|
+
yellow10: string;
|
|
1554
|
+
blackAlpha5: string;
|
|
1555
|
+
blackAlpha10: string;
|
|
1556
|
+
blackAlpha20: string;
|
|
1557
|
+
};
|
|
1558
|
+
bg: {
|
|
1559
|
+
default: string;
|
|
1560
|
+
brandPrimary: string;
|
|
1561
|
+
brandPrimaryHover: string;
|
|
1562
|
+
brandPrimaryActive: string;
|
|
1563
|
+
brandSecondary: string;
|
|
1564
|
+
brandSecondaryHover: string;
|
|
1565
|
+
brandSecondaryActive: string;
|
|
1566
|
+
brandTertiary: string;
|
|
1567
|
+
brandTertiaryHover: string;
|
|
1568
|
+
brandTertiaryActive: string;
|
|
1569
|
+
negative: string;
|
|
1570
|
+
warning: string;
|
|
1571
|
+
positive: string;
|
|
1572
|
+
inset: string;
|
|
1573
|
+
backdrop: string;
|
|
1412
1574
|
};
|
|
1413
|
-
|
|
1414
|
-
|
|
1415
|
-
|
|
1416
|
-
|
|
1417
|
-
|
|
1418
|
-
|
|
1419
|
-
|
|
1420
|
-
|
|
1421
|
-
|
|
1422
|
-
|
|
1423
|
-
|
|
1424
|
-
'14x': string;
|
|
1425
|
-
'16x': string;
|
|
1426
|
-
'20x': string;
|
|
1427
|
-
'24x': string;
|
|
1575
|
+
text: {
|
|
1576
|
+
strong: string;
|
|
1577
|
+
default: string;
|
|
1578
|
+
subtle: string;
|
|
1579
|
+
disabled: string;
|
|
1580
|
+
negative: string;
|
|
1581
|
+
warning: string;
|
|
1582
|
+
positive: string;
|
|
1583
|
+
onBrandPrimary: string;
|
|
1584
|
+
onBrandSecondary: string;
|
|
1585
|
+
onBrandTertiary: string;
|
|
1428
1586
|
};
|
|
1429
|
-
|
|
1430
|
-
|
|
1431
|
-
|
|
1432
|
-
|
|
1433
|
-
|
|
1434
|
-
|
|
1435
|
-
|
|
1587
|
+
icon: {
|
|
1588
|
+
default: string;
|
|
1589
|
+
strong: string;
|
|
1590
|
+
subtle: string;
|
|
1591
|
+
disabled: string;
|
|
1592
|
+
negative: string;
|
|
1593
|
+
warning: string;
|
|
1594
|
+
positive: string;
|
|
1595
|
+
onBrandPrimary: string;
|
|
1596
|
+
onBrandSecondary: string;
|
|
1597
|
+
onBrandTertiary: string;
|
|
1436
1598
|
};
|
|
1437
|
-
|
|
1438
|
-
|
|
1439
|
-
|
|
1440
|
-
|
|
1441
|
-
|
|
1442
|
-
|
|
1443
|
-
|
|
1444
|
-
|
|
1445
|
-
|
|
1446
|
-
modal: number;
|
|
1447
|
-
popover: number;
|
|
1448
|
-
skipLink: number;
|
|
1449
|
-
toast: number;
|
|
1450
|
-
tooltip: number;
|
|
1599
|
+
border: {
|
|
1600
|
+
default: string;
|
|
1601
|
+
defaultHover: string;
|
|
1602
|
+
defaultSelected: string;
|
|
1603
|
+
strong: string;
|
|
1604
|
+
subtle: string;
|
|
1605
|
+
negative: string;
|
|
1606
|
+
warning: string;
|
|
1607
|
+
positive: string;
|
|
1451
1608
|
};
|
|
1452
|
-
|
|
1453
|
-
|
|
1454
|
-
|
|
1455
|
-
|
|
1456
|
-
|
|
1457
|
-
|
|
1458
|
-
|
|
1459
|
-
|
|
1460
|
-
|
|
1461
|
-
|
|
1462
|
-
|
|
1463
|
-
|
|
1464
|
-
|
|
1465
|
-
|
|
1466
|
-
|
|
1467
|
-
|
|
1468
|
-
|
|
1469
|
-
|
|
1470
|
-
|
|
1471
|
-
|
|
1472
|
-
|
|
1473
|
-
|
|
1474
|
-
|
|
1475
|
-
|
|
1476
|
-
|
|
1477
|
-
|
|
1478
|
-
|
|
1479
|
-
|
|
1480
|
-
|
|
1481
|
-
|
|
1482
|
-
|
|
1483
|
-
|
|
1484
|
-
|
|
1485
|
-
|
|
1486
|
-
|
|
1487
|
-
|
|
1488
|
-
|
|
1489
|
-
|
|
1490
|
-
|
|
1491
|
-
|
|
1492
|
-
|
|
1493
|
-
|
|
1494
|
-
|
|
1495
|
-
|
|
1496
|
-
|
|
1497
|
-
|
|
1498
|
-
|
|
1499
|
-
|
|
1500
|
-
|
|
1501
|
-
|
|
1502
|
-
|
|
1503
|
-
|
|
1504
|
-
|
|
1505
|
-
|
|
1506
|
-
|
|
1507
|
-
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
|
|
1511
|
-
|
|
1512
|
-
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1516
|
-
|
|
1517
|
-
|
|
1518
|
-
|
|
1519
|
-
|
|
1520
|
-
|
|
1521
|
-
|
|
1522
|
-
|
|
1523
|
-
|
|
1524
|
-
|
|
1525
|
-
|
|
1526
|
-
|
|
1527
|
-
|
|
1528
|
-
|
|
1529
|
-
|
|
1530
|
-
|
|
1531
|
-
|
|
1532
|
-
|
|
1533
|
-
|
|
1534
|
-
|
|
1535
|
-
|
|
1536
|
-
|
|
1537
|
-
|
|
1538
|
-
|
|
1539
|
-
|
|
1540
|
-
|
|
1541
|
-
|
|
1542
|
-
|
|
1543
|
-
|
|
1544
|
-
|
|
1545
|
-
|
|
1546
|
-
|
|
1547
|
-
|
|
1548
|
-
|
|
1549
|
-
|
|
1550
|
-
|
|
1551
|
-
|
|
1552
|
-
|
|
1553
|
-
|
|
1554
|
-
|
|
1555
|
-
|
|
1556
|
-
|
|
1557
|
-
|
|
1558
|
-
|
|
1559
|
-
|
|
1560
|
-
|
|
1561
|
-
|
|
1562
|
-
|
|
1563
|
-
|
|
1564
|
-
|
|
1565
|
-
|
|
1566
|
-
|
|
1567
|
-
|
|
1568
|
-
|
|
1609
|
+
};
|
|
1610
|
+
sizes: {
|
|
1611
|
+
112: string;
|
|
1612
|
+
128: string;
|
|
1613
|
+
144: string;
|
|
1614
|
+
160: string;
|
|
1615
|
+
176: string;
|
|
1616
|
+
192: string;
|
|
1617
|
+
224: string;
|
|
1618
|
+
256: string;
|
|
1619
|
+
288: string;
|
|
1620
|
+
320: string;
|
|
1621
|
+
384: string;
|
|
1622
|
+
448: string;
|
|
1623
|
+
512: string;
|
|
1624
|
+
576: string;
|
|
1625
|
+
672: string;
|
|
1626
|
+
768: string;
|
|
1627
|
+
896: string;
|
|
1628
|
+
1024: string;
|
|
1629
|
+
'0x': string;
|
|
1630
|
+
'1x': string;
|
|
1631
|
+
'2x': string;
|
|
1632
|
+
'3x': string;
|
|
1633
|
+
'4x': string;
|
|
1634
|
+
'5x': string;
|
|
1635
|
+
'6x': string;
|
|
1636
|
+
'8x': string;
|
|
1637
|
+
'10x': string;
|
|
1638
|
+
'12x': string;
|
|
1639
|
+
'14x': string;
|
|
1640
|
+
'16x': string;
|
|
1641
|
+
'20x': string;
|
|
1642
|
+
'24x': string;
|
|
1643
|
+
};
|
|
1644
|
+
radii: {
|
|
1645
|
+
none: string;
|
|
1646
|
+
'2xs': string;
|
|
1647
|
+
xs: string;
|
|
1648
|
+
sm: string;
|
|
1649
|
+
md: string;
|
|
1650
|
+
lg: string;
|
|
1651
|
+
xl: string;
|
|
1652
|
+
'2xl': string;
|
|
1653
|
+
full: string;
|
|
1654
|
+
};
|
|
1655
|
+
shadows: {
|
|
1656
|
+
none: string;
|
|
1657
|
+
sm: string;
|
|
1658
|
+
md: string;
|
|
1659
|
+
lg: string;
|
|
1660
|
+
xl: string;
|
|
1661
|
+
};
|
|
1662
|
+
typography: {
|
|
1663
|
+
display: {
|
|
1664
|
+
'3xl': {
|
|
1665
|
+
fontFamily: string;
|
|
1666
|
+
fontWeight: string;
|
|
1667
|
+
fontSize: string;
|
|
1668
|
+
lineHeight: string;
|
|
1669
|
+
letterSpacing: string;
|
|
1670
|
+
fontFeatureSettings: string;
|
|
1671
|
+
};
|
|
1672
|
+
'2xl': {
|
|
1673
|
+
fontFamily: string;
|
|
1674
|
+
fontWeight: string;
|
|
1675
|
+
fontSize: string;
|
|
1676
|
+
lineHeight: string;
|
|
1677
|
+
letterSpacing: string;
|
|
1678
|
+
fontFeatureSettings: string;
|
|
1679
|
+
};
|
|
1680
|
+
xl: {
|
|
1681
|
+
fontFamily: string;
|
|
1682
|
+
fontWeight: string;
|
|
1683
|
+
fontSize: string;
|
|
1684
|
+
lineHeight: string;
|
|
1685
|
+
letterSpacing: string;
|
|
1686
|
+
fontFeatureSettings: string;
|
|
1687
|
+
};
|
|
1688
|
+
lg: {
|
|
1689
|
+
fontFamily: string;
|
|
1690
|
+
fontWeight: string;
|
|
1691
|
+
fontSize: string;
|
|
1692
|
+
lineHeight: string;
|
|
1693
|
+
letterSpacing: string;
|
|
1694
|
+
fontFeatureSettings: string;
|
|
1695
|
+
};
|
|
1696
|
+
md: {
|
|
1697
|
+
fontFamily: string;
|
|
1698
|
+
fontWeight: string;
|
|
1699
|
+
fontSize: string;
|
|
1700
|
+
lineHeight: string;
|
|
1701
|
+
letterSpacing: string;
|
|
1702
|
+
fontFeatureSettings: string;
|
|
1703
|
+
};
|
|
1704
|
+
sm: {
|
|
1705
|
+
fontFamily: string;
|
|
1706
|
+
fontWeight: string;
|
|
1707
|
+
fontSize: string;
|
|
1708
|
+
lineHeight: string;
|
|
1709
|
+
letterSpacing: string;
|
|
1710
|
+
fontFeatureSettings: string;
|
|
1711
|
+
};
|
|
1712
|
+
xs: {
|
|
1713
|
+
fontFamily: string;
|
|
1714
|
+
fontWeight: string;
|
|
1715
|
+
fontSize: string;
|
|
1716
|
+
lineHeight: string;
|
|
1717
|
+
letterSpacing: string;
|
|
1718
|
+
fontFeatureSettings: string;
|
|
1719
|
+
};
|
|
1720
|
+
'2xs': {
|
|
1721
|
+
fontFamily: string;
|
|
1722
|
+
fontWeight: string;
|
|
1723
|
+
fontSize: string;
|
|
1724
|
+
lineHeight: string;
|
|
1725
|
+
letterSpacing: string;
|
|
1726
|
+
fontFeatureSettings: string;
|
|
1727
|
+
};
|
|
1569
1728
|
};
|
|
1570
|
-
|
|
1571
|
-
|
|
1572
|
-
|
|
1573
|
-
|
|
1574
|
-
|
|
1575
|
-
|
|
1576
|
-
|
|
1577
|
-
|
|
1578
|
-
|
|
1579
|
-
|
|
1580
|
-
|
|
1581
|
-
|
|
1582
|
-
|
|
1583
|
-
|
|
1584
|
-
|
|
1585
|
-
|
|
1586
|
-
|
|
1587
|
-
|
|
1588
|
-
|
|
1589
|
-
|
|
1590
|
-
|
|
1591
|
-
|
|
1592
|
-
|
|
1593
|
-
|
|
1594
|
-
|
|
1595
|
-
|
|
1596
|
-
|
|
1597
|
-
|
|
1598
|
-
|
|
1599
|
-
|
|
1600
|
-
|
|
1601
|
-
|
|
1602
|
-
|
|
1729
|
+
title: {
|
|
1730
|
+
lg: {
|
|
1731
|
+
fontFamily: string;
|
|
1732
|
+
fontWeight: string;
|
|
1733
|
+
fontSize: string;
|
|
1734
|
+
lineHeight: string;
|
|
1735
|
+
letterSpacing: string;
|
|
1736
|
+
};
|
|
1737
|
+
md: {
|
|
1738
|
+
fontFamily: string;
|
|
1739
|
+
fontWeight: string;
|
|
1740
|
+
fontSize: string;
|
|
1741
|
+
lineHeight: string;
|
|
1742
|
+
letterSpacing: string;
|
|
1743
|
+
};
|
|
1744
|
+
sm: {
|
|
1745
|
+
fontFamily: string;
|
|
1746
|
+
fontWeight: string;
|
|
1747
|
+
fontSize: string;
|
|
1748
|
+
lineHeight: string;
|
|
1749
|
+
letterSpacing: string;
|
|
1750
|
+
};
|
|
1751
|
+
xs: {
|
|
1752
|
+
fontFamily: string;
|
|
1753
|
+
fontWeight: string;
|
|
1754
|
+
fontSize: string;
|
|
1755
|
+
lineHeight: string;
|
|
1756
|
+
letterSpacing: string;
|
|
1757
|
+
};
|
|
1758
|
+
'2xs': {
|
|
1759
|
+
fontFamily: string;
|
|
1760
|
+
fontWeight: string;
|
|
1761
|
+
fontSize: string;
|
|
1762
|
+
lineHeight: string;
|
|
1763
|
+
letterSpacing: string;
|
|
1764
|
+
};
|
|
1765
|
+
'3xs': {
|
|
1766
|
+
fontFamily: string;
|
|
1767
|
+
fontWeight: string;
|
|
1768
|
+
fontSize: string;
|
|
1769
|
+
lineHeight: string;
|
|
1770
|
+
letterSpacing: string;
|
|
1771
|
+
};
|
|
1603
1772
|
};
|
|
1604
|
-
|
|
1605
|
-
|
|
1606
|
-
|
|
1607
|
-
|
|
1608
|
-
|
|
1609
|
-
|
|
1610
|
-
|
|
1611
|
-
|
|
1612
|
-
|
|
1613
|
-
|
|
1773
|
+
body: {
|
|
1774
|
+
xl: {
|
|
1775
|
+
fontFamily: string;
|
|
1776
|
+
fontWeight: string;
|
|
1777
|
+
fontSize: string;
|
|
1778
|
+
lineHeight: string;
|
|
1779
|
+
letterSpacing: string;
|
|
1780
|
+
};
|
|
1781
|
+
lg: {
|
|
1782
|
+
fontFamily: string;
|
|
1783
|
+
fontWeight: string;
|
|
1784
|
+
fontSize: string;
|
|
1785
|
+
lineHeight: string;
|
|
1786
|
+
letterSpacing: string;
|
|
1787
|
+
};
|
|
1788
|
+
md: {
|
|
1789
|
+
fontFamily: string;
|
|
1790
|
+
fontWeight: string;
|
|
1791
|
+
fontSize: string;
|
|
1792
|
+
lineHeight: string;
|
|
1793
|
+
letterSpacing: string;
|
|
1794
|
+
};
|
|
1795
|
+
sm: {
|
|
1796
|
+
fontFamily: string;
|
|
1797
|
+
fontWeight: string;
|
|
1798
|
+
fontSize: string;
|
|
1799
|
+
lineHeight: string;
|
|
1800
|
+
letterSpacing: string;
|
|
1801
|
+
};
|
|
1802
|
+
xs: {
|
|
1803
|
+
fontFamily: string;
|
|
1804
|
+
fontWeight: string;
|
|
1805
|
+
fontSize: string;
|
|
1806
|
+
lineHeight: string;
|
|
1807
|
+
letterSpacing: string;
|
|
1808
|
+
};
|
|
1614
1809
|
};
|
|
1615
|
-
|
|
1616
|
-
|
|
1617
|
-
|
|
1618
|
-
|
|
1619
|
-
|
|
1620
|
-
|
|
1810
|
+
label: {
|
|
1811
|
+
md: {
|
|
1812
|
+
fontFamily: string;
|
|
1813
|
+
fontWeight: string;
|
|
1814
|
+
fontSize: string;
|
|
1815
|
+
lineHeight: string;
|
|
1816
|
+
letterSpacing: string;
|
|
1817
|
+
};
|
|
1818
|
+
sm: {
|
|
1819
|
+
fontFamily: string;
|
|
1820
|
+
fontWeight: string;
|
|
1821
|
+
fontSize: string;
|
|
1822
|
+
lineHeight: string;
|
|
1823
|
+
letterSpacing: string;
|
|
1824
|
+
};
|
|
1621
1825
|
};
|
|
1622
|
-
|
|
1623
|
-
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
|
|
1629
|
-
|
|
1630
|
-
|
|
1631
|
-
|
|
1632
|
-
|
|
1633
|
-
|
|
1634
|
-
|
|
1635
|
-
|
|
1636
|
-
|
|
1637
|
-
letterSpacing: string;
|
|
1638
|
-
fontFeatureSettings: string;
|
|
1639
|
-
};
|
|
1640
|
-
xl: {
|
|
1641
|
-
fontFamily: string;
|
|
1642
|
-
fontWeight: string;
|
|
1643
|
-
fontSize: string;
|
|
1644
|
-
lineHeight: string;
|
|
1645
|
-
letterSpacing: string;
|
|
1646
|
-
fontFeatureSettings: string;
|
|
1647
|
-
};
|
|
1648
|
-
lg: {
|
|
1649
|
-
fontFamily: string;
|
|
1650
|
-
fontWeight: string;
|
|
1651
|
-
fontSize: string;
|
|
1652
|
-
lineHeight: string;
|
|
1653
|
-
letterSpacing: string;
|
|
1654
|
-
fontFeatureSettings: string;
|
|
1655
|
-
};
|
|
1656
|
-
md: {
|
|
1657
|
-
fontFamily: string;
|
|
1658
|
-
fontWeight: string;
|
|
1659
|
-
fontSize: string;
|
|
1660
|
-
lineHeight: string;
|
|
1661
|
-
letterSpacing: string;
|
|
1662
|
-
fontFeatureSettings: string;
|
|
1663
|
-
};
|
|
1664
|
-
sm: {
|
|
1665
|
-
fontFamily: string;
|
|
1666
|
-
fontWeight: string;
|
|
1667
|
-
fontSize: string;
|
|
1668
|
-
lineHeight: string;
|
|
1669
|
-
letterSpacing: string;
|
|
1670
|
-
fontFeatureSettings: string;
|
|
1671
|
-
};
|
|
1672
|
-
xs: {
|
|
1673
|
-
fontFamily: string;
|
|
1674
|
-
fontWeight: string;
|
|
1675
|
-
fontSize: string;
|
|
1676
|
-
lineHeight: string;
|
|
1677
|
-
letterSpacing: string;
|
|
1678
|
-
fontFeatureSettings: string;
|
|
1679
|
-
};
|
|
1680
|
-
'2xs': {
|
|
1681
|
-
fontFamily: string;
|
|
1682
|
-
fontWeight: string;
|
|
1683
|
-
fontSize: string;
|
|
1684
|
-
lineHeight: string;
|
|
1685
|
-
letterSpacing: string;
|
|
1686
|
-
fontFeatureSettings: string;
|
|
1687
|
-
};
|
|
1688
|
-
};
|
|
1689
|
-
title: {
|
|
1690
|
-
lg: {
|
|
1691
|
-
fontFamily: string;
|
|
1692
|
-
fontWeight: string;
|
|
1693
|
-
fontSize: string;
|
|
1694
|
-
lineHeight: string;
|
|
1695
|
-
letterSpacing: string;
|
|
1696
|
-
};
|
|
1697
|
-
md: {
|
|
1698
|
-
fontFamily: string;
|
|
1699
|
-
fontWeight: string;
|
|
1700
|
-
fontSize: string;
|
|
1701
|
-
lineHeight: string;
|
|
1702
|
-
letterSpacing: string;
|
|
1703
|
-
};
|
|
1704
|
-
sm: {
|
|
1705
|
-
fontFamily: string;
|
|
1706
|
-
fontWeight: string;
|
|
1707
|
-
fontSize: string;
|
|
1708
|
-
lineHeight: string;
|
|
1709
|
-
letterSpacing: string;
|
|
1710
|
-
};
|
|
1711
|
-
xs: {
|
|
1712
|
-
fontFamily: string;
|
|
1713
|
-
fontWeight: string;
|
|
1714
|
-
fontSize: string;
|
|
1715
|
-
lineHeight: string;
|
|
1716
|
-
letterSpacing: string;
|
|
1717
|
-
};
|
|
1718
|
-
'2xs': {
|
|
1719
|
-
fontFamily: string;
|
|
1720
|
-
fontWeight: string;
|
|
1721
|
-
fontSize: string;
|
|
1722
|
-
lineHeight: string;
|
|
1723
|
-
letterSpacing: string;
|
|
1724
|
-
};
|
|
1725
|
-
'3xs': {
|
|
1726
|
-
fontFamily: string;
|
|
1727
|
-
fontWeight: string;
|
|
1728
|
-
fontSize: string;
|
|
1729
|
-
lineHeight: string;
|
|
1730
|
-
letterSpacing: string;
|
|
1731
|
-
};
|
|
1732
|
-
};
|
|
1733
|
-
body: {
|
|
1734
|
-
xl: {
|
|
1735
|
-
fontFamily: string;
|
|
1736
|
-
fontWeight: string;
|
|
1737
|
-
fontSize: string;
|
|
1738
|
-
lineHeight: string;
|
|
1739
|
-
letterSpacing: string;
|
|
1740
|
-
};
|
|
1741
|
-
lg: {
|
|
1742
|
-
fontFamily: string;
|
|
1743
|
-
fontWeight: string;
|
|
1744
|
-
fontSize: string;
|
|
1745
|
-
lineHeight: string;
|
|
1746
|
-
letterSpacing: string;
|
|
1747
|
-
};
|
|
1748
|
-
md: {
|
|
1749
|
-
fontFamily: string;
|
|
1750
|
-
fontWeight: string;
|
|
1751
|
-
fontSize: string;
|
|
1752
|
-
lineHeight: string;
|
|
1753
|
-
letterSpacing: string;
|
|
1754
|
-
};
|
|
1755
|
-
sm: {
|
|
1756
|
-
fontFamily: string;
|
|
1757
|
-
fontWeight: string;
|
|
1758
|
-
fontSize: string;
|
|
1759
|
-
lineHeight: string;
|
|
1760
|
-
letterSpacing: string;
|
|
1761
|
-
};
|
|
1762
|
-
xs: {
|
|
1763
|
-
fontFamily: string;
|
|
1764
|
-
fontWeight: string;
|
|
1765
|
-
fontSize: string;
|
|
1766
|
-
lineHeight: string;
|
|
1767
|
-
letterSpacing: string;
|
|
1768
|
-
};
|
|
1769
|
-
};
|
|
1770
|
-
label: {
|
|
1771
|
-
md: {
|
|
1772
|
-
fontFamily: string;
|
|
1773
|
-
fontWeight: string;
|
|
1774
|
-
fontSize: string;
|
|
1775
|
-
lineHeight: string;
|
|
1776
|
-
letterSpacing: string;
|
|
1777
|
-
};
|
|
1778
|
-
sm: {
|
|
1779
|
-
fontFamily: string;
|
|
1780
|
-
fontWeight: string;
|
|
1781
|
-
fontSize: string;
|
|
1782
|
-
lineHeight: string;
|
|
1783
|
-
letterSpacing: string;
|
|
1784
|
-
};
|
|
1785
|
-
};
|
|
1786
|
-
button: {
|
|
1787
|
-
md: {
|
|
1788
|
-
fontFamily: string;
|
|
1789
|
-
fontWeight: string;
|
|
1790
|
-
fontSize: string;
|
|
1791
|
-
lineHeight: string;
|
|
1792
|
-
letterSpacing: string;
|
|
1793
|
-
};
|
|
1794
|
-
sm: {
|
|
1795
|
-
fontFamily: string;
|
|
1796
|
-
fontWeight: string;
|
|
1797
|
-
fontSize: string;
|
|
1798
|
-
lineHeight: string;
|
|
1799
|
-
letterSpacing: string;
|
|
1800
|
-
};
|
|
1801
|
-
};
|
|
1802
|
-
caption: {
|
|
1803
|
-
md: {
|
|
1804
|
-
fontFamily: string;
|
|
1805
|
-
fontWeight: string;
|
|
1806
|
-
fontSize: string;
|
|
1807
|
-
lineHeight: string;
|
|
1808
|
-
letterSpacing: string;
|
|
1809
|
-
};
|
|
1810
|
-
sm: {
|
|
1811
|
-
fontFamily: string;
|
|
1812
|
-
fontWeight: string;
|
|
1813
|
-
fontSize: string;
|
|
1814
|
-
lineHeight: string;
|
|
1815
|
-
letterSpacing: string;
|
|
1816
|
-
};
|
|
1817
|
-
};
|
|
1826
|
+
button: {
|
|
1827
|
+
md: {
|
|
1828
|
+
fontFamily: string;
|
|
1829
|
+
fontWeight: string;
|
|
1830
|
+
fontSize: string;
|
|
1831
|
+
lineHeight: string;
|
|
1832
|
+
letterSpacing: string;
|
|
1833
|
+
};
|
|
1834
|
+
sm: {
|
|
1835
|
+
fontFamily: string;
|
|
1836
|
+
fontWeight: string;
|
|
1837
|
+
fontSize: string;
|
|
1838
|
+
lineHeight: string;
|
|
1839
|
+
letterSpacing: string;
|
|
1840
|
+
};
|
|
1818
1841
|
};
|
|
1842
|
+
caption: {
|
|
1843
|
+
md: {
|
|
1844
|
+
fontFamily: string;
|
|
1845
|
+
fontWeight: string;
|
|
1846
|
+
fontSize: string;
|
|
1847
|
+
lineHeight: string;
|
|
1848
|
+
letterSpacing: string;
|
|
1849
|
+
};
|
|
1850
|
+
sm: {
|
|
1851
|
+
fontFamily: string;
|
|
1852
|
+
fontWeight: string;
|
|
1853
|
+
fontSize: string;
|
|
1854
|
+
lineHeight: string;
|
|
1855
|
+
letterSpacing: string;
|
|
1856
|
+
};
|
|
1857
|
+
};
|
|
1858
|
+
};
|
|
1819
1859
|
};
|
|
1820
1860
|
/**
|
|
1821
1861
|
* @deprecated The `Theme` type is deprecated and will be removed in a future version.
|
|
1822
1862
|
*/
|
|
1823
1863
|
type Theme = typeof theme;
|
|
1824
|
-
|
|
1864
|
+
//#endregion
|
|
1865
|
+
//#region src/hooks/use-breakpoint.d.ts
|
|
1825
1866
|
type UseBreakpointOptions = {
|
|
1826
|
-
|
|
1827
|
-
|
|
1828
|
-
|
|
1829
|
-
|
|
1830
|
-
|
|
1831
|
-
|
|
1832
|
-
|
|
1867
|
+
/**
|
|
1868
|
+
* If `true` the initial value will be `base` instead of the current breakpoint.
|
|
1869
|
+
* This is to support hydration when using server side rendering.
|
|
1870
|
+
*
|
|
1871
|
+
* @default false
|
|
1872
|
+
*/
|
|
1873
|
+
ssr?: boolean;
|
|
1833
1874
|
};
|
|
1834
1875
|
/**
|
|
1835
1876
|
* Hook for getting the current breakpoint.
|
|
@@ -1840,12 +1881,13 @@ type UseBreakpointOptions = {
|
|
|
1840
1881
|
* `usehooks-ts`.
|
|
1841
1882
|
*/
|
|
1842
1883
|
declare function useBreakpoint(params?: UseBreakpointOptions): {
|
|
1843
|
-
|
|
1884
|
+
currentBreakpoint: "2xl" | "base" | "sm" | "md" | "lg" | "xl";
|
|
1844
1885
|
};
|
|
1845
|
-
|
|
1886
|
+
//#endregion
|
|
1887
|
+
//#region src/hooks/use-breakpoint-value.d.ts
|
|
1846
1888
|
type Breakpoints = Theme['breakpoints'];
|
|
1847
1889
|
type BreakpointsConfig<T> = PartialRecord<keyof Breakpoints, T> & {
|
|
1848
|
-
|
|
1890
|
+
base: T;
|
|
1849
1891
|
};
|
|
1850
1892
|
type UseBreakpointValueProps<T> = BreakpointsConfig<T>;
|
|
1851
1893
|
/**
|
|
@@ -1860,34 +1902,35 @@ type UseBreakpointValueProps<T> = BreakpointsConfig<T>;
|
|
|
1860
1902
|
* const width = useBreakpointValue({ base: '150px', md: '250px' })
|
|
1861
1903
|
*/
|
|
1862
1904
|
declare function useBreakpointValue<T>(values: UseBreakpointValueProps<T>, options?: UseBreakpointOptions): T;
|
|
1863
|
-
|
|
1905
|
+
//#endregion
|
|
1906
|
+
//#region src/hooks/use-form-field.d.ts
|
|
1864
1907
|
type FormFieldElement = 'input' | 'select' | 'textarea';
|
|
1865
1908
|
type PropGetter<T extends ElementType = LegitimateAny> = (props?: HTMLQdsProps<T>) => Record<string, unknown>;
|
|
1866
1909
|
type FormFieldOptions = {
|
|
1867
|
-
|
|
1868
|
-
|
|
1869
|
-
|
|
1870
|
-
|
|
1871
|
-
|
|
1872
|
-
|
|
1873
|
-
|
|
1874
|
-
|
|
1875
|
-
|
|
1876
|
-
|
|
1877
|
-
|
|
1878
|
-
|
|
1879
|
-
|
|
1880
|
-
|
|
1881
|
-
|
|
1882
|
-
|
|
1883
|
-
|
|
1884
|
-
|
|
1885
|
-
|
|
1886
|
-
|
|
1887
|
-
|
|
1888
|
-
|
|
1889
|
-
|
|
1890
|
-
|
|
1910
|
+
/**
|
|
1911
|
+
* The label for the form field
|
|
1912
|
+
*/
|
|
1913
|
+
label: string;
|
|
1914
|
+
/**
|
|
1915
|
+
* The error message to display if `isInvalid` is `true`
|
|
1916
|
+
*/
|
|
1917
|
+
errorMessage?: string;
|
|
1918
|
+
/**
|
|
1919
|
+
* Text that provides additional guidance to the user
|
|
1920
|
+
*/
|
|
1921
|
+
helperText?: string;
|
|
1922
|
+
/**
|
|
1923
|
+
* If `true`, the form field will be invalid
|
|
1924
|
+
*/
|
|
1925
|
+
isInvalid?: boolean;
|
|
1926
|
+
/**
|
|
1927
|
+
* If `true`, the form field will be disabled
|
|
1928
|
+
*/
|
|
1929
|
+
isDisabled?: boolean;
|
|
1930
|
+
/**
|
|
1931
|
+
* If `true` the form field will be required
|
|
1932
|
+
*/
|
|
1933
|
+
isRequired?: boolean;
|
|
1891
1934
|
};
|
|
1892
1935
|
type OmittedProps = 'children' | 'readOnly' | 'size';
|
|
1893
1936
|
type UseFormFieldProps<T extends FormFieldElement> = Omit<HTMLQdsProps<T>, OmittedProps> & FormFieldOptions;
|
|
@@ -1898,21 +1941,23 @@ type UseFormFieldProps<T extends FormFieldElement> = Omit<HTMLQdsProps<T>, Omitt
|
|
|
1898
1941
|
* Used internally by `TextField`, `Select` and `Textarea`.
|
|
1899
1942
|
*/
|
|
1900
1943
|
declare const useFormField: <T extends FormFieldElement>(props: UseFormFieldProps<T>) => {
|
|
1901
|
-
|
|
1902
|
-
|
|
1903
|
-
|
|
1904
|
-
|
|
1905
|
-
|
|
1906
|
-
|
|
1907
|
-
|
|
1908
|
-
|
|
1944
|
+
getLabelProps: PropGetter<"label">;
|
|
1945
|
+
/**
|
|
1946
|
+
* Props to be spread on the input, select or textarea element.
|
|
1947
|
+
* Function accepts an optional object of props to be merged with the returned props.
|
|
1948
|
+
*/
|
|
1949
|
+
getFieldProps: PropGetter<T>;
|
|
1950
|
+
getHelperTextProps: PropGetter<"div">;
|
|
1951
|
+
getErrorMessageProps: PropGetter<"div">;
|
|
1909
1952
|
};
|
|
1910
|
-
|
|
1953
|
+
//#endregion
|
|
1954
|
+
//#region src/hooks/use-stable-id.d.ts
|
|
1911
1955
|
/**
|
|
1912
1956
|
* Returns a stable ID that is unique to the component instance.
|
|
1913
1957
|
*/
|
|
1914
1958
|
declare function useStableId(fixedId?: string | null): string;
|
|
1915
|
-
|
|
1959
|
+
//#endregion
|
|
1960
|
+
//#region src/hooks/use-safe-layout-effect.d.ts
|
|
1916
1961
|
/**
|
|
1917
1962
|
* On the server, React emits a warning when calling `useLayoutEffect`.
|
|
1918
1963
|
* This is because neither `useLayoutEffect` nor `useEffect` run on the server.
|
|
@@ -1921,5 +1966,6 @@ declare function useStableId(fixedId?: string | null): string;
|
|
|
1921
1966
|
* See: https://reactjs.org/docs/hooks-reference.html#uselayouteffect
|
|
1922
1967
|
*/
|
|
1923
1968
|
declare const useSafeLayoutEffect: typeof useLayoutEffect;
|
|
1924
|
-
|
|
1925
|
-
export { AlertCircleIcon, AlertTriangleIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, Avatar,
|
|
1969
|
+
//#endregion
|
|
1970
|
+
export { AlertCircleIcon, AlertTriangleIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, Avatar, AvatarProps, BellIcon, BellOffIcon, BookmarkFilledIcon, BookmarkIcon, Button, type ButtonProps, CalendarIcon, CameraIcon, CheckCircleIcon, CheckIcon, Checkbox, CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CreateIconOptions, DisplayText, DisplayTextProps, Divider, DividerProps, DropdownMenu, type DropdownMenuContentProps, type DropdownMenuDividerProps, type DropdownMenuItemProps, type DropdownMenuRootProps, type DropdownMenuTriggerProps, type ForwardRefComponent, GlobeIcon, Heading, HeadingProps, HeartFilledIcon, HeartIcon, HelpCircleIcon, HintBox, HintBoxProps, HintBoxTitleProps, HistoryIcon, HomeIcon, IconButton, IconButtonProps, type IconProps, ImageIcon, InfoIcon, InputBase, InputBaseOptions, InputBaseProps, type IntrinsicElement, Label, LabelProps, Link, LinkProps, ListFilterIcon, ListIcon, LoadingDots, LoadingDotsProps, LogOutIcon, MapIcon, MapPinIcon, MenuIcon, MessageCircleIcon, MinusIcon, MoreHorizontalIcon, MoreVerticalIcon, type OwnProps, Paragraph, ParagraphProps, PenIcon, PlusIcon, type PropsOf, QdsProvider, type RadioButtonProps, type RadioCardProps, RadioGroup, type RadioGroupLabelProps, RadioGroupProps, SearchIcon, Select, SelectBase, SelectBaseOptions, type SelectOptionProps, SelectProps, SettingsIcon, ShareIcon, SlidersIcon, Spacer, SpacerProps, Stack, StackProps, StarFilledIcon, StarIcon, Switch, SwitchProps, TextField, TextFieldProps, Textarea, TextareaBase, TextareaBaseOptions, TextareaBaseProps, TextareaProps, Theme, Toast, TrashIcon, UseBreakpointOptions, UseBreakpointValueProps, UseFormFieldProps, UserIcon, XCircleIcon, XIcon, createIcon, createLucideIcon, pxToRem, theme, toast, useBreakpoint, useBreakpointValue, useFormField, useSafeLayoutEffect, useStableId };
|
|
1971
|
+
//# sourceMappingURL=index.d.ts.map
|