.gitignore

@@ -1,4 +0,0 @@
-node_modules/
-dist/
-test-results/
-.DS_Store

.npmrc

@@ -1 +0,0 @@
-//registry.npmjs.org/:_authToken=${NODE_AUTH_TOKEN}

CHANGELOG.md

@@ -1,10 +1,5 @@
 # CHANGELOG
 
-## v1.0.2 (2026-06-12)
-- **架构对齐**: 遵循 `base` 包新设计，彻底消灭用户侧 ESM 强依赖。
-- **组件注册**: 支持 `<Mindmap>` 全局组件声明式用法。
-- **构建优化**: 产物调整为纯 UMD 模式，通过 `globalThis.Mindmap` 暴露 API。
-
 ## v1.0.0 (2026-05-29)
 - 初始化项目架构。
 - 实现基础渲染占位。

README.md

@@ -1,55 +1,44 @@
-# @apigo.cc/mindmap API 手册
+# @web/mindmap
 
-原生 JS 编写的思维导图引擎。支持无限层级、缩放平移、节点折叠及动态增删。
+类 Xmind 体验的思维导图引擎，专注于展示逻辑分支。
 
----
+## 特性
+- 原生 ESM 驱动，无需构建即可在浏览器中使用。
+- 支持自动布局算法。
+- 高性能 SVG/DOM 渲染（1000+ 节点渲染耗时 < 50ms）。
+- 支持节点的展开与折叠。
+- 支持画布平移与缩放。
 
-## 1. 引入方式 (UMD 优先)
+## 安装与使用
+本模块不发布至 npmjs。请通过 `loader.js` 或 `importmap` 引入。
 
-```html
+### 使用示例
-<script src="https://cdn.jsdelivr.net/npm/@apigo.cc/mindmap@1.0.1/dist/mindmap.min.js"></script>
+```javascript
+import { Mindmap } from '@web/mindmap';
 
-<script>
+const mm = new Mindmap({
-    // 直接使用全局 Mindmap 类
+    container: document.getElementById('app'),
-    const mm = new Mindmap(config);
+    data: {
-</script>
+        text: '根节点',
+        children: [
+            { text: '子节点 1' },
+            { text: '子节点 2' }
+        ]
+    }
+});
 ```
 
----
+## API
-
-## 2. 核心用法
-
-### 组件化用法 (推荐)
-直接在 HTML 中使用 `<Mindmap>` 标签，通过 `state` 进行数据绑定。
-
-```html
-<div $data="{ 
-    myMind: { id: 'root', text: '根节点', children: [{ text: '子节点 1' }] }
-}">
-    <Mindmap $.state.data="myMind" style="height:500px"></Mindmap>
-</div>
-```
-
-### JS 调用方式 (兼容)
-...
----
-
-## 3. API 参考
-
 ### `new Mindmap(options)`
-- **`container`**: 挂载元素。
+- `options.container`: HTMLElement, 容器元素。
-- **`data`**: 格式为 `{ id, text, children, _collapsed }` 的对象。
+- `options.data`: Object, 树形数据结构。
-- **`nodeWidth / nodeHeight`**: 节点尺寸。
+- `options.nodeWidth`: Number, 节点宽度 (默认 120)。
-- **`hGap / vGap`**: 间距。
+- `options.nodeHeight`: Number, 节点高度 (默认 40)。
+- `options.hGap`: Number, 水平间距 (默认 60)。
+- `options.vGap`: Number, 垂直间距 (默认 20)。
 
-### 实例方法
+### `mm.addNode(parentId, text)`
-- **`addNode(parentId, text)`**: 动态添加节点。
+- 向指定 ID 或文本匹配的节点添加子节点。
-- **`removeNode(nodeId)`**: 动态删除节点。
-- **`render()`**: 强制重新布局与重绘。
 
----
+### `mm.removeNode(nodeId)`
-
+- 删除指定 ID 或文本匹配的节点。
-## 开发者提示 (AI 必读)
-1. **全局变量**: UMD 模式下，`Mindmap` 类自动挂载到 `window`。
-2. **唯一 ID**: 每个节点必须拥有全局唯一的 `id`。
-3. **数据响应**: 修改 `mm.data` 属性后必须手动执行 `mm.render()`。

dist/mindmap.js

@@ -1,232 +1,205 @@
-(function(global, factory) {
+class Mindmap {
-  typeof exports === "object" && typeof module !== "undefined" ? factory(exports) : typeof define === "function" && define.amd ? define(["exports"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.ApigoMindmap = {}));
+  constructor(options = {}) {
-})(this, function(exports2) {
+    this.container = options.container;
-  "use strict";
+    this.data = options.data || { id: "root", text: "Root", children: [] };
-  class Mindmap {
+    this.nodeWidth = options.nodeWidth || 120;
-    constructor(options = {}) {
+    this.nodeHeight = options.nodeHeight || 40;
-      this.container = options.container;
+    this.hGap = options.hGap || 60;
-      this.data = options.data || { id: "root", text: "Root", children: [] };
+    this.vGap = options.vGap || 20;
-      this.nodeWidth = options.nodeWidth || 120;
+    this.nodes = [];
-      this.nodeHeight = options.nodeHeight || 40;
+    this.links = [];
-      this.hGap = options.hGap || 60;
+    this.init();
-      this.vGap = options.vGap || 20;
-      this.nodes = [];
-      this.links = [];
-      this.init();
-    }
-    init() {
-      if (!this.container) return;
-      this.container.style.position = "relative";
-      this.container.style.overflow = "hidden";
-      this.container.style.backgroundColor = "#f5f5f5";
-      this.viewport = document.createElement("div");
-      this.viewport.style.position = "absolute";
-      this.viewport.style.width = "10000px";
-      this.viewport.style.height = "10000px";
-      this.viewport.style.transformOrigin = "0 0";
-      this.container.appendChild(this.viewport);
-      this.scale = 1;
-      this.offsetX = this.container.clientWidth / 2 - 100;
-      this.offsetY = this.container.clientHeight / 2 - 50;
-      this.svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
-      this.svg.style.position = "absolute";
-      this.svg.style.top = "0";
-      this.svg.style.left = "0";
-      this.svg.style.width = "100%";
-      this.svg.style.height = "100%";
-      this.svg.style.pointerEvents = "none";
-      this.viewport.appendChild(this.svg);
-      this.initEvents();
-      this.updateViewport();
-      this.render();
-    }
-    initEvents() {
-      let isDragging = false;
-      let lastX, lastY;
-      this.container.onmousedown = (e) => {
-        if (e.target.classList.contains("mindmap-node")) return;
-        isDragging = true;
-        lastX = e.clientX;
-        lastY = e.clientY;
-      };
-      window.onmousemove = (e) => {
-        if (!isDragging) return;
-        this.offsetX += e.clientX - lastX;
-        this.offsetY += e.clientY - lastY;
-        lastX = e.clientX;
-        lastY = e.clientY;
-        this.updateViewport();
-      };
-      window.onmouseup = () => {
-        isDragging = false;
-      };
-      this.container.onwheel = (e) => {
-        e.preventDefault();
-        const delta = e.deltaY > 0 ? 0.9 : 1.1;
-        const newScale = this.scale * delta;
-        if (newScale < 0.1 || newScale > 5) return;
-        const rect = this.container.getBoundingClientRect();
-        const mouseX = e.clientX - rect.left;
-        const mouseY = e.clientY - rect.top;
-        this.offsetX = mouseX - (mouseX - this.offsetX) * delta;
-        this.offsetY = mouseY - (mouseY - this.offsetY) * delta;
-        this.scale = newScale;
-        this.updateViewport();
-      };
-    }
-    updateViewport() {
-      this.viewport.style.transform = `translate(${this.offsetX}px, ${this.offsetY}px) scale(${this.scale})`;
-    }
-    layout() {
-      this.nodes = [];
-      this.links = [];
-      const compute = (node, x, startY) => {
-        const isCollapsed = node._collapsed;
-        const childrenHeight = node.children && node.children.length > 0 && !isCollapsed ? node.children.reduce((acc, child) => acc + this.getTotalHeight(child), 0) : this.nodeHeight;
-        const y = startY + childrenHeight / 2 - this.nodeHeight / 2;
-        const nodeInfo = {
-          x,
-          y,
-          text: node.text,
-          id: node.id || Math.random().toString(36).substr(2, 9),
-          raw: node
-        };
-        this.nodes.push(nodeInfo);
-        if (node.children && !isCollapsed) {
-          let currentY = startY;
-          node.children.forEach((child) => {
-            const childInfo = compute(child, x + this.nodeWidth + this.hGap, currentY);
-            this.links.push({
-              x1: x + this.nodeWidth,
-              y1: y + this.nodeHeight / 2,
-              x2: childInfo.x,
-              y2: childInfo.y + this.nodeHeight / 2
-            });
-            currentY += this.getTotalHeight(child);
-          });
-        }
-        return nodeInfo;
-      };
-      compute(this.data, 0, 0);
-    }
-    getTotalHeight(node) {
-      if (!node.children || node.children.length === 0 || node._collapsed) {
-        return this.nodeHeight + this.vGap;
-      }
-      return node.children.reduce((acc, child) => acc + this.getTotalHeight(child), 0);
-    }
-    render() {
-      this.layout();
-      this.svg.innerHTML = "";
-      const existingNodes = this.viewport.querySelectorAll(".mindmap-node");
-      existingNodes.forEach((n) => n.remove());
-      this.links.forEach((link) => {
-        const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
-        const d = `M ${link.x1} ${link.y1} C ${link.x1 + this.hGap / 2} ${link.y1}, ${link.x2 - this.hGap / 2} ${link.y2}, ${link.x2} ${link.y2}`;
-        path.setAttribute("d", d);
-        path.setAttribute("stroke", "#4A90E2");
-        path.setAttribute("fill", "none");
-        path.setAttribute("stroke-width", "2");
-        this.svg.appendChild(path);
-      });
-      this.nodes.forEach((node) => {
-        const el = document.createElement("div");
-        el.className = "mindmap-node";
-        if (node.raw._collapsed) el.classList.add("collapsed");
-        el.style.position = "absolute";
-        el.style.left = `${node.x}px`;
-        el.style.top = `${node.y}px`;
-        el.style.width = `${this.nodeWidth}px`;
-        el.style.height = `${this.nodeHeight}px`;
-        el.style.border = "2px solid #4A90E2";
-        el.style.borderRadius = "8px";
-        el.style.backgroundColor = "#fff";
-        el.style.display = "flex";
-        el.style.alignItems = "center";
-        el.style.justifyContent = "center";
-        el.style.fontSize = "14px";
-        el.style.fontWeight = "bold";
-        el.style.color = "#333";
-        el.style.boxShadow = "0 4px 6px rgba(0,0,0,0.1)";
-        el.style.cursor = "pointer";
-        el.style.userSelect = "none";
-        el.style.transition = "transform 0.2s";
-        el.innerText = node.text;
-        if (node.raw._collapsed) {
-          el.style.backgroundColor = "#f0f0f0";
-          el.style.borderStyle = "dashed";
-        }
-        el.onmouseenter = () => el.style.transform = "scale(1.05)";
-        el.onmouseleave = () => el.style.transform = "scale(1)";
-        el.onclick = (e) => {
-          e.stopPropagation();
-          node.raw._collapsed = !node.raw._collapsed;
-          this.render();
-        };
-        this.viewport.appendChild(el);
-      });
-    }
-    addNode(parentId, text) {
-      const findAndAdd = (node) => {
-        if (node.id === parentId || node.text === parentId) {
-          if (!node.children) node.children = [];
-          node.children.push({ text, id: Math.random().toString(36).substr(2, 9) });
-          return true;
-        }
-        if (node.children) {
-          for (const child of node.children) {
-            if (findAndAdd(child)) return true;
-          }
-        }
-        return false;
-      };
-      findAndAdd(this.data);
-      this.render();
-    }
-    removeNode(nodeId) {
-      const remove = (node) => {
-        if (!node.children) return false;
-        const index = node.children.findIndex((child) => child.id === nodeId || child.text === nodeId);
-        if (index !== -1) {
-          node.children.splice(index, 1);
-          return true;
-        }
-        for (const child of node.children) {
-          if (remove(child)) return true;
-        }
-        return false;
-      };
-      if (this.data.id === nodeId || this.data.text === nodeId) {
-        console.warn("Cannot remove root node");
-        return;
-      }
-      remove(this.data);
-      this.render();
-    }
   }
-  if (typeof globalThis !== "undefined" && globalThis.Component) {
+  init() {
-    globalThis.Component.register("Mindmap", (container) => {
+    if (!this.container) return;
-      let mm = null;
+    this.container.style.position = "relative";
-      const init = () => {
+    this.container.style.overflow = "hidden";
-        container.innerHTML = "";
+    this.container.style.backgroundColor = "#f5f5f5";
-        mm = new Mindmap({
+    this.viewport = document.createElement("div");
-          container,
+    this.viewport.style.position = "absolute";
-          data: container.state.data,
+    this.viewport.style.width = "10000px";
-          nodeWidth: parseInt(container.getAttribute("node-width")) || 120,
+    this.viewport.style.height = "10000px";
-          nodeHeight: parseInt(container.getAttribute("node-height")) || 40,
+    this.viewport.style.transformOrigin = "0 0";
-          hGap: parseInt(container.getAttribute("h-gap")) || 60,
+    this.container.appendChild(this.viewport);
-          vGap: parseInt(container.getAttribute("v-gap")) || 20
+    this.scale = 1;
-        });
+    this.offsetX = this.container.clientWidth / 2 - 100;
-        container.mindmapInstance = mm;
+    this.offsetY = this.container.clientHeight / 2 - 50;
+    this.svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+    this.svg.style.position = "absolute";
+    this.svg.style.top = "0";
+    this.svg.style.left = "0";
+    this.svg.style.width = "100%";
+    this.svg.style.height = "100%";
+    this.svg.style.pointerEvents = "none";
+    this.viewport.appendChild(this.svg);
+    this.initEvents();
+    this.updateViewport();
+    this.render();
+  }
+  initEvents() {
+    let isDragging = false;
+    let lastX, lastY;
+    this.container.onmousedown = (e) => {
+      if (e.target.classList.contains("mindmap-node")) return;
+      isDragging = true;
+      lastX = e.clientX;
+      lastY = e.clientY;
+    };
+    window.onmousemove = (e) => {
+      if (!isDragging) return;
+      this.offsetX += e.clientX - lastX;
+      this.offsetY += e.clientY - lastY;
+      lastX = e.clientX;
+      lastY = e.clientY;
+      this.updateViewport();
+    };
+    window.onmouseup = () => {
+      isDragging = false;
+    };
+    this.container.onwheel = (e) => {
+      e.preventDefault();
+      const delta = e.deltaY > 0 ? 0.9 : 1.1;
+      const newScale = this.scale * delta;
+      if (newScale < 0.1 || newScale > 5) return;
+      const rect = this.container.getBoundingClientRect();
+      const mouseX = e.clientX - rect.left;
+      const mouseY = e.clientY - rect.top;
+      this.offsetX = mouseX - (mouseX - this.offsetX) * delta;
+      this.offsetY = mouseY - (mouseY - this.offsetY) * delta;
+      this.scale = newScale;
+      this.updateViewport();
+    };
+  }
+  updateViewport() {
+    this.viewport.style.transform = `translate(${this.offsetX}px, ${this.offsetY}px) scale(${this.scale})`;
+  }
+  layout() {
+    this.nodes = [];
+    this.links = [];
+    const compute = (node, x, startY) => {
+      const isCollapsed = node._collapsed;
+      const childrenHeight = node.children && node.children.length > 0 && !isCollapsed ? node.children.reduce((acc, child) => acc + this.getTotalHeight(child), 0) : this.nodeHeight;
+      const y = startY + childrenHeight / 2 - this.nodeHeight / 2;
+      const nodeInfo = {
+        x,
+        y,
+        text: node.text,
+        id: node.id || Math.random().toString(36).substr(2, 9),
+        raw: node
       };
-      container.state.__watch("data", (val) => mm ? (mm.data = val, mm.render()) : init());
+      this.nodes.push(nodeInfo);
-      init();
+      if (node.children && !isCollapsed) {
-      container.addEventListener("unload", () => mm = null);
+        let currentY = startY;
+        node.children.forEach((child) => {
+          const childInfo = compute(child, x + this.nodeWidth + this.hGap, currentY);
+          this.links.push({
+            x1: x + this.nodeWidth,
+            y1: y + this.nodeHeight / 2,
+            x2: childInfo.x,
+            y2: childInfo.y + this.nodeHeight / 2
+          });
+          currentY += this.getTotalHeight(child);
+        });
+      }
+      return nodeInfo;
+    };
+    compute(this.data, 0, 0);
+  }
+  getTotalHeight(node) {
+    if (!node.children || node.children.length === 0 || node._collapsed) {
+      return this.nodeHeight + this.vGap;
+    }
+    return node.children.reduce((acc, child) => acc + this.getTotalHeight(child), 0);
+  }
+  render() {
+    this.layout();
+    this.svg.innerHTML = "";
+    const existingNodes = this.viewport.querySelectorAll(".mindmap-node");
+    existingNodes.forEach((n) => n.remove());
+    this.links.forEach((link) => {
+      const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
+      const d = `M ${link.x1} ${link.y1} C ${link.x1 + this.hGap / 2} ${link.y1}, ${link.x2 - this.hGap / 2} ${link.y2}, ${link.x2} ${link.y2}`;
+      path.setAttribute("d", d);
+      path.setAttribute("stroke", "#4A90E2");
+      path.setAttribute("fill", "none");
+      path.setAttribute("stroke-width", "2");
+      this.svg.appendChild(path);
+    });
+    this.nodes.forEach((node) => {
+      const el = document.createElement("div");
+      el.className = "mindmap-node";
+      if (node.raw._collapsed) el.classList.add("collapsed");
+      el.style.position = "absolute";
+      el.style.left = `${node.x}px`;
+      el.style.top = `${node.y}px`;
+      el.style.width = `${this.nodeWidth}px`;
+      el.style.height = `${this.nodeHeight}px`;
+      el.style.border = "2px solid #4A90E2";
+      el.style.borderRadius = "8px";
+      el.style.backgroundColor = "#fff";
+      el.style.display = "flex";
+      el.style.alignItems = "center";
+      el.style.justifyContent = "center";
+      el.style.fontSize = "14px";
+      el.style.fontWeight = "bold";
+      el.style.color = "#333";
+      el.style.boxShadow = "0 4px 6px rgba(0,0,0,0.1)";
+      el.style.cursor = "pointer";
+      el.style.userSelect = "none";
+      el.style.transition = "transform 0.2s";
+      el.innerText = node.text;
+      if (node.raw._collapsed) {
+        el.style.backgroundColor = "#f0f0f0";
+        el.style.borderStyle = "dashed";
+      }
+      el.onmouseenter = () => el.style.transform = "scale(1.05)";
+      el.onmouseleave = () => el.style.transform = "scale(1)";
+      el.onclick = (e) => {
+        e.stopPropagation();
+        node.raw._collapsed = !node.raw._collapsed;
+        this.render();
+      };
+      this.viewport.appendChild(el);
     });
   }
-  if (typeof globalThis !== "undefined") {
+  addNode(parentId, text) {
-    globalThis.Mindmap = Mindmap;
+    const findAndAdd = (node) => {
+      if (node.id === parentId || node.text === parentId) {
+        if (!node.children) node.children = [];
+        node.children.push({ text, id: Math.random().toString(36).substr(2, 9) });
+        return true;
+      }
+      if (node.children) {
+        for (const child of node.children) {
+          if (findAndAdd(child)) return true;
+        }
+      }
+      return false;
+    };
+    findAndAdd(this.data);
+    this.render();
   }
-  exports2.Mindmap = Mindmap;
+  removeNode(nodeId) {
-  Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });
+    const remove = (node) => {
-});
+      if (!node.children) return false;
+      const index = node.children.findIndex((child) => child.id === nodeId || child.text === nodeId);
+      if (index !== -1) {
+        node.children.splice(index, 1);
+        return true;
+      }
+      for (const child of node.children) {
+        if (remove(child)) return true;
+      }
+      return false;
+    };
+    if (this.data.id === nodeId || this.data.text === nodeId) {
+      console.warn("Cannot remove root node");
+      return;
+    }
+    remove(this.data);
+    this.render();
+  }
+}
+export {
+  Mindmap
+};

mindmapTODO.md

@@ -1,15 +1,16 @@
-# mindmap TODO
+# mindmapTODO.md
 
-- [x] 架构对齐：Align with `base` project's "No ESM" design.
+## 当前版本
-- [ ] 构建配置：Modify `vite.config.js` to output only UMD (`mindmap.js` and `mindmap.min.js`).
+- Tag: v1.0.0
-- [ ] 源码重构：
+- 下一版本预期: v1.0.1
-    - [ ] 注册 `Mindmap` 为全局组件 (`globalThis.Component.register`).
-    - [ ] 确保 `Mindmap` 类在 `globalThis` 上可用。
-- [ ] 测试验证：运行 `npm test` 确保功能无损。
-- [ ] 文档更新：
-    - [ ] 更新 `package.json` 版本号。
-    - [ ] 更新 `README.md` 以反映组件化用法。
-    - [ ] 更新 `CHANGELOG.md`。
 
-## 当前状态 (v1.0.1)
+## 待办事项
-- 1111 个节点渲染耗时: ~40ms (from TEST.md)
+- [x] 实现树形数据的自动计算与布局。
+- [x] 支持节点的展开/折叠。
+- [x] 使用 SVG 绘制节点间的连接线。
+- [x] 优化大规模节点下的平移与缩放。
+- [x] 提供节点的动态增删 API。
+
+## 重构建议
+- 考虑引入 `@web/state` 管理节点状态。
+- 使用 Canvas 或高级 SVG 技术优化超大规模树渲染。

package-lock.json

@@ -1,11 +1,11 @@
 {
-	"name": "@apigo.cc/mindmap",
+	"name": "@web/mindmap",
 	"version": "1.0.0",
 	"lockfileVersion": 3,
 	"requires": true,
 	"packages": {
 		"": {
-			"name": "@apigo.cc/mindmap",
+			"name": "@web/mindmap",
 			"version": "1.0.0",
 			"devDependencies": {
 				"@playwright/test": "^1.40.0",

package.json

@@ -1,21 +1,21 @@
 {
-  "name": "@apigo.cc/mindmap",
+	"name": "@web/mindmap",
-  "version": "1.0.2",
+	"version": "1.0.0",
-  "type": "module",
+	"type": "module",
-  "main": "dist/mindmap.js",
+	"main": "dist/mindmap.js",
-  "files": [
+	"module": "dist/mindmap.js",
-    "dist"
+	"files": [
-  ],
+		"dist"
-  "scripts": {
+	],
-    "dev": "vite",
+	"scripts": {
-    "build": "vite build",
+		"dev": "vite",
-    "test": "playwright test",
+		"build": "vite build",
-    "pub": "node scripts/publish.js"
+		"test": "playwright test"
-  },
+	},
-  "devDependencies": {
+	"devDependencies": {
-    "@playwright/test": "^1.40.0",
+		"@playwright/test": "^1.40.0",
-    "@rollup/plugin-terser": "^1.0.0",
+		"@rollup/plugin-terser": "^1.0.0",
-    "terser": "^5.47.1",
+		"terser": "^5.47.1",
-    "vite": "^5.0.0"
+		"vite": "^5.0.0"
-  }
+	}
 }

scripts/publish.js

@@ -1,48 +0,0 @@
-import { execSync } from 'child_process';
-import fs from 'fs';
-import path from 'path';
-import { fileURLToPath } from 'url';
-
-const __dirname = path.dirname(fileURLToPath(import.meta.url));
-
-try {
-  // 1. 获取最新 tag
-  let tag;
-  try {
-    tag = execSync('git describe --tags --abbrev=0', { encoding: 'utf8' }).trim();
-  } catch (err) {
-    throw new Error('Failed to find git tags. Please make sure the repository has tags (e.g., v1.0.0) before publishing.');
-  }
-  // 去掉 v 前缀
-  const version = tag.startsWith('v') ? tag.slice(1) : tag;
-
-  console.log(`Latest git tag: ${tag}, Version to publish: ${version}`);
-
-  // 2. 读取并更新 package.json
-  const pkgPath = path.join(__dirname, '../package.json');
-  const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf8'));
-  
-  // 保持原有名称（如果已经带有 @apigo.cc/ 前缀）或替换前缀
-  if (!pkg.name.startsWith('@apigo.cc/')) {
-    const baseName = pkg.name.includes('/') ? pkg.name.split('/')[1] : pkg.name;
-    pkg.name = `@apigo.cc/${baseName}`;
-  }
-  pkg.version = version;
-
-  fs.writeFileSync(pkgPath, JSON.stringify(pkg, null, 2) + '\n');
-  console.log(`Updated package.json: name=${pkg.name}, version=${pkg.version}`);
-
-  // 3. 构建
-  console.log('Running build...');
-  execSync('npm run build', { stdio: 'inherit', cwd: path.join(__dirname, '..') });
-
-  // 4. 发布
-  console.log('Publishing to npm...');
-  const args = process.argv.slice(2).join(' ');
-  execSync(`npm publish --access public ${args}`, { stdio: 'inherit', cwd: path.join(__dirname, '..') });
-
-  console.log('Publish successful!');
-} catch (error) {
-  console.error('Publish failed:', error.message);
-  process.exit(1);
-}

src/index.js

@@ -1,5 +1,5 @@
 /**
- * @apigo.cc/mindmap
+ * @web/mindmap
  * 类 Xmind 体验的思维导图引擎
  */
 
@@ -245,33 +245,3 @@ export class Mindmap {
     this.render();
   }
 }
-
-// 注册为全局组件
-if (typeof globalThis !== 'undefined' && globalThis.Component) {
-    globalThis.Component.register('Mindmap', container => {
-        let mm = null;
-        const init = () => {
-            container.innerHTML = '';
-            mm = new Mindmap({
-                container,
-                data: container.state.data,
-                nodeWidth: parseInt(container.getAttribute('node-width')) || 120,
-                nodeHeight: parseInt(container.getAttribute('node-height')) || 40,
-                hGap: parseInt(container.getAttribute('h-gap')) || 60,
-                vGap: parseInt(container.getAttribute('v-gap')) || 20
-            });
-            container.mindmapInstance = mm;
-        };
-
-        container.state.__watch('data', (val) => mm ? (mm.data = val, mm.render()) : init());
-        
-        init();
-        
-        container.addEventListener('unload', () => mm = null);
-    });
-}
-
-// 挂载到全局
-if (typeof globalThis !== 'undefined') {
-    globalThis.Mindmap = Mindmap;
-}

test/index.html

@@ -10,9 +10,9 @@
     <script type="importmap">
     {
         "imports": {
-            "@apigo.cc/state": "../../state/src/index.js",
+            "@web/state": "../../state/src/index.js",
-            "@apigo.cc/base": "../../base/src/index.js",
+            "@web/base": "../../base/src/index.js",
-            "@apigo.cc/mindmap": "../src/index.js"
+            "@web/mindmap": "../src/index.js"
         }
     }
     </script>
@@ -22,7 +22,7 @@
     <div id="app"></div>
 
     <script type="module">
-        import { Mindmap } from '@apigo.cc/mindmap';
+        import { Mindmap } from '@web/mindmap';
         window.testExports = { Mindmap };
         
         const mm = new Mindmap({

vite.config.js

@@ -5,37 +5,33 @@ import terser from '@rollup/plugin-terser';
 export default defineConfig({
   resolve: {
     alias: {
-      '@apigo.cc/state': resolve(__dirname, '../state/src/index.js'),
+      '@web/state': resolve(__dirname, '../state/src/index.js'),
-      '@apigo.cc/base': resolve(__dirname, '../base/src/index.js'),
+      '@web/base': resolve(__dirname, '../base/src/index.js'),
-      '@apigo.cc/mindmap': resolve(__dirname, 'src/index.js')
+      '@web/mindmap': resolve(__dirname, 'src/index.js')
+    }
+  },
+  server: {
+    fs: {
+      allow: ['..']
     }
   },
   build: {
     lib: {
       entry: resolve(__dirname, 'src/index.js'),
-      name: 'ApigoMindmap',
+      name: 'Mindmap',
-      formats: ['umd']
+      formats: ['es']
     },
     rollupOptions: {
-      external: ['@apigo.cc/state', '@apigo.cc/base'],
+      external: ['@web/state', '@web/base'],
       output: [
         {
-          format: 'umd',
+          format: 'es',
-          name: 'ApigoMindmap',
           entryFileNames: 'mindmap.js',
-          globals: {
+          minifyInternalExports: false
-            '@apigo.cc/state': 'ApigoState',
-            '@apigo.cc/base': 'ApigoBase'
-          }
         },
         {
-          format: 'umd',
+          format: 'es',
-          name: 'ApigoMindmap',
           entryFileNames: 'mindmap.min.js',
-          globals: {
-            '@apigo.cc/state': 'ApigoState',
-            '@apigo.cc/base': 'ApigoBase'
-          },
           plugins: [terser()]
         }
       ]