create-camox 0.1.2-alpha.2 → 0.4.2

package/README.md

@@ -0,0 +1,11 @@
+# create-camox
+
+Scaffolds a new [Camox](https://camox.ai) project.
+
+```bash
+npm create camox
+```
+
+## Why does this package exist?
+
+This is a thin wrapper around `@camox/cli init`. It exists so that `npm create camox` always fetches the latest version of the CLI from the registry, rather than resolving a cached or locally installed copy of the `camox` package. It also avoids downloading the full SDK and its dependencies just to run the init command.

package/bin/create-camox.mjs

@@ -0,0 +1,3 @@
+#!/usr/bin/env node
+process.argv.splice(2, 0, "init");
+import "@camox/cli";

package/package.json

@@ -1,23 +1,14 @@
 {
   "name": "create-camox",
-  "version": "0.1.2-alpha.2",
+  "version": "0.4.2",
   "bin": {
-    "create-camox": "./dist/index.js"
+    "create-camox": "./bin/create-camox.mjs"
   },
   "files": [
-    "dist",
-    "template"
+    "bin"
   ],
   "type": "module",
   "dependencies": {
-    "@clack/prompts": "^0.10.0"
-  },
-  "devDependencies": {
-    "tsup": "^8.4.0",
-    "typescript": "^5.7.2"
-  },
-  "scripts": {
-    "build": "tsup",
-    "dev": "tsup --watch"
+    "@camox/cli": "0.4.2"
   }
 }

package/dist/index.js

@@ -1,195 +0,0 @@
-#!/usr/bin/env node
-
-// src/index.ts
-import { execSync, spawn, spawnSync } from "child_process";
-import fs from "fs";
-import path from "path";
-import { fileURLToPath } from "url";
-import * as p from "@clack/prompts";
-var __dirname = path.dirname(fileURLToPath(import.meta.url));
-var ownPkg = JSON.parse(fs.readFileSync(path.resolve(__dirname, "..", "package.json"), "utf-8"));
-var pmCommands = {
-  pnpm: { install: "pnpm install", dev: "pnpm dev" },
-  bun: { install: "bun install", dev: "bun dev" },
-  npm: { install: "npm install", dev: "npm run dev" },
-  yarn: { install: "yarn install", dev: "yarn dev" }
-};
-function slugify(name) {
-  return name.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
-}
-function detectPackageManager() {
-  const userAgent = process.env.npm_config_user_agent;
-  if (userAgent) {
-    const name = userAgent.split("/")[0];
-    if (name === "pnpm") return "pnpm";
-    if (name === "bun") return "bun";
-    if (name === "npm" || name === "npx") return "npm";
-    if (name === "yarn") return "yarn";
-  }
-  let dir = process.cwd();
-  const root = path.parse(dir).root;
-  while (true) {
-    if (fs.existsSync(path.join(dir, "pnpm-lock.yaml")) || fs.existsSync(path.join(dir, "pnpm-workspace.yaml")))
-      return "pnpm";
-    if (fs.existsSync(path.join(dir, "bun.lockb")) || fs.existsSync(path.join(dir, "bun.lock")))
-      return "bun";
-    if (fs.existsSync(path.join(dir, "package-lock.json"))) return "npm";
-    if (fs.existsSync(path.join(dir, "yarn.lock"))) return "yarn";
-    if (dir === root) break;
-    dir = path.dirname(dir);
-  }
-  return null;
-}
-function isInsideGitRepo() {
-  try {
-    execSync("git rev-parse --is-inside-work-tree", { stdio: "ignore" });
-    return true;
-  } catch {
-    return false;
-  }
-}
-function copyDir(src, dest, replacements) {
-  fs.mkdirSync(dest, { recursive: true });
-  for (const entry of fs.readdirSync(src, { withFileTypes: true })) {
-    const srcPath = path.join(src, entry.name);
-    const destPath = path.join(dest, entry.name);
-    if (entry.isDirectory()) {
-      copyDir(srcPath, destPath, replacements);
-      continue;
-    }
-    let content = fs.readFileSync(srcPath, "utf-8");
-    for (const [key, value] of Object.entries(replacements)) {
-      content = content.replaceAll(key, value);
-    }
-    fs.writeFileSync(destPath, content);
-  }
-}
-function onCancel() {
-  p.cancel("Cancelled.");
-  process.exit(0);
-}
-async function main() {
-  p.intro("create-camox");
-  const result = await p.group(
-    {
-      name: () => p.text({
-        message: "Project display name",
-        placeholder: "My Website",
-        validate: (value) => {
-          if (!value.trim()) return "Project name is required";
-        }
-      }),
-      slug: ({ results }) => p.text({
-        message: "Project slug",
-        initialValue: slugify(results.name ?? ""),
-        validate: (value) => {
-          if (!value.trim()) return "Slug is required";
-          if (!/^[a-z0-9][a-z0-9-]*[a-z0-9]$/.test(value) && !/^[a-z0-9]$/.test(value)) {
-            return "Slug must be lowercase alphanumeric with hyphens";
-          }
-        }
-      }),
-      path: ({ results }) => p.text({
-        message: "Project path",
-        initialValue: `./${results.slug ?? "my-site"}`,
-        validate: (value) => {
-          if (!value.trim()) return "Path is required";
-        }
-      })
-    },
-    { onCancel }
-  );
-  const targetDir = path.resolve(result.path);
-  if (fs.existsSync(targetDir) && fs.readdirSync(targetDir).length > 0) {
-    p.cancel(`Directory ${targetDir} is not empty.`);
-    process.exit(1);
-  }
-  const alreadyInRepo = isInsideGitRepo();
-  const initGit = await p.confirm({
-    message: "Initialize a git repository?",
-    initialValue: !alreadyInRepo
-  });
-  if (p.isCancel(initGit)) return onCancel();
-  const detected = detectPackageManager();
-  let pm;
-  if (detected) {
-    pm = detected;
-    p.log.info(`Detected package manager: ${detected}`);
-  } else {
-    const selected = await p.select({
-      message: "Which package manager?",
-      options: [
-        { value: "pnpm", label: "pnpm" },
-        { value: "bun", label: "bun" },
-        { value: "npm", label: "npm" },
-        { value: "yarn", label: "yarn" }
-      ]
-    });
-    if (p.isCancel(selected)) return onCancel();
-    pm = selected;
-  }
-  const s = p.spinner();
-  s.start("Scaffolding project...");
-  const templateDir = path.resolve(__dirname, "..", "template");
-  copyDir(templateDir, targetDir, {
-    "{{projectName}}": result.name,
-    "{{projectSlug}}": result.slug,
-    "{{camoxVersion}}": ownPkg.version
-  });
-  s.stop("Project scaffolded!");
-  if (initGit) {
-    try {
-      execSync("git init", { cwd: targetDir, stdio: "ignore" });
-      p.log.success("Initialized git repository.");
-    } catch {
-      p.log.warn("Could not initialize git repository.");
-    }
-  }
-  const { install: installCmd, dev: devCmd } = pmCommands[pm];
-  const [installBin, ...installArgs] = installCmd.split(" ");
-  const s2 = p.spinner();
-  s2.start(`Running ${installCmd}...`);
-  try {
-    await new Promise((resolve, reject) => {
-      const child2 = spawn(installBin, installArgs, {
-        cwd: targetDir,
-        stdio: "ignore"
-      });
-      child2.on("close", (code) => {
-        if (code === 0) resolve();
-        else reject(new Error(`Exit code ${code}`));
-      });
-      child2.on("error", reject);
-    });
-    s2.stop("Dependencies installed!");
-  } catch {
-    s2.stop("Install failed.");
-    p.log.error(`Failed to install dependencies. Run "${installCmd}" manually.`);
-    process.exit(1);
-  }
-  if (initGit) {
-    try {
-      execSync("git add -A", { cwd: targetDir, stdio: "ignore" });
-      execSync('git commit -m "Initial commit from create-camox"', {
-        cwd: targetDir,
-        stdio: "ignore"
-      });
-      p.log.success("Created initial commit.");
-    } catch {
-      p.log.warn("Could not create initial commit.");
-    }
-  }
-  p.outro(`Starting dev server...`);
-  const [cmd, ...args] = devCmd.split(" ");
-  const child = spawn(cmd, args, {
-    cwd: targetDir,
-    stdio: "inherit"
-  });
-  child.on("close", () => {
-    const shell = process.env.SHELL || "/bin/bash";
-    p.log.info(`Dropping you into ${result.path}`);
-    spawnSync(shell, [], { cwd: targetDir, stdio: "inherit" });
-    process.exit(0);
-  });
-}
-main().catch(console.error);

package/template/components.json

@@ -1,22 +0,0 @@
-{
-  "$schema": "https://ui.shadcn.com/schema.json",
-  "style": "new-york",
-  "rsc": false,
-  "tsx": true,
-  "tailwind": {
-    "config": "",
-    "css": "src/styles.css",
-    "baseColor": "gray",
-    "cssVariables": true,
-    "prefix": ""
-  },
-  "iconLibrary": "lucide",
-  "aliases": {
-    "components": "@/components",
-    "utils": "@/lib/utils",
-    "ui": "@/components/ui",
-    "lib": "@/lib",
-    "hooks": "@/hooks"
-  },
-  "registries": {}
-}

package/template/package.json

@@ -1,39 +0,0 @@
-{
-  "name": "{{projectSlug}}",
-  "private": true,
-  "type": "module",
-  "scripts": {
-    "dev": "vite dev --port 3000",
-    "start": "node .output/server/index.mjs",
-    "build": "vite build",
-    "serve": "vite preview",
-    "lint": "oxlint",
-    "check": "tsgo --noEmit && oxlint --fix"
-  },
-  "dependencies": {
-    "@radix-ui/react-slot": "^1.2.3",
-    "@tailwindcss/vite": "^4.2.2",
-    "@tanstack/react-router": "^1.166.2",
-    "@tanstack/react-start": "^1.166.2",
-    "@tanstack/router-plugin": "^1.166.2",
-    "camox": "{{camoxVersion}}",
-    "class-variance-authority": "^0.7.1",
-    "clsx": "^2.1.1",
-    "lucide-react": "^0.476.0",
-    "react": "^19.1.0",
-    "react-dom": "^19.1.0",
-    "tailwind-merge": "^3.0.2",
-    "tailwindcss": "^4.0.6"
-  },
-  "devDependencies": {
-    "@types/react": "^19.0.8",
-    "@types/react-dom": "^19.0.3",
-    "@typescript/native-preview": "^7.0.0-dev",
-    "@vitejs/plugin-react": "^6.0.1",
-    "babel-plugin-react-compiler": "19.1.0-rc.3",
-    "oxlint": "^0.15.15",
-    "tw-animate-css": "^1.3.6",
-    "typescript": "^5.7.2",
-    "vite": "8.0.1"
-  }
-}

package/template/src/camox/blocks/footer.tsx

@@ -1,67 +0,0 @@
-import { Link } from "@tanstack/react-router";
-import { Type, createBlock } from "camox/createBlock";
-
-const footer = createBlock({
-  id: "footer",
-  title: "Footer",
-  layoutOnly: true,
-  description: "A footer at the bottom of a page with a site name and navigation links.",
-  toMarkdown: ["{{title}}", "{{links}}"],
-  content: {
-    title: Type.String({ default: "{{projectName}}" }),
-    links: Type.RepeatableObject(
-      {
-        link: Type.Link({
-          default: { text: "Link", href: "#", newTab: false },
-          title: "Link",
-        }),
-      },
-      {
-        minItems: 1,
-        maxItems: 12,
-        title: "Links",
-        toMarkdown: ["{{link}}"],
-      },
-    ),
-  },
-  component: FooterComponent,
-});
-
-function FooterComponent() {
-  return (
-    <footer className="dark bg-background py-12">
-      <div className="container mx-auto px-4">
-        <div className="flex flex-col items-center gap-6 sm:flex-row sm:justify-between">
-          <footer.Field name="title">
-            {(content) => <div className="text-foreground text-lg font-bold">{content}</div>}
-          </footer.Field>
-
-          <div className="flex flex-wrap items-center gap-4">
-            <footer.Repeater name="links">
-              {(linkItem) => (
-                <linkItem.Link name="link">
-                  {({ text, href, newTab }) => (
-                    <Link
-                      to={href}
-                      target={newTab ? "_blank" : undefined}
-                      rel={newTab ? "noreferrer" : undefined}
-                      className="text-muted-foreground hover:text-foreground text-sm transition-colors"
-                    >
-                      {text}
-                    </Link>
-                  )}
-                </linkItem.Link>
-              )}
-            </footer.Repeater>
-          </div>
-        </div>
-
-        <div className="text-muted-foreground mt-8 text-center text-sm">
-          &copy; {new Date().getFullYear()} All rights reserved.
-        </div>
-      </div>
-    </footer>
-  );
-}
-
-export { footer as block };

package/template/src/camox/blocks/hero.tsx

@@ -1,64 +0,0 @@
-import { Link } from "@tanstack/react-router";
-import { Type, createBlock } from "camox/createBlock";
-
-import { Button } from "@/components/ui/button";
-
-const hero = createBlock({
-  id: "hero",
-  title: "Hero",
-  description:
-    "Use this block as the main landing section at the top of a page. It should capture attention immediately with a clear value proposition.",
-  toMarkdown: ["# {{title}}", "{{description}}", "{{cta}}"],
-  content: {
-    title: Type.String({
-      default: "Welcome to {{projectName}}",
-      title: "Title",
-    }),
-    description: Type.String({
-      default: "Build something amazing with Camox.",
-      maxLength: 280,
-      title: "Description",
-    }),
-    cta: Type.Link({
-      default: { text: "Get Started", href: "/", newTab: false },
-      title: "CTA",
-    }),
-  },
-  component: HeroComponent,
-});
-
-function HeroComponent() {
-  return (
-    <section className="flex flex-col items-center justify-center py-32">
-      <div className="container mx-auto px-4">
-        <div className="mx-auto max-w-3xl text-center">
-          <hero.Field name="title">
-            {(content) => (
-              <h1 className="text-foreground mb-6 text-5xl font-bold tracking-tight sm:text-6xl">
-                {content}
-              </h1>
-            )}
-          </hero.Field>
-          <hero.Field name="description">
-            {(content) => <p className="text-muted-foreground mb-10 text-xl">{content}</p>}
-          </hero.Field>
-          <hero.Link name="cta">
-            {({ text, href, newTab }) => (
-              <Button size="lg" asChild>
-                <Link
-                  to={href}
-                  target={newTab ? "_blank" : undefined}
-                  rel={newTab ? "noreferrer" : undefined}
-                >
-                  {text}
-                </Link>
-              </Button>
-            )}
-          </hero.Link>
-        </div>
-      </div>
-    </section>
-  );
-}
-
-export { hero as block };

package/template/src/camox/blocks/navbar.tsx

@@ -1,95 +0,0 @@
-import { Link } from "@tanstack/react-router";
-import { Type, createBlock } from "camox/createBlock";
-
-import { Button } from "@/components/ui/button";
-
-const navbar = createBlock({
-  id: "navbar",
-  title: "Navbar",
-  layoutOnly: true,
-  description:
-    "A navigation bar at the top of a page with a brand name, navigation links, and a call-to-action link.",
-  toMarkdown: ["{{title}}", "{{links}}", "{{cta}}"],
-  content: {
-    title: Type.Link({
-      title: "Site name",
-      default: {
-        href: "/",
-        text: "{{projectName}}",
-        newTab: false,
-      },
-    }),
-    links: Type.RepeatableObject(
-      {
-        link: Type.Link({
-          default: { text: "Link", href: "#", newTab: false },
-          title: "Link",
-        }),
-      },
-      {
-        minItems: 1,
-        maxItems: 6,
-        title: "Links",
-        toMarkdown: ["{{link}}"],
-      },
-    ),
-    cta: Type.Link({
-      default: { text: "Get Started", href: "#", newTab: false },
-      title: "CTA",
-    }),
-  },
-  component: NavbarComponent,
-});
-
-function NavbarComponent() {
-  return (
-    <nav className="dark bg-background border-border border-b">
-      <div className="container mx-auto px-4">
-        <div className="flex h-16 items-center justify-between">
-          <navbar.Link name="title">
-            {(link) => (
-              <Link className="text-foreground text-xl font-bold" to={link.href}>
-                {link.text}
-              </Link>
-            )}
-          </navbar.Link>
-
-          <div className="flex items-center gap-6">
-            <navbar.Repeater name="links">
-              {(linkItem) => (
-                <linkItem.Link name="link">
-                  {({ text, href, newTab }) => (
-                    <Link
-                      to={href}
-                      target={newTab ? "_blank" : undefined}
-                      rel={newTab ? "noreferrer" : undefined}
-                      className="text-muted-foreground hover:text-foreground text-sm transition-colors"
-                    >
-                      {text}
-                    </Link>
-                  )}
-                </linkItem.Link>
-              )}
-            </navbar.Repeater>
-
-            <navbar.Link name="cta">
-              {({ text, href, newTab }) => (
-                <Button size="sm" asChild>
-                  <Link
-                    to={href}
-                    target={newTab ? "_blank" : undefined}
-                    rel={newTab ? "noreferrer" : undefined}
-                  >
-                    {text}
-                  </Link>
-                </Button>
-              )}
-            </navbar.Link>
-          </div>
-        </div>
-      </div>
-    </nav>
-  );
-}
-
-export { navbar as block };

package/template/src/camox/blocks/statistics.tsx

@@ -1,99 +0,0 @@
-import { Type, createBlock } from "camox/createBlock";
-
-const statistics = createBlock({
-  id: "statistics",
-  title: "Statistics",
-  description:
-    "Showcase key metrics, achievements, or performance indicators. Ideal for displaying platform statistics or company milestones.",
-  toMarkdown: ["## {{subtitle}}", "{{description}}", "{{statistics}}"],
-  content: {
-    title: Type.String({
-      default: "By the numbers",
-      maxLength: 30,
-      title: "Title",
-    }),
-    subtitle: Type.String({
-      default: "Trusted by teams worldwide",
-      title: "Subtitle",
-    }),
-    description: Type.String({
-      default:
-        "Our platform empowers teams to build and ship faster. Here are some numbers we're proud of.",
-      title: "Description",
-    }),
-    statistics: Type.RepeatableObject(
-      {
-        number: Type.String({
-          default: "100+",
-          maxLength: 7,
-          title: "Number",
-        }),
-        label: Type.String({
-          default: "projects launched",
-          title: "Label",
-        }),
-      },
-      {
-        minItems: 3,
-        maxItems: 8,
-        title: "Statistics",
-        toMarkdown: ["**{{number}}** — {{label}}"],
-      },
-    ),
-  },
-  component: StatisticsComponent,
-});
-
-function StatisticsComponent() {
-  return (
-    <section className="dark bg-background py-24">
-      <div className="container mx-auto px-4">
-        <div className="mx-auto max-w-6xl">
-          <div className="mb-16">
-            <statistics.Field name="title">
-              {(content) => (
-                <div className="text-primary mb-4 text-sm font-semibold tracking-wider uppercase">
-                  {content}
-                </div>
-              )}
-            </statistics.Field>
-            <statistics.Field name="subtitle">
-              {(content) => (
-                <h2 className="text-foreground mb-6 text-4xl font-bold sm:text-5xl">{content}</h2>
-              )}
-            </statistics.Field>
-            <statistics.Field name="description">
-              {(content) => (
-                <p className="text-muted-foreground max-w-3xl text-lg leading-relaxed">{content}</p>
-              )}
-            </statistics.Field>
-          </div>
-
-          <div className="grid grid-cols-1 gap-8 md:grid-cols-2 lg:grid-cols-4">
-            <statistics.Repeater name="statistics">
-              {(stat) => (
-                <div className="flex gap-3">
-                  <div className="w-0.5 bg-linear-to-b from-teal-400 to-blue-500" />
-                  <div className="flex flex-col">
-                    <stat.Field name="number">
-                      {(content) => (
-                        <div className="text-foreground mb-2 text-4xl font-bold">{content}</div>
-                      )}
-                    </stat.Field>
-                    <stat.Field name="label">
-                      {(content) => (
-                        <p className="text-muted-foreground text-sm leading-relaxed">{content}</p>
-                      )}
-                    </stat.Field>
-                  </div>
-                </div>
-              )}
-            </statistics.Repeater>
-          </div>
-        </div>
-      </div>
-    </section>
-  );
-}
-
-export { statistics as block };

package/template/src/camox/blocks/testimonial.tsx

@@ -1,56 +0,0 @@
-import { Type, createBlock } from "camox/createBlock";
-
-const testimonial = createBlock({
-  id: "testimonial",
-  title: "Testimonial",
-  description:
-    "Display a customer testimonial or user review. Ideal for building trust and social proof.",
-  toMarkdown: ["> {{quote}}", "— {{author}}, {{title}}, {{company}}"],
-  content: {
-    quote: Type.String({
-      default:
-        "This platform has transformed how we build and manage our website. The developer experience is exceptional.",
-      title: "Quote",
-    }),
-    author: Type.String({ default: "Sarah Chen", title: "Author" }),
-    title: Type.String({ default: "Senior Developer", title: "Title" }),
-    company: Type.String({ default: "TechCorp", title: "Company" }),
-  },
-  component: TestimonialComponent,
-});
-
-function TestimonialComponent() {
-  return (
-    <section className="bg-background py-24">
-      <div className="container mx-auto px-4">
-        <div className="mx-auto max-w-4xl text-center">
-          <testimonial.Field name="quote">
-            {(content) => (
-              <blockquote className="text-foreground mb-8 text-2xl leading-relaxed font-medium sm:text-3xl">
-                "{content}"
-              </blockquote>
-            )}
-          </testimonial.Field>
-          <div className="flex flex-col items-center">
-            <testimonial.Field name="author">
-              {(content) => (
-                <cite className="text-foreground text-lg font-semibold not-italic">{content}</cite>
-              )}
-            </testimonial.Field>
-            <div className="text-muted-foreground flex flex-col sm:flex-row sm:items-center sm:gap-2">
-              <testimonial.Field name="title">
-                {(content) => <span>{content}</span>}
-              </testimonial.Field>
-              <span className="hidden sm:inline">&bull;</span>
-              <testimonial.Field name="company">
-                {(content) => <span>{content}</span>}
-              </testimonial.Field>
-            </div>
-          </div>
-        </div>
-      </div>
-    </section>
-  );
-}
-
-export { testimonial as block };

package/template/src/camox/layouts/default.tsx

@@ -1,82 +0,0 @@
-import { createLayout } from "camox/createLayout";
-
-import { block as footerBlock } from "../blocks/footer";
-import { block as navbarBlock } from "../blocks/navbar";
-
-const defaultLayout = createLayout({
-  id: "default",
-  title: "Default",
-  description: "Default page layout with a navbar and footer",
-  blocks: { before: [navbarBlock], after: [footerBlock] },
-  component: DefaultLayout,
-  buildMetaTitle: ({ pageMetaTitle, projectName }) => `${pageMetaTitle} | ${projectName}`,
-  buildOgImage: ({ title, description, projectName }) => (
-    <div
-      style={{
-        display: "flex",
-        flexDirection: "column",
-        justifyContent: "center",
-        alignItems: "flex-start",
-        width: "100%",
-        height: "100%",
-        backgroundColor: "#09090b",
-        padding: "60px 80px",
-        fontFamily: "sans-serif",
-      }}
-    >
-      {projectName && (
-        <div
-          style={{
-            fontSize: 24,
-            color: "#a1a1aa",
-            marginBottom: 24,
-            textTransform: "uppercase",
-            letterSpacing: "0.1em",
-          }}
-        >
-          {projectName}
-        </div>
-      )}
-      <div
-        style={{
-          fontSize: 64,
-          fontWeight: 700,
-          color: "#fafafa",
-          lineHeight: 1.2,
-          marginBottom: 24,
-          maxWidth: "100%",
-          overflow: "hidden",
-          textOverflow: "ellipsis",
-        }}
-      >
-        {title}
-      </div>
-      {description && (
-        <div
-          style={{
-            fontSize: 28,
-            color: "#a1a1aa",
-            lineHeight: 1.5,
-            maxWidth: "80%",
-            overflow: "hidden",
-            textOverflow: "ellipsis",
-          }}
-        >
-          {description}
-        </div>
-      )}
-    </div>
-  ),
-});
-
-function DefaultLayout({ children }: { children: React.ReactNode }) {
-  return (
-    <main className="flex min-h-screen flex-col">
-      <defaultLayout.blocks.Navbar />
-      <div className="flex-1">{children}</div>
-      <defaultLayout.blocks.Footer />
-    </main>
-  );
-}
-
-export { defaultLayout as layout };

package/template/src/components/ui/button.tsx

@@ -1,57 +0,0 @@
-import { Slot } from "@radix-ui/react-slot";
-import type { VariantProps } from "class-variance-authority";
-import { cva } from "class-variance-authority";
-import * as React from "react";
-
-import { cn } from "@/lib/utils";
-
-const buttonVariants = cva(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
-  {
-    variants: {
-      variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/90",
-        destructive:
-          "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
-        outline:
-          "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
-        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
-        link: "text-primary underline-offset-4 hover:underline",
-      },
-      size: {
-        default: "h-9 px-4 py-2 has-[>svg]:px-3",
-        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
-        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
-        icon: "size-9",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default",
-    },
-  },
-);
-
-function Button({
-  className,
-  variant,
-  size,
-  asChild = false,
-  ...props
-}: React.ComponentProps<"button"> &
-  VariantProps<typeof buttonVariants> & {
-    asChild?: boolean;
-  }) {
-  const Comp = asChild ? Slot : "button";
-
-  return (
-    <Comp
-      data-slot="button"
-      className={cn(buttonVariants({ variant, size, className }))}
-      {...props}
-    />
-  );
-}
-
-export { Button, buttonVariants };

package/template/src/lib/utils.ts

@@ -1,7 +0,0 @@
-import type { ClassValue } from "clsx";
-import { clsx } from "clsx";
-import { twMerge } from "tailwind-merge";
-
-export function cn(...inputs: Array<ClassValue>) {
-  return twMerge(clsx(inputs));
-}

package/template/src/router.tsx

@@ -1,18 +0,0 @@
-import { createRouter as createTanstackRouter } from "@tanstack/react-router";
-
-import { routeTree } from "./routeTree.gen";
-
-export function getRouter() {
-  const router = createTanstackRouter({
-    routeTree,
-    defaultPreload: "intent",
-  });
-
-  return router;
-}
-
-declare module "@tanstack/react-router" {
-  interface Register {
-    router: ReturnType<typeof getRouter>;
-  }
-}

package/template/src/routes/__root.tsx

@@ -1,48 +0,0 @@
-import { HeadContent, Scripts, createRootRoute } from "@tanstack/react-router";
-
-import siteCss from "../styles.css?url";
-
-export const Route = createRootRoute({
-  head: () => {
-    return {
-      meta: [
-        {
-          charSet: "utf-8",
-        },
-        {
-          name: "viewport",
-          content: "width=device-width, initial-scale=1",
-        },
-        {
-          title: "{{projectName}}",
-        },
-      ],
-      links: [
-        {
-          rel: "stylesheet",
-          href: siteCss,
-        },
-        {
-          rel: "icon",
-          href: "/favicon.ico",
-        },
-      ],
-    };
-  },
-
-  shellComponent: RootDocument,
-});
-
-function RootDocument({ children }: { children: React.ReactNode }) {
-  return (
-    <html lang="en">
-      <head>
-        <HeadContent />
-      </head>
-      <body>
-        {children}
-        <Scripts />
-      </body>
-    </html>
-  );
-}

package/template/src/styles.css

@@ -1,132 +0,0 @@
-@import "tailwindcss";
-@import "tw-animate-css";
-
-@custom-variant dark (&:is(.dark *));
-
-body {
-  @apply m-0;
-  font-family:
-    -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
-    "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-:root {
-  --background: oklch(1 0 0);
-  --foreground: oklch(0.13 0.028 261.692);
-  --card: oklch(1 0 0);
-  --card-foreground: oklch(0.13 0.028 261.692);
-  --popover: oklch(1 0 0);
-  --popover-foreground: oklch(0.13 0.028 261.692);
-  --primary: oklch(0.21 0.034 264.665);
-  --primary-foreground: oklch(0.985 0.002 247.839);
-  --secondary: oklch(0.967 0.003 264.542);
-  --secondary-foreground: oklch(0.21 0.034 264.665);
-  --muted: oklch(0.967 0.003 264.542);
-  --muted-foreground: oklch(0.551 0.027 264.364);
-  --accent: oklch(0.967 0.003 264.542);
-  --accent-foreground: oklch(0.21 0.034 264.665);
-  --destructive: oklch(0.577 0.245 27.325);
-  --destructive-foreground: oklch(0.577 0.245 27.325);
-  --border: oklch(0.928 0.006 264.531);
-  --input: oklch(0.928 0.006 264.531);
-  --ring: oklch(0.707 0.022 261.325);
-  --chart-1: oklch(0.646 0.222 41.116);
-  --chart-2: oklch(0.6 0.118 184.704);
-  --chart-3: oklch(0.398 0.07 227.392);
-  --chart-4: oklch(0.828 0.189 84.429);
-  --chart-5: oklch(0.769 0.188 70.08);
-  --radius: 0.4rem;
-  --sidebar: oklch(0.985 0.002 247.839);
-  --sidebar-foreground: oklch(0.13 0.028 261.692);
-  --sidebar-primary: oklch(0.21 0.034 264.665);
-  --sidebar-primary-foreground: oklch(0.985 0.002 247.839);
-  --sidebar-accent: oklch(0.967 0.003 264.542);
-  --sidebar-accent-foreground: oklch(0.21 0.034 264.665);
-  --sidebar-border: oklch(0.928 0.006 264.531);
-  --sidebar-ring: oklch(0.707 0.022 261.325);
-}
-
-.dark {
-  --background: oklch(0.13 0.028 261.692);
-  --foreground: oklch(0.985 0.002 247.839);
-  --card: oklch(0.21 0.034 264.665);
-  --card-foreground: oklch(0.985 0.002 247.839);
-  --popover: oklch(0.21 0.034 264.665);
-  --popover-foreground: oklch(0.985 0.002 247.839);
-  --primary: oklch(0.928 0.006 264.531);
-  --primary-foreground: oklch(0.21 0.034 264.665);
-  --secondary: oklch(0.278 0.033 256.848);
-  --secondary-foreground: oklch(0.985 0.002 247.839);
-  --muted: oklch(0.278 0.033 256.848);
-  --muted-foreground: oklch(0.707 0.022 261.325);
-  --accent: oklch(0.278 0.033 256.848);
-  --accent-foreground: oklch(0.985 0.002 247.839);
-  --destructive: oklch(0.704 0.191 22.216);
-  --destructive-foreground: oklch(0.637 0.237 25.331);
-  --border: oklch(1 0 0 / 10%);
-  --input: oklch(1 0 0 / 15%);
-  --ring: oklch(0.551 0.027 264.364);
-  --chart-1: oklch(0.488 0.243 264.376);
-  --chart-2: oklch(0.696 0.17 162.48);
-  --chart-3: oklch(0.769 0.188 70.08);
-  --chart-4: oklch(0.627 0.265 303.9);
-  --chart-5: oklch(0.645 0.246 16.439);
-  --sidebar: oklch(0.21 0.034 264.665);
-  --sidebar-foreground: oklch(0.985 0.002 247.839);
-  --sidebar-primary: oklch(0.488 0.243 264.376);
-  --sidebar-primary-foreground: oklch(0.985 0.002 247.839);
-  --sidebar-accent: oklch(0.278 0.033 256.848);
-  --sidebar-accent-foreground: oklch(0.985 0.002 247.839);
-  --sidebar-border: oklch(1 0 0 / 10%);
-  --sidebar-ring: oklch(0.551 0.027 264.364);
-}
-
-@theme inline {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --color-card: var(--card);
-  --color-card-foreground: var(--card-foreground);
-  --color-popover: var(--popover);
-  --color-popover-foreground: var(--popover-foreground);
-  --color-primary: var(--primary);
-  --color-primary-foreground: var(--primary-foreground);
-  --color-secondary: var(--secondary);
-  --color-secondary-foreground: var(--secondary-foreground);
-  --color-muted: var(--muted);
-  --color-muted-foreground: var(--muted-foreground);
-  --color-accent: var(--accent);
-  --color-accent-foreground: var(--accent-foreground);
-  --color-destructive: var(--destructive);
-  --color-destructive-foreground: var(--destructive-foreground);
-  --color-border: var(--border);
-  --color-input: var(--input);
-  --color-ring: var(--ring);
-  --color-chart-1: var(--chart-1);
-  --color-chart-2: var(--chart-2);
-  --color-chart-3: var(--chart-3);
-  --color-chart-4: var(--chart-4);
-  --color-chart-5: var(--chart-5);
-  --radius-sm: calc(var(--radius) - 4px);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-lg: var(--radius);
-  --radius-xl: calc(var(--radius) + 4px);
-  --color-sidebar: var(--sidebar);
-  --color-sidebar-foreground: var(--sidebar-foreground);
-  --color-sidebar-primary: var(--sidebar-primary);
-  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
-  --color-sidebar-accent: var(--sidebar-accent);
-  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
-  --color-sidebar-border: var(--sidebar-border);
-  --color-sidebar-ring: var(--sidebar-ring);
-}
-
-@layer base {
-  * {
-    @apply border-border outline-ring/50;
-  }
-  body {
-    @apply bg-background text-foreground;
-  }
-}

package/template/tsconfig.json

@@ -1,25 +0,0 @@
-{
-  "include": ["./**/*.ts", "./**/*.tsx"],
-  "exclude": ["node_modules", "dist"],
-  "compilerOptions": {
-    "target": "ES2022",
-    "jsx": "react-jsx",
-    "module": "ESNext",
-    "lib": ["ES2022", "DOM", "DOM.Iterable"],
-    "types": ["vite/client"],
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "verbatimModuleSyntax": false,
-    "noEmit": true,
-    "allowJs": true,
-    "skipLibCheck": true,
-    "strict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noFallthroughCasesInSwitch": true,
-    "noUncheckedSideEffectImports": true,
-    "paths": {
-      "@/*": ["./src/*"]
-    }
-  }
-}

package/template/vite.config.ts

@@ -1,10 +0,0 @@
-import tailwindcss from "@tailwindcss/vite";
-import { tanstackStart } from "@tanstack/react-start/plugin/vite";
-import viteReact from "@vitejs/plugin-react";
-import { camox } from "camox/vite";
-import { defineConfig } from "vite";
-
-export default defineConfig({
-  resolve: { tsconfigPaths: true },
-  plugins: [tailwindcss(), camox({ projectSlug: "{{projectSlug}}" }), tanstackStart(), viteReact()],
-});