@klarkxy/dsh-deep-view 0.0.0-stage → 0.1.0

package/lib/client.js

@@ -0,0 +1,3082 @@
+window.__ModuleLoader__.load({
+  id: "@klarkxy/dsh-deep-view",
+  factory: (dshRequire) => {
+    var require = dshRequire;
+    var module = { exports: {} };
+    var exports = module.exports;
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+let react = require("react");
+let _deepseek_ai_dsh_client_ui_primitives = require("@deepseek-ai/dsh-client-ui-primitives");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/core/formula.js
+const FUNCTIONS = {
+	min: {
+		args: [1, Infinity],
+		run: (...values) => Math.min(...values.map(num))
+	},
+	max: {
+		args: [1, Infinity],
+		run: (...values) => Math.max(...values.map(num))
+	},
+	abs: {
+		args: [1, 1],
+		run: (value) => Math.abs(num(value))
+	},
+	floor: {
+		args: [1, 1],
+		run: (value) => Math.floor(num(value))
+	},
+	ceil: {
+		args: [1, 1],
+		run: (value) => Math.ceil(num(value))
+	},
+	sqrt: {
+		args: [1, 1],
+		run: (value) => Math.sqrt(num(value))
+	},
+	pow: {
+		args: [2, 2],
+		run: (base, power) => num(base) ** num(power)
+	},
+	round: {
+		args: [1, 2],
+		run: (value, digits = 0) => roundTo(num(value), digitsOf(digits))
+	},
+	clamp: {
+		args: [3, 3],
+		run: (value, low, high) => Math.min(Math.max(num(value), num(low)), num(high))
+	},
+	fixed: {
+		args: [1, 2],
+		run: (value, digits = 0) => roundTo(num(value), digitsOf(digits)).toFixed(digitsOf(digits))
+	},
+	format: {
+		args: [1, 2],
+		run: (value, digits = 0) => grouped$1(num(value), digitsOf(digits))
+	},
+	percent: {
+		args: [1, 2],
+		run: (value, digits = 0) => `${grouped$1(num(value) * 100, digitsOf(digits))}%`
+	}
+};
+const FORMULA_FUNCTIONS = Object.keys(FUNCTIONS);
+const CONSTANTS = /* @__PURE__ */ new Map([["true", true], ["false", false]]);
+const MAX_NESTING = 64;
+var FormulaError = class extends Error {};
+const fail = (message) => {
+	throw new FormulaError(message);
+};
+function num(value) {
+	if (typeof value === "number") return value;
+	if (typeof value === "boolean") return value ? 1 : 0;
+	const parsed = Number(value);
+	if (typeof value === "string" && value.trim() !== "" && !Number.isNaN(parsed)) return parsed;
+	return fail(`${JSON.stringify(value)} is not a number`);
+}
+const digitsOf = (digits) => {
+	const value = num(digits);
+	if (!Number.isInteger(value) || value < 0 || value > 10) fail("digits must be a whole number from 0 to 10");
+	return value;
+};
+const roundTo = (value, digits) => {
+	const scale = 10 ** digits;
+	return Math.round(value * scale) / scale;
+};
+function grouped$1(value, digits) {
+	if (!Number.isFinite(value)) return String(value);
+	const [whole, part] = Math.abs(roundTo(value, digits)).toFixed(digits).split(".");
+	return `${value < 0 && Number(whole + (part ?? "")) !== 0 ? "-" : ""}${whole.replace(/\B(?=(\d{3})+(?!\d))/g, ",")}${part ? `.${part}` : ""}`;
+}
+const IDENT = /^[A-Za-z_][A-Za-z0-9_]*$/;
+const isName = (value) => typeof value === "string" && IDENT.test(value);
+const OPERATORS = [
+	"==",
+	"!=",
+	"<=",
+	">=",
+	"&&",
+	"||",
+	"+",
+	"-",
+	"*",
+	"/",
+	"%",
+	"<",
+	">",
+	"!",
+	"?",
+	":",
+	"(",
+	")",
+	","
+];
+function tokenize(source) {
+	const tokens = [];
+	let at = 0;
+	while (at < source.length) {
+		const char = source[at];
+		if (/\s/.test(char)) {
+			at += 1;
+			continue;
+		}
+		const number = /^(?:\d+\.?\d*|\.\d+)(?:[eE][+-]?\d+)?/.exec(source.slice(at));
+		if (number) {
+			tokens.push({
+				kind: "number",
+				value: Number(number[0]),
+				at
+			});
+			at += number[0].length;
+			continue;
+		}
+		const name = /^[A-Za-z_][A-Za-z0-9_]*/.exec(source.slice(at));
+		if (name) {
+			tokens.push({
+				kind: "name",
+				value: name[0],
+				at
+			});
+			at += name[0].length;
+			continue;
+		}
+		if (char === "\"" || char === "'") {
+			let end = at + 1;
+			let text = "";
+			while (end < source.length && source[end] !== char) {
+				if (source[end] === "\\" && end + 1 < source.length) {
+					text += source[end + 1];
+					end += 2;
+					continue;
+				}
+				text += source[end];
+				end += 1;
+			}
+			if (end >= source.length) fail(`unclosed string at ${at + 1}`);
+			tokens.push({
+				kind: "string",
+				value: text,
+				at
+			});
+			at = end + 1;
+			continue;
+		}
+		const operator = OPERATORS.find((op) => source.startsWith(op, at));
+		if (operator === void 0) fail(`unexpected ${JSON.stringify(char)} at ${at + 1}`);
+		tokens.push({
+			kind: "op",
+			value: operator,
+			at
+		});
+		at += operator.length;
+	}
+	return tokens;
+}
+const BINARY = [
+	["||"],
+	["&&"],
+	["==", "!="],
+	[
+		"<",
+		"<=",
+		">",
+		">="
+	],
+	["+", "-"],
+	[
+		"*",
+		"/",
+		"%"
+	]
+];
+function parse(source) {
+	const tokens = tokenize(source);
+	let index = 0;
+	let depth = 0;
+	const peek = () => tokens[index];
+	const isOp = (value) => peek()?.kind === "op" && peek().value === value;
+	const expect = (value) => {
+		if (!isOp(value)) fail(peek() ? `expected "${value}" at ${peek().at + 1}` : `expected "${value}" at the end`);
+		index += 1;
+	};
+	const nest = (read) => {
+		depth += 1;
+		if (depth > MAX_NESTING) fail(`nested more than ${MAX_NESTING} levels`);
+		const node = read();
+		depth -= 1;
+		return node;
+	};
+	const ternary = () => nest(() => {
+		const test = binary(0);
+		if (!isOp("?")) return test;
+		index += 1;
+		const yes = ternary();
+		expect(":");
+		return {
+			type: "if",
+			test,
+			yes,
+			no: ternary()
+		};
+	});
+	const binary = (level) => {
+		if (level === BINARY.length) return unary();
+		let left = binary(level + 1);
+		while (peek()?.kind === "op" && BINARY[level].includes(peek().value)) {
+			const op = peek().value;
+			index += 1;
+			left = {
+				type: "binary",
+				op,
+				left,
+				right: binary(level + 1)
+			};
+		}
+		return left;
+	};
+	const unary = () => {
+		if (isOp("-") || isOp("!") || isOp("+")) {
+			const op = peek().value;
+			index += 1;
+			return nest(() => ({
+				type: "unary",
+				op,
+				value: unary()
+			}));
+		}
+		return primary();
+	};
+	const primary = () => {
+		const token = peek();
+		if (token === void 0) fail("the formula ends too early");
+		index += 1;
+		if (token.kind === "number" || token.kind === "string") return {
+			type: "value",
+			value: token.value
+		};
+		if (token.kind === "op" && token.value === "(") {
+			const inner = ternary();
+			expect(")");
+			return inner;
+		}
+		if (token.kind !== "name") fail(`unexpected "${token.value}" at ${token.at + 1}`);
+		if (!isOp("(")) return CONSTANTS.has(token.value) ? {
+			type: "value",
+			value: CONSTANTS.get(token.value)
+		} : {
+			type: "name",
+			name: token.value
+		};
+		const fn = Object.hasOwn(FUNCTIONS, token.value) ? FUNCTIONS[token.value] : void 0;
+		if (fn === void 0) fail(`unknown function "${token.value}"; allowed: ${FORMULA_FUNCTIONS.join(", ")}`);
+		index += 1;
+		const args = [];
+		if (!isOp(")")) {
+			args.push(ternary());
+			while (isOp(",")) {
+				index += 1;
+				args.push(ternary());
+			}
+		}
+		expect(")");
+		if (args.length < fn.args[0] || args.length > fn.args[1]) fail(`${token.value}() takes ${fn.args[0] === fn.args[1] ? fn.args[0] : fn.args[1] === Infinity ? `at least ${fn.args[0]}` : `${fn.args[0]} or ${fn.args[1]}`} argument${fn.args[1] === 1 ? "" : "s"}; got ${args.length}`);
+		return {
+			type: "call",
+			name: token.value,
+			args
+		};
+	};
+	if (tokens.length === 0) fail("the formula is empty");
+	const tree = ternary();
+	if (index < tokens.length) fail(`unexpected "${peek().value}" at ${peek().at + 1}`);
+	return tree;
+}
+function namesIn(node, found = /* @__PURE__ */ new Set()) {
+	if (node.type === "name") found.add(node.name);
+	else if (node.type === "unary") namesIn(node.value, found);
+	else if (node.type === "binary") {
+		namesIn(node.left, found);
+		namesIn(node.right, found);
+	} else if (node.type === "if") {
+		namesIn(node.test, found);
+		namesIn(node.yes, found);
+		namesIn(node.no, found);
+	} else if (node.type === "call") for (const arg of node.args) namesIn(arg, found);
+	return found;
+}
+function compileFormula(source) {
+	if (typeof source !== "string") return { error: "expected a formula string" };
+	try {
+		const tree = parse(source);
+		return {
+			tree,
+			names: [...namesIn(tree)]
+		};
+	} catch (error) {
+		if (error instanceof FormulaError) return { error: error.message };
+		throw error;
+	}
+}
+function run(node, lookup) {
+	switch (node.type) {
+		case "value": return node.value;
+		case "name": return lookup(node.name);
+		case "unary": {
+			const value = run(node.value, lookup);
+			if (node.op === "!") return !truthy(value);
+			return node.op === "-" ? -num(value) : num(value);
+		}
+		case "if": return truthy(run(node.test, lookup)) ? run(node.yes, lookup) : run(node.no, lookup);
+		case "call": return FUNCTIONS[node.name].run(...node.args.map((arg) => run(arg, lookup)));
+		default: return binary(node, lookup);
+	}
+}
+const truthy = (value) => typeof value === "string" ? value !== "" : Boolean(value);
+function binary(node, lookup) {
+	if (node.op === "&&") return truthy(run(node.left, lookup)) ? run(node.right, lookup) : false;
+	if (node.op === "||") {
+		const left = run(node.left, lookup);
+		return truthy(left) ? left : run(node.right, lookup);
+	}
+	const left = run(node.left, lookup);
+	const right = run(node.right, lookup);
+	switch (node.op) {
+		case "+": return typeof left === "string" || typeof right === "string" ? `${show(left)}${show(right)}` : num(left) + num(right);
+		case "-": return num(left) - num(right);
+		case "*": return num(left) * num(right);
+		case "/": return num(left) / num(right);
+		case "%": return num(left) % num(right);
+		case "==": return left === right;
+		case "!=": return left !== right;
+		case "<": return num(left) < num(right);
+		case "<=": return num(left) <= num(right);
+		case ">": return num(left) > num(right);
+		default: return num(left) >= num(right);
+	}
+}
+function show(value) {
+	if (typeof value === "number") return Number.isFinite(value) ? String(Number(value.toPrecision(12))) : String(value);
+	return String(value);
+}
+function createScope(inputs, lets) {
+	const done = /* @__PURE__ */ new Map();
+	const busy = /* @__PURE__ */ new Set();
+	const lookup = (name) => {
+		if (inputs.has(name)) return inputs.get(name);
+		if (done.has(name)) return done.get(name);
+		const tree = lets.get(name);
+		if (tree === void 0) fail(`unknown name "${name}"`);
+		if (busy.has(name)) fail(`"${name}" refers to itself`);
+		busy.add(name);
+		try {
+			const value = run(tree, lookup);
+			done.set(name, value);
+			return value;
+		} finally {
+			busy.delete(name);
+		}
+	};
+	return lookup;
+}
+function evaluate(tree, lookup) {
+	try {
+		return { value: run(tree, lookup) };
+	} catch (error) {
+		if (error instanceof FormulaError) return { error: error.message };
+		if (error instanceof RangeError) return { error: "the formula is too deep to work out" };
+		throw error;
+	}
+}
+//#endregion
+//#region src/core/views.js
+const LAYOUT = ["stack", "row"];
+const DISPLAY = [
+	"text",
+	"metric",
+	"table",
+	"chart",
+	"progress",
+	"callout",
+	"sources"
+];
+const INPUT_TYPES = [
+	"slider",
+	"choice",
+	"toggle",
+	"number"
+];
+const ANSWERS = [
+	"options",
+	"confirm",
+	"form",
+	"submit"
+];
+const COMPONENTS = [
+	...LAYOUT,
+	...DISPLAY,
+	...INPUT_TYPES,
+	...ANSWERS
+];
+const TONES$1 = [
+	"good",
+	"warn",
+	"bad"
+];
+const TEXT_TONES = ["muted"];
+const CALLOUT_TONES$1 = [
+	"info",
+	"good",
+	"warn",
+	"bad"
+];
+const CHART_KINDS = [
+	"bar",
+	"hbar",
+	"line",
+	"area",
+	"donut"
+];
+const INTERACTIVE = new Set(ANSWERS);
+const INPUTS = new Set(INPUT_TYPES);
+const PROPS = {
+	stack: ["children", "let"],
+	row: ["children", "let"],
+	text: ["text", "tone"],
+	metric: [
+		"label",
+		"value",
+		"tone",
+		"caption"
+	],
+	table: ["columns", "rows"],
+	chart: [
+		"kind",
+		"categories",
+		"series",
+		"unit",
+		"caption"
+	],
+	progress: [
+		"label",
+		"percent",
+		"value",
+		"max",
+		"valueLabel",
+		"tone"
+	],
+	callout: ["text", "tone"],
+	sources: ["items"],
+	slider: [
+		"id",
+		"label",
+		"min",
+		"max",
+		"step",
+		"value",
+		"unit"
+	],
+	choice: [
+		"id",
+		"label",
+		"options",
+		"value"
+	],
+	toggle: [
+		"id",
+		"label",
+		"value"
+	],
+	number: [
+		"id",
+		"label",
+		"min",
+		"max",
+		"step",
+		"value",
+		"unit"
+	],
+	options: [
+		"id",
+		"options",
+		"multi"
+	],
+	confirm: [
+		"id",
+		"confirmLabel",
+		"cancelLabel"
+	],
+	form: [
+		"id",
+		"fields",
+		"submitLabel"
+	],
+	submit: ["id", "label"]
+};
+const MAX_DEPTH = 8;
+const MAX_NODES = 64;
+const MAX_CHILDREN = 16;
+const MAX_TEXT = 2e3;
+const MAX_CELL = 200;
+const MAX_COLUMNS = 8;
+const MAX_ROWS = 50;
+const MAX_OPTIONS = 8;
+const MAX_FIELDS = 6;
+const RESERVED = /* @__PURE__ */ new Set(["true", "false"]);
+const VIEW_BYTE_LIMIT = 8192;
+const isRecord$1 = (value) => value !== null && typeof value === "object" && !Array.isArray(value);
+const quoted = (value) => JSON.stringify(value);
+const allowed = (list) => list.join(", ");
+const isNumber = (value) => typeof value === "number" && Number.isFinite(value);
+const isScalar = (value) => typeof value === "string" || typeof value === "boolean" || isNumber(value);
+const isFormula = (value) => isRecord$1(value) && Object.keys(value).length === 1 && Object.hasOwn(value, "=");
+function viewBytes(title, view) {
+	return new TextEncoder().encode(`${JSON.stringify(view) ?? ""}${title ?? ""}`).length;
+}
+const NUMERIC = [
+	"value",
+	"percent",
+	"min",
+	"max",
+	"step",
+	"height"
+];
+const numeric = (value) => typeof value === "string" && value.trim() !== "" && !Number.isNaN(Number(value)) ? Number(value) : value;
+function normalizeView(value) {
+	if (Array.isArray(value)) return value.map(normalizeView);
+	if (!isRecord$1(value)) return value;
+	const keys = Object.keys(value);
+	if (keys.length === 1 && keys[0] === "item") {
+		const inner = normalizeView(value.item);
+		if (Array.isArray(inner)) return inner;
+	}
+	const out = {};
+	for (const key of keys) Object.defineProperty(out, key, {
+		value: normalizeView(value[key]),
+		writable: true,
+		enumerable: true,
+		configurable: true
+	});
+	for (const field of NUMERIC) if (Object.hasOwn(out, field)) out[field] = numeric(out[field]);
+	if (Array.isArray(out.values)) out.values = out.values.map(numeric);
+	return out;
+}
+function validateView(view) {
+	const ctx = {
+		ids: /* @__PURE__ */ new Set(),
+		nodes: 0,
+		interactive: false,
+		inputs: /* @__PURE__ */ new Map(),
+		lets: /* @__PURE__ */ new Map(),
+		formulas: []
+	};
+	const error = checkNode(view, "view", 1, ctx) ?? checkFormulas(ctx);
+	return error === void 0 ? {
+		ok: true,
+		interactive: ctx.interactive
+	} : {
+		ok: false,
+		error
+	};
+}
+function checkShownView(title, sent) {
+	let bytes;
+	try {
+		bytes = viewBytes(title, sent);
+	} catch {
+		return { error: "The view is not JSON data." };
+	}
+	if (bytes > 8192) return { error: `The view is ${bytes} bytes; the limit is ${VIEW_BYTE_LIMIT}.` };
+	if (title !== void 0 && title !== null && typeof title !== "string") return { error: "title: expected a string" };
+	const named = String(title ?? "").trim();
+	const view = normalizeView(sent);
+	const checked = validateView(view);
+	if (!checked.ok) return { error: checked.error };
+	return {
+		title: named,
+		view,
+		interactive: checked.interactive
+	};
+}
+function checkNode(node, path, depth, ctx) {
+	if (!isRecord$1(node)) return `${path}: expected a component object`;
+	if (depth > MAX_DEPTH) return `${path}: ${depth} levels exceeds the limit of ${MAX_DEPTH}`;
+	ctx.nodes += 1;
+	if (ctx.nodes > MAX_NODES) return `${path}: ${ctx.nodes} components exceeds the limit of ${MAX_NODES}`;
+	const type = node.type;
+	if (!COMPONENTS.includes(type)) return `${path}.type: unknown component ${quoted(type)}; allowed: ${allowed(COMPONENTS)}`;
+	const props = PROPS[type];
+	for (const key of Object.keys(node)) {
+		if (key === "type" || props.includes(key)) continue;
+		return `${path}.${key}: unknown property ${quoted(key)}; allowed: ${allowed(props)}`;
+	}
+	if (INTERACTIVE.has(type)) ctx.interactive = true;
+	switch (type) {
+		case "stack":
+		case "row": return checkLayout(node, path, depth, ctx);
+		case "text": return checkText(node, path, ctx);
+		case "metric": return checkMetric(node, path, ctx);
+		case "table": return checkTable(node, path, ctx);
+		case "chart": return checkChart(node, path, ctx);
+		case "progress": return checkProgress(node, path, ctx);
+		case "callout": return checkCallout(node, path, ctx);
+		case "sources": return checkSources(node, path);
+		case "slider":
+		case "number": return checkNumberInput(node, path, ctx);
+		case "choice": return checkChoice(node, path, ctx);
+		case "toggle": return checkToggle(node, path, ctx);
+		case "options": return checkOptions(node, path, ctx);
+		case "confirm": return checkConfirm(node, path, ctx);
+		case "form": return checkForm(node, path, ctx);
+		default: return checkSubmit(node, path, ctx);
+	}
+}
+function checkLayout(node, path, depth, ctx) {
+	if (node.let !== void 0) {
+		if (depth !== 1) return `${path}.let: only the outermost component can define names`;
+		if (!isRecord$1(node.let)) return `${path}.let: expected an object of names to formulas`;
+		for (const [name, source] of Object.entries(node.let)) {
+			if (!isName(name) || RESERVED.has(name)) return `${path}.let.${name}: a name is letters, digits and _, and starts with a letter or _`;
+			if (typeof source !== "string") return `${path}.let.${name}: expected a formula string`;
+			ctx.lets.set(name, {
+				source,
+				path: `${path}.let.${name}`
+			});
+		}
+	}
+	if (!Array.isArray(node.children)) return `${path}.children: expected an array of 1 to ${MAX_CHILDREN} components`;
+	if (node.children.length < 1 || node.children.length > MAX_CHILDREN) return `${path}.children: expected 1 to ${MAX_CHILDREN} children; got ${node.children.length}`;
+	for (let index = 0; index < node.children.length; index += 1) {
+		const error = checkNode(node.children[index], `${path}.children[${index}]`, depth + 1, ctx);
+		if (error !== void 0) return error;
+	}
+}
+function checkValue(node, key, path, ctx, kind, { required = false, max = MAX_TEXT } = {}) {
+	const value = node[key];
+	const at = `${path}.${key}`;
+	if (value === void 0) return required ? `${at}: ${expected(kind)}` : void 0;
+	if (isFormula(value)) {
+		ctx.formulas.push({
+			source: value["="],
+			path: at,
+			kind
+		});
+		return;
+	}
+	if (kind === "number") return isNumber(value) ? void 0 : `${at}: ${expected(kind)}`;
+	if (Array.isArray(kind)) return kind.includes(value) ? void 0 : `${at}: unknown tone ${quoted(value)}; allowed: ${allowed(kind)}`;
+	if (kind === "string") {
+		if (typeof value !== "string") return `${at}: ${expected(kind)}`;
+		return value.length > max ? `${at}: ${value.length} characters exceeds the limit of ${max}` : void 0;
+	}
+	if (!isScalar(value)) return `${at}: ${expected(kind)}`;
+}
+const expected = (kind) => kind === "number" ? "expected a number" : kind === "string" ? "expected a string" : Array.isArray(kind) ? `expected one of ${allowed(kind)}` : "expected a string or a number";
+function checkText(node, path, ctx) {
+	return checkValue(node, "text", path, ctx, "string", { required: true }) ?? checkValue(node, "tone", path, ctx, TEXT_TONES);
+}
+function checkMetric(node, path, ctx) {
+	if (typeof node.label !== "string") return `${path}.label: expected a string`;
+	if (node.value === void 0) return `${path}.value: expected a string or a number`;
+	if (typeof node.value === "number" && !Number.isFinite(node.value)) return `${path}.value: expected a finite number`;
+	return checkValue(node, "value", path, ctx, "scalar") ?? checkValue(node, "tone", path, ctx, TONES$1) ?? checkValue(node, "caption", path, ctx, "string");
+}
+function checkTable(node, path, ctx) {
+	if (!Array.isArray(node.columns)) return `${path}.columns: expected an array of at most ${MAX_COLUMNS} columns`;
+	if (node.columns.length > MAX_COLUMNS) return `${path}.columns: ${node.columns.length} columns exceeds the limit of ${MAX_COLUMNS}`;
+	for (let index = 0; index < node.columns.length; index += 1) {
+		const column = node.columns[index];
+		const at = `${path}.columns[${index}]`;
+		if (!isRecord$1(column)) return `${at}: expected a column object`;
+		for (const key of Object.keys(column)) if (key !== "key" && key !== "label") return `${at}.${key}: unknown property ${quoted(key)}; allowed: key, label`;
+		if (typeof column.key !== "string" || column.key === "") return `${at}.key: expected a non-empty string`;
+		if (typeof column.label !== "string") return `${at}.label: expected a string`;
+	}
+	if (!Array.isArray(node.rows)) return `${path}.rows: expected an array of at most ${MAX_ROWS} rows`;
+	if (node.rows.length > MAX_ROWS) return `${path}.rows: ${node.rows.length} rows exceeds the limit of ${MAX_ROWS}`;
+	for (let row = 0; row < node.rows.length; row += 1) {
+		const cells = node.rows[row];
+		if (!Array.isArray(cells)) return `${path}.rows[${row}]: expected an array of cells`;
+		for (let column = 0; column < cells.length; column += 1) {
+			const at = `${path}.rows[${row}][${column}]`;
+			if (isFormula(cells[column])) {
+				ctx.formulas.push({
+					source: cells[column]["="],
+					path: at,
+					kind: "scalar"
+				});
+				continue;
+			}
+			const text = cellText$1(cells[column]);
+			if (text.length > MAX_CELL) return `${at}: ${text.length} characters exceeds the limit of ${MAX_CELL}`;
+		}
+	}
+}
+function checkChart(node, path, ctx) {
+	if (node.kind !== void 0 && !CHART_KINDS.includes(node.kind)) return `${path}.kind: unknown chart ${quoted(node.kind)}; allowed: ${allowed(CHART_KINDS)}`;
+	if (!Array.isArray(node.categories) || node.categories.length === 0) return `${path}.categories: expected a non-empty array of labels`;
+	for (let index = 0; index < node.categories.length; index += 1) {
+		const label = node.categories[index];
+		if (typeof label !== "string" && !isNumber(label)) return `${path}.categories[${index}]: expected a string`;
+	}
+	if (!Array.isArray(node.series) || node.series.length === 0) return `${path}.series: expected a non-empty array of { name?, values }`;
+	if (node.kind === "donut" && node.series.length > 1) return `${path}.series: a donut takes one series; got ${node.series.length}`;
+	for (let index = 0; index < node.series.length; index += 1) {
+		const series = node.series[index];
+		const at = `${path}.series[${index}]`;
+		if (!isRecord$1(series)) return `${at}: expected a series object`;
+		for (const key of Object.keys(series)) if (key !== "name" && key !== "values") return `${at}.${key}: unknown property ${quoted(key)}; allowed: name, values`;
+		if (series.name !== void 0 && typeof series.name !== "string") return `${at}.name: expected a string`;
+		if (!Array.isArray(series.values)) return `${at}.values: expected an array of numbers`;
+		if (series.values.length !== node.categories.length) return `${at}.values: ${series.values.length} values for ${node.categories.length} categories`;
+		for (let item = 0; item < series.values.length; item += 1) {
+			const value = series.values[item];
+			if (isFormula(value)) ctx.formulas.push({
+				source: value["="],
+				path: `${at}.values[${item}]`,
+				kind: "number"
+			});
+			else if (!isNumber(value)) return `${at}.values[${item}]: expected a number`;
+		}
+	}
+	if (node.unit !== void 0 && typeof node.unit !== "string") return `${path}.unit: expected a string`;
+	if (node.caption !== void 0 && typeof node.caption !== "string") return `${path}.caption: expected a string`;
+}
+function checkProgress(node, path, ctx) {
+	if (node.label !== void 0 && typeof node.label !== "string") return `${path}.label: expected a string`;
+	if (node.percent === void 0 === (node.value === void 0)) return `${path}: give percent (0 to 100), or value with max`;
+	if (node.percent !== void 0 && !isFormula(node.percent)) {
+		if (typeof node.percent !== "number" || !Number.isFinite(node.percent) || node.percent < 0 || node.percent > 100) return `${path}.percent: expected a number from 0 to 100`;
+	}
+	if (node.value !== void 0 && node.max === void 0) return `${path}.max: expected a number with value`;
+	if (node.value === void 0 && node.max !== void 0) return `${path}.value: expected a number with max`;
+	return checkValue(node, "percent", path, ctx, "number") ?? checkValue(node, "value", path, ctx, "number") ?? checkValue(node, "max", path, ctx, "number") ?? checkValue(node, "valueLabel", path, ctx, "scalar") ?? checkValue(node, "tone", path, ctx, TONES$1);
+}
+function checkCallout(node, path, ctx) {
+	return checkValue(node, "text", path, ctx, "string", { required: true }) ?? checkValue(node, "tone", path, ctx, CALLOUT_TONES$1);
+}
+function checkSources(node, path) {
+	if (!Array.isArray(node.items) || node.items.length === 0) return `${path}.items: expected a non-empty array of { label, url }`;
+	for (let index = 0; index < node.items.length; index += 1) {
+		const item = node.items[index];
+		const at = `${path}.items[${index}]`;
+		if (!isRecord$1(item)) return `${at}: expected a { label, url } object`;
+		for (const key of Object.keys(item)) if (key !== "label" && key !== "url") return `${at}.${key}: unknown property ${quoted(key)}; allowed: label, url`;
+		if (typeof item.label !== "string" || item.label.trim() === "") return `${at}.label: expected a non-empty string`;
+		if (typeof item.url !== "string" || !/^https?:\/\/[^\s]+$/i.test(item.url)) return `${at}.url: expected an http(s) address`;
+	}
+}
+function checkInputId(node, path, ctx) {
+	if (!isName(node.id) || RESERVED.has(node.id)) return `${path}.id: an input id is letters, digits and _, and starts with a letter or _, so formulas can use it`;
+	if (ctx.ids.has(node.id)) return `${path}.id: duplicate id ${quoted(node.id)}`;
+	ctx.ids.add(node.id);
+	if (typeof node.label !== "string") return `${path}.label: expected a string`;
+}
+function checkNumberInput(node, path, ctx) {
+	const idError = checkInputId(node, path, ctx);
+	if (idError !== void 0) return idError;
+	for (const key of [
+		"min",
+		"max",
+		"step"
+	]) if (node[key] !== void 0 && !isNumber(node[key])) return `${path}.${key}: expected a number`;
+	if (node.type === "slider" && (node.min === void 0 || node.max === void 0)) return `${path}: a slider needs min and max`;
+	if (node.min !== void 0 && node.max !== void 0 && node.max <= node.min) return `${path}.max: expected more than min (${node.min})`;
+	if (node.step !== void 0 && node.step <= 0) return `${path}.step: expected more than 0`;
+	if (!isNumber(node.value)) return `${path}.value: expected a number`;
+	if (node.min !== void 0 && node.value < node.min || node.max !== void 0 && node.value > node.max) return `${path}.value: expected a number from ${node.min ?? "-∞"} to ${node.max ?? "∞"}`;
+	if (node.unit !== void 0 && typeof node.unit !== "string") return `${path}.unit: expected a string`;
+	ctx.inputs.set(node.id, node.value);
+}
+function checkChoice(node, path, ctx) {
+	const idError = checkInputId(node, path, ctx);
+	if (idError !== void 0) return idError;
+	if (!Array.isArray(node.options) || node.options.length === 0) return `${path}.options: expected a non-empty array of { label, value }`;
+	const labels = /* @__PURE__ */ new Set();
+	const values = /* @__PURE__ */ new Set();
+	for (let index = 0; index < node.options.length; index += 1) {
+		const option = node.options[index];
+		const at = `${path}.options[${index}]`;
+		if (!isRecord$1(option)) return `${at}: expected a { label, value } object`;
+		for (const key of Object.keys(option)) if (key !== "label" && key !== "value") return `${at}.${key}: unknown property ${quoted(key)}; allowed: label, value`;
+		if (typeof option.label !== "string" || option.label.trim() === "") return `${at}.label: expected a non-empty string`;
+		if (labels.has(option.label)) return `${at}.label: duplicate label ${quoted(option.label)}`;
+		labels.add(option.label);
+		const value = option.value ?? option.label;
+		if (!isScalar(value)) return `${at}.value: expected a string, a number or true/false`;
+		if (values.has(value)) return `${at}.value: duplicate value ${quoted(value)}`;
+		values.add(value);
+	}
+	const chosen = node.value ?? choiceValue(node.options[0]);
+	if (!values.has(chosen)) return `${path}.value: expected one of the options' values`;
+	ctx.inputs.set(node.id, chosen);
+}
+function checkToggle(node, path, ctx) {
+	const idError = checkInputId(node, path, ctx);
+	if (idError !== void 0) return idError;
+	if (node.value !== void 0 && typeof node.value !== "boolean") return `${path}.value: expected true or false`;
+	ctx.inputs.set(node.id, node.value === true);
+}
+function checkOptions(node, path, ctx) {
+	const idError = checkId(node, path, ctx);
+	if (idError !== void 0) return idError;
+	if (node.multi !== void 0 && typeof node.multi !== "boolean") return `${path}.multi: expected a boolean`;
+	if (!Array.isArray(node.options)) return `${path}.options: expected an array of 1 to ${MAX_OPTIONS} options`;
+	if (node.options.length < 1 || node.options.length > MAX_OPTIONS) return `${path}.options: expected 1 to ${MAX_OPTIONS} options; got ${node.options.length}`;
+	const labels = /* @__PURE__ */ new Set();
+	for (let index = 0; index < node.options.length; index += 1) {
+		const option = node.options[index];
+		const at = `${path}.options[${index}]`;
+		if (!isRecord$1(option)) return `${at}: expected an option object`;
+		for (const key of Object.keys(option)) if (key !== "label" && key !== "description") return `${at}.${key}: unknown property ${quoted(key)}; allowed: label, description`;
+		if (typeof option.label !== "string" || option.label.trim() === "") return `${at}.label: expected a non-empty string`;
+		if (labels.has(option.label)) return `${at}.label: duplicate label ${quoted(option.label)}`;
+		labels.add(option.label);
+		if (option.description !== void 0 && typeof option.description !== "string") return `${at}.description: expected a string`;
+	}
+}
+function checkConfirm(node, path, ctx) {
+	const idError = checkId(node, path, ctx);
+	if (idError !== void 0) return idError;
+	if (node.confirmLabel !== void 0 && typeof node.confirmLabel !== "string") return `${path}.confirmLabel: expected a string`;
+	if (node.cancelLabel !== void 0 && typeof node.cancelLabel !== "string") return `${path}.cancelLabel: expected a string`;
+}
+function checkForm(node, path, ctx) {
+	const idError = checkId(node, path, ctx);
+	if (idError !== void 0) return idError;
+	if (node.submitLabel !== void 0 && typeof node.submitLabel !== "string") return `${path}.submitLabel: expected a string`;
+	if (!Array.isArray(node.fields)) return `${path}.fields: expected an array of at most ${MAX_FIELDS} fields`;
+	if (node.fields.length > MAX_FIELDS) return `${path}.fields: ${node.fields.length} fields exceeds the limit of ${MAX_FIELDS}`;
+	const seen = /* @__PURE__ */ new Set();
+	for (let index = 0; index < node.fields.length; index += 1) {
+		const field = node.fields[index];
+		const at = `${path}.fields[${index}]`;
+		if (!isRecord$1(field)) return `${at}: expected a field object`;
+		for (const key of Object.keys(field)) if (key !== "id" && key !== "label" && key !== "placeholder") return `${at}.${key}: unknown property ${quoted(key)}; allowed: id, label, placeholder`;
+		if (typeof field.id !== "string" || field.id === "") return `${at}.id: expected a non-empty string`;
+		if (field.id === "__proto__") return `${at}.id: "__proto__" cannot be an id`;
+		if (seen.has(field.id)) return `${at}.id: duplicate field id ${quoted(field.id)}`;
+		seen.add(field.id);
+		if (typeof field.label !== "string") return `${at}.label: expected a string`;
+		if (field.placeholder !== void 0 && typeof field.placeholder !== "string") return `${at}.placeholder: expected a string`;
+	}
+}
+function checkSubmit(node, path, ctx) {
+	const idError = checkId(node, path, ctx);
+	if (idError !== void 0) return idError;
+	if (node.label !== void 0 && typeof node.label !== "string") return `${path}.label: expected a string`;
+}
+function checkId(node, path, ctx) {
+	if (typeof node.id !== "string" || node.id === "") return `${path}.id: expected a non-empty string`;
+	if (node.id === "__proto__") return `${path}.id: "__proto__" cannot be an id`;
+	if (ctx.ids.has(node.id)) return `${path}.id: duplicate id ${quoted(node.id)}`;
+	ctx.ids.add(node.id);
+}
+function checkFormulas(ctx) {
+	const known = /* @__PURE__ */ new Set([...ctx.inputs.keys(), ...ctx.lets.keys()]);
+	const lets = /* @__PURE__ */ new Map();
+	for (const [name, entry] of ctx.lets) {
+		if (ctx.inputs.has(name)) return `${entry.path}: ${quoted(name)} is already an input id`;
+		const compiled = compileFormula(entry.source);
+		if (compiled.error !== void 0) return `${entry.path}: ${compiled.error}`;
+		const unknown = compiled.names.find((item) => !known.has(item));
+		if (unknown !== void 0) return `${entry.path}: unknown name ${quoted(unknown)}; known: ${allowed([...known]) || "(none)"}`;
+		lets.set(name, compiled.tree);
+	}
+	const lookup = createScope(ctx.inputs, lets);
+	for (const [name, entry] of ctx.lets) {
+		const result = evaluate(lets.get(name), lookup);
+		if (result.error !== void 0) return `${entry.path}: ${result.error}`;
+	}
+	for (const formula of ctx.formulas) {
+		const compiled = compileFormula(formula.source);
+		if (compiled.error !== void 0) return `${formula.path}: ${compiled.error}`;
+		const unknown = compiled.names.find((item) => !known.has(item));
+		if (unknown !== void 0) return `${formula.path}: unknown name ${quoted(unknown)}; known: ${allowed([...known]) || "(none)"}`;
+		const result = evaluate(compiled.tree, lookup);
+		if (result.error !== void 0) return `${formula.path}: ${result.error}`;
+		const problem = kindProblem(result.value, formula.kind);
+		if (problem !== void 0) return `${formula.path}: the formula gives ${quoted(result.value)}; ${problem}`;
+	}
+}
+function kindProblem(value, kind) {
+	if (kind === "number") return isNumber(value) ? void 0 : "expected a number";
+	if (Array.isArray(kind)) return kind.includes(value) ? void 0 : `expected one of ${allowed(kind)}`;
+	if (kind === "string") return isScalar(value) ? void 0 : "expected text";
+	return isScalar(value) ? void 0 : "expected a string or a number";
+}
+function cellText$1(value) {
+	if (typeof value === "string") return value;
+	const text = JSON.stringify(value);
+	return typeof text === "string" ? text : "";
+}
+const compiled = /* @__PURE__ */ new WeakMap();
+const treeOf = (formula) => {
+	let entry = compiled.get(formula);
+	if (entry === void 0) {
+		entry = compileFormula(formula["="]);
+		compiled.set(formula, entry);
+	}
+	return entry;
+};
+const choiceValue = (option) => option?.value ?? option?.label;
+function walk(node, visit) {
+	if (!isRecord$1(node)) return;
+	visit(node);
+	if (LAYOUT.includes(node.type) && Array.isArray(node.children)) for (const child of node.children) walk(child, visit);
+}
+function viewInputs(view) {
+	const found = [];
+	walk(view, (node) => {
+		if (INPUTS.has(node.type)) found.push(node);
+	});
+	return found;
+}
+function inputDefault(node) {
+	if (node.type === "toggle") return node.value === true;
+	if (node.type === "choice") return node.value ?? choiceValue(Array.isArray(node.options) ? node.options[0] : void 0);
+	return node.value;
+}
+function viewScope(view, values = {}) {
+	const inputs = /* @__PURE__ */ new Map();
+	for (const node of viewInputs(view)) inputs.set(node.id, Object.hasOwn(values, node.id) ? values[node.id] : inputDefault(node));
+	const lets = /* @__PURE__ */ new Map();
+	for (const [name, source] of Object.entries(isRecord$1(view?.let) ? view.let : {})) {
+		const entry = compileFormula(source);
+		if (entry.tree !== void 0) lets.set(name, entry.tree);
+	}
+	return createScope(inputs, lets);
+}
+function resolve(value, lookup, fallback = void 0) {
+	if (!isFormula(value)) return value;
+	const entry = treeOf(value);
+	if (entry.tree === void 0) return fallback;
+	const result = evaluate(entry.tree, lookup);
+	return result.error === void 0 ? result.value : fallback;
+}
+const asText = (value) => value === void 0 || value === null ? "" : show(value);
+const choiceLabel = (node, value) => (Array.isArray(node.options) ? node.options : []).find((option) => choiceValue(option) === value)?.label ?? asText(value);
+function inputText(node, value) {
+	if (node.type === "toggle") return value === true ? "on" : "off";
+	if (node.type === "choice") return choiceLabel(node, value);
+	return `${asText(value)}${node.unit ? ` ${node.unit}` : ""}`;
+}
+function inputsSummary(view, inputs) {
+	if (!isRecord$1(inputs)) return "";
+	return viewInputs(view).filter((node) => Object.hasOwn(inputs, node.id)).map((node) => `${node.label || node.id}=${inputText(node, inputs[node.id])}`).join("; ");
+}
+function interactiveNodes(node, found = []) {
+	walk(node, (item) => {
+		if (INTERACTIVE.has(item.type)) found.push(item);
+	});
+	return found;
+}
+function validateViewAnswer(view, action, values) {
+	const nodes = interactiveNodes(view);
+	if (typeof action !== "string" || action === "") return { error: `action: expected an interactive component id; allowed: ${allowed(nodes.map((node) => node.id))}` };
+	const node = nodes.find((item) => item.id === action);
+	if (node === void 0) return { error: `action: no interactive component with id ${quoted(action)}; allowed: ${allowed(nodes.map((item) => item.id))}` };
+	if (!isRecord$1(values)) return { error: "values: expected an object" };
+	const inputs = validateInputs(view, values.inputs);
+	if (inputs.error !== void 0) return inputs;
+	const extra = inputs.inputs === void 0 ? {} : { inputs: inputs.inputs };
+	if (node.type === "submit") return { ...extra };
+	const own = node.type === "options" ? validateOptions(node, values) : node.type === "confirm" ? validateConfirm(values) : validateForm(node, values);
+	return own.error === void 0 ? {
+		...own,
+		...extra
+	} : own;
+}
+function validateInputs(view, sent) {
+	const nodes = viewInputs(view);
+	if (nodes.length === 0) return sent === void 0 ? {} : { error: "values.inputs: this view has no inputs" };
+	if (sent !== void 0 && !isRecord$1(sent)) return { error: "values.inputs: expected an object of input ids to values" };
+	const given = sent ?? {};
+	const ids = nodes.map((node) => node.id);
+	const unknown = Object.keys(given).find((key) => !ids.includes(key));
+	if (unknown !== void 0) return { error: `values.inputs.${unknown}: unknown input; allowed: ${allowed(ids)}` };
+	const inputs = {};
+	for (const node of nodes) {
+		const value = Object.hasOwn(given, node.id) ? given[node.id] : inputDefault(node);
+		const at = `values.inputs.${node.id}`;
+		if (node.type === "toggle" && typeof value !== "boolean") return { error: `${at}: expected true or false` };
+		if (node.type === "choice" && !(Array.isArray(node.options) ? node.options : []).some((option) => choiceValue(option) === value)) return { error: `${at}: expected one of the options' values` };
+		if (node.type === "slider" || node.type === "number") {
+			if (!isNumber(value)) return { error: `${at}: expected a number` };
+			if (node.min !== void 0 && value < node.min || node.max !== void 0 && value > node.max) return { error: `${at}: expected a number from ${node.min ?? "-∞"} to ${node.max ?? "∞"}` };
+		}
+		inputs[node.id] = value;
+	}
+	return { inputs };
+}
+function validateOptions(node, values) {
+	if (!Array.isArray(values.selected)) return { error: "values.selected: expected an array of option labels" };
+	const labels = new Set((node.options ?? []).map((option) => option?.label));
+	const picked = values.selected.filter((label) => typeof label === "string" && labels.has(label));
+	const selected = node.multi === true ? [...new Set(picked)] : picked.slice(0, 1);
+	if (selected.length === 0) return { error: "values.selected: select at least one option" };
+	return { selected };
+}
+function validateConfirm(values) {
+	if (typeof values.confirmed !== "boolean") return { error: "values.confirmed: expected a boolean" };
+	return { confirmed: values.confirmed };
+}
+function validateForm(node, values) {
+	if (!isRecord$1(values.fields)) return { error: "values.fields: expected an object of field ids to strings" };
+	const declared = (node.fields ?? []).map((field) => field?.id).filter((id) => typeof id === "string");
+	const allowedIds = new Set(declared);
+	const fields = {};
+	for (const [key, value] of Object.entries(values.fields)) {
+		if (!allowedIds.has(key)) return { error: `values.fields.${key}: unknown field; allowed: ${allowed(declared)}` };
+		if (typeof value !== "string") return { error: `values.fields.${key}: expected a string` };
+		if (value.length > MAX_TEXT) return { error: `values.fields.${key}: ${value.length} characters exceeds the limit of ${MAX_TEXT}` };
+		fields[key] = value;
+	}
+	return { fields };
+}
+//#endregion
+//#region src/contracts.ts
+const PLUGIN_NAME = "@klarkxy/dsh-deep-view";
+const RPC_CHANNEL = "/dsh-deep-view";
+const VIEW_OWNER = "dsh-deep-view";
+function isRecord(value) {
+	return value !== null && typeof value === "object" && !Array.isArray(value);
+}
+//#endregion
+//#region src/ui.tsx
+const english = (key, params) => key.replace(/\{(\w+)\}/g, (_, name) => String(params?.[name] ?? `{${name}}`));
+function LineIcon({ paths }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+		width: "15",
+		height: "15",
+		viewBox: "0 0 20 20",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "1.5",
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		children: paths.map((d, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d }, index))
+	});
+}
+const DotsIcon = () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LineIcon, { paths: ["M5 10h.01M10 10h.01M15 10h.01"] });
+const CheckIcon = () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LineIcon, { paths: ["M4.5 10.5l3.5 3.5 7.5-8"] });
+const CopyIcon = () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LineIcon, { paths: ["M8.5 7h6A1.5 1.5 0 0 1 16 8.5v6a1.5 1.5 0 0 1-1.5 1.5h-6A1.5 1.5 0 0 1 7 14.5v-6A1.5 1.5 0 0 1 8.5 7z", "M4 12.5V5.5A1.5 1.5 0 0 1 5.5 4H13"] });
+const TableIcon = () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LineIcon, { paths: ["M4.5 4h11A1.5 1.5 0 0 1 17 5.5v9a1.5 1.5 0 0 1-1.5 1.5h-11A1.5 1.5 0 0 1 3 14.5v-9A1.5 1.5 0 0 1 4.5 4z", "M3 8.5h14M8 8.5V16"] });
+const InfoIcon = () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LineIcon, { paths: [
+	"M10 3.5a6.5 6.5 0 1 1 0 13 6.5 6.5 0 0 1 0-13z",
+	"M10 9.25v4",
+	"M10 6.6h.01"
+] });
+const LinkIcon = () => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+	width: "12",
+	height: "12",
+	viewBox: "0 0 20 20",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.8",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	"aria-hidden": "true",
+	children: [
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8.5 11.5l3-3" }),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M7 9.5L5.5 11a2.5 2.5 0 0 0 3.5 3.5L10.5 13" }),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M13 10.5l1.5-1.5A2.5 2.5 0 0 0 11 5.5L9.5 7" })
+	]
+});
+const keyLetter = (index) => String.fromCharCode(65 + index);
+function Segmented({ label, value, className, children }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: className ? `dvui-seg ${className}` : "dvui-seg",
+		role: "group",
+		"aria-label": label,
+		"data-active": value,
+		children
+	});
+}
+//#endregion
+//#region src/chart.tsx
+const PALETTE = [
+	"var(--dsw-alias-state-business-primary)",
+	"var(--dsw-alias-brand-primary)",
+	"var(--dsw-alias-state-success-primary)",
+	"var(--dsw-alias-state-warn-primary)",
+	"var(--dsw-alias-state-error-primary)"
+];
+const colorAt = (index) => PALETTE[index % PALETTE.length];
+const TICK = 10;
+const LABEL = 11;
+const textWidth = (text, size) => [...String(text)].reduce((sum, char) => sum + (char.charCodeAt(0) > 11904 ? size : size * .58), 0);
+const fit = (text, room, size) => {
+	if (textWidth(text, size) <= room) return String(text);
+	let out = "";
+	for (const char of String(text)) {
+		if (textWidth(`${out}${char}…`, size) > room) break;
+		out += char;
+	}
+	return out === "" ? "" : `${out}…`;
+};
+function formatNumber(value) {
+	if (!Number.isFinite(value)) return asText(value);
+	const abs = Math.abs(value);
+	const digits = abs >= 100 ? 0 : abs >= 10 ? 1 : 2;
+	return Number(value.toFixed(digits)).toLocaleString("en-US", { maximumFractionDigits: digits });
+}
+const withUnit$1 = (value, unit) => unit ? unit === "%" ? `${formatNumber(value)}%` : `${formatNumber(value)} ${unit}` : formatNumber(value);
+function niceTicks(low, high) {
+	let lo = low;
+	let hi = high;
+	if (lo === hi) {
+		lo = Math.min(0, lo);
+		hi = hi === 0 ? 1 : Math.max(0, hi);
+	}
+	if (lo === hi) hi = lo + 1;
+	const raw = (hi - lo) / 4;
+	const magnitude = 10 ** Math.floor(Math.log10(raw));
+	const step = [
+		1,
+		2,
+		2.5,
+		5,
+		10
+	].map((scale) => scale * magnitude).find((candidate) => candidate >= raw);
+	const start = Math.floor(lo / step + 1e-9) * step;
+	const end = Math.ceil(hi / step - 1e-9) * step;
+	const ticks = [];
+	for (let value = start; value <= end + step / 2; value += step) ticks.push(Number(value.toPrecision(12)));
+	return ticks;
+}
+function chartData(node, lookup) {
+	const categories = (Array.isArray(node.categories) ? node.categories : []).map(asText);
+	const series = (Array.isArray(node.series) ? node.series : []).map((item, index) => ({
+		name: typeof item?.name === "string" ? item.name : "",
+		color: colorAt(index),
+		values: categories.map((_, at) => {
+			const value = Number(resolve(Array.isArray(item?.values) ? item.values[at] : void 0, lookup, 0));
+			return Number.isFinite(value) ? value : 0;
+		})
+	}));
+	return {
+		kind: node.kind ?? "bar",
+		categories,
+		series,
+		unit: typeof node.unit === "string" ? node.unit : ""
+	};
+}
+const csvCell = (value) => /[",\n]/.test(value) ? `"${value.replace(/"/g, "\"\"")}"` : value;
+function chartCsv({ categories, series, unit }, t = english) {
+	return [["", ...series.map((item, index) => item.name || (series.length === 1 ? unit || t("Value") : `${t("Series")} ${index + 1}`))], ...categories.map((label, at) => [label, ...series.map((item) => String(item.values[at]))])].map((row) => row.map((cell) => csvCell(String(cell))).join(",")).join("\n");
+}
+function valueAxis(values, zero) {
+	const finite = values.length > 0 ? values : [0];
+	const low = Math.min(...finite);
+	const high = Math.max(...finite);
+	if (zero) return niceTicks(Math.min(0, low), Math.max(0, high));
+	const pad = (high - low) * .1 || Math.abs(high) * .1 || 1;
+	return niceTicks(low - pad, high + pad);
+}
+function columns({ categories, series, unit, kind }, width, active, shown) {
+	const visible = series.filter((_, index) => shown[index]);
+	const ticks = valueAxis(visible.flatMap((item) => item.values), kind !== "line");
+	const lo = ticks[0];
+	const hi = ticks.at(-1);
+	const left = Math.ceil(Math.max(...ticks.map((tick) => textWidth(withUnit$1(tick, unit), TICK)))) + 10;
+	const top = 8;
+	const height = 220;
+	const plot = {
+		x: left,
+		y: top,
+		w: Math.max(40, width - left - 4),
+		h: 188
+	};
+	const y = (value) => plot.y + plot.h - (value - lo) / (hi - lo) * plot.h;
+	const band = plot.w / categories.length;
+	const parts = [];
+	for (const tick of ticks) {
+		parts.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
+			className: "dvui-chart-grid",
+			x1: plot.x,
+			x2: plot.x + plot.w,
+			y1: y(tick),
+			y2: y(tick)
+		}, `g${tick}`));
+		parts.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+			className: "dvui-chart-tick",
+			x: plot.x - 8,
+			y: y(tick) + 3,
+			textAnchor: "end",
+			children: withUnit$1(tick, unit)
+		}, `t${tick}`));
+	}
+	const points = [];
+	categories.forEach((label, at) => {
+		const cx = plot.x + band * at + band / 2;
+		parts.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+			className: "dvui-chart-label",
+			x: cx,
+			y: 213,
+			textAnchor: "middle",
+			children: fit(label, band - 4, LABEL)
+		}, `c${at}`));
+		points.push({
+			x: cx,
+			y: y(Math.max(...visible.map((item) => item.values[at]), lo))
+		});
+	});
+	if (kind === "bar") {
+		const group = band * .72;
+		const gap = visible.length > 1 ? 2 : 0;
+		const barW = Math.max(2, (group - gap * (visible.length - 1)) / visible.length);
+		const zero = y(Math.max(lo, Math.min(0, hi)));
+		categories.forEach((_, at) => visible.forEach((item, row) => {
+			const value = item.values[at];
+			const x = plot.x + band * at + (band - group) / 2 + row * (barW + gap);
+			const top2 = Math.min(y(value), zero);
+			const tall = Math.max(1, Math.abs(y(value) - zero));
+			const r = Math.min(4, barW / 2, tall);
+			const d = value >= 0 ? `M${x},${top2 + tall}V${top2 + r}q0,-${r} ${r},-${r}h${barW - 2 * r}q${r},0 ${r},${r}V${top2 + tall}z` : `M${x},${top2}V${top2 + tall - r}q0,${r} ${r},${r}h${barW - 2 * r}q${r},0 ${r},-${r}V${top2}z`;
+			parts.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+				className: "dvui-chart-mark",
+				"data-dim": active !== null && active !== at ? "" : void 0,
+				d,
+				style: { fill: item.color }
+			}, `b${at}-${row}`));
+		}));
+	} else {
+		const xs = categories.map((_, at) => plot.x + band * at + band / 2);
+		visible.forEach((item, row) => {
+			const line = item.values.map((value, at) => `${at === 0 ? "M" : "L"}${xs[at]},${y(value)}`).join("");
+			if (kind === "area") {
+				const base = y(Math.max(lo, Math.min(0, hi)));
+				parts.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+					className: "dvui-chart-area",
+					d: `${line}L${xs.at(-1)},${base}L${xs[0]},${base}z`,
+					style: { fill: item.color }
+				}, `a${row}`));
+			}
+			parts.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+				className: "dvui-chart-line",
+				d: line,
+				style: { stroke: item.color }
+			}, `l${row}`));
+			item.values.forEach((value, at) => parts.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+				className: "dvui-chart-dot",
+				cx: xs[at],
+				cy: y(value),
+				r: active === at ? 4 : 2.5,
+				style: { fill: item.color }
+			}, `p${row}-${at}`)));
+		});
+		if (active !== null) parts.unshift(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
+			className: "dvui-chart-guide",
+			x1: xs[active],
+			x2: xs[active],
+			y1: plot.y,
+			y2: plot.y + plot.h
+		}, "guide"));
+	}
+	return {
+		parts,
+		height,
+		points,
+		hits: categories.map((_, at) => ({
+			x: plot.x + band * at,
+			y: plot.y,
+			w: band,
+			h: plot.h
+		}))
+	};
+}
+function rows({ categories, series, unit }, width, active, shown) {
+	const visible = series.filter((_, index) => shown[index]);
+	const ticks = valueAxis(visible.flatMap((item) => item.values), true);
+	const lo = ticks[0];
+	const hi = ticks.at(-1);
+	const labelW = Math.min(width * .38, Math.ceil(Math.max(...categories.map((label) => textWidth(label, LABEL)))) + 10);
+	const valueW = Math.ceil(Math.max(...visible.flatMap((item) => item.values).map((value) => textWidth(withUnit$1(value, unit), LABEL)))) + 10;
+	const barH = 14;
+	const rowH = 10 + visible.length * barH + (visible.length - 1) * 2;
+	const top = 4;
+	const height = top + rowH * categories.length + 22;
+	const plot = {
+		x: labelW,
+		y: top,
+		w: Math.max(40, width - labelW - valueW),
+		h: rowH * categories.length
+	};
+	const x = (value) => plot.x + (value - lo) / (hi - lo) * plot.w;
+	const parts = [];
+	for (const tick of ticks) {
+		parts.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("line", {
+			className: "dvui-chart-grid",
+			x1: x(tick),
+			x2: x(tick),
+			y1: plot.y,
+			y2: plot.y + plot.h
+		}, `g${tick}`));
+		parts.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+			className: "dvui-chart-tick",
+			x: x(tick),
+			y: height - 6,
+			textAnchor: "middle",
+			children: withUnit$1(tick, unit)
+		}, `t${tick}`));
+	}
+	const points = [];
+	const zero = x(Math.max(lo, Math.min(0, hi)));
+	categories.forEach((label, at) => {
+		const rowY = plot.y + rowH * at + 5;
+		parts.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+			className: "dvui-chart-label",
+			x: labelW - 10,
+			y: rowY + (rowH - 10) / 2 + 4,
+			textAnchor: "end",
+			children: fit(label, labelW - 12, LABEL)
+		}, `c${at}`));
+		visible.forEach((item, row) => {
+			const value = item.values[at];
+			const by = rowY + row * 16;
+			const left = Math.min(x(value), zero);
+			const long = Math.max(1, Math.abs(x(value) - zero));
+			parts.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+				className: "dvui-chart-mark",
+				"data-dim": active !== null && active !== at ? "" : void 0,
+				x: left,
+				y: by,
+				width: long,
+				height: barH,
+				rx: Math.min(4, long / 2),
+				style: { fill: item.color }
+			}, `b${at}-${row}`));
+			parts.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+				className: "dvui-chart-value",
+				x: left + long + 6,
+				y: by + barH - 3,
+				children: withUnit$1(value, unit)
+			}, `v${at}-${row}`));
+		});
+		points.push({
+			x: Math.max(...visible.map((item) => x(item.values[at])), zero),
+			y: rowY
+		});
+	});
+	return {
+		parts,
+		height,
+		points,
+		hits: categories.map((_, at) => ({
+			x: 0,
+			y: plot.y + rowH * at,
+			w: width,
+			h: rowH
+		}))
+	};
+}
+function donut({ categories, series }, width, active, hover) {
+	const values = (series[0]?.values ?? []).map((value) => Math.max(0, value));
+	const total = values.reduce((sum, value) => sum + value, 0);
+	const size = Math.min(180, Math.max(120, width * .42));
+	const r = size / 2;
+	const inner = r * .62;
+	const cx = r;
+	const cy = r;
+	const parts = [];
+	const points = [];
+	let angle = -Math.PI / 2;
+	values.forEach((value, at) => {
+		const sweep = total > 0 ? value / total * Math.PI * 2 : 0;
+		const end = angle + sweep;
+		const mid = angle + sweep / 2;
+		points.push({
+			x: cx + Math.cos(mid) * (r - (r - inner) / 2),
+			y: cy + Math.sin(mid) * (r - (r - inner) / 2)
+		});
+		if (sweep > 0) {
+			const large = sweep > Math.PI ? 1 : 0;
+			const full = sweep >= Math.PI * 2 - 1e-6;
+			const p = (radius, theta) => `${cx + Math.cos(theta) * radius},${cy + Math.sin(theta) * radius}`;
+			const d = full ? `M${p(r, angle)}A${r},${r} 0 1 1 ${p(r, angle + Math.PI)}A${r},${r} 0 1 1 ${p(r, angle)}M${p(inner, angle)}A${inner},${inner} 0 1 0 ${p(inner, angle + Math.PI)}A${inner},${inner} 0 1 0 ${p(inner, angle)}z` : `M${p(r, angle)}A${r},${r} 0 ${large} 1 ${p(r, end)}L${p(inner, end)}A${inner},${inner} 0 ${large} 0 ${p(inner, angle)}z`;
+			parts.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+				className: "dvui-chart-mark",
+				"data-dim": active !== null && active !== at ? "" : void 0,
+				d,
+				fillRule: "evenodd",
+				style: { fill: colorAt(at) },
+				onPointerEnter: () => hover(at)
+			}, `s${at}`));
+		}
+		angle = end;
+	});
+	return {
+		parts,
+		height: size,
+		size,
+		points,
+		total,
+		values,
+		hits: []
+	};
+}
+function useWidth(box, initial) {
+	const [width, setWidth] = (0, react.useState)(initial);
+	(0, react.useLayoutEffect)(() => {
+		const node = box.current;
+		if (!node || typeof ResizeObserver !== "function") return void 0;
+		const measure = () => {
+			const next = Math.round(node.clientWidth);
+			if (next > 0) setWidth(next);
+		};
+		measure();
+		const observer = new ResizeObserver(measure);
+		observer.observe(node);
+		return () => observer.disconnect();
+	}, [box]);
+	return width;
+}
+function ChartTable({ data, t = english }) {
+	const { categories, series, unit } = data;
+	const heads = series.map((item, index) => item.name || (series.length === 1 ? unit || t("Value") : `${t("Series")} ${index + 1}`));
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "dvui-table",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("table", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("thead", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("tr", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("th", { scope: "col" }), heads.map((head, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("th", {
+			scope: "col",
+			className: "dvui-num",
+			children: head
+		}, index))] }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tbody", { children: categories.map((label, at) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("tr", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("th", {
+			scope: "row",
+			children: label
+		}), series.map((item, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("td", {
+			className: "dvui-num",
+			children: withUnit$1(item.values[at], series.length === 1 && !item.name ? "" : unit)
+		}, index))] }, `${at}-${label}`)) })] })
+	});
+}
+function WidgetChart({ node, lookup, registerChart, refreshCharts, t = english }) {
+	const data = chartData(node, lookup);
+	const { kind, categories, series, unit } = data;
+	const box = (0, react.useRef)(null);
+	const width = useWidth(box, 520);
+	const [active, setActive] = (0, react.useState)(null);
+	const [hidden, setHidden] = (0, react.useState)([]);
+	const [asTable, setAsTable] = (0, react.useState)(false);
+	const [copied, setCopied] = (0, react.useState)(false);
+	const labelId = (0, react.useId)();
+	const menuKey = (0, react.useId)();
+	const table = (0, react.useRef)(asTable);
+	table.current = asTable;
+	const shown = series.map((_, index) => !hidden.includes(index));
+	const label = typeof node.caption === "string" && node.caption !== "" ? node.caption : t("Chart");
+	const isDonut = kind === "donut";
+	const legendBeside = isDonut && width >= 360;
+	const drawn = isDonut ? donut(data, legendBeside ? width - 200 : width, active, setActive) : kind === "hbar" ? rows(data, width, active, shown) : columns(data, width, active, shown);
+	const svgWidth = isDonut ? drawn.size : width;
+	const move = (event) => {
+		const keys = {
+			ArrowRight: 1,
+			ArrowDown: 1,
+			ArrowLeft: -1,
+			ArrowUp: -1
+		};
+		if (event.key === "Escape") {
+			setActive(null);
+			return;
+		}
+		if (keys[event.key] === void 0) return;
+		event.preventDefault();
+		setActive((current) => current === null ? 0 : (current + keys[event.key] + categories.length) % categories.length);
+	};
+	const point = active === null ? null : drawn.points[active];
+	const share = (at) => unit === "%" ? withUnit$1(drawn.values[at], unit) : `${withUnit$1(drawn.values[at], unit)} · ${drawn.total > 0 ? Math.round(drawn.values[at] / drawn.total * 100) : 0}%`;
+	const tipRows = active === null || isDonut ? [] : series.filter((_, index) => shown[index]).map((item) => ({
+		color: item.color,
+		name: item.name,
+		value: withUnit$1(item.values[active], unit)
+	}));
+	const copy = () => {
+		navigator.clipboard?.writeText(chartCsv(data, t)).then(() => {
+			setCopied(true);
+			setTimeout(() => setCopied(false), 1200);
+		}).catch(() => {});
+	};
+	const toggleTable = () => {
+		table.current = !table.current;
+		setAsTable(table.current);
+	};
+	const action = (0, react.useRef)({
+		label: null,
+		asTable: false,
+		toggleTable,
+		copy
+	});
+	action.current = {
+		label: typeof node.caption === "string" && node.caption !== "" ? node.caption : null,
+		get asTable() {
+			return table.current;
+		},
+		toggleTable,
+		copy
+	};
+	(0, react.useLayoutEffect)(() => registerChart?.(menuKey, {
+		get label() {
+			return action.current.label;
+		},
+		get asTable() {
+			return action.current.asTable;
+		},
+		toggleTable: () => action.current.toggleTable(),
+		copy: () => action.current.copy()
+	}), [registerChart, menuKey]);
+	(0, react.useLayoutEffect)(() => {
+		refreshCharts?.();
+	}, [
+		refreshCharts,
+		asTable,
+		label
+	]);
+	const legend = isDonut ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "dvui-chart-legend dvui-chart-legend-list",
+		children: categories.map((name, at) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "dvui-chart-key",
+			"data-dim": active !== null && active !== at ? "" : void 0,
+			onPointerEnter: () => setActive(at),
+			onPointerLeave: () => setActive(null),
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("i", { style: { background: colorAt(at) } }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dvui-chart-key-name",
+					children: name
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dvui-chart-key-value",
+					children: share(at)
+				})
+			]
+		}, `${at}-${name}`))
+	}) : series.length > 1 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "dvui-chart-legend",
+		children: series.map((item, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+			type: "button",
+			className: "dvui-chart-key",
+			"aria-pressed": shown[index],
+			onClick: () => setHidden((before) => before.includes(index) ? before.filter((item) => item !== index) : shown.filter(Boolean).length > 1 ? [...before, index] : before),
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("i", { style: { background: item.color } }), item.name || `${t("Series")} ${index + 1}`]
+		}, `${index}-${item.name}`))
+	}) : null;
+	const plot = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dvui-chart-plot",
+		style: isDonut ? { width: svgWidth } : void 0,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+			className: "dvui-chart-svg",
+			width: svgWidth,
+			height: drawn.height,
+			viewBox: `0 0 ${svgWidth} ${drawn.height}`,
+			role: "img",
+			"aria-labelledby": labelId,
+			tabIndex: 0,
+			onKeyDown: move,
+			onBlur: () => setActive(null),
+			onPointerLeave: () => setActive(null),
+			children: [drawn.parts, isDonut ? active === null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+				className: "dvui-chart-center",
+				x: svgWidth / 2,
+				y: drawn.height / 2 + 5,
+				textAnchor: "middle",
+				children: unit === "%" ? "" : withUnit$1(drawn.total, unit)
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+				className: "dvui-chart-center-name",
+				x: svgWidth / 2,
+				y: drawn.height / 2 - 4,
+				textAnchor: "middle",
+				children: fit(categories[active], drawn.size * .56, LABEL)
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+				className: "dvui-chart-center",
+				x: svgWidth / 2,
+				y: drawn.height / 2 + 14,
+				textAnchor: "middle",
+				children: share(active)
+			})] }) : drawn.hits.map((hit, at) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+				className: "dvui-chart-hit",
+				x: hit.x,
+				y: hit.y,
+				width: hit.w,
+				height: hit.h,
+				onPointerEnter: () => setActive(at)
+			}, `h${at}`))]
+		}), point && !asTable && !isDonut ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "dvui-chart-tip",
+			role: "status",
+			style: {
+				left: point.x,
+				top: point.y
+			},
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("b", { children: categories[active] }), tipRows.map((row, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("i", { style: { background: row.color } }),
+				row.name ? `${row.name}  ` : "",
+				row.value
+			] }, index))]
+		}) : null]
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("figure", {
+		ref: box,
+		className: "dvui-chart",
+		"data-kind": kind,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				id: labelId,
+				hidden: true,
+				children: label
+			}),
+			asTable ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChartTable, {
+				data,
+				t
+			}) : isDonut ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: legendBeside ? "dvui-chart-donut dvui-chart-donut-beside" : "dvui-chart-donut",
+				onPointerLeave: () => setActive(null),
+				children: [plot, legend]
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [legend, plot] }),
+			copied ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dvui-chart-copied",
+				role: "status",
+				children: t("Copied")
+			}) : null,
+			typeof node.caption === "string" && node.caption !== "" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("figcaption", {
+				className: "dvui-caption",
+				children: node.caption
+			}) : null
+		]
+	});
+}
+//#endregion
+//#region src/widget.tsx
+const TONES = [
+	"good",
+	"warn",
+	"bad"
+];
+const CALLOUT_TONES = [
+	"info",
+	"good",
+	"warn",
+	"bad"
+];
+const optionsOf = (node) => Array.isArray(node.options) ? node.options : [];
+const fieldsOf = (node) => Array.isArray(node.fields) ? node.fields : [];
+const cellText = (value) => value === null || value === void 0 ? "" : typeof value === "object" ? JSON.stringify(value) : asText(value);
+const NUMERIC_CELL = /^[-+]?[\d.,]+\s?(%|[a-zA-Z]{1,4})?$/;
+function hasType(node, types) {
+	return types.has(node.type) || Array.isArray(node.children) && node.children.some((child) => hasType(child, types));
+}
+const answerValues = (answer, node) => answer != null && answer.action === node.id ? answer.values : void 0;
+const withUnit = (value, unit) => `${asText(value)}${unit ? ` ${unit}` : ""}`;
+const grouped = (value) => typeof value === "number" && Number.isFinite(value) ? value.toLocaleString("en-US", { maximumFractionDigits: 6 }) : asText(value);
+function FallbackMarkdown({ text }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: text });
+}
+function OptionsInput({ node, ctx, t }) {
+	const [picked, setPicked] = (0, react.useState)([]);
+	const options = optionsOf(node);
+	const multi = node.multi === true;
+	const choose = (label) => {
+		if (ctx.answerLocked) return;
+		if (multi) setPicked((current) => current.includes(label) ? current.filter((item) => item !== label) : [...current, label]);
+		else ctx.onSubmit?.(node.id, { selected: [label] });
+	};
+	const onKey = (event) => {
+		const index = event.key.toUpperCase().charCodeAt(0) - 65;
+		if (index >= 0 && index < options.length && !event.ctrlKey && !event.metaKey && !event.altKey) {
+			event.preventDefault();
+			choose(options[index].label);
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "dvui-options",
+		role: "group",
+		"aria-label": t("Options"),
+		onKeyDown: onKey,
+		children: options.map((option, index) => {
+			const selected = multi && picked.includes(option.label);
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+				type: "button",
+				className: "dvui-option",
+				disabled: ctx.answerLocked,
+				"aria-pressed": multi ? selected : void 0,
+				"aria-keyshortcuts": keyLetter(index).toLowerCase(),
+				onClick: () => choose(option.label),
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "dvui-key",
+						"aria-hidden": "true",
+						children: keyLetter(index)
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: "dvui-option-body",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "dvui-option-label",
+							children: option.label
+						}), option.description ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "dvui-option-desc",
+							children: option.description
+						}) : null]
+					}),
+					selected ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "dvui-check",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CheckIcon, {})
+					}) : null
+				]
+			}, option.label);
+		})
+	}), multi ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "dvui-actions",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			className: "dvui-submit",
+			disabled: ctx.answerLocked || picked.length === 0,
+			onClick: () => ctx.onSubmit?.(node.id, { selected: picked }),
+			children: t("Submit")
+		})
+	}) : null] });
+}
+function SettledOptions({ node, answer, t }) {
+	const selected = answerValues(answer, node)?.selected;
+	const chosen = Array.isArray(selected) ? selected : [];
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "dvui-options",
+		role: "group",
+		"aria-label": t("Your answer"),
+		children: optionsOf(node).map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "dvui-option",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+				className: "dvui-option-body",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dvui-option-label",
+					children: option.label
+				}), option.description ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dvui-option-desc",
+					children: option.description
+				}) : null]
+			}), chosen.includes(option.label) ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dvui-check",
+				role: "img",
+				"aria-label": t("Selected"),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CheckIcon, {})
+			}) : null]
+		}, option.label))
+	});
+}
+function ConfirmInput({ node, ctx, t }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dvui-actions",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			className: "dvui-button",
+			disabled: ctx.answerLocked,
+			onClick: () => ctx.onSubmit?.(node.id, { confirmed: false }),
+			children: node.cancelLabel ?? t("Cancel")
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			className: "dvui-submit",
+			disabled: ctx.answerLocked,
+			onClick: () => ctx.onSubmit?.(node.id, { confirmed: true }),
+			children: node.confirmLabel ?? t("Confirm")
+		})]
+	});
+}
+function SettledConfirm({ node, answer, t }) {
+	const confirmed = answerValues(answer, node)?.confirmed;
+	if (typeof confirmed !== "boolean") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ConfirmInput, {
+		node,
+		ctx: { answerLocked: true },
+		t
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: "dvui-badge",
+		children: confirmed ? node.confirmLabel ?? t("Confirm") : node.cancelLabel ?? t("Cancel")
+	});
+}
+function FormInput({ node, ctx, t }) {
+	const fields = fieldsOf(node);
+	const [draft, setDraft] = (0, react.useState)({});
+	const submit = () => {
+		if (!ctx.answerLocked) ctx.onSubmit?.(node.id, { fields: Object.fromEntries(fields.map((field) => [field.id, draft[field.id] ?? ""])) });
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("form", {
+		className: "dvui-form",
+		onSubmit: (event) => {
+			event.preventDefault();
+			submit();
+		},
+		children: [fields.map((field) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+			className: "dvui-field",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dvui-field-label",
+				children: field.label
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				className: "dvui-input",
+				type: "text",
+				value: draft[field.id] ?? "",
+				autoComplete: "off",
+				spellCheck: false,
+				readOnly: ctx.answerLocked,
+				"aria-label": field.label,
+				placeholder: field.placeholder,
+				onChange: (event) => setDraft((current) => ({
+					...current,
+					[field.id]: event.target.value
+				}))
+			})]
+		}, field.id)), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "dvui-actions",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "submit",
+				className: "dvui-submit",
+				disabled: ctx.answerLocked,
+				children: node.submitLabel ?? t("Submit")
+			})
+		})]
+	});
+}
+function SettledForm({ node, answer }) {
+	const fields = answerValues(answer, node)?.fields;
+	const values = fields !== null && typeof fields === "object" ? fields : {};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "dvui-form",
+		children: fieldsOf(node).map((field) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+			className: "dvui-field",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dvui-field-label",
+				children: field.label
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				className: "dvui-input",
+				value: String(values[field.id] ?? ""),
+				disabled: true,
+				readOnly: true,
+				"aria-label": field.label
+			})]
+		}, field.id))
+	});
+}
+function WidgetTable({ node, lookup }) {
+	const columns = Array.isArray(node.columns) ? node.columns : [];
+	const rows = (Array.isArray(node.rows) ? node.rows : []).map((row) => (Array.isArray(row) ? row : []).map((cell) => resolve(cell, lookup, "")));
+	const numeric = columns.map((_, index) => {
+		const cells = rows.map((row) => row[index]).filter((cell) => cell !== void 0 && cell !== "");
+		return cells.length > 0 && cells.every((cell) => typeof cell === "number" || typeof cell === "string" && NUMERIC_CELL.test(cell.trim()));
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "dvui-table",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("table", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("thead", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tr", { children: columns.map((column, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("th", {
+			scope: "col",
+			className: numeric[index] ? "dvui-num" : void 0,
+			children: column.label
+		}, column.key ?? index)) }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tbody", { children: rows.map((row, rowIndex) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tr", { children: columns.map((column, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("td", {
+			className: numeric[index] ? "dvui-num" : void 0,
+			children: cellText(row[index])
+		}, column.key ?? index)) }, rowIndex)) })] })
+	});
+}
+function WidgetProgress({ node, lookup, t }) {
+	let percent;
+	if (node.percent !== void 0) percent = Number(resolve(node.percent, lookup, 0));
+	else {
+		const max = Number(resolve(node.max, lookup, 0));
+		percent = max > 0 ? Number(resolve(node.value, lookup, 0)) / max * 100 : 0;
+	}
+	percent = Math.max(0, Math.min(100, Number.isFinite(percent) ? percent : 0));
+	const tone = resolve(node.tone, lookup);
+	const right = node.valueLabel !== void 0 ? asText(resolve(node.valueLabel, lookup, "")) : `${Math.round(percent)}%`;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dvui-progress",
+		"data-tone": TONES.includes(String(tone)) ? String(tone) : void 0,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+			className: "dvui-progress-label",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: node.label }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: right })]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "dvui-progress-track",
+			role: "progressbar",
+			"aria-valuenow": Math.round(percent),
+			"aria-valuemin": 0,
+			"aria-valuemax": 100,
+			"aria-label": node.label ?? t("Progress"),
+			"aria-valuetext": right,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "dvui-progress-fill",
+				style: { width: `${percent}%` }
+			})
+		})]
+	});
+}
+function WidgetMetric({ node, lookup }) {
+	const tone = resolve(node.tone, lookup);
+	const caption = node.caption === void 0 ? "" : asText(resolve(node.caption, lookup, ""));
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dvui-metric",
+		"data-tone": TONES.includes(String(tone)) ? String(tone) : void 0,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dvui-metric-label",
+				children: node.label
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dvui-metric-value",
+				children: asText(resolve(node.value, lookup, "—"))
+			}),
+			caption !== "" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dvui-caption",
+				children: caption
+			}) : null
+		]
+	});
+}
+function WidgetCallout({ node, lookup, Markdown, labels }) {
+	const tone = resolve(node.tone, lookup);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dvui-callout",
+		"data-tone": CALLOUT_TONES.includes(String(tone)) ? String(tone) : "info",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "dvui-callout-icon",
+			"aria-hidden": "true",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(InfoIcon, {})
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Markdown, {
+			text: asText(resolve(node.text, lookup, "")),
+			labels,
+			variant: "compact"
+		}) })]
+	});
+}
+function WidgetSources({ node, t }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "dvui-sources",
+		role: "list",
+		"aria-label": t("Sources"),
+		children: (node.items ?? []).map((item, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("a", {
+			role: "listitem",
+			className: "dvui-source",
+			href: item.url,
+			target: "_blank",
+			rel: "noopener noreferrer",
+			title: item.url,
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkIcon, {}), item.label]
+		}, `${item.url}-${index}`))
+	});
+}
+function InputHead({ id, label, value }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dvui-input-head",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+			htmlFor: id,
+			className: "dvui-input-label",
+			children: label
+		}), value !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("output", {
+			htmlFor: id,
+			className: "dvui-input-value",
+			children: value
+		}) : null]
+	});
+}
+const numericBound = (bound) => typeof bound === "number" && Number.isFinite(bound) ? bound : typeof bound === "string" && bound.trim() !== "" && Number.isFinite(Number(bound)) ? Number(bound) : void 0;
+function SliderInput({ node, ctx }) {
+	const id = (0, react.useId)();
+	const value = Number(ctx.values[node.id]);
+	const min = numericBound(resolve(node.min, ctx.lookup, void 0));
+	const max = numericBound(resolve(node.max, ctx.lookup, void 0));
+	const percent = min !== void 0 && max !== void 0 && max > min ? (value - min) / (max - min) * 100 : 0;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dvui-input-row",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(InputHead, {
+			id,
+			label: node.label,
+			value: withUnit(grouped(value), node.unit)
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+			id,
+			type: "range",
+			className: "dvui-range",
+			min,
+			max,
+			step: node.step ?? "any",
+			value,
+			disabled: ctx.locked,
+			style: { "--_dvui-fill": `${percent}%` },
+			onChange: (event) => ctx.setInput(node.id, Number(event.target.value))
+		})]
+	});
+}
+function NumberInput({ node, ctx }) {
+	const id = (0, react.useId)();
+	const [draft, setDraft] = (0, react.useState)(null);
+	const value = ctx.values[node.id];
+	const min = numericBound(resolve(node.min, ctx.lookup, void 0));
+	const max = numericBound(resolve(node.max, ctx.lookup, void 0));
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dvui-input-row",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(InputHead, {
+			id,
+			label: node.label
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+			className: "dvui-number",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				id,
+				className: "dvui-input",
+				type: "number",
+				inputMode: "decimal",
+				value: draft ?? asText(value),
+				min,
+				max,
+				step: node.step ?? "any",
+				disabled: ctx.locked,
+				onChange: (event) => {
+					const raw = event.target.value;
+					setDraft(raw);
+					const next = Number(raw);
+					if (raw.trim() === "" || !Number.isFinite(next) || min !== void 0 && next < min || max !== void 0 && next > max) return;
+					ctx.setInput(node.id, next);
+				},
+				onBlur: () => setDraft(null)
+			}), node.unit ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dvui-unit",
+				children: node.unit
+			}) : null]
+		})]
+	});
+}
+function ChoiceInput({ node, ctx }) {
+	const labelId = (0, react.useId)();
+	const options = optionsOf(node);
+	const current = ctx.values[node.id];
+	const side = options.length <= 4 && options.every((option) => [...option.label].length <= 14);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dvui-input-row",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "dvui-input-label",
+			id: labelId,
+			children: node.label
+		}), side ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Segmented, {
+			label: node.label ?? "",
+			value: options.findIndex((option) => choiceValue(option) === current),
+			className: "dvui-choice-seg",
+			children: options.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				"aria-pressed": choiceValue(option) === current,
+				disabled: ctx.locked,
+				onClick: () => ctx.setInput(node.id, choiceValue(option)),
+				children: option.label
+			}, option.label))
+		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "dvui-radios",
+			role: "radiogroup",
+			"aria-labelledby": labelId,
+			children: options.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+				type: "button",
+				role: "radio",
+				className: "dvui-radio",
+				"aria-checked": choiceValue(option) === current,
+				disabled: ctx.locked,
+				onClick: () => ctx.setInput(node.id, choiceValue(option)),
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dvui-radio-dot",
+					"aria-hidden": "true"
+				}), option.label]
+			}, option.label))
+		})]
+	});
+}
+function ToggleInput({ node, ctx }) {
+	const on = ctx.values[node.id] === true;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dvui-toggle",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "dvui-input-label",
+			children: node.label
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			role: "switch",
+			className: "dvui-switch",
+			"aria-checked": on,
+			"aria-label": node.label,
+			disabled: ctx.locked,
+			onClick: () => ctx.setInput(node.id, !on),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dvui-switch-knob",
+				"aria-hidden": "true"
+			})
+		})]
+	});
+}
+function WidgetNode({ node, ctx, Markdown, labels, t }) {
+	const { lookup } = ctx;
+	switch (node.type) {
+		case "stack":
+		case "row": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: node.type === "row" ? "dvui-row" : "dvui-stack",
+			children: (node.children ?? []).map((child, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WidgetNode, {
+				node: child,
+				ctx,
+				Markdown,
+				labels,
+				t
+			}, child.id ?? `${child.type}-${index}`))
+		});
+		case "text": {
+			const text = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Markdown, {
+				text: asText(resolve(node.text, lookup, "")),
+				labels,
+				variant: "compact"
+			});
+			return node.tone === "muted" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "dvui-muted",
+				children: text
+			}) : text;
+		}
+		case "metric": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WidgetMetric, {
+			node,
+			lookup
+		});
+		case "table": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WidgetTable, {
+			node,
+			lookup
+		});
+		case "chart": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WidgetChart, {
+			node,
+			lookup,
+			registerChart: ctx.registerChart,
+			refreshCharts: ctx.refreshCharts,
+			t
+		});
+		case "progress": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WidgetProgress, {
+			node,
+			lookup,
+			t
+		});
+		case "callout": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WidgetCallout, {
+			node,
+			lookup,
+			Markdown,
+			labels
+		});
+		case "sources": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WidgetSources, {
+			node,
+			t
+		});
+		case "slider": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SliderInput, {
+			node,
+			ctx
+		});
+		case "number": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(NumberInput, {
+			node,
+			ctx
+		});
+		case "choice": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChoiceInput, {
+			node,
+			ctx
+		});
+		case "toggle": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToggleInput, {
+			node,
+			ctx
+		});
+		case "submit": return ctx.settled ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "dvui-actions",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				className: "dvui-submit",
+				disabled: ctx.answerLocked,
+				onClick: () => ctx.onSubmit?.(node.id, {}),
+				children: node.label || t("Send")
+			})
+		});
+		case "options": return ctx.settled ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SettledOptions, {
+			node,
+			answer: ctx.answer,
+			t
+		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(OptionsInput, {
+			node,
+			ctx,
+			t
+		});
+		case "confirm": return ctx.settled ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SettledConfirm, {
+			node,
+			answer: ctx.answer,
+			t
+		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ConfirmInput, {
+			node,
+			ctx,
+			t
+		});
+		case "form": return ctx.settled ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SettledForm, {
+			node,
+			answer: ctx.answer
+		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormInput, {
+			node,
+			ctx,
+			t
+		});
+		default: return null;
+	}
+}
+function WidgetView({ view, onSubmit, settled = false, answer = null, busy = false, registerChart, refreshCharts, t = english, labels = {
+	code: {
+		copyLabel: "Copy",
+		copiedLabel: "Copied"
+	},
+	footnotes: "Footnotes"
+}, Markdown = FallbackMarkdown }) {
+	const inputs = viewInputs(view);
+	const [values, setValues] = (0, react.useState)(() => Object.fromEntries(inputs.map((node) => [node.id, inputDefault(node)])));
+	const sent = answer?.values?.inputs;
+	const current = settled && sent !== null && typeof sent === "object" ? {
+		...values,
+		...sent
+	} : values;
+	const submit = (action, extra) => onSubmit?.(action, inputs.length > 0 ? {
+		...extra,
+		inputs: current
+	} : extra);
+	const ctx = {
+		onSubmit: submit,
+		settled,
+		answer,
+		busy,
+		lookup: viewScope(view, current),
+		values: current,
+		locked: settled || busy,
+		answerLocked: settled || busy || onSubmit === void 0,
+		setInput: (id, value) => setValues((before) => ({
+			...before,
+			[id]: value
+		})),
+		registerChart,
+		refreshCharts
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WidgetNode, {
+		node: view,
+		ctx,
+		Markdown,
+		labels,
+		t
+	});
+}
+function useChartHandles() {
+	const [, bump] = (0, react.useState)(0);
+	const charts = (0, react.useRef)(/* @__PURE__ */ new Map());
+	const refreshCharts = (0, react.useCallback)(() => bump((value) => value + 1), []);
+	const registerChart = (0, react.useCallback)((key, handle) => {
+		charts.current.set(key, handle);
+		refreshCharts();
+		return () => {
+			charts.current.delete(key);
+			refreshCharts();
+		};
+	}, [refreshCharts]);
+	return {
+		charts: [...charts.current.values()],
+		registerChart,
+		refreshCharts
+	};
+}
+function ViewMenu({ charts, t }) {
+	const [open, setOpen] = (0, react.useState)(false);
+	const root = (0, react.useRef)(null);
+	(0, react.useEffect)(() => {
+		if (!open) return void 0;
+		const away = (event) => {
+			if (!root.current?.contains(event.target)) setOpen(false);
+		};
+		const key = (event) => {
+			if (event.key === "Escape") setOpen(false);
+		};
+		document.addEventListener("pointerdown", away, true);
+		document.addEventListener("keydown", key);
+		return () => {
+			document.removeEventListener("pointerdown", away, true);
+			document.removeEventListener("keydown", key);
+		};
+	}, [open]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		ref: root,
+		className: "dvui-tools",
+		"data-open": open ? "" : void 0,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			className: "dvui-more",
+			"aria-label": t("Chart options"),
+			"aria-haspopup": "menu",
+			"aria-expanded": open,
+			onClick: () => setOpen((value) => !value),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DotsIcon, {})
+		}), open ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "dvui-menu",
+			role: "menu",
+			children: charts.map((chart, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [
+				charts.length > 1 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "dvui-menu-label",
+					children: chart.label ?? t("Chart {n}", { n: index + 1 })
+				}) : null,
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					type: "button",
+					role: "menuitem",
+					onClick: () => {
+						setOpen(false);
+						chart.toggleTable();
+					},
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableIcon, {}), chart.asTable ? t("View as chart") : t("View as table")]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					type: "button",
+					role: "menuitem",
+					onClick: () => {
+						setOpen(false);
+						chart.copy();
+					},
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CopyIcon, {}), t("Copy data")]
+				})
+			] }, `${chart.label}-${index}`))
+		}) : null]
+	});
+}
+function WidgetCard({ title = "", view, onSubmit, onDismiss, busy = false, settled = false, answer = null, t = english, labels, Markdown, localOnly = false }) {
+	const titleId = (0, react.useId)();
+	const { charts, registerChart, refreshCharts } = useChartHandles();
+	const framed = hasType(view, /* @__PURE__ */ new Set([
+		"slider",
+		"number",
+		"choice",
+		"toggle",
+		"options",
+		"confirm",
+		"form",
+		"submit"
+	]));
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: `dvui-view ${framed ? "dvui-framed" : "dvui-bare"}${settled ? " dvui-settled" : ""}`,
+		role: "group",
+		"aria-labelledby": title ? titleId : void 0,
+		"aria-label": title ? void 0 : t("View"),
+		"aria-busy": busy || void 0,
+		children: [
+			title || onDismiss || charts.length > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dvui-head",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: "dvui-title",
+						id: titleId,
+						children: title
+					}),
+					charts.length > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ViewMenu, {
+						charts,
+						t
+					}) : null,
+					onDismiss ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "dvui-dismiss",
+						"aria-label": t("Dismiss view"),
+						onClick: onDismiss,
+						disabled: busy,
+						children: "×"
+					}) : null
+				]
+			}) : null,
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "dvui-body",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WidgetView, {
+					view,
+					onSubmit,
+					settled,
+					answer,
+					busy,
+					registerChart,
+					refreshCharts,
+					t,
+					labels,
+					Markdown
+				})
+			}),
+			localOnly && hasType(view, /* @__PURE__ */ new Set([
+				"options",
+				"confirm",
+				"form",
+				"submit"
+			])) ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "dvui-local-note",
+				role: "note",
+				children: t("Local preview only; this card does not send an answer.")
+			}) : null
+		]
+	});
+}
+//#endregion
+//#region src/styles.ts
+const viewStyles = `
+.dvui-root { min-width: 0; color: var(--dsw-alias-label-primary); font-family: inherit; font-size: 14px; line-height: 22px; }
+.dvui-root * { box-sizing: border-box; }
+.dvui-root .dvui-view { min-width: 0; display: flex; flex-direction: column; gap: 10px; margin: 10px 0; }
+.dvui-root .dvui-bare { gap: 8px; }
+.dvui-root .dvui-framed { width: min(100%, 560px); padding: 14px 16px; border-radius: var(--dsw-radius-lg); background: var(--dsw-alias-bg-layer-1); box-shadow: var(--dsw-elevation-stroke); }
+.dvui-root .dvui-settled { color: var(--dsw-alias-label-secondary); }
+.dvui-root .dvui-head { display: flex; align-items: flex-start; gap: 8px; min-width: 0; }
+.dvui-root .dvui-title { flex: 1 1 0; min-width: 0; margin: 0; font-size: 13px; line-height: 18px; font-weight: 500; overflow-wrap: anywhere; }
+.dvui-root .dvui-body { min-width: 0; }
+.dvui-root .dvui-stack { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
+.dvui-root .dvui-row { display: flex; flex-wrap: wrap; gap: 12px 24px; min-width: 0; }
+.dvui-root .dvui-row > * { flex: 1 1 160px; min-width: 0; }
+.dvui-root .dvui-metric { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
+.dvui-root .dvui-metric-label,.dvui-root .dvui-caption,.dvui-root .dvui-field-label,.dvui-root .dvui-input-label { font-size: 12px; line-height: 16px; color: var(--dsw-alias-label-secondary); overflow-wrap: anywhere; }
+.dvui-root .dvui-metric-value { font-size: 22px; line-height: 28px; font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
+.dvui-root .dvui-metric[data-tone=good] .dvui-metric-value,.dvui-root .dvui-progress[data-tone=good] .dvui-progress-fill { color: var(--dsw-alias-state-success-primary); background: var(--dsw-alias-state-success-primary); }
+.dvui-root .dvui-metric[data-tone=warn] .dvui-metric-value,.dvui-root .dvui-progress[data-tone=warn] .dvui-progress-fill { color: var(--dsw-alias-state-warn-primary); background: var(--dsw-alias-state-warn-primary); }
+.dvui-root .dvui-metric[data-tone=bad] .dvui-metric-value,.dvui-root .dvui-progress[data-tone=bad] .dvui-progress-fill { color: var(--dsw-alias-state-error-primary); background: var(--dsw-alias-state-error-primary); }
+.dvui-root .dvui-muted { font-size: 12px; line-height: 16px; color: var(--dsw-alias-label-secondary); }
+.dvui-root .dvui-muted * { font-size: inherit !important; line-height: inherit !important; color: inherit !important; }
+.dvui-root .dvui-table { max-width: 100%; overflow-x: auto; border: .5px solid var(--dsw-alias-border-l2); border-radius: var(--dsw-radius-md); }
+.dvui-root .dvui-table table { border-collapse: collapse; min-width: 100%; font-size: 13px; line-height: 18px; }
+.dvui-root .dvui-table th { padding: 6px 10px; font-weight: 500; text-align: start; white-space: nowrap; color: var(--dsw-alias-label-secondary); border-bottom: .5px solid var(--dsw-alias-border-l2); }
+.dvui-root .dvui-table td { padding: 6px 10px; max-width: 280px; overflow-wrap: anywhere; }
+.dvui-root .dvui-table tbody tr + tr > * { border-top: .5px solid var(--dsw-alias-border-l1); }
+.dvui-root .dvui-table tbody th { font-weight: 400; border-bottom: 0; color: var(--dsw-alias-label-primary); }
+.dvui-root .dvui-num { text-align: end; font-variant-numeric: tabular-nums; }
+.dvui-root .dvui-progress { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
+.dvui-root .dvui-progress-label { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; line-height: 16px; color: var(--dsw-alias-label-secondary); font-variant-numeric: tabular-nums; }
+.dvui-root .dvui-progress-label > span:first-child { color: var(--dsw-alias-label-primary); font-weight: 500; }
+.dvui-root .dvui-progress-track { height: 6px; border-radius: 999px; background: var(--dsw-alias-interactive-bg-hover); overflow: hidden; }
+.dvui-root .dvui-progress-fill { height: 100%; border-radius: inherit; background: var(--dsw-alias-state-business-primary); transition: width .12s ease; }
+.dvui-root .dvui-callout { display: flex; gap: 8px; padding: 8px 12px; border-radius: var(--dsw-radius-md); background: color-mix(in srgb, var(--dsw-alias-state-business-primary) 8%, transparent); }
+.dvui-root .dvui-callout[data-tone=good] { background: color-mix(in srgb, var(--dsw-alias-state-success-primary) 8%, transparent); }
+.dvui-root .dvui-callout[data-tone=warn] { background: color-mix(in srgb, var(--dsw-alias-state-warn-primary) 8%, transparent); }
+.dvui-root .dvui-callout[data-tone=bad] { background: color-mix(in srgb, var(--dsw-alias-state-error-primary) 8%, transparent); }
+.dvui-root .dvui-callout-icon { flex: none; display: flex; padding-top: 3px; color: var(--dsw-alias-state-business-primary); }
+.dvui-root .dvui-callout[data-tone=good] .dvui-callout-icon { color: var(--dsw-alias-state-success-primary); }
+.dvui-root .dvui-callout[data-tone=warn] .dvui-callout-icon { color: var(--dsw-alias-state-warn-primary); }
+.dvui-root .dvui-callout[data-tone=bad] .dvui-callout-icon { color: var(--dsw-alias-state-error-primary); }
+.dvui-root .dvui-callout > div { flex: 1 1 auto; min-width: 0; }
+.dvui-root .dvui-sources { display: flex; flex-wrap: wrap; gap: 6px; }
+.dvui-root .dvui-source { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; height: 22px; padding: 0 6px; border-radius: var(--dsw-radius-sm); background: var(--dsw-alias-interactive-bg-hover); color: var(--dsw-alias-label-secondary); font-size: 11px; line-height: 16px; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.dvui-root .dvui-source:hover { color: var(--dsw-alias-label-primary); }
+.dvui-root .dvui-input-row { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
+.dvui-root .dvui-input-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
+.dvui-root .dvui-input-value { font-size: 15px; line-height: 20px; font-weight: 600; font-variant-numeric: tabular-nums; }
+.dvui-root .dvui-range { appearance: none; width: 100%; height: 20px; margin: 0; background: transparent; cursor: pointer; }
+.dvui-root .dvui-range:disabled { cursor: default; opacity: .6; }
+.dvui-root .dvui-range::-webkit-slider-runnable-track { height: 6px; border-radius: 999px; background: linear-gradient(to right, var(--dsw-alias-state-business-primary) var(--_dvui-fill, 0%), var(--dsw-alias-interactive-bg-hover) var(--_dvui-fill, 0%)); }
+.dvui-root .dvui-range::-moz-range-track { height: 6px; border-radius: 999px; background: var(--dsw-alias-interactive-bg-hover); }
+.dvui-root .dvui-range::-moz-range-progress { height: 6px; border-radius: 999px; background: var(--dsw-alias-state-business-primary); }
+.dvui-root .dvui-range::-webkit-slider-thumb { appearance: none; width: 16px; height: 16px; margin-top: -5px; border-radius: 50%; background: var(--dsw-alias-label-primary-foreground); box-shadow: var(--dsw-elevation-soft); }
+.dvui-root .dvui-range::-moz-range-thumb { width: 16px; height: 16px; border: 0; border-radius: 50%; background: var(--dsw-alias-label-primary-foreground); box-shadow: var(--dsw-elevation-soft); }
+.dvui-root .dvui-number { display: flex; align-items: center; gap: 6px; max-width: 200px; }
+.dvui-root .dvui-unit { flex: none; font-size: 13px; color: var(--dsw-alias-label-secondary); }
+.dvui-root .dvui-seg { display: flex; flex-wrap: wrap; gap: 2px; padding: 2px; border-radius: var(--dsw-radius-md); background: var(--dsw-alias-interactive-bg-hover); }
+.dvui-root .dvui-choice-seg { align-self: flex-start; max-width: 100%; }
+.dvui-root .dvui-seg button { flex: 0 1 auto; min-height: 30px; padding: 4px 12px; border: 0; border-radius: var(--dsw-radius-sm); background: none; font: inherit; font-size: 13px; color: var(--dsw-alias-label-secondary); cursor: pointer; overflow-wrap: anywhere; }
+.dvui-root .dvui-seg button[aria-pressed=true] { background: var(--dsw-alias-bg-layer-1); color: var(--dsw-alias-label-primary); box-shadow: var(--dsw-elevation-soft); }
+.dvui-root .dvui-radios { display: flex; flex-direction: column; gap: 2px; }
+.dvui-root .dvui-radio { display: flex; align-items: center; gap: 8px; min-height: 30px; padding: 4px 8px; margin: 0 -8px; border: 0; border-radius: var(--dsw-radius-sm); background: none; font: inherit; text-align: start; color: inherit; cursor: pointer; }
+.dvui-root .dvui-radio:hover:not(:disabled),.dvui-root .dvui-option:hover:not(:disabled) { background: var(--dsw-alias-interactive-bg-hover); }
+.dvui-root .dvui-radio-dot { flex: none; width: 16px; height: 16px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--dsw-alias-border-l3); }
+.dvui-root .dvui-radio[aria-checked=true] .dvui-radio-dot { box-shadow: inset 0 0 0 5px var(--dsw-alias-state-business-primary); }
+.dvui-root .dvui-toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 28px; }
+.dvui-root .dvui-switch { position: relative; flex: none; width: 36px; height: 20px; padding: 0; border: 0; border-radius: 999px; background: var(--dsw-alias-border-l3); cursor: pointer; }
+.dvui-root .dvui-switch[aria-checked=true] { background: var(--dsw-alias-button-primary-fill); }
+.dvui-root .dvui-switch-knob { position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: var(--dsw-alias-label-primary-foreground); box-shadow: var(--dsw-elevation-soft); transition: transform .15s ease; }
+.dvui-root .dvui-switch[aria-checked=true] .dvui-switch-knob { transform: translateX(16px); }
+.dvui-root .dvui-options { display: flex; flex-direction: column; gap: 1px; min-width: 0; margin: 0 -8px; }
+.dvui-root .dvui-option { position: relative; display: flex; align-items: flex-start; gap: 12px; width: 100%; min-width: 0; margin: 0; border: 0; border-radius: var(--dsw-radius-md); background: transparent; padding: 10px 8px; font: inherit; color: inherit; text-align: start; cursor: pointer; }
+.dvui-root .dvui-key { flex: none; width: 24px; height: 24px; border-radius: var(--dsw-radius-sm); background: var(--dsw-alias-interactive-bg-hover); color: var(--dsw-alias-label-secondary); font-size: 12px; line-height: 24px; text-align: center; }
+.dvui-root .dvui-option-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 1px; padding-top: 2px; }
+.dvui-root .dvui-option-label { font-size: 14px; line-height: 20px; font-weight: 500; overflow-wrap: anywhere; }
+.dvui-root .dvui-option-desc { font-size: 12px; line-height: 17px; color: var(--dsw-alias-label-secondary); overflow-wrap: anywhere; }
+.dvui-root .dvui-check { flex: none; display: inline-flex; align-items: center; color: var(--dsw-alias-state-success-primary); }
+.dvui-root .dvui-form { display: flex; flex-direction: column; gap: 8px; margin: 0; }
+.dvui-root .dvui-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
+.dvui-root .dvui-input { width: 100%; min-width: 0; min-height: 32px; padding: 5px 11px; border: .5px solid var(--dsw-alias-border-l3); border-radius: var(--dsw-radius-sm); outline: none; background: transparent; color: var(--dsw-alias-label-primary); font: inherit; font-size: 14px; line-height: 20px; }
+.dvui-root .dvui-input::placeholder { color: var(--dsw-alias-label-dimmed); }
+.dvui-root .dvui-input:focus-visible { border-color: var(--dsw-alias-state-business-primary); }
+.dvui-root .dvui-actions { display: flex; justify-content: flex-end; gap: 8px; }
+.dvui-root .dvui-submit,.dvui-root .dvui-button { flex: none; min-height: 34px; padding: 0 14px; border: 0; border-radius: 999px; font: inherit; font-size: 14px; font-weight: 500; cursor: pointer; }
+.dvui-root .dvui-submit { background: var(--dsw-alias-button-primary-fill); color: var(--dsw-alias-label-primary-foreground); }
+.dvui-root .dvui-submit:hover:not(:disabled) { background: var(--dsw-alias-button-primary-hover); }
+.dvui-root .dvui-button { background: var(--dsw-alias-interactive-bg-hover); color: var(--dsw-alias-label-primary); }
+.dvui-root .dvui-button:hover:not(:disabled) { background: var(--dsw-alias-interactive-bg-active); }
+.dvui-root button:disabled { opacity: .45; cursor: default; }
+.dvui-root .dvui-badge { height: 22px; padding: 0 7px; border-radius: 999px; border: 1px dotted var(--dsw-alias-border-l3); color: var(--dsw-alias-label-secondary); font-size: 12px; line-height: 20px; }
+.dvui-root .dvui-tools { position: relative; flex: none; align-self: flex-start; }
+.dvui-root .dvui-more,.dvui-root .dvui-dismiss { width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--dsw-alias-label-secondary); display: flex; align-items: center; justify-content: center; cursor: pointer; }
+.dvui-root .dvui-more:hover,.dvui-root .dvui-dismiss:hover { background: var(--dsw-alias-interactive-bg-hover); color: var(--dsw-alias-label-primary); }
+.dvui-root .dvui-menu { position: absolute; top: 32px; right: 0; z-index: 4; min-width: 180px; padding: 6px; border-radius: var(--dsw-radius-md); background: var(--dsw-menu-surface-fill); box-shadow: var(--dsw-elevation-panel); display: flex; flex-direction: column; gap: 2px; }
+.dvui-root .dvui-menu button { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 30px; text-align: left; border: 0; background: none; border-radius: var(--dsw-radius-sm); padding: 6px 8px; font: inherit; font-size: 13px; line-height: 18px; color: var(--dsw-alias-label-primary); cursor: pointer; }
+.dvui-root .dvui-menu button:hover { background: var(--dsw-alias-interactive-bg-hover); }
+.dvui-root .dvui-menu-label { padding: 2px 8px; font-size: 11px; line-height: 14px; color: var(--dsw-alias-label-tertiary); }
+.dvui-root .dvui-local-note { margin: 0; font-size: 12px; line-height: 18px; color: var(--dsw-alias-label-tertiary); }
+.dvui-root .dvui-chart { position: relative; margin: 0; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
+.dvui-root .dvui-chart-plot { position: relative; min-width: 0; }
+.dvui-root .dvui-chart-svg { display: block; overflow: visible; outline: none; font-family: inherit; }
+.dvui-root .dvui-chart-svg text { pointer-events: none; }
+.dvui-root .dvui-chart-grid { stroke: var(--dsw-alias-border-l1); stroke-width: 1; stroke-dasharray: 3 3; }
+.dvui-root .dvui-chart-tick { font-size: 10px; fill: var(--dsw-alias-label-tertiary); font-variant-numeric: tabular-nums; }
+.dvui-root .dvui-chart-label,.dvui-root .dvui-chart-value { font-size: 11px; fill: var(--dsw-alias-label-secondary); }
+.dvui-root .dvui-chart-value { font-variant-numeric: tabular-nums; }
+.dvui-root .dvui-chart-center { font-size: 15px; font-weight: 600; fill: var(--dsw-alias-label-primary); font-variant-numeric: tabular-nums; }
+.dvui-root .dvui-chart-center-name { font-size: 11px; fill: var(--dsw-alias-label-secondary); }
+.dvui-root .dvui-chart-mark[data-dim] { opacity: .28; }
+.dvui-root .dvui-chart-line { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
+.dvui-root .dvui-chart-area { opacity: .14; }
+.dvui-root .dvui-chart-guide { stroke: var(--dsw-alias-border-l3); stroke-width: 1; }
+.dvui-root .dvui-chart-hit { fill: transparent; }
+.dvui-root .dvui-chart-tip { position: absolute; z-index: 4; pointer-events: none; transform: translate(-50%, calc(-100% - 8px)); display: flex; flex-direction: column; gap: 2px; padding: 6px 10px; border-radius: var(--dsw-radius-md); background: var(--dsw-menu-surface-fill); box-shadow: var(--dsw-elevation-panel); font-size: 12px; line-height: 16px; white-space: nowrap; font-variant-numeric: tabular-nums; }
+.dvui-root .dvui-chart-tip span { display: flex; align-items: center; gap: 6px; color: var(--dsw-alias-label-secondary); }
+.dvui-root .dvui-chart-tip i,.dvui-root .dvui-chart-key i { flex: none; width: 8px; height: 8px; border-radius: 50%; }
+.dvui-root .dvui-chart-legend { display: flex; flex-wrap: wrap; gap: 4px 12px; padding-right: 32px; }
+.dvui-root .dvui-chart-key { display: inline-flex; align-items: center; gap: 6px; min-height: 20px; padding: 0; border: 0; background: none; font: inherit; font-size: 12px; line-height: 16px; color: var(--dsw-alias-label-secondary); cursor: pointer; }
+.dvui-root .dvui-chart-key[aria-pressed=false],.dvui-root .dvui-chart-key[data-dim] { opacity: .4; }
+.dvui-root .dvui-chart-legend-list { flex-direction: column; flex-wrap: nowrap; gap: 6px; padding: 0; min-width: 0; }
+.dvui-root .dvui-chart-legend-list .dvui-chart-key { cursor: default; width: 100%; }
+.dvui-root .dvui-chart-key-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--dsw-alias-label-primary); }
+.dvui-root .dvui-chart-key-value { flex: none; font-variant-numeric: tabular-nums; }
+.dvui-root .dvui-chart-donut { display: flex; flex-direction: column; align-items: center; gap: 12px; }
+.dvui-root .dvui-chart-donut-beside { flex-direction: row; align-items: center; gap: 24px; }
+.dvui-root .dvui-chart-donut-beside .dvui-chart-legend-list { flex: 1 1 auto; max-width: 280px; }
+.dvui-root .dvui-chart-copied { position: absolute; top: 2px; right: 36px; font-size: 12px; line-height: 16px; color: var(--dsw-alias-label-secondary); }
+.dvui-root .dvui-reasoning { margin: 6px 0; color: var(--dsw-alias-label-secondary); }
+.dvui-root .dvui-reasoning > summary { cursor: pointer; font-size: 12px; line-height: 20px; }
+.dvui-root .dvui-reasoning-body { padding: 4px 0 4px 12px; border-left: 1px solid var(--dsw-alias-border-l2); }
+.dvui-root .dvui-unknown { white-space: pre-wrap; overflow-wrap: anywhere; color: var(--dsw-alias-label-secondary); font-size: 12px; }
+.dvui-root .dvui-tool-loading, .dvui-root.dvui-tool-loading { padding: 8px 0; color: var(--dsw-alias-label-secondary); font-size: 13px; }
+.dvui-root .dvui-tool-error, .dvui-root.dvui-tool-error { margin: 8px 0; color: var(--dsw-alias-label-error); font-size: 13px; }
+.dvui-root button:focus-visible,.dvui-root a:focus-visible,.dvui-root input:focus-visible,.dvui-root .dvui-chart-svg:focus-visible { outline: var(--dsw-focus-ring-width) solid var(--dsw-focus-ring-color, var(--dsw-alias-state-business-primary)); outline-offset: 2px; }
+@media (hover: hover) { .dvui-root .dvui-tools:not(:focus-within):not([data-open]) { opacity: 0; } .dvui-root .dvui-view:hover .dvui-tools { opacity: 1; } }
+@media (prefers-reduced-motion: reduce) { .dvui-root * { transition: none !important; } }
+`;
+//#endregion
+//#region src/answer-text.ts
+function controls(view) {
+	return [
+		"options",
+		"confirm",
+		"form",
+		"submit"
+	].includes(view.type) ? [view] : (view.children ?? []).flatMap(controls);
+}
+function answerText(card, action, values) {
+	const node = controls(card.view).find((node) => node.id === action);
+	const lines = [card.title || "Deep View"];
+	if (Array.isArray(values.selected)) lines.push(values.selected.map(String).join(", "));
+	if (typeof values.confirmed === "boolean") lines.push(values.confirmed ? node?.confirmLabel ?? "Confirm" : node?.cancelLabel ?? "Cancel");
+	if (isRecord(values.fields)) for (const field of node?.fields ?? []) lines.push(`${field.label}: ${String(values.fields[field.id] ?? "")}`);
+	const inputs = inputsSummary(card.view, values.inputs);
+	if (inputs) lines.push(inputs);
+	if (node?.type === "submit") lines.push(node.label ?? "Submit");
+	return lines.join("\n");
+}
+/** Legacy messages have no metadata. Restore only unambiguous, fully validated
+* answers that reproduce the exact text written by this plugin. Never guess
+* from ordinary prose, and never modify the stored message. */
+function legacyAnswer(card, text) {
+	if (text.startsWith("{")) try {
+		const data = JSON.parse(text);
+		if (!isRecord(data) || data.kind !== "answer_to_pending_view" || data.tool !== "show_view" || !Array.isArray(data.answers)) return null;
+		const answer = data.answers.find((value) => isRecord(value) && value.id === card.id);
+		if (!isRecord(answer) || typeof answer.action !== "string") return null;
+		const values = validateViewAnswer(card.view, answer.action, answer.values);
+		return values.error === void 0 ? {
+			id: card.id,
+			action: answer.action,
+			values
+		} : null;
+	} catch {
+		return null;
+	}
+	const lines = text.split("\n");
+	if (lines.shift() !== (card.title || "Deep View")) return null;
+	const candidates = [];
+	for (const node of controls(card.view)) {
+		const rest = [...lines];
+		const values = {};
+		if (node.type === "options") {
+			const line = rest.shift();
+			if (line === void 0) continue;
+			const labels = node.options?.map((option) => option.label) ?? [];
+			if (node.multi && labels.some((label) => label.includes(", "))) continue;
+			values.selected = node.multi ? line.split(", ") : [line];
+		} else if (node.type === "confirm") {
+			const line = rest.shift(), yes = node.confirmLabel ?? "Confirm", no = node.cancelLabel ?? "Cancel";
+			if (yes === no || line !== yes && line !== no) continue;
+			values.confirmed = line === yes;
+		} else if (node.type === "form") {
+			const fields = {};
+			let valid = true;
+			for (const field of node.fields ?? []) {
+				const line = rest.shift(), prefix = `${field.label}: `;
+				if (line === void 0 || !line.startsWith(prefix)) {
+					valid = false;
+					break;
+				}
+				fields[field.id] = line.slice(prefix.length);
+			}
+			if (!valid) continue;
+			values.fields = fields;
+		}
+		const inputs = viewInputs(card.view);
+		if (inputs.length) {
+			const pairs = rest.shift()?.split("; ");
+			if (!pairs || pairs.length !== inputs.length) continue;
+			const sent = {};
+			let valid = true;
+			for (let i = 0; i < inputs.length; i++) {
+				const input = inputs[i], prefix = `${input.label || input.id}=`;
+				if (!pairs[i].startsWith(prefix)) {
+					valid = false;
+					break;
+				}
+				const value = pairs[i].slice(prefix.length);
+				if (input.type === "toggle") sent[input.id] = value === "on" ? true : value === "off" ? false : void 0;
+				else if (input.type === "choice") {
+					const choices = input.options?.filter((option) => option.label === value) ?? [];
+					sent[input.id] = choices.length === 1 ? choiceValue(choices[0]) : void 0;
+				} else {
+					const unit = input.unit ? ` ${input.unit}` : "";
+					sent[input.id] = !unit || value.endsWith(unit) ? Number(unit ? value.slice(0, -unit.length) : value) : void 0;
+				}
+			}
+			if (!valid) continue;
+			values.inputs = sent;
+		}
+		if (node.type === "submit" && rest.shift() !== (node.label ?? "Submit")) continue;
+		if (rest.length || !node.id) continue;
+		const checked = validateViewAnswer(card.view, node.id, values);
+		if (checked.error === void 0 && answerText(card, node.id, checked) === text) candidates.push({
+			id: card.id,
+			action: node.id,
+			values: checked
+		});
+	}
+	return candidates.length === 1 ? candidates[0] : null;
+}
+//#endregion
+//#region src/answers.ts
+/** Read visible, durable user/steering messages only, including inherited history. */
+function replyAnswers(snapshot) {
+	const answers = /* @__PURE__ */ new Map();
+	let cards = [];
+	const collect = (block) => {
+		const meta = block.meta;
+		if (block.kind === "tool-result" && !block.isError && isRecord(meta) && meta.owner === "dsh-deep-view" && meta.awaitReply === true && typeof meta.viewId === "string") {
+			const shown = checkShownView(meta.title, meta.view);
+			if (!("error" in shown)) cards.push({
+				id: meta.viewId,
+				title: shown.title,
+				view: shown.view
+			});
+		}
+		for (const child of block.subCalls ?? []) collect(child);
+	};
+	for (const key of snapshot.order) {
+		const node = snapshot.nodes.get(key);
+		if (node?.kind === "tool-call" && node.data?.root) collect(node.data.root);
+		if (node?.kind !== "user" && node?.kind !== "steering") continue;
+		const source = node.data?.source;
+		if (!isRecord(source) || source.kind !== "user") continue;
+		if (source.deepView === void 0) {
+			const text = node.data?.content?.filter(isRecord).filter((block) => block.type === "text").map((block) => block.text).join("") ?? "";
+			const candidates = cards.map((card) => legacyAnswer(card, text)).filter((answer) => answer !== null);
+			if (candidates.length === 1 && !answers.has(candidates[0].id)) answers.set(candidates[0].id, candidates[0]);
+		}
+		cards = [];
+		if (!isRecord(source.deepView)) continue;
+		const meta = source.deepView;
+		if (meta.owner !== "dsh-deep-view" || meta.version !== 1 || !isRecord(meta.answer)) continue;
+		const answer = meta.answer;
+		if (typeof answer.id !== "string" || typeof answer.action !== "string" || !isRecord(answer.values)) continue;
+		if (!answers.has(answer.id)) answers.set(answer.id, answer);
+	}
+	return answers;
+}
+function checkedAnswer(answer, id, view) {
+	if (!answer || !id || answer.id !== id) return null;
+	const values = validateViewAnswer(view, answer.action, answer.values);
+	return values.error === void 0 ? {
+		id,
+		action: answer.action,
+		values
+	} : null;
+}
+function sameAnswers(left, right) {
+	return left.size === right.size && [...left].every(([id, answer]) => {
+		const next = right.get(id);
+		return next === answer || next?.action === answer.action && JSON.stringify(next.values) === JSON.stringify(answer.values);
+	});
+}
+//#endregion
+//#region src/client.tsx
+const name = "dsh-deep-view-client";
+const inject = [
+	"slots",
+	"connection",
+	"locale"
+];
+const LOCALE = "deep-view";
+const uiZh = {
+	copy: "复制",
+	copied: "已复制",
+	footnotes: "脚注",
+	code: "代码",
+	wrap: "自动换行",
+	unwrap: "不换行",
+	prepared: "卡片将在最终回复中显示",
+	preparing: "正在准备视图…",
+	error: "视图未能显示",
+	invalid: "视图数据无效",
+	local: "仅本地预览；此卡片不会发送回答。",
+	answerFailed: "回答未能发送，请重试。",
+	chart: "图表",
+	chartOptions: "图表选项",
+	viewAsChart: "查看图表",
+	viewAsTable: "查看表格",
+	copyData: "复制数据",
+	chartNumber: "图表 {n}",
+	value: "值",
+	series: "系列",
+	view: "视图",
+	sources: "来源",
+	progress: "进度",
+	yourAnswer: "你的回答",
+	options: "选项",
+	submit: "提交",
+	cancel: "取消",
+	confirm: "确认",
+	send: "发送",
+	selected: "已选择"
+};
+const uiEn = {
+	copy: "Copy",
+	copied: "Copied",
+	footnotes: "Footnotes",
+	code: "Code",
+	wrap: "Wrap lines",
+	unwrap: "Do not wrap lines",
+	prepared: "The card will appear in the final reply",
+	preparing: "Preparing view…",
+	error: "The view could not be shown",
+	invalid: "Invalid view data",
+	local: "Local preview only; this card does not send an answer.",
+	answerFailed: "The answer could not be sent; try again.",
+	chart: "Chart",
+	chartOptions: "Chart options",
+	viewAsChart: "View as chart",
+	viewAsTable: "View as table",
+	copyData: "Copy data",
+	chartNumber: "Chart {n}",
+	value: "Value",
+	series: "Series",
+	view: "View",
+	sources: "Sources",
+	progress: "Progress",
+	yourAnswer: "Your answer",
+	options: "Options",
+	submit: "Submit",
+	cancel: "Cancel",
+	confirm: "Confirm",
+	send: "Send",
+	selected: "Selected"
+};
+const viewT = (t) => (key, params) => {
+	const keys = {
+		Copy: "copy",
+		Copied: "copied",
+		Footnotes: "footnotes",
+		Chart: "chart",
+		"Chart options": "chartOptions",
+		"View as chart": "viewAsChart",
+		"View as table": "viewAsTable",
+		"Copy data": "copyData",
+		"Chart {n}": "chartNumber",
+		Value: "value",
+		Series: "series",
+		View: "view",
+		Sources: "sources",
+		Progress: "progress",
+		"Your answer": "yourAnswer",
+		"Local preview only; this card does not send an answer.": "local",
+		Options: "options",
+		Submit: "submit",
+		Cancel: "cancel",
+		Confirm: "confirm",
+		Send: "send",
+		Selected: "selected"
+	};
+	return keys[key] ? t(keys[key], params) : key.replace(/\{(\w+)\}/g, (_, name) => String(params?.[name] ?? `{${name}}`));
+};
+function ViewMarkdown(props) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.MarkdownText, { ...props });
+}
+function useMarkdownLabels(t) {
+	return (0, react.useMemo)(() => ({
+		code: {
+			copyLabel: t("copy"),
+			copiedLabel: t("copied"),
+			toolbarLabels: {
+				codeLabel: t("code"),
+				wrapLabel: t("wrap"),
+				unwrapLabel: t("unwrap")
+			}
+		},
+		footnotes: t("footnotes")
+	}), [t]);
+}
+function isArgsView(value) {
+	return isRecord(value) && typeof value.text === "function" && typeof value.value === "function";
+}
+function argField(args, key) {
+	if (!isArgsView(args)) return void 0;
+	const value = args.value(key);
+	return value !== void 0 ? value : args.text(key);
+}
+function readToolCall(props) {
+	const block = props.block;
+	const phase = props.phase ?? (block.kind === "tool-result" ? "result" : "start");
+	const isError = phase === "result" && block.isError === true;
+	const meta = phase === "result" ? block.meta : void 0;
+	if (isRecord(meta) && meta.owner === "dsh-deep-view") {
+		const shown = checkShownView(meta.title, meta.view);
+		if ("error" in shown) return {
+			title: meta.title,
+			view: meta.view,
+			viewReady: true,
+			phase,
+			isError: true
+		};
+		return {
+			presentation: {
+				owner: VIEW_OWNER,
+				...shown,
+				...typeof meta.viewId === "string" ? { viewId: meta.viewId } : {},
+				awaitReply: meta.awaitReply === true
+			},
+			title: meta.title,
+			view: meta.view,
+			viewReady: true,
+			phase,
+			isError
+		};
+	}
+	const args = block.args;
+	const title = argField(args, "title");
+	const viewReady = phase !== "preparing" || isArgsView(args) && args.complete("view");
+	return {
+		title,
+		view: viewReady ? argField(args, "view") : void 0,
+		viewReady,
+		phase,
+		isError
+	};
+}
+function ToolCallView(props) {
+	const t = props.t;
+	const labels = useMarkdownLabels(t);
+	const read = (0, react.useMemo)(() => readToolCall(props), [props.block, props.phase]);
+	const shown = (0, react.useMemo)(() => {
+		if (read.presentation) return read.presentation;
+		if (!read.viewReady || read.phase === "preparing") return void 0;
+		const checked = checkShownView(read.title, read.view);
+		return "error" in checked ? void 0 : {
+			...checked,
+			awaitReply: checked.interactive
+		};
+	}, [
+		read.presentation,
+		read.viewReady,
+		read.phase,
+		read.title,
+		read.view
+	]);
+	const [pending, setPending] = (0, react.useState)(null);
+	const [busy, setBusy] = (0, react.useState)(false);
+	const [failed, setFailed] = (0, react.useState)(false);
+	const [localAnswer, setAnswer] = (0, react.useState)(null);
+	const restored = (0, react.useMemo)(() => shown ? checkedAnswer(props.restoredAnswer, read.presentation?.viewId, shown.view) : null, [
+		props.restoredAnswer,
+		read.presentation?.viewId,
+		shown
+	]);
+	const answer = restored ?? localAnswer;
+	const sequence = (0, react.useRef)(0);
+	const callId = props.callId;
+	(0, react.useEffect)(() => {
+		const seq = ++sequence.current;
+		setPending(null);
+		setFailed(false);
+		if (restored || !read.presentation?.awaitReply || !callId) return;
+		props.call("pending", {
+			sessionId: props.sessionId,
+			callId
+		}).then((result) => {
+			if (sequence.current !== seq) return;
+			const envelope = result;
+			if (envelope?.ok) setPending(envelope.value);
+		}).catch(() => {});
+		return () => {
+			sequence.current += 1;
+		};
+	}, [
+		props.call,
+		props.sessionId,
+		callId,
+		read.presentation?.awaitReply,
+		read.presentation?.viewId,
+		restored
+	]);
+	const submit = (0, react.useCallback)((action, values) => {
+		if (!pending || busy) return;
+		setBusy(true);
+		setFailed(false);
+		props.call("reply", {
+			sessionId: props.sessionId,
+			viewId: pending.id,
+			action,
+			values
+		}).then((result) => {
+			if (result?.ok) {
+				setAnswer({
+					id: pending.id,
+					action,
+					values
+				});
+				setPending(null);
+			} else setFailed(true);
+		}).catch(() => setFailed(true)).finally(() => setBusy(false));
+	}, [
+		props.call,
+		props.sessionId,
+		pending,
+		busy
+	]);
+	if (read.phase === "preparing") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "dvui-root dvui-tool-loading",
+		role: "status",
+		children: t("preparing")
+	});
+	if (read.isError || !shown) {
+		if (read.phase !== "result" && !read.isError) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "dvui-root dvui-tool-loading",
+			role: "status",
+			children: t("preparing")
+		});
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "dvui-root dvui-tool-error",
+			role: "status",
+			children: t(read.isError ? "error" : "invalid")
+		});
+	}
+	const canAnswer = shown.awaitReply && pending !== null && answer === null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dvui-root",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(WidgetCard, {
+			title: shown.title,
+			view: shown.view,
+			onSubmit: canAnswer ? submit : void 0,
+			busy,
+			settled: answer !== null || !canAnswer,
+			answer,
+			t: viewT(t),
+			labels,
+			Markdown: ViewMarkdown,
+			localOnly: answer === null && !canAnswer && shown.interactive
+		}), failed ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+			className: "dvui-tool-error",
+			role: "alert",
+			children: t("answerFailed")
+		}) : null]
+	});
+}
+/** Collect only this turn's successfully persisted cards, including PTC children.
+* The turn index also covers hidden process rows; no all-history scan or DOM
+* relocation is needed. Result metadata works even when arguments were evicted.
+*/
+function replyCards(snapshot, turn) {
+	const cards = [];
+	const seen = /* @__PURE__ */ new Set();
+	const visit = (block) => {
+		if (block.kind === "tool-result" && !block.isError && !seen.has(block.callId) && isRecord(block.meta) && block.meta.owner === "dsh-deep-view") {
+			const read = readToolCall({
+				phase: "result",
+				block
+			});
+			if (read.presentation && !read.isError) {
+				seen.add(block.callId);
+				cards.push(block);
+			}
+		}
+		for (const child of block.subCalls ?? []) visit(child);
+	};
+	for (const key of snapshot.locations.getTurn(turn)) {
+		const node = snapshot.nodes.get(key);
+		if (node?.kind === "tool-call" && node.data?.root) visit(node.data.root);
+	}
+	return cards;
+}
+const sameCards = (left, right) => left.length === right.length && left.every((block, index) => block === right[index]);
+/** Native completed-turn surface: always outside the process disclosure. */
+function ReplyView(props) {
+	const cards = props.useChat((snapshot) => replyCards(snapshot, props.turn.turn), sameCards);
+	const answers = props.useChat(replyAnswers, sameAnswers);
+	if (props.turn.status !== "closed" || cards.length === 0) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "dvui-root",
+		"data-deep-view-reply": true,
+		children: cards.map((block) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolCallView, {
+			sessionId: props.sessionId,
+			callId: block.callId,
+			phase: "result",
+			block,
+			t: props.t,
+			call: props.call,
+			restoredAnswer: isRecord(block.meta) && typeof block.meta.viewId === "string" ? answers.get(block.meta.viewId) : void 0
+		}, `${props.sessionId}:${block.callId}`))
+	});
+}
+/** Tool activity contains status only, never the user's interactive card. */
+function ToolCallStatus(props) {
+	const read = readToolCall(props);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "dvui-root",
+		role: "status",
+		children: props.t(read.isError ? "error" : read.phase === "result" && !read.presentation ? "invalid" : read.phase === "result" ? "prepared" : "preparing")
+	});
+}
+function apply(ctx) {
+	const client = ctx;
+	ctx.effect(() => client.locale.register(LOCALE, {
+		zh: { ...uiZh },
+		en: { ...uiEn }
+	}), "deep-view.locale");
+	ctx.effect(() => {
+		if (typeof document === "undefined") return () => {};
+		const style = document.createElement("style");
+		style.setAttribute("data-plugin", PLUGIN_NAME);
+		style.textContent = viewStyles;
+		document.head.appendChild(style);
+		return () => style.remove();
+	}, "deep-view.styles");
+	ctx.effect(() => client.slots.inject("tool.call.toolview", () => client.slots.register({
+		name: "tool.call.toolview",
+		key: "show_view",
+		locale: LOCALE
+	}, ToolCallStatus)), "deep-view.tool");
+	ctx.effect(() => client.slots.inject("conversation.chat.turnTail", () => client.slots.register({
+		name: "conversation.chat.turnTail",
+		id: "deep-view",
+		order: 20,
+		locale: LOCALE,
+		inject: () => ({ call: (endpoint, payload) => client.connection.rpc.call(RPC_CHANNEL, endpoint, payload) })
+	}, ReplyView)), "deep-view.reply");
+}
+//#endregion
+exports.LOCALE = LOCALE;
+exports.ReplyView = ReplyView;
+exports.ToolCallStatus = ToolCallStatus;
+exports.ToolCallView = ToolCallView;
+exports.apply = apply;
+exports.inject = inject;
+exports.name = name;
+exports.readToolCall = readToolCall;
+exports.replyCards = replyCards;
+exports.uiEn = uiEn;
+exports.uiZh = uiZh;
+exports.useMarkdownLabels = useMarkdownLabels;
+
+//# sourceMappingURL=client.inner.cjs.map
+    return module.exports;
+  }
+});