Function flattenHighlightedLine

src/ui/diff/pierre.ts:378–439

Flatten one highlighted HAST line into terminal-friendly styled text spans.

(node: HastNode | undefined, theme: AppTheme, emphasisBg: string)

/** Flatten one highlighted HAST line into terminal-friendly styled text spans. */
function flattenHighlightedLine(node: HastNode | undefined, theme: AppTheme, emphasisBg: string) {
  if (!node) {
    return [];
  }

  const cacheKey = `${themeRenderCacheKey(theme)}:${emphasisBg}`;
  const cachedByTheme = flattenedHighlightedLineCache.get(node);
  const cached = cachedByTheme?.get(cacheKey);
  if (cached) {
    return cached;
  }

  // Cache hits here are what make revisiting/remounting already-highlighted files cheap:
  // we skip the full recursive walk and return the already-flattened terminal spans.

  const spans: RenderSpan[] = [];
  const colorVariable = theme.appearance === "light" ? "--diffs-token-light" : "--diffs-token-dark";

  const visit = (current: HastNode | undefined, inherited: Pick<RenderSpan, "fg" | "bg">) => {
    if (!current) {
      return;
    }

    if (current.type === "text") {
      // Pierre injects a "\n" placeholder into empty line nodes so they aren't childless.
      // Strip it the same way cleanDiffLine does for the unhighlighted path, or the literal
      // newline ends up in the span text and breaks terminal row rendering.
      mergeSpan(spans, {
        text: tabify(cleanLastNewline(current.value)),
        fg: inherited.fg,
        bg: inherited.bg,
      });
      return;
    }

    const properties = current.properties ?? {};
    const styles = parseStyleValue(properties.style);
    const nextStyle: Pick<RenderSpan, "fg" | "bg"> = {
      // Newer Pierre output can emit direct `color:#...` styles instead of theme CSS variables.
      fg: normalizeHighlightedColor(
        styles.get(colorVariable) ?? styles.get("color") ?? inherited.fg,
        theme,
      ),
      // Pierre marks inline word-diff emphasis spans with a data attribute rather than a separate row kind.
      bg: Object.hasOwn(properties, "data-diff-span") ? emphasisBg : inherited.bg,
    };

    for (const child of current.children ?? []) {
      visit(child, nextStyle);
    }
  };

  visit(node, {});

  const nextCachedByTheme = cachedByTheme ?? new Map<string, RenderSpan[]>();
  nextCachedByTheme.set(cacheKey, spans);
  if (!cachedByTheme) {
    flattenedHighlightedLineCache.set(node, nextCachedByTheme);