@object-ui/runner 0.3.0

package/src/lib/MetadataLoader.ts

@@ -0,0 +1,95 @@
+import { AppSchema, PageSchema } from '@object-ui/types';
+
+export interface MetadataLoader {
+  loadAppConfig(): Promise<AppSchema | null>;
+  loadPage(path: string): Promise<PageSchema | null>;
+}
+
+/**
+ * Strategy A: Local Bundle Loader (Vite Glob)
+ * Used during local development via 'pnpm dev:crm'
+ */
+export class LocalBundleLoader implements MetadataLoader {
+  private appGlob = import.meta.glob('../app-data/app.json');
+  private pagesGlob = import.meta.glob('../app-data/pages/**/*.json');
+  private rootGlob = import.meta.glob('../app-data/*.json');
+
+  async loadAppConfig(): Promise<AppSchema | null> {
+    const key = '../app-data/app.json';
+    if (this.appGlob[key]) {
+      const mod: any = await this.appGlob[key]();
+      return mod.default || mod;
+    }
+    return null;
+  }
+
+  async loadPage(path: string): Promise<PageSchema | null> {
+    // 1. Normalize Path
+    const normalizedPath = path.replace(/^\//, '') || 'index';
+
+    // 2. Try Exact Match in Pages
+    if (await this.tryLoad(`../app-data/pages/${normalizedPath}.json`)) {
+       return await this.loadKey(`../app-data/pages/${normalizedPath}.json`);
+    }
+
+    // 3. Try Index Match
+    if (await this.tryLoad(`../app-data/pages/${normalizedPath}/index.json`)) {
+       return await this.loadKey(`../app-data/pages/${normalizedPath}/index.json`);
+    }
+
+    // 4. Try Root fallback
+    if (normalizedPath === 'index' && await this.tryLoad(`../app-data/index.json`)) {
+        return await this.loadKey(`../app-data/index.json`);
+    }
+
+    // 5. Dynamic Routing (Basic Mock)
+    // TODO: Implement proper glob matching for dynamic routes if needed here, 
+    // but usually exact paths are enough for this loader demo.
+    return null; 
+  }
+
+  private async tryLoad(key: string) {
+    return !!(this.pagesGlob[key] || this.rootGlob[key]);
+  }
+
+  private async loadKey(key: string) {
+    const loader = this.pagesGlob[key] || this.rootGlob[key];
+    if (!loader) return null;
+    const mod: any = await loader();
+    return mod.default || mod;
+  }
+}
+
+/**
+ * Strategy B: Network Loader (Fetch API)
+ * Used in production to fetch JSONs from an API endpoint
+ */
+export class NetworkLoader implements MetadataLoader {
+  private baseUrl: string;
+
+  constructor(baseUrl: string = '/api') {
+    this.baseUrl = baseUrl;
+  }
+
+  async loadAppConfig(): Promise<AppSchema | null> {
+    try {
+      const res = await fetch(`${this.baseUrl}/app.json`);
+      if (!res.ok) return null;
+      return await res.json();
+    } catch {
+      return null;
+    }
+  }
+
+  async loadPage(path: string): Promise<PageSchema | null> {
+    try {
+      // Maps /customers -> /api/pages/customers.json
+      const jsonPath = path === '/' ? '/index' : path;
+      const res = await fetch(`${this.baseUrl}/pages${jsonPath}.json`);
+      if (!res.ok) return null;
+      return await res.json();
+    } catch {
+      return null;
+    }
+  }
+}

package/src/lib/mockDataSource.ts

@@ -0,0 +1,34 @@
+import type { DataSource } from '@object-ui/core';
+
+/**
+ * 模拟数据源 (Mock Adapter)
+ * 在真实项目中，你会在这里使用 fetch/axios 调用你的 API。
+ */
+export class MockDataSource implements DataSource {
+  async find(resource: string, params?: any): Promise<any[]> {
+    console.log(`[DataSource] Querying ${resource}`, params);
+    return [];
+  }
+
+  async findOne(resource: string, id: string): Promise<any> {
+    return null;
+  }
+
+  async create(resource: string, data: any): Promise<any> {
+    // 模拟网络请求
+    await new Promise(resolve => setTimeout(resolve, 800));
+    
+    console.log(`[DataSource] Created ${resource}:`, data);
+    alert(`Success! Created record in "${resource}":\n${JSON.stringify(data, null, 2)}`);
+    
+    return { id: Math.random().toString(), ...data };
+  }
+
+  async update(resource: string, id: string, data: any): Promise<any> {
+    return data;
+  }
+
+  async delete(resource: string, id: string): Promise<any> {
+    return true;
+  }
+}

package/src/main.tsx

@@ -0,0 +1,10 @@
+import React from 'react'
+import ReactDOM from 'react-dom/client'
+import App from './App.tsx'
+import './index.css'
+
+ReactDOM.createRoot(document.getElementById('root')!).render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>,
+)

package/tailwind.config.js

@@ -0,0 +1,63 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  darkMode: ["class"],
+  content: [
+    "./index.html",
+    "./src/**/*.{ts,tsx}",
+    
+    // ⚠️ 核心配置:
+    // 指向 Monorepo 中的包源码，确保 Tailwind 能提取出 Object UI 组件内的 className
+    "../../packages/components/src/**/*.{ts,tsx}",
+    "../../packages/react/src/**/*.{ts,tsx}",
+    "../../packages/plugin-kanban/src/**/*.{ts,tsx}",
+    "../../packages/plugin-charts/src/**/*.{ts,tsx}",
+  ],
+  theme: {
+    extend: {
+      // 映射 Shadcn UI 变量
+      colors: {
+        border: "hsl(var(--border))",
+        input: "hsl(var(--input))",
+        ring: "hsl(var(--ring))",
+        background: "hsl(var(--background))",
+        foreground: "hsl(var(--foreground))",
+        primary: {
+          DEFAULT: "hsl(var(--primary))",
+          foreground: "hsl(var(--primary-foreground))",
+        },
+        secondary: {
+          DEFAULT: "hsl(var(--secondary))",
+          foreground: "hsl(var(--secondary-foreground))",
+        },
+        destructive: {
+          DEFAULT: "hsl(var(--destructive))",
+          foreground: "hsl(var(--destructive-foreground))",
+        },
+        muted: {
+          DEFAULT: "hsl(var(--muted))",
+          foreground: "hsl(var(--muted-foreground))",
+        },
+        accent: {
+          DEFAULT: "hsl(var(--accent))",
+          foreground: "hsl(var(--accent-foreground))",
+        },
+        popover: {
+          DEFAULT: "hsl(var(--popover))",
+          foreground: "hsl(var(--popover-foreground))",
+        },
+        card: {
+          DEFAULT: "hsl(var(--card))",
+          foreground: "hsl(var(--card-foreground))",
+        },
+      },
+      borderRadius: {
+        lg: "var(--radius)",
+        md: "calc(var(--radius) - 2px)",
+        sm: "calc(var(--radius) - 4px)",
+      },
+    },
+  },
+  plugins: [
+    require("tailwindcss-animate"),
+  ],
+}

package/vite.config.ts

@@ -0,0 +1,29 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+import path from 'path'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [react()],
+  resolve: {
+    alias: {
+      // ⚡️ DX: Fix Shadcn component imports in the monorepo source
+      "@/ui": path.resolve(__dirname, "../../packages/components/src/ui"),
+      "@/lib/utils": path.resolve(__dirname, "../../packages/components/src/lib/utils"),
+      "@/hooks": path.resolve(__dirname, "../../packages/components/src/hooks"),
+      
+      "@": path.resolve(__dirname, "./src"),
+      // ⚡️ DX: App Data Symlink
+      "@app": path.resolve(__dirname, "./src/app-data"),
+
+      // ⚡️ DX: Map imports to source code for Hot Module Replacement
+      "@object-ui/components": path.resolve(__dirname, "../../packages/components/src"),
+      "@object-ui/react": path.resolve(__dirname, "../../packages/react/src"),
+      "@object-ui/core": path.resolve(__dirname, "../../packages/core/src"),
+      "@object-ui/types": path.resolve(__dirname, "../../packages/types/src"),
+      "@object-ui/data-objectql": path.resolve(__dirname, "../../packages/data-objectql/src"),
+      "@object-ui/plugin-kanban": path.resolve(__dirname, "../../packages/plugin-kanban/src"),
+      "@object-ui/plugin-charts": path.resolve(__dirname, "../../packages/plugin-charts/src"),
+    },
+  },
+})