@logicflow/vue-node-registry 1.2.0-alpha.2 → 1.2.0-alpha.3
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.
- package/.turbo/turbo-build$colon$dev.log +2 -2
- package/.turbo/turbo-build.log +4 -4
- package/CHANGELOG.md +8 -0
- package/dist/index.css +122 -0
- package/es/components/container.d.ts +19 -0
- package/es/components/container.js +27 -0
- package/es/components/container.js.map +1 -0
- package/es/components/titleBar.d.ts +24 -0
- package/es/components/titleBar.js +160 -0
- package/es/components/titleBar.js.map +1 -0
- package/es/index.css +122 -0
- package/es/index.less +1 -0
- package/es/model.d.ts +18 -1
- package/es/model.js +45 -5
- package/es/model.js.map +1 -1
- package/es/style/index.css +122 -0
- package/es/style/index.less +140 -0
- package/es/style/raw.d.ts +4 -0
- package/es/style/raw.js +6 -0
- package/es/style/raw.js.map +1 -0
- package/es/utils/size.d.ts +2 -0
- package/es/utils/size.js +14 -0
- package/es/utils/size.js.map +1 -0
- package/es/view.d.ts +9 -0
- package/es/view.js +137 -12
- package/es/view.js.map +1 -1
- package/lib/components/container.d.ts +19 -0
- package/lib/components/container.js +30 -0
- package/lib/components/container.js.map +1 -0
- package/lib/components/titleBar.d.ts +24 -0
- package/lib/components/titleBar.js +163 -0
- package/lib/components/titleBar.js.map +1 -0
- package/lib/index.css +122 -0
- package/lib/index.less +1 -0
- package/lib/model.d.ts +18 -1
- package/lib/model.js +43 -3
- package/lib/model.js.map +1 -1
- package/lib/style/index.css +122 -0
- package/lib/style/index.less +140 -0
- package/lib/style/raw.d.ts +4 -0
- package/lib/style/raw.js +9 -0
- package/lib/style/raw.js.map +1 -0
- package/lib/utils/size.d.ts +2 -0
- package/lib/utils/size.js +19 -0
- package/lib/utils/size.js.map +1 -0
- package/lib/view.d.ts +9 -0
- package/lib/view.js +136 -11
- package/lib/view.js.map +1 -1
- package/package.json +3 -3
- package/rollup.config.js +52 -0
- package/src/assets/arrow.svg +10 -0
- package/src/components/container.ts +36 -0
- package/src/components/titleBar.ts +189 -0
- package/src/index.less +1 -0
- package/src/model.ts +81 -3
- package/src/style/index.less +140 -0
- package/src/style/raw.ts +129 -0
- package/src/utils/size.ts +22 -0
- package/src/view.ts +138 -10
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
|
|
2
|
-
> @logicflow/vue-node-registry@1.2.0-alpha.
|
|
2
|
+
> @logicflow/vue-node-registry@1.2.0-alpha.2 build:dev /Users/didi/Desktop/github/LogicFlow/packages/vue-node-registry
|
|
3
3
|
> rss
|
|
4
4
|
|
|
5
5
|
> [build:dev] pnpm run --if-present build:less && run-p -s build:cjs build:esm
|
|
6
6
|
|
|
7
|
-
> @logicflow/vue-node-registry@1.2.0-alpha.
|
|
7
|
+
> @logicflow/vue-node-registry@1.2.0-alpha.2 build:less /Users/didi/Desktop/github/LogicFlow/packages/vue-node-registry
|
|
8
8
|
> rss
|
|
9
9
|
|
|
10
10
|
> [build:less] ./scripts/build-less
|
package/.turbo/turbo-build.log
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
|
|
2
|
-
> @logicflow/vue-node-registry@1.2.0-alpha.
|
|
2
|
+
> @logicflow/vue-node-registry@1.2.0-alpha.2 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.2.0-alpha.
|
|
8
|
+
> @logicflow/vue-node-registry@1.2.0-alpha.2 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
|
|
12
|
-
> [build:umd] pnpm run --if-present build:less && rollup -c ../../rollup.config.js --bundleConfigAsCjs
|
|
13
12
|
> [build:dev] pnpm run --if-present build:less && run-p -s build:cjs build:esm
|
|
13
|
+
> [build:umd] pnpm run --if-present build:less && rollup -c ../../rollup.config.js --bundleConfigAsCjs
|
|
14
14
|
> [build:less] ./scripts/build-less
|
|
15
15
|
> [build:less] ./scripts/build-less
|
|
16
16
|
[36m
|
|
@@ -31,4 +31,4 @@
|
|
|
31
31
|
| |
|
|
32
32
|
+----------------------------------------------+
|
|
33
33
|
[1m[33m(!) [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.[39m[22m
|
|
34
|
-
[32mcreated [1mdist/index.min.js[22m in [
|
|
34
|
+
[32mcreated [1mdist/index.min.js[22m in [1m5.8s[22m[39m
|
package/CHANGELOG.md
CHANGED
package/dist/index.css
ADDED
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
.lf-vue-node-container {
|
|
2
|
+
position: relative;
|
|
3
|
+
display: flex;
|
|
4
|
+
flex-direction: column;
|
|
5
|
+
box-sizing: border-box;
|
|
6
|
+
padding: 6px;
|
|
7
|
+
color: #474747;
|
|
8
|
+
border-radius: 12px;
|
|
9
|
+
box-shadow: 0 0 10px #cad2e15f;
|
|
10
|
+
}
|
|
11
|
+
.lf-vue-node-content-wrap {
|
|
12
|
+
display: flex;
|
|
13
|
+
flex: 1 1 auto;
|
|
14
|
+
justify-content: center;
|
|
15
|
+
}
|
|
16
|
+
.lf-vue-node-title {
|
|
17
|
+
display: flex;
|
|
18
|
+
align-items: flex-start;
|
|
19
|
+
justify-content: space-between;
|
|
20
|
+
box-sizing: border-box;
|
|
21
|
+
margin-bottom: 4px;
|
|
22
|
+
padding: 0 8px;
|
|
23
|
+
backdrop-filter: saturate(180%) blur(4px);
|
|
24
|
+
}
|
|
25
|
+
.lf-vue-node-title-expanded {
|
|
26
|
+
margin-bottom: 6px;
|
|
27
|
+
padding-bottom: 8px;
|
|
28
|
+
border-bottom: 1px solid #eaeaea;
|
|
29
|
+
}
|
|
30
|
+
@supports not (backdrop-filter: blur(1px)) {
|
|
31
|
+
.lf-vue-node-title {
|
|
32
|
+
backdrop-filter: none;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
.lf-vue-node-title-left {
|
|
36
|
+
display: flex;
|
|
37
|
+
gap: 6px;
|
|
38
|
+
align-items: center;
|
|
39
|
+
min-width: 0;
|
|
40
|
+
}
|
|
41
|
+
.lf-vue-node-title-icon {
|
|
42
|
+
display: inline-block;
|
|
43
|
+
width: 16px;
|
|
44
|
+
height: 16px;
|
|
45
|
+
color: #666;
|
|
46
|
+
font-style: normal;
|
|
47
|
+
line-height: 16px;
|
|
48
|
+
text-align: center;
|
|
49
|
+
}
|
|
50
|
+
.lf-vue-node-title-text {
|
|
51
|
+
overflow: hidden;
|
|
52
|
+
color: #333;
|
|
53
|
+
font-weight: 500;
|
|
54
|
+
font-size: 14px;
|
|
55
|
+
white-space: nowrap;
|
|
56
|
+
text-overflow: ellipsis;
|
|
57
|
+
}
|
|
58
|
+
.lf-vue-node-title-actions {
|
|
59
|
+
display: flex;
|
|
60
|
+
gap: 6px;
|
|
61
|
+
align-items: center;
|
|
62
|
+
}
|
|
63
|
+
.lf-vue-node-title-expand,
|
|
64
|
+
.lf-vue-node-title-more {
|
|
65
|
+
display: inline-flex;
|
|
66
|
+
align-items: center;
|
|
67
|
+
justify-content: center;
|
|
68
|
+
width: 20px;
|
|
69
|
+
height: 20px;
|
|
70
|
+
padding: 2px;
|
|
71
|
+
background: transparent;
|
|
72
|
+
border: none;
|
|
73
|
+
border-radius: 4px;
|
|
74
|
+
cursor: pointer;
|
|
75
|
+
transition: background 0.15s ease;
|
|
76
|
+
appearance: none;
|
|
77
|
+
}
|
|
78
|
+
.lf-vue-node-title-expand:hover,
|
|
79
|
+
.lf-vue-node-title-more:hover {
|
|
80
|
+
background: rgba(0, 0, 0, 0.06);
|
|
81
|
+
}
|
|
82
|
+
.lf-vue-node-title-expand-icon {
|
|
83
|
+
color: #666;
|
|
84
|
+
font-style: normal;
|
|
85
|
+
transition: transform 0.3s ease;
|
|
86
|
+
}
|
|
87
|
+
.lf-vue-node-title-more-icon {
|
|
88
|
+
color: #666;
|
|
89
|
+
font-style: normal;
|
|
90
|
+
}
|
|
91
|
+
.lf-vue-node-title-tooltip {
|
|
92
|
+
position: absolute;
|
|
93
|
+
top: -50px;
|
|
94
|
+
right: -135px;
|
|
95
|
+
min-width: 120px;
|
|
96
|
+
max-width: 240px;
|
|
97
|
+
padding: 6px 8px;
|
|
98
|
+
background: #fff;
|
|
99
|
+
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
100
|
+
border-radius: 6px;
|
|
101
|
+
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
|
|
102
|
+
transform: translateY(calc(100% + 4px));
|
|
103
|
+
transition: opacity 0.15s ease, transform 0.15s ease;
|
|
104
|
+
}
|
|
105
|
+
.lf-vue-node-title-tooltip-list {
|
|
106
|
+
display: flex;
|
|
107
|
+
flex-direction: column;
|
|
108
|
+
gap: 4px;
|
|
109
|
+
}
|
|
110
|
+
.lf-vue-node-title-tooltip-item {
|
|
111
|
+
display: flex;
|
|
112
|
+
align-items: center;
|
|
113
|
+
justify-content: flex-start;
|
|
114
|
+
padding: 6px;
|
|
115
|
+
color: #333;
|
|
116
|
+
font-size: 12px;
|
|
117
|
+
border-radius: 4px;
|
|
118
|
+
cursor: pointer;
|
|
119
|
+
}
|
|
120
|
+
.lf-vue-node-title-tooltip-item:hover {
|
|
121
|
+
background: rgba(0, 0, 0, 0.05);
|
|
122
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export declare const Container: import("vue-demi").DefineComponent<{
|
|
2
|
+
node: {
|
|
3
|
+
type: ObjectConstructor;
|
|
4
|
+
required: true;
|
|
5
|
+
};
|
|
6
|
+
graph: {
|
|
7
|
+
type: ObjectConstructor;
|
|
8
|
+
required: true;
|
|
9
|
+
};
|
|
10
|
+
}, unknown, unknown, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, {}, string, import("vue-demi").PublicProps, Readonly<import("vue-demi").ExtractPropTypes<{
|
|
11
|
+
node: {
|
|
12
|
+
type: ObjectConstructor;
|
|
13
|
+
required: true;
|
|
14
|
+
};
|
|
15
|
+
graph: {
|
|
16
|
+
type: ObjectConstructor;
|
|
17
|
+
required: true;
|
|
18
|
+
};
|
|
19
|
+
}>>, {}, {}>;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { defineComponent, h } from 'vue-demi';
|
|
2
|
+
import { TitleBar } from './titleBar';
|
|
3
|
+
export var Container = defineComponent({
|
|
4
|
+
name: 'LFVueNodeContainer',
|
|
5
|
+
props: {
|
|
6
|
+
node: { type: Object, required: true },
|
|
7
|
+
graph: { type: Object, required: true },
|
|
8
|
+
},
|
|
9
|
+
render: function () {
|
|
10
|
+
var _a, _b;
|
|
11
|
+
var props = ((_a = this.node) === null || _a === void 0 ? void 0 : _a.properties) || {};
|
|
12
|
+
var children = [];
|
|
13
|
+
var titleColor = props.style.titleColor || '#E5EEFC';
|
|
14
|
+
if (props._showTitle) {
|
|
15
|
+
children.push(h(TitleBar, { node: this.node, graph: this.graph }));
|
|
16
|
+
}
|
|
17
|
+
console.log('props._expanded', props._expanded);
|
|
18
|
+
if (props._expanded === true) {
|
|
19
|
+
children.push(h('div', { class: 'lf-vue-node-content-wrap' }, ((_b = this.$slots) === null || _b === void 0 ? void 0 : _b.default) ? this.$slots.default() : []));
|
|
20
|
+
}
|
|
21
|
+
return h('div', {
|
|
22
|
+
class: 'lf-vue-node-container',
|
|
23
|
+
style: " background: linear-gradient(180deg, ".concat(titleColor, " 0%, #FFFFFF 24px)"),
|
|
24
|
+
}, children);
|
|
25
|
+
},
|
|
26
|
+
});
|
|
27
|
+
//# sourceMappingURL=container.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"container.js","sourceRoot":"","sources":["../../src/components/container.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,CAAC,EAAE,MAAM,UAAU,CAAA;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,MAAM,CAAC,IAAM,SAAS,GAAG,eAAe,CAAC;IACvC,IAAI,EAAE,oBAAoB;IAC1B,KAAK,EAAE;QACL,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE;QACtC,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE;KACxC;IACD,MAAM;;QACJ,IAAM,KAAK,GAAG,CAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,UAAU,KAAI,EAAE,CAAA;QACzC,IAAM,QAAQ,GAAU,EAAE,CAAA;QAC1B,IAAM,UAAU,GAAG,KAAK,CAAC,KAAK,CAAC,UAAU,IAAI,SAAS,CAAA;QACtD,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC;YACrB,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAA;QACpE,CAAC;QACD,OAAO,CAAC,GAAG,CAAC,iBAAiB,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;QAC/C,IAAI,KAAK,CAAC,SAAS,KAAK,IAAI,EAAE,CAAC;YAC7B,QAAQ,CAAC,IAAI,CACX,CAAC,CACC,KAAK,EACL,EAAE,KAAK,EAAE,0BAA0B,EAAE,EACrC,CAAA,MAAA,IAAI,CAAC,MAAM,0CAAE,OAAO,EAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,EAAE,CAClD,CACF,CAAA;QACH,CAAC;QACD,OAAO,CAAC,CACN,KAAK,EACL;YACE,KAAK,EAAE,uBAAuB;YAC9B,KAAK,EAAE,+CAAwC,UAAU,uBAAoB;SAC9E,EACD,QAAQ,CACT,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
export declare const TitleBar: import("vue-demi").DefineComponent<{
|
|
2
|
+
node: {
|
|
3
|
+
type: ObjectConstructor;
|
|
4
|
+
required: true;
|
|
5
|
+
};
|
|
6
|
+
graph: {
|
|
7
|
+
type: ObjectConstructor;
|
|
8
|
+
required: true;
|
|
9
|
+
};
|
|
10
|
+
}, unknown, {
|
|
11
|
+
showTooltip: boolean;
|
|
12
|
+
}, {}, {
|
|
13
|
+
toggleExpand(): void;
|
|
14
|
+
runAction(act: any): void;
|
|
15
|
+
}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, {}, string, import("vue-demi").PublicProps, Readonly<import("vue-demi").ExtractPropTypes<{
|
|
16
|
+
node: {
|
|
17
|
+
type: ObjectConstructor;
|
|
18
|
+
required: true;
|
|
19
|
+
};
|
|
20
|
+
graph: {
|
|
21
|
+
type: ObjectConstructor;
|
|
22
|
+
required: true;
|
|
23
|
+
};
|
|
24
|
+
}>>, {}, {}>;
|
|
@@ -0,0 +1,160 @@
|
|
|
1
|
+
import { defineComponent, h } from 'vue-demi';
|
|
2
|
+
import { isNumber, isEmpty } from 'lodash-es';
|
|
3
|
+
export var TitleBar = defineComponent({
|
|
4
|
+
name: 'LFVueNodeTitleBar',
|
|
5
|
+
props: {
|
|
6
|
+
node: { type: Object, required: true },
|
|
7
|
+
graph: { type: Object, required: true },
|
|
8
|
+
},
|
|
9
|
+
data: function () {
|
|
10
|
+
return {
|
|
11
|
+
showTooltip: false,
|
|
12
|
+
};
|
|
13
|
+
},
|
|
14
|
+
mounted: function () {
|
|
15
|
+
var _this = this;
|
|
16
|
+
var _a, _b;
|
|
17
|
+
var trigger = ((_b = (_a = this.node) === null || _a === void 0 ? void 0 : _a.properties) === null || _b === void 0 ? void 0 : _b.titleTrigger) === 'hover'
|
|
18
|
+
? 'hover'
|
|
19
|
+
: 'click';
|
|
20
|
+
var moreBtn = this.$refs.moreBtn || null;
|
|
21
|
+
var tooltip = this.$refs.tooltip || null;
|
|
22
|
+
var onDoc = function (e) {
|
|
23
|
+
if (!tooltip || !moreBtn)
|
|
24
|
+
return;
|
|
25
|
+
var t = e.target;
|
|
26
|
+
if (_this.showTooltip && !tooltip.contains(t) && !moreBtn.contains(t)) {
|
|
27
|
+
_this.showTooltip = false;
|
|
28
|
+
}
|
|
29
|
+
};
|
|
30
|
+
if (trigger === 'hover' && moreBtn && tooltip) {
|
|
31
|
+
moreBtn.addEventListener('mouseenter', function () {
|
|
32
|
+
_this.showTooltip = true;
|
|
33
|
+
});
|
|
34
|
+
moreBtn.addEventListener('mouseleave', function () {
|
|
35
|
+
_this.showTooltip = false;
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
else if (trigger === 'click' && moreBtn) {
|
|
39
|
+
moreBtn.addEventListener('click', function (e) {
|
|
40
|
+
e.stopPropagation();
|
|
41
|
+
_this.showTooltip = !_this.showTooltip;
|
|
42
|
+
});
|
|
43
|
+
document.addEventListener('click', onDoc);
|
|
44
|
+
this.$once &&
|
|
45
|
+
this.$once('hook:beforeDestroy', function () {
|
|
46
|
+
document.removeEventListener('click', onDoc);
|
|
47
|
+
});
|
|
48
|
+
}
|
|
49
|
+
},
|
|
50
|
+
methods: {
|
|
51
|
+
toggleExpand: function () {
|
|
52
|
+
var _a, _b, _c;
|
|
53
|
+
var cur = !!((_b = (_a = this.node) === null || _a === void 0 ? void 0 : _a.properties) === null || _b === void 0 ? void 0 : _b._expanded);
|
|
54
|
+
(_c = this.node) === null || _c === void 0 ? void 0 : _c.setProperty('_expanded', !cur);
|
|
55
|
+
},
|
|
56
|
+
runAction: function (act) {
|
|
57
|
+
try {
|
|
58
|
+
typeof (act === null || act === void 0 ? void 0 : act.callback) === 'function' &&
|
|
59
|
+
act.callback(this.node, this.graph);
|
|
60
|
+
}
|
|
61
|
+
finally {
|
|
62
|
+
this.showTooltip = false;
|
|
63
|
+
}
|
|
64
|
+
},
|
|
65
|
+
},
|
|
66
|
+
render: function () {
|
|
67
|
+
var _this = this;
|
|
68
|
+
var _a, _b;
|
|
69
|
+
var props = ((_a = this.node) === null || _a === void 0 ? void 0 : _a.properties) || {};
|
|
70
|
+
var icon = props._icon;
|
|
71
|
+
var title = props._title || '';
|
|
72
|
+
var expanded = !!props._expanded;
|
|
73
|
+
var _titleHeight = isNumber(props._titleHeight) ? props._titleHeight : 28;
|
|
74
|
+
var actions = ((_b = this.node) === null || _b === void 0 ? void 0 : _b.__actions) || [];
|
|
75
|
+
var showMoreAction = !isEmpty(actions);
|
|
76
|
+
console.log('showMoreAction', actions, props._titleActions);
|
|
77
|
+
var bar = h('div', {
|
|
78
|
+
class: expanded
|
|
79
|
+
? 'lf-vue-node-title lf-vue-node-title-expanded'
|
|
80
|
+
: 'lf-vue-node-title',
|
|
81
|
+
style: "height:".concat(expanded ? _titleHeight : 18, "px;"),
|
|
82
|
+
title: title,
|
|
83
|
+
}, [
|
|
84
|
+
h('div', { class: 'lf-vue-node-title-left' }, [
|
|
85
|
+
icon
|
|
86
|
+
? h('i', {
|
|
87
|
+
class: 'lf-vue-node-title-icon',
|
|
88
|
+
}, icon)
|
|
89
|
+
: null,
|
|
90
|
+
h('span', {
|
|
91
|
+
class: 'lf-vue-node-title-text',
|
|
92
|
+
}, title),
|
|
93
|
+
]),
|
|
94
|
+
h('div', { class: 'lf-vue-node-title-actions' }, [
|
|
95
|
+
h('button', {
|
|
96
|
+
ref: 'expandBtn',
|
|
97
|
+
class: 'lf-vue-node-title-expand',
|
|
98
|
+
onClick: function (e) {
|
|
99
|
+
console.log('expandClicked');
|
|
100
|
+
e.stopPropagation();
|
|
101
|
+
_this.toggleExpand();
|
|
102
|
+
},
|
|
103
|
+
on: {
|
|
104
|
+
click: function (e) {
|
|
105
|
+
console.log('expandClicked');
|
|
106
|
+
e.stopPropagation();
|
|
107
|
+
_this.toggleExpand();
|
|
108
|
+
},
|
|
109
|
+
},
|
|
110
|
+
}, [
|
|
111
|
+
h('svg', {
|
|
112
|
+
width: 14,
|
|
113
|
+
height: 12,
|
|
114
|
+
viewBox: '0 0 14 12',
|
|
115
|
+
xmlns: 'http://www.w3.org/2000/svg',
|
|
116
|
+
class: 'lf-vue-node-title-expand-icon',
|
|
117
|
+
style: "transform:".concat(expanded ? 'rotate(180deg)' : 'rotate(0deg)', ";"),
|
|
118
|
+
}, [
|
|
119
|
+
h('path', {
|
|
120
|
+
d: 'M0.5201124,5.47988755C0.23603013,5.7639699,0.24460429,6.2271326,0.53900635,6.5005059L6.3195491,11.8681526C6.7032304,12.2244282,7.2967696,12.2244282,7.6804514,11.8681526L13.460994,6.5005059C13.755396,6.2271326,13.76397,5.7639699,13.479888,5.47988755C13.211547,5.21154633,12.779465,5.20215771,12.499721,5.45858961L7.3378625,10.1902928C7.1467018,10.3655233,6.8532982,10.3655233,6.6621375,10.1902928L1.5002797,5.45858967C1.2205358,5.20215771,0.78845364,5.21154633,0.5201124,5.47988755Z',
|
|
121
|
+
fill: '#474747',
|
|
122
|
+
}),
|
|
123
|
+
h('path', {
|
|
124
|
+
d: 'M0.5201124,0.47988755C0.23603013,0.7639699,0.24460429,1.2271326,0.53900635,1.5005059L6.3195491,6.8681526C6.7032304,7.2244282,7.2967696,7.2244282,7.6804514,6.8681526L13.460994,1.5005059C13.755396,1.2271326,13.76397,0.7639699,13.479888,0.47988755C13.211547,0.21154633,12.779465,0.20215771,12.499721,0.45858961L7.3378625,5.1902928C7.1467018,5.3655233,6.8532982,5.3655233,6.6621375,5.1902928L1.5002797,0.45858967C1.2205358,0.20215771,0.78845364,0.21154633,0.5201124,0.47988755Z',
|
|
125
|
+
fill: '#9B9B9B',
|
|
126
|
+
}),
|
|
127
|
+
]),
|
|
128
|
+
]),
|
|
129
|
+
showMoreAction &&
|
|
130
|
+
h('button', {
|
|
131
|
+
ref: 'moreBtn',
|
|
132
|
+
class: 'lf-vue-node-title-more',
|
|
133
|
+
}, [h('i', { class: 'lf-vue-node-title-more-icon' }, '⋯')]),
|
|
134
|
+
h('div', {
|
|
135
|
+
ref: 'tooltip',
|
|
136
|
+
class: 'lf-vue-node-title-tooltip',
|
|
137
|
+
style: "opacity:".concat(this.showTooltip ? 1 : 0, ";pointer-events:").concat(this.showTooltip ? 'auto' : 'none', ";"),
|
|
138
|
+
}, [
|
|
139
|
+
h('div', { class: 'lf-vue-node-title-tooltip-list' }, actions.map(function (act) {
|
|
140
|
+
return h('div', {
|
|
141
|
+
class: 'lf-vue-node-title-tooltip-item',
|
|
142
|
+
onClick: function (e) {
|
|
143
|
+
e.stopPropagation();
|
|
144
|
+
_this.runAction(act);
|
|
145
|
+
},
|
|
146
|
+
on: {
|
|
147
|
+
click: function (e) {
|
|
148
|
+
e.stopPropagation();
|
|
149
|
+
_this.runAction(act);
|
|
150
|
+
},
|
|
151
|
+
},
|
|
152
|
+
}, (act === null || act === void 0 ? void 0 : act.name) || '');
|
|
153
|
+
})),
|
|
154
|
+
]),
|
|
155
|
+
]),
|
|
156
|
+
]);
|
|
157
|
+
return bar;
|
|
158
|
+
},
|
|
159
|
+
});
|
|
160
|
+
//# sourceMappingURL=titleBar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"titleBar.js","sourceRoot":"","sources":["../../src/components/titleBar.ts"],"names":[],"mappings":"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"}
|
package/es/index.css
ADDED
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
.lf-vue-node-container {
|
|
2
|
+
position: relative;
|
|
3
|
+
display: flex;
|
|
4
|
+
flex-direction: column;
|
|
5
|
+
box-sizing: border-box;
|
|
6
|
+
padding: 6px;
|
|
7
|
+
color: #474747;
|
|
8
|
+
border-radius: 12px;
|
|
9
|
+
box-shadow: 0 0 10px #cad2e15f;
|
|
10
|
+
}
|
|
11
|
+
.lf-vue-node-content-wrap {
|
|
12
|
+
display: flex;
|
|
13
|
+
flex: 1 1 auto;
|
|
14
|
+
justify-content: center;
|
|
15
|
+
}
|
|
16
|
+
.lf-vue-node-title {
|
|
17
|
+
display: flex;
|
|
18
|
+
align-items: flex-start;
|
|
19
|
+
justify-content: space-between;
|
|
20
|
+
box-sizing: border-box;
|
|
21
|
+
margin-bottom: 4px;
|
|
22
|
+
padding: 0 8px;
|
|
23
|
+
backdrop-filter: saturate(180%) blur(4px);
|
|
24
|
+
}
|
|
25
|
+
.lf-vue-node-title-expanded {
|
|
26
|
+
margin-bottom: 6px;
|
|
27
|
+
padding-bottom: 8px;
|
|
28
|
+
border-bottom: 1px solid #eaeaea;
|
|
29
|
+
}
|
|
30
|
+
@supports not (backdrop-filter: blur(1px)) {
|
|
31
|
+
.lf-vue-node-title {
|
|
32
|
+
backdrop-filter: none;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
.lf-vue-node-title-left {
|
|
36
|
+
display: flex;
|
|
37
|
+
gap: 6px;
|
|
38
|
+
align-items: center;
|
|
39
|
+
min-width: 0;
|
|
40
|
+
}
|
|
41
|
+
.lf-vue-node-title-icon {
|
|
42
|
+
display: inline-block;
|
|
43
|
+
width: 16px;
|
|
44
|
+
height: 16px;
|
|
45
|
+
color: #666;
|
|
46
|
+
font-style: normal;
|
|
47
|
+
line-height: 16px;
|
|
48
|
+
text-align: center;
|
|
49
|
+
}
|
|
50
|
+
.lf-vue-node-title-text {
|
|
51
|
+
overflow: hidden;
|
|
52
|
+
color: #333;
|
|
53
|
+
font-weight: 500;
|
|
54
|
+
font-size: 14px;
|
|
55
|
+
white-space: nowrap;
|
|
56
|
+
text-overflow: ellipsis;
|
|
57
|
+
}
|
|
58
|
+
.lf-vue-node-title-actions {
|
|
59
|
+
display: flex;
|
|
60
|
+
gap: 6px;
|
|
61
|
+
align-items: center;
|
|
62
|
+
}
|
|
63
|
+
.lf-vue-node-title-expand,
|
|
64
|
+
.lf-vue-node-title-more {
|
|
65
|
+
display: inline-flex;
|
|
66
|
+
align-items: center;
|
|
67
|
+
justify-content: center;
|
|
68
|
+
width: 20px;
|
|
69
|
+
height: 20px;
|
|
70
|
+
padding: 2px;
|
|
71
|
+
background: transparent;
|
|
72
|
+
border: none;
|
|
73
|
+
border-radius: 4px;
|
|
74
|
+
cursor: pointer;
|
|
75
|
+
transition: background 0.15s ease;
|
|
76
|
+
appearance: none;
|
|
77
|
+
}
|
|
78
|
+
.lf-vue-node-title-expand:hover,
|
|
79
|
+
.lf-vue-node-title-more:hover {
|
|
80
|
+
background: rgba(0, 0, 0, 0.06);
|
|
81
|
+
}
|
|
82
|
+
.lf-vue-node-title-expand-icon {
|
|
83
|
+
color: #666;
|
|
84
|
+
font-style: normal;
|
|
85
|
+
transition: transform 0.3s ease;
|
|
86
|
+
}
|
|
87
|
+
.lf-vue-node-title-more-icon {
|
|
88
|
+
color: #666;
|
|
89
|
+
font-style: normal;
|
|
90
|
+
}
|
|
91
|
+
.lf-vue-node-title-tooltip {
|
|
92
|
+
position: absolute;
|
|
93
|
+
top: -50px;
|
|
94
|
+
right: -135px;
|
|
95
|
+
min-width: 120px;
|
|
96
|
+
max-width: 240px;
|
|
97
|
+
padding: 6px 8px;
|
|
98
|
+
background: #fff;
|
|
99
|
+
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
100
|
+
border-radius: 6px;
|
|
101
|
+
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
|
|
102
|
+
transform: translateY(calc(100% + 4px));
|
|
103
|
+
transition: opacity 0.15s ease, transform 0.15s ease;
|
|
104
|
+
}
|
|
105
|
+
.lf-vue-node-title-tooltip-list {
|
|
106
|
+
display: flex;
|
|
107
|
+
flex-direction: column;
|
|
108
|
+
gap: 4px;
|
|
109
|
+
}
|
|
110
|
+
.lf-vue-node-title-tooltip-item {
|
|
111
|
+
display: flex;
|
|
112
|
+
align-items: center;
|
|
113
|
+
justify-content: flex-start;
|
|
114
|
+
padding: 6px;
|
|
115
|
+
color: #333;
|
|
116
|
+
font-size: 12px;
|
|
117
|
+
border-radius: 4px;
|
|
118
|
+
cursor: pointer;
|
|
119
|
+
}
|
|
120
|
+
.lf-vue-node-title-tooltip-item:hover {
|
|
121
|
+
background: rgba(0, 0, 0, 0.05);
|
|
122
|
+
}
|
package/es/index.less
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@import url('./style/index.less');
|
package/es/model.d.ts
CHANGED
|
@@ -1,4 +1,9 @@
|
|
|
1
|
-
import LogicFlow, { HtmlNodeModel, IHtmlNodeProperties } from '@logicflow/core';
|
|
1
|
+
import LogicFlow, { GraphModel, BaseNodeModel, HtmlNodeModel, IHtmlNodeProperties } from '@logicflow/core';
|
|
2
|
+
import NodeConfig = LogicFlow.NodeConfig;
|
|
3
|
+
export type NodeAction = {
|
|
4
|
+
name: string;
|
|
5
|
+
callback?: (node: BaseNodeModel, graph: GraphModel) => void;
|
|
6
|
+
};
|
|
2
7
|
export interface VueCustomProperties extends IHtmlNodeProperties {
|
|
3
8
|
width?: number;
|
|
4
9
|
height?: number;
|
|
@@ -7,10 +12,22 @@ export interface VueCustomProperties extends IHtmlNodeProperties {
|
|
|
7
12
|
refY?: number;
|
|
8
13
|
style?: LogicFlow.CommonTheme;
|
|
9
14
|
textStyle?: LogicFlow.TextNodeTheme;
|
|
15
|
+
_showTitle?: boolean;
|
|
16
|
+
_title?: string;
|
|
17
|
+
_icon?: string;
|
|
18
|
+
_titleHeight?: number;
|
|
19
|
+
_expanded?: boolean;
|
|
10
20
|
}
|
|
11
21
|
export declare class VueNodeModel<P extends VueCustomProperties = VueCustomProperties> extends HtmlNodeModel<P> {
|
|
22
|
+
private __baseHeight?;
|
|
23
|
+
__actions?: {
|
|
24
|
+
name: string;
|
|
25
|
+
callback?: (node: BaseNodeModel, graph: GraphModel) => void;
|
|
26
|
+
}[];
|
|
27
|
+
constructor(data: NodeConfig<P>, graphModel: GraphModel);
|
|
12
28
|
setAttributes(): void;
|
|
13
29
|
getTextStyle(): LogicFlow.TextNodeTheme;
|
|
14
30
|
getNodeStyle(): LogicFlow.CommonTheme;
|
|
31
|
+
setNodeActions(actions: NodeAction[]): void;
|
|
15
32
|
}
|
|
16
33
|
export default VueNodeModel;
|
package/es/model.js
CHANGED
|
@@ -24,16 +24,46 @@ var __assign = (this && this.__assign) || function () {
|
|
|
24
24
|
};
|
|
25
25
|
return __assign.apply(this, arguments);
|
|
26
26
|
};
|
|
27
|
-
import { HtmlNodeModel } from '@logicflow/core';
|
|
28
|
-
import { cloneDeep, isNil } from 'lodash-es';
|
|
27
|
+
import { HtmlNodeModel, } from '@logicflow/core';
|
|
28
|
+
import { cloneDeep, isNil, isArray, isEmpty } from 'lodash-es';
|
|
29
29
|
var VueNodeModel = /** @class */ (function (_super) {
|
|
30
30
|
__extends(VueNodeModel, _super);
|
|
31
|
-
function VueNodeModel() {
|
|
32
|
-
|
|
31
|
+
function VueNodeModel(data, graphModel) {
|
|
32
|
+
var _this = _super.call(this, data, graphModel) || this;
|
|
33
|
+
var properties = data.properties;
|
|
34
|
+
// 如果需要展示标题,则重新设置一个能把节点内容都展示出来的最小宽高
|
|
35
|
+
if (properties) {
|
|
36
|
+
var _a = properties._showTitle, _showTitle = _a === void 0 ? false : _a, _b = properties.style, style = _b === void 0 ? {} : _b;
|
|
37
|
+
if (_showTitle) {
|
|
38
|
+
_this.minWidth = 160;
|
|
39
|
+
_this.minHeight = 80;
|
|
40
|
+
_this.text.editable = false;
|
|
41
|
+
// 判断当前节点宽高是否小于最小宽高,如果是,强制设置为最小宽高
|
|
42
|
+
var newWidth = _this.width < _this.minWidth ? _this.minWidth : _this.width;
|
|
43
|
+
var newHeight = _this.height < _this.minHeight ? _this.minHeight : _this.height;
|
|
44
|
+
_this.setProperties(__assign(__assign({ _expanded: false }, properties), { style: __assign({ overflow: 'visible' }, cloneDeep(style)), width: newWidth + 8, height: newHeight + 8 }));
|
|
45
|
+
_this.setNodeActions([
|
|
46
|
+
{
|
|
47
|
+
name: '复制',
|
|
48
|
+
callback: function (nodeModel, graphModel) {
|
|
49
|
+
graphModel.cloneNode(nodeModel.id);
|
|
50
|
+
},
|
|
51
|
+
},
|
|
52
|
+
{
|
|
53
|
+
name: '删除',
|
|
54
|
+
callback: function (nodeModel, graphModel) {
|
|
55
|
+
graphModel.deleteNode(nodeModel.id);
|
|
56
|
+
},
|
|
57
|
+
},
|
|
58
|
+
]);
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
console.log('nodeModel', _this);
|
|
62
|
+
return _this;
|
|
33
63
|
}
|
|
34
64
|
VueNodeModel.prototype.setAttributes = function () {
|
|
35
65
|
// DONE: 解决 width、height、radius 为 0 时的问题
|
|
36
|
-
var _a = this.properties, width = _a.width, height = _a.height, radius = _a.radius;
|
|
66
|
+
var _a = this.properties, width = _a.width, height = _a.height, radius = _a.radius, _showTitle = _a._showTitle, _titleHeight = _a._titleHeight;
|
|
37
67
|
if (!isNil(width)) {
|
|
38
68
|
this.width = width;
|
|
39
69
|
}
|
|
@@ -43,6 +73,12 @@ var VueNodeModel = /** @class */ (function (_super) {
|
|
|
43
73
|
if (!isNil(radius)) {
|
|
44
74
|
this.radius = radius;
|
|
45
75
|
}
|
|
76
|
+
if (this.__baseHeight === undefined) {
|
|
77
|
+
this.__baseHeight = isNil(height) ? this.height : height;
|
|
78
|
+
}
|
|
79
|
+
var extra = _showTitle ? (_titleHeight !== null && _titleHeight !== void 0 ? _titleHeight : 28) : 0;
|
|
80
|
+
var base = isNil(height) ? this.__baseHeight : height;
|
|
81
|
+
this.height = base + extra;
|
|
46
82
|
};
|
|
47
83
|
VueNodeModel.prototype.getTextStyle = function () {
|
|
48
84
|
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;
|
|
@@ -55,6 +91,10 @@ var VueNodeModel = /** @class */ (function (_super) {
|
|
|
55
91
|
var customNodeStyle = this.properties.style;
|
|
56
92
|
return __assign(__assign({}, style), (cloneDeep(customNodeStyle) || {}));
|
|
57
93
|
};
|
|
94
|
+
VueNodeModel.prototype.setNodeActions = function (actions) {
|
|
95
|
+
this.__actions =
|
|
96
|
+
isArray(actions) && !isEmpty(actions) ? cloneDeep(actions) : [];
|
|
97
|
+
};
|
|
58
98
|
return VueNodeModel;
|
|
59
99
|
}(HtmlNodeModel));
|
|
60
100
|
export { VueNodeModel };
|
package/es/model.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"model.js","sourceRoot":"","sources":["../src/model.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAkB,
|
|
1
|
+
{"version":3,"file":"model.js","sourceRoot":"","sources":["../src/model.ts"],"names":[],"mappings":"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"}
|