Merge branch 'main' into demo-internal-components

TanStack · Jul 20, 2024 · 2adadbf · 2adadbf
2 parents bb26093 + bde3b1c
commit 2adadbf
Show file tree

Hide file tree

Showing 105 changed files with 2,697 additions and 2,404 deletions.
diff --git a/.github/renovate.json b/.github/renovate.json
@@ -22,7 +22,11 @@
   ],
   "ignoreDeps": [
     "@types/node",
+    "@types/react",
+    "@types/react-dom",
     "node",
+    "react",
+    "react-dom",
     "typescript",
     "typescript49",
     "typescript50",

diff --git a/.github/workflows/autofix.yml b/.github/workflows/autofix.yml
@@ -0,0 +1,29 @@
+name: autofix.ci # needed to securely identify the workflow
+
+on:
+  pull_request:
+  push:
+    branches: [main, alpha, beta]
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.event.number || github.ref }}
+  cancel-in-progress: true
+
+permissions:
+  contents: read
+
+jobs:
+  autofix:
+    name: autofix
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Setup Tools
+        uses: tanstack/config/.github/setup@629cd3152485cbe985f5a7e66d370c858132c517
+      - name: Fix formatting
+        run: pnpm prettier:write
+      - name: Apply fixes
+        uses: autofix-ci/action@dd55f44df8f7cdb7a6bf74c78677eb8acd40cd0a
+        with:
+          commit-message: 'ci: apply automated fixes'
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -7,7 +7,7 @@ on:
         description: override release tag
         required: false
   push:
-    branches: ['main', 'alpha', 'beta']
+    branches: [main, alpha, beta]
 
 concurrency:
   group: ${{ github.workflow }}-${{ github.event.number || github.ref }}
@@ -16,6 +16,10 @@ concurrency:
 env:
   NX_CLOUD_ACCESS_TOKEN: ${{ secrets.NX_CLOUD_ACCESS_TOKEN }}
 
+permissions:
+  contents: write
+  id-token: write
+
 jobs:
   test-and-publish:
     name: Test & Publish
@@ -42,10 +46,8 @@ jobs:
           npm config set '//registry.npmjs.org/:_authToken' "${NPM_TOKEN}"
           pnpm run cipublish
         env:
-          GITHUB_TOKEN: ${{ secrets.GH_TOKEN }}
-          GH_TOKEN: ${{ secrets.GH_TOKEN }}
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
-          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
           TAG: ${{ inputs.tag }}
       - name: Upload coverage to Codecov
         uses: codecov/codecov-action@v4

diff --git a/.github/workflows/pr.yml b/.github/workflows/pr.yml
@@ -14,6 +14,9 @@ concurrency:
 env:
   NX_CLOUD_ACCESS_TOKEN: ${{ secrets.NX_CLOUD_ACCESS_TOKEN }}
 
+permissions:
+  contents: read
+
 jobs:
   test:
     name: Test
@@ -30,7 +33,7 @@ jobs:
       - name: Get base and head commits for `nx affected`
         uses: nrwl/nx-set-shas@v4
         with:
-          main-branch-name: 'main'
+          main-branch-name: main
       - name: Run Checks
         run: pnpm run test:pr --parallel=3
       - name: Stop Nx Agents

diff --git a/.npmrc b/.npmrc
@@ -1,2 +1,3 @@
 link-workspace-packages=true
 prefer-workspace-packages=true
+provenance=true
diff --git a/.nvmrc b/.nvmrc
@@ -1 +1 @@
-v18.20.3
+20.15.1
diff --git a/docs/config.json b/docs/config.json
@@ -192,40 +192,40 @@
       "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": "Classes / FieldApi", "to": "reference/FieldApi" },
+        { "label": "Classes / FormApi", "to": "reference/FormApi" },
+        { "label": "Functions / formOptions", "to": "reference/formOptions" },
+        { "label": "Functions / mergeForm", "to": "reference/mergeForm" },
         {
           "label": "Interfaces / FieldApiOptions",
-          "to": "reference/fieldapioptions"
+          "to": "reference/FieldApiOptions"
         },
         {
           "label": "Interfaces / FieldOptions",
-          "to": "reference/fieldoptions"
+          "to": "reference/FieldOptions"
         },
         {
           "label": "Interfaces / FieldValidators",
-          "to": "reference/fieldvalidators"
+          "to": "reference/FieldValidators"
         },
-        { "label": "Interfaces / FormOptions", "to": "reference/formoptions" },
+        { "label": "Interfaces / FormOptions", "to": "reference/FormOptions" },
         {
           "label": "Interfaces / FormValidators",
-          "to": "reference/formvalidators"
+          "to": "reference/FormValidators"
         },
-        { "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 / 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/ValidationError"
         },
-        { "label": "Types / ValidationMeta", "to": "reference/validationmeta" }
+        { "label": "Types / ValidationMeta", "to": "reference/ValidationMeta" }
       ],
       "frameworks": [
         {
@@ -237,35 +237,35 @@
             },
             {
               "label": "Functions / createServerValidate",
-              "to": "framework/react/reference/createservervalidate"
+              "to": "framework/react/reference/createServerValidate"
             },
             {
               "label": "Functions / Field",
-              "to": "framework/react/reference/field"
+              "to": "framework/react/reference/Field"
             },
             {
               "label": "Functions / useField",
-              "to": "framework/react/reference/usefield"
+              "to": "framework/react/reference/useField"
             },
             {
               "label": "Functions / useForm",
-              "to": "framework/react/reference/useform"
+              "to": "framework/react/reference/useForm"
             },
             {
               "label": "Functions / useTransform",
-              "to": "framework/react/reference/usetransform"
+              "to": "framework/react/reference/useTransform"
             },
             {
               "label": "Types / FieldComponent",
-              "to": "framework/react/reference/fieldcomponent"
+              "to": "framework/react/reference/FieldComponent"
             },
             {
               "label": "Types / UseField",
-              "to": "framework/react/reference/usefield"
+              "to": "framework/react/reference/UseField"
             },
             {
               "label": "Variables / initialFormState",
-              "to": "framework/react/reference/initialformstate"
+              "to": "framework/react/reference/initialFormState"
             }
           ]
         },
@@ -275,23 +275,23 @@
             { "label": "Vue Reference", "to": "framework/vue/reference/index" },
             {
               "label": "Functions / Field",
-              "to": "framework/vue/reference/field"
+              "to": "framework/vue/reference/Field"
             },
             {
               "label": "Functions / useField",
-              "to": "framework/vue/reference/usefield"
+              "to": "framework/vue/reference/useField"
             },
             {
               "label": "Functions / useForm",
-              "to": "framework/vue/reference/useform"
+              "to": "framework/vue/reference/useForm"
             },
             {
               "label": "Types / FieldComponent",
-              "to": "framework/vue/reference/fieldcomponent"
+              "to": "framework/vue/reference/FieldComponent"
             },
             {
               "label": "Types / UseField",
-              "to": "framework/vue/reference/usefield"
+              "to": "framework/vue/reference/UseField"
             }
           ]
         },
@@ -304,23 +304,23 @@
             },
             {
               "label": "Functions / createField",
-              "to": "framework/solid/reference/createfield"
+              "to": "framework/solid/reference/createField"
             },
             {
               "label": "Functions / createForm",
-              "to": "framework/solid/reference/createform"
+              "to": "framework/solid/reference/createForm"
             },
             {
               "label": "Functions / Field",
-              "to": "framework/solid/reference/field"
+              "to": "framework/solid/reference/Field"
             },
             {
               "label": "Types / CreateField",
-              "to": "framework/solid/reference/createfield"
+              "to": "framework/solid/reference/CreateField"
             },
             {
               "label": "Types / FieldComponent",
-              "to": "framework/solid/reference/fieldcomponent"
+              "to": "framework/solid/reference/FieldComponent"
             }
           ]
         },
@@ -330,7 +330,7 @@
             { "label": "Lit Reference", "to": "framework/lit/reference/index" },
             {
               "label": "Classes / TanStackFormController",
-              "to": "framework/lit/reference/tanstackformcontroller"
+              "to": "framework/lit/reference/TanStackFormController"
             }
           ]
         },
@@ -343,15 +343,15 @@
             },
             {
               "label": "Classes / TanStackField",
-              "to": "framework/angular/reference/tanstackfield"
+              "to": "framework/angular/reference/TanStackField"
             },
             {
               "label": "Functions / injectForm",
-              "to": "framework/angular/reference/injectform"
+              "to": "framework/angular/reference/injectForm"
             },
             {
               "label": "Functions / injectStore",
-              "to": "framework/angular/reference/injectstore"
+              "to": "framework/angular/reference/injectStore"
             }
           ]
         }

diff --git a/docs/framework/angular/guides/arrays.md b/docs/framework/angular/guides/arrays.md
@@ -9,7 +9,7 @@ TanStack Form supports arrays as values in a form, including sub-object values i
 
 To use an array, you can use `field.api.state.value` on an array value:
 
-```typescript
+```angular-ts
 @Component({
   selector: 'app-root',
   standalone: true,
@@ -38,15 +38,15 @@ export class AppComponent {
 
 This will generate the mapped JSX every time you run `pushValue` on `field`:
 
-```html
+```angular-html
 <button (click)="people.api.pushValue(defaultPerson)" type="button">
   Add person
 </button>
 ```
 
 Finally, you can use a subfield like so:
 
-```html
+```angular-html
  <ng-container
   [tanstackField]="form"
   [name]="getPeopleName($index)"
@@ -79,7 +79,7 @@ export class AppComponent {
 > While it's unfortunate that you need to use a function to get the field name, it's a requirement for how our strict TypeScript types work.
 >
 > See, if we did the following:
-> ```html
+> ```angular-html
 > <ng-container [tanstackField]="form" [name]="'people[' + $index + '].name'"></ng-container>
 > ```
 >
@@ -91,7 +91,7 @@ export class AppComponent {
 
 ## Full Example
 
-```typescript
+```angular-ts
 @Component({
   selector: 'app-root',
   standalone: true,

diff --git a/docs/framework/angular/guides/basic-concepts.md b/docs/framework/angular/guides/basic-concepts.md
@@ -58,7 +58,7 @@ The Field API is an object accessed in the `tanstackField.api` property when cre
 
 Example:
 
-```html
+```angular-html
 <input
   [value]="fieldName.api.state.value"
   (blur)="fieldName.api.handleBlur()"
@@ -72,7 +72,7 @@ Example:
 
 Example:
 
-```typescript
+```angular-ts
 @Component({
   selector: 'app-root',
   standalone: true,
@@ -120,7 +120,7 @@ In addition to hand-rolled validation options, we also provide adapters like `@t
 
 Example:
 
-```typescript
+```angular-ts
 import { zodValidator } from '@tanstack/zod-form-adapter'
 import { z } from 'zod'
 
@@ -195,7 +195,7 @@ When working with array fields, you can use the fields `pushValue`, `removeValue
 
 Example:
 
-```typescript
+```angular-ts
 @Component({
   selector: 'app-root',
   standalone: true,