@miragon/pulse-widget-shell 0.0.0-stage → 0.21.0

package/dist/ui/bpmn-tokens.js

@@ -0,0 +1,114 @@
+import { CD_TOKENS } from "@miragon/mcp-toolkit-ui";
+/**
+ * THE token module of the BPMN canvas (modeler-tool-design §3.6, §10, §13):
+ * every colour the diagram's overlays, badges and heat layer paint is a
+ * `--cd-*` corporate-design token, named here once. Two consumers read it:
+ *
+ * - CSS ({@link BPMN_OVERLAY_CSS}) refers to the tokens as `var(--cd-*)`,
+ *   which the toolkit's theme vendors on `:root`;
+ * - code that needs numbers (the heat canvas, contrast checks) resolves the
+ *   same names through the toolkit's `CD_TOKENS`.
+ *
+ * `bpmn-tokens.test.ts` is the drift test (every name's `CD_TOKENS` value
+ * equals the vendored stylesheet's `--cd-*`) and the contrast test (strokes
+ * ≥ 3:1 against the paper and their own fill, badge text ≥ 4.5:1).
+ *
+ * The semantics (owner decision, #322): an incident is `danger` (stroke,
+ * tint, count badge — red only for incidents); running and active activities
+ * are blue (`--cd-blau` stroke on the `--cd-info-soft` tint), an open user
+ * task the same with a heavier dashed stroke (shape, not colour, tells it
+ * apart — and it stands still: no pulse, so `prefers-reduced-motion` has
+ * nothing to stop); counts are white on blue or danger.
+ */
+export const BPMN_TOKENS = {
+    /** The paper: always light, in every theme. */
+    paper: "weiss",
+    incident: { stroke: "danger", fill: "danger-soft" },
+    running: { stroke: "blau", fill: "info-soft" },
+    openTask: { stroke: "blau", fill: "info-soft" },
+    instanceBadge: { fill: "blau", text: "weiss" },
+    incidentBadge: { fill: "danger", text: "weiss" },
+    /** The data-viz ramp of the heatmap: one hue, pale to full blue. */
+    heat: { from: "info-soft", to: "blau" },
+};
+/** A token as a CSS value (`var(--cd-danger)`). */
+export function cdVar(name) {
+    return `var(--cd-${name})`;
+}
+/** A token's value (`#CD1839`) — for code that paints numbers, never for CSS. */
+export function cdValue(name) {
+    return CD_TOKENS[name];
+}
+/**
+ * Stroke widths in diagram units: 2 for a state, 3 for an open user task
+ * (with its dash), bpmn-js draws plain shapes at 2.
+ */
+const STATE_STROKE = 2;
+const OPEN_TASK_STROKE = 3;
+const OPEN_TASK_DASH = "8 4";
+const { incident, running, openTask, instanceBadge, incidentBadge } = BPMN_TOKENS;
+/**
+ * The overlay stylesheet: marker classes on bpmn-js shapes
+ * (`canvas.addMarker(id, "highlight-incident")`) and the count badges added
+ * as overlays (`<div class="bpmn-overlay-badge bpmn-overlay-badge--…">`).
+ * Inject it once per document with {@link injectBpmnOverlayCss}.
+ */
+export const BPMN_OVERLAY_CSS = `
+.highlight-running:not(.djs-connection) .djs-visual > :nth-child(1) {
+  fill: ${cdVar(running.fill)} !important;
+  stroke: ${cdVar(running.stroke)} !important;
+  stroke-width: ${STATE_STROKE}px !important;
+}
+.highlight-open-user-task:not(.djs-connection) .djs-visual > :nth-child(1) {
+  fill: ${cdVar(openTask.fill)} !important;
+  stroke: ${cdVar(openTask.stroke)} !important;
+  stroke-width: ${OPEN_TASK_STROKE}px !important;
+  stroke-dasharray: ${OPEN_TASK_DASH} !important;
+}
+.highlight-incident:not(.djs-connection) .djs-visual > :nth-child(1) {
+  fill: ${cdVar(incident.fill)} !important;
+  stroke: ${cdVar(incident.stroke)} !important;
+  stroke-width: ${STATE_STROKE}px !important;
+}
+.bpmn-overlay-badge {
+  border-radius: var(--cd-radius-pill);
+  height: 22px;
+  min-width: 22px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0 6px;
+  font-family: var(--font-sans);
+  font-size: 13px;
+  font-weight: 600;
+  font-variant-numeric: tabular-nums;
+  box-shadow: var(--cd-shadow-1);
+}
+.bpmn-overlay-badge--instance-count {
+  background: ${cdVar(instanceBadge.fill)};
+  color: ${cdVar(instanceBadge.text)};
+}
+.bpmn-overlay-badge--incident-count {
+  background: ${cdVar(incidentBadge.fill)};
+  color: ${cdVar(incidentBadge.text)};
+}
+`;
+const STYLE_ID = "bpmn-overlay-css";
+/** Add {@link BPMN_OVERLAY_CSS} to the document once (idempotent). */
+export function injectBpmnOverlayCss(doc = document) {
+    if (doc.getElementById(STYLE_ID))
+        return;
+    const style = doc.createElement("style");
+    style.id = STYLE_ID;
+    style.textContent = BPMN_OVERLAY_CSS;
+    doc.head.appendChild(style);
+}
+/** The legend swatch of a marker: its tint with a stroke-coloured edge, as an inline style. */
+export function markerSwatch(marker) {
+    return { borderColor: cdVar(marker.stroke), background: cdVar(marker.fill) };
+}
+/** The legend swatch of a count badge, as an inline style. */
+export function badgeSwatch(badge) {
+    return { background: cdVar(badge.fill), color: cdVar(badge.text) };
+}
+//# sourceMappingURL=bpmn-tokens.js.map

package/dist/ui/bpmn-tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bpmn-tokens.js","sourceRoot":"","sources":["../../src/ui/bpmn-tokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAoB,MAAM,yBAAyB,CAAA;AAErE;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,+CAA+C;IAC/C,KAAK,EAAE,OAAO;IACd,QAAQ,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,aAAa,EAAE;IACnD,OAAO,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE;IAC9C,QAAQ,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE;IAC/C,aAAa,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE;IAC9C,aAAa,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE;IAChD,oEAAoE;IACpE,IAAI,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,EAAE,EAAE,MAAM,EAAE;CASxC,CAAA;AAED,mDAAmD;AACnD,MAAM,UAAU,KAAK,CAAC,IAAiB;IACrC,OAAO,YAAY,IAAI,GAAG,CAAA;AAC5B,CAAC;AAED,iFAAiF;AACjF,MAAM,UAAU,OAAO,CAAC,IAAiB;IACvC,OAAO,SAAS,CAAC,IAAI,CAAC,CAAA;AACxB,CAAC;AAED;;;GAGG;AACH,MAAM,YAAY,GAAG,CAAC,CAAA;AACtB,MAAM,gBAAgB,GAAG,CAAC,CAAA;AAC1B,MAAM,cAAc,GAAG,KAAK,CAAA;AAE5B,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,aAAa,EAAE,GAAG,WAAW,CAAA;AAEjF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG;;UAEtB,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;YACjB,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC;kBACf,YAAY;;;UAGpB,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC;YAClB,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC;kBAChB,gBAAgB;sBACZ,cAAc;;;UAG1B,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC;YAClB,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC;kBAChB,YAAY;;;;;;;;;;;;;;;;;gBAiBd,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC;WAC9B,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC;;;gBAGpB,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC;WAC9B,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC;;CAEnC,CAAA;AAED,MAAM,QAAQ,GAAG,kBAAkB,CAAA;AAEnC,sEAAsE;AACtE,MAAM,UAAU,oBAAoB,CAAC,MAAgB,QAAQ;IAC3D,IAAI,GAAG,CAAC,cAAc,CAAC,QAAQ,CAAC;QAAE,OAAM;IACxC,MAAM,KAAK,GAAG,GAAG,CAAC,aAAa,CAAC,OAAO,CAAC,CAAA;IACxC,KAAK,CAAC,EAAE,GAAG,QAAQ,CAAA;IACnB,KAAK,CAAC,WAAW,GAAG,gBAAgB,CAAA;IACpC,GAAG,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAA;AAC7B,CAAC;AAED,+FAA+F;AAC/F,MAAM,UAAU,YAAY,CAAC,MAAkD;IAI7E,OAAO,EAAE,WAAW,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAA;AAC9E,CAAC;AAED,8DAA8D;AAC9D,MAAM,UAAU,WAAW,CAAC,KAA+C;IAIzE,OAAO,EAAE,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAA;AACpE,CAAC"}

package/dist/ui/bpmn-tokens.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=bpmn-tokens.test.d.ts.map

package/dist/ui/bpmn-tokens.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"bpmn-tokens.test.d.ts","sourceRoot":"","sources":["../../src/ui/bpmn-tokens.test.ts"],"names":[],"mappings":""}

package/dist/ui/bpmn-tokens.test.js

@@ -0,0 +1,98 @@
+import { readFileSync } from "node:fs";
+import { createRequire } from "node:module";
+import { describe, expect, it } from "vitest";
+import { CD_TOKENS } from "@miragon/mcp-toolkit-ui";
+import { contrastRatio, parseThemeVariables, resolveColor, toolkitThemeStylesheets, } from "../testing/index.js";
+import { BPMN_OVERLAY_CSS, BPMN_TOKENS, badgeSwatch, cdValue, cdVar, markerSwatch, } from "./bpmn-tokens.js";
+/** Every `--cd-*` token name the module uses. */
+function tokenNames(value) {
+    if (typeof value === "string")
+        return [value];
+    return Object.values(value).flatMap(tokenNames);
+}
+const USED = [...new Set(tokenNames(BPMN_TOKENS))];
+/** The vendored corporate-design stylesheet, as the toolkit ships it. */
+function vendoredTokens() {
+    const require = createRequire(import.meta.url);
+    const css = readFileSync(require.resolve("@miragon/mcp-toolkit-ui/cd-tokens.generated.css"), "utf8");
+    return new Map([...css.matchAll(/--cd-([\w-]+):\s*([^;]+);/g)].map(([, name, value]) => [name, value.trim()]));
+}
+/** A token on the light paper (the canvas is light in every theme). */
+const light = parseThemeVariables(...toolkitThemeStylesheets()).light;
+const color = (name) => resolveColor(cdVar(name), light);
+const ratio = (a, b) => contrastRatio(color(a), color(b));
+describe("BPMN token module ↔ the vendored CSS (modeler-tool-design §13 drift test)", () => {
+    it("names only tokens the vendored stylesheet defines, with the same value as CD_TOKENS", () => {
+        const css = vendoredTokens();
+        expect(USED.length).toBeGreaterThan(0);
+        for (const name of USED) {
+            expect(css.get(name), `--cd-${name}`).toBeDefined();
+            expect(cdValue(name).toLowerCase(), `--cd-${name}`).toBe(css.get(name)?.toLowerCase());
+            expect(CD_TOKENS[name]).toBe(cdValue(name));
+        }
+    });
+    it("the overlay CSS refers to the tokens by variable — no raw colour", () => {
+        expect(BPMN_OVERLAY_CSS).not.toMatch(/#[0-9a-f]{3,8}\b|rgba?\(/i);
+        const referenced = [...BPMN_OVERLAY_CSS.matchAll(/var\(--cd-([\w-]+)\)/g)].map((m) => m[1]);
+        const css = vendoredTokens();
+        for (const name of referenced)
+            expect(css.has(name), `--cd-${name}`).toBe(true);
+        for (const marker of [BPMN_TOKENS.incident, BPMN_TOKENS.running, BPMN_TOKENS.openTask]) {
+            expect(BPMN_OVERLAY_CSS).toContain(`stroke: ${cdVar(marker.stroke)} !important`);
+            expect(BPMN_OVERLAY_CSS).toContain(`fill: ${cdVar(marker.fill)} !important`);
+        }
+    });
+    it("red only for incidents; running and active blue on the info tint", () => {
+        expect(BPMN_TOKENS.incident).toEqual({ stroke: "danger", fill: "danger-soft" });
+        expect(BPMN_TOKENS.incidentBadge.fill).toBe("danger");
+        expect(BPMN_TOKENS.running).toEqual({ stroke: "blau", fill: "info-soft" });
+        expect(BPMN_TOKENS.openTask).toEqual({ stroke: "blau", fill: "info-soft" });
+        expect(BPMN_TOKENS.instanceBadge.fill).toBe("blau");
+        expect(BPMN_TOKENS.heat).toEqual({ from: "info-soft", to: "blau" });
+        const danger = new Set(["danger", "danger-soft", "danger-hell"]);
+        const nonIncident = [
+            BPMN_TOKENS.running,
+            BPMN_TOKENS.openTask,
+            BPMN_TOKENS.instanceBadge,
+            BPMN_TOKENS.heat,
+        ];
+        for (const name of tokenNames(nonIncident))
+            expect(danger.has(name)).toBe(false);
+    });
+    it("an open task stands still: a dashed stroke, no animation (prefers-reduced-motion)", () => {
+        expect(BPMN_OVERLAY_CSS).not.toMatch(/animation|@keyframes|transition/);
+        expect(BPMN_OVERLAY_CSS).toMatch(/highlight-open-user-task[^}]*stroke-dasharray/);
+    });
+    it("the legend swatches paint what the diagram paints", () => {
+        expect(markerSwatch(BPMN_TOKENS.incident)).toEqual({
+            borderColor: "var(--cd-danger)",
+            background: "var(--cd-danger-soft)",
+        });
+        expect(badgeSwatch(BPMN_TOKENS.instanceBadge)).toEqual({
+            background: "var(--cd-blau)",
+            color: "var(--cd-weiss)",
+        });
+    });
+});
+describe("BPMN palette contrast (CI §3.6: strokes ≥ 3:1, text ≥ 4.5:1)", () => {
+    it.each([
+        ["incident", BPMN_TOKENS.incident],
+        ["running", BPMN_TOKENS.running],
+        ["open task", BPMN_TOKENS.openTask],
+    ])("%s: the stroke reads against the paper and against its own tint", (_, marker) => {
+        expect(ratio(marker.stroke, BPMN_TOKENS.paper)).toBeGreaterThanOrEqual(3);
+        expect(ratio(marker.stroke, marker.fill)).toBeGreaterThanOrEqual(3);
+    });
+    it.each([
+        ["instance count", BPMN_TOKENS.instanceBadge],
+        ["incident count", BPMN_TOKENS.incidentBadge],
+    ])("%s: the badge text reaches 4.5:1 on its fill", (_, badge) => {
+        expect(ratio(badge.text, badge.fill)).toBeGreaterThanOrEqual(4.5);
+    });
+    it("a badge stands off the paper (3:1)", () => {
+        for (const badge of [BPMN_TOKENS.instanceBadge, BPMN_TOKENS.incidentBadge]) {
+            expect(ratio(badge.fill, BPMN_TOKENS.paper)).toBeGreaterThanOrEqual(3);
+        }
+    });
+});
+//# sourceMappingURL=bpmn-tokens.test.js.map

package/dist/ui/bpmn-tokens.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bpmn-tokens.test.js","sourceRoot":"","sources":["../../src/ui/bpmn-tokens.test.ts"],"names":[],"mappings":"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"}

package/dist/ui/bpmn-zoom-controls.d.ts

@@ -0,0 +1,30 @@
+export interface BpmnZoomControlsLabels {
+    zoomIn?: string;
+    zoomOut?: string;
+    fit?: string;
+}
+export interface BpmnZoomControlsProps {
+    onZoomIn: () => void;
+    onZoomOut: () => void;
+    onFit: () => void;
+    /** Accessible names; default to the active locale's (en/de). */
+    labels?: BpmnZoomControlsLabels;
+    /** Merged over the default placement — e.g. `top-6 right-6` repositions. */
+    className?: string;
+}
+/**
+ * The shared floating zoom button bar rendered top-right over a BPMN canvas.
+ * Top, not bottom: bpmn-js pins its bpmn.io logo — a licence requirement,
+ * never hidden — at the canvas's bottom-right with `z-index: 100`, where it
+ * covered the zoom-out button (a documented deviation from CI §5's
+ * bottom-right zoom). One class set for every BPMN widget so the controls
+ * cannot drift between the plain diagram and the heatmap.
+ *
+ * Chrome over the paper stays LIGHT in every theme (CI §8 "Palette /
+ * Context-Pad … hell halten", §10): the bar is a forced-light island
+ * (`data-theme-mode="light"`), so in a dark host it is the white bar on the
+ * white paper, never a black chip. A dense bar: 32 px icon buttons, Lucide at
+ * stroke 2, the name in `aria-label` and `title`, the toolkit's focus ring.
+ */
+export declare function BpmnZoomControls({ onZoomIn, onZoomOut, onFit, labels, className, }: BpmnZoomControlsProps): import("react").JSX.Element;
+//# sourceMappingURL=bpmn-zoom-controls.d.ts.map

package/dist/ui/bpmn-zoom-controls.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"bpmn-zoom-controls.d.ts","sourceRoot":"","sources":["../../src/ui/bpmn-zoom-controls.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,sBAAsB;IACrC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,GAAG,CAAC,EAAE,MAAM,CAAA;CACb;AAED,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,EAAE,MAAM,IAAI,CAAA;IACrB,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,gEAAgE;IAChE,MAAM,CAAC,EAAE,sBAAsB,CAAA;IAC/B,4EAA4E;IAC5E,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,KAAK,EACL,MAAM,EACN,SAAS,GACV,EAAE,qBAAqB,+BAgCvB"}

package/dist/ui/bpmn-zoom-controls.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn, FOCUS_RING_INSET, useLocale } from "@miragon/mcp-toolkit-ui";
+import { Scan, ZoomIn, ZoomOut } from "lucide-react";
+import { Icon } from "./icon.js";
+import { kitLabels } from "./kit-labels.js";
+/**
+ * The shared floating zoom button bar rendered top-right over a BPMN canvas.
+ * Top, not bottom: bpmn-js pins its bpmn.io logo — a licence requirement,
+ * never hidden — at the canvas's bottom-right with `z-index: 100`, where it
+ * covered the zoom-out button (a documented deviation from CI §5's
+ * bottom-right zoom). One class set for every BPMN widget so the controls
+ * cannot drift between the plain diagram and the heatmap.
+ *
+ * Chrome over the paper stays LIGHT in every theme (CI §8 "Palette /
+ * Context-Pad … hell halten", §10): the bar is a forced-light island
+ * (`data-theme-mode="light"`), so in a dark host it is the white bar on the
+ * white paper, never a black chip. A dense bar: 32 px icon buttons, Lucide at
+ * stroke 2, the name in `aria-label` and `title`, the toolkit's focus ring.
+ */
+export function BpmnZoomControls({ onZoomIn, onZoomOut, onFit, labels, className, }) {
+    const defaults = kitLabels(useLocale());
+    const buttons = [
+        { key: "in", icon: ZoomIn, onClick: onZoomIn, title: labels?.zoomIn ?? defaults.zoomIn },
+        { key: "fit", icon: Scan, onClick: onFit, title: labels?.fit ?? defaults.fitViewport },
+        { key: "out", icon: ZoomOut, onClick: onZoomOut, title: labels?.zoomOut ?? defaults.zoomOut },
+    ];
+    return (_jsx("div", { "data-theme-mode": "light", className: cn("border-border bg-card text-card-foreground shadow-1 absolute top-3 right-3 flex flex-col overflow-hidden rounded-md border", className), children: buttons.map(({ key, icon, onClick, title }) => (_jsx("button", { type: "button", onClick: onClick, title: title, "aria-label": title, className: cn("hover:bg-accent hover:text-accent-foreground active:bg-accent [&:not(:last-child)]:border-border flex size-8 items-center justify-center transition-colors [&:not(:last-child)]:border-b", FOCUS_RING_INSET), children: _jsx(Icon, { icon: icon, dense: true }) }, key))) }));
+}
+//# sourceMappingURL=bpmn-zoom-controls.js.map

package/dist/ui/bpmn-zoom-controls.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bpmn-zoom-controls.js","sourceRoot":"","sources":["../../src/ui/bpmn-zoom-controls.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,gBAAgB,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAA;AACzE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AACpD,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAA;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAkB3C;;;;;;;;;;;;;GAaG;AACH,MAAM,UAAU,gBAAgB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,KAAK,EACL,MAAM,EACN,SAAS,GACa;IACtB,MAAM,QAAQ,GAAG,SAAS,CAAC,SAAS,EAAE,CAAC,CAAA;IACvC,MAAM,OAAO,GAAG;QACd,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,IAAI,QAAQ,CAAC,MAAM,EAAE;QACxF,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,QAAQ,CAAC,WAAW,EAAE;QACtF,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,IAAI,QAAQ,CAAC,OAAO,EAAE;KAC9F,CAAA;IACD,OAAO,CACL,iCACkB,OAAO,EACvB,SAAS,EAAE,EAAE,CACX,4HAA4H,EAC5H,SAAS,CACV,YAEA,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAC9C,iBAEE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,gBACA,KAAK,EACjB,SAAS,EAAE,EAAE,CACX,0LAA0L,EAC1L,gBAAgB,CACjB,YAED,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,SAAG,IAVrB,GAAG,CAWD,CACV,CAAC,GACE,CACP,CAAA;AACH,CAAC"}

package/dist/ui/brand-gates.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=brand-gates.test.d.ts.map

package/dist/ui/brand-gates.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"brand-gates.test.d.ts","sourceRoot":"","sources":["../../src/ui/brand-gates.test.ts"],"names":[],"mappings":""}

package/dist/ui/brand-gates.test.js

@@ -0,0 +1,131 @@
+import { fileURLToPath } from "node:url";
+import { describe, expect, it } from "vitest";
+import { TOOLKIT_MESSAGES } from "@miragon/mcp-toolkit-ui";
+import { catalogTextFindings, glossaryFindings, PRODUCT_GLOSSARY, scanColors, scanGlyphs, scanIconSizes, scanTypeScale, } from "../testing/index.js";
+import { ASK_AI_PROMPT_LABELS } from "./ask-ai-prompt.js";
+import { DEFAULT_HEATMAP_LABELS } from "./bpmn-heatmap-labels.js";
+import { ERROR_KINDS } from "./describe-error.js";
+import { ERROR_LABELS } from "./error-labels.js";
+import { KIT_LABELS } from "./kit-labels.js";
+import { SETTINGS_LABELS } from "./settings-labels.js";
+import { SHELL_SETTINGS_CATALOGS } from "../shell-settings.js";
+/** Every source the words branch on, with a key for the rendered entry. */
+const ERROR_SOURCES = [
+    ["engineWithId", { type: "engine", id: "prod" }],
+    ["engine", { type: "engine" }],
+    ["prometheus", { type: "prometheus" }],
+    ["unknown", { type: "unknown" }],
+];
+/**
+ * describeError's words with EVERY branch rendered as plain text: each
+ * title for each source (with and without an engine id), each hint for each
+ * source type, and the toast's lines. The gates' own sample parameters (every
+ * property the number 1) would only ever take the fallback branch.
+ */
+function renderedErrorWords(labels) {
+    const status = labels.status({ status: 503 });
+    const words = { status };
+    for (const [key, source] of ERROR_SOURCES) {
+        const subject = labels.source({ source });
+        words[`source.${key}`] = subject;
+        for (const kind of ERROR_KINDS) {
+            words[`${kind}.title.${key}`] = labels[kind].title({ source: subject, status });
+            words[`${kind}.hint.${source.type}`] = labels[kind].hint({ source: source.type });
+        }
+    }
+    const title = labels.failed.title({
+        source: labels.source({ source: ERROR_SOURCES[0][1] }),
+        status,
+    });
+    words["toast.reason"] = labels.toast.reason({ title, reason: "Cannot resolve incident." });
+    words["toast.failedHint"] = labels.toast.failedHint();
+    words["toast.mayHaveApplied"] = labels.toast.mayHaveApplied();
+    return words;
+}
+const ERROR_WORDS = {
+    de: renderedErrorWords(ERROR_LABELS.de),
+    en: renderedErrorWords(ERROR_LABELS.en),
+};
+describe("the error words are rendered branch by branch", () => {
+    it.each(["de", "en"])("%s: the engine, Prometheus and fallback branches differ", (l) => {
+        const words = ERROR_WORDS[l];
+        const hints = ["engine", "prometheus", "unknown"].map((s) => words[`unreachable.hint.${s}`]);
+        expect(new Set(hints).size).toBe(3);
+        const subjects = ERROR_SOURCES.map(([key]) => words[`source.${key}`]);
+        expect(new Set(subjects).size).toBe(4);
+        expect(words["source.engineWithId"]).toContain("prod");
+    });
+});
+/**
+ * The kit's own copy and icons under the brand gates every widget package
+ * runs (`@miragon/pulse-widget-shell/testing`): the catalog text test over
+ * every string the kit renders or posts to the chat, and the glyph gate
+ * over the kit's widget code. brand-lint cannot see either (it reads
+ * Markdown, not strings in `.ts`/`.tsx`).
+ */
+describe("kit copy follows the voice rules", () => {
+    it.each([
+        ["kit labels (de)", KIT_LABELS.de, "de"],
+        ["kit labels (en)", KIT_LABELS.en, "en"],
+        // The view chrome every view shows is the toolkit's own catalog now.
+        ["view chrome (toolkit, de)", TOOLKIT_MESSAGES.de.view, "de"],
+        ["view chrome (toolkit, en)", TOOLKIT_MESSAGES.en.view, "en"],
+        ["hand-off fence (de)", ASK_AI_PROMPT_LABELS.de, "de"],
+        ["hand-off fence (en)", ASK_AI_PROMPT_LABELS.en, "en"],
+        ["heatmap defaults (en)", DEFAULT_HEATMAP_LABELS, "en"],
+        // describeError's words (U1): what happened, what you can do — every branch.
+        ["error words (de)", ERROR_WORDS.de, "de"],
+        ["error words (en)", ERROR_WORDS.en, "en"],
+        // The settings page and the shell's language section, and what the
+        // shell's settings tools tell the model.
+        ["settings page (de)", SETTINGS_LABELS.de, "de"],
+        ["settings page (en)", SETTINGS_LABELS.en, "en"],
+        ["settings summaries (de)", SHELL_SETTINGS_CATALOGS.de, "de"],
+        ["settings summaries (en)", SHELL_SETTINGS_CATALOGS.en, "en"],
+    ])("%s", (_, catalog, language) => {
+        expect(catalogTextFindings(catalog, { language })).toEqual([]);
+    });
+});
+const UI_DIR = fileURLToPath(new URL(".", import.meta.url));
+describe("kit widget code draws icons with Lucide, never glyphs or emoji", () => {
+    it("src/ui has no forbidden glyph in JSX or strings", () => {
+        expect(scanGlyphs(UI_DIR)).toEqual([]);
+    });
+});
+describe("kit widget code draws icons at the CI sizes", () => {
+    // 16 px in chrome (the Icon default, `dense` for tight rows), 24 px previews.
+    it("src/ui has no icon at a size other than 16 or 24 px", () => {
+        expect(scanIconSizes(UI_DIR)).toEqual([]);
+    });
+});
+describe("kit widget code sets text on the type scale", () => {
+    // CI §4 as the toolkit's TYPE_SCALE: title 28, section 21, body 16, dense
+    // 14 (tables, controls), small 13 — the floor. No Tailwind sizes.
+    it("src/ui has no text size off the five steps and nothing below 13 px", () => {
+        expect(scanTypeScale(UI_DIR)).toEqual([]);
+    });
+});
+describe("kit copy uses the product glossary", () => {
+    // The kit's labels sit in every module's views (hand-offs, list chrome).
+    it.each(["de", "en"])("kit labels (%s)", (language) => {
+        expect(glossaryFindings(KIT_LABELS[language], PRODUCT_GLOSSARY[language])).toEqual([]);
+    });
+    it.each(["de", "en"])("error words (%s)", (language) => {
+        expect(glossaryFindings(ERROR_WORDS[language], PRODUCT_GLOSSARY[language])).toEqual([]);
+    });
+    it.each(["de", "en"])("settings page (%s)", (language) => {
+        expect(glossaryFindings(SETTINGS_LABELS[language], PRODUCT_GLOSSARY[language])).toEqual([]);
+    });
+});
+describe("kit widget code colours through role names only", () => {
+    it("src/ui has no palette class or raw colour outside the reasoned allowances", () => {
+        // Shrink-only: a file that loses its raw colours fails here until its
+        // entry is deleted.
+        expect(scanColors(UI_DIR, {
+            allow: {
+                "komet-svg.ts": "the CI's Komet icon, vendored byte for byte (modeler-tool-design §11), sha-pinned in brand-mark.test.tsx",
+            },
+        })).toEqual([]);
+    });
+});
+//# sourceMappingURL=brand-gates.test.js.map

package/dist/ui/brand-gates.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"brand-gates.test.js","sourceRoot":"","sources":["../../src/ui/brand-gates.test.ts"],"names":[],"mappings":"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"}

package/dist/ui/brand-mark.d.ts

@@ -0,0 +1,37 @@
+import type { ReactNode } from "react";
+import { type StateHeadingLevel } from "@miragon/mcp-toolkit-ui";
+/** The Komet never renders smaller than this (CI: legible as the Miragon icon). */
+export declare const KOMET_MIN_SIZE = 24;
+/**
+ * The Miragon signature for APP-LEVEL surfaces only — the landing, the first
+ * start, "no engines" (owner decision; never in every widget): the official
+ * Komet icon, inlined unchanged ({@link KOMET_SVG}), at `size` px (at least
+ * {@link KOMET_MIN_SIZE}).
+ *
+ * A theme slot hides it: a customer brand sets
+ * `--brand-mark-display: none` in its stylesheet (`brand.css`) and every
+ * Miragon mark disappears, without a code change. Decorative by default
+ * (the words next to it carry the meaning); pass `label` for a mark that
+ * stands alone.
+ */
+export declare function KometMark({ size, label, className, }: {
+    size?: number;
+    label?: string;
+    className?: string;
+}): import("react").JSX.Element;
+/**
+ * The empty state of an APP-LEVEL surface (CI §8 "Empty State / Landing"):
+ * the Komet over a 600 title, one help line and up to two actions — the
+ * primary one a blue `Button`. Widgets use `TableEmptyState` instead; the
+ * Komet belongs to the app, not to every list.
+ */
+export declare function AppEmptyState({ title, description, action, secondaryAction, titleAs, className, }: {
+    title: ReactNode;
+    description?: ReactNode;
+    action?: ReactNode;
+    secondaryAction?: ReactNode;
+    /** Default `"h2"`: it is the surface's heading. */
+    titleAs?: StateHeadingLevel;
+    className?: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=brand-mark.d.ts.map

package/dist/ui/brand-mark.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"brand-mark.d.ts","sourceRoot":"","sources":["../../src/ui/brand-mark.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,EAAkB,KAAK,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AAGhF,mFAAmF;AACnF,eAAO,MAAM,cAAc,KAAK,CAAA;AAEhC;;;;;;;;;;;GAWG;AACH,wBAAgB,SAAS,CAAC,EACxB,IAAS,EACT,KAAK,EACL,SAAS,GACV,EAAE;IACD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,+BAcA;AAED;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,WAAW,EACX,MAAM,EACN,eAAe,EACf,OAAc,EACd,SAAS,GACV,EAAE;IACD,KAAK,EAAE,SAAS,CAAA;IAChB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,eAAe,CAAC,EAAE,SAAS,CAAA;IAC3B,mDAAmD;IACnD,OAAO,CAAC,EAAE,iBAAiB,CAAA;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,+BAYA"}

package/dist/ui/brand-mark.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn, EmptyState } from "@miragon/mcp-toolkit-ui";
+import { KOMET_SVG } from "./komet-svg.js";
+/** The Komet never renders smaller than this (CI: legible as the Miragon icon). */
+export const KOMET_MIN_SIZE = 24;
+/**
+ * The Miragon signature for APP-LEVEL surfaces only — the landing, the first
+ * start, "no engines" (owner decision; never in every widget): the official
+ * Komet icon, inlined unchanged ({@link KOMET_SVG}), at `size` px (at least
+ * {@link KOMET_MIN_SIZE}).
+ *
+ * A theme slot hides it: a customer brand sets
+ * `--brand-mark-display: none` in its stylesheet (`brand.css`) and every
+ * Miragon mark disappears, without a code change. Decorative by default
+ * (the words next to it carry the meaning); pass `label` for a mark that
+ * stands alone.
+ */
+export function KometMark({ size = 48, label, className, }) {
+    const px = Math.max(KOMET_MIN_SIZE, size);
+    return (_jsx("span", { "data-brand-mark": "komet", role: label ? "img" : undefined, "aria-label": label, "aria-hidden": label ? undefined : true, className: cn("shrink-0 items-center justify-center [&>svg]:size-full!", className), style: { display: "var(--brand-mark-display, inline-flex)", width: px, height: px }, 
+        // The CI's file, byte for byte — no JSX re-drawing of the mark.
+        dangerouslySetInnerHTML: { __html: KOMET_SVG } }));
+}
+/**
+ * The empty state of an APP-LEVEL surface (CI §8 "Empty State / Landing"):
+ * the Komet over a 600 title, one help line and up to two actions — the
+ * primary one a blue `Button`. Widgets use `TableEmptyState` instead; the
+ * Komet belongs to the app, not to every list.
+ */
+export function AppEmptyState({ title, description, action, secondaryAction, titleAs = "h2", className, }) {
+    return (_jsx(EmptyState, { icon: _jsx(KometMark, {}), title: title, description: description, action: action, secondaryAction: secondaryAction, titleAs: titleAs, className: cn("py-12", className) }));
+}
+//# sourceMappingURL=brand-mark.js.map

package/dist/ui/brand-mark.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"brand-mark.js","sourceRoot":"","sources":["../../src/ui/brand-mark.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,UAAU,EAA0B,MAAM,yBAAyB,CAAA;AAChF,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAE1C,mFAAmF;AACnF,MAAM,CAAC,MAAM,cAAc,GAAG,EAAE,CAAA;AAEhC;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,SAAS,CAAC,EACxB,IAAI,GAAG,EAAE,EACT,KAAK,EACL,SAAS,GAKV;IACC,MAAM,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC,cAAc,EAAE,IAAI,CAAC,CAAA;IACzC,OAAO,CACL,kCACkB,OAAO,EACvB,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,gBACnB,KAAK,iBACJ,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,EACrC,SAAS,EAAE,EAAE,CAAC,yDAAyD,EAAE,SAAS,CAAC,EACnF,KAAK,EAAE,EAAE,OAAO,EAAE,wCAAwC,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE;QACnF,gEAAgE;QAChE,uBAAuB,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,GAC9C,CACH,CAAA;AACH,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,aAAa,CAAC,EAC5B,KAAK,EACL,WAAW,EACX,MAAM,EACN,eAAe,EACf,OAAO,GAAG,IAAI,EACd,SAAS,GASV;IACC,OAAO,CACL,KAAC,UAAU,IACT,IAAI,EAAE,KAAC,SAAS,KAAG,EACnB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,MAAM,EAAE,MAAM,EACd,eAAe,EAAE,eAAe,EAChC,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,EAAE,CAAC,OAAO,EAAE,SAAS,CAAC,GACjC,CACH,CAAA;AACH,CAAC"}

package/dist/ui/brand-mark.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=brand-mark.test.d.ts.map

package/dist/ui/brand-mark.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"brand-mark.test.d.ts","sourceRoot":"","sources":["../../src/ui/brand-mark.test.tsx"],"names":[],"mappings":""}