@logicflow/extension 2.2.0 → 2.2.1

package/es/tools/label/mediumEditor.js

@@ -36,56 +36,93 @@ export var defaultOptions = {
     },
     disableEditing: true,
 };
-export var ColorPickerButton = MediumEditor.extensions.button.extend({
-    name: 'colorpicker',
-    tagNames: ['mark'],
-    contentDefault: '<b>Color</b>',
-    aria: 'Color Picker',
-    action: 'colorPicker',
-    init: function () {
-        var _this = this;
-        rangy.init();
-        MediumEditor.extensions.button.prototype.init.call(this);
-        this.colorPicker = new Picker({
-            parent: this.button,
-            color: '#000',
-            onDone: function (res) {
-                if (_this.coloredText && _this.coloredText.isAppliedToSelection()) {
-                    _this.coloredText.undoToSelection();
-                }
-                _this.coloredText = rangy.createClassApplier('colored', {
-                    elementTagName: 'span',
-                    elementProperties: {
-                        style: {
-                            color: res.hex,
-                        },
-                    },
-                    normalize: true,
-                });
-                _this.coloredText.toggleSelection();
-                _this.base.checkContentChanged();
-                _this.setInactive();
-            },
-        });
-    },
-    getButton: function () {
-        return this.button;
-    },
-    handleClick: function () {
-        this.setActive();
-        this.colorPicker.show();
-    },
-    isAlreadyApplied: function (node) {
-        return node.nodeName.toLowerCase() === 'mark';
-    },
-    isActive: function () {
-        return this.button.classList.contains('medium-editor-button-active');
-    },
-    setInactive: function () {
-        this.button.classList.remove('medium-editor-button-active');
-    },
-    setActive: function () {
-        this.button.classList.add('medium-editor-button-active');
-    },
-});
+export function createColorPickerButtonClass(MediumEditor) {
+    var _a, _b;
+    var ButtonBase = ((_a = MediumEditor === null || MediumEditor === void 0 ? void 0 : MediumEditor.extensions) === null || _a === void 0 ? void 0 : _a.button) || ((_b = MediumEditor === null || MediumEditor === void 0 ? void 0 : MediumEditor.extensions) === null || _b === void 0 ? void 0 : _b.button);
+    var ExtensionBase = (MediumEditor === null || MediumEditor === void 0 ? void 0 : MediumEditor.Extension) || (MediumEditor === null || MediumEditor === void 0 ? void 0 : MediumEditor.Extension);
+    // 当 Button 扩展基类不可用时，回退到 Extension 基类，避免在模块加载阶段抛错
+    var Base = ButtonBase || ExtensionBase;
+    if (!Base) {
+        console.warn('MediumEditor button/extension base not available; using noop extension');
+        return /** @class */ (function () {
+            function class_1() {
+            }
+            return class_1;
+        }());
+    }
+    return Base.extend({
+        name: 'colorpicker',
+        tagNames: ['mark'],
+        contentDefault: '<b>Color</b>',
+        aria: 'Color Picker',
+        action: 'colorPicker',
+        init: function () {
+            var _this = this;
+            var _a, _b;
+            try {
+                rangy.init();
+            }
+            catch (_c) {
+                console.error('rangy.init failed');
+            }
+            // 初始化按钮（ButtonBase 才有 prototype.init）
+            try {
+                ;
+                (_b = (_a = ButtonBase === null || ButtonBase === void 0 ? void 0 : ButtonBase.prototype) === null || _a === void 0 ? void 0 : _a.init) === null || _b === void 0 ? void 0 : _b.call(this);
+            }
+            catch (_d) {
+                console.error('ButtonBase.init failed');
+            }
+            this.colorPicker = new Picker({
+                parent: this.button || undefined,
+                color: '#000',
+                onDone: function (res) {
+                    var _a, _b, _c, _d, _e;
+                    try {
+                        if (_this.coloredText && ((_b = (_a = _this.coloredText).isAppliedToSelection) === null || _b === void 0 ? void 0 : _b.call(_a))) {
+                            _this.coloredText.undoToSelection();
+                        }
+                        _this.coloredText = rangy.createClassApplier('colored', {
+                            elementTagName: 'span',
+                            elementProperties: { style: { color: res.hex } },
+                            normalize: true,
+                        });
+                        _this.coloredText.toggleSelection();
+                        (_d = (_c = _this.base) === null || _c === void 0 ? void 0 : _c.checkContentChanged) === null || _d === void 0 ? void 0 : _d.call(_c);
+                        (_e = _this.setInactive) === null || _e === void 0 ? void 0 : _e.call(_this);
+                    }
+                    catch (_f) {
+                        console.error('Picker.onDone failed');
+                    }
+                },
+            });
+        },
+        getButton: function () {
+            return this.button;
+        },
+        handleClick: function () {
+            var _a, _b, _c;
+            (_a = this.setActive) === null || _a === void 0 ? void 0 : _a.call(this);
+            (_c = (_b = this.colorPicker) === null || _b === void 0 ? void 0 : _b.show) === null || _c === void 0 ? void 0 : _c.call(_b);
+        },
+        isAlreadyApplied: function (node) {
+            var _a, _b;
+            return ((_b = (_a = node === null || node === void 0 ? void 0 : node.nodeName) === null || _a === void 0 ? void 0 : _a.toLowerCase) === null || _b === void 0 ? void 0 : _b.call(_a)) === 'mark';
+        },
+        isActive: function () {
+            var _a, _b;
+            return (_b = (_a = this.button) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.contains('medium-editor-button-active');
+        },
+        setInactive: function () {
+            var _a, _b;
+            ;
+            (_b = (_a = this.button) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.remove('medium-editor-button-active');
+        },
+        setActive: function () {
+            var _a, _b;
+            ;
+            (_b = (_a = this.button) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.add('medium-editor-button-active');
+        },
+    });
+}
 export { MediumEditor };

package/es/tools/snapshot/index.d.ts

@@ -110,10 +110,14 @@ export declare class Snapshot {
      */
     private getClassRules;
     /**
-     * 根据浏览器类型获取Canvas尺寸限制
-     * @returns 包含最大主维度和次维度的对象
+     * 根据浏览器对 canvas 的大小限制，计算等比缩放比例
+     * - 参考 MDN 最大的画布尺寸：
+     * https://developer.mozilla.org/zh-CN/docs/Web/HTML/Reference/Elements/canvas#最大的画布尺寸
+     *
+     * @param width
+     * @param height
      */
-    private getCanvasDimensionsByBrowser;
+    private getCanvasScaleRatio;
     /**
      * 将 svg 转化为 canvas
      * @param svg - svg 元素

package/es/tools/snapshot/index.js

@@ -345,24 +345,28 @@ var Snapshot = /** @class */ (function () {
         return rules;
     };
     /**
-     * 根据浏览器类型获取Canvas尺寸限制
-     * @returns 包含最大主维度和次维度的对象
+     * 根据浏览器对 canvas 的大小限制，计算等比缩放比例
+     * - 参考 MDN 最大的画布尺寸：
+     * https://developer.mozilla.org/zh-CN/docs/Web/HTML/Reference/Elements/canvas#最大的画布尺寸
+     *
+     * @param width
+     * @param height
      */
-    Snapshot.prototype.getCanvasDimensionsByBrowser = function () {
-        var userAgent = navigator.userAgent;
-        // 默认值
-        var maxCanvasDimension = 65535;
-        var otherMaxCanvasDimension = 4096;
-        if (userAgent.indexOf('Chrome') !== -1 ||
-            userAgent.indexOf('Edge') !== -1) {
-            maxCanvasDimension = 65535;
-            otherMaxCanvasDimension = 4096;
+    Snapshot.prototype.getCanvasScaleRatio = function (width, height) {
+        /* 单边最大像素 */
+        var maxCanvasSide = 32767;
+        /* 最大像素面积 */
+        var maxCanvasArea = 268435456;
+        var area = width * height;
+        if (width <= maxCanvasSide &&
+            height <= maxCanvasSide &&
+            area <= maxCanvasArea) {
+            return 1;
         }
-        else if (userAgent.indexOf('Firefox') !== -1) {
-            maxCanvasDimension = 32767;
-            otherMaxCanvasDimension = 3814;
-        }
-        return { maxCanvasDimension: maxCanvasDimension, otherMaxCanvasDimension: otherMaxCanvasDimension };
+        var widthScale = maxCanvasSide / width;
+        var heightScale = maxCanvasSide / height;
+        var areaScale = maxCanvasArea / area;
+        return Math.min(widthScale, heightScale, areaScale);
     };
     /**
      * 将 svg 转化为 canvas
@@ -372,14 +376,14 @@ var Snapshot = /** @class */ (function () {
      */
     Snapshot.prototype.getCanvasData = function (svg, toImageOptions) {
         return __awaiter(this, void 0, void 0, function () {
-            var width, height, backgroundColor, _a, padding, copy, dpr, base, bbox, layoutCanvas, layout, offsetX, offsetY, graphModel, transformModel, SCALE_X, SCALE_Y, TRANSLATE_X, TRANSLATE_Y, safetyFactor, actualWidth, actualHeight, bboxWidth, bboxHeight, canvas, safetyMargin, _b, maxCanvasDimension, otherMaxCanvasDimension, MAX_CANVAS_DIMENSION, OTHER_MAX_CANVAS_DIMENSION, targetWidth, targetHeight, scaleWidth, scaleHeight, ctx, img, style, foreignObject;
-            return __generator(this, function (_c) {
-                switch (_c.label) {
+            var width, height, backgroundColor, _a, padding, copy, dpr, base, bbox, layoutCanvas, layout, offsetX, offsetY, graphModel, transformModel, SCALE_X, SCALE_Y, TRANSLATE_X, TRANSLATE_Y, safetyFactor, actualWidth, actualHeight, factorWidth, factorHeight, bboxWidth, bboxHeight, canvas, safetyMargin, targetWidth, targetHeight, scaleRatio, ctx, img, style, foreignObject;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
                     case 0:
                         width = toImageOptions.width, height = toImageOptions.height, backgroundColor = toImageOptions.backgroundColor, _a = toImageOptions.padding, padding = _a === void 0 ? 40 : _a;
                         return [4 /*yield*/, this.cloneSvg(svg, false)];
                     case 1:
-                        copy = _c.sent();
+                        copy = _b.sent();
                         dpr = window.devicePixelRatio || 1;
                         if (dpr < 1) {
                             // https://github.com/didi/LogicFlow/issues/1222
@@ -404,62 +408,42 @@ var Snapshot = /** @class */ (function () {
                         graphModel = this.lf.graphModel;
                         transformModel = graphModel.transformModel;
                         SCALE_X = transformModel.SCALE_X, SCALE_Y = transformModel.SCALE_Y, TRANSLATE_X = transformModel.TRANSLATE_X, TRANSLATE_Y = transformModel.TRANSLATE_Y;
-                        safetyFactor = toImageOptions.safetyFactor || 1.1 // 安全系数，增加10%的空间
+                        safetyFactor = toImageOptions.safetyFactor || 1 // 安全系数，增加10%的空间
                         ;
-                        actualWidth = (bbox.width / SCALE_X) * safetyFactor;
-                        actualHeight = (bbox.height / SCALE_Y) * safetyFactor;
-                        bboxWidth = Math.ceil(actualWidth);
-                        bboxHeight = Math.ceil(actualHeight);
+                        actualWidth = bbox.width / SCALE_X;
+                        actualHeight = bbox.height / SCALE_Y;
+                        factorWidth = actualWidth * (safetyFactor - 1);
+                        factorHeight = actualHeight * (safetyFactor - 1);
+                        bboxWidth = Math.ceil(actualWidth + factorWidth);
+                        bboxHeight = Math.ceil(actualHeight + factorHeight);
                         canvas = document.createElement('canvas');
                         canvas.style.width = "".concat(bboxWidth, "px");
                         canvas.style.height = "".concat(bboxHeight, "px");
-                        safetyMargin = toImageOptions.safetyMargin || 40 // 额外的安全边距
-                        ;
-                        _b = this.getCanvasDimensionsByBrowser(), maxCanvasDimension = _b.maxCanvasDimension, otherMaxCanvasDimension = _b.otherMaxCanvasDimension;
-                        MAX_CANVAS_DIMENSION = maxCanvasDimension;
-                        OTHER_MAX_CANVAS_DIMENSION = otherMaxCanvasDimension;
-                        targetWidth = bboxWidth * dpr + padding * 2 + safetyMargin;
-                        targetHeight = bboxHeight * dpr + padding * 2 + safetyMargin;
-                        scaleWidth = 1 //宽 缩放
-                        ;
-                        scaleHeight = 1 //高 缩放
+                        safetyMargin = toImageOptions.safetyMargin || 0 // 额外的安全边距
                         ;
-                        // 对宽和高分别进行缩放，如chrome，矩形单边最大宽度不超过65535，如宽超过65535，那么高不能超过4096，否则像素会超，也会显示不出。
-                        if (targetWidth > MAX_CANVAS_DIMENSION &&
-                            targetHeight > OTHER_MAX_CANVAS_DIMENSION) {
-                            scaleWidth = MAX_CANVAS_DIMENSION / targetWidth;
-                            scaleHeight = OTHER_MAX_CANVAS_DIMENSION / targetHeight;
-                        }
-                        else if (targetWidth > OTHER_MAX_CANVAS_DIMENSION &&
-                            targetHeight > MAX_CANVAS_DIMENSION) {
-                            scaleWidth = OTHER_MAX_CANVAS_DIMENSION / targetWidth;
-                            scaleHeight = MAX_CANVAS_DIMENSION / targetHeight;
-                        }
-                        else if (targetWidth > MAX_CANVAS_DIMENSION &&
-                            targetHeight < OTHER_MAX_CANVAS_DIMENSION) {
-                            scaleHeight = scaleWidth = MAX_CANVAS_DIMENSION / targetWidth;
-                        }
-                        else if (targetWidth < OTHER_MAX_CANVAS_DIMENSION &&
-                            targetHeight > MAX_CANVAS_DIMENSION) {
-                            scaleHeight = scaleWidth = MAX_CANVAS_DIMENSION / targetHeight;
-                        }
-                        if (scaleWidth < 1 || scaleHeight < 1) {
-                            targetWidth = Math.floor(targetWidth * scaleWidth);
-                            targetHeight = Math.floor(targetHeight * scaleHeight);
+                        targetWidth = bboxWidth * dpr;
+                        targetHeight = bboxHeight * dpr;
+                        scaleRatio = this.getCanvasScaleRatio(targetWidth, targetHeight);
+                        if (scaleRatio < 1) {
+                            targetWidth = Math.floor(targetWidth * scaleRatio);
+                            targetHeight = Math.floor(targetHeight * scaleRatio);
                         }
                         // 将导出区域移动到左上角，canvas 绘制的时候是从左上角开始绘制的
                         // 在transform矩阵中加入padding值，确保左侧元素不会被截断
                         // 对这个矩阵进行缩放，否则会导致截断
                         ;
                         copy.lastChild.style.transform =
-                            "matrix(".concat(scaleWidth, ", 0, 0, ").concat(scaleHeight, ", ").concat((-offsetX + TRANSLATE_X) * (1 / SCALE_X) * scaleWidth + padding / dpr, ", ").concat((-offsetY + TRANSLATE_Y) * (1 / SCALE_Y) * scaleHeight + padding / dpr, ")");
-                        canvas.width = targetWidth;
-                        canvas.height = targetHeight;
+                            "matrix(".concat(scaleRatio, ", 0, 0, ").concat(scaleRatio, ", ").concat((-offsetX + TRANSLATE_X) * (1 / SCALE_X) * scaleRatio +
+                                padding +
+                                factorWidth / 2 +
+                                safetyMargin, ", ").concat((-offsetY + TRANSLATE_Y) * (1 / SCALE_Y) * scaleRatio + padding + factorHeight / 2 + safetyMargin, ")");
+                        canvas.width = targetWidth + (padding + safetyMargin) * 2 * dpr;
+                        canvas.height = targetHeight + (padding + safetyMargin) * 2 * dpr;
                         ctx = canvas.getContext('2d');
                         if (ctx) {
                             // 清空canvas
                             ctx.clearRect(0, 0, canvas.width, canvas.height);
-                            ctx.scale(dpr * scaleWidth, dpr * scaleHeight);
+                            ctx.scale(dpr, dpr);
                             // 如果有背景色，设置流程图导出的背景色
                             if (backgroundColor) {
                                 ctx.fillStyle = backgroundColor;
@@ -666,7 +650,7 @@ var Snapshot = /** @class */ (function () {
     // 内部方法处理blob转换
     Snapshot.prototype.snapshotBlob = function (toImageOptions, baseFileType, backgroundColor) {
         return __awaiter(this, void 0, void 0, function () {
-            var _a, fileType, svg;
+            var _a, fileType, svg, copy, svgString, blob;
             var _this = this;
             return __generator(this, function (_b) {
                 switch (_b.label) {
@@ -676,18 +660,31 @@ var Snapshot = /** @class */ (function () {
                         return [4 /*yield*/, updateImageSource(svg)];
                     case 1:
                         _b.sent();
-                        return [2 /*return*/, new Promise(function (resolve) {
-                                _this.getCanvasData(svg, __assign({ backgroundColor: backgroundColor }, (toImageOptions !== null && toImageOptions !== void 0 ? toImageOptions : {}))).then(function (canvas) {
-                                    canvas.toBlob(function (blob) {
-                                        // 输出图片数据以及图片宽高
-                                        resolve({
-                                            data: blob,
-                                            width: canvas.width,
-                                            height: canvas.height,
-                                        });
-                                    }, "image/".concat(fileType !== null && fileType !== void 0 ? fileType : 'png'));
-                                });
-                            })];
+                        if (!(fileType === 'svg')) return [3 /*break*/, 3];
+                        return [4 /*yield*/, this.cloneSvg(svg)];
+                    case 2:
+                        copy = _b.sent();
+                        svgString = new XMLSerializer().serializeToString(copy);
+                        blob = new Blob([svgString], {
+                            type: 'image/svg+xml;charset=utf-8',
+                        });
+                        return [2 /*return*/, {
+                                data: blob,
+                                width: 0,
+                                height: 0,
+                            }];
+                    case 3: return [2 /*return*/, new Promise(function (resolve) {
+                            _this.getCanvasData(svg, __assign({ backgroundColor: backgroundColor }, (toImageOptions !== null && toImageOptions !== void 0 ? toImageOptions : {}))).then(function (canvas) {
+                                canvas.toBlob(function (blob) {
+                                    // 输出图片数据以及图片宽高
+                                    resolve({
+                                        data: blob,
+                                        width: canvas.width,
+                                        height: canvas.height,
+                                    });
+                                }, "image/".concat(fileType !== null && fileType !== void 0 ? fileType : 'png'));
+                            });
+                        })];
                 }
             });
         });
@@ -704,9 +701,7 @@ var Snapshot = /** @class */ (function () {
             var _this = this;
             return __generator(this, function (_a) {
                 switch (_a.label) {
-                    case 0:
-                        console.log('getSnapshotBase64---------------', backgroundColor, fileType, toImageOptions);
-                        return [4 /*yield*/, this.withExportPreparation(function () { return _this._getSnapshotBase64(backgroundColor, fileType, toImageOptions); }, toImageOptions)];
+                    case 0: return [4 /*yield*/, this.withExportPreparation(function () { return _this._getSnapshotBase64(backgroundColor, fileType, toImageOptions); }, toImageOptions)];
                     case 1: return [2 /*return*/, _a.sent()];
                 }
             });

package/lib/NodeResize/node/RectResize.d.ts

@@ -31,12 +31,6 @@ export declare class RectResizeModel extends RectNodeModel {
     constructor(data: ResizeNodeConfig, graphModel: GraphModel);
     initNodeData(data: any): void;
     getOutlineStyle(): LogicFlow.OutlineTheme;
-    getResizeOutlineStyle(): {
-        fill: string;
-        stroke: string;
-        strokeWidth: number;
-        strokeDasharray: string;
-    };
     getControlPointStyle(): {
         width: number;
         height: number;

package/lib/NodeResize/node/RectResize.js

@@ -51,14 +51,6 @@ var RectResizeModel = /** @class */ (function (_super) {
         }
         return style;
     };
-    RectResizeModel.prototype.getResizeOutlineStyle = function () {
-        return {
-            fill: 'none',
-            stroke: 'transparent', // 矩形默认不显示调整边框
-            strokeWidth: 1,
-            strokeDasharray: '3,3',
-        };
-    };
     RectResizeModel.prototype.getControlPointStyle = function () {
         return {
             width: 7,
@@ -110,8 +102,7 @@ var RectResizeView = /** @class */ (function (_super) {
         return _super.prototype.getShape.call(this);
     };
     RectResizeView.prototype.getShape = function () {
-        var _a = this.props, isSelected = _a.model.isSelected, isSilentMode = _a.graphModel.editConfigModel.isSilentMode;
-        return ((0, jsx_runtime_1.jsxs)("g", { children: [this.getResizeShape(), isSelected && !isSilentMode ? this.getControlGroup() : ''] }));
+        return (0, jsx_runtime_1.jsx)("g", { children: this.getResizeShape() });
     };
     return RectResizeView;
 }(core_1.RectNode));

package/lib/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/lib/bpmn-elements-adapter/json2xml.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.handleAttributes = exports.lfJson2Xml = void 0;
+exports.escapeXml = exports.handleAttributes = exports.lfJson2Xml = void 0;
 /* eslint-disable guard-for-in */
 function type(obj) {
     return Object.prototype.toString.call(obj);
@@ -25,6 +25,18 @@ function handleAttributes(obj) {
     return obj;
 }
 exports.handleAttributes = handleAttributes;
+function escapeXml(text) {
+    if (text == null)
+        return '';
+    return text
+        .toString()
+        .replace(/&/g, '&')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;')
+        .replace(/'/g, '&apos;');
+}
+exports.escapeXml = escapeXml;
 function getAttributes(obj) {
     var tmp = obj;
     try {
@@ -35,7 +47,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
@@ -45,8 +57,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, "]]>");
@@ -74,7 +89,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;
 }

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

@@ -8,6 +8,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.lfXml2Json = void 0;
 var lodash_es_1 = require("lodash-es");
+var json2xml_1 = require("./json2xml");
 // ========================================================================
 //  XML.ObjTree -- XML source code from/to JavaScript object like E4X
 // ========================================================================
@@ -298,13 +299,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 = json2xml_1.escapeXml;
 /*
 // ========================================================================
 

package/lib/components/control/index.d.ts

@@ -4,6 +4,7 @@ type ControlItem = {
     iconClass: string;
     title: string;
     text: string;
+    hideText?: boolean;
     onClick?: (lf: LogicFlow, e: MouseEvent) => void;
     onMouseEnter?: (lf: LogicFlow, e: MouseEvent) => void;
     onMouseLeave?: (lf: LogicFlow, e: MouseEvent) => void;

package/lib/components/control/index.js

@@ -26,6 +26,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Control = void 0;
+var lodash_es_1 = require("lodash-es");
 var Control = /** @class */ (function () {
     function Control(_a) {
         var lf = _a.lf;
@@ -36,6 +37,7 @@ var Control = /** @class */ (function () {
                 iconClass: 'lf-control-zoomOut',
                 title: '缩小流程图',
                 text: '缩小',
+                hideText: false,
                 onClick: function () {
                     _this.lf.zoom(false);
                 },
@@ -45,6 +47,7 @@ var Control = /** @class */ (function () {
                 iconClass: 'lf-control-zoomIn',
                 title: '放大流程图',
                 text: '放大',
+                hideText: false,
                 onClick: function () {
                     _this.lf.zoom(true);
                 },
@@ -54,6 +57,7 @@ var Control = /** @class */ (function () {
                 iconClass: 'lf-control-fit',
                 title: '恢复流程原有尺寸',
                 text: '适应',
+                hideText: false,
                 onClick: function () {
                     _this.lf.resetZoom();
                 },
@@ -63,6 +67,7 @@ var Control = /** @class */ (function () {
                 iconClass: 'lf-control-undo',
                 title: '回到上一步',
                 text: '上一步',
+                hideText: false,
                 onClick: function () {
                     _this.lf.undo();
                 },
@@ -72,6 +77,7 @@ var Control = /** @class */ (function () {
                 iconClass: 'lf-control-redo',
                 title: '移到下一步',
                 text: '下一步',
+                hideText: false,
                 onClick: function () {
                     _this.lf.redo();
                 },
@@ -102,15 +108,16 @@ var Control = /** @class */ (function () {
     };
     Control.prototype.getControlTool = function () {
         var _this = this;
-        var NORMAL = 'lf-control-item';
+        var themeMode = this.lf.graphModel.themeMode;
+        var NORMAL = "lf-control-item-".concat(themeMode, " lf-control-item");
         var DISABLED = 'lf-control-item disabled';
         var controlTool = document.createElement('div');
         var controlElements = [];
-        controlTool.className = 'lf-control';
-        this.controlItems.forEach(function (item) {
+        controlTool.className = "lf-control-".concat(themeMode, " lf-control");
+        var itemsToRender = __spreadArray([], __read(this.controlItems), false);
+        itemsToRender.forEach(function (item) {
             var itemContainer = document.createElement('div');
             var icon = document.createElement('i');
-            var text = document.createElement('span');
             itemContainer.className = DISABLED;
             item.onClick && (itemContainer.onclick = item.onClick.bind(null, _this.lf));
             item.onMouseEnter &&
@@ -118,18 +125,24 @@ var Control = /** @class */ (function () {
             item.onMouseLeave &&
                 (itemContainer.onmouseleave = item.onMouseLeave.bind(null, _this.lf));
             icon.className = item.iconClass;
-            text.className = 'lf-control-text';
-            text.title = item.title;
-            text.innerText = item.text;
-            itemContainer.append(icon, text);
-            switch (item.text) {
-                case '上一步':
+            if ((0, lodash_es_1.isNil)(item.hideText) || item.hideText !== true) {
+                var text = document.createElement('span');
+                text.className = "lf-control-text-".concat(themeMode, " lf-control-text");
+                text.title = item.title;
+                text.innerText = item.text;
+                itemContainer.append(icon, text);
+            }
+            else {
+                itemContainer.append(icon);
+            }
+            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/lib/components/mini-map/index.js

@@ -248,7 +248,7 @@ var MiniMap = /** @class */ (function () {
      * @param options
      */
     MiniMap.prototype.setOption = function (options) {
-        var _a = options.width, width = _a === void 0 ? 150 : _a, _b = options.height, height = _b === void 0 ? 220 : _b, _c = options.showEdge, showEdge = _c === void 0 ? false : _c, _d = options.isShowHeader, isShowHeader = _d === void 0 ? false : _d, _e = options.isShowCloseIcon, isShowCloseIcon = _e === void 0 ? false : _e, leftPosition = options.leftPosition, topPosition = options.topPosition, _f = options.rightPosition, rightPosition = _f === void 0 ? 0 : _f, _g = options.bottomPosition, bottomPosition = _g === void 0 ? 0 : _g, _h = options.headerTitle, headerTitle = _h === void 0 ? '导航' : _h;
+        var _a = options.width, width = _a === void 0 ? 200 : _a, _b = options.height, height = _b === void 0 ? 150 : _b, _c = options.showEdge, showEdge = _c === void 0 ? false : _c, _d = options.isShowHeader, isShowHeader = _d === void 0 ? false : _d, _e = options.isShowCloseIcon, isShowCloseIcon = _e === void 0 ? false : _e, leftPosition = options.leftPosition, topPosition = options.topPosition, _f = options.rightPosition, rightPosition = _f === void 0 ? 0 : _f, _g = options.bottomPosition, bottomPosition = _g === void 0 ? 0 : _g, _h = options.headerTitle, headerTitle = _h === void 0 ? '导航' : _h;
         this.width = width;
         this.height = height;
         this.showEdge = showEdge;