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

package/lib/composer-avatar.d.ts

@@ -0,0 +1,18 @@
+export declare const XIAOHEI_COMPOSER_AVATAR_CLASS = "xiaohei-composer-avatar";
+export declare const XIAOHEI_COMPOSER_IDLE_MOTIONS: readonly ["glance-left", "glance-right", "nod", "perk", "peek", "double-blink", "ponder"];
+export type XiaoheiComposerIdleMotion = typeof XIAOHEI_COMPOSER_IDLE_MOTIONS[number];
+/** Pick a varied idle gesture without visibly repeating the previous one. */
+export declare function resolveXiaoheiComposerIdleMotion(random?: () => number, previous?: XiaoheiComposerIdleMotion): XiaoheiComposerIdleMotion;
+type ComposerPlacement = 'hero' | 'docked' | 'mobile';
+interface ComposerAvatarPosition {
+    placement: ComposerPlacement;
+    scale: number;
+    x: number;
+    y: number;
+}
+/** Resolve the avatar target without coupling to generated Host class names. */
+export declare function resolveXiaoheiComposerAvatarPosition(composer: Pick<DOMRect, 'bottom' | 'height' | 'left' | 'top' | 'width'>, viewportWidth: number, viewportHeight: number): ComposerAvatarPosition;
+/** Mount one persistent avatar and let the native composer remain fully owned by DSH. */
+export declare function installXiaoheiComposerAvatar(doc?: Document | undefined): () => void;
+export {};
+//# sourceMappingURL=composer-avatar.d.ts.map

package/lib/composer-avatar.js

@@ -0,0 +1,441 @@
+import { XIAOHEI_BREAKFRAME_BLINK, XIAOHEI_BREAKFRAME_BRACE, XIAOHEI_BREAKFRAME_COMPLETE, XIAOHEI_BREAKFRAME_ERROR, XIAOHEI_BREAKFRAME_IDLE, XIAOHEI_BREAKFRAME_REACH, XIAOHEI_BREAKFRAME_THINKING, XIAOHEI_BREAKFRAME_WORKING, } from './generated-keyart.js';
+import { XIAOHEI_HOST_SELECTORS } from './host-contract.js';
+import { subscribeXiaoheiHostDom } from './host-dom.js';
+export const XIAOHEI_COMPOSER_AVATAR_CLASS = 'xiaohei-composer-avatar';
+export const XIAOHEI_COMPOSER_IDLE_MOTIONS = [
+    'glance-left',
+    'glance-right',
+    'nod',
+    'perk',
+    'peek',
+    'double-blink',
+    'ponder',
+];
+/** Pick a varied idle gesture without visibly repeating the previous one. */
+export function resolveXiaoheiComposerIdleMotion(random = Math.random, previous) {
+    const candidates = previous === undefined
+        ? XIAOHEI_COMPOSER_IDLE_MOTIONS
+        : XIAOHEI_COMPOSER_IDLE_MOTIONS.filter(motion => motion !== previous);
+    const index = Math.min(candidates.length - 1, Math.max(0, Math.floor(random() * candidates.length)));
+    return candidates[index] ?? XIAOHEI_COMPOSER_IDLE_MOTIONS[0];
+}
+const XIAOHEI_IDLE_MOTION_DURATION = {
+    'glance-left': 1_760,
+    'glance-right': 1_760,
+    'nod': 1_520,
+    'perk': 1_640,
+    'peek': 1_860,
+    'double-blink': 760,
+    'ponder': 2_260,
+};
+/** Resolve the avatar target without coupling to generated Host class names. */
+export function resolveXiaoheiComposerAvatarPosition(composer, viewportWidth, viewportHeight) {
+    const avatarWidth = 172;
+    const avatarHeight = 184;
+    const mobile = viewportWidth <= 760;
+    const hero = composer.top < viewportHeight * 0.58;
+    let placement;
+    let scale;
+    let x;
+    let y;
+    if (mobile) {
+        placement = 'mobile';
+        scale = 0.72;
+        x = composer.left + 8;
+        y = composer.top - avatarHeight * scale - 8;
+    }
+    else if (hero) {
+        placement = 'hero';
+        scale = 0.92;
+        x = composer.left + composer.width / 2 - avatarWidth / 2;
+        y = composer.top - avatarHeight * scale - 12;
+    }
+    else {
+        placement = 'docked';
+        scale = 0.9;
+        x = composer.left - avatarWidth * scale - 16;
+        y = composer.bottom - avatarHeight * scale + 8;
+    }
+    return {
+        placement,
+        scale,
+        x: Math.round(Math.max(8, Math.min(viewportWidth - avatarWidth * scale - 8, x))),
+        y: Math.round(Math.max(8, Math.min(viewportHeight - avatarHeight * scale - 8, y))),
+    };
+}
+/** Mount one persistent avatar and let the native composer remain fully owned by DSH. */
+export function installXiaoheiComposerAvatar(doc = typeof document === 'undefined' ? undefined : document) {
+    if (doc === undefined)
+        return () => { };
+    const win = doc.defaultView;
+    if (win === null)
+        return () => { };
+    doc.querySelector(`.${XIAOHEI_COMPOSER_AVATAR_CLASS}`)?.remove();
+    const avatar = doc.createElement('span');
+    avatar.className = XIAOHEI_COMPOSER_AVATAR_CLASS;
+    avatar.setAttribute('aria-hidden', 'true');
+    avatar.dataset.xiaoheiPortrait = 'idle';
+    const effectsBack = createAvatarLayer(doc, 'effects-back');
+    const ringBack = createAvatarLayer(doc, 'ring-back');
+    const circle = createAvatarLayer(doc, 'circle');
+    circle.append(...createPortraitImages(doc, 'inside'));
+    const overflow = createAvatarLayer(doc, 'overflow');
+    overflow.append(...createPortraitImages(doc, 'overflow'));
+    const ringFront = createAvatarLayer(doc, 'ring-front');
+    const breakoutRight = createAvatarLayer(doc, 'breakout-right');
+    breakoutRight.append(...createBreakoutRightImages(doc));
+    const effectsFront = createAvatarLayer(doc, 'effects-front');
+    avatar.append(effectsBack, ringBack, circle, overflow, ringFront, breakoutRight, effectsFront);
+    doc.body.append(avatar);
+    let disposed = false;
+    let composer;
+    let resizeObserver;
+    let frameRequest;
+    let pointerRequest;
+    let reactionTimer;
+    let reactionStageTimers = [];
+    let stateTimer;
+    let blinkTimer;
+    let blinkResetTimer;
+    let idleTimer;
+    let idleResetTimer;
+    let portraitRequest = 0;
+    let reactionRequest = 0;
+    let previousIdleMotion;
+    let desiredHostPortrait = resolveDisplayPortrait(doc.documentElement.dataset.xiaoheiState);
+    let layoutReady = false;
+    let idlePortraitReady = false;
+    let pointerX = 0;
+    let pointerY = 0;
+    const revealAvatar = () => {
+        if (layoutReady && idlePortraitReady)
+            avatar.dataset.xiaoheiAvatarReady = 'true';
+    };
+    const portraitImages = Array.from(avatar.querySelectorAll('[data-xiaohei-portrait-frame]'));
+    const imagesByState = new Map();
+    for (const image of portraitImages) {
+        const state = image.dataset.xiaoheiPortraitFrame;
+        const images = imagesByState.get(state) ?? [];
+        images.push(image);
+        imagesByState.set(state, images);
+    }
+    const decodedStates = new Set();
+    const decodeTasks = new Map();
+    const ensurePortraitDecoded = (state) => {
+        if (decodedStates.has(state))
+            return Promise.resolve(true);
+        const existing = decodeTasks.get(state);
+        if (existing !== undefined)
+            return existing;
+        const task = Promise.all((imagesByState.get(state) ?? []).map(decodePortraitImage))
+            .then((results) => {
+            const decoded = results.length > 0 && results.every(Boolean);
+            if (decoded)
+                decodedStates.add(state);
+            return decoded;
+        });
+        decodeTasks.set(state, task);
+        return task;
+    };
+    const showPortrait = async (state) => {
+        const request = ++portraitRequest;
+        const decoded = await ensurePortraitDecoded(state);
+        if (disposed || request !== portraitRequest || !decoded)
+            return;
+        avatar.dataset.xiaoheiPortrait = state;
+    };
+    const applyHostPortrait = () => {
+        if (avatar.dataset.xiaoheiAvatarReaction !== undefined)
+            return;
+        void showPortrait(desiredHostPortrait);
+    };
+    const scheduleHostPortrait = () => {
+        desiredHostPortrait = resolveDisplayPortrait(doc.documentElement.dataset.xiaoheiState);
+        if (stateTimer !== undefined)
+            clearTimeout(stateTimer);
+        stateTimer = setTimeout(() => {
+            stateTimer = undefined;
+            applyHostPortrait();
+        }, 150);
+    };
+    const measure = () => {
+        frameRequest = undefined;
+        if (disposed || composer === undefined || !composer.isConnected) {
+            avatar.removeAttribute('data-xiaohei-avatar-ready');
+            layoutReady = false;
+            return;
+        }
+        const bounds = composer.getBoundingClientRect();
+        const viewport = win.visualViewport;
+        const viewportWidth = viewport?.width ?? win.innerWidth;
+        const viewportHeight = viewport?.height ?? win.innerHeight;
+        const position = resolveXiaoheiComposerAvatarPosition(bounds, viewportWidth, viewportHeight);
+        avatar.style.setProperty('--xiaohei-composer-avatar-x', `${position.x}px`);
+        avatar.style.setProperty('--xiaohei-composer-avatar-y', `${position.y}px`);
+        avatar.style.setProperty('--xiaohei-composer-avatar-scale', String(position.scale));
+        avatar.dataset.xiaoheiAvatarPlacement = position.placement;
+        if (!layoutReady) {
+            avatar.getBoundingClientRect();
+            layoutReady = true;
+            revealAvatar();
+        }
+    };
+    const scheduleMeasure = () => {
+        if (disposed || frameRequest !== undefined)
+            return;
+        frameRequest = win.requestAnimationFrame(measure);
+    };
+    const bindComposer = () => {
+        const next = doc.querySelector(XIAOHEI_HOST_SELECTORS.composerCard) ?? undefined;
+        if (next !== composer) {
+            resizeObserver?.disconnect();
+            resizeObserver = undefined;
+            composer = next;
+            if (composer !== undefined && typeof win.ResizeObserver === 'function') {
+                resizeObserver = new win.ResizeObserver(scheduleMeasure);
+                resizeObserver.observe(composer);
+            }
+        }
+        scheduleMeasure();
+    };
+    const handleViewportChange = () => scheduleMeasure();
+    const renderPointerResponse = () => {
+        pointerRequest = undefined;
+        const bounds = avatar.getBoundingClientRect();
+        const centerX = bounds.left + bounds.width / 2;
+        const centerY = bounds.top + bounds.height / 2;
+        const deltaX = pointerX - centerX;
+        const deltaY = pointerY - centerY;
+        const distance = Math.hypot(deltaX, deltaY);
+        const proximity = Math.max(0, 1 - distance / 220);
+        avatar.style.setProperty('--xiaohei-avatar-look-x', `${Math.max(-2.5, Math.min(2.5, deltaX / 62)) * proximity}px`);
+        avatar.style.setProperty('--xiaohei-avatar-look-y', `${Math.max(-1.6, Math.min(1.6, deltaY / 88)) * proximity}px`);
+        avatar.style.setProperty('--xiaohei-avatar-look-rotation', `${Math.max(-1.2, Math.min(1.2, deltaX / 170)) * proximity}deg`);
+        avatar.toggleAttribute('data-xiaohei-avatar-aware', proximity > 0);
+        avatar.toggleAttribute('data-xiaohei-avatar-near', distance < 104);
+    };
+    const handlePointerMove = (event) => {
+        pointerX = event.clientX;
+        pointerY = event.clientY;
+        if (pointerRequest === undefined)
+            pointerRequest = win.requestAnimationFrame(renderPointerResponse);
+    };
+    const handleAvatarClick = () => {
+        if (avatar.dataset.xiaoheiAvatarReaction !== undefined)
+            return;
+        if (reactionTimer !== undefined)
+            clearTimeout(reactionTimer);
+        for (const timer of reactionStageTimers)
+            clearTimeout(timer);
+        reactionStageTimers = [];
+        const request = ++reactionRequest;
+        if (idleResetTimer !== undefined)
+            clearTimeout(idleResetTimer);
+        idleResetTimer = undefined;
+        delete avatar.dataset.xiaoheiAvatarIdle;
+        avatar.dataset.xiaoheiAvatarReaction = 'touch';
+        avatar.dataset.xiaoheiAvatarReactionStage = 'anticipate';
+        reactionStageTimers.push(setTimeout(() => {
+            if (request !== reactionRequest)
+                return;
+            avatar.dataset.xiaoheiAvatarReactionStage = 'brace';
+            void showPortrait('brace');
+        }, 170), setTimeout(() => {
+            if (request !== reactionRequest)
+                return;
+            avatar.dataset.xiaoheiAvatarReactionStage = 'break';
+            void showPortrait('reach');
+        }, 430), setTimeout(() => {
+            if (request !== reactionRequest)
+                return;
+            avatar.dataset.xiaoheiAvatarReactionStage = 'recover';
+            void showPortrait('brace');
+        }, 820), setTimeout(() => {
+            if (request !== reactionRequest)
+                return;
+            avatar.dataset.xiaoheiAvatarReactionStage = 'settle';
+            void showPortrait(desiredHostPortrait);
+        }, 1_090));
+        reactionTimer = setTimeout(() => {
+            if (request !== reactionRequest)
+                return;
+            delete avatar.dataset.xiaoheiAvatarReaction;
+            delete avatar.dataset.xiaoheiAvatarReactionStage;
+            reactionTimer = undefined;
+            reactionStageTimers = [];
+            applyHostPortrait();
+        }, 1_340);
+    };
+    const scheduleBlink = () => {
+        if (disposed || blinkTimer !== undefined)
+            return;
+        blinkTimer = setTimeout(() => {
+            blinkTimer = undefined;
+            if (!doc.hidden
+                && avatar.dataset.xiaoheiPortrait === 'idle'
+                && avatar.dataset.xiaoheiAvatarReaction === undefined
+                && avatar.dataset.xiaoheiAvatarIdle === undefined) {
+                void ensurePortraitDecoded('blink').then((decoded) => {
+                    if (!decoded || disposed || avatar.dataset.xiaoheiPortrait !== 'idle')
+                        return;
+                    avatar.dataset.xiaoheiAvatarBlink = 'true';
+                    if (blinkResetTimer !== undefined)
+                        clearTimeout(blinkResetTimer);
+                    blinkResetTimer = setTimeout(() => {
+                        delete avatar.dataset.xiaoheiAvatarBlink;
+                        blinkResetTimer = undefined;
+                    }, 130);
+                });
+            }
+            scheduleBlink();
+        }, 4200 + Math.random() * 3600);
+    };
+    const scheduleIdleMotion = () => {
+        if (disposed || idleTimer !== undefined)
+            return;
+        idleTimer = setTimeout(() => {
+            idleTimer = undefined;
+            if (!doc.hidden
+                && desiredHostPortrait === 'idle'
+                && avatar.dataset.xiaoheiAvatarReaction === undefined) {
+                const motion = resolveXiaoheiComposerIdleMotion(Math.random, previousIdleMotion);
+                previousIdleMotion = motion;
+                avatar.dataset.xiaoheiAvatarIdle = motion;
+                if (motion === 'ponder')
+                    void showPortrait('thinking');
+                idleResetTimer = setTimeout(() => {
+                    delete avatar.dataset.xiaoheiAvatarIdle;
+                    idleResetTimer = undefined;
+                    if (motion === 'ponder')
+                        applyHostPortrait();
+                }, XIAOHEI_IDLE_MOTION_DURATION[motion]);
+            }
+            scheduleIdleMotion();
+        }, 4_800 + Math.random() * 5_600);
+    };
+    const handleTransitionEnd = (event) => {
+        if (composer === undefined)
+            return;
+        const target = event.target;
+        if (target instanceof win.Node && (target === composer || composer.contains(target)))
+            scheduleMeasure();
+    };
+    const unsubscribeHostDom = subscribeXiaoheiHostDom(doc, bindComposer);
+    const stateObserver = new win.MutationObserver(scheduleHostPortrait);
+    stateObserver.observe(doc.documentElement, {
+        attributes: true,
+        attributeFilter: ['data-xiaohei-state'],
+    });
+    win.addEventListener('resize', handleViewportChange, { passive: true });
+    win.addEventListener('pointermove', handlePointerMove, { passive: true });
+    win.visualViewport?.addEventListener('resize', handleViewportChange, { passive: true });
+    win.visualViewport?.addEventListener('scroll', handleViewportChange, { passive: true });
+    doc.addEventListener('transitionend', handleTransitionEnd, true);
+    avatar.addEventListener('click', handleAvatarClick);
+    bindComposer();
+    void ensurePortraitDecoded('idle').then((decoded) => {
+        if (!decoded || disposed)
+            return;
+        idlePortraitReady = true;
+        revealAvatar();
+    });
+    for (const [state] of PORTRAIT_SOURCES) {
+        if (state !== 'idle')
+            void ensurePortraitDecoded(state);
+    }
+    scheduleHostPortrait();
+    scheduleBlink();
+    scheduleIdleMotion();
+    return () => {
+        disposed = true;
+        unsubscribeHostDom();
+        stateObserver.disconnect();
+        resizeObserver?.disconnect();
+        if (frameRequest !== undefined)
+            win.cancelAnimationFrame(frameRequest);
+        if (pointerRequest !== undefined)
+            win.cancelAnimationFrame(pointerRequest);
+        if (reactionTimer !== undefined)
+            clearTimeout(reactionTimer);
+        for (const timer of reactionStageTimers)
+            clearTimeout(timer);
+        if (stateTimer !== undefined)
+            clearTimeout(stateTimer);
+        if (blinkTimer !== undefined)
+            clearTimeout(blinkTimer);
+        if (blinkResetTimer !== undefined)
+            clearTimeout(blinkResetTimer);
+        if (idleTimer !== undefined)
+            clearTimeout(idleTimer);
+        if (idleResetTimer !== undefined)
+            clearTimeout(idleResetTimer);
+        win.removeEventListener('resize', handleViewportChange);
+        win.removeEventListener('pointermove', handlePointerMove);
+        win.visualViewport?.removeEventListener('resize', handleViewportChange);
+        win.visualViewport?.removeEventListener('scroll', handleViewportChange);
+        doc.removeEventListener('transitionend', handleTransitionEnd, true);
+        avatar.removeEventListener('click', handleAvatarClick);
+        avatar.remove();
+    };
+}
+function createAvatarImage(doc, source, state) {
+    const image = doc.createElement('img');
+    image.className = `${XIAOHEI_COMPOSER_AVATAR_CLASS}__image ${XIAOHEI_COMPOSER_AVATAR_CLASS}__image--${state}`;
+    image.alt = '';
+    image.decoding = 'async';
+    const portraitState = state.slice(state.lastIndexOf('-') + 1);
+    image.dataset.xiaoheiPortraitFrame = portraitState;
+    image.fetchPriority = portraitState === 'idle' ? 'high' : 'low';
+    image.src = source;
+    return image;
+}
+function resolveDisplayPortrait(state) {
+    switch (state) {
+        case 'thinking':
+        case 'waiting':
+            return 'thinking';
+        case 'tool':
+        case 'streaming':
+            return 'working';
+        case 'complete':
+            return 'complete';
+        case 'error':
+            return 'error';
+        default:
+            return 'idle';
+    }
+}
+async function decodePortraitImage(image) {
+    try {
+        if (typeof image.decode === 'function')
+            await image.decode();
+        return image.naturalWidth > 0 || image.complete;
+    }
+    catch {
+        return image.complete && image.naturalWidth > 0;
+    }
+}
+const PORTRAIT_SOURCES = [
+    ['idle', XIAOHEI_BREAKFRAME_IDLE],
+    ['blink', XIAOHEI_BREAKFRAME_BLINK],
+    ['brace', XIAOHEI_BREAKFRAME_BRACE],
+    ['reach', XIAOHEI_BREAKFRAME_REACH],
+    ['thinking', XIAOHEI_BREAKFRAME_THINKING],
+    ['working', XIAOHEI_BREAKFRAME_WORKING],
+    ['complete', XIAOHEI_BREAKFRAME_COMPLETE],
+    ['error', XIAOHEI_BREAKFRAME_ERROR],
+];
+function createPortraitImages(doc, layer) {
+    return PORTRAIT_SOURCES.map(([state, source]) => createAvatarImage(doc, source, `${layer}-${state}`));
+}
+function createBreakoutRightImages(doc) {
+    return PORTRAIT_SOURCES
+        .filter(([state]) => state === 'brace' || state === 'reach')
+        .map(([state, source]) => createAvatarImage(doc, source, `breakout-right-${state}`));
+}
+function createAvatarLayer(doc, name) {
+    const layer = doc.createElement('span');
+    layer.className = `${XIAOHEI_COMPOSER_AVATAR_CLASS}__${name}`;
+    return layer;
+}
+//# sourceMappingURL=composer-avatar.js.map

package/lib/composer-send-heixiu.d.ts

@@ -0,0 +1,8 @@
+/** Keep idle blinks sparse without making their rhythm mechanical. */
+export declare function resolveXiaoheiSendBlinkDelay(random?: () => number): number;
+/**
+ * Turn the Host's real primary button into Heixiu without replacing its click,
+ * keyboard, disabled, tooltip, or accessible-name behaviour.
+ */
+export declare function installXiaoheiComposerSendHeixiu(doc?: Document | undefined): () => void;
+//# sourceMappingURL=composer-send-heixiu.d.ts.map

package/lib/composer-send-heixiu.js

@@ -0,0 +1,133 @@
+import { XIAOHEI_HEIXIU_BLINK, XIAOHEI_HEIXIU_OPEN } from './generated-keyart.js';
+import { XIAOHEI_HOST_SELECTORS } from './host-contract.js';
+import { subscribeXiaoheiHostDom } from './host-dom.js';
+const SEND_BUTTON_SELECTOR = ':scope > :last-child > :last-child > button:last-child';
+const SEND_ATTRIBUTE = 'data-xiaohei-send-heixiu';
+const BLINK_ATTRIBUTE = 'data-xiaohei-blink';
+const HEIXIU_CLASS = 'xiaohei-composer-send-heixiu';
+const BLINK_DELAY_MIN_MS = 4600;
+const BLINK_DELAY_MAX_MS = 8200;
+const BLINK_CLOSED_MS = 128;
+/** Keep idle blinks sparse without making their rhythm mechanical. */
+export function resolveXiaoheiSendBlinkDelay(random = Math.random) {
+    const sample = Math.min(1, Math.max(0, random()));
+    return Math.round(BLINK_DELAY_MIN_MS + sample * (BLINK_DELAY_MAX_MS - BLINK_DELAY_MIN_MS));
+}
+function createFrame(doc, source, className) {
+    const image = doc.createElement('img');
+    image.className = className;
+    image.src = source;
+    image.alt = '';
+    image.draggable = false;
+    return image;
+}
+function createHeixiu(doc) {
+    const element = doc.createElement('span');
+    element.className = HEIXIU_CLASS;
+    element.setAttribute('aria-hidden', 'true');
+    element.append(createFrame(doc, XIAOHEI_HEIXIU_OPEN, `${HEIXIU_CLASS}__open`), createFrame(doc, XIAOHEI_HEIXIU_BLINK, `${HEIXIU_CLASS}__blink`));
+    return element;
+}
+/** The Host renders a rect only when the primary action has become Stop. */
+function isSendAction(button) {
+    const hostGlyph = [...button.children].find(child => child.localName === 'svg');
+    return hostGlyph !== undefined && hostGlyph.querySelector('rect') === null;
+}
+/**
+ * Turn the Host's real primary button into Heixiu without replacing its click,
+ * keyboard, disabled, tooltip, or accessible-name behaviour.
+ */
+export function installXiaoheiComposerSendHeixiu(doc = typeof document === 'undefined' ? undefined : document) {
+    if (doc?.body === undefined || doc.defaultView === null)
+        return () => { };
+    const win = doc.defaultView;
+    const reducedMotion = win.matchMedia('(prefers-reduced-motion: reduce)');
+    const decorations = new Map();
+    let blinkTimer = 0;
+    let reopenTimer = 0;
+    const canBlink = () => (decorations.size > 0
+        && doc.visibilityState !== 'hidden'
+        && !reducedMotion.matches);
+    const setClosed = (closed) => {
+        for (const decoration of decorations.values()) {
+            if (closed)
+                decoration.setAttribute(BLINK_ATTRIBUTE, 'closed');
+            else
+                decoration.removeAttribute(BLINK_ATTRIBUTE);
+        }
+    };
+    const clearTimers = () => {
+        if (blinkTimer !== 0)
+            win.clearTimeout(blinkTimer);
+        if (reopenTimer !== 0)
+            win.clearTimeout(reopenTimer);
+        blinkTimer = 0;
+        reopenTimer = 0;
+    };
+    const scheduleBlink = () => {
+        if (!canBlink() || blinkTimer !== 0 || reopenTimer !== 0)
+            return;
+        blinkTimer = win.setTimeout(() => {
+            blinkTimer = 0;
+            if (!canBlink())
+                return;
+            setClosed(true);
+            reopenTimer = win.setTimeout(() => {
+                reopenTimer = 0;
+                setClosed(false);
+                scheduleBlink();
+            }, BLINK_CLOSED_MS);
+        }, resolveXiaoheiSendBlinkDelay());
+    };
+    const restartBlink = () => {
+        clearTimers();
+        setClosed(false);
+        scheduleBlink();
+    };
+    const detach = (button, decoration) => {
+        decoration.remove();
+        button.removeAttribute(SEND_ATTRIBUTE);
+        decorations.delete(button);
+    };
+    const reconcile = () => {
+        const candidates = new Set();
+        for (const card of doc.querySelectorAll(XIAOHEI_HOST_SELECTORS.composerCard)) {
+            const button = card.querySelector(SEND_BUTTON_SELECTOR);
+            if (button !== null && isSendAction(button))
+                candidates.add(button);
+        }
+        const hadDecorations = decorations.size > 0;
+        for (const [button, decoration] of decorations) {
+            if (candidates.has(button) && decoration.parentElement === button)
+                continue;
+            detach(button, decoration);
+        }
+        for (const button of candidates) {
+            if (decorations.has(button))
+                continue;
+            const decoration = createHeixiu(doc);
+            button.setAttribute(SEND_ATTRIBUTE, 'true');
+            button.insertBefore(decoration, button.firstChild);
+            decorations.set(button, decoration);
+        }
+        if (!hadDecorations && decorations.size > 0)
+            scheduleBlink();
+        else if (hadDecorations && decorations.size === 0)
+            restartBlink();
+    };
+    const onEnvironmentChange = () => restartBlink();
+    reconcile();
+    const unsubscribeHostDom = subscribeXiaoheiHostDom(doc, reconcile);
+    doc.addEventListener('visibilitychange', onEnvironmentChange);
+    reducedMotion.addEventListener('change', onEnvironmentChange);
+    return () => {
+        clearTimers();
+        unsubscribeHostDom();
+        doc.removeEventListener('visibilitychange', onEnvironmentChange);
+        reducedMotion.removeEventListener('change', onEnvironmentChange);
+        for (const [button, decoration] of decorations)
+            detach(button, decoration);
+        decorations.clear();
+    };
+}
+//# sourceMappingURL=composer-send-heixiu.js.map

package/lib/gaze.js

@@ -1,5 +1,6 @@
 import { XIAOHEI_IDLE_EYE_BASE } from './generated-keyart.js';
 import { XIAOHEI_GAZE_CSS } from './chrome/gaze.js';
+import { subscribeXiaoheiHostDom } from './host-dom.js';
 import { XIAOHEI_PORTAL_ACTIVITY_EVENT, XIAOHEI_PORTAL_LAYER_ID, } from './portal.js';
 export const XIAOHEI_GAZE_STYLE_ID = 'dsh-theme-xiaohei/gaze-style';
 const POINTER_FULL_GAZE_RADIUS_PX = 360;
@@ -106,8 +107,7 @@ export function installXiaoheiGaze(doc = typeof document === 'undefined' ? undef
     };
     const onPreferenceChange = () => wake();
     const onStateChange = () => wake();
-    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,
@@ -124,7 +124,7 @@ export function installXiaoheiGaze(doc = typeof document === 'undefined' ? undef
         disposed = true;
         if (frameId !== 0)
             win.cancelAnimationFrame(frameId);
-        mountObserver.disconnect();
+        unsubscribeHostDom();
         stateObserver.disconnect();
         doc.removeEventListener('pointermove', onPointerMove);
         doc.removeEventListener('pointerleave', clearPointer);

package/lib/generated-backgrounds.d.ts

@@ -0,0 +1,14 @@
+/** Generated by scripts/embed-assets.mjs for atmosphere and independent lossless character poses. */
+export declare const XIAOHEI_WALLPAPER_LIGHT: string;
+export declare const XIAOHEI_WALLPAPER_DARK: string;
+export declare const XIAOHEI_SEATED_LIGHT: string;
+export declare const XIAOHEI_SEATED_DARK: string;
+export declare const XIAOHEI_PEEK_LIGHT: string;
+export declare const XIAOHEI_PEEK_DARK: string;
+export declare const XIAOHEI_CHIN_LIGHT: string;
+export declare const XIAOHEI_CHIN_DARK: string;
+export declare const XIAOHEI_DOZE_LIGHT: string;
+export declare const XIAOHEI_DOZE_DARK: string;
+export declare const XIAOHEI_HALFPEEK_LIGHT: string;
+export declare const XIAOHEI_HALFPEEK_DARK: string;
+//# sourceMappingURL=generated-backgrounds.d.ts.map