@zhin.js/client 1.0.17 → 1.0.18

package/client/app.ts

@@ -0,0 +1,228 @@
+import * as React from "react";
+
+export type AddRouteInput = {
+  path: string;
+  name: string;
+  element: React.ReactNode;
+  parent?: string | null;
+  icon?: React.ReactNode | string;
+  requiredPermissions?: string[];
+  requiredRoles?: string[];
+  meta?: {
+    hideInMenu?: boolean;
+    order?: number;
+    group?: string;
+    fullWidth?: boolean;
+  };
+};
+
+export type AddToolInput = {
+  id?: string;
+  name: string;
+  icon?: React.ReactNode;
+  parent?: string | null;
+  path?: string;
+};
+
+export type ConsoleRouteRecord = {
+  path: string;
+  name: string;
+  element: React.ReactNode;
+  parent: string | null;
+  icon?: React.ReactNode | string;
+  requiredPermissions?: string[];
+  requiredRoles?: string[];
+  meta?: {
+    hideInMenu?: boolean;
+    order?: number;
+    group?: string;
+    fullWidth?: boolean;
+  };
+};
+
+export type InternalToolRecord = {
+  id: string;
+  name: string;
+  icon?: React.ReactNode;
+  parent: string | null;
+  path?: string;
+};
+
+export type RouteTreeNode = ConsoleRouteRecord & { children: RouteTreeNode[] };
+export type ToolTreeNode = InternalToolRecord & { children: ToolTreeNode[] };
+
+type SidebarRenderer = (options: { routes: RouteTreeNode[] }) => React.ReactNode;
+type ToolbarRenderer = (options: { tools: ToolTreeNode[] }) => React.ReactNode;
+export type ConsoleRouteRenderer = (route: ConsoleRouteRecord) => React.ReactNode;
+
+const listeners = new Set<() => void>();
+let version = 0;
+
+function bump() {
+  version++;
+  for (const l of listeners) l();
+}
+
+function subscribe(listener: () => void) {
+  listeners.add(listener);
+  return () => listeners.delete(listener);
+}
+
+function getVersion() {
+  return version;
+}
+
+let routes: ConsoleRouteRecord[] = [];
+let tools: InternalToolRecord[] = [];
+let sidebarRenderer: SidebarRenderer | null = null;
+let toolbarRenderer: ToolbarRenderer | null = null;
+let routeRenderer: ConsoleRouteRenderer | null = null;
+
+function slugId(name: string) {
+  return (
+    name
+      .toLowerCase()
+      .replace(/[^a-z0-9]+/g, "-")
+      .replace(/^-|-$/g, "") || "tool"
+  );
+}
+
+function buildRouteTree(flatRoutes: ConsoleRouteRecord[]): RouteTreeNode[] {
+  const nodes: RouteTreeNode[] = flatRoutes.map((r) => ({ ...r, children: [] }));
+  const roots: RouteTreeNode[] = [];
+
+  for (const node of nodes) {
+    if (!node.parent) {
+      roots.push(node);
+    } else {
+      const parent = nodes.find((n) => n.path === node.parent);
+      if (parent) {
+        parent.children.push(node);
+      } else {
+        roots.push(node);
+      }
+    }
+  }
+
+  const sortFn = (a: RouteTreeNode, b: RouteTreeNode) =>
+    (a.meta?.order ?? 999) - (b.meta?.order ?? 999);
+  roots.sort(sortFn);
+  for (const n of nodes) n.children.sort(sortFn);
+
+  return roots;
+}
+
+function buildToolTree(flatTools: InternalToolRecord[]): ToolTreeNode[] {
+  const nodes: ToolTreeNode[] = flatTools.map((t) => ({ ...t, children: [] }));
+  const roots: ToolTreeNode[] = [];
+
+  for (const node of nodes) {
+    if (!node.parent) {
+      roots.push(node);
+    } else {
+      const parent = nodes.find((n) => n.id === node.parent);
+      if (parent) {
+        parent.children.push(node);
+      } else {
+        roots.push(node);
+      }
+    }
+  }
+  return roots;
+}
+
+function renderRouteElement(route: ConsoleRouteRecord): React.ReactNode {
+  if (routeRenderer) return routeRenderer(route);
+  return route.element;
+}
+
+function createConsoleApp() {
+  return {
+    subscribe,
+    getVersion,
+
+    defineSidebar(render: SidebarRenderer) {
+      sidebarRenderer = render;
+      bump();
+    },
+
+    defineToolbar(render: ToolbarRenderer) {
+      toolbarRenderer = render;
+      bump();
+    },
+
+    defineRouter(render: ConsoleRouteRenderer) {
+      routeRenderer = render;
+      bump();
+    },
+
+    addRoute(input: AddRouteInput) {
+      const next = routes.filter((r) => r.path !== input.path);
+      next.push({
+        path: input.path,
+        name: input.name,
+        element: input.element,
+        parent: input.parent ?? null,
+        icon: input.icon,
+        requiredPermissions: input.requiredPermissions,
+        requiredRoles: input.requiredRoles,
+        meta: input.meta,
+      });
+      routes = next;
+      bump();
+    },
+
+    removeRoute(path: string) {
+      routes = routes.filter((r) => r.path !== path);
+      bump();
+    },
+
+    addTool(input: AddToolInput): string {
+      const id =
+        input.id ?? `${slugId(input.name)}-${Math.random().toString(36).slice(2, 8)}`;
+      if (tools.some((t) => t.id === id)) {
+        throw new Error(`[zhin-console] addTool: id already exists: ${id}`);
+      }
+      tools = [
+        ...tools,
+        {
+          id,
+          name: input.name,
+          icon: input.icon,
+          parent: input.parent ?? null,
+          path: input.path,
+        },
+      ];
+      bump();
+      return id;
+    },
+
+    getRouteTree(): RouteTreeNode[] {
+      return buildRouteTree(routes);
+    },
+
+    getToolTree(): ToolTreeNode[] {
+      return buildToolTree(tools);
+    },
+
+    _getRoutes(): readonly ConsoleRouteRecord[] {
+      return routes;
+    },
+
+    _getSidebarRenderer(): SidebarRenderer | null {
+      return sidebarRenderer;
+    },
+
+    _getToolbarRenderer(): ToolbarRenderer | null {
+      return toolbarRenderer;
+    },
+
+    _renderRouteElement(route: ConsoleRouteRecord): React.ReactNode {
+      return renderRouteElement(route);
+    },
+  };
+}
+
+export type ConsoleApp = ReturnType<typeof createConsoleApp>;
+
+export const app = createConsoleApp();

package/client/index.ts

@@ -1,20 +1,48 @@
-import { type ClassValue, clsx } from 'clsx'
-import { twMerge } from 'tailwind-merge'
 // Types
-export * from './types'
+export * from "./types";
 
-// 媒体 URL（含 base64://）解析，供控制台 / 沙盒等
-export { resolveMediaSrc, pickMediaRawUrl, type MediaKind } from './mediaSrc'
+// Media URL resolution
+export { resolveMediaSrc, pickMediaRawUrl, type MediaKind } from "./mediaSrc";
 
-// Redux Store
-export * from './store'
+// Console app singleton (page-manager style)
+export {
+  app,
+  type ConsoleApp,
+  type AddRouteInput,
+  type AddToolInput,
+  type ConsoleRouteRecord,
+  type RouteTreeNode,
+  type ToolTreeNode,
+  type ConsoleRouteRenderer,
+} from "./app";
 
-// Router
-export * from './router'
+// WebSocket (business data only)
+export * from "./websocket";
 
-// WebSocket
-export * from './websocket'
+// Re-export console-types
+export type {
+  PluginRegisterHostApi,
+  PluginAddRouteInput,
+  PluginAddToolInput,
+  ConsolePluginRegister,
+  ConsoleClientEntry,
+  ConsoleEntriesResponse,
+  ConsoleEntry,
+  ConsoleFileAddEntryInput,
+  RuntimeEnv,
+} from "@zhin.js/console-types";
 
-export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs))
-}
+export {
+  DEFAULT_CONSOLE_BASE_PATH,
+  CONSOLE_HOST_REACT_NAMESPACE_KEY,
+} from "@zhin.js/console-types";
+
+// Re-export console-core browser utilities
+export {
+  createRegistryStore,
+  useRegistry,
+  type RegistryStore,
+  configureConsole,
+  getRuntimeEnv,
+  cn,
+} from "@zhin.js/console-core/browser";