@logicflow/extension 2.2.0-alpha.5 → 2.2.0-alpha.7

package/es/bpmn-elements-adapter/json2xml.d.ts

@@ -1,3 +1,4 @@
 declare function handleAttributes(obj: any): any;
+declare function escapeXml(text: string): string;
 declare function lfJson2Xml(obj: any): string;
-export { lfJson2Xml, handleAttributes };
+export { lfJson2Xml, handleAttributes, escapeXml };

package/es/bpmn-elements-adapter/json2xml.js

@@ -21,6 +21,17 @@ function handleAttributes(obj) {
     }
     return obj;
 }
+function escapeXml(text) {
+    if (text == null)
+        return '';
+    return text
+        .toString()
+        .replace(/&/g, '&')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;')
+        .replace(/'/g, '&apos;');
+}
 function getAttributes(obj) {
     var tmp = obj;
     try {
@@ -31,7 +42,7 @@ function getAttributes(obj) {
     catch (error) {
         tmp = JSON.stringify(handleAttributes(obj)).replace(/"/g, "'");
     }
-    return tmp;
+    return escapeXml(String(tmp));
 }
 var tn = '\t\n';
 // @see issue https://github.com/didi/LogicFlow/issues/718, refactoring of function toXml
@@ -41,8 +52,11 @@ function toXml(obj, name, depth) {
     var prefix = tn + frontSpace;
     if (name === '-json')
         return '';
+    if (obj !== 0 && obj !== false && !obj) {
+        return "".concat(prefix, "<").concat(name, " />");
+    }
     if (name === '#text') {
-        return prefix + obj;
+        return prefix + escapeXml(String(obj));
     }
     if (name === '#cdata-section') {
         return "".concat(prefix, "<![CDATA[").concat(obj, "]]>");
@@ -70,7 +84,7 @@ function toXml(obj, name, depth) {
             attributes_1 + (children_1 !== '' ? ">".concat(children_1).concat(prefix, "</").concat(name, ">") : ' />');
     }
     else {
-        str += "".concat(prefix, "<").concat(name, ">").concat(obj.toString(), "</").concat(name, ">");
+        str += "".concat(prefix, "<").concat(name, ">").concat(escapeXml(String(obj)), "</").concat(name, ">");
     }
     return str;
 }
@@ -81,4 +95,4 @@ function lfJson2Xml(obj) {
     }
     return xmlStr;
 }
-export { lfJson2Xml, handleAttributes };
+export { lfJson2Xml, handleAttributes, escapeXml };

package/es/bpmn-elements-adapter/xml2json.js

@@ -5,6 +5,7 @@
 /* eslint-disable func-names */
 // @ts-nocheck
 import { has } from 'lodash-es';
+import { escapeXml } from './json2xml';
 // ========================================================================
 //  XML.ObjTree -- XML source code from/to JavaScript object like E4X
 // ========================================================================
@@ -295,13 +296,7 @@ XML.ObjTree.prototype.scalar_to_xml = function (name, text) {
     return "<".concat(name, ">").concat(this.xml_escape(text), "</").concat(name, ">\n");
 };
 //  method: xml_escape( text )
-XML.ObjTree.prototype.xml_escape = function (text) {
-    return text
-        .replace(/&/g, '&')
-        .replace(/</g, '<')
-        .replace(/>/g, '>')
-        .replace(/"/g, '"');
-};
+XML.ObjTree.prototype.xml_escape = escapeXml;
 /*
 // ========================================================================
 

package/es/components/control/index.js

@@ -132,14 +132,14 @@ var Control = /** @class */ (function () {
             else {
                 itemContainer.append(icon);
             }
-            switch (item.text) {
-                case '上一步':
+            switch (item.key) {
+                case 'undo':
                     _this.lf.on('history:change', function (_a) {
                         var undoAble = _a.data.undoAble;
                         itemContainer.className = undoAble ? NORMAL : DISABLED;
                     });
                     break;
-                case '下一步':
+                case 'redo':
                     _this.lf.on('history:change', function (_a) {
                         var redoAble = _a.data.redoAble;
                         itemContainer.className = redoAble ? NORMAL : DISABLED;

package/es/index.d.ts

@@ -5,6 +5,7 @@ export * from './bpmn-elements-adapter';
 export * from './bpmn-adapter/xml2json';
 export * from './bpmn-adapter/json2xml';
 export * from './turbo-adapter';
+export * from './pool';
 export * from './dynamic-group';
 export * from './insert-node-in-polyline';
 export * from './tools/label';

package/es/index.js

@@ -7,6 +7,8 @@ export * from './bpmn-adapter/xml2json';
 export * from './bpmn-adapter/json2xml';
 // Adapter
 export * from './turbo-adapter';
+// 泳道相关
+export * from './pool';
 // 新版 Group
 export * from './dynamic-group';
 // 折线上动态插入节点

package/es/materials/curved-edge/index.js

@@ -127,38 +127,54 @@ function getMidPoints(cur, key, orientation, radius) {
             return [];
     }
 }
-function getPartialPath(prev, cur, next, radius) {
+/**
+ * 生成局部路径片段（包含圆角）
+ * - 输入为上一个顶点、当前拐点、下一个顶点，计算方向组合并选择圆弧象限
+ * - 将圆角半径限制在相邻两段长度的一半以内，避免过度弯曲
+ * @param prevPoint 上一个顶点
+ * @param cornerPoint 当前拐点（圆角所在拐点）
+ * @param nextPoint 下一个顶点
+ * @param cornerRadius 圆角半径上限
+ * @returns 局部 path 字符串（包含 L/Q 操作）
+ */
+function getPartialPath(prevPoint, cornerPoint, nextPoint, cornerRadius) {
     var _a;
-    // 定义误差容错变量
-    var tolerance = 1;
-    var dir1 = '';
-    var dir2 = '';
-    if (Math.abs(prev[0] - cur[0]) <= tolerance) {
-        // 垂直方向
-        dir1 = prev[1] > cur[1] ? 't' : 'b';
-    }
-    else if (Math.abs(prev[1] - cur[1]) <= tolerance) {
-        // 水平方向
-        dir1 = prev[0] > cur[0] ? 'l' : 'r';
-    }
-    if (Math.abs(cur[0] - next[0]) <= tolerance) {
-        dir2 = cur[1] > next[1] ? 't' : 'b';
-    }
-    else if (Math.abs(cur[1] - next[1]) <= tolerance) {
-        dir2 = cur[0] > next[0] ? 'l' : 'r';
-    }
-    var r = Math.min(Math.hypot(cur[0] - prev[0], cur[1] - prev[1]) / 2, Math.hypot(next[0] - cur[0], next[1] - cur[1]) / 2, radius) || (1 / 5) * radius;
+    // 轴对齐容差（像素），用于消除微小误差
+    var epsilon = 1;
+    var resolveDir = function (a, b) {
+        var dx = b[0] - a[0];
+        var dy = b[1] - a[1];
+        var adx = Math.abs(dx);
+        var ady = Math.abs(dy);
+        if (ady <= epsilon && adx > epsilon) {
+            return dx < 0 ? 'l' : 'r';
+        }
+        if (adx <= epsilon && ady > epsilon) {
+            return dy < 0 ? 't' : 'b';
+        }
+        if (adx <= epsilon && ady <= epsilon) {
+            return '';
+        }
+        // 非严格对齐时，选择更接近的轴
+        return adx < ady ? (dx < 0 ? 'l' : 'r') : dy < 0 ? 't' : 'b';
+    };
+    var dir1 = resolveDir(prevPoint, cornerPoint);
+    var dir2 = resolveDir(cornerPoint, nextPoint);
+    var r = Math.min(Math.hypot(cornerPoint[0] - prevPoint[0], cornerPoint[1] - prevPoint[1]) /
+        2, Math.hypot(nextPoint[0] - cornerPoint[0], nextPoint[1] - cornerPoint[1]) /
+        2, cornerRadius) || (1 / 5) * cornerRadius;
     var key = "".concat(dir1).concat(dir2);
     var orientation = directionMap[key] || '-';
-    var path = "L ".concat(prev[0], " ").concat(prev[1]);
+    var path = '';
     if (orientation === '-') {
-        path += "L ".concat(cur[0], " ").concat(cur[1], " L ").concat(next[0], " ").concat(next[1]);
+        // 仅移动到当前拐点，由下一次迭代决定如何从拐点继续（直线或圆角）
+        path += "L ".concat(cornerPoint[0], " ").concat(cornerPoint[1]);
     }
     else {
-        var _b = __read(getMidPoints(cur, key, orientation, r), 2), mid1 = _b[0], mid2 = _b[1];
+        var _b = __read(getMidPoints(cornerPoint, key, orientation, r), 2), mid1 = _b[0], mid2 = _b[1];
         if (mid1 && mid2) {
-            path += "L ".concat(mid1[0], " ").concat(mid1[1], " Q ").concat(cur[0], " ").concat(cur[1], " ").concat(mid2[0], " ").concat(mid2[1]);
-            _a = __read(mid2, 2), cur[0] = _a[0], cur[1] = _a[1];
+            path += "L ".concat(mid1[0], " ").concat(mid1[1], " Q ").concat(cornerPoint[0], " ").concat(cornerPoint[1], " ").concat(mid2[0], " ").concat(mid2[1]);
+            _a = __read(mid2, 2), cornerPoint[0] = _a[0], cornerPoint[1] = _a[1];
         }
     }
     return path;

package/es/pool/LaneModel.d.ts

@@ -0,0 +1,90 @@
+/**
+ * 基于DynamicGroup重新实现的泳道节点组件
+ * 继承DynamicGroupNodeModel和DynamicGroupNode，提供泳道特定功能
+ */
+import LogicFlow from '@logicflow/core';
+import { DynamicGroupNodeModel } from '../dynamic-group';
+export declare class LaneModel extends DynamicGroupNodeModel {
+    readonly isLane: boolean;
+    defaultZIndex: number;
+    initNodeData(data: LogicFlow.NodeConfig): void;
+    setAttributes(): void;
+    setZIndex(zIndex: number): void;
+    /**
+     * 重写折叠方法 - 泳道不支持折叠
+     */
+    toggleCollapse(): void;
+    /**
+     * 获取所属泳池ID
+     */
+    getPoolId(): string | null;
+    /**
+     * 获取所属泳池模型
+     */
+    getPoolModel(): any;
+    /**
+     * 动态修改泳道属性
+     */
+    changeAttribute({ width, height, x, y }: any): void;
+    /**
+     * 重写获取数据方法，添加泳道特定属性
+     */
+    getData(): LogicFlow.NodeData;
+    /**
+     * 重写 isAllowAppendIn，禁止 Lane 嵌套
+     */
+    isAllowAppendIn(nodeData: LogicFlow.NodeData): boolean;
+    /**
+     * 获取需要移动的节点
+     * @param groupModel
+     */
+    getNodesInGroup(groupModel: DynamicGroupNodeModel): string[];
+    getNodeStyle(): {
+        [x: string]: unknown;
+        fill?: string | undefined;
+        stroke?: string | undefined;
+        strokeWidth?: number | undefined;
+        radius?: number | undefined;
+        rx?: number | undefined;
+        ry?: number | undefined;
+        width?: number | undefined;
+        height?: number | undefined;
+        path?: string | undefined;
+    };
+    /**
+     * 获取文本样式
+     */
+    getTextStyle(): {
+        [x: string]: unknown;
+        fill?: string | undefined;
+        stroke?: string | undefined;
+        strokeWidth?: number | undefined;
+        radius?: number | undefined;
+        rx?: number | undefined;
+        ry?: number | undefined;
+        width?: number | undefined;
+        height?: number | undefined;
+        path?: string | undefined;
+        overflowMode?: "default" | "autoWrap" | "ellipsis" | undefined;
+        textWidth?: number | undefined; /**
+         * 获取子泳道
+         */
+        background?: LogicFlow.CommonTheme | undefined;
+        wrapPadding?: string | undefined;
+        color?: string | undefined;
+        fontSize: number;
+        lineHeight?: number | undefined;
+        textAnchor?: "middle" | "start" | "end" | undefined;
+        dominantBaseline?: "middle" | "central" | "auto" | "text-bottom" | "alphabetic" | "ideographic" | "mathematical" | "hanging" | "text-top" | undefined;
+    };
+    /**
+     * 获取子泳道
+     */
+    getSubNodes(): any[];
+    /**
+     * 初始化文本位置 - 根据布局方向设置文本位置
+     */
+    updateTextPosition(): void;
+}
+declare const _default: null;
+export default _default;

package/es/pool/LaneModel.js

@@ -0,0 +1,252 @@
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { DynamicGroupNodeModel } from '../dynamic-group';
+import { forEach } from 'lodash-es';
+import { laneConfig } from './constant';
+var LaneModel = /** @class */ (function (_super) {
+    __extends(LaneModel, _super);
+    function LaneModel() {
+        var _this = _super.apply(this, __spreadArray([], __read(arguments), false)) || this;
+        _this.isLane = true;
+        _this.defaultZIndex = -1;
+        return _this;
+    }
+    LaneModel.prototype.initNodeData = function (data) {
+        var _a;
+        _super.prototype.initNodeData.call(this, data);
+        // 泳道特定配置
+        this.width = data.width || laneConfig.defaultWidth;
+        this.height = data.height || laneConfig.defaultHeight;
+        this.draggable = true; // 允许拖拽（实际拖拽逻辑由泳池控制）
+        this.resizable = true; // 允许调整大小
+        this.rotatable = false; // 禁止旋转
+        // 设置泳道层级
+        // 如果传入了zIndex，使用传入的值，否则默认为2
+        // 泳道层级应该比所属泳池高，确保显示在泳池上方
+        this.defaultZIndex = data.zIndex || -1;
+        this.setZIndex(this.defaultZIndex);
+        this.autoToFront = true;
+        this.text.editable = true;
+        this.style.stroke = '#000';
+        this.style.strokeWidth = 1;
+        // 泳道属性配置
+        this.properties = __assign(__assign({}, this.properties), { processRef: '', panels: ['processRef'], direction: ((_a = data.properties) === null || _a === void 0 ? void 0 : _a.direction) || 'vertical' });
+        // 设置折叠尺寸（泳道不支持折叠，设置为与正常尺寸相同）
+        this.collapsedWidth = this.width;
+        this.collapsedHeight = this.height;
+        this.expandWidth = this.width;
+        this.expandHeight = this.height;
+    };
+    LaneModel.prototype.setAttributes = function () {
+        _super.prototype.setAttributes.call(this);
+        this.updateTextPosition();
+    };
+    LaneModel.prototype.setZIndex = function (zIndex) {
+        this.zIndex = Math.min(zIndex, this.defaultZIndex) || this.defaultZIndex;
+    };
+    /**
+     * 重写折叠方法 - 泳道不支持折叠
+     */
+    LaneModel.prototype.toggleCollapse = function () {
+        // 泳道不支持折叠功能，保持展开状态
+        this.isCollapsed = false;
+        this.setProperties({ isCollapsed: false });
+    };
+    /**
+     * 获取所属泳池ID
+     */
+    LaneModel.prototype.getPoolId = function () {
+        var _this = this;
+        try {
+            // 检查graphModel是否存在
+            if (!this.graphModel) {
+                console.warn('GraphModel is not available');
+                return null;
+            }
+            // 安全地获取泳池ID
+            var poolModel = this.graphModel.nodes.find(function (node) {
+                return node.children && node.children.has(_this.id);
+            });
+            return (poolModel === null || poolModel === void 0 ? void 0 : poolModel.id) || null;
+        }
+        catch (error) {
+            console.error('Error getting pool ID:', error);
+            return null;
+        }
+    };
+    /**
+     * 获取所属泳池模型
+     */
+    LaneModel.prototype.getPoolModel = function () {
+        try {
+            var poolId = this.getPoolId();
+            if (!poolId) {
+                return null;
+            }
+            // 检查graphModel是否存在
+            if (!this.graphModel) {
+                console.warn('GraphModel is not available for getting pool model');
+                return null;
+            }
+            var poolModel = this.graphModel.getNodeModelById(poolId);
+            return poolModel || null;
+        }
+        catch (error) {
+            console.error('Error getting pool model:', error);
+            return null;
+        }
+    };
+    /**
+     * 动态修改泳道属性
+     */
+    LaneModel.prototype.changeAttribute = function (_a) {
+        var width = _a.width, height = _a.height, x = _a.x, y = _a.y;
+        if (width)
+            this.width = width; // 更新宽度
+        if (height)
+            this.height = height; // 更新高度
+        if (x)
+            this.x = x; // 更新X坐标
+        if (y)
+            this.y = y; // 更新Y坐标
+    };
+    /**
+     * 重写获取数据方法，添加泳道特定属性
+     */
+    LaneModel.prototype.getData = function () {
+        var data = _super.prototype.getData.call(this);
+        // const poolModel = this.getPoolModel()
+        return __assign(__assign({}, data), { properties: __assign(__assign({}, data.properties), { width: this.width, height: this.height, processRef: this.properties.processRef, direction: this.properties.direction }) });
+    };
+    /**
+     * 重写 isAllowAppendIn，禁止 Lane 嵌套
+     */
+    LaneModel.prototype.isAllowAppendIn = function (nodeData) {
+        // 禁止 Lane 节点被添加到 Lane 中
+        return String(nodeData.type) !== 'lane';
+    };
+    /**
+     * 获取需要移动的节点
+     * @param groupModel
+     */
+    LaneModel.prototype.getNodesInGroup = function (groupModel) {
+        var _this = this;
+        var nodeIds = [];
+        var parent = groupModel.properties.parent, isDragging = groupModel.isDragging;
+        if (isDragging && parent) {
+            nodeIds.push(parent);
+        }
+        forEach(Array.from(groupModel.children), function (nodeId) {
+            var nodeModel = _this.graphModel.getNodeModelById(nodeId);
+            // 只有非 Lane 类型的节点才会被带动
+            if (nodeModel &&
+                !nodeModel.isDragging &&
+                String(nodeModel.type) !== 'lane') {
+                nodeIds.push(nodeId);
+            }
+        });
+        return nodeIds;
+    };
+    LaneModel.prototype.getNodeStyle = function () {
+        var style = _super.prototype.getNodeStyle.call(this);
+        style.strokeWidth = 2;
+        return style;
+    };
+    /**
+     * 获取文本样式
+     */
+    LaneModel.prototype.getTextStyle = function () {
+        var _a = this.properties.isHorizontal, isHorizontal = _a === void 0 ? false : _a;
+        var style = _super.prototype.getTextStyle.call(this);
+        style.overflowMode = 'ellipsis';
+        style.strokeWidth = 2;
+        style.textWidth = isHorizontal ? this.height : this.width;
+        style.textHeight = isHorizontal ? this.width : this.height;
+        if (isHorizontal) {
+            style.transform = 'rotate(-90deg)';
+            style.textAlign = 'center';
+        }
+        return style;
+    };
+    /**
+     * 获取子泳道
+     */
+    LaneModel.prototype.getSubNodes = function () {
+        var _this = this;
+        var children = [];
+        Array.from(this.children).forEach(function (childId) {
+            var childModel = _this.graphModel.getNodeModelById(childId);
+            if (childModel) {
+                children.push(childModel);
+            }
+        });
+        return children;
+    };
+    /**
+     * 初始化文本位置 - 根据布局方向设置文本位置
+     */
+    LaneModel.prototype.updateTextPosition = function () {
+        if (this.properties.isHorizontal) {
+            // 横向泳池：文本显示在左侧标题区域
+            this.text.x = this.x - this.width / 2 + laneConfig.titleSize / 2;
+            this.text.y = this.y;
+        }
+        else {
+            // 纵向泳池：文本显示在顶部标题区域
+            this.text.x = this.x;
+            this.text.y = this.y - this.height / 2 + laneConfig.titleSize / 2;
+        }
+    };
+    return LaneModel;
+}(DynamicGroupNodeModel));
+export { LaneModel };
+export default null;

package/es/pool/LaneView.d.ts

@@ -0,0 +1,40 @@
+/**
+ * 基于DynamicGroup重新实现的泳道节点组件
+ * 继承DynamicGroupNodeModel和DynamicGroupNode，提供泳道特定功能
+ */
+import { h } from '@logicflow/core';
+import { DynamicGroupNode } from '../dynamic-group';
+export declare class LaneView extends DynamicGroupNode {
+    getAppendAreaShape(): h.JSX.Element | null;
+    getShape(): import("preact").VNode<import("preact").ClassAttributes<HTMLElement>>;
+    /**
+     * 获取操作图标
+     */
+    getOperateIcons(): (import("preact").VNode<import("preact").ClassAttributes<HTMLElement> & {
+        cursor: string;
+        onClick: () => void;
+    }> | import("preact").VNode<import("preact").ClassAttributes<HTMLElement> & {
+        cursor: string;
+        onClick: () => void;
+        width: number;
+        height: number;
+        transform: string;
+    }>)[];
+    addBeforeLaneIcon(isHorizontal: boolean, callback: () => void): import("preact").VNode<import("preact").ClassAttributes<HTMLElement> & {
+        cursor: string;
+        onClick: () => void;
+    }>;
+    addAfterLaneIcon(isHorizontal: boolean, callback: () => void): import("preact").VNode<import("preact").ClassAttributes<HTMLElement> & {
+        cursor: string;
+        onClick: () => void;
+    }>;
+    deleteLaneIcon(callback: () => void): import("preact").VNode<import("preact").ClassAttributes<HTMLElement> & {
+        cursor: string;
+        onClick: () => void;
+        width: number;
+        height: number;
+        transform: string;
+    }>;
+}
+declare const _default: null;
+export default _default;