@sidecar-ai/native 0.1.0-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/index.d.ts +2232 -0
- package/dist/components/index.js +1628 -0
- package/dist/components/index.js.map +1 -0
- package/dist/index.d.ts +61 -0
- package/dist/index.js +1829 -0
- package/dist/index.js.map +1 -0
- package/dist/styles.css +1273 -0
- package/package.json +29 -0
|
@@ -0,0 +1,2232 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Host-adaptive React components for Sidecar widgets.
|
|
5
|
+
*
|
|
6
|
+
* The public props intentionally track the shared OpenAI Apps SDK UI surface
|
|
7
|
+
* where the same primitive can sensibly exist in Claude. Runtime styling is
|
|
8
|
+
* selected with `data-sc-recipe`; `auto` follows the widget host, while scoped
|
|
9
|
+
* packages pin a recipe explicitly.
|
|
10
|
+
*/
|
|
11
|
+
|
|
12
|
+
/** Host recipe pinned by scoped packages or selected dynamically by native. */
|
|
13
|
+
type ComponentRecipe = "auto" | "chatgpt" | "claude" | "generic";
|
|
14
|
+
/** Size tokens mirrored from the OpenAI Apps SDK UI scale. */
|
|
15
|
+
type Size = "5xs" | "4xs" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl";
|
|
16
|
+
/** Generic constrained size helper. */
|
|
17
|
+
type Sizes<T extends Size = Size> = T;
|
|
18
|
+
/** Control height scale used by buttons, inputs, and related controls. */
|
|
19
|
+
type ControlSize = Sizes<"3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl">;
|
|
20
|
+
/** Semantic color tokens common to portable Sidecar controls. */
|
|
21
|
+
type SemanticColor = "primary" | "secondary" | "danger" | "success" | "warning" | "caution" | "discovery" | "info";
|
|
22
|
+
/** Generic constrained semantic color helper. */
|
|
23
|
+
type SemanticColors<T extends SemanticColor = SemanticColor> = T;
|
|
24
|
+
/** Visual variants common to portable controls. */
|
|
25
|
+
type Variant = "solid" | "soft" | "outline" | "ghost";
|
|
26
|
+
/** Generic constrained variant helper. */
|
|
27
|
+
type Variants<T extends Variant = Variant> = T;
|
|
28
|
+
/** Legacy intent alias retained for early Sidecar examples. */
|
|
29
|
+
type ControlIntent = SemanticColor | "ghost";
|
|
30
|
+
/** Common props accepted by all Sidecar native components. */
|
|
31
|
+
type PrimitiveProps = {
|
|
32
|
+
/** Internal recipe override used by scoped host packages. */
|
|
33
|
+
recipe?: ComponentRecipe;
|
|
34
|
+
};
|
|
35
|
+
type Alignment = "start" | "center" | "end";
|
|
36
|
+
type Direction = "col" | "row";
|
|
37
|
+
type ButtonVisualProps = PrimitiveProps & {
|
|
38
|
+
/**
|
|
39
|
+
* Semantic color for the button.
|
|
40
|
+
* @default "secondary"
|
|
41
|
+
*/
|
|
42
|
+
color?: SemanticColors<"primary" | "secondary" | "danger" | "success" | "info" | "discovery" | "caution" | "warning">;
|
|
43
|
+
/**
|
|
44
|
+
* Visual style for the button.
|
|
45
|
+
* @default "solid"
|
|
46
|
+
*/
|
|
47
|
+
variant?: Variants<"solid" | "soft" | "outline" | "ghost"> | ControlIntent;
|
|
48
|
+
/** Backward-compatible alias for `color` from early Sidecar examples. */
|
|
49
|
+
intent?: ControlIntent;
|
|
50
|
+
/**
|
|
51
|
+
* Determines if the button should be a fully rounded pill shape.
|
|
52
|
+
* @default true
|
|
53
|
+
*/
|
|
54
|
+
pill?: boolean;
|
|
55
|
+
/** Controls disabled cursor treatment without changing disabled semantics. */
|
|
56
|
+
disabledTone?: "relaxed";
|
|
57
|
+
/**
|
|
58
|
+
* Extends the control to 100% of available width.
|
|
59
|
+
* @default false
|
|
60
|
+
*/
|
|
61
|
+
block?: boolean;
|
|
62
|
+
/** Applies a negative margin to optically align with surrounding content. */
|
|
63
|
+
opticallyAlign?: "start" | "end";
|
|
64
|
+
/**
|
|
65
|
+
* Controls button height and default icon/text scale.
|
|
66
|
+
* @default "md"
|
|
67
|
+
*/
|
|
68
|
+
size?: ControlSize;
|
|
69
|
+
/** Explicit icon size override. */
|
|
70
|
+
iconSize?: Sizes<"sm" | "md" | "lg" | "xl" | "2xl">;
|
|
71
|
+
/** Explicit horizontal gutter override. */
|
|
72
|
+
gutterSize?: Sizes<"3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
73
|
+
/**
|
|
74
|
+
* Makes the button width match its height.
|
|
75
|
+
* @default false
|
|
76
|
+
*/
|
|
77
|
+
uniform?: boolean;
|
|
78
|
+
/**
|
|
79
|
+
* Displays selected styles on the button.
|
|
80
|
+
* @default false
|
|
81
|
+
*/
|
|
82
|
+
selected?: boolean;
|
|
83
|
+
/**
|
|
84
|
+
* Displays loading indicator and disables interaction.
|
|
85
|
+
* @default false
|
|
86
|
+
*/
|
|
87
|
+
loading?: boolean;
|
|
88
|
+
/**
|
|
89
|
+
* Makes the button inert without changing visual treatment.
|
|
90
|
+
* @default false
|
|
91
|
+
*/
|
|
92
|
+
inert?: boolean;
|
|
93
|
+
};
|
|
94
|
+
/** Props for Sidecar's portable button primitive. */
|
|
95
|
+
type ButtonProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "color"> & ButtonVisualProps;
|
|
96
|
+
/** Portable button with host-adaptive visual recipes. */
|
|
97
|
+
declare const Button: React.ForwardRefExoticComponent<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "color"> & PrimitiveProps & {
|
|
98
|
+
/**
|
|
99
|
+
* Semantic color for the button.
|
|
100
|
+
* @default "secondary"
|
|
101
|
+
*/
|
|
102
|
+
color?: SemanticColors<"primary" | "secondary" | "danger" | "success" | "info" | "discovery" | "caution" | "warning">;
|
|
103
|
+
/**
|
|
104
|
+
* Visual style for the button.
|
|
105
|
+
* @default "solid"
|
|
106
|
+
*/
|
|
107
|
+
variant?: Variants<"solid" | "soft" | "outline" | "ghost"> | ControlIntent;
|
|
108
|
+
/** Backward-compatible alias for `color` from early Sidecar examples. */
|
|
109
|
+
intent?: ControlIntent;
|
|
110
|
+
/**
|
|
111
|
+
* Determines if the button should be a fully rounded pill shape.
|
|
112
|
+
* @default true
|
|
113
|
+
*/
|
|
114
|
+
pill?: boolean;
|
|
115
|
+
/** Controls disabled cursor treatment without changing disabled semantics. */
|
|
116
|
+
disabledTone?: "relaxed";
|
|
117
|
+
/**
|
|
118
|
+
* Extends the control to 100% of available width.
|
|
119
|
+
* @default false
|
|
120
|
+
*/
|
|
121
|
+
block?: boolean;
|
|
122
|
+
/** Applies a negative margin to optically align with surrounding content. */
|
|
123
|
+
opticallyAlign?: "start" | "end";
|
|
124
|
+
/**
|
|
125
|
+
* Controls button height and default icon/text scale.
|
|
126
|
+
* @default "md"
|
|
127
|
+
*/
|
|
128
|
+
size?: ControlSize;
|
|
129
|
+
/** Explicit icon size override. */
|
|
130
|
+
iconSize?: Sizes<"sm" | "md" | "lg" | "xl" | "2xl">;
|
|
131
|
+
/** Explicit horizontal gutter override. */
|
|
132
|
+
gutterSize?: Sizes<"3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
133
|
+
/**
|
|
134
|
+
* Makes the button width match its height.
|
|
135
|
+
* @default false
|
|
136
|
+
*/
|
|
137
|
+
uniform?: boolean;
|
|
138
|
+
/**
|
|
139
|
+
* Displays selected styles on the button.
|
|
140
|
+
* @default false
|
|
141
|
+
*/
|
|
142
|
+
selected?: boolean;
|
|
143
|
+
/**
|
|
144
|
+
* Displays loading indicator and disables interaction.
|
|
145
|
+
* @default false
|
|
146
|
+
*/
|
|
147
|
+
loading?: boolean;
|
|
148
|
+
/**
|
|
149
|
+
* Makes the button inert without changing visual treatment.
|
|
150
|
+
* @default false
|
|
151
|
+
*/
|
|
152
|
+
inert?: boolean;
|
|
153
|
+
} & React.RefAttributes<HTMLButtonElement>>;
|
|
154
|
+
/** Props for a link styled as a host-adaptive button. */
|
|
155
|
+
type ButtonLinkProps = Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "color"> & ButtonVisualProps & {
|
|
156
|
+
/** Forces external-link treatment when automatic detection is insufficient. */
|
|
157
|
+
external?: boolean;
|
|
158
|
+
};
|
|
159
|
+
/** Anchor element with the same visual language as `Button`. */
|
|
160
|
+
declare const ButtonLink: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "color"> & PrimitiveProps & {
|
|
161
|
+
/**
|
|
162
|
+
* Semantic color for the button.
|
|
163
|
+
* @default "secondary"
|
|
164
|
+
*/
|
|
165
|
+
color?: SemanticColors<"primary" | "secondary" | "danger" | "success" | "info" | "discovery" | "caution" | "warning">;
|
|
166
|
+
/**
|
|
167
|
+
* Visual style for the button.
|
|
168
|
+
* @default "solid"
|
|
169
|
+
*/
|
|
170
|
+
variant?: Variants<"solid" | "soft" | "outline" | "ghost"> | ControlIntent;
|
|
171
|
+
/** Backward-compatible alias for `color` from early Sidecar examples. */
|
|
172
|
+
intent?: ControlIntent;
|
|
173
|
+
/**
|
|
174
|
+
* Determines if the button should be a fully rounded pill shape.
|
|
175
|
+
* @default true
|
|
176
|
+
*/
|
|
177
|
+
pill?: boolean;
|
|
178
|
+
/** Controls disabled cursor treatment without changing disabled semantics. */
|
|
179
|
+
disabledTone?: "relaxed";
|
|
180
|
+
/**
|
|
181
|
+
* Extends the control to 100% of available width.
|
|
182
|
+
* @default false
|
|
183
|
+
*/
|
|
184
|
+
block?: boolean;
|
|
185
|
+
/** Applies a negative margin to optically align with surrounding content. */
|
|
186
|
+
opticallyAlign?: "start" | "end";
|
|
187
|
+
/**
|
|
188
|
+
* Controls button height and default icon/text scale.
|
|
189
|
+
* @default "md"
|
|
190
|
+
*/
|
|
191
|
+
size?: ControlSize;
|
|
192
|
+
/** Explicit icon size override. */
|
|
193
|
+
iconSize?: Sizes<"sm" | "md" | "lg" | "xl" | "2xl">;
|
|
194
|
+
/** Explicit horizontal gutter override. */
|
|
195
|
+
gutterSize?: Sizes<"3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
196
|
+
/**
|
|
197
|
+
* Makes the button width match its height.
|
|
198
|
+
* @default false
|
|
199
|
+
*/
|
|
200
|
+
uniform?: boolean;
|
|
201
|
+
/**
|
|
202
|
+
* Displays selected styles on the button.
|
|
203
|
+
* @default false
|
|
204
|
+
*/
|
|
205
|
+
selected?: boolean;
|
|
206
|
+
/**
|
|
207
|
+
* Displays loading indicator and disables interaction.
|
|
208
|
+
* @default false
|
|
209
|
+
*/
|
|
210
|
+
loading?: boolean;
|
|
211
|
+
/**
|
|
212
|
+
* Makes the button inert without changing visual treatment.
|
|
213
|
+
* @default false
|
|
214
|
+
*/
|
|
215
|
+
inert?: boolean;
|
|
216
|
+
} & {
|
|
217
|
+
/** Forces external-link treatment when automatic detection is insufficient. */
|
|
218
|
+
external?: boolean;
|
|
219
|
+
} & React.RefAttributes<HTMLAnchorElement>>;
|
|
220
|
+
/** Clipboard content accepted by `CopyButton`. */
|
|
221
|
+
type ClipboardContent = string | Record<string, string>;
|
|
222
|
+
/** Props for a host-adaptive copy button. */
|
|
223
|
+
type CopyButtonProps = {
|
|
224
|
+
/** Text or MIME map to place on the clipboard. */
|
|
225
|
+
copyValue: ClipboardContent | (() => ClipboardContent);
|
|
226
|
+
/** Custom button content, optionally as a render function. */
|
|
227
|
+
children?: React.ReactNode | ((props: {
|
|
228
|
+
copied: boolean;
|
|
229
|
+
}) => React.ReactNode);
|
|
230
|
+
} & Omit<ButtonProps, "children">;
|
|
231
|
+
/** Button that copies text to the clipboard with a short copied state. */
|
|
232
|
+
declare function CopyButton({ children, copyValue, onClick, ...restProps }: CopyButtonProps): React.FunctionComponentElement<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "color"> & PrimitiveProps & {
|
|
233
|
+
/**
|
|
234
|
+
* Semantic color for the button.
|
|
235
|
+
* @default "secondary"
|
|
236
|
+
*/
|
|
237
|
+
color?: SemanticColors<"primary" | "secondary" | "danger" | "success" | "info" | "discovery" | "caution" | "warning">;
|
|
238
|
+
/**
|
|
239
|
+
* Visual style for the button.
|
|
240
|
+
* @default "solid"
|
|
241
|
+
*/
|
|
242
|
+
variant?: Variants<"solid" | "soft" | "outline" | "ghost"> | ControlIntent;
|
|
243
|
+
/** Backward-compatible alias for `color` from early Sidecar examples. */
|
|
244
|
+
intent?: ControlIntent;
|
|
245
|
+
/**
|
|
246
|
+
* Determines if the button should be a fully rounded pill shape.
|
|
247
|
+
* @default true
|
|
248
|
+
*/
|
|
249
|
+
pill?: boolean;
|
|
250
|
+
/** Controls disabled cursor treatment without changing disabled semantics. */
|
|
251
|
+
disabledTone?: "relaxed";
|
|
252
|
+
/**
|
|
253
|
+
* Extends the control to 100% of available width.
|
|
254
|
+
* @default false
|
|
255
|
+
*/
|
|
256
|
+
block?: boolean;
|
|
257
|
+
/** Applies a negative margin to optically align with surrounding content. */
|
|
258
|
+
opticallyAlign?: "start" | "end";
|
|
259
|
+
/**
|
|
260
|
+
* Controls button height and default icon/text scale.
|
|
261
|
+
* @default "md"
|
|
262
|
+
*/
|
|
263
|
+
size?: ControlSize;
|
|
264
|
+
/** Explicit icon size override. */
|
|
265
|
+
iconSize?: Sizes<"sm" | "md" | "lg" | "xl" | "2xl">;
|
|
266
|
+
/** Explicit horizontal gutter override. */
|
|
267
|
+
gutterSize?: Sizes<"3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
268
|
+
/**
|
|
269
|
+
* Makes the button width match its height.
|
|
270
|
+
* @default false
|
|
271
|
+
*/
|
|
272
|
+
uniform?: boolean;
|
|
273
|
+
/**
|
|
274
|
+
* Displays selected styles on the button.
|
|
275
|
+
* @default false
|
|
276
|
+
*/
|
|
277
|
+
selected?: boolean;
|
|
278
|
+
/**
|
|
279
|
+
* Displays loading indicator and disables interaction.
|
|
280
|
+
* @default false
|
|
281
|
+
*/
|
|
282
|
+
loading?: boolean;
|
|
283
|
+
/**
|
|
284
|
+
* Makes the button inert without changing visual treatment.
|
|
285
|
+
* @default false
|
|
286
|
+
*/
|
|
287
|
+
inert?: boolean;
|
|
288
|
+
} & React.RefAttributes<HTMLButtonElement>>;
|
|
289
|
+
/** Props for text blocks that align with the active host typography. */
|
|
290
|
+
type TextProps = React.HTMLAttributes<HTMLParagraphElement> & PrimitiveProps & {
|
|
291
|
+
tone?: "default" | "muted" | "success" | "warning" | "danger";
|
|
292
|
+
};
|
|
293
|
+
/** Host-adaptive paragraph text. */
|
|
294
|
+
declare const Text: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & PrimitiveProps & {
|
|
295
|
+
tone?: "default" | "muted" | "success" | "warning" | "danger";
|
|
296
|
+
} & React.RefAttributes<HTMLParagraphElement>>;
|
|
297
|
+
/** Props for compact section headings. */
|
|
298
|
+
type HeadingProps = React.HTMLAttributes<HTMLHeadingElement> & PrimitiveProps & {
|
|
299
|
+
level?: 1 | 2 | 3 | 4;
|
|
300
|
+
};
|
|
301
|
+
/** Host-adaptive heading component with compact widget defaults. */
|
|
302
|
+
declare const Heading: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & PrimitiveProps & {
|
|
303
|
+
level?: 1 | 2 | 3 | 4;
|
|
304
|
+
} & React.RefAttributes<HTMLHeadingElement>>;
|
|
305
|
+
/** Props for a host-adaptive single-line text input. */
|
|
306
|
+
type InputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, "disabled" | "size"> & PrimitiveProps & {
|
|
307
|
+
/** Visual style of the input. */
|
|
308
|
+
variant?: Variants<"outline" | "soft">;
|
|
309
|
+
/** Control size. */
|
|
310
|
+
size?: ControlSize;
|
|
311
|
+
/** Explicit horizontal gutter override. */
|
|
312
|
+
gutterSize?: Sizes<"2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
313
|
+
/** Disables the input visually and from interactions. */
|
|
314
|
+
disabled?: boolean;
|
|
315
|
+
/** Marks the input as invalid. */
|
|
316
|
+
invalid?: boolean;
|
|
317
|
+
/** Allow autofill extensions to appear in the input. */
|
|
318
|
+
allowAutofillExtensions?: boolean;
|
|
319
|
+
/** Selects all contents when the input mounts. */
|
|
320
|
+
autoSelect?: boolean;
|
|
321
|
+
/** Callback invoked when browser autofill is detected. */
|
|
322
|
+
onAutofill?: () => void;
|
|
323
|
+
/** Content rendered at the start of the control. */
|
|
324
|
+
startAdornment?: React.ReactNode;
|
|
325
|
+
/** Content rendered at the end of the control. */
|
|
326
|
+
endAdornment?: React.ReactNode;
|
|
327
|
+
/** Fully rounded pill shape. */
|
|
328
|
+
pill?: boolean;
|
|
329
|
+
/** Extends the control to 100% width. */
|
|
330
|
+
block?: boolean;
|
|
331
|
+
/** Applies a negative margin to optically align with surrounding content. */
|
|
332
|
+
opticallyAlign?: "start" | "end";
|
|
333
|
+
};
|
|
334
|
+
/** Portable single-line input styled through the active host recipe. */
|
|
335
|
+
declare const Input: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "disabled"> & PrimitiveProps & {
|
|
336
|
+
/** Visual style of the input. */
|
|
337
|
+
variant?: Variants<"outline" | "soft">;
|
|
338
|
+
/** Control size. */
|
|
339
|
+
size?: ControlSize;
|
|
340
|
+
/** Explicit horizontal gutter override. */
|
|
341
|
+
gutterSize?: Sizes<"2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
342
|
+
/** Disables the input visually and from interactions. */
|
|
343
|
+
disabled?: boolean;
|
|
344
|
+
/** Marks the input as invalid. */
|
|
345
|
+
invalid?: boolean;
|
|
346
|
+
/** Allow autofill extensions to appear in the input. */
|
|
347
|
+
allowAutofillExtensions?: boolean;
|
|
348
|
+
/** Selects all contents when the input mounts. */
|
|
349
|
+
autoSelect?: boolean;
|
|
350
|
+
/** Callback invoked when browser autofill is detected. */
|
|
351
|
+
onAutofill?: () => void;
|
|
352
|
+
/** Content rendered at the start of the control. */
|
|
353
|
+
startAdornment?: React.ReactNode;
|
|
354
|
+
/** Content rendered at the end of the control. */
|
|
355
|
+
endAdornment?: React.ReactNode;
|
|
356
|
+
/** Fully rounded pill shape. */
|
|
357
|
+
pill?: boolean;
|
|
358
|
+
/** Extends the control to 100% width. */
|
|
359
|
+
block?: boolean;
|
|
360
|
+
/** Applies a negative margin to optically align with surrounding content. */
|
|
361
|
+
opticallyAlign?: "start" | "end";
|
|
362
|
+
} & React.RefAttributes<HTMLInputElement>>;
|
|
363
|
+
/** Backward-compatible alias for early Sidecar examples. */
|
|
364
|
+
declare const TextField: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "disabled"> & PrimitiveProps & {
|
|
365
|
+
/** Visual style of the input. */
|
|
366
|
+
variant?: Variants<"outline" | "soft">;
|
|
367
|
+
/** Control size. */
|
|
368
|
+
size?: ControlSize;
|
|
369
|
+
/** Explicit horizontal gutter override. */
|
|
370
|
+
gutterSize?: Sizes<"2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
371
|
+
/** Disables the input visually and from interactions. */
|
|
372
|
+
disabled?: boolean;
|
|
373
|
+
/** Marks the input as invalid. */
|
|
374
|
+
invalid?: boolean;
|
|
375
|
+
/** Allow autofill extensions to appear in the input. */
|
|
376
|
+
allowAutofillExtensions?: boolean;
|
|
377
|
+
/** Selects all contents when the input mounts. */
|
|
378
|
+
autoSelect?: boolean;
|
|
379
|
+
/** Callback invoked when browser autofill is detected. */
|
|
380
|
+
onAutofill?: () => void;
|
|
381
|
+
/** Content rendered at the start of the control. */
|
|
382
|
+
startAdornment?: React.ReactNode;
|
|
383
|
+
/** Content rendered at the end of the control. */
|
|
384
|
+
endAdornment?: React.ReactNode;
|
|
385
|
+
/** Fully rounded pill shape. */
|
|
386
|
+
pill?: boolean;
|
|
387
|
+
/** Extends the control to 100% width. */
|
|
388
|
+
block?: boolean;
|
|
389
|
+
/** Applies a negative margin to optically align with surrounding content. */
|
|
390
|
+
opticallyAlign?: "start" | "end";
|
|
391
|
+
} & React.RefAttributes<HTMLInputElement>>;
|
|
392
|
+
type TextFieldProps = InputProps;
|
|
393
|
+
/** Props for a multi-line text input. */
|
|
394
|
+
type TextareaProps = Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "disabled" | "size"> & PrimitiveProps & {
|
|
395
|
+
/** Visual style of the textarea. */
|
|
396
|
+
variant?: Variants<"outline" | "soft">;
|
|
397
|
+
/** Control size. */
|
|
398
|
+
size?: ControlSize;
|
|
399
|
+
/** Explicit horizontal gutter override. */
|
|
400
|
+
gutterSize?: Sizes<"2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
401
|
+
disabled?: boolean;
|
|
402
|
+
invalid?: boolean;
|
|
403
|
+
allowAutofillExtensions?: boolean;
|
|
404
|
+
autoSelect?: boolean;
|
|
405
|
+
onAutofill?: () => void;
|
|
406
|
+
autoResize?: boolean;
|
|
407
|
+
maxRows?: number;
|
|
408
|
+
pill?: boolean;
|
|
409
|
+
block?: boolean;
|
|
410
|
+
opticallyAlign?: "start" | "end";
|
|
411
|
+
};
|
|
412
|
+
/** Portable textarea styled through the active host recipe. */
|
|
413
|
+
declare const Textarea: React.ForwardRefExoticComponent<Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "size" | "disabled"> & PrimitiveProps & {
|
|
414
|
+
/** Visual style of the textarea. */
|
|
415
|
+
variant?: Variants<"outline" | "soft">;
|
|
416
|
+
/** Control size. */
|
|
417
|
+
size?: ControlSize;
|
|
418
|
+
/** Explicit horizontal gutter override. */
|
|
419
|
+
gutterSize?: Sizes<"2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
420
|
+
disabled?: boolean;
|
|
421
|
+
invalid?: boolean;
|
|
422
|
+
allowAutofillExtensions?: boolean;
|
|
423
|
+
autoSelect?: boolean;
|
|
424
|
+
onAutofill?: () => void;
|
|
425
|
+
autoResize?: boolean;
|
|
426
|
+
maxRows?: number;
|
|
427
|
+
pill?: boolean;
|
|
428
|
+
block?: boolean;
|
|
429
|
+
opticallyAlign?: "start" | "end";
|
|
430
|
+
} & React.RefAttributes<HTMLTextAreaElement>>;
|
|
431
|
+
/** State accepted by host-adaptive checkboxes. */
|
|
432
|
+
type CheckboxState = boolean | "indeterminate";
|
|
433
|
+
/** Props for a host-adaptive checkbox. */
|
|
434
|
+
type CheckboxProps = PrimitiveProps & {
|
|
435
|
+
id?: string;
|
|
436
|
+
defaultChecked?: CheckboxState;
|
|
437
|
+
checked?: CheckboxState;
|
|
438
|
+
label?: React.ReactNode;
|
|
439
|
+
onCheckedChange?: (nextState: boolean) => void;
|
|
440
|
+
onBlur?: React.FocusEventHandler<HTMLButtonElement>;
|
|
441
|
+
onFocus?: React.FocusEventHandler<HTMLButtonElement>;
|
|
442
|
+
disabled?: boolean;
|
|
443
|
+
required?: boolean;
|
|
444
|
+
name?: string;
|
|
445
|
+
value?: string;
|
|
446
|
+
className?: string;
|
|
447
|
+
orientation?: "left" | "right";
|
|
448
|
+
};
|
|
449
|
+
/** Portable checkbox with optional inline label. */
|
|
450
|
+
declare function Checkbox({ checked, className, defaultChecked, disabled, id, label, name, onBlur, onCheckedChange, onFocus, orientation, recipe, required, value, }: CheckboxProps): React.DetailedReactHTMLElement<{
|
|
451
|
+
className: string | undefined;
|
|
452
|
+
"data-sc-component": string;
|
|
453
|
+
"data-sc-orientation": "left" | "right";
|
|
454
|
+
"data-sc-recipe": ComponentRecipe;
|
|
455
|
+
}, HTMLElement>;
|
|
456
|
+
/** Props for a host-adaptive switch. */
|
|
457
|
+
type SwitchProps = PrimitiveProps & {
|
|
458
|
+
id?: string;
|
|
459
|
+
defaultChecked?: boolean;
|
|
460
|
+
checked?: boolean;
|
|
461
|
+
label?: React.ReactNode;
|
|
462
|
+
onCheckedChange?: (nextState: boolean) => void;
|
|
463
|
+
onBlur?: React.FocusEventHandler<HTMLButtonElement>;
|
|
464
|
+
onFocus?: React.FocusEventHandler<HTMLButtonElement>;
|
|
465
|
+
disabled?: boolean;
|
|
466
|
+
required?: boolean;
|
|
467
|
+
name?: string;
|
|
468
|
+
value?: string;
|
|
469
|
+
className?: string;
|
|
470
|
+
labelPosition?: "start" | "end";
|
|
471
|
+
};
|
|
472
|
+
/** Binary switch control with optional inline label. */
|
|
473
|
+
declare function Switch({ checked, className, defaultChecked, disabled, id, label, labelPosition, name, onBlur, onCheckedChange, onFocus, recipe, required, value, }: SwitchProps): React.DetailedReactHTMLElement<{
|
|
474
|
+
className: string | undefined;
|
|
475
|
+
"data-sc-component": string;
|
|
476
|
+
"data-sc-label-position": "start" | "end";
|
|
477
|
+
"data-sc-recipe": ComponentRecipe;
|
|
478
|
+
}, HTMLElement>;
|
|
479
|
+
/** Props for grouped radio choices. */
|
|
480
|
+
type RadioGroupProps<T extends string = string> = PrimitiveProps & {
|
|
481
|
+
defaultValue?: T;
|
|
482
|
+
value?: T;
|
|
483
|
+
name?: string;
|
|
484
|
+
onChange?: (value: T) => void;
|
|
485
|
+
/** Accessible label for the radio options. */
|
|
486
|
+
"aria-label": string;
|
|
487
|
+
/**
|
|
488
|
+
* Determines the layout direction of the radio items.
|
|
489
|
+
* @default "row"
|
|
490
|
+
*/
|
|
491
|
+
direction?: Direction;
|
|
492
|
+
disabled?: boolean;
|
|
493
|
+
className?: string;
|
|
494
|
+
children: React.ReactNode;
|
|
495
|
+
required?: boolean;
|
|
496
|
+
};
|
|
497
|
+
/** Props for one radio option. */
|
|
498
|
+
type RadioGroupItemProps<T extends string = string> = {
|
|
499
|
+
value: T;
|
|
500
|
+
disabled?: boolean;
|
|
501
|
+
required?: boolean;
|
|
502
|
+
block?: boolean;
|
|
503
|
+
className?: string;
|
|
504
|
+
children: React.ReactNode;
|
|
505
|
+
};
|
|
506
|
+
type RadioGroupContextValue = {
|
|
507
|
+
disabled: boolean;
|
|
508
|
+
name?: string;
|
|
509
|
+
onChange(value: string): void;
|
|
510
|
+
recipe: ComponentRecipe;
|
|
511
|
+
required: boolean;
|
|
512
|
+
value?: string;
|
|
513
|
+
};
|
|
514
|
+
declare function RadioGroupRoot<T extends string>({ children, className, defaultValue, direction, disabled, name, onChange, recipe, required, value, ...restProps }: RadioGroupProps<T>): React.FunctionComponentElement<React.ProviderProps<RadioGroupContextValue | null>>;
|
|
515
|
+
declare function RadioGroupItem<T extends string>({ block, children, className, disabled, required, value, }: RadioGroupItemProps<T>): React.DetailedReactHTMLElement<{
|
|
516
|
+
"aria-checked": boolean;
|
|
517
|
+
className: string | undefined;
|
|
518
|
+
disabled: boolean;
|
|
519
|
+
onClick: () => void;
|
|
520
|
+
role: "radio";
|
|
521
|
+
type: string;
|
|
522
|
+
"data-sc-block": string | undefined;
|
|
523
|
+
"data-sc-checked": string | undefined;
|
|
524
|
+
"data-sc-component": string;
|
|
525
|
+
"data-sc-disabled": string | undefined;
|
|
526
|
+
"data-sc-recipe": ComponentRecipe;
|
|
527
|
+
}, HTMLElement>;
|
|
528
|
+
/** Fieldset-compatible radio group with typed option values. */
|
|
529
|
+
declare const RadioGroup: typeof RadioGroupRoot & {
|
|
530
|
+
Item: typeof RadioGroupItem;
|
|
531
|
+
};
|
|
532
|
+
/** Props for grouped segmented buttons. */
|
|
533
|
+
type SegmentedControlProps<T extends string = string> = PrimitiveProps & {
|
|
534
|
+
value?: T;
|
|
535
|
+
defaultValue?: T;
|
|
536
|
+
onChange?: (nextValue: T) => void;
|
|
537
|
+
onClick?: () => void;
|
|
538
|
+
"aria-label": string;
|
|
539
|
+
size?: ControlSize;
|
|
540
|
+
gutterSize?: Sizes<"2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
541
|
+
disabled?: boolean;
|
|
542
|
+
block?: boolean;
|
|
543
|
+
pill?: boolean;
|
|
544
|
+
className?: string;
|
|
545
|
+
children: React.ReactNode;
|
|
546
|
+
};
|
|
547
|
+
/** Props for one segmented-control option. */
|
|
548
|
+
type SegmentedControlOptionProps = {
|
|
549
|
+
value: string;
|
|
550
|
+
"aria-label"?: string;
|
|
551
|
+
children: React.ReactNode;
|
|
552
|
+
disabled?: boolean;
|
|
553
|
+
};
|
|
554
|
+
type SegmentedControlContextValue = {
|
|
555
|
+
disabled: boolean;
|
|
556
|
+
onClick?: () => void;
|
|
557
|
+
onChange(value: string): void;
|
|
558
|
+
recipe: ComponentRecipe;
|
|
559
|
+
selected?: string;
|
|
560
|
+
};
|
|
561
|
+
declare function SegmentedControlRoot<T extends string>({ block, children, className, defaultValue, disabled, gutterSize, onChange, onClick, pill, recipe, size, value, ...restProps }: SegmentedControlProps<T>): React.FunctionComponentElement<React.ProviderProps<SegmentedControlContextValue | null>>;
|
|
562
|
+
declare function SegmentedControlOption({ children, disabled, value, ...restProps }: SegmentedControlOptionProps): React.DetailedReactHTMLElement<{
|
|
563
|
+
"aria-pressed": boolean;
|
|
564
|
+
disabled: boolean;
|
|
565
|
+
onClick: () => void;
|
|
566
|
+
type: string;
|
|
567
|
+
"data-sc-component": string;
|
|
568
|
+
"data-sc-disabled": string | undefined;
|
|
569
|
+
"data-sc-recipe": ComponentRecipe;
|
|
570
|
+
"data-sc-selected": string | undefined;
|
|
571
|
+
"aria-label"?: string;
|
|
572
|
+
}, HTMLElement>;
|
|
573
|
+
/** Compact segmented-control container with compound options. */
|
|
574
|
+
declare const SegmentedControl: typeof SegmentedControlRoot & {
|
|
575
|
+
Option: typeof SegmentedControlOption;
|
|
576
|
+
};
|
|
577
|
+
/** Select option displayed in `Select`. */
|
|
578
|
+
type Option<T extends string = string> = {
|
|
579
|
+
value: T;
|
|
580
|
+
label: string;
|
|
581
|
+
disabled?: boolean;
|
|
582
|
+
description?: React.ReactNode;
|
|
583
|
+
tooltip?: {
|
|
584
|
+
content: React.ReactNode;
|
|
585
|
+
maxWidth?: number;
|
|
586
|
+
};
|
|
587
|
+
};
|
|
588
|
+
/** Labeled select option group. */
|
|
589
|
+
type OptionGroup<T extends Option = Option> = {
|
|
590
|
+
label: string;
|
|
591
|
+
options: T[];
|
|
592
|
+
optionsLimit?: {
|
|
593
|
+
label: string;
|
|
594
|
+
limit: number;
|
|
595
|
+
};
|
|
596
|
+
};
|
|
597
|
+
/** Flat or grouped select options. */
|
|
598
|
+
type Options<T extends Option = Option> = T[] | OptionGroup<T>[];
|
|
599
|
+
type CallbackWithOption<T extends Option> = (option: T) => void;
|
|
600
|
+
type CallbackWithOptions<T extends Option> = (options: T[]) => void;
|
|
601
|
+
type CallbackWithActionId = (actionId: string) => void;
|
|
602
|
+
type SearchPredicate<T extends Option> = (option: T, searchTerm: string) => boolean;
|
|
603
|
+
/** Action rendered below a select option list. */
|
|
604
|
+
type SelectAction = {
|
|
605
|
+
id: string;
|
|
606
|
+
label: string;
|
|
607
|
+
Icon?: React.ComponentType<React.SVGProps<SVGSVGElement>>;
|
|
608
|
+
className?: string;
|
|
609
|
+
onSelect: CallbackWithActionId;
|
|
610
|
+
};
|
|
611
|
+
/** Preferred side for the select popup. */
|
|
612
|
+
type PopoverSide = "top" | "bottom";
|
|
613
|
+
/** Preferred alignment for the select popup. */
|
|
614
|
+
type PopoverAlign = Alignment;
|
|
615
|
+
type CommonSelectProps<T extends Option> = PrimitiveProps & {
|
|
616
|
+
options: Options<T>;
|
|
617
|
+
disabled?: boolean;
|
|
618
|
+
id?: string;
|
|
619
|
+
required?: boolean;
|
|
620
|
+
name?: string;
|
|
621
|
+
placeholder?: string;
|
|
622
|
+
loadingPlaceholder?: string;
|
|
623
|
+
loading?: boolean;
|
|
624
|
+
variant?: SelectControlProps["variant"];
|
|
625
|
+
pill?: boolean;
|
|
626
|
+
size?: SelectControlProps["size"];
|
|
627
|
+
dropdownIconType?: SelectControlProps["dropdownIconType"];
|
|
628
|
+
actions?: SelectAction[];
|
|
629
|
+
optionClassName?: string;
|
|
630
|
+
OptionView?: React.FC<T>;
|
|
631
|
+
TriggerStartIcon?: SelectControlProps["StartIcon"];
|
|
632
|
+
triggerClassName?: string;
|
|
633
|
+
opticallyAlign?: "start" | "end";
|
|
634
|
+
clearable?: boolean;
|
|
635
|
+
block?: boolean;
|
|
636
|
+
side?: PopoverSide;
|
|
637
|
+
align?: PopoverAlign;
|
|
638
|
+
alignOffset?: number;
|
|
639
|
+
avoidCollisions?: boolean;
|
|
640
|
+
listWidth?: number | "auto";
|
|
641
|
+
listMinWidth?: number | "auto";
|
|
642
|
+
listMaxWidth?: number | "auto";
|
|
643
|
+
searchPredicate?: SearchPredicate<T>;
|
|
644
|
+
searchPlaceholder?: string;
|
|
645
|
+
searchEmptyMessage?: React.ReactNode;
|
|
646
|
+
/** Sidecar-only testing and controlled-preview helper. */
|
|
647
|
+
defaultOpen?: boolean;
|
|
648
|
+
};
|
|
649
|
+
type SingleSelectProps<T extends Option> = {
|
|
650
|
+
multiple?: false;
|
|
651
|
+
value: string;
|
|
652
|
+
onChange: CallbackWithOption<T>;
|
|
653
|
+
TriggerView?: React.FC<T>;
|
|
654
|
+
};
|
|
655
|
+
type MultiSelectTriggerViewProps<T extends Option> = {
|
|
656
|
+
values: T[];
|
|
657
|
+
selectedAll: boolean;
|
|
658
|
+
};
|
|
659
|
+
type MultiSelectProps<T extends Option> = {
|
|
660
|
+
multiple: true;
|
|
661
|
+
value: string[];
|
|
662
|
+
onChange: CallbackWithOptions<T>;
|
|
663
|
+
TriggerView?: React.FC<MultiSelectTriggerViewProps<T>>;
|
|
664
|
+
};
|
|
665
|
+
/** Props for a host-adaptive select. */
|
|
666
|
+
type SelectProps<T extends Option = Option> = (SingleSelectProps<T> | MultiSelectProps<T>) & CommonSelectProps<T>;
|
|
667
|
+
/** Host-adaptive select with search, actions, and single or multi selection. */
|
|
668
|
+
declare function Select<T extends Option = Option>({ actions, block, clearable, defaultOpen, disabled, dropdownIconType, id, loading, loadingPlaceholder, multiple, name, onChange, OptionView, options, opticallyAlign, pill, placeholder, recipe, required, searchEmptyMessage, searchPlaceholder, searchPredicate, size, TriggerStartIcon, TriggerView, triggerClassName, value, variant, }: SelectProps<T>): React.ReactElement<{
|
|
669
|
+
"data-sc-block": string | undefined;
|
|
670
|
+
"data-sc-component": string;
|
|
671
|
+
"data-sc-open": string | undefined;
|
|
672
|
+
"data-sc-recipe": ComponentRecipe;
|
|
673
|
+
}, string | React.JSXElementConstructor<any>>;
|
|
674
|
+
/** Select trigger variant icon type. */
|
|
675
|
+
type DropdownIconType = "chevronDown" | "dropdown" | "none";
|
|
676
|
+
/** Props for a standalone select-like trigger. */
|
|
677
|
+
type SelectControlProps = Omit<React.HTMLAttributes<HTMLSpanElement>, "onClick"> & PrimitiveProps & {
|
|
678
|
+
variant?: Variants<"soft" | "outline" | "ghost">;
|
|
679
|
+
pill?: boolean;
|
|
680
|
+
block?: boolean;
|
|
681
|
+
opticallyAlign?: "start" | "end";
|
|
682
|
+
disabled?: boolean;
|
|
683
|
+
invalid?: boolean;
|
|
684
|
+
selected?: boolean;
|
|
685
|
+
onClearClick?: () => void;
|
|
686
|
+
onInteract?: () => void;
|
|
687
|
+
size?: ControlSize;
|
|
688
|
+
loading?: boolean;
|
|
689
|
+
dropdownIconType?: DropdownIconType;
|
|
690
|
+
StartIcon?: React.ComponentType<React.SVGProps<SVGSVGElement>>;
|
|
691
|
+
children: React.ReactNode;
|
|
692
|
+
};
|
|
693
|
+
/** Host-adaptive select trigger used by `Select` and custom controls. */
|
|
694
|
+
declare const SelectControl: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLSpanElement>, "onClick"> & PrimitiveProps & {
|
|
695
|
+
variant?: Variants<"soft" | "outline" | "ghost">;
|
|
696
|
+
pill?: boolean;
|
|
697
|
+
block?: boolean;
|
|
698
|
+
opticallyAlign?: "start" | "end";
|
|
699
|
+
disabled?: boolean;
|
|
700
|
+
invalid?: boolean;
|
|
701
|
+
selected?: boolean;
|
|
702
|
+
onClearClick?: () => void;
|
|
703
|
+
onInteract?: () => void;
|
|
704
|
+
size?: ControlSize;
|
|
705
|
+
loading?: boolean;
|
|
706
|
+
dropdownIconType?: DropdownIconType;
|
|
707
|
+
StartIcon?: React.ComponentType<React.SVGProps<SVGSVGElement>>;
|
|
708
|
+
children: React.ReactNode;
|
|
709
|
+
} & React.RefAttributes<HTMLSpanElement>>;
|
|
710
|
+
/** Props for status badges. */
|
|
711
|
+
type BadgeProps = Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> & PrimitiveProps & {
|
|
712
|
+
children?: React.ReactNode;
|
|
713
|
+
variant?: Variants<"solid" | "soft" | "outline">;
|
|
714
|
+
size?: Sizes<"sm" | "md" | "lg">;
|
|
715
|
+
pill?: boolean;
|
|
716
|
+
color?: SemanticColors<"secondary" | "success" | "danger" | "warning" | "info" | "discovery">;
|
|
717
|
+
/** Backward-compatible alias for `color`. */
|
|
718
|
+
tone?: "default" | "success" | "warning" | "danger";
|
|
719
|
+
};
|
|
720
|
+
/** Compact status badge using the active host recipe. */
|
|
721
|
+
declare const Badge: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> & PrimitiveProps & {
|
|
722
|
+
children?: React.ReactNode;
|
|
723
|
+
variant?: Variants<"solid" | "soft" | "outline">;
|
|
724
|
+
size?: Sizes<"sm" | "md" | "lg">;
|
|
725
|
+
pill?: boolean;
|
|
726
|
+
color?: SemanticColors<"secondary" | "success" | "danger" | "warning" | "info" | "discovery">;
|
|
727
|
+
/** Backward-compatible alias for `color`. */
|
|
728
|
+
tone?: "default" | "success" | "warning" | "danger";
|
|
729
|
+
} & React.RefAttributes<HTMLSpanElement>>;
|
|
730
|
+
/** Props for alert blocks. */
|
|
731
|
+
type AlertProps = Omit<React.HTMLAttributes<HTMLDivElement>, "color" | "title"> & PrimitiveProps & {
|
|
732
|
+
color?: SemanticColors<"primary" | "danger" | "success" | "info" | "discovery" | "caution" | "warning">;
|
|
733
|
+
variant?: Variants<"solid" | "soft" | "outline">;
|
|
734
|
+
title?: React.ReactNode;
|
|
735
|
+
description?: React.ReactNode;
|
|
736
|
+
actions?: React.ReactNode;
|
|
737
|
+
actionsPlacement?: "end" | "bottom";
|
|
738
|
+
indicator?: React.ReactNode | false;
|
|
739
|
+
actionsClassName?: string;
|
|
740
|
+
/** Backward-compatible alias for `color`. */
|
|
741
|
+
tone?: "default" | "success" | "warning" | "danger";
|
|
742
|
+
};
|
|
743
|
+
/** Portable alert block for compact status and guidance. */
|
|
744
|
+
declare const Alert: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, "title" | "color"> & PrimitiveProps & {
|
|
745
|
+
color?: SemanticColors<"primary" | "danger" | "success" | "info" | "discovery" | "caution" | "warning">;
|
|
746
|
+
variant?: Variants<"solid" | "soft" | "outline">;
|
|
747
|
+
title?: React.ReactNode;
|
|
748
|
+
description?: React.ReactNode;
|
|
749
|
+
actions?: React.ReactNode;
|
|
750
|
+
actionsPlacement?: "end" | "bottom";
|
|
751
|
+
indicator?: React.ReactNode | false;
|
|
752
|
+
actionsClassName?: string;
|
|
753
|
+
/** Backward-compatible alias for `color`. */
|
|
754
|
+
tone?: "default" | "success" | "warning" | "danger";
|
|
755
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
756
|
+
/** Backward-compatible alias for alerts. */
|
|
757
|
+
declare const Callout: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, "title" | "color"> & PrimitiveProps & {
|
|
758
|
+
color?: SemanticColors<"primary" | "danger" | "success" | "info" | "discovery" | "caution" | "warning">;
|
|
759
|
+
variant?: Variants<"solid" | "soft" | "outline">;
|
|
760
|
+
title?: React.ReactNode;
|
|
761
|
+
description?: React.ReactNode;
|
|
762
|
+
actions?: React.ReactNode;
|
|
763
|
+
actionsPlacement?: "end" | "bottom";
|
|
764
|
+
indicator?: React.ReactNode | false;
|
|
765
|
+
actionsClassName?: string;
|
|
766
|
+
/** Backward-compatible alias for `color`. */
|
|
767
|
+
tone?: "default" | "success" | "warning" | "danger";
|
|
768
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
769
|
+
type CalloutProps = AlertProps;
|
|
770
|
+
/** Props for a compact avatar. */
|
|
771
|
+
type AvatarProps = Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> & PrimitiveProps & {
|
|
772
|
+
size?: number;
|
|
773
|
+
overflowCount?: number;
|
|
774
|
+
name?: string;
|
|
775
|
+
color?: SemanticColors<"primary" | "secondary" | "success" | "info" | "discovery" | "danger">;
|
|
776
|
+
variant?: Variants<"soft" | "solid">;
|
|
777
|
+
imageUrl?: string;
|
|
778
|
+
Icon?: React.ComponentType<React.SVGProps<SVGSVGElement>>;
|
|
779
|
+
onClick?: () => void;
|
|
780
|
+
onPointerDown?: () => void;
|
|
781
|
+
/** Backward-compatible alias for `imageUrl`. */
|
|
782
|
+
src?: string;
|
|
783
|
+
/** Backward-compatible alt text for image avatars. */
|
|
784
|
+
alt?: string;
|
|
785
|
+
/** Backward-compatible fallback content. */
|
|
786
|
+
fallback?: React.ReactNode;
|
|
787
|
+
};
|
|
788
|
+
/** Circular avatar with image, initials, overflow, icon, and fallback support. */
|
|
789
|
+
declare const Avatar: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> & PrimitiveProps & {
|
|
790
|
+
size?: number;
|
|
791
|
+
overflowCount?: number;
|
|
792
|
+
name?: string;
|
|
793
|
+
color?: SemanticColors<"primary" | "secondary" | "success" | "info" | "discovery" | "danger">;
|
|
794
|
+
variant?: Variants<"soft" | "solid">;
|
|
795
|
+
imageUrl?: string;
|
|
796
|
+
Icon?: React.ComponentType<React.SVGProps<SVGSVGElement>>;
|
|
797
|
+
onClick?: () => void;
|
|
798
|
+
onPointerDown?: () => void;
|
|
799
|
+
/** Backward-compatible alias for `imageUrl`. */
|
|
800
|
+
src?: string;
|
|
801
|
+
/** Backward-compatible alt text for image avatars. */
|
|
802
|
+
alt?: string;
|
|
803
|
+
/** Backward-compatible fallback content. */
|
|
804
|
+
fallback?: React.ReactNode;
|
|
805
|
+
} & React.RefAttributes<HTMLSpanElement>>;
|
|
806
|
+
/** Props for stacked avatar groups. */
|
|
807
|
+
type AvatarGroupProps = PrimitiveProps & {
|
|
808
|
+
className?: string;
|
|
809
|
+
stack?: "start" | "end";
|
|
810
|
+
size?: number;
|
|
811
|
+
children: React.ReactNode;
|
|
812
|
+
};
|
|
813
|
+
/** Stacked avatar group using the active host recipe. */
|
|
814
|
+
declare function AvatarGroup({ children, className, recipe, size, stack }: AvatarGroupProps): React.DetailedReactHTMLElement<{
|
|
815
|
+
className: string | undefined;
|
|
816
|
+
"data-sc-component": string;
|
|
817
|
+
"data-sc-recipe": ComponentRecipe;
|
|
818
|
+
"data-sc-stack": "start" | "end";
|
|
819
|
+
style: React.CSSProperties | undefined;
|
|
820
|
+
}, HTMLElement>;
|
|
821
|
+
/** Props for empty-message containers. */
|
|
822
|
+
type EmptyMessageProps = PrimitiveProps & {
|
|
823
|
+
children: React.ReactNode;
|
|
824
|
+
className?: string;
|
|
825
|
+
fill?: "static" | "absolute" | "none";
|
|
826
|
+
};
|
|
827
|
+
/** Props for empty-message icon slots. */
|
|
828
|
+
type EmptyMessageIconProps = PrimitiveProps & {
|
|
829
|
+
size?: Sizes<"sm" | "md">;
|
|
830
|
+
color?: SemanticColors<"secondary" | "danger" | "warning">;
|
|
831
|
+
children: React.ReactNode;
|
|
832
|
+
className?: string;
|
|
833
|
+
};
|
|
834
|
+
/** Props for empty-message title slots. */
|
|
835
|
+
type EmptyMessageTitleProps = PrimitiveProps & {
|
|
836
|
+
children: React.ReactNode;
|
|
837
|
+
className?: string;
|
|
838
|
+
color?: SemanticColors<"secondary" | "danger" | "warning">;
|
|
839
|
+
};
|
|
840
|
+
declare function EmptyMessageRoot({ children, className, fill, recipe }: EmptyMessageProps): React.FunctionComponentElement<React.ProviderProps<ComponentRecipe>>;
|
|
841
|
+
declare function EmptyMessageIcon({ children, className, color, recipe, size }: EmptyMessageIconProps): React.DetailedReactHTMLElement<{
|
|
842
|
+
className: string | undefined;
|
|
843
|
+
"data-sc-color": "warning" | "secondary" | "danger";
|
|
844
|
+
"data-sc-component": string;
|
|
845
|
+
"data-sc-recipe": ComponentRecipe;
|
|
846
|
+
"data-sc-size": "sm" | "md";
|
|
847
|
+
}, HTMLElement>;
|
|
848
|
+
declare function EmptyMessageTitle({ children, className, color, recipe }: EmptyMessageTitleProps): React.DetailedReactHTMLElement<{
|
|
849
|
+
className: string | undefined;
|
|
850
|
+
"data-sc-color": "warning" | "secondary" | "danger";
|
|
851
|
+
"data-sc-component": string;
|
|
852
|
+
"data-sc-recipe": ComponentRecipe;
|
|
853
|
+
}, HTMLElement>;
|
|
854
|
+
declare function EmptyMessageDescription({ children, className, }: {
|
|
855
|
+
children: React.ReactNode;
|
|
856
|
+
className?: string;
|
|
857
|
+
}): React.DetailedReactHTMLElement<{
|
|
858
|
+
className: string | undefined;
|
|
859
|
+
"data-sc-component": string;
|
|
860
|
+
}, HTMLElement>;
|
|
861
|
+
declare function EmptyMessageActionRow({ children, className, }: {
|
|
862
|
+
children: React.ReactNode;
|
|
863
|
+
className?: string;
|
|
864
|
+
}): React.DetailedReactHTMLElement<{
|
|
865
|
+
className: string | undefined;
|
|
866
|
+
"data-sc-component": string;
|
|
867
|
+
}, HTMLElement>;
|
|
868
|
+
/** Empty-state primitive with compound slots matching the OpenAI UI shape. */
|
|
869
|
+
declare const EmptyMessage: typeof EmptyMessageRoot & {
|
|
870
|
+
ActionRow: typeof EmptyMessageActionRow;
|
|
871
|
+
Description: typeof EmptyMessageDescription;
|
|
872
|
+
Icon: typeof EmptyMessageIcon;
|
|
873
|
+
Title: typeof EmptyMessageTitle;
|
|
874
|
+
};
|
|
875
|
+
/** Backward-compatible props for early Sidecar empty states. */
|
|
876
|
+
type EmptyStateProps = Omit<React.HTMLAttributes<HTMLDivElement>, "title"> & PrimitiveProps & {
|
|
877
|
+
title: React.ReactNode;
|
|
878
|
+
action?: React.ReactNode;
|
|
879
|
+
};
|
|
880
|
+
/** Backward-compatible wrapper around `EmptyMessage`. */
|
|
881
|
+
declare const EmptyState: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, "title"> & PrimitiveProps & {
|
|
882
|
+
title: React.ReactNode;
|
|
883
|
+
action?: React.ReactNode;
|
|
884
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
885
|
+
/** Props for loading dot indicators. */
|
|
886
|
+
type LoadingDotsProps = Omit<React.ComponentProps<"div">, "children"> & PrimitiveProps;
|
|
887
|
+
/** Three-dot loading indicator. */
|
|
888
|
+
declare function LoadingDots({ recipe, ...props }: LoadingDotsProps): React.DetailedReactHTMLElement<{
|
|
889
|
+
content?: string | undefined | undefined;
|
|
890
|
+
title?: string | undefined | undefined;
|
|
891
|
+
resource?: string | undefined | undefined;
|
|
892
|
+
id?: string | undefined | undefined;
|
|
893
|
+
key?: React.Key | null | undefined;
|
|
894
|
+
color?: string | undefined | undefined;
|
|
895
|
+
defaultChecked?: boolean | undefined | undefined;
|
|
896
|
+
defaultValue?: string | number | readonly string[] | undefined;
|
|
897
|
+
suppressContentEditableWarning?: boolean | undefined | undefined;
|
|
898
|
+
suppressHydrationWarning?: boolean | undefined | undefined;
|
|
899
|
+
accessKey?: string | undefined | undefined;
|
|
900
|
+
autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
|
|
901
|
+
autoFocus?: boolean | undefined | undefined;
|
|
902
|
+
className?: string | undefined | undefined;
|
|
903
|
+
contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
|
|
904
|
+
contextMenu?: string | undefined | undefined;
|
|
905
|
+
dir?: string | undefined | undefined;
|
|
906
|
+
draggable?: (boolean | "true" | "false") | undefined;
|
|
907
|
+
enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
|
|
908
|
+
hidden?: boolean | undefined | undefined;
|
|
909
|
+
lang?: string | undefined | undefined;
|
|
910
|
+
nonce?: string | undefined | undefined;
|
|
911
|
+
slot?: string | undefined | undefined;
|
|
912
|
+
spellCheck?: (boolean | "true" | "false") | undefined;
|
|
913
|
+
style?: React.CSSProperties | undefined;
|
|
914
|
+
tabIndex?: number | undefined | undefined;
|
|
915
|
+
translate?: "yes" | "no" | undefined | undefined;
|
|
916
|
+
radioGroup?: string | undefined | undefined;
|
|
917
|
+
role?: React.AriaRole | undefined;
|
|
918
|
+
about?: string | undefined | undefined;
|
|
919
|
+
datatype?: string | undefined | undefined;
|
|
920
|
+
inlist?: any;
|
|
921
|
+
prefix?: string | undefined | undefined;
|
|
922
|
+
property?: string | undefined | undefined;
|
|
923
|
+
rel?: string | undefined | undefined;
|
|
924
|
+
rev?: string | undefined | undefined;
|
|
925
|
+
typeof?: string | undefined | undefined;
|
|
926
|
+
vocab?: string | undefined | undefined;
|
|
927
|
+
autoCorrect?: string | undefined | undefined;
|
|
928
|
+
autoSave?: string | undefined | undefined;
|
|
929
|
+
itemProp?: string | undefined | undefined;
|
|
930
|
+
itemScope?: boolean | undefined | undefined;
|
|
931
|
+
itemType?: string | undefined | undefined;
|
|
932
|
+
itemID?: string | undefined | undefined;
|
|
933
|
+
itemRef?: string | undefined | undefined;
|
|
934
|
+
results?: number | undefined | undefined;
|
|
935
|
+
security?: string | undefined | undefined;
|
|
936
|
+
unselectable?: "on" | "off" | undefined | undefined;
|
|
937
|
+
popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
|
|
938
|
+
popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
|
|
939
|
+
popoverTarget?: string | undefined | undefined;
|
|
940
|
+
inert?: boolean | undefined | undefined;
|
|
941
|
+
inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
|
|
942
|
+
is?: string | undefined | undefined;
|
|
943
|
+
exportparts?: string | undefined | undefined;
|
|
944
|
+
part?: string | undefined | undefined;
|
|
945
|
+
"aria-activedescendant"?: string | undefined | undefined;
|
|
946
|
+
"aria-atomic"?: (boolean | "true" | "false") | undefined;
|
|
947
|
+
"aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
|
|
948
|
+
"aria-braillelabel"?: string | undefined | undefined;
|
|
949
|
+
"aria-brailleroledescription"?: string | undefined | undefined;
|
|
950
|
+
"aria-busy"?: (boolean | "true" | "false") | undefined;
|
|
951
|
+
"aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
|
|
952
|
+
"aria-colcount"?: number | undefined | undefined;
|
|
953
|
+
"aria-colindex"?: number | undefined | undefined;
|
|
954
|
+
"aria-colindextext"?: string | undefined | undefined;
|
|
955
|
+
"aria-colspan"?: number | undefined | undefined;
|
|
956
|
+
"aria-controls"?: string | undefined | undefined;
|
|
957
|
+
"aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
|
|
958
|
+
"aria-describedby"?: string | undefined | undefined;
|
|
959
|
+
"aria-description"?: string | undefined | undefined;
|
|
960
|
+
"aria-details"?: string | undefined | undefined;
|
|
961
|
+
"aria-disabled"?: (boolean | "true" | "false") | undefined;
|
|
962
|
+
"aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
|
|
963
|
+
"aria-errormessage"?: string | undefined | undefined;
|
|
964
|
+
"aria-expanded"?: (boolean | "true" | "false") | undefined;
|
|
965
|
+
"aria-flowto"?: string | undefined | undefined;
|
|
966
|
+
"aria-grabbed"?: (boolean | "true" | "false") | undefined;
|
|
967
|
+
"aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
|
|
968
|
+
"aria-hidden": boolean | "true" | "false";
|
|
969
|
+
"aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
|
|
970
|
+
"aria-keyshortcuts"?: string | undefined | undefined;
|
|
971
|
+
"aria-label"?: string | undefined | undefined;
|
|
972
|
+
"aria-labelledby"?: string | undefined | undefined;
|
|
973
|
+
"aria-level"?: number | undefined | undefined;
|
|
974
|
+
"aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
|
|
975
|
+
"aria-modal"?: (boolean | "true" | "false") | undefined;
|
|
976
|
+
"aria-multiline"?: (boolean | "true" | "false") | undefined;
|
|
977
|
+
"aria-multiselectable"?: (boolean | "true" | "false") | undefined;
|
|
978
|
+
"aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
|
|
979
|
+
"aria-owns"?: string | undefined | undefined;
|
|
980
|
+
"aria-placeholder"?: string | undefined | undefined;
|
|
981
|
+
"aria-posinset"?: number | undefined | undefined;
|
|
982
|
+
"aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
|
|
983
|
+
"aria-readonly"?: (boolean | "true" | "false") | undefined;
|
|
984
|
+
"aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
|
|
985
|
+
"aria-required"?: (boolean | "true" | "false") | undefined;
|
|
986
|
+
"aria-roledescription"?: string | undefined | undefined;
|
|
987
|
+
"aria-rowcount"?: number | undefined | undefined;
|
|
988
|
+
"aria-rowindex"?: number | undefined | undefined;
|
|
989
|
+
"aria-rowindextext"?: string | undefined | undefined;
|
|
990
|
+
"aria-rowspan"?: number | undefined | undefined;
|
|
991
|
+
"aria-selected"?: (boolean | "true" | "false") | undefined;
|
|
992
|
+
"aria-setsize"?: number | undefined | undefined;
|
|
993
|
+
"aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
|
|
994
|
+
"aria-valuemax"?: number | undefined | undefined;
|
|
995
|
+
"aria-valuemin"?: number | undefined | undefined;
|
|
996
|
+
"aria-valuenow"?: number | undefined | undefined;
|
|
997
|
+
"aria-valuetext"?: string | undefined | undefined;
|
|
998
|
+
dangerouslySetInnerHTML?: {
|
|
999
|
+
__html: string | TrustedHTML;
|
|
1000
|
+
} | undefined | undefined;
|
|
1001
|
+
onCopy?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1002
|
+
onCopyCapture?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1003
|
+
onCut?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1004
|
+
onCutCapture?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1005
|
+
onPaste?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1006
|
+
onPasteCapture?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1007
|
+
onCompositionEnd?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1008
|
+
onCompositionEndCapture?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1009
|
+
onCompositionStart?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1010
|
+
onCompositionStartCapture?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1011
|
+
onCompositionUpdate?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1012
|
+
onCompositionUpdateCapture?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1013
|
+
onFocus?: React.FocusEventHandler<HTMLDivElement> | undefined;
|
|
1014
|
+
onFocusCapture?: React.FocusEventHandler<HTMLDivElement> | undefined;
|
|
1015
|
+
onBlur?: React.FocusEventHandler<HTMLDivElement> | undefined;
|
|
1016
|
+
onBlurCapture?: React.FocusEventHandler<HTMLDivElement> | undefined;
|
|
1017
|
+
onChange?: React.ChangeEventHandler<HTMLDivElement, Element> | undefined;
|
|
1018
|
+
onChangeCapture?: React.ChangeEventHandler<HTMLDivElement, Element> | undefined;
|
|
1019
|
+
onBeforeInput?: React.InputEventHandler<HTMLDivElement> | undefined;
|
|
1020
|
+
onBeforeInputCapture?: React.InputEventHandler<HTMLDivElement> | undefined;
|
|
1021
|
+
onInput?: React.InputEventHandler<HTMLDivElement> | undefined;
|
|
1022
|
+
onInputCapture?: React.InputEventHandler<HTMLDivElement> | undefined;
|
|
1023
|
+
onReset?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1024
|
+
onResetCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1025
|
+
onSubmit?: React.SubmitEventHandler<HTMLDivElement> | undefined;
|
|
1026
|
+
onSubmitCapture?: React.SubmitEventHandler<HTMLDivElement> | undefined;
|
|
1027
|
+
onInvalid?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1028
|
+
onInvalidCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1029
|
+
onLoad?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1030
|
+
onLoadCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1031
|
+
onError?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1032
|
+
onErrorCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1033
|
+
onKeyDown?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1034
|
+
onKeyDownCapture?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1035
|
+
onKeyPress?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1036
|
+
onKeyPressCapture?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1037
|
+
onKeyUp?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1038
|
+
onKeyUpCapture?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1039
|
+
onAbort?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1040
|
+
onAbortCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1041
|
+
onCanPlay?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1042
|
+
onCanPlayCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1043
|
+
onCanPlayThrough?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1044
|
+
onCanPlayThroughCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1045
|
+
onDurationChange?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1046
|
+
onDurationChangeCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1047
|
+
onEmptied?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1048
|
+
onEmptiedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1049
|
+
onEncrypted?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1050
|
+
onEncryptedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1051
|
+
onEnded?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1052
|
+
onEndedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1053
|
+
onLoadedData?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1054
|
+
onLoadedDataCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1055
|
+
onLoadedMetadata?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1056
|
+
onLoadedMetadataCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1057
|
+
onLoadStart?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1058
|
+
onLoadStartCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1059
|
+
onPause?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1060
|
+
onPauseCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1061
|
+
onPlay?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1062
|
+
onPlayCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1063
|
+
onPlaying?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1064
|
+
onPlayingCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1065
|
+
onProgress?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1066
|
+
onProgressCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1067
|
+
onRateChange?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1068
|
+
onRateChangeCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1069
|
+
onSeeked?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1070
|
+
onSeekedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1071
|
+
onSeeking?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1072
|
+
onSeekingCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1073
|
+
onStalled?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1074
|
+
onStalledCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1075
|
+
onSuspend?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1076
|
+
onSuspendCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1077
|
+
onTimeUpdate?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1078
|
+
onTimeUpdateCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1079
|
+
onVolumeChange?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1080
|
+
onVolumeChangeCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1081
|
+
onWaiting?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1082
|
+
onWaitingCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1083
|
+
onAuxClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1084
|
+
onAuxClickCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1085
|
+
onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1086
|
+
onClickCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1087
|
+
onContextMenu?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1088
|
+
onContextMenuCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1089
|
+
onDoubleClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1090
|
+
onDoubleClickCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1091
|
+
onDrag?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1092
|
+
onDragCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1093
|
+
onDragEnd?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1094
|
+
onDragEndCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1095
|
+
onDragEnter?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1096
|
+
onDragEnterCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1097
|
+
onDragExit?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1098
|
+
onDragExitCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1099
|
+
onDragLeave?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1100
|
+
onDragLeaveCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1101
|
+
onDragOver?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1102
|
+
onDragOverCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1103
|
+
onDragStart?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1104
|
+
onDragStartCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1105
|
+
onDrop?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1106
|
+
onDropCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1107
|
+
onMouseDown?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1108
|
+
onMouseDownCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1109
|
+
onMouseEnter?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1110
|
+
onMouseLeave?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1111
|
+
onMouseMove?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1112
|
+
onMouseMoveCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1113
|
+
onMouseOut?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1114
|
+
onMouseOutCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1115
|
+
onMouseOver?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1116
|
+
onMouseOverCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1117
|
+
onMouseUp?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1118
|
+
onMouseUpCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1119
|
+
onSelect?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1120
|
+
onSelectCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1121
|
+
onTouchCancel?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1122
|
+
onTouchCancelCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1123
|
+
onTouchEnd?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1124
|
+
onTouchEndCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1125
|
+
onTouchMove?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1126
|
+
onTouchMoveCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1127
|
+
onTouchStart?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1128
|
+
onTouchStartCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1129
|
+
onPointerDown?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1130
|
+
onPointerDownCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1131
|
+
onPointerMove?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1132
|
+
onPointerMoveCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1133
|
+
onPointerUp?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1134
|
+
onPointerUpCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1135
|
+
onPointerCancel?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1136
|
+
onPointerCancelCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1137
|
+
onPointerEnter?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1138
|
+
onPointerLeave?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1139
|
+
onPointerOver?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1140
|
+
onPointerOverCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1141
|
+
onPointerOut?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1142
|
+
onPointerOutCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1143
|
+
onGotPointerCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1144
|
+
onGotPointerCaptureCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1145
|
+
onLostPointerCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1146
|
+
onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1147
|
+
onScroll?: React.UIEventHandler<HTMLDivElement> | undefined;
|
|
1148
|
+
onScrollCapture?: React.UIEventHandler<HTMLDivElement> | undefined;
|
|
1149
|
+
onScrollEnd?: React.UIEventHandler<HTMLDivElement> | undefined;
|
|
1150
|
+
onScrollEndCapture?: React.UIEventHandler<HTMLDivElement> | undefined;
|
|
1151
|
+
onWheel?: React.WheelEventHandler<HTMLDivElement> | undefined;
|
|
1152
|
+
onWheelCapture?: React.WheelEventHandler<HTMLDivElement> | undefined;
|
|
1153
|
+
onAnimationStart?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1154
|
+
onAnimationStartCapture?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1155
|
+
onAnimationEnd?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1156
|
+
onAnimationEndCapture?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1157
|
+
onAnimationIteration?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1158
|
+
onAnimationIterationCapture?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1159
|
+
onToggle?: React.ToggleEventHandler<HTMLDivElement> | undefined;
|
|
1160
|
+
onBeforeToggle?: React.ToggleEventHandler<HTMLDivElement> | undefined;
|
|
1161
|
+
onTransitionCancel?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1162
|
+
onTransitionCancelCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1163
|
+
onTransitionEnd?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1164
|
+
onTransitionEndCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1165
|
+
onTransitionRun?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1166
|
+
onTransitionRunCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1167
|
+
onTransitionStart?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1168
|
+
onTransitionStartCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1169
|
+
ref?: React.Ref<HTMLDivElement> | undefined;
|
|
1170
|
+
"data-sc-component": string;
|
|
1171
|
+
"data-sc-recipe": ComponentRecipe;
|
|
1172
|
+
}, HTMLDivElement>;
|
|
1173
|
+
/** Props for circular indeterminate indicators. */
|
|
1174
|
+
type LoadingIndicatorProps = {
|
|
1175
|
+
className?: string;
|
|
1176
|
+
size?: number | string;
|
|
1177
|
+
strokeWidth?: number;
|
|
1178
|
+
} & Omit<React.ComponentProps<"div">, "children"> & PrimitiveProps;
|
|
1179
|
+
/** Circular indeterminate loading indicator. */
|
|
1180
|
+
declare function LoadingIndicator({ className, recipe, size, strokeWidth, style, ...props }: LoadingIndicatorProps): React.DetailedReactHTMLElement<{
|
|
1181
|
+
content?: string | undefined | undefined;
|
|
1182
|
+
title?: string | undefined | undefined;
|
|
1183
|
+
resource?: string | undefined | undefined;
|
|
1184
|
+
id?: string | undefined | undefined;
|
|
1185
|
+
key?: React.Key | null | undefined;
|
|
1186
|
+
color?: string | undefined | undefined;
|
|
1187
|
+
defaultChecked?: boolean | undefined | undefined;
|
|
1188
|
+
defaultValue?: string | number | readonly string[] | undefined;
|
|
1189
|
+
suppressContentEditableWarning?: boolean | undefined | undefined;
|
|
1190
|
+
suppressHydrationWarning?: boolean | undefined | undefined;
|
|
1191
|
+
accessKey?: string | undefined | undefined;
|
|
1192
|
+
autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
|
|
1193
|
+
autoFocus?: boolean | undefined | undefined;
|
|
1194
|
+
contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
|
|
1195
|
+
contextMenu?: string | undefined | undefined;
|
|
1196
|
+
dir?: string | undefined | undefined;
|
|
1197
|
+
draggable?: (boolean | "true" | "false") | undefined;
|
|
1198
|
+
enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
|
|
1199
|
+
hidden?: boolean | undefined | undefined;
|
|
1200
|
+
lang?: string | undefined | undefined;
|
|
1201
|
+
nonce?: string | undefined | undefined;
|
|
1202
|
+
slot?: string | undefined | undefined;
|
|
1203
|
+
spellCheck?: (boolean | "true" | "false") | undefined;
|
|
1204
|
+
tabIndex?: number | undefined | undefined;
|
|
1205
|
+
translate?: "yes" | "no" | undefined | undefined;
|
|
1206
|
+
radioGroup?: string | undefined | undefined;
|
|
1207
|
+
role?: React.AriaRole | undefined;
|
|
1208
|
+
about?: string | undefined | undefined;
|
|
1209
|
+
datatype?: string | undefined | undefined;
|
|
1210
|
+
inlist?: any;
|
|
1211
|
+
prefix?: string | undefined | undefined;
|
|
1212
|
+
property?: string | undefined | undefined;
|
|
1213
|
+
rel?: string | undefined | undefined;
|
|
1214
|
+
rev?: string | undefined | undefined;
|
|
1215
|
+
typeof?: string | undefined | undefined;
|
|
1216
|
+
vocab?: string | undefined | undefined;
|
|
1217
|
+
autoCorrect?: string | undefined | undefined;
|
|
1218
|
+
autoSave?: string | undefined | undefined;
|
|
1219
|
+
itemProp?: string | undefined | undefined;
|
|
1220
|
+
itemScope?: boolean | undefined | undefined;
|
|
1221
|
+
itemType?: string | undefined | undefined;
|
|
1222
|
+
itemID?: string | undefined | undefined;
|
|
1223
|
+
itemRef?: string | undefined | undefined;
|
|
1224
|
+
results?: number | undefined | undefined;
|
|
1225
|
+
security?: string | undefined | undefined;
|
|
1226
|
+
unselectable?: "on" | "off" | undefined | undefined;
|
|
1227
|
+
popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
|
|
1228
|
+
popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
|
|
1229
|
+
popoverTarget?: string | undefined | undefined;
|
|
1230
|
+
inert?: boolean | undefined | undefined;
|
|
1231
|
+
inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
|
|
1232
|
+
is?: string | undefined | undefined;
|
|
1233
|
+
exportparts?: string | undefined | undefined;
|
|
1234
|
+
part?: string | undefined | undefined;
|
|
1235
|
+
"aria-activedescendant"?: string | undefined | undefined;
|
|
1236
|
+
"aria-atomic"?: (boolean | "true" | "false") | undefined;
|
|
1237
|
+
"aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
|
|
1238
|
+
"aria-braillelabel"?: string | undefined | undefined;
|
|
1239
|
+
"aria-brailleroledescription"?: string | undefined | undefined;
|
|
1240
|
+
"aria-busy"?: (boolean | "true" | "false") | undefined;
|
|
1241
|
+
"aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
|
|
1242
|
+
"aria-colcount"?: number | undefined | undefined;
|
|
1243
|
+
"aria-colindex"?: number | undefined | undefined;
|
|
1244
|
+
"aria-colindextext"?: string | undefined | undefined;
|
|
1245
|
+
"aria-colspan"?: number | undefined | undefined;
|
|
1246
|
+
"aria-controls"?: string | undefined | undefined;
|
|
1247
|
+
"aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
|
|
1248
|
+
"aria-describedby"?: string | undefined | undefined;
|
|
1249
|
+
"aria-description"?: string | undefined | undefined;
|
|
1250
|
+
"aria-details"?: string | undefined | undefined;
|
|
1251
|
+
"aria-disabled"?: (boolean | "true" | "false") | undefined;
|
|
1252
|
+
"aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
|
|
1253
|
+
"aria-errormessage"?: string | undefined | undefined;
|
|
1254
|
+
"aria-expanded"?: (boolean | "true" | "false") | undefined;
|
|
1255
|
+
"aria-flowto"?: string | undefined | undefined;
|
|
1256
|
+
"aria-grabbed"?: (boolean | "true" | "false") | undefined;
|
|
1257
|
+
"aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
|
|
1258
|
+
"aria-hidden"?: (boolean | "true" | "false") | undefined;
|
|
1259
|
+
"aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
|
|
1260
|
+
"aria-keyshortcuts"?: string | undefined | undefined;
|
|
1261
|
+
"aria-label"?: string | undefined | undefined;
|
|
1262
|
+
"aria-labelledby"?: string | undefined | undefined;
|
|
1263
|
+
"aria-level"?: number | undefined | undefined;
|
|
1264
|
+
"aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
|
|
1265
|
+
"aria-modal"?: (boolean | "true" | "false") | undefined;
|
|
1266
|
+
"aria-multiline"?: (boolean | "true" | "false") | undefined;
|
|
1267
|
+
"aria-multiselectable"?: (boolean | "true" | "false") | undefined;
|
|
1268
|
+
"aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
|
|
1269
|
+
"aria-owns"?: string | undefined | undefined;
|
|
1270
|
+
"aria-placeholder"?: string | undefined | undefined;
|
|
1271
|
+
"aria-posinset"?: number | undefined | undefined;
|
|
1272
|
+
"aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
|
|
1273
|
+
"aria-readonly"?: (boolean | "true" | "false") | undefined;
|
|
1274
|
+
"aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
|
|
1275
|
+
"aria-required"?: (boolean | "true" | "false") | undefined;
|
|
1276
|
+
"aria-roledescription"?: string | undefined | undefined;
|
|
1277
|
+
"aria-rowcount"?: number | undefined | undefined;
|
|
1278
|
+
"aria-rowindex"?: number | undefined | undefined;
|
|
1279
|
+
"aria-rowindextext"?: string | undefined | undefined;
|
|
1280
|
+
"aria-rowspan"?: number | undefined | undefined;
|
|
1281
|
+
"aria-selected"?: (boolean | "true" | "false") | undefined;
|
|
1282
|
+
"aria-setsize"?: number | undefined | undefined;
|
|
1283
|
+
"aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
|
|
1284
|
+
"aria-valuemax"?: number | undefined | undefined;
|
|
1285
|
+
"aria-valuemin"?: number | undefined | undefined;
|
|
1286
|
+
"aria-valuenow"?: number | undefined | undefined;
|
|
1287
|
+
"aria-valuetext"?: string | undefined | undefined;
|
|
1288
|
+
dangerouslySetInnerHTML?: {
|
|
1289
|
+
__html: string | TrustedHTML;
|
|
1290
|
+
} | undefined | undefined;
|
|
1291
|
+
onCopy?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1292
|
+
onCopyCapture?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1293
|
+
onCut?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1294
|
+
onCutCapture?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1295
|
+
onPaste?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1296
|
+
onPasteCapture?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1297
|
+
onCompositionEnd?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1298
|
+
onCompositionEndCapture?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1299
|
+
onCompositionStart?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1300
|
+
onCompositionStartCapture?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1301
|
+
onCompositionUpdate?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1302
|
+
onCompositionUpdateCapture?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1303
|
+
onFocus?: React.FocusEventHandler<HTMLDivElement> | undefined;
|
|
1304
|
+
onFocusCapture?: React.FocusEventHandler<HTMLDivElement> | undefined;
|
|
1305
|
+
onBlur?: React.FocusEventHandler<HTMLDivElement> | undefined;
|
|
1306
|
+
onBlurCapture?: React.FocusEventHandler<HTMLDivElement> | undefined;
|
|
1307
|
+
onChange?: React.ChangeEventHandler<HTMLDivElement, Element> | undefined;
|
|
1308
|
+
onChangeCapture?: React.ChangeEventHandler<HTMLDivElement, Element> | undefined;
|
|
1309
|
+
onBeforeInput?: React.InputEventHandler<HTMLDivElement> | undefined;
|
|
1310
|
+
onBeforeInputCapture?: React.InputEventHandler<HTMLDivElement> | undefined;
|
|
1311
|
+
onInput?: React.InputEventHandler<HTMLDivElement> | undefined;
|
|
1312
|
+
onInputCapture?: React.InputEventHandler<HTMLDivElement> | undefined;
|
|
1313
|
+
onReset?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1314
|
+
onResetCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1315
|
+
onSubmit?: React.SubmitEventHandler<HTMLDivElement> | undefined;
|
|
1316
|
+
onSubmitCapture?: React.SubmitEventHandler<HTMLDivElement> | undefined;
|
|
1317
|
+
onInvalid?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1318
|
+
onInvalidCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1319
|
+
onLoad?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1320
|
+
onLoadCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1321
|
+
onError?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1322
|
+
onErrorCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1323
|
+
onKeyDown?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1324
|
+
onKeyDownCapture?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1325
|
+
onKeyPress?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1326
|
+
onKeyPressCapture?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1327
|
+
onKeyUp?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1328
|
+
onKeyUpCapture?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1329
|
+
onAbort?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1330
|
+
onAbortCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1331
|
+
onCanPlay?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1332
|
+
onCanPlayCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1333
|
+
onCanPlayThrough?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1334
|
+
onCanPlayThroughCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1335
|
+
onDurationChange?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1336
|
+
onDurationChangeCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1337
|
+
onEmptied?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1338
|
+
onEmptiedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1339
|
+
onEncrypted?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1340
|
+
onEncryptedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1341
|
+
onEnded?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1342
|
+
onEndedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1343
|
+
onLoadedData?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1344
|
+
onLoadedDataCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1345
|
+
onLoadedMetadata?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1346
|
+
onLoadedMetadataCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1347
|
+
onLoadStart?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1348
|
+
onLoadStartCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1349
|
+
onPause?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1350
|
+
onPauseCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1351
|
+
onPlay?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1352
|
+
onPlayCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1353
|
+
onPlaying?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1354
|
+
onPlayingCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1355
|
+
onProgress?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1356
|
+
onProgressCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1357
|
+
onRateChange?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1358
|
+
onRateChangeCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1359
|
+
onSeeked?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1360
|
+
onSeekedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1361
|
+
onSeeking?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1362
|
+
onSeekingCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1363
|
+
onStalled?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1364
|
+
onStalledCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1365
|
+
onSuspend?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1366
|
+
onSuspendCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1367
|
+
onTimeUpdate?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1368
|
+
onTimeUpdateCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1369
|
+
onVolumeChange?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1370
|
+
onVolumeChangeCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1371
|
+
onWaiting?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1372
|
+
onWaitingCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1373
|
+
onAuxClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1374
|
+
onAuxClickCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1375
|
+
onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1376
|
+
onClickCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1377
|
+
onContextMenu?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1378
|
+
onContextMenuCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1379
|
+
onDoubleClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1380
|
+
onDoubleClickCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1381
|
+
onDrag?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1382
|
+
onDragCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1383
|
+
onDragEnd?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1384
|
+
onDragEndCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1385
|
+
onDragEnter?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1386
|
+
onDragEnterCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1387
|
+
onDragExit?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1388
|
+
onDragExitCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1389
|
+
onDragLeave?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1390
|
+
onDragLeaveCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1391
|
+
onDragOver?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1392
|
+
onDragOverCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1393
|
+
onDragStart?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1394
|
+
onDragStartCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1395
|
+
onDrop?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1396
|
+
onDropCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1397
|
+
onMouseDown?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1398
|
+
onMouseDownCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1399
|
+
onMouseEnter?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1400
|
+
onMouseLeave?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1401
|
+
onMouseMove?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1402
|
+
onMouseMoveCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1403
|
+
onMouseOut?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1404
|
+
onMouseOutCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1405
|
+
onMouseOver?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1406
|
+
onMouseOverCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1407
|
+
onMouseUp?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1408
|
+
onMouseUpCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1409
|
+
onSelect?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1410
|
+
onSelectCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1411
|
+
onTouchCancel?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1412
|
+
onTouchCancelCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1413
|
+
onTouchEnd?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1414
|
+
onTouchEndCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1415
|
+
onTouchMove?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1416
|
+
onTouchMoveCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1417
|
+
onTouchStart?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1418
|
+
onTouchStartCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1419
|
+
onPointerDown?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1420
|
+
onPointerDownCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1421
|
+
onPointerMove?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1422
|
+
onPointerMoveCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1423
|
+
onPointerUp?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1424
|
+
onPointerUpCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1425
|
+
onPointerCancel?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1426
|
+
onPointerCancelCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1427
|
+
onPointerEnter?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1428
|
+
onPointerLeave?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1429
|
+
onPointerOver?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1430
|
+
onPointerOverCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1431
|
+
onPointerOut?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1432
|
+
onPointerOutCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1433
|
+
onGotPointerCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1434
|
+
onGotPointerCaptureCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1435
|
+
onLostPointerCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1436
|
+
onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1437
|
+
onScroll?: React.UIEventHandler<HTMLDivElement> | undefined;
|
|
1438
|
+
onScrollCapture?: React.UIEventHandler<HTMLDivElement> | undefined;
|
|
1439
|
+
onScrollEnd?: React.UIEventHandler<HTMLDivElement> | undefined;
|
|
1440
|
+
onScrollEndCapture?: React.UIEventHandler<HTMLDivElement> | undefined;
|
|
1441
|
+
onWheel?: React.WheelEventHandler<HTMLDivElement> | undefined;
|
|
1442
|
+
onWheelCapture?: React.WheelEventHandler<HTMLDivElement> | undefined;
|
|
1443
|
+
onAnimationStart?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1444
|
+
onAnimationStartCapture?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1445
|
+
onAnimationEnd?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1446
|
+
onAnimationEndCapture?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1447
|
+
onAnimationIteration?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1448
|
+
onAnimationIterationCapture?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1449
|
+
onToggle?: React.ToggleEventHandler<HTMLDivElement> | undefined;
|
|
1450
|
+
onBeforeToggle?: React.ToggleEventHandler<HTMLDivElement> | undefined;
|
|
1451
|
+
onTransitionCancel?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1452
|
+
onTransitionCancelCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1453
|
+
onTransitionEnd?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1454
|
+
onTransitionEndCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1455
|
+
onTransitionRun?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1456
|
+
onTransitionRunCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1457
|
+
onTransitionStart?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1458
|
+
onTransitionStartCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1459
|
+
ref?: React.Ref<HTMLDivElement> | undefined;
|
|
1460
|
+
className: string | undefined;
|
|
1461
|
+
"data-sc-component": string;
|
|
1462
|
+
"data-sc-recipe": ComponentRecipe;
|
|
1463
|
+
style: React.CSSProperties;
|
|
1464
|
+
}, HTMLDivElement>;
|
|
1465
|
+
/** Props for determinate or simulated circular progress. */
|
|
1466
|
+
type CircularProgressProps = Omit<React.ComponentProps<"div">, "children"> & PrimitiveProps & {
|
|
1467
|
+
maxDuration?: number;
|
|
1468
|
+
done?: boolean;
|
|
1469
|
+
progress?: number;
|
|
1470
|
+
size?: number | string;
|
|
1471
|
+
strokeWidth?: number;
|
|
1472
|
+
trackActiveColor?: string;
|
|
1473
|
+
trackColor?: string;
|
|
1474
|
+
};
|
|
1475
|
+
/** Circular progress indicator with optional determinate value. */
|
|
1476
|
+
declare function CircularProgress({ className, done, progress, recipe, size, strokeWidth, style, trackActiveColor, trackColor, ...props }: CircularProgressProps): React.DetailedReactHTMLElement<{
|
|
1477
|
+
content?: string | undefined | undefined;
|
|
1478
|
+
title?: string | undefined | undefined;
|
|
1479
|
+
resource?: string | undefined | undefined;
|
|
1480
|
+
id?: string | undefined | undefined;
|
|
1481
|
+
key?: React.Key | null | undefined;
|
|
1482
|
+
color?: string | undefined | undefined;
|
|
1483
|
+
defaultChecked?: boolean | undefined | undefined;
|
|
1484
|
+
defaultValue?: string | number | readonly string[] | undefined;
|
|
1485
|
+
suppressContentEditableWarning?: boolean | undefined | undefined;
|
|
1486
|
+
suppressHydrationWarning?: boolean | undefined | undefined;
|
|
1487
|
+
accessKey?: string | undefined | undefined;
|
|
1488
|
+
autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
|
|
1489
|
+
autoFocus?: boolean | undefined | undefined;
|
|
1490
|
+
contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
|
|
1491
|
+
contextMenu?: string | undefined | undefined;
|
|
1492
|
+
dir?: string | undefined | undefined;
|
|
1493
|
+
draggable?: (boolean | "true" | "false") | undefined;
|
|
1494
|
+
enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
|
|
1495
|
+
hidden?: boolean | undefined | undefined;
|
|
1496
|
+
lang?: string | undefined | undefined;
|
|
1497
|
+
nonce?: string | undefined | undefined;
|
|
1498
|
+
slot?: string | undefined | undefined;
|
|
1499
|
+
spellCheck?: (boolean | "true" | "false") | undefined;
|
|
1500
|
+
tabIndex?: number | undefined | undefined;
|
|
1501
|
+
translate?: "yes" | "no" | undefined | undefined;
|
|
1502
|
+
radioGroup?: string | undefined | undefined;
|
|
1503
|
+
role: React.AriaRole;
|
|
1504
|
+
about?: string | undefined | undefined;
|
|
1505
|
+
datatype?: string | undefined | undefined;
|
|
1506
|
+
inlist?: any;
|
|
1507
|
+
prefix?: string | undefined | undefined;
|
|
1508
|
+
property?: string | undefined | undefined;
|
|
1509
|
+
rel?: string | undefined | undefined;
|
|
1510
|
+
rev?: string | undefined | undefined;
|
|
1511
|
+
typeof?: string | undefined | undefined;
|
|
1512
|
+
vocab?: string | undefined | undefined;
|
|
1513
|
+
autoCorrect?: string | undefined | undefined;
|
|
1514
|
+
autoSave?: string | undefined | undefined;
|
|
1515
|
+
itemProp?: string | undefined | undefined;
|
|
1516
|
+
itemScope?: boolean | undefined | undefined;
|
|
1517
|
+
itemType?: string | undefined | undefined;
|
|
1518
|
+
itemID?: string | undefined | undefined;
|
|
1519
|
+
itemRef?: string | undefined | undefined;
|
|
1520
|
+
results?: number | undefined | undefined;
|
|
1521
|
+
security?: string | undefined | undefined;
|
|
1522
|
+
unselectable?: "on" | "off" | undefined | undefined;
|
|
1523
|
+
popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
|
|
1524
|
+
popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
|
|
1525
|
+
popoverTarget?: string | undefined | undefined;
|
|
1526
|
+
inert?: boolean | undefined | undefined;
|
|
1527
|
+
inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
|
|
1528
|
+
is?: string | undefined | undefined;
|
|
1529
|
+
exportparts?: string | undefined | undefined;
|
|
1530
|
+
part?: string | undefined | undefined;
|
|
1531
|
+
"aria-activedescendant"?: string | undefined | undefined;
|
|
1532
|
+
"aria-atomic"?: (boolean | "true" | "false") | undefined;
|
|
1533
|
+
"aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
|
|
1534
|
+
"aria-braillelabel"?: string | undefined | undefined;
|
|
1535
|
+
"aria-brailleroledescription"?: string | undefined | undefined;
|
|
1536
|
+
"aria-busy"?: (boolean | "true" | "false") | undefined;
|
|
1537
|
+
"aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
|
|
1538
|
+
"aria-colcount"?: number | undefined | undefined;
|
|
1539
|
+
"aria-colindex"?: number | undefined | undefined;
|
|
1540
|
+
"aria-colindextext"?: string | undefined | undefined;
|
|
1541
|
+
"aria-colspan"?: number | undefined | undefined;
|
|
1542
|
+
"aria-controls"?: string | undefined | undefined;
|
|
1543
|
+
"aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
|
|
1544
|
+
"aria-describedby"?: string | undefined | undefined;
|
|
1545
|
+
"aria-description"?: string | undefined | undefined;
|
|
1546
|
+
"aria-details"?: string | undefined | undefined;
|
|
1547
|
+
"aria-disabled"?: (boolean | "true" | "false") | undefined;
|
|
1548
|
+
"aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
|
|
1549
|
+
"aria-errormessage"?: string | undefined | undefined;
|
|
1550
|
+
"aria-expanded"?: (boolean | "true" | "false") | undefined;
|
|
1551
|
+
"aria-flowto"?: string | undefined | undefined;
|
|
1552
|
+
"aria-grabbed"?: (boolean | "true" | "false") | undefined;
|
|
1553
|
+
"aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
|
|
1554
|
+
"aria-hidden"?: (boolean | "true" | "false") | undefined;
|
|
1555
|
+
"aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
|
|
1556
|
+
"aria-keyshortcuts"?: string | undefined | undefined;
|
|
1557
|
+
"aria-label"?: string | undefined | undefined;
|
|
1558
|
+
"aria-labelledby"?: string | undefined | undefined;
|
|
1559
|
+
"aria-level"?: number | undefined | undefined;
|
|
1560
|
+
"aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
|
|
1561
|
+
"aria-modal"?: (boolean | "true" | "false") | undefined;
|
|
1562
|
+
"aria-multiline"?: (boolean | "true" | "false") | undefined;
|
|
1563
|
+
"aria-multiselectable"?: (boolean | "true" | "false") | undefined;
|
|
1564
|
+
"aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
|
|
1565
|
+
"aria-owns"?: string | undefined | undefined;
|
|
1566
|
+
"aria-placeholder"?: string | undefined | undefined;
|
|
1567
|
+
"aria-posinset"?: number | undefined | undefined;
|
|
1568
|
+
"aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
|
|
1569
|
+
"aria-readonly"?: (boolean | "true" | "false") | undefined;
|
|
1570
|
+
"aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
|
|
1571
|
+
"aria-required"?: (boolean | "true" | "false") | undefined;
|
|
1572
|
+
"aria-roledescription"?: string | undefined | undefined;
|
|
1573
|
+
"aria-rowcount"?: number | undefined | undefined;
|
|
1574
|
+
"aria-rowindex"?: number | undefined | undefined;
|
|
1575
|
+
"aria-rowindextext"?: string | undefined | undefined;
|
|
1576
|
+
"aria-rowspan"?: number | undefined | undefined;
|
|
1577
|
+
"aria-selected"?: (boolean | "true" | "false") | undefined;
|
|
1578
|
+
"aria-setsize"?: number | undefined | undefined;
|
|
1579
|
+
"aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
|
|
1580
|
+
"aria-valuemax": number;
|
|
1581
|
+
"aria-valuemin": number;
|
|
1582
|
+
"aria-valuenow": number;
|
|
1583
|
+
"aria-valuetext"?: string | undefined | undefined;
|
|
1584
|
+
dangerouslySetInnerHTML?: {
|
|
1585
|
+
__html: string | TrustedHTML;
|
|
1586
|
+
} | undefined | undefined;
|
|
1587
|
+
onCopy?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1588
|
+
onCopyCapture?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1589
|
+
onCut?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1590
|
+
onCutCapture?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1591
|
+
onPaste?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1592
|
+
onPasteCapture?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
|
|
1593
|
+
onCompositionEnd?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1594
|
+
onCompositionEndCapture?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1595
|
+
onCompositionStart?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1596
|
+
onCompositionStartCapture?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1597
|
+
onCompositionUpdate?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1598
|
+
onCompositionUpdateCapture?: React.CompositionEventHandler<HTMLDivElement> | undefined;
|
|
1599
|
+
onFocus?: React.FocusEventHandler<HTMLDivElement> | undefined;
|
|
1600
|
+
onFocusCapture?: React.FocusEventHandler<HTMLDivElement> | undefined;
|
|
1601
|
+
onBlur?: React.FocusEventHandler<HTMLDivElement> | undefined;
|
|
1602
|
+
onBlurCapture?: React.FocusEventHandler<HTMLDivElement> | undefined;
|
|
1603
|
+
onChange?: React.ChangeEventHandler<HTMLDivElement, Element> | undefined;
|
|
1604
|
+
onChangeCapture?: React.ChangeEventHandler<HTMLDivElement, Element> | undefined;
|
|
1605
|
+
onBeforeInput?: React.InputEventHandler<HTMLDivElement> | undefined;
|
|
1606
|
+
onBeforeInputCapture?: React.InputEventHandler<HTMLDivElement> | undefined;
|
|
1607
|
+
onInput?: React.InputEventHandler<HTMLDivElement> | undefined;
|
|
1608
|
+
onInputCapture?: React.InputEventHandler<HTMLDivElement> | undefined;
|
|
1609
|
+
onReset?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1610
|
+
onResetCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1611
|
+
onSubmit?: React.SubmitEventHandler<HTMLDivElement> | undefined;
|
|
1612
|
+
onSubmitCapture?: React.SubmitEventHandler<HTMLDivElement> | undefined;
|
|
1613
|
+
onInvalid?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1614
|
+
onInvalidCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1615
|
+
onLoad?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1616
|
+
onLoadCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1617
|
+
onError?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1618
|
+
onErrorCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1619
|
+
onKeyDown?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1620
|
+
onKeyDownCapture?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1621
|
+
onKeyPress?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1622
|
+
onKeyPressCapture?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1623
|
+
onKeyUp?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1624
|
+
onKeyUpCapture?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
|
|
1625
|
+
onAbort?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1626
|
+
onAbortCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1627
|
+
onCanPlay?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1628
|
+
onCanPlayCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1629
|
+
onCanPlayThrough?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1630
|
+
onCanPlayThroughCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1631
|
+
onDurationChange?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1632
|
+
onDurationChangeCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1633
|
+
onEmptied?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1634
|
+
onEmptiedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1635
|
+
onEncrypted?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1636
|
+
onEncryptedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1637
|
+
onEnded?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1638
|
+
onEndedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1639
|
+
onLoadedData?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1640
|
+
onLoadedDataCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1641
|
+
onLoadedMetadata?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1642
|
+
onLoadedMetadataCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1643
|
+
onLoadStart?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1644
|
+
onLoadStartCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1645
|
+
onPause?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1646
|
+
onPauseCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1647
|
+
onPlay?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1648
|
+
onPlayCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1649
|
+
onPlaying?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1650
|
+
onPlayingCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1651
|
+
onProgress?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1652
|
+
onProgressCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1653
|
+
onRateChange?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1654
|
+
onRateChangeCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1655
|
+
onSeeked?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1656
|
+
onSeekedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1657
|
+
onSeeking?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1658
|
+
onSeekingCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1659
|
+
onStalled?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1660
|
+
onStalledCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1661
|
+
onSuspend?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1662
|
+
onSuspendCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1663
|
+
onTimeUpdate?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1664
|
+
onTimeUpdateCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1665
|
+
onVolumeChange?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1666
|
+
onVolumeChangeCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1667
|
+
onWaiting?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1668
|
+
onWaitingCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1669
|
+
onAuxClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1670
|
+
onAuxClickCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1671
|
+
onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1672
|
+
onClickCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1673
|
+
onContextMenu?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1674
|
+
onContextMenuCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1675
|
+
onDoubleClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1676
|
+
onDoubleClickCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1677
|
+
onDrag?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1678
|
+
onDragCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1679
|
+
onDragEnd?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1680
|
+
onDragEndCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1681
|
+
onDragEnter?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1682
|
+
onDragEnterCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1683
|
+
onDragExit?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1684
|
+
onDragExitCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1685
|
+
onDragLeave?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1686
|
+
onDragLeaveCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1687
|
+
onDragOver?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1688
|
+
onDragOverCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1689
|
+
onDragStart?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1690
|
+
onDragStartCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1691
|
+
onDrop?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1692
|
+
onDropCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
|
|
1693
|
+
onMouseDown?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1694
|
+
onMouseDownCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1695
|
+
onMouseEnter?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1696
|
+
onMouseLeave?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1697
|
+
onMouseMove?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1698
|
+
onMouseMoveCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1699
|
+
onMouseOut?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1700
|
+
onMouseOutCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1701
|
+
onMouseOver?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1702
|
+
onMouseOverCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1703
|
+
onMouseUp?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1704
|
+
onMouseUpCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
1705
|
+
onSelect?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1706
|
+
onSelectCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
|
|
1707
|
+
onTouchCancel?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1708
|
+
onTouchCancelCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1709
|
+
onTouchEnd?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1710
|
+
onTouchEndCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1711
|
+
onTouchMove?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1712
|
+
onTouchMoveCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1713
|
+
onTouchStart?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1714
|
+
onTouchStartCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
|
|
1715
|
+
onPointerDown?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1716
|
+
onPointerDownCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1717
|
+
onPointerMove?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1718
|
+
onPointerMoveCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1719
|
+
onPointerUp?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1720
|
+
onPointerUpCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1721
|
+
onPointerCancel?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1722
|
+
onPointerCancelCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1723
|
+
onPointerEnter?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1724
|
+
onPointerLeave?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1725
|
+
onPointerOver?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1726
|
+
onPointerOverCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1727
|
+
onPointerOut?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1728
|
+
onPointerOutCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1729
|
+
onGotPointerCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1730
|
+
onGotPointerCaptureCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1731
|
+
onLostPointerCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1732
|
+
onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
|
|
1733
|
+
onScroll?: React.UIEventHandler<HTMLDivElement> | undefined;
|
|
1734
|
+
onScrollCapture?: React.UIEventHandler<HTMLDivElement> | undefined;
|
|
1735
|
+
onScrollEnd?: React.UIEventHandler<HTMLDivElement> | undefined;
|
|
1736
|
+
onScrollEndCapture?: React.UIEventHandler<HTMLDivElement> | undefined;
|
|
1737
|
+
onWheel?: React.WheelEventHandler<HTMLDivElement> | undefined;
|
|
1738
|
+
onWheelCapture?: React.WheelEventHandler<HTMLDivElement> | undefined;
|
|
1739
|
+
onAnimationStart?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1740
|
+
onAnimationStartCapture?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1741
|
+
onAnimationEnd?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1742
|
+
onAnimationEndCapture?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1743
|
+
onAnimationIteration?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1744
|
+
onAnimationIterationCapture?: React.AnimationEventHandler<HTMLDivElement> | undefined;
|
|
1745
|
+
onToggle?: React.ToggleEventHandler<HTMLDivElement> | undefined;
|
|
1746
|
+
onBeforeToggle?: React.ToggleEventHandler<HTMLDivElement> | undefined;
|
|
1747
|
+
onTransitionCancel?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1748
|
+
onTransitionCancelCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1749
|
+
onTransitionEnd?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1750
|
+
onTransitionEndCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1751
|
+
onTransitionRun?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1752
|
+
onTransitionRunCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1753
|
+
onTransitionStart?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1754
|
+
onTransitionStartCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
|
|
1755
|
+
ref?: React.Ref<HTMLDivElement> | undefined;
|
|
1756
|
+
maxDuration?: number;
|
|
1757
|
+
className: string | undefined;
|
|
1758
|
+
"data-sc-component": string;
|
|
1759
|
+
"data-sc-recipe": ComponentRecipe;
|
|
1760
|
+
style: React.CSSProperties;
|
|
1761
|
+
}, HTMLDivElement>;
|
|
1762
|
+
/** Backward-compatible alias for indeterminate loading. */
|
|
1763
|
+
declare const Spinner: typeof LoadingIndicator;
|
|
1764
|
+
type SpinnerProps = LoadingIndicatorProps;
|
|
1765
|
+
/** Props for progress bars. */
|
|
1766
|
+
type ProgressProps = React.ProgressHTMLAttributes<HTMLProgressElement> & PrimitiveProps;
|
|
1767
|
+
/** Native progress element with host-adaptive colors. */
|
|
1768
|
+
declare const Progress: React.ForwardRefExoticComponent<React.ProgressHTMLAttributes<HTMLProgressElement> & PrimitiveProps & React.RefAttributes<HTMLProgressElement>>;
|
|
1769
|
+
/** Props for shimmer text. */
|
|
1770
|
+
type ShimmerTextProps = PrimitiveProps & {
|
|
1771
|
+
as?: "p" | "span" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "div";
|
|
1772
|
+
children: React.ReactNode;
|
|
1773
|
+
className?: string;
|
|
1774
|
+
};
|
|
1775
|
+
/** Text skeleton shimmer that preserves the surrounding typography. */
|
|
1776
|
+
declare function ShimmerText({ as: Tag, children, className, recipe }: ShimmerTextProps): React.DetailedReactHTMLElement<{
|
|
1777
|
+
className: string | undefined;
|
|
1778
|
+
"data-sc-component": string;
|
|
1779
|
+
"data-sc-recipe": ComponentRecipe;
|
|
1780
|
+
}, HTMLElement>;
|
|
1781
|
+
/** Props for text links. */
|
|
1782
|
+
type TextLinkProps = Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "children"> & PrimitiveProps & {
|
|
1783
|
+
children: React.ReactNode;
|
|
1784
|
+
primary?: boolean;
|
|
1785
|
+
underline?: boolean;
|
|
1786
|
+
forceExternal?: boolean;
|
|
1787
|
+
};
|
|
1788
|
+
/** Anchor with host-adaptive text-link affordances. */
|
|
1789
|
+
declare const TextLink: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "children"> & PrimitiveProps & {
|
|
1790
|
+
children: React.ReactNode;
|
|
1791
|
+
primary?: boolean;
|
|
1792
|
+
underline?: boolean;
|
|
1793
|
+
forceExternal?: boolean;
|
|
1794
|
+
} & React.RefAttributes<HTMLAnchorElement>>;
|
|
1795
|
+
/** Props for images inside widgets. */
|
|
1796
|
+
type ImageProps = React.ImgHTMLAttributes<HTMLImageElement> & PrimitiveProps & {
|
|
1797
|
+
forceRenderAfterLoadFail?: boolean;
|
|
1798
|
+
};
|
|
1799
|
+
/** Responsive image primitive with stable block sizing defaults. */
|
|
1800
|
+
declare const Image: React.ForwardRefExoticComponent<React.ImgHTMLAttributes<HTMLImageElement> & PrimitiveProps & {
|
|
1801
|
+
forceRenderAfterLoadFail?: boolean;
|
|
1802
|
+
} & React.RefAttributes<HTMLImageElement>>;
|
|
1803
|
+
/** Props for skeleton loading blocks. */
|
|
1804
|
+
type SkeletonProps = React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & {
|
|
1805
|
+
width?: string;
|
|
1806
|
+
height?: string;
|
|
1807
|
+
};
|
|
1808
|
+
/** Host-adaptive skeleton block for widget loading states. */
|
|
1809
|
+
declare const Skeleton: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & {
|
|
1810
|
+
width?: string;
|
|
1811
|
+
height?: string;
|
|
1812
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
1813
|
+
/** Props for form-field wrappers. */
|
|
1814
|
+
type FormFieldProps = React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & {
|
|
1815
|
+
invalid?: boolean;
|
|
1816
|
+
disabled?: boolean;
|
|
1817
|
+
required?: boolean;
|
|
1818
|
+
};
|
|
1819
|
+
type FieldContextValue = {
|
|
1820
|
+
controlId: string;
|
|
1821
|
+
descriptionId: string;
|
|
1822
|
+
errorId: string;
|
|
1823
|
+
disabled: boolean;
|
|
1824
|
+
invalid: boolean;
|
|
1825
|
+
required: boolean;
|
|
1826
|
+
};
|
|
1827
|
+
/** Form field wrapper that wires labels, descriptions, errors, and controls. */
|
|
1828
|
+
declare function FormField({ children, disabled, id, invalid, recipe, required, ...props }: FormFieldProps): React.FunctionComponentElement<React.ProviderProps<FieldContextValue | null>>;
|
|
1829
|
+
/** Props for field labels. */
|
|
1830
|
+
type FieldLabelProps = React.LabelHTMLAttributes<HTMLLabelElement> & PrimitiveProps;
|
|
1831
|
+
/** Label that automatically binds to the nearest `FormField` control. */
|
|
1832
|
+
declare const FieldLabel: React.ForwardRefExoticComponent<React.LabelHTMLAttributes<HTMLLabelElement> & PrimitiveProps & React.RefAttributes<HTMLLabelElement>>;
|
|
1833
|
+
/** Props for field descriptions. */
|
|
1834
|
+
type FieldDescriptionProps = React.HTMLAttributes<HTMLParagraphElement> & PrimitiveProps;
|
|
1835
|
+
/** Description text that automatically binds to the nearest `FormField`. */
|
|
1836
|
+
declare const FieldDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & PrimitiveProps & React.RefAttributes<HTMLParagraphElement>>;
|
|
1837
|
+
/** Props for field errors. */
|
|
1838
|
+
type FieldErrorProps = React.HTMLAttributes<HTMLParagraphElement> & PrimitiveProps;
|
|
1839
|
+
/** Error text that automatically binds to the nearest invalid `FormField`. */
|
|
1840
|
+
declare const FieldError: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & PrimitiveProps & React.RefAttributes<HTMLParagraphElement>>;
|
|
1841
|
+
/** Props for neutral surfaces such as panels and repeated cards. */
|
|
1842
|
+
type SurfaceProps = React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & {
|
|
1843
|
+
variant?: "plain" | "card" | "inset";
|
|
1844
|
+
};
|
|
1845
|
+
/** Transparent-by-default surface that can opt into card framing. */
|
|
1846
|
+
declare const Surface: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & {
|
|
1847
|
+
variant?: "plain" | "card" | "inset";
|
|
1848
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
1849
|
+
/** Props for simple vertical layout stacks. */
|
|
1850
|
+
type StackProps = React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & {
|
|
1851
|
+
gap?: "xs" | "sm" | "md" | "lg";
|
|
1852
|
+
};
|
|
1853
|
+
/** Vertical stack with host-appropriate spacing tokens. */
|
|
1854
|
+
declare const Stack: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & {
|
|
1855
|
+
gap?: "xs" | "sm" | "md" | "lg";
|
|
1856
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
1857
|
+
/** Props for horizontal inline layout. */
|
|
1858
|
+
type InlineProps = React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & {
|
|
1859
|
+
align?: "start" | "center" | "end";
|
|
1860
|
+
gap?: "xs" | "sm" | "md" | "lg";
|
|
1861
|
+
wrap?: boolean;
|
|
1862
|
+
};
|
|
1863
|
+
/** Horizontal layout primitive for controls and compact metadata. */
|
|
1864
|
+
declare const Inline: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & {
|
|
1865
|
+
align?: "start" | "center" | "end";
|
|
1866
|
+
gap?: "xs" | "sm" | "md" | "lg";
|
|
1867
|
+
wrap?: boolean;
|
|
1868
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
1869
|
+
/** Props for a host-adaptive divider. */
|
|
1870
|
+
type DividerProps = React.HTMLAttributes<HTMLHRElement> & PrimitiveProps;
|
|
1871
|
+
/** Thin separator using the active host border token. */
|
|
1872
|
+
declare const Divider: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHRElement> & PrimitiveProps & React.RefAttributes<HTMLHRElement>>;
|
|
1873
|
+
/** Props for inline code text. */
|
|
1874
|
+
type CodeProps = React.HTMLAttributes<HTMLElement> & PrimitiveProps;
|
|
1875
|
+
/** Inline code primitive for ids, paths, and short literals. */
|
|
1876
|
+
declare const Code: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & PrimitiveProps & React.RefAttributes<HTMLElement>>;
|
|
1877
|
+
/** Props for tab-list composition. */
|
|
1878
|
+
type TabsProps = React.HTMLAttributes<HTMLDivElement> & PrimitiveProps;
|
|
1879
|
+
/** Minimal tabs container for author-composed tab buttons and panels. */
|
|
1880
|
+
declare const Tabs: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & React.RefAttributes<HTMLDivElement>>;
|
|
1881
|
+
/** Props for numeric slider input. */
|
|
1882
|
+
type SliderProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> & PrimitiveProps;
|
|
1883
|
+
/** Range slider using host accent colors. */
|
|
1884
|
+
declare const Slider: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> & PrimitiveProps & React.RefAttributes<HTMLInputElement>>;
|
|
1885
|
+
/** Props for tabular data. */
|
|
1886
|
+
type TableProps = React.TableHTMLAttributes<HTMLTableElement> & PrimitiveProps;
|
|
1887
|
+
/** Simple table wrapper with host border and text defaults. */
|
|
1888
|
+
declare const Table: React.ForwardRefExoticComponent<React.TableHTMLAttributes<HTMLTableElement> & PrimitiveProps & React.RefAttributes<HTMLTableElement>>;
|
|
1889
|
+
/** Key-value item rendered by `KeyValue`. */
|
|
1890
|
+
type KeyValueItem = {
|
|
1891
|
+
key: React.ReactNode;
|
|
1892
|
+
value: React.ReactNode;
|
|
1893
|
+
};
|
|
1894
|
+
/** Props for compact definition-list metadata. */
|
|
1895
|
+
type KeyValueProps = React.HTMLAttributes<HTMLDListElement> & PrimitiveProps & {
|
|
1896
|
+
items: readonly KeyValueItem[];
|
|
1897
|
+
};
|
|
1898
|
+
/** Compact key-value list for facts and metadata. */
|
|
1899
|
+
declare const KeyValue: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDListElement> & PrimitiveProps & {
|
|
1900
|
+
items: readonly KeyValueItem[];
|
|
1901
|
+
} & React.RefAttributes<HTMLDListElement>>;
|
|
1902
|
+
/** Creates a scoped set of primitives pinned to one host recipe. */
|
|
1903
|
+
declare function createPrimitiveComponents(recipe: Exclude<ComponentRecipe, "auto">): {
|
|
1904
|
+
Alert: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, "title" | "color"> & PrimitiveProps & {
|
|
1905
|
+
color?: SemanticColors<"primary" | "danger" | "success" | "info" | "discovery" | "caution" | "warning">;
|
|
1906
|
+
variant?: Variants<"solid" | "soft" | "outline">;
|
|
1907
|
+
title?: React.ReactNode;
|
|
1908
|
+
description?: React.ReactNode;
|
|
1909
|
+
actions?: React.ReactNode;
|
|
1910
|
+
actionsPlacement?: "end" | "bottom";
|
|
1911
|
+
indicator?: React.ReactNode | false;
|
|
1912
|
+
actionsClassName?: string;
|
|
1913
|
+
/** Backward-compatible alias for `color`. */
|
|
1914
|
+
tone?: "default" | "success" | "warning" | "danger";
|
|
1915
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
1916
|
+
Avatar: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> & PrimitiveProps & {
|
|
1917
|
+
size?: number;
|
|
1918
|
+
overflowCount?: number;
|
|
1919
|
+
name?: string;
|
|
1920
|
+
color?: SemanticColors<"primary" | "secondary" | "success" | "info" | "discovery" | "danger">;
|
|
1921
|
+
variant?: Variants<"soft" | "solid">;
|
|
1922
|
+
imageUrl?: string;
|
|
1923
|
+
Icon?: React.ComponentType<React.SVGProps<SVGSVGElement>>;
|
|
1924
|
+
onClick?: () => void;
|
|
1925
|
+
onPointerDown?: () => void;
|
|
1926
|
+
/** Backward-compatible alias for `imageUrl`. */
|
|
1927
|
+
src?: string;
|
|
1928
|
+
/** Backward-compatible alt text for image avatars. */
|
|
1929
|
+
alt?: string;
|
|
1930
|
+
/** Backward-compatible fallback content. */
|
|
1931
|
+
fallback?: React.ReactNode;
|
|
1932
|
+
} & React.RefAttributes<HTMLSpanElement>>;
|
|
1933
|
+
AvatarGroup: typeof AvatarGroup;
|
|
1934
|
+
Badge: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> & PrimitiveProps & {
|
|
1935
|
+
children?: React.ReactNode;
|
|
1936
|
+
variant?: Variants<"solid" | "soft" | "outline">;
|
|
1937
|
+
size?: Sizes<"sm" | "md" | "lg">;
|
|
1938
|
+
pill?: boolean;
|
|
1939
|
+
color?: SemanticColors<"secondary" | "success" | "danger" | "warning" | "info" | "discovery">;
|
|
1940
|
+
/** Backward-compatible alias for `color`. */
|
|
1941
|
+
tone?: "default" | "success" | "warning" | "danger";
|
|
1942
|
+
} & React.RefAttributes<HTMLSpanElement>>;
|
|
1943
|
+
Button: React.ForwardRefExoticComponent<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "color"> & PrimitiveProps & {
|
|
1944
|
+
/**
|
|
1945
|
+
* Semantic color for the button.
|
|
1946
|
+
* @default "secondary"
|
|
1947
|
+
*/
|
|
1948
|
+
color?: SemanticColors<"primary" | "secondary" | "danger" | "success" | "info" | "discovery" | "caution" | "warning">;
|
|
1949
|
+
/**
|
|
1950
|
+
* Visual style for the button.
|
|
1951
|
+
* @default "solid"
|
|
1952
|
+
*/
|
|
1953
|
+
variant?: Variants<"solid" | "soft" | "outline" | "ghost"> | ControlIntent;
|
|
1954
|
+
/** Backward-compatible alias for `color` from early Sidecar examples. */
|
|
1955
|
+
intent?: ControlIntent;
|
|
1956
|
+
/**
|
|
1957
|
+
* Determines if the button should be a fully rounded pill shape.
|
|
1958
|
+
* @default true
|
|
1959
|
+
*/
|
|
1960
|
+
pill?: boolean;
|
|
1961
|
+
/** Controls disabled cursor treatment without changing disabled semantics. */
|
|
1962
|
+
disabledTone?: "relaxed";
|
|
1963
|
+
/**
|
|
1964
|
+
* Extends the control to 100% of available width.
|
|
1965
|
+
* @default false
|
|
1966
|
+
*/
|
|
1967
|
+
block?: boolean;
|
|
1968
|
+
/** Applies a negative margin to optically align with surrounding content. */
|
|
1969
|
+
opticallyAlign?: "start" | "end";
|
|
1970
|
+
/**
|
|
1971
|
+
* Controls button height and default icon/text scale.
|
|
1972
|
+
* @default "md"
|
|
1973
|
+
*/
|
|
1974
|
+
size?: ControlSize;
|
|
1975
|
+
/** Explicit icon size override. */
|
|
1976
|
+
iconSize?: Sizes<"sm" | "md" | "lg" | "xl" | "2xl">;
|
|
1977
|
+
/** Explicit horizontal gutter override. */
|
|
1978
|
+
gutterSize?: Sizes<"3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
1979
|
+
/**
|
|
1980
|
+
* Makes the button width match its height.
|
|
1981
|
+
* @default false
|
|
1982
|
+
*/
|
|
1983
|
+
uniform?: boolean;
|
|
1984
|
+
/**
|
|
1985
|
+
* Displays selected styles on the button.
|
|
1986
|
+
* @default false
|
|
1987
|
+
*/
|
|
1988
|
+
selected?: boolean;
|
|
1989
|
+
/**
|
|
1990
|
+
* Displays loading indicator and disables interaction.
|
|
1991
|
+
* @default false
|
|
1992
|
+
*/
|
|
1993
|
+
loading?: boolean;
|
|
1994
|
+
/**
|
|
1995
|
+
* Makes the button inert without changing visual treatment.
|
|
1996
|
+
* @default false
|
|
1997
|
+
*/
|
|
1998
|
+
inert?: boolean;
|
|
1999
|
+
} & React.RefAttributes<HTMLButtonElement>>;
|
|
2000
|
+
ButtonLink: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "color"> & PrimitiveProps & {
|
|
2001
|
+
/**
|
|
2002
|
+
* Semantic color for the button.
|
|
2003
|
+
* @default "secondary"
|
|
2004
|
+
*/
|
|
2005
|
+
color?: SemanticColors<"primary" | "secondary" | "danger" | "success" | "info" | "discovery" | "caution" | "warning">;
|
|
2006
|
+
/**
|
|
2007
|
+
* Visual style for the button.
|
|
2008
|
+
* @default "solid"
|
|
2009
|
+
*/
|
|
2010
|
+
variant?: Variants<"solid" | "soft" | "outline" | "ghost"> | ControlIntent;
|
|
2011
|
+
/** Backward-compatible alias for `color` from early Sidecar examples. */
|
|
2012
|
+
intent?: ControlIntent;
|
|
2013
|
+
/**
|
|
2014
|
+
* Determines if the button should be a fully rounded pill shape.
|
|
2015
|
+
* @default true
|
|
2016
|
+
*/
|
|
2017
|
+
pill?: boolean;
|
|
2018
|
+
/** Controls disabled cursor treatment without changing disabled semantics. */
|
|
2019
|
+
disabledTone?: "relaxed";
|
|
2020
|
+
/**
|
|
2021
|
+
* Extends the control to 100% of available width.
|
|
2022
|
+
* @default false
|
|
2023
|
+
*/
|
|
2024
|
+
block?: boolean;
|
|
2025
|
+
/** Applies a negative margin to optically align with surrounding content. */
|
|
2026
|
+
opticallyAlign?: "start" | "end";
|
|
2027
|
+
/**
|
|
2028
|
+
* Controls button height and default icon/text scale.
|
|
2029
|
+
* @default "md"
|
|
2030
|
+
*/
|
|
2031
|
+
size?: ControlSize;
|
|
2032
|
+
/** Explicit icon size override. */
|
|
2033
|
+
iconSize?: Sizes<"sm" | "md" | "lg" | "xl" | "2xl">;
|
|
2034
|
+
/** Explicit horizontal gutter override. */
|
|
2035
|
+
gutterSize?: Sizes<"3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
2036
|
+
/**
|
|
2037
|
+
* Makes the button width match its height.
|
|
2038
|
+
* @default false
|
|
2039
|
+
*/
|
|
2040
|
+
uniform?: boolean;
|
|
2041
|
+
/**
|
|
2042
|
+
* Displays selected styles on the button.
|
|
2043
|
+
* @default false
|
|
2044
|
+
*/
|
|
2045
|
+
selected?: boolean;
|
|
2046
|
+
/**
|
|
2047
|
+
* Displays loading indicator and disables interaction.
|
|
2048
|
+
* @default false
|
|
2049
|
+
*/
|
|
2050
|
+
loading?: boolean;
|
|
2051
|
+
/**
|
|
2052
|
+
* Makes the button inert without changing visual treatment.
|
|
2053
|
+
* @default false
|
|
2054
|
+
*/
|
|
2055
|
+
inert?: boolean;
|
|
2056
|
+
} & {
|
|
2057
|
+
/** Forces external-link treatment when automatic detection is insufficient. */
|
|
2058
|
+
external?: boolean;
|
|
2059
|
+
} & React.RefAttributes<HTMLAnchorElement>>;
|
|
2060
|
+
Callout: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, "title" | "color"> & PrimitiveProps & {
|
|
2061
|
+
color?: SemanticColors<"primary" | "danger" | "success" | "info" | "discovery" | "caution" | "warning">;
|
|
2062
|
+
variant?: Variants<"solid" | "soft" | "outline">;
|
|
2063
|
+
title?: React.ReactNode;
|
|
2064
|
+
description?: React.ReactNode;
|
|
2065
|
+
actions?: React.ReactNode;
|
|
2066
|
+
actionsPlacement?: "end" | "bottom";
|
|
2067
|
+
indicator?: React.ReactNode | false;
|
|
2068
|
+
actionsClassName?: string;
|
|
2069
|
+
/** Backward-compatible alias for `color`. */
|
|
2070
|
+
tone?: "default" | "success" | "warning" | "danger";
|
|
2071
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
2072
|
+
Checkbox: typeof Checkbox;
|
|
2073
|
+
CircularProgress: typeof CircularProgress;
|
|
2074
|
+
Code: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & PrimitiveProps & React.RefAttributes<HTMLElement>>;
|
|
2075
|
+
CopyButton: typeof CopyButton;
|
|
2076
|
+
Divider: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHRElement> & PrimitiveProps & React.RefAttributes<HTMLHRElement>>;
|
|
2077
|
+
EmptyMessage: typeof EmptyMessageRoot & {
|
|
2078
|
+
ActionRow: typeof EmptyMessageActionRow;
|
|
2079
|
+
Description: typeof EmptyMessageDescription;
|
|
2080
|
+
Icon: typeof EmptyMessageIcon;
|
|
2081
|
+
Title: typeof EmptyMessageTitle;
|
|
2082
|
+
};
|
|
2083
|
+
EmptyState: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, "title"> & PrimitiveProps & {
|
|
2084
|
+
title: React.ReactNode;
|
|
2085
|
+
action?: React.ReactNode;
|
|
2086
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
2087
|
+
FieldDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & PrimitiveProps & React.RefAttributes<HTMLParagraphElement>>;
|
|
2088
|
+
FieldError: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & PrimitiveProps & React.RefAttributes<HTMLParagraphElement>>;
|
|
2089
|
+
FieldLabel: React.ForwardRefExoticComponent<React.LabelHTMLAttributes<HTMLLabelElement> & PrimitiveProps & React.RefAttributes<HTMLLabelElement>>;
|
|
2090
|
+
FormField: typeof FormField;
|
|
2091
|
+
Heading: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & PrimitiveProps & {
|
|
2092
|
+
level?: 1 | 2 | 3 | 4;
|
|
2093
|
+
} & React.RefAttributes<HTMLHeadingElement>>;
|
|
2094
|
+
Image: React.ForwardRefExoticComponent<React.ImgHTMLAttributes<HTMLImageElement> & PrimitiveProps & {
|
|
2095
|
+
forceRenderAfterLoadFail?: boolean;
|
|
2096
|
+
} & React.RefAttributes<HTMLImageElement>>;
|
|
2097
|
+
Inline: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & {
|
|
2098
|
+
align?: "start" | "center" | "end";
|
|
2099
|
+
gap?: "xs" | "sm" | "md" | "lg";
|
|
2100
|
+
wrap?: boolean;
|
|
2101
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
2102
|
+
Input: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "disabled"> & PrimitiveProps & {
|
|
2103
|
+
/** Visual style of the input. */
|
|
2104
|
+
variant?: Variants<"outline" | "soft">;
|
|
2105
|
+
/** Control size. */
|
|
2106
|
+
size?: ControlSize;
|
|
2107
|
+
/** Explicit horizontal gutter override. */
|
|
2108
|
+
gutterSize?: Sizes<"2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
2109
|
+
/** Disables the input visually and from interactions. */
|
|
2110
|
+
disabled?: boolean;
|
|
2111
|
+
/** Marks the input as invalid. */
|
|
2112
|
+
invalid?: boolean;
|
|
2113
|
+
/** Allow autofill extensions to appear in the input. */
|
|
2114
|
+
allowAutofillExtensions?: boolean;
|
|
2115
|
+
/** Selects all contents when the input mounts. */
|
|
2116
|
+
autoSelect?: boolean;
|
|
2117
|
+
/** Callback invoked when browser autofill is detected. */
|
|
2118
|
+
onAutofill?: () => void;
|
|
2119
|
+
/** Content rendered at the start of the control. */
|
|
2120
|
+
startAdornment?: React.ReactNode;
|
|
2121
|
+
/** Content rendered at the end of the control. */
|
|
2122
|
+
endAdornment?: React.ReactNode;
|
|
2123
|
+
/** Fully rounded pill shape. */
|
|
2124
|
+
pill?: boolean;
|
|
2125
|
+
/** Extends the control to 100% width. */
|
|
2126
|
+
block?: boolean;
|
|
2127
|
+
/** Applies a negative margin to optically align with surrounding content. */
|
|
2128
|
+
opticallyAlign?: "start" | "end";
|
|
2129
|
+
} & React.RefAttributes<HTMLInputElement>>;
|
|
2130
|
+
KeyValue: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDListElement> & PrimitiveProps & {
|
|
2131
|
+
items: readonly KeyValueItem[];
|
|
2132
|
+
} & React.RefAttributes<HTMLDListElement>>;
|
|
2133
|
+
LoadingDots: typeof LoadingDots;
|
|
2134
|
+
LoadingIndicator: typeof LoadingIndicator;
|
|
2135
|
+
Progress: React.ForwardRefExoticComponent<React.ProgressHTMLAttributes<HTMLProgressElement> & PrimitiveProps & React.RefAttributes<HTMLProgressElement>>;
|
|
2136
|
+
RadioGroup: typeof RadioGroupRoot & {
|
|
2137
|
+
Item: typeof RadioGroupItem;
|
|
2138
|
+
};
|
|
2139
|
+
SegmentedControl: typeof SegmentedControlRoot & {
|
|
2140
|
+
Option: typeof SegmentedControlOption;
|
|
2141
|
+
};
|
|
2142
|
+
Select: typeof Select;
|
|
2143
|
+
SelectControl: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLSpanElement>, "onClick"> & PrimitiveProps & {
|
|
2144
|
+
variant?: Variants<"soft" | "outline" | "ghost">;
|
|
2145
|
+
pill?: boolean;
|
|
2146
|
+
block?: boolean;
|
|
2147
|
+
opticallyAlign?: "start" | "end";
|
|
2148
|
+
disabled?: boolean;
|
|
2149
|
+
invalid?: boolean;
|
|
2150
|
+
selected?: boolean;
|
|
2151
|
+
onClearClick?: () => void;
|
|
2152
|
+
onInteract?: () => void;
|
|
2153
|
+
size?: ControlSize;
|
|
2154
|
+
loading?: boolean;
|
|
2155
|
+
dropdownIconType?: DropdownIconType;
|
|
2156
|
+
StartIcon?: React.ComponentType<React.SVGProps<SVGSVGElement>>;
|
|
2157
|
+
children: React.ReactNode;
|
|
2158
|
+
} & React.RefAttributes<HTMLSpanElement>>;
|
|
2159
|
+
ShimmerText: typeof ShimmerText;
|
|
2160
|
+
Skeleton: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & {
|
|
2161
|
+
width?: string;
|
|
2162
|
+
height?: string;
|
|
2163
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
2164
|
+
Slider: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> & PrimitiveProps & React.RefAttributes<HTMLInputElement>>;
|
|
2165
|
+
Spinner: typeof LoadingIndicator;
|
|
2166
|
+
Stack: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & {
|
|
2167
|
+
gap?: "xs" | "sm" | "md" | "lg";
|
|
2168
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
2169
|
+
Surface: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & {
|
|
2170
|
+
variant?: "plain" | "card" | "inset";
|
|
2171
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
2172
|
+
Switch: typeof Switch;
|
|
2173
|
+
Table: React.ForwardRefExoticComponent<React.TableHTMLAttributes<HTMLTableElement> & PrimitiveProps & React.RefAttributes<HTMLTableElement>>;
|
|
2174
|
+
Tabs: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & PrimitiveProps & React.RefAttributes<HTMLDivElement>>;
|
|
2175
|
+
Text: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & PrimitiveProps & {
|
|
2176
|
+
tone?: "default" | "muted" | "success" | "warning" | "danger";
|
|
2177
|
+
} & React.RefAttributes<HTMLParagraphElement>>;
|
|
2178
|
+
Textarea: React.ForwardRefExoticComponent<Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "size" | "disabled"> & PrimitiveProps & {
|
|
2179
|
+
/** Visual style of the textarea. */
|
|
2180
|
+
variant?: Variants<"outline" | "soft">;
|
|
2181
|
+
/** Control size. */
|
|
2182
|
+
size?: ControlSize;
|
|
2183
|
+
/** Explicit horizontal gutter override. */
|
|
2184
|
+
gutterSize?: Sizes<"2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
2185
|
+
disabled?: boolean;
|
|
2186
|
+
invalid?: boolean;
|
|
2187
|
+
allowAutofillExtensions?: boolean;
|
|
2188
|
+
autoSelect?: boolean;
|
|
2189
|
+
onAutofill?: () => void;
|
|
2190
|
+
autoResize?: boolean;
|
|
2191
|
+
maxRows?: number;
|
|
2192
|
+
pill?: boolean;
|
|
2193
|
+
block?: boolean;
|
|
2194
|
+
opticallyAlign?: "start" | "end";
|
|
2195
|
+
} & React.RefAttributes<HTMLTextAreaElement>>;
|
|
2196
|
+
TextField: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "disabled"> & PrimitiveProps & {
|
|
2197
|
+
/** Visual style of the input. */
|
|
2198
|
+
variant?: Variants<"outline" | "soft">;
|
|
2199
|
+
/** Control size. */
|
|
2200
|
+
size?: ControlSize;
|
|
2201
|
+
/** Explicit horizontal gutter override. */
|
|
2202
|
+
gutterSize?: Sizes<"2xs" | "xs" | "sm" | "md" | "lg" | "xl">;
|
|
2203
|
+
/** Disables the input visually and from interactions. */
|
|
2204
|
+
disabled?: boolean;
|
|
2205
|
+
/** Marks the input as invalid. */
|
|
2206
|
+
invalid?: boolean;
|
|
2207
|
+
/** Allow autofill extensions to appear in the input. */
|
|
2208
|
+
allowAutofillExtensions?: boolean;
|
|
2209
|
+
/** Selects all contents when the input mounts. */
|
|
2210
|
+
autoSelect?: boolean;
|
|
2211
|
+
/** Callback invoked when browser autofill is detected. */
|
|
2212
|
+
onAutofill?: () => void;
|
|
2213
|
+
/** Content rendered at the start of the control. */
|
|
2214
|
+
startAdornment?: React.ReactNode;
|
|
2215
|
+
/** Content rendered at the end of the control. */
|
|
2216
|
+
endAdornment?: React.ReactNode;
|
|
2217
|
+
/** Fully rounded pill shape. */
|
|
2218
|
+
pill?: boolean;
|
|
2219
|
+
/** Extends the control to 100% width. */
|
|
2220
|
+
block?: boolean;
|
|
2221
|
+
/** Applies a negative margin to optically align with surrounding content. */
|
|
2222
|
+
opticallyAlign?: "start" | "end";
|
|
2223
|
+
} & React.RefAttributes<HTMLInputElement>>;
|
|
2224
|
+
TextLink: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "children"> & PrimitiveProps & {
|
|
2225
|
+
children: React.ReactNode;
|
|
2226
|
+
primary?: boolean;
|
|
2227
|
+
underline?: boolean;
|
|
2228
|
+
forceExternal?: boolean;
|
|
2229
|
+
} & React.RefAttributes<HTMLAnchorElement>>;
|
|
2230
|
+
};
|
|
2231
|
+
|
|
2232
|
+
export { Alert, type AlertProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Badge, type BadgeProps, Button, ButtonLink, type ButtonLinkProps, type ButtonProps, Callout, type CalloutProps, Checkbox, type CheckboxProps, type CheckboxState, CircularProgress, type CircularProgressProps, type ClipboardContent, Code, type CodeProps, type ComponentRecipe, type ControlIntent, type ControlSize, CopyButton, type CopyButtonProps, Divider, type DividerProps, type DropdownIconType, EmptyMessage, type EmptyMessageIconProps, type EmptyMessageProps, type EmptyMessageTitleProps, EmptyState, type EmptyStateProps, FieldDescription, type FieldDescriptionProps, FieldError, type FieldErrorProps, FieldLabel, type FieldLabelProps, FormField, type FormFieldProps, Heading, type HeadingProps, Image, type ImageProps, Inline, type InlineProps, Input, type InputProps, KeyValue, type KeyValueItem, type KeyValueProps, LoadingDots, type LoadingDotsProps, LoadingIndicator, type LoadingIndicatorProps, type Option, type OptionGroup, type Options, type PopoverAlign, type PopoverSide, type PrimitiveProps, Progress, type ProgressProps, RadioGroup, type RadioGroupItemProps, type RadioGroupProps, SegmentedControl, type SegmentedControlOptionProps, type SegmentedControlProps, Select, type SelectAction, SelectControl, type SelectControlProps, type SelectProps, type SemanticColor, type SemanticColors, ShimmerText, type ShimmerTextProps, type Size, type Sizes, Skeleton, type SkeletonProps, Slider, type SliderProps, Spinner, type SpinnerProps, Stack, type StackProps, Surface, type SurfaceProps, Switch, type SwitchProps, Table, type TableProps, Tabs, type TabsProps, Text, TextField, type TextFieldProps, TextLink, type TextLinkProps, type TextProps, Textarea, type TextareaProps, type Variant, type Variants, createPrimitiveComponents };
|