@tanstack/react-form 0.10.3 → 0.12.0

package/build/modern/useForm.d.ts

@@ -1,23 +0,0 @@
-import { FormState, FormOptions, FormApi } from '@tanstack/form-core';
-import { NoInfer } from '@tanstack/react-store';
-import { ReactNode } from 'react';
-import { FieldComponent, UseField } from './useField.js';
-import './types.js';
-
-declare module '@tanstack/form-core' {
-    interface FormApi<TFormData, ValidatorType> {
-        Provider: (props: {
-            children: any;
-        }) => any;
-        Field: FieldComponent<TFormData, ValidatorType>;
-        useField: UseField<TFormData>;
-        useStore: <TSelected = NoInfer<FormState<TFormData>>>(selector?: (state: NoInfer<FormState<TFormData>>) => TSelected) => TSelected;
-        Subscribe: <TSelected = NoInfer<FormState<TFormData>>>(props: {
-            selector?: (state: NoInfer<FormState<TFormData>>) => TSelected;
-            children: ((state: NoInfer<TSelected>) => ReactNode) | ReactNode;
-        }) => any;
-    }
-}
-declare function useForm<TData, FormValidator>(opts?: FormOptions<TData, FormValidator>): FormApi<TData, FormValidator>;
-
-export { useForm };

package/build/modern/useForm.js

@@ -1,38 +0,0 @@
-// src/useForm.tsx
-import { FormApi, functionalUpdate } from "@tanstack/form-core";
-import { useStore } from "@tanstack/react-store";
-import React, { useState } from "react";
-import { Field, useField } from "./useField.js";
-import { formContext } from "./formContext.js";
-import { useIsomorphicLayoutEffect } from "./useIsomorphicLayoutEffect.js";
-function useForm(opts) {
-  const [formApi] = useState(() => {
-    const api = new 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 useStore(api.store, selector);
-    };
-    api.Subscribe = (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);
-  useIsomorphicLayoutEffect(() => {
-    formApi.update(opts);
-  });
-  return formApi;
-}
-export {
-  useForm
-};
-//# sourceMappingURL=useForm.js.map

package/build/modern/useForm.js.map

@@ -1 +0,0 @@
-{"version":3,"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, { type ReactNode, useState } from 'react'\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, ValidatorType> {\n    Provider: (props: { children: any }) => any\n    Field: FieldComponent<TFormData, ValidatorType>\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    }) => any\n  }\n}\n\nexport function useForm<TData, FormValidator>(\n  opts?: FormOptions<TData, FormValidator>,\n): FormApi<TData, FormValidator> {\n  const [formApi] = useState(() => {\n    // @ts-ignore\n    const api = new FormApi<TData>(opts)\n\n    api.Provider = function Provider(props) {\n      useIsomorphicLayoutEffect(api.mount, [])\n      return <formContext.Provider {...props} value={{ formApi: api }} />\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"],"mappings":";AACA,SAAS,SAAS,wBAAwB;AAE1C,SAAS,gBAAgB;AACzB,OAAO,SAAyB,gBAAgB;AAChD,SAA6C,OAAO,gBAAgB;AACpE,SAAS,mBAAmB;AAC5B,SAAS,iCAAiC;AAkBnC,SAAS,QACd,MAC+B;AAC/B,QAAM,CAAC,OAAO,IAAI,SAAS,MAAM;AAE/B,UAAM,MAAM,IAAI,QAAe,IAAI;AAEnC,QAAI,WAAW,SAAS,SAAS,OAAO;AACtC,gCAA0B,IAAI,OAAO,CAAC,CAAC;AACvC,aAAO,oCAAC,YAAY,UAAZ,EAAsB,GAAG,OAAO,OAAO,EAAE,SAAS,IAAI,GAAG;AAAA,IACnE;AACA,QAAI,QAAQ;AACZ,QAAI,WAAW;AACf,QAAI,WAAW,CAEb,aACG;AAEH,aAAO,SAAS,IAAI,OAAc,QAAe;AAAA,IACnD;AACA,QAAI,YAAY,CAEd,UACG;AACH,aAAO;AAAA,QACL,MAAM;AAAA;AAAA,QAEN,SAAS,IAAI,OAAc,MAAM,QAAe;AAAA,MAClD;AAAA,IACF;AAEA,WAAO;AAAA,EACT,CAAC;AAED,UAAQ,SAAS,CAAC,UAAU,MAAM,YAAY;AAM9C,4BAA0B,MAAM;AAC9B,YAAQ,OAAO,IAAI;AAAA,EACrB,CAAC;AAED,SAAO;AACT;","names":[]}

package/build/modern/useIsomorphicLayoutEffect.cjs

@@ -1,35 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/useIsomorphicLayoutEffect.ts
-var useIsomorphicLayoutEffect_exports = {};
-__export(useIsomorphicLayoutEffect_exports, {
-  useIsomorphicLayoutEffect: () => useIsomorphicLayoutEffect
-});
-module.exports = __toCommonJS(useIsomorphicLayoutEffect_exports);
-var import_react = require("react");
-var useIsomorphicLayoutEffect = (
-  // @ts-ignore
-  typeof window !== "undefined" ? import_react.useLayoutEffect : import_react.useEffect
-);
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  useIsomorphicLayoutEffect
-});
-//# sourceMappingURL=useIsomorphicLayoutEffect.cjs.map

package/build/modern/useIsomorphicLayoutEffect.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/useIsomorphicLayoutEffect.ts"],"sourcesContent":["import { useEffect, useLayoutEffect } from 'react'\n\nexport const useIsomorphicLayoutEffect =\n  // @ts-ignore\n  typeof window !== 'undefined' ? useLayoutEffect : useEffect\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA2C;AAEpC,IAAM;AAAA;AAAA,EAEX,OAAO,WAAW,cAAc,+BAAkB;AAAA;","names":[]}

package/build/modern/useIsomorphicLayoutEffect.d.cts

@@ -1,5 +0,0 @@
-import { useLayoutEffect } from 'react';
-
-declare const useIsomorphicLayoutEffect: typeof useLayoutEffect;
-
-export { useIsomorphicLayoutEffect };

package/build/modern/useIsomorphicLayoutEffect.d.ts

@@ -1,5 +0,0 @@
-import { useLayoutEffect } from 'react';
-
-declare const useIsomorphicLayoutEffect: typeof useLayoutEffect;
-
-export { useIsomorphicLayoutEffect };

package/build/modern/useIsomorphicLayoutEffect.js

@@ -1,10 +0,0 @@
-// src/useIsomorphicLayoutEffect.ts
-import { useEffect, useLayoutEffect } from "react";
-var useIsomorphicLayoutEffect = (
-  // @ts-ignore
-  typeof window !== "undefined" ? useLayoutEffect : useEffect
-);
-export {
-  useIsomorphicLayoutEffect
-};
-//# sourceMappingURL=useIsomorphicLayoutEffect.js.map

package/build/modern/useIsomorphicLayoutEffect.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/useIsomorphicLayoutEffect.ts"],"sourcesContent":["import { useEffect, useLayoutEffect } from 'react'\n\nexport const useIsomorphicLayoutEffect =\n  // @ts-ignore\n  typeof window !== 'undefined' ? useLayoutEffect : useEffect\n"],"mappings":";AAAA,SAAS,WAAW,uBAAuB;AAEpC,IAAM;AAAA;AAAA,EAEX,OAAO,WAAW,cAAc,kBAAkB;AAAA;","names":[]}