@blario/react-native 0.0.0 → 0.1.1

package/src/agent-mode/haptics.ts

@@ -0,0 +1,49 @@
+import { isFunction, isRecord } from '../fiber/narrow.ts';
+import { EXPO_HAPTICS } from '../optional/expo-haptics.ts';
+import { REACT_NATIVE_HAPTIC_FEEDBACK } from '../optional/react-native-haptic-feedback.ts';
+
+export interface HapticsAdapter {
+  name: string;
+  warn: () => void;
+}
+
+function hapticFeedbackAdapter(): HapticsAdapter | null {
+  const loaded = REACT_NATIVE_HAPTIC_FEEDBACK;
+  const module = isRecord(loaded) && isRecord(loaded.default) ? loaded.default : loaded;
+  if (!isRecord(module) || !isFunction(module.trigger)) {
+    return null;
+  }
+  const trigger = module.trigger;
+  return {
+    name: 'react-native-haptic-feedback',
+    warn: () => {
+      trigger('notificationWarning', { enableVibrateFallback: false, ignoreAndroidSystemSettings: false });
+    },
+  };
+}
+
+function expoHapticsAdapter(): HapticsAdapter | null {
+  const module = EXPO_HAPTICS;
+  if (!isRecord(module) || !isFunction(module.notificationAsync)) {
+    return null;
+  }
+  const notify = module.notificationAsync;
+  const types = module.NotificationFeedbackType;
+  const warning = isRecord(types) && typeof types.Warning === 'string' ? types.Warning : 'warning';
+  return {
+    name: 'expo-haptics',
+    warn: () => {
+      Promise.resolve(notify(warning)).catch(() => undefined);
+    },
+  };
+}
+
+export const HAPTICS_ADAPTER: HapticsAdapter | null = hapticFeedbackAdapter() ?? expoHapticsAdapter();
+
+export function warnByHaptics(adapter: HapticsAdapter | null): void {
+  try {
+    adapter?.warn();
+  } catch {
+    return;
+  }
+}

package/src/agent-mode/keep-awake.ts

@@ -0,0 +1,107 @@
+import { isFunction, isRecord } from '../fiber/narrow.ts';
+import { EXPO_KEEP_AWAKE } from '../optional/expo-keep-awake.ts';
+import { REACT_NATIVE_KEEP_AWAKE } from '../optional/react-native-keep-awake.ts';
+
+export type KeepAwakeHolder = 'ai-turn' | 'agent-run';
+
+export interface KeepAwakeAdapter {
+  name: string;
+  activate: () => void;
+  deactivate: () => void;
+}
+
+const EXPO_TAG = 'blar-agent';
+
+function expoAdapter(): KeepAwakeAdapter | null {
+  const module = EXPO_KEEP_AWAKE;
+  if (!isRecord(module) || !isFunction(module.activateKeepAwakeAsync) || !isFunction(module.deactivateKeepAwake)) {
+    return null;
+  }
+  const activate = module.activateKeepAwakeAsync;
+  const deactivate = module.deactivateKeepAwake;
+  return {
+    name: 'expo-keep-awake',
+    activate: () => {
+      Promise.resolve(activate(EXPO_TAG)).catch(() => undefined);
+    },
+    deactivate: () => {
+      Promise.resolve(deactivate(EXPO_TAG)).catch(() => undefined);
+    },
+  };
+}
+
+interface KeepAwakeMethods {
+  activate?: unknown;
+  deactivate?: unknown;
+}
+
+function communityAdapter(): KeepAwakeAdapter | null {
+  const module = REACT_NATIVE_KEEP_AWAKE;
+  const candidate = isRecord(module) && module.default !== undefined ? module.default : module;
+  if (!isRecord(candidate) && !isFunction(candidate)) {
+    return null;
+  }
+  const { activate, deactivate } = candidate as KeepAwakeMethods;
+  if (!isFunction(activate) || !isFunction(deactivate)) {
+    return null;
+  }
+  return { name: 'react-native-keep-awake', activate: () => activate(), deactivate: () => deactivate() };
+}
+
+export const KEEP_AWAKE_ADAPTER: KeepAwakeAdapter | null = expoAdapter() ?? communityAdapter();
+
+export class KeepAwake {
+  private readonly holders = new Set<KeepAwakeHolder>();
+
+  private reportedMissing = false;
+
+  constructor(
+    private readonly adapter: KeepAwakeAdapter | null,
+    private readonly log?: (message: string) => void,
+  ) {}
+
+  hold(holder: KeepAwakeHolder): void {
+    if (this.holders.has(holder)) {
+      return;
+    }
+    this.holders.add(holder);
+    if (this.holders.size > 1) {
+      return;
+    }
+    if (this.adapter === null) {
+      this.reportMissing();
+      return;
+    }
+    this.invoke('activate');
+  }
+
+  release(holder: KeepAwakeHolder): void {
+    if (!this.holders.delete(holder) || this.holders.size > 0 || this.adapter === null) {
+      return;
+    }
+    this.invoke('deactivate');
+  }
+
+  releaseAll(): void {
+    const held = this.holders.size > 0;
+    this.holders.clear();
+    if (held && this.adapter !== null) {
+      this.invoke('deactivate');
+    }
+  }
+
+  private invoke(method: 'activate' | 'deactivate'): void {
+    try {
+      this.adapter?.[method]();
+    } catch {
+      this.reportMissing();
+    }
+  }
+
+  private reportMissing(): void {
+    if (!this.reportedMissing) {
+      this.reportedMissing = true;
+      this.log?.('keep-awake unavailable: install expo-keep-awake or react-native-keep-awake to keep the screen on during a run');
+    }
+  }
+}

package/src/agent-mode/layer-stacking.ts

@@ -0,0 +1,16 @@
+export class LayerStacking {
+  private openModals = 0;
+
+  constructor(private readonly countOpenModals: () => number) {}
+
+  baseline(): void {
+    this.openModals = this.countOpenModals();
+  }
+
+  coveredByNewModal(): boolean {
+    const current = this.countOpenModals();
+    const covered = current > this.openModals;
+    this.openModals = current;
+    return covered;
+  }
+}

package/src/agent-mode/markdown.ts

@@ -0,0 +1,84 @@
+export type InlineKind = 'text' | 'bold' | 'italic' | 'code' | 'link';
+
+export interface Inline {
+  kind: InlineKind;
+  text: string;
+}
+
+export type MarkdownBlock =
+  | { kind: 'paragraph'; inlines: Inline[] }
+  | { kind: 'bullet'; inlines: Inline[] }
+  | { kind: 'numbered'; marker: string; inlines: Inline[] };
+
+const INLINE_PATTERN = /(\*\*[^*]+\*\*|__[^_]+__|`[^`]+`|\[[^\]]+\]\([^)\s]+\)|\*[^*\s][^*]*\*|_[^_\s][^_]*_)/g;
+const BULLET = /^\s*[-*+]\s+(.*)$/;
+const NUMBERED = /^\s*(\d+)[.)]\s+(.*)$/;
+const HEADING = /^\s*#{1,6}\s+(.*)$/;
+
+function toInline(token: string): Inline {
+  if (token.startsWith('**') || token.startsWith('__')) {
+    return { kind: 'bold', text: token.slice(2, -2) };
+  }
+  if (token.startsWith('`')) {
+    return { kind: 'code', text: token.slice(1, -1) };
+  }
+  if (token.startsWith('[')) {
+    return { kind: 'link', text: token.slice(1, token.indexOf('](')) };
+  }
+  return { kind: 'italic', text: token.slice(1, -1) };
+}
+
+export function parseInlines(source: string): Inline[] {
+  const inlines: Inline[] = [];
+  let last = 0;
+  for (const match of source.matchAll(INLINE_PATTERN)) {
+    const index = match.index ?? 0;
+    if (index > last) {
+      inlines.push({ kind: 'text', text: source.slice(last, index) });
+    }
+    inlines.push(toInline(match[0]));
+    last = index + match[0].length;
+  }
+  if (last < source.length) {
+    inlines.push({ kind: 'text', text: source.slice(last) });
+  }
+  return inlines;
+}
+
+export function parseMarkdown(source: string): MarkdownBlock[] {
+  const blocks: MarkdownBlock[] = [];
+  let paragraph: string[] = [];
+  const flush = (): void => {
+    if (paragraph.length > 0) {
+      blocks.push({ kind: 'paragraph', inlines: parseInlines(paragraph.join(' ')) });
+      paragraph = [];
+    }
+  };
+  for (const line of source.split(/\r?\n/)) {
+    const heading = HEADING.exec(line);
+    const bullet = BULLET.exec(line);
+    const numbered = NUMBERED.exec(line);
+    if (line.trim() === '') {
+      flush();
+    } else if (heading !== null) {
+      flush();
+      blocks.push({ kind: 'paragraph', inlines: [{ kind: 'bold', text: heading[1] ?? '' }] });
+    } else if (bullet !== null) {
+      flush();
+      blocks.push({ kind: 'bullet', inlines: parseInlines(bullet[1] ?? '') });
+    } else if (numbered !== null) {
+      flush();
+      blocks.push({ kind: 'numbered', marker: `${numbered[1] ?? ''}.`, inlines: parseInlines(numbered[2] ?? '') });
+    } else {
+      paragraph.push(line.trim());
+    }
+  }
+  flush();
+  return blocks;
+}
+
+export function plainText(source: string): string {
+  return parseMarkdown(source)
+    .map((block) => block.inlines.map((inline) => inline.text).join(''))
+    .join(' ');
+}

package/src/agent-mode/panel-geometry.ts

@@ -0,0 +1,27 @@
+import type { Band, Rect } from '../host/rect.ts';
+
+export type PanelDock = 'bottom' | 'top';
+
+export const STACK_GAP = 12;
+
+export function freeBand(safeTop: number, stackTop: number, keyboardTop: number): Band {
+  return { top: safeTop + STACK_GAP, bottom: Math.min(stackTop, keyboardTop) - STACK_GAP };
+}
+
+export function messageCap(room: number): number {
+  return (Math.max(0, room) * 2) / 7;
+}
+
+function overlapArea(first: Rect, second: Rect): number {
+  const width = Math.min(first.x + first.width, second.x + second.width) - Math.max(first.x, second.x);
+  const height = Math.min(first.y + first.height, second.y + second.height) - Math.max(first.y, second.y);
+  return width > 0 && height > 0 ? width * height : 0;
+}
+
+export function chooseDock(target: Rect, bottomStack: Rect, topStack: Rect): PanelDock {
+  const underBottom = overlapArea(target, bottomStack);
+  if (underBottom === 0) {
+    return 'bottom';
+  }
+  return overlapArea(target, topStack) < underBottom ? 'top' : 'bottom';
+}

package/src/agent-mode/resume.ts

@@ -0,0 +1,16 @@
+import type { AgentModePhase } from './state.ts';
+
+export interface SavedRun {
+  sessionId: number;
+  lastAgentFrameAt: number;
+}
+
+export const RESUME_MAX_AGE_MS = 120_000;
+
+export function isResumable(run: SavedRun, sessionId: number, now: number): boolean {
+  return run.sessionId === sessionId && now - run.lastAgentFrameAt <= RESUME_MAX_AGE_MS;
+}
+
+export function shouldResumeAgentMode(input: { run: SavedRun | null; sessionId: number; phase: AgentModePhase; now: number }): boolean {
+  return input.run !== null && isResumable(input.run, input.sessionId, input.now) && input.phase === 'idle';
+}

package/src/agent-mode/run-memory.ts

@@ -0,0 +1,65 @@
+import { isRecord } from '../fiber/narrow.ts';
+import type { KeyValueStorage } from '../backend/storage.ts';
+import type { SavedRun } from './resume.ts';
+
+export interface RunMemory {
+  recall: () => SavedRun | null;
+  remember: (at: number) => void;
+  forget: () => void;
+}
+
+export const NO_RUN_MEMORY: RunMemory = {
+  recall: () => null,
+  remember: () => undefined,
+  forget: () => undefined,
+};
+
+function parseSavedRun(raw: string | null): SavedRun | null {
+  if (raw === null) {
+    return null;
+  }
+  try {
+    const parsed: unknown = JSON.parse(raw);
+    if (isRecord(parsed) && typeof parsed.sessionId === 'number' && typeof parsed.lastAgentFrameAt === 'number') {
+      return { sessionId: parsed.sessionId, lastAgentFrameAt: parsed.lastAgentFrameAt };
+    }
+    return null;
+  } catch {
+    return null;
+  }
+}
+
+export class StoredRunMemory implements RunMemory {
+  private saved: SavedRun | null = null;
+
+  constructor(
+    private readonly storage: KeyValueStorage,
+    private readonly key: string,
+    private readonly getSessionId: () => number | null,
+  ) {}
+
+  async load(): Promise<void> {
+    this.saved = parseSavedRun(await this.storage.getItem(this.key).catch(() => null));
+  }
+
+  recall(): SavedRun | null {
+    return this.saved;
+  }
+
+  remember(at: number): void {
+    const sessionId = this.getSessionId();
+    if (sessionId === null) {
+      return;
+    }
+    this.saved = { sessionId, lastAgentFrameAt: at };
+    void this.storage.setItem(this.key, JSON.stringify(this.saved)).catch(() => undefined);
+  }
+
+  forget(): void {
+    if (this.saved === null) {
+      return;
+    }
+    this.saved = null;
+    void this.storage.removeItem(this.key).catch(() => undefined);
+  }
+}

package/src/agent-mode/spotlight-controller.ts

@@ -0,0 +1,255 @@
+import type { ReadingRequest } from '../actions/services.ts';
+import type { TargetView } from '../actions/target.ts';
+import type { ConfirmationOutcome, ConfirmationRequest } from '../confirmation/port.ts';
+import type { Band, Rect } from '../host/rect.ts';
+import { readingTimeMs } from './bubbles.ts';
+import { type Hole, holeAround } from './spotlight.ts';
+import type { Timers } from './timers.ts';
+
+export type SpotlightSnapshot =
+  | { kind: 'none' }
+  | { kind: 'reading'; id: number; target: Rect; hole: Hole; text: string | null; durationMs: number; shown: boolean }
+  | { kind: 'confirming'; id: number; target: Rect | null; hole: Hole | null; request: ConfirmationRequest; shown: boolean };
+
+export interface SpotlightEnvironment {
+  timers: Timers;
+  isForeground: () => boolean;
+  stopRun: () => void;
+  alert: () => void;
+}
+
+type Listener = (snapshot: SpotlightSnapshot) => void;
+
+export const TRACK_MS = 33;
+export const CONFIRMATION_TIMEOUT_MS = 60_000;
+export const REVEAL_MAX_MS = 1_500;
+
+const SETTLE_MIN_MS = 150;
+const SETTLE_MAX_MS = 1_200;
+const SETTLE_STABLE_SAMPLES = 3;
+
+function sameRect(first: Rect, second: Rect): boolean {
+  return first.x === second.x && first.y === second.y && first.width === second.width && first.height === second.height;
+}
+
+export class SpotlightController {
+  private snapshot: SpotlightSnapshot = { kind: 'none' };
+
+  private readonly listeners = new Set<Listener>();
+
+  private finishReading: ((completed: boolean) => void) | null = null;
+
+  private readingTimer: unknown = null;
+
+  private finishConfirmation: ((outcome: ConfirmationOutcome) => void) | null = null;
+
+  private confirmationTimer: unknown = null;
+
+  private trackTimer: unknown = null;
+
+  private revealTimer: unknown = null;
+
+  private view: TargetView | null = null;
+
+  private placing: number | null = null;
+
+  private shown = 0;
+
+  constructor(private readonly environment: SpotlightEnvironment) {}
+
+  getSnapshot(): SpotlightSnapshot {
+    return this.snapshot;
+  }
+
+  subscribe(listener: Listener): () => void {
+    this.listeners.add(listener);
+    return () => this.listeners.delete(listener);
+  }
+
+  async read(request: ReadingRequest): Promise<boolean> {
+    this.endReading(true);
+    this.endConfirmation('declined');
+    if (!this.environment.isForeground()) {
+      return true;
+    }
+    const target = await request.measure();
+    if (target === null) {
+      return true;
+    }
+    this.shown += 1;
+    const id = this.shown;
+    const durationMs = readingTimeMs(request.text ?? '');
+    return new Promise((resolve) => {
+      this.finishReading = resolve;
+      this.publish({ kind: 'reading', id, target, hole: holeAround(target, request.radius), text: request.text, durationMs, shown: false });
+      this.awaitPlacement(id, request);
+    });
+  }
+
+  async confirm(request: ConfirmationRequest): Promise<ConfirmationOutcome> {
+    this.endReading(true);
+    this.endConfirmation('declined');
+    const target = request.target === null ? null : await request.target.measure();
+    this.shown += 1;
+    const id = this.shown;
+    return new Promise((resolve) => {
+      this.finishConfirmation = resolve;
+      const hole = target === null || request.target === null ? null : holeAround(target, request.target.radius);
+      this.publish({ kind: 'confirming', id, target, hole, request, shown: target === null });
+      this.confirmationTimer = this.environment.timers.set(() => this.endConfirmation('timed_out'), CONFIRMATION_TIMEOUT_MS);
+      if (request.target !== null) {
+        this.awaitPlacement(id, request.target);
+      }
+      this.environment.alert();
+    });
+  }
+
+  async place(id: number, band: Band): Promise<void> {
+    const current = this.snapshot;
+    if (current.kind === 'none' || current.id !== id || current.shown || this.placing === id) {
+      return;
+    }
+    this.placing = id;
+    const reveal = this.view?.reveal;
+    if (reveal !== undefined) {
+      await reveal(band);
+      await this.settle(id);
+    }
+    this.show(id);
+  }
+
+  approve(): void {
+    this.endConfirmation('confirmed');
+  }
+
+  cancel(): void {
+    if (this.finishConfirmation === null) {
+      return;
+    }
+    this.environment.stopRun();
+    this.endConfirmation('declined');
+  }
+
+  skip(): void {
+    this.endReading(true);
+  }
+
+  backgrounded(): void {
+    this.endReading(true);
+  }
+
+  clear(): void {
+    this.endReading(false);
+    this.endConfirmation('declined');
+  }
+
+  private awaitPlacement(id: number, view: TargetView): void {
+    this.view = view;
+    this.placing = null;
+    this.revealTimer = this.environment.timers.set(() => this.show(id), REVEAL_MAX_MS);
+    this.track(id, view);
+  }
+
+  private show(id: number): void {
+    const current = this.snapshot;
+    if (current.kind === 'none' || current.id !== id || current.shown) {
+      return;
+    }
+    this.clearTimer(this.revealTimer);
+    this.revealTimer = null;
+    this.publish({ ...current, shown: true });
+    if (current.kind === 'reading') {
+      this.readingTimer = this.environment.timers.set(() => this.endReading(true), current.durationMs);
+    }
+  }
+
+  private settle(id: number): Promise<void> {
+    const { timers } = this.environment;
+    const startedAt = timers.now();
+    return new Promise((resolve) => {
+      let last: Rect | null = null;
+      let stable = 0;
+      const sample = (): void => {
+        const current = this.snapshot;
+        if (current.kind === 'none' || current.id !== id) {
+          resolve();
+          return;
+        }
+        if (current.target !== null && last !== null && sameRect(current.target, last)) {
+          stable += 1;
+        } else {
+          stable = 0;
+          last = current.target;
+        }
+        const elapsed = timers.now() - startedAt;
+        if ((stable >= SETTLE_STABLE_SAMPLES && elapsed >= SETTLE_MIN_MS) || elapsed >= SETTLE_MAX_MS) {
+          resolve();
+          return;
+        }
+        timers.set(sample, TRACK_MS);
+      };
+      timers.set(sample, TRACK_MS);
+    });
+  }
+
+  private endConfirmation(outcome: ConfirmationOutcome): void {
+    const finish = this.finishConfirmation;
+    if (finish === null) {
+      return;
+    }
+    this.finishConfirmation = null;
+    this.clearTimer(this.confirmationTimer);
+    this.confirmationTimer = null;
+    this.stopTracking();
+    this.publish({ kind: 'none' });
+    finish(outcome);
+  }
+
+  private endReading(completed: boolean): void {
+    const finish = this.finishReading;
+    if (finish === null) {
+      return;
+    }
+    this.finishReading = null;
+    this.clearTimer(this.readingTimer);
+    this.readingTimer = null;
+    this.stopTracking();
+    this.publish({ kind: 'none' });
+    finish(completed);
+  }
+
+  private track(id: number, target: TargetView): void {
+    this.trackTimer = this.environment.timers.set(() => {
+      void target.measure().then((rect) => {
+        const current = this.snapshot;
+        if (current.kind === 'none' || current.id !== id) {
+          return;
+        }
+        if (rect !== null && (current.target === null || !sameRect(rect, current.target))) {
+          this.publish({ ...current, target: rect, hole: holeAround(rect, target.radius) });
+        }
+        this.track(id, target);
+      });
+    }, TRACK_MS);
+  }
+
+  private stopTracking(): void {
+    this.clearTimer(this.trackTimer);
+    this.trackTimer = null;
+    this.clearTimer(this.revealTimer);
+    this.revealTimer = null;
+    this.view = null;
+    this.placing = null;
+  }
+
+  private clearTimer(handle: unknown): void {
+    if (handle !== null) {
+      this.environment.timers.clear(handle);
+    }
+  }
+
+  private publish(next: SpotlightSnapshot): void {
+    this.snapshot = next;
+    this.listeners.forEach((listener) => listener(next));
+  }
+}

package/src/agent-mode/spotlight.ts

@@ -0,0 +1,14 @@
+import type { Rect } from '../host/rect.ts';
+
+export interface Hole extends Rect {
+  radius: number;
+}
+
+export const HOLE_PADDING = 8;
+
+export function holeAround(target: Rect, elementRadius: number): Hole {
+  const width = target.width + HOLE_PADDING * 2;
+  const height = target.height + HOLE_PADDING * 2;
+  const radius = Math.max(0, Math.min(elementRadius, width / 2, height / 2)) + HOLE_PADDING / 2;
+  return { x: target.x - HOLE_PADDING, y: target.y - HOLE_PADDING, width, height, radius };
+}

package/src/agent-mode/state.ts

@@ -0,0 +1,36 @@
+export type AgentModePhase = 'idle' | 'pending' | 'active' | 'exiting';
+
+const VALID_TRANSITIONS: Readonly<Record<AgentModePhase, readonly AgentModePhase[]>> = {
+  idle: ['pending', 'active'],
+  pending: ['active', 'idle'],
+  active: ['exiting'],
+  exiting: ['idle'],
+};
+
+export class AgentModeStateMachine {
+  private phase: AgentModePhase = 'idle';
+
+  getPhase(): AgentModePhase {
+    return this.phase;
+  }
+
+  isActive(): boolean {
+    return this.phase === 'active';
+  }
+
+  isEngaged(): boolean {
+    return this.phase === 'active' || this.phase === 'exiting';
+  }
+
+  transition(to: AgentModePhase): boolean {
+    if (this.phase === to || !VALID_TRANSITIONS[this.phase].includes(to)) {
+      return false;
+    }
+    this.phase = to;
+    return true;
+  }
+
+  forceIdle(): void {
+    this.phase = 'idle';
+  }
+}

package/src/agent-mode/status.ts

@@ -0,0 +1,13 @@
+export type AgentStatus = { kind: 'thinking' } | { kind: 'executing' } | { kind: 'text'; text: string };
+
+export const THINKING: AgentStatus = { kind: 'thinking' };
+export const EXECUTING: AgentStatus = { kind: 'executing' };
+
+const TRAILING_ELLIPSIS = /(\.\.\.|…)$/;
+
+export function isStepMessage(message: string, progressType: string | null): boolean {
+  if (progressType !== null && progressType.length > 0) {
+    return progressType === 'step';
+  }
+  return !TRAILING_ELLIPSIS.test(message.trim());
+}