@aurigax-ai/ghostty-web 0.1.0 → 0.3.0

package/lib/ghostty.ts

@@ -6,7 +6,14 @@
  * grid references and key encoder through `Abi`.
  */
 
-import { Abi, GHOSTTY_SUCCESS, type VtExports } from './abi';
+import {
+  Abi,
+  GHOSTTY_NO_VALUE,
+  GHOSTTY_OUT_OF_SPACE,
+  GHOSTTY_SUCCESS,
+  GhosttyCallError,
+  type VtExports,
+} from './abi';
 import { EventEmitter } from './event-emitter';
 import type { IEvent } from './interfaces';
 import {
@@ -232,8 +239,136 @@ function rgbAt(view: DataView, ptr: number): RGB {
   return { r: view.getUint8(ptr), g: view.getUint8(ptr + 1), b: view.getUint8(ptr + 2) };
 }
 
-function bitsOf(raw: bigint, field: { lsb: number; width: number }): number {
-  return Number((raw >> BigInt(field.lsb)) & ((1n << BigInt(field.width)) - 1n));
+interface CellLayout {
+  styleSize: number;
+  fgColor: number;
+  bgColor: number;
+  bold: number;
+  italic: number;
+  faint: number;
+  blink: number;
+  inverse: number;
+  invisible: number;
+  strikethrough: number;
+  underline: number;
+  colorTag: number;
+  colorValue: number;
+  colorPalette: number;
+  colorRgb: number;
+  tagCodepoint: number;
+  tagGrapheme: number;
+  tagBgPalette: number;
+  tagBgRgb: number;
+  wideWide: number;
+  wideSpacerTail: number;
+  rowIteratorData: number;
+  rowDirtyData: number;
+  rowCellsData: number;
+  rowIteratorNext: (iterator: number) => number;
+  rowGet: (iterator: number, key: number, out: number) => number;
+  rowCellsNext: (cells: number) => number;
+  rowCellsGetMulti: (
+    cells: number,
+    count: number,
+    keys: number,
+    values: number,
+    written: number
+  ) => number;
+}
+
+const EXPECTED_CELL_BITS: Record<string, [number, number]> = {
+  content_tag: [0, 2],
+  content: [2, 24],
+  style_id: [26, 16],
+  wide: [42, 2],
+  hyperlink: [45, 1],
+};
+
+const cellLayouts = new WeakMap<Abi, CellLayout>();
+
+function cellLayout(abi: Abi): CellLayout {
+  const cached = cellLayouts.get(abi);
+  if (cached) return cached;
+  for (const [field, [lsb, width]] of Object.entries(EXPECTED_CELL_BITS)) {
+    const bits = abi.bits('GhosttyCell', field);
+    if (bits.lsb !== lsb || bits.width !== width) {
+      throw new Error(`libghostty-vt GhosttyCell.${field} moved to ${bits.lsb}+${bits.width}`);
+    }
+  }
+  const style = (f: string) => abi.offset('GhosttyStyle', f);
+  const tags = 'GhosttyCellContentTag';
+  const fn = <T>(name: string) => abi.fn(name) as unknown as T;
+  const layout: CellLayout = {
+    styleSize: abi.sizeOf('GhosttyStyle'),
+    fgColor: style('fg_color'),
+    bgColor: style('bg_color'),
+    bold: style('bold'),
+    italic: style('italic'),
+    faint: style('faint'),
+    blink: style('blink'),
+    inverse: style('inverse'),
+    invisible: style('invisible'),
+    strikethrough: style('strikethrough'),
+    underline: style('underline'),
+    colorTag: abi.offset('GhosttyStyleColor', 'tag'),
+    colorValue: abi.offset('GhosttyStyleColor', 'value'),
+    colorPalette: abi.enumValue('GhosttyStyleColorTag', 'PALETTE'),
+    colorRgb: abi.enumValue('GhosttyStyleColorTag', 'RGB'),
+    tagCodepoint: abi.enumValue(tags, 'CODEPOINT'),
+    tagGrapheme: abi.enumValue(tags, 'CODEPOINT_GRAPHEME'),
+    tagBgPalette: abi.enumValue(tags, 'BG_COLOR_PALETTE'),
+    tagBgRgb: abi.enumValue(tags, 'BG_COLOR_RGB'),
+    wideWide: abi.enumValue('GhosttyCellWide', 'WIDE'),
+    wideSpacerTail: abi.enumValue('GhosttyCellWide', 'SPACER_TAIL'),
+    rowIteratorData: abi.enumValue('GhosttyRenderStateData', 'ROW_ITERATOR'),
+    rowDirtyData: abi.enumValue('GhosttyRenderStateRowData', 'DIRTY'),
+    rowCellsData: abi.enumValue('GhosttyRenderStateRowData', 'CELLS'),
+    rowIteratorNext: fn('ghostty_render_state_row_iterator_next'),
+    rowGet: fn('ghostty_render_state_row_get'),
+    rowCellsNext: fn('ghostty_render_state_row_cells_next'),
+    rowCellsGetMulti: fn('ghostty_render_state_row_cells_get_multi'),
+  };
+  cellLayouts.set(abi, layout);
+  return layout;
+}
+
+interface ExtractScratch {
+  base: number;
+  size: number;
+  slot: number;
+  flag: number;
+  keys: number;
+  values: number;
+  raw: number;
+  len: number;
+  style: number;
+  written: number;
+}
+
+function allocScratch(abi: Abi, layout: CellLayout): ExtractScratch {
+  const size = 8 + 8 + 12 + 12 + 8 + 8 + layout.styleSize + 8;
+  const base = abi.alloc(size);
+  const scratch: ExtractScratch = {
+    base,
+    size,
+    slot: base,
+    flag: base + 8,
+    keys: base + 16,
+    values: base + 28,
+    raw: base + 40,
+    len: base + 48,
+    style: base + 56,
+    written: base + 56 + layout.styleSize,
+  };
+  const view = abi.view();
+  const cells = 'GhosttyRenderStateRowCellsData';
+  view.setInt32(scratch.keys, abi.enumValue(cells, 'RAW'), true);
+  view.setInt32(scratch.keys + 4, abi.enumValue(cells, 'GRAPHEMES_LEN'), true);
+  view.setInt32(scratch.keys + 8, abi.enumValue(cells, 'STYLE'), true);
+  view.setUint32(scratch.values, scratch.raw, true);
+  view.setUint32(scratch.values + 4, scratch.len, true);
+  view.setUint32(scratch.values + 8, scratch.style, true);
+  return scratch;
 }
 
 /**
@@ -244,6 +379,176 @@ function bitsOf(raw: bigint, field: { lsb: number; width: number }): number {
  * Scrollback, graphemes, hyperlinks and wrap flags are read through grid
  * references on demand.
  */
+/** A match in screen coordinates: columns, and rows counted from the top of the scrollback. */
+export interface SearchMatch {
+  startX: number;
+  startY: number;
+  endX: number;
+  endY: number;
+}
+
+/**
+ * A search of one terminal's screen and scrollback with libghostty-vt's
+ * search: case-insensitive for ASCII letters, kept in sync with the terminal
+ * by `run()` after writes. It never scrolls; the caller shows the selected
+ * match. "Next" moves toward older output (up), as in Ghostty.
+ */
+export class TerminalSearch {
+  private handle: number;
+
+  constructor(
+    private readonly abi: Abi,
+    private readonly terminal: number
+  ) {
+    this.handle = abi.newHandle('ghostty_search_new', (slot) =>
+      abi.call('ghostty_search_new', 0, slot, terminal)
+    );
+    abi.with(4, (ptr) => {
+      abi.view().setInt32(ptr, abi.enumValue('GhosttySearchScroll', 'NONE'), true);
+      abi.check('ghostty_search_set', this.handle, this.option('SELECT_SCROLL'), ptr);
+    });
+  }
+
+  private option(name: string): number {
+    return this.abi.enumValue('GhosttySearchOption', name);
+  }
+
+  private data(name: string): number {
+    return this.abi.enumValue('GhosttySearchData', name);
+  }
+
+  /** Starts a search for `text`, or stops searching when it is empty. */
+  setNeedle(text: string): void {
+    const abi = this.abi;
+    if (!text) {
+      abi.check('ghostty_search_set', this.handle, this.option('NEEDLE'), 0);
+      return;
+    }
+    const bytes = new TextEncoder().encode(text);
+    abi.withBytes(bytes, (ptr, len) =>
+      abi.with(abi.sizeOf('GhosttyString'), (str) => {
+        const view = abi.view();
+        view.setUint32(str + abi.offset('GhosttyString', 'ptr'), ptr, true);
+        view.setUint32(str + abi.offset('GhosttyString', 'len'), len, true);
+        abi.check('ghostty_search_set', this.handle, this.option('NEEDLE'), str);
+      })
+    );
+  }
+
+  /** Catches up with everything written to the terminal since the last run. */
+  run(): void {
+    this.abi.check('ghostty_search_run', this.handle);
+  }
+
+  /** Selects the next older (`older`) or newer match, wrapping; false when there are none. */
+  select(older: boolean): boolean {
+    const result = this.abi.call(
+      'ghostty_search_set',
+      this.handle,
+      this.option(older ? 'SELECT_NEXT' : 'SELECT_PREV'),
+      0
+    );
+    if (result === GHOSTTY_NO_VALUE) return false;
+    if (result !== GHOSTTY_SUCCESS) throw new GhosttyCallError('ghostty_search_set', result);
+    return true;
+  }
+
+  total(): number {
+    return this.readU32('TOTAL_MATCHES') ?? 0;
+  }
+
+  /** Index of the selected match, newest first (0 is the newest), or null. */
+  selectedIndex(): number | null {
+    return this.readU32('SELECTED_INDEX');
+  }
+
+  private readU32(name: string): number | null {
+    const abi = this.abi;
+    return abi.with(8, (ptr) => {
+      const result = abi.call('ghostty_search_get', this.handle, this.data(name), ptr);
+      if (result === GHOSTTY_NO_VALUE) return null;
+      if (result !== GHOSTTY_SUCCESS) throw new GhosttyCallError('ghostty_search_get', result);
+      return abi.view().getUint32(ptr, true);
+    });
+  }
+
+  selected(): SearchMatch | null {
+    const abi = this.abi;
+    return abi.withSized('GhosttySelection', (sel) => {
+      const result = abi.call('ghostty_search_get', this.handle, this.data('SELECTED_MATCH'), sel);
+      if (result === GHOSTTY_NO_VALUE) return null;
+      if (result !== GHOSTTY_SUCCESS) throw new GhosttyCallError('ghostty_search_get', result);
+      return this.toMatch(sel);
+    });
+  }
+
+  /** Every match, newest first, read right after `run()` and before the next write. */
+  matches(): SearchMatch[] {
+    const abi = this.abi;
+    const selSize = abi.sizeOf('GhosttySelection');
+    const bufSize = abi.sizeOf('GhosttySelectionBuffer');
+    const at = (buf: number, field: string) => buf + abi.offset('GhosttySelectionBuffer', field);
+    return abi.with(bufSize, (buf) => {
+      const query = abi.call('ghostty_search_get', this.handle, this.data('MATCHES'), buf);
+      if (query === GHOSTTY_SUCCESS) return [];
+      if (query !== GHOSTTY_OUT_OF_SPACE) {
+        if (query === GHOSTTY_NO_VALUE) return [];
+        throw new GhosttyCallError('ghostty_search_get', query);
+      }
+      const count = abi.view().getUint32(at(buf, 'len'), true);
+      return abi.with(count * selSize, (items) => {
+        for (let i = 0; i < count; i++) {
+          abi.view().setUint32(items + i * selSize, selSize, true);
+        }
+        const view = abi.view();
+        view.setUint32(at(buf, 'ptr'), items, true);
+        view.setUint32(at(buf, 'cap'), count, true);
+        abi.check('ghostty_search_get', this.handle, this.data('MATCHES'), buf);
+        const len = abi.view().getUint32(at(buf, 'len'), true);
+        const out: SearchMatch[] = [];
+        for (let i = 0; i < len; i++) {
+          const match = this.toMatch(items + i * selSize);
+          if (match) out.push(match);
+        }
+        return out;
+      });
+    });
+  }
+
+  private toMatch(sel: number): SearchMatch | null {
+    const abi = this.abi;
+    const start = this.screenPoint(sel + abi.offset('GhosttySelection', 'start'));
+    const end = this.screenPoint(sel + abi.offset('GhosttySelection', 'end'));
+    if (!start || !end) return null;
+    return { startX: start.x, startY: start.y, endX: end.x, endY: end.y };
+  }
+
+  private screenPoint(ref: number): { x: number; y: number } | null {
+    const abi = this.abi;
+    return abi.with(abi.sizeOf('GhosttyPointCoordinate'), (out) => {
+      const result = abi.call(
+        'ghostty_terminal_point_from_grid_ref',
+        this.terminal,
+        ref,
+        abi.enumValue('GhosttyPointTag', 'SCREEN'),
+        out
+      );
+      if (result !== GHOSTTY_SUCCESS) return null;
+      const view = abi.view();
+      return {
+        x: view.getUint16(out + abi.offset('GhosttyPointCoordinate', 'x'), true),
+        y: view.getUint32(out + abi.offset('GhosttyPointCoordinate', 'y'), true),
+      };
+    });
+  }
+
+  free(): void {
+    if (!this.handle) return;
+    this.abi.call('ghostty_search_free', this.handle);
+    this.handle = 0;
+  }
+}
+
 export class GhosttyTerminal {
   private handle: number;
   private renderState: number;
@@ -252,6 +557,8 @@ export class GhosttyTerminal {
   private _cols: number;
   private _rows: number;
 
+  private readonly layout: CellLayout;
+  private readonly scratch: ExtractScratch;
   private cellPool: GhosttyCell[] = [];
   private rowDirty: boolean[] = [];
   private dirty: DirtyState = DirtyState.FULL;
@@ -298,6 +605,8 @@ export class GhosttyTerminal {
   ) {
     this._cols = cols;
     this._rows = rows;
+    this.layout = cellLayout(abi);
+    this.scratch = allocScratch(abi, this.layout);
     this.handle = abi.newHandle('ghostty_terminal_new', (slot) =>
       abi.call('ghostty_terminal_new', 0, slot, cols, rows)
     );
@@ -317,7 +626,7 @@ export class GhosttyTerminal {
     this.setOption('WRITE_PTY', writePty);
     this.installHooks();
     this.setModeDefault(GRAPHEME_CLUSTER_MODE, true);
-    if (config) this.applyConfig(config);
+    if (config) this.configure(config);
     this.initCellPool();
   }
 
@@ -328,6 +637,11 @@ export class GhosttyTerminal {
     return this._rows;
   }
 
+  /** A new search of this terminal; free it before or after the terminal. */
+  createSearch(): TerminalSearch {
+    return new TerminalSearch(this.abi, this.handle);
+  }
+
   /** The raw libghostty-vt terminal handle, for APIs this class does not wrap yet. */
   get rawHandle(): number {
     return this.handle;
@@ -366,6 +680,7 @@ export class GhosttyTerminal {
     abi.call('ghostty_render_state_row_cells_free', this.rowCells);
     abi.call('ghostty_render_state_row_iterator_free', this.rowIterator);
     abi.call('ghostty_render_state_free', this.renderState);
+    abi.free(this.scratch.base, this.scratch.size);
     abi.call('ghostty_terminal_free', this.handle);
     for (const index of this.callbacks) abi.removeCallback(index);
     this.callbacks = [];
@@ -678,7 +993,11 @@ export class GhosttyTerminal {
   // Private helpers
   // ==========================================================================
 
-  private applyConfig(config: GhosttyTerminalConfig): void {
+  /**
+   * Applies scrollback and color settings. Colors take effect on the whole
+   * screen at the next update; programs can still change them (OSC 4/10/11).
+   */
+  configure(config: GhosttyTerminalConfig): void {
     const abi = this.abi;
     if (config.scrollbackLimit !== undefined) {
       abi.with(4, (ptr) => {
@@ -687,7 +1006,7 @@ export class GhosttyTerminal {
       });
     }
     const setRgb = (option: string, color: number | undefined) => {
-      if (!color) return;
+      if (color === undefined) return;
       abi.with(4, (ptr) => {
         const view = abi.view();
         view.setUint8(ptr, (color >> 16) & 0xff);
@@ -699,7 +1018,7 @@ export class GhosttyTerminal {
     setRgb('COLOR_FOREGROUND', config.fgColor);
     setRgb('COLOR_BACKGROUND', config.bgColor);
     setRgb('COLOR_CURSOR', config.cursorColor);
-    if (config.palette?.some((c) => c)) {
+    if (config.palette?.some((c) => c !== undefined)) {
       const size = 256 * 3;
       abi.with(size, (ptr) => {
         abi.check(
@@ -710,7 +1029,7 @@ export class GhosttyTerminal {
         );
         const view = abi.view();
         config.palette!.slice(0, 16).forEach((color, i) => {
-          if (!color) return;
+          if (color === undefined) return;
           view.setUint8(ptr + i * 3, (color >> 16) & 0xff);
           view.setUint8(ptr + i * 3 + 1, (color >> 8) & 0xff);
           view.setUint8(ptr + i * 3 + 2, color & 0xff);
@@ -718,6 +1037,8 @@ export class GhosttyTerminal {
         this.setOption('COLOR_PALETTE', ptr);
       });
     }
+    this.changed = true;
+    this.dirty = DirtyState.FULL;
   }
 
   private installHooks(): void {
@@ -895,117 +1216,150 @@ export class GhosttyTerminal {
         palette,
       };
     });
+    this.readTerminalColors();
   }
 
-  private extractRows(all: boolean): void {
+  /**
+   * The render state does not pick up default colors set with
+   * ghostty_terminal_set, so the effective colors (a program's OSC override,
+   * else the default) are read from the terminal itself.
+   */
+  private readTerminalColors(): void {
     const abi = this.abi;
-    const rowData = 'GhosttyRenderStateRowData';
-    abi.with(8, (slot) => {
-      const view = abi.view();
-      view.setUint32(slot, this.rowIterator, true);
-      abi.check(
-        'ghostty_render_state_get',
-        this.renderState,
-        abi.enumValue('GhosttyRenderStateData', 'ROW_ITERATOR'),
-        slot
+    const data = (name: string) => abi.enumValue('GhosttyTerminalData', name);
+    const rgb = (name: string): RGB | null =>
+      abi.with(4, (ptr) =>
+        abi.call('ghostty_terminal_get', this.handle, data(name), ptr) === GHOSTTY_SUCCESS
+          ? rgbAt(abi.view(), ptr)
+          : null
       );
-      abi.view().setUint32(slot, this.rowCells, true);
-      let y = 0;
-      while (
-        y < this._rows &&
-        abi.call('ghostty_render_state_row_iterator_next', this.rowIterator)
+    this.colors.background = rgb('COLOR_BACKGROUND') ?? this.colors.background;
+    this.colors.foreground = rgb('COLOR_FOREGROUND') ?? this.colors.foreground;
+    this.colors.cursor = rgb('COLOR_CURSOR') ?? this.colors.cursor;
+    abi.with(256 * 3, (ptr) => {
+      if (
+        abi.call('ghostty_terminal_get', this.handle, data('COLOR_PALETTE'), ptr) !==
+        GHOSTTY_SUCCESS
       ) {
-        const rowDirty = abi.with(4, (out) => {
-          abi.check(
-            'ghostty_render_state_row_get',
-            this.rowIterator,
-            abi.enumValue(rowData, 'DIRTY'),
-            out
-          );
-          return abi.view().getUint8(out) !== 0;
-        });
-        if (all || rowDirty) {
-          this.rowDirty[y] = true;
-          abi.check(
-            'ghostty_render_state_row_get',
-            this.rowIterator,
-            abi.enumValue(rowData, 'CELLS'),
-            slot
-          );
-          this.extractCells(y);
-        }
-        y++;
+        return;
       }
+      const view = abi.view();
+      for (let i = 0; i < 256; i++) this.colors.palette[i] = rgbAt(view, ptr + i * 3);
     });
   }
 
+  private extractRows(all: boolean): void {
+    const abi = this.abi;
+    const layout = this.layout;
+    const rowGet = layout.rowGet;
+    const iteratorNext = layout.rowIteratorNext;
+    const scratch = this.scratch;
+    const view = abi.view();
+    view.setUint32(scratch.slot, this.rowIterator, true);
+    abi.check('ghostty_render_state_get', this.renderState, layout.rowIteratorData, scratch.slot);
+    let y = 0;
+    while (y < this._rows && iteratorNext(this.rowIterator)) {
+      const v = abi.view();
+      v.setUint32(scratch.slot, this.rowCells, true);
+      let rowDirty = all;
+      if (!rowDirty) {
+        rowGet(this.rowIterator, layout.rowDirtyData, scratch.flag);
+        rowDirty = abi.view().getUint8(scratch.flag) !== 0;
+      }
+      if (rowDirty) {
+        this.rowDirty[y] = true;
+        const result = rowGet(this.rowIterator, layout.rowCellsData, scratch.slot);
+        if (result !== GHOSTTY_SUCCESS)
+          throw new GhosttyCallError('ghostty_render_state_row_get', result);
+        this.extractCells(y);
+      }
+      y++;
+    }
+  }
+
   private extractCells(y: number): void {
     const abi = this.abi;
-    const cellsData = 'GhosttyRenderStateRowCellsData';
-    const styleSize = abi.sizeOf('GhosttyStyle');
-    const keyRaw = abi.enumValue(cellsData, 'RAW');
-    const keyLen = abi.enumValue(cellsData, 'GRAPHEMES_LEN');
-    const keyStyle = abi.enumValue(cellsData, 'STYLE');
-    const block = 3 * 4 + 3 * 4 + 8 + 8 + styleSize + 8;
-    abi.with(block, (base) => {
-      const keys = base;
-      const values = base + 12;
-      const raw = base + 24;
-      const len = base + 32;
-      const style = base + 40;
-      const written = style + styleSize;
-      const view = abi.view();
-      view.setInt32(keys, keyRaw, true);
-      view.setInt32(keys + 4, keyLen, true);
-      view.setInt32(keys + 8, keyStyle, true);
-      view.setUint32(values, raw, true);
-      view.setUint32(values + 4, len, true);
-      view.setUint32(values + 8, style, true);
-      let x = 0;
-      let hyperlinkRun = 0;
-      let previousLinked = false;
-      while (x < this._cols && abi.call('ghostty_render_state_row_cells_next', this.rowCells)) {
-        abi.view().setUint32(style, styleSize, true);
-        abi.check(
-          'ghostty_render_state_row_cells_get_multi',
-          this.rowCells,
-          3,
-          keys,
-          values,
-          written
-        );
-        const v = abi.view();
-        const cell = this.cellPool[y * this._cols + x];
-        const graphemeLen = v.getUint32(len, true);
-        this.fillCell(cell, v.getBigUint64(raw, true), style, graphemeLen);
-        if (cell.hyperlink_id) {
-          if (!previousLinked) hyperlinkRun++;
-          cell.hyperlink_id = hyperlinkRun;
-        }
-        previousLinked = cell.hyperlink_id !== 0;
-        x++;
+    const layout = this.layout;
+    const scratch = this.scratch;
+    const cellsNext = layout.rowCellsNext;
+    const getMulti = layout.rowCellsGetMulti;
+    const pool = this.cellPool;
+    const cols = this._cols;
+    const rowStart = y * cols;
+    let view = abi.view();
+    let x = 0;
+    let hyperlinkRun = 0;
+    let previousLinked = false;
+    while (x < cols && cellsNext(this.rowCells)) {
+      if (view.buffer !== abi.exports.memory.buffer) view = abi.view();
+      view.setUint32(scratch.style, layout.styleSize, true);
+      const result = getMulti(this.rowCells, 3, scratch.keys, scratch.values, scratch.written);
+      if (result !== GHOSTTY_SUCCESS) {
+        throw new GhosttyCallError('ghostty_render_state_row_cells_get_multi', result);
       }
-    });
+      if (view.buffer !== abi.exports.memory.buffer) view = abi.view();
+      const cell = pool[rowStart + x];
+      this.fillCellFrom(
+        cell,
+        view,
+        view.getUint32(scratch.raw, true),
+        view.getUint32(scratch.raw + 4, true),
+        scratch.style,
+        view.getUint32(scratch.len, true)
+      );
+      if (cell.hyperlink_id) {
+        if (!previousLinked) hyperlinkRun++;
+        cell.hyperlink_id = hyperlinkRun;
+      }
+      previousLinked = cell.hyperlink_id !== 0;
+      x++;
+    }
   }
 
   private fillCell(cell: GhosttyCell, raw: bigint, stylePtr: number, graphemeLen: number): void {
-    const abi = this.abi;
-    const view = abi.view();
-    const tag = bitsOf(raw, abi.bits('GhosttyCell', 'content_tag'));
-    const content = abi.bits('GhosttyCell', 'content');
-    const contentBits = bitsOf(raw, content);
-    const tags = 'GhosttyCellContentTag';
-    const isText =
-      tag === abi.enumValue(tags, 'CODEPOINT') || tag === abi.enumValue(tags, 'CODEPOINT_GRAPHEME');
-    cell.codepoint = isText ? contentBits & 0x1fffff : 0;
-    cell.grapheme_len = Math.max(0, graphemeLen - 1);
-
-    const at = (f: string) => stylePtr + abi.offset('GhosttyStyle', f);
-    const fg = this.styleColor(view, at('fg_color')) ?? this.colors.foreground;
-    let bg = this.styleColor(view, at('bg_color')) ?? this.colors.background;
-    if (tag === abi.enumValue(tags, 'BG_COLOR_PALETTE')) {
+    this.fillCellFrom(
+      cell,
+      this.abi.view(),
+      Number(raw & 0xffffffffn),
+      Number(raw >> 32n),
+      stylePtr,
+      graphemeLen
+    );
+  }
+
+  private fillCellFrom(
+    cell: GhosttyCell,
+    view: DataView,
+    lo: number,
+    hi: number,
+    stylePtr: number,
+    graphemeLen: number
+  ): void {
+    const L = this.layout;
+    const tag = lo & 0x3;
+    const contentBits = (lo >>> 2) & 0xffffff;
+    cell.codepoint = tag === L.tagCodepoint || tag === L.tagGrapheme ? contentBits & 0x1fffff : 0;
+    cell.grapheme_len = graphemeLen > 1 ? graphemeLen - 1 : 0;
+
+    const styleId = ((lo >>> 26) | (hi << 6)) & 0xffff;
+    let fg = this.colors.foreground;
+    let bg = this.colors.background;
+    let flags = 0;
+    if (styleId !== 0) {
+      fg = this.styleColor(view, stylePtr + L.fgColor) ?? fg;
+      bg = this.styleColor(view, stylePtr + L.bgColor) ?? bg;
+      if (view.getUint8(stylePtr + L.bold)) flags |= CellFlags.BOLD;
+      if (view.getUint8(stylePtr + L.italic)) flags |= CellFlags.ITALIC;
+      if (view.getInt32(stylePtr + L.underline, true) !== 0) flags |= CellFlags.UNDERLINE;
+      if (view.getUint8(stylePtr + L.strikethrough)) flags |= CellFlags.STRIKETHROUGH;
+      if (view.getUint8(stylePtr + L.inverse)) flags |= CellFlags.INVERSE;
+      if (view.getUint8(stylePtr + L.invisible)) flags |= CellFlags.INVISIBLE;
+      if (view.getUint8(stylePtr + L.blink)) flags |= CellFlags.BLINK;
+      if (view.getUint8(stylePtr + L.faint)) flags |= CellFlags.FAINT;
+    }
+    if (tag === L.tagBgPalette) {
       bg = this.colors.palette[contentBits & 0xff] ?? bg;
-    } else if (tag === abi.enumValue(tags, 'BG_COLOR_RGB')) {
+    } else if (tag === L.tagBgRgb) {
       bg = { r: contentBits & 0xff, g: (contentBits >> 8) & 0xff, b: (contentBits >> 16) & 0xff };
     }
     cell.fg_r = fg.r;
@@ -1014,37 +1368,19 @@ export class GhosttyTerminal {
     cell.bg_r = bg.r;
     cell.bg_g = bg.g;
     cell.bg_b = bg.b;
-
-    let flags = 0;
-    if (view.getUint8(at('bold'))) flags |= CellFlags.BOLD;
-    if (view.getUint8(at('italic'))) flags |= CellFlags.ITALIC;
-    if (view.getInt32(at('underline'), true) !== 0) flags |= CellFlags.UNDERLINE;
-    if (view.getUint8(at('strikethrough'))) flags |= CellFlags.STRIKETHROUGH;
-    if (view.getUint8(at('inverse'))) flags |= CellFlags.INVERSE;
-    if (view.getUint8(at('invisible'))) flags |= CellFlags.INVISIBLE;
-    if (view.getUint8(at('blink'))) flags |= CellFlags.BLINK;
-    if (view.getUint8(at('faint'))) flags |= CellFlags.FAINT;
     cell.flags = flags;
 
-    const wide = bitsOf(raw, abi.bits('GhosttyCell', 'wide'));
-    const wides = 'GhosttyCellWide';
-    cell.width =
-      wide === abi.enumValue(wides, 'WIDE')
-        ? 2
-        : wide === abi.enumValue(wides, 'SPACER_TAIL')
-          ? 0
-          : 1;
-    cell.hyperlink_id = bitsOf(raw, abi.bits('GhosttyCell', 'hyperlink'));
+    const wide = (hi >>> 10) & 0x3;
+    cell.width = wide === L.wideWide ? 2 : wide === L.wideSpacerTail ? 0 : 1;
+    cell.hyperlink_id = (hi >>> 13) & 0x1;
   }
 
   private styleColor(view: DataView, ptr: number): RGB | null {
-    const abi = this.abi;
-    const tag = view.getInt32(ptr + abi.offset('GhosttyStyleColor', 'tag'), true);
-    const value = ptr + abi.offset('GhosttyStyleColor', 'value');
-    if (tag === abi.enumValue('GhosttyStyleColorTag', 'PALETTE')) {
-      return this.colors.palette[view.getUint8(value)] ?? null;
-    }
-    if (tag === abi.enumValue('GhosttyStyleColorTag', 'RGB')) return rgbAt(view, value);
+    const L = this.layout;
+    const tag = view.getInt32(ptr + L.colorTag, true);
+    if (tag === L.colorPalette)
+      return this.colors.palette[view.getUint8(ptr + L.colorValue)] ?? null;
+    if (tag === L.colorRgb) return rgbAt(view, ptr + L.colorValue);
     return null;
   }