@lemoncat7/dsh-theme-xiaohei 0.3.0-alpha.23 → 0.3.2

package/lib/host-contract.d.ts

@@ -0,0 +1,9 @@
+export declare const XIAOHEI_HOST_SELECTORS: {
+    readonly sidebar: "[data-slot='sidebar']";
+    readonly sidebarShell: "#root [data-slot='sidebar'] > div";
+    readonly sidebarColumn: "#root :has(> [data-slot='sidebar'])";
+    readonly composerCard: "#root [data-composer-card='true']";
+    readonly composerHeroMark: "#root .xiaohei-brand-mark[data-brand-context='hero']";
+    readonly composerHeroRow: "[class*='_headline']";
+};
+//# sourceMappingURL=host-contract.d.ts.map

package/lib/host-contract.js

@@ -0,0 +1,13 @@
+/** Keep stable DSH selectors in one compatibility boundary. */
+const sidebar = "[data-slot='sidebar']";
+export const XIAOHEI_HOST_SELECTORS = {
+    sidebar,
+    sidebarShell: `#root ${sidebar} > div`,
+    // The shell holds its expanded width while its contents fade. Only the
+    // outer layout column represents the currently visible animated width.
+    sidebarColumn: `#root :has(> ${sidebar})`,
+    composerCard: "#root [data-composer-card='true']",
+    composerHeroMark: "#root .xiaohei-brand-mark[data-brand-context='hero']",
+    composerHeroRow: "[class*='_headline']",
+};
+//# sourceMappingURL=host-contract.js.map

package/lib/host-dom.d.ts

@@ -0,0 +1,11 @@
+/** A listener that reconciles plugin-owned DOM after the DSH host tree changes. */
+export type XiaoheiHostDomListener = () => void;
+/**
+ * Share one batched body observer across all runtime theme behaviours.
+ *
+ * The Host owns the React tree and may replace slots at any time. Theme modules
+ * subscribe here instead of observing the full document independently. The
+ * first subscriber creates the observer and the last cleanup disconnects it.
+ */
+export declare function subscribeXiaoheiHostDom(doc: Document, listener: XiaoheiHostDomListener): () => void;
+//# sourceMappingURL=host-dom.d.ts.map

package/lib/host-dom.js

@@ -0,0 +1,60 @@
+const hubs = new WeakMap();
+/**
+ * Share one batched body observer across all runtime theme behaviours.
+ *
+ * The Host owns the React tree and may replace slots at any time. Theme modules
+ * subscribe here instead of observing the full document independently. The
+ * first subscriber creates the observer and the last cleanup disconnects it.
+ */
+export function subscribeXiaoheiHostDom(doc, listener) {
+    const win = doc.defaultView;
+    if (doc.body === undefined || win === null || typeof win.MutationObserver !== 'function') {
+        return () => { };
+    }
+    let hub = hubs.get(doc);
+    if (hub === undefined) {
+        const listeners = new Set();
+        const nextHub = {
+            listeners,
+            queued: false,
+        };
+        const flush = () => {
+            nextHub.queued = false;
+            if (hubs.get(doc) !== nextHub)
+                return;
+            for (const subscriber of [...listeners]) {
+                try {
+                    subscriber();
+                }
+                catch (error) {
+                    win.setTimeout(() => { throw error; }, 0);
+                }
+            }
+        };
+        nextHub.observer = new win.MutationObserver(() => {
+            if (nextHub.queued)
+                return;
+            nextHub.queued = true;
+            queueMicrotask(flush);
+        });
+        nextHub.observer.observe(doc.body, { childList: true, subtree: true });
+        hubs.set(doc, nextHub);
+        hub = nextHub;
+    }
+    hub.listeners.add(listener);
+    let subscribed = true;
+    return () => {
+        if (!subscribed)
+            return;
+        subscribed = false;
+        const activeHub = hubs.get(doc);
+        if (activeHub === undefined)
+            return;
+        activeHub.listeners.delete(listener);
+        if (activeHub.listeners.size > 0)
+            return;
+        activeHub.observer?.disconnect();
+        hubs.delete(doc);
+    };
+}
+//# sourceMappingURL=host-dom.js.map

package/lib/loading-heixiu.js

@@ -1,4 +1,5 @@
 import { XIAOHEI_LOADING_HEIXIU_BLINK, XIAOHEI_LOADING_HEIXIU_OPEN, } from './generated-loading-assets.js';
+import { subscribeXiaoheiHostDom } from './host-dom.js';
 export const XIAOHEI_PLUGIN_LOADING_STYLE_ID = 'dsh-theme-xiaohei/plugin-loading-style';
 export const XIAOHEI_PLUGIN_LOADING_CLASS = 'xiaohei-plugin-loader__track';
 const LOADING_HINTS = new Set(['Loading plugins...', 'Loading plugins…']);
@@ -250,11 +251,10 @@ export function installXiaoheiPluginLoading(doc = typeof document === 'undefined
         });
     };
     sync();
-    const observer = new win.MutationObserver(queueSync);
-    observer.observe(doc.body, { childList: true, subtree: true });
+    const unsubscribeHostDom = subscribeXiaoheiHostDom(doc, queueSync);
     return () => {
         disposed = true;
-        observer.disconnect();
+        unsubscribeHostDom();
         clearCard();
         style.remove();
     };

package/lib/metallic-brand-mark.d.ts

@@ -0,0 +1,10 @@
+interface XiaoheiBrandMarkProps {
+    size: number;
+    className?: string | undefined;
+}
+/** Official sidebar brand occupant with a compact, lifecycle-safe metallic shader. */
+export declare function XiaoheiMetallicBrandMark({ size, className }: XiaoheiBrandMarkProps): import("react/jsx-runtime").JSX.Element;
+/** Official sidebar brand-name occupant paired with the Xiaohei mark. */
+export declare function XiaoheiBrandName(): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=metallic-brand-mark.d.ts.map

package/lib/metallic-brand-mark.js

@@ -0,0 +1,323 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+import { XIAOHEI_BRAND_AVATAR } from './generated-identity.js';
+// Native wide/rail switches remount this slot. A tiny navigation mark does not
+// need a fresh GPU context and shader compilation on every toggle.
+let sidebarMetallicSnapshot;
+const VERTEX_SHADER = `#version 300 es
+precision highp float;
+in vec2 a_position;
+out vec2 vP;
+void main(){vP=a_position*.5+.5;gl_Position=vec4(a_position,0.,1.);}`;
+/* Adapted from React Bits MetallicPaint. The source avatar is already a
+ * transparent tonal map, so the expensive browser-side depth solve is not
+ * needed for this compact brand mark. */
+const FRAGMENT_SHADER = `#version 300 es
+precision highp float;
+in vec2 vP;
+out vec4 oC;
+uniform sampler2D u_tex;
+uniform float u_time,u_ratio,u_imgRatio,u_seed,u_scale,u_refract,u_blur,u_liquid;
+uniform float u_bright,u_contrast,u_angle,u_fresnel,u_sharp,u_wave,u_noise,u_chroma;
+uniform float u_distort,u_contour;
+uniform vec3 u_lightColor,u_darkColor,u_tint;
+
+vec3 sC,sM;
+
+vec3 pW(vec3 v){
+  vec3 i=floor(v),f=fract(v),s=sign(fract(v*.5)-.5),h=fract(sM*i+i.yzx),c=f*(f-1.);
+  return s*c*((h*16.-4.)*c-1.);
+}
+
+vec3 aF(vec3 b,vec3 c){return pW(b+c.zxy-pW(b.zxy+c.yzx)+pW(b.yzx+c.xyz));}
+vec3 lM(vec3 s,vec3 p){return(p+aF(s,p))*.5;}
+
+vec2 fA(){
+  vec2 c=vP-.5;
+  c.x*=u_ratio>u_imgRatio?u_ratio/u_imgRatio:1.;
+  c.y*=u_ratio>u_imgRatio?1.:u_imgRatio/u_ratio;
+  return vec2(c.x+.5,.5-c.y);
+}
+
+vec2 rot(vec2 p,float r){float c=cos(r),s=sin(r);return vec2(p.x*c+p.y*s,p.y*c-p.x*s);}
+
+float bM(vec2 c,float t){
+  vec2 l=smoothstep(vec2(0.),vec2(t),c),u=smoothstep(vec2(0.),vec2(t),1.-c);
+  return l.x*l.y*u.x*u.y;
+}
+
+float mG(float hi,float lo,float t,float sh,float cv){
+  sh*=(2.-u_sharp);
+  float ci=smoothstep(.15,.85,cv),r=lo;
+  float e1=.08/u_scale;
+  r=mix(r,hi,smoothstep(0.,sh*1.5,t));
+  r=mix(r,lo,smoothstep(e1-sh,e1+sh,t));
+  float e2=e1+.05/u_scale*(1.-ci*.35);
+  r=mix(r,hi,smoothstep(e2-sh,e2+sh,t));
+  float e3=e2+.025/u_scale*(1.-ci*.45);
+  r=mix(r,lo,smoothstep(e3-sh,e3+sh,t));
+  float e4=e1+.1/u_scale;
+  r=mix(r,hi,smoothstep(e4-sh,e4+sh,t));
+  float rm=1.-e4,gT=clamp((t-e4)/rm,0.,1.);
+  r=mix(r,mix(hi,lo,smoothstep(0.,1.,gT)),smoothstep(e4-sh*.5,e4+sh*.5,t));
+  return r;
+}
+
+void main(){
+  sC=fract(vec3(.7548,.5698,.4154)*(u_seed+17.31))+.5;
+  sM=fract(sC.zxy-sC.yzx*1.618);
+  vec2 sc=vec2(vP.x*u_ratio,1.-vP.y);
+  float angleRad=u_angle*3.14159/180.;
+  sc=rot(sc-.5,angleRad)+.5;
+  sc=clamp(sc,0.,1.);
+  float sl=sc.x-sc.y,an=u_time*.001;
+  vec2 iC=fA();
+  vec4 texSample=texture(u_tex,iC);
+  float dp=texSample.r;
+  float shapeMask=texSample.a;
+  vec3 hi=u_lightColor*u_bright;
+  vec3 lo=u_darkColor*(2.-u_bright);
+  lo.b+=smoothstep(.6,1.4,sc.x+sc.y)*.08;
+  vec2 fC=sc-.5;
+  float rd=length(fC+vec2(0.,sl*.15));
+  vec2 ag=rot(fC,(.22-sl*.18)*3.14159);
+  float cv=1.-pow(rd*1.65,1.15);
+  cv*=pow(sc.y,.35);
+  float vs=shapeMask;
+  vs*=bM(iC,.01);
+  float fr=pow(1.-cv,u_fresnel)*.3;
+  vs=min(vs+fr*vs,1.);
+  float mT=an*.0625;
+  vec3 wO=vec3(-1.05,1.35,1.55);
+  vec3 wA=aF(vec3(31.,73.,56.),mT+wO)*.22*u_wave;
+  vec3 wB=aF(vec3(24.,64.,42.),mT-wO.yzx)*.22*u_wave;
+  vec2 nC=sc*45.*u_noise;
+  nC+=aF(sC.zxy,an*.17*sC.yzx-sc.yxy*.35).xy*18.*u_wave;
+  vec3 tC=vec3(.00041,.00053,.00076)*mT+wB*nC.x+wA*nC.y;
+  tC=lM(sC,tC);
+  tC=lM(sC+1.618,tC);
+  float tb=sin(tC.x*3.14159)*.5+.5;
+  tb=tb*2.-1.;
+  float noiseVal=pW(vec3(sc*8.+an,an*.5)).x;
+  float edgeFactor=smoothstep(0.,.5,dp)*smoothstep(1.,.5,dp);
+  float lD=dp+(1.-dp)*u_liquid*tb;
+  lD+=noiseVal*u_distort*.15*edgeFactor;
+  float rB=clamp(1.-cv,0.,1.);
+  float fl=ag.x+sl;
+  fl+=noiseVal*sl*u_distort*edgeFactor;
+  fl*=mix(1.,1.-dp*.5,u_contour);
+  fl-=dp*u_contour*.8;
+  float eI=smoothstep(0.,1.,lD)*smoothstep(1.,0.,lD);
+  fl-=tb*sl*1.8*eI;
+  float cA=cv*clamp(pow(sc.y,.12),.25,1.);
+  fl*=.12+(1.05-lD)*cA;
+  fl*=smoothstep(1.,.65,lD);
+  float vA1=smoothstep(.08,.18,sc.y)*smoothstep(.38,.18,sc.y);
+  float vA2=smoothstep(.08,.18,1.-sc.y)*smoothstep(.38,.18,1.-sc.y);
+  fl+=vA1*.16+vA2*.025;
+  fl*=.45+pow(sc.y,2.)*.55;
+  fl*=u_scale;
+  fl-=an;
+  float rO=rB+cv*tb*.025;
+  float vM1=smoothstep(-.12,.18,sc.y)*smoothstep(.48,.08,sc.y);
+  float cM1=smoothstep(.35,.55,cv)*smoothstep(.95,.35,cv);
+  rO+=vM1*cM1*4.5;
+  rO-=sl;
+  float bO=rB*1.25;
+  float vM2=smoothstep(-.02,.35,sc.y)*smoothstep(.75,.08,sc.y);
+  float cM2=smoothstep(.35,.55,cv)*smoothstep(.75,.35,cv);
+  bO+=vM2*cM2*.9;
+  bO-=lD*.18;
+  rO*=u_refract*u_chroma;
+  bO*=u_refract*u_chroma;
+  float sf=u_blur;
+  float rP=fract(fl+rO);
+  float rC=mG(hi.r,lo.r,rP,sf+.018+u_refract*cv*.025,cv);
+  float gP=fract(fl);
+  float gC=mG(hi.g,lo.g,gP,sf+.008/max(.01,1.-sl),cv);
+  float bP=fract(fl-bO);
+  float bC=mG(hi.b,lo.b,bP,sf+.008,cv);
+  vec3 col=vec3(rC,gC,bC);
+  col=(col-.5)*u_contrast+.5;
+  col=clamp(col,0.,1.);
+  col=mix(col,1.-min(vec3(1.),(1.-col)/max(u_tint,vec3(.001))),length(u_tint-1.)*.5);
+  col=clamp(col,0.,1.);
+  oC=vec4(col*vs,vs);
+}`;
+const UNIFORM_NAMES = [
+    'u_tex', 'u_time', 'u_ratio', 'u_imgRatio', 'u_seed', 'u_scale', 'u_refract',
+    'u_blur', 'u_liquid', 'u_bright', 'u_contrast', 'u_angle', 'u_fresnel',
+    'u_sharp', 'u_wave', 'u_noise', 'u_chroma', 'u_distort', 'u_contour',
+    'u_lightColor', 'u_darkColor', 'u_tint',
+];
+function compileShader(gl, type, source) {
+    const shader = gl.createShader(type);
+    if (shader === null)
+        return undefined;
+    gl.shaderSource(shader, source);
+    gl.compileShader(shader);
+    if (gl.getShaderParameter(shader, gl.COMPILE_STATUS) === true)
+        return shader;
+    gl.deleteShader(shader);
+    return undefined;
+}
+function setRgb(gl, location, color) {
+    gl.uniform3f(location, color[0], color[1], color[2]);
+}
+/** Official sidebar brand occupant with a compact, lifecycle-safe metallic shader. */
+export function XiaoheiMetallicBrandMark({ size, className }) {
+    const canvasRef = useRef(null);
+    const [ready, setReady] = useState(false);
+    const visualSize = Math.max(24, size + 4);
+    const context = size >= 32 ? 'hero' : 'sidebar';
+    const [snapshot, setSnapshot] = useState(context === 'sidebar' ? sidebarMetallicSnapshot : undefined);
+    useEffect(() => {
+        if (snapshot !== undefined)
+            return;
+        const canvas = canvasRef.current;
+        if (canvas === null)
+            return;
+        const gl = canvas.getContext('webgl2', {
+            alpha: true,
+            antialias: true,
+            powerPreference: 'low-power',
+            premultipliedAlpha: true,
+        });
+        if (gl === null)
+            return;
+        const vertex = compileShader(gl, gl.VERTEX_SHADER, VERTEX_SHADER);
+        const fragment = compileShader(gl, gl.FRAGMENT_SHADER, FRAGMENT_SHADER);
+        if (vertex === undefined || fragment === undefined) {
+            if (vertex !== undefined)
+                gl.deleteShader(vertex);
+            if (fragment !== undefined)
+                gl.deleteShader(fragment);
+            return;
+        }
+        const program = gl.createProgram();
+        const buffer = gl.createBuffer();
+        if (program === null || buffer === null) {
+            gl.deleteShader(vertex);
+            gl.deleteShader(fragment);
+            return;
+        }
+        gl.attachShader(program, vertex);
+        gl.attachShader(program, fragment);
+        gl.linkProgram(program);
+        gl.deleteShader(vertex);
+        gl.deleteShader(fragment);
+        if (gl.getProgramParameter(program, gl.LINK_STATUS) !== true) {
+            gl.deleteBuffer(buffer);
+            gl.deleteProgram(program);
+            return;
+        }
+        const uniforms = Object.fromEntries(UNIFORM_NAMES.map(name => [name, gl.getUniformLocation(program, name)]));
+        const pixelRatio = Math.min(window.devicePixelRatio || 1, 2);
+        const renderSize = Math.max(96, Math.ceil(visualSize * pixelRatio * 2));
+        canvas.width = renderSize;
+        canvas.height = renderSize;
+        gl.viewport(0, 0, renderSize, renderSize);
+        gl.useProgram(program);
+        gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
+        gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-1, -1, 1, -1, -1, 1, 1, 1]), gl.STATIC_DRAW);
+        const position = gl.getAttribLocation(program, 'a_position');
+        gl.enableVertexAttribArray(position);
+        gl.vertexAttribPointer(position, 2, gl.FLOAT, false, 0, 0);
+        gl.uniform1f(uniforms.u_ratio, 1);
+        gl.uniform1f(uniforms.u_imgRatio, 1);
+        gl.uniform1f(uniforms.u_seed, 42);
+        gl.uniform1f(uniforms.u_scale, 3.2);
+        gl.uniform1f(uniforms.u_refract, 0.012);
+        gl.uniform1f(uniforms.u_blur, 0.018);
+        gl.uniform1f(uniforms.u_liquid, 0.58);
+        gl.uniform1f(uniforms.u_bright, 1.35);
+        gl.uniform1f(uniforms.u_contrast, 1.08);
+        gl.uniform1f(uniforms.u_angle, -12);
+        gl.uniform1f(uniforms.u_fresnel, 0.8);
+        gl.uniform1f(uniforms.u_sharp, 1.15);
+        gl.uniform1f(uniforms.u_wave, 0.65);
+        gl.uniform1f(uniforms.u_noise, 0.45);
+        gl.uniform1f(uniforms.u_chroma, 0.7);
+        gl.uniform1f(uniforms.u_distort, 0.35);
+        gl.uniform1f(uniforms.u_contour, 0.38);
+        setRgb(gl, uniforms.u_lightColor, [0.96, 0.97, 0.95]);
+        setRgb(gl, uniforms.u_darkColor, [0.025, 0.04, 0.045]);
+        setRgb(gl, uniforms.u_tint, [0.84, 0.92, 0.89]);
+        let disposed = false;
+        let visible = true;
+        let animationFrame;
+        let lastFrame = 0;
+        let metallicTime = 1450;
+        const reduceMotion = window.matchMedia('(prefers-reduced-motion: reduce)');
+        const texture = gl.createTexture();
+        const image = new Image();
+        const draw = () => {
+            gl.uniform1f(uniforms.u_time, metallicTime);
+            gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
+        };
+        const render = (now) => {
+            if (disposed)
+                return;
+            if (visible && document.visibilityState !== 'hidden' && now - lastFrame >= 40) {
+                const delta = lastFrame === 0 ? 0 : Math.min(80, now - lastFrame);
+                lastFrame = now;
+                metallicTime += delta * 0.11;
+                draw();
+            }
+            animationFrame = window.requestAnimationFrame(render);
+        };
+        image.onload = () => {
+            if (disposed || texture === null)
+                return;
+            gl.activeTexture(gl.TEXTURE0);
+            gl.bindTexture(gl.TEXTURE_2D, texture);
+            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
+            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
+            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
+            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
+            gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, false);
+            gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);
+            gl.uniform1i(uniforms.u_tex, 0);
+            draw();
+            if (context === 'sidebar') {
+                sidebarMetallicSnapshot = canvas.toDataURL();
+                setSnapshot(sidebarMetallicSnapshot);
+                return;
+            }
+            setReady(true);
+            if (!reduceMotion.matches)
+                animationFrame = window.requestAnimationFrame(render);
+        };
+        image.src = XIAOHEI_BRAND_AVATAR;
+        const visibilityObserver = typeof IntersectionObserver === 'function'
+            ? new IntersectionObserver(entries => {
+                visible = entries.some(entry => entry.isIntersecting);
+                if (visible)
+                    lastFrame = 0;
+            })
+            : undefined;
+        visibilityObserver?.observe(canvas);
+        return () => {
+            disposed = true;
+            if (animationFrame !== undefined)
+                window.cancelAnimationFrame(animationFrame);
+            visibilityObserver?.disconnect();
+            if (texture !== null)
+                gl.deleteTexture(texture);
+            gl.deleteBuffer(buffer);
+            gl.deleteProgram(program);
+            gl.getExtension('WEBGL_lose_context')?.loseContext();
+        };
+    }, [visualSize, context, snapshot]);
+    const geometry = {
+        '--xiaohei-brand-mark-size': `${visualSize}px`,
+    };
+    return (_jsxs("span", { className: className === undefined ? 'xiaohei-brand-mark' : `${className} xiaohei-brand-mark`, "data-brand-context": context, "data-metallic-ready": ready || snapshot !== undefined ? 'true' : 'false', style: geometry, "aria-hidden": "true", children: [_jsx("img", { className: "xiaohei-brand-mark__fallback", src: XIAOHEI_BRAND_AVATAR, alt: "" }), snapshot !== undefined
+                ? _jsx("img", { className: "xiaohei-brand-mark__metal", src: snapshot, alt: "" })
+                : _jsx("canvas", { className: "xiaohei-brand-mark__metal", ref: canvasRef })] }));
+}
+/** Official sidebar brand-name occupant paired with the Xiaohei mark. */
+export function XiaoheiBrandName() {
+    return _jsx("span", { className: "xiaohei-brand-name", children: "\u7F57\u5C0F\u9ED1 \u00B7 \u5996\u7075\u4F1A\u9986" });
+}
+//# sourceMappingURL=metallic-brand-mark.js.map

package/lib/plugin.d.ts

@@ -1,4 +1,4 @@
-import type { ClientContext } from '@deepseek-ai/dsh-client-runtime/client';
+import type { Context as ClientContext } from '@deepseek-ai/cordis';
 /** Boot decoration has no service dependency; the full theme waits below. */
 export declare const inject: string[];
 /** Shade DSH's native appearance modes without replacing its preference UI. */

package/lib/plugin.js

@@ -1,22 +1,39 @@
 import { bindXiaoheiAppearance } from './appearance.js';
-import { installXiaoheiBlink } from './blink.js';
 import { installXiaoheiChrome } from './chrome.js';
-import { installXiaoheiGaze } from './gaze.js';
-import { installXiaoheiHeixiuInteractions } from './heixiu-interactions.js';
+import { installXiaoheiComposerSendHeixiu } from './composer-send-heixiu.js';
 import { installXiaoheiPluginLoading } from './loading-heixiu.js';
-import { installXiaoheiPortalTransit } from './portal.js';
-import { installXiaoheiIdleReactions } from './reactions.js';
 import { installXiaoheiScene } from './scene.js';
 import { installXiaoheiSidebarGlass } from './sidebar-glass.js';
-import { installXiaoheiSidebarHeixiuRoaming } from './sidebar-heixiu-roaming.js';
-import { bindXiaoheiSessionState } from './state.js';
+import { installXiaoheiWallpaperCharacter } from './scene/wallpaper-character.js';
+import { installComposerBloub } from './bloub-heixiu/runtime.js';
+import { bindHeixiuSessions, createHeixiuSignals } from './bloub-heixiu/signals.js';
 import { XIAOHEI_THEME_TOKEN_OVERRIDES } from './theme.js';
+import { XiaoheiBrandName, XiaoheiMetallicBrandMark } from './metallic-brand-mark.js';
 /** Boot decoration has no service dependency; the full theme waits below. */
 export const inject = [];
 /** Shade DSH's native appearance modes without replacing its preference UI. */
 export function apply(ctx) {
     ctx.effect(installXiaoheiPluginLoading, 'xiaohei-theme: replace plugin spinner with hopping Heixiu');
-    ctx.inject(['theme', 'sessions'], (readyCtx) => installXiaoheiTheme(readyCtx));
+    ctx.inject(['slots'], readyCtx => {
+        const disposeSidebarMark = readyCtx.slots.inject('sidebar.brand.mark', () => readyCtx.slots.register({
+            name: 'sidebar.brand.mark',
+            priority: -20,
+        }, XiaoheiMetallicBrandMark));
+        const disposeSidebarName = readyCtx.slots.inject('sidebar.brand.name', () => readyCtx.slots.register({
+            name: 'sidebar.brand.name',
+            priority: -20,
+        }, XiaoheiBrandName));
+        const disposeHeroMark = readyCtx.slots.inject('conversation.hero.brand.mark', () => readyCtx.slots.register({
+            name: 'conversation.hero.brand.mark',
+            priority: -20,
+        }, XiaoheiMetallicBrandMark));
+        return () => {
+            disposeHeroMark();
+            disposeSidebarName();
+            disposeSidebarMark();
+        };
+    });
+    ctx.inject(['theme'], (readyCtx) => installXiaoheiTheme(readyCtx));
 }
 /** Mount the complete theme only after its runtime services become available. */
 function installXiaoheiTheme(ctx) {
@@ -25,14 +42,12 @@ function installXiaoheiTheme(ctx) {
     }, 'xiaohei-theme: shade native Light / Dark / System palettes');
     ctx.effect(() => bindXiaoheiAppearance(ctx), 'xiaohei-theme: follow resolved appearance');
     ctx.effect(installXiaoheiChrome, 'xiaohei-theme: install spirit control skin');
-    ctx.effect(installXiaoheiScene, 'xiaohei-theme: install moonlit forest scene');
+    ctx.effect(installXiaoheiComposerSendHeixiu, 'xiaohei-theme: turn the native send action into blinking Heixiu');
+    ctx.effect(installXiaoheiScene, 'xiaohei-theme: install paired atmosphere');
     ctx.effect(installXiaoheiSidebarGlass, 'xiaohei-theme: install isolated sidebar glass');
-    ctx.effect(installXiaoheiSidebarHeixiuRoaming, 'xiaohei-theme: let sidebar Heixiu roam safely');
-    ctx.effect(installXiaoheiHeixiuInteractions, 'xiaohei-theme: bind Heixiu companion interactions');
-    ctx.effect(installXiaoheiPortalTransit, 'xiaohei-theme: install random Heixiu portal visits');
-    ctx.effect(installXiaoheiGaze, 'xiaohei-theme: install proximity gaze');
-    ctx.effect(installXiaoheiBlink, 'xiaohei-theme: synchronize complete-frame blinking');
-    ctx.effect(installXiaoheiIdleReactions, 'xiaohei-theme: install sparse idle reactions');
-    ctx.effect(() => bindXiaoheiSessionState(ctx.sessions), 'xiaohei-theme: follow current session agent state');
+    ctx.effect(installXiaoheiWallpaperCharacter, 'xiaohei-theme: place responsive character poses');
+    const heixiuSignals = createHeixiuSignals();
+    ctx.effect(() => installComposerBloub(undefined, heixiuSignals), 'xiaohei-theme: mount bloub Heixiu beside composer');
+    ctx.inject(['sessions'], ready => bindHeixiuSessions(ready.sessions, heixiuSignals));
 }
 //# sourceMappingURL=plugin.js.map

package/lib/portal.js

@@ -1,6 +1,8 @@
 import { XIAOHEI_HEIXIU_BLINK, XIAOHEI_HEIXIU_OPEN } from './generated-keyart.js';
 import { XIAOHEI_PORTAL_CSS } from './chrome/portal.js';
-import { XIAOHEI_SCENE_LAYER_ID } from './scene.js';
+import { subscribeXiaoheiHostDom } from './host-dom.js';
+import { XIAOHEI_HOST_SELECTORS } from './host-contract.js';
+import { XIAOHEI_SCENE_LAYER_ID, XIAOHEI_SCENE_WORLD_CLASS } from './scene.js';
 export const XIAOHEI_PORTAL_STYLE_ID = 'dsh-theme-xiaohei/portal-style';
 export const XIAOHEI_PORTAL_LAYER_ID = 'dsh-theme-xiaohei/portal-layer';
 export const XIAOHEI_PORTAL_DURATION_MS = 2600;
@@ -63,9 +65,9 @@ export function installXiaoheiPortalTransit(doc = typeof document === 'undefined
         const scene = doc.getElementById(XIAOHEI_SCENE_LAYER_ID);
         if (scene === null)
             return false;
-        const veil = scene.querySelector('.xiaohei-scene__veil');
         if (layer.parentElement !== scene) {
-            scene.insertBefore(layer, veil?.nextSibling ?? null);
+            const world = scene.querySelector(`.${XIAOHEI_SCENE_WORLD_CLASS}`);
+            scene.insertBefore(layer, world?.nextSibling ?? scene.firstChild);
         }
         return true;
     };
@@ -146,25 +148,24 @@ export function installXiaoheiPortalTransit(doc = typeof document === 'undefined
         visitsStarted = true;
         scheduleVisit(true);
     };
-    let mountObserver;
+    let unsubscribeHostDom = () => { };
     if (mount()) {
         startVisits();
     }
     else {
-        mountObserver = new MutationObserver(() => {
+        unsubscribeHostDom = subscribeXiaoheiHostDom(doc, () => {
             if (!mount())
                 return;
-            mountObserver?.disconnect();
+            unsubscribeHostDom();
             startVisits();
         });
-        mountObserver.observe(doc.body, { childList: true });
     }
     return () => {
         disposed = true;
         clearTimer(animationTimer);
         clearTimer(visitTimer);
         endInteraction();
-        mountObserver?.disconnect();
+        unsubscribeHostDom();
         if (layer.dataset.running === 'true')
             dispatchPortalActivity(doc, false);
         layer.remove();
@@ -201,8 +202,8 @@ function choosePortalPoints(doc) {
     const win = doc.defaultView;
     const width = Math.max(640, win?.innerWidth ?? 1280);
     const height = Math.max(480, win?.innerHeight ?? 720);
-    const sidebarRight = doc.querySelector("#root [data-slot='sidebar']")?.getBoundingClientRect().right ?? 0;
-    const composerRect = doc.querySelector("#root [data-composer-card='true']")?.getBoundingClientRect();
+    const sidebarRight = doc.querySelector(XIAOHEI_HOST_SELECTORS.sidebar)?.getBoundingClientRect().right ?? 0;
+    const composerRect = doc.querySelector(XIAOHEI_HOST_SELECTORS.composerCard)?.getBoundingClientRect();
     const contentLeft = composerRect?.left ?? width * 0.37;
     const contentRight = composerRect?.right ?? width * 0.77;
     const leftMin = Math.max(sidebarRight + 80, 90);

package/lib/reactions.js

@@ -1,5 +1,6 @@
 import { XIAOHEI_IDLE_EAR_LEFT, XIAOHEI_IDLE_EAR_RIGHT, XIAOHEI_IDLE_TAIL, } from './generated-keyart.js';
 import { XIAOHEI_REACTION_CSS } from './chrome/reactions.js';
+import { subscribeXiaoheiHostDom } from './host-dom.js';
 import { XIAOHEI_HEIXIU_GREETING_EVENT, } from './heixiu-interactions.js';
 import { XIAOHEI_PORTAL_PROXIMITY_EVENT, } from './portal.js';
 export const XIAOHEI_REACTION_STYLE_ID = 'dsh-theme-xiaohei/reaction-style';
@@ -332,8 +333,7 @@ export function installXiaoheiIdleReactions(doc = typeof document === 'undefined
         scheduleIdleTail();
         syncPointerEarLoop();
     };
-    const mountObserver = new win.MutationObserver(attach);
-    mountObserver.observe(doc.body, { childList: true, subtree: true });
+    const unsubscribeHostDom = subscribeXiaoheiHostDom(doc, attach);
     const stateObserver = new win.MutationObserver(onStateChange);
     stateObserver.observe(doc.documentElement, {
         attributes: true,
@@ -356,7 +356,7 @@ export function installXiaoheiIdleReactions(doc = typeof document === 'undefined
         clearHeixiuInteraction();
         clearTimer(idleTailTimer);
         clearReaction();
-        mountObserver.disconnect();
+        unsubscribeHostDom();
         stateObserver.disconnect();
         doc.removeEventListener('pointermove', onPointerMove);
         doc.removeEventListener('pointerleave', clearPointer);

package/lib/scene/avatar-model.d.ts

@@ -0,0 +1,6 @@
+export declare const XIAOHEI_SYLVA_AVATAR_MARKER = "data-xiaohei-avatar-model";
+/** Inject the renderer-sharing 2.5D avatar without editing registered ThreeUI files. */
+export declare function injectXiaoheiSylvaAvatarModel(source: string): string;
+/** Prepare the detached iframe so the avatar exists on its first WebGL boot. */
+export declare function prepareXiaoheiSylvaAvatarFrame(frame: HTMLIFrameElement): boolean;
+//# sourceMappingURL=avatar-model.d.ts.map