@webskill/sdk 0.21.0 → 0.22.0

package/dist/cynefin-OW5HDTMX-B2QvgEQj.js

@@ -0,0 +1,4 @@
+import "./chunk-FOHPRMQF-Dkbp819z.js";
+import { A as createCynefinServices, k as CynefinModule } from "./mermaid-parser.core-pYR5siSx.js";
+
+export { createCynefinServices };

package/dist/cynefinDiagram-VND7K2PF-yAWc6Z3W.js

@@ -0,0 +1,479 @@
+import { n as parse } from "./mermaid-parser.core-pYR5siSx.js";
+import { n as __name } from "./chunk-Y2CYZVJY-U3QOMqrW.js";
+import { m as log } from "./src-NkhI3UMl.js";
+import { D as getThemeVariables3, H as setAccDescription, U as setAccTitle, a as clear, b as getConfig, c as configureSvgSize, f as defaultConfig_default, q as setDiagramTitle, v as getAccDescription, w as getDiagramTitle, y as getAccTitle } from "./chunk-O7XYJQB3-B6K0KOSL.js";
+import { i as cleanAndMerge } from "./chunk-ZIGJFQKS-DqEFBuHR.js";
+import { t as selectSvgElement } from "./chunk-6AEJRKK7-JXK89I-O.js";
+import { t as populateCommonDb } from "./chunk-JWPE2WC7-D1rC79GS.js";
+
+//#region ../../node_modules/.pnpm/mermaid@12.0.0/node_modules/mermaid/dist/chunks/mermaid.core/cynefinDiagram-VND7K2PF.mjs
+var createDefaultData = /* @__PURE__ */ __name(() => ({
+	domains: /* @__PURE__ */ new Map(),
+	transitions: []
+}), "createDefaultData");
+var data = createDefaultData();
+var db = {
+	getDomains: /* @__PURE__ */ __name(() => data.domains, "getDomains"),
+	getTransitions: /* @__PURE__ */ __name(() => data.transitions, "getTransitions"),
+	setDomains: /* @__PURE__ */ __name((blocks) => {
+		if (!blocks) return;
+		for (const block of blocks) {
+			const domainName = block.domain;
+			const items = (block.items ?? []).map((item) => ({ label: item.label }));
+			data.domains.set(domainName, {
+				name: domainName,
+				items
+			});
+		}
+	}, "setDomains"),
+	setTransitions: /* @__PURE__ */ __name((transitions) => {
+		if (!transitions) return;
+		data.transitions = transitions.filter((t) => {
+			if (t.from === t.to) {
+				log.warn(`Cynefin: self-loop transition on domain "${t.from}" is not meaningful and will be skipped.`);
+				return false;
+			}
+			return true;
+		}).map((t) => ({
+			from: t.from,
+			to: t.to,
+			label: t.label || void 0
+		}));
+	}, "setTransitions"),
+	getConfig: /* @__PURE__ */ __name(() => {
+		return cleanAndMerge({
+			...defaultConfig_default.cynefin,
+			...getConfig().cynefin
+		});
+	}, "getConfig"),
+	clear: /* @__PURE__ */ __name(() => {
+		clear();
+		data = createDefaultData();
+	}, "clear"),
+	setAccTitle,
+	getAccTitle,
+	setDiagramTitle,
+	getDiagramTitle,
+	getAccDescription,
+	setAccDescription
+};
+var populate = /* @__PURE__ */ __name((ast) => {
+	populateCommonDb(ast, db);
+	db.setDomains(ast.domains);
+	db.setTransitions(ast.transitions);
+}, "populate");
+var parser = { parse: /* @__PURE__ */ __name(async (input) => {
+	const ast = await parse("cynefin", input);
+	log.debug(ast);
+	populate(ast);
+}, "parse") };
+function seededRandom(seed) {
+	let t = seed + 1831565813 | 0;
+	t = Math.imul(t ^ t >>> 15, t | 1);
+	t ^= t + Math.imul(t ^ t >>> 7, t | 61);
+	return ((t ^ t >>> 14) >>> 0) / 4294967296;
+}
+__name(seededRandom, "seededRandom");
+function hashString(str) {
+	let hash = 0;
+	for (let i = 0; i < str.length; i++) {
+		const ch = str.charCodeAt(i);
+		hash = (hash << 5) - hash + ch;
+		hash |= 0;
+	}
+	return hash;
+}
+__name(hashString, "hashString");
+function resolveSeed(configuredSeed, id) {
+	if (typeof configuredSeed === "number" && Number.isFinite(configuredSeed) && configuredSeed !== 0) return configuredSeed;
+	return hashString(id);
+}
+__name(resolveSeed, "resolveSeed");
+function generateFoldPath(width, height, seed, amplitudeOverride) {
+	const cx = width / 2;
+	const amplitude = amplitudeOverride ?? width * .015;
+	const segments = 7;
+	const segHeight = height / segments;
+	const points = [];
+	for (let i = 0; i <= segments; i++) {
+		const jitter = seededRandom(seed + i * 17) * amplitude * 2 - amplitude;
+		points.push({
+			x: cx + jitter,
+			y: i * segHeight
+		});
+	}
+	let d = `M${points[0].x},${points[0].y}`;
+	for (let i = 0; i < points.length - 1; i++) {
+		const p0 = points[i];
+		const p1 = points[i + 1];
+		const midY = (p0.y + p1.y) / 2;
+		const dir = i % 2 === 0 ? 1 : -1;
+		const offset = amplitude * 1.5 * dir * seededRandom(seed + i * 31 + 7);
+		const cp1x = p0.x + offset;
+		const cp1y = midY;
+		const cp2x = p1.x - offset;
+		d += ` C${cp1x},${cp1y} ${cp2x},${midY} ${p1.x},${p1.y}`;
+	}
+	return d;
+}
+__name(generateFoldPath, "generateFoldPath");
+function generateHorizontalBoundary(width, height, seed, amplitudeOverride) {
+	const cy = height / 2;
+	const amplitude = amplitudeOverride ?? height * .015;
+	const segments = 7;
+	const segWidth = width / segments;
+	const points = [];
+	for (let i = 0; i <= segments; i++) {
+		const jitter = seededRandom(seed + i * 23) * amplitude * 2 - amplitude;
+		points.push({
+			x: i * segWidth,
+			y: cy + jitter
+		});
+	}
+	let d = `M${points[0].x},${points[0].y}`;
+	for (let i = 0; i < points.length - 1; i++) {
+		const p0 = points[i];
+		const p1 = points[i + 1];
+		const midX = (p0.x + p1.x) / 2;
+		const dir = i % 2 === 0 ? 1 : -1;
+		const offset = amplitude * 1.5 * dir * seededRandom(seed + i * 37 + 11);
+		const cp1x = midX;
+		const cp1y = p0.y + offset;
+		const cp2x = midX;
+		const cp2y = p1.y - offset;
+		d += ` C${cp1x},${cp1y} ${cp2x},${cp2y} ${p1.x},${p1.y}`;
+	}
+	return d;
+}
+__name(generateHorizontalBoundary, "generateHorizontalBoundary");
+function generateCliffPath(width, height) {
+	const cx = width / 2;
+	const topY = height * .5;
+	const bottomY = height;
+	const amplitude = width * .03;
+	return [
+		`M${cx},${topY}`,
+		`C${cx + amplitude},${topY + (bottomY - topY) * .2}`,
+		`${cx - amplitude * 1.5},${topY + (bottomY - topY) * .55}`,
+		`${cx + amplitude * .5},${topY + (bottomY - topY) * .75}`,
+		`C${cx - amplitude},${topY + (bottomY - topY) * .85}`,
+		`${cx + amplitude * .3},${topY + (bottomY - topY) * .95}`,
+		`${cx},${bottomY}`
+	].join(" ");
+}
+__name(generateCliffPath, "generateCliffPath");
+function generateConfusionPath(cx, cy, rx, ry) {
+	return [
+		`M${cx - rx},${cy}`,
+		`A${rx},${ry} 0 1,1 ${cx + rx},${cy}`,
+		`A${rx},${ry} 0 1,1 ${cx - rx},${cy}`,
+		"Z"
+	].join(" ");
+}
+__name(generateConfusionPath, "generateConfusionPath");
+var DOMAIN_META = {
+	complex: {
+		model: "Probe → Sense → Respond",
+		practice: "Emergent Practices"
+	},
+	complicated: {
+		model: "Sense → Analyse → Respond",
+		practice: "Good Practices"
+	},
+	clear: {
+		model: "Sense → Categorise → Respond",
+		practice: "Best Practices"
+	},
+	chaotic: {
+		model: "Act → Sense → Respond",
+		practice: "Novel Practices"
+	},
+	confusion: {
+		model: "",
+		practice: "Disorder"
+	}
+};
+var getDomainLayouts = /* @__PURE__ */ __name((width, height) => {
+	const hw = width / 2;
+	const hh = height / 2;
+	return {
+		complex: {
+			cx: hw / 2,
+			cy: hh / 2,
+			x: 0,
+			y: 0,
+			w: hw,
+			h: hh
+		},
+		complicated: {
+			cx: hw + hw / 2,
+			cy: hh / 2,
+			x: hw,
+			y: 0,
+			w: hw,
+			h: hh
+		},
+		chaotic: {
+			cx: hw / 2,
+			cy: hh + hh / 2,
+			x: 0,
+			y: hh,
+			w: hw,
+			h: hh
+		},
+		clear: {
+			cx: hw + hw / 2,
+			cy: hh + hh / 2,
+			x: hw,
+			y: hh,
+			w: hw,
+			h: hh
+		},
+		confusion: {
+			cx: hw,
+			cy: hh,
+			x: hw * .7,
+			y: hh * .7,
+			w: hw * .6,
+			h: hh * .6
+		}
+	};
+}, "getDomainLayouts");
+var getCynefinDomainColors = /* @__PURE__ */ __name(() => {
+	return cleanAndMerge(getThemeVariables3(), getConfig().themeVariables).cynefin;
+}, "getCynefinDomainColors");
+var MAX_CONFUSION_ITEMS = 3;
+var renderer = { draw: /* @__PURE__ */ __name((_text, id, _version, diagram2) => {
+	const db2 = diagram2.db;
+	const domains = db2.getDomains();
+	const transitions = db2.getTransitions();
+	const title = db2.getDiagramTitle();
+	const accTitle = db2.getAccTitle();
+	const accDescription = db2.getAccDescription();
+	const config = db2.getConfig();
+	const domainColors = getCynefinDomainColors();
+	log.debug("Rendering Cynefin diagram");
+	const width = config.width;
+	const height = config.height;
+	const padding = config.padding;
+	const showDomainDescriptions = config.showDomainDescriptions;
+	const boundaryAmplitude = config.boundaryAmplitude;
+	const totalWidth = width + padding * 2;
+	const totalHeight = height + padding * 2;
+	const domainBg = {
+		complex: domainColors.complexBg,
+		complicated: domainColors.complicatedBg,
+		clear: domainColors.clearBg,
+		chaotic: domainColors.chaoticBg,
+		confusion: domainColors.confusionBg
+	};
+	const svg = selectSvgElement(id);
+	configureSvgSize(svg, totalHeight, totalWidth, config.useMaxWidth ?? true);
+	svg.attr("viewBox", `0 0 ${totalWidth} ${totalHeight}`);
+	if (accTitle) svg.append("title").text(accTitle);
+	if (accDescription) svg.append("desc").text(accDescription);
+	const root = svg.append("g").attr("transform", `translate(${padding}, ${padding})`);
+	const layouts = getDomainLayouts(width, height);
+	const seed = resolveSeed(config.seed, id);
+	const bgGroup = root.append("g").attr("class", "cynefin-backgrounds");
+	const quadrantDomains = [
+		"complex",
+		"complicated",
+		"chaotic",
+		"clear"
+	];
+	for (const domainName of quadrantDomains) {
+		const layout = layouts[domainName];
+		bgGroup.append("rect").attr("class", "cynefinDomain").attr("x", layout.x).attr("y", layout.y).attr("width", layout.w).attr("height", layout.h).attr("fill", domainBg[domainName]).attr("fill-opacity", .4).attr("stroke", "none");
+	}
+	const boundaryGroup = root.append("g").attr("class", "cynefin-boundaries");
+	boundaryGroup.append("path").attr("class", "cynefinBoundary").attr("d", generateFoldPath(width, height, seed, boundaryAmplitude)).attr("fill", "none");
+	boundaryGroup.append("path").attr("class", "cynefinBoundary").attr("d", generateHorizontalBoundary(width, height, seed + 100, boundaryAmplitude)).attr("fill", "none");
+	boundaryGroup.append("path").attr("class", "cynefinCliff").attr("d", generateCliffPath(width, height)).attr("fill", "none");
+	const confusionRx = width * .15;
+	const confusionRy = height * .15;
+	root.append("path").attr("class", "cynefinConfusion").attr("d", generateConfusionPath(width / 2, height / 2, confusionRx, confusionRy)).attr("fill", domainBg.confusion).attr("fill-opacity", .5);
+	const labelGroup = root.append("g").attr("class", "cynefin-labels");
+	for (const domainName of quadrantDomains) {
+		const layout = layouts[domainName];
+		labelGroup.append("text").attr("class", "cynefinDomainLabel").attr("x", layout.cx).attr("y", showDomainDescriptions ? layout.cy - 30 : layout.cy).attr("text-anchor", "middle").attr("dominant-baseline", "middle").text(domainName.charAt(0).toUpperCase() + domainName.slice(1));
+	}
+	labelGroup.append("text").attr("class", "cynefinDomainLabel").attr("x", width / 2).attr("y", showDomainDescriptions ? height / 2 - 10 : height / 2).attr("text-anchor", "middle").attr("dominant-baseline", "middle").text("Confusion");
+	if (showDomainDescriptions) {
+		const subtitleGroup = root.append("g").attr("class", "cynefin-subtitles");
+		for (const domainName of quadrantDomains) {
+			const layout = layouts[domainName];
+			const meta = DOMAIN_META[domainName];
+			subtitleGroup.append("text").attr("class", "cynefinSubtitle").attr("x", layout.cx).attr("y", layout.cy - 10).attr("text-anchor", "middle").attr("dominant-baseline", "middle").text(meta.model);
+			subtitleGroup.append("text").attr("class", "cynefinSubtitle").attr("x", layout.cx).attr("y", layout.cy + 5).attr("text-anchor", "middle").attr("dominant-baseline", "middle").text(meta.practice);
+		}
+		subtitleGroup.append("text").attr("class", "cynefinSubtitle").attr("x", width / 2).attr("y", height / 2 + 8).attr("text-anchor", "middle").attr("dominant-baseline", "middle").text(DOMAIN_META.confusion.practice);
+	}
+	const itemGroup = root.append("g").attr("class", "cynefin-items");
+	const itemHeight = 26;
+	const itemPaddingX = 10;
+	for (const domainName of [
+		"complex",
+		"complicated",
+		"chaotic",
+		"clear",
+		"confusion"
+	]) {
+		const domain = domains.get(domainName);
+		if (!domain || domain.items.length === 0) continue;
+		const layout = layouts[domainName];
+		const isConfusion = domainName === "confusion";
+		let itemsToRender = domain.items;
+		let overflowCount = 0;
+		if (isConfusion && domain.items.length > MAX_CONFUSION_ITEMS) {
+			overflowCount = domain.items.length - MAX_CONFUSION_ITEMS;
+			itemsToRender = domain.items.slice(0, MAX_CONFUSION_ITEMS);
+		}
+		let startY;
+		if (isConfusion) {
+			const labelOffset = showDomainDescriptions ? 22 : 14;
+			startY = layout.cy + labelOffset;
+		} else startY = layout.cy + (showDomainDescriptions ? 25 : 15);
+		[...itemsToRender].forEach((item, idx) => {
+			const itemY = startY + idx * 30;
+			const g = itemGroup.append("g");
+			const textEl = g.append("text").attr("class", "cynefinItemText").attr("x", 0).attr("y", itemHeight / 2).attr("text-anchor", "middle").attr("dominant-baseline", "central").text(item.label);
+			let measuredWidth = item.label.length * 7;
+			const textNode = textEl.node();
+			if (textNode && typeof textNode.getBBox === "function") {
+				const bbox = textNode.getBBox();
+				if (bbox.width > 0) measuredWidth = bbox.width;
+			}
+			const badgeWidth = measuredWidth + itemPaddingX * 2;
+			const itemX = layout.cx - badgeWidth / 2;
+			g.attr("transform", `translate(${itemX}, ${itemY})`);
+			g.insert("rect", "text").attr("class", "cynefinItem").attr("x", 0).attr("y", 0).attr("width", badgeWidth).attr("height", itemHeight).attr("rx", 4).attr("ry", 4).attr("fill", domainBg[domainName]).attr("fill-opacity", .95);
+			textEl.attr("x", badgeWidth / 2).attr("y", itemHeight / 2);
+		});
+		if (overflowCount > 0) {
+			const overflowY = startY + itemsToRender.length * 30;
+			const overflowLabel = `+${overflowCount} more`;
+			const g = itemGroup.append("g");
+			const textEl = g.append("text").attr("class", "cynefinItemText").attr("x", 0).attr("y", itemHeight / 2).attr("text-anchor", "middle").attr("dominant-baseline", "central").text(overflowLabel);
+			let measuredWidth = overflowLabel.length * 7;
+			const textNode = textEl.node();
+			if (textNode && typeof textNode.getBBox === "function") {
+				const bbox = textNode.getBBox();
+				if (bbox.width > 0) measuredWidth = bbox.width;
+			}
+			const badgeWidth = measuredWidth + itemPaddingX * 2;
+			const itemX = layout.cx - badgeWidth / 2;
+			g.attr("transform", `translate(${itemX}, ${overflowY})`);
+			g.insert("rect", "text").attr("class", "cynefinItemOverflow").attr("x", 0).attr("y", 0).attr("width", badgeWidth).attr("height", itemHeight).attr("rx", 4).attr("ry", 4).attr("fill", domainBg[domainName]).attr("fill-opacity", .6);
+			textEl.attr("x", badgeWidth / 2).attr("y", itemHeight / 2);
+		}
+	}
+	if (transitions.length > 0) {
+		const defs = svg.select("defs").empty() ? svg.append("defs") : svg.select("defs");
+		const markerId = `cynefin-arrow-${id}`;
+		defs.append("marker").attr("id", markerId).attr("viewBox", "0 0 10 10").attr("refX", 9).attr("refY", 5).attr("markerWidth", 6).attr("markerHeight", 6).attr("orient", "auto-start-reverse").append("path").attr("d", "M 0 0 L 10 5 L 0 10 z").attr("class", "cynefinArrowHead");
+		const arrowGroup = root.append("g").attr("class", "cynefin-arrows");
+		transitions.forEach((transition) => {
+			const fromLayout = layouts[transition.from];
+			const toLayout = layouts[transition.to];
+			if (!fromLayout || !toLayout) return;
+			if (transition.from === transition.to) {
+				log.warn(`Cynefin renderer: skipping self-loop on domain "${transition.from}"`);
+				return;
+			}
+			const x1 = fromLayout.cx;
+			const y1 = fromLayout.cy;
+			const x2 = toLayout.cx;
+			const y2 = toLayout.cy;
+			const mx = (x1 + x2) / 2;
+			const my = (y1 + y2) / 2;
+			const dx = x2 - x1;
+			const dy = y2 - y1;
+			const len = Math.sqrt(dx * dx + dy * dy);
+			const offsetAmount = len * .15;
+			const nx = -dy / len;
+			const ny = dx / len;
+			const cpx = mx + nx * offsetAmount;
+			const cpy = my + ny * offsetAmount;
+			arrowGroup.append("path").attr("class", "cynefinArrowLine").attr("d", `M${x1},${y1} Q${cpx},${cpy} ${x2},${y2}`).attr("fill", "none").attr("marker-end", `url(#${markerId})`);
+			if (transition.label) arrowGroup.append("text").attr("class", "cynefinArrowLabel").attr("x", cpx).attr("y", cpy - 6).attr("text-anchor", "middle").attr("dominant-baseline", "auto").text(transition.label);
+		});
+	}
+	if (title) root.append("text").attr("class", "cynefinTitle").attr("x", width / 2).attr("y", -padding / 2).attr("text-anchor", "middle").attr("dominant-baseline", "middle").text(title);
+}, "draw") };
+var getCynefinTheme = /* @__PURE__ */ __name(() => {
+	return cleanAndMerge(getThemeVariables3(), getConfig().themeVariables).cynefin;
+}, "getCynefinTheme");
+var diagram = {
+	parser,
+	db,
+	renderer,
+	styles: /* @__PURE__ */ __name(() => {
+		const t = getCynefinTheme();
+		return `
+	.cynefinDomain {
+		stroke: none;
+	}
+	.cynefinDomainLabel {
+		font-size: ${t.domainFontSize}px;
+		font-weight: bold;
+		fill: ${t.labelColor};
+	}
+	.cynefinSubtitle {
+		font-size: ${t.itemFontSize - 1}px;
+		fill: ${t.textColor};
+		font-style: italic;
+	}
+	.cynefinItem {
+		fill-opacity: 0.95;
+		stroke: ${t.boundaryColor};
+		stroke-width: 1;
+	}
+	.cynefinItemText {
+		font-size: ${t.itemFontSize}px;
+		fill: ${t.textColor};
+	}
+	.cynefinItemOverflow {
+		fill-opacity: 0.6;
+		stroke: ${t.boundaryColor};
+		stroke-width: 1;
+		stroke-dasharray: 3 2;
+	}
+	.cynefinBoundary {
+		stroke: ${t.boundaryColor};
+		stroke-width: ${t.boundaryWidth};
+		stroke-dasharray: 6 3;
+	}
+	.cynefinCliff {
+		stroke: ${t.cliffColor};
+		stroke-width: ${t.cliffWidth};
+	}
+	.cynefinConfusion {
+		stroke: ${t.boundaryColor};
+		stroke-width: 1.5;
+		stroke-dasharray: 4 2;
+	}
+	.cynefinArrowLine {
+		stroke: ${t.arrowColor};
+		stroke-width: ${t.arrowWidth};
+		fill: none;
+	}
+	.cynefinArrowHead {
+		fill: ${t.arrowColor};
+		stroke: none;
+	}
+	.cynefinArrowLabel {
+		font-size: ${t.itemFontSize - 1}px;
+		fill: ${t.textColor};
+	}
+	.cynefinTitle {
+		font-size: ${t.domainFontSize + 2}px;
+		font-weight: bold;
+		fill: ${t.labelColor};
+	}
+	`;
+	}, "styles")
+};
+
+//#endregion
+export { diagram };