drawui-core 0.1.0 → 0.2.1

package/dist/index.d.cts

@@ -14,7 +14,7 @@ interface ShapeStyle {
     strokeWidth: number;
     strokeDash: number[] | null;
 }
-type ShapeType = 'rectangle' | 'rounded-rectangle' | 'circle' | 'ellipse' | 'diamond' | 'triangle' | 'hexagon' | 'parallelogram' | 'trapezoid' | 'pentagon' | 'octagon' | 'star' | 'uml-class' | 'uml-interface' | 'line' | 'arrow' | 'text' | 'draw';
+type ShapeType = 'rectangle' | 'rounded-rectangle' | 'circle' | 'ellipse' | 'diamond' | 'triangle' | 'hexagon' | 'parallelogram' | 'trapezoid' | 'pentagon' | 'octagon' | 'star' | 'uml-class' | 'uml-interface' | 'mind-map' | 'line' | 'arrow' | 'text' | 'draw';
 interface BaseShape {
     id: string;
     type: ShapeType;
@@ -181,8 +181,29 @@ interface DrawShape extends BaseShape {
     type: 'draw';
     points: Vec2[];
 }
-type Shape = RectangleShape | RoundedRectangleShape | CircleShape | EllipseShape | DiamondShape | TriangleShape | HexagonShape | ParallelogramShape | TrapezoidShape | PentagonShape | OctagonShape | StarShape | UmlClassShape | UmlInterfaceShape | LineShape | ArrowShape | TextShape | DrawShape;
-type ToolType = 'select' | 'hand' | 'rectangle' | 'rounded-rectangle' | 'circle' | 'ellipse' | 'diamond' | 'triangle' | 'hexagon' | 'parallelogram' | 'trapezoid' | 'pentagon' | 'octagon' | 'star' | 'uml-class' | 'uml-interface' | 'line' | 'arrow' | 'text' | 'draw' | 'pen' | 'highlighter';
+/** 思维导图节点：可带子节点；颜色/图标/属性说明均可手动覆盖，默认取层级色 */
+interface MindMapNode {
+    id: string;
+    text: string;
+    /** 手动覆盖的节点颜色；不设置时按层级取默认色 */
+    color?: string;
+    /** 左侧图标（任意短文本/emoji），默认无 */
+    icon?: string;
+    /** 左上角属性说明，默认无 */
+    note?: string;
+    /** 说明标签颜色，默认与节点颜色一致 */
+    noteColor?: string;
+    collapsed?: boolean;
+    children?: MindMapNode[];
+}
+interface MindMapShape extends BaseShape {
+    type: 'mind-map';
+    width: number;
+    height: number;
+    root: MindMapNode;
+}
+type Shape = RectangleShape | RoundedRectangleShape | CircleShape | EllipseShape | DiamondShape | TriangleShape | HexagonShape | ParallelogramShape | TrapezoidShape | PentagonShape | OctagonShape | StarShape | UmlClassShape | UmlInterfaceShape | LineShape | ArrowShape | TextShape | DrawShape | MindMapShape;
+type ToolType = 'select' | 'hand' | 'rectangle' | 'rounded-rectangle' | 'circle' | 'ellipse' | 'diamond' | 'triangle' | 'hexagon' | 'parallelogram' | 'trapezoid' | 'pentagon' | 'octagon' | 'star' | 'uml-class' | 'uml-interface' | 'line' | 'arrow' | 'text' | 'draw' | 'pen' | 'highlighter' | 'eraser' | 'mind-map';
 interface CameraState {
     x: number;
     y: number;
@@ -194,6 +215,11 @@ interface EditorState {
     activeTool: ToolType;
     camera: CameraState;
 }
+/** 对外对接数据：图形 + 相机（用于 data 初始化 / onChange 回调 / getData） */
+interface EditorData {
+    shapes: Shape[];
+    camera: CameraState;
+}
 
 interface Mat2d {
     a: number;
@@ -240,6 +266,334 @@ declare class Camera {
     }, padding?: number): void;
 }
 
+/**
+ * 主题颜色常量 - 统一管理画布内渲染颜色
+ * 默认值在此定义；运行时通过 setTheme() 局部覆盖，修改后全局生效。
+ * React 侧主题色（CSS 变量 --dw-*）由 packages/react/src/theme.less 管理，
+ * CanvasBoard 的 themeColor 参数会同时写入两套主题源。
+ */
+interface DrawuiThemeSelection {
+    /** 选中边框颜色 */
+    outline: string;
+    /** 选中控制点边框颜色 */
+    handleStroke: string;
+    /** 选中控制点填充颜色 */
+    handleFill: string;
+    /** 选中区域填充颜色 (半透明) */
+    outlineFill: string;
+    /** 选中阴影颜色 */
+    shadow: string;
+}
+interface DrawuiTheme {
+    /** 主题主色（手柄/生成点等强调色） */
+    primary: string;
+    /** 选中态 */
+    selection: DrawuiThemeSelection;
+    /** 网格颜色 */
+    grid: string;
+    /** 默认文字颜色 */
+    text: string;
+    /** 文本编辑框边框 */
+    editBorder: string;
+    /** 框选矩形填充/描边 */
+    brushFill: string;
+    brushStroke: string;
+    /** 对齐参考线（浅色虚线） */
+    guide: string;
+    /** 连线选中高亮辅助线 */
+    lineHighlight: string;
+    /** 生成点位预览：源点圆点/虚线线条 */
+    genDot: string;
+    genLine: string;
+}
+/** 主题对象（同一引用，渲染器直接读取；setTheme 就地覆盖字段） */
+declare const THEME: DrawuiTheme;
+type ThemeListener = () => void;
+/** 订阅主题变化（如小地图等 canvas 组件需要据此重绘） */
+declare function subscribeTheme(listener: ThemeListener): () => void;
+/** 局部覆盖主题字段（selection 内字段单独合并） */
+declare function setTheme(theme: Partial<DrawuiTheme>): void;
+/** 获取当前主题（方便未来扩展为动态主题切换） */
+declare function getTheme(): DrawuiTheme;
+/** #rrggbb / #rgb → rgba(r, g, b, a)；解析失败原样返回 */
+declare function hexToRgba(hex: string, alpha: number): string;
+/** 颜色变暗/变亮：percent 负数变暗、正数变亮 */
+declare function shadeColor(hex: string, percent: number): string;
+
+/**
+ * 国际化：框架无关的轻量字典 + 语言切换。
+ * React 侧通过 useLanguage() 订阅语言变化自动重渲染。
+ */
+type Language = 'zh-CN' | 'en-US';
+declare const dictionaries: {
+    readonly 'zh-CN': {
+        readonly 'save.success': "已保存";
+        readonly 'save.fail': "保存失败";
+        readonly 'tool.select': "选择工具";
+        readonly 'tool.hand': "拖拽视口";
+        readonly 'tool.rectangle': "矩形";
+        readonly 'tool.rounded-rectangle': "圆角矩形";
+        readonly 'tool.circle': "圆形";
+        readonly 'tool.ellipse': "椭圆";
+        readonly 'tool.diamond': "菱形";
+        readonly 'tool.triangle': "三角形";
+        readonly 'tool.hexagon': "六边形";
+        readonly 'tool.parallelogram': "平行四边形";
+        readonly 'tool.trapezoid': "梯形";
+        readonly 'tool.pentagon': "五边形";
+        readonly 'tool.octagon': "八边形";
+        readonly 'tool.star': "星形";
+        readonly 'tool.uml-class': "UML 类图";
+        readonly 'tool.uml-interface': "UML 接口";
+        readonly 'tool.line': "直线";
+        readonly 'tool.arrow': "线条";
+        readonly 'tool.text': "文本";
+        readonly 'tool.draw': "画笔";
+        readonly 'tool.pen': "画笔";
+        readonly 'tool.highlighter': "荧光笔";
+        readonly 'tool.eraser': "橡皮擦";
+        readonly 'status.none': "未选择";
+        readonly 'status.selected': "已选择 {n} 个图形";
+        readonly 'toolbar.select': "选择 (V)";
+        readonly 'toolbar.hand': "拖拽视口 (H)";
+        readonly 'toolbar.shapes': "形状";
+        readonly 'toolbar.grid': "网格";
+        readonly 'toolbar.undo': "撤销 (Ctrl+Z)";
+        readonly 'toolbar.redo': "重做 (Ctrl+Shift+Z)";
+        readonly 'toolbar.arrow': "箭头";
+        readonly 'toolbar.text': "文本";
+        readonly 'toolbar.pen': "画笔";
+        readonly 'toolbar.highlighter': "荧光笔";
+        readonly 'toolbar.eraser': "橡皮擦";
+        readonly 'toolbar.uml-class': "UML 类图";
+        readonly 'toolbar.uml-interface': "UML 接口";
+        readonly 'zoom.in': "放大";
+        readonly 'zoom.out': "缩小";
+        readonly 'zoom.reset': "重置";
+        readonly 'style.stroke': "边框";
+        readonly 'style.fill': "填充";
+        readonly 'style.text': "文字";
+        readonly 'style.highlight': "高亮";
+        readonly 'style.none': "无";
+        readonly 'style.connection': "连线";
+        readonly 'style.arrow': "箭头";
+        readonly 'style.dashed': "虚线";
+        readonly 'style.solid': "实线";
+        readonly 'style.connection.straight': "直线";
+        readonly 'style.connection.polyline': "折线";
+        readonly 'style.connection.orthogonal': "直角折线";
+        readonly 'style.connection.curve': "曲线";
+        readonly 'style.arrowhead.none': "无箭头";
+        readonly 'style.arrowhead.end': "终点箭头";
+        readonly 'style.arrowhead.start': "起点箭头";
+        readonly 'style.arrowhead.both': "双箭头";
+        readonly 'style.arrowhead.inheritance': "继承";
+        readonly 'style.arrowhead.composition': "组合";
+        readonly 'style.arrowhead.aggregation': "聚合";
+        readonly 'menu.title': "选择新图形";
+        readonly 'menu.cancel': "点击空白处取消";
+        readonly 'shape.rectangle': "矩形";
+        readonly 'shape.rounded-rectangle': "圆角";
+        readonly 'shape.circle': "圆形";
+        readonly 'shape.ellipse': "椭圆";
+        readonly 'shape.diamond': "菱形";
+        readonly 'shape.triangle': "三角";
+        readonly 'shape.hexagon': "六边形";
+        readonly 'shape.parallelogram': "平行";
+        readonly 'shape.trapezoid': "梯形";
+        readonly 'shape.pentagon': "五边形";
+        readonly 'shape.octagon': "八边形";
+        readonly 'shape.star': "星形";
+        readonly 'shape.uml-class': "类图";
+        readonly 'shape.uml-interface': "接口";
+        readonly 'uml.drag': "拖拽排序";
+        readonly 'uml.delete': "删除该行";
+        readonly 'uml.textColor': "文字颜色";
+        readonly 'uml.defaultColor': "默认颜色";
+        readonly 'uml.fontSize': "字号";
+        readonly 'uml.strikethrough': "删除线";
+        readonly 'uml.attribute': "属性";
+        readonly 'uml.method': "方法";
+        readonly 'minimap.title': "小地图";
+        readonly 'minimap.expand': "展开小地图";
+        readonly 'minimap.collapse': "收起小地图";
+        readonly 'tool.mind-map': "思维导图";
+        readonly 'toolbar.mind-map': "思维导图";
+        readonly 'toolbar.export': "导出";
+        readonly 'toolbar.export.png': "PNG 图片";
+        readonly 'toolbar.export.svg': "SVG 矢量图";
+        readonly 'toolbar.export.pdf': "PDF 文档";
+        readonly 'shape.mind-map': "思维导图";
+        readonly 'mindmap.defaultRoot': "中心主题";
+        readonly 'mindmap.defaultBranch': "分支主题";
+        readonly 'mindmap.nodeText': "节点文本";
+        readonly 'mindmap.addChild': "子节点";
+        readonly 'mindmap.addSibling': "兄弟节点";
+        readonly 'mindmap.deleteNode': "删除节点";
+        readonly 'mindmap.color': "颜色";
+        readonly 'mindmap.levelColor': "默认层级色";
+        readonly 'mindmap.icon': "图标";
+        readonly 'mindmap.noIcon': "无图标";
+        readonly 'mindmap.note': "属性说明";
+        readonly 'mindmap.notePlaceholder': "说明内容（可选）";
+        readonly 'mindmap.noteColor': "说明颜色";
+        readonly 'mindmap.noteColorDefault': "同节点色";
+        readonly 'mindmap.collapse': "折叠";
+        readonly 'mindmap.expand': "展开";
+        readonly 'mindmap.close': "关闭编辑";
+        readonly 'mindmap.more': "更多设置";
+    };
+    readonly 'en-US': {
+        readonly 'save.success': "Saved";
+        readonly 'save.fail': "Save failed";
+        readonly 'tool.select': "Select tool";
+        readonly 'tool.hand': "Pan view";
+        readonly 'tool.rectangle': "Rectangle";
+        readonly 'tool.rounded-rectangle': "Rounded rectangle";
+        readonly 'tool.circle': "Circle";
+        readonly 'tool.ellipse': "Ellipse";
+        readonly 'tool.diamond': "Diamond";
+        readonly 'tool.triangle': "Triangle";
+        readonly 'tool.hexagon': "Hexagon";
+        readonly 'tool.parallelogram': "Parallelogram";
+        readonly 'tool.trapezoid': "Trapezoid";
+        readonly 'tool.pentagon': "Pentagon";
+        readonly 'tool.octagon': "Octagon";
+        readonly 'tool.star': "Star";
+        readonly 'tool.uml-class': "UML class";
+        readonly 'tool.uml-interface': "UML interface";
+        readonly 'tool.line': "Line";
+        readonly 'tool.arrow': "Line";
+        readonly 'tool.text': "Text";
+        readonly 'tool.draw': "Pen";
+        readonly 'tool.pen': "Pen";
+        readonly 'tool.highlighter': "Highlighter";
+        readonly 'tool.eraser': "Eraser";
+        readonly 'status.none': "Nothing selected";
+        readonly 'status.selected': "{n} shapes selected";
+        readonly 'toolbar.select': "Select (V)";
+        readonly 'toolbar.hand': "Pan view (H)";
+        readonly 'toolbar.shapes': "Shapes";
+        readonly 'toolbar.grid': "Grid";
+        readonly 'toolbar.undo': "Undo (Ctrl+Z)";
+        readonly 'toolbar.redo': "Redo (Ctrl+Shift+Z)";
+        readonly 'toolbar.arrow': "Arrow";
+        readonly 'toolbar.text': "Text";
+        readonly 'toolbar.pen': "Pen";
+        readonly 'toolbar.highlighter': "Highlighter";
+        readonly 'toolbar.eraser': "Eraser";
+        readonly 'toolbar.uml-class': "UML class";
+        readonly 'toolbar.uml-interface': "UML interface";
+        readonly 'zoom.in': "Zoom in";
+        readonly 'zoom.out': "Zoom out";
+        readonly 'zoom.reset': "Reset";
+        readonly 'style.stroke': "Border";
+        readonly 'style.fill': "Fill";
+        readonly 'style.text': "Text";
+        readonly 'style.highlight': "Highlight";
+        readonly 'style.none': "None";
+        readonly 'style.connection': "Connection";
+        readonly 'style.arrow': "Arrow head";
+        readonly 'style.dashed': "Dashed";
+        readonly 'style.solid': "Solid";
+        readonly 'style.connection.straight': "Straight";
+        readonly 'style.connection.polyline': "Polyline";
+        readonly 'style.connection.orthogonal': "Orthogonal";
+        readonly 'style.connection.curve': "Curve";
+        readonly 'style.arrowhead.none': "None";
+        readonly 'style.arrowhead.end': "End";
+        readonly 'style.arrowhead.start': "Start";
+        readonly 'style.arrowhead.both': "Both";
+        readonly 'style.arrowhead.inheritance': "Inheritance";
+        readonly 'style.arrowhead.composition': "Composition";
+        readonly 'style.arrowhead.aggregation': "Aggregation";
+        readonly 'menu.title': "Create shape";
+        readonly 'menu.cancel': "Click empty space to cancel";
+        readonly 'shape.rectangle': "Rectangle";
+        readonly 'shape.rounded-rectangle': "Rounded";
+        readonly 'shape.circle': "Circle";
+        readonly 'shape.ellipse': "Ellipse";
+        readonly 'shape.diamond': "Diamond";
+        readonly 'shape.triangle': "Triangle";
+        readonly 'shape.hexagon': "Hexagon";
+        readonly 'shape.parallelogram': "Parallelogram";
+        readonly 'shape.trapezoid': "Trapezoid";
+        readonly 'shape.pentagon': "Pentagon";
+        readonly 'shape.octagon': "Octagon";
+        readonly 'shape.star': "Star";
+        readonly 'shape.uml-class': "Class";
+        readonly 'shape.uml-interface': "Interface";
+        readonly 'uml.drag': "Drag to reorder";
+        readonly 'uml.delete': "Delete row";
+        readonly 'uml.textColor': "Text color";
+        readonly 'uml.defaultColor': "Default color";
+        readonly 'uml.fontSize': "Font size";
+        readonly 'uml.strikethrough': "Strikethrough";
+        readonly 'uml.attribute': "Attributes";
+        readonly 'uml.method': "Methods";
+        readonly 'minimap.title': "Minimap";
+        readonly 'minimap.expand': "Expand minimap";
+        readonly 'minimap.collapse': "Collapse minimap";
+        readonly 'tool.mind-map': "Mind map";
+        readonly 'toolbar.mind-map': "Mind map";
+        readonly 'toolbar.export': "Export";
+        readonly 'toolbar.export.png': "PNG image";
+        readonly 'toolbar.export.svg': "SVG vector";
+        readonly 'toolbar.export.pdf': "PDF document";
+        readonly 'shape.mind-map': "Mind map";
+        readonly 'mindmap.defaultRoot': "Central topic";
+        readonly 'mindmap.defaultBranch': "Branch topic";
+        readonly 'mindmap.nodeText': "Node text";
+        readonly 'mindmap.addChild': "Child";
+        readonly 'mindmap.addSibling': "Sibling";
+        readonly 'mindmap.deleteNode': "Delete node";
+        readonly 'mindmap.color': "Color";
+        readonly 'mindmap.levelColor': "Default level color";
+        readonly 'mindmap.icon': "Icon";
+        readonly 'mindmap.noIcon': "No icon";
+        readonly 'mindmap.note': "Note";
+        readonly 'mindmap.notePlaceholder': "Note content (optional)";
+        readonly 'mindmap.noteColor': "Note color";
+        readonly 'mindmap.noteColorDefault': "Same as node";
+        readonly 'mindmap.collapse': "Collapse";
+        readonly 'mindmap.expand': "Expand";
+        readonly 'mindmap.close': "Close editor";
+        readonly 'mindmap.more': "More settings";
+    };
+};
+type MessageKey = keyof typeof dictionaries['zh-CN'];
+type LanguageListener = () => void;
+declare function setLanguage(language: Language): void;
+declare function getLanguage(): Language;
+declare function subscribeLanguage(listener: LanguageListener): () => void;
+/** 取文案；{n} 等占位符由 params 替换 */
+declare function t(key: MessageKey, params?: Record<string, string | number>): string;
+
+type ExportFormat = 'png' | 'svg' | 'pdf';
+interface ExportOptions {
+    /** 输出缩放倍数（仅位图 PNG 生效，默认 2，矢量 SVG 始终无损） */
+    scale?: number;
+    /** 内容四周留白（页面坐标，默认 24） */
+    padding?: number;
+    /** 背景色，null = 透明；不传默认白色（'#ffffff'） */
+    background?: string | null;
+}
+/** 计算所有图形的并集包围盒（含留白），用于导出画布尺寸与视口 */
+declare function getContentBounds(shapes: Shape[], padding?: number): {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+};
+/** 把图形渲染到一张离屏 canvas（白底 / 指定缩放）并返回 */
+declare function renderToCanvas(shapes: Shape[], opts?: ExportOptions): HTMLCanvasElement;
+/** 生成完整 SVG 字符串（矢量，全部图形类型）。返回可直接保存为 .svg 的文本。 */
+declare function renderSVGString(shapes: Shape[], opts?: ExportOptions): string;
+/** 导出为 Blob（png/svg/pdf） */
+declare function exportToBlob(shapes: Shape[], format: ExportFormat, opts?: ExportOptions): Promise<Blob>;
+/** 浏览器端触发下载 */
+declare function downloadBlob(blob: Blob, fileName: string): void;
+
 type Listener = () => void;
 type NotificationListener = (message: string) => void;
 /** 核心 → React 的 UI 指令事件 */
@@ -251,6 +605,17 @@ type UiEvent = {
     existingArrowId?: string;
     defaultShapeType: ShapeType;
 };
+/** Editor 构造选项：主题色 / 语言 / 初始数据 / 本地持久化开关 */
+interface EditorOptions {
+    /** 画布渲染主题色等颜色，见 setTheme */
+    theme?: Partial<DrawuiTheme>;
+    /** 界面语言（默认 'zh-CN'） */
+    language?: Language;
+    /** 初始图形数据；提供后不再从 localStorage 加载 */
+    shapes?: Shape[];
+    /** 是否启用 localStorage 持久化（默认 true；提供 shapes 时自动关闭） */
+    persist?: boolean;
+}
 declare class Editor {
     private canvas;
     private renderer;
@@ -279,18 +644,26 @@ declare class Editor {
     private snapGuides;
     private connectingTargetId;
     private genPreview;
-    /** 拖动松开后待确认图形的上下文（配合"选择新图形"菜单） */
-    private pendingGen;
+    private eraserPoint;
+    private mindMapEditingShapeId;
+    private mindMapSelectedNode;
+    private mindMapHoverNode;
     private renderScheduled;
     private pointerIsDown;
     private notifyScheduled;
-    constructor(canvas: HTMLCanvasElement);
+    /** 是否启用 localStorage 持久化 */
+    private persist;
+    constructor(canvas: HTMLCanvasElement, options?: EditorOptions);
     private setupEventListeners;
     private handlePointerDown;
     private handlePointerMove;
     private handlePointerUp;
     /** 根据当前工具的命中结果更新鼠标样式（伸缩手柄↔/↕、拖拽 grabbing 等） */
     private updateCursor;
+    /**
+     * 滚轮：普通滚动平移视口（内容跟随常规滚动方向），
+     * Ctrl/Cmd + 滚轮以光标为中心缩放，Shift + 滚轮水平平移。
+     */
     private handleWheel;
     private handleKeyDown;
     private handleKeyUp;
@@ -359,6 +732,61 @@ declare class Editor {
     getSelectedUml(): UmlClassShape | UmlInterfaceShape | null;
     /** 按 id 查找 UML（类图或接口） */
     private getUmlById;
+    /** 获取选中的思维导图（恰好选中一个时） */
+    getSelectedMindMap(): MindMapShape | null;
+    /** 页面坐标下的思维导图节点命中：返回所在导图与节点 id */
+    getMindMapNodeAtPoint(point: Vec2): {
+        shapeId: string;
+        nodeId: string;
+    } | null;
+    /** 屏幕坐标（画布左上角为原点）下的思维导图节点命中 */
+    getMindMapNodeAtScreenPoint(screenPoint: Vec2): {
+        shapeId: string;
+        nodeId: string;
+    } | null;
+    /** 光标语义命中：仅节点框或折叠/展开标记内才命中（节点间空档不命中，避免空白处误显小手） */
+    getMindMapCursorHitAtPoint(point: Vec2): {
+        shapeId: string;
+        nodeId: string;
+    } | null;
+    /** 选中思维导图节点（不进入编辑态）：选中导图并定位节点高亮 */
+    selectMindMapNode(shapeId: string, nodeId: string): void;
+    /** 当前思维导图编辑态 id（null 表示未在编辑） */
+    getMindMapEditingShapeId(): string | null;
+    /** 当前选中的思维导图节点 */
+    getMindMapSelectedNode(): {
+        shapeId: string;
+        nodeId: string;
+    } | null;
+    /** 读取思维导图指定节点（只读引用，勿修改） */
+    getMindMapNode(shapeId: string, nodeId: string): MindMapNode | null;
+    /** 思维导图某节点在屏幕上的外框矩形（左上角坐标 + 尺寸），用于就地编辑定位 */
+    getMindMapNodeScreenRect(shapeId: string, nodeId: string): {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    } | null;
+    /** 页面坐标下折叠/展开标记的命中检测（返回所在导图与节点 id） */
+    getMindMapCollapseHitAtPoint(point: Vec2): {
+        shapeId: string;
+        nodeId: string;
+    } | null;
+    /** 进入思维导图编辑态（双击节点触发）：选中导图并定位到节点 */
+    beginMindMapEdit(shapeId: string, nodeId: string | null): void;
+    /** 退出思维导图编辑态 */
+    exitMindMapEdit(): void;
+    /** 更新思维导图某节点（文本/颜色/图标/说明等），自动重算布局尺寸。
+     *  commit=false 时仅应用变更、不写历史（就地文本编辑逐键调用用）；首个变更传入 commit=true 形成单个撤销点。 */
+    updateMindMapNode(shapeId: string, nodeId: string, patch: Partial<MindMapNode>, commit?: boolean): void;
+    /** 给指定节点添加一个子节点 */
+    addMindMapChild(shapeId: string, nodeId: string): void;
+    /** 给指定节点添加一个兄弟节点（根节点无兄弟） */
+    addMindMapSibling(shapeId: string, nodeId: string): void;
+    /** 删除指定节点（含子树）；删除根节点则移除整个思维导图 */
+    deleteMindMapNode(shapeId: string, nodeId: string): void;
+    /** 折叠/展开指定节点 */
+    toggleMindMapCollapse(shapeId: string, nodeId: string): void;
     /** 给指定 UML 类追加一条属性 */
     addUmlAttribute(shapeId: string): void;
     /** 给指定 UML（类图或接口）追加一条方法 */
@@ -393,10 +821,33 @@ declare class Editor {
     setActiveTool(tool: ToolType): void;
     getActiveTool(): ToolType;
     getShapes(): Shape[];
+    /** 导出当前数据（图形 + 相机），供外部保存/对接 */
+    getData(): EditorData;
+    /** 用外部数据整体替换画布内容（清空选择与历史），返回是否成功 */
+    setShapes(shapes: Shape[]): boolean;
+    /** 更新画布渲染主题色（选中态/手柄/网格等），立即重绘 */
+    setTheme(theme: Partial<DrawuiTheme>): void;
+    /** 切换界面语言（核心通知等文案；React 组件通过 useLanguage 自动刷新） */
+    setLanguage(language: Language): void;
     getSelectedIds(): string[];
     getCamera(): Camera;
     /** 指针是否处于按下状态（拖拽/画线/框选中） */
     isPointerDown(): boolean;
+    /** 当前画布内容的包围盒（世界坐标，含留白），导出时用于确定画布尺寸与视口 */
+    getContentBounds(padding?: number): {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    };
+    /**
+     * 导出当前画布为图片 Blob。
+     * @param format png | svg | pdf
+     * @param opts scale（PNG 倍率，默认 2）/ padding（四周留白）/ background（背景色，默认白色，null 透明）
+     */
+    exportImage(format: ExportFormat, opts?: ExportOptions): Promise<Blob>;
+    /** 导出并触发浏览器下载 */
+    downloadImage(fileName?: string, format?: ExportFormat, opts?: ExportOptions): Promise<void>;
     zoomIn(): void;
     zoomOut(): void;
     resetZoom(): void;
@@ -449,6 +900,12 @@ declare class Editor {
     private getShapeScreenBounds;
     getShapeAtScreenPoint(screenPoint: Vec2): Shape | null;
     getShapeAtPoint(point: Vec2, excludeId?: string): Shape | null;
+    /** 橡皮擦：返回与圆形笔刷相交的所有图形（不含线条的命中由其线段距离判定） */
+    getShapesInBrushRadius(point: Vec2, radius: number): Shape[];
+    private shapeIntersectsBrush;
+    /** 点到线段的最短距离 */
+    private pointToSegmentDist;
+    setEraserPoint(point: Vec2 | null): void;
     private isPointInShape;
     updateArrowBinding(arrowId: string, terminal: 'start' | 'end', targetShapeId: string | null, binding?: ArrowBinding): void;
     private getClosestHandle;
@@ -470,7 +927,7 @@ declare class Renderer {
     /** 文本排版缓存：避免每帧对每个字符做 measureText */
     private textLayoutCache;
     private static readonly TEXT_CACHE_LIMIT;
-    constructor(canvas: HTMLCanvasElement);
+    constructor(canvas: HTMLCanvasElement, dpr?: number);
     resize(width: number, height: number): void;
     setShowGrid(show: boolean): void;
     render(shapes: Shape[], camera: Camera, selectedIds: Set<string>, brushRect?: {
@@ -478,7 +935,17 @@ declare class Renderer {
         y: number;
         width: number;
         height: number;
-    } | null, snapGuides?: SnapGuide[], connectingTarget?: string | null, generationPreview?: GenerationPreview | null): void;
+    } | null, snapGuides?: SnapGuide[], connectingTarget?: string | null, generationPreview?: GenerationPreview | null, eraserPoint?: Vec2 | null, mindMapSelection?: {
+        shapeId: string;
+        nodeId: string;
+    } | null, mindMapHover?: {
+        shapeId: string;
+        nodeId: string;
+    } | null, 
+    /** 导出用：非 null 时先以该颜色铺满整块画布（白底等），默认不铺（透明） */
+    background?: string | null): void;
+    /** 橡皮擦：半透明主色圆 + 主色描边，半径与笔刷命中范围一致（屏幕像素恒定） */
+    private drawEraserBrush;
     /** 连接进行中，高亮目标图形四边中点的可连锚点 */
     private drawConnectingTargetHighlight;
     /** 世界坐标下的轴对齐包围盒（未考虑旋转） */
@@ -516,6 +983,15 @@ declare class Renderer {
     private static readonly CONNECTION_LEAD;
     /** 连接的源/目标图形作为障碍时使用的避让间距（足够阻挡中段折回穿过，又允许紧邻节点直连） */
     private static readonly CONNECTED_PAD;
+    /**
+     * 思维导图：先画连线（父右缘 → 子左缘的平滑曲线），再画节点
+     * （白底圆角矩形 + 层级色描边 + 图标/文本/左上角属性说明/折叠标记）。
+     */
+    private drawMindMap;
+    private drawMindMapConnections;
+    private drawMindMapNodes;
+    /** 按像素宽度截断文本并加省略号 */
+    private ellipsizeText;
     private drawLine;
     private drawArrow;
     /** 选中连线 → 在线条上叠加一条高亮辅助线 */
@@ -651,6 +1127,10 @@ interface ToolContext {
     panBy(dx: number, dy: number): void;
     setCameraPosition(x: number, y: number): void;
     getShapeAtPoint(point: Vec2, excludeId?: string): Shape | null;
+    /** 返回与圆形笔刷（圆心 point、半径 radius，世界单位）相交的所有图形，橡皮擦用 */
+    getShapesInBrushRadius(point: Vec2, radius: number): Shape[];
+    /** 设置橡皮擦笔刷位置（画布绘制指示圈；null 清除） */
+    setEraserPoint(point: Vec2 | null): void;
     updateArrowBinding(arrowId: string, terminal: 'start' | 'end', targetShapeId: string | null, binding?: ArrowBinding): void;
     enterEditing(shapeId: string): void;
     exitEditing(): void;
@@ -681,6 +1161,13 @@ interface ToolContext {
         highlightColor?: string;
     }): void;
     updateConnectionType(connectionType: ConnectionType): void;
+    /** 光标语义命中：思维导图节点框或折叠标记内才命中（节点间空档不命中） */
+    getMindMapCursorHitAtPoint(point: Vec2): {
+        shapeId: string;
+        nodeId: string;
+    } | null;
+    /** 选中思维导图节点（不进入编辑态） */
+    selectMindMapNode(shapeId: string, nodeId: string): void;
 }
 declare abstract class Tool {
     abstract type: ToolType;
@@ -758,7 +1245,6 @@ declare class SelectTool extends Tool {
     /** 生成拖动：更新预览（线条 + 框）与目标高亮 */
     private handleGenerating;
     private handleRotating;
-    private edgeMidpointWorld;
     /** 根据绑定信息返回目标图形的实际吸附点 */
     private bindingPosition;
     private isPointInShape;
@@ -840,7 +1326,7 @@ declare class ShapeTool extends Tool {
     onPointerUp(_point: Vec2, _event: PointerEvent): void;
     onKeyDown(_event: KeyboardEvent): void;
     onKeyUp(_event: KeyboardEvent): void;
-    getCursor(): string | null;
+    getCursor(point: Vec2): string | null;
 }
 
 declare class LineTool extends Tool {
@@ -905,44 +1391,42 @@ declare class ArrowTool extends Tool {
     private getCircleBindingPosition;
 }
 
+/** 不同层级节点的默认颜色，超过 6 层后循环复用 */
+declare const MINDMAP_COLORS: string[];
+declare const MINDMAP_FONT_SIZE = 14;
+declare const MINDMAP_NODE_HEIGHT = 40;
+declare const MINDMAP_MIN_WIDTH = 80;
+declare const MINDMAP_MAX_WIDTH = 240;
+interface MindMapNodePos {
+    x: number;
+    y: number;
+    depth: number;
+    width: number;
+    height: number;
+}
+interface MindMapLayoutResult {
+    positions: Map<string, MindMapNodePos>;
+    width: number;
+    height: number;
+}
+/** 节点颜色：手动设置优先，否则按层级取默认色 */
+declare function mindMapNodeColor(node: MindMapNode, depth: number): string;
+/** 节点框尺寸：由文本长度决定（CJK 按全宽估算），图标占位额外加宽 */
+declare function mindMapNodeSize(node: MindMapNode): {
+    width: number;
+    height: number;
+};
+/** 深拷贝节点树（撤销/重做快照用） */
+declare function cloneMindMapNode(node: MindMapNode): MindMapNode;
+declare function findMindMapNode(root: MindMapNode, nodeId: string): MindMapNode | null;
+declare function getMindMapNodeDepth(root: MindMapNode, nodeId: string): number;
+declare function getMindMapParent(root: MindMapNode, nodeId: string): MindMapNode | null;
+declare function countMindMapNodes(root: MindMapNode): number;
 /**
- * 主题颜色常量 - 统一管理所有 UI 颜色
- * 修改此处即可全局生效
+ * 横向树布局：根在左，子节点向右展开，每个节点垂直居中于其子树。
+ * 返回以内容包围盒中心为原点的局部坐标（shape.x/y 即该中心），
+ * 便于复用现有选中框/旋转/命中检测逻辑。
  */
-declare const THEME: {
-    readonly selection: {
-        /** 选中边框颜色 */
-        readonly outline: "#3b82f6";
-        /** 选中控制点边框颜色 */
-        readonly handleStroke: "#3b82f6";
-        /** 选中控制点填充颜色 */
-        readonly handleFill: "#ffffff";
-        /** 选中区域填充颜色 (半透明) */
-        readonly outlineFill: "rgba(59, 130, 246, 0.1)";
-        /** 选中阴影颜色 */
-        readonly shadow: "#3b82f6";
-    };
-    readonly grid: "#e5e7eb";
-    readonly text: "#1f2937";
-    readonly editBorder: "#3b82f6";
-};
-/** 获取当前主题（方便未来扩展为动态主题切换） */
-declare function getTheme(): {
-    readonly selection: {
-        /** 选中边框颜色 */
-        readonly outline: "#3b82f6";
-        /** 选中控制点边框颜色 */
-        readonly handleStroke: "#3b82f6";
-        /** 选中控制点填充颜色 */
-        readonly handleFill: "#ffffff";
-        /** 选中区域填充颜色 (半透明) */
-        readonly outlineFill: "rgba(59, 130, 246, 0.1)";
-        /** 选中阴影颜色 */
-        readonly shadow: "#3b82f6";
-    };
-    readonly grid: "#e5e7eb";
-    readonly text: "#1f2937";
-    readonly editBorder: "#3b82f6";
-};
+declare function layoutMindMap(root: MindMapNode): MindMapLayoutResult;
 
-export { type ArrowBinding, type ArrowHeadType, type ArrowShape, ArrowTool, Camera, type CameraState, type CircleShape, type ConnectionType, type DiamondShape, type DrawShape, Editor, type EditorState, type EllipseShape, type FreehandMode, FreehandTool, type GenerationContext, HandTool, type HexagonShape, type LineShape, LineTool, Mat2d, type OctagonShape, type ParallelogramShape, type PentagonShape, type Rect, type RectangleShape, Renderer, type RoundedRectangleShape, SelectTool, type Shape, type ShapeStyle, ShapeTool, type ShapeType, type SnapGuide, type StarShape, THEME, type TextShape, type ToolType, type TrapezoidShape, type TriangleShape, UML_FONT_SIZE, UML_HEADER_HEIGHT, UML_LINE_HEIGHT, UML_MIN_WIDTH, UML_PADDING_X, UML_PADDING_Y, type UmlAttribute, type UmlClassShape, type UmlInterfaceShape, type UmlMethod, type UmlVisibility, Vec, type Vec2 as Vec2Type, calcUmlClassSize, getTheme };
+export { type ArrowBinding, type ArrowHeadType, type ArrowShape, ArrowTool, Camera, type CameraState, type CircleShape, type ConnectionType, type DiamondShape, type DrawShape, type DrawuiTheme, type DrawuiThemeSelection, Editor, type EditorData, type EditorOptions, type EditorState, type EllipseShape, type ExportFormat, type ExportOptions, type FreehandMode, FreehandTool, type GenerationContext, HandTool, type HexagonShape, type Language, type LineShape, LineTool, MINDMAP_COLORS, MINDMAP_FONT_SIZE, MINDMAP_MAX_WIDTH, MINDMAP_MIN_WIDTH, MINDMAP_NODE_HEIGHT, Mat2d, type MessageKey, type MindMapLayoutResult, type MindMapNode, type MindMapNodePos, type MindMapShape, type OctagonShape, type ParallelogramShape, type PentagonShape, type Rect, type RectangleShape, Renderer, type RoundedRectangleShape, SelectTool, type Shape, type ShapeStyle, ShapeTool, type ShapeType, type SnapGuide, type StarShape, THEME, type TextShape, type ToolType, type TrapezoidShape, type TriangleShape, UML_FONT_SIZE, UML_HEADER_HEIGHT, UML_LINE_HEIGHT, UML_MIN_WIDTH, UML_PADDING_X, UML_PADDING_Y, type UiEvent, type UmlAttribute, type UmlClassShape, type UmlInterfaceShape, type UmlMethod, type UmlVisibility, Vec, type Vec2 as Vec2Type, calcUmlClassSize, cloneMindMapNode, countMindMapNodes, downloadBlob, exportToBlob, findMindMapNode, getContentBounds, getLanguage, getMindMapNodeDepth, getMindMapParent, getTheme, hexToRgba, layoutMindMap, mindMapNodeColor, mindMapNodeSize, renderSVGString, renderToCanvas, setLanguage, setTheme, shadeColor, subscribeLanguage, subscribeTheme, t };