@morlay/dsh-client-ui-primitives 0.0.7 → 0.0.8

package/dist/client.mjs

@@ -2,9 +2,10 @@ import { n as __exportAll, t as __commonJSMin } from "./rolldown-runtime-EAsCxrD
 import { a as parseReference, i as isLocalReference, n as formatReference, o as parseReferenceToken, r as formatReferenceMention, t as findReferences } from "./reference-Cjcn21uW.mjs";
 import { createSnapshotStore } from "@deepseek-ai/dsh-client-store";
 import { Service } from "@deepseek-ai/cordis";
-import { cloneElement, createElement, forwardRef, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
-import { IconCheckOutlineRegular, IconChevronDownOutlineRegular, IconChevronRightOutlineRegular, IconCloseOutlineRegular, IconCopyOutlineRegular, IconRefreshOutlineRegular, IconTrashOutlineRegular, Input, MarkdownText, Menu, SettingsForm as SettingsForm$1, Tooltip } from "@deepseek-ai/dsh-client-ui-primitives";
+import { cloneElement, forwardRef, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
+import { Button as Button$1, DisclosureRow as DisclosureRow$1, IconCheckOutlineRegular, IconChevronDownOutlineRegular, IconChevronRightOutlineRegular, IconCloseOutlineRegular, IconCopyOutlineRegular, IconRefreshOutlineRegular, IconTrashOutlineRegular, Input, MarkdownText, Menu, MenuItemButton, SettingsForm, Tooltip, rankByName } from "@deepseek-ai/dsh-client-ui-primitives";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+export * from "@deepseek-ai/dsh-client-ui-primitives";
 function emptyMeta() {
 	return {
 		description: void 0,
@@ -922,7 +923,7 @@ var SchemaFormController = class {
 		return this.#ns;
 	}
 	refresh() {
-		this.#store.set(this.#project());
+		this.#sync();
 	}
 	dispose() {
 		for (const dispose of this.#disposers.splice(0)) dispose();
@@ -1442,1219 +1443,38 @@ function isPrefix(prefix, path) {
 	return prefix.every((segment, index) => path[index] === segment);
 }
 //#endregion
-//#region src/client/styling/toolkit.ts
-function isUndefined(value) {
-	return value === void 0;
-}
-function isNull(value) {
-	return value === null;
-}
-function isString(value) {
-	return typeof value === "string";
-}
-function isFunction(value) {
-	return typeof value === "function";
-}
-function isPlainObject(value) {
-	return typeof value === "object" && value !== null && !Array.isArray(value);
-}
-function toMerged(target, source) {
-	if (!isPlainObject(target) || !isPlainObject(source)) return source;
-	const result = { ...target };
-	for (const [key, value] of Object.entries(source)) result[key] = key in result ? toMerged(result[key], value) : value;
-	return result;
-}
-function mapKeys(source, map) {
-	const result = {};
-	for (const [key, value] of Object.entries(source)) result[map(key, value)] = value;
-	return result;
-}
-//#endregion
-//#region src/client/styling/token.ts
-const cssVarSymbol = Symbol("cssVar");
-const tokensSymbol = Symbol("tokens");
-const tokenInstSymbol = Symbol("tokenInst");
-const SELF = "$";
-function tokenVars(token, tokens, path) {
-	const reserved = /* @__PURE__ */ new Set([
-		"constructor",
-		"toJSON",
-		"__proto__"
-	]);
-	return new Proxy(() => {}, {
-		apply() {
-			return Token.fallbackVar(token.cssVar(path));
-		},
-		get(_target, property) {
-			if (property === Symbol.toPrimitive || property === Symbol.toStringTag || property === "toString") return () => `var(${token.cssVar(path)})`;
-			if (property === "valueOf") return () => Token.fallbackVar(token.cssVar(path));
-			if (property === tokenInstSymbol) return token;
-			if (property === tokensSymbol) return tokens;
-			if (property === cssVarSymbol) return token.cssVar(path);
-			if (!isString(property) || reserved.has(property)) return void 0;
-			const next = tokens[property];
-			if (isUndefined(next)) return void 0;
-			return tokenVars(token, next, [...path, property]);
-		}
-	});
-}
-var Token = class Token {
-	prefix;
-	static vars(tokens, options = {}) {
-		return tokenVars(new Token(options.prefix ?? ""), tokens, []);
-	}
-	static extendsVars(vars, extra) {
-		const tokens = vars[tokensSymbol] ?? {};
-		return Token.vars(toMerged(tokens, extra));
-	}
-	static assignVars(vars, overwrites) {
-		const tokens = overwrites ?? vars[tokensSymbol] ?? {};
-		const token = vars[tokenInstSymbol] ?? new Token("");
-		const result = {};
-		for (const [name, value] of flattenTokens(token, tokens, [])) result[name] = token.normalize(value);
-		return result;
-	}
-	static variants(variants) {
-		return mapKeys(variants, (key) => `&[data-variant="${key}"]`);
-	}
-	static val(strings, ...values) {
-		return function* () {
-			for (let index = 0; index < strings.length; index += 1) {
-				const literal = strings[index];
-				if (literal) yield literal;
-				if (index >= values.length) continue;
-				const value = values[index];
-				yield* isFunction(value) ? value() : [value];
-			}
-		};
-	}
-	static calc(strings, ...values) {
-		return combinator("calc(", ")", strings, values);
-	}
-	static min(strings, ...values) {
-		return combinator("min(", ")", strings, values);
-	}
-	static max(strings, ...values) {
-		return combinator("max(", ")", strings, values);
-	}
-	static url(strings, ...values) {
-		return combinator("url(", ")", strings, values);
-	}
-	static colorMix(strings, ...values) {
-		return combinator("color-mix(", ")", strings, values);
-	}
-	static colorScale(color, options = {}) {
-		const channel = (name, amount, max) => Token.calc`${name} + (${String(max)} - ${name}) * max(${amount}, 0) + ${name} * min(${amount}, 0)`;
-		const mix = (from, to, amount) => Token.colorMix`in srgb, ${from}, ${to} ${Token.calc`${amount} * 100%`}`;
-		let result = color;
-		if (!isUndefined(options.alpha) || !isUndefined(options.lightness) || !isUndefined(options.saturation)) result = Token.val`hsl(from ${result} h ${isUndefined(options.saturation) ? "s" : channel("s", options.saturation, 100)} ${isUndefined(options.lightness) ? "l" : channel("l", options.lightness, 100)} / ${isUndefined(options.alpha) ? "alpha" : channel("alpha", options.alpha, 1)})`;
-		if (!isUndefined(options.whiteness)) result = mix(result, "white", options.whiteness);
-		if (!isUndefined(options.blackness)) result = mix(result, "black", options.blackness);
-		return result;
-	}
-	static fallbackVar(value, ...fallbacks) {
-		return Object.assign(function* () {
-			yield "var(";
-			for (const [index, item] of [value, ...fallbacks].entries()) {
-				if (index > 0) yield ", ";
-				yield* asIterable(item);
-			}
-			yield ")";
-		}, { [cssVarSymbol]: value });
-	}
-	static collect(value) {
-		const iterable = isFunction(value) ? value() : value;
-		let result = "";
-		for (const item of iterable) result += `${item}`;
-		return result;
-	}
-	constructor(prefix = "") {
-		this.prefix = prefix;
-	}
-	prop = (key) => key.startsWith("--") ? key : kebabCase(key);
-	normalize = (input) => {
-		const value = isFunction(input) ? input() : input;
-		if (typeof value === "number") return `${value}`;
-		if (typeof value === "string") return value;
-		if (isUndefined(value) || isNull(value)) return "";
-		if (isFunction(value)) return Token.collect(value);
-		if (isPlainObject(value) && Symbol.iterator in value) return Token.collect(value);
-		return "";
-	};
-	cssVar = (paths) => `--${[this.prefix, ...paths].filter(Boolean).join("-")}`;
-};
-function combinator(open, close, strings, values) {
-	return function* () {
-		yield open;
-		yield* Token.val(strings, ...values)();
-		yield close;
-	};
-}
-function* asIterable(value) {
-	const resolved = isFunction(value) ? value() : value;
-	const variable = resolved?.[cssVarSymbol];
-	if (!isUndefined(variable)) {
-		yield variable;
-		return;
-	}
-	if (typeof resolved === "object" && resolved !== null && Symbol.iterator in resolved) {
-		yield* resolved;
-		return;
-	}
-	yield resolved;
-}
-function* flattenTokens(token, value, parents) {
-	for (const [property, child] of Object.entries(value)) {
-		if (property === SELF) continue;
-		if (isPlainObject(child)) {
-			yield* flattenTokens(token, child, [...parents, property]);
-			continue;
-		}
-		yield [token.cssVar([...parents, property]), child];
-	}
-}
-function kebabCase(value) {
-	return value.replace(/([A-Z])/g, "-$1").toLowerCase();
-}
-//#endregion
-//#region src/client/styling/styling.ts
-var Styling = class Styling {
-	static create() {
-		return new Styling();
-	}
-	static toRule(sheet) {
-		return sheet.selector === void 0 ? sheet.contents.join("") : `${sheet.selector} {${sheet.contents.join("")} }`;
-	}
-	#token = new Token();
-	#sheets = /* @__PURE__ */ new Map();
-	#injected = /* @__PURE__ */ new Set();
-	props = (...styles) => {
-		const merged = mergeStyles(styles);
-		if (Object.keys(merged).length === 0) return {};
-		const sheet = this.#sheet(2, this.#rules(merged));
-		return sheet === void 0 ? {} : { [`data-css-${sheet.id}`]: "" };
-	};
-	keyframes = (frames = {}) => {
-		return this.#sheet(1, this.#rules(frames))?.id ?? "anim-none";
-	};
-	injectGlobals = (styles = {}) => {
-		for (const [name, style] of Object.entries(styles)) this.#sheet(0, this.#rules(style), name);
-	};
-	className = (...styles) => {
-		const merged = mergeStyles(styles);
-		if (Object.keys(merged).length === 0) return "";
-		const sheet = this.#sheet(3, this.#rules(merged));
-		return sheet === void 0 ? "" : `cls-${sheet.id}`;
-	};
-	sheets = () => [...this.#sheets.values()].map((sheet) => Styling.toRule(sheet));
-	#sheet(type, rules, selector) {
-		let hash = 0;
-		const contents = [];
-		for (const rule of rules) {
-			contents.push(rule);
-			hash = incrementalHash(rule, hash);
-		}
-		if (selector !== void 0) hash = incrementalHash(selector, hash);
-		if (hash === 0) return void 0;
-		let id = selector ?? "";
-		if (type === 2) id = `s${hash.toString(36)}`;
-		if (type === 3) id = `c${hash.toString(36)}`;
-		if (type === 0) id = `g${hash.toString(36)}`;
-		if (type === 1) id = `a${hash.toString(36)}`;
-		let resolvedSelector = selector;
-		if (resolvedSelector === void 0) {
-			if (type === 1) resolvedSelector = `@keyframes ${id}`;
-			if (type === 2) resolvedSelector = `[data-css-${id}]`;
-			if (type === 3) resolvedSelector = `.cls-${id}`;
-		}
-		const sheet = {
-			id,
-			contents,
-			selector: resolvedSelector
-		};
-		const existing = this.#sheets.get(id);
-		if (existing !== void 0 && existing.contents.join("") === contents.join("")) return existing;
-		this.#sheets.set(id, sheet);
-		this.#inject(sheet);
-		return sheet;
-	}
-	#inject(sheet) {
-		if (this.#injected.has(sheet.id)) return;
-		this.#injected.add(sheet.id);
-		if (typeof document === "undefined") return;
-		const element = document.createElement("style");
-		element.setAttribute("data-css", sheet.id);
-		element.textContent = Styling.toRule(sheet);
-		document.head.appendChild(element);
-	}
-	*#rules(styles) {
-		const nested = /* @__PURE__ */ new Map();
-		for (const [key, value] of Object.entries(styles)) {
-			if (isNull(value) || isUndefined(value)) continue;
-			if (isPlainObject(value)) {
-				nested.set(key, value);
-				continue;
-			}
-			yield ` ${this.#token.prop(key)}: ${this.#token.normalize(value)};`;
-		}
-		for (const [key, value] of nested.entries()) {
-			yield ` ${key} {`;
-			yield* this.#rules(value);
-			yield " }";
-		}
-	}
-};
-function mergeStyles(styles) {
-	return styles.reduce((accumulated, style) => style ? toMerged(accumulated, style) : accumulated, {});
-}
-function incrementalHash(value, previous = 0) {
-	let hash = previous;
-	for (let index = 0; index < value.length; index += 1) {
-		hash = (hash << 5) - hash + value.charCodeAt(index);
-		hash &= 2147483647;
-	}
-	return hash;
-}
-const STYLING_SINGLETON = Symbol.for("@morlay/dsh-client-ui-primitives/styling");
-const globalScope = globalThis;
-const styling = globalScope[STYLING_SINGLETON] ??= Styling.create();
-//#endregion
-//#region src/client/styling/styled.tsx
-const sxSymbol = Symbol("styled.sx");
-function styled(Component, defaultProps = {}) {
-	return (...styles) => {
-		const sx = styles.reduce((merged, style) => toMerged(merged, style), {});
-		const Styled = forwardRef((props, ref) => {
-			const styleProps = useMemo(() => styling.props(sx), []);
-			return createElement(Component, {
-				...defaultProps,
-				...props,
-				...styleProps,
-				ref
-			});
-		});
-		Styled.displayName = `styled(${typeof Component === "string" ? Component : Component.displayName ?? Component.name ?? "Component"})`;
-		return Object.assign(Styled, { [sxSymbol]: sx });
-	};
-}
-function styleOf(component) {
-	return component[sxSymbol];
-}
-//#endregion
-//#region src/client/theme.generated.ts
-const designTokens = {
-	alias: {
-		bg: {
-			base: "var(--dsw-static-neutral-bluish-00)",
-			document: {
-				preview: "var(--dsw-static-neutral-bluish-100)",
-				selection: "color-mix(in srgb, var(--dsw-static-blue-500) 40%, transparent)"
-			},
-			layer: {
-				"1": "var(--dsw-static-neutral-bluish-00)",
-				"2": "var(--dsw-static-neutral-bluish-00)",
-				"3": "var(--dsw-static-neutral-bluish-00)"
-			},
-			mask: {
-				"1": "rgba(0, 0, 0, 0.24)",
-				"2": "rgba(0, 0, 0, 0.12)",
-				"3": "rgba(0, 0, 0, 0.48)",
-				drop: "rgba(255, 255, 255, 0.7)",
-				photo: "rgba(0, 0, 0, 0.88)"
-			},
-			module: { platform: "var(--dsw-static-neutral-bluish-60)" },
-			multi: { select: "var(--dsw-static-neutral-bluish-60)" },
-			overlay: "var(--dsw-static-neutral-bluish-150)",
-			skeleton: "rgba(0, 0, 0, 0.04)"
-		},
-		border: {
-			inverted: "rgba(0, 0, 0, 0)",
-			inverted2: "rgba(0, 0, 0, 0)",
-			l1: "rgba(0, 0, 0, 0.04)",
-			l2: {
-				$: "rgba(0, 0, 0, 0.1)",
-				darkmode: { thin: "rgba(0, 0, 0, 0.1)" }
-			},
-			l3: "rgba(0, 0, 0, 0.12)",
-			l4: "rgba(0, 0, 0, 0.16)"
-		},
-		brand: {
-			primary: {
-				$: "var(--dsw-static-neutral-bluish-1000)",
-				invert: "var(--dsw-static-neutral-bluish-1000)",
-				new: { colorprimary: { new: { color: "rgb(65, 118, 230)" } } }
-			},
-			text: "var(--dsw-static-neutral-bluish-1000)"
-		},
-		button: {
-			contrast: { fill: "var(--dsw-static-neutral-bluish-700)" },
-			elevated: { fill: "var(--dsw-static-neutral-bluish-00)" },
-			floating: {
-				fill: "var(--dsw-static-neutral-bluish-00)",
-				hover: "var(--dsw-static-neutral-bluish-75)"
-			},
-			ghost: { active: {
-				border: "var(--dsw-static-neutral-bluish-500)",
-				fill: "var(--dsw-static-neutral-bluish-100)",
-				hover: "var(--dsw-static-neutral-bluish-150)"
-			} },
-			info: {
-				fill: "var(--dsw-static-deepseek-500)",
-				hover: "var(--dsw-static-deepseek-400)"
-			},
-			primary: {
-				dimmed: "var(--dsw-static-neutral-bluish-100)",
-				fill: "var(--dsw-alias-brand-primary)",
-				hover: "var(--dsw-static-neutral-bluish-750)"
-			},
-			tool: { bar: {
-				fill: {
-					$: "rgba(84, 85, 87, 0.5)",
-					invisible: "rgba(31, 31, 31, 0.36)"
-				},
-				hover: "rgba(84, 85, 87, 0.6)"
-			} }
-		},
-		code: { diff: {
-			added: "var(--dsw-static-green-500-a08)",
-			deleted: "var(--dsw-static-red-600-a08)"
-		} },
-		file: { diff: {
-			added: {
-				bg: "rgb(230, 244, 231)",
-				gutter: "rgb(237, 247, 237)",
-				marker: "rgb(1, 162, 65)"
-			},
-			deleted: {
-				bg: "rgb(252, 230, 226)",
-				gutter: "rgb(253, 236, 233)",
-				marker: "rgb(186, 39, 35)"
-			}
-		} },
-		interactive: { bg: {
-			active: "rgba(38, 49, 72, 0.1)",
-			hover: {
-				$: "rgba(38, 49, 72, 0.06)",
-				accent: "rgba(38, 49, 72, 0.14)",
-				danger: "rgba(236, 19, 19, 0.05)",
-				solid: "var(--dsw-static-neutral-bluish-75)"
-			}
-		} },
-		label: {
-			caption: "var(--dsw-static-neutral-bluish-400)",
-			deep: { diving: {
-				$: "color-mix(in srgb, var(--dsw-static-deepseek-500) 70%, var(--dsw-static-blue-950))",
-				shimmer: "color-mix(in srgb, var(--dsw-static-deepseek-500) 30%, var(--dsw-static-blue-950))"
-			} },
-			dimmed: "var(--dsw-static-neutral-bluish-200)",
-			document: { preview: "var(--dsw-static-neutral-bluish-700)" },
-			primary: {
-				$: "var(--dsw-static-neutral-bluish-1000)",
-				bluish: "var(--dsw-static-blue-900)",
-				dimmed: "var(--dsw-static-neutral-bluish-950)",
-				foreground: "var(--dsw-static-neutral-bluish-00)",
-				inverted: "var(--dsw-static-neutral-bluish-00)"
-			},
-			secondary: "var(--dsw-static-neutral-bluish-700)",
-			shimmer: "color-mix(in srgb, var(--dsw-static-neutral-1000) 30%, transparent)",
-			tertiary: "var(--dsw-static-neutral-bluish-600)"
-		},
-		link: "var(--dsw-static-deepseek-500)",
-		markdown: {
-			citation: "var(--dsw-static-neutral-bluish-100)",
-			code: {
-				block: {
-					$: "var(--dsw-static-neutral-bluish-50)",
-					banner: "var(--dsw-static-neutral-bluish-50)"
-				},
-				segment: {
-					selected: "var(--dsw-static-neutral-bluish-00)",
-					unselected: "var(--dsw-static-neutral-bluish-75)"
-				}
-			},
-			inline: { code: "var(--dsw-static-neutral-50)" },
-			placeholder: "var(--dsw-static-neutral-bluish-60)",
-			tag: "var(--dsw-static-neutral-bluish-75)"
-		},
-		menu: {
-			group: { header: { fill: "rgba(248, 249, 250, 0.94)" } },
-			icon: "var(--dsw-static-neutral-bluish-800)"
-		},
-		onboarding: {
-			accent: "rgb(57, 100, 254)",
-			card: { fill: "color-mix(in srgb, var(--dsw-static-neutral-bluish-00) 80%, transparent)" },
-			checkbox: { border: "color-mix(in srgb, var(--dsw-static-neutral-bluish-1000) 20%, transparent)" },
-			secondary: { fill: "var(--dsw-static-neutral-bluish-00)" }
-		},
-		scrollbar: {
-			bg: {
-				l1: "var(--dsw-static-neutral-200)",
-				l2: "var(--dsw-static-neutral-200)"
-			},
-			hover: {
-				l1: "var(--dsw-static-neutral-300)",
-				l2: "var(--dsw-static-neutral-300)"
-			}
-		},
-		settings: { card: {
-			fill: "var(--dsw-alias-bg-layer-2)",
-			stroke: "var(--dsw-alias-border-l4)"
-		} },
-		state: {
-			business: {
-				primary: "var(--dsw-static-deepseek-500)",
-				tertiary: "var(--dsw-static-deepseek-100)"
-			},
-			error: {
-				primary: "var(--dsw-static-red-600)",
-				secondary: "var(--dsw-static-red-400)"
-			},
-			idle: { primary: "var(--dsw-static-neutral-300)" },
-			success: {
-				primary: "var(--dsw-static-green-500)",
-				secondary: "var(--dsw-static-green-400)",
-				tertiary: "var(--dsw-static-green-100)"
-			},
-			warn: {
-				label: "var(--dsw-static-amber-600)",
-				primary: "var(--dsw-static-amber-500)",
-				secondary: "var(--dsw-static-amber-400)",
-				tertiary: "var(--dsw-static-amber-100)"
-			}
-		},
-		switch: { thumb: "var(--dsw-static-neutral-bluish-00)" },
-		toast: {
-			bg: "var(--dsw-static-neutral-bluish-800)",
-			label: "var(--dsw-static-neutral-bluish-00)"
-		},
-		tooltip: {
-			bg: "var(--dsw-static-neutral-bluish-850)",
-			key: { bg: "color-mix(in srgb, var(--dsw-alias-tooltip-bg), white 18%)" }
-		},
-		turn: { trigger: { bg: {
-			$: "var(--dsw-alias-markdown-code-block)",
-			hover: "var(--dsw-alias-interactive-bg-hover)"
-		} } }
-	},
-	corner: { shape: "superellipse(1.5)" },
-	elevation: {
-		panel: "var(--dsw-elevation-stroke), 0 3px 8px 0 rgba(0, 0, 0, 0.03), 0 0 16px 0 rgba(0, 0, 0, 0.02)",
-		prominent: "var(--dsw-elevation-stroke), 0 3px 8px 0 rgba(0, 0, 0, 0.04), 0 0 20px 0 rgba(0, 0, 0, 0.05)",
-		soft: "var(--dsw-elevation-stroke), 0 4px 16px 0 rgba(0, 0, 0, 0.03), 0 0 24px 0 rgba(0, 0, 0, 0.03)",
-		stroke: {
-			$: "0 0 0 0.5px var(--dsw-elevation-stroke-color)",
-			color: "var(--dsw-alias-border-l4)"
-		}
-	},
-	focus: { ring: {
-		color: "transparent",
-		width: "2px"
-	} },
-	font: {
-		base: {
-			"16": {
-				$: "16px/24px var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "16px",
-					style: "normal",
-					weight: "400"
-				},
-				line: { height: "24px" }
-			},
-			strong: { "16": {
-				$: "500 16px/24px var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "16px",
-					style: "normal",
-					weight: "500"
-				},
-				line: { height: "24px" }
-			} }
-		},
-		family: {
-			$: "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC',\n    'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif",
-			brand: "'Montserrat', var(--dsw-font-family)"
-		},
-		l: { "20": {
-			$: "500 20px/28px var(--dsw-font-family)",
-			font: {
-				family: "var(--dsw-font-family)",
-				size: "20px",
-				style: "normal",
-				weight: "500"
-			},
-			line: { height: "28px" }
-		} },
-		m: { "18": {
-			$: "500 16px/28px var(--dsw-font-family)",
-			font: {
-				family: "var(--dsw-font-family)",
-				size: "16px",
-				style: "normal",
-				weight: "500"
-			},
-			line: { height: "28px" }
-		} },
-		markdown: {
-			base: {
-				$: "var(--dsh-content-font-size, 14px) / calc(24px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "var(--dsh-content-font-size, 14px)",
-					style: "normal",
-					weight: "400"
-				},
-				italic: {
-					$: "italic var(--dsh-content-font-size, 14px) / calc(24px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
-					font: {
-						family: "var(--dsw-font-family)",
-						size: "var(--dsh-content-font-size, 14px)",
-						style: "italic",
-						weight: "400"
-					},
-					line: { height: "calc(24px + var(--dsh-content-font-delta))" }
-				},
-				line: { height: "calc(24px + var(--dsh-content-font-delta))" },
-				strong: {
-					$: "600 var(--dsh-content-font-size, 14px) / calc(24px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
-					font: {
-						family: "var(--dsw-font-family)",
-						size: "var(--dsh-content-font-size, 14px)",
-						style: "normal",
-						weight: "600"
-					},
-					italic: {
-						$: "italic 600 var(--dsh-content-font-size, 14px) / calc(24px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
-						font: {
-							family: "var(--dsw-font-family)",
-							size: "var(--dsh-content-font-size, 14px)",
-							style: "italic",
-							weight: "600"
-						},
-						line: { height: "calc(24px + var(--dsh-content-font-delta))" }
-					},
-					line: { height: "calc(24px + var(--dsh-content-font-delta))" }
-				}
-			},
-			code: {
-				$: "12px/19px var(--ds-font-family-code)",
-				block: {
-					$: "11px/19px var(--ds-font-family-code)",
-					font: {
-						family: "var(--ds-font-family-code)",
-						size: "11px",
-						style: "normal",
-						weight: "400"
-					},
-					line: { height: "19px" },
-					small: {
-						$: "11px/16px var(--ds-font-family-code)",
-						font: {
-							family: "var(--ds-font-family-code)",
-							size: "11px",
-							style: "normal",
-							weight: "400"
-						},
-						line: { height: "16px" }
-					}
-				},
-				font: {
-					family: "var(--ds-font-family-code)",
-					size: "12px",
-					style: "normal",
-					weight: "400"
-				},
-				line: { height: "19px" }
-			},
-			h1: {
-				$: "700 calc(21px + var(--dsh-content-font-delta)) / calc(30px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "calc(21px + var(--dsh-content-font-delta))",
-					style: "normal",
-					weight: "700"
-				},
-				line: { height: "calc(30px + var(--dsh-content-font-delta))" }
-			},
-			h2: {
-				$: "700 calc(19px + var(--dsh-content-font-delta)) / calc(28px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "calc(19px + var(--dsh-content-font-delta))",
-					style: "normal",
-					weight: "700"
-				},
-				line: { height: "calc(28px + var(--dsh-content-font-delta))" }
-			},
-			h3: {
-				$: "700 calc(18px + var(--dsh-content-font-delta)) / calc(26px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "calc(18px + var(--dsh-content-font-delta))",
-					style: "normal",
-					weight: "700"
-				},
-				line: { height: "calc(26px + var(--dsh-content-font-delta))" }
-			},
-			h4: {
-				$: "600 var(--dsh-content-font-size, 14px) / calc(24px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "var(--dsh-content-font-size, 14px)",
-					style: "normal",
-					weight: "600"
-				},
-				line: { height: "calc(24px + var(--dsh-content-font-delta))" }
-			},
-			small: {
-				$: "12px/20px var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "12px",
-					style: "normal",
-					weight: "400"
-				},
-				italic: {
-					$: "italic 12px/20px var(--dsw-font-family)",
-					font: {
-						family: "var(--dsw-font-family)",
-						size: "12px",
-						style: "italic",
-						weight: "400"
-					},
-					line: { height: "20px" }
-				},
-				line: { height: "20px" },
-				strong: {
-					$: "600 12px/20px var(--dsw-font-family)",
-					font: {
-						family: "var(--dsw-font-family)",
-						size: "12px",
-						style: "normal",
-						weight: "600"
-					},
-					italic: {
-						$: "italic 600 12px/20px var(--dsw-font-family)",
-						font: {
-							family: "var(--dsw-font-family)",
-							size: "12px",
-							style: "italic",
-							weight: "600"
-						},
-						line: { height: "20px" }
-					},
-					line: { height: "20px" }
-				}
-			},
-			table: {
-				$: "var(--dsh-content-font-size-secondary, 13px)/calc(22px + var(--dsh-content-font-delta-secondary, 0px)) var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "var(--dsh-content-font-size-secondary, 13px)",
-					style: "normal",
-					weight: "400"
-				},
-				head: {
-					$: "500 var(--dsh-content-font-size-secondary, 13px)/calc(22px + var(--dsh-content-font-delta-secondary, 0px)) var(--dsw-font-family)",
-					font: {
-						family: "var(--dsw-font-family)",
-						size: "var(--dsh-content-font-size-secondary, 13px)",
-						style: "normal",
-						weight: "500"
-					},
-					line: { height: "calc(22px + var(--dsh-content-font-delta-secondary, 0px))" }
-				},
-				line: { height: "calc(22px + var(--dsh-content-font-delta-secondary, 0px))" }
-			}
-		},
-		s: {
-			"14": {
-				$: "14px/22px var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "14px",
-					style: "normal",
-					weight: "400"
-				},
-				line: { height: "22px" }
-			},
-			strong: { "14": {
-				$: "500 14px/22px var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "14px",
-					style: "normal",
-					weight: "500"
-				},
-				line: { height: "22px" }
-			} }
-		},
-		xl: { "24": {
-			$: "600 24px/32px var(--dsw-font-family)",
-			font: {
-				family: "var(--dsw-font-family)",
-				size: "24px",
-				style: "normal",
-				weight: "600"
-			},
-			line: { height: "32px" }
-		} },
-		xs: {
-			"13": {
-				$: "13px/20px var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "13px",
-					style: "normal",
-					weight: "400"
-				},
-				line: { height: "20px" }
-			},
-			strong: { "13": {
-				$: "500 13px/20px var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "13px",
-					style: "normal",
-					weight: "500"
-				},
-				line: { height: "20px" }
-			} }
-		},
-		xxs: {
-			"12": {
-				$: "12px/18px var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "12px",
-					style: "normal",
-					weight: "400"
-				},
-				line: { height: "18px" }
-			},
-			strong: { "12": {
-				$: "500 12px/18px var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "12px",
-					style: "normal",
-					weight: "500"
-				},
-				line: { height: "18px" }
-			} }
-		},
-		xxxs: {
-			"11": {
-				$: "11px/14px var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "11px",
-					style: "normal",
-					weight: "400"
-				},
-				line: { height: "14px" }
-			},
-			strong: { "11": {
-				$: "500 11px/14px var(--dsw-font-family)",
-				font: {
-					family: "var(--dsw-font-family)",
-					size: "11px",
-					style: "normal",
-					weight: "500"
-				},
-				line: { height: "14px" }
-			} }
-		}
-	},
-	gradient: { onboarding: {
-		blue: { stops: "#3964fe 18.75%, #398efe 51.78%, #6dccff 86.252%, #3964fe" },
-		cyan: { stops: "#0293b4 21.154%, #2dc8eb 50.954%, #aff0ff 85.326%, #0293b4" },
-		violet: { stops: "#2a2fb6 33.102%, #8b76f6 50.954%, #c5c0ff 85.326%, #2a2fb6" }
-	} },
-	linear: {
-		gradient: { think: "linear-gradient(180deg, #fff 20.19%, rgba(255, 255, 255, 0) 100%)" },
-		think: { select: "linear-gradient(180deg, #f5f6f7 20.19%, rgba(245, 246, 247, 0) 100%)" }
-	},
-	mask: { blur: "none" },
-	menu: {
-		backdrop: { filter: "blur(40px) saturate(150%)" },
-		surface: { fill: "rgba(248, 249, 250, 0.58)" }
-	},
-	radius: {
-		lg: "16px",
-		md: "12px",
-		panel: "28px",
-		sm: "8px",
-		xl: "20px",
-		xs: "4px"
-	},
-	shadow: {
-		lv1: {
-			$: "0 2px 4px 0 rgba(0, 0, 0, 0.05)",
-			blur: "0 4px 12px 0 rgba(0, 0, 0, 0.02)"
-		},
-		lv2: "0 4px 12px 0 rgba(0, 0, 0, 0.02), 0 2px 8px 0 rgba(0, 0, 0, 0.04)",
-		lv3: "0 0 1px 0 rgba(0, 0, 0, 0.2), 0 0 4px 0 rgba(0, 0, 0, 0.02), 0 12px 32px 0 rgba(0, 0, 0, 0.08)"
-	},
-	specific: {
-		bubble: {
-			$: "var(--dsw-static-deepseek-50)",
-			highlight: "var(--dsw-static-deepseek-200)"
-		},
-		input: { major: "var(--dsw-static-neutral-bluish-00)" },
-		login: { input: "var(--dsw-static-neutral-bluish-50)" },
-		menu: "var(--dsw-menu-surface-fill)",
-		selector: "var(--dsw-static-neutral-bluish-60)",
-		sidebar: {
-			fill: "var(--dsw-static-neutral-bluish-50)",
-			nav: { item: {
-				active: {
-					$: "var(--dsw-static-neutral-bluish-100)",
-					accent: "var(--dsw-static-deepseek-100)"
-				},
-				hover: "var(--dsw-static-neutral-bluish-75)"
-			} }
-		},
-		tip: "var(--dsw-static-neutral-bluish-60)"
-	},
-	static: {
-		amber: {
-			"100": "rgb(254, 245, 231)",
-			"400": "rgb(247, 173, 49)",
-			"500": "rgb(245, 158, 11)",
-			"600": "rgb(221, 134, 41)",
-			"900": "rgb(39, 36, 31)"
-		},
-		blue: {
-			"50": "rgb(239, 246, 255)",
-			"75": "rgb(229, 240, 255)",
-			"100": "rgb(219, 234, 254)",
-			"300": "rgb(147, 197, 253)",
-			"400": "rgb(96, 165, 250)",
-			"450": "rgb(77, 147, 248)",
-			"500": "rgb(59, 130, 246)",
-			"600": "rgb(37, 99, 235)",
-			"800": "rgb(30, 64, 175)",
-			"900": "rgb(14, 48, 116)",
-			"950": "rgb(23, 37, 84)",
-			"50p": "rgb(234, 243, 255)"
-		},
-		deepseek: {
-			"50": "rgb(237, 243, 254)",
-			"100": "rgb(228, 237, 253)",
-			"200": "rgb(211, 226, 255)",
-			"300": "rgb(183, 200, 254)",
-			"400": "rgb(122, 170, 255)",
-			"450": "rgb(86, 134, 254)",
-			"500": "rgb(65, 118, 230)",
-			"600": "rgb(72, 104, 178)",
-			"700": { delete: "rgb(47, 76, 143)" },
-			"800": "rgb(52, 65, 91)",
-			"900": "rgb(40, 49, 66)"
-		},
-		green: {
-			"100": "rgb(230, 250, 237)",
-			"400": "rgb(78, 209, 126)",
-			"500": {
-				$: "rgb(34, 197, 94)",
-				a08: "rgb(34 197 94 / 8%)",
-				a12: "rgb(34 197 94 / 12%)"
-			},
-			"900": "rgb(35, 60, 44)"
-		},
-		neutral: {
-			"50": "rgb(250, 250, 250)",
-			"100": "rgb(245, 245, 245)",
-			"150": "rgb(237, 237, 237)",
-			"200": "rgb(229, 229, 229)",
-			"250": "rgb(220, 220, 220)",
-			"300": "rgb(212, 212, 212)",
-			"400": "rgb(162, 164, 166)",
-			"500": "rgb(127, 130, 135)",
-			"550": "rgb(101, 103, 107)",
-			"600": "rgb(84, 85, 87)",
-			"700": "rgb(60, 60, 61)",
-			"800": "rgb(41, 41, 41)",
-			"850": "rgb(33, 33, 35)",
-			"900": "rgb(15, 15, 15)",
-			"1000": "rgb(0, 0, 0)",
-			"00": "rgb(255, 255, 255)",
-			bluish: {
-				"50": "rgb(249, 250, 251)",
-				"60": "rgb(245, 246, 247)",
-				"75": "rgb(241, 243, 245)",
-				"100": "rgb(235, 238, 242)",
-				"150": "rgb(233, 236, 242)",
-				"200": "rgb(225, 229, 238)",
-				"300": "rgb(207, 211, 214)",
-				"400": "rgb(173, 178, 184)",
-				"500": "rgb(151, 157, 166)",
-				"600": "rgb(129, 133, 140)",
-				"700": "rgb(97, 102, 107)",
-				"750": "rgb(67, 69, 74)",
-				"800": "rgb(53, 54, 56)",
-				"850": "rgb(44, 44, 46)",
-				"875": "rgb(35, 35, 36)",
-				"900": "rgb(27, 27, 28)",
-				"950": "rgb(21, 21, 23)",
-				"1000": "rgb(15, 17, 21)",
-				"00": "rgb(255, 255, 255)"
-			}
-		},
-		red: {
-			"50": "rgb(254, 242, 242)",
-			"100": "rgb(254, 226, 226)",
-			"400": {
-				$: "rgb(242, 90, 90)",
-				a12: "rgb(242 90 90 / 12%)"
-			},
-			"500": "rgb(239, 68, 68)",
-			"600": {
-				$: "rgb(236, 19, 19)",
-				a08: "rgb(236 19 19 / 8%)"
-			},
-			"900": "rgb(87, 12, 12)"
-		}
-	}
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/schema-form/schema-form.module.css.mjs
+const css$16 = ".B1Faoa_editorRoot{width:100%;color:var(--dsw-alias-label-primary);flex-direction:column;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,monospace;font-size:14px;line-height:22px;display:flex}.B1Faoa_lineRow{white-space:nowrap;align-items:flex-start;gap:6px;min-height:22px;padding-right:8px;display:flex}.B1Faoa_lineRow:hover{background:var(--dsw-alias-bg-layer-2)}.B1Faoa_lineRow[data-selected=true]{background:var(--dsw-alias-bg-layer-3)}.B1Faoa_lineRow[data-dirty=true]{box-shadow:inset 2px 0 0 var(--dsw-alias-brand-primary)}.B1Faoa_lineRow[data-overridden=true]{box-shadow:inset 2px 0 0 var(--dsw-elevation-stroke-color)}.B1Faoa_lineRow[data-dirty=true] [data-role=key],.B1Faoa_lineRow[data-overridden=true] [data-role=key]{color:var(--dsw-alias-brand-primary)}.B1Faoa_lineRow[data-invalid=true]{background:color-mix(in srgb, var(--dsw-alias-state-error-secondary) 12%, transparent);box-shadow:inset 2px 0 0 var(--dsw-alias-state-error-primary)}.B1Faoa_lineRow[data-invalid=true] [data-role=key]{color:var(--dsw-alias-state-error-primary)}.B1Faoa_lineRow:hover [data-role=actions]{opacity:1}.B1Faoa_lineBody{flex:1;align-items:center;gap:6px;min-width:0;min-height:22px;display:flex}.B1Faoa_lineNumber{text-align:right;width:32px;color:var(--dsw-alias-label-caption);user-select:none;cursor:pointer;flex:none;line-height:22px}.B1Faoa_lineFold{width:14px;height:22px;color:var(--dsw-alias-label-caption);cursor:pointer;background:0 0;border:0;flex:none;justify-content:center;align-items:center;padding:0;display:inline-flex}.B1Faoa_lineFold:hover{color:var(--dsw-alias-label-secondary)}.B1Faoa_lineFoldSpacer{flex:none;width:14px}.B1Faoa_lineKey{color:var(--dsw-alias-label-primary);flex:none}.B1Faoa_lineKey[data-index=true]{color:var(--dsw-alias-label-caption)}.B1Faoa_lineToken{color:var(--dsw-alias-label-caption);flex:none}.B1Faoa_lineValue{text-overflow:ellipsis;cursor:text;min-width:0;color:var(--dsw-alias-state-business-primary);display:block;overflow:hidden}.B1Faoa_lineValue[data-tone=number]{color:var(--dsw-alias-state-warn-primary)}.B1Faoa_lineValue[data-tone=boolean]{color:var(--dsw-alias-state-success-primary)}.B1Faoa_lineValue[data-tone=empty]{color:var(--dsw-alias-label-caption)}.B1Faoa_valueSlot{flex:0 auto;min-width:0;display:block;overflow:hidden}.B1Faoa_valueTrigger{min-width:0;font:inherit;text-align:left;cursor:pointer;color:var(--dsw-alias-label-caption);background:0 0;border:0;align-items:center;gap:2px;padding:0;display:inline-flex}.B1Faoa_valueTrigger:disabled{cursor:default}.B1Faoa_valueTrigger:focus-visible{outline:none}.B1Faoa_compactInput{flex:auto;min-width:0;display:inline-flex}.B1Faoa_compactInput>span{border-radius:4px;width:100%;height:22px;padding:0 6px}.B1Faoa_compactInput input{font-size:14px;line-height:22px}.B1Faoa_compactTextField{background:var(--dsw-alias-bg-layer-1);min-width:0;box-shadow:0 0 0 .5px var(--dsw-elevation-stroke-color);border:0;border-radius:4px;flex:auto;padding:0 6px;display:inline-flex}.B1Faoa_compactTextField:focus-within{--dsw-elevation-stroke-color:var(--dsw-alias-brand-primary)}.B1Faoa_compactTextField>textarea{resize:none;field-sizing:content;width:100%;min-height:20px;max-height:240px;color:var(--dsw-alias-label-primary);background:0 0;border:0;outline:none;flex:1;padding:0;font-family:inherit;font-size:14px;line-height:22px}.B1Faoa_lineComment{text-overflow:ellipsis;min-width:0;color:var(--dsw-alias-label-tertiary);flex:auto;font-family:inherit;font-size:12px;overflow:hidden}.B1Faoa_lineInvalid{text-overflow:ellipsis;min-width:0;color:var(--dsw-alias-state-error-primary);flex:0 auto;font-family:inherit;font-size:12px;overflow:hidden}.B1Faoa_lineActions{opacity:0;flex:none;align-items:center;gap:4px;display:inline-flex}.B1Faoa_lineActions>button{width:20px;height:20px;color:var(--dsw-alias-label-secondary);cursor:pointer;background:0 0;border:0;border-radius:4px;justify-content:center;align-items:center;padding:0;display:inline-flex}.B1Faoa_lineActions>button:hover{background:var(--dsw-alias-bg-layer-3);color:var(--dsw-alias-label-primary)}.B1Faoa_lineActions>button:disabled{cursor:not-allowed;color:var(--dsw-alias-label-dimmed)}.B1Faoa_hoverActions[data-editing=true]{opacity:1;gap:6px}.B1Faoa_hoverActions[data-editing=true]>button{box-shadow:0 0 0 .5px var(--dsw-elevation-stroke-color);background:var(--dsw-alias-bg-layer-1);color:var(--dsw-alias-label-primary)}.B1Faoa_hoverActions[data-editing=true]>button:first-of-type{color:var(--dsw-alias-state-success-primary)}.B1Faoa_addWrap{flex:auto;align-items:center;gap:6px;min-width:0;margin-left:6px;display:inline-flex;position:relative}.B1Faoa_addWrap[data-invalid=true] input{border-color:var(--dsw-alias-state-error-primary)}.B1Faoa_hint{color:var(--dsw-alias-label-tertiary);margin:0;font-size:12px;line-height:1.5}";
+const tagId$16 = "@morlay/dsh-client-ui-primitives/schema-form.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/schema-form.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$16;
+	tag.textContent = css$16;
+	document.head.appendChild(tag);
+}
+var schema_form_module_css_default = {
+	"compactTextField": "B1Faoa_compactTextField",
+	"editorRoot": "B1Faoa_editorRoot",
+	"lineRow": "B1Faoa_lineRow",
+	"lineActions": "B1Faoa_lineActions",
+	"lineInvalid": "B1Faoa_lineInvalid",
+	"hint": "B1Faoa_hint",
+	"lineKey": "B1Faoa_lineKey",
+	"lineNumber": "B1Faoa_lineNumber",
+	"lineToken": "B1Faoa_lineToken",
+	"valueTrigger": "B1Faoa_valueTrigger",
+	"lineFoldSpacer": "B1Faoa_lineFoldSpacer",
+	"lineComment": "B1Faoa_lineComment",
+	"compactInput": "B1Faoa_compactInput",
+	"addWrap": "B1Faoa_addWrap",
+	"lineFold": "B1Faoa_lineFold",
+	"hoverActions": "B1Faoa_hoverActions",
+	"valueSlot": "B1Faoa_valueSlot",
+	"lineValue": "B1Faoa_lineValue",
+	"lineBody": "B1Faoa_lineBody"
 };
 //#endregion
-//#region src/client/theme.ts
-const dsw = Token.vars(designTokens, { prefix: "dsw" });
-//#endregion
-//#region src/client/schema-form/styles.ts
-const MONO = "ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Consolas, monospace";
-const ROW = "22px";
-const GAP = "6px";
-const ACTION = "20px";
-const ACTION_GAP = "4px";
-const FOLD = "14px";
-const NUMBER = "32px";
-const PAD = "8px";
-const HAIRLINE = dsw.elevation.stroke;
-const LINE = dsw.elevation.stroke.color;
-const EDGE = "2px";
-const ERROR_WASH = `color-mix(in srgb, ${String(dsw.alias.state.error.secondary)} 12%, transparent)`;
-const EditorRoot = styled("div")({
-	display: "flex",
-	flexDirection: "column",
-	width: "100%",
-	fontFamily: MONO,
-	fontSize: "14px",
-	lineHeight: ROW,
-	color: dsw.alias.label.primary
-});
-const LineRow = styled("div")({
-	display: "flex",
-	alignItems: "flex-start",
-	gap: GAP,
-	minHeight: ROW,
-	paddingRight: PAD,
-	whiteSpace: "nowrap",
-	"&:hover": { background: dsw.alias.bg.layer["2"] },
-	"&[data-selected='true']": { background: dsw.alias.bg.layer["3"] },
-	"&[data-dirty='true']": { boxShadow: `inset ${EDGE} 0 0 ${String(dsw.alias.brand.primary)}` },
-	"&[data-overridden='true']": { boxShadow: `inset ${EDGE} 0 0 ${String(LINE)}` },
-	"&[data-dirty='true'] [data-role='key']": { color: dsw.alias.brand.primary },
-	"&[data-overridden='true'] [data-role='key']": { color: dsw.alias.brand.primary },
-	"&[data-invalid='true']": {
-		background: ERROR_WASH,
-		boxShadow: `inset ${EDGE} 0 0 ${String(dsw.alias.state.error.primary)}`
-	},
-	"&[data-invalid='true'] [data-role='key']": { color: dsw.alias.state.error.primary },
-	"&:hover [data-role='actions']": { opacity: 1 }
-});
-const LineBody = styled("div")({
-	display: "flex",
-	alignItems: "center",
-	gap: GAP,
-	flex: 1,
-	minWidth: 0,
-	minHeight: ROW
-});
-const LineNumber = styled("span")({
-	flex: "none",
-	width: NUMBER,
-	lineHeight: ROW,
-	textAlign: "right",
-	color: dsw.alias.label.caption,
-	userSelect: "none",
-	cursor: "pointer"
-});
-const LineFold = styled("button")({
-	display: "inline-flex",
-	alignItems: "center",
-	justifyContent: "center",
-	flex: "none",
-	width: FOLD,
-	height: ROW,
-	padding: 0,
-	border: 0,
-	background: "none",
-	color: dsw.alias.label.caption,
-	cursor: "pointer",
-	"&:hover": { color: dsw.alias.label.secondary }
-});
-const LineFoldSpacer = styled("span")({
-	flex: "none",
-	width: FOLD
-});
-const LineKey = styled("span")({
-	flex: "none",
-	color: dsw.alias.label.primary,
-	"&[data-index='true']": { color: dsw.alias.label.caption }
-});
-const LineToken = styled("span")({
-	flex: "none",
-	color: dsw.alias.label.caption
-});
-const LineValue = styled("span")({
-	display: "block",
-	minWidth: 0,
-	overflow: "hidden",
-	textOverflow: "ellipsis",
-	cursor: "text",
-	color: dsw.alias.state.business.primary,
-	"&[data-tone='number']": { color: dsw.alias.state.warn.primary },
-	"&[data-tone='boolean']": { color: dsw.alias.state.success.primary },
-	"&[data-tone='empty']": { color: dsw.alias.label.caption }
-});
-const ValueSlot = styled("span")({
-	display: "block",
-	flex: "0 1 auto",
-	minWidth: 0,
-	overflow: "hidden"
-});
-const ValueTrigger = styled("button")({
-	display: "inline-flex",
-	alignItems: "center",
-	gap: "2px",
-	minWidth: 0,
-	padding: 0,
-	border: 0,
-	background: "none",
-	font: "inherit",
-	textAlign: "left",
-	cursor: "pointer",
-	color: dsw.alias.label.caption,
-	"&:disabled": { cursor: "default" },
-	"&:focus-visible": { outline: "none" }
-});
-const CompactInput = styled("span")({
-	display: "inline-flex",
-	flex: "1 1 auto",
-	minWidth: 0,
-	"& > span": {
-		width: "100%",
-		height: ROW,
-		padding: "0 6px",
-		borderRadius: "4px"
-	},
-	"& input": {
-		fontSize: "14px",
-		lineHeight: ROW
-	}
-});
-const CompactTextField = styled("span")({
-	display: "inline-flex",
-	flex: "1 1 auto",
-	minWidth: 0,
-	padding: "0 6px",
-	borderRadius: "4px",
-	background: dsw.alias.bg.layer["1"],
-	border: 0,
-	boxShadow: HAIRLINE,
-	"&:focus-within": { "--dsw-elevation-stroke-color": dsw.alias.brand.primary },
-	"& > textarea": {
-		flex: 1,
-		width: "100%",
-		minHeight: ACTION,
-		maxHeight: "240px",
-		padding: 0,
-		border: 0,
-		outline: "none",
-		background: "transparent",
-		resize: "none",
-		fieldSizing: "content",
-		fontFamily: "inherit",
-		fontSize: "14px",
-		lineHeight: ROW,
-		color: dsw.alias.label.primary
-	}
-});
-const LineComment = styled("span")({
-	flex: "1 1 auto",
-	minWidth: 0,
-	overflow: "hidden",
-	textOverflow: "ellipsis",
-	color: dsw.alias.label.tertiary,
-	fontFamily: "inherit",
-	fontSize: "12px"
-});
-const LineInvalid = styled("span")({
-	flex: "0 1 auto",
-	minWidth: 0,
-	overflow: "hidden",
-	textOverflow: "ellipsis",
-	color: dsw.alias.state.error.primary,
-	fontFamily: "inherit",
-	fontSize: "12px"
-});
-const HoverActions = styled(styled("span")({
-	display: "inline-flex",
-	alignItems: "center",
-	gap: ACTION_GAP,
-	flex: "none",
-	opacity: 0,
-	"& > button": {
-		display: "inline-flex",
-		alignItems: "center",
-		justifyContent: "center",
-		width: ACTION,
-		height: ACTION,
-		padding: 0,
-		border: 0,
-		borderRadius: "4px",
-		background: "none",
-		color: dsw.alias.label.secondary,
-		cursor: "pointer",
-		"&:hover": {
-			background: dsw.alias.bg.layer["3"],
-			color: dsw.alias.label.primary
-		},
-		"&:disabled": {
-			cursor: "not-allowed",
-			color: dsw.alias.label.dimmed
-		}
-	}
-}))({ "&[data-editing='true']": {
-	opacity: 1,
-	gap: GAP,
-	"& > button": {
-		boxShadow: HAIRLINE,
-		background: dsw.alias.bg.layer["1"],
-		color: dsw.alias.label.primary,
-		"&:first-of-type": { color: dsw.alias.state.success.primary }
-	}
-} });
-const AddWrap = styled("span")({
-	position: "relative",
-	display: "inline-flex",
-	alignItems: "center",
-	gap: GAP,
-	flex: "1 1 auto",
-	minWidth: 0,
-	marginLeft: GAP,
-	"&[data-invalid='true'] input": { borderColor: dsw.alias.state.error.primary }
-});
-const Hint$1 = styled("p")({
-	margin: 0,
-	fontSize: "12px",
-	lineHeight: 1.5,
-	color: dsw.alias.label.tertiary
-});
-//#endregion
 //#region src/client/schema-form/TruncatedTooltip.tsx
 function TruncatedTooltip({ label, children }) {
 	const node = useRef(null);
@@ -2711,7 +1531,8 @@ function InlineValue({ owner }) {
 		owner,
 		options: owner.options
 	});
-	if (owner.node.meta.secret) return /* @__PURE__ */ jsx(LineValue, {
+	if (owner.node.meta.secret) return /* @__PURE__ */ jsx("span", {
+		className: schema_form_module_css_default.lineValue,
 		"data-tone": "empty",
 		title: owner.hint,
 		children: owner.secretConfigured ? "••••••" : ""
@@ -2719,7 +1540,8 @@ function InlineValue({ owner }) {
 	const text = tokenText(owner.value);
 	return /* @__PURE__ */ jsx(TruncatedTooltip, {
 		label: text,
-		children: /* @__PURE__ */ jsx(LineValue, {
+		children: /* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.lineValue,
 			"data-tone": owner.node.readOnly === null ? tokenTone(owner.value) : "empty",
 			children: text
 		})
@@ -2749,14 +1571,16 @@ function OptionSelect({ owner, options }) {
 		onClose: () => {
 			setOpen(false);
 		},
-		anchor: /* @__PURE__ */ jsxs(ValueTrigger, {
+		anchor: /* @__PURE__ */ jsxs("button", {
+			className: schema_form_module_css_default.valueTrigger,
 			type: "button",
 			disabled: owner.disabled,
 			"aria-label": owner.label,
 			onClick: () => {
 				setOpen(true);
 			},
-			children: [/* @__PURE__ */ jsx(LineValue, {
+			children: [/* @__PURE__ */ jsx("span", {
+				className: schema_form_module_css_default.lineValue,
 				"data-tone": current === void 0 ? tokenTone(owner.value) : tokenTone(current.value),
 				children: label
 			}), /* @__PURE__ */ jsx(IconChevronDownOutlineRegular, { size: 14 })]
@@ -2885,6 +1709,11 @@ function parseFor(node, t) {
 	}
 }
 //#endregion
+//#region src/client/controls/classes.ts
+function classes(...names) {
+	return names.filter((name) => typeof name === "string" && name !== "").join(" ");
+}
+//#endregion
 //#region src/client/schema-form/Editor.tsx
 function Editor(props) {
 	const { ns, state, face, t, resolveText, renderField } = props;
@@ -2900,9 +1729,10 @@ function Editor(props) {
 		t
 	]);
 	const disabled = !state.writable || !state.available;
-	return /* @__PURE__ */ jsx(EditorRoot, {
+	return /* @__PURE__ */ jsx("div", {
+		className: schema_form_module_css_default.editorRoot,
 		"data-editor": "schema-form",
-		children: lines.map((line, index) => /* @__PURE__ */ jsx(Row, {
+		children: lines.map((line, index) => /* @__PURE__ */ jsx(Row$1, {
 			line,
 			n: index + 1,
 			ns,
@@ -2963,20 +1793,26 @@ function useFold(state, toggled, setToggled) {
 		toggled
 	]);
 }
-function Row({ line, n, ns, state, face, fold, t, resolveText, disabled, editing, selected, dismissed, onEdit, onAdded, onDismiss, onSelect, renderField }) {
+function Row$1({ line, n, ns, state, face, fold, t, resolveText, disabled, editing, selected, dismissed, onEdit, onAdded, onDismiss, onSelect, renderField }) {
 	const key = fieldKey(line.path);
 	const indent = { paddingLeft: `${String(line.depth * 14)}px` };
-	const body = line.kind === "comment" ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(LineFoldSpacer, { "data-role": "fold" }), /* @__PURE__ */ jsx(TruncatedTooltip, {
+	const body = line.kind === "comment" ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
+		className: schema_form_module_css_default.lineFoldSpacer,
+		"data-role": "fold"
+	}), /* @__PURE__ */ jsx(TruncatedTooltip, {
 		label: line.text,
-		children: line.invalid ? /* @__PURE__ */ jsx(LineInvalid, {
+		children: line.invalid ? /* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.lineInvalid,
 			"data-role": "comment",
 			children: `// ${line.text}`
-		}) : /* @__PURE__ */ jsx(LineComment, {
+		}) : /* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.lineComment,
 			"data-role": "comment",
 			children: `// ${line.text}`
 		})
 	})] }) : line.kind === "open" ? /* @__PURE__ */ jsxs(Fragment, { children: [
-		/* @__PURE__ */ jsx(LineFold, {
+		/* @__PURE__ */ jsx("button", {
+			className: schema_form_module_css_default.lineFold,
 			"data-role": "fold",
 			type: "button",
 			"aria-expanded": !line.collapsed,
@@ -2992,7 +1828,10 @@ function Row({ line, n, ns, state, face, fold, t, resolveText, disabled, editing
 			t,
 			disabled
 		}),
-		/* @__PURE__ */ jsx(LineToken, { children: line.shape === "object" ? line.collapsed ? "{…}" : "{" : line.collapsed ? "[…]" : "[" }),
+		/* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.lineToken,
+			children: line.shape === "object" ? line.collapsed ? "{…}" : "{" : line.collapsed ? "[…]" : "["
+		}),
 		/* @__PURE__ */ jsx(VariantSelect, {
 			control: line.variants,
 			path: line.path,
@@ -3001,8 +1840,14 @@ function Row({ line, n, ns, state, face, fold, t, resolveText, disabled, editing
 			t
 		})
 	] }) : line.kind === "close" ? /* @__PURE__ */ jsxs(Fragment, { children: [
-		/* @__PURE__ */ jsx(LineFoldSpacer, { "data-role": "fold" }),
-		/* @__PURE__ */ jsx(LineToken, { children: line.shape === "object" ? "}" : "]" }),
+		/* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.lineFoldSpacer,
+			"data-role": "fold"
+		}),
+		/* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.lineToken,
+			children: line.shape === "object" ? "}" : "]"
+		}),
 		/* @__PURE__ */ jsx(AddLine, {
 			line,
 			state,
@@ -3025,20 +1870,23 @@ function Row({ line, n, ns, state, face, fold, t, resolveText, disabled, editing
 		onDismiss,
 		renderField
 	});
-	return /* @__PURE__ */ jsxs(LineRow, {
+	return /* @__PURE__ */ jsxs("div", {
+		className: schema_form_module_css_default.lineRow,
 		"data-line": line.kind,
 		"data-field-path": line.path.join("."),
 		"data-selected": selected === key ? "true" : void 0,
 		"data-dirty": line.kind === "field" && line.field.staged ? "true" : void 0,
 		"data-overridden": line.kind === "field" && line.field.overridden && !line.field.staged ? "true" : void 0,
 		"data-invalid": line.kind === "field" && (line.field.invalid !== void 0 || state.invalidAt.has(key)) ? "true" : void 0,
-		children: [/* @__PURE__ */ jsx(LineNumber, {
+		children: [/* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.lineNumber,
 			"data-role": "number",
 			onClick: () => {
 				onSelect(line.path);
 			},
 			children: n
-		}), /* @__PURE__ */ jsx(LineBody, {
+		}), /* @__PURE__ */ jsx("div", {
+			className: schema_form_module_css_default.lineBody,
 			"data-role": "body",
 			style: indent,
 			children: body
@@ -3083,49 +1931,63 @@ function FieldLine({ line, ns, state, face, t, disabled, editing, dismissed, onE
 	const text = line.field.text ?? valueText(line.field.value);
 	const multiline = isMultiline(line.field.value) || /[\r\n]/.test(text);
 	return /* @__PURE__ */ jsxs(Fragment, { children: [
-		/* @__PURE__ */ jsx(LineFoldSpacer, { "data-role": "fold" }),
-		/* @__PURE__ */ jsx(LineKey, {
+		/* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.lineFoldSpacer,
+			"data-role": "fold"
+		}),
+		/* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.lineKey,
 			"data-role": "key",
 			"data-index": member?.index === void 0 ? void 0 : "true",
 			title: member?.key ?? line.node.key,
 			children: member?.key ?? line.node.key
 		}),
-		/* @__PURE__ */ jsx(LineToken, { children: member?.index === void 0 ? ": " : "  " }),
-		isEditing ? multiline ? /* @__PURE__ */ jsx(CompactTextField, { children: /* @__PURE__ */ jsx("textarea", {
-			autoFocus: !missing,
-			rows: 1,
-			"aria-label": owner.label,
-			value: text,
-			onChange: (event) => {
-				owner.onEditText(event.target.value);
-			},
-			onKeyDown: (event) => {
-				if (event.key === "Escape") {
-					face.revert(line.path);
-					onEdit(void 0);
+		/* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.lineToken,
+			children: member?.index === void 0 ? ": " : "  "
+		}),
+		isEditing ? multiline ? /* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.compactTextField,
+			children: /* @__PURE__ */ jsx("textarea", {
+				autoFocus: !missing,
+				rows: 1,
+				"aria-label": owner.label,
+				value: text,
+				onChange: (event) => {
+					owner.onEditText(event.target.value);
+				},
+				onKeyDown: (event) => {
+					if (event.key === "Escape") {
+						face.revert(line.path);
+						onEdit(void 0);
+					}
 				}
-			}
-		}) }) : /* @__PURE__ */ jsx(CompactInput, { children: /* @__PURE__ */ jsx(Input, {
-			autoFocus: !missing,
-			type: "text",
-			"aria-label": owner.label,
-			placeholder: missing ? t("empty") : "",
-			value: text,
-			onBlur: () => {
-				if (!missing) onEdit(void 0);
-			},
-			onChange: (event) => {
-				owner.onEditText(event.target.value);
-			},
-			onKeyDown: (event) => {
-				if (event.key === "Enter" && !missing) onEdit(void 0);
-				if (event.key === "Escape") {
-					face.revert(line.path);
-					onEdit(void 0);
+			})
+		}) : /* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.compactInput,
+			children: /* @__PURE__ */ jsx(Input, {
+				autoFocus: !missing,
+				type: "text",
+				"aria-label": owner.label,
+				placeholder: missing ? t("empty") : "",
+				value: text,
+				onBlur: () => {
+					if (!missing) onEdit(void 0);
+				},
+				onChange: (event) => {
+					owner.onEditText(event.target.value);
+				},
+				onKeyDown: (event) => {
+					if (event.key === "Enter" && !missing) onEdit(void 0);
+					if (event.key === "Escape") {
+						face.revert(line.path);
+						onEdit(void 0);
+					}
 				}
-			}
-		}) }) : null,
-		isEditing || line.variantsStandIn ? null : /* @__PURE__ */ jsx(ValueSlot, {
+			})
+		}) : null,
+		isEditing || line.variantsStandIn ? null : /* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.valueSlot,
 			"data-role": "value",
 			onClick: () => {
 				if (editable) onEdit(key);
@@ -3139,7 +2001,8 @@ function FieldLine({ line, ns, state, face, t, disabled, editing, dismissed, onE
 			disabled,
 			t
 		}),
-		isEditing ? /* @__PURE__ */ jsxs(HoverActions, {
+		isEditing ? /* @__PURE__ */ jsxs("span", {
+			className: classes(schema_form_module_css_default.lineActions, schema_form_module_css_default.hoverActions),
 			"data-role": "actions",
 			"data-editing": "true",
 			children: [/* @__PURE__ */ jsx("button", {
@@ -3162,7 +2025,8 @@ function FieldLine({ line, ns, state, face, t, disabled, editing, dismissed, onE
 				children: /* @__PURE__ */ jsx(IconCloseOutlineRegular, { size: 14 })
 			})]
 		}) : null,
-		/* @__PURE__ */ jsxs(HoverActions, {
+		/* @__PURE__ */ jsxs("span", {
+			className: classes(schema_form_module_css_default.lineActions, schema_form_module_css_default.hoverActions),
 			"data-role": "actions",
 			children: [
 				line.field.staged && !disabled ? /* @__PURE__ */ jsx("button", {
@@ -3228,7 +2092,8 @@ function VariantSelect({ control, path, face, disabled, t }) {
 		onClose: () => {
 			setOpen(false);
 		},
-		anchor: /* @__PURE__ */ jsxs(ValueTrigger, {
+		anchor: /* @__PURE__ */ jsxs("button", {
+			className: schema_form_module_css_default.valueTrigger,
 			type: "button",
 			"data-role": "variant",
 			disabled,
@@ -3236,7 +2101,8 @@ function VariantSelect({ control, path, face, disabled, t }) {
 			onClick: () => {
 				setOpen(true);
 			},
-			children: [/* @__PURE__ */ jsx(LineValue, {
+			children: [/* @__PURE__ */ jsx("span", {
+				className: schema_form_module_css_default.lineValue,
 				"data-tone": "empty",
 				children: current?.label ?? ""
 			}), /* @__PURE__ */ jsx(IconChevronDownOutlineRegular, { size: 14 })]
@@ -3249,14 +2115,19 @@ function LinePrefix({ line, face, t, disabled }) {
 	if (key === "") return null;
 	const indexed = member !== void 0 && member.index !== void 0;
 	return /* @__PURE__ */ jsxs(Fragment, { children: [
-		/* @__PURE__ */ jsx(LineKey, {
+		/* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.lineKey,
 			"data-role": "key",
 			"data-index": indexed ? "true" : void 0,
 			title: key,
 			children: key
 		}),
-		/* @__PURE__ */ jsx(LineToken, { children: indexed ? "  " : ": " }),
-		member === void 0 ? null : /* @__PURE__ */ jsx(HoverActions, {
+		/* @__PURE__ */ jsx("span", {
+			className: schema_form_module_css_default.lineToken,
+			children: indexed ? "  " : ": "
+		}),
+		member === void 0 ? null : /* @__PURE__ */ jsx("span", {
+			className: classes(schema_form_module_css_default.lineActions, schema_form_module_css_default.hoverActions),
 			"data-role": "actions",
 			children: /* @__PURE__ */ jsx(RemoveLineButton, {
 				member,
@@ -3319,7 +2190,8 @@ function AddLine({ line, state, face, t, resolveText, disabled, onAdded }) {
 		setText("");
 		setOpen(false);
 	};
-	return /* @__PURE__ */ jsxs(AddWrap, {
+	return /* @__PURE__ */ jsxs("span", {
+		className: schema_form_module_css_default.addWrap,
 		"data-add": spec.kind,
 		"data-invalid": invalid ? "true" : void 0,
 		children: [
@@ -3339,35 +2211,44 @@ function AddLine({ line, state, face, t, resolveText, disabled, onAdded }) {
 				onClose: () => {
 					setOpen(false);
 				},
-				anchor: /* @__PURE__ */ jsx(CompactInput, { children: /* @__PURE__ */ jsx(Input, {
-					value: text,
-					placeholder: label,
-					"aria-label": label,
-					disabled,
-					onFocus: () => {
-						setOpen(true);
-					},
-					onChange: (event) => {
-						setText(event.target.value);
-						setInvalid(false);
-						setOpen(true);
-					},
-					onKeyDown: (event) => {
-						if (event.key === "Enter") {
-							event.preventDefault();
-							commit(matched.length === 1 && spec.kind === "prop" ? matched[0]?.key : void 0);
-						}
-						if (event.key === "Escape") {
-							setText("");
-							setOpen(false);
+				anchor: /* @__PURE__ */ jsx("span", {
+					className: schema_form_module_css_default.compactInput,
+					children: /* @__PURE__ */ jsx(Input, {
+						value: text,
+						placeholder: label,
+						"aria-label": label,
+						disabled,
+						onFocus: () => {
+							setOpen(true);
+						},
+						onChange: (event) => {
+							setText(event.target.value);
+							setInvalid(false);
+							setOpen(true);
+						},
+						onKeyDown: (event) => {
+							if (event.key === "Enter") {
+								event.preventDefault();
+								commit(matched.length === 1 && spec.kind === "prop" ? matched[0]?.key : void 0);
+							}
+							if (event.key === "Escape") {
+								setText("");
+								setOpen(false);
+							}
 						}
-					}
-				}) })
+					})
+				})
 			}),
-			invalid ? /* @__PURE__ */ jsx(LineInvalid, { children: t("unknownProperty") }) : null,
+			invalid ? /* @__PURE__ */ jsx("span", {
+				className: schema_form_module_css_default.lineInvalid,
+				children: t("unknownProperty")
+			}) : null,
 			!invalid && matched.length === 1 && matched[0]?.description !== void 0 ? /* @__PURE__ */ jsx(TruncatedTooltip, {
 				label: resolveText(matched[0].description),
-				children: /* @__PURE__ */ jsx(LineComment, { children: resolveText(matched[0].description) })
+				children: /* @__PURE__ */ jsx("span", {
+					className: schema_form_module_css_default.lineComment,
+					children: resolveText(matched[0].description)
+				})
 			}) : null
 		]
 	});
@@ -3385,11 +2266,12 @@ function SchemaForm(props) {
 		save: t("save"),
 		saving: t("saving")
 	};
-	if (!state.configured) return /* @__PURE__ */ jsx(Hint$1, {
+	if (!state.configured) return /* @__PURE__ */ jsx("p", {
+		className: schema_form_module_css_default.hint,
 		role: "status",
 		children: t("noSchema")
 	});
-	return /* @__PURE__ */ jsxs(SettingsForm$1, {
+	return /* @__PURE__ */ jsxs(SettingsForm, {
 		labels,
 		state,
 		onSave: () => {
@@ -3408,7 +2290,8 @@ function SchemaForm(props) {
 				...owner,
 				onEditText: withParse(owner, t)
 			} }) })
-		}), state.violation === void 0 ? null : /* @__PURE__ */ jsx(Hint$1, {
+		}), state.violation === void 0 ? null : /* @__PURE__ */ jsx("p", {
+			className: schema_form_module_css_default.hint,
 			role: "alert",
 			"data-violation": "true",
 			children: t("notSaved", { message: state.violation.message })
@@ -3567,552 +2450,823 @@ function markdownLabels(t) {
 	};
 }
 //#endregion
-//#region src/client/settings-form/form-model.ts
-function settingsNumberField(field) {
-	return {
-		field,
-		format: (value) => typeof value === "number" ? String(value) : "",
-		parse: (text) => {
-			const trimmed = text.trim();
-			if (trimmed === "") return { kind: "clear" };
-			const parsed = Number(trimmed);
-			return Number.isFinite(parsed) ? {
-				kind: "set",
-				value: parsed
-			} : void 0;
-		}
-	};
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/layout/layout.module.css.mjs
+const css$15 = ".e_G4ZW_stack{flex-direction:column;min-width:0;display:flex}.e_G4ZW_row{flex-direction:row;align-items:center;min-width:0;display:flex}.e_G4ZW_gap0{gap:0}.e_G4ZW_gap2{gap:2px}.e_G4ZW_gap4{gap:4px}.e_G4ZW_gap6{gap:6px}.e_G4ZW_gap8{gap:8px}.e_G4ZW_gap10{gap:10px}.e_G4ZW_gap12{gap:12px}.e_G4ZW_gap14{gap:14px}.e_G4ZW_gap16{gap:16px}.e_G4ZW_alignStart{align-items:flex-start}.e_G4ZW_alignCenter{align-items:center}.e_G4ZW_alignEnd{align-items:flex-end}.e_G4ZW_justifyBetween{justify-content:space-between}.e_G4ZW_justifyEnd{justify-content:flex-end}.e_G4ZW_justifyCenter{justify-content:center}.e_G4ZW_wrap{flex-wrap:wrap}.e_G4ZW_grow{flex:auto;min-width:0}.e_G4ZW_push{margin-left:auto}.e_G4ZW_fill{box-sizing:border-box;width:100%;height:100%;overflow:hidden}.e_G4ZW_scroll{flex:auto;min-height:0;overflow-y:auto}.e_G4ZW_plain{margin:0;padding:0;list-style:none}.e_G4ZW_padNone{padding:0}.e_G4ZW_padCard{padding:8px 12px}.e_G4ZW_padBody{padding:8px 0}.e_G4ZW_padPage{padding:24px 28px}.e_G4ZW_padRow{padding:10px 12px}.e_G4ZW_padBlocking{padding:32px 40px}.e_G4ZW_text{margin:0}.e_G4ZW_sizeXs{font-size:11px;line-height:1.5}.e_G4ZW_sizeSm{font-size:12px;line-height:18px}.e_G4ZW_sizeMd{font-size:13px;line-height:20px}.e_G4ZW_sizeBase{font-size:14px;line-height:24px}.e_G4ZW_sizeLg{font-size:16px;line-height:24px}.e_G4ZW_tonePrimary{color:var(--dsw-alias-label-primary)}.e_G4ZW_toneSecondary{color:var(--dsw-alias-label-secondary)}.e_G4ZW_toneTertiary{color:var(--dsw-alias-label-tertiary)}.e_G4ZW_toneDanger{color:var(--dsw-alias-label-error,var(--dsw-alias-label-primary))}.e_G4ZW_weightMedium{font-weight:500}.e_G4ZW_strong{font-weight:600}.e_G4ZW_mono{word-break:break-all;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,monospace}.e_G4ZW_truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.e_G4ZW_tabular{font-variant-numeric:tabular-nums}.e_G4ZW_boxed{border:1px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-base);border-radius:10px}.e_G4ZW_fixed{flex:none}.e_G4ZW_gapWide{gap:6px 20px}.e_G4ZW_narrow{min-width:0;max-width:min(calc(var(--dsh-chat-content-width,748px) * .702), 82%)}.e_G4ZW_wSearch{flex:none;width:360px;max-width:100%}";
+const tagId$15 = "@morlay/dsh-client-ui-primitives/layout.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/layout.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$15;
+	tag.textContent = css$15;
+	document.head.appendChild(tag);
+}
+var layout_module_css_default = {
+	"weightMedium": "e_G4ZW_weightMedium",
+	"gap16": "e_G4ZW_gap16",
+	"padBlocking": "e_G4ZW_padBlocking",
+	"wSearch": "e_G4ZW_wSearch",
+	"gapWide": "e_G4ZW_gapWide",
+	"alignEnd": "e_G4ZW_alignEnd",
+	"strong": "e_G4ZW_strong",
+	"toneSecondary": "e_G4ZW_toneSecondary",
+	"justifyCenter": "e_G4ZW_justifyCenter",
+	"justifyEnd": "e_G4ZW_justifyEnd",
+	"fill": "e_G4ZW_fill",
+	"padNone": "e_G4ZW_padNone",
+	"boxed": "e_G4ZW_boxed",
+	"justifyBetween": "e_G4ZW_justifyBetween",
+	"plain": "e_G4ZW_plain",
+	"grow": "e_G4ZW_grow",
+	"sizeBase": "e_G4ZW_sizeBase",
+	"gap14": "e_G4ZW_gap14",
+	"alignCenter": "e_G4ZW_alignCenter",
+	"sizeMd": "e_G4ZW_sizeMd",
+	"tonePrimary": "e_G4ZW_tonePrimary",
+	"stack": "e_G4ZW_stack",
+	"toneTertiary": "e_G4ZW_toneTertiary",
+	"mono": "e_G4ZW_mono",
+	"sizeLg": "e_G4ZW_sizeLg",
+	"gap0": "e_G4ZW_gap0",
+	"gap8": "e_G4ZW_gap8",
+	"gap6": "e_G4ZW_gap6",
+	"scroll": "e_G4ZW_scroll",
+	"sizeSm": "e_G4ZW_sizeSm",
+	"gap2": "e_G4ZW_gap2",
+	"gap4": "e_G4ZW_gap4",
+	"sizeXs": "e_G4ZW_sizeXs",
+	"padCard": "e_G4ZW_padCard",
+	"alignStart": "e_G4ZW_alignStart",
+	"padPage": "e_G4ZW_padPage",
+	"push": "e_G4ZW_push",
+	"truncate": "e_G4ZW_truncate",
+	"row": "e_G4ZW_row",
+	"toneDanger": "e_G4ZW_toneDanger",
+	"wrap": "e_G4ZW_wrap",
+	"padRow": "e_G4ZW_padRow",
+	"tabular": "e_G4ZW_tabular",
+	"fixed": "e_G4ZW_fixed",
+	"narrow": "e_G4ZW_narrow",
+	"gap10": "e_G4ZW_gap10",
+	"padBody": "e_G4ZW_padBody",
+	"text": "e_G4ZW_text",
+	"gap12": "e_G4ZW_gap12"
+};
+//#endregion
+//#region src/client/layout/scales.ts
+function gapClass(css, gap) {
+	if (gap === void 0) return void 0;
+	return gap === "wide" ? css.gapWide : css[`gap${gap}`];
+}
+function alignClass(css, align) {
+	if (align === void 0 || align === "stretch") return void 0;
+	if (align === "start") return css.alignStart;
+	return align === "center" ? css.alignCenter : css.alignEnd;
+}
+function justifyClass(css, justify) {
+	if (justify === void 0) return void 0;
+	if (justify === "between") return css.justifyBetween;
+	if (justify === "end") return css.justifyEnd;
+	return justify === "center" ? css.justifyCenter : void 0;
+}
+function padClass(css, pad) {
+	if (pad === void 0 || pad === "none") return void 0;
+	if (pad === "card") return css.padCard;
+	if (pad === "body") return css.padBody;
+	if (pad === "page") return css.padPage;
+	return pad === "row" ? css.padRow : css.padBlocking;
+}
+function sizeClass(css, size) {
+	if (size === void 0) return void 0;
+	if (size === "xs") return css.sizeXs;
+	if (size === "sm") return css.sizeSm;
+	if (size === "md") return css.sizeMd;
+	return size === "base" ? css.sizeBase : css.sizeLg;
+}
+function toneClass(css, tone) {
+	if (tone === void 0) return void 0;
+	if (tone === "primary") return css.tonePrimary;
+	if (tone === "secondary") return css.toneSecondary;
+	return tone === "tertiary" ? css.toneTertiary : css.toneDanger;
+}
+function weightClass(css, weight) {
+	if (weight === void 0) return void 0;
+	return weight === "medium" ? css.weightMedium : css.strong;
 }
-function settingsTextField(field) {
-	return {
-		field,
-		format: (value) => typeof value === "string" ? value : "",
-		parse: (text) => {
-			const trimmed = text.trim();
-			return trimmed === "" ? { kind: "clear" } : {
-				kind: "set",
-				value: trimmed
-			};
-		}
-	};
+//#endregion
+//#region src/client/layout/Row.tsx
+const Row = forwardRef(function Row({ as: Element = "div", gap, align, justify, wrap = false, grow = false, boxed = false, fixed = false, narrow = false, push = false, plain = false, pad, className, children, ...rest }, ref) {
+	return /* @__PURE__ */ jsx(Element, {
+		ref,
+		className: classes(layout_module_css_default.row, gapClass(layout_module_css_default, gap), alignClass(layout_module_css_default, align), justifyClass(layout_module_css_default, justify), padClass(layout_module_css_default, pad), wrap ? layout_module_css_default.wrap : void 0, grow ? layout_module_css_default.grow : void 0, boxed ? layout_module_css_default.boxed : void 0, fixed ? layout_module_css_default.fixed : void 0, narrow ? layout_module_css_default.narrow : void 0, push ? layout_module_css_default.push : void 0, boxed ? layout_module_css_default.boxed : void 0, fixed ? layout_module_css_default.fixed : void 0, plain ? layout_module_css_default.plain : void 0, className),
+		...rest,
+		children
+	});
+});
+//#endregion
+//#region src/client/layout/Stack.tsx
+const Stack = forwardRef(function Stack({ as: Element = "div", gap, align, pad, grow = false, boxed = false, fixed = false, narrow = false, fill = false, scroll = false, plain = false, className, children, ...rest }, ref) {
+	return /* @__PURE__ */ jsx(Element, {
+		ref,
+		className: classes(layout_module_css_default.stack, gapClass(layout_module_css_default, gap), alignClass(layout_module_css_default, align), padClass(layout_module_css_default, pad), grow ? layout_module_css_default.grow : void 0, boxed ? layout_module_css_default.boxed : void 0, fixed ? layout_module_css_default.fixed : void 0, narrow ? layout_module_css_default.narrow : void 0, fill ? layout_module_css_default.fill : void 0, scroll ? layout_module_css_default.scroll : void 0, plain ? layout_module_css_default.plain : void 0, className),
+		...rest,
+		children
+	});
+});
+//#endregion
+//#region src/client/layout/Text.tsx
+function Text({ as: Element = "span", size, tone, weight, mono = false, truncate = false, tabular = false, className, children }) {
+	return /* @__PURE__ */ jsx(Element, {
+		className: classes(layout_module_css_default.text, sizeClass(layout_module_css_default, size), toneClass(layout_module_css_default, tone), weightClass(layout_module_css_default, weight), mono ? layout_module_css_default.mono : void 0, truncate ? layout_module_css_default.truncate : void 0, tabular ? layout_module_css_default.tabular : void 0, className),
+		children
+	});
 }
-var SettingsFormModel = class {
-	scope;
-	specs;
-	secretSpecs;
-	staged = /* @__PURE__ */ new Map();
-	listeners = /* @__PURE__ */ new Set();
-	baseline;
-	unsubscribe;
-	saving = false;
-	failed = false;
-	constructor(scope, specs, secrets = []) {
-		this.scope = scope;
-		this.specs = new Map(specs.map((spec) => [spec.field, spec]));
-		this.secretSpecs = new Map(secrets.map((spec) => [spec.field, spec]));
-		this.unsubscribe = scope.subscribe(() => {
-			this.publish();
-		});
-	}
-	bind(project) {
-		const store = createSnapshotStore(project());
-		this.listeners.add(() => {
-			store.set(project());
-		});
-		return store;
-	}
-	shell() {
-		const snapshot = this.scope.getSnapshot();
-		const plan = this.plan();
-		return {
-			available: snapshot.status === "ready",
-			writable: snapshot.writable,
-			dirty: plan.length > 0,
-			invalid: plan.some((item) => item.run === void 0 && item.op === void 0),
-			saving: this.saving,
-			failed: this.failed
-		};
-	}
-	field(field) {
-		const staged = this.staged.get(field);
-		if (this.secretSpecs.has(field)) return {
-			text: staged?.text ?? "",
-			overridden: false,
-			invalid: false
-		};
-		const spec = this.spec(field);
-		if (staged === void 0) return {
-			text: spec.format(this.sectionValue(field)),
-			overridden: this.stored(field),
-			invalid: false
-		};
-		const write = staged.clear ? { kind: "clear" } : spec.parse(staged.text);
-		return {
-			text: staged.text,
-			overridden: write?.kind === "set",
-			invalid: write === void 0
-		};
-	}
-	actions() {
-		return {
-			edit: (field, text) => {
-				this.stage(field, {
-					text,
-					clear: false
-				});
-			},
-			resetField: (field) => {
-				this.stage(field, {
-					text: this.spec(field).format(this.baseValue(field)),
-					clear: true
-				});
-			},
-			save: () => {
-				this.save();
+//#endregion
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/settings-form/SettingsFieldRow.module.css.mjs
+const css$14 = "._72UBVa_row{flex-direction:column;display:flex}._72UBVa_row[data-divider=true]{border-top:.5px solid var(--dsw-alias-border-l2)}._72UBVa_body{flex-direction:column;gap:6px;padding:12px 0;display:flex}._72UBVa_inline{flex-direction:row;justify-content:space-between;align-items:center;gap:16px;padding:12px 0;display:flex}._72UBVa_text{flex-direction:column;gap:2px;min-width:0;display:flex}._72UBVa_label{color:var(--dsw-alias-label-primary);align-items:center;gap:8px;font-size:13px;font-weight:500;line-height:1.5;display:flex}._72UBVa_badge{corner-shape:round;color:var(--dsw-alias-label-secondary);background:var(--dsw-alias-bg-module-platform);border-radius:999px;align-items:center;padding:1px 8px;font-size:11px;font-weight:500;line-height:17px;display:inline-flex}._72UBVa_reset{font:inherit;color:var(--dsw-alias-label-secondary);cursor:pointer;background:0 0;border:none;padding:0;font-size:12px;line-height:1.5}._72UBVa_reset:hover:not(:disabled){color:var(--dsw-alias-label-primary)}._72UBVa_reset:disabled{cursor:default}._72UBVa_hint{color:var(--dsw-alias-label-tertiary);margin:0;font-size:12px;line-height:1.5}._72UBVa_invalid{color:var(--dsw-alias-state-error-primary);margin:0;font-size:12px;line-height:1.5}";
+const tagId$14 = "@morlay/dsh-client-ui-primitives/SettingsFieldRow.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/SettingsFieldRow.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$14;
+	tag.textContent = css$14;
+	document.head.appendChild(tag);
+}
+var SettingsFieldRow_module_css_default = {
+	"inline": "_72UBVa_inline",
+	"row": "_72UBVa_row",
+	"reset": "_72UBVa_reset",
+	"hint": "_72UBVa_hint",
+	"badge": "_72UBVa_badge",
+	"body": "_72UBVa_body",
+	"text": "_72UBVa_text",
+	"label": "_72UBVa_label",
+	"invalid": "_72UBVa_invalid"
+};
+//#endregion
+//#region src/client/settings-form/SettingsFieldRow.tsx
+function SettingsFieldRow({ label, hint, layout = "stack", divider = false, overriddenLabel, resetLabel, onReset, invalid, children, className, ...rest }) {
+	const labelNode = /* @__PURE__ */ jsxs("span", {
+		className: SettingsFieldRow_module_css_default.label,
+		children: [label, overriddenLabel === void 0 ? null : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
+			className: SettingsFieldRow_module_css_default.badge,
+			children: overriddenLabel
+		}), resetLabel === void 0 || onReset === void 0 ? null : /* @__PURE__ */ jsx("button", {
+			type: "button",
+			className: SettingsFieldRow_module_css_default.reset,
+			onClick: () => {
+				onReset();
 			},
-			discard: () => {
-				if (this.staged.size === 0 && !this.failed) return;
-				this.staged.clear();
-				this.baseline = void 0;
-				this.failed = false;
-				this.publish();
-			}
-		};
-	}
-	async save() {
-		const plan = this.plan();
-		if (!plan.length || this.saving || !this.scope.getSnapshot().writable || plan.some((item) => item.run === void 0 && item.op === void 0)) return;
-		this.saving = true;
-		this.failed = false;
-		this.publish();
-		try {
-			const ops = plan.flatMap((item) => item.op === void 0 ? [] : [item.op]);
-			let landed = !ops.length || await this.scope.mutate(ops, this.baseline?.revision);
-			if (!landed) {
-				this.failed = true;
-				return;
-			}
-			for (const item of plan) if (item.run) landed = await item.run() && landed;
-			if (landed) {
-				this.staged.clear();
-				this.baseline = void 0;
-			}
-			this.failed = !landed;
-		} catch {
-			this.failed = true;
-		} finally {
-			this.saving = false;
-			this.publish();
-		}
-	}
-	dispose() {
-		this.unsubscribe();
-		this.listeners.clear();
-	}
-	plan() {
-		const plan = [];
-		for (const [field, staged] of this.staged) {
-			const secret = this.secretSpecs.get(field);
-			if (secret !== void 0) {
-				const value = staged.text.trim();
-				if (value !== "") plan.push({
-					field,
-					run: () => secret.write(value)
-				});
-				continue;
-			}
-			const spec = this.spec(field);
-			if (staged.clear) {
-				if (this.stored(field)) plan.push({
-					field,
-					op: {
-						op: "unset",
-						path: [field]
-					}
-				});
-				continue;
-			}
-			if (staged.text === spec.format(this.sectionValue(field))) continue;
-			const write = spec.parse(staged.text);
-			if (write === void 0) plan.push({ field });
-			else if (write.kind === "clear") plan.push({
-				field,
-				op: {
-					op: "unset",
-					path: [field]
-				}
-			});
-			else plan.push({
-				field,
-				op: {
-					op: "set",
-					path: [field],
-					value: write.value
-				}
-			});
-		}
-		return plan;
-	}
-	stage(field, edit) {
-		this.baseline ??= this.scope.getSnapshot();
-		this.staged.set(field, edit);
-		this.failed = false;
-		this.publish();
-	}
-	spec(field) {
-		const spec = this.specs.get(field);
-		if (spec === void 0) throw new Error(`plugin card has no field ${field}`);
-		return spec;
-	}
-	snapshotOf() {
-		return this.scope.getSnapshot();
-	}
-	sectionValue(field) {
-		return this.snapshotOf().value?.[field];
-	}
-	baseValue(field) {
-		return this.snapshotOf().base?.[field];
-	}
-	userLayer() {
-		return this.snapshotOf().user;
-	}
-	stored(field) {
-		const user = this.userLayer();
-		return user !== void 0 && Object.hasOwn(user, field);
-	}
-	publish() {
-		for (const listener of this.listeners) listener();
-	}
+			children: resetLabel
+		})] })]
+	});
+	const invalidNode = invalid === void 0 ? null : /* @__PURE__ */ jsx("p", {
+		className: SettingsFieldRow_module_css_default.invalid,
+		role: "alert",
+		children: invalid
+	});
+	if (layout === "inline") return /* @__PURE__ */ jsxs("div", {
+		className: classes(SettingsFieldRow_module_css_default.row, className),
+		"data-role": "field-row",
+		"data-divider": divider ? "true" : "false",
+		...rest,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: SettingsFieldRow_module_css_default.inline,
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: SettingsFieldRow_module_css_default.text,
+				children: [labelNode, /* @__PURE__ */ jsx("p", {
+					className: SettingsFieldRow_module_css_default.hint,
+					children: hint
+				})]
+			}), children]
+		}), invalidNode]
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: classes(SettingsFieldRow_module_css_default.row, className),
+		"data-role": "field-row",
+		"data-divider": divider ? "true" : "false",
+		...rest,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: SettingsFieldRow_module_css_default.body,
+			children: [
+				labelNode,
+				children,
+				/* @__PURE__ */ jsx("p", {
+					className: SettingsFieldRow_module_css_default.hint,
+					children: hint
+				})
+			]
+		}), invalidNode]
+	});
+}
+//#endregion
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/controls/Bubble.module.css.mjs
+const css$13 = ".dtkLCG_bubble{background:var(--dsw-specific-bubble);border-radius:var(--dsw-radius-xl);max-width:100%;font-size:var(--dsh-content-font-size,14px);line-height:calc(22px + var(--dsh-content-font-delta,0px));color:var(--dsw-alias-label-primary);white-space:pre-wrap;word-break:break-word;padding:10px 16px}";
+const tagId$13 = "@morlay/dsh-client-ui-primitives/Bubble.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/Bubble.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$13;
+	tag.textContent = css$13;
+	document.head.appendChild(tag);
+}
+var Bubble_module_css_default = { "bubble": "dtkLCG_bubble" };
+//#endregion
+//#region src/client/controls/Bubble.tsx
+function Bubble({ className, children, ...rest }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: classes(Bubble_module_css_default.bubble, className),
+		...rest,
+		children
+	});
+}
+//#endregion
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/controls/Button.module.css.mjs
+const css$12 = ".WFViLq_label{white-space:nowrap}.WFViLq_danger{--dsw-alias-button-primary-fill:var(--dsw-alias-state-error-primary)}";
+const tagId$12 = "@morlay/dsh-client-ui-primitives/Button.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/Button.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$12;
+	tag.textContent = css$12;
+	document.head.appendChild(tag);
+}
+var Button_module_css_default = {
+	"label": "WFViLq_label",
+	"danger": "WFViLq_danger"
 };
 //#endregion
-//#region src/client/styling/focus.ts
-const focusRing = `${String(dsw.focus.ring.width)} solid ${Token.collect(Token.fallbackVar(dsw.focus.ring.color, String(dsw.alias.state.business.primary)))}`;
+//#region src/client/controls/Button.tsx
+const Button = forwardRef(function Button({ className, tone, ...rest }, ref) {
+	return /* @__PURE__ */ jsx(Button$1, {
+		ref,
+		"data-role": "button",
+		className: classes(className, Button_module_css_default.label, tone === "danger" ? Button_module_css_default.danger : void 0),
+		...rest
+	});
+});
 //#endregion
-//#region src/client/settings-form/fields.styles.ts
-const helpButtonHoverBackground = "var(--dsw-alias-bg-layer-4)";
-const styles$1 = {
-	field: {
-		display: "flex",
-		flexDirection: "column",
-		gap: "6px",
-		padding: "12px 0",
-		"& + &": { borderTop: `0.5px solid ${String(dsw.alias.border.l2)}` }
-	},
-	head: {
-		display: "flex",
-		alignItems: "center",
-		gap: "8px"
-	},
-	label: {
-		flex: 1,
-		minWidth: 0,
-		fontSize: "13px",
-		fontWeight: 500,
-		lineHeight: 1.5,
-		color: dsw.alias.label.primary
-	},
-	groupLabel: { flex: "0 1 auto" },
-	labelGroup: {
-		display: "flex",
-		alignItems: "center",
-		gap: "4px",
-		flex: 1,
-		minWidth: 0
-	},
-	helpButton: {
-		display: "inline-flex",
-		alignItems: "center",
-		justifyContent: "center",
-		flex: "none",
-		width: "24px",
-		height: "24px",
-		padding: 0,
-		border: 0,
-		borderRadius: "6px",
-		background: "none",
-		color: dsw.alias.label.tertiary,
-		cursor: "pointer",
-		"&:hover": {
-			background: helpButtonHoverBackground,
-			color: dsw.alias.label.secondary
-		},
-		"&[aria-expanded='true']": {
-			background: helpButtonHoverBackground,
-			color: dsw.alias.label.secondary
-		},
-		"&:focus-visible": {
-			outline: focusRing,
-			outlineOffset: "1px"
-		}
-	},
-	help: {
-		padding: "10px 0 0",
-		fontSize: "12px",
-		lineHeight: 1.6,
-		color: dsw.alias.label.secondary,
-		"& > p": { margin: 0 },
-		"& > p + p": { marginTop: "8px" }
-	},
-	badges: {
-		display: "inline-flex",
-		alignItems: "center",
-		gap: "8px"
-	},
-	badge: {
-		display: "inline-flex",
-		alignItems: "center",
-		borderRadius: "999px",
-		cornerShape: "round",
-		padding: "1px 8px",
-		fontSize: "11px",
-		lineHeight: "17px",
-		fontWeight: 500,
-		whiteSpace: "nowrap"
-	},
-	badgeNeutral: {
-		background: dsw.alias.bg.module.platform,
-		color: dsw.alias.label.secondary
-	},
-	badgeQuiet: { color: dsw.alias.label.tertiary },
-	reset: {
-		border: "none",
-		background: "none",
-		padding: 0,
-		font: "inherit",
-		fontSize: "12px",
-		lineHeight: 1.5,
-		color: dsw.alias.label.secondary,
-		cursor: "pointer",
-		"&:hover:not(:disabled)": { color: dsw.alias.label.primary },
-		"&:disabled": { cursor: "default" }
-	},
-	input: {
-		height: "34px",
-		padding: "0 12px",
-		border: `0.5px solid ${String(dsw.alias.border.l4)}`,
-		borderRadius: "8px",
-		background: dsw.alias.bg.layer["3"],
-		font: "inherit",
-		fontSize: "13px",
-		lineHeight: 1.5,
-		color: dsw.alias.label.primary,
-		"&:focus-visible": {
-			outline: "none",
-			borderColor: dsw.alias.state.business.primary
-		},
-		"&:disabled": {
-			color: dsw.alias.label.tertiary,
-			cursor: "default"
-		},
-		"&[aria-invalid='true']": { borderColor: dsw.alias.state.error.primary }
-	},
-	invalid: {
-		margin: 0,
-		fontSize: "12px",
-		lineHeight: 1.5,
-		color: dsw.alias.state.error.primary
-	},
-	hint: {
-		margin: 0,
-		fontSize: "12px",
-		lineHeight: 1.5,
-		color: dsw.alias.label.tertiary
-	}
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/controls/DisclosureRow.module.css.mjs
+const css$11 = ".MBWCEG_content{flex:auto;min-width:0}.MBWCEG_contentLayout{align-items:center;gap:8px;width:100%;min-width:0;display:flex}";
+const tagId$11 = "@morlay/dsh-client-ui-primitives/DisclosureRow.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/DisclosureRow.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$11;
+	tag.textContent = css$11;
+	document.head.appendChild(tag);
+}
+var DisclosureRow_module_css_default = {
+	"content": "MBWCEG_content",
+	"contentLayout": "MBWCEG_contentLayout"
+};
+//#endregion
+//#region src/client/controls/DisclosureRow.tsx
+function DisclosureRow(props) {
+	return /* @__PURE__ */ jsx(DisclosureRow$1, {
+		contentClassName: DisclosureRow_module_css_default.content,
+		contentLayoutClassName: DisclosureRow_module_css_default.contentLayout,
+		...props
+	});
+}
+//#endregion
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/controls/SearchInput.module.css.mjs
+const css$10 = ".KiR4MG_search{flex:none;width:360px;max-width:100%}.KiR4MG_full{flex:none;width:100%}";
+const tagId$10 = "@morlay/dsh-client-ui-primitives/SearchInput.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/SearchInput.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$10;
+	tag.textContent = css$10;
+	document.head.appendChild(tag);
+}
+var SearchInput_module_css_default = {
+	"search": "KiR4MG_search",
+	"full": "KiR4MG_full"
+};
+//#endregion
+//#region src/client/controls/SearchInput.tsx
+function SearchInput({ width = "search", className, ...rest }) {
+	return /* @__PURE__ */ jsx(Input, {
+		className: classes(className, width === "search" ? SearchInput_module_css_default.search : SearchInput_module_css_default.full),
+		...rest
+	});
+}
+//#endregion
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/controls/SeatButton.module.css.mjs
+const css$9 = ".HcNbhG_seat{border-radius:var(--dsw-radius-sm);min-width:0;max-width:min(100%,240px);min-height:28px;color:var(--dsw-alias-label-primary);white-space:nowrap;cursor:pointer;background:0 0;border:none;align-items:center;gap:4px;padding:0 8px;font-size:13px;font-weight:500;line-height:20px;display:inline-flex}.HcNbhG_seat:not(:disabled):hover,.HcNbhG_seat[aria-expanded=true],.HcNbhG_expanded{background:var(--dsw-alias-interactive-bg-hover)}.HcNbhG_seat:disabled{cursor:default;color:var(--dsw-alias-label-quaternary)}.HcNbhG_icon{color:var(--dsw-alias-label-primary);flex:none;align-items:center;display:inline-flex}.HcNbhG_label{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.HcNbhG_chevron{color:var(--dsw-alias-label-caption);flex:none;display:inline-flex}";
+const tagId$9 = "@morlay/dsh-client-ui-primitives/SeatButton.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/SeatButton.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$9;
+	tag.textContent = css$9;
+	document.head.appendChild(tag);
+}
+var SeatButton_module_css_default = {
+	"chevron": "HcNbhG_chevron",
+	"expanded": "HcNbhG_expanded",
+	"icon": "HcNbhG_icon",
+	"seat": "HcNbhG_seat",
+	"label": "HcNbhG_label"
 };
 //#endregion
-//#region src/client/settings-form/fields.tsx
-const Field = styled("div")(styles$1.field);
-const Head = styled("div")(styles$1.head);
-const LabelGroup = styled("div")(styles$1.labelGroup);
-const GroupLabel = styled("label")(styles$1.label, styles$1.groupLabel);
-const HeadLabel = styled("label")(styles$1.label);
-const HelpButton = styled("button")(styles$1.helpButton);
-const Help = styled("div")(styles$1.help);
-const Badges = styled("span")(styles$1.badges);
-const NeutralBadge = styled("span")(styles$1.badge, styles$1.badgeNeutral);
-const QuietBadge = styled("span")(styles$1.badge, styles$1.badgeQuiet);
-const Reset = styled("button")(styles$1.reset);
-const Input$1 = styled("input")(styles$1.input);
-const Invalid = styled("p")(styles$1.invalid);
-const Hint = styled("p")(styles$1.hint);
-function InfoGlyph({ size }) {
-	return /* @__PURE__ */ jsxs("svg", {
-		width: size,
-		height: size,
-		viewBox: "0 0 14 14",
-		fill: "none",
-		xmlns: "http://www.w3.org/2000/svg",
-		"aria-hidden": "true",
+//#region src/client/controls/SeatButton.tsx
+function SeatButton({ icon, label, expanded = false, chevron, type = "button", className, ...rest }) {
+	return /* @__PURE__ */ jsxs("button", {
+		type,
+		className: classes(SeatButton_module_css_default.seat, expanded ? SeatButton_module_css_default.expanded : void 0, className),
+		...rest,
 		children: [
-			/* @__PURE__ */ jsx("path", {
-				d: "M12.5757 7.00012C12.5757 3.92085 10.0794 1.42463 7.00012 1.42456C3.9208 1.42456 1.42456 3.9208 1.42456 7.00012C1.42463 10.0794 3.92085 12.5757 7.00012 12.5757C10.0793 12.5756 12.5756 10.0793 12.5757 7.00012ZM13.8002 7.00012C13.8001 10.7559 10.7559 13.8001 7.00012 13.8002C3.2443 13.8002 0.199291 10.7559 0.199219 7.00012C0.199219 3.24426 3.24426 0.199219 7.00012 0.199219C10.7559 0.199291 13.8002 3.2443 13.8002 7.00012Z",
-				fill: "currentColor"
+			/* @__PURE__ */ jsx("span", {
+				className: SeatButton_module_css_default.icon,
+				children: icon
 			}),
-			/* @__PURE__ */ jsx("path", {
-				d: "M7.6127 3.18921V4.55986H6.38735V3.18921H7.6127Z",
-				fill: "currentColor"
+			/* @__PURE__ */ jsx("span", {
+				className: SeatButton_module_css_default.label,
+				children: label
 			}),
-			/* @__PURE__ */ jsx("path", {
-				d: "M7.6127 5.68921V10.8109H6.38735V5.68921H7.6127Z",
-				fill: "currentColor"
+			chevron === void 0 ? null : /* @__PURE__ */ jsx("span", {
+				className: SeatButton_module_css_default.chevron,
+				children: chevron
 			})
 		]
 	});
 }
-function SettingsValueField(props) {
-	const [helpOpen, setHelpOpen] = useState(false);
-	const helpId = `${props.id}-help`;
-	const messageId = `${props.id}-message`;
-	const hasMessage = props.invalid || Boolean(props.hint);
-	const description = [hasMessage ? messageId : "", helpOpen ? helpId : ""].filter(Boolean).join(" ");
-	return /* @__PURE__ */ jsxs(Field, { children: [
-		/* @__PURE__ */ jsxs(Head, { children: [/* @__PURE__ */ jsxs(LabelGroup, { children: [/* @__PURE__ */ jsx(GroupLabel, {
-			htmlFor: props.id,
-			children: props.label
-		}), props.help !== void 0 ? /* @__PURE__ */ jsx(HelpButton, {
-			type: "button",
-			"aria-label": props.help.label,
-			"aria-expanded": helpOpen,
-			"aria-controls": helpId,
+//#endregion
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/controls/Spinner.module.css.mjs
+const css$8 = ".HGVDmW_spinner{border:2px solid var(--dsw-alias-border-l2);border-top-color:var(--dsw-alias-label-primary);border-radius:50%;width:28px;height:28px;animation:.9s linear infinite HGVDmW_spin}@keyframes HGVDmW_spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}";
+const tagId$8 = "@morlay/dsh-client-ui-primitives/Spinner.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/Spinner.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$8;
+	tag.textContent = css$8;
+	document.head.appendChild(tag);
+}
+var Spinner_module_css_default = {
+	"spin": "HGVDmW_spin",
+	"spinner": "HGVDmW_spinner"
+};
+//#endregion
+//#region src/client/controls/Spinner.tsx
+function Spinner({ label }) {
+	return /* @__PURE__ */ jsx("span", {
+		className: Spinner_module_css_default.spinner,
+		role: "status",
+		"aria-label": label
+	});
+}
+//#endregion
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/controls/Tabs.module.css.mjs
+const css$7 = ".GO-36q_tabs{z-index:1;flex:none;gap:36px;margin-top:10px;padding-left:8px;display:flex;position:relative}.GO-36q_tab{color:var(--dsw-alias-label-tertiary);cursor:pointer;background:0 0;border:none;padding:0 0 9px;font-size:13px;font-weight:500;line-height:16px;position:relative}.GO-36q_tab:after{content:\"\";background:0 0;border-radius:2px;height:2px;position:absolute;bottom:-1px;left:0;right:0}.GO-36q_tabActive{color:var(--dsw-alias-state-business-primary)}.GO-36q_tabActive:after{background:var(--dsw-alias-state-business-primary)}.GO-36q_tab:disabled{cursor:not-allowed;opacity:.4}";
+const tagId$7 = "@morlay/dsh-client-ui-primitives/Tabs.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/Tabs.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$7;
+	tag.textContent = css$7;
+	document.head.appendChild(tag);
+}
+var Tabs_module_css_default = {
+	"tab": "GO-36q_tab",
+	"tabs": "GO-36q_tabs",
+	"tabActive": "GO-36q_tabActive"
+};
+//#endregion
+//#region src/client/controls/Tabs.tsx
+function Tabs({ label, items, value, onChange, role = "tablist", disabled = false }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: Tabs_module_css_default.tabs,
+		role,
+		"aria-label": label,
+		children: items.map((item) => {
+			const active = item.value === value;
+			return /* @__PURE__ */ jsx("button", {
+				type: "button",
+				role: role === "tablist" ? "tab" : "radio",
+				"data-tab": item.value,
+				"aria-selected": role === "tablist" ? active : void 0,
+				"aria-checked": role === "tablist" ? void 0 : active,
+				disabled,
+				className: classes(Tabs_module_css_default.tab, active ? Tabs_module_css_default.tabActive : void 0),
+				onClick: () => {
+					onChange(item.value);
+				},
+				children: item.label
+			}, item.value);
+		})
+	});
+}
+//#endregion
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/controls/TimeLabel.module.css.mjs
+const css$6 = "._3IuWPG_label{color:var(--dsw-alias-label-tertiary);white-space:nowrap;opacity:0;padding:0;font-size:14px;line-height:24px;transition:opacity 80ms}[data-time-hover-root]:hover ._3IuWPG_label,[data-time-hover-root]:focus-within ._3IuWPG_label{opacity:1}";
+const tagId$6 = "@morlay/dsh-client-ui-primitives/TimeLabel.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/TimeLabel.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$6;
+	tag.textContent = css$6;
+	document.head.appendChild(tag);
+}
+var TimeLabel_module_css_default = { "label": "_3IuWPG_label" };
+//#endregion
+//#region src/client/controls/TimeLabel.tsx
+function TimeLabel({ className, children, ...rest }) {
+	return /* @__PURE__ */ jsx("span", {
+		className: classes(TimeLabel_module_css_default.label, className),
+		...rest,
+		children
+	});
+}
+//#endregion
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/controls/VisuallyHidden.module.css.mjs
+const css$5 = ".YAvv4W_hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}";
+const tagId$5 = "@morlay/dsh-client-ui-primitives/VisuallyHidden.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/VisuallyHidden.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$5;
+	tag.textContent = css$5;
+	document.head.appendChild(tag);
+}
+var VisuallyHidden_module_css_default = { "hidden": "YAvv4W_hidden" };
+//#endregion
+//#region src/client/controls/VisuallyHidden.tsx
+function VisuallyHidden({ children, ...rest }) {
+	return /* @__PURE__ */ jsx("span", {
+		className: VisuallyHidden_module_css_default.hidden,
+		...rest,
+		children
+	});
+}
+//#endregion
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/controls/IconButton.module.css.mjs
+const css$4 = ".I3t6Ga_iconButton{box-sizing:border-box;width:28px;height:28px;color:var(--dsw-alias-label-secondary);border-radius:var(--dsw-radius-sm);cursor:pointer;background:0 0;border:none;flex:none;justify-content:center;align-items:center;padding:0;display:inline-flex}.I3t6Ga_iconButton:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}.I3t6Ga_iconButton:disabled{cursor:not-allowed;opacity:.4}.I3t6Ga_iconButton:focus-visible{outline:var(--dsw-focus-ring-width) solid var(--dsw-focus-ring-color,var(--dsw-alias-state-business-primary));outline-offset:-2px}.I3t6Ga_sm{width:20px;height:20px;padding:0}.I3t6Ga_circle{color:var(--dsw-alias-label-tertiary);border-radius:28px;padding:6px}.I3t6Ga_circle:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-secondary)}";
+const tagId$4 = "@morlay/dsh-client-ui-primitives/IconButton.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/IconButton.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$4;
+	tag.textContent = css$4;
+	document.head.appendChild(tag);
+}
+var IconButton_module_css_default = {
+	"sm": "I3t6Ga_sm",
+	"circle": "I3t6Ga_circle",
+	"iconButton": "I3t6Ga_iconButton"
+};
+//#endregion
+//#region src/client/controls/IconButton.tsx
+function IconButton({ label, children, type = "button", shape = "square", size = "md", className, ...rest }) {
+	return /* @__PURE__ */ jsx("button", {
+		type,
+		"data-role": "icon-button",
+		"aria-label": label,
+		className: classes(IconButton_module_css_default.iconButton, size === "sm" ? IconButton_module_css_default.sm : void 0, shape === "circle" ? IconButton_module_css_default.circle : void 0, className),
+		...rest,
+		children
+	});
+}
+//#endregion
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/controls/ModelRouteList.module.css.mjs
+const css$3 = "._2eBkWq_list{border:.5px solid var(--dsw-alias-border-l4);border-radius:var(--dsw-radius-lg);gap:6px;min-width:0;max-height:280px;margin:0;padding:10px;display:grid;overflow:auto}._2eBkWq_group{gap:6px;display:grid}._2eBkWq_group+._2eBkWq_group{border-top:.5px solid var(--dsw-alias-border-l3);margin-top:4px;padding-top:10px}._2eBkWq_provider{color:var(--dsw-alias-label-tertiary);padding:0 6px;font-size:11px;font-weight:500}._2eBkWq_item{border-radius:var(--dsw-radius-md);cursor:pointer;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;min-width:0;padding:6px;display:grid}._2eBkWq_item:hover{background:var(--dsw-alias-bg-layer-4)}._2eBkWq_item:focus-visible{outline:var(--dsw-focus-ring-width) solid var(--dsw-focus-ring-color,var(--dsw-alias-state-business-primary));outline-offset:-2px}._2eBkWq_item[aria-disabled=true]{cursor:not-allowed;opacity:.4}._2eBkWq_picked{background:var(--dsw-alias-interactive-bg-hover)}._2eBkWq_text{min-width:0}._2eBkWq_name{text-overflow:ellipsis;white-space:nowrap;color:var(--dsw-alias-label-primary);font-size:13px;display:block;overflow:hidden}._2eBkWq_id{text-overflow:ellipsis;white-space:nowrap;color:var(--dsw-alias-label-tertiary);margin-top:2px;font-size:11px;display:block;overflow:hidden}._2eBkWq_notice{color:var(--dsw-alias-label-tertiary);margin:0;font-size:12px;line-height:1.5}._2eBkWq_error{color:var(--dsw-alias-state-error-primary);margin:0;font-size:12px;line-height:1.5}";
+const tagId$3 = "@morlay/dsh-client-ui-primitives/ModelRouteList.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/ModelRouteList.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$3;
+	tag.textContent = css$3;
+	document.head.appendChild(tag);
+}
+var ModelRouteList_module_css_default = {
+	"id": "_2eBkWq_id",
+	"list": "_2eBkWq_list",
+	"group": "_2eBkWq_group",
+	"provider": "_2eBkWq_provider",
+	"name": "_2eBkWq_name",
+	"notice": "_2eBkWq_notice",
+	"error": "_2eBkWq_error",
+	"text": "_2eBkWq_text",
+	"item": "_2eBkWq_item",
+	"picked": "_2eBkWq_picked"
+};
+//#endregion
+//#region src/client/controls/ModelRouteList.tsx
+function ModelRouteList({ label, candidates, selectedKey, disabled = false, status, loadingLabel, errorLabel, emptyLabel, onSelect }) {
+	if (status === "loading") return /* @__PURE__ */ jsx("p", {
+		className: ModelRouteList_module_css_default.notice,
+		role: "status",
+		children: loadingLabel
+	});
+	if (status === "error") return /* @__PURE__ */ jsx("p", {
+		className: ModelRouteList_module_css_default.error,
+		role: "alert",
+		children: errorLabel
+	});
+	if (candidates.length === 0) return /* @__PURE__ */ jsx("p", {
+		className: ModelRouteList_module_css_default.notice,
+		children: emptyLabel
+	});
+	const groups = /* @__PURE__ */ new Map();
+	for (const candidate of candidates) {
+		const group = groups.get(candidate.provider);
+		if (group === void 0) groups.set(candidate.provider, {
+			name: candidate.providerName,
+			items: [candidate]
+		});
+		else group.items.push(candidate);
+	}
+	return /* @__PURE__ */ jsx("div", {
+		className: ModelRouteList_module_css_default.list,
+		"data-role": "model-route-list",
+		role: "radiogroup",
+		"aria-label": label,
+		"data-control": "model-routes",
+		children: [...groups].map(([provider, group]) => /* @__PURE__ */ jsxs("div", {
+			className: ModelRouteList_module_css_default.group,
+			"data-route-group": provider,
+			children: [/* @__PURE__ */ jsx("span", {
+				className: ModelRouteList_module_css_default.provider,
+				children: group.name
+			}), group.items.map((candidate) => {
+				const picked = candidate.key === selectedKey;
+				return /* @__PURE__ */ jsxs("div", {
+					className: classes(ModelRouteList_module_css_default.item, picked ? ModelRouteList_module_css_default.picked : void 0),
+					role: "radio",
+					"aria-checked": picked,
+					"aria-label": `${candidate.modelName} ${candidate.provider}/${candidate.model}`,
+					"aria-disabled": disabled ? true : void 0,
+					tabIndex: disabled ? -1 : 0,
+					"data-route": candidate.key,
+					onClick: () => {
+						if (!disabled) onSelect(candidate);
+					},
+					onKeyDown: (event) => {
+						if (event.key !== "Enter" && event.key !== " ") return;
+						event.preventDefault();
+						if (!disabled) onSelect(candidate);
+					},
+					children: [picked ? /* @__PURE__ */ jsx(IconCheckOutlineRegular, {}) : /* @__PURE__ */ jsx("span", { "aria-hidden": "true" }), /* @__PURE__ */ jsxs("span", {
+						className: ModelRouteList_module_css_default.text,
+						children: [/* @__PURE__ */ jsx("span", {
+							className: ModelRouteList_module_css_default.name,
+							children: candidate.modelName
+						}), /* @__PURE__ */ jsx("span", {
+							className: ModelRouteList_module_css_default.id,
+							children: `${candidate.providerName} · ${candidate.provider}/${candidate.model}`
+						})]
+					})]
+				}, candidate.key);
+			})]
+		}, provider))
+	});
+}
+//#endregion
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/controls/MultilineField.module.css.mjs
+const css$2 = "._stHfW_multiline{box-sizing:border-box;width:100%;min-height:64px;color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-layer-3);border:.5px solid var(--dsw-alias-border-l4);border-radius:var(--dsw-radius-md);resize:vertical;padding:6px 12px;font-family:inherit;font-size:13px;line-height:1.5}._stHfW_multiline:disabled{cursor:not-allowed;opacity:.4}._stHfW_multiline:focus-visible{outline:var(--dsw-focus-ring-width) solid var(--dsw-focus-ring-color,var(--dsw-alias-state-business-primary));outline-offset:-2px}";
+const tagId$2 = "@morlay/dsh-client-ui-primitives/MultilineField.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/MultilineField.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$2;
+	tag.textContent = css$2;
+	document.head.appendChild(tag);
+}
+var MultilineField_module_css_default = { "multiline": "_stHfW_multiline" };
+//#endregion
+//#region src/client/controls/MultilineField.tsx
+function MultilineField({ rows = 3, className, ...rest }) {
+	return /* @__PURE__ */ jsx("textarea", {
+		rows,
+		"data-role": "multiline-field",
+		className: classes(MultilineField_module_css_default.multiline, className),
+		...rest
+	});
+}
+//#endregion
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/controls/SearchSelect.module.css.mjs
+const css$1 = ".BtUTmW_trigger{white-space:nowrap;height:32px}.BtUTmW_searchRow{border-bottom:.5px solid var(--dsw-alias-border-l2);align-items:center;padding:4px 8px 8px;display:flex}.BtUTmW_searchInput{width:100%;color:var(--dsw-alias-label-primary);background:0 0;border:none;outline:none;padding:2px 0;font-family:inherit;font-size:13px;line-height:1.5}.BtUTmW_empty{color:var(--dsw-alias-label-tertiary);margin:0;padding:8px;font-size:12px;line-height:1.5}";
+const tagId$1 = "@morlay/dsh-client-ui-primitives/SearchSelect.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/SearchSelect.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId$1;
+	tag.textContent = css$1;
+	document.head.appendChild(tag);
+}
+var SearchSelect_module_css_default = {
+	"searchRow": "BtUTmW_searchRow",
+	"searchInput": "BtUTmW_searchInput",
+	"empty": "BtUTmW_empty",
+	"trigger": "BtUTmW_trigger"
+};
+//#endregion
+//#region src/client/controls/SearchSelect.tsx
+function SearchSelect({ label, value, emptyLabel, options, disabled = false, searchLabel, noMatchLabel, onSelect }) {
+	const [open, setOpen] = useState(false);
+	const [query, setQuery] = useState("");
+	const searchRef = useRef(null);
+	useEffect(() => {
+		if (open) searchRef.current?.focus();
+	}, [open]);
+	const matches = useMemo(() => rankByName(options.map((option) => ({
+		value: option.value,
+		name: option.label ?? option.value,
+		label: option.value
+	})), query), [options, query]);
+	const current = options.find((option) => option.value === value);
+	const close = () => {
+		setOpen(false);
+		setQuery("");
+	};
+	const pick = (next) => {
+		close();
+		onSelect(next);
+	};
+	return /* @__PURE__ */ jsxs(Menu, {
+		open,
+		anchor: /* @__PURE__ */ jsx(Button$1, {
+			variant: "outline",
+			size: "sm",
+			"data-role": "search-select",
+			className: classes(SearchSelect_module_css_default.trigger),
+			"data-action": "pick",
+			disabled,
+			"aria-haspopup": "menu",
+			"aria-label": label,
 			onClick: () => {
-				setHelpOpen(!helpOpen);
+				if (open) close();
+				else setOpen(true);
 			},
-			children: /* @__PURE__ */ jsx(InfoGlyph, { size: 12 })
-		}) : null] }), props.overridden ? /* @__PURE__ */ jsxs(Badges, { children: [/* @__PURE__ */ jsx(NeutralBadge, { children: props.overriddenLabel }), /* @__PURE__ */ jsx(Reset, {
-			type: "button",
-			disabled: props.disabled,
-			onClick: props.onReset,
-			children: props.resetLabel
-		})] }) : null] }),
-		/* @__PURE__ */ jsx(Input$1, {
-			id: props.id,
-			type: "text",
-			...props.numeric === true ? { inputMode: "numeric" } : {},
-			...props.invalid ? { "aria-invalid": true } : {},
-			"aria-describedby": description || void 0,
-			value: props.text,
-			placeholder: props.placeholder ?? "",
-			disabled: props.disabled,
-			onChange: (event) => {
-				props.onEdit(event.target.value);
-			}
-		}),
-		hasMessage ? props.invalid ? /* @__PURE__ */ jsx(Invalid, {
-			id: messageId,
-			children: props.invalidLabel
-		}) : /* @__PURE__ */ jsx(Hint, {
-			id: messageId,
-			children: props.hint
-		}) : null,
-		props.help !== void 0 && helpOpen ? /* @__PURE__ */ jsx(Help, {
-			id: helpId,
-			role: "region",
-			"aria-label": props.help.label,
-			children: props.help.content
-		}) : null
-	] });
-}
-function SettingsSecretField(props) {
-	const Badge = props.configured ? NeutralBadge : QuietBadge;
-	return /* @__PURE__ */ jsxs(Field, { children: [
-		/* @__PURE__ */ jsxs(Head, { children: [/* @__PURE__ */ jsx(HeadLabel, {
-			htmlFor: props.id,
-			children: props.label
-		}), /* @__PURE__ */ jsx(Badges, { children: /* @__PURE__ */ jsx(Badge, { children: props.stateLabel }) })] }),
-		/* @__PURE__ */ jsx(Input$1, {
-			id: props.id,
-			type: "password",
-			autoComplete: "new-password",
-			value: props.text,
-			disabled: props.disabled,
-			onChange: (event) => {
-				props.onEdit(event.target.value);
-			}
+			children: value === "" ? emptyLabel : current?.label ?? value
 		}),
-		/* @__PURE__ */ jsx(Hint, { children: props.hint })
-	] });
+		selectedId: value,
+		onSelect: pick,
+		onClose: close,
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: SearchSelect_module_css_default.searchRow,
+				children: /* @__PURE__ */ jsx("input", {
+					className: SearchSelect_module_css_default.searchInput,
+					ref: searchRef,
+					value: query,
+					"aria-label": searchLabel,
+					placeholder: searchLabel,
+					onChange: (event) => {
+						setQuery(event.currentTarget.value);
+					}
+				})
+			}),
+			/* @__PURE__ */ jsx(MenuItemButton, {
+				icon: value === "" ? /* @__PURE__ */ jsx(IconCheckOutlineRegular, {}) : void 0,
+				onSelect: () => {
+					pick("");
+				},
+				children: emptyLabel
+			}),
+			matches.map((option) => /* @__PURE__ */ jsx(MenuItemButton, {
+				icon: option.value === value ? /* @__PURE__ */ jsx(IconCheckOutlineRegular, {}) : void 0,
+				onSelect: () => {
+					pick(option.value);
+				},
+				children: option.name
+			}, option.value)),
+			matches.length === 0 ? /* @__PURE__ */ jsx("p", {
+				className: SearchSelect_module_css_default.empty,
+				children: noMatchLabel
+			}) : null
+		]
+	});
 }
-const styles = {
-	form: {
-		display: "flex",
-		flexDirection: "column"
-	},
-	notice: {
-		margin: "0 0 12px",
-		fontSize: "12px",
-		lineHeight: 1.5,
-		color: dsw.alias.label.tertiary
-	},
-	footer: {
-		display: "flex",
-		alignItems: "center",
-		gap: "8px",
-		paddingTop: "16px"
-	},
-	failed: {
-		flex: 1,
-		minWidth: 0,
-		margin: 0,
-		fontSize: "12px",
-		lineHeight: 1.5,
-		color: "var(--dsw-alias-label-error)"
-	},
-	save: {
-		appearance: "none",
-		border: "1px solid transparent",
-		borderRadius: "8px",
-		padding: "5px 14px",
-		font: "inherit",
-		fontSize: "13px",
-		lineHeight: 1.5,
-		cursor: "pointer",
-		background: dsw.alias.label.primary,
-		color: dsw.alias.bg.layer["3"],
-		"&:disabled": {
-			opacity: .4,
-			cursor: "default"
-		},
-		"&:focus-visible": {
-			outline: focusRing,
-			outlineOffset: "1px"
-		}
+//#endregion
+//#region src/client/controls/tags.ts
+function parseTagList(text) {
+	const seen = /* @__PURE__ */ new Set();
+	const names = [];
+	for (const raw of text.split(/[,，;；\t\n\r]+/u)) {
+		const name = raw.trim();
+		if (name === "" || seen.has(name)) continue;
+		seen.add(name);
+		names.push(name);
+	}
+	return names;
+}
+function mergeTags(current, incoming) {
+	const merged = [...current];
+	for (const name of incoming) {
+		if (name === "" || merged.includes(name)) continue;
+		merged.push(name);
 	}
+	return merged;
+}
+//#endregion
+//#region \0dsh-css-modules:/Users/morlay/src/github.com/morlay/dsh-plugin/packages/client/ui-primitives/src/client/controls/TagInput.module.css.mjs
+const css = ".Is5kta_row{align-items:flex-start;gap:8px;width:100%;display:flex}.Is5kta_anchor{flex:auto;width:100%;min-width:0;display:flex}.Is5kta_box{box-sizing:border-box;background:var(--dsw-alias-bg-layer-3);border:.5px solid var(--dsw-alias-border-l4);border-radius:var(--dsw-radius-md);flex-flow:wrap;align-items:center;gap:4px 6px;width:100%;min-height:32px;padding:4px 8px;display:flex}.Is5kta_input{min-width:120px;color:var(--dsw-alias-label-primary);background:0 0;border:none;outline:none;flex:120px;padding:2px 0;font-family:inherit;font-size:13px;line-height:1.5}.Is5kta_chip{corner-shape:round;white-space:nowrap;color:var(--dsw-alias-label-secondary);background:var(--dsw-alias-bg-module-platform);border-radius:999px;align-items:center;gap:2px;padding:1px 4px 1px 8px;font-size:11px;font-weight:500;line-height:17px;display:inline-flex}.Is5kta_chipRemove{box-sizing:border-box;width:14px;height:14px;color:var(--dsw-alias-label-tertiary);cursor:pointer;background:0 0;border:none;border-radius:999px;flex:none;justify-content:center;align-items:center;padding:0;line-height:1;display:inline-flex}.Is5kta_chipRemove:hover:not(:disabled){color:var(--dsw-alias-label-primary);background:var(--dsw-alias-interactive-bg-hover)}.Is5kta_chipRemove:disabled{cursor:not-allowed;opacity:.4}.Is5kta_chipRemove:focus-visible{outline:var(--dsw-focus-ring-width) solid var(--dsw-focus-ring-color,var(--dsw-alias-state-business-primary));outline-offset:0}.Is5kta_empty{color:var(--dsw-alias-label-tertiary);margin:0;padding:8px;font-size:12px;line-height:1.5}";
+const tagId = "@morlay/dsh-client-ui-primitives/TagInput.module.css";
+if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"@morlay/dsh-client-ui-primitives/TagInput.module.css\"]") === null) {
+	const tag = document.createElement("style");
+	tag.dataset.plugin = "@morlay/dsh-client-ui-primitives";
+	tag.dataset.pluginCss = tagId;
+	tag.textContent = css;
+	document.head.appendChild(tag);
+}
+var TagInput_module_css_default = {
+	"empty": "Is5kta_empty",
+	"anchor": "Is5kta_anchor",
+	"input": "Is5kta_input",
+	"chip": "Is5kta_chip",
+	"chipRemove": "Is5kta_chipRemove",
+	"box": "Is5kta_box",
+	"row": "Is5kta_row"
 };
 //#endregion
-//#region src/client/settings-form/SettingsForm.tsx
-const Form = styled("div")(styles.form);
-const Notice = styled("p")(styles.notice);
-const Footer = styled("div")(styles.footer);
-const Failed = styled("p")(styles.failed);
-const Save = styled("button")(styles.save);
-function SettingsForm(props) {
-	const { state, labels } = props;
-	const discard = useRef(props.onDiscard);
-	discard.current = props.onDiscard;
-	useEffect(() => () => {
-		discard.current();
-	}, []);
-	if (!state.available) return /* @__PURE__ */ jsx(Notice, {
-		role: "status",
-		children: labels.unavailable
+//#region src/client/controls/TagInput.tsx
+function TagInput({ value, onChange, options, placeholder, label, disabled = false, noMatchLabel = "", removeLabel }) {
+	const [draft, setDraft] = useState("");
+	const [open, setOpen] = useState(false);
+	const commit = (text) => {
+		const names = parseTagList(text);
+		if (names.length === 0) return;
+		onChange(mergeTags(value, names));
+		setDraft("");
+	};
+	const remaining = useMemo(() => (options ?? []).filter((option) => !value.includes(option.value)).map((option) => ({
+		value: option.value,
+		name: option.label ?? option.value,
+		label: option.value
+	})), [options, value]);
+	const matches = useMemo(() => rankByName(remaining, draft), [remaining, draft]);
+	return /* @__PURE__ */ jsx("div", {
+		className: TagInput_module_css_default.row,
+		"data-role": "tag-input",
+		"data-control": "tags",
+		children: /* @__PURE__ */ jsxs(Menu, {
+			open: open && remaining.length > 0,
+			className: TagInput_module_css_default.anchor,
+			anchor: /* @__PURE__ */ jsxs("div", {
+				className: TagInput_module_css_default.box,
+				children: [value.map((name) => /* @__PURE__ */ jsxs("span", {
+					className: TagInput_module_css_default.chip,
+					"data-tag": name,
+					children: [name, /* @__PURE__ */ jsx("button", {
+						type: "button",
+						className: TagInput_module_css_default.chipRemove,
+						"data-action": "remove-tag",
+						disabled,
+						"aria-label": removeLabel(name),
+						onClick: () => {
+							onChange(value.filter((candidate) => candidate !== name));
+						},
+						children: /* @__PURE__ */ jsx(IconCloseOutlineRegular, { size: 10 })
+					})]
+				}, name)), /* @__PURE__ */ jsx("input", {
+					className: TagInput_module_css_default.input,
+					value: draft,
+					placeholder: value.length === 0 ? placeholder : "",
+					"aria-label": label,
+					disabled,
+					onFocus: () => {
+						setOpen(true);
+					},
+					onBlur: () => {
+						setOpen(false);
+					},
+					onChange: (event) => {
+						setDraft(event.currentTarget.value);
+					},
+					onKeyDown: (event) => {
+						if (event.key !== "Enter") return;
+						event.preventDefault();
+						commit(draft);
+					},
+					onPaste: (event) => {
+						const text = event.clipboardData.getData("text");
+						if (parseTagList(text).length < 2) return;
+						event.preventDefault();
+						commit(text);
+					}
+				})]
+			}),
+			onClose: () => {
+				setOpen(false);
+			},
+			children: [matches.map((candidate) => /* @__PURE__ */ jsx("span", {
+				onMouseDown: (event) => {
+					event.preventDefault();
+				},
+				children: /* @__PURE__ */ jsx(MenuItemButton, {
+					onSelect: () => {
+						commit(candidate.value);
+					},
+					children: candidate.name
+				})
+			}, candidate.value)), matches.length === 0 ? /* @__PURE__ */ jsx("p", {
+				className: TagInput_module_css_default.empty,
+				"data-role": "tag-input-empty",
+				children: noMatchLabel
+			}) : null]
+		})
 	});
-	const blocked = !state.dirty || state.invalid || state.saving;
-	return /* @__PURE__ */ jsxs(Form, { children: [
-		!state.writable ? /* @__PURE__ */ jsx(Notice, {
-			role: "status",
-			children: labels.readOnly
-		}) : null,
-		props.children,
-		/* @__PURE__ */ jsxs(Footer, { children: [state.failed ? /* @__PURE__ */ jsx(Failed, {
-			role: "status",
-			children: labels.saveFailed
-		}) : null, /* @__PURE__ */ jsx(Save, {
-			type: "button",
-			disabled: blocked,
-			onClick: props.onSave,
-			children: state.saving ? labels.saving : labels.save
-		})] })
-	] });
 }
 //#endregion
 //#region ../../../node_modules/.pnpm/react@18.3.1/node_modules/react/cjs/react.production.min.js
@@ -4573,4 +3727,4 @@ function apply(ctx) {
 	apply$1(ctx);
 }
 //#endregion
-export { ReferenceMarkdown, NS as SCHEMA_FORM_NS, SchemaFormController, SchemaFormHints, SettingsForm, SettingsFormModel, SettingsSecretField, SettingsValueField, Styling, Token, apply, designTokens, dsw, failureOf, findReferences, formatReference, formatReferenceMention, inject, isLocalReference, markdownLabels, parseReference, parseReferenceToken, projectRoot, referenceMentions, rowRegistrations, schema_form_exports as schemaForm, settingsNumberField, settingsTextField, styleOf, styled, styling, walkFields };
+export { Bubble, Button, DisclosureRow, IconButton, ModelRouteList, MultilineField, ReferenceMarkdown, Row, NS as SCHEMA_FORM_NS, SchemaFormController, SchemaFormHints, SearchInput, SearchSelect, SeatButton, SettingsFieldRow, Spinner, Stack, Tabs, TagInput, Text, TimeLabel, VisuallyHidden, apply, failureOf, findReferences, formatReference, formatReferenceMention, inject, isLocalReference, markdownLabels, mergeTags, parseReference, parseReferenceToken, parseTagList, projectRoot, referenceMentions, rowRegistrations, schema_form_exports as schemaForm, walkFields };