dsh-dracula-theme 0.1.0 → 0.1.3

package/README.md

@@ -12,7 +12,7 @@
 
 ## Preview
 
-![Dracula skin applied to the DSH Web GUI](assets/preview.webp)
+![Dracula skin applied to the DSH Web GUI](assets/preview.png)
 
 The classic Dracula canvas (`#282a36`) mapped onto the full DSH surface stack — sidebar, conversations, code blocks — with the purple/cyan brand accents from the official Dracula DeepSeek port.
 
@@ -56,3 +56,11 @@ The token tables are generated: edit the anchors in `palette/dracula.json` (colo
 ## License
 
 MIT — see [LICENSE](LICENSE). Structure modeled on [dsh-catppuccin](https://github.com/zhijun-dai/Catppuccin-dsh-theme) (MIT); token mapping adopted from the official [Dracula DeepSeek port](https://github.com/dracula/deepseek) (MIT).
+
+## Development workflow
+
+1. Edit the anchors in `palette/dracula.json` — colors, the official canvas/brand/code mappings, `grayRamp`, `soft.background`.
+2. `npm run generate` — rebuilds `themes/*.json` and `lib/client.js` (the browser bundle).
+3. Validate: `node scripts/check-themes.mjs` (structural token check) — CI runs the same check plus a generated-artifacts diff.
+4. Test in a live profile: `dsh plugin --profile web add /path/to/this/repo` (local link), restart the profile, pick a skin in **Settings → General → Dracula theme**.
+5. Release: bump `version` in `package.json`, commit, push, `pnpm publish`, then update the profile to the published version (`dsh plugin --profile web add dsh-dracula-theme`) and restart the app. The profile installs from npm, not from the working tree — local edits only take effect after publishing or via a local link.

package/README.zh.md

@@ -12,7 +12,7 @@
 
 ## 预览
 
-![德古拉主题应用在 DSH Web GUI 上的效果](assets/preview.webp)
+![德古拉主题应用在 DSH Web GUI 上的效果](assets/preview.png)
 
 经典德古拉画布（`#282a36`）映射到 DSH 全部界面层 —— 侧边栏、会话、代码块，品牌点缀色取自官方 Dracula DeepSeek 移植版的紫/青配色。
 
@@ -55,3 +55,11 @@ token 表是生成出来的：修改 `palette/dracula.json` 里的锚点（颜
 ## 许可
 
 MIT —— 见 [LICENSE](LICENSE)。结构参考 [dsh-catppuccin](https://github.com/zhijun-dai/Catppuccin-dsh-theme)（MIT）。
+
+## 开发工作流
+
+1. 修改 `palette/dracula.json` 里的锚点——颜色、官方 canvas/brand/代码映射、`grayRamp`、`soft.background`。
+2. `npm run generate` —— 重新生成 `themes/*.json` 与 `lib/client.js`（浏览器 bundle）。
+3. 校验：`node scripts/check-themes.mjs`（token 结构检查）——CI 会跑同样的检查，外加生成产物 diff。
+4. 在真实 profile 里测试：`dsh plugin --profile web add /path/to/this/repo`（本地 link），重启 profile，在**设置 → 通用 → 德古拉主题**里选择皮肤。
+5. 发版：`package.json` 升 `version`，提交推送，`pnpm publish`，再把 profile 更新到已发布版本（`dsh plugin --profile web add dsh-dracula-theme`）并重启应用。profile 从 npm 安装，不走工作区——本地改动只有发布后（或通过本地 link）才会生效。

package/lib/client.js

@@ -45,7 +45,9 @@ window.__ModuleLoader__.load({
 		  "tokens": {
 		    "--dsw-static-neutral-50": "#efefe9",
 		    "--dsw-static-neutral-100": "#e2e2da",
+		    "--dsw-static-neutral-150": "#d8d8d0",
 		    "--dsw-static-neutral-200": "#cdcdc5",
+		    "--dsw-static-neutral-250": "#c2c2ba",
 		    "--dsw-static-neutral-300": "#b6b6ae",
 		    "--dsw-static-neutral-400": "#8f8f96",
 		    "--dsw-static-neutral-500": "#6d6d7a",
@@ -56,7 +58,6 @@ window.__ModuleLoader__.load({
 		    "--dsw-static-neutral-850": "#282a36",
 		    "--dsw-static-neutral-900": "#20212b",
 		    "--dsw-static-neutral-1000": "#191a21",
-		    "--dsw-static-neutral-description": "Anchor stops of the neutral grayscale ramp (--dsw-static-neutral-*), lightest (00) to darkest (1000). The official port does not override this ramp; values are Dracula-gray interpolations for a self-contained theme.",
 		    "--dsw-static-neutral-00": "#f8f8f2",
 		    "--dsw-static-neutral-bluish-50": "#f8f8f2",
 		    "--dsw-static-neutral-bluish-60": "#282a36",
@@ -89,7 +90,6 @@ window.__ModuleLoader__.load({
 		    "--dsw-static-deepseek-600": "#7a5abf",
 		    "--dsw-static-deepseek-800": "#44475a",
 		    "--dsw-static-deepseek-900": "#383a4a",
-		    "--dsw-static-deepseek-description": "--dsw-static-deepseek-* overrides from the official port. 400 link / brand-text → cyan, 450 brand-primary → purple, 500 hover.",
 		    "--dsw-static-deepseek-700-delete": "#5a3e99",
 		    "--dsw-static-blue-50": "#eafcff",
 		    "--dsw-static-blue-75": "#c6f3fd",
@@ -208,7 +208,6 @@ window.__ModuleLoader__.load({
 		    "--dsw-specific-menu": "#2e3040",
 		    "--dsw-specific-selector": "#44475a",
 		    "--dsw-specific-tip": "#2e3040",
-		    "--shiki-description": "The official Prism token mapping, translated to the DSH shiki vocabulary: comments #6272a4, punctuation #f8f8f2, tags/parameters/this → cyan, numbers/constants/strings/inserted → yellow, keywords/operators/builtins/regex → pink, functions → green, deleted/important → red.",
 		    "--shiki-foreground": "#f8f8f2",
 		    "--shiki-background": "#282a36",
 		    "--shiki-token-comment": "#6272a4",
@@ -234,7 +233,9 @@ window.__ModuleLoader__.load({
 		  "tokens": {
 		    "--dsw-static-neutral-50": "#efefe9",
 		    "--dsw-static-neutral-100": "#e2e2da",
+		    "--dsw-static-neutral-150": "#d8d8d0",
 		    "--dsw-static-neutral-200": "#cdcdc5",
+		    "--dsw-static-neutral-250": "#c2c2ba",
 		    "--dsw-static-neutral-300": "#b6b6ae",
 		    "--dsw-static-neutral-400": "#8f8f96",
 		    "--dsw-static-neutral-500": "#6d6d7a",
@@ -245,7 +246,6 @@ window.__ModuleLoader__.load({
 		    "--dsw-static-neutral-850": "#282a36",
 		    "--dsw-static-neutral-900": "#20212b",
 		    "--dsw-static-neutral-1000": "#191a21",
-		    "--dsw-static-neutral-description": "Anchor stops of the neutral grayscale ramp (--dsw-static-neutral-*), lightest (00) to darkest (1000). The official port does not override this ramp; values are Dracula-gray interpolations for a self-contained theme.",
 		    "--dsw-static-neutral-00": "#f8f8f2",
 		    "--dsw-static-neutral-bluish-50": "#f8f8f2",
 		    "--dsw-static-neutral-bluish-60": "#282a36",
@@ -278,7 +278,6 @@ window.__ModuleLoader__.load({
 		    "--dsw-static-deepseek-600": "#7a5abf",
 		    "--dsw-static-deepseek-800": "#44475a",
 		    "--dsw-static-deepseek-900": "#383a4a",
-		    "--dsw-static-deepseek-description": "--dsw-static-deepseek-* overrides from the official port. 400 link / brand-text → cyan, 450 brand-primary → purple, 500 hover.",
 		    "--dsw-static-deepseek-700-delete": "#5a3e99",
 		    "--dsw-static-blue-50": "#eafcff",
 		    "--dsw-static-blue-75": "#c6f3fd",
@@ -397,7 +396,6 @@ window.__ModuleLoader__.load({
 		    "--dsw-specific-menu": "#343746",
 		    "--dsw-specific-selector": "#44475a",
 		    "--dsw-specific-tip": "#343746",
-		    "--shiki-description": "The official Prism token mapping, translated to the DSH shiki vocabulary: comments #6272a4, punctuation #f8f8f2, tags/parameters/this → cyan, numbers/constants/strings/inserted → yellow, keywords/operators/builtins/regex → pink, functions → green, deleted/important → red.",
 		    "--shiki-foreground": "#f8f8f2",
 		    "--shiki-background": "#282a36",
 		    "--shiki-token-comment": "#6272a4",
@@ -456,13 +454,49 @@ window.__ModuleLoader__.load({
 			}
 		}
 
-		/** Saved skin id (may be unknown/absent). */
+		/**
+		 * The DSH Desktop client boots its web app on a fresh random port
+		 * every launch (`--port 0`), and localStorage is scoped per origin —
+		 * including the port. A choice saved under http://127.0.0.1:55337 is
+		 * invisible to the next launch at http://127.0.0.1:49562, so the
+		 * theme silently reverts to default on every desktop start.
+		 * Cookies, by contrast, are scoped per host and ignore the port, and
+		 * the desktop client keeps a persistent cookie jar. So the saved
+		 * skin is mirrored into a host-scoped cookie; reads prefer the
+		 * cookie and fall back to localStorage (the plain `dsh web` browser
+		 * session keeps its fixed-port origin, where both stores agree).
+		 */
+		const COOKIE_KEY = "dsh-dracula-skin";
+		const COOKIE_MAX_AGE = 60 * 60 * 24 * 400;
+
+		/** Read a cookie value (null on absence). */
+		function readCookie(name) {
+			try {
+				const match = document.cookie.match(new RegExp(`(?:^|;\\s*)${name.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")}=([^;]*)`));
+				return match ? decodeURIComponent(match[1]) : null;
+			} catch {
+				return null;
+			}
+		}
+
+		/** Write (or remove with max-age=0) a cookie. */
+		function writeCookie(name, value) {
+			try {
+				if (value === null) document.cookie = `${name}=; path=/; max-age=0`;
+				else document.cookie = `${name}=${encodeURIComponent(value)}; path=/; max-age=${COOKIE_MAX_AGE}`;
+			} catch {
+				// storage unavailable — the preference stays process-local
+			}
+		}
+
+		/** Saved skin id (may be unknown/absent): cookie first, localStorage fallback. */
 		function readSavedSkin() {
-			return readStorage(STORAGE_KEY);
+			return readCookie(COOKIE_KEY) ?? readStorage(STORAGE_KEY);
 		}
 
 		/** Persist a skin choice; DEFAULT_SKIN clears the stored value. */
 		function writeSavedSkin(id) {
+			writeCookie(COOKIE_KEY, id === DEFAULT_SKIN ? null : id);
 			writeStorage(STORAGE_KEY, id === DEFAULT_SKIN ? null : id);
 		}
 		//#endregion
@@ -765,29 +799,51 @@ window.__ModuleLoader__.load({
 				style.remove();
 			}, "dsh-dracula-theme: surface tint lifecycle");
 
-			// Restore the saved skin. The ThemeService adopts its durable
-			// built-in preference ("light"/"dark"/"system") from the Host
-			// settings scope asynchronously after boot, which overwrites a
-			// third-party preference restored too early. Re-assert the saved
-			// skin for a short boot window (a handful of change events or a
-			// few seconds), then yield to subsequent user actions.
+			// Restore the saved skin against the boot adoption storm. The
+			// ThemeService adopts its durable built-in preference
+			// ("light"/"dark"/"system") from the Host settings scope
+			// asynchronously after boot; every adoption emits theme/change
+			// with a built-in preference that overwrites a third-party one.
+			// In slower boot paths — the desktop client's RPC bridge emits
+			// more, later sync events — a fixed retry budget (a handful of
+			// tries within a few seconds) can be exhausted and the theme
+			// silently reverts to default. So instead of a time-boxed guard
+			// we stay armed while the storm is active: re-assert the saved
+			// skin on every built-in revert, and only yield to user actions
+			// once the preference has rested on the saved skin for a quiet
+			// period with no further adoption events.
 			const saved = readSavedSkin();
 			const savedValid = typeof saved === "string" && saved !== DEFAULT_SKIN && SKINS.some((skinDefinition) => skinDefinition.id === saved);
-			let bootGuard = savedValid ? 3 : 0;
-			const reassertSaved = () => {
-				if (bootGuard <= 0) return;
-				const current = ctx.theme.getTheme().preference;
-				if (current === saved) return;
-				bootGuard -= 1;
-				ctx.theme.setTheme(saved);
+			let armed = savedValid;
+			let quietTimer;
+			const disarm = () => {
+				armed = false;
+			};
+			const scheduleDisarm = () => {
+				clearTimeout(quietTimer);
+				quietTimer = setTimeout(disarm, 4000);
+			};
+			const reassertAgainstAdoption = () => {
+				if (!armed) return;
+				const pref = ctx.theme.getTheme().preference;
+				if (pref === saved) {
+					scheduleDisarm();
+					return;
+				}
+				if (pref === "light" || pref === "dark" || pref === DEFAULT_SKIN) {
+					// A built-in won — during boot this can only be a scope
+					// adoption (nobody reaches the Appearance row that fast).
+					// Re-assert, then require another quiet period.
+					ctx.theme.setTheme(saved);
+					scheduleDisarm();
+				}
+				// Another third-party theme — the drop-foreign convention
+				// below clears our stored choice instead of fighting.
 			};
-			reassertSaved();
-			const bootWindow = setTimeout(() => {
-				bootGuard = 0;
-			}, 5000);
+			reassertAgainstAdoption();
 			ctx.effect(() => () => {
-				clearTimeout(bootWindow);
-			}, "dsh-dracula: boot restore window");
+				clearTimeout(quietTimer);
+			}, "dsh-dracula-theme: boot restore lifecycle");
 
 			const skinStore = createSkinStore();
 			let skinBound;
@@ -807,7 +863,7 @@ window.__ModuleLoader__.load({
 				// dispatch is missed by other subscribers (ui-layout's
 				// ThemePresenter), so the restored skin would never reach the DOM.
 				setTimeout(() => {
-					reassertSaved();
+					reassertAgainstAdoption();
 				}, 0);
 			});
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-dracula-theme",
-  "version": "0.1.0",
+  "version": "0.1.3",
   "description": "🧛 Dracula theme for DeepSeek Harness: the classic dark palette (plus the Soft variant) registered into the built-in theme runtime",
   "license": "MIT",
   "author": "ossFrankFrank",
@@ -29,7 +29,8 @@
     "lib/index.js",
     "lib/client.js",
     "cordis.patch.yml",
-    "themes"
+    "themes",
+    "assets"
   ],
   "dsh": {
     "bundle": {

package/themes/dracula-soft.json

@@ -5,7 +5,9 @@
   "tokens": {
     "--dsw-static-neutral-50": "#efefe9",
     "--dsw-static-neutral-100": "#e2e2da",
+    "--dsw-static-neutral-150": "#d8d8d0",
     "--dsw-static-neutral-200": "#cdcdc5",
+    "--dsw-static-neutral-250": "#c2c2ba",
     "--dsw-static-neutral-300": "#b6b6ae",
     "--dsw-static-neutral-400": "#8f8f96",
     "--dsw-static-neutral-500": "#6d6d7a",
@@ -16,7 +18,6 @@
     "--dsw-static-neutral-850": "#282a36",
     "--dsw-static-neutral-900": "#20212b",
     "--dsw-static-neutral-1000": "#191a21",
-    "--dsw-static-neutral-description": "Anchor stops of the neutral grayscale ramp (--dsw-static-neutral-*), lightest (00) to darkest (1000). The official port does not override this ramp; values are Dracula-gray interpolations for a self-contained theme.",
     "--dsw-static-neutral-00": "#f8f8f2",
     "--dsw-static-neutral-bluish-50": "#f8f8f2",
     "--dsw-static-neutral-bluish-60": "#282a36",
@@ -49,7 +50,6 @@
     "--dsw-static-deepseek-600": "#7a5abf",
     "--dsw-static-deepseek-800": "#44475a",
     "--dsw-static-deepseek-900": "#383a4a",
-    "--dsw-static-deepseek-description": "--dsw-static-deepseek-* overrides from the official port. 400 link / brand-text → cyan, 450 brand-primary → purple, 500 hover.",
     "--dsw-static-deepseek-700-delete": "#5a3e99",
     "--dsw-static-blue-50": "#eafcff",
     "--dsw-static-blue-75": "#c6f3fd",
@@ -168,7 +168,6 @@
     "--dsw-specific-menu": "#343746",
     "--dsw-specific-selector": "#44475a",
     "--dsw-specific-tip": "#343746",
-    "--shiki-description": "The official Prism token mapping, translated to the DSH shiki vocabulary: comments #6272a4, punctuation #f8f8f2, tags/parameters/this → cyan, numbers/constants/strings/inserted → yellow, keywords/operators/builtins/regex → pink, functions → green, deleted/important → red.",
     "--shiki-foreground": "#f8f8f2",
     "--shiki-background": "#282a36",
     "--shiki-token-comment": "#6272a4",

package/themes/dracula.json

@@ -5,7 +5,9 @@
   "tokens": {
     "--dsw-static-neutral-50": "#efefe9",
     "--dsw-static-neutral-100": "#e2e2da",
+    "--dsw-static-neutral-150": "#d8d8d0",
     "--dsw-static-neutral-200": "#cdcdc5",
+    "--dsw-static-neutral-250": "#c2c2ba",
     "--dsw-static-neutral-300": "#b6b6ae",
     "--dsw-static-neutral-400": "#8f8f96",
     "--dsw-static-neutral-500": "#6d6d7a",
@@ -16,7 +18,6 @@
     "--dsw-static-neutral-850": "#282a36",
     "--dsw-static-neutral-900": "#20212b",
     "--dsw-static-neutral-1000": "#191a21",
-    "--dsw-static-neutral-description": "Anchor stops of the neutral grayscale ramp (--dsw-static-neutral-*), lightest (00) to darkest (1000). The official port does not override this ramp; values are Dracula-gray interpolations for a self-contained theme.",
     "--dsw-static-neutral-00": "#f8f8f2",
     "--dsw-static-neutral-bluish-50": "#f8f8f2",
     "--dsw-static-neutral-bluish-60": "#282a36",
@@ -49,7 +50,6 @@
     "--dsw-static-deepseek-600": "#7a5abf",
     "--dsw-static-deepseek-800": "#44475a",
     "--dsw-static-deepseek-900": "#383a4a",
-    "--dsw-static-deepseek-description": "--dsw-static-deepseek-* overrides from the official port. 400 link / brand-text → cyan, 450 brand-primary → purple, 500 hover.",
     "--dsw-static-deepseek-700-delete": "#5a3e99",
     "--dsw-static-blue-50": "#eafcff",
     "--dsw-static-blue-75": "#c6f3fd",
@@ -168,7 +168,6 @@
     "--dsw-specific-menu": "#2e3040",
     "--dsw-specific-selector": "#44475a",
     "--dsw-specific-tip": "#2e3040",
-    "--shiki-description": "The official Prism token mapping, translated to the DSH shiki vocabulary: comments #6272a4, punctuation #f8f8f2, tags/parameters/this → cyan, numbers/constants/strings/inserted → yellow, keywords/operators/builtins/regex → pink, functions → green, deleted/important → red.",
     "--shiki-foreground": "#f8f8f2",
     "--shiki-background": "#282a36",
     "--shiki-token-comment": "#6272a4",