@cinnabun/admin 0.0.1

package/dist/admin.module.d.ts

@@ -0,0 +1,6 @@
+import { Module } from "@cinnabun/core";
+import type { AdminModuleOptions } from "./interfaces/admin-options.js";
+export declare class AdminModule {
+    static forRoot(options: AdminModuleOptions): ReturnType<typeof Module>;
+    static getOptions(): AdminModuleOptions;
+}

package/dist/admin.module.js

@@ -0,0 +1,148 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+var __param = (this && this.__param) || function (paramIndex, decorator) {
+    return function (target, key) { decorator(target, key, paramIndex); }
+};
+import { Module, RestController, GetMapping, PostMapping, PutMapping, DeleteMapping, Body, Param, Query, UseGuard, NotFoundException, } from "@cinnabun/core";
+import { AdminService } from "./services/admin.service.js";
+import { createAdminAuthGuard } from "./guards/admin-auth.guard.js";
+import { buildAdminUIHtml } from "./ui/admin-ui.js";
+let moduleOptions = null;
+export class AdminModule {
+    static forRoot(options) {
+        moduleOptions = options;
+        const basePath = (options.path ?? "/admin").replace(/\/$/, "") || "/admin";
+        const authGuard = createAdminAuthGuard(options.auth?.guard, options.auth?.roles);
+        let DynamicAdminController = class DynamicAdminController {
+            adminService;
+            constructor(adminService) {
+                this.adminService = adminService;
+            }
+            getUI() {
+                const html = buildAdminUIHtml(options.title ?? "Admin Dashboard", basePath);
+                return new Response(html, {
+                    headers: { "Content-Type": "text/html; charset=utf-8" },
+                });
+            }
+            getMetadata() {
+                return this.adminService.getMetadata();
+            }
+            getResources() {
+                return this.adminService.getResources();
+            }
+            async list(resource, page, perPage) {
+                const p = Math.max(1, parseInt(page ?? "1", 10) || 1);
+                const pp = Math.max(1, Math.min(100, parseInt(perPage ?? "25", 10) || 25));
+                return this.adminService.list(resource, p, pp);
+            }
+            async get(resource, id) {
+                const numId = /^\d+$/.test(id) ? parseInt(id, 10) : id;
+                const entity = await this.adminService.get(resource, numId);
+                if (!entity) {
+                    throw new NotFoundException(`Entity not found: ${id}`);
+                }
+                return entity;
+            }
+            async create(resource, body) {
+                return this.adminService.create(resource, body);
+            }
+            async update(resource, id, body) {
+                const numId = /^\d+$/.test(id) ? parseInt(id, 10) : id;
+                return this.adminService.update(resource, numId, body);
+            }
+            async delete(resource, id) {
+                const numId = /^\d+$/.test(id) ? parseInt(id, 10) : id;
+                await this.adminService.delete(resource, numId);
+                return { success: true };
+            }
+        };
+        __decorate([
+            GetMapping("/"),
+            __metadata("design:type", Function),
+            __metadata("design:paramtypes", []),
+            __metadata("design:returntype", void 0)
+        ], DynamicAdminController.prototype, "getUI", null);
+        __decorate([
+            GetMapping("/api/metadata"),
+            __metadata("design:type", Function),
+            __metadata("design:paramtypes", []),
+            __metadata("design:returntype", void 0)
+        ], DynamicAdminController.prototype, "getMetadata", null);
+        __decorate([
+            GetMapping("/api/resources"),
+            __metadata("design:type", Function),
+            __metadata("design:paramtypes", []),
+            __metadata("design:returntype", void 0)
+        ], DynamicAdminController.prototype, "getResources", null);
+        __decorate([
+            GetMapping("/api/:resource"),
+            __param(0, Param("resource")),
+            __param(1, Query("page")),
+            __param(2, Query("perPage")),
+            __metadata("design:type", Function),
+            __metadata("design:paramtypes", [String, String, String]),
+            __metadata("design:returntype", Promise)
+        ], DynamicAdminController.prototype, "list", null);
+        __decorate([
+            GetMapping("/api/:resource/:id"),
+            __param(0, Param("resource")),
+            __param(1, Param("id")),
+            __metadata("design:type", Function),
+            __metadata("design:paramtypes", [String, String]),
+            __metadata("design:returntype", Promise)
+        ], DynamicAdminController.prototype, "get", null);
+        __decorate([
+            PostMapping("/api/:resource"),
+            __param(0, Param("resource")),
+            __param(1, Body()),
+            __metadata("design:type", Function),
+            __metadata("design:paramtypes", [String, Object]),
+            __metadata("design:returntype", Promise)
+        ], DynamicAdminController.prototype, "create", null);
+        __decorate([
+            PutMapping("/api/:resource/:id"),
+            __param(0, Param("resource")),
+            __param(1, Param("id")),
+            __param(2, Body()),
+            __metadata("design:type", Function),
+            __metadata("design:paramtypes", [String, String, Object]),
+            __metadata("design:returntype", Promise)
+        ], DynamicAdminController.prototype, "update", null);
+        __decorate([
+            DeleteMapping("/api/:resource/:id"),
+            __param(0, Param("resource")),
+            __param(1, Param("id")),
+            __metadata("design:type", Function),
+            __metadata("design:paramtypes", [String, String]),
+            __metadata("design:returntype", Promise)
+        ], DynamicAdminController.prototype, "delete", null);
+        DynamicAdminController = __decorate([
+            RestController(basePath),
+            UseGuard(authGuard),
+            __metadata("design:paramtypes", [AdminService])
+        ], DynamicAdminController);
+        let AdminDynamicModule = class AdminDynamicModule {
+        };
+        AdminDynamicModule = __decorate([
+            Module({
+                controllers: [DynamicAdminController],
+                providers: [AdminService],
+                exports: [AdminService],
+            })
+        ], AdminDynamicModule);
+        return AdminDynamicModule;
+    }
+    static getOptions() {
+        if (!moduleOptions) {
+            throw new Error("AdminModule not initialized. Call AdminModule.forRoot() first.");
+        }
+        return moduleOptions;
+    }
+}

package/dist/admin.plugin.d.ts

@@ -0,0 +1,5 @@
+import type { CinnabunPlugin, PluginContext } from "@cinnabun/core";
+export declare class AdminPlugin implements CinnabunPlugin {
+    name: string;
+    onInit(context: PluginContext): Promise<void>;
+}

package/dist/admin.plugin.js

@@ -0,0 +1,16 @@
+import { Logger } from "@cinnabun/core";
+import { AdminService } from "./services/admin.service.js";
+export class AdminPlugin {
+    name = "AdminPlugin";
+    async onInit(context) {
+        const logger = new Logger("AdminPlugin");
+        try {
+            const adminService = context.container.resolve(AdminService);
+            adminService.setContainer(context.container);
+            logger.info("Admin panel initialized");
+        }
+        catch (err) {
+            logger.warn("AdminPlugin: AdminService not found. Ensure AdminModule.forRoot() is imported.");
+        }
+    }
+}

package/dist/decorators/admin-field.d.ts

@@ -0,0 +1,14 @@
+import type { AdminField, AdminFieldType } from "../interfaces/admin-field.js";
+export interface AdminFieldOptions {
+    type: AdminFieldType;
+    label?: string;
+    required?: boolean;
+    options?: {
+        label: string;
+        value: unknown;
+    }[];
+    readonly?: boolean;
+    hidden?: boolean;
+}
+export declare function getAdminFields(target: object): AdminField[];
+export declare function AdminField(options: AdminFieldOptions): PropertyDecorator;

package/dist/decorators/admin-field.js

@@ -0,0 +1,26 @@
+const ADMIN_FIELDS_KEY = Symbol("admin:fields");
+export function getAdminFields(target) {
+    const fields = target.constructor[ADMIN_FIELDS_KEY];
+    if (!fields)
+        return [];
+    return Array.from(fields.values());
+}
+export function AdminField(options) {
+    return (target, propertyKey) => {
+        const name = String(propertyKey);
+        let fieldsMap = target.constructor[ADMIN_FIELDS_KEY];
+        if (!fieldsMap) {
+            fieldsMap = new Map();
+            target.constructor[ADMIN_FIELDS_KEY] = fieldsMap;
+        }
+        fieldsMap.set(name, {
+            name,
+            type: options.type,
+            label: options.label,
+            required: options.required,
+            options: options.options,
+            readonly: options.readonly,
+            hidden: options.hidden,
+        });
+    };
+}

package/dist/decorators/admin-resource.d.ts

@@ -0,0 +1,15 @@
+import type { Constructor } from "../interfaces/admin-resource.js";
+export interface AdminResourceOptions {
+    name: string;
+    label?: string;
+    repository: Constructor;
+    entity?: Constructor;
+    list?: {
+        columns?: string[];
+        perPage?: number;
+    };
+    form?: {
+        fields?: string[];
+    };
+}
+export declare function AdminResource(options: AdminResourceOptions): ClassDecorator;

package/dist/decorators/admin-resource.js

@@ -0,0 +1,17 @@
+import { adminMetadataStorage } from "../metadata/admin-storage.js";
+import { getAdminFields } from "./admin-field.js";
+export function AdminResource(options) {
+    return (target) => {
+        const fields = getAdminFields(target.prototype);
+        const resource = {
+            name: options.name,
+            label: options.label,
+            entity: options.entity ?? target,
+            repository: options.repository,
+            fields: fields.length > 0 ? fields : [],
+            list: options.list,
+            form: options.form,
+        };
+        adminMetadataStorage.addResource(resource);
+    };
+}

package/dist/guards/admin-auth.guard.d.ts

@@ -0,0 +1,5 @@
+import type { Guard } from "@cinnabun/core";
+import type { Constructor } from "../interfaces/admin-resource.js";
+type GuardConstructor = Constructor<Guard>;
+export declare function createAdminAuthGuard(guardClass?: GuardConstructor, roles?: string[]): GuardConstructor;
+export {};

package/dist/guards/admin-auth.guard.js

@@ -0,0 +1,60 @@
+import { ForbiddenException } from "@cinnabun/core";
+export function createAdminAuthGuard(guardClass, roles) {
+    if (!guardClass && !roles?.length) {
+        return class NoOpGuard {
+            canActivate() {
+                return true;
+            }
+        };
+    }
+    if (guardClass && !roles?.length) {
+        return guardClass;
+    }
+    if (!guardClass && roles?.length) {
+        return class RolesOnlyGuard {
+            async canActivate(req) {
+                try {
+                    const { getRequestUser } = await import("@cinnabun/auth");
+                    const user = getRequestUser(req);
+                    if (!user) {
+                        throw new ForbiddenException("Authentication required");
+                    }
+                    if (!user.roles?.some((r) => roles.includes(r))) {
+                        throw new ForbiddenException(`Requires one of roles: ${roles.join(", ")}`);
+                    }
+                    return true;
+                }
+                catch (err) {
+                    if (err instanceof ForbiddenException)
+                        throw err;
+                    throw new ForbiddenException("Roles check requires @cinnabun/auth. Install it and configure AuthGuard.");
+                }
+            }
+        };
+    }
+    const GuardClass = guardClass;
+    return class ComposedAdminGuard {
+        async canActivate(req) {
+            const guard = new GuardClass();
+            const passed = await guard.canActivate(req);
+            if (!passed)
+                return false;
+            try {
+                const { getRequestUser } = await import("@cinnabun/auth");
+                const user = getRequestUser(req);
+                if (!user) {
+                    throw new ForbiddenException("Authentication required");
+                }
+                if (!user.roles?.some((r) => roles.includes(r))) {
+                    throw new ForbiddenException(`Requires one of roles: ${roles.join(", ")}`);
+                }
+                return true;
+            }
+            catch (err) {
+                if (err instanceof ForbiddenException)
+                    throw err;
+                throw new ForbiddenException("Roles check requires @cinnabun/auth. Install it and configure AuthGuard.");
+            }
+        }
+    };
+}

package/dist/index.d.ts

@@ -0,0 +1,11 @@
+export type { AdminModuleOptions } from "./interfaces/admin-options.js";
+export type { AdminResource as AdminResourceConfig, Constructor, } from "./interfaces/admin-resource.js";
+export type { AdminField as AdminFieldConfig, AdminFieldType } from "./interfaces/admin-field.js";
+export { AdminService } from "./services/admin.service.js";
+export type { AdminRepository, AdminMetadata, ListResult, } from "./services/admin.service.js";
+export { AdminResource } from "./decorators/admin-resource.js";
+export type { AdminResourceOptions } from "./decorators/admin-resource.js";
+export { AdminField, getAdminFields } from "./decorators/admin-field.js";
+export type { AdminFieldOptions } from "./decorators/admin-field.js";
+export { AdminModule } from "./admin.module.js";
+export { AdminPlugin } from "./admin.plugin.js";

package/dist/index.js

@@ -0,0 +1,5 @@
+export { AdminService } from "./services/admin.service.js";
+export { AdminResource } from "./decorators/admin-resource.js";
+export { AdminField, getAdminFields } from "./decorators/admin-field.js";
+export { AdminModule } from "./admin.module.js";
+export { AdminPlugin } from "./admin.plugin.js";

package/dist/interfaces/admin-field.d.ts

@@ -0,0 +1,13 @@
+export type AdminFieldType = "text" | "number" | "boolean" | "date" | "select" | "textarea";
+export interface AdminField {
+    name: string;
+    type: AdminFieldType;
+    label?: string;
+    required?: boolean;
+    options?: {
+        label: string;
+        value: unknown;
+    }[];
+    readonly?: boolean;
+    hidden?: boolean;
+}

package/dist/interfaces/admin-field.js

@@ -0,0 +1 @@
+export {};

package/dist/interfaces/admin-options.d.ts

@@ -0,0 +1,11 @@
+import type { AdminResource } from "./admin-resource.js";
+import type { Constructor } from "./admin-resource.js";
+export interface AdminModuleOptions {
+    path?: string;
+    title?: string;
+    auth?: {
+        guard?: Constructor;
+        roles?: string[];
+    };
+    resources?: AdminResource[];
+}

package/dist/interfaces/admin-options.js

@@ -0,0 +1 @@
+export {};

package/dist/interfaces/admin-resource.d.ts

@@ -0,0 +1,16 @@
+import type { AdminField } from "./admin-field.js";
+export type Constructor<T = unknown> = new (...args: unknown[]) => T;
+export interface AdminResource {
+    name: string;
+    label?: string;
+    entity?: Constructor;
+    repository: Constructor;
+    fields: AdminField[];
+    list?: {
+        columns?: string[];
+        perPage?: number;
+    };
+    form?: {
+        fields?: string[];
+    };
+}

package/dist/interfaces/admin-resource.js

@@ -0,0 +1 @@
+export {};

package/dist/metadata/admin-storage.d.ts

@@ -0,0 +1,9 @@
+import type { AdminResource } from "../interfaces/admin-resource.js";
+declare class AdminMetadataStorage {
+    private resources;
+    addResource(resource: AdminResource): void;
+    getAllResources(): AdminResource[];
+    reset(): void;
+}
+export declare const adminMetadataStorage: AdminMetadataStorage;
+export {};

package/dist/metadata/admin-storage.js

@@ -0,0 +1,19 @@
+class AdminMetadataStorage {
+    resources = [];
+    addResource(resource) {
+        const existing = this.resources.findIndex((r) => r.name === resource.name);
+        if (existing >= 0) {
+            this.resources[existing] = resource;
+        }
+        else {
+            this.resources.push(resource);
+        }
+    }
+    getAllResources() {
+        return [...this.resources];
+    }
+    reset() {
+        this.resources = [];
+    }
+}
+export const adminMetadataStorage = new AdminMetadataStorage();

package/dist/services/admin.service.d.ts

@@ -0,0 +1,43 @@
+import type { Container } from "@cinnabun/core";
+import type { AdminResource } from "../interfaces/admin-resource.js";
+export interface AdminRepository<T = unknown> {
+    findAll(options?: {
+        limit?: number;
+        offset?: number;
+    }): Promise<T[]>;
+    findById(id: string | number): Promise<T | null>;
+    create(data: Partial<T>): Promise<T>;
+    update(id: string | number, data: Partial<T>): Promise<T>;
+    delete(id: string | number): Promise<void>;
+    count?(where?: Partial<T>): Promise<number>;
+}
+export interface AdminMetadata {
+    title: string;
+    resources: Array<{
+        name: string;
+        label: string;
+        fields: AdminResource["fields"];
+        list?: AdminResource["list"];
+        form?: AdminResource["form"];
+    }>;
+}
+export interface ListResult<T> {
+    data: T[];
+    total: number;
+    page: number;
+    perPage: number;
+}
+export declare class AdminService {
+    private container;
+    setContainer(container: Container): void;
+    private getResourceConfigs;
+    getResources(): AdminMetadata["resources"];
+    getResource(name: string): AdminResource | undefined;
+    private getRepository;
+    list<T>(resourceName: string, page?: number, perPage?: number): Promise<ListResult<T>>;
+    get<T>(resourceName: string, id: string | number): Promise<T | null>;
+    create<T>(resourceName: string, data: Record<string, unknown>): Promise<T>;
+    update<T>(resourceName: string, id: string | number, data: Record<string, unknown>): Promise<T>;
+    delete(resourceName: string, id: string | number): Promise<void>;
+    getMetadata(): AdminMetadata;
+}

package/dist/services/admin.service.js

@@ -0,0 +1,81 @@
+import { AdminModule } from "../admin.module.js";
+import { adminMetadataStorage } from "../metadata/admin-storage.js";
+export class AdminService {
+    container = null;
+    setContainer(container) {
+        this.container = container;
+    }
+    getResourceConfigs() {
+        const options = AdminModule.getOptions();
+        const fromOptions = options.resources ?? [];
+        const fromDecorators = adminMetadataStorage.getAllResources();
+        const merged = new Map();
+        for (const r of [...fromDecorators, ...fromOptions]) {
+            merged.set(r.name, r);
+        }
+        return Array.from(merged.values());
+    }
+    getResources() {
+        return this.getResourceConfigs().map((r) => ({
+            name: r.name,
+            label: r.label ?? r.name.charAt(0).toUpperCase() + r.name.slice(1),
+            fields: r.fields,
+            list: r.list,
+            form: r.form,
+        }));
+    }
+    getResource(name) {
+        return this.getResourceConfigs().find((r) => r.name === name);
+    }
+    getRepository(resourceName) {
+        if (!this.container) {
+            throw new Error("AdminService: container not set. Add AdminPlugin to plugins and ensure it runs before admin routes are used.");
+        }
+        const resource = this.getResource(resourceName);
+        if (!resource) {
+            throw new Error(`Admin resource not found: ${resourceName}`);
+        }
+        const repo = this.container.resolve(resource.repository);
+        return repo;
+    }
+    async list(resourceName, page = 1, perPage = 25) {
+        const resource = this.getResource(resourceName);
+        if (!resource) {
+            throw new Error(`Admin resource not found: ${resourceName}`);
+        }
+        const effectivePerPage = resource.list?.perPage ?? perPage;
+        const offset = (page - 1) * effectivePerPage;
+        const repo = this.getRepository(resourceName);
+        const data = await repo.findAll({ limit: effectivePerPage, offset });
+        const total = typeof repo.count === "function" ? await repo.count() : data.length;
+        return {
+            data,
+            total,
+            page,
+            perPage: effectivePerPage,
+        };
+    }
+    async get(resourceName, id) {
+        const repo = this.getRepository(resourceName);
+        return repo.findById(id);
+    }
+    async create(resourceName, data) {
+        const repo = this.getRepository(resourceName);
+        return repo.create(data);
+    }
+    async update(resourceName, id, data) {
+        const repo = this.getRepository(resourceName);
+        return repo.update(id, data);
+    }
+    async delete(resourceName, id) {
+        const repo = this.getRepository(resourceName);
+        return repo.delete(id);
+    }
+    getMetadata() {
+        const options = AdminModule.getOptions();
+        return {
+            title: options.title ?? "Admin Dashboard",
+            resources: this.getResources(),
+        };
+    }
+}

package/dist/ui/admin-ui.d.ts

@@ -0,0 +1 @@
+export declare function buildAdminUIHtml(title: string, basePath: string): string;

package/dist/ui/admin-ui.js

@@ -0,0 +1,230 @@
+export function buildAdminUIHtml(title, basePath) {
+    const apiBase = `${basePath}/api`;
+    const scriptContent = buildScriptContent(apiBase, basePath);
+    return `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>${escapeHtml(title)}</title>
+  <style>
+    * { box-sizing: border-box; }
+    body { margin: 0; font-family: system-ui, sans-serif; background: #f5f5f5; }
+    .layout { display: flex; min-height: 100vh; }
+    .sidebar { width: 220px; background: #1e293b; color: #e2e8f0; padding: 1rem 0; }
+    .sidebar h1 { margin: 0 1rem 1rem; font-size: 1.1rem; }
+    .sidebar a { display: block; padding: 0.5rem 1rem; color: #94a3b8; text-decoration: none; }
+    .sidebar a:hover, .sidebar a.active { background: #334155; color: #fff; }
+    .main { flex: 1; padding: 1.5rem; overflow: auto; }
+    .toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
+    .btn { padding: 0.5rem 1rem; background: #3b82f6; color: #fff; border: none; border-radius: 6px; cursor: pointer; font-size: 0.9rem; }
+    .btn:hover { background: #2563eb; }
+    .btn-danger { background: #dc2626; }
+    .btn-danger:hover { background: #b91c1c; }
+    .btn-secondary { background: #64748b; }
+    .btn-secondary:hover { background: #475569; }
+    table { width: 100%; border-collapse: collapse; background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
+    th, td { padding: 0.75rem 1rem; text-align: left; border-bottom: 1px solid #e2e8f0; }
+    th { background: #f8fafc; font-weight: 600; }
+    tr:hover { background: #f8fafc; }
+    .form-group { margin-bottom: 1rem; }
+    .form-group label { display: block; margin-bottom: 0.25rem; font-weight: 500; }
+    .form-group input, .form-group select, .form-group textarea { width: 100%; padding: 0.5rem; border: 1px solid #cbd5e1; border-radius: 6px; }
+    .form-group input[type=checkbox] { width: auto; }
+    .pagination { display: flex; gap: 0.5rem; align-items: center; margin-top: 1rem; }
+    .pagination button { padding: 0.25rem 0.5rem; }
+    .empty { display: flex; min-height: 200px; align-items: center; justify-content: center; color: #64748b; }
+    .error { color: #dc2626; font-size: 0.9rem; margin-top: 0.5rem; }
+  </style>
+</head>
+<body>
+  <div class="layout">
+    <nav class="sidebar">
+      <h1>${escapeHtml(title)}</h1>
+      <div id="sidebar-links"></div>
+    </nav>
+    <main class="main">
+      <div id="content"></div>
+    </main>
+  </div>
+  <script>${scriptContent}</script>
+</body>
+</html>`;
+}
+function buildScriptContent(apiBase, basePath) {
+    return `
+(function() {
+  const API_BASE = ${JSON.stringify(apiBase)};
+  const BASE_PATH = ${JSON.stringify(basePath)};
+  let metadata = null;
+
+  function escapeHtml(s) {
+    if (s == null) return "";
+    const div = document.createElement("div");
+    div.textContent = s;
+    return div.innerHTML;
+  }
+
+  async function fetchMetadata() {
+    const res = await fetch(API_BASE + "/metadata");
+    if (!res.ok) throw new Error("Failed to load metadata");
+    return res.json();
+  }
+
+  function renderSidebar() {
+    const container = document.getElementById("sidebar-links");
+    if (!metadata || !metadata.resources || !metadata.resources.length) {
+      container.innerHTML = "<p style='padding: 1rem; color: #94a3b8;'>No resources</p>";
+      return;
+    }
+    const path = window.location.pathname.replace(BASE_PATH, "").split("/").filter(Boolean);
+    const current = path[0] || "";
+    container.innerHTML = metadata.resources.map(function(r) {
+      return "<a href='#' data-resource='" + escapeHtml(r.name) + "' class='" + (current === r.name ? "active" : "") + "'>" + escapeHtml(r.label || r.name) + "</a>";
+    }).join("");
+    container.querySelectorAll("a").forEach(function(a) {
+      a.addEventListener("click", function(e) {
+        e.preventDefault();
+        navigate("list", a.dataset.resource);
+      });
+    });
+  }
+
+  function navigate(view, resource, id) {
+    const path = BASE_PATH + (resource ? "/" + resource + (view === "create" ? "/new" : id ? "/" + id : "") : "");
+    window.history.pushState({ view: view, resource: resource, id: id }, "", path);
+    render({ view: view, resource: resource, id: id });
+  }
+
+  window.addEventListener("popstate", function(e) {
+    render(e.state || { view: "list", resource: null });
+  });
+
+  async function render(state) {
+    const view = state && state.view || "list";
+    const resource = state && state.resource;
+    const id = state && state.id;
+    const content = document.getElementById("content");
+
+    document.querySelectorAll(".sidebar a").forEach(function(a) {
+      a.classList.toggle("active", a.dataset.resource === resource);
+    });
+
+    if (!resource) {
+      content.innerHTML = "<div class='empty'><p>Select a resource from the sidebar</p></div>";
+      return;
+    }
+
+    const res = metadata.resources.find(function(r) { return r.name === resource; });
+    if (!res) {
+      content.innerHTML = "<div class='empty'><p>Resource not found</p></div>";
+      return;
+    }
+
+    if (view === "list") {
+      const page = parseInt(new URLSearchParams(window.location.search).get("page") || "1", 10);
+      const resp = await fetch(API_BASE + "/" + resource + "?page=" + page + "&perPage=25");
+      if (!resp.ok) { content.innerHTML = "<div class='error'>Failed to load data</div>"; return; }
+      const data = await resp.json();
+      const columns = data.data[0] ? Object.keys(data.data[0]) : (res.list && res.list.columns || (res.fields || []).map(function(f) { return f.name; }) || []);
+      const rowsHtml = data.data.length ? data.data.map(function(row) {
+        const rowId = row.id !== undefined ? row.id : Object.values(row)[0];
+        const cells = columns.map(function(c) { return "<td>" + escapeHtml(String(row[c] != null ? row[c] : "")) + "</td>"; }).join("");
+        return "<tr>" + cells + "<td><button class='btn btn-secondary' onclick='window.adminNavigate(\\"edit\\", \\"" + escapeHtml(resource) + "\\", \\"" + escapeHtml(String(rowId)) + "\\")'>Edit</button> <button class='btn btn-danger' onclick='window.adminDelete(\\"" + escapeHtml(resource) + "\\", \\"" + escapeHtml(String(rowId)) + "\\")'>Delete</button></td></tr>";
+      }).join("") : "<tr><td colspan='" + (columns.length + 1) + "'>No records</td></tr>";
+      const prevBtn = data.page > 1 ? "<button class='btn btn-secondary' onclick='window.adminGoPage(" + (data.page - 1) + ")'>Prev</button>" : "";
+      const nextBtn = (data.page * data.perPage < data.total) ? "<button class='btn btn-secondary' onclick='window.adminGoPage(" + (data.page + 1) + ")'>Next</button>" : "";
+      content.innerHTML = "<div class='toolbar'><h2>" + escapeHtml(res.label || resource) + "</h2><button class='btn' onclick='window.adminNavigate(\\"create\\", \\"" + escapeHtml(resource) + "\\")'>Create</button></div>" +
+        "<table><thead><tr>" + columns.map(function(c) { return "<th>" + escapeHtml(c) + "</th>"; }).join("") + "<th>Actions</th></tr></thead><tbody>" + rowsHtml + "</tbody></table>" +
+        "<div class='pagination'>" + prevBtn + "<span>Page " + data.page + " of " + (Math.ceil(data.total / data.perPage) || 1) + "</span>" + nextBtn + "</div>";
+    } else if (view === "create" || view === "edit") {
+      const formFields = res.fields && res.fields.filter(function(f) {
+        const fields = (res.form && res.form.fields) || (res.fields || []).map(function(x) { return x.name; }) || [];
+        return fields.length === 0 || fields.indexOf(f.name) >= 0;
+      }) || [];
+      let values = {};
+      if (view === "edit" && id) {
+        const r = await fetch(API_BASE + "/" + resource + "/" + id);
+        if (r.ok) values = await r.json();
+      }
+      const formHtml = formFields.map(function(f) {
+        const val = values[f.name];
+        const v = val !== undefined && val !== null ? String(val) : "";
+        if (f.type === "boolean") return "<div class='form-group'><label><input type='checkbox' name='" + escapeHtml(f.name) + "' " + (v === "true" ? "checked" : "") + "> " + escapeHtml(f.label || f.name) + "</label></div>";
+        if (f.type === "select") return "<div class='form-group'><label>" + escapeHtml(f.label || f.name) + "</label><select name='" + escapeHtml(f.name) + "' " + (f.required ? "required" : "") + ">" + (f.options || []).map(function(o) { return "<option value='" + escapeHtml(String(o.value)) + "' " + (v === String(o.value) ? "selected" : "") + ">" + escapeHtml(o.label) + "</option>"; }).join("") + "</select></div>";
+        if (f.type === "textarea") return "<div class='form-group'><label>" + escapeHtml(f.label || f.name) + "</label><textarea name='" + escapeHtml(f.name) + "' " + (f.readonly ? "readonly" : "") + " " + (f.required ? "required" : "") + ">" + escapeHtml(v) + "</textarea></div>";
+        return "<div class='form-group'><label>" + escapeHtml(f.label || f.name) + "</label><input type='" + (f.type === "date" ? "date" : f.type === "number" ? "number" : "text") + "' name='" + escapeHtml(f.name) + "' value='" + escapeHtml(v) + "' " + (f.readonly ? "readonly" : "") + " " + (f.required ? "required" : "") + "></div>";
+      }).join("");
+      const formId = view === "edit" ? JSON.stringify(id) : "null";
+      content.innerHTML = "<div class='toolbar'><h2>" + (view === "create" ? "Create" : "Edit") + " " + escapeHtml(res.label || resource) + "</h2><button class='btn btn-secondary' onclick='window.adminNavigate(\\"list\\", \\"" + escapeHtml(resource) + "\\")'>Back</button></div>" +
+        "<form id='admin-form' onsubmit='return window.adminSubmitForm(event, " + JSON.stringify(resource) + ", " + formId + ")'>" + formHtml + "<button type='submit' class='btn'>Save</button></form>";
+    }
+  }
+
+  window.adminNavigate = function(view, resource, id) {
+    navigate(view, resource, id);
+  };
+
+  window.adminDelete = async function(resource, id) {
+    if (!confirm("Delete this record?")) return;
+    const res = await fetch(API_BASE + "/" + resource + "/" + id, { method: "DELETE" });
+    if (res.ok) navigate("list", resource);
+    else alert("Failed to delete");
+  };
+
+  window.adminSubmitForm = async function(e, resource, id) {
+    e.preventDefault();
+    const form = e.target;
+    const formData = new FormData(form);
+    const obj = {};
+    formData.forEach(function(v, k) {
+      const field = metadata.resources.find(function(r) { return r.name === resource; }) && metadata.resources.find(function(r) { return r.name === resource; }).fields && metadata.resources.find(function(r) { return r.name === resource; }).fields.find(function(f) { return f.name === k; });
+      if (field && field.type === "number") obj[k] = parseInt(v, 10) || 0;
+      else if (field && field.type === "boolean") obj[k] = formData.get(k) === "on";
+      else obj[k] = v;
+    });
+    const url = id ? API_BASE + "/" + resource + "/" + id : API_BASE + "/" + resource;
+    const method = id ? "PUT" : "POST";
+    const res = await fetch(url, { method: method, headers: { "Content-Type": "application/json" }, body: JSON.stringify(obj) });
+    if (!res.ok) { alert("Failed to save"); return false; }
+    navigate("list", resource);
+    return false;
+  };
+
+  window.adminGoPage = function(page) {
+    const url = new URL(window.location.href);
+    url.searchParams.set("page", page);
+    window.location.href = url.pathname + url.search;
+  };
+
+  (async function() {
+    try {
+      metadata = await fetchMetadata();
+      renderSidebar();
+      const path = window.location.pathname.replace(BASE_PATH, "").split("/").filter(Boolean);
+      const resource = path[0];
+      const second = path[1];
+      if (resource && second === "new") {
+        render({ view: "create", resource: resource });
+      } else if (resource && second && second !== "new") {
+        render({ view: "edit", resource: resource, id: second });
+      } else if (resource) {
+        render({ view: "list", resource: resource });
+      } else {
+        render({ view: "list", resource: null });
+      }
+    } catch (err) {
+      document.getElementById("content").innerHTML = "<div class='error'>Failed to load: " + escapeHtml(err.message) + "</div>";
+    }
+  })();
+})();
+`;
+}
+function escapeHtml(s) {
+    return s
+        .replace(/&/g, "&amp;")
+        .replace(/</g, "&lt;")
+        .replace(/>/g, "&gt;")
+        .replace(/"/g, "&quot;")
+        .replace(/'/g, "&#039;");
+}

package/package.json

@@ -0,0 +1,34 @@
+{
+  "name": "@cinnabun/admin",
+  "version": "0.0.1",
+  "description": "Auto-generated admin UI for CRUD operations",
+  "type": "module",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": ["dist"],
+  "exports": {
+    ".": "./dist/index.js"
+  },
+  "scripts": {
+    "test": "bun test",
+    "build": "tsc",
+    "prepublishOnly": "bun run build"
+  },
+  "keywords": ["cinnabun", "admin", "crud"],
+  "peerDependencies": {
+    "@cinnabun/core": "^0.0.3",
+    "@cinnabun/db": ">=0.0.1",
+    "@cinnabun/auth": ">=0.0.1"
+  },
+  "peerDependenciesMeta": {
+    "@cinnabun/db": { "optional": true },
+    "@cinnabun/auth": { "optional": true }
+  },
+  "devDependencies": {
+    "@cinnabun/core": "workspace:*",
+    "@cinnabun/testing": "workspace:*",
+    "@types/bun": "latest",
+    "reflect-metadata": "^0.2.2",
+    "typescript": "^5.9.3"
+  }
+}