@saas-ui/forms 2.0.0-next.14 → 2.0.0-next.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +18 -0
- package/dist/ajv/index.d.ts +14 -350
- package/dist/ajv/index.js.map +1 -1
- package/dist/ajv/index.mjs.map +1 -1
- package/dist/index.d.ts +101 -103
- package/dist/index.js +141 -130
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +141 -130
- package/dist/index.mjs.map +1 -1
- package/dist/yup/index.d.ts +14 -575
- package/dist/yup/index.js +4 -1
- package/dist/yup/index.js.map +1 -1
- package/dist/yup/index.mjs +4 -1
- package/dist/yup/index.mjs.map +1 -1
- package/dist/zod/index.d.ts +18 -580
- package/dist/zod/index.js +4 -1
- package/dist/zod/index.js.map +1 -1
- package/dist/zod/index.mjs +4 -1
- package/dist/zod/index.mjs.map +1 -1
- package/package.json +2 -2
- package/src/create-form.tsx +30 -16
- package/src/create-step-form.tsx +161 -0
- package/src/form.tsx +7 -5
- package/src/index.ts +13 -6
- package/src/step-form.tsx +55 -41
- package/src/types.ts +3 -2
- package/src/use-step-form.tsx +33 -5
package/dist/zod/index.js
CHANGED
@@ -75,11 +75,14 @@ var zodParseMeta = (meta) => {
|
|
75
75
|
}
|
76
76
|
};
|
77
77
|
var createZodForm = (options) => {
|
78
|
-
|
78
|
+
const ZodForm = forms.createForm({
|
79
79
|
resolver: (schema) => zod.zodResolver(schema, options == null ? void 0 : options.schemaOptions, options == null ? void 0 : options.resolverOptions),
|
80
80
|
fieldResolver: zodFieldResolver,
|
81
81
|
...options
|
82
82
|
});
|
83
|
+
ZodForm.displayName = "ZodForm";
|
84
|
+
ZodForm.id = "ZodForm";
|
85
|
+
return ZodForm;
|
83
86
|
};
|
84
87
|
|
85
88
|
// zod/src/index.ts
|
package/dist/zod/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../zod/src/zod-resolver.ts","../../zod/src/create-zod-form.ts","../../zod/src/index.ts"],"names":[],"mappings":";AACA,SAAS,mBAAmB;AAC5B,SAAS,WAAW;AAUpB,IAAM,UAAU,CAAC,UAAwB;AACvC,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;AAAA,IACL;AACE,aAAO;AAAA,EACX;AACF;AAEA,IAAM,iBAAiB,CAAC,OAAY,SAAiB;AA5BrD;AA6BE,UAAO,WAAM,KAAK,IAAI,MAAf,mBAAkB;AAC3B;AAQO,IAAM,sBAAsB,CAAC,WAAuC;AACzE,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,UAAmB,CAAC;AAC1B,QAAI,MAAM,KAAK,aAAa,YAAY;AACtC,cAAQ,MAAM,eAAe,OAAO,WAAW;AAC/C,cAAQ,MAAM,eAAe,OAAO,WAAW;AAAA,IACjD;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,GAAG;AAAA,IACL,CAAC;AAAA,EACH;AACA,SAAO;AACT;AAEO,IAAM,kBAAkB,CAAC,QAAsB,SAAiB;AACrE,SAAO,IAAI,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;AAOO,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;;;ACrGA;AAAA,EACE;AAAA,
|
1
|
+
{"version":3,"sources":["../../zod/src/zod-resolver.ts","../../zod/src/create-zod-form.ts","../../zod/src/index.ts"],"names":[],"mappings":";AACA,SAAS,mBAAmB;AAC5B,SAAS,WAAW;AAUpB,IAAM,UAAU,CAAC,UAAwB;AACvC,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;AAAA,IACL;AACE,aAAO;AAAA,EACX;AACF;AAEA,IAAM,iBAAiB,CAAC,OAAY,SAAiB;AA5BrD;AA6BE,UAAO,WAAM,KAAK,IAAI,MAAf,mBAAkB;AAC3B;AAQO,IAAM,sBAAsB,CAAC,WAAuC;AACzE,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,UAAmB,CAAC;AAC1B,QAAI,MAAM,KAAK,aAAa,YAAY;AACtC,cAAQ,MAAM,eAAe,OAAO,WAAW;AAC/C,cAAQ,MAAM,eAAe,OAAO,WAAW;AAAA,IACjD;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,GAAG;AAAA,IACL,CAAC;AAAA,EACH;AACA,SAAO;AACT;AAEO,IAAM,kBAAkB,CAAC,QAAsB,SAAiB;AACrE,SAAO,IAAI,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;AAOO,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;;;ACrGA;AAAA,EACE;AAAA,OAKK;AAkCA,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;;;ACzCO,IAAM,OAAO,cAAc","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 Options = {\n min?: number\n max?: number\n}\n\nconst getType = (field: z.ZodTypeAny) => {\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 '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 options: Options = {}\n if (field._def.typeName === 'ZodArray') {\n options.min = getArrayOption(field, 'minLength')\n options.max = getArrayOption(field, 'maxLength')\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 ...options,\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 label: string\n type?: string\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 FieldValues,\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 TFieldValues extends FieldValues = FieldValues, // placeholder\n TContext extends object = object,\n TSchema extends z.AnyZodObject = z.AnyZodObject\n>(\n props: WithFields<\n FormProps<z.infer<TSchema>, TContext, TSchema>,\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","export {\n zodResolver,\n getFieldsFromSchema,\n getNestedSchema,\n zodFieldResolver,\n zodMeta,\n zodParseMeta,\n} from './zod-resolver'\nexport type { Options, ZodMeta } from './zod-resolver'\nexport { createZodForm, type ZodFormType } from './create-zod-form'\n\nimport { createZodForm } from './create-zod-form'\n\nexport const Form = createZodForm()\n"]}
|
package/dist/zod/index.mjs
CHANGED
@@ -74,11 +74,14 @@ var zodParseMeta = (meta) => {
|
|
74
74
|
}
|
75
75
|
};
|
76
76
|
var createZodForm = (options) => {
|
77
|
-
|
77
|
+
const ZodForm = createForm({
|
78
78
|
resolver: (schema) => zodResolver(schema, options == null ? void 0 : options.schemaOptions, options == null ? void 0 : options.resolverOptions),
|
79
79
|
fieldResolver: zodFieldResolver,
|
80
80
|
...options
|
81
81
|
});
|
82
|
+
ZodForm.displayName = "ZodForm";
|
83
|
+
ZodForm.id = "ZodForm";
|
84
|
+
return ZodForm;
|
82
85
|
};
|
83
86
|
|
84
87
|
// zod/src/index.ts
|
package/dist/zod/index.mjs.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../zod/src/zod-resolver.ts","../../zod/src/create-zod-form.ts","../../zod/src/index.ts"],"names":[],"mappings":";AACA,SAAS,mBAAmB;AAC5B,SAAS,WAAW;AAUpB,IAAM,UAAU,CAAC,UAAwB;AACvC,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;AAAA,IACL;AACE,aAAO;AAAA,EACX;AACF;AAEA,IAAM,iBAAiB,CAAC,OAAY,SAAiB;AA5BrD;AA6BE,UAAO,WAAM,KAAK,IAAI,MAAf,mBAAkB;AAC3B;AAQO,IAAM,sBAAsB,CAAC,WAAuC;AACzE,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,UAAmB,CAAC;AAC1B,QAAI,MAAM,KAAK,aAAa,YAAY;AACtC,cAAQ,MAAM,eAAe,OAAO,WAAW;AAC/C,cAAQ,MAAM,eAAe,OAAO,WAAW;AAAA,IACjD;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,GAAG;AAAA,IACL,CAAC;AAAA,EACH;AACA,SAAO;AACT;AAEO,IAAM,kBAAkB,CAAC,QAAsB,SAAiB;AACrE,SAAO,IAAI,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;AAOO,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;;;ACrGA;AAAA,EACE;AAAA,
|
1
|
+
{"version":3,"sources":["../../zod/src/zod-resolver.ts","../../zod/src/create-zod-form.ts","../../zod/src/index.ts"],"names":[],"mappings":";AACA,SAAS,mBAAmB;AAC5B,SAAS,WAAW;AAUpB,IAAM,UAAU,CAAC,UAAwB;AACvC,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;AAAA,IACL;AACE,aAAO;AAAA,EACX;AACF;AAEA,IAAM,iBAAiB,CAAC,OAAY,SAAiB;AA5BrD;AA6BE,UAAO,WAAM,KAAK,IAAI,MAAf,mBAAkB;AAC3B;AAQO,IAAM,sBAAsB,CAAC,WAAuC;AACzE,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,UAAmB,CAAC;AAC1B,QAAI,MAAM,KAAK,aAAa,YAAY;AACtC,cAAQ,MAAM,eAAe,OAAO,WAAW;AAC/C,cAAQ,MAAM,eAAe,OAAO,WAAW;AAAA,IACjD;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,GAAG;AAAA,IACL,CAAC;AAAA,EACH;AACA,SAAO;AACT;AAEO,IAAM,kBAAkB,CAAC,QAAsB,SAAiB;AACrE,SAAO,IAAI,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;AAOO,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;;;ACrGA;AAAA,EACE;AAAA,OAKK;AAkCA,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;;;ACzCO,IAAM,OAAO,cAAc","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 Options = {\n min?: number\n max?: number\n}\n\nconst getType = (field: z.ZodTypeAny) => {\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 '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 options: Options = {}\n if (field._def.typeName === 'ZodArray') {\n options.min = getArrayOption(field, 'minLength')\n options.max = getArrayOption(field, 'maxLength')\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 ...options,\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 label: string\n type?: string\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 FieldValues,\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 TFieldValues extends FieldValues = FieldValues, // placeholder\n TContext extends object = object,\n TSchema extends z.AnyZodObject = z.AnyZodObject\n>(\n props: WithFields<\n FormProps<z.infer<TSchema>, TContext, TSchema>,\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","export {\n zodResolver,\n getFieldsFromSchema,\n getNestedSchema,\n zodFieldResolver,\n zodMeta,\n zodParseMeta,\n} from './zod-resolver'\nexport type { Options, ZodMeta } from './zod-resolver'\nexport { createZodForm, type ZodFormType } from './create-zod-form'\n\nimport { createZodForm } from './create-zod-form'\n\nexport const Form = createZodForm()\n"]}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@saas-ui/forms",
|
3
|
-
"version": "2.0.0-next.
|
3
|
+
"version": "2.0.0-next.16",
|
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.0.1",
|
107
|
-
"@saas-ui/core": "2.0.0-next.
|
107
|
+
"@saas-ui/core": "2.0.0-next.14",
|
108
108
|
"react-hook-form": "^7.43.9"
|
109
109
|
},
|
110
110
|
"peerDependencies": {
|
package/src/create-form.tsx
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
import React, { ForwardedRef } from 'react'
|
2
2
|
import { FieldsProvider } from './fields-context'
|
3
3
|
import { Form, FieldValues, FormProps, GetResolver } from './form'
|
4
|
-
import { WithFields } from './types'
|
4
|
+
import { DefaultFieldOverrides, WithFields } from './types'
|
5
5
|
import { objectFieldResolver } from './field-resolver'
|
6
6
|
import { GetFieldResolver } from './field-resolver'
|
7
7
|
import { forwardRef } from '@chakra-ui/react'
|
@@ -12,16 +12,37 @@ export interface CreateFormProps<FieldDefs> {
|
|
12
12
|
fields?: FieldDefs extends Record<string, React.FC<any>> ? FieldDefs : never
|
13
13
|
}
|
14
14
|
|
15
|
-
export
|
15
|
+
export type FormType<
|
16
|
+
FieldDefs,
|
17
|
+
ExtraProps = object,
|
18
|
+
ExtraOverrides = object
|
19
|
+
> = (<
|
20
|
+
TFieldValues extends FieldValues,
|
21
|
+
TContext extends object = object,
|
22
|
+
TSchema = unknown
|
23
|
+
>(
|
24
|
+
props: WithFields<
|
25
|
+
FormProps<TFieldValues, TContext, TSchema>,
|
26
|
+
FieldDefs,
|
27
|
+
ExtraOverrides
|
28
|
+
> & {
|
29
|
+
ref?: React.ForwardedRef<HTMLFormElement>
|
30
|
+
} & ExtraProps
|
31
|
+
) => React.ReactElement) & {
|
32
|
+
displayName?: string
|
33
|
+
id?: string
|
34
|
+
}
|
35
|
+
|
36
|
+
export function createForm<FieldDefs>({
|
16
37
|
resolver,
|
17
38
|
fieldResolver = objectFieldResolver,
|
18
39
|
fields,
|
19
40
|
}: CreateFormProps<FieldDefs> = {}) {
|
20
|
-
const
|
41
|
+
const DefaultForm = forwardRef(
|
21
42
|
<
|
22
43
|
TFieldValues extends FieldValues,
|
23
44
|
TContext extends object = object,
|
24
|
-
TSchema
|
45
|
+
TSchema = any
|
25
46
|
>(
|
26
47
|
props: WithFields<FormProps<TFieldValues, TContext, TSchema>, FieldDefs>,
|
27
48
|
ref: ForwardedRef<HTMLFormElement>
|
@@ -38,17 +59,10 @@ export function createForm<FieldDefs, Schema = any>({
|
|
38
59
|
</FieldsProvider>
|
39
60
|
)
|
40
61
|
}
|
41
|
-
) as
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
>(
|
46
|
-
props: WithFields<FormProps<TFieldValues, TContext, TSchema>, FieldDefs> & {
|
47
|
-
ref?: React.ForwardedRef<HTMLFormElement>
|
48
|
-
}
|
49
|
-
) => React.ReactElement) & {
|
50
|
-
displayName?: string
|
51
|
-
}
|
62
|
+
) as FormType<FieldDefs>
|
63
|
+
|
64
|
+
DefaultForm.displayName = 'Form'
|
65
|
+
DefaultForm.id = 'Form'
|
52
66
|
|
53
|
-
return
|
67
|
+
return DefaultForm
|
54
68
|
}
|
@@ -0,0 +1,161 @@
|
|
1
|
+
import { useMemo } from 'react'
|
2
|
+
import { forwardRef } from '@chakra-ui/react'
|
3
|
+
import { FormType } from './create-form'
|
4
|
+
import {
|
5
|
+
ArrayField,
|
6
|
+
DisplayIf,
|
7
|
+
FieldProps,
|
8
|
+
FieldValues,
|
9
|
+
Form,
|
10
|
+
ObjectField,
|
11
|
+
} from './'
|
12
|
+
import { Field } from './field'
|
13
|
+
import { StepFormProps, FormStep } from './step-form'
|
14
|
+
import {
|
15
|
+
StepFormProvider,
|
16
|
+
UseStepFormProps,
|
17
|
+
useStepForm,
|
18
|
+
} from './use-step-form'
|
19
|
+
import { YupFormType } from '../yup/src/create-yup-form'
|
20
|
+
import { ZodFormType } from '../zod/src/create-zod-form'
|
21
|
+
import { StepperProvider } from '@saas-ui/core'
|
22
|
+
import { runIfFn } from '@chakra-ui/utils'
|
23
|
+
|
24
|
+
// /**
|
25
|
+
// * @todo make this dynamic to support other schema types
|
26
|
+
// */
|
27
|
+
type MergeStepFormProps<T> = T extends YupFormType<
|
28
|
+
infer FieldDefs,
|
29
|
+
infer ExtraProps,
|
30
|
+
infer ExtraOverrides,
|
31
|
+
'yup'
|
32
|
+
>
|
33
|
+
? YupFormType<
|
34
|
+
FieldDefs,
|
35
|
+
ExtraProps & Omit<StepFormProps, 'children'>,
|
36
|
+
ExtraOverrides
|
37
|
+
>
|
38
|
+
: T extends ZodFormType<
|
39
|
+
infer FieldDefs,
|
40
|
+
infer ExtraProps,
|
41
|
+
infer ExtraOverrides,
|
42
|
+
'zod'
|
43
|
+
>
|
44
|
+
? ZodFormType<
|
45
|
+
FieldDefs,
|
46
|
+
ExtraProps & Omit<StepFormProps, 'children'>,
|
47
|
+
ExtraOverrides
|
48
|
+
>
|
49
|
+
: T extends FormType<infer FieldDefs, infer ExtraProps, infer ExtraOverrides>
|
50
|
+
? FormType<
|
51
|
+
FieldDefs,
|
52
|
+
ExtraProps & Omit<StepFormProps, 'children'>,
|
53
|
+
ExtraOverrides
|
54
|
+
>
|
55
|
+
: never
|
56
|
+
|
57
|
+
export type DefaultFormType<
|
58
|
+
FieldDefs = any,
|
59
|
+
ExtraProps = object,
|
60
|
+
ExtraOverrides = object
|
61
|
+
> = (<
|
62
|
+
TFieldValues extends Record<string, any> = any,
|
63
|
+
TContext extends object = object,
|
64
|
+
TSchema = unknown
|
65
|
+
>(
|
66
|
+
props: any
|
67
|
+
) => React.ReactElement) & {
|
68
|
+
displayName?: string
|
69
|
+
id?: string
|
70
|
+
}
|
71
|
+
|
72
|
+
// export function createStepForm<
|
73
|
+
// FieldDefs = any,
|
74
|
+
// ExtraProps = object,
|
75
|
+
// ExtraOverrides = object,
|
76
|
+
// TFormType extends DefaultFormType<
|
77
|
+
// FieldDefs,
|
78
|
+
// ExtraProps,
|
79
|
+
// ExtraOverrides
|
80
|
+
// > = DefaultFormType<FieldDefs, ExtraProps, ExtraOverrides>
|
81
|
+
// >(Form: TFormType) {
|
82
|
+
// const StepForm = forwardRef<any, 'div'>((props, ref) => {
|
83
|
+
// const { children, ...rest } = props
|
84
|
+
|
85
|
+
// const stepper = useStepForm(props)
|
86
|
+
|
87
|
+
// const { getFormProps, ...ctx } = stepper
|
88
|
+
|
89
|
+
// const context = useMemo(() => ctx, [ctx])
|
90
|
+
|
91
|
+
// return (
|
92
|
+
// <StepperProvider value={context}>
|
93
|
+
// <StepFormProvider value={context}>
|
94
|
+
// <Form ref={ref} {...rest} {...getFormProps()}>
|
95
|
+
// {runIfFn(children, {
|
96
|
+
// ...stepper,
|
97
|
+
// FormStep,
|
98
|
+
// Field,
|
99
|
+
// })}
|
100
|
+
// </Form>
|
101
|
+
// </StepFormProvider>
|
102
|
+
// </StepperProvider>
|
103
|
+
// )
|
104
|
+
// }) as MergeStepFormProps<TFormType>
|
105
|
+
|
106
|
+
// StepForm.displayName = `Step${Form.displayName || Form.name}`
|
107
|
+
|
108
|
+
// return StepForm
|
109
|
+
// }
|
110
|
+
|
111
|
+
export function createStepForm<
|
112
|
+
FieldDefs = any,
|
113
|
+
ExtraProps = object,
|
114
|
+
ExtraOverrides = object,
|
115
|
+
TFormType extends DefaultFormType<
|
116
|
+
FieldDefs,
|
117
|
+
ExtraProps,
|
118
|
+
ExtraOverrides
|
119
|
+
> = DefaultFormType<FieldDefs, ExtraProps, ExtraOverrides>
|
120
|
+
>(Form: TFormType) {
|
121
|
+
const StepForm = forwardRef<any, 'div'>((props, ref) => {
|
122
|
+
const { children, ...rest } = props
|
123
|
+
|
124
|
+
const stepper = useStepForm(props)
|
125
|
+
|
126
|
+
const { getFormProps, ...ctx } = stepper
|
127
|
+
|
128
|
+
const context = useMemo(() => ctx, [ctx])
|
129
|
+
|
130
|
+
return (
|
131
|
+
<StepperProvider value={context}>
|
132
|
+
<StepFormProvider value={context}>
|
133
|
+
<Form ref={ref} {...rest} {...getFormProps()}>
|
134
|
+
{runIfFn(children, {
|
135
|
+
...stepper,
|
136
|
+
Field: Field as any,
|
137
|
+
DisplayIf: DisplayIf as any,
|
138
|
+
ArrayField: ArrayField as any,
|
139
|
+
ObjectField: ObjectField as any,
|
140
|
+
})}
|
141
|
+
</Form>
|
142
|
+
</StepFormProvider>
|
143
|
+
</StepperProvider>
|
144
|
+
)
|
145
|
+
}) as (<
|
146
|
+
TFieldValues extends FieldValues = FieldValues,
|
147
|
+
TContext extends object = object,
|
148
|
+
TFieldTypes = FieldProps<TFieldValues>
|
149
|
+
>(
|
150
|
+
props: UseStepFormProps<TFieldValues, TContext, TFieldTypes> & {
|
151
|
+
ref?: React.ForwardedRef<HTMLFormElement>
|
152
|
+
}
|
153
|
+
) => React.ReactElement) & {
|
154
|
+
displayName?: string
|
155
|
+
id?: string
|
156
|
+
}
|
157
|
+
|
158
|
+
StepForm.displayName = `Step${Form.displayName || Form.name}`
|
159
|
+
|
160
|
+
return StepForm
|
161
|
+
}
|
package/src/form.tsx
CHANGED
@@ -47,7 +47,7 @@ export interface FormRenderContext<
|
|
47
47
|
interface FormOptions<
|
48
48
|
TFieldValues extends FieldValues = FieldValues,
|
49
49
|
TContext extends object = object,
|
50
|
-
TSchema =
|
50
|
+
TSchema = unknown,
|
51
51
|
TFieldTypes = FieldProps<TFieldValues>
|
52
52
|
> {
|
53
53
|
/**
|
@@ -89,7 +89,7 @@ interface FormOptions<
|
|
89
89
|
export interface FormProps<
|
90
90
|
TFieldValues extends FieldValues = FieldValues,
|
91
91
|
TContext extends object = object,
|
92
|
-
TSchema =
|
92
|
+
TSchema = unknown,
|
93
93
|
TFieldTypes = FieldProps<TFieldValues>
|
94
94
|
> extends UseFormProps<TFieldValues, TContext>,
|
95
95
|
Omit<
|
@@ -200,10 +200,12 @@ export const Form = forwardRef(
|
|
200
200
|
</FormProvider>
|
201
201
|
)
|
202
202
|
}
|
203
|
-
) as
|
203
|
+
) as FormComponent
|
204
|
+
|
205
|
+
export type FormComponent = (<
|
204
206
|
TFieldValues extends FieldValues,
|
205
207
|
TContext extends object = object,
|
206
|
-
TSchema =
|
208
|
+
TSchema = unknown,
|
207
209
|
TFieldTypes = FieldProps<TFieldValues>
|
208
210
|
>(
|
209
211
|
props: FormProps<TFieldValues, TContext, TSchema, TFieldTypes> & {
|
@@ -219,7 +221,7 @@ export type GetResolver = <
|
|
219
221
|
TFieldValues extends FieldValues,
|
220
222
|
TContext extends object
|
221
223
|
>(
|
222
|
-
schema:
|
224
|
+
schema: unknown
|
223
225
|
) => (
|
224
226
|
values: TFieldValues,
|
225
227
|
context: TContext | undefined,
|
package/src/index.ts
CHANGED
@@ -43,22 +43,29 @@ export type {
|
|
43
43
|
WithFields,
|
44
44
|
BaseFieldProps,
|
45
45
|
FieldOptions,
|
46
|
+
DefaultFieldOverrides,
|
46
47
|
} from './types'
|
47
48
|
|
48
|
-
export { createForm, type CreateFormProps } from './create-form'
|
49
|
+
export { createForm, type CreateFormProps, type FormType } from './create-form'
|
49
50
|
export { createField, type CreateFieldOptions } from './create-field'
|
50
51
|
|
51
|
-
export {
|
52
|
-
|
53
|
-
type FormProps,
|
54
|
-
type FormRenderContext,
|
55
|
-
} from './form'
|
52
|
+
export { Form as BaseForm } from './form'
|
53
|
+
export type { FormProps, FormRenderContext, FormComponent } from './form'
|
56
54
|
|
57
55
|
export { FormProvider, useFormContext } from './form-context'
|
58
56
|
|
59
57
|
import { createForm } from './create-form'
|
58
|
+
import { createStepForm } from './create-step-form'
|
59
|
+
|
60
60
|
export const Form = createForm()
|
61
61
|
|
62
|
+
/**
|
63
|
+
* The wrapper component provides context, state, and focus management.
|
64
|
+
*
|
65
|
+
* @see Docs https://saas-ui.dev/docs/components/forms/step-form
|
66
|
+
*/
|
67
|
+
export const StepForm = createStepForm(Form)
|
68
|
+
|
62
69
|
export type {
|
63
70
|
BatchFieldArrayUpdate,
|
64
71
|
ChangeHandler,
|
package/src/step-form.tsx
CHANGED
@@ -22,7 +22,9 @@ import {
|
|
22
22
|
StepperProps,
|
23
23
|
} from '@saas-ui/core'
|
24
24
|
|
25
|
-
import { Form } from './
|
25
|
+
import { Form } from './'
|
26
|
+
import { Field } from './field'
|
27
|
+
|
26
28
|
import { SubmitButton } from './submit-button'
|
27
29
|
|
28
30
|
import {
|
@@ -32,48 +34,60 @@ import {
|
|
32
34
|
UseStepFormProps,
|
33
35
|
FormStepSubmitHandler,
|
34
36
|
} from './use-step-form'
|
37
|
+
import { FieldProps } from './types'
|
38
|
+
import { DisplayIf } from './display-if'
|
39
|
+
import { ArrayField } from './array-field'
|
40
|
+
import { ObjectField } from './object-field'
|
41
|
+
import { createStepForm } from './create-step-form'
|
35
42
|
|
36
43
|
export interface StepFormProps<
|
37
44
|
TFieldValues extends FieldValues = FieldValues,
|
38
|
-
TContext extends object = object
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
45
|
+
TContext extends object = object,
|
46
|
+
TFieldTypes = FieldProps<TFieldValues>
|
47
|
+
> extends UseStepFormProps<TFieldValues, TContext, TFieldTypes> {}
|
48
|
+
|
49
|
+
// export const StepForm = React.forwardRef(
|
50
|
+
// <
|
51
|
+
// TFieldValues extends FieldValues = FieldValues,
|
52
|
+
// TContext extends object = object,
|
53
|
+
// TFieldTypes = FieldProps<TFieldValues>
|
54
|
+
// >(
|
55
|
+
// props: StepFormProps<TFieldValues, TContext, TFieldTypes>,
|
56
|
+
// ref: React.ForwardedRef<HTMLFormElement>
|
57
|
+
// ) => {
|
58
|
+
// const { children, ...rest } = props
|
59
|
+
|
60
|
+
// const stepper = useStepForm(props)
|
61
|
+
|
62
|
+
// const { getFormProps, ...ctx } = stepper
|
63
|
+
|
64
|
+
// const context = React.useMemo(() => ctx, [ctx])
|
65
|
+
|
66
|
+
// return (
|
67
|
+
// <StepperProvider value={context}>
|
68
|
+
// <StepFormProvider value={context}>
|
69
|
+
// <Form ref={ref} {...rest} {...getFormProps()}>
|
70
|
+
// {runIfFn(children, {
|
71
|
+
// ...stepper,
|
72
|
+
// Field: Field as any,
|
73
|
+
// DisplayIf: DisplayIf as any,
|
74
|
+
// ArrayField: ArrayField as any,
|
75
|
+
// ObjectField: ObjectField as any,
|
76
|
+
// })}
|
77
|
+
// </Form>
|
78
|
+
// </StepFormProvider>
|
79
|
+
// </StepperProvider>
|
80
|
+
// )
|
81
|
+
// }
|
82
|
+
// ) as <
|
83
|
+
// TFieldValues extends FieldValues = FieldValues,
|
84
|
+
// TContext extends object = object,
|
85
|
+
// TFieldTypes = FieldProps<TFieldValues>
|
86
|
+
// >(
|
87
|
+
// props: UseStepFormProps<TFieldValues, TContext, TFieldTypes> & {
|
88
|
+
// ref?: React.ForwardedRef<HTMLFormElement>
|
89
|
+
// }
|
90
|
+
// ) => React.ReactElement
|
77
91
|
|
78
92
|
export interface FormStepOptions {
|
79
93
|
/**
|
@@ -181,7 +195,7 @@ export const PrevButton: React.FC<ButtonProps> = (props) => {
|
|
181
195
|
return (
|
182
196
|
<Button
|
183
197
|
isDisabled={isFirstStep || isCompleted}
|
184
|
-
|
198
|
+
children="Back"
|
185
199
|
{...props}
|
186
200
|
className={cx('sui-form__prev-button', props.className)}
|
187
201
|
onClick={callAllHandlers(props.onClick, prevStep)}
|
package/src/types.ts
CHANGED
@@ -133,12 +133,13 @@ export type FieldOverrides<
|
|
133
133
|
|
134
134
|
export type WithFields<
|
135
135
|
TFormProps extends FormProps<any, any, any, any>,
|
136
|
-
FieldDefs
|
136
|
+
FieldDefs,
|
137
|
+
ExtraOverrides = object
|
137
138
|
> = TFormProps extends FormProps<infer TFieldValues, infer TContext>
|
138
139
|
? Omit<TFormProps, 'children' | 'fields'> & {
|
139
140
|
children?: FormChildren<FieldDefs, TFieldValues, TContext>
|
140
141
|
fields?: FieldOverrides<FieldDefs, TFieldValues> & {
|
141
142
|
submit?: SubmitButtonProps
|
142
|
-
}
|
143
|
+
} & ExtraOverrides
|
143
144
|
}
|
144
145
|
: never
|
package/src/use-step-form.tsx
CHANGED
@@ -34,12 +34,36 @@ export const [StepFormProvider, useStepFormContext] =
|
|
34
34
|
})
|
35
35
|
|
36
36
|
import { FormProps } from './form'
|
37
|
+
import { FormStepProps } from './step-form'
|
38
|
+
import { FieldProps } from './types'
|
39
|
+
import { FocusableElement } from '@chakra-ui/utils'
|
40
|
+
import { DisplayIfProps } from './display-if'
|
41
|
+
import { ArrayFieldProps } from './array-field'
|
42
|
+
import { UseArrayFieldReturn } from './use-array-field'
|
43
|
+
import { ObjectFieldProps } from './object-field'
|
44
|
+
|
45
|
+
interface StepFormRenderContext<
|
46
|
+
TFieldValues extends FieldValues = FieldValues,
|
47
|
+
TContext extends object = object,
|
48
|
+
TFieldTypes = FieldProps<TFieldValues>
|
49
|
+
> extends UseStepFormReturn<TFieldValues> {
|
50
|
+
Field: React.FC<TFieldTypes & React.RefAttributes<FocusableElement>>
|
51
|
+
DisplayIf: React.FC<DisplayIfProps<TFieldValues>>
|
52
|
+
ArrayField: React.FC<
|
53
|
+
ArrayFieldProps<TFieldValues> & React.RefAttributes<UseArrayFieldReturn>
|
54
|
+
>
|
55
|
+
ObjectField: React.FC<ObjectFieldProps<TFieldValues>>
|
56
|
+
}
|
37
57
|
|
38
58
|
export interface UseStepFormProps<
|
39
|
-
TFieldValues extends FieldValues = FieldValues
|
59
|
+
TFieldValues extends FieldValues = FieldValues,
|
60
|
+
TContext extends object = object,
|
61
|
+
TFieldTypes = FieldProps<TFieldValues>
|
40
62
|
> extends Omit<UseStepperProps, 'onChange'>,
|
41
|
-
Omit<FormProps<TFieldValues>, 'children'> {
|
42
|
-
children: MaybeRenderProp<
|
63
|
+
Omit<FormProps<TFieldValues, TContext, any, TFieldTypes>, 'children'> {
|
64
|
+
children: MaybeRenderProp<
|
65
|
+
StepFormRenderContext<TFieldValues, TContext, TFieldTypes>
|
66
|
+
>
|
43
67
|
}
|
44
68
|
|
45
69
|
export interface UseStepFormReturn<
|
@@ -54,8 +78,12 @@ export interface UseStepFormReturn<
|
|
54
78
|
steps: Record<string, any>
|
55
79
|
}
|
56
80
|
|
57
|
-
export function useStepForm<
|
58
|
-
|
81
|
+
export function useStepForm<
|
82
|
+
TFieldValues extends FieldValues = FieldValues,
|
83
|
+
TContext extends object = object,
|
84
|
+
TFieldTypes = FieldProps<TFieldValues>
|
85
|
+
>(
|
86
|
+
props: UseStepFormProps<TFieldValues, TContext, TFieldTypes>
|
59
87
|
): UseStepFormReturn<TFieldValues> {
|
60
88
|
const { onChange, ...rest } = props
|
61
89
|
const stepper = useStepper(rest)
|