@sanity/ui 3.0.0-static.34 → 3.0.0-static.35

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.
@@ -1,2 +1,853 @@
1
- import { Box, BoxProps, Button, ButtonProps, Card, CardProps, Flex, FlexProps, Grid, GridProps, Hotkeys, HotkeysProps, LayerProvider, Menu, MenuDivider, MenuGroup, MenuGroupProps, MenuItem, MenuItemProps, MenuProps, Popover, PopoverMargins, PopoverProps, Portal, PortalProps, PortalProvider, PortalProviderProps, Spinner, SpinnerProps, Stack, StackProps, Tab, TabList, TabListProps, TabProps, Text, TextInput, TextInputProps, TextProps, Tooltip, TooltipProps, isHTMLAnchorElement, isHTMLElement, usePrefersDark } from "./portalProvider-DgNIVviV.js";
2
- export { Box, BoxProps, Button, ButtonProps, Card, CardProps, Flex, FlexProps, Grid, GridProps, Hotkeys, HotkeysProps, LayerProvider, Menu, MenuDivider, MenuGroup, MenuGroupProps, MenuItem, MenuItemProps, MenuProps, Popover, PopoverMargins, PopoverProps, Portal, PortalProps, PortalProvider, PortalProviderProps, Spinner, SpinnerProps, Stack, StackProps, Tab, TabList, TabListProps, TabProps, Text, TextInput, TextInputProps, TextProps, Tooltip, TooltipProps, isHTMLAnchorElement, isHTMLElement, usePrefersDark };
1
+ import type {AlignItems} from '@sanity/ui/css'
2
+ import {BoxStyleProps} from '@sanity/ui/css'
3
+ import type {ButtonStyleProps} from '@sanity/ui/css'
4
+ import {CardStyleProps} from '@sanity/ui/css'
5
+ import type {CardTone} from '@sanity/ui/theme'
6
+ import type {ColorScheme} from '@sanity/ui/theme'
7
+ import type {ComponentClass} from 'react'
8
+ import type {ComponentProps} from 'react'
9
+ import type {DisplayStyleProps} from '@sanity/ui/css'
10
+ import type {ElementTone} from '@sanity/ui/theme'
11
+ import {ElementType as ElementType_2} from 'react'
12
+ import type {ExoticComponent} from 'react'
13
+ import type {FlexDirection} from '@sanity/ui/css'
14
+ import type {FlexWrap} from '@sanity/ui/css'
15
+ import type {FontTextSize} from '@sanity/ui/theme'
16
+ import type {FontWeight} from '@sanity/ui/theme'
17
+ import {ForwardedRef} from 'react'
18
+ import type {FunctionComponent} from 'react'
19
+ import type {GapStyleProps} from '@sanity/ui/css'
20
+ import {HTMLAttributes} from 'react'
21
+ import {InputStyleProps} from '@sanity/ui/css'
22
+ import type {JSX} from 'react'
23
+ import type {JustifyContent} from '@sanity/ui/css'
24
+ import {MaxWidth} from '@sanity/ui/css'
25
+ import {PaddingStyleProps} from '@sanity/ui/css'
26
+ import {RadiusStyleProps} from '@sanity/ui/css'
27
+ import {ReactElement} from 'react'
28
+ import {ReactNode} from 'react'
29
+ import type {ReactPortal} from 'react'
30
+ import {Ref} from 'react'
31
+ import {RefAttributes} from 'react'
32
+ import {ResponsiveProp} from '@sanity/ui/css'
33
+ import {ShadowStyleProps} from '@sanity/ui/css'
34
+ import type {Space} from '@sanity/ui/theme'
35
+ import {TextOverflowStyleProps} from '@sanity/ui/css'
36
+ import {TextStyleProps} from '@sanity/ui/css'
37
+ import type {Width} from '@sanity/ui/css'
38
+
39
+ /**
40
+ * Assign properties from `U` to `T`, excluding properties that already exist in `T`.
41
+ *
42
+ * @public
43
+ */
44
+ declare type Assign<T extends {}, U extends {}> = Omit<T, keyof U> & U
45
+
46
+ /**
47
+ * The `Box` component is a basic layout wrapper component which provides utility properties
48
+ * for flex, margins and padding.
49
+ *
50
+ * @public
51
+ */
52
+ export declare function Box<E extends BoxElementType = typeof DEFAULT_BOX_ELEMENT>(
53
+ props: BoxProps<E>,
54
+ ): React.JSX.Element
55
+
56
+ /** @public */
57
+ declare type BoxElementType =
58
+ | 'a'
59
+ | 'article'
60
+ | 'aside'
61
+ | 'blockquote'
62
+ | 'body'
63
+ | 'button'
64
+ | 'details'
65
+ | 'div'
66
+ | 'header'
67
+ | 'fieldset'
68
+ | 'figure'
69
+ | 'figcaption'
70
+ | 'footer'
71
+ | 'form'
72
+ | 'html'
73
+ | 'iframe'
74
+ | 'kbd'
75
+ | 'label'
76
+ | 'legend'
77
+ | 'li'
78
+ | 'main'
79
+ | 'nav'
80
+ | 'ol'
81
+ | 'pre'
82
+ | 'section'
83
+ | 'span'
84
+ | 'summary'
85
+ | 'ul'
86
+ | ComponentType
87
+
88
+ /** @public */
89
+ declare type BoxOwnProps = BoxStyleProps
90
+
91
+ /** @public */
92
+ export declare type BoxProps<E extends BoxElementType = BoxElementType> = Props<BoxOwnProps, E>
93
+
94
+ /** @public */
95
+ export declare function Button<E extends ButtonElementType = typeof DEFAULT_BUTTON_ELEMENT>(
96
+ props: ButtonProps<E>,
97
+ ): React.JSX.Element
98
+
99
+ /** @public */
100
+ declare type ButtonElementType = 'a' | 'button' | 'label' | ComponentType
101
+
102
+ /** @public */
103
+ declare type ButtonOwnProps = ButtonStyleProps &
104
+ DisplayStyleProps &
105
+ GapStyleProps &
106
+ PaddingStyleProps & {
107
+ 'align'?: BoxStyleProps['alignItems']
108
+ 'data-ui'?: string
109
+ 'disabled'?: boolean
110
+ 'fontSize'?: ResponsiveProp<FontTextSize>
111
+ 'icon'?: ElementType_2 | ReactNode
112
+ 'iconRight'?: ElementType_2 | ReactNode
113
+ 'justify'?: BoxStyleProps['justifyContent']
114
+ /** @beta Do not use in production, as this might change.*/
115
+ 'loading'?: boolean
116
+ 'selected'?: boolean
117
+ 'textAlign'?: ButtonTextAlign
118
+ 'muted'?: boolean
119
+ 'target'?: string
120
+ 'text'?: ReactNode
121
+ 'textOverflow'?: TextOwnProps['textOverflow']
122
+ 'textWeight'?: TextOwnProps['weight']
123
+ 'width'?: ResponsiveProp<Width>
124
+ }
125
+
126
+ /** @public */
127
+ export declare type ButtonProps<E extends ButtonElementType = ButtonElementType> = Props<
128
+ ButtonOwnProps,
129
+ E
130
+ >
131
+
132
+ /** @public */
133
+ declare type ButtonTextAlign = 'left' | 'right' | 'center'
134
+
135
+ /**
136
+ * The `Card` component acts much like a `Box`, but with a background and foreground color.
137
+ * Components within a `Card` inherit its colors.
138
+ *
139
+ * @public
140
+ */
141
+ export declare function Card<E extends CardElementType = typeof DEFAULT_CARD_ELEMENT>(
142
+ props: CardProps<E>,
143
+ ): React.JSX.Element
144
+
145
+ /** @public */
146
+ declare type CardElementType = BoxElementType
147
+
148
+ /** @public */
149
+ declare interface CardOwnProps extends BoxOwnProps, CardStyleProps {
150
+ /**
151
+ * Do not use in production.
152
+ * @beta
153
+ */
154
+ __unstable_checkered?: boolean
155
+ /**
156
+ * Do not use in production.
157
+ * @beta
158
+ */
159
+ __unstable_focusRing?: boolean
160
+ disabled?: boolean
161
+ pressed?: boolean
162
+ selected?: boolean
163
+ target?: string
164
+ }
165
+
166
+ /** @public */
167
+ export declare type CardProps<E extends CardElementType = CardElementType> = Props<CardOwnProps, E>
168
+
169
+ /** @public */
170
+ declare type ComponentType<P = any> = FunctionComponent<P> | ComponentClass<P> | ExoticComponent<P>
171
+
172
+ /** @public */
173
+ declare const DEFAULT_BOX_ELEMENT = 'div'
174
+
175
+ /** @public */
176
+ declare const DEFAULT_BUTTON_ELEMENT = 'button'
177
+
178
+ /** @public */
179
+ declare const DEFAULT_CARD_ELEMENT = 'div'
180
+
181
+ /** @public */
182
+ declare const DEFAULT_FLEX_ELEMENT = 'div'
183
+
184
+ /** @public */
185
+ declare const DEFAULT_GRID_ELEMENT = 'div'
186
+
187
+ /** @public */
188
+ declare const DEFAULT_HOTKEYS_ELEMENT = 'kbd'
189
+
190
+ /** @public */
191
+ declare const DEFAULT_MENU_DIVIDER_ELEMENT = 'hr'
192
+
193
+ /** @public */
194
+ declare const DEFAULT_MENU_ELEMENT = 'div'
195
+
196
+ /** @public */
197
+ declare const DEFAULT_MENU_GROUP_ELEMENT = 'button'
198
+
199
+ /** @public */
200
+ declare const DEFAULT_MENU_ITEM_ELEMENT = 'button'
201
+
202
+ /** @public */
203
+ declare const DEFAULT_POPOVER_ELEMENT = 'div'
204
+
205
+ /** @public */
206
+ declare const DEFAULT_SPINNER_ELEMENT = 'div'
207
+
208
+ /** @public */
209
+ declare const DEFAULT_STACK_ELEMENT = 'div'
210
+
211
+ /** @public */
212
+ declare const DEFAULT_TAB_ELEMENT = 'button'
213
+
214
+ /** @public */
215
+ declare const DEFAULT_TAB_LIST_ELEMENT = 'div'
216
+
217
+ /** @public */
218
+ declare const DEFAULT_TEXT_ELEMENT = 'div'
219
+
220
+ /** @public */
221
+ declare const DEFAULT_TEXT_INPUT_ELEMENT = 'input'
222
+
223
+ /** @public */
224
+ declare const DEFAULT_TOOLTIP_ELEMENT = 'div'
225
+
226
+ /** @public */
227
+ declare type Delay =
228
+ | number
229
+ | Partial<{
230
+ open: number
231
+ close: number
232
+ }>
233
+
234
+ /** @public */
235
+ declare type ElementType<P> = TagType | ComponentType<P>
236
+
237
+ /** @public */
238
+ declare type EmptyProps = {}
239
+
240
+ /**
241
+ * The `Flex` component is a wrapper component for flexible elements (`Box`, `Card` and `Flex`).
242
+ *
243
+ * @public
244
+ */
245
+ export declare function Flex<E extends FlexElementType = typeof DEFAULT_FLEX_ELEMENT>(
246
+ props: FlexProps<E>,
247
+ ): React.JSX.Element
248
+
249
+ /** @public */
250
+ declare type FlexElementType = BoxElementType
251
+
252
+ /** @public */
253
+ declare type FlexOwnProps = Omit<
254
+ BoxOwnProps,
255
+ 'align' | 'display' | 'flexDirection' | 'flexWrap'
256
+ > & {
257
+ align?: ResponsiveProp<AlignItems>
258
+ direction?: ResponsiveProp<FlexDirection>
259
+ justify?: ResponsiveProp<JustifyContent>
260
+ wrap?: ResponsiveProp<FlexWrap>
261
+ }
262
+
263
+ /** @public */
264
+ export declare type FlexProps<E extends FlexElementType = FlexElementType> = Props<FlexOwnProps, E>
265
+
266
+ /**
267
+ * The `Grid` component is for building 2-dimensional layers (based on CSS grid).
268
+ *
269
+ * @public
270
+ */
271
+ export declare function Grid<E extends GridElementType = typeof DEFAULT_GRID_ELEMENT>(
272
+ props: GridProps<E>,
273
+ ): React.JSX.Element
274
+
275
+ /** @public */
276
+ declare type GridElementType = BoxElementType
277
+
278
+ /** @public */
279
+ declare type GridOwnProps = Omit<BoxOwnProps, 'display'>
280
+
281
+ /** @public */
282
+ export declare type GridProps<E extends GridElementType = GridElementType> = Props<GridOwnProps, E>
283
+
284
+ /**
285
+ * Represent hotkeys (a keyboard combination) with semantic `<kbd>` elements.
286
+ *
287
+ * @public
288
+ */
289
+ export declare function Hotkeys<E extends HotkeysElementType = typeof DEFAULT_HOTKEYS_ELEMENT>(
290
+ props: HotkeysProps<E>,
291
+ ): React.JSX.Element | undefined
292
+
293
+ /** @public */
294
+ declare type HotkeysElementType = 'kbd' | ComponentType
295
+
296
+ /** @public */
297
+ declare interface HotkeysOwnProps extends GapStyleProps, RadiusStyleProps {
298
+ fontSize?: ResponsiveProp<FontTextSize>
299
+ padding?: ResponsiveProp<Space>
300
+ keys?: string[]
301
+ }
302
+
303
+ /** @public */
304
+ export declare type HotkeysProps<E extends HotkeysElementType = HotkeysElementType> = Props<
305
+ HotkeysOwnProps,
306
+ E
307
+ >
308
+
309
+ /**
310
+ * @internal
311
+ */
312
+ export declare function isHTMLAnchorElement(element: unknown): element is HTMLAnchorElement
313
+
314
+ /**
315
+ * @internal
316
+ */
317
+ export declare function isHTMLElement(node: unknown): node is HTMLElement
318
+
319
+ /** @public */
320
+ declare type LayerOwnProps = CardOwnProps & {
321
+ /** A callback that fires when the layer becomes the top layer when it was not the top layer before. */
322
+ onActivate?: (props: {activeElement: HTMLElement | null}) => void
323
+ zOffset?: ResponsiveProp<number>
324
+ }
325
+
326
+ /** @public */
327
+ export declare function LayerProvider(props: LayerProviderProps): React.JSX.Element
328
+
329
+ /** @public */
330
+ declare interface LayerProviderProps {
331
+ children?: ReactNode
332
+ zOffset?: ResponsiveProp<number>
333
+ }
334
+
335
+ /**
336
+ * The `Menu` component is a building block for application menus.
337
+ *
338
+ * @public
339
+ */
340
+ export declare function Menu<E extends MenuElementType = typeof DEFAULT_MENU_ELEMENT>(
341
+ props: MenuProps<E>,
342
+ ): React.JSX.Element
343
+
344
+ /** @public */
345
+ export declare function MenuDivider<
346
+ E extends MenuDividerElementType = typeof DEFAULT_MENU_DIVIDER_ELEMENT,
347
+ >(props: MenuDividerProps<E>): React.JSX.Element
348
+
349
+ /** @public */
350
+ declare type MenuDividerElementType = 'div' | 'hr' | 'span' | ComponentType
351
+
352
+ /** @public */
353
+ declare type MenuDividerOwnProps = {}
354
+
355
+ /** @public */
356
+ declare type MenuDividerProps<E extends MenuDividerElementType = MenuDividerElementType> = Props<
357
+ MenuDividerOwnProps,
358
+ E
359
+ >
360
+
361
+ /** @public */
362
+ declare type MenuElementType = 'div' | 'span' | ComponentType
363
+
364
+ /** @public */
365
+ export declare function MenuGroup<
366
+ E extends MenuGroupElementType = typeof DEFAULT_MENU_GROUP_ELEMENT,
367
+ >(props: MenuGroupProps<E>): React.JSX.Element
368
+
369
+ /** @public */
370
+ declare type MenuGroupElementType = 'button' | ComponentType
371
+
372
+ /** @public */
373
+ declare type MenuGroupOwnProps = RadiusStyleProps & {
374
+ disabled?: boolean
375
+ fontSize?: ResponsiveProp<FontTextSize>
376
+ gap?: ResponsiveProp<Space>
377
+ icon?: ElementType_2 | ReactNode
378
+ menu?: Omit<
379
+ MenuProps<typeof DEFAULT_MENU_ELEMENT>,
380
+ | 'onClickOutside'
381
+ | 'onEscape'
382
+ | 'onItemClick'
383
+ | 'onKeyDown'
384
+ | 'onMouseEnter'
385
+ | 'registerElement'
386
+ | 'shouldFocus'
387
+ | 'onBlurCapture'
388
+ >
389
+ padding?: ResponsiveProp<Space>
390
+ popover?: Omit<PopoverProps, 'content' | 'open'>
391
+ text?: ReactNode
392
+ tone?: ElementTone
393
+ }
394
+
395
+ /** @public */
396
+ export declare type MenuGroupProps<E extends MenuGroupElementType = MenuGroupElementType> = Props<
397
+ MenuGroupOwnProps,
398
+ E
399
+ >
400
+
401
+ /** @public */
402
+ export declare function MenuItem<E extends MenuItemElementType = typeof DEFAULT_MENU_ITEM_ELEMENT>(
403
+ props: MenuItemProps<E>,
404
+ ): React.JSX.Element
405
+
406
+ /** @public */
407
+ declare type MenuItemElementType = 'button' | 'a' | ComponentType
408
+
409
+ /** @public */
410
+ declare type MenuItemOwnProps = GapStyleProps &
411
+ PaddingStyleProps &
412
+ RadiusStyleProps & {
413
+ disabled?: boolean
414
+ fontSize?: ResponsiveProp<FontTextSize>
415
+ hotkeys?: string[]
416
+ icon?: ElementType_2 | ReactNode
417
+ iconRight?: ElementType_2 | ReactNode
418
+ pressed?: boolean
419
+ selected?: boolean
420
+ text?: ReactNode
421
+ tone?: ElementTone
422
+ }
423
+
424
+ /** @public */
425
+ export declare type MenuItemProps<E extends MenuItemElementType = MenuItemElementType> = Omit<
426
+ Props<MenuItemOwnProps, E>,
427
+ 'role'
428
+ >
429
+
430
+ /** @public */
431
+ declare type MenuOwnProps = PaddingStyleProps & {
432
+ 'gap'?: ResponsiveProp<Space>
433
+ 'onClickOutside'?: (event: MouseEvent) => void
434
+ 'onEscape'?: () => void
435
+ 'onItemClick'?: () => void
436
+ 'onItemSelect'?: (index: number) => void
437
+ 'originElement'?: HTMLElement | null
438
+ 'registerElement'?: (el: HTMLElement) => () => void
439
+ 'shouldFocus'?: 'first' | 'last' | null
440
+ 'aria-labelledby'?: string
441
+ }
442
+
443
+ /** @public */
444
+ export declare type MenuProps<E extends MenuElementType = MenuElementType> = Props<MenuOwnProps, E>
445
+
446
+ /**
447
+ * Placement of floating UI elements.
448
+ *
449
+ * @public
450
+ */
451
+ declare type Placement =
452
+ | 'top'
453
+ | 'top-start'
454
+ | 'top-end'
455
+ | 'right'
456
+ | 'right-start'
457
+ | 'right-end'
458
+ | 'bottom'
459
+ | 'bottom-start'
460
+ | 'bottom-end'
461
+ | 'left'
462
+ | 'left-start'
463
+ | 'left-end'
464
+
465
+ /**
466
+ * The `Popover` component is used to display some content on top of another.
467
+ *
468
+ * @public
469
+ */
470
+ export declare function Popover<E extends PopoverElementType = typeof DEFAULT_POPOVER_ELEMENT>(
471
+ props: PopoverProps<E>,
472
+ ): React.JSX.Element
473
+
474
+ /** @public */
475
+ declare type PopoverElementType = 'div' | ComponentType
476
+
477
+ /**
478
+ * @beta
479
+ */
480
+ export declare type PopoverMargins = [number, number, number, number]
481
+
482
+ /** @public */
483
+ declare type PopoverOwnProps = Omit<LayerOwnProps, 'maxWidth'> & {
484
+ /** @beta */
485
+ __unstable_margins?: PopoverMargins
486
+ /**
487
+ * Whether the popover should animate in and out.
488
+ *
489
+ * @beta
490
+ * @defaultValue false
491
+ */
492
+ animate?: boolean
493
+ arrow?: boolean
494
+ children?: ReactElement<{
495
+ ref: ForwardedRef<HTMLElement>
496
+ }>
497
+ /**
498
+ * When `true`, prevent overflow within the current boundary:
499
+ * - by flipping on its side axis
500
+ * - by resizing
501
+ *
502
+ * Note that:
503
+ * - setting `preventOverflow` to `true` also prevents overflow on its side axis
504
+ * - setting `matchReferenceWidth` to `true` also causes the popover to resize
505
+ *
506
+ * @defaultValue false
507
+ */
508
+ constrainSize?: boolean
509
+ content?: ReactNode
510
+ disabled?: boolean
511
+ fallbackPlacements?: Placement[]
512
+ floatingBoundary?: HTMLElement | null
513
+ /**
514
+ * When `true`, set the maximum width to match the reference element, and also prevent overflow within
515
+ * the current boundary by resizing.
516
+ *
517
+ * Note that setting `constrainSize` to `true` also causes the popover to resize
518
+ *
519
+ * @defaultValue false
520
+ */
521
+ matchReferenceWidth?: boolean
522
+ /**
523
+ * When true, blocks all pointer interaction with elements beneath the popover until closed.
524
+ *
525
+ * @beta
526
+ * @defaultValue false
527
+ */
528
+ modal?: boolean
529
+ open?: boolean
530
+ placement?: Placement
531
+ /**
532
+ * When 'flip' (default), the placement is determined from the initial placement and the
533
+ * fallback placements in order. Whichever fits in the viewport first.
534
+ *
535
+ * When 'autoPlacement', the initial placement and all fallback placements are evaluated
536
+ * and the placement with the most viewport space available.
537
+ *
538
+ * Option is only relevant if either `constrainSize` or `preventOverflow` is `true`
539
+ */
540
+ placementStrategy?: 'flip' | 'autoPlacement'
541
+ /** Whether or not to render the popover in a portal element. */
542
+ portal?: boolean | string
543
+ preventOverflow?: boolean
544
+ referenceBoundary?: HTMLElement | null
545
+ /**
546
+ * When defined, the popover will be positioned relative to this element.
547
+ * The children of the popover won't be rendered.
548
+ */
549
+ referenceElement?: HTMLElement | null
550
+ /** @beta */
551
+ updateRef?: Ref<PopoverUpdateCallback | undefined>
552
+ width?: ResponsiveProp<MaxWidth>
553
+ }
554
+
555
+ /** @public */
556
+ export declare type PopoverProps<E extends PopoverElementType = PopoverElementType> = Props<
557
+ PopoverOwnProps,
558
+ E
559
+ >
560
+
561
+ /** @beta */
562
+ declare type PopoverUpdateCallback = () => void
563
+
564
+ /** @public */
565
+ export declare function Portal(props: PortalProps): ReactPortal | null
566
+
567
+ /** @public */
568
+ export declare interface PortalProps {
569
+ children: ReactNode
570
+ /**
571
+ * @beta This API might change. DO NOT USE IN PRODUCTION.
572
+ */
573
+ __unstable_name?: string
574
+ }
575
+
576
+ /** @public */
577
+ export declare function PortalProvider(props: PortalProviderProps): React.JSX.Element
578
+
579
+ /** @public */
580
+ export declare interface PortalProviderProps {
581
+ children: ReactNode
582
+ element?: HTMLElement | null
583
+ /**
584
+ * @beta
585
+ */
586
+ __unstable_elements?: Record<string, HTMLElement | null | undefined>
587
+ }
588
+
589
+ /** @public */
590
+ declare type Props<P extends EmptyProps, E extends ElementType<P>> = Assign<
591
+ E extends TagType ? JSX.IntrinsicElements[E] : ComponentProps<E>,
592
+ P & {
593
+ as?: E
594
+ }
595
+ >
596
+
597
+ /**
598
+ * Indicate that something is loading for an indeterminate amount of time.
599
+ *
600
+ * @public
601
+ */
602
+ export declare function Spinner<E extends SpinnerElementType = typeof DEFAULT_SPINNER_ELEMENT>(
603
+ props: SpinnerProps<E>,
604
+ ): React.JSX.Element
605
+
606
+ /** @public */
607
+ declare type SpinnerElementType = 'div' | 'span' | ComponentType
608
+
609
+ /** @public */
610
+ declare type SpinnerOwnProps = {
611
+ muted?: boolean
612
+ size?: ResponsiveProp<FontTextSize>
613
+ }
614
+
615
+ /** @public */
616
+ export declare type SpinnerProps<E extends SpinnerElementType = SpinnerElementType> = Props<
617
+ SpinnerOwnProps,
618
+ E
619
+ >
620
+
621
+ /**
622
+ * The `Stack` component is used to place elements on top of each other.
623
+ *
624
+ * @public
625
+ */
626
+ export declare function Stack<E extends StackElementType = typeof DEFAULT_STACK_ELEMENT>(
627
+ props: StackProps<E>,
628
+ ): React.JSX.Element
629
+
630
+ /** @public */
631
+ declare type StackElementType = BoxElementType
632
+
633
+ /** @public */
634
+ declare type StackOwnProps = Omit<
635
+ BoxOwnProps,
636
+ | 'align'
637
+ | 'alignItems'
638
+ | 'columns'
639
+ | 'gridTemplateColumns'
640
+ | 'direction'
641
+ | 'display'
642
+ | 'flexDirection'
643
+ | 'flexWrap'
644
+ | 'gapX'
645
+ | 'gapY'
646
+ | 'justify'
647
+ | 'justifyContent'
648
+ | 'rows'
649
+ | 'gridTemplateRows'
650
+ >
651
+
652
+ /** @public */
653
+ export declare type StackProps<E extends StackElementType = StackElementType> = Props<
654
+ StackOwnProps,
655
+ E
656
+ >
657
+
658
+ /** @public */
659
+ export declare function Tab<E extends TabElementType = typeof DEFAULT_TAB_ELEMENT>(
660
+ props: TabProps<E>,
661
+ ): React.JSX.Element
662
+
663
+ /** @public */
664
+ declare type TabElementType = 'button' | ComponentType
665
+
666
+ /** @public */
667
+ export declare function TabList<E extends TabListElementType = typeof DEFAULT_TAB_LIST_ELEMENT>(
668
+ props: TabListProps<E>,
669
+ ): React.JSX.Element
670
+
671
+ /** @public */
672
+ declare type TabListChild = ReactElement<Props<TabProps, 'button'>> | null | undefined | false
673
+
674
+ /** @public */
675
+ declare type TabListElementType = 'div' | 'span' | ComponentType
676
+
677
+ /** @public */
678
+ declare type TabListOwnProps = Omit<FlexOwnProps, 'as' | 'height'> & {
679
+ children: TabListChild[]
680
+ }
681
+
682
+ /** @public */
683
+ export declare type TabListProps<E extends TabListElementType = TabListElementType> = Props<
684
+ TabListOwnProps,
685
+ E
686
+ >
687
+
688
+ /** @public */
689
+ declare type TabOwnProps = {
690
+ /**
691
+ * The `id` of the corresponding `TabPanel` component.
692
+ */
693
+ 'aria-controls': string
694
+ 'id': string
695
+ 'icon'?: ElementType_2 | ReactNode
696
+ 'focused'?: boolean
697
+ 'fontSize'?: ResponsiveProp<FontTextSize>
698
+ 'label'?: ReactNode
699
+ 'padding'?: ResponsiveProp<Space>
700
+ 'selected'?: boolean
701
+ 'tone'?: ElementTone
702
+ }
703
+
704
+ /** @public */
705
+ export declare type TabProps<E extends TabElementType = TabElementType> = Props<TabOwnProps, E>
706
+
707
+ /** @public */
708
+ declare type TagType = keyof JSX.IntrinsicElements
709
+
710
+ /**
711
+ * The `Text` component is an agile, themed typographic element.
712
+ *
713
+ * @public
714
+ */
715
+ declare function Text_2<E extends TextElementType = typeof DEFAULT_TEXT_ELEMENT>(
716
+ props: TextProps<E>,
717
+ ): React.JSX.Element
718
+ export {Text_2 as Text}
719
+
720
+ /** @public */
721
+ declare type TextElementType =
722
+ | 'div'
723
+ | 'h1'
724
+ | 'h2'
725
+ | 'h3'
726
+ | 'h4'
727
+ | 'h5'
728
+ | 'h6'
729
+ | 'label'
730
+ | 'li'
731
+ | 'p'
732
+ | 'span'
733
+ | ComponentType
734
+
735
+ /**
736
+ * Single line text input.
737
+ *
738
+ * @public
739
+ */
740
+ export declare function TextInput<
741
+ E extends TextInputElementType = typeof DEFAULT_TEXT_INPUT_ELEMENT,
742
+ >(props: TextInputProps<E>): React.JSX.Element
743
+
744
+ /** @public */
745
+ declare type TextInputClearButtonProps = Omit<
746
+ ButtonProps<'button'>,
747
+ 'as' | 'onClick' | 'onMouseDown'
748
+ >
749
+
750
+ /** @public */
751
+ declare type TextInputElementType = 'input' | ComponentType
752
+
753
+ /** @public */
754
+ declare type TextInputOwnProps = InputStyleProps & {
755
+ /**
756
+ * @beta
757
+ */
758
+ __unstable_disableFocusRing?: boolean
759
+ /**
760
+ * @beta
761
+ */
762
+ clearButton?: boolean | TextInputClearButtonProps
763
+ customValidity?: string
764
+ icon?: ElementType_2 | ReactNode
765
+ iconRight?: ElementType_2 | ReactNode
766
+ /**
767
+ * @beta
768
+ */
769
+ onClear?: () => void
770
+ prefix?: ReactNode
771
+ suffix?: ReactNode
772
+ weight?: FontWeight
773
+ }
774
+
775
+ /** @public */
776
+ export declare type TextInputProps<E extends TextInputElementType = TextInputElementType> = Props<
777
+ TextInputOwnProps,
778
+ E
779
+ >
780
+
781
+ /** @public */
782
+ declare type TextOwnProps = TextStyleProps & TextOverflowStyleProps
783
+
784
+ /** @public */
785
+ export declare type TextProps<E extends TextElementType = TextElementType> = Props<TextOwnProps, E>
786
+
787
+ /**
788
+ * Tooltips display information when hovering, focusing or tapping.
789
+ *
790
+ * @public
791
+ */
792
+ export declare function Tooltip<E extends TooltipElementType = typeof DEFAULT_TOOLTIP_ELEMENT>(
793
+ props: TooltipProps<E>,
794
+ ): React.JSX.Element
795
+
796
+ /** @public */
797
+ declare type TooltipElementType = 'div' | 'span' | ComponentType
798
+
799
+ /** @public */
800
+ declare type TooltipOwnProps = LayerOwnProps &
801
+ RadiusStyleProps &
802
+ ShadowStyleProps & {
803
+ /**
804
+ * Whether the tooltip should animate in and out.
805
+ *
806
+ * @beta
807
+ * @defaultValue false
808
+ */
809
+ animate?: boolean
810
+ arrow?: boolean
811
+ boundaryElement?: HTMLElement | null
812
+ children?: ReactElement<HTMLAttributes<HTMLElement> & RefAttributes<HTMLElement>>
813
+ content?: ReactNode
814
+ /**
815
+ * Adds a delay to open or close the tooltip.
816
+ *
817
+ * If only a `number` is passed, it will be used for both opening and closing.
818
+ *
819
+ * If an object `{open: number; close:number}` is passed, it can be used to set different delays for each action.
820
+ *
821
+ * @public
822
+ * @defaultValue 0
823
+ */
824
+ delay?: Delay
825
+ disabled?: boolean
826
+ fallbackPlacements?: Placement[]
827
+ placement?: Placement
828
+ /** Whether or not to render the tooltip in a portal element. */
829
+ portal?: boolean | string
830
+ scheme?: ColorScheme
831
+ tone?: CardTone
832
+ }
833
+
834
+ /** @public */
835
+ export declare type TooltipProps<E extends TooltipElementType = TooltipElementType> = Props<
836
+ TooltipOwnProps,
837
+ E
838
+ >
839
+
840
+ /**
841
+ * Returns true if a dark color scheme is preferred, false if a light color scheme is preferred or the preference is not known.
842
+ *
843
+ * @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)
844
+ *
845
+ * If you persist the detected preference in a cookie or a header then you may implement your own server snapshot to read it.
846
+ * 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
847
+ * @example https://gist.github.com/stipsan/13c0cccf8dfc34f4b44bb1b984baf7df
848
+ *
849
+ * @public
850
+ */
851
+ export declare function usePrefersDark(getServerSnapshot?: () => boolean): boolean
852
+
853
+ export {}