@flighthq/gui 0.4.1-edge.28.7f8e221

package/src/progressBarController.test.ts

@@ -0,0 +1,49 @@
+import { createGuiTestNode } from './guiTestHelper';
+import {
+  createProgressBarController,
+  disposeProgressBarController,
+  getProgressBarControllerValue,
+  setProgressBarControllerValue,
+} from './progressBarController';
+
+describe('createProgressBarController', () => {
+  it('scales the caller fill without changing the track', () => {
+    const fill = createGuiTestNode();
+    const track = createGuiTestNode();
+    createProgressBarController({ fill, maximum: 100, track, value: 25 });
+    expect(fill.scaleX).toBe(0.25);
+    expect(track.scaleX).toBe(1);
+  });
+});
+
+describe('disposeProgressBarController', () => {
+  it('is idempotent', () => {
+    const controller = createProgressBarController({ fill: createGuiTestNode(), track: createGuiTestNode() });
+    disposeProgressBarController(controller);
+    expect(() => disposeProgressBarController(controller)).not.toThrow();
+  });
+});
+
+describe('getProgressBarControllerValue', () => {
+  it('returns a clamped initial value', () => {
+    expect(
+      getProgressBarControllerValue(
+        createProgressBarController({ fill: createGuiTestNode(), maximum: 10, track: createGuiTestNode(), value: 20 }),
+      ),
+    ).toBe(10);
+  });
+});
+
+describe('setProgressBarControllerValue', () => {
+  it('updates vertical fill scale', () => {
+    const fill = createGuiTestNode();
+    const controller = createProgressBarController({
+      fill,
+      maximum: 10,
+      orientation: 'vertical',
+      track: createGuiTestNode(),
+    });
+    setProgressBarControllerValue(controller, 5);
+    expect(fill.scaleY).toBe(0.5);
+  });
+});

package/src/radioGroupController.test.ts

@@ -0,0 +1,61 @@
+import { connectSignal } from '@flighthq/signals/contract';
+
+import { createGuiTestNode } from './guiTestHelper';
+import {
+  createRadioGroupController,
+  disposeRadioGroupController,
+  getRadioGroupControllerSelectedIndex,
+  getRadioGroupControllerSignals,
+  setRadioGroupControllerSelectedIndex,
+} from './radioGroupController';
+import { createToggleController, isToggleControllerChecked, setToggleControllerChecked } from './toggleController';
+
+function toggle() {
+  return createToggleController({ checkedState: createGuiTestNode(), uncheckedState: createGuiTestNode() });
+}
+
+describe('createRadioGroupController', () => {
+  it('enforces mutual exclusion from toggle changes', () => {
+    const toggles = [toggle(), toggle(), toggle()];
+    const controller = createRadioGroupController({ selectedIndex: 0, toggles });
+    setToggleControllerChecked(toggles[2], true);
+    expect(getRadioGroupControllerSelectedIndex(controller)).toBe(2);
+    expect(toggles.map(isToggleControllerChecked)).toEqual([false, false, true]);
+  });
+});
+
+describe('disposeRadioGroupController', () => {
+  it('stops observing member toggles', () => {
+    const member = toggle();
+    const controller = createRadioGroupController({ selectedIndex: -1, toggles: [member] });
+    disposeRadioGroupController(controller);
+    setToggleControllerChecked(member, true);
+    expect(getRadioGroupControllerSelectedIndex(controller)).toBe(-1);
+  });
+});
+
+describe('getRadioGroupControllerSelectedIndex', () => {
+  it('normalizes out-of-range values to -1', () => {
+    expect(
+      getRadioGroupControllerSelectedIndex(createRadioGroupController({ selectedIndex: 4, toggles: [toggle()] })),
+    ).toBe(-1);
+  });
+});
+
+describe('getRadioGroupControllerSignals', () => {
+  it('emits selected indices', () => {
+    const controller = createRadioGroupController({ toggles: [toggle(), toggle()] });
+    const values: number[] = [];
+    connectSignal(getRadioGroupControllerSignals(controller).onChange, (value) => values.push(value));
+    setRadioGroupControllerSelectedIndex(controller, 1);
+    expect(values).toEqual([1]);
+  });
+});
+
+describe('setRadioGroupControllerSelectedIndex', () => {
+  it('can clear the selection', () => {
+    const controller = createRadioGroupController({ toggles: [toggle()] });
+    setRadioGroupControllerSelectedIndex(controller, -1);
+    expect(getRadioGroupControllerSelectedIndex(controller)).toBe(-1);
+  });
+});

package/src/scrollBarController.test.ts

@@ -0,0 +1,86 @@
+import { connectSignal } from '@flighthq/signals/contract';
+
+import { createGuiTestNode, emitGuiPointer } from './guiTestHelper';
+import {
+  createScrollBarController,
+  disposeScrollBarController,
+  getScrollBarControllerSignals,
+  getScrollBarControllerValue,
+  setScrollBarControllerValue,
+} from './scrollBarController';
+
+describe('createScrollBarController', () => {
+  it('pages on track clicks and positions the thumb', () => {
+    const track = createGuiTestNode(20, 100);
+    const thumb = createGuiTestNode(20, 10);
+    const controller = createScrollBarController({ maximum: 100, pageSize: 20, thumb, track });
+    emitGuiPointer(track, 'onPointerDown', { localY: 80 });
+    expect(getScrollBarControllerValue(controller)).toBe(20);
+    expect(thumb.y).toBe(18);
+  });
+
+  it('repeat-clicks optional line buttons and cancels the timer', () => {
+    vi.useFakeTimers();
+    const down = createGuiTestNode();
+    const controller = createScrollBarController({
+      downButton: down,
+      maximum: 10,
+      thumb: createGuiTestNode(),
+      track: createGuiTestNode(),
+    });
+    emitGuiPointer(down, 'onPointerDown');
+    vi.advanceTimersByTime(250);
+    emitGuiPointer(down, 'onPointerUp');
+    expect(getScrollBarControllerValue(controller)).toBe(3);
+    vi.useRealTimers();
+  });
+});
+
+describe('disposeScrollBarController', () => {
+  it('cancels repeat timers', () => {
+    vi.useFakeTimers();
+    const down = createGuiTestNode();
+    const controller = createScrollBarController({
+      downButton: down,
+      thumb: createGuiTestNode(),
+      track: createGuiTestNode(),
+    });
+    emitGuiPointer(down, 'onPointerDown');
+    disposeScrollBarController(controller);
+    vi.advanceTimersByTime(500);
+    expect(getScrollBarControllerValue(controller)).toBe(1);
+    vi.useRealTimers();
+  });
+});
+
+describe('getScrollBarControllerSignals', () => {
+  it('emits changes', () => {
+    const controller = createScrollBarController({ thumb: createGuiTestNode(), track: createGuiTestNode() });
+    const values: number[] = [];
+    connectSignal(getScrollBarControllerSignals(controller).onChange, (value) => values.push(value));
+    setScrollBarControllerValue(controller, 5);
+    expect(values).toEqual([5]);
+  });
+});
+
+describe('getScrollBarControllerValue', () => {
+  it('returns the initial value', () => {
+    expect(
+      getScrollBarControllerValue(
+        createScrollBarController({ thumb: createGuiTestNode(), track: createGuiTestNode(), value: 5 }),
+      ),
+    ).toBe(5);
+  });
+});
+
+describe('setScrollBarControllerValue', () => {
+  it('clamps values', () => {
+    const controller = createScrollBarController({
+      maximum: 10,
+      thumb: createGuiTestNode(),
+      track: createGuiTestNode(),
+    });
+    setScrollBarControllerValue(controller, 20);
+    expect(getScrollBarControllerValue(controller)).toBe(10);
+  });
+});

package/src/scrollViewController.test.ts

@@ -0,0 +1,80 @@
+import { connectSignal } from '@flighthq/signals/contract';
+
+import { createGuiTestNode, emitGuiPointer } from './guiTestHelper';
+import {
+  createScrollViewController,
+  disposeScrollViewController,
+  getScrollViewControllerSignals,
+  getScrollViewControllerX,
+  getScrollViewControllerY,
+  setScrollViewControllerPosition,
+} from './scrollViewController';
+
+describe('createScrollViewController', () => {
+  it('pans content by drag and wheel within viewport bounds', () => {
+    const viewport = createGuiTestNode(100, 100);
+    const content = createGuiTestNode(300, 300);
+    const controller = createScrollViewController({ content, viewport });
+    emitGuiPointer(viewport, 'onPointerDown', { worldX: 50, worldY: 50 });
+    emitGuiPointer(viewport, 'onPointerMove', { worldX: 20, worldY: 10 });
+    expect([getScrollViewControllerX(controller), getScrollViewControllerY(controller)]).toEqual([30, 40]);
+    emitGuiPointer(viewport, 'onWheel', { deltaY: 20 });
+    expect(content.y).toBe(-60);
+  });
+});
+
+describe('disposeScrollViewController', () => {
+  it('detaches viewport input', () => {
+    const viewport = createGuiTestNode(100, 100);
+    const controller = createScrollViewController({ content: createGuiTestNode(200, 200), viewport });
+    disposeScrollViewController(controller);
+    emitGuiPointer(viewport, 'onWheel', { deltaY: 50 });
+    expect(getScrollViewControllerY(controller)).toBe(0);
+  });
+});
+
+describe('getScrollViewControllerSignals', () => {
+  it('emits both axes', () => {
+    const controller = createScrollViewController({
+      content: createGuiTestNode(200, 200),
+      viewport: createGuiTestNode(),
+    });
+    const values: number[][] = [];
+    connectSignal(getScrollViewControllerSignals(controller).onScroll, (x, y) => values.push([x, y]));
+    setScrollViewControllerPosition(controller, 10, 20);
+    expect(values).toEqual([[10, 20]]);
+  });
+});
+
+describe('getScrollViewControllerX', () => {
+  it('returns horizontal offset', () => {
+    const controller = createScrollViewController({
+      content: createGuiTestNode(200, 200),
+      viewport: createGuiTestNode(),
+    });
+    setScrollViewControllerPosition(controller, 5, 0);
+    expect(getScrollViewControllerX(controller)).toBe(5);
+  });
+});
+
+describe('getScrollViewControllerY', () => {
+  it('returns vertical offset', () => {
+    const controller = createScrollViewController({
+      content: createGuiTestNode(200, 200),
+      viewport: createGuiTestNode(),
+    });
+    setScrollViewControllerPosition(controller, 0, 5);
+    expect(getScrollViewControllerY(controller)).toBe(5);
+  });
+});
+
+describe('setScrollViewControllerPosition', () => {
+  it('clamps to content extent', () => {
+    const controller = createScrollViewController({
+      content: createGuiTestNode(150, 150),
+      viewport: createGuiTestNode(100, 100),
+    });
+    setScrollViewControllerPosition(controller, 500, 500);
+    expect([getScrollViewControllerX(controller), getScrollViewControllerY(controller)]).toEqual([50, 50]);
+  });
+});

package/src/sliderController.test.ts

@@ -0,0 +1,74 @@
+import { connectSignal } from '@flighthq/signals/contract';
+
+import { createGuiTestNode, emitGuiKeyboard, emitGuiPointer } from './guiTestHelper';
+import {
+  createSliderController,
+  disposeSliderController,
+  getSliderControllerSignals,
+  getSliderControllerValue,
+  setSliderControllerValue,
+} from './sliderController';
+
+describe('createSliderController', () => {
+  it('maps track positions and thumb drags to values', () => {
+    const track = createGuiTestNode(100, 10);
+    const thumb = createGuiTestNode(10, 10);
+    const controller = createSliderController({ maximum: 10, thumb, track });
+    emitGuiPointer(track, 'onPointerDown', { localX: 50 });
+    expect(getSliderControllerValue(controller)).toBe(5);
+    expect(thumb.x).toBe(45);
+    emitGuiPointer(thumb, 'onPointerDown', { worldX: 45 });
+    emitGuiPointer(thumb, 'onPointerMove', { worldX: 90 });
+    expect(getSliderControllerValue(controller)).toBe(10);
+  });
+
+  it('supports keyboard selection', () => {
+    const track = createGuiTestNode();
+    const controller = createSliderController({ maximum: 10, step: 2, thumb: createGuiTestNode(), track });
+    emitGuiKeyboard(track, 'onKeyDown', 'ArrowRight');
+    expect(getSliderControllerValue(controller)).toBe(2);
+  });
+});
+
+describe('disposeSliderController', () => {
+  it('detaches track input', () => {
+    const track = createGuiTestNode();
+    const controller = createSliderController({ thumb: createGuiTestNode(), track });
+    disposeSliderController(controller);
+    emitGuiPointer(track, 'onPointerDown', { localX: 100 });
+    expect(getSliderControllerValue(controller)).toBe(0);
+  });
+});
+
+describe('getSliderControllerSignals', () => {
+  it('emits snapped values', () => {
+    const controller = createSliderController({
+      maximum: 10,
+      step: 2,
+      thumb: createGuiTestNode(),
+      track: createGuiTestNode(),
+    });
+    const values: number[] = [];
+    connectSignal(getSliderControllerSignals(controller).onChange, (value) => values.push(value));
+    setSliderControllerValue(controller, 3);
+    expect(values).toEqual([4]);
+  });
+});
+
+describe('getSliderControllerValue', () => {
+  it('returns the configured value', () => {
+    expect(
+      getSliderControllerValue(
+        createSliderController({ thumb: createGuiTestNode(), track: createGuiTestNode(), value: 0.5 }),
+      ),
+    ).toBe(0.5);
+  });
+});
+
+describe('setSliderControllerValue', () => {
+  it('clamps to the range', () => {
+    const controller = createSliderController({ thumb: createGuiTestNode(), track: createGuiTestNode() });
+    setSliderControllerValue(controller, 5);
+    expect(getSliderControllerValue(controller)).toBe(1);
+  });
+});

package/src/splitPaneController.test.ts

@@ -0,0 +1,85 @@
+import { connectSignal } from '@flighthq/signals/contract';
+
+import { createGuiTestNode, emitGuiPointer } from './guiTestHelper';
+import {
+  createSplitPaneController,
+  disposeSplitPaneController,
+  getSplitPaneControllerPosition,
+  getSplitPaneControllerSignals,
+  setSplitPaneControllerPosition,
+} from './splitPaneController';
+
+describe('createSplitPaneController', () => {
+  it('drags a distinct constrained divider behavior', () => {
+    const first = createGuiTestNode(100, 20);
+    const divider = createGuiTestNode(10, 20);
+    const second = createGuiTestNode(100, 20);
+    const controller = createSplitPaneController({
+      divider,
+      firstRegion: first,
+      minimumFirst: 50,
+      minimumSecond: 50,
+      secondRegion: second,
+      totalSize: 210,
+    });
+    emitGuiPointer(divider, 'onPointerDown', { worldX: 100 });
+    emitGuiPointer(divider, 'onPointerMove', { worldX: 170 });
+    expect(getSplitPaneControllerPosition(controller)).toBe(150);
+    expect(divider.x).toBe(150);
+  });
+});
+
+describe('disposeSplitPaneController', () => {
+  it('detaches divider dragging', () => {
+    const divider = createGuiTestNode();
+    const controller = createSplitPaneController({
+      divider,
+      firstRegion: createGuiTestNode(),
+      secondRegion: createGuiTestNode(),
+    });
+    disposeSplitPaneController(controller);
+    emitGuiPointer(divider, 'onPointerDown', { worldX: 0 });
+    emitGuiPointer(divider, 'onPointerMove', { worldX: 50 });
+    expect(getSplitPaneControllerPosition(controller)).toBe(100);
+  });
+});
+
+describe('getSplitPaneControllerPosition', () => {
+  it('returns the clamped initial position', () => {
+    const controller = createSplitPaneController({
+      divider: createGuiTestNode(),
+      firstRegion: createGuiTestNode(),
+      minimumFirst: 20,
+      position: 0,
+      secondRegion: createGuiTestNode(),
+    });
+    expect(getSplitPaneControllerPosition(controller)).toBe(20);
+  });
+});
+
+describe('getSplitPaneControllerSignals', () => {
+  it('emits changed positions', () => {
+    const controller = createSplitPaneController({
+      divider: createGuiTestNode(),
+      firstRegion: createGuiTestNode(),
+      secondRegion: createGuiTestNode(),
+    });
+    const values: number[] = [];
+    connectSignal(getSplitPaneControllerSignals(controller).onChange, (value) => values.push(value));
+    setSplitPaneControllerPosition(controller, 50);
+    expect(values).toEqual([50]);
+  });
+});
+
+describe('setSplitPaneControllerPosition', () => {
+  it('honors the maximum', () => {
+    const controller = createSplitPaneController({
+      divider: createGuiTestNode(),
+      firstRegion: createGuiTestNode(),
+      maximumFirst: 60,
+      secondRegion: createGuiTestNode(),
+    });
+    setSplitPaneControllerPosition(controller, 90);
+    expect(getSplitPaneControllerPosition(controller)).toBe(60);
+  });
+});

package/src/tabBarController.test.ts

@@ -0,0 +1,50 @@
+import { createGuiTestNode, emitGuiPointer } from './guiTestHelper';
+import {
+  createTabBarController,
+  disposeTabBarController,
+  getTabBarControllerSelectedIndex,
+  getTabBarControllerSignals,
+  setTabBarControllerSelectedIndex,
+} from './tabBarController';
+
+describe('createTabBarController', () => {
+  it('swaps selected and unselected visuals from clicks', () => {
+    const a = { selectedState: createGuiTestNode(), unselectedState: createGuiTestNode() };
+    const b = { selectedState: createGuiTestNode(), unselectedState: createGuiTestNode() };
+    const controller = createTabBarController({ tabs: [a, b] });
+    emitGuiPointer(b.unselectedState, 'onClick');
+    expect(getTabBarControllerSelectedIndex(controller)).toBe(1);
+    expect([b.selectedState.visible, b.unselectedState.visible]).toEqual([true, false]);
+  });
+});
+
+describe('disposeTabBarController', () => {
+  it('detaches tab listeners', () => {
+    const tab = { selectedState: createGuiTestNode(), unselectedState: createGuiTestNode() };
+    const controller = createTabBarController({ selectedIndex: -1, tabs: [tab] });
+    disposeTabBarController(controller);
+    emitGuiPointer(tab.unselectedState, 'onClick');
+    expect(getTabBarControllerSelectedIndex(controller)).toBe(-1);
+  });
+});
+
+describe('getTabBarControllerSelectedIndex', () => {
+  it('reports the initial index', () => {
+    expect(getTabBarControllerSelectedIndex(createTabBarController({ selectedIndex: -1, tabs: [] }))).toBe(-1);
+  });
+});
+
+describe('getTabBarControllerSignals', () => {
+  it('returns stable signals', () => {
+    const controller = createTabBarController({ tabs: [] });
+    expect(getTabBarControllerSignals(controller)).toBe(getTabBarControllerSignals(controller));
+  });
+});
+
+describe('setTabBarControllerSelectedIndex', () => {
+  it('normalizes invalid indices', () => {
+    const controller = createTabBarController({ tabs: [] });
+    setTabBarControllerSelectedIndex(controller, 2);
+    expect(getTabBarControllerSelectedIndex(controller)).toBe(-1);
+  });
+});

package/src/textInputController.test.ts

@@ -0,0 +1,93 @@
+import { connectSignal } from '@flighthq/signals/contract';
+import { createRichText } from '@flighthq/text/contract';
+
+import { createGuiTestNode } from './guiTestHelper';
+import {
+  blurTextInputController,
+  createTextInputController,
+  dispatchTextInputControllerKeyDown,
+  dispatchTextInputControllerText,
+  disposeTextInputController,
+  focusTextInputController,
+  getTextInputControllerSignals,
+} from './textInputController';
+
+describe('blurTextInputController', () => {
+  it('hides a caller caret', () => {
+    const caret = createGuiTestNode();
+    const controller = createTextInputController({ caret, textField: createRichText() });
+    focusTextInputController(controller);
+    blurTextInputController(controller);
+    expect(caret.visible).toBe(false);
+  });
+});
+
+describe('createTextInputController', () => {
+  it('wraps textinput and relays text changes', () => {
+    const field = createRichText();
+    const controller = createTextInputController({ textField: field });
+    const values: string[] = [];
+    connectSignal(getTextInputControllerSignals(controller).onChange, (text) => values.push(text));
+    focusTextInputController(controller);
+    dispatchTextInputControllerText(controller, 'abc');
+    expect(field.data.text).toBe('abc');
+    expect(values).toEqual(['abc']);
+  });
+});
+
+describe('dispatchTextInputControllerKeyDown', () => {
+  it('emits submit on Enter', () => {
+    const controller = createTextInputController({ textField: createRichText() });
+    let submitted = '';
+    connectSignal(getTextInputControllerSignals(controller).onSubmit, (text) => (submitted = text));
+    focusTextInputController(controller);
+    dispatchTextInputControllerText(controller, 'abc');
+    dispatchTextInputControllerKeyDown(controller, {
+      altKey: false,
+      capsLock: false,
+      code: 'Enter',
+      ctrlKey: false,
+      key: 'Enter',
+      keyCode: 13,
+      location: 0,
+      metaKey: false,
+      modifier: 0,
+      numLock: false,
+      repeat: false,
+      shiftKey: false,
+      timeStamp: 0,
+    });
+    expect(submitted).toBe('abc');
+  });
+});
+
+describe('dispatchTextInputControllerText', () => {
+  it('returns false while unfocused', () => {
+    const controller = createTextInputController({ textField: createRichText() });
+    expect(dispatchTextInputControllerText(controller, 'x')).toBe(false);
+  });
+});
+
+describe('disposeTextInputController', () => {
+  it('releases owned text-input capability', () => {
+    const controller = createTextInputController({ textField: createRichText() });
+    disposeTextInputController(controller);
+    expect(dispatchTextInputControllerText(controller, 'x')).toBe(false);
+  });
+});
+
+describe('focusTextInputController', () => {
+  it('shows a caller caret', () => {
+    const caret = createGuiTestNode();
+    const controller = createTextInputController({ caret, textField: createRichText() });
+    focusTextInputController(controller);
+    expect(caret.visible).toBe(true);
+  });
+});
+
+describe('getTextInputControllerSignals', () => {
+  it('returns a stable group', () => {
+    const controller = createTextInputController({ textField: createRichText() });
+    expect(getTextInputControllerSignals(controller)).toBe(getTextInputControllerSignals(controller));
+  });
+});

package/src/toggleController.test.ts

@@ -0,0 +1,72 @@
+import { connectSignal } from '@flighthq/signals/contract';
+
+import { createGuiTestNode, emitGuiPointer } from './guiTestHelper';
+import {
+  createToggleController,
+  disposeToggleController,
+  getToggleControllerSignals,
+  isToggleControllerChecked,
+  setToggleControllerChecked,
+} from './toggleController';
+
+describe('createToggleController', () => {
+  it('toggles through either state visual and an optional label', () => {
+    const unchecked = createGuiTestNode();
+    const checked = createGuiTestNode();
+    const label = createGuiTestNode();
+    const controller = createToggleController({ checkedState: checked, label, uncheckedState: unchecked });
+    emitGuiPointer(label, 'onClick');
+    expect(isToggleControllerChecked(controller)).toBe(true);
+    expect([unchecked.visible, checked.visible]).toEqual([false, true]);
+  });
+});
+
+describe('disposeToggleController', () => {
+  it('detaches click listeners', () => {
+    const unchecked = createGuiTestNode();
+    const controller = createToggleController({ checkedState: createGuiTestNode(), uncheckedState: unchecked });
+    disposeToggleController(controller);
+    emitGuiPointer(unchecked, 'onClick');
+    expect(isToggleControllerChecked(controller)).toBe(false);
+  });
+});
+
+describe('getToggleControllerSignals', () => {
+  it('emits only real state changes', () => {
+    const controller = createToggleController({
+      checkedState: createGuiTestNode(),
+      uncheckedState: createGuiTestNode(),
+    });
+    const values: boolean[] = [];
+    connectSignal(getToggleControllerSignals(controller).onChange, (value) => values.push(value));
+    setToggleControllerChecked(controller, true);
+    setToggleControllerChecked(controller, true);
+    expect(values).toEqual([true]);
+  });
+});
+
+describe('isToggleControllerChecked', () => {
+  it('reads the current value', () => {
+    expect(
+      isToggleControllerChecked(
+        createToggleController({
+          checked: true,
+          checkedState: createGuiTestNode(),
+          uncheckedState: createGuiTestNode(),
+        }),
+      ),
+    ).toBe(true);
+  });
+});
+
+describe('setToggleControllerChecked', () => {
+  it('sets both directions', () => {
+    const controller = createToggleController({
+      checked: true,
+      checkedState: createGuiTestNode(),
+      uncheckedState: createGuiTestNode(),
+    });
+    setToggleControllerChecked(controller, false);
+    expect(isToggleControllerChecked(controller)).toBe(false);
+  });
+});