@object-ui/cli 17.3.0 → 17.6.0

package/dist/{chunk-EV2DCI7W.js → chunk-AP2INOE7.js}

@@ -1,16 +1,60 @@
 // src/commands/serve.ts
-import { createServer } from "vite";
+import { createServer, createLogger } from "vite";
 import react from "@vitejs/plugin-react";
-import { existsSync as existsSync2, mkdirSync as mkdirSync2 } from "fs";
-import { join as join2, resolve, relative } from "path";
-import chalk2 from "chalk";
+import { mkdirSync as mkdirSync2 } from "fs";
+import { join as join5 } from "path";
+import chalk3 from "chalk";
 import { execSync } from "child_process";
 
 // src/utils/app-generator.ts
-import { readFileSync, writeFileSync, mkdirSync, readdirSync, statSync, existsSync } from "fs";
-import { join } from "path";
+import { readFileSync as readFileSync2, writeFileSync, mkdirSync, readdirSync, statSync, existsSync as existsSync2 } from "fs";
+import { dirname as dirname2, join as join2 } from "path";
 import chalk from "chalk";
 import * as yaml from "js-yaml";
+
+// src/utils/scaffold-dependencies.ts
+import { existsSync, readFileSync } from "fs";
+import { dirname, join } from "path";
+import { fileURLToPath } from "url";
+var CLI_PACKAGE_NAME = "@object-ui/cli";
+var cachedCliVersion;
+function cliVersion() {
+  if (cachedCliVersion !== void 0) return cachedCliVersion;
+  let dir = dirname(fileURLToPath(import.meta.url));
+  for (; ; ) {
+    const candidate = join(dir, "package.json");
+    if (existsSync(candidate)) {
+      const manifest = JSON.parse(readFileSync(candidate, "utf-8"));
+      if (manifest.name === CLI_PACKAGE_NAME && typeof manifest.version === "string") {
+        cachedCliVersion = manifest.version;
+        return cachedCliVersion;
+      }
+    }
+    const parent = dirname(dir);
+    if (parent === dir) break;
+    dir = parent;
+  }
+  throw new Error(
+    `Could not locate the ${CLI_PACKAGE_NAME} manifest to version the generated app's platform dependencies against. Refusing to write a package.json with a guessed range.`
+  );
+}
+function platformPackageRange() {
+  return `^${cliVersion()}`;
+}
+var REACT_RANGE = "19.2.8";
+var SCAFFOLD_DEV_DEPENDENCIES = {
+  "@tailwindcss/postcss": "^4.3.3",
+  "@types/react": "19.2.18",
+  "@types/react-dom": "19.2.4",
+  "@vitejs/plugin-react": "^6.0.5",
+  autoprefixer: "^10.5.4",
+  postcss: "^8.5.26",
+  tailwindcss: "^4.3.3",
+  typescript: "^6.0.3",
+  vite: "^8.2.1"
+};
+
+// src/utils/app-generator.ts
 function isSupportedSchemaFile(filename) {
   return filename.endsWith(".json") || filename.endsWith(".yml") || filename.endsWith(".yaml");
 }
@@ -18,7 +62,7 @@ function getBaseFileName(filename) {
   return filename.replace(/\.(json|yml|yaml)$/, "");
 }
 function parseSchemaFile(filePath) {
-  const content = readFileSync(filePath, "utf-8");
+  const content = readFileSync2(filePath, "utf-8");
   if (filePath.endsWith(".json")) {
     return JSON.parse(content);
   } else if (filePath.endsWith(".yml") || filePath.endsWith(".yaml")) {
@@ -31,7 +75,7 @@ function scanPagesDirectory(pagesDir) {
   const scanDir = (dir, routePrefix = "") => {
     const entries = readdirSync(dir);
     for (const entry of entries) {
-      const fullPath = join(dir, entry);
+      const fullPath = join2(dir, entry);
       const stat = statSync(fullPath);
       if (stat.isDirectory()) {
         const newPrefix = routePrefix + "/" + entry;
@@ -73,7 +117,255 @@ function scanPagesDirectory(pagesDir) {
   });
   return routes;
 }
+var PLATFORM_RUNTIME_PACKAGES = [
+  "@object-ui/react",
+  "@object-ui/components",
+  "@object-ui/plugin-charts",
+  "@object-ui/plugin-editor",
+  "@object-ui/plugin-kanban",
+  "@object-ui/plugin-markdown",
+  "@object-ui/plugin-form",
+  "@object-ui/plugin-grid",
+  "@object-ui/plugin-view"
+];
+function buildAppDependencies() {
+  const range = platformPackageRange();
+  return {
+    react: REACT_RANGE,
+    "react-dom": REACT_RANGE,
+    ...Object.fromEntries(PLATFORM_RUNTIME_PACKAGES.map((name) => [name, range]))
+  };
+}
+function buildRoutedAppDependencies() {
+  const range = platformPackageRange();
+  return {
+    react: REACT_RANGE,
+    "react-dom": REACT_RANGE,
+    "react-router-dom": "^7.18.2",
+    "lucide-react": "^1.31.0",
+    ...Object.fromEntries(PLATFORM_RUNTIME_PACKAGES.map((name) => [name, range]))
+  };
+}
+var APP_VITE_ENV_D_TS = `/// <reference types="vite/client" />
+`;
+var APP_TSCONFIG = {
+  compilerOptions: {
+    target: "ES2020",
+    useDefineForClassFields: true,
+    lib: ["ES2020", "DOM", "DOM.Iterable"],
+    module: "ESNext",
+    skipLibCheck: true,
+    moduleResolution: "bundler",
+    allowImportingTsExtensions: true,
+    resolveJsonModule: true,
+    isolatedModules: true,
+    noEmit: true,
+    jsx: "react-jsx",
+    strict: true,
+    noUnusedLocals: true,
+    noUnusedParameters: true,
+    noFallthroughCasesInSwitch: true
+  },
+  include: ["src"]
+};
+var APP_POSTCSS_CONFIG = `export default {
+  plugins: {
+    '@tailwindcss/postcss': {},
+    autoprefixer: {},
+  },
+};`;
+function currentContext() {
+  const cwd = process.cwd();
+  return { cwd, isMonorepo: existsSync2(join2(cwd, "pnpm-workspace.yaml")) };
+}
+function buildAppPackageJson(context) {
+  return {
+    name: "objectui-temp-app",
+    private: true,
+    type: "module",
+    // In monorepo, we use root node_modules, so we don't need dependencies here
+    dependencies: context.isMonorepo ? {} : buildAppDependencies(),
+    devDependencies: context.isMonorepo ? {} : { ...SCAFFOLD_DEV_DEPENDENCIES }
+  };
+}
+function buildRoutedAppPackageJson() {
+  return {
+    name: "objectui-temp-app",
+    private: true,
+    type: "module",
+    dependencies: buildRoutedAppDependencies(),
+    devDependencies: { ...SCAFFOLD_DEV_DEPENDENCIES }
+  };
+}
+function buildAppSourceDirectives(context) {
+  const sources = [`@source '../index.html';`, `@source '../src/**/*.{js,ts,jsx,tsx,json}';`];
+  if (context.isMonorepo) {
+    sources.push(`@source '${join2(context.cwd, "packages/components/src/**/*.{ts,tsx}")}';`);
+    sources.push(`@source '${join2(context.cwd, "packages/plugin-*/src/**/*.{ts,tsx}")}';`);
+  } else {
+    sources.push(`@source '../node_modules/@object-ui/*/dist/**/*.js';`);
+  }
+  return sources;
+}
+var APP_THEME_TOKENS = `@theme {
+  /* Border radius tokens */
+  --radius-lg: var(--radius);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-sm: calc(var(--radius) - 4px);
+
+  /* Color tokens mapped to the CSS variables declared below */
+  --color-border: hsl(var(--border));
+  --color-input: hsl(var(--input));
+  --color-ring: hsl(var(--ring));
+  --color-background: hsl(var(--background));
+  --color-foreground: hsl(var(--foreground));
+  --color-primary: hsl(var(--primary));
+  --color-primary-foreground: hsl(var(--primary-foreground));
+  --color-secondary: hsl(var(--secondary));
+  --color-secondary-foreground: hsl(var(--secondary-foreground));
+  --color-destructive: hsl(var(--destructive));
+  --color-destructive-foreground: hsl(var(--destructive-foreground));
+  --color-muted: hsl(var(--muted));
+  --color-muted-foreground: hsl(var(--muted-foreground));
+  --color-accent: hsl(var(--accent));
+  --color-accent-foreground: hsl(var(--accent-foreground));
+  --color-popover: hsl(var(--popover));
+  --color-popover-foreground: hsl(var(--popover-foreground));
+  --color-card: hsl(var(--card));
+  --color-card-foreground: hsl(var(--card-foreground));
+  --color-sidebar: hsl(var(--sidebar));
+  --color-sidebar-foreground: hsl(var(--sidebar-foreground));
+  --color-sidebar-primary: hsl(var(--sidebar-primary));
+  --color-sidebar-primary-foreground: hsl(var(--sidebar-primary-foreground));
+  --color-sidebar-accent: hsl(var(--sidebar-accent));
+  --color-sidebar-accent-foreground: hsl(var(--sidebar-accent-foreground));
+  --color-sidebar-border: hsl(var(--sidebar-border));
+  --color-sidebar-ring: hsl(var(--sidebar-ring));
+
+  /* Chart colors */
+  --color-chart-1: hsl(var(--chart-1));
+  --color-chart-2: hsl(var(--chart-2));
+  --color-chart-3: hsl(var(--chart-3));
+  --color-chart-4: hsl(var(--chart-4));
+  --color-chart-5: hsl(var(--chart-5));
+}`;
+var APP_THEME_VARIABLES = `:root {
+  color-scheme: light;
+
+  --background: 0 0% 100%;
+  --foreground: 222.2 84% 4.9%;
+  --card: 0 0% 100%;
+  --card-foreground: 222.2 84% 4.9%;
+  --popover: 0 0% 100%;
+  --popover-foreground: 222.2 84% 4.9%;
+  --primary: 222.2 47.4% 11.2%;
+  --primary-foreground: 210 40% 98%;
+  --secondary: 210 40% 96.1%;
+  --secondary-foreground: 222.2 47.4% 11.2%;
+  --muted: 210 40% 96.1%;
+  --muted-foreground: 215.4 16.3% 46.9%;
+  --accent: 210 40% 96.1%;
+  --accent-foreground: 222.2 47.4% 11.2%;
+  --destructive: 0 84.2% 60.2%;
+  --destructive-foreground: 210 40% 98%;
+  --border: 214.3 31.8% 91.4%;
+  --input: 214.3 31.8% 91.4%;
+  --ring: 222.2 84% 4.9%;
+  --radius: 0.5rem;
+  --chart-1: 12 76% 61%;
+  --chart-2: 173 58% 39%;
+  --chart-3: 197 37% 24%;
+  --chart-4: 43 74% 66%;
+  --chart-5: 27 87% 67%;
+
+  /* Sidebar colors */
+  --sidebar: 0 0% 98%;
+  --sidebar-foreground: 240 5.3% 26.1%;
+  --sidebar-primary: 240 5.9% 10%;
+  --sidebar-primary-foreground: 0 0% 98%;
+  --sidebar-accent: 240 4.8% 95.9%;
+  --sidebar-accent-foreground: 240 5.9% 10%;
+  --sidebar-border: 220 13% 91%;
+  --sidebar-ring: 217.2 91.2% 59.8%;
+}
+
+.dark {
+  color-scheme: dark;
+
+  --background: 222.2 84% 4.9%;
+  --foreground: 210 40% 98%;
+  --card: 222.2 84% 4.9%;
+  --card-foreground: 210 40% 98%;
+  --popover: 222.2 84% 4.9%;
+  --popover-foreground: 210 40% 98%;
+  --primary: 210 40% 98%;
+  --primary-foreground: 222.2 47.4% 11.2%;
+  --secondary: 217.2 32.6% 17.5%;
+  --secondary-foreground: 210 40% 98%;
+  --muted: 217.2 32.6% 17.5%;
+  --muted-foreground: 215 20.2% 65.1%;
+  --accent: 217.2 32.6% 17.5%;
+  --accent-foreground: 210 40% 98%;
+  --destructive: 0 62.8% 30.6%;
+  --destructive-foreground: 210 40% 98%;
+  --border: 217.2 32.6% 17.5%;
+  --input: 217.2 32.6% 17.5%;
+  --ring: 212.7 26.8% 83.9%;
+  --chart-1: 220 70% 50%;
+  --chart-2: 160 60% 45%;
+  --chart-3: 30 80% 55%;
+  --chart-4: 280 65% 60%;
+  --chart-5: 340 75% 55%;
+
+  /* Sidebar colors for dark mode */
+  --sidebar: 240 5.9% 10%;
+  --sidebar-foreground: 240 4.8% 95.9%;
+  --sidebar-primary: 224.3 76.3% 48%;
+  --sidebar-primary-foreground: 0 0% 100%;
+  --sidebar-accent: 240 3.7% 15.9%;
+  --sidebar-accent-foreground: 240 4.8% 95.9%;
+  --sidebar-border: 240 3.7% 15.9%;
+  --sidebar-ring: 217.2 91.2% 59.8%;
+}`;
+function buildAppIndexCss(context) {
+  return `@import 'tailwindcss';
+
+/* Class-based dark variant: follow \`.dark\` on <html> \u2014 the routed app's
+   \`src/theme-provider.tsx\` toggles exactly that class \u2014 instead of the OS
+   \`prefers-color-scheme\`. Same spelling as packages/components/src/index.css. */
+@custom-variant dark (&:where(.dark, .dark *));
+
+/* Sources to scan for utility classes (v4's replacement for v3 \`content\`) */
+${buildAppSourceDirectives(context).join("\n")}
+
+${APP_THEME_TOKENS}
+
+${APP_THEME_VARIABLES}
+
+* {
+  border-color: hsl(var(--border));
+}
+
+body {
+  background-color: hsl(var(--background));
+  color: hsl(var(--foreground));
+  font-family: var(--font-sans);
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  min-height: 100vh;
+}`;
+}
+function writeGeneratedFiles(tmpDir, files) {
+  for (const [relativePath, contents] of Object.entries(files)) {
+    const target = join2(tmpDir, relativePath);
+    mkdirSync(dirname2(target), { recursive: true });
+    writeFileSync(target, contents);
+  }
+}
 function createTempApp(tmpDir, schema) {
+  writeGeneratedFiles(tmpDir, buildAppFiles(schema, currentContext()));
+}
+function buildAppFiles(schema, context) {
   const html = `<!DOCTYPE html>
 <html lang="en">
   <head>
@@ -86,9 +378,6 @@ function createTempApp(tmpDir, schema) {
     <script type="module" src="/src/main.tsx"></script>
   </body>
 </html>`;
-  writeFileSync(join(tmpDir, "index.html"), html);
-  const srcDir = join(tmpDir, "src");
-  mkdirSync(srcDir, { recursive: true });
   const mainTsx = `import React from 'react';
 import ReactDOM from 'react-dom/client';
 import App from './App';
@@ -99,7 +388,6 @@ ReactDOM.createRoot(document.getElementById('root')!).render(
     <App />
   </React.StrictMode>
 );`;
-  writeFileSync(join(srcDir, "main.tsx"), mainTsx);
   const appTsx = `import { SchemaRenderer } from '@object-ui/react';
 import '@object-ui/components';
 import '@object-ui/plugin-charts';
@@ -117,256 +405,22 @@ function App() {
 }
 
 export default App;`;
-  writeFileSync(join(srcDir, "App.tsx"), appTsx);
-  const indexCss = `@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-@layer base {
-  :root {
-    --background: 0 0% 100%;
-    --foreground: 222.2 84% 4.9%;
-    --card: 0 0% 100%;
-    --card-foreground: 222.2 84% 4.9%;
-    --popover: 0 0% 100%;
-    --popover-foreground: 222.2 84% 4.9%;
-    --primary: 222.2 47.4% 11.2%;
-    --primary-foreground: 210 40% 98%;
-    --secondary: 210 40% 96.1%;
-    --secondary-foreground: 222.2 47.4% 11.2%;
-    --muted: 210 40% 96.1%;
-    --muted-foreground: 215.4 16.3% 46.9%;
-    --accent: 210 40% 96.1%;
-    --accent-foreground: 222.2 47.4% 11.2%;
-    --destructive: 0 84.2% 60.2%;
-    --destructive-foreground: 210 40% 98%;
-    --border: 214.3 31.8% 91.4%;
-    --input: 214.3 31.8% 91.4%;
-    --ring: 222.2 84% 4.9%;
-    --radius: 0.5rem;
-    --chart-1: 12 76% 61%;
-    --chart-2: 173 58% 39%;
-    --chart-3: 197 37% 24%;
-    --chart-4: 43 74% 66%;
-    --chart-5: 27 87% 67%;
-  }
-
-  .dark {
-    --background: 222.2 84% 4.9%;
-    --foreground: 210 40% 98%;
-    --card: 222.2 84% 4.9%;
-    --card-foreground: 210 40% 98%;
-    --popover: 222.2 84% 4.9%;
-    --popover-foreground: 210 40% 98%;
-    --primary: 210 40% 98%;
-    --primary-foreground: 222.2 47.4% 11.2%;
-    --secondary: 217.2 32.6% 17.5%;
-    --secondary-foreground: 210 40% 98%;
-    --muted: 217.2 32.6% 17.5%;
-    --muted-foreground: 215 20.2% 65.1%;
-    --accent: 217.2 32.6% 17.5%;
-    --accent-foreground: 210 40% 98%;
-    --destructive: 0 62.8% 30.6%;
-    --destructive-foreground: 210 40% 98%;
-    --border: 217.2 32.6% 17.5%;
-    --input: 217.2 32.6% 17.5%;
-    --ring: 212.7 26.8% 83.9%;
-    --chart-1: 220 70% 50%;
-    --chart-2: 160 60% 45%;
-    --chart-3: 30 80% 55%;
-    --chart-4: 280 65% 60%;
-    --chart-5: 340 75% 55%;
-  }
-}
-
-@layer base {
-  * {
-    @apply border-border;
-  }
-  body {
-    @apply bg-background text-foreground;
-  }
-}`;
-  writeFileSync(join(srcDir, "index.css"), indexCss);
-  const tailwindConfig = `/** @type {import('tailwindcss').Config} */
-export default {
-  darkMode: ['class'],
-  content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
-  theme: {
-    extend: {
-      borderRadius: {
-        lg: 'var(--radius)',
-        md: 'calc(var(--radius) - 2px)',
-        sm: 'calc(var(--radius) - 4px)',
-      },
-      colors: {
-        background: 'hsl(var(--background))',
-        foreground: 'hsl(var(--foreground))',
-        card: {
-          DEFAULT: 'hsl(var(--card))',
-          foreground: 'hsl(var(--card-foreground))',
-        },
-        popover: {
-          DEFAULT: 'hsl(var(--popover))',
-          foreground: 'hsl(var(--popover-foreground))',
-        },
-        primary: {
-          DEFAULT: 'hsl(var(--primary))',
-          foreground: 'hsl(var(--primary-foreground))',
-        },
-        secondary: {
-          DEFAULT: 'hsl(var(--secondary))',
-          foreground: 'hsl(var(--secondary-foreground))',
-        },
-        muted: {
-          DEFAULT: 'hsl(var(--muted))',
-          foreground: 'hsl(var(--muted-foreground))',
-        },
-        accent: {
-          DEFAULT: 'hsl(var(--accent))',
-          foreground: 'hsl(var(--accent-foreground))',
-        },
-        destructive: {
-          DEFAULT: 'hsl(var(--destructive))',
-          foreground: 'hsl(var(--destructive-foreground))',
-        },
-        border: 'hsl(var(--border))',
-        input: 'hsl(var(--input))',
-        ring: 'hsl(var(--ring))',
-        chart: {
-          1: 'hsl(var(--chart-1))',
-          2: 'hsl(var(--chart-2))',
-          3: 'hsl(var(--chart-3))',
-          4: 'hsl(var(--chart-4))',
-          5: 'hsl(var(--chart-5))',
-        },
-      },
-    },
-  },
-  plugins: [],
-};`;
-  const cwd = process.cwd();
-  const isMonorepo = existsSync(join(cwd, "pnpm-workspace.yaml"));
-  const contentPaths = ["'./index.html'", "'./src/**/*.{js,ts,jsx,tsx,json}'"];
-  if (isMonorepo) {
-    const componentsPath = join(cwd, "packages/components/src/**/*.{ts,tsx}");
-    const pluginsPath = join(cwd, "packages/plugin-*/src/**/*.{ts,tsx}");
-    contentPaths.push(`'${componentsPath}'`);
-    contentPaths.push(`'${pluginsPath}'`);
-  }
-  const finalTailwindConfig = `/** @type {import('tailwindcss').Config} */
-export default {
-  darkMode: ['class'],
-  content: [${contentPaths.join(", ")}],
-  theme: {
-    extend: {
-      borderRadius: {
-        lg: 'var(--radius)',
-        md: 'calc(var(--radius) - 2px)',
-        sm: 'calc(var(--radius) - 4px)',
-      },
-      colors: {
-        background: 'hsl(var(--background))',
-        foreground: 'hsl(var(--foreground))',
-        card: {
-          DEFAULT: 'hsl(var(--card))',
-          foreground: 'hsl(var(--card-foreground))',
-        },
-        popover: {
-          DEFAULT: 'hsl(var(--popover))',
-          foreground: 'hsl(var(--popover-foreground))',
-        },
-        primary: {
-          DEFAULT: 'hsl(var(--primary))',
-          foreground: 'hsl(var(--primary-foreground))',
-        },
-        secondary: {
-          DEFAULT: 'hsl(var(--secondary))',
-          foreground: 'hsl(var(--secondary-foreground))',
-        },
-        muted: {
-          DEFAULT: 'hsl(var(--muted))',
-          foreground: 'hsl(var(--muted-foreground))',
-        },
-        accent: {
-          DEFAULT: 'hsl(var(--accent))',
-          foreground: 'hsl(var(--accent-foreground))',
-        },
-        destructive: {
-          DEFAULT: 'hsl(var(--destructive))',
-          foreground: 'hsl(var(--destructive-foreground))',
-        },
-        border: 'hsl(var(--border))',
-        input: 'hsl(var(--input))',
-        ring: 'hsl(var(--ring))',
-        chart: {
-          1: 'hsl(var(--chart-1))',
-          2: 'hsl(var(--chart-2))',
-          3: 'hsl(var(--chart-3))',
-          4: 'hsl(var(--chart-4))',
-          5: 'hsl(var(--chart-5))',
-        },
-      },
-    },
-  },
-  plugins: [],
-};`;
-  writeFileSync(join(tmpDir, "tailwind.config.js"), finalTailwindConfig);
-  const finalPostcssConfig = `export default {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
-};`;
-  writeFileSync(join(tmpDir, "postcss.config.js"), finalPostcssConfig);
-  const baseDependencies = {
-    react: "^18.3.1",
-    "react-dom": "^18.3.1",
-    "@object-ui/react": "^0.1.0",
-    "@object-ui/components": "^0.1.0"
-  };
-  const baseDevDependencies = {
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
-    "@vitejs/plugin-react": "^4.2.1",
-    autoprefixer: "^10.4.23",
-    postcss: "^8.5.6",
-    tailwindcss: "^3.4.19",
-    typescript: "~5.7.3",
-    vite: "^5.0.0"
-  };
-  const packageJson = {
-    name: "objectui-temp-app",
-    private: true,
-    type: "module",
-    // In monorepo, we use root node_modules, so we don't need dependencies here
-    dependencies: isMonorepo ? {} : baseDependencies,
-    devDependencies: isMonorepo ? {} : baseDevDependencies
-  };
-  writeFileSync(join(tmpDir, "package.json"), JSON.stringify(packageJson, null, 2));
-  const tsconfig = {
-    compilerOptions: {
-      target: "ES2020",
-      useDefineForClassFields: true,
-      lib: ["ES2020", "DOM", "DOM.Iterable"],
-      module: "ESNext",
-      skipLibCheck: true,
-      moduleResolution: "bundler",
-      allowImportingTsExtensions: true,
-      resolveJsonModule: true,
-      isolatedModules: true,
-      noEmit: true,
-      jsx: "react-jsx",
-      strict: true,
-      noUnusedLocals: true,
-      noUnusedParameters: true,
-      noFallthroughCasesInSwitch: true
-    },
-    include: ["src"]
+  return {
+    "index.html": html,
+    "src/main.tsx": mainTsx,
+    "src/App.tsx": appTsx,
+    "src/vite-env.d.ts": APP_VITE_ENV_D_TS,
+    "src/index.css": buildAppIndexCss(context),
+    "postcss.config.js": APP_POSTCSS_CONFIG,
+    "package.json": JSON.stringify(buildAppPackageJson(context), null, 2),
+    "tsconfig.json": JSON.stringify(APP_TSCONFIG, null, 2)
   };
-  writeFileSync(join(tmpDir, "tsconfig.json"), JSON.stringify(tsconfig, null, 2));
 }
 function createTempAppWithRouting(tmpDir, routes, appConfig) {
+  writeGeneratedFiles(tmpDir, buildRoutedAppFiles(routes, appConfig, currentContext()));
+}
+function buildRoutedAppFiles(routes, appConfig, context) {
+  const files = {};
   const html = `<!DOCTYPE html>
 <html lang="en">
   <head>
@@ -379,20 +433,13 @@ function createTempAppWithRouting(tmpDir, routes, appConfig) {
     <script type="module" src="/src/main.tsx"></script>
   </body>
 </html>`;
-  writeFileSync(join(tmpDir, "index.html"), html);
-  const srcDir = join(tmpDir, "src");
-  mkdirSync(srcDir, { recursive: true });
-  const schemasDir = join(srcDir, "schemas");
-  mkdirSync(schemasDir, { recursive: true });
+  files["index.html"] = html;
   const schemaImports = [];
   const routeComponents = [];
   routes.forEach((route, index) => {
     const schemaVarName = `schema${index}`;
     const schemaFileName = `page${index}.json`;
-    writeFileSync(
-      join(schemasDir, schemaFileName),
-      JSON.stringify(route.schema, null, 2)
-    );
+    files[`src/schemas/${schemaFileName}`] = JSON.stringify(route.schema, null, 2);
     schemaImports.push(`import ${schemaVarName} from './schemas/${schemaFileName}';`);
     routeComponents.push(`        <Route path="${route.path}" element={<SchemaRenderer schema={${schemaVarName}} />} />`);
   });
@@ -469,7 +516,7 @@ export const useTheme = () => {
 
   return context
 }`;
-  writeFileSync(join(srcDir, "theme-provider.tsx"), themeProviderTsx);
+  files["src/theme-provider.tsx"] = themeProviderTsx;
   const mainTsx = `import React from 'react';
 import ReactDOM from 'react-dom/client';
 import App from './App';
@@ -483,19 +530,18 @@ ReactDOM.createRoot(document.getElementById('root')!).render(
     </ThemeProvider>
   </React.StrictMode>
 );`;
-  writeFileSync(join(srcDir, "main.tsx"), mainTsx);
+  files["src/main.tsx"] = mainTsx;
   let layoutImport = "";
   let layoutWrapperStart = "";
   let layoutWrapperEnd = "";
   if (appConfig) {
     const layoutCode = `
+import type { ComponentType, ReactNode } from 'react';
 import { Link, useLocation } from 'react-router-dom';
 import * as LucideIcons from 'lucide-react';
 import { Moon, Sun } from "lucide-react"
 import { useTheme } from "./theme-provider"
-import { 
-  cn,
-  Button,
+import {
   DropdownMenu,
   DropdownMenuContent,
   DropdownMenuItem,
@@ -507,8 +553,6 @@ import {
   SidebarHeader,
   SidebarRail,
   SidebarGroup,
-  SidebarGroupContent,
-  SidebarGroupLabel,
   SidebarMenu,
   SidebarMenuItem,
   SidebarMenuButton,
@@ -521,11 +565,36 @@ import {
   Collapsible,
   CollapsibleTrigger,
   CollapsibleContent
-} from '@object-ui/components'; 
+} from '@object-ui/components';
+
+/** One entry of \`app.json\`'s \`menu\`, as this layout reads it. */
+type MenuItem = {
+  label?: string;
+  path?: string;
+  icon?: string;
+  children?: MenuItem[];
+};
+
+/** The \`app.json\` fields this layout renders. */
+type AppConfig = {
+  title?: string;
+  logo?: string;
+  menu?: MenuItem[];
+};
+
+// Lucide publishes every icon as a named export, and a menu entry names one as
+// a string \u2014 so the lookup is a runtime index into the namespace object, which
+// has no index signature. Narrowing it to the component-by-name shape this file
+// actually uses keeps that honest without an \`any\` or a \`@ts-expect-error\`; the
+// \`undefined\` arm is real, since the namespace also exports helpers that are not
+// components and a schema may name an icon that does not exist.
+const lucideIcons = LucideIcons as unknown as Record<
+  string,
+  ComponentType<{ className?: string }> | undefined
+>;
 
-const DynamicIcon = ({ name, className }) => {
-  // @ts-expect-error - Dynamic icon lookup from Lucide icons
-  const Icon = LucideIcons[name];
+const DynamicIcon = ({ name, className }: { name: string; className?: string }) => {
+  const Icon = lucideIcons[name];
   if (!Icon) return null;
   return <Icon className={className} />;
 };
@@ -566,7 +635,7 @@ export function ModeToggle() {
   )
 }
 
-const AppLayout = ({ app, children }) => {
+const AppLayout = ({ app, children }: { app: AppConfig; children: ReactNode }) => {
   const location = useLocation();
   const menu = app.menu || [];
   
@@ -668,13 +737,13 @@ const AppLayout = ({ app, children }) => {
 
 export default AppLayout;
 `;
-    writeFileSync(join(srcDir, "Layout.tsx"), layoutCode);
+    files["src/Layout.tsx"] = layoutCode;
     layoutImport = `import AppLayout from './Layout';
 const appConfig = ${JSON.stringify(appConfig)};`;
     layoutWrapperStart = `<AppLayout app={appConfig}>`;
     layoutWrapperEnd = `</AppLayout>`;
   }
-  const appTsx = `import { BrowserRouter, Routes, Route, Link } from 'react-router-dom';
+  const appTsx = `import { BrowserRouter, Routes, Route } from 'react-router-dom';
 import { SchemaRenderer } from '@object-ui/react';
 import '@object-ui/components';
 import '@object-ui/plugin-charts';
@@ -700,257 +769,313 @@ ${routeComponents.join("\n")}
 }
 
 export default App;`;
-  writeFileSync(join(srcDir, "App.tsx"), appTsx);
-  const indexCss = `@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-@layer base {
-  :root {
-    --background: 0 0% 100%;
-    --foreground: 222.2 84% 4.9%;
-    --card: 0 0% 100%;
-    --card-foreground: 222.2 84% 4.9%;
-    --popover: 0 0% 100%;
-    --popover-foreground: 222.2 84% 4.9%;
-    --primary: 222.2 47.4% 11.2%;
-    --primary-foreground: 210 40% 98%;
-    --secondary: 210 40% 96.1%;
-    --secondary-foreground: 222.2 47.4% 11.2%;
-    --muted: 210 40% 96.1%;
-    --muted-foreground: 215.4 16.3% 46.9%;
-    --accent: 210 40% 96.1%;
-    --accent-foreground: 222.2 47.4% 11.2%;
-    --destructive: 0 84.2% 60.2%;
-    --destructive-foreground: 210 40% 98%;
-    --border: 214.3 31.8% 91.4%;
-    --input: 214.3 31.8% 91.4%;
-    --ring: 222.2 84% 4.9%;
-    --radius: 0.5rem;
-    --chart-1: 12 76% 61%;
-    --chart-2: 173 58% 39%;
-    --chart-3: 197 37% 24%;
-    --chart-4: 43 74% 66%;
-    --chart-5: 27 87% 67%;
-  }
+  files["src/App.tsx"] = appTsx;
+  files["src/vite-env.d.ts"] = APP_VITE_ENV_D_TS;
+  files["src/index.css"] = buildAppIndexCss(context);
+  files["postcss.config.js"] = APP_POSTCSS_CONFIG;
+  files["package.json"] = JSON.stringify(buildRoutedAppPackageJson(), null, 2);
+  files["tsconfig.json"] = JSON.stringify(APP_TSCONFIG, null, 2);
+  return files;
+}
 
-  .dark {
-    --background: 222.2 84% 4.9%;
-    --foreground: 210 40% 98%;
-    --card: 222.2 84% 4.9%;
-    --card-foreground: 210 40% 98%;
-    --popover: 222.2 84% 4.9%;
-    --popover-foreground: 210 40% 98%;
-    --primary: 210 40% 98%;
-    --primary-foreground: 222.2 47.4% 11.2%;
-    --secondary: 217.2 32.6% 17.5%;
-    --secondary-foreground: 210 40% 98%;
-    --muted: 217.2 32.6% 17.5%;
-    --muted-foreground: 215 20.2% 65.1%;
-    --accent: 217.2 32.6% 17.5%;
-    --accent-foreground: 210 40% 98%;
-    --destructive: 0 62.8% 30.6%;
-    --destructive-foreground: 210 40% 98%;
-    --border: 217.2 32.6% 17.5%;
-    --input: 217.2 32.6% 17.5%;
-    --ring: 212.7 26.8% 83.9%;
-    --chart-1: 220 70% 50%;
-    --chart-2: 160 60% 45%;
-    --chart-3: 30 80% 55%;
-    --chart-4: 280 65% 60%;
-    --chart-5: 340 75% 55%;
+// src/utils/project-source.ts
+import { existsSync as existsSync3, statSync as statSync2 } from "fs";
+import { basename, dirname as dirname3, join as join3, relative, resolve } from "path";
+import chalk2 from "chalk";
+function readAppConfig(path, warnings) {
+  try {
+    return parseSchemaFile(path);
+  } catch (error) {
+    warnings.push(
+      `Failed to parse app config ${path}: ${error instanceof Error ? error.message : error}`
+    );
+    return null;
   }
 }
-
-@layer base {
-  * {
-    @apply border-border;
+function resolveProjectSource(cwd, schemaArg) {
+  const warnings = [];
+  const absoluteSchemaPath = resolve(cwd, schemaArg);
+  if (existsSync3(absoluteSchemaPath)) {
+    const argumentStats = statSync2(absoluteSchemaPath);
+    if (argumentStats.isFile()) {
+      const projectRoot = dirname3(absoluteSchemaPath);
+      const pagesDir = join3(projectRoot, "pages");
+      if (existsSync3(pagesDir)) {
+        return {
+          mode: "routes",
+          projectRoot,
+          pagesDir,
+          pagesDirOrigin: "schema-dir",
+          routes: scanRoutes(pagesDir),
+          appConfig: readAppConfig(absoluteSchemaPath, warnings),
+          appConfigPath: absoluteSchemaPath,
+          warnings
+        };
+      }
+    } else if (argumentStats.isDirectory()) {
+      const fromDirectory = resolveDirectoryArgument(absoluteSchemaPath, warnings);
+      if (fromDirectory) return fromDirectory;
+    }
   }
-  body {
-    @apply bg-background text-foreground font-sans antialiased min-h-screen;
+  const localPagesDir = join3(cwd, "pages");
+  if (existsSync3(localPagesDir)) {
+    const localAppConfigPath = join3(cwd, "app.json");
+    const hasLocalAppConfig = existsSync3(localAppConfigPath);
+    return {
+      mode: "routes",
+      projectRoot: cwd,
+      pagesDir: localPagesDir,
+      pagesDirOrigin: "cwd",
+      routes: scanRoutes(localPagesDir),
+      appConfig: hasLocalAppConfig ? readAppConfig(localAppConfigPath, warnings) : null,
+      appConfigPath: hasLocalAppConfig ? localAppConfigPath : null,
+      warnings
+    };
   }
-}`;
-  writeFileSync(join(srcDir, "index.css"), indexCss);
-  const cwd = process.cwd();
-  const isMonorepo = existsSync(join(cwd, "pnpm-workspace.yaml"));
-  const contentPaths = ["'./index.html'", "'./src/**/*.{js,ts,jsx,tsx,json}'"];
-  if (isMonorepo) {
-    const componentsPath = join(cwd, "packages/components/src/**/*.{ts,tsx}");
-    const pluginsPath = join(cwd, "packages/plugin-*/src/**/*.{ts,tsx}");
-    contentPaths.push(`'${componentsPath}'`);
-    contentPaths.push(`'${pluginsPath}'`);
+  if (!existsSync3(absoluteSchemaPath)) {
+    throw new Error(
+      `Schema file not found: ${schemaArg}
+Run 'objectui init' to create a sample schema.`
+    );
   }
-  const tailwindConfig = `/** @type {import('tailwindcss').Config} */
-export default {
-  darkMode: ['class'],
-  content: [${contentPaths.join(", ")}],
-  theme: {
-    extend: {
-      borderRadius: {
-        lg: 'var(--radius)',
-        md: 'calc(var(--radius) - 2px)',
-        sm: 'calc(var(--radius) - 4px)',
-      },
-      colors: {
-        background: 'hsl(var(--background))',
-        foreground: 'hsl(var(--foreground))',
-        card: {
-          DEFAULT: 'hsl(var(--card))',
-          foreground: 'hsl(var(--card-foreground))',
-        },
-        popover: {
-          DEFAULT: 'hsl(var(--popover))',
-          foreground: 'hsl(var(--popover-foreground))',
-        },
-        primary: {
-          DEFAULT: 'hsl(var(--primary))',
-          foreground: 'hsl(var(--primary-foreground))',
-        },
-        secondary: {
-          DEFAULT: 'hsl(var(--secondary))',
-          foreground: 'hsl(var(--secondary-foreground))',
-        },
-        muted: {
-          DEFAULT: 'hsl(var(--muted))',
-          foreground: 'hsl(var(--muted-foreground))',
-        },
-        accent: {
-          DEFAULT: 'hsl(var(--accent))',
-          foreground: 'hsl(var(--accent-foreground))',
-        },
-        destructive: {
-          DEFAULT: 'hsl(var(--destructive))',
-          foreground: 'hsl(var(--destructive-foreground))',
-        },
-        border: 'hsl(var(--border))',
-        input: 'hsl(var(--input))',
-        ring: 'hsl(var(--ring))',
-        chart: {
-          1: 'hsl(var(--chart-1))',
-          2: 'hsl(var(--chart-2))',
-          3: 'hsl(var(--chart-3))',
-          4: 'hsl(var(--chart-4))',
-          5: 'hsl(var(--chart-5))',
-        },
-      },
-    },
-  },
-  plugins: [],
-};`;
-  writeFileSync(join(tmpDir, "tailwind.config.js"), tailwindConfig);
-  const postcssConfig = `export default {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
-};`;
-  writeFileSync(join(tmpDir, "postcss.config.js"), postcssConfig);
-  const packageJson = {
-    name: "objectui-temp-app",
-    private: true,
-    type: "module",
-    dependencies: {
-      react: "^18.3.1",
-      "react-dom": "^18.3.1",
-      "react-router-dom": "^7.12.0",
-      "@object-ui/react": "^0.1.0",
-      "@object-ui/components": "^0.1.0"
-    },
-    devDependencies: {
-      "@types/react": "^18.3.12",
-      "@types/react-dom": "^18.3.1",
-      "@vitejs/plugin-react": "^4.2.1",
-      autoprefixer: "^10.4.23",
-      postcss: "^8.5.6",
-      tailwindcss: "^3.4.19",
-      typescript: "~5.7.3",
-      vite: "^5.0.0"
-    }
+  if (statSync2(absoluteSchemaPath).isDirectory()) {
+    throw new Error(
+      `Not a project directory: ${schemaArg}
+A directory argument must be a 'pages' directory, or contain one, for file-system routing \u2014 ${absoluteSchemaPath} is neither.
+Pass a JSON/YAML schema file instead, or run 'objectui init' to create a project.`
+    );
+  }
+  let schema;
+  try {
+    schema = parseSchemaFile(absoluteSchemaPath);
+  } catch (error) {
+    throw new Error(`Invalid schema file: ${error instanceof Error ? error.message : error}`);
+  }
+  return {
+    mode: "schema",
+    projectRoot: dirname3(absoluteSchemaPath),
+    schemaFile: absoluteSchemaPath,
+    schema,
+    warnings
   };
-  writeFileSync(join(tmpDir, "package.json"), JSON.stringify(packageJson, null, 2));
-  const tsconfig = {
-    compilerOptions: {
-      target: "ES2020",
-      useDefineForClassFields: true,
-      lib: ["ES2020", "DOM", "DOM.Iterable"],
-      module: "ESNext",
-      skipLibCheck: true,
-      moduleResolution: "bundler",
-      allowImportingTsExtensions: true,
-      resolveJsonModule: true,
-      isolatedModules: true,
-      noEmit: true,
-      jsx: "react-jsx",
-      strict: true,
-      noUnusedLocals: true,
-      noUnusedParameters: true,
-      noFallthroughCasesInSwitch: true
-    },
-    include: ["src"]
+}
+function resolveDirectoryArgument(argumentDir, warnings) {
+  const isPagesDir = basename(argumentDir) === "pages";
+  const pagesDir = isPagesDir ? argumentDir : join3(argumentDir, "pages");
+  if (!isPagesDir && !(existsSync3(pagesDir) && statSync2(pagesDir).isDirectory())) {
+    return null;
+  }
+  const projectRoot = isPagesDir ? dirname3(argumentDir) : argumentDir;
+  const appConfigPath = join3(projectRoot, "app.json");
+  const hasAppConfig = existsSync3(appConfigPath) && statSync2(appConfigPath).isFile();
+  return {
+    mode: "routes",
+    projectRoot,
+    pagesDir,
+    pagesDirOrigin: "argument-dir",
+    routes: scanRoutes(pagesDir),
+    appConfig: hasAppConfig ? readAppConfig(appConfigPath, warnings) : null,
+    appConfigPath: hasAppConfig ? appConfigPath : null,
+    warnings
+  };
+}
+function scanRoutes(pagesDir) {
+  const routes = scanPagesDirectory(pagesDir);
+  if (routes.length === 0) {
+    throw new Error(`No schema files found in ${pagesDir}`);
+  }
+  return routes;
+}
+function reportProjectSource(source, cwd) {
+  for (const warning of source.warnings) {
+    console.warn(chalk2.yellow(`\u26A0 ${warning}`));
+  }
+  if (source.mode === "schema") {
+    console.log(chalk2.blue("\u{1F4CB} Loading schema:"), chalk2.cyan(relative(cwd, source.schemaFile) || source.schemaFile));
+    return;
+  }
+  console.log(chalk2.blue(`\u{1F4C2} Detected project structure at ${source.projectRoot}`));
+  if (source.appConfigPath && source.appConfig) {
+    console.log(chalk2.blue(`\u2699\uFE0F  Loaded App Config from ${relative(cwd, source.appConfigPath) || source.appConfigPath}`));
+  }
+  console.log(chalk2.blue(`\u{1F4C1} Using file-system routing from ${source.pagesDir}`));
+  console.log(chalk2.green(`\u2713 Found ${source.routes.length} route(s)`));
+  for (const route of source.routes) {
+    console.log(chalk2.dim(`  ${route.path} \u2192 ${relative(cwd, route.filePath)}`));
+  }
+}
+
+// src/utils/workspace-vite.ts
+import { existsSync as existsSync4, readFileSync as readFileSync3, statSync as statSync3, unlinkSync } from "fs";
+import { createRequire } from "module";
+import { dirname as dirname4, join as join4 } from "path";
+import { globSync } from "glob";
+import { load as loadYaml } from "js-yaml";
+var PLATFORM_SCOPE = "@object-ui/";
+var BARREL_EXTENSIONS = [".mjs", ".js", ".mts", ".ts", ".jsx", ".tsx"];
+function isWorkspaceRoot(cwd) {
+  return existsSync4(join4(cwd, "pnpm-workspace.yaml"));
+}
+function workspacePatterns(cwd) {
+  const manifestPath = join4(cwd, "pnpm-workspace.yaml");
+  if (!existsSync4(manifestPath)) return [];
+  const parsed = loadYaml(readFileSync3(manifestPath, "utf-8"));
+  const patterns = parsed?.packages;
+  if (!Array.isArray(patterns)) return [];
+  return patterns.filter((p) => typeof p === "string");
+}
+function workspacePackageDirs(cwd) {
+  const patterns = workspacePatterns(cwd);
+  const include = patterns.filter((p) => !p.startsWith("!"));
+  const exclude = patterns.filter((p) => p.startsWith("!")).map((p) => p.slice(1));
+  if (include.length === 0) return [];
+  const matches = globSync(include, {
+    cwd,
+    absolute: true,
+    ignore: ["**/node_modules/**", ...exclude]
+  });
+  return matches.filter((dir) => existsSync4(join4(dir, "package.json")) && statSync3(dir).isDirectory()).sort();
+}
+function findSourceBarrel(srcDir) {
+  for (const ext of BARREL_EXTENSIONS) {
+    const candidate = join4(srcDir, `index${ext}`);
+    if (existsSync4(candidate)) return candidate;
+  }
+  return void 0;
+}
+function workspaceSourceAliases(cwd) {
+  const aliases = {};
+  for (const dir of workspacePackageDirs(cwd)) {
+    let name;
+    try {
+      name = JSON.parse(readFileSync3(join4(dir, "package.json"), "utf-8")).name;
+    } catch {
+      continue;
+    }
+    if (typeof name !== "string" || !name.startsWith(PLATFORM_SCOPE)) continue;
+    const srcDir = join4(dir, "src");
+    if (!existsSync4(srcDir) || !findSourceBarrel(srcDir)) continue;
+    aliases[name] = srcDir;
+  }
+  return aliases;
+}
+function resolveLucideAlias(cwd) {
+  const require2 = createRequire(join4(cwd, "package.json"));
+  try {
+    return dirname4(require2.resolve("lucide-react/package.json", { paths: [join4(cwd, "packages/components")] }));
+  } catch {
+    return void 0;
+  }
+}
+async function loadTempAppPostcssPlugins() {
+  try {
+    const [tailwindPostcss, autoprefixer] = await Promise.all([
+      import("@tailwindcss/postcss"),
+      import("autoprefixer")
+    ]);
+    return [tailwindPostcss.default(), autoprefixer.default()];
+  } catch (error) {
+    throw new Error(
+      `Failed to load the Tailwind CSS PostCSS pipeline: ${error instanceof Error ? error.message : error}
+  Both '@tailwindcss/postcss' and 'autoprefixer' are dependencies of @object-ui/cli \u2014 a
+  broken install of the CLI is the likeliest cause; reinstall it and try again.
+  (Refusing to start unstyled: that failure is silent in the browser.)`
+    );
+  }
+}
+async function prepareWorkspaceTempApp(cwd, tmpDir) {
+  const postcssPath = join4(tmpDir, "postcss.config.js");
+  if (existsSync4(postcssPath)) {
+    unlinkSync(postcssPath);
+  }
+  const alias = { ...workspaceSourceAliases(cwd) };
+  const lucide = resolveLucideAlias(cwd);
+  if (lucide) {
+    alias["lucide-react"] = lucide;
+  }
+  return {
+    resolve: { alias },
+    css: { postcss: { plugins: await loadTempAppPostcssPlugins() } }
   };
-  writeFileSync(join(tmpDir, "tsconfig.json"), JSON.stringify(tsconfig, null, 2));
 }
 
 // src/commands/serve.ts
+function resolveServeOpenOption(open) {
+  return open !== false;
+}
+var BROWSER_OPEN_SPAWN_ENOENT = /^Error: spawn (\S+) ENOENT/;
+function createServeLogger(base) {
+  return {
+    info: (msg, opts) => base.info(msg, opts),
+    warn: (msg, opts) => base.warn(msg, opts),
+    warnOnce: (msg, opts) => base.warnOnce(msg, opts),
+    error(msg, opts) {
+      const match = BROWSER_OPEN_SPAWN_ENOENT.exec(msg);
+      if (match) {
+        const [, command] = match;
+        console.log(
+          chalk3.dim(
+            `  (could not open the browser automatically \u2014 '${command}' is not available in this environment; open the URL above manually)`
+          )
+        );
+        return;
+      }
+      base.error(msg, opts);
+    },
+    clearScreen: (type) => base.clearScreen(type),
+    hasErrorLogged: (error) => base.hasErrorLogged(error),
+    get hasWarned() {
+      return base.hasWarned;
+    }
+  };
+}
 async function serve(schemaPath, options) {
   const cwd = process.cwd();
-  const pagesDir = join2(cwd, "pages");
-  const hasPagesDir = existsSync2(pagesDir);
-  let routes = [];
-  let schema = null;
-  let useFileSystemRouting = false;
-  if (hasPagesDir) {
-    console.log(chalk2.blue("\u{1F4C1} Detected pages/ directory - using file-system routing"));
-    routes = scanPagesDirectory(pagesDir);
-    useFileSystemRouting = true;
-    if (routes.length === 0) {
-      throw new Error("No schema files found in pages/ directory");
-    }
-    console.log(chalk2.green(`\u2713 Found ${routes.length} route(s)`));
-    routes.forEach((route) => {
-      console.log(chalk2.dim(`  ${route.path} \u2192 ${relative(cwd, route.filePath)}`));
-    });
+  const source = resolveProjectSource(cwd, schemaPath);
+  reportProjectSource(source, cwd);
+  const tmpDir = join5(cwd, ".objectui-tmp");
+  mkdirSync2(tmpDir, { recursive: true });
+  if (source.mode === "routes") {
+    createTempAppWithRouting(tmpDir, source.routes, source.appConfig);
   } else {
-    const fullSchemaPath = resolve(cwd, schemaPath);
-    if (!existsSync2(fullSchemaPath)) {
-      throw new Error(`Schema file not found: ${schemaPath}
-Run 'objectui init' to create a sample schema.`);
-    }
-    console.log(chalk2.blue("\u{1F4CB} Loading schema:"), chalk2.cyan(schemaPath));
-    try {
-      schema = parseSchemaFile(fullSchemaPath);
-    } catch (error) {
-      throw new Error(`Invalid schema file: ${error instanceof Error ? error.message : error}`);
-    }
+    createTempApp(tmpDir, source.schema);
   }
-  const tmpDir = join2(cwd, ".objectui-tmp");
-  mkdirSync2(tmpDir, { recursive: true });
-  if (useFileSystemRouting) {
-    createTempAppWithRouting(tmpDir, routes);
+  const isMonorepo = isWorkspaceRoot(cwd);
+  if (isMonorepo) {
+    console.log(chalk3.blue("\u{1F4E6} Detected monorepo - using root node_modules"));
   } else {
-    createTempApp(tmpDir, schema);
+    console.log(chalk3.blue("\u{1F4E6} Installing dependencies..."));
+    console.log(chalk3.dim("  This may take a moment on first run..."));
+    try {
+      execSync("npm install --silent --prefer-offline", {
+        cwd: tmpDir,
+        stdio: "inherit"
+      });
+      console.log(chalk3.green("\u2713 Dependencies installed"));
+    } catch {
+      throw new Error("Failed to install dependencies. Please check your internet connection and try again.");
+    }
   }
-  console.log(chalk2.blue("\u{1F4E6} Installing dependencies..."));
-  console.log(chalk2.dim("  This may take a moment on first run..."));
-  try {
-    execSync("npm install --silent --prefer-offline", {
-      cwd: tmpDir,
-      stdio: "inherit"
-    });
-    console.log(chalk2.green("\u2713 Dependencies installed"));
-  } catch {
-    throw new Error("Failed to install dependencies. Please check your internet connection and try again.");
+  console.log(chalk3.green("\u2713 Schema loaded successfully"));
+  console.log(chalk3.blue("\u{1F680} Starting development server...\n"));
+  if (isMonorepo) {
+    console.log(chalk3.blue("\u{1F4E6} Detected monorepo - configuring workspace aliases"));
   }
-  console.log(chalk2.green("\u2713 Schema loaded successfully"));
-  console.log(chalk2.blue("\u{1F680} Starting development server...\n"));
+  const workspaceConfig = isMonorepo ? await prepareWorkspaceTempApp(cwd, tmpDir) : {};
   const viteConfig = {
     root: tmpDir,
     server: {
       port: parseInt(options.port),
       host: options.host,
-      open: true
+      open: resolveServeOpenOption(options.open),
+      fs: {
+        // Allow serving the workspace sources the aliases point at
+        allow: [cwd]
+      }
     },
-    plugins: [react()]
+    plugins: [react()],
+    customLogger: createServeLogger(createLogger()),
+    ...workspaceConfig
   };
   const server = await createServer(viteConfig);
   await server.listen();
@@ -958,18 +1083,18 @@ Run 'objectui init' to create a sample schema.`);
   const protocol = server.config.server.https ? "https" : "http";
   const displayHost = host === "0.0.0.0" ? "localhost" : host;
   console.log();
-  console.log(chalk2.green("\u2713 Server started successfully!"));
+  console.log(chalk3.green("\u2713 Server started successfully!"));
   console.log();
-  console.log(chalk2.bold("  Local:   ") + chalk2.cyan(`${protocol}://${displayHost}:${port}`));
+  console.log(chalk3.bold("  Local:   ") + chalk3.cyan(`${protocol}://${displayHost}:${port}`));
   console.log();
-  console.log(chalk2.dim("  Press Ctrl+C to stop the server"));
+  console.log(chalk3.dim("  Press Ctrl+C to stop the server"));
   console.log();
 }
 
 // src/commands/init.ts
-import { existsSync as existsSync3, writeFileSync as writeFileSync2, mkdirSync as mkdirSync3 } from "fs";
-import { join as join3 } from "path";
-import chalk3 from "chalk";
+import { existsSync as existsSync5, writeFileSync as writeFileSync2, mkdirSync as mkdirSync3 } from "fs";
+import { dirname as dirname5, join as join6 } from "path";
+import chalk4 from "chalk";
 var templates = {
   simple: {
     type: "div",
@@ -1312,29 +1437,35 @@ var templates = {
     ]
   }
 };
-async function init(name, options) {
-  const cwd = process.cwd();
-  const projectDir = join3(cwd, name);
-  if (existsSync3(projectDir) && name !== ".") {
-    throw new Error(`Directory "${name}" already exists. Please choose a different name.`);
-  }
-  const targetDir = name === "." ? cwd : projectDir;
-  if (name !== ".") {
-    mkdirSync3(projectDir, { recursive: true });
-  }
-  console.log(chalk3.blue("\u{1F3A8} Creating Object UI application..."));
-  console.log(chalk3.dim(`   Template: ${options.template}`));
-  console.log();
-  const template = templates[options.template];
+function buildInitPackageJson(name) {
+  const platformRange = platformPackageRange();
+  return {
+    name,
+    version: "0.1.0",
+    private: true,
+    type: "module",
+    scripts: {
+      dev: "vite",
+      build: "tsc && vite build",
+      preview: "vite preview"
+    },
+    dependencies: {
+      "@object-ui/components": platformRange,
+      "@object-ui/react": platformRange,
+      react: REACT_RANGE,
+      "react-dom": REACT_RANGE
+    },
+    devDependencies: { ...SCAFFOLD_DEV_DEPENDENCIES }
+  };
+}
+function buildInitFiles(name, templateName) {
+  const template = templates[templateName];
   if (!template) {
     throw new Error(
-      `Unknown template: ${options.template}
+      `Unknown template: ${templateName}
 Available templates: ${Object.keys(templates).join(", ")}`
     );
   }
-  const schemaPath = join3(targetDir, "app.json");
-  writeFileSync2(schemaPath, JSON.stringify(template, null, 2));
-  console.log(chalk3.green("\u2713 Created app.json"));
   const readme = `# ${name}
 
 An Object UI application built from JSON schemas.
@@ -1377,46 +1508,12 @@ Edit \`app.json\` to customize your application. The dev server will automatical
 
 Built with \u2764\uFE0F using [Object UI](https://www.objectui.org)
 `;
-  writeFileSync2(join3(targetDir, "README.md"), readme);
-  console.log(chalk3.green("\u2713 Created README.md"));
   const gitignore = `.objectui-tmp
 node_modules
 dist
 .DS_Store
 *.log
 `;
-  writeFileSync2(join3(targetDir, ".gitignore"), gitignore);
-  console.log(chalk3.green("\u2713 Created .gitignore"));
-  const packageJson = {
-    name,
-    version: "0.1.0",
-    private: true,
-    type: "module",
-    scripts: {
-      dev: "vite",
-      build: "tsc && vite build",
-      preview: "vite preview"
-    },
-    dependencies: {
-      "@object-ui/components": "^2.0.0",
-      "@object-ui/react": "^2.0.0",
-      react: "^19.2.0",
-      "react-dom": "^19.2.0"
-    },
-    devDependencies: {
-      "@tailwindcss/postcss": "^4.1.18",
-      "@types/react": "^19.2.13",
-      "@types/react-dom": "^19.2.6",
-      "@vitejs/plugin-react": "^5.1.3",
-      autoprefixer: "^10.4.23",
-      postcss: "^8.5.6",
-      tailwindcss: "^4.1.18",
-      typescript: "^5.9.3",
-      vite: "^7.3.1"
-    }
-  };
-  writeFileSync2(join3(targetDir, "package.json"), JSON.stringify(packageJson, null, 2));
-  console.log(chalk3.green("\u2713 Created package.json"));
   const viteConfig = `import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
 
@@ -1427,15 +1524,6 @@ export default defineConfig({
   },
 });
 `;
-  writeFileSync2(join3(targetDir, "vite.config.ts"), viteConfig);
-  console.log(chalk3.green("\u2713 Created vite.config.ts"));
-  const tailwindConfig = `/** @type {import('tailwindcss').Config} */
-export default {
-  content: ['./index.html', './src/**/*.{ts,tsx}'],
-};
-`;
-  writeFileSync2(join3(targetDir, "tailwind.config.js"), tailwindConfig);
-  console.log(chalk3.green("\u2713 Created tailwind.config.js"));
   const postcssConfig = `export default {
   plugins: {
     '@tailwindcss/postcss': {},
@@ -1443,8 +1531,6 @@ export default {
   },
 };
 `;
-  writeFileSync2(join3(targetDir, "postcss.config.js"), postcssConfig);
-  console.log(chalk3.green("\u2713 Created postcss.config.js"));
   const indexHtml = `<!doctype html>
 <html lang="en">
   <head>
@@ -1458,14 +1544,9 @@ export default {
   </body>
 </html>
 `;
-  writeFileSync2(join3(targetDir, "index.html"), indexHtml);
-  console.log(chalk3.green("\u2713 Created index.html"));
-  const srcDir = join3(targetDir, "src");
-  mkdirSync3(srcDir, { recursive: true });
   const indexCss = `@import 'tailwindcss';
+@import '@object-ui/components/style.css';
 `;
-  writeFileSync2(join3(srcDir, "index.css"), indexCss);
-  console.log(chalk3.green("\u2713 Created src/index.css"));
   const mainTsx = `import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
 import App from './App';
@@ -1477,17 +1558,18 @@ createRoot(document.getElementById('root')!).render(
   </StrictMode>,
 );
 `;
-  writeFileSync2(join3(srcDir, "main.tsx"), mainTsx);
-  console.log(chalk3.green("\u2713 Created src/main.tsx"));
   const appTsx = `import { SchemaRenderer } from '@object-ui/react';
+// Registers the component renderers SchemaRenderer looks up. Side-effect
+// import \u2014 removing it makes every node render "Unknown component type".
+import '@object-ui/components';
 import schema from '../app.json';
 
 export default function App() {
   return <SchemaRenderer schema={schema} />;
 }
 `;
-  writeFileSync2(join3(srcDir, "App.tsx"), appTsx);
-  console.log(chalk3.green("\u2713 Created src/App.tsx"));
+  const viteEnvDts = `/// <reference types="vite/client" />
+`;
   const tsconfig = {
     compilerOptions: {
       target: "ES2020",
@@ -1509,29 +1591,65 @@ export default function App() {
     },
     include: ["src"]
   };
-  writeFileSync2(join3(targetDir, "tsconfig.json"), JSON.stringify(tsconfig, null, 2));
-  console.log(chalk3.green("\u2713 Created tsconfig.json"));
+  return {
+    "app.json": JSON.stringify(template, null, 2),
+    "README.md": readme,
+    ".gitignore": gitignore,
+    "package.json": JSON.stringify(buildInitPackageJson(name), null, 2),
+    "vite.config.ts": viteConfig,
+    "postcss.config.js": postcssConfig,
+    "index.html": indexHtml,
+    "src/index.css": indexCss,
+    "src/main.tsx": mainTsx,
+    "src/App.tsx": appTsx,
+    "src/vite-env.d.ts": viteEnvDts,
+    "tsconfig.json": JSON.stringify(tsconfig, null, 2)
+  };
+}
+async function init(name, options) {
+  const cwd = process.cwd();
+  const projectDir = join6(cwd, name);
+  if (existsSync5(projectDir) && name !== ".") {
+    throw new Error(`Directory "${name}" already exists. Please choose a different name.`);
+  }
+  const targetDir = name === "." ? cwd : projectDir;
+  if (name !== ".") {
+    mkdirSync3(projectDir, { recursive: true });
+  }
+  console.log(chalk4.blue("\u{1F3A8} Creating Object UI application..."));
+  console.log(chalk4.dim(`   Template: ${options.template}`));
+  console.log();
+  for (const [relativePath, contents] of Object.entries(
+    buildInitFiles(name, options.template)
+  )) {
+    const target = join6(targetDir, relativePath);
+    mkdirSync3(dirname5(target), { recursive: true });
+    writeFileSync2(target, contents);
+    console.log(chalk4.green(`\u2713 Created ${relativePath}`));
+  }
   console.log();
-  console.log(chalk3.green("\u2728 Application created successfully!"));
+  console.log(chalk4.green("\u2728 Application created successfully!"));
   console.log();
-  console.log(chalk3.bold("Next steps:"));
+  console.log(chalk4.bold("Next steps:"));
   console.log();
   if (name !== ".") {
-    console.log(chalk3.cyan(`  cd ${name}`));
+    console.log(chalk4.cyan(`  cd ${name}`));
   }
-  console.log(chalk3.cyan("  npm install"));
-  console.log(chalk3.cyan("  npm run dev"));
+  console.log(chalk4.cyan("  npm install"));
+  console.log(chalk4.cyan("  npm run dev"));
   console.log();
-  console.log(chalk3.dim("  The development server will start on http://localhost:3000"));
+  console.log(chalk4.dim("  The development server will start on http://localhost:3000"));
   console.log();
 }
 
 export {
-  parseSchemaFile,
-  scanPagesDirectory,
   createTempApp,
   createTempAppWithRouting,
+  resolveProjectSource,
+  reportProjectSource,
+  isWorkspaceRoot,
+  prepareWorkspaceTempApp,
   serve,
   init
 };
-//# sourceMappingURL=chunk-EV2DCI7W.js.map
+//# sourceMappingURL=chunk-AP2INOE7.js.map