@lemoncat7/dsh-theme-xiaohei 0.4.4 → 0.4.5

package/lib/scene/character-motion.js

@@ -1,4 +1,4 @@
-import { CHARACTER_MOTION } from '../generated-character-motion.js';
+import { characterAssets } from './character-assets.js';
 import { createCharacterMotionClock } from './character-motion-clock.js';
 import { createRigRenderer } from './character-rig-renderer.js';
 import { EYE_RIGS } from './character-eye-rig.js';
@@ -10,6 +10,7 @@ export function createCharacterMotion(doc) {
     let disposed = false, part, rig;
     let canvas, render;
     let pose = '', appearance = '', revision = 0, nearby = false, lastPointer = 0;
+    let selection = '';
     let attentionTimer, lastAttention = -Infinity;
     let gazePoint = [0, 0], activeAction, activeProgress = 0;
     let bounds;
@@ -46,9 +47,10 @@ export function createCharacterMotion(doc) {
             return;
         const mode = doc.documentElement.dataset.xiaoheiAppearance === 'light' ? 'light' : 'dark';
         const moving = doc.documentElement.hasAttribute('data-xiaohei-sidebar-resizing');
-        const next = !doc.hidden && !reduced.matches && !moving && part ? CHARACTER_MOTION[pose]?.[mode] : undefined;
-        if (next === rig && appearance === mode)
+        const key = !doc.hidden && !reduced.matches && !moving && part ? `${pose}-${mode}` : '';
+        if (key === selection && appearance === mode)
             return;
+        selection = key;
         cancelAttention();
         render = undefined;
         clock.setClips(undefined);
@@ -61,15 +63,19 @@ export function createCharacterMotion(doc) {
         canvas = undefined;
         if (part)
             part.dataset.motion = 'rest';
-        rig = next;
+        rig = undefined;
         appearance = mode;
         nearby = false;
-        if (!next || !part)
+        if (!key || !part)
             return;
         const currentPart = part;
-        void Promise.all(Object.values(next.layers).map(layer => decode(layer.src))).then(() => {
+        void characterAssets.rig(pose, mode).then(async (next) => {
+            if (!next || disposed || current !== revision)
+                return;
+            await Promise.all(Object.values(next.layers).map(layer => decode(layer.src)));
             if (disposed || current !== revision || Object.values(next.layers).some(layer => !images.get(layer.src)))
                 return;
+            rig = next;
             canvas = doc.createElement('canvas');
             canvas.className = 'xiaohei-character-motion';
             canvas.width = next.size[0];
@@ -87,7 +93,7 @@ export function createCharacterMotion(doc) {
                 ...(next.layers.tail ? { tail: { duration: 2400 } } : {}),
                 attention: { duration: 2400 },
             });
-        });
+        }).catch(() => { });
     }
     const pointer = (event) => {
         if (!part || !render || event.pointerType !== 'mouse')
@@ -141,6 +147,7 @@ export function createCharacterMotion(doc) {
             if (nextPart !== part || pose !== nextPose) {
                 cancelAttention();
                 revision++;
+                selection = '';
                 render = undefined;
                 clock.setClips(undefined);
                 gaze.reset();

package/lib/scene/ids.d.ts

@@ -0,0 +1,5 @@
+/** Asset-free identifiers shared by the startup shell and deferred scenery. */
+export declare const XIAOHEI_SCENE_STYLE_ID = "dsh-theme-xiaohei/scene-style";
+export declare const XIAOHEI_SCENE_LAYER_ID = "dsh-theme-xiaohei/scene-layer";
+export declare const XIAOHEI_SCENE_WORLD_CLASS = "xiaohei-scene__world";
+//# sourceMappingURL=ids.d.ts.map

package/lib/scene/ids.js

@@ -0,0 +1,5 @@
+/** Asset-free identifiers shared by the startup shell and deferred scenery. */
+export const XIAOHEI_SCENE_STYLE_ID = 'dsh-theme-xiaohei/scene-style';
+export const XIAOHEI_SCENE_LAYER_ID = 'dsh-theme-xiaohei/scene-layer';
+export const XIAOHEI_SCENE_WORLD_CLASS = 'xiaohei-scene__world';
+//# sourceMappingURL=ids.js.map

package/lib/scene/runtime.d.ts

@@ -4,7 +4,7 @@ export declare function configureXiaoheiWorldRenderer(renderer: XiaoheiWorldRend
 /** Number of top-level decorative parts installed into the ambient layer. */
 export declare const XIAOHEI_SCENE_PART_COUNT: 1;
 /**
- * Install the static wallpaper after plugin boot becomes idle. Appearance is
+ * Install the small static wallpaper immediately with the theme. Appearance is
  * CSS-driven; no image load handlers or per-frame character animation.
  */
 export declare function installXiaoheiScene(doc?: Document | undefined): () => void;

package/lib/scene/runtime.js

@@ -14,7 +14,7 @@ const PARTS = [
 /** Number of top-level decorative parts installed into the ambient layer. */
 export const XIAOHEI_SCENE_PART_COUNT = PARTS.length;
 /**
- * Install the static wallpaper after plugin boot becomes idle. Appearance is
+ * Install the small static wallpaper immediately with the theme. Appearance is
  * CSS-driven; no image load handlers or per-frame character animation.
  */
 export function installXiaoheiScene(doc = typeof document === 'undefined' ? undefined : document) {
@@ -60,22 +60,9 @@ export function installXiaoheiScene(doc = typeof document === 'undefined' ? unde
             style.remove();
         };
     };
-    const win = doc.defaultView;
-    let cancelSchedule = () => { };
-    if (win !== null && typeof win.requestIdleCallback === 'function') {
-        const idleId = win.requestIdleCallback(mount, { timeout: 800 });
-        cancelSchedule = () => win.cancelIdleCallback(idleId);
-    }
-    else if (win !== null) {
-        const timeoutId = win.setTimeout(mount, 0);
-        cancelSchedule = () => win.clearTimeout(timeoutId);
-    }
-    else {
-        mount();
-    }
+    mount();
     return () => {
         disposed = true;
-        cancelSchedule();
         removeMountedScene();
     };
 }

package/lib/scene/styles.d.ts

@@ -1,7 +1,5 @@
+export { XIAOHEI_SCENE_STYLE_ID, XIAOHEI_SCENE_LAYER_ID, XIAOHEI_SCENE_WORLD_CLASS } from './ids.js';
 /** Stable scene and material ids, shared with lifecycle and browser checks. */
-export declare const XIAOHEI_SCENE_STYLE_ID = "dsh-theme-xiaohei/scene-style";
-export declare const XIAOHEI_SCENE_LAYER_ID = "dsh-theme-xiaohei/scene-layer";
-export declare const XIAOHEI_SCENE_WORLD_CLASS = "xiaohei-scene__world";
 /** Static paired wallpapers; no per-frame effects or session-state dependency. */
 export declare const XIAOHEI_SCENE_CSS: string;
 //# sourceMappingURL=styles.d.ts.map

package/lib/scene/styles.js

@@ -1,9 +1,7 @@
 import { XIAOHEI_WALLPAPER_LIGHT, XIAOHEI_WALLPAPER_DARK, } from '../generated-backgrounds.js';
-import { XIAOHEI_WALLPAPER_CHARACTER_CSS } from './wallpaper-character-styles.js';
+import { XIAOHEI_SCENE_LAYER_ID, XIAOHEI_SCENE_WORLD_CLASS } from './ids.js';
+export { XIAOHEI_SCENE_STYLE_ID, XIAOHEI_SCENE_LAYER_ID, XIAOHEI_SCENE_WORLD_CLASS } from './ids.js';
 /** Stable scene and material ids, shared with lifecycle and browser checks. */
-export const XIAOHEI_SCENE_STYLE_ID = 'dsh-theme-xiaohei/scene-style';
-export const XIAOHEI_SCENE_LAYER_ID = 'dsh-theme-xiaohei/scene-layer';
-export const XIAOHEI_SCENE_WORLD_CLASS = 'xiaohei-scene__world';
 /** Static paired wallpapers; no per-frame effects or session-state dependency. */
 export const XIAOHEI_SCENE_CSS = `
 body {
@@ -57,10 +55,6 @@ html[data-xiaohei-appearance='light'] .${XIAOHEI_SCENE_WORLD_CLASS} {
   --xiaohei-wallpaper-wide: url("${XIAOHEI_WALLPAPER_LIGHT}");
 }
 
-/* The atmosphere contains no character; responsive poses are placed separately
- * against measured free space, never by cropping a portrait into messages. */
-${XIAOHEI_WALLPAPER_CHARACTER_CSS}
-
 .${XIAOHEI_SCENE_WORLD_CLASS} > * {
   width: 100%;
   height: 100%;

package/lib/scene/wallpaper-character-styles.js

@@ -1,8 +1,7 @@
-import { CHARACTER_POSES, CHARACTER_POSE_NAMES } from './character-poses.js';
+import { CHARACTER_POSE_NAMES } from './character-assets.js';
 /** Complete raster poses remain crisp; only entry/exit opacity and transform move. */
 export const XIAOHEI_WALLPAPER_CHARACTER_CSS = `
 .xiaohei-wallpaper-character {
-  ${CHARACTER_POSE_NAMES.map(pose => `--xiaohei-${pose}-art: url("${CHARACTER_POSES[pose].dark}");`).join('\n  ')}
   position: absolute;
   inset: 0;
   pointer-events: none;
@@ -11,9 +10,6 @@ export const XIAOHEI_WALLPAPER_CHARACTER_CSS = `
 html[data-xiaohei-sidebar-resizing] .xiaohei-wallpaper-character {
   visibility: hidden;
 }
-html[data-xiaohei-appearance='light'] .xiaohei-wallpaper-character {
-  ${CHARACTER_POSE_NAMES.map(pose => `--xiaohei-${pose}-art: url("${CHARACTER_POSES[pose].light}");`).join('\n  ')}
-}
 .xiaohei-wallpaper-character > span {
   position: absolute;
   display: block;

package/lib/scene/wallpaper-character.d.ts

@@ -1,4 +1,5 @@
+import { type CharacterPose, type CharacterAppearance } from './character-assets.js';
 export declare const XIAOHEI_WALLPAPER_CHARACTER_ID = "dsh-theme-xiaohei/wallpaper-character";
 /** Places the layered character only when the host geometry is settled. */
-export declare function installXiaoheiWallpaperCharacter(doc?: Document | undefined): () => void;
+export declare function installXiaoheiWallpaperCharacter(doc?: Document | undefined, loadPose?: (pose: CharacterPose, appearance: CharacterAppearance) => Promise<string>): () => void;
 //# sourceMappingURL=wallpaper-character.d.ts.map

package/lib/scene/wallpaper-character.js

@@ -1,13 +1,13 @@
 import { subscribeXiaoheiHostDom } from '../host-dom.js';
 import { XIAOHEI_HOST_SELECTORS } from '../host-contract.js';
-import { XIAOHEI_SCENE_LAYER_ID } from './styles.js';
+import { XIAOHEI_SCENE_LAYER_ID } from './ids.js';
 import { resolveCharacterPlacement } from './character-layout.js';
 import { createCharacterIdleController } from './character-idle.js';
-import { CHARACTER_POSES, CHARACTER_POSE_NAMES } from './character-poses.js';
+import { characterAssets, CHARACTER_POSE_NAMES } from './character-assets.js';
 import { createCharacterMotion } from './character-motion.js';
 export const XIAOHEI_WALLPAPER_CHARACTER_ID = 'dsh-theme-xiaohei/wallpaper-character';
 /** Places the layered character only when the host geometry is settled. */
-export function installXiaoheiWallpaperCharacter(doc = typeof document === 'undefined' ? undefined : document) {
+export function installXiaoheiWallpaperCharacter(doc = typeof document === 'undefined' ? undefined : document, loadPose = characterAssets.pose) {
     const win = doc?.defaultView;
     if (!doc || !win)
         return () => { };
@@ -18,7 +18,7 @@ export function installXiaoheiWallpaperCharacter(doc = typeof document === 'unde
     let targets = [];
     let dirty = true;
     let placement = { pose: 'hidden', left: 0, top: 0, width: 0, height: 0 };
-    const ready = new Set();
+    const ready = new Map();
     const loading = new Set();
     const failed = new Set();
     const motion = typeof win.matchMedia === 'function' ? createCharacterMotion(doc) : undefined;
@@ -132,33 +132,39 @@ export function installXiaoheiWallpaperCharacter(doc = typeof document === 'unde
             motion?.setPose(undefined, 'hidden');
             return;
         }
-        if (!ready.has(pose)) {
+        const appearance = doc.documentElement.dataset.xiaoheiAppearance === 'light' ? 'light' : 'dark';
+        const key = `${pose}-${appearance}`;
+        if (!ready.has(key)) {
             motion?.setPose(undefined, 'hidden');
             // Do not retain the old location across a layout change: it could now
             // overlap a message. Idle changes keep the already decoded seated pose.
             if (placement.pose !== 'seated' || !['seated', 'chin', 'doze'].includes(host.dataset.pose ?? ''))
                 host.dataset.pose = 'hidden';
-            if (!loading.has(pose) && !failed.has(pose)) {
-                loading.add(pose);
-                // Decode only a requested pose, in both appearances so changing theme
-                // cannot produce a blank frame. No image fetch or perpetual RAF loop.
-                void Promise.all(Object.values(CHARACTER_POSES[pose]).map(src => {
+            if (!loading.has(key) && !failed.has(key)) {
+                loading.add(key);
+                // Fetch only the requested pose and palette, not the complete catalog.
+                void loadPose(pose, appearance).then(async (src) => {
+                    if (disposed)
+                        return;
                     const image = new win.Image();
                     image.src = src;
-                    return image.decode();
-                })).then(() => {
+                    await image.decode();
                     if (disposed)
                         return;
-                    loading.delete(pose);
-                    ready.add(pose);
+                    loading.delete(key);
+                    ready.set(key, src);
                     schedule();
-                }, () => { loading.delete(pose); failed.add(pose); });
+                }).catch(() => { loading.delete(key); failed.add(key); });
             }
             return;
         }
         // Each pose keeps its own coordinates during the short crossfade. No
         // travelling from the right edge through the conversation to the sidebar.
         const part = host.querySelector(`.xiaohei-wallpaper-character__${pose}`);
+        if (part.dataset.appearance !== appearance) {
+            part.style.setProperty(`--xiaohei-${pose}-art`, `url("${ready.get(key)}")`);
+            part.dataset.appearance = appearance;
+        }
         for (const key of ['left', 'top', 'width', 'height']) {
             const value = `${Math.round(placement[key] * 100) / 100}px`;
             if (part.style[key] !== value)
@@ -183,6 +189,8 @@ export function installXiaoheiWallpaperCharacter(doc = typeof document === 'unde
         settled = win.setTimeout(() => { settled = undefined; dirty = true; schedule(); }, 240);
     }
     const unsubscribe = subscribeXiaoheiHostDom(doc, schedule);
+    const appearanceObserver = new win.MutationObserver(schedule);
+    appearanceObserver.observe(doc.documentElement, { attributes: true, attributeFilter: ['data-xiaohei-appearance'] });
     const resized = () => { dirty = true; schedule(); scheduleSettled(); };
     win.addEventListener('resize', resized, { passive: true });
     const activity = () => idle.activity();
@@ -201,6 +209,7 @@ export function installXiaoheiWallpaperCharacter(doc = typeof document === 'unde
             win.clearTimeout(settled);
         unsubscribe();
         observer?.disconnect();
+        appearanceObserver.disconnect();
         idle.dispose();
         motion?.dispose();
         for (const event of events)

package/lib/sidebar-glass.js

@@ -1,4 +1,4 @@
-import { XIAOHEI_SCENE_LAYER_ID, XIAOHEI_SCENE_WORLD_CLASS } from './scene.js';
+import { XIAOHEI_SCENE_LAYER_ID, XIAOHEI_SCENE_WORLD_CLASS } from './scene/ids.js';
 import { subscribeXiaoheiHostDom } from './host-dom.js';
 import { XIAOHEI_HOST_SELECTORS } from './host-contract.js';
 import { createSidebarReveal } from './sidebar-reveal.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lemoncat7/dsh-theme-xiaohei",
-  "version": "0.4.4",
+  "version": "0.4.5",
   "description": "A Luo Xiaohei-inspired animated dark theme for DeepSeek Harness",
   "keywords": [
     "deepseek-harness",
@@ -26,6 +26,8 @@
     "./package.json": "./package.json"
   },
   "files": [
+    "docs/releases/0.4.5.md",
+    "docs/startup-audit-20261013.md",
     "docs/releases/0.4.4.md",
     "docs/releases/0.4.3.md",
     "lib/**/*.js",