@tanstack/react-form 1.23.8 → 1.25.0

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.
Files changed (124) hide show
  1. package/dist/cjs/createFormHook.cjs +1 -0
  2. package/dist/cjs/createFormHook.cjs.map +1 -1
  3. package/dist/cjs/index.cjs +0 -2
  4. package/dist/cjs/index.cjs.map +1 -1
  5. package/dist/cjs/index.d.cts +0 -1
  6. package/dist/cjs/types.d.cts +2 -1
  7. package/dist/cjs/useField.cjs +1 -0
  8. package/dist/cjs/useField.cjs.map +1 -1
  9. package/dist/cjs/useFieldGroup.cjs +1 -0
  10. package/dist/cjs/useFieldGroup.cjs.map +1 -1
  11. package/dist/cjs/useForm.cjs +1 -0
  12. package/dist/cjs/useForm.cjs.map +1 -1
  13. package/dist/esm/createFormHook.js +1 -0
  14. package/dist/esm/createFormHook.js.map +1 -1
  15. package/dist/esm/index.d.ts +0 -1
  16. package/dist/esm/index.js +1 -3
  17. package/dist/esm/index.js.map +1 -1
  18. package/dist/esm/types.d.ts +2 -1
  19. package/dist/esm/useField.js +1 -0
  20. package/dist/esm/useField.js.map +1 -1
  21. package/dist/esm/useFieldGroup.js +1 -0
  22. package/dist/esm/useFieldGroup.js.map +1 -1
  23. package/dist/esm/useForm.js +1 -0
  24. package/dist/esm/useForm.js.map +1 -1
  25. package/package.json +4 -38
  26. package/src/createFormHook.tsx +1 -0
  27. package/src/index.ts +0 -1
  28. package/src/types.ts +21 -0
  29. package/src/useField.tsx +3 -1
  30. package/src/useFieldGroup.tsx +2 -0
  31. package/src/useForm.tsx +2 -0
  32. package/dist/cjs/nextjs/createServerValidate.cjs +0 -51
  33. package/dist/cjs/nextjs/createServerValidate.cjs.map +0 -1
  34. package/dist/cjs/nextjs/createServerValidate.d.cts +0 -9
  35. package/dist/cjs/nextjs/error.cjs +0 -11
  36. package/dist/cjs/nextjs/error.cjs.map +0 -1
  37. package/dist/cjs/nextjs/error.d.cts +0 -10
  38. package/dist/cjs/nextjs/index.cjs +0 -15
  39. package/dist/cjs/nextjs/index.cjs.map +0 -1
  40. package/dist/cjs/nextjs/index.d.cts +0 -4
  41. package/dist/cjs/nextjs/types.d.cts +0 -2
  42. package/dist/cjs/remix/createServerValidate.cjs +0 -51
  43. package/dist/cjs/remix/createServerValidate.cjs.map +0 -1
  44. package/dist/cjs/remix/createServerValidate.d.cts +0 -9
  45. package/dist/cjs/remix/error.cjs +0 -11
  46. package/dist/cjs/remix/error.cjs.map +0 -1
  47. package/dist/cjs/remix/error.d.cts +0 -10
  48. package/dist/cjs/remix/index.cjs +0 -15
  49. package/dist/cjs/remix/index.cjs.map +0 -1
  50. package/dist/cjs/remix/index.d.cts +0 -4
  51. package/dist/cjs/remix/types.d.cts +0 -2
  52. package/dist/cjs/start/createServerValidate.cjs +0 -53
  53. package/dist/cjs/start/createServerValidate.cjs.map +0 -1
  54. package/dist/cjs/start/createServerValidate.d.cts +0 -7
  55. package/dist/cjs/start/error.cjs +0 -12
  56. package/dist/cjs/start/error.cjs.map +0 -1
  57. package/dist/cjs/start/error.d.cts +0 -12
  58. package/dist/cjs/start/getFormData.cjs +0 -18
  59. package/dist/cjs/start/getFormData.cjs.map +0 -1
  60. package/dist/cjs/start/getFormData.d.cts +0 -13
  61. package/dist/cjs/start/index.cjs +0 -10
  62. package/dist/cjs/start/index.cjs.map +0 -1
  63. package/dist/cjs/start/index.d.cts +0 -4
  64. package/dist/cjs/start/types.d.cts +0 -2
  65. package/dist/cjs/start/utils.cjs +0 -21
  66. package/dist/cjs/start/utils.cjs.map +0 -1
  67. package/dist/cjs/start/utils.d.cts +0 -3
  68. package/dist/cjs/useTransform.cjs +0 -10
  69. package/dist/cjs/useTransform.cjs.map +0 -1
  70. package/dist/cjs/useTransform.d.cts +0 -2
  71. package/dist/esm/nextjs/createServerValidate.d.ts +0 -9
  72. package/dist/esm/nextjs/createServerValidate.js +0 -51
  73. package/dist/esm/nextjs/createServerValidate.js.map +0 -1
  74. package/dist/esm/nextjs/error.d.ts +0 -10
  75. package/dist/esm/nextjs/error.js +0 -11
  76. package/dist/esm/nextjs/error.js.map +0 -1
  77. package/dist/esm/nextjs/index.d.ts +0 -4
  78. package/dist/esm/nextjs/index.js +0 -9
  79. package/dist/esm/nextjs/index.js.map +0 -1
  80. package/dist/esm/nextjs/types.d.ts +0 -2
  81. package/dist/esm/remix/createServerValidate.d.ts +0 -9
  82. package/dist/esm/remix/createServerValidate.js +0 -51
  83. package/dist/esm/remix/createServerValidate.js.map +0 -1
  84. package/dist/esm/remix/error.d.ts +0 -10
  85. package/dist/esm/remix/error.js +0 -11
  86. package/dist/esm/remix/error.js.map +0 -1
  87. package/dist/esm/remix/index.d.ts +0 -4
  88. package/dist/esm/remix/index.js +0 -9
  89. package/dist/esm/remix/index.js.map +0 -1
  90. package/dist/esm/remix/types.d.ts +0 -2
  91. package/dist/esm/start/createServerValidate.d.ts +0 -7
  92. package/dist/esm/start/createServerValidate.js +0 -53
  93. package/dist/esm/start/createServerValidate.js.map +0 -1
  94. package/dist/esm/start/error.d.ts +0 -12
  95. package/dist/esm/start/error.js +0 -12
  96. package/dist/esm/start/error.js.map +0 -1
  97. package/dist/esm/start/getFormData.d.ts +0 -13
  98. package/dist/esm/start/getFormData.js +0 -18
  99. package/dist/esm/start/getFormData.js.map +0 -1
  100. package/dist/esm/start/index.d.ts +0 -4
  101. package/dist/esm/start/index.js +0 -10
  102. package/dist/esm/start/index.js.map +0 -1
  103. package/dist/esm/start/types.d.ts +0 -2
  104. package/dist/esm/start/utils.d.ts +0 -3
  105. package/dist/esm/start/utils.js +0 -21
  106. package/dist/esm/start/utils.js.map +0 -1
  107. package/dist/esm/useTransform.d.ts +0 -2
  108. package/dist/esm/useTransform.js +0 -10
  109. package/dist/esm/useTransform.js.map +0 -1
  110. package/src/nextjs/createServerValidate.ts +0 -134
  111. package/src/nextjs/error.ts +0 -25
  112. package/src/nextjs/index.ts +0 -5
  113. package/src/nextjs/types.ts +0 -21
  114. package/src/remix/createServerValidate.ts +0 -134
  115. package/src/remix/error.ts +0 -25
  116. package/src/remix/index.ts +0 -5
  117. package/src/remix/types.ts +0 -21
  118. package/src/start/createServerValidate.tsx +0 -138
  119. package/src/start/error.ts +0 -28
  120. package/src/start/getFormData.tsx +0 -22
  121. package/src/start/index.ts +0 -4
  122. package/src/start/types.ts +0 -21
  123. package/src/start/utils.ts +0 -23
  124. package/src/useTransform.ts +0 -17
@@ -1 +1 @@
1
- {"version":3,"file":"useField.js","sources":["../../src/useField.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport { FieldApi, functionalUpdate } from '@tanstack/form-core'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\nimport type {\n DeepKeys,\n DeepValue,\n FieldAsyncValidateOrFn,\n FieldValidateOrFn,\n FieldValidators,\n FormAsyncValidateOrFn,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type { FunctionComponent, ReactNode } from 'react'\nimport type { UseFieldOptions, UseFieldOptionsBound } from './types'\n\ninterface ReactFieldApi<\n TParentData,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n> {\n /**\n * A pre-bound and type-safe sub-field component using this field as a root.\n */\n Field: FieldComponent<\n TParentData,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n >\n}\n\n/**\n * A type representing a hook for using a field in a form with the given form data type.\n *\n * A function that takes an optional object with a `name` property and field options, and returns a `FieldApi` instance for the specified field.\n */\nexport type UseField<\n TParentData,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n> = <\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n>(\n opts: UseFieldOptionsBound<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n >,\n) => FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n>\n\n/**\n * A hook for managing a field in a form.\n * @param opts An object with field options.\n *\n * @returns The `FieldApi` instance for the specified field.\n */\nexport function useField<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n>(\n opts: UseFieldOptions<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n >,\n) {\n const [fieldApi] = useState(() => {\n const api = new FieldApi({\n ...opts,\n form: opts.form,\n name: opts.name,\n })\n\n const extendedApi: typeof api &\n ReactFieldApi<\n TParentData,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > = api as never\n\n extendedApi.Field = Field as never\n\n return extendedApi\n })\n\n useIsomorphicLayoutEffect(fieldApi.mount, [fieldApi])\n\n /**\n * fieldApi.update should not have any side effects. Think of it like a `useRef`\n * that we need to keep updated every render with the most up-to-date information.\n */\n useIsomorphicLayoutEffect(() => {\n fieldApi.update(opts)\n })\n\n useStore(\n fieldApi.store,\n opts.mode === 'array'\n ? (state) => {\n return [\n state.meta,\n Object.keys((state.value as unknown) ?? []).length,\n ]\n }\n : undefined,\n )\n\n return fieldApi\n}\n\n/**\n * @param children A render function that takes a field API instance and returns a React element.\n */\ninterface FieldComponentProps<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n ExtendedApi = {},\n> extends UseFieldOptions<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > {\n children: (\n fieldApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > &\n ExtendedApi,\n ) => ReactNode\n}\n\ninterface FieldComponentBoundProps<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n ExtendedApi = {},\n> extends UseFieldOptionsBound<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n > {\n children: (\n fieldApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > &\n ExtendedApi,\n ) => ReactNode\n}\n\n/**\n * A type alias representing a field component for a specific form data type.\n */\nexport type FieldComponent<\n in out TParentData,\n in out TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnChangeAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnBlurAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnSubmitAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnDynamicAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n in out TPatentSubmitMeta,\n in out ExtendedApi = {},\n> = <\n const TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n>({\n children,\n ...fieldOptions\n}: FieldComponentBoundProps<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta,\n ExtendedApi\n>) => ReactNode\n\n/**\n * A type alias representing a field component for a form lens data type.\n */\nexport type LensFieldComponent<\n in out TLensData,\n in out TParentSubmitMeta,\n in out ExtendedApi = {},\n> = <\n const TName extends DeepKeys<TLensData>,\n TData extends DeepValue<TLensData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnChange extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n>({\n children,\n ...fieldOptions\n}: Omit<\n FieldComponentBoundProps<\n unknown,\n string,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n TParentSubmitMeta,\n ExtendedApi\n >,\n 'name' | 'validators'\n> & {\n name: TName\n validators?: Omit<\n FieldValidators<\n unknown,\n string,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n >,\n 'onChangeListenTo' | 'onBlurListenTo'\n > & {\n /**\n * An optional list of field names that should trigger this field's `onChange` and `onChangeAsync` events when its value changes\n */\n onChangeListenTo?: DeepKeys<TLensData>[]\n /**\n * An optional list of field names that should trigger this field's `onBlur` and `onBlurAsync` events when its value changes\n */\n onBlurListenTo?: DeepKeys<TLensData>[]\n }\n}) => ReactNode\n\n/**\n * A function component that takes field options and a render function as children and returns a React component.\n *\n * The `Field` component uses the `useField` hook internally to manage the field instance.\n */\nexport const Field = (<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n>({\n children,\n ...fieldOptions\n}: FieldComponentProps<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n>): ReactNode => {\n const fieldApi = useField(fieldOptions as any)\n\n const jsxToDisplay = useMemo(\n () => functionalUpdate(children, fieldApi as any),\n /**\n * The reason this exists is to fix an issue with the React Compiler.\n * Namely, functionalUpdate is memoized where it checks for `fieldApi`, which is a static type.\n * This means that when `state.value` changes, it does not trigger a re-render. The useMemo explicitly fixes this problem\n */\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [children, fieldApi, fieldApi.state.value, fieldApi.state.meta],\n )\n return (<>{jsxToDisplay}</>) as never\n}) satisfies FunctionComponent<\n FieldComponentProps<\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any\n >\n>\n"],"names":[],"mappings":";;;;;AAsIO,SAAS,SAiCd,MAyBA;AACA,QAAM,CAAC,QAAQ,IAAI,SAAS,MAAM;AAChC,UAAM,MAAM,IAAI,SAAS;AAAA,MACvB,GAAG;AAAA,MACH,MAAM,KAAK;AAAA,MACX,MAAM,KAAK;AAAA,IAAA,CACZ;AAED,UAAM,cAcA;AAEN,gBAAY,QAAQ;AAEpB,WAAO;AAAA,EACT,CAAC;AAED,4BAA0B,SAAS,OAAO,CAAC,QAAQ,CAAC;AAMpD,4BAA0B,MAAM;AAC9B,aAAS,OAAO,IAAI;AAAA,EACtB,CAAC;AAED;AAAA,IACE,SAAS;AAAA,IACT,KAAK,SAAS,UACV,CAAC,UAAU;AACT,aAAO;AAAA,QACL,MAAM;AAAA,QACN,OAAO,KAAM,MAAM,SAAqB,CAAA,CAAE,EAAE;AAAA,MAAA;AAAA,IAEhD,IACA;AAAA,EAAA;AAGN,SAAO;AACT;AAkVO,MAAM,SAAS,CAgCpB;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAwBiB;AACf,QAAM,WAAW,SAAS,YAAmB;AAE7C,QAAM,eAAe;AAAA,IACnB,MAAM,iBAAiB,UAAU,QAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOhD,CAAC,UAAU,UAAU,SAAS,MAAM,OAAO,SAAS,MAAM,IAAI;AAAA,EAAA;AAEhE,yCAAW,UAAA,aAAA,CAAa;AAC1B;"}
1
+ {"version":3,"file":"useField.js","sources":["../../src/useField.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, useState } from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport { FieldApi, functionalUpdate } from '@tanstack/form-core'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\nimport type {\n DeepKeys,\n DeepValue,\n FieldAsyncValidateOrFn,\n FieldValidateOrFn,\n FieldValidators,\n FormAsyncValidateOrFn,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type { FunctionComponent, ReactNode } from 'react'\nimport type { UseFieldOptions, UseFieldOptionsBound } from './types'\n\ninterface ReactFieldApi<\n TParentData,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n> {\n /**\n * A pre-bound and type-safe sub-field component using this field as a root.\n */\n Field: FieldComponent<\n TParentData,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n >\n}\n\n/**\n * A type representing a hook for using a field in a form with the given form data type.\n *\n * A function that takes an optional object with a `name` property and field options, and returns a `FieldApi` instance for the specified field.\n */\nexport type UseField<\n TParentData,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n> = <\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n>(\n opts: UseFieldOptionsBound<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n >,\n) => FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n>\n\n/**\n * A hook for managing a field in a form.\n * @param opts An object with field options.\n *\n * @returns The `FieldApi` instance for the specified field.\n */\nexport function useField<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n>(\n opts: UseFieldOptions<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n >,\n) {\n const [fieldApi] = useState(() => {\n const api = new FieldApi({\n ...opts,\n form: opts.form,\n name: opts.name,\n })\n\n const extendedApi: typeof api &\n ReactFieldApi<\n TParentData,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > = api as never\n\n extendedApi.Field = Field as never\n\n return extendedApi\n })\n\n useIsomorphicLayoutEffect(fieldApi.mount, [fieldApi])\n\n /**\n * fieldApi.update should not have any side effects. Think of it like a `useRef`\n * that we need to keep updated every render with the most up-to-date information.\n */\n useIsomorphicLayoutEffect(() => {\n fieldApi.update(opts)\n })\n\n useStore(\n fieldApi.store,\n opts.mode === 'array'\n ? (state) => {\n return [\n state.meta,\n Object.keys((state.value as unknown) ?? []).length,\n ]\n }\n : undefined,\n )\n\n return fieldApi\n}\n\n/**\n * @param children A render function that takes a field API instance and returns a React element.\n */\ninterface FieldComponentProps<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n ExtendedApi = {},\n> extends UseFieldOptions<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > {\n children: (\n fieldApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > &\n ExtendedApi,\n ) => ReactNode\n}\n\ninterface FieldComponentBoundProps<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n ExtendedApi = {},\n> extends UseFieldOptionsBound<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n > {\n children: (\n fieldApi: FieldApi<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n > &\n ExtendedApi,\n ) => ReactNode\n}\n\n/**\n * A type alias representing a field component for a specific form data type.\n */\nexport type FieldComponent<\n in out TParentData,\n in out TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnChangeAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnBlurAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnSubmitAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n in out TFormOnDynamicAsync extends\n | undefined\n | FormAsyncValidateOrFn<TParentData>,\n in out TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n in out TPatentSubmitMeta,\n in out ExtendedApi = {},\n> = <\n const TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n>({\n children,\n ...fieldOptions\n}: FieldComponentBoundProps<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta,\n ExtendedApi\n>) => ReactNode\n\n/**\n * A type alias representing a field component for a form lens data type.\n */\nexport type LensFieldComponent<\n in out TLensData,\n in out TParentSubmitMeta,\n in out ExtendedApi = {},\n> = <\n const TName extends DeepKeys<TLensData>,\n TData extends DeepValue<TLensData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnChange extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<unknown, string, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<unknown, string, TData>,\n>({\n children,\n ...fieldOptions\n}: Omit<\n FieldComponentBoundProps<\n unknown,\n string,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n undefined | FormAsyncValidateOrFn<unknown>,\n TParentSubmitMeta,\n ExtendedApi\n >,\n 'name' | 'validators'\n> & {\n name: TName\n validators?: Omit<\n FieldValidators<\n unknown,\n string,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync\n >,\n 'onChangeListenTo' | 'onBlurListenTo'\n > & {\n /**\n * An optional list of field names that should trigger this field's `onChange` and `onChangeAsync` events when its value changes\n */\n onChangeListenTo?: DeepKeys<TLensData>[]\n /**\n * An optional list of field names that should trigger this field's `onBlur` and `onBlurAsync` events when its value changes\n */\n onBlurListenTo?: DeepKeys<TLensData>[]\n }\n}) => ReactNode\n\n/**\n * A function component that takes field options and a render function as children and returns a React component.\n *\n * The `Field` component uses the `useField` hook internally to manage the field instance.\n */\nexport const Field = (<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TData extends DeepValue<TParentData, TName>,\n TOnMount extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChange extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnChangeAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnBlur extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnBlurAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnSubmit extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnSubmitAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TOnDynamic extends undefined | FieldValidateOrFn<TParentData, TName, TData>,\n TOnDynamicAsync extends\n | undefined\n | FieldAsyncValidateOrFn<TParentData, TName, TData>,\n TFormOnMount extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChange extends undefined | FormValidateOrFn<TParentData>,\n TFormOnChangeAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnBlur extends undefined | FormValidateOrFn<TParentData>,\n TFormOnBlurAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnSubmit extends undefined | FormValidateOrFn<TParentData>,\n TFormOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnDynamic extends undefined | FormValidateOrFn<TParentData>,\n TFormOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TParentData>,\n TFormOnServer extends undefined | FormAsyncValidateOrFn<TParentData>,\n TPatentSubmitMeta,\n>({\n children,\n ...fieldOptions\n}: FieldComponentProps<\n TParentData,\n TName,\n TData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TFormOnMount,\n TFormOnChange,\n TFormOnChangeAsync,\n TFormOnBlur,\n TFormOnBlurAsync,\n TFormOnSubmit,\n TFormOnSubmitAsync,\n TFormOnDynamic,\n TFormOnDynamicAsync,\n TFormOnServer,\n TPatentSubmitMeta\n>): ReactNode => {\n const fieldApi = useField(fieldOptions as any)\n\n const jsxToDisplay = useMemo(\n () => functionalUpdate(children, fieldApi as any),\n /**\n * The reason this exists is to fix an issue with the React Compiler.\n * Namely, functionalUpdate is memoized where it checks for `fieldApi`, which is a static type.\n * This means that when `state.value` changes, it does not trigger a re-render. The useMemo explicitly fixes this problem\n */\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [children, fieldApi, fieldApi.state.value, fieldApi.state.meta],\n )\n return (<>{jsxToDisplay}</>) as never\n}) satisfies FunctionComponent<\n FieldComponentProps<\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any\n >\n>\n"],"names":[],"mappings":";;;;;;AAwIO;AA2DL;AACE;AAAyB;AACpB;AACQ;AACA;AAGb;AAgBA;AAEA;AAAO;AAGT;AAMA;AACE;AAAoB;AAGtB;AAAA;AACW;AAGH;AAAO;AACC;AACsC;AAAA;AAGhD;AAGN;AACF;AAkVO;AAgCL;AACA;AAEF;AAyBE;AAEA;AAAqB;AAC6B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOc;AAEhE;AACF;;;;;"}
@@ -1,3 +1,4 @@
1
+ "use client";
1
2
  import { jsx } from "react/jsx-runtime";
2
3
  import { useState } from "react";
3
4
  import { useStore } from "@tanstack/react-store";
@@ -1 +1 @@
1
- {"version":3,"file":"useFieldGroup.js","sources":["../../src/useFieldGroup.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport { FieldGroupApi, functionalUpdate } from '@tanstack/form-core'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\nimport type {\n AnyFieldGroupApi,\n DeepKeysOfType,\n FieldGroupState,\n FieldsMap,\n FormAsyncValidateOrFn,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type { AppFieldExtendedReactFormApi } from './createFormHook'\nimport type { ComponentType, PropsWithChildren, ReactNode } from 'react'\nimport type { LensFieldComponent } from './useField'\n\nfunction LocalSubscribe({\n lens,\n selector,\n children,\n}: PropsWithChildren<{\n lens: AnyFieldGroupApi\n selector: (state: FieldGroupState<any>) => FieldGroupState<any>\n}>) {\n const data = useStore(lens.store, selector)\n\n return functionalUpdate(children, data)\n}\n\n/**\n * @private\n */\nexport type AppFieldExtendedReactFieldGroupApi<\n TFormData,\n TFieldGroupData,\n TFields extends\n | DeepKeysOfType<TFormData, TFieldGroupData | null | undefined>\n | FieldsMap<TFormData, TFieldGroupData>,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n> = FieldGroupApi<\n TFormData,\n TFieldGroupData,\n TFields,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n> &\n NoInfer<TFormComponents> & {\n AppField: LensFieldComponent<\n TFieldGroupData,\n TSubmitMeta,\n NoInfer<TFieldComponents>\n >\n AppForm: ComponentType<PropsWithChildren>\n /**\n * A React component to render form fields. With this, you can render and manage individual form fields.\n */\n Field: LensFieldComponent<TFieldGroupData, TSubmitMeta>\n\n /**\n * A `Subscribe` function that allows you to listen and react to changes in the form's state. It's especially useful when you need to execute side effects or render specific components in response to state updates.\n */\n Subscribe: <TSelected = NoInfer<FieldGroupState<TFieldGroupData>>>(props: {\n selector?: (state: NoInfer<FieldGroupState<TFieldGroupData>>) => TSelected\n children: ((state: NoInfer<TSelected>) => ReactNode) | ReactNode\n }) => ReactNode\n }\n\nexport function useFieldGroup<\n TFormData,\n TFieldGroupData,\n TFields extends\n | DeepKeysOfType<TFormData, TFieldGroupData | null | undefined>\n | FieldsMap<TFormData, TFieldGroupData>,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n TSubmitMeta = never,\n>(opts: {\n form:\n | AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n >\n | AppFieldExtendedReactFieldGroupApi<\n // Since this only occurs if you nest it within other form lenses, it can be more\n // lenient with the types.\n unknown,\n TFormData,\n string | FieldsMap<unknown, TFormData>,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n TSubmitMeta,\n TComponents,\n TFormComponents\n >\n fields: TFields\n defaultValues?: TFieldGroupData\n onSubmitMeta?: TSubmitMeta\n formComponents: TFormComponents\n}): AppFieldExtendedReactFieldGroupApi<\n TFormData,\n TFieldGroupData,\n TFields,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n> {\n const [formLensApi] = useState(() => {\n const api = new FieldGroupApi(opts)\n const form =\n opts.form instanceof FieldGroupApi\n ? (opts.form.form as AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n >)\n : opts.form\n\n const extendedApi: AppFieldExtendedReactFieldGroupApi<\n TFormData,\n TFieldGroupData,\n TFields,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n > = api as never\n\n extendedApi.AppForm = function AppForm(appFormProps) {\n return <form.AppForm {...appFormProps} />\n }\n\n extendedApi.AppField = function AppField(props) {\n return (\n <form.AppField {...(formLensApi.getFormFieldOptions(props) as any)} />\n )\n }\n\n extendedApi.Field = function Field(props) {\n return <form.Field {...(formLensApi.getFormFieldOptions(props) as any)} />\n }\n\n extendedApi.Subscribe = function Subscribe(props: any) {\n return (\n <LocalSubscribe\n lens={formLensApi}\n selector={props.selector}\n children={props.children}\n />\n )\n }\n\n return Object.assign(extendedApi, {\n ...opts.formComponents,\n }) as AppFieldExtendedReactFieldGroupApi<\n TFormData,\n TFieldGroupData,\n TFields,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n >\n })\n\n useIsomorphicLayoutEffect(formLensApi.mount, [formLensApi])\n\n return formLensApi\n}\n"],"names":[],"mappings":";;;;;AAgBA,SAAS,eAAe;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AACF,GAGI;AACF,QAAM,OAAO,SAAS,KAAK,OAAO,QAAQ;AAE1C,SAAO,iBAAiB,UAAU,IAAI;AACxC;AA6DO,SAAS,cAmBd,MA2DA;AACA,QAAM,CAAC,WAAW,IAAI,SAAS,MAAM;AACnC,UAAM,MAAM,IAAI,cAAc,IAAI;AAClC,UAAM,OACJ,KAAK,gBAAgB,gBAChB,KAAK,KAAK,OAgBX,KAAK;AAEX,UAAM,cAiBF;AAEJ,gBAAY,UAAU,SAAS,QAAQ,cAAc;AACnD,aAAO,oBAAC,KAAK,SAAL,EAAc,GAAG,aAAA,CAAc;AAAA,IACzC;AAEA,gBAAY,WAAW,SAAS,SAAS,OAAO;AAC9C,aACE,oBAAC,KAAK,UAAL,EAAe,GAAI,YAAY,oBAAoB,KAAK,GAAW;AAAA,IAExE;AAEA,gBAAY,QAAQ,SAAS,MAAM,OAAO;AACxC,aAAO,oBAAC,KAAK,OAAL,EAAY,GAAI,YAAY,oBAAoB,KAAK,GAAW;AAAA,IAC1E;AAEA,gBAAY,YAAY,SAAS,UAAU,OAAY;AACrD,aACE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,UAAU,MAAM;AAAA,UAChB,UAAU,MAAM;AAAA,QAAA;AAAA,MAAA;AAAA,IAGtB;AAEA,WAAO,OAAO,OAAO,aAAa;AAAA,MAChC,GAAG,KAAK;AAAA,IAAA,CACT;AAAA,EAkBH,CAAC;AAED,4BAA0B,YAAY,OAAO,CAAC,WAAW,CAAC;AAE1D,SAAO;AACT;"}
1
+ {"version":3,"file":"useFieldGroup.js","sources":["../../src/useFieldGroup.tsx"],"sourcesContent":["'use client'\n\nimport { useState } from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport { FieldGroupApi, functionalUpdate } from '@tanstack/form-core'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\nimport type {\n AnyFieldGroupApi,\n DeepKeysOfType,\n FieldGroupState,\n FieldsMap,\n FormAsyncValidateOrFn,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type { AppFieldExtendedReactFormApi } from './createFormHook'\nimport type { ComponentType, PropsWithChildren, ReactNode } from 'react'\nimport type { LensFieldComponent } from './useField'\n\nfunction LocalSubscribe({\n lens,\n selector,\n children,\n}: PropsWithChildren<{\n lens: AnyFieldGroupApi\n selector: (state: FieldGroupState<any>) => FieldGroupState<any>\n}>) {\n const data = useStore(lens.store, selector)\n\n return functionalUpdate(children, data)\n}\n\n/**\n * @private\n */\nexport type AppFieldExtendedReactFieldGroupApi<\n TFormData,\n TFieldGroupData,\n TFields extends\n | DeepKeysOfType<TFormData, TFieldGroupData | null | undefined>\n | FieldsMap<TFormData, TFieldGroupData>,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n TFieldComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n> = FieldGroupApi<\n TFormData,\n TFieldGroupData,\n TFields,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n> &\n NoInfer<TFormComponents> & {\n AppField: LensFieldComponent<\n TFieldGroupData,\n TSubmitMeta,\n NoInfer<TFieldComponents>\n >\n AppForm: ComponentType<PropsWithChildren>\n /**\n * A React component to render form fields. With this, you can render and manage individual form fields.\n */\n Field: LensFieldComponent<TFieldGroupData, TSubmitMeta>\n\n /**\n * A `Subscribe` function that allows you to listen and react to changes in the form's state. It's especially useful when you need to execute side effects or render specific components in response to state updates.\n */\n Subscribe: <TSelected = NoInfer<FieldGroupState<TFieldGroupData>>>(props: {\n selector?: (state: NoInfer<FieldGroupState<TFieldGroupData>>) => TSelected\n children: ((state: NoInfer<TSelected>) => ReactNode) | ReactNode\n }) => ReactNode\n }\n\nexport function useFieldGroup<\n TFormData,\n TFieldGroupData,\n TFields extends\n | DeepKeysOfType<TFormData, TFieldGroupData | null | undefined>\n | FieldsMap<TFormData, TFieldGroupData>,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TComponents extends Record<string, ComponentType<any>>,\n TFormComponents extends Record<string, ComponentType<any>>,\n TSubmitMeta = never,\n>(opts: {\n form:\n | AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n >\n | AppFieldExtendedReactFieldGroupApi<\n // Since this only occurs if you nest it within other form lenses, it can be more\n // lenient with the types.\n unknown,\n TFormData,\n string | FieldsMap<unknown, TFormData>,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n any,\n TSubmitMeta,\n TComponents,\n TFormComponents\n >\n fields: TFields\n defaultValues?: TFieldGroupData\n onSubmitMeta?: TSubmitMeta\n formComponents: TFormComponents\n}): AppFieldExtendedReactFieldGroupApi<\n TFormData,\n TFieldGroupData,\n TFields,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n> {\n const [formLensApi] = useState(() => {\n const api = new FieldGroupApi(opts)\n const form =\n opts.form instanceof FieldGroupApi\n ? (opts.form.form as AppFieldExtendedReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n >)\n : opts.form\n\n const extendedApi: AppFieldExtendedReactFieldGroupApi<\n TFormData,\n TFieldGroupData,\n TFields,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n > = api as never\n\n extendedApi.AppForm = function AppForm(appFormProps) {\n return <form.AppForm {...appFormProps} />\n }\n\n extendedApi.AppField = function AppField(props) {\n return (\n <form.AppField {...(formLensApi.getFormFieldOptions(props) as any)} />\n )\n }\n\n extendedApi.Field = function Field(props) {\n return <form.Field {...(formLensApi.getFormFieldOptions(props) as any)} />\n }\n\n extendedApi.Subscribe = function Subscribe(props: any) {\n return (\n <LocalSubscribe\n lens={formLensApi}\n selector={props.selector}\n children={props.children}\n />\n )\n }\n\n return Object.assign(extendedApi, {\n ...opts.formComponents,\n }) as AppFieldExtendedReactFieldGroupApi<\n TFormData,\n TFieldGroupData,\n TFields,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta,\n TComponents,\n TFormComponents\n >\n })\n\n useIsomorphicLayoutEffect(formLensApi.mount, [formLensApi])\n\n return formLensApi\n}\n"],"names":[],"mappings":";;;;;;AAkBA;AAAwB;AACtB;AACA;AAEF;AAIE;AAEA;AACF;AA6DO;AA+EL;AACE;AACA;AAoBA;AAmBA;AACE;AAAuC;AAGzC;AACE;AACsE;AAIxE;AACE;AAAwE;AAG1E;AACE;AACE;AAAC;AAAA;AACO;AACU;AACA;AAAA;AAAA;AAKtB;AAAkC;AACxB;AACT;AAoBH;AAEA;AACF;;;;"}
@@ -1,3 +1,4 @@
1
+ "use client";
1
2
  import { jsx } from "react/jsx-runtime";
2
3
  import { FormApi, functionalUpdate } from "@tanstack/form-core";
3
4
  import { useStore } from "@tanstack/react-store";
@@ -1 +1 @@
1
- {"version":3,"file":"useForm.js","sources":["../../src/useForm.tsx"],"sourcesContent":["import { FormApi, functionalUpdate } from '@tanstack/form-core'\nimport { useStore } from '@tanstack/react-store'\nimport { useId, useState } from 'react'\nimport { Field } from './useField'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\nimport type {\n AnyFormApi,\n AnyFormState,\n FormAsyncValidateOrFn,\n FormOptions,\n FormState,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type { PropsWithChildren, ReactNode } from 'react'\nimport type { FieldComponent } from './useField'\nimport type { NoInfer } from '@tanstack/react-store'\n\n/**\n * Fields that are added onto the `FormAPI` from `@tanstack/form-core` and returned from `useForm`\n */\nexport interface ReactFormApi<\n in out TFormData,\n in out TOnMount extends undefined | FormValidateOrFn<TFormData>,\n in out TOnChange extends undefined | FormValidateOrFn<TFormData>,\n in out TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n in out TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n in out TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n in out TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n in out TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n in out TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n in out TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n in out TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n in out TSubmitMeta,\n> {\n /**\n * A React component to render form fields. With this, you can render and manage individual form fields.\n */\n Field: FieldComponent<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >\n /**\n * A `Subscribe` function that allows you to listen and react to changes in the form's state. It's especially useful when you need to execute side effects or render specific components in response to state updates.\n */\n Subscribe: <\n TSelected = NoInfer<\n FormState<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer\n >\n >,\n >(props: {\n selector?: (\n state: NoInfer<\n FormState<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer\n >\n >,\n ) => TSelected\n children: ((state: NoInfer<TSelected>) => ReactNode) | ReactNode\n }) => ReactNode\n}\n\n/**\n * An extended version of the `FormApi` class that includes React-specific functionalities from `ReactFormApi`\n */\nexport type ReactFormExtendedApi<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n> = FormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n> &\n ReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >\n\nfunction LocalSubscribe({\n form,\n selector,\n children,\n}: PropsWithChildren<{\n form: AnyFormApi\n selector: (state: AnyFormState) => AnyFormState\n}>) {\n const data = useStore(form.store, selector)\n\n return functionalUpdate(children, data)\n}\n\n/**\n * A custom React Hook that returns an extended instance of the `FormApi` class.\n *\n * This API encapsulates all the necessary functionalities related to the form. It allows you to manage form state, handle submissions, and interact with form fields\n */\nexport function useForm<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n>(\n opts?: FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >,\n) {\n const formId = useId()\n\n const [formApi] = useState(() => {\n const api = new FormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >({ ...opts, formId: formId })\n\n const extendedApi: ReactFormExtendedApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n > = api as never\n\n extendedApi.Field = function APIField(props) {\n return <Field {...props} form={api} />\n }\n\n extendedApi.Subscribe = function Subscribe(props: any) {\n return (\n <LocalSubscribe\n form={api}\n selector={props.selector}\n children={props.children}\n />\n )\n }\n\n return extendedApi\n })\n\n useIsomorphicLayoutEffect(formApi.mount, [])\n\n /**\n * formApi.update should not have any side effects. Think of it like a `useRef`\n * that we need to keep updated every render with the most up-to-date information.\n */\n useIsomorphicLayoutEffect(() => {\n formApi.update(opts)\n })\n\n return formApi\n}\n"],"names":[],"mappings":";;;;;;AAyIA,SAAS,eAAe;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AACF,GAGI;AACF,QAAM,OAAO,SAAS,KAAK,OAAO,QAAQ;AAE1C,SAAO,iBAAiB,UAAU,IAAI;AACxC;AAOO,SAAS,QAcd,MAcA;AACA,QAAM,SAAS,MAAA;AAEf,QAAM,CAAC,OAAO,IAAI,SAAS,MAAM;AAC/B,UAAM,MAAM,IAAI,QAad,EAAE,GAAG,MAAM,QAAgB;AAE7B,UAAM,cAaF;AAEJ,gBAAY,QAAQ,SAAS,SAAS,OAAO;AAC3C,aAAO,oBAAC,OAAA,EAAO,GAAG,OAAO,MAAM,KAAK;AAAA,IACtC;AAEA,gBAAY,YAAY,SAAS,UAAU,OAAY;AACrD,aACE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,UAAU,MAAM;AAAA,UAChB,UAAU,MAAM;AAAA,QAAA;AAAA,MAAA;AAAA,IAGtB;AAEA,WAAO;AAAA,EACT,CAAC;AAED,4BAA0B,QAAQ,OAAO,EAAE;AAM3C,4BAA0B,MAAM;AAC9B,YAAQ,OAAO,IAAI;AAAA,EACrB,CAAC;AAED,SAAO;AACT;"}
1
+ {"version":3,"file":"useForm.js","sources":["../../src/useForm.tsx"],"sourcesContent":["'use client'\n\nimport { FormApi, functionalUpdate } from '@tanstack/form-core'\nimport { useStore } from '@tanstack/react-store'\nimport { useId, useState } from 'react'\nimport { Field } from './useField'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\nimport type {\n AnyFormApi,\n AnyFormState,\n FormAsyncValidateOrFn,\n FormOptions,\n FormState,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type { PropsWithChildren, ReactNode } from 'react'\nimport type { FieldComponent } from './useField'\nimport type { NoInfer } from '@tanstack/react-store'\n\n/**\n * Fields that are added onto the `FormAPI` from `@tanstack/form-core` and returned from `useForm`\n */\nexport interface ReactFormApi<\n in out TFormData,\n in out TOnMount extends undefined | FormValidateOrFn<TFormData>,\n in out TOnChange extends undefined | FormValidateOrFn<TFormData>,\n in out TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n in out TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n in out TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n in out TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n in out TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n in out TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n in out TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n in out TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n in out TSubmitMeta,\n> {\n /**\n * A React component to render form fields. With this, you can render and manage individual form fields.\n */\n Field: FieldComponent<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >\n /**\n * A `Subscribe` function that allows you to listen and react to changes in the form's state. It's especially useful when you need to execute side effects or render specific components in response to state updates.\n */\n Subscribe: <\n TSelected = NoInfer<\n FormState<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer\n >\n >,\n >(props: {\n selector?: (\n state: NoInfer<\n FormState<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer\n >\n >,\n ) => TSelected\n children: ((state: NoInfer<TSelected>) => ReactNode) | ReactNode\n }) => ReactNode\n}\n\n/**\n * An extended version of the `FormApi` class that includes React-specific functionalities from `ReactFormApi`\n */\nexport type ReactFormExtendedApi<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n> = FormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n> &\n ReactFormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >\n\nfunction LocalSubscribe({\n form,\n selector,\n children,\n}: PropsWithChildren<{\n form: AnyFormApi\n selector: (state: AnyFormState) => AnyFormState\n}>) {\n const data = useStore(form.store, selector)\n\n return functionalUpdate(children, data)\n}\n\n/**\n * A custom React Hook that returns an extended instance of the `FormApi` class.\n *\n * This API encapsulates all the necessary functionalities related to the form. It allows you to manage form state, handle submissions, and interact with form fields\n */\nexport function useForm<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n>(\n opts?: FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >,\n) {\n const formId = useId()\n\n const [formApi] = useState(() => {\n const api = new FormApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >({ ...opts, formId: formId })\n\n const extendedApi: ReactFormExtendedApi<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n > = api as never\n\n extendedApi.Field = function APIField(props) {\n return <Field {...props} form={api} />\n }\n\n extendedApi.Subscribe = function Subscribe(props: any) {\n return (\n <LocalSubscribe\n form={api}\n selector={props.selector}\n children={props.children}\n />\n )\n }\n\n return extendedApi\n })\n\n useIsomorphicLayoutEffect(formApi.mount, [])\n\n /**\n * formApi.update should not have any side effects. Think of it like a `useRef`\n * that we need to keep updated every render with the most up-to-date information.\n */\n useIsomorphicLayoutEffect(() => {\n formApi.update(opts)\n })\n\n return formApi\n}\n"],"names":[],"mappings":";;;;;;;AA2IA;AAAwB;AACtB;AACA;AAEF;AAIE;AAEA;AACF;AAOO;AA6BL;AAEA;AACE;AAeA;AAeA;AACE;AAAoC;AAGtC;AACE;AACE;AAAC;AAAA;AACO;AACU;AACA;AAAA;AAAA;AAKtB;AAAO;AAGT;AAMA;AACE;AAAmB;AAGrB;AACF;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tanstack/react-form",
3
- "version": "1.23.8",
3
+ "version": "1.25.0",
4
4
  "description": "Powerful, type-safe forms for React.",
5
5
  "author": "tannerlinsley",
6
6
  "license": "MIT",
@@ -29,36 +29,6 @@
29
29
  "default": "./dist/cjs/index.cjs"
30
30
  }
31
31
  },
32
- "./nextjs": {
33
- "import": {
34
- "types": "./dist/esm/nextjs/index.d.ts",
35
- "default": "./dist/esm/nextjs/index.js"
36
- },
37
- "require": {
38
- "types": "./dist/cjs/nextjs/index.d.cts",
39
- "default": "./dist/cjs/nextjs/index.cjs"
40
- }
41
- },
42
- "./remix": {
43
- "import": {
44
- "types": "./dist/esm/remix/index.d.ts",
45
- "default": "./dist/esm/remix/index.js"
46
- },
47
- "require": {
48
- "types": "./dist/cjs/remix/index.d.cts",
49
- "default": "./dist/cjs/remix/index.cjs"
50
- }
51
- },
52
- "./start": {
53
- "import": {
54
- "types": "./dist/esm/start/index.d.ts",
55
- "default": "./dist/esm/start/index.js"
56
- },
57
- "require": {
58
- "types": "./dist/cjs/start/index.d.cts",
59
- "default": "./dist/cjs/start/index.cjs"
60
- }
61
- },
62
32
  "./package.json": "./package.json"
63
33
  },
64
34
  "sideEffects": false,
@@ -68,22 +38,18 @@
68
38
  ],
69
39
  "dependencies": {
70
40
  "@tanstack/react-store": "^0.7.7",
71
- "decode-formdata": "^0.9.0",
72
- "devalue": "^5.3.2",
73
- "@tanstack/form-core": "1.24.4"
41
+ "@tanstack/form-core": "1.25.0"
74
42
  },
75
43
  "devDependencies": {
76
- "@tanstack/react-start": "1.131.50",
77
44
  "@types/react": "^19.0.7",
78
45
  "@types/react-dom": "^19.0.3",
79
- "@vitejs/plugin-react": "^4.7.0",
46
+ "@vitejs/plugin-react": "^5.1.1",
80
47
  "eslint-plugin-react-compiler": "19.1.0-rc.2",
81
48
  "react": "^19.0.0",
82
49
  "react-dom": "^19.0.0",
83
- "vite": "^7.1.6"
50
+ "vite": "^7.2.2"
84
51
  },
85
52
  "peerDependencies": {
86
- "@tanstack/react-start": "^1.130.10",
87
53
  "react": "^17.0.0 || ^18.0.0 || ^19.0.0"
88
54
  },
89
55
  "peerDependenciesMeta": {
@@ -1,3 +1,4 @@
1
+ 'use client'
1
2
  /* eslint-disable @eslint-react/no-context-provider */
2
3
  import { createContext, useContext, useMemo } from 'react'
3
4
  import { useForm } from './useForm'
package/src/index.ts CHANGED
@@ -7,4 +7,3 @@ export * from './types'
7
7
  export * from './useField'
8
8
  export * from './useFieldGroup'
9
9
  export * from './useForm'
10
- export * from './useTransform'
package/src/types.ts CHANGED
@@ -6,6 +6,7 @@ import type {
6
6
  FieldOptions,
7
7
  FieldValidateOrFn,
8
8
  FormAsyncValidateOrFn,
9
+ FormState,
9
10
  FormValidateOrFn,
10
11
  } from '@tanstack/form-core'
11
12
 
@@ -111,3 +112,23 @@ export interface UseFieldOptionsBound<
111
112
  TOnDynamicAsync
112
113
  >,
113
114
  FieldOptionsMode {}
115
+
116
+ export type ServerFormState<
117
+ TFormData,
118
+ TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,
119
+ > = Pick<
120
+ FormState<
121
+ TFormData,
122
+ undefined,
123
+ undefined,
124
+ undefined,
125
+ undefined,
126
+ undefined,
127
+ undefined,
128
+ undefined,
129
+ undefined,
130
+ undefined,
131
+ TOnServer
132
+ >,
133
+ 'values' | 'errors' | 'errorMap'
134
+ >
package/src/useField.tsx CHANGED
@@ -1,4 +1,6 @@
1
- import React, { useMemo, useState } from 'react'
1
+ 'use client'
2
+
3
+ import { useMemo, useState } from 'react'
2
4
  import { useStore } from '@tanstack/react-store'
3
5
  import { FieldApi, functionalUpdate } from '@tanstack/form-core'
4
6
  import { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'
@@ -1,3 +1,5 @@
1
+ 'use client'
2
+
1
3
  import { useState } from 'react'
2
4
  import { useStore } from '@tanstack/react-store'
3
5
  import { FieldGroupApi, functionalUpdate } from '@tanstack/form-core'
package/src/useForm.tsx CHANGED
@@ -1,3 +1,5 @@
1
+ 'use client'
2
+
1
3
  import { FormApi, functionalUpdate } from '@tanstack/form-core'
2
4
  import { useStore } from '@tanstack/react-store'
3
5
  import { useId, useState } from 'react'
@@ -1,51 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const decodeFormdata = require("decode-formdata");
4
- const formCore = require("@tanstack/form-core");
5
- const error = require("./error.cjs");
6
- const createServerValidate = (defaultOpts) => async (formData, info) => {
7
- const { onServerValidate } = defaultOpts;
8
- const runValidator = async ({
9
- value,
10
- validationSource
11
- }) => {
12
- if (formCore.isStandardSchemaValidator(onServerValidate)) {
13
- return await formCore.standardSchemaValidators.validateAsync(
14
- { value, validationSource },
15
- onServerValidate
16
- );
17
- }
18
- return onServerValidate({
19
- value,
20
- signal: void 0,
21
- formApi: void 0
22
- });
23
- };
24
- const values = decodeFormdata.decode(formData, info);
25
- const onServerError = await runValidator({
26
- value: values,
27
- validationSource: "form"
28
- });
29
- if (!onServerError) return values;
30
- const onServerErrorVal = formCore.isGlobalFormValidationError(onServerError) ? onServerError.form : onServerError;
31
- const formState = {
32
- errorMap: {
33
- onServer: onServerError
34
- },
35
- values,
36
- errors: onServerErrorVal ? [onServerErrorVal] : []
37
- };
38
- throw new error.ServerValidateError({
39
- formState
40
- });
41
- };
42
- const initialFormState = {
43
- errorMap: {
44
- onServer: void 0
45
- },
46
- values: void 0,
47
- errors: []
48
- };
49
- exports.createServerValidate = createServerValidate;
50
- exports.initialFormState = initialFormState;
51
- //# sourceMappingURL=createServerValidate.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"createServerValidate.cjs","sources":["../../../src/nextjs/createServerValidate.ts"],"sourcesContent":["import { decode } from 'decode-formdata'\nimport {\n isGlobalFormValidationError,\n isStandardSchemaValidator,\n standardSchemaValidators,\n} from '@tanstack/form-core'\nimport { ServerValidateError } from './error'\nimport type {\n FormAsyncValidateOrFn,\n FormOptions,\n FormValidateAsyncFn,\n FormValidateOrFn,\n UnwrapFormAsyncValidateOrFn,\n} from '@tanstack/form-core'\nimport type { ServerFormState } from './types'\n\ninterface CreateServerValidateOptions<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n> extends FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n > {\n onServerValidate: TOnServer\n}\n\nexport const createServerValidate =\n <\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n >(\n defaultOpts: CreateServerValidateOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >,\n ) =>\n async (formData: FormData, info?: Parameters<typeof decode>[1]) => {\n const { onServerValidate } = defaultOpts\n\n const runValidator = async ({\n value,\n validationSource,\n }: {\n value: TFormData\n validationSource: 'form'\n }) => {\n if (isStandardSchemaValidator(onServerValidate)) {\n return await standardSchemaValidators.validateAsync(\n { value, validationSource },\n onServerValidate,\n )\n }\n return (onServerValidate as FormValidateAsyncFn<TFormData>)({\n value,\n signal: undefined as never,\n formApi: undefined as never,\n })\n }\n\n const values = decode(formData, info) as never as TFormData\n\n const onServerError = (await runValidator({\n value: values,\n validationSource: 'form',\n })) as UnwrapFormAsyncValidateOrFn<TOnServer> | undefined\n\n if (!onServerError) return values\n\n const onServerErrorVal = (\n isGlobalFormValidationError(onServerError)\n ? onServerError.form\n : onServerError\n ) as UnwrapFormAsyncValidateOrFn<TOnServer>\n\n const formState: ServerFormState<TFormData, TOnServer> = {\n errorMap: {\n onServer: onServerError,\n },\n values,\n errors: onServerErrorVal ? [onServerErrorVal] : [],\n }\n\n throw new ServerValidateError({\n formState,\n })\n }\n\nexport const initialFormState: ServerFormState<any, undefined> = {\n errorMap: {\n onServer: undefined,\n },\n values: undefined,\n errors: [],\n}\n"],"names":["isStandardSchemaValidator","standardSchemaValidators","decode","isGlobalFormValidationError","ServerValidateError"],"mappings":";;;;;AA8CO,MAAM,uBACX,CAcE,gBAeF,OAAO,UAAoB,SAAwC;AACjE,QAAM,EAAE,qBAAqB;AAE7B,QAAM,eAAe,OAAO;AAAA,IAC1B;AAAA,IACA;AAAA,EAAA,MAII;AACJ,QAAIA,SAAAA,0BAA0B,gBAAgB,GAAG;AAC/C,aAAO,MAAMC,SAAAA,yBAAyB;AAAA,QACpC,EAAE,OAAO,iBAAA;AAAA,QACT;AAAA,MAAA;AAAA,IAEJ;AACA,WAAQ,iBAAoD;AAAA,MAC1D;AAAA,MACA,QAAQ;AAAA,MACR,SAAS;AAAA,IAAA,CACV;AAAA,EACH;AAEA,QAAM,SAASC,eAAAA,OAAO,UAAU,IAAI;AAEpC,QAAM,gBAAiB,MAAM,aAAa;AAAA,IACxC,OAAO;AAAA,IACP,kBAAkB;AAAA,EAAA,CACnB;AAED,MAAI,CAAC,cAAe,QAAO;AAE3B,QAAM,mBACJC,SAAAA,4BAA4B,aAAa,IACrC,cAAc,OACd;AAGN,QAAM,YAAmD;AAAA,IACvD,UAAU;AAAA,MACR,UAAU;AAAA,IAAA;AAAA,IAEZ;AAAA,IACA,QAAQ,mBAAmB,CAAC,gBAAgB,IAAI,CAAA;AAAA,EAAC;AAGnD,QAAM,IAAIC,MAAAA,oBAAoB;AAAA,IAC5B;AAAA,EAAA,CACD;AACH;AAEK,MAAM,mBAAoD;AAAA,EAC/D,UAAU;AAAA,IACR,UAAU;AAAA,EAAA;AAAA,EAEZ,QAAQ;AAAA,EACR,QAAQ,CAAA;AACV;;;"}
@@ -1,9 +0,0 @@
1
- import { decode } from 'decode-formdata';
2
- import { FormAsyncValidateOrFn, FormOptions, FormValidateOrFn } from '@tanstack/form-core';
3
- import { ServerFormState } from './types.cjs';
4
- interface CreateServerValidateOptions<TFormData, TOnMount extends undefined | FormValidateOrFn<TFormData>, TOnChange extends undefined | FormValidateOrFn<TFormData>, TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnBlur extends undefined | FormValidateOrFn<TFormData>, TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnSubmit extends undefined | FormValidateOrFn<TFormData>, TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnDynamic extends undefined | FormValidateOrFn<TFormData>, TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>, TSubmitMeta> extends FormOptions<TFormData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TOnServer, TSubmitMeta> {
5
- onServerValidate: TOnServer;
6
- }
7
- export declare const createServerValidate: <TFormData, TOnMount extends undefined | FormValidateOrFn<TFormData>, TOnChange extends undefined | FormValidateOrFn<TFormData>, TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnBlur extends undefined | FormValidateOrFn<TFormData>, TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnSubmit extends undefined | FormValidateOrFn<TFormData>, TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnDynamic extends undefined | FormValidateOrFn<TFormData>, TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>, TSubmitMeta>(defaultOpts: CreateServerValidateOptions<TFormData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TOnServer, TSubmitMeta>) => (formData: FormData, info?: Parameters<typeof decode>[1]) => Promise<TFormData>;
8
- export declare const initialFormState: ServerFormState<any, undefined>;
9
- export {};
@@ -1,11 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- class ServerValidateError extends Error {
4
- constructor(options) {
5
- super("Your form has errors. Please check the fields and try again.");
6
- this.name = "ServerValidateError";
7
- this.formState = options.formState;
8
- }
9
- }
10
- exports.ServerValidateError = ServerValidateError;
11
- //# sourceMappingURL=error.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"error.cjs","sources":["../../../src/nextjs/error.ts"],"sourcesContent":["import type { ServerFormState } from './types'\nimport type { FormAsyncValidateOrFn } from '@tanstack/form-core'\n\ninterface ServerValidateErrorState<\n TFormData,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n> {\n formState: ServerFormState<TFormData, TOnServer>\n}\n\nexport class ServerValidateError<\n TFormData,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n >\n extends Error\n implements ServerValidateErrorState<TFormData, TOnServer>\n{\n formState: ServerFormState<TFormData, TOnServer>\n\n constructor(options: ServerValidateErrorState<TFormData, TOnServer>) {\n super('Your form has errors. Please check the fields and try again.')\n this.name = 'ServerValidateError'\n this.formState = options.formState\n }\n}\n"],"names":[],"mappings":";;AAUO,MAAM,4BAIH,MAEV;AAAA,EAGE,YAAY,SAAyD;AACnE,UAAM,8DAA8D;AACpE,SAAK,OAAO;AACZ,SAAK,YAAY,QAAQ;AAAA,EAC3B;AACF;;"}
@@ -1,10 +0,0 @@
1
- import { ServerFormState } from './types.cjs';
2
- import { FormAsyncValidateOrFn } from '@tanstack/form-core';
3
- interface ServerValidateErrorState<TFormData, TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>> {
4
- formState: ServerFormState<TFormData, TOnServer>;
5
- }
6
- export declare class ServerValidateError<TFormData, TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>> extends Error implements ServerValidateErrorState<TFormData, TOnServer> {
7
- formState: ServerFormState<TFormData, TOnServer>;
8
- constructor(options: ServerValidateErrorState<TFormData, TOnServer>);
9
- }
10
- export {};
@@ -1,15 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const formCore = require("@tanstack/form-core");
4
- const createServerValidate = require("./createServerValidate.cjs");
5
- const error = require("./error.cjs");
6
- exports.createServerValidate = createServerValidate.createServerValidate;
7
- exports.initialFormState = createServerValidate.initialFormState;
8
- exports.ServerValidateError = error.ServerValidateError;
9
- Object.keys(formCore).forEach((k) => {
10
- if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
11
- enumerable: true,
12
- get: () => formCore[k]
13
- });
14
- });
15
- //# sourceMappingURL=index.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}
@@ -1,4 +0,0 @@
1
- export * from '@tanstack/form-core';
2
- export * from './createServerValidate.cjs';
3
- export * from './error.cjs';
4
- export * from './types.cjs';
@@ -1,2 +0,0 @@
1
- import { FormAsyncValidateOrFn, FormState } from '@tanstack/form-core';
2
- export type ServerFormState<TFormData, TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>> = Pick<FormState<TFormData, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, TOnServer>, 'values' | 'errors' | 'errorMap'>;
@@ -1,51 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const decodeFormdata = require("decode-formdata");
4
- const formCore = require("@tanstack/form-core");
5
- const error = require("./error.cjs");
6
- const createServerValidate = (defaultOpts) => async (formData, info) => {
7
- const { onServerValidate } = defaultOpts;
8
- const runValidator = async ({
9
- value,
10
- validationSource
11
- }) => {
12
- if (formCore.isStandardSchemaValidator(onServerValidate)) {
13
- return await formCore.standardSchemaValidators.validateAsync(
14
- { value, validationSource },
15
- onServerValidate
16
- );
17
- }
18
- return onServerValidate({
19
- value,
20
- signal: void 0,
21
- formApi: void 0
22
- });
23
- };
24
- const values = decodeFormdata.decode(formData, info);
25
- const onServerError = await runValidator({
26
- value: values,
27
- validationSource: "form"
28
- });
29
- if (!onServerError) return values;
30
- const onServerErrorVal = formCore.isGlobalFormValidationError(onServerError) ? onServerError.form : onServerError;
31
- const formState = {
32
- errorMap: {
33
- onServer: onServerError
34
- },
35
- values,
36
- errors: onServerErrorVal ? [onServerErrorVal] : []
37
- };
38
- throw new error.ServerValidateError({
39
- formState
40
- });
41
- };
42
- const initialFormState = {
43
- errorMap: {
44
- onServer: void 0
45
- },
46
- values: void 0,
47
- errors: []
48
- };
49
- exports.createServerValidate = createServerValidate;
50
- exports.initialFormState = initialFormState;
51
- //# sourceMappingURL=createServerValidate.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"createServerValidate.cjs","sources":["../../../src/remix/createServerValidate.ts"],"sourcesContent":["import { decode } from 'decode-formdata'\nimport {\n isGlobalFormValidationError,\n isStandardSchemaValidator,\n standardSchemaValidators,\n} from '@tanstack/form-core'\nimport { ServerValidateError } from './error'\nimport type {\n FormAsyncValidateOrFn,\n FormOptions,\n FormValidateAsyncFn,\n FormValidateOrFn,\n UnwrapFormAsyncValidateOrFn,\n} from '@tanstack/form-core'\nimport type { ServerFormState } from './types'\n\ninterface CreateServerValidateOptions<\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n> extends FormOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n > {\n onServerValidate: TOnServer\n}\n\nexport const createServerValidate =\n <\n TFormData,\n TOnMount extends undefined | FormValidateOrFn<TFormData>,\n TOnChange extends undefined | FormValidateOrFn<TFormData>,\n TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnBlur extends undefined | FormValidateOrFn<TFormData>,\n TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnSubmit extends undefined | FormValidateOrFn<TFormData>,\n TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnDynamic extends undefined | FormValidateOrFn<TFormData>,\n TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n TSubmitMeta,\n >(\n defaultOpts: CreateServerValidateOptions<\n TFormData,\n TOnMount,\n TOnChange,\n TOnChangeAsync,\n TOnBlur,\n TOnBlurAsync,\n TOnSubmit,\n TOnSubmitAsync,\n TOnDynamic,\n TOnDynamicAsync,\n TOnServer,\n TSubmitMeta\n >,\n ) =>\n async (formData: FormData, info?: Parameters<typeof decode>[1]) => {\n const { onServerValidate } = defaultOpts\n\n const runValidator = async ({\n value,\n validationSource,\n }: {\n value: TFormData\n validationSource: 'form'\n }) => {\n if (isStandardSchemaValidator(onServerValidate)) {\n return await standardSchemaValidators.validateAsync(\n { value, validationSource },\n onServerValidate,\n )\n }\n return (onServerValidate as FormValidateAsyncFn<TFormData>)({\n value,\n signal: undefined as never,\n formApi: undefined as never,\n })\n }\n\n const values = decode(formData, info) as never as TFormData\n\n const onServerError = (await runValidator({\n value: values,\n validationSource: 'form',\n })) as UnwrapFormAsyncValidateOrFn<TOnServer> | undefined\n\n if (!onServerError) return values\n\n const onServerErrorVal = (\n isGlobalFormValidationError(onServerError)\n ? onServerError.form\n : onServerError\n ) as UnwrapFormAsyncValidateOrFn<TOnServer>\n\n const formState: ServerFormState<TFormData, TOnServer> = {\n errorMap: {\n onServer: onServerError,\n },\n values,\n errors: onServerErrorVal ? [onServerErrorVal] : [],\n }\n\n throw new ServerValidateError({\n formState,\n })\n }\n\nexport const initialFormState: ServerFormState<any, undefined> = {\n errorMap: {\n onServer: undefined,\n },\n values: undefined,\n errors: [],\n}\n"],"names":["isStandardSchemaValidator","standardSchemaValidators","decode","isGlobalFormValidationError","ServerValidateError"],"mappings":";;;;;AA8CO,MAAM,uBACX,CAcE,gBAeF,OAAO,UAAoB,SAAwC;AACjE,QAAM,EAAE,qBAAqB;AAE7B,QAAM,eAAe,OAAO;AAAA,IAC1B;AAAA,IACA;AAAA,EAAA,MAII;AACJ,QAAIA,SAAAA,0BAA0B,gBAAgB,GAAG;AAC/C,aAAO,MAAMC,SAAAA,yBAAyB;AAAA,QACpC,EAAE,OAAO,iBAAA;AAAA,QACT;AAAA,MAAA;AAAA,IAEJ;AACA,WAAQ,iBAAoD;AAAA,MAC1D;AAAA,MACA,QAAQ;AAAA,MACR,SAAS;AAAA,IAAA,CACV;AAAA,EACH;AAEA,QAAM,SAASC,eAAAA,OAAO,UAAU,IAAI;AAEpC,QAAM,gBAAiB,MAAM,aAAa;AAAA,IACxC,OAAO;AAAA,IACP,kBAAkB;AAAA,EAAA,CACnB;AAED,MAAI,CAAC,cAAe,QAAO;AAE3B,QAAM,mBACJC,SAAAA,4BAA4B,aAAa,IACrC,cAAc,OACd;AAGN,QAAM,YAAmD;AAAA,IACvD,UAAU;AAAA,MACR,UAAU;AAAA,IAAA;AAAA,IAEZ;AAAA,IACA,QAAQ,mBAAmB,CAAC,gBAAgB,IAAI,CAAA;AAAA,EAAC;AAGnD,QAAM,IAAIC,MAAAA,oBAAoB;AAAA,IAC5B;AAAA,EAAA,CACD;AACH;AAEK,MAAM,mBAAoD;AAAA,EAC/D,UAAU;AAAA,IACR,UAAU;AAAA,EAAA;AAAA,EAEZ,QAAQ;AAAA,EACR,QAAQ,CAAA;AACV;;;"}
@@ -1,9 +0,0 @@
1
- import { decode } from 'decode-formdata';
2
- import { FormAsyncValidateOrFn, FormOptions, FormValidateOrFn } from '@tanstack/form-core';
3
- import { ServerFormState } from './types.cjs';
4
- interface CreateServerValidateOptions<TFormData, TOnMount extends undefined | FormValidateOrFn<TFormData>, TOnChange extends undefined | FormValidateOrFn<TFormData>, TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnBlur extends undefined | FormValidateOrFn<TFormData>, TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnSubmit extends undefined | FormValidateOrFn<TFormData>, TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnDynamic extends undefined | FormValidateOrFn<TFormData>, TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>, TSubmitMeta> extends FormOptions<TFormData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TOnServer, TSubmitMeta> {
5
- onServerValidate: TOnServer;
6
- }
7
- export declare const createServerValidate: <TFormData, TOnMount extends undefined | FormValidateOrFn<TFormData>, TOnChange extends undefined | FormValidateOrFn<TFormData>, TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnBlur extends undefined | FormValidateOrFn<TFormData>, TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnSubmit extends undefined | FormValidateOrFn<TFormData>, TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnDynamic extends undefined | FormValidateOrFn<TFormData>, TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>, TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>, TSubmitMeta>(defaultOpts: CreateServerValidateOptions<TFormData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TOnServer, TSubmitMeta>) => (formData: FormData, info?: Parameters<typeof decode>[1]) => Promise<TFormData>;
8
- export declare const initialFormState: ServerFormState<any, undefined>;
9
- export {};
@@ -1,11 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- class ServerValidateError extends Error {
4
- constructor(options) {
5
- super("Your form has errors. Please check the fields and try again.");
6
- this.name = "ServerValidateError";
7
- this.formState = options.formState;
8
- }
9
- }
10
- exports.ServerValidateError = ServerValidateError;
11
- //# sourceMappingURL=error.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"error.cjs","sources":["../../../src/remix/error.ts"],"sourcesContent":["import type { ServerFormState } from './types'\nimport type { FormAsyncValidateOrFn } from '@tanstack/form-core'\n\ninterface ServerValidateErrorState<\n TFormData,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n> {\n formState: ServerFormState<TFormData, TOnServer>\n}\n\nexport class ServerValidateError<\n TFormData,\n TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,\n >\n extends Error\n implements ServerValidateErrorState<TFormData, TOnServer>\n{\n formState: ServerFormState<TFormData, TOnServer>\n\n constructor(options: ServerValidateErrorState<TFormData, TOnServer>) {\n super('Your form has errors. Please check the fields and try again.')\n this.name = 'ServerValidateError'\n this.formState = options.formState\n }\n}\n"],"names":[],"mappings":";;AAUO,MAAM,4BAIH,MAEV;AAAA,EAGE,YAAY,SAAyD;AACnE,UAAM,8DAA8D;AACpE,SAAK,OAAO;AACZ,SAAK,YAAY,QAAQ;AAAA,EAC3B;AACF;;"}
@@ -1,10 +0,0 @@
1
- import { ServerFormState } from './types.cjs';
2
- import { FormAsyncValidateOrFn } from '@tanstack/form-core';
3
- interface ServerValidateErrorState<TFormData, TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>> {
4
- formState: ServerFormState<TFormData, TOnServer>;
5
- }
6
- export declare class ServerValidateError<TFormData, TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>> extends Error implements ServerValidateErrorState<TFormData, TOnServer> {
7
- formState: ServerFormState<TFormData, TOnServer>;
8
- constructor(options: ServerValidateErrorState<TFormData, TOnServer>);
9
- }
10
- export {};
@@ -1,15 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const formCore = require("@tanstack/form-core");
4
- const createServerValidate = require("./createServerValidate.cjs");
5
- const error = require("./error.cjs");
6
- exports.createServerValidate = createServerValidate.createServerValidate;
7
- exports.initialFormState = createServerValidate.initialFormState;
8
- exports.ServerValidateError = error.ServerValidateError;
9
- Object.keys(formCore).forEach((k) => {
10
- if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
11
- enumerable: true,
12
- get: () => formCore[k]
13
- });
14
- });
15
- //# sourceMappingURL=index.cjs.map