@logicflow/core 2.1.5 → 2.1.7

package/es/view/edge/BaseEdge.js

@@ -43,6 +43,7 @@ var __read = (this && this.__read) || function (o, n) {
 import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
 import { Component, createRef } from 'preact/compat';
 import { Circle } from '../shape';
+import { isNil, isFunction } from 'lodash-es';
 import { LineText } from '../text';
 import { ElementState, EventType, ModelType, TextMode } from '../../constant';
 import { isMultipleSelect, getClosestPointOfPolyline, degrees, getThetaOfVector, } from '../../util';
@@ -193,6 +194,14 @@ var BaseEdge = /** @class */ (function (_super) {
                     e: e,
                     position: position,
                 });
+                // 会偶现边点击后会马上失去焦点的问题，这里手动让节点获焦以解决这个问题
+                var el_1 = e.currentTarget;
+                var rAF = !isNil(window) && isFunction(window.requestAnimationFrame)
+                    ? window.requestAnimationFrame.bind(window)
+                    : function (fn) { return setTimeout(fn, 0); };
+                rAF(function () {
+                    el_1.focus();
+                });
             }
             var editConfigModel = graphModel.editConfigModel;
             graphModel.selectEdgeById(model.id, isMultipleSelect(e, editConfigModel));

package/es/view/node/BaseNode.js

@@ -54,7 +54,7 @@ var __read = (this && this.__read) || function (o, n) {
 import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
 import { Component } from 'preact/compat';
 import { reaction } from 'mobx';
-import { map } from 'lodash-es';
+import { map, isNil, isFunction } from 'lodash-es';
 import Anchor from '../Anchor';
 import { BaseText } from '../text';
 import { ElementState, EventType, TextMode } from '../../constant';
@@ -239,6 +239,14 @@ var BaseNode = /** @class */ (function (_super) {
             else {
                 graphModel.eventCenter.emit(EventType.ELEMENT_CLICK, eventOptions);
                 graphModel.eventCenter.emit(EventType.NODE_CLICK, eventOptions);
+                // 复制粘贴后会出现点击节点时，节点会失去焦点的问题，这里手动让节点获焦以解决这个问题
+                var el_1 = e.currentTarget;
+                var rAF = !isNil(window) && isFunction(window.requestAnimationFrame)
+                    ? window.requestAnimationFrame.bind(window)
+                    : function (fn) { return setTimeout(fn, 0); };
+                rAF(function () {
+                    el_1.focus();
+                });
             }
         };
         _this.handleContextMenu = function (ev) {

package/lib/view/edge/BaseEdge.js

@@ -69,6 +69,7 @@ exports.BaseEdge = void 0;
 var jsx_runtime_1 = require("preact/jsx-runtime");
 var compat_1 = require("preact/compat");
 var shape_1 = require("../shape");
+var lodash_es_1 = require("lodash-es");
 var text_1 = require("../text");
 var constant_1 = require("../../constant");
 var util_1 = require("../../util");
@@ -219,6 +220,14 @@ var BaseEdge = /** @class */ (function (_super) {
                     e: e,
                     position: position,
                 });
+                // 会偶现边点击后会马上失去焦点的问题，这里手动让节点获焦以解决这个问题
+                var el_1 = e.currentTarget;
+                var rAF = !(0, lodash_es_1.isNil)(window) && (0, lodash_es_1.isFunction)(window.requestAnimationFrame)
+                    ? window.requestAnimationFrame.bind(window)
+                    : function (fn) { return setTimeout(fn, 0); };
+                rAF(function () {
+                    el_1.focus();
+                });
             }
             var editConfigModel = graphModel.editConfigModel;
             graphModel.selectEdgeById(model.id, (0, util_1.isMultipleSelect)(e, editConfigModel));

package/lib/view/node/BaseNode.js

@@ -243,6 +243,14 @@ var BaseNode = /** @class */ (function (_super) {
             else {
                 graphModel.eventCenter.emit(constant_1.EventType.ELEMENT_CLICK, eventOptions);
                 graphModel.eventCenter.emit(constant_1.EventType.NODE_CLICK, eventOptions);
+                // 复制粘贴后会出现点击节点时，节点会失去焦点的问题，这里手动让节点获焦以解决这个问题
+                var el_1 = e.currentTarget;
+                var rAF = !(0, lodash_es_1.isNil)(window) && (0, lodash_es_1.isFunction)(window.requestAnimationFrame)
+                    ? window.requestAnimationFrame.bind(window)
+                    : function (fn) { return setTimeout(fn, 0); };
+                rAF(function () {
+                    el_1.focus();
+                });
             }
         };
         _this.handleContextMenu = function (ev) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@logicflow/core",
-  "version": "2.1.5",
+  "version": "2.1.7",
   "description": "LogicFlow, help you quickly create flowcharts",
   "main": "lib/index.js",
   "module": "es/index.js",

package/src/view/edge/BaseEdge.tsx

@@ -1,5 +1,6 @@
 import { createElement as h, Component, createRef } from 'preact/compat'
 import { Circle } from '../shape'
+import { isNil, isFunction } from 'lodash-es'
 import { LineText } from '../text'
 import LogicFlow from '../../LogicFlow'
 import { GraphModel, BaseEdgeModel, PolylineEdgeModel } from '../../model'
@@ -550,6 +551,15 @@ export abstract class BaseEdge<P extends IProps> extends Component<
         e,
         position,
       })
+      // 会偶现边点击后会马上失去焦点的问题，这里手动让节点获焦以解决这个问题
+      const el = e.currentTarget as HTMLElement
+      const rAF =
+        !isNil(window) && isFunction(window.requestAnimationFrame)
+          ? window.requestAnimationFrame.bind(window)
+          : (fn: () => void) => setTimeout(fn, 0)
+      rAF(() => {
+        el.focus()
+      })
     }
     const { editConfigModel } = graphModel
     graphModel.selectEdgeById(model.id, isMultipleSelect(e, editConfigModel))

package/src/view/node/BaseNode.tsx

@@ -1,6 +1,6 @@
 import { createElement as h, Component } from 'preact/compat'
 import { reaction, IReactionDisposer } from 'mobx'
-import { map } from 'lodash-es'
+import { map, isNil, isFunction } from 'lodash-es'
 import Anchor from '../Anchor'
 import { BaseText } from '../text'
 import LogicFlow from '../../LogicFlow'
@@ -403,6 +403,15 @@ export abstract class BaseNode<P extends IProps = IProps> extends Component<
     } else {
       graphModel.eventCenter.emit(EventType.ELEMENT_CLICK, eventOptions)
       graphModel.eventCenter.emit(EventType.NODE_CLICK, eventOptions)
+      // 复制粘贴后会出现点击节点时，节点会失去焦点的问题，这里手动让节点获焦以解决这个问题
+      const el = e.currentTarget as HTMLElement
+      const rAF =
+        !isNil(window) && isFunction(window.requestAnimationFrame)
+          ? window.requestAnimationFrame.bind(window)
+          : (fn: () => void) => setTimeout(fn, 0)
+      rAF(() => {
+        el.focus()
+      })
     }
   }