@pihanga2/shadcn 0.2.21 → 0.2.23

package/cards/swimlane/swimlane.component.js

@@ -0,0 +1,520 @@
+import "./swimlane.types.js";
+import { describeSwimlaneTarget as e, formatTs as t, projectPending as n, relatedCallIds as r, rowTouches as i } from "./swimlane.model.js";
+import './swimlane.css';/* empty css         */
+import { memo as a, useEffect as o, useId as s, useLayoutEffect as c, useMemo as l, useRef as u, useState as d } from "react";
+import f from "clsx";
+import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
+//#region src/cards/swimlane/swimlane.component.tsx
+var g = (e, t) => e.gutter + t * e.laneW + e.laneW / 2;
+function _(e, t, n, r, i, a, o, s = null) {
+	n.forEach((n, c) => {
+		let l = g(t, c);
+		[[
+			r,
+			0,
+			t.mid
+		], [
+			i,
+			t.mid,
+			t.rowH
+		]].forEach(([t, o, c], u) => {
+			let d = t[n];
+			d && (e.visuals.push(/* @__PURE__ */ m("line", {
+				className: `swl-ll swl-ll-${d.state}`,
+				x1: l,
+				x2: l,
+				y1: o,
+				y2: c
+			}, `ll-${n}-${u}`)), d.acts.forEach((t, d) => {
+				let p = l - 5 + d * 5, g = u === 1 && !r[n]?.acts.includes(t), _ = u === 0 && !i[n]?.acts.includes(t), v = `M${p},${o} V${c} M${p + 10},${o} V${c}` + (g ? ` M${p},${o} H${p + 10}` : "") + (_ ? ` M${p},${c} H${p + 10}` : "");
+				e.visuals.push(/* @__PURE__ */ h("g", {
+					className: f("swl-act", a === t ? "swl-hl" : s === t && "swl-hl-proc"),
+					children: [/* @__PURE__ */ m("rect", {
+						x: p,
+						y: o,
+						width: 10,
+						height: c - o
+					}), /* @__PURE__ */ m("path", { d: v })]
+				}, `a-${t}-${u}`)), e.hits.push(/* @__PURE__ */ m("rect", {
+					className: "swl-hit",
+					x: p - 8,
+					y: o,
+					width: 26,
+					height: c - o,
+					"data-kind": "activity",
+					"data-id": t,
+					"data-lane": n
+				}, `ha-${t}-${u}`));
+			}));
+		}), !r[n] && i[n] && e.visuals.push(/* @__PURE__ */ m("rect", {
+			className: "swl-lane-head",
+			x: l - 16,
+			y: t.mid - 5,
+			width: 32,
+			height: 10,
+			rx: 2
+		}, `h-${n}`), /* @__PURE__ */ h("text", {
+			className: "swl-lbl-muted",
+			x: l + 20,
+			y: t.mid + 3,
+			children: [
+				"+ ",
+				o[n] ?? n,
+				" joined"
+			]
+		}, `ht-${n}`));
+	});
+}
+function v(e, t, n, r) {
+	let i = n(r.from), a = n(r.to);
+	if (i < 0 || a < 0) return;
+	let o = g(t, i), s = g(t, a), c = f("swl-ar", r.cls, r.hl ? "swl-hl" : r.rel && "swl-hl-rel"), l = `url(#${t.mk}-${r.marker})`, u = {
+		"data-kind": r.kind,
+		"data-id": r.hitId,
+		"data-row": r.rowId
+	};
+	if (r.from === r.to) {
+		let n = `M${o + 6},${t.mid - 9} h26 v16 h-20`;
+		e.visuals.push(/* @__PURE__ */ m("path", {
+			className: c,
+			d: n,
+			markerEnd: l
+		}, "ar"), /* @__PURE__ */ m("text", {
+			className: "swl-lbl",
+			x: o + 38,
+			y: t.mid + 3,
+			children: r.label
+		}, "lb")), e.hits.push(/* @__PURE__ */ m("path", {
+			className: "swl-hit",
+			d: n,
+			strokeWidth: 14,
+			pointerEvents: "stroke",
+			...u
+		}, "hit"));
+		return;
+	}
+	let d = Math.sign(s - o), p = o + d * 6, h = s - d * 6;
+	e.visuals.push(/* @__PURE__ */ m("line", {
+		className: c,
+		x1: p,
+		x2: h,
+		y1: t.mid,
+		y2: t.mid,
+		markerEnd: l
+	}, "ar"), /* @__PURE__ */ m("text", {
+		className: "swl-lbl",
+		x: Math.min(p, h) + 8,
+		y: t.mid - 5,
+		children: r.label
+	}, "lb")), e.hits.push(/* @__PURE__ */ m("line", {
+		className: "swl-hit",
+		x1: p,
+		x2: h,
+		y1: t.mid,
+		y2: t.mid,
+		strokeWidth: 16,
+		pointerEvents: "stroke",
+		...u
+	}, "hit"));
+}
+var y = {
+	sync: ["swl-ar-sync", "sync"],
+	async: ["swl-ar-async", "async"],
+	event: ["swl-ar-event", "event"]
+}, b = a(function({ row: e, g: n, laneOrder: r, laneLabels: i, width: a, hl: o, rel: s, proc: c }) {
+	let l = {
+		visuals: [],
+		hits: []
+	}, u = (e) => r.indexOf(e);
+	_(l, n, r, e.pre, e.post, o, i, c);
+	let d = e.event;
+	switch (d.type) {
+		case "call": {
+			let [t, r] = y[d.kind];
+			v(l, n, u, {
+				from: d.from,
+				to: d.to,
+				cls: t,
+				marker: r,
+				label: d.label,
+				hitId: d.id,
+				kind: "transition",
+				rowId: e.id,
+				hl: o === d.id,
+				rel: s
+			});
+			break;
+		}
+		case "reply":
+			e.route && v(l, n, u, {
+				from: e.route.to,
+				to: e.route.from,
+				cls: d.ok ? "swl-ar-reply" : "swl-ar-error",
+				marker: d.ok ? "reply" : "error",
+				label: d.label,
+				hitId: d.id,
+				kind: "transition",
+				rowId: e.id,
+				hl: o === d.id,
+				rel: s
+			});
+			break;
+		case "done":
+			e.route && l.visuals.push(/* @__PURE__ */ h("text", {
+				className: "swl-lbl-muted",
+				x: g(n, u(e.route.to)) + 14,
+				y: n.mid + 3,
+				children: ["✓ processed ", e.route.label]
+			}, "dn"));
+			break;
+		case "state": {
+			let t = g(n, u(d.lane));
+			l.visuals.push(/* @__PURE__ */ m("circle", {
+				cx: t,
+				cy: n.mid,
+				r: 5,
+				className: `swl-dot-${d.state}`
+			}, "st"), /* @__PURE__ */ h("text", {
+				className: "swl-lbl-muted",
+				x: t + 10,
+				y: n.mid + 3,
+				children: ["→ ", d.state]
+			}, "stl")), l.hits.push(/* @__PURE__ */ m("circle", {
+				className: "swl-hit",
+				cx: t,
+				cy: n.mid,
+				r: 12,
+				"data-kind": "state",
+				"data-id": `state-${e.id}`,
+				"data-lane": d.lane,
+				"data-row": e.id
+			}, "sth"));
+			break;
+		}
+	}
+	return /* @__PURE__ */ h("svg", {
+		className: f("swl-row", e.fulfilled && "swl-arrived"),
+		width: a,
+		height: n.rowH,
+		"data-row": e.id,
+		children: [
+			/* @__PURE__ */ m("text", {
+				className: "swl-ts",
+				x: 0,
+				y: n.mid + 3,
+				children: t(d.ts)
+			}),
+			e.fulfilled && /* @__PURE__ */ h("text", {
+				className: "swl-ok",
+				x: n.gutter - 16,
+				y: n.mid + 4,
+				children: [/* @__PURE__ */ m("title", { children: "replaced an outstanding message" }), "✓"]
+			}),
+			l.visuals,
+			l.hits
+		]
+	});
+}), x = a(function({ row: e, g: t, laneOrder: n, laneLabels: r, width: i, hl: a, rel: o, proc: s, now: c }) {
+	let l = {
+		visuals: [],
+		hits: []
+	}, u = e.pending, d = c - u.since, p = u.timeoutMs != null && d > u.timeoutMs;
+	return _(l, t, n, e.pre, e.post, a, r, s), v(l, t, (e) => n.indexOf(e), {
+		from: u.from,
+		to: u.to,
+		cls: f("swl-ar-ghost", p && "swl-overdue"),
+		marker: "ghost",
+		label: `⌛ ${u.label}`,
+		hitId: u.id,
+		kind: "pending",
+		hl: a === u.id,
+		rel: o
+	}), /* @__PURE__ */ h("svg", {
+		className: "swl-row swl-ghost",
+		width: i,
+		height: t.rowH,
+		children: [
+			/* @__PURE__ */ h("text", {
+				className: f("swl-ts", p && "swl-overdue"),
+				x: 0,
+				y: t.mid + 3,
+				children: [
+					"waiting ",
+					(d / 1e3).toFixed(1),
+					"s"
+				]
+			}),
+			l.visuals,
+			l.hits
+		]
+	});
+}), S = a(function({ snap: e, count: t, g: n, laneOrder: r, laneLabels: i, width: a, proc: o }) {
+	let s = {
+		visuals: [],
+		hits: []
+	};
+	return _(s, n, r, e, e, null, i, o), /* @__PURE__ */ h("svg", {
+		className: "swl-row swl-now",
+		width: a,
+		height: n.rowH,
+		children: [
+			/* @__PURE__ */ m("text", {
+				className: "swl-now-lbl",
+				x: 0,
+				y: n.mid + 3,
+				children: "now"
+			}),
+			s.visuals,
+			/* @__PURE__ */ m("line", {
+				className: "swl-now-line",
+				x1: n.gutter - 6,
+				x2: a - 10,
+				y1: n.mid,
+				y2: n.mid
+			}),
+			/* @__PURE__ */ h("text", {
+				className: "swl-now-lbl",
+				x: a - 136,
+				y: n.mid - 4,
+				children: [
+					"▼ ",
+					t,
+					" outstanding"
+				]
+			})
+		]
+	});
+});
+function C(e) {
+	let { model: t, hid: r, related: a, procId: s, clock: c, ...u } = e, [f, g] = d(() => Date.now()), _ = c ?? f, v = t.pending.length > 0;
+	o(() => {
+		if (!v || c != null) return;
+		let e = setInterval(() => g(Date.now()), 250);
+		return () => clearInterval(e);
+	}, [v, c]);
+	let { current: y, pending: b } = t, C = l(() => n(y, b), [y, b]);
+	return /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(S, {
+		snap: t.current,
+		count: t.pending.length,
+		proc: s && i({
+			pre: t.current,
+			post: t.current
+		}, void 0, s) ? s : null,
+		...u
+	}), C.map((e) => /* @__PURE__ */ m(x, {
+		row: e,
+		now: _,
+		hl: r && i(e, e.pending.id, r) ? r : null,
+		rel: a.has(e.pending.id),
+		proc: s && i(e, void 0, s) ? s : null,
+		...u
+	}, e.id))] });
+}
+function w({ model: e, g: t, headH: n, width: r }) {
+	return /* @__PURE__ */ m("svg", {
+		width: r,
+		height: n,
+		children: e.laneOrder.map((r, i) => {
+			let a = g(t, i), o = e.current[r], s = n - 24;
+			return /* @__PURE__ */ h("g", { children: [
+				/* @__PURE__ */ m("text", {
+					className: "swl-lane-name",
+					x: a + 4,
+					y: s,
+					transform: `rotate(-90 ${a + 4} ${s})`,
+					children: e.laneLabels[r] ?? r
+				}),
+				/* @__PURE__ */ m("circle", {
+					cx: a,
+					cy: n - 12,
+					r: 5,
+					className: `swl-dot-${o?.state}`,
+					children: /* @__PURE__ */ m("title", { children: o?.state })
+				}),
+				o && o.acts.length > 0 && /* @__PURE__ */ m("text", {
+					className: "swl-lbl-muted",
+					x: a + 9,
+					y: n - 8,
+					children: o.acts.length
+				})
+			] }, r);
+		})
+	});
+}
+function T({ mk: e }) {
+	let t = (t, n, r) => /* @__PURE__ */ m("marker", {
+		id: `${e}-${t}`,
+		viewBox: "0 0 10 10",
+		refX: 9,
+		refY: 5,
+		markerWidth: 9,
+		markerHeight: 9,
+		markerUnits: "userSpaceOnUse",
+		orient: "auto-start-reverse",
+		children: r ? /* @__PURE__ */ m("path", {
+			d: "M1,1 L9,5 L1,9",
+			className: n
+		}) : /* @__PURE__ */ m("path", {
+			d: "M0,0 L10,5 L0,10 z",
+			className: n
+		})
+	});
+	return /* @__PURE__ */ m("svg", {
+		width: 0,
+		height: 0,
+		style: { position: "absolute" },
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ h("defs", { children: [
+			t("sync", "swl-mk-sync", !1),
+			t("async", "swl-mk-async", !0),
+			t("event", "swl-mk-event", !0),
+			t("reply", "swl-mk-reply", !0),
+			t("error", "swl-mk-error", !1),
+			t("ghost", "swl-mk-ghost", !0)
+		] })
+	});
+}
+function E(e, t) {
+	return t.kind !== "transition" && t.kind !== "pending" ? null : e.spans[t.id]?.parent ?? null;
+}
+function D(e) {
+	for (let t = e?.parentElement; t; t = t.parentElement) {
+		let e = getComputedStyle(t).overflowY;
+		if (e === "auto" || e === "scroll") return t;
+	}
+	return null;
+}
+var O = (t) => {
+	let { cardName: n, model: a, showPending: p = !0, autoFollow: g = !0, showTooltip: _ = !0, highlightId: v, laneWidth: y = 104, rowHeight: x = 30, headerHeight: S = 130, gutterWidth: O = 92, stickyTop: k = 0, now: A, className: j, onHoverChanged: M, onItemClicked: ee } = t, N = "swl" + s().replace(/[^a-zA-Z0-9_-]/g, ""), P = l(() => ({
+		laneW: y,
+		rowH: x,
+		gutter: O,
+		mid: x / 2,
+		mk: N
+	}), [
+		y,
+		x,
+		O,
+		N
+	]), F = O + a.laneOrder.length * y + 140, I = {
+		g: P,
+		laneOrder: a.laneOrder,
+		laneLabels: a.laneLabels,
+		width: F
+	}, L = u(null), R = u(null), z = u(a);
+	z.current = a;
+	let [B, V] = d(null), H = u(null), U = (e) => {
+		let t = e?.closest?.(".swl-hit");
+		if (!t) return null;
+		let n = t.dataset;
+		return {
+			kind: n.kind,
+			id: n.id,
+			lane: n.lane,
+			rowId: n.row == null ? void 0 : Number(n.row)
+		};
+	}, W = (e, t) => e === t || !!e && !!t && e.kind === t.kind && e.id === t.id, G = (e) => {
+		let t = z.current, n = e.kind === "state" ? void 0 : r(t, e.id), i = E(t, e) ?? void 0;
+		return e.kind === "pending" ? {
+			pending: t.pending.find((t) => t.id === e.id),
+			span: t.spans[e.id],
+			related: n,
+			process: i
+		} : {
+			span: t.spans[e.id],
+			related: n,
+			process: i
+		};
+	}, K = (e, t) => {
+		let n = R.current;
+		n && (n.style.left = `${e + 14}px`, n.style.top = `${t + 14}px`);
+	}, q = (t, n) => {
+		let r = H.current;
+		if (W(r, t)) return;
+		H.current = t, V(t);
+		let i = R.current;
+		i && (t && _ ? (i.textContent = e(z.current, t, A ?? Date.now()), i.style.display = "block", K(n.clientX, n.clientY)) : i.style.display = "none"), M({
+			target: t,
+			previous: r,
+			...t ? G(t) : {},
+			clientX: n.clientX,
+			clientY: n.clientY
+		});
+	}, J = (e) => {
+		let t = U(e.target);
+		t && q(t, e);
+	}, te = (e) => {
+		let t = U(e.relatedTarget);
+		(!t || !W(t, H.current)) && q(t, e);
+	}, ne = (e) => {
+		H.current && _ && K(e.clientX, e.clientY);
+	}, re = (e) => {
+		let t = U(e.target);
+		t && ee({
+			target: t,
+			...G(t)
+		});
+	}, Y = B && B.kind !== "state" ? B.id : v ?? null, { spans: X } = a, Z = l(() => new Set(Y ? r({ spans: X }, Y) : []), [Y, X]), Q = B ? E(a, B) : null, $ = u(!0);
+	return o(() => {
+		if (!g) return;
+		let e = D(L.current), t = e ?? window, n = () => {
+			$.current = e ? e.scrollTop + e.clientHeight >= e.scrollHeight - 40 : window.innerHeight + window.scrollY >= document.documentElement.scrollHeight - 40;
+		};
+		return t.addEventListener("scroll", n, { passive: !0 }), () => t.removeEventListener("scroll", n);
+	}, [g]), c(() => {
+		if (!g || !$.current) return;
+		let e = D(L.current);
+		e ? e.scrollTop = e.scrollHeight : window.scrollTo(0, document.documentElement.scrollHeight);
+	}, [
+		g,
+		a.rows.length,
+		a.pending.length
+	]), /* @__PURE__ */ h("div", {
+		ref: L,
+		className: f("pihanga-swimlane", j),
+		"data-pihanga": n,
+		children: [
+			/* @__PURE__ */ m(T, { mk: N }),
+			/* @__PURE__ */ m("div", {
+				className: "swl-header",
+				style: { top: k },
+				children: /* @__PURE__ */ m(w, {
+					model: a,
+					g: P,
+					headH: S,
+					width: F
+				})
+			}),
+			/* @__PURE__ */ h("div", {
+				className: "swl-rows",
+				onPointerOver: J,
+				onPointerOut: te,
+				onPointerMove: ne,
+				onClick: re,
+				children: [a.rows.map((e) => /* @__PURE__ */ m(b, {
+					row: e,
+					hl: Y && i(e, "id" in e.event ? e.event.id : void 0, Y) ? Y : null,
+					rel: "id" in e.event && e.event.type !== "done" && Z.has(e.event.id),
+					proc: Q && i(e, void 0, Q) ? Q : null,
+					...I
+				}, e.id)), p && /* @__PURE__ */ m(C, {
+					model: a,
+					hid: Y,
+					related: Z,
+					procId: Q,
+					clock: A,
+					...I
+				})]
+			}),
+			/* @__PURE__ */ m("div", {
+				ref: R,
+				className: "swl-tooltip",
+				role: "tooltip"
+			})
+		]
+	});
+};
+//#endregion
+export { O as SwimlaneComponent };
+
+//# sourceMappingURL=swimlane.component.js.map

package/cards/swimlane/swimlane.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"swimlane.component.js","names":[],"sources":["../../../src/cards/swimlane/swimlane.component.tsx"],"sourcesContent":["import React, {memo, useEffect, useId, useLayoutEffect, useMemo, useRef, useState} from \"react\";\nimport type {PiCardProps} from \"@pihanga2/core\";\nimport clsx from \"clsx\";\n\nimport {\n  DEF_GUTTER_WIDTH,\n  DEF_HEADER_HEIGHT,\n  DEF_LANE_WIDTH,\n  DEF_ROW_HEIGHT,\n  type SwimlaneEvents,\n  type SwimlaneGhostRow,\n  type SwimlaneLanesSnapshot,\n  type SwimlaneModel,\n  type SwimlaneProps,\n  type SwimlaneRow,\n  type SwimlaneTarget,\n  type SwimlaneTargetKind,\n} from \"./swimlane.types\";\nimport {describeSwimlaneTarget, formatTs, projectPending, relatedCallIds, rowTouches} from \"./swimlane.model\";\n\nimport \"./swimlane.css\";\n\n/**\n * Real-time swimlane (sequence) diagram.\n *\n * Every transition is its own small, fixed-height SVG in normal document flow,\n * so the page (or nearest scroll container) scrolls — the SVGs never do.\n * Each row draws its top half from the `pre` lane snapshot and its bottom half\n * from `post`, which lets lifelines start, activities open/close and run\n * states change in the middle of a row.\n *\n * Hover/click use one delegated listener on the rows container; hit zones are\n * wide transparent shapes carrying `data-*` attributes.\n */\n\ntype Geo = {laneW: number; rowH: number; gutter: number; mid: number; mk: string};\n\nconst laneX = (g: Geo, i: number) => g.gutter + i * g.laneW + g.laneW / 2;\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Drawing helpers\n// ─────────────────────────────────────────────────────────────────────────────\n\ntype Parts = {visuals: React.ReactNode[]; hits: React.ReactNode[]};\n\nfunction drawLanes(\n  p: Parts,\n  g: Geo,\n  laneOrder: string[],\n  pre: SwimlaneLanesSnapshot,\n  post: SwimlaneLanesSnapshot,\n  hl: string | null,\n  laneLabels: Record<string, string>,\n  /** Activity of the process that sends/receives the hovered transition. */\n  proc: string | null = null,\n) {\n  laneOrder.forEach((l, i) => {\n    const x = laneX(g, i);\n    const halves: [SwimlaneLanesSnapshot, number, number][] = [\n      [pre, 0, g.mid],\n      [post, g.mid, g.rowH],\n    ];\n    halves.forEach(([snap, y1, y2], half) => {\n      const s = snap[l];\n      if (!s) return;\n      p.visuals.push(\n        <line key={`ll-${l}-${half}`} className={`swl-ll swl-ll-${s.state}`} x1={x} x2={x} y1={y1} y2={y2} />,\n      );\n      s.acts.forEach((a, k) => {\n        const ax = x - 5 + k * 5;\n        // fill + side borders only, so stacked half-row segments read as one\n        // bar; caps only where the activity starts / ends inside this row\n        const starts = half === 1 && !pre[l]?.acts.includes(a);\n        const ends = half === 0 && !post[l]?.acts.includes(a);\n        const d =\n          `M${ax},${y1} V${y2} M${ax + 10},${y1} V${y2}` +\n          (starts ? ` M${ax},${y1} H${ax + 10}` : \"\") +\n          (ends ? ` M${ax},${y2} H${ax + 10}` : \"\");\n        p.visuals.push(\n          <g key={`a-${a}-${half}`} className={clsx(\"swl-act\", hl === a ? \"swl-hl\" : proc === a && \"swl-hl-proc\")}>\n            <rect x={ax} y={y1} width={10} height={y2 - y1} />\n            <path d={d} />\n          </g>,\n        );\n        p.hits.push(\n          <rect\n            key={`ha-${a}-${half}`}\n            className=\"swl-hit\"\n            x={ax - 8}\n            y={y1}\n            width={26}\n            height={y2 - y1}\n            data-kind=\"activity\"\n            data-id={a}\n            data-lane={l}\n          />,\n        );\n      });\n    });\n    if (!pre[l] && post[l]) {\n      p.visuals.push(\n        <rect key={`h-${l}`} className=\"swl-lane-head\" x={x - 16} y={g.mid - 5} width={32} height={10} rx={2} />,\n        <text key={`ht-${l}`} className=\"swl-lbl-muted\" x={x + 20} y={g.mid + 3}>\n          + {laneLabels[l] ?? l} joined\n        </text>,\n      );\n    }\n  });\n}\n\nfunction drawArrow(\n  p: Parts,\n  g: Geo,\n  idx: (l: string) => number,\n  a: {\n    from: string;\n    to: string;\n    cls: string;\n    marker: string;\n    label: string;\n    hitId: string;\n    kind: SwimlaneTargetKind;\n    rowId?: number;\n    hl: boolean;\n    /** Secondary highlight: a transition created/received by the hovered process. */\n    rel?: boolean;\n  },\n) {\n  const i1 = idx(a.from);\n  const i2 = idx(a.to);\n  if (i1 < 0 || i2 < 0) return;\n  const x1 = laneX(g, i1);\n  const x2 = laneX(g, i2);\n  const cls = clsx(\"swl-ar\", a.cls, a.hl ? \"swl-hl\" : a.rel && \"swl-hl-rel\");\n  const markerEnd = `url(#${g.mk}-${a.marker})`;\n  const hitData = {\"data-kind\": a.kind, \"data-id\": a.hitId, \"data-row\": a.rowId};\n  if (a.from === a.to) {\n    const d = `M${x1 + 6},${g.mid - 9} h26 v16 h-20`;\n    p.visuals.push(\n      <path key=\"ar\" className={cls} d={d} markerEnd={markerEnd} />,\n      <text key=\"lb\" className=\"swl-lbl\" x={x1 + 38} y={g.mid + 3}>\n        {a.label}\n      </text>,\n    );\n    p.hits.push(<path key=\"hit\" className=\"swl-hit\" d={d} strokeWidth={14} pointerEvents=\"stroke\" {...hitData} />);\n    return;\n  }\n  const dir = Math.sign(x2 - x1);\n  const sx = x1 + dir * 6;\n  const ex = x2 - dir * 6;\n  p.visuals.push(\n    <line key=\"ar\" className={cls} x1={sx} x2={ex} y1={g.mid} y2={g.mid} markerEnd={markerEnd} />,\n    <text key=\"lb\" className=\"swl-lbl\" x={Math.min(sx, ex) + 8} y={g.mid - 5}>\n      {a.label}\n    </text>,\n  );\n  // broad hit zone: a 16px thick invisible band over the thin line\n  p.hits.push(\n    <line\n      key=\"hit\"\n      className=\"swl-hit\"\n      x1={sx}\n      x2={ex}\n      y1={g.mid}\n      y2={g.mid}\n      strokeWidth={16}\n      pointerEvents=\"stroke\"\n      {...hitData}\n    />,\n  );\n}\n\nconst CALL_STYLE = {\n  sync: [\"swl-ar-sync\", \"sync\"],\n  async: [\"swl-ar-async\", \"async\"],\n  event: [\"swl-ar-event\", \"event\"],\n} as const;\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Rows\n// ─────────────────────────────────────────────────────────────────────────────\n\ntype RowCommon = {\n  g: Geo;\n  laneOrder: string[];\n  laneLabels: Record<string, string>;\n  width: number;\n  hl: string | null;\n  /** True when this row's transition belongs to a child of the highlighted call. */\n  rel?: boolean;\n  /** Call id of the process (activity) that sends/receives the hovered transition. */\n  proc?: string | null;\n};\n\nconst RealRow = memo(function RealRow({row, g, laneOrder, laneLabels, width, hl, rel, proc}: RowCommon & {row: SwimlaneRow}) {\n  const p: Parts = {visuals: [], hits: []};\n  const idx = (l: string) => laneOrder.indexOf(l);\n  drawLanes(p, g, laneOrder, row.pre, row.post, hl, laneLabels, proc);\n  const ev = row.event;\n  switch (ev.type) {\n    case \"call\": {\n      const [cls, marker] = CALL_STYLE[ev.kind];\n      drawArrow(p, g, idx, {\n        from: ev.from, to: ev.to, cls, marker, label: ev.label,\n        hitId: ev.id, kind: \"transition\", rowId: row.id, hl: hl === ev.id, rel,\n      });\n      break;\n    }\n    case \"reply\":\n      if (row.route) {\n        drawArrow(p, g, idx, {\n          from: row.route.to, to: row.route.from,\n          cls: ev.ok ? \"swl-ar-reply\" : \"swl-ar-error\", marker: ev.ok ? \"reply\" : \"error\",\n          label: ev.label, hitId: ev.id, kind: \"transition\", rowId: row.id, hl: hl === ev.id, rel,\n        });\n      }\n      break;\n    case \"done\":\n      if (row.route) {\n        p.visuals.push(\n          <text key=\"dn\" className=\"swl-lbl-muted\" x={laneX(g, idx(row.route.to)) + 14} y={g.mid + 3}>\n            ✓ processed {row.route.label}\n          </text>,\n        );\n      }\n      break;\n    case \"state\": {\n      const x = laneX(g, idx(ev.lane));\n      p.visuals.push(\n        <circle key=\"st\" cx={x} cy={g.mid} r={5} className={`swl-dot-${ev.state}`} />,\n        <text key=\"stl\" className=\"swl-lbl-muted\" x={x + 10} y={g.mid + 3}>\n          → {ev.state}\n        </text>,\n      );\n      p.hits.push(\n        <circle\n          key=\"sth\"\n          className=\"swl-hit\"\n          cx={x}\n          cy={g.mid}\n          r={12}\n          data-kind=\"state\"\n          data-id={`state-${row.id}`}\n          data-lane={ev.lane}\n          data-row={row.id}\n        />,\n      );\n      break;\n    }\n  }\n  return (\n    <svg className={clsx(\"swl-row\", row.fulfilled && \"swl-arrived\")} width={width} height={g.rowH} data-row={row.id}>\n      <text className=\"swl-ts\" x={0} y={g.mid + 3}>\n        {formatTs(ev.ts)}\n      </text>\n      {row.fulfilled && (\n        <text className=\"swl-ok\" x={g.gutter - 16} y={g.mid + 4}>\n          <title>replaced an outstanding message</title>✓\n        </text>\n      )}\n      {p.visuals}\n      {p.hits}\n    </svg>\n  );\n});\n\nconst GhostRow = memo(function GhostRow({\n  row, g, laneOrder, laneLabels, width, hl, rel, proc, now,\n}: RowCommon & {row: SwimlaneGhostRow; now: number}) {\n  const p: Parts = {visuals: [], hits: []};\n  const pd = row.pending;\n  const waited = now - pd.since;\n  const overdue = pd.timeoutMs != null && waited > pd.timeoutMs;\n  drawLanes(p, g, laneOrder, row.pre, row.post, hl, laneLabels, proc);\n  drawArrow(p, g, (l) => laneOrder.indexOf(l), {\n    from: pd.from, to: pd.to, cls: clsx(\"swl-ar-ghost\", overdue && \"swl-overdue\"), marker: \"ghost\",\n    label: `⌛ ${pd.label}`, hitId: pd.id, kind: \"pending\", hl: hl === pd.id, rel,\n  });\n  return (\n    <svg className=\"swl-row swl-ghost\" width={width} height={g.rowH}>\n      <text className={clsx(\"swl-ts\", overdue && \"swl-overdue\")} x={0} y={g.mid + 3}>\n        waiting {(waited / 1000).toFixed(1)}s\n      </text>\n      {p.visuals}\n      {p.hits}\n    </svg>\n  );\n});\n\nconst NowRow = memo(function NowRow({\n  snap, count, g, laneOrder, laneLabels, width, proc,\n}: Omit<RowCommon, \"hl\" | \"rel\"> & {snap: SwimlaneLanesSnapshot; count: number}) {\n  const p: Parts = {visuals: [], hits: []};\n  drawLanes(p, g, laneOrder, snap, snap, null, laneLabels, proc);\n  return (\n    <svg className=\"swl-row swl-now\" width={width} height={g.rowH}>\n      <text className=\"swl-now-lbl\" x={0} y={g.mid + 3}>now</text>\n      {p.visuals}\n      <line className=\"swl-now-line\" x1={g.gutter - 6} x2={width - 10} y1={g.mid} y2={g.mid} />\n      <text className=\"swl-now-lbl\" x={width - 136} y={g.mid - 4}>▼ {count} outstanding</text>\n    </svg>\n  );\n});\n\nfunction PendingZone(\n  props: Omit<RowCommon, \"hl\" | \"rel\" | \"proc\"> & {\n    model: SwimlaneModel;\n    hid: string | null;\n    related: ReadonlySet<string>;\n    procId: string | null;\n    clock?: number;\n  },\n) {\n  const {model, hid, related, procId, clock, ...common} = props;\n  const [tick, setNow] = useState(() => Date.now());\n  const now = clock ?? tick;\n  const any = model.pending.length > 0;\n  useEffect(() => {\n    // only the ghost rows tick (for the \"waiting\" timer); a `now` prop disables the ticker\n    if (!any || clock != null) return;\n    const iv = setInterval(() => setNow(Date.now()), 250);\n    return () => clearInterval(iv);\n  }, [any, clock]);\n  const {current, pending} = model;\n  const ghosts = useMemo(() => projectPending(current, pending), [current, pending]);\n  return (\n    <>\n      <NowRow\n        snap={model.current}\n        count={model.pending.length}\n        proc={procId && rowTouches({pre: model.current, post: model.current}, undefined, procId) ? procId : null}\n        {...common}\n      />\n      {ghosts.map((gr) => (\n        <GhostRow\n          key={gr.id}\n          row={gr}\n          now={now}\n          hl={hid && rowTouches(gr, gr.pending.id, hid) ? hid : null}\n          rel={related.has(gr.pending.id)}\n          proc={procId && rowTouches(gr, undefined, procId) ? procId : null}\n          {...common}\n        />\n      ))}\n    </>\n  );\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Header\n// ─────────────────────────────────────────────────────────────────────────────\n\nfunction Header({model, g, headH, width}: {model: SwimlaneModel; g: Geo; headH: number; width: number}) {\n  return (\n    <svg width={width} height={headH}>\n      {model.laneOrder.map((l, i) => {\n        const x = laneX(g, i);\n        const s = model.current[l];\n        const y = headH - 24;\n        return (\n          <g key={l}>\n            <text className=\"swl-lane-name\" x={x + 4} y={y} transform={`rotate(-90 ${x + 4} ${y})`}>\n              {model.laneLabels[l] ?? l}\n            </text>\n            <circle cx={x} cy={headH - 12} r={5} className={`swl-dot-${s?.state}`}>\n              <title>{s?.state}</title>\n            </circle>\n            {s && s.acts.length > 0 && (\n              <text className=\"swl-lbl-muted\" x={x + 9} y={headH - 8}>\n                {s.acts.length}\n              </text>\n            )}\n          </g>\n        );\n      })}\n    </svg>\n  );\n}\n\nfunction Defs({mk}: {mk: string}) {\n  const m = (id: string, cls: string, open: boolean) => (\n    <marker\n      id={`${mk}-${id}`}\n      viewBox=\"0 0 10 10\"\n      refX={9}\n      refY={5}\n      markerWidth={9}\n      markerHeight={9}\n      markerUnits=\"userSpaceOnUse\"\n      orient=\"auto-start-reverse\"\n    >\n      {open ? <path d=\"M1,1 L9,5 L1,9\" className={cls} /> : <path d=\"M0,0 L10,5 L0,10 z\" className={cls} />}\n    </marker>\n  );\n  return (\n    <svg width={0} height={0} style={{position: \"absolute\"}} aria-hidden=\"true\">\n      <defs>\n        {m(\"sync\", \"swl-mk-sync\", false)}\n        {m(\"async\", \"swl-mk-async\", true)}\n        {m(\"event\", \"swl-mk-event\", true)}\n        {m(\"reply\", \"swl-mk-reply\", true)}\n        {m(\"error\", \"swl-mk-error\", false)}\n        {m(\"ghost\", \"swl-mk-ghost\", true)}\n      </defs>\n    </svg>\n  );\n}\n\n/**\n * For a hovered transition (call / reply arrow, or outstanding reply): the\n * call id of the caller-side activity that sent it / receives the reply.\n */\nfunction processOf(m: Pick<SwimlaneModel, \"spans\">, t: SwimlaneTarget): string | null {\n  if (t.kind !== \"transition\" && t.kind !== \"pending\") return null;\n  return m.spans[t.id]?.parent ?? null;\n}\n\nfunction scrollParent(el: HTMLElement | null): HTMLElement | null {\n  for (let e = el?.parentElement; e; e = e.parentElement) {\n    const oy = getComputedStyle(e).overflowY;\n    if (oy === \"auto\" || oy === \"scroll\") return e;\n  }\n  return null; // → window\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Card\n// ─────────────────────────────────────────────────────────────────────────────\n\nexport const SwimlaneComponent = (props: PiCardProps<SwimlaneProps, SwimlaneEvents>): React.ReactNode => {\n  const {\n    cardName,\n    model,\n    showPending = true,\n    autoFollow = true,\n    showTooltip = true,\n    highlightId,\n    laneWidth = DEF_LANE_WIDTH,\n    rowHeight = DEF_ROW_HEIGHT,\n    headerHeight = DEF_HEADER_HEIGHT,\n    gutterWidth = DEF_GUTTER_WIDTH,\n    stickyTop = 0,\n    now: clock,\n    className,\n    onHoverChanged,\n    onItemClicked,\n  } = props;\n\n  const mk = \"swl\" + useId().replace(/[^a-zA-Z0-9_-]/g, \"\");\n  const g = useMemo<Geo>(\n    () => ({laneW: laneWidth, rowH: rowHeight, gutter: gutterWidth, mid: rowHeight / 2, mk}),\n    [laneWidth, rowHeight, gutterWidth, mk],\n  );\n  const width = gutterWidth + model.laneOrder.length * laneWidth + 140; // + room for labels\n  const common = {g, laneOrder: model.laneOrder, laneLabels: model.laneLabels, width};\n\n  const rootRef = useRef<HTMLDivElement>(null);\n  const tipRef = useRef<HTMLDivElement>(null);\n  const modelRef = useRef(model);\n  modelRef.current = model;\n\n  // ── hover / click (event delegation) ─────────────────────────────────────\n  const [hovered, setHovered] = useState<SwimlaneTarget | null>(null);\n  const hoveredRef = useRef<SwimlaneTarget | null>(null);\n\n  const targetOf = (el: Element | null): SwimlaneTarget | null => {\n    const hit = (el as HTMLElement | null)?.closest?.(\".swl-hit\") as SVGElement | null;\n    if (!hit) return null;\n    const d = hit.dataset;\n    return {\n      kind: d.kind as SwimlaneTargetKind,\n      id: d.id!,\n      lane: d.lane,\n      rowId: d.row != null ? Number(d.row) : undefined,\n    };\n  };\n  const same = (a: SwimlaneTarget | null, b: SwimlaneTarget | null) =>\n    a === b || (!!a && !!b && a.kind === b.kind && a.id === b.id);\n\n  const details = (t: SwimlaneTarget) => {\n    const m = modelRef.current;\n    const related = t.kind === \"state\" ? undefined : relatedCallIds(m, t.id);\n    const process = processOf(m, t) ?? undefined;\n    return t.kind === \"pending\"\n      ? {pending: m.pending.find((p) => p.id === t.id), span: m.spans[t.id], related, process}\n      : {span: m.spans[t.id], related, process};\n  };\n\n  const placeTip = (x: number, y: number) => {\n    const tip = tipRef.current;\n    if (tip) {\n      tip.style.left = `${x + 14}px`;\n      tip.style.top = `${y + 14}px`;\n    }\n  };\n\n  const changeHover = (next: SwimlaneTarget | null, e: React.PointerEvent) => {\n    const prev = hoveredRef.current;\n    if (same(prev, next)) return; // e.g. same activity continuing in the next row\n    hoveredRef.current = next;\n    setHovered(next);\n    const tip = tipRef.current;\n    if (tip) {\n      if (next && showTooltip) {\n        tip.textContent = describeSwimlaneTarget(modelRef.current, next, clock ?? Date.now());\n        tip.style.display = \"block\";\n        placeTip(e.clientX, e.clientY);\n      } else {\n        tip.style.display = \"none\";\n      }\n    }\n    onHoverChanged({\n      target: next,\n      previous: prev,\n      ...(next ? details(next) : {}),\n      clientX: e.clientX,\n      clientY: e.clientY,\n    });\n  };\n\n  const onOver = (e: React.PointerEvent) => {\n    const t = targetOf(e.target as Element);\n    if (t) changeHover(t, e);\n  };\n  const onOut = (e: React.PointerEvent) => {\n    const t = targetOf(e.relatedTarget as Element | null);\n    if (!t || !same(t, hoveredRef.current)) changeHover(t, e);\n  };\n  const onMove = (e: React.PointerEvent) => {\n    if (hoveredRef.current && showTooltip) placeTip(e.clientX, e.clientY);\n  };\n  const onClick = (e: React.MouseEvent) => {\n    const t = targetOf(e.target as Element);\n    if (t) onItemClicked({target: t, ...details(t)});\n  };\n\n  // ── highlighting: only rows touching the chain get a new `hl` prop ───────\n  const hid =\n    hovered && hovered.kind !== \"state\" ? hovered.id : highlightId ?? null;\n  // children of the highlighted call: transitions the process creates/receives\n  const {spans} = model;\n  const related = useMemo<ReadonlySet<string>>(\n    () => new Set(hid ? relatedCallIds({spans}, hid) : []),\n    [hid, spans],\n  );\n  // hovering a transition: also mark the process on the caller side that sent\n  // the call / receives the reply (the parent activity) — only that activity\n  const procId = hovered ? processOf(model, hovered) : null;\n\n  // ── auto-follow (page or nearest scroll container) ───────────────────────\n  const follow = useRef(true);\n  useEffect(() => {\n    if (!autoFollow) return;\n    const sp = scrollParent(rootRef.current);\n    const target: HTMLElement | Window = sp ?? window;\n    const onScroll = () => {\n      follow.current = sp\n        ? sp.scrollTop + sp.clientHeight >= sp.scrollHeight - 40\n        : window.innerHeight + window.scrollY >= document.documentElement.scrollHeight - 40;\n    };\n    target.addEventListener(\"scroll\", onScroll, {passive: true});\n    return () => target.removeEventListener(\"scroll\", onScroll);\n  }, [autoFollow]);\n  useLayoutEffect(() => {\n    if (!autoFollow || !follow.current) return;\n    const sp = scrollParent(rootRef.current);\n    if (sp) sp.scrollTop = sp.scrollHeight;\n    else window.scrollTo(0, document.documentElement.scrollHeight);\n  }, [autoFollow, model.rows.length, model.pending.length]);\n\n  return (\n    <div ref={rootRef} className={clsx(\"pihanga-swimlane\", className)} data-pihanga={cardName}>\n      <Defs mk={mk} />\n      <div className=\"swl-header\" style={{top: stickyTop}}>\n        <Header model={model} g={g} headH={headerHeight} width={width} />\n      </div>\n      <div className=\"swl-rows\" onPointerOver={onOver} onPointerOut={onOut} onPointerMove={onMove} onClick={onClick}>\n        {model.rows.map((r) => (\n          <RealRow\n            key={r.id}\n            row={r}\n            hl={hid && rowTouches(r, \"id\" in r.event ? r.event.id : undefined, hid) ? hid : null}\n            rel={\"id\" in r.event && r.event.type !== \"done\" && related.has(r.event.id)}\n            proc={procId && rowTouches(r, undefined, procId) ? procId : null}\n            {...common}\n          />\n        ))}\n        {showPending && <PendingZone model={model} hid={hid} related={related} procId={procId} clock={clock} {...common} />}\n      </div>\n      <div ref={tipRef} className=\"swl-tooltip\" role=\"tooltip\" />\n    </div>\n  );\n};\n"],"mappings":"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"}

package/cards/swimlane/swimlane.css

@@ -0,0 +1 @@
+:root{--swl-sync:oklch(55% .2 260);--swl-async:oklch(55% .22 295);--swl-event:oklch(60% .11 185);--swl-act-fill:oklch(93% .04 255);--swl-hl:oklch(77% .16 70);--swl-starting:oklch(67% .16 60);--swl-degraded:oklch(65% .19 45);--swl-running:oklch(60% .15 150)}.dark{--swl-sync:oklch(72% .14 260);--swl-async:oklch(74% .14 295);--swl-event:oklch(78% .11 185);--swl-act-fill:oklch(35% .07 255);--swl-hl:oklch(80% .15 75);--swl-starting:oklch(75% .15 65);--swl-degraded:oklch(72% .17 45);--swl-running:oklch(75% .15 150)}.pihanga-swimlane{width:max-content;min-width:100%;color:var(--foreground);font-size:13px}.pihanga-swimlane .swl-header{z-index:2;background:var(--background);border-bottom:1px solid var(--border);position:sticky}.pihanga-swimlane svg{display:block;overflow:visible}.pihanga-swimlane svg text{fill:var(--foreground)}.pihanga-swimlane .swl-lane-name{font-size:12px;font-weight:600}.pihanga-swimlane .swl-ts{fill:var(--muted-foreground);font:10px ui-monospace,monospace}.pihanga-swimlane .swl-lbl{font-size:11px}.pihanga-swimlane .swl-lbl-muted{fill:var(--muted-foreground);font-size:10px}.pihanga-swimlane .swl-ll{stroke-width:1.5px}.pihanga-swimlane .swl-ll-created,.pihanga-swimlane .swl-ll-running{stroke:color-mix(in srgb, var(--muted-foreground) 70%, transparent)}.pihanga-swimlane .swl-ll-starting{stroke:var(--swl-starting);stroke-dasharray:4 3}.pihanga-swimlane .swl-ll-degraded{stroke:var(--swl-degraded);stroke-width:3px}.pihanga-swimlane .swl-ll-stopped{stroke:var(--border);stroke-dasharray:1 4}.pihanga-swimlane .swl-dot-created,.pihanga-swimlane .swl-dot-starting{fill:var(--swl-starting)}.pihanga-swimlane .swl-dot-running{fill:var(--swl-running)}.pihanga-swimlane .swl-dot-degraded{fill:var(--swl-degraded)}.pihanga-swimlane .swl-dot-stopped{fill:var(--border)}.pihanga-swimlane .swl-lane-head{fill:var(--background);stroke:var(--muted-foreground)}.pihanga-swimlane .swl-act rect{fill:var(--swl-act-fill);stroke:none}.pihanga-swimlane .swl-act path{fill:none;stroke:var(--swl-sync);stroke-width:1px}.pihanga-swimlane .swl-act.swl-hl rect{fill:var(--swl-hl)}.pihanga-swimlane .swl-act.swl-hl path{stroke:var(--swl-hl)}.pihanga-swimlane .swl-act.swl-hl-proc rect{fill:color-mix(in srgb, var(--swl-hl) 45%, var(--swl-act-fill))}.pihanga-swimlane .swl-act.swl-hl-proc path{stroke:var(--swl-hl);stroke-width:2px}.pihanga-swimlane .swl-ar{fill:none;stroke-width:1.5px}.pihanga-swimlane .swl-ar-sync{stroke:var(--swl-sync)}.pihanga-swimlane .swl-ar-async{stroke:var(--swl-async)}.pihanga-swimlane .swl-ar-event{stroke:var(--swl-event);stroke-dasharray:2 3}.pihanga-swimlane .swl-ar-reply{stroke:var(--muted-foreground);stroke-dasharray:5 3}.pihanga-swimlane .swl-ar-error{stroke:var(--destructive);stroke-dasharray:5 3}.pihanga-swimlane .swl-ar-ghost{stroke:var(--muted-foreground);stroke-dasharray:7 4}.pihanga-swimlane .swl-ar-ghost.swl-overdue{stroke:var(--destructive)}.pihanga-swimlane .swl-ar.swl-hl{stroke:var(--swl-hl);stroke-width:3px}.pihanga-swimlane .swl-ar.swl-hl-rel{stroke:var(--swl-hl);stroke-width:2px}.pihanga-swimlane .swl-mk-sync{fill:var(--swl-sync)}.pihanga-swimlane .swl-mk-async{fill:none;stroke:var(--swl-async);stroke-width:1.5px}.pihanga-swimlane .swl-mk-event{fill:none;stroke:var(--swl-event);stroke-width:1.5px}.pihanga-swimlane .swl-mk-reply,.pihanga-swimlane .swl-mk-ghost{fill:none;stroke:var(--muted-foreground);stroke-width:1.5px}.pihanga-swimlane .swl-mk-error{fill:var(--destructive)}.pihanga-swimlane .swl-ghost{opacity:.55}.pihanga-swimlane .swl-ts.swl-overdue{fill:var(--destructive);font-weight:600}.pihanga-swimlane .swl-now-line{stroke:var(--swl-hl);stroke-width:1.5px;stroke-dasharray:10 4}.pihanga-swimlane text.swl-now-lbl{fill:var(--swl-hl);font-size:11px;font-weight:600}.pihanga-swimlane text.swl-ok{fill:var(--swl-running);font-size:12px;font-weight:700}.pihanga-swimlane .swl-arrived{animation:1.6s ease-out swl-arrive}@keyframes swl-arrive{0%{background:color-mix(in srgb, var(--swl-hl) 45%, transparent)}to{background:0 0}}.pihanga-swimlane .swl-hit{fill:#0000;stroke:#0000;cursor:pointer}.pihanga-swimlane.swl-debug-hits .swl-hit{fill:color-mix(in srgb, var(--destructive) 10%, transparent);stroke:color-mix(in srgb, var(--destructive) 20%, transparent)}.pihanga-swimlane .swl-tooltip{z-index:50;pointer-events:none;border-radius:calc(var(--radius) - 2px);border:1px solid var(--border);background:var(--popover);max-width:340px;color:var(--popover-foreground);box-shadow:0 4px 12px color-mix(in srgb, var(--foreground) 15%, transparent);padding:6px 8px;font-size:12px;display:none;position:fixed}

package/cards/swimlane/swimlane.demo.d.ts

@@ -0,0 +1,12 @@
+import { SwimlaneEvent, SwimlaneModel } from './swimlane.types';
+/**
+ * A checkout flow through a small microservice deployment, stopped while
+ * several replies and one announced callback are still outstanding.
+ */
+export declare function demoEvents(t0: number, opts?: {
+    complete?: boolean;
+}): SwimlaneEvent[];
+export declare function buildDemoModel(opts?: {
+    complete?: boolean;
+    t0?: number;
+}): SwimlaneModel;

package/cards/swimlane/swimlane.model.d.ts

@@ -0,0 +1,41 @@
+import { PiRegister, ReduxState } from '@pihanga2/core';
+import { SwimlaneEvent, SwimlaneGhostRow, SwimlaneLanesSnapshot, SwimlaneModel, SwimlanePending, SwimlaneTarget } from './swimlane.types';
+export declare function createSwimlaneModel(opts?: {
+    maxRows?: number;
+}): SwimlaneModel;
+/**
+ * Apply a batch of stream events to the model (mutating it).
+ * Safe to call on an Immer draft or on a plain object.
+ */
+export declare function ingestSwimlaneEvents(m: SwimlaneModel, events: SwimlaneEvent[], now?: number): void;
+/** Remove all rows but keep lanes, open activities and outstanding messages. */
+export declare function clearSwimlaneRows(m: SwimlaneModel): void;
+/**
+ * Project outstanding messages below the "now" line (pure).
+ * Expected replies are replayed onto the current snapshot so that open
+ * activities visibly run down to the ghost reply that will close them.
+ * Newest first ≈ innermost call replies first.
+ */
+export declare function projectPending(current: SwimlaneLanesSnapshot, pending: SwimlanePending[]): SwimlaneGhostRow[];
+/**
+ * Direct children of call `id`: calls made while it was being handled.
+ * Their call/reply transitions (and outstanding replies) are the transitions
+ * the process "creates and receives".
+ */
+export declare function relatedCallIds(m: Pick<SwimlaneModel, "spans">, id: string): string[];
+/** Does a row (or ghost row) involve the call chain `id`? */
+export declare function rowTouches(r: {
+    pre: SwimlaneLanesSnapshot;
+    post: SwimlaneLanesSnapshot;
+}, eventId: string | undefined, id: string): boolean;
+export declare function formatTs(t: number): string;
+/** Human-readable description of a hover target (used by the tooltip). */
+export declare function describeSwimlaneTarget(m: SwimlaneModel, t: SwimlaneTarget, now?: number): string;
+/**
+ * Wire the data actions for one model:
+ *
+ *   register((r) => registerSwimlaneModel<AppState>(r, "main", (s) => s.swimlane));
+ *   // …later, from a stream adapter:
+ *   dispatchSwimlaneEvents(dispatch, {modelId: "main", events});
+ */
+export declare function registerSwimlaneModel<S extends ReduxState>(r: PiRegister, modelId: string, select: (state: S) => SwimlaneModel): void;