@miragon/modeler-shell 0.1.0 → 0.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.
- package/API.md +1051 -84
- package/README.md +162 -31
- package/dist/appearance-BBaM_4bD.d.ts +323 -0
- package/dist/appearance-XX3JC3pI.d.cts +323 -0
- package/dist/{chunk-6LQOFACK.js → chunk-66HCSJNY.js} +1247 -31
- package/dist/chunk-66HCSJNY.js.map +1 -0
- package/dist/{chunk-RJRFR6N3.js → chunk-KYDG5DMX.js} +2 -2
- package/dist/{chunk-5JSZ4VGA.js → chunk-OADW3GPA.js} +240 -6
- package/dist/chunk-OADW3GPA.js.map +1 -0
- package/dist/core.cjs +260 -6
- package/dist/core.cjs.map +1 -1
- package/dist/core.d.cts +81 -6
- package/dist/core.d.ts +81 -6
- package/dist/core.js +43 -3
- package/dist/diagram-js.cjs +34 -2
- package/dist/diagram-js.cjs.map +1 -1
- package/dist/diagram-js.d.cts +10 -3
- package/dist/diagram-js.d.ts +10 -3
- package/dist/diagram-js.js +14 -2
- package/dist/diagram-js.js.map +1 -1
- package/dist/index.cjs +1654 -197
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +18 -9
- package/dist/index.d.ts +18 -9
- package/dist/index.js +44 -4
- package/dist/shell.css +692 -3
- package/dist/testing-vscode-stub.js +2 -2
- package/dist/testing.cjs +2849 -550
- package/dist/testing.cjs.map +1 -1
- package/dist/testing.d.cts +75 -9
- package/dist/testing.d.ts +75 -9
- package/dist/testing.js +2744 -558
- package/dist/testing.js.map +1 -1
- package/dist/toasts-Bp0REqdq.d.cts +142 -0
- package/dist/toasts-Bp0REqdq.d.ts +142 -0
- package/dist/{types-OuFlqZp0.d.cts → types-CnRrINRs.d.cts} +170 -9
- package/dist/{types-DnZn9CPw.d.ts → types-PuDZczzy.d.ts} +170 -9
- package/dist/vscode-extension.js +2 -2
- package/dist/vscode-webview.cjs +1541 -178
- package/dist/vscode-webview.cjs.map +1 -1
- package/dist/vscode-webview.d.cts +6 -4
- package/dist/vscode-webview.d.ts +6 -4
- package/dist/vscode-webview.js +11 -2
- package/dist/vscode-webview.js.map +1 -1
- package/package.json +2 -2
- package/src/core/feedback/appearance.ts +141 -0
- package/src/core/feedback/problems.ts +23 -0
- package/src/core/feedback/toasts.ts +118 -0
- package/src/core/fit.ts +18 -3
- package/src/core/index.ts +43 -0
- package/src/core/keymap.ts +20 -0
- package/src/core/messages.ts +71 -0
- package/src/core/types.ts +24 -2
- package/src/core/web-chrome/bottom-row.ts +37 -0
- package/src/core/web-chrome/drop.ts +78 -0
- package/src/core/web-chrome/top-row.ts +66 -0
- package/src/diagram-js/service.ts +4 -1
- package/src/diagram-js/viewport.ts +19 -0
- package/src/dom/buttons.css +124 -0
- package/src/dom/feedback/appearance.ts +184 -0
- package/src/dom/feedback/feedback.css +435 -0
- package/src/dom/feedback/problems-popover.ts +287 -0
- package/src/dom/feedback/toasts.ts +431 -0
- package/src/dom/index.ts +13 -0
- package/src/dom/keys.ts +8 -0
- package/src/dom/menu.ts +28 -17
- package/src/dom/mount.ts +290 -20
- package/src/dom/problems.ts +5 -4
- package/src/dom/shell-dom.css +7 -4
- package/src/dom/types.ts +188 -6
- package/src/dom/web/drop-zone.ts +181 -0
- package/src/dom/web/empty-state.ts +144 -0
- package/src/dom/web/legal.ts +75 -0
- package/src/dom/web/menu-groups.ts +69 -0
- package/src/dom/web/primary.ts +124 -0
- package/src/dom/web/web.css +386 -0
- package/src/shell.css +3 -0
- package/src/testing/case-tools.ts +164 -0
- package/src/testing/cases.ts +209 -144
- package/src/testing/checks.ts +51 -15
- package/src/testing/facts.ts +56 -2
- package/src/testing/geometry.ts +206 -26
- package/src/testing/harness.ts +56 -7
- package/src/testing/index.ts +4 -0
- package/src/testing/page-tools.ts +24 -1
- package/src/testing/page.ts +10 -0
- package/src/testing/web-cases.ts +913 -0
- package/src/testing/web-checks.ts +1049 -0
- package/src/testing/web-facts.ts +713 -0
- package/src/vscode/webview/mount.ts +13 -1
- package/dist/chunk-5JSZ4VGA.js.map +0 -1
- package/dist/chunk-6LQOFACK.js.map +0 -1
- package/dist/keymap-CObQE6q6.d.cts +0 -151
- package/dist/keymap-DORzHnK-.d.ts +0 -151
- package/dist/types-B6NfkiUG.d.cts +0 -66
- package/dist/types-B6NfkiUG.d.ts +0 -66
- /package/dist/{chunk-RJRFR6N3.js.map → chunk-KYDG5DMX.js.map} +0 -0
|
@@ -0,0 +1,142 @@
|
|
|
1
|
+
/** A point in pixels or diagram coordinates, as the context says. */
|
|
2
|
+
interface Point {
|
|
3
|
+
x: number;
|
|
4
|
+
y: number;
|
|
5
|
+
}
|
|
6
|
+
interface Size {
|
|
7
|
+
width: number;
|
|
8
|
+
height: number;
|
|
9
|
+
}
|
|
10
|
+
/** A rectangle; content bounds and viewboxes are in diagram coordinates. */
|
|
11
|
+
interface Bounds {
|
|
12
|
+
x: number;
|
|
13
|
+
y: number;
|
|
14
|
+
width: number;
|
|
15
|
+
height: number;
|
|
16
|
+
}
|
|
17
|
+
/** A viewbox together with the scale diagram-js shows it at (`canvas.viewbox().scale`). */
|
|
18
|
+
interface ScaledViewbox extends Bounds {
|
|
19
|
+
scale: number;
|
|
20
|
+
}
|
|
21
|
+
/** Distances in pixels from the edges of the modeler's container. */
|
|
22
|
+
interface Insets {
|
|
23
|
+
top: number;
|
|
24
|
+
right: number;
|
|
25
|
+
bottom: number;
|
|
26
|
+
left: number;
|
|
27
|
+
}
|
|
28
|
+
/**
|
|
29
|
+
* The host column of guide §5.2: `ide` is a VS Code webview (later IntelliJ), `web` a Miragon web
|
|
30
|
+
* app that owns its page, `embedded` a modeler inside a foreign page (designIQ, modeler-api hosts).
|
|
31
|
+
*/
|
|
32
|
+
type ShellHost = "ide" | "web" | "embedded";
|
|
33
|
+
/**
|
|
34
|
+
* The `data-chrome` names of the chrome (guide §5.2, §13.4). The web column adds `primary`, `legal`,
|
|
35
|
+
* `toasts`, `empty-state`, `drop-zone` and `problems-popover` (0.2); IDE and embedded hosts never
|
|
36
|
+
* show `primary`, `legal`, `empty-state` and `drop-zone`, the IDE host never `toasts` and
|
|
37
|
+
* `problems-popover`.
|
|
38
|
+
*/
|
|
39
|
+
type ChromeIsland = "menu" | "palette" | "primary" | "zoom" | "problems" | "legend" | "inspector" | "status" | "legal" | "toasts" | "empty-state" | "drop-zone" | "problems-popover";
|
|
40
|
+
declare const CHROME_ISLANDS: readonly ChromeIsland[];
|
|
41
|
+
/** Where the palette sits: in the top row, or in the second row below it (guide §5.15). */
|
|
42
|
+
type PaletteRow = "top" | "second-row";
|
|
43
|
+
/**
|
|
44
|
+
* What the zoom panel and the chrome keys act on. The diagram-js viewport implements it; the DOM
|
|
45
|
+
* shell only talks to this interface.
|
|
46
|
+
*/
|
|
47
|
+
interface ZoomTarget {
|
|
48
|
+
/** The current zoom, 1 = 100 % (diagram-js `canvas.zoom()`, rounded to three decimals). */
|
|
49
|
+
zoom(): number;
|
|
50
|
+
/** One step on the zoom raster around the container centre (diagram-js `zoomScroll.stepZoom`). */
|
|
51
|
+
stepZoom(direction: 1 | -1): void;
|
|
52
|
+
/** 100 % around the container centre. Counts as a user move. */
|
|
53
|
+
zoomToActual(): void;
|
|
54
|
+
/** Explicit fit (button, Shift+1, command): animated unless reduced motion, makes the view automatic. */
|
|
55
|
+
fit(): void;
|
|
56
|
+
/** False while there is nothing to fit (the content bounds are empty). */
|
|
57
|
+
canFit(): boolean;
|
|
58
|
+
/**
|
|
59
|
+
* Calls `listener` after every viewbox change and whenever `canFit()` may have changed, possibly
|
|
60
|
+
* several times per frame. Returns the unsubscribe function.
|
|
61
|
+
*/
|
|
62
|
+
onChange(listener: () => void): () => void;
|
|
63
|
+
}
|
|
64
|
+
/** The persisted view (VS Code `setState`): JSON-serializable. */
|
|
65
|
+
interface ViewportState {
|
|
66
|
+
viewbox: Bounds;
|
|
67
|
+
/** The user zoomed or panned since the last fit; a resize no longer refits. */
|
|
68
|
+
userMoved: boolean;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
/** The statuses of guide §3.3 and §9; each colours bar and dot through `--cd-ui-<status>`. */
|
|
72
|
+
type ToastStatus = "success" | "info" | "warning" | "danger";
|
|
73
|
+
/** A ghost button before Close (guide §8); the toast then never closes by itself. */
|
|
74
|
+
interface ToastAction {
|
|
75
|
+
label: string;
|
|
76
|
+
/** Runs after the toast closed. */
|
|
77
|
+
onSelect(): void;
|
|
78
|
+
}
|
|
79
|
+
interface ToastRequest {
|
|
80
|
+
status: ToastStatus;
|
|
81
|
+
/** What happened and what you can do (guide §2): "Link copied", "Couldn't read this file. …". */
|
|
82
|
+
text: string;
|
|
83
|
+
action?: ToastAction | undefined;
|
|
84
|
+
/** Only to give a long text more time than `TOAST_DURATION_MS`; ignored with an `action`. */
|
|
85
|
+
durationMs?: number | undefined;
|
|
86
|
+
}
|
|
87
|
+
/** At most three toasts at once, the newest at the bottom (guide §8). */
|
|
88
|
+
declare const MAX_TOASTS = 3;
|
|
89
|
+
/**
|
|
90
|
+
* How long a toast stays without hover or focus (guide §8: about 2.8 s, errors about 5 s). A
|
|
91
|
+
* warning asks you to read a sentence and act on it like an error, so it gets the error's 5 s.
|
|
92
|
+
*/
|
|
93
|
+
declare const TOAST_DURATION_MS: Readonly<Record<ToastStatus, number>>;
|
|
94
|
+
/** The stack's widest toast: `min(480px, 100cqw − 24px)` (guide §8). */
|
|
95
|
+
declare const TOAST_MAX_WIDTH = 480;
|
|
96
|
+
/**
|
|
97
|
+
* Milliseconds until the toast closes by itself: `undefined` with an `action` (it never closes by
|
|
98
|
+
* itself, guide §8), else `max(TOAST_DURATION_MS[status], durationMs ?? 0)`.
|
|
99
|
+
*/
|
|
100
|
+
declare function toastLifetime(request: ToastRequest): number | undefined;
|
|
101
|
+
/** A toast in the stack as the eviction sees it, oldest first. */
|
|
102
|
+
interface ToastSlot {
|
|
103
|
+
id: number;
|
|
104
|
+
hasAction: boolean;
|
|
105
|
+
/** Hovered or holding the focus. */
|
|
106
|
+
engaged: boolean;
|
|
107
|
+
}
|
|
108
|
+
/**
|
|
109
|
+
* Which toast leaves when a fourth arrives (`MAX_TOASTS`): the oldest that is neither engaged nor
|
|
110
|
+
* has an action, else the oldest that is not engaged, else the oldest. `undefined` while the
|
|
111
|
+
* stack has room.
|
|
112
|
+
*/
|
|
113
|
+
declare function toastToEvict(stack: readonly ToastSlot[]): number | undefined;
|
|
114
|
+
/** Something in the bottom row the toast stack must clear, relative to the shell root. */
|
|
115
|
+
interface BottomObstacle {
|
|
116
|
+
left: number;
|
|
117
|
+
right: number;
|
|
118
|
+
/** Distance of its top edge from the container's bottom edge. */
|
|
119
|
+
top: number;
|
|
120
|
+
}
|
|
121
|
+
interface ToastStackInput {
|
|
122
|
+
containerWidth: number;
|
|
123
|
+
/** The visible zoom panel, legal line and problems pill (not the legend card). */
|
|
124
|
+
obstacles: readonly BottomObstacle[];
|
|
125
|
+
/**
|
|
126
|
+
* Measured width of the widest toast in the stack. The cards are sized to their text and centred
|
|
127
|
+
* in the stack, so only this column can touch an obstacle; absent = the whole `toastStackWidth`.
|
|
128
|
+
*/
|
|
129
|
+
cardWidth?: number | undefined;
|
|
130
|
+
}
|
|
131
|
+
/** `min(TOAST_MAX_WIDTH, containerWidth − 2 · SHELL.edge)`. */
|
|
132
|
+
declare function toastStackWidth(containerWidth: number): number;
|
|
133
|
+
/**
|
|
134
|
+
* The stack's `bottom` in px. Guide §8 anchors it at `bottom: 12px`, centred; where the column of
|
|
135
|
+
* its widest card (`cardWidth`, at most `toastStackWidth`, centred) comes closer than `SHELL.gap`
|
|
136
|
+
* horizontally to an obstacle, the stack stands `SHELL.gap` above the highest such obstacle instead
|
|
137
|
+
* (above the legal line 40, above the zoom panel 60, above a raised zoom panel or the web pill 88).
|
|
138
|
+
* Guide §8 does not settle this collision of a narrow container; it is the shell's rule until it does.
|
|
139
|
+
*/
|
|
140
|
+
declare function toastStackBottom(input: ToastStackInput): number;
|
|
141
|
+
|
|
142
|
+
export { type BottomObstacle as B, CHROME_ISLANDS as C, type Insets as I, MAX_TOASTS as M, type PaletteRow as P, type ScaledViewbox as S, TOAST_DURATION_MS as T, type ViewportState as V, type ZoomTarget as Z, type Bounds as a, type ChromeIsland as b, type Point as c, type ShellHost as d, type Size as e, TOAST_MAX_WIDTH as f, type ToastAction as g, type ToastRequest as h, type ToastSlot as i, type ToastStackInput as j, type ToastStatus as k, toastStackBottom as l, toastStackWidth as m, toastToEvict as n, toastLifetime as t };
|
|
@@ -0,0 +1,142 @@
|
|
|
1
|
+
/** A point in pixels or diagram coordinates, as the context says. */
|
|
2
|
+
interface Point {
|
|
3
|
+
x: number;
|
|
4
|
+
y: number;
|
|
5
|
+
}
|
|
6
|
+
interface Size {
|
|
7
|
+
width: number;
|
|
8
|
+
height: number;
|
|
9
|
+
}
|
|
10
|
+
/** A rectangle; content bounds and viewboxes are in diagram coordinates. */
|
|
11
|
+
interface Bounds {
|
|
12
|
+
x: number;
|
|
13
|
+
y: number;
|
|
14
|
+
width: number;
|
|
15
|
+
height: number;
|
|
16
|
+
}
|
|
17
|
+
/** A viewbox together with the scale diagram-js shows it at (`canvas.viewbox().scale`). */
|
|
18
|
+
interface ScaledViewbox extends Bounds {
|
|
19
|
+
scale: number;
|
|
20
|
+
}
|
|
21
|
+
/** Distances in pixels from the edges of the modeler's container. */
|
|
22
|
+
interface Insets {
|
|
23
|
+
top: number;
|
|
24
|
+
right: number;
|
|
25
|
+
bottom: number;
|
|
26
|
+
left: number;
|
|
27
|
+
}
|
|
28
|
+
/**
|
|
29
|
+
* The host column of guide §5.2: `ide` is a VS Code webview (later IntelliJ), `web` a Miragon web
|
|
30
|
+
* app that owns its page, `embedded` a modeler inside a foreign page (designIQ, modeler-api hosts).
|
|
31
|
+
*/
|
|
32
|
+
type ShellHost = "ide" | "web" | "embedded";
|
|
33
|
+
/**
|
|
34
|
+
* The `data-chrome` names of the chrome (guide §5.2, §13.4). The web column adds `primary`, `legal`,
|
|
35
|
+
* `toasts`, `empty-state`, `drop-zone` and `problems-popover` (0.2); IDE and embedded hosts never
|
|
36
|
+
* show `primary`, `legal`, `empty-state` and `drop-zone`, the IDE host never `toasts` and
|
|
37
|
+
* `problems-popover`.
|
|
38
|
+
*/
|
|
39
|
+
type ChromeIsland = "menu" | "palette" | "primary" | "zoom" | "problems" | "legend" | "inspector" | "status" | "legal" | "toasts" | "empty-state" | "drop-zone" | "problems-popover";
|
|
40
|
+
declare const CHROME_ISLANDS: readonly ChromeIsland[];
|
|
41
|
+
/** Where the palette sits: in the top row, or in the second row below it (guide §5.15). */
|
|
42
|
+
type PaletteRow = "top" | "second-row";
|
|
43
|
+
/**
|
|
44
|
+
* What the zoom panel and the chrome keys act on. The diagram-js viewport implements it; the DOM
|
|
45
|
+
* shell only talks to this interface.
|
|
46
|
+
*/
|
|
47
|
+
interface ZoomTarget {
|
|
48
|
+
/** The current zoom, 1 = 100 % (diagram-js `canvas.zoom()`, rounded to three decimals). */
|
|
49
|
+
zoom(): number;
|
|
50
|
+
/** One step on the zoom raster around the container centre (diagram-js `zoomScroll.stepZoom`). */
|
|
51
|
+
stepZoom(direction: 1 | -1): void;
|
|
52
|
+
/** 100 % around the container centre. Counts as a user move. */
|
|
53
|
+
zoomToActual(): void;
|
|
54
|
+
/** Explicit fit (button, Shift+1, command): animated unless reduced motion, makes the view automatic. */
|
|
55
|
+
fit(): void;
|
|
56
|
+
/** False while there is nothing to fit (the content bounds are empty). */
|
|
57
|
+
canFit(): boolean;
|
|
58
|
+
/**
|
|
59
|
+
* Calls `listener` after every viewbox change and whenever `canFit()` may have changed, possibly
|
|
60
|
+
* several times per frame. Returns the unsubscribe function.
|
|
61
|
+
*/
|
|
62
|
+
onChange(listener: () => void): () => void;
|
|
63
|
+
}
|
|
64
|
+
/** The persisted view (VS Code `setState`): JSON-serializable. */
|
|
65
|
+
interface ViewportState {
|
|
66
|
+
viewbox: Bounds;
|
|
67
|
+
/** The user zoomed or panned since the last fit; a resize no longer refits. */
|
|
68
|
+
userMoved: boolean;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
/** The statuses of guide §3.3 and §9; each colours bar and dot through `--cd-ui-<status>`. */
|
|
72
|
+
type ToastStatus = "success" | "info" | "warning" | "danger";
|
|
73
|
+
/** A ghost button before Close (guide §8); the toast then never closes by itself. */
|
|
74
|
+
interface ToastAction {
|
|
75
|
+
label: string;
|
|
76
|
+
/** Runs after the toast closed. */
|
|
77
|
+
onSelect(): void;
|
|
78
|
+
}
|
|
79
|
+
interface ToastRequest {
|
|
80
|
+
status: ToastStatus;
|
|
81
|
+
/** What happened and what you can do (guide §2): "Link copied", "Couldn't read this file. …". */
|
|
82
|
+
text: string;
|
|
83
|
+
action?: ToastAction | undefined;
|
|
84
|
+
/** Only to give a long text more time than `TOAST_DURATION_MS`; ignored with an `action`. */
|
|
85
|
+
durationMs?: number | undefined;
|
|
86
|
+
}
|
|
87
|
+
/** At most three toasts at once, the newest at the bottom (guide §8). */
|
|
88
|
+
declare const MAX_TOASTS = 3;
|
|
89
|
+
/**
|
|
90
|
+
* How long a toast stays without hover or focus (guide §8: about 2.8 s, errors about 5 s). A
|
|
91
|
+
* warning asks you to read a sentence and act on it like an error, so it gets the error's 5 s.
|
|
92
|
+
*/
|
|
93
|
+
declare const TOAST_DURATION_MS: Readonly<Record<ToastStatus, number>>;
|
|
94
|
+
/** The stack's widest toast: `min(480px, 100cqw − 24px)` (guide §8). */
|
|
95
|
+
declare const TOAST_MAX_WIDTH = 480;
|
|
96
|
+
/**
|
|
97
|
+
* Milliseconds until the toast closes by itself: `undefined` with an `action` (it never closes by
|
|
98
|
+
* itself, guide §8), else `max(TOAST_DURATION_MS[status], durationMs ?? 0)`.
|
|
99
|
+
*/
|
|
100
|
+
declare function toastLifetime(request: ToastRequest): number | undefined;
|
|
101
|
+
/** A toast in the stack as the eviction sees it, oldest first. */
|
|
102
|
+
interface ToastSlot {
|
|
103
|
+
id: number;
|
|
104
|
+
hasAction: boolean;
|
|
105
|
+
/** Hovered or holding the focus. */
|
|
106
|
+
engaged: boolean;
|
|
107
|
+
}
|
|
108
|
+
/**
|
|
109
|
+
* Which toast leaves when a fourth arrives (`MAX_TOASTS`): the oldest that is neither engaged nor
|
|
110
|
+
* has an action, else the oldest that is not engaged, else the oldest. `undefined` while the
|
|
111
|
+
* stack has room.
|
|
112
|
+
*/
|
|
113
|
+
declare function toastToEvict(stack: readonly ToastSlot[]): number | undefined;
|
|
114
|
+
/** Something in the bottom row the toast stack must clear, relative to the shell root. */
|
|
115
|
+
interface BottomObstacle {
|
|
116
|
+
left: number;
|
|
117
|
+
right: number;
|
|
118
|
+
/** Distance of its top edge from the container's bottom edge. */
|
|
119
|
+
top: number;
|
|
120
|
+
}
|
|
121
|
+
interface ToastStackInput {
|
|
122
|
+
containerWidth: number;
|
|
123
|
+
/** The visible zoom panel, legal line and problems pill (not the legend card). */
|
|
124
|
+
obstacles: readonly BottomObstacle[];
|
|
125
|
+
/**
|
|
126
|
+
* Measured width of the widest toast in the stack. The cards are sized to their text and centred
|
|
127
|
+
* in the stack, so only this column can touch an obstacle; absent = the whole `toastStackWidth`.
|
|
128
|
+
*/
|
|
129
|
+
cardWidth?: number | undefined;
|
|
130
|
+
}
|
|
131
|
+
/** `min(TOAST_MAX_WIDTH, containerWidth − 2 · SHELL.edge)`. */
|
|
132
|
+
declare function toastStackWidth(containerWidth: number): number;
|
|
133
|
+
/**
|
|
134
|
+
* The stack's `bottom` in px. Guide §8 anchors it at `bottom: 12px`, centred; where the column of
|
|
135
|
+
* its widest card (`cardWidth`, at most `toastStackWidth`, centred) comes closer than `SHELL.gap`
|
|
136
|
+
* horizontally to an obstacle, the stack stands `SHELL.gap` above the highest such obstacle instead
|
|
137
|
+
* (above the legal line 40, above the zoom panel 60, above a raised zoom panel or the web pill 88).
|
|
138
|
+
* Guide §8 does not settle this collision of a narrow container; it is the shell's rule until it does.
|
|
139
|
+
*/
|
|
140
|
+
declare function toastStackBottom(input: ToastStackInput): number;
|
|
141
|
+
|
|
142
|
+
export { type BottomObstacle as B, CHROME_ISLANDS as C, type Insets as I, MAX_TOASTS as M, type PaletteRow as P, type ScaledViewbox as S, TOAST_DURATION_MS as T, type ViewportState as V, type ZoomTarget as Z, type Bounds as a, type ChromeIsland as b, type Point as c, type ShellHost as d, type Size as e, TOAST_MAX_WIDTH as f, type ToastAction as g, type ToastRequest as h, type ToastSlot as i, type ToastStackInput as j, type ToastStatus as k, toastStackBottom as l, toastStackWidth as m, toastToEvict as n, toastLifetime as t };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { P as Platform,
|
|
1
|
+
import { d as ShellHost, Z as ZoomTarget, I as Insets, h as ToastRequest } from './toasts-Bp0REqdq.cjs';
|
|
2
|
+
import { P as Platform, k as ShellMessages, a as AppearanceChoice, i as ProblemItem, S as ShellMessageOverrides, l as ThemeColors } from './appearance-XX3JC3pI.cjs';
|
|
3
3
|
import { T as Theme } from './appearance-D3FUcbu6.cjs';
|
|
4
4
|
|
|
5
5
|
/*! @miragon/modeler-shell icon geometry
|
|
@@ -54,10 +54,11 @@ interface ShellOptions {
|
|
|
54
54
|
keyScope?: "document" | "root" | undefined;
|
|
55
55
|
/**
|
|
56
56
|
* The modes the modeler can show (a static value of the modeler package), default `["light"]`.
|
|
57
|
-
* Read in the `embedded`
|
|
58
|
-
* (until the contract's `appearance` surface an embedded modeler stays in its first mode,
|
|
59
|
-
* whatever the page shows) and mirrors the host's `data-cd-kontrast` (guide §13.3).
|
|
60
|
-
*
|
|
57
|
+
* Read in the `embedded` and `web` hosts. Embedded: the root carries `data-cd-theme="<themes[0]>"`
|
|
58
|
+
* itself (until the contract's `appearance` surface an embedded modeler stays in its first mode,
|
|
59
|
+
* whatever the page shows) and mirrors the host's `data-cd-kontrast` (guide §13.3). Web: with
|
|
60
|
+
* `"dark"` the shell renders the Appearance group and applies the choice on `<html>` (needs
|
|
61
|
+
* `appearance`); light-only it renders no group. In the `ide` host the host writes the mode.
|
|
61
62
|
*/
|
|
62
63
|
themes?: readonly Theme[] | undefined;
|
|
63
64
|
/** The fixed menu groups this modeler fills (guide §5.4); omitted groups and empty ones collapse. */
|
|
@@ -70,6 +71,21 @@ interface ShellOptions {
|
|
|
70
71
|
inspector?: InspectorOptions | undefined;
|
|
71
72
|
/** The empty-file hint of IDE and embedded hosts (guide §13.5); omitted = no hint. */
|
|
72
73
|
emptyHint?: EmptyHintOptions | undefined;
|
|
74
|
+
/** The primary action at the top right (guide §5.7); omitted = the top right stays empty. */
|
|
75
|
+
primary?: PrimaryActionOptions | undefined;
|
|
76
|
+
/**
|
|
77
|
+
* The legal line at the bottom left (guide §5.10), always rendered in the web host: copyright,
|
|
78
|
+
* Impressum and Datenschutz (`lang="de"`), then `links`.
|
|
79
|
+
*/
|
|
80
|
+
legal?: LegalLineOptions | undefined;
|
|
81
|
+
/** The File group, first in the menu (guide §5.4); omitted = no File group. */
|
|
82
|
+
file?: FileMenuOptions | undefined;
|
|
83
|
+
/** The mode choice of a dark-capable modeler (guide §13.3); required when `themes` includes `"dark"`. */
|
|
84
|
+
appearance?: WebAppearanceOptions | undefined;
|
|
85
|
+
/** The start screen (guide §8 Empty State); omitted = none. Shown by `setEmptyState(true)`. */
|
|
86
|
+
emptyState?: EmptyStateOptions | undefined;
|
|
87
|
+
/** Files dropped anywhere on the page (guide §9 Drag-over, Drop forbidden); omitted = none. */
|
|
88
|
+
dropZone?: DropZoneOptions | undefined;
|
|
73
89
|
}
|
|
74
90
|
/** Rendered in this order, separated by separators: Model, Export, Help (guide §5.4). */
|
|
75
91
|
interface MenuGroups {
|
|
@@ -113,6 +129,10 @@ interface MenuActionEntry extends MenuItemBase {
|
|
|
113
129
|
*/
|
|
114
130
|
interface MenuDialogEntry extends MenuItemBase {
|
|
115
131
|
kind: "dialog";
|
|
132
|
+
/** Shortcut chip text shown on the right, verbatim ("?" for "Keyboard shortcuts…"). */
|
|
133
|
+
shortcut?: string | undefined;
|
|
134
|
+
/** As for `MenuActionEntry`: default `ariaKeyShortcutsFromLabel(shortcut)`, `""` sets none. */
|
|
135
|
+
ariaKeyShortcuts?: string | undefined;
|
|
116
136
|
onSelect(): void;
|
|
117
137
|
}
|
|
118
138
|
/** `menuitemcheckbox`: toggles and keeps the menu open; the check mark carries the state. */
|
|
@@ -139,8 +159,17 @@ interface MenuRadioOption {
|
|
|
139
159
|
label: string;
|
|
140
160
|
}
|
|
141
161
|
interface ProblemsOptions {
|
|
142
|
-
/**
|
|
143
|
-
|
|
162
|
+
/**
|
|
163
|
+
* A click on the pill where the host has a problems view of its own: the IDE host opens its
|
|
164
|
+
* Problems view (give it there), an embedding host its own list. Ignored in the web host, where
|
|
165
|
+
* the pill opens the problems popover; an embedded shell without it opens the popover as well.
|
|
166
|
+
*/
|
|
167
|
+
onActivate?: (() => void) | undefined;
|
|
168
|
+
/**
|
|
169
|
+
* A click on a row of the problems popover, after the popover closed (guide §5.10): select the
|
|
170
|
+
* element the item names, where there is one.
|
|
171
|
+
*/
|
|
172
|
+
onSelectItem?: ((item: ProblemItem) => void) | undefined;
|
|
144
173
|
}
|
|
145
174
|
interface LegendOptions {
|
|
146
175
|
/** Renders the legend rows into `body` once (classes `cd-shell-legend-*`, see API.md). */
|
|
@@ -177,6 +206,10 @@ interface ShellHandle {
|
|
|
177
206
|
readonly tooltip: TooltipHandle;
|
|
178
207
|
readonly legend: LegendHandle | undefined;
|
|
179
208
|
readonly inspector: InspectorHandle | undefined;
|
|
209
|
+
/** The web app's primary action; `undefined` without `primary` and outside the web host. */
|
|
210
|
+
readonly primary: PrimaryActionHandle | undefined;
|
|
211
|
+
/** The web app's mode choice; `undefined` outside the web host and for a light-only modeler. */
|
|
212
|
+
readonly appearance: AppearanceHandle | undefined;
|
|
180
213
|
/** Binds zoom panel, readout and chrome keys; `null` unbinds (buttons disabled). */
|
|
181
214
|
setZoomTarget(target: ZoomTarget | null): void;
|
|
182
215
|
/** The fit insets for what is open right now (palette row, legend, inspector, pill). */
|
|
@@ -207,6 +240,21 @@ interface ShellHandle {
|
|
|
207
240
|
}): void;
|
|
208
241
|
/** The lock, true from the first `setReadOnly(true)` on, also while its marks are still delayed. */
|
|
209
242
|
isReadOnly(): boolean;
|
|
243
|
+
/**
|
|
244
|
+
* Shows or hides the web app's start screen (guide §8): while it shows, menu trigger, primary
|
|
245
|
+
* action, palette, zoom panel, pill, legend, status box, hint and inspector are hidden, the canvas
|
|
246
|
+
* slot is `inert` and the chrome keys do nothing; the legal line, toasts and the drop zone stay.
|
|
247
|
+
* A no-op without `emptyState`. Hiding it while it holds the focus moves the focus to the canvas.
|
|
248
|
+
*/
|
|
249
|
+
setEmptyState(shown: boolean): void;
|
|
250
|
+
isEmptyStateShown(): boolean;
|
|
251
|
+
/**
|
|
252
|
+
* Shows a toast (guide §8, §9) in the web and embedded hosts: bottom centre, at most three, the
|
|
253
|
+
* newest at the bottom, closing by itself after `toastLifetime` unless hovered or focused. In the
|
|
254
|
+
* `ide` host it shows nothing and returns an inert handle: there the extension shows the host's
|
|
255
|
+
* notification (§13.5).
|
|
256
|
+
*/
|
|
257
|
+
toast(request: ToastRequest): ToastHandle;
|
|
210
258
|
/** Removes every element, attribute, listener, observer and timer the shell added. Idempotent. */
|
|
211
259
|
destroy(): void;
|
|
212
260
|
}
|
|
@@ -274,11 +322,124 @@ interface ProblemSummary {
|
|
|
274
322
|
count: number;
|
|
275
323
|
/** How many of them are errors; decides icon and wording. */
|
|
276
324
|
errors: number;
|
|
325
|
+
/**
|
|
326
|
+
* The rows of the problems popover (web, embedded without `onActivate`), in this order; the IDE
|
|
327
|
+
* host ignores them. `problemSummary(items)` builds the whole summary from them.
|
|
328
|
+
*/
|
|
329
|
+
items?: readonly ProblemItem[] | undefined;
|
|
277
330
|
}
|
|
278
331
|
type StatusSeverity = "danger" | "warning";
|
|
279
332
|
interface StatusMessage {
|
|
280
333
|
severity: StatusSeverity;
|
|
281
334
|
text: string;
|
|
282
335
|
}
|
|
336
|
+
/** The web app's primary action (guide §5.7): a blue primary button, icon and label, at the top right. */
|
|
337
|
+
interface PrimaryActionOptions {
|
|
338
|
+
/** Label and `aria-label`; default `messages.share` ("Share"). */
|
|
339
|
+
label?: string | undefined;
|
|
340
|
+
/** Default `"share-2"`. */
|
|
341
|
+
icon?: ShellIconName | undefined;
|
|
342
|
+
onSelect(): void;
|
|
343
|
+
/** Read on mount and on `primary.refresh()`; disabled stays focusable (`aria-disabled`). */
|
|
344
|
+
disabled?: (() => boolean) | undefined;
|
|
345
|
+
}
|
|
346
|
+
interface PrimaryActionHandle {
|
|
347
|
+
/** The `<button data-chrome="primary">`. */
|
|
348
|
+
readonly element: HTMLButtonElement;
|
|
349
|
+
/** True while the label is collapsed to the icon (guide §5.15); the root then carries `data-primary="collapsed"`. */
|
|
350
|
+
isCollapsed(): boolean;
|
|
351
|
+
/** Re-reads `disabled()`. */
|
|
352
|
+
refresh(): void;
|
|
353
|
+
}
|
|
354
|
+
/** A link of the legal line after Impressum and Datenschutz. */
|
|
355
|
+
interface LegalLink {
|
|
356
|
+
label: string;
|
|
357
|
+
href: string;
|
|
358
|
+
/** For a label in another language than the tool's. */
|
|
359
|
+
lang?: string | undefined;
|
|
360
|
+
}
|
|
361
|
+
interface LegalLineOptions {
|
|
362
|
+
/** After Impressum and Datenschutz: `{ label: "GitHub", href: "https://github.com/Miragon/…" }`. */
|
|
363
|
+
links?: readonly LegalLink[] | undefined;
|
|
364
|
+
/** The copyright year; default the current year at mount. */
|
|
365
|
+
year?: number | undefined;
|
|
366
|
+
}
|
|
367
|
+
/** One entry of the File group; label and icon come from the shell (guide §2, §5.4). */
|
|
368
|
+
interface FileMenuAction {
|
|
369
|
+
onSelect(): void;
|
|
370
|
+
/** Shortcut chip, e.g. "⌘O"; the web app binds the key itself. */
|
|
371
|
+
shortcut?: string | undefined;
|
|
372
|
+
/** `kind: "dialog"` (`aria-haspopup="dialog"`) when it opens an in-page dialog, not the browser's file picker. */
|
|
373
|
+
dialog?: boolean | undefined;
|
|
374
|
+
disabled?: (() => boolean) | undefined;
|
|
375
|
+
}
|
|
376
|
+
/**
|
|
377
|
+
* The File group of the web app (guide §5.4), in this order, as far as the modeler has them:
|
|
378
|
+
* "New diagram" (`file-plus`), "Open…" (`folder-open`), "Show example", "Import…" (`import`).
|
|
379
|
+
* Menu ids `new-diagram`, `open`, `show-example`, `import`, `data-menu-group="file"`.
|
|
380
|
+
*/
|
|
381
|
+
interface FileMenuOptions {
|
|
382
|
+
newDiagram?: FileMenuAction | undefined;
|
|
383
|
+
open?: FileMenuAction | undefined;
|
|
384
|
+
showExample?: FileMenuAction | undefined;
|
|
385
|
+
import?: FileMenuAction | undefined;
|
|
386
|
+
}
|
|
387
|
+
/** What `localStorage` offers; a blocked storage throws, the shell catches it. */
|
|
388
|
+
interface StorageLike {
|
|
389
|
+
getItem(key: string): string | null;
|
|
390
|
+
setItem(key: string, value: string): void;
|
|
391
|
+
removeItem(key: string): void;
|
|
392
|
+
}
|
|
393
|
+
interface WebAppearanceOptions {
|
|
394
|
+
/** The two `theme-color` values from the vendored token JSON (see `ThemeColors`). */
|
|
395
|
+
themeColors: ThemeColors;
|
|
396
|
+
/** Default `globalThis.localStorage`. */
|
|
397
|
+
storage?: StorageLike | undefined;
|
|
398
|
+
}
|
|
399
|
+
/** The mode choice of a dark-capable web app (guide §13.3), as the Appearance group drives it. */
|
|
400
|
+
interface AppearanceHandle {
|
|
401
|
+
/** The stored choice, `"system"` without one. */
|
|
402
|
+
choice(): AppearanceChoice;
|
|
403
|
+
/**
|
|
404
|
+
* Stores the choice (`"system"` removes `APPEARANCE_STORAGE_KEY`) and applies `documentMode` on
|
|
405
|
+
* `<html>` and the metas in one step, with `cd-shell-no-transition` for one frame (guide §7).
|
|
406
|
+
*/
|
|
407
|
+
setChoice(choice: AppearanceChoice): void;
|
|
408
|
+
}
|
|
409
|
+
/** The web app's start screen (guide §8): a centred glass card with the Komet and two actions. */
|
|
410
|
+
interface EmptyStateOptions {
|
|
411
|
+
/** The card's title (h1, 21px/600), the modeler's name: "Event Storming Modeler". */
|
|
412
|
+
title: string;
|
|
413
|
+
/** One line of help (16px/1.6, `--cd-ui-text-leise`): "Start a new diagram, or explore the example." */
|
|
414
|
+
text: string;
|
|
415
|
+
/**
|
|
416
|
+
* URL of the official Miragon icon `miragon-komet-blau.svg`, vendored unchanged from
|
|
417
|
+
* `Miragon/corporate-identity` (guide §2, §11), shown at 64px with `alt=""`.
|
|
418
|
+
*/
|
|
419
|
+
komet: string;
|
|
420
|
+
/** "New diagram", the blue primary button. The shell hides the card first. */
|
|
421
|
+
onNewDiagram(): void;
|
|
422
|
+
/** "Show example", the ghost button; omitted = no example button. The shell hides the card first. */
|
|
423
|
+
onShowExample?: (() => void) | undefined;
|
|
424
|
+
/** The drag-and-drop hint (13px, `--cd-ui-text-leise`), shown with a `dropZone` only; default `messages.dropHint`. */
|
|
425
|
+
dropHint?: string | undefined;
|
|
426
|
+
}
|
|
427
|
+
interface DropZoneOptions {
|
|
428
|
+
/**
|
|
429
|
+
* Like `<input accept>`: extensions (".storm") and MIME types ("application/json", "text/*").
|
|
430
|
+
* List the MIME types too, so a drag can already show a foreign type as forbidden. Empty = any file.
|
|
431
|
+
*/
|
|
432
|
+
accept: readonly string[];
|
|
433
|
+
/** Default `false`: a drag with more than one file is forbidden. */
|
|
434
|
+
multiple?: boolean | undefined;
|
|
435
|
+
/** The dropped files that match `accept` (one unless `multiple`). */
|
|
436
|
+
onDrop(files: readonly File[]): void;
|
|
437
|
+
/** The dropped files outside `accept`; default a danger toast `messages.cannotOpenFile`. */
|
|
438
|
+
onReject?: ((files: readonly File[]) => void) | undefined;
|
|
439
|
+
}
|
|
440
|
+
interface ToastHandle {
|
|
441
|
+
/** Closes the toast (slide and fade out); a second call does nothing. */
|
|
442
|
+
dismiss(): void;
|
|
443
|
+
}
|
|
283
444
|
|
|
284
|
-
export { type EmptyHintOptions as E, ICONS as I, type
|
|
445
|
+
export { type AppearanceHandle as A, type StorageLike as B, type TooltipContent as C, type DropZoneOptions as D, type EmptyHintOptions as E, type FileMenuAction as F, type TooltipHandle as G, iconElement as H, ICONS as I, iconMarkup as J, type LegalLineOptions as L, type MenuActionEntry as M, PALETTE_TOOL_ICON as P, type ShellOptions as S, type ToastHandle as T, type WebAppearanceOptions as W, type ShellHandle as a, type EmptyStateOptions as b, type FileMenuOptions as c, type IconNode as d, type IconOptions as e, type InspectorHandle as f, type InspectorOptions as g, type LegalLink as h, type LegendHandle as i, type LegendOptions as j, type MenuCheckboxEntry as k, type MenuDialogEntry as l, type MenuEntry as m, type MenuGroups as n, type MenuHandle as o, type MenuRadioGroup as p, type MenuRadioOption as q, type PaletteReadOnlyState as r, type PaletteRegistration as s, type PrimaryActionHandle as t, type PrimaryActionOptions as u, type ProblemSummary as v, type ProblemsOptions as w, type ShellIconName as x, type StatusMessage as y, type StatusSeverity as z };
|