@bpmnkit/plugins 0.0.19 → 0.0.23
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/README.md +2 -0
- package/dist/config-panel-bpmn/index.d.ts +18 -0
- package/dist/config-panel-bpmn/index.js +534 -19
- package/dist/config-panel-bpmn/util.d.ts +14 -0
- package/dist/config-panel-bpmn/util.js +21 -0
- package/dist/connector-catalog/builtin-templates.d.ts +10 -0
- package/dist/connector-catalog/builtin-templates.js +585 -0
- package/dist/connector-catalog/css.d.ts +1 -1
- package/dist/connector-catalog/css.js +282 -0
- package/dist/connector-catalog/index.d.ts +27 -14
- package/dist/connector-catalog/index.js +76 -17
- package/dist/connector-catalog/panel.d.ts +34 -0
- package/dist/connector-catalog/panel.js +223 -0
- package/dist/process-runner/css.js +237 -0
- package/dist/process-runner/index.d.ts +56 -0
- package/dist/process-runner/index.js +519 -36
- package/package.json +7 -7
|
@@ -0,0 +1,223 @@
|
|
|
1
|
+
// ── DOM helpers ───────────────────────────────────────────────────────────────
|
|
2
|
+
function el(tag, attrs = {}, ...children) {
|
|
3
|
+
const node = document.createElement(tag);
|
|
4
|
+
for (const [k, v] of Object.entries(attrs))
|
|
5
|
+
node.setAttribute(k, v);
|
|
6
|
+
for (const child of children) {
|
|
7
|
+
if (typeof child === "string")
|
|
8
|
+
node.append(document.createTextNode(child));
|
|
9
|
+
else
|
|
10
|
+
node.append(child);
|
|
11
|
+
}
|
|
12
|
+
return node;
|
|
13
|
+
}
|
|
14
|
+
// ── Card rendering ────────────────────────────────────────────────────────────
|
|
15
|
+
function renderBuiltinCard(template, onUse) {
|
|
16
|
+
const card = el("div", { class: "bpmnkit-cc-card" });
|
|
17
|
+
// Icon
|
|
18
|
+
const iconWrap = el("div", { class: "bpmnkit-cc-card__icon" });
|
|
19
|
+
if (template.icon?.contents) {
|
|
20
|
+
iconWrap.innerHTML = template.icon.contents;
|
|
21
|
+
}
|
|
22
|
+
card.append(iconWrap);
|
|
23
|
+
// Text
|
|
24
|
+
const body = el("div", { class: "bpmnkit-cc-card__body" });
|
|
25
|
+
body.append(el("div", { class: "bpmnkit-cc-card__name" }, template.name));
|
|
26
|
+
if (template.description) {
|
|
27
|
+
body.append(el("div", { class: "bpmnkit-cc-card__desc" }, template.description));
|
|
28
|
+
}
|
|
29
|
+
card.append(body);
|
|
30
|
+
// Use button
|
|
31
|
+
const btn = el("button", { class: "bpmnkit-cc-card__use", type: "button" }, "Use");
|
|
32
|
+
btn.addEventListener("click", (e) => {
|
|
33
|
+
e.stopPropagation();
|
|
34
|
+
onUse(template);
|
|
35
|
+
});
|
|
36
|
+
card.append(btn);
|
|
37
|
+
// Whole card is also clickable
|
|
38
|
+
card.addEventListener("click", () => onUse(template));
|
|
39
|
+
return card;
|
|
40
|
+
}
|
|
41
|
+
function renderCommunityRow(entry, onLoad) {
|
|
42
|
+
const row = el("div", { class: "bpmnkit-cc-row" });
|
|
43
|
+
const body = el("div", { class: "bpmnkit-cc-row__body" });
|
|
44
|
+
body.append(el("div", { class: "bpmnkit-cc-row__name" }, entry.name));
|
|
45
|
+
if (entry.description) {
|
|
46
|
+
body.append(el("div", { class: "bpmnkit-cc-row__desc" }, entry.description));
|
|
47
|
+
}
|
|
48
|
+
row.append(body);
|
|
49
|
+
const btn = el("button", { class: "bpmnkit-cc-row__import", type: "button" }, "Import");
|
|
50
|
+
btn.addEventListener("click", (e) => {
|
|
51
|
+
e.stopPropagation();
|
|
52
|
+
onLoad(entry.id);
|
|
53
|
+
});
|
|
54
|
+
row.append(btn);
|
|
55
|
+
row.addEventListener("click", () => onLoad(entry.id));
|
|
56
|
+
return row;
|
|
57
|
+
}
|
|
58
|
+
// ── Panel ─────────────────────────────────────────────────────────────────────
|
|
59
|
+
export class CatalogPanel {
|
|
60
|
+
opts;
|
|
61
|
+
overlay = null;
|
|
62
|
+
activeTab = "builtin";
|
|
63
|
+
query = "";
|
|
64
|
+
constructor(opts) {
|
|
65
|
+
this.opts = opts;
|
|
66
|
+
}
|
|
67
|
+
open() {
|
|
68
|
+
if (this.overlay) {
|
|
69
|
+
this.overlay.style.display = "flex";
|
|
70
|
+
return;
|
|
71
|
+
}
|
|
72
|
+
this.overlay = this.build();
|
|
73
|
+
document.body.append(this.overlay);
|
|
74
|
+
// Focus search on next tick
|
|
75
|
+
setTimeout(() => {
|
|
76
|
+
const input = this.overlay?.querySelector(".bpmnkit-cc-panel__search-input");
|
|
77
|
+
input?.focus();
|
|
78
|
+
}, 0);
|
|
79
|
+
}
|
|
80
|
+
close() {
|
|
81
|
+
if (this.overlay) {
|
|
82
|
+
this.overlay.style.display = "none";
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
build() {
|
|
86
|
+
const overlay = el("div", {
|
|
87
|
+
class: "bpmnkit-cc-panel-overlay",
|
|
88
|
+
role: "dialog",
|
|
89
|
+
"aria-modal": "true",
|
|
90
|
+
"aria-label": "Connector catalog",
|
|
91
|
+
});
|
|
92
|
+
// Close on backdrop click
|
|
93
|
+
overlay.addEventListener("click", (e) => {
|
|
94
|
+
if (e.target === overlay)
|
|
95
|
+
this.close();
|
|
96
|
+
});
|
|
97
|
+
// Close on Escape
|
|
98
|
+
overlay.addEventListener("keydown", (e) => {
|
|
99
|
+
if (e.key === "Escape")
|
|
100
|
+
this.close();
|
|
101
|
+
});
|
|
102
|
+
const panel = el("div", { class: "bpmnkit-cc-panel" });
|
|
103
|
+
overlay.append(panel);
|
|
104
|
+
// Header
|
|
105
|
+
const header = el("div", { class: "bpmnkit-cc-panel__header" });
|
|
106
|
+
header.append(el("h2", { class: "bpmnkit-cc-panel__title" }, "Connectors"));
|
|
107
|
+
const closeBtn = el("button", {
|
|
108
|
+
class: "bpmnkit-cc-panel__close",
|
|
109
|
+
type: "button",
|
|
110
|
+
"aria-label": "Close",
|
|
111
|
+
}, "✕");
|
|
112
|
+
closeBtn.addEventListener("click", () => this.close());
|
|
113
|
+
header.append(closeBtn);
|
|
114
|
+
panel.append(header);
|
|
115
|
+
// Search
|
|
116
|
+
const searchWrap = el("div", { class: "bpmnkit-cc-panel__search" });
|
|
117
|
+
const searchInput = el("input", {
|
|
118
|
+
class: "bpmnkit-cc-panel__search-input",
|
|
119
|
+
type: "text",
|
|
120
|
+
placeholder: "Search connectors…",
|
|
121
|
+
autocomplete: "off",
|
|
122
|
+
});
|
|
123
|
+
searchInput.addEventListener("input", () => {
|
|
124
|
+
this.query = searchInput.value.toLowerCase().trim();
|
|
125
|
+
this.renderContent(content);
|
|
126
|
+
});
|
|
127
|
+
searchWrap.append(searchInput);
|
|
128
|
+
panel.append(searchWrap);
|
|
129
|
+
// Tabs
|
|
130
|
+
const tabs = el("div", { class: "bpmnkit-cc-panel__tabs", role: "tablist" });
|
|
131
|
+
const builtinTab = el("button", {
|
|
132
|
+
class: "bpmnkit-cc-tab bpmnkit-cc-tab--active",
|
|
133
|
+
role: "tab",
|
|
134
|
+
type: "button",
|
|
135
|
+
}, "Built-in Workers");
|
|
136
|
+
const communityTab = el("button", {
|
|
137
|
+
class: "bpmnkit-cc-tab",
|
|
138
|
+
role: "tab",
|
|
139
|
+
type: "button",
|
|
140
|
+
}, "Community APIs");
|
|
141
|
+
builtinTab.addEventListener("click", () => {
|
|
142
|
+
this.activeTab = "builtin";
|
|
143
|
+
builtinTab.classList.add("bpmnkit-cc-tab--active");
|
|
144
|
+
communityTab.classList.remove("bpmnkit-cc-tab--active");
|
|
145
|
+
this.renderContent(content);
|
|
146
|
+
});
|
|
147
|
+
communityTab.addEventListener("click", () => {
|
|
148
|
+
this.activeTab = "community";
|
|
149
|
+
communityTab.classList.add("bpmnkit-cc-tab--active");
|
|
150
|
+
builtinTab.classList.remove("bpmnkit-cc-tab--active");
|
|
151
|
+
this.renderContent(content);
|
|
152
|
+
});
|
|
153
|
+
tabs.append(builtinTab, communityTab);
|
|
154
|
+
panel.append(tabs);
|
|
155
|
+
// Content area
|
|
156
|
+
const content = el("div", { class: "bpmnkit-cc-panel__content" });
|
|
157
|
+
this.renderContent(content);
|
|
158
|
+
panel.append(content);
|
|
159
|
+
// Community footer actions
|
|
160
|
+
const footer = el("div", { class: "bpmnkit-cc-panel__footer" });
|
|
161
|
+
const urlBtn = el("button", { class: "bpmnkit-cc-footer-btn", type: "button" }, "Import from URL…");
|
|
162
|
+
urlBtn.addEventListener("click", () => {
|
|
163
|
+
this.close();
|
|
164
|
+
const url = window.prompt("Enter an OpenAPI 3.x spec URL:");
|
|
165
|
+
if (url?.trim())
|
|
166
|
+
this.opts.onLoadFromUrl(url.trim());
|
|
167
|
+
});
|
|
168
|
+
const fileBtn = el("button", { class: "bpmnkit-cc-footer-btn", type: "button" }, "Import from file…");
|
|
169
|
+
fileBtn.addEventListener("click", () => {
|
|
170
|
+
this.close();
|
|
171
|
+
this.opts.onLoadFromFile();
|
|
172
|
+
});
|
|
173
|
+
footer.append(urlBtn, fileBtn);
|
|
174
|
+
panel.append(footer);
|
|
175
|
+
return overlay;
|
|
176
|
+
}
|
|
177
|
+
renderContent(container) {
|
|
178
|
+
container.innerHTML = "";
|
|
179
|
+
if (this.activeTab === "builtin") {
|
|
180
|
+
this.renderBuiltins(container);
|
|
181
|
+
}
|
|
182
|
+
else {
|
|
183
|
+
this.renderCommunity(container);
|
|
184
|
+
}
|
|
185
|
+
}
|
|
186
|
+
renderBuiltins(container) {
|
|
187
|
+
const q = this.query;
|
|
188
|
+
const filtered = q
|
|
189
|
+
? this.opts.builtinTemplates.filter((t) => t.name.toLowerCase().includes(q) || (t.description ?? "").toLowerCase().includes(q))
|
|
190
|
+
: this.opts.builtinTemplates;
|
|
191
|
+
if (filtered.length === 0) {
|
|
192
|
+
container.append(el("div", { class: "bpmnkit-cc-empty" }, `No workers match "${this.query}"`));
|
|
193
|
+
return;
|
|
194
|
+
}
|
|
195
|
+
const grid = el("div", { class: "bpmnkit-cc-grid" });
|
|
196
|
+
for (const template of filtered) {
|
|
197
|
+
grid.append(renderBuiltinCard(template, (t) => {
|
|
198
|
+
this.opts.onUseBuiltin(t);
|
|
199
|
+
this.close();
|
|
200
|
+
}));
|
|
201
|
+
}
|
|
202
|
+
container.append(grid);
|
|
203
|
+
}
|
|
204
|
+
renderCommunity(container) {
|
|
205
|
+
const q = this.query;
|
|
206
|
+
const filtered = q
|
|
207
|
+
? this.opts.catalogEntries.filter((e) => e.name.toLowerCase().includes(q) || (e.description ?? "").toLowerCase().includes(q))
|
|
208
|
+
: this.opts.catalogEntries;
|
|
209
|
+
if (filtered.length === 0) {
|
|
210
|
+
container.append(el("div", { class: "bpmnkit-cc-empty" }, `No APIs match "${this.query}"`));
|
|
211
|
+
return;
|
|
212
|
+
}
|
|
213
|
+
const list = el("div", { class: "bpmnkit-cc-list" });
|
|
214
|
+
for (const entry of filtered) {
|
|
215
|
+
list.append(renderCommunityRow(entry, (id) => {
|
|
216
|
+
this.opts.onLoadCatalogEntry(id);
|
|
217
|
+
this.close();
|
|
218
|
+
}));
|
|
219
|
+
}
|
|
220
|
+
container.append(list);
|
|
221
|
+
}
|
|
222
|
+
}
|
|
223
|
+
//# sourceMappingURL=panel.js.map
|
|
@@ -472,6 +472,38 @@ const CSS = `
|
|
|
472
472
|
}
|
|
473
473
|
.bpmnkit-runner-play-ivar-add:hover { border-color: var(--bpmnkit-accent, #6b9df7); color: var(--bpmnkit-accent, #6b9df7); }
|
|
474
474
|
|
|
475
|
+
/* ── Input variable hints (from validation DMN) ──────────────────────────── */
|
|
476
|
+
.bpmnkit-runner-play-ivar-hints {
|
|
477
|
+
display: flex;
|
|
478
|
+
flex-wrap: wrap;
|
|
479
|
+
align-items: center;
|
|
480
|
+
gap: 4px;
|
|
481
|
+
padding: 6px 10px;
|
|
482
|
+
background: rgba(107,157,247,0.06);
|
|
483
|
+
border-bottom: 1px solid rgba(107,157,247,0.12);
|
|
484
|
+
font-size: 11px;
|
|
485
|
+
}
|
|
486
|
+
.bpmnkit-runner-play-ivar-hints-label {
|
|
487
|
+
color: var(--bpmnkit-fg-muted, #8888a8);
|
|
488
|
+
flex-shrink: 0;
|
|
489
|
+
}
|
|
490
|
+
.bpmnkit-runner-play-ivar-hint-chip {
|
|
491
|
+
background: rgba(107,157,247,0.12);
|
|
492
|
+
color: var(--bpmnkit-accent-bright, #89b4fa);
|
|
493
|
+
border-radius: 3px;
|
|
494
|
+
padding: 1px 5px;
|
|
495
|
+
font-family: var(--bpmnkit-font-mono, monospace);
|
|
496
|
+
}
|
|
497
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-play-ivar-hints {
|
|
498
|
+
background: rgba(26,86,219,0.05);
|
|
499
|
+
border-bottom-color: rgba(26,86,219,0.1);
|
|
500
|
+
}
|
|
501
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-play-ivar-hints-label { color: rgba(0,0,0,0.4); }
|
|
502
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-play-ivar-hint-chip {
|
|
503
|
+
background: rgba(26,86,219,0.08);
|
|
504
|
+
color: var(--bpmnkit-accent, #1a56db);
|
|
505
|
+
}
|
|
506
|
+
|
|
475
507
|
/* ── Light theme overrides ───────────────────────────────────────────────── */
|
|
476
508
|
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-play-panel { color: rgba(0,0,0,0.75); }
|
|
477
509
|
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-play-tabs { border-bottom-color: rgba(0,0,0,0.07); }
|
|
@@ -571,6 +603,211 @@ const CSS = `
|
|
|
571
603
|
background: rgba(245,158,11,0.12);
|
|
572
604
|
}
|
|
573
605
|
|
|
606
|
+
/* ── Scenario editor ─────────────────────────────────────────────────────── */
|
|
607
|
+
.bpmnkit-runner-tests-editor-header {
|
|
608
|
+
display: flex;
|
|
609
|
+
align-items: center;
|
|
610
|
+
gap: 6px;
|
|
611
|
+
padding-bottom: 8px;
|
|
612
|
+
border-bottom: 1px solid rgba(255,255,255,0.06);
|
|
613
|
+
margin-bottom: 10px;
|
|
614
|
+
flex-wrap: wrap;
|
|
615
|
+
}
|
|
616
|
+
.bpmnkit-runner-tests-back {
|
|
617
|
+
font-size: 11px;
|
|
618
|
+
padding: 3px 8px;
|
|
619
|
+
flex-shrink: 0;
|
|
620
|
+
}
|
|
621
|
+
.bpmnkit-runner-tests-editor-name {
|
|
622
|
+
flex: 1;
|
|
623
|
+
min-width: 80px;
|
|
624
|
+
background: rgba(255,255,255,0.06);
|
|
625
|
+
border: 1px solid rgba(255,255,255,0.12);
|
|
626
|
+
border-radius: 4px;
|
|
627
|
+
color: inherit;
|
|
628
|
+
font-size: 12px;
|
|
629
|
+
font-family: inherit;
|
|
630
|
+
padding: 4px 7px;
|
|
631
|
+
}
|
|
632
|
+
.bpmnkit-runner-tests-editor-name:focus { outline: none; border-color: var(--bpmnkit-accent, #6b9df7); }
|
|
633
|
+
.bpmnkit-runner-tests-editor-badge {
|
|
634
|
+
font-size: 11px;
|
|
635
|
+
font-weight: 600;
|
|
636
|
+
padding: 2px 6px;
|
|
637
|
+
border-radius: 4px;
|
|
638
|
+
flex-shrink: 0;
|
|
639
|
+
}
|
|
640
|
+
.bpmnkit-runner-tests-editor-badge--pass { color: var(--bpmnkit-success, #22c55e); background: rgba(34,197,94,0.12); }
|
|
641
|
+
.bpmnkit-runner-tests-editor-badge--fail { color: var(--bpmnkit-danger, #f87171); background: rgba(248,113,113,0.12); }
|
|
642
|
+
|
|
643
|
+
.bpmnkit-runner-tests-section-title {
|
|
644
|
+
font-size: 10px;
|
|
645
|
+
font-weight: 700;
|
|
646
|
+
text-transform: uppercase;
|
|
647
|
+
letter-spacing: 0.08em;
|
|
648
|
+
color: rgba(255,255,255,0.3);
|
|
649
|
+
padding: 10px 0 4px;
|
|
650
|
+
border-bottom: 1px solid rgba(255,255,255,0.06);
|
|
651
|
+
margin-bottom: 6px;
|
|
652
|
+
}
|
|
653
|
+
.bpmnkit-runner-tests-varlist { margin-bottom: 4px; }
|
|
654
|
+
|
|
655
|
+
.bpmnkit-runner-tests-hint {
|
|
656
|
+
font-size: 11px;
|
|
657
|
+
color: rgba(255,255,255,0.25);
|
|
658
|
+
margin-bottom: 6px;
|
|
659
|
+
font-style: italic;
|
|
660
|
+
}
|
|
661
|
+
|
|
662
|
+
.bpmnkit-runner-tests-task {
|
|
663
|
+
border: 1px solid rgba(255,255,255,0.08);
|
|
664
|
+
border-radius: 6px;
|
|
665
|
+
margin-bottom: 6px;
|
|
666
|
+
overflow: hidden;
|
|
667
|
+
}
|
|
668
|
+
.bpmnkit-runner-tests-task--focused {
|
|
669
|
+
border-color: var(--bpmnkit-accent, #6b9df7);
|
|
670
|
+
}
|
|
671
|
+
.bpmnkit-runner-tests-task-header {
|
|
672
|
+
display: flex;
|
|
673
|
+
align-items: center;
|
|
674
|
+
gap: 6px;
|
|
675
|
+
padding: 6px 10px;
|
|
676
|
+
cursor: pointer;
|
|
677
|
+
user-select: none;
|
|
678
|
+
background: rgba(255,255,255,0.03);
|
|
679
|
+
}
|
|
680
|
+
.bpmnkit-runner-tests-task-header:hover { background: rgba(255,255,255,0.06); }
|
|
681
|
+
.bpmnkit-runner-tests-task--focused .bpmnkit-runner-tests-task-header {
|
|
682
|
+
background: rgba(107,157,247,0.08);
|
|
683
|
+
}
|
|
684
|
+
.bpmnkit-runner-tests-task-name {
|
|
685
|
+
flex: 1;
|
|
686
|
+
font-size: 12px;
|
|
687
|
+
font-weight: 500;
|
|
688
|
+
white-space: nowrap;
|
|
689
|
+
overflow: hidden;
|
|
690
|
+
text-overflow: ellipsis;
|
|
691
|
+
}
|
|
692
|
+
.bpmnkit-runner-tests-task-badge {
|
|
693
|
+
font-size: 10px;
|
|
694
|
+
color: rgba(255,255,255,0.35);
|
|
695
|
+
background: rgba(255,255,255,0.06);
|
|
696
|
+
border-radius: 3px;
|
|
697
|
+
padding: 1px 5px;
|
|
698
|
+
flex-shrink: 0;
|
|
699
|
+
}
|
|
700
|
+
.bpmnkit-runner-tests-task-body {
|
|
701
|
+
padding: 8px 10px;
|
|
702
|
+
border-top: 1px solid rgba(255,255,255,0.06);
|
|
703
|
+
}
|
|
704
|
+
.bpmnkit-runner-tests-error-row {
|
|
705
|
+
display: flex;
|
|
706
|
+
align-items: center;
|
|
707
|
+
gap: 6px;
|
|
708
|
+
margin-top: 8px;
|
|
709
|
+
}
|
|
710
|
+
.bpmnkit-runner-tests-error-label {
|
|
711
|
+
font-size: 11px;
|
|
712
|
+
color: rgba(255,255,255,0.4);
|
|
713
|
+
flex-shrink: 0;
|
|
714
|
+
}
|
|
715
|
+
.bpmnkit-runner-tests-error-input {
|
|
716
|
+
flex: 1;
|
|
717
|
+
background: rgba(255,255,255,0.06);
|
|
718
|
+
border: 1px solid rgba(255,255,255,0.12);
|
|
719
|
+
border-radius: 4px;
|
|
720
|
+
color: inherit;
|
|
721
|
+
font-size: 11px;
|
|
722
|
+
font-family: inherit;
|
|
723
|
+
padding: 3px 6px;
|
|
724
|
+
}
|
|
725
|
+
.bpmnkit-runner-tests-error-input:focus { outline: none; border-color: var(--bpmnkit-danger, #f87171); }
|
|
726
|
+
|
|
727
|
+
.bpmnkit-runner-tests-name-label {
|
|
728
|
+
flex: 1;
|
|
729
|
+
font-size: 12px;
|
|
730
|
+
overflow: hidden;
|
|
731
|
+
text-overflow: ellipsis;
|
|
732
|
+
white-space: nowrap;
|
|
733
|
+
}
|
|
734
|
+
.bpmnkit-runner-tests-edit {
|
|
735
|
+
background: none;
|
|
736
|
+
border: none;
|
|
737
|
+
color: rgba(255,255,255,0.4);
|
|
738
|
+
cursor: pointer;
|
|
739
|
+
padding: 2px 4px;
|
|
740
|
+
font-size: 13px;
|
|
741
|
+
}
|
|
742
|
+
.bpmnkit-runner-tests-edit:hover { color: var(--bpmnkit-accent, #6b9df7); }
|
|
743
|
+
|
|
744
|
+
/* ── Light overrides (editor) ──────────────────────────────────────────────── */
|
|
745
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-editor-header { border-color: rgba(0,0,0,0.08); }
|
|
746
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-editor-name {
|
|
747
|
+
background: rgba(0,0,0,0.04);
|
|
748
|
+
border-color: rgba(0,0,0,0.12);
|
|
749
|
+
color: rgba(0,0,0,0.75);
|
|
750
|
+
}
|
|
751
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-section-title { color: rgba(0,0,0,0.35); border-color: rgba(0,0,0,0.08); }
|
|
752
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-hint { color: rgba(0,0,0,0.3); }
|
|
753
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-task { border-color: rgba(0,0,0,0.1); }
|
|
754
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-task--focused { border-color: var(--bpmnkit-accent, #1a56db); }
|
|
755
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-task-header { background: rgba(0,0,0,0.02); }
|
|
756
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-task-header:hover { background: rgba(0,0,0,0.05); }
|
|
757
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-task--focused .bpmnkit-runner-tests-task-header { background: rgba(26,86,219,0.06); }
|
|
758
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-task-badge { color: rgba(0,0,0,0.4); background: rgba(0,0,0,0.06); }
|
|
759
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-task-body { border-color: rgba(0,0,0,0.08); }
|
|
760
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-error-label { color: rgba(0,0,0,0.45); }
|
|
761
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-error-input {
|
|
762
|
+
background: rgba(0,0,0,0.04);
|
|
763
|
+
border-color: rgba(0,0,0,0.12);
|
|
764
|
+
color: rgba(0,0,0,0.75);
|
|
765
|
+
}
|
|
766
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-name-label { color: rgba(0,0,0,0.75); }
|
|
767
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-edit { color: rgba(0,0,0,0.3); }
|
|
768
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-edit:hover { color: var(--bpmnkit-accent, #1a56db); }
|
|
769
|
+
|
|
770
|
+
/* ── Last Run Trace ──────────────────────────────────────────────────────── */
|
|
771
|
+
.bpmnkit-runner-tests-trace-tabs {
|
|
772
|
+
margin-top: 4px;
|
|
773
|
+
}
|
|
774
|
+
.bpmnkit-runner-tests-trace-pane {
|
|
775
|
+
padding: 8px 0;
|
|
776
|
+
max-height: 220px;
|
|
777
|
+
overflow-y: auto;
|
|
778
|
+
}
|
|
779
|
+
.bpmnkit-runner-tests-trace-elem-row {
|
|
780
|
+
display: flex;
|
|
781
|
+
align-items: baseline;
|
|
782
|
+
gap: 8px;
|
|
783
|
+
padding: 2px 0;
|
|
784
|
+
}
|
|
785
|
+
.bpmnkit-runner-tests-trace-elem-idx {
|
|
786
|
+
font-size: 10px;
|
|
787
|
+
color: rgba(255,255,255,0.25);
|
|
788
|
+
min-width: 18px;
|
|
789
|
+
text-align: right;
|
|
790
|
+
flex-shrink: 0;
|
|
791
|
+
}
|
|
792
|
+
.bpmnkit-runner-tests-trace-elem-id {
|
|
793
|
+
font-size: 11px;
|
|
794
|
+
font-family: var(--bpmnkit-font-mono, monospace);
|
|
795
|
+
color: rgba(255,255,255,0.65);
|
|
796
|
+
}
|
|
797
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-trace-elem-idx { color: rgba(0,0,0,0.25); }
|
|
798
|
+
[data-bpmnkit-hud-theme="light"] .bpmnkit-runner-tests-trace-elem-id { color: rgba(0,0,0,0.6); }
|
|
799
|
+
|
|
800
|
+
/* ── Missing DMN warning ──────────────────────────────────────────────────── */
|
|
801
|
+
.bpmnkit-runner-tests-missing-dmn {
|
|
802
|
+
font-size: 11px;
|
|
803
|
+
padding: 6px 10px;
|
|
804
|
+
margin-bottom: 8px;
|
|
805
|
+
border-radius: 5px;
|
|
806
|
+
background: rgba(245,158,11,0.12);
|
|
807
|
+
border: 1px solid var(--bpmnkit-warn, #f59e0b);
|
|
808
|
+
color: var(--bpmnkit-warn, #f59e0b);
|
|
809
|
+
}
|
|
810
|
+
|
|
574
811
|
/* ── Chaos run summary banner ─────────────────────────────────────────────── */
|
|
575
812
|
.bpmnkit-runner-chaos-summary {
|
|
576
813
|
font-size: 11px;
|
|
@@ -47,6 +47,12 @@ export interface ScenarioResultLike {
|
|
|
47
47
|
passed: boolean;
|
|
48
48
|
visitedElements: string[];
|
|
49
49
|
finalVariables: Record<string, unknown>;
|
|
50
|
+
feelEvals: Array<{
|
|
51
|
+
elementId: string;
|
|
52
|
+
property: string;
|
|
53
|
+
expression: string;
|
|
54
|
+
result: unknown;
|
|
55
|
+
}>;
|
|
50
56
|
errors: Array<{
|
|
51
57
|
elementId?: string;
|
|
52
58
|
message: string;
|
|
@@ -83,6 +89,12 @@ export interface ProcessRunnerOptions {
|
|
|
83
89
|
* Inject `runScenario` from `@bpmnkit/engine` here to avoid a hard dep.
|
|
84
90
|
*/
|
|
85
91
|
runScenario?: (scenario: ScenarioLike) => Promise<ScenarioResultLike>;
|
|
92
|
+
/**
|
|
93
|
+
* Container element for the tests panel (e.g. dock.testsPane).
|
|
94
|
+
* When provided, the Tests UI is mounted here instead of as a sub-tab
|
|
95
|
+
* inside the play panel.
|
|
96
|
+
*/
|
|
97
|
+
testsContainer?: HTMLElement;
|
|
86
98
|
/**
|
|
87
99
|
* Called on diagram load to check for a companion .bpmn.tests.json sidecar.
|
|
88
100
|
* Return parsed scenarios, or null if no sidecar exists.
|
|
@@ -98,6 +110,50 @@ export interface ProcessRunnerOptions {
|
|
|
98
110
|
* Used to map chaos injections to scenario mocks for export.
|
|
99
111
|
*/
|
|
100
112
|
getJobType?: (elementId: string) => string | null;
|
|
113
|
+
/**
|
|
114
|
+
* Returns the current BPMN definitions. When provided, the Tests editor
|
|
115
|
+
* auto-populates task mocks from the diagram.
|
|
116
|
+
*/
|
|
117
|
+
getDefinitions?: () => {
|
|
118
|
+
processes: Array<{
|
|
119
|
+
flowElements: Array<{
|
|
120
|
+
id: string;
|
|
121
|
+
name?: string;
|
|
122
|
+
type: string;
|
|
123
|
+
decisionId?: string;
|
|
124
|
+
}>;
|
|
125
|
+
}>;
|
|
126
|
+
} | null;
|
|
127
|
+
/**
|
|
128
|
+
* Returns the DMN XML for a given decision ID, or null if not found.
|
|
129
|
+
* Used to display expected variable hints in the input variables pane.
|
|
130
|
+
* Typically: `(id) => models.find(m => m.type === "dmn" && m.content.includes(id))?.content ?? null`
|
|
131
|
+
*/
|
|
132
|
+
getValidationDmn?: (decisionId: string) => string | null;
|
|
133
|
+
/**
|
|
134
|
+
* When provided, called instead of the internal IndexedDB to persist scenarios.
|
|
135
|
+
* Use this to save scenarios to the file system (FS mode).
|
|
136
|
+
*/
|
|
137
|
+
onSaveScenarios?: (scenarios: ScenarioLike[]) => Promise<void>;
|
|
138
|
+
/**
|
|
139
|
+
* When provided, called instead of the internal IndexedDB to load scenarios.
|
|
140
|
+
* Use this to load scenarios from the file system (FS mode).
|
|
141
|
+
*/
|
|
142
|
+
onLoadScenarios?: () => Promise<ScenarioLike[]>;
|
|
143
|
+
/**
|
|
144
|
+
* When provided, called instead of the internal IndexedDB to persist input variables.
|
|
145
|
+
*/
|
|
146
|
+
onSaveInputVars?: (vars: Array<{
|
|
147
|
+
name: string;
|
|
148
|
+
value: string;
|
|
149
|
+
}>) => Promise<void>;
|
|
150
|
+
/**
|
|
151
|
+
* When provided, called instead of the internal IndexedDB to load input variables.
|
|
152
|
+
*/
|
|
153
|
+
onLoadInputVars?: () => Promise<Array<{
|
|
154
|
+
name: string;
|
|
155
|
+
value: string;
|
|
156
|
+
}>>;
|
|
101
157
|
}
|
|
102
158
|
export declare function createProcessRunnerPlugin(options: ProcessRunnerOptions): CanvasPlugin & {
|
|
103
159
|
toolbar: HTMLDivElement;
|