@naxodev/opencode-music-player 0.5.4 → 0.5.5

package/dist/index.js

@@ -1030,6 +1030,10 @@ function AlbumArtwork(props) {
   let container;
   let paintPending = false;
   let disposed = false;
+  let renderedFrameId = -1;
+  let renderedSlot = null;
+  let placementInvalidated = false;
+  let awaitingResizeGeometry = false;
   const [nativeVisible, setNativeVisible] = createSignal(false);
   const imageDimensions = createMemo(() => pngDimensions(props.artwork.png_base64));
   const applyAction = (action) => {
@@ -1057,25 +1061,69 @@ function AlbumArtwork(props) {
   const commitPlan = (plan) => {
     runtime.state = copyState(plan.nextState);
   };
+  const clearInvalidatedPlacement = () => {
+    if (!placementInvalidated)
+      return true;
+    if (runtime.state.transmitted !== 0 && !writeGraphics(renderer, kittyDeletePlacement(runtime.state.transmitted)))
+      return false;
+    runtime.state = {
+      ...runtime.state,
+      placement: null
+    };
+    placementInvalidated = false;
+    return true;
+  };
+  const clearPlacement = () => {
+    if (runtime.state.transmitted !== 0 && runtime.state.placement !== null && !writeGraphics(renderer, kittyDeletePlacement(runtime.state.transmitted)))
+      return false;
+    runtime.state = {
+      ...runtime.state,
+      placement: null
+    };
+    renderedSlot = null;
+    setNativeVisible(false);
+    return true;
+  };
+  const fitsAvailableSpace = (node) => {
+    for (let parent = node.parent;parent; parent = parent.parent) {
+      if (parent.width < node.width || parent.height < node.height)
+        return false;
+      if (parent.overflow === "visible")
+        continue;
+      if (node.screenX < parent.screenX || node.screenY < parent.screenY || node.screenX + node.width > parent.screenX + parent.width || node.screenY + node.height > parent.screenY + parent.height)
+        return false;
+    }
+    return true;
+  };
+  const fitsViewport = (slot) => slot.screenX >= 0 && slot.screenY >= 0 && slot.screenX + slot.width <= renderer.terminalWidth && slot.screenY + slot.height <= renderer.terminalHeight;
+  const invalidateForResize = () => {
+    if (disposed || !ownership.isCurrent())
+      return;
+    tmuxOffsetCache.offset = null;
+    tmuxOffsetCache.slot = null;
+    renderedFrameId = -1;
+    renderedSlot = null;
+    placementInvalidated = true;
+    awaitingResizeGeometry = true;
+    clearInvalidatedPlacement();
+    setNativeVisible(false);
+  };
   const paintNativeImage = () => {
     if (!ownership.isCurrent())
       return;
-    if (runtime.identity !== props.artwork.id) {
-      runtime.identity = props.artwork.id;
-      writeGraphics(props.context.renderer, kittyDelete(legacyImageIdForResolvedArtwork(props.artwork)));
-      runtime.state = {
-        transmitted: 0,
-        placement: null
-      };
-    }
+    if (!clearInvalidatedPlacement())
+      return;
     const kittySupported = supportsKittyGraphics(props.context);
+    if (container && !fitsAvailableSpace(container)) {
+      clearPlacement();
+      return;
+    }
     const slotValid = !!container && !container.isDestroyed && container.width >= 1 && container.height >= 1;
-    const slot = container ? {
-      screenX: container.screenX,
-      screenY: container.screenY,
-      width: container.width,
-      height: container.height
-    } : null;
+    const slot = renderedSlot;
+    if (slot && !fitsViewport(slot)) {
+      clearPlacement();
+      return;
+    }
     const offset = terminalOffset(slot);
     const imageId = imageIdForArtwork(props.artwork.id);
     const x = slot ? slot.screenX + offset.x : 0;
@@ -1091,6 +1139,20 @@ function AlbumArtwork(props) {
       width: Math.floor(resolution.width / renderer.terminalWidth),
       height: Math.floor(resolution.height / renderer.terminalHeight)
     }) : null;
+    if (awaitingResizeGeometry && geometry === null && kittySupported)
+      return;
+    awaitingResizeGeometry = false;
+    if (runtime.identity !== props.artwork.id) {
+      if (!clearPlacement())
+        return;
+      if (!writeGraphics(renderer, kittyDelete(legacyImageIdForResolvedArtwork(props.artwork))))
+        return;
+      runtime.identity = props.artwork.id;
+      runtime.state = {
+        transmitted: 0,
+        placement: null
+      };
+    }
     const plan = planNativeArtworkPlacement({
       state: runtime.state,
       imageId,
@@ -1118,20 +1180,28 @@ function AlbumArtwork(props) {
     if (paintPending || disposed)
       return;
     paintPending = true;
-    props.context.renderer.idle().then(() => {
-      paintPending = false;
-      if (!disposed && ownership.isCurrent())
-        paintNativeImage();
-    }).catch((error) => {
+    queueMicrotask(() => {
       paintPending = false;
-      if (!disposed && ownership.isCurrent())
+      if (disposed || !ownership.isCurrent())
+        return;
+      try {
+        if (renderedFrameId !== renderer.frameId)
+          clearPlacement();
+        else
+          paintNativeImage();
+      } catch (error) {
         console.error("Failed to paint music artwork", error);
+      }
     });
   };
-  onMount(() => props.context.renderer.on("frame", scheduleNativeImage));
+  onMount(() => {
+    renderer.on("frame", scheduleNativeImage);
+    renderer.on("resize", invalidateForResize);
+  });
   onCleanup(() => {
     disposed = true;
-    props.context.renderer.off("frame", scheduleNativeImage);
+    renderer.off("frame", scheduleNativeImage);
+    renderer.off("resize", invalidateForResize);
     setTimeout(() => {
       cleanupNativeArtwork(ownership, () => {
         if (!renderer.isDestroyed)
@@ -1147,6 +1217,17 @@ function AlbumArtwork(props) {
   return (() => {
     var _el$ = _$createElement("box");
     _$use((value) => container = value, _el$);
+    _$setProp(_el$, "renderAfter", () => {
+      if (!container)
+        return;
+      renderedFrameId = renderer.frameId;
+      renderedSlot = {
+        screenX: container.screenX,
+        screenY: container.screenY,
+        width: container.width,
+        height: container.height
+      };
+    });
     _$setProp(_el$, "width", 24);
     _$setProp(_el$, "height", 12);
     _$setProp(_el$, "flexDirection", "column");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@naxodev/opencode-music-player",
-  "version": "0.5.4",
+  "version": "0.5.5",
   "description": "macOS system Now Playing controls for the OpenCode 2 TUI",
   "license": "MIT",
   "author": {
@@ -60,7 +60,7 @@
     "validate": "bun run format:check && bun run check && bun run test && bun run pack:check"
   },
   "dependencies": {
-    "@naxodev/music-core": "^0.2.1",
+    "@naxodev/music-core": "^0.2.2",
     "pngjs": "^7.0.0"
   },
   "peerDependencies": {