@marigold/components 0.8.0 → 0.9.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 +250 -133
  2. package/dist/index.js +1161 -615
  3. package/dist/index.mjs +1192 -602
  4. package/package.json +13 -5
package/dist/index.d.ts CHANGED
@@ -1,17 +1,21 @@
1
- import { Theme as Theme$1, ThemeProviderProps, BoxOwnProps, ResponsiveStyleValue, CSSObject } from '@marigold/system';
1
+ import { Theme as Theme$1, ThemeProviderProps, ThemeExtension, ThemeComponentProps, ThemeExtensionsWithParts, BoxOwnProps, CSSObject, StateAttrProps, ResponsiveStyleValue } from '@marigold/system';
2
2
  export { Box, BoxOwnProps, BoxProps, StyleProps, ThemeProvider, useTheme } from '@marigold/system';
3
- import React, { ReactChild } from 'react';
3
+ import React, { ReactNode, Key, LabelHTMLAttributes, HTMLAttributes, ReactChild } from 'react';
4
4
  import { ComponentProps, PolymorphicPropsWithRef, PolymorphicComponentWithRef, PolymorphicProps, PolymorphicComponent, NonZeroPercentage } from '@marigold/types';
5
- import { ToggleProps } from '@react-types/checkbox';
5
+ import * as _react_types_shared from '@react-types/shared';
6
+ import { PressEvents, CollectionElement, SingleSelection, Node } from '@react-types/shared';
7
+ import { AriaCheckboxProps, AriaCheckboxGroupProps, ToggleProps } from '@react-types/checkbox';
8
+ import { CheckboxGroupState } from '@react-stately/checkbox';
6
9
  import { SeparatorProps } from '@react-aria/separator';
10
+ import { AriaTextFieldProps } from '@react-types/textfield';
7
11
  import { AriaSelectProps } from '@react-types/select';
8
- import { SingleSelection } from '@react-types/shared';
9
12
  import { AriaSwitchProps } from '@react-types/switch';
10
- import { AriaTextFieldProps } from '@react-types/textfield';
13
+ import { TableProps as TableProps$1 } from '@react-aria/table';
14
+ import { TableState, TableStateProps, TableBody, Cell, Column, TableHeader, Row } from '@react-stately/table';
11
15
  import { TooltipTriggerProps } from '@react-types/tooltip';
12
16
  import { aspect, size } from '@marigold/tokens';
13
17
  import * as _react_stately_overlays from '@react-stately/overlays';
14
- import { OverlayProps } from '@react-aria/overlays';
18
+ import { OverlayProps as OverlayProps$1 } from '@react-aria/overlays';
15
19
  import { AriaDialogProps } from '@react-types/dialog';
16
20
  export { VisuallyHidden } from '@react-aria/visually-hidden';
17
21
  export { SSRProvider } from '@react-aria/ssr';
@@ -28,141 +32,222 @@ interface MarigoldProviderProps<T extends Theme$1> extends ThemeProviderProps<T>
28
32
  }
29
33
  declare function MarigoldProvider<T extends Theme$1>({ theme, children, }: MarigoldProviderProps<T>): JSX.Element;
30
34
 
31
- interface BadgeThemeExtension<Value> {
32
- badge?: {
33
- [key: string]: Value;
34
- };
35
+ interface BadgeThemeExtension extends ThemeExtension<'Badge'> {
35
36
  }
36
37
  interface BadgeProps extends ComponentProps<'div'> {
38
+ children?: React.ReactNode;
37
39
  variant?: string;
38
- bgColor?: string;
39
- borderColor?: string;
40
+ size?: string;
40
41
  }
41
- declare const Badge: React.FC<BadgeProps>;
42
+ declare const Badge: ({ variant, size, children, ...props }: BadgeProps) => JSX.Element;
42
43
 
43
- interface ButtonThemeExtension<Value> {
44
- button?: {
45
- [key: string]: Value;
46
- };
44
+ interface ButtonThemeExtension extends ThemeExtension<'Button'> {
45
+ }
46
+ interface ButtonOwnProps extends PressEvents {
47
+ children?: ReactNode;
48
+ variant?: string;
49
+ size?: string;
47
50
  }
48
- interface ButtonProps extends PolymorphicPropsWithRef<BoxOwnProps, 'button'> {
51
+ interface ButtonProps extends PolymorphicPropsWithRef<ButtonOwnProps, 'button'> {
49
52
  }
50
- declare const Button: PolymorphicComponentWithRef<BoxOwnProps, 'button'>;
53
+ declare const Button: PolymorphicComponentWithRef<ButtonOwnProps, 'button'>;
51
54
 
52
- interface CardThemeExtension<Value> {
53
- card?: {
54
- [key: string]: Value;
55
- };
55
+ interface CardThemeExtension extends ThemeExtension<'Card'> {
56
56
  }
57
- interface CardProps extends ComponentProps<'div'> {
58
- title?: string;
59
- width?: ResponsiveStyleValue<string>;
60
- variant?: string;
57
+ interface CardProps extends ThemeComponentProps, ComponentProps<'div'> {
58
+ children?: ReactNode;
61
59
  }
62
- declare const Card: React.FC<CardProps>;
60
+ declare const Card: ({ children, variant, size, ...props }: CardProps) => JSX.Element;
63
61
 
64
- interface CheckboxIconProps {
62
+ interface CheckboxThemeExtension extends ThemeExtensionsWithParts<'Checkbox', [
63
+ 'container',
64
+ 'label',
65
+ 'checkbox'
66
+ ]> {
67
+ }
68
+ /**
69
+ * `react-aria` has a slightly different API for the above events.
70
+ * Thus, we adjust our regular props to match them.
71
+ */
72
+ declare type CustomCheckboxProps = 'value' | 'onChange' | 'onFocus' | 'onBlur';
73
+ interface CheckboxProps extends ThemeComponentProps, Omit<ComponentProps<'input'>, 'size' | 'type' | 'defaultValue' | CustomCheckboxProps>, Pick<AriaCheckboxProps, CustomCheckboxProps> {
74
+ children?: ReactNode;
75
+ indeterminate?: boolean;
76
+ error?: boolean;
77
+ }
78
+ declare const Checkbox: ({ size, variant, disabled, checked, defaultChecked, indeterminate, readOnly, required, error, ...props }: CheckboxProps) => JSX.Element;
79
+
80
+ interface CheckboxGroupContextProps extends CheckboxGroupState {
81
+ error?: boolean;
65
82
  variant?: string;
66
- checked?: boolean;
83
+ size?: string;
84
+ }
85
+ declare const CheckboxGroupContext: React.Context<CheckboxGroupContextProps>;
86
+ declare const useCheckboxGroupContext: () => CheckboxGroupContextProps;
87
+ interface CheckboxGroupThemeExtension extends ThemeExtensionsWithParts<'CheckboxGroup', ['container', 'group']> {
88
+ }
89
+ interface CheckboxGroupProps extends Omit<ComponentProps<'div'>, 'onChange'>, AriaCheckboxGroupProps {
90
+ children?: ReactNode;
91
+ variant?: string;
92
+ size?: string;
93
+ label?: ReactNode;
94
+ required?: boolean;
67
95
  disabled?: boolean;
68
- indeterminated?: boolean;
96
+ readOnly?: boolean;
69
97
  error?: boolean;
98
+ value?: string[];
99
+ defaultValue?: string[];
100
+ onChange?: (value: string[]) => void;
70
101
  }
102
+ declare const CheckboxGroup: ({ children, variant, size, required, disabled, readOnly, error, ...rest }: CheckboxGroupProps) => JSX.Element;
71
103
 
72
- interface CheckboxThemeExtension<Value> {
73
- checkbox?: {
74
- [key: string]: Value;
75
- };
104
+ interface ContentThemeExtension extends ThemeExtension<'Content'> {
76
105
  }
77
- declare type CheckboxInputProps = CheckboxIconProps & ToggleProps & ComponentProps<'input'>;
78
- interface CheckboxProps extends CheckboxInputProps {
79
- id: string;
80
- required?: boolean;
81
- labelVariant?: string;
82
- errorMessage?: string;
106
+ interface ContentProps extends ThemeComponentProps, ComponentProps<'section'> {
107
+ children?: ReactNode;
83
108
  }
84
- declare const Checkbox: React.FC<CheckboxProps>;
109
+ declare const Content: ({ children, variant, size, ...props }: ContentProps) => JSX.Element;
85
110
 
86
- interface DividerThemeExtension<Value> {
87
- divider?: {
88
- [key: string]: Value;
89
- };
111
+ interface DividerThemeExtension extends ThemeExtension<'Divider'> {
90
112
  }
91
113
  interface DividerProps extends SeparatorProps {
92
114
  variant?: string;
93
115
  }
94
- declare const Divider: React.FC<DividerProps>;
116
+ declare const Divider: ({ variant, ...props }: DividerProps) => JSX.Element;
95
117
 
96
- interface ImageThemeExtension<Value> {
97
- image?: {
98
- [key: string]: Value;
99
- };
118
+ interface FooterThemeExtension extends ThemeExtension<'Footer'> {
119
+ }
120
+ interface FooterProps extends ThemeComponentProps, ComponentProps<'footer'> {
121
+ children?: ReactNode;
122
+ }
123
+ declare const Footer: ({ children, variant, size, ...props }: FooterProps) => JSX.Element;
124
+
125
+ interface HeaderThemeExtension extends ThemeExtension<'Header'> {
126
+ }
127
+ interface HeaderProps extends ThemeComponentProps, ComponentProps<'header'> {
128
+ children?: ReactNode;
129
+ }
130
+ declare const Header: ({ children, variant, size, ...props }: HeaderProps) => JSX.Element;
131
+
132
+ interface HeadlineThemeExtension extends ThemeExtension<'Headline'> {
133
+ }
134
+ interface HeadlineProps extends ThemeComponentProps, ComponentProps<'h1'> {
135
+ children?: ReactNode;
136
+ level?: '1' | '2' | '3' | '4' | '5' | '6';
137
+ }
138
+ declare const Headline: ({ children, variant, size, level, ...props }: HeadlineProps) => JSX.Element;
139
+
140
+ interface HelpTextThemeExtension extends ThemeExtensionsWithParts<'HelpText', ['container', 'icon']> {
141
+ }
142
+
143
+ interface ImageThemeExtension extends ThemeExtension<'Image'> {
100
144
  }
101
145
  interface ImageProps extends ComponentProps<'img'> {
102
146
  variant?: string;
103
147
  children?: never;
104
148
  }
105
- declare const Image: React.FC<ImageProps>;
149
+ declare const Image: ({ variant, ...props }: ImageProps) => JSX.Element;
106
150
 
107
- interface InputThemeExtension<Value> {
108
- input?: {
109
- [key: string]: Value;
110
- };
151
+ interface InputThemeExtension extends ThemeExtension<'Input'> {
111
152
  }
112
- interface InputProps extends ComponentProps<'input'> {
153
+ interface InputOwnProps extends Omit<ComponentProps<'input'>, 'size'> {
154
+ size?: string;
113
155
  variant?: string;
114
156
  }
115
- declare const Input: React.FC<InputProps>;
116
-
117
- interface LabelThemeExtension<Value> {
118
- label?: {
119
- [key: string]: Value;
120
- };
157
+ interface InputProps extends Omit<React.ComponentPropsWithRef<'input'>, 'size'>, InputOwnProps {
121
158
  }
122
- declare type LabelBaseProps = {
123
- htmlFor?: string;
124
- variant?: string;
125
- required?: boolean;
126
- color?: ResponsiveStyleValue<string>;
127
- } & ComponentProps<'label'>;
128
- declare const LabelBase: React.FC<LabelProps>;
129
- interface LabelProps extends LabelBaseProps {
130
- required?: boolean;
159
+ declare const Input: React.ForwardRefExoticComponent<InputOwnProps & React.RefAttributes<HTMLInputElement>>;
160
+
161
+ interface LabelThemeExtension$1 extends ThemeExtension<'Label'> {
131
162
  }
132
- declare const Label: React.FC<LabelProps>;
133
163
 
134
- interface LinkThemeExtension<Value> {
135
- link?: Value;
164
+ interface LinkThemeExtension extends ThemeExtension<'Link'> {
136
165
  }
137
166
  interface LinkOwnProps extends BoxOwnProps {
138
167
  disabled?: boolean;
168
+ variant?: string;
169
+ size?: string;
139
170
  }
140
171
  interface LinkProps extends PolymorphicProps<LinkOwnProps, 'a'> {
141
172
  }
142
173
  declare const Link: PolymorphicComponent<LinkOwnProps, "a">;
143
174
 
144
- interface MenuThemeExtension<Value> {
145
- menu?: Value;
175
+ interface MenuTriggerProps {
176
+ children: [trigger: ReactNode, menu: ReactNode];
177
+ disabled?: boolean;
178
+ }
179
+
180
+ interface MenuThemeExtension extends ThemeExtensionsWithParts<'Menu', ['container', 'item']> {
146
181
  }
147
- interface MenuProps {
182
+ interface MenuProps extends Omit<ComponentProps<'ul'>, 'onSelect' | 'size'> {
183
+ children: CollectionElement<object> | CollectionElement<object>[];
148
184
  variant?: string;
149
- label?: string;
150
- onClick: ComponentProps<typeof Button>['onClick'];
151
- show?: boolean;
152
- className?: string;
153
- title?: string;
185
+ size?: string;
186
+ onSelect?: (key: Key) => void;
187
+ }
188
+ declare const Menu: {
189
+ ({ variant, size, ...props }: MenuProps): JSX.Element;
190
+ Trigger: ({ disabled, children }: MenuTriggerProps) => JSX.Element;
191
+ Item: <T>(props: _react_types_shared.ItemProps<T>) => JSX.Element;
192
+ };
193
+
194
+ interface TextThemeExtension extends ThemeExtension<'Text'> {
195
+ }
196
+ interface TextProps extends ThemeComponentProps, ComponentProps<'p'>, Omit<BoxOwnProps, 'variant'> {
197
+ align?: CSSObject['textAlign'];
198
+ color?: string;
199
+ cursor?: string;
200
+ fontSize?: string;
201
+ outline?: string;
202
+ children?: React.ReactNode;
203
+ }
204
+ declare const Text: ({ variant, size, align, color, fontSize, cursor, outline, children, ...props }: TextProps) => JSX.Element;
205
+
206
+ interface FieldBaseProps {
207
+ children?: ReactNode;
208
+ variant?: string;
209
+ size?: string;
210
+ disabled?: boolean;
211
+ required?: boolean;
212
+ label?: ReactNode;
213
+ labelProps?: LabelHTMLAttributes<HTMLLabelElement>;
214
+ description?: ReactNode;
215
+ descriptionProps?: HTMLAttributes<HTMLElement>;
216
+ error?: boolean;
217
+ errorMessage?: ReactNode;
218
+ errorMessageProps?: HTMLAttributes<HTMLElement>;
219
+ stateProps?: StateAttrProps;
154
220
  }
155
- declare const Menu: React.FC<MenuProps>;
156
221
 
157
- interface MenuItemThemeExtension<Value> {
158
- menuItem?: {
222
+ interface TextAreaThemeExtension extends ThemeExtension<'TextArea'> {
223
+ }
224
+ /**
225
+ * `react-aria` has a slightly different API for the above events.
226
+ * Thus, we adjust our regular props to match them.
227
+ */
228
+ declare type CustomTextAreEvents = 'onChange' | 'onFocus' | 'onBlur' | 'onCopy' | 'onSelect' | 'onPaste' | 'onCut' | 'onCompositionStart' | 'onCompositionUpdate' | 'onCompositionEnd' | 'onBeforeInput' | 'onInput';
229
+ interface TextAreaProps extends Omit<ComponentProps<'textarea'>, 'value' | 'defaultValue' | CustomTextAreEvents>, Pick<AriaTextFieldProps, CustomTextAreEvents>, Pick<FieldBaseProps, 'label' | 'description' | 'error' | 'errorMessage'> {
230
+ value?: string;
231
+ defaultValue?: string;
232
+ }
233
+ declare const TextArea: ({ disabled, required, readOnly, error, ...props }: TextAreaProps) => JSX.Element;
234
+
235
+ interface LabelThemeExtension<Value> {
236
+ label?: {
159
237
  [key: string]: Value;
160
238
  };
161
239
  }
162
- interface MenuItemProps extends ComponentProps<typeof Link> {
240
+ declare type LabelBaseProps = {
241
+ htmlFor?: string;
163
242
  variant?: string;
243
+ required?: boolean;
244
+ color?: ResponsiveStyleValue<string>;
245
+ } & ComponentProps<'label'>;
246
+ declare const LabelBase: React.FC<LabelProps>;
247
+ interface LabelProps extends LabelBaseProps {
248
+ required?: boolean;
164
249
  }
165
- declare const MenuItem: React.FC<MenuItemProps>;
250
+ declare const Label: React.FC<LabelProps>;
166
251
 
167
252
  interface MessageThemeExtension<Value> {
168
253
  message?: {
@@ -242,35 +327,52 @@ declare type SwitchProps = {
242
327
  } & AriaSwitchProps & ToggleProps & ComponentProps<'input'>;
243
328
  declare const Switch: React.FC<SwitchProps>;
244
329
 
245
- interface TextThemeExtension<Value> {
246
- text?: {
247
- [key: string]: Value;
248
- };
249
- }
250
- interface TextOwnProps extends BoxOwnProps {
251
- align?: ResponsiveStyleValue<string>;
252
- color?: ResponsiveStyleValue<string>;
253
- cursor?: ResponsiveStyleValue<string>;
254
- size?: ResponsiveStyleValue<keyof Theme$1['fontSizes'] | string>;
255
- outline?: ResponsiveStyleValue<string>;
256
- userSelect?: ResponsiveStyleValue<string>;
257
- }
258
- interface TextProps extends PolymorphicPropsWithRef<TextOwnProps, 'span'> {
330
+ interface TableCellProps {
331
+ item: Node<object>;
332
+ state: TableState<object>;
333
+ /**
334
+ * Wheter it is a cell with a checkbox or a regular data cell
335
+ */
336
+ isSelectionCell?: boolean;
337
+ align?: 'left' | 'center' | 'right';
338
+ css?: CSSObject;
339
+ }
340
+
341
+ interface TableColumnHeaderProps {
342
+ chilren?: ReactNode;
343
+ item: Node<object>;
344
+ state: TableState<object>;
345
+ isSelectionColumn?: boolean;
346
+ align?: 'left' | 'center' | 'right';
347
+ css?: CSSObject;
348
+ }
349
+
350
+ interface TableThemeExtension extends ThemeExtensionsWithParts<'Table', [
351
+ 'table',
352
+ 'header',
353
+ 'row',
354
+ 'cell'
355
+ ]> {
356
+ }
357
+ interface TableProps extends Pick<TableProps$1<object>, 'onRowAction' | 'onCellAction'>, TableStateProps<object> {
358
+ align?: TableCellProps['align'];
359
+ alignHeader?: TableColumnHeaderProps['align'];
360
+ variant?: string;
361
+ size?: string;
259
362
  }
260
- declare const Text: PolymorphicComponentWithRef<TextOwnProps, 'span'>;
261
-
262
- interface TextareaThemeExtension<Value> {
263
- textarea?: {
264
- [key: string]: Value;
265
- };
363
+ declare const Table: Table;
364
+ /**
365
+ * Necessary since TypeScript can not infer the
366
+ * types of the @react-stately components correctly.
367
+ */
368
+ interface Table {
369
+ (props: TableProps): JSX.Element;
370
+ Body: typeof TableBody;
371
+ Cell: typeof Cell;
372
+ Column: typeof Column;
373
+ Header: typeof TableHeader;
374
+ Row: typeof Row;
266
375
  }
267
- declare type TextareaProps = {
268
- variant?: string;
269
- htmlFor: string;
270
- required?: boolean;
271
- error?: boolean;
272
- } & AriaTextFieldProps & ComponentProps<'textarea'>;
273
- declare const Textarea: React.FC<TextareaProps>;
274
376
 
275
377
  interface TooltipThemeExtension<Value> {
276
378
  tooltip?: {
@@ -297,14 +399,11 @@ interface ValidationMessageProps extends ComponentProps<'span'> {
297
399
  }
298
400
  declare const ValidationMessage: React.FC<ValidationMessageProps>;
299
401
 
300
- interface Theme extends Theme$1, RootThemeExtension<CSSObject>, BadgeThemeExtension<CSSObject>, ButtonThemeExtension<CSSObject>, CardThemeExtension<CSSObject>, CheckboxThemeExtension<CSSObject>, DividerThemeExtension<CSSObject>, ImageThemeExtension<CSSObject>, InputThemeExtension<CSSObject>, LabelThemeExtension<CSSObject>, LinkThemeExtension<CSSObject>, MenuThemeExtension<CSSObject>, MenuItemThemeExtension<CSSObject>, MessageThemeExtension<CSSObject>, RadioThemeExtension<CSSObject>, SelectThemeExtension<CSSObject>, SliderThemeExtension<CSSObject>, SwitchThemeExtension<CSSObject>, TextThemeExtension<CSSObject>, TextareaThemeExtension<CSSObject>, TooltipThemeExtension<CSSObject>, ValidationMessageThemeExtension<CSSObject> {
402
+ interface ComponentStyles extends BadgeThemeExtension, ButtonThemeExtension, CardThemeExtension, CheckboxThemeExtension, CheckboxGroupThemeExtension, ContentThemeExtension, DividerThemeExtension, FooterThemeExtension, HeaderThemeExtension, HeadlineThemeExtension, HelpTextThemeExtension, ImageThemeExtension, InputThemeExtension, LabelThemeExtension$1, LabelThemeExtension$1, LinkThemeExtension, MenuThemeExtension, TableThemeExtension, TextThemeExtension, TextAreaThemeExtension {
301
403
  }
302
-
303
- interface ActionGroupProps extends ComponentProps<'div'> {
304
- space?: ResponsiveStyleValue<string>;
305
- verticalAlignment?: boolean;
404
+ interface Theme extends Theme$1, RootThemeExtension<CSSObject>, LabelThemeExtension<CSSObject>, MessageThemeExtension<CSSObject>, RadioThemeExtension<CSSObject>, SelectThemeExtension<CSSObject>, SliderThemeExtension<CSSObject>, SwitchThemeExtension<CSSObject>, TooltipThemeExtension<CSSObject>, ValidationMessageThemeExtension<CSSObject> {
405
+ components: ComponentStyles;
306
406
  }
307
- declare const ActionGroup: React.FC<ActionGroupProps>;
308
407
 
309
408
  interface AsideProps {
310
409
  children: [ReactChild, ReactChild];
@@ -321,10 +420,11 @@ declare const Aside: ({ children, sideWidth, space, side, stretch, wrap, }: Asid
321
420
  */
322
421
 
323
422
  interface AspectProps extends ComponentProps<'div'> {
423
+ children?: ReactNode;
324
424
  ratio?: keyof typeof aspect;
325
425
  maxWidth?: string;
326
426
  }
327
- declare const Aspect: React.FC<AspectProps>;
427
+ declare const Aspect: ({ ratio, maxWidth, children, }: AspectProps) => JSX.Element;
328
428
 
329
429
  interface BreakoutProps extends ComponentProps<'div'> {
330
430
  horizontalAlign?: 'top' | 'bottom' | 'center';
@@ -346,7 +446,7 @@ interface ColumnsProps {
346
446
  }
347
447
  declare const Columns: React.FC<ColumnsProps>;
348
448
 
349
- interface ModalDialogProps extends OverlayProps, AriaDialogProps {
449
+ interface ModalDialogProps extends OverlayProps$1, AriaDialogProps {
350
450
  variant?: string;
351
451
  backdropVariant?: string;
352
452
  }
@@ -366,21 +466,27 @@ declare const useDialogButtonProps: () => {
366
466
  openButtonRef: React.RefObject<HTMLElement>;
367
467
  };
368
468
 
369
- declare type FieldProps = {
370
- variant?: string;
371
- labelVariant?: string;
372
- htmlFor: string;
373
- required?: boolean;
374
- error?: boolean;
375
- } & AriaTextFieldProps & ComponentProps<'input'>;
376
- declare const Field: React.FC<FieldProps>;
377
-
378
469
  interface InlineProps {
379
470
  space?: ResponsiveStyleValue<string>;
380
471
  align?: 'top' | 'center' | 'bottom';
381
472
  }
382
473
  declare const Inline: React.FC<InlineProps>;
383
474
 
475
+ interface OverlayProps extends ComponentProps<'div'> {
476
+ children: ReactNode;
477
+ open?: boolean;
478
+ container?: Element;
479
+ }
480
+ declare const Overlay: ({ children, open, container, ...props }: OverlayProps) => JSX.Element | null;
481
+
482
+ interface PopoverProps extends Omit<OverlayProps$1, 'isOpen' | 'isDismissable' | 'isKeyboardDismissDisabled'> {
483
+ children?: ReactNode;
484
+ open?: boolean;
485
+ dismissable?: boolean;
486
+ keyboardDismissDisabled?: boolean;
487
+ }
488
+ declare const Popover: React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<unknown>>;
489
+
384
490
  interface StackProps {
385
491
  as?: 'div' | 'ul' | 'ol';
386
492
  space?: ResponsiveStyleValue<string>;
@@ -388,6 +494,17 @@ interface StackProps {
388
494
  }
389
495
  declare const Stack: React.FC<StackProps>;
390
496
 
497
+ interface TextFieldProps extends Omit<ComponentProps<'input'>, 'value' | 'defaultValue' | 'onChange' | 'onFocus' | 'onBlur'>,
498
+ /**
499
+ * `react-aria` has a slightly different API for `onChange`, `onFocus`
500
+ * and `onBlur` events. Thus, we adjust our regular props to match them.
501
+ */
502
+ Pick<AriaTextFieldProps, 'onChange' | 'onFocus' | 'onBlur'>, Pick<FieldBaseProps, 'label' | 'description' | 'error' | 'errorMessage'> {
503
+ value?: string;
504
+ defaultValue?: string;
505
+ }
506
+ declare const TextField: ({ disabled, required, readOnly, error, ...props }: TextFieldProps) => JSX.Element;
507
+
391
508
  interface TilesProps {
392
509
  space?: ResponsiveStyleValue<string>;
393
510
  itemMinWidth?: ResponsiveStyleValue<string>;
@@ -402,4 +519,4 @@ interface ContainerProps extends ComponentProps<'div'> {
402
519
  }
403
520
  declare const Container: React.FC<ContainerProps>;
404
521
 
405
- export { ActionGroup, ActionGroupProps, Aside, AsideProps, Aspect, AspectProps, Badge, BadgeProps, BadgeThemeExtension, Breakout, BreakoutProps, Button, ButtonProps, ButtonThemeExtension, Card, CardProps, CardThemeExtension, Center, CenterProps, Checkbox, CheckboxProps, CheckboxThemeExtension, Columns, ColumnsProps, Container, ContainerProps, Dialog, DialogProps, Divider, DividerProps, DividerThemeExtension, Field, FieldProps, Image, ImageProps, ImageThemeExtension, Inline, InlineProps, Input, InputProps, InputThemeExtension, Label, LabelBase, LabelBaseProps, LabelProps, LabelThemeExtension, Link, LinkOwnProps, LinkProps, LinkThemeExtension, MarigoldProvider, MarigoldProviderProps, Menu, MenuItem, MenuItemProps, MenuItemThemeExtension, MenuProps, MenuThemeExtension, Message, MessageProps, MessageThemeExtension, Radio, RadioProps, RadioThemeExtension, RootThemeExtension, Select, SelectProps, SelectThemeExtension, Slider, SliderProps, SliderThemeExtension, Stack, StackProps, Switch, SwitchProps, SwitchThemeExtension, Text, TextOwnProps, TextProps, TextThemeExtension, Textarea, TextareaProps, TextareaThemeExtension, Theme, Tiles, TilesProps, Tooltip, TooltipContext, TooltipProps, TooltipThemeExtension, TooltipTrigger, ValidationMessage, ValidationMessageProps, ValidationMessageThemeExtension, useDialogButtonProps };
522
+ export { Aside, AsideProps, Aspect, AspectProps, Badge, BadgeProps, BadgeThemeExtension, Breakout, BreakoutProps, Button, ButtonOwnProps, ButtonProps, ButtonThemeExtension, Card, CardProps, CardThemeExtension, Center, CenterProps, Checkbox, CheckboxGroup, CheckboxGroupContext, CheckboxGroupContextProps, CheckboxGroupThemeExtension, CheckboxProps, CheckboxThemeExtension, Columns, ColumnsProps, Container, ContainerProps, Content, ContentProps, ContentThemeExtension, CustomCheckboxProps, CustomTextAreEvents, Dialog, DialogProps, Divider, DividerProps, DividerThemeExtension, Footer, FooterProps, FooterThemeExtension, Header, HeaderProps, HeaderThemeExtension, Headline, HeadlineProps, HeadlineThemeExtension, Image, ImageProps, ImageThemeExtension, Inline, InlineProps, Input, InputOwnProps, InputProps, InputThemeExtension, Label, LabelBase, LabelBaseProps, LabelProps, LabelThemeExtension, Link, LinkOwnProps, LinkProps, LinkThemeExtension, MarigoldProvider, MarigoldProviderProps, Menu, MenuProps, MenuThemeExtension, Message, MessageProps, MessageThemeExtension, Overlay, OverlayProps, Popover, PopoverProps, Radio, RadioProps, RadioThemeExtension, RootThemeExtension, Select, SelectProps, SelectThemeExtension, Slider, SliderProps, SliderThemeExtension, Stack, StackProps, Switch, SwitchProps, SwitchThemeExtension, Table, TableProps, TableThemeExtension, Text, TextArea, TextAreaProps, TextAreaThemeExtension, TextField, TextFieldProps, TextProps, TextThemeExtension, Theme, Tiles, TilesProps, Tooltip, TooltipContext, TooltipProps, TooltipThemeExtension, TooltipTrigger, ValidationMessage, ValidationMessageProps, ValidationMessageThemeExtension, useCheckboxGroupContext, useDialogButtonProps };