react-bun-ssr 0.3.0 → 0.3.1

package/README.md

@@ -57,9 +57,15 @@ For the full setup walkthrough, read the installation guide:
 `rbssr init` scaffolds a small Bun-first SSR app:
 
 ```text
+package.json
+tsconfig.json
+.gitignore
 app/
   root.tsx
+  root.module.css
   middleware.ts
+  public/
+    favicon.svg
   routes/
     index.tsx
     api/
@@ -67,8 +73,13 @@ app/
 rbssr.config.ts
 ```
 
+- `package.json`: Bun scripts and framework/runtime dependencies
+- `tsconfig.json`: starter TypeScript config for Bun + JSX
+- `.gitignore`: minimal app-level ignore rules
 - `app/root.tsx`: document shell and top-level layout
+- `app/root.module.css`: starter CSS Module for layout and base presentation
 - `app/middleware.ts`: global request pipeline hook
+- `app/public/favicon.svg`: starter public asset
 - `app/routes/index.tsx`: first SSR page route
 - `app/routes/api/health.ts`: first API route
 - `rbssr.config.ts`: runtime configuration entrypoint

package/framework/cli/scaffold.ts

@@ -6,6 +6,23 @@ interface ScaffoldFile {
   content: string;
 }
 
+interface FrameworkPackageManifest {
+  version?: string;
+  devDependencies?: Record<string, string>;
+}
+
+const DEFAULT_FRAMEWORK_VERSION = "0.0.0";
+const DEFAULT_TYPESCRIPT_VERSION = "^5";
+const DEFAULT_BUN_TYPES_VERSION = "latest";
+const DEFAULT_REACT_TYPES_VERSION = "^19";
+const FAVICON_SVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 96 96">
+  <rect width="96" height="96" rx="20" fill="#111827"/>
+  <path d="M25 28h20c13.807 0 25 11.193 25 25S58.807 78 45 78H25V28Zm18 40c8.837 0 16-7.163 16-16s-7.163-16-16-16h-8v32h8Z" fill="#f9fafb"/>
+</svg>
+`;
+
+let frameworkPackageManifestPromise: Promise<FrameworkPackageManifest> | null = null;
+
 async function writeIfMissing(filePath: string, content: string, force: boolean): Promise<void> {
   if (!force && await existsPath(filePath)) {
     return;
@@ -14,8 +31,115 @@ async function writeIfMissing(filePath: string, content: string, force: boolean)
   await writeText(filePath, content);
 }
 
-function templateFiles(cwd: string): ScaffoldFile[] {
+function getFrameworkPackageManifest(): Promise<FrameworkPackageManifest> {
+  if (!frameworkPackageManifestPromise) {
+    const packageJsonPath = path.resolve(import.meta.dir, "../../package.json");
+    frameworkPackageManifestPromise = Bun.file(packageJsonPath).json() as Promise<FrameworkPackageManifest>;
+  }
+
+  return frameworkPackageManifestPromise;
+}
+
+function normalizePackageName(cwd: string): string {
+  const baseName = path.basename(path.resolve(cwd));
+  const normalized = baseName
+    .toLowerCase()
+    .replace(/[^a-z0-9._-]+/g, "-")
+    .replace(/[._-]{2,}/g, "-")
+    .replace(/^[._-]+|[._-]+$/g, "");
+
+  return normalized || "rbssr-app";
+}
+
+function createPackageJsonContent(options: {
+  cwd: string;
+  frameworkVersion: string;
+  typescriptVersion: string;
+  bunTypesVersion: string;
+  reactTypesVersion: string;
+  reactDomTypesVersion: string;
+}): string {
+  const packageJson = {
+    name: normalizePackageName(options.cwd),
+    version: "0.0.0",
+    private: true,
+    type: "module",
+    scripts: {
+      dev: "rbssr dev",
+      build: "rbssr build",
+      start: "rbssr start",
+      typecheck: "bunx tsc --noEmit",
+    },
+    dependencies: {
+      "react-bun-ssr": options.frameworkVersion,
+      react: "^19",
+      "react-dom": "^19",
+    },
+    devDependencies: {
+      "@types/react": options.reactTypesVersion,
+      "@types/react-dom": options.reactDomTypesVersion,
+      "bun-types": options.bunTypesVersion,
+      typescript: options.typescriptVersion,
+    },
+  };
+
+  return `${JSON.stringify(packageJson, null, 2)}\n`;
+}
+
+function createTsconfigContent(): string {
+  const tsconfig = {
+    compilerOptions: {
+      target: "ESNext",
+      module: "Preserve",
+      moduleResolution: "Bundler",
+      jsx: "react-jsx",
+      strict: true,
+      types: ["bun-types"],
+    },
+    include: ["app", "rbssr.config.ts"],
+  };
+
+  return `${JSON.stringify(tsconfig, null, 2)}\n`;
+}
+
+function createGitignoreContent(): string {
+  return `node_modules
+dist
+.rbssr
+.env
+.env.local
+.DS_Store
+`;
+}
+
+async function templateFiles(cwd: string): Promise<ScaffoldFile[]> {
+  const frameworkPackage = await getFrameworkPackageManifest();
+  const frameworkVersion = frameworkPackage.version ?? DEFAULT_FRAMEWORK_VERSION;
+  const typescriptVersion = frameworkPackage.devDependencies?.typescript ?? DEFAULT_TYPESCRIPT_VERSION;
+  const bunTypesVersion = frameworkPackage.devDependencies?.["bun-types"] ?? DEFAULT_BUN_TYPES_VERSION;
+  const reactTypesVersion = frameworkPackage.devDependencies?.["@types/react"] ?? DEFAULT_REACT_TYPES_VERSION;
+  const reactDomTypesVersion = frameworkPackage.devDependencies?.["@types/react-dom"] ?? DEFAULT_REACT_TYPES_VERSION;
+
   return [
+    {
+      filePath: path.join(cwd, "package.json"),
+      content: createPackageJsonContent({
+        cwd,
+        frameworkVersion,
+        typescriptVersion,
+        bunTypesVersion,
+        reactTypesVersion,
+        reactDomTypesVersion,
+      }),
+    },
+    {
+      filePath: path.join(cwd, "tsconfig.json"),
+      content: createTsconfigContent(),
+    },
+    {
+      filePath: path.join(cwd, ".gitignore"),
+      content: createGitignoreContent(),
+    },
     {
       filePath: path.join(cwd, "rbssr.config.ts"),
       content: `import { defineConfig } from "react-bun-ssr";
@@ -29,14 +153,17 @@ export default defineConfig({
     {
       filePath: path.join(cwd, "app/root.tsx"),
       content: `import { Outlet } from "react-bun-ssr/route";
+import styles from "./root.module.css";
 
 export default function RootLayout() {
   return (
-    <main className="shell">
-      <header className="top">
+    <main className={styles.shell}>
+      <header className={styles.top}>
         <h1>react-bun-ssr</h1>
       </header>
-      <Outlet />
+      <section className={styles.content}>
+        <Outlet />
+      </section>
     </main>
   );
 }
@@ -44,6 +171,53 @@ export default function RootLayout() {
 export function head() {
   return <title>react-bun-ssr app</title>;
 }
+`,
+    },
+    {
+      filePath: path.join(cwd, "app/root.module.css"),
+      content: `:global(*) {
+  box-sizing: border-box;
+}
+
+:global(html) {
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  background: linear-gradient(180deg, #f8fafc 0%, #e2e8f0 100%);
+  color: #0f172a;
+}
+
+:global(body) {
+  margin: 0;
+}
+
+.shell {
+  min-height: 100vh;
+  width: min(100%, 72rem);
+  margin: 0 auto;
+  padding: 3rem 1.5rem 4rem;
+}
+
+.top {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 2rem;
+}
+
+.top h1 {
+  margin: 0;
+  font-size: clamp(2rem, 5vw, 3.5rem);
+  line-height: 1;
+  letter-spacing: -0.04em;
+}
+
+.content {
+  padding: 1.5rem;
+  border: 1px solid rgba(15, 23, 42, 0.08);
+  border-radius: 1.5rem;
+  background: rgba(255, 255, 255, 0.84);
+  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.12);
+  backdrop-filter: blur(18px);
+}
 `,
     },
     {
@@ -87,11 +261,15 @@ export const middleware: Middleware = async (ctx, next) => {
 };
 `,
     },
+    {
+      filePath: path.join(cwd, "app/public/favicon.svg"),
+      content: FAVICON_SVG,
+    },
   ];
 }
 
 export async function scaffoldApp(cwd: string, options: { force: boolean }): Promise<void> {
-  for (const file of templateFiles(cwd)) {
+  for (const file of await templateFiles(cwd)) {
     await writeIfMissing(file.filePath, file.content, options.force);
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-bun-ssr",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "private": false,
   "type": "module",
   "sideEffects": false,