npm - @object-ui/cli - Versions diffs - 0.3.0 - Mend

@object-ui/cli 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (11) hide show

package/LICENSE +21 -0
package/README.md +195 -0
package/dist/chunk-WOV6EOMH.js +1272 -0
package/dist/chunk-WOV6EOMH.js.map +1 -0
package/dist/cli.d.ts +1 -0
package/dist/cli.js +708 -0
package/dist/cli.js.map +1 -0
package/dist/index.d.ts +12 -0
package/dist/index.js +9 -0
package/dist/index.js.map +1 -0
package/package.json +53 -0

package/dist/chunk-WOV6EOMH.js ADDED Viewed

@@ -0,0 +1,1272 @@
+// src/commands/serve.ts
+import { createServer } 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 { execSync } from "child_process";
+// src/utils/app-generator.ts
+import { readFileSync, writeFileSync, mkdirSync, readdirSync, statSync, existsSync } from "fs";
+import { join } from "path";
+import chalk from "chalk";
+import * as yaml from "js-yaml";
+function isSupportedSchemaFile(filename) {
+  return filename.endsWith(".json") || filename.endsWith(".yml") || filename.endsWith(".yaml");
+}
+function getBaseFileName(filename) {
+  return filename.replace(/\.(json|yml|yaml)$/, "");
+}
+function parseSchemaFile(filePath) {
+  const content = readFileSync(filePath, "utf-8");
+  if (filePath.endsWith(".json")) {
+    return JSON.parse(content);
+  } else if (filePath.endsWith(".yml") || filePath.endsWith(".yaml")) {
+    return yaml.load(content);
+  }
+  throw new Error(`Unsupported file format: ${filePath}`);
+}
+function scanPagesDirectory(pagesDir) {
+  const routes = [];
+  const scanDir = (dir, routePrefix = "") => {
+    const entries = readdirSync(dir);
+    for (const entry of entries) {
+      const fullPath = join(dir, entry);
+      const stat = statSync(fullPath);
+      if (stat.isDirectory()) {
+        const newPrefix = routePrefix + "/" + entry;
+        scanDir(fullPath, newPrefix);
+      } else if (isSupportedSchemaFile(entry)) {
+        const fileName = getBaseFileName(entry);
+        let routePath;
+        let isDynamic = false;
+        let paramName;
+        if (fileName === "index") {
+          routePath = routePrefix || "/";
+        } else if (fileName.startsWith("[") && fileName.endsWith("]")) {
+          paramName = fileName.slice(1, -1);
+          routePath = routePrefix + "/:" + paramName;
+          isDynamic = true;
+        } else {
+          routePath = routePrefix + "/" + fileName;
+        }
+        try {
+          const schema = parseSchemaFile(fullPath);
+          routes.push({
+            path: routePath,
+            filePath: fullPath,
+            schema,
+            isDynamic,
+            paramName
+          });
+        } catch (error) {
+          console.warn(chalk.yellow(`\u26A0 Warning: Failed to parse ${fullPath}: ${error instanceof Error ? error.message : error}`));
+        }
+      }
+    }
+  };
+  scanDir(pagesDir);
+  routes.sort((a, b) => {
+    if (a.isDynamic && !b.isDynamic) return 1;
+    if (!a.isDynamic && b.isDynamic) return -1;
+    return a.path.localeCompare(b.path);
+  });
+  return routes;
+}
+function createTempApp(tmpDir, schema) {
+  const html = `<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Object UI App</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <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';
+import './index.css';
+ReactDOM.createRoot(document.getElementById('root')!).render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>
+);`;
+  writeFileSync(join(srcDir, "main.tsx"), mainTsx);
+  const appTsx = `import { SchemaRenderer } from '@object-ui/react';
+import '@object-ui/components';
+const schema = ${JSON.stringify(schema, null, 2)};
+function App() {
+  return <SchemaRenderer schema={schema} />;
+}
+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"]
+  };
+  writeFileSync(join(tmpDir, "tsconfig.json"), JSON.stringify(tsconfig, null, 2));
+}
+function createTempAppWithRouting(tmpDir, routes, appConfig) {
+  const html = `<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>${appConfig?.title || "Object UI App"}</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <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 });
+  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)
+    );
+    schemaImports.push(`import ${schemaVarName} from './schemas/${schemaFileName}';`);
+    routeComponents.push(`        <Route path="${route.path}" element={<SchemaRenderer schema={${schemaVarName}} />} />`);
+  });
+  const mainTsx = `import React from 'react';
+import ReactDOM from 'react-dom/client';
+import App from './App';
+import './index.css';
+ReactDOM.createRoot(document.getElementById('root')!).render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>
+);`;
+  writeFileSync(join(srcDir, "main.tsx"), mainTsx);
+  let layoutImport = "";
+  let layoutWrapperStart = "";
+  let layoutWrapperEnd = "";
+  if (appConfig) {
+    const layoutCode = `
+import { Link, useLocation } from 'react-router-dom';
+import * as LucideIcons from 'lucide-react';
+import {
+  cn,
+  SidebarProvider,
+  Sidebar,
+  SidebarContent,
+  SidebarFooter,
+  SidebarHeader,
+  SidebarRail,
+  SidebarGroup,
+  SidebarGroupContent,
+  SidebarGroupLabel,
+  SidebarMenu,
+  SidebarMenuItem,
+  SidebarMenuButton,
+  SidebarMenuSub,
+  SidebarMenuSubItem,
+  SidebarMenuSubButton,
+  SidebarInset,
+  SidebarTrigger,
+  Separator,
+  Collapsible,
+  CollapsibleTrigger,
+  CollapsibleContent
+} from '@object-ui/components';
+const DynamicIcon = ({ name, className }) => {
+  // @ts-ignore
+  const Icon = LucideIcons[name];
+  if (!Icon) return null;
+  return <Icon className={className} />;
+};
+const AppLayout = ({ app, children }) => {
+  const location = useLocation();
+  const menu = app.menu || [];
+  return (
+    <SidebarProvider>
+      <Sidebar collapsible="icon">
+        <SidebarHeader>
+           <div className="flex items-center gap-2 px-2 py-2">
+             <div className="flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground">
+               {app.logo && <DynamicIcon name={app.logo} className="size-4" />}
+               {!app.logo && <span className="text-xl font-bold">O</span>}
+             </div>
+             <div className="grid flex-1 text-left text-sm leading-tight">
+               <span className="truncate font-semibold">{app.title || "Object UI"}</span>
+               <span className="truncate text-xs">Showcase</span>
+             </div>
+           </div>
+        </SidebarHeader>
+        <SidebarContent>
+          <SidebarGroup>
+            <SidebarMenu>
+              {menu.map((item, idx) => {
+                 // Collapsible Item (Children present)
+                 if (item.children && item.children.length > 0) {
+                   const isActive = item.children.some(child => child.path === location.pathname);
+                   return (
+                     <Collapsible key={idx} asChild defaultOpen={isActive} className="group/collapsible">
+                       <SidebarMenuItem>
+                         <CollapsibleTrigger asChild>
+                           <SidebarMenuButton tooltip={item.label}>
+                             {item.icon && <DynamicIcon name={item.icon} />}
+                             <span>{item.label}</span>
+                             <DynamicIcon name="ChevronRight" className="ml-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90" />
+                           </SidebarMenuButton>
+                         </CollapsibleTrigger>
+                         <CollapsibleContent>
+                           <SidebarMenuSub>
+                             {item.children.map((child, cIdx) => (
+                               <SidebarMenuSubItem key={cIdx}>
+                                 <SidebarMenuSubButton asChild isActive={location.pathname === child.path}>
+                                   <Link to={child.path || '#'}>
+                                      <span>{child.label}</span>
+                                   </Link>
+                                 </SidebarMenuSubButton>
+                               </SidebarMenuSubItem>
+                             ))}
+                           </SidebarMenuSub>
+                         </CollapsibleContent>
+                       </SidebarMenuItem>
+                     </Collapsible>
+                   );
+                 }
+                 // Single Item
+                 if (item.path) {
+                   return (
+                     <SidebarMenuItem key={idx}>
+                       <SidebarMenuButton asChild isActive={location.pathname === item.path} tooltip={item.label}>
+                         <Link to={item.path}>
+                           {item.icon && <DynamicIcon name={item.icon} />}
+                           <span>{item.label}</span>
+                         </Link>
+                       </SidebarMenuButton>
+                     </SidebarMenuItem>
+                   );
+                 }
+                 return null;
+              })}
+            </SidebarMenu>
+          </SidebarGroup>
+        </SidebarContent>
+        <SidebarFooter>
+        </SidebarFooter>
+        <SidebarRail />
+      </Sidebar>
+      <SidebarInset>
+        <header className="flex h-16 shrink-0 items-center gap-2 border-b bg-background px-4">
+            <SidebarTrigger className="-ml-1" />
+            <Separator orientation="vertical" className="mr-2 h-4" />
+            <div className="flex flex-1 items-center justify-between">
+              <span className="font-medium">{app.title}</span>
+            </div>
+        </header>
+        <div className="flex-1 flex flex-col min-h-0 bg-muted/20 p-4">
+          <div className="mx-auto max-w-full w-full">
+            {children}
+          </div>
+        </div>
+      </SidebarInset>
+    </SidebarProvider>
+  );
+};
+export default AppLayout;
+`;
+    writeFileSync(join(srcDir, "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';
+import { SchemaRenderer } from '@object-ui/react';
+import '@object-ui/components';
+${schemaImports.join("\n")}
+${layoutImport}
+function App() {
+  return (
+    <BrowserRouter>
+      ${layoutWrapperStart}
+      <Routes>
+${routeComponents.join("\n")}
+      </Routes>
+      ${layoutWrapperEnd}
+    </BrowserRouter>
+  );
+}
+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 font-sans antialiased min-h-screen;
+  }
+}`;
+  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}'`);
+  }
+  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"
+    }
+  };
+  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"]
+  };
+  writeFileSync(join(tmpDir, "tsconfig.json"), JSON.stringify(tsconfig, null, 2));
+}
+// src/commands/serve.ts
+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)}`));
+    });
+  } 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}`);
+    }
+  }
+  const tmpDir = join2(cwd, ".objectui-tmp");
+  mkdirSync2(tmpDir, { recursive: true });
+  if (useFileSystemRouting) {
+    createTempAppWithRouting(tmpDir, routes);
+  } else {
+    createTempApp(tmpDir, schema);
+  }
+  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(chalk2.green("\u2713 Schema loaded successfully"));
+  console.log(chalk2.blue("\u{1F680} Starting development server...\n"));
+  const viteConfig = {
+    root: tmpDir,
+    server: {
+      port: parseInt(options.port),
+      host: options.host,
+      open: true
+    },
+    plugins: [react()]
+  };
+  const server = await createServer(viteConfig);
+  await server.listen();
+  const { port, host } = server.config.server;
+  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();
+  console.log(chalk2.bold("  Local:   ") + chalk2.cyan(`${protocol}://${displayHost}:${port}`));
+  console.log();
+  console.log(chalk2.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";
+var templates = {
+  simple: {
+    type: "div",
+    className: "min-h-screen flex items-center justify-center bg-gradient-to-br from-blue-50 to-indigo-100",
+    body: {
+      type: "card",
+      className: "w-full max-w-md shadow-lg",
+      title: "Welcome to Object UI",
+      description: "Start building your application with JSON schemas",
+      body: {
+        type: "div",
+        className: "p-6 space-y-4",
+        body: [
+          {
+            type: "text",
+            content: "This is a simple example. Edit app.json to customize your application.",
+            className: "text-sm text-muted-foreground"
+          },
+          {
+            type: "button",
+            label: "Get Started",
+            className: "w-full"
+          }
+        ]
+      }
+    }
+  },
+  form: {
+    type: "div",
+    className: "min-h-screen flex items-center justify-center bg-gradient-to-br from-purple-50 to-pink-100 p-4",
+    body: {
+      type: "card",
+      className: "w-full max-w-2xl shadow-xl",
+      title: "Contact Form",
+      description: "Fill out the form below to get in touch",
+      body: {
+        type: "div",
+        className: "p-6 space-y-6",
+        body: [
+          {
+            type: "div",
+            className: "grid grid-cols-2 gap-4",
+            body: [
+              {
+                type: "input",
+                label: "First Name",
+                placeholder: "John",
+                required: true
+              },
+              {
+                type: "input",
+                label: "Last Name",
+                placeholder: "Doe",
+                required: true
+              }
+            ]
+          },
+          {
+            type: "input",
+            label: "Email Address",
+            inputType: "email",
+            placeholder: "john.doe@example.com",
+            required: true
+          },
+          {
+            type: "input",
+            label: "Phone Number",
+            inputType: "tel",
+            placeholder: "+1 (555) 000-0000"
+          },
+          {
+            type: "textarea",
+            label: "Message",
+            placeholder: "Tell us what you need...",
+            rows: 4
+          },
+          {
+            type: "div",
+            className: "flex gap-3",
+            body: [
+              {
+                type: "button",
+                label: "Submit",
+                className: "flex-1"
+              },
+              {
+                type: "button",
+                label: "Reset",
+                variant: "outline",
+                className: "flex-1"
+              }
+            ]
+          }
+        ]
+      }
+    }
+  },
+  dashboard: {
+    type: "div",
+    className: "min-h-screen bg-muted/10",
+    body: [
+      {
+        type: "div",
+        className: "border-b bg-background",
+        body: {
+          type: "div",
+          className: "container mx-auto px-6 py-4",
+          body: {
+            type: "div",
+            className: "flex items-center justify-between",
+            body: [
+              {
+                type: "div",
+                className: "text-2xl font-bold",
+                body: { type: "text", content: "Dashboard" }
+              },
+              {
+                type: "button",
+                label: "New Item",
+                size: "sm"
+              }
+            ]
+          }
+        }
+      },
+      {
+        type: "div",
+        className: "container mx-auto p-6 space-y-6",
+        body: [
+          {
+            type: "div",
+            className: "grid gap-4 md:grid-cols-2 lg:grid-cols-4",
+            body: [
+              {
+                type: "card",
+                className: "shadow-sm",
+                body: [
+                  {
+                    type: "div",
+                    className: "p-6 pb-2",
+                    body: {
+                      type: "div",
+                      className: "text-sm font-medium text-muted-foreground",
+                      body: { type: "text", content: "Total Revenue" }
+                    }
+                  },
+                  {
+                    type: "div",
+                    className: "p-6 pt-0",
+                    body: [
+                      {
+                        type: "div",
+                        className: "text-2xl font-bold",
+                        body: { type: "text", content: "$45,231.89" }
+                      },
+                      {
+                        type: "div",
+                        className: "text-xs text-muted-foreground mt-1",
+                        body: { type: "text", content: "+20.1% from last month" }
+                      }
+                    ]
+                  }
+                ]
+              },
+              {
+                type: "card",
+                className: "shadow-sm",
+                body: [
+                  {
+                    type: "div",
+                    className: "p-6 pb-2",
+                    body: {
+                      type: "div",
+                      className: "text-sm font-medium text-muted-foreground",
+                      body: { type: "text", content: "Active Users" }
+                    }
+                  },
+                  {
+                    type: "div",
+                    className: "p-6 pt-0",
+                    body: [
+                      {
+                        type: "div",
+                        className: "text-2xl font-bold",
+                        body: { type: "text", content: "+2,350" }
+                      },
+                      {
+                        type: "div",
+                        className: "text-xs text-muted-foreground mt-1",
+                        body: { type: "text", content: "+180.1% from last month" }
+                      }
+                    ]
+                  }
+                ]
+              },
+              {
+                type: "card",
+                className: "shadow-sm",
+                body: [
+                  {
+                    type: "div",
+                    className: "p-6 pb-2",
+                    body: {
+                      type: "div",
+                      className: "text-sm font-medium text-muted-foreground",
+                      body: { type: "text", content: "Sales" }
+                    }
+                  },
+                  {
+                    type: "div",
+                    className: "p-6 pt-0",
+                    body: [
+                      {
+                        type: "div",
+                        className: "text-2xl font-bold",
+                        body: { type: "text", content: "+12,234" }
+                      },
+                      {
+                        type: "div",
+                        className: "text-xs text-muted-foreground mt-1",
+                        body: { type: "text", content: "+19% from last month" }
+                      }
+                    ]
+                  }
+                ]
+              },
+              {
+                type: "card",
+                className: "shadow-sm",
+                body: [
+                  {
+                    type: "div",
+                    className: "p-6 pb-2",
+                    body: {
+                      type: "div",
+                      className: "text-sm font-medium text-muted-foreground",
+                      body: { type: "text", content: "Active Now" }
+                    }
+                  },
+                  {
+                    type: "div",
+                    className: "p-6 pt-0",
+                    body: [
+                      {
+                        type: "div",
+                        className: "text-2xl font-bold",
+                        body: { type: "text", content: "+573" }
+                      },
+                      {
+                        type: "div",
+                        className: "text-xs text-muted-foreground mt-1",
+                        body: { type: "text", content: "+201 since last hour" }
+                      }
+                    ]
+                  }
+                ]
+              }
+            ]
+          },
+          {
+            type: "card",
+            className: "shadow-sm",
+            title: "Recent Activity",
+            description: "Your latest updates and notifications",
+            body: {
+              type: "div",
+              className: "p-6 pt-0 space-y-4",
+              body: [
+                {
+                  type: "div",
+                  className: "flex items-center gap-4 border-b pb-4",
+                  body: [
+                    {
+                      type: "div",
+                      className: "flex-1",
+                      body: [
+                        {
+                          type: "div",
+                          className: "font-medium",
+                          body: { type: "text", content: "New user registration" }
+                        },
+                        {
+                          type: "div",
+                          className: "text-sm text-muted-foreground",
+                          body: { type: "text", content: "2 minutes ago" }
+                        }
+                      ]
+                    }
+                  ]
+                },
+                {
+                  type: "div",
+                  className: "flex items-center gap-4 border-b pb-4",
+                  body: [
+                    {
+                      type: "div",
+                      className: "flex-1",
+                      body: [
+                        {
+                          type: "div",
+                          className: "font-medium",
+                          body: { type: "text", content: "Payment received" }
+                        },
+                        {
+                          type: "div",
+                          className: "text-sm text-muted-foreground",
+                          body: { type: "text", content: "15 minutes ago" }
+                        }
+                      ]
+                    }
+                  ]
+                },
+                {
+                  type: "div",
+                  className: "flex items-center gap-4",
+                  body: [
+                    {
+                      type: "div",
+                      className: "flex-1",
+                      body: [
+                        {
+                          type: "div",
+                          className: "font-medium",
+                          body: { type: "text", content: "New order placed" }
+                        },
+                        {
+                          type: "div",
+                          className: "text-sm text-muted-foreground",
+                          body: { type: "text", content: "1 hour ago" }
+                        }
+                      ]
+                    }
+                  ]
+                }
+              ]
+            }
+          }
+        ]
+      }
+    ]
+  }
+};
+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];
+  if (!template) {
+    throw new Error(
+      `Unknown template: ${options.template}
+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}
+A Object UI application built from JSON schemas.
+## Getting Started
+1. Install Object UI CLI globally (if you haven't already):
+   \`\`\`bash
+   npm install -g @object-ui/cli
+   \`\`\`
+2. Start the development server:
+   \`\`\`bash
+   objectui serve app.json
+   \`\`\`
+3. Open your browser and visit http://localhost:3000
+## Customize Your App
+Edit \`app.json\` to customize your application. The dev server will automatically reload when you save changes.
+## Available Templates
+- **simple**: A minimal getting started template
+- **form**: A contact form example
+- **dashboard**: A full dashboard with metrics and activity feed
+## Learn More
+- [Object UI Documentation](https://www.objectui.org)
+- [Schema Reference](https://www.objectui.org/docs/protocol/overview)
+- [Component Library](https://www.objectui.org/docs/api/components)
+## Commands
+- \`objectui serve [schema]\` - Start development server
+- \`objectui init [name]\` - Create a new application
+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"));
+  console.log();
+  console.log(chalk3.green("\u2728 Application created successfully!"));
+  console.log();
+  console.log(chalk3.bold("Next steps:"));
+  console.log();
+  if (name !== ".") {
+    console.log(chalk3.cyan(`  cd ${name}`));
+  }
+  console.log(chalk3.cyan("  objectui serve app.json"));
+  console.log();
+  console.log(chalk3.dim("  The development server will start on http://localhost:3000"));
+  console.log();
+}
+export {
+  parseSchemaFile,
+  scanPagesDirectory,
+  createTempApp,
+  createTempAppWithRouting,
+  serve,
+  init
+};
+//# sourceMappingURL=chunk-WOV6EOMH.js.map