@antv/gpt-vis 0.6.1 → 1.0.0-beta.2

package/dist/cjs/vis/mindmap/index.js

@@ -0,0 +1,214 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/vis/mindmap/index.ts
+var mindmap_exports = {};
+__export(mindmap_exports, {
+  Mindmap: () => Mindmap
+});
+module.exports = __toCommonJS(mindmap_exports);
+var import_g6 = require("@antv/g6");
+var import_theme = require("../../util/theme");
+function toG6TreeData(node) {
+  return {
+    id: node.name,
+    children: (node.children || []).map(toG6TreeData)
+  };
+}
+function convertTreeData(treeData) {
+  return (0, import_g6.treeToGraphData)(toG6TreeData(treeData), {
+    getNodeData: (datum, depth) => {
+      datum.depth = depth;
+      if (!datum.children)
+        return datum;
+      const { children, ...rest } = datum;
+      return {
+        ...rest,
+        children: children.map((child) => child.id)
+      };
+    }
+  });
+}
+function assignBranchColors(graphData, colors) {
+  const nodes = graphData.nodes || [];
+  let colorIndex = 0;
+  const nodeMap = /* @__PURE__ */ new Map();
+  for (const node of nodes) {
+    nodeMap.set(String(node.id), node);
+  }
+  const dfs = (nodeId, color) => {
+    var _a;
+    const node = nodeMap.get(String(nodeId));
+    if (!node)
+      return;
+    node.style = node.style || {};
+    node.style.color = color || colors[colorIndex++ % colors.length];
+    (_a = node.children) == null ? void 0 : _a.forEach((childId) => dfs(childId, node.style.color));
+  };
+  nodes.filter((n) => n.depth === 1).forEach((n) => dfs(String(n.id)));
+}
+function getNodeSide(nodeData, parentData) {
+  if (!parentData)
+    return "center";
+  return (0, import_g6.positionOf)(parentData)[0] > (0, import_g6.positionOf)(nodeData)[0] ? "left" : "right";
+}
+function estimateNodeWidth(text, fontSize, padding) {
+  const avgCharWidth = fontSize * 0.58;
+  const cjkCount = (text.match(/[\u4e00-\u9fff\u3000-\u303f\uff00-\uffef]/g) || []).length;
+  const otherCount = text.length - cjkCount;
+  const textWidth = cjkCount * fontSize + otherCount * avgCharWidth;
+  return Math.min(Math.max(textWidth + padding, 120), 300);
+}
+var Mindmap = (options) => {
+  const { container, width, height, theme: chartTheme = "default" } = options;
+  let graph = null;
+  const render = (config) => {
+    const { data, direction = "H", theme = chartTheme, title, style = {} } = config;
+    if (!data || !data.name) {
+      throw new Error("Mindmap: data with a name field is required");
+    }
+    if (graph) {
+      graph.destroy();
+      graph = null;
+    }
+    const containerEl = typeof container === "string" ? document.querySelector(container) : container;
+    if (!containerEl) {
+      throw new Error("Mindmap: container element not found");
+    }
+    containerEl.innerHTML = "";
+    const colors = (0, import_theme.normalizePalette)(style.palette, theme);
+    const backgroundColor = style.backgroundColor || (0, import_theme.getBackgroundColor)(theme);
+    const isDark = theme === "dark";
+    containerEl.style.background = backgroundColor;
+    const graphData = convertTreeData(data);
+    assignBranchColors(graphData, colors);
+    for (const node of graphData.nodes || []) {
+      const label = String(node.id);
+      const depth = node.depth ?? 0;
+      const fontSize = depth === 0 ? 24 : 16;
+      const pad = depth === 0 ? 64 : 36;
+      node.layoutSize = [estimateNodeWidth(label, fontSize, pad), depth === 0 ? 60 : 48];
+    }
+    graph = new import_g6.Graph({
+      animation: false,
+      container: containerEl,
+      width,
+      height,
+      autoFit: "view",
+      autoResize: true,
+      padding: 20,
+      zoomRange: [0.1, 5],
+      zoom: 1,
+      theme: chartTheme,
+      data: graphData,
+      plugins: title ? [{ key: "title", type: "title", title, titleFill: isDark ? "#e0e6ed" : "#1a1a2e" }] : [],
+      node: {
+        type: "rect",
+        animation: { translate: false, update: false },
+        style: function(d) {
+          var _a;
+          const depth = d.depth ?? 0;
+          const color = (_a = d.style) == null ? void 0 : _a.color;
+          const label = String((0, import_g6.idOf)(d));
+          const parentData = this.getParentData((0, import_g6.idOf)(d), "tree");
+          const [nodeWidth, nodeHeight] = d.layoutSize || [120, 48];
+          const side = direction === "RL" ? "left" : direction === "LR" ? "right" : getNodeSide(d, parentData);
+          const fontSize = depth === 0 ? 24 : 16;
+          const fontWeight = depth <= 1 ? 600 : 400;
+          const dx = side === "left" ? -nodeWidth : side === "center" ? -nodeWidth / 2 : 0;
+          const base = {
+            size: [nodeWidth, nodeHeight],
+            dx,
+            radius: 8,
+            labelText: label,
+            labelPlacement: "center",
+            labelFontSize: fontSize,
+            labelFontWeight: fontWeight,
+            ports: [{ placement: "left" }, { placement: "right" }]
+          };
+          if (depth === 0) {
+            return {
+              ...base,
+              fill: isDark ? "#333" : "#f1f4f5",
+              labelFill: isDark ? "#e0e0e0" : "#252525"
+            };
+          }
+          if (depth === 1) {
+            return {
+              ...base,
+              fill: color || "#99ADD1",
+              labelFill: "#fff"
+            };
+          }
+          return {
+            ...base,
+            fill: backgroundColor,
+            stroke: color || (isDark ? "#555" : "#99ADD1"),
+            lineWidth: 3,
+            labelFill: isDark ? color || "#ccc" : color || "#333"
+          };
+        }
+      },
+      edge: {
+        type: "cubic-horizontal",
+        animation: { translate: false, update: false },
+        style: {
+          lineWidth: 3,
+          stroke: function(edgeData) {
+            var _a;
+            const sourceNode = this.getNodeData(edgeData.source);
+            return ((_a = sourceNode == null ? void 0 : sourceNode.style) == null ? void 0 : _a.color) || (isDark ? "#555" : "#99ADD1");
+          }
+        }
+      },
+      layout: {
+        type: "mindmap",
+        direction,
+        preLayout: false,
+        getWidth: (nodeData) => {
+          var _a;
+          return ((_a = nodeData.layoutSize) == null ? void 0 : _a[0]) ?? 120;
+        },
+        getHeight: (nodeData) => {
+          var _a;
+          return ((_a = nodeData.layoutSize) == null ? void 0 : _a[1]) ?? 48;
+        },
+        getHGap: () => 64,
+        getVGap: () => 14
+      },
+      behaviors: ["drag-canvas"]
+    });
+    graph.render();
+  };
+  const destroy = () => {
+    if (graph) {
+      graph.destroy();
+      graph = null;
+    }
+  };
+  return {
+    render,
+    destroy,
+    zoomTo: (zoom) => graph == null ? void 0 : graph.zoomTo(zoom),
+    getZoom: () => graph == null ? void 0 : graph.getZoom()
+  };
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Mindmap
+});

package/dist/cjs/vis/network-graph/index.d.ts

@@ -0,0 +1,59 @@
+import type { GraphData, VisualizationOptions } from '../../types';
+export type NetworkGraphNode = GraphData['nodes'][number];
+export type NetworkGraphEdge = GraphData['edges'][number];
+export type NetworkGraphData = GraphData;
+/**
+ * NetworkGraphConfig defines the configuration for rendering the network graph.
+ */
+export interface NetworkGraphConfig {
+    type?: 'network-graph';
+    data: NetworkGraphData;
+    layout?: 'force' | 'circular' | 'grid' | 'radial' | 'concentric' | 'dagre';
+    theme?: 'default' | 'academy' | 'dark';
+    title?: string;
+    style?: {
+        backgroundColor?: string;
+        palette?: string[];
+    };
+}
+/**
+ * NetworkGraphInstance represents a network graph instance with render and destroy methods.
+ */
+export interface NetworkGraphInstance {
+    render: (config: NetworkGraphConfig) => void;
+    destroy: () => void;
+    zoomTo: (zoom: number) => void;
+    getZoom: () => number | undefined;
+}
+/**
+ * NetworkGraph component using G6 5.0.
+ *
+ * @example
+ * ```ts
+ * const graph = NetworkGraph({
+ *   container: '#container',
+ *   width: 600,
+ *   height: 400,
+ * });
+ *
+ * graph.render({
+ *   type: 'network-graph',
+ *   data: {
+ *     nodes: [
+ *       { name: '哈利·波特' },
+ *       { name: '赫敏·格兰杰' },
+ *       { name: '伏地魔' },
+ *     ],
+ *     edges: [
+ *       { source: '哈利·波特', target: '赫敏·格兰杰', name: '朋友' },
+ *       { source: '哈利·波特', target: '伏地魔', name: '敌人' },
+ *     ],
+ *   },
+ *   layout: 'force',
+ *   theme: 'academy',
+ * });
+ *
+ * graph.destroy();
+ * ```
+ */
+export declare const NetworkGraph: (options: VisualizationOptions) => NetworkGraphInstance;

package/dist/cjs/vis/network-graph/index.js

@@ -0,0 +1,166 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/vis/network-graph/index.ts
+var network_graph_exports = {};
+__export(network_graph_exports, {
+  NetworkGraph: () => NetworkGraph
+});
+module.exports = __toCommonJS(network_graph_exports);
+var import_g6 = require("@antv/g6");
+var import_theme = require("../../util/theme");
+var NetworkGraph = (options) => {
+  const { container, width, height, theme: chartTheme = "default" } = options;
+  let graph = null;
+  const render = (config) => {
+    const {
+      data = { nodes: [], edges: [] },
+      layout = "force",
+      theme = chartTheme,
+      title,
+      style = {}
+    } = config;
+    const { nodes = [], edges = [] } = data;
+    if (graph) {
+      graph.destroy();
+      graph = null;
+    }
+    const colors = (0, import_theme.normalizePalette)(style.palette, theme);
+    const backgroundColor = style.backgroundColor || (0, import_theme.getBackgroundColor)(theme);
+    const isDark = theme === "dark";
+    const containerEl = typeof container === "string" ? document.querySelector(container) : container;
+    if (!containerEl) {
+      throw new Error("NetworkGraph: container element not found");
+    }
+    containerEl.innerHTML = "";
+    containerEl.style.background = backgroundColor;
+    containerEl.style.borderRadius = "4px";
+    containerEl.style.overflow = "hidden";
+    const nodeData = nodes.map((node, index) => ({
+      id: node.name,
+      data: { label: node.name },
+      style: {
+        fill: colors[index % colors.length],
+        stroke: isDark ? "#444" : "#fff",
+        lineWidth: 2,
+        labelText: node.name,
+        labelFill: isDark ? "#e0e0e0" : "#333",
+        labelFontSize: 12,
+        size: 28
+      }
+    }));
+    const edgeData = edges.map((edge) => ({
+      source: edge.source,
+      target: edge.target,
+      data: { label: edge.name ?? "" },
+      style: {
+        stroke: isDark ? "#555" : "#ccc",
+        lineWidth: 1.5,
+        endArrow: true,
+        labelText: edge.name ?? "",
+        labelFill: isDark ? "#aaa" : "#666",
+        labelFontSize: 11,
+        labelBackground: !!edge.name,
+        labelBackgroundFill: backgroundColor,
+        labelBackgroundOpacity: 0.8
+      }
+    }));
+    const layoutConfig = {
+      force: {
+        type: "force",
+        preventOverlap: true,
+        nodeSize: 32,
+        linkDistance: 150,
+        gravity: 10
+      },
+      circular: {
+        type: "circular"
+      },
+      grid: {
+        type: "grid",
+        rows: Math.max(1, Math.ceil(Math.sqrt(nodes.length)))
+      },
+      radial: {
+        type: "radial",
+        preventOverlap: true,
+        nodeSize: 32
+      },
+      concentric: {
+        type: "concentric",
+        preventOverlap: true,
+        nodeSize: 32
+      },
+      dagre: {
+        type: "dagre",
+        rankdir: "TB",
+        nodesep: 50,
+        ranksep: 80
+      }
+    };
+    graph = new import_g6.Graph({
+      animation: false,
+      container: containerEl,
+      width,
+      height,
+      autoFit: "view",
+      autoResize: true,
+      padding: 24,
+      data: {
+        nodes: nodeData,
+        edges: edgeData
+      },
+      layout: layoutConfig[layout] || layoutConfig.force,
+      node: {
+        style: {
+          labelPlacement: "bottom",
+          labelMaxWidth: 100
+        }
+      },
+      behaviors: ["drag-canvas", "drag-element", "click-select"],
+      plugins: title ? [{ key: "title", type: "title", title, titleFill: isDark ? "#e0e6ed" : "#1a1a2e" }] : []
+    });
+    graph.render();
+  };
+  const destroy = () => {
+    if (graph) {
+      graph.destroy();
+      graph = null;
+    }
+  };
+  const zoomTo = (zoom) => {
+    if (graph) {
+      graph.zoomTo(zoom);
+    }
+  };
+  const getZoom = () => {
+    if (graph) {
+      return graph.getZoom();
+    }
+    return 1;
+  };
+  return {
+    render,
+    destroy,
+    zoomTo,
+    getZoom
+  };
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  NetworkGraph
+});

package/dist/cjs/vis/organization-chart/index.d.ts

@@ -0,0 +1,64 @@
+import type { TreeGraphData, VisualizationOptions } from '../../types';
+export type OrganizationChartData = TreeGraphData;
+/**
+ * OrganizationChartConfig defines the configuration for rendering the organization chart.
+ */
+export interface OrganizationChartConfig {
+    type?: 'organization-chart';
+    data: OrganizationChartData;
+    theme?: 'default' | 'academy' | 'dark';
+    title?: string;
+    style?: {
+        backgroundColor?: string;
+        palette?: string[];
+    };
+}
+/**
+ * OrganizationChartInstance represents a chart instance with render and destroy methods.
+ */
+export interface OrganizationChartInstance {
+    render: (config: OrganizationChartConfig) => void;
+    destroy: () => void;
+    zoomTo: (zoom: number) => void;
+    getZoom: () => number | undefined;
+}
+/**
+ * OrganizationChart component using G6 5.0.
+ * - dagre (TB) layout for hierarchical structure
+ * - custom rect node with name + description labels
+ * - depth-based color cycling
+ *
+ * @example
+ * ```ts
+ * const chart = OrganizationChart({ container: '#container', width: 600, height: 400 });
+ *
+ * chart.render({
+ *   type: 'organization-chart',
+ *   data: {
+ *     name: 'Alice Johnson',
+ *     description: 'Chief Technology Officer',
+ *     children: [
+ *       {
+ *         name: 'Bob Smith',
+ *         description: 'Senior Software Engineer',
+ *         children: [
+ *           { name: 'Charlie Brown', description: 'Software Engineer' },
+ *           { name: 'Diana White',   description: 'Software Engineer' },
+ *         ],
+ *       },
+ *       {
+ *         name: 'Eve Black',
+ *         description: 'IT Support Department Head',
+ *         children: [
+ *           { name: 'Frank Green', description: 'IT Support Specialist' },
+ *           { name: 'Grace Blue',  description: 'IT Support Specialist' },
+ *         ],
+ *       },
+ *     ],
+ *   },
+ * });
+ *
+ * chart.destroy();
+ * ```
+ */
+export declare const OrganizationChart: (options: VisualizationOptions) => OrganizationChartInstance;

package/dist/cjs/vis/organization-chart/index.js

@@ -0,0 +1,191 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/vis/organization-chart/index.ts
+var organization_chart_exports = {};
+__export(organization_chart_exports, {
+  OrganizationChart: () => OrganizationChart
+});
+module.exports = __toCommonJS(organization_chart_exports);
+var import_g6 = require("@antv/g6");
+var import_theme = require("../../util/theme");
+var NODE_WIDTH = 160;
+var NODE_HEIGHT_WITH_DESC = 72;
+var NODE_HEIGHT_NO_DESC = 40;
+var FONT_FAMILY = "system-ui,-apple-system,BlinkMacSystemFont,sans-serif";
+var LABEL_MAX_WIDTH = NODE_WIDTH - 16;
+function flattenTree(node, depth, pathId, nodes, edges) {
+  nodes.push({ id: pathId, name: node.name, description: node.description, depth });
+  (node.children ?? []).forEach((child, index) => {
+    const childId = `${pathId}_${index}`;
+    edges.push({ source: pathId, target: childId });
+    flattenTree(child, depth + 1, childId, nodes, edges);
+  });
+}
+var OrganizationChart = (options) => {
+  const { container, width, height, theme: chartTheme = "default" } = options;
+  let graph = null;
+  const render = (config) => {
+    const { data, theme = chartTheme, title, style = {} } = config;
+    if (!data || !data.name) {
+      throw new Error("OrganizationChart: data with a name field is required");
+    }
+    if (graph) {
+      graph.destroy();
+      graph = null;
+    }
+    const containerEl = typeof container === "string" ? document.querySelector(container) : container;
+    if (!containerEl) {
+      throw new Error("OrganizationChart: container element not found");
+    }
+    containerEl.innerHTML = "";
+    const colors = (0, import_theme.normalizePalette)(style.palette, theme);
+    const backgroundColor = style.backgroundColor || (0, import_theme.getBackgroundColor)(theme);
+    const isDark = theme === "dark";
+    containerEl.style.background = backgroundColor;
+    containerEl.style.borderRadius = "4px";
+    containerEl.style.overflow = "hidden";
+    const flatNodes = [];
+    const flatEdges = [];
+    flattenTree(data, 0, "0", flatNodes, flatEdges);
+    const nodeData = flatNodes.map((node) => ({
+      id: node.id,
+      data: {
+        name: node.name,
+        description: node.description,
+        depth: node.depth
+      }
+    }));
+    const edgeData = flatEdges.map((edge) => ({
+      id: `e__${edge.source}__${edge.target}`,
+      source: edge.source,
+      target: edge.target
+    }));
+    graph = new import_g6.Graph({
+      animation: false,
+      container: containerEl,
+      width,
+      height,
+      autoFit: "view",
+      autoResize: true,
+      padding: 24,
+      data: { nodes: nodeData, edges: edgeData },
+      plugins: [
+        {
+          type: "tooltip",
+          trigger: "hover",
+          enable: (e) => (e == null ? void 0 : e.targetType) === "node",
+          offset: [10, 10],
+          getContent: (e, items) => {
+            const item = items == null ? void 0 : items[0];
+            const biz = item == null ? void 0 : item.data;
+            if (!biz)
+              return "";
+            const name = escapeHtml(String(biz.name ?? ""));
+            const desc = biz.description ? escapeHtml(String(biz.description)) : "";
+            return `
+              <div style="max-width:260px;font-family:${FONT_FAMILY};">
+                <div style="font-weight:700;font-size:12px;line-height:1.2;margin-bottom:${desc ? "4px" : "0"};">
+                  ${name}
+                </div>
+                ${desc ? `<div style="font-size:12px;line-height:1.35;opacity:${isDark ? "0.86" : "0.78"};">${desc}</div>` : ""}
+              </div>
+            `;
+          },
+          style: {
+            ".tooltip": {
+              background: isDark ? "rgba(20,20,20,0.92)" : "rgba(255,255,255,0.96)",
+              color: isDark ? "#f2f2f2" : "#1f1f1f",
+              border: `1px solid ${isDark ? "rgba(255,255,255,0.12)" : "rgba(0,0,0,0.10)"}`,
+              borderRadius: 8,
+              boxShadow: "0 12px 28px rgba(0,0,0,0.16)",
+              padding: "8px 10px",
+              pointerEvents: "none"
+            }
+          }
+        },
+        ...title ? [{ key: "title", type: "title", title, titleFill: isDark ? "#e0e6ed" : "#1a1a2e" }] : []
+      ],
+      node: {
+        type: "rect",
+        style: {
+          // size: [width, height] is the correct API for rect nodes in G6 v5
+          size: (d) => [
+            NODE_WIDTH,
+            d.data.description ? NODE_HEIGHT_WITH_DESC : NODE_HEIGHT_NO_DESC
+          ],
+          fill: (d) => colors[d.data.depth % colors.length],
+          stroke: isDark ? "#555" : "#e8ebf0",
+          lineWidth: 1,
+          radius: 8,
+          // Use official label wrapping/ellipsis for BOTH name & description.
+          // 1 line name + up to 2 lines description => total maxLines = 3.
+          labelText: (d) => d.data.description ? `${d.data.name}
+${d.data.description}` : d.data.name,
+          labelFill: "#ffffff",
+          labelFontSize: 12,
+          labelFontWeight: 600,
+          labelWordWrap: true,
+          labelWordWrapWidth: LABEL_MAX_WIDTH,
+          labelMaxLines: (d) => d.data.description ? 3 : 1,
+          labelLineHeight: 14,
+          labelPlacement: "center"
+        }
+      },
+      edge: {
+        // Use a tree-friendly edge type that does not depend on node ports.
+        type: "cubic-vertical",
+        style: {
+          stroke: isDark ? "#4a4a4a" : "#d0d7e0",
+          lineWidth: 1.5,
+          endArrow: false,
+          startArrow: false
+        }
+      },
+      layout: {
+        type: "dagre",
+        rankdir: "TB",
+        nodesep: 40,
+        ranksep: 60,
+        // Dynamic nodeSize lets dagre calculate accurate per-node spacing
+        nodeSize: (d) => [NODE_WIDTH, d.data.description ? NODE_HEIGHT_WITH_DESC : NODE_HEIGHT_NO_DESC]
+      },
+      behaviors: ["drag-canvas"]
+    });
+    graph.render();
+  };
+  const destroy = () => {
+    if (graph) {
+      graph.destroy();
+      graph = null;
+    }
+  };
+  return {
+    render,
+    destroy,
+    zoomTo: (zoom) => graph == null ? void 0 : graph.zoomTo(zoom),
+    getZoom: () => graph == null ? void 0 : graph.getZoom()
+  };
+};
+function escapeHtml(input) {
+  return String(input).replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;").replaceAll('"', "&quot;").replaceAll("'", "&#039;");
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  OrganizationChart
+});