@tanstack/vue-form 0.10.3 → 0.12.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 (106) hide show
  1. package/dist/cjs/createFormFactory.d.ts +8 -0
  2. package/dist/cjs/formContext.d.ts +11 -0
  3. package/dist/cjs/index.cjs +119 -0
  4. package/dist/cjs/index.cjs.map +1 -0
  5. package/dist/cjs/index.d.cts +5 -0
  6. package/dist/cjs/index.d.ts +5 -0
  7. package/dist/cjs/index.js +119 -0
  8. package/dist/cjs/tests/useField.test.d.ts +1 -0
  9. package/dist/cjs/tests/useForm.test.d.ts +1 -0
  10. package/dist/cjs/tests/utils.d.ts +1 -0
  11. package/dist/cjs/types.d.ts +4 -0
  12. package/dist/cjs/useField.d.ts +38 -0
  13. package/dist/cjs/useForm.d.ts +19 -0
  14. package/dist/mjs/createFormFactory.d.ts +8 -0
  15. package/dist/mjs/formContext.d.ts +11 -0
  16. package/dist/mjs/index.d.mts +5 -0
  17. package/dist/mjs/index.d.ts +5 -0
  18. package/dist/mjs/index.js +113 -0
  19. package/dist/mjs/index.mjs +113 -0
  20. package/dist/mjs/index.mjs.map +1 -0
  21. package/dist/mjs/tests/useField.test.d.ts +1 -0
  22. package/dist/mjs/tests/useForm.test.d.ts +1 -0
  23. package/dist/mjs/tests/utils.d.ts +1 -0
  24. package/dist/mjs/types.d.ts +4 -0
  25. package/dist/mjs/useField.d.ts +38 -0
  26. package/dist/mjs/useForm.d.ts +19 -0
  27. package/package.json +17 -22
  28. package/src/createFormFactory.ts +16 -10
  29. package/src/formContext.ts +10 -4
  30. package/src/tests/useField.test.tsx +23 -15
  31. package/src/tests/useForm.test.tsx +57 -39
  32. package/src/types.ts +13 -4
  33. package/src/useField.tsx +68 -35
  34. package/src/useForm.tsx +16 -8
  35. package/build/legacy/createFormFactory.cjs +0 -42
  36. package/build/legacy/createFormFactory.cjs.map +0 -1
  37. package/build/legacy/createFormFactory.d.cts +0 -13
  38. package/build/legacy/createFormFactory.d.ts +0 -13
  39. package/build/legacy/createFormFactory.js +0 -17
  40. package/build/legacy/createFormFactory.js.map +0 -1
  41. package/build/legacy/formContext.cjs +0 -46
  42. package/build/legacy/formContext.cjs.map +0 -1
  43. package/build/legacy/formContext.d.cts +0 -14
  44. package/build/legacy/formContext.d.ts +0 -14
  45. package/build/legacy/formContext.js +0 -19
  46. package/build/legacy/formContext.js.map +0 -1
  47. package/build/legacy/index.cjs +0 -33
  48. package/build/legacy/index.cjs.map +0 -1
  49. package/build/legacy/index.d.cts +0 -8
  50. package/build/legacy/index.d.ts +0 -8
  51. package/build/legacy/index.js +0 -7
  52. package/build/legacy/index.js.map +0 -1
  53. package/build/legacy/types.cjs +0 -19
  54. package/build/legacy/types.cjs.map +0 -1
  55. package/build/legacy/types.d.cts +0 -7
  56. package/build/legacy/types.d.ts +0 -7
  57. package/build/legacy/types.js +0 -1
  58. package/build/legacy/types.js.map +0 -1
  59. package/build/legacy/useField.cjs +0 -77
  60. package/build/legacy/useField.cjs.map +0 -1
  61. package/build/legacy/useField.d.cts +0 -40
  62. package/build/legacy/useField.d.ts +0 -40
  63. package/build/legacy/useField.js +0 -51
  64. package/build/legacy/useField.js.map +0 -1
  65. package/build/legacy/useForm.cjs +0 -72
  66. package/build/legacy/useForm.cjs.map +0 -1
  67. package/build/legacy/useForm.d.cts +0 -23
  68. package/build/legacy/useForm.d.ts +0 -23
  69. package/build/legacy/useForm.js +0 -50
  70. package/build/legacy/useForm.js.map +0 -1
  71. package/build/modern/createFormFactory.cjs +0 -42
  72. package/build/modern/createFormFactory.cjs.map +0 -1
  73. package/build/modern/createFormFactory.d.cts +0 -13
  74. package/build/modern/createFormFactory.d.ts +0 -13
  75. package/build/modern/createFormFactory.js +0 -17
  76. package/build/modern/createFormFactory.js.map +0 -1
  77. package/build/modern/formContext.cjs +0 -46
  78. package/build/modern/formContext.cjs.map +0 -1
  79. package/build/modern/formContext.d.cts +0 -14
  80. package/build/modern/formContext.d.ts +0 -14
  81. package/build/modern/formContext.js +0 -19
  82. package/build/modern/formContext.js.map +0 -1
  83. package/build/modern/index.cjs +0 -33
  84. package/build/modern/index.cjs.map +0 -1
  85. package/build/modern/index.d.cts +0 -8
  86. package/build/modern/index.d.ts +0 -8
  87. package/build/modern/index.js +0 -7
  88. package/build/modern/index.js.map +0 -1
  89. package/build/modern/types.cjs +0 -19
  90. package/build/modern/types.cjs.map +0 -1
  91. package/build/modern/types.d.cts +0 -7
  92. package/build/modern/types.d.ts +0 -7
  93. package/build/modern/types.js +0 -1
  94. package/build/modern/types.js.map +0 -1
  95. package/build/modern/useField.cjs +0 -77
  96. package/build/modern/useField.cjs.map +0 -1
  97. package/build/modern/useField.d.cts +0 -40
  98. package/build/modern/useField.d.ts +0 -40
  99. package/build/modern/useField.js +0 -51
  100. package/build/modern/useField.js.map +0 -1
  101. package/build/modern/useForm.cjs +0 -72
  102. package/build/modern/useForm.cjs.map +0 -1
  103. package/build/modern/useForm.d.cts +0 -23
  104. package/build/modern/useForm.d.ts +0 -23
  105. package/build/modern/useForm.js +0 -50
  106. package/build/modern/useForm.js.map +0 -1
package/src/useField.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import { FieldApi } from '@tanstack/form-core'
1
+ import { FieldApi, type Validator } from '@tanstack/form-core'
2
2
  import type { DeepKeys, DeepValue, Narrow } from '@tanstack/form-core'
3
3
  import { useStore } from '@tanstack/vue-store'
4
4
  import { defineComponent, onMounted, onUnmounted, watch } from 'vue'
@@ -11,53 +11,68 @@ declare module '@tanstack/form-core' {
11
11
  interface FieldApi<
12
12
  TParentData,
13
13
  TName extends DeepKeys<TParentData>,
14
- ValidatorType,
15
- FormValidator,
14
+ TFieldValidator extends
15
+ | Validator<DeepValue<TParentData, TName>, unknown>
16
+ | undefined = undefined,
17
+ TFormValidator extends
18
+ | Validator<TParentData, unknown>
19
+ | undefined = undefined,
16
20
  TData = DeepValue<TParentData, TName>,
17
21
  > {
18
- Field: FieldComponent<TData, FormValidator>
22
+ Field: FieldComponent<TParentData, TFormValidator>
19
23
  }
20
24
  }
21
25
 
22
- export type UseField<TParentData, FormValidator> = <
26
+ export type UseField<
27
+ TParentData,
28
+ TFormValidator extends
29
+ | Validator<TParentData, unknown>
30
+ | undefined = undefined,
31
+ > = <
23
32
  TName extends DeepKeys<TParentData>,
24
- ValidatorType,
33
+ TFieldValidator extends
34
+ | Validator<DeepValue<TParentData, TName>, unknown>
35
+ | undefined = undefined,
25
36
  >(
26
37
  opts?: { name: Narrow<TName> } & UseFieldOptions<
27
38
  TParentData,
28
39
  TName,
29
- ValidatorType,
30
- FormValidator,
40
+ TFieldValidator,
41
+ TFormValidator,
31
42
  DeepValue<TParentData, TName>
32
43
  >,
33
44
  ) => FieldApi<
34
45
  TParentData,
35
46
  TName,
36
- ValidatorType,
37
- FormValidator,
47
+ TFieldValidator,
48
+ TFormValidator,
38
49
  DeepValue<TParentData, TName>
39
50
  >
40
51
 
41
52
  export function useField<
42
53
  TParentData,
43
54
  TName extends DeepKeys<TParentData>,
44
- ValidatorType,
45
- FormValidator,
55
+ TFieldValidator extends
56
+ | Validator<DeepValue<TParentData, TName>, unknown>
57
+ | undefined = undefined,
58
+ TFormValidator extends
59
+ | Validator<TParentData, unknown>
60
+ | undefined = undefined,
46
61
  TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>,
47
62
  >(
48
63
  opts: UseFieldOptions<
49
64
  TParentData,
50
65
  TName,
51
- ValidatorType,
52
- FormValidator,
66
+ TFieldValidator,
67
+ TFormValidator,
53
68
  TData
54
69
  >,
55
70
  ): {
56
71
  api: FieldApi<
57
72
  TParentData,
58
73
  TName,
59
- ValidatorType,
60
- FormValidator,
74
+ TFieldValidator,
75
+ TFormValidator,
61
76
  TData
62
77
  // Omit<typeof opts, 'onMount'> & {
63
78
  // form: FormApi<TParentData>
@@ -68,12 +83,9 @@ export function useField<
68
83
  FieldApi<
69
84
  TParentData,
70
85
  TName,
71
- ValidatorType,
72
- FormValidator,
86
+ TFieldValidator,
87
+ TFormValidator,
73
88
  TData
74
- // Omit<typeof opts, 'onMount'> & {
75
- // form: FormApi<TParentData>
76
- // }
77
89
  >['state']
78
90
  >
79
91
  >
@@ -124,8 +136,12 @@ export type FieldValue<TParentData, TName> = TParentData extends any[]
124
136
  type FieldComponentProps<
125
137
  TParentData,
126
138
  TName extends DeepKeys<TParentData>,
127
- ValidatorType,
128
- FormValidator,
139
+ TFieldValidator extends
140
+ | Validator<DeepValue<TParentData, TName>, unknown>
141
+ | undefined = undefined,
142
+ TFormValidator extends
143
+ | Validator<TParentData, unknown>
144
+ | undefined = undefined,
129
145
  > = (TParentData extends any[]
130
146
  ? {
131
147
  name?: TName
@@ -136,31 +152,44 @@ type FieldComponentProps<
136
152
  index?: never
137
153
  }) &
138
154
  Omit<
139
- UseFieldOptions<TParentData, TName, ValidatorType, FormValidator>,
155
+ UseFieldOptions<TParentData, TName, TFieldValidator, TFormValidator>,
140
156
  'name' | 'index'
141
157
  >
142
158
 
143
- export type FieldComponent<TParentData, FormValidator> = <
159
+ export type FieldComponent<
160
+ TParentData,
161
+ TFormValidator extends
162
+ | Validator<TParentData, unknown>
163
+ | undefined = undefined,
164
+ > = <
144
165
  TName extends DeepKeys<TParentData>,
145
- ValidatorType,
166
+ TFieldValidator extends
167
+ | Validator<DeepValue<TParentData, TName>, unknown>
168
+ | undefined = undefined,
146
169
  TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>,
147
170
  >(
148
171
  fieldOptions: FieldComponentProps<
149
172
  TParentData,
150
173
  TName,
151
- ValidatorType,
152
- FormValidator
174
+ TFieldValidator,
175
+ TFormValidator
153
176
  >,
154
177
  context: SetupContext<
155
178
  {},
156
179
  SlotsType<{
157
180
  default: {
158
- field: FieldApi<TParentData, TName, ValidatorType, FormValidator, TData>
181
+ field: FieldApi<
182
+ TParentData,
183
+ TName,
184
+ TFieldValidator,
185
+ TFormValidator,
186
+ TData
187
+ >
159
188
  state: FieldApi<
160
189
  TParentData,
161
190
  TName,
162
- ValidatorType,
163
- FormValidator,
191
+ TFieldValidator,
192
+ TFormValidator,
164
193
  TData
165
194
  >['state']
166
195
  }
@@ -172,14 +201,18 @@ export const Field = defineComponent(
172
201
  <
173
202
  TParentData,
174
203
  TName extends DeepKeys<TParentData>,
175
- ValidatorType,
176
- FormValidator,
204
+ TFieldValidator extends
205
+ | Validator<DeepValue<TParentData, TName>, unknown>
206
+ | undefined = undefined,
207
+ TFormValidator extends
208
+ | Validator<TParentData, unknown>
209
+ | undefined = undefined,
177
210
  >(
178
211
  fieldOptions: UseFieldOptions<
179
212
  TParentData,
180
213
  TName,
181
- ValidatorType,
182
- FormValidator
214
+ TFieldValidator,
215
+ TFormValidator
183
216
  >,
184
217
  context: SetupContext,
185
218
  ) => {
package/src/useForm.tsx CHANGED
@@ -1,4 +1,9 @@
1
- import { FormApi, type FormState, type FormOptions } from '@tanstack/form-core'
1
+ import {
2
+ FormApi,
3
+ type FormState,
4
+ type FormOptions,
5
+ type Validator,
6
+ } from '@tanstack/form-core'
2
7
  import { type NoInfer, useStore } from '@tanstack/vue-store'
3
8
  import { type UseField, type FieldComponent, Field, useField } from './useField'
4
9
  import { provideFormContext } from './formContext'
@@ -13,11 +18,11 @@ import {
13
18
 
14
19
  declare module '@tanstack/form-core' {
15
20
  // eslint-disable-next-line no-shadow
16
- interface FormApi<TFormData, ValidatorType> {
21
+ interface FormApi<TFormData, TFormValidator> {
17
22
  Provider: (props: Record<string, any> & {}) => any
18
23
  provideFormContext: () => void
19
- Field: FieldComponent<TFormData, ValidatorType>
20
- useField: UseField<TFormData, ValidatorType>
24
+ Field: FieldComponent<TFormData, TFormValidator>
25
+ useField: UseField<TFormData, TFormValidator>
21
26
  useStore: <TSelected = NoInfer<FormState<TFormData>>>(
22
27
  selector?: (state: NoInfer<FormState<TFormData>>) => TSelected,
23
28
  ) => Readonly<Ref<TSelected>>
@@ -33,11 +38,14 @@ declare module '@tanstack/form-core' {
33
38
  }
34
39
  }
35
40
 
36
- export function useForm<TData, FormValidator>(
37
- opts?: FormOptions<TData, FormValidator>,
38
- ): FormApi<TData, FormValidator> {
41
+ export function useForm<
42
+ TFormData,
43
+ TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,
44
+ >(
45
+ opts?: FormOptions<TFormData, TFormValidator>,
46
+ ): FormApi<TFormData, TFormValidator> {
39
47
  const formApi = (() => {
40
- const api = new FormApi<TData, FormValidator>(opts)
48
+ const api = new FormApi<TFormData, TFormValidator>(opts)
41
49
 
42
50
  api.Provider = defineComponent(
43
51
  (_, context) => {
@@ -1,42 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // src/createFormFactory.ts
21
- var createFormFactory_exports = {};
22
- __export(createFormFactory_exports, {
23
- createFormFactory: () => createFormFactory
24
- });
25
- module.exports = __toCommonJS(createFormFactory_exports);
26
- var import_useField = require("./useField.cjs");
27
- var import_useForm = require("./useForm.cjs");
28
- function createFormFactory(defaultOpts) {
29
- return {
30
- useForm: (opts) => {
31
- const formOptions = Object.assign({}, defaultOpts, opts);
32
- return (0, import_useForm.useForm)(formOptions);
33
- },
34
- useField: import_useField.useField,
35
- Field: import_useField.Field
36
- };
37
- }
38
- // Annotate the CommonJS export names for ESM import in node:
39
- 0 && (module.exports = {
40
- createFormFactory
41
- });
42
- //# sourceMappingURL=createFormFactory.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/createFormFactory.ts"],"sourcesContent":["import type { FormApi, FormOptions } from '@tanstack/form-core'\n\nimport { type UseField, type FieldComponent, Field, useField } from './useField'\nimport { useForm } from './useForm'\n\nexport type FormFactory<TFormData, FormValidator> = {\n useForm: (\n opts?: FormOptions<TFormData, FormValidator>,\n ) => FormApi<TFormData, FormValidator>\n useField: UseField<TFormData, FormValidator>\n Field: FieldComponent<TFormData, FormValidator>\n}\n\nexport function createFormFactory<TFormData, FormValidator>(\n defaultOpts?: FormOptions<TFormData, FormValidator>,\n): FormFactory<TFormData, FormValidator> {\n return {\n useForm: (opts) => {\n const formOptions = Object.assign({}, defaultOpts, opts)\n return useForm<TFormData, FormValidator>(formOptions)\n },\n useField: useField as any,\n Field: Field as any,\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,sBAAoE;AACpE,qBAAwB;AAUjB,SAAS,kBACd,aACuC;AACvC,SAAO;AAAA,IACL,SAAS,CAAC,SAAS;AACjB,YAAM,cAAc,OAAO,OAAO,CAAC,GAAG,aAAa,IAAI;AACvD,iBAAO,wBAAkC,WAAW;AAAA,IACtD;AAAA,IACA,UAAU;AAAA,IACV,OAAO;AAAA,EACT;AACF;","names":[]}
@@ -1,13 +0,0 @@
1
- import { FormOptions, FormApi } from '@tanstack/form-core';
2
- import { UseField, FieldComponent } from './useField.cjs';
3
- import 'vue';
4
- import './types.cjs';
5
-
6
- type FormFactory<TFormData, FormValidator> = {
7
- useForm: (opts?: FormOptions<TFormData, FormValidator>) => FormApi<TFormData, FormValidator>;
8
- useField: UseField<TFormData, FormValidator>;
9
- Field: FieldComponent<TFormData, FormValidator>;
10
- };
11
- declare function createFormFactory<TFormData, FormValidator>(defaultOpts?: FormOptions<TFormData, FormValidator>): FormFactory<TFormData, FormValidator>;
12
-
13
- export { FormFactory, createFormFactory };
@@ -1,13 +0,0 @@
1
- import { FormOptions, FormApi } from '@tanstack/form-core';
2
- import { UseField, FieldComponent } from './useField.js';
3
- import 'vue';
4
- import './types.js';
5
-
6
- type FormFactory<TFormData, FormValidator> = {
7
- useForm: (opts?: FormOptions<TFormData, FormValidator>) => FormApi<TFormData, FormValidator>;
8
- useField: UseField<TFormData, FormValidator>;
9
- Field: FieldComponent<TFormData, FormValidator>;
10
- };
11
- declare function createFormFactory<TFormData, FormValidator>(defaultOpts?: FormOptions<TFormData, FormValidator>): FormFactory<TFormData, FormValidator>;
12
-
13
- export { FormFactory, createFormFactory };
@@ -1,17 +0,0 @@
1
- // src/createFormFactory.ts
2
- import { Field, useField } from "./useField.js";
3
- import { useForm } from "./useForm.js";
4
- function createFormFactory(defaultOpts) {
5
- return {
6
- useForm: (opts) => {
7
- const formOptions = Object.assign({}, defaultOpts, opts);
8
- return useForm(formOptions);
9
- },
10
- useField,
11
- Field
12
- };
13
- }
14
- export {
15
- createFormFactory
16
- };
17
- //# sourceMappingURL=createFormFactory.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/createFormFactory.ts"],"sourcesContent":["import type { FormApi, FormOptions } from '@tanstack/form-core'\n\nimport { type UseField, type FieldComponent, Field, useField } from './useField'\nimport { useForm } from './useForm'\n\nexport type FormFactory<TFormData, FormValidator> = {\n useForm: (\n opts?: FormOptions<TFormData, FormValidator>,\n ) => FormApi<TFormData, FormValidator>\n useField: UseField<TFormData, FormValidator>\n Field: FieldComponent<TFormData, FormValidator>\n}\n\nexport function createFormFactory<TFormData, FormValidator>(\n defaultOpts?: FormOptions<TFormData, FormValidator>,\n): FormFactory<TFormData, FormValidator> {\n return {\n useForm: (opts) => {\n const formOptions = Object.assign({}, defaultOpts, opts)\n return useForm<TFormData, FormValidator>(formOptions)\n },\n useField: useField as any,\n Field: Field as any,\n }\n}\n"],"mappings":";AAEA,SAA6C,OAAO,gBAAgB;AACpE,SAAS,eAAe;AAUjB,SAAS,kBACd,aACuC;AACvC,SAAO;AAAA,IACL,SAAS,CAAC,SAAS;AACjB,YAAM,cAAc,OAAO,OAAO,CAAC,GAAG,aAAa,IAAI;AACvD,aAAO,QAAkC,WAAW;AAAA,IACtD;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":[]}
@@ -1,46 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // src/formContext.ts
21
- var formContext_exports = {};
22
- __export(formContext_exports, {
23
- formContext: () => formContext,
24
- provideFormContext: () => provideFormContext,
25
- useFormContext: () => useFormContext
26
- });
27
- module.exports = __toCommonJS(formContext_exports);
28
- var import_vue = require("vue");
29
- var formContext = Symbol("FormContext");
30
- function provideFormContext(val) {
31
- (0, import_vue.provide)(formContext, val);
32
- }
33
- function useFormContext() {
34
- const formApi = (0, import_vue.inject)(formContext);
35
- if (!formApi) {
36
- throw new Error(`You are trying to use the form API outside of a form!`);
37
- }
38
- return formApi;
39
- }
40
- // Annotate the CommonJS export names for ESM import in node:
41
- 0 && (module.exports = {
42
- formContext,
43
- provideFormContext,
44
- useFormContext
45
- });
46
- //# sourceMappingURL=formContext.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/formContext.ts"],"sourcesContent":["import type { FormApi } from '@tanstack/form-core'\nimport { inject, provide } from 'vue'\n\nexport type FormContext = {\n formApi: FormApi<any, unknown>\n parentFieldName?: string\n} | null\n\nexport const formContext = Symbol('FormContext')\n\nexport function provideFormContext(val: FormContext) {\n provide(formContext, val)\n}\n\nexport function useFormContext() {\n const formApi = inject(formContext) as FormContext\n\n if (!formApi) {\n throw new Error(`You are trying to use the form API outside of a form!`)\n }\n\n return formApi\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,iBAAgC;AAOzB,IAAM,cAAc,OAAO,aAAa;AAExC,SAAS,mBAAmB,KAAkB;AACnD,0BAAQ,aAAa,GAAG;AAC1B;AAEO,SAAS,iBAAiB;AAC/B,QAAM,cAAU,mBAAO,WAAW;AAElC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,uDAAuD;AAAA,EACzE;AAEA,SAAO;AACT;","names":[]}
@@ -1,14 +0,0 @@
1
- import { FormApi } from '@tanstack/form-core';
2
-
3
- type FormContext = {
4
- formApi: FormApi<any, unknown>;
5
- parentFieldName?: string;
6
- } | null;
7
- declare const formContext: unique symbol;
8
- declare function provideFormContext(val: FormContext): void;
9
- declare function useFormContext(): {
10
- formApi: FormApi<any, unknown>;
11
- parentFieldName?: string | undefined;
12
- };
13
-
14
- export { FormContext, formContext, provideFormContext, useFormContext };
@@ -1,14 +0,0 @@
1
- import { FormApi } from '@tanstack/form-core';
2
-
3
- type FormContext = {
4
- formApi: FormApi<any, unknown>;
5
- parentFieldName?: string;
6
- } | null;
7
- declare const formContext: unique symbol;
8
- declare function provideFormContext(val: FormContext): void;
9
- declare function useFormContext(): {
10
- formApi: FormApi<any, unknown>;
11
- parentFieldName?: string | undefined;
12
- };
13
-
14
- export { FormContext, formContext, provideFormContext, useFormContext };
@@ -1,19 +0,0 @@
1
- // src/formContext.ts
2
- import { inject, provide } from "vue";
3
- var formContext = Symbol("FormContext");
4
- function provideFormContext(val) {
5
- provide(formContext, val);
6
- }
7
- function useFormContext() {
8
- const formApi = inject(formContext);
9
- if (!formApi) {
10
- throw new Error(`You are trying to use the form API outside of a form!`);
11
- }
12
- return formApi;
13
- }
14
- export {
15
- formContext,
16
- provideFormContext,
17
- useFormContext
18
- };
19
- //# sourceMappingURL=formContext.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/formContext.ts"],"sourcesContent":["import type { FormApi } from '@tanstack/form-core'\nimport { inject, provide } from 'vue'\n\nexport type FormContext = {\n formApi: FormApi<any, unknown>\n parentFieldName?: string\n} | null\n\nexport const formContext = Symbol('FormContext')\n\nexport function provideFormContext(val: FormContext) {\n provide(formContext, val)\n}\n\nexport function useFormContext() {\n const formApi = inject(formContext) as FormContext\n\n if (!formApi) {\n throw new Error(`You are trying to use the form API outside of a form!`)\n }\n\n return formApi\n}\n"],"mappings":";AACA,SAAS,QAAQ,eAAe;AAOzB,IAAM,cAAc,OAAO,aAAa;AAExC,SAAS,mBAAmB,KAAkB;AACnD,UAAQ,aAAa,GAAG;AAC1B;AAEO,SAAS,iBAAiB;AAC/B,QAAM,UAAU,OAAO,WAAW;AAElC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,uDAAuD;AAAA,EACzE;AAEA,SAAO;AACT;","names":[]}
@@ -1,33 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __copyProps = (to, from, except, desc) => {
7
- if (from && typeof from === "object" || typeof from === "function") {
8
- for (let key of __getOwnPropNames(from))
9
- if (!__hasOwnProp.call(to, key) && key !== except)
10
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
11
- }
12
- return to;
13
- };
14
- var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
15
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
16
-
17
- // src/index.ts
18
- var src_exports = {};
19
- module.exports = __toCommonJS(src_exports);
20
- __reExport(src_exports, require("@tanstack/form-core"), module.exports);
21
- __reExport(src_exports, require("./createFormFactory.cjs"), module.exports);
22
- __reExport(src_exports, require("./formContext.cjs"), module.exports);
23
- __reExport(src_exports, require("./useField.cjs"), module.exports);
24
- __reExport(src_exports, require("./useForm.cjs"), module.exports);
25
- // Annotate the CommonJS export names for ESM import in node:
26
- 0 && (module.exports = {
27
- ...require("@tanstack/form-core"),
28
- ...require("./createFormFactory.cjs"),
29
- ...require("./formContext.cjs"),
30
- ...require("./useField.cjs"),
31
- ...require("./useForm.cjs")
32
- });
33
- //# sourceMappingURL=index.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/index.ts"],"sourcesContent":["export * from '@tanstack/form-core'\nexport * from './createFormFactory'\nexport * from './formContext'\nexport * from './useField'\nexport * from './useForm'\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,wBAAc,gCAAd;AACA,wBAAc,oCADd;AAEA,wBAAc,8BAFd;AAGA,wBAAc,2BAHd;AAIA,wBAAc,0BAJd;","names":[]}
@@ -1,8 +0,0 @@
1
- export * from '@tanstack/form-core';
2
- export { FormFactory, createFormFactory } from './createFormFactory.cjs';
3
- export { FormContext, formContext, provideFormContext, useFormContext } from './formContext.cjs';
4
- export { Field, FieldComponent, FieldValue, UseField, useField } from './useField.cjs';
5
- export { useForm } from './useForm.cjs';
6
- import 'vue';
7
- import './types.cjs';
8
- import '@tanstack/vue-store';
@@ -1,8 +0,0 @@
1
- export * from '@tanstack/form-core';
2
- export { FormFactory, createFormFactory } from './createFormFactory.js';
3
- export { FormContext, formContext, provideFormContext, useFormContext } from './formContext.js';
4
- export { Field, FieldComponent, FieldValue, UseField, useField } from './useField.js';
5
- export { useForm } from './useForm.js';
6
- import 'vue';
7
- import './types.js';
8
- import '@tanstack/vue-store';
@@ -1,7 +0,0 @@
1
- // src/index.ts
2
- export * from "@tanstack/form-core";
3
- export * from "./createFormFactory.js";
4
- export * from "./formContext.js";
5
- export * from "./useField.js";
6
- export * from "./useForm.js";
7
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/index.ts"],"sourcesContent":["export * from '@tanstack/form-core'\nexport * from './createFormFactory'\nexport * from './formContext'\nexport * from './useField'\nexport * from './useForm'\n"],"mappings":";AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}
@@ -1,19 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __copyProps = (to, from, except, desc) => {
7
- if (from && typeof from === "object" || typeof from === "function") {
8
- for (let key of __getOwnPropNames(from))
9
- if (!__hasOwnProp.call(to, key) && key !== except)
10
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
11
- }
12
- return to;
13
- };
14
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
15
-
16
- // src/types.ts
17
- var types_exports = {};
18
- module.exports = __toCommonJS(types_exports);
19
- //# sourceMappingURL=types.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/types.ts"],"sourcesContent":["import type { FieldOptions, DeepKeys, DeepValue } from '@tanstack/form-core'\n\nexport type UseFieldOptions<\n TParentData,\n TName extends DeepKeys<TParentData>,\n ValidatorType,\n FormValidator,\n TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>,\n> = FieldOptions<TParentData, TName, ValidatorType, FormValidator, TData> & {\n mode?: 'value' | 'array'\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAAA;AAAA;","names":[]}
@@ -1,7 +0,0 @@
1
- import { DeepKeys, DeepValue, FieldOptions } from '@tanstack/form-core';
2
-
3
- type UseFieldOptions<TParentData, TName extends DeepKeys<TParentData>, ValidatorType, FormValidator, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>> = FieldOptions<TParentData, TName, ValidatorType, FormValidator, TData> & {
4
- mode?: 'value' | 'array';
5
- };
6
-
7
- export { UseFieldOptions };
@@ -1,7 +0,0 @@
1
- import { DeepKeys, DeepValue, FieldOptions } from '@tanstack/form-core';
2
-
3
- type UseFieldOptions<TParentData, TName extends DeepKeys<TParentData>, ValidatorType, FormValidator, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>> = FieldOptions<TParentData, TName, ValidatorType, FormValidator, TData> & {
4
- mode?: 'value' | 'array';
5
- };
6
-
7
- export { UseFieldOptions };
@@ -1 +0,0 @@
1
- //# sourceMappingURL=types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
@@ -1,77 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // src/useField.tsx
21
- var useField_exports = {};
22
- __export(useField_exports, {
23
- Field: () => Field,
24
- useField: () => useField
25
- });
26
- module.exports = __toCommonJS(useField_exports);
27
- var import_form_core = require("@tanstack/form-core");
28
- var import_vue_store = require("@tanstack/vue-store");
29
- var import_vue = require("vue");
30
- var import_formContext = require("./formContext.cjs");
31
- function useField(opts) {
32
- const { formApi, parentFieldName } = (0, import_formContext.useFormContext)();
33
- const fieldApi = (() => {
34
- const api = new import_form_core.FieldApi({
35
- ...opts,
36
- form: formApi,
37
- name: opts.name
38
- });
39
- api.Field = Field;
40
- return api;
41
- })();
42
- const fieldState = (0, import_vue_store.useStore)(fieldApi.store, (state) => state);
43
- let cleanup;
44
- (0, import_vue.onMounted)(() => {
45
- cleanup = fieldApi.mount();
46
- });
47
- (0, import_vue.onUnmounted)(() => {
48
- cleanup();
49
- });
50
- (0, import_vue.watch)(
51
- () => opts,
52
- () => {
53
- fieldApi.update({ ...opts, form: formApi });
54
- }
55
- );
56
- return { api: fieldApi, state: fieldState };
57
- }
58
- var Field = (0, import_vue.defineComponent)(
59
- (fieldOptions, context) => {
60
- const fieldApi = useField({ ...fieldOptions, ...context.attrs });
61
- (0, import_formContext.provideFormContext)({
62
- formApi: fieldApi.api.form,
63
- parentFieldName: fieldApi.api.name
64
- });
65
- return () => context.slots.default({
66
- field: fieldApi.api,
67
- state: fieldApi.state.value
68
- });
69
- },
70
- { name: "Field", inheritAttrs: false }
71
- );
72
- // Annotate the CommonJS export names for ESM import in node:
73
- 0 && (module.exports = {
74
- Field,
75
- useField
76
- });
77
- //# sourceMappingURL=useField.cjs.map