@agent-native/core 0.43.0 → 0.44.1

package/dist/client/blocks/library/annotation-rail.d.ts

@@ -74,12 +74,97 @@ export declare function AnnotationGutterMarker({ marker, active, className, }: {
     active: boolean;
     className?: string;
 }): import("react/jsx-runtime").JSX.Element;
+/**
+ * One line-anchored note card: marker pip (when `showMarker`), the resolved line
+ * span ("Line 8"), an optional label, and the markdown `note` (via
+ * `ctx.renderMarkdown`). This is the single source of card markup, rendered both
+ * by the visually-hidden a11y/test stack and by the on-hover portal popover.
+ */
+export declare function AnnotationCard<A extends RailAnnotation>({ item, ctx, active, showMarker, className, onMouseEnter, onMouseLeave, }: {
+    item: ResolvedAnnotation<A>;
+    ctx: BlockRenderContext;
+    active?: boolean;
+    showMarker?: boolean;
+    className?: string;
+    onMouseEnter?: () => void;
+    onMouseLeave?: () => void;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * Visually-hidden stack of every resolved note. It is NOT a visible column — it
+ * sits in the flow but clipped to a 1px box (the `sr-only` pattern) so the note
+ * text and the per-card marker pips stay in the accessibility tree and in the
+ * DOM (assistive tech can reach them, and tests that read `textContent`/count
+ * pips still see them) WITHOUT painting a persistent rail beside the code. The
+ * visible card appears only on hover via {@link AnnotationHoverCard}.
+ */
+export declare function AnnotationHiddenStack<A extends RailAnnotation>({ items, ctx, showMarker, }: {
+    items: ResolvedAnnotation<A>[];
+    ctx: BlockRenderContext;
+    showMarker?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+/** The geometry the hover card anchors to (in viewport coordinates). */
+export interface AnnotationAnchor {
+    /** Right edge of the code block (where the card should start). */
+    codeRight: number;
+    /** Left edge of the code block (for the below-fallback alignment). */
+    codeLeft: number;
+    /** Vertical center of the hovered line. */
+    lineCenter: number;
+    /** Bottom of the hovered line (for the below-fallback placement). */
+    lineBottom: number;
+}
+/**
+ * The single on-hover note card, portaled to `document.body` and positioned
+ * `fixed` so it escapes the code block's `overflow` and never reflows the code.
+ *
+ * Placement: by default it sits to the RIGHT of the code block's right edge,
+ * vertically centered on the hovered line — so it never overlaps the code text.
+ * If there isn't room to the right (it would overflow the viewport), it clamps
+ * within the viewport, and if the right gutter is too narrow for the card it
+ * falls back to BELOW the hovered line (left-aligned to the code block). The card
+ * keeps itself open while hovered (`onMouseEnter`/`onMouseLeave` forwarded) so it
+ * stays readable; the caller adds the small hover-intent close delay.
+ */
+export declare function AnnotationHoverCard<A extends RailAnnotation>({ item, anchor, ctx, showMarker, onMouseEnter, onMouseLeave, }: {
+    item: ResolvedAnnotation<A>;
+    anchor: AnnotationAnchor;
+    ctx: BlockRenderContext;
+    showMarker?: boolean;
+    onMouseEnter?: () => void;
+    onMouseLeave?: () => void;
+}): any;
+/**
+ * Hover-intent controller for the on-hover note card. Exposes `activeIndex` +
+ * the captured `anchor`, plus `open`/`scheduleClose`/`cancelClose` handlers.
+ *
+ *  - `open(index, anchor)` shows a card immediately (cancels any pending close).
+ *  - `scheduleClose()` hides after a short delay, so moving the pointer from the
+ *    code line across the gap into the card itself keeps it open.
+ *  - `cancelClose()` (call on card mouse-enter) keeps it open while reading.
+ */
+export declare function useAnnotationHover(delay?: number): {
+    readonly activeIndex: number;
+    readonly anchor: AnnotationAnchor;
+    readonly open: (index: number, anchor: AnnotationAnchor) => void;
+    readonly scheduleClose: () => void;
+    readonly cancelClose: () => void;
+};
+/**
+ * Build an {@link AnnotationAnchor} from the code block element and the hovered
+ * row element. The card anchors to the code block's RIGHT edge and the row's
+ * vertical center, both in viewport coordinates (so a `fixed` portal lines up).
+ */
+export declare function anchorFromElements(codeEl: HTMLElement | null, rowEl: HTMLElement | null): AnnotationAnchor | null;
 /**
  * The responsive list of line-anchored note cards. Each card shows its marker
  * pip, the resolved line span ("Line 8"), an optional label, and the markdown
  * `note` (via `ctx.renderMarkdown`). Hovering a card sets the active index;
  * `activeIndex` driven from outside lets a hovered code row light its card and
  * vice-versa. Only annotations whose `range` resolved are listed.
+ *
+ * @deprecated Superseded by the on-hover {@link AnnotationHoverCard}; kept for
+ * back-compat with any external importer. Both block read renderers now use the
+ * hover popover anchored to the right of the code instead of a persistent rail.
  */
 export declare function AnnotationNoteRail<A extends RailAnnotation>({ items, activeIndex, onActiveChange, ctx, className, showMarker, }: {
     items: ResolvedAnnotation<A>[];
@@ -90,25 +175,6 @@ export declare function AnnotationNoteRail<A extends RailAnnotation>({ items, ac
     /** Show a leading numbered pip on each card (diff block). */
     showMarker?: boolean;
 }): import("react/jsx-runtime").JSX.Element;
-/**
- * A single line-anchored note rendered INLINE in the diff flow — full-width,
- * directly under the line it annotates — instead of in a side rail (the
- * GitHub-review affordance). The diff block places one of these after the first
- * row of each annotation's range, so the numbered `①`/`②` row marker and the note
- * read together in one column. It carries the same marker pip, line range,
- * optional label, and markdown `note` as a rail card, and the same two-way hover
- * wiring (`active` / `onActiveChange`) so the row and its note cross-highlight.
- *
- * The outer band is `min-w-full` so the amber wash spans the diff's full scroll
- * width; the content is `sticky left-0` with a readable `max-w` so the note stays
- * pinned and legible while long code lines scroll horizontally beneath it.
- */
-export declare function InlineAnnotationNote<A extends RailAnnotation>({ item, active, onActiveChange, ctx, }: {
-    item: ResolvedAnnotation<A>;
-    active: boolean;
-    onActiveChange: (index: number | null) => void;
-    ctx: BlockRenderContext;
-}): import("react/jsx-runtime").JSX.Element;
 /** Whether a resolved list has at least one note worth rendering a rail for. */
 export declare function hasRailAnnotations(items: ResolvedAnnotation[]): boolean;
 export type AnnotationRailChildren = ReactNode;

package/dist/client/blocks/library/annotation-rail.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"annotation-rail.d.ts","sourceRoot":"","sources":["../../../../src/client/blocks/library/annotation-rail.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"annotation-rail.d.ts","sourceRoot":"","sources":["../../../../src/client/blocks/library/annotation-rail.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEtD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAIH;;;;;GAKG;AACH,wBAAgB,cAAc,CAC5B,GAAG,EAAE,MAAM,EACX,SAAS,EAAE,MAAM,GAChB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,GAAG,IAAI,CAUvC;AAED,0EAA0E;AAC1E,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,kBAAkB,CAAC,CAAC,SAAS,cAAc,GAAG,cAAc;IAC3E,oEAAoE;IACpE,KAAK,EAAE,MAAM,CAAC;IACd,+CAA+C;IAC/C,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,CAAC,CAAC;IACd,KAAK,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;CAC9C;AAED;;;;;;;GAOG;AACH,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,cAAc,EACzD,WAAW,EAAE,CAAC,EAAE,GAAG,SAAS,EAC5B,YAAY,EAAE,CAAC,UAAU,EAAE,CAAC,KAAK,MAAM,GACtC,kBAAkB,CAAC,CAAC,CAAC,EAAE,CAOzB;AAED,wEAAwE;AACxE,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,cAAc,EACzD,QAAQ,EAAE,kBAAkB,CAAC,CAAC,CAAC,EAAE,GAChC,GAAG,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC,CAAC,EAAE,CAAC,CAWtC;AAED,kFAAkF;AAClF,wBAAgB,UAAU,CAAC,IAAI,EAAE,kBAAkB,GAAG,MAAM,CAK3D;AAID;;;GAGG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,MAAM,EACN,MAAM,EACN,SAAS,GACV,EAAE;IACD,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,2CAeA;AAID;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,CAAC,SAAS,cAAc,EAAE,EACvD,IAAI,EACJ,GAAG,EACH,MAAc,EACd,UAAkB,EAClB,SAAS,EACT,YAAY,EACZ,YAAY,GACb,EAAE;IACD,IAAI,EAAE,kBAAkB,CAAC,CAAC,CAAC,CAAC;IAC5B,GAAG,EAAE,kBAAkB,CAAC;IACxB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B,2CAwCA;AAED;;;;;;;GAOG;AACH,wBAAgB,qBAAqB,CAAC,CAAC,SAAS,cAAc,EAAE,EAC9D,KAAK,EACL,GAAG,EACH,UAAkB,GACnB,EAAE;IACD,KAAK,EAAE,kBAAkB,CAAC,CAAC,CAAC,EAAE,CAAC;IAC/B,GAAG,EAAE,kBAAkB,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,2CAkBA;AAID,wEAAwE;AACxE,MAAM,WAAW,gBAAgB;IAC/B,kEAAkE;IAClE,SAAS,EAAE,MAAM,CAAC;IAClB,sEAAsE;IACtE,QAAQ,EAAE,MAAM,CAAC;IACjB,2CAA2C;IAC3C,UAAU,EAAE,MAAM,CAAC;IACnB,qEAAqE;IACrE,UAAU,EAAE,MAAM,CAAC;CACpB;AAMD;;;;;;;;;;;GAWG;AACH,wBAAgB,mBAAmB,CAAC,CAAC,SAAS,cAAc,EAAE,EAC5D,IAAI,EACJ,MAAM,EACN,GAAG,EACH,UAAkB,EAClB,YAAY,EACZ,YAAY,GACb,EAAE;IACD,IAAI,EAAE,kBAAkB,CAAC,CAAC,CAAC,CAAC;IAC5B,MAAM,EAAE,gBAAgB,CAAC;IACzB,GAAG,EAAE,kBAAkB,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B,OA2EA;AAED;;;;;;;;GAQG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,SAAM;;;2BAavB,MAAM,UAAU,gBAAgB;;;EAkBtD;AAED;;;;GAIG;AACH,wBAAgB,kBAAkB,CAChC,MAAM,EAAE,WAAW,GAAG,IAAI,EAC1B,KAAK,EAAE,WAAW,GAAG,IAAI,GACxB,gBAAgB,GAAG,IAAI,CAUzB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,cAAc,EAAE,EAC3D,KAAK,EACL,WAAW,EACX,cAAc,EACd,GAAG,EACH,SAAS,EACT,UAAkB,GACnB,EAAE;IACD,KAAK,EAAE,kBAAkB,CAAC,CAAC,CAAC,EAAE,CAAC;IAC/B,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC/C,GAAG,EAAE,kBAAkB,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6DAA6D;IAC7D,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,2CAoBA;AAED,gFAAgF;AAChF,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,kBAAkB,EAAE,GAAG,OAAO,CAEvE;AAED,MAAM,MAAM,sBAAsB,GAAG,SAAS,CAAC"}

package/dist/client/blocks/library/annotation-rail.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo } from "react";
+import { useEffect, useLayoutEffect, useMemo, useRef, useState, } from "react";
+import { createPortal } from "react-dom";
 import { cn } from "../../utils.js";
 /**
  * Shared line-anchored annotation UI for the `annotated-code` and `diff` blocks.
@@ -96,41 +97,162 @@ export function AnnotationGutterMarker({ marker, active, className, }) {
             ? "bg-amber-500 text-white dark:bg-amber-400 dark:text-amber-950"
             : "bg-amber-400/25 text-amber-700 dark:bg-amber-300/20 dark:text-amber-300", className), children: marker }));
 }
-/* ── Note rail ─────────────────────────────────────────────────────────────── */
+/* ── Note card ─────────────────────────────────────────────────────────────── */
+/**
+ * One line-anchored note card: marker pip (when `showMarker`), the resolved line
+ * span ("Line 8"), an optional label, and the markdown `note` (via
+ * `ctx.renderMarkdown`). This is the single source of card markup, rendered both
+ * by the visually-hidden a11y/test stack and by the on-hover portal popover.
+ */
+export function AnnotationCard({ item, ctx, active = false, showMarker = false, className, onMouseEnter, onMouseLeave, }) {
+    return (_jsxs("div", { onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, className: cn("rounded-lg border px-3.5 py-2.5 transition-colors", active
+            ? "border-amber-400/70 bg-amber-50 dark:border-amber-300/40 dark:bg-amber-300/[0.08]"
+            : "border-plan-line bg-plan-block/40 hover:border-amber-400/50", className), children: [_jsxs("div", { className: cn("flex flex-wrap gap-x-2 gap-y-0.5", showMarker ? "items-center" : "items-baseline"), children: [showMarker && (_jsx(AnnotationGutterMarker, { marker: item.marker, active: active })), _jsx("span", { className: "text-[11px] font-semibold uppercase tracking-wide text-plan-muted", children: rangeLabel(item) }), item.annotation.label && (_jsx("span", { className: "text-[13px] font-semibold text-plan-text", children: item.annotation.label }))] }), _jsx("div", { className: "plan-annotation-note mt-1 text-[13px] leading-relaxed text-plan-text/85", children: ctx.renderMarkdown ? (ctx.renderMarkdown(item.annotation.note)) : (_jsx("p", { children: item.annotation.note })) })] }));
+}
+/**
+ * Visually-hidden stack of every resolved note. It is NOT a visible column — it
+ * sits in the flow but clipped to a 1px box (the `sr-only` pattern) so the note
+ * text and the per-card marker pips stay in the accessibility tree and in the
+ * DOM (assistive tech can reach them, and tests that read `textContent`/count
+ * pips still see them) WITHOUT painting a persistent rail beside the code. The
+ * visible card appears only on hover via {@link AnnotationHoverCard}.
+ */
+export function AnnotationHiddenStack({ items, ctx, showMarker = false, }) {
+    const resolved = useMemo(() => items.filter((item) => item.range), [items]);
+    if (resolved.length === 0)
+        return null;
+    return (_jsx("div", { className: "absolute size-px overflow-hidden whitespace-nowrap border-0 p-0 [clip:rect(0,0,0,0)] [clip-path:inset(50%)]", "data-annotation-hidden-stack": true, children: resolved.map((item) => (_jsx(AnnotationCard, { item: item, ctx: ctx, showMarker: showMarker }, item.index))) }));
+}
+const HOVER_CARD_WIDTH = 280;
+const HOVER_CARD_GAP = 12;
+const VIEWPORT_MARGIN = 8;
+/**
+ * The single on-hover note card, portaled to `document.body` and positioned
+ * `fixed` so it escapes the code block's `overflow` and never reflows the code.
+ *
+ * Placement: by default it sits to the RIGHT of the code block's right edge,
+ * vertically centered on the hovered line — so it never overlaps the code text.
+ * If there isn't room to the right (it would overflow the viewport), it clamps
+ * within the viewport, and if the right gutter is too narrow for the card it
+ * falls back to BELOW the hovered line (left-aligned to the code block). The card
+ * keeps itself open while hovered (`onMouseEnter`/`onMouseLeave` forwarded) so it
+ * stays readable; the caller adds the small hover-intent close delay.
+ */
+export function AnnotationHoverCard({ item, anchor, ctx, showMarker = false, onMouseEnter, onMouseLeave, }) {
+    const cardRef = useRef(null);
+    const [pos, setPos] = useState(null);
+    // Measure the rendered card, then resolve a non-overlapping position: right of
+    // the code if it fits, else clamp into the viewport, else drop below the line.
+    useLayoutEffect(() => {
+        if (typeof window === "undefined")
+            return;
+        const el = cardRef.current;
+        const rect = el?.getBoundingClientRect();
+        const width = rect && rect.width > 0 ? rect.width : HOVER_CARD_WIDTH;
+        const height = rect && rect.height > 0 ? rect.height : 0;
+        const vw = window.innerWidth || 0;
+        const vh = window.innerHeight || 0;
+        const rightLeft = anchor.codeRight + HOVER_CARD_GAP;
+        const fitsRight = rightLeft + width + VIEWPORT_MARGIN <= vw;
+        let left;
+        let top;
+        if (fitsRight) {
+            // Default: to the right of the code, centered on the hovered line.
+            left = rightLeft;
+            top = anchor.lineCenter - height / 2;
+        }
+        else {
+            // No room to the right → drop below the line, aligned to the code's left.
+            left = anchor.codeLeft;
+            top = anchor.lineBottom + HOVER_CARD_GAP;
+        }
+        // Clamp within the viewport so the card is never cut off.
+        left = Math.max(VIEWPORT_MARGIN, Math.min(left, vw - width - VIEWPORT_MARGIN));
+        top = Math.max(VIEWPORT_MARGIN, Math.min(top, vh - height - VIEWPORT_MARGIN));
+        setPos({ top, left });
+    }, [
+        anchor.codeRight,
+        anchor.codeLeft,
+        anchor.lineCenter,
+        anchor.lineBottom,
+        item.index,
+    ]);
+    if (typeof document === "undefined")
+        return null;
+    return createPortal(_jsx("div", { ref: cardRef, role: "tooltip", "data-annotation-hover-card": true, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, className: "pointer-events-auto fixed z-50", style: {
+            top: pos?.top ?? anchor.lineCenter,
+            left: pos?.left ?? anchor.codeRight + HOVER_CARD_GAP,
+            width: HOVER_CARD_WIDTH,
+            // Hide until measured to avoid a one-frame jump from the fallback spot.
+            visibility: pos ? "visible" : "hidden",
+        }, children: _jsx(AnnotationCard, { item: item, ctx: ctx, active: true, showMarker: showMarker, className: "shadow-lg shadow-black/10 dark:shadow-black/40" }) }), document.body);
+}
+/**
+ * Hover-intent controller for the on-hover note card. Exposes `activeIndex` +
+ * the captured `anchor`, plus `open`/`scheduleClose`/`cancelClose` handlers.
+ *
+ *  - `open(index, anchor)` shows a card immediately (cancels any pending close).
+ *  - `scheduleClose()` hides after a short delay, so moving the pointer from the
+ *    code line across the gap into the card itself keeps it open.
+ *  - `cancelClose()` (call on card mouse-enter) keeps it open while reading.
+ */
+export function useAnnotationHover(delay = 130) {
+    const [active, setActive] = useState(null);
+    const timer = useRef(null);
+    const cancelClose = () => {
+        if (timer.current) {
+            clearTimeout(timer.current);
+            timer.current = null;
+        }
+    };
+    const open = (index, anchor) => {
+        cancelClose();
+        setActive({ index, anchor });
+    };
+    const scheduleClose = () => {
+        cancelClose();
+        timer.current = setTimeout(() => setActive(null), delay);
+    };
+    useEffect(() => () => cancelClose(), []);
+    return {
+        activeIndex: active?.index ?? null,
+        anchor: active?.anchor ?? null,
+        open,
+        scheduleClose,
+        cancelClose,
+    };
+}
+/**
+ * Build an {@link AnnotationAnchor} from the code block element and the hovered
+ * row element. The card anchors to the code block's RIGHT edge and the row's
+ * vertical center, both in viewport coordinates (so a `fixed` portal lines up).
+ */
+export function anchorFromElements(codeEl, rowEl) {
+    if (!codeEl || !rowEl)
+        return null;
+    const code = codeEl.getBoundingClientRect();
+    const row = rowEl.getBoundingClientRect();
+    return {
+        codeRight: code.right,
+        codeLeft: code.left,
+        lineCenter: row.top + row.height / 2,
+        lineBottom: row.bottom,
+    };
+}
 /**
  * The responsive list of line-anchored note cards. Each card shows its marker
  * pip, the resolved line span ("Line 8"), an optional label, and the markdown
  * `note` (via `ctx.renderMarkdown`). Hovering a card sets the active index;
  * `activeIndex` driven from outside lets a hovered code row light its card and
  * vice-versa. Only annotations whose `range` resolved are listed.
+ *
+ * @deprecated Superseded by the on-hover {@link AnnotationHoverCard}; kept for
+ * back-compat with any external importer. Both block read renderers now use the
+ * hover popover anchored to the right of the code instead of a persistent rail.
  */
 export function AnnotationNoteRail({ items, activeIndex, onActiveChange, ctx, className, showMarker = false, }) {
     const sideAnnotations = useMemo(() => items.filter((item) => item.range), [items]);
-    return (_jsx("div", { className: cn("flex flex-col gap-2.5", className), children: sideAnnotations.map((item) => {
-            const isActive = activeIndex === item.index;
-            return (_jsxs("div", { onMouseEnter: () => onActiveChange(item.index), onMouseLeave: () => onActiveChange(null), className: cn("rounded-lg border px-3.5 py-2.5 transition-colors", isActive
-                    ? "border-amber-400/70 bg-amber-50 dark:border-amber-300/40 dark:bg-amber-300/[0.08]"
-                    : "border-plan-line bg-plan-block/40 hover:border-amber-400/50"), children: [_jsxs("div", { className: cn("flex flex-wrap gap-x-2 gap-y-0.5", showMarker ? "items-center" : "items-baseline"), children: [showMarker && (_jsx(AnnotationGutterMarker, { marker: item.marker, active: isActive })), _jsx("span", { className: "text-[11px] font-semibold uppercase tracking-wide text-plan-muted", children: rangeLabel(item) }), item.annotation.label && (_jsx("span", { className: "text-[13px] font-semibold text-plan-text", children: item.annotation.label }))] }), _jsx("div", { className: "plan-annotation-note mt-1 text-[13px] leading-relaxed text-plan-text/85", children: ctx.renderMarkdown ? (ctx.renderMarkdown(item.annotation.note)) : (_jsx("p", { children: item.annotation.note })) })] }, item.index));
-        }) }));
-}
-/* ── Inline note (GitHub-style) ─────────────────────────────────────────────── */
-/**
- * A single line-anchored note rendered INLINE in the diff flow — full-width,
- * directly under the line it annotates — instead of in a side rail (the
- * GitHub-review affordance). The diff block places one of these after the first
- * row of each annotation's range, so the numbered `①`/`②` row marker and the note
- * read together in one column. It carries the same marker pip, line range,
- * optional label, and markdown `note` as a rail card, and the same two-way hover
- * wiring (`active` / `onActiveChange`) so the row and its note cross-highlight.
- *
- * The outer band is `min-w-full` so the amber wash spans the diff's full scroll
- * width; the content is `sticky left-0` with a readable `max-w` so the note stays
- * pinned and legible while long code lines scroll horizontally beneath it.
- */
-export function InlineAnnotationNote({ item, active, onActiveChange, ctx, }) {
-    return (_jsx("div", { onMouseEnter: () => onActiveChange(item.index), onMouseLeave: () => onActiveChange(null), className: cn("min-w-full border-y transition-colors", active
-            ? "border-amber-400/60 bg-amber-100/70 dark:border-amber-300/40 dark:bg-amber-300/[0.12]"
-            : "border-amber-400/30 bg-amber-50/70 dark:border-amber-300/20 dark:bg-amber-300/[0.06]"), children: _jsxs("div", { className: "sticky left-0 flex max-w-[44rem] gap-2.5 whitespace-normal px-3 py-2.5 font-sans", children: [_jsx(AnnotationGutterMarker, { marker: item.marker, active: active }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsxs("div", { className: "flex flex-wrap items-baseline gap-x-2 gap-y-0.5", children: [_jsx("span", { className: "text-[11px] font-semibold uppercase tracking-wide text-plan-muted", children: rangeLabel(item) }), item.annotation.label && (_jsx("span", { className: "text-[13px] font-semibold text-plan-text", children: item.annotation.label }))] }), _jsx("div", { className: "plan-annotation-note mt-1 text-[13px] leading-relaxed text-plan-text/85", children: ctx.renderMarkdown ? (ctx.renderMarkdown(item.annotation.note)) : (_jsx("p", { children: item.annotation.note })) })] })] }) }));
+    return (_jsx("div", { className: cn("flex flex-col gap-2.5", className), children: sideAnnotations.map((item) => (_jsx(AnnotationCard, { item: item, ctx: ctx, active: activeIndex === item.index, showMarker: showMarker, onMouseEnter: () => onActiveChange(item.index), onMouseLeave: () => onActiveChange(null) }, item.index))) }));
 }
 /** Whether a resolved list has at least one note worth rendering a rail for. */
 export function hasRailAnnotations(items) {

package/dist/client/blocks/library/annotation-rail.js.map

@@ -1 +1 @@
-{"version":3,"file":"annotation-rail.js","sourceRoot":"","sources":["../../../../src/client/blocks/library/annotation-rail.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, type ReactNode } from \"react\";\nimport { cn } from \"../../utils.js\";\nimport type { BlockRenderContext } from \"../types.js\";\n\n/**\n * Shared line-anchored annotation UI for the `annotated-code` and `diff` blocks.\n *\n * Both blocks render a numbered code surface plus a side \"rail\" of notes, where\n * each note targets a 1-based `lines` ref (`\"3\"` or `\"3-5\"`) and hovering a code\n * line ↔ its note cross-highlights. This module owns the pure pieces that were\n * identical between them so neither block forks the behavior:\n *\n *  - `parseLineRange` — the forgiving 1-based `lines` range parser.\n *  - `resolveAnnotations` / `buildLineMarkerMap` — turn a raw annotation list\n *    into stable, marker-numbered, range-resolved records and a line→markers map.\n *  - `rangeLabel` — the human \"Line 8\" / \"Lines 3–6\" label.\n *  - `AnnotationGutterMarker` — the numbered amber pip placed on an annotated row\n *    (used by the diff grid; the annotated-code surface uses its own rail bar).\n *  - `AnnotationNoteRail` — the responsive list of note cards with two-way hover.\n *    `showMarker` opts the diff block into a leading numbered pip on each card so\n *    a note can be matched to its `①`/`②` row marker; annotated-code omits it to\n *    keep its original card chrome.\n *\n * `AnnotatedCodeBlock` annotates a single code surface; `DiffBlock` annotates a\n * before/after grid (each annotation also carries a `side`). The shared types\n * here are intentionally minimal — callers pass their own `side` handling and\n * decide which rows a marker lands on; this module only owns the parsing, the\n * resolved-record shape, and the rendered marker + rail chrome.\n */\n\n/* ── Line-ref parsing ──────────────────────────────────────────────────────── */\n\n/**\n * Parse a 1-based `lines` ref (`\"3\"` or `\"3-5\"`) into an inclusive `[start,end]`\n * pair, clamped to `[1, lineCount]`. Returns `null` for malformed or fully\n * out-of-range refs so callers can ignore them gracefully. A reversed range\n * (`\"5-3\"`) is normalized; a partially out-of-range range is clamped.\n */\nexport function parseLineRange(\n  ref: string,\n  lineCount: number,\n): { start: number; end: number } | null {\n  const match = /^\\s*(\\d+)\\s*(?:-\\s*(\\d+)\\s*)?$/.exec(ref);\n  if (!match) return null;\n  let start = Number.parseInt(match[1], 10);\n  let end = match[2] != null ? Number.parseInt(match[2], 10) : start;\n  if (!Number.isFinite(start) || !Number.isFinite(end)) return null;\n  if (start > end) [start, end] = [end, start];\n  // Fully outside the file → ignore.\n  if (end < 1 || start > lineCount) return null;\n  return { start: Math.max(1, start), end: Math.min(lineCount, end) };\n}\n\n/** The minimal annotation shape the rail needs (a superset works too). */\nexport interface RailAnnotation {\n  lines: string;\n  label?: string;\n  note: string;\n}\n\nexport interface ResolvedAnnotation<A extends RailAnnotation = RailAnnotation> {\n  /** Index in the original `annotations` array (stable hover key). */\n  index: number;\n  /** 1-based marker number (authoring order). */\n  marker: number;\n  annotation: A;\n  range: { start: number; end: number } | null;\n}\n\n/**\n * Resolve a raw annotation list into stable, marker-numbered records, parsing\n * each `lines` ref against `lineCount`. `lineCountFor` lets the diff block pick a\n * per-annotation line count (before-side vs after-side); annotated-code passes a\n * single constant. Markers are authoring-order, 1-based, and assigned to ALL\n * annotations (even unresolved ones) so numbering is stable regardless of which\n * refs happen to match.\n */\nexport function resolveAnnotations<A extends RailAnnotation>(\n  annotations: A[] | undefined,\n  lineCountFor: (annotation: A) => number,\n): ResolvedAnnotation<A>[] {\n  return (annotations ?? []).map((annotation, index) => ({\n    index,\n    marker: index + 1,\n    annotation,\n    range: parseLineRange(annotation.lines, lineCountFor(annotation)),\n  }));\n}\n\n/** Map a 1-based line number → the resolved annotations covering it. */\nexport function buildLineMarkerMap<A extends RailAnnotation>(\n  resolved: ResolvedAnnotation<A>[],\n): Map<number, ResolvedAnnotation<A>[]> {\n  const map = new Map<number, ResolvedAnnotation<A>[]>();\n  for (const item of resolved) {\n    if (!item.range) continue;\n    for (let n = item.range.start; n <= item.range.end; n += 1) {\n      const list = map.get(n) ?? [];\n      list.push(item);\n      map.set(n, list);\n    }\n  }\n  return map;\n}\n\n/** Human label for a resolved annotation's line span (\"Line 8\" / \"Lines 3–6\"). */\nexport function rangeLabel(item: ResolvedAnnotation): string {\n  if (!item.range) return `Lines ${item.annotation.lines}`;\n  return item.range.start === item.range.end\n    ? `Line ${item.range.start}`\n    : `Lines ${item.range.start}–${item.range.end}`;\n}\n\n/* ── Marker ────────────────────────────────────────────────────────────────── */\n\n/**\n * The numbered amber pip rendered on an annotated code row's gutter. `active`\n * brightens it when its note (or a co-located row) is hovered.\n */\nexport function AnnotationGutterMarker({\n  marker,\n  active,\n  className,\n}: {\n  marker: number;\n  active: boolean;\n  className?: string;\n}) {\n  return (\n    <span\n      aria-hidden\n      className={cn(\n        \"inline-flex size-[15px] shrink-0 items-center justify-center rounded-full text-[9px] font-semibold leading-none tabular-nums transition-colors\",\n        active\n          ? \"bg-amber-500 text-white dark:bg-amber-400 dark:text-amber-950\"\n          : \"bg-amber-400/25 text-amber-700 dark:bg-amber-300/20 dark:text-amber-300\",\n        className,\n      )}\n    >\n      {marker}\n    </span>\n  );\n}\n\n/* ── Note rail ─────────────────────────────────────────────────────────────── */\n\n/**\n * The responsive list of line-anchored note cards. Each card shows its marker\n * pip, the resolved line span (\"Line 8\"), an optional label, and the markdown\n * `note` (via `ctx.renderMarkdown`). Hovering a card sets the active index;\n * `activeIndex` driven from outside lets a hovered code row light its card and\n * vice-versa. Only annotations whose `range` resolved are listed.\n */\nexport function AnnotationNoteRail<A extends RailAnnotation>({\n  items,\n  activeIndex,\n  onActiveChange,\n  ctx,\n  className,\n  showMarker = false,\n}: {\n  items: ResolvedAnnotation<A>[];\n  activeIndex: number | null;\n  onActiveChange: (index: number | null) => void;\n  ctx: BlockRenderContext;\n  className?: string;\n  /** Show a leading numbered pip on each card (diff block). */\n  showMarker?: boolean;\n}) {\n  const sideAnnotations = useMemo(\n    () => items.filter((item) => item.range),\n    [items],\n  );\n  return (\n    <div className={cn(\"flex flex-col gap-2.5\", className)}>\n      {sideAnnotations.map((item) => {\n        const isActive = activeIndex === item.index;\n        return (\n          <div\n            key={item.index}\n            onMouseEnter={() => onActiveChange(item.index)}\n            onMouseLeave={() => onActiveChange(null)}\n            className={cn(\n              \"rounded-lg border px-3.5 py-2.5 transition-colors\",\n              isActive\n                ? \"border-amber-400/70 bg-amber-50 dark:border-amber-300/40 dark:bg-amber-300/[0.08]\"\n                : \"border-plan-line bg-plan-block/40 hover:border-amber-400/50\",\n            )}\n          >\n            <div\n              className={cn(\n                \"flex flex-wrap gap-x-2 gap-y-0.5\",\n                showMarker ? \"items-center\" : \"items-baseline\",\n              )}\n            >\n              {showMarker && (\n                <AnnotationGutterMarker\n                  marker={item.marker}\n                  active={isActive}\n                />\n              )}\n              <span className=\"text-[11px] font-semibold uppercase tracking-wide text-plan-muted\">\n                {rangeLabel(item)}\n              </span>\n              {item.annotation.label && (\n                <span className=\"text-[13px] font-semibold text-plan-text\">\n                  {item.annotation.label}\n                </span>\n              )}\n            </div>\n            <div className=\"plan-annotation-note mt-1 text-[13px] leading-relaxed text-plan-text/85\">\n              {ctx.renderMarkdown ? (\n                ctx.renderMarkdown(item.annotation.note)\n              ) : (\n                <p>{item.annotation.note}</p>\n              )}\n            </div>\n          </div>\n        );\n      })}\n    </div>\n  );\n}\n\n/* ── Inline note (GitHub-style) ─────────────────────────────────────────────── */\n\n/**\n * A single line-anchored note rendered INLINE in the diff flow — full-width,\n * directly under the line it annotates — instead of in a side rail (the\n * GitHub-review affordance). The diff block places one of these after the first\n * row of each annotation's range, so the numbered `①`/`②` row marker and the note\n * read together in one column. It carries the same marker pip, line range,\n * optional label, and markdown `note` as a rail card, and the same two-way hover\n * wiring (`active` / `onActiveChange`) so the row and its note cross-highlight.\n *\n * The outer band is `min-w-full` so the amber wash spans the diff's full scroll\n * width; the content is `sticky left-0` with a readable `max-w` so the note stays\n * pinned and legible while long code lines scroll horizontally beneath it.\n */\nexport function InlineAnnotationNote<A extends RailAnnotation>({\n  item,\n  active,\n  onActiveChange,\n  ctx,\n}: {\n  item: ResolvedAnnotation<A>;\n  active: boolean;\n  onActiveChange: (index: number | null) => void;\n  ctx: BlockRenderContext;\n}) {\n  return (\n    <div\n      onMouseEnter={() => onActiveChange(item.index)}\n      onMouseLeave={() => onActiveChange(null)}\n      className={cn(\n        \"min-w-full border-y transition-colors\",\n        active\n          ? \"border-amber-400/60 bg-amber-100/70 dark:border-amber-300/40 dark:bg-amber-300/[0.12]\"\n          : \"border-amber-400/30 bg-amber-50/70 dark:border-amber-300/20 dark:bg-amber-300/[0.06]\",\n      )}\n    >\n      <div className=\"sticky left-0 flex max-w-[44rem] gap-2.5 whitespace-normal px-3 py-2.5 font-sans\">\n        <AnnotationGutterMarker marker={item.marker} active={active} />\n        <div className=\"min-w-0 flex-1\">\n          <div className=\"flex flex-wrap items-baseline gap-x-2 gap-y-0.5\">\n            <span className=\"text-[11px] font-semibold uppercase tracking-wide text-plan-muted\">\n              {rangeLabel(item)}\n            </span>\n            {item.annotation.label && (\n              <span className=\"text-[13px] font-semibold text-plan-text\">\n                {item.annotation.label}\n              </span>\n            )}\n          </div>\n          <div className=\"plan-annotation-note mt-1 text-[13px] leading-relaxed text-plan-text/85\">\n            {ctx.renderMarkdown ? (\n              ctx.renderMarkdown(item.annotation.note)\n            ) : (\n              <p>{item.annotation.note}</p>\n            )}\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n\n/** Whether a resolved list has at least one note worth rendering a rail for. */\nexport function hasRailAnnotations(items: ResolvedAnnotation[]): boolean {\n  return items.some((item) => item.range);\n}\n\nexport type AnnotationRailChildren = ReactNode;\n"]}
+{"version":3,"file":"annotation-rail.js","sourceRoot":"","sources":["../../../../src/client/blocks/library/annotation-rail.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  useEffect,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n  type ReactNode,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"../../utils.js\";\nimport type { BlockRenderContext } from \"../types.js\";\n\n/**\n * Shared line-anchored annotation UI for the `annotated-code` and `diff` blocks.\n *\n * Both blocks render a numbered code surface plus a side \"rail\" of notes, where\n * each note targets a 1-based `lines` ref (`\"3\"` or `\"3-5\"`) and hovering a code\n * line ↔ its note cross-highlights. This module owns the pure pieces that were\n * identical between them so neither block forks the behavior:\n *\n *  - `parseLineRange` — the forgiving 1-based `lines` range parser.\n *  - `resolveAnnotations` / `buildLineMarkerMap` — turn a raw annotation list\n *    into stable, marker-numbered, range-resolved records and a line→markers map.\n *  - `rangeLabel` — the human \"Line 8\" / \"Lines 3–6\" label.\n *  - `AnnotationGutterMarker` — the numbered amber pip placed on an annotated row\n *    (used by the diff grid; the annotated-code surface uses its own rail bar).\n *  - `AnnotationNoteRail` — the responsive list of note cards with two-way hover.\n *    `showMarker` opts the diff block into a leading numbered pip on each card so\n *    a note can be matched to its `①`/`②` row marker; annotated-code omits it to\n *    keep its original card chrome.\n *\n * `AnnotatedCodeBlock` annotates a single code surface; `DiffBlock` annotates a\n * before/after grid (each annotation also carries a `side`). The shared types\n * here are intentionally minimal — callers pass their own `side` handling and\n * decide which rows a marker lands on; this module only owns the parsing, the\n * resolved-record shape, and the rendered marker + rail chrome.\n */\n\n/* ── Line-ref parsing ──────────────────────────────────────────────────────── */\n\n/**\n * Parse a 1-based `lines` ref (`\"3\"` or `\"3-5\"`) into an inclusive `[start,end]`\n * pair, clamped to `[1, lineCount]`. Returns `null` for malformed or fully\n * out-of-range refs so callers can ignore them gracefully. A reversed range\n * (`\"5-3\"`) is normalized; a partially out-of-range range is clamped.\n */\nexport function parseLineRange(\n  ref: string,\n  lineCount: number,\n): { start: number; end: number } | null {\n  const match = /^\\s*(\\d+)\\s*(?:-\\s*(\\d+)\\s*)?$/.exec(ref);\n  if (!match) return null;\n  let start = Number.parseInt(match[1], 10);\n  let end = match[2] != null ? Number.parseInt(match[2], 10) : start;\n  if (!Number.isFinite(start) || !Number.isFinite(end)) return null;\n  if (start > end) [start, end] = [end, start];\n  // Fully outside the file → ignore.\n  if (end < 1 || start > lineCount) return null;\n  return { start: Math.max(1, start), end: Math.min(lineCount, end) };\n}\n\n/** The minimal annotation shape the rail needs (a superset works too). */\nexport interface RailAnnotation {\n  lines: string;\n  label?: string;\n  note: string;\n}\n\nexport interface ResolvedAnnotation<A extends RailAnnotation = RailAnnotation> {\n  /** Index in the original `annotations` array (stable hover key). */\n  index: number;\n  /** 1-based marker number (authoring order). */\n  marker: number;\n  annotation: A;\n  range: { start: number; end: number } | null;\n}\n\n/**\n * Resolve a raw annotation list into stable, marker-numbered records, parsing\n * each `lines` ref against `lineCount`. `lineCountFor` lets the diff block pick a\n * per-annotation line count (before-side vs after-side); annotated-code passes a\n * single constant. Markers are authoring-order, 1-based, and assigned to ALL\n * annotations (even unresolved ones) so numbering is stable regardless of which\n * refs happen to match.\n */\nexport function resolveAnnotations<A extends RailAnnotation>(\n  annotations: A[] | undefined,\n  lineCountFor: (annotation: A) => number,\n): ResolvedAnnotation<A>[] {\n  return (annotations ?? []).map((annotation, index) => ({\n    index,\n    marker: index + 1,\n    annotation,\n    range: parseLineRange(annotation.lines, lineCountFor(annotation)),\n  }));\n}\n\n/** Map a 1-based line number → the resolved annotations covering it. */\nexport function buildLineMarkerMap<A extends RailAnnotation>(\n  resolved: ResolvedAnnotation<A>[],\n): Map<number, ResolvedAnnotation<A>[]> {\n  const map = new Map<number, ResolvedAnnotation<A>[]>();\n  for (const item of resolved) {\n    if (!item.range) continue;\n    for (let n = item.range.start; n <= item.range.end; n += 1) {\n      const list = map.get(n) ?? [];\n      list.push(item);\n      map.set(n, list);\n    }\n  }\n  return map;\n}\n\n/** Human label for a resolved annotation's line span (\"Line 8\" / \"Lines 3–6\"). */\nexport function rangeLabel(item: ResolvedAnnotation): string {\n  if (!item.range) return `Lines ${item.annotation.lines}`;\n  return item.range.start === item.range.end\n    ? `Line ${item.range.start}`\n    : `Lines ${item.range.start}–${item.range.end}`;\n}\n\n/* ── Marker ────────────────────────────────────────────────────────────────── */\n\n/**\n * The numbered amber pip rendered on an annotated code row's gutter. `active`\n * brightens it when its note (or a co-located row) is hovered.\n */\nexport function AnnotationGutterMarker({\n  marker,\n  active,\n  className,\n}: {\n  marker: number;\n  active: boolean;\n  className?: string;\n}) {\n  return (\n    <span\n      aria-hidden\n      className={cn(\n        \"inline-flex size-[15px] shrink-0 items-center justify-center rounded-full text-[9px] font-semibold leading-none tabular-nums transition-colors\",\n        active\n          ? \"bg-amber-500 text-white dark:bg-amber-400 dark:text-amber-950\"\n          : \"bg-amber-400/25 text-amber-700 dark:bg-amber-300/20 dark:text-amber-300\",\n        className,\n      )}\n    >\n      {marker}\n    </span>\n  );\n}\n\n/* ── Note card ─────────────────────────────────────────────────────────────── */\n\n/**\n * One line-anchored note card: marker pip (when `showMarker`), the resolved line\n * span (\"Line 8\"), an optional label, and the markdown `note` (via\n * `ctx.renderMarkdown`). This is the single source of card markup, rendered both\n * by the visually-hidden a11y/test stack and by the on-hover portal popover.\n */\nexport function AnnotationCard<A extends RailAnnotation>({\n  item,\n  ctx,\n  active = false,\n  showMarker = false,\n  className,\n  onMouseEnter,\n  onMouseLeave,\n}: {\n  item: ResolvedAnnotation<A>;\n  ctx: BlockRenderContext;\n  active?: boolean;\n  showMarker?: boolean;\n  className?: string;\n  onMouseEnter?: () => void;\n  onMouseLeave?: () => void;\n}) {\n  return (\n    <div\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      className={cn(\n        \"rounded-lg border px-3.5 py-2.5 transition-colors\",\n        active\n          ? \"border-amber-400/70 bg-amber-50 dark:border-amber-300/40 dark:bg-amber-300/[0.08]\"\n          : \"border-plan-line bg-plan-block/40 hover:border-amber-400/50\",\n        className,\n      )}\n    >\n      <div\n        className={cn(\n          \"flex flex-wrap gap-x-2 gap-y-0.5\",\n          showMarker ? \"items-center\" : \"items-baseline\",\n        )}\n      >\n        {showMarker && (\n          <AnnotationGutterMarker marker={item.marker} active={active} />\n        )}\n        <span className=\"text-[11px] font-semibold uppercase tracking-wide text-plan-muted\">\n          {rangeLabel(item)}\n        </span>\n        {item.annotation.label && (\n          <span className=\"text-[13px] font-semibold text-plan-text\">\n            {item.annotation.label}\n          </span>\n        )}\n      </div>\n      <div className=\"plan-annotation-note mt-1 text-[13px] leading-relaxed text-plan-text/85\">\n        {ctx.renderMarkdown ? (\n          ctx.renderMarkdown(item.annotation.note)\n        ) : (\n          <p>{item.annotation.note}</p>\n        )}\n      </div>\n    </div>\n  );\n}\n\n/**\n * Visually-hidden stack of every resolved note. It is NOT a visible column — it\n * sits in the flow but clipped to a 1px box (the `sr-only` pattern) so the note\n * text and the per-card marker pips stay in the accessibility tree and in the\n * DOM (assistive tech can reach them, and tests that read `textContent`/count\n * pips still see them) WITHOUT painting a persistent rail beside the code. The\n * visible card appears only on hover via {@link AnnotationHoverCard}.\n */\nexport function AnnotationHiddenStack<A extends RailAnnotation>({\n  items,\n  ctx,\n  showMarker = false,\n}: {\n  items: ResolvedAnnotation<A>[];\n  ctx: BlockRenderContext;\n  showMarker?: boolean;\n}) {\n  const resolved = useMemo(() => items.filter((item) => item.range), [items]);\n  if (resolved.length === 0) return null;\n  return (\n    <div\n      className=\"absolute size-px overflow-hidden whitespace-nowrap border-0 p-0 [clip:rect(0,0,0,0)] [clip-path:inset(50%)]\"\n      data-annotation-hidden-stack\n    >\n      {resolved.map((item) => (\n        <AnnotationCard\n          key={item.index}\n          item={item}\n          ctx={ctx}\n          showMarker={showMarker}\n        />\n      ))}\n    </div>\n  );\n}\n\n/* ── Hover popover (portal, anchored RIGHT of the code) ────────────────────── */\n\n/** The geometry the hover card anchors to (in viewport coordinates). */\nexport interface AnnotationAnchor {\n  /** Right edge of the code block (where the card should start). */\n  codeRight: number;\n  /** Left edge of the code block (for the below-fallback alignment). */\n  codeLeft: number;\n  /** Vertical center of the hovered line. */\n  lineCenter: number;\n  /** Bottom of the hovered line (for the below-fallback placement). */\n  lineBottom: number;\n}\n\nconst HOVER_CARD_WIDTH = 280;\nconst HOVER_CARD_GAP = 12;\nconst VIEWPORT_MARGIN = 8;\n\n/**\n * The single on-hover note card, portaled to `document.body` and positioned\n * `fixed` so it escapes the code block's `overflow` and never reflows the code.\n *\n * Placement: by default it sits to the RIGHT of the code block's right edge,\n * vertically centered on the hovered line — so it never overlaps the code text.\n * If there isn't room to the right (it would overflow the viewport), it clamps\n * within the viewport, and if the right gutter is too narrow for the card it\n * falls back to BELOW the hovered line (left-aligned to the code block). The card\n * keeps itself open while hovered (`onMouseEnter`/`onMouseLeave` forwarded) so it\n * stays readable; the caller adds the small hover-intent close delay.\n */\nexport function AnnotationHoverCard<A extends RailAnnotation>({\n  item,\n  anchor,\n  ctx,\n  showMarker = false,\n  onMouseEnter,\n  onMouseLeave,\n}: {\n  item: ResolvedAnnotation<A>;\n  anchor: AnnotationAnchor;\n  ctx: BlockRenderContext;\n  showMarker?: boolean;\n  onMouseEnter?: () => void;\n  onMouseLeave?: () => void;\n}) {\n  const cardRef = useRef<HTMLDivElement | null>(null);\n  const [pos, setPos] = useState<{ top: number; left: number } | null>(null);\n\n  // Measure the rendered card, then resolve a non-overlapping position: right of\n  // the code if it fits, else clamp into the viewport, else drop below the line.\n  useLayoutEffect(() => {\n    if (typeof window === \"undefined\") return;\n    const el = cardRef.current;\n    const rect = el?.getBoundingClientRect();\n    const width = rect && rect.width > 0 ? rect.width : HOVER_CARD_WIDTH;\n    const height = rect && rect.height > 0 ? rect.height : 0;\n    const vw = window.innerWidth || 0;\n    const vh = window.innerHeight || 0;\n\n    const rightLeft = anchor.codeRight + HOVER_CARD_GAP;\n    const fitsRight = rightLeft + width + VIEWPORT_MARGIN <= vw;\n\n    let left: number;\n    let top: number;\n    if (fitsRight) {\n      // Default: to the right of the code, centered on the hovered line.\n      left = rightLeft;\n      top = anchor.lineCenter - height / 2;\n    } else {\n      // No room to the right → drop below the line, aligned to the code's left.\n      left = anchor.codeLeft;\n      top = anchor.lineBottom + HOVER_CARD_GAP;\n    }\n    // Clamp within the viewport so the card is never cut off.\n    left = Math.max(\n      VIEWPORT_MARGIN,\n      Math.min(left, vw - width - VIEWPORT_MARGIN),\n    );\n    top = Math.max(\n      VIEWPORT_MARGIN,\n      Math.min(top, vh - height - VIEWPORT_MARGIN),\n    );\n    setPos({ top, left });\n  }, [\n    anchor.codeRight,\n    anchor.codeLeft,\n    anchor.lineCenter,\n    anchor.lineBottom,\n    item.index,\n  ]);\n\n  if (typeof document === \"undefined\") return null;\n\n  return createPortal(\n    <div\n      ref={cardRef}\n      role=\"tooltip\"\n      data-annotation-hover-card\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      className=\"pointer-events-auto fixed z-50\"\n      style={{\n        top: pos?.top ?? anchor.lineCenter,\n        left: pos?.left ?? anchor.codeRight + HOVER_CARD_GAP,\n        width: HOVER_CARD_WIDTH,\n        // Hide until measured to avoid a one-frame jump from the fallback spot.\n        visibility: pos ? \"visible\" : \"hidden\",\n      }}\n    >\n      <AnnotationCard\n        item={item}\n        ctx={ctx}\n        active\n        showMarker={showMarker}\n        className=\"shadow-lg shadow-black/10 dark:shadow-black/40\"\n      />\n    </div>,\n    document.body,\n  );\n}\n\n/**\n * Hover-intent controller for the on-hover note card. Exposes `activeIndex` +\n * the captured `anchor`, plus `open`/`scheduleClose`/`cancelClose` handlers.\n *\n *  - `open(index, anchor)` shows a card immediately (cancels any pending close).\n *  - `scheduleClose()` hides after a short delay, so moving the pointer from the\n *    code line across the gap into the card itself keeps it open.\n *  - `cancelClose()` (call on card mouse-enter) keeps it open while reading.\n */\nexport function useAnnotationHover(delay = 130) {\n  const [active, setActive] = useState<{\n    index: number;\n    anchor: AnnotationAnchor;\n  } | null>(null);\n  const timer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  const cancelClose = () => {\n    if (timer.current) {\n      clearTimeout(timer.current);\n      timer.current = null;\n    }\n  };\n  const open = (index: number, anchor: AnnotationAnchor) => {\n    cancelClose();\n    setActive({ index, anchor });\n  };\n  const scheduleClose = () => {\n    cancelClose();\n    timer.current = setTimeout(() => setActive(null), delay);\n  };\n\n  useEffect(() => () => cancelClose(), []);\n\n  return {\n    activeIndex: active?.index ?? null,\n    anchor: active?.anchor ?? null,\n    open,\n    scheduleClose,\n    cancelClose,\n  } as const;\n}\n\n/**\n * Build an {@link AnnotationAnchor} from the code block element and the hovered\n * row element. The card anchors to the code block's RIGHT edge and the row's\n * vertical center, both in viewport coordinates (so a `fixed` portal lines up).\n */\nexport function anchorFromElements(\n  codeEl: HTMLElement | null,\n  rowEl: HTMLElement | null,\n): AnnotationAnchor | null {\n  if (!codeEl || !rowEl) return null;\n  const code = codeEl.getBoundingClientRect();\n  const row = rowEl.getBoundingClientRect();\n  return {\n    codeRight: code.right,\n    codeLeft: code.left,\n    lineCenter: row.top + row.height / 2,\n    lineBottom: row.bottom,\n  };\n}\n\n/**\n * The responsive list of line-anchored note cards. Each card shows its marker\n * pip, the resolved line span (\"Line 8\"), an optional label, and the markdown\n * `note` (via `ctx.renderMarkdown`). Hovering a card sets the active index;\n * `activeIndex` driven from outside lets a hovered code row light its card and\n * vice-versa. Only annotations whose `range` resolved are listed.\n *\n * @deprecated Superseded by the on-hover {@link AnnotationHoverCard}; kept for\n * back-compat with any external importer. Both block read renderers now use the\n * hover popover anchored to the right of the code instead of a persistent rail.\n */\nexport function AnnotationNoteRail<A extends RailAnnotation>({\n  items,\n  activeIndex,\n  onActiveChange,\n  ctx,\n  className,\n  showMarker = false,\n}: {\n  items: ResolvedAnnotation<A>[];\n  activeIndex: number | null;\n  onActiveChange: (index: number | null) => void;\n  ctx: BlockRenderContext;\n  className?: string;\n  /** Show a leading numbered pip on each card (diff block). */\n  showMarker?: boolean;\n}) {\n  const sideAnnotations = useMemo(\n    () => items.filter((item) => item.range),\n    [items],\n  );\n  return (\n    <div className={cn(\"flex flex-col gap-2.5\", className)}>\n      {sideAnnotations.map((item) => (\n        <AnnotationCard\n          key={item.index}\n          item={item}\n          ctx={ctx}\n          active={activeIndex === item.index}\n          showMarker={showMarker}\n          onMouseEnter={() => onActiveChange(item.index)}\n          onMouseLeave={() => onActiveChange(null)}\n        />\n      ))}\n    </div>\n  );\n}\n\n/** Whether a resolved list has at least one note worth rendering a rail for. */\nexport function hasRailAnnotations(items: ResolvedAnnotation[]): boolean {\n  return items.some((item) => item.range);\n}\n\nexport type AnnotationRailChildren = ReactNode;\n"]}

package/dist/client/blocks/library/code-tabs.js

@@ -190,7 +190,7 @@ function HighlightedCodeTextarea({ value, language, label, editable, onChange, }
         layer.scrollTop = event.currentTarget.scrollTop;
         layer.scrollLeft = event.currentTarget.scrollLeft;
     };
-    return (_jsxs("div", { className: cn("relative min-h-[140px] overflow-hidden rounded-md border border-input bg-background text-foreground focus-within:ring-1 focus-within:ring-ring", !editable && "cursor-not-allowed opacity-50"), "data-code-tabs-highlighted-editor": true, children: [_jsx("pre", { ref: highlightLayerRef, "aria-hidden": "true", className: "pointer-events-none absolute inset-0 m-0 overflow-hidden whitespace-pre px-3 py-2 font-mono text-xs leading-5", "data-code-tabs-highlight-layer": true, children: _jsxs("code", { children: [highlighted, value.endsWith("\n") ? " " : null] }) }), _jsx("textarea", { "data-plan-interactive": true, spellCheck: false, wrap: "off", className: cn("relative z-10 block min-h-[140px] w-full resize-y overflow-auto rounded-md border-0 bg-transparent px-3 py-2 font-mono text-xs leading-5 caret-foreground outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed", value ? "text-transparent" : "text-muted-foreground"), value: value, disabled: !editable, onChange: onChange, onScroll: syncScroll })] }));
+    return (_jsxs("div", { className: cn("relative min-h-[140px] overflow-hidden rounded-md border border-input bg-background text-foreground focus-within:ring-1 focus-within:ring-ring", !editable && "cursor-not-allowed opacity-50"), "data-code-tabs-highlighted-editor": true, children: [_jsx("pre", { ref: highlightLayerRef, "aria-hidden": "true", className: "pointer-events-none absolute inset-0 m-0 overflow-hidden whitespace-pre px-3 py-2 font-mono [font-size:var(--plan-code-size)] leading-5", "data-code-tabs-highlight-layer": true, children: _jsxs("code", { children: [highlighted, value.endsWith("\n") ? " " : null] }) }), _jsx("textarea", { "data-plan-interactive": true, spellCheck: false, wrap: "off", className: cn("relative z-10 block min-h-[140px] w-full resize-y overflow-auto rounded-md border-0 bg-transparent px-3 py-2 font-mono [font-size:var(--plan-code-size)] leading-5 caret-foreground outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed", value ? "text-transparent" : "text-muted-foreground"), value: value, disabled: !editable, onChange: onChange, onScroll: syncScroll })] }));
 }
 /**
  * Editor: a file-tab strip (one tab active at a time) with the active tab's code