@marigold/components 5.5.0 → 6.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/index.d.ts +301 -319
  2. package/dist/index.js +2255 -1758
  3. package/dist/index.mjs +2195 -1716
  4. package/package.json +61 -57
package/dist/index.d.ts CHANGED
@@ -1,16 +1,25 @@
1
1
  export { useAsyncList, useListData } from '@react-stately/data';
2
- import { ThemeExtensionsWithParts, CSSObject, ThemeExtension, ThemeComponentProps, ResponsiveStyleValue, StateAttrProps, BoxOwnProps, Theme as Theme$1, ThemeProviderProps, GlobalProps, SVGProps } from '@marigold/system';
3
- export { Box, BoxOwnProps, BoxProps, ThemeProvider, useTheme } from '@marigold/system';
4
2
  import React, { ReactElement, ReactNode, Key, HTMLAttributes, LabelHTMLAttributes, ForwardRefExoticComponent, RefAttributes } from 'react';
5
- import { TreeState } from '@react-stately/tree';
3
+ import { AriaAccordionProps } from '@react-aria/accordion';
6
4
  import * as _react_types_shared from '@react-types/shared';
7
- import { ItemElement, ItemProps, Node, PressEvents, CollectionElement, StyleProps } from '@react-types/shared';
5
+ import { ItemElement, ItemProps, Node, PressEvents, FocusableDOMProps, CollectionElement, StyleProps, LabelableProps, HelpTextProps } from '@react-types/shared';
6
+ import { TreeState } from '@react-stately/tree';
7
+ import { GapSpaceProp, AspectProp, WidthProp, AlignmentProp, alignment, PaddingSpaceProp, PaddingSpacePropX, PaddingSpacePropY, PaddingRightProp, PaddingLeftProp, PaddingBottomProp, PaddingTopProp, PlaceItemsProp, GridColumn, GridColsAlignProp, StateAttrProps, TextAlignProp, ObjectFitProp, ObjectPositionProp, Theme, ThemeProviderProps, FontSizeProp, FontWeightProp, FontStyleProp, CursorProp, SVGProps } from '@marigold/system';
8
+ export { ThemeProvider, useTheme } from '@marigold/system';
9
+ import { NonZeroPercentage, HtmlProps, PropsOf, PolymorphicComponent } from '@marigold/types';
8
10
  import { SearchAutocompleteProps } from '@react-types/autocomplete';
9
- import { HtmlProps, PropsOf, PolymorphicComponent, NonZeroPercentage } from '@marigold/types';
11
+ import { ComboBoxProps as ComboBoxProps$1 } from '@react-types/combobox';
10
12
  import { AriaCheckboxProps, AriaCheckboxGroupProps } from '@react-types/checkbox';
13
+ import { CheckboxGroupState } from '@react-stately/checkbox';
11
14
  import { AriaDialogProps } from '@react-types/dialog';
12
15
  import { SeparatorProps } from '@react-aria/separator';
16
+ import { AriaDateFieldProps, AriaDatePickerProps } from '@react-aria/datepicker';
17
+ import { DateValue, CalendarDate } from '@internationalized/date';
18
+ import { AriaCalendarProps, DateValue as DateValue$1, AriaCalendarCellProps, AriaCalendarGridProps } from '@react-aria/calendar';
19
+ import { CalendarState } from '@react-stately/calendar';
13
20
  import { AriaNumberFieldProps } from '@react-types/numberfield';
21
+ import { OverlayProps as OverlayProps$1, AriaPopoverProps, AriaModalOverlayProps } from '@react-aria/overlays';
22
+ import { OverlayTriggerState } from '@react-stately/overlays';
14
23
  import { AriaRadioGroupProps, AriaRadioProps } from '@react-types/radio';
15
24
  import { Item, Section } from '@react-stately/collections';
16
25
  import { AriaSelectProps } from '@react-types/select';
@@ -21,20 +30,16 @@ import { TableStateProps, RowProps as RowProps$1, TableBody, Cell, Column, Table
21
30
  import { AriaTextFieldProps } from '@react-types/textfield';
22
31
  import { PositionProps } from '@react-types/overlays';
23
32
  import { TooltipTriggerProps as TooltipTriggerProps$1 } from '@react-types/tooltip';
24
- import { AriaAccordionProps } from '@react-aria/accordion';
25
- import { aspect, size } from '@marigold/tokens';
26
- import { CheckboxGroupState } from '@react-stately/checkbox';
27
- import { OverlayProps as OverlayProps$1, AriaPopoverProps, AriaModalOverlayProps } from '@react-aria/overlays';
28
- import { OverlayTriggerState } from '@react-stately/overlays';
29
- export { SSRProvider } from '@react-aria/ssr';
33
+ import { AriaTagGroupProps } from '@react-aria/tag';
30
34
  export { VisuallyHidden } from '@react-aria/visually-hidden';
35
+ import { AriaTabListProps } from '@react-types/tabs';
31
36
 
32
37
  interface AccordionProps extends Omit<AriaAccordionProps<object>, 'children' | 'expandedKeys' | 'disabledKeys' | 'onExpandedChange'> {
33
38
  children: ItemElement<object>[] | ItemElement<object>;
34
39
  selectionMode?: string;
35
40
  }
36
41
  declare const Accordion: {
37
- ({ children, ...props }: AccordionProps): JSX.Element;
42
+ ({ children, ...props }: AccordionProps): React.JSX.Element;
38
43
  Item: <T>(props: AccordionOwnItemProps<T>) => JSX.Element;
39
44
  };
40
45
  interface AccordionOwnItemProps<T> extends ItemProps<T> {
@@ -43,20 +48,34 @@ interface AccordionOwnItemProps<T> extends ItemProps<T> {
43
48
  title: string | ReactElement;
44
49
  }
45
50
 
46
- interface AccordionThemeExtension extends ThemeExtensionsWithParts<'Accordion', ['button', 'item']> {
47
- }
48
51
  interface AccordionItemProps {
49
52
  item: Node<object>;
50
53
  state: TreeState<object>;
51
- css?: CSSObject;
52
54
  title: string | ReactNode;
53
55
  variant?: string;
54
56
  size?: string;
55
57
  }
56
- declare const AccordionItem: ({ item, state, css, title, variant, size, ...props }: AccordionItemProps) => JSX.Element;
58
+ declare const AccordionItem: ({ item, state, title, variant, size, ...props }: AccordionItemProps) => React.JSX.Element;
57
59
 
58
- interface AutocompleteThemeExtension extends ThemeExtensionsWithParts<'Autocomplete', ['icon', 'clear']> {
60
+ interface AsideProps extends GapSpaceProp {
61
+ children: [ReactElement, ReactElement];
62
+ side?: 'left' | 'right';
63
+ sideWidth?: string;
64
+ stretch?: boolean;
65
+ wrap?: NonZeroPercentage;
59
66
  }
67
+ declare const Aside: ({ children, sideWidth, space, side, stretch, wrap, }: AsideProps) => React.JSX.Element;
68
+
69
+ /**
70
+ * Based on https://theme-ui.com/components/aspect-ratio
71
+ */
72
+
73
+ interface AspectProps extends HtmlProps<'div'>, AspectProp {
74
+ children?: ReactNode;
75
+ maxWidth?: string;
76
+ }
77
+ declare const Aspect: ({ ratio, maxWidth, children, }: AspectProps) => React.JSX.Element;
78
+
60
79
  interface AutocompleteProps extends Omit<SearchAutocompleteProps<object>, 'isDisabled' | 'isRequired' | 'isReadonly' | 'validationState' | 'icon' | 'onInputChange' | 'inputValue' | 'defaultInputValue'> {
61
80
  disabled?: boolean;
62
81
  required?: boolean;
@@ -80,32 +99,53 @@ interface AutocompleteProps extends Omit<SearchAutocompleteProps<object>, 'isDis
80
99
  onSubmit?: (key: Key | null, value: string | null) => void;
81
100
  variant?: string;
82
101
  size?: string;
83
- width?: string;
102
+ width?: WidthProp['width'];
84
103
  }
85
104
  declare const Autocomplete: {
86
- ({ disabled, required, readOnly, error, onChange, value, defaultValue, variant, size, width, ...rest }: AutocompleteProps): JSX.Element;
105
+ ({ disabled, required, readOnly, error, onChange, value, defaultValue, variant, size, width, ...rest }: AutocompleteProps): React.JSX.Element;
87
106
  Item: <T>(props: _react_types_shared.ItemProps<T>) => JSX.Element;
88
107
  };
89
108
 
90
- interface BadgeThemeExtension extends ThemeExtension<'Badge'> {
109
+ interface ComboBoxProps extends Omit<ComboBoxProps$1<object>, 'isDisabled' | 'isRequired' | 'isReadOnly' | 'defaultInputValue' | 'inputValue' | 'onInputChange'> {
110
+ variant?: string;
111
+ size?: string;
112
+ error?: boolean;
113
+ width?: WidthProp['width'];
114
+ disabled?: boolean;
115
+ required?: boolean;
116
+ readOnly?: boolean;
117
+ defaultValue?: ComboBoxProps$1<object>['defaultInputValue'];
118
+ value?: ComboBoxProps$1<object>['inputValue'];
119
+ onChange?: ComboBoxProps$1<object>['onInputChange'];
91
120
  }
121
+ declare const ComboBox: {
122
+ ({ error, width, disabled, required, readOnly, defaultValue, value, onChange, variant, size, ...rest }: ComboBoxProps): React.JSX.Element;
123
+ Item: <T>(props: _react_types_shared.ItemProps<T>) => JSX.Element;
124
+ };
125
+
92
126
  interface BadgeProps extends HtmlProps<'div'> {
93
127
  children?: React.ReactNode;
94
128
  variant?: string;
95
129
  size?: string;
96
130
  }
97
- declare const Badge: ({ variant, size, children, ...props }: BadgeProps) => JSX.Element;
131
+ declare const Badge: ({ variant, size, children, ...props }: BadgeProps) => React.JSX.Element;
98
132
 
99
- interface BodyThemeExtension extends ThemeExtension<'Body'> {
100
- }
101
- interface BodyProps extends ThemeComponentProps, HtmlProps<'section'> {
133
+ interface BreakoutProps extends HtmlProps<'div'>, AlignmentProp {
102
134
  children?: ReactNode;
135
+ height?: string;
136
+ alignX?: keyof typeof alignment.horizontal.alignmentX;
137
+ alignY?: keyof typeof alignment.horizontal.alignmentY;
103
138
  }
104
- declare const Body: ({ children, variant, size, ...props }: BodyProps) => JSX.Element;
139
+ declare const Breakout: ({ height, children, orientation, alignX, alignY, ...props }: BreakoutProps) => React.JSX.Element;
105
140
 
106
- interface ButtonThemeExtension extends ThemeExtension<'Button'> {
141
+ interface BodyProps extends HtmlProps<'section'> {
142
+ children?: ReactNode;
143
+ variant?: string;
144
+ size?: string;
107
145
  }
108
- interface ButtonOwnProps extends PressEvents, HtmlProps<'button'> {
146
+ declare const Body: ({ children, variant, size, ...props }: BodyProps) => React.JSX.Element;
147
+
148
+ interface ButtonOwnProps extends PressEvents, FocusableDOMProps, HtmlProps<'button'> {
109
149
  children?: ReactNode;
110
150
  variant?: string;
111
151
  size?: string;
@@ -115,36 +155,33 @@ interface ButtonProps extends PropsOf<typeof Button> {
115
155
  }
116
156
  declare const Button: PolymorphicComponent<"button", ButtonOwnProps>;
117
157
 
118
- interface CardThemeExtension extends ThemeExtension<'Card'> {
158
+ interface CardProps extends HtmlProps<'div'>, GapSpaceProp, PaddingSpaceProp, PaddingSpacePropX, PaddingSpacePropY, PaddingRightProp, PaddingLeftProp, PaddingBottomProp, PaddingTopProp {
159
+ children?: ReactNode;
160
+ variant?: string;
161
+ size?: string;
162
+ p?: PaddingSpaceProp['space'];
163
+ px?: PaddingSpacePropX['spaceX'];
164
+ py?: PaddingSpacePropY['spaceY'];
119
165
  }
120
- interface CardProps extends ThemeComponentProps, HtmlProps<'div'> {
166
+ declare const Card: ({ children, variant, size, space, p, px, py, pt, pb, pl, pr, ...props }: CardProps) => React.JSX.Element;
167
+
168
+ interface CenterProps extends HtmlProps<'div'>, GapSpaceProp {
121
169
  children?: ReactNode;
122
- space?: ResponsiveStyleValue<string>;
123
- p?: ResponsiveStyleValue<string>;
124
- px?: ResponsiveStyleValue<string>;
125
- py?: ResponsiveStyleValue<string>;
126
- pt?: ResponsiveStyleValue<string>;
127
- pb?: ResponsiveStyleValue<string>;
128
- pl?: ResponsiveStyleValue<string>;
129
- pr?: ResponsiveStyleValue<string>;
130
- }
131
- declare const Card: ({ children, variant, size, space, p, px, py, pt, pb, pl, pr, ...props }: CardProps) => JSX.Element;
132
-
133
- interface CheckboxThemeExtension extends ThemeExtensionsWithParts<'Checkbox', [
134
- 'container',
135
- 'label',
136
- 'checkbox'
137
- ]> {
170
+ maxWidth?: string;
138
171
  }
172
+ declare const Center: ({ maxWidth, space, children, ...props }: CenterProps) => React.JSX.Element;
173
+
139
174
  /**
140
175
  * `react-aria` has a slightly different API for the above events.
141
176
  * Thus, we adjust our regular props to match them.
142
177
  */
143
178
  type CustomCheckboxProps = 'value' | 'onChange' | 'onFocus' | 'onBlur' | 'onKeyDown' | 'onKeyUp';
144
- interface CheckboxProps extends ThemeComponentProps, Omit<HtmlProps<'input'>, 'size' | 'type' | 'defaultValue' | CustomCheckboxProps>, Pick<AriaCheckboxProps, CustomCheckboxProps> {
179
+ interface CheckboxProps extends Omit<HtmlProps<'input'>, 'size' | 'type' | 'defaultValue' | CustomCheckboxProps>, Pick<AriaCheckboxProps, CustomCheckboxProps> {
145
180
  children?: ReactNode;
146
181
  indeterminate?: boolean;
147
182
  error?: boolean;
183
+ variant?: string;
184
+ size?: string;
148
185
  }
149
186
  declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
150
187
 
@@ -169,8 +206,36 @@ interface CheckboxGroupProps extends Omit<HtmlProps<'div'>, 'onChange'>, AriaChe
169
206
  value?: string[];
170
207
  defaultValue?: string[];
171
208
  onChange?: (value: string[]) => void;
209
+ width?: WidthProp['width'];
210
+ }
211
+ declare const CheckboxGroup: ({ children, required, disabled, readOnly, error, width, ...rest }: CheckboxGroupProps) => React.JSX.Element;
212
+
213
+ interface ColumnsProps extends GapSpaceProp {
214
+ children?: ReactNode;
215
+ columns: Array<number>;
216
+ collapseAt?: string | 0;
217
+ stretch?: boolean;
218
+ }
219
+ declare const Columns: ({ space, columns, collapseAt, stretch, children, ...props }: ColumnsProps) => React.JSX.Element;
220
+
221
+ interface ContainerProps extends HtmlProps<'div'>, PlaceItemsProp, GridColumn, GridColsAlignProp {
222
+ children?: ReactNode;
223
+ contentType?: 'content' | 'header';
224
+ size?: keyof typeof content | keyof typeof header;
225
+ align?: 'left' | 'right' | 'center';
226
+ alignItems?: PlaceItemsProp['align'];
172
227
  }
173
- declare const CheckboxGroup: ({ children, required, disabled, readOnly, error, ...rest }: CheckboxGroupProps) => JSX.Element;
228
+ declare const content: {
229
+ small: string;
230
+ medium: string;
231
+ large: string;
232
+ };
233
+ declare const header: {
234
+ small: string;
235
+ medium: string;
236
+ large: string;
237
+ };
238
+ declare const Container: ({ contentType, size, align, alignItems, children, ...props }: ContainerProps) => React.JSX.Element;
174
239
 
175
240
  interface DialogControllerProps {
176
241
  children: ReactNode;
@@ -191,8 +256,6 @@ interface DialogContextProps {
191
256
  close?: () => void;
192
257
  }
193
258
 
194
- interface DialogThemeExtension extends ThemeExtensionsWithParts<'Dialog', ['container', 'closeButton']> {
195
- }
196
259
  interface DialogChildProps {
197
260
  close: DialogContextProps['close'];
198
261
  titleProps: HTMLAttributes<HTMLElement>;
@@ -204,36 +267,29 @@ interface DialogProps extends AriaDialogProps {
204
267
  closeButton?: boolean;
205
268
  }
206
269
  declare const Dialog: {
207
- ({ children, variant, size, closeButton, ...props }: DialogProps): JSX.Element;
208
- Trigger: ({ children, dismissable, keyboardDismissable, }: DialogTriggerProps) => JSX.Element;
209
- Controller: ({ children, dismissable, keyboardDismissable, open, onOpenChange, }: DialogControllerProps) => JSX.Element;
270
+ ({ children, variant, size, closeButton, ...props }: DialogProps): React.JSX.Element;
271
+ Trigger: ({ children, dismissable, keyboardDismissable, }: DialogTriggerProps) => React.JSX.Element;
272
+ Controller: ({ children, dismissable, keyboardDismissable, open, onOpenChange, }: DialogControllerProps) => React.JSX.Element;
210
273
  };
211
274
 
212
- interface DividerThemeExtension extends ThemeExtension<'Divider'> {
213
- }
214
275
  interface DividerProps extends SeparatorProps {
215
276
  variant?: string;
216
277
  }
217
- declare const Divider: ({ variant, ...props }: DividerProps) => JSX.Element;
278
+ declare const Divider: ({ variant, ...props }: DividerProps) => React.JSX.Element;
218
279
 
219
- interface LabelThemeExtension extends ThemeExtension<'Label'> {
220
- }
221
280
  interface LabelProps extends HtmlProps<'label'> {
222
281
  as?: 'label' | 'span';
223
282
  variant?: string;
224
283
  size?: string;
225
- required?: boolean;
226
284
  labelWidth?: string;
227
285
  }
228
- declare const Label: ({ as, required, children, variant, size, labelWidth, ...props }: LabelProps) => JSX.Element;
286
+ declare const Label: ({ as, children, variant, size, labelWidth, ...props }: LabelProps) => React.JSX.Element;
229
287
 
230
- interface FieldBaseProps {
288
+ interface FieldBaseProps extends WidthProp {
231
289
  children?: ReactNode;
232
290
  variant?: string;
233
291
  size?: string;
234
- width?: string;
235
292
  disabled?: boolean;
236
- required?: boolean;
237
293
  label?: ReactNode;
238
294
  labelProps?: LabelHTMLAttributes<HTMLLabelElement> & Pick<LabelProps, 'as'>;
239
295
  description?: ReactNode;
@@ -243,9 +299,7 @@ interface FieldBaseProps {
243
299
  errorMessageProps?: HTMLAttributes<HTMLElement>;
244
300
  stateProps?: StateAttrProps;
245
301
  }
246
- interface FieldThemeExtension extends ThemeExtension<'Field'> {
247
- }
248
- declare const FieldBase: ({ children, variant, size, width, disabled, required, label, labelProps, description, descriptionProps, error, errorMessage, errorMessageProps, stateProps, ...props }: FieldBaseProps) => JSX.Element;
302
+ declare const FieldBase: ({ children, variant, size, width, disabled, label, labelProps, description, descriptionProps, error, errorMessage, errorMessageProps, stateProps, ...props }: FieldBaseProps) => React.JSX.Element;
249
303
 
250
304
  interface FieldGroupContextProps {
251
305
  labelWidth?: string;
@@ -256,62 +310,125 @@ interface FieldGroupProps {
256
310
  labelWidth?: string;
257
311
  children: ReactNode;
258
312
  }
259
- declare const FieldGroup: ({ labelWidth, children }: FieldGroupProps) => JSX.Element;
313
+ declare const FieldGroup: ({ labelWidth, children }: FieldGroupProps) => React.JSX.Element;
260
314
 
261
- interface FooterThemeExtension extends ThemeExtension<'Footer'> {
262
- }
263
- interface FooterProps extends ThemeComponentProps, HtmlProps<'footer'> {
315
+ interface FooterProps extends HtmlProps<'footer'> {
264
316
  children?: ReactNode;
317
+ variant?: string;
318
+ size?: string;
265
319
  }
266
- declare const Footer: ({ children, variant, size, ...props }: FooterProps) => JSX.Element;
320
+ declare const Footer: ({ children, variant, size, ...props }: FooterProps) => React.JSX.Element;
267
321
 
268
- interface HeaderThemeExtension extends ThemeExtension<'Header'> {
269
- }
270
- interface HeaderProps extends ThemeComponentProps, HtmlProps<'header'> {
322
+ interface HeaderProps extends HtmlProps<'header'> {
271
323
  children?: ReactNode;
324
+ variant?: string;
325
+ size?: string;
272
326
  }
273
- declare const Header: ({ children, variant, size, ...props }: HeaderProps) => JSX.Element;
327
+ declare const Header: ({ children, variant, size, className, ...props }: HeaderProps) => React.JSX.Element;
274
328
 
275
- interface HeadlineThemeExtension extends ThemeExtension<'Headline'> {
276
- }
277
- interface HeadlineProps extends ThemeComponentProps, HtmlProps<'h1'> {
329
+ interface HeadlineProps extends HtmlProps<'h1'>, TextAlignProp {
278
330
  children?: ReactNode;
279
331
  level?: '1' | '2' | '3' | '4' | '5' | '6';
280
- align?: CSSObject['textAlign'];
281
332
  color?: string;
333
+ variant?: string;
334
+ size?: string;
335
+ as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
282
336
  }
283
- declare const Headline: ({ children, variant, size, align, color, level, ...props }: HeadlineProps) => JSX.Element;
284
-
285
- interface HelpTextThemeExtension extends ThemeExtensionsWithParts<'HelpText', ['container', 'icon']> {
286
- }
337
+ declare const Headline: ({ children, variant, size, align, color, level, as, ...props }: HeadlineProps) => React.JSX.Element;
287
338
 
288
- interface ImageThemeExtension extends ThemeExtension<'Image'> {
289
- }
290
- interface ImageProps extends HtmlProps<'img'> {
339
+ interface ImageProps extends HtmlProps<'img'>, ObjectFitProp, ObjectPositionProp {
291
340
  variant?: string;
292
341
  size?: string;
293
- fit?: CSSObject['objectFit'];
294
- position?: CSSObject['objectPosition'];
295
342
  children?: never;
296
343
  alt: string;
297
344
  }
298
- declare const Image: ({ variant, size, fit, position, ...props }: ImageProps) => JSX.Element;
345
+ declare const Image: ({ variant, size, fit, position, ...props }: ImageProps) => React.JSX.Element;
299
346
 
300
- interface InputThemeExtension extends ThemeExtensionsWithParts<'Input', ['input', 'icon', 'container']> {
347
+ interface InlineProps extends AlignmentProp, GapSpaceProp {
348
+ children?: ReactNode;
349
+ alignX?: keyof typeof alignment.horizontal.alignmentX;
350
+ alignY?: keyof typeof alignment.horizontal.alignmentY;
301
351
  }
302
- interface InputOwnProps extends Omit<HtmlProps<'input'>, 'size'> {
352
+ declare const Inline: ({ space, orientation, alignX, alignY, children, ...props }: InlineProps) => React.JSX.Element;
353
+
354
+ interface InputOwnProps extends Omit<HtmlProps<'input'>, 'size' | 'className'> {
303
355
  icon?: ReactElement;
304
356
  action?: ReactElement;
305
357
  variant?: string;
306
358
  size?: string;
359
+ className?: {
360
+ container?: string;
361
+ input?: string;
362
+ icon?: string;
363
+ };
307
364
  }
308
- interface InputProps extends Omit<React.ComponentPropsWithRef<'input'>, 'size'>, InputOwnProps {
365
+ interface InputProps extends Omit<React.ComponentPropsWithRef<'input'>, 'size' | 'className'>, InputOwnProps {
309
366
  }
310
367
  declare const Input: React.ForwardRefExoticComponent<InputOwnProps & React.RefAttributes<HTMLInputElement>>;
311
368
 
312
- interface LinkThemeExtension extends ThemeExtension<'Link'> {
369
+ interface DateFieldProps extends Omit<AriaDateFieldProps<DateValue>, 'isDisabled' | 'isReadOnly' | 'isRequired'> {
370
+ onChange?: (value: DateValue) => void;
371
+ value?: DateValue | null;
372
+ defaultValue?: DateValue | null;
373
+ ref?: React.RefObject<unknown> | undefined;
374
+ triggerRef?: React.RefObject<HTMLDivElement> | undefined;
375
+ action?: ReactElement;
376
+ isPressed?: boolean;
377
+ error?: boolean;
378
+ errorMessageProps?: HTMLAttributes<HTMLElement>;
379
+ disabled?: boolean;
380
+ readOnly?: boolean;
381
+ required?: boolean;
382
+ variant?: string;
383
+ size?: string;
384
+ width?: WidthProp['width'];
313
385
  }
314
- interface LinkOwnProps extends PressEvents, BoxOwnProps {
386
+ declare const DateField: ({ disabled, readOnly, required, error, errorMessage, errorMessageProps, variant, size, action, isPressed, triggerRef, width, ...res }: DateFieldProps) => React.JSX.Element;
387
+
388
+ interface CalendarProps extends Omit<AriaCalendarProps<DateValue$1>, 'isDisabled' | 'isReadOnly'> {
389
+ disabled?: boolean;
390
+ readOnly?: boolean;
391
+ variant?: string;
392
+ size?: string;
393
+ }
394
+ declare const Calendar: ({ disabled, readOnly, size, variant, ...rest }: CalendarProps) => React.JSX.Element;
395
+
396
+ interface CalendarCellProps extends AriaCalendarCellProps {
397
+ state: CalendarState;
398
+ }
399
+ declare const CalendarCell: (props: CalendarCellProps) => React.JSX.Element;
400
+
401
+ interface CalendarGridProps extends AriaCalendarGridProps {
402
+ state: CalendarState;
403
+ }
404
+ declare const CalendarGrid: ({ state, ...props }: CalendarGridProps) => React.JSX.Element;
405
+
406
+ interface DatePickerProps extends Omit<AriaDatePickerProps<CalendarDate>, 'isDisabled' | 'isRequired' | 'isReadOnly' | 'isOpen'> {
407
+ disabled?: boolean;
408
+ required?: boolean;
409
+ readonly?: boolean;
410
+ open?: boolean;
411
+ error?: boolean;
412
+ shouldCloseOnSelect?: boolean;
413
+ variant?: string;
414
+ size?: string;
415
+ }
416
+ declare const DatePicker: ({ disabled, required, readonly, open, error, shouldCloseOnSelect, variant, size, ...rest }: DatePickerProps) => React.JSX.Element;
417
+
418
+ type InsetProps = {
419
+ children: ReactNode;
420
+ space?: never;
421
+ spaceX?: PaddingSpacePropX['spaceX'];
422
+ spaceY?: PaddingSpacePropY['spaceY'];
423
+ } | {
424
+ children: ReactNode;
425
+ space?: PaddingSpaceProp['space'];
426
+ spaceX?: never;
427
+ spaceY?: never;
428
+ };
429
+ declare const Inset: ({ space, spaceX, spaceY, children, }: InsetProps) => React.JSX.Element;
430
+
431
+ interface LinkOwnProps extends PressEvents {
315
432
  disabled?: boolean;
316
433
  variant?: string;
317
434
  size?: string;
@@ -325,8 +442,6 @@ interface ListItemProps extends HtmlProps<'li'> {
325
442
  children?: ReactNode;
326
443
  }
327
444
 
328
- interface ListThemeExtension extends ThemeExtensionsWithParts<'List', ['ul', 'ol', 'item']> {
329
- }
330
445
  interface ListProps extends HtmlProps<'ul'> {
331
446
  variant?: string;
332
447
  size?: string;
@@ -334,19 +449,10 @@ interface ListProps extends HtmlProps<'ul'> {
334
449
  children?: ReactNode;
335
450
  }
336
451
  declare const List: {
337
- ({ as, children, variant, size, ...props }: ListProps): JSX.Element;
338
- Item: ({ children, ...props }: ListItemProps) => JSX.Element;
452
+ ({ as, children, variant, size, ...props }: ListProps): React.JSX.Element;
453
+ Item: ({ children, ...props }: ListItemProps) => React.JSX.Element;
339
454
  };
340
455
 
341
- interface ListBoxThemeExtension extends ThemeExtensionsWithParts<'ListBox', [
342
- 'container',
343
- 'list',
344
- 'option',
345
- 'section',
346
- 'sectionTitle'
347
- ]> {
348
- }
349
-
350
456
  interface MenuTriggerProps {
351
457
  children: [trigger: ReactNode, menu: ReactNode];
352
458
  disabled?: boolean;
@@ -354,8 +460,6 @@ interface MenuTriggerProps {
354
460
  onOpenChange?: (isOpen: boolean) => void;
355
461
  }
356
462
 
357
- interface MenuThemeExtension extends ThemeExtensionsWithParts<'Menu', ['container', 'item', 'section']> {
358
- }
359
463
  interface MenuProps extends Omit<HtmlProps<'ul'>, 'onSelect' | 'size'> {
360
464
  children: CollectionElement<object> | CollectionElement<object>[];
361
465
  variant?: string;
@@ -363,32 +467,28 @@ interface MenuProps extends Omit<HtmlProps<'ul'>, 'onSelect' | 'size'> {
363
467
  onAction?: (key: Key) => void;
364
468
  }
365
469
  declare const Menu: {
366
- ({ variant, size, ...props }: MenuProps): JSX.Element;
367
- Trigger: ({ disabled, open, onOpenChange, children, }: MenuTriggerProps) => JSX.Element;
470
+ ({ variant, size, ...props }: MenuProps): React.JSX.Element;
471
+ Trigger: ({ disabled, open, onOpenChange, children, }: MenuTriggerProps) => React.JSX.Element;
368
472
  Item: <T>(props: _react_types_shared.ItemProps<T>) => JSX.Element;
369
473
  Section: <T_1>(props: _react_types_shared.SectionProps<T_1>) => JSX.Element;
370
474
  };
371
475
 
372
476
  interface ActionMenuProps extends MenuProps {
373
477
  }
374
- declare const ActionMenu: (props: ActionMenuProps) => JSX.Element;
478
+ declare const ActionMenu: (props: ActionMenuProps) => React.JSX.Element;
375
479
 
376
- interface MessageThemeExtension extends ThemeExtensionsWithParts<'Message', [
377
- 'container',
378
- 'icon',
379
- 'title',
380
- 'content'
381
- ]> {
382
- }
480
+ declare const icons: {
481
+ info: () => React.JSX.Element;
482
+ warning: () => React.JSX.Element;
483
+ error: () => React.JSX.Element;
484
+ };
383
485
  interface MessageProps extends HtmlProps<'div'> {
384
486
  messageTitle: ReactNode;
385
- variant?: string;
487
+ variant?: keyof typeof icons;
386
488
  size?: string;
387
489
  }
388
- declare const Message: ({ messageTitle, variant, size, children, ...props }: MessageProps) => JSX.Element;
490
+ declare const Message: ({ messageTitle, variant, size, children, ...props }: MessageProps) => React.JSX.Element;
389
491
 
390
- interface NumberFieldThemeExtension extends ThemeExtensionsWithParts<'NumberField', ['group', 'stepper']> {
391
- }
392
492
  /**
393
493
  * `react-aria` has a slightly different API for some DOM props.
394
494
  * Thus, we adjust our regular props to match them.
@@ -397,7 +497,7 @@ type CustomProps = 'size' | 'width' | 'type' | 'value' | 'defaultValue' | 'step'
397
497
  interface NumberFieldProps extends Omit<HtmlProps<'input'>, CustomProps>, Omit<AriaNumberFieldProps, 'isDisabled' | 'isRequired' | 'isReadOnly'>, Pick<FieldBaseProps, 'label' | 'description' | 'error' | 'errorMessage'> {
398
498
  variant?: string;
399
499
  size?: string;
400
- width?: string;
500
+ width?: WidthProp['width'];
401
501
  hideStepper?: boolean;
402
502
  }
403
503
  declare const NumberField: React.ForwardRefExoticComponent<NumberFieldProps & React.RefAttributes<HTMLInputElement>>;
@@ -416,7 +516,7 @@ interface OverlayProps {
416
516
  children: OverlayProps$1['children'];
417
517
  container?: OverlayProps$1['portalContainer'];
418
518
  }
419
- declare const Overlay: ({ children, container, open }: OverlayProps) => JSX.Element | null;
519
+ declare const Overlay: ({ children, container, open }: OverlayProps) => React.JSX.Element | null;
420
520
 
421
521
  interface PopoverProps extends Pick<AriaPopoverProps, 'triggerRef' | 'scrollRef' | 'isNonModal'> {
422
522
  keyboardDismissDisabled?: AriaPopoverProps['isKeyboardDismissDisabled'];
@@ -434,29 +534,31 @@ interface TrayWrapperProps extends TrayProps {
434
534
  declare const Tray: React.ForwardRefExoticComponent<TrayProps & React.RefAttributes<HTMLDivElement>>;
435
535
  declare const TrayWrapper: React.ForwardRefExoticComponent<TrayWrapperProps & React.RefAttributes<HTMLDivElement>>;
436
536
 
437
- interface UnderlayThemeExtension extends ThemeExtension<'Underlay'> {
438
- }
439
537
  interface UnderlayProps extends HTMLAttributes<HTMLElement> {
440
538
  variant?: string;
441
539
  size?: string;
442
540
  }
443
- declare const Underlay: ({ size, variant, ...props }: UnderlayProps) => JSX.Element;
541
+ declare const Underlay: ({ size, variant, ...props }: UnderlayProps) => React.JSX.Element;
542
+
543
+ interface MarigoldProviderProps<T extends Theme> extends ThemeProviderProps<T> {
544
+ }
545
+ declare function MarigoldProvider<T extends Theme>({ children, theme, }: MarigoldProviderProps<T>): React.JSX.Element;
444
546
 
445
547
  interface RadioGroupProps extends Omit<AriaRadioGroupProps, 'isDisabled' | 'isRquired' | 'isReadOnly ' | 'validationState'> {
446
548
  children: ReactNode[];
447
- width?: string;
549
+ width?: WidthProp['width'];
448
550
  required?: boolean;
449
551
  disabled?: boolean;
450
552
  readOnly?: boolean;
451
553
  error?: boolean;
452
554
  }
453
- declare const RadioGroup: ({ children, orientation, width, required, disabled, readOnly, error, ...rest }: RadioGroupProps) => JSX.Element;
555
+ declare const RadioGroup: ({ children, orientation, width, required, disabled, readOnly, error, ...rest }: RadioGroupProps) => React.JSX.Element;
454
556
 
455
- interface RadioThemeExtension extends ThemeExtensionsWithParts<'Radio', ['container', 'label', 'radio']> {
456
- }
457
557
  type CustomRadioProps = 'size' | 'width' | 'type' | 'defaultChecked' | 'value' | 'onFocus' | 'onBlur' | 'onKeyUp' | 'onKeyDown';
458
- interface RadioProps extends ThemeComponentProps, Omit<HtmlProps<'input'>, CustomRadioProps>, AriaRadioProps {
558
+ interface RadioProps extends Omit<HtmlProps<'input'>, CustomRadioProps>, AriaRadioProps {
459
559
  width?: string;
560
+ variant?: string;
561
+ size?: string;
460
562
  disabled?: boolean;
461
563
  }
462
564
  declare const Radio: RadioComponent;
@@ -468,12 +570,10 @@ interface RadioComponent extends ForwardRefExoticComponent<RadioProps & RefAttri
468
570
  Group: typeof RadioGroup;
469
571
  }
470
572
 
471
- interface SelectThemeExtension extends ThemeExtensionsWithParts<'Select', ['container', 'button', 'icon']> {
472
- }
473
573
  interface SelectProps extends Omit<AriaSelectProps<object>, 'autoComplete' | 'isOpen' | 'isLoading' | 'onLoadMore' | 'isDisabled' | 'isRequired' | 'validationState' | 'onSelectionChange'>, Omit<HtmlProps<'select'>, 'onKeyUp' | 'onKeyDown' | 'onFocus' | 'onBlur' | 'children' | 'size' | 'onChange'> {
474
574
  variant?: string;
475
575
  size?: string;
476
- width?: string;
576
+ width?: WidthProp['width'];
477
577
  open?: boolean;
478
578
  disabled?: boolean;
479
579
  required?: boolean;
@@ -494,13 +594,6 @@ interface SelectComponent extends ForwardRefExoticComponent<SelectProps & RefAtt
494
594
  * Thanks to react-aria: https://react-spectrum.adobe.com/react-aria/useSlider.html
495
595
  */
496
596
 
497
- interface SliderThemeExtension extends ThemeExtensionsWithParts<'Slider', [
498
- 'track',
499
- 'thumb',
500
- 'label',
501
- 'output'
502
- ]> {
503
- }
504
597
  interface SliderProps extends Omit<HtmlProps<'input'>, 'step' | 'value' | 'defaultValue' | 'onChange' | 'onFocus' | 'onBlur' | 'size' | 'width'>,
505
598
  /**
506
599
  * `react-aria` has a slightly different API for some events e.g `onChange`, `onFocus`
@@ -520,29 +613,27 @@ Pick<AriaSliderProps, 'maxValue' | 'step' | 'value' | 'defaultValue' | 'onChange
520
613
  */
521
614
  declare const Slider: React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<HTMLDivElement>>;
522
615
 
523
- interface SwitchThemeExtension extends ThemeExtensionsWithParts<'Switch', [
524
- 'container',
525
- 'label',
526
- 'track',
527
- 'thumb'
528
- ]> {
616
+ interface SplitProps extends HtmlProps<'div'> {
529
617
  }
618
+ declare const Split: (props: SplitProps) => React.JSX.Element;
619
+
620
+ interface StackProps extends AlignmentProp, GapSpaceProp {
621
+ children?: ReactNode;
622
+ stretch?: boolean;
623
+ alignX?: keyof typeof alignment.vertical.alignmentX;
624
+ alignY?: keyof typeof alignment.vertical.alignmentY;
625
+ }
626
+ declare const Stack: ({ children, space, stretch, orientation, alignX, alignY, ...props }: StackProps) => React.JSX.Element;
627
+
530
628
  type CustomSwitchProps = 'size' | 'value' | 'onBlur' | 'onChange' | 'onFocus' | 'onKeyDown' | 'onKeyUp';
531
629
  interface SwitchProps extends Omit<AriaSwitchProps, 'isSelected'>, Omit<HtmlProps<'input'>, CustomSwitchProps> {
532
- checked?: boolean;
630
+ selected?: boolean;
533
631
  variant?: string;
534
632
  size?: string;
535
633
  width?: string;
536
634
  }
537
635
  declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLInputElement>>;
538
636
 
539
- interface TableThemeExtension extends ThemeExtensionsWithParts<'Table', [
540
- 'table',
541
- 'header',
542
- 'row',
543
- 'cell'
544
- ]> {
545
- }
546
637
  interface TableProps extends Pick<AriaTableProps<object>, 'focusMode' | 'onRowAction' | 'onCellAction'>, Omit<TableStateProps<object>, 'showSelectionCheckboxes'> {
547
638
  variant?: string;
548
639
  size?: string;
@@ -566,23 +657,14 @@ interface Table {
566
657
  Row: (props: RowProps) => JSX.Element;
567
658
  }
568
659
 
569
- interface TextThemeExtension extends ThemeExtension<'Text'> {
570
- }
571
- interface TextProps extends ThemeComponentProps, HtmlProps<'p'> {
572
- display?: CSSObject['display'];
573
- align?: CSSObject['textAlign'];
574
- color?: string;
575
- cursor?: string;
576
- fontSize?: string;
577
- fontWeight?: string;
578
- fontStyle?: string;
579
- outline?: string;
660
+ interface TextProps extends HtmlProps<'p'>, TextAlignProp, FontSizeProp, FontWeightProp, FontStyleProp, CursorProp {
580
661
  children?: React.ReactNode;
662
+ variant?: string;
663
+ color?: string;
664
+ size?: string;
581
665
  }
582
- declare const Text: ({ variant, size, display, align, color, fontSize, fontStyle, fontWeight, cursor, outline, children, ...props }: TextProps) => JSX.Element;
666
+ declare const Text: ({ variant, size, color, align, cursor, weight, fontSize, fontStyle, children, ...props }: TextProps) => React.JSX.Element;
583
667
 
584
- interface TextAreaThemeExtension extends ThemeExtension<'TextArea'> {
585
- }
586
668
  /**
587
669
  * `react-aria` has a slightly different API for the above events.
588
670
  * Thus, we adjust our regular props to match them.
@@ -591,155 +673,12 @@ type CustomTextAreaEvents = 'onChange' | 'onFocus' | 'onBlur' | 'onCopy' | 'onSe
591
673
  interface TextAreaProps extends Omit<HtmlProps<'textarea'>, 'value' | 'defaultValue' | 'size' | CustomTextAreaEvents>, Pick<AriaTextFieldProps, CustomTextAreaEvents>, Pick<FieldBaseProps, 'label' | 'description' | 'error' | 'errorMessage'> {
592
674
  variant?: string;
593
675
  size?: string;
594
- width?: string;
676
+ width?: WidthProp['width'];
595
677
  value?: string;
596
678
  defaultValue?: string;
597
679
  }
598
680
  declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;
599
681
 
600
- interface TooltipTriggerProps extends Omit<TooltipTriggerProps$1, 'isDisabled' | 'isOpen'>, Omit<PositionProps, 'isOpen'> {
601
- children: [trigger: ReactElement, menu: ReactElement];
602
- disabled?: boolean;
603
- open?: boolean;
604
- }
605
-
606
- interface TooltipThemeExtension extends ThemeExtensionsWithParts<'Tooltip', ['container', 'arrow']> {
607
- }
608
- interface TooltipProps extends HtmlProps<'div'> {
609
- children?: ReactNode;
610
- variant?: string;
611
- size?: string;
612
- }
613
- declare const Tooltip: {
614
- ({ children, variant, size }: TooltipProps): JSX.Element;
615
- Trigger: ({ disabled, open, delay, placement, children, ...rest }: TooltipTriggerProps) => JSX.Element;
616
- };
617
-
618
- interface ComponentStyles extends AccordionThemeExtension, AutocompleteThemeExtension, BadgeThemeExtension, ButtonThemeExtension, CardThemeExtension, CheckboxThemeExtension, BodyThemeExtension, DialogThemeExtension, DividerThemeExtension, FieldThemeExtension, FooterThemeExtension, HeaderThemeExtension, HeadlineThemeExtension, HelpTextThemeExtension, ImageThemeExtension, InputThemeExtension, LabelThemeExtension, LinkThemeExtension, ListThemeExtension, ListBoxThemeExtension, MenuThemeExtension, MessageThemeExtension, NumberFieldThemeExtension, RadioThemeExtension, SelectThemeExtension, SliderThemeExtension, SwitchThemeExtension, TableThemeExtension, TextThemeExtension, TextAreaThemeExtension, TooltipThemeExtension, UnderlayThemeExtension {
619
- }
620
- interface Theme extends Theme$1 {
621
- components: ComponentStyles;
622
- }
623
- interface CustomizedTheme extends Theme$1 {
624
- components?: Partial<ComponentStyles>;
625
- }
626
- declare const extendTheme: (baseTheme: Theme, extendTheme: CustomizedTheme) => Theme;
627
-
628
- interface AsideProps {
629
- children: [ReactElement, ReactElement];
630
- side?: 'left' | 'right';
631
- sideWidth?: ResponsiveStyleValue<string>;
632
- space?: ResponsiveStyleValue<string>;
633
- stretch?: boolean;
634
- wrap?: NonZeroPercentage;
635
- }
636
- declare const Aside: ({ children, sideWidth, space, side, stretch, wrap, }: AsideProps) => JSX.Element;
637
-
638
- /**
639
- * Based on https://theme-ui.com/components/aspect-ratio
640
- */
641
-
642
- interface AspectProps extends HtmlProps<'div'> {
643
- children?: ReactNode;
644
- ratio?: keyof typeof aspect;
645
- maxWidth?: string;
646
- }
647
- declare const Aspect: ({ ratio, maxWidth, children, }: AspectProps) => JSX.Element;
648
-
649
- interface BreakoutProps extends HtmlProps<'div'> {
650
- children?: ReactNode;
651
- alignY?: 'top' | 'bottom' | 'center';
652
- alignX?: 'left' | 'right' | 'center';
653
- height?: string;
654
- }
655
- declare const Breakout: ({ alignX, alignY, height, children, ...props }: BreakoutProps) => JSX.Element;
656
-
657
- interface CenterProps extends HtmlProps<'div'> {
658
- children?: ReactNode;
659
- maxWidth?: string;
660
- space?: ResponsiveStyleValue<string>;
661
- }
662
- declare const Center: ({ maxWidth, space, children, ...props }: CenterProps) => JSX.Element;
663
-
664
- interface ColumnsProps {
665
- children?: ReactNode;
666
- columns: Array<number>;
667
- space?: ResponsiveStyleValue<string>;
668
- columnLimit?: number;
669
- collapseAt?: string | 0;
670
- stretch?: boolean;
671
- }
672
- declare const Columns: ({ space, columns, collapseAt, stretch, children, ...props }: ColumnsProps) => JSX.Element;
673
-
674
- interface ContainerProps extends HtmlProps<'div'> {
675
- children?: ReactNode;
676
- contentType?: 'content' | 'header';
677
- size?: keyof typeof size.content | keyof typeof size.header;
678
- align?: 'left' | 'right' | 'center';
679
- alignItems?: 'left' | 'right' | 'center' | 'none';
680
- }
681
- declare const Container: ({ contentType, size, align, alignItems, children, ...props }: ContainerProps) => JSX.Element;
682
-
683
- declare const ALIGNMENT_X$1: {
684
- left: string;
685
- center: string;
686
- right: string;
687
- };
688
- declare const ALIGNMENT_Y$1: {
689
- top: string;
690
- center: string;
691
- bottom: string;
692
- };
693
- interface InlineProps {
694
- children?: ReactNode;
695
- space?: ResponsiveStyleValue<string>;
696
- alignX?: keyof typeof ALIGNMENT_X$1;
697
- alignY?: keyof typeof ALIGNMENT_Y$1;
698
- }
699
- declare const Inline: ({ space, alignX, alignY, children, ...props }: InlineProps) => JSX.Element;
700
-
701
- type InsetProps = {
702
- children: ReactNode;
703
- space?: never;
704
- spaceX?: ResponsiveStyleValue<string>;
705
- spaceY?: ResponsiveStyleValue<string>;
706
- } | {
707
- children: ReactNode;
708
- space?: ResponsiveStyleValue<string>;
709
- spaceX?: never;
710
- spaceY?: never;
711
- };
712
- declare const Inset: ({ space, spaceX, spaceY, children }: InsetProps) => JSX.Element;
713
-
714
- interface MarigoldProviderProps<T extends Theme$1> extends ThemeProviderProps<T>, GlobalProps {
715
- }
716
- declare function MarigoldProvider<T extends Theme$1>({ children, theme, selector, normalizeDocument, }: MarigoldProviderProps<T>): JSX.Element;
717
-
718
- interface SplitProps extends HtmlProps<'div'> {
719
- }
720
- declare const Split: (props: SplitProps) => JSX.Element;
721
-
722
- declare const ALIGNMENT_X: {
723
- none: string;
724
- left: string;
725
- center: string;
726
- right: string;
727
- };
728
- declare const ALIGNMENT_Y: {
729
- none: string;
730
- top: string;
731
- center: string;
732
- bottom: string;
733
- };
734
- interface StackProps {
735
- children?: ReactNode;
736
- space?: ResponsiveStyleValue<string>;
737
- alignX?: keyof typeof ALIGNMENT_X;
738
- alignY?: keyof typeof ALIGNMENT_Y;
739
- stretch?: boolean;
740
- }
741
- declare const Stack: ({ children, space, alignX, alignY, stretch, ...props }: StackProps) => JSX.Element;
742
-
743
682
  /**
744
683
  * `react-aria` has a slightly different API for the above events.
745
684
  * Thus, we adjust our regular props to match them.
@@ -753,21 +692,64 @@ interface TextFieldProps extends Omit<HtmlProps<'input'>, 'value' | 'defaultValu
753
692
  Pick<AriaTextFieldProps, CustomTextFieldEvents>, Pick<FieldBaseProps, 'label' | 'description' | 'error' | 'errorMessage'> {
754
693
  variant?: string;
755
694
  size?: string;
756
- width?: string;
695
+ width?: WidthProp['width'];
757
696
  value?: string;
758
697
  defaultValue?: string;
759
698
  }
760
699
  declare const TextField: React.ForwardRefExoticComponent<TextFieldProps & React.RefAttributes<HTMLInputElement>>;
761
700
 
762
- interface TilesProps {
701
+ interface TilesProps extends GapSpaceProp {
763
702
  children: ReactNode;
764
703
  tilesWidth: string;
765
- space?: ResponsiveStyleValue<string>;
766
704
  stretch?: boolean;
767
705
  equalHeight?: boolean;
768
706
  }
769
- declare const Tiles: ({ space, stretch, equalHeight, tilesWidth, children, ...props }: TilesProps) => JSX.Element;
707
+ declare const Tiles: ({ space, stretch, equalHeight, tilesWidth, children, ...props }: TilesProps) => React.JSX.Element;
708
+
709
+ interface TooltipTriggerProps extends Omit<TooltipTriggerProps$1, 'isDisabled' | 'isOpen'>, Omit<PositionProps, 'isOpen'> {
710
+ children: [trigger: ReactElement, menu: ReactElement];
711
+ disabled?: boolean;
712
+ open?: boolean;
713
+ }
714
+
715
+ interface TooltipProps extends HtmlProps<'div'> {
716
+ children?: ReactNode;
717
+ variant?: string;
718
+ size?: string;
719
+ }
720
+ declare const Tooltip: {
721
+ ({ children, variant, size }: TooltipProps): React.JSX.Element;
722
+ Trigger: ({ disabled, open, delay, placement, children, ...rest }: TooltipTriggerProps) => React.JSX.Element;
723
+ };
724
+
725
+ interface TagGroupProps extends Omit<AriaTagGroupProps<object>, 'isRequired' | 'validationState'>, LabelableProps, HelpTextProps {
726
+ width?: WidthProp['width'];
727
+ required?: boolean;
728
+ error?: boolean;
729
+ allowsRemoving?: boolean;
730
+ }
731
+ declare const TagGroup: ({ width, required, error, allowsRemoving, ...rest }: TagGroupProps) => React.JSX.Element;
732
+
733
+ declare const Tag: TagComponent;
734
+ /**
735
+ * We need this so that TypeScripts allows us to add
736
+ * additional properties to the component (function).
737
+ */
738
+ type ItemComponent = typeof Item;
739
+ interface TagComponent extends ItemComponent {
740
+ Group: typeof TagGroup;
741
+ }
770
742
 
771
743
  declare const XLoader: React.ForwardRefExoticComponent<SVGProps & React.RefAttributes<SVGElement>>;
772
744
 
773
- export { Accordion, AccordionItem, AccordionItemProps, AccordionOwnItemProps, AccordionProps, AccordionThemeExtension, ActionMenu, Aside, AsideProps, Aspect, AspectProps, Autocomplete, AutocompleteProps, AutocompleteThemeExtension, Badge, BadgeProps, BadgeThemeExtension, Body, BodyProps, BodyThemeExtension, Breakout, BreakoutProps, Button, ButtonOwnProps, ButtonProps, ButtonThemeExtension, Card, CardProps, CardThemeExtension, Center, CenterProps, Checkbox, CheckboxGroup, CheckboxGroupContext, CheckboxGroupContextProps, CheckboxGroupProps, CheckboxProps, CheckboxThemeExtension, Columns, ColumnsProps, Container, ContainerProps, CustomCheckboxProps, CustomRadioProps, CustomSwitchProps, CustomTextAreaEvents, CustomTextFieldEvents, CustomizedTheme, Dialog, DialogChildProps, DialogProps, DialogThemeExtension, Divider, DividerProps, DividerThemeExtension, FieldBase, FieldBaseProps, FieldGroup, FieldGroupContext, FieldGroupContextProps, FieldGroupProps, FieldThemeExtension, Footer, FooterProps, FooterThemeExtension, Header, HeaderProps, HeaderThemeExtension, Headline, HeadlineProps, HeadlineThemeExtension, Image, ImageProps, ImageThemeExtension, Inline, InlineProps, Input, InputOwnProps, InputProps, InputThemeExtension, Inset, InsetProps, Label, LabelProps, LabelThemeExtension, Link, LinkOwnProps, LinkProps, LinkThemeExtension, List, ListProps, ListThemeExtension, MarigoldProvider, MarigoldProviderProps, Menu, MenuProps, MenuThemeExtension, Message, MessageProps, MessageThemeExtension, Modal, ModalProps, NumberField, NumberFieldProps, NumberFieldThemeExtension, Overlay, OverlayProps, Popover, PopoverProps, Radio, RadioComponent, RadioGroupProps, RadioProps, RadioThemeExtension, RowProps, Select, SelectComponent, SelectProps, SelectThemeExtension, Slider, SliderProps, SliderThemeExtension, Split, SplitProps, Stack, StackProps, Switch, SwitchProps, SwitchThemeExtension, Table, TableProps, TableThemeExtension, Text, TextArea, TextAreaProps, TextAreaThemeExtension, TextField, TextFieldProps, TextProps, TextThemeExtension, Theme, Tiles, TilesProps, Tooltip, TooltipProps, TooltipThemeExtension, Tray, TrayProps, TrayWrapper, Underlay, UnderlayProps, UnderlayThemeExtension, XLoader, extendTheme, useCheckboxGroupContext, useFieldGroupContext };
745
+ interface TabsProps extends Omit<AriaTabListProps<object>, 'orientation' | 'isDisabled'>, GapSpaceProp {
746
+ size?: 'small' | 'medium' | 'large';
747
+ disabled?: boolean;
748
+ variant?: string;
749
+ }
750
+ declare const Tabs: {
751
+ ({ space, size, disabled, variant, ...rest }: TabsProps): React.JSX.Element;
752
+ Item: <T>(props: _react_types_shared.ItemProps<T>) => JSX.Element;
753
+ };
754
+
755
+ export { Accordion, AccordionItem, AccordionItemProps, AccordionOwnItemProps, AccordionProps, ActionMenu, Aside, AsideProps, Aspect, AspectProps, Autocomplete, AutocompleteProps, Badge, BadgeProps, Body, BodyProps, Breakout, BreakoutProps, Button, ButtonOwnProps, ButtonProps, Calendar, CalendarCell, CalendarCellProps, CalendarGrid, CalendarGridProps, CalendarProps, Card, CardProps, Center, CenterProps, Checkbox, CheckboxGroup, CheckboxGroupContext, CheckboxGroupContextProps, CheckboxGroupProps, CheckboxProps, Columns, ColumnsProps, ComboBox, ComboBoxProps, Container, ContainerProps, CustomCheckboxProps, CustomRadioProps, CustomSwitchProps, CustomTextAreaEvents, CustomTextFieldEvents, DateField, DateFieldProps, DatePicker, DatePickerProps, Dialog, DialogChildProps, DialogProps, Divider, DividerProps, FieldBase, FieldBaseProps, FieldGroup, FieldGroupContext, FieldGroupContextProps, FieldGroupProps, Footer, FooterProps, Header, HeaderProps, Headline, HeadlineProps, Image, ImageProps, Inline, InlineProps, Input, InputOwnProps, InputProps, Inset, InsetProps, Label, LabelProps, Link, LinkOwnProps, LinkProps, List, ListProps, MarigoldProvider, MarigoldProviderProps, Menu, MenuProps, Message, MessageProps, Modal, ModalProps, NumberField, NumberFieldProps, Overlay, OverlayProps, Popover, PopoverProps, Radio, RadioComponent, RadioGroupProps, RadioProps, RowProps, Select, SelectComponent, SelectProps, Slider, SliderProps, Split, SplitProps, Stack, StackProps, Switch, SwitchProps, Table, TableProps, Tabs, Tag, TagComponent, Text, TextArea, TextAreaProps, TextField, TextFieldProps, TextProps, Tiles, TilesProps, Tooltip, TooltipProps, Tray, TrayProps, TrayWrapper, Underlay, UnderlayProps, XLoader, useCheckboxGroupContext, useFieldGroupContext };