@logicflow/vue-node-registry 1.0.7 → 1.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,11 +1,11 @@
1
1
 
2
- > @logicflow/vue-node-registry@1.0.7 prebuild /Users/r0ger1tlearn/WorkSpace/Github/DiDi/logicflow/packages/vue-node-registry
2
+ > @logicflow/vue-node-registry@1.0.8 prebuild /Users/didi/Desktop/github/LogicFlow/packages/vue-node-registry
3
3
  > rss
4
4
 
5
5
  > [prebuild] run-s -s clean:build
6
6
  > [clean:build] rimraf dist es lib
7
7
 
8
- > @logicflow/vue-node-registry@1.0.7 build /Users/r0ger1tlearn/WorkSpace/Github/DiDi/logicflow/packages/vue-node-registry
8
+ > @logicflow/vue-node-registry@1.0.8 build /Users/didi/Desktop/github/LogicFlow/packages/vue-node-registry
9
9
  > rss
10
10
 
11
11
  > [build] run-p -s build:dev build:umd
@@ -15,20 +15,3 @@
15
15
  > [build:less] ./scripts/build-less
16
16
  
17
17
  ./src/index.ts → dist/index.min.js...
18
- +----------------------------------------------+
19
- | |
20
- | Bundle Format: umd |
21
- | Bundle Name: VueNodeRegistry |
22
- | External Globals: |
23
- |  @logicflow/core: Core |
24
- |  @vue/composition-api: VueCompositionApi |
25
- |  vue: Vue |
26
- | |
27
- | Destination: dist/index.min.js |
28
- | Bundle Size: 390 B |
29
- | Minified Size: 351 B |
30
- | GZipped Size: 200 B |
31
- | |
32
- +----------------------------------------------+
33
- (!) [plugin typescript] @rollup/plugin-typescript: Rollup requires that TypeScript produces ES Modules. Unfortunately your configuration specifies a "module" other than "esnext". Unless you know what you're doing, please change "module" to "esnext" in the target tsconfig.json file or plugin options.
34
- created dist/index.min.js in 3.7s
package/CHANGELOG.md CHANGED
@@ -1,5 +1,35 @@
1
1
  # @logicflow/vue-node-registry
2
2
 
3
+ ## 1.0.9
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+ - @logicflow/core@2.0.8
9
+
10
+ ## 1.0.8
11
+
12
+ ### Patch Changes
13
+
14
+ - fix: 修复一些问题
15
+ - fix: 修复一些问题
16
+ - fix: 修复文本拖拽不符合预期的问题 by ChangeSuger
17
+ - feat: 支持动态修改 Grid 的配置 by ChangeSuger
18
+ - fix: 修复 2.x 与 1.x 下相同的网格线宽,Grid 表现不一致的问题 by ChangeSuger
19
+ - fix: node:dnd-drag 增加事件数据 by HeatonZ
20
+ - fix(extension): 【dynamic-group】修复mousemove和isCollapsed相关问题 by wbccb
21
+ - fix: 修复 windows 系统 node20 环境下样式文件打包失败的问题 by ChangeSuger
22
+ - fix: 修复 node:dnd-drag 事件的类型检查问题 by ChangeSuger
23
+ - fix(example): 修复文档中vue3自定义组件不能正常显示bug by zkt2002
24
+ - fix(core): 在没有拖拽的情况下,Control组件突然销毁,不触发cancelDrag(#1926) by wbccb
25
+ - fix(core): 修复笔记本触摸板点击边事件失效 by wuchenguang1998
26
+ - feat(examples): 添加动画边demo by DymoneLewis
27
+ - fix(core): 类型定义 properties:change 改为 node:properties-change by HeatonZ
28
+ - feat: node-registry 自定义properties类型 by HeatonZ
29
+ - fix(core): 修复 polyline 与多边形节点的交点不正确的问题 by Yuan-ZW
30
+ - Updated dependencies
31
+ - @logicflow/core@2.0.7
32
+
3
33
  ## 1.0.7
4
34
 
5
35
  ### Patch Changes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@logicflow/vue-node-registry",
3
- "version": "1.0.7",
3
+ "version": "1.0.9",
4
4
  "description": "LogicFlow Vue Component Node Registry",
5
5
  "main": "lib/index.js",
6
6
  "module": "es/index.js",
@@ -20,7 +20,7 @@
20
20
  "peerDependencies": {
21
21
  "@vue/composition-api": "^1.0.0-rc.10",
22
22
  "vue": "^2.0.0 || >=3.0.0",
23
- "@logicflow/core": "2.0.6"
23
+ "@logicflow/core": "2.0.8"
24
24
  },
25
25
  "peerDependenciesMeta": {
26
26
  "@vue/composition-api": {
@@ -29,7 +29,7 @@
29
29
  },
30
30
  "devDependencies": {
31
31
  "vue": "^3.0.0",
32
- "@logicflow/core": "2.0.6"
32
+ "@logicflow/core": "2.0.8"
33
33
  },
34
34
  "author": {
35
35
  "name": "boyongjiong",
package/src/model.ts CHANGED
@@ -1,7 +1,7 @@
1
- import LogicFlow, { HtmlNodeModel } from '@logicflow/core'
1
+ import LogicFlow, { HtmlNodeModel, IHtmlNodeProperties } from '@logicflow/core'
2
2
  import { cloneDeep, isNil } from 'lodash-es'
3
3
 
4
- export type CustomProperties = {
4
+ export interface VueCustomProperties extends IHtmlNodeProperties {
5
5
  // 形状属性
6
6
  width?: number
7
7
  height?: number
@@ -16,10 +16,12 @@ export type CustomProperties = {
16
16
  textStyle?: LogicFlow.TextNodeTheme
17
17
  }
18
18
 
19
- export class VueNodeModel extends HtmlNodeModel {
19
+ export class VueNodeModel<
20
+ P extends VueCustomProperties = VueCustomProperties,
21
+ > extends HtmlNodeModel<P> {
20
22
  setAttributes() {
21
23
  // DONE: 解决 width、height、radius 为 0 时的问题
22
- const { width, height, radius } = this.properties as CustomProperties
24
+ const { width, height, radius } = this.properties
23
25
  if (!isNil(width)) {
24
26
  this.width = width
25
27
  }
@@ -32,11 +34,7 @@ export class VueNodeModel extends HtmlNodeModel {
32
34
  }
33
35
 
34
36
  getTextStyle(): LogicFlow.TextNodeTheme {
35
- const {
36
- refX = 0,
37
- refY = 0,
38
- textStyle,
39
- } = this.properties as CustomProperties
37
+ const { refX = 0, refY = 0, textStyle } = this.properties
40
38
  const style = super.getTextStyle()
41
39
 
42
40
  // 通过 transform 重新设置 text 的位置
@@ -52,7 +50,7 @@ export class VueNodeModel extends HtmlNodeModel {
52
50
  const {
53
51
  style: customNodeStyle,
54
52
  // radius = 0, // 第二种方式,设置圆角
55
- } = this.properties as CustomProperties
53
+ } = this.properties
56
54
 
57
55
  return {
58
56
  ...style,
package/dist/index.min.js DELETED
@@ -1,2 +0,0 @@
1
- !function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const e=require("tslib");e.__exportStar(require("./view"),exports),e.__exportStar(require("./model"),exports),e.__exportStar(require("./registry"),exports),e.__exportStar(require("./teleport"),exports)}));
2
- //# sourceMappingURL=index.min.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.min.js","sources":["../src/index.ts"],"sourcesContent":["export * from './view'\nexport * from './model'\nexport * from './registry'\nexport * from './teleport'\n"],"names":["tslib_1","__exportStar","require","exports"],"mappings":"2KAAAA,EAAsBC,aAAAC,QAAA,UAAAC,SACtBH,EAAuBC,aAAAC,QAAA,WAAAC,SACvBH,EAA0BC,aAAAC,QAAA,cAAAC,SAC1BH,EAA0BC,aAAAC,QAAA,cAAAC"}
package/es/index.d.ts DELETED
@@ -1,4 +0,0 @@
1
- export * from './view';
2
- export * from './model';
3
- export * from './registry';
4
- export * from './teleport';
package/es/index.js DELETED
@@ -1,5 +0,0 @@
1
- export * from './view';
2
- export * from './model';
3
- export * from './registry';
4
- export * from './teleport';
5
- //# sourceMappingURL=index.js.map
package/es/index.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAA;AACtB,cAAc,SAAS,CAAA;AACvB,cAAc,YAAY,CAAA;AAC1B,cAAc,YAAY,CAAA"}
package/es/model.d.ts DELETED
@@ -1,16 +0,0 @@
1
- import LogicFlow, { HtmlNodeModel } from '@logicflow/core';
2
- export type CustomProperties = {
3
- width?: number;
4
- height?: number;
5
- radius?: number;
6
- refX?: number;
7
- refY?: number;
8
- style?: LogicFlow.CommonTheme;
9
- textStyle?: LogicFlow.TextNodeTheme;
10
- };
11
- export declare class VueNodeModel extends HtmlNodeModel {
12
- setAttributes(): void;
13
- getTextStyle(): LogicFlow.TextNodeTheme;
14
- getNodeStyle(): LogicFlow.CommonTheme;
15
- }
16
- export default VueNodeModel;
package/es/model.js DELETED
@@ -1,62 +0,0 @@
1
- var __extends = (this && this.__extends) || (function () {
2
- var extendStatics = function (d, b) {
3
- extendStatics = Object.setPrototypeOf ||
4
- ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
5
- function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
6
- return extendStatics(d, b);
7
- };
8
- return function (d, b) {
9
- if (typeof b !== "function" && b !== null)
10
- throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
11
- extendStatics(d, b);
12
- function __() { this.constructor = d; }
13
- d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
14
- };
15
- })();
16
- var __assign = (this && this.__assign) || function () {
17
- __assign = Object.assign || function(t) {
18
- for (var s, i = 1, n = arguments.length; i < n; i++) {
19
- s = arguments[i];
20
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
21
- t[p] = s[p];
22
- }
23
- return t;
24
- };
25
- return __assign.apply(this, arguments);
26
- };
27
- import { HtmlNodeModel } from '@logicflow/core';
28
- import { cloneDeep, isNil } from 'lodash-es';
29
- var VueNodeModel = /** @class */ (function (_super) {
30
- __extends(VueNodeModel, _super);
31
- function VueNodeModel() {
32
- return _super !== null && _super.apply(this, arguments) || this;
33
- }
34
- VueNodeModel.prototype.setAttributes = function () {
35
- // DONE: 解决 width、height、radius 为 0 时的问题
36
- var _a = this.properties, width = _a.width, height = _a.height, radius = _a.radius;
37
- if (!isNil(width)) {
38
- this.width = width;
39
- }
40
- if (!isNil(height)) {
41
- this.height = height;
42
- }
43
- if (!isNil(radius)) {
44
- this.radius = radius;
45
- }
46
- };
47
- VueNodeModel.prototype.getTextStyle = function () {
48
- var _a = this.properties, _b = _a.refX, refX = _b === void 0 ? 0 : _b, _c = _a.refY, refY = _c === void 0 ? 0 : _c, textStyle = _a.textStyle;
49
- var style = _super.prototype.getTextStyle.call(this);
50
- // 通过 transform 重新设置 text 的位置
51
- return __assign(__assign(__assign({}, style), (cloneDeep(textStyle) || {})), { transform: "matrix(1 0 0 1 ".concat(refX, " ").concat(refY, ")") });
52
- };
53
- VueNodeModel.prototype.getNodeStyle = function () {
54
- var style = _super.prototype.getNodeStyle.call(this);
55
- var customNodeStyle = this.properties.style;
56
- return __assign(__assign({}, style), (cloneDeep(customNodeStyle) || {}));
57
- };
58
- return VueNodeModel;
59
- }(HtmlNodeModel));
60
- export { VueNodeModel };
61
- export default VueNodeModel;
62
- //# sourceMappingURL=model.js.map
package/es/model.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"model.js","sourceRoot":"","sources":["../src/model.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAkB,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC1D,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AAiB5C;IAAkC,gCAAa;IAA/C;;IA6CA,CAAC;IA5CC,oCAAa,GAAb;QACE,wCAAwC;QAClC,IAAA,KAA4B,IAAI,CAAC,UAA8B,EAA7D,KAAK,WAAA,EAAE,MAAM,YAAA,EAAE,MAAM,YAAwC,CAAA;QACrE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;YAClB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;QACpB,CAAC;QACD,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC;YACnB,IAAI,CAAC,MAAM,GAAG,MAAM,CAAA;QACtB,CAAC;QACD,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC;YACnB,IAAI,CAAC,MAAM,GAAG,MAAM,CAAA;QACtB,CAAC;IACH,CAAC;IAED,mCAAY,GAAZ;QACQ,IAAA,KAIF,IAAI,CAAC,UAA8B,EAHrC,YAAQ,EAAR,IAAI,mBAAG,CAAC,KAAA,EACR,YAAQ,EAAR,IAAI,mBAAG,CAAC,KAAA,EACR,SAAS,eAC4B,CAAA;QACvC,IAAM,KAAK,GAAG,gBAAK,CAAC,YAAY,WAAE,CAAA;QAElC,6BAA6B;QAC7B,sCACK,KAAK,GACL,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC,KAC/B,SAAS,EAAE,yBAAkB,IAAI,cAAI,IAAI,MAAG,IAC7C;IACH,CAAC;IAED,mCAAY,GAAZ;QACE,IAAM,KAAK,GAAG,gBAAK,CAAC,YAAY,WAAE,CAAA;QAEhC,IAAO,eAAe,GAEpB,IAAI,CAAC,UAA8B,MAFf,CAEe;QAEvC,6BACK,KAAK,GACL,CAAC,SAAS,CAAC,eAAe,CAAC,IAAI,EAAE,CAAC,EAGtC;IACH,CAAC;IACH,mBAAC;AAAD,CAAC,AA7CD,CAAkC,aAAa,GA6C9C;;AAED,eAAe,YAAY,CAAA"}
package/es/registry.d.ts DELETED
@@ -1,12 +0,0 @@
1
- import LogicFlow from '@logicflow/core';
2
- import RegisterConfig = LogicFlow.RegisterConfig;
3
- export type VueNodeConfig = {
4
- type: string;
5
- component: any;
6
- effect?: (keyof LogicFlow.PropertiesType)[];
7
- } & Partial<RegisterConfig>;
8
- export declare const vueNodesMap: Record<string, {
9
- component: any;
10
- effect?: (keyof LogicFlow.PropertiesType)[];
11
- }>;
12
- export declare function register(config: VueNodeConfig, lf: LogicFlow): void;
package/es/registry.js DELETED
@@ -1,19 +0,0 @@
1
- import { VueNodeView } from './view';
2
- import { VueNodeModel } from './model';
3
- export var vueNodesMap = {};
4
- export function register(config, lf) {
5
- var type = config.type, component = config.component, effect = config.effect, CustomNodeView = config.view, CustomNodeModel = config.model;
6
- if (!type) {
7
- throw new Error('You should specify type in config');
8
- }
9
- vueNodesMap[type] = {
10
- component: component,
11
- effect: effect,
12
- };
13
- lf.register({
14
- type: type,
15
- view: CustomNodeView || VueNodeView,
16
- model: CustomNodeModel || VueNodeModel,
17
- });
18
- }
19
- //# sourceMappingURL=registry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"registry.js","sourceRoot":"","sources":["../src/registry.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAA;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAUtC,MAAM,CAAC,IAAM,WAAW,GAMpB,EAAE,CAAA;AAEN,MAAM,UAAU,QAAQ,CAAC,MAAqB,EAAE,EAAa;IAEzD,IAAA,IAAI,GAKF,MAAM,KALJ,EACJ,SAAS,GAIP,MAAM,UAJC,EACT,MAAM,GAGJ,MAAM,OAHF,EACA,cAAc,GAElB,MAAM,KAFY,EACb,eAAe,GACpB,MAAM,MADc,CACd;IAEV,IAAI,CAAC,IAAI,EAAE,CAAC;QACV,MAAM,IAAI,KAAK,CAAC,mCAAmC,CAAC,CAAA;IACtD,CAAC;IACD,WAAW,CAAC,IAAI,CAAC,GAAG;QAClB,SAAS,WAAA;QACT,MAAM,QAAA;KACP,CAAA;IAED,EAAE,CAAC,QAAQ,CAAC;QACV,IAAI,MAAA;QACJ,IAAI,EAAE,cAAc,IAAI,WAAW;QACnC,KAAK,EAAE,eAAe,IAAI,YAAY;KACvC,CAAC,CAAA;AACJ,CAAC"}
package/es/teleport.d.ts DELETED
@@ -1,5 +0,0 @@
1
- import { BaseNodeModel, GraphModel } from '@logicflow/core';
2
- export declare function connect(id: string, component: any, container: HTMLDivElement, node: BaseNodeModel, graph: GraphModel): void;
3
- export declare function disconnect(id: string): void;
4
- export declare function isActive(): boolean;
5
- export declare function getTeleport(): any;
package/es/teleport.js DELETED
@@ -1,59 +0,0 @@
1
- import { defineComponent, h, reactive, isVue3, Teleport, markRaw, Fragment, } from 'vue-demi';
2
- var active = false;
3
- var items = reactive({});
4
- export function connect(id, component, container, node, graph) {
5
- if (active) {
6
- items[id] = markRaw(defineComponent({
7
- render: function () {
8
- return h(Teleport, { to: container }, [
9
- h(component, { node: node, graph: graph }),
10
- ]);
11
- },
12
- provide: function () { return ({
13
- getNode: function () { return node; },
14
- getGraph: function () { return graph; },
15
- }); },
16
- }));
17
- }
18
- }
19
- export function disconnect(id) {
20
- if (active) {
21
- delete items[id];
22
- }
23
- }
24
- export function isActive() {
25
- return active;
26
- }
27
- export function getTeleport() {
28
- if (!isVue3) {
29
- throw new Error('teleport is only available in Vue3');
30
- }
31
- active = true;
32
- return defineComponent({
33
- props: {
34
- flowId: {
35
- type: String,
36
- required: true,
37
- },
38
- },
39
- setup: function (props) {
40
- return function () {
41
- var children = [];
42
- Object.keys(items).forEach(function (id) {
43
- // https://github.com/didi/LogicFlow/issues/1768
44
- // 多个不同的VueNodeView都会connect注册到items中,因此items存储了可能有多个flowId流程图的数据
45
- // 当使用多个LogicFlow时,会创建多个flowId + 同时使用KeepAlive
46
- // 每一次items改变,会触发不同flowId持有的setup()执行,由于每次setup()执行就是遍历items,因此存在多次重复渲染元素的问题
47
- // 即items[0]会在Page1的setup()执行,items[0]也会在Page2的setup()执行,从而生成两个items[0]
48
- // 比对当前界面显示的flowId,只更新items[当前页面flowId:nodeId]的数据
49
- // 比如items[0]属于Page1的数据,那么Page2无论active=true/false,都无法执行items[0]
50
- if (id.startsWith(props.flowId)) {
51
- children.push(items[id]);
52
- }
53
- });
54
- return h(Fragment, {}, children.map(function (item) { return h(item); }));
55
- };
56
- },
57
- });
58
- }
59
- //# sourceMappingURL=teleport.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"teleport.js","sourceRoot":"","sources":["../src/teleport.ts"],"names":[],"mappings":"AACA,OAAO,EACL,eAAe,EACf,CAAC,EACD,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,OAAO,EACP,QAAQ,GACT,MAAM,UAAU,CAAA;AAEjB,IAAI,MAAM,GAAG,KAAK,CAAA;AAClB,IAAM,KAAK,GAAG,QAAQ,CAAyB,EAAE,CAAC,CAAA;AAElD,MAAM,UAAU,OAAO,CACrB,EAAU,EACV,SAAc,EACd,SAAyB,EACzB,IAAmB,EACnB,KAAiB;IAEjB,IAAI,MAAM,EAAE,CAAC;QACX,KAAK,CAAC,EAAE,CAAC,GAAG,OAAO,CACjB,eAAe,CAAC;YACd,MAAM,EAAE;gBACN,OAAA,CAAC,CAAC,QAAQ,EAAE,EAAE,EAAE,EAAE,SAAS,EAAS,EAAE;oBACpC,CAAC,CAAC,SAAS,EAAE,EAAE,IAAI,MAAA,EAAE,KAAK,OAAA,EAAE,CAAC;iBAC9B,CAAC;YAFF,CAEE;YACJ,OAAO,EAAE,cAAM,OAAA,CAAC;gBACd,OAAO,EAAE,cAAM,OAAA,IAAI,EAAJ,CAAI;gBACnB,QAAQ,EAAE,cAAM,OAAA,KAAK,EAAL,CAAK;aACtB,CAAC,EAHa,CAGb;SACH,CAAC,CACH,CAAA;IACH,CAAC;AACH,CAAC;AAED,MAAM,UAAU,UAAU,CAAC,EAAU;IACnC,IAAI,MAAM,EAAE,CAAC;QACX,OAAO,KAAK,CAAC,EAAE,CAAC,CAAA;IAClB,CAAC;AACH,CAAC;AAED,MAAM,UAAU,QAAQ;IACtB,OAAO,MAAM,CAAA;AACf,CAAC;AAED,MAAM,UAAU,WAAW;IACzB,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,IAAI,KAAK,CAAC,oCAAoC,CAAC,CAAA;IACvD,CAAC;IACD,MAAM,GAAG,IAAI,CAAA;IAEb,OAAO,eAAe,CAAC;QACrB,KAAK,EAAE;YACL,MAAM,EAAE;gBACN,IAAI,EAAE,MAAM;gBACZ,QAAQ,EAAE,IAAI;aACf;SACF;QACD,KAAK,YAAC,KAAK;YACT,OAAO;gBACL,IAAM,QAAQ,GAA0B,EAAE,CAAA;gBAC1C,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,UAAC,EAAE;oBAC5B,gDAAgD;oBAChD,iEAAiE;oBACjE,8CAA8C;oBAC9C,4EAA4E;oBAC5E,uEAAuE;oBAEvE,iDAAiD;oBACjD,gEAAgE;oBAChE,IAAI,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC;wBAChC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAA;oBAC1B,CAAC;gBACH,CAAC,CAAC,CAAA;gBACF,OAAO,CAAC,CACN,QAAQ,EACR,EAAE,EACF,QAAQ,CAAC,GAAG,CAAC,UAAC,IAAI,IAAK,OAAA,CAAC,CAAC,IAAI,CAAC,EAAP,CAAO,CAAC,CAChC,CAAA;YACH,CAAC,CAAA;QACH,CAAC;KACF,CAAC,CAAA;AACJ,CAAC"}
package/es/view.d.ts DELETED
@@ -1,14 +0,0 @@
1
- import { HtmlNode } from '@logicflow/core';
2
- export declare class VueNodeView extends HtmlNode {
3
- root?: any;
4
- private vm;
5
- getComponentContainer(): any;
6
- protected targetId(): string;
7
- componentWillUnmount(): void;
8
- setHtml(rootEl: SVGForeignObjectElement): void;
9
- confirmUpdate(_rootEl: SVGForeignObjectElement): void;
10
- protected renderVueComponent(): void;
11
- protected unmountVueComponent(): any;
12
- unmount(): void;
13
- }
14
- export default VueNodeView;
package/es/view.js DELETED
@@ -1,120 +0,0 @@
1
- var __extends = (this && this.__extends) || (function () {
2
- var extendStatics = function (d, b) {
3
- extendStatics = Object.setPrototypeOf ||
4
- ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
5
- function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
6
- return extendStatics(d, b);
7
- };
8
- return function (d, b) {
9
- if (typeof b !== "function" && b !== null)
10
- throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
11
- extendStatics(d, b);
12
- function __() { this.constructor = d; }
13
- d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
14
- };
15
- })();
16
- import { isVue2, isVue3, createApp, h, Vue2 } from 'vue-demi';
17
- import { HtmlNode } from '@logicflow/core';
18
- import { vueNodesMap } from './registry';
19
- import { isActive, connect, disconnect } from './teleport';
20
- var VueNodeView = /** @class */ (function (_super) {
21
- __extends(VueNodeView, _super);
22
- function VueNodeView() {
23
- return _super !== null && _super.apply(this, arguments) || this;
24
- }
25
- VueNodeView.prototype.getComponentContainer = function () {
26
- return this.root;
27
- };
28
- VueNodeView.prototype.targetId = function () {
29
- return "".concat(this.props.graphModel.flowId, ":").concat(this.props.model.id);
30
- };
31
- VueNodeView.prototype.componentWillUnmount = function () {
32
- _super.prototype.componentWillUnmount.call(this);
33
- this.unmount();
34
- };
35
- VueNodeView.prototype.setHtml = function (rootEl) {
36
- var el = document.createElement('div');
37
- el.className = 'custom-vue-node-content';
38
- this.root = el;
39
- rootEl.appendChild(el);
40
- this.renderVueComponent();
41
- };
42
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
43
- VueNodeView.prototype.confirmUpdate = function (_rootEl) {
44
- // TODO: 如有需要,可以先通过继承的方式,自定义该节点的更新逻辑;我们后续会根据实际需求,丰富该功能
45
- // console.log('_rootEl', _rootEl)
46
- };
47
- VueNodeView.prototype.renderVueComponent = function () {
48
- var _a;
49
- this.unmountVueComponent();
50
- var root = this.getComponentContainer();
51
- var _b = this.props, model = _b.model, graphModel = _b.graphModel;
52
- if (root) {
53
- var component_1 = vueNodesMap[model.type].component;
54
- if (component_1) {
55
- if (isVue2) {
56
- var Vue = Vue2;
57
- this.vm = new Vue({
58
- el: root,
59
- render: function (h) {
60
- return h(component_1, {
61
- node: model,
62
- graph: graphModel,
63
- });
64
- },
65
- provide: function () {
66
- return {
67
- getNode: function () { return model; },
68
- getGraph: function () { return graphModel; },
69
- };
70
- },
71
- });
72
- }
73
- else if (isVue3) {
74
- if (isActive()) {
75
- connect(this.targetId(), component_1, root, model, graphModel);
76
- }
77
- else {
78
- this.vm = createApp({
79
- render: function () {
80
- return h(component_1, {
81
- node: model,
82
- graph: graphModel,
83
- });
84
- },
85
- provide: function () {
86
- return {
87
- getNode: function () { return model; },
88
- getGraph: function () { return graphModel; },
89
- };
90
- },
91
- });
92
- (_a = this.vm) === null || _a === void 0 ? void 0 : _a.mount(root);
93
- }
94
- }
95
- }
96
- }
97
- };
98
- VueNodeView.prototype.unmountVueComponent = function () {
99
- var root = this.getComponentContainer();
100
- if (this.vm) {
101
- isVue2 && this.vm.$destroy();
102
- isVue3 && this.vm.unmount();
103
- this.vm = null;
104
- }
105
- if (root) {
106
- root.innerHTML = '';
107
- }
108
- return root;
109
- };
110
- VueNodeView.prototype.unmount = function () {
111
- if (isActive()) {
112
- disconnect(this.targetId());
113
- }
114
- this.unmountVueComponent();
115
- };
116
- return VueNodeView;
117
- }(HtmlNode));
118
- export { VueNodeView };
119
- export default VueNodeView;
120
- //# sourceMappingURL=view.js.map
package/es/view.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"view.js","sourceRoot":"","sources":["../src/view.ts"],"names":[],"mappings":"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"}
package/lib/index.d.ts DELETED
@@ -1,4 +0,0 @@
1
- export * from './view';
2
- export * from './model';
3
- export * from './registry';
4
- export * from './teleport';
package/lib/index.js DELETED
@@ -1,21 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
- for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
- };
16
- Object.defineProperty(exports, "__esModule", { value: true });
17
- __exportStar(require("./view"), exports);
18
- __exportStar(require("./model"), exports);
19
- __exportStar(require("./registry"), exports);
20
- __exportStar(require("./teleport"), exports);
21
- //# sourceMappingURL=index.js.map
package/lib/index.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,yCAAsB;AACtB,0CAAuB;AACvB,6CAA0B;AAC1B,6CAA0B"}
package/lib/model.d.ts DELETED
@@ -1,16 +0,0 @@
1
- import LogicFlow, { HtmlNodeModel } from '@logicflow/core';
2
- export type CustomProperties = {
3
- width?: number;
4
- height?: number;
5
- radius?: number;
6
- refX?: number;
7
- refY?: number;
8
- style?: LogicFlow.CommonTheme;
9
- textStyle?: LogicFlow.TextNodeTheme;
10
- };
11
- export declare class VueNodeModel extends HtmlNodeModel {
12
- setAttributes(): void;
13
- getTextStyle(): LogicFlow.TextNodeTheme;
14
- getNodeStyle(): LogicFlow.CommonTheme;
15
- }
16
- export default VueNodeModel;
package/lib/model.js DELETED
@@ -1,65 +0,0 @@
1
- "use strict";
2
- var __extends = (this && this.__extends) || (function () {
3
- var extendStatics = function (d, b) {
4
- extendStatics = Object.setPrototypeOf ||
5
- ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
6
- function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
7
- return extendStatics(d, b);
8
- };
9
- return function (d, b) {
10
- if (typeof b !== "function" && b !== null)
11
- throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
12
- extendStatics(d, b);
13
- function __() { this.constructor = d; }
14
- d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
15
- };
16
- })();
17
- var __assign = (this && this.__assign) || function () {
18
- __assign = Object.assign || function(t) {
19
- for (var s, i = 1, n = arguments.length; i < n; i++) {
20
- s = arguments[i];
21
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
22
- t[p] = s[p];
23
- }
24
- return t;
25
- };
26
- return __assign.apply(this, arguments);
27
- };
28
- Object.defineProperty(exports, "__esModule", { value: true });
29
- exports.VueNodeModel = void 0;
30
- var core_1 = require("@logicflow/core");
31
- var lodash_es_1 = require("lodash-es");
32
- var VueNodeModel = /** @class */ (function (_super) {
33
- __extends(VueNodeModel, _super);
34
- function VueNodeModel() {
35
- return _super !== null && _super.apply(this, arguments) || this;
36
- }
37
- VueNodeModel.prototype.setAttributes = function () {
38
- // DONE: 解决 width、height、radius 为 0 时的问题
39
- var _a = this.properties, width = _a.width, height = _a.height, radius = _a.radius;
40
- if (!(0, lodash_es_1.isNil)(width)) {
41
- this.width = width;
42
- }
43
- if (!(0, lodash_es_1.isNil)(height)) {
44
- this.height = height;
45
- }
46
- if (!(0, lodash_es_1.isNil)(radius)) {
47
- this.radius = radius;
48
- }
49
- };
50
- VueNodeModel.prototype.getTextStyle = function () {
51
- var _a = this.properties, _b = _a.refX, refX = _b === void 0 ? 0 : _b, _c = _a.refY, refY = _c === void 0 ? 0 : _c, textStyle = _a.textStyle;
52
- var style = _super.prototype.getTextStyle.call(this);
53
- // 通过 transform 重新设置 text 的位置
54
- return __assign(__assign(__assign({}, style), ((0, lodash_es_1.cloneDeep)(textStyle) || {})), { transform: "matrix(1 0 0 1 ".concat(refX, " ").concat(refY, ")") });
55
- };
56
- VueNodeModel.prototype.getNodeStyle = function () {
57
- var style = _super.prototype.getNodeStyle.call(this);
58
- var customNodeStyle = this.properties.style;
59
- return __assign(__assign({}, style), ((0, lodash_es_1.cloneDeep)(customNodeStyle) || {}));
60
- };
61
- return VueNodeModel;
62
- }(core_1.HtmlNodeModel));
63
- exports.VueNodeModel = VueNodeModel;
64
- exports.default = VueNodeModel;
65
- //# sourceMappingURL=model.js.map
package/lib/model.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"model.js","sourceRoot":"","sources":["../src/model.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,wCAA0D;AAC1D,uCAA4C;AAiB5C;IAAkC,gCAAa;IAA/C;;IA6CA,CAAC;IA5CC,oCAAa,GAAb;QACE,wCAAwC;QAClC,IAAA,KAA4B,IAAI,CAAC,UAA8B,EAA7D,KAAK,WAAA,EAAE,MAAM,YAAA,EAAE,MAAM,YAAwC,CAAA;QACrE,IAAI,CAAC,IAAA,iBAAK,EAAC,KAAK,CAAC,EAAE,CAAC;YAClB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;QACpB,CAAC;QACD,IAAI,CAAC,IAAA,iBAAK,EAAC,MAAM,CAAC,EAAE,CAAC;YACnB,IAAI,CAAC,MAAM,GAAG,MAAM,CAAA;QACtB,CAAC;QACD,IAAI,CAAC,IAAA,iBAAK,EAAC,MAAM,CAAC,EAAE,CAAC;YACnB,IAAI,CAAC,MAAM,GAAG,MAAM,CAAA;QACtB,CAAC;IACH,CAAC;IAED,mCAAY,GAAZ;QACQ,IAAA,KAIF,IAAI,CAAC,UAA8B,EAHrC,YAAQ,EAAR,IAAI,mBAAG,CAAC,KAAA,EACR,YAAQ,EAAR,IAAI,mBAAG,CAAC,KAAA,EACR,SAAS,eAC4B,CAAA;QACvC,IAAM,KAAK,GAAG,gBAAK,CAAC,YAAY,WAAE,CAAA;QAElC,6BAA6B;QAC7B,sCACK,KAAK,GACL,CAAC,IAAA,qBAAS,EAAC,SAAS,CAAC,IAAI,EAAE,CAAC,KAC/B,SAAS,EAAE,yBAAkB,IAAI,cAAI,IAAI,MAAG,IAC7C;IACH,CAAC;IAED,mCAAY,GAAZ;QACE,IAAM,KAAK,GAAG,gBAAK,CAAC,YAAY,WAAE,CAAA;QAEhC,IAAO,eAAe,GAEpB,IAAI,CAAC,UAA8B,MAFf,CAEe;QAEvC,6BACK,KAAK,GACL,CAAC,IAAA,qBAAS,EAAC,eAAe,CAAC,IAAI,EAAE,CAAC,EAGtC;IACH,CAAC;IACH,mBAAC;AAAD,CAAC,AA7CD,CAAkC,oBAAa,GA6C9C;AA7CY,oCAAY;AA+CzB,kBAAe,YAAY,CAAA"}
package/lib/registry.d.ts DELETED
@@ -1,12 +0,0 @@
1
- import LogicFlow from '@logicflow/core';
2
- import RegisterConfig = LogicFlow.RegisterConfig;
3
- export type VueNodeConfig = {
4
- type: string;
5
- component: any;
6
- effect?: (keyof LogicFlow.PropertiesType)[];
7
- } & Partial<RegisterConfig>;
8
- export declare const vueNodesMap: Record<string, {
9
- component: any;
10
- effect?: (keyof LogicFlow.PropertiesType)[];
11
- }>;
12
- export declare function register(config: VueNodeConfig, lf: LogicFlow): void;
package/lib/registry.js DELETED
@@ -1,23 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.register = exports.vueNodesMap = void 0;
4
- var view_1 = require("./view");
5
- var model_1 = require("./model");
6
- exports.vueNodesMap = {};
7
- function register(config, lf) {
8
- var type = config.type, component = config.component, effect = config.effect, CustomNodeView = config.view, CustomNodeModel = config.model;
9
- if (!type) {
10
- throw new Error('You should specify type in config');
11
- }
12
- exports.vueNodesMap[type] = {
13
- component: component,
14
- effect: effect,
15
- };
16
- lf.register({
17
- type: type,
18
- view: CustomNodeView || view_1.VueNodeView,
19
- model: CustomNodeModel || model_1.VueNodeModel,
20
- });
21
- }
22
- exports.register = register;
23
- //# sourceMappingURL=registry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"registry.js","sourceRoot":"","sources":["../src/registry.ts"],"names":[],"mappings":";;;AACA,+BAAoC;AACpC,iCAAsC;AAUzB,QAAA,WAAW,GAMpB,EAAE,CAAA;AAEN,SAAgB,QAAQ,CAAC,MAAqB,EAAE,EAAa;IAEzD,IAAA,IAAI,GAKF,MAAM,KALJ,EACJ,SAAS,GAIP,MAAM,UAJC,EACT,MAAM,GAGJ,MAAM,OAHF,EACA,cAAc,GAElB,MAAM,KAFY,EACb,eAAe,GACpB,MAAM,MADc,CACd;IAEV,IAAI,CAAC,IAAI,EAAE,CAAC;QACV,MAAM,IAAI,KAAK,CAAC,mCAAmC,CAAC,CAAA;IACtD,CAAC;IACD,mBAAW,CAAC,IAAI,CAAC,GAAG;QAClB,SAAS,WAAA;QACT,MAAM,QAAA;KACP,CAAA;IAED,EAAE,CAAC,QAAQ,CAAC;QACV,IAAI,MAAA;QACJ,IAAI,EAAE,cAAc,IAAI,kBAAW;QACnC,KAAK,EAAE,eAAe,IAAI,oBAAY;KACvC,CAAC,CAAA;AACJ,CAAC;AAtBD,4BAsBC"}
package/lib/teleport.d.ts DELETED
@@ -1,5 +0,0 @@
1
- import { BaseNodeModel, GraphModel } from '@logicflow/core';
2
- export declare function connect(id: string, component: any, container: HTMLDivElement, node: BaseNodeModel, graph: GraphModel): void;
3
- export declare function disconnect(id: string): void;
4
- export declare function isActive(): boolean;
5
- export declare function getTeleport(): any;
package/lib/teleport.js DELETED
@@ -1,66 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.getTeleport = exports.isActive = exports.disconnect = exports.connect = void 0;
4
- var vue_demi_1 = require("vue-demi");
5
- var active = false;
6
- var items = (0, vue_demi_1.reactive)({});
7
- function connect(id, component, container, node, graph) {
8
- if (active) {
9
- items[id] = (0, vue_demi_1.markRaw)((0, vue_demi_1.defineComponent)({
10
- render: function () {
11
- return (0, vue_demi_1.h)(vue_demi_1.Teleport, { to: container }, [
12
- (0, vue_demi_1.h)(component, { node: node, graph: graph }),
13
- ]);
14
- },
15
- provide: function () { return ({
16
- getNode: function () { return node; },
17
- getGraph: function () { return graph; },
18
- }); },
19
- }));
20
- }
21
- }
22
- exports.connect = connect;
23
- function disconnect(id) {
24
- if (active) {
25
- delete items[id];
26
- }
27
- }
28
- exports.disconnect = disconnect;
29
- function isActive() {
30
- return active;
31
- }
32
- exports.isActive = isActive;
33
- function getTeleport() {
34
- if (!vue_demi_1.isVue3) {
35
- throw new Error('teleport is only available in Vue3');
36
- }
37
- active = true;
38
- return (0, vue_demi_1.defineComponent)({
39
- props: {
40
- flowId: {
41
- type: String,
42
- required: true,
43
- },
44
- },
45
- setup: function (props) {
46
- return function () {
47
- var children = [];
48
- Object.keys(items).forEach(function (id) {
49
- // https://github.com/didi/LogicFlow/issues/1768
50
- // 多个不同的VueNodeView都会connect注册到items中,因此items存储了可能有多个flowId流程图的数据
51
- // 当使用多个LogicFlow时,会创建多个flowId + 同时使用KeepAlive
52
- // 每一次items改变,会触发不同flowId持有的setup()执行,由于每次setup()执行就是遍历items,因此存在多次重复渲染元素的问题
53
- // 即items[0]会在Page1的setup()执行,items[0]也会在Page2的setup()执行,从而生成两个items[0]
54
- // 比对当前界面显示的flowId,只更新items[当前页面flowId:nodeId]的数据
55
- // 比如items[0]属于Page1的数据,那么Page2无论active=true/false,都无法执行items[0]
56
- if (id.startsWith(props.flowId)) {
57
- children.push(items[id]);
58
- }
59
- });
60
- return (0, vue_demi_1.h)(vue_demi_1.Fragment, {}, children.map(function (item) { return (0, vue_demi_1.h)(item); }));
61
- };
62
- },
63
- });
64
- }
65
- exports.getTeleport = getTeleport;
66
- //# sourceMappingURL=teleport.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"teleport.js","sourceRoot":"","sources":["../src/teleport.ts"],"names":[],"mappings":";;;AACA,qCAQiB;AAEjB,IAAI,MAAM,GAAG,KAAK,CAAA;AAClB,IAAM,KAAK,GAAG,IAAA,mBAAQ,EAAyB,EAAE,CAAC,CAAA;AAElD,SAAgB,OAAO,CACrB,EAAU,EACV,SAAc,EACd,SAAyB,EACzB,IAAmB,EACnB,KAAiB;IAEjB,IAAI,MAAM,EAAE,CAAC;QACX,KAAK,CAAC,EAAE,CAAC,GAAG,IAAA,kBAAO,EACjB,IAAA,0BAAe,EAAC;YACd,MAAM,EAAE;gBACN,OAAA,IAAA,YAAC,EAAC,mBAAQ,EAAE,EAAE,EAAE,EAAE,SAAS,EAAS,EAAE;oBACpC,IAAA,YAAC,EAAC,SAAS,EAAE,EAAE,IAAI,MAAA,EAAE,KAAK,OAAA,EAAE,CAAC;iBAC9B,CAAC;YAFF,CAEE;YACJ,OAAO,EAAE,cAAM,OAAA,CAAC;gBACd,OAAO,EAAE,cAAM,OAAA,IAAI,EAAJ,CAAI;gBACnB,QAAQ,EAAE,cAAM,OAAA,KAAK,EAAL,CAAK;aACtB,CAAC,EAHa,CAGb;SACH,CAAC,CACH,CAAA;IACH,CAAC;AACH,CAAC;AArBD,0BAqBC;AAED,SAAgB,UAAU,CAAC,EAAU;IACnC,IAAI,MAAM,EAAE,CAAC;QACX,OAAO,KAAK,CAAC,EAAE,CAAC,CAAA;IAClB,CAAC;AACH,CAAC;AAJD,gCAIC;AAED,SAAgB,QAAQ;IACtB,OAAO,MAAM,CAAA;AACf,CAAC;AAFD,4BAEC;AAED,SAAgB,WAAW;IACzB,IAAI,CAAC,iBAAM,EAAE,CAAC;QACZ,MAAM,IAAI,KAAK,CAAC,oCAAoC,CAAC,CAAA;IACvD,CAAC;IACD,MAAM,GAAG,IAAI,CAAA;IAEb,OAAO,IAAA,0BAAe,EAAC;QACrB,KAAK,EAAE;YACL,MAAM,EAAE;gBACN,IAAI,EAAE,MAAM;gBACZ,QAAQ,EAAE,IAAI;aACf;SACF;QACD,KAAK,YAAC,KAAK;YACT,OAAO;gBACL,IAAM,QAAQ,GAA0B,EAAE,CAAA;gBAC1C,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,UAAC,EAAE;oBAC5B,gDAAgD;oBAChD,iEAAiE;oBACjE,8CAA8C;oBAC9C,4EAA4E;oBAC5E,uEAAuE;oBAEvE,iDAAiD;oBACjD,gEAAgE;oBAChE,IAAI,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC;wBAChC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAA;oBAC1B,CAAC;gBACH,CAAC,CAAC,CAAA;gBACF,OAAO,IAAA,YAAC,EACN,mBAAQ,EACR,EAAE,EACF,QAAQ,CAAC,GAAG,CAAC,UAAC,IAAI,IAAK,OAAA,IAAA,YAAC,EAAC,IAAI,CAAC,EAAP,CAAO,CAAC,CAChC,CAAA;YACH,CAAC,CAAA;QACH,CAAC;KACF,CAAC,CAAA;AACJ,CAAC;AArCD,kCAqCC"}
package/lib/view.d.ts DELETED
@@ -1,14 +0,0 @@
1
- import { HtmlNode } from '@logicflow/core';
2
- export declare class VueNodeView extends HtmlNode {
3
- root?: any;
4
- private vm;
5
- getComponentContainer(): any;
6
- protected targetId(): string;
7
- componentWillUnmount(): void;
8
- setHtml(rootEl: SVGForeignObjectElement): void;
9
- confirmUpdate(_rootEl: SVGForeignObjectElement): void;
10
- protected renderVueComponent(): void;
11
- protected unmountVueComponent(): any;
12
- unmount(): void;
13
- }
14
- export default VueNodeView;
package/lib/view.js DELETED
@@ -1,123 +0,0 @@
1
- "use strict";
2
- var __extends = (this && this.__extends) || (function () {
3
- var extendStatics = function (d, b) {
4
- extendStatics = Object.setPrototypeOf ||
5
- ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
6
- function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
7
- return extendStatics(d, b);
8
- };
9
- return function (d, b) {
10
- if (typeof b !== "function" && b !== null)
11
- throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
12
- extendStatics(d, b);
13
- function __() { this.constructor = d; }
14
- d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
15
- };
16
- })();
17
- Object.defineProperty(exports, "__esModule", { value: true });
18
- exports.VueNodeView = void 0;
19
- var vue_demi_1 = require("vue-demi");
20
- var core_1 = require("@logicflow/core");
21
- var registry_1 = require("./registry");
22
- var teleport_1 = require("./teleport");
23
- var VueNodeView = /** @class */ (function (_super) {
24
- __extends(VueNodeView, _super);
25
- function VueNodeView() {
26
- return _super !== null && _super.apply(this, arguments) || this;
27
- }
28
- VueNodeView.prototype.getComponentContainer = function () {
29
- return this.root;
30
- };
31
- VueNodeView.prototype.targetId = function () {
32
- return "".concat(this.props.graphModel.flowId, ":").concat(this.props.model.id);
33
- };
34
- VueNodeView.prototype.componentWillUnmount = function () {
35
- _super.prototype.componentWillUnmount.call(this);
36
- this.unmount();
37
- };
38
- VueNodeView.prototype.setHtml = function (rootEl) {
39
- var el = document.createElement('div');
40
- el.className = 'custom-vue-node-content';
41
- this.root = el;
42
- rootEl.appendChild(el);
43
- this.renderVueComponent();
44
- };
45
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
46
- VueNodeView.prototype.confirmUpdate = function (_rootEl) {
47
- // TODO: 如有需要,可以先通过继承的方式,自定义该节点的更新逻辑;我们后续会根据实际需求,丰富该功能
48
- // console.log('_rootEl', _rootEl)
49
- };
50
- VueNodeView.prototype.renderVueComponent = function () {
51
- var _a;
52
- this.unmountVueComponent();
53
- var root = this.getComponentContainer();
54
- var _b = this.props, model = _b.model, graphModel = _b.graphModel;
55
- if (root) {
56
- var component_1 = registry_1.vueNodesMap[model.type].component;
57
- if (component_1) {
58
- if (vue_demi_1.isVue2) {
59
- var Vue = vue_demi_1.Vue2;
60
- this.vm = new Vue({
61
- el: root,
62
- render: function (h) {
63
- return h(component_1, {
64
- node: model,
65
- graph: graphModel,
66
- });
67
- },
68
- provide: function () {
69
- return {
70
- getNode: function () { return model; },
71
- getGraph: function () { return graphModel; },
72
- };
73
- },
74
- });
75
- }
76
- else if (vue_demi_1.isVue3) {
77
- if ((0, teleport_1.isActive)()) {
78
- (0, teleport_1.connect)(this.targetId(), component_1, root, model, graphModel);
79
- }
80
- else {
81
- this.vm = (0, vue_demi_1.createApp)({
82
- render: function () {
83
- return (0, vue_demi_1.h)(component_1, {
84
- node: model,
85
- graph: graphModel,
86
- });
87
- },
88
- provide: function () {
89
- return {
90
- getNode: function () { return model; },
91
- getGraph: function () { return graphModel; },
92
- };
93
- },
94
- });
95
- (_a = this.vm) === null || _a === void 0 ? void 0 : _a.mount(root);
96
- }
97
- }
98
- }
99
- }
100
- };
101
- VueNodeView.prototype.unmountVueComponent = function () {
102
- var root = this.getComponentContainer();
103
- if (this.vm) {
104
- vue_demi_1.isVue2 && this.vm.$destroy();
105
- vue_demi_1.isVue3 && this.vm.unmount();
106
- this.vm = null;
107
- }
108
- if (root) {
109
- root.innerHTML = '';
110
- }
111
- return root;
112
- };
113
- VueNodeView.prototype.unmount = function () {
114
- if ((0, teleport_1.isActive)()) {
115
- (0, teleport_1.disconnect)(this.targetId());
116
- }
117
- this.unmountVueComponent();
118
- };
119
- return VueNodeView;
120
- }(core_1.HtmlNode));
121
- exports.VueNodeView = VueNodeView;
122
- exports.default = VueNodeView;
123
- //# sourceMappingURL=view.js.map
package/lib/view.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"view.js","sourceRoot":"","sources":["../src/view.ts"],"names":[],"mappings":"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"}