@mobileai/react-native 0.5.5 → 0.5.6

package/src/core/AgentRuntime.ts

@@ -1,5 +1,5 @@
 /**
- * AgentRuntime — The main agent loop, inspired by page-agent.js.
+ * AgentRuntime — The main agent loop.
  *
  * Flow:
  * 1. Walk Fiber tree → detect interactive elements
@@ -52,7 +52,7 @@ export class AgentRuntime {
 
     this.registerBuiltInTools();
 
-    // Apply customTools — mirrors page-agent: null = remove, otherwise override
+    // Apply customTools
     if (config.customTools) {
       for (const [name, tool] of Object.entries(config.customTools)) {
         if (tool === null) {
@@ -237,7 +237,7 @@ export class AgentRuntime {
       },
     });
 
-    // ask_user — ask for clarification (mirrors page-agent: blocks until user responds)
+    // ask_user — ask for clarification
     this.tools.set('ask_user', {
       name: 'ask_user',
       description: 'Ask the user a question and wait for their answer. Use this if you need more information or clarification.',
@@ -246,7 +246,7 @@ export class AgentRuntime {
       },
       execute: async (args) => {
         if (this.config.onAskUser) {
-          // Page-agent pattern: block until user responds, then continue the loop
+          // Block until user responds, then continue the loop
           this.config.onStatusUpdate?.('Waiting for your answer...');
           const answer = await this.config.onAskUser(args.question);
           return `User answered: ${answer}`;
@@ -444,7 +444,7 @@ export class AgentRuntime {
   /**
    * Get current screen context as formatted text.
    * Used by voice mode: sent once at connect + after each tool call.
-   * Follows page-agent pattern: tree in user prompt, not system instructions.
+   * Tree goes in user prompt, not system instructions.
    */
   public getScreenContext(): string {
     try {
@@ -531,7 +531,7 @@ ${screen.elementsText}
     };
   }
 
-  // ─── Instructions (mirrors page-agent #getInstructions) ───────
+  // ─── Instructions ───────
 
   private getInstructions(screenName: string): string {
     const { instructions } = this.config;
@@ -556,7 +556,7 @@ ${screen.elementsText}
     return result ? `<instructions>\n${result}</instructions>\n\n` : '';
   }
 
-  // ─── Observation System (mirrors PageAgentCore.#handleObservations) ──
+  // ─── Observation System ──
 
   private observations: string[] = [];
   private lastScreenName: string = '';
@@ -581,7 +581,7 @@ ${screen.elementsText}
     }
   }
 
-  // ─── User Prompt Assembly (mirrors PageAgentCore.#assembleUserPrompt) ──
+  // ─── User Prompt Assembly ──
 
   private assembleUserPrompt(
     step: number,
@@ -595,7 +595,7 @@ ${screen.elementsText}
     // 1. <instructions> (optional system/screen instructions)
     prompt += this.getInstructions(screenName);
 
-    // 2. <agent_state> — user request + step info (mirrors page-agent)
+    // 2. <agent_state> — user request + step info
     prompt += '<agent_state>\n';
     prompt += '<user_request>\n';
     prompt += `${contextualMessage}\n`;
@@ -605,7 +605,7 @@ ${screen.elementsText}
     prompt += '</step_info>\n';
     prompt += '</agent_state>\n\n';
 
-    // 3. <agent_history> — structured per-step history (mirrors page-agent)
+    // 3. <agent_history> — structured per-step history
     prompt += '<agent_history>\n';
 
     let stepIndex = 0;
@@ -667,14 +667,14 @@ ${screen.elementsText}
 
     logger.info('AgentRuntime', `Starting execution: "${contextualMessage}"`);
 
-    // Lifecycle: onBeforeTask (mirrors page-agent)
+    // Lifecycle: onBeforeTask
     await this.config.onBeforeTask?.();
 
     try {
       for (let step = 0; step < maxSteps; step++) {
         logger.info('AgentRuntime', `===== Step ${step + 1}/${maxSteps} =====`);
 
-        // Lifecycle: onBeforeStep (mirrors page-agent)
+        // Lifecycle: onBeforeStep
         await this.config.onBeforeStep?.(step);
 
         // 1. Walk Fiber tree with security config and dehydrate screen
@@ -690,16 +690,16 @@ ${screen.elementsText}
         logger.info('AgentRuntime', `Screen: ${screen.screenName}`);
         logger.debug('AgentRuntime', `Dehydrated:\n${screen.elementsText}`);
 
-        // 2. Apply transformScreenContent (mirrors page-agent transformPageContent)
+        // 2. Apply transformScreenContent
         let screenContent = screen.elementsText;
         if (this.config.transformScreenContent) {
           screenContent = await this.config.transformScreenContent(screenContent);
         }
 
-        // 3. Handle observations (mirrors page-agent #handleObservations)
+        // 3. Handle observations
         this.handleObservations(step, maxSteps, screenName);
 
-        // 4. Assemble structured user prompt (mirrors page-agent #assembleUserPrompt)
+        // 4. Assemble structured user prompt
         const contextMessage = this.assembleUserPrompt(
           step, maxSteps, contextualMessage, screenName, screenContent,
         );
@@ -709,7 +709,7 @@ ${screen.elementsText}
 
         // 5. Send to AI provider
         this.config.onStatusUpdate?.('Analyzing screen...');
-        const systemPrompt = buildSystemPrompt(this.config.language || 'en');
+        const systemPrompt = buildSystemPrompt('en');
         const tools = this.buildToolsForProvider();
 
         logger.info('AgentRuntime', `Sending to AI with ${tools.length} tools...`);
@@ -789,7 +789,7 @@ ${screen.elementsText}
         };
         this.history.push(agentStep);
 
-        // Lifecycle: onAfterStep (mirrors page-agent)
+        // Lifecycle: onAfterStep
         await this.config.onAfterStep?.(this.history);
 
         // Check if done
@@ -817,7 +817,7 @@ ${screen.elementsText}
           return result;
         }
 
-        // Step delay (mirrors page-agent stepDelay)
+        // Step delay
         await new Promise(resolve => setTimeout(resolve, stepDelay));
       }
 

package/src/core/FiberTreeWalker.ts

@@ -1,22 +1,21 @@
 /**
  * FiberTreeWalker — Traverses React's Fiber tree to discover interactive elements.
  *
- * This is the React Native equivalent of page-agent.js reading the DOM.
+ * Walks the React Native fiber tree to extract a text representation of the UI.
  * Instead of traversing HTML nodes, we traverse React Fiber nodes and detect
  * interactive elements by their type and props (onPress, onChangeText, etc.).
  *
- * Architecture inspired by: https://github.com/alibaba/page-agent
  */
 
 import { logger } from '../utils/logger';
 import type { InteractiveElement, ElementType } from './types';
 
-// ─── Walk Configuration (mirrors page-agent DomConfig) ─────────
+// ─── Walk Configuration ─────────
 
 export interface WalkConfig {
-  /** React refs of elements to exclude — mirrors page-agent interactiveBlacklist */
+  /** React refs of elements to exclude */
   interactiveBlacklist?: React.RefObject<any>[];
-  /** If set, only these elements are interactive — mirrors page-agent interactiveWhitelist */
+  /** If set, only these elements are interactive */
   interactiveWhitelist?: React.RefObject<any>[];
 }
 
@@ -53,14 +52,14 @@ const RN_INTERNAL_NAMES = new Set([
   'AnimatedComponentWrapper', 'Animated',
 ]);
 
-// ─── State Extraction (mirrors page-agent DEFAULT_INCLUDE_ATTRIBUTES) ──
+// ─── State Extraction ──
 
 /** Props to extract as state attributes — covers lazy devs who skip accessibility */
 const STATE_PROPS = ['value', 'checked', 'selected', 'active', 'on', 'isOn', 'toggled', 'enabled'];
 
 /**
  * Extract state attributes from a fiber node's props.
- * Mirrors page-agent's DEFAULT_INCLUDE_ATTRIBUTES extraction.
+ * Extracts meaningful state from a fiber node.
  * Priority: accessibilityState > accessibilityRole > direct scalar props.
  */
 function extractStateAttributes(props: any): string {
@@ -319,7 +318,7 @@ function getFiberFromRef(ref: any): any | null {
 
 /**
  * Check if a Fiber node matches any ref in the given list.
- * Mirrors page-agent.js: `interactiveBlacklist.includes(element)`
+ * Checks if an element is excluded from AI interaction
  * We compare the Fiber's stateNode (native instance) against ref.current.
  */
 function matchesRefList(node: any, refs?: React.RefObject<any>[]): boolean {
@@ -402,7 +401,7 @@ export function walkFiberTree(rootRef: any, config?: WalkConfig): WalkResult {
         props: { ...props },
       });
 
-      // Build output tag with state attributes (mirrors page-agent format)
+      // Build output tag with state attributes
       const stateAttrs = extractStateAttributes(props);
       const attrStr = stateAttrs ? ` ${stateAttrs}` : '';
       const textContent = label || '';

package/src/core/ScreenDehydrator.ts

@@ -1,6 +1,6 @@
 /**
  * ScreenDehydrator — Converts discovered interactive elements into
- * a text representation for the LLM, matching page-agent.js format.
+ * a text representation for the LLM.
  *
  * Output example:
  * ```

package/src/core/systemPrompt.ts

@@ -1,8 +1,8 @@
 /**
- * System prompt for the AI agent — adapted from page-agent reference.
+ * System prompt for the AI agent.
  *
  * Separated into its own file for maintainability.
- * The prompt uses XML-style tags (matching page-agent's structure)
+ * The prompt uses XML-style tags
  * to give the LLM clear, structured instructions.
  */
 

package/src/core/types.ts

@@ -1,5 +1,5 @@
 /**
- * Core types for the page-agent-style React Native AI SDK.
+ * Core types for the React Native AI SDK.
  */
 
 // ─── Agent Modes ──────────────────────────────────────────────
@@ -61,27 +61,27 @@ export interface AgentStep {
 export interface AgentConfig {
   apiKey: string;
   model?: string;
-  language?: 'en' | 'ar';
 
-  /** Maximum steps per task (page-agent default: 40) */
+
+  /** Maximum steps per task */
   maxSteps?: number;
 
-  // ─── Element Gating (mirrors page-agent interactiveBlacklist/Whitelist) ──
+  // ─── Element Gating ──
 
   /**
    * React refs of elements the AI must NOT interact with.
-   * Mirrors page-agent.js `interactiveBlacklist: Element[]`.
+   * Refs of elements the AI must NOT interact with.
    * The Fiber walker skips any node whose ref matches one in this list.
    */
   interactiveBlacklist?: React.RefObject<any>[];
 
   /**
    * If set, the AI can ONLY interact with these elements.
-   * Mirrors page-agent.js `interactiveWhitelist: Element[]`.
+   * If set, AI can ONLY interact with these elements.
    */
   interactiveWhitelist?: React.RefObject<any>[];
 
-  // ─── Lifecycle Hooks (mirrors page-agent onBefore/AfterStep/Task) ───────
+  // ─── Lifecycle Hooks ───────
 
   /** Called before each agent step. */
   onBeforeStep?: (stepCount: number) => Promise<void> | void;
@@ -95,25 +95,25 @@ export interface AgentConfig {
   /** Called after task completes (success or failure). */
   onAfterTask?: (result: ExecutionResult) => Promise<void> | void;
 
-  // ─── Content Masking (mirrors page-agent transformPageContent) ──────────
+  // ─── Content Masking ──────────
 
   /**
    * Transform dehydrated screen text before sending to LLM.
    * Use to mask sensitive data (credit cards, PII, etc).
-   * Mirrors page-agent.js `transformPageContent`.
+   * Transform screen content before the LLM sees it (for data masking).
    */
   transformScreenContent?: (content: string) => Promise<string> | string;
 
-  // ─── Custom Tools (mirrors page-agent customTools) ─────────────────────
+  // ─── Custom Tools ─────────────────────
 
   /**
    * Override or remove built-in tools.
    * Set tool to `null` to remove it (e.g., `{ navigate: null }`).
-   * Mirrors page-agent.js `customTools: Record<string, Tool | null>`.
+   * Override or remove built-in tools (null = remove).
    */
   customTools?: Record<string, ToolDefinition | null>;
 
-  // ─── Instructions (mirrors page-agent instructions) ────────────────────
+  // ─── Instructions ────────────────────
 
   /** Instructions to guide the agent's behavior. */
   instructions?: {
@@ -122,12 +122,12 @@ export interface AgentConfig {
     /**
      * Dynamic per-screen instructions callback.
      * Called before each step to get instructions for the current screen.
-     * Mirrors page-agent.js `getPageInstructions(url)`.
+     * Per-screen instructions callback.
      */
     getScreenInstructions?: (screenName: string) => string | undefined | null;
   };
 
-  /** Delay between steps in ms (page-agent default: 400ms). */
+  /** Delay between steps in ms. */
   stepDelay?: number;
 
   // ─── Status Updates ──────────────────────────────────────────────────────
@@ -146,7 +146,7 @@ export interface AgentConfig {
 
   /**
    * Callback for when agent needs user input (ask_user tool).
-   * Mirrors page-agent: the agent loop blocks until the user responds.
+   * The agent loop blocks until the user responds.
    * If not set, ask_user tool will break the loop (legacy behavior).
    * @example onAskUser: (q) => new Promise(resolve => showPrompt(q, resolve))
    */

package/src/index.ts

@@ -1,5 +1,5 @@
 /**
- * @mobileai/react-native — Page-Agent Architecture
+ * @mobileai/react-native
  *
  * Zero-wrapper AI agent for React Native.
  * Auto-detects interactive elements via React Fiber tree traversal.

package/lib/typescript/fetch-models.d.mts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=fetch-models.d.mts.map

package/lib/typescript/fetch-models.d.mts.map

@@ -1 +0,0 @@
-{"version":3,"file":"fetch-models.d.mts","sourceRoot":"","sources":["../../fetch-models.mjs"],"names":[],"mappings":""}

package/lib/typescript/list-all-models.d.mts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=list-all-models.d.mts.map

package/lib/typescript/list-all-models.d.mts.map

@@ -1 +0,0 @@
-{"version":3,"file":"list-all-models.d.mts","sourceRoot":"","sources":["../../list-all-models.mjs"],"names":[],"mappings":""}

package/lib/typescript/list-models.d.mts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=list-models.d.mts.map

package/lib/typescript/list-models.d.mts.map

@@ -1 +0,0 @@
-{"version":3,"file":"list-models.d.mts","sourceRoot":"","sources":["../../list-models.mjs"],"names":[],"mappings":""}