@lazarv/create-react-server 0.0.0-experimental-d003259-20250211-2495688e

package/templates/package.lightningcss.json

@@ -0,0 +1,6 @@
+{
+  "devDependencies": {
+    "browserslist": "^4.24.4",
+    "lightningcss": "^1.29.1"
+  }
+}

package/templates/package.prettier.json

@@ -0,0 +1,8 @@
+{
+  "scripts": {
+    "format": "prettier --write ."
+  },
+  "devDependencies": {
+    "prettier": "^3.2.5"
+  }
+}

package/templates/package.react-compiler.json

@@ -0,0 +1,7 @@
+{
+  "devDependencies": {
+    "babel-plugin-react-compiler": "0.0.0-experimental-a08709b-20250207",
+    "eslint-plugin-react-compiler": "0.0.0-experimental-a08709b-20250207",
+    "@vitejs/plugin-react": "^4.3.4"
+  }
+}

package/templates/package.swc.json

@@ -0,0 +1,5 @@
+{
+  "devDependencies": {
+    "@vitejs/plugin-react-swc": "^3.7.0"
+  }
+}

package/templates/package.tailwind.json

@@ -0,0 +1,7 @@
+{
+  "devDependencies": {
+    "autoprefixer": "^10.4.19",
+    "postcss": "^8.4.38",
+    "tailwindcss": "^3.4.3"
+  }
+}

package/templates/package.ts.json

@@ -0,0 +1,11 @@
+{
+  "scripts": {
+    "typecheck": "tsc --noEmit"
+  },
+  "devDependencies": {
+    "@types/react": "^19.0.8",
+    "@types/react-dom": "^19.0.3",
+    "typescript": "^5.6.2",
+    "vite": "^6.1.0"
+  }
+}

package/templates/postcss.config.mjs

@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+};

package/templates/router/globals.d.ts

@@ -0,0 +1,3 @@
+declare module "https://esm.sh/canvas-confetti" {
+  export default function confetti(): void;
+}

package/templates/router/react-server.config.json

@@ -0,0 +1,19 @@
+{
+  "root": "src/app",
+  "export": [
+    {
+      "path": "/"
+    },
+    {
+      "path": "/",
+      "outlet": "content"
+    },
+    {
+      "path": "/about"
+    },
+    {
+      "path": "/about",
+      "outlet": "content"
+    }
+  ]
+}

package/templates/router/src/app/@content/about.tsx

@@ -0,0 +1,98 @@
+function Link({ href, children }: { href: string; children: React.ReactNode }) {
+  return (
+    <a
+      href={href}
+      target="_blank"
+      rel="noreferrer"
+      className="text-indigo-500 dark:text-yellow-600"
+    >
+      {children}
+    </a>
+  );
+}
+
+export default function About() {
+  return (
+    <article className="flex flex-col gap-4 max-w-screen-lg m-8 text-lg">
+      <h1 className="text-2xl font-bold mb-0">About This App</h1>
+      <h2 className="text-xl font-semibold m-0">🛠 The framework</h2>
+      <p>
+        <b>@lazarv/react-server</b> is a modern meta-framework designed for
+        building high-performance, server-driven React applications. It
+        leverages React Server Components (RSC) with a unique delegation
+        approach, enabling seamless micro-frontend architectures and efficient
+        server-side rendering. With native ES module support and Vite-powered
+        optimizations, it ensures a fast and scalable developer experience.
+      </p>
+      <p>
+        Built for flexibility, <b>@lazarv/react-server</b> provides fine-grained
+        caching, robust runtime integrations, and a streamlined development
+        workflow. Whether you{"'"}re crafting a single app or orchestrating
+        multiple micro-frontends, it offers the tools to enhance performance,
+        maintainability, and scalability.
+      </p>
+      <h2 className="text-xl font-semibold m-0">
+        🚀 Welcome to Your New React Server App!
+      </h2>
+      <p>
+        This project was created using the <b>@lazarv/create-react-server</b>{" "}
+        CLI tool, setting up a fully functional React Server Components (RSC)
+        app with file-system based routing and server functions out of the box.
+      </p>
+      <h2 className="text-xl font-semibold m-0">
+        🗂 File-system based routing
+      </h2>
+      <ul className="list-disc pl-6">
+        <li>
+          Add files to <b>/src/app</b> to{" "}
+          <Link href="https://react-server.dev/router/define-routes">
+            define
+          </Link>{" "}
+          layouts, pages and{" "}
+          <Link href="https://react-server.dev/router/api">API routes</Link>
+        </li>
+        <li>
+          Use{" "}
+          <Link href="https://react-server.dev/router/outlets">outlets</Link> to
+          optimize loading content
+        </li>
+        <li>
+          Add{" "}
+          <Link href="https://react-server.dev/router/loading">loading</Link>{" "}
+          and{" "}
+          <Link href="https://react-server.dev/router/error-handling">
+            error handling
+          </Link>{" "}
+          to your routes
+        </li>
+      </ul>
+      <h2 className="text-xl font-semibold m-0 flex items-center">
+        <img src="/react-server.svg" alt="" className="inline-block h-4 mr-1" />{" "}
+        Use React Server Components & Server Functions
+      </h2>
+      <ul className="list-disc pl-6">
+        <li>
+          React Server Components allow efficient rendering without client-side
+          JavaScript
+        </li>
+        <li>
+          Client Components can be used by adding <b>{`"use client";`}</b> at
+          the top of a file
+        </li>
+        <li>
+          Server Functions enable seamless server-side logic execution by using{" "}
+          <b>{`"use server";`}</b>
+        </li>
+      </ul>
+      <h2 className="text-xl font-semibold m-0">📌 Need Help?</h2>
+      <p>
+        Check out the official{" "}
+        <Link href="https://react-server.dev">documentation</Link> or join the{" "}
+        <Link href="https://github.com/lazarv/react-server/discussions">
+          discussions
+        </Link>{" "}
+        for support!
+      </p>
+    </article>
+  );
+}

package/templates/router/src/app/@content/index.tsx

@@ -0,0 +1,33 @@
+import Confetti from "~/components/Confetti";
+
+export default function Home() {
+  return (
+    <>
+      <section className="flex flex-col mt-auto">
+        <div className="relative">
+          <img
+            src="/react-server.svg"
+            className="absolute h-[85%] top-1/2 -translate-x-full -translate-y-1/2 -ml-1"
+            alt="@lazarv/react-server logo"
+          />
+          <h2 className="text-xs font-semibold m-0 pt-0 border-none dark:text-yellow-500 mt-4 sm:mt-0">
+            @lazarv
+          </h2>
+          <h1 className="text-5xl font-semibold m-0 -mt-4 whitespace-nowrap sm:text-6xl dark:text-yellow-500">
+            react-server
+          </h1>
+        </div>
+
+        <p className="text-lg">
+          Welcome to your <b>@lazarv/react-server</b> app!
+        </p>
+      </section>
+
+      <Confetti className="mt-4" />
+
+      <p className="text-sm mt-4">
+        Try editing <b>src/app/@content/index.tsx</b> and save to reload.
+      </p>
+    </>
+  );
+}

package/templates/router/src/app/layout.tsx

@@ -0,0 +1,44 @@
+import "~/global.css";
+
+import { usePathname } from "@lazarv/react-server";
+import Navigation from "~/components/Navigation";
+
+export default function Layout({ children }: { children: React.ReactNode }) {
+  const pathname = usePathname();
+
+  return (
+    <html lang="en" className="h-screen" suppressHydrationWarning>
+      <head></head>
+      <body
+        className="w-full min-h-full flex flex-col justify-center items-center dark:bg-zinc-900 dark:text-gray-400"
+        suppressHydrationWarning
+      >
+        <Navigation pathname={pathname} />
+        <a
+          href="https://github.com/lazarv/react-server"
+          target="_blank"
+          rel="noreferrer"
+        >
+          <img
+            src="/github.svg"
+            alt="GitHub page"
+            className="absolute top-2 right-2 w-6 h-6"
+          />
+        </a>
+        {children}
+        <p className="text-sm mt-auto mb-2">
+          Visit{" "}
+          <a
+            href="https://react-server.dev"
+            target="_blank"
+            className="text-indigo-500 dark:text-yellow-500"
+            rel="noreferrer"
+          >
+            react-server.dev
+          </a>{" "}
+          to learn more about <b>@lazarv/react-server</b>.
+        </p>
+      </body>
+    </html>
+  );
+}

package/templates/router/src/app/page.tsx

@@ -0,0 +1,17 @@
+import { ReactServerComponent } from "@lazarv/react-server/navigation";
+import { Route } from "@lazarv/react-server/router";
+import Home from "~/app/@content";
+import About from "~/app/@content/about";
+
+export default function Page() {
+  return (
+    <ReactServerComponent outlet="content">
+      <Route path="/" exact>
+        <Home />
+      </Route>
+      <Route path="/about" exact>
+        <About />
+      </Route>
+    </ReactServerComponent>
+  );
+}

package/templates/router/src/components/Button.tsx

@@ -0,0 +1,18 @@
+export type ButtonProps = React.PropsWithChildren<
+  React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>
+>;
+
+export default function Button({ className, children, ...props }: ButtonProps) {
+  return (
+    <button
+      className={`${className} rounded-full p-1 inline-flex items-center text-black hover:no-underline from-rose-400 via-fuchsia-500 to-indigo-500 bg-gradient-to-r hover:drop-shadow`}
+    >
+      <div
+        {...props}
+        className="block rounded-full p-2 px-4 text-sm sm:text-base bg-white dark:bg-gray-900 dark:text-white hover:bg-transparent dark:hover:bg-transparent hover:text-white dark:hover:text-white"
+      >
+        {children}
+      </div>
+    </button>
+  );
+}

package/templates/router/src/components/Confetti.tsx

@@ -0,0 +1,19 @@
+"use client";
+
+import Button, { type ButtonProps } from "~/components/Button";
+
+export default function Confetti(props: ButtonProps) {
+  return (
+    <Button
+      {...props}
+      onClick={async () => {
+        const { default: confetti } = await import(
+          "https://esm.sh/canvas-confetti"
+        );
+        confetti();
+      }}
+    >
+      Celebrate!
+    </Button>
+  );
+}

package/templates/router/src/components/Navigation.tsx

@@ -0,0 +1,31 @@
+"use client";
+
+import { Link, usePathname } from "@lazarv/react-server/navigation";
+
+export default function Navigation() {
+  const pathname = usePathname("content");
+
+  return (
+    <nav
+      className="sticky top-0 flex gap-4 bg-slate-200 p-4 dark:bg-zinc-800"
+      data-pathname={pathname}
+    >
+      <Link
+        to="/"
+        target="content"
+        push
+        className="text-2xl uppercase font-bold px-4 [[data-pathname='/']_&]:text-indigo-500 dark:[[data-pathname='/']_&]:text-yellow-600"
+      >
+        Home
+      </Link>
+      <Link
+        to="/about"
+        target="content"
+        push
+        className="text-2xl uppercase font-bold px-4 [[data-pathname='/about']_&]:text-indigo-500 dark:[[data-pathname='/about']_&]:text-yellow-600"
+      >
+        About
+      </Link>
+    </nav>
+  );
+}

package/templates/router/src/global.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

package/templates/shared/public/github.svg

@@ -0,0 +1,4 @@
+<svg width="98" height="96" viewBox="0 0 98 96" fill="none"
+  xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z" fill="#24292f"/>
+</svg>

package/templates/shared/public/react-server.svg

@@ -0,0 +1,51 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="128"
+   height="128"
+   viewBox="0 0 33.866666 33.866667"
+   version="1.1"
+   id="svg1"
+   xml:space="preserve"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+     id="defs1" /><g
+     id="layer1"><g
+       id="g1"
+       transform="matrix(1.4232434,0,0,1.4232434,16.915196,17.10368)"><g
+         stroke="#61dafb"
+         stroke-width="1"
+         fill="none"
+         id="g3"><ellipse
+           rx="11"
+           ry="4.1999998"
+           id="ellipse1"
+           cx="0"
+           cy="0" /><ellipse
+           rx="11"
+           ry="4.1999998"
+           transform="rotate(60)"
+           id="ellipse2"
+           cx="0"
+           cy="0" /><ellipse
+           rx="11"
+           ry="4.1999998"
+           transform="rotate(120)"
+           id="ellipse3"
+           cx="0"
+           cy="0"
+           style="fill:#ffffff;fill-opacity:0" /></g><ellipse
+         fill="#61dafb"
+         id="circle1-46"
+         style="stroke-width:1.01735"
+         ry="4.826261"
+         rx="4.215796"
+         cy="0.15913987"
+         cx="-0.031601399" /></g><path
+       style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:1.1;stroke-dasharray:none;stroke-opacity:1;stroke-linejoin:round;stroke-linecap:butt"
+       d="m 12.509642,30.690503 -0.05834,-0.05685 -7.23e-4,-0.0561 -7.23e-4,-0.05611 0.768979,-2.092476 0.768982,-2.092473 0.556751,-1.543372 0.556748,-1.543368 0.006,-0.120103 0.006,-0.120088 -1.470798,0.0062 -1.470797,0.0062 -0.06194,-0.0727 -0.06194,-0.0727 0.233074,-0.46889 0.233073,-0.468892 0.856189,-1.667244 0.85619,-1.667245 0.41769,-0.85935 0.417689,-0.859349 -0.02911,-0.04578 -0.02911,-0.04576 -1.464266,0.01887 -1.464263,0.01887 -0.09348,-0.0485 -0.09349,-0.0485 -0.0011,-0.08618 -0.0011,-0.08616 0.11036,-0.213586 0.110359,-0.213582 1.014121,-2.024324 1.014119,-2.024327 0.696804,-1.43016 0.696802,-1.4301581 0.701201,-1.4012125 0.701198,-1.4012124 2.501594,-0.044655 2.501597,-0.044655 0.03154,0.079108 0.03152,0.079108 -0.04589,0.1264481 -0.04587,0.1264636 -0.768293,1.3291372 -0.768291,1.3291355 -0.6677,1.1797846 -0.6677,1.179784 0.02576,0.06464 0.02576,0.06464 1.695367,-0.02185 1.695368,-0.02185 0.07639,0.07444 0.07639,0.07446 7.89e-4,0.06124 7.9e-4,0.06124 -0.249474,0.406592 -0.249474,0.40659 -0.614255,0.968038 -0.614255,0.968039 -1.187109,1.911536 -1.187107,1.91154 -0.06878,0.13724 -0.06879,0.13724 0.02683,0.06732 0.02683,0.06732 1.62427,-0.02093 1.624265,-0.02093 0.09295,0.06616 0.09294,0.06612 -0.04534,0.122827 -0.04534,0.122843 -1.34915,1.664026 -1.349152,1.664023 -0.8062,1.018519 -0.8062,1.018517 -0.670268,0.824742 -0.670264,0.824741 -1.724844,2.146499 -1.724842,2.146498 -0.05964,7.69e-4 -0.05966,7.69e-4 z"
+       id="path1-1" /><path
+       style="fill:#ffd22a;fill-opacity:1;stroke:#ffffff;stroke-width:0.4;stroke-dasharray:none;stroke-opacity:1;stroke-linejoin:round;stroke-linecap:round"
+       d="m 12.509642,30.690503 -0.05834,-0.05685 -7.23e-4,-0.0561 -7.23e-4,-0.05611 0.768979,-2.092476 0.768982,-2.092473 0.556751,-1.543372 0.556748,-1.543368 0.006,-0.120103 0.006,-0.120088 -1.470798,0.0062 -1.470797,0.0062 -0.06194,-0.0727 -0.06194,-0.0727 0.233074,-0.46889 0.233073,-0.468892 0.856189,-1.667244 0.85619,-1.667245 0.41769,-0.85935 0.417689,-0.859349 -0.02911,-0.04578 -0.02911,-0.04576 -1.464266,0.01887 -1.464263,0.01887 -0.09348,-0.0485 -0.09349,-0.0485 -0.0011,-0.08618 -0.0011,-0.08616 0.11036,-0.213586 0.110359,-0.213582 1.014121,-2.024324 1.014119,-2.024327 0.696804,-1.43016 0.696802,-1.4301581 0.701201,-1.4012125 0.701198,-1.4012124 2.501594,-0.044655 2.501597,-0.044655 0.03154,0.079108 0.03152,0.079108 -0.04589,0.1264481 -0.04587,0.1264636 -0.768293,1.3291372 -0.768291,1.3291355 -0.6677,1.1797846 -0.6677,1.179784 0.02576,0.06464 0.02576,0.06464 1.695367,-0.02185 1.695368,-0.02185 0.07639,0.07444 0.07639,0.07446 7.89e-4,0.06124 7.9e-4,0.06124 -0.249474,0.406592 -0.249474,0.40659 -0.614255,0.968038 -0.614255,0.968039 -1.187109,1.911536 -1.187107,1.91154 -0.06878,0.13724 -0.06879,0.13724 0.02683,0.06732 0.02683,0.06732 1.62427,-0.02093 1.624265,-0.02093 0.09295,0.06616 0.09294,0.06612 -0.04534,0.122827 -0.04534,0.122843 -1.34915,1.664026 -1.349152,1.664023 -0.8062,1.018519 -0.8062,1.018517 -0.670268,0.824742 -0.670264,0.824741 -1.724844,2.146499 -1.724842,2.146498 -0.05964,7.69e-4 -0.05966,7.69e-4 z"
+       id="path1" /></g></svg>

package/templates/tailwind.config.mjs

@@ -0,0 +1,6 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: ["src/**/*.{js,jsx,ts,tsx}"],
+  theme: {},
+  plugins: [],
+};

package/templates/tsconfig.css.json

@@ -0,0 +1,9 @@
+{
+  "compilerOptions": {
+    "plugins": [
+      {
+        "name": "typescript-plugin-css-modules"
+      }
+    ]
+  }
+}

package/templates/tsconfig.template.json

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "lib": ["ESNext", "DOM", "DOM.Iterable"],
+    "types": ["react/experimental", "react-dom/experimental"],
+    "jsx": "preserve",
+    "baseUrl": "./src",
+    "strict": true,
+    "allowSyntheticDefaultImports": true,
+    "skipLibCheck": true
+  },
+  "include": ["**/*.ts", "**/*.tsx", ".react-server/**/*.ts"],
+  "exclude": ["**/*.js", "**/*.mjs"]
+}

package/templates/vite.config.lightningcss.mjs

@@ -0,0 +1,15 @@
+import browserslist from "browserslist";
+import { browserslistToTargets } from "lightningcss";
+import { defineConfig } from "vite";
+
+export default defineConfig({
+  css: {
+    transformer: "lightningcss",
+    lightningcss: {
+      targets: browserslistToTargets(browserslist(">= 0.25%")),
+    },
+  },
+  build: {
+    cssMinify: "lightningcss",
+  },
+});

package/templates/vite.config.lightningcss.ts

@@ -0,0 +1,15 @@
+import browserslist from "browserslist";
+import { browserslistToTargets } from "lightningcss";
+import { defineConfig } from "vite";
+
+export default defineConfig({
+  css: {
+    transformer: "lightningcss",
+    lightningcss: {
+      targets: browserslistToTargets(browserslist(">= 0.25%")),
+    },
+  },
+  build: {
+    cssMinify: "lightningcss",
+  },
+});

package/templates/vite.config.react-compiler.mjs

@@ -0,0 +1,19 @@
+import react from "@vitejs/plugin-react";
+import { defineConfig } from "vite";
+
+export default defineConfig({
+  plugins: [
+    react({
+      babel: {
+        plugins: [
+          [
+            "babel-plugin-react-compiler",
+            {
+              compilationMode: "annotation",
+            },
+          ],
+        ],
+      },
+    }),
+  ],
+});

package/templates/vite.config.react-compiler.ts

@@ -0,0 +1,19 @@
+import react from "@vitejs/plugin-react";
+import { defineConfig } from "vite";
+
+export default defineConfig({
+  plugins: [
+    react({
+      babel: {
+        plugins: [
+          [
+            "babel-plugin-react-compiler",
+            {
+              compilationMode: "annotation",
+            },
+          ],
+        ],
+      },
+    }),
+  ],
+});

package/templates/vite.config.swc.mjs

@@ -0,0 +1,6 @@
+import react from "@vitejs/plugin-react-swc";
+import { defineConfig } from "vite";
+
+export default defineConfig({
+  plugins: [react()],
+});

package/templates/vite.config.swc.ts

@@ -0,0 +1,6 @@
+import react from "@vitejs/plugin-react-swc";
+import { defineConfig } from "vite";
+
+export default defineConfig({
+  plugins: [react()],
+});

package/templates/vite.config.ts

@@ -0,0 +1,3 @@
+import { defineConfig } from "vite";
+
+export default defineConfig({});