@linxin666/dsh-client-ui-task-board 0.1.14 → 0.1.16

package/lib/client.js

@@ -8,107 +8,6 @@ window.__ModuleLoader__.load({
 		let react = require("react");
 		let react_jsx_runtime = require("react/jsx-runtime");
 		let _deepseek_ai_dsh_client_runtime_client = require("@deepseek-ai/dsh-client-runtime/client");
-		//#region src/core/schedule.ts
-		/** Inclusive ranges per field, in cron order. */
-		const FIELD_RANGES = [
-			[0, 59],
-			[0, 23],
-			[1, 31],
-			[1, 12],
-			[0, 7]
-		];
-		/**
-		* Parse a 5-field cron expression.
-		* @returns the match sets, or null when the expression is invalid.
-		*/
-		function parseCron(expr) {
-			const fields = expr.trim().split(/\s+/);
-			if (fields.length !== 5) return null;
-			const sets = [];
-			for (let index = 0; index < 5; index++) {
-				const [min, max] = FIELD_RANGES[index];
-				const set = /* @__PURE__ */ new Set();
-				if (!parseField(fields[index], min, max, set)) return null;
-				sets.push(set);
-			}
-			const weekdays = /* @__PURE__ */ new Set();
-			for (const day of sets[4]) weekdays.add(day === 7 ? 0 : day);
-			return {
-				minutes: sets[0],
-				hours: sets[1],
-				days: sets[2],
-				months: sets[3],
-				weekdays,
-				dayWildcard: fields[2] === "*",
-				weekdayWildcard: fields[4] === "*"
-			};
-		}
-		/** Whether the expression parses. */
-		function isValidCron(expr) {
-			return parseCron(expr) !== null;
-		}
-		/**
-		* Compute the next matching instant after `fromMs` (ms epoch), in local time,
-		* at minute granularity, strictly greater than `fromMs`. Returns the ms epoch
-		* of the matching minute's start, or undefined when nothing matches within
-		* 366 days (e.g. `0 0 30 2 *`).
-		*/
-		function nextRunAtMs(expr, fromMs) {
-			const schedule = parseCron(expr);
-			if (schedule === null) return void 0;
-			const from = new Date(fromMs);
-			const scan = new Date(from.getFullYear(), from.getMonth(), from.getDate(), from.getHours(), from.getMinutes() + 1, 0, 0);
-			const limitMs = fromMs + 366 * 24 * 60 * 60 * 1e3;
-			while (scan.getTime() <= limitMs) {
-				if (matches(schedule, scan)) return scan.getTime();
-				scan.setMinutes(scan.getMinutes() + 1);
-			}
-		}
-		/** Parse one comma-list field into the match set. */
-		function parseField(field, min, max, out) {
-			if (field === "*") {
-				for (let value = min; value <= max; value++) out.add(value);
-				return true;
-			}
-			for (const part of field.split(",")) {
-				if (part === "") return false;
-				const [range, stepRaw] = part.split("/");
-				let low;
-				let high;
-				if (range === "*") {
-					low = min;
-					high = max;
-				} else if (range.includes("-")) {
-					const [a, b] = range.split("-");
-					if (a === "" || b === "" || !isDigits(a) || !isDigits(b)) return false;
-					low = Number(a);
-					high = Number(b);
-				} else if (isDigits(range)) {
-					low = Number(range);
-					high = Number(range);
-				} else return false;
-				if (low < min || high > max || low > high) return false;
-				const step = stepRaw === void 0 ? 1 : isDigits(stepRaw) ? Number(stepRaw) : NaN;
-				if (!Number.isInteger(step) || step < 1) return false;
-				for (let value = low; value <= high; value += step) out.add(value);
-			}
-			return true;
-		}
-		/** Day/weekday OR semantics: a restricted day field alone gates, and vice versa. */
-		function matches(schedule, date) {
-			if (!schedule.minutes.has(date.getMinutes())) return false;
-			if (!schedule.hours.has(date.getHours())) return false;
-			if (!schedule.months.has(date.getMonth() + 1)) return false;
-			const dayMatches = schedule.days.has(date.getDate());
-			const weekdayMatches = schedule.weekdays.has(date.getDay());
-			if (schedule.dayWildcard) return weekdayMatches;
-			if (schedule.weekdayWildcard) return dayMatches;
-			return dayMatches || weekdayMatches;
-		}
-		function isDigits(value) {
-			return /^\d+$/.test(value);
-		}
-		//#endregion
 		//#region src/core/tasks.ts
 		/** The five kanban columns, in display order. */
 		const COLUMNS = [
@@ -249,6 +148,221 @@ window.__ModuleLoader__.load({
 			return "running";
 		}
 		//#endregion
+		//#region src/core/use-cases/task-create.ts
+		/**
+		* Create-task use case: mint a new task from user input, rejecting a blank
+		* title. Pure ledger transition (no persistence or notify — the controller
+		* orchestrates those), so it is unit-testable without any runtime face.
+		*/
+		/**
+		* Apply a create against the current ledger. Returns the new task and the
+		* appended ledger, or the unchanged ledger when the title is blank.
+		* @param tasks - current ledger.
+		* @param input - raw user input (title/description/prompt).
+		* @param now - clock instant (ms epoch).
+		* @param id - minted task id.
+		*/
+		function applyCreateTask(tasks, input, now, id) {
+			if (input.title.trim() === "") return {
+				task: void 0,
+				tasks
+			};
+			const task = createTask(input, now, id);
+			return {
+				task,
+				tasks: [...tasks, task]
+			};
+		}
+		//#endregion
+		//#region src/core/use-cases/task-delete.ts
+		/**
+		* Apply a delete across the ledger. The selection (a task id) is cleared when
+		* it matches the removed task, so the UI never lingers on a vanished detail.
+		* @param tasks - current ledger.
+		* @param selectedTaskId - the currently selected task id (may be undefined).
+		* @param id - the task to remove.
+		*/
+		function applyDeleteTask(tasks, selectedTaskId, id) {
+			return {
+				tasks: tasks.filter((task) => task.id !== id),
+				selectionCleared: selectedTaskId === id
+			};
+		}
+		//#endregion
+		//#region src/core/schedule.ts
+		/** Inclusive ranges per field, in cron order. */
+		const FIELD_RANGES = [
+			[0, 59],
+			[0, 23],
+			[1, 31],
+			[1, 12],
+			[0, 7]
+		];
+		/**
+		* Parse a 5-field cron expression.
+		* @returns the match sets, or null when the expression is invalid.
+		*/
+		function parseCron(expr) {
+			const fields = expr.trim().split(/\s+/);
+			if (fields.length !== 5) return null;
+			const sets = [];
+			for (let index = 0; index < 5; index++) {
+				const [min, max] = FIELD_RANGES[index];
+				const set = /* @__PURE__ */ new Set();
+				if (!parseField(fields[index], min, max, set)) return null;
+				sets.push(set);
+			}
+			const weekdays = /* @__PURE__ */ new Set();
+			for (const day of sets[4]) weekdays.add(day === 7 ? 0 : day);
+			return {
+				minutes: sets[0],
+				hours: sets[1],
+				days: sets[2],
+				months: sets[3],
+				weekdays,
+				dayWildcard: fields[2] === "*",
+				weekdayWildcard: fields[4] === "*"
+			};
+		}
+		/** Whether the expression parses. */
+		function isValidCron(expr) {
+			return parseCron(expr) !== null;
+		}
+		/**
+		* Compute the next matching instant after `fromMs` (ms epoch), in local time,
+		* at minute granularity, strictly greater than `fromMs`. Returns the ms epoch
+		* of the matching minute's start, or undefined when nothing matches within
+		* 366 days (e.g. `0 0 30 2 *`).
+		*/
+		function nextRunAtMs(expr, fromMs) {
+			const schedule = parseCron(expr);
+			if (schedule === null) return void 0;
+			const from = new Date(fromMs);
+			const scan = new Date(from.getFullYear(), from.getMonth(), from.getDate(), from.getHours(), from.getMinutes() + 1, 0, 0);
+			const limitMs = fromMs + 366 * 24 * 60 * 60 * 1e3;
+			while (scan.getTime() <= limitMs) {
+				if (matches(schedule, scan)) return scan.getTime();
+				scan.setMinutes(scan.getMinutes() + 1);
+			}
+		}
+		/** Parse one comma-list field into the match set. */
+		function parseField(field, min, max, out) {
+			if (field === "*") {
+				for (let value = min; value <= max; value++) out.add(value);
+				return true;
+			}
+			for (const part of field.split(",")) {
+				if (part === "") return false;
+				const [range, stepRaw] = part.split("/");
+				let low;
+				let high;
+				if (range === "*") {
+					low = min;
+					high = max;
+				} else if (range.includes("-")) {
+					const [a, b] = range.split("-");
+					if (a === "" || b === "" || !isDigits(a) || !isDigits(b)) return false;
+					low = Number(a);
+					high = Number(b);
+				} else if (isDigits(range)) {
+					low = Number(range);
+					high = Number(range);
+				} else return false;
+				if (low < min || high > max || low > high) return false;
+				const step = stepRaw === void 0 ? 1 : isDigits(stepRaw) ? Number(stepRaw) : NaN;
+				if (!Number.isInteger(step) || step < 1) return false;
+				for (let value = low; value <= high; value += step) out.add(value);
+			}
+			return true;
+		}
+		/** Day/weekday OR semantics: a restricted day field alone gates, and vice versa. */
+		function matches(schedule, date) {
+			if (!schedule.minutes.has(date.getMinutes())) return false;
+			if (!schedule.hours.has(date.getHours())) return false;
+			if (!schedule.months.has(date.getMonth() + 1)) return false;
+			const dayMatches = schedule.days.has(date.getDate());
+			const weekdayMatches = schedule.weekdays.has(date.getDay());
+			if (schedule.dayWildcard) return weekdayMatches;
+			if (schedule.weekdayWildcard) return dayMatches;
+			return dayMatches || weekdayMatches;
+		}
+		function isDigits(value) {
+			return /^\d+$/.test(value);
+		}
+		//#endregion
+		//#region src/core/use-cases/task-schedule.ts
+		/**
+		* Schedule use case: arm/disarm a task's cron rule and roll a rule forward.
+		* Pure ledger transitions (no persistence or notify — the controller
+		* orchestrates those). Validation and next-run computation live here, sharing
+		* the core cron parser (schedule.ts) and the withSchedule transition.
+		*/
+		/**
+		* Set a task's schedule rule. A blank or invalid cron is rejected (state
+		* untouched); an enabled rule computes the next run instant immediately, a
+		* disabled or invalid one carries no next-run instant.
+		* @param tasks - current ledger.
+		* @param id - the task to schedule.
+		* @param patch - rule fields to change (absent fields keep their current value).
+		* @param now - clock instant (ms epoch).
+		*/
+		function applySetSchedule(tasks, id, patch, now) {
+			const task = tasks.find((candidate) => candidate.id === id);
+			if (task === void 0) return {
+				tasks,
+				applied: false
+			};
+			const current = task.schedule;
+			const cron = (patch.cron ?? current?.cron ?? "").trim();
+			if (cron === "" || !isValidCron(cron)) return {
+				tasks,
+				applied: false
+			};
+			const enabled = patch.enabled ?? current?.enabled ?? false;
+			const nextRunAt = enabled ? nextRunAtMs(cron, now) : void 0;
+			return {
+				tasks: tasks.map((candidate) => candidate.id === id ? withSchedule(candidate, {
+					enabled,
+					cron,
+					nextRunAt
+				}, now) : candidate),
+				applied: true
+			};
+		}
+		/**
+		* Roll a task's schedule rule forward (scheduler callback): persist the next
+		* due instant and the trigger instant. No-op for tasks without a rule (deleted
+		* mid-tick, for example).
+		* @param tasks - current ledger.
+		* @param id - the task to roll forward.
+		* @param nextRunAt - next due instant (may be undefined to clear).
+		* @param lastTriggeredAt - the trigger instant of this run.
+		* @param now - clock instant (ms epoch).
+		*/
+		function applyScheduleNextRun(tasks, id, nextRunAt, lastTriggeredAt, now) {
+			return tasks.map((task) => task.id === id && task.schedule !== void 0 ? withSchedule(task, {
+				nextRunAt,
+				lastTriggeredAt
+			}, now) : task);
+		}
+		//#endregion
+		//#region src/core/use-cases/task-update.ts
+		/**
+		* Apply an update across the ledger. Tasks that do not match the id are left
+		* untouched; the matched task receives the patch plus a fresh updatedAt.
+		* @param tasks - current ledger.
+		* @param id - the task to update.
+		* @param patch - editable-field changes.
+		* @param now - clock instant (ms epoch).
+		*/
+		function applyUpdateTask(tasks, id, patch, now) {
+			return tasks.map((task) => task.id === id ? {
+				...task,
+				...patch,
+				updatedAt: now
+			} : task);
+		}
+		//#endregion
 		//#region src/core/controller.ts
 		/** The selected task (resolved from the ledger), or undefined. */
 		function selectedTaskOf(snapshot) {
@@ -347,18 +461,14 @@ window.__ModuleLoader__.load({
 				this.notify();
 			}
 			createTask(input) {
-				if (input.title.trim() === "") return void 0;
-				const task = createTask(input, this.now(), this.uuid());
-				this.tasks = [...this.tasks, task];
+				const { task, tasks } = applyCreateTask(this.tasks, input, this.now(), this.uuid());
+				if (task === void 0) return void 0;
+				this.tasks = [...tasks];
 				this.persistAndNotify();
 				return task;
 			}
 			updateTask(id, patch) {
-				this.tasks = this.tasks.map((task) => task.id === id ? {
-					...task,
-					...patch,
-					updatedAt: this.now()
-				} : task);
+				this.tasks = [...applyUpdateTask(this.tasks, id, patch, this.now())];
 				this.persistAndNotify();
 			}
 			moveTask(id, status) {
@@ -366,32 +476,24 @@ window.__ModuleLoader__.load({
 				this.persistAndNotify();
 			}
 			deleteTask(id) {
-				this.tasks = this.tasks.filter((task) => task.id !== id);
-				if (this.selectedTaskId === id) this.selectedTaskId = void 0;
+				const { tasks, selectionCleared } = applyDeleteTask(this.tasks, this.selectedTaskId, id);
+				this.tasks = [...tasks];
+				if (selectionCleared) this.selectedTaskId = void 0;
 				this.persistAndNotify();
 			}
 			/**
 			* Update a task's schedule rule. A blank or invalid cron expression is
 			* rejected (returns false, state untouched). When the rule ends up enabled
 			* the next run instant is computed immediately; a disabled rule carries no
-			* next-run instant.
+			* next-run instant. Delegates the domain transition to the schedule use case.
 			* @param id - the task to schedule.
 			* @param patch - fields to change (absent fields keep their current value).
 			* @returns true when applied, false when rejected (invalid cron / unknown task).
 			*/
 			setSchedule(id, patch) {
-				const task = this.tasks.find((candidate) => candidate.id === id);
-				if (task === void 0) return false;
-				const current = task.schedule;
-				const cron = (patch.cron ?? current?.cron ?? "").trim();
-				if (cron === "" || !isValidCron(cron)) return false;
-				const enabled = patch.enabled ?? current?.enabled ?? false;
-				const nextRunAt = enabled ? nextRunAtMs(cron, this.now()) : void 0;
-				this.tasks = this.tasks.map((candidate) => candidate.id === id ? withSchedule(candidate, {
-					enabled,
-					cron,
-					nextRunAt
-				}, this.now()) : candidate);
+				const { tasks, applied } = applySetSchedule(this.tasks, id, patch, this.now());
+				if (!applied) return false;
+				this.tasks = [...tasks];
 				this.persistAndNotify();
 				return true;
 			}
@@ -401,10 +503,8 @@ window.__ModuleLoader__.load({
 			* schedule rule (it was deleted mid-tick, for example).
 			*/
 			applyScheduleNextRun(id, nextRunAt, lastTriggeredAt) {
-				this.tasks = this.tasks.map((task) => task.id === id && task.schedule !== void 0 ? withSchedule(task, {
-					nextRunAt,
-					lastTriggeredAt
-				}, this.now()) : task);
+				const next = applyScheduleNextRun(this.tasks, id, nextRunAt, lastTriggeredAt, this.now());
+				this.tasks = [...next];
 				this.persistAndNotify();
 			}
 			/**
@@ -736,6 +836,12 @@ window.__ModuleLoader__.load({
 		* a task still running at its due instant is skipped by the controller's
 		* runTask guard and simply waits for the next cron match.
 		*
+		* The ticker is controlled: `start` arms a single interval guarded by an
+		* idempotence check (a second start while running is a no-op, so wiring can
+		* never leak a duplicate timer), and `stop`/`dispose` clear the timer and
+		* drop the environment listeners. The board unmount path calls stop/dispose,
+		* so no interval or listener outlives the board.
+		*
 		* Framework-free: all runtime access flows through the injected deps
 		* (structural faces), so tests drive ticks directly without timers.
 		*/
@@ -746,26 +852,54 @@ window.__ModuleLoader__.load({
 		var SchedulerService = class {
 			deps;
 			timer;
+			environmentListener;
 			disposed = false;
+			started = false;
 			/** @param deps - tasks/clock/trigger/apply faces (see {@link SchedulerDeps}). */
 			constructor(deps) {
 				this.deps = deps;
 			}
-			/** Start ticking: one immediate check (catch-up after reload) + the interval. */
+			/**
+			* Start ticking: one immediate check (catch-up after reload) + the interval.
+			* Single-instance: a second start while already armed is a no-op, so a
+			* re-entrant mount can never stack a duplicate timer.
+			*/
 			start() {
 				if (this.disposed) return;
+				if (this.started) return;
+				this.started = true;
 				this.tick();
 				this.timer = setInterval(() => {
 					this.tick();
 				}, this.deps.tickMs ?? 6e4);
-				this.deps.environment?.addEventListener("visibilitychange", this.onVisibility);
+				if (this.deps.environment !== void 0) {
+					this.environmentListener = () => {
+						this.tick();
+					};
+					this.deps.environment.addEventListener("visibilitychange", this.environmentListener);
+				}
+			}
+			/**
+			* Stop ticking and drop listeners (idempotent). Preferred shutdown verb for
+			* callers that treat the scheduler as a controlled ticker; `dispose` is an
+			* alias.
+			*/
+			stop() {
+				this.dispose();
 			}
 			/** Stop ticking and drop listeners (idempotent). */
 			dispose() {
+				if (this.disposed && this.timer === void 0 && this.environmentListener === void 0) return;
 				this.disposed = true;
-				if (this.timer !== void 0) clearInterval(this.timer);
-				this.timer = void 0;
-				this.deps.environment?.removeEventListener("visibilitychange", this.onVisibility);
+				this.started = false;
+				if (this.timer !== void 0) {
+					clearInterval(this.timer);
+					this.timer = void 0;
+				}
+				if (this.environmentListener !== void 0 && this.deps.environment !== void 0) {
+					this.deps.environment.removeEventListener("visibilitychange", this.environmentListener);
+					this.environmentListener = void 0;
+				}
 			}
 			/**
 			* Check every enabled schedule and trigger the due ones. Idempotent per
@@ -791,9 +925,6 @@ window.__ModuleLoader__.load({
 					if (await this.deps.runTask(task.id)) this.deps.applySchedule(task.id, next, now);
 				}
 			}
-			onVisibility = () => {
-				this.tick();
-			};
 		};
 		//#endregion
 		//#region src/core/store.ts
@@ -1352,6 +1483,15 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region src/client/board/TaskCard.tsx
+		/**
+		* Task card: the board's column item. Clicking opens the task detail — it
+		* never executes anything directly (detail holds the Run button).
+		*
+		* Memoized: the card re-renders only when its own task record changes, so a
+		* status/filter update on one card (or scrolling) never re-renders every
+		* card on the board. The per-card onClick is built with a stable task reference
+		* by the board, so the memo boundary is effective.
+		*/
 		/** Compact relative/absolute time label. */
 		function formatTime(ms) {
 			const date = new Date(ms);
@@ -1362,7 +1502,7 @@ window.__ModuleLoader__.load({
 			return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, "0")}-${String(date.getDate()).padStart(2, "0")}`;
 		}
 		/** One card in a column. */
-		function TaskCard({ task, onClick }) {
+		function TaskCardInner({ task, onClick }) {
 			const latest = task.executions[task.executions.length - 1];
 			const runs = task.executions.length;
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
@@ -1423,6 +1563,8 @@ window.__ModuleLoader__.load({
 				]
 			});
 		}
+		/** Memoized card: re-renders only when the card's own task record changes. */
+		const TaskCard = (0, react.memo)(TaskCardInner);
 		//#endregion
 		//#region src/client/board/ConfirmDialog.tsx
 		/**
@@ -1826,6 +1968,20 @@ window.__ModuleLoader__.load({
 			const needle = filter.trim().toLowerCase();
 			return task.title.toLowerCase().includes(needle) || task.description.toLowerCase().includes(needle);
 		}
+		/**
+		* Memoized per-card adapter: with a stable `onOpen` from the board and an
+		* immutable task record (only the changed card gets a new object ref), a card
+		* re-renders only when its own task changes — not when a sibling card status,
+		* the filter, or the selection moves.
+		*/
+		const MemoTaskCard = (0, react.memo)(function MemoTaskCard({ task, onOpen }) {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TaskCard, {
+				task,
+				onClick: (0, react.useCallback)(() => {
+					onOpen(task.id);
+				}, [task.id, onOpen])
+			});
+		});
 		/** Board component; subscribes to the controller snapshot. */
 		function TaskBoard({ controller }) {
 			const [snapshot, setSnapshot] = (0, react.useState)(controller.getSnapshot());
@@ -1834,6 +1990,9 @@ window.__ModuleLoader__.load({
 			const [showNew, setShowNew] = (0, react.useState)(false);
 			const selected = selectedTaskOf(snapshot);
 			const visible = snapshot.tasks.filter((task) => matchesFilter(task, filter));
+			const openTask = (0, react.useCallback)((id) => {
+				controller.openTask(id);
+			}, [controller]);
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: board_module_css_default.board,
 				"data-dsh-taskboard-board": "",
@@ -1899,11 +2058,9 @@ window.__ModuleLoader__.load({
 									]
 								}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 									className: board_module_css_default.cards,
-									children: [tasks.map((task) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TaskCard, {
+									children: [tasks.map((task) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MemoTaskCard, {
 										task,
-										onClick: () => {
-											controller.openTask(task.id);
-										}
+										onOpen: openTask
 									}, task.id)), tasks.length === 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 										className: board_module_css_default.columnEmpty,
 										children: t("board.empty")
@@ -2117,7 +2274,7 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region \0dsh-css:packages/dsh-task-board/src/client/settings-card.module.css.mjs
-		const css = ".Jh0q7G_card{border:1px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-layer-3);border-radius:12px;list-style:none;transition:border-color .16s,background .16s}.Jh0q7G_card:hover{border-color:var(--dsw-alias-label-dimmed)}.Jh0q7G_cardOpen{background:var(--dsw-alias-bg-layer-2);border-color:var(--dsw-alias-label-dimmed)}.Jh0q7G_header{appearance:none;width:100%;font:inherit;color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:12px;align-items:center;gap:12px;padding:14px 16px;display:flex}.Jh0q7G_header:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:-2px}.Jh0q7G_headText{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.Jh0q7G_name{color:var(--dsw-alias-label-primary);font-size:15px;font-weight:600;line-height:1.4}.Jh0q7G_description{color:var(--dsw-alias-label-tertiary);font-size:13px;line-height:1.5}.Jh0q7G_pending{white-space:nowrap;background:var(--dsw-alias-bg-module-platform);color:var(--dsw-alias-label-secondary);border-radius:999px;flex:none;padding:1px 8px;font-size:11px;font-weight:500;line-height:17px}.Jh0q7G_chevron{color:var(--dsw-alias-label-tertiary);flex:none;transition:transform .16s}.Jh0q7G_chevronOpen{transform:rotate(180deg)}.Jh0q7G_body{border-top:1px solid var(--dsw-alias-border-l2);margin:0 16px;padding-bottom:8px}.Jh0q7G_readOnly{color:var(--dsw-alias-label-tertiary);margin:12px 0 0;font-size:12px;line-height:1.5}.Jh0q7G_notExposed{color:var(--dsw-alias-state-warn-primary);margin:12px 0 0;font-size:12px;line-height:1.5}.Jh0q7G_footer{border-top:1px solid var(--dsw-alias-border-l2);justify-content:flex-end;align-items:center;gap:8px;padding:12px 0 4px;display:flex}.Jh0q7G_failed{min-width:0;color:var(--dsw-alias-label-error);flex:1;margin:0;font-size:12px;line-height:1.5}.Jh0q7G_discard,.Jh0q7G_save{appearance:none;font:inherit;cursor:pointer;border:1px solid #0000;border-radius:8px;padding:5px 14px;font-size:13px;line-height:1.5}.Jh0q7G_discard{border-color:var(--dsw-alias-border-l2);color:var(--dsw-alias-label-secondary);background:0 0}.Jh0q7G_discard:hover:not(:disabled){color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-label-dimmed)}.Jh0q7G_save{background:var(--dsw-alias-label-primary);color:var(--dsw-alias-bg-layer-3)}.Jh0q7G_discard:disabled,.Jh0q7G_save:disabled{opacity:.4;cursor:default}.Jh0q7G_discard:focus-visible,.Jh0q7G_save:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:1px}.Jh0q7G_field{flex-direction:column;gap:6px;padding:12px 0;display:flex}.Jh0q7G_field+.Jh0q7G_field{border-top:1px solid var(--dsw-alias-border-l2)}.Jh0q7G_head{align-items:center;gap:8px;display:flex}.Jh0q7G_label{min-width:0;color:var(--dsw-alias-label-primary);flex:1;font-size:13px;font-weight:500;line-height:1.5}.Jh0q7G_badges{align-items:center;gap:8px;display:inline-flex}.Jh0q7G_badge{white-space:nowrap;background:var(--dsw-alias-bg-module-platform);color:var(--dsw-alias-label-secondary);border-radius:999px;padding:1px 8px;font-size:11px;font-weight:500;line-height:17px}.Jh0q7G_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}.Jh0q7G_reset:hover:not(:disabled){color:var(--dsw-alias-label-primary)}.Jh0q7G_reset:disabled{cursor:default}.Jh0q7G_reset:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:2px}.Jh0q7G_input,.Jh0q7G_select{border:1px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-layer-3);height:34px;font:inherit;color:var(--dsw-alias-label-primary);border-radius:8px;padding:0 12px;font-size:13px;line-height:1.5}.Jh0q7G_input:focus-visible,.Jh0q7G_select:focus-visible{border-color:var(--dsw-alias-brand-primary);outline:none}.Jh0q7G_input:disabled,.Jh0q7G_select:disabled{color:var(--dsw-alias-label-tertiary);cursor:default}.Jh0q7G_inputInvalid{border:1px solid var(--dsw-alias-label-error);background:var(--dsw-alias-bg-layer-3);height:34px;font:inherit;color:var(--dsw-alias-label-primary);border-radius:8px;padding:0 12px;font-size:13px;line-height:1.5}.Jh0q7G_inputInvalid:focus-visible{outline:2px solid var(--dsw-alias-label-error);outline-offset:1px;border-color:var(--dsw-alias-label-error)}.Jh0q7G_invalid{color:var(--dsw-alias-label-error);margin:0;font-size:12px;line-height:1.5}.Jh0q7G_hint{color:var(--dsw-alias-label-tertiary);margin:0;font-size:12px;line-height:1.5}@media (prefers-reduced-motion:reduce){.Jh0q7G_card,.Jh0q7G_header,.Jh0q7G_chevron,.Jh0q7G_chevronOpen,.Jh0q7G_discard,.Jh0q7G_save{transition:none}}";
+		const css = ".Jh0q7G_card{border:1px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-layer-3);border-radius:12px;list-style:none;transition:border-color .16s,background .16s}.Jh0q7G_card:hover{border-color:var(--dsw-alias-label-dimmed)}.Jh0q7G_cardOpen{background:var(--dsw-alias-bg-layer-2);border-color:var(--dsw-alias-label-dimmed)}.Jh0q7G_header{appearance:none;width:100%;font:inherit;color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:12px;align-items:center;gap:12px;padding:14px 16px;display:flex}.Jh0q7G_header:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:-2px}.Jh0q7G_headText{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.Jh0q7G_name{color:var(--dsw-alias-label-primary);font-size:15px;font-weight:600;line-height:1.4}.Jh0q7G_description{color:var(--dsw-alias-label-tertiary);font-size:13px;line-height:1.5}.Jh0q7G_pending{white-space:nowrap;background:var(--dsw-alias-bg-module-platform);color:var(--dsw-alias-label-secondary);border-radius:999px;flex:none;padding:1px 8px;font-size:11px;font-weight:500;line-height:17px}.Jh0q7G_chevron{color:var(--dsw-alias-label-tertiary);flex:none;transition:transform .16s}.Jh0q7G_chevronOpen{transform:rotate(180deg)}.Jh0q7G_body{border-top:1px solid var(--dsw-alias-border-l2);margin:0 16px;padding-bottom:8px}.Jh0q7G_readOnly{color:var(--dsw-alias-label-tertiary);margin:12px 0 0;font-size:12px;line-height:1.5}.Jh0q7G_notExposed{color:var(--dsw-alias-state-warn-primary);margin:12px 0 0;font-size:12px;line-height:1.5}.Jh0q7G_footer{border-top:1px solid var(--dsw-alias-border-l2);justify-content:flex-end;align-items:center;gap:8px;padding:12px 0 4px;display:flex}.Jh0q7G_failed{min-width:0;color:var(--dsw-alias-label-error);text-overflow:ellipsis;white-space:nowrap;flex:1;margin:0;font-size:12px;line-height:1.5;overflow:hidden}.Jh0q7G_discard,.Jh0q7G_save{appearance:none;font:inherit;cursor:pointer;border:1px solid #0000;border-radius:8px;padding:5px 14px;font-size:13px;line-height:1.5}.Jh0q7G_discard{border-color:var(--dsw-alias-border-l2);color:var(--dsw-alias-label-secondary);background:0 0}.Jh0q7G_discard:hover:not(:disabled){color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-label-dimmed)}.Jh0q7G_save{background:var(--dsw-alias-label-primary);color:var(--dsw-alias-bg-layer-3)}.Jh0q7G_discard:disabled,.Jh0q7G_save:disabled{opacity:.4;cursor:default}.Jh0q7G_discard:focus-visible,.Jh0q7G_save:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:1px}.Jh0q7G_field{flex-direction:column;gap:6px;padding:12px 0;display:flex}.Jh0q7G_field+.Jh0q7G_field{border-top:1px solid var(--dsw-alias-border-l2)}.Jh0q7G_head{align-items:center;gap:8px;display:flex}.Jh0q7G_label{min-width:0;color:var(--dsw-alias-label-primary);flex:1;font-size:13px;font-weight:500;line-height:1.5}.Jh0q7G_badges{align-items:center;gap:8px;display:inline-flex}.Jh0q7G_badge{white-space:nowrap;background:var(--dsw-alias-bg-module-platform);color:var(--dsw-alias-label-secondary);border-radius:999px;padding:1px 8px;font-size:11px;font-weight:500;line-height:17px}.Jh0q7G_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}.Jh0q7G_reset:hover:not(:disabled){color:var(--dsw-alias-label-primary)}.Jh0q7G_reset:disabled{cursor:default}.Jh0q7G_reset:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:2px;outline:2px solid var(--dsw-alias-brand-primary);outline-offset:2px}.Jh0q7G_input,.Jh0q7G_select{border:1px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-layer-3);height:34px;font:inherit;color:var(--dsw-alias-label-primary);border-radius:8px;padding:0 12px;font-size:13px;line-height:1.5}.Jh0q7G_input:focus-visible,.Jh0q7G_select:focus-visible{border-color:var(--dsw-alias-brand-primary);outline:none}.Jh0q7G_input:disabled,.Jh0q7G_select:disabled{color:var(--dsw-alias-label-tertiary);cursor:default}.Jh0q7G_inputInvalid{border:1px solid var(--dsw-alias-label-error);background:var(--dsw-alias-bg-layer-3);height:34px;font:inherit;color:var(--dsw-alias-label-primary);border-radius:8px;padding:0 12px;font-size:13px;line-height:1.5}.Jh0q7G_inputInvalid:focus-visible{outline:2px solid var(--dsw-alias-label-error);outline-offset:1px;border-color:var(--dsw-alias-label-error)}.Jh0q7G_invalid{color:var(--dsw-alias-label-error);margin:0;font-size:12px;line-height:1.5}.Jh0q7G_hint{color:var(--dsw-alias-label-tertiary);margin:0;font-size:12px;line-height:1.5}@media (prefers-reduced-motion:reduce){.Jh0q7G_card,.Jh0q7G_header,.Jh0q7G_chevron,.Jh0q7G_chevronOpen,.Jh0q7G_discard,.Jh0q7G_save{transition:none}}";
 		const tagId = "@linxin666/dsh-client-ui-task-board/settings-card.module.css";
 		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId) + "]") === null) {
 			const tag = document.createElement("style");
@@ -2158,12 +2315,12 @@ window.__ModuleLoader__.load({
 		//#endregion
 		//#region src/client/PluginSettingsCard.tsx
 		/**
-		* Shared chrome for the plugin settings card: a disclosure header naming the
-		* plugin and what its settings govern, the controls inside, and the save that
-		* writes them. Renders nothing while the namespace is unavailable — a
+		* Family-shared chrome for plugin settings cards: a disclosure header naming
+		* the plugin and what its settings govern, the controls inside, and the save
+		* that writes them. Renders nothing while the namespace is unavailable — a
 		* deployment that does not compose the owning plugin should show no trace of
-		* it. Mirrors the official ui-plugin-config PluginCard in a self-contained
-		* slice (this package must not depend on a sibling UI package).
+		* it. Inlined into each consumer's client bundle; mirrors the official
+		* ui-plugin-config PluginCard in a self-contained slice.
 		*/
 		/**
 		* Render one plugin settings card.
@@ -2175,6 +2332,7 @@ window.__ModuleLoader__.load({
 			const { state } = props;
 			if (!state.available) return null;
 			const title = props.t(props.titleKey);
+			const description = props.t(props.descriptionKey);
 			const blocked = !state.dirty || state.invalid || state.saving;
 			const cardClass = open ? `${settings_card_module_css_default.cardOpen} ${settings_card_module_css_default.card}` : settings_card_module_css_default.card;
 			if (!state.exposed) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("li", {
@@ -2191,10 +2349,12 @@ window.__ModuleLoader__.load({
 						className: settings_card_module_css_default.headText,
 						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 							className: settings_card_module_css_default.name,
+							title,
 							children: title
 						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 							className: settings_card_module_css_default.description,
-							children: props.t(props.descriptionKey)
+							title: description,
+							children: description
 						})]
 					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
 						width: "14",
@@ -2232,14 +2392,17 @@ window.__ModuleLoader__.load({
 							className: settings_card_module_css_default.headText,
 							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 								className: settings_card_module_css_default.name,
+								title,
 								children: title
 							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 								className: settings_card_module_css_default.description,
-								children: props.t(props.descriptionKey)
+								title: description,
+								children: description
 							})]
 						}),
 						state.dirty ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 							className: settings_card_module_css_default.pending,
+							title: props.t("settings.unsaved"),
 							children: props.t("settings.unsaved")
 						}) : null,
 						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
@@ -2267,10 +2430,10 @@ window.__ModuleLoader__.load({
 						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							className: settings_card_module_css_default.footer,
 							children: [
-								state.failed ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+								state.failed ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
 									className: settings_card_module_css_default.failed,
 									role: "status",
-									children: props.t("settings.saveFailed")
+									children: [props.t("settings.saveFailed"), state.failedReason ? " - " + state.failedReason : ""]
 								}) : null,
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 									type: "button",
@@ -2355,11 +2518,13 @@ window.__ModuleLoader__.load({
 				field,
 				format: (value) => typeof value === "boolean" ? String(value) : "",
 				parse: (text) => {
-					if (text === "true") return {
+					const trimmed = text.trim();
+					if (trimmed === "") return { kind: "clear" };
+					if (trimmed === "true") return {
 						kind: "set",
 						value: true
 					};
-					if (text === "false") return {
+					if (trimmed === "false") return {
 						kind: "set",
 						value: false
 					};
@@ -2381,6 +2546,7 @@ window.__ModuleLoader__.load({
 			listeners = /* @__PURE__ */ new Set();
 			saving = false;
 			failed = false;
+			failedReason;
 			/** @param scope - the bound settings scope for this card's namespace. */
 			constructor(scope, specs) {
 				this.scope = scope;
@@ -2408,7 +2574,8 @@ window.__ModuleLoader__.load({
 					dirty: plan.length > 0,
 					invalid: plan.some((item) => item.run === void 0),
 					saving: this.saving,
-					failed: this.failed
+					failed: this.failed,
+					...this.failedReason === void 0 ? {} : { failedReason: this.failedReason }
 				};
 			}
 			/** Read one field's state from the effective section and its staged draft. */
@@ -2449,28 +2616,50 @@ window.__ModuleLoader__.load({
 						if (this.staged.size === 0 && !this.failed) return;
 						this.staged.clear();
 						this.failed = false;
+						this.failedReason = void 0;
 						this.publish();
 					}
 				};
 			}
 			/**
 			* Write every staged edit, then re-seed from what the Host accepted.
+			*
+			* When the scope carries the optional batch surface (the dsh-web-ui
+			* bridge scope), every planned write rides one mutation so cross-field
+			* validate hooks (baseURL+model) judge the batch as a unit instead of
+			* deadlocking on per-field writes. Otherwise the per-field loop runs.
+			* A field lands only when the Host reports it held the staged value; a
+			* landed field's draft is dropped, a failed one stays staged for the user.
 			* @returns settlement after every write and the read-back.
 			*/
 			async save() {
 				const plan = this.plan();
-				const writes = plan.flatMap((item) => item.run === void 0 ? [] : [item.run]);
-				if (plan.length === 0 || this.saving || writes.length !== plan.length) return;
+				const valid = plan.filter((item) => item.run !== void 0);
+				if (plan.length === 0 || this.saving || valid.length !== plan.length) return;
+				const plannedWrites = valid.map((item) => item.op);
+				const fields = new Set(plan.map((item) => item.field));
 				this.saving = true;
 				this.failed = false;
+				this.failedReason = void 0;
 				this.publish();
-				let landed = true;
-				for (const write of writes) landed = await write() && landed;
-				if (landed) this.staged.clear();
+				const landed = /* @__PURE__ */ new Set();
+				const batch = this.batchedScope();
+				if (batch !== void 0) {
+					const result = await batch.mutate(plannedWrites);
+					if (result.ok) {
+						for (const field of result.fields) if (field.landed) landed.add(field.field);
+					} else this.failedReason = result.message;
+				} else for (const item of valid) if (await item.run()) landed.add(item.field);
+				for (const field of fields) if (landed.has(field)) this.staged.delete(field);
 				this.saving = false;
-				this.failed = !landed;
+				this.failed = landed.size !== fields.size;
 				this.publish();
 			}
+			/** The scope's batch surface when it supports one; undefined conservatively otherwise. */
+			batchedScope() {
+				const candidate = this.scope;
+				return typeof candidate?.mutate === "function" ? candidate : void 0;
+			}
 			/**
 			* Every staged edit a save would write. An entry whose draft is not a value
 			* its field accepts carries no write: the form is still dirty, and the save
@@ -2485,6 +2674,10 @@ window.__ModuleLoader__.load({
 					if (staged.clear) {
 						if (this.stored(field)) plan.push({
 							field,
+							op: {
+								field,
+								op: "unset"
+							},
 							run: () => this.clear(field)
 						});
 						continue;
@@ -2493,14 +2686,27 @@ window.__ModuleLoader__.load({
 					const write = spec.parse(staged.text);
 					if (write === void 0) plan.push({
 						field,
+						op: {
+							field,
+							op: "unset"
+						},
 						run: void 0
 					});
 					else if (write.kind === "clear") plan.push({
 						field,
+						op: {
+							field,
+							op: "unset"
+						},
 						run: () => this.clear(field)
 					});
 					else plan.push({
 						field,
+						op: {
+							field,
+							op: "set",
+							value: write.value
+						},
 						run: () => this.store(field, write.value)
 					});
 				}
@@ -2512,11 +2718,13 @@ window.__ModuleLoader__.load({
 			}
 			async store(field, value) {
 				await this.scope.set(field, value);
+				if (this.specOf(field).secret) return true;
 				return this.userLayer()?.[field] === value;
 			}
 			stage(field, edit) {
 				this.staged.set(field, edit);
 				this.failed = false;
+				this.failedReason = void 0;
 				this.publish();
 			}
 			specOf(field) {