@mingxy/opencode-mascot 0.4.0 → 0.4.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mingxy/opencode-mascot",
-  "version": "0.4.0",
+  "version": "0.4.2",
   "description": "OpenCode TUI mascot plugin framework - customizable ASCII mascots for your terminal",
   "author": "mingxy",
   "license": "MIT",

package/src/components/home-mascot.tsx

@@ -54,47 +54,48 @@ export function HomeMascot(props: HomeMascotProps): JSX.Element {
   };
 
   return (
-    <box
-      left={posX()}
-      top={posY()}
-      alignItems="center"
-      zIndex={9999}
-      flexDirection="column"
-      onMouseDown={(e: any) => {
-        const now = Date.now();
-        if (now - lastClickTime < 300) {
-          switchToNext();
-          lastClickTime = 0;
-          return;
-        }
-        lastClickTime = now;
+    <box height={5} zIndex={9999}>
+      <box
+        position="absolute"
+        left={posX()}
+        top={posY()}
+        flexDirection="column"
+        onMouseDown={(e: any) => {
+          const now = Date.now();
+          if (now - lastClickTime < 300) {
+            switchToNext();
+            lastClickTime = 0;
+            return;
+          }
+          lastClickTime = now;
 
-        if (e.modifiers?.alt) {
-          dragStartX = e.x;
-          dragStartY = e.y;
-          dragAnchorX = posX();
-          dragAnchorY = posY();
-          isDragging = true;
-          renderers[currentName()].setDragging(true);
-          e.preventDefault();
-          e.stopPropagation();
-          props.api.renderer.clearSelection();
-        }
-      }}
-      onMouseDrag={(e: any) => {
-        if (e.modifiers?.alt && isDragging) {
-          setPosX(dragAnchorX + (e.x - dragStartX));
-          setPosY(dragAnchorY + (e.y - dragStartY));
-          e.preventDefault();
-          e.stopPropagation();
-          props.api.renderer.clearSelection();
-        }
-      }}
-      onMouseUp={() => { stopDrag(); }}
-      onMouseDragEnd={() => { stopDrag(); }}
-      onMouseOut={() => { stopDrag(); }}
-    >
-      {renderers[currentName()]?.element() ?? null}
+          if (e.modifiers?.alt) {
+            dragStartX = e.x;
+            dragStartY = e.y;
+            dragAnchorX = posX();
+            dragAnchorY = posY();
+            isDragging = true;
+            renderers[currentName()].setDragging(true);
+            e.preventDefault();
+            e.stopPropagation();
+            props.api.renderer.clearSelection();
+          }
+        }}
+        onMouseDrag={(e: any) => {
+          if (e.modifiers?.alt && isDragging) {
+            setPosX(dragAnchorX + (e.x - dragStartX));
+            setPosY(dragAnchorY + (e.y - dragStartY));
+            e.preventDefault();
+            e.stopPropagation();
+            props.api.renderer.clearSelection();
+          }
+        }}
+        onMouseUp={() => { stopDrag(); }}
+        onMouseDragEnd={() => { stopDrag(); }}
+        onMouseOut={() => { stopDrag(); }}
+      >
+        {renderers[currentName()]?.element() ?? null}
+      </box>
     </box>
   );
 }

package/src/core/ascii-renderer.tsx

@@ -315,14 +315,12 @@ export function createAnimatedRenderer(pack: MascotPack): {
     const dm = dragMsg();
 
     return (
-      <box flexDirection="column" width={10} overflow="visible" left={left} top={top}>
-        {cel ? <text fg={flashColor() ?? fg} selectable={false}>{cel.text}</text> : null}
-        {dm ? <text fg="#FF4081" selectable={false}>{dm}</text> : null}
-        <box flexDirection="column" width={10} alignItems="flex-start">
-          {lines.map((line: string) => (
-            <text fg={flashColor() ?? fg} selectable={false}>{line}</text>
-          ))}
-        </box>
+      <box flexDirection="column" left={left} top={top}>
+        {cel ? <text fg={flashColor() ?? fg}>{cel.text}</text> : null}
+        {dm ? <text fg="#FF4081">{dm}</text> : null}
+        {lines.map((line: string) => (
+          <text fg={flashColor() ?? fg}>{line}</text>
+        ))}
       </box>
     );
   };