@saas-ui/forms 2.0.0-rc.25 → 2.0.0-rc.27

package/dist/yup/index.mjs

@@ -1,9 +1,30 @@
 import { reach } from 'yup';
 import { yupResolver } from '@hookform/resolvers/yup';
 export { yupResolver } from '@hookform/resolvers/yup';
-import { createForm, createStepForm } from '@saas-ui/forms';
+import { createForm, createStepForm, AutoFields, SubmitButton, Form } from '@saas-ui/forms';
+import * as React from 'react';
+import { createStylesContext, forwardRef, useMenuContext, useMenuList, useMultiStyleConfig, useBreakpointValue, chakra, ModalFooter, useTheme, Modal, ModalOverlay, ModalContent, ModalHeader, ModalCloseButton, ModalBody, Button } from '@chakra-ui/react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import * as utils_star from '@chakra-ui/utils';
+import { runIfFn } from '@chakra-ui/utils';
 
-// yup/src/yup-resolver.ts
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
 var getType = (field) => {
   var _a;
   if ((_a = field.spec.meta) == null ? void 0 : _a.type) {
@@ -88,10 +109,205 @@ var createYupStepForm = (options) => {
   return YupStepForm;
 };
 
+// ../saas-ui-react-utils/dist/index.mjs
+var dist_exports = {};
+__export(dist_exports, {
+  getChildOfType: () => getChildOfType,
+  getChildrenOfType: () => getChildrenOfType,
+  useResponsiveValue: () => useResponsiveValue
+});
+__reExport(dist_exports, utils_star);
+function getChildOfType(children, type) {
+  return React.Children.toArray(children).find(
+    (item) => item.type === type
+  );
+}
+function getChildrenOfType(children, type) {
+  return React.Children.toArray(children).filter(
+    (item) => Array.isArray(type) ? type.some((component) => component === item.type) : item.type === type
+  );
+}
+var normalize = (variant, toArray) => {
+  if (Array.isArray(variant))
+    return variant;
+  else if (typeof variant === "object")
+    return toArray == null ? void 0 : toArray(variant);
+  if (variant != null)
+    return [variant];
+  return [];
+};
+var useResponsiveValue = (value, options) => {
+  var _a;
+  const theme = useTheme();
+  const normalized = normalize(value, (_a = theme.__breakpoints) == null ? void 0 : _a.toArrayValue);
+  return useBreakpointValue(normalized, options);
+};
+var BaseModal = (props) => {
+  const {
+    title,
+    footer,
+    children,
+    isOpen,
+    onClose,
+    hideCloseButton,
+    hideOverlay,
+    headerProps,
+    contentProps,
+    footerProps,
+    ...rest
+  } = props;
+  return /* @__PURE__ */ jsxs(Modal, { isOpen, onClose, ...rest, children: [
+    !hideOverlay && /* @__PURE__ */ jsx(ModalOverlay, {}),
+    /* @__PURE__ */ jsxs(ModalContent, { ...contentProps, children: [
+      title && /* @__PURE__ */ jsx(ModalHeader, { ...headerProps, children: title }),
+      !hideCloseButton && /* @__PURE__ */ jsx(ModalCloseButton, {}),
+      runIfFn(children, {
+        isOpen,
+        onClose
+      }),
+      footer && /* @__PURE__ */ jsx(ModalFooter, { ...footerProps, children: footer })
+    ] })
+  ] });
+};
+var [StylesProvider] = createStylesContext("SuiMenuDialog");
+forwardRef(
+  (props, forwardedRef) => {
+    const {
+      rootProps,
+      title,
+      footer,
+      initialFocusRef,
+      hideCloseButton,
+      motionPreset = "slideInBottom",
+      isCentered: isCenteredProp,
+      ...rest
+    } = props;
+    const { isOpen, onClose, menuRef } = useMenuContext();
+    const { ref, ...ownProps } = useMenuList(rest, forwardedRef);
+    const styles = useMultiStyleConfig("Menu", props);
+    const isCentered = useBreakpointValue({ base: true, md: false });
+    return /* @__PURE__ */ jsxs(
+      BaseModal,
+      {
+        isOpen,
+        onClose,
+        initialFocusRef: initialFocusRef || menuRef,
+        title,
+        hideCloseButton,
+        motionPreset,
+        isCentered: isCenteredProp != null ? isCenteredProp : isCentered,
+        contentProps: { mx: 4 },
+        children: [
+          /* @__PURE__ */ jsx(StylesProvider, { value: styles, children: /* @__PURE__ */ jsx(
+            chakra.div,
+            {
+              ...ownProps,
+              ref,
+              __css: {
+                outline: 0,
+                maxHeight: "80vh",
+                // can override this in theme
+                overflowY: "auto",
+                // can override this in theme
+                ...styles.list,
+                boxShadow: "none",
+                border: 0,
+                _dark: {
+                  /* @ts-expect-error */
+                  ...styles.list._dark || {},
+                  boxShadow: "none"
+                }
+              }
+            }
+          ) }),
+          footer && /* @__PURE__ */ jsx(ModalFooter, { children: footer })
+        ]
+      }
+    );
+  }
+);
+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(Form22) {
+  const Dialog = forwardRef((props, ref) => {
+    const { isOpen, onClose, footer, children, ...rest } = props;
+    const { modalProps, formProps, fields } = useFormProps(rest);
+    return /* @__PURE__ */ jsx(BaseModal, { ...modalProps, isOpen, onClose, children: /* @__PURE__ */ jsx(Form22, { ref, ...formProps, children: (form) => {
+      var _a, _b;
+      return /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(ModalBody, { children: (0, dist_exports.runIfFn)(children, form) || /* @__PURE__ */ jsx(AutoFields, {}) }),
+        footer || /* @__PURE__ */ jsxs(ModalFooter, { children: [
+          /* @__PURE__ */ jsx(
+            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__ */ jsx(SubmitButton, { ...fields == null ? void 0 : fields.submit })
+        ] })
+      ] });
+    } }) });
+  });
+  Dialog.displayName = `${Form22.displayName || Form22.name}Dialog`;
+  Dialog.id = Form22.id;
+  return Dialog;
+}
+createFormDialog(Form);
+React.createContext(null);
+
+// yup/src/create-yup-dialog.ts
+function createYupFormDialog(Form4) {
+  return createFormDialog(Form4);
+}
+
 // yup/src/index.ts
-var Form2 = createYupForm();
+var Form3 = createYupForm();
 var StepForm = createYupStepForm();
+var FormDialog2 = createYupFormDialog(Form3);
 
-export { Form2 as Form, StepForm, createYupForm, getFieldsFromSchema, getNestedSchema, yupFieldResolver };
+export { Form3 as Form, FormDialog2 as FormDialog, StepForm, createYupForm, createYupFormDialog, createYupStepForm, getFieldsFromSchema, getNestedSchema, yupFieldResolver };
 //# sourceMappingURL=out.js.map
 //# sourceMappingURL=index.mjs.map

package/dist/yup/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../yup/src/yup-resolver.ts","../../yup/src/create-yup-form.ts","../../yup/src/create-yup-step-form.ts","../../yup/src/index.ts"],"names":["Form"],"mappings":";AAAA,SAAS,aAAa;AACtB,SAAS,mBAAmB;AAa5B,IAAM,UAAU,CAAC,UAAe;AAdhC;AAeE,OAAI,WAAM,KAAK,SAAX,mBAAiB,MAAM;AACzB,WAAO,MAAM,KAAK,KAAK;AAAA,EACzB;AAEA,UAAQ,MAAM,MAAM;AAAA,IAClB,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;AAlCrD;AAmCE,aAAW,QAAQ,MAAM,OAAO;AAC9B,SAAI,UAAK,YAAL,mBAAc,OAAO;AAAO,aAAO,KAAK,QAAQ,OAAO,IAAI;AAAA,EACjE;AACF;AAQO,IAAM,sBAAsB,CAAC,WAA0C;AAC5E,QAAM,SAAS,CAAC;AAEhB,MAAI,eAAoC,CAAC;AACzC,MAAI,OAAO,SAAS,SAAS;AAE3B,mBAAe,OAAO,UAAU;AAAA,EAClC,OAAO;AACL,mBAAe,OAAO;AAAA,EACxB;AAEA,aAAW,QAAQ,cAAc;AAC/B,UAAM,QAAQ,aAAa,IAAI;AAE/B,UAAM,UAAmB,CAAC;AAC1B,QAAI,MAAM,SAAS,SAAS;AAC1B,cAAQ,MAAM,eAAe,OAAO,KAAK;AACzC,cAAQ,MAAM,eAAe,OAAO,KAAK;AAAA,IAC3C;AAEA,WAAO,KAAK;AAAA,MACV;AAAA,MACA,OAAO,MAAM,KAAK,SAAS;AAAA,MAC3B,MAAM,QAAQ,KAAK;AAAA,MACnB,GAAG;AAAA,IACL,CAAC;AAAA,EACH;AACA,SAAO;AACT;AAEO,IAAM,kBAAkB,CAAC,QAAyB,SAAiB;AACxE,SAAO,MAAM,QAAQ,IAAI;AAC3B;AAEO,IAAM,mBAAqC,CAAC,WAA4B;AAC7E,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;;;ACzFA;AAAA,EACE;AAAA,OAKK;AAoCA,IAAM,gBAAgB,CAC3B,YACG;AACH,QAAM,UAAU,WAAW;AAAA,IACzB,UAAU,CAAC,WACT,YAAY,QAAQ,mCAAS,eAAe,mCAAS,eAAe;AAAA,IACtE,eAAe;AAAA,IACf,GAAG;AAAA,EACL,CAAC;AAED,UAAQ,cAAc;AACtB,UAAQ,KAAK;AAEb,SAAO;AACT;;;ACxDA;AAAA,EAME;AAAA,OAIK;AA4CA,IAAM,oBAAoB,CAC/B,YACG;AACH,QAAM,cAAc,eAA8B;AAAA,IAChD,UAAU,CAAC,WACT,YAAY,QAAQ,mCAAS,eAAe,mCAAS,eAAe;AAAA,IACtE,eAAe;AAAA,IACf,GAAG;AAAA,EACL,CAAC;AAED,cAAY,cAAc;AAC1B,cAAY,KAAK;AAEjB,SAAO;AACT;;;AC9DO,IAAMA,QAAO,cAAc;AAE3B,IAAM,WAAW,kBAAkB","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(schema, options?.schemaOptions, options?.resolverOptions),\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  createForm,\n  CreateFormProps,\n  FormProps,\n  WithFields,\n  FieldValues,\n  createStepForm,\n  StepsOptions,\n  UseStepFormProps,\n  Form,\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 CreateFormProps<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: UseStepFormProps<TSteps, TFieldValues, TContext> & {\n    steps: TSteps\n    ref?: React.ForwardedRef<HTMLFormElement>\n  }\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(schema, options?.schemaOptions, options?.resolverOptions),\n    fieldResolver: yupFieldResolver,\n    ...options,\n  })\n\n  YupStepForm.displayName = 'YupStepForm'\n  YupStepForm.id = 'YupStepForm'\n\n  return YupStepForm as YupStepFormType<FieldDefs>\n}\n","export * from './yup-resolver'\nexport { createYupForm, type YupFormType } from './create-yup-form'\nexport type { AnyObjectSchema } from './types'\nimport { createYupForm } from './create-yup-form'\nimport { createYupStepForm } from './create-yup-step-form'\n\nexport const Form = createYupForm()\n\nexport const StepForm = createYupStepForm()\n"]}
+{"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-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-modals/src/drawer.tsx","../../../saas-ui-modals/src/modal.tsx","../../../saas-ui-modals/src/menu.tsx","../../../saas-ui-modals/src/form.tsx","../../yup/src/create-yup-dialog.ts","../../yup/src/index.ts"],"names":["useBreakpointValue","Form","runIfFn","jsx","ModalFooter","Form2","ModalBody","Button","FormDialog"],"mappings":"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","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(schema, options?.schemaOptions, options?.resolverOptions),\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  createForm,\n  CreateFormProps,\n  FormProps,\n  WithFields,\n  FieldValues,\n  createStepForm,\n  StepsOptions,\n  UseStepFormProps,\n  Form,\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 CreateFormProps<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: UseStepFormProps<TSteps, TFieldValues, TContext> & {\n    steps: TSteps\n    ref?: React.ForwardedRef<HTMLFormElement>\n  }\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(schema, options?.schemaOptions, options?.resolverOptions),\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\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","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      | '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    ...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  }\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 {\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 * 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"]}

package/dist/zod/index.d.ts

@@ -1,10 +1,13 @@
+import * as _chakra_ui_button_dist_button from '@chakra-ui/button/dist/button';
+import * as _saas_ui_modals from '@saas-ui/modals';
+import { BaseModalProps } from '@saas-ui/modals';
 import * as React$1 from 'react';
 import React$1__default from 'react';
 import * as react_hook_form from 'react-hook-form';
-import { FieldValues, FieldPath, UseFormProps, SubmitHandler, RegisterOptions, UseFormReturn, UseFieldArrayReturn, WatchObserver, SubmitErrorHandler } from 'react-hook-form';
+import { FieldValues, FieldPath, UseFormProps, SubmitHandler, UseFieldArrayReturn, RegisterOptions, UseFormReturn, WatchObserver, SubmitErrorHandler } from 'react-hook-form';
 import { MaybeRenderProp } from '@chakra-ui/react-utils';
 import { UseStepperProps, UseStepperReturn } from '@saas-ui/core';
-import { HTMLChakraProps, TextareaProps, SwitchProps, CheckboxProps, FormControlProps, ResponsiveValue, InputProps, RadioGroupProps, MenuProps, SelectProps as SelectProps$1, UsePinInputProps, SystemProps, NumberInputProps as NumberInputProps$1, StackDirection, MenuItemOptionProps, ButtonProps, RadioProps } from '@chakra-ui/react';
+import { ButtonProps, HTMLChakraProps, TextareaProps, SwitchProps, CheckboxProps, ResponsiveValue, FormControlProps, InputProps, RadioGroupProps, MenuProps, SelectProps as SelectProps$1, UsePinInputProps, SystemProps, NumberInputProps as NumberInputProps$1, StackDirection, MenuItemOptionProps, RadioProps } from '@chakra-ui/react';
 import { FocusableElement } from '@chakra-ui/utils';
 import * as _chakra_ui_system_dist_system_types from '@chakra-ui/system/dist/system.types';
 import * as zod from 'zod';
@@ -160,6 +163,66 @@ interface SubmitButtonProps extends ButtonProps {
     disableIfInvalid?: boolean;
 }
 
+interface ObjectFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends BaseFieldProps {
+    name: TName;
+    children: React$1.ReactNode;
+    columns?: ResponsiveValue<number>;
+    spacing?: ResponsiveValue<string | number>;
+}
+
+interface UseArrayFieldReturn extends UseFieldArrayReturn {
+    /**
+     * The array field name
+     */
+    name: string;
+    /**
+     * The default value for new items
+     */
+    defaultValue: Record<string, any>;
+    /**
+     * Min amount of items
+     */
+    min?: number;
+    /**
+     * Max amount of items
+     */
+    max?: number;
+}
+interface ArrayFieldOptions<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> {
+    /**
+     * The field name
+     */
+    name: TName;
+    /**
+     * Default value for new values in the array
+     */
+    defaultValue?: Record<string, any>;
+    /**
+     * Default key name for rows, change this if your data uses a different 'id' field
+     * @default "id"
+     */
+    keyName?: string;
+    min?: number;
+    max?: number;
+}
+interface ArrayFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends ArrayFieldOptions<TFieldValues, TName>, Omit<BaseFieldProps<TFieldValues, TName>, 'name' | 'defaultValue' | 'children'> {
+    children: MaybeRenderProp<ArrayField[]>;
+}
+interface ArrayField {
+    id: string;
+    [key: string]: unknown;
+}
+/**
+ * The wrapper component that composes the default ArrayField functionality.
+ *
+ * @see Docs https://saas-ui.dev/docs/components/forms/array-field
+ */
+declare const ArrayField: ((props: ArrayFieldProps & {
+    ref?: React$1.ForwardedRef<UseArrayFieldReturn>;
+}) => React$1.ReactElement) & {
+    displayName: string;
+};
+
 type FieldOption = {
     label?: string;
     value: string;
@@ -229,66 +292,6 @@ interface DisplayIfProps<TFieldValues extends FieldValues = FieldValues, TName e
     condition?: (value: unknown, context: UseFormReturn<TFieldValues>) => boolean;
 }
 
-interface UseArrayFieldReturn extends UseFieldArrayReturn {
-    /**
-     * The array field name
-     */
-    name: string;
-    /**
-     * The default value for new items
-     */
-    defaultValue: Record<string, any>;
-    /**
-     * Min amount of items
-     */
-    min?: number;
-    /**
-     * Max amount of items
-     */
-    max?: number;
-}
-interface ArrayFieldOptions<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> {
-    /**
-     * The field name
-     */
-    name: TName;
-    /**
-     * Default value for new values in the array
-     */
-    defaultValue?: Record<string, any>;
-    /**
-     * Default key name for rows, change this if your data uses a different 'id' field
-     * @default "id"
-     */
-    keyName?: string;
-    min?: number;
-    max?: number;
-}
-interface ArrayFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends ArrayFieldOptions<TFieldValues, TName>, Omit<BaseFieldProps<TFieldValues, TName>, 'name' | 'defaultValue' | 'children'> {
-    children: MaybeRenderProp<ArrayField[]>;
-}
-interface ArrayField {
-    id: string;
-    [key: string]: unknown;
-}
-/**
- * The wrapper component that composes the default ArrayField functionality.
- *
- * @see Docs https://saas-ui.dev/docs/components/forms/array-field
- */
-declare const ArrayField: ((props: ArrayFieldProps & {
-    ref?: React$1.ForwardedRef<UseArrayFieldReturn>;
-}) => React$1.ReactElement) & {
-    displayName: string;
-};
-
-interface ObjectFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends BaseFieldProps {
-    name: TName;
-    children: React$1.ReactNode;
-    columns?: ResponsiveValue<number>;
-    spacing?: ResponsiveValue<string | number>;
-}
-
 interface FormRenderContext<TFieldValues extends FieldValues = FieldValues, TContext extends object = object, TFieldTypes = FieldProps<TFieldValues>> extends UseFormReturn<TFieldValues, TContext> {
     Field: React$1.FC<TFieldTypes & React$1.RefAttributes<FocusableElement>>;
     DisplayIf: React$1.FC<DisplayIfProps<TFieldValues>>;
@@ -404,8 +407,27 @@ declare const zodFieldResolver: <T extends zod.ZodTypeAny>(schema: T) => {
     getNestedFields(name: string): FieldProps$1[];
 };
 interface ZodMeta {
+    /**
+     * The label of the field
+     */
     label: string;
+    /**
+     * The type of the field
+     */
     type?: string;
+    /**
+     * Object field column count
+     */
+    columns?: number;
+    /**
+     * Array field min rows
+     */
+    min?: number;
+    /**
+     * Array field max rows
+     */
+    max?: number;
+    [key: string]: any;
 }
 declare const zodMeta: (meta: ZodMeta) => string;
 declare const zodParseMeta: (meta: string) => any;
@@ -423,6 +445,10 @@ type ZodFormType<FieldDefs, ExtraProps = object, ExtraOverrides = object, Type e
 };
 declare const createZodForm: <FieldDefs>(options?: CreateZodFormProps<FieldDefs> | undefined) => ZodFormType<FieldDefs, object, object, "zod">;
 
+declare function createZodFormDialog<FieldDefs = any, ExtraProps = object, ExtraOverrides = object>(Form: ZodFormType<FieldDefs, ExtraProps, ExtraOverrides>): ZodFormType<FieldDefs, ExtraProps & Omit<BaseModalProps, "children">, ExtraOverrides & DefaultFieldOverrides & {
+    cancel?: _chakra_ui_button_dist_button.ButtonProps | undefined;
+}>;
+
 declare const Form: ZodFormType<unknown, object, object, "zod">;
 declare const StepForm: (<TSteps extends {
     name: string;
@@ -547,5 +573,8 @@ declare const StepForm: (<TSteps extends {
     displayName?: string | undefined;
     id?: string | undefined;
 };
+declare const FormDialog: ZodFormType<unknown, object & Omit<_saas_ui_modals.BaseModalProps, "children">, object & DefaultFieldOverrides & {
+    cancel?: _chakra_ui_button_dist_button.ButtonProps | undefined;
+}>;
 
-export { Form, Options, StepForm, ZodFormType, ZodMeta, createZodForm, getFieldsFromSchema, getNestedSchema, zodFieldResolver, zodMeta, zodParseMeta };
+export { Form, FormDialog, Options, StepForm, ZodFormType, ZodMeta, createZodForm, createZodFormDialog, getFieldsFromSchema, getNestedSchema, zodFieldResolver, zodMeta, zodParseMeta };