create-waku 0.7.1 → 0.7.3

package/cli.js

@@ -0,0 +1,4 @@
+#!/usr/bin/env node
+
+// eslint-disable-next-line import/no-unresolved
+import './dist/index.js';

package/dist/index.js

@@ -1,4 +1,3 @@
-#!/usr/bin/env node
 import{createRequire as t}from"module";var r={1706:t=>{
 /*!
  * @description Recursive object extending

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-waku",
-  "version": "0.7.1",
+  "version": "0.7.3",
   "author": "Daishi Kato",
   "type": "module",
   "contributors": [
@@ -12,7 +12,7 @@
     "directory": "packages/create-waku"
   },
   "bin": {
-    "create-waku": "./dist/index.js"
+    "create-waku": "./cli.js"
   },
   "files": [
     "dist",

package/template/01_template/package.json

@@ -9,14 +9,14 @@
     "start": "waku start --with-ssr"
   },
   "dependencies": {
-    "react": "18.3.0-canary-b30030471-20240117",
-    "react-dom": "18.3.0-canary-b30030471-20240117",
-    "react-server-dom-webpack": "18.3.0-canary-b30030471-20240117",
-    "waku": "0.19.1"
+    "react": "18.3.0-canary-14fd9630e-20240213",
+    "react-dom": "18.3.0-canary-14fd9630e-20240213",
+    "react-server-dom-webpack": "18.3.0-canary-14fd9630e-20240213",
+    "waku": "0.19.3"
   },
   "devDependencies": {
-    "@types/react": "18.2.48",
-    "@types/react-dom": "18.2.18",
+    "@types/react": "18.2.55",
+    "@types/react-dom": "18.2.19",
     "autoprefixer": "10.4.17",
     "tailwindcss": "3.4.1",
     "typescript": "5.3.3"

package/template/01_template/tsconfig.json

@@ -11,7 +11,7 @@
     "types": ["react/experimental"],
     "jsx": "react-jsx",
     "paths": {
-      "~/*": ["./src/*"],
-    },
-  },
+      "~/*": ["./src/*"]
+    }
+  }
 }

package/template/02_demo/package.json

@@ -9,14 +9,14 @@
     "start": "waku start --with-ssr"
   },
   "dependencies": {
-    "react": "18.3.0-canary-b30030471-20240117",
-    "react-dom": "18.3.0-canary-b30030471-20240117",
-    "react-server-dom-webpack": "18.3.0-canary-b30030471-20240117",
-    "waku": "0.19.1"
+    "react": "18.3.0-canary-14fd9630e-20240213",
+    "react-dom": "18.3.0-canary-14fd9630e-20240213",
+    "react-server-dom-webpack": "18.3.0-canary-14fd9630e-20240213",
+    "waku": "0.19.3"
   },
   "devDependencies": {
-    "@types/react": "18.2.48",
-    "@types/react-dom": "18.2.18",
+    "@types/react": "18.2.55",
+    "@types/react-dom": "18.2.19",
     "autoprefixer": "10.4.17",
     "tailwindcss": "3.4.1",
     "typescript": "5.3.3"

package/template/02_demo/src/components/footer.tsx

@@ -1,6 +1,6 @@
 export const Footer = () => {
   return (
-    <footer className="fixed bottom-0 left-0 p-6">
+    <footer className="p-6 lg:fixed lg:bottom-0 lg:left-0">
       <div>
         visit{' '}
         <a

package/template/02_demo/src/components/header.tsx

@@ -2,10 +2,18 @@ import { Link } from 'waku';
 
 export const Header = () => {
   return (
-    <header className="fixed left-0 top-0 p-6">
+    <header className="flex items-center gap-4 p-6 lg:fixed lg:left-0 lg:top-0">
       <h2 className="text-lg font-bold tracking-tight">
         <Link to="/">Waku pokemon</Link>
       </h2>
+      <a
+        href="https://github.com/dai-shi/waku/tree/main/examples/02_demo/src"
+        target="_blank"
+        rel="noreferrer"
+        className="text-sm hover:underline"
+      >
+        (source)
+      </a>
     </header>
   );
 };

package/template/02_demo/src/components/reload.tsx

@@ -0,0 +1,16 @@
+'use client';
+
+export const Reload = () => {
+  const handleReload = () => {
+    window.location.reload();
+  };
+
+  return (
+    <button
+      onClick={handleReload}
+      className="inline-flex aspect-square size-16 items-center justify-center rounded-full bg-black"
+    >
+      <span className="text-sm font-bold text-white">reload</span>
+    </button>
+  );
+};

package/template/02_demo/src/templates/home-page.tsx

@@ -1,5 +1,6 @@
 import { Link } from 'waku';
 
+import { Reload } from '../components/reload.js';
 import { sql } from '../lib/index.js';
 
 export const HomePage = async () => {
@@ -7,29 +8,42 @@ export const HomePage = async () => {
 
   return (
     <>
-      <title>Waku Pokemon</title>
-      <ul className="grid h-full w-full max-w-xl grid-cols-2 gap-6 px-6 py-20 leading-none md:grid-cols-3 md:px-0">
-        {rows.map((row) => (
-          <li key={row.id}>
-            <Link
-              to={`/${row.slug}`}
-              className="flex aspect-square w-full flex-shrink-0 flex-col items-center justify-center rounded-xl bg-gray-50 p-3 text-gray-950 transition-colors duration-500 ease-in-out hover:bg-gray-200"
-            >
-              <img
-                src={`https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/${row.id}.png`}
-                alt={row.slug}
-                className="size-[96px]"
-              />
-              <div className="flex flex-col items-center justify-center gap-1 font-bold">
-                <span className="font-bold">{row.name.english}</span>
-                <span className="font-zen-maru-gothic text-[0.875em] font-bold opacity-40">
-                  {row.name.japanese}
-                </span>
-              </div>
-            </Link>
-          </li>
-        ))}
-      </ul>
+      <title>Waku pokemon</title>
+      <div className="flex h-full w-full flex-col items-center justify-center p-6">
+        <div className="px-6">
+          <a
+            href="https://github.com/dai-shi/waku/tree/main/examples/02_demo/src"
+            target="_blank"
+            rel="noreferrer"
+            className="whitespace-nowrap text-xs font-bold hover:underline sm:text-base"
+          >{`SELECT * FROM pokemon ORDER BY RANDOM() LIMIT 9`}</a>
+        </div>
+        <ul className="relative mt-6 grid h-full w-full max-w-xl flex-shrink-0 grid-cols-2 gap-6 leading-none md:grid-cols-3 md:px-0">
+          {rows.map((row) => (
+            <li key={row.id}>
+              <Link
+                to={`/${row.slug}`}
+                className="flex aspect-square w-full flex-shrink-0 flex-col items-center justify-center rounded-xl bg-gray-50 p-3 text-gray-950 transition-colors duration-500 ease-in-out hover:bg-gray-200"
+              >
+                <img
+                  src={`https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/${row.id}.png`}
+                  alt={row.slug}
+                  className="size-[96px]"
+                />
+                <div className="flex flex-col items-center justify-center gap-1 font-bold">
+                  <span className="font-bold">{row.name.english}</span>
+                  <span className="font-zen-maru-gothic text-[0.875em] font-bold opacity-40">
+                    {row.name.japanese}
+                  </span>
+                </div>
+              </Link>
+            </li>
+          ))}
+          <div className="absolute bottom-0 right-0 md:translate-x-full md:translate-y-full md:p-3">
+            <Reload />
+          </div>
+        </ul>
+      </div>
     </>
   );
 };

package/template/02_demo/src/templates/pokemon-page.tsx

@@ -13,51 +13,53 @@ export const PokemonPage = async ({ slug }: PokemonPageProps) => {
   return (
     <>
       <title>{`Waku ${pokemon.name.english}`}</title>
-      <div className="mx-auto flex w-1/2 flex-col items-center justify-center gap-6 leading-none md:w-full md:max-w-xl">
-        <div>
-          <ul className="flex items-center justify-center gap-1.5">
-            {pokemon.type.map((type) => (
-              <div
-                key={type}
-                className="rounded-full bg-gray-100 px-3 py-1 text-xs font-bold uppercase leading-none tracking-wide text-black/60"
-              >
-                {type}
-              </div>
-            ))}
-          </ul>
-        </div>
-        <div className="inline-flex aspect-square flex-col items-center justify-center">
-          <img
-            src={`https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/${pokemon.id}.png`}
-            alt={pokemon.slug}
-            className="size-[144px]"
-          />
-          <div className="flex flex-col items-center justify-center gap-1 text-2xl leading-none">
-            <span className="font-bold">{pokemon.name.english}</span>
-            <span className="font-zen-maru-gothic text-[0.875em] font-bold opacity-40">
-              {pokemon.name.japanese}
-            </span>
+      <div className="w-full p-6">
+        <div className="mx-auto flex w-full flex-shrink-0 flex-col items-center justify-center gap-6 rounded-xl bg-gray-50 p-12 leading-none md:w-full md:max-w-xl">
+          <div>
+            <ul className="flex items-center justify-center gap-1.5">
+              {pokemon.type.map((type) => (
+                <div
+                  key={type}
+                  className="rounded-full bg-gray-200 px-3 py-1 text-xs font-bold uppercase leading-none tracking-wide text-black/60"
+                >
+                  {type}
+                </div>
+              ))}
+            </ul>
+          </div>
+          <div className="inline-flex aspect-square flex-col items-center justify-center">
+            <img
+              src={`https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/${pokemon.id}.png`}
+              alt={pokemon.slug}
+              className="block size-[144px] flex-shrink-0"
+            />
+            <div className="flex flex-col items-center justify-center gap-1 text-2xl leading-none">
+              <span className="font-bold">{pokemon.name.english}</span>
+              <span className="font-zen-maru-gothic text-[0.875em] font-bold opacity-40">
+                {pokemon.name.japanese}
+              </span>
+            </div>
+          </div>
+          <div className="hidden lg:block">
+            <ul className="mx-auto flex w-32 flex-col flex-wrap justify-center gap-1.5">
+              {stats.map(([stat, value]: any) => (
+                <li
+                  key={stat}
+                  className="inline-block rounded-sm bg-black px-1.5 py-1 text-[0.5rem] font-bold uppercase tracking-wider text-white"
+                >
+                  {stat}: {value}
+                </li>
+              ))}
+            </ul>
+          </div>
+          <div className="mt-12">
+            <Link
+              to="/"
+              className="inline-flex aspect-square size-16 items-center justify-center rounded-full bg-black text-sm font-bold text-white"
+            >
+              <span>back</span>
+            </Link>
           </div>
-        </div>
-        <div>
-          <ul className="mx-auto flex w-32 flex-col flex-wrap justify-center gap-1.5">
-            {stats.map(([stat, value]: any) => (
-              <li
-                key={stat}
-                className="inline-block rounded-sm bg-black px-1.5 py-1 text-[0.5rem] font-bold uppercase tracking-wider text-white"
-              >
-                {stat}: {value}
-              </li>
-            ))}
-          </ul>
-        </div>
-        <div className="mt-12">
-          <Link
-            to="/"
-            className="inline-block rounded-xl bg-gray-100 px-6 py-4 font-bold transition-colors duration-500 ease-in-out hover:bg-gray-200"
-          >
-            back
-          </Link>
         </div>
       </div>
     </>

package/template/02_demo/src/templates/root-layout.tsx

@@ -15,7 +15,7 @@ export const RootLayout = async ({ children }: RootLayoutProps) => {
       <meta property="description" content={data.description} />
       <link rel="icon" type="image/png" href={data.icon} />
       <Header />
-      <main className="flex min-h-svh items-center justify-center">
+      <main className="flex items-center justify-center lg:min-h-svh">
         {children}
       </main>
       <Footer />

package/template/02_demo/tsconfig.json

@@ -11,7 +11,7 @@
     "types": ["react/experimental"],
     "jsx": "react-jsx",
     "paths": {
-      "~/*": ["./src/*"],
-    },
-  },
+      "~/*": ["./src/*"]
+    }
+  }
 }

package/template/03_minimal/package.json

@@ -9,14 +9,14 @@
     "start": "waku start --with-ssr"
   },
   "dependencies": {
-    "react": "18.3.0-canary-b30030471-20240117",
-    "react-dom": "18.3.0-canary-b30030471-20240117",
-    "react-server-dom-webpack": "18.3.0-canary-b30030471-20240117",
-    "waku": "0.19.1"
+    "react": "18.3.0-canary-14fd9630e-20240213",
+    "react-dom": "18.3.0-canary-14fd9630e-20240213",
+    "react-server-dom-webpack": "18.3.0-canary-14fd9630e-20240213",
+    "waku": "0.19.3"
   },
   "devDependencies": {
-    "@types/react": "18.2.48",
-    "@types/react-dom": "18.2.18",
+    "@types/react": "18.2.55",
+    "@types/react-dom": "18.2.19",
     "typescript": "5.3.3"
   }
 }

package/template/03_minimal/tsconfig.json

@@ -9,6 +9,6 @@
     "noUncheckedIndexedAccess": true,
     "exactOptionalPropertyTypes": true,
     "types": ["react/experimental"],
-    "jsx": "react-jsx",
-  },
+    "jsx": "react-jsx"
+  }
 }

package/template/04_promise/package.json

@@ -9,14 +9,14 @@
     "start": "waku start --with-ssr"
   },
   "dependencies": {
-    "react": "18.3.0-canary-b30030471-20240117",
-    "react-dom": "18.3.0-canary-b30030471-20240117",
-    "react-server-dom-webpack": "18.3.0-canary-b30030471-20240117",
-    "waku": "0.19.1"
+    "react": "18.3.0-canary-14fd9630e-20240213",
+    "react-dom": "18.3.0-canary-14fd9630e-20240213",
+    "react-server-dom-webpack": "18.3.0-canary-14fd9630e-20240213",
+    "waku": "0.19.3"
   },
   "devDependencies": {
-    "@types/react": "18.2.48",
-    "@types/react-dom": "18.2.18",
+    "@types/react": "18.2.55",
+    "@types/react-dom": "18.2.19",
     "typescript": "5.3.3"
   }
 }

package/template/04_promise/src/components/Counter.tsx

@@ -3,6 +3,8 @@
 
 import { Suspense, useState, use } from 'react';
 
+import { Hello } from './Hello.js';
+
 export const Counter = ({
   delayedMessage,
 }: {
@@ -17,6 +19,7 @@ export const Counter = ({
       <Suspense fallback="Pending...">
         <Message count={count} delayedMessage={delayedMessage} />
       </Suspense>
+      <Hello />
     </div>
   );
 };

package/template/04_promise/src/components/Hello.tsx

@@ -0,0 +1,7 @@
+export const Hello = () => {
+  return (
+    <div style={{ border: '3px gray dashed', margin: '1em', padding: '1em' }}>
+      This is a component without {'"use client"'}.
+    </div>
+  );
+};

package/template/04_promise/tsconfig.json

@@ -9,6 +9,6 @@
     "noUncheckedIndexedAccess": true,
     "exactOptionalPropertyTypes": true,
     "types": ["react/experimental"],
-    "jsx": "react-jsx",
-  },
+    "jsx": "react-jsx"
+  }
 }

package/template/05_actions/package.json

@@ -9,15 +9,15 @@
     "start": "waku start --with-ssr"
   },
   "dependencies": {
-    "react": "18.3.0-canary-b30030471-20240117",
-    "react-dom": "18.3.0-canary-b30030471-20240117",
-    "react-server-dom-webpack": "18.3.0-canary-b30030471-20240117",
+    "react": "18.3.0-canary-14fd9630e-20240213",
+    "react-dom": "18.3.0-canary-14fd9630e-20240213",
+    "react-server-dom-webpack": "18.3.0-canary-14fd9630e-20240213",
     "react-wrap-balancer": "1.1.0",
-    "waku": "0.19.1"
+    "waku": "0.19.3"
   },
   "devDependencies": {
-    "@types/react": "18.2.48",
-    "@types/react-dom": "18.2.18",
+    "@types/react": "18.2.55",
+    "@types/react-dom": "18.2.19",
     "typescript": "5.3.3"
   }
 }

package/template/05_actions/src/components/App.tsx

@@ -1,6 +1,6 @@
 import { Balancer } from 'react-wrap-balancer';
 
-import { Counter } from './Counter.js';
+import Counter from './Counter.js';
 import { greet, getCounter, increment } from './funcs.js';
 
 type ServerFunction<T> = T extends (...args: infer A) => infer R

package/template/05_actions/src/components/Counter.tsx

@@ -4,7 +4,7 @@ import { useState, useTransition } from 'react';
 
 import { TextBox } from './TextBox.js';
 
-export const Counter = ({
+const Counter = ({
   greet,
   increment,
 }: {
@@ -36,3 +36,5 @@ export const Counter = ({
     </div>
   );
 };
+
+export default Counter;

package/template/05_actions/tsconfig.json

@@ -9,6 +9,6 @@
     "noUncheckedIndexedAccess": true,
     "exactOptionalPropertyTypes": true,
     "types": ["react/experimental"],
-    "jsx": "react-jsx",
-  },
+    "jsx": "react-jsx"
+  }
 }

package/template/05_actions/vite.config.ts

@@ -0,0 +1,6 @@
+/** @type {import('vite').UserConfig} */
+export default {
+  ssr: {
+    noExternal: ['react-wrap-balancer'],
+  },
+};

package/template/06_nesting/package.json

@@ -9,14 +9,14 @@
     "start": "waku start --with-ssr"
   },
   "dependencies": {
-    "react": "18.3.0-canary-b30030471-20240117",
-    "react-dom": "18.3.0-canary-b30030471-20240117",
-    "react-server-dom-webpack": "18.3.0-canary-b30030471-20240117",
-    "waku": "0.19.1"
+    "react": "18.3.0-canary-14fd9630e-20240213",
+    "react-dom": "18.3.0-canary-14fd9630e-20240213",
+    "react-server-dom-webpack": "18.3.0-canary-14fd9630e-20240213",
+    "waku": "0.19.3"
   },
   "devDependencies": {
-    "@types/react": "18.2.48",
-    "@types/react-dom": "18.2.18",
+    "@types/react": "18.2.55",
+    "@types/react-dom": "18.2.19",
     "typescript": "5.3.3"
   }
 }

package/template/06_nesting/tsconfig.json

@@ -9,6 +9,6 @@
     "noUncheckedIndexedAccess": true,
     "exactOptionalPropertyTypes": true,
     "types": ["react/experimental"],
-    "jsx": "react-jsx",
-  },
+    "jsx": "react-jsx"
+  }
 }

package/template/07_router/package.json

@@ -9,14 +9,14 @@
     "start": "waku start --with-ssr"
   },
   "dependencies": {
-    "react": "18.3.0-canary-b30030471-20240117",
-    "react-dom": "18.3.0-canary-b30030471-20240117",
-    "react-server-dom-webpack": "18.3.0-canary-b30030471-20240117",
-    "waku": "0.19.1"
+    "react": "18.3.0-canary-14fd9630e-20240213",
+    "react-dom": "18.3.0-canary-14fd9630e-20240213",
+    "react-server-dom-webpack": "18.3.0-canary-14fd9630e-20240213",
+    "waku": "0.19.3"
   },
   "devDependencies": {
-    "@types/react": "18.2.48",
-    "@types/react-dom": "18.2.18",
+    "@types/react": "18.2.55",
+    "@types/react-dom": "18.2.19",
     "server-only": "0.0.1",
     "typescript": "5.3.3"
   }

package/template/07_router/src/components/HomeLayout.tsx

@@ -2,6 +2,8 @@ import type { ReactNode } from 'react';
 
 import { Link } from 'waku/router/client';
 
+import '../styles.css';
+
 const Pending = ({ isPending }: { isPending: boolean }) => (
   <span
     style={{

package/template/07_router/src/styles.css

@@ -0,0 +1,3 @@
+body {
+  background-color: #fefefe;
+}

package/template/07_router/tsconfig.json

@@ -9,6 +9,6 @@
     "noUncheckedIndexedAccess": true,
     "exactOptionalPropertyTypes": true,
     "types": ["react/experimental"],
-    "jsx": "react-jsx",
-  },
+    "jsx": "react-jsx"
+  }
 }

package/template/08_cookies/package.json

@@ -11,15 +11,15 @@
   "dependencies": {
     "cookie-parser": "1.4.6",
     "express": "4.18.2",
-    "react": "18.3.0-canary-b30030471-20240117",
-    "react-dom": "18.3.0-canary-b30030471-20240117",
-    "react-server-dom-webpack": "18.3.0-canary-b30030471-20240117",
-    "waku": "0.19.1"
+    "react": "18.3.0-canary-14fd9630e-20240213",
+    "react-dom": "18.3.0-canary-14fd9630e-20240213",
+    "react-server-dom-webpack": "18.3.0-canary-14fd9630e-20240213",
+    "waku": "0.19.3"
   },
   "devDependencies": {
-    "@types/node": "20.11.5",
-    "@types/react": "18.2.48",
-    "@types/react-dom": "18.2.18",
+    "@types/node": "20.11.17",
+    "@types/react": "18.2.55",
+    "@types/react-dom": "18.2.19",
     "typescript": "5.3.3"
   }
 }

package/template/08_cookies/tsconfig.json

@@ -9,6 +9,6 @@
     "noUncheckedIndexedAccess": true,
     "exactOptionalPropertyTypes": true,
     "types": ["react/experimental", "node"],
-    "jsx": "react-jsx",
-  },
+    "jsx": "react-jsx"
+  }
 }

package/template/09_cssmodules/package.json

@@ -9,14 +9,14 @@
     "start": "waku start --with-ssr"
   },
   "dependencies": {
-    "react": "18.3.0-canary-b30030471-20240117",
-    "react-dom": "18.3.0-canary-b30030471-20240117",
-    "react-server-dom-webpack": "18.3.0-canary-b30030471-20240117",
-    "waku": "0.19.1"
+    "react": "18.3.0-canary-14fd9630e-20240213",
+    "react-dom": "18.3.0-canary-14fd9630e-20240213",
+    "react-server-dom-webpack": "18.3.0-canary-14fd9630e-20240213",
+    "waku": "0.19.3"
   },
   "devDependencies": {
-    "@types/react": "18.2.48",
-    "@types/react-dom": "18.2.18",
+    "@types/react": "18.2.55",
+    "@types/react-dom": "18.2.19",
     "typescript": "5.3.3"
   }
 }

package/template/09_cssmodules/tsconfig.json

@@ -9,6 +9,6 @@
     "noUncheckedIndexedAccess": true,
     "exactOptionalPropertyTypes": true,
     "types": ["react/experimental"],
-    "jsx": "react-jsx",
-  },
+    "jsx": "react-jsx"
+  }
 }

package/template/10_dynamicroute/package.json

@@ -10,14 +10,14 @@
   },
   "dependencies": {
     "glob": "10.3.10",
-    "react": "18.3.0-canary-b30030471-20240117",
-    "react-dom": "18.3.0-canary-b30030471-20240117",
-    "react-server-dom-webpack": "18.3.0-canary-b30030471-20240117",
-    "waku": "0.19.1"
+    "react": "18.3.0-canary-14fd9630e-20240213",
+    "react-dom": "18.3.0-canary-14fd9630e-20240213",
+    "react-server-dom-webpack": "18.3.0-canary-14fd9630e-20240213",
+    "waku": "0.19.3"
   },
   "devDependencies": {
-    "@types/react": "18.2.48",
-    "@types/react-dom": "18.2.18",
+    "@types/react": "18.2.55",
+    "@types/react-dom": "18.2.19",
     "typescript": "5.3.3"
   }
 }

package/template/10_dynamicroute/src/entries.tsx

@@ -54,24 +54,27 @@ const getMappingAndItems = async (id: string) => {
   return { mapping, items };
 };
 
-const getStaticPaths = async () => {
+const getPathConfig = async () => {
   const files = await glob('**/page.{tsx,js}', { cwd: routesDir });
-  return files
-    .filter((file) => !/(^|\/)(\[\w+\]|_\w+_)\//.test(file))
-    .map((file) => '/' + file.slice(0, Math.max(0, file.lastIndexOf('/'))));
+  return files.map((file) => {
+    const names = file.split('/').filter(Boolean).slice(0, -1);
+    const pathSpec = names.map((name) => {
+      const match = name.match(/^(\[\w+\]|_\w+_)$/);
+      if (match) {
+        return { type: 'group', name: match[1]!.slice(1, -1) } as const;
+      }
+      return { type: 'literal', name } as const;
+    });
+    return {
+      path: pathSpec,
+      isStatic: pathSpec.every(({ type }) => type === 'literal'),
+    };
+  });
 };
 
 export default defineRouter(
-  // existsPath
-  async (path: string) => {
-    if ((await getStaticPaths()).includes(path)) {
-      return 'static';
-    }
-    if ((await getMappingAndItems(path + '/page')) !== null) {
-      return 'dynamic';
-    }
-    return null;
-  },
+  // getPathConfig
+  () => getPathConfig(),
   // getComponent (id is "**/layout" or "**/page")
   async (id, unstable_setShouldSkip) => {
     unstable_setShouldSkip({}); // always skip if possible
@@ -86,6 +89,4 @@ export default defineRouter(
     );
     return Component;
   },
-  // getPathsForBuild
-  () => getStaticPaths(),
 );

package/template/10_dynamicroute/tsconfig.json

@@ -9,6 +9,6 @@
     "noUncheckedIndexedAccess": true,
     "exactOptionalPropertyTypes": true,
     "types": ["react/experimental"],
-    "jsx": "react-jsx",
-  },
+    "jsx": "react-jsx"
+  }
 }

package/template/10_dynamicroute/vite.config.ts

@@ -7,9 +7,6 @@ const routeFiles = glob.sync('routes/**/*.{tsx,js}', { cwd: rootDir });
 
 /** @type {import('vite').UserConfig} */
 export default {
-  ssr: {
-    external: ['glob'],
-  },
   build: {
     rollupOptions: {
       input: Object.fromEntries(

package/template/11_form/package.json

@@ -9,14 +9,14 @@
     "start": "waku start --with-ssr"
   },
   "dependencies": {
-    "react": "18.3.0-canary-b30030471-20240117",
-    "react-dom": "18.3.0-canary-b30030471-20240117",
-    "react-server-dom-webpack": "18.3.0-canary-b30030471-20240117",
-    "waku": "0.19.1"
+    "react": "18.3.0-canary-14fd9630e-20240213",
+    "react-dom": "18.3.0-canary-14fd9630e-20240213",
+    "react-server-dom-webpack": "18.3.0-canary-14fd9630e-20240213",
+    "waku": "0.19.3"
   },
   "devDependencies": {
-    "@types/react": "18.2.48",
-    "@types/react-dom": "18.2.18",
+    "@types/react": "18.2.55",
+    "@types/react-dom": "18.2.19",
     "typescript": "5.3.3"
   }
 }

package/template/11_form/tsconfig.json

@@ -9,6 +9,6 @@
     "noUncheckedIndexedAccess": true,
     "exactOptionalPropertyTypes": true,
     "types": ["react/experimental"],
-    "jsx": "react-jsx",
-  },
+    "jsx": "react-jsx"
+  }
 }

package/template/12_css/package.json

@@ -9,20 +9,20 @@
     "start": "waku start --with-ssr"
   },
   "dependencies": {
-    "@stylexjs/stylex": "0.4.1",
-    "@vanilla-extract/css": "1.14.0",
+    "@stylexjs/stylex": "0.5.1",
+    "@vanilla-extract/css": "1.14.1",
     "classnames": "2.3.2",
-    "react": "18.3.0-canary-b30030471-20240117",
-    "react-dom": "18.3.0-canary-b30030471-20240117",
-    "react-server-dom-webpack": "18.3.0-canary-b30030471-20240117",
-    "waku": "0.19.1"
+    "react": "18.3.0-canary-14fd9630e-20240213",
+    "react-dom": "18.3.0-canary-14fd9630e-20240213",
+    "react-server-dom-webpack": "18.3.0-canary-14fd9630e-20240213",
+    "waku": "0.19.3"
   },
   "devDependencies": {
-    "@types/react": "18.2.48",
-    "@types/react-dom": "18.2.18",
-    "@vanilla-extract/vite-plugin": "3.9.4",
+    "@types/react": "18.2.55",
+    "@types/react-dom": "18.2.19",
+    "@vanilla-extract/vite-plugin": "3.9.5",
     "typescript": "5.3.3",
     "vite": "5.0.12",
-    "vite-plugin-stylex-dev": "0.2.4"
+    "vite-plugin-stylex-dev": "0.3.0"
   }
 }

package/template/12_css/tsconfig.json

@@ -9,6 +9,6 @@
     "noUncheckedIndexedAccess": true,
     "exactOptionalPropertyTypes": true,
     "types": ["react/experimental"],
-    "jsx": "react-jsx",
-  },
+    "jsx": "react-jsx"
+  }
 }

package/template/12_css/vite.config.ts

@@ -1,12 +1,7 @@
-import { defineConfig } from 'vite';
 import { vanillaExtractPlugin } from '@vanilla-extract/vite-plugin';
 import { stylexPlugin } from 'vite-plugin-stylex-dev';
 
-export default defineConfig(({ mode }) => ({
-  ...(mode === 'development' && {
-    ssr: {
-      external: ['@stylexjs/stylex', 'classnames'],
-    },
-  }),
+/** @type {import('vite').UserConfig} */
+export default {
   plugins: [vanillaExtractPlugin({ emitCssInSsr: true }), stylexPlugin()],
-}));
+};

package/template/13_path-alias/package.json

@@ -9,16 +9,16 @@
     "start": "waku start --with-ssr"
   },
   "dependencies": {
-    "react": "18.3.0-canary-b30030471-20240117",
-    "react-dom": "18.3.0-canary-b30030471-20240117",
-    "react-server-dom-webpack": "18.3.0-canary-b30030471-20240117",
-    "waku": "0.19.1"
+    "react": "18.3.0-canary-14fd9630e-20240213",
+    "react-dom": "18.3.0-canary-14fd9630e-20240213",
+    "react-server-dom-webpack": "18.3.0-canary-14fd9630e-20240213",
+    "waku": "0.19.3"
   },
   "devDependencies": {
-    "@types/react": "18.2.48",
-    "@types/react-dom": "18.2.18",
+    "@types/react": "18.2.55",
+    "@types/react-dom": "18.2.19",
     "typescript": "5.3.3",
     "vite": "5.0.12",
-    "vite-tsconfig-paths": "4.2.3"
+    "vite-tsconfig-paths": "4.3.1"
   }
 }

package/template/13_path-alias/tsconfig.json

@@ -11,7 +11,7 @@
     "types": ["react/experimental"],
     "jsx": "react-jsx",
     "paths": {
-      "@/*": ["./src/*"],
-    },
-  },
+      "@/*": ["./src/*"]
+    }
+  }
 }

package/template/13_path-alias/vite.config.ts

@@ -1,6 +1,11 @@
-import { defineConfig } from 'vite';
 import tsconfigPaths from 'vite-tsconfig-paths';
+import { fileURLToPath } from 'node:url';
 
-export default defineConfig({
-  plugins: [tsconfigPaths()],
-});
+/** @type {import('vite').UserConfig} */
+export default {
+  plugins: [
+    tsconfigPaths({
+      root: fileURLToPath(new URL('.', import.meta.url)),
+    }),
+  ],
+};