@novin-dev/formalite/dist/index.d.ts

Generate MUI form with few line of code

/// <reference types="react" />
import { FormikProps, FormikValues, FormikContextType } from 'formik';
import { TextFieldProps, MenuItemProps, SelectProps, RadioProps, FormLabelProps, RadioGroupProps, CheckboxProps, FormGroupProps, Checkbox, Switch, AutocompleteProps, GridProps } from '@mui/material';
import * as React from 'react';
import React__default, { ReactNode, RefObject } from 'react';
import { NumberFormatPropsBase } from 'react-number-format';
import { DropzoneOptions } from 'react-dropzone';
import { ObjectSchema } from 'yup';
import { ReactQuillProps } from 'react-quill';
import { DatePickerProps, TimePickerProps, DateTimePickerProps } from '@mui/x-date-pickers';

interface TextViewType extends BaseViewType {
    type: ViewTypes.TextView;
    /**
     * Specify regex for checking input text
     */
    mustRegex?: RegExp;
    /**
     * Specify props that passed to input
     * @see [Mui TextFieldProps](https://mui.com/material-ui/api/text-field/)
     */
    inputProps: Omit<TextFieldProps, "onChange"> & {
        onChange?: (value: string, event?: React__default.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
    };
}

declare type Direction = "rtl" | "ltr";
declare type Language = "en" | "fa" | string;
declare type Theme = "dark" | "light";
declare type WithChildren<T> = T & {
    children: ReactNode;
};
declare enum FetchingDataEnum {
    AUTOMATIC = "AUTOMATIC",
    MANUAL = "MANUAL"
}

interface PriceViewType extends BaseViewType {
    type: ViewTypes.PriceView;
    /**
     * Specify regex for checking input text
     */
    mustRegex?: RegExp;
    /**
     * Specify props that passed to input
     * @see [Mui TextFieldProps](https://mui.com/material-ui/api/text-field/)
     */
    inputProps: Omit<TextFieldProps, "onChange"> & {
        onChange?: (value: number) => void;
    };
    /**
     * Specify props that passed to numberFormant
     * @see [React Number Format](https://github.com/s-yadav/react-number-format)
     */
    numberFormatProps?: NumberFormatPropsBase<any>;
}

interface CardNumberViewType extends BaseViewType {
    type: ViewTypes.CardNumberView;
    /**
     * Specify regex for checking input text
     * @example /^([1-9]\d*(\.)\d{1,4}|0?(\.)\d*[1-9]\d*|0?|[1-9]\d*|[1-9]\d*(\.))$/
     */
    mustRegex?: RegExp;
    /**
     * Specify props that passed to mui TextField component
     * @see [MUI TextFieldProps](https://mui.com/material-ui/api/text-field/)
     */
    inputProps: Omit<TextFieldProps, "onChange"> & {
        onChange?: (value: string) => void;
    };
    /**
     * Specify a mask for checking input text format
     * @example 000 000
     */
    mask: string;
}

declare type AdditionalDataType$4 = {
    [key: string]: any;
};
interface SelectViewOptionsType {
    [key: string]: {
        label: string | JSX.Element;
        props?: MenuItemProps;
        additionalData?: AdditionalDataType$4;
    };
}
declare type SelectInputPropsType = Omit<SelectProps, "onChange"> & {
    onChange?: (value: string | null, additionalData?: AdditionalDataType$4) => void;
    helperText?: string;
};
interface SelectViewType extends BaseViewType {
    type: ViewTypes.SelectView;
    /**
     * Specify regex for checking input text
     */
    mustRegex?: RegExp;
    /**
     * Props contain:
     * All the props that can passed to MUI Select component
     * @see [Mui SelectProps](https://mui.com/material-ui/api/select/#props)
     *
     * @props helperText
     */
    inputProps: SelectInputPropsType;
    /**
     * Choosing type of data fetching for this component
     */
    dataFetching: FetchingDataType<SelectViewOptionsType>;
    /**
     * Override "no Item" Label; if set to null will be disabled
     */
    emptyItemLabel?: string | null;
}

interface ComponentViewType extends BaseViewType {
    type: ViewTypes.ComponentView;
    /**
     * A callback function that return a React component or jsx element
     */
    render: (
    /**
     * name of input in form to validate and error
     */
    name: string, 
    /**
     * value of input
     */
    value: any, 
    /**
     * onChange function, set value to Frmalite
     */
    onChange: (value: any) => void, 
    /**
     * string of error
     */
    error: string, 
    /**
     * shows is component touched
     */
    isTouched: boolean) => JSX.Element;
}

interface RepeaterViewType extends BaseViewType {
    type: ViewTypes.RepeaterView;
    /**
     * An object of children that repeater accepts
     * @extends MainType
     */
    options: MainType;
    /**
     * Text of the add new repeater button
     */
    buttonText?: string;
    /**
     * remove the add new repeater button
     */
    removeAddBtn?: boolean;
    /**
     * remove the add new repeater button
     */
    disableOfRemoveFunction?: (item: Object) => boolean;
}

interface CustomFile extends File {
    original: "selected";
    path?: string;
    preview: string;
    status: string;
    progress?: number;
    uid?: string;
    errorText?: string;
    controller: AbortController;
}
interface OutsideFile {
    original: "default";
    status?: string;
    uid?: string;
    preview: string;
    base64?: string | ArrayBuffer | null;
    originalName: string;
    size?: number;
    errorText?: string;
    controller: AbortController;
}
declare type ImageDownloaderPromise = {
    base64: string | ArrayBuffer | null;
    originalName: string;
    size: number;
};

interface MultiDropZoneViewType extends BaseViewType {
    type: ViewTypes.MultiDropZoneView;
    /**
     * Props that contain
     *
     * @prop onChange > Callback will call when input value change (array)
     *
     * @prop label > Label text for input
     *
     * @prop helperText > Text show below component (ReactNode)
     *
     * @prop dropZoneOptions > Specify props that passed to react-dropzone Dropzone component [react-dropzone Dropzone](https://react-dropzone.js.org/#src)
     * @see [MultiDropZoneView docs](https://formalite-docs.novin.dev/?path=/docs/components-dropzoneview--multi-drop-zone-view)
     */
    inputProps: {
        /**
         * Callback will call when input value change (array)
         */
        onChange?: (value: string) => void;
        label: ReactNode;
        /**
         * Specify props that passed to react-dropzone Dropzone component
         * @see [react-dropzone Dropzone](https://react-dropzone.js.org/#src)
         */
        dropZoneOptions?: Partial<DropzoneOptions>;
        /**
         * Text show below component (ReactNode)
         */
        helperText?: ReactNode;
    };
    /**
     * A callback function that runs when Upload occurred in MultiDropZoneView
     *
     * As an args of callback ,gives you :
     * @param file > The chosen file
     * @param progress > A callback that gives progress number in arg
     * @param uploadController > uploadController to connect to axios for auto abort
     */
    onUpload: (file: File, progress: (progress: number) => void, uploadController: AbortController) => Promise<string | undefined>;
    /**
     * A callback function that runs when Delete occurred in MultiDropZoneView
     *
     * As an args of callback ,gives you :
     * @param id > id of selected item to be deleted
     * @param isFromDefault > Tells you that this is a new item or it's from the default value
     * @param isSuccess > Tells you delete was Success
     */
    onDelete: (id: string | undefined, isFromDefault: boolean, isSuccess: boolean) => Promise<void>;
    /**
     * A callback function that must run when an image want to be downloaded in MultiDropZoneView
     *
     * As an args of callback ,gives you :
     * @param pathUrl > The url of downloaded image
     * @param controller > A controller object that allows you to abort one or more DOM requests as and when desired.
     */
    imageDownloader?: (pathUrl: string, controller: AbortController) => Promise<ImageDownloaderPromise>;
    /**
     * Choose that MultiDropZoneView shows preview
     */
    showPreview?: boolean;
    /**
     * Choose size of MultiDropZoneView
     */
    isSmallView?: boolean;
}
declare type MultiDropZoneViewProps<T> = {
    allData: MultiDropZoneViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
};

interface TextDropZoneViewType extends BaseViewType {
    type: ViewTypes.TextDropZoneView;
    mustRegex?: RegExp;
    /**
     * Props that contain
     *
     * All props that can passed to MUI TextField component [MUI TextFieldProps](https://mui.com/material-ui/api/text-field/)
     *
     * @prop onChange > Callback will call when input value change (array)
     *
     * @prop dropZoneOptions > Specify props that passed to react-dropzone Dropzone component [react-dropzone Dropzone](https://react-dropzone.js.org/#src)
     * @see [TextDropZoneView docs](https://formalite-docs.novin.dev/?path=/docs/components-dropzoneview--text-drop-zone-view)
     */
    inputProps: Omit<TextFieldProps, "onChange"> & {
        /**
         * Callback will call when input value change (array)
         */
        onChange?: (value: string) => void;
        /**
         * Specify props that passed to react-dropzone Dropzone component
         * @see [react-dropzone Dropzone](https://react-dropzone.js.org/#src)
         */
        dropZoneOptions?: Partial<DropzoneOptions>;
    };
    /**
     * A callback function that runs when Upload occurred in MultiDropZoneView
     *
     * As an args of callback ,gives you :
     * @param file > The chosen file
     * @param progress > A callback that gives progress number in arg
     * @param uploadController > uploadController to connect to axios for auto abort
     */
    onUpload: (file: File, progress: (progress: number) => void, uploadController: AbortController) => Promise<string | undefined>;
    /**
     * A callback function that runs when Delete occurred in MultiDropZoneView
     *
     * As an args of callback ,gives you :
     * @param id > id of selected item to be deleted
     * @param isFromDefault > Tells you that this is a new item or it's from the default value
     * @param isSuccess > Tells you delete was Success
     */
    onDelete: (id: string | undefined, isFromDefault: boolean, isSuccess: boolean) => Promise<void>;
    /**
     * A callback function that must run when an image want to be downloded in MultiDropZoneView
     *
     * As an args of callback ,gives you :
     * @param pathUrl > The url of downloaded image
     * @param controller > A controller object that allows you to abort one or more DOM requests as and when desired.
     */
    imageDownloader?: (pathUrl: string, controller: AbortController) => Promise<ImageDownloaderPromise>;
    /**
     * Choose that MultiDropZoneView shows preview
     */
    showPreview?: boolean;
}
declare type TextDropZoneViewProps<T> = {
    allData: TextDropZoneViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
    formMustRegex?: RegExp;
};

interface ColorPickerViewType extends BaseViewType {
    type: ViewTypes.ColorPickerView;
    /**
     * Specify props that passed to MUI TextField component
     * @see [MUI TextFieldProps](https://mui.com/material-ui/api/text-field/)
     */
    inputProps: Omit<TextFieldProps, "onChange">;
}

declare type AdditionalDataType$3 = {
    [key: string]: any;
};
declare type RadioGroupInputPropsType = Omit<RadioGroupProps, "onChange"> & {
    onChange?: (value: string | null, additionalData?: AdditionalDataType$3) => void;
    helperText?: string;
    label?: ReactNode;
};
declare type RadioGroupViewOptionType = {
    label: string | JSX.Element;
    props?: RadioProps;
    additionalData?: AdditionalDataType$3;
};
interface RadioGroupViewOptionsType {
    [key: string]: RadioGroupViewOptionType;
}
interface RadioGroupViewType extends BaseViewType {
    type: ViewTypes.RadioGroupView;
    /**
     * Specify props that passed to MUI FormLabel component
     * @see [MUI FormLabelProps](https://mui.com/material-ui/api/form-label/#props)
     */
    labelProps: FormLabelProps<"legend">;
    /**
     * Specify props that passed to MUI TextField component
     * @see [MUI TextFieldProps](https://mui.com/material-ui/api/text-field/)
     */
    inputProps: RadioGroupInputPropsType;
    /**
     * Choosing type of data fetching for this component
     */
    dataFetching: FetchingDataType<RadioGroupViewOptionsType>;
}
declare type FormatOptionFnType<T = RadioGroupViewOptionType> = (option: T) => T;

declare type AdditionalDataType$2 = {
    [key: string]: any;
};
declare type CheckGroupInputPropsType = Omit<FormGroupProps, "onChange"> & {
    onChange?: (value: string[] | null, additionalData?: AdditionalDataType$2) => void;
    helperText?: string;
    label?: ReactNode;
};
interface CheckGroupViewOptionsType {
    [key: string]: {
        label: string | JSX.Element;
        props?: CheckboxProps;
        additionalData?: AdditionalDataType$2;
    };
}
interface CheckGroupViewType extends BaseViewType {
    type: ViewTypes.CheckGroupView;
    /**
     * Specify props that passed to MUI FormLabel component
     * @see [MUI FormLabelProps](https://mui.com/material-ui/api/form-label/#props)
     */
    labelProps: FormLabelProps<"legend">;
    /**
     * Specify props that passed to MUI TextField component
     * @see [MUI TextFieldProps](https://mui.com/material-ui/api/text-field/)
     */
    inputProps: CheckGroupInputPropsType;
    /**
     * Choosing type of data fetching for this component
     */
    dataFetching: FetchingDataType<CheckGroupViewOptionsType>;
}

interface GroupViewType extends BaseViewType {
    type: ViewTypes.GroupView;
    /**
     * An object of children that repeater accepts
     * @extends MainType
     */
    options: MainType;
}

interface AvatarDropZoneViewType extends BaseViewType {
    type: ViewTypes.AvatarDropZoneView;
    /**
     * Props that contain
     *
     * @prop onChange > Callback will call when input value change (array)
     *
     * @prop label > Label text for input
     *
     * @prop helperText > Text show below component (ReactNode)
     *
     * @prop dropZoneOptions > Specify props that passed to react-dropzone Dropzone component [react-dropzone Dropzone](https://react-dropzone.js.org/#src)
     * @see [avatarView docs](https://formalite-docs.novin.dev/?path=/docs/components-dropzoneview--avatar-drop-zone-view)
     */
    inputProps: {
        /**
         * Callback will call when input value change (array)
         */
        onChange?: (value: string) => void;
        label: ReactNode;
        /**
         * Specify props that passed to react-dropzone Dropzone component
         * @see [react-dropzone Dropzone](https://react-dropzone.js.org/#src)
         */
        dropZoneOptions?: Partial<DropzoneOptions>;
        /**
         * Text show below component (ReactNode)
         */
        helperText?: ReactNode;
    };
    /**
     * A callback function that runs when Upload occurred in MultiDropZoneView
     *
     * As an args of callback ,gives you :
     * @param file > The chosen file
     * @param progress > A callback that gives progress number in arg
     * @param uploadController > uploadController to connect to axios for auto abort
     */
    onUpload: (file: CustomFile, progress: (progress: number) => void, uploadController: AbortController) => Promise<string | undefined>;
    /**
     * A callback function that runs when Delete occurred in MultiDropZoneView
     *
     * As an args of callback ,gives you :
     * @param id > id of selected item to be deleted
     * @param isFromDefault > Tells you that this is a new item or it's from the default value
     * @param isSuccess > Tells you delete was Success
     */
    onDelete: (id: string, isFromDefault: boolean, isSuccess: boolean) => Promise<void>;
    /**
     * A callback function that must run when an image want to be downloaded in MultiDropZoneView
     *
     * As an args of callback ,gives you :
     * @param pathUrl > The url of downloaded image
     * @param controller > A controller object that allows you to abort one or more DOM requests as and when desired.
     */
    imageDownloader?: (pathUrl: string, controller: AbortController) => Promise<ImageDownloaderPromise>;
}

declare type TextViewProps<T> = {
    allData: TextViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    formMustRegex?: RegExp;
    translator: Function;
    isUpdateMode: boolean;
    lang: Language;
};
declare const _default$j: <T extends FormikValues>(props: TextViewProps<T>) => JSX.Element;

declare type SelectViewProps<T> = {
    allData: SelectViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
};
declare const _default$i: <T extends FormikValues>(props: SelectViewProps<T>) => JSX.Element;

declare type AdditionalDataType$1 = {
    [key: string]: any;
};
declare type SwitchGroupInputPropsType = Omit<FormGroupProps, "onChange"> & {
    onChange?: (value: string[] | null, additionalData?: AdditionalDataType$1) => void;
    helperText?: string;
    label?: ReactNode;
};
interface SwitchGroupViewOptionsType {
    [key: string]: {
        label: string | JSX.Element;
        props?: CheckboxProps;
        additionalData?: AdditionalDataType$1;
    };
}
interface SwitchGroupViewType extends BaseViewType {
    type: ViewTypes.SwitchGroupView;
    /**
     * Specify props that passed to MUI FormLabel component
     * @see [MUI FormLabelProps](https://mui.com/material-ui/api/form-label/#props)
     */
    labelProps: FormLabelProps<"legend">;
    /**
     * Props contain:
     * All the props that can passed to MUI FormGroup component
     * @see [MUI FormGroupProps](https://mui.com/material-ui/api/form-group/#props)
     *
     * @props helperText
     *
     * @props label
     */
    inputProps: SwitchGroupInputPropsType;
    /**
     * Choosing type of data fetching for this component
     */
    dataFetching: FetchingDataType<SwitchGroupViewOptionsType>;
}

declare type SwitchGroupViewProps<T> = {
    allData: SwitchGroupViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
};
declare const _default$h: <T extends FormikValues>(props: SwitchGroupViewProps<T>) => JSX.Element;

declare type RepeaterViewProps<T> = {
    allData: RepeaterViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
    lang: Language;
    isUpdateMode: boolean;
    formMustRegex?: RegExp;
};
declare const RepeaterView: <T extends FormikValues>(props: RepeaterViewProps<T>) => JSX.Element;

declare type RadioGroupViewProps<T> = {
    allData: RadioGroupViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
    formatOptionFn?: FormatOptionFnType;
};
declare const _default$g: <T extends FormikValues>(props: RadioGroupViewProps<T>) => JSX.Element;

declare type PriceViewProps<T> = {
    allData: PriceViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
    formMustRegex?: RegExp;
};
declare const _default$f: <T extends FormikValues>(props: PriceViewProps<T>) => JSX.Element;

declare type GroupViewProps<T> = {
    allData: GroupViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
    lang: Language;
    isUpdateMode: boolean;
    formMustRegex?: RegExp;
};
declare const GroupView: <T extends FormikValues>(props: GroupViewProps<T>) => JSX.Element;

interface EditorViewType extends BaseViewType {
    type: ViewTypes.EditorView;
    /**
     * Props that contain
     *
     * All props that can passed to react-quill ReactQuill component
     * @see [react-quill ReactQuillProps](https://www.npmjs.com/package/react-quill#props)
     *
     * @prop label
     *
     * @prop helperText
     *
     * @prop isToolbarSimple --> Choose type of toolbar
     */
    editorProps: ReactQuillProps & {
        /**
         * Choose type of toolbar in react-quill
         */
        isToolbarSimple: boolean;
        label?: string;
        helperText?: string | JSX.Element;
    };
}

interface EditorViewProps<T> {
    allData: EditorViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
}
declare const _default$e: <T extends FormikValues>(props: EditorViewProps<T>) => JSX.Element;

declare type AvatarDropZoneViewProps<T> = {
    allData: AvatarDropZoneViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
    lang: Language;
    isUpdateMode: boolean;
    formMustRegex?: RegExp;
};
declare const _default$d: <T extends FormikValues>(props: AvatarDropZoneViewProps<T>) => JSX.Element;

interface DatePickerViewAllViewsType extends BaseViewType {
    /**
     * Specify props that passed to MUI TextField component
     * @see [MUI TextFieldProps](https://mui.com/material-ui/api/text-field/)
     */
    inputProps: TextFieldProps;
}

declare type OnChangeDateType$2 = Date | null;
declare type DatePickerType = {
    type: ViewTypes.DatePickerView;
    /**
     * Specify props that passed to MUI DatePicker component
     * @see [MUI DatePickerProps](https://mui.com/x/api/date-pickers/date-picker/#props)
     */
    datePickerProps?: Omit<DatePickerProps, "onChange" | "renderInput" | "value" | "reduceAnimations">;
    /**
     * @function A callback function that runs when a change occurred in DatePickerView
     *
     * @description As an arg of callback ,gives you selected date
     */
    onChange?: (date: OnChangeDateType$2) => void;
};
declare type DatePickerViewType = DatePickerViewAllViewsType & DatePickerType;

interface DatePickerViewProps<T> {
    allData: DatePickerViewType;
    name: keyof T;
    lang: Language;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
}
declare const _default$c: <T extends FormikValues>(props: DatePickerViewProps<T>) => JSX.Element;

declare type OnChangeDateType$1 = Date | null;
declare type TimePickerType = {
    type: ViewTypes.TimePickerView;
    /**
     * Specify props that passed to MUI TimePicker component
     * @see [MUI TimePickerProps](https://mui.com/x/api/date-pickers/time-picker/#props)
     */
    timePickerProps?: Omit<TimePickerProps, "onChange" | "renderInput" | "value" | "reduceAnimations">;
    /**
     * @function A callback function that runs when a change occurred in DatePickerView
     *
     * @description As an arg of callback ,gives you selected date
     */
    onChange?: (date: OnChangeDateType$1) => void;
};
declare type TimePickerViewType = DatePickerViewAllViewsType & TimePickerType;

interface TimePickerViewProps<T> {
    allData: TimePickerViewType;
    name: keyof T;
    lang: Language;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
}
declare const _default$b: <T extends FormikValues>(props: TimePickerViewProps<T>) => JSX.Element;

declare type OnChangeDateType = Date | null;
declare type DateTimePickerType = {
    type: ViewTypes.DateTimePickerView;
    /**
     * Specify props that passed to MUI DateTimePicker component
     * @see [MUI DateTimePickerProps](https://mui.com/x/api/date-pickers/date-time-picker/#props)
     */
    datePickerProps?: Omit<DateTimePickerProps, "onChange" | "renderInput" | "value" | "reduceAnimations">;
    /**
     * @function A callback function that runs when a change occurred in DatePickerView
     *
     * @description As an arg of callback ,gives you selected date
     */
    onChange?: (date: OnChangeDateType) => void;
};
declare type DateTimePickerViewType = DatePickerViewAllViewsType & DateTimePickerType;

interface DateTimePickerViewProps<T> {
    allData: DateTimePickerViewType;
    name: keyof T;
    lang: Language;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
}
declare const _default$a: <T extends FormikValues>(props: DateTimePickerViewProps<T>) => JSX.Element;

declare type ComponentViewProps<T> = {
    allData: ComponentViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
};
declare const _default$9: <T extends FormikValues>(props: ComponentViewProps<T>) => JSX.Element;

interface ColorPickerViewProps<T> {
    allData: ColorPickerViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
}
declare const _default$8: <T extends FormikValues>(props: ColorPickerViewProps<T>) => JSX.Element;

declare const checkComponentMap: {
    checkbox: typeof Checkbox;
    switch: typeof Switch;
};
declare type CheckComponentType = keyof typeof checkComponentMap;

declare type CheckGroupViewProps<T> = {
    allData: CheckGroupViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
    component?: CheckComponentType;
};
declare const _default$7: <T extends FormikValues>({ allData, name, formik, loading, validationSchema, translator, component, }: CheckGroupViewProps<T>) => JSX.Element;

declare type CartNumberViewProps<T> = {
    allData: CardNumberViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
    formMustRegex?: RegExp;
};
declare const _default$6: <T extends FormikValues>(props: CartNumberViewProps<T>) => JSX.Element;

declare type AdditionalDataType = {
    [key: string]: any;
};
declare type BigRadioGroupInputPropsType = Omit<RadioGroupProps, "onChange" | "row"> & {
    onChange?: (value: string | null, additionalData?: AdditionalDataType) => void;
    helperText?: string;
};
declare type BigRadioGroupViewOptionType = {
    label: string | JSX.Element;
    description?: string | JSX.Element;
    props?: RadioProps;
    additionalData?: AdditionalDataType;
};
interface BigRadioGroupViewOptionsType {
    [key: string]: BigRadioGroupViewOptionType;
}
interface BigRadioGroupViewType extends BaseViewType {
    type: ViewTypes.BigRadioGroupView;
    /**
     * Specify props that passed to MUI FormLabel component
     * @see [MUI FormLabelProps](https://mui.com/material-ui/api/form-label/#props)
     */
    labelProps?: FormLabelProps<"legend">;
    /**
     * Specify props that passed to MUI TextField component
     * @see [MUI TextFieldProps](https://mui.com/material-ui/api/text-field/)
     */
    inputProps: BigRadioGroupInputPropsType;
    /**
     * Choosing type of data fetching for this component
     */
    dataFetching: FetchingDataType<BigRadioGroupViewOptionsType>;
}

declare type BigRadioGroupViewProps<T> = {
    allData: BigRadioGroupViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
};
declare const _default$5: <T extends FormikValues>(props: BigRadioGroupViewProps<T>) => JSX.Element;

interface AutoCompleteViewOptionsDataType {
    [key: string]: {
        label: string | JSX.Element;
        [key: string]: any;
    };
}
declare type SingleAutoCompleteViewOptionType = {
    key: string;
    label: string | JSX.Element;
};
declare type AutoCompleteViewOptionsType = SingleAutoCompleteViewOptionType[];
interface AutoCompleteViewType extends BaseViewType {
    type: ViewTypes.AutoCompleteView;
    /**
     * Specify props that passed to MUI Autocomplete component
     * @see [MUI AutocompleteProps](https://mui.com/material-ui/api/autocomplete/)
     */
    autoCompleteProps: Omit<AutocompleteProps<SingleAutoCompleteViewOptionType, true | false, true | false, true | false>, "options" | "onChange" | "isOptionEqualToValue" | "renderInput"> & {
        onChange?: (value: string | JSX.Element | (string | JSX.Element)[] | undefined) => void;
    };
    /**
     * Specify props that passed to MUI TextField component
     * @see [MUI TextFieldProps](https://mui.com/material-ui/api/text-field/)
     */
    inputProps: Omit<TextFieldProps, "onChange">;
    /**
     * Choosing type of data fetching for this component
     */
    dataFetching: FetchingDataType<AutoCompleteViewOptionsDataType>;
}

interface AutoCompleteViewProps<T> {
    allData: AutoCompleteViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
}
declare const _default$4: <T extends FormikValues>(props: AutoCompleteViewProps<T>) => JSX.Element;

declare const en: {
    textview_toggle_password_visibility: string;
    repeater_remove_btn: string;
    repeater_add_btn: string;
    dropzone_drop_or_select_file: string;
    dropzone_drop_files_here_or_click: string;
    dropzone_browse: string;
    dropzone_select_thorough_your_machine: string;
    dropzone_avatar_update_photo: string;
    dropzone_avatar_upload_photo: string;
    general_something_went_wrong: string;
    fg_select_no_option: string;
    error_boundary_title: string;
    error_boundary_body: string;
    error_boundary_btn: string;
};

interface SingleDropZoneViewType extends BaseViewType {
    type: ViewTypes.SingleDropZoneView;
    /**
     * Props that contain
     *
     * @prop onChange > Callback will call when input value change (array)
     *
     * @prop label > Label text for input
     *
     * @prop helperText > Text show below component (ReactNode)
     *
     * @prop dropZoneOptions > Specify props that passed to react-dropzone Dropzone component [react-dropzone Dropzone](https://react-dropzone.js.org/#src)
     * @see [SingleDropZoneView docs](https://formalite-docs.novin.dev/?path=/docs/components-dropzoneview--single-drop-zone-view)
     */
    inputProps: {
        /**
         * Callback will call when input value change (array)
         */
        onChange?: (value: string) => void;
        label: ReactNode;
        /**
         * Specify props that passed to react-dropzone Dropzone component
         * @see [react-dropzone Dropzone](https://react-dropzone.js.org/#src)
         */
        dropZoneOptions?: Partial<DropzoneOptions>;
        /**
         * Text show below component (ReactNode)
         */
        helperText?: ReactNode;
    };
    /**
     * A callback function that runs when Upload occurred in MultiDropZoneView
     *
     * As an args of callback ,gives you :
     * @param file > The chosen file
     * @param progress > A callback that gives progress number in arg
     * @param uploadController > uploadController to connect to axios for auto abort
     */
    onUpload: (file: CustomFile, progress: (progress: number) => void, uploadController: AbortController) => Promise<string | undefined>;
    /**
     * A callback function that runs when Delete occurred in MultiDropZoneView
     *
     * As an args of callback ,gives you :
     * @param id > id of selected item to be deleted
     * @param isFromDefault > Tells you that this is a new item or it's from the default value
     * @param isSuccess > Tells you delete was Success
     */
    onDelete: (id: string, isFromDefault: boolean, isSuccess: boolean) => Promise<void>;
    /**
     * A callback function that must run when an image want to be downloaded in MultiDropZoneView
     *
     * As an args of callback ,gives you :
     * @param pathUrl > The url of downloaded image
     * @param controller > A controller object that allows you to abort one or more DOM requests as and when desired.
     */
    imageDownloader?: (pathUrl: string, controller: AbortController) => Promise<ImageDownloaderPromise>;
}
declare type SingleDropZoneViewProps<T> = {
    allData: SingleDropZoneViewType;
    name: keyof T;
    formik: FormikProps<T>;
    loading: boolean;
    validationSchema: ObjectSchema<any>;
    translator: Function;
};

declare enum ViewTypes {
    TextView = "TextView",
    PriceView = "PriceView",
    CardNumberView = "CardNumberView",
    SelectView = "SelectView",
    ComponentView = "ComponentView",
    RepeaterView = "RepeaterView",
    SingleDropZoneView = "SingleDropZoneView",
    AvatarDropZoneView = "AvatarDropZoneView",
    MultiDropZoneView = "MultiDropZoneView",
    TextDropZoneView = "TextDropZoneView",
    ColorPickerView = "ColorPickerView",
    RadioGroupView = "RadioGroupView",
    AutoCompleteView = "AutoCompleteView",
    DatePickerView = "DatePickerView",
    DateTimePickerView = "DateTimePickerView",
    TimePickerView = "TimePickerView",
    CheckGroupView = "CheckGroupView",
    SwitchGroupView = "SwitchGroupView",
    BigRadioGroupView = "BigRadioGroupView",
    EditorView = "EditorView",
    GroupView = "GroupView"
}
declare type MainType = {
    [key: string]: TextViewType | PriceViewType | CardNumberViewType | SelectViewType | ComponentViewType | RepeaterViewType | SingleDropZoneViewType | AvatarDropZoneViewType | MultiDropZoneViewType | TextDropZoneViewType | ColorPickerViewType | RadioGroupViewType | AutoCompleteViewType | DatePickerViewType | DateTimePickerViewType | TimePickerViewType | CheckGroupViewType | SwitchGroupViewType | BigRadioGroupViewType | EditorViewType | GroupViewType;
};
declare type AutomaticFetchingType<T> = {
    type: FetchingDataEnum.AUTOMATIC;
    options: () => Promise<T>;
    refetchDependency?: string[];
};
declare type ManualFetchingType<T> = {
    type: FetchingDataEnum.MANUAL;
    data: T | null | undefined;
    loading: boolean;
    error: boolean;
    onRetry: () => void;
};
declare type FetchingDataType<T> = AutomaticFetchingType<T> | ManualFetchingType<T>;
declare type ReferenceType<T> = {
    callSubmit: (resolve?: (value: unknown) => void, reject?: (reason?: any) => void | undefined) => void;
    callRest: () => void;
    formik: FormikProps<T>;
    addRow: (name: string) => void;
};
declare type OnFormChangeType<T> = (formik: FormikContextType<T>) => void;
declare type FormalitePropsType<T extends FormikValues> = {
    offsetScroll?: number;
    scrollReferenceId?: string;
    formString: MainType;
    onSubmit: (values: T, GResolve: (value: unknown) => void, GReject: (reason?: any) => void, resetForm: () => void) => void;
    reIni?: boolean;
    lang?: Language;
    loading?: boolean;
    isUpdateMode?: boolean;
    validationSchema: ObjectSchema<any>;
    initialValues: T;
    formRef: RefObject<ReferenceType<T>>;
    formMustRegex?: RegExp;
    translator?: Function;
    onFormChange?: OnFormChangeType<T>;
    localization?: {
        [key: string]: Record<keyof typeof en, string>;
    };
    components?: {
        [ViewTypes.TextView]?: <Z>(props: TextViewProps<T>) => JSX.Element;
        [ViewTypes.SelectView]?: (props: SelectViewProps<T>) => JSX.Element;
        [ViewTypes.SwitchGroupView]?: (props: SwitchGroupViewProps<T>) => JSX.Element;
        [ViewTypes.RepeaterView]?: (props: RepeaterViewProps<T>) => JSX.Element;
        [ViewTypes.RadioGroupView]?: (props: RadioGroupViewProps<T>) => JSX.Element;
        [ViewTypes.PriceView]?: (props: PriceViewProps<T>) => JSX.Element;
        [ViewTypes.GroupView]?: (props: GroupViewProps<T>) => JSX.Element;
        [ViewTypes.EditorView]?: (props: EditorViewProps<T>) => JSX.Element;
        [ViewTypes.SingleDropZoneView]?: (props: SingleDropZoneViewProps<T>) => JSX.Element;
        [ViewTypes.MultiDropZoneView]?: (props: MultiDropZoneViewProps<T>) => JSX.Element;
        [ViewTypes.AvatarDropZoneView]?: (props: AvatarDropZoneViewProps<T>) => JSX.Element;
        [ViewTypes.TextDropZoneView]?: (props: TextDropZoneViewProps<T>) => JSX.Element;
        [ViewTypes.DatePickerView]?: (props: DatePickerViewProps<T>) => JSX.Element;
        [ViewTypes.TimePickerView]?: (props: TimePickerViewProps<T>) => JSX.Element;
        [ViewTypes.DateTimePickerView]?: (props: DateTimePickerViewProps<T>) => JSX.Element;
        [ViewTypes.ComponentView]?: (props: ComponentViewProps<T>) => JSX.Element;
        [ViewTypes.ColorPickerView]?: (props: ColorPickerViewProps<T>) => JSX.Element;
        [ViewTypes.CheckGroupView]?: (props: CheckGroupViewProps<T>) => JSX.Element;
        [ViewTypes.CardNumberView]?: (props: CartNumberViewProps<T>) => JSX.Element;
        [ViewTypes.BigRadioGroupView]?: (props: BigRadioGroupViewProps<T>) => JSX.Element;
        [ViewTypes.AutoCompleteView]?: (props: AutoCompleteViewProps<T>) => JSX.Element;
    };
};
interface BaseViewType {
    /**
     * Show only on update (edit) mode
     */
    showOnUpdate?: boolean;
    /**
     * Specify props that passed to grid layout
     * @see [Mui GridProps](https://mui.com/material-ui/api/grid/)
     */
    layoutProps: GridProps;
    /**
     * Changing this prop cause rerenders in related view
     */
    renderDependency?: string[];
}

declare const _default$3: <T extends FormikValues>(props: FormalitePropsType<T>) => JSX.Element;

declare const useFormaliteRef: <T>() => React.RefObject<ReferenceType<T>>;

declare const _default$2: <T extends FormikValues>(props: SingleDropZoneViewProps<T>) => JSX.Element;

declare const _default$1: <T extends FormikValues>(props: MultiDropZoneViewProps<T>) => JSX.Element;

declare const _default: <T extends FormikValues>(props: TextDropZoneViewProps<T>) => JSX.Element;

export { AutoCompleteViewOptionsType, BigRadioGroupViewOptionsType, CheckGroupViewOptionsType, CustomFile, Direction, FetchingDataEnum, _default$3 as Formalite, _default$4 as FormaliteAutoCompleteView, _default$d as FormaliteAvatarDropZoneView, _default$5 as FormaliteBigRadioGroupView, _default$6 as FormaliteCardNumberView, _default$7 as FormaliteCheckGroupView, _default$8 as FormaliteColorPickerView, _default$9 as FormaliteComponentView, _default$c as FormaliteDatePickerView, _default$a as FormaliteDateTimePickerView, _default$e as FormaliteEditorView, GroupView as FormaliteGroupView, _default$1 as FormaliteMultiDropZoneView, _default$f as FormalitePriceView, FormalitePropsType, _default$g as FormaliteRadioGroupView, RepeaterView as FormaliteRepeaterView, _default$i as FormaliteSelectView, _default$2 as FormaliteSingleDropZoneView, _default$h as FormaliteSwitchGroupView, _default as FormaliteTextDropZoneView, _default$j as FormaliteTextView, _default$b as FormaliteTimePickerView, ImageDownloaderPromise, Language, MainType, OutsideFile, RadioGroupViewOptionsType, ReferenceType, SelectViewOptionsType, SwitchGroupViewOptionsType, Theme, ViewTypes, WithChildren, useFormaliteRef };