fix(dashboard): pack remaining grid widgets after sixel extraction

When sixel-eligible widgets are stripped out of the framebuffer, the
remaining widgets kept their original `layout.y`, so `renderGrid`
still allocated blank bands for the removed rows and the sixel images
were always appended after the whole grid (changing vertical order).

Compress `layout.y` values by dense rank while preserving relative
order within the same original band, so the grid packs contiguously
from y=0 with no holes and no reordering of left/right widgets on the
same row.

Author: jared-outpost[bot]

packages/cli/src/lib/formatters/dashboard.ts

@@ -1855,7 +1855,8 @@ export function formatDashboardWithData(data: DashboardViewData): string {
     : data.widgets;
 
   if (gridWidgets.length > 0) {
-    lines.push(...renderGrid(gridWidgets, termWidth));
+    const packed = packGridY(gridWidgets);
+    lines.push(...renderGrid(packed, termWidth));
   }
   for (const w of sixelWidgets) {
     lines.push(...renderSixelWidget(w, termWidth));
@@ -1865,6 +1866,40 @@ export function formatDashboardWithData(data: DashboardViewData): string {
   return lines.join("\n");
 }
 
+/**
+ * Return a shallow copy of the widgets with their `layout.y` renumbered so
+ * the remaining widgets pack contiguously from y=0 without blank bands.
+ * Widgets without a layout are left untouched. Relative order within the
+ * same original y-band is preserved (important for left/right widgets on
+ * the same row).
+ */
+function packGridY(
+  widgets: DashboardViewWidget[]
+): DashboardViewWidget[] {
+  const ys = Array.from(
+    new Set(
+      widgets
+        .map((w) => w.layout?.y)
+        .filter((y): y is number => typeof y === "number")
+    )
+  ).sort((a, b) => a - b);
+  if (ys.length === 0) {
+    return widgets;
+  }
+  const rank = new Map<number, number>(ys.map((y, i) => [y, i]));
+
+  return widgets.map((w) => {
+    if (!w.layout) {
+      return w;
+    }
+    const r = rank.get(w.layout.y);
+    if (r === undefined) {
+      return w;
+    }
+    return { ...w, layout: { ...w.layout, y: r } };
+  });
+}
+
 /**
  * Whether a widget should render as an inline sixel image: opt-in is on, the
  * data is a plain (non-categorical) timeseries, and the terminal supports

packages/cli/test/lib/formatters/dashboard-sixel-integration.test.ts

@@ -180,13 +180,13 @@ describe("dashboard sixel integration", () => {
 
     const output = formatDashboardWithData(data);
     const lines = output.split("\n");
-    // The DCS image must not share a terminal row with the neighboring widget's
-    // borders — the sixel line carries no box-drawing characters.
+    // The DCS image must not share a terminal row with any bordered widget.
     const sixelLine = lines.find((l) => l.includes(`${ESC}P`));
     expect(sixelLine).toBeDefined();
     expect(sixelLine).not.toContain("│");
     expect(sixelLine).not.toContain("─");
-    // The character grid (big-number widget) still renders above the image.
+    // The character grid (big-number widget) still renders; the sixel image
+    // appears after the grid (full-width, no hole in the packed layout).
     expect(output).toContain("Big Number");
     expect(output).toContain("Sixel Chart");
   });