= async data => {
+ console.log('submit data', data)
+ await router.push('/form/success')
+ }
+
+ return (
+
+
+
Form
+
+
+
+
+ Form
+
+
+
+
+ )
+}
+
+export default Form
diff --git a/examples/react-hook-form/pages/form/success.tsx b/examples/react-hook-form/pages/form/success.tsx
new file mode 100755
index 00000000..50782205
--- /dev/null
+++ b/examples/react-hook-form/pages/form/success.tsx
@@ -0,0 +1,23 @@
+import Head from 'next/head'
+import Link from 'next/link'
+import styles from '../../styles/common.module.css'
+
+import type { NextPage } from 'next'
+
+const SubmitSuccess: NextPage = () => {
+ return (
+
+
+
submit success
+
+
+
+
+ Submit success!!!
+ form
+
+
+ )
+}
+
+export default SubmitSuccess
diff --git a/examples/react-hook-form/pages/index.tsx b/examples/react-hook-form/pages/index.tsx
new file mode 100755
index 00000000..5e08d2cd
--- /dev/null
+++ b/examples/react-hook-form/pages/index.tsx
@@ -0,0 +1,23 @@
+import Head from 'next/head'
+import Link from 'next/link'
+import styles from '../styles/common.module.css'
+
+import type { NextPage } from 'next'
+
+const Home: NextPage = () => {
+ return (
+
+
+
Top - Example of RecoilHistorySyncJSONNext
+
+
+
+
+ Top page
+ form
+
+
+ )
+}
+
+export default Home
diff --git a/examples/react-hook-form/public/favicon.ico b/examples/react-hook-form/public/favicon.ico
new file mode 100755
index 00000000..718d6fea
Binary files /dev/null and b/examples/react-hook-form/public/favicon.ico differ
diff --git a/examples/react-hook-form/styles/common.module.css b/examples/react-hook-form/styles/common.module.css
new file mode 100755
index 00000000..2145218c
--- /dev/null
+++ b/examples/react-hook-form/styles/common.module.css
@@ -0,0 +1,12 @@
+.container {
+ padding: 0 2rem;
+}
+
+.main {
+ min-height: 100vh;
+ min-width: 700px;
+ padding: 4rem 0;
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
diff --git a/examples/react-hook-form/styles/form.module.css b/examples/react-hook-form/styles/form.module.css
new file mode 100755
index 00000000..d7436848
--- /dev/null
+++ b/examples/react-hook-form/styles/form.module.css
@@ -0,0 +1,18 @@
+.container {
+ padding: 0 2rem;
+}
+
+.main {
+ min-height: 100vh;
+ min-width: 700px;
+ padding: 4rem 0;
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
+
+.formList {
+ display: grid;
+ grid-template-columns: 100px 1fr;
+ gap: 10px;
+}
diff --git a/examples/react-hook-form/styles/globals.css b/examples/react-hook-form/styles/globals.css
new file mode 100755
index 00000000..83faa13c
--- /dev/null
+++ b/examples/react-hook-form/styles/globals.css
@@ -0,0 +1,16 @@
+html,
+body {
+ padding: 0;
+ margin: 0;
+ font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
+ Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
+}
+
+a {
+ color: blue;
+ text-decoration: underline;
+}
+
+* {
+ box-sizing: border-box;
+}
diff --git a/examples/react-hook-form/tsconfig.json b/examples/react-hook-form/tsconfig.json
new file mode 100755
index 00000000..921df2f2
--- /dev/null
+++ b/examples/react-hook-form/tsconfig.json
@@ -0,0 +1,20 @@
+{
+ "compilerOptions": {
+ "target": "es2018",
+ "lib": ["dom", "dom.iterable", "esnext"],
+ "allowJs": true,
+ "skipLibCheck": true,
+ "strict": true,
+ "forceConsistentCasingInFileNames": true,
+ "noEmit": true,
+ "esModuleInterop": true,
+ "module": "esnext",
+ "moduleResolution": "node",
+ "resolveJsonModule": true,
+ "isolatedModules": true,
+ "jsx": "preserve",
+ "incremental": true
+ },
+ "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+ "exclude": ["node_modules"]
+}
diff --git a/package.json b/package.json
index 5ab302d9..0b82e9c5 100644
--- a/package.json
+++ b/package.json
@@ -43,7 +43,8 @@
"run-ex:history-sync-json": "yarn --cwd examples/history-sync-json run $CMD",
"run-ex:history-sync-transit": "yarn --cwd examples/history-sync-transit run $CMD",
"run-ex:url-sync-json": "yarn --cwd examples/url-sync-json run $CMD",
- "run-ex:url-sync-transit": "yarn --cwd examples/url-sync-transit run $CMD"
+ "run-ex:url-sync-transit": "yarn --cwd examples/url-sync-transit run $CMD",
+ "run-ex:react-hook-from": "yarn --cwd examples/react-hook-form run $CMD"
},
"simple-git-hooks": {
"pre-commit": "yarn run lint:lib:eslint && yarn run lint:ex:eslint && yarn run test"