@marigold/components 6.2.5 → 6.3.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.
package/LICENSE CHANGED
@@ -1,6 +1,6 @@
1
1
  MIT License
2
2
 
3
- Copyright (c) 2021 Marigold UI
3
+ Copyright (c) 2023 Marigold UI
4
4
 
5
5
  Permission is hereby granted, free of charge, to any person obtaining a copy
6
6
  of this software and associated documentation files (the "Software"), to deal
package/dist/index.d.mts CHANGED
@@ -68,7 +68,7 @@ interface AsideProps extends GapSpaceProp {
68
68
  }
69
69
  declare const Aside: ({ children, sideWidth, space, side, stretch, wrap, }: AsideProps) => react_jsx_runtime.JSX.Element;
70
70
 
71
- interface AspectProps extends HtmlProps<'div'>, AspectProp {
71
+ interface AspectProps extends Omit<HtmlProps<'div'>, 'className'>, AspectProp {
72
72
  children?: ReactNode;
73
73
  maxWidth?: string;
74
74
  }
@@ -121,14 +121,14 @@ declare const ComboBox: {
121
121
  Item: <T>(props: _react_types_shared.ItemProps<T>) => JSX.Element;
122
122
  };
123
123
 
124
- interface BadgeProps extends HtmlProps<'div'> {
124
+ interface BadgeProps extends Omit<HtmlProps<'div'>, 'className'> {
125
125
  children?: React.ReactNode;
126
126
  variant?: string;
127
127
  size?: string;
128
128
  }
129
129
  declare const Badge: ({ variant, size, children, ...props }: BadgeProps) => react_jsx_runtime.JSX.Element;
130
130
 
131
- interface BreakoutProps extends HtmlProps<'div'>, AlignmentProp {
131
+ interface BreakoutProps extends Omit<HtmlProps<'div'>, 'className'>, AlignmentProp {
132
132
  children?: ReactNode;
133
133
  height?: string;
134
134
  alignX?: keyof typeof alignment.horizontal.alignmentX;
@@ -136,7 +136,7 @@ interface BreakoutProps extends HtmlProps<'div'>, AlignmentProp {
136
136
  }
137
137
  declare const Breakout: ({ height, children, orientation, alignX, alignY, ...props }: BreakoutProps) => react_jsx_runtime.JSX.Element;
138
138
 
139
- interface BodyProps extends HtmlProps<'section'> {
139
+ interface BodyProps extends Omit<HtmlProps<'section'>, 'className'> {
140
140
  children?: ReactNode;
141
141
  variant?: string;
142
142
  size?: string;
@@ -153,7 +153,7 @@ interface ButtonProps extends PropsOf<typeof Button> {
153
153
  }
154
154
  declare const Button: PolymorphicComponent<"button", ButtonOwnProps>;
155
155
 
156
- interface CardProps extends HtmlProps<'div'>, GapSpaceProp, PaddingSpaceProp, PaddingSpacePropX, PaddingSpacePropY, PaddingRightProp, PaddingLeftProp, PaddingBottomProp, PaddingTopProp {
156
+ interface CardProps extends Omit<HtmlProps<'div'>, 'className'>, GapSpaceProp, PaddingSpaceProp, PaddingSpacePropX, PaddingSpacePropY, PaddingRightProp, PaddingLeftProp, PaddingBottomProp, PaddingTopProp {
157
157
  children?: ReactNode;
158
158
  variant?: string;
159
159
  size?: string;
@@ -163,7 +163,7 @@ interface CardProps extends HtmlProps<'div'>, GapSpaceProp, PaddingSpaceProp, Pa
163
163
  }
164
164
  declare const Card: ({ children, variant, size, space, p, px, py, pt, pb, pl, pr, ...props }: CardProps) => react_jsx_runtime.JSX.Element;
165
165
 
166
- interface CenterProps extends HtmlProps<'div'>, GapSpaceProp {
166
+ interface CenterProps extends Omit<HtmlProps<'div'>, 'className'>, GapSpaceProp {
167
167
  children?: ReactNode;
168
168
  maxWidth?: string;
169
169
  }
@@ -174,7 +174,7 @@ declare const Center: ({ maxWidth, space, children, ...props }: CenterProps) =>
174
174
  * Thus, we adjust our regular props to match them.
175
175
  */
176
176
  type CustomCheckboxProps = 'value' | 'onChange' | 'onFocus' | 'onBlur' | 'onKeyDown' | 'onKeyUp';
177
- interface CheckboxProps extends Omit<HtmlProps<'input'>, 'size' | 'type' | 'defaultValue' | CustomCheckboxProps>, Pick<AriaCheckboxProps, CustomCheckboxProps> {
177
+ interface CheckboxProps extends Omit<HtmlProps<'input'>, 'size' | 'type' | 'defaultValue' | CustomCheckboxProps | 'className'>, Pick<AriaCheckboxProps, CustomCheckboxProps> {
178
178
  children?: ReactNode;
179
179
  indeterminate?: boolean;
180
180
  error?: boolean;
@@ -192,7 +192,7 @@ interface CheckboxGroupContextProps extends CheckboxGroupState {
192
192
  */
193
193
  declare const CheckboxGroupContext: react.Context<CheckboxGroupContextProps>;
194
194
  declare const useCheckboxGroupContext: () => CheckboxGroupContextProps;
195
- interface CheckboxGroupProps extends Omit<HtmlProps<'div'>, 'onChange'>, AriaCheckboxGroupProps {
195
+ interface CheckboxGroupProps extends Omit<HtmlProps<'div'>, 'onChange' | 'className'>, AriaCheckboxGroupProps {
196
196
  children: ReactNode;
197
197
  variant?: string;
198
198
  size?: string;
@@ -216,7 +216,7 @@ interface ColumnsProps extends GapSpaceProp {
216
216
  }
217
217
  declare const Columns: ({ space, columns, collapseAt, stretch, children, ...props }: ColumnsProps) => react_jsx_runtime.JSX.Element;
218
218
 
219
- interface ContainerProps extends HtmlProps<'div'>, PlaceItemsProp, GridColumn, GridColsAlignProp {
219
+ interface ContainerProps extends Omit<HtmlProps<'div'>, 'className'>, PlaceItemsProp, GridColumn, GridColsAlignProp {
220
220
  children?: ReactNode;
221
221
  contentType?: 'content' | 'header';
222
222
  size?: keyof typeof content | keyof typeof header;
@@ -275,7 +275,7 @@ interface DividerProps extends SeparatorProps {
275
275
  }
276
276
  declare const Divider: ({ variant, ...props }: DividerProps) => react_jsx_runtime.JSX.Element;
277
277
 
278
- interface LabelProps extends HtmlProps<'label'> {
278
+ interface LabelProps extends Omit<HtmlProps<'label'>, 'className'> {
279
279
  as?: 'label' | 'span';
280
280
  variant?: string;
281
281
  size?: string;
@@ -289,12 +289,12 @@ interface FieldBaseProps extends WidthProp {
289
289
  size?: string;
290
290
  disabled?: boolean;
291
291
  label?: ReactNode;
292
- labelProps?: LabelHTMLAttributes<HTMLLabelElement> & Pick<LabelProps, 'as'>;
292
+ labelProps?: Omit<LabelHTMLAttributes<HTMLLabelElement>, 'children'> & Pick<LabelProps, 'as'>;
293
293
  description?: ReactNode;
294
- descriptionProps?: HTMLAttributes<HTMLElement>;
294
+ descriptionProps?: Omit<HTMLAttributes<HTMLElement>, 'children'>;
295
295
  error?: boolean;
296
296
  errorMessage?: ReactNode;
297
- errorMessageProps?: HTMLAttributes<HTMLElement>;
297
+ errorMessageProps?: Omit<HTMLAttributes<HTMLElement>, 'children'>;
298
298
  stateProps?: StateAttrProps;
299
299
  }
300
300
  declare const FieldBase: ({ children, variant, size, width, disabled, label, labelProps, description, descriptionProps, error, errorMessage, errorMessageProps, stateProps, ...props }: FieldBaseProps) => react_jsx_runtime.JSX.Element;
@@ -310,21 +310,21 @@ interface FieldGroupProps {
310
310
  }
311
311
  declare const FieldGroup: ({ labelWidth, children }: FieldGroupProps) => react_jsx_runtime.JSX.Element;
312
312
 
313
- interface FooterProps extends HtmlProps<'footer'> {
313
+ interface FooterProps extends Omit<HtmlProps<'footer'>, 'className'> {
314
314
  children?: ReactNode;
315
315
  variant?: string;
316
316
  size?: string;
317
317
  }
318
318
  declare const Footer: ({ children, variant, size, ...props }: FooterProps) => react_jsx_runtime.JSX.Element;
319
319
 
320
- interface HeaderProps extends HtmlProps<'header'> {
320
+ interface HeaderProps extends Omit<HtmlProps<'header'>, 'className'> {
321
321
  children?: ReactNode;
322
322
  variant?: string;
323
323
  size?: string;
324
324
  }
325
- declare const Header: ({ children, variant, size, className, ...props }: HeaderProps) => react_jsx_runtime.JSX.Element;
325
+ declare const Header: ({ children, variant, size, ...props }: HeaderProps) => react_jsx_runtime.JSX.Element;
326
326
 
327
- interface HeadlineProps extends HtmlProps<'h1'>, TextAlignProp {
327
+ interface HeadlineProps extends Omit<HtmlProps<'h1'>, 'className'>, TextAlignProp {
328
328
  children?: ReactNode;
329
329
  level?: '1' | '2' | '3' | '4' | '5' | '6';
330
330
  color?: string;
@@ -334,7 +334,7 @@ interface HeadlineProps extends HtmlProps<'h1'>, TextAlignProp {
334
334
  }
335
335
  declare const Headline: ({ children, variant, size, align, color, level, as, ...props }: HeadlineProps) => react_jsx_runtime.JSX.Element;
336
336
 
337
- interface ImageProps extends HtmlProps<'img'>, ObjectFitProp, ObjectPositionProp {
337
+ interface ImageProps extends Omit<HtmlProps<'img'>, 'className'>, ObjectFitProp, ObjectPositionProp {
338
338
  variant?: string;
339
339
  size?: string;
340
340
  children?: never;
@@ -354,11 +354,6 @@ interface InputOwnProps extends Omit<HtmlProps<'input'>, 'size' | 'className'> {
354
354
  action?: ReactElement;
355
355
  variant?: string;
356
356
  size?: string;
357
- className?: {
358
- container?: string;
359
- input?: string;
360
- icon?: string;
361
- };
362
357
  }
363
358
  interface InputProps extends Omit<ComponentPropsWithRef<'input'>, 'size' | 'className'>, InputOwnProps {
364
359
  }
@@ -410,8 +405,9 @@ interface DatePickerProps extends Omit<AriaDatePickerProps<CalendarDate>, 'isDis
410
405
  shouldCloseOnSelect?: boolean;
411
406
  variant?: string;
412
407
  size?: string;
408
+ width?: WidthProp['width'];
413
409
  }
414
- declare const DatePicker: ({ disabled, required, readonly, open, error, shouldCloseOnSelect, variant, size, ...rest }: DatePickerProps) => react_jsx_runtime.JSX.Element;
410
+ declare const DatePicker: ({ disabled, required, readonly, open, error, shouldCloseOnSelect, variant, size, width, ...rest }: DatePickerProps) => react_jsx_runtime.JSX.Element;
415
411
 
416
412
  type InsetProps = {
417
413
  children: ReactNode;
@@ -436,11 +432,11 @@ interface LinkProps extends PropsOf<typeof Link> {
436
432
  }
437
433
  declare const Link: PolymorphicComponent<"a", LinkOwnProps>;
438
434
 
439
- interface ListItemProps extends HtmlProps<'li'> {
435
+ interface ListItemProps extends Omit<HtmlProps<'li'>, 'className'> {
440
436
  children?: ReactNode;
441
437
  }
442
438
 
443
- interface ListProps extends HtmlProps<'ul'> {
439
+ interface ListProps extends Omit<HtmlProps<'ul'>, 'className'> {
444
440
  variant?: string;
445
441
  size?: string;
446
442
  as?: 'ul' | 'ol';
@@ -458,7 +454,7 @@ interface MenuTriggerProps {
458
454
  onOpenChange?: (isOpen: boolean) => void;
459
455
  }
460
456
 
461
- interface MenuProps extends Omit<HtmlProps<'ul'>, 'onSelect' | 'size'> {
457
+ interface MenuProps extends Omit<HtmlProps<'ul'>, 'onSelect' | 'size' | 'className'> {
462
458
  children: CollectionElement<object> | CollectionElement<object>[];
463
459
  variant?: string;
464
460
  size?: string;
@@ -480,7 +476,7 @@ declare const icons: {
480
476
  warning: () => react_jsx_runtime.JSX.Element;
481
477
  error: () => react_jsx_runtime.JSX.Element;
482
478
  };
483
- interface MessageProps extends HtmlProps<'div'> {
479
+ interface MessageProps extends Omit<HtmlProps<'div'>, 'className'> {
484
480
  messageTitle: ReactNode;
485
481
  variant?: keyof typeof icons;
486
482
  size?: string;
@@ -492,7 +488,7 @@ declare const Message: ({ messageTitle, variant, size, children, ...props }: Mes
492
488
  * Thus, we adjust our regular props to match them.
493
489
  */
494
490
  type CustomProps = 'size' | 'width' | 'type' | 'value' | 'defaultValue' | 'step' | 'onChange' | 'onFocus' | 'onBlur' | 'onKeyDown' | 'onKeyUp' | 'min' | 'max';
495
- interface NumberFieldProps extends Omit<HtmlProps<'input'>, CustomProps>, Omit<AriaNumberFieldProps, 'isDisabled' | 'isRequired' | 'isReadOnly'>, Pick<FieldBaseProps, 'label' | 'description' | 'error' | 'errorMessage'> {
491
+ interface NumberFieldProps extends Omit<HtmlProps<'input'>, CustomProps | 'className'>, Omit<AriaNumberFieldProps, 'isDisabled' | 'label' | 'description' | 'errorMessage' | 'isRequired' | 'isReadOnly'>, Pick<FieldBaseProps, 'label' | 'description' | 'error' | 'errorMessage'> {
496
492
  variant?: string;
497
493
  size?: string;
498
494
  width?: WidthProp['width'];
@@ -553,7 +549,7 @@ interface RadioGroupProps extends Omit<AriaRadioGroupProps, 'isDisabled' | 'isRq
553
549
  declare const RadioGroup: ({ children, orientation, width, required, disabled, readOnly, error, ...rest }: RadioGroupProps) => react_jsx_runtime.JSX.Element;
554
550
 
555
551
  type CustomRadioProps = 'size' | 'width' | 'type' | 'defaultChecked' | 'value' | 'onFocus' | 'onBlur' | 'onKeyUp' | 'onKeyDown';
556
- interface RadioProps extends Omit<HtmlProps<'input'>, CustomRadioProps>, AriaRadioProps {
552
+ interface RadioProps extends Omit<HtmlProps<'input'>, CustomRadioProps | 'children' | 'className'>, AriaRadioProps {
557
553
  width?: string;
558
554
  variant?: string;
559
555
  size?: string;
@@ -568,7 +564,7 @@ interface RadioComponent extends ForwardRefExoticComponent<RadioProps & RefAttri
568
564
  Group: typeof RadioGroup;
569
565
  }
570
566
 
571
- interface SelectProps extends Omit<AriaSelectProps<object>, 'autoComplete' | 'isOpen' | 'isLoading' | 'onLoadMore' | 'isDisabled' | 'isRequired' | 'validationState' | 'onSelectionChange'>, Omit<HtmlProps<'select'>, 'onKeyUp' | 'onKeyDown' | 'onFocus' | 'onBlur' | 'children' | 'size' | 'onChange'> {
567
+ interface SelectProps extends Omit<AriaSelectProps<object>, 'autoComplete' | 'isOpen' | 'isLoading' | 'onLoadMore' | 'isDisabled' | 'isRequired' | 'validationState' | 'onSelectionChange'>, Omit<HtmlProps<'select'>, 'onKeyUp' | 'onKeyDown' | 'onFocus' | 'onBlur' | 'children' | 'size' | 'onChange' | 'className'> {
572
568
  variant?: string;
573
569
  size?: string;
574
570
  width?: WidthProp['width'];
@@ -588,7 +584,7 @@ interface SelectComponent extends ForwardRefExoticComponent<SelectProps & RefAtt
588
584
  Section: typeof Section;
589
585
  }
590
586
 
591
- interface SliderProps extends Omit<HtmlProps<'input'>, 'step' | 'value' | 'defaultValue' | 'onChange' | 'onFocus' | 'onBlur' | 'size' | 'width'>,
587
+ interface SliderProps extends Omit<HtmlProps<'input'>, 'step' | 'value' | 'defaultValue' | 'onChange' | 'onFocus' | 'onBlur' | 'size' | 'width' | 'className'>,
592
588
  /**
593
589
  * `react-aria` has a slightly different API for some events e.g `onChange`, `onFocus`
594
590
  * `onBlur`. Thus, we adjust our regular props to match them.
@@ -596,7 +592,7 @@ interface SliderProps extends Omit<HtmlProps<'input'>, 'step' | 'value' | 'defau
596
592
  Pick<AriaSliderProps, 'maxValue' | 'step' | 'value' | 'defaultValue' | 'onChange'> {
597
593
  variant?: string;
598
594
  size?: string;
599
- width?: string;
595
+ width?: WidthProp['width'];
600
596
  formatOptions?: Intl.NumberFormatOptions;
601
597
  children?: ReactNode;
602
598
  }
@@ -607,7 +603,7 @@ Pick<AriaSliderProps, 'maxValue' | 'step' | 'value' | 'defaultValue' | 'onChange
607
603
  */
608
604
  declare const Slider: react.ForwardRefExoticComponent<SliderProps & react.RefAttributes<HTMLDivElement>>;
609
605
 
610
- interface SplitProps extends HtmlProps<'div'> {
606
+ interface SplitProps extends Omit<HtmlProps<'div'>, 'className'> {
611
607
  }
612
608
  declare const Split: (props: SplitProps) => react_jsx_runtime.JSX.Element;
613
609
 
@@ -620,11 +616,11 @@ interface StackProps extends AlignmentProp, GapSpaceProp {
620
616
  declare const Stack: ({ children, space, stretch, orientation, alignX, alignY, ...props }: StackProps) => react_jsx_runtime.JSX.Element;
621
617
 
622
618
  type CustomSwitchProps = 'size' | 'value' | 'onBlur' | 'onChange' | 'onFocus' | 'onKeyDown' | 'onKeyUp';
623
- interface SwitchProps extends Omit<AriaSwitchProps, 'isSelected'>, Omit<HtmlProps<'input'>, CustomSwitchProps> {
619
+ interface SwitchProps extends Omit<AriaSwitchProps, 'isSelected'>, Omit<HtmlProps<'input'>, CustomSwitchProps | 'children' | 'className'> {
624
620
  selected?: boolean;
625
621
  variant?: string;
626
622
  size?: string;
627
- width?: string;
623
+ width?: WidthProp['width'];
628
624
  }
629
625
  declare const Switch: react.ForwardRefExoticComponent<SwitchProps & react.RefAttributes<HTMLInputElement>>;
630
626
 
@@ -653,7 +649,7 @@ interface Table {
653
649
  Row: (props: RowProps) => JSX.Element;
654
650
  }
655
651
 
656
- interface TextProps extends HtmlProps<'p'>, TextAlignProp, FontSizeProp, FontWeightProp, FontStyleProp, CursorProp {
652
+ interface TextProps extends Omit<HtmlProps<'p'>, 'className'>, TextAlignProp, FontSizeProp, FontWeightProp, FontStyleProp, CursorProp {
657
653
  children?: React.ReactNode;
658
654
  variant?: string;
659
655
  color?: string;
@@ -666,7 +662,7 @@ declare const Text: ({ variant, size, color, align, cursor, weight, fontSize, fo
666
662
  * Thus, we adjust our regular props to match them.
667
663
  */
668
664
  type CustomTextAreaEvents = 'onChange' | 'onFocus' | 'onBlur' | 'onCopy' | 'onSelect' | 'onPaste' | 'onCut' | 'onCompositionStart' | 'onCompositionUpdate' | 'onCompositionEnd' | 'onBeforeInput' | 'onInput' | 'onKeyDown' | 'onKeyUp';
669
- interface TextAreaProps extends Omit<HtmlProps<'textarea'>, 'value' | 'defaultValue' | 'size' | CustomTextAreaEvents>, Pick<AriaTextFieldProps, CustomTextAreaEvents>, Pick<FieldBaseProps, 'label' | 'description' | 'error' | 'errorMessage'> {
665
+ interface TextAreaProps extends Omit<HtmlProps<'textarea'>, 'value' | 'defaultValue' | 'size' | CustomTextAreaEvents | 'className'>, Pick<AriaTextFieldProps, CustomTextAreaEvents>, Pick<FieldBaseProps, 'label' | 'description' | 'error' | 'errorMessage'> {
670
666
  variant?: string;
671
667
  size?: string;
672
668
  width?: WidthProp['width'];
@@ -680,7 +676,7 @@ declare const TextArea: react.ForwardRefExoticComponent<TextAreaProps & react.Re
680
676
  * Thus, we adjust our regular props to match them.
681
677
  */
682
678
  type CustomTextFieldEvents = 'onChange' | 'onFocus' | 'onBlur' | 'onKeyDown' | 'onKeyUp';
683
- interface TextFieldProps extends Omit<HtmlProps<'input'>, 'value' | 'defaultValue' | 'size' | 'width' | CustomTextFieldEvents>,
679
+ interface TextFieldProps extends Omit<HtmlProps<'input'>, 'value' | 'defaultValue' | 'size' | 'width' | CustomTextFieldEvents | 'className'>,
684
680
  /**
685
681
  * `react-aria` has a slightly different API for `onChange`, `onFocus`
686
682
  * and `onBlur` events. Thus, we adjust our regular props to match them.
@@ -708,7 +704,7 @@ interface TooltipTriggerProps extends Omit<TooltipTriggerProps$1, 'isDisabled' |
708
704
  open?: boolean;
709
705
  }
710
706
 
711
- interface TooltipProps extends HtmlProps<'div'> {
707
+ interface TooltipProps extends Omit<HtmlProps<'div'>, 'className'> {
712
708
  children?: ReactNode;
713
709
  variant?: string;
714
710
  size?: string;
package/dist/index.d.ts CHANGED
@@ -68,7 +68,7 @@ interface AsideProps extends GapSpaceProp {
68
68
  }
69
69
  declare const Aside: ({ children, sideWidth, space, side, stretch, wrap, }: AsideProps) => react_jsx_runtime.JSX.Element;
70
70
 
71
- interface AspectProps extends HtmlProps<'div'>, AspectProp {
71
+ interface AspectProps extends Omit<HtmlProps<'div'>, 'className'>, AspectProp {
72
72
  children?: ReactNode;
73
73
  maxWidth?: string;
74
74
  }
@@ -121,14 +121,14 @@ declare const ComboBox: {
121
121
  Item: <T>(props: _react_types_shared.ItemProps<T>) => JSX.Element;
122
122
  };
123
123
 
124
- interface BadgeProps extends HtmlProps<'div'> {
124
+ interface BadgeProps extends Omit<HtmlProps<'div'>, 'className'> {
125
125
  children?: React.ReactNode;
126
126
  variant?: string;
127
127
  size?: string;
128
128
  }
129
129
  declare const Badge: ({ variant, size, children, ...props }: BadgeProps) => react_jsx_runtime.JSX.Element;
130
130
 
131
- interface BreakoutProps extends HtmlProps<'div'>, AlignmentProp {
131
+ interface BreakoutProps extends Omit<HtmlProps<'div'>, 'className'>, AlignmentProp {
132
132
  children?: ReactNode;
133
133
  height?: string;
134
134
  alignX?: keyof typeof alignment.horizontal.alignmentX;
@@ -136,7 +136,7 @@ interface BreakoutProps extends HtmlProps<'div'>, AlignmentProp {
136
136
  }
137
137
  declare const Breakout: ({ height, children, orientation, alignX, alignY, ...props }: BreakoutProps) => react_jsx_runtime.JSX.Element;
138
138
 
139
- interface BodyProps extends HtmlProps<'section'> {
139
+ interface BodyProps extends Omit<HtmlProps<'section'>, 'className'> {
140
140
  children?: ReactNode;
141
141
  variant?: string;
142
142
  size?: string;
@@ -153,7 +153,7 @@ interface ButtonProps extends PropsOf<typeof Button> {
153
153
  }
154
154
  declare const Button: PolymorphicComponent<"button", ButtonOwnProps>;
155
155
 
156
- interface CardProps extends HtmlProps<'div'>, GapSpaceProp, PaddingSpaceProp, PaddingSpacePropX, PaddingSpacePropY, PaddingRightProp, PaddingLeftProp, PaddingBottomProp, PaddingTopProp {
156
+ interface CardProps extends Omit<HtmlProps<'div'>, 'className'>, GapSpaceProp, PaddingSpaceProp, PaddingSpacePropX, PaddingSpacePropY, PaddingRightProp, PaddingLeftProp, PaddingBottomProp, PaddingTopProp {
157
157
  children?: ReactNode;
158
158
  variant?: string;
159
159
  size?: string;
@@ -163,7 +163,7 @@ interface CardProps extends HtmlProps<'div'>, GapSpaceProp, PaddingSpaceProp, Pa
163
163
  }
164
164
  declare const Card: ({ children, variant, size, space, p, px, py, pt, pb, pl, pr, ...props }: CardProps) => react_jsx_runtime.JSX.Element;
165
165
 
166
- interface CenterProps extends HtmlProps<'div'>, GapSpaceProp {
166
+ interface CenterProps extends Omit<HtmlProps<'div'>, 'className'>, GapSpaceProp {
167
167
  children?: ReactNode;
168
168
  maxWidth?: string;
169
169
  }
@@ -174,7 +174,7 @@ declare const Center: ({ maxWidth, space, children, ...props }: CenterProps) =>
174
174
  * Thus, we adjust our regular props to match them.
175
175
  */
176
176
  type CustomCheckboxProps = 'value' | 'onChange' | 'onFocus' | 'onBlur' | 'onKeyDown' | 'onKeyUp';
177
- interface CheckboxProps extends Omit<HtmlProps<'input'>, 'size' | 'type' | 'defaultValue' | CustomCheckboxProps>, Pick<AriaCheckboxProps, CustomCheckboxProps> {
177
+ interface CheckboxProps extends Omit<HtmlProps<'input'>, 'size' | 'type' | 'defaultValue' | CustomCheckboxProps | 'className'>, Pick<AriaCheckboxProps, CustomCheckboxProps> {
178
178
  children?: ReactNode;
179
179
  indeterminate?: boolean;
180
180
  error?: boolean;
@@ -192,7 +192,7 @@ interface CheckboxGroupContextProps extends CheckboxGroupState {
192
192
  */
193
193
  declare const CheckboxGroupContext: react.Context<CheckboxGroupContextProps>;
194
194
  declare const useCheckboxGroupContext: () => CheckboxGroupContextProps;
195
- interface CheckboxGroupProps extends Omit<HtmlProps<'div'>, 'onChange'>, AriaCheckboxGroupProps {
195
+ interface CheckboxGroupProps extends Omit<HtmlProps<'div'>, 'onChange' | 'className'>, AriaCheckboxGroupProps {
196
196
  children: ReactNode;
197
197
  variant?: string;
198
198
  size?: string;
@@ -216,7 +216,7 @@ interface ColumnsProps extends GapSpaceProp {
216
216
  }
217
217
  declare const Columns: ({ space, columns, collapseAt, stretch, children, ...props }: ColumnsProps) => react_jsx_runtime.JSX.Element;
218
218
 
219
- interface ContainerProps extends HtmlProps<'div'>, PlaceItemsProp, GridColumn, GridColsAlignProp {
219
+ interface ContainerProps extends Omit<HtmlProps<'div'>, 'className'>, PlaceItemsProp, GridColumn, GridColsAlignProp {
220
220
  children?: ReactNode;
221
221
  contentType?: 'content' | 'header';
222
222
  size?: keyof typeof content | keyof typeof header;
@@ -275,7 +275,7 @@ interface DividerProps extends SeparatorProps {
275
275
  }
276
276
  declare const Divider: ({ variant, ...props }: DividerProps) => react_jsx_runtime.JSX.Element;
277
277
 
278
- interface LabelProps extends HtmlProps<'label'> {
278
+ interface LabelProps extends Omit<HtmlProps<'label'>, 'className'> {
279
279
  as?: 'label' | 'span';
280
280
  variant?: string;
281
281
  size?: string;
@@ -289,12 +289,12 @@ interface FieldBaseProps extends WidthProp {
289
289
  size?: string;
290
290
  disabled?: boolean;
291
291
  label?: ReactNode;
292
- labelProps?: LabelHTMLAttributes<HTMLLabelElement> & Pick<LabelProps, 'as'>;
292
+ labelProps?: Omit<LabelHTMLAttributes<HTMLLabelElement>, 'children'> & Pick<LabelProps, 'as'>;
293
293
  description?: ReactNode;
294
- descriptionProps?: HTMLAttributes<HTMLElement>;
294
+ descriptionProps?: Omit<HTMLAttributes<HTMLElement>, 'children'>;
295
295
  error?: boolean;
296
296
  errorMessage?: ReactNode;
297
- errorMessageProps?: HTMLAttributes<HTMLElement>;
297
+ errorMessageProps?: Omit<HTMLAttributes<HTMLElement>, 'children'>;
298
298
  stateProps?: StateAttrProps;
299
299
  }
300
300
  declare const FieldBase: ({ children, variant, size, width, disabled, label, labelProps, description, descriptionProps, error, errorMessage, errorMessageProps, stateProps, ...props }: FieldBaseProps) => react_jsx_runtime.JSX.Element;
@@ -310,21 +310,21 @@ interface FieldGroupProps {
310
310
  }
311
311
  declare const FieldGroup: ({ labelWidth, children }: FieldGroupProps) => react_jsx_runtime.JSX.Element;
312
312
 
313
- interface FooterProps extends HtmlProps<'footer'> {
313
+ interface FooterProps extends Omit<HtmlProps<'footer'>, 'className'> {
314
314
  children?: ReactNode;
315
315
  variant?: string;
316
316
  size?: string;
317
317
  }
318
318
  declare const Footer: ({ children, variant, size, ...props }: FooterProps) => react_jsx_runtime.JSX.Element;
319
319
 
320
- interface HeaderProps extends HtmlProps<'header'> {
320
+ interface HeaderProps extends Omit<HtmlProps<'header'>, 'className'> {
321
321
  children?: ReactNode;
322
322
  variant?: string;
323
323
  size?: string;
324
324
  }
325
- declare const Header: ({ children, variant, size, className, ...props }: HeaderProps) => react_jsx_runtime.JSX.Element;
325
+ declare const Header: ({ children, variant, size, ...props }: HeaderProps) => react_jsx_runtime.JSX.Element;
326
326
 
327
- interface HeadlineProps extends HtmlProps<'h1'>, TextAlignProp {
327
+ interface HeadlineProps extends Omit<HtmlProps<'h1'>, 'className'>, TextAlignProp {
328
328
  children?: ReactNode;
329
329
  level?: '1' | '2' | '3' | '4' | '5' | '6';
330
330
  color?: string;
@@ -334,7 +334,7 @@ interface HeadlineProps extends HtmlProps<'h1'>, TextAlignProp {
334
334
  }
335
335
  declare const Headline: ({ children, variant, size, align, color, level, as, ...props }: HeadlineProps) => react_jsx_runtime.JSX.Element;
336
336
 
337
- interface ImageProps extends HtmlProps<'img'>, ObjectFitProp, ObjectPositionProp {
337
+ interface ImageProps extends Omit<HtmlProps<'img'>, 'className'>, ObjectFitProp, ObjectPositionProp {
338
338
  variant?: string;
339
339
  size?: string;
340
340
  children?: never;
@@ -354,11 +354,6 @@ interface InputOwnProps extends Omit<HtmlProps<'input'>, 'size' | 'className'> {
354
354
  action?: ReactElement;
355
355
  variant?: string;
356
356
  size?: string;
357
- className?: {
358
- container?: string;
359
- input?: string;
360
- icon?: string;
361
- };
362
357
  }
363
358
  interface InputProps extends Omit<ComponentPropsWithRef<'input'>, 'size' | 'className'>, InputOwnProps {
364
359
  }
@@ -410,8 +405,9 @@ interface DatePickerProps extends Omit<AriaDatePickerProps<CalendarDate>, 'isDis
410
405
  shouldCloseOnSelect?: boolean;
411
406
  variant?: string;
412
407
  size?: string;
408
+ width?: WidthProp['width'];
413
409
  }
414
- declare const DatePicker: ({ disabled, required, readonly, open, error, shouldCloseOnSelect, variant, size, ...rest }: DatePickerProps) => react_jsx_runtime.JSX.Element;
410
+ declare const DatePicker: ({ disabled, required, readonly, open, error, shouldCloseOnSelect, variant, size, width, ...rest }: DatePickerProps) => react_jsx_runtime.JSX.Element;
415
411
 
416
412
  type InsetProps = {
417
413
  children: ReactNode;
@@ -436,11 +432,11 @@ interface LinkProps extends PropsOf<typeof Link> {
436
432
  }
437
433
  declare const Link: PolymorphicComponent<"a", LinkOwnProps>;
438
434
 
439
- interface ListItemProps extends HtmlProps<'li'> {
435
+ interface ListItemProps extends Omit<HtmlProps<'li'>, 'className'> {
440
436
  children?: ReactNode;
441
437
  }
442
438
 
443
- interface ListProps extends HtmlProps<'ul'> {
439
+ interface ListProps extends Omit<HtmlProps<'ul'>, 'className'> {
444
440
  variant?: string;
445
441
  size?: string;
446
442
  as?: 'ul' | 'ol';
@@ -458,7 +454,7 @@ interface MenuTriggerProps {
458
454
  onOpenChange?: (isOpen: boolean) => void;
459
455
  }
460
456
 
461
- interface MenuProps extends Omit<HtmlProps<'ul'>, 'onSelect' | 'size'> {
457
+ interface MenuProps extends Omit<HtmlProps<'ul'>, 'onSelect' | 'size' | 'className'> {
462
458
  children: CollectionElement<object> | CollectionElement<object>[];
463
459
  variant?: string;
464
460
  size?: string;
@@ -480,7 +476,7 @@ declare const icons: {
480
476
  warning: () => react_jsx_runtime.JSX.Element;
481
477
  error: () => react_jsx_runtime.JSX.Element;
482
478
  };
483
- interface MessageProps extends HtmlProps<'div'> {
479
+ interface MessageProps extends Omit<HtmlProps<'div'>, 'className'> {
484
480
  messageTitle: ReactNode;
485
481
  variant?: keyof typeof icons;
486
482
  size?: string;
@@ -492,7 +488,7 @@ declare const Message: ({ messageTitle, variant, size, children, ...props }: Mes
492
488
  * Thus, we adjust our regular props to match them.
493
489
  */
494
490
  type CustomProps = 'size' | 'width' | 'type' | 'value' | 'defaultValue' | 'step' | 'onChange' | 'onFocus' | 'onBlur' | 'onKeyDown' | 'onKeyUp' | 'min' | 'max';
495
- interface NumberFieldProps extends Omit<HtmlProps<'input'>, CustomProps>, Omit<AriaNumberFieldProps, 'isDisabled' | 'isRequired' | 'isReadOnly'>, Pick<FieldBaseProps, 'label' | 'description' | 'error' | 'errorMessage'> {
491
+ interface NumberFieldProps extends Omit<HtmlProps<'input'>, CustomProps | 'className'>, Omit<AriaNumberFieldProps, 'isDisabled' | 'label' | 'description' | 'errorMessage' | 'isRequired' | 'isReadOnly'>, Pick<FieldBaseProps, 'label' | 'description' | 'error' | 'errorMessage'> {
496
492
  variant?: string;
497
493
  size?: string;
498
494
  width?: WidthProp['width'];
@@ -553,7 +549,7 @@ interface RadioGroupProps extends Omit<AriaRadioGroupProps, 'isDisabled' | 'isRq
553
549
  declare const RadioGroup: ({ children, orientation, width, required, disabled, readOnly, error, ...rest }: RadioGroupProps) => react_jsx_runtime.JSX.Element;
554
550
 
555
551
  type CustomRadioProps = 'size' | 'width' | 'type' | 'defaultChecked' | 'value' | 'onFocus' | 'onBlur' | 'onKeyUp' | 'onKeyDown';
556
- interface RadioProps extends Omit<HtmlProps<'input'>, CustomRadioProps>, AriaRadioProps {
552
+ interface RadioProps extends Omit<HtmlProps<'input'>, CustomRadioProps | 'children' | 'className'>, AriaRadioProps {
557
553
  width?: string;
558
554
  variant?: string;
559
555
  size?: string;
@@ -568,7 +564,7 @@ interface RadioComponent extends ForwardRefExoticComponent<RadioProps & RefAttri
568
564
  Group: typeof RadioGroup;
569
565
  }
570
566
 
571
- interface SelectProps extends Omit<AriaSelectProps<object>, 'autoComplete' | 'isOpen' | 'isLoading' | 'onLoadMore' | 'isDisabled' | 'isRequired' | 'validationState' | 'onSelectionChange'>, Omit<HtmlProps<'select'>, 'onKeyUp' | 'onKeyDown' | 'onFocus' | 'onBlur' | 'children' | 'size' | 'onChange'> {
567
+ interface SelectProps extends Omit<AriaSelectProps<object>, 'autoComplete' | 'isOpen' | 'isLoading' | 'onLoadMore' | 'isDisabled' | 'isRequired' | 'validationState' | 'onSelectionChange'>, Omit<HtmlProps<'select'>, 'onKeyUp' | 'onKeyDown' | 'onFocus' | 'onBlur' | 'children' | 'size' | 'onChange' | 'className'> {
572
568
  variant?: string;
573
569
  size?: string;
574
570
  width?: WidthProp['width'];
@@ -588,7 +584,7 @@ interface SelectComponent extends ForwardRefExoticComponent<SelectProps & RefAtt
588
584
  Section: typeof Section;
589
585
  }
590
586
 
591
- interface SliderProps extends Omit<HtmlProps<'input'>, 'step' | 'value' | 'defaultValue' | 'onChange' | 'onFocus' | 'onBlur' | 'size' | 'width'>,
587
+ interface SliderProps extends Omit<HtmlProps<'input'>, 'step' | 'value' | 'defaultValue' | 'onChange' | 'onFocus' | 'onBlur' | 'size' | 'width' | 'className'>,
592
588
  /**
593
589
  * `react-aria` has a slightly different API for some events e.g `onChange`, `onFocus`
594
590
  * `onBlur`. Thus, we adjust our regular props to match them.
@@ -596,7 +592,7 @@ interface SliderProps extends Omit<HtmlProps<'input'>, 'step' | 'value' | 'defau
596
592
  Pick<AriaSliderProps, 'maxValue' | 'step' | 'value' | 'defaultValue' | 'onChange'> {
597
593
  variant?: string;
598
594
  size?: string;
599
- width?: string;
595
+ width?: WidthProp['width'];
600
596
  formatOptions?: Intl.NumberFormatOptions;
601
597
  children?: ReactNode;
602
598
  }
@@ -607,7 +603,7 @@ Pick<AriaSliderProps, 'maxValue' | 'step' | 'value' | 'defaultValue' | 'onChange
607
603
  */
608
604
  declare const Slider: react.ForwardRefExoticComponent<SliderProps & react.RefAttributes<HTMLDivElement>>;
609
605
 
610
- interface SplitProps extends HtmlProps<'div'> {
606
+ interface SplitProps extends Omit<HtmlProps<'div'>, 'className'> {
611
607
  }
612
608
  declare const Split: (props: SplitProps) => react_jsx_runtime.JSX.Element;
613
609
 
@@ -620,11 +616,11 @@ interface StackProps extends AlignmentProp, GapSpaceProp {
620
616
  declare const Stack: ({ children, space, stretch, orientation, alignX, alignY, ...props }: StackProps) => react_jsx_runtime.JSX.Element;
621
617
 
622
618
  type CustomSwitchProps = 'size' | 'value' | 'onBlur' | 'onChange' | 'onFocus' | 'onKeyDown' | 'onKeyUp';
623
- interface SwitchProps extends Omit<AriaSwitchProps, 'isSelected'>, Omit<HtmlProps<'input'>, CustomSwitchProps> {
619
+ interface SwitchProps extends Omit<AriaSwitchProps, 'isSelected'>, Omit<HtmlProps<'input'>, CustomSwitchProps | 'children' | 'className'> {
624
620
  selected?: boolean;
625
621
  variant?: string;
626
622
  size?: string;
627
- width?: string;
623
+ width?: WidthProp['width'];
628
624
  }
629
625
  declare const Switch: react.ForwardRefExoticComponent<SwitchProps & react.RefAttributes<HTMLInputElement>>;
630
626
 
@@ -653,7 +649,7 @@ interface Table {
653
649
  Row: (props: RowProps) => JSX.Element;
654
650
  }
655
651
 
656
- interface TextProps extends HtmlProps<'p'>, TextAlignProp, FontSizeProp, FontWeightProp, FontStyleProp, CursorProp {
652
+ interface TextProps extends Omit<HtmlProps<'p'>, 'className'>, TextAlignProp, FontSizeProp, FontWeightProp, FontStyleProp, CursorProp {
657
653
  children?: React.ReactNode;
658
654
  variant?: string;
659
655
  color?: string;
@@ -666,7 +662,7 @@ declare const Text: ({ variant, size, color, align, cursor, weight, fontSize, fo
666
662
  * Thus, we adjust our regular props to match them.
667
663
  */
668
664
  type CustomTextAreaEvents = 'onChange' | 'onFocus' | 'onBlur' | 'onCopy' | 'onSelect' | 'onPaste' | 'onCut' | 'onCompositionStart' | 'onCompositionUpdate' | 'onCompositionEnd' | 'onBeforeInput' | 'onInput' | 'onKeyDown' | 'onKeyUp';
669
- interface TextAreaProps extends Omit<HtmlProps<'textarea'>, 'value' | 'defaultValue' | 'size' | CustomTextAreaEvents>, Pick<AriaTextFieldProps, CustomTextAreaEvents>, Pick<FieldBaseProps, 'label' | 'description' | 'error' | 'errorMessage'> {
665
+ interface TextAreaProps extends Omit<HtmlProps<'textarea'>, 'value' | 'defaultValue' | 'size' | CustomTextAreaEvents | 'className'>, Pick<AriaTextFieldProps, CustomTextAreaEvents>, Pick<FieldBaseProps, 'label' | 'description' | 'error' | 'errorMessage'> {
670
666
  variant?: string;
671
667
  size?: string;
672
668
  width?: WidthProp['width'];
@@ -680,7 +676,7 @@ declare const TextArea: react.ForwardRefExoticComponent<TextAreaProps & react.Re
680
676
  * Thus, we adjust our regular props to match them.
681
677
  */
682
678
  type CustomTextFieldEvents = 'onChange' | 'onFocus' | 'onBlur' | 'onKeyDown' | 'onKeyUp';
683
- interface TextFieldProps extends Omit<HtmlProps<'input'>, 'value' | 'defaultValue' | 'size' | 'width' | CustomTextFieldEvents>,
679
+ interface TextFieldProps extends Omit<HtmlProps<'input'>, 'value' | 'defaultValue' | 'size' | 'width' | CustomTextFieldEvents | 'className'>,
684
680
  /**
685
681
  * `react-aria` has a slightly different API for `onChange`, `onFocus`
686
682
  * and `onBlur` events. Thus, we adjust our regular props to match them.
@@ -708,7 +704,7 @@ interface TooltipTriggerProps extends Omit<TooltipTriggerProps$1, 'isDisabled' |
708
704
  open?: boolean;
709
705
  }
710
706
 
711
- interface TooltipProps extends HtmlProps<'div'> {
707
+ interface TooltipProps extends Omit<HtmlProps<'div'>, 'className'> {
712
708
  children?: ReactNode;
713
709
  variant?: string;
714
710
  size?: string;