@flighthq/textinput 0.2.0 → 0.2.1-next.423.3350e53

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flighthq/textinput",
-  "version": "0.2.0",
+  "version": "0.2.1-next.423.3350e53",
   "repository": {
     "type": "git",
     "url": "https://github.com/flighthq/flight.git",
@@ -32,11 +32,11 @@
     "clean:dist": "tsx ../../scripts/clean-package-dist.ts"
   },
   "dependencies": {
-    "@flighthq/node": "0.2.0",
-    "@flighthq/signals": "0.2.0",
-    "@flighthq/text": "0.2.0",
-    "@flighthq/textlayout": "0.2.0",
-    "@flighthq/types": "0.2.0"
+    "@flighthq/node": "0.2.1-next.423.3350e53",
+    "@flighthq/signals": "0.2.1-next.423.3350e53",
+    "@flighthq/text": "0.2.1-next.423.3350e53",
+    "@flighthq/textlayout": "0.2.1-next.423.3350e53",
+    "@flighthq/types": "0.2.1-next.423.3350e53"
   },
   "devDependencies": {
     "typescript": "^5.3.0"

package/src/textInputEditing.test.ts

@@ -839,6 +839,34 @@ describe('selectLineAtTextInputIndex', () => {
     expect(getTextInputSelectionBeginIndex(text)).toBe(6);
     expect(getTextInputSelectionEndIndex(text)).toBe(11);
   });
+
+  it('selects the correct line in multiline text', () => {
+    const text = createInput({ text: 'aaa\nbbb\nccc' });
+    selectLineAtTextInputIndex(text, 5);
+    expect(getTextInputSelectionBeginIndex(text)).toBe(4);
+    expect(getTextInputSelectionEndIndex(text)).toBe(7);
+  });
+
+  it('selects the first line when index is at a line boundary', () => {
+    const text = createInput({ text: 'hello\nworld' });
+    selectLineAtTextInputIndex(text, 5);
+    expect(getTextInputSelectionBeginIndex(text)).toBe(0);
+    expect(getTextInputSelectionEndIndex(text)).toBe(5);
+  });
+
+  it('selects empty range for empty text', () => {
+    const text = createInput({ text: '' });
+    selectLineAtTextInputIndex(text, 0);
+    expect(getTextInputSelectionBeginIndex(text)).toBe(0);
+    expect(getTextInputSelectionEndIndex(text)).toBe(0);
+  });
+
+  it('selects the last line', () => {
+    const text = createInput({ text: 'aaa\nbbb\nccc' });
+    selectLineAtTextInputIndex(text, 10);
+    expect(getTextInputSelectionBeginIndex(text)).toBe(8);
+    expect(getTextInputSelectionEndIndex(text)).toBe(11);
+  });
 });
 
 describe('selectWordAtTextInputIndex', () => {
@@ -848,6 +876,48 @@ describe('selectWordAtTextInputIndex', () => {
     expect(getTextInputSelectionBeginIndex(text)).toBe(0);
     expect(getTextInputSelectionEndIndex(text)).toBe(5);
   });
+
+  it('selects the preceding word when index is at a whitespace boundary', () => {
+    const text = createInput({ text: 'hello world' });
+    selectWordAtTextInputIndex(text, 5);
+    expect(getTextInputSelectionBeginIndex(text)).toBe(0);
+    expect(getTextInputSelectionEndIndex(text)).toBe(5);
+  });
+
+  it('selects non-word region when surrounded by non-word characters', () => {
+    const text = createInput({ text: '  hello' });
+    selectWordAtTextInputIndex(text, 1);
+    expect(getTextInputSelectionBeginIndex(text)).toBe(0);
+    expect(getTextInputSelectionEndIndex(text)).toBe(2);
+  });
+
+  it('selects the preceding word when index is at punctuation', () => {
+    const text = createInput({ text: 'hello, world' });
+    selectWordAtTextInputIndex(text, 5);
+    expect(getTextInputSelectionBeginIndex(text)).toBe(0);
+    expect(getTextInputSelectionEndIndex(text)).toBe(5);
+  });
+
+  it('selects word at start of text (index 0)', () => {
+    const text = createInput({ text: 'hello world' });
+    selectWordAtTextInputIndex(text, 0);
+    expect(getTextInputSelectionBeginIndex(text)).toBe(0);
+    expect(getTextInputSelectionEndIndex(text)).toBe(5);
+  });
+
+  it('selects word at end of text', () => {
+    const text = createInput({ text: 'hello world' });
+    selectWordAtTextInputIndex(text, 11);
+    expect(getTextInputSelectionBeginIndex(text)).toBe(6);
+    expect(getTextInputSelectionEndIndex(text)).toBe(11);
+  });
+
+  it('selects empty range for empty text', () => {
+    const text = createInput({ text: '' });
+    selectWordAtTextInputIndex(text, 0);
+    expect(getTextInputSelectionBeginIndex(text)).toBe(0);
+    expect(getTextInputSelectionEndIndex(text)).toBe(0);
+  });
 });
 
 describe('setTextInputSelection', () => {

package/src/textInputManager.test.ts

@@ -1,6 +1,6 @@
 import { createSignal, emitSignal } from '@flighthq/signals';
-import { createRichText } from '@flighthq/text';
-import type { RichText, RichTextData } from '@flighthq/types';
+import { createRichText, getRichTextRuntime } from '@flighthq/text';
+import type { RichText, RichTextData, RichTextRuntime, TextLayoutResult } from '@flighthq/types';
 import { KeyCode } from '@flighthq/types';
 
 import { enableTextInput, getTextInputState } from './textInput';
@@ -27,6 +27,42 @@ function createInput(data: Partial<RichTextData> = {}): RichText {
   return text;
 }
 
+// Creates a mock layout for "hello world" (11 chars) as a single line. Each character is 10px wide,
+// starting at offsetX=2. This makes getTextInputCharacterIndexAtPoint predictable: x=7 lands on
+// index 0, x=17 on index 1, etc. (midpoint rounding: x < offsetX + advance/2 → that index).
+function createSingleLineLayout(): TextLayoutResult {
+  return {
+    groups: [
+      {
+        ascent: 10,
+        descent: 2,
+        endIndex: 11,
+        format: {},
+        height: 12,
+        leading: 0,
+        lineIndex: 0,
+        offsetX: 2,
+        offsetY: 2,
+        positions: [10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10],
+        startIndex: 0,
+        width: 110,
+      },
+    ],
+    lineAscents: [10],
+    lineDescents: [2],
+    lineHeights: [12],
+    lineLeadings: [0],
+    lineWidths: [110],
+    numLines: 1,
+    textHeight: 12,
+    textWidth: 110,
+  };
+}
+
+function setLayout(target: RichText, layout: TextLayoutResult): void {
+  (getRichTextRuntime(target) as RichTextRuntime).textLayout = layout;
+}
+
 function isFocused(node: RichText): boolean {
   return getTextInputState(node)?.focused === true;
 }
@@ -129,12 +165,75 @@ describe('dispatchTextInputPointerDown', () => {
     expect(manager.focused).toBe(target);
     expect(isFocused(target)).toBe(true);
   });
+
+  it('selects a word on double-click (clickCount=2)', () => {
+    const manager = createTextInputManager();
+    const target = createInput({ text: 'hello world' });
+    setLayout(target, createSingleLineLayout());
+    // x=7 lands on index 0 (inside "hello"); clickCount=2 selects the word.
+    dispatchTextInputPointerDown(manager, target, 7, 5, false, 2);
+    expect(getTextInputSelectionBeginIndex(target)).toBe(0);
+    expect(getTextInputSelectionEndIndex(target)).toBe(5);
+  });
+
+  it('selects a line on triple-click (clickCount=3)', () => {
+    const manager = createTextInputManager();
+    const target = createInput({ text: 'hello world' });
+    setLayout(target, createSingleLineLayout());
+    // Any x on the single line; clickCount=3 selects the entire line.
+    dispatchTextInputPointerDown(manager, target, 7, 5, false, 3);
+    expect(getTextInputSelectionBeginIndex(target)).toBe(0);
+    expect(getTextInputSelectionEndIndex(target)).toBe(11);
+  });
 });
 
 describe('dispatchTextInputPointerMove', () => {
   it('does not throw when nothing is focused', () => {
     expect(() => dispatchTextInputPointerMove(createTextInputManager(), 0, 0)).not.toThrow();
   });
+
+  it('extends selection when dragging after pointer-down', () => {
+    const manager = createTextInputManager();
+    const target = createInput({ text: 'hello world' });
+    const layout = createSingleLineLayout();
+    setLayout(target, layout);
+    // Pointer-down at index 2 (x=2+2*10=22, midpoint at 27; use 23 to land on index 2).
+    dispatchTextInputPointerDown(manager, target, 23, 5);
+    expect(getTextInputSelectionBeginIndex(target)).toBe(2);
+    expect(getTextInputSelectionEndIndex(target)).toBe(2);
+    // Pointer-move to index 7 (x=2+7*10=72, midpoint at 77; use 73 to land on index 7).
+    dispatchTextInputPointerMove(manager, 73, 5);
+    expect(getTextInputSelectionBeginIndex(target)).toBe(2);
+    expect(getTextInputSelectionEndIndex(target)).toBe(7);
+  });
+
+  it('extends selection backward when pointer moves left', () => {
+    const manager = createTextInputManager();
+    const target = createInput({ text: 'hello world' });
+    const layout = createSingleLineLayout();
+    setLayout(target, layout);
+    // Pointer-down at index 7 (x=73).
+    dispatchTextInputPointerDown(manager, target, 73, 5);
+    // Pointer-move to index 2 (x=23).
+    dispatchTextInputPointerMove(manager, 23, 5);
+    expect(getTextInputSelectionBeginIndex(target)).toBe(2);
+    expect(getTextInputSelectionEndIndex(target)).toBe(7);
+  });
+
+  it('clamps selection at text boundaries', () => {
+    const manager = createTextInputManager();
+    const target = createInput({ text: 'hello world' });
+    const layout = createSingleLineLayout();
+    setLayout(target, layout);
+    // Pointer-down at index 5.
+    dispatchTextInputPointerDown(manager, target, 53, 5);
+    // Pointer-move far past the end of text.
+    dispatchTextInputPointerMove(manager, 999, 5);
+    expect(getTextInputSelectionEndIndex(target)).toBe(11);
+    // Pointer-move far before the start of text.
+    dispatchTextInputPointerMove(manager, -100, 5);
+    expect(getTextInputSelectionBeginIndex(target)).toBe(0);
+  });
 });
 
 describe('dispatchTextInputWheel', () => {