Merge branch 'main' into fix-submit-trigger-async-validators

.github/renovate.json

@@ -1,25 +1,21 @@
 {
   "$schema": "https://docs.renovatebot.com/renovate-schema.json",
+  "configMigration": true,
   "extends": [
     "config:recommended",
+    "group:allNonMajor",
     "schedule:weekly",
     ":approveMajorUpdates",
+    ":automergeMinor",
     ":disablePeerDependencies",
+    ":maintainLockFilesMonthly",
+    ":semanticCommits",
     ":semanticCommitTypeAll(chore)"
   ],
   "ignorePresets": [":ignoreModulesAndTests"],
   "labels": ["dependencies"],
   "rangeStrategy": "bump",
   "postUpdateOptions": ["pnpmDedupe"],
-  "semanticCommits": "enabled",
-  "packageRules": [
-    {
-      "groupName": "all non-major dependencies",
-      "groupSlug": "all-minor-patch",
-      "matchCurrentVersion": ">=1.0.0",
-      "matchUpdateTypes": ["minor", "patch"]
-    }
-  ],
   "ignoreDeps": [
     "@types/node",
     "@types/react",

.github/workflows/autofix.yml

@@ -14,16 +14,21 @@ permissions:
 
 jobs:
   autofix:
+    if: ${{ !contains(github.event.head_commit.message, 'apply automated fixes')}}
     name: autofix
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
         uses: actions/checkout@v4
       - name: Setup Tools
-        uses: tanstack/config/.github/setup@629cd3152485cbe985f5a7e66d370c858132c517
+        uses: tanstack/config/.github/setup@main
       - name: Fix formatting
         run: pnpm prettier:write
+      - name: Generate Docs
+        if: ${{ github.event_name == 'push' }}
+        run: pnpm docs:generate
+
       - name: Apply fixes
-        uses: autofix-ci/action@dd55f44df8f7cdb7a6bf74c78677eb8acd40cd0a
+        uses: autofix-ci/action@ff86a557419858bb967097bfc916833f5647fa8c
         with:
           commit-message: 'ci: apply automated fixes'

docs/config.json

@@ -191,41 +191,86 @@
     {
       "label": "API Reference",
       "children": [
-        { "label": "JavaScript Reference", "to": "reference/index" },
-        { "label": "Classes / FieldApi", "to": "reference/FieldApi" },
-        { "label": "Classes / FormApi", "to": "reference/FormApi" },
-        { "label": "Functions / formOptions", "to": "reference/formOptions" },
-        { "label": "Functions / mergeForm", "to": "reference/mergeForm" },
+        {
+          "label": "JavaScript Reference",
+          "to": "reference/index"
+        },
+        {
+          "label": "Classes / FieldApi",
+          "to": "reference/classes/fieldapi"
+        },
+        {
+          "label": "Classes / FormApi",
+          "to": "reference/classes/formapi"
+        },
+        {
+          "label": "Functions / formOptions",
+          "to": "reference/functions/formoptions"
+        },
+        {
+          "label": "Functions / mergeForm",
+          "to": "reference/functions/mergeform"
+        },
         {
           "label": "Interfaces / FieldApiOptions",
-          "to": "reference/FieldApiOptions"
+          "to": "reference/interfaces/fieldapioptions"
         },
         {
           "label": "Interfaces / FieldOptions",
-          "to": "reference/FieldOptions"
+          "to": "reference/interfaces/fieldoptions"
         },
         {
           "label": "Interfaces / FieldValidators",
-          "to": "reference/FieldValidators"
+          "to": "reference/interfaces/fieldvalidators"
+        },
+        {
+          "label": "Interfaces / FormOptions",
+          "to": "reference/interfaces/formoptions"
         },
-        { "label": "Interfaces / FormOptions", "to": "reference/FormOptions" },
         {
           "label": "Interfaces / FormValidators",
-          "to": "reference/FormValidators"
+          "to": "reference/interfaces/formvalidators"
+        },
+        {
+          "label": "Types / DeepKeys",
+          "to": "reference/type-aliases/deepkeys"
+        },
+        {
+          "label": "Types / DeepValue",
+          "to": "reference/type-aliases/deepvalue"
+        },
+        {
+          "label": "Types / FieldInfo",
+          "to": "reference/type-aliases/fieldinfo"
+        },
+        {
+          "label": "Types / FieldMeta",
+          "to": "reference/type-aliases/fieldmeta"
+        },
+        {
+          "label": "Types / FieldState",
+          "to": "reference/type-aliases/fieldstate"
+        },
+        {
+          "label": "Types / FormState",
+          "to": "reference/type-aliases/formstate"
+        },
+        {
+          "label": "Types / Updater",
+          "to": "reference/type-aliases/updater"
+        },
+        {
+          "label": "Types / UpdaterFn",
+          "to": "reference/type-aliases/updaterfn"
         },
-        { "label": "Types / DeepKeys", "to": "reference/DeepKeys" },
-        { "label": "Types / DeepValue", "to": "reference/DeepValue" },
-        { "label": "Types / FieldInfo", "to": "reference/FieldInfo" },
-        { "label": "Types / FieldMeta", "to": "reference/FieldMeta" },
-        { "label": "Types / FieldState", "to": "reference/FieldState" },
-        { "label": "Types / FormState", "to": "reference/FormState" },
-        { "label": "Types / Updater", "to": "reference/Updater" },
-        { "label": "Types / UpdaterFn", "to": "reference/UpdaterFn" },
         {
           "label": "Types / ValidationError",
-          "to": "reference/ValidationError"
+          "to": "reference/type-aliases/validationerror"
         },
-        { "label": "Types / ValidationMeta", "to": "reference/ValidationMeta" }
+        {
+          "label": "Types / ValidationMeta",
+          "to": "reference/type-aliases/validationmeta"
+        }
       ],
       "frameworks": [
         {
@@ -237,61 +282,60 @@
             },
             {
               "label": "Functions / createServerValidate",
-              "to": "framework/react/reference/createServerValidate"
+              "to": "framework/react/reference/functions/createservervalidate"
             },
             {
               "label": "Functions / Field",
-              "to": "framework/react/reference/Field"
+              "to": "framework/react/reference/functions/field"
             },
             {
               "label": "Functions / useField",
-              "to": "framework/react/reference/useField"
+              "to": "framework/react/reference/functions/usefield"
             },
             {
               "label": "Functions / useForm",
-              "to": "framework/react/reference/useForm"
+              "to": "framework/react/reference/functions/useform"
             },
             {
               "label": "Functions / useTransform",
-              "to": "framework/react/reference/useTransform"
+              "to": "framework/react/reference/functions/usetransform"
             },
             {
               "label": "Types / FieldComponent",
-              "to": "framework/react/reference/FieldComponent"
+              "to": "framework/react/reference/type-aliases/fieldcomponent"
             },
             {
               "label": "Types / UseField",
-              "to": "framework/react/reference/UseField"
-            },
-            {
-              "label": "Variables / initialFormState",
-              "to": "framework/react/reference/initialFormState"
+              "to": "framework/react/reference/type-aliases/usefield"
             }
           ]
         },
         {
           "label": "vue",
           "children": [
-            { "label": "Vue Reference", "to": "framework/vue/reference/index" },
+            {
+              "label": "Vue Reference",
+              "to": "framework/vue/reference/index"
+            },
             {
               "label": "Functions / Field",
-              "to": "framework/vue/reference/Field"
+              "to": "framework/vue/reference/functions/field"
             },
             {
               "label": "Functions / useField",
-              "to": "framework/vue/reference/useField"
+              "to": "framework/vue/reference/functions/usefield"
             },
             {
               "label": "Functions / useForm",
-              "to": "framework/vue/reference/useForm"
+              "to": "framework/vue/reference/functions/useform"
             },
             {
               "label": "Types / FieldComponent",
-              "to": "framework/vue/reference/FieldComponent"
+              "to": "framework/vue/reference/type-aliases/fieldcomponent"
             },
             {
               "label": "Types / UseField",
-              "to": "framework/vue/reference/UseField"
+              "to": "framework/vue/reference/type-aliases/usefield"
             }
           ]
         },
@@ -304,33 +348,36 @@
             },
             {
               "label": "Functions / createField",
-              "to": "framework/solid/reference/createField"
+              "to": "framework/solid/reference/functions/createfield"
             },
             {
               "label": "Functions / createForm",
-              "to": "framework/solid/reference/createForm"
+              "to": "framework/solid/reference/functions/createform"
             },
             {
               "label": "Functions / Field",
-              "to": "framework/solid/reference/Field"
+              "to": "framework/solid/reference/functions/field"
             },
             {
               "label": "Types / CreateField",
-              "to": "framework/solid/reference/CreateField"
+              "to": "framework/solid/reference/type-aliases/createfield"
             },
             {
               "label": "Types / FieldComponent",
-              "to": "framework/solid/reference/FieldComponent"
+              "to": "framework/solid/reference/type-aliases/fieldcomponent"
             }
           ]
         },
         {
           "label": "lit",
           "children": [
-            { "label": "Lit Reference", "to": "framework/lit/reference/index" },
+            {
+              "label": "Lit Reference",
+              "to": "framework/lit/reference/index"
+            },
             {
               "label": "Classes / TanStackFormController",
-              "to": "framework/lit/reference/TanStackFormController"
+              "to": "framework/lit/reference/classes/tanstackformcontroller"
             }
           ]
         },
@@ -343,15 +390,15 @@
             },
             {
               "label": "Classes / TanStackField",
-              "to": "framework/angular/reference/TanStackField"
+              "to": "framework/angular/reference/classes/tanstackfield"
             },
             {
               "label": "Functions / injectForm",
-              "to": "framework/angular/reference/injectForm"
+              "to": "framework/angular/reference/functions/injectform"
             },
             {
               "label": "Functions / injectStore",
-              "to": "framework/angular/reference/injectStore"
+              "to": "framework/angular/reference/functions/injectstore"
             }
           ]
         }
@@ -399,6 +446,10 @@
             {
               "label": "UI Libraries",
               "to": "framework/react/examples/ui-libraries"
+            },
+            {
+              "label": "Field Errors From Form Validators",
+              "to": "framework/react/examples/field-errors-from-form-validators"
             }
           ]
         },

docs/framework/angular/guides/arrays.md

@@ -5,7 +5,7 @@ title: Arrays
 
 TanStack Form supports arrays as values in a form, including sub-object values inside of an array.
 
-# Basic Usage
+## Basic Usage
 
 To use an array, you can use `field.api.state.value` on an array value:
 

docs/framework/angular/guides/basic-concepts.md

@@ -41,7 +41,7 @@ Each field has its own state, which includes its current value, validation statu
 Example:
 
 ```tsx
-const { value, error, touched, isValidating } = field.state
+const { value, meta: { errors, isValidating } } = field.state
 ```
 
 There are three field states can be very useful to see how the user interacts with a field. A field is _"touched"_ when the user clicks/tabs into it, _"pristine"_ until the user changes value in it, and _"dirty"_ after the value has been changed. You can check these states via the `isTouched`, `isPristine` and `isDirty` flags, as seen below.

docs/framework/angular/guides/validation.md

@@ -469,6 +469,38 @@ export class AppComponent {
 }
 ```
 
+### Form Level Adapter Validation
+
+You can also use the adapter at the form level:
+
+```typescript
+import { zodValidator } from '@tanstack/zod-form-adapter'
+import { z } from 'zod'
+
+// ...
+
+const form = injectForm({
+  validatorAdapter: zodValidator(),
+  validators: {
+    onChange: z.object({
+      age: z.number().gte(13, 'You must be 13 to make an account'),
+    }),
+  },
+})
+```
+
+If you use the adapter at the form level, it will pass the validation to the fields of the same name.
+
+This means that:
+
+```html
+<ng-container [tanstackField]="form" name="age" #age="field">
+  <!-- ... -->
+</ng-container>
+```
+
+Will still display the error message from the form-level validation.
+
 ## Preventing invalid forms from being submitted
 
 The `onChange`, `onBlur` etc... callbacks are also run when the form is submitted and the submission is blocked if the form is invalid.