bloby-bot 0.18.7 → 0.18.9

package/dist-bloby/assets/{highlighted-body-OFNGDK62-DjVujd9M.js → highlighted-body-OFNGDK62-CQTQ53Zc.js}

@@ -1 +1 @@
-import{c as e,r as t,t as n}from"./jsx-runtime-C0W9Wf2W.js";import{n as r,r as i,t as a}from"./bloby-BB0UI7YK.js";var o=e(t(),1),s=n(),c=({code:e,language:t,raw:n,className:c,startLine:l,lineNumbers:u,...d})=>{let{shikiTheme:f}=(0,o.useContext)(i),p=r(),[m,h]=(0,o.useState)(n);return(0,o.useEffect)(()=>{if(!p){h(n);return}let r=p.highlight({code:e,language:t,themes:f},e=>{h(e)});r&&h(r)},[e,t,f,p,n]),(0,s.jsx)(a,{className:c,language:t,lineNumbers:u,result:m,startLine:l,...d})};export{c as HighlightedCodeBlockBody};
+import{c as e,r as t,t as n}from"./jsx-runtime-C0W9Wf2W.js";import{n as r,r as i,t as a}from"./bloby-C0lGB4pP.js";var o=e(t(),1),s=n(),c=({code:e,language:t,raw:n,className:c,startLine:l,lineNumbers:u,...d})=>{let{shikiTheme:f}=(0,o.useContext)(i),p=r(),[m,h]=(0,o.useState)(n);return(0,o.useEffect)(()=>{if(!p){h(n);return}let r=p.highlight({code:e,language:t,themes:f},e=>{h(e)});r&&h(r)},[e,t,f,p,n]),(0,s.jsx)(a,{className:c,language:t,lineNumbers:u,result:m,startLine:l,...d})};export{c as HighlightedCodeBlockBody};

package/dist-bloby/assets/mermaid-GHXKKRXX-BZKpcY-H.js

@@ -0,0 +1 @@
+import{i as e}from"./bloby-C0lGB4pP.js";export{e as Mermaid};

package/dist-bloby/bloby.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, interactive-widget=resizes-content" />
     <title>Bloby Chat</title>
-    <script type="module" crossorigin src="/bloby/assets/bloby-BB0UI7YK.js"></script>
+    <script type="module" crossorigin src="/bloby/assets/bloby-C0lGB4pP.js"></script>
     <link rel="modulepreload" crossorigin href="/bloby/assets/jsx-runtime-C0W9Wf2W.js">
     <link rel="modulepreload" crossorigin href="/bloby/assets/globals-CSKRxRcm.js">
     <link rel="stylesheet" crossorigin href="/bloby/assets/globals-DwlMzgUn.css">

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bloby-bot",
-  "version": "0.18.7",
+  "version": "0.18.9",
   "releaseNotes": [
     "1. react router implemented",
     "2. new workspace design",

package/supervisor/chat/src/components/Chat/HeadphonesAnimation.tsx

@@ -1,16 +1,16 @@
 import { useEffect, useRef, useCallback } from 'react';
 
+// v2 sprite config
 const HP_COLS = 16;
 const HP_FRAME_W = 126;
 const HP_FRAME_H = 84;
+const HP_IDLE_FRAME = 10;
 const HP_ACTIVATE_START = 11;
 const HP_ACTIVATE_END = 40;
-const HP_RECORD_START = 41;
+const HP_RECORD_START = 40;
 const HP_RECORD_END = 85;
-const HP_DEACTIVATE_START = 85;
-const HP_DEACTIVATE_END = 191;
-const HP_FPS = 24;
-const FRAME_MS = 1000 / HP_FPS;
+const HP_BASE_FPS = 24;
+const HP_FAST_FPS = 48;
 
 let cachedSprite: HTMLImageElement | null = null;
 function getSprite(): Promise<HTMLImageElement> {
@@ -29,10 +29,12 @@ interface Props {
   onDone?: () => void;
 }
 
+type HpState = 'idle' | 'activating' | 'activating_then_deactivate' | 'recording' | 'deactivating';
+
 export default function HeadphonesAnimation({ recording, height = 36, onDone }: Props) {
   const canvasRef = useRef<HTMLCanvasElement>(null);
   const spriteRef = useRef<HTMLImageElement | null>(cachedSprite);
-  const stateRef = useRef<'idle' | 'activating' | 'recording' | 'deactivating'>('idle');
+  const stateRef = useRef<HpState>('idle');
   const frameRef = useRef(HP_ACTIVATE_START);
   const pingPongRef = useRef(1);
   const lastRef = useRef(0);
@@ -44,28 +46,27 @@ export default function HeadphonesAnimation({ recording, height = 36, onDone }:
   const displayH = height;
   const displayW = Math.round(displayH * (HP_FRAME_W / HP_FRAME_H));
 
-  // Load sprite once
-  useEffect(() => {
-    getSprite().then((img) => { spriteRef.current = img; });
-  }, []);
+  useEffect(() => { getSprite().then((img) => { spriteRef.current = img; }); }, []);
 
-  // React to recording prop changes
+  // React to recording prop
   useEffect(() => {
     if (recording && !prevRecording.current) {
       stateRef.current = 'activating';
       frameRef.current = HP_ACTIVATE_START;
+      pingPongRef.current = 1;
       lastRef.current = performance.now();
     } else if (!recording && prevRecording.current) {
-      if (stateRef.current === 'activating' || stateRef.current === 'recording') {
+      if (stateRef.current === 'activating') {
+        stateRef.current = 'activating_then_deactivate';
+      } else if (stateRef.current === 'recording') {
         stateRef.current = 'deactivating';
-        frameRef.current = HP_DEACTIVATE_START;
+        frameRef.current = HP_ACTIVATE_END;
         lastRef.current = performance.now();
       }
     }
     prevRecording.current = recording;
   }, [recording]);
 
-  // Animation loop
   const tick = useCallback((now: number) => {
     const canvas = canvasRef.current;
     const sprite = spriteRef.current;
@@ -79,24 +80,31 @@ export default function HeadphonesAnimation({ recording, height = 36, onDone }:
       return;
     }
 
+    const fps = (state === 'activating' || state === 'activating_then_deactivate' || state === 'deactivating') ? HP_FAST_FPS : HP_BASE_FPS;
+    const frameMs = 1000 / fps;
     const delta = now - lastRef.current;
-    if (delta >= FRAME_MS) {
-      lastRef.current = now - (delta % FRAME_MS);
+    if (delta >= frameMs) {
+      lastRef.current = now - (delta % frameMs);
 
-      if (state === 'activating') {
+      if (state === 'activating' || state === 'activating_then_deactivate') {
         frameRef.current++;
         if (frameRef.current > HP_ACTIVATE_END) {
-          stateRef.current = 'recording';
-          frameRef.current = HP_RECORD_START;
-          pingPongRef.current = 1;
+          if (state === 'activating_then_deactivate') {
+            stateRef.current = 'deactivating';
+            frameRef.current = HP_ACTIVATE_END;
+          } else {
+            stateRef.current = 'recording';
+            frameRef.current = HP_RECORD_START;
+            pingPongRef.current = 1;
+          }
         }
       } else if (state === 'recording') {
         frameRef.current += pingPongRef.current;
         if (frameRef.current >= HP_RECORD_END) { frameRef.current = HP_RECORD_END; pingPongRef.current = -1; }
         else if (frameRef.current <= HP_RECORD_START) { frameRef.current = HP_RECORD_START; pingPongRef.current = 1; }
       } else if (state === 'deactivating') {
-        frameRef.current++;
-        if (frameRef.current > HP_DEACTIVATE_END) {
+        frameRef.current--;
+        if (frameRef.current < HP_ACTIVATE_START) {
           stateRef.current = 'idle';
           ctx.clearRect(0, 0, displayW, displayH);
           onDoneRef.current?.();
@@ -124,15 +132,9 @@ export default function HeadphonesAnimation({ recording, height = 36, onDone }:
     canvas.height = displayH * dpr;
     const ctx = canvas.getContext('2d')!;
     ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
-
     rafRef.current = requestAnimationFrame(tick);
     return () => cancelAnimationFrame(rafRef.current);
   }, [tick, displayW, displayH]);
 
-  return (
-    <canvas
-      ref={canvasRef}
-      style={{ width: displayW, height: displayH, display: 'block' }}
-    />
-  );
+  return <canvas ref={canvasRef} style={{ width: displayW, height: displayH, display: 'block' }} />;
 }