drawui-core 0.1.0

package/dist/index.d.cts

@@ -0,0 +1,948 @@
+interface Vec2 {
+    x: number;
+    y: number;
+}
+interface Rect {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+interface ShapeStyle {
+    strokeColor: string;
+    fillColor: string;
+    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';
+interface BaseShape {
+    id: string;
+    type: ShapeType;
+    x: number;
+    y: number;
+    rotation: number;
+    style: ShapeStyle;
+    text?: string;
+    textColor?: string;
+    fontSize?: number;
+    highlightColor?: string;
+}
+interface RectangleShape extends BaseShape {
+    type: 'rectangle';
+    width: number;
+    height: number;
+}
+interface RoundedRectangleShape extends BaseShape {
+    type: 'rounded-rectangle';
+    width: number;
+    height: number;
+    borderRadius: number;
+}
+interface CircleShape extends BaseShape {
+    type: 'circle';
+    radius: number;
+}
+interface EllipseShape extends BaseShape {
+    type: 'ellipse';
+    width: number;
+    height: number;
+}
+interface DiamondShape extends BaseShape {
+    type: 'diamond';
+    width: number;
+    height: number;
+}
+interface TriangleShape extends BaseShape {
+    type: 'triangle';
+    width: number;
+    height: number;
+}
+interface HexagonShape extends BaseShape {
+    type: 'hexagon';
+    width: number;
+    height: number;
+}
+interface ParallelogramShape extends BaseShape {
+    type: 'parallelogram';
+    width: number;
+    height: number;
+}
+interface TrapezoidShape extends BaseShape {
+    type: 'trapezoid';
+    width: number;
+    height: number;
+}
+interface PentagonShape extends BaseShape {
+    type: 'pentagon';
+    width: number;
+    height: number;
+}
+interface OctagonShape extends BaseShape {
+    type: 'octagon';
+    width: number;
+    height: number;
+}
+interface StarShape extends BaseShape {
+    type: 'star';
+    width: number;
+    height: number;
+}
+type UmlVisibility = '+' | '-' | '#' | '~';
+interface UmlAttribute {
+    id: string;
+    visibility: UmlVisibility;
+    name: string;
+    type: string;
+    /** 每行可选格式：缺省时回退到 shape 的 textColor/fontSize */
+    textColor?: string;
+    fontSize?: number;
+    /** 是否加删除线 */
+    strikethrough?: boolean;
+}
+interface UmlMethod {
+    id: string;
+    visibility: UmlVisibility;
+    name: string;
+    params: string;
+    returnType: string;
+    /** 每行可选格式：缺省时回退到 shape 的 textColor/fontSize */
+    textColor?: string;
+    fontSize?: number;
+    /** 是否加删除线 */
+    strikethrough?: boolean;
+}
+interface UmlClassShape extends BaseShape {
+    type: 'uml-class';
+    className: string;
+    attributes: UmlAttribute[];
+    methods: UmlMethod[];
+    width: number;
+    height: number;
+}
+interface UmlInterfaceShape extends BaseShape {
+    type: 'uml-interface';
+    className: string;
+    methods: UmlMethod[];
+    width: number;
+    height: number;
+}
+interface LineShape extends BaseShape {
+    type: 'line';
+    points: Vec2[];
+    connectionType?: ConnectionType;
+}
+type ConnectionType = 'straight' | 'polyline' | 'orthogonal' | 'curve';
+/** 生成点位创建上下文：from 为源点(生成点位)，to 为目标落点 */
+interface GenerationContext {
+    from: Vec2;
+    to: Vec2;
+    sourceShapeId?: string;
+    edge?: 'n' | 'e' | 's' | 'w';
+}
+/** 生成点位预览：从源点拖出的虚线线条 + 待放置图形轮廓 */
+interface GenerationPreview {
+    from: Vec2;
+    to: Vec2;
+    /** 待放置图形的类型；不提供（指向已有图形）时只画线条 */
+    type?: ShapeType;
+}
+/** 生成点位 → UI 菜单载荷：拖动到空白处后触发的"选择新图形"菜单 */
+interface GenerationMenuPayload {
+    context: GenerationContext;
+    /** 拖动时已生成的浮动线条 id；选择图形后把线条末端接到该图形 */
+    existingArrowId?: string;
+    /** 默认高亮的图形类型（= 当前选中图形类型） */
+    defaultShapeType: ShapeType;
+}
+interface ArrowBinding {
+    toShapeId: string;
+    handle?: 'top' | 'bottom' | 'left' | 'right';
+    isPrecise?: boolean;
+    normalizedAnchor?: Vec2;
+}
+type ArrowHeadType = 'none' | 'start' | 'end' | 'both' | 'inheritance' | 'aggregation' | 'composition';
+interface ArrowShape extends BaseShape {
+    type: 'arrow';
+    points: Vec2[];
+    startBinding?: ArrowBinding;
+    endBinding?: ArrowBinding;
+    connectionType?: ConnectionType;
+    arrowHead?: ArrowHeadType;
+    dashed?: boolean;
+}
+interface TextShape extends BaseShape {
+    type: 'text';
+    text: string;
+    fontSize: number;
+    width: number;
+    height: number;
+}
+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 CameraState {
+    x: number;
+    y: number;
+    zoom: number;
+}
+interface EditorState {
+    shapes: Shape[];
+    selectedShapeIds: string[];
+    activeTool: ToolType;
+    camera: CameraState;
+}
+
+interface Mat2d {
+    a: number;
+    b: number;
+    c: number;
+    d: number;
+    e: number;
+    f: number;
+}
+declare const Mat2d: {
+    identity(): Mat2d;
+    translation(x: number, y: number): Mat2d;
+    rotation(angle: number): Mat2d;
+    scale(sx: number, sy: number): Mat2d;
+    multiply(a: Mat2d, b: Mat2d): Mat2d;
+    apply(m: Mat2d, v: Vec2): Vec2;
+    invert(m: Mat2d): Mat2d | null;
+    createCameraMatrix(camera: {
+        x: number;
+        y: number;
+        zoom: number;
+    }): Mat2d;
+};
+
+declare class Camera {
+    x: number;
+    y: number;
+    zoom: number;
+    private minZoom;
+    private maxZoom;
+    getMatrix(): Mat2d;
+    getInverseMatrix(): Mat2d | null;
+    screenToPage(screenPoint: Vec2): Vec2;
+    pageToScreen(pagePoint: Vec2): Vec2;
+    translate(dx: number, dy: number): void;
+    zoomAt(point: Vec2, factor: number): void;
+    reset(): void;
+    getZoom(): number;
+    fitBounds(bounds: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }, padding?: number): void;
+}
+
+type Listener = () => void;
+type NotificationListener = (message: string) => void;
+/** 核心 → React 的 UI 指令事件 */
+type UiEvent = {
+    kind: 'shapeTypeMenu';
+    screenX: number;
+    screenY: number;
+    context: GenerationContext;
+    existingArrowId?: string;
+    defaultShapeType: ShapeType;
+};
+declare class Editor {
+    private canvas;
+    private renderer;
+    private camera;
+    private tools;
+    private activeTool;
+    private shapes;
+    private selectedIds;
+    private listeners;
+    private notificationListeners;
+    private uiListeners;
+    private isPanning;
+    private panStart;
+    private dragStartPositions;
+    private lastClickTime;
+    private lastClickShapeId;
+    private editingShapeId;
+    private textInput;
+    private textOverlay;
+    private isNewTextShape;
+    private originalTextValue;
+    private undoStack;
+    private redoStack;
+    private isUndoing;
+    private brushRect;
+    private snapGuides;
+    private connectingTargetId;
+    private genPreview;
+    /** 拖动松开后待确认图形的上下文（配合"选择新图形"菜单） */
+    private pendingGen;
+    private renderScheduled;
+    private pointerIsDown;
+    private notifyScheduled;
+    constructor(canvas: HTMLCanvasElement);
+    private setupEventListeners;
+    private handlePointerDown;
+    private handlePointerMove;
+    private handlePointerUp;
+    /** 根据当前工具的命中结果更新鼠标样式（伸缩手柄↔/↕、拖拽 grabbing 等） */
+    private updateCursor;
+    private handleWheel;
+    private handleKeyDown;
+    private handleKeyUp;
+    private handleResize;
+    private screenToPage;
+    private addShape;
+    private updateShape;
+    private updateBoundArrows;
+    private getBindingPosition;
+    private deleteShape;
+    private selectShape;
+    private selectShapes;
+    private setBrushRect;
+    /** 设置对齐参考线（由工具在拖拽过程中调用） */
+    private setSnapGuides;
+    private setConnectingTarget;
+    /** 设置生成点位预览（拖动/悬浮中显示的线条 + 待放置图形） */
+    private setGenerationPreview;
+    /** 拖动到空白处松开 → 弹出"选择新图形"菜单（转发给 React UI） */
+    private openGenerationMenu;
+    private lineStyle;
+    /** 根据生成源（图形+边）计算连线起点绑定 */
+    private computeSourceBinding;
+    /** 连线到达目标图形时，应吸附到目标面向来线的那个边 */
+    private connectHandle;
+    /** 仅创建一条从源点引出、末端悬空的线条并选中它 */
+    createFloatingLine(context: GenerationContext): string | undefined;
+    /**
+     * 创建"新图形 + 连线"：在 to 处放置指定类型图形；若提供了 existingArrowId，
+     * 则把那条（已存在的浮动）线条末端接到新图形，否则新建一条连线。
+     * 新图形样式继承源图形（若有）。
+     */
+    createGeneratedConnection(context: GenerationContext, options: {
+        type: ShapeType;
+        existingArrowId?: string;
+    }): void;
+    /** 从源点连到已有图形：仅新建一条连线，不新造图形 */
+    connectToExisting(context: GenerationContext, targetShapeId: string, binding?: ArrowBinding): void;
+    subscribeUi(listener: (payload: UiEvent) => void): () => boolean;
+    private emitUi;
+    /** 批量更新选中图形的样式（边框色、填充色等），提交历史记录 */
+    updateSelectedShapesStyle(updates: Partial<ShapeStyle>): void;
+    /** 批量更新选中图形的文字颜色和高亮背景色，提交历史记录 */
+    updateSelectedShapesText(updates: {
+        textColor?: string;
+        highlightColor?: string;
+    }): void;
+    /** 批量更新选中线条/箭头的连线类型 */
+    updateConnectionType(connectionType: ConnectionType): void;
+    /** 批量更新选中箭头的箭头类型 */
+    updateArrowHeadType(arrowHead: ArrowHeadType): void;
+    /** 批量更新选中箭头的虚线样式 */
+    updateArrowDashed(dashed: boolean): void;
+    /** 更新 UML 类图的类名、属性、方法，自动重算尺寸 */
+    updateUmlClass(id: string, updates: {
+        className?: string;
+        attributes?: UmlAttribute[];
+        methods?: UmlMethod[];
+    }): void;
+    /** 更新 UML 接口（仅含方法，无属性段；size 由内容自动重算） */
+    updateUmlInterface(id: string, updates: {
+        className?: string;
+        methods?: UmlMethod[];
+    }): void;
+    /** 获取选中的 UML（类图或接口，如果有） */
+    getSelectedUml(): UmlClassShape | UmlInterfaceShape | null;
+    /** 按 id 查找 UML（类图或接口） */
+    private getUmlById;
+    /** 给指定 UML 类追加一条属性 */
+    addUmlAttribute(shapeId: string): void;
+    /** 给指定 UML（类图或接口）追加一条方法 */
+    addUmlMethod(shapeId: string): void;
+    /** 删除指定 UML 类的某条属性 */
+    removeUmlAttribute(shapeId: string, attrId: string): void;
+    /** 删除指定 UML（类图或接口）的某条方法 */
+    removeUmlMethod(shapeId: string, methodId: string): void;
+    /** 重排属性行 */
+    reorderUmlAttribute(shapeId: string, fromIdx: number, toIdx: number): void;
+    /** 重排方法行 */
+    reorderUmlMethod(shapeId: string, fromIdx: number, toIdx: number): void;
+    /** 更新单行的可选格式（颜色/字号/删除线） */
+    updateUmlRowStyle(shapeId: string, section: 'attribute' | 'method', rowId: string, style: {
+        textColor?: string | null;
+        fontSize?: number | null;
+        strikethrough?: boolean | null;
+    }): void;
+    /**
+     * 屏幕坐标（画布左上角为原点）下的 UML 行命中检测。
+     * 命中返回：所在形状、区域（className/attribute/method）、行索引、完整文本。
+     */
+    getUmlRowAtScreenPoint(screenPoint: {
+        x: number;
+        y: number;
+    }): {
+        shape: UmlClassShape | UmlInterfaceShape;
+        section: 'className' | 'attribute' | 'method';
+        rowIndex: number;
+        text: string;
+    } | null;
+    setActiveTool(tool: ToolType): void;
+    getActiveTool(): ToolType;
+    getShapes(): Shape[];
+    getSelectedIds(): string[];
+    getCamera(): Camera;
+    /** 指针是否处于按下状态（拖拽/画线/框选中） */
+    isPointerDown(): boolean;
+    zoomIn(): void;
+    zoomOut(): void;
+    resetZoom(): void;
+    /**
+     * 通过 panBy 偏移相机位置（像素单位）。
+     * 用于 minimap 拖拽等需要程序化移动视口的场景。
+     */
+    panBy(dx: number, dy: number): void;
+    /**
+     * 直接设置相机的屏幕偏移（绝对位移）。用于 minimap / hand tool 拖拽等
+     * 已经能算出目标 camera 的场景，避免 panBy 多次累加带来的漂移。
+     */
+    setCameraPosition(x: number, y: number): void;
+    /**
+     * 主动触发一次主画布重绘（合帧队列）。
+     * 当外部代码只读地变更了 camera 状态后调用此方法。
+     */
+    requestRender(): void;
+    setShowGrid(show: boolean): void;
+    render(): void;
+    /** 合帧渲染：同一帧内多次调用只会触发一次实际重绘 */
+    private scheduleRender;
+    subscribe(listener: Listener): () => boolean;
+    subscribeNotifications(listener: NotificationListener): () => boolean;
+    private notify;
+    private notifyListeners;
+    private cloneShapes;
+    /**
+     * 创建历史标记（参考 tldraw 的 mark 机制）。
+     * 在用户操作之前调用，捕获当前状态作为撤销点。
+     */
+    private commitHistory;
+    /** tldraw 风格的 mark 别名 */
+    mark(): void;
+    undo(): void;
+    redo(): void;
+    canUndo(): boolean;
+    canRedo(): boolean;
+    saveToStorage(): boolean;
+    loadFromStorage(): boolean;
+    clearStorage(): void;
+    exportJSON(): string;
+    importJSON(json: string): boolean;
+    getEditingShapeId(): string | null;
+    canEditShape(shape: Shape): boolean;
+    enterEditing(shapeId: string): void;
+    exitEditing(): void;
+    private removeTextInput;
+    private createTextInput;
+    private getShapeScreenBounds;
+    getShapeAtScreenPoint(screenPoint: Vec2): Shape | null;
+    getShapeAtPoint(point: Vec2, excludeId?: string): Shape | null;
+    private isPointInShape;
+    updateArrowBinding(arrowId: string, terminal: 'start' | 'end', targetShapeId: string | null, binding?: ArrowBinding): void;
+    private getClosestHandle;
+    dispose(): void;
+}
+
+interface SnapGuide {
+    type: 'horizontal' | 'vertical';
+    position: number;
+    start: number;
+    end: number;
+}
+declare class Renderer {
+    private ctx;
+    private width;
+    private height;
+    private dpr;
+    private showGrid;
+    /** 文本排版缓存：避免每帧对每个字符做 measureText */
+    private textLayoutCache;
+    private static readonly TEXT_CACHE_LIMIT;
+    constructor(canvas: HTMLCanvasElement);
+    resize(width: number, height: number): void;
+    setShowGrid(show: boolean): void;
+    render(shapes: Shape[], camera: Camera, selectedIds: Set<string>, brushRect?: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    } | null, snapGuides?: SnapGuide[], connectingTarget?: string | null, generationPreview?: GenerationPreview | null): void;
+    /** 连接进行中，高亮目标图形四边中点的可连锚点 */
+    private drawConnectingTargetHighlight;
+    /** 世界坐标下的轴对齐包围盒（未考虑旋转） */
+    private getShapeWorldBounds;
+    private drawBrushRect;
+    /**
+     * 绘制网格：只绘制当前视口内的网格线，且合并为单条路径一次 stroke，
+     * 避免大量独立 stroke() 调用导致的拖拽卡顿。
+     */
+    private drawGrid;
+    private drawShape;
+    private applyStyle;
+    private drawRectangle;
+    private drawRoundedRectangle;
+    private drawCircle;
+    private drawEllipse;
+    private drawDiamond;
+    private drawTriangle;
+    private drawHexagon;
+    private drawParallelogram;
+    private drawTrapezoid;
+    private drawPentagon;
+    private drawOctagon;
+    private drawStar;
+    private drawUmlClass;
+    /**
+     * UML 接口：标题显示为 `<<${className}>>`，仅方法段，无属性段，只有一条分隔线。
+     */
+    private drawUmlInterface;
+    /** 默认拐点圆角半径（页面坐标） */
+    private static readonly DEFAULT_CORNER_RADIUS;
+    /** 连线与图形之间保留的最小避障间距，避免线条贴边/粘在图形上 */
+    private static readonly ROUTE_CLEARANCE;
+    /** 连接点处的垂直出线桩长度：第一段垂直脱离图形边缘，避免贴角/贴边 */
+    private static readonly CONNECTION_LEAD;
+    /** 连接的源/目标图形作为障碍时使用的避让间距（足够阻挡中段折回穿过，又允许紧邻节点直连） */
+    private static readonly CONNECTED_PAD;
+    private drawLine;
+    private drawArrow;
+    /** 选中连线 → 在线条上叠加一条高亮辅助线 */
+    private drawLinearHighlight;
+    /** 生成点位预览：源点圆点 + 虚线线条 + 待放置图形轮廓 */
+    private drawGenerationPreview;
+    /** 待放置图形的虚线轮廓（按默认尺寸绘制对应类型） */
+    private drawPreviewShapeOutline;
+    private static readonly ALIGN_TOLERANCE;
+    /**
+     * 判断连线两端是否水平或垂直对齐（在容差内）。
+     * 若在容差内，强制将坐标对齐（避免 grid snapping 导致无法形成直线）。
+     */
+    private getAlignedPoints;
+    /** 生成路径点（对齐容差已在上游处理）。 */
+    private buildPathPoints;
+    /**
+     * 使用 arcTo 绘制带圆角拐点的折线。
+     * 对首尾两点不做圆角处理，中间拐点按 radius 切割相邻线段做切线圆角。
+     * radius 会根据前后两段长度自动缩小以避免退化。
+     */
+    private drawRoundedPolyline;
+    /** 直角折线：直接用直线段连接所有拐点（无圆角） */
+    private drawSharpPolyline;
+    /** 绘制对齐参考线（飞书风格：浅蓝色虚线） */
+    private drawSnapGuides;
+    /** 折线：与orthogonal使用相同的H-V-H路由，差异仅在渲染（sharp vs rounded）。dock 法向在首/末段加一段垂直出线桩，垂直脱离图形边缘。 */
+    private generatePolylinePoints;
+    /** 直角折线：与 polyline 使用相同的 H-V-H 正交路由，仅渲染方式（sharp）不同。 */
+    private generateOrthogonalPoints;
+    /** 去除连续重合点与共线点，精简冗余拐点 */
+    private collapseLinePoints;
+    /** 计算单段直角路由：优先无碰撞的 H-V-H / V-H-V 折线，必要时绕开障碍 */
+    private computeOrthogonalRoute;
+    /** 收集连线绕行所需的障碍包围盒（转为 shape 本地坐标）。
+     *  将本连线之外的所有图形（含其它连线/箭头/手绘）都作为障碍；
+     *  连接端点所在图形使用小间距（CONNECTED_PAD），其余图形使用大间距（ROUTE_CLEARANCE）。 */
+    private collectRoutingObstacles;
+    private pointInRect;
+    /** 整个折线路径是否与任一障碍相交 */
+    private routeHitsObstacles;
+    /** 轴对齐线段是否与任一障碍（向外扩其 pad）相交 */
+    private segmentHitsObstacle;
+    /**
+     * 正交避障路由器（类飞书）。
+     * 用「起终点坐标 + 每个障碍物扩展边界」构造一条布线网格，再用 A* 在网格上求
+     * 最短避障折线（半径外扩 pad 保证不贴边）。返回不含 from、含 to 的拐点序列。
+     */
+    private routeOrthogonalAvoidance;
+    /** 曲线：通过中点生成平滑曲线路径（离散化贝塞尔曲线） */
+    private generateCurvePoints;
+    /** 计算贝塞尔曲线控制点 */
+    private computeCurveControlPoint;
+    /**
+     * 获取文本的显示行（换行 + 截断），结果按 shape/文本/尺寸缓存，
+     * 避免每帧渲染都对文本逐字符 measureText。
+     */
+    private getDisplayLines;
+    private drawShapeText;
+    private getTextBounds;
+    private wrapLine;
+    private truncateLine;
+    private getBindingPoint;
+    /**
+     * 计算端点所在图形的外法向（垂直于该侧边缘，页面坐标单位向量）。
+     * 用于连线垂直脱离/接入图形边缘，端点不在任何图形上时返回 undefined。
+     */
+    private getDockNormal;
+    /**
+     * 获取 shape 在页面坐标系中的 bounds（x/y 为左上角）
+     */
+    private getShapePageBounds;
+    /**
+     * 若某个世界坐标端点落在某图形内部，则把它吸附到该图形外轮廓的最近点，
+     * 避免连线端点/线段穿进图形内部。多个图形重叠时取距另一端更近的那个。
+     */
+    private clampToShapeOutline;
+    /**
+     * 从 shape 中心向 p 方向发射一条射线，返回与 shape 外轮廓的最近交点
+     * 用于 normalizedAnchor 计算精确绑定的落点
+     */
+    private nearestPointOnShapeOutline;
+    /** 线段 vs 形状轮廓的所有交点（页面坐标系） */
+    private intersectShapeOutlineWithSegment;
+    /** 线段 vs shape 本地坐标的轮廓交点 */
+    private intersectLocalShapeOutlineWithSegment;
+    /** 线段 vs 轴对齐矩形 4 条边的所有交点 */
+    private intersectSegmentRect;
+    /** 两条线段的交点（不存在返回 null） */
+    private segmentIntersection;
+    /** 线段 vs 圆 的所有交点 */
+    private intersectSegmentCircle;
+    private drawArrowHead;
+    private drawInheritanceHead;
+    private drawDiamondHead;
+    /** 根据箭头类型绘制起始/末端箭头 */
+    private drawArrowHeads;
+    private drawText;
+    private drawFreehand;
+    private drawSelectionOutline;
+    private drawSelectionHandles;
+    /** 画旋转图标：顺时针短弧 + 箭头 */
+    private drawRotateIcon;
+    private getShapeBounds;
+}
+
+declare const Vec: {
+    create(x?: number, y?: number): Vec2;
+    add(a: Vec2, b: Vec2): Vec2;
+    subtract(a: Vec2, b: Vec2): Vec2;
+    multiply(v: Vec2, scalar: number): Vec2;
+    divide(v: Vec2, scalar: number): Vec2;
+    dot(a: Vec2, b: Vec2): number;
+    length(v: Vec2): number;
+    normalize(v: Vec2): Vec2;
+    distance(a: Vec2, b: Vec2): number;
+    rotate(v: Vec2, angle: number): Vec2;
+    clone(v: Vec2): Vec2;
+    equals(a: Vec2, b: Vec2): boolean;
+};
+
+interface ToolContext {
+    addShape(shape: Shape): void;
+    updateShape(id: string, updates: Partial<Shape>): void;
+    deleteShape(id: string): void;
+    selectShape(id: string, additive: boolean): void;
+    selectShapes(ids: string[]): void;
+    getShapes(): Shape[];
+    getSelectedIds(): string[];
+    setActiveTool(tool: ToolType): void;
+    screenToPage(point: Vec2): Vec2;
+    getCamera(): Camera;
+    panBy(dx: number, dy: number): void;
+    setCameraPosition(x: number, y: number): void;
+    getShapeAtPoint(point: Vec2, excludeId?: string): Shape | null;
+    updateArrowBinding(arrowId: string, terminal: 'start' | 'end', targetShapeId: string | null, binding?: ArrowBinding): void;
+    enterEditing(shapeId: string): void;
+    exitEditing(): void;
+    commitHistory(): void;
+    setBrushRect(rect: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    } | null): void;
+    setSnapGuides(guides: SnapGuide[]): void;
+    setConnectingTarget(id: string | null): void;
+    setGenerationPreview(preview: GenerationPreview | null): void;
+    /** 拖动到空白处：创建一条浮动线条并弹出"选择新图形"菜单 */
+    openGenerationMenu(payload: GenerationMenuPayload): void;
+    /** 创建"新图形 + 连线"；existingArrowId 存在时把线条末端接到新图形 */
+    createGeneratedConnection(context: GenerationContext, options: {
+        type: ShapeType;
+        existingArrowId?: string;
+    }): void;
+    /** 仅创建一条从源点引出、末端悬空的线条，返回线条 id */
+    createFloatingLine(context: GenerationContext): string | undefined;
+    /** 从源点连到已有图形 */
+    connectToExisting(context: GenerationContext, targetShapeId: string, binding?: ArrowBinding): void;
+    updateSelectedShapesStyle(updates: Partial<ShapeStyle>): void;
+    updateSelectedShapesText(updates: {
+        textColor?: string;
+        highlightColor?: string;
+    }): void;
+    updateConnectionType(connectionType: ConnectionType): void;
+}
+declare abstract class Tool {
+    abstract type: ToolType;
+    protected context: ToolContext;
+    constructor(context: ToolContext);
+    abstract onPointerDown(point: Vec2, event: PointerEvent): void;
+    abstract onPointerMove(point: Vec2, event: PointerEvent): void;
+    abstract onPointerUp(point: Vec2, event: PointerEvent): void;
+    abstract onKeyDown(event: KeyboardEvent): void;
+    abstract onKeyUp(event: KeyboardEvent): void;
+    /** 返回当前指针位置应显示的鼠标样式，null 表示使用默认 */
+    getCursor(_point: Vec2): string | null;
+    dispose(): void;
+}
+
+declare class SelectTool extends Tool {
+    type: ToolType;
+    private state;
+    private translatingState;
+    private resizingState;
+    private generatingState;
+    private hoverGenPoint;
+    private rotatingState;
+    private draggingArrowId;
+    private draggingTerminal;
+    private pendingHistoryCommit;
+    private brushStart;
+    private brushShiftKey;
+    /** 生成点位默认创建的图形类型：源图形若为可创建类型则同型，否则用矩形 */
+    private defaultGenType;
+    private genPreviewOf;
+    /** 把生成点位打包成创建上下文（from 为源点，to 为目标落点） */
+    private genContext;
+    onPointerDown(point: Vec2, event: PointerEvent): void;
+    onPointerMove(point: Vec2, event: PointerEvent): void;
+    onPointerUp(point: Vec2, _event: PointerEvent): void;
+    onKeyDown(event: KeyboardEvent): void;
+    onKeyUp(_event: KeyboardEvent): void;
+    /** 鼠标样式：伸缩手柄 → 对应方向的双向箭头；拖拽中 → 抓取 */
+    getCursor(point: Vec2): string | null;
+    /** 手柄光标：根据手柄方位 + 图形旋转角映射到标准 resize 光标 */
+    private getHandleCursor;
+    private static readonly ALIGN_SNAP_THRESHOLD;
+    /**
+     * 拖拽移动：平滑移动 + 边缘/中心对齐吸附。
+     * 对齐规则：移动图形的 上边/中心/下边（及左边/中心/右边）与其他图形对应边比较，
+     * 在容差内即视为对齐 → 吸附并显示对应方向的辅助线：
+     * - 上下边同时对齐（同尺寸） → 两条平行线
+     * - 仅上边或仅下边对齐 → 一条平行线
+     * - 仅中心对齐 → 中间一条平行线
+     */
+    private handleTranslating;
+    private handleResizing;
+    /** 合并同位置辅助线（同类型同位置合并跨度） */
+    private mergeGuides;
+    private handleRotation;
+    private handleNudge;
+    /** 框选：更新选区矩形并选中相交的图形 */
+    private handleBrushing;
+    /** 获取图形在世界坐标系中的包围盒 */
+    private getShapeWorldBounds;
+    /** AABB 相交检测 */
+    private rectsIntersect;
+    private hitTest;
+    private getHitHandle;
+    /** 生成点位命中阈值 / 单击 vs 拖动判定阈值 */
+    private static readonly GEN_HIT_THRESHOLD;
+    private static readonly CLICK_MOVE_THRESHOLD;
+    /** 收集选中图形上的全部生成点位（图形四边中点 + 连线中点） */
+    private computeGenPoints;
+    /** 命中检测：指针是否落在某个生成点位附近（取最近的） */
+    private hitGenPoint;
+    /** 生成点位预览的落点：拖动时跟随光标；静止/悬浮时向外延伸一个默认位置的框 */
+    private genPreviewTarget;
+    /** 生成拖动：更新预览（线条 + 框）与目标高亮 */
+    private handleGenerating;
+    private handleRotating;
+    private edgeMidpointWorld;
+    /** 根据绑定信息返回目标图形的实际吸附点 */
+    private bindingPosition;
+    private isPointInShape;
+    private isPointInHexagon;
+    private pointToLineDistance;
+    private getShapeBounds;
+    private hitTestArrowTerminal;
+    private findShapeNearPoint;
+    private pointToRectDistance;
+    private static readonly SNAP_THRESHOLD;
+    private static readonly HANDLE_SNAP_DISTANCE;
+    private static readonly ANCHOR_EPS;
+    /**
+     * 拖拽箭头端点时计算辅助线（与 ArrowTool 规则一致）：
+     * 另一端绑定的图形 vs 拖拽端点附近的候选图形，若存在边/中心对齐，
+     * 按连线主方向出对应方向的辅助线（上下两条平行线 / 上或下一条 / 中间一条）。
+     */
+    private computeSnapGuidesForArrow;
+    /**
+     * 在 point 附近找可吸附的图形，并返回 binding（精确或非精确）。
+     * 优先级：最近的 handle 吸附（非精确） > 最近的边缘点（精确 normalizedAnchor）
+     */
+    private findBindingNearPoint;
+    private getPageBounds;
+    private computeNormalizedAnchor;
+    private nearestPointOnShapeOutline;
+    private nearestLocalPointOnShapeOutline;
+    private nearestPointOnRectOutlineLocal;
+    private nearestPointOnCircleOutlineLocal;
+    private nearestPointOnSegment;
+}
+
+/**
+ * 手形（拖拽视口）工具。
+ *
+ * 设计参考 tldraw 的 HandTool / childStates.Dragging：
+ *   - 默认光标显示 grab（张开的小手）
+ *   - 按下：进入 pointing 状态，光标变 grabbing（握紧的小手）
+ *   - 鼠标位移超过 DRAG_THRESHOLD：进入 dragging 状态
+ *   - dragging 中：相机 = initialCamera + 屏幕位移
+ *     （屏幕位移直接加到相机偏移量；与 tldraw 略不同：tldraw 用
+ *     initialCamera + (delta / zoom) 把屏幕位移除回去再叠加，我们
+ *     因为 camera.x/y 本身就是屏幕像素坐标，直接加更直观）
+ *   - 松开：回到 idle，但保留当前相机和上次鼠标位置，
+ *     便于下一段拖拽继续连续移动
+ *   - Esc：立刻取消正在进行的拖拽
+ */
+declare class HandTool extends Tool {
+    type: ToolType;
+    private state;
+    private startScreenPoint;
+    private initialCameraPos;
+    /** 进入 dragging 状态的最小屏幕位移 */
+    private static readonly DRAG_THRESHOLD;
+    onPointerDown(_point: Vec2, event: PointerEvent): void;
+    onPointerMove(_point: Vec2, event: PointerEvent): void;
+    onPointerUp(_point: Vec2, event: PointerEvent): void;
+    onKeyDown(event: KeyboardEvent): void;
+    onKeyUp(_event: KeyboardEvent): void;
+    getCursor(_point: Vec2): string;
+    private applyCameraDelta;
+}
+
+declare const UML_FONT_SIZE = 14;
+declare const UML_LINE_HEIGHT = 22;
+declare const UML_HEADER_HEIGHT = 36;
+declare const UML_PADDING_X = 14;
+declare const UML_PADDING_Y = 8;
+declare const UML_MIN_WIDTH = 160;
+declare function calcUmlClassSize(className: string, attributes: UmlAttribute[], methods: UmlMethod[]): {
+    width: number;
+    height: number;
+};
+declare class ShapeTool extends Tool {
+    type: ShapeType;
+    constructor(context: ToolContext, shapeType: ShapeType);
+    onPointerDown(point: Vec2, _event: PointerEvent): void;
+    onPointerMove(_point: Vec2, _event: PointerEvent): void;
+    onPointerUp(_point: Vec2, _event: PointerEvent): void;
+    onKeyDown(_event: KeyboardEvent): void;
+    onKeyUp(_event: KeyboardEvent): void;
+    getCursor(): string | null;
+}
+
+declare class LineTool extends Tool {
+    type: "line";
+    private isDrawing;
+    private startPoint;
+    private currentShape;
+    onPointerDown(point: Vec2, _event: PointerEvent): void;
+    onPointerMove(point: Vec2, _event: PointerEvent): void;
+    onPointerUp(_point: Vec2, _event: PointerEvent): void;
+    onKeyDown(_event: KeyboardEvent): void;
+    onKeyUp(_event: KeyboardEvent): void;
+    getCursor(): string | null;
+}
+
+type FreehandMode = 'pen' | 'highlighter';
+/**
+ * 自由绘制工具（画笔 / 荧光笔）。
+ *
+ * - pen 模式：生成持久笔迹，除非手动删除（选中后按 Delete）否则一直保留。
+ * - highlighter 模式：生成半透明粗笔迹，绘制完成若干秒后自动消失。
+ *
+ * 两种模式底层都生成 `type:'draw'` 形状，从而复用已有的渲染 / 命中选中 / 删除链路。
+ */
+declare class FreehandTool extends Tool {
+    type: ToolType;
+    private mode;
+    private isDrawing;
+    private points;
+    private currentShapeId;
+    private committed;
+    private fadeTimer;
+    constructor(context: ToolContext, mode: FreehandMode);
+    onPointerDown(point: Vec2, _event: PointerEvent): void;
+    onPointerMove(point: Vec2, _event: PointerEvent): void;
+    onPointerUp(_point: Vec2, _event: PointerEvent): void;
+    onKeyDown(_event: KeyboardEvent): void;
+    onKeyUp(_event: KeyboardEvent): void;
+    getCursor(): string | null;
+    dispose(): void;
+}
+
+declare class ArrowTool extends Tool {
+    type: "arrow";
+    private isDrawing;
+    private startPoint;
+    private currentShapeId;
+    private startBindingInfo;
+    onPointerDown(point: Vec2, _event: PointerEvent): void;
+    onPointerMove(point: Vec2, _event: PointerEvent): void;
+    onPointerUp(_point: Vec2, _event: PointerEvent): void;
+    onKeyDown(_event: KeyboardEvent): void;
+    onKeyUp(_event: KeyboardEvent): void;
+    getCursor(): string | null;
+    private computeSnapGuides;
+    private getShapeBounds;
+    private findShapeBinding;
+    private pointToRectDistance;
+    private getClosestHandle;
+    private getBindingPosition;
+    private getRectBindingPosition;
+    private getCircleBindingPosition;
+}
+
+/**
+ * 主题颜色常量 - 统一管理所有 UI 颜色
+ * 修改此处即可全局生效
+ */
+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";
+};
+
+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 };