@sanity/ui 3.1.11 → 3.1.12-canary.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.
@@ -0,0 +1,1431 @@
1
+ import { BaseTheme, HSL, PartialThemeColorBuilderOpts, RGB, RootTheme, Theme, ThemeAvatar, ThemeBoxShadow, ThemeColor, ThemeColorAvatarColorKey, ThemeColorBase, ThemeColorBuilderOpts, ThemeColorButton, ThemeColorButtonModeKey, ThemeColorButtonState, ThemeColorButtonStates, ThemeColorButtonTones, ThemeColorCard, ThemeColorCardState, ThemeColorCardToneKey, ThemeColorGenericState, ThemeColorInput, ThemeColorInputState, ThemeColorInputStates, ThemeColorMuted, ThemeColorMutedTone, ThemeColorName, ThemeColorScheme, ThemeColorSchemeKey, ThemeColorSchemes, ThemeColorSelectable, ThemeColorSelectableState, ThemeColorSelectableStates, ThemeColorSolid, ThemeColorSolidTone, ThemeColorSpot, ThemeColorSpotKey, ThemeColorStateToneKey, ThemeColorSyntax, ThemeColorToneKey, ThemeColorToneKey as ThemeColorToneKey$1, ThemeFont, ThemeFontKey, ThemeFontSize, ThemeFontWeight, ThemeFontWeightKey, ThemeFonts, ThemeInput, ThemeLayer, ThemeShadow, ThemeStyles, Theme_v2, createColorTheme, hexToRgb, hslToRgb, multiply, parseColor, rgbToHex, rgbToHsl, rgba, screen } from "@sanity/ui/theme";
2
+ import * as react141 from "react";
3
+ import { Component, HTMLProps, PropsWithChildren, Ref } from "react";
4
+ import * as styled_components0 from "styled-components";
5
+ import * as styled_components_dist_types0 from "styled-components/dist/types";
6
+ /**
7
+ * @public
8
+ * @deprecated Use `BaseTheme` from `@sanity/ui/theme` instead.
9
+ */
10
+ type BaseTheme$1 = BaseTheme;
11
+ /**
12
+ * @public
13
+ * @deprecated Use `ThemeBoxShadow` from `@sanity/ui/theme` instead.
14
+ */
15
+ type BoxShadow = ThemeBoxShadow;
16
+ /**
17
+ * @public
18
+ * @deprecated Use `HSL` from `@sanity/ui/theme` instead.
19
+ */
20
+ type HSL$1 = HSL;
21
+ /**
22
+ * @public
23
+ * @deprecated Use `RGB` from `@sanity/ui/theme` instead.
24
+ */
25
+ type RGB$1 = RGB;
26
+ /**
27
+ * @public
28
+ * @deprecated Use `RootTheme` from `@sanity/ui/theme` instead.
29
+ */
30
+ type RootTheme$1 = RootTheme;
31
+ /**
32
+ * @public
33
+ * @deprecated Use `ThemeStyles` from `@sanity/ui/theme` instead.
34
+ */
35
+ type Styles = ThemeStyles;
36
+ /**
37
+ * @public
38
+ * @deprecated Use `Theme` from `@sanity/ui/theme` instead.
39
+ */
40
+ type Theme$1 = Theme;
41
+ /**
42
+ * @public
43
+ * @deprecated Use `ThemeColorButtonModeKey` from `@sanity/ui/theme` instead.
44
+ */
45
+ type ThemeColorButtonModeKey$1 = ThemeColorButtonModeKey;
46
+ /**
47
+ * @public
48
+ * @deprecated Use `ThemeColorSchemeKey` from `@sanity/ui/theme` instead.
49
+ */
50
+ type ThemeColorSchemeKey$1 = ThemeColorSchemeKey;
51
+ /**
52
+ * @public
53
+ * @deprecated Use `ThemeColorSyntax` from `@sanity/ui/theme` instead.
54
+ */
55
+ type ThemeColorSyntax$1 = ThemeColorSyntax;
56
+ /**
57
+ * @public
58
+ * @deprecated Use `ThemeFont` from `@sanity/ui/theme` instead.
59
+ */
60
+ type ThemeFont$1 = ThemeFont;
61
+ /**
62
+ * @public
63
+ * @deprecated Use `ThemeFontKey` from `@sanity/ui/theme` instead.
64
+ */
65
+ type ThemeFontKey$1 = ThemeFontKey;
66
+ /**
67
+ * @public
68
+ * @deprecated Use `ThemeFontSize` from `@sanity/ui/theme` instead.
69
+ */
70
+ type ThemeFontSize$1 = ThemeFontSize;
71
+ /**
72
+ * @public
73
+ * @deprecated Use `ThemeFontWeight` from `@sanity/ui/theme` instead.
74
+ */
75
+ type ThemeFontWeight$1 = ThemeFontWeight;
76
+ /**
77
+ * @public
78
+ * @deprecated Use `ThemeFontWeightKey` from `@sanity/ui/theme` instead.
79
+ */
80
+ type ThemeFontWeightKey$1 = ThemeFontWeightKey;
81
+ /**
82
+ * @public
83
+ * @deprecated Use `ThemeFonts` from `@sanity/ui/theme` instead.
84
+ */
85
+ type ThemeFonts$1 = ThemeFonts;
86
+ /**
87
+ * @public
88
+ * @deprecated Use `ThemeLayer` from `@sanity/ui/theme` instead.
89
+ */
90
+ type ThemeLayer$1 = ThemeLayer;
91
+ /**
92
+ * @public
93
+ * @deprecated Use `ThemeShadow` from `@sanity/ui/theme` instead.
94
+ */
95
+ type ThemeShadow$1 = ThemeShadow;
96
+ /**
97
+ * @public
98
+ * @deprecated Use `createColorTheme` from `@sanity/ui/theme` instead.
99
+ */
100
+ declare const createColorTheme$1: typeof createColorTheme;
101
+ /**
102
+ * @public
103
+ * @deprecated Use `hexToRgb` from `@sanity/ui/theme` instead.
104
+ */
105
+ declare const hexToRgb$1: typeof hexToRgb;
106
+ /**
107
+ * @public
108
+ * @deprecated Use `hslToRgb` from `@sanity/ui/theme` instead.
109
+ */
110
+ declare const hslToRgb$1: typeof hslToRgb;
111
+ /**
112
+ * @public
113
+ * @deprecated Use `multiply` from `@sanity/ui/theme` instead.
114
+ */
115
+ declare const multiply$1: typeof multiply;
116
+ /**
117
+ * @public
118
+ * @deprecated Use `parseColor` from `@sanity/ui/theme` instead.
119
+ */
120
+ declare const parseColor$1: typeof parseColor;
121
+ /**
122
+ * @public
123
+ * @deprecated Use `rgbToHex` from `@sanity/ui/theme` instead.
124
+ */
125
+ declare const rgbToHex$1: typeof rgbToHex;
126
+ /**
127
+ * @public
128
+ * @deprecated Use `rgbToHsl` from `@sanity/ui/theme` instead.
129
+ */
130
+ declare const rgbToHsl$1: typeof rgbToHsl;
131
+ /**
132
+ * @public
133
+ * @deprecated Use `rgba` from `@sanity/ui/theme` instead.
134
+ */
135
+ declare const rgba$1: typeof rgba;
136
+ /**
137
+ * @public
138
+ * @deprecated Use `screen` from `@sanity/ui/theme` instead.
139
+ */
140
+ declare const screen$1: typeof screen;
141
+ /**
142
+ * @public
143
+ * @deprecated Use `buildTheme` from `@sanity/ui/theme` instead.
144
+ */
145
+ declare const studioTheme: BaseTheme;
146
+ /**
147
+ * @public
148
+ */
149
+ type AvatarPosition = 'top' | 'bottom' | 'inside';
150
+ /**
151
+ * @public
152
+ */
153
+ type AvatarSize = 0 | 1 | 2 | 3;
154
+ /**
155
+ * @public
156
+ */
157
+ type AvatarStatus = 'online' | 'editing' | 'inactive';
158
+ /**
159
+ * @public
160
+ * @deprecated No longer used
161
+ */
162
+ type BadgeMode = 'default' | 'outline';
163
+ /**
164
+ * @public
165
+ */
166
+ type BadgeTone = ThemeColorStateToneKey;
167
+ /**
168
+ * @public
169
+ */
170
+ type BoxSizing = 'content' | 'border';
171
+ /**
172
+ * @public
173
+ */
174
+ type BoxDisplay = 'none' | 'block' | 'grid' | 'flex' | 'inline-block';
175
+ /**
176
+ * @public
177
+ */
178
+ type BoxHeight = 'stretch' | 'fill';
179
+ /**
180
+ * @public
181
+ */
182
+ type BoxOverflow = 'visible' | 'hidden' | 'auto';
183
+ /**
184
+ * @public
185
+ */
186
+ type ButtonMode = ThemeColorButtonModeKey;
187
+ /**
188
+ * @public
189
+ */
190
+ type ButtonTextAlign = 'left' | 'right' | 'center';
191
+ /**
192
+ * @public
193
+ */
194
+ type ButtonTone = ThemeColorStateToneKey;
195
+ /**
196
+ * @public
197
+ */
198
+ type ButtonWidth = 'fill';
199
+ /**
200
+ * @public
201
+ */
202
+ type CardTone = ThemeColorCardToneKey | 'inherit';
203
+ /**
204
+ * @public
205
+ */
206
+ type DialogPosition = 'absolute' | 'fixed';
207
+ /**
208
+ * @public
209
+ */
210
+ type FlexAlign = 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch';
211
+ /**
212
+ * @public
213
+ */
214
+ type FlexDirection = 'row' | 'row-reverse' | 'column' | 'column-reverse';
215
+ /**
216
+ * @public
217
+ */
218
+ type FlexJustify = 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
219
+ /**
220
+ * @public
221
+ */
222
+ type FlexValue = number | 'none' | 'auto' | 'initial';
223
+ /**
224
+ * @public
225
+ */
226
+ type FlexWrap = 'wrap' | 'wrap-reverse' | 'nowrap';
227
+ /**
228
+ * @public
229
+ */
230
+ type GridAutoRows = 'auto' | 'min' | 'max' | 'fr';
231
+ /**
232
+ * @public
233
+ */
234
+ type GridAutoCols = 'auto' | 'min' | 'max' | 'fr';
235
+ /**
236
+ * @public
237
+ */
238
+ type GridAutoFlow = 'row' | 'column' | 'row dense' | 'column dense';
239
+ /**
240
+ * @public
241
+ */
242
+ type GridItemColumn = 'auto' | 'full' | number;
243
+ /**
244
+ * @public
245
+ */
246
+ type GridItemColumnStart = 'auto' | number;
247
+ /**
248
+ * @public
249
+ */
250
+ type GridItemColumnEnd = 'auto' | number;
251
+ /**
252
+ * @public
253
+ */
254
+ type GridItemRow = 'auto' | 'full' | number;
255
+ /**
256
+ * @public
257
+ */
258
+ type GridItemRowStart = 'auto' | number;
259
+ /**
260
+ * @public
261
+ */
262
+ type GridItemRowEnd = 'auto' | number;
263
+ /**
264
+ * Placement of floating UI elements.
265
+ *
266
+ * @public
267
+ */
268
+ type Placement = 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
269
+ /**
270
+ * @beta
271
+ */
272
+ type PopoverMargins = [number, number, number, number];
273
+ /**
274
+ * @public
275
+ */
276
+ type Radius = number | 'full';
277
+ /**
278
+ * @public
279
+ */
280
+ type SelectableTone = ThemeColorStateToneKey;
281
+ /**
282
+ * @public
283
+ */
284
+ type TextAlign = 'left' | 'right' | 'center' | 'justify' | 'initial';
285
+ /**
286
+ * @public
287
+ */
288
+ interface HotkeysProps {
289
+ fontSize?: number | number[];
290
+ padding?: number | number[];
291
+ radius?: Radius | Radius[];
292
+ space?: number | number[];
293
+ keys?: string[];
294
+ }
295
+ /**
296
+ * Represent hotkeys (a keyboard combination) with semantic `<kbd>` elements.
297
+ *
298
+ * @public
299
+ */
300
+ declare const Hotkeys: react141.ForwardRefExoticComponent<HotkeysProps & Omit<react141.HTMLProps<HTMLElement>, "ref" | "as" | "size"> & react141.RefAttributes<HTMLElement>>;
301
+ /**
302
+ * @public
303
+ */
304
+ interface ResponsiveBorderProps {
305
+ border?: boolean | boolean[];
306
+ borderTop?: boolean | boolean[];
307
+ borderRight?: boolean | boolean[];
308
+ borderBottom?: boolean | boolean[];
309
+ borderLeft?: boolean | boolean[];
310
+ }
311
+ /**
312
+ * @public
313
+ */
314
+ interface ResponsiveBoxProps {
315
+ display?: BoxDisplay | BoxDisplay[];
316
+ height?: BoxHeight | BoxHeight[];
317
+ overflow?: BoxOverflow | BoxOverflow[];
318
+ sizing?: BoxSizing | BoxSizing[];
319
+ }
320
+ /**
321
+ * @public
322
+ */
323
+ interface ResponsiveFlexProps {
324
+ align?: FlexAlign | FlexAlign[];
325
+ direction?: FlexDirection | FlexDirection[];
326
+ justify?: FlexJustify | FlexJustify[];
327
+ wrap?: FlexWrap | FlexWrap[];
328
+ }
329
+ /**
330
+ * @public
331
+ */
332
+ interface ResponsiveFlexItemProps {
333
+ /** Sets the flex CSS attribute. The property is responsive. */
334
+ flex?: FlexValue | FlexValue[];
335
+ }
336
+ /**
337
+ * @public
338
+ */
339
+ interface ResponsiveGridProps {
340
+ autoRows?: GridAutoRows | GridAutoRows[];
341
+ autoCols?: GridAutoCols | GridAutoCols[];
342
+ autoFlow?: GridAutoFlow | GridAutoFlow[];
343
+ columns?: number | number[];
344
+ gap?: number | number[];
345
+ gapX?: number | number[];
346
+ gapY?: number | number[];
347
+ rows?: number | number[];
348
+ }
349
+ /**
350
+ * @public
351
+ */
352
+ interface ResponsiveGridItemProps {
353
+ column?: GridItemColumn | GridItemColumn[];
354
+ columnStart?: GridItemColumnStart | GridItemColumnStart[];
355
+ columnEnd?: GridItemColumnEnd | GridItemColumnEnd[];
356
+ row?: GridItemRow | GridItemRow[];
357
+ rowStart?: GridItemRowStart | GridItemRowStart[];
358
+ rowEnd?: GridItemRowEnd | GridItemRowEnd[];
359
+ }
360
+ /**
361
+ * @public
362
+ */
363
+ interface ResponsiveMarginProps {
364
+ /** Applies margins to all sides. The property is responsive. */
365
+ margin?: number | number[];
366
+ /** Applies margins to the left and right sides. The property is responsive. */
367
+ marginX?: number | number[];
368
+ /** Applies margins to the top and bottom sides. The property is responsive. */
369
+ marginY?: number | number[];
370
+ marginTop?: number | number[];
371
+ marginRight?: number | number[];
372
+ marginBottom?: number | number[];
373
+ marginLeft?: number | number[];
374
+ }
375
+ /**
376
+ * @public
377
+ */
378
+ interface ResponsivePaddingProps {
379
+ padding?: number | number[];
380
+ paddingX?: number | number[];
381
+ paddingY?: number | number[];
382
+ paddingTop?: number | number[];
383
+ paddingRight?: number | number[];
384
+ paddingBottom?: number | number[];
385
+ paddingLeft?: number | number[];
386
+ }
387
+ /**
388
+ * @public
389
+ */
390
+ interface ResponsiveRadiusProps {
391
+ radius?: Radius | Radius[];
392
+ }
393
+ /**
394
+ * @public
395
+ */
396
+ interface ResponsiveShadowProps {
397
+ shadow?: number | number[];
398
+ }
399
+ /**
400
+ * @public
401
+ */
402
+ interface ResponsiveWidthProps {
403
+ width?: number | 'auto' | (number | 'auto')[];
404
+ }
405
+ /**
406
+ * @public
407
+ */
408
+ type Delay = number | Partial<{
409
+ open: number;
410
+ close: number;
411
+ }>;
412
+ /**
413
+ * @public
414
+ */
415
+ interface MenuProps extends ResponsivePaddingProps {
416
+ /**
417
+ * @deprecated Use `shouldFocus="first"` instead.
418
+ */
419
+ 'focusFirst'?: boolean;
420
+ /**
421
+ * @deprecated Use `shouldFocus="last"` instead.
422
+ */
423
+ 'focusLast'?: boolean;
424
+ 'onClickOutside'?: (event: MouseEvent) => void;
425
+ 'onEscape'?: () => void;
426
+ 'onItemClick'?: () => void;
427
+ 'onItemSelect'?: (index: number) => void;
428
+ 'originElement'?: HTMLElement | null;
429
+ 'registerElement'?: (el: HTMLElement) => () => void;
430
+ 'shouldFocus'?: 'first' | 'last' | null;
431
+ 'space'?: number | number[];
432
+ 'aria-labelledby'?: string;
433
+ 'onBlurCapture'?: (event: FocusEvent) => void;
434
+ }
435
+ /**
436
+ * The `Menu` component is a building block for application menus.
437
+ *
438
+ * @public
439
+ */
440
+ declare const Menu: react141.ForwardRefExoticComponent<Omit<MenuProps & Omit<react141.HTMLProps<HTMLDivElement>, "as" | "height" | "role" | "tabIndex">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
441
+ /**
442
+ * @public
443
+ */
444
+ declare const MenuDivider: styled_components_dist_types0.IStyledComponentBase<"web", styled_components0.FastOmit<react141.DetailedHTMLProps<react141.HTMLAttributes<HTMLHRElement>, HTMLHRElement>, never>> & string;
445
+ /**
446
+ * @public
447
+ */
448
+ interface AvatarProps {
449
+ /** @beta */
450
+ __unstable_hideInnerStroke?: boolean;
451
+ animateArrowFrom?: AvatarPosition;
452
+ arrowPosition?: AvatarPosition;
453
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
454
+ color?: ThemeColorAvatarColorKey;
455
+ initials?: string;
456
+ onImageLoadError?: (event: Error) => void;
457
+ size?: AvatarSize | AvatarSize[];
458
+ src?: string;
459
+ /**
460
+ * The status of the entity this Avatar represents.
461
+ * @alpha
462
+ */
463
+ status?: AvatarStatus;
464
+ title?: string;
465
+ }
466
+ /**
467
+ * Avatars are used to represent people and other agents (e.g. bots).
468
+ *
469
+ * @public
470
+ */
471
+ declare const Avatar: react141.ForwardRefExoticComponent<AvatarProps & Omit<react141.HTMLProps<HTMLDivElement>, "ref" | "as"> & react141.RefAttributes<HTMLDivElement>>;
472
+ /**
473
+ * @public
474
+ */
475
+ interface AvatarCounterProps {
476
+ count: number;
477
+ size?: AvatarSize | AvatarSize[];
478
+ /** @deprecated No longer supported. */
479
+ tone?: 'navbar';
480
+ }
481
+ /**
482
+ * @public
483
+ */
484
+ declare const AvatarCounter: react141.ForwardRefExoticComponent<AvatarCounterProps & react141.RefAttributes<HTMLDivElement>>;
485
+ /**
486
+ * @public
487
+ */
488
+ interface AvatarStackProps {
489
+ children: React.ReactNode;
490
+ maxLength?: number;
491
+ size?: AvatarSize | AvatarSize[];
492
+ /** @deprecated No longer supported. */
493
+ tone?: 'navbar';
494
+ }
495
+ /**
496
+ * @public
497
+ */
498
+ declare const AvatarStack: react141.ForwardRefExoticComponent<AvatarStackProps & Omit<react141.HTMLProps<HTMLDivElement>, "ref" | "as"> & react141.RefAttributes<HTMLDivElement>>;
499
+ /**
500
+ * @internal
501
+ */
502
+ interface AvatarRootStyleProps {
503
+ $color: ThemeColorAvatarColorKey;
504
+ }
505
+ /**
506
+ * @internal
507
+ */
508
+ interface ResponsiveAvatarSizeStyleProps {
509
+ $size: AvatarSize[];
510
+ }
511
+ /**
512
+ * @public
513
+ */
514
+ interface BoxProps extends ResponsiveFlexItemProps, ResponsiveBoxProps, ResponsiveGridItemProps, ResponsiveMarginProps, ResponsivePaddingProps {
515
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
516
+ forwardedAs?: React.ElementType | keyof React.JSX.IntrinsicElements;
517
+ }
518
+ /**
519
+ * The `Box` component is a basic layout wrapper component which provides utility properties
520
+ * for flex, margins and padding.
521
+ *
522
+ * @public
523
+ */
524
+ declare const Box: react141.ForwardRefExoticComponent<Omit<BoxProps & Omit<react141.HTMLProps<HTMLDivElement>, "as" | "height">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
525
+ /**
526
+ * @public
527
+ */
528
+ interface BadgeProps extends BoxProps, ResponsiveRadiusProps {
529
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
530
+ fontSize?: number | number[];
531
+ /** @deprecated No longer used. */
532
+ mode?: BadgeMode;
533
+ tone?: BadgeTone;
534
+ }
535
+ /**
536
+ * Badges are used to tag resources.
537
+ *
538
+ * @public
539
+ */
540
+ declare const Badge: react141.ForwardRefExoticComponent<Omit<BadgeProps & react141.HTMLProps<HTMLDivElement>, "ref"> & react141.RefAttributes<unknown>>;
541
+ /**
542
+ * @public
543
+ */
544
+ interface ButtonProps extends ResponsivePaddingProps, ResponsiveRadiusProps {
545
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
546
+ fontSize?: number | number[];
547
+ mode?: ButtonMode;
548
+ icon?: React.ElementType | React.ReactNode;
549
+ iconRight?: React.ElementType | React.ReactNode;
550
+ justify?: FlexJustify | FlexJustify[];
551
+ /**
552
+ * @beta Do not use in production, as this might change.
553
+ */
554
+ loading?: boolean;
555
+ selected?: boolean;
556
+ space?: number | number[];
557
+ muted?: boolean;
558
+ text?: React.ReactNode;
559
+ textAlign?: ButtonTextAlign;
560
+ textWeight?: ThemeFontWeightKey;
561
+ tone?: ButtonTone;
562
+ type?: 'button' | 'reset' | 'submit';
563
+ width?: ButtonWidth;
564
+ }
565
+ /**
566
+ * @public
567
+ */
568
+ declare const Button: react141.ForwardRefExoticComponent<Omit<ButtonProps & Omit<react141.HTMLProps<HTMLButtonElement>, "as" | "width">, "ref"> & react141.RefAttributes<HTMLButtonElement>>;
569
+ /**
570
+ * @public
571
+ */
572
+ interface CardProps extends BoxProps, ResponsiveBorderProps, ResponsiveRadiusProps, ResponsiveShadowProps {
573
+ /**
574
+ * Do not use in production.
575
+ * @beta
576
+ */
577
+ __unstable_checkered?: boolean;
578
+ /**
579
+ * Do not use in production.
580
+ * @beta
581
+ */
582
+ __unstable_focusRing?: boolean;
583
+ muted?: boolean;
584
+ pressed?: boolean;
585
+ scheme?: ThemeColorSchemeKey;
586
+ tone?: CardTone;
587
+ }
588
+ /**
589
+ * The `Card` component acts much like a `Box`, but with a background and foreground color.
590
+ * Components within a `Card` inherit its colors.
591
+ *
592
+ * @public
593
+ */
594
+ declare const Card: react141.ForwardRefExoticComponent<Omit<CardProps & Omit<react141.HTMLProps<HTMLDivElement>, "as" | "height">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
595
+ /**
596
+ * @internal
597
+ */
598
+ interface CardStyleProps {
599
+ $checkered: boolean;
600
+ $focusRing: boolean;
601
+ $muted: boolean;
602
+ $tone: ThemeColorToneKey;
603
+ }
604
+ /**
605
+ * @public
606
+ */
607
+ interface CheckboxProps {
608
+ indeterminate?: boolean;
609
+ customValidity?: string;
610
+ }
611
+ /**
612
+ * Checkboxes allow the user to select one or more items from a set.
613
+ *
614
+ * @public
615
+ */
616
+ declare const Checkbox: react141.ForwardRefExoticComponent<Omit<Omit<react141.HTMLProps<HTMLInputElement>, "as" | "type"> & CheckboxProps, "ref"> & react141.RefAttributes<HTMLInputElement>>;
617
+ /**
618
+ * @public
619
+ */
620
+ interface CodeProps {
621
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
622
+ /** Define the language to use for syntax highlighting. */
623
+ language?: string;
624
+ size?: number | number[];
625
+ weight?: string;
626
+ }
627
+ /**
628
+ * @public
629
+ */
630
+ declare const Code: react141.ForwardRefExoticComponent<Omit<CodeProps & Omit<react141.HTMLProps<HTMLElement>, "as" | "size">, "ref"> & react141.RefAttributes<HTMLElement>>;
631
+ /**
632
+ * @public
633
+ */
634
+ interface ContainerProps extends BoxProps, ResponsiveWidthProps {}
635
+ /**
636
+ * The `Container` component wraps content layout in a defined set of widths.
637
+ *
638
+ * @public
639
+ */
640
+ declare const Container: react141.ForwardRefExoticComponent<Omit<ContainerProps & Omit<react141.HTMLProps<HTMLDivElement>, "as" | "height" | "width">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
641
+ /**
642
+ * @internal
643
+ */
644
+ interface ResponsiveWidthStyleProps {
645
+ $width: (number | 'auto')[];
646
+ }
647
+ /**
648
+ * @public
649
+ */
650
+ interface FlexProps extends Omit<BoxProps, 'display'>, ResponsiveFlexProps, ResponsiveFlexItemProps {
651
+ gap?: number | number[];
652
+ }
653
+ /**
654
+ * The `Flex` component is a wrapper component for flexible elements (`Box`, `Card` and `Flex`).
655
+ *
656
+ * @public
657
+ */
658
+ declare const Flex: react141.ForwardRefExoticComponent<Omit<FlexProps & Omit<react141.HTMLProps<HTMLDivElement>, "as" | "wrap">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
659
+ /**
660
+ * @public
661
+ */
662
+ interface GridProps extends Omit<BoxProps, 'display'>, ResponsiveGridProps {}
663
+ /**
664
+ * The `Grid` component is for building 2-dimensional layers (based on CSS grid).
665
+ *
666
+ * @public
667
+ */
668
+ declare const Grid: react141.ForwardRefExoticComponent<Omit<GridProps & Omit<react141.HTMLProps<HTMLDivElement>, "as" | "height" | "rows">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
669
+ /**
670
+ * @public
671
+ */
672
+ interface HeadingProps {
673
+ accent?: boolean;
674
+ align?: TextAlign | TextAlign[];
675
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
676
+ muted?: boolean;
677
+ size?: number | number[];
678
+ /**
679
+ * Controls how overflowing text is treated.
680
+ * Use `textOverflow="ellipsis"` to render text as a single line which is concatenated with a `…` symbol.
681
+ * @beta
682
+ */
683
+ textOverflow?: 'ellipsis';
684
+ weight?: ThemeFontWeightKey;
685
+ }
686
+ /**
687
+ * Typographic headings.
688
+ *
689
+ * @public
690
+ */
691
+ declare const Heading: react141.ForwardRefExoticComponent<Omit<HeadingProps & Omit<react141.HTMLProps<HTMLElement>, "as" | "size">, "ref"> & react141.RefAttributes<HTMLElement>>;
692
+ /**
693
+ * @public
694
+ */
695
+ interface InlineProps extends Omit<BoxProps, 'display'> {
696
+ /** The spacing between children. */
697
+ space?: number | number[];
698
+ }
699
+ /**
700
+ * The `Inline` component is a layout utility for aligning and spacing items horizontally.
701
+ *
702
+ * @public
703
+ */
704
+ declare const Inline: react141.ForwardRefExoticComponent<Omit<InlineProps & react141.HTMLProps<HTMLDivElement>, "ref"> & react141.RefAttributes<unknown>>;
705
+ /**
706
+ * @public
707
+ */
708
+ interface KBDProps {
709
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
710
+ fontSize?: number | number[];
711
+ padding?: number | number[];
712
+ radius?: Radius | Radius[];
713
+ }
714
+ /**
715
+ * Used to define some text as keyboard input.
716
+ *
717
+ * @public
718
+ */
719
+ declare const KBD: react141.ForwardRefExoticComponent<KBDProps & Omit<react141.HTMLProps<HTMLElement>, "ref" | "as" | "size"> & react141.RefAttributes<HTMLDivElement>>;
720
+ /**
721
+ * @public
722
+ */
723
+ interface LabelProps {
724
+ accent?: boolean;
725
+ align?: TextAlign | TextAlign[];
726
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
727
+ muted?: boolean;
728
+ size?: number | number[];
729
+ /**
730
+ * Controls how overflowing text is treated.
731
+ * Use `textOverflow="ellipsis"` to render text as a single line which is concatenated with a `…` symbol.
732
+ * @beta
733
+ */
734
+ textOverflow?: 'ellipsis';
735
+ weight?: ThemeFontWeightKey;
736
+ }
737
+ /**
738
+ * Typographic labels.
739
+ *
740
+ * @public
741
+ */
742
+ declare const Label: react141.ForwardRefExoticComponent<Omit<LabelProps & Omit<react141.HTMLProps<HTMLDivElement>, "as" | "size">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
743
+ /** @internal */
744
+ declare const Arrow: react141.ForwardRefExoticComponent<Omit<{
745
+ width: number;
746
+ height: number;
747
+ radius?: number;
748
+ } & Omit<HTMLProps<HTMLDivElement>, "height" | "width">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
749
+ /**
750
+ * @public
751
+ */
752
+ interface BoundaryElementProviderProps {
753
+ children: React.ReactNode;
754
+ element: HTMLElement | null;
755
+ }
756
+ /**
757
+ * @public
758
+ */
759
+ declare function BoundaryElementProvider(props: BoundaryElementProviderProps): React.JSX.Element;
760
+ declare namespace BoundaryElementProvider {
761
+ var displayName: string;
762
+ }
763
+ /**
764
+ * @public
765
+ */
766
+ interface BoundaryElementContextValue {
767
+ version: 0.0;
768
+ element: HTMLElement | null;
769
+ }
770
+ /**
771
+ * @public
772
+ */
773
+ declare function useBoundaryElement(): BoundaryElementContextValue;
774
+ /**
775
+ * @internal
776
+ * @deprecated this component will be removed in the next major release
777
+ */
778
+ declare function ConditionalWrapper({
779
+ children,
780
+ condition,
781
+ wrapper
782
+ }: {
783
+ children: React.ReactNode;
784
+ condition: boolean;
785
+ wrapper: (children: React.ReactNode) => React.ReactNode;
786
+ }): React.ReactNode;
787
+ declare namespace ConditionalWrapper {
788
+ var displayName: string;
789
+ }
790
+ /**
791
+ * DO NOT USE IN PRODUCTION.
792
+ * @beta
793
+ */
794
+ interface MediaQueryProps {
795
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
796
+ media?: number[];
797
+ }
798
+ /**
799
+ * DO NOT USE IN PRODUCTION.
800
+ * @beta
801
+ */
802
+ declare const ElementQuery: react141.ForwardRefExoticComponent<Omit<MediaQueryProps & Omit<react141.HTMLProps<HTMLDivElement>, "as" | "media">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
803
+ /**
804
+ * DO NOT USE IN PRODUCTION
805
+ * @beta
806
+ */
807
+ type ErrorBoundaryProps = PropsWithChildren<{
808
+ onCatch: (params: {
809
+ error: Error;
810
+ info: React.ErrorInfo;
811
+ }) => void;
812
+ }>;
813
+ /**
814
+ * DO NOT USE IN PRODUCTION
815
+ * @beta
816
+ */
817
+ interface ErrorBoundaryState {
818
+ error: Error | null;
819
+ }
820
+ /**
821
+ * DO NOT USE IN PRODUCTION
822
+ * @beta
823
+ */
824
+ declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
825
+ state: ErrorBoundaryState;
826
+ static getDerivedStateFromError(error: Error): ErrorBoundaryState;
827
+ componentDidCatch(error: Error, info: React.ErrorInfo): void;
828
+ render(): React.ReactNode;
829
+ }
830
+ /**
831
+ * @public
832
+ */
833
+ interface LayerProps {
834
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
835
+ /** A callback that fires when the layer becomes the top layer when it was not the top layer before. */
836
+ onActivate?: (props: {
837
+ activeElement: HTMLElement | null;
838
+ }) => void;
839
+ zOffset?: number | number[];
840
+ }
841
+ /**
842
+ * @public
843
+ */
844
+ declare const Layer: react141.ForwardRefExoticComponent<Omit<LayerProps & Omit<react141.HTMLProps<HTMLDivElement>, "as">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
845
+ /**
846
+ * @public
847
+ */
848
+ interface LayerProviderProps {
849
+ children?: React.ReactNode;
850
+ zOffset?: number | number[];
851
+ }
852
+ /**
853
+ * @public
854
+ */
855
+ declare function LayerProvider(props: LayerProviderProps): React.JSX.Element;
856
+ declare namespace LayerProvider {
857
+ var displayName: string;
858
+ }
859
+ /** @public */
860
+ interface LayerContextValue {
861
+ version: 0.0;
862
+ isTopLayer: boolean;
863
+ level?: number;
864
+ registerChild: (childLevel?: number) => () => void;
865
+ size: number;
866
+ zIndex: number;
867
+ }
868
+ /**
869
+ * @public
870
+ */
871
+ declare function useLayer(): LayerContextValue;
872
+ /**
873
+ * @public
874
+ */
875
+ interface PortalProps {
876
+ children: React.ReactNode;
877
+ /**
878
+ * @beta This API might change. DO NOT USE IN PRODUCTION.
879
+ */
880
+ __unstable_name?: string;
881
+ }
882
+ /**
883
+ * @public
884
+ */
885
+ declare function Portal(props: PortalProps): React.ReactPortal | null;
886
+ declare namespace Portal {
887
+ var displayName: string;
888
+ }
889
+ /**
890
+ * @public
891
+ */
892
+ interface PortalProviderProps {
893
+ /**
894
+ * @deprecated Use `<BoundaryElementProvider element={...} />` instead
895
+ */
896
+ boundaryElement?: HTMLElement | null;
897
+ children: React.ReactNode;
898
+ element?: HTMLElement | null;
899
+ /**
900
+ * @beta
901
+ */
902
+ __unstable_elements?: Record<string, HTMLElement | null | undefined>;
903
+ }
904
+ /**
905
+ * @public
906
+ */
907
+ declare function PortalProvider(props: PortalProviderProps): React.JSX.Element;
908
+ declare namespace PortalProvider {
909
+ var displayName: string;
910
+ }
911
+ /**
912
+ * @public
913
+ */
914
+ interface PortalContextValue {
915
+ version: 0.0;
916
+ boundaryElement: HTMLElement | null;
917
+ element: HTMLElement | null;
918
+ elements?: Record<string, HTMLElement | null | undefined>;
919
+ }
920
+ /**
921
+ * @public
922
+ */
923
+ declare function usePortal(): PortalContextValue;
924
+ /**
925
+ * @public
926
+ */
927
+ interface SrOnlyProps {
928
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
929
+ children?: React.ReactNode;
930
+ }
931
+ /**
932
+ * @public
933
+ */
934
+ declare const SrOnly: react141.ForwardRefExoticComponent<Omit<SrOnlyProps & Omit<react141.HTMLProps<HTMLDivElement>, "as" | "aria-hidden">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
935
+ /**
936
+ * @beta
937
+ */
938
+ interface VirtualListChangeOpts {
939
+ fromIndex: number;
940
+ gap: number;
941
+ itemHeight: number;
942
+ scrollHeight: number;
943
+ scrollTop: number;
944
+ toIndex: number;
945
+ }
946
+ /**
947
+ * @beta
948
+ */
949
+ interface VirtualListProps<Item = any> {
950
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
951
+ gap?: number;
952
+ getItemKey?: (item: Item, itemIndex: number) => string;
953
+ items?: Item[];
954
+ onChange?: (opts: VirtualListChangeOpts) => void;
955
+ renderItem?: (item: Item) => React.ReactNode;
956
+ }
957
+ /**
958
+ * @beta
959
+ */
960
+ declare const VirtualList: react141.ForwardRefExoticComponent<VirtualListProps<any> & StackProps & Omit<react141.HTMLProps<HTMLDivElement>, "ref" | "as" | "children" | "onChange"> & react141.RefAttributes<HTMLDivElement>>;
961
+ /** @beta */
962
+ type PopoverUpdateCallback = () => void;
963
+ /** @public */
964
+ type PopoverWidth = number | 'auto';
965
+ /** @public */
966
+ interface PopoverProps extends Omit<LayerProps, 'as'>, ResponsiveRadiusProps, ResponsiveShadowProps {
967
+ /** @beta */
968
+ __unstable_margins?: PopoverMargins;
969
+ /**
970
+ * Whether the popover should animate in and out.
971
+ *
972
+ * @beta
973
+ * @defaultValue false
974
+ */
975
+ animate?: boolean;
976
+ arrow?: boolean;
977
+ /** @deprecated Use `floatingBoundary` and/or `referenceBoundary` instead */
978
+ boundaryElement?: HTMLElement | null;
979
+ children?: React.JSX.Element;
980
+ /**
981
+ * When `true`, prevent overflow within the current boundary:
982
+ * - by flipping on its side axis
983
+ * - by resizing
984
+ /*
985
+ * Note that:
986
+ * - setting `preventOverflow` to `true` also prevents overflow on its side axis
987
+ * - setting `matchReferenceWidth` to `true` also causes the popover to resize
988
+ *
989
+ * @defaultValue false
990
+ */
991
+ constrainSize?: boolean;
992
+ content?: React.ReactNode;
993
+ disabled?: boolean;
994
+ fallbackPlacements?: Placement[];
995
+ floatingBoundary?: HTMLElement | null;
996
+ /**
997
+ * When `true`, set the maximum width to match the reference element, and also prevent overflow within
998
+ * the current boundary by resizing.
999
+ *
1000
+ * Note that setting `constrainSize` to `true` also causes the popover to resize
1001
+ *
1002
+ * @defaultValue false
1003
+ */
1004
+ matchReferenceWidth?: boolean;
1005
+ /**
1006
+ * When true, blocks all pointer interaction with elements beneath the popover until closed.
1007
+ *
1008
+ * @beta
1009
+ * @defaultValue false
1010
+ */
1011
+ modal?: boolean;
1012
+ open?: boolean;
1013
+ overflow?: BoxOverflow;
1014
+ padding?: number | number[];
1015
+ placement?: Placement;
1016
+ /**
1017
+ * When 'flip' (default), the placement is determined from the initial placement and the
1018
+ * fallback placements in order. Whichever fits in the viewport first.
1019
+ *
1020
+ * When 'autoPlacement', the initial placement and all fallback placements are evaluated
1021
+ * and the placement with the most viewport space available.
1022
+ *
1023
+ * Option is only relevant if either `constrainSize` or `preventOverflow` is `true`
1024
+ */
1025
+ placementStrategy?: 'flip' | 'autoPlacement';
1026
+ /** Whether or not to render the popover in a portal element. */
1027
+ portal?: boolean | string;
1028
+ preventOverflow?: boolean;
1029
+ referenceBoundary?: HTMLElement | null;
1030
+ /**
1031
+ * When defined, the popover will be positioned relative to this element.
1032
+ * The children of the popover won't be rendered.
1033
+ */
1034
+ referenceElement?: HTMLElement | null;
1035
+ scheme?: ThemeColorSchemeKey;
1036
+ tone?: CardTone;
1037
+ /** @beta */
1038
+ updateRef?: Ref<PopoverUpdateCallback | undefined>;
1039
+ width?: PopoverWidth | PopoverWidth[];
1040
+ }
1041
+ /**
1042
+ * The `Popover` component is used to display some content on top of another.
1043
+ *
1044
+ * @public
1045
+ */
1046
+ declare const Popover: react141.ForwardRefExoticComponent<Omit<PopoverProps & Omit<react141.HTMLProps<HTMLDivElement>, "as" | "width" | "content" | "children">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
1047
+ /**
1048
+ * @public
1049
+ */
1050
+ interface RadioProps {
1051
+ customValidity?: string;
1052
+ }
1053
+ /**
1054
+ * The `Radio` component allows the user to select one option from a set.
1055
+ *
1056
+ * @public
1057
+ */
1058
+ declare const Radio: react141.ForwardRefExoticComponent<Omit<Omit<react141.HTMLProps<HTMLInputElement>, "as" | "type"> & RadioProps, "ref"> & react141.RefAttributes<HTMLInputElement>>;
1059
+ /**
1060
+ * @public
1061
+ */
1062
+ interface SelectProps {
1063
+ fontSize?: number | number[];
1064
+ padding?: number | number[];
1065
+ radius?: Radius | Radius[];
1066
+ space?: number | number[];
1067
+ customValidity?: string;
1068
+ }
1069
+ /**
1070
+ * The `Select` component provides control of options.
1071
+ *
1072
+ * @public
1073
+ */
1074
+ declare const Select: react141.ForwardRefExoticComponent<Omit<SelectProps & Omit<react141.HTMLProps<HTMLSelectElement>, "as">, "ref"> & react141.RefAttributes<HTMLSelectElement>>;
1075
+ /**
1076
+ * @public
1077
+ */
1078
+ interface SpinnerProps {
1079
+ muted?: boolean;
1080
+ size?: number | number[];
1081
+ }
1082
+ /**
1083
+ * Indicate that something is loading for an indeterminate amount of time.
1084
+ *
1085
+ * @public
1086
+ */
1087
+ declare const Spinner: react141.ForwardRefExoticComponent<Omit<SpinnerProps & Omit<react141.HTMLProps<HTMLDivElement>, "as" | "size">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
1088
+ /**
1089
+ * @public
1090
+ */
1091
+ interface StackProps extends BoxProps {
1092
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
1093
+ space?: number | number[];
1094
+ }
1095
+ /**
1096
+ * The `Stack` component is used to place elements on top of each other.
1097
+ *
1098
+ * @public
1099
+ */
1100
+ declare const Stack: react141.ForwardRefExoticComponent<StackProps & Omit<react141.HTMLProps<HTMLDivElement>, "ref" | "as"> & react141.RefAttributes<HTMLDivElement>>;
1101
+ /**
1102
+ * @public
1103
+ */
1104
+ interface SwitchProps {
1105
+ indeterminate?: boolean;
1106
+ }
1107
+ /**
1108
+ * The `Switch` component allows the user to toggle a setting on and off.
1109
+ *
1110
+ * Extends all properties of an `<input type="checkbox" />` element, except type.
1111
+ *
1112
+ * @public
1113
+ */
1114
+ declare const Switch: react141.ForwardRefExoticComponent<Omit<Omit<react141.HTMLProps<HTMLInputElement>, "as" | "type"> & SwitchProps, "ref"> & react141.RefAttributes<HTMLInputElement>>;
1115
+ /**
1116
+ * @public
1117
+ */
1118
+ interface TextProps {
1119
+ accent?: boolean;
1120
+ align?: TextAlign | TextAlign[];
1121
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
1122
+ /** When `true` the text color will be muted. */
1123
+ muted?: boolean;
1124
+ size?: number | number[];
1125
+ /**
1126
+ * Controls how overflowing text is treated.
1127
+ * Use `textOverflow="ellipsis"` to render text as a single line which is concatenated with a `…` symbol.
1128
+ * @beta
1129
+ */
1130
+ textOverflow?: 'ellipsis';
1131
+ weight?: ThemeFontWeightKey;
1132
+ }
1133
+ /**
1134
+ * The `Text` component is an agile, themed typographic element.
1135
+ *
1136
+ * @public
1137
+ */
1138
+ declare const Text: react141.ForwardRefExoticComponent<Omit<TextProps & Omit<react141.HTMLProps<HTMLDivElement>, "as" | "size">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
1139
+ /**
1140
+ * @public
1141
+ */
1142
+ interface TextAreaProps extends ResponsiveRadiusProps {
1143
+ /**
1144
+ * @beta
1145
+ */
1146
+ __unstable_disableFocusRing?: boolean;
1147
+ border?: boolean;
1148
+ customValidity?: string;
1149
+ fontSize?: number | number[];
1150
+ padding?: number | number[];
1151
+ weight?: ThemeFontWeightKey;
1152
+ }
1153
+ /**
1154
+ * A multiline text input.
1155
+ *
1156
+
1157
+ * @public
1158
+ */
1159
+ declare const TextArea: react141.ForwardRefExoticComponent<Omit<TextAreaProps & Omit<react141.HTMLProps<HTMLTextAreaElement>, "as">, "ref"> & react141.RefAttributes<HTMLTextAreaElement>>;
1160
+ /**
1161
+ * @public
1162
+ */
1163
+ type TextInputClearButtonProps = Omit<ButtonProps, 'as'> & Omit<React.HTMLProps<HTMLButtonElement>, 'as' | 'onClick' | 'onMouseDown' | 'ref'>;
1164
+ /**
1165
+ * @public
1166
+ */
1167
+ type TextInputType = 'search' | 'date' | 'datetime-local' | 'email' | 'url' | 'month' | 'number' | 'password' | 'tel' | 'time' | 'text' | 'week' | 'color';
1168
+ /**
1169
+ * @public
1170
+ */
1171
+ interface TextInputProps {
1172
+ /**
1173
+ * @beta
1174
+ */
1175
+ __unstable_disableFocusRing?: boolean;
1176
+ border?: boolean;
1177
+ /**
1178
+ * @beta
1179
+ */
1180
+ clearButton?: boolean | TextInputClearButtonProps;
1181
+ customValidity?: string;
1182
+ fontSize?: number | number[];
1183
+ icon?: React.ElementType | React.ReactNode;
1184
+ iconRight?: React.ElementType | React.ReactNode;
1185
+ /**
1186
+ * @beta
1187
+ */
1188
+ onClear?: () => void;
1189
+ padding?: number | number[];
1190
+ prefix?: React.ReactNode;
1191
+ radius?: Radius | Radius[];
1192
+ space?: number | number[];
1193
+ suffix?: React.ReactNode;
1194
+ type?: TextInputType;
1195
+ weight?: ThemeFontWeightKey;
1196
+ }
1197
+ /**
1198
+ * Single line text input.
1199
+ *
1200
+ * @public
1201
+ */
1202
+ declare const TextInput: react141.ForwardRefExoticComponent<Omit<TextInputProps & Omit<react141.HTMLProps<HTMLInputElement>, "as" | "type" | "prefix">, "ref"> & react141.RefAttributes<HTMLInputElement>>;
1203
+ /**
1204
+ * @public
1205
+ */
1206
+ interface TooltipProps extends Omit<LayerProps, 'as'> {
1207
+ /** @deprecated Use `fallbackPlacements` instead. */
1208
+ allowedAutoPlacements?: Placement[];
1209
+ arrow?: boolean;
1210
+ boundaryElement?: HTMLElement | null;
1211
+ children?: React.JSX.Element;
1212
+ content?: React.ReactNode;
1213
+ disabled?: boolean;
1214
+ fallbackPlacements?: Placement[];
1215
+ padding?: number | number[];
1216
+ placement?: Placement;
1217
+ /** Whether or not to render the tooltip in a portal element. */
1218
+ portal?: boolean | string;
1219
+ radius?: number | number[];
1220
+ scheme?: ThemeColorSchemeKey;
1221
+ shadow?: number | number[];
1222
+ /**
1223
+ * Adds a delay to open or close the tooltip.
1224
+ *
1225
+ * If only a `number` is passed, it will be used for both opening and closing.
1226
+ *
1227
+ * If an object `{open: number; close:number}` is passed, it can be used to set different delays for each action.
1228
+ *
1229
+ * @public
1230
+ * @defaultValue 0
1231
+ */
1232
+ delay?: Delay;
1233
+ /**
1234
+ * Whether the tooltip should animate in and out.
1235
+ *
1236
+ * @beta
1237
+ * @defaultValue false
1238
+ */
1239
+ animate?: boolean;
1240
+ }
1241
+ /**
1242
+ * Tooltips display information when hovering, focusing or tapping.
1243
+ *
1244
+ * @public
1245
+ */
1246
+ declare const Tooltip: react141.ForwardRefExoticComponent<Omit<TooltipProps & Omit<react141.HTMLProps<HTMLDivElement>, "as" | "content" | "children">, "ref"> & react141.RefAttributes<HTMLDivElement>>;
1247
+ /**
1248
+ * @beta
1249
+ */
1250
+ interface TooltipDelayGroupContextValue {
1251
+ setIsGroupActive: (nextState: React.SetStateAction<boolean>, delay?: number | undefined) => void;
1252
+ setOpenTooltipId: (nextId: string | null, delay?: number | undefined) => void;
1253
+ openDelay: number;
1254
+ closeDelay: number;
1255
+ openTooltipId: string | null;
1256
+ }
1257
+ /**
1258
+ * @beta
1259
+ */
1260
+ declare const TooltipDelayGroupContext: react141.Context<TooltipDelayGroupContextValue | null>;
1261
+ /**
1262
+ * @public
1263
+ * */
1264
+ interface TooltipDelayGroupProviderProps {
1265
+ children?: React.ReactNode;
1266
+ /**
1267
+ * Handles the delays to open or close a tooltip inside a group
1268
+ *
1269
+ * If only a `number` is passed, it will be used for both opening and closing.
1270
+ *
1271
+ * If an object `{open: number; close:number}` is passed, it can be used to set different delays for each action.
1272
+ *
1273
+ * @public
1274
+ */
1275
+ delay: Delay;
1276
+ }
1277
+ /**
1278
+ * @public
1279
+ * Provides context for a group of tooltip elements that should share a delay
1280
+ * which temporarily becomes 1 ms after the first floating element of the group opens.
1281
+ */
1282
+ declare function TooltipDelayGroupProvider(props: TooltipDelayGroupProviderProps): React.JSX.Element;
1283
+ declare namespace TooltipDelayGroupProvider {
1284
+ var displayName: string;
1285
+ }
1286
+ /**
1287
+ * @beta
1288
+ */
1289
+ declare function useTooltipDelayGroup(): TooltipDelayGroupContextValue | null;
1290
+ /**
1291
+ * @public
1292
+ */
1293
+ interface MenuGroupProps {
1294
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
1295
+ fontSize?: number | number[];
1296
+ icon?: React.ElementType | React.ReactNode;
1297
+ menu?: Omit<MenuProps, 'onClickOutside' | 'onEscape' | 'onItemClick' | 'onKeyDown' | 'onMouseEnter' | 'registerElement' | 'shouldFocus' | 'onBlurCapture'>;
1298
+ padding?: number | number[];
1299
+ popover?: Omit<PopoverProps, 'content' | 'open'>;
1300
+ radius?: Radius | Radius[];
1301
+ space?: number | number[];
1302
+ text: React.ReactNode;
1303
+ tone?: SelectableTone;
1304
+ }
1305
+ /**
1306
+ * @public
1307
+ */
1308
+ declare function MenuGroup(props: Omit<React.HTMLProps<HTMLDivElement>, 'as' | 'height' | 'popover' | 'ref' | 'tabIndex'> & MenuGroupProps): React.JSX.Element;
1309
+ declare namespace MenuGroup {
1310
+ var displayName: string;
1311
+ }
1312
+ /**
1313
+ * @public
1314
+ */
1315
+ interface MenuItemProps extends ResponsivePaddingProps, ResponsiveRadiusProps {
1316
+ as?: React.ElementType | keyof React.JSX.IntrinsicElements;
1317
+ fontSize?: number | number[];
1318
+ hotkeys?: string[];
1319
+ icon?: React.ElementType | React.ReactNode;
1320
+ iconRight?: React.ElementType | React.ReactNode;
1321
+ pressed?: boolean;
1322
+ selected?: boolean;
1323
+ space?: number | number[];
1324
+ text?: React.ReactNode;
1325
+ tone?: SelectableTone;
1326
+ }
1327
+ /**
1328
+ * @public
1329
+ */
1330
+ declare const MenuItem: react141.ForwardRefExoticComponent<MenuItemProps & Omit<react141.HTMLProps<HTMLDivElement>, "ref" | "as" | "height" | "tabIndex" | "selected"> & react141.RefAttributes<HTMLDivElement>>;
1331
+ /**
1332
+ * @public
1333
+ */
1334
+ interface TabProps {
1335
+ /**
1336
+ * The `id` of the correlating `TabPanel` component.
1337
+ */
1338
+ 'aria-controls': string;
1339
+ 'id': string;
1340
+ 'icon'?: React.ElementType | React.ReactNode;
1341
+ 'focused'?: boolean;
1342
+ 'fontSize'?: number | number[];
1343
+ 'label'?: React.ReactNode;
1344
+ 'padding'?: number | number[];
1345
+ 'selected'?: boolean;
1346
+ 'tone'?: ButtonTone;
1347
+ }
1348
+ /**
1349
+ * @public
1350
+ */
1351
+ declare const Tab: react141.ForwardRefExoticComponent<Omit<TabProps & Omit<react141.HTMLProps<HTMLButtonElement>, "as" | "label" | "type" | "width" | "id" | "aria-controls">, "ref"> & react141.RefAttributes<HTMLButtonElement>>;
1352
+ /**
1353
+ * @public
1354
+ */
1355
+ interface TabListProps extends Omit<InlineProps, 'as' | 'height'> {
1356
+ children: Array<React.JSX.Element | null | undefined | false>;
1357
+ }
1358
+ /**
1359
+ * @public
1360
+ */
1361
+ declare const TabList: react141.ForwardRefExoticComponent<Omit<TabListProps & Omit<react141.HTMLProps<HTMLDivElement>, "as" | "height">, "ref"> & react141.RefAttributes<unknown>>;
1362
+ /**
1363
+ * @internal
1364
+ */
1365
+ declare function _isEnterToClickElement(element: HTMLElement): boolean;
1366
+ /**
1367
+ * @internal
1368
+ */
1369
+ declare function isHTMLElement(node: unknown): node is HTMLElement;
1370
+ /**
1371
+ * @internal
1372
+ */
1373
+ declare function isHTMLAnchorElement(element: unknown): element is HTMLAnchorElement;
1374
+ /**
1375
+ * @internal
1376
+ */
1377
+ declare function isHTMLInputElement(element: unknown): element is HTMLInputElement;
1378
+ /**
1379
+ * @internal
1380
+ */
1381
+ declare function isHTMLButtonElement(element: unknown): element is HTMLButtonElement;
1382
+ /**
1383
+ * @internal
1384
+ */
1385
+ declare function isHTMLSelectElement(element: unknown): element is HTMLSelectElement;
1386
+ /**
1387
+ * @internal
1388
+ */
1389
+ declare function isHTMLTextAreaElement(element: unknown): element is HTMLTextAreaElement;
1390
+ /**
1391
+ * @internal
1392
+ */
1393
+ declare function containsOrEqualsElement(element: HTMLElement, node: Node): boolean;
1394
+ /**
1395
+ * Returns true if a dark color scheme is preferred, false if a light color scheme is preferred or the preference is not known.
1396
+ *
1397
+ * @param getServerSnapshot - Only called during server-side rendering, and hydration if using hydrateRoot. Since the server environment doesn't have access to the DOM, we can't determine the current value of the media query and we assume `(prefers-color-scheme: light)` since it's the most common scheme (https://react.dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
1398
+ *
1399
+ * If you persist the detected preference in a cookie or a header then you may implement your own server snapshot to read it.
1400
+ * Chrome supports reading the `prefers-color-scheme` media query from a header if the server response: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Sec-CH-Prefers-Color-Scheme
1401
+ * @example https://gist.github.com/stipsan/13c0cccf8dfc34f4b44bb1b984baf7df
1402
+ *
1403
+ * @public
1404
+ */
1405
+ declare function usePrefersDark(getServerSnapshot?: () => boolean): boolean;
1406
+ /**
1407
+ * @public
1408
+ */
1409
+ interface ThemeProviderProps {
1410
+ children?: React.ReactNode;
1411
+ scheme?: ThemeColorSchemeKey;
1412
+ theme?: RootTheme;
1413
+ tone?: ThemeColorCardToneKey;
1414
+ }
1415
+ /**
1416
+ * @public
1417
+ */
1418
+ declare function ThemeProvider(props: ThemeProviderProps): React.JSX.Element;
1419
+ declare namespace ThemeProvider {
1420
+ var displayName: string;
1421
+ }
1422
+ /**
1423
+ * @public
1424
+ */
1425
+ declare function useTheme(): Theme;
1426
+ /**
1427
+ * @public
1428
+ */
1429
+ declare function useTheme_v2(): Theme_v2;
1430
+ export { VirtualListProps as $, BadgeMode as $n, hslToRgb$1 as $r, AvatarRootStyleProps as $t, TextInputClearButtonProps as A, GridItemColumnEnd as An, ThemeColorScheme as Ar, InlineProps as At, StackProps as B, FlexJustify as Bn, ThemeColorSyntax$1 as Br, Code as Bt, TooltipDelayGroupProvider as C, HotkeysProps as Cn, ThemeColorGenericState as Cr, BoundaryElementProviderProps as Ct, Tooltip as D, PopoverMargins as Dn, ThemeColorMuted as Dr, KBD as Dt, TooltipDelayGroupContextValue as E, Radius as En, ThemeColorInputStates as Er, LabelProps as Et, Text as F, GridAutoCols as Fn, ThemeColorSelectableStates as Fr, Flex as Ft, Radio as G, ButtonMode as Gn, ThemeFontWeight$1 as Gr, Card as Gt, SpinnerProps as H, FlexWrap as Hn, ThemeFont$1 as Hr, Checkbox as Ht, TextProps as I, GridAutoFlow as In, ThemeColorSolid as Ir, FlexProps as It, PopoverProps as J, ButtonWidth as Jn, ThemeInput as Jr, ButtonProps as Jt, RadioProps as K, ButtonTextAlign as Kn, ThemeFontWeightKey$1 as Kr, CardProps as Kt, Switch as L, GridAutoRows as Ln, ThemeColorSolidTone as Lr, ResponsiveWidthStyleProps as Lt, TextInputType as M, GridItemRow as Mn, ThemeColorSchemes as Mr, HeadingProps as Mt, TextArea as N, GridItemRowEnd as Nn, ThemeColorSelectable as Nr, Grid as Nt, TooltipProps as O, Placement as On, ThemeColorMutedTone as Or, KBDProps as Ot, TextAreaProps as P, GridItemRowStart as Pn, ThemeColorSelectableState as Pr, GridProps as Pt, VirtualListChangeOpts as Q, BoxSizing as Qn, hexToRgb$1 as Qr, BoxProps as Qt, SwitchProps as R, FlexAlign as Rn, ThemeColorSpot as Rr, Container as Rt, useTooltipDelayGroup as S, Hotkeys as Sn, ThemeColorCardState as Sr, BoundaryElementProvider as St, TooltipDelayGroupContext as T, SelectableTone as Tn, ThemeColorInputState as Tr, Label as Tt, Select as U, DialogPosition as Un, ThemeFontKey$1 as Ur, CheckboxProps as Ut, Spinner as V, FlexValue as Vn, ThemeColorToneKey$1 as Vr, CodeProps as Vt, SelectProps as W, CardTone as Wn, ThemeFontSize$1 as Wr, CardStyleProps as Wt, PopoverWidth as X, BoxHeight as Xn, ThemeShadow$1 as Xr, BadgeProps as Xt, PopoverUpdateCallback as Y, BoxDisplay as Yn, ThemeLayer$1 as Yr, Badge as Yt, VirtualList as Z, BoxOverflow as Zn, createColorTheme$1 as Zr, Box as Zt, TabProps as _, ResponsiveMarginProps as _n, ThemeColorButtonModeKey$1 as _r, ElementQuery as _t, usePrefersDark as a, screen$1 as ai, Avatar as an, BoxShadow as ar, PortalProviderProps as at, MenuGroup as b, ResponsiveShadowProps as bn, ThemeColorButtonTones as br, useBoundaryElement as bt, isHTMLAnchorElement as c, Menu as cn, RGB$1 as cr, useLayer as ct, isHTMLInputElement as d, ResponsiveBorderProps as dn, Theme$1 as dr, LayerProviderProps as dt, multiply$1 as ei, ResponsiveAvatarSizeStyleProps as en, BadgeTone as er, SrOnly as et, isHTMLSelectElement as f, ResponsiveBoxProps as fn, ThemeAvatar as fr, Layer as ft, Tab as g, ResponsiveGridProps as gn, ThemeColorButton as gr, ErrorBoundaryState as gt, TabListProps as h, ResponsiveGridItemProps as hn, ThemeColorBuilderOpts as hr, ErrorBoundaryProps as ht, ThemeProviderProps as i, rgba$1 as ii, AvatarCounterProps as in, BaseTheme$1 as ir, PortalProvider as it, TextInputProps as j, GridItemColumnStart as jn, ThemeColorSchemeKey$1 as jr, Heading as jt, TextInput as k, GridItemColumn as kn, ThemeColorName as kr, Inline as kt, isHTMLButtonElement as l, MenuProps as ln, RootTheme$1 as lr, LayerContextValue as lt, TabList as m, ResponsiveFlexProps as mn, ThemeColorBase as mr, ErrorBoundary as mt, useTheme_v2 as n, rgbToHex$1 as ni, AvatarStackProps as nn, AvatarSize as nr, usePortal as nt, _isEnterToClickElement as o, studioTheme as oi, AvatarProps as on, HSL$1 as or, Portal as ot, isHTMLTextAreaElement as p, ResponsiveFlexItemProps as pn, ThemeColor as pr, LayerProps as pt, Popover as q, ButtonTone as qn, ThemeFonts$1 as qr, Button as qt, ThemeProvider as r, rgbToHsl$1 as ri, AvatarCounter as rn, AvatarStatus as rr, PortalContextValue as rt, containsOrEqualsElement as s, MenuDivider as sn, PartialThemeColorBuilderOpts as sr, PortalProps as st, useTheme as t, parseColor$1 as ti, AvatarStack as tn, AvatarPosition as tr, SrOnlyProps as tt, isHTMLElement as u, Delay as un, Styles as ur, LayerProvider as ut, MenuItem as v, ResponsivePaddingProps as vn, ThemeColorButtonState as vr, MediaQueryProps as vt, TooltipDelayGroupProviderProps as w, TextAlign as wn, ThemeColorInput as wr, Arrow as wt, MenuGroupProps as x, ResponsiveWidthProps as xn, ThemeColorCard as xr, BoundaryElementContextValue as xt, MenuItemProps as y, ResponsiveRadiusProps as yn, ThemeColorButtonStates as yr, ConditionalWrapper as yt, Stack as z, FlexDirection as zn, ThemeColorSpotKey as zr, ContainerProps as zt };
1431
+ //# sourceMappingURL=useTheme.d.mts.map