@tanstack/vue-form 1.32.0 → 1.32.1

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 (7) hide show
  1. package/dist/cjs/useField.cjs +6 -1
  2. package/dist/cjs/useField.cjs.map +1 -1
  3. package/dist/cjs/useField.d.cts +2 -2
  4. package/dist/esm/useField.js +7 -2
  5. package/dist/esm/useField.js.map +1 -1
  6. package/package.json +4 -3
  7. package/src/useField.tsx +6 -1
package/dist/cjs/useField.cjs CHANGED
@@ -84,7 +84,12 @@ function useField(opts) {
84
84
  fieldApi.update({ ...opts, form: opts.form });
85
85
  }
86
86
  );
87
- return { api: extendedFieldApi.value, state: fieldState.value };
87
+ return {
88
+ api: extendedFieldApi.value,
89
+ get state() {
90
+ return fieldState.value;
91
+ }
92
+ };
88
93
  }
89
94
  const Field = vue.defineComponent(
90
95
  (fieldOptions, context) => {
package/dist/cjs/useField.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useField.cjs","sources":["../../src/useField.tsx"],"sourcesContent":["import { FieldApi } from '@tanstack/form-core'\nimport { useStore } from '@tanstack/vue-store'\nimport { computed, defineComponent, onMounted, onUnmounted, watch } from 'vue'\nimport type {\n AnyFieldApi,\n AnyFieldMeta,\n DeepKeys,\n DeepValue,\n FieldAsyncValidateOrFn,\n FieldValidateOrFn,\n FormAsyncValidateOrFn,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type {\n ComponentOptionsMixin,\n CreateComponentPublicInstanceWithMixins,\n EmitsOptions,\n EmitsToProps,\n PublicProps,\n SetupContext,\n SlotsType,\n} from 'vue'\nimport type { UseFieldOptions, UseFieldOptionsBound } from './types'\n\nexport type FieldComponent<\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 TParentSubmitMeta,\n // This complex type comes from Vue's return type for `DefineSetupFnComponent` but with our own types sprinkled in\n // This allows us to pre-bind some generics while keeping the props type unbound generics for props-based inferencing\n> = new <\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 props: 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 > &\n EmitsToProps<EmitsOptions> &\n PublicProps,\n) => CreateComponentPublicInstanceWithMixins<\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 >,\n {},\n {},\n {},\n {},\n ComponentOptionsMixin,\n ComponentOptionsMixin,\n EmitsOptions,\n PublicProps,\n {},\n false,\n {},\n SlotsType<{\n default: {\n field: 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 TParentSubmitMeta\n >\n state: 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 TParentSubmitMeta\n >['state']\n }\n }>\n>\n\nexport interface VueFieldApi<\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 TParentSubmitMeta,\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 TParentSubmitMeta\n >\n}\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 TParentSubmitMeta,\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 TParentSubmitMeta\n >,\n) {\n const fieldApi = (() => {\n const api = new FieldApi({\n ...opts,\n form: opts.form,\n name: opts.name,\n })\n\n return api\n })()\n\n // For array mode, only track length changes to avoid re-renders when child properties change\n // See: https://github.com/TanStack/form/issues/1925\n const reactiveStateValue = useStore(\n fieldApi.store,\n (opts.mode === 'array'\n ? (state) => state.meta._arrayVersion || 0\n : (state) => state.value) as (\n state: typeof fieldApi.state,\n ) => TData | number,\n )\n const reactiveMetaIsTouched = useStore(\n fieldApi.store,\n (state) => state.meta.isTouched,\n )\n const reactiveMetaIsBlurred = useStore(\n fieldApi.store,\n (state) => state.meta.isBlurred,\n )\n const reactiveMetaIsDirty = useStore(\n fieldApi.store,\n (state) => state.meta.isDirty,\n )\n const reactiveMetaErrorMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorMap,\n )\n const reactiveMetaErrorSourceMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorSourceMap,\n )\n const reactiveMetaIsValidating = useStore(\n fieldApi.store,\n (state) => state.meta.isValidating,\n )\n\n const fieldState = computed(() => {\n // For array mode, reactiveStateValue is the length (for reactivity tracking),\n // so we need to read it to register the dependency, then return the actual\n // value from fieldApi.\n const trackedValue = reactiveStateValue.value\n // Read all reactive meta refs eagerly so that fieldState recomputes (and\n // dependent renders re-run) whenever any of them change. Without this, a\n // consumer reading `field.getMeta()` or `field.state.meta` from a render\n // function would not re-render on meta updates, since the meta getter\n // would never have registered those dependencies.\n const isTouched = reactiveMetaIsTouched.value\n const isBlurred = reactiveMetaIsBlurred.value\n const isDirty = reactiveMetaIsDirty.value\n const errorMap = reactiveMetaErrorMap.value\n const errorSourceMap = reactiveMetaErrorSourceMap.value\n const isValidating = reactiveMetaIsValidating.value\n return {\n value:\n opts.mode === 'array' ? fieldApi.state.value : (trackedValue as TData),\n meta: {\n ...fieldApi.state.meta,\n isTouched,\n isBlurred,\n isDirty,\n errorMap,\n errorSourceMap,\n isValidating,\n } satisfies AnyFieldMeta,\n } satisfies AnyFieldApi['state']\n })\n\n const extendedFieldApi = computed(() => {\n const reactiveFieldApi = {\n ...fieldApi,\n get state() {\n return fieldState.value\n },\n }\n\n const extendedApi: 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 TParentSubmitMeta\n > = reactiveFieldApi as never\n\n return extendedApi\n })\n\n let cleanup!: () => void\n onMounted(() => {\n cleanup = fieldApi.mount()\n })\n\n onUnmounted(() => {\n cleanup()\n })\n\n watch(\n () => opts,\n () => {\n // Keep options up to date as they are rendered\n fieldApi.update({ ...opts, form: opts.form } as never)\n },\n )\n\n return { api: extendedFieldApi.value, state: fieldState.value } as const\n}\n\nexport type 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 TParentSubmitMeta,\n> = 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 TParentSubmitMeta\n>\n\nexport type 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> = 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\nexport const Field = defineComponent(\n <\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 TParentSubmitMeta,\n >(\n fieldOptions: 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 TParentSubmitMeta\n >,\n context: SetupContext,\n ) => {\n const fieldApi = useField({ ...fieldOptions, ...context.attrs })\n\n return () =>\n context.slots.default!({\n field: fieldApi.api,\n state: fieldApi.state,\n })\n },\n { name: 'Field', inheritAttrs: false },\n)\n"],"names":["FieldApi","useStore","computed","onMounted","onUnmounted","watch","defineComponent"],"mappings":";;;;;AA4LO,SAAS,SAiCd,MAyBA;AACA,QAAM,YAAY,MAAM;AACtB,UAAM,MAAM,IAAIA,kBAAS;AAAA,MACvB,GAAG;AAAA,MACH,MAAM,KAAK;AAAA,MACX,MAAM,KAAK;AAAA,IAAA,CACZ;AAED,WAAO;AAAA,EACT,GAAA;AAIA,QAAM,qBAAqBC,SAAAA;AAAAA,IACzB,SAAS;AAAA,IACR,KAAK,SAAS,UACX,CAAC,UAAU,MAAM,KAAK,iBAAiB,IACvC,CAAC,UAAU,MAAM;AAAA,EAAA;AAIvB,QAAM,wBAAwBA,SAAAA;AAAAA,IAC5B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,wBAAwBA,SAAAA;AAAAA,IAC5B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,sBAAsBA,SAAAA;AAAAA,IAC1B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,uBAAuBA,SAAAA;AAAAA,IAC3B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,6BAA6BA,SAAAA;AAAAA,IACjC,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,2BAA2BA,SAAAA;AAAAA,IAC/B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAGxB,QAAM,aAAaC,IAAAA,SAAS,MAAM;AAIhC,UAAM,eAAe,mBAAmB;AAMxC,UAAM,YAAY,sBAAsB;AACxC,UAAM,YAAY,sBAAsB;AACxC,UAAM,UAAU,oBAAoB;AACpC,UAAM,WAAW,qBAAqB;AACtC,UAAM,iBAAiB,2BAA2B;AAClD,UAAM,eAAe,yBAAyB;AAC9C,WAAO;AAAA,MACL,OACE,KAAK,SAAS,UAAU,SAAS,MAAM,QAAS;AAAA,MAClD,MAAM;AAAA,QACJ,GAAG,SAAS,MAAM;AAAA,QAClB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IACF;AAAA,EAEJ,CAAC;AAED,QAAM,mBAAmBA,IAAAA,SAAS,MAAM;AACtC,UAAM,mBAAmB;AAAA,MACvB,GAAG;AAAA,MACH,IAAI,QAAQ;AACV,eAAO,WAAW;AAAA,MACpB;AAAA,IAAA;AAGF,UAAM,cAwBF;AAEJ,WAAO;AAAA,EACT,CAAC;AAED,MAAI;AACJC,MAAAA,UAAU,MAAM;AACd,cAAU,SAAS,MAAA;AAAA,EACrB,CAAC;AAEDC,MAAAA,YAAY,MAAM;AAChB,YAAA;AAAA,EACF,CAAC;AAEDC,MAAAA;AAAAA,IACE,MAAM;AAAA,IACN,MAAM;AAEJ,eAAS,OAAO,EAAE,GAAG,MAAM,MAAM,KAAK,MAAe;AAAA,IACvD;AAAA,EAAA;AAGF,SAAO,EAAE,KAAK,iBAAiB,OAAO,OAAO,WAAW,MAAA;AAC1D;AAgGO,MAAM,QAAQC,IAAAA;AAAAA,EACnB,CAiCE,cAyBA,YACG;AACH,UAAM,WAAW,SAAS,EAAE,GAAG,cAAc,GAAG,QAAQ,OAAO;AAE/D,WAAO,MACL,QAAQ,MAAM,QAAS;AAAA,MACrB,OAAO,SAAS;AAAA,MAChB,OAAO,SAAS;AAAA,IAAA,CACjB;AAAA,EACL;AAAA,EACA,EAAE,MAAM,SAAS,cAAc,MAAA;AACjC;;;"}
1
+ {"version":3,"file":"useField.cjs","sources":["../../src/useField.tsx"],"sourcesContent":["import { FieldApi } from '@tanstack/form-core'\nimport { useStore } from '@tanstack/vue-store'\nimport { computed, defineComponent, onMounted, onUnmounted, watch } from 'vue'\nimport type {\n AnyFieldApi,\n AnyFieldMeta,\n DeepKeys,\n DeepValue,\n FieldAsyncValidateOrFn,\n FieldValidateOrFn,\n FormAsyncValidateOrFn,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type {\n ComponentOptionsMixin,\n CreateComponentPublicInstanceWithMixins,\n EmitsOptions,\n EmitsToProps,\n PublicProps,\n SetupContext,\n SlotsType,\n} from 'vue'\nimport type { UseFieldOptions, UseFieldOptionsBound } from './types'\n\nexport type FieldComponent<\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 TParentSubmitMeta,\n // This complex type comes from Vue's return type for `DefineSetupFnComponent` but with our own types sprinkled in\n // This allows us to pre-bind some generics while keeping the props type unbound generics for props-based inferencing\n> = new <\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 props: 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 > &\n EmitsToProps<EmitsOptions> &\n PublicProps,\n) => CreateComponentPublicInstanceWithMixins<\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 >,\n {},\n {},\n {},\n {},\n ComponentOptionsMixin,\n ComponentOptionsMixin,\n EmitsOptions,\n PublicProps,\n {},\n false,\n {},\n SlotsType<{\n default: {\n field: 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 TParentSubmitMeta\n >\n state: 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 TParentSubmitMeta\n >['state']\n }\n }>\n>\n\nexport interface VueFieldApi<\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 TParentSubmitMeta,\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 TParentSubmitMeta\n >\n}\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 TParentSubmitMeta,\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 TParentSubmitMeta\n >,\n) {\n const fieldApi = (() => {\n const api = new FieldApi({\n ...opts,\n form: opts.form,\n name: opts.name,\n })\n\n return api\n })()\n\n // For array mode, only track length changes to avoid re-renders when child properties change\n // See: https://github.com/TanStack/form/issues/1925\n const reactiveStateValue = useStore(\n fieldApi.store,\n (opts.mode === 'array'\n ? (state) => state.meta._arrayVersion || 0\n : (state) => state.value) as (\n state: typeof fieldApi.state,\n ) => TData | number,\n )\n const reactiveMetaIsTouched = useStore(\n fieldApi.store,\n (state) => state.meta.isTouched,\n )\n const reactiveMetaIsBlurred = useStore(\n fieldApi.store,\n (state) => state.meta.isBlurred,\n )\n const reactiveMetaIsDirty = useStore(\n fieldApi.store,\n (state) => state.meta.isDirty,\n )\n const reactiveMetaErrorMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorMap,\n )\n const reactiveMetaErrorSourceMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorSourceMap,\n )\n const reactiveMetaIsValidating = useStore(\n fieldApi.store,\n (state) => state.meta.isValidating,\n )\n\n const fieldState = computed(() => {\n // For array mode, reactiveStateValue is the length (for reactivity tracking),\n // so we need to read it to register the dependency, then return the actual\n // value from fieldApi.\n const trackedValue = reactiveStateValue.value\n // Read all reactive meta refs eagerly so that fieldState recomputes (and\n // dependent renders re-run) whenever any of them change. Without this, a\n // consumer reading `field.getMeta()` or `field.state.meta` from a render\n // function would not re-render on meta updates, since the meta getter\n // would never have registered those dependencies.\n const isTouched = reactiveMetaIsTouched.value\n const isBlurred = reactiveMetaIsBlurred.value\n const isDirty = reactiveMetaIsDirty.value\n const errorMap = reactiveMetaErrorMap.value\n const errorSourceMap = reactiveMetaErrorSourceMap.value\n const isValidating = reactiveMetaIsValidating.value\n return {\n value:\n opts.mode === 'array' ? fieldApi.state.value : (trackedValue as TData),\n meta: {\n ...fieldApi.state.meta,\n isTouched,\n isBlurred,\n isDirty,\n errorMap,\n errorSourceMap,\n isValidating,\n } satisfies AnyFieldMeta,\n } satisfies AnyFieldApi['state']\n })\n\n const extendedFieldApi = computed(() => {\n const reactiveFieldApi = {\n ...fieldApi,\n get state() {\n return fieldState.value\n },\n }\n\n const extendedApi: 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 TParentSubmitMeta\n > = reactiveFieldApi as never\n\n return extendedApi\n })\n\n let cleanup!: () => void\n onMounted(() => {\n cleanup = fieldApi.mount()\n })\n\n onUnmounted(() => {\n cleanup()\n })\n\n watch(\n () => opts,\n () => {\n // Keep options up to date as they are rendered\n fieldApi.update({ ...opts, form: opts.form } as never)\n },\n )\n\n return {\n api: extendedFieldApi.value,\n get state() {\n return fieldState.value\n },\n } as const\n}\n\nexport type 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 TParentSubmitMeta,\n> = 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 TParentSubmitMeta\n>\n\nexport type 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> = 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\nexport const Field = defineComponent(\n <\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 TParentSubmitMeta,\n >(\n fieldOptions: 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 TParentSubmitMeta\n >,\n context: SetupContext,\n ) => {\n const fieldApi = useField({ ...fieldOptions, ...context.attrs })\n\n return () =>\n context.slots.default!({\n field: fieldApi.api,\n state: fieldApi.state,\n })\n },\n { name: 'Field', inheritAttrs: false },\n)\n"],"names":["FieldApi","useStore","computed","onMounted","onUnmounted","watch","defineComponent"],"mappings":";;;;;AA4LO,SAAS,SAiCd,MAyBA;AACA,QAAM,YAAY,MAAM;AACtB,UAAM,MAAM,IAAIA,kBAAS;AAAA,MACvB,GAAG;AAAA,MACH,MAAM,KAAK;AAAA,MACX,MAAM,KAAK;AAAA,IAAA,CACZ;AAED,WAAO;AAAA,EACT,GAAA;AAIA,QAAM,qBAAqBC,SAAAA;AAAAA,IACzB,SAAS;AAAA,IACR,KAAK,SAAS,UACX,CAAC,UAAU,MAAM,KAAK,iBAAiB,IACvC,CAAC,UAAU,MAAM;AAAA,EAAA;AAIvB,QAAM,wBAAwBA,SAAAA;AAAAA,IAC5B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,wBAAwBA,SAAAA;AAAAA,IAC5B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,sBAAsBA,SAAAA;AAAAA,IAC1B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,uBAAuBA,SAAAA;AAAAA,IAC3B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,6BAA6BA,SAAAA;AAAAA,IACjC,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,2BAA2BA,SAAAA;AAAAA,IAC/B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAGxB,QAAM,aAAaC,IAAAA,SAAS,MAAM;AAIhC,UAAM,eAAe,mBAAmB;AAMxC,UAAM,YAAY,sBAAsB;AACxC,UAAM,YAAY,sBAAsB;AACxC,UAAM,UAAU,oBAAoB;AACpC,UAAM,WAAW,qBAAqB;AACtC,UAAM,iBAAiB,2BAA2B;AAClD,UAAM,eAAe,yBAAyB;AAC9C,WAAO;AAAA,MACL,OACE,KAAK,SAAS,UAAU,SAAS,MAAM,QAAS;AAAA,MAClD,MAAM;AAAA,QACJ,GAAG,SAAS,MAAM;AAAA,QAClB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IACF;AAAA,EAEJ,CAAC;AAED,QAAM,mBAAmBA,IAAAA,SAAS,MAAM;AACtC,UAAM,mBAAmB;AAAA,MACvB,GAAG;AAAA,MACH,IAAI,QAAQ;AACV,eAAO,WAAW;AAAA,MACpB;AAAA,IAAA;AAGF,UAAM,cAwBF;AAEJ,WAAO;AAAA,EACT,CAAC;AAED,MAAI;AACJC,MAAAA,UAAU,MAAM;AACd,cAAU,SAAS,MAAA;AAAA,EACrB,CAAC;AAEDC,MAAAA,YAAY,MAAM;AAChB,YAAA;AAAA,EACF,CAAC;AAEDC,MAAAA;AAAAA,IACE,MAAM;AAAA,IACN,MAAM;AAEJ,eAAS,OAAO,EAAE,GAAG,MAAM,MAAM,KAAK,MAAe;AAAA,IACvD;AAAA,EAAA;AAGF,SAAO;AAAA,IACL,KAAK,iBAAiB;AAAA,IACtB,IAAI,QAAQ;AACV,aAAO,WAAW;AAAA,IACpB;AAAA,EAAA;AAEJ;AAgGO,MAAM,QAAQC,IAAAA;AAAAA,EACnB,CAiCE,cAyBA,YACG;AACH,UAAM,WAAW,SAAS,EAAE,GAAG,cAAc,GAAG,QAAQ,OAAO;AAE/D,WAAO,MACL,QAAQ,MAAM,QAAS;AAAA,MACrB,OAAO,SAAS;AAAA,MAChB,OAAO,SAAS;AAAA,IAAA,CACjB;AAAA,EACL;AAAA,EACA,EAAE,MAAM,SAAS,cAAc,MAAA;AACjC;;;"}
package/dist/cjs/useField.d.cts CHANGED
@@ -35,11 +35,11 @@ export declare const Field: new <TParentData, TName extends DeepKeys<TParentData
35
35
  [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
36
36
  } | {
37
37
  [x: `on${Capitalize<string>}`]: ((...args: never) => any) | undefined;
38
- })) & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps) => CreateComponentPublicInstanceWithMixins<UseFieldOptions<TParentData, TName, TData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TFormOnMount, TFormOnChange, TFormOnChangeAsync, TFormOnBlur, TFormOnBlurAsync, TFormOnSubmit, TFormOnSubmitAsync, TFormOnDynamic, TFormOnDynamicAsync, TFormOnServer, TParentSubmitMeta> & ({
38
+ })) & import('@vue/runtime-core').VNodeProps & import('@vue/runtime-core').AllowedComponentProps & import('@vue/runtime-core').ComponentCustomProps) => CreateComponentPublicInstanceWithMixins<UseFieldOptions<TParentData, TName, TData, TOnMount, TOnChange, TOnChangeAsync, TOnBlur, TOnBlurAsync, TOnSubmit, TOnSubmitAsync, TOnDynamic, TOnDynamicAsync, TFormOnMount, TFormOnChange, TFormOnChangeAsync, TFormOnBlur, TFormOnBlurAsync, TFormOnSubmit, TFormOnSubmitAsync, TFormOnDynamic, TFormOnDynamicAsync, TFormOnServer, TParentSubmitMeta> & ({
39
39
  [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
40
40
  } | {
41
41
  [x: `on${Capitalize<string>}`]: ((...args: never) => any) | undefined;
42
- }), {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, EmitsOptions, PublicProps, {}, false, {}, {}, {}, {}, string, {}, any, import('vue').ComponentProvideOptions, {
42
+ }), {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, EmitsOptions, PublicProps, {}, false, {}, {}, {}, {}, string, {}, any, import('@vue/runtime-core').ComponentProvideOptions, {
43
43
  P: {};
44
44
  B: {};
45
45
  D: {};
package/dist/esm/useField.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { FieldApi } from "@tanstack/form-core";
2
2
  import { useStore } from "@tanstack/vue-store";
3
- import { defineComponent, computed, onMounted, onUnmounted, watch } from "vue";
3
+ import { computed, onMounted, onUnmounted, watch, defineComponent } from "vue";
4
4
  function useField(opts) {
5
5
  const fieldApi = (() => {
6
6
  const api = new FieldApi({
@@ -82,7 +82,12 @@ function useField(opts) {
82
82
  fieldApi.update({ ...opts, form: opts.form });
83
83
  }
84
84
  );
85
- return { api: extendedFieldApi.value, state: fieldState.value };
85
+ return {
86
+ api: extendedFieldApi.value,
87
+ get state() {
88
+ return fieldState.value;
89
+ }
90
+ };
86
91
  }
87
92
  const Field = defineComponent(
88
93
  (fieldOptions, context) => {
package/dist/esm/useField.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useField.js","sources":["../../src/useField.tsx"],"sourcesContent":["import { FieldApi } from '@tanstack/form-core'\nimport { useStore } from '@tanstack/vue-store'\nimport { computed, defineComponent, onMounted, onUnmounted, watch } from 'vue'\nimport type {\n AnyFieldApi,\n AnyFieldMeta,\n DeepKeys,\n DeepValue,\n FieldAsyncValidateOrFn,\n FieldValidateOrFn,\n FormAsyncValidateOrFn,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type {\n ComponentOptionsMixin,\n CreateComponentPublicInstanceWithMixins,\n EmitsOptions,\n EmitsToProps,\n PublicProps,\n SetupContext,\n SlotsType,\n} from 'vue'\nimport type { UseFieldOptions, UseFieldOptionsBound } from './types'\n\nexport type FieldComponent<\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 TParentSubmitMeta,\n // This complex type comes from Vue's return type for `DefineSetupFnComponent` but with our own types sprinkled in\n // This allows us to pre-bind some generics while keeping the props type unbound generics for props-based inferencing\n> = new <\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 props: 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 > &\n EmitsToProps<EmitsOptions> &\n PublicProps,\n) => CreateComponentPublicInstanceWithMixins<\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 >,\n {},\n {},\n {},\n {},\n ComponentOptionsMixin,\n ComponentOptionsMixin,\n EmitsOptions,\n PublicProps,\n {},\n false,\n {},\n SlotsType<{\n default: {\n field: 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 TParentSubmitMeta\n >\n state: 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 TParentSubmitMeta\n >['state']\n }\n }>\n>\n\nexport interface VueFieldApi<\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 TParentSubmitMeta,\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 TParentSubmitMeta\n >\n}\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 TParentSubmitMeta,\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 TParentSubmitMeta\n >,\n) {\n const fieldApi = (() => {\n const api = new FieldApi({\n ...opts,\n form: opts.form,\n name: opts.name,\n })\n\n return api\n })()\n\n // For array mode, only track length changes to avoid re-renders when child properties change\n // See: https://github.com/TanStack/form/issues/1925\n const reactiveStateValue = useStore(\n fieldApi.store,\n (opts.mode === 'array'\n ? (state) => state.meta._arrayVersion || 0\n : (state) => state.value) as (\n state: typeof fieldApi.state,\n ) => TData | number,\n )\n const reactiveMetaIsTouched = useStore(\n fieldApi.store,\n (state) => state.meta.isTouched,\n )\n const reactiveMetaIsBlurred = useStore(\n fieldApi.store,\n (state) => state.meta.isBlurred,\n )\n const reactiveMetaIsDirty = useStore(\n fieldApi.store,\n (state) => state.meta.isDirty,\n )\n const reactiveMetaErrorMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorMap,\n )\n const reactiveMetaErrorSourceMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorSourceMap,\n )\n const reactiveMetaIsValidating = useStore(\n fieldApi.store,\n (state) => state.meta.isValidating,\n )\n\n const fieldState = computed(() => {\n // For array mode, reactiveStateValue is the length (for reactivity tracking),\n // so we need to read it to register the dependency, then return the actual\n // value from fieldApi.\n const trackedValue = reactiveStateValue.value\n // Read all reactive meta refs eagerly so that fieldState recomputes (and\n // dependent renders re-run) whenever any of them change. Without this, a\n // consumer reading `field.getMeta()` or `field.state.meta` from a render\n // function would not re-render on meta updates, since the meta getter\n // would never have registered those dependencies.\n const isTouched = reactiveMetaIsTouched.value\n const isBlurred = reactiveMetaIsBlurred.value\n const isDirty = reactiveMetaIsDirty.value\n const errorMap = reactiveMetaErrorMap.value\n const errorSourceMap = reactiveMetaErrorSourceMap.value\n const isValidating = reactiveMetaIsValidating.value\n return {\n value:\n opts.mode === 'array' ? fieldApi.state.value : (trackedValue as TData),\n meta: {\n ...fieldApi.state.meta,\n isTouched,\n isBlurred,\n isDirty,\n errorMap,\n errorSourceMap,\n isValidating,\n } satisfies AnyFieldMeta,\n } satisfies AnyFieldApi['state']\n })\n\n const extendedFieldApi = computed(() => {\n const reactiveFieldApi = {\n ...fieldApi,\n get state() {\n return fieldState.value\n },\n }\n\n const extendedApi: 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 TParentSubmitMeta\n > = reactiveFieldApi as never\n\n return extendedApi\n })\n\n let cleanup!: () => void\n onMounted(() => {\n cleanup = fieldApi.mount()\n })\n\n onUnmounted(() => {\n cleanup()\n })\n\n watch(\n () => opts,\n () => {\n // Keep options up to date as they are rendered\n fieldApi.update({ ...opts, form: opts.form } as never)\n },\n )\n\n return { api: extendedFieldApi.value, state: fieldState.value } as const\n}\n\nexport type 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 TParentSubmitMeta,\n> = 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 TParentSubmitMeta\n>\n\nexport type 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> = 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\nexport const Field = defineComponent(\n <\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 TParentSubmitMeta,\n >(\n fieldOptions: 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 TParentSubmitMeta\n >,\n context: SetupContext,\n ) => {\n const fieldApi = useField({ ...fieldOptions, ...context.attrs })\n\n return () =>\n context.slots.default!({\n field: fieldApi.api,\n state: fieldApi.state,\n })\n },\n { name: 'Field', inheritAttrs: false },\n)\n"],"names":[],"mappings":";;;AA4LO,SAAS,SAiCd,MAyBA;AACA,QAAM,YAAY,MAAM;AACtB,UAAM,MAAM,IAAI,SAAS;AAAA,MACvB,GAAG;AAAA,MACH,MAAM,KAAK;AAAA,MACX,MAAM,KAAK;AAAA,IAAA,CACZ;AAED,WAAO;AAAA,EACT,GAAA;AAIA,QAAM,qBAAqB;AAAA,IACzB,SAAS;AAAA,IACR,KAAK,SAAS,UACX,CAAC,UAAU,MAAM,KAAK,iBAAiB,IACvC,CAAC,UAAU,MAAM;AAAA,EAAA;AAIvB,QAAM,wBAAwB;AAAA,IAC5B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,wBAAwB;AAAA,IAC5B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,sBAAsB;AAAA,IAC1B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,uBAAuB;AAAA,IAC3B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,6BAA6B;AAAA,IACjC,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,2BAA2B;AAAA,IAC/B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAGxB,QAAM,aAAa,SAAS,MAAM;AAIhC,UAAM,eAAe,mBAAmB;AAMxC,UAAM,YAAY,sBAAsB;AACxC,UAAM,YAAY,sBAAsB;AACxC,UAAM,UAAU,oBAAoB;AACpC,UAAM,WAAW,qBAAqB;AACtC,UAAM,iBAAiB,2BAA2B;AAClD,UAAM,eAAe,yBAAyB;AAC9C,WAAO;AAAA,MACL,OACE,KAAK,SAAS,UAAU,SAAS,MAAM,QAAS;AAAA,MAClD,MAAM;AAAA,QACJ,GAAG,SAAS,MAAM;AAAA,QAClB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IACF;AAAA,EAEJ,CAAC;AAED,QAAM,mBAAmB,SAAS,MAAM;AACtC,UAAM,mBAAmB;AAAA,MACvB,GAAG;AAAA,MACH,IAAI,QAAQ;AACV,eAAO,WAAW;AAAA,MACpB;AAAA,IAAA;AAGF,UAAM,cAwBF;AAEJ,WAAO;AAAA,EACT,CAAC;AAED,MAAI;AACJ,YAAU,MAAM;AACd,cAAU,SAAS,MAAA;AAAA,EACrB,CAAC;AAED,cAAY,MAAM;AAChB,YAAA;AAAA,EACF,CAAC;AAED;AAAA,IACE,MAAM;AAAA,IACN,MAAM;AAEJ,eAAS,OAAO,EAAE,GAAG,MAAM,MAAM,KAAK,MAAe;AAAA,IACvD;AAAA,EAAA;AAGF,SAAO,EAAE,KAAK,iBAAiB,OAAO,OAAO,WAAW,MAAA;AAC1D;AAgGO,MAAM,QAAQ;AAAA,EACnB,CAiCE,cAyBA,YACG;AACH,UAAM,WAAW,SAAS,EAAE,GAAG,cAAc,GAAG,QAAQ,OAAO;AAE/D,WAAO,MACL,QAAQ,MAAM,QAAS;AAAA,MACrB,OAAO,SAAS;AAAA,MAChB,OAAO,SAAS;AAAA,IAAA,CACjB;AAAA,EACL;AAAA,EACA,EAAE,MAAM,SAAS,cAAc,MAAA;AACjC;"}
1
+ {"version":3,"file":"useField.js","sources":["../../src/useField.tsx"],"sourcesContent":["import { FieldApi } from '@tanstack/form-core'\nimport { useStore } from '@tanstack/vue-store'\nimport { computed, defineComponent, onMounted, onUnmounted, watch } from 'vue'\nimport type {\n AnyFieldApi,\n AnyFieldMeta,\n DeepKeys,\n DeepValue,\n FieldAsyncValidateOrFn,\n FieldValidateOrFn,\n FormAsyncValidateOrFn,\n FormValidateOrFn,\n} from '@tanstack/form-core'\nimport type {\n ComponentOptionsMixin,\n CreateComponentPublicInstanceWithMixins,\n EmitsOptions,\n EmitsToProps,\n PublicProps,\n SetupContext,\n SlotsType,\n} from 'vue'\nimport type { UseFieldOptions, UseFieldOptionsBound } from './types'\n\nexport type FieldComponent<\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 TParentSubmitMeta,\n // This complex type comes from Vue's return type for `DefineSetupFnComponent` but with our own types sprinkled in\n // This allows us to pre-bind some generics while keeping the props type unbound generics for props-based inferencing\n> = new <\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 props: 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 > &\n EmitsToProps<EmitsOptions> &\n PublicProps,\n) => CreateComponentPublicInstanceWithMixins<\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 >,\n {},\n {},\n {},\n {},\n ComponentOptionsMixin,\n ComponentOptionsMixin,\n EmitsOptions,\n PublicProps,\n {},\n false,\n {},\n SlotsType<{\n default: {\n field: 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 TParentSubmitMeta\n >\n state: 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 TParentSubmitMeta\n >['state']\n }\n }>\n>\n\nexport interface VueFieldApi<\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 TParentSubmitMeta,\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 TParentSubmitMeta\n >\n}\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 TParentSubmitMeta,\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 TParentSubmitMeta\n >,\n) {\n const fieldApi = (() => {\n const api = new FieldApi({\n ...opts,\n form: opts.form,\n name: opts.name,\n })\n\n return api\n })()\n\n // For array mode, only track length changes to avoid re-renders when child properties change\n // See: https://github.com/TanStack/form/issues/1925\n const reactiveStateValue = useStore(\n fieldApi.store,\n (opts.mode === 'array'\n ? (state) => state.meta._arrayVersion || 0\n : (state) => state.value) as (\n state: typeof fieldApi.state,\n ) => TData | number,\n )\n const reactiveMetaIsTouched = useStore(\n fieldApi.store,\n (state) => state.meta.isTouched,\n )\n const reactiveMetaIsBlurred = useStore(\n fieldApi.store,\n (state) => state.meta.isBlurred,\n )\n const reactiveMetaIsDirty = useStore(\n fieldApi.store,\n (state) => state.meta.isDirty,\n )\n const reactiveMetaErrorMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorMap,\n )\n const reactiveMetaErrorSourceMap = useStore(\n fieldApi.store,\n (state) => state.meta.errorSourceMap,\n )\n const reactiveMetaIsValidating = useStore(\n fieldApi.store,\n (state) => state.meta.isValidating,\n )\n\n const fieldState = computed(() => {\n // For array mode, reactiveStateValue is the length (for reactivity tracking),\n // so we need to read it to register the dependency, then return the actual\n // value from fieldApi.\n const trackedValue = reactiveStateValue.value\n // Read all reactive meta refs eagerly so that fieldState recomputes (and\n // dependent renders re-run) whenever any of them change. Without this, a\n // consumer reading `field.getMeta()` or `field.state.meta` from a render\n // function would not re-render on meta updates, since the meta getter\n // would never have registered those dependencies.\n const isTouched = reactiveMetaIsTouched.value\n const isBlurred = reactiveMetaIsBlurred.value\n const isDirty = reactiveMetaIsDirty.value\n const errorMap = reactiveMetaErrorMap.value\n const errorSourceMap = reactiveMetaErrorSourceMap.value\n const isValidating = reactiveMetaIsValidating.value\n return {\n value:\n opts.mode === 'array' ? fieldApi.state.value : (trackedValue as TData),\n meta: {\n ...fieldApi.state.meta,\n isTouched,\n isBlurred,\n isDirty,\n errorMap,\n errorSourceMap,\n isValidating,\n } satisfies AnyFieldMeta,\n } satisfies AnyFieldApi['state']\n })\n\n const extendedFieldApi = computed(() => {\n const reactiveFieldApi = {\n ...fieldApi,\n get state() {\n return fieldState.value\n },\n }\n\n const extendedApi: 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 TParentSubmitMeta\n > = reactiveFieldApi as never\n\n return extendedApi\n })\n\n let cleanup!: () => void\n onMounted(() => {\n cleanup = fieldApi.mount()\n })\n\n onUnmounted(() => {\n cleanup()\n })\n\n watch(\n () => opts,\n () => {\n // Keep options up to date as they are rendered\n fieldApi.update({ ...opts, form: opts.form } as never)\n },\n )\n\n return {\n api: extendedFieldApi.value,\n get state() {\n return fieldState.value\n },\n } as const\n}\n\nexport type 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 TParentSubmitMeta,\n> = 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 TParentSubmitMeta\n>\n\nexport type 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> = 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\nexport const Field = defineComponent(\n <\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 TParentSubmitMeta,\n >(\n fieldOptions: 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 TParentSubmitMeta\n >,\n context: SetupContext,\n ) => {\n const fieldApi = useField({ ...fieldOptions, ...context.attrs })\n\n return () =>\n context.slots.default!({\n field: fieldApi.api,\n state: fieldApi.state,\n })\n },\n { name: 'Field', inheritAttrs: false },\n)\n"],"names":[],"mappings":";;;AA4LO,SAAS,SAiCd,MAyBA;AACA,QAAM,YAAY,MAAM;AACtB,UAAM,MAAM,IAAI,SAAS;AAAA,MACvB,GAAG;AAAA,MACH,MAAM,KAAK;AAAA,MACX,MAAM,KAAK;AAAA,IAAA,CACZ;AAED,WAAO;AAAA,EACT,GAAA;AAIA,QAAM,qBAAqB;AAAA,IACzB,SAAS;AAAA,IACR,KAAK,SAAS,UACX,CAAC,UAAU,MAAM,KAAK,iBAAiB,IACvC,CAAC,UAAU,MAAM;AAAA,EAAA;AAIvB,QAAM,wBAAwB;AAAA,IAC5B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,wBAAwB;AAAA,IAC5B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,sBAAsB;AAAA,IAC1B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,uBAAuB;AAAA,IAC3B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,6BAA6B;AAAA,IACjC,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAExB,QAAM,2BAA2B;AAAA,IAC/B,SAAS;AAAA,IACT,CAAC,UAAU,MAAM,KAAK;AAAA,EAAA;AAGxB,QAAM,aAAa,SAAS,MAAM;AAIhC,UAAM,eAAe,mBAAmB;AAMxC,UAAM,YAAY,sBAAsB;AACxC,UAAM,YAAY,sBAAsB;AACxC,UAAM,UAAU,oBAAoB;AACpC,UAAM,WAAW,qBAAqB;AACtC,UAAM,iBAAiB,2BAA2B;AAClD,UAAM,eAAe,yBAAyB;AAC9C,WAAO;AAAA,MACL,OACE,KAAK,SAAS,UAAU,SAAS,MAAM,QAAS;AAAA,MAClD,MAAM;AAAA,QACJ,GAAG,SAAS,MAAM;AAAA,QAClB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IACF;AAAA,EAEJ,CAAC;AAED,QAAM,mBAAmB,SAAS,MAAM;AACtC,UAAM,mBAAmB;AAAA,MACvB,GAAG;AAAA,MACH,IAAI,QAAQ;AACV,eAAO,WAAW;AAAA,MACpB;AAAA,IAAA;AAGF,UAAM,cAwBF;AAEJ,WAAO;AAAA,EACT,CAAC;AAED,MAAI;AACJ,YAAU,MAAM;AACd,cAAU,SAAS,MAAA;AAAA,EACrB,CAAC;AAED,cAAY,MAAM;AAChB,YAAA;AAAA,EACF,CAAC;AAED;AAAA,IACE,MAAM;AAAA,IACN,MAAM;AAEJ,eAAS,OAAO,EAAE,GAAG,MAAM,MAAM,KAAK,MAAe;AAAA,IACvD;AAAA,EAAA;AAGF,SAAO;AAAA,IACL,KAAK,iBAAiB;AAAA,IACtB,IAAI,QAAQ;AACV,aAAO,WAAW;AAAA,IACpB;AAAA,EAAA;AAEJ;AAgGO,MAAM,QAAQ;AAAA,EACnB,CAiCE,cAyBA,YACG;AACH,UAAM,WAAW,SAAS,EAAE,GAAG,cAAc,GAAG,QAAQ,OAAO;AAE/D,WAAO,MACL,QAAQ,MAAM,QAAS;AAAA,MACrB,OAAO,SAAS;AAAA,MAChB,OAAO,SAAS;AAAA,IAAA,CACjB;AAAA,EACL;AAAA,EACA,EAAE,MAAM,SAAS,cAAc,MAAA;AACjC;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tanstack/vue-form",
3
- "version": "1.32.0",
3
+ "version": "1.32.1",
4
4
  "description": "Powerful, type-safe forms for Vue.",
5
5
  "author": "tannerlinsley",
6
6
  "license": "MIT",
@@ -38,7 +38,7 @@
38
38
  ],
39
39
  "dependencies": {
40
40
  "@tanstack/vue-store": "^0.9.1",
41
- "@tanstack/form-core": "1.32.0"
41
+ "@tanstack/form-core": "1.32.1"
42
42
  },
43
43
  "devDependencies": {
44
44
  "@vitejs/plugin-vue": "^5.2.4",
@@ -56,7 +56,8 @@
56
56
  "test:types:ts55": "node ../../node_modules/typescript55/lib/tsc.js",
57
57
  "test:types:ts56": "node ../../node_modules/typescript56/lib/tsc.js",
58
58
  "test:types:ts57": "node ../../node_modules/typescript57/lib/tsc.js",
59
- "test:types:ts58": "tsc",
59
+ "test:types:ts58": "node ../../node_modules/typescript58/lib/tsc.js",
60
+ "test:types:ts59": "tsc",
60
61
  "fixme:test:lib": "pnpm run test:2 && pnpm run test:2.7 && pnpm run test:3",
61
62
  "test:lib": "vitest",
62
63
  "test:lib:dev": "pnpm run test:lib --watch",
package/src/useField.tsx CHANGED
@@ -375,7 +375,12 @@ export function useField<
375
375
  },
376
376
  )
377
377
 
378
- return { api: extendedFieldApi.value, state: fieldState.value } as const
378
+ return {
379
+ api: extendedFieldApi.value,
380
+ get state() {
381
+ return fieldState.value
382
+ },
383
+ } as const
379
384
  }
380
385
 
381
386
  export type FieldComponentProps<