dsh-theme-gallery 0.1.2

package/lib/themes/shan-qing-ting-cai.json

@@ -0,0 +1,290 @@
+[
+  {
+    "id": "shan-qing-ting-cai",
+    "label": "山青婷彩",
+    "description": "青山叠翠，蜓舞生姿 —— 复刻自电商新零售系统管理后台同名主题",
+    "colorScheme": "light",
+    "tokens": {
+      "--dsw-alias-bg-base": {
+        "light": "linear-gradient(to bottom,#F7FCF9 0%,#EDF7F1 55%,#E4F2EA 100%)",
+        "dark": "linear-gradient(to bottom,#F7FCF9 0%,#EDF7F1 55%,#E4F2EA 100%)"
+      },
+      "--dsw-alias-bg-layer-1": {
+        "light": "#FBFEFC",
+        "dark": "#FBFEFC"
+      },
+      "--dsw-alias-bg-layer-2": {
+        "light": "#FFFFFF",
+        "dark": "#FFFFFF"
+      },
+      "--dsw-alias-bg-layer-3": {
+        "light": "#FFFFFF",
+        "dark": "#FFFFFF"
+      },
+      "--dsw-alias-bg-overlay": {
+        "light": "#E3F1E8",
+        "dark": "#E3F1E8"
+      },
+      "--dsw-alias-bg-skeleton": {
+        "light": "#2F7D5E14",
+        "dark": "#2F7D5E14"
+      },
+      "--dsw-alias-bg-module-platform": {
+        "light": "#E4F3EA",
+        "dark": "#E4F3EA"
+      },
+      "--dsw-alias-bg-multi-select": {
+        "light": "#E4F3EA",
+        "dark": "#E4F3EA"
+      },
+      "--dsw-alias-border-l1": {
+        "light": "#2F7D5E0F",
+        "dark": "#2F7D5E0F"
+      },
+      "--dsw-alias-border-l2": {
+        "light": "#2F7D5E21",
+        "dark": "#2F7D5E21"
+      },
+      "--dsw-alias-border-l3": {
+        "light": "#2F7D5E2E",
+        "dark": "#2F7D5E2E"
+      },
+      "--dsw-alias-border-l4": {
+        "light": "#2F7D5E3D",
+        "dark": "#2F7D5E3D"
+      },
+      "--dsw-alias-brand-primary": {
+        "light": "#2F7D5E",
+        "dark": "#2F7D5E"
+      },
+      "--dsw-alias-brand-primary-invert": {
+        "light": "#FFFFFF",
+        "dark": "#FFFFFF"
+      },
+      "--dsw-alias-brand-text": {
+        "light": "#2F7D5E",
+        "dark": "#2F7D5E"
+      },
+      "--dsw-alias-label-primary": {
+        "light": "#1F4638",
+        "dark": "#1F4638"
+      },
+      "--dsw-alias-label-primary-bluish": {
+        "light": "#1F4638",
+        "dark": "#1F4638"
+      },
+      "--dsw-alias-label-secondary": {
+        "light": "#3C6B57",
+        "dark": "#3C6B57"
+      },
+      "--dsw-alias-label-tertiary": {
+        "light": "#5C8474",
+        "dark": "#5C8474"
+      },
+      "--dsw-alias-label-caption": {
+        "light": "#5C8474",
+        "dark": "#5C8474"
+      },
+      "--dsw-alias-label-dimmed": {
+        "light": "#8AA79B",
+        "dark": "#8AA79B"
+      },
+      "--dsw-alias-label-primary-dimmed": {
+        "light": "#3C6B57",
+        "dark": "#3C6B57"
+      },
+      "--dsw-alias-label-primary-foreground": {
+        "light": "#FFFFFF",
+        "dark": "#FFFFFF"
+      },
+      "--dsw-alias-label-primary-inverted": {
+        "light": "#FFFFFF",
+        "dark": "#FFFFFF"
+      },
+      "--dsw-alias-link": {
+        "light": "#D97BA4",
+        "dark": "#D97BA4"
+      },
+      "--dsw-alias-interactive-bg-hover": {
+        "light": "#3E9B7A14",
+        "dark": "#3E9B7A14"
+      },
+      "--dsw-alias-interactive-bg-active": {
+        "light": "#E88BB02E",
+        "dark": "#E88BB02E"
+      },
+      "--dsw-alias-interactive-bg-hover-solid": {
+        "light": "#E4F3EA",
+        "dark": "#E4F3EA"
+      },
+      "--dsw-alias-interactive-bg-hover-accent": {
+        "light": "#E88BB03D",
+        "dark": "#E88BB03D"
+      },
+      "--dsw-alias-button-primary-fill": {
+        "light": "#2F7D5E",
+        "dark": "#2F7D5E"
+      },
+      "--dsw-alias-button-primary-hover": {
+        "light": "#3E9B7A",
+        "dark": "#3E9B7A"
+      },
+      "--dsw-alias-button-primary-dimmed": {
+        "light": "#2F7D5E47",
+        "dark": "#2F7D5E47"
+      },
+      "--dsw-alias-button-ghost-active-fill": {
+        "light": "#E88BB029",
+        "dark": "#E88BB029"
+      },
+      "--dsw-alias-button-ghost-active-border": {
+        "light": "#E88BB0",
+        "dark": "#E88BB0"
+      },
+      "--dsw-alias-button-ghost-active-hover": {
+        "light": "#E88BB047",
+        "dark": "#E88BB047"
+      },
+      "--dsw-alias-button-info-fill": {
+        "light": "#4C9B78",
+        "dark": "#4C9B78"
+      },
+      "--dsw-alias-button-info-hover": {
+        "light": "#3E9B7A",
+        "dark": "#3E9B7A"
+      },
+      "--dsw-alias-button-elevated-fill": {
+        "light": "#FFFFFF",
+        "dark": "#FFFFFF"
+      },
+      "--dsw-alias-button-floating-fill": {
+        "light": "#FFFFFF",
+        "dark": "#FFFFFF"
+      },
+      "--dsw-alias-button-floating-hover": {
+        "light": "#F4FBF7",
+        "dark": "#F4FBF7"
+      },
+      "--dsw-alias-button-contrast-fill": {
+        "light": "#1F4638",
+        "dark": "#1F4638"
+      },
+      "--dsw-alias-markdown-code-block": {
+        "light": "#EAF7F0",
+        "dark": "#EAF7F0"
+      },
+      "--dsw-alias-markdown-code-block-banner": {
+        "light": "#DCEEE2",
+        "dark": "#DCEEE2"
+      },
+      "--dsw-alias-markdown-inline-code": {
+        "light": "#E4F3EA",
+        "dark": "#E4F3EA"
+      },
+      "--dsw-alias-markdown-citation": {
+        "light": "#E4F3EA",
+        "dark": "#E4F3EA"
+      },
+      "--dsw-alias-markdown-tag": {
+        "light": "#E4F3EA",
+        "dark": "#E4F3EA"
+      },
+      "--dsw-alias-markdown-placeholder": {
+        "light": "#DCEEE2",
+        "dark": "#DCEEE2"
+      },
+      "--dsw-alias-markdown-code-segment-selected": {
+        "light": "#E88BB029",
+        "dark": "#E88BB029"
+      },
+      "--dsw-alias-markdown-code-segment-unselected": {
+        "light": "#EAF7F0",
+        "dark": "#EAF7F0"
+      },
+      "--dsw-alias-scrollbar-bg-l1": {
+        "light": "#2F7D5E29",
+        "dark": "#2F7D5E29"
+      },
+      "--dsw-alias-scrollbar-bg-l2": {
+        "light": "#2F7D5E38",
+        "dark": "#2F7D5E38"
+      },
+      "--dsw-alias-scrollbar-hover-l1": {
+        "light": "#2F7D5E52",
+        "dark": "#2F7D5E52"
+      },
+      "--dsw-alias-scrollbar-hover-l2": {
+        "light": "#2F7D5E66",
+        "dark": "#2F7D5E66"
+      },
+      "--dsw-alias-tooltip-bg": {
+        "light": "#1F4638",
+        "dark": "#1F4638"
+      },
+      "--dsw-alias-toast-bg": {
+        "light": "#FFFFFF",
+        "dark": "#FFFFFF"
+      },
+      "--dsw-alias-state-error-primary": {
+        "light": "#C65B6A",
+        "dark": "#C65B6A"
+      },
+      "--dsw-alias-state-error-secondary": {
+        "light": "#DB5A6B",
+        "dark": "#DB5A6B"
+      },
+      "--dsw-alias-state-success-primary": {
+        "light": "#21A675",
+        "dark": "#21A675"
+      },
+      "--dsw-alias-state-success-secondary": {
+        "light": "#2F7D5E",
+        "dark": "#2F7D5E"
+      },
+      "--dsw-alias-state-success-tertiary": {
+        "light": "#9DCDBA",
+        "dark": "#9DCDBA"
+      },
+      "--dsw-alias-state-warn-primary": {
+        "light": "#B97F3A",
+        "dark": "#B97F3A"
+      },
+      "--dsw-alias-state-warn-secondary": {
+        "light": "#D9A45E",
+        "dark": "#D9A45E"
+      },
+      "--dsw-alias-state-warn-tertiary": {
+        "light": "#EFDCC0",
+        "dark": "#EFDCC0"
+      },
+      "--dsw-alias-state-warn-label": {
+        "light": "#8A5A22",
+        "dark": "#8A5A22"
+      },
+      "--dsw-alias-state-business-primary": {
+        "light": "#E88BB0",
+        "dark": "#E88BB0"
+      },
+      "--dsw-alias-state-business-tertiary": {
+        "light": "#F8A8C2",
+        "dark": "#F8A8C2"
+      },
+      "--dsw-specific-sidebar-fill": {
+        "light": "linear-gradient(to bottom,#EAF7F0 0%,#D8EFE4 20%,#C9E8DA 36%,#BFE2D2 50%,#B4DCCA 62%,#A8D2BE 74%,#9CC9B2 86%,#90C0A8 100%)",
+        "dark": "linear-gradient(to bottom,#EAF7F0 0%,#D8EFE4 20%,#C9E8DA 36%,#BFE2D2 50%,#B4DCCA 62%,#A8D2BE 74%,#9CC9B2 86%,#90C0A8 100%)"
+      }
+    },
+    "reading": {
+      "colorScheme": "light",
+      "bg": "#FFFFFF",
+      "alpha": 0.62,
+      "blur": 3,
+      "maxWidth": 640
+    },
+    "accent": "#E88BB0",
+    "ambient": {
+      "kind": "shan",
+      "petals": 7
+    }
+  }
+]

package/package.json

@@ -0,0 +1,118 @@
+{
+  "name": "dsh-theme-gallery",
+  "version": "0.1.2",
+  "description": "A community theme gallery for DeepSeek Harness (DSH): JSON-defined skins with full-screen coverage and ported sidebar scenery, switched from the plugin's own sidebar panel — adding skins needs no code change",
+  "author": "renjie2026 <renjie330@163.com> (https://github.com/renjie2026)",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/renjie2026/dsh-theme-gallery.git"
+  },
+  "homepage": "https://github.com/renjie2026/dsh-theme-gallery#readme",
+  "bugs": {
+    "url": "https://github.com/renjie2026/dsh-theme-gallery/issues"
+  },
+  "type": "module",
+  "main": "lib/index.js",
+  "types": "lib/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./lib/index.d.ts",
+      "default": "./lib/index.js"
+    },
+    "./client": {
+      "types": "./lib/client.d.ts",
+      "default": "./lib/client.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "lib",
+    "schema",
+    "cordis.patch.yml"
+  ],
+  "dsh": {
+    "bundle": {
+      "patch": "./cordis.patch.yml"
+    },
+    "client": {
+      "platform": "web",
+      "inject": [
+        "@deepseek-ai/dsh-client-locale",
+        "@deepseek-ai/dsh-client-ui-theme"
+      ]
+    }
+  },
+  "scripts": {
+    "typecheck": "tsc -p tsconfig.json",
+    "test:schema": "node tests/check-schema.mjs",
+    "test:host": "node tests/smoke-host.mjs",
+    "test:store": "node tests/check-store-contract.mjs",
+    "test:order": "node tests/check-declaration-order.mjs",
+    "test:tdz": "node tests/check-tdz-order.mjs && node tests/check-tdz-logic.mjs",
+    "test:theme": "node tests/check-theme-contribution.mjs",
+    "test:ambient": "node tests/check-ambient-render.mjs",
+    "test:boot": "node tests/check-boot-timing.mjs",
+    "test:safety": "node tests/check-boot-safety.mjs",
+    "test:module": "node tests/check-client-module.mjs",
+    "test:bounded": "node tests/check-bounded-work.mjs",
+    "test:bootpath": "node tests/check-boot-path.mjs",
+    "test:scope": "node tests/check-scope-reach.mjs",
+    "test:scopelogic": "node tests/check-scope-reach-logic.mjs",
+    "test:preview": "node scripts/build-ambient-preview.mjs",
+    "test:calls": "node tests/check-undefined-calls.mjs",
+    "test": "npm run test:schema && npm run test:host && npm run test:store && npm run test:order && npm run test:tdz && npm run test:theme && npm run test:ambient && npm run test:boot && npm run test:safety && npm run test:module && npm run test:bounded && npm run test:bootpath && npm run test:scope && npm run test:scopelogic && npm run test:calls",
+    "prepack": "node scripts/embed-themes.mjs",
+    "publish:check": "node scripts/publish-check.mjs",
+    "embed-themes": "node scripts/embed-themes.mjs",
+    "preview:ambient": "node scripts/build-ambient-preview.mjs",
+    "bench": "node scripts/serve-bench.mjs",
+    "skin:status": "node tools/profile-skin.mjs status",
+    "skin:disable": "node tools/profile-skin.mjs disable",
+    "skin:enable": "node tools/profile-skin.mjs enable",
+    "skin:rollback": "node tools/profile-skin.mjs rollback",
+    "watch:renderer": "node tools/watch-renderer.mjs",
+    "check": "npm run typecheck && npm run test && npm run embed-themes && npm run preview:ambient",
+    "prepublishOnly": "npm run publish:check"
+  },
+  "keywords": [
+    "dsh",
+    "dsh-plugin",
+    "deepseek",
+    "deepseek-harness",
+    "theme",
+    "themes",
+    "skin",
+    "skins",
+    "plugin",
+    "cordis",
+    "desktop"
+  ],
+  "peerDependencies": {
+    "@deepseek-ai/cordis": "^4.0.2",
+    "@deepseek-ai/dsh-client-store": "*",
+    "@deepseek-ai/dsh-client-ui-slots": "*",
+    "@deepseek-ai/dsh-client-ui-theme": "*"
+  },
+  "devDependencies": {
+    "@deepseek-ai/cordis": "^4.0.2",
+    "@deepseek-ai/dsh-client-locale": "0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-store": "0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-ui-layout": "0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-ui-renderer": "0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-ui-settings": "0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-ui-sidebar": "0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-ui-slots": "0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-ui-theme": "0.1.6-alpha.2",
+    "@deepseek-ai/dsh-settings": "0.1.6-alpha.2",
+    "@deepseek-ai/schemastery": "^3.18.4",
+    "@types/react": "~18.3.1",
+    "immer": "^11.1.18",
+    "js-yaml": "^5.4.2",
+    "react": "^19.3.0",
+    "react-dom": "^19.3.0",
+    "typescript": "^5.6.0",
+    "zustand": "^5.0.15"
+  },
+  "license": "MIT"
+}

package/schema/theme.schema.json

@@ -0,0 +1,159 @@
+{
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
+  "$id": "https://github.com/dsh-community/dsh-theme-gallery/schema/theme.schema.json",
+  "title": "DSH theme gallery",
+  "description": "A list of selectable DeepSeek Harness themes. Each theme is a per-scheme override layer over the official base palettes: 'light' and 'dark' are built in, and every third-party theme overrides same-named --dsw-alias-* semantic variables, plus --dsw-specific-* for the surfaces the alias layer cannot express.",
+  "type": "array",
+  "minItems": 1,
+  "items": { "$ref": "#/$defs/theme" },
+  "$defs": {
+    "theme": {
+      "type": "object",
+      "additionalProperties": false,
+      "required": ["id", "label", "description", "colorScheme", "tokens"],
+      "properties": {
+        "id": {
+          "type": "string",
+          "pattern": "^[a-z0-9][a-z0-9-]*$",
+          "minLength": 2,
+          "maxLength": 40,
+          "description": "Stable theme id, also the string passed to ctx.theme.setTheme. Lowercase, digits and dashes only. 'system' is reserved (it is a preference, not a theme) and must not be used."
+        },
+        "label": {
+          "type": "string",
+          "minLength": 1,
+          "maxLength": 60,
+          "description": "Human-readable name shown on the theme button in Settings."
+        },
+        "description": {
+          "type": "string",
+          "minLength": 1,
+          "maxLength": 200,
+          "description": "One-line description shown as the button's tooltip."
+        },
+        "colorScheme": {
+          "enum": ["light", "dark"],
+          "description": "Which base palette the overrides sit on top of. This field — never the id — decides whether body[data-ds-dark-theme] is set. Pick the scheme your tokens were designed for; tokens still need values for both schemes so the theme stays legible if the user's OS flips."
+        },
+        "tokens": {
+          "type": "object",
+          "minProperties": 1,
+          "propertyNames": { "pattern": "^--dsw-(alias|specific)-[a-z0-9-]+$" },
+          "additionalProperties": { "$ref": "#/$defs/modes" },
+          "description": "Token overrides. --dsw-alias-* is the semantic alias layer; --dsw-specific-* is the companion layer the shell reads for surfaces the alias layer cannot express. Notably --dsw-specific-sidebar-fill paints the sidebar column AND the Windows caption row, so setting it to a gradient is how a theme covers the whole screen with no injected CSS. Any token you omit keeps the base palette's value, so a partial set is safe — but see x-required-tokens for the ones that decide whether a theme reads as deliberate."
+        },
+        "reading": {
+          "type": "object",
+          "additionalProperties": false,
+          "required": ["colorScheme", "bg", "alpha", "blur", "maxWidth"],
+          "description": "How the theme recedes once a conversation has messages: the transcript sits on a card built from `bg` lightened toward white at `alpha`, so the skin stops competing with the text. Omit it and the theme never lightens.",
+          "properties": {
+            "colorScheme": {
+              "enum": ["light", "dark"],
+              "description": "Color scheme the transcript card is rendered in."
+            },
+            "bg": { "$ref": "#/$defs/cssValue", "description": "Card base color; lightened toward white at `alpha`." },
+            "alpha": {
+              "type": "number",
+              "minimum": 0,
+              "maximum": 1,
+              "description": "How opaque the card is over the theme fill. Higher reads better; lower keeps the skin visible. 0.6 is a good starting point."
+            },
+            "blur": { "type": "number", "minimum": 0, "maximum": 40, "description": "Backdrop blur in px behind the card." },
+            "maxWidth": { "type": "number", "minimum": 320, "maximum": 1600, "description": "Transcript column width in px while reading. 640 keeps a comfortable measure." }
+          }
+        },
+        "accent": {
+          "$ref": "#/$defs/cssValue",
+          "description": "The theme's marker colour, used for the states that say WHICH workspace or conversation is active. Taken from the theme's own characteristic colour - the source admin system's design rules forbid introducing a hue that does not already exist in the skin. It is stacked as an overrideTokens layer over --dsw-alias-button-ghost-active-fill/-border/-hover, the family the sidebar entry and the selected conversation row read. Omit it and the theme keeps the base palette's selection colour."
+        },
+        "ambient": {
+          "type": "object",
+          "additionalProperties": false,
+          "required": ["kind"],
+          "description": "Scenery drawn inside the sidebar column, ported from the source admin system where each theme mounted its own animation component behind the left menu. Only the two kinds this plugin ships artwork for are accepted; a theme without this field gets no scenery.",
+          "properties": {
+            "kind": {
+              "enum": ["shan", "dream"],
+              "description": "Which ported scene to draw: 'shan' is 山青婷彩 (mountains, mist, water, ripples, dragonflies, falling petals); 'dream' is 梦海游鱼 (corner glow, light washes, rising bubbles, glowing motes, swimming cartoon fish, swaying seaweed)."
+            },
+            "petals": {
+              "type": "integer",
+              "minimum": 0,
+              "maximum": 20,
+              "description": "'shan' only: how many petals to seed. Each gets its own size, duration and phase from a deterministic formula, so the count is the only knob."
+            },
+            "bubbles": {
+              "type": "integer",
+              "minimum": 0,
+              "maximum": 24,
+              "description": "'dream' only: how many pale outlined bubbles to seed."
+            },
+            "motes": {
+              "type": "integer",
+              "minimum": 0,
+              "maximum": 24,
+              "description": "'dream' only: how many light-blue glowing motes to seed. A SEPARATE effect from the bubbles — both are drawn at once, so the two counts are independent."
+            },
+            "fish": {
+              "type": "integer",
+              "minimum": 0,
+              "maximum": 6,
+              "description": "'dream' only: how many cartoon fish to swim across the water. A third independent effect, ported from the source system's FishAnimation component."
+            }
+          }
+        }
+      }
+    },
+    "modes": {
+      "type": "object",
+      "additionalProperties": false,
+      "required": ["light", "dark"],
+      "properties": {
+        "light": { "$ref": "#/$defs/cssValue" },
+        "dark": { "$ref": "#/$defs/cssValue" }
+      },
+      "description": "The AUTHORING format for one token, and it applies to this JSON only. At registration time the loader flattens each pair to the theme's own `colorScheme`, because `register()` consumes `Record<string, string>` and stores the definition by reference - handing it a pair writes the literal string '[object Object]' into the CSS variable. The pair shape is what the runtime's `overrideTokens()` layers require, which is why the two must not be confused."
+    },
+    "cssValue": {
+      "type": "string",
+      "minLength": 1,
+      "maxLength": 160,
+      "description": "Any CSS value: a literal (#f7f3ea, rgba(...)), or a reference to a shipped palette token such as var(--dsw-static-neutral-bluish-900). Prefer the var() form for anything that should follow the product palette."
+    }
+  },
+  "$comment": "Required token set, sourced from @deepseek-ai/dsh-client-ui-theme's BUILTIN_INSPECT_TOKENS entries that declare requiresLightAndDark: true. The runtime does not validate completeness — an incomplete override set is accepted and silently looks wrong — so this schema, not the runtime, is where that check lives.",
+  "x-required-tokens": [
+    "--dsw-alias-bg-base",
+    "--dsw-alias-bg-layer-1",
+    "--dsw-alias-bg-layer-2",
+    "--dsw-alias-bg-overlay",
+    "--dsw-alias-border-l1",
+    "--dsw-alias-border-l2",
+    "--dsw-alias-brand-primary",
+    "--dsw-alias-label-primary",
+    "--dsw-alias-label-secondary",
+    "--dsw-alias-state-error-primary",
+    "--dsw-alias-state-success-primary",
+    "--dsw-alias-state-warn-primary"
+  ],
+  "x-recommended-tokens": [
+    "--dsw-alias-bg-layer-3",
+    "--dsw-alias-border-l3",
+    "--dsw-alias-border-l4",
+    "--dsw-alias-label-tertiary",
+    "--dsw-alias-label-caption",
+    "--dsw-alias-link",
+    "--dsw-alias-interactive-bg-hover",
+    "--dsw-alias-interactive-bg-active",
+    "--dsw-alias-button-primary-fill",
+    "--dsw-alias-button-primary-hover",
+    "--dsw-alias-markdown-code-block",
+    "--dsw-alias-markdown-inline-code",
+    "--dsw-alias-scrollbar-bg-l1",
+    "--dsw-alias-scrollbar-bg-l2",
+    "--dsw-alias-scrollbar-hover-l1",
+    "--dsw-alias-scrollbar-hover-l2"
+  ],
+  "x-all-tokens-note": "The full alias surface is 81 variables; the authoritative list lives in packages/client/ui-theme/src/styles/design-platform.css in the official repository."
+}