@tanstack/solid-form 0.22.0 → 0.23.0

package/dist/{esm/createField.d.ts → createField.d.ts}

@@ -1,7 +1,7 @@
-import { FieldApi, DeepKeys, DeepValue, Narrow, Validator } from '@tanstack/form-core';
-import { JSXElement } from 'solid-js';
-import { CreateFieldOptions } from './types.js';
-
+import { FieldApi } from '@tanstack/form-core';
+import type { DeepKeys, DeepValue, Narrow, Validator } from '@tanstack/form-core';
+import type { JSXElement } from 'solid-js';
+import type { CreateFieldOptions } from './types';
 declare module '@tanstack/form-core' {
     interface FieldApi<TParentData, TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>> {
         Field: FieldComponent<TParentData, TFormValidator>;

package/dist/createField.jsx

@@ -0,0 +1,33 @@
+import { FieldApi } from '@tanstack/form-core';
+import { createComponent, createComputed, createMemo, createSignal, onCleanup, onMount, } from 'solid-js';
+// ugly way to trick solid into triggering updates for changes on the fieldApi
+function makeFieldReactive(fieldApi) {
+    const [flag, setFlag] = createSignal(false);
+    const fieldApiMemo = createMemo(() => [flag(), fieldApi]);
+    const unsubscribeStore = fieldApi.store.subscribe(() => setFlag((f) => !f));
+    onCleanup(unsubscribeStore);
+    return () => fieldApiMemo()[1];
+}
+export function createField(opts) {
+    const options = opts();
+    const fieldApi = new FieldApi(options);
+    fieldApi.Field = Field;
+    /**
+     * fieldApi.update should not have any side effects. Think of it like a `useRef`
+     * that we need to keep updated every render with the most up-to-date information.
+     *
+     * createComputed to make sure this effect runs before render effects
+     */
+    createComputed(() => fieldApi.update(opts()));
+    // Instantiates field meta and removes it when unrendered
+    onMount(() => onCleanup(fieldApi.mount()));
+    return makeFieldReactive(fieldApi);
+}
+export function Field(props) {
+    const fieldApi = createField(() => {
+        const { children, ...fieldOptions } = props;
+        return fieldOptions;
+    });
+    return <>{createComponent(() => props.children(fieldApi), {})}</>;
+}
+//# sourceMappingURL=createField.jsx.map

package/dist/createField.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"createField.jsx","sourceRoot":"","sources":["../src/createField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAA;AAC9C,OAAO,EACL,eAAe,EACf,cAAc,EACd,UAAU,EACV,YAAY,EACZ,SAAS,EACT,OAAO,GACR,MAAM,UAAU,CAAA;AAoDjB,8EAA8E;AAC9E,SAAS,iBAAiB,CACxB,QAAmB;IAEnB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,YAAY,CAAC,KAAK,CAAC,CAAA;IAC3C,MAAM,YAAY,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,CAAC,IAAI,EAAE,EAAE,QAAQ,CAAU,CAAC,CAAA;IAClE,MAAM,gBAAgB,GAAG,QAAQ,CAAC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;IAC3E,SAAS,CAAC,gBAAgB,CAAC,CAAA;IAC3B,OAAO,GAAG,EAAE,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CAAA;AAChC,CAAC;AAED,MAAM,UAAU,WAAW,CAWzB,IAMC;IAED,MAAM,OAAO,GAAG,IAAI,EAAE,CAAA;IAEtB,MAAM,QAAQ,GAAG,IAAI,QAAQ,CAAC,OAAO,CAAC,CAAA;IACtC,QAAQ,CAAC,KAAK,GAAG,KAAc,CAAA;IAE/B;;;;;OAKG;IACH,cAAc,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC,CAAC,CAAA;IAE7C,yDAAyD;IACzD,OAAO,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC,CAAC,CAAA;IAE1C,OAAO,iBAAiB,CAAC,QAAQ,CAAU,CAAA;AAC7C,CAAC;AA0DD,MAAM,UAAU,KAAK,CAWnB,KAgBC;IAED,MAAM,QAAQ,GAAG,WAAW,CAM1B,GAAG,EAAE;QACL,MAAM,EAAE,QAAQ,EAAE,GAAG,YAAY,EAAE,GAAG,KAAK,CAAA;QAC3C,OAAO,YAAY,CAAA;IACrB,CAAC,CAAC,CAAA;IAEF,OAAO,EAAE,CAAC,eAAe,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAA;AACnE,CAAC"}

package/dist/{esm/createForm.d.ts → createForm.d.ts}

@@ -1,7 +1,7 @@
-import { FormApi, FormOptions, FormState, Validator } from '@tanstack/form-core';
-import { JSXElement } from 'solid-js';
-import { CreateField, FieldComponent } from './createField.js';
-
+import { FormApi } from '@tanstack/form-core';
+import { type JSXElement } from 'solid-js';
+import { type CreateField, type FieldComponent } from './createField';
+import type { FormOptions, FormState, Validator } from '@tanstack/form-core';
 type NoInfer<T> = [T][T extends any ? 0 : never];
 declare module '@tanstack/form-core' {
     interface FormApi<TFormData, TFormValidator> {

package/dist/createForm.jsx

@@ -0,0 +1,22 @@
+import { FormApi, functionalUpdate } from '@tanstack/form-core';
+import { createComputed, onMount } from 'solid-js';
+import { useStore } from '@tanstack/solid-store';
+import { Field, createField, } from './createField';
+export function createForm(opts) {
+    const options = opts?.();
+    const formApi = new FormApi(options);
+    formApi.Field = (props) => <Field {...props} form={formApi}/>;
+    formApi.createField = (props) => createField(() => {
+        return { ...props(), form: formApi };
+    });
+    formApi.useStore = (selector) => useStore(formApi.store, selector);
+    formApi.Subscribe = (props) => functionalUpdate(props.children, useStore(formApi.store, props.selector));
+    onMount(formApi.mount);
+    /**
+     * formApi.update should not have any side effects. Think of it like a `useRef`
+     * that we need to keep updated every render with the most up-to-date information.
+     */
+    createComputed(() => formApi.update(opts?.()));
+    return formApi;
+}
+//# sourceMappingURL=createForm.jsx.map

package/dist/createForm.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"createForm.jsx","sourceRoot":"","sources":["../src/createForm.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAA;AAC/D,OAAO,EAAmB,cAAc,EAAE,OAAO,EAAE,MAAM,UAAU,CAAA;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAChD,OAAO,EAEL,KAAK,EAEL,WAAW,GACZ,MAAM,eAAe,CAAA;AAoBtB,MAAM,UAAU,UAAU,CAMxB,IAAqD;IAErD,MAAM,OAAO,GAAG,IAAI,EAAE,EAAE,CAAA;IACxB,MAAM,OAAO,GAAG,IAAI,OAAO,CAA8B,OAAO,CAAC,CAAA;IAEjE,OAAO,CAAC,KAAK,GAAG,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,EAAG,CAAA;IAC9D,OAAO,CAAC,WAAW,GAAG,CAAC,KAAK,EAAE,EAAE,CAC9B,WAAW,CAAC,GAAG,EAAE;QACf,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,CAAA;IACtC,CAAC,CAAC,CAAA;IACJ,OAAO,CAAC,QAAQ,GAAG,CAAC,QAAQ,EAAE,EAAE,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAA;IAClE,OAAO,CAAC,SAAS,GAAG,CAAC,KAAK,EAAE,EAAE,CAC5B,gBAAgB,CAAC,KAAK,CAAC,QAAQ,EAAE,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;IAE3E,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,CAAA;IAEtB;;;OAGG;IACH,cAAc,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAA;IAE9C,OAAO,OAAO,CAAA;AAChB,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export * from '@tanstack/form-core';
+export { createForm } from './createForm';
+export type { CreateField, FieldComponent } from './createField';
+export { createField, Field } from './createField';

package/dist/index.js

@@ -0,0 +1,4 @@
+export * from '@tanstack/form-core';
+export { createForm } from './createForm';
+export { createField, Field } from './createField';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAA;AAEnC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAGzC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA"}

package/dist/{esm/types.d.ts → types.d.ts}

@@ -1,5 +1,4 @@
-import { DeepKeys, DeepValue, FieldApiOptions, Validator } from '@tanstack/form-core';
-
+import type { DeepKeys, DeepValue, FieldApiOptions, Validator } from '@tanstack/form-core';
 export type CreateFieldOptions<TParentData, TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>> = FieldApiOptions<TParentData, TName, TFieldValidator, TFormValidator, TData> & {
     mode?: 'value' | 'array';
 };

package/dist/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/solid-form",
-  "version": "0.22.0",
+  "version": "0.23.0",
   "description": "Powerful, type-safe forms for Solid.",
   "author": "tannerlinsley",
   "license": "MIT",
@@ -16,18 +16,17 @@
     "src"
   ],
   "type": "module",
-  "types": "dist/esm/index.d.ts",
-  "main": "dist/cjs/index.cjs",
-  "module": "dist/esm/index.js",
+  "types": "dist/index.d.ts",
+  "module": "dist/index.js",
   "exports": {
     ".": {
-      "import": {
-        "types": "./dist/esm/index.d.ts",
-        "default": "./dist/esm/index.js"
+      "solid": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
       },
-      "require": {
-        "types": "./dist/cjs/index.d.cts",
-        "default": "./dist/cjs/index.cjs"
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
       }
     },
     "./package.json": "./package.json"
@@ -39,7 +38,7 @@
   },
   "dependencies": {
     "@tanstack/solid-store": "^0.4.1",
-    "@tanstack/form-core": "0.22.0"
+    "@tanstack/form-core": "0.23.0"
   },
   "peerDependencies": {
     "solid-js": "^1.6.0"

package/src/index.ts

@@ -1,27 +1,6 @@
-export type {
-  DeepKeys,
-  DeepValue,
-  FieldApiOptions,
-  FieldInfo,
-  FieldMeta,
-  FieldOptions,
-  FieldState,
-  FormOptions,
-  FormState,
-  RequiredByKey,
-  Updater,
-  UpdaterFn,
-  ValidationCause,
-  ValidationError,
-  ValidationMeta,
-} from '@tanstack/form-core'
-
-export { FormApi, FieldApi, functionalUpdate } from '@tanstack/form-core'
+export * from '@tanstack/form-core'
 
 export { createForm } from './createForm'
 
 export type { CreateField, FieldComponent } from './createField'
 export { createField, Field } from './createField'
-
-export type { FormFactory } from './createFormFactory'
-export { createFormFactory } from './createFormFactory'

package/src/tests/createField.test.tsx

@@ -3,7 +3,7 @@ import { render, waitFor } from '@solidjs/testing-library'
 import userEvent from '@testing-library/user-event'
 import '@testing-library/jest-dom/vitest'
 import { Index, Show, createEffect } from 'solid-js'
-import { createForm, createFormFactory } from '../index'
+import { createForm } from '../index'
 import { sleep } from './utils'
 
 const user = userEvent.setup()
@@ -15,10 +15,8 @@ describe('createField', () => {
       lastName: string
     }
 
-    const formFactory = createFormFactory<Person>()
-
     function Comp() {
-      const form = formFactory.createForm()
+      const form = createForm<Person>()
 
       return (
         <>
@@ -51,10 +49,8 @@ describe('createField', () => {
       lastName: string
     }
 
-    const formFactory = createFormFactory<Person>()
-
     function Comp() {
-      const form = formFactory.createForm(() => ({
+      const form = createForm<Person>(() => ({
         defaultValues: {
           firstName: 'FirstName',
           lastName: 'LastName',
@@ -93,10 +89,8 @@ describe('createField', () => {
     }
     const error = 'Please enter a different value'
 
-    const formFactory = createFormFactory<Person>()
-
     function Comp() {
-      const form = formFactory.createForm()
+      const form = createForm<Person>()
 
       return (
         <>
@@ -136,10 +130,8 @@ describe('createField', () => {
     }
     const error = 'Please enter a different value'
 
-    const formFactory = createFormFactory<Person>()
-
     function Comp() {
-      const form = formFactory.createForm()
+      const form = createForm<Person>()
 
       return (
         <>
@@ -184,10 +176,8 @@ describe('createField', () => {
     const onChangeError = 'Please enter a different value (onChangeError)'
     const onBlurError = 'Please enter a different value (onBlurError)'
 
-    const formFactory = createFormFactory<Person>()
-
     function Comp() {
-      const form = formFactory.createForm()
+      const form = createForm<Person>()
 
       return (
         <>
@@ -235,10 +225,8 @@ describe('createField', () => {
     }
     const error = 'Please enter a different value'
 
-    const formFactory = createFormFactory<Person>()
-
     function Comp() {
-      const form = formFactory.createForm()
+      const form = createForm<Person>()
 
       return (
         <>
@@ -284,10 +272,8 @@ describe('createField', () => {
     const onChangeError = 'Please enter a different value (onChangeError)'
     const onBlurError = 'Please enter a different value (onBlurError)'
 
-    const formFactory = createFormFactory<Person>()
-
     function Comp() {
-      const form = formFactory.createForm()
+      const form = createForm<Person>()
 
       return (
         <>
@@ -342,10 +328,9 @@ describe('createField', () => {
     }
     const mockFn = vi.fn()
     const error = 'Please enter a different value'
-    const formFactory = createFormFactory<Person>()
 
     function Comp() {
-      const form = formFactory.createForm()
+      const form = createForm<Person>()
 
       return (
         <>

package/src/tests/createForm.test.tsx

@@ -2,7 +2,7 @@ import { describe, expect, it, vi } from 'vitest'
 import { render, screen, waitFor } from '@solidjs/testing-library'
 import userEvent from '@testing-library/user-event'
 import { Show, createSignal, onCleanup } from 'solid-js'
-import { createForm, createFormFactory } from '../index'
+import { createForm } from '../index'
 import { sleep } from './utils'
 import type { ValidationErrorMap } from '@tanstack/form-core'
 
@@ -15,10 +15,8 @@ describe('createForm', () => {
       lastName: string
     }
 
-    const formFactory = createFormFactory<Person>()
-
     function Comp() {
-      const form = formFactory.createForm()
+      const form = createForm<Person>()
       return (
         <>
           <form.Field
@@ -50,14 +48,12 @@ describe('createForm', () => {
       lastName: string
     }
 
-    const formFactory = createFormFactory<Person>()
-
     function Comp() {
-      const form = formFactory.createForm(() => ({
+      const form = createForm(() => ({
         defaultValues: {
           firstName: 'FirstName',
           lastName: 'LastName',
-        },
+        } as Person,
       }))
 
       return (
@@ -159,10 +155,8 @@ describe('createForm', () => {
     }
     const error = 'Please enter a different value'
 
-    const formFactory = createFormFactory<Person>()
-
     function Comp() {
-      const form = formFactory.createForm(() => ({
+      const form = createForm<Person>(() => ({
         validators: {
           onChange: ({ value }) =>
             value.firstName.includes('other') ? error : undefined,
@@ -205,10 +199,8 @@ describe('createForm', () => {
     }
     const error = 'Please enter a different value'
 
-    const formFactory = createFormFactory<Person>()
-
     function Comp() {
-      const form = formFactory.createForm(() => ({
+      const form = createForm<Person>(() => ({
         validators: {
           onChange: ({ value }) =>
             value.firstName.includes('other') ? error : undefined,
@@ -257,10 +249,8 @@ describe('createForm', () => {
     const onChangeError = 'Please enter a different value (onChangeError)'
     const onBlurError = 'Please enter a different value (onBlurError)'
 
-    const formFactory = createFormFactory<Person>()
-
     function Comp() {
-      const form = formFactory.createForm(() => ({
+      const form = createForm<Person>(() => ({
         validators: {
           onChange: ({ value }) =>
             value.firstName.includes('other') ? onChangeError : undefined,
@@ -312,10 +302,8 @@ describe('createForm', () => {
     }
     const error = 'Please enter a different value'
 
-    const formFactory = createFormFactory<Person>()
-
     function Comp() {
-      const form = formFactory.createForm(() => ({
+      const form = createForm<Person>(() => ({
         validators: {
           onChangeAsync: async () => {
             await sleep(10)
@@ -365,10 +353,8 @@ describe('createForm', () => {
     const onChangeError = 'Please enter a different value (onChangeError)'
     const onBlurError = 'Please enter a different value (onBlurError)'
 
-    const formFactory = createFormFactory<Person>()
-
     function Comp() {
-      const form = formFactory.createForm(() => ({
+      const form = createForm<Person>(() => ({
         validators: {
           async onChangeAsync() {
             await sleep(10)
@@ -427,10 +413,9 @@ describe('createForm', () => {
     }
     const mockFn = vi.fn()
     const error = 'Please enter a different value'
-    const formFactory = createFormFactory<Person>()
 
     function Comp() {
-      const form = formFactory.createForm(() => ({
+      const form = createForm<Person>(() => ({
         validators: {
           onChangeAsyncDebounceMs: 100,
           onChangeAsync: async () => {

package/dist/cjs/createField.cjs

@@ -1,33 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const web = require("solid-js/web");
-const formCore = require("@tanstack/form-core");
-const solidJs = require("solid-js");
-function makeFieldReactive(fieldApi) {
-  const [flag, setFlag] = solidJs.createSignal(false);
-  const fieldApiMemo = solidJs.createMemo(() => [flag(), fieldApi]);
-  const unsubscribeStore = fieldApi.store.subscribe(() => setFlag((f) => !f));
-  solidJs.onCleanup(unsubscribeStore);
-  return () => fieldApiMemo()[1];
-}
-function createField(opts) {
-  const options = opts();
-  const fieldApi = new formCore.FieldApi(options);
-  fieldApi.Field = Field;
-  solidJs.createComputed(() => fieldApi.update(opts()));
-  solidJs.onMount(() => solidJs.onCleanup(fieldApi.mount()));
-  return makeFieldReactive(fieldApi);
-}
-function Field(props) {
-  const fieldApi = createField(() => {
-    const {
-      children,
-      ...fieldOptions
-    } = props;
-    return fieldOptions;
-  });
-  return web.memo(() => solidJs.createComponent(() => props.children(fieldApi), {}));
-}
-exports.Field = Field;
-exports.createField = createField;
-//# sourceMappingURL=createField.cjs.map

package/dist/cjs/createField.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"createField.cjs","sources":["../../src/createField.tsx"],"sourcesContent":["import { FieldApi } from '@tanstack/form-core'\nimport {\n  createComponent,\n  createComputed,\n  createMemo,\n  createSignal,\n  onCleanup,\n  onMount,\n} from 'solid-js'\n\nimport type {\n  DeepKeys,\n  DeepValue,\n  Narrow,\n  Validator,\n} from '@tanstack/form-core'\nimport type { JSXElement } from 'solid-js'\nimport type { CreateFieldOptions } from './types'\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 CreateField<\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  opts: () => { name: Narrow<TName> } & Omit<\n    CreateFieldOptions<\n      TParentData,\n      TName,\n      TFieldValidator,\n      TFormValidator,\n      TData\n    >,\n    'form'\n  >,\n) => () => FieldApi<TParentData, TName, TFieldValidator, TFormValidator, TData>\n\n// ugly way to trick solid into triggering updates for changes on the fieldApi\nfunction makeFieldReactive<FieldApiT extends FieldApi<any, any, any, any>>(\n  fieldApi: FieldApiT,\n): () => FieldApiT {\n  const [flag, setFlag] = createSignal(false)\n  const fieldApiMemo = createMemo(() => [flag(), fieldApi] as const)\n  const unsubscribeStore = fieldApi.store.subscribe(() => setFlag((f) => !f))\n  onCleanup(unsubscribeStore)\n  return () => fieldApiMemo()[1]\n}\n\nexport function createField<\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  opts: () => CreateFieldOptions<\n    TParentData,\n    TName,\n    TFieldValidator,\n    TFormValidator,\n    TData\n  >,\n): () => FieldApi<TParentData, TName, TFieldValidator, TFormValidator, TData> {\n  const options = opts()\n\n  const fieldApi = new FieldApi(options)\n  fieldApi.Field = Field as never\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   * createComputed to make sure this effect runs before render effects\n   */\n  createComputed(() => fieldApi.update(opts()))\n\n  // Instantiates field meta and removes it when unrendered\n  onMount(() => onCleanup(fieldApi.mount()))\n\n  return makeFieldReactive(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  ) => JSXElement\n} & Omit<\n  CreateFieldOptions<\n    TParentData,\n    TName,\n    TFieldValidator,\n    TFormValidator,\n    TData\n  >,\n  'form'\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}: Omit<\n  FieldComponentProps<\n    TParentData,\n    TName,\n    TFieldValidator,\n    TFormValidator,\n    TData\n  >,\n  'form'\n>) => JSXElement\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  TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>,\n>(\n  props: {\n    children: (\n      fieldApi: () => FieldApi<\n        TParentData,\n        TName,\n        TFieldValidator,\n        TFormValidator,\n        TData\n      >,\n    ) => JSXElement\n  } & CreateFieldOptions<\n    TParentData,\n    TName,\n    TFieldValidator,\n    TFormValidator,\n    TData\n  >,\n) {\n  const fieldApi = createField<\n    TParentData,\n    TName,\n    TFieldValidator,\n    TFormValidator,\n    TData\n  >(() => {\n    const { children, ...fieldOptions } = props\n    return fieldOptions\n  })\n\n  return <>{createComponent(() => props.children(fieldApi), {})}</>\n}\n"],"names":["makeFieldReactive","fieldApi","flag","setFlag","createSignal","fieldApiMemo","createMemo","unsubscribeStore","store","subscribe","f","onCleanup","createField","opts","options","FieldApi","Field","createComputed","update","onMount","mount","props","children","fieldOptions","_$memo","createComponent"],"mappings":";;;;;AA6DA,SAASA,kBACPC,UACiB;AACjB,QAAM,CAACC,MAAMC,OAAO,IAAIC,qBAAa,KAAK;AAC1C,QAAMC,eAAeC,QAAAA,WAAW,MAAM,CAACJ,KAAK,GAAGD,QAAQ,CAAW;AAC5DM,QAAAA,mBAAmBN,SAASO,MAAMC,UAAU,MAAMN,QAASO,CAAAA,MAAM,CAACA,CAAC,CAAC;AAC1EC,UAAAA,UAAUJ,gBAAgB;AACnB,SAAA,MAAMF,eAAe,CAAC;AAC/B;AAEO,SAASO,YAWdC,MAO4E;AAC5E,QAAMC,UAAUD;AAEVZ,QAAAA,WAAW,IAAIc,kBAASD,OAAO;AACrCb,WAASe,QAAQA;AAQjBC,UAAAA,eAAe,MAAMhB,SAASiB,OAAOL,KAAAA,CAAM,CAAC;AAG5CM,UAAAA,QAAQ,MAAMR,QAAAA,UAAUV,SAASmB,MAAAA,CAAO,CAAC;AAEzC,SAAOpB,kBAAkBC,QAAQ;AACnC;AA0DO,SAASe,MAWdK,OAiBA;AACMpB,QAAAA,WAAWW,YAMf,MAAM;AACA,UAAA;AAAA,MAAEU;AAAAA,MAAU,GAAGC;AAAAA,IAAiBF,IAAAA;AAC/BE,WAAAA;AAAAA,EAAAA,CACR;AAEDC,SAAAA,IAAAA,KAAA,MAAUC,QAAAA,gBAAgB,MAAMJ,MAAMC,SAASrB,QAAQ,GAAG,CAAE,CAAA,CAAC;AAC/D;;;"}

package/dist/cjs/createField.d.cts

@@ -1,21 +0,0 @@
-import { FieldApi, DeepKeys, DeepValue, Narrow, Validator } from '@tanstack/form-core';
-import { JSXElement } from 'solid-js';
-import { CreateFieldOptions } from './types.cjs';
-
-declare module '@tanstack/form-core' {
-    interface FieldApi<TParentData, TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>> {
-        Field: FieldComponent<TParentData, TFormValidator>;
-    }
-}
-export type CreateField<TParentData, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined> = <TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>>(opts: () => {
-    name: Narrow<TName>;
-} & Omit<CreateFieldOptions<TParentData, TName, TFieldValidator, TFormValidator, TData>, 'form'>) => () => FieldApi<TParentData, TName, TFieldValidator, TFormValidator, TData>;
-export declare function createField<TParentData, TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>>(opts: () => CreateFieldOptions<TParentData, TName, TFieldValidator, TFormValidator, TData>): () => FieldApi<TParentData, TName, TFieldValidator, TFormValidator, TData>;
-type FieldComponentProps<TParentData, TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>> = {
-    children: (fieldApi: () => FieldApi<TParentData, TName, TFieldValidator, TFormValidator, TData>) => JSXElement;
-} & Omit<CreateFieldOptions<TParentData, TName, TFieldValidator, TFormValidator, TData>, 'form'>;
-export type FieldComponent<TParentData, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined> = <TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>>({ children, ...fieldOptions }: Omit<FieldComponentProps<TParentData, TName, TFieldValidator, TFormValidator, TData>, 'form'>) => JSXElement;
-export declare function Field<TParentData, TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>>(props: {
-    children: (fieldApi: () => FieldApi<TParentData, TName, TFieldValidator, TFormValidator, TData>) => JSXElement;
-} & CreateFieldOptions<TParentData, TName, TFieldValidator, TFormValidator, TData>): import("solid-js").JSX.Element;
-export {};

package/dist/cjs/createForm.cjs

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const web = require("solid-js/web");
-const formCore = require("@tanstack/form-core");
-const solidJs = require("solid-js");
-const solidStore = require("@tanstack/solid-store");
-const createField = require("./createField.cjs");
-function createForm(opts) {
-  const options = opts == null ? void 0 : opts();
-  const formApi = new formCore.FormApi(options);
-  formApi.Field = (props) => web.createComponent(createField.Field, web.mergeProps(props, {
-    form: formApi
-  }));
-  formApi.createField = (props) => createField.createField(() => {
-    return {
-      ...props(),
-      form: formApi
-    };
-  });
-  formApi.useStore = (selector) => solidStore.useStore(formApi.store, selector);
-  formApi.Subscribe = (props) => formCore.functionalUpdate(props.children, solidStore.useStore(formApi.store, props.selector));
-  solidJs.onMount(formApi.mount);
-  solidJs.createComputed(() => formApi.update(opts == null ? void 0 : opts()));
-  return formApi;
-}
-exports.createForm = createForm;
-//# sourceMappingURL=createForm.cjs.map

package/dist/cjs/createForm.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"createForm.cjs","sources":["../../src/createForm.tsx"],"sourcesContent":["import { FormApi, functionalUpdate } from '@tanstack/form-core'\nimport { type JSXElement, createComputed, onMount } from 'solid-js'\nimport { useStore } from '@tanstack/solid-store'\nimport {\n  type CreateField,\n  Field,\n  type FieldComponent,\n  createField,\n} from './createField'\nimport type { FormOptions, FormState, Validator } from '@tanstack/form-core'\n\ntype NoInfer<T> = [T][T extends any ? 0 : never]\n\ndeclare module '@tanstack/form-core' {\n  // eslint-disable-next-line no-shadow\n  interface FormApi<TFormData, TFormValidator> {\n    Field: FieldComponent<TFormData, TFormValidator>\n    createField: CreateField<TFormData, TFormValidator>\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>) => JSXElement) | JSXElement\n    }) => JSXElement\n  }\n}\n\nexport function createForm<\n  TParentData,\n  TFormValidator extends\n    | Validator<TParentData, unknown>\n    | undefined = undefined,\n>(\n  opts?: () => FormOptions<TParentData, TFormValidator>,\n): FormApi<TParentData, TFormValidator> {\n  const options = opts?.()\n  const formApi = new FormApi<TParentData, TFormValidator>(options)\n\n  formApi.Field = (props) => <Field {...props} form={formApi} />\n  formApi.createField = (props) =>\n    createField(() => {\n      return { ...props(), form: formApi }\n    })\n  formApi.useStore = (selector) => useStore(formApi.store, selector)\n  formApi.Subscribe = (props) =>\n    functionalUpdate(props.children, useStore(formApi.store, props.selector))\n\n  onMount(formApi.mount)\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  createComputed(() => formApi.update(opts?.()))\n\n  return formApi\n}\n"],"names":["createForm","opts","options","formApi","FormApi","Field","props","_$createComponent","_$mergeProps","form","createField","useStore","selector","store","Subscribe","functionalUpdate","children","onMount","mount","createComputed","update"],"mappings":";;;;;;;AA4BO,SAASA,WAMdC,MACsC;AACtC,QAAMC,UAAUD;AACVE,QAAAA,UAAU,IAAIC,iBAAqCF,OAAO;AAEhEC,UAAQE,QAASC,CAAAA,UAAKC,IAAMF,gBAAAA,YAAAA,OAAKG,eAAKF,OAAK;AAAA,IAAEG,MAAMN;AAAAA,EAAW,CAAA,CAAA;AACtDO,UAAAA,cAAeJ,CACrBI,UAAAA,YAAAA,YAAY,MAAM;AACT,WAAA;AAAA,MAAE,GAAGJ,MAAM;AAAA,MAAGG,MAAMN;AAAAA,IAAAA;AAAAA,EAAQ,CACpC;AACHA,UAAQQ,WAAYC,CAAAA,aAAaD,WAASR,SAAAA,QAAQU,OAAOD,QAAQ;AACzDE,UAAAA,YAAaR,CACnBS,UAAAA,SAAAA,iBAAiBT,MAAMU,UAAUL,oBAASR,QAAQU,OAAOP,MAAMM,QAAQ,CAAC;AAE1EK,kBAAQd,QAAQe,KAAK;AAMrBC,UAAAA,eAAe,MAAMhB,QAAQiB,OAAOnB,8BAAQ,CAAC;AAEtCE,SAAAA;AACT;;"}

package/dist/cjs/createForm.d.cts

@@ -1,18 +0,0 @@
-import { FormApi, FormOptions, FormState, Validator } from '@tanstack/form-core';
-import { JSXElement } from 'solid-js';
-import { CreateField, FieldComponent } from './createField.cjs';
-
-type NoInfer<T> = [T][T extends any ? 0 : never];
-declare module '@tanstack/form-core' {
-    interface FormApi<TFormData, TFormValidator> {
-        Field: FieldComponent<TFormData, TFormValidator>;
-        createField: CreateField<TFormData, TFormValidator>;
-        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>) => JSXElement) | JSXElement;
-        }) => JSXElement;
-    }
-}
-export declare function createForm<TParentData, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined>(opts?: () => FormOptions<TParentData, TFormValidator>): FormApi<TParentData, TFormValidator>;
-export {};

package/dist/cjs/createFormFactory.cjs

@@ -1,16 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const solidJs = require("solid-js");
-const createField = require("./createField.cjs");
-const createForm = require("./createForm.cjs");
-function createFormFactory(defaultOpts) {
-  return {
-    createForm: (opts) => createForm.createForm(
-      () => solidJs.mergeProps((defaultOpts == null ? void 0 : defaultOpts()) ?? {}, (opts == null ? void 0 : opts()) ?? {})
-    ),
-    createField: createField.createField,
-    Field: createField.Field
-  };
-}
-exports.createFormFactory = createFormFactory;
-//# sourceMappingURL=createFormFactory.cjs.map

package/dist/cjs/createFormFactory.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"createFormFactory.cjs","sources":["../../src/createFormFactory.ts"],"sourcesContent":["import { mergeProps } from 'solid-js'\nimport {\n  type CreateField,\n  Field,\n  type FieldComponent,\n  createField,\n} from './createField'\nimport { createForm } from './createForm'\nimport type { FormApi, FormOptions, Validator } from '@tanstack/form-core'\n\nexport type FormFactory<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n> = {\n  createForm: (\n    opts?: () => FormOptions<TFormData, TFormValidator>,\n  ) => FormApi<TFormData, TFormValidator>\n  createField: typeof createField\n  Field: typeof Field\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    createForm: (opts) =>\n      createForm<TFormData, TFormValidator>(() =>\n        mergeProps(defaultOpts?.() ?? {}, opts?.() ?? {}),\n      ),\n    createField,\n    Field: Field,\n  }\n}\n"],"names":["createForm","mergeProps","createField","Field"],"mappings":";;;;;AAqBO,SAAS,kBAId,aACwC;AACjC,SAAA;AAAA,IACL,YAAY,CAAC,SACXA,WAAA;AAAA,MAAsC,MACpCC,QAAAA,YAAW,iDAAmB,CAAI,IAAA,mCAAY,CAAA,CAAE;AAAA,IAClD;AAAA,IAAA,aACFC,YAAA;AAAA,IAAA,OACAC,YAAA;AAAA,EAAA;AAEJ;;"}

package/dist/cjs/createFormFactory.d.cts

@@ -1,9 +0,0 @@
-import { Field, createField } from './createField.cjs';
-import { FormApi, FormOptions, Validator } from '@tanstack/form-core';
-
-export type FormFactory<TFormData, TFormValidator extends Validator<TFormData, unknown> | undefined = undefined> = {
-    createForm: (opts?: () => FormOptions<TFormData, TFormValidator>) => FormApi<TFormData, TFormValidator>;
-    createField: typeof createField;
-    Field: typeof Field;
-};
-export declare function createFormFactory<TFormData, TFormValidator extends Validator<TFormData, unknown> | undefined = undefined>(defaultOpts?: () => FormOptions<TFormData, TFormValidator>): FormFactory<TFormData, TFormValidator>;

package/dist/cjs/index.cjs

@@ -1,23 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const formCore = require("@tanstack/form-core");
-const createForm = require("./createForm.cjs");
-const createField = require("./createField.cjs");
-const createFormFactory = require("./createFormFactory.cjs");
-Object.defineProperty(exports, "FieldApi", {
-  enumerable: true,
-  get: () => formCore.FieldApi
-});
-Object.defineProperty(exports, "FormApi", {
-  enumerable: true,
-  get: () => formCore.FormApi
-});
-Object.defineProperty(exports, "functionalUpdate", {
-  enumerable: true,
-  get: () => formCore.functionalUpdate
-});
-exports.createForm = createForm.createForm;
-exports.Field = createField.Field;
-exports.createField = createField.createField;
-exports.createFormFactory = createFormFactory.createFormFactory;
-//# sourceMappingURL=index.cjs.map

package/dist/cjs/index.cjs.map

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

package/dist/cjs/index.d.cts

@@ -1,7 +0,0 @@
-export type { DeepKeys, DeepValue, FieldApiOptions, FieldInfo, FieldMeta, FieldOptions, FieldState, FormOptions, FormState, RequiredByKey, Updater, UpdaterFn, ValidationCause, ValidationError, ValidationMeta, } from '@tanstack/form-core';
-export { FormApi, FieldApi, functionalUpdate } from '@tanstack/form-core';
-export { createForm } from './createForm.cjs';
-export type { CreateField, FieldComponent } from './createField.cjs';
-export { createField, Field } from './createField.cjs';
-export type { FormFactory } from './createFormFactory.cjs';
-export { createFormFactory } from './createFormFactory.cjs';

package/dist/cjs/types.d.cts

@@ -1,5 +0,0 @@
-import { DeepKeys, DeepValue, FieldApiOptions, Validator } from '@tanstack/form-core';
-
-export type CreateFieldOptions<TParentData, TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>> = FieldApiOptions<TParentData, TName, TFieldValidator, TFormValidator, TData> & {
-    mode?: 'value' | 'array';
-};

package/dist/esm/createField.js

@@ -1,33 +0,0 @@
-import { memo } from "solid-js/web";
-import { FieldApi } from "@tanstack/form-core";
-import { createComputed, onMount, onCleanup, createComponent, createSignal, createMemo } from "solid-js";
-function makeFieldReactive(fieldApi) {
-  const [flag, setFlag] = createSignal(false);
-  const fieldApiMemo = createMemo(() => [flag(), fieldApi]);
-  const unsubscribeStore = fieldApi.store.subscribe(() => setFlag((f) => !f));
-  onCleanup(unsubscribeStore);
-  return () => fieldApiMemo()[1];
-}
-function createField(opts) {
-  const options = opts();
-  const fieldApi = new FieldApi(options);
-  fieldApi.Field = Field;
-  createComputed(() => fieldApi.update(opts()));
-  onMount(() => onCleanup(fieldApi.mount()));
-  return makeFieldReactive(fieldApi);
-}
-function Field(props) {
-  const fieldApi = createField(() => {
-    const {
-      children,
-      ...fieldOptions
-    } = props;
-    return fieldOptions;
-  });
-  return memo(() => createComponent(() => props.children(fieldApi), {}));
-}
-export {
-  Field,
-  createField
-};
-//# sourceMappingURL=createField.js.map

package/dist/esm/createField.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"createField.js","sources":["../../src/createField.tsx"],"sourcesContent":["import { FieldApi } from '@tanstack/form-core'\nimport {\n  createComponent,\n  createComputed,\n  createMemo,\n  createSignal,\n  onCleanup,\n  onMount,\n} from 'solid-js'\n\nimport type {\n  DeepKeys,\n  DeepValue,\n  Narrow,\n  Validator,\n} from '@tanstack/form-core'\nimport type { JSXElement } from 'solid-js'\nimport type { CreateFieldOptions } from './types'\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 CreateField<\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  opts: () => { name: Narrow<TName> } & Omit<\n    CreateFieldOptions<\n      TParentData,\n      TName,\n      TFieldValidator,\n      TFormValidator,\n      TData\n    >,\n    'form'\n  >,\n) => () => FieldApi<TParentData, TName, TFieldValidator, TFormValidator, TData>\n\n// ugly way to trick solid into triggering updates for changes on the fieldApi\nfunction makeFieldReactive<FieldApiT extends FieldApi<any, any, any, any>>(\n  fieldApi: FieldApiT,\n): () => FieldApiT {\n  const [flag, setFlag] = createSignal(false)\n  const fieldApiMemo = createMemo(() => [flag(), fieldApi] as const)\n  const unsubscribeStore = fieldApi.store.subscribe(() => setFlag((f) => !f))\n  onCleanup(unsubscribeStore)\n  return () => fieldApiMemo()[1]\n}\n\nexport function createField<\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  opts: () => CreateFieldOptions<\n    TParentData,\n    TName,\n    TFieldValidator,\n    TFormValidator,\n    TData\n  >,\n): () => FieldApi<TParentData, TName, TFieldValidator, TFormValidator, TData> {\n  const options = opts()\n\n  const fieldApi = new FieldApi(options)\n  fieldApi.Field = Field as never\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   * createComputed to make sure this effect runs before render effects\n   */\n  createComputed(() => fieldApi.update(opts()))\n\n  // Instantiates field meta and removes it when unrendered\n  onMount(() => onCleanup(fieldApi.mount()))\n\n  return makeFieldReactive(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  ) => JSXElement\n} & Omit<\n  CreateFieldOptions<\n    TParentData,\n    TName,\n    TFieldValidator,\n    TFormValidator,\n    TData\n  >,\n  'form'\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}: Omit<\n  FieldComponentProps<\n    TParentData,\n    TName,\n    TFieldValidator,\n    TFormValidator,\n    TData\n  >,\n  'form'\n>) => JSXElement\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  TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>,\n>(\n  props: {\n    children: (\n      fieldApi: () => FieldApi<\n        TParentData,\n        TName,\n        TFieldValidator,\n        TFormValidator,\n        TData\n      >,\n    ) => JSXElement\n  } & CreateFieldOptions<\n    TParentData,\n    TName,\n    TFieldValidator,\n    TFormValidator,\n    TData\n  >,\n) {\n  const fieldApi = createField<\n    TParentData,\n    TName,\n    TFieldValidator,\n    TFormValidator,\n    TData\n  >(() => {\n    const { children, ...fieldOptions } = props\n    return fieldOptions\n  })\n\n  return <>{createComponent(() => props.children(fieldApi), {})}</>\n}\n"],"names":["makeFieldReactive","fieldApi","flag","setFlag","createSignal","fieldApiMemo","createMemo","unsubscribeStore","store","subscribe","f","onCleanup","createField","opts","options","FieldApi","Field","createComputed","update","onMount","mount","props","children","fieldOptions","_$memo","createComponent"],"mappings":";;;AA6DA,SAASA,kBACPC,UACiB;AACjB,QAAM,CAACC,MAAMC,OAAO,IAAIC,aAAa,KAAK;AAC1C,QAAMC,eAAeC,WAAW,MAAM,CAACJ,KAAK,GAAGD,QAAQ,CAAW;AAC5DM,QAAAA,mBAAmBN,SAASO,MAAMC,UAAU,MAAMN,QAASO,CAAAA,MAAM,CAACA,CAAC,CAAC;AAC1EC,YAAUJ,gBAAgB;AACnB,SAAA,MAAMF,eAAe,CAAC;AAC/B;AAEO,SAASO,YAWdC,MAO4E;AAC5E,QAAMC,UAAUD;AAEVZ,QAAAA,WAAW,IAAIc,SAASD,OAAO;AACrCb,WAASe,QAAQA;AAQjBC,iBAAe,MAAMhB,SAASiB,OAAOL,KAAAA,CAAM,CAAC;AAG5CM,UAAQ,MAAMR,UAAUV,SAASmB,MAAAA,CAAO,CAAC;AAEzC,SAAOpB,kBAAkBC,QAAQ;AACnC;AA0DO,SAASe,MAWdK,OAiBA;AACMpB,QAAAA,WAAWW,YAMf,MAAM;AACA,UAAA;AAAA,MAAEU;AAAAA,MAAU,GAAGC;AAAAA,IAAiBF,IAAAA;AAC/BE,WAAAA;AAAAA,EAAAA,CACR;AAEDC,SAAAA,KAAA,MAAUC,gBAAgB,MAAMJ,MAAMC,SAASrB,QAAQ,GAAG,CAAE,CAAA,CAAC;AAC/D;"}

package/dist/esm/createForm.js

@@ -1,27 +0,0 @@
-import { createComponent, mergeProps } from "solid-js/web";
-import { FormApi, functionalUpdate } from "@tanstack/form-core";
-import { onMount, createComputed } from "solid-js";
-import { useStore } from "@tanstack/solid-store";
-import { Field, createField } from "./createField.js";
-function createForm(opts) {
-  const options = opts == null ? void 0 : opts();
-  const formApi = new FormApi(options);
-  formApi.Field = (props) => createComponent(Field, mergeProps(props, {
-    form: formApi
-  }));
-  formApi.createField = (props) => createField(() => {
-    return {
-      ...props(),
-      form: formApi
-    };
-  });
-  formApi.useStore = (selector) => useStore(formApi.store, selector);
-  formApi.Subscribe = (props) => functionalUpdate(props.children, useStore(formApi.store, props.selector));
-  onMount(formApi.mount);
-  createComputed(() => formApi.update(opts == null ? void 0 : opts()));
-  return formApi;
-}
-export {
-  createForm
-};
-//# sourceMappingURL=createForm.js.map

package/dist/esm/createForm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"createForm.js","sources":["../../src/createForm.tsx"],"sourcesContent":["import { FormApi, functionalUpdate } from '@tanstack/form-core'\nimport { type JSXElement, createComputed, onMount } from 'solid-js'\nimport { useStore } from '@tanstack/solid-store'\nimport {\n  type CreateField,\n  Field,\n  type FieldComponent,\n  createField,\n} from './createField'\nimport type { FormOptions, FormState, Validator } from '@tanstack/form-core'\n\ntype NoInfer<T> = [T][T extends any ? 0 : never]\n\ndeclare module '@tanstack/form-core' {\n  // eslint-disable-next-line no-shadow\n  interface FormApi<TFormData, TFormValidator> {\n    Field: FieldComponent<TFormData, TFormValidator>\n    createField: CreateField<TFormData, TFormValidator>\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>) => JSXElement) | JSXElement\n    }) => JSXElement\n  }\n}\n\nexport function createForm<\n  TParentData,\n  TFormValidator extends\n    | Validator<TParentData, unknown>\n    | undefined = undefined,\n>(\n  opts?: () => FormOptions<TParentData, TFormValidator>,\n): FormApi<TParentData, TFormValidator> {\n  const options = opts?.()\n  const formApi = new FormApi<TParentData, TFormValidator>(options)\n\n  formApi.Field = (props) => <Field {...props} form={formApi} />\n  formApi.createField = (props) =>\n    createField(() => {\n      return { ...props(), form: formApi }\n    })\n  formApi.useStore = (selector) => useStore(formApi.store, selector)\n  formApi.Subscribe = (props) =>\n    functionalUpdate(props.children, useStore(formApi.store, props.selector))\n\n  onMount(formApi.mount)\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  createComputed(() => formApi.update(opts?.()))\n\n  return formApi\n}\n"],"names":["createForm","opts","options","formApi","FormApi","Field","props","_$createComponent","_$mergeProps","form","createField","useStore","selector","store","Subscribe","functionalUpdate","children","onMount","mount","createComputed","update"],"mappings":";;;;;AA4BO,SAASA,WAMdC,MACsC;AACtC,QAAMC,UAAUD;AACVE,QAAAA,UAAU,IAAIC,QAAqCF,OAAO;AAEhEC,UAAQE,QAASC,CAAAA,UAAKC,gBAAMF,OAAKG,WAAKF,OAAK;AAAA,IAAEG,MAAMN;AAAAA,EAAW,CAAA,CAAA;AACtDO,UAAAA,cAAeJ,CACrBI,UAAAA,YAAY,MAAM;AACT,WAAA;AAAA,MAAE,GAAGJ,MAAM;AAAA,MAAGG,MAAMN;AAAAA,IAAAA;AAAAA,EAAQ,CACpC;AACHA,UAAQQ,WAAYC,CAAAA,aAAaD,SAASR,QAAQU,OAAOD,QAAQ;AACzDE,UAAAA,YAAaR,CACnBS,UAAAA,iBAAiBT,MAAMU,UAAUL,SAASR,QAAQU,OAAOP,MAAMM,QAAQ,CAAC;AAE1EK,UAAQd,QAAQe,KAAK;AAMrBC,iBAAe,MAAMhB,QAAQiB,OAAOnB,8BAAQ,CAAC;AAEtCE,SAAAA;AACT;"}

package/dist/esm/createFormFactory.d.ts

@@ -1,9 +0,0 @@
-import { Field, createField } from './createField.js';
-import { FormApi, FormOptions, Validator } from '@tanstack/form-core';
-
-export type FormFactory<TFormData, TFormValidator extends Validator<TFormData, unknown> | undefined = undefined> = {
-    createForm: (opts?: () => FormOptions<TFormData, TFormValidator>) => FormApi<TFormData, TFormValidator>;
-    createField: typeof createField;
-    Field: typeof Field;
-};
-export declare function createFormFactory<TFormData, TFormValidator extends Validator<TFormData, unknown> | undefined = undefined>(defaultOpts?: () => FormOptions<TFormData, TFormValidator>): FormFactory<TFormData, TFormValidator>;

package/dist/esm/createFormFactory.js

@@ -1,16 +0,0 @@
-import { mergeProps } from "solid-js";
-import { createField, Field } from "./createField.js";
-import { createForm } from "./createForm.js";
-function createFormFactory(defaultOpts) {
-  return {
-    createForm: (opts) => createForm(
-      () => mergeProps((defaultOpts == null ? void 0 : defaultOpts()) ?? {}, (opts == null ? void 0 : opts()) ?? {})
-    ),
-    createField,
-    Field
-  };
-}
-export {
-  createFormFactory
-};
-//# sourceMappingURL=createFormFactory.js.map

package/dist/esm/createFormFactory.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"createFormFactory.js","sources":["../../src/createFormFactory.ts"],"sourcesContent":["import { mergeProps } from 'solid-js'\nimport {\n  type CreateField,\n  Field,\n  type FieldComponent,\n  createField,\n} from './createField'\nimport { createForm } from './createForm'\nimport type { FormApi, FormOptions, Validator } from '@tanstack/form-core'\n\nexport type FormFactory<\n  TFormData,\n  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,\n> = {\n  createForm: (\n    opts?: () => FormOptions<TFormData, TFormValidator>,\n  ) => FormApi<TFormData, TFormValidator>\n  createField: typeof createField\n  Field: typeof Field\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    createForm: (opts) =>\n      createForm<TFormData, TFormValidator>(() =>\n        mergeProps(defaultOpts?.() ?? {}, opts?.() ?? {}),\n      ),\n    createField,\n    Field: Field,\n  }\n}\n"],"names":[],"mappings":";;;AAqBO,SAAS,kBAId,aACwC;AACjC,SAAA;AAAA,IACL,YAAY,CAAC,SACX;AAAA,MAAsC,MACpC,YAAW,iDAAmB,CAAI,IAAA,mCAAY,CAAA,CAAE;AAAA,IAClD;AAAA,IACF;AAAA,IACA;AAAA,EAAA;AAEJ;"}

package/dist/esm/index.d.ts

@@ -1,7 +0,0 @@
-export type { DeepKeys, DeepValue, FieldApiOptions, FieldInfo, FieldMeta, FieldOptions, FieldState, FormOptions, FormState, RequiredByKey, Updater, UpdaterFn, ValidationCause, ValidationError, ValidationMeta, } from '@tanstack/form-core';
-export { FormApi, FieldApi, functionalUpdate } from '@tanstack/form-core';
-export { createForm } from './createForm.js';
-export type { CreateField, FieldComponent } from './createField.js';
-export { createField, Field } from './createField.js';
-export type { FormFactory } from './createFormFactory.js';
-export { createFormFactory } from './createFormFactory.js';

package/dist/esm/index.js

@@ -1,14 +0,0 @@
-import { FieldApi, FormApi, functionalUpdate } from "@tanstack/form-core";
-import { createForm } from "./createForm.js";
-import { Field, createField } from "./createField.js";
-import { createFormFactory } from "./createFormFactory.js";
-export {
-  Field,
-  FieldApi,
-  FormApi,
-  createField,
-  createForm,
-  createFormFactory,
-  functionalUpdate
-};
-//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

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

package/src/createFormFactory.ts

@@ -1,36 +0,0 @@
-import { mergeProps } from 'solid-js'
-import {
-  type CreateField,
-  Field,
-  type FieldComponent,
-  createField,
-} from './createField'
-import { createForm } from './createForm'
-import type { FormApi, FormOptions, Validator } from '@tanstack/form-core'
-
-export type FormFactory<
-  TFormData,
-  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,
-> = {
-  createForm: (
-    opts?: () => FormOptions<TFormData, TFormValidator>,
-  ) => FormApi<TFormData, TFormValidator>
-  createField: typeof createField
-  Field: typeof Field
-}
-
-export function createFormFactory<
-  TFormData,
-  TFormValidator extends Validator<TFormData, unknown> | undefined = undefined,
->(
-  defaultOpts?: () => FormOptions<TFormData, TFormValidator>,
-): FormFactory<TFormData, TFormValidator> {
-  return {
-    createForm: (opts) =>
-      createForm<TFormData, TFormValidator>(() =>
-        mergeProps(defaultOpts?.() ?? {}, opts?.() ?? {}),
-      ),
-    createField,
-    Field: Field,
-  }
-}

package/src/tests/createFormFactory.test.tsx

@@ -1,38 +0,0 @@
-import { describe, expect, it } from 'vitest'
-import { render } from '@solidjs/testing-library'
-import { createFormFactory } from '../index'
-
-describe('createFormFactory', () => {
-  it('should allow default values to be set', async () => {
-    type Person = {
-      firstName: string
-      lastName: string
-    }
-
-    const formFactory = createFormFactory<Person>(() => ({
-      defaultValues: {
-        firstName: 'FirstName',
-        lastName: 'LastName',
-      },
-    }))
-
-    function Comp() {
-      const form = formFactory.createForm()
-
-      return (
-        <>
-          <form.Field
-            name="firstName"
-            children={(field) => {
-              return <p>{field().state.value}</p>
-            }}
-          />
-        </>
-      )
-    }
-
-    const { findByText, queryByText } = render(() => <Comp />)
-    expect(await findByText('FirstName')).toBeInTheDocument()
-    expect(queryByText('LastName')).not.toBeInTheDocument()
-  })
-})