waku-navigation 0.0.0 → 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2026 Daishi Kato
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/README.md

@@ -0,0 +1,31 @@
+# waku-navigation
+
+Experimental Waku Router implementation with Navigation API
+
+## Install
+
+```bash
+npm install waku-navigation
+```
+
+## Usage
+
+Create this file as `./src/waku.client.tsx`:
+
+```tsx
+import { StrictMode } from 'react';
+import { createRoot, hydrateRoot } from 'react-dom/client';
+import { Router } from 'waku-navigation';
+
+const rootElement = (
+  <StrictMode>
+    <Router />
+  </StrictMode>
+);
+
+if ((globalThis as any).__WAKU_HYDRATE__) {
+  hydrateRoot(document, rootElement);
+} else {
+  createRoot(document as any).render(rootElement);
+}
+```

package/dist/client.d.ts

@@ -0,0 +1 @@
+export declare function Router(): import("react/jsx-runtime").JSX.Element;

package/dist/client.js

@@ -0,0 +1,30 @@
+/// <reference types="dom-navigation" />
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { Root, Slot, useRefetch } from 'waku/minimal/client';
+import { unstable_encodeRoutePath as encodeRoutePath, unstable_getHttpStatusFromMeta as getHttpStatusFromMeta, unstable_parseRoute as parseRoute, unstable_getRouteSlotId as getRouteSlotId, } from 'waku/router/client';
+function InnerRouter({ initialRoute, httpStatus, }) {
+    const refetch = useRefetch();
+    const [routePath, setRoutePath] = useState(initialRoute.path);
+    useEffect(() => {
+        const callback = (event) => {
+            // TODO: check if it's an external navigation
+            event.intercept();
+            const route = parseRoute(new URL(event.destination.url));
+            const rscPath = encodeRoutePath(route.path);
+            refetch(rscPath);
+            setRoutePath(route.path);
+        };
+        window.navigation.addEventListener('navigate', callback);
+        return () => {
+            window.navigation.removeEventListener('navigate', callback);
+        };
+    }, [refetch]);
+    return (_jsxs(Slot, { id: "root", children: [_jsx("meta", { name: "httpstatus", content: httpStatus }), _jsx(Slot, { id: getRouteSlotId(routePath) })] }));
+}
+export function Router() {
+    const initialRoute = parseRoute(new URL(window.navigation.currentEntry.url));
+    const httpStatus = getHttpStatusFromMeta();
+    return (_jsx(Root, { initialRscPath: encodeRoutePath(initialRoute.path), children: _jsx(InnerRouter, { initialRoute: initialRoute, httpStatus: httpStatus }) }));
+}

package/dist/index.d.ts

@@ -0,0 +1 @@
+export { Router } from './client.js';

package/dist/index.js

@@ -0,0 +1 @@
+export { Router } from './client.js';

package/package.json

@@ -1,4 +1,74 @@
 {
   "name": "waku-navigation",
-  "version": "0.0.0"
+  "description": "Waku Router implementation with Navigation API",
+  "version": "0.0.1",
+  "type": "module",
+  "packageManager": "pnpm@10.28.0",
+  "author": "Daishi Kato",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/wakujs/waku-navigation.git"
+  },
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    }
+  },
+  "sideEffects": false,
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "compile": "rm -rf dist && tsc -p .",
+    "test": "pnpm run '/^test:.*/'",
+    "test:format": "prettier -c .",
+    "test:lint": "eslint .",
+    "test:types": "tsc -p . --noEmit",
+    "test:types:examples": "tsc -p examples --noEmit",
+    "test:spec": "vitest run",
+    "examples:01_minimal": "(cd examples/01_minimal; waku dev)"
+  },
+  "keywords": [
+    "react",
+    "waku",
+    "navigation"
+  ],
+  "license": "MIT",
+  "prettier": {
+    "singleQuote": true
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.39.2",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.1",
+    "@testing-library/user-event": "^14.6.1",
+    "@types/dom-navigation": "^1.0.6",
+    "@types/node": "^25.0.6",
+    "@types/react": "^19.2.8",
+    "@types/react-dom": "^19.2.3",
+    "eslint": "^9.39.2",
+    "eslint-import-resolver-typescript": "^4.4.4",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "happy-dom": "^20.1.0",
+    "prettier": "^3.7.4",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
+    "react-server-dom-webpack": "^19.2.3",
+    "ts-expect": "^1.3.0",
+    "typescript": "^5.9.3",
+    "typescript-eslint": "^8.52.0",
+    "vite": "^7.3.1",
+    "vitest": "^4.0.16",
+    "waku": "https://pkg.pr.new/wakujs/waku@fc78f84",
+    "waku-navigation": "link:"
+  },
+  "peerDependencies": {
+    "react": ">=19.0.0",
+    "waku": ">=1.0.0-alpha.1"
+  }
 }