@saas-ui/forms 2.1.3 → 2.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +22 -0
- package/dist/index.d.ts +41 -29
- package/dist/index.js +72 -46
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +73 -51
- package/dist/index.mjs.map +1 -1
- package/dist/yup/index.d.ts +57 -41
- package/dist/yup/index.js.map +1 -1
- package/dist/yup/index.mjs.map +1 -1
- package/dist/zod/index.d.ts +58 -46
- package/dist/zod/index.js +17 -5
- package/dist/zod/index.js.map +1 -1
- package/dist/zod/index.mjs +17 -5
- package/dist/zod/index.mjs.map +1 -1
- package/package.json +2 -2
- package/src/create-field.tsx +7 -3
- package/src/create-form.tsx +9 -3
- package/src/default-fields.tsx +12 -4
- package/src/display-field.tsx +4 -3
- package/src/fields.tsx +7 -1
- package/src/index.ts +1 -0
- package/src/layout.tsx +2 -13
- package/src/number-input/number-input.tsx +14 -1
- package/src/types.ts +1 -1
- package/src/use-step-form.tsx +20 -4
package/dist/yup/index.mjs.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../yup/src/yup-resolver.ts","../../yup/src/create-yup-form.ts","../../yup/src/create-yup-step-form.ts","../../../saas-ui-modals/src/dialog.tsx","../../../saas-ui-modals/src/drawer.tsx","../../../saas-ui-modals/src/modal.tsx","../../../saas-ui-modals/src/menu.tsx","../../../saas-ui-modals/src/form.tsx","../../../saas-ui-modals/src/provider.tsx","../../../saas-ui-modals/src/default-modals.ts","../../../saas-ui-modals/src/create-modals.tsx","../../../saas-ui-react-utils/src/get-child-of-type.ts","../../../saas-ui-react-utils/src/get-children-of-type.ts","../../../saas-ui-react-utils/src/use-responsive-value.ts","../../../saas-ui-react-utils/src/index.ts","../../yup/src/create-yup-dialog.ts","../../yup/src/index.ts"],"sourcesContent":["import { reach } from 'yup'\nimport { yupResolver } from '@hookform/resolvers/yup'\n\nimport { FieldProps, GetFieldResolver } from '@saas-ui/forms'\nimport { AnyObjectSchema } from './types'\n\nexport { yupResolver }\n\nexport type Options = {\n min?: number\n max?: number\n}\n\n// @TODO get proper typings for the schema fields\nconst getType = (field: any) => {\n if (field.spec.meta?.type) {\n return field.spec.meta.type\n }\n\n switch (field.type) {\n case 'array':\n return 'array'\n case 'object':\n return 'object'\n case 'number':\n return 'number'\n case 'date':\n return 'date'\n case 'string':\n default:\n return 'text'\n }\n}\n\nconst getArrayOption = (field: any, name: string) => {\n for (const test of field.tests) {\n if (test.OPTIONS?.params[name]) return test.OPTIONS.params[name]\n }\n}\n\n/**\n * A helper function to render forms automatically based on a Yup schema\n *\n * @param schema The Yup schema\n * @returns {FieldProps[]}\n */\nexport const getFieldsFromSchema = (schema: AnyObjectSchema): FieldProps[] => {\n const fields = []\n\n let schemaFields: Record<string, any> = {}\n if (schema.type === 'array') {\n /* @ts-ignore this is actually valid */\n schemaFields = schema.innerType.fields\n } else {\n schemaFields = schema.fields\n }\n\n for (const name in schemaFields) {\n const field = schemaFields[name]\n\n const options: Options = {}\n if (field.type === 'array') {\n options.min = getArrayOption(field, 'min')\n options.max = getArrayOption(field, 'max')\n }\n\n fields.push({\n name,\n label: field.spec.label || name,\n type: getType(field),\n ...options,\n })\n }\n return fields\n}\n\nexport const getNestedSchema = (schema: AnyObjectSchema, path: string) => {\n return reach(schema, path) as AnyObjectSchema\n}\n\nexport const yupFieldResolver: GetFieldResolver = (schema: AnyObjectSchema) => {\n return {\n getFields() {\n return getFieldsFromSchema(schema)\n },\n getNestedFields(name: string) {\n return getFieldsFromSchema(getNestedSchema(schema, name))\n },\n }\n}\n","import {\n createForm,\n CreateFormProps,\n FormProps,\n WithFields,\n FieldValues,\n} from '@saas-ui/forms'\nimport { yupFieldResolver, yupResolver } from './yup-resolver'\nimport { InferType } from 'yup'\nimport React from 'react'\nimport { AnyObjectSchema } from './types'\n\ntype ResolverArgs = Parameters<typeof yupResolver>\n\nexport interface CreateYupFormProps<FieldDefs>\n extends CreateFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\nexport type YupFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object,\n Type extends 'yup' = 'yup'\n> = (<\n TSchema extends AnyObjectSchema = AnyObjectSchema,\n TFieldValues extends InferType<TSchema> = InferType<TSchema>, // placeholder\n TContext extends object = object\n>(\n props: WithFields<\n FormProps<TFieldValues, TContext, TSchema>,\n FieldDefs,\n ExtraOverrides\n > & {\n ref?: React.ForwardedRef<HTMLFormElement>\n } & ExtraProps\n) => React.ReactElement) & {\n displayName?: string\n id?: 'YupForm'\n}\n\nexport const createYupForm = <FieldDefs>(\n options?: CreateYupFormProps<FieldDefs>\n) => {\n const YupForm = createForm({\n resolver: (schema: any) =>\n yupResolver(\n schema,\n options?.schemaOptions,\n options?.resolverOptions\n ) as any,\n fieldResolver: yupFieldResolver,\n ...options,\n })\n\n YupForm.displayName = 'YupForm'\n YupForm.id = 'YupForm'\n\n return YupForm as YupFormType<FieldDefs>\n}\n","import {\n CreateStepFormProps,\n createStepForm,\n StepsOptions,\n UseStepFormProps,\n Form,\n WithStepFields,\n} from '@saas-ui/forms'\nimport { yupFieldResolver, yupResolver } from './yup-resolver'\nimport { InferType, object, string } from 'yup'\nimport React from 'react'\nimport { AnyObjectSchema } from './types'\n\ntype ResolverArgs = Parameters<typeof yupResolver>\n\nexport interface CreateYupFormProps<FieldDefs>\n extends CreateStepFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\ntype InferStepType<T extends Required<StepsOptions<AnyObjectSchema>>> =\n T extends [infer Step, ...infer Rest]\n ? Step extends { schema: AnyObjectSchema }\n ? InferType<Step['schema']> &\n (Rest extends Required<StepsOptions<AnyObjectSchema>>\n ? InferStepType<Rest>\n : object)\n : object\n : object\n\ntype YupStepFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object\n> = (<\n TSteps extends Required<StepsOptions<AnyObjectSchema>> = Required<\n StepsOptions<AnyObjectSchema>\n >,\n TFieldValues extends InferStepType<TSteps> = InferStepType<TSteps>,\n TContext extends object = object\n>(\n props: WithStepFields<\n UseStepFormProps<TSteps, TFieldValues, TContext>,\n FieldDefs,\n ExtraOverrides\n > & {\n steps: TSteps\n ref?: React.ForwardedRef<HTMLFormElement>\n } & ExtraProps\n) => React.ReactElement) & {\n displayName?: string\n id?: string\n}\n\nexport const createYupStepForm = <FieldDefs>(\n options?: CreateYupFormProps<FieldDefs>\n) => {\n const YupStepForm = createStepForm<any, any, any>({\n resolver: (schema: any) =>\n yupResolver(\n schema,\n options?.schemaOptions,\n options?.resolverOptions\n ) as any,\n fieldResolver: yupFieldResolver,\n ...options,\n })\n\n YupStepForm.displayName = 'YupStepForm'\n YupStepForm.id = 'YupStepForm'\n\n return YupStepForm as YupStepFormType<FieldDefs>\n}\n","import * as React from 'react'\n\nimport {\n AlertDialog,\n AlertDialogBody,\n AlertDialogFooter,\n AlertDialogHeader,\n AlertDialogContent,\n AlertDialogOverlay,\n AlertDialogProps,\n ButtonGroup,\n ButtonGroupProps,\n Button,\n ButtonProps,\n} from '@chakra-ui/react'\n\nexport interface ConfirmDialogProps\n extends Omit<AlertDialogProps, 'leastDestructiveRef'> {\n /**\n * The dialog title\n */\n title?: React.ReactNode\n /**\n * The cancel button label\n */\n cancelLabel?: React.ReactNode\n /**\n * The confirm button label\n */\n confirmLabel?: React.ReactNode\n /**\n * The cancel button props\n */\n cancelProps?: ButtonProps\n /**\n * The confirm button props\n */\n confirmProps?: ButtonProps\n /**\n * The button group props\n */\n buttonGroupProps?: ButtonGroupProps\n /**\n * Close the dialog on cancel\n * @default true\n */\n closeOnCancel?: boolean\n /**\n * Close the dialog on confirm\n * @default true\n */\n closeOnConfirm?: boolean\n /**\n * Defines which button gets initial focus\n * https://www.w3.org/TR/wai-aria-practices/#alertdialog\n */\n leastDestructiveFocus?: 'cancel' | 'confirm'\n /**\n * Function that's called when cancel is clicked\n */\n onCancel?: () => void\n /**\n * Function that's called when confirm is clicked.\n */\n onConfirm?: () => Promise<void> | void\n}\n\nexport const ConfirmDialog: React.FC<ConfirmDialogProps> = (props) => {\n const {\n title,\n cancelLabel = 'Cancel',\n confirmLabel = 'Confirm',\n cancelProps,\n confirmProps,\n buttonGroupProps,\n isOpen,\n closeOnCancel = true,\n closeOnConfirm = true,\n leastDestructiveFocus = 'cancel',\n onClose,\n onCancel,\n onConfirm,\n children,\n ...rest\n } = props\n\n const cancelRef = React.useRef(null)\n const confirmRef = React.useRef(null)\n const [isLoading, setIsLoading] = React.useState(false)\n\n const handleConfirm = async () => {\n try {\n const result = onConfirm?.()\n if (typeof result?.then === 'function') {\n setIsLoading(true)\n await result\n }\n\n closeOnConfirm && onClose()\n /* eslint-disable no-useless-catch */\n } catch (e: any) {\n throw e\n } finally {\n setIsLoading(false)\n }\n /* eslint-enable */\n }\n console.log(isLoading)\n return (\n <AlertDialog\n isOpen={isOpen}\n onClose={onClose}\n {...rest}\n leastDestructiveRef={\n leastDestructiveFocus === 'cancel' ? cancelRef : confirmRef\n }\n >\n <AlertDialogOverlay>\n <AlertDialogContent>\n <AlertDialogHeader>{title}</AlertDialogHeader>\n\n <AlertDialogBody>{children}</AlertDialogBody>\n\n <AlertDialogFooter>\n <ButtonGroup {...buttonGroupProps}>\n <Button\n ref={cancelRef}\n {...cancelProps}\n onClick={() => {\n onCancel?.()\n\n closeOnCancel && onClose()\n }}\n >\n {cancelProps?.children || cancelLabel}\n </Button>\n <Button\n ref={confirmRef}\n isLoading={isLoading}\n {...confirmProps}\n onClick={handleConfirm}\n >\n {confirmProps?.children || confirmLabel}\n </Button>\n </ButtonGroup>\n </AlertDialogFooter>\n </AlertDialogContent>\n </AlertDialogOverlay>\n </AlertDialog>\n )\n}\n","import * as React from 'react'\n\nimport {\n Drawer as ChakraDrawer,\n DrawerOverlay,\n DrawerContent,\n DrawerHeader,\n DrawerFooter,\n DrawerBody,\n DrawerCloseButton,\n DrawerProps as ChakraDrawerProps,\n ModalHeaderProps,\n ModalContentProps,\n ModalFooterProps,\n} from '@chakra-ui/react'\nimport { MaybeRenderProp } from '@chakra-ui/react-utils'\nimport { runIfFn } from '@chakra-ui/utils'\n\nexport interface BaseDrawerProps extends Omit<ChakraDrawerProps, 'children'> {\n /**\n * The drawer title\n */\n title: React.ReactNode\n /**\n * The modal children\n */\n children: MaybeRenderProp<{\n isOpen: boolean\n onClose: () => void\n }>\n /**\n * The modal footer\n */\n footer?: React.ReactNode\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Hide the overflow\n */\n hideOverlay?: boolean\n /**\n * Props for the modal header\n */\n headerProps?: ModalHeaderProps\n /**\n * Props for the modal content\n */\n contentProps?: ModalContentProps\n /**\n * Props for the modal footer\n */\n footerProps?: ModalFooterProps\n}\n\nexport const BaseDrawer: React.FC<BaseDrawerProps> = (props) => {\n const {\n title,\n children,\n footer,\n isOpen,\n onClose,\n hideCloseButton,\n hideOverlay,\n headerProps,\n contentProps,\n footerProps,\n ...rest\n } = props\n return (\n <ChakraDrawer isOpen={isOpen} onClose={onClose} {...rest}>\n {!hideOverlay && <DrawerOverlay />}\n <DrawerContent {...contentProps}>\n {title && <DrawerHeader {...headerProps}>{title}</DrawerHeader>}\n {!hideCloseButton && <DrawerCloseButton />}\n {runIfFn(children, {\n isOpen,\n onClose,\n })}\n {footer && <DrawerFooter {...footerProps}>{footer}</DrawerFooter>}\n </DrawerContent>\n </ChakraDrawer>\n )\n}\n\nexport interface DrawerProps extends BaseDrawerProps {\n /**\n * Drawer footer content, wrapped with `DrawerFooter`\n */\n footer?: React.ReactNode\n}\n\nexport const Drawer: React.FC<DrawerProps> = (props) => {\n const { children, isOpen, onClose, ...rest } = props\n return (\n <BaseDrawer isOpen={isOpen} onClose={onClose} {...rest}>\n <DrawerBody>\n {runIfFn(children, {\n isOpen,\n onClose,\n })}\n </DrawerBody>\n </BaseDrawer>\n )\n}\n","import * as React from 'react'\n\nimport {\n Modal as ChakraModal,\n ModalOverlay,\n ModalContent,\n ModalHeader,\n ModalFooter,\n ModalBody,\n ModalCloseButton,\n ModalProps as ChakraModalProps,\n ModalContentProps,\n ModalHeaderProps,\n ModalFooterProps,\n} from '@chakra-ui/react'\nimport { MaybeRenderProp } from '@chakra-ui/react-utils'\nimport { runIfFn } from '@chakra-ui/utils'\n\nexport interface BaseModalProps extends Omit<ChakraModalProps, 'children'> {\n /**\n * The modal title\n */\n title?: React.ReactNode\n /**\n * The modal children\n */\n children: MaybeRenderProp<{\n isOpen: boolean\n onClose: () => void\n }>\n /**\n * The modal footer\n */\n footer?: React.ReactNode\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Hide the overlay\n */\n hideOverlay?: boolean\n /**\n * Props for the modal header\n */\n headerProps?: ModalHeaderProps\n /**\n * Props for the modal content\n */\n contentProps?: ModalContentProps\n /**\n * Props for the modal footer\n */\n footerProps?: ModalFooterProps\n}\n\nexport const BaseModal: React.FC<BaseModalProps> = (props) => {\n const {\n title,\n footer,\n children,\n isOpen,\n onClose,\n hideCloseButton,\n hideOverlay,\n headerProps,\n contentProps,\n footerProps,\n ...rest\n } = props\n return (\n <ChakraModal isOpen={isOpen} onClose={onClose} {...rest}>\n {!hideOverlay && <ModalOverlay />}\n <ModalContent {...contentProps}>\n {title && <ModalHeader {...headerProps}>{title}</ModalHeader>}\n {!hideCloseButton && <ModalCloseButton />}\n {runIfFn(children, {\n isOpen,\n onClose,\n })}\n {footer && <ModalFooter {...footerProps}>{footer}</ModalFooter>}\n </ModalContent>\n </ChakraModal>\n )\n}\n\nexport const Modal: React.FC<BaseModalProps> = (props) => {\n const { children, isOpen, onClose, ...rest } = props\n return (\n <BaseModal {...rest} isOpen={isOpen} onClose={onClose}>\n <ModalBody>\n {runIfFn(children, {\n isOpen,\n onClose,\n })}\n </ModalBody>\n </BaseModal>\n )\n}\n","import * as React from 'react'\n\nimport {\n ModalFooter,\n chakra,\n forwardRef,\n useMenuContext,\n useMenuList,\n createStylesContext,\n useMultiStyleConfig,\n Menu,\n MenuListProps,\n useBreakpointValue,\n} from '@chakra-ui/react'\n\nimport { BaseModal, BaseModalProps } from './modal'\n\nconst [StylesProvider] = createStylesContext('SuiMenuDialog')\n\nexport interface MenuDialogProps extends BaseModalProps {\n /**\n * The modal footer, wrapped with `ModalFooter`\n */\n footer?: React.ReactNode\n}\n\nexport const MenuDialog: React.FC<MenuDialogProps> = (props) => {\n const { onClose, onCloseComplete, ...rest } = props\n\n return (\n <Menu\n variant=\"dialog\"\n onClose={() => {\n onClose?.()\n // Not supported in Menu, so we call it here instead\n // @todo Refactor this in v2?\n onCloseComplete?.()\n }}\n {...rest}\n />\n )\n}\n\nexport interface MenuDialogListProps\n extends Omit<\n BaseModalProps,\n 'isOpen' | 'onClose' | 'children' | 'scrollBehavior'\n >,\n Omit<MenuListProps, 'title'> {}\n\nexport const MenuDialogList = forwardRef<MenuDialogListProps, 'div'>(\n (props, forwardedRef) => {\n const {\n rootProps,\n title,\n footer,\n initialFocusRef,\n hideCloseButton,\n motionPreset = 'slideInBottom',\n isCentered: isCenteredProp,\n ...rest\n } = props\n\n const { isOpen, onClose, menuRef } = useMenuContext()\n\n const { ref, ...ownProps } = useMenuList(rest, forwardedRef)\n\n const styles = useMultiStyleConfig('Menu', props)\n\n const isCentered = useBreakpointValue({ base: true, md: false })\n\n return (\n <BaseModal\n isOpen={isOpen}\n onClose={onClose}\n initialFocusRef={initialFocusRef || menuRef}\n title={title}\n hideCloseButton={hideCloseButton}\n motionPreset={motionPreset}\n isCentered={isCenteredProp ?? isCentered}\n contentProps={{ mx: 4 }}\n >\n {/* We forward the styles again, otherwise the modal styles will be picked up */}\n <StylesProvider value={styles}>\n <chakra.div\n {...ownProps}\n ref={ref as React.Ref<HTMLDivElement>}\n __css={{\n outline: 0,\n maxHeight: '80vh', // can override this in theme\n overflowY: 'auto', // can override this in theme\n ...styles.list,\n boxShadow: 'none',\n border: 0,\n _dark: {\n /* @ts-expect-error */\n ...(styles.list._dark || {}),\n boxShadow: 'none',\n },\n }}\n />\n </StylesProvider>\n {footer && <ModalFooter>{footer}</ModalFooter>}\n </BaseModal>\n )\n }\n)\n","import * as React from 'react'\n\nimport {\n ModalBody,\n ModalFooter,\n Button,\n forwardRef,\n ButtonProps,\n} from '@chakra-ui/react'\nimport { runIfFn } from '@saas-ui/react-utils'\n\nimport {\n Form,\n AutoFields,\n SubmitButton,\n FormProps,\n FieldValues,\n FieldResolver,\n FieldProps,\n FormType,\n DefaultFieldOverrides,\n} from '@saas-ui/forms'\n\nimport { BaseModal, BaseModalProps } from './modal'\n\nexport type FormDialogFieldOverrides = DefaultFieldOverrides & {\n cancel?: ButtonProps\n}\n\nexport interface FormDialogProps<\n TSchema = any,\n TFieldValues extends FieldValues = FieldValues,\n TContext extends object = object,\n TFieldTypes = FieldProps<TFieldValues>\n> extends Omit<BaseModalProps, 'children'>,\n Pick<\n FormProps<TSchema, TFieldValues, TContext, TFieldTypes>,\n | 'schema'\n | 'defaultValues'\n | 'values'\n | 'context'\n | 'onChange'\n | 'onSubmit'\n | 'onError'\n | 'resolver'\n | 'mode'\n | 'reValidateMode'\n | 'shouldFocusError'\n | 'shouldUnregister'\n | 'shouldUseNativeValidation'\n | 'criteriaMode'\n | 'delayError'\n | 'resetOptions'\n | 'formRef'\n | 'children'\n > {\n /**\n * The modal footer, will be wrapped with `ModalFooter`.\n * Defaults to a cancel and submit button.\n */\n footer?: React.ReactNode\n /**\n * A schema field resolver used to auto generate form fields.\n */\n fieldResolver?: FieldResolver\n /**\n * Field overrides\n */\n fields?: FormDialogFieldOverrides\n}\n\nconst useFormProps = (props: FormDialogProps) => {\n const {\n schema,\n resolver,\n fieldResolver,\n defaultValues,\n values,\n context,\n onChange,\n onSubmit,\n onError,\n mode,\n reValidateMode,\n shouldFocusError = true,\n shouldUnregister,\n shouldUseNativeValidation,\n criteriaMode,\n delayError = 100,\n fields,\n formRef,\n ...modalProps\n } = props\n\n const formProps = {\n schema,\n resolver,\n defaultValues,\n values,\n context,\n onChange,\n onSubmit,\n onError,\n mode,\n reValidateMode,\n shouldFocusError,\n shouldUnregister,\n shouldUseNativeValidation,\n criteriaMode,\n delayError,\n fields,\n formRef,\n }\n\n return { modalProps, formProps, fields }\n}\n\n/**\n * @todo make this dynamic to support other schema types\n */\ntype MergeDialogProps<T> = T extends FormType<\n infer FieldDefs,\n infer ExtraProps,\n infer ExtraOverrides\n>\n ? FormType<\n FieldDefs,\n ExtraProps & Omit<BaseModalProps, 'children'>,\n ExtraOverrides & FormDialogFieldOverrides\n >\n : never\n\ntype IsSchemaType<T, Schema, FieldDefs> = T extends DefaultFormType<FieldDefs>\n ? T extends (\n props: FormProps<infer TSchema, infer TFieldValues, infer TContext>\n ) => any\n ? Schema extends TSchema\n ? true\n : false\n : false\n : false\n\nexport type DefaultFormType<\n FieldDefs = any,\n ExtraProps = object,\n ExtraOverrides = FormDialogFieldOverrides\n> = (<\n TSchema = unknown,\n TFieldValues extends Record<string, any> = any,\n TContext extends object = object\n>(\n props: any\n) => React.ReactElement) & {\n displayName?: string\n id?: string\n}\n\nexport function createFormDialog<\n FieldDefs = any,\n ExtraProps = object,\n ExtraOverrides = FormDialogFieldOverrides,\n TFormType extends DefaultFormType<\n FieldDefs,\n ExtraProps,\n ExtraOverrides\n > = DefaultFormType<FieldDefs, ExtraProps, ExtraOverrides>\n>(Form: TFormType) {\n const Dialog = forwardRef<any, 'div'>((props, ref) => {\n const { isOpen, onClose, footer, children, ...rest } = props\n const { modalProps, formProps, fields } = useFormProps(rest)\n return (\n <BaseModal {...modalProps} isOpen={isOpen} onClose={onClose}>\n <Form ref={ref} {...(formProps as any)}>\n {(form: any) => (\n <>\n <ModalBody>{runIfFn(children, form) || <AutoFields />}</ModalBody>\n\n {footer || (\n <ModalFooter>\n <Button\n variant=\"ghost\"\n mr={3}\n onClick={onClose}\n {...fields?.cancel}\n >\n {fields?.cancel?.children ?? 'Cancel'}\n </Button>\n <SubmitButton {...fields?.submit} />\n </ModalFooter>\n )}\n </>\n )}\n </Form>\n </BaseModal>\n )\n }) as MergeDialogProps<TFormType>\n\n Dialog.displayName = `${Form.displayName || Form.name}Dialog`\n Dialog.id = Form.id\n\n return Dialog\n}\n\n/**\n * Can be used to quickly request information from people without leaving the current page.\n *\n * @see Docs https://saas-ui.dev/docs/components/overlay/form-dialog\n */\nexport const FormDialog = createFormDialog(Form)\n","import * as React from 'react'\n\nimport { BaseModalProps } from './modal'\nimport { DrawerProps } from './drawer'\nimport { ConfirmDialogProps } from './dialog'\nimport { MenuDialogProps } from './menu'\nimport { FormDialogProps } from './form'\nimport { defaultModals } from './default-modals'\nimport { FieldValues, FormType } from '@saas-ui/forms'\nimport { FormDialogHandler, FormHandler } from './types'\n\nexport interface ModalsContextValue<\n TModals extends Record<string, React.FC<any>> = Record<string, React.FC<any>>,\n TTypes extends Extract<keyof TModals, string> = Extract<keyof TModals, string>\n> {\n open: <T extends OpenOptions<TTypes>>(\n componentOrOptions: T extends {\n component: infer TComponent extends React.FC<any>\n }\n ? WithModalOptions<React.ComponentPropsWithRef<TComponent>>\n : T extends {\n type: infer TType extends keyof TModals\n }\n ? WithModalOptions<React.ComponentPropsWithRef<TModals[TType]>>\n : T,\n options?: T extends React.FC<any>\n ? WithModalOptions<React.ComponentPropsWithRef<T>>\n : never\n ) => ModalId\n drawer: (options: DrawerOptions) => ModalId\n alert: (options: ConfirmDialogOptions) => ModalId\n confirm: (options: ConfirmDialogOptions) => ModalId\n menu: (options: MenuDialogOptions) => ModalId\n form: FormDialogHandler<TModals['form']>\n close: (id: ModalId) => void\n closeAll: () => void\n}\n\nexport const ModalsContext = React.createContext<ModalsContextValue<\n typeof defaultModals\n> | null>(null)\n\nexport interface ModalsProviderProps<\n TModals extends Record<string, React.FC<any>> = Record<string, React.FC<any>>\n> {\n children: React.ReactNode\n modals?: TModals\n}\n\nexport type ModalId = string | number\n\ntype WithModalOptions<T> = Omit<T, 'isOpen' | 'onClose'> & ModalOptions\n\ninterface ModalOptions\n extends Omit<BaseModalProps, 'isOpen' | 'onClose' | 'children'> {\n onClose?: (args: { force?: boolean }) => Promise<boolean | undefined> | void\n [key: string]: any\n}\n\nexport interface DrawerOptions\n extends ModalOptions,\n Omit<DrawerProps, 'onClose' | 'isOpen' | 'children' | 'title' | 'size'> {}\n\nexport interface ConfirmDialogOptions\n extends ModalOptions,\n Omit<ConfirmDialogProps, 'onClose' | 'isOpen' | 'children'> {}\n\nexport interface MenuDialogOptions\n extends ModalOptions,\n Omit<MenuDialogProps, 'onClose' | 'isOpen' | 'children'> {}\n\nexport interface FormDialogOptions\n extends ModalOptions,\n Omit<FormDialogProps, 'onClose' | 'isOpen' | 'children'> {}\n\nexport interface OpenOptions<TModalTypes extends string> extends ModalOptions {\n type?: TModalTypes\n scope?: ModalScopes\n}\n\nexport type ModalScopes = 'modal' | 'alert'\n\nexport interface ModalConfig<\n TModalOptions extends ModalOptions = ModalOptions,\n TModalTypes extends string = string\n> {\n /**\n * The modal id, autogenerated when not set.\n * Can be used to close modals.\n */\n id?: ModalId | null\n /**\n * The modal props\n */\n props?: TModalOptions | null\n /**\n * The modal scope\n * Modals can only have one level per scope.\n * The default scopes are 'modal' and 'alert', alerts can be openend above modals.\n */\n scope?: ModalScopes | string\n /**\n * The modal type to open.\n * Build in types are 'modal', 'drawer', 'alert', 'confirm'\n *\n * Custom types can be configured using the `modals` prop of `ModalProvider`\n */\n type?: TModalTypes\n /**\n * Render a custom modal component.\n * This will ignore the `type` param.\n */\n component?: React.FC<BaseModalProps>\n /**\n * Whether the modal is open or not.\n * This is used internally to keep track of the modal state.\n */\n isOpen?: boolean\n}\n\nconst initialModalState: ModalConfig = {\n id: null,\n props: null,\n type: 'modal',\n}\n\nexport function ModalsProvider({ children, modals }: ModalsProviderProps) {\n // Note that updating the Set doesn't trigger a re-render,\n // use in conjuction with setActiveModals\n const _instances = React.useMemo(() => new Set<ModalConfig>(), [])\n\n const [activeModals, setActiveModals] = React.useState<\n Record<string, ModalConfig>\n >({\n modal: initialModalState,\n })\n\n const getModalComponent = React.useMemo(() => {\n const _modals: Record<string, React.FC<any>> = {\n ...defaultModals,\n ...modals,\n }\n\n return (type = 'modal') => {\n const component = _modals[type] || _modals.modal\n\n return component\n }\n }, [modals])\n\n const setActiveModal = (modal: ModalConfig, scope?: string) => {\n if (!scope) {\n return setActiveModals({\n modal,\n })\n }\n setActiveModals((prevState) => ({\n ...prevState,\n [scope]: modal,\n }))\n }\n\n const open = <T extends OpenOptions<any>>(\n componentOrOptions: any,\n options?: T extends React.FC<any>\n ? WithModalOptions<React.ComponentPropsWithRef<T>>\n : never\n ): ModalId => {\n let _options: ModalOptions\n if (typeof componentOrOptions === 'function') {\n _options = {\n component: componentOrOptions,\n ...options,\n } as unknown as T\n } else {\n _options = componentOrOptions\n }\n\n const {\n id = _instances.size + 1,\n type = 'modal',\n scope = 'modal',\n component,\n ...props\n } = _options\n\n const modal: ModalConfig<T> = {\n id,\n props: props as T,\n type,\n scope,\n component,\n isOpen: true,\n }\n\n _instances.add(modal)\n setActiveModal(modal, scope)\n\n return id\n }\n\n const drawer = (options: DrawerOptions) => {\n return open<DrawerOptions>({\n ...options,\n type: 'drawer',\n })\n }\n\n const alert = (options: ConfirmDialogOptions) => {\n return open({\n ...options,\n scope: 'alert',\n type: 'alert',\n cancelProps: {\n display: 'none',\n },\n confirmProps: {\n label: 'OK',\n },\n leastDestructiveFocus: 'confirm',\n })\n }\n\n const confirm = (options: ConfirmDialogOptions) => {\n return open<ConfirmDialogOptions>({\n ...options,\n scope: 'alert',\n type: 'confirm',\n })\n }\n\n const menu = (options: MenuDialogOptions) => {\n return open<MenuDialogOptions>({\n ...options,\n type: 'menu',\n })\n }\n\n const form = (options: any) => {\n return open({\n ...options,\n type: 'form',\n })\n }\n\n const close = async (id?: ModalId | null, force?: boolean) => {\n const modals = [...Array.from(_instances)]\n const modal = modals.filter((modal) => modal.id === id)[0]\n\n if (!modal) {\n return\n }\n\n const shouldClose = await modal.props?.onClose?.({ force })\n if (shouldClose === false) {\n return\n }\n\n const scoped = modals.filter(({ scope }) => scope === modal.scope)\n\n if (scoped.length === 1) {\n setActiveModal(\n {\n ...modal,\n isOpen: false,\n },\n modal.scope\n )\n } else if (scoped.length > 1) {\n setActiveModal(scoped[scoped.length - 2], modal.scope)\n } else {\n setActiveModal(\n {\n id: null,\n props: null,\n type: modal.type, // Keep type same as last modal type to make sure the animation isn't interrupted\n },\n modal.scope\n )\n }\n\n closeComplete(id)\n }\n\n const closeComplete = (id?: ModalId | null) => {\n const modals = [...Array.from(_instances)]\n const modal = modals.filter((modal) => modal.id === id)[0]\n\n _instances.delete(modal)\n\n const scoped = modals.filter(({ scope }) => scope === modal.scope)\n\n if (scoped.length === 1) {\n setActiveModal(initialModalState, modal.scope)\n }\n }\n\n const closeAll = () => {\n _instances.forEach((modal) => modal.props?.onClose?.({ force: true }))\n _instances.clear()\n\n setActiveModal(initialModalState)\n }\n\n const context = {\n open,\n drawer,\n alert,\n confirm,\n menu,\n form,\n close,\n closeAll,\n }\n\n const content = React.useMemo(\n () =>\n Object.entries(activeModals).map(([scope, config]) => {\n const Component = config.component || getModalComponent(config.type)\n\n const { title, body, children, ...props } = config.props || {}\n\n return (\n <Component\n key={scope}\n title={title}\n children={body || children}\n {...props}\n isOpen={!!config.isOpen}\n onClose={() => close(config.id)}\n onCloseComplete={() => closeComplete(config.id)}\n />\n )\n }),\n [activeModals]\n )\n\n return (\n <ModalsContext.Provider value={context}>\n {content}\n {children}\n </ModalsContext.Provider>\n )\n}\n\nexport const useModalsContext = () => React.useContext(ModalsContext)\n\nexport const useModals = () => {\n const modals = useModalsContext()\n\n if (!modals) {\n throw new Error('useModals must be used within a ModalsProvider')\n }\n\n return modals\n}\n","import { ConfirmDialog } from './dialog'\nimport { MenuDialog } from './menu'\nimport { FormDialog } from './form'\nimport { Drawer } from './drawer'\nimport { Modal } from './modal'\n\nexport const defaultModals = {\n alert: ConfirmDialog,\n confirm: ConfirmDialog,\n drawer: Drawer,\n modal: Modal,\n menu: MenuDialog,\n form: FormDialog,\n}\n","import { defaultModals } from './default-modals'\nimport {\n ModalsContextValue,\n ModalsProvider,\n ModalsProviderProps,\n useModals,\n} from './provider'\n\nexport interface CreateModalsOptions<\n TModalDefs extends Record<string, React.FC<any>>\n> {\n modals: TModalDefs\n}\n\nexport const createModals = <TModalDefs extends Record<string, React.FC<any>>>(\n options: CreateModalsOptions<TModalDefs>\n) => {\n const modals = {\n ...defaultModals,\n ...options.modals,\n }\n const Provider = (props: Omit<ModalsProviderProps, 'modals'>) => {\n return <ModalsProvider children={props.children} modals={modals} />\n }\n\n return {\n ModalsProvider: Provider,\n useModals: useModals as () => ModalsContextValue<typeof modals>,\n }\n}\n","import * as React from 'react'\n\n/**\n * Get the first child of a specific type.\n * @param children The children\n * @param type The component type\n */\nexport function getChildOfType(\n children: React.ReactNode,\n type: React.JSXElementConstructor<any>\n) {\n return (React.Children.toArray(children) as React.ReactElement[]).find(\n (item) => item.type === type\n )\n}\n","import * as React from 'react'\n\n/**\n * Get all children of a specific type.\n * @param children The children\n * @param type The component type\n */\nexport function getChildrenOfType(\n children: React.ReactNode,\n type: React.JSXElementConstructor<any> | React.JSXElementConstructor<any>[]\n) {\n return (React.Children.toArray(children) as React.ReactElement[]).filter(\n (item) =>\n Array.isArray(type)\n ? type.some((component) => component === item.type)\n : item.type === type\n )\n}\n","import {\n ResponsiveValue,\n UseBreakpointOptions,\n useTheme,\n useBreakpointValue,\n} from '@chakra-ui/react'\n\nconst normalize = (variant: any, toArray?: (value: any) => any) => {\n if (Array.isArray(variant)) return variant\n else if (typeof variant === 'object') return toArray?.(variant)\n if (variant != null) return [variant]\n return []\n}\n\nexport const useResponsiveValue = (\n value: ResponsiveValue<any>,\n options?: UseBreakpointOptions\n) => {\n const theme = useTheme()\n const normalized = normalize(value, theme.__breakpoints?.toArrayValue)\n return useBreakpointValue(normalized, options)\n}\n","export { getChildOfType } from './get-child-of-type'\nexport { getChildrenOfType } from './get-children-of-type'\nexport { useResponsiveValue } from './use-responsive-value'\n\nexport * from '@chakra-ui/utils'\n","import {\n BaseModalProps,\n FormDialogFieldOverrides,\n createFormDialog,\n} from '@saas-ui/modals'\nimport { YupFormType } from './create-yup-form'\n\nexport function createYupFormDialog<\n FieldDefs = any,\n ExtraProps = object,\n ExtraOverrides = object\n>(Form: YupFormType<FieldDefs, ExtraProps, ExtraOverrides>) {\n return createFormDialog(Form) as unknown as YupFormType<\n FieldDefs,\n ExtraProps & Omit<BaseModalProps, 'children'>,\n ExtraOverrides & FormDialogFieldOverrides\n >\n}\n","export {\n type Options,\n getFieldsFromSchema,\n getNestedSchema,\n yupFieldResolver,\n yupResolver,\n} from './yup-resolver'\nexport { createYupForm, type YupFormType } from './create-yup-form'\nexport { createYupStepForm } from './create-yup-step-form'\nexport { createYupFormDialog } from './create-yup-dialog'\nexport type { AnyObjectSchema } from './types'\n\nimport { createYupForm } from './create-yup-form'\nimport { createYupStepForm } from './create-yup-step-form'\nimport { createYupFormDialog } from './create-yup-dialog'\n\nexport const Form = createYupForm()\n\nexport const StepForm = createYupStepForm()\n\nexport const FormDialog = createYupFormDialog(Form)\n"],"mappings":"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","names":["React","jsx","jsxs","runIfFn","ModalFooter","useBreakpointValue","ModalBody","Button","forwardRef","Form","jsx","jsxs","React","jsxs","jsx","runIfFn","useBreakpointValue","jsxs","jsx","ModalFooter","Form","forwardRef","ModalBody","runIfFn","Button","Form","Form","FormDialog"]}
|
1
|
+
{"version":3,"sources":["../../yup/src/yup-resolver.ts","../../yup/src/create-yup-form.ts","../../yup/src/create-yup-step-form.ts","../../../saas-ui-modals/src/dialog.tsx","../../../saas-ui-modals/src/drawer.tsx","../../../saas-ui-modals/src/modal.tsx","../../../saas-ui-modals/src/menu.tsx","../../../saas-ui-modals/src/form.tsx","../../../saas-ui-modals/src/provider.tsx","../../../saas-ui-modals/src/default-modals.ts","../../../saas-ui-modals/src/create-modals.tsx","../../../saas-ui-react-utils/src/get-child-of-type.ts","../../../saas-ui-react-utils/src/get-children-of-type.ts","../../../saas-ui-react-utils/src/use-responsive-value.ts","../../../saas-ui-react-utils/src/index.ts","../../yup/src/create-yup-dialog.ts","../../yup/src/index.ts"],"sourcesContent":["import { reach } from 'yup'\nimport { yupResolver } from '@hookform/resolvers/yup'\n\nimport { FieldProps, GetFieldResolver } from '@saas-ui/forms'\nimport { AnyObjectSchema } from './types'\n\nexport { yupResolver }\n\nexport type Options = {\n min?: number\n max?: number\n}\n\n// @TODO get proper typings for the schema fields\nconst getType = (field: any) => {\n if (field.spec.meta?.type) {\n return field.spec.meta.type\n }\n\n switch (field.type) {\n case 'array':\n return 'array'\n case 'object':\n return 'object'\n case 'number':\n return 'number'\n case 'date':\n return 'date'\n case 'string':\n default:\n return 'text'\n }\n}\n\nconst getArrayOption = (field: any, name: string) => {\n for (const test of field.tests) {\n if (test.OPTIONS?.params[name]) return test.OPTIONS.params[name]\n }\n}\n\n/**\n * A helper function to render forms automatically based on a Yup schema\n *\n * @param schema The Yup schema\n * @returns {FieldProps[]}\n */\nexport const getFieldsFromSchema = (schema: AnyObjectSchema): FieldProps[] => {\n const fields = []\n\n let schemaFields: Record<string, any> = {}\n if (schema.type === 'array') {\n /* @ts-ignore this is actually valid */\n schemaFields = schema.innerType.fields\n } else {\n schemaFields = schema.fields\n }\n\n for (const name in schemaFields) {\n const field = schemaFields[name]\n\n const options: Options = {}\n if (field.type === 'array') {\n options.min = getArrayOption(field, 'min')\n options.max = getArrayOption(field, 'max')\n }\n\n fields.push({\n name,\n label: field.spec.label || name,\n type: getType(field),\n ...options,\n })\n }\n return fields\n}\n\nexport const getNestedSchema = (schema: AnyObjectSchema, path: string) => {\n return reach(schema, path) as AnyObjectSchema\n}\n\nexport const yupFieldResolver: GetFieldResolver = (schema: AnyObjectSchema) => {\n return {\n getFields() {\n return getFieldsFromSchema(schema)\n },\n getNestedFields(name: string) {\n return getFieldsFromSchema(getNestedSchema(schema, name))\n },\n }\n}\n","import {\n createForm,\n CreateFormProps,\n FormProps,\n WithFields,\n FieldValues,\n} from '@saas-ui/forms'\nimport { yupFieldResolver, yupResolver } from './yup-resolver'\nimport { InferType } from 'yup'\nimport React from 'react'\nimport { AnyObjectSchema } from './types'\n\ntype ResolverArgs = Parameters<typeof yupResolver>\n\nexport interface CreateYupFormProps<FieldDefs>\n extends CreateFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\nexport type YupFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object,\n Type extends 'yup' = 'yup'\n> = (<\n TSchema extends AnyObjectSchema = AnyObjectSchema,\n TFieldValues extends InferType<TSchema> = InferType<TSchema>, // placeholder\n TContext extends object = object\n>(\n props: WithFields<\n FormProps<TFieldValues, TContext, TSchema>,\n FieldDefs,\n ExtraOverrides\n > & {\n ref?: React.ForwardedRef<HTMLFormElement>\n } & ExtraProps\n) => React.ReactElement) & {\n displayName?: string\n id?: 'YupForm'\n}\n\nexport const createYupForm = <FieldDefs>(\n options?: CreateYupFormProps<FieldDefs>\n) => {\n const YupForm = createForm({\n resolver: (schema: any) =>\n yupResolver(\n schema,\n options?.schemaOptions,\n options?.resolverOptions\n ) as any,\n fieldResolver: yupFieldResolver,\n ...options,\n })\n\n YupForm.displayName = 'YupForm'\n YupForm.id = 'YupForm'\n\n return YupForm as YupFormType<FieldDefs>\n}\n","import {\n CreateStepFormProps,\n createStepForm,\n StepsOptions,\n UseStepFormProps,\n Form,\n WithStepFields,\n} from '@saas-ui/forms'\nimport { yupFieldResolver, yupResolver } from './yup-resolver'\nimport { InferType, object, string } from 'yup'\nimport React from 'react'\nimport { AnyObjectSchema } from './types'\n\ntype ResolverArgs = Parameters<typeof yupResolver>\n\nexport interface CreateYupFormProps<FieldDefs>\n extends CreateStepFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\ntype InferStepType<T extends Required<StepsOptions<AnyObjectSchema>>> =\n T extends [infer Step, ...infer Rest]\n ? Step extends { schema: AnyObjectSchema }\n ? InferType<Step['schema']> &\n (Rest extends Required<StepsOptions<AnyObjectSchema>>\n ? InferStepType<Rest>\n : object)\n : object\n : object\n\ntype YupStepFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object\n> = (<\n TSteps extends Required<StepsOptions<AnyObjectSchema>> = Required<\n StepsOptions<AnyObjectSchema>\n >,\n TFieldValues extends InferStepType<TSteps> = InferStepType<TSteps>,\n TContext extends object = object\n>(\n props: WithStepFields<\n UseStepFormProps<TSteps, TFieldValues, TContext>,\n FieldDefs,\n ExtraOverrides\n > & {\n steps: TSteps\n ref?: React.ForwardedRef<HTMLFormElement>\n } & ExtraProps\n) => React.ReactElement) & {\n displayName?: string\n id?: string\n}\n\nexport const createYupStepForm = <FieldDefs>(\n options?: CreateYupFormProps<FieldDefs>\n) => {\n const YupStepForm = createStepForm<any, any, any>({\n resolver: (schema: any) =>\n yupResolver(\n schema,\n options?.schemaOptions,\n options?.resolverOptions\n ) as any,\n fieldResolver: yupFieldResolver,\n ...options,\n })\n\n YupStepForm.displayName = 'YupStepForm'\n YupStepForm.id = 'YupStepForm'\n\n return YupStepForm as YupStepFormType<FieldDefs>\n}\n","import * as React from 'react'\n\nimport {\n AlertDialog,\n AlertDialogBody,\n AlertDialogFooter,\n AlertDialogHeader,\n AlertDialogContent,\n AlertDialogOverlay,\n AlertDialogProps,\n ButtonGroup,\n ButtonGroupProps,\n Button,\n ButtonProps,\n} from '@chakra-ui/react'\n\nexport interface ConfirmDialogProps\n extends Omit<AlertDialogProps, 'leastDestructiveRef'> {\n /**\n * The dialog title\n */\n title?: React.ReactNode\n /**\n * The cancel button label\n */\n cancelLabel?: React.ReactNode\n /**\n * The confirm button label\n */\n confirmLabel?: React.ReactNode\n /**\n * The cancel button props\n */\n cancelProps?: ButtonProps\n /**\n * The confirm button props\n */\n confirmProps?: ButtonProps\n /**\n * The button group props\n */\n buttonGroupProps?: ButtonGroupProps\n /**\n * Close the dialog on cancel\n * @default true\n */\n closeOnCancel?: boolean\n /**\n * Close the dialog on confirm\n * @default true\n */\n closeOnConfirm?: boolean\n /**\n * Defines which button gets initial focus\n * https://www.w3.org/TR/wai-aria-practices/#alertdialog\n */\n leastDestructiveFocus?: 'cancel' | 'confirm'\n /**\n * Function that's called when cancel is clicked\n */\n onCancel?: () => void\n /**\n * Function that's called when confirm is clicked.\n */\n onConfirm?: () => Promise<void> | void\n}\n\nexport const ConfirmDialog: React.FC<ConfirmDialogProps> = (props) => {\n const {\n title,\n cancelLabel = 'Cancel',\n confirmLabel = 'Confirm',\n cancelProps,\n confirmProps,\n buttonGroupProps,\n isOpen,\n closeOnCancel = true,\n closeOnConfirm = true,\n leastDestructiveFocus = 'cancel',\n onClose,\n onCancel,\n onConfirm,\n children,\n ...rest\n } = props\n\n const cancelRef = React.useRef(null)\n const confirmRef = React.useRef(null)\n const [isLoading, setIsLoading] = React.useState(false)\n\n const handleConfirm = async () => {\n try {\n const result = onConfirm?.()\n if (typeof result?.then === 'function') {\n setIsLoading(true)\n await result\n }\n\n closeOnConfirm && onClose()\n /* eslint-disable no-useless-catch */\n } catch (e: any) {\n throw e\n } finally {\n setIsLoading(false)\n }\n /* eslint-enable */\n }\n console.log(isLoading)\n return (\n <AlertDialog\n isOpen={isOpen}\n onClose={onClose}\n {...rest}\n leastDestructiveRef={\n leastDestructiveFocus === 'cancel' ? cancelRef : confirmRef\n }\n >\n <AlertDialogOverlay>\n <AlertDialogContent>\n <AlertDialogHeader>{title}</AlertDialogHeader>\n\n <AlertDialogBody>{children}</AlertDialogBody>\n\n <AlertDialogFooter>\n <ButtonGroup {...buttonGroupProps}>\n <Button\n ref={cancelRef}\n {...cancelProps}\n onClick={() => {\n onCancel?.()\n\n closeOnCancel && onClose()\n }}\n >\n {cancelProps?.children || cancelLabel}\n </Button>\n <Button\n ref={confirmRef}\n isLoading={isLoading}\n {...confirmProps}\n onClick={handleConfirm}\n >\n {confirmProps?.children || confirmLabel}\n </Button>\n </ButtonGroup>\n </AlertDialogFooter>\n </AlertDialogContent>\n </AlertDialogOverlay>\n </AlertDialog>\n )\n}\n","import * as React from 'react'\n\nimport {\n Drawer as ChakraDrawer,\n DrawerOverlay,\n DrawerContent,\n DrawerHeader,\n DrawerFooter,\n DrawerBody,\n DrawerCloseButton,\n DrawerProps as ChakraDrawerProps,\n ModalHeaderProps,\n ModalContentProps,\n ModalFooterProps,\n} from '@chakra-ui/react'\nimport { MaybeRenderProp } from '@chakra-ui/react-utils'\nimport { runIfFn } from '@chakra-ui/utils'\n\nexport interface BaseDrawerProps extends Omit<ChakraDrawerProps, 'children'> {\n /**\n * The drawer title\n */\n title: React.ReactNode\n /**\n * The modal children\n */\n children: MaybeRenderProp<{\n isOpen: boolean\n onClose: () => void\n }>\n /**\n * The modal footer\n */\n footer?: React.ReactNode\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Hide the overflow\n */\n hideOverlay?: boolean\n /**\n * Props for the modal header\n */\n headerProps?: ModalHeaderProps\n /**\n * Props for the modal content\n */\n contentProps?: ModalContentProps\n /**\n * Props for the modal footer\n */\n footerProps?: ModalFooterProps\n}\n\nexport const BaseDrawer: React.FC<BaseDrawerProps> = (props) => {\n const {\n title,\n children,\n footer,\n isOpen,\n onClose,\n hideCloseButton,\n hideOverlay,\n headerProps,\n contentProps,\n footerProps,\n ...rest\n } = props\n return (\n <ChakraDrawer isOpen={isOpen} onClose={onClose} {...rest}>\n {!hideOverlay && <DrawerOverlay />}\n <DrawerContent {...contentProps}>\n {title && <DrawerHeader {...headerProps}>{title}</DrawerHeader>}\n {!hideCloseButton && <DrawerCloseButton />}\n {runIfFn(children, {\n isOpen,\n onClose,\n })}\n {footer && <DrawerFooter {...footerProps}>{footer}</DrawerFooter>}\n </DrawerContent>\n </ChakraDrawer>\n )\n}\n\nexport interface DrawerProps extends BaseDrawerProps {\n /**\n * Drawer footer content, wrapped with `DrawerFooter`\n */\n footer?: React.ReactNode\n}\n\nexport const Drawer: React.FC<DrawerProps> = (props) => {\n const { children, isOpen, onClose, ...rest } = props\n return (\n <BaseDrawer isOpen={isOpen} onClose={onClose} {...rest}>\n <DrawerBody>\n {runIfFn(children, {\n isOpen,\n onClose,\n })}\n </DrawerBody>\n </BaseDrawer>\n )\n}\n","import * as React from 'react'\n\nimport {\n Modal as ChakraModal,\n ModalOverlay,\n ModalContent,\n ModalHeader,\n ModalFooter,\n ModalBody,\n ModalCloseButton,\n ModalProps as ChakraModalProps,\n ModalContentProps,\n ModalHeaderProps,\n ModalFooterProps,\n} from '@chakra-ui/react'\nimport { MaybeRenderProp } from '@chakra-ui/react-utils'\nimport { runIfFn } from '@chakra-ui/utils'\n\nexport interface BaseModalProps extends Omit<ChakraModalProps, 'children'> {\n /**\n * The modal title\n */\n title?: React.ReactNode\n /**\n * The modal children\n */\n children: MaybeRenderProp<{\n isOpen: boolean\n onClose: () => void\n }>\n /**\n * The modal footer\n */\n footer?: React.ReactNode\n /**\n * Hide the close button\n */\n hideCloseButton?: boolean\n /**\n * Hide the overlay\n */\n hideOverlay?: boolean\n /**\n * Props for the modal header\n */\n headerProps?: ModalHeaderProps\n /**\n * Props for the modal content\n */\n contentProps?: ModalContentProps\n /**\n * Props for the modal footer\n */\n footerProps?: ModalFooterProps\n}\n\nexport const BaseModal: React.FC<BaseModalProps> = (props) => {\n const {\n title,\n footer,\n children,\n isOpen,\n onClose,\n hideCloseButton,\n hideOverlay,\n headerProps,\n contentProps,\n footerProps,\n ...rest\n } = props\n return (\n <ChakraModal isOpen={isOpen} onClose={onClose} {...rest}>\n {!hideOverlay && <ModalOverlay />}\n <ModalContent {...contentProps}>\n {title && <ModalHeader {...headerProps}>{title}</ModalHeader>}\n {!hideCloseButton && <ModalCloseButton />}\n {runIfFn(children, {\n isOpen,\n onClose,\n })}\n {footer && <ModalFooter {...footerProps}>{footer}</ModalFooter>}\n </ModalContent>\n </ChakraModal>\n )\n}\n\nexport const Modal: React.FC<BaseModalProps> = (props) => {\n const { children, isOpen, onClose, ...rest } = props\n return (\n <BaseModal {...rest} isOpen={isOpen} onClose={onClose}>\n <ModalBody>\n {runIfFn(children, {\n isOpen,\n onClose,\n })}\n </ModalBody>\n </BaseModal>\n )\n}\n","import * as React from 'react'\n\nimport {\n ModalFooter,\n chakra,\n forwardRef,\n useMenuContext,\n useMenuList,\n createStylesContext,\n useMultiStyleConfig,\n Menu,\n MenuListProps,\n useBreakpointValue,\n} from '@chakra-ui/react'\n\nimport { BaseModal, BaseModalProps } from './modal'\n\nconst [StylesProvider] = createStylesContext('SuiMenuDialog')\n\nexport interface MenuDialogProps extends BaseModalProps {\n /**\n * The modal footer, wrapped with `ModalFooter`\n */\n footer?: React.ReactNode\n}\n\nexport const MenuDialog: React.FC<MenuDialogProps> = (props) => {\n const { onClose, onCloseComplete, ...rest } = props\n\n return (\n <Menu\n variant=\"dialog\"\n onClose={() => {\n onClose?.()\n // Not supported in Menu, so we call it here instead\n // @todo Refactor this in v2?\n onCloseComplete?.()\n }}\n {...rest}\n />\n )\n}\n\nexport interface MenuDialogListProps\n extends Omit<\n BaseModalProps,\n 'isOpen' | 'onClose' | 'children' | 'scrollBehavior'\n >,\n Omit<MenuListProps, 'title'> {}\n\nexport const MenuDialogList = forwardRef<MenuDialogListProps, 'div'>(\n (props, forwardedRef) => {\n const {\n rootProps,\n title,\n footer,\n initialFocusRef,\n hideCloseButton,\n motionPreset = 'slideInBottom',\n isCentered: isCenteredProp,\n ...rest\n } = props\n\n const { isOpen, onClose, menuRef } = useMenuContext()\n\n const { ref, ...ownProps } = useMenuList(rest, forwardedRef)\n\n const styles = useMultiStyleConfig('Menu', props)\n\n const isCentered = useBreakpointValue({ base: true, md: false })\n\n return (\n <BaseModal\n isOpen={isOpen}\n onClose={onClose}\n initialFocusRef={initialFocusRef || menuRef}\n title={title}\n hideCloseButton={hideCloseButton}\n motionPreset={motionPreset}\n isCentered={isCenteredProp ?? isCentered}\n contentProps={{ mx: 4 }}\n >\n {/* We forward the styles again, otherwise the modal styles will be picked up */}\n <StylesProvider value={styles}>\n <chakra.div\n {...ownProps}\n ref={ref as React.Ref<HTMLDivElement>}\n __css={{\n outline: 0,\n maxHeight: '80vh', // can override this in theme\n overflowY: 'auto', // can override this in theme\n ...styles.list,\n boxShadow: 'none',\n border: 0,\n _dark: {\n /* @ts-expect-error */\n ...(styles.list._dark || {}),\n boxShadow: 'none',\n },\n }}\n />\n </StylesProvider>\n {footer && <ModalFooter>{footer}</ModalFooter>}\n </BaseModal>\n )\n }\n)\n","import * as React from 'react'\n\nimport {\n ModalBody,\n ModalFooter,\n Button,\n forwardRef,\n ButtonProps,\n} from '@chakra-ui/react'\nimport { runIfFn } from '@saas-ui/react-utils'\n\nimport {\n Form,\n AutoFields,\n SubmitButton,\n FormProps,\n FieldValues,\n FieldResolver,\n FieldProps,\n FormType,\n DefaultFieldOverrides,\n} from '@saas-ui/forms'\n\nimport { BaseModal, BaseModalProps } from './modal'\n\nexport type FormDialogFieldOverrides = DefaultFieldOverrides & {\n cancel?: ButtonProps\n}\n\nexport interface FormDialogProps<\n TSchema = any,\n TFieldValues extends FieldValues = FieldValues,\n TContext extends object = object,\n TFieldTypes = FieldProps<TFieldValues>\n> extends Omit<BaseModalProps, 'children'>,\n Pick<\n FormProps<TSchema, TFieldValues, TContext, TFieldTypes>,\n | 'schema'\n | 'defaultValues'\n | 'values'\n | 'context'\n | 'onChange'\n | 'onSubmit'\n | 'onError'\n | 'resolver'\n | 'mode'\n | 'reValidateMode'\n | 'shouldFocusError'\n | 'shouldUnregister'\n | 'shouldUseNativeValidation'\n | 'criteriaMode'\n | 'delayError'\n | 'resetOptions'\n | 'formRef'\n | 'children'\n > {\n /**\n * The modal footer, will be wrapped with `ModalFooter`.\n * Defaults to a cancel and submit button.\n */\n footer?: React.ReactNode\n /**\n * A schema field resolver used to auto generate form fields.\n */\n fieldResolver?: FieldResolver\n /**\n * Field overrides\n */\n fields?: FormDialogFieldOverrides\n}\n\nconst useFormProps = (props: FormDialogProps) => {\n const {\n schema,\n resolver,\n fieldResolver,\n defaultValues,\n values,\n context,\n onChange,\n onSubmit,\n onError,\n mode,\n reValidateMode,\n shouldFocusError = true,\n shouldUnregister,\n shouldUseNativeValidation,\n criteriaMode,\n delayError = 100,\n fields,\n formRef,\n ...modalProps\n } = props\n\n const formProps = {\n schema,\n resolver,\n defaultValues,\n values,\n context,\n onChange,\n onSubmit,\n onError,\n mode,\n reValidateMode,\n shouldFocusError,\n shouldUnregister,\n shouldUseNativeValidation,\n criteriaMode,\n delayError,\n fields,\n formRef,\n }\n\n return { modalProps, formProps, fields }\n}\n\n/**\n * @todo make this dynamic to support other schema types\n */\ntype MergeDialogProps<T> = T extends FormType<\n infer FieldDefs,\n infer ExtraProps,\n infer ExtraOverrides\n>\n ? FormType<\n FieldDefs,\n ExtraProps & Omit<BaseModalProps, 'children'>,\n ExtraOverrides & FormDialogFieldOverrides\n >\n : never\n\ntype IsSchemaType<T, Schema, FieldDefs> = T extends DefaultFormType<FieldDefs>\n ? T extends (\n props: FormProps<infer TSchema, infer TFieldValues, infer TContext>\n ) => any\n ? Schema extends TSchema\n ? true\n : false\n : false\n : false\n\nexport type DefaultFormType<\n FieldDefs = any,\n ExtraProps = object,\n ExtraOverrides = FormDialogFieldOverrides\n> = (<\n TSchema = unknown,\n TFieldValues extends Record<string, any> = any,\n TContext extends object = object\n>(\n props: any\n) => React.ReactElement) & {\n displayName?: string\n id?: string\n}\n\nexport function createFormDialog<\n FieldDefs = any,\n ExtraProps = object,\n ExtraOverrides = FormDialogFieldOverrides,\n TFormType extends DefaultFormType<\n FieldDefs,\n ExtraProps,\n ExtraOverrides\n > = DefaultFormType<FieldDefs, ExtraProps, ExtraOverrides>\n>(Form: TFormType) {\n const Dialog = forwardRef<any, 'div'>((props, ref) => {\n const { isOpen, onClose, footer, children, ...rest } = props\n const { modalProps, formProps, fields } = useFormProps(rest)\n return (\n <BaseModal {...modalProps} isOpen={isOpen} onClose={onClose}>\n <Form ref={ref} {...(formProps as any)}>\n {(form: any) => (\n <>\n <ModalBody>{runIfFn(children, form) || <AutoFields />}</ModalBody>\n\n {footer || (\n <ModalFooter>\n <Button\n variant=\"ghost\"\n mr={3}\n onClick={onClose}\n {...fields?.cancel}\n >\n {fields?.cancel?.children ?? 'Cancel'}\n </Button>\n <SubmitButton {...fields?.submit} />\n </ModalFooter>\n )}\n </>\n )}\n </Form>\n </BaseModal>\n )\n }) as MergeDialogProps<TFormType>\n\n Dialog.displayName = `${Form.displayName || Form.name}Dialog`\n Dialog.id = Form.id\n\n return Dialog\n}\n\n/**\n * Can be used to quickly request information from people without leaving the current page.\n *\n * @see Docs https://saas-ui.dev/docs/components/overlay/form-dialog\n */\nexport const FormDialog = createFormDialog(Form)\n","import * as React from 'react'\n\nimport { BaseModalProps } from './modal'\nimport { DrawerProps } from './drawer'\nimport { ConfirmDialogProps } from './dialog'\nimport { MenuDialogProps } from './menu'\nimport { FormDialogProps } from './form'\nimport { defaultModals } from './default-modals'\nimport { FieldValues, FormType } from '@saas-ui/forms'\nimport { FormDialogHandler, FormHandler } from './types'\n\nexport interface ModalsContextValue<\n TModals extends Record<string, React.FC<any>> = Record<string, React.FC<any>>,\n TTypes extends Extract<keyof TModals, string> = Extract<keyof TModals, string>\n> {\n open: <T extends OpenOptions<TTypes>>(\n componentOrOptions: T extends {\n component: infer TComponent extends React.FC<any>\n }\n ? WithModalOptions<React.ComponentPropsWithRef<TComponent>>\n : T extends {\n type: infer TType extends keyof TModals\n }\n ? WithModalOptions<React.ComponentPropsWithRef<TModals[TType]>>\n : T,\n options?: T extends React.FC<any>\n ? WithModalOptions<React.ComponentPropsWithRef<T>>\n : never\n ) => ModalId\n drawer: (options: DrawerOptions) => ModalId\n alert: (options: ConfirmDialogOptions) => ModalId\n confirm: (options: ConfirmDialogOptions) => ModalId\n menu: (options: MenuDialogOptions) => ModalId\n form: FormDialogHandler<TModals['form']>\n close: (id: ModalId) => void\n closeAll: () => void\n}\n\nexport const ModalsContext = React.createContext<ModalsContextValue<\n typeof defaultModals\n> | null>(null)\n\nexport interface ModalsProviderProps<\n TModals extends Record<string, React.FC<any>> = Record<string, React.FC<any>>\n> {\n children: React.ReactNode\n modals?: TModals\n}\n\nexport type ModalId = string | number\n\ntype WithModalOptions<T> = Omit<T, 'isOpen' | 'onClose'> & ModalOptions\n\ninterface ModalOptions\n extends Omit<BaseModalProps, 'isOpen' | 'onClose' | 'children'> {\n onClose?: (args: { force?: boolean }) => Promise<boolean | undefined> | void\n [key: string]: any\n}\n\nexport interface DrawerOptions\n extends ModalOptions,\n Omit<DrawerProps, 'onClose' | 'isOpen' | 'children' | 'title' | 'size'> {}\n\nexport interface ConfirmDialogOptions\n extends ModalOptions,\n Omit<ConfirmDialogProps, 'onClose' | 'isOpen' | 'children'> {}\n\nexport interface MenuDialogOptions\n extends ModalOptions,\n Omit<MenuDialogProps, 'onClose' | 'isOpen' | 'children'> {}\n\nexport interface FormDialogOptions\n extends ModalOptions,\n Omit<FormDialogProps, 'onClose' | 'isOpen' | 'children'> {}\n\nexport interface OpenOptions<TModalTypes extends string> extends ModalOptions {\n type?: TModalTypes\n scope?: ModalScopes\n}\n\nexport type ModalScopes = 'modal' | 'alert'\n\nexport interface ModalConfig<\n TModalOptions extends ModalOptions = ModalOptions,\n TModalTypes extends string = string\n> {\n /**\n * The modal id, autogenerated when not set.\n * Can be used to close modals.\n */\n id?: ModalId | null\n /**\n * The modal props\n */\n props?: TModalOptions | null\n /**\n * The modal scope\n * Modals can only have one level per scope.\n * The default scopes are 'modal' and 'alert', alerts can be openend above modals.\n */\n scope?: ModalScopes | string\n /**\n * The modal type to open.\n * Build in types are 'modal', 'drawer', 'alert', 'confirm'\n *\n * Custom types can be configured using the `modals` prop of `ModalProvider`\n */\n type?: TModalTypes\n /**\n * Render a custom modal component.\n * This will ignore the `type` param.\n */\n component?: React.FC<BaseModalProps>\n /**\n * Whether the modal is open or not.\n * This is used internally to keep track of the modal state.\n */\n isOpen?: boolean\n}\n\nconst initialModalState: ModalConfig = {\n id: null,\n props: null,\n type: 'modal',\n}\n\nexport function ModalsProvider({ children, modals }: ModalsProviderProps) {\n // Note that updating the Set doesn't trigger a re-render,\n // use in conjuction with setActiveModals\n const _instances = React.useMemo(() => new Set<ModalConfig>(), [])\n\n const [activeModals, setActiveModals] = React.useState<\n Record<string, ModalConfig>\n >({\n modal: initialModalState,\n })\n\n const getModalComponent = React.useMemo(() => {\n const _modals: Record<string, React.FC<any>> = {\n ...defaultModals,\n ...modals,\n }\n\n return (type = 'modal') => {\n const component = _modals[type] || _modals.modal\n\n return component\n }\n }, [modals])\n\n const setActiveModal = (modal: ModalConfig, scope?: string) => {\n if (!scope) {\n return setActiveModals({\n modal,\n })\n }\n setActiveModals((prevState) => ({\n ...prevState,\n [scope]: modal,\n }))\n }\n\n const open = <T extends OpenOptions<any>>(\n componentOrOptions: any,\n options?: T extends React.FC<any>\n ? WithModalOptions<React.ComponentPropsWithRef<T>>\n : never\n ): ModalId => {\n let _options: ModalOptions\n if (typeof componentOrOptions === 'function') {\n _options = {\n component: componentOrOptions,\n ...options,\n } as unknown as T\n } else {\n _options = componentOrOptions\n }\n\n const {\n id = _instances.size + 1,\n type = 'modal',\n scope = 'modal',\n component,\n ...props\n } = _options\n\n const modal: ModalConfig<T> = {\n id,\n props: props as T,\n type,\n scope,\n component,\n isOpen: true,\n }\n\n _instances.add(modal)\n setActiveModal(modal, scope)\n\n return id\n }\n\n const drawer = (options: DrawerOptions) => {\n return open<DrawerOptions>({\n ...options,\n type: 'drawer',\n })\n }\n\n const alert = (options: ConfirmDialogOptions) => {\n return open({\n ...options,\n scope: 'alert',\n type: 'alert',\n cancelProps: {\n display: 'none',\n },\n confirmProps: {\n label: 'OK',\n },\n leastDestructiveFocus: 'confirm',\n })\n }\n\n const confirm = (options: ConfirmDialogOptions) => {\n return open<ConfirmDialogOptions>({\n ...options,\n scope: 'alert',\n type: 'confirm',\n })\n }\n\n const menu = (options: MenuDialogOptions) => {\n return open<MenuDialogOptions>({\n ...options,\n type: 'menu',\n })\n }\n\n const form = (options: any) => {\n return open({\n ...options,\n type: 'form',\n })\n }\n\n const close = async (id?: ModalId | null, force?: boolean) => {\n const modals = [...Array.from(_instances)]\n const modal = modals.filter((modal) => modal.id === id)[0]\n\n if (!modal) {\n return\n }\n\n const shouldClose = await modal.props?.onClose?.({ force })\n if (shouldClose === false) {\n return\n }\n\n const scoped = modals.filter(({ scope }) => scope === modal.scope)\n\n if (scoped.length === 1) {\n setActiveModal(\n {\n ...modal,\n isOpen: false,\n },\n modal.scope\n )\n } else if (scoped.length > 1) {\n setActiveModal(scoped[scoped.length - 2], modal.scope)\n } else {\n setActiveModal(\n {\n id: null,\n props: null,\n type: modal.type, // Keep type same as last modal type to make sure the animation isn't interrupted\n },\n modal.scope\n )\n }\n\n // @todo this is not ideal, but not all modals support onCloseComplete\n setTimeout(() => closeComplete(id), 200)\n }\n\n const closeComplete = (id?: ModalId | null) => {\n const modals = [...Array.from(_instances)]\n const modal = modals.filter((modal) => modal.id === id)[0]\n\n _instances.delete(modal)\n\n const scoped = modals.filter(({ scope }) => scope === modal.scope)\n\n if (scoped.length === 1) {\n setActiveModal(initialModalState, modal.scope)\n }\n }\n\n const closeAll = () => {\n _instances.forEach((modal) => modal.props?.onClose?.({ force: true }))\n _instances.clear()\n\n setActiveModal(initialModalState)\n }\n\n const context = {\n open,\n drawer,\n alert,\n confirm,\n menu,\n form,\n close,\n closeAll,\n }\n\n const content = React.useMemo(\n () =>\n Object.entries(activeModals).map(([scope, config]) => {\n const Component = config.component || getModalComponent(config.type)\n\n const { title, body, children, ...props } = config.props || {}\n\n return (\n <Component\n key={scope}\n title={title}\n children={body || children}\n {...props}\n isOpen={!!config.isOpen}\n onClose={() => close(config.id)}\n onCloseComplete={() => closeComplete(config.id)}\n />\n )\n }),\n [activeModals]\n )\n\n return (\n <ModalsContext.Provider value={context}>\n {content}\n {children}\n </ModalsContext.Provider>\n )\n}\n\nexport const useModalsContext = () => React.useContext(ModalsContext)\n\nexport const useModals = () => {\n const modals = useModalsContext()\n\n if (!modals) {\n throw new Error('useModals must be used within a ModalsProvider')\n }\n\n return modals\n}\n","import { ConfirmDialog } from './dialog'\nimport { MenuDialog } from './menu'\nimport { FormDialog } from './form'\nimport { Drawer } from './drawer'\nimport { Modal } from './modal'\n\nexport const defaultModals = {\n alert: ConfirmDialog,\n confirm: ConfirmDialog,\n drawer: Drawer,\n modal: Modal,\n menu: MenuDialog,\n form: FormDialog,\n}\n","import { defaultModals } from './default-modals'\nimport {\n ModalsContextValue,\n ModalsProvider,\n ModalsProviderProps,\n useModals,\n} from './provider'\n\nexport interface CreateModalsOptions<\n TModalDefs extends Record<string, React.FC<any>>\n> {\n modals: TModalDefs\n}\n\nexport const createModals = <TModalDefs extends Record<string, React.FC<any>>>(\n options: CreateModalsOptions<TModalDefs>\n) => {\n const modals = {\n ...defaultModals,\n ...options.modals,\n }\n const Provider = (props: Omit<ModalsProviderProps, 'modals'>) => {\n return <ModalsProvider children={props.children} modals={modals} />\n }\n\n return {\n ModalsProvider: Provider,\n useModals: useModals as () => ModalsContextValue<typeof modals>,\n }\n}\n","import * as React from 'react'\n\n/**\n * Get the first child of a specific type.\n * @param children The children\n * @param type The component type\n */\nexport function getChildOfType(\n children: React.ReactNode,\n type: React.JSXElementConstructor<any>\n) {\n return (React.Children.toArray(children) as React.ReactElement[]).find(\n (item) => item.type === type\n )\n}\n","import * as React from 'react'\n\n/**\n * Get all children of a specific type.\n * @param children The children\n * @param type The component type\n */\nexport function getChildrenOfType(\n children: React.ReactNode,\n type: React.JSXElementConstructor<any> | React.JSXElementConstructor<any>[]\n) {\n return (React.Children.toArray(children) as React.ReactElement[]).filter(\n (item) =>\n Array.isArray(type)\n ? type.some((component) => component === item.type)\n : item.type === type\n )\n}\n","import {\n ResponsiveValue,\n UseBreakpointOptions,\n useTheme,\n useBreakpointValue,\n} from '@chakra-ui/react'\n\nconst normalize = (variant: any, toArray?: (value: any) => any) => {\n if (Array.isArray(variant)) return variant\n else if (typeof variant === 'object') return toArray?.(variant)\n if (variant != null) return [variant]\n return []\n}\n\nexport const useResponsiveValue = (\n value: ResponsiveValue<any>,\n options?: UseBreakpointOptions\n) => {\n const theme = useTheme()\n const normalized = normalize(value, theme.__breakpoints?.toArrayValue)\n return useBreakpointValue(normalized, options)\n}\n","export { getChildOfType } from './get-child-of-type'\nexport { getChildrenOfType } from './get-children-of-type'\nexport { useResponsiveValue } from './use-responsive-value'\n\nexport * from '@chakra-ui/utils'\n","import {\n BaseModalProps,\n FormDialogFieldOverrides,\n createFormDialog,\n} from '@saas-ui/modals'\nimport { YupFormType } from './create-yup-form'\n\nexport function createYupFormDialog<\n FieldDefs = any,\n ExtraProps = object,\n ExtraOverrides = object\n>(Form: YupFormType<FieldDefs, ExtraProps, ExtraOverrides>) {\n return createFormDialog(Form) as unknown as YupFormType<\n FieldDefs,\n ExtraProps & Omit<BaseModalProps, 'children'>,\n ExtraOverrides & FormDialogFieldOverrides\n >\n}\n","export {\n type Options,\n getFieldsFromSchema,\n getNestedSchema,\n yupFieldResolver,\n yupResolver,\n} from './yup-resolver'\nexport { createYupForm, type YupFormType } from './create-yup-form'\nexport { createYupStepForm } from './create-yup-step-form'\nexport { createYupFormDialog } from './create-yup-dialog'\nexport type { AnyObjectSchema } from './types'\n\nimport { createYupForm } from './create-yup-form'\nimport { createYupStepForm } from './create-yup-step-form'\nimport { createYupFormDialog } from './create-yup-dialog'\n\nexport const Form = createYupForm()\n\nexport const StepForm = createYupStepForm()\n\nexport const FormDialog = createYupFormDialog(Form)\n"],"mappings":"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","names":["React","jsx","jsxs","runIfFn","ModalFooter","useBreakpointValue","ModalBody","Button","forwardRef","Form","jsx","jsxs","React","jsxs","jsx","runIfFn","useBreakpointValue","jsxs","jsx","ModalFooter","Form","forwardRef","ModalBody","runIfFn","Button","Form","Form","FormDialog"]}
|
package/dist/zod/index.d.ts
CHANGED
@@ -8,7 +8,7 @@ import * as react_hook_form from 'react-hook-form';
|
|
8
8
|
import { FieldValues, FieldPath, RegisterOptions, SubmitHandler, UseFieldArrayReturn, UseFormReturn, UseFormProps, WatchObserver, SubmitErrorHandler } from 'react-hook-form';
|
9
9
|
import * as React$1 from 'react';
|
10
10
|
import React$1__default from 'react';
|
11
|
-
import { InputProps, RadioGroupProps,
|
11
|
+
import { InputProps, RadioGroupProps, SelectProps as SelectProps$1, UsePinInputProps, SystemProps, ButtonProps, ResponsiveValue, FormControlProps, HTMLChakraProps, NumberInputProps as NumberInputProps$1, StackDirection, MenuProps, ThemingProps, MenuListProps, NumberInputFieldProps as NumberInputFieldProps$1, MenuItemOptionProps, RadioProps, TextareaProps, SwitchProps, CheckboxProps } from '@chakra-ui/react';
|
12
12
|
import { UseStepperProps, UseStepperReturn } from '@saas-ui/core';
|
13
13
|
import { FocusableElement } from '@chakra-ui/utils';
|
14
14
|
import { MaybeRenderProp } from '@chakra-ui/react-utils';
|
@@ -32,6 +32,14 @@ interface NumberInputOptions {
|
|
32
32
|
* Render a custom decrement icon.
|
33
33
|
*/
|
34
34
|
decrementIcon?: React$1.ReactNode;
|
35
|
+
/**
|
36
|
+
* The placeholder text when no value is selected.
|
37
|
+
*/
|
38
|
+
placeholder?: string;
|
39
|
+
/**
|
40
|
+
* Props to pass to the NumberInputField component.
|
41
|
+
*/
|
42
|
+
fieldProps?: NumberInputFieldProps$1;
|
35
43
|
}
|
36
44
|
interface NumberInputProps extends NumberInputProps$1, NumberInputOptions {
|
37
45
|
}
|
@@ -100,6 +108,10 @@ interface SelectOptions {
|
|
100
108
|
|
101
109
|
interface SelectProps extends Omit<MenuProps, 'children' | 'variant' | 'size'>, ThemingProps<'SuiSelect'>, SelectOptions {
|
102
110
|
}
|
111
|
+
interface SelectButtonProps extends Omit<ButtonProps, 'size' | 'variant'> {
|
112
|
+
}
|
113
|
+
interface SelectListProps extends MenuListProps {
|
114
|
+
}
|
103
115
|
interface SelectOption extends Omit<MenuItemOptionProps, 'value'>, FieldOption {
|
104
116
|
}
|
105
117
|
/**
|
@@ -127,25 +139,29 @@ interface InputFieldProps extends InputProps {
|
|
127
139
|
interface NumberInputFieldProps extends NumberInputProps {
|
128
140
|
type: 'number';
|
129
141
|
}
|
142
|
+
interface SelectFieldProps extends SelectProps {
|
143
|
+
buttonProps?: SelectButtonProps;
|
144
|
+
listProps?: SelectListProps;
|
145
|
+
}
|
130
146
|
interface PinFieldProps extends Omit<UsePinInputProps, 'type'> {
|
131
147
|
pinLength?: number;
|
132
148
|
pinType?: 'alphanumeric' | 'number';
|
133
149
|
spacing?: SystemProps['margin'];
|
134
150
|
}
|
135
151
|
declare const defaultFieldTypes: {
|
136
|
-
text: React$1.FC<
|
137
|
-
email: React$1.FC<
|
138
|
-
url: React$1.FC<
|
139
|
-
phone: React$1.FC<
|
140
|
-
number: React$1.FC<
|
141
|
-
password: React$1.FC<
|
142
|
-
textarea: React$1.FC<
|
143
|
-
switch: React$1.FC<
|
144
|
-
select: React$1.FC<
|
145
|
-
checkbox: React$1.FC<
|
146
|
-
radio: React$1.FC<
|
147
|
-
pin: React$1.FC<
|
148
|
-
'native-select': React$1.FC<
|
152
|
+
text: React$1.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof InputFieldProps> & InputFieldProps>;
|
153
|
+
email: React$1.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof InputFieldProps> & InputFieldProps>;
|
154
|
+
url: React$1.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof InputFieldProps> & InputFieldProps>;
|
155
|
+
phone: React$1.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof InputFieldProps> & InputFieldProps>;
|
156
|
+
number: React$1.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof NumberInputFieldProps> & NumberInputFieldProps>;
|
157
|
+
password: React$1.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof PasswordInputProps> & PasswordInputProps>;
|
158
|
+
textarea: React$1.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof TextareaProps> & TextareaProps>;
|
159
|
+
switch: React$1.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof SwitchProps> & SwitchProps>;
|
160
|
+
select: React$1.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof SelectFieldProps> & SelectFieldProps>;
|
161
|
+
checkbox: React$1.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof CheckboxProps> & CheckboxProps>;
|
162
|
+
radio: React$1.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof RadioInputProps> & RadioInputProps>;
|
163
|
+
pin: React$1.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof PinFieldProps> & PinFieldProps>;
|
164
|
+
'native-select': React$1.FC<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof NativeSelectProps> & NativeSelectProps>;
|
149
165
|
};
|
150
166
|
type DefaultFields = typeof defaultFieldTypes;
|
151
167
|
|
@@ -237,7 +253,7 @@ type Split<S extends string, D extends string> = string extends S ? string[] : S
|
|
237
253
|
type MapPath<T extends string[]> = T extends [infer U, ...infer R] ? U extends string ? `${U extends `${number}` ? '$' : U}${R[0] extends string ? '.' : ''}${R extends string[] ? MapPath<R> : ''}` : '' : '';
|
238
254
|
type TransformPath<T extends string> = MapPath<Split<T, '.'>>;
|
239
255
|
type ArrayFieldPath<Name extends string> = Name extends string ? TransformPath<Name> : never;
|
240
|
-
interface BaseFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends Omit<FormControlProps, 'label' | 'type'> {
|
256
|
+
interface BaseFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends Omit<FormControlProps, 'label' | 'type' | 'onChange'> {
|
241
257
|
/**
|
242
258
|
* The field name
|
243
259
|
*/
|
@@ -394,10 +410,6 @@ interface FormStepProps<TName extends string = string> extends FormStepOptions<T
|
|
394
410
|
onSubmit?: FormStepSubmitHandler;
|
395
411
|
}
|
396
412
|
|
397
|
-
type Options = {
|
398
|
-
min?: number;
|
399
|
-
max?: number;
|
400
|
-
};
|
401
413
|
/**
|
402
414
|
* A helper function to render forms automatically based on a Yup schema
|
403
415
|
*
|
@@ -593,58 +605,58 @@ declare const StepForm: (<TSteps extends {
|
|
593
605
|
}[] ? any : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object : never : never : object) : object : object, TContext extends object = object>(props: Omit<UseStepFormProps<TSteps, TFieldValues, TContext>, "children" | "fields"> & {
|
594
606
|
children?: React$1.ReactNode | ((props: StepFormRenderContext<TSteps, TFieldValues, TContext, ({
|
595
607
|
type?: "number" | undefined;
|
596
|
-
} & Omit<
|
608
|
+
} & Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof NumberInputFieldProps> & NumberInputFieldProps, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
597
609
|
type?: "text" | undefined;
|
598
|
-
} & Omit<
|
610
|
+
} & Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof InputFieldProps> & InputFieldProps, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
599
611
|
type?: "email" | undefined;
|
600
|
-
} & Omit<
|
612
|
+
} & Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof InputFieldProps> & InputFieldProps, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
601
613
|
type?: "url" | undefined;
|
602
|
-
} & Omit<
|
614
|
+
} & Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof InputFieldProps> & InputFieldProps, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
603
615
|
type?: "phone" | undefined;
|
604
|
-
} & Omit<
|
616
|
+
} & Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof InputFieldProps> & InputFieldProps, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
605
617
|
type?: "password" | undefined;
|
606
|
-
} & Omit<
|
618
|
+
} & Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof PasswordInputProps> & PasswordInputProps, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
607
619
|
type?: "textarea" | undefined;
|
608
|
-
} & Omit<
|
620
|
+
} & Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof _chakra_ui_textarea_dist_textarea.TextareaProps> & _chakra_ui_textarea_dist_textarea.TextareaProps, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
609
621
|
type?: "switch" | undefined;
|
610
|
-
} & Omit<
|
622
|
+
} & Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof _chakra_ui_switch_dist_switch.SwitchProps> & _chakra_ui_switch_dist_switch.SwitchProps, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
611
623
|
type?: "select" | undefined;
|
612
|
-
} & Omit<
|
624
|
+
} & Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof SelectFieldProps> & SelectFieldProps, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
613
625
|
type?: "checkbox" | undefined;
|
614
|
-
} & Omit<
|
626
|
+
} & Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof _chakra_ui_checkbox_dist_checkbox.CheckboxProps> & _chakra_ui_checkbox_dist_checkbox.CheckboxProps, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
615
627
|
type?: "radio" | undefined;
|
616
|
-
} & Omit<
|
628
|
+
} & Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof RadioInputProps> & RadioInputProps, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
617
629
|
type?: "pin" | undefined;
|
618
|
-
} & Omit<
|
630
|
+
} & Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof PinFieldProps> & PinFieldProps, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>) | ({
|
619
631
|
type?: "native-select" | undefined;
|
620
|
-
} & Omit<
|
632
|
+
} & Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof NativeSelectProps> & NativeSelectProps, keyof BaseFieldProps<TFieldValues_1, TName>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>)>) => React$1.ReactNode);
|
621
633
|
fields?: ({ [K in react_hook_form.Path<TFieldValues> | (react_hook_form.Path<TFieldValues> extends infer T_20 ? T_20 extends react_hook_form.Path<TFieldValues> ? T_20 extends string ? (string extends T_20 ? (T_20 & string)[] : T_20 extends infer T_21 ? T_21 extends T_20 ? T_21 extends "" ? [] : T_21 extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...any] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [T_21] : never : never) extends infer T_23 ? T_23 extends (string extends T_20 ? (T_20 & string)[] : T_20 extends infer T_34 ? T_34 extends T_20 ? T_34 extends "" ? [] : T_34 extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...string extends U ? (U & string)[] : U extends "" ? [] : U extends `${infer T_22}.${infer U}` ? [T_22, ...any] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [U]] : [T_34] : never : never) ? T_23 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_24 ? T_24 extends R ? T_24 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_25 ? T_25 extends R ? T_25 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_26 ? T_26 extends R ? T_26 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_27 ? T_27 extends R ? T_27 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_28 ? T_28 extends R ? T_28 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_29 ? T_29 extends R ? T_29 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_30 ? T_30 extends R ? T_30 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_31 ? T_31 extends R ? T_31 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_32 ? T_32 extends R ? T_32 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? R extends infer T_33 ? T_33 extends R ? T_33 extends [infer U_1, ...infer R] ? U_1 extends string ? `${U_1 extends `${number}` ? "$" : U_1}${R[0] extends string ? "." : ""}${R extends string[] ? any : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : ""}` : "" : "" : never : never : never : never : never)]?: (({
|
622
634
|
type?: "number" | undefined;
|
623
|
-
} & Omit<Omit<
|
635
|
+
} & Omit<Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof NumberInputFieldProps> & NumberInputFieldProps, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
624
636
|
type?: "text" | undefined;
|
625
|
-
} & Omit<Omit<
|
637
|
+
} & Omit<Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof InputFieldProps> & InputFieldProps, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
626
638
|
type?: "email" | undefined;
|
627
|
-
} & Omit<Omit<
|
639
|
+
} & Omit<Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof InputFieldProps> & InputFieldProps, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
628
640
|
type?: "url" | undefined;
|
629
|
-
} & Omit<Omit<
|
641
|
+
} & Omit<Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof InputFieldProps> & InputFieldProps, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
630
642
|
type?: "phone" | undefined;
|
631
|
-
} & Omit<Omit<
|
643
|
+
} & Omit<Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof InputFieldProps> & InputFieldProps, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
632
644
|
type?: "password" | undefined;
|
633
|
-
} & Omit<Omit<
|
645
|
+
} & Omit<Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof PasswordInputProps> & PasswordInputProps, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
634
646
|
type?: "textarea" | undefined;
|
635
|
-
} & Omit<Omit<
|
647
|
+
} & Omit<Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof _chakra_ui_textarea_dist_textarea.TextareaProps> & _chakra_ui_textarea_dist_textarea.TextareaProps, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
636
648
|
type?: "switch" | undefined;
|
637
|
-
} & Omit<Omit<
|
649
|
+
} & Omit<Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof _chakra_ui_switch_dist_switch.SwitchProps> & _chakra_ui_switch_dist_switch.SwitchProps, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
638
650
|
type?: "select" | undefined;
|
639
|
-
} & Omit<Omit<
|
651
|
+
} & Omit<Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof SelectFieldProps> & SelectFieldProps, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
640
652
|
type?: "checkbox" | undefined;
|
641
|
-
} & Omit<Omit<
|
653
|
+
} & Omit<Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof _chakra_ui_checkbox_dist_checkbox.CheckboxProps> & _chakra_ui_checkbox_dist_checkbox.CheckboxProps, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
642
654
|
type?: "radio" | undefined;
|
643
|
-
} & Omit<Omit<
|
655
|
+
} & Omit<Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof RadioInputProps> & RadioInputProps, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
644
656
|
type?: "pin" | undefined;
|
645
|
-
} & Omit<Omit<
|
657
|
+
} & Omit<Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof PinFieldProps> & PinFieldProps, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">) | ({
|
646
658
|
type?: "native-select" | undefined;
|
647
|
-
} & Omit<Omit<
|
659
|
+
} & Omit<Omit<Omit<BaseFieldProps<react_hook_form.FieldValues, string>, keyof NativeSelectProps> & NativeSelectProps, keyof BaseFieldProps<TFieldValues_2, TName_1>> & BaseFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "name">)) | ({
|
648
660
|
type?: "object" | undefined;
|
649
661
|
} & Omit<ObjectFieldProps<TFieldValues, react_hook_form.Path<TFieldValues>>, "children" | "name">) | ({
|
650
662
|
type?: "array" | undefined;
|
@@ -662,4 +674,4 @@ declare const FormDialog: ZodFormType<unknown, object & Omit<_saas_ui_modals.Bas
|
|
662
674
|
cancel?: _chakra_ui_button_dist_button.ButtonProps | undefined;
|
663
675
|
}>;
|
664
676
|
|
665
|
-
export { Form, FormDialog,
|
677
|
+
export { Form, FormDialog, StepForm, ZodFormType, ZodMeta, createZodForm, createZodFormDialog, createZodStepForm, getFieldsFromSchema, getNestedSchema, zodFieldResolver, zodMeta, zodParseMeta };
|
package/dist/zod/index.js
CHANGED
@@ -51,6 +51,9 @@ module.exports = __toCommonJS(src_exports);
|
|
51
51
|
var import_zod = require("@hookform/resolvers/zod");
|
52
52
|
var import_utils = require("@chakra-ui/utils");
|
53
53
|
var getType = (field) => {
|
54
|
+
if (field._def.typeName === "ZodDefault") {
|
55
|
+
return getType(field._def.innerType);
|
56
|
+
}
|
54
57
|
switch (field._def.typeName) {
|
55
58
|
case "ZodArray":
|
56
59
|
return "array";
|
@@ -60,6 +63,8 @@ var getType = (field) => {
|
|
60
63
|
return "number";
|
61
64
|
case "ZodDate":
|
62
65
|
return "date";
|
66
|
+
case "ZodEnum":
|
67
|
+
return "select";
|
63
68
|
case "ZodString":
|
64
69
|
default:
|
65
70
|
return "text";
|
@@ -70,6 +75,7 @@ var getArrayOption = (field, name) => {
|
|
70
75
|
return (_a = field._def[name]) == null ? void 0 : _a.value;
|
71
76
|
};
|
72
77
|
var getFieldsFromSchema = (schema) => {
|
78
|
+
var _a, _b;
|
73
79
|
const fields = [];
|
74
80
|
let schemaFields = {};
|
75
81
|
if (schema._def.typeName === "ZodArray") {
|
@@ -81,17 +87,23 @@ var getFieldsFromSchema = (schema) => {
|
|
81
87
|
}
|
82
88
|
for (const name in schemaFields) {
|
83
89
|
const field = schemaFields[name];
|
84
|
-
const
|
85
|
-
|
86
|
-
|
87
|
-
|
90
|
+
const def = field._def.typeName === "ZodDefault" ? field._def.innerType._def : field._def;
|
91
|
+
const props = {};
|
92
|
+
if (def.typeName === "ZodArray") {
|
93
|
+
props.min = getArrayOption(field, "minLength");
|
94
|
+
props.max = getArrayOption(field, "maxLength");
|
95
|
+
} else if (def.typeName === "ZodEnum") {
|
96
|
+
props.options = def.values.map((value) => {
|
97
|
+
return { label: value, value };
|
98
|
+
});
|
88
99
|
}
|
89
100
|
const meta = field.description && zodParseMeta(field.description);
|
90
101
|
fields.push({
|
91
102
|
name,
|
92
103
|
label: (meta == null ? void 0 : meta.label) || field.description || name,
|
93
104
|
type: (meta == null ? void 0 : meta.type) || getType(field),
|
94
|
-
|
105
|
+
defaultValue: (_b = (_a = field._def).defaultValue) == null ? void 0 : _b.call(_a),
|
106
|
+
...props
|
95
107
|
});
|
96
108
|
}
|
97
109
|
return fields;
|