@location-state/conform impl (#346)

* examples: confrom init (#279)

* examples: confrom init

* example: conform example: use src directory, add next.config.js

* example: conform example's remove button not working

---------

Co-authored-by: akfm.sato <01047245@CF0286.local>

* Conform example with `useLocationForm` (#286)

* example: confrom wrapper module

* example: restore location state form

* example: refactor useLocationForm type

* example: useLocationForm return with form props

* example: refactor&comment useLocationForm

* example: fix state name

* example: useForm behavoir test

* example: useLocationForm refactor rm typeof window

* example: useLocationForm fix return value

* example: fix useSyncExternalStore 1st arg same ref

* example: dynamic form item restore

* example: useLocationForm with dynamic form

* example: fix effect callback to useEffect

* example: getLocationFormProps memo

* feat: useLocationGetState impl

* example: useLocationForm with getLocationState

* example: fix onChange save location state

* example: @types/lodash.set add

* example: rm (dynamic)

* example: useLocationFrom option add id

* example: fix useLocationFrom checkbox restore

* example: useLocationForm add comment

* example: useLocationForm refactor noop name

* example: rm unused import

* example: (not use location state) conform search form

* example: useLocationForm sync url exmaple

* example: url useLocationForm example

* example: fix useLocationForm onChange default value

* example: refactor package, key

* example: useLocationForm refactor

* example: useLocationForm rendering optimize

* rebase on conform branch, update lock file

* example: useLocationForm callback deps fix

* refactor: useLocationForm option idPrefix rename

* feat: useLocationForm API fix

* fix: useLocationForm type

* refactor: useLocationForm re-render hooks useReducer

* refactor: useLocationForm add ref guard check

* fix: useLocationForm formOption fix

* feat: `filterFormValueWihZodShape` add

* fix: useLocationForm id setting timing

* fix: useLocationForm initial id set

* refactor: filterFormValueWihZodShape no use zod

* fix: useLocationForm inital id set

* fix: useLocationForm schema option add

* refactor: rename useLocationForm inner vars

* test: conform example e2e add

* example: useLocationForm option rm shape

* example: rename static form

* example: simple form with conform

* refactor: vars order fix

* refactor: fix defenition order

* feat: `useLocationKey` impl

* example: refactor rm lodash.set

* refactor: useLocationForm

* refactor: updateWithObjectPath

* example: type spec simple form

* example: simple conform submit redirect

* refactor: declarative order

* refactor: rename inner vars

* refactor: getPaths

* refactor: useLocationKey subscribe

* feat: useLocationKey option

* todo comment

* fix: useLocationKey default args

* fix: useLocationForm support intent

* refactor: useLocationForm console rm

* fix: simple form unnecessary if rm

* example: dynamic form add first button

* example: number's error field

* example: refactor schema

* fix: conform example test

* example: simple-form refactor

* example: static-from refactor

* refactor: useLocationForm

* example: simple/static form content

* example: test comment fix

* example: fix number error message

* example: dynamic form reset button impl

* example: submit/reset button layout

* example: rename schema

* refactor: conform page

---------

Co-authored-by: akfm.sato <01047245@CF0286.local>

* chore: vsc setting update (#309)

Co-authored-by: akfm.sato <01047245@CF0286.local>

* `@location-state/conform` package init (#313)

* feat: @location-state/conform init

* refactor: confrom src directory

* refactor: @location-state/confrom strict check

* refactor: updatedWithObjectPath test

* refactor: updatedWithObjectPath

* refactor: updateWithObjectPath

* refactor: useLocationForm

* refactor: updatedWithObjectPath type assert refactor

* refactor: @repo/utils, @repo/test-utils

* refactor: rename configs to @repo/configs

* refactor: rename test case

* refactor: type utils

* feat: useLocationForm use valibot validation

* refactor: add comment

* fix: @location-state/confrom package.json fix description/dependencies

* refactor: updateWithObjectPath test

* refactor: format

* tsconfig update

* feat: @location-state/conform dependencies/description fix

* refactor: move comment to schema.ts

* refactor: test define member order fix

* refactor: comment fix, AssertError impl

* test: @location-state/conform test

* refactor: @location-state/conform array utils impl

* refactor: update-array test

* refactor: update-array test name fix

---------

Co-authored-by: akfm.sato <01047245@CF0286.local>

* Conform docs (#317)

* docs: `@location-state/conform` README

* docs: `@location-state/conform` API docs

* docs: `@location-state/confrom` docs fix

* docs: `@location-state/conform` fix Quickstart text

* docs: `@location-state/conform` example of Server Actions or nothing.

* docs: `@location-state/conform` useLocationForm type fix

* docs: `@location-state/conform` add conform's `id` link.

* docs: `@location-state/conform` fix useLocationForm return text.

* docs: `@location-state/conform` fix GetLocationFormProps return text.

* docs: `@location-state/conform` fix GetLocationFormProps return text.

* docs: `@location-state/conform` fix feature explain.

* docs: `@location-state/conform` fix API explain.

---------

Co-authored-by: akfm.sato <01047245@CF0286.local>

* fix: conform update error. (#345)

Co-authored-by: akfm.sato <01047245@CF0286.local>

* Conform prepare release (#326)

* docs: add changeset of `@location-state/conform`.

* docs: `useLocationKey`, `useLocationGetState` explain API docs.

* docs: fix changesets.

* docs: split changesets docs

* docs: fix `useLocationKey` / `useLocationGetState`

* docs: fix `useLocationGetState`/``useLocationKey` description word.

* chore: pnpm update version specify

---------

Co-authored-by: akfm.sato <01047245@CF0286.local>

* chore: fix pnpm version, fix rebase diff

* chore: rm apps/example-next-conform dependencies playwright

* fix: vscode setting json nits, `useLocationKey` docs

---------

Co-authored-by: akfm.sato <01047245@CF0286.local>

.changeset/hungry-apples-argue.md

@@ -0,0 +1,5 @@
+---
+"@location-state/conform": minor
+---
+
+Added `@location-state/conform` that is conform support package.

.changeset/stale-spoons-do.md

@@ -0,0 +1,5 @@
+---
+"@location-state/core": minor
+---
+
+Added `useLocationGetState`/`useLocationKey` to `@location-state/core`.

.github/workflows/check.yml

@@ -24,7 +24,7 @@ jobs:
       - uses: pnpm/action-setup@v2
         name: Install pnpm
         with:
-          version: 9
+          version: 9.1.0
           run_install: false
       - name: Install packages
         run: pnpm i --ignore-scripts

.github/workflows/playwright.yml

@@ -20,15 +20,15 @@ jobs:
       - uses: pnpm/action-setup@v2
         name: Install pnpm
         with:
-          version: 9
+          version: 9.1.0
           run_install: false
       - name: Install packages
         run: pnpm i --ignore-scripts
       - name: Install playwright browsers
         run: | 
           pnpm exec playwright install --with-deps chromium
           pnpm exec playwright install --with-deps webkit
-      - name: Build project
-        run: pnpm build
+      - name: Build packages
+        run: pnpm build:packages
       - name: Run integration-test
         run: pnpm integration-test

.github/workflows/release.yml

@@ -26,7 +26,7 @@ jobs:
       - uses: pnpm/action-setup@v2
         name: Install pnpm
         with:
-          version: 9
+          version: 9.1.0
           run_install: false
       - name: Install packages
         run: pnpm i --ignore-scripts

.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["biomejs.biome"]
+}

.vscode/launch.json

@@ -5,12 +5,12 @@
   "version": "0.2.0",
   "configurations": [
     {
-      "name": "apps/example-next - dev",
+      "name": "apps/example-next-basic - dev",
       "type": "node",
       "request": "launch",
       "runtimeExecutable": "pnpm",
       "runtimeArgs": ["dev"],
-      "cwd": "${workspaceFolder}/apps/example-next",
+      "cwd": "${workspaceFolder}/apps/example-next-basic",
       "skipFiles": ["<node_internals>/**"],
       "outFiles": ["${workspaceFolder}/**/*.js"],
       "sourceMaps": true,
@@ -20,19 +20,169 @@
       ]
     },
     {
-      "name": "apps/example-next - start",
+      "name": "apps/example-next-basic - build",
+      "type": "node",
+      "request": "launch",
+      "runtimeExecutable": "pnpm",
+      "runtimeArgs": ["build"],
+      "cwd": "${workspaceFolder}/apps/example-next-basic",
+      "skipFiles": ["<node_internals>/**"],
+      "outFiles": ["${workspaceFolder}/**/*.js"],
+      "sourceMaps": true,
+      "resolveSourceMapLocations": [
+        "${workspaceFolder}/apps/example-next/**",
+        "!**/node_modules/**"
+      ]
+    },
+    {
+      "name": "apps/example-next-basic - start",
+      "type": "node",
+      "request": "launch",
+      "runtimeExecutable": "pnpm",
+      "runtimeArgs": ["start"],
+      "cwd": "${workspaceFolder}/apps/example-next-basic",
+      "skipFiles": ["<node_internals>/**"],
+      "outFiles": ["${workspaceFolder}/**/*.js"],
+      "sourceMaps": true,
+      "resolveSourceMapLocations": [
+        "${workspaceFolder}/apps/example-next/.next/server/**/*.js.map",
+        "!**/node_modules/**"
+      ]
+    },
+    {
+      "name": "apps/example-next-conform - dev",
+      "type": "node",
+      "request": "launch",
+      "runtimeExecutable": "pnpm",
+      "runtimeArgs": ["dev"],
+      "cwd": "${workspaceFolder}/apps/example-next-conform",
+      "skipFiles": ["<node_internals>/**"],
+      "outFiles": ["${workspaceFolder}/**/*.js"],
+      "sourceMaps": true,
+      "resolveSourceMapLocations": [
+        "${workspaceFolder}/apps/example-next/**",
+        "!**/node_modules/**"
+      ]
+    },
+    {
+      "name": "apps/example-next-conform - build",
+      "type": "node",
+      "request": "launch",
+      "runtimeExecutable": "pnpm",
+      "runtimeArgs": ["build"],
+      "cwd": "${workspaceFolder}/apps/example-next-conform",
+      "skipFiles": ["<node_internals>/**"],
+      "outFiles": ["${workspaceFolder}/**/*.js"],
+      "sourceMaps": true,
+      "resolveSourceMapLocations": [
+        "${workspaceFolder}/apps/example-next/**",
+        "!**/node_modules/**"
+      ]
+    },
+    {
+      "name": "apps/example-next-conform - start",
       "type": "node",
       "request": "launch",
       "runtimeExecutable": "pnpm",
       "runtimeArgs": ["start"],
-      "cwd": "${workspaceFolder}/apps/example-next",
+      "cwd": "${workspaceFolder}/apps/example-next-conform",
       "skipFiles": ["<node_internals>/**"],
       "outFiles": ["${workspaceFolder}/**/*.js"],
       "sourceMaps": true,
       "resolveSourceMapLocations": [
         "${workspaceFolder}/apps/example-next/.next/server/**/*.js.map",
         "!**/node_modules/**"
       ]
-    }
+    },
+    {
+      "name": "apps/example-next-custom-store - dev",
+      "type": "node",
+      "request": "launch",
+      "runtimeExecutable": "pnpm",
+      "runtimeArgs": ["dev"],
+      "cwd": "${workspaceFolder}/apps/example-next-custom-store",
+      "skipFiles": ["<node_internals>/**"],
+      "outFiles": ["${workspaceFolder}/**/*.js"],
+      "sourceMaps": true,
+      "resolveSourceMapLocations": [
+        "${workspaceFolder}/apps/example-next/**",
+        "!**/node_modules/**"
+      ]
+    },
+    {
+      "name": "apps/example-next-custom-store - build",
+      "type": "node",
+      "request": "launch",
+      "runtimeExecutable": "pnpm",
+      "runtimeArgs": ["build"],
+      "cwd": "${workspaceFolder}/apps/example-next-custom-store",
+      "skipFiles": ["<node_internals>/**"],
+      "outFiles": ["${workspaceFolder}/**/*.js"],
+      "sourceMaps": true,
+      "resolveSourceMapLocations": [
+        "${workspaceFolder}/apps/example-next/**",
+        "!**/node_modules/**"
+      ]
+    },
+    {
+      "name": "apps/example-next-custom-store - start",
+      "type": "node",
+      "request": "launch",
+      "runtimeExecutable": "pnpm",
+      "runtimeArgs": ["start"],
+      "cwd": "${workspaceFolder}/apps/example-next-custom-store",
+      "skipFiles": ["<node_internals>/**"],
+      "outFiles": ["${workspaceFolder}/**/*.js"],
+      "sourceMaps": true,
+      "resolveSourceMapLocations": [
+        "${workspaceFolder}/apps/example-next/.next/server/**/*.js.map",
+        "!**/node_modules/**"
+      ]
+    },
+    {
+      "name": "apps/example-next-unsafe-navigation - dev",
+      "type": "node",
+      "request": "launch",
+      "runtimeExecutable": "pnpm",
+      "runtimeArgs": ["dev"],
+      "cwd": "${workspaceFolder}/apps/example-next-unsafe-navigation",
+      "skipFiles": ["<node_internals>/**"],
+      "outFiles": ["${workspaceFolder}/**/*.js"],
+      "sourceMaps": true,
+      "resolveSourceMapLocations": [
+        "${workspaceFolder}/apps/example-next/**",
+        "!**/node_modules/**"
+      ]
+    },
+    {
+      "name": "apps/example-next-unsafe-navigation - build",
+      "type": "node",
+      "request": "launch",
+      "runtimeExecutable": "pnpm",
+      "runtimeArgs": ["build"],
+      "cwd": "${workspaceFolder}/apps/example-next-unsafe-navigation",
+      "skipFiles": ["<node_internals>/**"],
+      "outFiles": ["${workspaceFolder}/**/*.js"],
+      "sourceMaps": true,
+      "resolveSourceMapLocations": [
+        "${workspaceFolder}/apps/example-next/**",
+        "!**/node_modules/**"
+      ]
+    },
+    {
+      "name": "apps/example-next-unsafe-navigation - start",
+      "type": "node",
+      "request": "launch",
+      "runtimeExecutable": "pnpm",
+      "runtimeArgs": ["start"],
+      "cwd": "${workspaceFolder}/apps/example-next-unsafe-navigation",
+      "skipFiles": ["<node_internals>/**"],
+      "outFiles": ["${workspaceFolder}/**/*.js"],
+      "sourceMaps": true,
+      "resolveSourceMapLocations": [
+        "${workspaceFolder}/apps/example-next/.next/server/**/*.js.map",
+        "!**/node_modules/**"
+      ]
+    },
   ]
 }

.vscode/settings.json

@@ -0,0 +1,10 @@
+{
+  "editor.defaultFormatter": "biomejs.biome",
+  "editor.formatOnSave": true,
+  "[typescript]": {
+    "editor.defaultFormatter": "biomejs.biome"
+  },
+  "[javascript]": {
+    "editor.defaultFormatter": "biomejs.biome"
+  }
+}

apps/example-next-conform/.gitignore

@@ -0,0 +1,40 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+/test-results/
+/playwright-report/
+/blob-report/
+/playwright/.cache/

apps/example-next-conform/README.md

@@ -0,0 +1,12 @@
+# Examples next app with conform
+
+## Getting Started
+
+```
+$ pnpm i
+$ pnpm run dev
+```
+
+## Conform
+
+https://conform.guide/integration/nextjs

apps/example-next-conform/next.config.js

@@ -0,0 +1,15 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  experimental: {
+    scrollRestoration: true,
+  },
+  productionBrowserSourceMaps: true,
+  webpack: (config, { isServer }) => {
+    if (isServer) {
+      config.devtool = "source-map";
+    }
+    return config;
+  },
+};
+
+module.exports = nextConfig;

apps/example-next-conform/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "example-next-conform",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev --turbo",
+    "build": "next build",
+    "start": "next start",
+    "clean-start": "rm -rf .next && next build && next start",
+    "integration-test": "playwright test",
+    "integration-test:ui": "playwright test --ui"
+  },
+  "dependencies": {
+    "@conform-to/react": "1.1.3",
+    "@conform-to/zod": "1.1.3",
+    "@location-state/core": "workspace:*",
+    "@location-state/conform": "workspace:*",
+    "next": "14.1.4",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
+    "zod": "3.22.4"
+  },
+  "devDependencies": {
+    "@testing-library/jest-dom": "6.4.2",
+    "@types/node": "20.11.30",
+    "@types/react": "18.2.67",
+    "@types/react-dom": "18.2.22",
+    "typescript": "5.4.3"
+  }
+}

apps/example-next-conform/playwright.config.ts

@@ -0,0 +1,30 @@
+import { defineConfig, devices } from "@playwright/test";
+
+export default defineConfig({
+  // Look for test files in the "tests" directory, relative to this configuration file.
+  testDir: "playwright",
+  // Run all tests in parallel.
+  fullyParallel: true, // Fail the build on CI if you accidentally left test.only in the source code.
+  forbidOnly: !!process.env.CI, // Retry on CI only.
+  retries: process.env.CI ? 2 : 0, // Opt out of parallel tests on CI.
+  workers: process.env.CI ? 1 : undefined, // Reporter to use
+  reporter: "html",
+  use: {
+    // Base URL to use in actions like `await page.goto('/')`.
+    baseURL: "http://127.0.0.1:3000", // Collect trace when retrying the failed test.
+    trace: "on-first-retry",
+  },
+  // Configure projects for major browsers.
+  projects: [
+    {
+      name: "chromium",
+      use: { ...devices["Desktop Chrome"] },
+    },
+  ],
+  // Run your local dev server before starting the tests.
+  webServer: {
+    command: "pnpm build && pnpm start",
+    url: "http://127.0.0.1:3000",
+    reuseExistingServer: !process.env.CI,
+  },
+});