@sanity/ui 4.0.0-beta.1 → 4.0.0-beta.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (70) hide show
  1. package/LICENSE +1 -1
  2. package/README.md +1 -1
  3. package/dist/index.d.ts +1352 -2074
  4. package/dist/index.d.ts.map +1 -0
  5. package/dist/index.js +6 -2
  6. package/dist/index.js.map +1 -1
  7. package/exports/index.ts +8 -0
  8. package/package.json +5 -23
  9. package/src/components/autocomplete/__workshop__/Custom.tsx +1 -1
  10. package/src/components/autocomplete/__workshop__/Example.tsx +1 -2
  11. package/src/components/breadcrumbs/__workshop__/Example.tsx +1 -2
  12. package/src/components/dialog/__workshop__/Props.tsx +11 -2
  13. package/src/components/menu/__workshop__/ClosableMenuButton.tsx +1 -1
  14. package/src/components/menu/__workshop__/ConstrainedInBoundary.tsx +1 -1
  15. package/src/components/menu/__workshop__/DataProps.tsx +1 -2
  16. package/src/components/menu/__workshop__/MenuButton.tsx +1 -1
  17. package/src/components/menu/__workshop__/Tones.tsx +1 -2
  18. package/src/components/tree/__workshop__/Basic.tsx +1 -2
  19. package/src/primitives/avatar/__workshop__/AsButton.tsx +1 -2
  20. package/src/primitives/avatar/__workshop__/PropsStory.tsx +1 -2
  21. package/src/primitives/avatar/__workshop__/Stack.tsx +1 -2
  22. package/src/primitives/badge/__workshop__/Props.tsx +1 -2
  23. package/src/primitives/badge/__workshop__/Tones.tsx +1 -2
  24. package/src/primitives/box/__workshop__/Props.tsx +1 -1
  25. package/src/primitives/box/__workshop__/Responsive.tsx +1 -2
  26. package/src/primitives/button/__workshop__/Custom.tsx +12 -2
  27. package/src/primitives/button/__workshop__/CustomIcons.tsx +1 -2
  28. package/src/primitives/button/__workshop__/DataProps.tsx +1 -2
  29. package/src/primitives/button/__workshop__/Props.tsx +1 -1
  30. package/src/primitives/button/__workshop__/Stacked.tsx +11 -2
  31. package/src/primitives/card/__workshop__/AsButton.tsx +1 -2
  32. package/src/primitives/card/__workshop__/Checkered.tsx +1 -2
  33. package/src/primitives/card/__workshop__/Props.tsx +12 -2
  34. package/src/primitives/card/__workshop__/Tones.tsx +1 -2
  35. package/src/primitives/checkbox/__workshop__/Tones.tsx +1 -2
  36. package/src/primitives/code/__workshop__/OpticalAlignment.tsx +1 -2
  37. package/src/primitives/code/__workshop__/Props.tsx +1 -2
  38. package/src/primitives/container/__workshop__/Example.tsx +1 -2
  39. package/src/primitives/heading/__workshop__/OpticalAlignment.tsx +1 -2
  40. package/src/primitives/heading/__workshop__/Plain.tsx +1 -2
  41. package/src/primitives/inline/__workshop__/Plain.tsx +1 -2
  42. package/src/primitives/label/__workshop__/OpticalAlignment.tsx +1 -2
  43. package/src/primitives/label/__workshop__/Plain.tsx +1 -2
  44. package/src/primitives/popover/__workshop__/AlignedStory.tsx +1 -2
  45. package/src/primitives/popover/__workshop__/PlainStory.tsx +1 -2
  46. package/src/primitives/popover/__workshop__/RecursiveStory.tsx +1 -1
  47. package/src/primitives/popover/__workshop__/SidePanelStory.tsx +2 -1
  48. package/src/primitives/popover/__workshop__/TestStory.tsx +1 -1
  49. package/src/primitives/select/__workshop__/Plain.tsx +1 -2
  50. package/src/primitives/skeleton/__workshop__/Delay.tsx +1 -1
  51. package/src/primitives/skeleton/__workshop__/Skeleton.tsx +1 -1
  52. package/src/primitives/spinner/__workshop__/Props.tsx +1 -2
  53. package/src/primitives/stack/__workshop__/Plain.tsx +1 -2
  54. package/src/primitives/text/__workshop__/Example.tsx +1 -2
  55. package/src/primitives/text/__workshop__/OpticalAlignment.tsx +1 -2
  56. package/src/primitives/textArea/__workshop__/Plain.tsx +1 -2
  57. package/src/primitives/textInput/__workshop__/Plain.tsx +1 -2
  58. package/src/primitives/textInput/__workshop__/Tones.tsx +1 -2
  59. package/src/primitives/tooltip/__workshop__/Props.tsx +10 -2
  60. package/src/utils/elementQuery/__workshop__/styles.css.ts +1 -1
  61. package/dist/css.d.ts +0 -11
  62. package/dist/css.js +0 -7
  63. package/dist/css.js.map +0 -1
  64. package/dist/tokens.d.ts +0 -4
  65. package/dist/tokens.js +0 -2
  66. package/dist/tokens.js.map +0 -1
  67. package/exports/css.ts +0 -2
  68. package/exports/tokens.ts +0 -2
  69. /package/dist/{css/index.css → index.css} +0 -0
  70. /package/exports/{css/index.css → index.css} +0 -0
package/dist/index.d.ts CHANGED
@@ -1,2184 +1,1617 @@
1
- import type {AvatarColor} from '@sanity/ui-tokens'
2
- import type {AvatarSize} from '@sanity/ui-tokens'
3
- import {BadgeStyleProps} from '@sanity/ui-css'
4
- import {BoxStyleProps} from '@sanity/ui-css'
5
- import {Breakpoint} from '@sanity/ui-css'
6
- import {ButtonStyleProps} from '@sanity/ui-css'
7
- import {CardStyleProps} from '@sanity/ui-css'
8
- import type {CardTone} from '@sanity/ui-tokens'
9
- import {CodeStyleProps} from '@sanity/ui-css'
10
- import type {ColorScheme} from '@sanity/ui-tokens'
11
- import {Component} from 'react'
12
- import type {ComponentType as ComponentType_2} from 'react'
13
- import {ContainerStyleProps} from '@sanity/ui-css'
14
- import type {ContainerWidth} from '@sanity/ui-tokens'
15
- import type {Context} from 'react'
16
- import type {ElementTone} from '@sanity/ui-tokens'
17
- import {ElementType as ElementType_2} from 'react'
18
- import {ErrorInfo} from 'react'
19
- import {FlexStyleProps} from '@sanity/ui-css'
20
- import type {FontCodeSize} from '@sanity/ui-tokens'
21
- import type {FontHeadingSize} from '@sanity/ui-tokens'
22
- import type {FontLabelSize} from '@sanity/ui-tokens'
23
- import type {FontTextSize} from '@sanity/ui-tokens'
24
- import type {FontWeight} from '@sanity/ui-tokens'
25
- import {ForwardedRef} from 'react'
26
- import {GapStyleProps} from '@sanity/ui-css'
27
- import {GridStyleProps} from '@sanity/ui-css'
28
- import {HeadingStyleProps} from '@sanity/ui-css'
29
- import {HTMLMotionProps} from 'motion/react'
30
- import {InlineStyleProps} from '@sanity/ui-css'
31
- import {InputStyleProps} from '@sanity/ui-css'
32
- import {KBDStyleProps} from '@sanity/ui-css'
33
- import {LabelStyleProps} from '@sanity/ui-css'
34
- import {LazyExoticComponent} from 'react'
35
- import {MaxWidth} from '@sanity/ui-css'
36
- import {MouseEventHandler} from 'react'
37
- import {PaddingStyleProps} from '@sanity/ui-css'
38
- import {PropsWithChildren} from 'react'
39
- import type {Radius} from '@sanity/ui-tokens'
40
- import {RadiusStyleProps} from '@sanity/ui-css'
41
- import {ReactElement} from 'react'
42
- import {ReactNode} from 'react'
43
- import {ReactPortal} from 'react'
44
- import {Ref} from 'react'
45
- import {ResponsiveProp} from '@sanity/ui-css'
46
- import {ResponsivePropArray} from '@sanity/ui-css'
47
- import {RootStyleProps} from '@sanity/ui-css'
48
- import {SelectableStyleProps} from '@sanity/ui-css'
49
- import {SelectStyleProps} from '@sanity/ui-css'
50
- import type {Shadow} from '@sanity/ui-tokens'
51
- import {ShadowStyleProps} from '@sanity/ui-css'
52
- import {SkeletonStyleProps} from '@sanity/ui-css'
53
- import type {Space} from '@sanity/ui-tokens'
54
- import {StackStyleProps} from '@sanity/ui-css'
55
- import type {Strategy} from '@floating-ui/react-dom'
56
- import {TextAreaStyleProps} from '@sanity/ui-css'
57
- import {TextOverflowStyleProps} from '@sanity/ui-css'
58
- import {TextStyleProps} from '@sanity/ui-css'
59
-
1
+ import { BREAKPOINTS, BadgeStyleProps, BoxStyleProps, Breakpoint, ButtonStyleProps, CardStyleProps, CodeStyleProps, ContainerStyleProps, FlexStyleProps, GapStyleProps, GridStyleProps, HeadingStyleProps, InlineStyleProps, InputStyleProps, KBDStyleProps, LabelStyleProps, MaxWidth, PaddingStyleProps, RadiusStyleProps, ResponsiveProp, ResponsiveProp as ResponsiveProp$1, ResponsivePropArray, RootStyleProps, SelectStyleProps, SelectableStyleProps, ShadowStyleProps, SkeletonStyleProps, StackStyleProps, TextAreaStyleProps, TextOverflowStyleProps, TextStyleProps, vars } from "@sanity/ui-css";
2
+ import { AvatarColor, AvatarSize, CardTone, ColorScheme, ContainerWidth, ElementTone, FontCodeSize, FontHeadingSize, FontLabelSize, FontTextSize, FontWeight, Radius, Shadow, Space } from "@sanity/ui-tokens";
3
+ import * as _$_sanity_color0 from "@sanity/color";
4
+ import { COLOR_HUES as HUES, COLOR_TINTS as TINTS } from "@sanity/color";
5
+ import * as _$react from "react";
6
+ import { Component, ComponentType as ComponentType$1, Context, ElementType as ElementType$1, ErrorInfo, ForwardedRef, MouseEventHandler, PropsWithChildren, ReactElement, ReactNode, ReactPortal, Ref } from "react";
7
+ import { Strategy } from "@floating-ui/react-dom";
8
+ import { HTMLMotionProps } from "motion/react";
9
+ export * from "@sanity/ui-tokens";
10
+ /** @internal */
11
+ declare const _CODE_TOKEN_KEYS: readonly ["atrule", "attrName", "attrValue", "attribute", "boolean", "builtin", "cdata", "char", "class", "className", "comment", "constant", "deleted", "doctype", "entity", "function", "hexcode", "id", "important", "inserted", "keyword", "number", "operator", "prolog", "property", "pseudoClass", "pseudoElement", "punctuation", "regex", "selector", "string", "symbol", "tag", "unit", "url", "variable"];
60
12
  /**
61
- * Assign properties from `U` to `T`, excluding properties that already exist in `T`.
13
+ * Available avatar color mode values for the `_avatarColor` collection.
62
14
  *
63
- * @public
64
- */
65
- export declare type Assign<T extends {}, U extends {}> = Omit<T, keyof U> & U
66
-
67
- /**
68
- * @internal
69
- */
70
- export declare function attemptFocus(element: HTMLElement): boolean
71
-
72
- /**
73
- * The Autocomplete component is typically used for search components.
74
- * It consists of a text input for writing a query, and properties for rendering suggestions.
15
+ * @remarks
16
+ * Avatar colors map to color hues: gray, red, orange, yellow, green,
17
+ * cyan, blue, purple, magenta.
75
18
  *
76
19
  * @public
77
20
  */
78
- export declare function Autocomplete<
79
- E extends AutocompleteElementType = typeof DEFAULT_AUTOCOMPLETE_ELEMENT,
80
- Option extends BaseAutocompleteOption = BaseAutocompleteOption,
81
- >(props: AutocompleteProps<E, Option>): React.JSX.Element
82
-
21
+ declare const AVATAR_COLORS: _$_sanity_color0.ColorHueKey[];
83
22
  /** @public */
84
- export declare type AutocompleteElementType = 'input' | ComponentType
85
-
86
- /**
87
- * @internal
88
- */
89
- export declare interface AutocompleteInputChangeMsg {
90
- type: 'input/change'
91
- query: string | null
92
- }
93
-
94
- /**
95
- * @internal
96
- */
97
- export declare interface AutocompleteInputFoocusMsg {
98
- type: 'input/focus'
99
- }
100
-
101
- /**
102
- * @internal
103
- */
104
- export declare type AutocompleteMsg =
105
- | AutocompleteRootBlurMsg
106
- | AutocompleteRootClearMsg
107
- | AutocompleteRootEscapeMsg
108
- | AutocompleteRootOpenMsg
109
- | AutocompleteRootSetActiveValueMsg
110
- | AutocompleteRootSetListFocusedMsg
111
- | AutocompleteInputChangeMsg
112
- | AutocompleteInputFoocusMsg
113
- | AutocompleteValueChangeMsg
114
-
115
- /** @public */
116
- export declare type AutocompleteOpenButtonProps = Omit<ButtonProps<'button'>, 'as'>
117
-
118
- /** @public */
119
- export declare type AutocompleteOwnProps<
120
- Option extends BaseAutocompleteOption = BaseAutocompleteOption,
121
- > = TextInputOwnProps & {
122
- border?: boolean
123
- customValidity?: string
124
- filterOption?: (query: string, option: Option) => boolean
125
- icon?: ElementType_2 | ReactNode
126
- /** @beta */
127
- listBox?: BoxOwnProps
128
- loading?: boolean
129
- onChange?: (value: string) => void
130
- onQueryChange?: (query: string | null) => void
131
- onSelect?: (value: string) => void
132
- /** @beta */
133
- openButton?: boolean | AutocompleteOpenButtonProps
134
- /** @beta */
135
- openOnFocus?: boolean
136
- /** The options to render. */
137
- options?: Option[]
138
- padding?: ResponsiveProp<Space>
139
- popover?: Omit<PopoverProps, 'content' | 'onMouseEnter' | 'onMouseLeave' | 'open'>
140
- prefix?: ReactNode
141
- radius?: Radius | Radius[]
142
- /** @beta */
143
- relatedElements?: HTMLElement[]
144
- /** The callback function for rendering each option. */
145
- renderOption?: (option: Option) => React.JSX.Element
146
- /** @beta */
147
- renderPopover?: (
148
- props: {
149
- content: React.JSX.Element | null
150
- hidden: boolean
151
- inputElement: HTMLInputElement | null
152
- onMouseEnter: () => void
153
- onMouseLeave: () => void
154
- },
155
- ref: ForwardedRef<HTMLDivElement>,
156
- ) => ReactNode
157
- renderValue?: (value: string, option?: Option) => string
158
- suffix?: ReactNode
159
- value?: string
160
- }
161
-
23
+ declare const AVATAR_SIZE: readonly [0, 1, 2, 3];
24
+ /** @beta */
25
+ declare const BG_PATTERNS: readonly ["checkered", "halftone", "grid"];
162
26
  /** @public */
163
- export declare type AutocompleteProps<
164
- E extends AutocompleteElementType = AutocompleteElementType,
165
- Option extends BaseAutocompleteOption = BaseAutocompleteOption,
166
- > = Props<AutocompleteOwnProps<Option>, E>
167
-
168
- /**
169
- * @internal
170
- */
171
- export declare interface AutocompleteRootBlurMsg {
172
- type: 'root/blur'
173
- }
174
-
175
- /**
176
- * @internal
177
- */
178
- export declare interface AutocompleteRootClearMsg {
179
- type: 'root/clear'
180
- }
181
-
182
- /**
183
- * @internal
184
- */
185
- export declare interface AutocompleteRootEscapeMsg {
186
- type: 'root/escape'
187
- }
188
-
189
- /**
190
- * @internal
191
- */
192
- export declare interface AutocompleteRootOpenMsg {
193
- type: 'root/open'
194
- query: string | null
195
- }
196
-
197
- /**
198
- * @internal
199
- */
200
- export declare interface AutocompleteRootSetActiveValueMsg {
201
- type: 'root/setActiveValue'
202
- value: string
203
- listFocused?: boolean
204
- }
205
-
27
+ declare const BORDER_STYLE: readonly ["default", "muted", "none"];
28
+ /** @public */
29
+ declare const BORDER_WIDTH: readonly [0, 1, 2];
30
+ /** @public */
31
+ declare const BUTTON_MODES: readonly ["default", "ghost", "bleed"];
206
32
  /**
207
- * @internal
33
+ * Available card tone mode values for the `_cardTone` collection.
34
+ *
35
+ * @public
208
36
  */
209
- export declare interface AutocompleteRootSetListFocusedMsg {
210
- type: 'root/setListFocused'
211
- listFocused: boolean
212
- }
213
-
37
+ declare const CARD_TONES: readonly ["default", "neutral", "primary", "suggest", "positive", "caution", "critical", "transparent"];
214
38
  /**
215
- * @internal
39
+ * Available color scheme mode values for the `_colorScheme` collection.
40
+ *
41
+ * @public
216
42
  */
217
- export declare interface AutocompleteState {
218
- activeValue: string | null
219
- focused: boolean
220
- listFocused: boolean
221
- query: string | null
222
- value: string | null
223
- }
224
-
43
+ declare const COLOR_SCHEMES: readonly ["light", "dark"];
225
44
  /**
226
- * @internal
45
+ * Available color variant types.
46
+ *
47
+ * @public
227
48
  */
228
- export declare interface AutocompleteValueChangeMsg {
229
- type: 'value/change'
230
- value: string | null
231
- }
232
-
49
+ declare const COLOR_VARIANTS: readonly ["tinted", "solid"];
50
+ /** @public */
51
+ declare const CONTAINER_SCALE: readonly [0, 1, 2, 3, 4, 5];
52
+ /** @public */
53
+ declare const CONTAINER: [...typeof CONTAINER_SCALE, 'auto'];
233
54
  /**
234
- * Avatars are used to represent people and other agents (e.g. bots).
55
+ * Available element tone mode values for the `_elementTone` collection.
235
56
  *
236
57
  * @public
237
58
  */
238
- export declare function Avatar<E extends AvatarElementType = typeof DEFAULT_AVATAR_ELEMENT>(
239
- props: AvatarProps<E>,
240
- ): React.JSX.Element
241
-
59
+ declare const ELEMENT_TONES: readonly ["default", "neutral", "primary", "suggest", "positive", "caution", "critical"];
242
60
  /** @public */
243
- export declare function AvatarCounter<
244
- E extends AvatarCounterElementType = typeof DEFAULT_AVATAR_COUNTER_ELEMENT,
245
- >(props: AvatarCounterProps<E>): React.JSX.Element
246
-
61
+ declare const FONT_CODE_SIZE: readonly [0, 1, 2, 3, 4];
247
62
  /** @public */
248
- export declare type AvatarCounterElementType = 'button' | 'div' | 'span' | ComponentType
249
-
63
+ declare const FONT_HEADING_SIZE: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
250
64
  /** @public */
251
- export declare interface AvatarCounterOwnProps {
252
- count: number
253
- size?: ResponsiveProp<AvatarSize>
254
- }
255
-
65
+ declare const FONT_LABEL_SIZE: readonly [0, 1, 2, 3, 4, 5];
256
66
  /** @public */
257
- export declare type AvatarCounterProps<
258
- E extends AvatarCounterElementType = AvatarCounterElementType,
259
- > = Props<AvatarCounterOwnProps, E>
260
-
67
+ declare const FONT_TEXT_SIZE: readonly [0, 1, 2, 3, 4];
261
68
  /** @public */
262
- export declare type AvatarElementType = 'a' | 'button' | 'div' | 'span' | ComponentType
263
-
69
+ declare const FONT_WEIGHT: readonly ["regular", "medium", "semibold", "bold"];
264
70
  /** @public */
265
- export declare interface AvatarOwnProps {
266
- /** @beta */
267
- __unstable_hideInnerStroke?: boolean
268
- animateArrowFrom?: AvatarPosition
269
- arrowPosition?: AvatarPosition
270
- color?: AvatarColor
271
- initials?: string
272
- onImageLoadError?: (event: Error) => void
273
- size?: ResponsiveProp<AvatarSize>
274
- src?: string
275
- title?: string
276
- }
277
-
278
- /** @public */
279
- export declare type AvatarPosition = 'top' | 'bottom' | 'inside'
280
-
281
- /** @public */
282
- export declare type AvatarProps<E extends AvatarElementType = AvatarElementType> = Props<
283
- AvatarOwnProps,
284
- E
285
- >
286
-
287
- /** @public */
288
- export declare function AvatarStack<
289
- E extends AvatarStackElementType = typeof DEFAULT_AVATAR_STACK_ELEMENT,
290
- >(props: AvatarStackProps<E>): React.JSX.Element
291
-
292
- /** @public */
293
- export declare type AvatarStackChild = ReactElement<AvatarProps<'div'>> | null | undefined | false
294
-
295
- /** @public */
296
- export declare type AvatarStackElementType = 'div' | 'span' | ComponentType
297
-
298
- /** @public */
299
- export declare type AvatarStackOwnProps = Omit<
300
- BoxOwnProps,
301
- 'align' | 'alignItems' | 'display' | 'justify' | 'justifyContent'
302
- > & {
303
- children: AvatarStackChild | AvatarStackChild[]
304
- maxLength?: number
305
- size?: ResponsiveProp<AvatarSize>
306
- }
307
-
71
+ declare const RADIUS: readonly [0, 1, 2, 3, 4, 5, 6, "full"];
72
+ /** @public */
73
+ declare const SHADOW: readonly [0, 1, 2, 3, 4, 5];
308
74
  /** @public */
309
- export declare type AvatarStackProps<E extends AvatarStackElementType = AvatarStackElementType> =
310
- Props<AvatarStackOwnProps, E>
311
-
75
+ declare const SPACE: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
312
76
  /**
313
- * Badges are used to tag resources.
77
+ * Assign properties from `U` to `T`, excluding properties that already exist in `T`.
314
78
  *
315
79
  * @public
316
80
  */
317
- export declare function Badge<E extends BadgeElementType = typeof DEFAULT_BADGE_ELEMENT>(
318
- props: BadgeProps<E>,
319
- ): React.JSX.Element
320
-
81
+ type Assign<T extends {}, U extends {}> = Omit<T, keyof U> & U;
321
82
  /** @public */
322
- export declare type BadgeElementType = 'div' | 'span' | ComponentType
323
-
83
+ type EmptyProps = {};
324
84
  /** @public */
325
- export declare interface BadgeOwnProps extends BadgeStyleProps {
326
- fontSize?: ResponsiveProp<FontTextSize>
327
- }
328
-
329
- /** @public */
330
- export declare type BadgeProps<E extends BadgeElementType = BadgeElementType> = Props<
331
- BadgeOwnProps,
332
- E
333
- >
334
-
335
- /** @public */
336
- export declare interface BaseAutocompleteOption {
337
- value: string
338
- }
339
-
85
+ type TagType = keyof React.JSX.IntrinsicElements;
340
86
  /** @public */
341
- export declare type BoundaryElementContextValue = HTMLElement | null
342
-
87
+ type ComponentType<P = any> = React.FunctionComponent<P> | React.ComponentClass<P> | React.ExoticComponent<P>;
343
88
  /** @public */
344
- export declare function BoundaryElementProvider(
345
- props: BoundaryElementProviderProps,
346
- ): React.JSX.Element
347
-
89
+ type ElementType<P> = TagType | ComponentType<P>;
348
90
  /** @public */
349
- export declare interface BoundaryElementProviderProps {
350
- children: ReactNode
351
- element: HTMLElement | null
352
- }
353
-
91
+ type Props<P extends EmptyProps, E extends ElementType<P>> = Assign<E extends TagType ? React.JSX.IntrinsicElements[E] : React.ComponentProps<E>, P & {
92
+ as?: E;
93
+ }>;
354
94
  /**
355
- * The `Box` component is a basic layout wrapper component which provides utility properties
356
- * for flex, margins and padding.
95
+ * Placement of floating UI elements.
357
96
  *
358
97
  * @public
359
98
  */
360
- export declare function Box<E extends BoxElementType = typeof DEFAULT_BOX_ELEMENT>(
361
- props: BoxProps<E>,
362
- ): React.JSX.Element
363
-
364
- /** @public */
365
- export declare type BoxElementType =
366
- | 'a'
367
- | 'article'
368
- | 'aside'
369
- | 'blockquote'
370
- | 'body'
371
- | 'button'
372
- | 'details'
373
- | 'div'
374
- | 'header'
375
- | 'fieldset'
376
- | 'figure'
377
- | 'figcaption'
378
- | 'footer'
379
- | 'form'
380
- | 'html'
381
- | 'iframe'
382
- | 'kbd'
383
- | 'label'
384
- | 'legend'
385
- | 'li'
386
- | 'main'
387
- | 'nav'
388
- | 'ol'
389
- | 'pre'
390
- | 'section'
391
- | 'span'
392
- | 'summary'
393
- | 'table'
394
- | 'tbody'
395
- | 'td'
396
- | 'tfoot'
397
- | 'th'
398
- | 'thead'
399
- | 'tr'
400
- | 'ul'
401
- | ComponentType
402
-
403
- /** @public */
404
- export declare type BoxOwnProps = BoxStyleProps
405
-
406
- /** @public */
407
- export declare type BoxProps<E extends BoxElementType = BoxElementType> = Props<BoxOwnProps, E>
408
-
409
- /** @beta */
410
- export declare function Breadcrumbs<
411
- E extends BreadcrumbsElementType = typeof DEFAULT_BREADCRUMBS_ELEMENT,
412
- >(props: BreadcrumbsProps<E>): React.JSX.Element
413
-
414
- /** @beta */
415
- export declare type BreadcrumbsElementType = 'div' | 'nav' | ComponentType
416
-
417
- /** @beta */
418
- export declare type BreadcrumbsOwnProps = GapStyleProps & {
419
- expandButton?: Omit<ButtonProps, 'as' | 'onClick' | 'selected'>
420
- maxLength?: number
421
- popover?: PopoverProps
422
- separator?: ReactNode
423
- }
424
-
425
- /** @beta */
426
- export declare type BreadcrumbsProps<E extends BreadcrumbsElementType = BreadcrumbsElementType> =
427
- Props<BreadcrumbsOwnProps, E>
428
-
429
- /** @public */
430
- export declare function Button<E extends ButtonElementType = typeof DEFAULT_BUTTON_ELEMENT>(
431
- props: ButtonProps<E>,
432
- ): React.JSX.Element
433
-
434
- /** @public */
435
- export declare type ButtonElementType = 'a' | 'button' | 'label' | ComponentType
436
-
437
- /** @public */
438
- export declare interface ButtonOwnProps extends ButtonStyleProps {
439
- 'data-ui'?: string
440
- 'fontSize'?: ResponsiveProp<FontTextSize>
441
- 'icon'?: React.ElementType | React.ReactNode
442
- 'iconRight'?: React.ElementType | React.ReactNode
443
- /** @beta Do not use in production, as this might change.*/
444
- 'loading'?: boolean
445
- 'muted'?: boolean
446
- 'selected'?: boolean
447
- 'textAlign'?: TextOwnProps['align']
448
- 'text'?: React.ReactNode
449
- 'textOverflow'?: TextOwnProps['textOverflow']
450
- 'textWeight'?: TextOwnProps['weight']
451
- 'tooltip'?: Omit<TooltipProps<'div'>, 'as' | 'children'>
452
- }
453
-
99
+ type Placement = 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
100
+ /** @public */
101
+ type Delay = number | Partial<{
102
+ open: number;
103
+ close: number;
104
+ }>;
454
105
  /** @public */
455
- export declare type ButtonProps<E extends ButtonElementType = ButtonElementType> = Props<
456
- ButtonOwnProps,
457
- E
458
- >
459
-
106
+ declare const DEFAULT_BOX_ELEMENT = "div";
460
107
  /** @public */
461
- export declare type ButtonTextAlign = 'left' | 'right' | 'center'
462
-
108
+ type BoxOwnProps = BoxStyleProps;
109
+ /** @public */
110
+ type BoxElementType = 'a' | 'article' | 'aside' | 'blockquote' | 'body' | 'button' | 'details' | 'div' | 'header' | 'fieldset' | 'figure' | 'figcaption' | 'footer' | 'form' | 'html' | 'iframe' | 'kbd' | 'label' | 'legend' | 'li' | 'main' | 'nav' | 'ol' | 'pre' | 'section' | 'span' | 'summary' | 'table' | 'tbody' | 'td' | 'tfoot' | 'th' | 'thead' | 'tr' | 'ul' | ComponentType;
111
+ /** @public */
112
+ type BoxProps<E extends BoxElementType = BoxElementType> = Props<BoxOwnProps, E>;
463
113
  /**
464
- * The `Card` component acts much like a `Box`, but with a background and foreground color.
465
- * Components within a `Card` inherit its colors.
114
+ * The `Box` component is a basic layout wrapper component which provides utility properties
115
+ * for flex, margins and padding.
466
116
  *
467
117
  * @public
468
118
  */
469
- export declare function Card<E extends CardElementType = typeof DEFAULT_CARD_ELEMENT>(
470
- props: CardProps<E>,
471
- ): React.JSX.Element
472
-
473
- /** @internal */
474
- export declare type _CardCompatProviderComponent = ComponentType_2<{
475
- children?: ReactNode
476
- tone: CardTone | 'inherit'
477
- scheme: ColorScheme
478
- }>
479
-
480
- /** @public */
481
- export declare interface CardContextValue {
482
- tone: CardTone
483
- scheme: ColorScheme
484
- }
485
-
119
+ declare function Box<E extends BoxElementType = typeof DEFAULT_BOX_ELEMENT>(props: BoxProps<E>): React.JSX.Element;
486
120
  /** @public */
487
- export declare type CardElementType = BoxElementType
488
-
489
- /** @internal */
490
- export declare interface _CardInternalContextValue {
491
- CompatProvider?: _CardCompatProviderComponent
492
- root: boolean
493
- }
494
-
121
+ declare const DEFAULT_CARD_ELEMENT = "div";
495
122
  /** @public */
496
- export declare interface CardOwnProps extends Omit<CardStyleProps, 'tone'> {
123
+ interface CardOwnProps extends Omit<CardStyleProps, 'tone'> {
497
124
  /**
498
125
  * Do not use in production.
499
126
  * @beta
500
127
  * @deprecated Use `__unstable_pattern` instead.
501
128
  */
502
- __unstable_checkered?: boolean
129
+ __unstable_checkered?: boolean;
503
130
  /**
504
131
  * Do not use in production.
505
132
  * @beta
506
133
  */
507
- __unstable_focusRing?: boolean
508
- disabled?: boolean
509
- pressed?: boolean
510
- selected?: boolean
511
- target?: string
512
- tone?: CardTone | 'inherit'
134
+ __unstable_focusRing?: boolean;
135
+ disabled?: boolean;
136
+ pressed?: boolean;
137
+ selected?: boolean;
138
+ target?: string;
139
+ tone?: CardTone | 'inherit';
513
140
  }
514
-
515
141
  /** @public */
516
- export declare type CardProps<E extends CardElementType = CardElementType> = Props<CardOwnProps, E>
517
-
142
+ type CardElementType = BoxElementType;
518
143
  /** @public */
519
- export declare function CardProvider(props: {
520
- children?: ReactNode
521
- tone: CardTone
522
- scheme: ColorScheme
523
- }): React.JSX.Element
524
-
144
+ type CardProps<E extends CardElementType = CardElementType> = Props<CardOwnProps, E>;
525
145
  /**
526
- * Checkboxes allow the user to select one or more items from a set.
146
+ * The `Card` component acts much like a `Box`, but with a background and foreground color.
147
+ * Components within a `Card` inherit its colors.
527
148
  *
528
149
  * @public
529
150
  */
530
- export declare function Checkbox<E extends CheckboxElementType = typeof DEFAULT_CHECKBOX_ELEMENT>(
531
- props: CheckboxProps<E>,
532
- ): React.JSX.Element
533
-
151
+ declare function Card<E extends CardElementType = typeof DEFAULT_CARD_ELEMENT>(props: CardProps<E>): React.JSX.Element;
534
152
  /** @public */
535
- export declare type CheckboxElementType = 'input' | ComponentType
536
-
153
+ declare const DEFAULT_LAYER_ELEMENT = "div";
537
154
  /** @public */
538
- export declare type CheckboxOwnProps = {
539
- indeterminate?: boolean
540
- customValidity?: string
155
+ interface LayerOwnProps extends CardOwnProps {
156
+ /** A callback that fires when the layer becomes the top layer when it was not the top layer before. */
157
+ onActivate?: (props: {
158
+ activeElement: HTMLElement | null;
159
+ }) => void;
160
+ zOffset?: ResponsiveProp$1<number>;
541
161
  }
542
-
543
- /** @public */
544
- export declare type CheckboxProps<E extends CheckboxElementType = CheckboxElementType> = Props<
545
- CheckboxOwnProps,
546
- E
547
- >
548
-
549
- /** @public */
550
- export declare type ClickOutsideEventElements = (HTMLElement | null | (HTMLElement | null)[])[]
551
-
552
162
  /** @public */
553
- export declare type ClickOutsideEventListener = (event: MouseEvent) => void
554
-
163
+ type LayerElementType = CardElementType;
555
164
  /** @public */
556
- export declare function Code<E extends CodeElementType = typeof DEFAULT_CODE_ELEMENT>(
557
- props: CodeProps<E>,
558
- ): React.JSX.Element
559
-
165
+ type LayerProps<E extends LayerElementType = LayerElementType> = Props<LayerOwnProps, E>;
560
166
  /** @public */
561
- export declare type CodeElementType = 'div' | 'pre' | ComponentType
562
-
563
- /** @public */
564
- export declare type CodeOwnProps = CodeStyleProps & {
565
- /** Define the language to use for syntax highlighting. */
566
- language?: string
167
+ declare function Layer<E extends LayerElementType = typeof DEFAULT_LAYER_ELEMENT>(props: LayerProps<E>): React.JSX.Element;
168
+ /** @internal */
169
+ interface PopoverLayerOwnProps extends LayerOwnProps {
170
+ /**
171
+ * Whether the popover should animate in and out.
172
+ *
173
+ * @beta
174
+ * @defaultValue false
175
+ */
176
+ animate?: boolean;
177
+ children?: React.ReactNode;
178
+ originX?: number;
179
+ originY?: number;
180
+ referenceWidth?: number;
181
+ strategy?: Strategy;
182
+ x?: number;
183
+ y?: number;
567
184
  }
568
-
569
185
  /** @public */
570
- export declare type CodeProps<E extends CodeElementType = CodeElementType> = Props<CodeOwnProps, E>
571
-
186
+ type PopoverLayerProps = Assign<HTMLMotionProps<'div'>, PopoverLayerOwnProps>;
572
187
  /**
573
- * This API might change. DO NOT USE IN PRODUCTION.
574
188
  * @beta
575
189
  */
576
- export declare function CodeSkeleton<
577
- E extends CodeSkeletonElementType = typeof DEFAULT_CODE_SKELETON_ELEMENT,
578
- >(props: CodeSkeletonProps<E>): React.JSX.Element
579
-
580
- /** @beta */
581
- export declare type CodeSkeletonElementType = SkeletonElementType
582
-
190
+ type PopoverMargins = [number, number, number, number];
583
191
  /** @beta */
584
- export declare type CodeSkeletonOwnProps = SkeletonOwnProps & {
585
- size?: ResponsiveProp<FontCodeSize>
586
- }
587
-
588
- /**
589
- * This API might change. DO NOT USE IN PRODUCTION.
590
- * @beta
591
- */
592
- export declare type CodeSkeletonProps<E extends CodeSkeletonElementType = CodeSkeletonElementType> =
593
- Props<CodeSkeletonOwnProps, E>
594
-
192
+ type PopoverUpdateCallback = () => void;
595
193
  /** @public */
596
- export declare type ComponentType<P = any> =
597
- | React.FunctionComponent<P>
598
- | React.ComponentClass<P>
599
- | React.ExoticComponent<P>
600
-
601
- /**
602
- * The `Container` component wraps content layout in a defined set of widths.
603
- *
604
- * @public
605
- */
606
- export declare function Container<
607
- E extends ContainerElementType = typeof DEFAULT_CONTAINER_ELEMENT,
608
- >(props: ContainerProps<E>): React.JSX.Element
609
-
194
+ type PopoverWidth = Exclude<ContainerWidth, 'auto'>;
610
195
  /** @public */
611
- export declare type ContainerElementType = BoxElementType
612
-
196
+ type PopoverOwnProps = Omit<PopoverLayerOwnProps, 'maxWidth'> & {
197
+ /** @beta */__unstable_distance?: number;
198
+ /**
199
+ * @beta
200
+ * @deprecated Will be removed in the next major version */
201
+ __unstable_margins?: PopoverMargins; /** @beta */
202
+ __unstable_shift?: number;
203
+ /**
204
+ * @deprecated Will be removed in the next major version
205
+ */
206
+ arrow?: boolean;
207
+ children?: ReactElement<{
208
+ ref: ForwardedRef<HTMLElement>;
209
+ }>;
210
+ /**
211
+ * When `true`, prevent overflow within the current boundary:
212
+ * - by flipping on its side axis
213
+ * - by resizing
214
+ *
215
+ * Note that:
216
+ * - setting `preventOverflow` to `true` also prevents overflow on its side axis
217
+ * - setting `matchReferenceWidth` to `true` also causes the popover to resize
218
+ *
219
+ * @defaultValue false
220
+ */
221
+ constrainSize?: boolean;
222
+ content?: ReactNode;
223
+ disabled?: boolean;
224
+ fallbackPlacements?: Placement[];
225
+ floatingBoundary?: HTMLElement | null;
226
+ /**
227
+ * When `true`, set the maximum width to match the reference element, and also prevent overflow within
228
+ * the current boundary by resizing.
229
+ *
230
+ * Note that setting `constrainSize` to `true` also causes the popover to resize
231
+ *
232
+ * @defaultValue false
233
+ */
234
+ matchReferenceWidth?: boolean;
235
+ /**
236
+ * When true, blocks all pointer interaction with elements beneath the popover until closed.
237
+ *
238
+ * @beta
239
+ * @defaultValue false
240
+ */
241
+ modal?: boolean;
242
+ open?: boolean;
243
+ placement?: Placement;
244
+ /**
245
+ * When 'flip' (default), the placement is determined from the initial placement and the
246
+ * fallback placements in order. Whichever fits in the viewport first.
247
+ *
248
+ * When 'autoPlacement', the initial placement and all fallback placements are evaluated
249
+ * and the placement with the most viewport space available.
250
+ *
251
+ * Option is only relevant if either `constrainSize` or `preventOverflow` is `true`
252
+ */
253
+ placementStrategy?: 'flip' | 'autoPlacement'; /** Whether or not to render the popover in a portal element. */
254
+ portal?: boolean | string;
255
+ preventOverflow?: boolean;
256
+ referenceBoundary?: HTMLElement | null;
257
+ /**
258
+ * When defined, the popover will be positioned relative to this element.
259
+ * The children of the popover won't be rendered.
260
+ */
261
+ referenceElement?: HTMLElement | null; /** @beta */
262
+ updateRef?: Ref<PopoverUpdateCallback | undefined>;
263
+ width?: ResponsiveProp$1<MaxWidth>;
264
+ };
613
265
  /** @public */
614
- export declare type ContainerOwnProps = ContainerStyleProps
615
-
266
+ type PopoverElementType = 'div';
616
267
  /** @public */
617
- export declare type ContainerProps<E extends ContainerElementType = ContainerElementType> = Props<
618
- ContainerOwnProps,
619
- E
620
- >
621
-
268
+ type PopoverProps = Assign<PopoverLayerProps, PopoverOwnProps>;
622
269
  /**
623
- * @internal
270
+ * The `Popover` component is used to display some content on top of another.
271
+ *
272
+ * @public
624
273
  */
625
- export declare function containsOrEqualsElement(element: HTMLElement, node: Node): boolean
626
-
627
- /** @public */
628
- export declare const DEFAULT_AUTOCOMPLETE_ELEMENT = 'input'
629
-
630
- /** @public */
631
- export declare const DEFAULT_AVATAR_COUNTER_ELEMENT = 'span'
632
-
633
- /** @public */
634
- export declare const DEFAULT_AVATAR_ELEMENT = 'span'
635
-
636
- /** @public */
637
- export declare const DEFAULT_AVATAR_STACK_ELEMENT = 'span'
638
-
639
- /** @public */
640
- export declare const DEFAULT_BADGE_ELEMENT = 'span'
641
-
642
- /** @public */
643
- export declare const DEFAULT_BOX_ELEMENT = 'div'
644
-
645
- /** @beta */
646
- export declare const DEFAULT_BREADCRUMBS_ELEMENT = 'nav'
647
-
648
- /** @public */
649
- export declare const DEFAULT_BUTTON_ELEMENT = 'button'
650
-
651
- /** @public */
652
- export declare const DEFAULT_CARD_ELEMENT = 'div'
653
-
654
- /** @public */
655
- export declare const DEFAULT_CHECKBOX_ELEMENT = 'input'
656
-
657
- /** @public */
658
- export declare const DEFAULT_CODE_ELEMENT = 'pre'
659
-
660
- /** @beta */
661
- export declare const DEFAULT_CODE_SKELETON_ELEMENT = 'div'
662
-
663
- /** @public */
664
- export declare const DEFAULT_CONTAINER_ELEMENT = 'div'
665
-
666
- /** @public */
667
- export declare const DEFAULT_DIALOG_ELEMENT = 'div'
668
-
669
- /** @beta */
670
- export declare const DEFAULT_ELEMENT_QUERY_ELEMENT = 'div'
671
-
672
- /** @public */
673
- export declare const DEFAULT_FLEX_ELEMENT = 'div'
674
-
675
- /** @public */
676
- export declare const DEFAULT_GRID_ELEMENT = 'div'
677
-
678
- /** @public */
679
- export declare const DEFAULT_HEADING_ELEMENT = 'div'
680
-
681
- /** @beta */
682
- export declare const DEFAULT_HEADING_SKELETON_ELEMENT = 'div'
683
-
274
+ declare function Popover(props: PopoverProps): React.JSX.Element;
684
275
  /** @public */
685
- export declare const DEFAULT_HOTKEYS_ELEMENT = 'kbd'
686
-
276
+ declare const DEFAULT_TEXT_ELEMENT = "div";
687
277
  /** @public */
688
- export declare const DEFAULT_INLINE_CODE_ELEMENT = 'code'
689
-
278
+ type TextOwnProps = TextStyleProps & TextOverflowStyleProps;
690
279
  /** @public */
691
- export declare const DEFAULT_INLINE_ELEMENT = 'div'
692
-
280
+ type TextElementType = 'div' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'label' | 'li' | 'p' | 'span' | 'summary' | 'time' | ComponentType;
693
281
  /** @public */
694
- export declare const DEFAULT_KBD_ELEMENT = 'kbd'
695
-
696
- /** @public */
697
- export declare const DEFAULT_LABEL_ELEMENT = 'div'
698
-
699
- /** @beta */
700
- export declare const DEFAULT_LABEL_SKELETON_ELEMENT = 'div'
701
-
702
- /** @public */
703
- export declare const DEFAULT_LAYER_ELEMENT = 'div'
704
-
705
- /** @public */
706
- export declare const DEFAULT_MENU_DIVIDER_ELEMENT = 'hr'
707
-
708
- /** @public */
709
- export declare const DEFAULT_MENU_ELEMENT = 'div'
710
-
711
- /** @public */
712
- export declare const DEFAULT_MENU_GROUP_ELEMENT = 'button'
713
-
714
- /** @public */
715
- export declare const DEFAULT_MENU_ITEM_ELEMENT = 'button'
716
-
717
- /** @public */
718
- export declare const DEFAULT_RADIO_ELEMENT = 'input'
719
-
720
- /** @public */
721
- export declare const DEFAULT_ROOT_ELEMENT = 'html'
722
-
723
- /** @public */
724
- export declare const DEFAULT_SELECT_ELEMENT = 'select'
725
-
726
- /** @public */
727
- export declare const DEFAULT_SELECTABLE_ELEMENT = 'button'
728
-
729
- /** @beta */
730
- export declare const DEFAULT_SKELETON_ELEMENT = 'div'
731
-
282
+ type TextProps<E extends TextElementType = TextElementType> = Props<TextOwnProps, E>;
283
+ /**
284
+ * The `Text` component is an agile, themed typographic element.
285
+ *
286
+ * @public
287
+ */
288
+ declare function Text<E extends TextElementType = typeof DEFAULT_TEXT_ELEMENT>(props: TextProps<E>): React.JSX.Element;
732
289
  /** @public */
733
- export declare const DEFAULT_SPINNER_ELEMENT = 'div'
734
-
290
+ declare const DEFAULT_TOOLTIP_ELEMENT = "div";
735
291
  /** @public */
736
- export declare const DEFAULT_SR_ONLY_ELEMENT = 'span'
737
-
292
+ type TooltipOwnProps = LayerOwnProps & RadiusStyleProps & ShadowStyleProps & {
293
+ /**
294
+ * Whether the tooltip should animate in and out.
295
+ *
296
+ * @beta
297
+ * @defaultValue false
298
+ */
299
+ animate?: boolean; /** @deprecated Will be removed in the next major version */
300
+ arrow?: boolean;
301
+ boundaryElement?: HTMLElement | null;
302
+ children?: React.ReactElement<React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>>;
303
+ content?: React.ReactNode;
304
+ /**
305
+ * Adds a delay to open or close the tooltip.
306
+ *
307
+ * If only a `number` is passed, it will be used for both opening and closing.
308
+ *
309
+ * If an object `{open: number; close:number}` is passed, it can be used to set different delays for each action.
310
+ *
311
+ * @public
312
+ * @defaultValue 0
313
+ */
314
+ delay?: Delay;
315
+ disabled?: boolean;
316
+ fallbackPlacements?: Placement[];
317
+ hotkeys?: string[];
318
+ placement?: Placement; /** Whether or not to render the tooltip in a portal element. */
319
+ portal?: boolean | string;
320
+ scheme?: ColorScheme;
321
+ text?: React.ReactNode;
322
+ textSize?: ResponsiveProp$1<FontTextSize>;
323
+ tone?: CardTone;
324
+ };
325
+ /** @public */
326
+ type TooltipElementType = 'div' | 'span' | ComponentType;
327
+ /** @public */
328
+ type TooltipProps<E extends TooltipElementType = TooltipElementType> = Props<TooltipOwnProps, E>;
329
+ /**
330
+ * Tooltips display information when hovering, focusing or tapping.
331
+ *
332
+ * @public
333
+ */
334
+ declare function Tooltip<E extends TooltipElementType = typeof DEFAULT_TOOLTIP_ELEMENT>(props: TooltipProps<E>): React.JSX.Element;
738
335
  /** @public */
739
- export declare const DEFAULT_STACK_ELEMENT = 'div'
740
-
336
+ declare const DEFAULT_BUTTON_ELEMENT = "button";
741
337
  /** @public */
742
- export declare const DEFAULT_SWITCH_ELEMENT = 'input'
743
-
338
+ interface ButtonOwnProps extends ButtonStyleProps {
339
+ 'data-ui'?: string;
340
+ 'fontSize'?: ResponsiveProp$1<FontTextSize>;
341
+ 'icon'?: React.ElementType | React.ReactNode;
342
+ 'iconRight'?: React.ElementType | React.ReactNode;
343
+ /** @beta Do not use in production, as this might change.*/
344
+ 'loading'?: boolean;
345
+ 'muted'?: boolean;
346
+ 'selected'?: boolean;
347
+ 'textAlign'?: TextOwnProps['align'];
348
+ 'text'?: React.ReactNode;
349
+ 'textOverflow'?: TextOwnProps['textOverflow'];
350
+ 'textWeight'?: TextOwnProps['weight'];
351
+ 'tooltip'?: Omit<TooltipProps<'div'>, 'as' | 'children'>;
352
+ }
744
353
  /** @public */
745
- export declare const DEFAULT_TAB_ELEMENT = 'button'
746
-
354
+ type ButtonElementType = 'a' | 'button' | 'label' | ComponentType;
747
355
  /** @public */
748
- export declare const DEFAULT_TAB_LIST_ELEMENT = 'div'
749
-
356
+ type ButtonProps<E extends ButtonElementType = ButtonElementType> = Props<ButtonOwnProps, E>;
750
357
  /** @public */
751
- export declare const DEFAULT_TAB_PANEL_ELEMENT = 'div'
752
-
358
+ declare function Button<E extends ButtonElementType = typeof DEFAULT_BUTTON_ELEMENT>(props: ButtonProps<E>): React.JSX.Element;
753
359
  /** @public */
754
- export declare const DEFAULT_TEXT_AREA_ELEMENT = 'textarea'
755
-
360
+ declare const DEFAULT_TEXT_INPUT_ELEMENT = "input";
756
361
  /** @public */
757
- export declare const DEFAULT_TEXT_ELEMENT = 'div'
758
-
362
+ type TextInputClearButtonProps = Omit<ButtonProps<'button'>, 'as' | 'onClick' | 'onMouseDown'>;
759
363
  /** @public */
760
- export declare const DEFAULT_TEXT_INPUT_ELEMENT = 'input'
761
-
762
- /** @beta */
763
- export declare const DEFAULT_TEXT_SKELETON_ELEMENT = 'div'
764
-
765
- /** @internal */
766
- export declare const DEFAULT_TOAST_ELEMENT = 'li'
767
-
364
+ type TextInputOwnProps = InputStyleProps & {
365
+ /**
366
+ * @beta
367
+ */
368
+ __unstable_disableFocusRing?: boolean;
369
+ /**
370
+ * @beta
371
+ */
372
+ clearButton?: boolean | TextInputClearButtonProps;
373
+ customValidity?: string;
374
+ icon?: ElementType$1 | ReactNode;
375
+ iconRight?: ElementType$1 | ReactNode;
376
+ /**
377
+ * @beta
378
+ */
379
+ onClear?: () => void;
380
+ prefix?: ReactNode;
381
+ suffix?: ReactNode;
382
+ /**
383
+ * @deprecated Use `fontWeight` instead
384
+ */
385
+ weight?: FontWeight;
386
+ };
768
387
  /** @public */
769
- export declare const DEFAULT_TOOLTIP_ELEMENT = 'div'
770
-
771
- /** @beta */
772
- export declare const DEFAULT_TREE_ELEMENT = 'div'
773
-
774
- /** @beta */
775
- export declare const DEFAULT_TREE_ITEM_ELEMENT = 'a'
776
-
777
- /** @beta */
778
- export declare const DEFAULT_VIRTUAL_LIST_ELEMENT = 'div'
779
-
388
+ type TextInputElementType = 'input' | ComponentType;
780
389
  /** @public */
781
- export declare type Delay =
782
- | number
783
- | Partial<{
784
- open: number
785
- close: number
786
- }>
787
-
390
+ type TextInputProps<E extends TextInputElementType = TextInputElementType> = Props<TextInputOwnProps, E>;
788
391
  /**
789
- * The Dialog component.
392
+ * Single line text input.
790
393
  *
791
394
  * @public
792
395
  */
793
- export declare function Dialog<E extends DialogElementType = typeof DEFAULT_DIALOG_ELEMENT>(
794
- props: DialogProps<E>,
795
- ): React.JSX.Element
796
-
396
+ declare function TextInput<E extends TextInputElementType = typeof DEFAULT_TEXT_INPUT_ELEMENT>(props: TextInputProps<E>): React.JSX.Element;
397
+ /** @public */
398
+ type AutocompleteOpenButtonProps = Omit<ButtonProps<'button'>, 'as'>;
399
+ /** @public */
400
+ interface BaseAutocompleteOption {
401
+ value: string;
402
+ }
797
403
  /**
798
404
  * @internal
799
405
  */
800
- export declare const DialogContext: Context<DialogContextValue>
801
-
406
+ interface AutocompleteState {
407
+ activeValue: string | null;
408
+ focused: boolean;
409
+ listFocused: boolean;
410
+ query: string | null;
411
+ value: string | null;
412
+ }
802
413
  /**
803
- * This API might change. DO NOT USE IN PRODUCTION.
804
- * @beta
414
+ * @internal
805
415
  */
806
- export declare interface DialogContextValue {
807
- version: 0.0
808
- position?: ResponsiveProp<DialogPosition>
809
- zOffset?: ResponsiveProp<number>
416
+ interface AutocompleteRootBlurMsg {
417
+ type: 'root/blur';
810
418
  }
811
-
812
- /** @public */
813
- export declare type DialogElementType = 'div' | 'span' | ComponentType
814
-
419
+ /**
420
+ * @internal
421
+ */
422
+ interface AutocompleteRootClearMsg {
423
+ type: 'root/clear';
424
+ }
425
+ /**
426
+ * @internal
427
+ */
428
+ interface AutocompleteRootEscapeMsg {
429
+ type: 'root/escape';
430
+ }
431
+ /**
432
+ * @internal
433
+ */
434
+ interface AutocompleteRootOpenMsg {
435
+ type: 'root/open';
436
+ query: string | null;
437
+ }
438
+ /**
439
+ * @internal
440
+ */
441
+ interface AutocompleteRootSetActiveValueMsg {
442
+ type: 'root/setActiveValue';
443
+ value: string;
444
+ listFocused?: boolean;
445
+ }
446
+ /**
447
+ * @internal
448
+ */
449
+ interface AutocompleteRootSetListFocusedMsg {
450
+ type: 'root/setListFocused';
451
+ listFocused: boolean;
452
+ }
453
+ /**
454
+ * @internal
455
+ */
456
+ interface AutocompleteInputChangeMsg {
457
+ type: 'input/change';
458
+ query: string | null;
459
+ }
460
+ /**
461
+ * @internal
462
+ */
463
+ interface AutocompleteInputFoocusMsg {
464
+ type: 'input/focus';
465
+ }
466
+ /**
467
+ * @internal
468
+ */
469
+ interface AutocompleteValueChangeMsg {
470
+ type: 'value/change';
471
+ value: string | null;
472
+ }
473
+ /**
474
+ * @internal
475
+ */
476
+ type AutocompleteMsg = AutocompleteRootBlurMsg | AutocompleteRootClearMsg | AutocompleteRootEscapeMsg | AutocompleteRootOpenMsg | AutocompleteRootSetActiveValueMsg | AutocompleteRootSetListFocusedMsg | AutocompleteInputChangeMsg | AutocompleteInputFoocusMsg | AutocompleteValueChangeMsg;
477
+ /** @public */
478
+ declare const DEFAULT_AUTOCOMPLETE_ELEMENT = "input";
479
+ /** @public */
480
+ type AutocompleteOwnProps<Option extends BaseAutocompleteOption = BaseAutocompleteOption> = TextInputOwnProps & {
481
+ border?: boolean;
482
+ customValidity?: string;
483
+ filterOption?: (query: string, option: Option) => boolean;
484
+ icon?: ElementType$1 | ReactNode; /** @beta */
485
+ listBox?: BoxOwnProps;
486
+ loading?: boolean;
487
+ onChange?: (value: string) => void;
488
+ onQueryChange?: (query: string | null) => void;
489
+ onSelect?: (value: string) => void; /** @beta */
490
+ openButton?: boolean | AutocompleteOpenButtonProps; /** @beta */
491
+ openOnFocus?: boolean; /** The options to render. */
492
+ options?: Option[];
493
+ padding?: ResponsiveProp$1<Space>;
494
+ popover?: Omit<PopoverProps, 'content' | 'onMouseEnter' | 'onMouseLeave' | 'open'>;
495
+ prefix?: ReactNode;
496
+ radius?: Radius | Radius[]; /** @beta */
497
+ relatedElements?: HTMLElement[]; /** The callback function for rendering each option. */
498
+ renderOption?: (option: Option) => React.JSX.Element; /** @beta */
499
+ renderPopover?: (props: {
500
+ content: React.JSX.Element | null;
501
+ hidden: boolean;
502
+ inputElement: HTMLInputElement | null;
503
+ onMouseEnter: () => void;
504
+ onMouseLeave: () => void;
505
+ }, ref: ForwardedRef<HTMLDivElement>) => ReactNode;
506
+ renderValue?: (value: string, option?: Option) => string;
507
+ suffix?: ReactNode;
508
+ value?: string;
509
+ };
510
+ /** @public */
511
+ type AutocompleteElementType = 'input' | ComponentType;
512
+ /** @public */
513
+ type AutocompleteProps<E extends AutocompleteElementType = AutocompleteElementType, Option extends BaseAutocompleteOption = BaseAutocompleteOption> = Props<AutocompleteOwnProps<Option>, E>;
514
+ /**
515
+ * The Autocomplete component is typically used for search components.
516
+ * It consists of a text input for writing a query, and properties for rendering suggestions.
517
+ *
518
+ * @public
519
+ */
520
+ declare function Autocomplete<E extends AutocompleteElementType = typeof DEFAULT_AUTOCOMPLETE_ELEMENT, Option extends BaseAutocompleteOption = BaseAutocompleteOption>(props: AutocompleteProps<E, Option>): React.JSX.Element;
521
+ /** @beta */
522
+ declare const DEFAULT_BREADCRUMBS_ELEMENT = "nav";
523
+ /** @beta */
524
+ type BreadcrumbsOwnProps = GapStyleProps & {
525
+ expandButton?: Omit<ButtonProps, 'as' | 'onClick' | 'selected'>;
526
+ maxLength?: number;
527
+ popover?: PopoverProps;
528
+ separator?: ReactNode;
529
+ };
530
+ /** @beta */
531
+ type BreadcrumbsElementType = 'div' | 'nav' | ComponentType;
532
+ /** @beta */
533
+ type BreadcrumbsProps<E extends BreadcrumbsElementType = BreadcrumbsElementType> = Props<BreadcrumbsOwnProps, E>;
534
+ /** @beta */
535
+ declare function Breadcrumbs<E extends BreadcrumbsElementType = typeof DEFAULT_BREADCRUMBS_ELEMENT>(props: BreadcrumbsProps<E>): React.JSX.Element;
536
+ /** @public */
537
+ type DialogPosition = 'absolute' | 'fixed';
538
+ /** @public */
539
+ declare const DEFAULT_DIALOG_ELEMENT = "div";
815
540
  /** @public */
816
- export declare interface DialogOwnProps
817
- extends
818
- Omit<ContainerStyleProps, 'id' | 'position' | 'radius' | 'shadow'>,
819
- Omit<LayerOwnProps, 'id' | 'position' | 'radius' | 'shadow' | 'width'> {
541
+ interface DialogOwnProps extends Omit<ContainerStyleProps, 'id' | 'position' | 'radius' | 'shadow'>, Omit<LayerOwnProps, 'id' | 'position' | 'radius' | 'shadow' | 'width'> {
820
542
  /**
821
543
  * @beta
822
544
  */
823
- __unstable_autoFocus?: boolean
545
+ __unstable_autoFocus?: boolean;
824
546
  /**
825
547
  * @beta
826
548
  */
827
- __unstable_hideCloseButton?: boolean
549
+ __unstable_hideCloseButton?: boolean;
828
550
  /**
829
551
  * Whether the dialog should animate in on mount.
830
552
  *
831
553
  * @beta
832
554
  * @defaultValue false
833
555
  */
834
- animate?: boolean
835
- cardRadius?: ResponsiveProp<Radius>
836
- contentRef?: ForwardedRef<HTMLDivElement>
837
- footer?: ReactNode
838
- header?: ReactNode
839
- id: string
556
+ animate?: boolean;
557
+ cardRadius?: ResponsiveProp$1<Radius>;
558
+ contentRef?: ForwardedRef<HTMLDivElement>;
559
+ footer?: ReactNode;
560
+ header?: ReactNode;
561
+ id: string;
840
562
  /** A callback that fires when the dialog becomes the top layer when it was not the top layer before. */
841
- onActivate?: LayerProps['onActivate']
842
- onClickOutside?: () => void
843
- onClose?: () => void
844
- open?: boolean
845
- portal?: string
846
- position?: ResponsiveProp<DialogPosition>
563
+ onActivate?: LayerProps['onActivate'];
564
+ onClickOutside?: () => void;
565
+ onClose?: () => void;
566
+ open?: boolean;
567
+ portal?: string;
568
+ position?: ResponsiveProp$1<DialogPosition>;
847
569
  /**
848
570
  * @deprecated Not in use – will be removed in the next major version.
849
571
  */
850
- shadow?: ResponsiveProp<Shadow>
572
+ shadow?: ResponsiveProp$1<Shadow>;
851
573
  }
852
-
853
574
  /** @public */
854
- export declare type DialogPosition = 'absolute' | 'fixed'
855
-
575
+ type DialogElementType = 'div' | 'span' | ComponentType;
856
576
  /** @public */
857
- export declare type DialogProps<E extends DialogElementType = DialogElementType> = Props<
858
- DialogOwnProps,
859
- E
860
- >
861
-
577
+ type DialogProps<E extends DialogElementType = DialogElementType> = Props<DialogOwnProps, E>;
862
578
  /**
863
- * This API might change. DO NOT USE IN PRODUCTION.
864
- * @beta
579
+ * The Dialog component.
580
+ *
581
+ * @public
865
582
  */
866
- export declare function DialogProvider(props: DialogProviderProps): React.JSX.Element
867
-
583
+ declare function Dialog<E extends DialogElementType = typeof DEFAULT_DIALOG_ELEMENT>(props: DialogProps<E>): React.JSX.Element;
868
584
  /**
869
585
  * This API might change. DO NOT USE IN PRODUCTION.
870
586
  * @beta
871
587
  */
872
- export declare interface DialogProviderProps {
873
- children?: ReactNode
874
- position?: ResponsiveProp<DialogPosition>
875
- zOffset?: ResponsiveProp<number>
588
+ interface DialogContextValue {
589
+ version: 0.0;
590
+ position?: ResponsiveProp$1<DialogPosition>;
591
+ zOffset?: ResponsiveProp$1<number>;
876
592
  }
877
-
878
593
  /**
879
- * DO NOT USE IN PRODUCTION.
880
- * @beta
594
+ * @internal
881
595
  */
882
- export declare function ElementQuery<
883
- E extends ElementQueryElementType = typeof DEFAULT_ELEMENT_QUERY_ELEMENT,
884
- >(props: ElementQueryProps<E>): React.JSX.Element
885
-
886
- /** @beta */
887
- export declare type ElementQueryElementType = 'div' | ComponentType
888
-
596
+ declare const DialogContext: Context<DialogContextValue>;
889
597
  /**
890
- * DO NOT USE IN PRODUCTION.
598
+ * This API might change. DO NOT USE IN PRODUCTION.
891
599
  * @beta
892
600
  */
893
- export declare type ElementQueryOwnProps = {
894
- media?: number[]
601
+ interface DialogProviderProps {
602
+ children?: ReactNode;
603
+ position?: ResponsiveProp$1<DialogPosition>;
604
+ zOffset?: ResponsiveProp$1<number>;
895
605
  }
896
-
897
606
  /**
898
- * DO NOT USE IN PRODUCTION.
607
+ * This API might change. DO NOT USE IN PRODUCTION.
899
608
  * @beta
900
609
  */
901
- export declare type ElementQueryProps<E extends ElementQueryElementType = ElementQueryElementType> =
902
- Props<ElementQueryOwnProps, E>
903
-
610
+ declare function DialogProvider(props: DialogProviderProps): React.JSX.Element;
904
611
  /**
612
+ * This API might change. DO NOT USE IN PRODUCTION.
905
613
  * @beta
906
614
  */
907
- export declare interface ElementRectValue {
908
- width: number
909
- height: number
615
+ declare function useDialog(): DialogContextValue;
616
+ /** @public */
617
+ declare const DEFAULT_HOTKEYS_ELEMENT = "kbd";
618
+ /** @public */
619
+ interface HotkeysOwnProps extends GapStyleProps, RadiusStyleProps {
620
+ /** @deprecated No longer supported. */
621
+ fontSize?: never;
622
+ /** @deprecated No longer supported. */
623
+ padding?: never;
624
+ keys: string[];
910
625
  }
911
-
626
+ /** @public */
627
+ type HotkeysElementType = 'kbd' | ComponentType;
628
+ /** @public */
629
+ type HotkeysProps<E extends HotkeysElementType = HotkeysElementType> = Props<HotkeysOwnProps, E>;
912
630
  /**
913
- * @beta
631
+ * Represent hotkeys (a keyboard combination) with semantic `<kbd>` elements.
632
+ *
633
+ * @example
634
+ * ```tsx
635
+ * import {Hotkeys} from '@sanity/ui'
636
+ *
637
+ * <Hotkeys keys={['⌘', 'K']} />
638
+ * ```
639
+ *
640
+ * @public
914
641
  */
915
- export declare interface ElementSize {
916
- content: ElementRectValue
917
- border: ElementRectValue
918
- /** @deprecated INTERNAL ONLY */
919
- _contentRect: DOMRectReadOnly
642
+ declare function Hotkeys<E extends HotkeysElementType = typeof DEFAULT_HOTKEYS_ELEMENT>(props: HotkeysProps<E>): React.JSX.Element | undefined;
643
+ /** @public */
644
+ declare const DEFAULT_MENU_ELEMENT = "div";
645
+ /** @public */
646
+ type MenuOwnProps = PaddingStyleProps & {
647
+ 'gap'?: ResponsiveProp$1<Space>;
648
+ 'onClickOutside'?: (event: MouseEvent) => void;
649
+ 'onEscape'?: () => void;
650
+ 'onItemClick'?: (event: React.MouseEvent<HTMLButtonElement>) => void;
651
+ 'onItemSelect'?: (index: number) => void;
652
+ 'originElement'?: HTMLElement | null;
653
+ 'registerElement'?: (el: HTMLElement) => () => void;
654
+ 'shouldFocus'?: 'first' | 'last' | null;
655
+ 'aria-labelledby'?: string;
656
+ };
657
+ /** @public */
658
+ type MenuElementType = 'div' | 'span' | ComponentType;
659
+ /** @public */
660
+ type MenuProps<E extends MenuElementType = MenuElementType> = Props<MenuOwnProps, E>;
661
+ /**
662
+ * The `Menu` component is a building block for application menus.
663
+ *
664
+ * @public
665
+ */
666
+ declare function Menu<E extends MenuElementType = typeof DEFAULT_MENU_ELEMENT>(props: MenuProps<E>): React.JSX.Element;
667
+ /** @public */
668
+ type MenuButtonProps = {
669
+ /**
670
+ * @beta Do not use in production.
671
+ */
672
+ __unstable_disableRestoreFocusOnClose?: boolean;
673
+ button: ReactElement<ButtonProps>;
674
+ id: string;
675
+ menu?: ReactElement;
676
+ onClose?: () => void;
677
+ onOpen?: () => void;
678
+ popover?: Omit<PopoverProps, 'content' | 'open'>;
679
+ ref?: ForwardedRef<HTMLButtonElement | null>;
680
+ };
681
+ /**
682
+ * The `MenuButton` component follows the WAI-ARIA specification for menu buttons.
683
+ *
684
+ * @public
685
+ */
686
+ declare function MenuButton(props: MenuButtonProps): React.JSX.Element;
687
+ /** @public */
688
+ declare const DEFAULT_MENU_DIVIDER_ELEMENT = "hr";
689
+ /** @public */
690
+ type MenuDividerOwnProps = {};
691
+ /** @public */
692
+ type MenuDividerElementType = 'div' | 'hr' | 'span' | ComponentType;
693
+ /** @public */
694
+ type MenuDividerProps<E extends MenuDividerElementType = MenuDividerElementType> = Props<MenuDividerOwnProps, E>;
695
+ /** @public */
696
+ declare function MenuDivider<E extends MenuDividerElementType = typeof DEFAULT_MENU_DIVIDER_ELEMENT>(props: MenuDividerProps<E>): React.JSX.Element;
697
+ /** @public */
698
+ declare const DEFAULT_MENU_GROUP_ELEMENT = "button";
699
+ /** @public */
700
+ type MenuGroupOwnProps = RadiusStyleProps & {
701
+ disabled?: boolean;
702
+ fontSize?: ResponsiveProp$1<FontTextSize>;
703
+ gap?: ResponsiveProp$1<Space>;
704
+ icon?: ElementType$1 | ReactNode;
705
+ menu?: Omit<MenuProps<typeof DEFAULT_MENU_ELEMENT>, 'onClickOutside' | 'onEscape' | 'onItemClick' | 'onKeyDown' | 'onMouseEnter' | 'registerElement' | 'shouldFocus' | 'onBlurCapture'>;
706
+ padding?: ResponsiveProp$1<Space>;
707
+ popover?: Omit<PopoverProps, 'content' | 'open'>;
708
+ text?: ReactNode;
709
+ tone?: ElementTone;
710
+ };
711
+ /** @public */
712
+ type MenuGroupElementType = 'button' | ComponentType;
713
+ /** @public */
714
+ type MenuGroupProps<E extends MenuGroupElementType = MenuGroupElementType> = Props<MenuGroupOwnProps, E>;
715
+ /** @public */
716
+ declare function MenuGroup<E extends MenuGroupElementType = typeof DEFAULT_MENU_GROUP_ELEMENT>(props: MenuGroupProps<E>): React.JSX.Element;
717
+ /** @public */
718
+ declare const DEFAULT_MENU_ITEM_ELEMENT = "button";
719
+ /** @public */
720
+ type MenuItemOwnProps = GapStyleProps & PaddingStyleProps & RadiusStyleProps & {
721
+ disabled?: boolean;
722
+ fontSize?: ResponsiveProp$1<FontTextSize>;
723
+ hotkeys?: string[];
724
+ icon?: ElementType$1 | ReactNode;
725
+ iconRight?: ElementType$1 | ReactNode;
726
+ pressed?: boolean;
727
+ selected?: boolean;
728
+ text?: ReactNode;
729
+ tone?: ElementTone;
730
+ };
731
+ /** @public */
732
+ type MenuItemElementType = 'button' | 'a' | ComponentType;
733
+ /** @public */
734
+ type MenuItemProps<E extends MenuItemElementType = MenuItemElementType> = Props<MenuItemOwnProps, E>;
735
+ /** @public */
736
+ declare function MenuItem<E extends MenuItemElementType = typeof DEFAULT_MENU_ITEM_ELEMENT>(props: MenuItemProps<E>): React.JSX.Element;
737
+ /** @public */
738
+ declare const DEFAULT_TAB_ELEMENT = "button";
739
+ /** @public */
740
+ interface TabOwnProps extends ButtonOwnProps {
741
+ /**
742
+ * The `id` of the corresponding `TabPanel` component.
743
+ */
744
+ 'aria-controls': string;
745
+ 'id': string;
746
+ 'focused'?: boolean;
747
+ 'label'?: React.ReactNode;
748
+ 'onActivate'?: () => void;
920
749
  }
921
-
750
+ /** @public */
751
+ type TabElementType = 'button' | ComponentType;
752
+ /** @public */
753
+ type TabProps<E extends TabElementType = TabElementType> = Props<TabOwnProps, E>;
754
+ /** @public */
755
+ declare function Tab<E extends TabElementType = typeof DEFAULT_TAB_ELEMENT>(props: TabProps<E>): React.JSX.Element;
756
+ /** @public */
757
+ declare const DEFAULT_FLEX_ELEMENT = "div";
758
+ /** @public */
759
+ type FlexOwnProps = FlexStyleProps;
760
+ /** @public */
761
+ type FlexElementType = BoxElementType;
762
+ /** @public */
763
+ type FlexProps<E extends FlexElementType = FlexElementType> = Props<FlexOwnProps, E>;
922
764
  /**
923
- * @internal
765
+ * The `Flex` component is a wrapper component for flexible elements (`Box`, `Card` and `Flex`).
766
+ *
767
+ * @public
924
768
  */
925
- export declare interface _ElementSizeListener {
926
- subscribe: (element: HTMLElement, subscriber: _ElementSizeSubscriber) => () => void
769
+ declare function Flex<E extends FlexElementType = typeof DEFAULT_FLEX_ELEMENT>(props: FlexProps<E>): React.JSX.Element;
770
+ /** @public */
771
+ declare const DEFAULT_TAB_LIST_ELEMENT = "div";
772
+ /** @public */
773
+ interface TabListOwnProps extends FlexOwnProps {
774
+ autoActivate?: boolean;
927
775
  }
928
-
776
+ /** @public */
777
+ type TabListElementType = 'div' | 'span' | ComponentType;
778
+ /** @public */
779
+ type TabListProps<E extends TabListElementType = TabListElementType> = Omit<Props<TabListOwnProps, E>, 'role'>;
780
+ /** @public */
781
+ declare function TabList<E extends TabListElementType = typeof DEFAULT_TAB_LIST_ELEMENT>(props: TabListProps<E>): React.JSX.Element;
782
+ /** @public */
783
+ declare const DEFAULT_TAB_PANEL_ELEMENT = "div";
784
+ /** @public */
785
+ type TabPanelOwnProps = BoxOwnProps & {
786
+ /**
787
+ * The `id` of the corresponding `Tab` component.
788
+ */
789
+ 'aria-labelledby': string;
790
+ 'id': string;
791
+ };
792
+ /** @public */
793
+ type TabPanelElementType = 'div' | 'span' | ComponentType;
794
+ /** @public */
795
+ type TabPanelProps<E extends TabPanelElementType = TabPanelElementType> = Props<TabPanelOwnProps, E>;
796
+ /** @public */
797
+ declare function TabPanel<E extends TabPanelElementType = typeof DEFAULT_TAB_PANEL_ELEMENT>(props: TabPanelProps<E>): React.JSX.Element;
798
+ /** @internal */
799
+ declare const DEFAULT_TOAST_ELEMENT = "li";
800
+ /** @internal */
801
+ type ToastOwnProps = RadiusStyleProps & {
802
+ closable?: boolean;
803
+ description?: ReactNode;
804
+ onClose?: () => void;
805
+ title?: ReactNode;
806
+ status?: 'error' | 'warning' | 'success' | 'info';
807
+ duration?: number;
808
+ };
809
+ /** @internal */
810
+ type ToastElementType = 'li' | ComponentType;
811
+ /** @internal */
812
+ type ToastProps<E extends ToastElementType = ToastElementType> = Props<ToastOwnProps, E>;
929
813
  /**
814
+ * The `Toast` component gives feedback to users when an action has taken place.
815
+ *
816
+ * Toasts can be closed with a close button, or auto-dismiss when the duration expires.
817
+ *
930
818
  * @internal
931
819
  */
932
- export declare interface _ElementSizeObserver {
933
- subscribe: (element: HTMLElement, subscriber: _ElementSizeSubscriber) => () => void
820
+ declare function Toast<E extends ToastElementType = typeof DEFAULT_TOAST_ELEMENT>(props: ToastProps<E>): React.JSX.Element;
821
+ /** @internal */
822
+ type ToastLayerOwnProps = GapStyleProps & PaddingStyleProps;
823
+ /** @internal */
824
+ type ToastLayerElementType = 'ul' | ComponentType;
825
+ /** @internal */
826
+ type ToastLayerProps<E extends ToastLayerElementType = ToastLayerElementType> = Props<ToastLayerOwnProps, E>;
827
+ /** @public */
828
+ interface ToastProviderProps extends Omit<ToastLayerProps, 'children'> {
829
+ children?: React.ReactNode;
830
+ zOffset?: ResponsiveProp$1<number>;
831
+ }
832
+ /** @public */
833
+ declare function ToastProvider(props: ToastProviderProps): React.JSX.Element;
834
+ /** @public */
835
+ interface ToastParams {
836
+ closable?: boolean;
837
+ description?: ReactNode;
838
+ duration?: number;
839
+ id?: string;
840
+ onClose?: () => void;
841
+ title?: ReactNode;
842
+ status?: 'error' | 'warning' | 'success' | 'info';
843
+ }
844
+ /** @public */
845
+ interface ToastContextValue {
846
+ version: 0.0;
847
+ /**
848
+ * Creates or updates a toast notification.
849
+ * If a toast with the same ID already exists, it will be updated.
850
+ * If an ID is not provided, a random one will be generated.
851
+ * The returned ID can be used to programatically update a toast.
852
+ */
853
+ push: (params: ToastParams) => string;
934
854
  }
935
-
855
+ /** @public */
856
+ declare function useToast(): ToastContextValue;
857
+ /** @public */
858
+ declare const DEFAULT_STACK_ELEMENT = "div";
859
+ /** @public */
860
+ type StackOwnProps = StackStyleProps;
861
+ /** @public */
862
+ type StackElementType = BoxElementType;
863
+ /** @public */
864
+ type StackProps<E extends StackElementType = StackElementType> = Props<StackOwnProps, E>;
936
865
  /**
937
- * @internal
866
+ * The `Stack` component is used to place elements on top of each other.
867
+ *
868
+ * @public
938
869
  */
939
- export declare const _elementSizeObserver: _ElementSizeObserver
940
-
870
+ declare function Stack<E extends StackElementType = typeof DEFAULT_STACK_ELEMENT>(props: StackProps<E>): React.JSX.Element;
871
+ /** @beta */
872
+ declare const DEFAULT_TREE_ELEMENT = "div";
941
873
  /**
942
- * @internal
874
+ * This API might change. DO NOT USE IN PRODUCTION.
875
+ * @beta
876
+ */
877
+ type TreeOwnProps = Omit<StackOwnProps, 'position'>;
878
+ /** @beta */
879
+ type TreeElementType = 'div' | ComponentType;
880
+ /** @beta */
881
+ type TreeProps<E extends TreeElementType = TreeElementType> = Props<TreeOwnProps, E>;
882
+ /**
883
+ * This API might change. DO NOT USE IN PRODUCTION.
884
+ * @beta
943
885
  */
944
- export declare type _ElementSizeSubscriber = (elementRect: ElementSize) => void
945
-
886
+ declare function Tree<E extends TreeElementType = typeof DEFAULT_TREE_ELEMENT>(props: TreeProps<E>): React.JSX.Element;
946
887
  /** @public */
947
- export declare type ElementType<P> = TagType | ComponentType<P>
948
-
888
+ declare const DEFAULT_SELECTABLE_ELEMENT = "button";
949
889
  /** @public */
950
- export declare type EmptyProps = {}
951
-
890
+ interface SelectableOwnProps extends SelectableStyleProps {
891
+ selected?: boolean;
892
+ }
893
+ /** @public */
894
+ type SelectableElementType = 'a' | 'button' | 'span' | ComponentType;
895
+ /** @public */
896
+ type SelectableProps<E extends SelectableElementType = SelectableElementType> = Props<SelectableOwnProps, E>;
897
+ /** @public */
898
+ declare function Selectable<E extends SelectableElementType = typeof DEFAULT_SELECTABLE_ELEMENT>(props: SelectableProps<E>): React.JSX.Element;
899
+ /** @beta */
900
+ declare const DEFAULT_TREE_ITEM_ELEMENT = "a";
901
+ /** @beta */
902
+ type TreeItemOwnProps = SelectableOwnProps & {
903
+ expanded?: boolean;
904
+ fontSize?: ResponsiveProp$1<FontTextSize>;
905
+ icon?: ElementType$1;
906
+ /**
907
+ * Allows passing a custom element type to the link component
908
+ * @internal
909
+ */
910
+ linkAs?: SelectableElementType;
911
+ onClick?: MouseEventHandler<HTMLAnchorElement | HTMLLIElement>;
912
+ padding?: ResponsiveProp$1<Space>;
913
+ gap?: ResponsiveProp$1<Space>; /** @deprecated Use `gap` instead */
914
+ space?: never;
915
+ text?: ReactNode;
916
+ weight?: FontWeight;
917
+ };
918
+ /** @beta */
919
+ type TreeItemElementType = 'a' | 'li' | ComponentType;
920
+ /** @beta */
921
+ type TreeItemProps<E extends TreeItemElementType = TreeItemElementType> = Props<TreeItemOwnProps, E>;
922
+ /**
923
+ * This API might change. DO NOT USE IN PRODUCTION.
924
+ * @beta
925
+ */
926
+ declare function TreeItem<E extends TreeItemElementType = typeof DEFAULT_TREE_ITEM_ELEMENT>(props: TreeItemProps<E>): React.JSX.Element;
952
927
  /**
953
- * DO NOT USE IN PRODUCTION
954
928
  * @beta
955
929
  */
956
- export declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
957
- state: ErrorBoundaryState
958
- static displayName: string
959
- static getDerivedStateFromError(error: Error): ErrorBoundaryState
960
- componentDidCatch(error: Error, info: ErrorInfo): void
961
- render(): ReactNode
930
+ interface TreeState {
931
+ [key: string]: {
932
+ element: HTMLElement;
933
+ expanded: boolean;
934
+ } | undefined;
962
935
  }
963
-
964
936
  /**
965
- * DO NOT USE IN PRODUCTION
966
937
  * @beta
967
938
  */
968
- export declare type ErrorBoundaryProps = PropsWithChildren<{
969
- onCatch: (params: {error: Error; info: ErrorInfo}) => void
970
- }>
971
-
939
+ interface TreeContextValue {
940
+ version: 0.0;
941
+ focusedElement: HTMLElement | null;
942
+ gap: ResponsiveProp$1<Space>;
943
+ level: number;
944
+ path: string[];
945
+ registerItem: (element: HTMLElement, path: string, expanded: boolean, selected: boolean) => void;
946
+ setExpanded: (path: string, expanded: boolean) => void;
947
+ setFocusedElement: (focusedElement: HTMLElement | null) => void;
948
+ state: TreeState;
949
+ }
972
950
  /**
973
- * DO NOT USE IN PRODUCTION
974
951
  * @beta
975
952
  */
976
- export declare interface ErrorBoundaryState {
977
- error: Error | null
953
+ declare function useTree(): TreeContextValue;
954
+ /** @beta */
955
+ declare const DEFAULT_VIRTUAL_LIST_ELEMENT = "div";
956
+ /** @beta */
957
+ interface VirtualListChangeOpts {
958
+ fromIndex: number;
959
+ gap: number;
960
+ itemHeight: number;
961
+ scrollHeight: number;
962
+ scrollTop: number;
963
+ toIndex: number;
964
+ }
965
+ /** @beta */
966
+ interface VirtualListOwnProps<Item = any> {
967
+ gap?: Space;
968
+ getItemKey?: (item: Item, itemIndex: number) => string;
969
+ items?: Item[];
970
+ onChange?: (opts: VirtualListChangeOpts) => void;
971
+ renderItem?: (item: Item) => ReactNode;
978
972
  }
979
-
973
+ /** @beta */
974
+ type VirtualListElementType = 'div' | ComponentType;
975
+ /** @beta */
976
+ type VirtualListProps<E extends VirtualListElementType = VirtualListElementType, Item = any> = Props<VirtualListOwnProps<Item>, E>;
977
+ /** @beta */
978
+ declare function VirtualList<E extends VirtualListElementType = typeof DEFAULT_VIRTUAL_LIST_ELEMENT, Item = any>(props: VirtualListProps<E, Item>): React.JSX.Element;
980
979
  /**
981
- * The `Flex` component is a wrapper component for flexible elements (`Box`, `Card` and `Flex`).
982
- *
983
- * @public
980
+ * @internal
984
981
  */
985
- export declare function Flex<E extends FlexElementType = typeof DEFAULT_FLEX_ELEMENT>(
986
- props: FlexProps<E>,
987
- ): React.JSX.Element
988
-
989
- /** @public */
990
- export declare type FlexElementType = BoxElementType
991
-
992
- /** @public */
993
- export declare type FlexOwnProps = FlexStyleProps
994
-
995
- /** @public */
996
- export declare type FlexProps<E extends FlexElementType = FlexElementType> = Props<FlexOwnProps, E>
997
-
982
+ declare function _raf(fn: () => void): () => void;
998
983
  /**
999
984
  * @internal
1000
985
  */
1001
- export declare function focusFirstDescendant(element: HTMLElement): boolean
1002
-
986
+ declare function _raf2(fn: () => void): () => void;
1003
987
  /**
1004
988
  * @internal
1005
989
  */
1006
- export declare function focusLastDescendant(element: HTMLElement): boolean
1007
-
990
+ declare function _isEnterToClickElement(element: HTMLElement): boolean;
1008
991
  /**
1009
992
  * @internal
1010
993
  */
1011
- export declare function _getResponsiveProp<T>(
1012
- val: ResponsiveProp<T> | undefined,
1013
- defaultVal?: ResponsivePropArray<T>,
1014
- ): ResponsivePropArray<T>
1015
-
994
+ declare function isHTMLElement(node: unknown): node is HTMLElement;
1016
995
  /**
1017
- * The `Grid` component is for building 2-dimensional layers (based on CSS grid).
1018
- *
1019
- * @public
996
+ * @internal
1020
997
  */
1021
- export declare function Grid<E extends GridElementType = typeof DEFAULT_GRID_ELEMENT>(
1022
- props: GridProps<E>,
1023
- ): React.JSX.Element
1024
-
1025
- /** @public */
1026
- export declare type GridElementType = BoxElementType
1027
-
1028
- /** @public */
1029
- export declare type GridOwnProps = GridStyleProps
1030
-
1031
- /** @public */
1032
- export declare type GridProps<E extends GridElementType = GridElementType> = Props<GridOwnProps, E>
1033
-
998
+ declare function isHTMLAnchorElement(element: unknown): element is HTMLAnchorElement;
1034
999
  /**
1035
1000
  * @internal
1036
1001
  */
1037
- export declare function _hasFocus(element: HTMLElement): boolean
1038
-
1002
+ declare function isHTMLInputElement(element: unknown): element is HTMLInputElement;
1039
1003
  /**
1040
- * Typographic headings.
1041
- *
1042
- * @public
1004
+ * @internal
1043
1005
  */
1044
- export declare function Heading<E extends HeadingElementType = typeof DEFAULT_HEADING_ELEMENT>(
1045
- props: HeadingProps<E>,
1046
- ): React.JSX.Element
1047
-
1048
- /** @public */
1049
- export declare type HeadingElementType =
1050
- | 'div'
1051
- | 'h1'
1052
- | 'h2'
1053
- | 'h3'
1054
- | 'h4'
1055
- | 'h5'
1056
- | 'h6'
1057
- | 'label'
1058
- | 'span'
1059
- | ComponentType
1060
-
1061
- /** @public */
1062
- export declare type HeadingOwnProps = HeadingStyleProps & TextOverflowStyleProps
1063
-
1064
- /** @public */
1065
- export declare type HeadingProps<E extends HeadingElementType = HeadingElementType> = Props<
1066
- HeadingOwnProps,
1067
- E
1068
- >
1069
-
1006
+ declare function isHTMLButtonElement(element: unknown): element is HTMLButtonElement;
1070
1007
  /**
1071
- * This API might change. DO NOT USE IN PRODUCTION.
1072
- * @beta
1008
+ * @internal
1073
1009
  */
1074
- export declare function HeadingSkeleton<
1075
- E extends HeadingSkeletonElementType = typeof DEFAULT_HEADING_SKELETON_ELEMENT,
1076
- >(props: HeadingSkeletonProps<E>): React.JSX.Element
1077
-
1078
- /** @beta */
1079
- export declare type HeadingSkeletonElementType = SkeletonElementType
1080
-
1081
- /** @beta */
1082
- export declare type HeadingSkeletonOwnProps = SkeletonOwnProps & {
1083
- size?: ResponsiveProp<FontHeadingSize>
1084
- }
1085
-
1010
+ declare function isHTMLSelectElement(element: unknown): element is HTMLSelectElement;
1086
1011
  /**
1087
- * This API might change. DO NOT USE IN PRODUCTION.
1088
- * @beta
1012
+ * @internal
1089
1013
  */
1090
- export declare type HeadingSkeletonProps<
1091
- E extends HeadingSkeletonElementType = HeadingSkeletonElementType,
1092
- > = Props<HeadingSkeletonOwnProps, E>
1093
-
1014
+ declare function isHTMLTextAreaElement(element: unknown): element is HTMLTextAreaElement;
1094
1015
  /**
1095
- * Represent hotkeys (a keyboard combination) with semantic `<kbd>` elements.
1096
- *
1097
- * @example
1098
- * ```tsx
1099
- * import {Hotkeys} from '@sanity/ui'
1100
- *
1101
- * <Hotkeys keys={['⌘', 'K']} />
1102
- * ```
1103
- *
1104
- * @public
1016
+ * @internal
1105
1017
  */
1106
- export declare function Hotkeys<E extends HotkeysElementType = typeof DEFAULT_HOTKEYS_ELEMENT>(
1107
- props: HotkeysProps<E>,
1108
- ): React.JSX.Element | undefined
1109
-
1110
- /** @public */
1111
- export declare type HotkeysElementType = 'kbd' | ComponentType
1112
-
1113
- /** @public */
1114
- export declare interface HotkeysOwnProps extends GapStyleProps, RadiusStyleProps {
1115
- /** @deprecated No longer supported. */
1116
- fontSize?: never
1117
- /** @deprecated No longer supported. */
1118
- padding?: never
1119
- keys: string[]
1120
- }
1121
-
1122
- /** @public */
1123
- export declare type HotkeysProps<E extends HotkeysElementType = HotkeysElementType> = Props<
1124
- HotkeysOwnProps,
1125
- E
1126
- >
1127
-
1018
+ declare function containsOrEqualsElement(element: HTMLElement, node: Node): boolean;
1128
1019
  /**
1129
- * The `Inline` component is a layout utility for aligning and spacing items horizontally.
1130
- *
1131
- * @public
1020
+ * @internal
1132
1021
  */
1133
- export declare function Inline<E extends InlineElementType = typeof DEFAULT_INLINE_ELEMENT>(
1134
- props: InlineProps<E>,
1135
- ): React.JSX.Element
1136
-
1137
- /** @public */
1138
- export declare function InlineCode(props: InlineCodeProps): React.JSX.Element
1139
-
1140
- /** @public */
1141
- export declare interface InlineCodeProps {
1142
- children: React.ReactNode
1143
- /** Language to use for syntax highlighting. */
1144
- language?: string
1145
- }
1146
-
1147
- /** @public */
1148
- export declare type InlineElementType = BoxElementType
1149
-
1150
- /** @public */
1151
- export declare type InlineOwnProps = InlineStyleProps
1152
-
1153
- /** @public */
1154
- export declare type InlineProps<E extends InlineElementType = InlineElementType> = Props<
1155
- InlineOwnProps,
1156
- E
1157
- >
1158
-
1022
+ declare function _hasFocus(element: HTMLElement): boolean;
1023
+ /**
1024
+ * @internal
1025
+ */
1026
+ declare function isFocusable(element: HTMLElement): boolean;
1159
1027
  /**
1160
1028
  * @internal
1161
1029
  */
1162
- export declare function _isEnterToClickElement(element: HTMLElement): boolean
1163
-
1030
+ declare function attemptFocus(element: HTMLElement): boolean;
1164
1031
  /**
1165
1032
  * @internal
1166
1033
  */
1167
- export declare function isFocusable(element: HTMLElement): boolean
1168
-
1034
+ declare function focusFirstDescendant(element: HTMLElement): boolean;
1169
1035
  /**
1170
1036
  * @internal
1171
1037
  */
1172
- export declare function isHTMLAnchorElement(element: unknown): element is HTMLAnchorElement
1173
-
1038
+ declare function focusLastDescendant(element: HTMLElement): boolean;
1174
1039
  /**
1175
1040
  * @internal
1176
1041
  */
1177
- export declare function isHTMLButtonElement(element: unknown): element is HTMLButtonElement
1178
-
1042
+ declare function _getResponsiveProp<T>(val: ResponsiveProp$1<T> | undefined, defaultVal?: ResponsivePropArray<T>): ResponsivePropArray<T>;
1179
1043
  /**
1180
1044
  * @internal
1181
1045
  */
1182
- export declare function isHTMLElement(node: unknown): node is HTMLElement
1183
-
1046
+ declare function _isScrollable(el: Node): boolean;
1047
+ /** @public */
1048
+ type ClickOutsideEventListener = (event: MouseEvent) => void;
1049
+ /** @public */
1050
+ type ClickOutsideEventElements = (HTMLElement | null | (HTMLElement | null)[])[];
1051
+ /** @public */
1052
+ declare function useClickOutsideEvent(listener: ClickOutsideEventListener | false | undefined, elementsArg?: () => ClickOutsideEventElements, boundaryElement?: () => HTMLElement | null): void;
1053
+ /**
1054
+ * @beta
1055
+ */
1056
+ declare function useCustomValidity(ref: {
1057
+ current: null | {
1058
+ setCustomValidity: (validity: string) => void;
1059
+ };
1060
+ }, customValidity: string | undefined): void;
1061
+ /**
1062
+ * @beta
1063
+ */
1064
+ interface ElementRectValue {
1065
+ width: number;
1066
+ height: number;
1067
+ }
1068
+ /**
1069
+ * @beta
1070
+ */
1071
+ interface ElementSize {
1072
+ content: ElementRectValue;
1073
+ border: ElementRectValue;
1074
+ /** @deprecated INTERNAL ONLY */
1075
+ _contentRect: DOMRectReadOnly;
1076
+ }
1184
1077
  /**
1185
1078
  * @internal
1186
1079
  */
1187
- export declare function isHTMLInputElement(element: unknown): element is HTMLInputElement
1188
-
1080
+ type _ElementSizeSubscriber = (elementRect: ElementSize) => void;
1189
1081
  /**
1190
1082
  * @internal
1191
1083
  */
1192
- export declare function isHTMLSelectElement(element: unknown): element is HTMLSelectElement
1193
-
1084
+ interface _ElementSizeObserver {
1085
+ subscribe: (element: HTMLElement, subscriber: _ElementSizeSubscriber) => () => void;
1086
+ }
1194
1087
  /**
1195
1088
  * @internal
1196
1089
  */
1197
- export declare function isHTMLTextAreaElement(element: unknown): element is HTMLTextAreaElement
1198
-
1090
+ interface _ElementSizeListener {
1091
+ subscribe: (element: HTMLElement, subscriber: _ElementSizeSubscriber) => () => void;
1092
+ }
1199
1093
  /**
1200
1094
  * @internal
1201
1095
  */
1202
- export declare function _isScrollable(el: Node): boolean
1203
-
1096
+ declare const _elementSizeObserver: _ElementSizeObserver;
1204
1097
  /**
1205
- * Used to define some text as keyboard input.
1098
+ * Subscribe to the size of a DOM element.
1099
+ * @beta
1100
+ */
1101
+ declare function useElementSize(element: HTMLElement | null): ElementSize | null;
1102
+ /**
1103
+ * Adds global keydown event listener to the window.
1206
1104
  *
1207
- * @public
1105
+ * @param onKeyDown - The function to call when a keydown event is triggered.
1106
+ * @param options - The options to pass to the addEventListener function (example, capture: true)
1107
+ * @beta
1208
1108
  */
1209
- export declare function KBD<E extends KBDElementType = typeof DEFAULT_KBD_ELEMENT>(
1210
- props: KBDProps<E>,
1211
- ): React.JSX.Element
1212
-
1213
- /** @public */
1214
- export declare type KBDElementType = 'kbd' | ComponentType
1215
-
1216
- /** @public */
1217
- export declare type KBDOwnProps = KBDStyleProps
1218
-
1219
- /** @public */
1220
- export declare type KBDProps<E extends KBDElementType = KBDElementType> = Props<KBDOwnProps, E>
1221
-
1109
+ declare function useGlobalKeyDown(onKeyDown: (event: KeyboardEvent) => void, options?: AddEventListenerOptions): void;
1222
1110
  /**
1223
- * Typographic labels.
1111
+ * Efficiently subscribes to `window.matchMedia` queries
1112
+ *
1113
+ * @param getServerSnapshot - Only called during server-side rendering, and hydration if using hydrateRoot. Required if the hook is called during SSR (https://dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
1224
1114
  *
1225
1115
  * @public
1226
1116
  */
1227
- export declare function Label<E extends LabelElementType = typeof DEFAULT_LABEL_ELEMENT>(
1228
- props: LabelProps<E>,
1229
- ): React.JSX.Element
1230
-
1231
- /** @public */
1232
- export declare type LabelElementType =
1233
- | 'div'
1234
- | 'h1'
1235
- | 'h2'
1236
- | 'h3'
1237
- | 'h4'
1238
- | 'h5'
1239
- | 'h6'
1240
- | 'label'
1241
- | 'li'
1242
- | 'p'
1243
- | 'span'
1244
- | ComponentType
1245
-
1246
- /** @public */
1247
- export declare type LabelOwnProps = LabelStyleProps & TextOverflowStyleProps
1248
-
1249
- /** @public */
1250
- export declare type LabelProps<E extends LabelElementType = LabelElementType> = Props<
1251
- LabelOwnProps,
1252
- E
1253
- >
1254
-
1117
+ declare function useMatchMedia(mediaQueryString: `(${string})`, getServerSnapshot?: () => boolean): boolean;
1255
1118
  /**
1256
- * This API might change. DO NOT USE IN PRODUCTION.
1257
- * @beta
1119
+ * @internal
1258
1120
  */
1259
- export declare function LabelSkeleton<
1260
- E extends LabelSkeletonElementType = typeof DEFAULT_LABEL_SKELETON_ELEMENT,
1261
- >(props: LabelSkeletonProps<E>): React.JSX.Element
1262
-
1263
- /** @beta */
1264
- export declare type LabelSkeletonElementType = SkeletonElementType
1265
-
1266
- /** @beta */
1267
- export declare type LabelSkeletonOwnProps = SkeletonOwnProps & {
1268
- size?: ResponsiveProp<FontLabelSize>
1121
+ interface _MediaStore {
1122
+ subscribe: (onStoreChange: () => void) => () => void;
1123
+ getSnapshot: () => Breakpoint;
1269
1124
  }
1270
-
1271
1125
  /**
1272
1126
  * This API might change. DO NOT USE IN PRODUCTION.
1273
1127
  * @beta
1274
1128
  */
1275
- export declare type LabelSkeletonProps<
1276
- E extends LabelSkeletonElementType = LabelSkeletonElementType,
1277
- > = Props<LabelSkeletonOwnProps, E>
1278
-
1279
- /** @public */
1280
- export declare function Layer<E extends LayerElementType = typeof DEFAULT_LAYER_ELEMENT>(
1281
- props: LayerProps<E>,
1282
- ): React.JSX.Element
1283
-
1284
- /** @public */
1285
- export declare interface LayerContextValue {
1286
- version: 0.0
1287
- isTopLayer: boolean
1288
- level?: number
1289
- registerChild: (childLevel?: number) => () => void
1290
- size: number
1291
- zIndex: number
1129
+ declare function useMediaIndex(): Breakpoint;
1130
+ /**
1131
+ * Returns true if a dark color scheme is preferred, false if a light color scheme is preferred or the preference is not known.
1132
+ *
1133
+ * @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://dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
1134
+ *
1135
+ * If you persist the detected preference in a cookie or a header then you may implement your own server snapshot to read it.
1136
+ * 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
1137
+ * @example https://gist.github.com/stipsan/13c0cccf8dfc34f4b44bb1b984baf7df
1138
+ *
1139
+ * @public
1140
+ */
1141
+ declare function usePrefersDark(getServerSnapshot?: () => boolean): boolean;
1142
+ /**
1143
+ * Returns true if motion should be reduced
1144
+ *
1145
+ * @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-reduced-motion: no-preference)` since it's the most common scheme (https://dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
1146
+ *
1147
+ * If you persist the detected preference in a cookie or a header then you may implement your own server snapshot to read it.
1148
+ * Chrome supports reading the `prefers-reduced-motion` media query from a header if the server response: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Sec-CH-Prefers-Reduced-Motion
1149
+ * @example https://gist.github.com/stipsan/0c0f839a27842249cada893e9fb7767b
1150
+ *
1151
+ * @public
1152
+ */
1153
+ declare function usePrefersReducedMotion(getServerSnapshot?: () => boolean): boolean;
1154
+ interface SyntaxProps {
1155
+ language?: string;
1156
+ value: React.ReactNode;
1292
1157
  }
1293
-
1158
+ declare function Syntax(props: SyntaxProps): React.JSX.Element;
1159
+ /** @internal */
1160
+ declare const LazySyntax: _$react.LazyExoticComponent<typeof Syntax>;
1294
1161
  /** @public */
1295
- export declare type LayerElementType = CardElementType
1296
-
1162
+ type AvatarPosition = 'top' | 'bottom' | 'inside';
1297
1163
  /** @public */
1298
- export declare interface LayerOwnProps extends CardOwnProps {
1299
- /** A callback that fires when the layer becomes the top layer when it was not the top layer before. */
1300
- onActivate?: (props: {activeElement: HTMLElement | null}) => void
1301
- zOffset?: ResponsiveProp<number>
1164
+ declare const DEFAULT_AVATAR_ELEMENT = "span";
1165
+ /** @public */
1166
+ interface AvatarOwnProps {
1167
+ /** @beta */
1168
+ __unstable_hideInnerStroke?: boolean;
1169
+ animateArrowFrom?: AvatarPosition;
1170
+ arrowPosition?: AvatarPosition;
1171
+ color?: AvatarColor;
1172
+ initials?: string;
1173
+ onImageLoadError?: (event: Error) => void;
1174
+ size?: ResponsiveProp$1<AvatarSize>;
1175
+ src?: string;
1176
+ title?: string;
1302
1177
  }
1303
-
1304
1178
  /** @public */
1305
- export declare type LayerProps<E extends LayerElementType = LayerElementType> = Props<
1306
- LayerOwnProps,
1307
- E
1308
- >
1309
-
1179
+ type AvatarElementType = 'a' | 'button' | 'div' | 'span' | ComponentType;
1180
+ /** @public */
1181
+ type AvatarProps<E extends AvatarElementType = AvatarElementType> = Props<AvatarOwnProps, E>;
1182
+ /**
1183
+ * Avatars are used to represent people and other agents (e.g. bots).
1184
+ *
1185
+ * @public
1186
+ */
1187
+ declare function Avatar<E extends AvatarElementType = typeof DEFAULT_AVATAR_ELEMENT>(props: AvatarProps<E>): React.JSX.Element;
1310
1188
  /** @public */
1311
- export declare function LayerProvider(props: LayerProviderProps): React.JSX.Element
1312
-
1189
+ declare const DEFAULT_AVATAR_COUNTER_ELEMENT = "span";
1313
1190
  /** @public */
1314
- export declare interface LayerProviderProps {
1315
- children?: ReactNode
1316
- zOffset?: ResponsiveProp<number>
1191
+ interface AvatarCounterOwnProps {
1192
+ count: number;
1193
+ size?: ResponsiveProp$1<AvatarSize>;
1317
1194
  }
1318
-
1319
- /** @internal */
1320
- export declare const LazySyntax: LazyExoticComponent<Syntax>
1321
-
1195
+ /** @public */
1196
+ type AvatarCounterElementType = 'button' | 'div' | 'span' | ComponentType;
1197
+ /** @public */
1198
+ type AvatarCounterProps<E extends AvatarCounterElementType = AvatarCounterElementType> = Props<AvatarCounterOwnProps, E>;
1199
+ /** @public */
1200
+ declare function AvatarCounter<E extends AvatarCounterElementType = typeof DEFAULT_AVATAR_COUNTER_ELEMENT>(props: AvatarCounterProps<E>): React.JSX.Element;
1201
+ /** @public */
1202
+ declare const DEFAULT_AVATAR_STACK_ELEMENT = "span";
1203
+ /** @public */
1204
+ type AvatarStackChild = ReactElement<AvatarProps<'div'>> | null | undefined | false;
1205
+ /** @public */
1206
+ type AvatarStackOwnProps = Omit<BoxOwnProps, 'align' | 'alignItems' | 'display' | 'justify' | 'justifyContent'> & {
1207
+ children: AvatarStackChild | AvatarStackChild[];
1208
+ maxLength?: number;
1209
+ size?: ResponsiveProp$1<AvatarSize>;
1210
+ };
1211
+ /** @public */
1212
+ type AvatarStackElementType = 'div' | 'span' | ComponentType;
1213
+ /** @public */
1214
+ type AvatarStackProps<E extends AvatarStackElementType = AvatarStackElementType> = Props<AvatarStackOwnProps, E>;
1215
+ /** @public */
1216
+ declare function AvatarStack<E extends AvatarStackElementType = typeof DEFAULT_AVATAR_STACK_ELEMENT>(props: AvatarStackProps<E>): React.JSX.Element;
1217
+ /** @public */
1218
+ declare const DEFAULT_BADGE_ELEMENT = "span";
1219
+ /** @public */
1220
+ interface BadgeOwnProps extends BadgeStyleProps {
1221
+ fontSize?: ResponsiveProp$1<FontTextSize>;
1222
+ }
1223
+ /** @public */
1224
+ type BadgeElementType = 'div' | 'span' | ComponentType;
1225
+ /** @public */
1226
+ type BadgeProps<E extends BadgeElementType = BadgeElementType> = Props<BadgeOwnProps, E>;
1322
1227
  /**
1323
- * @internal
1228
+ * Badges are used to tag resources.
1229
+ *
1230
+ * @public
1324
1231
  */
1325
- export declare interface _MediaStore {
1326
- subscribe: (onStoreChange: () => void) => () => void
1327
- getSnapshot: () => Breakpoint
1232
+ declare function Badge<E extends BadgeElementType = typeof DEFAULT_BADGE_ELEMENT>(props: BadgeProps<E>): React.JSX.Element;
1233
+ /** @public */
1234
+ type ButtonTextAlign = 'left' | 'right' | 'center';
1235
+ /** @public */
1236
+ declare function CardProvider(props: {
1237
+ children?: ReactNode;
1238
+ tone: CardTone;
1239
+ scheme: ColorScheme;
1240
+ }): React.JSX.Element;
1241
+ /** @public */
1242
+ interface CardContextValue {
1243
+ tone: CardTone;
1244
+ scheme: ColorScheme;
1245
+ }
1246
+ /** @internal */
1247
+ type _CardCompatProviderComponent = ComponentType$1<{
1248
+ children?: ReactNode;
1249
+ tone: CardTone | 'inherit';
1250
+ scheme: ColorScheme;
1251
+ }>;
1252
+ /** @internal */
1253
+ interface _CardInternalContextValue {
1254
+ CompatProvider?: _CardCompatProviderComponent;
1255
+ root: boolean;
1328
1256
  }
1329
-
1257
+ /** @public */
1258
+ declare function useCard(): CardContextValue;
1259
+ /** @public */
1260
+ declare const DEFAULT_CHECKBOX_ELEMENT = "input";
1261
+ /** @public */
1262
+ type CheckboxOwnProps = {
1263
+ indeterminate?: boolean;
1264
+ customValidity?: string;
1265
+ };
1266
+ /** @public */
1267
+ type CheckboxElementType = 'input' | ComponentType;
1268
+ /** @public */
1269
+ type CheckboxProps<E extends CheckboxElementType = CheckboxElementType> = Props<CheckboxOwnProps, E>;
1330
1270
  /**
1331
- * The `Menu` component is a building block for application menus.
1271
+ * Checkboxes allow the user to select one or more items from a set.
1332
1272
  *
1333
1273
  * @public
1334
1274
  */
1335
- export declare function Menu<E extends MenuElementType = typeof DEFAULT_MENU_ELEMENT>(
1336
- props: MenuProps<E>,
1337
- ): React.JSX.Element
1338
-
1275
+ declare function Checkbox<E extends CheckboxElementType = typeof DEFAULT_CHECKBOX_ELEMENT>(props: CheckboxProps<E>): React.JSX.Element;
1276
+ /** @public */
1277
+ declare const DEFAULT_CODE_ELEMENT = "pre";
1278
+ /** @public */
1279
+ type CodeOwnProps = CodeStyleProps & {
1280
+ /** Define the language to use for syntax highlighting. */language?: string;
1281
+ };
1282
+ /** @public */
1283
+ type CodeElementType = 'div' | 'pre' | ComponentType;
1284
+ /** @public */
1285
+ type CodeProps<E extends CodeElementType = CodeElementType> = Props<CodeOwnProps, E>;
1286
+ /** @public */
1287
+ declare function Code<E extends CodeElementType = typeof DEFAULT_CODE_ELEMENT>(props: CodeProps<E>): React.JSX.Element;
1288
+ /** @public */
1289
+ declare const DEFAULT_CONTAINER_ELEMENT = "div";
1290
+ /** @public */
1291
+ type ContainerOwnProps = ContainerStyleProps;
1292
+ /** @public */
1293
+ type ContainerElementType = BoxElementType;
1294
+ /** @public */
1295
+ type ContainerProps<E extends ContainerElementType = ContainerElementType> = Props<ContainerOwnProps, E>;
1339
1296
  /**
1340
- * The `MenuButton` component follows the WAI-ARIA specification for menu buttons.
1297
+ * The `Container` component wraps content layout in a defined set of widths.
1341
1298
  *
1342
1299
  * @public
1343
1300
  */
1344
- export declare function MenuButton(props: MenuButtonProps): React.JSX.Element
1345
-
1346
- /** @public */
1347
- export declare type MenuButtonProps = {
1348
- /**
1349
- * @beta Do not use in production.
1350
- */
1351
- __unstable_disableRestoreFocusOnClose?: boolean
1352
- button: ReactElement<ButtonProps>
1353
- id: string
1354
- menu?: ReactElement
1355
- onClose?: () => void
1356
- onOpen?: () => void
1357
- popover?: Omit<PopoverProps, 'content' | 'open'>
1358
- ref?: ForwardedRef<HTMLButtonElement | null>
1359
- }
1360
-
1361
- /** @public */
1362
- export declare function MenuDivider<
1363
- E extends MenuDividerElementType = typeof DEFAULT_MENU_DIVIDER_ELEMENT,
1364
- >(props: MenuDividerProps<E>): React.JSX.Element
1365
-
1366
- /** @public */
1367
- export declare type MenuDividerElementType = 'div' | 'hr' | 'span' | ComponentType
1368
-
1369
- /** @public */
1370
- export declare type MenuDividerOwnProps = {}
1371
-
1372
- /** @public */
1373
- export declare type MenuDividerProps<E extends MenuDividerElementType = MenuDividerElementType> =
1374
- Props<MenuDividerOwnProps, E>
1375
-
1376
- /** @public */
1377
- export declare type MenuElementType = 'div' | 'span' | ComponentType
1378
-
1379
- /** @public */
1380
- export declare function MenuGroup<
1381
- E extends MenuGroupElementType = typeof DEFAULT_MENU_GROUP_ELEMENT,
1382
- >(props: MenuGroupProps<E>): React.JSX.Element
1383
-
1384
- /** @public */
1385
- export declare type MenuGroupElementType = 'button' | ComponentType
1386
-
1387
- /** @public */
1388
- export declare type MenuGroupOwnProps = RadiusStyleProps & {
1389
- disabled?: boolean
1390
- fontSize?: ResponsiveProp<FontTextSize>
1391
- gap?: ResponsiveProp<Space>
1392
- icon?: ElementType_2 | ReactNode
1393
- menu?: Omit<
1394
- MenuProps<typeof DEFAULT_MENU_ELEMENT>,
1395
- | 'onClickOutside'
1396
- | 'onEscape'
1397
- | 'onItemClick'
1398
- | 'onKeyDown'
1399
- | 'onMouseEnter'
1400
- | 'registerElement'
1401
- | 'shouldFocus'
1402
- | 'onBlurCapture'
1403
- >
1404
- padding?: ResponsiveProp<Space>
1405
- popover?: Omit<PopoverProps, 'content' | 'open'>
1406
- text?: ReactNode
1407
- tone?: ElementTone
1408
- }
1409
-
1410
- /** @public */
1411
- export declare type MenuGroupProps<E extends MenuGroupElementType = MenuGroupElementType> = Props<
1412
- MenuGroupOwnProps,
1413
- E
1414
- >
1415
-
1416
- /** @public */
1417
- export declare function MenuItem<E extends MenuItemElementType = typeof DEFAULT_MENU_ITEM_ELEMENT>(
1418
- props: MenuItemProps<E>,
1419
- ): React.JSX.Element
1420
-
1421
- /** @public */
1422
- export declare type MenuItemElementType = 'button' | 'a' | ComponentType
1423
-
1424
- /** @public */
1425
- export declare type MenuItemOwnProps = GapStyleProps &
1426
- PaddingStyleProps &
1427
- RadiusStyleProps & {
1428
- disabled?: boolean
1429
- fontSize?: ResponsiveProp<FontTextSize>
1430
- hotkeys?: string[]
1431
- icon?: ElementType_2 | ReactNode
1432
- iconRight?: ElementType_2 | ReactNode
1433
- pressed?: boolean
1434
- selected?: boolean
1435
- text?: ReactNode
1436
- tone?: ElementTone
1437
- }
1438
-
1439
- /** @public */
1440
- export declare type MenuItemProps<E extends MenuItemElementType = MenuItemElementType> = Props<
1441
- MenuItemOwnProps,
1442
- E
1443
- >
1444
-
1445
- /** @public */
1446
- export declare type MenuOwnProps = PaddingStyleProps & {
1447
- 'gap'?: ResponsiveProp<Space>
1448
- 'onClickOutside'?: (event: MouseEvent) => void
1449
- 'onEscape'?: () => void
1450
- 'onItemClick'?: (event: React.MouseEvent<HTMLButtonElement>) => void
1451
- 'onItemSelect'?: (index: number) => void
1452
- 'originElement'?: HTMLElement | null
1453
- 'registerElement'?: (el: HTMLElement) => () => void
1454
- 'shouldFocus'?: 'first' | 'last' | null
1455
- 'aria-labelledby'?: string
1301
+ declare function Container<E extends ContainerElementType = typeof DEFAULT_CONTAINER_ELEMENT>(props: ContainerProps<E>): React.JSX.Element;
1302
+ /**
1303
+ * @internal
1304
+ */
1305
+ interface ResponsiveWidthStyleProps {
1306
+ $width: (number | 'auto')[];
1456
1307
  }
1457
-
1458
1308
  /** @public */
1459
- export declare type MenuProps<E extends MenuElementType = MenuElementType> = Props<MenuOwnProps, E>
1460
-
1309
+ declare const DEFAULT_GRID_ELEMENT = "div";
1310
+ /** @public */
1311
+ type GridOwnProps = GridStyleProps;
1312
+ /** @public */
1313
+ type GridElementType = BoxElementType;
1314
+ /** @public */
1315
+ type GridProps<E extends GridElementType = GridElementType> = Props<GridOwnProps, E>;
1461
1316
  /**
1462
- * Placement of floating UI elements.
1317
+ * The `Grid` component is for building 2-dimensional layers (based on CSS grid).
1463
1318
  *
1464
1319
  * @public
1465
1320
  */
1466
- export declare type Placement =
1467
- | 'top'
1468
- | 'top-start'
1469
- | 'top-end'
1470
- | 'right'
1471
- | 'right-start'
1472
- | 'right-end'
1473
- | 'bottom'
1474
- | 'bottom-start'
1475
- | 'bottom-end'
1476
- | 'left'
1477
- | 'left-start'
1478
- | 'left-end'
1479
-
1321
+ declare function Grid<E extends GridElementType = typeof DEFAULT_GRID_ELEMENT>(props: GridProps<E>): React.JSX.Element;
1322
+ /** @public */
1323
+ declare const DEFAULT_HEADING_ELEMENT = "div";
1324
+ /** @public */
1325
+ type HeadingOwnProps = HeadingStyleProps & TextOverflowStyleProps;
1326
+ /** @public */
1327
+ type HeadingElementType = 'div' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'label' | 'span' | ComponentType;
1328
+ /** @public */
1329
+ type HeadingProps<E extends HeadingElementType = HeadingElementType> = Props<HeadingOwnProps, E>;
1480
1330
  /**
1481
- * The `Popover` component is used to display some content on top of another.
1331
+ * Typographic headings.
1482
1332
  *
1483
1333
  * @public
1484
1334
  */
1485
- export declare function Popover(props: PopoverProps): React.JSX.Element
1486
-
1335
+ declare function Heading<E extends HeadingElementType = typeof DEFAULT_HEADING_ELEMENT>(props: HeadingProps<E>): React.JSX.Element;
1487
1336
  /** @public */
1488
- export declare type PopoverElementType = 'div'
1489
-
1490
- /** @internal */
1491
- declare interface PopoverLayerOwnProps extends LayerOwnProps {
1492
- /**
1493
- * Whether the popover should animate in and out.
1494
- *
1495
- * @beta
1496
- * @defaultValue false
1497
- */
1498
- animate?: boolean
1499
- children?: React.ReactNode
1500
- originX?: number
1501
- originY?: number
1502
- referenceWidth?: number
1503
- strategy?: Strategy
1504
- x?: number
1505
- y?: number
1506
- }
1507
-
1337
+ declare const DEFAULT_INLINE_ELEMENT = "div";
1338
+ /** @public */
1339
+ type InlineOwnProps = InlineStyleProps;
1508
1340
  /** @public */
1509
- declare type PopoverLayerProps = Assign<HTMLMotionProps<'div'>, PopoverLayerOwnProps>
1510
-
1341
+ type InlineElementType = BoxElementType;
1342
+ /** @public */
1343
+ type InlineProps<E extends InlineElementType = InlineElementType> = Props<InlineOwnProps, E>;
1511
1344
  /**
1512
- * @beta
1345
+ * The `Inline` component is a layout utility for aligning and spacing items horizontally.
1346
+ *
1347
+ * @public
1513
1348
  */
1514
- export declare type PopoverMargins = [number, number, number, number]
1515
-
1349
+ declare function Inline<E extends InlineElementType = typeof DEFAULT_INLINE_ELEMENT>(props: InlineProps<E>): React.JSX.Element;
1516
1350
  /** @public */
1517
- export declare type PopoverOwnProps = Omit<PopoverLayerOwnProps, 'maxWidth'> & {
1518
- /** @beta */
1519
- __unstable_distance?: number
1520
- /**
1521
- * @beta
1522
- * @deprecated Will be removed in the next major version */
1523
- __unstable_margins?: PopoverMargins
1524
- /** @beta */
1525
- __unstable_shift?: number
1526
- /**
1527
- * @deprecated Will be removed in the next major version
1528
- */
1529
- arrow?: boolean
1530
- children?: ReactElement<{
1531
- ref: ForwardedRef<HTMLElement>
1532
- }>
1533
- /**
1534
- * When `true`, prevent overflow within the current boundary:
1535
- * - by flipping on its side axis
1536
- * - by resizing
1537
- *
1538
- * Note that:
1539
- * - setting `preventOverflow` to `true` also prevents overflow on its side axis
1540
- * - setting `matchReferenceWidth` to `true` also causes the popover to resize
1541
- *
1542
- * @defaultValue false
1543
- */
1544
- constrainSize?: boolean
1545
- content?: ReactNode
1546
- disabled?: boolean
1547
- fallbackPlacements?: Placement[]
1548
- floatingBoundary?: HTMLElement | null
1549
- /**
1550
- * When `true`, set the maximum width to match the reference element, and also prevent overflow within
1551
- * the current boundary by resizing.
1552
- *
1553
- * Note that setting `constrainSize` to `true` also causes the popover to resize
1554
- *
1555
- * @defaultValue false
1556
- */
1557
- matchReferenceWidth?: boolean
1558
- /**
1559
- * When true, blocks all pointer interaction with elements beneath the popover until closed.
1560
- *
1561
- * @beta
1562
- * @defaultValue false
1563
- */
1564
- modal?: boolean
1565
- open?: boolean
1566
- placement?: Placement
1567
- /**
1568
- * When 'flip' (default), the placement is determined from the initial placement and the
1569
- * fallback placements in order. Whichever fits in the viewport first.
1570
- *
1571
- * When 'autoPlacement', the initial placement and all fallback placements are evaluated
1572
- * and the placement with the most viewport space available.
1573
- *
1574
- * Option is only relevant if either `constrainSize` or `preventOverflow` is `true`
1575
- */
1576
- placementStrategy?: 'flip' | 'autoPlacement'
1577
- /** Whether or not to render the popover in a portal element. */
1578
- portal?: boolean | string
1579
- preventOverflow?: boolean
1580
- referenceBoundary?: HTMLElement | null
1581
- /**
1582
- * When defined, the popover will be positioned relative to this element.
1583
- * The children of the popover won't be rendered.
1584
- */
1585
- referenceElement?: HTMLElement | null
1586
- /** @beta */
1587
- updateRef?: Ref<PopoverUpdateCallback | undefined>
1588
- width?: ResponsiveProp<MaxWidth>
1589
- }
1590
-
1351
+ declare const DEFAULT_KBD_ELEMENT = "kbd";
1591
1352
  /** @public */
1592
- export declare type PopoverProps = Assign<PopoverLayerProps, PopoverOwnProps>
1593
-
1594
- /** @beta */
1595
- export declare type PopoverUpdateCallback = () => void
1596
-
1353
+ type KBDOwnProps = KBDStyleProps;
1354
+ /** @public */
1355
+ type KBDElementType = 'kbd' | ComponentType;
1356
+ /** @public */
1357
+ type KBDProps<E extends KBDElementType = KBDElementType> = Props<KBDOwnProps, E>;
1358
+ /**
1359
+ * Used to define some text as keyboard input.
1360
+ *
1361
+ * @public
1362
+ */
1363
+ declare function KBD<E extends KBDElementType = typeof DEFAULT_KBD_ELEMENT>(props: KBDProps<E>): React.JSX.Element;
1597
1364
  /** @public */
1598
- export declare type PopoverWidth = Exclude<ContainerWidth, 'auto'>
1599
-
1365
+ declare const DEFAULT_LABEL_ELEMENT = "div";
1600
1366
  /** @public */
1601
- export declare function Portal(props: PortalProps): ReactPortal | null
1602
-
1367
+ type LabelOwnProps = LabelStyleProps & TextOverflowStyleProps;
1603
1368
  /** @public */
1604
- export declare interface PortalContextValue {
1605
- version: 0.0
1606
- boundaryElement: HTMLElement | null
1607
- element: HTMLElement | null
1608
- elements?: Record<string, HTMLElement | null | undefined>
1609
- }
1610
-
1369
+ type LabelElementType = 'div' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'label' | 'li' | 'p' | 'span' | ComponentType;
1611
1370
  /** @public */
1612
- export declare interface PortalProps {
1613
- children: ReactNode
1614
- /**
1615
- * @beta This API might change. DO NOT USE IN PRODUCTION.
1616
- */
1617
- __unstable_name?: string
1371
+ type LabelProps<E extends LabelElementType = LabelElementType> = Props<LabelOwnProps, E>;
1372
+ /**
1373
+ * Typographic labels.
1374
+ *
1375
+ * @public
1376
+ */
1377
+ declare function Label<E extends LabelElementType = typeof DEFAULT_LABEL_ELEMENT>(props: LabelProps<E>): React.JSX.Element;
1378
+ /** @public */
1379
+ interface LayerProviderProps {
1380
+ children?: ReactNode;
1381
+ zOffset?: ResponsiveProp$1<number>;
1618
1382
  }
1619
-
1620
1383
  /** @public */
1621
- export declare function PortalProvider(props: PortalProviderProps): React.JSX.Element
1622
-
1384
+ declare function LayerProvider(props: LayerProviderProps): React.JSX.Element;
1623
1385
  /** @public */
1624
- export declare interface PortalProviderProps {
1625
- children: ReactNode
1626
- element?: HTMLElement | null
1627
- /**
1628
- * @beta
1629
- */
1630
- __unstable_elements?: Record<string, HTMLElement | null | undefined>
1386
+ interface LayerContextValue {
1387
+ version: 0.0;
1388
+ isTopLayer: boolean;
1389
+ level?: number;
1390
+ registerChild: (childLevel?: number) => () => void;
1391
+ size: number;
1392
+ zIndex: number;
1631
1393
  }
1632
-
1633
1394
  /** @public */
1634
- export declare type Props<P extends EmptyProps, E extends ElementType<P>> = Assign<
1635
- E extends TagType ? React.JSX.IntrinsicElements[E] : React.ComponentProps<E>,
1636
- P & {
1637
- as?: E
1638
- }
1639
- >
1640
-
1395
+ declare function useLayer(): LayerContextValue;
1396
+ /** @public */
1397
+ declare const DEFAULT_RADIO_ELEMENT = "input";
1398
+ /** @public */
1399
+ type RadioOwnProps = {
1400
+ customValidity?: string;
1401
+ };
1402
+ /** @public */
1403
+ type RadioElementType = 'input' | ComponentType;
1404
+ /** @public */
1405
+ type RadioProps<E extends RadioElementType = RadioElementType> = Props<RadioOwnProps, E>;
1641
1406
  /**
1642
1407
  * The `Radio` component allows the user to select one option from a set.
1643
1408
  *
1644
1409
  * @public
1645
1410
  */
1646
- export declare function Radio<E extends RadioElementType = typeof DEFAULT_RADIO_ELEMENT>(
1647
- props: RadioProps<E>,
1648
- ): React.JSX.Element
1649
-
1411
+ declare function Radio<E extends RadioElementType = typeof DEFAULT_RADIO_ELEMENT>(props: RadioProps<E>): React.JSX.Element;
1650
1412
  /** @public */
1651
- export declare type RadioElementType = 'input' | ComponentType
1652
-
1413
+ declare const DEFAULT_SELECT_ELEMENT = "select";
1653
1414
  /** @public */
1654
- export declare type RadioOwnProps = {
1655
- customValidity?: string
1656
- }
1657
-
1415
+ type SelectOwnProps = SelectStyleProps & {
1416
+ customValidity?: string;
1417
+ readOnly?: boolean;
1418
+ };
1658
1419
  /** @public */
1659
- export declare type RadioProps<E extends RadioElementType = RadioElementType> = Props<
1660
- RadioOwnProps,
1661
- E
1662
- >
1663
-
1420
+ type SelectElementType = 'select' | ComponentType;
1421
+ /** @public */
1422
+ type SelectProps<E extends SelectElementType = SelectElementType> = Props<SelectOwnProps, E>;
1423
+ /**
1424
+ * The `Select` component provides control of options.
1425
+ *
1426
+ * @public
1427
+ */
1428
+ declare function Select<E extends SelectElementType = typeof DEFAULT_SELECT_ELEMENT>(props: SelectProps<E>): React.JSX.Element;
1429
+ /** @beta */
1430
+ declare const DEFAULT_SKELETON_ELEMENT = "div";
1431
+ /**
1432
+ * This API might change. DO NOT USE IN PRODUCTION.
1433
+ * @beta
1434
+ */
1435
+ type SkeletonOwnProps = SkeletonStyleProps & {
1436
+ animated?: boolean;
1437
+ delay?: number;
1438
+ };
1439
+ /** @beta */
1440
+ type SkeletonElementType = 'div' | 'span' | ComponentType;
1441
+ /** @beta */
1442
+ type SkeletonProps<E extends SkeletonElementType = SkeletonElementType> = Props<SkeletonOwnProps, E>;
1443
+ /**
1444
+ * This API might change. DO NOT USE IN PRODUCTION.
1445
+ * @beta
1446
+ */
1447
+ declare function Skeleton<E extends SkeletonElementType = typeof DEFAULT_SKELETON_ELEMENT>(props: SkeletonProps<E>): React.JSX.Element;
1448
+ /** @beta */
1449
+ declare const DEFAULT_CODE_SKELETON_ELEMENT = "div";
1450
+ /** @beta */
1451
+ type CodeSkeletonOwnProps = SkeletonOwnProps & {
1452
+ size?: ResponsiveProp$1<FontCodeSize>;
1453
+ };
1454
+ /** @beta */
1455
+ type CodeSkeletonElementType = SkeletonElementType;
1664
1456
  /**
1665
- * @internal
1457
+ * This API might change. DO NOT USE IN PRODUCTION.
1458
+ * @beta
1666
1459
  */
1667
- export declare function _raf(fn: () => void): () => void
1668
-
1460
+ type CodeSkeletonProps<E extends CodeSkeletonElementType = CodeSkeletonElementType> = Props<CodeSkeletonOwnProps, E>;
1669
1461
  /**
1670
- * @internal
1462
+ * This API might change. DO NOT USE IN PRODUCTION.
1463
+ * @beta
1671
1464
  */
1672
- export declare function _raf2(fn: () => void): () => void
1673
-
1465
+ declare function CodeSkeleton<E extends CodeSkeletonElementType = typeof DEFAULT_CODE_SKELETON_ELEMENT>(props: CodeSkeletonProps<E>): React.JSX.Element;
1466
+ /** @beta */
1467
+ declare const DEFAULT_HEADING_SKELETON_ELEMENT = "div";
1468
+ /** @beta */
1469
+ type HeadingSkeletonOwnProps = SkeletonOwnProps & {
1470
+ size?: ResponsiveProp$1<FontHeadingSize>;
1471
+ };
1472
+ /** @beta */
1473
+ type HeadingSkeletonElementType = SkeletonElementType;
1674
1474
  /**
1675
- * @internal
1475
+ * This API might change. DO NOT USE IN PRODUCTION.
1476
+ * @beta
1676
1477
  */
1677
- export declare interface ResponsiveWidthStyleProps {
1678
- $width: (number | 'auto')[]
1679
- }
1680
-
1478
+ type HeadingSkeletonProps<E extends HeadingSkeletonElementType = HeadingSkeletonElementType> = Props<HeadingSkeletonOwnProps, E>;
1681
1479
  /**
1682
- * The `Root` component.
1683
- *
1684
- * @public
1480
+ * This API might change. DO NOT USE IN PRODUCTION.
1481
+ * @beta
1685
1482
  */
1686
- export declare function Root<E extends RootElementType = typeof DEFAULT_ROOT_ELEMENT>(
1687
- props: RootProps<E>,
1688
- ): React.JSX.Element
1689
-
1690
- /** @public */
1691
- export declare type RootElementType = 'html' | 'div'
1692
-
1693
- /** @public */
1694
- export declare type RootOwnProps = RootStyleProps
1695
-
1696
- /** @public */
1697
- export declare type RootProps<E extends RootElementType = RootElementType> = Props<RootOwnProps, E>
1698
-
1699
- /** @public */
1700
- export declare function RootProvider(props: RootProviderProps): React.JSX.Element
1701
-
1702
- /** @public */
1703
- export declare interface RootProviderProps {
1704
- boundaryElement: HTMLElement | null
1705
- children?: ReactNode
1706
- portalElement: HTMLElement | null
1707
- scheme: ColorScheme
1708
- tone: CardTone
1709
- }
1710
-
1483
+ declare function HeadingSkeleton<E extends HeadingSkeletonElementType = typeof DEFAULT_HEADING_SKELETON_ELEMENT>(props: HeadingSkeletonProps<E>): React.JSX.Element;
1484
+ /** @beta */
1485
+ declare const DEFAULT_LABEL_SKELETON_ELEMENT = "div";
1486
+ /** @beta */
1487
+ type LabelSkeletonOwnProps = SkeletonOwnProps & {
1488
+ size?: ResponsiveProp$1<FontLabelSize>;
1489
+ };
1490
+ /** @beta */
1491
+ type LabelSkeletonElementType = SkeletonElementType;
1711
1492
  /**
1712
- * The `Select` component provides control of options.
1713
- *
1714
- * @public
1493
+ * This API might change. DO NOT USE IN PRODUCTION.
1494
+ * @beta
1715
1495
  */
1716
- export declare function Select<E extends SelectElementType = typeof DEFAULT_SELECT_ELEMENT>(
1717
- props: SelectProps<E>,
1718
- ): React.JSX.Element
1719
-
1720
- /** @public */
1721
- export declare function Selectable<
1722
- E extends SelectableElementType = typeof DEFAULT_SELECTABLE_ELEMENT,
1723
- >(props: SelectableProps<E>): React.JSX.Element
1724
-
1725
- /** @public */
1726
- export declare type SelectableElementType = 'a' | 'button' | 'span' | ComponentType
1727
-
1728
- /** @public */
1729
- export declare interface SelectableOwnProps extends SelectableStyleProps {
1730
- selected?: boolean
1731
- }
1732
-
1733
- /** @public */
1734
- export declare type SelectableProps<E extends SelectableElementType = SelectableElementType> =
1735
- Props<SelectableOwnProps, E>
1736
-
1737
- /** @public */
1738
- export declare type SelectElementType = 'select' | ComponentType
1739
-
1740
- /** @public */
1741
- export declare type SelectOwnProps = SelectStyleProps & {
1742
- customValidity?: string
1743
- readOnly?: boolean
1744
- }
1745
-
1746
- /** @public */
1747
- export declare type SelectProps<E extends SelectElementType = SelectElementType> = Props<
1748
- SelectOwnProps,
1749
- E
1750
- >
1751
-
1496
+ type LabelSkeletonProps<E extends LabelSkeletonElementType = LabelSkeletonElementType> = Props<LabelSkeletonOwnProps, E>;
1752
1497
  /**
1753
1498
  * This API might change. DO NOT USE IN PRODUCTION.
1754
1499
  * @beta
1755
1500
  */
1756
- export declare function Skeleton<E extends SkeletonElementType = typeof DEFAULT_SKELETON_ELEMENT>(
1757
- props: SkeletonProps<E>,
1758
- ): React.JSX.Element
1759
-
1501
+ declare function LabelSkeleton<E extends LabelSkeletonElementType = typeof DEFAULT_LABEL_SKELETON_ELEMENT>(props: LabelSkeletonProps<E>): React.JSX.Element;
1502
+ /** @beta */
1503
+ declare const DEFAULT_TEXT_SKELETON_ELEMENT = "div";
1504
+ /** @beta */
1505
+ type TextSkeletonOwnProps = SkeletonOwnProps & {
1506
+ size?: ResponsiveProp$1<FontTextSize>;
1507
+ };
1760
1508
  /** @beta */
1761
- export declare type SkeletonElementType = 'div' | 'span' | ComponentType
1762
-
1509
+ type TextSkeletonElementType = SkeletonElementType;
1763
1510
  /**
1764
1511
  * This API might change. DO NOT USE IN PRODUCTION.
1765
1512
  * @beta
1766
1513
  */
1767
- export declare type SkeletonOwnProps = SkeletonStyleProps & {
1768
- animated?: boolean
1769
- delay?: number
1770
- }
1771
-
1772
- /** @beta */
1773
- export declare type SkeletonProps<E extends SkeletonElementType = SkeletonElementType> = Props<
1774
- SkeletonOwnProps,
1775
- E
1776
- >
1777
-
1514
+ type TextSkeletonProps<E extends TextSkeletonElementType = TextSkeletonElementType> = Props<TextSkeletonOwnProps, E>;
1778
1515
  /**
1779
- * Indicate that something is loading for an indeterminate amount of time.
1780
- *
1781
- * @public
1516
+ * This API might change. DO NOT USE IN PRODUCTION.
1517
+ * @beta
1782
1518
  */
1783
- export declare function Spinner<E extends SpinnerElementType = typeof DEFAULT_SPINNER_ELEMENT>(
1784
- props: SpinnerProps<E>,
1785
- ): React.JSX.Element
1786
-
1787
- /** @public */
1788
- export declare type SpinnerElementType = 'div' | 'span' | ComponentType
1789
-
1790
- /** @public */
1791
- export declare type SpinnerOwnProps = {
1792
- muted?: boolean
1793
- size?: ResponsiveProp<FontTextSize>
1794
- }
1795
-
1796
- /** @public */
1797
- export declare type SpinnerProps<E extends SpinnerElementType = SpinnerElementType> = Props<
1798
- SpinnerOwnProps,
1799
- E
1800
- >
1801
-
1802
- /** @public */
1803
- export declare function SrOnly<E extends SrOnlyElementType = typeof DEFAULT_SR_ONLY_ELEMENT>(
1804
- props: SrOnlyProps<E>,
1805
- ): React.JSX.Element
1806
-
1519
+ declare function TextSkeleton<E extends TextSkeletonElementType = typeof DEFAULT_TEXT_SKELETON_ELEMENT>(props: TextSkeletonProps<E>): React.JSX.Element;
1807
1520
  /** @public */
1808
- export declare type SrOnlyElementType = 'span' | ComponentType
1809
-
1521
+ declare const DEFAULT_SPINNER_ELEMENT = "div";
1810
1522
  /** @public */
1811
- export declare type SrOnlyOwnProps = {}
1812
-
1523
+ type SpinnerOwnProps = {
1524
+ muted?: boolean;
1525
+ size?: ResponsiveProp$1<FontTextSize>;
1526
+ };
1813
1527
  /** @public */
1814
- export declare type SrOnlyProps<E extends SrOnlyElementType = SrOnlyElementType> = Props<
1815
- SrOnlyOwnProps,
1816
- E
1817
- >
1818
-
1819
- /**
1820
- * The `Stack` component is used to place elements on top of each other.
1821
- *
1822
- * @public
1823
- */
1824
- export declare function Stack<E extends StackElementType = typeof DEFAULT_STACK_ELEMENT>(
1825
- props: StackProps<E>,
1826
- ): React.JSX.Element
1827
-
1828
- /** @public */
1829
- export declare type StackElementType = BoxElementType
1830
-
1528
+ type SpinnerElementType = 'div' | 'span' | ComponentType;
1831
1529
  /** @public */
1832
- export declare type StackOwnProps = StackStyleProps
1833
-
1834
- /** @public */
1835
- export declare type StackProps<E extends StackElementType = StackElementType> = Props<
1836
- StackOwnProps,
1837
- E
1838
- >
1839
-
1530
+ type SpinnerProps<E extends SpinnerElementType = SpinnerElementType> = Props<SpinnerOwnProps, E>;
1840
1531
  /**
1841
- * The `Switch` component allows the user to toggle a setting on and off.
1842
- *
1843
- * Extends all properties of an `<input type="checkbox" />` element, except type.
1532
+ * Indicate that something is loading for an indeterminate amount of time.
1844
1533
  *
1845
1534
  * @public
1846
1535
  */
1847
- export declare function Switch<E extends SwitchElementType = typeof DEFAULT_SWITCH_ELEMENT>(
1848
- props: SwitchProps<E>,
1849
- ): React.JSX.Element
1850
-
1851
- /** @public */
1852
- export declare type SwitchElementType = 'input' | ComponentType
1853
-
1854
- /** @public */
1855
- export declare type SwitchOwnProps = {
1856
- indeterminate?: boolean
1857
- }
1858
-
1859
- /** @public */
1860
- export declare type SwitchProps<E extends SwitchElementType = SwitchElementType> = Props<
1861
- SwitchOwnProps,
1862
- E
1863
- >
1864
-
1865
- declare function Syntax(props: SyntaxProps): React.JSX.Element
1866
-
1867
- declare interface SyntaxProps {
1868
- language?: string
1869
- value: React.ReactNode
1870
- }
1871
-
1872
- /** @public */
1873
- export declare function Tab<E extends TabElementType = typeof DEFAULT_TAB_ELEMENT>(
1874
- props: TabProps<E>,
1875
- ): React.JSX.Element
1876
-
1536
+ declare function Spinner<E extends SpinnerElementType = typeof DEFAULT_SPINNER_ELEMENT>(props: SpinnerProps<E>): React.JSX.Element;
1877
1537
  /** @public */
1878
- export declare type TabElementType = 'button' | ComponentType
1879
-
1538
+ declare const DEFAULT_SR_ONLY_ELEMENT = "span";
1880
1539
  /** @public */
1881
- export declare function TabList<E extends TabListElementType = typeof DEFAULT_TAB_LIST_ELEMENT>(
1882
- props: TabListProps<E>,
1883
- ): React.JSX.Element
1884
-
1540
+ type SrOnlyOwnProps = {};
1885
1541
  /** @public */
1886
- export declare type TabListElementType = 'div' | 'span' | ComponentType
1887
-
1888
- /** @public */
1889
- export declare interface TabListOwnProps extends FlexOwnProps {
1890
- autoActivate?: boolean
1891
- }
1892
-
1893
- /** @public */
1894
- export declare type TabListProps<E extends TabListElementType = TabListElementType> = Omit<
1895
- Props<TabListOwnProps, E>,
1896
- 'role'
1897
- >
1898
-
1899
- /** @public */
1900
- export declare interface TabOwnProps extends ButtonOwnProps {
1901
- /**
1902
- * The `id` of the corresponding `TabPanel` component.
1903
- */
1904
- 'aria-controls': string
1905
- 'id': string
1906
- 'focused'?: boolean
1907
- 'label'?: React.ReactNode
1908
- 'onActivate'?: () => void
1909
- }
1910
-
1542
+ type SrOnlyElementType = 'span' | ComponentType;
1911
1543
  /** @public */
1912
- export declare function TabPanel<E extends TabPanelElementType = typeof DEFAULT_TAB_PANEL_ELEMENT>(
1913
- props: TabPanelProps<E>,
1914
- ): React.JSX.Element
1915
-
1544
+ type SrOnlyProps<E extends SrOnlyElementType = SrOnlyElementType> = Props<SrOnlyOwnProps, E>;
1916
1545
  /** @public */
1917
- export declare type TabPanelElementType = 'div' | 'span' | ComponentType
1918
-
1546
+ declare function SrOnly<E extends SrOnlyElementType = typeof DEFAULT_SR_ONLY_ELEMENT>(props: SrOnlyProps<E>): React.JSX.Element;
1919
1547
  /** @public */
1920
- export declare type TabPanelOwnProps = BoxOwnProps & {
1921
- /**
1922
- * The `id` of the corresponding `Tab` component.
1923
- */
1924
- 'aria-labelledby': string
1925
- 'id': string
1926
- }
1927
-
1548
+ declare const DEFAULT_SWITCH_ELEMENT = "input";
1928
1549
  /** @public */
1929
- export declare type TabPanelProps<E extends TabPanelElementType = TabPanelElementType> = Props<
1930
- TabPanelOwnProps,
1931
- E
1932
- >
1933
-
1550
+ type SwitchOwnProps = {
1551
+ indeterminate?: boolean;
1552
+ };
1934
1553
  /** @public */
1935
- export declare type TabProps<E extends TabElementType = TabElementType> = Props<TabOwnProps, E>
1936
-
1554
+ type SwitchElementType = 'input' | ComponentType;
1937
1555
  /** @public */
1938
- export declare type TagType = keyof React.JSX.IntrinsicElements
1939
-
1556
+ type SwitchProps<E extends SwitchElementType = SwitchElementType> = Props<SwitchOwnProps, E>;
1940
1557
  /**
1941
- * The `Text` component is an agile, themed typographic element.
1558
+ * The `Switch` component allows the user to toggle a setting on and off.
1942
1559
  *
1943
- * @public
1944
- */
1945
- declare function Text_2<E extends TextElementType = typeof DEFAULT_TEXT_ELEMENT>(
1946
- props: TextProps<E>,
1947
- ): React.JSX.Element
1948
- export {Text_2 as Text}
1949
-
1950
- /**
1951
- * A multiline text input.
1560
+ * Extends all properties of an `<input type="checkbox" />` element, except type.
1952
1561
  *
1953
1562
  * @public
1954
1563
  */
1955
- export declare function TextArea<E extends TextAreaElementType = typeof DEFAULT_TEXT_AREA_ELEMENT>(
1956
- props: TextAreaProps<E>,
1957
- ): React.JSX.Element
1958
-
1564
+ declare function Switch<E extends SwitchElementType = typeof DEFAULT_SWITCH_ELEMENT>(props: SwitchProps<E>): React.JSX.Element;
1959
1565
  /** @public */
1960
- export declare type TextAreaElementType = 'textarea' | ComponentType
1961
-
1566
+ declare const DEFAULT_INLINE_CODE_ELEMENT = "code";
1962
1567
  /** @public */
1963
- export declare type TextAreaOwnProps = TextAreaStyleProps & {
1964
- /**
1965
- * @beta
1966
- */
1967
- __unstable_disableFocusRing?: boolean
1968
- customValidity?: string
1568
+ interface InlineCodeProps {
1569
+ children: React.ReactNode;
1570
+ /** Language to use for syntax highlighting. */
1571
+ language?: string;
1969
1572
  }
1970
-
1971
- /** @public */
1972
- export declare type TextAreaProps<E extends TextAreaElementType = TextAreaElementType> = Props<
1973
- TextAreaOwnProps,
1974
- E
1975
- >
1976
-
1977
- /** @public */
1978
- export declare type TextElementType =
1979
- | 'div'
1980
- | 'h1'
1981
- | 'h2'
1982
- | 'h3'
1983
- | 'h4'
1984
- | 'h5'
1985
- | 'h6'
1986
- | 'label'
1987
- | 'li'
1988
- | 'p'
1989
- | 'span'
1990
- | 'summary'
1991
- | 'time'
1992
- | ComponentType
1993
-
1994
- /**
1995
- * Single line text input.
1996
- *
1997
- * @public
1998
- */
1999
- export declare function TextInput<
2000
- E extends TextInputElementType = typeof DEFAULT_TEXT_INPUT_ELEMENT,
2001
- >(props: TextInputProps<E>): React.JSX.Element
2002
-
2003
1573
  /** @public */
2004
- export declare type TextInputClearButtonProps = Omit<
2005
- ButtonProps<'button'>,
2006
- 'as' | 'onClick' | 'onMouseDown'
2007
- >
2008
-
1574
+ declare function InlineCode(props: InlineCodeProps): React.JSX.Element;
2009
1575
  /** @public */
2010
- export declare type TextInputElementType = 'input' | ComponentType
2011
-
1576
+ declare const DEFAULT_TEXT_AREA_ELEMENT = "textarea";
2012
1577
  /** @public */
2013
- export declare type TextInputOwnProps = InputStyleProps & {
2014
- /**
2015
- * @beta
2016
- */
2017
- __unstable_disableFocusRing?: boolean
2018
- /**
2019
- * @beta
2020
- */
2021
- clearButton?: boolean | TextInputClearButtonProps
2022
- customValidity?: string
2023
- icon?: ElementType_2 | ReactNode
2024
- iconRight?: ElementType_2 | ReactNode
1578
+ type TextAreaOwnProps = TextAreaStyleProps & {
2025
1579
  /**
2026
1580
  * @beta
2027
1581
  */
2028
- onClear?: () => void
2029
- prefix?: ReactNode
2030
- suffix?: ReactNode
2031
- /**
2032
- * @deprecated Use `fontWeight` instead
2033
- */
2034
- weight?: FontWeight
2035
- }
2036
-
2037
- /** @public */
2038
- export declare type TextInputProps<E extends TextInputElementType = TextInputElementType> = Props<
2039
- TextInputOwnProps,
2040
- E
2041
- >
2042
-
2043
- /** @public */
2044
- export declare type TextOwnProps = TextStyleProps & TextOverflowStyleProps
2045
-
1582
+ __unstable_disableFocusRing?: boolean;
1583
+ customValidity?: string;
1584
+ };
2046
1585
  /** @public */
2047
- export declare type TextProps<E extends TextElementType = TextElementType> = Props<TextOwnProps, E>
2048
-
2049
- /**
2050
- * This API might change. DO NOT USE IN PRODUCTION.
2051
- * @beta
2052
- */
2053
- export declare function TextSkeleton<
2054
- E extends TextSkeletonElementType = typeof DEFAULT_TEXT_SKELETON_ELEMENT,
2055
- >(props: TextSkeletonProps<E>): React.JSX.Element
2056
-
2057
- /** @beta */
2058
- export declare type TextSkeletonElementType = SkeletonElementType
2059
-
2060
- /** @beta */
2061
- export declare type TextSkeletonOwnProps = SkeletonOwnProps & {
2062
- size?: ResponsiveProp<FontTextSize>
2063
- }
2064
-
2065
- /**
2066
- * This API might change. DO NOT USE IN PRODUCTION.
2067
- * @beta
2068
- */
2069
- export declare type TextSkeletonProps<E extends TextSkeletonElementType = TextSkeletonElementType> =
2070
- Props<TextSkeletonOwnProps, E>
2071
-
2072
- /**
2073
- * The `Toast` component gives feedback to users when an action has taken place.
2074
- *
2075
- * Toasts can be closed with a close button, or auto-dismiss when the duration expires.
2076
- *
2077
- * @internal
2078
- */
2079
- export declare function Toast<E extends ToastElementType = typeof DEFAULT_TOAST_ELEMENT>(
2080
- props: ToastProps<E>,
2081
- ): React.JSX.Element
2082
-
1586
+ type TextAreaElementType = 'textarea' | ComponentType;
2083
1587
  /** @public */
2084
- export declare interface ToastContextValue {
2085
- version: 0.0
2086
- /**
2087
- * Creates or updates a toast notification.
2088
- * If a toast with the same ID already exists, it will be updated.
2089
- * If an ID is not provided, a random one will be generated.
2090
- * The returned ID can be used to programatically update a toast.
2091
- */
2092
- push: (params: ToastParams) => string
2093
- }
2094
-
2095
- /** @internal */
2096
- export declare type ToastElementType = 'li' | ComponentType
2097
-
2098
- /** @internal */
2099
- declare type ToastLayerElementType = 'ul' | ComponentType
2100
-
2101
- /** @internal */
2102
- declare type ToastLayerOwnProps = GapStyleProps & PaddingStyleProps
2103
-
2104
- /** @internal */
2105
- declare type ToastLayerProps<E extends ToastLayerElementType = ToastLayerElementType> = Props<
2106
- ToastLayerOwnProps,
2107
- E
2108
- >
2109
-
2110
- /** @internal */
2111
- export declare type ToastOwnProps = RadiusStyleProps & {
2112
- closable?: boolean
2113
- description?: ReactNode
2114
- onClose?: () => void
2115
- title?: ReactNode
2116
- status?: 'error' | 'warning' | 'success' | 'info'
2117
- duration?: number
2118
- }
2119
-
2120
- /** @public */
2121
- export declare interface ToastParams {
2122
- closable?: boolean
2123
- description?: ReactNode
2124
- duration?: number
2125
- id?: string
2126
- onClose?: () => void
2127
- title?: ReactNode
2128
- status?: 'error' | 'warning' | 'success' | 'info'
2129
- }
2130
-
2131
- /** @internal */
2132
- export declare type ToastProps<E extends ToastElementType = ToastElementType> = Props<
2133
- ToastOwnProps,
2134
- E
2135
- >
2136
-
2137
- /** @public */
2138
- export declare function ToastProvider(props: ToastProviderProps): React.JSX.Element
2139
-
2140
- /** @public */
2141
- export declare interface ToastProviderProps extends Omit<ToastLayerProps, 'children'> {
2142
- children?: React.ReactNode
2143
- zOffset?: ResponsiveProp<number>
2144
- }
2145
-
1588
+ type TextAreaProps<E extends TextAreaElementType = TextAreaElementType> = Props<TextAreaOwnProps, E>;
2146
1589
  /**
2147
- * Tooltips display information when hovering, focusing or tapping.
1590
+ * A multiline text input.
2148
1591
  *
2149
1592
  * @public
2150
1593
  */
2151
- export declare function Tooltip<E extends TooltipElementType = typeof DEFAULT_TOOLTIP_ELEMENT>(
2152
- props: TooltipProps<E>,
2153
- ): React.JSX.Element
2154
-
1594
+ declare function TextArea<E extends TextAreaElementType = typeof DEFAULT_TEXT_AREA_ELEMENT>(props: TextAreaProps<E>): React.JSX.Element;
2155
1595
  /**
2156
1596
  * @beta
2157
1597
  */
2158
- export declare const TooltipDelayGroupContext: Context<TooltipDelayGroupContextValue | null>
2159
-
2160
- /**
2161
- * @beta
2162
- */
2163
- export declare interface TooltipDelayGroupContextValue {
2164
- handleOpenChange: (params: {open: boolean; id: string; immediate?: boolean}) => void
2165
- visibleTooltipId: string | undefined
1598
+ interface TooltipDelayGroupContextValue {
1599
+ handleOpenChange: (params: {
1600
+ open: boolean;
1601
+ id: string;
1602
+ immediate?: boolean;
1603
+ }) => void;
1604
+ visibleTooltipId: string | undefined;
2166
1605
  }
2167
-
2168
1606
  /**
2169
- * @public
2170
- * Provides context for a group of tooltip elements that should share a delay
2171
- * which temporarily becomes 0ms after the first tooltip of the group opens.
1607
+ * @beta
2172
1608
  */
2173
- export declare function TooltipDelayGroupProvider(
2174
- props: TooltipDelayGroupProviderProps,
2175
- ): React.JSX.Element
2176
-
1609
+ declare const TooltipDelayGroupContext: Context<TooltipDelayGroupContextValue | null>;
2177
1610
  /**
2178
1611
  * @public
2179
1612
  * */
2180
- export declare interface TooltipDelayGroupProviderProps {
2181
- children?: ReactNode
1613
+ interface TooltipDelayGroupProviderProps {
1614
+ children?: ReactNode;
2182
1615
  /**
2183
1616
  * Handles the delays to open or close a tooltip inside a group
2184
1617
  *
@@ -2188,289 +1621,134 @@ export declare interface TooltipDelayGroupProviderProps {
2188
1621
  *
2189
1622
  * @public
2190
1623
  */
2191
- delay?: Delay
1624
+ delay?: Delay;
2192
1625
  }
2193
-
2194
- /** @public */
2195
- export declare type TooltipElementType = 'div' | 'span' | ComponentType
2196
-
2197
- /** @public */
2198
- export declare type TooltipOwnProps = LayerOwnProps &
2199
- RadiusStyleProps &
2200
- ShadowStyleProps & {
2201
- /**
2202
- * Whether the tooltip should animate in and out.
2203
- *
2204
- * @beta
2205
- * @defaultValue false
2206
- */
2207
- animate?: boolean
2208
- /** @deprecated Will be removed in the next major version */
2209
- arrow?: boolean
2210
- boundaryElement?: HTMLElement | null
2211
- children?: React.ReactElement<
2212
- React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>
2213
- >
2214
- content?: React.ReactNode
2215
- /**
2216
- * Adds a delay to open or close the tooltip.
2217
- *
2218
- * If only a `number` is passed, it will be used for both opening and closing.
2219
- *
2220
- * If an object `{open: number; close:number}` is passed, it can be used to set different delays for each action.
2221
- *
2222
- * @public
2223
- * @defaultValue 0
2224
- */
2225
- delay?: Delay
2226
- disabled?: boolean
2227
- fallbackPlacements?: Placement[]
2228
- hotkeys?: string[]
2229
- placement?: Placement
2230
- /** Whether or not to render the tooltip in a portal element. */
2231
- portal?: boolean | string
2232
- scheme?: ColorScheme
2233
- text?: React.ReactNode
2234
- textSize?: ResponsiveProp<FontTextSize>
2235
- tone?: CardTone
2236
- }
2237
-
2238
- /** @public */
2239
- export declare type TooltipProps<E extends TooltipElementType = TooltipElementType> = Props<
2240
- TooltipOwnProps,
2241
- E
2242
- >
2243
-
2244
- /**
2245
- * This API might change. DO NOT USE IN PRODUCTION.
2246
- * @beta
2247
- */
2248
- export declare function Tree<E extends TreeElementType = typeof DEFAULT_TREE_ELEMENT>(
2249
- props: TreeProps<E>,
2250
- ): React.JSX.Element
2251
-
2252
1626
  /**
2253
- * @beta
1627
+ * @public
1628
+ * Provides context for a group of tooltip elements that should share a delay
1629
+ * which temporarily becomes 0ms after the first tooltip of the group opens.
2254
1630
  */
2255
- export declare interface TreeContextValue {
2256
- version: 0.0
2257
- focusedElement: HTMLElement | null
2258
- gap: ResponsiveProp<Space>
2259
- level: number
2260
- path: string[]
2261
- registerItem: (element: HTMLElement, path: string, expanded: boolean, selected: boolean) => void
2262
- setExpanded: (path: string, expanded: boolean) => void
2263
- setFocusedElement: (focusedElement: HTMLElement | null) => void
2264
- state: TreeState
2265
- }
2266
-
2267
- /** @beta */
2268
- export declare type TreeElementType = 'div' | ComponentType
2269
-
1631
+ declare function TooltipDelayGroupProvider(props: TooltipDelayGroupProviderProps): React.JSX.Element;
2270
1632
  /**
2271
- * This API might change. DO NOT USE IN PRODUCTION.
2272
1633
  * @beta
2273
1634
  */
2274
- export declare function TreeItem<E extends TreeItemElementType = typeof DEFAULT_TREE_ITEM_ELEMENT>(
2275
- props: TreeItemProps<E>,
2276
- ): React.JSX.Element
2277
-
2278
- /** @beta */
2279
- export declare type TreeItemElementType = 'a' | 'li' | ComponentType
2280
-
2281
- /** @beta */
2282
- export declare type TreeItemOwnProps = SelectableOwnProps & {
2283
- expanded?: boolean
2284
- fontSize?: ResponsiveProp<FontTextSize>
2285
- icon?: ElementType_2
2286
- /**
2287
- * Allows passing a custom element type to the link component
2288
- * @internal
2289
- */
2290
- linkAs?: SelectableElementType
2291
- onClick?: MouseEventHandler<HTMLAnchorElement | HTMLLIElement>
2292
- padding?: ResponsiveProp<Space>
2293
- gap?: ResponsiveProp<Space>
2294
- /** @deprecated Use `gap` instead */
2295
- space?: never
2296
- text?: ReactNode
2297
- weight?: FontWeight
1635
+ declare function useTooltipDelayGroup(): TooltipDelayGroupContextValue | null;
1636
+ /** @public */
1637
+ interface BoundaryElementProviderProps {
1638
+ children: ReactNode;
1639
+ element: HTMLElement | null;
2298
1640
  }
2299
-
1641
+ /** @public */
1642
+ declare function BoundaryElementProvider(props: BoundaryElementProviderProps): React.JSX.Element;
1643
+ /** @public */
1644
+ type BoundaryElementContextValue = HTMLElement | null;
1645
+ /** @public */
1646
+ declare function useBoundaryElement(): {
1647
+ version: 0.0;
1648
+ element: BoundaryElementContextValue;
1649
+ };
2300
1650
  /** @beta */
2301
- export declare type TreeItemProps<E extends TreeItemElementType = TreeItemElementType> = Props<
2302
- TreeItemOwnProps,
2303
- E
2304
- >
2305
-
1651
+ declare const DEFAULT_ELEMENT_QUERY_ELEMENT = "div";
2306
1652
  /**
2307
- * This API might change. DO NOT USE IN PRODUCTION.
1653
+ * DO NOT USE IN PRODUCTION.
2308
1654
  * @beta
2309
1655
  */
2310
- export declare type TreeOwnProps = Omit<StackOwnProps, 'position'>
2311
-
1656
+ type ElementQueryOwnProps = {
1657
+ media?: number[];
1658
+ };
2312
1659
  /** @beta */
2313
- export declare type TreeProps<E extends TreeElementType = TreeElementType> = Props<TreeOwnProps, E>
2314
-
1660
+ type ElementQueryElementType = 'div' | ComponentType;
2315
1661
  /**
1662
+ * DO NOT USE IN PRODUCTION.
2316
1663
  * @beta
2317
1664
  */
2318
- export declare interface TreeState {
2319
- [key: string]:
2320
- | {
2321
- element: HTMLElement
2322
- expanded: boolean
2323
- }
2324
- | undefined
2325
- }
2326
-
2327
- /** @public */
2328
- export declare function useBoundaryElement(): {
2329
- version: 0.0
2330
- element: BoundaryElementContextValue
2331
- }
2332
-
2333
- /** @public */
2334
- export declare function useCard(): CardContextValue
2335
-
2336
- /** @public */
2337
- export declare function useClickOutsideEvent(
2338
- listener: ClickOutsideEventListener | false | undefined,
2339
- elementsArg?: () => ClickOutsideEventElements,
2340
- boundaryElement?: () => HTMLElement | null,
2341
- ): void
2342
-
1665
+ type ElementQueryProps<E extends ElementQueryElementType = ElementQueryElementType> = Props<ElementQueryOwnProps, E>;
2343
1666
  /**
1667
+ * DO NOT USE IN PRODUCTION.
2344
1668
  * @beta
2345
1669
  */
2346
- export declare function useCustomValidity(
2347
- ref: {
2348
- current: null | {
2349
- setCustomValidity: (validity: string) => void
2350
- }
2351
- },
2352
- customValidity: string | undefined,
2353
- ): void
2354
-
1670
+ declare function ElementQuery<E extends ElementQueryElementType = typeof DEFAULT_ELEMENT_QUERY_ELEMENT>(props: ElementQueryProps<E>): React.JSX.Element;
2355
1671
  /**
2356
- * This API might change. DO NOT USE IN PRODUCTION.
1672
+ * DO NOT USE IN PRODUCTION
2357
1673
  * @beta
2358
1674
  */
2359
- export declare function useDialog(): DialogContextValue
2360
-
1675
+ type ErrorBoundaryProps = PropsWithChildren<{
1676
+ onCatch: (params: {
1677
+ error: Error;
1678
+ info: ErrorInfo;
1679
+ }) => void;
1680
+ }>;
2361
1681
  /**
2362
- * Subscribe to the size of a DOM element.
1682
+ * DO NOT USE IN PRODUCTION
2363
1683
  * @beta
2364
1684
  */
2365
- export declare function useElementSize(element: HTMLElement | null): ElementSize | null
2366
-
1685
+ interface ErrorBoundaryState {
1686
+ error: Error | null;
1687
+ }
2367
1688
  /**
2368
- * Adds global keydown event listener to the window.
2369
- *
2370
- * @param onKeyDown - The function to call when a keydown event is triggered.
2371
- * @param options - The options to pass to the addEventListener function (example, capture: true)
1689
+ * DO NOT USE IN PRODUCTION
2372
1690
  * @beta
2373
1691
  */
2374
- export declare function useGlobalKeyDown(
2375
- onKeyDown: (event: KeyboardEvent) => void,
2376
- options?: AddEventListenerOptions,
2377
- ): void
2378
-
1692
+ declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
1693
+ state: ErrorBoundaryState;
1694
+ static displayName: string;
1695
+ static getDerivedStateFromError(error: Error): ErrorBoundaryState;
1696
+ componentDidCatch(error: Error, info: ErrorInfo): void;
1697
+ render(): ReactNode;
1698
+ }
2379
1699
  /** @public */
2380
- export declare function useLayer(): LayerContextValue
2381
-
2382
- /**
2383
- * Efficiently subscribes to `window.matchMedia` queries
2384
- *
2385
- * @param getServerSnapshot - Only called during server-side rendering, and hydration if using hydrateRoot. Required if the hook is called during SSR (https://dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
2386
- *
2387
- * @public
2388
- */
2389
- export declare function useMatchMedia(
2390
- mediaQueryString: `(${string})`,
2391
- getServerSnapshot?: () => boolean,
2392
- ): boolean
2393
-
2394
- /**
2395
- * This API might change. DO NOT USE IN PRODUCTION.
2396
- * @beta
2397
- */
2398
- export declare function useMediaIndex(): Breakpoint
2399
-
1700
+ interface PortalProps {
1701
+ children: ReactNode;
1702
+ /**
1703
+ * @beta This API might change. DO NOT USE IN PRODUCTION.
1704
+ */
1705
+ __unstable_name?: string;
1706
+ }
2400
1707
  /** @public */
2401
- export declare function usePortal(): PortalContextValue
2402
-
2403
- /**
2404
- * Returns true if a dark color scheme is preferred, false if a light color scheme is preferred or the preference is not known.
2405
- *
2406
- * @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://dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
2407
- *
2408
- * If you persist the detected preference in a cookie or a header then you may implement your own server snapshot to read it.
2409
- * 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
2410
- * @example https://gist.github.com/stipsan/13c0cccf8dfc34f4b44bb1b984baf7df
2411
- *
2412
- * @public
2413
- */
2414
- export declare function usePrefersDark(getServerSnapshot?: () => boolean): boolean
2415
-
1708
+ declare function Portal(props: PortalProps): ReactPortal | null;
1709
+ /** @public */
1710
+ interface PortalProviderProps {
1711
+ children: ReactNode;
1712
+ element?: HTMLElement | null;
1713
+ /**
1714
+ * @beta
1715
+ */
1716
+ __unstable_elements?: Record<string, HTMLElement | null | undefined>;
1717
+ }
1718
+ /** @public */
1719
+ declare function PortalProvider(props: PortalProviderProps): React.JSX.Element;
1720
+ /** @public */
1721
+ interface PortalContextValue {
1722
+ version: 0.0;
1723
+ boundaryElement: HTMLElement | null;
1724
+ element: HTMLElement | null;
1725
+ elements?: Record<string, HTMLElement | null | undefined>;
1726
+ }
1727
+ /** @public */
1728
+ declare function usePortal(): PortalContextValue;
1729
+ /** @public */
1730
+ declare const DEFAULT_ROOT_ELEMENT = "html";
1731
+ /** @public */
1732
+ type RootOwnProps = RootStyleProps;
1733
+ /** @public */
1734
+ type RootElementType = 'html' | 'div';
1735
+ /** @public */
1736
+ type RootProps<E extends RootElementType = RootElementType> = Props<RootOwnProps, E>;
2416
1737
  /**
2417
- * Returns true if motion should be reduced
2418
- *
2419
- * @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-reduced-motion: no-preference)` since it's the most common scheme (https://dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
2420
- *
2421
- * If you persist the detected preference in a cookie or a header then you may implement your own server snapshot to read it.
2422
- * Chrome supports reading the `prefers-reduced-motion` media query from a header if the server response: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Sec-CH-Prefers-Reduced-Motion
2423
- * @example https://gist.github.com/stipsan/0c0f839a27842249cada893e9fb7767b
1738
+ * The `Root` component.
2424
1739
  *
2425
1740
  * @public
2426
1741
  */
2427
- export declare function usePrefersReducedMotion(getServerSnapshot?: () => boolean): boolean
2428
-
1742
+ declare function Root<E extends RootElementType = typeof DEFAULT_ROOT_ELEMENT>(props: RootProps<E>): React.JSX.Element;
2429
1743
  /** @public */
2430
- export declare function useToast(): ToastContextValue
2431
-
2432
- /**
2433
- * @beta
2434
- */
2435
- export declare function useTooltipDelayGroup(): TooltipDelayGroupContextValue | null
2436
-
2437
- /**
2438
- * @beta
2439
- */
2440
- export declare function useTree(): TreeContextValue
2441
-
2442
- /** @beta */
2443
- export declare function VirtualList<
2444
- E extends VirtualListElementType = typeof DEFAULT_VIRTUAL_LIST_ELEMENT,
2445
- Item = any,
2446
- >(props: VirtualListProps<E, Item>): React.JSX.Element
2447
-
2448
- /** @beta */
2449
- export declare interface VirtualListChangeOpts {
2450
- fromIndex: number
2451
- gap: number
2452
- itemHeight: number
2453
- scrollHeight: number
2454
- scrollTop: number
2455
- toIndex: number
2456
- }
2457
-
2458
- /** @beta */
2459
- export declare type VirtualListElementType = 'div' | ComponentType
2460
-
2461
- /** @beta */
2462
- export declare interface VirtualListOwnProps<Item = any> {
2463
- gap?: Space
2464
- getItemKey?: (item: Item, itemIndex: number) => string
2465
- items?: Item[]
2466
- onChange?: (opts: VirtualListChangeOpts) => void
2467
- renderItem?: (item: Item) => ReactNode
1744
+ interface RootProviderProps {
1745
+ boundaryElement: HTMLElement | null;
1746
+ children?: ReactNode;
1747
+ portalElement: HTMLElement | null;
1748
+ scheme: ColorScheme;
1749
+ tone: CardTone;
2468
1750
  }
2469
-
2470
- /** @beta */
2471
- export declare type VirtualListProps<
2472
- E extends VirtualListElementType = VirtualListElementType,
2473
- Item = any,
2474
- > = Props<VirtualListOwnProps<Item>, E>
2475
-
2476
- export {}
1751
+ /** @public */
1752
+ declare function RootProvider(props: RootProviderProps): React.JSX.Element;
1753
+ export { AVATAR_COLORS, AVATAR_SIZE, Assign, Autocomplete, AutocompleteElementType, AutocompleteInputChangeMsg, AutocompleteInputFoocusMsg, AutocompleteMsg, AutocompleteOpenButtonProps, AutocompleteOwnProps, AutocompleteProps, AutocompleteRootBlurMsg, AutocompleteRootClearMsg, AutocompleteRootEscapeMsg, AutocompleteRootOpenMsg, AutocompleteRootSetActiveValueMsg, AutocompleteRootSetListFocusedMsg, AutocompleteState, AutocompleteValueChangeMsg, Avatar, AvatarCounter, AvatarCounterElementType, AvatarCounterOwnProps, AvatarCounterProps, AvatarElementType, AvatarOwnProps, AvatarPosition, AvatarProps, AvatarStack, AvatarStackChild, AvatarStackElementType, AvatarStackOwnProps, AvatarStackProps, BG_PATTERNS, BORDER_STYLE, BORDER_WIDTH, BREAKPOINTS, BUTTON_MODES, Badge, BadgeElementType, BadgeOwnProps, BadgeProps, BaseAutocompleteOption, BoundaryElementContextValue, BoundaryElementProvider, BoundaryElementProviderProps, Box, BoxElementType, BoxOwnProps, BoxProps, Breadcrumbs, BreadcrumbsElementType, BreadcrumbsOwnProps, BreadcrumbsProps, Button, ButtonElementType, ButtonOwnProps, ButtonProps, ButtonTextAlign, CARD_TONES, COLOR_SCHEMES, COLOR_VARIANTS, CONTAINER, CONTAINER_SCALE, Card, CardContextValue, CardElementType, CardOwnProps, CardProps, CardProvider, Checkbox, CheckboxElementType, CheckboxOwnProps, CheckboxProps, ClickOutsideEventElements, ClickOutsideEventListener, Code, CodeElementType, CodeOwnProps, CodeProps, CodeSkeleton, CodeSkeletonElementType, CodeSkeletonOwnProps, CodeSkeletonProps, ComponentType, Container, ContainerElementType, ContainerOwnProps, ContainerProps, DEFAULT_AUTOCOMPLETE_ELEMENT, DEFAULT_AVATAR_COUNTER_ELEMENT, DEFAULT_AVATAR_ELEMENT, DEFAULT_AVATAR_STACK_ELEMENT, DEFAULT_BADGE_ELEMENT, DEFAULT_BOX_ELEMENT, DEFAULT_BREADCRUMBS_ELEMENT, DEFAULT_BUTTON_ELEMENT, DEFAULT_CARD_ELEMENT, DEFAULT_CHECKBOX_ELEMENT, DEFAULT_CODE_ELEMENT, DEFAULT_CODE_SKELETON_ELEMENT, DEFAULT_CONTAINER_ELEMENT, DEFAULT_DIALOG_ELEMENT, DEFAULT_ELEMENT_QUERY_ELEMENT, DEFAULT_FLEX_ELEMENT, DEFAULT_GRID_ELEMENT, DEFAULT_HEADING_ELEMENT, DEFAULT_HEADING_SKELETON_ELEMENT, DEFAULT_HOTKEYS_ELEMENT, DEFAULT_INLINE_CODE_ELEMENT, DEFAULT_INLINE_ELEMENT, DEFAULT_KBD_ELEMENT, DEFAULT_LABEL_ELEMENT, DEFAULT_LABEL_SKELETON_ELEMENT, DEFAULT_LAYER_ELEMENT, DEFAULT_MENU_DIVIDER_ELEMENT, DEFAULT_MENU_ELEMENT, DEFAULT_MENU_GROUP_ELEMENT, DEFAULT_MENU_ITEM_ELEMENT, DEFAULT_RADIO_ELEMENT, DEFAULT_ROOT_ELEMENT, DEFAULT_SELECTABLE_ELEMENT, DEFAULT_SELECT_ELEMENT, DEFAULT_SKELETON_ELEMENT, DEFAULT_SPINNER_ELEMENT, DEFAULT_SR_ONLY_ELEMENT, DEFAULT_STACK_ELEMENT, DEFAULT_SWITCH_ELEMENT, DEFAULT_TAB_ELEMENT, DEFAULT_TAB_LIST_ELEMENT, DEFAULT_TAB_PANEL_ELEMENT, DEFAULT_TEXT_AREA_ELEMENT, DEFAULT_TEXT_ELEMENT, DEFAULT_TEXT_INPUT_ELEMENT, DEFAULT_TEXT_SKELETON_ELEMENT, DEFAULT_TOAST_ELEMENT, DEFAULT_TOOLTIP_ELEMENT, DEFAULT_TREE_ELEMENT, DEFAULT_TREE_ITEM_ELEMENT, DEFAULT_VIRTUAL_LIST_ELEMENT, Delay, Dialog, DialogContext, DialogContextValue, DialogElementType, DialogOwnProps, DialogPosition, DialogProps, DialogProvider, DialogProviderProps, ELEMENT_TONES, ElementQuery, ElementQueryElementType, ElementQueryOwnProps, ElementQueryProps, ElementRectValue, ElementSize, ElementType, EmptyProps, ErrorBoundary, ErrorBoundaryProps, ErrorBoundaryState, FONT_CODE_SIZE, FONT_HEADING_SIZE, FONT_LABEL_SIZE, FONT_TEXT_SIZE, FONT_WEIGHT, Flex, FlexElementType, FlexOwnProps, FlexProps, Grid, GridElementType, GridOwnProps, GridProps, HUES, Heading, HeadingElementType, HeadingOwnProps, HeadingProps, HeadingSkeleton, HeadingSkeletonElementType, HeadingSkeletonOwnProps, HeadingSkeletonProps, Hotkeys, HotkeysElementType, HotkeysOwnProps, HotkeysProps, Inline, InlineCode, InlineCodeProps, InlineElementType, InlineOwnProps, InlineProps, KBD, KBDElementType, KBDOwnProps, KBDProps, Label, LabelElementType, LabelOwnProps, LabelProps, LabelSkeleton, LabelSkeletonElementType, LabelSkeletonOwnProps, LabelSkeletonProps, Layer, LayerContextValue, LayerElementType, LayerOwnProps, LayerProps, LayerProvider, LayerProviderProps, LazySyntax, Menu, MenuButton, MenuButtonProps, MenuDivider, MenuDividerElementType, MenuDividerOwnProps, MenuDividerProps, MenuElementType, MenuGroup, MenuGroupElementType, MenuGroupOwnProps, MenuGroupProps, MenuItem, MenuItemElementType, MenuItemOwnProps, MenuItemProps, MenuOwnProps, MenuProps, Placement, Popover, PopoverElementType, PopoverMargins, PopoverOwnProps, PopoverProps, PopoverUpdateCallback, PopoverWidth, Portal, PortalContextValue, PortalProps, PortalProvider, PortalProviderProps, Props, RADIUS, Radio, RadioElementType, RadioOwnProps, RadioProps, type ResponsiveProp, ResponsiveWidthStyleProps, Root, RootElementType, RootOwnProps, RootProps, RootProvider, RootProviderProps, SHADOW, SPACE, Select, SelectElementType, SelectOwnProps, SelectProps, Selectable, SelectableElementType, SelectableOwnProps, SelectableProps, Skeleton, SkeletonElementType, SkeletonOwnProps, SkeletonProps, Spinner, SpinnerElementType, SpinnerOwnProps, SpinnerProps, SrOnly, SrOnlyElementType, SrOnlyOwnProps, SrOnlyProps, Stack, StackElementType, StackOwnProps, StackProps, Switch, SwitchElementType, SwitchOwnProps, SwitchProps, TINTS, Tab, TabElementType, TabList, TabListElementType, TabListOwnProps, TabListProps, TabOwnProps, TabPanel, TabPanelElementType, TabPanelOwnProps, TabPanelProps, TabProps, TagType, Text, TextArea, TextAreaElementType, TextAreaOwnProps, TextAreaProps, TextElementType, TextInput, TextInputClearButtonProps, TextInputElementType, TextInputOwnProps, TextInputProps, TextOwnProps, TextProps, TextSkeleton, TextSkeletonElementType, TextSkeletonOwnProps, TextSkeletonProps, Toast, ToastContextValue, ToastElementType, ToastOwnProps, ToastParams, ToastProps, ToastProvider, ToastProviderProps, Tooltip, TooltipDelayGroupContext, TooltipDelayGroupContextValue, TooltipDelayGroupProvider, TooltipDelayGroupProviderProps, TooltipElementType, TooltipOwnProps, TooltipProps, Tree, TreeContextValue, TreeElementType, TreeItem, TreeItemElementType, TreeItemOwnProps, TreeItemProps, TreeOwnProps, TreeProps, TreeState, VirtualList, VirtualListChangeOpts, VirtualListElementType, VirtualListOwnProps, VirtualListProps, _CODE_TOKEN_KEYS, _CardCompatProviderComponent, _CardInternalContextValue, _ElementSizeListener, _ElementSizeObserver, _ElementSizeSubscriber, _MediaStore, _elementSizeObserver, _getResponsiveProp, _hasFocus, _isEnterToClickElement, _isScrollable, _raf, _raf2, attemptFocus, containsOrEqualsElement, focusFirstDescendant, focusLastDescendant, isFocusable, isHTMLAnchorElement, isHTMLButtonElement, isHTMLElement, isHTMLInputElement, isHTMLSelectElement, isHTMLTextAreaElement, useBoundaryElement, useCard, useClickOutsideEvent, useCustomValidity, useDialog, useElementSize, useGlobalKeyDown, useLayer, useMatchMedia, useMediaIndex, usePortal, usePrefersDark, usePrefersReducedMotion, useToast, useTooltipDelayGroup, useTree, vars };
1754
+ //# sourceMappingURL=index.d.ts.map