@saas-ui/forms 2.3.4 → 2.3.5

Sign up to get free protection for your applications and to get access to all the features.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,20 @@
1
1
  # @saas-ui/forms
2
2
 
3
+ ## 2.3.5
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies [8782a76b]
8
+ - Updated dependencies [8782a76b]
9
+ - Updated dependencies [8782a76b]
10
+ - Updated dependencies [8782a76b]
11
+ - Updated dependencies [8782a76b]
12
+ - Updated dependencies [8782a76b]
13
+ - Updated dependencies [78bc41d0]
14
+ - Updated dependencies [8782a76b]
15
+ - Updated dependencies [8782a76b]
16
+ - @saas-ui/core@2.3.0
17
+
3
18
  ## 2.3.4
4
19
 
5
20
  ### Patch Changes
@@ -1 +1 @@
1
- {"version":3,"sources":["../../yup/src/index.ts","../../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"],"sourcesContent":["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","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"],"mappings":"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","names":["Form","FormDialog","import_yup","import_forms","React","import_react","import_jsx_runtime","import_utils","import_forms","import_jsx_runtime","React2","jsxs","ChakraModal","jsx","runIfFn","jsxs","jsx","ModalFooter","Form","forwardRef","ModalBody","runIfFn","Button","Form","Form","FormDialog"]}
1
+ {"version":3,"sources":["../../yup/src/index.ts","../../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"],"sourcesContent":["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","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 = modal && 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"],"mappings":"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","names":["Form","FormDialog","import_yup","import_forms","React","import_react","import_jsx_runtime","import_utils","import_forms","import_jsx_runtime","React2","jsxs","ChakraModal","jsx","runIfFn","jsxs","jsx","ModalFooter","Form","forwardRef","ModalBody","runIfFn","Button","Form","Form","FormDialog"]}
@@ -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 // @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"]}
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 = modal && 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 +1 @@
1
- {"version":3,"sources":["../../zod/src/index.ts","../../zod/src/zod-resolver.ts","../../zod/src/create-zod-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","../../zod/src/create-zod-dialog.ts","../../zod/src/create-zod-step-form.ts"],"sourcesContent":["export {\n zodResolver,\n getFieldsFromSchema,\n getNestedSchema,\n zodFieldResolver,\n zodMeta,\n zodParseMeta,\n} from './zod-resolver'\nexport type { ZodMeta } from './zod-resolver'\nexport { createZodForm, type ZodFormType } from './create-zod-form'\nexport { createZodFormDialog } from './create-zod-dialog'\nexport { createZodStepForm } from './create-zod-step-form'\n\nimport { createZodForm } from './create-zod-form'\nimport { createZodStepForm } from './create-zod-step-form'\nimport { createZodFormDialog } from './create-zod-dialog'\n\nexport const Form = createZodForm()\n\nexport const StepForm = createZodStepForm()\n\nexport const FormDialog = createZodFormDialog(Form)\n","import * as z from 'zod'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { get } from '@chakra-ui/utils'\nimport { FieldProps } from '@saas-ui/forms'\n\nexport { zodResolver }\n\nexport type ExtraProps = {\n min?: number\n max?: number\n options?: { label: string; value: string }[]\n}\n\nconst getType = (\n field: z.ZodTypeAny\n): 'array' | 'object' | 'number' | 'date' | 'select' | 'text' => {\n if (field._def.typeName === 'ZodDefault') {\n return getType(field._def.innerType)\n }\n\n switch (field._def.typeName) {\n case 'ZodArray':\n return 'array'\n case 'ZodObject':\n return 'object'\n case 'ZodNumber':\n return 'number'\n case 'ZodDate':\n return 'date'\n case 'ZodEnum':\n return 'select'\n case 'ZodString':\n default:\n return 'text'\n }\n}\n\nconst getArrayOption = (field: any, name: string) => {\n return field._def[name]?.value\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: z.ZodTypeAny): FieldProps[] => {\n const fields: FieldProps[] = []\n\n let schemaFields: Record<string, any> = {}\n if (schema._def.typeName === 'ZodArray') {\n schemaFields = schema._def.type.shape\n } else if (schema._def.typeName === 'ZodObject') {\n schemaFields = schema._def.shape()\n } else {\n return fields\n }\n\n for (const name in schemaFields) {\n const field = schemaFields[name]\n\n const def =\n field._def.typeName === 'ZodDefault'\n ? field._def.innerType._def\n : field._def\n\n const props: ExtraProps = {}\n if (def.typeName === 'ZodArray') {\n props.min = getArrayOption(field, 'minLength')\n props.max = getArrayOption(field, 'maxLength')\n } else if (def.typeName === 'ZodEnum') {\n props.options = def.values.map((value: string) => {\n return { label: value, value }\n })\n }\n\n const meta = field.description && zodParseMeta(field.description)\n\n fields.push({\n name,\n label: meta?.label || field.description || name,\n type: meta?.type || getType(field),\n defaultValue: field._def.defaultValue?.(),\n ...props,\n })\n }\n return fields\n}\n\nexport const getNestedSchema = (schema: z.ZodTypeAny, path: string) => {\n return get(schema._def.shape(), path)\n}\n\nexport const zodFieldResolver = <T extends z.ZodTypeAny>(schema: T) => {\n return {\n getFields() {\n return getFieldsFromSchema(schema)\n },\n getNestedFields(name: string) {\n return getFieldsFromSchema(getNestedSchema(schema, name))\n },\n }\n}\n\nexport interface ZodMeta {\n /**\n * The label of the field\n */\n label: string\n /**\n * The type of the field\n */\n type?: string\n /**\n * Object field column count\n */\n columns?: number\n /**\n * Array field min rows\n */\n min?: number\n /**\n * Array field max rows\n */\n max?: number\n [key: string]: any\n}\n\nexport const zodMeta = (meta: ZodMeta) => {\n return JSON.stringify(meta)\n}\n\nexport const zodParseMeta = (meta: string) => {\n try {\n return JSON.parse(meta)\n } catch (e) {\n return meta\n }\n}\n","import {\n createForm,\n CreateFormProps,\n WithFields,\n FormProps,\n} from '@saas-ui/forms'\nimport { zodFieldResolver, zodResolver } from './zod-resolver'\nimport { z } from 'zod'\n\ntype ResolverArgs = Parameters<typeof zodResolver>\n\nexport interface CreateZodFormProps<FieldDefs>\n extends CreateFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\nexport type ZodFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object,\n Type extends 'zod' = 'zod'\n> = (<\n TSchema extends z.AnyZodObject = z.AnyZodObject,\n TFieldValues extends z.infer<TSchema> = z.infer<TSchema>,\n TContext extends object = object\n>(\n props: WithFields<\n FormProps<TSchema, TFieldValues, TContext>,\n FieldDefs,\n ExtraOverrides\n > & {\n ref?: React.ForwardedRef<HTMLFormElement>\n } & ExtraProps\n) => React.ReactElement) & {\n displayName?: string\n id?: string\n}\n\nexport const createZodForm = <FieldDefs>(\n options?: CreateZodFormProps<FieldDefs>\n) => {\n const ZodForm = createForm({\n resolver: (schema: any) =>\n zodResolver(schema, options?.schemaOptions, options?.resolverOptions),\n fieldResolver: zodFieldResolver,\n ...options,\n })\n\n ZodForm.displayName = 'ZodForm'\n ZodForm.id = 'ZodForm'\n\n return ZodForm as ZodFormType<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 createFormDialog,\n BaseModalProps,\n FormDialogFieldOverrides,\n} from '@saas-ui/modals'\nimport { ZodFormType } from './create-zod-form'\n\nexport function createZodFormDialog<\n FieldDefs = any,\n ExtraProps = object,\n ExtraOverrides = object\n>(Form: ZodFormType<FieldDefs, ExtraProps, ExtraOverrides>) {\n return createFormDialog(Form) as unknown as ZodFormType<\n FieldDefs,\n ExtraProps & Omit<BaseModalProps, 'children'>,\n ExtraOverrides & FormDialogFieldOverrides\n >\n}\n","import {\n CreateStepFormProps,\n createStepForm,\n StepsOptions,\n UseStepFormProps,\n WithStepFields,\n} from '@saas-ui/forms'\nimport { zodFieldResolver, zodResolver } from './zod-resolver'\nimport { AnyZodObject, z } from 'zod'\nimport React from 'react'\n\ntype ResolverArgs = Parameters<typeof zodResolver>\n\nexport interface CreateZodStepFormProps<FieldDefs>\n extends CreateStepFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\ntype InferStepType<T extends Required<StepsOptions<AnyZodObject>>> = T extends [\n infer Step,\n ...infer Rest\n]\n ? Step extends { schema: AnyZodObject }\n ? z.infer<Step['schema']> &\n (Rest extends Required<StepsOptions<AnyZodObject>>\n ? InferStepType<Rest>\n : object)\n : object\n : object\n\ntype ZodStepFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object\n> = (<\n TSteps extends Required<StepsOptions<AnyZodObject>> = Required<\n StepsOptions<AnyZodObject>\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 createZodStepForm = <FieldDefs>(\n options?: CreateZodStepFormProps<FieldDefs>\n) => {\n const ZodStepForm = createStepForm<any, any, any>({\n resolver: (schema: any) =>\n zodResolver(schema, options?.schemaOptions, options?.resolverOptions),\n fieldResolver: zodFieldResolver,\n ...options,\n })\n\n ZodStepForm.displayName = 'ZodStepForm'\n ZodStepForm.id = 'ZodStepForm'\n\n return ZodStepForm as ZodStepFormType<FieldDefs>\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,cAAAA;AAAA,EAAA,kBAAAC;AAAA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACCA,iBAA4B;AAC5B,mBAAoB;AAWpB,IAAM,UAAU,CACd,UAC+D;AAC/D,MAAI,MAAM,KAAK,aAAa,cAAc;AACxC,WAAO,QAAQ,MAAM,KAAK,SAAS;AAAA,EACrC;AAEA,UAAQ,MAAM,KAAK,UAAU;AAAA,IAC3B,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL;AACE,aAAO;AAAA,EACX;AACF;AAEA,IAAM,iBAAiB,CAAC,OAAY,SAAiB;AArCrD;AAsCE,UAAO,WAAM,KAAK,IAAI,MAAf,mBAAkB;AAC3B;AAQO,IAAM,sBAAsB,CAAC,WAAuC;AA/C3E;AAgDE,QAAM,SAAuB,CAAC;AAE9B,MAAI,eAAoC,CAAC;AACzC,MAAI,OAAO,KAAK,aAAa,YAAY;AACvC,mBAAe,OAAO,KAAK,KAAK;AAAA,EAClC,WAAW,OAAO,KAAK,aAAa,aAAa;AAC/C,mBAAe,OAAO,KAAK,MAAM;AAAA,EACnC,OAAO;AACL,WAAO;AAAA,EACT;AAEA,aAAW,QAAQ,cAAc;AAC/B,UAAM,QAAQ,aAAa,IAAI;AAE/B,UAAM,MACJ,MAAM,KAAK,aAAa,eACpB,MAAM,KAAK,UAAU,OACrB,MAAM;AAEZ,UAAM,QAAoB,CAAC;AAC3B,QAAI,IAAI,aAAa,YAAY;AAC/B,YAAM,MAAM,eAAe,OAAO,WAAW;AAC7C,YAAM,MAAM,eAAe,OAAO,WAAW;AAAA,IAC/C,WAAW,IAAI,aAAa,WAAW;AACrC,YAAM,UAAU,IAAI,OAAO,IAAI,CAAC,UAAkB;AAChD,eAAO,EAAE,OAAO,OAAO,MAAM;AAAA,MAC/B,CAAC;AAAA,IACH;AAEA,UAAM,OAAO,MAAM,eAAe,aAAa,MAAM,WAAW;AAEhE,WAAO,KAAK;AAAA,MACV;AAAA,MACA,QAAO,6BAAM,UAAS,MAAM,eAAe;AAAA,MAC3C,OAAM,6BAAM,SAAQ,QAAQ,KAAK;AAAA,MACjC,eAAc,iBAAM,MAAK,iBAAX;AAAA,MACd,GAAG;AAAA,IACL,CAAC;AAAA,EACH;AACA,SAAO;AACT;AAEO,IAAM,kBAAkB,CAAC,QAAsB,SAAiB;AACrE,aAAO,kBAAI,OAAO,KAAK,MAAM,GAAG,IAAI;AACtC;AAEO,IAAM,mBAAmB,CAAyB,WAAc;AACrE,SAAO;AAAA,IACL,YAAY;AACV,aAAO,oBAAoB,MAAM;AAAA,IACnC;AAAA,IACA,gBAAgB,MAAc;AAC5B,aAAO,oBAAoB,gBAAgB,QAAQ,IAAI,CAAC;AAAA,IAC1D;AAAA,EACF;AACF;AA0BO,IAAM,UAAU,CAAC,SAAkB;AACxC,SAAO,KAAK,UAAU,IAAI;AAC5B;AAEO,IAAM,eAAe,CAAC,SAAiB;AAC5C,MAAI;AACF,WAAO,KAAK,MAAM,IAAI;AAAA,EACxB,SAAS,GAAP;AACA,WAAO;AAAA,EACT;AACF;;;AC3IA,mBAKO;AAkCA,IAAM,gBAAgB,CAC3B,YACG;AACH,QAAM,cAAU,yBAAW;AAAA,IACzB,UAAU,CAAC,eACT,wBAAY,QAAQ,mCAAS,eAAe,mCAAS,eAAe;AAAA,IACtE,eAAe;AAAA,IACf,GAAG;AAAA,EACL,CAAC;AAED,UAAQ,cAAc;AACtB,UAAQ,KAAK;AAEb,SAAO;AACT;;;ACrDA,IAAAC,SAAuB;AAEvB,IAAAC,gBAYO;AAyGG,yBAAA;ACrHV,IAAAA,gBAYO;AAEP,IAAAC,gBAAwB;AAwDD,IAAAC,sBAAA;ACtEvB,IAAAF,gBAYO;AAEP,IAAAC,gBAAwB;AAwDD,IAAAC,sBAAA;ACtEvB,IAAAF,gBAWO;AAiBH,IAAAE,sBAAA;AC5BJ,IAAAF,gBAMO;;;;;;;;;;;mBMJL;;AFJF,SAAA,eAAuB,UAAA,MAAA;AAOhB,SAAS,eACd,QAAA,QAEA,EAAA;IACA,CAAA,SAAc,KAAA,SAAS;EAA2C;AACxC;ACZ5B,SAAA,kBAAuB,UAAA,MAAA;AAOhB,SAAS,gBAAA,QACd,QACA,EACA;IACA,CAAA,SAAc,MAAA,QAAS,IAAA,IAAQ,KAAQ,KAA2B,CAAA,cAAA,cAAA,KAAA,IAAA,IAAA,KAAA,SAAA;EAAA;AAI5C;ACXtB,IAAA,YACK,CAAA,SAAA,YAAA;AAEP,MAAM,MAAA,QAAa,OAAc;AAC/B,WAAI;WAA+B,OAAA,YAAA;AAAA,WAC1B,WAAO,OAAA,SAAY,QAAA,OAAA;AAAU,MAAA,WAAO;AAC7C,WAAI,CAAA,OAAW;AAAM,SAAA,CAAA;AACrB;AACF,IAAA,qBAAA,CAAA,OAAA,YAAA;AAEO,MAAM;AAdb,QAAA,YAAA,uBAAA;AAkBE,QAAM,aAAQ,UAAS,QAAA,KAAA,MAAA,kBAAA,OAAA,SAAA,GAAA,YAAA;AACvB,aAAM,iCAAa,YAAiB,OAAA;AACpC;;;ANTF,IAAAG,gBAUO;AAyJK,IAAAC,sBAAA;AC9KZ,IAAAC,UAAuB;AAoUb,IAAAD,sBAAA;AE9SC,IAAAA,sBAAA;ALkCJ,IAAM,YAAsC,CAAC,UAAU;AAC5D,QAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA,GAAG;EACL,IAAI;AACJ,SACEE,wCAAAA,MAAC,cAAAC,OAAA,EAAY,QAAgB,SAAmB,GAAG,MAChD,UAAA;IAAA,CAAC,eAAeC,wCAAAA,KAAC,4BAAA,CAAA,CAAa;IAC/BF,wCAAAA,MAAC,4BAAA,EAAc,GAAG,cACf,UAAA;MAAA,SAASE,wCAAAA,KAAC,2BAAA,EAAa,GAAG,aAAc,UAAA,MAAA,CAAM;MAC9C,CAAC,mBAAmBA,wCAAAA,KAAC,gCAAA,CAAA,CAAiB;UACtCC,cAAAA,SAAQ,UAAU;QACjB;QACA;MACF,CAAC;MACA,UAAUD,wCAAAA,KAAC,2BAAA,EAAa,GAAG,aAAc,UAAA,OAAA,CAAO;IAAA,EAAA,CACnD;EAAA,EAAA,CACF;AAEJ;ACnEA,IAAM,CAAC,cAAc,QAAI,mCAAoB,eAAe;AAiCrD,IAAM,qBAAiB;EAC5B,CAAC,OAAO,iBAAiB;AACvB,UAAM;MACJ;MACA;MACA;MACA;MACA;MACA,eAAe;MACf,YAAY;MACZ,GAAG;IACL,IAAI;AAEJ,UAAM,EAAE,QAAQ,SAAS,QAAQ,QAAI,8BAAe;AAEpD,UAAM,EAAE,KAAK,GAAG,SAAS,QAAI,2BAAY,MAAM,YAAY;AAE3D,UAAM,aAAS,mCAAoB,QAAQ,KAAK;AAEhD,UAAM,iBAAa,kCAAmB,EAAE,MAAM,MAAM,IAAI,MAAM,CAAC;AAE/D,WACEE,wCAAAA;MAAC;MAAA;QACC;QACA;QACA,iBAAiB,mBAAmB;QACpC;QACA;QACA;QACA,YAAY,kBAAA,OAAA,iBAAkB;QAC9B,cAAc,EAAE,IAAI,EAAE;QAGtB,UAAA;UAAAC,wCAAAA,KAAC,gBAAA,EAAe,OAAO,QACrB,UAAAA,wCAAAA;YAAC,qBAAO;YAAP;cACE,GAAG;cACJ;cACA,OAAO;gBACL,SAAS;gBACT,WAAW;;gBACX,WAAW;;gBACX,GAAG,OAAO;gBACV,WAAW;gBACX,QAAQ;gBACR,OAAO;;kBAEL,GAAI,OAAO,KAAK,SAAS,CAAC;kBAC1B,WAAW;gBACb;cACF;YAAA;UACF,EAAA,CACF;UACC,UAAUA,wCAAAA,KAACC,cAAAA,aAAA,EAAa,UAAA,OAAA,CAAO;QAAA;MAAA;IAClC;EAEJ;AACF;ACnCA,IAAM,eAAe,CAAC,UAA2B;AAC/C,QAAM;IACJ;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA,mBAAmB;IACnB;IACA;IACA;IACA,aAAa;IACb;IACA;IACA,GAAG;EACL,IAAI;AAEJ,QAAM,YAAY;IAChB;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;EACF;AAEA,SAAO,EAAE,YAAY,WAAW,OAAO;AACzC;AA0CO,SAAS,iBASdC,QAAiB;AACjB,QAAM,aAASC,cAAAA,YAAuB,CAAC,OAAO,QAAQ;AACpD,UAAM,EAAE,QAAQ,SAAS,QAAQ,UAAU,GAAG,KAAK,IAAI;AACvD,UAAM,EAAE,YAAY,WAAW,OAAO,IAAI,aAAa,IAAI;AAC3D,WACEH,wCAAAA,KAAC,WAAA,EAAW,GAAG,YAAY,QAAgB,SACzC,UAAAA,wCAAAA,KAACE,QAAA,EAAK,KAAW,GAAI,WAClB,UAAA,CAAC,SAAW;AA7KvB,UAAA,IAAA;AA8KY,aAAAH,wCAAAA,MAAA,8BAAA,EACE,UAAA;QAAAC,wCAAAA,KAACI,cAAAA,WAAA,EAAW,cAAAC,aAAAA,SAAQ,UAAU,IAAI,KAAKL,wCAAAA,KAAC,0BAAA,CAAA,CAAW,EAAA,CAAG;QAErD,UACCD,wCAAAA,MAACE,cAAAA,aAAA,EACC,UAAA;UAAAD,wCAAAA;YAACM,cAAAA;YAAA;cACC,SAAQ;cACR,IAAI;cACJ,SAAS;cACR,GAAG,UAAA,OAAA,SAAA,OAAQ;cAEX,WAAA,MAAA,KAAA,UAAA,OAAA,SAAA,OAAQ,WAAR,OAAA,SAAA,GAAgB,aAAhB,OAAA,KAA4B;YAAA;UAC/B;UACAN,wCAAAA,KAAC,4BAAA,EAAc,GAAG,UAAA,OAAA,SAAA,OAAQ,OAAA,CAAQ;QAAA,EAAA,CACpC;MAAA,EAAA,CAEJ;IAAA,EAAA,CAEJ,EAAA,CACF;EAEJ,CAAC;AAED,SAAO,cAAc,GAAGE,OAAK,eAAeA,OAAK;AACjD,SAAO,KAAKA,OAAK;AAEjB,SAAO;AACT;AAOO,IAAM,aAAa,iBAAiB,kBAAI;AC1KxC,IAAM,gBAAsB,sBAEzB,IAAI;;;AOjCP,SAAS,oBAIdK,OAA0D;AAC1D,SAAO,iBAAiBA,KAAI;AAK9B;;;ACjBA,IAAAC,gBAMO;AAiDA,IAAM,oBAAoB,CAC/B,YACG;AACH,QAAM,kBAAc,8BAA8B;AAAA,IAChD,UAAU,CAAC,eACT,wBAAY,QAAQ,mCAAS,eAAe,mCAAS,eAAe;AAAA,IACtE,eAAe;AAAA,IACf,GAAG;AAAA,EACL,CAAC;AAED,cAAY,cAAc;AAC1B,cAAY,KAAK;AAEjB,SAAO;AACT;;;AhBpDO,IAAMC,QAAO,cAAc;AAE3B,IAAM,WAAW,kBAAkB;AAEnC,IAAMC,cAAa,oBAAoBD,KAAI;","names":["Form","FormDialog","React","import_react","import_utils","import_jsx_runtime","import_forms","import_jsx_runtime","React2","jsxs","ChakraModal","jsx","runIfFn","jsxs","jsx","ModalFooter","Form","forwardRef","ModalBody","runIfFn","Button","Form","import_forms","Form","FormDialog"]}
1
+ {"version":3,"sources":["../../zod/src/index.ts","../../zod/src/zod-resolver.ts","../../zod/src/create-zod-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","../../zod/src/create-zod-dialog.ts","../../zod/src/create-zod-step-form.ts"],"sourcesContent":["export {\n zodResolver,\n getFieldsFromSchema,\n getNestedSchema,\n zodFieldResolver,\n zodMeta,\n zodParseMeta,\n} from './zod-resolver'\nexport type { ZodMeta } from './zod-resolver'\nexport { createZodForm, type ZodFormType } from './create-zod-form'\nexport { createZodFormDialog } from './create-zod-dialog'\nexport { createZodStepForm } from './create-zod-step-form'\n\nimport { createZodForm } from './create-zod-form'\nimport { createZodStepForm } from './create-zod-step-form'\nimport { createZodFormDialog } from './create-zod-dialog'\n\nexport const Form = createZodForm()\n\nexport const StepForm = createZodStepForm()\n\nexport const FormDialog = createZodFormDialog(Form)\n","import * as z from 'zod'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { get } from '@chakra-ui/utils'\nimport { FieldProps } from '@saas-ui/forms'\n\nexport { zodResolver }\n\nexport type ExtraProps = {\n min?: number\n max?: number\n options?: { label: string; value: string }[]\n}\n\nconst getType = (\n field: z.ZodTypeAny\n): 'array' | 'object' | 'number' | 'date' | 'select' | 'text' => {\n if (field._def.typeName === 'ZodDefault') {\n return getType(field._def.innerType)\n }\n\n switch (field._def.typeName) {\n case 'ZodArray':\n return 'array'\n case 'ZodObject':\n return 'object'\n case 'ZodNumber':\n return 'number'\n case 'ZodDate':\n return 'date'\n case 'ZodEnum':\n return 'select'\n case 'ZodString':\n default:\n return 'text'\n }\n}\n\nconst getArrayOption = (field: any, name: string) => {\n return field._def[name]?.value\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: z.ZodTypeAny): FieldProps[] => {\n const fields: FieldProps[] = []\n\n let schemaFields: Record<string, any> = {}\n if (schema._def.typeName === 'ZodArray') {\n schemaFields = schema._def.type.shape\n } else if (schema._def.typeName === 'ZodObject') {\n schemaFields = schema._def.shape()\n } else {\n return fields\n }\n\n for (const name in schemaFields) {\n const field = schemaFields[name]\n\n const def =\n field._def.typeName === 'ZodDefault'\n ? field._def.innerType._def\n : field._def\n\n const props: ExtraProps = {}\n if (def.typeName === 'ZodArray') {\n props.min = getArrayOption(field, 'minLength')\n props.max = getArrayOption(field, 'maxLength')\n } else if (def.typeName === 'ZodEnum') {\n props.options = def.values.map((value: string) => {\n return { label: value, value }\n })\n }\n\n const meta = field.description && zodParseMeta(field.description)\n\n fields.push({\n name,\n label: meta?.label || field.description || name,\n type: meta?.type || getType(field),\n defaultValue: field._def.defaultValue?.(),\n ...props,\n })\n }\n return fields\n}\n\nexport const getNestedSchema = (schema: z.ZodTypeAny, path: string) => {\n return get(schema._def.shape(), path)\n}\n\nexport const zodFieldResolver = <T extends z.ZodTypeAny>(schema: T) => {\n return {\n getFields() {\n return getFieldsFromSchema(schema)\n },\n getNestedFields(name: string) {\n return getFieldsFromSchema(getNestedSchema(schema, name))\n },\n }\n}\n\nexport interface ZodMeta {\n /**\n * The label of the field\n */\n label: string\n /**\n * The type of the field\n */\n type?: string\n /**\n * Object field column count\n */\n columns?: number\n /**\n * Array field min rows\n */\n min?: number\n /**\n * Array field max rows\n */\n max?: number\n [key: string]: any\n}\n\nexport const zodMeta = (meta: ZodMeta) => {\n return JSON.stringify(meta)\n}\n\nexport const zodParseMeta = (meta: string) => {\n try {\n return JSON.parse(meta)\n } catch (e) {\n return meta\n }\n}\n","import {\n createForm,\n CreateFormProps,\n WithFields,\n FormProps,\n} from '@saas-ui/forms'\nimport { zodFieldResolver, zodResolver } from './zod-resolver'\nimport { z } from 'zod'\n\ntype ResolverArgs = Parameters<typeof zodResolver>\n\nexport interface CreateZodFormProps<FieldDefs>\n extends CreateFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\nexport type ZodFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object,\n Type extends 'zod' = 'zod'\n> = (<\n TSchema extends z.AnyZodObject = z.AnyZodObject,\n TFieldValues extends z.infer<TSchema> = z.infer<TSchema>,\n TContext extends object = object\n>(\n props: WithFields<\n FormProps<TSchema, TFieldValues, TContext>,\n FieldDefs,\n ExtraOverrides\n > & {\n ref?: React.ForwardedRef<HTMLFormElement>\n } & ExtraProps\n) => React.ReactElement) & {\n displayName?: string\n id?: string\n}\n\nexport const createZodForm = <FieldDefs>(\n options?: CreateZodFormProps<FieldDefs>\n) => {\n const ZodForm = createForm({\n resolver: (schema: any) =>\n zodResolver(schema, options?.schemaOptions, options?.resolverOptions),\n fieldResolver: zodFieldResolver,\n ...options,\n })\n\n ZodForm.displayName = 'ZodForm'\n ZodForm.id = 'ZodForm'\n\n return ZodForm as ZodFormType<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 = modal && 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 createFormDialog,\n BaseModalProps,\n FormDialogFieldOverrides,\n} from '@saas-ui/modals'\nimport { ZodFormType } from './create-zod-form'\n\nexport function createZodFormDialog<\n FieldDefs = any,\n ExtraProps = object,\n ExtraOverrides = object\n>(Form: ZodFormType<FieldDefs, ExtraProps, ExtraOverrides>) {\n return createFormDialog(Form) as unknown as ZodFormType<\n FieldDefs,\n ExtraProps & Omit<BaseModalProps, 'children'>,\n ExtraOverrides & FormDialogFieldOverrides\n >\n}\n","import {\n CreateStepFormProps,\n createStepForm,\n StepsOptions,\n UseStepFormProps,\n WithStepFields,\n} from '@saas-ui/forms'\nimport { zodFieldResolver, zodResolver } from './zod-resolver'\nimport { AnyZodObject, z } from 'zod'\nimport React from 'react'\n\ntype ResolverArgs = Parameters<typeof zodResolver>\n\nexport interface CreateZodStepFormProps<FieldDefs>\n extends CreateStepFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\ntype InferStepType<T extends Required<StepsOptions<AnyZodObject>>> = T extends [\n infer Step,\n ...infer Rest\n]\n ? Step extends { schema: AnyZodObject }\n ? z.infer<Step['schema']> &\n (Rest extends Required<StepsOptions<AnyZodObject>>\n ? InferStepType<Rest>\n : object)\n : object\n : object\n\ntype ZodStepFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object\n> = (<\n TSteps extends Required<StepsOptions<AnyZodObject>> = Required<\n StepsOptions<AnyZodObject>\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 createZodStepForm = <FieldDefs>(\n options?: CreateZodStepFormProps<FieldDefs>\n) => {\n const ZodStepForm = createStepForm<any, any, any>({\n resolver: (schema: any) =>\n zodResolver(schema, options?.schemaOptions, options?.resolverOptions),\n fieldResolver: zodFieldResolver,\n ...options,\n })\n\n ZodStepForm.displayName = 'ZodStepForm'\n ZodStepForm.id = 'ZodStepForm'\n\n return ZodStepForm as ZodStepFormType<FieldDefs>\n}\n"],"mappings":"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","names":["Form","FormDialog","React","import_react","import_utils","import_jsx_runtime","import_forms","import_jsx_runtime","React2","jsxs","ChakraModal","jsx","runIfFn","jsxs","jsx","ModalFooter","Form","forwardRef","ModalBody","runIfFn","Button","Form","import_forms","Form","FormDialog"]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../zod/src/zod-resolver.ts","../../zod/src/create-zod-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","../../zod/src/create-zod-dialog.ts","../../zod/src/create-zod-step-form.ts","../../zod/src/index.ts"],"sourcesContent":["import * as z from 'zod'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { get } from '@chakra-ui/utils'\nimport { FieldProps } from '@saas-ui/forms'\n\nexport { zodResolver }\n\nexport type ExtraProps = {\n min?: number\n max?: number\n options?: { label: string; value: string }[]\n}\n\nconst getType = (\n field: z.ZodTypeAny\n): 'array' | 'object' | 'number' | 'date' | 'select' | 'text' => {\n if (field._def.typeName === 'ZodDefault') {\n return getType(field._def.innerType)\n }\n\n switch (field._def.typeName) {\n case 'ZodArray':\n return 'array'\n case 'ZodObject':\n return 'object'\n case 'ZodNumber':\n return 'number'\n case 'ZodDate':\n return 'date'\n case 'ZodEnum':\n return 'select'\n case 'ZodString':\n default:\n return 'text'\n }\n}\n\nconst getArrayOption = (field: any, name: string) => {\n return field._def[name]?.value\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: z.ZodTypeAny): FieldProps[] => {\n const fields: FieldProps[] = []\n\n let schemaFields: Record<string, any> = {}\n if (schema._def.typeName === 'ZodArray') {\n schemaFields = schema._def.type.shape\n } else if (schema._def.typeName === 'ZodObject') {\n schemaFields = schema._def.shape()\n } else {\n return fields\n }\n\n for (const name in schemaFields) {\n const field = schemaFields[name]\n\n const def =\n field._def.typeName === 'ZodDefault'\n ? field._def.innerType._def\n : field._def\n\n const props: ExtraProps = {}\n if (def.typeName === 'ZodArray') {\n props.min = getArrayOption(field, 'minLength')\n props.max = getArrayOption(field, 'maxLength')\n } else if (def.typeName === 'ZodEnum') {\n props.options = def.values.map((value: string) => {\n return { label: value, value }\n })\n }\n\n const meta = field.description && zodParseMeta(field.description)\n\n fields.push({\n name,\n label: meta?.label || field.description || name,\n type: meta?.type || getType(field),\n defaultValue: field._def.defaultValue?.(),\n ...props,\n })\n }\n return fields\n}\n\nexport const getNestedSchema = (schema: z.ZodTypeAny, path: string) => {\n return get(schema._def.shape(), path)\n}\n\nexport const zodFieldResolver = <T extends z.ZodTypeAny>(schema: T) => {\n return {\n getFields() {\n return getFieldsFromSchema(schema)\n },\n getNestedFields(name: string) {\n return getFieldsFromSchema(getNestedSchema(schema, name))\n },\n }\n}\n\nexport interface ZodMeta {\n /**\n * The label of the field\n */\n label: string\n /**\n * The type of the field\n */\n type?: string\n /**\n * Object field column count\n */\n columns?: number\n /**\n * Array field min rows\n */\n min?: number\n /**\n * Array field max rows\n */\n max?: number\n [key: string]: any\n}\n\nexport const zodMeta = (meta: ZodMeta) => {\n return JSON.stringify(meta)\n}\n\nexport const zodParseMeta = (meta: string) => {\n try {\n return JSON.parse(meta)\n } catch (e) {\n return meta\n }\n}\n","import {\n createForm,\n CreateFormProps,\n WithFields,\n FormProps,\n} from '@saas-ui/forms'\nimport { zodFieldResolver, zodResolver } from './zod-resolver'\nimport { z } from 'zod'\n\ntype ResolverArgs = Parameters<typeof zodResolver>\n\nexport interface CreateZodFormProps<FieldDefs>\n extends CreateFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\nexport type ZodFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object,\n Type extends 'zod' = 'zod'\n> = (<\n TSchema extends z.AnyZodObject = z.AnyZodObject,\n TFieldValues extends z.infer<TSchema> = z.infer<TSchema>,\n TContext extends object = object\n>(\n props: WithFields<\n FormProps<TSchema, TFieldValues, TContext>,\n FieldDefs,\n ExtraOverrides\n > & {\n ref?: React.ForwardedRef<HTMLFormElement>\n } & ExtraProps\n) => React.ReactElement) & {\n displayName?: string\n id?: string\n}\n\nexport const createZodForm = <FieldDefs>(\n options?: CreateZodFormProps<FieldDefs>\n) => {\n const ZodForm = createForm({\n resolver: (schema: any) =>\n zodResolver(schema, options?.schemaOptions, options?.resolverOptions),\n fieldResolver: zodFieldResolver,\n ...options,\n })\n\n ZodForm.displayName = 'ZodForm'\n ZodForm.id = 'ZodForm'\n\n return ZodForm as ZodFormType<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 createFormDialog,\n BaseModalProps,\n FormDialogFieldOverrides,\n} from '@saas-ui/modals'\nimport { ZodFormType } from './create-zod-form'\n\nexport function createZodFormDialog<\n FieldDefs = any,\n ExtraProps = object,\n ExtraOverrides = object\n>(Form: ZodFormType<FieldDefs, ExtraProps, ExtraOverrides>) {\n return createFormDialog(Form) as unknown as ZodFormType<\n FieldDefs,\n ExtraProps & Omit<BaseModalProps, 'children'>,\n ExtraOverrides & FormDialogFieldOverrides\n >\n}\n","import {\n CreateStepFormProps,\n createStepForm,\n StepsOptions,\n UseStepFormProps,\n WithStepFields,\n} from '@saas-ui/forms'\nimport { zodFieldResolver, zodResolver } from './zod-resolver'\nimport { AnyZodObject, z } from 'zod'\nimport React from 'react'\n\ntype ResolverArgs = Parameters<typeof zodResolver>\n\nexport interface CreateZodStepFormProps<FieldDefs>\n extends CreateStepFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\ntype InferStepType<T extends Required<StepsOptions<AnyZodObject>>> = T extends [\n infer Step,\n ...infer Rest\n]\n ? Step extends { schema: AnyZodObject }\n ? z.infer<Step['schema']> &\n (Rest extends Required<StepsOptions<AnyZodObject>>\n ? InferStepType<Rest>\n : object)\n : object\n : object\n\ntype ZodStepFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object\n> = (<\n TSteps extends Required<StepsOptions<AnyZodObject>> = Required<\n StepsOptions<AnyZodObject>\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 createZodStepForm = <FieldDefs>(\n options?: CreateZodStepFormProps<FieldDefs>\n) => {\n const ZodStepForm = createStepForm<any, any, any>({\n resolver: (schema: any) =>\n zodResolver(schema, options?.schemaOptions, options?.resolverOptions),\n fieldResolver: zodFieldResolver,\n ...options,\n })\n\n ZodStepForm.displayName = 'ZodStepForm'\n ZodStepForm.id = 'ZodStepForm'\n\n return ZodStepForm as ZodStepFormType<FieldDefs>\n}\n","export {\n zodResolver,\n getFieldsFromSchema,\n getNestedSchema,\n zodFieldResolver,\n zodMeta,\n zodParseMeta,\n} from './zod-resolver'\nexport type { ZodMeta } from './zod-resolver'\nexport { createZodForm, type ZodFormType } from './create-zod-form'\nexport { createZodFormDialog } from './create-zod-dialog'\nexport { createZodStepForm } from './create-zod-step-form'\n\nimport { createZodForm } from './create-zod-form'\nimport { createZodStepForm } from './create-zod-step-form'\nimport { createZodFormDialog } from './create-zod-dialog'\n\nexport const Form = createZodForm()\n\nexport const StepForm = createZodStepForm()\n\nexport const FormDialog = createZodFormDialog(Form)\n"],"mappings":"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","names":["React","jsx","jsxs","runIfFn","ModalFooter","useBreakpointValue","ModalBody","Button","forwardRef","jsx","jsxs","React","jsxs","jsx","runIfFn","useBreakpointValue","jsxs","jsx","ModalFooter","Form","forwardRef","ModalBody","runIfFn","Button","Form","Form","FormDialog"]}
1
+ {"version":3,"sources":["../../zod/src/zod-resolver.ts","../../zod/src/create-zod-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","../../zod/src/create-zod-dialog.ts","../../zod/src/create-zod-step-form.ts","../../zod/src/index.ts"],"sourcesContent":["import * as z from 'zod'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { get } from '@chakra-ui/utils'\nimport { FieldProps } from '@saas-ui/forms'\n\nexport { zodResolver }\n\nexport type ExtraProps = {\n min?: number\n max?: number\n options?: { label: string; value: string }[]\n}\n\nconst getType = (\n field: z.ZodTypeAny\n): 'array' | 'object' | 'number' | 'date' | 'select' | 'text' => {\n if (field._def.typeName === 'ZodDefault') {\n return getType(field._def.innerType)\n }\n\n switch (field._def.typeName) {\n case 'ZodArray':\n return 'array'\n case 'ZodObject':\n return 'object'\n case 'ZodNumber':\n return 'number'\n case 'ZodDate':\n return 'date'\n case 'ZodEnum':\n return 'select'\n case 'ZodString':\n default:\n return 'text'\n }\n}\n\nconst getArrayOption = (field: any, name: string) => {\n return field._def[name]?.value\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: z.ZodTypeAny): FieldProps[] => {\n const fields: FieldProps[] = []\n\n let schemaFields: Record<string, any> = {}\n if (schema._def.typeName === 'ZodArray') {\n schemaFields = schema._def.type.shape\n } else if (schema._def.typeName === 'ZodObject') {\n schemaFields = schema._def.shape()\n } else {\n return fields\n }\n\n for (const name in schemaFields) {\n const field = schemaFields[name]\n\n const def =\n field._def.typeName === 'ZodDefault'\n ? field._def.innerType._def\n : field._def\n\n const props: ExtraProps = {}\n if (def.typeName === 'ZodArray') {\n props.min = getArrayOption(field, 'minLength')\n props.max = getArrayOption(field, 'maxLength')\n } else if (def.typeName === 'ZodEnum') {\n props.options = def.values.map((value: string) => {\n return { label: value, value }\n })\n }\n\n const meta = field.description && zodParseMeta(field.description)\n\n fields.push({\n name,\n label: meta?.label || field.description || name,\n type: meta?.type || getType(field),\n defaultValue: field._def.defaultValue?.(),\n ...props,\n })\n }\n return fields\n}\n\nexport const getNestedSchema = (schema: z.ZodTypeAny, path: string) => {\n return get(schema._def.shape(), path)\n}\n\nexport const zodFieldResolver = <T extends z.ZodTypeAny>(schema: T) => {\n return {\n getFields() {\n return getFieldsFromSchema(schema)\n },\n getNestedFields(name: string) {\n return getFieldsFromSchema(getNestedSchema(schema, name))\n },\n }\n}\n\nexport interface ZodMeta {\n /**\n * The label of the field\n */\n label: string\n /**\n * The type of the field\n */\n type?: string\n /**\n * Object field column count\n */\n columns?: number\n /**\n * Array field min rows\n */\n min?: number\n /**\n * Array field max rows\n */\n max?: number\n [key: string]: any\n}\n\nexport const zodMeta = (meta: ZodMeta) => {\n return JSON.stringify(meta)\n}\n\nexport const zodParseMeta = (meta: string) => {\n try {\n return JSON.parse(meta)\n } catch (e) {\n return meta\n }\n}\n","import {\n createForm,\n CreateFormProps,\n WithFields,\n FormProps,\n} from '@saas-ui/forms'\nimport { zodFieldResolver, zodResolver } from './zod-resolver'\nimport { z } from 'zod'\n\ntype ResolverArgs = Parameters<typeof zodResolver>\n\nexport interface CreateZodFormProps<FieldDefs>\n extends CreateFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\nexport type ZodFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object,\n Type extends 'zod' = 'zod'\n> = (<\n TSchema extends z.AnyZodObject = z.AnyZodObject,\n TFieldValues extends z.infer<TSchema> = z.infer<TSchema>,\n TContext extends object = object\n>(\n props: WithFields<\n FormProps<TSchema, TFieldValues, TContext>,\n FieldDefs,\n ExtraOverrides\n > & {\n ref?: React.ForwardedRef<HTMLFormElement>\n } & ExtraProps\n) => React.ReactElement) & {\n displayName?: string\n id?: string\n}\n\nexport const createZodForm = <FieldDefs>(\n options?: CreateZodFormProps<FieldDefs>\n) => {\n const ZodForm = createForm({\n resolver: (schema: any) =>\n zodResolver(schema, options?.schemaOptions, options?.resolverOptions),\n fieldResolver: zodFieldResolver,\n ...options,\n })\n\n ZodForm.displayName = 'ZodForm'\n ZodForm.id = 'ZodForm'\n\n return ZodForm as ZodFormType<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 = modal && 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 createFormDialog,\n BaseModalProps,\n FormDialogFieldOverrides,\n} from '@saas-ui/modals'\nimport { ZodFormType } from './create-zod-form'\n\nexport function createZodFormDialog<\n FieldDefs = any,\n ExtraProps = object,\n ExtraOverrides = object\n>(Form: ZodFormType<FieldDefs, ExtraProps, ExtraOverrides>) {\n return createFormDialog(Form) as unknown as ZodFormType<\n FieldDefs,\n ExtraProps & Omit<BaseModalProps, 'children'>,\n ExtraOverrides & FormDialogFieldOverrides\n >\n}\n","import {\n CreateStepFormProps,\n createStepForm,\n StepsOptions,\n UseStepFormProps,\n WithStepFields,\n} from '@saas-ui/forms'\nimport { zodFieldResolver, zodResolver } from './zod-resolver'\nimport { AnyZodObject, z } from 'zod'\nimport React from 'react'\n\ntype ResolverArgs = Parameters<typeof zodResolver>\n\nexport interface CreateZodStepFormProps<FieldDefs>\n extends CreateStepFormProps<FieldDefs> {\n schemaOptions?: ResolverArgs[1]\n resolverOptions?: ResolverArgs[2]\n}\n\ntype InferStepType<T extends Required<StepsOptions<AnyZodObject>>> = T extends [\n infer Step,\n ...infer Rest\n]\n ? Step extends { schema: AnyZodObject }\n ? z.infer<Step['schema']> &\n (Rest extends Required<StepsOptions<AnyZodObject>>\n ? InferStepType<Rest>\n : object)\n : object\n : object\n\ntype ZodStepFormType<\n FieldDefs,\n ExtraProps = object,\n ExtraOverrides = object\n> = (<\n TSteps extends Required<StepsOptions<AnyZodObject>> = Required<\n StepsOptions<AnyZodObject>\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 createZodStepForm = <FieldDefs>(\n options?: CreateZodStepFormProps<FieldDefs>\n) => {\n const ZodStepForm = createStepForm<any, any, any>({\n resolver: (schema: any) =>\n zodResolver(schema, options?.schemaOptions, options?.resolverOptions),\n fieldResolver: zodFieldResolver,\n ...options,\n })\n\n ZodStepForm.displayName = 'ZodStepForm'\n ZodStepForm.id = 'ZodStepForm'\n\n return ZodStepForm as ZodStepFormType<FieldDefs>\n}\n","export {\n zodResolver,\n getFieldsFromSchema,\n getNestedSchema,\n zodFieldResolver,\n zodMeta,\n zodParseMeta,\n} from './zod-resolver'\nexport type { ZodMeta } from './zod-resolver'\nexport { createZodForm, type ZodFormType } from './create-zod-form'\nexport { createZodFormDialog } from './create-zod-dialog'\nexport { createZodStepForm } from './create-zod-step-form'\n\nimport { createZodForm } from './create-zod-form'\nimport { createZodStepForm } from './create-zod-step-form'\nimport { createZodFormDialog } from './create-zod-dialog'\n\nexport const Form = createZodForm()\n\nexport const StepForm = createZodStepForm()\n\nexport const FormDialog = createZodFormDialog(Form)\n"],"mappings":"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","names":["React","jsx","jsxs","runIfFn","ModalFooter","useBreakpointValue","ModalBody","Button","forwardRef","jsx","jsxs","React","jsxs","jsx","runIfFn","useBreakpointValue","jsxs","jsx","ModalFooter","Form","forwardRef","ModalBody","runIfFn","Button","Form","Form","FormDialog"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@saas-ui/forms",
3
- "version": "2.3.4",
3
+ "version": "2.3.5",
4
4
  "description": "Fully functional forms for Chakra UI.",
5
5
  "source": "src/index.ts",
6
6
  "exports": {
@@ -104,7 +104,7 @@
104
104
  "@chakra-ui/react-utils": "^2.0.12",
105
105
  "@chakra-ui/utils": "^2.0.15",
106
106
  "@hookform/resolvers": "^3.3.1",
107
- "@saas-ui/core": "2.2.4",
107
+ "@saas-ui/core": "2.3.0",
108
108
  "react-hook-form": "^7.46.1"
109
109
  },
110
110
  "peerDependencies": {