@startdownnotez404/ui 1.0.0 → 1.3.5

package/dist/useForm.d.mts

@@ -0,0 +1,588 @@
+import { UseFormReturn, FieldValues } from 'react-hook-form';
+import * as React$1 from 'react';
+import React__default from 'react';
+import * as _mui_material_TextField from '@mui/material/TextField';
+import { TextFieldProps } from '@mui/material/TextField';
+import { SelectProps } from '@mui/material/Select';
+import FormControl, { FormControlProps } from '@mui/material/FormControl';
+import _mui_material_MenuItem from '@mui/material/MenuItem';
+import { SliderProps } from '@mui/material/Slider';
+import { DatePicker } from '@mui/x-date-pickers/DatePicker';
+import { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { FormLabelProps } from '@mui/material/FormLabel';
+import { FormGroupProps } from '@mui/material/FormGroup';
+import MuiCheckBox from '@mui/material/Checkbox';
+import { DropzoneOptions } from 'react-dropzone';
+import { SwitchProps } from '@mui/material/Switch';
+import { CountryCode } from 'libphonenumber-js';
+import { ModalProps } from '@mui/material/Modal';
+import { SxProps } from '@mui/material';
+import { Theme } from '@mui/material/styles';
+import CloseIcon from '@mui/icons-material/Close';
+import MuiIconButton from '@mui/material/IconButton';
+import { TooltipProps } from '@mui/material/Tooltip';
+
+declare const FIELD_TYPEs: {
+    readonly text: "text-field";
+    readonly select: "select-field";
+    readonly slider: "slider-field";
+    readonly check: "check-field";
+    readonly date: "date-field";
+    readonly dateTime: "date-time-field";
+    readonly toggleButton: "toggle-button";
+    readonly autocomplete: "autocomplete-field";
+    readonly switch: "switch-field";
+    readonly number: "number-field";
+    readonly tel: "tel-field";
+    readonly json: "json-field";
+    readonly custom: "custom-field";
+    readonly textArray: "text-array-field";
+    readonly fileUpload: "file-upload-field";
+    readonly avatar: "avatar-field";
+};
+
+type Size = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+
+type IconButtonProps = React.ComponentProps<typeof MuiIconButton>;
+type Props = {
+    /** The Icon to render */
+    children: React.ReactNode;
+    /** The title of the tooltip */
+    title?: string;
+    /**
+     * The color theme of the entire component.
+     * @default 'secondary' (from theme)
+     */
+    color?: IconButtonProps['color'];
+    /**
+     * The size of the component.
+     * @default 'small' (from theme)
+     */
+    size?: IconButtonProps['size'];
+    selected?: boolean;
+    slotProps?: {
+        tooltip?: Omit<TooltipProps, "children">;
+    };
+} & Omit<IconButtonProps, "color" | "size">;
+/**
+ * A MuiIconButton wrapped in a MuiTooltip.
+ * Default props like `size` and `color` are handled by the theme.
+ */
+declare const IconButton: React$1.ForwardRefExoticComponent<Omit<Props, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
+
+/**
+ * A wrapper for Mui FormLabel
+ */
+declare function MuiFormLabel(props: FormLabelProps): react_jsx_runtime.JSX.Element;
+
+interface SelectOptionType {
+    label: string;
+    id: string;
+    onClick?: React__default.MouseEventHandler<HTMLLIElement>;
+    icon?: React__default.ReactNode;
+    extension?: React__default.ReactNode;
+    name?: string;
+}
+type MuiSelectProps = {
+    label?: string;
+    value: SelectProps["value"];
+    onChange: SelectProps["onChange"];
+    options: SelectOptionType[];
+    helperText?: string;
+    error?: boolean;
+    inputProps?: SelectProps["inputProps"];
+    minWidth?: string;
+    minPadding?: boolean;
+    required?: boolean;
+    disableRequiredLabel?: boolean;
+    multiple?: boolean;
+    slotProps?: {
+        option?: React__default.ComponentProps<typeof _mui_material_MenuItem>;
+        formControl?: Partial<React__default.ComponentProps<typeof FormControl>>;
+    };
+} & Omit<SelectProps, "label">;
+
+declare const MuiXDatePicker: React__default.FC<React__default.ComponentProps<typeof DatePicker>>;
+
+declare const MuiXDateTimePicker: React__default.FC<React__default.ComponentProps<typeof DateTimePicker>>;
+
+interface CheckOptionType {
+    id: string;
+    label: string;
+}
+type CheckedStateValue = CheckOptionType['id'][];
+declare function CheckboxGroup({ error, required, options, setCheckedIds, title, titleSuffix, inputProps, checkedIds, helperText, errorText, direction, slotProps, }: {
+    error?: boolean;
+    title?: React.ComponentProps<typeof MuiFormLabel>['children'];
+    titleSuffix?: React.ComponentProps<typeof MuiFormLabel>['children'];
+    options: CheckOptionType[];
+    setCheckedIds?: React.Dispatch<React.SetStateAction<CheckedStateValue>>;
+    checkedIds: CheckedStateValue;
+    required?: boolean;
+    helperText?: string;
+    errorText?: string;
+    direction?: 'row' | 'column';
+    inputProps?: NonNullable<React.ComponentProps<typeof MuiCheckBox>['slotProps']>['input'];
+    slotProps?: {
+        fieldset?: Partial<FormControlProps>;
+        group?: Partial<Omit<FormGroupProps, "row">>;
+    };
+}): react_jsx_runtime.JSX.Element;
+
+type ValueOf<T> = T[keyof T];
+
+declare const FILE_STATUSs: {
+    readonly uploadingToLocal: "local-uploading";
+    readonly uploadedToLocal: "local-uploaded";
+    readonly localError: "local-error";
+    readonly pending: "pending";
+    readonly uploadPending: "upload-pending";
+    readonly gettingSignedURL: "upload-gettingSignedURL";
+    readonly beginUploadToS3: "upload-beginUploadToS3";
+    readonly uploadedToCloud: "upload-uploadedToCloud";
+    readonly error: "upload-error";
+    readonly downloadPending: "download-pending";
+    readonly downloading: "download-in-progress";
+    readonly downloaded: "download-completed";
+    readonly downloadError: "download-error";
+};
+type FileStatusType = ValueOf<typeof FILE_STATUSs>;
+type Attachment = {
+    url: string;
+    keyPath: string;
+    filename: string;
+    fileType: string;
+    hostname: string;
+};
+
+interface PreviewableFileProps {
+    path?: string;
+    blobUrl?: string;
+    filename?: string;
+    randomName?: string;
+    fileType?: string;
+    mimeType?: Blob["type"];
+    size?: number;
+    displaySize?: string;
+    url?: string;
+    fetchOptions?: object;
+    putUrl?: string;
+    getUrl?: string;
+    status?: FileStatusType;
+    revokeable?: boolean;
+    imageProps?: {
+        width: number;
+        height: number;
+    };
+}
+declare class PreviewableFile {
+    path: NonNullable<PreviewableFileProps["path"]>;
+    blobUrl: NonNullable<PreviewableFileProps["blobUrl"]>;
+    filename: NonNullable<PreviewableFileProps["filename"]>;
+    randomName: NonNullable<PreviewableFileProps["randomName"]>;
+    fileType: NonNullable<PreviewableFileProps["fileType"]>;
+    mimeType: NonNullable<PreviewableFileProps["mimeType"]>;
+    size: NonNullable<PreviewableFileProps["size"]>;
+    displaySize: NonNullable<PreviewableFileProps["displaySize"]>;
+    url: NonNullable<PreviewableFileProps["url"]>;
+    fetchOptions: NonNullable<PreviewableFileProps["fetchOptions"]>;
+    putUrl: NonNullable<PreviewableFileProps["putUrl"]>;
+    getUrl: NonNullable<PreviewableFileProps["getUrl"]>;
+    status: NonNullable<PreviewableFileProps["status"]>;
+    revokeable: NonNullable<PreviewableFileProps["revokeable"]>;
+    imageProps: NonNullable<PreviewableFileProps["imageProps"]>;
+    constructor(props?: PreviewableFileProps);
+    toPlainObj(): this;
+    updateFile(file: PreviewableFile | undefined): void;
+    updateStatus(status: FileStatusType): void;
+    downloadFile(): Promise<this>;
+    _displayFileSize(): string;
+    getUploadFormat(): Attachment;
+}
+
+type DropzoneType = "box" | "button";
+
+type OptionId = string;
+interface OptionParams {
+    id?: OptionId;
+    label?: string;
+    description?: string;
+    disabled?: boolean;
+    group: string;
+    icon?: React.ReactNode;
+    filterKey?: string;
+    defaultSelected?: boolean;
+    value?: string;
+    otherProps?: Record<string, unknown>;
+    tags?: {
+        tagName: string;
+        tagIcon?: React.ReactElement | undefined;
+    }[];
+}
+
+type GitHubPickerVariant = 'field' | 'icon';
+type GitHubPickerColor = 'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning' | 'system' | 'insight';
+
+type TextSlotProps = Partial<TextFieldProps> & {
+    maxLength?: number;
+};
+type NumberSlotProps = {
+    min?: number;
+    max?: number;
+    step?: number;
+    /** Optional unit shown as an adornment (e.g. "kg", "$", or an icon) */
+    unit?: React__default.ReactNode;
+    /** Whether the unit appears at the start or end of the input (default: 'end') */
+    unitPosition?: 'start' | 'end';
+    slotProps?: Partial<React__default.ComponentProps<typeof _mui_material_TextField.default>>['slotProps'];
+};
+type UseOptionsHook = () => {
+    options: SelectOptionType[];
+    loading?: boolean;
+    reload?: () => void;
+};
+type SelectOption = SelectOptionType;
+type SelectSlotProps = Partial<MuiSelectProps> & {
+    options: SelectOptionType[];
+    useOptions?: UseOptionsHook;
+};
+type SliderSlotProps = Partial<SliderProps>;
+
+type DateTimeSlotProps = Partial<React__default.ComponentProps<typeof MuiXDateTimePicker>>;
+type DateSlotProps = Partial<React__default.ComponentProps<typeof MuiXDatePicker>>;
+
+type FileUploadSlotProps = {
+    accept?: DropzoneOptions['accept'];
+    maxFiles?: number;
+    dropzoneType?: DropzoneType;
+};
+type AvatarSlotProps = {
+    /** File accept config. Supports react-dropzone's accept shape or a plain input accept string. */
+    accept?: DropzoneOptions['accept'] | string;
+    /** Avatar size preset from the elemental Avatar package */
+    size?: Size;
+    /** Override avatar dimensions (in px or css units) */
+    dim?: {
+        width?: string | number;
+        height?: string | number;
+    };
+    /** Display name used to render initials when no image is selected */
+    avatarName?: string;
+    /** Back-compat alias for avatarName */
+    name?: string;
+    /** Form key to watch for the name (e.g. "fullName") */
+    watchAvatarNameKey?: string;
+    /** Optional icon behind the avatar when no image is selected */
+    backgroundIcon?: React__default.ReactNode;
+    /** Optional hook to compute a background icon reactively */
+    useBackgroundIcon?: () => React__default.ReactNode;
+};
+type CheckOption = CheckOptionType;
+type CheckSlotProps = Partial<React__default.ComponentProps<typeof CheckboxGroup>> & {
+    options: CheckOption[];
+    useOptions?: () => {
+        options: CheckOption[];
+        loading?: boolean;
+        reload?: () => void;
+    };
+};
+type ToggleButtonOption = {
+    id: string;
+    value: string;
+    label: string;
+    icon?: React__default.ReactNode;
+    rotateIconOnSelected?: boolean;
+    disabled?: boolean;
+};
+type ToggleButtonSlotProps = {
+    options: ToggleButtonOption[];
+    color?: 'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning';
+};
+
+type AutocompleteSlotProps = {
+    options: OptionParams[];
+    multiple?: boolean;
+    /** `field` is the full selector. `icon` is a compact IconButton with a badge. */
+    variant?: GitHubPickerVariant;
+    color?: GitHubPickerColor;
+    useOptions?: () => {
+        options: OptionParams[];
+        loading?: boolean;
+        reload?: () => void;
+    };
+};
+type CustomSlotProps = {
+    /**
+     * A render function that receives `{ value, onChange, error, getValues, helperText }`.
+     * Helper text is often provided via `field.helperText`, but some custom
+     * renderers still expect it here, so we keep the property for
+     * backwards-compatibility.
+     * Use this to render completely custom UI.
+     */
+    render?: (props: {
+        value: unknown;
+        onChange: (value: unknown) => void;
+        error?: boolean;
+        getValues?: () => Record<string, unknown>;
+        helperText?: React__default.ReactNode;
+    }) => React__default.ReactNode;
+    /** Arbitrary props passed to consumer render function */
+    props?: Record<string, unknown>;
+    /** Optional helper text for the slot renderer */
+    helperText?: React__default.ReactNode;
+};
+type TextArraySlotProps = {
+    minItems?: number;
+    maxItems?: number;
+    itemProps?: TextSlotProps;
+    addButtonLabel?: string;
+    removeButtonLabel?: string;
+};
+type SwitchSlotProps = Partial<SwitchProps> & {
+    label?: React__default.ReactNode;
+};
+
+type TelSlotProps = {
+    /** default country for the phone input (e.g. 'US') */
+    defaultCountry?: CountryCode;
+    placeholder?: string;
+    /** passthrough props for the input component */
+    inputProps?: React__default.InputHTMLAttributes<HTMLInputElement>;
+    /** optional icon component for the country select */
+    iconComponent?: React__default.ElementType;
+};
+type JsonSlotProps = {
+    /** passthrough props for the JsonEditor component */
+    editorProps?: Record<string, unknown>;
+};
+
+type FormFieldType = typeof FIELD_TYPEs[keyof typeof FIELD_TYPEs];
+type Explanation = {
+    title?: string;
+    content: string;
+    href?: {
+        label: string;
+        url: string;
+    };
+    highlights?: string[];
+};
+/** @deprecated Use Explanation */
+type Explaination = Explanation;
+type BaseField = {
+    name: string;
+    label?: string;
+    explanation?: Explanation;
+    /** @deprecated Use explanation */
+    explaination?: Explanation;
+    helperText?: string;
+    required?: boolean;
+    disabled?: boolean;
+    sx?: Record<string, unknown>;
+    size?: {
+        width?: number | string;
+        height?: number | string;
+    };
+    useHide?: () => boolean;
+    errorMsg?: string;
+};
+type ValidateFunction<Value, FormValues extends Record<string, unknown>> = (value: Value | null | undefined, formValues: FormValues) => boolean | string | Promise<boolean | string>;
+type FieldWithSlots<TypeLiteral extends FormFieldType, SlotProps, T extends FormTypeMap = FormTypeMap> = BaseField & {
+    type: TypeLiteral;
+    defaultValue?: GetDataType<TypeLiteral>;
+    slotProps?: SlotProps;
+    validate?: ValidateFunction<GetDataType<TypeLiteral>, InferFormDataType<T>>;
+    onChange?: (value: GetDataType<TypeLiteral> | null, formValues: InferFormDataType<T>) => void;
+};
+type TextFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.text, TextSlotProps, T>;
+type SelectFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.select, SelectSlotProps, T>;
+type SliderFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.slider, SliderSlotProps, T>;
+type CheckFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.check, CheckSlotProps, T>;
+type DateFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.date, DateSlotProps, T>;
+type DateTimeFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.dateTime, DateTimeSlotProps, T>;
+type ToggleButtonFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.toggleButton, ToggleButtonSlotProps, T>;
+type AutocompleteFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.autocomplete, AutocompleteSlotProps, T>;
+type SwitchFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.switch, SwitchSlotProps, T>;
+type NumberFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.number, NumberSlotProps, T>;
+type TelFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.tel, TelSlotProps, T>;
+type JsonFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.json, JsonSlotProps, T>;
+type CustomFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.custom, CustomSlotProps, T>;
+type TextArrayFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.textArray, TextArraySlotProps, T>;
+type FileUploadFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.fileUpload, FileUploadSlotProps, T>;
+type AvatarFieldConfig<T extends FormTypeMap = FormTypeMap> = FieldWithSlots<typeof FIELD_TYPEs.avatar, AvatarSlotProps, T>;
+type FieldConfig<T extends FormTypeMap = FormTypeMap> = TextFieldConfig<T> | SelectFieldConfig<T> | SliderFieldConfig<T> | CheckFieldConfig<T> | DateFieldConfig<T> | DateTimeFieldConfig<T> | ToggleButtonFieldConfig<T> | AutocompleteFieldConfig<T> | SwitchFieldConfig<T> | NumberFieldConfig<T> | JsonFieldConfig<T> | TextArrayFieldConfig<T> | CustomFieldConfig<T> | FileUploadFieldConfig<T> | AvatarFieldConfig<T> | TelFieldConfig<T>;
+type RowConfig<T extends FormTypeMap = FormTypeMap> = {
+    row: number | string;
+    fields: FieldConfig<T>[];
+    sx?: Record<string, unknown>;
+};
+type StepConfig<T extends FormTypeMap = FormTypeMap> = {
+    title?: string;
+    /** optional icon shown in step indicator (React node or MUI icon) */
+    icon?: React.ReactNode;
+    schema: RowConfig<T>[];
+};
+type FormConfig<T extends FormTypeMap = FormTypeMap> = {
+    schema?: RowConfig<T>[];
+    steps?: StepConfig<T>[];
+    defaultValues?: InferFormDataType<T>;
+    mode?: 'onSubmit' | 'onBlur' | 'onChange' | 'onTouched' | 'all';
+};
+type FormTypeMap = Record<string, FormFieldType>;
+type GetDataType<T extends FormFieldType> = T extends typeof FIELD_TYPEs.text ? string : T extends typeof FIELD_TYPEs.select ? string | string[] : T extends typeof FIELD_TYPEs.slider ? number : T extends typeof FIELD_TYPEs.check ? string[] : T extends typeof FIELD_TYPEs.date ? string | Date : T extends typeof FIELD_TYPEs.dateTime ? string | Date : T extends typeof FIELD_TYPEs.toggleButton ? string : T extends typeof FIELD_TYPEs.autocomplete ? string | string[] : T extends typeof FIELD_TYPEs.switch ? boolean : T extends typeof FIELD_TYPEs.number ? number : T extends typeof FIELD_TYPEs.tel ? string : T extends typeof FIELD_TYPEs.json ? unknown : T extends typeof FIELD_TYPEs.textArray ? string[] : T extends typeof FIELD_TYPEs.custom ? unknown : T extends typeof FIELD_TYPEs.fileUpload ? PreviewableFile[] : T extends typeof FIELD_TYPEs.avatar ? PreviewableFile | null : unknown;
+type InferFormDataType<T extends FormTypeMap> = {
+    [K in keyof T]: GetDataType<T[K]>;
+};
+type StrictFieldConfig<T extends FormTypeMap, K extends keyof T = keyof T> = K extends unknown ? (T[K] extends typeof FIELD_TYPEs.text ? TextFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.select ? SelectFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.slider ? SliderFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.check ? CheckFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.date ? DateFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.dateTime ? DateTimeFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.toggleButton ? ToggleButtonFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.autocomplete ? AutocompleteFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.switch ? SwitchFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.number ? NumberFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.tel ? TelFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.json ? JsonFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.textArray ? TextArrayFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.custom ? CustomFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.fileUpload ? FileUploadFieldConfig<T> & {
+    name: K;
+} : T[K] extends typeof FIELD_TYPEs.avatar ? AvatarFieldConfig<T> & {
+    name: K;
+} : never) : never;
+type StrictRowConfig<T extends FormTypeMap> = Omit<RowConfig<T>, 'fields'> & {
+    fields: StrictFieldConfig<T>[];
+};
+type StrictFormConfig<T extends FormTypeMap> = Omit<FormConfig<T>, 'schema' | 'steps'> & ({
+    schema: StrictRowConfig<T>[];
+} | {
+    steps: StepConfig<T>[];
+});
+
+interface UseConfiguredFormProps<T extends FormTypeMap> {
+    config: StrictFormConfig<T>;
+}
+interface ConfiguredFormReturn<T extends FormTypeMap> {
+    methods: UseFormReturn<InferFormDataType<T>>;
+    config: StrictFormConfig<T>;
+    configError?: Error;
+}
+/** @deprecated Use ConfiguredFormReturn */
+type UseForm2Return<T extends FormTypeMap> = ConfiguredFormReturn<T>;
+/** @deprecated Use UseConfiguredFormProps */
+type UseForm2Props<T extends FormTypeMap> = UseConfiguredFormProps<T>;
+declare const useConfiguredForm: <T extends FormTypeMap>({ config, }: UseConfiguredFormProps<T>) => ConfiguredFormReturn<T>;
+/** @deprecated Use useConfiguredForm */
+declare const useForm2: <T extends FormTypeMap>({ config, }: UseConfiguredFormProps<T>) => ConfiguredFormReturn<T>;
+
+interface FormRendererProps<T extends FormTypeMap> {
+    /** methods may be passed directly or obtained from context */
+    methods?: unknown;
+    config: StrictFormConfig<T>;
+    onSubmit: (data: FieldValues) => void;
+    /** whether to render undo button */
+    showUndo?: boolean;
+    /** whether to render clear button */
+    showClear?: boolean;
+    children?: React__default.ReactNode;
+    extraButtons?: React__default.ReactNode;
+}
+declare const FormRenderer: <T extends FormTypeMap>(props: FormRendererProps<T>) => React__default.ReactElement;
+
+/**
+ * extended from Mui Modal
+ *
+ * [Doc](https://mui.com/material-ui/api/modal/)
+ *
+ * @param openProps - [open, setOpen]
+ */
+declare function MuiModal({ children, openProps, size, maxHeight, maxWidth, onClose, title, titleIcon, closeButton, slots, slotProps, ...rest }: {
+    children?: React__default.ReactNode;
+    openProps: [
+        boolean,
+        (React__default.Dispatch<React__default.SetStateAction<boolean>> | React__default.Dispatch<boolean>)
+    ];
+    size?: {
+        w?: string | number;
+        h?: string | number;
+    };
+    maxHeight?: string | number;
+    maxWidth?: string | number;
+    onClose?: () => void;
+    title?: string;
+    titleIcon?: React__default.ReactNode;
+    closeButton?: React__default.ReactNode;
+    slots?: {
+        closeButton?: React__default.ElementType;
+        closeIcon?: React__default.ElementType;
+    };
+    slotProps?: {
+        container?: {
+            style?: {
+                bgColor?: string;
+                shadow?: string;
+            };
+            sx?: SxProps<Theme>;
+        };
+        header?: {
+            style?: {
+                headerImg: string;
+            };
+        };
+        closeButton?: Partial<React__default.ComponentProps<typeof IconButton>> & {
+            closeIcon?: Partial<React__default.ComponentProps<typeof CloseIcon>>;
+        };
+    };
+} & Omit<ModalProps, "open" | "title">): react_jsx_runtime.JSX.Element;
+
+interface FormModalRendererProps<T extends FormTypeMap> {
+    openProps: [boolean, React__default.Dispatch<React__default.SetStateAction<boolean>>];
+    title: string;
+    methods: ConfiguredFormReturn<T>['methods'];
+    config: StrictFormConfig<T>;
+    onSubmit: (data: FieldValues) => void;
+    extraButtons?: React__default.ReactNode;
+    children?: React__default.ReactNode;
+    maxWidth?: string | number;
+    closeOnBackdropClick?: boolean;
+    showCloseButton?: boolean;
+    showUndo?: boolean;
+    showClear?: boolean;
+    slotProps?: {
+        modal?: Partial<React__default.ComponentProps<typeof MuiModal>>;
+    };
+}
+declare function FormModalRenderer<T extends FormTypeMap>(p: FormModalRendererProps<T>): react_jsx_runtime.JSX.Element;
+
+type UseFormProps<T extends FormTypeMap> = {
+    config: StrictFormConfig<T>;
+    onSubmit: (data: FieldValues) => void;
+    /** When true the undo button is shown (default: true) */
+    showUndo?: boolean;
+    /** When true the clear button is shown (default: true) */
+    showClear?: boolean;
+    /**
+     * Can be a React node or a function that receives the `methods` and returns nodes.
+     * Example: extraButtons={(methods) => <MyButtons methods={methods} />}
+     */
+    extraButtons?: React__default.ReactNode | ((methods: ConfiguredFormReturn<T>['methods']) => React__default.ReactNode);
+};
+declare function UseForm<T extends FormTypeMap>({ config, onSubmit, showUndo, showClear, extraButtons, }: UseFormProps<T>): react_jsx_runtime.JSX.Element;
+
+export { type AutocompleteFieldConfig, type AutocompleteSlotProps, type AvatarFieldConfig, type AvatarSlotProps, type CheckFieldConfig, type CheckOption, type CheckSlotProps, type ConfiguredFormReturn, type CustomFieldConfig, type CustomSlotProps, type DateFieldConfig, type DateSlotProps, type DateTimeFieldConfig, type DateTimeSlotProps, type Explaination, type Explanation, FIELD_TYPEs, type FieldConfig, type FileUploadFieldConfig, type FileUploadSlotProps, type FormConfig, type FormFieldType, FormModalRenderer, type FormModalRendererProps, FormRenderer, type FormRendererProps, type FormTypeMap, type GetDataType, type InferFormDataType, type JsonFieldConfig, type JsonSlotProps, type NumberFieldConfig, type NumberSlotProps, type RowConfig, type SelectFieldConfig, type SelectOption, type SelectSlotProps, type SliderFieldConfig, type SliderSlotProps, type StepConfig, type StrictFieldConfig, type StrictFormConfig, type StrictRowConfig, type SwitchFieldConfig, type SwitchSlotProps, type TelFieldConfig, type TelSlotProps, type TextArrayFieldConfig, type TextArraySlotProps, type TextFieldConfig, type TextSlotProps, type ToggleButtonFieldConfig, type ToggleButtonOption, type ToggleButtonSlotProps, type UseConfiguredFormProps, UseForm, type UseForm2Props, type UseForm2Return, type UseFormProps, type UseOptionsHook, useConfiguredForm, useForm2 };