@tanstack/react-form 0.0.11 → 0.0.12

package/build/lib/useField.js

@@ -0,0 +1,74 @@
+import * as React from 'react';
+import { useStore } from '@tanstack/react-store';
+import { FieldApi, functionalUpdate } from '@tanstack/form-core';
+import { useFormContext, formContext } from './formContext.js';
+
+function useField(opts) {
+  // Get the form API either manually or from context
+  const {
+    formApi,
+    parentFieldName
+  } = useFormContext();
+  const [fieldApi] = React.useState(() => {
+    const name = (typeof opts.index === 'number' ? [parentFieldName, opts.index, opts.name] : [parentFieldName, opts.name]).filter(d => d !== undefined).join('.');
+    const api = new FieldApi({
+      ...opts,
+      form: formApi,
+      name: name
+    });
+    api.Field = Field;
+    return api;
+  });
+
+  // Keep options up to date as they are rendered
+  fieldApi.update({
+    ...opts,
+    form: formApi
+  });
+  useStore(fieldApi.store, opts.mode === 'array' ? state => {
+    return [state.meta, Object.keys(state.value || []).length];
+  } : undefined);
+
+  // Instantiates field meta and removes it when unrendered
+  React.useEffect(() => fieldApi.mount(), [fieldApi]);
+  return fieldApi;
+}
+
+// export type FieldValue<TFormData, TField> = TFormData extends any[]
+//   ? TField extends `[${infer TIndex extends number | 'i'}].${infer TRest}`
+//     ? DeepValue<TFormData[TIndex extends 'i' ? number : TIndex], TRest>
+//     : TField extends `[${infer TIndex extends number | 'i'}]`
+//     ? TFormData[TIndex extends 'i' ? number : TIndex]
+//     : never
+//   : TField extends `${infer TPrefix}[${infer TIndex extends
+//       | number
+//       | 'i'}].${infer TRest}`
+//   ? DeepValue<
+//       DeepValue<TFormData, TPrefix>[TIndex extends 'i' ? number : TIndex],
+//       TRest
+//     >
+//   : TField extends `${infer TPrefix}[${infer TIndex extends number | 'i'}]`
+//   ? DeepValue<TFormData, TPrefix>[TIndex extends 'i' ? number : TIndex]
+//   : DeepValue<TFormData, TField>
+// type Test1 = FieldValue<{ foo: { bar: string }[] }, 'foo'>
+// //   ^?
+// type Test2 = FieldValue<{ foo: { bar: string }[] }, 'foo[i]'>
+// //   ^?
+// type Test3 = FieldValue<{ foo: { bar: string }[] }, 'foo[2].bar'>
+// //   ^?
+function Field({
+  children,
+  ...fieldOptions
+}) {
+  const fieldApi = useField(fieldOptions);
+  return /*#__PURE__*/React.createElement(formContext.Provider, {
+    value: {
+      formApi: fieldApi.form,
+      parentFieldName: fieldApi.name
+    },
+    children: functionalUpdate(children, fieldApi)
+  });
+}
+
+export { Field, useField };
+//# sourceMappingURL=useField.js.map

package/build/lib/useField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useField.js","sources":["../../src/useField.tsx"],"sourcesContent":["import * as React from 'react'\n//\nimport { useStore } from '@tanstack/react-store'\nimport type {\n  DeepKeys,\n  DeepValue,\n  FieldOptions,\n  Narrow,\n} from '@tanstack/form-core'\nimport { FieldApi, functionalUpdate } from '@tanstack/form-core'\nimport { useFormContext, formContext } from './formContext'\n\ndeclare module '@tanstack/form-core' {\n  // eslint-disable-next-line no-shadow\n  interface FieldApi<TData, TFormData> {\n    Field: FieldComponent<TData, TFormData>\n  }\n}\n\nexport type UseFieldOptions<TData, TFormData> = FieldOptions<\n  TData,\n  TFormData\n> & {\n  mode?: 'value' | 'array'\n}\n\nexport type UseField<TFormData> = <TField extends DeepKeys<TFormData>>(\n  opts?: { name: Narrow<TField> } & UseFieldOptions<\n    DeepValue<TFormData, TField>,\n    TFormData\n  >,\n) => FieldApi<DeepValue<TFormData, TField>, TFormData>\n\nexport function useField<TData, TFormData>(\n  opts: UseFieldOptions<TData, TFormData>,\n): FieldApi<TData, TFormData> {\n  // Get the form API either manually or from context\n  const { formApi, parentFieldName } = useFormContext()\n\n  const [fieldApi] = React.useState<FieldApi<TData, TFormData>>(() => {\n    const name = (\n      typeof opts.index === 'number'\n        ? [parentFieldName, opts.index, opts.name]\n        : [parentFieldName, opts.name]\n    )\n      .filter((d) => d !== undefined)\n      .join('.')\n\n    const api = new FieldApi({ ...opts, form: formApi, name: name as any })\n\n    api.Field = Field as any\n\n    return api\n  })\n\n  // Keep options up to date as they are rendered\n  fieldApi.update({ ...opts, form: formApi } as never)\n\n  useStore(\n    fieldApi.store as any,\n    opts.mode === 'array'\n      ? (state: any) => {\n          return [state.meta, Object.keys(state.value || []).length]\n        }\n      : undefined,\n  )\n\n  // Instantiates field meta and removes it when unrendered\n  React.useEffect(() => fieldApi.mount(), [fieldApi])\n\n  return fieldApi\n}\n\n// export type FieldValue<TFormData, TField> = TFormData extends any[]\n//   ? TField extends `[${infer TIndex extends number | 'i'}].${infer TRest}`\n//     ? DeepValue<TFormData[TIndex extends 'i' ? number : TIndex], TRest>\n//     : TField extends `[${infer TIndex extends number | 'i'}]`\n//     ? TFormData[TIndex extends 'i' ? number : TIndex]\n//     : never\n//   : TField extends `${infer TPrefix}[${infer TIndex extends\n//       | number\n//       | 'i'}].${infer TRest}`\n//   ? DeepValue<\n//       DeepValue<TFormData, TPrefix>[TIndex extends 'i' ? number : TIndex],\n//       TRest\n//     >\n//   : TField extends `${infer TPrefix}[${infer TIndex extends number | 'i'}]`\n//   ? DeepValue<TFormData, TPrefix>[TIndex extends 'i' ? number : TIndex]\n//   : DeepValue<TFormData, TField>\n\nexport type FieldValue<TFormData, TField> = TFormData extends any[]\n  ? unknown extends TField\n    ? TFormData[number]\n    : DeepValue<TFormData[number], TField>\n  : DeepValue<TFormData, TField>\n\n// type Test1 = FieldValue<{ foo: { bar: string }[] }, 'foo'>\n// //   ^?\n// type Test2 = FieldValue<{ foo: { bar: string }[] }, 'foo[i]'>\n// //   ^?\n// type Test3 = FieldValue<{ foo: { bar: string }[] }, 'foo[2].bar'>\n// //   ^?\n\nexport type FieldComponent<TParentData, TFormData> = <TField>({\n  children,\n  ...fieldOptions\n}: {\n  children: (\n    fieldApi: FieldApi<FieldValue<TParentData, TField>, TFormData>,\n  ) => any\n} & Omit<\n  UseFieldOptions<FieldValue<TParentData, TField>, TFormData>,\n  'name' | 'index'\n> &\n  (TParentData extends any[]\n    ? {\n        name?: TField extends undefined ? TField : DeepKeys<TParentData>\n        index: number\n      }\n    : {\n        name: TField extends undefined ? TField : DeepKeys<TParentData>\n        index?: never\n      })) => any\n\nexport function Field<TData, TFormData>({\n  children,\n  ...fieldOptions\n}: {\n  children: (fieldApi: FieldApi<TData, TFormData>) => any\n} & UseFieldOptions<TData, TFormData>) {\n  const fieldApi = useField(fieldOptions as any)\n\n  return (\n    <formContext.Provider\n      value={{ formApi: fieldApi.form, parentFieldName: fieldApi.name }}\n      children={functionalUpdate(children, fieldApi as any)}\n    />\n  )\n}\n"],"names":["useField","opts","formApi","parentFieldName","useFormContext","fieldApi","React","useState","name","index","filter","d","undefined","join","api","FieldApi","form","Field","update","useStore","store","mode","state","meta","Object","keys","value","length","useEffect","mount","children","fieldOptions","createElement","formContext","Provider","functionalUpdate"],"mappings":";;;;;AAiCO,SAASA,QAAQA,CACtBC,IAAuC,EACX;AAC5B;EACA,MAAM;IAAEC,OAAO;AAAEC,IAAAA,eAAAA;GAAiB,GAAGC,cAAc,EAAE,CAAA;EAErD,MAAM,CAACC,QAAQ,CAAC,GAAGC,KAAK,CAACC,QAAQ,CAA6B,MAAM;AAClE,IAAA,MAAMC,IAAI,GAAG,CACX,OAAOP,IAAI,CAACQ,KAAK,KAAK,QAAQ,GAC1B,CAACN,eAAe,EAAEF,IAAI,CAACQ,KAAK,EAAER,IAAI,CAACO,IAAI,CAAC,GACxC,CAACL,eAAe,EAAEF,IAAI,CAACO,IAAI,CAAC,EAE/BE,MAAM,CAAEC,CAAC,IAAKA,CAAC,KAAKC,SAAS,CAAC,CAC9BC,IAAI,CAAC,GAAG,CAAC,CAAA;AAEZ,IAAA,MAAMC,GAAG,GAAG,IAAIC,QAAQ,CAAC;AAAE,MAAA,GAAGd,IAAI;AAAEe,MAAAA,IAAI,EAAEd,OAAO;AAAEM,MAAAA,IAAI,EAAEA,IAAAA;AAAY,KAAC,CAAC,CAAA;IAEvEM,GAAG,CAACG,KAAK,GAAGA,KAAY,CAAA;AAExB,IAAA,OAAOH,GAAG,CAAA;AACZ,GAAC,CAAC,CAAA;;AAEF;EACAT,QAAQ,CAACa,MAAM,CAAC;AAAE,IAAA,GAAGjB,IAAI;AAAEe,IAAAA,IAAI,EAAEd,OAAAA;AAAQ,GAAU,CAAC,CAAA;AAEpDiB,EAAAA,QAAQ,CACNd,QAAQ,CAACe,KAAK,EACdnB,IAAI,CAACoB,IAAI,KAAK,OAAO,GAChBC,KAAU,IAAK;AACd,IAAA,OAAO,CAACA,KAAK,CAACC,IAAI,EAAEC,MAAM,CAACC,IAAI,CAACH,KAAK,CAACI,KAAK,IAAI,EAAE,CAAC,CAACC,MAAM,CAAC,CAAA;GAC3D,GACDf,SACN,CAAC,CAAA;;AAED;AACAN,EAAAA,KAAK,CAACsB,SAAS,CAAC,MAAMvB,QAAQ,CAACwB,KAAK,EAAE,EAAE,CAACxB,QAAQ,CAAC,CAAC,CAAA;AAEnD,EAAA,OAAOA,QAAQ,CAAA;AACjB,CAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AACA;AACA;AACA;AACA;AAuBO,SAASY,KAAKA,CAAmB;EACtCa,QAAQ;EACR,GAAGC,YAAAA;AAG+B,CAAC,EAAE;AACrC,EAAA,MAAM1B,QAAQ,GAAGL,QAAQ,CAAC+B,YAAmB,CAAC,CAAA;AAE9C,EAAA,oBACEzB,KAAA,CAAA0B,aAAA,CAACC,WAAW,CAACC,QAAQ,EAAA;AACnBR,IAAAA,KAAK,EAAE;MAAExB,OAAO,EAAEG,QAAQ,CAACW,IAAI;MAAEb,eAAe,EAAEE,QAAQ,CAACG,IAAAA;KAAO;AAClEsB,IAAAA,QAAQ,EAAEK,gBAAgB,CAACL,QAAQ,EAAEzB,QAAe,CAAA;AAAE,GACvD,CAAC,CAAA;AAEN;;;;"}

package/build/lib/useField.legacy.cjs

@@ -0,0 +1,96 @@
+'use strict';
+
+var React = require('react');
+var reactStore = require('@tanstack/react-store');
+var formCore = require('@tanstack/form-core');
+var formContext = require('./formContext.legacy.cjs');
+
+function _interopNamespaceDefault(e) {
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+function useField(opts) {
+  // Get the form API either manually or from context
+  const {
+    formApi,
+    parentFieldName
+  } = formContext.useFormContext();
+  const [fieldApi] = React__namespace.useState(() => {
+    const name = (typeof opts.index === 'number' ? [parentFieldName, opts.index, opts.name] : [parentFieldName, opts.name]).filter(d => d !== undefined).join('.');
+    const api = new formCore.FieldApi({
+      ...opts,
+      form: formApi,
+      name: name
+    });
+    api.Field = Field;
+    return api;
+  });
+
+  // Keep options up to date as they are rendered
+  fieldApi.update({
+    ...opts,
+    form: formApi
+  });
+  reactStore.useStore(fieldApi.store, opts.mode === 'array' ? state => {
+    return [state.meta, Object.keys(state.value || []).length];
+  } : undefined);
+
+  // Instantiates field meta and removes it when unrendered
+  React__namespace.useEffect(() => fieldApi.mount(), [fieldApi]);
+  return fieldApi;
+}
+
+// export type FieldValue<TFormData, TField> = TFormData extends any[]
+//   ? TField extends `[${infer TIndex extends number | 'i'}].${infer TRest}`
+//     ? DeepValue<TFormData[TIndex extends 'i' ? number : TIndex], TRest>
+//     : TField extends `[${infer TIndex extends number | 'i'}]`
+//     ? TFormData[TIndex extends 'i' ? number : TIndex]
+//     : never
+//   : TField extends `${infer TPrefix}[${infer TIndex extends
+//       | number
+//       | 'i'}].${infer TRest}`
+//   ? DeepValue<
+//       DeepValue<TFormData, TPrefix>[TIndex extends 'i' ? number : TIndex],
+//       TRest
+//     >
+//   : TField extends `${infer TPrefix}[${infer TIndex extends number | 'i'}]`
+//   ? DeepValue<TFormData, TPrefix>[TIndex extends 'i' ? number : TIndex]
+//   : DeepValue<TFormData, TField>
+// type Test1 = FieldValue<{ foo: { bar: string }[] }, 'foo'>
+// //   ^?
+// type Test2 = FieldValue<{ foo: { bar: string }[] }, 'foo[i]'>
+// //   ^?
+// type Test3 = FieldValue<{ foo: { bar: string }[] }, 'foo[2].bar'>
+// //   ^?
+function Field({
+  children,
+  ...fieldOptions
+}) {
+  const fieldApi = useField(fieldOptions);
+  return /*#__PURE__*/React__namespace.createElement(formContext.formContext.Provider, {
+    value: {
+      formApi: fieldApi.form,
+      parentFieldName: fieldApi.name
+    },
+    children: formCore.functionalUpdate(children, fieldApi)
+  });
+}
+
+exports.Field = Field;
+exports.useField = useField;
+//# sourceMappingURL=useField.legacy.cjs.map

package/build/lib/useField.legacy.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useField.legacy.cjs","sources":["../../src/useField.tsx"],"sourcesContent":["import * as React from 'react'\n//\nimport { useStore } from '@tanstack/react-store'\nimport type {\n  DeepKeys,\n  DeepValue,\n  FieldOptions,\n  Narrow,\n} from '@tanstack/form-core'\nimport { FieldApi, functionalUpdate } from '@tanstack/form-core'\nimport { useFormContext, formContext } from './formContext'\n\ndeclare module '@tanstack/form-core' {\n  // eslint-disable-next-line no-shadow\n  interface FieldApi<TData, TFormData> {\n    Field: FieldComponent<TData, TFormData>\n  }\n}\n\nexport type UseFieldOptions<TData, TFormData> = FieldOptions<\n  TData,\n  TFormData\n> & {\n  mode?: 'value' | 'array'\n}\n\nexport type UseField<TFormData> = <TField extends DeepKeys<TFormData>>(\n  opts?: { name: Narrow<TField> } & UseFieldOptions<\n    DeepValue<TFormData, TField>,\n    TFormData\n  >,\n) => FieldApi<DeepValue<TFormData, TField>, TFormData>\n\nexport function useField<TData, TFormData>(\n  opts: UseFieldOptions<TData, TFormData>,\n): FieldApi<TData, TFormData> {\n  // Get the form API either manually or from context\n  const { formApi, parentFieldName } = useFormContext()\n\n  const [fieldApi] = React.useState<FieldApi<TData, TFormData>>(() => {\n    const name = (\n      typeof opts.index === 'number'\n        ? [parentFieldName, opts.index, opts.name]\n        : [parentFieldName, opts.name]\n    )\n      .filter((d) => d !== undefined)\n      .join('.')\n\n    const api = new FieldApi({ ...opts, form: formApi, name: name as any })\n\n    api.Field = Field as any\n\n    return api\n  })\n\n  // Keep options up to date as they are rendered\n  fieldApi.update({ ...opts, form: formApi } as never)\n\n  useStore(\n    fieldApi.store as any,\n    opts.mode === 'array'\n      ? (state: any) => {\n          return [state.meta, Object.keys(state.value || []).length]\n        }\n      : undefined,\n  )\n\n  // Instantiates field meta and removes it when unrendered\n  React.useEffect(() => fieldApi.mount(), [fieldApi])\n\n  return fieldApi\n}\n\n// export type FieldValue<TFormData, TField> = TFormData extends any[]\n//   ? TField extends `[${infer TIndex extends number | 'i'}].${infer TRest}`\n//     ? DeepValue<TFormData[TIndex extends 'i' ? number : TIndex], TRest>\n//     : TField extends `[${infer TIndex extends number | 'i'}]`\n//     ? TFormData[TIndex extends 'i' ? number : TIndex]\n//     : never\n//   : TField extends `${infer TPrefix}[${infer TIndex extends\n//       | number\n//       | 'i'}].${infer TRest}`\n//   ? DeepValue<\n//       DeepValue<TFormData, TPrefix>[TIndex extends 'i' ? number : TIndex],\n//       TRest\n//     >\n//   : TField extends `${infer TPrefix}[${infer TIndex extends number | 'i'}]`\n//   ? DeepValue<TFormData, TPrefix>[TIndex extends 'i' ? number : TIndex]\n//   : DeepValue<TFormData, TField>\n\nexport type FieldValue<TFormData, TField> = TFormData extends any[]\n  ? unknown extends TField\n    ? TFormData[number]\n    : DeepValue<TFormData[number], TField>\n  : DeepValue<TFormData, TField>\n\n// type Test1 = FieldValue<{ foo: { bar: string }[] }, 'foo'>\n// //   ^?\n// type Test2 = FieldValue<{ foo: { bar: string }[] }, 'foo[i]'>\n// //   ^?\n// type Test3 = FieldValue<{ foo: { bar: string }[] }, 'foo[2].bar'>\n// //   ^?\n\nexport type FieldComponent<TParentData, TFormData> = <TField>({\n  children,\n  ...fieldOptions\n}: {\n  children: (\n    fieldApi: FieldApi<FieldValue<TParentData, TField>, TFormData>,\n  ) => any\n} & Omit<\n  UseFieldOptions<FieldValue<TParentData, TField>, TFormData>,\n  'name' | 'index'\n> &\n  (TParentData extends any[]\n    ? {\n        name?: TField extends undefined ? TField : DeepKeys<TParentData>\n        index: number\n      }\n    : {\n        name: TField extends undefined ? TField : DeepKeys<TParentData>\n        index?: never\n      })) => any\n\nexport function Field<TData, TFormData>({\n  children,\n  ...fieldOptions\n}: {\n  children: (fieldApi: FieldApi<TData, TFormData>) => any\n} & UseFieldOptions<TData, TFormData>) {\n  const fieldApi = useField(fieldOptions as any)\n\n  return (\n    <formContext.Provider\n      value={{ formApi: fieldApi.form, parentFieldName: fieldApi.name }}\n      children={functionalUpdate(children, fieldApi as any)}\n    />\n  )\n}\n"],"names":["useField","opts","formApi","parentFieldName","useFormContext","fieldApi","React","useState","name","index","filter","d","undefined","join","api","FieldApi","form","Field","update","useStore","store","mode","state","meta","Object","keys","value","length","useEffect","mount","children","fieldOptions","createElement","formContext","Provider","functionalUpdate"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAiCO,SAASA,QAAQA,CACtBC,IAAuC,EACX;AAC5B;EACA,MAAM;IAAEC,OAAO;AAAEC,IAAAA,eAAAA;GAAiB,GAAGC,0BAAc,EAAE,CAAA;EAErD,MAAM,CAACC,QAAQ,CAAC,GAAGC,gBAAK,CAACC,QAAQ,CAA6B,MAAM;AAClE,IAAA,MAAMC,IAAI,GAAG,CACX,OAAOP,IAAI,CAACQ,KAAK,KAAK,QAAQ,GAC1B,CAACN,eAAe,EAAEF,IAAI,CAACQ,KAAK,EAAER,IAAI,CAACO,IAAI,CAAC,GACxC,CAACL,eAAe,EAAEF,IAAI,CAACO,IAAI,CAAC,EAE/BE,MAAM,CAAEC,CAAC,IAAKA,CAAC,KAAKC,SAAS,CAAC,CAC9BC,IAAI,CAAC,GAAG,CAAC,CAAA;AAEZ,IAAA,MAAMC,GAAG,GAAG,IAAIC,iBAAQ,CAAC;AAAE,MAAA,GAAGd,IAAI;AAAEe,MAAAA,IAAI,EAAEd,OAAO;AAAEM,MAAAA,IAAI,EAAEA,IAAAA;AAAY,KAAC,CAAC,CAAA;IAEvEM,GAAG,CAACG,KAAK,GAAGA,KAAY,CAAA;AAExB,IAAA,OAAOH,GAAG,CAAA;AACZ,GAAC,CAAC,CAAA;;AAEF;EACAT,QAAQ,CAACa,MAAM,CAAC;AAAE,IAAA,GAAGjB,IAAI;AAAEe,IAAAA,IAAI,EAAEd,OAAAA;AAAQ,GAAU,CAAC,CAAA;AAEpDiB,EAAAA,mBAAQ,CACNd,QAAQ,CAACe,KAAK,EACdnB,IAAI,CAACoB,IAAI,KAAK,OAAO,GAChBC,KAAU,IAAK;AACd,IAAA,OAAO,CAACA,KAAK,CAACC,IAAI,EAAEC,MAAM,CAACC,IAAI,CAACH,KAAK,CAACI,KAAK,IAAI,EAAE,CAAC,CAACC,MAAM,CAAC,CAAA;GAC3D,GACDf,SACN,CAAC,CAAA;;AAED;AACAN,EAAAA,gBAAK,CAACsB,SAAS,CAAC,MAAMvB,QAAQ,CAACwB,KAAK,EAAE,EAAE,CAACxB,QAAQ,CAAC,CAAC,CAAA;AAEnD,EAAA,OAAOA,QAAQ,CAAA;AACjB,CAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AACA;AACA;AACA;AACA;AAuBO,SAASY,KAAKA,CAAmB;EACtCa,QAAQ;EACR,GAAGC,YAAAA;AAG+B,CAAC,EAAE;AACrC,EAAA,MAAM1B,QAAQ,GAAGL,QAAQ,CAAC+B,YAAmB,CAAC,CAAA;AAE9C,EAAA,oBACEzB,gBAAA,CAAA0B,aAAA,CAACC,uBAAW,CAACC,QAAQ,EAAA;AACnBR,IAAAA,KAAK,EAAE;MAAExB,OAAO,EAAEG,QAAQ,CAACW,IAAI;MAAEb,eAAe,EAAEE,QAAQ,CAACG,IAAAA;KAAO;AAClEsB,IAAAA,QAAQ,EAAEK,yBAAgB,CAACL,QAAQ,EAAEzB,QAAe,CAAA;AAAE,GACvD,CAAC,CAAA;AAEN;;;;;"}

package/build/lib/useField.legacy.js

@@ -0,0 +1,74 @@
+import * as React from 'react';
+import { useStore } from '@tanstack/react-store';
+import { FieldApi, functionalUpdate } from '@tanstack/form-core';
+import { useFormContext, formContext } from './formContext.legacy.js';
+
+function useField(opts) {
+  // Get the form API either manually or from context
+  const {
+    formApi,
+    parentFieldName
+  } = useFormContext();
+  const [fieldApi] = React.useState(() => {
+    const name = (typeof opts.index === 'number' ? [parentFieldName, opts.index, opts.name] : [parentFieldName, opts.name]).filter(d => d !== undefined).join('.');
+    const api = new FieldApi({
+      ...opts,
+      form: formApi,
+      name: name
+    });
+    api.Field = Field;
+    return api;
+  });
+
+  // Keep options up to date as they are rendered
+  fieldApi.update({
+    ...opts,
+    form: formApi
+  });
+  useStore(fieldApi.store, opts.mode === 'array' ? state => {
+    return [state.meta, Object.keys(state.value || []).length];
+  } : undefined);
+
+  // Instantiates field meta and removes it when unrendered
+  React.useEffect(() => fieldApi.mount(), [fieldApi]);
+  return fieldApi;
+}
+
+// export type FieldValue<TFormData, TField> = TFormData extends any[]
+//   ? TField extends `[${infer TIndex extends number | 'i'}].${infer TRest}`
+//     ? DeepValue<TFormData[TIndex extends 'i' ? number : TIndex], TRest>
+//     : TField extends `[${infer TIndex extends number | 'i'}]`
+//     ? TFormData[TIndex extends 'i' ? number : TIndex]
+//     : never
+//   : TField extends `${infer TPrefix}[${infer TIndex extends
+//       | number
+//       | 'i'}].${infer TRest}`
+//   ? DeepValue<
+//       DeepValue<TFormData, TPrefix>[TIndex extends 'i' ? number : TIndex],
+//       TRest
+//     >
+//   : TField extends `${infer TPrefix}[${infer TIndex extends number | 'i'}]`
+//   ? DeepValue<TFormData, TPrefix>[TIndex extends 'i' ? number : TIndex]
+//   : DeepValue<TFormData, TField>
+// type Test1 = FieldValue<{ foo: { bar: string }[] }, 'foo'>
+// //   ^?
+// type Test2 = FieldValue<{ foo: { bar: string }[] }, 'foo[i]'>
+// //   ^?
+// type Test3 = FieldValue<{ foo: { bar: string }[] }, 'foo[2].bar'>
+// //   ^?
+function Field({
+  children,
+  ...fieldOptions
+}) {
+  const fieldApi = useField(fieldOptions);
+  return /*#__PURE__*/React.createElement(formContext.Provider, {
+    value: {
+      formApi: fieldApi.form,
+      parentFieldName: fieldApi.name
+    },
+    children: functionalUpdate(children, fieldApi)
+  });
+}
+
+export { Field, useField };
+//# sourceMappingURL=useField.legacy.js.map

package/build/lib/useField.legacy.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useField.legacy.js","sources":["../../src/useField.tsx"],"sourcesContent":["import * as React from 'react'\n//\nimport { useStore } from '@tanstack/react-store'\nimport type {\n  DeepKeys,\n  DeepValue,\n  FieldOptions,\n  Narrow,\n} from '@tanstack/form-core'\nimport { FieldApi, functionalUpdate } from '@tanstack/form-core'\nimport { useFormContext, formContext } from './formContext'\n\ndeclare module '@tanstack/form-core' {\n  // eslint-disable-next-line no-shadow\n  interface FieldApi<TData, TFormData> {\n    Field: FieldComponent<TData, TFormData>\n  }\n}\n\nexport type UseFieldOptions<TData, TFormData> = FieldOptions<\n  TData,\n  TFormData\n> & {\n  mode?: 'value' | 'array'\n}\n\nexport type UseField<TFormData> = <TField extends DeepKeys<TFormData>>(\n  opts?: { name: Narrow<TField> } & UseFieldOptions<\n    DeepValue<TFormData, TField>,\n    TFormData\n  >,\n) => FieldApi<DeepValue<TFormData, TField>, TFormData>\n\nexport function useField<TData, TFormData>(\n  opts: UseFieldOptions<TData, TFormData>,\n): FieldApi<TData, TFormData> {\n  // Get the form API either manually or from context\n  const { formApi, parentFieldName } = useFormContext()\n\n  const [fieldApi] = React.useState<FieldApi<TData, TFormData>>(() => {\n    const name = (\n      typeof opts.index === 'number'\n        ? [parentFieldName, opts.index, opts.name]\n        : [parentFieldName, opts.name]\n    )\n      .filter((d) => d !== undefined)\n      .join('.')\n\n    const api = new FieldApi({ ...opts, form: formApi, name: name as any })\n\n    api.Field = Field as any\n\n    return api\n  })\n\n  // Keep options up to date as they are rendered\n  fieldApi.update({ ...opts, form: formApi } as never)\n\n  useStore(\n    fieldApi.store as any,\n    opts.mode === 'array'\n      ? (state: any) => {\n          return [state.meta, Object.keys(state.value || []).length]\n        }\n      : undefined,\n  )\n\n  // Instantiates field meta and removes it when unrendered\n  React.useEffect(() => fieldApi.mount(), [fieldApi])\n\n  return fieldApi\n}\n\n// export type FieldValue<TFormData, TField> = TFormData extends any[]\n//   ? TField extends `[${infer TIndex extends number | 'i'}].${infer TRest}`\n//     ? DeepValue<TFormData[TIndex extends 'i' ? number : TIndex], TRest>\n//     : TField extends `[${infer TIndex extends number | 'i'}]`\n//     ? TFormData[TIndex extends 'i' ? number : TIndex]\n//     : never\n//   : TField extends `${infer TPrefix}[${infer TIndex extends\n//       | number\n//       | 'i'}].${infer TRest}`\n//   ? DeepValue<\n//       DeepValue<TFormData, TPrefix>[TIndex extends 'i' ? number : TIndex],\n//       TRest\n//     >\n//   : TField extends `${infer TPrefix}[${infer TIndex extends number | 'i'}]`\n//   ? DeepValue<TFormData, TPrefix>[TIndex extends 'i' ? number : TIndex]\n//   : DeepValue<TFormData, TField>\n\nexport type FieldValue<TFormData, TField> = TFormData extends any[]\n  ? unknown extends TField\n    ? TFormData[number]\n    : DeepValue<TFormData[number], TField>\n  : DeepValue<TFormData, TField>\n\n// type Test1 = FieldValue<{ foo: { bar: string }[] }, 'foo'>\n// //   ^?\n// type Test2 = FieldValue<{ foo: { bar: string }[] }, 'foo[i]'>\n// //   ^?\n// type Test3 = FieldValue<{ foo: { bar: string }[] }, 'foo[2].bar'>\n// //   ^?\n\nexport type FieldComponent<TParentData, TFormData> = <TField>({\n  children,\n  ...fieldOptions\n}: {\n  children: (\n    fieldApi: FieldApi<FieldValue<TParentData, TField>, TFormData>,\n  ) => any\n} & Omit<\n  UseFieldOptions<FieldValue<TParentData, TField>, TFormData>,\n  'name' | 'index'\n> &\n  (TParentData extends any[]\n    ? {\n        name?: TField extends undefined ? TField : DeepKeys<TParentData>\n        index: number\n      }\n    : {\n        name: TField extends undefined ? TField : DeepKeys<TParentData>\n        index?: never\n      })) => any\n\nexport function Field<TData, TFormData>({\n  children,\n  ...fieldOptions\n}: {\n  children: (fieldApi: FieldApi<TData, TFormData>) => any\n} & UseFieldOptions<TData, TFormData>) {\n  const fieldApi = useField(fieldOptions as any)\n\n  return (\n    <formContext.Provider\n      value={{ formApi: fieldApi.form, parentFieldName: fieldApi.name }}\n      children={functionalUpdate(children, fieldApi as any)}\n    />\n  )\n}\n"],"names":["useField","opts","formApi","parentFieldName","useFormContext","fieldApi","React","useState","name","index","filter","d","undefined","join","api","FieldApi","form","Field","update","useStore","store","mode","state","meta","Object","keys","value","length","useEffect","mount","children","fieldOptions","createElement","formContext","Provider","functionalUpdate"],"mappings":";;;;;AAiCO,SAASA,QAAQA,CACtBC,IAAuC,EACX;AAC5B;EACA,MAAM;IAAEC,OAAO;AAAEC,IAAAA,eAAAA;GAAiB,GAAGC,cAAc,EAAE,CAAA;EAErD,MAAM,CAACC,QAAQ,CAAC,GAAGC,KAAK,CAACC,QAAQ,CAA6B,MAAM;AAClE,IAAA,MAAMC,IAAI,GAAG,CACX,OAAOP,IAAI,CAACQ,KAAK,KAAK,QAAQ,GAC1B,CAACN,eAAe,EAAEF,IAAI,CAACQ,KAAK,EAAER,IAAI,CAACO,IAAI,CAAC,GACxC,CAACL,eAAe,EAAEF,IAAI,CAACO,IAAI,CAAC,EAE/BE,MAAM,CAAEC,CAAC,IAAKA,CAAC,KAAKC,SAAS,CAAC,CAC9BC,IAAI,CAAC,GAAG,CAAC,CAAA;AAEZ,IAAA,MAAMC,GAAG,GAAG,IAAIC,QAAQ,CAAC;AAAE,MAAA,GAAGd,IAAI;AAAEe,MAAAA,IAAI,EAAEd,OAAO;AAAEM,MAAAA,IAAI,EAAEA,IAAAA;AAAY,KAAC,CAAC,CAAA;IAEvEM,GAAG,CAACG,KAAK,GAAGA,KAAY,CAAA;AAExB,IAAA,OAAOH,GAAG,CAAA;AACZ,GAAC,CAAC,CAAA;;AAEF;EACAT,QAAQ,CAACa,MAAM,CAAC;AAAE,IAAA,GAAGjB,IAAI;AAAEe,IAAAA,IAAI,EAAEd,OAAAA;AAAQ,GAAU,CAAC,CAAA;AAEpDiB,EAAAA,QAAQ,CACNd,QAAQ,CAACe,KAAK,EACdnB,IAAI,CAACoB,IAAI,KAAK,OAAO,GAChBC,KAAU,IAAK;AACd,IAAA,OAAO,CAACA,KAAK,CAACC,IAAI,EAAEC,MAAM,CAACC,IAAI,CAACH,KAAK,CAACI,KAAK,IAAI,EAAE,CAAC,CAACC,MAAM,CAAC,CAAA;GAC3D,GACDf,SACN,CAAC,CAAA;;AAED;AACAN,EAAAA,KAAK,CAACsB,SAAS,CAAC,MAAMvB,QAAQ,CAACwB,KAAK,EAAE,EAAE,CAACxB,QAAQ,CAAC,CAAC,CAAA;AAEnD,EAAA,OAAOA,QAAQ,CAAA;AACjB,CAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAQA;AACA;AACA;AACA;AACA;AACA;AAuBO,SAASY,KAAKA,CAAmB;EACtCa,QAAQ;EACR,GAAGC,YAAAA;AAG+B,CAAC,EAAE;AACrC,EAAA,MAAM1B,QAAQ,GAAGL,QAAQ,CAAC+B,YAAmB,CAAC,CAAA;AAE9C,EAAA,oBACEzB,KAAA,CAAA0B,aAAA,CAACC,WAAW,CAACC,QAAQ,EAAA;AACnBR,IAAAA,KAAK,EAAE;MAAExB,OAAO,EAAEG,QAAQ,CAACW,IAAI;MAAEb,eAAe,EAAEE,QAAQ,CAACG,IAAAA;KAAO;AAClEsB,IAAAA,QAAQ,EAAEK,gBAAgB,CAACL,QAAQ,EAAEzB,QAAe,CAAA;AAAE,GACvD,CAAC,CAAA;AAEN;;;;"}

package/build/lib/useForm.cjs

@@ -0,0 +1,50 @@
+'use strict';
+
+var _rollupPluginBabelHelpers = require('./_virtual/_rollupPluginBabelHelpers.cjs');
+var formCore = require('@tanstack/form-core');
+var reactStore = require('@tanstack/react-store');
+var React = require('react');
+var useField = require('./useField.cjs');
+var formContext = require('./formContext.cjs');
+
+function useForm(opts) {
+  const [formApi] = React.useState(() => {
+    // @ts-ignore
+    const api = new formCore.FormApi(opts);
+
+    // eslint-disable-next-line react/display-name
+    api.Provider = props => /*#__PURE__*/React.createElement(formContext.formContext.Provider, _rollupPluginBabelHelpers.extends({}, props, {
+      value: {
+        formApi: api
+      }
+    }));
+    api.getFormProps = () => {
+      return {
+        onSubmit: formApi.handleSubmit,
+        disabled: api.state.isSubmitting
+      };
+    };
+    api.Field = useField.Field;
+    api.useField = useField.useField;
+    api.useStore = (
+    // @ts-ignore
+    selector) => {
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      return reactStore.useStore(api.store, selector);
+    };
+    api.Subscribe = (
+    // @ts-ignore
+    props) => {
+      return formCore.functionalUpdate(props.children,
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      reactStore.useStore(api.store, props.selector));
+    };
+    return api;
+  });
+  formApi.useStore(state => state.isSubmitting);
+  formApi.update(opts);
+  return formApi;
+}
+
+exports.useForm = useForm;
+//# sourceMappingURL=useForm.cjs.map

package/build/lib/useForm.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useForm.cjs","sources":["../../src/useForm.tsx"],"sourcesContent":["import type { FormState, FormOptions } from '@tanstack/form-core'\nimport { FormApi, functionalUpdate } from '@tanstack/form-core'\nimport type { NoInfer } from '@tanstack/react-store'\nimport { useStore } from '@tanstack/react-store'\nimport React from 'react'\nimport { type UseField, type FieldComponent, Field, useField } from './useField'\nimport { formContext } from './formContext'\n\nexport type FormSubmitEvent = React.FormEvent<HTMLFormElement>\n\ndeclare module '@tanstack/form-core' {\n  interface Register {\n    FormSubmitEvent: FormSubmitEvent\n  }\n\n  // eslint-disable-next-line no-shadow\n  interface FormApi<TFormData> {\n    Provider: (props: { children: any }) => any\n    getFormProps: () => FormProps\n    Field: FieldComponent<TFormData, TFormData>\n    useField: UseField<TFormData>\n    useStore: <TSelected = NoInfer<FormState<TFormData>>>(\n      selector?: (state: NoInfer<FormState<TFormData>>) => TSelected,\n    ) => TSelected\n    Subscribe: <TSelected = NoInfer<FormState<TFormData>>>(props: {\n      selector?: (state: NoInfer<FormState<TFormData>>) => TSelected\n      children:\n        | ((state: NoInfer<TSelected>) => React.ReactNode)\n        | React.ReactNode\n    }) => any\n  }\n}\n\nexport type FormProps = {\n  onSubmit: (e: FormSubmitEvent) => void\n  disabled: boolean\n}\n\nexport function useForm<TData>(opts?: FormOptions<TData>): FormApi<TData> {\n  const [formApi] = React.useState(() => {\n    // @ts-ignore\n    const api = new FormApi<TData>(opts)\n\n    // eslint-disable-next-line react/display-name\n    api.Provider = (props) => (\n      <formContext.Provider {...props} value={{ formApi: api }} />\n    )\n    api.getFormProps = () => {\n      return {\n        onSubmit: formApi.handleSubmit,\n        disabled: api.state.isSubmitting,\n      }\n    }\n    api.Field = Field as any\n    api.useField = useField as any\n    api.useStore = (\n      // @ts-ignore\n      selector,\n    ) => {\n      // eslint-disable-next-line react-hooks/rules-of-hooks\n      return useStore(api.store as any, selector as any) as any\n    }\n    api.Subscribe = (\n      // @ts-ignore\n      props,\n    ) => {\n      return functionalUpdate(\n        props.children,\n        // eslint-disable-next-line react-hooks/rules-of-hooks\n        useStore(api.store as any, props.selector as any),\n      ) as any\n    }\n\n    return api\n  })\n\n  formApi.useStore((state) => state.isSubmitting)\n  formApi.update(opts)\n\n  return formApi as any\n}\n"],"names":["useForm","opts","formApi","React","useState","api","FormApi","Provider","props","createElement","formContext","_extends","value","getFormProps","onSubmit","handleSubmit","disabled","state","isSubmitting","Field","useField","useStore","selector","store","Subscribe","functionalUpdate","children","update"],"mappings":";;;;;;;;;AAsCO,SAASA,OAAOA,CAAQC,IAAyB,EAAkB;EACxE,MAAM,CAACC,OAAO,CAAC,GAAGC,KAAK,CAACC,QAAQ,CAAC,MAAM;AACrC;AACA,IAAA,MAAMC,GAAG,GAAG,IAAIC,gBAAO,CAAQL,IAAI,CAAC,CAAA;;AAEpC;AACAI,IAAAA,GAAG,CAACE,QAAQ,GAAIC,KAAK,iBACnBL,KAAA,CAAAM,aAAA,CAACC,uBAAW,CAACH,QAAQ,EAAAI,iCAAA,KAAKH,KAAK,EAAA;AAAEI,MAAAA,KAAK,EAAE;AAAEV,QAAAA,OAAO,EAAEG,GAAAA;AAAI,OAAA;AAAE,KAAA,CAAE,CAC5D,CAAA;IACDA,GAAG,CAACQ,YAAY,GAAG,MAAM;MACvB,OAAO;QACLC,QAAQ,EAAEZ,OAAO,CAACa,YAAY;AAC9BC,QAAAA,QAAQ,EAAEX,GAAG,CAACY,KAAK,CAACC,YAAAA;OACrB,CAAA;KACF,CAAA;IACDb,GAAG,CAACc,KAAK,GAAGA,cAAY,CAAA;IACxBd,GAAG,CAACe,QAAQ,GAAGA,iBAAe,CAAA;IAC9Bf,GAAG,CAACgB,QAAQ,GAAG;AACb;AACAC,IAAAA,QAAQ,KACL;AACH;AACA,MAAA,OAAOD,mBAAQ,CAAChB,GAAG,CAACkB,KAAK,EAASD,QAAe,CAAC,CAAA;KACnD,CAAA;IACDjB,GAAG,CAACmB,SAAS,GAAG;AACd;AACAhB,IAAAA,KAAK,KACF;AACH,MAAA,OAAOiB,yBAAgB,CACrBjB,KAAK,CAACkB,QAAQ;AACd;MACAL,mBAAQ,CAAChB,GAAG,CAACkB,KAAK,EAASf,KAAK,CAACc,QAAe,CAClD,CAAC,CAAA;KACF,CAAA;AAED,IAAA,OAAOjB,GAAG,CAAA;AACZ,GAAC,CAAC,CAAA;EAEFH,OAAO,CAACmB,QAAQ,CAAEJ,KAAK,IAAKA,KAAK,CAACC,YAAY,CAAC,CAAA;AAC/ChB,EAAAA,OAAO,CAACyB,MAAM,CAAC1B,IAAI,CAAC,CAAA;AAEpB,EAAA,OAAOC,OAAO,CAAA;AAChB;;;;"}

package/build/{types/react-form/src → lib}/useForm.d.ts

@@ -27,3 +27,4 @@ export type FormProps = {
     disabled: boolean;
 };
 export declare function useForm<TData>(opts?: FormOptions<TData>): FormApi<TData>;
+//# sourceMappingURL=useForm.d.ts.map

package/build/lib/useForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useForm.d.ts","sourceRoot":"","sources":["../../src/useForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AACjE,OAAO,EAAE,OAAO,EAAoB,MAAM,qBAAqB,CAAA;AAC/D,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAEpD,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,cAAc,EAAmB,MAAM,YAAY,CAAA;AAGhF,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,CAAA;AAE9D,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,QAAQ;QAChB,eAAe,EAAE,eAAe,CAAA;KACjC;IAGD,UAAU,OAAO,CAAC,SAAS;QACzB,QAAQ,EAAE,CAAC,KAAK,EAAE;YAAE,QAAQ,EAAE,GAAG,CAAA;SAAE,KAAK,GAAG,CAAA;QAC3C,YAAY,EAAE,MAAM,SAAS,CAAA;QAC7B,KAAK,EAAE,cAAc,CAAC,SAAS,EAAE,SAAS,CAAC,CAAA;QAC3C,QAAQ,EAAE,QAAQ,CAAC,SAAS,CAAC,CAAA;QAC7B,QAAQ,EAAE,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,EAClD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,KAAK,SAAS,KAC3D,SAAS,CAAA;QACd,SAAS,EAAE,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE;YAC5D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,KAAK,SAAS,CAAA;YAC9D,QAAQ,EACJ,CAAC,CAAC,KAAK,EAAE,OAAO,CAAC,SAAS,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GAChD,KAAK,CAAC,SAAS,CAAA;SACpB,KAAK,GAAG,CAAA;KACV;CACF;AAED,MAAM,MAAM,SAAS,GAAG;IACtB,QAAQ,EAAE,CAAC,CAAC,EAAE,eAAe,KAAK,IAAI,CAAA;IACtC,QAAQ,EAAE,OAAO,CAAA;CAClB,CAAA;AAED,wBAAgB,OAAO,CAAC,KAAK,EAAE,IAAI,CAAC,EAAE,WAAW,CAAC,KAAK,CAAC,GAAG,OAAO,CAAC,KAAK,CAAC,CA0CxE"}

package/build/lib/useForm.js

@@ -0,0 +1,48 @@
+import { extends as _extends } from './_virtual/_rollupPluginBabelHelpers.js';
+import { FormApi, functionalUpdate } from '@tanstack/form-core';
+import { useStore } from '@tanstack/react-store';
+import React__default from 'react';
+import { Field, useField } from './useField.js';
+import { formContext } from './formContext.js';
+
+function useForm(opts) {
+  const [formApi] = React__default.useState(() => {
+    // @ts-ignore
+    const api = new FormApi(opts);
+
+    // eslint-disable-next-line react/display-name
+    api.Provider = props => /*#__PURE__*/React__default.createElement(formContext.Provider, _extends({}, props, {
+      value: {
+        formApi: api
+      }
+    }));
+    api.getFormProps = () => {
+      return {
+        onSubmit: formApi.handleSubmit,
+        disabled: api.state.isSubmitting
+      };
+    };
+    api.Field = Field;
+    api.useField = useField;
+    api.useStore = (
+    // @ts-ignore
+    selector) => {
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      return useStore(api.store, selector);
+    };
+    api.Subscribe = (
+    // @ts-ignore
+    props) => {
+      return functionalUpdate(props.children,
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      useStore(api.store, props.selector));
+    };
+    return api;
+  });
+  formApi.useStore(state => state.isSubmitting);
+  formApi.update(opts);
+  return formApi;
+}
+
+export { useForm };
+//# sourceMappingURL=useForm.js.map

package/build/lib/useForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useForm.js","sources":["../../src/useForm.tsx"],"sourcesContent":["import type { FormState, FormOptions } from '@tanstack/form-core'\nimport { FormApi, functionalUpdate } from '@tanstack/form-core'\nimport type { NoInfer } from '@tanstack/react-store'\nimport { useStore } from '@tanstack/react-store'\nimport React from 'react'\nimport { type UseField, type FieldComponent, Field, useField } from './useField'\nimport { formContext } from './formContext'\n\nexport type FormSubmitEvent = React.FormEvent<HTMLFormElement>\n\ndeclare module '@tanstack/form-core' {\n  interface Register {\n    FormSubmitEvent: FormSubmitEvent\n  }\n\n  // eslint-disable-next-line no-shadow\n  interface FormApi<TFormData> {\n    Provider: (props: { children: any }) => any\n    getFormProps: () => FormProps\n    Field: FieldComponent<TFormData, TFormData>\n    useField: UseField<TFormData>\n    useStore: <TSelected = NoInfer<FormState<TFormData>>>(\n      selector?: (state: NoInfer<FormState<TFormData>>) => TSelected,\n    ) => TSelected\n    Subscribe: <TSelected = NoInfer<FormState<TFormData>>>(props: {\n      selector?: (state: NoInfer<FormState<TFormData>>) => TSelected\n      children:\n        | ((state: NoInfer<TSelected>) => React.ReactNode)\n        | React.ReactNode\n    }) => any\n  }\n}\n\nexport type FormProps = {\n  onSubmit: (e: FormSubmitEvent) => void\n  disabled: boolean\n}\n\nexport function useForm<TData>(opts?: FormOptions<TData>): FormApi<TData> {\n  const [formApi] = React.useState(() => {\n    // @ts-ignore\n    const api = new FormApi<TData>(opts)\n\n    // eslint-disable-next-line react/display-name\n    api.Provider = (props) => (\n      <formContext.Provider {...props} value={{ formApi: api }} />\n    )\n    api.getFormProps = () => {\n      return {\n        onSubmit: formApi.handleSubmit,\n        disabled: api.state.isSubmitting,\n      }\n    }\n    api.Field = Field as any\n    api.useField = useField as any\n    api.useStore = (\n      // @ts-ignore\n      selector,\n    ) => {\n      // eslint-disable-next-line react-hooks/rules-of-hooks\n      return useStore(api.store as any, selector as any) as any\n    }\n    api.Subscribe = (\n      // @ts-ignore\n      props,\n    ) => {\n      return functionalUpdate(\n        props.children,\n        // eslint-disable-next-line react-hooks/rules-of-hooks\n        useStore(api.store as any, props.selector as any),\n      ) as any\n    }\n\n    return api\n  })\n\n  formApi.useStore((state) => state.isSubmitting)\n  formApi.update(opts)\n\n  return formApi as any\n}\n"],"names":["useForm","opts","formApi","React","useState","api","FormApi","Provider","props","createElement","formContext","_extends","value","getFormProps","onSubmit","handleSubmit","disabled","state","isSubmitting","Field","useField","useStore","selector","store","Subscribe","functionalUpdate","children","update"],"mappings":";;;;;;;AAsCO,SAASA,OAAOA,CAAQC,IAAyB,EAAkB;EACxE,MAAM,CAACC,OAAO,CAAC,GAAGC,cAAK,CAACC,QAAQ,CAAC,MAAM;AACrC;AACA,IAAA,MAAMC,GAAG,GAAG,IAAIC,OAAO,CAAQL,IAAI,CAAC,CAAA;;AAEpC;AACAI,IAAAA,GAAG,CAACE,QAAQ,GAAIC,KAAK,iBACnBL,cAAA,CAAAM,aAAA,CAACC,WAAW,CAACH,QAAQ,EAAAI,QAAA,KAAKH,KAAK,EAAA;AAAEI,MAAAA,KAAK,EAAE;AAAEV,QAAAA,OAAO,EAAEG,GAAAA;AAAI,OAAA;AAAE,KAAA,CAAE,CAC5D,CAAA;IACDA,GAAG,CAACQ,YAAY,GAAG,MAAM;MACvB,OAAO;QACLC,QAAQ,EAAEZ,OAAO,CAACa,YAAY;AAC9BC,QAAAA,QAAQ,EAAEX,GAAG,CAACY,KAAK,CAACC,YAAAA;OACrB,CAAA;KACF,CAAA;IACDb,GAAG,CAACc,KAAK,GAAGA,KAAY,CAAA;IACxBd,GAAG,CAACe,QAAQ,GAAGA,QAAe,CAAA;IAC9Bf,GAAG,CAACgB,QAAQ,GAAG;AACb;AACAC,IAAAA,QAAQ,KACL;AACH;AACA,MAAA,OAAOD,QAAQ,CAAChB,GAAG,CAACkB,KAAK,EAASD,QAAe,CAAC,CAAA;KACnD,CAAA;IACDjB,GAAG,CAACmB,SAAS,GAAG;AACd;AACAhB,IAAAA,KAAK,KACF;AACH,MAAA,OAAOiB,gBAAgB,CACrBjB,KAAK,CAACkB,QAAQ;AACd;MACAL,QAAQ,CAAChB,GAAG,CAACkB,KAAK,EAASf,KAAK,CAACc,QAAe,CAClD,CAAC,CAAA;KACF,CAAA;AAED,IAAA,OAAOjB,GAAG,CAAA;AACZ,GAAC,CAAC,CAAA;EAEFH,OAAO,CAACmB,QAAQ,CAAEJ,KAAK,IAAKA,KAAK,CAACC,YAAY,CAAC,CAAA;AAC/ChB,EAAAA,OAAO,CAACyB,MAAM,CAAC1B,IAAI,CAAC,CAAA;AAEpB,EAAA,OAAOC,OAAO,CAAA;AAChB;;;;"}

package/build/lib/useForm.legacy.cjs

@@ -0,0 +1,50 @@
+'use strict';
+
+var _rollupPluginBabelHelpers = require('./_virtual/_rollupPluginBabelHelpers.legacy.cjs');
+var formCore = require('@tanstack/form-core');
+var reactStore = require('@tanstack/react-store');
+var React = require('react');
+var useField = require('./useField.legacy.cjs');
+var formContext = require('./formContext.legacy.cjs');
+
+function useForm(opts) {
+  const [formApi] = React.useState(() => {
+    // @ts-ignore
+    const api = new formCore.FormApi(opts);
+
+    // eslint-disable-next-line react/display-name
+    api.Provider = props => /*#__PURE__*/React.createElement(formContext.formContext.Provider, _rollupPluginBabelHelpers.extends({}, props, {
+      value: {
+        formApi: api
+      }
+    }));
+    api.getFormProps = () => {
+      return {
+        onSubmit: formApi.handleSubmit,
+        disabled: api.state.isSubmitting
+      };
+    };
+    api.Field = useField.Field;
+    api.useField = useField.useField;
+    api.useStore = (
+    // @ts-ignore
+    selector) => {
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      return reactStore.useStore(api.store, selector);
+    };
+    api.Subscribe = (
+    // @ts-ignore
+    props) => {
+      return formCore.functionalUpdate(props.children,
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      reactStore.useStore(api.store, props.selector));
+    };
+    return api;
+  });
+  formApi.useStore(state => state.isSubmitting);
+  formApi.update(opts);
+  return formApi;
+}
+
+exports.useForm = useForm;
+//# sourceMappingURL=useForm.legacy.cjs.map

package/build/lib/useForm.legacy.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useForm.legacy.cjs","sources":["../../src/useForm.tsx"],"sourcesContent":["import type { FormState, FormOptions } from '@tanstack/form-core'\nimport { FormApi, functionalUpdate } from '@tanstack/form-core'\nimport type { NoInfer } from '@tanstack/react-store'\nimport { useStore } from '@tanstack/react-store'\nimport React from 'react'\nimport { type UseField, type FieldComponent, Field, useField } from './useField'\nimport { formContext } from './formContext'\n\nexport type FormSubmitEvent = React.FormEvent<HTMLFormElement>\n\ndeclare module '@tanstack/form-core' {\n  interface Register {\n    FormSubmitEvent: FormSubmitEvent\n  }\n\n  // eslint-disable-next-line no-shadow\n  interface FormApi<TFormData> {\n    Provider: (props: { children: any }) => any\n    getFormProps: () => FormProps\n    Field: FieldComponent<TFormData, TFormData>\n    useField: UseField<TFormData>\n    useStore: <TSelected = NoInfer<FormState<TFormData>>>(\n      selector?: (state: NoInfer<FormState<TFormData>>) => TSelected,\n    ) => TSelected\n    Subscribe: <TSelected = NoInfer<FormState<TFormData>>>(props: {\n      selector?: (state: NoInfer<FormState<TFormData>>) => TSelected\n      children:\n        | ((state: NoInfer<TSelected>) => React.ReactNode)\n        | React.ReactNode\n    }) => any\n  }\n}\n\nexport type FormProps = {\n  onSubmit: (e: FormSubmitEvent) => void\n  disabled: boolean\n}\n\nexport function useForm<TData>(opts?: FormOptions<TData>): FormApi<TData> {\n  const [formApi] = React.useState(() => {\n    // @ts-ignore\n    const api = new FormApi<TData>(opts)\n\n    // eslint-disable-next-line react/display-name\n    api.Provider = (props) => (\n      <formContext.Provider {...props} value={{ formApi: api }} />\n    )\n    api.getFormProps = () => {\n      return {\n        onSubmit: formApi.handleSubmit,\n        disabled: api.state.isSubmitting,\n      }\n    }\n    api.Field = Field as any\n    api.useField = useField as any\n    api.useStore = (\n      // @ts-ignore\n      selector,\n    ) => {\n      // eslint-disable-next-line react-hooks/rules-of-hooks\n      return useStore(api.store as any, selector as any) as any\n    }\n    api.Subscribe = (\n      // @ts-ignore\n      props,\n    ) => {\n      return functionalUpdate(\n        props.children,\n        // eslint-disable-next-line react-hooks/rules-of-hooks\n        useStore(api.store as any, props.selector as any),\n      ) as any\n    }\n\n    return api\n  })\n\n  formApi.useStore((state) => state.isSubmitting)\n  formApi.update(opts)\n\n  return formApi as any\n}\n"],"names":["useForm","opts","formApi","React","useState","api","FormApi","Provider","props","createElement","formContext","_extends","value","getFormProps","onSubmit","handleSubmit","disabled","state","isSubmitting","Field","useField","useStore","selector","store","Subscribe","functionalUpdate","children","update"],"mappings":";;;;;;;;;AAsCO,SAASA,OAAOA,CAAQC,IAAyB,EAAkB;EACxE,MAAM,CAACC,OAAO,CAAC,GAAGC,KAAK,CAACC,QAAQ,CAAC,MAAM;AACrC;AACA,IAAA,MAAMC,GAAG,GAAG,IAAIC,gBAAO,CAAQL,IAAI,CAAC,CAAA;;AAEpC;AACAI,IAAAA,GAAG,CAACE,QAAQ,GAAIC,KAAK,iBACnBL,KAAA,CAAAM,aAAA,CAACC,uBAAW,CAACH,QAAQ,EAAAI,iCAAA,KAAKH,KAAK,EAAA;AAAEI,MAAAA,KAAK,EAAE;AAAEV,QAAAA,OAAO,EAAEG,GAAAA;AAAI,OAAA;AAAE,KAAA,CAAE,CAC5D,CAAA;IACDA,GAAG,CAACQ,YAAY,GAAG,MAAM;MACvB,OAAO;QACLC,QAAQ,EAAEZ,OAAO,CAACa,YAAY;AAC9BC,QAAAA,QAAQ,EAAEX,GAAG,CAACY,KAAK,CAACC,YAAAA;OACrB,CAAA;KACF,CAAA;IACDb,GAAG,CAACc,KAAK,GAAGA,cAAY,CAAA;IACxBd,GAAG,CAACe,QAAQ,GAAGA,iBAAe,CAAA;IAC9Bf,GAAG,CAACgB,QAAQ,GAAG;AACb;AACAC,IAAAA,QAAQ,KACL;AACH;AACA,MAAA,OAAOD,mBAAQ,CAAChB,GAAG,CAACkB,KAAK,EAASD,QAAe,CAAC,CAAA;KACnD,CAAA;IACDjB,GAAG,CAACmB,SAAS,GAAG;AACd;AACAhB,IAAAA,KAAK,KACF;AACH,MAAA,OAAOiB,yBAAgB,CACrBjB,KAAK,CAACkB,QAAQ;AACd;MACAL,mBAAQ,CAAChB,GAAG,CAACkB,KAAK,EAASf,KAAK,CAACc,QAAe,CAClD,CAAC,CAAA;KACF,CAAA;AAED,IAAA,OAAOjB,GAAG,CAAA;AACZ,GAAC,CAAC,CAAA;EAEFH,OAAO,CAACmB,QAAQ,CAAEJ,KAAK,IAAKA,KAAK,CAACC,YAAY,CAAC,CAAA;AAC/ChB,EAAAA,OAAO,CAACyB,MAAM,CAAC1B,IAAI,CAAC,CAAA;AAEpB,EAAA,OAAOC,OAAO,CAAA;AAChB;;;;"}

package/build/lib/useForm.legacy.js

@@ -0,0 +1,48 @@
+import { extends as _extends } from './_virtual/_rollupPluginBabelHelpers.legacy.js';
+import { FormApi, functionalUpdate } from '@tanstack/form-core';
+import { useStore } from '@tanstack/react-store';
+import React__default from 'react';
+import { Field, useField } from './useField.legacy.js';
+import { formContext } from './formContext.legacy.js';
+
+function useForm(opts) {
+  const [formApi] = React__default.useState(() => {
+    // @ts-ignore
+    const api = new FormApi(opts);
+
+    // eslint-disable-next-line react/display-name
+    api.Provider = props => /*#__PURE__*/React__default.createElement(formContext.Provider, _extends({}, props, {
+      value: {
+        formApi: api
+      }
+    }));
+    api.getFormProps = () => {
+      return {
+        onSubmit: formApi.handleSubmit,
+        disabled: api.state.isSubmitting
+      };
+    };
+    api.Field = Field;
+    api.useField = useField;
+    api.useStore = (
+    // @ts-ignore
+    selector) => {
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      return useStore(api.store, selector);
+    };
+    api.Subscribe = (
+    // @ts-ignore
+    props) => {
+      return functionalUpdate(props.children,
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      useStore(api.store, props.selector));
+    };
+    return api;
+  });
+  formApi.useStore(state => state.isSubmitting);
+  formApi.update(opts);
+  return formApi;
+}
+
+export { useForm };
+//# sourceMappingURL=useForm.legacy.js.map

package/build/lib/useForm.legacy.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useForm.legacy.js","sources":["../../src/useForm.tsx"],"sourcesContent":["import type { FormState, FormOptions } from '@tanstack/form-core'\nimport { FormApi, functionalUpdate } from '@tanstack/form-core'\nimport type { NoInfer } from '@tanstack/react-store'\nimport { useStore } from '@tanstack/react-store'\nimport React from 'react'\nimport { type UseField, type FieldComponent, Field, useField } from './useField'\nimport { formContext } from './formContext'\n\nexport type FormSubmitEvent = React.FormEvent<HTMLFormElement>\n\ndeclare module '@tanstack/form-core' {\n  interface Register {\n    FormSubmitEvent: FormSubmitEvent\n  }\n\n  // eslint-disable-next-line no-shadow\n  interface FormApi<TFormData> {\n    Provider: (props: { children: any }) => any\n    getFormProps: () => FormProps\n    Field: FieldComponent<TFormData, TFormData>\n    useField: UseField<TFormData>\n    useStore: <TSelected = NoInfer<FormState<TFormData>>>(\n      selector?: (state: NoInfer<FormState<TFormData>>) => TSelected,\n    ) => TSelected\n    Subscribe: <TSelected = NoInfer<FormState<TFormData>>>(props: {\n      selector?: (state: NoInfer<FormState<TFormData>>) => TSelected\n      children:\n        | ((state: NoInfer<TSelected>) => React.ReactNode)\n        | React.ReactNode\n    }) => any\n  }\n}\n\nexport type FormProps = {\n  onSubmit: (e: FormSubmitEvent) => void\n  disabled: boolean\n}\n\nexport function useForm<TData>(opts?: FormOptions<TData>): FormApi<TData> {\n  const [formApi] = React.useState(() => {\n    // @ts-ignore\n    const api = new FormApi<TData>(opts)\n\n    // eslint-disable-next-line react/display-name\n    api.Provider = (props) => (\n      <formContext.Provider {...props} value={{ formApi: api }} />\n    )\n    api.getFormProps = () => {\n      return {\n        onSubmit: formApi.handleSubmit,\n        disabled: api.state.isSubmitting,\n      }\n    }\n    api.Field = Field as any\n    api.useField = useField as any\n    api.useStore = (\n      // @ts-ignore\n      selector,\n    ) => {\n      // eslint-disable-next-line react-hooks/rules-of-hooks\n      return useStore(api.store as any, selector as any) as any\n    }\n    api.Subscribe = (\n      // @ts-ignore\n      props,\n    ) => {\n      return functionalUpdate(\n        props.children,\n        // eslint-disable-next-line react-hooks/rules-of-hooks\n        useStore(api.store as any, props.selector as any),\n      ) as any\n    }\n\n    return api\n  })\n\n  formApi.useStore((state) => state.isSubmitting)\n  formApi.update(opts)\n\n  return formApi as any\n}\n"],"names":["useForm","opts","formApi","React","useState","api","FormApi","Provider","props","createElement","formContext","_extends","value","getFormProps","onSubmit","handleSubmit","disabled","state","isSubmitting","Field","useField","useStore","selector","store","Subscribe","functionalUpdate","children","update"],"mappings":";;;;;;;AAsCO,SAASA,OAAOA,CAAQC,IAAyB,EAAkB;EACxE,MAAM,CAACC,OAAO,CAAC,GAAGC,cAAK,CAACC,QAAQ,CAAC,MAAM;AACrC;AACA,IAAA,MAAMC,GAAG,GAAG,IAAIC,OAAO,CAAQL,IAAI,CAAC,CAAA;;AAEpC;AACAI,IAAAA,GAAG,CAACE,QAAQ,GAAIC,KAAK,iBACnBL,cAAA,CAAAM,aAAA,CAACC,WAAW,CAACH,QAAQ,EAAAI,QAAA,KAAKH,KAAK,EAAA;AAAEI,MAAAA,KAAK,EAAE;AAAEV,QAAAA,OAAO,EAAEG,GAAAA;AAAI,OAAA;AAAE,KAAA,CAAE,CAC5D,CAAA;IACDA,GAAG,CAACQ,YAAY,GAAG,MAAM;MACvB,OAAO;QACLC,QAAQ,EAAEZ,OAAO,CAACa,YAAY;AAC9BC,QAAAA,QAAQ,EAAEX,GAAG,CAACY,KAAK,CAACC,YAAAA;OACrB,CAAA;KACF,CAAA;IACDb,GAAG,CAACc,KAAK,GAAGA,KAAY,CAAA;IACxBd,GAAG,CAACe,QAAQ,GAAGA,QAAe,CAAA;IAC9Bf,GAAG,CAACgB,QAAQ,GAAG;AACb;AACAC,IAAAA,QAAQ,KACL;AACH;AACA,MAAA,OAAOD,QAAQ,CAAChB,GAAG,CAACkB,KAAK,EAASD,QAAe,CAAC,CAAA;KACnD,CAAA;IACDjB,GAAG,CAACmB,SAAS,GAAG;AACd;AACAhB,IAAAA,KAAK,KACF;AACH,MAAA,OAAOiB,gBAAgB,CACrBjB,KAAK,CAACkB,QAAQ;AACd;MACAL,QAAQ,CAAChB,GAAG,CAACkB,KAAK,EAASf,KAAK,CAACc,QAAe,CAClD,CAAC,CAAA;KACF,CAAA;AAED,IAAA,OAAOjB,GAAG,CAAA;AACZ,GAAC,CAAC,CAAA;EAEFH,OAAO,CAACmB,QAAQ,CAAEJ,KAAK,IAAKA,KAAK,CAACC,YAAY,CAAC,CAAA;AAC/ChB,EAAAA,OAAO,CAACyB,MAAM,CAAC1B,IAAI,CAAC,CAAA;AAEpB,EAAA,OAAOC,OAAO,CAAA;AAChB;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/react-form",
-  "version": "0.0.11",
+  "version": "0.0.12",
   "description": "Powerful, type-safe forms for React.",
   "author": "tannerlinsley",
   "license": "MIT",
@@ -10,13 +10,27 @@
     "type": "github",
     "url": "https://github.com/sponsors/tannerlinsley"
   },
-  "types": "build/types/index.d.ts",
-  "main": "build/cjs/index.js",
-  "module": "build/esm/index.js",
+  "type": "module",
+  "types": "build/lib/index.d.ts",
+  "main": "build/lib/index.legacy.cjs",
+  "module": "build/lib/index.legacy.js",
+  "exports": {
+    ".": {
+      "types": "./build/lib/index.d.ts",
+      "import": "./build/lib/index.js",
+      "require": "./build/lib/index.cjs",
+      "default": "./build/lib/index.cjs"
+    },
+    "./package.json": "./package.json"
+  },
   "sideEffects": false,
   "files": [
-    "build/**",
-    "src"
+    "build/lib/*",
+    "src",
+    "build/codemods",
+    "!build/codemods/jest.config.js",
+    "!build/codemods/**/__testfixtures__",
+    "!build/codemods/**/__tests__"
   ],
   "devDependencies": {
     "@types/jscodeshift": "^0.11.3",
@@ -29,7 +43,7 @@
   },
   "dependencies": {
     "@tanstack/react-store": "0.0.1-beta.85",
-    "@tanstack/form-core": "0.0.11"
+    "@tanstack/form-core": "0.0.12"
   },
   "peerDependencies": {
     "react": "^17.0.0 || ^18.0.0",
@@ -45,11 +59,15 @@
     }
   },
   "scripts": {
-    "clean": "rimraf ./build",
+    "clean": "rimraf ./build && rimraf ./coverage",
     "test:eslint": "eslint --ext .ts,.tsx ./src",
-    "test:types": "tsc",
-    "test:lib": "jest --config ./jest.config.ts",
+    "test:types": "tsc --noEmit",
+    "test:lib": "vitest run --coverage",
     "test:lib:dev": "pnpm run test:lib --watch",
-    "build:types": "tsc --build"
+    "test:build": "publint --strict",
+    "build": "pnpm build:rollup && pnpm build:codemods && pnpm build:types",
+    "build:rollup": "rollup --config rollup.config.js",
+    "build:codemods": "cpy ../codemods/src/**/* ./build/codemods",
+    "build:types": "tsc --emitDeclarationOnly"
   }
 }