@tanstack/react-form 0.13.0 → 0.13.1

package/dist/cjs/createFormFactory.cjs

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const useField = require("./useField.cjs");
+const useForm = require("./useForm.cjs");
+const validateFormData = require("./validateFormData.cjs");
+function createFormFactory(defaultOpts) {
+  return {
+    useForm: (opts) => {
+      const formOptions = Object.assign({}, defaultOpts, opts);
+      return useForm.useForm(formOptions);
+    },
+    useField: useField.useField,
+    Field: useField.Field,
+    validateFormData: validateFormData.getValidateFormData(defaultOpts),
+    initialFormState: {
+      errorMap: {
+        onServer: void 0
+      },
+      errors: []
+    }
+  };
+}
+exports.createFormFactory = createFormFactory;
+//# sourceMappingURL=createFormFactory.cjs.map

package/dist/cjs/createFormFactory.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"createFormFactory.cjs","sources":["../../src/createFormFactory.ts"],"sourcesContent":["import type { FormApi, FormOptions, Validator } from '@tanstack/form-core'\n\nimport { type UseField, type FieldComponent, Field, useField } from './useField'\nimport { useForm } from './useForm'\nimport { type ValidateFormData, getValidateFormData } from './validateFormData'\n\nexport type FormFactory<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n> = {\n  useForm: (\n    opts?: FormOptions<TFormData, TFormValidator>,\n  ) => FormApi<TFormData, TFormValidator>\n  useField: UseField<TFormData>\n  Field: FieldComponent<TFormData, TFormValidator>\n  validateFormData: ValidateFormData<TFormData, TFormValidator>\n  initialFormState: Partial<FormApi<TFormData, TFormValidator>['state']>\n}\n\nexport function createFormFactory<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n>(\n  defaultOpts?: FormOptions<TFormData, TFormValidator>,\n): FormFactory<TFormData, TFormValidator> {\n  return {\n    useForm: (opts) => {\n      const formOptions = Object.assign({}, defaultOpts, opts)\n      return useForm<TFormData, TFormValidator>(formOptions)\n    },\n    useField: useField as any,\n    Field: Field as any,\n    validateFormData: getValidateFormData(defaultOpts) as never,\n    initialFormState: {\n      errorMap: {\n        onServer: undefined,\n      },\n      errors: [],\n    },\n  }\n}\n"],"names":["useForm","useField","Field","getValidateFormData"],"mappings":";;;;;AAmBO,SAAS,kBAId,aACwC;AACjC,SAAA;AAAA,IACL,SAAS,CAAC,SAAS;AACjB,YAAM,cAAc,OAAO,OAAO,CAAA,GAAI,aAAa,IAAI;AACvD,aAAOA,QAAAA,QAAmC,WAAW;AAAA,IACvD;AAAA,IAAA,UACAC,SAAA;AAAA,IAAA,OACAC,SAAA;AAAA,IACA,kBAAkBC,qCAAoB,WAAW;AAAA,IACjD,kBAAkB;AAAA,MAChB,UAAU;AAAA,QACR,UAAU;AAAA,MACZ;AAAA,MACA,QAAQ,CAAC;AAAA,IACX;AAAA,EAAA;AAEJ;;"}

package/dist/cjs/formContext.cjs

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const rehackt = require("rehackt");
+const formContext = rehackt.createContext(null);
+function useFormContext() {
+  const formApi = rehackt.useContext(formContext);
+  if (!formApi) {
+    throw new Error(`You are trying to use the form API outside of a form!`);
+  }
+  return formApi;
+}
+exports.formContext = formContext;
+exports.useFormContext = useFormContext;
+//# sourceMappingURL=formContext.cjs.map

package/dist/cjs/formContext.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"formContext.cjs","sources":["../../src/formContext.ts"],"sourcesContent":["import type { FormApi, Validator } from '@tanstack/form-core'\nimport { createContext, useContext } from 'rehackt'\n\nexport const formContext = createContext<{\n  formApi: FormApi<any, Validator<any, unknown> | undefined>\n  parentFieldName?: string\n} | null>(null!)\n\nexport function useFormContext() {\n  const formApi = useContext(formContext)\n\n  if (!formApi) {\n    throw new Error(`You are trying to use the form API outside of a form!`)\n  }\n\n  return formApi\n}\n"],"names":["createContext","useContext"],"mappings":";;;AAGa,MAAA,cAAcA,sBAGjB,IAAK;AAER,SAAS,iBAAiB;AACzB,QAAA,UAAUC,mBAAW,WAAW;AAEtC,MAAI,CAAC,SAAS;AACN,UAAA,IAAI,MAAM,uDAAuD;AAAA,EACzE;AAEO,SAAA;AACT;;;"}

package/dist/cjs/index.cjs

@@ -1,162 +1,10 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const formCore = require("@tanstack/form-core");
-const reactStore = require("@tanstack/react-store");
-const React = require("rehackt");
-const decodeFormdata = require("decode-formdata");
-const formContext = React.createContext(null);
-function useFormContext() {
-  const formApi = React.useContext(formContext);
-  if (!formApi) {
-    throw new Error(`You are trying to use the form API outside of a form!`);
-  }
-  return formApi;
-}
-const useIsomorphicLayoutEffect = (
-  // @ts-ignore
-  typeof window !== "undefined" ? React.useLayoutEffect : React.useEffect
-);
-const useIsomorphicEffectOnce = (effect) => {
-  const destroyFunc = React.useRef();
-  const effectCalled = React.useRef(false);
-  const renderAfterCalled = React.useRef(false);
-  const [val, setVal] = React.useState(0);
-  if (effectCalled.current) {
-    renderAfterCalled.current = true;
-  }
-  useIsomorphicLayoutEffect(() => {
-    if (!effectCalled.current) {
-      destroyFunc.current = effect();
-      effectCalled.current = true;
-    }
-    setVal((v) => v + 1);
-    return () => {
-      if (!renderAfterCalled.current) {
-        return;
-      }
-      if (destroyFunc.current) {
-        destroyFunc.current();
-      }
-    };
-  }, []);
-};
-function useField(opts) {
-  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 !== void 0).join(".");
-    const api = new formCore.FieldApi({
-      ...opts,
-      form: formApi,
-      // TODO: Fix typings to include `index` and `parentFieldName`, if present
-      name
-    });
-    api.Field = Field;
-    return api;
-  });
-  useIsomorphicLayoutEffect(() => {
-    fieldApi.update({ ...opts, form: formApi });
-  });
-  reactStore.useStore(
-    fieldApi.store,
-    opts.mode === "array" ? (state) => {
-      return [state.meta, Object.keys(state.value).length];
-    } : void 0
-  );
-  const unmountFn = React.useRef(null);
-  useIsomorphicEffectOnce(() => {
-    return () => {
-      var _a;
-      (_a = unmountFn.current) == null ? void 0 : _a.call(unmountFn);
-    };
-  });
-  if (!unmountFn.current) {
-    unmountFn.current = fieldApi.mount();
-  }
-  return fieldApi;
-}
-function Field({
-  children,
-  ...fieldOptions
-}) {
-  const fieldApi = useField(fieldOptions);
-  return /* @__PURE__ */ React.createElement(
-    formContext.Provider,
-    {
-      value: {
-        formApi: fieldApi.form,
-        parentFieldName: fieldApi.name
-      },
-      children: formCore.functionalUpdate(children, fieldApi)
-    }
-  );
-}
-function useForm(opts) {
-  const [formApi] = React.useState(() => {
-    const api = new formCore.FormApi(opts);
-    api.Provider = function Provider(props) {
-      useIsomorphicLayoutEffect(api.mount, []);
-      return /* @__PURE__ */ React.createElement(formContext.Provider, { ...props, value: { formApi: api } });
-    };
-    api.Field = Field;
-    api.useField = useField;
-    api.useStore = (selector) => {
-      return reactStore.useStore(api.store, selector);
-    };
-    api.Subscribe = (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);
-  useIsomorphicLayoutEffect(() => {
-    formApi.update(opts);
-  });
-  return formApi;
-}
-const getValidateFormData = (defaultOpts) => async (formData, info) => {
-  const { validatorAdapter, onServerValidate } = defaultOpts || {};
-  const runValidator = (propsValue) => {
-    if (validatorAdapter && typeof onServerValidate !== "function") {
-      return validatorAdapter().validate(propsValue, onServerValidate);
-    }
-    return onServerValidate(propsValue);
-  };
-  const data = decodeFormdata.decode(formData, info);
-  const onServerError = runValidator({ value: data });
-  return {
-    errorMap: {
-      onServer: onServerError
-    },
-    errors: onServerError ? [onServerError] : []
-  };
-};
-function createFormFactory(defaultOpts) {
-  return {
-    useForm: (opts) => {
-      const formOptions = Object.assign({}, defaultOpts, opts);
-      return useForm(formOptions);
-    },
-    useField,
-    Field,
-    validateFormData: getValidateFormData(defaultOpts),
-    initialFormState: {
-      errorMap: {
-        onServer: void 0
-      },
-      errors: []
-    }
-  };
-}
-function useTransform(fn, deps) {
-  return {
-    fn,
-    deps
-  };
-}
+const useForm = require("./useForm.cjs");
+const useField = require("./useField.cjs");
+const createFormFactory = require("./createFormFactory.cjs");
+const useTransform = require("./useTransform.cjs");
 Object.defineProperty(exports, "FieldApi", {
   enumerable: true,
   get: () => formCore.FieldApi
@@ -173,9 +21,9 @@ Object.defineProperty(exports, "mergeForm", {
   enumerable: true,
   get: () => formCore.mergeForm
 });
-exports.Field = Field;
-exports.createFormFactory = createFormFactory;
-exports.useField = useField;
-exports.useForm = useForm;
-exports.useTransform = useTransform;
+exports.useForm = useForm.useForm;
+exports.Field = useField.Field;
+exports.useField = useField.useField;
+exports.createFormFactory = createFormFactory.createFormFactory;
+exports.useTransform = useTransform.useTransform;
 //# sourceMappingURL=index.cjs.map

package/dist/cjs/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../src/formContext.ts","../../src/useIsomorphicLayoutEffect.ts","../../src/useIsomorphicEffectOnce.ts","../../src/useField.tsx","../../src/useForm.tsx","../../src/validateFormData.ts","../../src/createFormFactory.ts","../../src/useTransform.ts"],"sourcesContent":["import type { FormApi, Validator } from '@tanstack/form-core'\nimport { createContext, useContext } from 'rehackt'\n\nexport const formContext = createContext<{\n  formApi: FormApi<any, Validator<any, unknown> | undefined>\n  parentFieldName?: string\n} | null>(null!)\n\nexport function useFormContext() {\n  const formApi = useContext(formContext)\n\n  if (!formApi) {\n    throw new Error(`You are trying to use the form API outside of a form!`)\n  }\n\n  return formApi\n}\n","import { useEffect, useLayoutEffect } from 'rehackt'\n\nexport const useIsomorphicLayoutEffect =\n  // @ts-ignore\n  typeof window !== 'undefined' ? useLayoutEffect : useEffect\n","import { useRef, useState, type EffectCallback } from 'rehackt'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\n\n/**\n * This hook handles StrictMode and prod mode\n */\nexport const useIsomorphicEffectOnce = (effect: EffectCallback) => {\n  const destroyFunc = useRef<void | (() => void)>()\n  const effectCalled = useRef(false)\n  const renderAfterCalled = useRef(false)\n  const [val, setVal] = useState(0)\n\n  if (effectCalled.current) {\n    renderAfterCalled.current = true\n  }\n\n  useIsomorphicLayoutEffect(() => {\n    // only execute the effect first time around\n    if (!effectCalled.current) {\n      destroyFunc.current = effect()\n      effectCalled.current = true\n    }\n\n    // this forces one render after the effect is run\n    setVal((v) => v + 1)\n\n    return () => {\n      // if the comp didn't render since the useEffect was called,\n      // we know it's the dummy React cycle\n      if (!renderAfterCalled.current) {\n        return\n      }\n      if (destroyFunc.current) {\n        destroyFunc.current()\n      }\n    }\n  }, [])\n}\n","import React, { useRef, useState } from 'rehackt'\nimport { useStore } from '@tanstack/react-store'\nimport type {\n  DeepKeys,\n  DeepValue,\n  Narrow,\n  Validator,\n} from '@tanstack/form-core'\nimport { FieldApi, functionalUpdate } from '@tanstack/form-core'\nimport { useFormContext, formContext } from './formContext'\nimport type { UseFieldOptions } from './types'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\nimport { useIsomorphicEffectOnce } from './useIsomorphicEffectOnce'\n\ndeclare module '@tanstack/form-core' {\n  // eslint-disable-next-line no-shadow\n  interface FieldApi<\n    TParentData,\n    TName extends DeepKeys<TParentData>,\n    TFieldValidator extends\n      | Validator<DeepValue<TParentData, TName>, unknown>\n      | undefined = undefined,\n    TFormValidator extends\n      | Validator<TParentData, unknown>\n      | undefined = undefined,\n    TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>,\n  > {\n    Field: FieldComponent<TParentData, TFormValidator>\n  }\n}\n\nexport type UseField<TParentData> = <\n  TName extends DeepKeys<TParentData>,\n  TFieldValidator extends\n    | Validator<DeepValue<TParentData, TName>, unknown>\n    | undefined = undefined,\n  TFormValidator extends\n    | Validator<TParentData, unknown>\n    | undefined = undefined,\n>(\n  opts?: { name: Narrow<TName> } & UseFieldOptions<\n    TParentData,\n    TName,\n    TFieldValidator,\n    TFormValidator\n  >,\n) => FieldApi<\n  TParentData,\n  TName,\n  TFieldValidator,\n  TFormValidator,\n  DeepValue<TParentData, TName>\n>\n\nexport function useField<\n  TParentData,\n  TName extends DeepKeys<TParentData>,\n  TFieldValidator extends\n    | Validator<DeepValue<TParentData, TName>, unknown>\n    | undefined = undefined,\n  TFormValidator extends\n    | Validator<TParentData, unknown>\n    | undefined = undefined,\n>(\n  opts: UseFieldOptions<TParentData, TName, TFieldValidator, TFormValidator>,\n): FieldApi<TParentData, TName, TFieldValidator, TFormValidator> {\n  // Get the form API either manually or from context\n  const { formApi, parentFieldName } = useFormContext()\n\n  const [fieldApi] = useState(() => {\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({\n      ...opts,\n      form: formApi as never,\n      // TODO: Fix typings to include `index` and `parentFieldName`, if present\n      name: name as typeof opts.name as never,\n    })\n\n    api.Field = Field as never\n\n    return api\n  })\n\n  /**\n   * fieldApi.update should not have any side effects. Think of it like a `useRef`\n   * that we need to keep updated every render with the most up-to-date information.\n   */\n  useIsomorphicLayoutEffect(() => {\n    fieldApi.update({ ...opts, form: formApi } as never)\n  })\n\n  useStore(\n    fieldApi.store,\n    opts.mode === 'array'\n      ? (state) => {\n          return [state.meta, Object.keys(state.value).length]\n        }\n      : undefined,\n  )\n  const unmountFn = useRef<(() => void) | null>(null)\n\n  useIsomorphicEffectOnce(() => {\n    return () => {\n      unmountFn.current?.()\n    }\n  })\n\n  // We have to mount it right as soon as it renders, otherwise we get:\n  // https://github.com/TanStack/form/issues/523\n  if (!unmountFn.current) {\n    unmountFn.current = fieldApi.mount()\n  }\n\n  return fieldApi as never\n}\n\ntype FieldComponentProps<\n  TParentData,\n  TName extends DeepKeys<TParentData>,\n  TFieldValidator extends\n    | Validator<DeepValue<TParentData, TName>, unknown>\n    | undefined = undefined,\n  TFormValidator extends\n    | Validator<TParentData, unknown>\n    | undefined = undefined,\n  TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>,\n> = {\n  children: (\n    fieldApi: FieldApi<\n      TParentData,\n      TName,\n      TFieldValidator,\n      TFormValidator,\n      TData\n    >,\n  ) => any\n} & (TParentData extends any[]\n  ? {\n      name?: TName\n      index: number\n    }\n  : {\n      name: TName\n      index?: never\n    }) &\n  Omit<\n    UseFieldOptions<TParentData, TName, TFieldValidator, TFormValidator>,\n    'name' | 'index'\n  >\n\nexport type FieldComponent<\n  TParentData,\n  TFormValidator extends\n    | Validator<TParentData, unknown>\n    | undefined = undefined,\n> = <\n  TName extends DeepKeys<TParentData>,\n  TFieldValidator extends\n    | Validator<DeepValue<TParentData, TName>, unknown>\n    | undefined = undefined,\n  TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>,\n>({\n  children,\n  ...fieldOptions\n}: FieldComponentProps<\n  TParentData,\n  TName,\n  TFieldValidator,\n  TFormValidator,\n  TData\n>) => any\n\nexport function Field<\n  TParentData,\n  TName extends DeepKeys<TParentData>,\n  TFieldValidator extends\n    | Validator<DeepValue<TParentData, TName>, unknown>\n    | undefined = undefined,\n  TFormValidator extends\n    | Validator<TParentData, unknown>\n    | undefined = undefined,\n>({\n  children,\n  ...fieldOptions\n}: {\n  children: (\n    fieldApi: FieldApi<TParentData, TName, TFieldValidator, TFormValidator>,\n  ) => any\n} & UseFieldOptions<TParentData, TName, TFieldValidator, TFormValidator>) {\n  const fieldApi = useField(fieldOptions as any)\n\n  return (\n    <formContext.Provider\n      value={{\n        formApi: fieldApi.form as never,\n        parentFieldName: fieldApi.name,\n      }}\n      children={functionalUpdate(children, fieldApi as any)}\n    />\n  )\n}\n","import type { FormState, FormOptions, Validator } 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, {\n  type PropsWithChildren,\n  type ReactNode,\n  useState,\n} from 'rehackt'\nimport { type UseField, type FieldComponent, Field, useField } from './useField'\nimport { formContext } from './formContext'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\n\ndeclare module '@tanstack/form-core' {\n  // eslint-disable-next-line no-shadow\n  interface FormApi<TFormData, TFormValidator> {\n    Provider: (props: PropsWithChildren) => JSX.Element\n    Field: FieldComponent<TFormData, TFormValidator>\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: ((state: NoInfer<TSelected>) => ReactNode) | ReactNode\n    }) => JSX.Element\n  }\n}\n\nexport function useForm<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n>(\n  opts?: FormOptions<TFormData, TFormValidator>,\n): FormApi<TFormData, TFormValidator> {\n  const [formApi] = useState(() => {\n    // @ts-ignore\n    const api = new FormApi<TFormData, TFormValidator>(opts)\n\n    api.Provider = function Provider(props) {\n      useIsomorphicLayoutEffect(api.mount, [])\n      return (\n        <formContext.Provider {...props} value={{ formApi: api as never }} />\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\n  /**\n   * formApi.update should not have any side effects. Think of it like a `useRef`\n   * that we need to keep updated every render with the most up-to-date information.\n   */\n  useIsomorphicLayoutEffect(() => {\n    formApi.update(opts)\n  })\n\n  return formApi as any\n}\n","import { decode } from 'decode-formdata'\nimport type {\n  FormApi,\n  FormOptions,\n  ValidationError,\n  Validator,\n} from '@tanstack/form-core'\n\ntype OnServerValidateFn<TFormData> = (props: {\n  value: TFormData\n}) => ValidationError\n\ntype OnServerValidateOrFn<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n> = TFormValidator extends Validator<TFormData, infer FFN>\n  ? FFN | OnServerValidateFn<TFormData>\n  : OnServerValidateFn<TFormData>\n\ndeclare module '@tanstack/form-core' {\n  // eslint-disable-next-line no-shadow\n  interface FormOptions<\n    TFormData,\n    TFormValidator extends\n      | Validator<TFormData, unknown>\n      | undefined = undefined,\n  > {\n    onServerValidate?: OnServerValidateOrFn<TFormData, TFormValidator>\n  }\n}\n\nexport type ValidateFormData<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n> = (\n  formData: FormData,\n  info?: Parameters<typeof decode>[1],\n) => Promise<Partial<FormApi<TFormData, TFormValidator>['state']>>\n\nexport const getValidateFormData = <\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n>(\n  defaultOpts?: FormOptions<TFormData, TFormValidator>,\n) =>\n  (async (\n    formData: FormData,\n    info?: Parameters<typeof decode>[1],\n  ): Promise<Partial<FormApi<TFormData, TFormValidator>['state']>> => {\n    const { validatorAdapter, onServerValidate } = defaultOpts || {}\n\n    const runValidator = (propsValue: { value: TFormData }) => {\n      if (validatorAdapter && typeof onServerValidate !== 'function') {\n        return validatorAdapter().validate(propsValue, onServerValidate)\n      }\n\n      return (onServerValidate as OnServerValidateFn<TFormData>)(propsValue)\n    }\n\n    const data = decode(formData, info) as never as TFormData\n\n    const onServerError = runValidator({ value: data })\n\n    return {\n      errorMap: {\n        onServer: onServerError,\n      },\n      errors: onServerError ? [onServerError] : [],\n    }\n  }) as ValidateFormData<TFormData, TFormValidator>\n","import type { FormApi, FormOptions, Validator } from '@tanstack/form-core'\n\nimport { type UseField, type FieldComponent, Field, useField } from './useField'\nimport { useForm } from './useForm'\nimport { type ValidateFormData, getValidateFormData } from './validateFormData'\n\nexport type FormFactory<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n> = {\n  useForm: (\n    opts?: FormOptions<TFormData, TFormValidator>,\n  ) => FormApi<TFormData, TFormValidator>\n  useField: UseField<TFormData>\n  Field: FieldComponent<TFormData, TFormValidator>\n  validateFormData: ValidateFormData<TFormData, TFormValidator>\n  initialFormState: Partial<FormApi<TFormData, TFormValidator>['state']>\n}\n\nexport function createFormFactory<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n>(\n  defaultOpts?: FormOptions<TFormData, TFormValidator>,\n): FormFactory<TFormData, TFormValidator> {\n  return {\n    useForm: (opts) => {\n      const formOptions = Object.assign({}, defaultOpts, opts)\n      return useForm<TFormData, TFormValidator>(formOptions)\n    },\n    useField: useField as any,\n    Field: Field as any,\n    validateFormData: getValidateFormData(defaultOpts) as never,\n    initialFormState: {\n      errorMap: {\n        onServer: undefined,\n      },\n      errors: [],\n    },\n  }\n}\n","import type { FormApi, Validator } from '@tanstack/form-core'\n\nexport function useTransform<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n>(\n  fn: (\n    formBase: FormApi<TFormData, TFormValidator>,\n  ) => FormApi<TFormData, TFormValidator>,\n  deps: unknown[],\n) {\n  return {\n    fn,\n    deps,\n  }\n}\n"],"names":["createContext","useContext","useLayoutEffect","useEffect","useRef","useState","FieldApi","useStore","functionalUpdate","FormApi","decode"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/useField.cjs

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const rehackt = require("rehackt");
+const reactStore = require("@tanstack/react-store");
+const formCore = require("@tanstack/form-core");
+const formContext = require("./formContext.cjs");
+const useIsomorphicLayoutEffect = require("./useIsomorphicLayoutEffect.cjs");
+const useIsomorphicEffectOnce = require("./useIsomorphicEffectOnce.cjs");
+function useField(opts) {
+  const { formApi, parentFieldName } = formContext.useFormContext();
+  const [fieldApi] = rehackt.useState(() => {
+    const name = (typeof opts.index === "number" ? [parentFieldName, opts.index, opts.name] : [parentFieldName, opts.name]).filter((d) => d !== void 0).join(".");
+    const api = new formCore.FieldApi({
+      ...opts,
+      form: formApi,
+      // TODO: Fix typings to include `index` and `parentFieldName`, if present
+      name
+    });
+    api.Field = Field;
+    return api;
+  });
+  useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
+    fieldApi.update({ ...opts, form: formApi });
+  });
+  reactStore.useStore(
+    fieldApi.store,
+    opts.mode === "array" ? (state) => {
+      return [state.meta, Object.keys(state.value).length];
+    } : void 0
+  );
+  const unmountFn = rehackt.useRef(null);
+  useIsomorphicEffectOnce.useIsomorphicEffectOnce(() => {
+    return () => {
+      var _a;
+      (_a = unmountFn.current) == null ? void 0 : _a.call(unmountFn);
+    };
+  });
+  if (!unmountFn.current) {
+    unmountFn.current = fieldApi.mount();
+  }
+  return fieldApi;
+}
+function Field({
+  children,
+  ...fieldOptions
+}) {
+  const fieldApi = useField(fieldOptions);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    formContext.formContext.Provider,
+    {
+      value: {
+        formApi: fieldApi.form,
+        parentFieldName: fieldApi.name
+      },
+      children: formCore.functionalUpdate(children, fieldApi)
+    }
+  );
+}
+exports.Field = Field;
+exports.useField = useField;
+//# sourceMappingURL=useField.cjs.map

package/dist/cjs/useField.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useField.cjs","sources":["../../src/useField.tsx"],"sourcesContent":["import React, { useRef, useState } from 'rehackt'\nimport { useStore } from '@tanstack/react-store'\nimport type {\n  DeepKeys,\n  DeepValue,\n  Narrow,\n  Validator,\n} from '@tanstack/form-core'\nimport { FieldApi, functionalUpdate } from '@tanstack/form-core'\nimport { useFormContext, formContext } from './formContext'\nimport type { UseFieldOptions } from './types'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\nimport { useIsomorphicEffectOnce } from './useIsomorphicEffectOnce'\n\ndeclare module '@tanstack/form-core' {\n  // eslint-disable-next-line no-shadow\n  interface FieldApi<\n    TParentData,\n    TName extends DeepKeys<TParentData>,\n    TFieldValidator extends\n      | Validator<DeepValue<TParentData, TName>, unknown>\n      | undefined = undefined,\n    TFormValidator extends\n      | Validator<TParentData, unknown>\n      | undefined = undefined,\n    TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>,\n  > {\n    Field: FieldComponent<TParentData, TFormValidator>\n  }\n}\n\nexport type UseField<TParentData> = <\n  TName extends DeepKeys<TParentData>,\n  TFieldValidator extends\n    | Validator<DeepValue<TParentData, TName>, unknown>\n    | undefined = undefined,\n  TFormValidator extends\n    | Validator<TParentData, unknown>\n    | undefined = undefined,\n>(\n  opts?: { name: Narrow<TName> } & UseFieldOptions<\n    TParentData,\n    TName,\n    TFieldValidator,\n    TFormValidator\n  >,\n) => FieldApi<\n  TParentData,\n  TName,\n  TFieldValidator,\n  TFormValidator,\n  DeepValue<TParentData, TName>\n>\n\nexport function useField<\n  TParentData,\n  TName extends DeepKeys<TParentData>,\n  TFieldValidator extends\n    | Validator<DeepValue<TParentData, TName>, unknown>\n    | undefined = undefined,\n  TFormValidator extends\n    | Validator<TParentData, unknown>\n    | undefined = undefined,\n>(\n  opts: UseFieldOptions<TParentData, TName, TFieldValidator, TFormValidator>,\n): FieldApi<TParentData, TName, TFieldValidator, TFormValidator> {\n  // Get the form API either manually or from context\n  const { formApi, parentFieldName } = useFormContext()\n\n  const [fieldApi] = useState(() => {\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({\n      ...opts,\n      form: formApi as never,\n      // TODO: Fix typings to include `index` and `parentFieldName`, if present\n      name: name as typeof opts.name as never,\n    })\n\n    api.Field = Field as never\n\n    return api\n  })\n\n  /**\n   * fieldApi.update should not have any side effects. Think of it like a `useRef`\n   * that we need to keep updated every render with the most up-to-date information.\n   */\n  useIsomorphicLayoutEffect(() => {\n    fieldApi.update({ ...opts, form: formApi } as never)\n  })\n\n  useStore(\n    fieldApi.store,\n    opts.mode === 'array'\n      ? (state) => {\n          return [state.meta, Object.keys(state.value).length]\n        }\n      : undefined,\n  )\n  const unmountFn = useRef<(() => void) | null>(null)\n\n  useIsomorphicEffectOnce(() => {\n    return () => {\n      unmountFn.current?.()\n    }\n  })\n\n  // We have to mount it right as soon as it renders, otherwise we get:\n  // https://github.com/TanStack/form/issues/523\n  if (!unmountFn.current) {\n    unmountFn.current = fieldApi.mount()\n  }\n\n  return fieldApi as never\n}\n\ntype FieldComponentProps<\n  TParentData,\n  TName extends DeepKeys<TParentData>,\n  TFieldValidator extends\n    | Validator<DeepValue<TParentData, TName>, unknown>\n    | undefined = undefined,\n  TFormValidator extends\n    | Validator<TParentData, unknown>\n    | undefined = undefined,\n  TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>,\n> = {\n  children: (\n    fieldApi: FieldApi<\n      TParentData,\n      TName,\n      TFieldValidator,\n      TFormValidator,\n      TData\n    >,\n  ) => any\n} & (TParentData extends any[]\n  ? {\n      name?: TName\n      index: number\n    }\n  : {\n      name: TName\n      index?: never\n    }) &\n  Omit<\n    UseFieldOptions<TParentData, TName, TFieldValidator, TFormValidator>,\n    'name' | 'index'\n  >\n\nexport type FieldComponent<\n  TParentData,\n  TFormValidator extends\n    | Validator<TParentData, unknown>\n    | undefined = undefined,\n> = <\n  TName extends DeepKeys<TParentData>,\n  TFieldValidator extends\n    | Validator<DeepValue<TParentData, TName>, unknown>\n    | undefined = undefined,\n  TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>,\n>({\n  children,\n  ...fieldOptions\n}: FieldComponentProps<\n  TParentData,\n  TName,\n  TFieldValidator,\n  TFormValidator,\n  TData\n>) => any\n\nexport function Field<\n  TParentData,\n  TName extends DeepKeys<TParentData>,\n  TFieldValidator extends\n    | Validator<DeepValue<TParentData, TName>, unknown>\n    | undefined = undefined,\n  TFormValidator extends\n    | Validator<TParentData, unknown>\n    | undefined = undefined,\n>({\n  children,\n  ...fieldOptions\n}: {\n  children: (\n    fieldApi: FieldApi<TParentData, TName, TFieldValidator, TFormValidator>,\n  ) => any\n} & UseFieldOptions<TParentData, TName, TFieldValidator, TFormValidator>) {\n  const fieldApi = useField(fieldOptions as any)\n\n  return (\n    <formContext.Provider\n      value={{\n        formApi: fieldApi.form as never,\n        parentFieldName: fieldApi.name,\n      }}\n      children={functionalUpdate(children, fieldApi as any)}\n    />\n  )\n}\n"],"names":["useFormContext","useState","FieldApi","useIsomorphicLayoutEffect","useStore","useRef","useIsomorphicEffectOnce","jsx","formContext","functionalUpdate"],"mappings":";;;;;;;;;AAsDO,SAAS,SAUd,MAC+D;AAE/D,QAAM,EAAE,SAAS,gBAAgB,IAAIA,YAAe,eAAA;AAEpD,QAAM,CAAC,QAAQ,IAAIC,QAAAA,SAAS,MAAM;AAC1B,UAAA,QACJ,OAAO,KAAK,UAAU,WAClB,CAAC,iBAAiB,KAAK,OAAO,KAAK,IAAI,IACvC,CAAC,iBAAiB,KAAK,IAAI,GAE9B,OAAO,CAAC,MAAM,MAAM,MAAS,EAC7B,KAAK,GAAG;AAEL,UAAA,MAAM,IAAIC,kBAAS;AAAA,MACvB,GAAG;AAAA,MACH,MAAM;AAAA;AAAA,MAEN;AAAA,IAAA,CACD;AAED,QAAI,QAAQ;AAEL,WAAA;AAAA,EAAA,CACR;AAMDC,4BAAAA,0BAA0B,MAAM;AAC9B,aAAS,OAAO,EAAE,GAAG,MAAM,MAAM,SAAkB;AAAA,EAAA,CACpD;AAEDC,aAAA;AAAA,IACE,SAAS;AAAA,IACT,KAAK,SAAS,UACV,CAAC,UAAU;AACF,aAAA,CAAC,MAAM,MAAM,OAAO,KAAK,MAAM,KAAK,EAAE,MAAM;AAAA,IAErD,IAAA;AAAA,EAAA;AAEA,QAAA,YAAYC,eAA4B,IAAI;AAElDC,0BAAAA,wBAAwB,MAAM;AAC5B,WAAO,MAAM;;AACX,sBAAU,YAAV;AAAA,IAAoB;AAAA,EACtB,CACD;AAIG,MAAA,CAAC,UAAU,SAAS;AACZ,cAAA,UAAU,SAAS;EAC/B;AAEO,SAAA;AACT;AA0DO,SAAS,MASd;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAI0E;AAClE,QAAA,WAAW,SAAS,YAAmB;AAG3C,SAAAC,2BAAA;AAAA,IAACC,YAAAA,YAAY;AAAA,IAAZ;AAAA,MACC,OAAO;AAAA,QACL,SAAS,SAAS;AAAA,QAClB,iBAAiB,SAAS;AAAA,MAC5B;AAAA,MACA,UAAUC,SAAAA,iBAAiB,UAAU,QAAe;AAAA,IAAA;AAAA,EAAA;AAG1D;;;"}

package/dist/cjs/useForm.cjs

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const formCore = require("@tanstack/form-core");
+const reactStore = require("@tanstack/react-store");
+const rehackt = require("rehackt");
+const useField = require("./useField.cjs");
+const formContext = require("./formContext.cjs");
+const useIsomorphicLayoutEffect = require("./useIsomorphicLayoutEffect.cjs");
+function useForm(opts) {
+  const [formApi] = rehackt.useState(() => {
+    const api = new formCore.FormApi(opts);
+    api.Provider = function Provider(props) {
+      useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(api.mount, []);
+      return /* @__PURE__ */ jsxRuntime.jsx(formContext.formContext.Provider, { ...props, value: { formApi: api } });
+    };
+    api.Field = useField.Field;
+    api.useField = useField.useField;
+    api.useStore = (selector) => {
+      return reactStore.useStore(api.store, selector);
+    };
+    api.Subscribe = (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);
+  useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
+    formApi.update(opts);
+  });
+  return formApi;
+}
+exports.useForm = useForm;
+//# sourceMappingURL=useForm.cjs.map

package/dist/cjs/useForm.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useForm.cjs","sources":["../../src/useForm.tsx"],"sourcesContent":["import type { FormState, FormOptions, Validator } 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, {\n  type PropsWithChildren,\n  type ReactNode,\n  useState,\n} from 'rehackt'\nimport { type UseField, type FieldComponent, Field, useField } from './useField'\nimport { formContext } from './formContext'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\n\ndeclare module '@tanstack/form-core' {\n  // eslint-disable-next-line no-shadow\n  interface FormApi<TFormData, TFormValidator> {\n    Provider: (props: PropsWithChildren) => JSX.Element\n    Field: FieldComponent<TFormData, TFormValidator>\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: ((state: NoInfer<TSelected>) => ReactNode) | ReactNode\n    }) => JSX.Element\n  }\n}\n\nexport function useForm<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n>(\n  opts?: FormOptions<TFormData, TFormValidator>,\n): FormApi<TFormData, TFormValidator> {\n  const [formApi] = useState(() => {\n    // @ts-ignore\n    const api = new FormApi<TFormData, TFormValidator>(opts)\n\n    api.Provider = function Provider(props) {\n      useIsomorphicLayoutEffect(api.mount, [])\n      return (\n        <formContext.Provider {...props} value={{ formApi: api as never }} />\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\n  /**\n   * formApi.update should not have any side effects. Think of it like a `useRef`\n   * that we need to keep updated every render with the most up-to-date information.\n   */\n  useIsomorphicLayoutEffect(() => {\n    formApi.update(opts)\n  })\n\n  return formApi as any\n}\n"],"names":["useState","FormApi","useIsomorphicLayoutEffect","jsx","formContext","Field","useField","useStore","functionalUpdate"],"mappings":";;;;;;;;;AA6BO,SAAS,QAId,MACoC;AACpC,QAAM,CAAC,OAAO,IAAIA,QAAAA,SAAS,MAAM;AAEzB,UAAA,MAAM,IAAIC,iBAAmC,IAAI;AAEnD,QAAA,WAAW,SAAS,SAAS,OAAO;AACZC,gCAAAA,0BAAA,IAAI,OAAO,CAAA,CAAE;AAErC,aAAAC,+BAACC,YAAAA,YAAY,UAAZ,EAAsB,GAAG,OAAO,OAAO,EAAE,SAAS,IAAgB,EAAA,CAAA;AAAA,IAAA;AAGvE,QAAI,QAAQC;AACZ,QAAI,WAAWC;AACX,QAAA,WAAW,CAEb,aACG;AAEI,aAAAC,oBAAS,IAAI,OAAc,QAAe;AAAA,IAAA;AAE/C,QAAA,YAAY,CAEd,UACG;AACI,aAAAC,SAAA;AAAA,QACL,MAAM;AAAA;AAAA,QAEND,WAAAA,SAAS,IAAI,OAAc,MAAM,QAAe;AAAA,MAAA;AAAA,IAClD;AAGK,WAAA;AAAA,EAAA,CACR;AAED,UAAQ,SAAS,CAAC,UAAU,MAAM,YAAY;AAM9CL,4BAAAA,0BAA0B,MAAM;AAC9B,YAAQ,OAAO,IAAI;AAAA,EAAA,CACpB;AAEM,SAAA;AACT;;"}

package/dist/cjs/useIsomorphicEffectOnce.cjs

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const rehackt = require("rehackt");
+const useIsomorphicLayoutEffect = require("./useIsomorphicLayoutEffect.cjs");
+const useIsomorphicEffectOnce = (effect) => {
+  const destroyFunc = rehackt.useRef();
+  const effectCalled = rehackt.useRef(false);
+  const renderAfterCalled = rehackt.useRef(false);
+  const [val, setVal] = rehackt.useState(0);
+  if (effectCalled.current) {
+    renderAfterCalled.current = true;
+  }
+  useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
+    if (!effectCalled.current) {
+      destroyFunc.current = effect();
+      effectCalled.current = true;
+    }
+    setVal((v) => v + 1);
+    return () => {
+      if (!renderAfterCalled.current) {
+        return;
+      }
+      if (destroyFunc.current) {
+        destroyFunc.current();
+      }
+    };
+  }, []);
+};
+exports.useIsomorphicEffectOnce = useIsomorphicEffectOnce;
+//# sourceMappingURL=useIsomorphicEffectOnce.cjs.map

package/dist/cjs/useIsomorphicEffectOnce.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsomorphicEffectOnce.cjs","sources":["../../src/useIsomorphicEffectOnce.ts"],"sourcesContent":["import { useRef, useState, type EffectCallback } from 'rehackt'\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'\n\n/**\n * This hook handles StrictMode and prod mode\n */\nexport const useIsomorphicEffectOnce = (effect: EffectCallback) => {\n  const destroyFunc = useRef<void | (() => void)>()\n  const effectCalled = useRef(false)\n  const renderAfterCalled = useRef(false)\n  const [val, setVal] = useState(0)\n\n  if (effectCalled.current) {\n    renderAfterCalled.current = true\n  }\n\n  useIsomorphicLayoutEffect(() => {\n    // only execute the effect first time around\n    if (!effectCalled.current) {\n      destroyFunc.current = effect()\n      effectCalled.current = true\n    }\n\n    // this forces one render after the effect is run\n    setVal((v) => v + 1)\n\n    return () => {\n      // if the comp didn't render since the useEffect was called,\n      // we know it's the dummy React cycle\n      if (!renderAfterCalled.current) {\n        return\n      }\n      if (destroyFunc.current) {\n        destroyFunc.current()\n      }\n    }\n  }, [])\n}\n"],"names":["useRef","useState","useIsomorphicLayoutEffect"],"mappings":";;;;AAMa,MAAA,0BAA0B,CAAC,WAA2B;AACjE,QAAM,cAAcA,QAAAA;AACd,QAAA,eAAeA,eAAO,KAAK;AAC3B,QAAA,oBAAoBA,eAAO,KAAK;AACtC,QAAM,CAAC,KAAK,MAAM,IAAIC,iBAAS,CAAC;AAEhC,MAAI,aAAa,SAAS;AACxB,sBAAkB,UAAU;AAAA,EAC9B;AAEAC,4BAAAA,0BAA0B,MAAM;AAE1B,QAAA,CAAC,aAAa,SAAS;AACzB,kBAAY,UAAU;AACtB,mBAAa,UAAU;AAAA,IACzB;AAGO,WAAA,CAAC,MAAM,IAAI,CAAC;AAEnB,WAAO,MAAM;AAGP,UAAA,CAAC,kBAAkB,SAAS;AAC9B;AAAA,MACF;AACA,UAAI,YAAY,SAAS;AACvB,oBAAY,QAAQ;AAAA,MACtB;AAAA,IAAA;AAAA,EAEJ,GAAG,CAAE,CAAA;AACP;;"}

package/dist/cjs/useIsomorphicLayoutEffect.cjs

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const rehackt = require("rehackt");
+const useIsomorphicLayoutEffect = (
+  // @ts-ignore
+  typeof window !== "undefined" ? rehackt.useLayoutEffect : rehackt.useEffect
+);
+exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect;
+//# sourceMappingURL=useIsomorphicLayoutEffect.cjs.map

package/dist/cjs/useIsomorphicLayoutEffect.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsomorphicLayoutEffect.cjs","sources":["../../src/useIsomorphicLayoutEffect.ts"],"sourcesContent":["import { useEffect, useLayoutEffect } from 'rehackt'\n\nexport const useIsomorphicLayoutEffect =\n  // @ts-ignore\n  typeof window !== 'undefined' ? useLayoutEffect : useEffect\n"],"names":["useLayoutEffect","useEffect"],"mappings":";;;AAEa,MAAA;AAAA;AAAA,EAEX,OAAO,WAAW,cAAcA,QAAAA,kBAAkBC,QAAA;AAAA;;"}

package/dist/cjs/useTransform.cjs

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+function useTransform(fn, deps) {
+  return {
+    fn,
+    deps
+  };
+}
+exports.useTransform = useTransform;
+//# sourceMappingURL=useTransform.cjs.map

package/dist/cjs/useTransform.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTransform.cjs","sources":["../../src/useTransform.ts"],"sourcesContent":["import type { FormApi, Validator } from '@tanstack/form-core'\n\nexport function useTransform<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n>(\n  fn: (\n    formBase: FormApi<TFormData, TFormValidator>,\n  ) => FormApi<TFormData, TFormValidator>,\n  deps: unknown[],\n) {\n  return {\n    fn,\n    deps,\n  }\n}\n"],"names":[],"mappings":";;AAEgB,SAAA,aAId,IAGA,MACA;AACO,SAAA;AAAA,IACL;AAAA,IACA;AAAA,EAAA;AAEJ;;"}

package/dist/cjs/validateFormData.cjs

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const decodeFormdata = require("decode-formdata");
+const getValidateFormData = (defaultOpts) => async (formData, info) => {
+  const { validatorAdapter, onServerValidate } = defaultOpts || {};
+  const runValidator = (propsValue) => {
+    if (validatorAdapter && typeof onServerValidate !== "function") {
+      return validatorAdapter().validate(propsValue, onServerValidate);
+    }
+    return onServerValidate(propsValue);
+  };
+  const data = decodeFormdata.decode(formData, info);
+  const onServerError = runValidator({ value: data });
+  return {
+    errorMap: {
+      onServer: onServerError
+    },
+    errors: onServerError ? [onServerError] : []
+  };
+};
+exports.getValidateFormData = getValidateFormData;
+//# sourceMappingURL=validateFormData.cjs.map

package/dist/cjs/validateFormData.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"validateFormData.cjs","sources":["../../src/validateFormData.ts"],"sourcesContent":["import { decode } from 'decode-formdata'\nimport type {\n  FormApi,\n  FormOptions,\n  ValidationError,\n  Validator,\n} from '@tanstack/form-core'\n\ntype OnServerValidateFn<TFormData> = (props: {\n  value: TFormData\n}) => ValidationError\n\ntype OnServerValidateOrFn<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n> = TFormValidator extends Validator<TFormData, infer FFN>\n  ? FFN | OnServerValidateFn<TFormData>\n  : OnServerValidateFn<TFormData>\n\ndeclare module '@tanstack/form-core' {\n  // eslint-disable-next-line no-shadow\n  interface FormOptions<\n    TFormData,\n    TFormValidator extends\n      | Validator<TFormData, unknown>\n      | undefined = undefined,\n  > {\n    onServerValidate?: OnServerValidateOrFn<TFormData, TFormValidator>\n  }\n}\n\nexport type ValidateFormData<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n> = (\n  formData: FormData,\n  info?: Parameters<typeof decode>[1],\n) => Promise<Partial<FormApi<TFormData, TFormValidator>['state']>>\n\nexport const getValidateFormData = <\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n>(\n  defaultOpts?: FormOptions<TFormData, TFormValidator>,\n) =>\n  (async (\n    formData: FormData,\n    info?: Parameters<typeof decode>[1],\n  ): Promise<Partial<FormApi<TFormData, TFormValidator>['state']>> => {\n    const { validatorAdapter, onServerValidate } = defaultOpts || {}\n\n    const runValidator = (propsValue: { value: TFormData }) => {\n      if (validatorAdapter && typeof onServerValidate !== 'function') {\n        return validatorAdapter().validate(propsValue, onServerValidate)\n      }\n\n      return (onServerValidate as OnServerValidateFn<TFormData>)(propsValue)\n    }\n\n    const data = decode(formData, info) as never as TFormData\n\n    const onServerError = runValidator({ value: data })\n\n    return {\n      errorMap: {\n        onServer: onServerError,\n      },\n      errors: onServerError ? [onServerError] : [],\n    }\n  }) as ValidateFormData<TFormData, TFormValidator>\n"],"names":["decode"],"mappings":";;;AAuCO,MAAM,sBAAsB,CAIjC,gBAEC,OACC,UACA,SACkE;AAClE,QAAM,EAAE,kBAAkB,qBAAqB,eAAe,CAAA;AAExD,QAAA,eAAe,CAAC,eAAqC;AACrD,QAAA,oBAAoB,OAAO,qBAAqB,YAAY;AAC9D,aAAO,iBAAiB,EAAE,SAAS,YAAY,gBAAgB;AAAA,IACjE;AAEA,WAAQ,iBAAmD,UAAU;AAAA,EAAA;AAGjE,QAAA,OAAOA,eAAAA,OAAO,UAAU,IAAI;AAElC,QAAM,gBAAgB,aAAa,EAAE,OAAO,KAAM,CAAA;AAE3C,SAAA;AAAA,IACL,UAAU;AAAA,MACR,UAAU;AAAA,IACZ;AAAA,IACA,QAAQ,gBAAgB,CAAC,aAAa,IAAI,CAAC;AAAA,EAAA;AAE/C;;"}

package/dist/{mjs/validateFormData.d.ts → cjs/validateFormData.d.cts}

@@ -1,3 +1,5 @@
+/// <reference types="react" />
+/// <reference types="node" />
 import { decode } from 'decode-formdata';
 import type { FormApi, FormOptions, ValidationError, Validator } from '@tanstack/form-core';
 type OnServerValidateFn<TFormData> = (props: {

package/dist/esm/createFormFactory.js

@@ -0,0 +1,24 @@
+import { useField, Field } from "./useField.js";
+import { useForm } from "./useForm.js";
+import { getValidateFormData } from "./validateFormData.js";
+function createFormFactory(defaultOpts) {
+  return {
+    useForm: (opts) => {
+      const formOptions = Object.assign({}, defaultOpts, opts);
+      return useForm(formOptions);
+    },
+    useField,
+    Field,
+    validateFormData: getValidateFormData(defaultOpts),
+    initialFormState: {
+      errorMap: {
+        onServer: void 0
+      },
+      errors: []
+    }
+  };
+}
+export {
+  createFormFactory
+};
+//# sourceMappingURL=createFormFactory.js.map

package/dist/esm/createFormFactory.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createFormFactory.js","sources":["../../src/createFormFactory.ts"],"sourcesContent":["import type { FormApi, FormOptions, Validator } from '@tanstack/form-core'\n\nimport { type UseField, type FieldComponent, Field, useField } from './useField'\nimport { useForm } from './useForm'\nimport { type ValidateFormData, getValidateFormData } from './validateFormData'\n\nexport type FormFactory<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n> = {\n  useForm: (\n    opts?: FormOptions<TFormData, TFormValidator>,\n  ) => FormApi<TFormData, TFormValidator>\n  useField: UseField<TFormData>\n  Field: FieldComponent<TFormData, TFormValidator>\n  validateFormData: ValidateFormData<TFormData, TFormValidator>\n  initialFormState: Partial<FormApi<TFormData, TFormValidator>['state']>\n}\n\nexport function createFormFactory<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n>(\n  defaultOpts?: FormOptions<TFormData, TFormValidator>,\n): FormFactory<TFormData, TFormValidator> {\n  return {\n    useForm: (opts) => {\n      const formOptions = Object.assign({}, defaultOpts, opts)\n      return useForm<TFormData, TFormValidator>(formOptions)\n    },\n    useField: useField as any,\n    Field: Field as any,\n    validateFormData: getValidateFormData(defaultOpts) as never,\n    initialFormState: {\n      errorMap: {\n        onServer: undefined,\n      },\n      errors: [],\n    },\n  }\n}\n"],"names":[],"mappings":";;;AAmBO,SAAS,kBAId,aACwC;AACjC,SAAA;AAAA,IACL,SAAS,CAAC,SAAS;AACjB,YAAM,cAAc,OAAO,OAAO,CAAA,GAAI,aAAa,IAAI;AACvD,aAAO,QAAmC,WAAW;AAAA,IACvD;AAAA,IACA;AAAA,IACA;AAAA,IACA,kBAAkB,oBAAoB,WAAW;AAAA,IACjD,kBAAkB;AAAA,MAChB,UAAU;AAAA,QACR,UAAU;AAAA,MACZ;AAAA,MACA,QAAQ,CAAC;AAAA,IACX;AAAA,EAAA;AAEJ;"}

package/dist/esm/formContext.js

@@ -0,0 +1,14 @@
+import { createContext, useContext } from "rehackt";
+const formContext = createContext(null);
+function useFormContext() {
+  const formApi = useContext(formContext);
+  if (!formApi) {
+    throw new Error(`You are trying to use the form API outside of a form!`);
+  }
+  return formApi;
+}
+export {
+  formContext,
+  useFormContext
+};
+//# sourceMappingURL=formContext.js.map

package/dist/esm/formContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"formContext.js","sources":["../../src/formContext.ts"],"sourcesContent":["import type { FormApi, Validator } from '@tanstack/form-core'\nimport { createContext, useContext } from 'rehackt'\n\nexport const formContext = createContext<{\n  formApi: FormApi<any, Validator<any, unknown> | undefined>\n  parentFieldName?: string\n} | null>(null!)\n\nexport function useFormContext() {\n  const formApi = useContext(formContext)\n\n  if (!formApi) {\n    throw new Error(`You are trying to use the form API outside of a form!`)\n  }\n\n  return formApi\n}\n"],"names":[],"mappings":";AAGa,MAAA,cAAc,cAGjB,IAAK;AAER,SAAS,iBAAiB;AACzB,QAAA,UAAU,WAAW,WAAW;AAEtC,MAAI,CAAC,SAAS;AACN,UAAA,IAAI,MAAM,uDAAuD;AAAA,EACzE;AAEO,SAAA;AACT;"}

package/dist/esm/index.js

@@ -0,0 +1,17 @@
+import { FieldApi, FormApi, functionalUpdate, mergeForm } from "@tanstack/form-core";
+import { useForm } from "./useForm.js";
+import { Field, useField } from "./useField.js";
+import { createFormFactory } from "./createFormFactory.js";
+import { useTransform } from "./useTransform.js";
+export {
+  Field,
+  FieldApi,
+  FormApi,
+  createFormFactory,
+  functionalUpdate,
+  mergeForm,
+  useField,
+  useForm,
+  useTransform
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}