yaver-feedback-react-native 0.5.3 → 0.5.5

package/README.md

@@ -4,6 +4,14 @@ Visual feedback SDK for Yaver. Lets testers and developers shake their phone (or
 
 ## Installation
 
+```bash
+npm install -g yaver-cli
+cd your-app
+yaver feedback setup
+```
+
+Manual fallback:
+
 ```bash
 npm install yaver-feedback-react-native
 ```
@@ -566,12 +574,34 @@ YaverFeedback.init({
 });
 ```
 
+## Running Inside the Yaver Mobile App (super-host)
+
+When a third-party app is loaded through Yaver's Hermes-push flow (so the
+Yaver mobile app is the runtime container for your app), the SDK detects
+that situation via the `YaverInfo` native module and **automatically
+no-ops `YaverFeedback.init()`** — no ShakeDetector, no FeedbackModal, no
+BlackBox stream from inside the guest. The user only ever sees Yaver's
+native shake overlay ("Reload" + "Back to Yaver") and uses Yaver's
+built-in feedback flow instead.
+
+Standalone installs (TestFlight / App Store / Play from your own dev
+account) are unaffected — the SDK behaves exactly as it did before.
+
+If you need to opt out of the auto-suppression in a specific build (for
+example, to compare behaviour in a super-host smoke test), set
+`enabled: true` explicitly — the Yaver-host gate runs before the
+`enabled` flag is evaluated on purpose.
+
 ## Trigger Modes
 
 ### Shake (default)
 
 Shake the device to open the feedback modal. Uses the built-in shake event on iOS and `ShakeEvent` on Android.
 
+When the app is loaded inside the Yaver mobile app (super-host), the
+SDK yields shake handling to Yaver's native overlay — see the
+"Running Inside the Yaver Mobile App" section above.
+
 ```typescript
 YaverFeedback.init({ authToken, trigger: 'shake' });
 ```

package/dist/AuthOverlay.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+/**
+ * Presentation layer for the SDK's auth + machine-picker modals.
+ *
+ * Mounts automatically inside `<FeedbackModal />`, so consumers of the SDK
+ * get in-app login with no extra wiring. It listens for events emitted by
+ * `YaverFeedback.showLogin()` / `showMachinePicker()`:
+ *
+ *   yaverFeedback:startLogin          → show login modal
+ *   yaverFeedback:startMachinePicker  → show machine picker
+ *
+ * The overlay closes itself once login/pick succeeds, then re-emits
+ * `yaverFeedback:startReport` so the user continues straight into the
+ * feedback flow they originally triggered.
+ */
+export declare const AuthOverlay: React.FC;

package/dist/AuthOverlay.js

@@ -0,0 +1,104 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AuthOverlay = void 0;
+const react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const LoginScreen_1 = require("./LoginScreen");
+const MachinePickerScreen_1 = require("./MachinePickerScreen");
+const YaverFeedback_1 = require("./YaverFeedback");
+const auth_1 = require("./auth");
+/**
+ * Presentation layer for the SDK's auth + machine-picker modals.
+ *
+ * Mounts automatically inside `<FeedbackModal />`, so consumers of the SDK
+ * get in-app login with no extra wiring. It listens for events emitted by
+ * `YaverFeedback.showLogin()` / `showMachinePicker()`:
+ *
+ *   yaverFeedback:startLogin          → show login modal
+ *   yaverFeedback:startMachinePicker  → show machine picker
+ *
+ * The overlay closes itself once login/pick succeeds, then re-emits
+ * `yaverFeedback:startReport` so the user continues straight into the
+ * feedback flow they originally triggered.
+ */
+const AuthOverlay = () => {
+    const [loginVisible, setLoginVisible] = (0, react_1.useState)(false);
+    const [pickerVisible, setPickerVisible] = (0, react_1.useState)(false);
+    const [token, setToken] = (0, react_1.useState)(null);
+    (0, react_1.useEffect)(() => {
+        let mounted = true;
+        (async () => {
+            const cached = await (0, auth_1.getToken)();
+            if (mounted && cached)
+                setToken(cached);
+        })();
+        const loginSub = react_native_1.DeviceEventEmitter.addListener('yaverFeedback:startLogin', () => setLoginVisible(true));
+        const pickerSub = react_native_1.DeviceEventEmitter.addListener('yaverFeedback:startMachinePicker', async () => {
+            const cached = await (0, auth_1.getToken)();
+            if (cached)
+                setToken(cached);
+            if (cached)
+                setPickerVisible(true);
+        });
+        return () => {
+            mounted = false;
+            loginSub.remove();
+            pickerSub.remove();
+        };
+    }, []);
+    const handleLoggedIn = async (newToken) => {
+        setToken(newToken);
+        await YaverFeedback_1.YaverFeedback.setAuthToken(newToken);
+        setLoginVisible(false);
+        setPickerVisible(true);
+    };
+    const handleDevicePicked = async (device) => {
+        await YaverFeedback_1.YaverFeedback.setPreferredDevice(device.deviceId);
+        setPickerVisible(false);
+        // Continue straight into the feedback flow the user originally triggered.
+        react_native_1.DeviceEventEmitter.emit('yaverFeedback:startReport');
+    };
+    return (<>
+      <react_native_1.Modal visible={loginVisible} animationType="slide" presentationStyle="fullScreen" onRequestClose={() => setLoginVisible(false)}>
+        <LoginScreen_1.YaverLoginScreen onLoggedIn={handleLoggedIn} onCancel={() => setLoginVisible(false)}/>
+      </react_native_1.Modal>
+
+      <react_native_1.Modal visible={pickerVisible && !!token} animationType="slide" presentationStyle="fullScreen" onRequestClose={() => setPickerVisible(false)}>
+        {token && (<MachinePickerScreen_1.YaverMachinePickerScreen token={token} onPick={handleDevicePicked} onCancel={() => setPickerVisible(false)}/>)}
+      </react_native_1.Modal>
+    </>);
+};
+exports.AuthOverlay = AuthOverlay;

package/dist/BlackBox.d.ts

@@ -0,0 +1,154 @@
+/**
+ * Black box event types streamed from the device to the agent.
+ * These mirror the Go BlackBoxEvent struct on the agent side.
+ */
+export interface BlackBoxEvent {
+    type: 'log' | 'error' | 'navigation' | 'lifecycle' | 'network' | 'state' | 'render' | 'track';
+    level?: 'info' | 'warn' | 'error';
+    message: string;
+    timestamp: number;
+    stack?: string[];
+    isFatal?: boolean;
+    metadata?: Record<string, unknown>;
+    source?: string;
+    duration?: number;
+    route?: string;
+    prevRoute?: string;
+}
+/** Configuration for the black box stream. */
+export interface BlackBoxConfig {
+    /** Device identifier (defaults to a generated UUID). */
+    deviceId?: string;
+    /** Application name for the agent to display. */
+    appName?: string;
+    /** Flush interval in ms — how often buffered events are sent. Default: 2000. */
+    flushInterval?: number;
+    /** Max events to buffer before flushing. Default: 50. */
+    maxBufferSize?: number;
+}
+/**
+ * Flight-recorder-style streaming from the device to the Yaver agent.
+ *
+ * Captures logs, errors, navigation, lifecycle events, network requests,
+ * and state changes — then streams them continuously to the agent's
+ * `/blackbox/events` endpoint.
+ *
+ * The agent uses this context when the developer asks for a fix — it
+ * already knows what the app was doing.
+ *
+ * **Does not hijack any global handlers.** All capture is explicit:
+ * - Call `BlackBox.log()` / `.warn()` / `.error()` for console-style logs
+ * - Call `BlackBox.navigation()` for screen changes
+ * - Call `BlackBox.networkRequest()` for HTTP activity
+ * - Use `BlackBox.wrapConsole()` to intercept console.log/warn/error
+ *   (only if you explicitly opt in — no auto-hooking)
+ */
+/** Command received from the agent via the SSE command channel. */
+export interface BlackBoxCommand {
+    command: string;
+    data?: Record<string, unknown>;
+}
+/** Callback type for handling agent commands. */
+export type CommandHandler = (cmd: BlackBoxCommand) => void;
+export declare class BlackBox {
+    private static baseUrl;
+    private static authToken;
+    private static deviceId;
+    private static appName;
+    private static buffer;
+    private static flushTimer;
+    private static flushInterval;
+    private static maxBufferSize;
+    private static started;
+    private static originalConsole;
+    private static sseAbortController;
+    private static sseReconnectTimer;
+    private static commandHandlers;
+    private static sseConnected;
+    /**
+     * Start the black box stream. Call after `YaverFeedback.init()`.
+     *
+     * The stream sends buffered events to the agent every `flushInterval` ms,
+     * or immediately when the buffer reaches `maxBufferSize`.
+     */
+    static start(config?: BlackBoxConfig): void;
+    /** Stop the black box stream and flush remaining events. */
+    static stop(): void;
+    /** Whether the black box is currently streaming. */
+    static get isStreaming(): boolean;
+    static log(message: string, source?: string, metadata?: Record<string, unknown>): void;
+    static warn(message: string, source?: string, metadata?: Record<string, unknown>): void;
+    static error(message: string, source?: string, metadata?: Record<string, unknown>): void;
+    /**
+     * Record a business event. Fires into the analytics ledger on
+     * the agent — see GET /analytics/events.csv.
+     *
+     * @example
+     * ```ts
+     * BlackBox.track('purchase_completed', {
+     *   amount: '9.99',
+     *   currency: 'USD',
+     *   plan: 'pro',
+     * });
+     * ```
+     */
+    static track(name: string, props?: Record<string, unknown>, route?: string): void;
+    /** Record a caught error with stack trace. Also adds to the feedback error buffer. */
+    static captureError(err: Error, isFatal?: boolean, metadata?: Record<string, unknown>): void;
+    /** Record a screen/route navigation event. */
+    static navigation(route: string, prevRoute?: string, metadata?: Record<string, unknown>): void;
+    /** Record an app lifecycle event (mount, unmount, background, foreground). */
+    static lifecycle(event: string, metadata?: Record<string, unknown>): void;
+    /** Record a network request/response. */
+    static networkRequest(method: string, url: string, status?: number, durationMs?: number, metadata?: Record<string, unknown>): void;
+    /** Record a state change event (Redux action, context update, etc.). */
+    static stateChange(description: string, metadata?: Record<string, unknown>): void;
+    /** Record a render/re-render event with optional duration. */
+    static render(component: string, durationMs?: number, metadata?: Record<string, unknown>): void;
+    /**
+     * Wrap `console.log`, `console.warn`, and `console.error` to also
+     * stream them to the black box. **Call this explicitly** — the SDK
+     * never auto-hooks console.
+     *
+     * Call `BlackBox.unwrapConsole()` to restore originals.
+     */
+    static wrapConsole(): void;
+    /** Restore original console methods. */
+    static unwrapConsole(): void;
+    /**
+     * Returns a pass-through error handler that streams errors to the
+     * black box AND calls the next handler. Same pattern as
+     * `YaverFeedback.wrapErrorHandler`, but streams in real-time.
+     *
+     * @example
+     * const existing = ErrorUtils.getGlobalHandler();
+     * ErrorUtils.setGlobalHandler(BlackBox.wrapErrorHandler(existing));
+     */
+    static wrapErrorHandler(next?: ((error: Error, isFatal?: boolean) => void) | null): (error: Error, isFatal?: boolean) => void;
+    /**
+     * Register a handler for commands pushed by the agent.
+     * The primary use case is receiving "reload" commands when the vibe coder
+     * triggers a reload from the Yaver mobile app.
+     *
+     * @example
+     * BlackBox.onCommand((cmd) => {
+     *   if (cmd.command === 'reload') {
+     *     DevSettings.reload(); // or Updates.reloadAsync()
+     *   }
+     * });
+     */
+    static onCommand(handler: CommandHandler): () => void;
+    /** Whether the SSE command channel is connected. */
+    static get isCommandChannelConnected(): boolean;
+    /**
+     * Connect to the agent's /blackbox/stream SSE endpoint.
+     * This persistent connection allows the agent to push commands (reload, etc.)
+     * back to the SDK. Events are still sent via batch POST /blackbox/events.
+     */
+    private static connectSSE;
+    private static disconnectSSE;
+    private static scheduleSSEReconnect;
+    private static push;
+    private static flush;
+    private static generateDeviceId;
+}