tw-react-components 0.0.159 → 0.0.163

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "tw-react-components",
   "description": "A set of React components build with TailwindCSS to make a nice dashboard.",
-  "version": "0.0.159",
+  "version": "0.0.163",
   "license": "MIT",
   "homepage": "https://bacali95.github.io/tw-react-components",
   "type": "module",

package/src/components/Badge/index.d.ts

@@ -1,8 +1,7 @@
+import type { FC } from 'react';
 import type { ButtonProps, ButtonVariant } from '../Button';
 export type BadgeVariant = Exclude<ButtonVariant, 'text'>;
 export type BadgeProps = Omit<ButtonProps, 'variant'> & {
     variant?: BadgeVariant;
 };
-export declare const Badge: import("react").ForwardRefExoticComponent<Omit<ButtonProps, "variant"> & {
-    variant?: BadgeVariant;
-} & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const Badge: FC<BadgeProps>;

package/src/components/Block/index.d.ts

@@ -1,15 +1,9 @@
-import type { ComponentProps, PropsWithoutRef } from 'react';
-export type BlockProps = PropsWithoutRef<ComponentProps<'div'> & {
+import type { ComponentProps, FC } from 'react';
+export type BlockProps = ComponentProps<'div'> & {
     className?: string;
     centered?: boolean;
     container?: boolean;
     fullWidth?: boolean;
     fullHeight?: boolean;
-}>;
-export declare const Block: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    className?: string;
-    centered?: boolean;
-    container?: boolean;
-    fullWidth?: boolean;
-    fullHeight?: boolean;
-}, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+};
+export declare const Block: FC<BlockProps>;

package/src/components/Button/index.d.ts

@@ -1,8 +1,8 @@
 import type { LucideIcon } from 'lucide-react';
-import type { ComponentProps, PropsWithoutRef } from 'react';
+import type { ComponentProps, FC } from 'react';
 import type { Color, Size } from '../types';
 export type ButtonVariant = 'filled' | 'outlined' | 'text';
-export type ButtonProps = PropsWithoutRef<ComponentProps<'button'>> & {
+export type ButtonProps = ComponentProps<'button'> & {
     size?: Size;
     color?: Color;
     variant?: ButtonVariant;
@@ -11,12 +11,4 @@ export type ButtonProps = PropsWithoutRef<ComponentProps<'button'>> & {
     suffixIcon?: LucideIcon;
     unstyled?: boolean;
 };
-export declare const Button: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-    size?: Size;
-    color?: Color;
-    variant?: ButtonVariant;
-    rounded?: boolean;
-    prefixIcon?: LucideIcon;
-    suffixIcon?: LucideIcon;
-    unstyled?: boolean;
-} & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const Button: FC<ButtonProps>;

package/src/components/Card/index.d.ts

@@ -1,7 +1,3 @@
-export declare const Card: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    className?: string;
-    centered?: boolean;
-    container?: boolean;
-    fullWidth?: boolean;
-    fullHeight?: boolean;
-}, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+import { type FC } from 'react';
+import type { BlockProps } from '../Block';
+export declare const Card: FC<BlockProps>;

package/src/components/Dialog/Dialog.d.ts

@@ -2,12 +2,12 @@ import * as DialogPrimitive from '@radix-ui/react-dialog';
 import type { FC, HTMLAttributes } from 'react';
 export declare const Dialog: FC<DialogPrimitive.DialogProps> & {
     Portal: FC<DialogPrimitive.DialogPortalProps>;
-    Overlay: import("react").ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Overlay: FC<DialogPrimitive.DialogOverlayProps & import("react").RefAttributes<HTMLDivElement>>;
     Close: import("react").ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
     Trigger: import("react").ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
-    Content: import("react").ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    Content: FC<DialogPrimitive.DialogContentProps & import("react").RefAttributes<HTMLDivElement> & {
         fullScreen?: boolean;
-    } & import("react").RefAttributes<HTMLDivElement>>;
+    }>;
     Header: {
         ({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
         displayName: string;
@@ -16,6 +16,6 @@ export declare const Dialog: FC<DialogPrimitive.DialogProps> & {
         ({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
-    Title: import("react").ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>, "ref"> & import("react").RefAttributes<HTMLHeadingElement>>;
-    Description: import("react").ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
+    Title: FC<DialogPrimitive.DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>>;
+    Description: FC<DialogPrimitive.DialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>>;
 };

package/src/components/DropdownMenu/index.d.ts

@@ -1,31 +1,32 @@
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
-import type { HTMLAttributes } from 'react';
-export declare const DropdownMenu: import("react").FC<DropdownMenuPrimitive.DropdownMenuProps> & {
+import type { FC, HTMLAttributes } from 'react';
+export declare const DropdownMenu: FC<DropdownMenuPrimitive.DropdownMenuProps> & {
     Trigger: import("react").ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
-    Content: import("react").ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    Item: import("react").ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    Content: FC<DropdownMenuPrimitive.DropdownMenuContentProps & import("react").RefAttributes<HTMLDivElement>>;
+    Item: FC<DropdownMenuPrimitive.DropdownMenuItemProps & import("react").RefAttributes<HTMLDivElement> & {
         inset?: boolean;
-    } & import("react").RefAttributes<HTMLDivElement>>;
-    CheckboxItem: import("react").ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuCheckboxItemProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    RadioItem: import("react").ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuRadioItemProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    Label: import("react").ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    }>;
+    CheckboxItem: FC<DropdownMenuPrimitive.DropdownMenuCheckboxItemProps & import("react").RefAttributes<HTMLDivElement>>;
+    RadioItem: FC<DropdownMenuPrimitive.DropdownMenuRadioItemProps & import("react").RefAttributes<HTMLDivElement>>;
+    Label: FC<DropdownMenuPrimitive.DropdownMenuLabelProps & import("react").RefAttributes<HTMLDivElement> & {
         inset?: boolean;
-    } & import("react").RefAttributes<HTMLDivElement>>;
-    Separator: import("react").ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    Icon: import("react").ForwardRefExoticComponent<{
+    }>;
+    Separator: FC<DropdownMenuPrimitive.DropdownMenuSeparatorProps & import("react").RefAttributes<HTMLDivElement>>;
+    Icon: FC<{
         className?: string;
         icon: import("lucide-react").LucideIcon;
-    } & import("react").RefAttributes<SVGSVGElement>>;
+        ref?: import("react").Ref<SVGSVGElement>;
+    }>;
     Shortcut: {
         ({ className, ...props }: HTMLAttributes<HTMLSpanElement>): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
     Group: import("react").ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & import("react").RefAttributes<HTMLDivElement>>;
-    Portal: import("react").FC<DropdownMenuPrimitive.DropdownMenuPortalProps>;
-    Sub: import("react").FC<DropdownMenuPrimitive.DropdownMenuSubProps>;
-    SubContent: import("react").ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    SubTrigger: import("react").ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubTriggerProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    Portal: FC<DropdownMenuPrimitive.DropdownMenuPortalProps>;
+    Sub: FC<DropdownMenuPrimitive.DropdownMenuSubProps>;
+    SubContent: FC<DropdownMenuPrimitive.DropdownMenuSubContentProps & import("react").RefAttributes<HTMLDivElement>>;
+    SubTrigger: FC<DropdownMenuPrimitive.DropdownMenuSubTriggerProps & import("react").RefAttributes<HTMLDivElement> & {
         inset?: boolean;
-    } & import("react").RefAttributes<HTMLDivElement>>;
+    }>;
     RadioGroup: import("react").ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuRadioGroupProps & import("react").RefAttributes<HTMLDivElement>>;
 };

package/src/components/Flex/index.d.ts

@@ -1,3 +1,4 @@
+import type { FC } from 'react';
 import type { BlockProps } from '../Block';
 type Direction = 'row' | 'column';
 type Position = 'start' | 'center' | 'end';
@@ -8,17 +9,5 @@ export type FlexProps = BlockProps & {
     align?: Position;
     justify?: Position | 'between';
 };
-export declare const Flex: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    className?: string;
-    centered?: boolean;
-    container?: boolean;
-    fullWidth?: boolean;
-    fullHeight?: boolean;
-}, "ref"> & {
-    reverse?: boolean;
-    wrap?: boolean;
-    direction?: Direction;
-    align?: Position;
-    justify?: Position | "between";
-} & import("react").RefAttributes<HTMLDivElement>>;
+export declare const Flex: FC<FlexProps>;
 export {};

package/src/components/Form/controls/custom/date-time/index.d.ts

@@ -1,3 +1,4 @@
+import type { FC, Ref } from 'react';
 import type { BasicInputProps } from '../../primitive';
 export type DateTimeInputType = 'date' | 'time' | 'datetime-local';
 export type DateTimeInputProps = {
@@ -10,17 +11,7 @@ export type DateTimeInputProps = {
     maxDate?: Date | null;
     displayFormat?: string;
     displayLocale?: string;
+    ref?: Ref<HTMLDivElement>;
     onChange?: (date?: Date | null) => void;
 } & Pick<BasicInputProps<'text'>, 'className' | 'inputClassName' | 'extensionClassName' | 'label' | 'name' | 'description' | 'placeholder' | 'required' | 'disabled' | 'onBlur' | 'size' | 'readOnly'>;
-export declare const DateTimeInput: import("react").ForwardRefExoticComponent<{
-    value?: string | Date | null;
-    type?: DateTimeInputType;
-    hasErrors?: boolean;
-    clearable?: boolean;
-    step?: number;
-    minDate?: Date | null;
-    maxDate?: Date | null;
-    displayFormat?: string;
-    displayLocale?: string;
-    onChange?: (date?: Date | null) => void;
-} & Pick<BasicInputProps<"text">, "size" | "label" | "disabled" | "name" | "placeholder" | "readOnly" | "required" | "className" | "onBlur" | "inputClassName" | "extensionClassName" | "description"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const DateTimeInput: FC<DateTimeInputProps>;

package/src/components/Form/controls/custom/file.d.ts

@@ -1,11 +1,8 @@
+import { type FC } from 'react';
 import type { BasicInputProps } from '../primitive';
 export type FileInputProps = {
     value?: string | null;
     onChange?: (item?: string) => void;
     onFileChange?: (file?: File) => void;
 } & Pick<BasicInputProps<'text'>, 'className' | 'inputClassName' | 'extensionClassName' | 'name' | 'label' | 'placeholder' | 'description' | 'size' | 'accept' | 'required' | 'hasErrors' | 'disabled'>;
-export declare const FileInput: import("react").ForwardRefExoticComponent<{
-    value?: string | null;
-    onChange?: (item?: string) => void;
-    onFileChange?: (file?: File) => void;
-} & Pick<BasicInputProps<"text">, "size" | "label" | "accept" | "disabled" | "name" | "placeholder" | "required" | "className" | "inputClassName" | "extensionClassName" | "description" | "hasErrors"> & import("react").RefAttributes<HTMLInputElement>>;
+export declare const FileInput: FC<FileInputProps>;

package/src/components/Form/controls/custom/select/index.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardedRef, JSX, ReactNode, RefObject } from 'react';
+import type { JSX, ReactNode, Ref } from 'react';
 import type { BasicInputProps } from '../../primitive';
 export type SelectInputType = 'select';
 export type SelectItem<T, Group extends boolean = false> = {
@@ -21,7 +21,7 @@ export type SelectInputProps<T = any> = {
     search?: boolean;
     searchPredicate?: (item: SelectItem<T>, searchValue: string) => boolean;
     selectPredicate?: (a: T, b: T) => boolean;
-    parentRef?: RefObject<HTMLDivElement>;
+    parentRef?: Ref<HTMLDivElement | null>;
 } & ({
     multiple?: false;
     value?: T | null;
@@ -30,9 +30,5 @@ export type SelectInputProps<T = any> = {
     multiple: true;
     value: T[];
     onChange?: (item?: T[]) => void;
-}) & Pick<BasicInputProps<'text'>, 'className' | 'inputClassName' | 'extensionClassName' | 'name' | 'label' | 'description' | 'size' | 'placeholder' | 'required' | 'hasErrors' | 'disabled' | 'readOnly'>;
-export declare const SelectInput: (<T>(props: SelectInputProps<T> & {
-    ref?: ForwardedRef<HTMLDivElement>;
-}) => JSX.Element) & {
-    readonly $$typeof: symbol;
-};
+}) & Pick<BasicInputProps<'text'>, 'className' | 'inputClassName' | 'extensionClassName' | 'name' | 'label' | 'description' | 'size' | 'placeholder' | 'required' | 'hasErrors' | 'disabled' | 'readOnly' | 'ref'>;
+export declare const SelectInput: <T>({ className, items, renderItem, value, multiple, clearable, allowAddition, onNewItemAdded, search, searchPredicate, selectPredicate, onChange, readOnly, parentRef, ...props }: SelectInputProps<T>) => JSX.Element;

package/src/components/Form/controls/primitive/BasicInput.d.ts

@@ -13,20 +13,8 @@ export type BasicInputProps<Type extends InputType> = {
     suffixIcon?: FC<ComponentProps<'svg'>>;
     onClear?: () => void;
     onSuffixIconClick?: (event: MouseEvent<HTMLDivElement>) => void;
-} & Omit<Type extends 'textarea' ? ComponentProps<'textarea'> : ComponentProps<'input'>, 'id' | 'ref' | 'size'>;
-export declare const BasicInput: import("react").ForwardRefExoticComponent<{
-    inputClassName?: string;
-    extensionClassName?: string;
-    type?: InputType;
-    label?: string;
-    description?: ReactNode;
-    size?: Size;
-    hasErrors?: boolean;
-    clearable?: boolean;
-    suffixIcon?: FC<ComponentProps<"svg">>;
-    onClear?: () => void;
-    onSuffixIconClick?: (event: MouseEvent<HTMLDivElement>) => void;
-} & Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement> | import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "id" | "ref" | "size"> & import("react").RefAttributes<HTMLInputElement | HTMLTextAreaElement>>;
+} & Omit<Type extends 'textarea' ? ComponentProps<'textarea'> : ComponentProps<'input'>, 'id' | 'size'>;
+export declare const BasicInput: <Type extends InputType>({ className, inputClassName, extensionClassName, type, label, description, size, hasErrors, clearable, suffixIcon: SuffixIcon, onClear, onSuffixIconClick, ...props }: BasicInputProps<Type>) => import("react/jsx-runtime").JSX.Element;
 export declare const BasicInputExtension: FC<PropsWithChildren<{
     className?: string;
     size: Size;

package/src/components/Form/controls/primitive/CheckBoxInput.d.ts

@@ -1,3 +1,4 @@
+import type { FC } from 'react';
 import type { BasicInputProps } from './BasicInput';
 export type CheckboxInputProps = Omit<BasicInputProps<'checkbox'>, 'type'>;
-export declare const CheckboxInput: import("react").ForwardRefExoticComponent<CheckboxInputProps & import("react").RefAttributes<HTMLInputElement>>;
+export declare const CheckboxInput: FC<CheckboxInputProps>;

package/src/components/Form/controls/primitive/EmailInput.d.ts

@@ -1,3 +1,4 @@
+import type { FC } from 'react';
 import type { BasicInputProps } from './BasicInput';
 export type EmailInputProps = Omit<BasicInputProps<'email'>, 'type'>;
-export declare const EmailInput: import("react").ForwardRefExoticComponent<EmailInputProps & import("react").RefAttributes<HTMLInputElement>>;
+export declare const EmailInput: FC<EmailInputProps>;

package/src/components/Form/controls/primitive/NumberInput.d.ts

@@ -1,8 +1,6 @@
-import type { ReactNode } from 'react';
+import type { FC, ReactNode } from 'react';
 import type { BasicInputProps } from './BasicInput';
 export type NumberInputProps = Omit<BasicInputProps<'number'>, 'type'> & {
     unit?: ReactNode;
 };
-export declare const NumberInput: import("react").ForwardRefExoticComponent<Omit<BasicInputProps<"number">, "type"> & {
-    unit?: ReactNode;
-} & import("react").RefAttributes<HTMLInputElement>>;
+export declare const NumberInput: FC<NumberInputProps>;

package/src/components/Form/controls/primitive/PasswordInput.d.ts

@@ -1,3 +1,4 @@
+import { type FC } from 'react';
 import type { BasicInputProps } from './BasicInput';
 export type PasswordInputProps = Omit<BasicInputProps<'number'>, 'type'>;
-export declare const PasswordInput: import("react").ForwardRefExoticComponent<PasswordInputProps & import("react").RefAttributes<HTMLInputElement>>;
+export declare const PasswordInput: FC<PasswordInputProps>;

package/src/components/Form/controls/primitive/TextInput.d.ts

@@ -1,3 +1,4 @@
+import type { FC } from 'react';
 import type { BasicInputProps } from './BasicInput';
 export type TextInputProps = Omit<BasicInputProps<'text'>, 'type'>;
-export declare const TextInput: import("react").ForwardRefExoticComponent<TextInputProps & import("react").RefAttributes<HTMLInputElement>>;
+export declare const TextInput: FC<TextInputProps>;

package/src/components/Form/controls/primitive/TextareaInput.d.ts

@@ -1,3 +1,4 @@
+import type { FC } from 'react';
 import type { BasicInputProps } from './BasicInput';
 export type TextareaInputProps = Omit<BasicInputProps<'textarea'>, 'type'>;
-export declare const TextareaInput: import("react").ForwardRefExoticComponent<TextareaInputProps & import("react").RefAttributes<HTMLTextAreaElement>>;
+export declare const TextareaInput: FC<TextareaInputProps>;

package/src/components/Form/controls/with-form.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent } from 'react';
+import type { FC } from 'react';
 import type { ControllerRenderProps, Validate } from 'react-hook-form';
 import type { DateTimeInputProps, DateTimeInputType, FileInputProps, SelectInputProps, SelectInputType } from './custom';
 import type { BasicInputProps, CheckboxInputProps, EmailInputProps, InputType, NumberInputProps, PasswordInputProps, TextInputProps, TextareaInputProps } from './primitive';
@@ -8,49 +8,13 @@ export type WithFormProps<Type extends InputType | SelectInputType, Props = Type
     validate?: Type extends 'number' ? Validate<number, any> : Type extends DateTimeInputType ? Validate<Date, any> : Type extends SelectInputType ? Validate<any, any> : Validate<string, any>;
 } & Omit<Props, 'pattern' | keyof Omit<ControllerRenderProps, 'disabled'>>;
 export declare const FormInputs: {
-    Text: ForwardRefExoticComponent<{
-        name: string;
-        pattern?: RegExp;
-        validate?: Validate<string, any> | undefined;
-    } & Omit<TextInputProps, "pattern" | "ref" | "name" | "value" | "onChange" | "onBlur"> & import("react").RefAttributes<HTMLInputElement>>;
-    Email: ForwardRefExoticComponent<{
-        name: string;
-        pattern?: RegExp;
-        validate?: Validate<string, any> | undefined;
-    } & Omit<EmailInputProps, "pattern" | "ref" | "name" | "value" | "onChange" | "onBlur"> & import("react").RefAttributes<HTMLInputElement>>;
-    Password: ForwardRefExoticComponent<{
-        name: string;
-        pattern?: RegExp;
-        validate?: Validate<string, any> | undefined;
-    } & Omit<PasswordInputProps, "pattern" | "ref" | "name" | "value" | "onChange" | "onBlur"> & import("react").RefAttributes<HTMLInputElement>>;
-    Textarea: ForwardRefExoticComponent<{
-        name: string;
-        pattern?: RegExp;
-        validate?: Validate<string, any> | undefined;
-    } & Omit<TextareaInputProps, "pattern" | "ref" | "name" | "value" | "onChange" | "onBlur"> & import("react").RefAttributes<HTMLTextAreaElement>>;
-    Number: ForwardRefExoticComponent<{
-        name: string;
-        pattern?: RegExp;
-        validate?: Validate<number, any> | undefined;
-    } & Omit<NumberInputProps, "pattern" | "ref" | "name" | "value" | "onChange" | "onBlur"> & import("react").RefAttributes<HTMLInputElement>>;
-    Checkbox: ForwardRefExoticComponent<{
-        name: string;
-        pattern?: RegExp;
-        validate?: Validate<string, any> | undefined;
-    } & Omit<CheckboxInputProps, "pattern" | "ref" | "name" | "value" | "onChange" | "onBlur"> & import("react").RefAttributes<HTMLInputElement>>;
-    DateTime: ForwardRefExoticComponent<{
-        name: string;
-        pattern?: RegExp;
-        validate?: Validate<Date, any> | undefined;
-    } & Omit<DateTimeInputProps, "pattern" | "ref" | "name" | "value" | "onChange" | "onBlur"> & import("react").RefAttributes<HTMLDivElement>>;
-    Select: ForwardRefExoticComponent<{
-        name: string;
-        pattern?: RegExp;
-        validate?: Validate<any, any> | undefined;
-    } & Omit<SelectInputProps, "pattern" | "ref" | "name" | "value" | "onChange" | "onBlur"> & import("react").RefAttributes<HTMLInputElement>>;
-    File: ForwardRefExoticComponent<{
-        name: string;
-        pattern?: RegExp;
-        validate?: Validate<string, any> | undefined;
-    } & Omit<FileInputProps, "pattern" | "ref" | "name" | "value" | "onChange" | "onBlur"> & import("react").RefAttributes<HTMLInputElement>>;
+    Text: FC<WithFormProps<"text", TextInputProps>>;
+    Email: FC<WithFormProps<"email", EmailInputProps>>;
+    Password: FC<WithFormProps<"password", PasswordInputProps>>;
+    Textarea: FC<WithFormProps<"textarea", TextareaInputProps>>;
+    Number: FC<WithFormProps<"number", NumberInputProps>>;
+    Checkbox: FC<WithFormProps<"checkbox", CheckboxInputProps>>;
+    DateTime: FC<WithFormProps<"datetime-local", DateTimeInputProps>>;
+    Select: FC<WithFormProps<"select", SelectInputProps>>;
+    File: FC<WithFormProps<"file", FileInputProps>>;
 };

package/src/components/Hint/index.d.ts

@@ -1,3 +1,4 @@
+import type { FC, PropsWithChildren, Ref } from 'react';
 import type { BadgeProps, BadgeVariant } from '../Badge';
 import type { Color, Size } from '../types';
 export type HintPlacement = 'top-left' | 'top-right' | 'bottom-right' | 'bottom-left';
@@ -7,17 +8,14 @@ export type HintDotProps = {
     placement?: HintPlacement;
     color?: Color;
     ping?: boolean;
+    ref?: Ref<HTMLDivElement>;
 };
 export type HintBadgeProps = BadgeProps & {
     placement?: HintPlacement;
 };
-export declare const Hint: import("react").ForwardRefExoticComponent<{
-    children?: import("react").ReactNode | undefined;
-} & import("react").RefAttributes<HTMLDivElement>> & {
-    Dot: import("react").ForwardRefExoticComponent<HintDotProps & import("react").RefAttributes<HTMLDivElement>>;
-    Badge: import("react").ForwardRefExoticComponent<Omit<import("..").ButtonProps, "variant"> & {
-        variant?: BadgeVariant;
-    } & {
-        placement?: HintPlacement;
-    } & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const Hint: FC<PropsWithChildren<{
+    ref?: Ref<HTMLDivElement>;
+}>> & {
+    Dot: FC<HintDotProps>;
+    Badge: FC<HintBadgeProps>;
 };

package/src/components/List/index.d.ts

@@ -1,21 +1,23 @@
 import type { LucideIcon } from 'lucide-react';
+import type { FC, Ref } from 'react';
 import type { Size } from '../types';
-export declare const List: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
-    Item: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const List: FC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>> & {
+    Item: FC<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
         size?: Size;
         inset?: boolean;
-    } & import("react").RefAttributes<HTMLDivElement>>;
-    Label: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    }>;
+    Label: FC<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
         size?: Size;
         inset?: boolean;
-    } & import("react").RefAttributes<HTMLDivElement>>;
-    Indicator: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    }>;
+    Indicator: FC<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
         icon: LucideIcon;
         iconClassName: string;
-    } & import("react").RefAttributes<HTMLDivElement>>;
-    Icon: import("react").ForwardRefExoticComponent<{
+    }>;
+    Icon: FC<{
         className?: string;
         icon: LucideIcon;
-    } & import("react").RefAttributes<SVGSVGElement>>;
-    Separator: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+        ref?: Ref<SVGSVGElement>;
+    }>;
+    Separator: FC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
 };

package/src/components/Popover/index.d.ts

@@ -1,7 +1,8 @@
 import * as PopoverPrimitive from '@radix-ui/react-popover';
-export declare const Popover: import("react").FC<PopoverPrimitive.PopoverProps> & {
+import type { FC } from 'react';
+export declare const Popover: FC<PopoverPrimitive.PopoverProps> & {
     Trigger: import("react").ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
-    Content: import("react").ForwardRefExoticComponent<Omit<PopoverPrimitive.PopoverContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    Content: FC<PopoverPrimitive.PopoverContentProps & import("react").RefAttributes<HTMLDivElement> & {
         container?: HTMLElement | null;
-    } & import("react").RefAttributes<HTMLDivElement>>;
+    }>;
 };

package/src/components/Separator/index.d.ts

@@ -1,2 +1,3 @@
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
-export declare const Separator: import("react").ForwardRefExoticComponent<Omit<SeparatorPrimitive.SeparatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+import type { ComponentProps, FC } from 'react';
+export declare const Separator: FC<ComponentProps<typeof SeparatorPrimitive.Root>>;

package/src/components/Sheet/index.d.ts

@@ -1,17 +1,17 @@
 import * as SheetPrimitive from '@radix-ui/react-dialog';
 import { type VariantProps } from 'class-variance-authority';
-import type { ComponentPropsWithoutRef, FC, HTMLAttributes } from 'react';
+import type { ComponentProps, FC, HTMLAttributes } from 'react';
 declare const sheetVariants: (props?: ({
     side?: "top" | "bottom" | "left" | "right" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
-interface SheetContentProps extends ComponentPropsWithoutRef<typeof SheetPrimitive.Content>, VariantProps<typeof sheetVariants> {
+interface SheetContentProps extends ComponentProps<typeof SheetPrimitive.Content>, VariantProps<typeof sheetVariants> {
 }
 export declare const Sheet: FC<SheetPrimitive.DialogProps> & {
     Portal: FC<SheetPrimitive.DialogPortalProps>;
-    Overlay: import("react").ForwardRefExoticComponent<Omit<SheetPrimitive.DialogOverlayProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Overlay: FC<SheetPrimitive.DialogOverlayProps & import("react").RefAttributes<HTMLDivElement>>;
     Trigger: import("react").ForwardRefExoticComponent<SheetPrimitive.DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
     Close: import("react").ForwardRefExoticComponent<SheetPrimitive.DialogCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
-    Content: import("react").ForwardRefExoticComponent<SheetContentProps & import("react").RefAttributes<HTMLDivElement>>;
+    Content: FC<SheetContentProps>;
     Header: {
         ({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
         displayName: string;
@@ -20,7 +20,7 @@ export declare const Sheet: FC<SheetPrimitive.DialogProps> & {
         ({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
-    Title: import("react").ForwardRefExoticComponent<Omit<SheetPrimitive.DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>, "ref"> & import("react").RefAttributes<HTMLHeadingElement>>;
-    Description: import("react").ForwardRefExoticComponent<Omit<SheetPrimitive.DialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
+    Title: FC<SheetPrimitive.DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>>;
+    Description: FC<SheetPrimitive.DialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>>;
 };
 export {};