diff --git a/docs/config.json b/docs/config.json
index 37a38b0..564c89a 100644
--- a/docs/config.json
+++ b/docs/config.json
@@ -157,6 +157,58 @@
]
}
]
+ },
+ {
+ "framework": "solid",
+ "menuItems": [
+ {
+ "label": "Getting Started",
+ "children": [
+ {
+ "label": "Quick Start",
+ "to": "framework/solid/quick-start"
+ }
+ ]
+ },
+ {
+ "label": "API Reference",
+ "children": [
+ {
+ "label": "useForm",
+ "to": "framework/solid/reference/createForm"
+ },
+ {
+ "label": "useField",
+ "to": "framework/solid/reference/createField"
+ },
+ {
+ "label": "Field",
+ "to": "framework/solid/reference/Field"
+ },
+ {
+ "label": "FormApi",
+ "to": "framework/solid/reference/formApi"
+ }
+ ]
+ },
+ {
+ "label": "Examples",
+ "children": [
+ {
+ "label": "Simple",
+ "to": "framework/solid/examples/simple"
+ },
+ {
+ "label": "Yup",
+ "to": "framework/solid/examples/yup"
+ },
+ {
+ "label": "Zod",
+ "to": "framework/solid/examples/zod"
+ }
+ ]
+ }
+ ]
}
]
}
diff --git a/docs/framework/react/quick-start.md b/docs/framework/react/quick-start.md
index 2e86901..be6f8e4 100644
--- a/docs/framework/react/quick-start.md
+++ b/docs/framework/react/quick-start.md
@@ -12,7 +12,6 @@ import { useForm } from '@tanstack/react-form'
export default function App() {
const form = useForm({
- // Memoize your default values to prevent re-renders
defaultValues: {
fullName: '',
},
diff --git a/docs/framework/solid/quick-start.md b/docs/framework/solid/quick-start.md
new file mode 100644
index 0000000..786a9e8
--- /dev/null
+++ b/docs/framework/solid/quick-start.md
@@ -0,0 +1,54 @@
+---
+id: quick-start
+title: Quick Start
+---
+
+The bare minimum to get started with TanStack Form is to create a form and add a field. Keep in mind that this example does not include any validation or error handling... yet.
+
+```tsx
+import { createForm } from '@tanstack/solid-form'
+
+function App() {
+ const form = createForm(() => ({
+ defaultValues: {
+ fullName: '',
+ },
+ onSubmit: async (values) => {
+ // Do something with form data
+ console.log(values)
+ },
+ }))
+
+ return (
+
+
Simple Form Example
+
+
+
+
+ )
+}
+```
+
+From here, you'll be ready to explore all of the other features of TanStack Form!
diff --git a/docs/framework/solid/reference/Field.md b/docs/framework/solid/reference/Field.md
new file mode 100644
index 0000000..f6993cb
--- /dev/null
+++ b/docs/framework/solid/reference/Field.md
@@ -0,0 +1,6 @@
+---
+id: field
+title: Field
+---
+
+Please see [/packages/solid-form/src/createField.tsx](https://github.com/TanStack/form/blob/main/packages/solid-form/src/createField.tsx)
diff --git a/docs/framework/solid/reference/createField.md b/docs/framework/solid/reference/createField.md
new file mode 100644
index 0000000..7f7963f
--- /dev/null
+++ b/docs/framework/solid/reference/createField.md
@@ -0,0 +1,6 @@
+---
+id: createField
+title: createField
+---
+
+Please see [/packages/solid-form/src/createField.tsx](https://github.com/TanStack/form/blob/main/packages/solid-form/src/createField.tsx)
diff --git a/docs/framework/solid/reference/createForm.md b/docs/framework/solid/reference/createForm.md
new file mode 100644
index 0000000..79b9ceb
--- /dev/null
+++ b/docs/framework/solid/reference/createForm.md
@@ -0,0 +1,6 @@
+---
+id: createForm
+title: createForm
+---
+
+Please see [/packages/solid-form/src/createForm.tsx](https://github.com/TanStack/form/blob/main/packages/solid-form/src/createForm.tsx)
diff --git a/docs/framework/solid/reference/createFormFactory.md b/docs/framework/solid/reference/createFormFactory.md
new file mode 100644
index 0000000..48a2a2e
--- /dev/null
+++ b/docs/framework/solid/reference/createFormFactory.md
@@ -0,0 +1,6 @@
+---
+id: createFormFactory
+title: createFormFactory
+---
+
+Please see [/packages/solid-form/src/createFormFactory.ts](https://github.com/TanStack/form/blob/main/packages/solid-form/src/createFormFactory.ts)
diff --git a/docs/framework/solid/reference/fieldApi.md b/docs/framework/solid/reference/fieldApi.md
new file mode 100644
index 0000000..1f7e0a6
--- /dev/null
+++ b/docs/framework/solid/reference/fieldApi.md
@@ -0,0 +1,6 @@
+---
+id: fieldApi
+title: Field API
+---
+
+Please see [/packages/solid-form/src/createField.tsx](https://github.com/TanStack/form/blob/main/packages/solid-form/src/createField.tsx)
diff --git a/docs/framework/solid/reference/formApi.md b/docs/framework/solid/reference/formApi.md
new file mode 100644
index 0000000..caf2085
--- /dev/null
+++ b/docs/framework/solid/reference/formApi.md
@@ -0,0 +1,6 @@
+---
+id: formApi
+title: Form API
+---
+
+Please see [/packages/solid-form/src/createForm.tsx](https://github.com/TanStack/form/blob/main/packages/solid-form/src/createForm.tsx)
diff --git a/docs/framework/vue/quick-start.md b/docs/framework/vue/quick-start.md
index 623729b..233176f 100644
--- a/docs/framework/vue/quick-start.md
+++ b/docs/framework/vue/quick-start.md
@@ -11,7 +11,6 @@ The bare minimum to get started with TanStack Form is to create a form and add a
import { useForm } from '@tanstack/vue-form'
const form = useForm({
- // Memoize your default values to prevent re-renders
defaultValues: {
fullName: '',
},
diff --git a/docs/installation.md b/docs/installation.md
index ec50d39..4a06101 100644
--- a/docs/installation.md
+++ b/docs/installation.md
@@ -3,12 +3,14 @@ id: installation
title: Installation
---
-TanStack Form is compatible with various front-end frameworks, including React and Vue. To use TanStack Form with your desired framework, install the corresponding adapter via NPM:
+TanStack Form is compatible with various front-end frameworks, including React, Vue, and Solid. To use TanStack Form with your desired framework, install the corresponding adapter via NPM:
```bash
$ npm i @tanstack/react-form
# or
$ pnpm add @tanstack/vue-form
+# or
+$ yarn add @tanstack/solid-form
```
> Depending on your environment, you might need to add polyfills. If you want to support older browsers, you need to transpile the library from `node_modules` yourselves.
@@ -16,7 +18,7 @@ $ pnpm add @tanstack/vue-form
In addition, we support both Zod and Yup as validators through official validator packages:
```bash
-$ yarn add @tanstack/zod-form-adapter zod
+$ npm i @tanstack/zod-form-adapter zod
# or
$ npm i @tanstack/yup-form-adapter yup
```
diff --git a/docs/overview.md b/docs/overview.md
index 65064d3..a42a473 100644
--- a/docs/overview.md
+++ b/docs/overview.md
@@ -57,7 +57,6 @@ export default function App() {
return (
Simple Form Example
- {/* A pre-bound form component */}