@code0-tech/pictor 0.0.0-mvp.28 → 0.0.0-mvp.29
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/dist/assets/components/d-flow-folder/DFlowFolder.style.css +1 -1
- package/dist/components/context-menu/ContextMenu.js +8 -8
- package/dist/components/d-flow/DFlow.d.ts +3 -1
- package/dist/components/d-flow/DFlow.edges.hook.d.ts +2 -2
- package/dist/components/d-flow/DFlow.edges.hook.js +10 -10
- package/dist/components/d-flow/DFlow.js +220 -218
- package/dist/components/d-flow/DFlow.nodes.hook.d.ts +2 -2
- package/dist/components/d-flow/DFlow.nodes.hook.js +66 -63
- package/dist/components/d-flow/DFlow.service.d.ts +7 -3
- package/dist/components/d-flow/DFlow.service.js +2 -2
- package/dist/components/d-flow-data-type/DFlowDataType.service.d.ts +11 -6
- package/dist/components/d-flow-data-type/DFlowDataType.service.js +34 -34
- package/dist/components/d-flow-file/DFlowTabs.d.ts +3 -1
- package/dist/components/d-flow-file/DFlowTabs.js +29 -24
- package/dist/components/d-flow-folder/DFlowFolder.d.ts +16 -8
- package/dist/components/d-flow-folder/DFlowFolder.js +144 -121
- package/dist/components/d-flow-folder/DFlowFolderContextMenu.d.ts +2 -2
- package/dist/components/d-flow-folder/DFlowFolderContextMenu.js +31 -62
- package/dist/components/d-flow-folder/DFlowFolderCreateDialog.d.ts +2 -2
- package/dist/components/d-flow-folder/DFlowFolderDeleteDialog.d.ts +10 -0
- package/dist/components/d-flow-folder/DFlowFolderDeleteDialog.js +55 -0
- package/dist/components/d-flow-folder/DFlowFolderRenameDialog.d.ts +3 -2
- package/dist/components/d-flow-folder/DFlowFolderRenameDialog.js +16 -16
- package/dist/components/d-flow-folder/index.d.ts +3 -0
- package/dist/components/d-flow-folder/index.js +10 -4
- package/dist/components/d-flow-function/DFlowFunction.service.d.ts +8 -3
- package/dist/components/d-flow-function/DFlowFunction.service.js +5 -5
- package/dist/components/d-flow-panel/DFlowPanelLayout.js +14 -14
- package/dist/components/d-flow-type/DFlowType.service.d.ts +8 -3
- package/dist/components/d-flow-type/DFlowType.service.js +5 -5
- package/dist/index.js +221 -215
- package/dist/node_modules/@radix-ui/react-context-menu/dist/index.js +8 -8
- package/dist/node_modules/@radix-ui/react-menu/dist/index.js +4 -4
- package/package.json +1 -2
|
@@ -4,46 +4,49 @@ import "merge-props";
|
|
|
4
4
|
import { DFlowReactiveService as M } from "./DFlow.service.js";
|
|
5
5
|
import { DFlowFunctionReactiveService as C } from "../d-flow-function/DFlowFunction.service.js";
|
|
6
6
|
import { DFlowDataTypeReactiveService as _ } from "../d-flow-data-type/DFlowDataType.service.js";
|
|
7
|
-
import { md5 as
|
|
8
|
-
const
|
|
9
|
-
if (!
|
|
10
|
-
const
|
|
11
|
-
let
|
|
12
|
-
for (const [
|
|
13
|
-
const
|
|
14
|
-
if (
|
|
15
|
-
return
|
|
16
|
-
let
|
|
17
|
-
if (
|
|
18
|
-
|
|
19
|
-
const
|
|
20
|
-
(
|
|
7
|
+
import { md5 as V } from "js-md5";
|
|
8
|
+
const j = /* @__PURE__ */ new Map([["std", "default"]]), q = (i, h) => {
|
|
9
|
+
if (!h || i.size === 0) return "";
|
|
10
|
+
const p = /[:._\-\/\s]+/, n = h.trim().toLowerCase();
|
|
11
|
+
let o = null, u = -1 / 0;
|
|
12
|
+
for (const [l, T] of i.entries()) {
|
|
13
|
+
const a = l.trim().toLowerCase();
|
|
14
|
+
if (n === a)
|
|
15
|
+
return T;
|
|
16
|
+
let e = 0;
|
|
17
|
+
if (n.startsWith(a)) {
|
|
18
|
+
e = 2e3 + a.length * 2;
|
|
19
|
+
const d = n.charAt(a.length);
|
|
20
|
+
(d === "" || p.test(d)) && (e += 200);
|
|
21
21
|
} else {
|
|
22
|
-
const
|
|
23
|
-
let
|
|
24
|
-
for (;
|
|
25
|
-
|
|
26
|
-
if (
|
|
27
|
-
|
|
28
|
-
const
|
|
29
|
-
(
|
|
22
|
+
const d = Math.min(n.length, a.length);
|
|
23
|
+
let s = 0;
|
|
24
|
+
for (; s < d && n.charCodeAt(s) === a.charCodeAt(s); )
|
|
25
|
+
s++;
|
|
26
|
+
if (s > 0) {
|
|
27
|
+
e = 1e3 + s;
|
|
28
|
+
const f = n.charAt(s), g = a.charAt(s);
|
|
29
|
+
(f === "" || p.test(f) || g === "" || p.test(g)) && (e += 50);
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
|
-
|
|
32
|
+
e > u ? (u = e, o = l) : (e === u && o !== null && l.length > o.length || e === u && o === null) && (o = l);
|
|
33
33
|
}
|
|
34
|
-
return
|
|
35
|
-
},
|
|
36
|
-
const
|
|
34
|
+
return o !== null ? i.get(o) : "";
|
|
35
|
+
}, ne = (i, h, p) => {
|
|
36
|
+
const n = b(M), o = B(M), u = b(C), l = B(C), T = b(_), a = B(_), e = w.useMemo(() => n.getById(i, {
|
|
37
|
+
namespaceId: h,
|
|
38
|
+
projectId: p
|
|
39
|
+
}), [i, o]);
|
|
37
40
|
return w.useMemo(() => {
|
|
38
|
-
if (!
|
|
39
|
-
const
|
|
40
|
-
let
|
|
41
|
-
const
|
|
42
|
-
let k = 0;
|
|
43
|
-
const A = () => ++k;
|
|
41
|
+
if (!e) return [];
|
|
42
|
+
const d = [];
|
|
43
|
+
let s = 0;
|
|
44
|
+
const f = /* @__PURE__ */ new Map(), g = /* @__PURE__ */ new Map(), k = (t, r = f) => (r.has(t) || r.set(t, u.getById(t)), r.get(t)), A = (t, r = g) => (r.has(t) || r.set(t, T.getDataType(t)), r.get(t));
|
|
44
45
|
let R = 0;
|
|
45
|
-
|
|
46
|
-
|
|
46
|
+
const E = () => ++R;
|
|
47
|
+
let W = 0;
|
|
48
|
+
d.push({
|
|
49
|
+
id: `${e.id}`,
|
|
47
50
|
type: "trigger",
|
|
48
51
|
position: {
|
|
49
52
|
x: 0,
|
|
@@ -51,67 +54,67 @@ const J = /* @__PURE__ */ new Map([["std", "default"]]), V = (i, d) => {
|
|
|
51
54
|
},
|
|
52
55
|
draggable: !1,
|
|
53
56
|
data: {
|
|
54
|
-
instance:
|
|
57
|
+
instance: e,
|
|
55
58
|
flowId: i
|
|
56
59
|
}
|
|
57
60
|
});
|
|
58
|
-
const
|
|
59
|
-
const m = `${
|
|
60
|
-
|
|
61
|
+
const I = (t, r = !1, K, v = 0, S = [0], y, N = f, D = g) => {
|
|
62
|
+
const m = `${t.id}-${s++}`, L = ++W;
|
|
63
|
+
d.push({
|
|
61
64
|
id: m,
|
|
62
|
-
type:
|
|
65
|
+
type: q(j, t.functionDefinition?.identifier),
|
|
63
66
|
position: {
|
|
64
67
|
x: 0,
|
|
65
68
|
y: 0
|
|
66
69
|
},
|
|
67
70
|
draggable: !1,
|
|
68
|
-
parentId:
|
|
69
|
-
extent:
|
|
71
|
+
parentId: y,
|
|
72
|
+
extent: y ? "parent" : void 0,
|
|
70
73
|
data: {
|
|
71
|
-
nodeId:
|
|
72
|
-
isParameter:
|
|
74
|
+
nodeId: t.id,
|
|
75
|
+
isParameter: r,
|
|
73
76
|
flowId: i,
|
|
74
|
-
linkingId:
|
|
75
|
-
scope:
|
|
77
|
+
linkingId: r ? K : void 0,
|
|
78
|
+
scope: S,
|
|
76
79
|
// scope is now a PATH (number[])
|
|
77
80
|
depth: v,
|
|
78
81
|
// structural depth (0 at root, +1 per group)
|
|
79
|
-
index:
|
|
82
|
+
index: L
|
|
80
83
|
// global node level
|
|
81
84
|
}
|
|
82
85
|
});
|
|
83
|
-
const
|
|
84
|
-
|
|
85
|
-
const F =
|
|
86
|
-
if ((F ?
|
|
87
|
-
if (
|
|
88
|
-
const
|
|
89
|
-
|
|
90
|
-
id:
|
|
86
|
+
const O = k(t.functionDefinition?.id, N);
|
|
87
|
+
t.parameters?.nodes?.forEach((c) => {
|
|
88
|
+
const F = O?.parameterDefinitions.find((x) => x.id == c?.runtimeParameter?.id)?.dataTypeIdentifier;
|
|
89
|
+
if ((F ? A(F, D) : void 0)?.variant === "NODE") {
|
|
90
|
+
if (c?.value && c.value.__typename === "NodeFunctionIdWrapper") {
|
|
91
|
+
const x = `${m}-group-${s++}`, $ = [...S, E()], z = V(`${m}-param-${JSON.stringify(c)}`), H = (J) => parseInt(J.slice(0, 8), 16) % 360;
|
|
92
|
+
d.push({
|
|
93
|
+
id: x,
|
|
91
94
|
type: "group",
|
|
92
95
|
position: {
|
|
93
96
|
x: 0,
|
|
94
97
|
y: 0
|
|
95
98
|
},
|
|
96
99
|
draggable: !1,
|
|
97
|
-
parentId:
|
|
98
|
-
extent:
|
|
100
|
+
parentId: y,
|
|
101
|
+
extent: y ? "parent" : void 0,
|
|
99
102
|
data: {
|
|
100
103
|
isParameter: !0,
|
|
101
104
|
linkingId: m,
|
|
102
105
|
flowId: i,
|
|
103
106
|
depth: v + 1,
|
|
104
107
|
scope: $,
|
|
105
|
-
color: `hsl(${
|
|
108
|
+
color: `hsl(${H(z)}, 100%, 72%)`
|
|
106
109
|
}
|
|
107
|
-
}),
|
|
110
|
+
}), I(n.getNodeById(i, c.value.id), !1, void 0, v + 1, $, x, N, D);
|
|
108
111
|
}
|
|
109
|
-
} else
|
|
110
|
-
}),
|
|
112
|
+
} else c?.value && c.value.__typename === "NodeFunctionIdWrapper" && I(n.getNodeById(i, c.value.id), !0, m, v, S, y, N, D);
|
|
113
|
+
}), t.nextNodeId && I(n.getNodeById(e.id, t.nextNodeId), !1, void 0, v, S, y, N, D);
|
|
111
114
|
};
|
|
112
|
-
return
|
|
113
|
-
}, [
|
|
115
|
+
return e.startingNodeId && I(n.getNodeById(e.id, e.startingNodeId), !1, void 0, 0, [0], void 0, f, g), d;
|
|
116
|
+
}, [e, o, l, a]);
|
|
114
117
|
};
|
|
115
118
|
export {
|
|
116
|
-
|
|
119
|
+
ne as useFlowNodes
|
|
117
120
|
};
|
|
@@ -1,7 +1,11 @@
|
|
|
1
1
|
import { ReactiveArrayService } from '../../utils';
|
|
2
|
-
import { Flow, FlowInput, FlowSetting, LiteralValue, NamespacesProjectsFlowsCreateInput, NamespacesProjectsFlowsCreatePayload, NamespacesProjectsFlowsDeleteInput, NamespacesProjectsFlowsDeletePayload, NamespacesProjectsFlowsUpdateInput, NamespacesProjectsFlowsUpdatePayload, NodeFunction, NodeParameter, ReferenceValue } from '@code0-tech/sagittarius-graphql-types';
|
|
3
|
-
export
|
|
4
|
-
|
|
2
|
+
import { Flow, FlowInput, FlowSetting, LiteralValue, Namespace, NamespaceProject, NamespacesProjectsFlowsCreateInput, NamespacesProjectsFlowsCreatePayload, NamespacesProjectsFlowsDeleteInput, NamespacesProjectsFlowsDeletePayload, NamespacesProjectsFlowsUpdateInput, NamespacesProjectsFlowsUpdatePayload, NodeFunction, NodeParameter, ReferenceValue } from '@code0-tech/sagittarius-graphql-types';
|
|
3
|
+
export type DFlowDependencies = {
|
|
4
|
+
namespaceId: Namespace['id'];
|
|
5
|
+
projectId: NamespaceProject['id'];
|
|
6
|
+
};
|
|
7
|
+
export declare abstract class DFlowReactiveService extends ReactiveArrayService<Flow, DFlowDependencies> {
|
|
8
|
+
getById(id: Flow['id'], dependencies?: DFlowDependencies): Flow | undefined;
|
|
5
9
|
protected removeParameterNode(flow: Flow, parameter: NodeParameter): void;
|
|
6
10
|
getNodeById(flowId: Flow['id'], nodeId: NodeFunction['id']): NodeFunction | undefined;
|
|
7
11
|
getPayloadById(flowId: Flow['id']): FlowInput | undefined;
|
|
@@ -3,8 +3,8 @@ import "react";
|
|
|
3
3
|
import { ReactiveArrayService as I } from "../../utils/reactiveArrayService.js";
|
|
4
4
|
import "merge-props";
|
|
5
5
|
class m extends I {
|
|
6
|
-
getById(n) {
|
|
7
|
-
return this.values().find((
|
|
6
|
+
getById(n, t) {
|
|
7
|
+
return this.values(t).find((i) => i.id === n);
|
|
8
8
|
}
|
|
9
9
|
removeParameterNode(n, t) {
|
|
10
10
|
if (t?.value?.__typename === "NodeFunctionIdWrapper") {
|
|
@@ -1,9 +1,14 @@
|
|
|
1
1
|
import { ReactiveArrayService } from '../../utils';
|
|
2
2
|
import { DataTypeView } from './DFlowDataType.view';
|
|
3
|
-
import { DataTypeIdentifier, Flow, Maybe, NodeParameterValue } from '@code0-tech/sagittarius-graphql-types';
|
|
4
|
-
export
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
3
|
+
import { DataTypeIdentifier, Flow, Maybe, Namespace, NamespaceProject, NodeParameterValue, Runtime } from '@code0-tech/sagittarius-graphql-types';
|
|
4
|
+
export type DFlowDataTypeDependencies = {
|
|
5
|
+
namespaceId: Namespace['id'];
|
|
6
|
+
projectId: NamespaceProject['id'];
|
|
7
|
+
runtimeId: Runtime['id'];
|
|
8
|
+
};
|
|
9
|
+
export declare abstract class DFlowDataTypeReactiveService extends ReactiveArrayService<DataTypeView, DFlowDataTypeDependencies> {
|
|
10
|
+
getDataType(type: DataTypeIdentifier, dependencies?: DFlowDataTypeDependencies): DataTypeView | undefined;
|
|
11
|
+
getDataTypeFromValue(value: NodeParameterValue, flow?: Flow, dependencies?: DFlowDataTypeDependencies): DataTypeView | undefined;
|
|
12
|
+
getTypeFromValue(value: NodeParameterValue, flow?: Flow, dependencies?: DFlowDataTypeDependencies): Maybe<DataTypeIdentifier> | undefined;
|
|
13
|
+
hasDataTypes(types: DataTypeIdentifier[], dependencies?: DFlowDataTypeDependencies): boolean;
|
|
9
14
|
}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import "../../utils/contextStore.js";
|
|
2
2
|
import "react";
|
|
3
|
-
import { ReactiveArrayService as
|
|
3
|
+
import { ReactiveArrayService as f } from "../../utils/reactiveArrayService.js";
|
|
4
4
|
import "merge-props";
|
|
5
|
-
import { resolveType as
|
|
6
|
-
import { useValueValidation as
|
|
7
|
-
class
|
|
8
|
-
getDataType(e) {
|
|
5
|
+
import { resolveType as s } from "../../utils/generics.js";
|
|
6
|
+
import { useValueValidation as o } from "../d-flow-validation/DValueValidation.hook.js";
|
|
7
|
+
class v extends f {
|
|
8
|
+
getDataType(e, r) {
|
|
9
9
|
if (!e || e.genericKey) return;
|
|
10
10
|
const i = e.dataType?.identifier ?? e.genericType?.dataType?.identifier, t = e.dataType?.id ?? e.genericType?.dataType?.id;
|
|
11
|
-
return this.values().find((
|
|
11
|
+
return this.values().find((a) => a.identifier == i || a.id == t);
|
|
12
12
|
}
|
|
13
|
-
getDataTypeFromValue(e, i) {
|
|
13
|
+
getDataTypeFromValue(e, r, i) {
|
|
14
14
|
if (!e) return;
|
|
15
15
|
if (e.__typename == "LiteralValue") {
|
|
16
16
|
if (Array.isArray(e.value) && Array.from(e.value).length > 0) return this.getDataType({
|
|
@@ -22,72 +22,72 @@ class D extends s {
|
|
|
22
22
|
dataType: {
|
|
23
23
|
identifier: "TEXT"
|
|
24
24
|
}
|
|
25
|
-
});
|
|
25
|
+
}, i);
|
|
26
26
|
if (typeof e.value == "number") return this.getDataType({
|
|
27
27
|
dataType: {
|
|
28
28
|
identifier: "NUMBER"
|
|
29
29
|
}
|
|
30
|
-
});
|
|
30
|
+
}, i);
|
|
31
31
|
if (typeof e.value == "boolean") return this.getDataType({
|
|
32
32
|
dataType: {
|
|
33
33
|
identifier: "BOOLEAN"
|
|
34
34
|
}
|
|
35
|
-
});
|
|
35
|
+
}, i);
|
|
36
36
|
}
|
|
37
|
-
const t = this.values().filter((
|
|
37
|
+
const t = this.values(i).filter((a) => a.identifier === "OBJECT" || e.__typename === "NodeFunctionIdWrapper" && (a.variant != "NODE" || !r) ? !1 : o(e, a, this, r));
|
|
38
38
|
return t[t.length - 1];
|
|
39
39
|
}
|
|
40
|
-
getTypeFromValue(e, i) {
|
|
40
|
+
getTypeFromValue(e, r, i) {
|
|
41
41
|
if (!e) return;
|
|
42
42
|
if (e.__typename === "ReferenceValue") return e.dataTypeIdentifier;
|
|
43
|
-
const t = this.getDataTypeFromValue(e, i);
|
|
43
|
+
const t = this.getDataTypeFromValue(e, r, i);
|
|
44
44
|
if ((t?.genericKeys?.length ?? 0) <= 0 || !t?.genericKeys) return {
|
|
45
45
|
dataType: {
|
|
46
46
|
id: t?.id
|
|
47
47
|
}
|
|
48
48
|
};
|
|
49
|
-
const
|
|
50
|
-
const
|
|
51
|
-
return
|
|
49
|
+
const a = t.genericKeys.map((n) => {
|
|
50
|
+
const T = t.rules?.nodes?.find((p) => "dataTypeIdentifier" in (p?.config ?? {}) && p?.config?.dataTypeIdentifier?.genericKey == n || "inputTypes" in (p?.config ?? {}) && p.config.inputTypes?.some((y) => y.dataTypeIdentifier?.genericKey == n));
|
|
51
|
+
return T && T.variant == "CONTAINS_TYPE" && "value" in e && e?.value && t.variant === "ARRAY" ? {
|
|
52
52
|
sourceDataTypeIdentifiers: [this.getTypeFromValue({
|
|
53
53
|
__typename: "LiteralValue",
|
|
54
54
|
value: e.value[0]
|
|
55
|
-
}, i)],
|
|
56
|
-
target:
|
|
57
|
-
} :
|
|
55
|
+
}, r, i)],
|
|
56
|
+
target: n
|
|
57
|
+
} : T && T.variant == "CONTAINS_KEY" && "value" in e && e?.value && t.variant === "OBJECT" ? {
|
|
58
58
|
sourceDataTypeIdentifiers: [this.getTypeFromValue({
|
|
59
59
|
__typename: "LiteralValue",
|
|
60
60
|
/* @ts-ignore */
|
|
61
|
-
value: e.value[
|
|
62
|
-
}, i)],
|
|
63
|
-
target:
|
|
64
|
-
} :
|
|
65
|
-
sourceDataTypeIdentifiers: [this.getTypeFromValue(e, i)],
|
|
66
|
-
target:
|
|
67
|
-
} :
|
|
61
|
+
value: e.value[T.config?.key ?? ""]
|
|
62
|
+
}, r, i)],
|
|
63
|
+
target: n
|
|
64
|
+
} : T && T.variant == "RETURN_TYPE" && t.variant === "NODE" ? {
|
|
65
|
+
sourceDataTypeIdentifiers: [this.getTypeFromValue(e, r, i)],
|
|
66
|
+
target: n
|
|
67
|
+
} : T && T.variant == "INPUT_TYPES" && t.variant === "NODE" ? {
|
|
68
68
|
sourceDataTypeIdentifiers: [{
|
|
69
|
-
genericKey:
|
|
69
|
+
genericKey: n
|
|
70
70
|
}],
|
|
71
|
-
target:
|
|
71
|
+
target: n
|
|
72
72
|
} : null;
|
|
73
|
-
}).filter((
|
|
73
|
+
}).filter((n) => !!n), d = a.length > 0 ? {
|
|
74
74
|
genericType: {
|
|
75
75
|
dataType: {
|
|
76
76
|
id: t.id
|
|
77
77
|
},
|
|
78
|
-
genericMappers:
|
|
78
|
+
genericMappers: a
|
|
79
79
|
}
|
|
80
80
|
} : {
|
|
81
81
|
dataType: {
|
|
82
82
|
id: t.id
|
|
83
83
|
}
|
|
84
84
|
};
|
|
85
|
-
return
|
|
85
|
+
return s(d, this);
|
|
86
86
|
}
|
|
87
|
-
hasDataTypes(e) {
|
|
88
|
-
return e.every((i) => this.values().find((t) => t.id === (i.genericType?.dataType?.id ?? i.dataType?.id)));
|
|
87
|
+
hasDataTypes(e, r) {
|
|
88
|
+
return e.every((i) => this.values(r).find((t) => t.id === (i.genericType?.dataType?.id ?? i.dataType?.id)));
|
|
89
89
|
}
|
|
90
90
|
}
|
|
91
91
|
export {
|
|
92
|
-
|
|
92
|
+
v as DFlowDataTypeReactiveService
|
|
93
93
|
};
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
|
-
import { Flow } from '@code0-tech/sagittarius-graphql-types';
|
|
2
|
+
import { Flow, Namespace, NamespaceProject } from '@code0-tech/sagittarius-graphql-types';
|
|
3
3
|
export interface DFlowTabsProps {
|
|
4
4
|
flowId: Flow['id'];
|
|
5
|
+
namespaceId: Namespace['id'];
|
|
6
|
+
projectId: NamespaceProject['id'];
|
|
5
7
|
}
|
|
6
8
|
export declare const DFlowTabs: React.FC<DFlowTabsProps>;
|
|
@@ -3,12 +3,12 @@ import { useService as u, useStore as g } from "../../utils/contextStore.js";
|
|
|
3
3
|
import n from "react";
|
|
4
4
|
import "merge-props";
|
|
5
5
|
import { FileTabsService as S } from "../file-tabs/FileTabs.service.js";
|
|
6
|
-
import { FileTabs as
|
|
7
|
-
import { Menu as x, MenuTrigger as w, MenuPortal as C, MenuContent as
|
|
8
|
-
import { Button as
|
|
9
|
-
import { IconPlus as
|
|
10
|
-
import { DLayout as
|
|
11
|
-
import { ButtonGroup as
|
|
6
|
+
import { FileTabs as G, FileTabsContent as U, FileTabsList as H, FileTabsTrigger as J } from "../file-tabs/FileTabs.js";
|
|
7
|
+
import { Menu as x, MenuTrigger as w, MenuPortal as C, MenuContent as I, MenuLabel as m, MenuItem as c, MenuSeparator as v } from "../menu/Menu.js";
|
|
8
|
+
import { Button as M } from "../button/Button.js";
|
|
9
|
+
import { IconPlus as K, IconArrowUp as z, IconArrowDown as F, IconCornerDownLeft as L, IconDotsVertical as Q } from "@tabler/icons-react";
|
|
10
|
+
import { DLayout as X } from "../d-layout/DLayout.js";
|
|
11
|
+
import { ButtonGroup as Y } from "../button-group/ButtonGroup.js";
|
|
12
12
|
import "../d-flow/DFlow.js";
|
|
13
13
|
import { DFlowReactiveService as A } from "../d-flow/DFlow.service.js";
|
|
14
14
|
import "../d-flow-data-type/rules/DFlowDataTypeRegexRule.js";
|
|
@@ -23,30 +23,35 @@ import { Card as D } from "../card/Card.js";
|
|
|
23
23
|
import { Flex as l } from "../flex/Flex.js";
|
|
24
24
|
import { Badge as a } from "../badge/Badge.js";
|
|
25
25
|
import { Spacing as W } from "../spacing/Spacing.js";
|
|
26
|
-
const
|
|
26
|
+
const we = (k) => {
|
|
27
27
|
const {
|
|
28
|
-
flowId: R
|
|
29
|
-
|
|
28
|
+
flowId: R,
|
|
29
|
+
namespaceId: $,
|
|
30
|
+
projectId: j
|
|
31
|
+
} = k, t = u(S), o = g(S), q = u(A), N = g(A), O = u(B), P = g(B), h = n.useId(), b = n.useMemo(() => q.getById(R, {
|
|
32
|
+
namespaceId: $,
|
|
33
|
+
projectId: j
|
|
34
|
+
}), [N]), p = n.useMemo(() => O.getById(b?.type?.id), [P, b]), T = n.useMemo(() => o.find((r) => r.active)?.id ?? t.getActiveTab()?.id, [o, t]), d = n.useMemo(() => {
|
|
30
35
|
if (p?.id)
|
|
31
36
|
return o.find((r) => r.id === p.id);
|
|
32
|
-
}, [o, p]), y = n.useMemo(() => o.filter((r) => r.show), [o, d]),
|
|
37
|
+
}, [o, p]), y = n.useMemo(() => o.filter((r) => r.show), [o, d]), V = n.useMemo(() => o.filter((r) => !r.show && r.id !== d?.id), [o, d]);
|
|
33
38
|
return n.useEffect(() => {
|
|
34
39
|
setTimeout(() => {
|
|
35
40
|
const s = document.querySelector('[data-id="' + h + '"]').querySelector(".file-tabs__list-content"), f = s.querySelector('[data-value="' + t.getActiveTab()?.id + '"]');
|
|
36
41
|
if (s && f) {
|
|
37
|
-
const
|
|
42
|
+
const E = f.offsetLeft + f.offsetWidth / 2 - s.offsetWidth / 2;
|
|
38
43
|
s.scrollLeft = 0, s.scrollBy({
|
|
39
|
-
left:
|
|
44
|
+
left: E,
|
|
40
45
|
behavior: "smooth"
|
|
41
46
|
});
|
|
42
47
|
}
|
|
43
48
|
}, 0);
|
|
44
|
-
}, [T, h]), /* @__PURE__ */ e(
|
|
49
|
+
}, [T, h]), /* @__PURE__ */ e(G, { "data-id": h, value: T, onValueChange: (r) => {
|
|
45
50
|
t.activateTab(r), t.update();
|
|
46
|
-
}, children: /* @__PURE__ */ e(
|
|
51
|
+
}, children: /* @__PURE__ */ e(X, { topContent: /* @__PURE__ */ e(H, { controls: /* @__PURE__ */ i(Y, { children: [
|
|
47
52
|
/* @__PURE__ */ i(x, { children: [
|
|
48
|
-
/* @__PURE__ */ e(w, { asChild: !0, children: /* @__PURE__ */ e(
|
|
49
|
-
/* @__PURE__ */ e(C, { children: /* @__PURE__ */ i(
|
|
53
|
+
/* @__PURE__ */ e(w, { asChild: !0, children: /* @__PURE__ */ e(M, { variant: "none", paddingSize: "xxs", color: "primary", children: /* @__PURE__ */ e(K, { size: 12 }) }) }),
|
|
54
|
+
/* @__PURE__ */ e(C, { children: /* @__PURE__ */ i(I, { align: "start", sideOffset: 8, color: "secondary", children: [
|
|
50
55
|
/* @__PURE__ */ i(D, { paddingSize: "xxs", mt: -0.35, mx: -0.35, style: {
|
|
51
56
|
borderWidth: "2px"
|
|
52
57
|
}, children: [
|
|
@@ -59,7 +64,7 @@ const Se = (k) => {
|
|
|
59
64
|
}, children: r.children }, `menu-${r.id}`)),
|
|
60
65
|
/* @__PURE__ */ e(v, {}),
|
|
61
66
|
/* @__PURE__ */ e(m, { children: "Available Node" }),
|
|
62
|
-
|
|
67
|
+
V.map((r) => /* @__PURE__ */ e(c, { onSelect: () => {
|
|
63
68
|
t.activateTab(r.id);
|
|
64
69
|
}, children: r.children }, `menu-${r.id}`))
|
|
65
70
|
] }),
|
|
@@ -70,7 +75,7 @@ const Se = (k) => {
|
|
|
70
75
|
gap: "0.35rem"
|
|
71
76
|
}, children: [
|
|
72
77
|
/* @__PURE__ */ i(l, { children: [
|
|
73
|
-
/* @__PURE__ */ e(a, { border: !0, children: /* @__PURE__ */ e(
|
|
78
|
+
/* @__PURE__ */ e(a, { border: !0, children: /* @__PURE__ */ e(z, { size: 12 }) }),
|
|
74
79
|
/* @__PURE__ */ e(a, { border: !0, children: /* @__PURE__ */ e(F, { size: 12 }) })
|
|
75
80
|
] }),
|
|
76
81
|
"move"
|
|
@@ -86,8 +91,8 @@ const Se = (k) => {
|
|
|
86
91
|
] }) })
|
|
87
92
|
] }),
|
|
88
93
|
/* @__PURE__ */ i(x, { children: [
|
|
89
|
-
/* @__PURE__ */ e(w, { asChild: !0, children: /* @__PURE__ */ e(
|
|
90
|
-
/* @__PURE__ */ e(C, { children: /* @__PURE__ */ i(
|
|
94
|
+
/* @__PURE__ */ e(w, { asChild: !0, children: /* @__PURE__ */ e(M, { variant: "none", paddingSize: "xxs", color: "primary", children: /* @__PURE__ */ e(Q, { size: 12 }) }) }),
|
|
95
|
+
/* @__PURE__ */ e(C, { children: /* @__PURE__ */ i(I, { align: "end", sideOffset: 8, color: "secondary", children: [
|
|
91
96
|
/* @__PURE__ */ i(D, { paddingSize: "xxs", mt: -0.35, mx: -0.35, style: {
|
|
92
97
|
borderWidth: "2px"
|
|
93
98
|
}, children: [
|
|
@@ -104,7 +109,7 @@ const Se = (k) => {
|
|
|
104
109
|
gap: "0.35rem"
|
|
105
110
|
}, children: [
|
|
106
111
|
/* @__PURE__ */ i(l, { children: [
|
|
107
|
-
/* @__PURE__ */ e(a, { border: !0, children: /* @__PURE__ */ e(
|
|
112
|
+
/* @__PURE__ */ e(a, { border: !0, children: /* @__PURE__ */ e(z, { size: 12 }) }),
|
|
108
113
|
/* @__PURE__ */ e(a, { border: !0, children: /* @__PURE__ */ e(F, { size: 12 }) })
|
|
109
114
|
] }),
|
|
110
115
|
"move"
|
|
@@ -119,10 +124,10 @@ const Se = (k) => {
|
|
|
119
124
|
] }) })
|
|
120
125
|
] }) })
|
|
121
126
|
] })
|
|
122
|
-
] }), children: y.map((r, s) => r.show && /* @__PURE__ */ e(
|
|
127
|
+
] }), children: y.map((r, s) => r.show && /* @__PURE__ */ e(J, { closable: r.closeable, value: r.id, onClose: () => {
|
|
123
128
|
t.removeTabById(r.id);
|
|
124
|
-
}, children: r.children }, `trigger-${r.id}`)) }), children: o.map((r) => /* @__PURE__ */ e(
|
|
129
|
+
}, children: r.children }, `trigger-${r.id}`)) }), children: o.map((r) => /* @__PURE__ */ e(U, { value: r.id, children: r.content }, `content-${r.id}`)) }) });
|
|
125
130
|
};
|
|
126
131
|
export {
|
|
127
|
-
|
|
132
|
+
we as DFlowTabs
|
|
128
133
|
};
|
|
@@ -1,25 +1,33 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
2
|
import { Code0Component } from '../../utils';
|
|
3
|
-
import { Flow, FlowType, Scalars } from '@code0-tech/sagittarius-graphql-types';
|
|
3
|
+
import { Flow, FlowType, Namespace, NamespaceProject, Scalars } from '@code0-tech/sagittarius-graphql-types';
|
|
4
|
+
import { DFlowFolderContextMenuGroupData, DFlowFolderContextMenuItemData } from './DFlowFolderContextMenu';
|
|
4
5
|
export interface DFlowFolderProps {
|
|
5
6
|
activeFlowId: Scalars["FlowID"]["output"];
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
7
|
+
namespaceId: Namespace['id'];
|
|
8
|
+
projectId: NamespaceProject['id'];
|
|
9
|
+
onRename?: (contextData: DFlowFolderContextMenuGroupData | DFlowFolderContextMenuItemData) => void;
|
|
10
|
+
onDelete?: (contextData: DFlowFolderContextMenuGroupData | DFlowFolderContextMenuItemData) => void;
|
|
11
|
+
onCreate?: (type: FlowType['id']) => void;
|
|
12
|
+
onSelect?: (flow: Flow) => void;
|
|
9
13
|
}
|
|
10
|
-
export
|
|
14
|
+
export type DFlowFolderHandle = {
|
|
15
|
+
openAll: () => void;
|
|
16
|
+
closeAll: () => void;
|
|
17
|
+
openActivePath: () => void;
|
|
18
|
+
};
|
|
19
|
+
export interface DFlowFolderGroupProps extends DFlowFolderProps, Omit<Code0Component<HTMLDivElement>, "onSelect"> {
|
|
11
20
|
name: string;
|
|
12
21
|
children: React.ReactElement<DFlowFolderItemProps> | React.ReactElement<DFlowFolderItemProps>[] | React.ReactElement<DFlowFolderGroupProps> | React.ReactElement<DFlowFolderGroupProps>[];
|
|
13
22
|
defaultOpen?: boolean;
|
|
14
23
|
flows: Flow[];
|
|
15
24
|
}
|
|
16
|
-
export interface DFlowFolderItemProps extends DFlowFolderProps, Code0Component<HTMLDivElement> {
|
|
25
|
+
export interface DFlowFolderItemProps extends DFlowFolderProps, Omit<Code0Component<HTMLDivElement>, "onSelect"> {
|
|
17
26
|
name: string;
|
|
18
27
|
path: string;
|
|
19
|
-
icon?: React.ReactNode;
|
|
20
28
|
active?: boolean;
|
|
21
29
|
flow: Flow;
|
|
22
30
|
}
|
|
23
|
-
export declare const DFlowFolder: React.
|
|
31
|
+
export declare const DFlowFolder: React.ForwardRefExoticComponent<DFlowFolderProps & React.RefAttributes<DFlowFolderHandle>>;
|
|
24
32
|
export declare const DFlowFolderGroup: React.FC<DFlowFolderGroupProps>;
|
|
25
33
|
export declare const DFlowFolderItem: React.FC<DFlowFolderItemProps>;
|