@blario/react-native 0.1.3 → 0.1.5

package/src/fiber/text.ts

@@ -3,6 +3,8 @@ import type { Fiber } from './types.ts';
 
 const PRIVATE_USE_GLYPHS = /[-\u{F0000}-\u{10FFFF}]/gu;
 
+export const TEXT_HOST_TYPE = 'RCTText';
+
 export function normalizeText(value: string): string {
   return value.replace(PRIVATE_USE_GLYPHS, '').replace(/\s+/g, ' ').trim();
 }

package/src/snapshot/capture.ts

@@ -124,6 +124,7 @@ export class SnapshotCapturer {
         rect,
         scroll: candidate.kind === 'scroll' ? describeScrollDirections(geometries.get(candidate.fiber) ?? null) : null,
         offscreen,
+        wheelOption: candidate.wheelOption,
       }),
     );
     if (mode === 'register') {

package/src/snapshot/collect.ts

@@ -1,10 +1,11 @@
 import { childrenOf, componentName, firstHostDescendant, isHostComponent, propsOf } from '../fiber/reader.ts';
-import { collectText } from '../fiber/text.ts';
+import { collectText, TEXT_HOST_TYPE } from '../fiber/text.ts';
 import type { Fiber } from '../fiber/types.ts';
 import { classify } from './classify.ts';
 import type { ElementKind } from './kinds.ts';
 import { isFocusedScreen, type ScreenRef, screenOf } from './navigation.ts';
 import { roleOf } from './properties.ts';
+import { isWheel } from './scroll.ts';
 
 export const AGENT_OVERLAY_TEST_ID = 'blar-agent-overlay';
 
@@ -14,10 +15,11 @@ export interface Candidate {
   host: Fiber;
   ancestors: Fiber[];
   scrollContainers: Fiber[];
+  wheelOption?: boolean;
 }
 
 const MODAL_COMPONENT_NAME = 'Modal';
-const TEXT_HOST_TYPE = 'RCTText';
+const WHEEL_OPTION_LIMIT = 24;
 const TEXT_BLOCK_LIMIT = 800;
 const HEADING_ROLES: readonly string[] = ['header', 'heading'];
 
@@ -75,6 +77,9 @@ export function collect(root: Fiber): Collected {
     const block = readTextBlock(fiber, ancestors, scrollContainers);
     if (block !== null) {
       textBlocks.push(block);
+      if (isWheelOption(block)) {
+        candidates.push({ kind: 'button', fiber, host: fiber, ancestors: block.ancestors, scrollContainers: block.scrollContainers, wheelOption: true });
+      }
     }
     ancestors.push(fiber);
     if (kind === 'scroll') {
@@ -118,6 +123,14 @@ function readTextBlock(fiber: Fiber, ancestors: Fiber[], scrollContainers: Fiber
   };
 }
 
+function isWheelOption(block: TextBlock): boolean {
+  const wheel = block.scrollContainers[block.scrollContainers.length - 1];
+  if (wheel === undefined || !isWheel(wheel) || block.text.length > WHEEL_OPTION_LIMIT) {
+    return false;
+  }
+  return !block.ancestors.slice(block.ancestors.lastIndexOf(wheel)).some((ancestor) => classify(ancestor) === 'button');
+}
+
 export function isOpenModal(fiber: Fiber): boolean {
   return componentName(fiber) === MODAL_COMPONENT_NAME && fiber.child !== null && propsOf(fiber).visible !== false;
 }

package/src/snapshot/render.ts

@@ -51,6 +51,7 @@ function renderButton(view: ElementView, twins: number): string {
   const tag = openTag('button', [
     ['role', view.role],
     ['testID', view.testID],
+    ['list', view.list],
     ['icon', view.icon],
     ['offscreen', view.offscreen],
     ...commonStateAttributes(view),
@@ -94,6 +95,7 @@ function renderSwitch(view: ElementView, twins: number): string {
 function renderScroll(view: ElementView): string {
   const tag = openTag('scroll', [
     ['testID', view.testID],
+    ['list', view.list],
     ['scroll', view.scroll],
   ]);
   return `${tag} />`;
@@ -113,7 +115,7 @@ function renderBody(view: ElementView, twins: number): string {
 }
 
 export function twinSignature(view: ElementView): string {
-  return [view.kind, view.label, view.icon ?? '', view.role ?? ''].join('|');
+  return [view.kind, view.label, view.icon ?? '', view.role ?? '', view.list ?? ''].join('|');
 }
 
 export function countTwins(views: ElementView[]): Map<string, number> {

package/src/snapshot/scroll.ts

@@ -43,6 +43,12 @@ export function isHorizontal(fiber: Fiber): boolean {
   return propsOf(fiber).horizontal === true;
 }
 
+// A wheel picker: a snapping list whose rows are plain text, where scrolling a row into the center is what selects it.
+export function isWheel(fiber: Fiber): boolean {
+  const { snapToInterval, snapToOffsets } = propsOf(fiber);
+  return typeof snapToInterval === 'number' || Array.isArray(snapToOffsets);
+}
+
 export async function measureScrollGeometry(scrollFiber: Fiber): Promise<ScrollGeometry | null> {
   const scrollHost = findScrollHost(scrollFiber);
   if (scrollHost === null) {
@@ -73,6 +79,12 @@ export function viewportExtentOf(geometry: ScrollGeometry): number {
   return geometry.horizontal ? geometry.viewport.width : geometry.viewport.height;
 }
 
+export function offsetCentering(rect: Rect, geometry: ScrollGeometry): number {
+  const { viewport, horizontal } = geometry;
+  const delta = horizontal ? rect.x + rect.width / 2 - (viewport.x + viewport.width / 2) : rect.y + rect.height / 2 - (viewport.y + viewport.height / 2);
+  return Math.min(Math.max(scrollOffsetOf(geometry) + delta, 0), maxScrollOffsetOf(geometry));
+}
+
 export function scrollDirectionsOf(geometry: ScrollGeometry): ScrollDirection[] {
   const offset = scrollOffsetOf(geometry);
   const canBackward = offset > SCROLL_TOLERANCE;

package/src/snapshot/view.ts

@@ -2,6 +2,7 @@ import { collectText, precedingText } from '../fiber/text.ts';
 import { propsOf } from '../fiber/reader.ts';
 import type { Fiber } from '../fiber/types.ts';
 import type { Rect } from '../host/rect.ts';
+import { scrollInstanceOf } from './classify.ts';
 import { iconNameIn } from './icon.ts';
 import type { Offscreen } from './visibility.ts';
 import type { ElementKind } from './kinds.ts';
@@ -33,9 +34,24 @@ export interface ElementView {
   selected: boolean | null;
   scroll: string | null;
   offscreen: Offscreen | null;
+  list: string | null;
   rect: Rect;
 }
 
+const LIST_NAME_DEPTH = 8;
+
+// What a list is called: hosts name the view around it, as AgendaPro does with Hours and Minutes.
+export function listNameOf(list: Fiber, ancestors: Fiber[]): string | null {
+  for (const fiber of [list, ...ancestors.slice(-LIST_NAME_DEPTH).reverse()]) {
+    const props = propsOf(fiber);
+    const name = explicitLabelOf(props) ?? testIdOf(props);
+    if (name !== null) {
+      return name;
+    }
+  }
+  return null;
+}
+
 function labelFor(kind: ElementKind, fiber: Fiber, ancestors: Fiber[]): string {
   const explicit = explicitLabelOf(propsOf(fiber));
   if (explicit !== null) {
@@ -57,6 +73,23 @@ export interface ViewSource {
   rect: Rect;
   scroll: string | null;
   offscreen?: Offscreen | null;
+  wheelOption?: boolean;
+}
+
+function listOfView({ kind, fiber, ancestors, wheelOption }: ViewSource): string | null {
+  if (kind === 'scroll') {
+    return listNameOf(fiber, ancestors);
+  }
+  if (wheelOption !== true) {
+    return null;
+  }
+  for (let index = ancestors.length - 1; index >= 0; index -= 1) {
+    const ancestor = ancestors[index];
+    if (ancestor !== undefined && scrollInstanceOf(ancestor) !== null) {
+      return listNameOf(ancestor, ancestors.slice(0, index));
+    }
+  }
+  return null;
 }
 
 export function buildView(source: ViewSource): ElementView {
@@ -82,6 +115,7 @@ export function buildView(source: ViewSource): ElementView {
     selected: flags.selected,
     scroll,
     offscreen,
+    list: listOfView(source),
     rect,
   };
 }

package/src/snapshot/wrappers.ts

@@ -60,7 +60,8 @@ export function dropWrapperDuplicates(measured: MeasuredCandidate[]): MeasuredCa
 const OFFSCREEN_LIMIT = 30;
 
 export function limitOffscreen(measured: MeasuredCandidate[]): MeasuredCandidate[] {
-  const hidden = measured.filter((entry) => entry.offscreen !== null && entry.candidate.kind !== 'scroll');
+  // Every option of a wheel stays listed: one dropped here could never be selected.
+  const hidden = measured.filter((entry) => entry.offscreen !== null && entry.candidate.kind !== 'scroll' && entry.candidate.wheelOption !== true);
   if (hidden.length <= OFFSCREEN_LIMIT) {
     return measured;
   }

package/src/version.ts

@@ -1 +1 @@
-export const SDK_VERSION = '0.1.3';
+export const SDK_VERSION = '0.1.5';