@saas-ui/modals 2.0.0-next.9 → 2.0.0-rc.22

package/CHANGELOG.md

@@ -1,5 +1,102 @@
 # @saas-ui/modals
 
+## 2.0.0-rc.22
+
+### Patch Changes
+
+- @saas-ui/forms@2.0.0-rc.22
+
+## 2.0.0-next.21
+
+### Patch Changes
+
+- @saas-ui/forms@2.0.0-next.21
+
+## 2.0.0-next.20
+
+### Patch Changes
+
+- Updated dependencies [a9ca90dd]
+  - @saas-ui/forms@2.0.0-next.20
+
+## 2.0.0-next.19
+
+### Patch Changes
+
+- @saas-ui/forms@2.0.0-next.19
+
+## 2.0.0-next.18
+
+### Patch Changes
+
+- Updated dependencies [01ac442f]
+  - @saas-ui/forms@2.0.0-next.18
+
+## 2.0.0-next.17
+
+### Patch Changes
+
+- @saas-ui/forms@2.0.0-next.17
+
+## 2.0.0-next.16
+
+### Patch Changes
+
+- cc713117: Fix issue where onCloseComplete would not be called
+  - @saas-ui/forms@2.0.0-next.16
+
+## 2.0.0-next.15
+
+### Minor Changes
+
+- 2d18cdc2: New createFormDialog function to create Zod or Yup specific FormDialogs
+
+### Patch Changes
+
+- Updated dependencies [2d18cdc2]
+  - @saas-ui/forms@2.0.0-next.15
+
+## 2.0.0-next.14
+
+### Patch Changes
+
+- Fix esm bundle import
+- Updated dependencies
+  - @saas-ui/react-utils@2.0.0-next.3
+  - @saas-ui/forms@2.0.0-next.14
+  - @saas-ui/hooks@2.0.0-next.4
+
+## 2.0.0-next.13
+
+### Patch Changes
+
+- 1563cc9a: BaseDrawer now accepts header, content and footer props.
+- Bump version
+- Updated dependencies
+- Updated dependencies [6c63217c]
+  - @saas-ui/react-utils@2.0.0-next.2
+  - @saas-ui/forms@2.0.0-next.13
+  - @saas-ui/hooks@2.0.0-next.3
+
+## 2.0.0-next.12
+
+### Patch Changes
+
+- Updated dependencies [a7ef6dd9]
+  - @saas-ui/forms@2.0.0-next.12
+
+## 2.0.0-next.11
+
+### Patch Changes
+
+- @saas-ui/forms@2.0.0-next.11
+
+## 2.0.0-next.10
+
+### Patch Changes
+
+- @saas-ui/forms@2.0.0-next.10
+
 ## 2.0.0-next.9
 
 ### Minor Changes
@@ -90,6 +187,26 @@
   - @saas-ui/hooks@2.0.0-next.0
   - @saas-ui/react-utils@2.0.0-next.0
 
+## 1.5.7
+
+### Patch Changes
+
+- Fix types path
+- Updated dependencies
+  - @saas-ui/button@1.4.2
+  - @saas-ui/forms@1.5.5
+  - @saas-ui/menu@1.4.3
+
+## 1.5.6
+
+### Patch Changes
+
+- b2302a3: Add types to package.json exports
+- Updated dependencies [b2302a3]
+  - @saas-ui/button@1.4.1
+  - @saas-ui/forms@1.5.4
+  - @saas-ui/menu@1.4.2
+
 ## 1.5.5
 
 ### Patch Changes

package/dist/index.d.ts

@@ -1,24 +1,28 @@
-import * as React from 'react';
-import { AlertDialogProps, ButtonProps, ButtonGroupProps, DrawerProps as DrawerProps$1, ModalProps, ModalHeaderProps, ModalContentProps, ModalFooterProps, MenuListProps } from '@chakra-ui/react';
+import * as React$1 from 'react';
+import { AlertDialogProps, ButtonProps, ButtonGroupProps, DrawerProps as DrawerProps$1, ModalHeaderProps, ModalContentProps, ModalFooterProps, ModalProps, MenuListProps } from '@chakra-ui/react';
 import { MaybeRenderProp } from '@chakra-ui/react-utils';
 import * as _chakra_ui_system_dist_system_types from '@chakra-ui/system/dist/system.types';
 import * as _saas_ui_forms from '@saas-ui/forms';
-import { FieldValues, FieldProps, FormProps, FieldResolver } from '@saas-ui/forms';
-import * as react_hook_form from 'react-hook-form';
+import { DefaultFieldOverrides, FieldValues, FieldProps, FormProps, FieldResolver, FormType, WithFields } from '@saas-ui/forms';
+import { YupFormType, AnyObjectSchema } from '@saas-ui/forms/yup';
+import { ZodFormType } from '@saas-ui/forms/zod';
+import * as _chakra_ui_button_dist_button from '@chakra-ui/button/dist/button';
+import { z } from 'zod';
+import { InferType } from 'yup';
 
 interface ConfirmDialogProps extends Omit<AlertDialogProps, 'leastDestructiveRef'> {
     /**
      * The dialog title
      */
-    title?: React.ReactNode;
+    title?: React$1.ReactNode;
     /**
      * The cancel button label
      */
-    cancelLabel?: React.ReactNode;
+    cancelLabel?: React$1.ReactNode;
     /**
      * The confirm button label
      */
-    confirmLabel?: React.ReactNode;
+    confirmLabel?: React$1.ReactNode;
     /**
      * The cancel button props
      */
@@ -55,13 +59,24 @@ interface ConfirmDialogProps extends Omit<AlertDialogProps, 'leastDestructiveRef
      */
     onConfirm?: () => void;
 }
-declare const ConfirmDialog: React.FC<ConfirmDialogProps>;
+declare const ConfirmDialog: React$1.FC<ConfirmDialogProps>;
 
 interface BaseDrawerProps extends Omit<DrawerProps$1, 'children'> {
     /**
      * The drawer title
      */
-    title: React.ReactNode;
+    title: React$1.ReactNode;
+    /**
+     * The modal children
+     */
+    children: MaybeRenderProp<{
+        isOpen: boolean;
+        onClose: () => void;
+    }>;
+    /**
+     * The modal footer
+     */
+    footer?: React$1.ReactNode;
     /**
      * Hide the close button
      */
@@ -70,22 +85,33 @@ interface BaseDrawerProps extends Omit<DrawerProps$1, 'children'> {
      * Hide the overflow
      */
     hideOverlay?: boolean;
-    children?: React.ReactNode;
+    /**
+     * Props for the modal header
+     */
+    headerProps?: ModalHeaderProps;
+    /**
+     * Props for the modal content
+     */
+    contentProps?: ModalContentProps;
+    /**
+     * Props for the modal footer
+     */
+    footerProps?: ModalFooterProps;
 }
-declare const BaseDrawer: React.FC<BaseDrawerProps>;
+declare const BaseDrawer: React$1.FC<BaseDrawerProps>;
 interface DrawerProps extends BaseDrawerProps {
     /**
      * Drawer footer content, wrapped with `DrawerFooter`
      */
-    footer?: React.ReactNode;
+    footer?: React$1.ReactNode;
 }
-declare const Drawer: React.FC<DrawerProps>;
+declare const Drawer: React$1.FC<DrawerProps>;
 
 interface BaseModalProps extends Omit<ModalProps, 'children'> {
     /**
      * The modal title
      */
-    title?: React.ReactNode;
+    title?: React$1.ReactNode;
     /**
      * The modal children
      */
@@ -96,7 +122,7 @@ interface BaseModalProps extends Omit<ModalProps, 'children'> {
     /**
      * The modal footer
      */
-    footer?: React.ReactNode;
+    footer?: React$1.ReactNode;
     /**
      * Hide the close button
      */
@@ -118,76 +144,94 @@ interface BaseModalProps extends Omit<ModalProps, 'children'> {
      */
     footerProps?: ModalFooterProps;
 }
-declare const BaseModal: React.FC<BaseModalProps>;
-declare const Modal: React.FC<BaseModalProps>;
+declare const BaseModal: React$1.FC<BaseModalProps>;
+declare const Modal: React$1.FC<BaseModalProps>;
 
 interface MenuDialogProps extends BaseModalProps {
     /**
      * The modal footer, wrapped with `ModalFooter`
      */
-    footer?: React.ReactNode;
+    footer?: React$1.ReactNode;
 }
-declare const MenuDialog: React.FC<MenuDialogProps>;
+declare const MenuDialog: React$1.FC<MenuDialogProps>;
 interface MenuDialogListProps extends Omit<BaseModalProps, 'isOpen' | 'onClose' | 'children' | 'scrollBehavior'>, Omit<MenuListProps, 'title'> {
 }
 declare const MenuDialogList: _chakra_ui_system_dist_system_types.ComponentWithAs<"div", MenuDialogListProps>;
 
-interface FormDialogProps<TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TSchema = any, TFieldTypes = FieldProps<TFieldValues>> extends Omit<BaseModalProps, 'children'>, Pick<FormProps<TFieldValues, TContext, TSchema, TFieldTypes>, 'schema' | 'defaultValues' | 'values' | 'context' | 'onChange' | 'onSubmit' | 'onError' | 'resolver' | 'mode' | 'reValidateMode' | 'shouldFocusError' | 'shouldUnregister' | 'shouldUseNativeValidation' | 'criteriaMode' | 'delayError' | 'resetOptions' | 'children'> {
+type FormDialogFieldOverrides = DefaultFieldOverrides & {
+    cancel?: ButtonProps;
+};
+interface FormDialogProps<TSchema = any, TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TFieldTypes = FieldProps<TFieldValues>> extends Omit<BaseModalProps, 'children'>, Pick<FormProps<TSchema, TFieldValues, TContext, TFieldTypes>, 'schema' | 'defaultValues' | 'values' | 'context' | 'onChange' | 'onSubmit' | 'onError' | 'resolver' | 'mode' | 'reValidateMode' | 'shouldFocusError' | 'shouldUnregister' | 'shouldUseNativeValidation' | 'criteriaMode' | 'delayError' | 'resetOptions' | 'children'> {
     /**
      * The modal footer, will be wrapped with `ModalFooter`.
      * Defaults to a cancel and submit button.
      */
-    footer?: React.ReactNode;
-    /**
-     * The cancel button label
-     * @default "Cancel"
-     */
-    cancelLabel?: React.ReactNode;
-    /**
-     * The submit button label
-     * @default "Submit"
-     */
-    submitLabel?: React.ReactNode;
+    footer?: React$1.ReactNode;
     /**
      * A schema field resolver used to auto generate form fields.
      */
     fieldResolver?: FieldResolver;
+    /**
+     * Field overrides
+     */
+    fields?: FormDialogFieldOverrides;
 }
+/**
+ * @todo make this dynamic to support other schema types
+ */
+type MergeDialogProps<T> = T extends YupFormType<infer FieldDefs, infer ExtraProps, infer ExtraOverrides, 'yup'> ? YupFormType<FieldDefs, ExtraProps & Omit<BaseModalProps, 'children'>, ExtraOverrides & FormDialogFieldOverrides> : T extends ZodFormType<infer FieldDefs, infer ExtraProps, infer ExtraOverrides, 'zod'> ? ZodFormType<FieldDefs, ExtraProps & Omit<BaseModalProps, 'children'>, ExtraOverrides & FormDialogFieldOverrides> : T extends FormType<infer FieldDefs, infer ExtraProps, infer ExtraOverrides> ? FormType<FieldDefs, ExtraProps & Omit<BaseModalProps, 'children'>, ExtraOverrides & FormDialogFieldOverrides> : never;
+type DefaultFormType<FieldDefs = any, ExtraProps = object, ExtraOverrides = FormDialogFieldOverrides> = (<TSchema = unknown, TFieldValues extends Record<string, any> = any, TContext extends object = object>(props: any) => React$1.ReactElement) & {
+    displayName?: string;
+    id?: string;
+};
+declare function createFormDialog<FieldDefs = any, ExtraProps = object, ExtraOverrides = FormDialogFieldOverrides, TFormType extends DefaultFormType<FieldDefs, ExtraProps, ExtraOverrides> = DefaultFormType<FieldDefs, ExtraProps, ExtraOverrides>>(Form: TFormType): MergeDialogProps<TFormType>;
 /**
  * Can be used to quickly request information from people without leaving the current page.
  *
  * @see Docs https://saas-ui.dev/docs/components/overlay/form-dialog
  */
-declare const FormDialog: <TFieldValues extends FieldValues>(props: FormDialogProps<TFieldValues, object, any, FieldProps<TFieldValues>> & {
-    ref?: React.ForwardedRef<HTMLFormElement> | undefined;
-}) => React.ReactElement;
+declare const FormDialog: FormType<unknown, object & Omit<BaseModalProps, "children">, object & DefaultFieldOverrides & {
+    cancel?: ButtonProps | undefined;
+}>;
 
-interface ModalsContextValue<TModals extends Record<string, React.FC<any>> = Record<string, React.FC<any>>, TTypes extends Extract<keyof TModals, string> = Extract<keyof TModals, string>> {
+type FormDialogHandler<T> = T extends YupFormType<infer FieldDefs, infer ExtraProps, infer ExtraOverrides, 'yup'> ? YupHandler<FieldDefs, object, ExtraOverrides & FormDialogFieldOverrides> : T extends ZodFormType<infer FieldDefs, infer ExtraProps, infer ExtraOverrides, 'zod'> ? ZodHandler<FieldDefs, object, ExtraOverrides & FormDialogFieldOverrides> : T extends FormType<infer FieldDefs, infer ExtraProps, infer ExtraOverrides> ? FormHandler<FieldDefs, object, ExtraOverrides & FormDialogFieldOverrides> : never;
+type ZodHandler<FieldDefs, ExtraProps = object, ExtraOverrides = object, Type extends 'zod' = 'zod'> = <TSchema extends z.AnyZodObject = z.AnyZodObject, TFieldValues extends z.infer<TSchema> = z.infer<TSchema>, TContext extends object = object>(props: WithFields<FormProps<TSchema, TFieldValues, TContext>, FieldDefs, ExtraOverrides> & {
+    ref?: React.ForwardedRef<HTMLFormElement>;
+} & ExtraProps) => ModalId;
+type FormHandler<FieldDefs, ExtraProps = object, ExtraOverrides = object> = <TSchema = unknown, TFieldValues extends FieldValues = FieldValues, TContext extends object = object>(props: WithFields<FormProps<TSchema, TFieldValues, TContext>, FieldDefs, ExtraOverrides> & {
+    ref?: React.ForwardedRef<HTMLFormElement>;
+} & ExtraProps) => ModalId;
+type YupHandler<FieldDefs, ExtraProps = object, ExtraOverrides = object, Type extends 'yup' = 'yup'> = <TSchema extends AnyObjectSchema = AnyObjectSchema, TFieldValues extends InferType<TSchema> = InferType<TSchema>, // placeholder
+TContext extends object = object>(props: WithFields<FormProps<TFieldValues, TContext, TSchema>, FieldDefs, ExtraOverrides> & {
+    ref?: React.ForwardedRef<HTMLFormElement>;
+} & ExtraProps) => ModalId;
+
+interface ModalsContextValue<TModals extends Record<string, React$1.FC<any>> = Record<string, React$1.FC<any>>, TTypes extends Extract<keyof TModals, string> = Extract<keyof TModals, string>> {
     open: <T extends OpenOptions<TTypes>>(componentOrOptions: T extends {
-        component: infer TComponent extends React.FC<any>;
-    } ? WithModalOptions<React.ComponentPropsWithRef<TComponent>> : T extends {
+        component: infer TComponent extends React$1.FC<any>;
+    } ? WithModalOptions<React$1.ComponentPropsWithRef<TComponent>> : T extends {
         type: infer TType extends keyof TModals;
-    } ? WithModalOptions<React.ComponentPropsWithRef<TModals[TType]>> : T, options?: T extends React.FC<any> ? WithModalOptions<React.ComponentPropsWithRef<T>> : never) => ModalId;
+    } ? WithModalOptions<React$1.ComponentPropsWithRef<TModals[TType]>> : T, options?: T extends React$1.FC<any> ? WithModalOptions<React$1.ComponentPropsWithRef<T>> : never) => ModalId;
     drawer: (options: DrawerOptions) => ModalId;
     alert: (options: ConfirmDialogOptions) => ModalId;
     confirm: (options: ConfirmDialogOptions) => ModalId;
     menu: (options: MenuDialogOptions) => ModalId;
-    form: <TProps extends FormDialogProps = FormDialogProps>(options: WithModalOptions<TProps>) => ModalId;
+    form: FormDialogHandler<TModals['form']>;
     close: (id: ModalId) => void;
     closeAll: () => void;
 }
-declare const ModalsContext: React.Context<ModalsContextValue<{
-    alert: React.FC<ConfirmDialogProps>;
-    confirm: React.FC<ConfirmDialogProps>;
-    drawer: React.FC<DrawerProps>;
-    modal: React.FC<BaseModalProps>;
-    menu: React.FC<MenuDialogProps>;
-    form: <TFieldValues extends react_hook_form.FieldValues>(props: FormDialogProps<TFieldValues, object, any, _saas_ui_forms.FieldProps<TFieldValues>> & {
-        ref?: React.ForwardedRef<HTMLFormElement> | undefined;
-    }) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+declare const ModalsContext: React$1.Context<ModalsContextValue<{
+    alert: React$1.FC<ConfirmDialogProps>;
+    confirm: React$1.FC<ConfirmDialogProps>;
+    drawer: React$1.FC<DrawerProps>;
+    modal: React$1.FC<BaseModalProps>;
+    menu: React$1.FC<MenuDialogProps>;
+    form: FormType<unknown, object & Omit<BaseModalProps, "children">, object & _saas_ui_forms.DefaultFieldOverrides & {
+        cancel?: _chakra_ui_button_dist_button.ButtonProps | undefined;
+    }>;
 }, "confirm" | "form" | "menu" | "alert" | "modal" | "drawer"> | null>;
-interface ModalsProviderProps<TModals extends Record<string, React.FC<any>> = Record<string, React.FC<any>>> {
-    children: React.ReactNode;
+interface ModalsProviderProps<TModals extends Record<string, React$1.FC<any>> = Record<string, React$1.FC<any>>> {
+    children: React$1.ReactNode;
     modals?: TModals;
 }
 type ModalId = string | number;
@@ -238,7 +282,7 @@ interface ModalConfig<TModalOptions extends ModalOptions = ModalOptions, TModalT
      * Render a custom modal component.
      * This will ignore the `type` param.
      */
-    component?: React.FC<BaseModalProps>;
+    component?: React$1.FC<BaseModalProps>;
     /**
      * Whether the modal is open or not.
      * This is used internally to keep track of the modal state.
@@ -246,24 +290,24 @@ interface ModalConfig<TModalOptions extends ModalOptions = ModalOptions, TModalT
     isOpen?: boolean;
 }
 declare function ModalsProvider({ children, modals }: ModalsProviderProps): JSX.Element;
-declare const useModalsContext: () => ModalsContextValue<Record<string, React.FC<any>>, string>;
-declare const useModals: () => ModalsContextValue<Record<string, React.FC<any>>, string>;
+declare const useModalsContext: () => ModalsContextValue<Record<string, React$1.FC<any>>, string>;
+declare const useModals: () => ModalsContextValue<Record<string, React$1.FC<any>>, string>;
 
-interface CreateModalsOptions<TModalDefs> {
+interface CreateModalsOptions<TModalDefs extends Record<string, React.FC<any>>> {
     modals: TModalDefs;
 }
-declare const createModals: <TModalDefs extends Record<string, React.FC<any>>>(options: CreateModalsOptions<TModalDefs>) => {
+declare const createModals: <TModalDefs extends Record<string, React$1.FC<any>>>(options: CreateModalsOptions<TModalDefs>) => {
     ModalsProvider: (props: Omit<ModalsProviderProps, 'modals'>) => JSX.Element;
     useModals: () => ModalsContextValue<{
-        alert: React.FC<ConfirmDialogProps>;
-        confirm: React.FC<ConfirmDialogProps>;
-        drawer: React.FC<DrawerProps>;
-        modal: React.FC<BaseModalProps>;
-        menu: React.FC<MenuDialogProps>;
-        form: <TFieldValues extends react_hook_form.FieldValues>(props: FormDialogProps<TFieldValues, object, any, _saas_ui_forms.FieldProps<TFieldValues>> & {
-            ref?: React.ForwardedRef<HTMLFormElement> | undefined;
-        }) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+        alert: React$1.FC<ConfirmDialogProps>;
+        confirm: React$1.FC<ConfirmDialogProps>;
+        drawer: React$1.FC<DrawerProps>;
+        modal: React$1.FC<BaseModalProps>;
+        menu: React$1.FC<MenuDialogProps>;
+        form: _saas_ui_forms.FormType<unknown, object & Omit<BaseModalProps, "children">, object & _saas_ui_forms.DefaultFieldOverrides & {
+            cancel?: _chakra_ui_button_dist_button.ButtonProps | undefined;
+        }>;
     } & TModalDefs, "confirm" | "form" | "menu" | "alert" | "modal" | "drawer" | Extract<keyof TModalDefs, string>>;
 };
 
-export { BaseDrawer, BaseDrawerProps, BaseModal, BaseModalProps, ConfirmDialog, ConfirmDialogOptions, ConfirmDialogProps, CreateModalsOptions, Drawer, DrawerOptions, DrawerProps, FormDialog, FormDialogOptions, FormDialogProps, MenuDialog, MenuDialogList, MenuDialogListProps, MenuDialogOptions, MenuDialogProps, Modal, ModalConfig, ModalId, ModalScopes, ModalsContext, ModalsContextValue, ModalsProvider, ModalsProviderProps, OpenOptions, createModals, useModals, useModalsContext };
+export { BaseDrawer, BaseDrawerProps, BaseModal, BaseModalProps, ConfirmDialog, ConfirmDialogOptions, ConfirmDialogProps, CreateModalsOptions, DefaultFormType, Drawer, DrawerOptions, DrawerProps, FormDialog, FormDialogFieldOverrides, FormDialogOptions, FormDialogProps, MenuDialog, MenuDialogList, MenuDialogListProps, MenuDialogOptions, MenuDialogProps, Modal, ModalConfig, ModalId, ModalScopes, ModalsContext, ModalsContextValue, ModalsProvider, ModalsProviderProps, OpenOptions, createFormDialog, createModals, useModals, useModalsContext };

package/dist/index.js

@@ -92,27 +92,35 @@ var BaseDrawer = (props) => {
   const {
     title,
     children,
+    footer,
     isOpen,
     onClose,
     hideCloseButton,
     hideOverlay,
+    headerProps,
+    contentProps,
+    footerProps,
     ...rest
   } = props;
   return /* @__PURE__ */ jsxRuntime.jsxs(react.Drawer, { isOpen, onClose, ...rest, children: [
     !hideOverlay && /* @__PURE__ */ jsxRuntime.jsx(react.DrawerOverlay, {}),
-    /* @__PURE__ */ jsxRuntime.jsxs(react.DrawerContent, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(react.DrawerHeader, { children: title }),
+    /* @__PURE__ */ jsxRuntime.jsxs(react.DrawerContent, { ...contentProps, children: [
+      title && /* @__PURE__ */ jsxRuntime.jsx(react.DrawerHeader, { ...headerProps, children: title }),
       !hideCloseButton && /* @__PURE__ */ jsxRuntime.jsx(react.DrawerCloseButton, {}),
-      children
+      utils.runIfFn(children, {
+        isOpen,
+        onClose
+      }),
+      footer && /* @__PURE__ */ jsxRuntime.jsx(react.DrawerFooter, { ...footerProps, children: footer })
     ] })
   ] });
 };
 var Drawer = (props) => {
-  const { footer, children, ...rest } = props;
-  return /* @__PURE__ */ jsxRuntime.jsxs(BaseDrawer, { ...rest, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(react.DrawerBody, { children }),
-    footer && /* @__PURE__ */ jsxRuntime.jsx(react.DrawerFooter, { children: footer })
-  ] });
+  const { children, isOpen, onClose, ...rest } = props;
+  return /* @__PURE__ */ jsxRuntime.jsx(BaseDrawer, { isOpen, onClose, ...rest, children: /* @__PURE__ */ jsxRuntime.jsx(react.DrawerBody, { children: utils.runIfFn(children, {
+    isOpen,
+    onClose
+  }) }) });
 };
 var BaseModal = (props) => {
   const {
@@ -219,67 +227,76 @@ var MenuDialogList = react.forwardRef(
     );
   }
 );
-var FormDialog = react.forwardRef(
-  (props, ref) => {
-    const {
-      children,
-      schema,
-      resolver,
-      fieldResolver,
-      defaultValues,
-      values,
-      context,
-      onChange,
-      onSubmit,
-      onError,
-      mode,
-      reValidateMode,
-      shouldFocusError = true,
-      shouldUnregister,
-      shouldUseNativeValidation,
-      criteriaMode,
-      delayError = 100,
-      cancelLabel = "Cancel",
-      submitLabel = "Submit",
-      footer,
-      isOpen,
-      onClose,
-      ...rest
-    } = props;
-    const formProps = {
-      ref,
-      schema,
-      resolver,
-      defaultValues,
-      values,
-      context,
-      onChange,
-      onSubmit,
-      onError,
-      mode,
-      reValidateMode,
-      shouldFocusError,
-      shouldUnregister,
-      shouldUseNativeValidation,
-      criteriaMode,
-      delayError
-    };
-    return /* @__PURE__ */ jsxRuntime.jsx(BaseModal, { isOpen, onClose, ...rest, children: /* @__PURE__ */ jsxRuntime.jsx(forms.Form, { ...formProps, ref, children: (form) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { children: reactUtils.runIfFn(children, form) || /* @__PURE__ */ jsxRuntime.jsx(
-        forms.AutoFields,
-        {
-          schema,
-          fieldResolver,
-          focusFirstField: true
-        }
-      ) }),
-      footer || /* @__PURE__ */ jsxRuntime.jsxs(react.ModalFooter, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(react.Button, { variant: "ghost", mr: 3, onClick: onClose, children: cancelLabel }),
-        /* @__PURE__ */ jsxRuntime.jsx(forms.SubmitButton, { children: submitLabel })
-      ] })
-    ] }) }) });
-  }
-);
+var useFormProps = (props) => {
+  const {
+    schema,
+    resolver,
+    fieldResolver,
+    defaultValues,
+    values,
+    context,
+    onChange,
+    onSubmit,
+    onError,
+    mode,
+    reValidateMode,
+    shouldFocusError = true,
+    shouldUnregister,
+    shouldUseNativeValidation,
+    criteriaMode,
+    delayError = 100,
+    fields,
+    ...modalProps
+  } = props;
+  const formProps = {
+    schema,
+    resolver,
+    defaultValues,
+    values,
+    context,
+    onChange,
+    onSubmit,
+    onError,
+    mode,
+    reValidateMode,
+    shouldFocusError,
+    shouldUnregister,
+    shouldUseNativeValidation,
+    criteriaMode,
+    delayError,
+    fields
+  };
+  return { modalProps, formProps, fields };
+};
+function createFormDialog(Form2) {
+  const Dialog = react.forwardRef((props, ref) => {
+    const { isOpen, onClose, footer, children, ...rest } = props;
+    const { modalProps, formProps, fields } = useFormProps(rest);
+    return /* @__PURE__ */ jsxRuntime.jsx(BaseModal, { ...modalProps, isOpen, onClose, children: /* @__PURE__ */ jsxRuntime.jsx(Form2, { ref, ...formProps, children: (form) => {
+      var _a, _b;
+      return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(react.ModalBody, { children: reactUtils.runIfFn(children, form) || /* @__PURE__ */ jsxRuntime.jsx(forms.AutoFields, {}) }),
+        footer || /* @__PURE__ */ jsxRuntime.jsxs(react.ModalFooter, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            react.Button,
+            {
+              variant: "ghost",
+              mr: 3,
+              onClick: onClose,
+              ...fields == null ? void 0 : fields.cancel,
+              children: (_b = (_a = fields == null ? void 0 : fields.cancel) == null ? void 0 : _a.children) != null ? _b : "Cancel"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(forms.SubmitButton, { ...fields == null ? void 0 : fields.submit })
+        ] })
+      ] });
+    } }) });
+  });
+  Dialog.displayName = `${Form2.displayName || Form2.name}Dialog`;
+  Dialog.id = Form2.id;
+  return Dialog;
+}
+var FormDialog = createFormDialog(forms.Form);
 
 // src/default-modals.ts
 var defaultModals = {
@@ -423,6 +440,7 @@ function ModalsProvider({ children, modals }) {
         modal.scope
       );
     }
+    closeComplete(id);
   };
   const closeComplete = (id) => {
     const modals2 = [...Array.from(_instances)];
@@ -503,6 +521,7 @@ exports.MenuDialogList = MenuDialogList;
 exports.Modal = Modal;
 exports.ModalsContext = ModalsContext;
 exports.ModalsProvider = ModalsProvider;
+exports.createFormDialog = createFormDialog;
 exports.createModals = createModals;
 exports.useModals = useModals;
 exports.useModalsContext = useModalsContext;