react-better-html 1.1.89 → 1.1.91

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 (8) hide show
  1. package/README.md +1 -1
  2. package/dist/index.d.mts +42 -38
  3. package/dist/index.d.ts +42 -38
  4. package/dist/index.js +92 -14
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.mjs +94 -16
  7. package/dist/index.mjs.map +1 -1
  8. package/package.json +1 -1
package/README.md CHANGED
@@ -6,7 +6,7 @@ A component library for react that is as close to plane html as possible
6
6
  ![GitHub Repo stars](https://img.shields.io/github/stars/krissvv/react-better-html?style=flat)
7
7
  ![GitHub package.json version](https://img.shields.io/github/package-json/v/krissvv/react-better-html)
8
8
  ![NPM Type Definitions](https://img.shields.io/npm/types/react-better-html)<br/>
9
- ![GitHub Actions Workflow Status](https://img.shields.io/github/actions/workflow/status/krissvv/react-better-html/deploy.yml)
9
+ ![GitHub Actions Workflow Status](https://img.shields.io/github/actions/workflow/status/krissvv/react-better-html/document-deploy.yml)
10
10
  ![GitHub last commit](https://img.shields.io/github/last-commit/krissvv/react-better-html)
11
11
  ![NPM Downloads](https://img.shields.io/npm/dm/react-better-html)<br/>
12
12
  ![NPM License](https://img.shields.io/npm/l/react-better-html)<br/>
package/dist/index.d.mts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { WebTarget } from 'styled-components';
2
- import * as React$1 from 'react';
3
- import React__default, { ComponentType, ComponentProps, ReactNode } from 'react';
2
+ import * as react from 'react';
3
+ import { ComponentType, ComponentProps, ReactNode } from 'react';
4
4
  import * as react_jsx_runtime from 'react/jsx-runtime';
5
5
 
6
6
  type PluginName = "react-router-dom";
@@ -36,7 +36,7 @@ type DeepPartialRecord<T> = {
36
36
  type PickAllRequired<T, K extends keyof T> = Required<Pick<T, K>>;
37
37
  type AnyOtherString = Omit<string & {}, "">;
38
38
 
39
- type DivProps<Value> = {
39
+ type DivProps<Value = unknown> = {
40
40
  value?: Value;
41
41
  /** @default "div" */
42
42
  as?: WebTarget;
@@ -66,14 +66,14 @@ declare const Div: typeof DivComponent & {
66
66
  };
67
67
 
68
68
  type TextAs = "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span" | "label";
69
- type TextProps = {
69
+ type TextProps<As extends TextAs = "p"> = {
70
70
  /** @default "p" */
71
- as?: TextAs;
72
- } & OmitProps<React.ComponentProps<"p">, "style"> & ComponentStyle & ComponentHoverStyle;
71
+ as?: As;
72
+ } & OmitProps<React.ComponentProps<As>, "style"> & ComponentStyle & ComponentHoverStyle;
73
73
  type TextComponentType = {
74
- (props: ComponentPropWithRef<HTMLParagraphElement, TextProps>): React.ReactElement;
75
- unknown: (props: ComponentPropWithRef<HTMLParagraphElement, TextProps>) => React.ReactElement;
76
- oneLine: (props: ComponentPropWithRef<HTMLParagraphElement, TextProps>) => React.ReactElement;
74
+ <As extends TextAs>(props: ComponentPropWithRef<HTMLParagraphElement, TextProps<As>>): React.ReactElement;
75
+ unknown: <As extends TextAs>(props: ComponentPropWithRef<HTMLParagraphElement, TextProps<As>>) => React.ReactElement;
76
+ oneLine: <As extends TextAs>(props: ComponentPropWithRef<HTMLParagraphElement, TextProps<As>>) => React.ReactElement;
77
77
  };
78
78
  declare const TextComponent: TextComponentType;
79
79
  declare const Text: typeof TextComponent & {
@@ -110,7 +110,7 @@ type LoaderProps = {
110
110
  width?: number;
111
111
  /** @default false */
112
112
  disabled?: boolean;
113
- } & OmitProps<DivProps<unknown>, "width" | "height" | "color" | "background" | "borderRadius" | "mask" | "WebkitMask" | "padding" | "animation" | "animationName">;
113
+ } & OmitProps<DivProps, "width" | "height" | "color" | "background" | "borderRadius" | "mask" | "WebkitMask" | "padding" | "animation" | "animationName">;
114
114
  type LoaderComponentType = {
115
115
  (props: LoaderProps): React.ReactElement;
116
116
  box: (props: OmitProps<LoaderProps, "size"> & {
@@ -167,6 +167,8 @@ type ImageComponent = {
167
167
  profileImage: (props: ComponentPropWithRef<HTMLImageElement, OmitProps<ImageProps, "width" | "height"> & {
168
168
  /** @default 40 */
169
169
  size?: number;
170
+ letters?: string;
171
+ backgroundColor?: string;
170
172
  }>) => React.ReactElement;
171
173
  };
172
174
  declare const Image: ImageComponent;
@@ -254,8 +256,8 @@ type HorizontalDividerProps = DividerProps & {
254
256
  textColor?: string;
255
257
  };
256
258
  declare const _default$6: {
257
- vertical: React$1.NamedExoticComponent<VerticalDividerProps>;
258
- horizontal: React$1.NamedExoticComponent<HorizontalDividerProps>;
259
+ vertical: react.NamedExoticComponent<VerticalDividerProps>;
260
+ horizontal: react.NamedExoticComponent<HorizontalDividerProps>;
259
261
  };
260
262
 
261
263
  type ModalProps = {
@@ -307,22 +309,22 @@ type PageHolderProps = {
307
309
  children?: React.ReactNode;
308
310
  } & ComponentPaddingProps;
309
311
  declare function PageHolder({ noMaxContentWidth, children, ...props }: PageHolderProps): react_jsx_runtime.JSX.Element;
310
- declare const _default$5: React$1.MemoExoticComponent<typeof PageHolder>;
312
+ declare const _default$5: react.MemoExoticComponent<typeof PageHolder>;
311
313
 
312
314
  type PageHeaderProps = {
313
315
  imageUrl?: string;
314
316
  imageSize?: number;
315
317
  title?: string;
316
318
  titleAs?: TextAs;
317
- titleRightElement?: React__default.ReactNode;
319
+ titleRightElement?: React.ReactNode;
318
320
  description?: string;
319
- textAlign?: React__default.CSSProperties["textAlign"];
320
- rightElement?: React__default.ReactNode;
321
+ textAlign?: React.CSSProperties["textAlign"];
322
+ rightElement?: React.ReactNode;
321
323
  /** @default false */
322
324
  lightMode?: boolean;
323
325
  } & Pick<ComponentMarginProps, "marginBottom">;
324
326
  declare function PageHeader({ imageUrl, imageSize, title, titleAs, titleRightElement, description, textAlign, rightElement, lightMode, marginBottom, }: PageHeaderProps): react_jsx_runtime.JSX.Element;
325
- declare const _default$4: React__default.MemoExoticComponent<typeof PageHeader>;
327
+ declare const _default$4: react.MemoExoticComponent<typeof PageHeader>;
326
328
 
327
329
  type ChipProps = {
328
330
  text: string;
@@ -334,7 +336,7 @@ type ChipProps = {
334
336
  borderRadius?: number;
335
337
  /** @default false */
336
338
  isCircle?: boolean;
337
- } & Pick<DivProps<unknown>, "border" | "borderColor" | "borderWidth" | "borderStyle"> & Pick<TextProps, "fontFamily" | "fontSize" | "fontWeight" | "fontStyle">;
339
+ } & Pick<DivProps, "border" | "borderColor" | "borderWidth" | "borderStyle"> & Pick<TextProps, "fontFamily" | "fontSize" | "fontWeight" | "fontStyle">;
338
340
  type ChipComponentType = {
339
341
  (props: ComponentPropWithRef<HTMLDivElement, ChipProps>): React.ReactElement;
340
342
  colored: (props: ComponentPropWithRef<HTMLDivElement, OmitProps<ChipProps, "color" | "backgroundColor"> & {
@@ -353,32 +355,32 @@ type InputFieldProps = {
353
355
  infoText?: string;
354
356
  leftIcon?: IconName | AnyOtherString;
355
357
  rightIcon?: IconName | AnyOtherString;
356
- insideInputFieldComponent?: React__default.ReactNode;
358
+ insideInputFieldComponent?: React.ReactNode;
357
359
  /** @default false */
358
360
  withDebounce?: boolean;
359
361
  /** @default 0.5s */
360
362
  debounceDelay?: number;
361
363
  onChangeValue?: (value: string) => void;
362
364
  onClickRightIcon?: () => void;
363
- holderRef?: React__default.ForwardedRef<HTMLDivElement>;
364
- } & OmitProps<React__default.ComponentProps<"input">, "style" | "ref"> & ComponentStyle & ComponentHoverStyle;
365
- type TextareaFieldProps = OmitProps<InputFieldProps, "type"> & OmitProps<React__default.ComponentProps<"textarea">, "style" | "ref">;
365
+ holderRef?: React.ForwardedRef<HTMLDivElement>;
366
+ } & OmitProps<React.ComponentProps<"input">, "style" | "ref"> & ComponentStyle & ComponentHoverStyle;
367
+ type TextareaFieldProps = OmitProps<InputFieldProps, "type"> & OmitProps<React.ComponentProps<"textarea">, "style" | "ref">;
366
368
  type InputFieldComponentType = {
367
- (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>): React__default.ReactElement;
368
- multiline: (props: ComponentPropWithRef<HTMLTextAreaElement, TextareaFieldProps>) => React__default.ReactElement;
369
- email: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React__default.ReactElement;
370
- password: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React__default.ReactElement;
371
- search: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React__default.ReactElement;
372
- phoneNumber: (props: ComponentPropWithRef<HTMLInputElement, OmitProps<InputFieldProps, "type">>) => React__default.ReactElement;
369
+ (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>): React.ReactElement;
370
+ multiline: (props: ComponentPropWithRef<HTMLTextAreaElement, TextareaFieldProps>) => React.ReactElement;
371
+ email: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React.ReactElement;
372
+ password: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React.ReactElement;
373
+ search: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React.ReactElement;
374
+ phoneNumber: (props: ComponentPropWithRef<HTMLInputElement, OmitProps<InputFieldProps, "type">>) => React.ReactElement;
373
375
  date: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps & {
374
376
  minDate?: Date;
375
377
  maxDate?: Date;
376
- }>) => React__default.ReactElement;
378
+ }>) => React.ReactElement;
377
379
  dateTime: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps & {
378
380
  minDate?: Date;
379
381
  maxDate?: Date;
380
- }>) => React__default.ReactElement;
381
- time: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React__default.ReactElement;
382
+ }>) => React.ReactElement;
383
+ time: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React.ReactElement;
382
384
  };
383
385
  declare const InputFieldComponent: InputFieldComponentType;
384
386
  declare const InputField: typeof InputFieldComponent & {
@@ -407,6 +409,7 @@ type DropdownProps<Value, Data = unknown> = {
407
409
  infoText?: string;
408
410
  /** @default false */
409
411
  required?: boolean;
412
+ name?: string;
410
413
  /** @default false */
411
414
  disabled?: boolean;
412
415
  options: DropdownOption<Value, Data>[];
@@ -429,7 +432,7 @@ type DropdownProps<Value, Data = unknown> = {
429
432
  onChange?: (value: Value | undefined) => void;
430
433
  onChangeSearch?: (query: string) => void;
431
434
  renderOption?: (option: DropdownOption<Value, Data>, index: number, isSelected: boolean) => React.ReactNode;
432
- } & OmitProps<DivProps<unknown>, "onChange" | "defaultChecked">;
435
+ } & OmitProps<DivProps, "onChange" | "defaultChecked">;
433
436
  type DropdownComponentType = {
434
437
  <Value, Data>(props: ComponentPropWithRef<HTMLDivElement, DropdownProps<Value, Data>>): React.ReactElement;
435
438
  };
@@ -501,7 +504,7 @@ declare function useForm<FormFields extends Record<string | number, string | num
501
504
  setFieldsValue: (values: Partial<FormFields>) => void;
502
505
  getInputFieldProps: <FieldName extends keyof FormFields>(field: FieldName) => ComponentPropWithRef<HTMLInputElement, InputFieldProps>;
503
506
  getTextAreaProps: <FieldName extends keyof FormFields>(field: FieldName) => ComponentPropWithRef<HTMLTextAreaElement, TextareaFieldProps>;
504
- getDropdownFieldProps: <FieldName extends keyof FormFields>(field: FieldName) => OmitProps<ComponentPropWithRef<HTMLDivElement, DropdownProps<FormFields[FieldName], unknown>>, "options">;
507
+ getDropdownFieldProps: <FieldName extends keyof FormFields>(field: FieldName) => OmitProps<ComponentPropWithRef<HTMLDivElement, DropdownProps<FormFields[FieldName]>>, "options">;
505
508
  getCheckboxProps: <FieldName extends keyof FormFields>(field: FieldName) => ComponentPropWithRef<ToggleInputRef, ToggleInputProps<FormFields[FieldName]>>;
506
509
  getRadioButtonProps: <FieldName extends keyof FormFields>(field: FieldName, value: FormFields[FieldName]) => ComponentPropWithRef<ToggleInputRef, ToggleInputProps<FormFields[FieldName]>>;
507
510
  getSwitchProps: <FieldName extends keyof FormFields>(field: FieldName) => ComponentPropWithRef<ToggleInputRef, ToggleInputProps<FormFields[FieldName]>>;
@@ -538,7 +541,7 @@ type FormProps = {
538
541
  children?: React.ReactNode;
539
542
  } & ComponentMarginProps;
540
543
  declare function Form({ form, submitButtonText, submitButtonLoaderName, submitButtonId, submitButtonIsDisabled, actionButtonsLocation, gap, isSubmitting, isDestructive, onClickCancel, onSubmit, children, ...props }: FormProps): react_jsx_runtime.JSX.Element;
541
- declare const _default$2: React$1.MemoExoticComponent<typeof Form>;
544
+ declare const _default$2: react.MemoExoticComponent<typeof Form>;
542
545
 
543
546
  type LabelProps = {
544
547
  text?: string;
@@ -547,9 +550,10 @@ type LabelProps = {
547
550
  /** @default false */
548
551
  isError?: boolean;
549
552
  color?: string;
553
+ htmlFor?: string;
550
554
  };
551
- declare function Label({ text, required, isError, color }: LabelProps): react_jsx_runtime.JSX.Element;
552
- declare const _default$1: React$1.MemoExoticComponent<typeof Label>;
555
+ declare function Label({ text, required, isError, color, htmlFor }: LabelProps): react_jsx_runtime.JSX.Element;
556
+ declare const _default$1: react.MemoExoticComponent<typeof Label>;
553
557
 
554
558
  type FormRowProps = {
555
559
  oneItemOnly?: boolean;
@@ -680,7 +684,7 @@ type FoldableProps = {
680
684
  renderHeader?: (isOpen: boolean, toggleOpen: () => void) => React.ReactNode;
681
685
  onOpenChange?: (isOpen: boolean) => void;
682
686
  children?: React.ReactNode;
683
- } & DivProps<unknown>;
687
+ } & DivProps;
684
688
  type FoldableRef = {
685
689
  isOpen: boolean;
686
690
  open: () => void;
@@ -731,7 +735,7 @@ type BetterHtmlProviderProps = {
731
735
  children?: React.ReactNode;
732
736
  };
733
737
  declare function BetterHtmlProvider({ value, plugins: pluginsToUse, children }: BetterHtmlProviderProps): react_jsx_runtime.JSX.Element;
734
- declare const _default: React$1.MemoExoticComponent<typeof BetterHtmlProvider>;
738
+ declare const _default: react.MemoExoticComponent<typeof BetterHtmlProvider>;
735
739
 
736
740
  type BrowserName = "firefox" | "chrome" | "safari" | "edge" | "opera";
737
741
 
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { WebTarget } from 'styled-components';
2
- import * as React$1 from 'react';
3
- import React__default, { ComponentType, ComponentProps, ReactNode } from 'react';
2
+ import * as react from 'react';
3
+ import { ComponentType, ComponentProps, ReactNode } from 'react';
4
4
  import * as react_jsx_runtime from 'react/jsx-runtime';
5
5
 
6
6
  type PluginName = "react-router-dom";
@@ -36,7 +36,7 @@ type DeepPartialRecord<T> = {
36
36
  type PickAllRequired<T, K extends keyof T> = Required<Pick<T, K>>;
37
37
  type AnyOtherString = Omit<string & {}, "">;
38
38
 
39
- type DivProps<Value> = {
39
+ type DivProps<Value = unknown> = {
40
40
  value?: Value;
41
41
  /** @default "div" */
42
42
  as?: WebTarget;
@@ -66,14 +66,14 @@ declare const Div: typeof DivComponent & {
66
66
  };
67
67
 
68
68
  type TextAs = "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span" | "label";
69
- type TextProps = {
69
+ type TextProps<As extends TextAs = "p"> = {
70
70
  /** @default "p" */
71
- as?: TextAs;
72
- } & OmitProps<React.ComponentProps<"p">, "style"> & ComponentStyle & ComponentHoverStyle;
71
+ as?: As;
72
+ } & OmitProps<React.ComponentProps<As>, "style"> & ComponentStyle & ComponentHoverStyle;
73
73
  type TextComponentType = {
74
- (props: ComponentPropWithRef<HTMLParagraphElement, TextProps>): React.ReactElement;
75
- unknown: (props: ComponentPropWithRef<HTMLParagraphElement, TextProps>) => React.ReactElement;
76
- oneLine: (props: ComponentPropWithRef<HTMLParagraphElement, TextProps>) => React.ReactElement;
74
+ <As extends TextAs>(props: ComponentPropWithRef<HTMLParagraphElement, TextProps<As>>): React.ReactElement;
75
+ unknown: <As extends TextAs>(props: ComponentPropWithRef<HTMLParagraphElement, TextProps<As>>) => React.ReactElement;
76
+ oneLine: <As extends TextAs>(props: ComponentPropWithRef<HTMLParagraphElement, TextProps<As>>) => React.ReactElement;
77
77
  };
78
78
  declare const TextComponent: TextComponentType;
79
79
  declare const Text: typeof TextComponent & {
@@ -110,7 +110,7 @@ type LoaderProps = {
110
110
  width?: number;
111
111
  /** @default false */
112
112
  disabled?: boolean;
113
- } & OmitProps<DivProps<unknown>, "width" | "height" | "color" | "background" | "borderRadius" | "mask" | "WebkitMask" | "padding" | "animation" | "animationName">;
113
+ } & OmitProps<DivProps, "width" | "height" | "color" | "background" | "borderRadius" | "mask" | "WebkitMask" | "padding" | "animation" | "animationName">;
114
114
  type LoaderComponentType = {
115
115
  (props: LoaderProps): React.ReactElement;
116
116
  box: (props: OmitProps<LoaderProps, "size"> & {
@@ -167,6 +167,8 @@ type ImageComponent = {
167
167
  profileImage: (props: ComponentPropWithRef<HTMLImageElement, OmitProps<ImageProps, "width" | "height"> & {
168
168
  /** @default 40 */
169
169
  size?: number;
170
+ letters?: string;
171
+ backgroundColor?: string;
170
172
  }>) => React.ReactElement;
171
173
  };
172
174
  declare const Image: ImageComponent;
@@ -254,8 +256,8 @@ type HorizontalDividerProps = DividerProps & {
254
256
  textColor?: string;
255
257
  };
256
258
  declare const _default$6: {
257
- vertical: React$1.NamedExoticComponent<VerticalDividerProps>;
258
- horizontal: React$1.NamedExoticComponent<HorizontalDividerProps>;
259
+ vertical: react.NamedExoticComponent<VerticalDividerProps>;
260
+ horizontal: react.NamedExoticComponent<HorizontalDividerProps>;
259
261
  };
260
262
 
261
263
  type ModalProps = {
@@ -307,22 +309,22 @@ type PageHolderProps = {
307
309
  children?: React.ReactNode;
308
310
  } & ComponentPaddingProps;
309
311
  declare function PageHolder({ noMaxContentWidth, children, ...props }: PageHolderProps): react_jsx_runtime.JSX.Element;
310
- declare const _default$5: React$1.MemoExoticComponent<typeof PageHolder>;
312
+ declare const _default$5: react.MemoExoticComponent<typeof PageHolder>;
311
313
 
312
314
  type PageHeaderProps = {
313
315
  imageUrl?: string;
314
316
  imageSize?: number;
315
317
  title?: string;
316
318
  titleAs?: TextAs;
317
- titleRightElement?: React__default.ReactNode;
319
+ titleRightElement?: React.ReactNode;
318
320
  description?: string;
319
- textAlign?: React__default.CSSProperties["textAlign"];
320
- rightElement?: React__default.ReactNode;
321
+ textAlign?: React.CSSProperties["textAlign"];
322
+ rightElement?: React.ReactNode;
321
323
  /** @default false */
322
324
  lightMode?: boolean;
323
325
  } & Pick<ComponentMarginProps, "marginBottom">;
324
326
  declare function PageHeader({ imageUrl, imageSize, title, titleAs, titleRightElement, description, textAlign, rightElement, lightMode, marginBottom, }: PageHeaderProps): react_jsx_runtime.JSX.Element;
325
- declare const _default$4: React__default.MemoExoticComponent<typeof PageHeader>;
327
+ declare const _default$4: react.MemoExoticComponent<typeof PageHeader>;
326
328
 
327
329
  type ChipProps = {
328
330
  text: string;
@@ -334,7 +336,7 @@ type ChipProps = {
334
336
  borderRadius?: number;
335
337
  /** @default false */
336
338
  isCircle?: boolean;
337
- } & Pick<DivProps<unknown>, "border" | "borderColor" | "borderWidth" | "borderStyle"> & Pick<TextProps, "fontFamily" | "fontSize" | "fontWeight" | "fontStyle">;
339
+ } & Pick<DivProps, "border" | "borderColor" | "borderWidth" | "borderStyle"> & Pick<TextProps, "fontFamily" | "fontSize" | "fontWeight" | "fontStyle">;
338
340
  type ChipComponentType = {
339
341
  (props: ComponentPropWithRef<HTMLDivElement, ChipProps>): React.ReactElement;
340
342
  colored: (props: ComponentPropWithRef<HTMLDivElement, OmitProps<ChipProps, "color" | "backgroundColor"> & {
@@ -353,32 +355,32 @@ type InputFieldProps = {
353
355
  infoText?: string;
354
356
  leftIcon?: IconName | AnyOtherString;
355
357
  rightIcon?: IconName | AnyOtherString;
356
- insideInputFieldComponent?: React__default.ReactNode;
358
+ insideInputFieldComponent?: React.ReactNode;
357
359
  /** @default false */
358
360
  withDebounce?: boolean;
359
361
  /** @default 0.5s */
360
362
  debounceDelay?: number;
361
363
  onChangeValue?: (value: string) => void;
362
364
  onClickRightIcon?: () => void;
363
- holderRef?: React__default.ForwardedRef<HTMLDivElement>;
364
- } & OmitProps<React__default.ComponentProps<"input">, "style" | "ref"> & ComponentStyle & ComponentHoverStyle;
365
- type TextareaFieldProps = OmitProps<InputFieldProps, "type"> & OmitProps<React__default.ComponentProps<"textarea">, "style" | "ref">;
365
+ holderRef?: React.ForwardedRef<HTMLDivElement>;
366
+ } & OmitProps<React.ComponentProps<"input">, "style" | "ref"> & ComponentStyle & ComponentHoverStyle;
367
+ type TextareaFieldProps = OmitProps<InputFieldProps, "type"> & OmitProps<React.ComponentProps<"textarea">, "style" | "ref">;
366
368
  type InputFieldComponentType = {
367
- (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>): React__default.ReactElement;
368
- multiline: (props: ComponentPropWithRef<HTMLTextAreaElement, TextareaFieldProps>) => React__default.ReactElement;
369
- email: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React__default.ReactElement;
370
- password: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React__default.ReactElement;
371
- search: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React__default.ReactElement;
372
- phoneNumber: (props: ComponentPropWithRef<HTMLInputElement, OmitProps<InputFieldProps, "type">>) => React__default.ReactElement;
369
+ (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>): React.ReactElement;
370
+ multiline: (props: ComponentPropWithRef<HTMLTextAreaElement, TextareaFieldProps>) => React.ReactElement;
371
+ email: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React.ReactElement;
372
+ password: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React.ReactElement;
373
+ search: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React.ReactElement;
374
+ phoneNumber: (props: ComponentPropWithRef<HTMLInputElement, OmitProps<InputFieldProps, "type">>) => React.ReactElement;
373
375
  date: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps & {
374
376
  minDate?: Date;
375
377
  maxDate?: Date;
376
- }>) => React__default.ReactElement;
378
+ }>) => React.ReactElement;
377
379
  dateTime: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps & {
378
380
  minDate?: Date;
379
381
  maxDate?: Date;
380
- }>) => React__default.ReactElement;
381
- time: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React__default.ReactElement;
382
+ }>) => React.ReactElement;
383
+ time: (props: ComponentPropWithRef<HTMLInputElement, InputFieldProps>) => React.ReactElement;
382
384
  };
383
385
  declare const InputFieldComponent: InputFieldComponentType;
384
386
  declare const InputField: typeof InputFieldComponent & {
@@ -407,6 +409,7 @@ type DropdownProps<Value, Data = unknown> = {
407
409
  infoText?: string;
408
410
  /** @default false */
409
411
  required?: boolean;
412
+ name?: string;
410
413
  /** @default false */
411
414
  disabled?: boolean;
412
415
  options: DropdownOption<Value, Data>[];
@@ -429,7 +432,7 @@ type DropdownProps<Value, Data = unknown> = {
429
432
  onChange?: (value: Value | undefined) => void;
430
433
  onChangeSearch?: (query: string) => void;
431
434
  renderOption?: (option: DropdownOption<Value, Data>, index: number, isSelected: boolean) => React.ReactNode;
432
- } & OmitProps<DivProps<unknown>, "onChange" | "defaultChecked">;
435
+ } & OmitProps<DivProps, "onChange" | "defaultChecked">;
433
436
  type DropdownComponentType = {
434
437
  <Value, Data>(props: ComponentPropWithRef<HTMLDivElement, DropdownProps<Value, Data>>): React.ReactElement;
435
438
  };
@@ -501,7 +504,7 @@ declare function useForm<FormFields extends Record<string | number, string | num
501
504
  setFieldsValue: (values: Partial<FormFields>) => void;
502
505
  getInputFieldProps: <FieldName extends keyof FormFields>(field: FieldName) => ComponentPropWithRef<HTMLInputElement, InputFieldProps>;
503
506
  getTextAreaProps: <FieldName extends keyof FormFields>(field: FieldName) => ComponentPropWithRef<HTMLTextAreaElement, TextareaFieldProps>;
504
- getDropdownFieldProps: <FieldName extends keyof FormFields>(field: FieldName) => OmitProps<ComponentPropWithRef<HTMLDivElement, DropdownProps<FormFields[FieldName], unknown>>, "options">;
507
+ getDropdownFieldProps: <FieldName extends keyof FormFields>(field: FieldName) => OmitProps<ComponentPropWithRef<HTMLDivElement, DropdownProps<FormFields[FieldName]>>, "options">;
505
508
  getCheckboxProps: <FieldName extends keyof FormFields>(field: FieldName) => ComponentPropWithRef<ToggleInputRef, ToggleInputProps<FormFields[FieldName]>>;
506
509
  getRadioButtonProps: <FieldName extends keyof FormFields>(field: FieldName, value: FormFields[FieldName]) => ComponentPropWithRef<ToggleInputRef, ToggleInputProps<FormFields[FieldName]>>;
507
510
  getSwitchProps: <FieldName extends keyof FormFields>(field: FieldName) => ComponentPropWithRef<ToggleInputRef, ToggleInputProps<FormFields[FieldName]>>;
@@ -538,7 +541,7 @@ type FormProps = {
538
541
  children?: React.ReactNode;
539
542
  } & ComponentMarginProps;
540
543
  declare function Form({ form, submitButtonText, submitButtonLoaderName, submitButtonId, submitButtonIsDisabled, actionButtonsLocation, gap, isSubmitting, isDestructive, onClickCancel, onSubmit, children, ...props }: FormProps): react_jsx_runtime.JSX.Element;
541
- declare const _default$2: React$1.MemoExoticComponent<typeof Form>;
544
+ declare const _default$2: react.MemoExoticComponent<typeof Form>;
542
545
 
543
546
  type LabelProps = {
544
547
  text?: string;
@@ -547,9 +550,10 @@ type LabelProps = {
547
550
  /** @default false */
548
551
  isError?: boolean;
549
552
  color?: string;
553
+ htmlFor?: string;
550
554
  };
551
- declare function Label({ text, required, isError, color }: LabelProps): react_jsx_runtime.JSX.Element;
552
- declare const _default$1: React$1.MemoExoticComponent<typeof Label>;
555
+ declare function Label({ text, required, isError, color, htmlFor }: LabelProps): react_jsx_runtime.JSX.Element;
556
+ declare const _default$1: react.MemoExoticComponent<typeof Label>;
553
557
 
554
558
  type FormRowProps = {
555
559
  oneItemOnly?: boolean;
@@ -680,7 +684,7 @@ type FoldableProps = {
680
684
  renderHeader?: (isOpen: boolean, toggleOpen: () => void) => React.ReactNode;
681
685
  onOpenChange?: (isOpen: boolean) => void;
682
686
  children?: React.ReactNode;
683
- } & DivProps<unknown>;
687
+ } & DivProps;
684
688
  type FoldableRef = {
685
689
  isOpen: boolean;
686
690
  open: () => void;
@@ -731,7 +735,7 @@ type BetterHtmlProviderProps = {
731
735
  children?: React.ReactNode;
732
736
  };
733
737
  declare function BetterHtmlProvider({ value, plugins: pluginsToUse, children }: BetterHtmlProviderProps): react_jsx_runtime.JSX.Element;
734
- declare const _default: React$1.MemoExoticComponent<typeof BetterHtmlProvider>;
738
+ declare const _default: react.MemoExoticComponent<typeof BetterHtmlProvider>;
735
739
 
736
740
  type BrowserName = "firefox" | "chrome" | "safari" | "edge" | "opera";
737
741