@kabmo-labs/kabmo 0.7.0 → 0.9.0

package/src/shared/lib/code/editor/occurrences.test.ts

@@ -1,117 +0,0 @@
-/**
- * @license
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/**
- * The multi-selection rules.
- *
- * ⌘D's two-stage behaviour is the one users notice immediately: the first press
- * selects the word, the second adds the next occurrence. Getting that wrong
- * leaves the word selected once and its neighbour selected twice, which reads
- * as a duplicated cursor.
- */
-
-import { describe, expect, test } from 'bun:test';
-
-import {
-  growToNextOccurrence,
-  offsetBelow,
-  replicateAtRanges,
-  selectAllOccurrences,
-} from '@/shared/lib/code/editor/occurrences';
-
-describe('growToNextOccurrence', () => {
-  const text = 'alpha beta alpha gamma alpha';
-
-  test('the first press on a bare caret selects the word and adds nothing', () => {
-    expect(growToNextOccurrence(text, { start: 2, end: 2 }, [])).toEqual({
-      primary: { start: 0, end: 5 },
-      extras: [],
-    });
-  });
-
-  test('the second press adds the next occurrence', () => {
-    const grown = growToNextOccurrence(text, { start: 0, end: 5 }, []);
-    expect(grown?.primary).toEqual({ start: 0, end: 5 });
-    expect(grown?.extras).toEqual([{ start: 11, end: 16 }]);
-  });
-
-  test('each further press adds the one after it, never a duplicate', () => {
-    const grown = growToNextOccurrence(text, { start: 0, end: 5 }, [{ start: 11, end: 16 }]);
-    expect(grown?.extras).toEqual([
-      { start: 11, end: 16 },
-      { start: 23, end: 28 },
-    ]);
-  });
-
-  test('reports nothing when every occurrence is already selected', () => {
-    const extras = [
-      { start: 11, end: 16 },
-      { start: 23, end: 28 },
-    ];
-    expect(growToNextOccurrence(text, { start: 0, end: 5 }, extras)).toBeNull();
-  });
-
-  test('reports nothing on whitespace with no word beside it', () => {
-    expect(growToNextOccurrence('   ', { start: 1, end: 1 }, [])).toBeNull();
-  });
-});
-
-describe('selectAllOccurrences', () => {
-  test('the first occurrence is the primary, the rest are extras', () => {
-    const all = selectAllOccurrences('alpha beta alpha', { start: 0, end: 5 });
-
-    expect(all?.primary).toEqual({ start: 0, end: 5 });
-    expect(all?.extras).toEqual([{ start: 11, end: 16 }]);
-  });
-
-  test('a bare caret takes the word under it', () => {
-    const all = selectAllOccurrences('alpha beta alpha', { start: 2, end: 2 });
-    expect(all?.primary).toEqual({ start: 0, end: 5 });
-  });
-
-  test('a one-off word yields the selection alone', () => {
-    const all = selectAllOccurrences('alpha beta', { start: 0, end: 5 });
-    expect(all?.primary).toEqual({ start: 0, end: 5 });
-    expect(all?.extras).toEqual([]);
-  });
-});
-
-describe('offsetBelow', () => {
-  test('keeps the column', () => {
-    expect(offsetBelow('one\ntwo\nthree', 1)).toBe(5);
-  });
-
-  test('clamps to the end of a shorter next line', () => {
-    // Column 6 does not exist on `ab`; the caret lands at its end rather than
-    // on a character the line never had.
-    expect(offsetBelow('longer line\nab\nnext', 6)).toBe(14);
-  });
-
-  test('reports nothing on the last line', () => {
-    expect(offsetBelow('one\ntwo', 5)).toBeNull();
-  });
-});
-
-describe('replicateAtRanges', () => {
-  test('reports nothing when there are no extra ranges', () => {
-    expect(replicateAtRanges('abc', 'abXc', { start: 2, end: 2 }, [])).toBeNull();
-  });
-
-  test('replays one insertion at every range and collapses them to carets', () => {
-    const applied = replicateAtRanges('alpha alpha', 'Xalpha alpha', { start: 0, end: 0 }, [{ start: 6, end: 6 }]);
-
-    expect(applied?.value).toBe('Xalpha Xalpha');
-    expect(applied?.caret).toBe(1);
-    expect(applied?.rest).toEqual([{ start: 8, end: 8 }]);
-  });
-
-  test('replays a replacement over the selected text', () => {
-    const applied = replicateAtRanges('alpha beta alpha', 'Z beta alpha', { start: 0, end: 5 }, [{ start: 11, end: 16 }]);
-
-    expect(applied?.value).toBe('Z beta Z');
-    // The caret sits after the inserted `Z`, which now ends the buffer.
-    expect(applied?.rest).toEqual([{ start: 8, end: 8 }]);
-  });
-});

package/src/shared/lib/code/editor/occurrences.ts

@@ -1,111 +0,0 @@
-/**
- * @license
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/**
- * The multi-selection rules: what ⌘D, ⌘⇧L and ⌘⇧D do to a buffer, and how one
- * browser edit is replayed at every range.
- *
- * Pure on purpose. The hook that owns the ranges is a ref and a notify call;
- * every decision about WHERE a range goes and what the buffer becomes lives
- * here, so it is testable without a DOM and cannot drift between the keyboard
- * path and the palette path (both call the same functions).
- *
- * The replication rule is the load-bearing one. The browser applies a keystroke
- * at the primary range and reports the whole new buffer; diffing that against
- * the old one recovers "what was typed", and the same replacement is replayed
- * at every other range in one pass. Typing, pasting, deleting and IME
- * composition therefore need no branch per case.
- */
-
-import {
-  diffEdit,
-  nextOccurrence,
-  occurrenceRanges,
-  replicateEdit,
-  wordRangeAt,
-  type TextRange,
-} from '@/shared/lib/code/editor/commands';
-
-/** What a selection command did: the primary range plus the extra ones. */
-export interface OccurrenceSelection {
-  primary: TextRange;
-  extras: TextRange[];
-}
-
-/**
- * ⌘D. With a bare caret the first press selects the word under it and stops —
- * "select this word" and "and the next one too" are two different asks, and
- * adding a range on the first press would leave the word selected once and its
- * neighbour selected twice. With a selection, the next unselected occurrence is
- * added.
- *
- * Null when there is no word and no selection, or when every occurrence is
- * already selected: the caller then leaves the selection alone rather than
- * cycling silently.
- */
-export function growToNextOccurrence(
-  text: string,
-  primary: TextRange,
-  extras: readonly TextRange[],
-): OccurrenceSelection | null {
-  const hasSelection = primary.end > primary.start;
-  const seed = hasSelection ? primary : wordRangeAt(text, primary.start);
-  if (!seed) return null;
-  const word = text.slice(seed.start, seed.end);
-  if (!word) return null;
-
-  if (!hasSelection) return { primary: seed, extras: [...extras] };
-
-  const next = nextOccurrence(text, word, [primary, ...extras]);
-  if (!next) return null;
-  return { primary, extras: [...extras, next] };
-}
-
-/**
- * ⌘⇧L. Every occurrence becomes a range: the first is the primary (the textarea
- * can only hold one selection) and the rest are extras. Null when there is
- * nothing to select.
- */
-export function selectAllOccurrences(text: string, primary: TextRange): OccurrenceSelection | null {
-  const seed = primary.end > primary.start ? primary : wordRangeAt(text, primary.start);
-  if (!seed) return null;
-  const word = text.slice(seed.start, seed.end);
-  if (!word) return null;
-  const [first, ...rest] = occurrenceRanges(text, word);
-  if (!first) return null;
-  return { primary: first, extras: rest };
-}
-
-/**
- * ⌘⇧D. The offset directly below `offset`, keeping the column — and clamped to
- * that line's end, so a caret at the end of a short line lands at the end of the
- * next one rather than on a character it never had. Null on the last line.
- */
-export function offsetBelow(text: string, offset: number): number | null {
-  const lineEnd = text.indexOf('\n', offset);
-  if (lineEnd === -1) return null;
-  const column = offset - (text.lastIndexOf('\n', offset - 1) + 1);
-  const nextLineStart = lineEnd + 1;
-  const nextLineEnd = text.indexOf('\n', nextLineStart);
-  return Math.min(nextLineStart + column, nextLineEnd === -1 ? text.length : nextLineEnd);
-}
-
-/**
- * Replay the browser's edit (`before` → `after`, applied at `primaryBefore`) at
- * every extra range. Null when there are no extras, which is the caller's cue to
- * keep the ordinary single-selection path.
- */
-export function replicateAtRanges(
-  before: string,
-  after: string,
-  primaryBefore: TextRange,
-  extras: readonly TextRange[],
-): { value: string; caret: number; rest: TextRange[] } | null {
-  if (extras.length === 0) return null;
-  const diff = diffEdit(before, after, primaryBefore);
-  const applied = replicateEdit(before, [{ start: diff.start, end: diff.end }, ...extras], diff.inserted);
-  const [caret, ...rest] = applied.carets;
-  return { value: applied.value, caret, rest: rest.map((offset) => ({ start: offset, end: offset })) };
-}

package/src/shared/lib/code/editor/reset-css.test.ts

@@ -1,35 +0,0 @@
-/**
- * @license
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/**
- * The editor's reset stylesheet.
- *
- * The rule is what makes the editor work at all: the `<textarea>` must paint the
- * caret and the selection while its glyphs stay invisible. A regression here is
- * silent in review (it is a string) and immediately visible in the app, so it is
- * asserted directly — the two selectors and the one deliberate exception.
- */
-
-import { describe, expect, test } from 'bun:test';
-
-import { CODE_EDITOR_RESET_CSS } from '@/shared/lib/code/editor/reset-css';
-
-describe('CODE_EDITOR_RESET_CSS', () => {
-  test('hides the textarea’s own glyphs', () => {
-    expect(CODE_EDITOR_RESET_CSS).toContain('-webkit-text-fill-color: transparent');
-  });
-
-  test('keeps the placeholder visible, since no <pre> sits behind it', () => {
-    // Without this exception an empty editor's hint inherits the transparent
-    // fill and the field looks blank rather than empty.
-    expect(CODE_EDITOR_RESET_CSS).toContain('.code-editor-native-textarea::placeholder');
-    expect(CODE_EDITOR_RESET_CSS).toContain('var(--theme-ink)');
-  });
-
-  test('is scoped to the editor’s own class, not to every textarea', () => {
-    expect(CODE_EDITOR_RESET_CSS).not.toMatch(/^\s*textarea\s*\{/m);
-    expect(CODE_EDITOR_RESET_CSS).toContain('.code-editor-native-textarea {');
-  });
-});

package/src/shared/lib/code/editor/reset-css.ts

@@ -1,32 +0,0 @@
-/**
- * @license
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/**
- * The stylesheet the editor's two layers depend on.
- *
- * `CODE_EDITOR_RESET_CSS` is a rule, not a component: the transparent
- * `<textarea>` paints the caret and the selection while its glyphs must stay
- * invisible (the highlighted `<pre>` underneath supplies them), and the
- * placeholder is the one thing that must remain visible. Keeping the rule in a
- * `.ts` module rather than beside a JSX `<style>` element means a test can
- * assert it without a DOM — and there is nothing to render but this string.
- */
-
-/**
- * The reset rule, scoped to the textarea's own class.
- *
- * `::placeholder` is deliberately excluded: an empty editor's hint has no
- * `<pre>` behind it, so it keeps the theme's ink and a readable opacity
- * instead of inheriting the transparent fill.
- */
-export const CODE_EDITOR_RESET_CSS = `
-.code-editor-native-textarea {
-  -webkit-text-fill-color: transparent;
-}
-.code-editor-native-textarea::placeholder {
-  -webkit-text-fill-color: var(--theme-ink);
-  opacity: 0.45;
-}
-`;

package/src/shared/lib/code/editor/text-commands.test.ts

@@ -1,178 +0,0 @@
-/**
- * @license
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/**
- * The text-command dispatch.
- *
- * `runTextCommand` is the single entry point both the keyboard and the command
- * palette go through, so what it asserts is the ROUTING: which commands it
- * claims, which it leaves to the component (Escape, undo, Tab) and which it
- * hands back to the panel. A command that returns `false` silently does nothing
- * when a chord reaches it, which is why the membership table is asserted
- * directly rather than only through the commands themselves.
- */
-
-import { describe, expect, test } from 'bun:test';
-
-import { isTextCommand, runTextCommand, type CommandContext } from '@/shared/lib/code/editor/text-commands';
-import type { EditorCommand } from '@/shared/lib/code/editor/keymap';
-
-interface Harness {
-  ctx: CommandContext;
-  committed: Array<{ value: string; selectionStart: number; selectionEnd: number }>;
-  carets: number[];
-  selections: Array<[number, number]>;
-  edges: string[];
-}
-
-function harness(options: { value: string; start: number; end?: number; extend?: boolean; language?: string }): Harness {
-  const committed: Harness['committed'] = [];
-  const carets: number[] = [];
-  const selections: Array<[number, number]> = [];
-  const edges: string[] = [];
-  return {
-    committed,
-    carets,
-    selections,
-    edges,
-    ctx: {
-      value: options.value,
-      selectionStart: options.start,
-      selectionEnd: options.end ?? options.start,
-      extend: options.extend ?? false,
-      language: options.language ?? 'typescript',
-      commit: (edit) => committed.push(edit),
-      setCaret: (offset) => carets.push(offset),
-      selectRange: (start, end) => selections.push([start, end]),
-      setDocumentEdge: (edge) => edges.push(edge),
-    },
-  };
-}
-
-describe('isTextCommand', () => {
-  test('claims the line and caret commands', () => {
-    for (const command of ['moveLineUp', 'copyLineDown', 'deleteLine', 'toggleComment', 'indent', 'lineStart'] as const) {
-      expect(isTextCommand(command)).toBe(true);
-    }
-  });
-
-  test('leaves the DOM-owned and panel-owned commands alone', () => {
-    // Undo/redo step the history, Escape is about focus, and the find-bar chords
-    // belong to the panel — none of them is buffer arithmetic.
-    for (const command of ['undo', 'redo', 'escape', 'find', 'selectNextOccurrence', 'toggleWordWrap'] as const) {
-      expect(isTextCommand(command)).toBe(false);
-    }
-  });
-});
-
-describe('runTextCommand', () => {
-  test('reports an unowned command rather than pretending to run it', () => {
-    const h = harness({ value: 'one', start: 0 });
-    expect(runTextCommand('find', h.ctx)).toBe(false);
-    expect(h.committed).toEqual([]);
-  });
-
-  test('moves a line through the commit path, not by writing the field', () => {
-    const h = harness({ value: 'one\ntwo', start: 4, end: 7 });
-    expect(runTextCommand('moveLineUp', h.ctx)).toBe(true);
-
-    expect(h.committed[0].value).toBe('two\none');
-  });
-
-  test('indents the caret’s whole line, not the text at the caret', () => {
-    // ⌘] is a line command: on a bare caret it widens to that line first, which
-    // is what keeps it from inserting spaces mid-line.
-    const h = harness({ value: 'const a = 1;', start: 10 });
-    runTextCommand('indent', h.ctx);
-
-    expect(h.committed[0].value).toBe('  const a = 1;');
-  });
-
-  test('indents every line of a selection', () => {
-    const h = harness({ value: 'one\ntwo', start: 0, end: 7 });
-    runTextCommand('indent', h.ctx);
-
-    expect(h.committed[0].value).toBe('  one\n  two');
-  });
-
-  test('outdenting a line that has no indent commits nothing', () => {
-    const h = harness({ value: 'one', start: 1 });
-    runTextCommand('outdent', h.ctx);
-
-    expect(h.committed).toEqual([]);
-  });
-
-  test('comments with the language’s own token', () => {
-    const h = harness({ value: 'key: value', start: 0, language: 'yaml' });
-    runTextCommand('toggleComment', h.ctx);
-
-    expect(h.committed[0].value).toBe('# key: value');
-  });
-
-  test('caret moves collapse the selection', () => {
-    const h = harness({ value: 'one\ntwo', start: 5 });
-    runTextCommand('lineStart', h.ctx);
-
-    expect(h.carets).toEqual([4]);
-    expect(h.selections).toEqual([]);
-  });
-
-  test('shifted caret moves extend instead', () => {
-    const h = harness({ value: 'one\ntwo', start: 5, extend: true });
-    runTextCommand('lineEnd', h.ctx);
-
-    expect(h.selections).toEqual([[5, 7]]);
-    expect(h.carets).toEqual([]);
-  });
-
-  test('file edges go through the document-edge path', () => {
-    const h = harness({ value: 'one\ntwo', start: 5 });
-    runTextCommand('documentStart', h.ctx);
-    runTextCommand('documentEnd', h.ctx);
-
-    expect(h.edges).toEqual(['start', 'end']);
-  });
-
-  test('a shifted document move selects instead of jumping', () => {
-    const h = harness({ value: 'one\ntwo', start: 5, extend: true });
-    runTextCommand('documentStart', h.ctx);
-
-    expect(h.selections).toEqual([[0, 5]]);
-    expect(h.edges).toEqual([]);
-  });
-
-  test('the palette reaches the same commands with no event at all', () => {
-    // This is the path the command palette uses; a command reachable by chord
-    // must be reachable this way too.
-    const h = harness({ value: 'one\ntwo', start: 0, end: 3 });
-    runTextCommand('copyLineDown', h.ctx);
-
-    expect(h.committed[0].value).toBe('one\none\ntwo');
-  });
-});
-
-describe('command coverage', () => {
-  test('every text command is one the editor keymap can produce', () => {
-    // A command in the table that no key or palette entry names would be dead
-    // code; this is the check that keeps the table honest.
-    const reachable: EditorCommand[] = [
-      'moveLineUp',
-      'moveLineDown',
-      'copyLineUp',
-      'copyLineDown',
-      'deleteLine',
-      'toggleComment',
-      'insertLineAbove',
-      'insertLineBelow',
-      'indent',
-      'outdent',
-      'lineStart',
-      'lineEnd',
-      'documentStart',
-      'documentEnd',
-    ];
-    for (const command of reachable) expect(isTextCommand(command)).toBe(true);
-  });
-});

package/src/shared/lib/code/editor/text-commands.ts

@@ -1,154 +0,0 @@
-/**
- * @license
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/**
- * The editor's text commands, as a dispatch table.
- *
- * Extracted from the component because it is dispatch rather than rendering,
- * and because it keeps the component under the repository's line ceiling. The
- * component still owns the keys whose behaviour is about the DOM node rather
- * than the buffer — Escape, Tab, Backspace, Enter, undo/redo — and calls in
- * here for everything that is pure string arithmetic.
- */
-
-import {
-  commentSyntaxFor,
-  deleteLines,
-  duplicateLines,
-  insertLine,
-  lineEdges,
-  moveLines,
-  toggleLineComment,
-  type TextRange,
-} from '@/shared/lib/code/editor/commands';
-import { editForTab } from '@/shared/lib/code/editor/edits';
-import { lineRangeAt } from '@/shared/lib/code/editor/lines';
-import type { EditorCommand } from '@/shared/lib/code/editor/keymap';
-
-/** A whole-buffer edit plus where the caret lands. */
-export interface CommittedEdit {
-  value: string;
-  selectionStart: number;
-  selectionEnd: number;
-}
-
-export interface CommandContext {
-  /** Current buffer and selection, read from the live textarea. */
-  value: string;
-  selectionStart: number;
-  selectionEnd: number;
-  /** True while the event carried Shift (⌘↑ with Shift extends instead of moving). */
-  extend: boolean;
-  /** Shiki language id, which picks the comment syntax. */
-  language: string;
-  /** Commit a whole-buffer edit as ONE undoable step. */
-  commit: (edit: CommittedEdit) => void;
-  /** Move the caret, collapsing any selection. */
-  setCaret: (offset: number) => void;
-  /** Move the caret while keeping the selection's other end anchored. */
-  selectRange: (start: number, end: number) => void;
-  /** Jump to the buffer's first or last offset. */
-  setDocumentEdge: (edge: 'start' | 'end') => void;
-}
-
-/**
- * Commands that edit or move within the buffer. Everything else (the find bar's
- * chords, word wrap, save) belongs to the panel and is delegated by the caller.
- */
-const TEXT_COMMANDS: Record<string, true> = {
-  moveLineUp: true,
-  moveLineDown: true,
-  copyLineUp: true,
-  copyLineDown: true,
-  deleteLine: true,
-  toggleComment: true,
-  insertLineAbove: true,
-  insertLineBelow: true,
-  indent: true,
-  outdent: true,
-  lineStart: true,
-  lineEnd: true,
-  documentStart: true,
-  documentEnd: true,
-};
-
-export function isTextCommand(command: EditorCommand): boolean {
-  return TEXT_COMMANDS[command] === true;
-}
-
-/**
- * Run one text command. Returns true when the key was consumed.
- *
- * The buffer-changing branches all commit through `ctx.commit`, which is the
- * component's single write path: one undo entry per command, and the highlight
- * layer follows because the commit goes through the controlled value.
- */
-export function runTextCommand(command: EditorCommand, ctx: CommandContext): boolean {
-  const selection: TextRange = { start: ctx.selectionStart, end: ctx.selectionEnd };
-
-  switch (command) {
-    case 'moveLineUp':
-      ctx.commit(moveLines(ctx.value, selection, -1));
-      return true;
-    case 'moveLineDown':
-      ctx.commit(moveLines(ctx.value, selection, 1));
-      return true;
-    case 'copyLineUp':
-      ctx.commit(duplicateLines(ctx.value, selection, -1));
-      return true;
-    case 'copyLineDown':
-      ctx.commit(duplicateLines(ctx.value, selection, 1));
-      return true;
-    case 'deleteLine':
-      ctx.commit(deleteLines(ctx.value, selection));
-      return true;
-    case 'toggleComment':
-      ctx.commit(toggleLineComment(ctx.value, selection, commentSyntaxFor(ctx.language)));
-      return true;
-    case 'insertLineAbove':
-      ctx.commit(insertLine(ctx.value, ctx.selectionStart, 'above'));
-      return true;
-    case 'insertLineBelow':
-      ctx.commit(insertLine(ctx.value, ctx.selectionStart, 'below'));
-      return true;
-
-    case 'indent':
-    case 'outdent': {
-      // ⌘] / ⌘[ act on the LINES the selection touches — on a bare caret that
-      // is the caret's own line, which is why the range is widened first. Tab
-      // itself still indents at the caret (that is what Tab means in an
-      // editor), but a line command that shifted text mid-line would not be
-      // indenting anything.
-      const range = ctx.selectionStart === ctx.selectionEnd ? lineRangeAt(ctx.value, ctx.selectionStart) : selection;
-      const edit = editForTab(ctx.value, range.start, range.end, command === 'outdent');
-      if (edit.value !== ctx.value) ctx.commit(edit);
-      return true;
-    }
-
-    case 'lineStart': {
-      const edges = lineEdges(ctx.value, ctx.selectionStart);
-      if (ctx.extend) ctx.selectRange(edges.start, ctx.selectionEnd);
-      else ctx.setCaret(edges.start);
-      return true;
-    }
-    case 'lineEnd': {
-      const edges = lineEdges(ctx.value, ctx.selectionStart);
-      if (ctx.extend) ctx.selectRange(ctx.selectionStart, edges.end);
-      else ctx.setCaret(edges.end);
-      return true;
-    }
-    case 'documentStart':
-      if (ctx.extend) ctx.selectRange(0, ctx.selectionEnd);
-      else ctx.setDocumentEdge('start');
-      return true;
-    case 'documentEnd':
-      if (ctx.extend) ctx.selectRange(ctx.selectionStart, ctx.value.length);
-      else ctx.setDocumentEdge('end');
-      return true;
-
-    default:
-      return false;
-  }
-}