@cwygoda/service-catalog-ui 1.0.3 → 1.2.0
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.
Potentially problematic release.
This version of @cwygoda/service-catalog-ui might be problematic. Click here for more details.
|
@@ -2,9 +2,21 @@
|
|
|
2
2
|
import { onMount, onDestroy } from 'svelte';
|
|
3
3
|
import { browser } from '$app/environment';
|
|
4
4
|
|
|
5
|
+
interface DocLink {
|
|
6
|
+
elementId: string;
|
|
7
|
+
anchor: string;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
interface ElementClickEvent {
|
|
11
|
+
elementId: string;
|
|
12
|
+
docAnchor?: string | undefined;
|
|
13
|
+
}
|
|
14
|
+
|
|
5
15
|
interface Props {
|
|
6
16
|
xml: string;
|
|
7
17
|
interactive?: boolean;
|
|
18
|
+
docLinks?: DocLink[];
|
|
19
|
+
onElementClick?: (event: ElementClickEvent) => void;
|
|
8
20
|
}
|
|
9
21
|
|
|
10
22
|
interface Bounds {
|
|
@@ -30,7 +42,7 @@
|
|
|
30
42
|
destroy?: () => void;
|
|
31
43
|
}
|
|
32
44
|
|
|
33
|
-
let { xml, interactive = false }: Props = $props();
|
|
45
|
+
let { xml, interactive = false, docLinks, onElementClick }: Props = $props();
|
|
34
46
|
|
|
35
47
|
let wrapper: HTMLDivElement;
|
|
36
48
|
let container: HTMLDivElement;
|
|
@@ -133,6 +145,36 @@
|
|
|
133
145
|
|
|
134
146
|
await viewer.importXML(xml);
|
|
135
147
|
|
|
148
|
+
// Register click handler for doc links
|
|
149
|
+
if (onElementClick) {
|
|
150
|
+
const eventBus = viewer.get('eventBus') as {
|
|
151
|
+
on: (event: string, callback: (e: { element: { id: string } }) => void) => void;
|
|
152
|
+
};
|
|
153
|
+
const docLinkMap = new Map((docLinks ?? []).map((l) => [l.elementId, l.anchor]));
|
|
154
|
+
|
|
155
|
+
eventBus.on('element.click', (e) => {
|
|
156
|
+
const id = e.element.id;
|
|
157
|
+
onElementClick({
|
|
158
|
+
elementId: id,
|
|
159
|
+
docAnchor: docLinkMap.get(id),
|
|
160
|
+
});
|
|
161
|
+
});
|
|
162
|
+
|
|
163
|
+
// Add pointer cursor on clickable elements
|
|
164
|
+
if (docLinks?.length) {
|
|
165
|
+
const elementRegistry = viewer.get('elementRegistry') as {
|
|
166
|
+
forEach: (cb: (el: { id: string; type: string }) => void) => void;
|
|
167
|
+
getGraphics: (el: { id: string }) => SVGElement | null;
|
|
168
|
+
};
|
|
169
|
+
elementRegistry.forEach((el) => {
|
|
170
|
+
if (docLinkMap.has(el.id)) {
|
|
171
|
+
const gfx = elementRegistry.getGraphics(el);
|
|
172
|
+
if (gfx) gfx.style.cursor = 'pointer';
|
|
173
|
+
}
|
|
174
|
+
});
|
|
175
|
+
}
|
|
176
|
+
}
|
|
177
|
+
|
|
136
178
|
// Fit diagram to container with padding
|
|
137
179
|
fitWithPadding();
|
|
138
180
|
ready = true;
|
|
@@ -1,6 +1,16 @@
|
|
|
1
|
+
interface DocLink {
|
|
2
|
+
elementId: string;
|
|
3
|
+
anchor: string;
|
|
4
|
+
}
|
|
5
|
+
interface ElementClickEvent {
|
|
6
|
+
elementId: string;
|
|
7
|
+
docAnchor?: string | undefined;
|
|
8
|
+
}
|
|
1
9
|
interface Props {
|
|
2
10
|
xml: string;
|
|
3
11
|
interactive?: boolean;
|
|
12
|
+
docLinks?: DocLink[];
|
|
13
|
+
onElementClick?: (event: ElementClickEvent) => void;
|
|
4
14
|
}
|
|
5
15
|
declare const BpmnDiagram: import("svelte").Component<Props, {}, "">;
|
|
6
16
|
type BpmnDiagram = ReturnType<typeof BpmnDiagram>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cwygoda/service-catalog-ui",
|
|
3
|
-
"version": "1.0
|
|
3
|
+
"version": "1.2.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"svelte": "./dist/index.js",
|
|
6
6
|
"exports": {
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
],
|
|
26
26
|
"dependencies": {
|
|
27
27
|
"@sinclair/typebox": "^0.34.0",
|
|
28
|
-
"@cwygoda/service-catalog-core": "1.0
|
|
28
|
+
"@cwygoda/service-catalog-core": "1.2.0"
|
|
29
29
|
},
|
|
30
30
|
"peerDependencies": {
|
|
31
31
|
"@sveltejs/kit": "^2.0.0",
|