@jayyuen66/dsh-plugin-shared 0.2.3 → 0.2.4

package/dist/client.js

@@ -0,0 +1,994 @@
+// GENERATED by build-client.mjs — edit lib/client-entry.ts, then run `node build-client.mjs`.
+window.__ModuleLoader__.load({
+  id: "@jayyuen66/dsh-plugin-shared",
+  factory: (require) => {
+    'use strict';
+    const module = { exports: {} };
+    let exports = module.exports;
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+let react = require("react");
+// lib/card-ui/styles.ts
+/** 设置卡统一样式。颜色/圆角全部走宿主主题令牌。 */
+const CARD_UI_CSS = `
+.dsu-form{display:flex;flex-direction:column}
+.dsu-section{margin-top:24px;padding-top:24px;border-top:.5px solid var(--dsw-alias-border-l1)}
+.dsu-form>.dsu-section:first-child{margin-top:0;padding-top:0;border-top:0}
+.dsu-sectionTitle{margin:0;font-size:15px;font-weight:600;line-height:1.4;color:var(--dsw-alias-label-primary)}
+.dsu-sectionHint{margin:4px 0 0;font-size:12px;line-height:1.5;color:var(--dsw-alias-label-tertiary)}
+.dsu-statusbar{display:flex;flex-wrap:wrap;gap:4px 8px;margin-top:8px;font-size:12px;line-height:1.5;color:var(--dsw-alias-label-tertiary)}
+.dsu-field{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,360px);column-gap:32px;align-items:center;padding:12px 0;border-top:.5px solid var(--dsw-alias-border-l2)}
+.dsu-fieldMeta{display:flex;flex-direction:column;gap:4px;min-width:0}
+.dsu-labelRow{display:flex;align-items:center;gap:6px;min-width:0}
+.dsu-label{font-size:13px;font-weight:500;line-height:1.5;color:var(--dsw-alias-label-primary)}
+.dsu-labelMono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}
+.dsu-hint{margin:0;font-size:12px;line-height:1.5;color:var(--dsw-alias-label-tertiary)}
+.dsu-control{min-width:0;display:flex;align-items:center;gap:8px}
+.dsu-fieldWide{grid-template-columns:minmax(0,1fr);align-items:start}
+.dsu-fieldWide .dsu-control{width:100%;max-width:720px;margin-top:2px}
+.dsu-help{display:inline-flex;align-items:center;gap:6px;min-width:0}
+.dsu-helpBtn{appearance:none;border:0;background:transparent;padding:0;width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center;color:var(--dsw-alias-label-tertiary);cursor:help;border-radius:50%;flex:none}
+.dsu-help:hover .dsu-helpBtn,.dsu-helpBtn:focus-visible{color:var(--dsw-alias-label-primary)}
+.dsu-helpBtn:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary);outline-offset:1px}
+.dsu-tip{position:fixed;z-index:60;box-sizing:border-box;max-width:min(340px,calc(100vw - 16px));max-height:calc(100vh - 16px);overflow:auto;overflow-wrap:anywhere;padding:10px 12px;border-radius:10px;background:var(--dsw-alias-bg-layer-2);border:.5px solid var(--dsw-alias-border-l3);box-shadow:0 12px 32px rgb(0 0 0 / 45%);font-size:12px;line-height:1.6;font-weight:400;color:var(--dsw-alias-label-secondary)}
+.dsu-input{width:100%;height:34px;padding:0 12px;border:.5px solid var(--dsw-alias-border-l4);border-radius:var(--dsw-radius-md);background:var(--dsw-alias-bg-layer-3);color:var(--dsw-alias-label-primary);font:inherit;font-size:13px}
+.dsu-input:focus-visible{outline:none;border-color:var(--dsw-alias-state-business-primary)}
+.dsu-input[aria-invalid="true"]{border-color:var(--dsw-alias-state-error-primary)}
+.dsu-input:disabled{color:var(--dsw-alias-label-tertiary);cursor:default}
+.dsu-input::placeholder{color:var(--dsw-alias-label-tertiary)}
+.dsu-textarea{height:auto;min-height:96px;padding:8px 12px;line-height:1.6;resize:vertical}
+.dsu-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
+.dsu-numberWrap{display:flex;flex-direction:column;gap:4px;width:100%;min-width:0}
+.dsu-number{display:flex;align-items:center;gap:8px;min-width:0}
+.dsu-number .dsu-input{min-width:0}
+.dsu-unit{flex:none;font-size:12px;color:var(--dsw-alias-label-tertiary)}
+.dsu-error{margin:0;font-size:12px;line-height:1.5;color:var(--dsw-alias-state-error-primary)}
+.dsu-switch{appearance:none;width:36px;height:20px;border-radius:999px;border:0;padding:2px;background:var(--dsw-alias-border-l3);display:flex;align-items:center;cursor:pointer;flex:none;transition:background-color .16s}
+.dsu-knob{width:16px;height:16px;border-radius:50%;background:var(--dsw-alias-label-primary);transition:transform .16s,background-color .16s}
+.dsu-switch[aria-checked="true"]{background:var(--dsw-alias-label-primary)}
+.dsu-switch[aria-checked="true"] .dsu-knob{transform:translateX(16px);background:var(--dsw-alias-label-primary-foreground)}
+.dsu-switch:disabled{opacity:.4;cursor:not-allowed}
+.dsu-switch:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary);outline-offset:2px}
+.dsu-selectWrap{position:relative;width:100%;min-width:0}
+.dsu-select{display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;cursor:pointer}
+.dsu-select[aria-expanded="true"]{border-color:var(--dsw-alias-state-business-primary)}
+.dsu-selectValue{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.dsu-chevron{flex:none;color:var(--dsw-alias-label-tertiary);transition:transform .16s}
+.dsu-select[aria-expanded="true"] .dsu-chevron{transform:rotate(180deg)}
+.dsu-menu{position:fixed;z-index:70;padding:4px;background:var(--dsw-alias-bg-layer-2);border:.5px solid var(--dsw-alias-border-l3);border-radius:12px;box-shadow:0 12px 32px rgb(0 0 0 / 50%);max-height:280px;overflow:auto}
+.dsu-option{appearance:none;border:0;background:transparent;color:var(--dsw-alias-label-primary);font:inherit;font-size:13px;line-height:1.4;width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 10px;border-radius:8px;cursor:pointer;text-align:left}
+.dsu-option:hover,.dsu-option[data-active="true"]{background:var(--dsw-alias-bg-layer-3)}
+.dsu-option:disabled{color:var(--dsw-alias-label-tertiary);cursor:not-allowed}
+.dsu-option:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary);outline-offset:-2px}
+.dsu-optionGroup{padding:6px 10px 2px;font-size:11px;font-weight:600;color:var(--dsw-alias-label-tertiary)}
+.dsu-check{opacity:0;flex:none}
+.dsu-option[aria-selected="true"] .dsu-check{opacity:1}
+.dsu-savebar{display:flex;align-items:center;gap:8px;padding:12px 0;margin-top:24px;border-top:.5px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-base)}
+.dsu-savebar[data-dirty="true"]{position:sticky;bottom:0;z-index:2;box-shadow:0 -12px 24px rgb(0 0 0 / 35%)}
+.dsu-btn{appearance:none;border:.5px solid var(--dsw-alias-border-l2);background:transparent;color:var(--dsw-alias-label-primary);font:inherit;font-size:13px;line-height:1.5;border-radius:var(--dsw-radius-md);padding:5px 14px;cursor:pointer;transition:background-color .12s,border-color .12s,color .12s,filter .12s}
+.dsu-btn:hover:not(:disabled){background:var(--dsw-alias-bg-layer-2);border-color:var(--dsw-alias-border-l3)}
+.dsu-btn:active:not(:disabled){background:var(--dsw-alias-bg-layer-1)}
+.dsu-btn:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary);outline-offset:1px}
+.dsu-btn:disabled{opacity:.4;cursor:not-allowed}
+.dsu-btnPrimary{background:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-label-primary);color:var(--dsw-alias-bg-layer-3)}
+.dsu-btnPrimary:hover:not(:disabled){background:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-label-primary);filter:brightness(.9)}
+.dsu-btnPrimary:active:not(:disabled){background:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-label-primary);filter:brightness(.84)}
+.dsu-btnDanger{color:var(--dsw-alias-state-error-primary)}
+.dsu-btnDanger:hover:not(:disabled){color:var(--dsw-alias-state-error-primary);border-color:var(--dsw-alias-state-error-primary);background:var(--dsw-alias-bg-layer-2)}
+.dsu-status{margin-left:auto;font-size:12px;color:var(--dsw-alias-label-tertiary)}
+.dsu-statusError{color:var(--dsw-alias-state-error-primary)}
+.dsu-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:0 24px}
+.dsu-grid>.dsu-field{display:flex;flex-direction:column;align-items:stretch;gap:6px;padding:10px 0;border-top:.5px solid var(--dsw-alias-border-l1)}
+.dsu-grid>.dsu-field .dsu-control{width:100%}
+@media (max-width:640px){
+  .dsu-field{grid-template-columns:minmax(0,1fr);align-items:start}
+  .dsu-control{width:100%;max-width:720px}
+  .dsu-section{margin-top:20px;padding-top:20px}
+}
+@media (prefers-reduced-motion:reduce){
+  .dsu-switch,.dsu-knob,.dsu-chevron,.dsu-btn{transition:none}
+}
+`;
+// lib/card-ui/hint.ts
+/**
+* 把一段完整说明拆成常显提示与浮层详情。
+* 超过阈值的文案不进常显行，避免行内出现截断的省略号。
+* @param text - 完整说明
+* @param max - 常显阈值（字符数）
+* @returns 常显提示或浮层详情
+*/
+function splitHint(text, max = 30) {
+	return text.length <= max ? { hint: text } : { detail: text };
+}
+// lib/card-ui/layout.ts
+/** 设置卡根容器：无外框、纵向排列。 */
+function CardForm(props) {
+	return (0, react.createElement)("div", { className: "dsu-form" }, props.children);
+}
+/** 小节：分隔线 + 标题 + 可选说明。 */
+function Section(props) {
+	return (0, react.createElement)("section", { className: "dsu-section" }, (0, react.createElement)("h2", { className: "dsu-sectionTitle" }, props.title), props.hint === void 0 ? null : (0, react.createElement)("p", { className: "dsu-sectionHint" }, props.hint), props.children);
+}
+/** 紧凑栅格：只用于工具开关这类重复布尔项。 */
+function FieldGrid(props) {
+	return (0, react.createElement)("div", { className: "dsu-grid" }, props.children);
+}
+/** 一行状态 chips，以 `·` 分隔。 */
+function StatusBar(props) {
+	if (props.items.length === 0) return null;
+	const children = props.items.map((item, index) => (0, react.createElement)("span", { key: index }, index === 0 ? item : `· ${item}`));
+	return (0, react.createElement)("div", { className: "dsu-statusbar" }, ...children);
+}
+// lib/card-ui/field.ts
+/** 说明按钮与浮层：悬停/聚焦显示，点击钉住，Esc 关闭。 */
+function InfoTip(props) {
+	const id = (0, react.useId)();
+	const [open, setOpen] = (0, react.useState)(false);
+	const [pinned, setPinned] = (0, react.useState)(false);
+	const hoveredRef = (0, react.useRef)(false);
+	const focusedRef = (0, react.useRef)(false);
+	const pinnedRef = (0, react.useRef)(false);
+	const anchorRef = (0, react.useRef)(null);
+	const tipRef = (0, react.useRef)(null);
+	const hideTimer = (0, react.useRef)(null);
+	const cancelHide = (0, react.useCallback)(() => {
+		if (hideTimer.current !== null) {
+			clearTimeout(hideTimer.current);
+			hideTimer.current = null;
+		}
+	}, []);
+	const place = (0, react.useCallback)(() => {
+		const anchor = anchorRef.current;
+		const tip = tipRef.current;
+		/* v8 ignore next 3 -- place 只在 open 的 layout effect 与挂载期监听器里调用；refs 为空只可能是卸载竞态 */
+		if (anchor === null || tip === null) return;
+		const rect = anchor.getBoundingClientRect();
+		const width = tip.offsetWidth;
+		const height = tip.offsetHeight;
+		let { left } = rect;
+		let top = rect.bottom + 8;
+		if (top + height > window.innerHeight - 8) top = rect.top - height - 8;
+		if (left + width > window.innerWidth - 8) left = window.innerWidth - width - 8;
+		const maxLeft = Math.max(8, window.innerWidth - width - 8);
+		const maxTop = Math.max(8, window.innerHeight - height - 8);
+		tip.style.left = `${Math.min(Math.max(8, left), maxLeft)}px`;
+		tip.style.top = `${Math.min(Math.max(8, top), maxTop)}px`;
+	}, []);
+	const close = (0, react.useCallback)(() => {
+		cancelHide();
+		pinnedRef.current = false;
+		setPinned(false);
+		setOpen(false);
+	}, [cancelHide]);
+	const show = (0, react.useCallback)(() => {
+		cancelHide();
+		setOpen(true);
+	}, [cancelHide]);
+	const scheduleHide = (0, react.useCallback)(() => {
+		cancelHide();
+		if (hoveredRef.current || focusedRef.current || pinnedRef.current) return;
+		hideTimer.current = setTimeout(() => {
+			hideTimer.current = null;
+			/* v8 ignore next 3 -- 任何重新进入/钉住都会 cancelHide；这次复查只防未来的异步路径 */
+			if (!hoveredRef.current && !focusedRef.current && !pinnedRef.current) setOpen(false);
+		}, 120);
+	}, [cancelHide]);
+	const updatePinned = (0, react.useCallback)((next) => {
+		pinnedRef.current = next;
+		setPinned(next);
+	}, []);
+	(0, react.useLayoutEffect)(() => {
+		if (!open) return () => {};
+		place();
+		const onScroll = (event) => {
+			const { target } = event;
+			if (target instanceof Node && tipRef.current?.contains(target) === true) return;
+			if (pinnedRef.current) {
+				place();
+				return;
+			}
+			close();
+		};
+		const onResize = () => {
+			place();
+		};
+		window.addEventListener("scroll", onScroll, true);
+		window.addEventListener("resize", onResize);
+		return () => {
+			window.removeEventListener("scroll", onScroll, true);
+			window.removeEventListener("resize", onResize);
+		};
+	}, [
+		open,
+		props.detail,
+		place,
+		close
+	]);
+	(0, react.useEffect)(() => {
+		if (!open) return () => {};
+		const onKey = (event) => {
+			if (event.key === "Escape") close();
+		};
+		document.addEventListener("keydown", onKey);
+		return () => {
+			document.removeEventListener("keydown", onKey);
+		};
+	}, [open, close]);
+	(0, react.useEffect)(() => cancelHide, [cancelHide]);
+	const button = (0, react.createElement)("button", {
+		ref: anchorRef,
+		type: "button",
+		className: "dsu-helpBtn",
+		"aria-label": `${props.label} 说明`,
+		"aria-describedby": id,
+		"aria-pressed": pinned,
+		onClick: () => {
+			if (pinnedRef.current) {
+				close();
+				return;
+			}
+			updatePinned(true);
+			show();
+		}
+	}, (0, react.createElement)("svg", {
+		width: 12,
+		height: 12,
+		viewBox: "0 0 14 14",
+		"aria-hidden": true
+	}, (0, react.createElement)("circle", {
+		cx: 7,
+		cy: 7,
+		r: 6,
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 1.2
+	}), (0, react.createElement)("path", {
+		d: "M7 6.2v4",
+		stroke: "currentColor",
+		strokeWidth: 1.3,
+		strokeLinecap: "round"
+	}), (0, react.createElement)("circle", {
+		cx: 7,
+		cy: 4.3,
+		r: .8,
+		fill: "currentColor"
+	})));
+	const tip = (0, react.createElement)("div", {
+		ref: tipRef,
+		id,
+		role: "tooltip",
+		className: "dsu-tip",
+		hidden: !open
+	}, props.detail);
+	const labelNode = props.showLabel === false ? null : (0, react.createElement)("span", { className: `dsu-label${props.compact === true ? " dsu-labelMono" : ""}` }, props.label);
+	return (0, react.createElement)("span", {
+		className: "dsu-help",
+		onMouseEnter: () => {
+			hoveredRef.current = true;
+			show();
+		},
+		onMouseLeave: () => {
+			hoveredRef.current = false;
+			scheduleHide();
+		},
+		onFocus: () => {
+			focusedRef.current = true;
+			show();
+		},
+		onBlur: (event) => {
+			const next = event.relatedTarget;
+			if (next instanceof Node && event.currentTarget.contains(next)) return;
+			focusedRef.current = false;
+			scheduleHide();
+		}
+	}, labelNode, button, tip);
+}
+/** 字段名 + 可选说明按钮。 */
+function FieldLabel(props) {
+	const labelClass = `dsu-label${props.compact === true ? " dsu-labelMono" : ""}`;
+	const labelNode = props.controlId === void 0 ? (0, react.createElement)("span", { className: labelClass }, props.label) : (0, react.createElement)("label", {
+		className: labelClass,
+		htmlFor: props.controlId
+	}, props.label);
+	return (0, react.createElement)("div", { className: "dsu-labelRow" }, labelNode, props.detail === void 0 ? null : (0, react.createElement)(InfoTip, {
+		label: props.label,
+		detail: props.detail,
+		showLabel: false
+	}));
+}
+/** 行式字段的基础布局：左标签/提示，右控件。 */
+function Field(props) {
+	const hintId = props.controlId === void 0 ? void 0 : `${props.controlId}-hint`;
+	return (0, react.createElement)("div", { className: `dsu-field${props.wide === true ? " dsu-fieldWide" : ""}` }, (0, react.createElement)("div", { className: "dsu-fieldMeta" }, (0, react.createElement)(FieldLabel, {
+		label: props.label,
+		detail: props.detail,
+		compact: props.compact,
+		controlId: props.controlId
+	}), props.hint === void 0 ? null : (0, react.createElement)("p", {
+		className: "dsu-hint",
+		id: hintId
+	}, props.hint)), (0, react.createElement)("div", { className: "dsu-control" }, props.children));
+}
+// lib/card-ui/inputs.ts
+/** 开关行。 */
+function ToggleField(props) {
+	const controlId = (0, react.useId)();
+	const describedBy = props.hint === void 0 ? void 0 : `${controlId}-hint`;
+	return (0, react.createElement)(Field, {
+		...props,
+		controlId
+	}, (0, react.createElement)("button", {
+		type: "button",
+		role: "switch",
+		id: controlId,
+		className: "dsu-switch",
+		"aria-checked": props.checked,
+		"aria-describedby": describedBy,
+		"data-field": props.field,
+		disabled: props.disabled === true,
+		onClick: () => {
+			props.onChange(!props.checked);
+		}
+	}, (0, react.createElement)("span", { className: "dsu-knob" })));
+}
+/** 数字行：以显示单位读写，越界值不写入。 */
+function NumberField(props) {
+	const text = typeof props.value === "number" && Number.isFinite(props.value) ? String(props.value) : "";
+	const [draft, setDraft] = (0, react.useState)(text);
+	const [invalid, setInvalid] = (0, react.useState)(false);
+	const lastEmitted = (0, react.useRef)(void 0);
+	const controlId = (0, react.useId)();
+	const errorId = (0, react.useId)();
+	const describedByIds = [props.hint === void 0 ? void 0 : `${controlId}-hint`, invalid ? errorId : void 0].filter((entry) => entry !== void 0);
+	const describedBy = describedByIds.length === 0 ? void 0 : describedByIds.join(" ");
+	(0, react.useEffect)(() => {
+		if (props.value === lastEmitted.current) return;
+		lastEmitted.current = props.value;
+		setDraft(text);
+		setInvalid(false);
+	}, [props.value, text]);
+	const accepts = (value) => {
+		const min = props.min ?? -Infinity;
+		const max = props.max ?? Infinity;
+		if (!Number.isFinite(value) || value < min || value > max) return false;
+		const { step } = props;
+		if (step === void 0 || step <= 0) return true;
+		const offset = (value - (props.min ?? 0)) / step;
+		return Math.abs(offset - Math.round(offset)) < 1e-9;
+	};
+	const change = (next) => {
+		setDraft(next);
+		if (next === "") {
+			setInvalid(false);
+			lastEmitted.current = void 0;
+			props.onChange(void 0);
+			return;
+		}
+		const value = Number(next);
+		if (accepts(value)) {
+			setInvalid(false);
+			lastEmitted.current = value;
+			props.onChange(value);
+			return;
+		}
+		setInvalid(true);
+	};
+	const normalize = () => {
+		if (draft === "" || invalid) return;
+		setDraft(String(Number(draft)));
+	};
+	return (0, react.createElement)(Field, {
+		...props,
+		controlId
+	}, (0, react.createElement)("div", { className: "dsu-numberWrap" }, (0, react.createElement)("div", { className: "dsu-number" }, (0, react.createElement)("input", {
+		className: "dsu-input",
+		type: "number",
+		inputMode: "numeric",
+		id: controlId,
+		value: draft,
+		min: props.min,
+		max: props.max,
+		step: props.step,
+		placeholder: props.placeholder,
+		"aria-invalid": invalid || void 0,
+		"aria-describedby": describedBy,
+		"data-field": props.field,
+		disabled: props.disabled === true,
+		onChange: (event) => {
+			change(event.target.value);
+		},
+		onBlur: normalize
+	}), props.unit === void 0 ? null : (0, react.createElement)("span", { className: "dsu-unit" }, props.unit)), invalid ? (0, react.createElement)("p", {
+		className: "dsu-error",
+		id: errorId
+	}, props.invalidHint) : null));
+}
+/** 单行/多行文本。 */
+function TextField(props) {
+	const [draft, setDraft] = (0, react.useState)(props.value);
+	const [focused, setFocused] = (0, react.useState)(false);
+	const controlId = (0, react.useId)();
+	const describedBy = props.hint === void 0 ? void 0 : `${controlId}-hint`;
+	(0, react.useEffect)(() => {
+		if (!focused) setDraft(props.value);
+	}, [props.value, focused]);
+	const shared = {
+		id: controlId,
+		className: `dsu-input${props.multiline === true ? " dsu-textarea" : ""}${props.monospace === true ? " dsu-mono" : ""}`,
+		value: draft,
+		placeholder: props.placeholder,
+		"aria-describedby": describedBy,
+		"data-field": props.field,
+		disabled: props.disabled === true,
+		onFocus: () => {
+			setFocused(true);
+		},
+		onBlur: () => {
+			setFocused(false);
+		},
+		onChange: (event) => {
+			setDraft(event.target.value);
+			props.onChange(event.target.value);
+		}
+	};
+	return (0, react.createElement)(Field, {
+		...props,
+		controlId
+	}, props.multiline === true ? (0, react.createElement)("textarea", shared) : (0, react.createElement)("input", shared));
+}
+/** 名单行：逗号或换行分隔。逗号形态不支持条目本身含逗号；自由文本与正则用 newline。 */
+function ListField(props) {
+	const separator = props.separator ?? "comma";
+	const joined = props.value.join(separator === "newline" ? "\n" : ", ");
+	const [draft, setDraft] = (0, react.useState)(joined);
+	const [focused, setFocused] = (0, react.useState)(false);
+	const controlId = (0, react.useId)();
+	const describedBy = props.hint === void 0 ? void 0 : `${controlId}-hint`;
+	(0, react.useEffect)(() => {
+		if (!focused) setDraft(joined);
+	}, [joined, focused]);
+	const split = (raw) => raw.split(separator === "newline" ? "\n" : ",").map((entry) => entry.trim()).filter((entry) => entry.length > 0);
+	const shared = {
+		id: controlId,
+		className: `dsu-input${separator === "newline" ? " dsu-textarea dsu-mono" : ""}`,
+		value: draft,
+		placeholder: props.placeholder,
+		"aria-describedby": describedBy,
+		"data-field": props.field,
+		disabled: props.disabled === true,
+		onFocus: () => {
+			setFocused(true);
+		},
+		onBlur: () => {
+			setFocused(false);
+		},
+		onChange: (event) => {
+			setDraft(event.target.value);
+			props.onChange(split(event.target.value));
+		}
+	};
+	return (0, react.createElement)(Field, {
+		...props,
+		controlId
+	}, separator === "newline" ? (0, react.createElement)("textarea", shared) : (0, react.createElement)("input", shared));
+}
+// lib/card-ui/select.ts
+/** 自定义下拉：浮层固定定位，键盘可选，点击外部关闭。 */
+function SelectField(props) {
+	const [open, setOpen] = (0, react.useState)(false);
+	const [active, setActive] = (0, react.useState)(0);
+	const triggerRef = (0, react.useRef)(null);
+	const menuRef = (0, react.useRef)(null);
+	const baseId = (0, react.useId)();
+	const controlId = (0, react.useId)();
+	const describedBy = props.hint === void 0 ? void 0 : `${controlId}-hint`;
+	const { disabled, value, options, onChange } = props;
+	const enabled = (0, react.useMemo)(() => options.map((option, index) => ({
+		option,
+		index
+	})).filter((entry) => entry.option.disabled !== true), [options]);
+	const selectedLabel = options.find((option) => option.value === value)?.label ?? value;
+	const activeOption = options[active];
+	const activeValid = activeOption !== void 0 && activeOption.disabled !== true;
+	const place = (0, react.useCallback)(() => {
+		const trigger = triggerRef.current;
+		const menu = menuRef.current;
+		/* v8 ignore next 3 -- place 只在 open 的 layout effect 里调用；refs 为空只可能是卸载竞态 */
+		if (trigger === null || menu === null) return;
+		const rect = trigger.getBoundingClientRect();
+		const width = Math.min(rect.width, window.innerWidth - 16);
+		let { left } = rect;
+		if (left + width > window.innerWidth - 8) left = window.innerWidth - width - 8;
+		const height = menu.offsetHeight;
+		let top = rect.bottom + 6;
+		if (top + height > window.innerHeight - 8) top = rect.top - height - 6;
+		const maxLeft = Math.max(8, window.innerWidth - width - 8);
+		const maxTop = Math.max(8, window.innerHeight - height - 8);
+		menu.style.width = `${width}px`;
+		menu.style.left = `${Math.min(Math.max(8, left), maxLeft)}px`;
+		menu.style.top = `${Math.min(Math.max(8, top), maxTop)}px`;
+	}, []);
+	const close = (0, react.useCallback)(() => {
+		setOpen(false);
+	}, []);
+	const openMenu = (0, react.useCallback)(() => {
+		if (disabled === true) return;
+		const initial = enabled.find((entry) => entry.option.value === value) ?? enabled.at(0);
+		if (initial === void 0) return;
+		setActive(initial.index);
+		setOpen(true);
+	}, [
+		disabled,
+		value,
+		enabled
+	]);
+	const select = (0, react.useCallback)((index) => {
+		/* v8 ignore next 3 -- 浮层只能经由 openMenu 打开；组件禁用时打不开 */
+		if (disabled === true) return;
+		const option = options[index];
+		/* v8 ignore next 3 -- disabled 选项在浏览器里不派发 click；越界下标由调用面保证 */
+		if (option === void 0 || option.disabled === true) return;
+		onChange(option.value);
+		close();
+		triggerRef.current?.focus();
+	}, [
+		disabled,
+		options,
+		onChange,
+		close
+	]);
+	const move = (0, react.useCallback)((delta) => {
+		const position = enabled.findIndex((entry) => entry.index === active);
+		/* v8 ignore next 5 -- open 时归一 effect 已保证 enabled 非空且 active 落在可用项上 */
+		if (position === -1 || enabled.length === 0) return;
+		const next = (position + delta + enabled.length) % enabled.length;
+		const entry = enabled[next];
+		/* v8 ignore next 3 -- next 由取模保证在界内 */
+		if (entry === void 0) return;
+		setActive(entry.index);
+	}, [active, enabled]);
+	(0, react.useLayoutEffect)(() => {
+		if (!open) return () => {};
+		place();
+		const onPointerDown = (event) => {
+			const target = event.target;
+			if (menuRef.current?.contains(target) === true) return;
+			if (triggerRef.current?.contains(target) === true) return;
+			close();
+		};
+		const onScroll = (event) => {
+			const { target } = event;
+			if (target instanceof Node && menuRef.current?.contains(target) === true) return;
+			close();
+		};
+		const onResize = () => {
+			place();
+		};
+		document.addEventListener("pointerdown", onPointerDown, true);
+		window.addEventListener("scroll", onScroll, true);
+		window.addEventListener("resize", onResize);
+		return () => {
+			document.removeEventListener("pointerdown", onPointerDown, true);
+			window.removeEventListener("scroll", onScroll, true);
+			window.removeEventListener("resize", onResize);
+		};
+	}, [
+		open,
+		props.options,
+		place,
+		close
+	]);
+	(0, react.useEffect)(() => {
+		if (!open) return;
+		if (disabled === true || enabled.length === 0) {
+			close();
+			return;
+		}
+		if (enabled.some((entry) => entry.index === active)) return;
+		const fallback = enabled.find((entry) => entry.option.value === value) ?? enabled.at(0);
+		/* v8 ignore next 3 -- enabled 非空在上一分支已保证 */
+		if (fallback === void 0) return;
+		setActive(fallback.index);
+	}, [
+		open,
+		disabled,
+		value,
+		options,
+		active,
+		close,
+		enabled
+	]);
+	(0, react.useLayoutEffect)(() => {
+		if (!open) return;
+		const menu = menuRef.current;
+		/* v8 ignore next 2 -- 同上，menu 在 open 的 commit 之后必然已挂上 */
+		if (menu === null) return;
+		const node = menu.querySelector("[data-active=\"true\"]");
+		/* v8 ignore next 2 -- active 已由归一 effect 保证落在可用项上 */
+		if (node === null) return;
+		if (node.offsetTop < menu.scrollTop) {
+			menu.scrollTop = node.offsetTop;
+			return;
+		}
+		if (node.offsetTop + node.offsetHeight > menu.scrollTop + menu.clientHeight) menu.scrollTop = node.offsetTop + node.offsetHeight - menu.clientHeight;
+	}, [
+		open,
+		active,
+		options
+	]);
+	const onKeyDown = (event) => {
+		if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+			event.preventDefault();
+			if (!open) {
+				openMenu();
+				return;
+			}
+			move(event.key === "ArrowDown" ? 1 : -1);
+			return;
+		}
+		if (event.key === "Home" || event.key === "End") {
+			event.preventDefault();
+			if (!open) openMenu();
+			if (enabled.length === 0) return;
+			const entry = event.key === "Home" ? enabled.at(0) : enabled.at(-1);
+			/* v8 ignore next 3 -- enabled 为空已在上一条返回 */
+			if (entry === void 0) return;
+			setActive(entry.index);
+			return;
+		}
+		if (event.key === "Enter" || event.key === " ") {
+			event.preventDefault();
+			if (!open) {
+				openMenu();
+				return;
+			}
+			select(active);
+			return;
+		}
+		if (event.key === "Tab") {
+			close();
+			return;
+		}
+		if (event.key === "Escape") close();
+	};
+	const optionNodes = [];
+	let lastGroup;
+	for (const [index, option] of options.entries()) {
+		if (option.group !== lastGroup) {
+			if (option.group !== void 0) optionNodes.push((0, react.createElement)("div", {
+				key: `group-${index}-${option.group}`,
+				className: "dsu-optionGroup",
+				role: "presentation"
+			}, option.group));
+			lastGroup = option.group;
+		}
+		optionNodes.push((0, react.createElement)("button", {
+			key: `option-${option.value}`,
+			type: "button",
+			role: "option",
+			id: `${baseId}-${index}`,
+			className: "dsu-option",
+			tabIndex: -1,
+			"aria-selected": option.value === props.value,
+			"data-active": index === active,
+			disabled: option.disabled === true,
+			onMouseDown: (event) => {
+				event.preventDefault();
+			},
+			onClick: () => {
+				select(index);
+			},
+			onMouseEnter: () => {
+				/* v8 ignore next -- happy-dom 对 disabled 元素不派发 mouse 事件；浏览器实现各有差异，保留禁用检查 */
+				if (option.disabled !== true) setActive(index);
+			}
+		}, (0, react.createElement)("span", null, option.label), (0, react.createElement)("svg", {
+			className: "dsu-check",
+			width: 14,
+			height: 14,
+			viewBox: "0 0 14 14",
+			"aria-hidden": true
+		}, (0, react.createElement)("path", {
+			d: "M2.5 7.5l3 3 6-7",
+			fill: "none",
+			stroke: "currentColor",
+			strokeWidth: 1.5,
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}))));
+	}
+	return (0, react.createElement)(Field, {
+		...props,
+		controlId
+	}, (0, react.createElement)("div", {
+		className: "dsu-selectWrap",
+		onBlur: (event) => {
+			const next = event.relatedTarget;
+			if (next instanceof Node && event.currentTarget.contains(next)) return;
+			close();
+		}
+	}, (0, react.createElement)("button", {
+		ref: triggerRef,
+		type: "button",
+		id: controlId,
+		className: "dsu-select dsu-input",
+		role: "combobox",
+		"aria-haspopup": "listbox",
+		"aria-expanded": open,
+		"aria-controls": `${baseId}-list`,
+		"aria-activedescendant": open && activeValid ? `${baseId}-${active}` : void 0,
+		"aria-describedby": describedBy,
+		"data-field": props.field,
+		disabled: disabled === true || options.length === 0,
+		onClick: () => {
+			if (open) {
+				close();
+				return;
+			}
+			openMenu();
+		},
+		onKeyDown
+	}, (0, react.createElement)("span", { className: "dsu-selectValue" }, selectedLabel), (0, react.createElement)("svg", {
+		className: "dsu-chevron",
+		width: 14,
+		height: 14,
+		viewBox: "0 0 14 14",
+		"aria-hidden": true
+	}, (0, react.createElement)("path", {
+		d: "M3 5l4 4 4-4",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 1.5,
+		strokeLinecap: "round",
+		strokeLinejoin: "round"
+	}))), (0, react.createElement)("div", {
+		ref: menuRef,
+		id: `${baseId}-list`,
+		role: "listbox",
+		className: "dsu-menu",
+		"aria-label": props.label,
+		hidden: !open
+	}, ...optionNodes)));
+}
+// lib/card-ui/save-bar.ts
+/** 底部保存条：dirty 时吸底，显示条数与失败原因。 */
+function SaveBar(props) {
+	const disabled = !props.writable || props.busy || !props.dirty;
+	let status;
+	if (props.error !== null) status = props.error;
+	else if (props.writable) status = props.dirty ? props.dirtyLabel : props.cleanLabel;
+	else status = props.readOnlyLabel;
+	return (0, react.createElement)("div", {
+		className: "dsu-savebar",
+		"data-dirty": props.dirty
+	}, (0, react.createElement)("button", {
+		type: "button",
+		className: "dsu-btn dsu-btnPrimary",
+		"data-field": "save",
+		disabled,
+		onClick: props.onSave
+	}, props.busy ? props.savingLabel : props.saveLabel), (0, react.createElement)("button", {
+		type: "button",
+		className: "dsu-btn",
+		"data-field": "discard",
+		disabled,
+		onClick: props.onDiscard
+	}, props.revertLabel), (0, react.createElement)("span", { className: props.error === null ? "dsu-status" : "dsu-status dsu-statusError" }, status));
+}
+// lib/card-diff.ts
+/**
+* 两个值按「表单语义」是否相等：null、undefined 与缺失等价；对象比键集与每个值，
+* 数组比长度与每个元素；其余走 `Object.is`（于是 NaN 与 NaN 相等，`-0` 与 `0` 不等）。
+*
+* 不用 `JSON.stringify` 比较：它把 `NaN`/`Infinity` 都渲染成 `"null"`（`{a:NaN}` 与
+* `{a:null}` 会被判成没改），把 `BigInt` 与循环引用直接抛 `TypeError`，而对象的键序
+* 又会把「同内容的两个对象」判成改动——三个方向都错，且错得不报错。
+* @param left - 一侧的值
+* @param right - 另一侧的值
+* @param seen - 已访问过的「左 → 右」配对，用于在循环引用上正常结束
+* @returns 是否相等
+*/
+function formValueEquals(left, right, seen) {
+	if (left === null || left === void 0 || right === null || right === void 0) return (left ?? null) === (right ?? null);
+	if (Object.is(left, right)) return true;
+	if (typeof left !== "object" || typeof right !== "object") return false;
+	if (seen.get(left) === right) return true;
+	seen.set(left, right);
+	if (Array.isArray(left) || Array.isArray(right)) {
+		if (!Array.isArray(left) || !Array.isArray(right) || left.length !== right.length) return false;
+		return left.every((item, index) => formValueEquals(item, right[index], seen));
+	}
+	const leftKeys = Object.keys(left);
+	const rightKeys = Object.keys(right);
+	if (leftKeys.length !== rightKeys.length) return false;
+	return leftKeys.every((key) => Object.hasOwn(right, key) && formValueEquals(Reflect.get(left, key), Reflect.get(right, key), seen));
+}
+/**
+* touched 层与快照的差异字段（值语义比较；undefined、null 与缺失三者等价）。
+*
+* 比较用 {@link formValueEquals} 而不是 `===` 或 `JSON.stringify`：引用相等会把「用户重排了
+* 同内容的数组」判成改动，而序列化比较会在 NaN、键序、BigInt 与循环引用上给出错误答案。
+* @param touched 草稿层里被碰过的字段
+* @param value 官方快照里的当前值
+* @returns 真正发生改动的字段名，顺序随 `touched` 的键序
+*/
+function diffTouched(touched, value) {
+	const out = [];
+	for (const key of Object.keys(touched)) if (!formValueEquals(touched[key], value[key], /* @__PURE__ */ new WeakMap())) out.push(key);
+	return out;
+}
+// lib/card-apply.ts
+/**
+* flag 的合法形态：非空、且不得命中 `Object.prototype` 的成员。`__proto__` 写不进自有属性
+* （setter 忽略非对象值），函数却返回 true，守卫从此永远失灵；`__defineGetter__` 一类会在
+* globalThis 上落下自有属性、遮蔽同名原型方法——装载即抛。`__` 前缀是各消费卡的书写
+* 惯例，不是判断依据：判断只拦真正会破坏保护逻辑或全局对象的键。
+*/
+const isLegalClaimFlag = (flag) => flag.length > 0 && !(flag in Object.prototype);
+/**
+* 把占位槽恢复到 claim 之前的状态。此前没有自有属性时置 `undefined` 而非 delete：
+* 删动态键会被本仓 lint 基线的 typescript/no-dynamic-delete 判定失败，它援引的正是
+* 「频繁 delete 会把对象推进 V8 字典模式、内联缓存失效」那一条——判断读的是
+* 「是否仍被占位」，残留的 undefined 键不影响保护逻辑。
+*/
+function restoreClaimSlot(marker, flag, previous) {
+	if (previous === void 0) {
+		marker[flag] = void 0;
+		return;
+	}
+	Object.defineProperty(marker, flag, previous);
+}
+/**
+* apply 幂等保护：已 claim 返回 false（调用方直接 return），否则占位并
+* 挂 ctx.effect 清理——HMR 重载时 flag 复位，再次 apply 可重新声明。
+*
+* 占位值是本次 claim 现造的 symbol；保护对外的判断标准是「自有键上的 `true` 或任何 symbol」：
+* `true` 是外部可写的占位约定（判断放宽一分就重新打开 HMR 重复装载），symbol 标识让
+* 重复加载的另一份模块实例的占位同样被认出——两份实例各持各的 token，靠 typeof 而不是
+* 身份对上。清理只认**自己那个** token：旧实例的 disposer 迟于新实例 claim 执行（HMR /
+* 重复加载不保证时序，也不保证恰好调一次）时，它认不得新实例的占位，新 claim 得以保留；
+* claim 之前槽上已有的自有值按原样恢复，不抹成 undefined。
+*
+* ⚠ 标记是**进程级**的（同一个 flag 在全页面只有一份），不是 per-ctx：同一张卡被第二个
+* ctx apply 时会被这一个拒绝。要允许多 ctx 共存就得按 ctx 管理（WeakSet 一类），
+* 别改成这里"顺手放过第二次"——那会重新打开 HMR 重复装载这条路。
+* @param ctx   - apply 的 ctx（需要 effect）。
+* @param flag  - globalThis 上的占位标记键名（如 "__xxxCardApplied"），形态见 {@link isLegalClaimFlag}。
+* @param label - effect 标签（日志/生命周期可观测）。
+* @returns true 表示本次拿到声明权（继续执行），false 表示已被占位。
+*/
+function claimApply(ctx, flag, label) {
+	if (!isLegalClaimFlag(flag)) throw new Error(`claimApply 的 flag 不得为空、也不得命中 Object.prototype 的成员（__proto__ 一类会让占位静默失灵或遮蔽全局成员）：${flag}`);
+	const marker = globalThis;
+	const current = Object.hasOwn(marker, flag) ? marker[flag] : void 0;
+	if (current === true || typeof current === "symbol") return false;
+	const previous = Object.getOwnPropertyDescriptor(marker, flag);
+	const token = Symbol(flag);
+	marker[flag] = token;
+	try {
+		ctx.effect(() => () => {
+			if (marker[flag] === token) restoreClaimSlot(marker, flag, previous);
+		}, label);
+	} catch (error) {
+		if (marker[flag] === token) restoreClaimSlot(marker, flag, previous);
+		throw error;
+	}
+	return true;
+}
+// lib/record.ts
+/** 对象类型守卫：非 `null` 的 `object` 且非数组（`Record` 索引签名投影的基础）。 */
+function isRecord(value) {
+	return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+/** 读取抛错（恶意 getter / Proxy 的 get trap）时的共同结局：按「该成员取不到」处理。 */
+const ABSENT_READ = { absent: true };
+/**
+* 带保护的成员读取。被测对象来自 `ctx.get(...)` 的 unknown，可能带 getter 或 Proxy trap：
+* 读取抛错在出口处变成「取不到」而不是向外冒泡——本文件的两个出口都是能力检查，
+* 一次抛错会让 `typeof fieldOf(x, "describe") === "function"` 这类表达式整体抛错，
+* 把「能力不存在」放大成流程崩溃。
+*/
+function readMember(value, key) {
+	try {
+		return {
+			absent: false,
+			value: value[key]
+		};
+	} catch {
+		return ABSENT_READ;
+	}
+}
+/**
+* 从 `unknown` 投影单个字段；非 `Record` → `undefined`。
+*
+* ⚠ **取值走原型链，这是有意为之，不是疏忽**：`value[key]` 不做 `hasOwn` 判定，所以原型上的
+* 方法照样取得到。消费方正靠这一条做**能力检查**——cordis 服务对象的方法挂在原型上、不是
+* 自有键，形如 `typeof fieldOf(settings, "describe") === "function"`、
+* `hasMethods(fieldOf(value, "timer"), ["timeout"])`、`typeof fieldOf(session,
+* "snapshotEvents") === "function"`（消费包的调用点记在 test/record.test.ts）。
+* 改成 `Object.hasOwn` 会让上面几处**一律判否**，那些包随即认不出合法的 cordis 服务——
+* 而这类误判的表现是「能力检查静默返回 false」，不是报错，极难往这里归因。
+*
+* 代价是明写在这里：键名取到的是原型成员时（`fieldOf({}, "__proto__")` 交回
+* `Object.prototype`、`fieldOf({}, "constructor")` 交回 `Object`）。这是本函数的取舍，
+* 不是让消费方猜的属性——现存调用点的键名全是字面量，没有一处来自数据。
+* test/record.test.ts 两侧都有用例固定：原型方法取得到（这是关键行为），自有键优先于原型键。
+*
+* ⚠ 本段刻意不写出兄弟包的名字：**声明上的 JSDoc 会被 tsc 抄进 dist/types/record.d.ts 一起
+* 发出去**，包名会让装了这个包的消费方以为存在一个并不存在的依赖
+*（test/publish-manifest.test.ts 的产物检查会判定失败）。要写具体调用点就写在 test/ 里。
+*
+* 读取走的是带保护的出口：被测对象带抛错 getter / Proxy trap 时按「取不到」交回
+* `undefined`，异常不冒泡（能力检查不该打断流程）。
+*/
+function fieldOf(value, key) {
+	const read = isRecord(value) ? readMember(value, key) : ABSENT_READ;
+	return read.absent ? void 0 : read.value;
+}
+// lib/errors.ts
+/** 取对象**自有**的 message 属性；不是可读字符串则回 undefined。 */
+function ownMessage(value) {
+	const descriptor = Object.getOwnPropertyDescriptor(value, "message");
+	return descriptor !== void 0 && "value" in descriptor && typeof descriptor.value === "string" ? descriptor.value : void 0;
+}
+/** 渲染一个值，沿 cause 链递归；环上回访改用占位文本。 */
+function render(value, path) {
+	if (path.has(value)) return "<circular cause>";
+	path.add(value);
+	try {
+		if (!(value instanceof Error)) {
+			if (typeof value === "object" && value !== null) {
+				const owned = ownMessage(value);
+				if (owned !== void 0 && owned !== "") return owned;
+			}
+			return String(value);
+		}
+		const message = value.message === "" ? value.name : value.message;
+		const members = typeof globalThis.AggregateError === "function" && value instanceof AggregateError && value.errors.length > 0 ? ` [${value.errors.map((member) => render(member, path)).join("; ")}]` : "";
+		const causeText = value.cause === void 0 || value.cause === null ? "" : render(value.cause, path);
+		return `${message}${members}${causeText === "" || causeText === message ? "" : `: ${causeText}`}`;
+	} catch {
+		return "<unrenderable value>";
+	} finally {
+		path.delete(value);
+	}
+}
+/**
+* 把捕获到的值渲染成一段人读文本。
+* `Error` 取 message（空串时回退 name）并接上 cause 链；`AggregateError` 附上成员；
+* 非 Error 但带可读 message 属性的取该属性，其余按 `String()` 处理。
+* 全程不抛异常：恶意输入改用占位文本。
+* @param error - 捕获到的值（catch 里的 `unknown`）。
+* @returns 可直接进界面通知或日志的文本。
+*/
+function errorText(error) {
+	return render(error, /* @__PURE__ */ new Set());
+}
+// lib/client-entry.ts
+const name = "@jayyuen66/dsh-plugin-shared";
+/** 客户端行只提供组件与工具函数；这个入口只让 Cordis 客户端把行当作插件装载。 */
+function apply() {}
+exports.CARD_UI_CSS = CARD_UI_CSS;
+exports.CardForm = CardForm;
+exports.Field = Field;
+exports.FieldGrid = FieldGrid;
+exports.FieldLabel = FieldLabel;
+exports.InfoTip = InfoTip;
+exports.ListField = ListField;
+exports.NumberField = NumberField;
+exports.SaveBar = SaveBar;
+exports.Section = Section;
+exports.SelectField = SelectField;
+exports.StatusBar = StatusBar;
+exports.TextField = TextField;
+exports.ToggleField = ToggleField;
+exports.apply = apply;
+exports.claimApply = claimApply;
+exports.diffTouched = diffTouched;
+exports.errorText = errorText;
+exports.fieldOf = fieldOf;
+exports.isRecord = isRecord;
+exports.name = name;
+exports.splitHint = splitHint;
+    return module.exports;
+  },
+});