@graineai/inapp-react-native 0.30.0 → 0.32.0

package/dist/client.d.ts

@@ -63,6 +63,9 @@ export declare class GraineInAppClient {
     configureFriction(override: FrictionConfig | null | undefined): void;
     get friction(): Required<FrictionConfig>;
     on(event: string, fn: Listener): () => void;
+    private lastWidget;
+    get pendingWidget(): any;
+    clearPendingWidget(): void;
     emit(event: string, payload?: any): void;
     private get fetch();
     session(): Promise<SessionConfig>;

package/dist/client.js

@@ -28,6 +28,7 @@ export class GraineInAppClient {
         this.identity = {};
         this.appVersion = null;
         this.recentEvents = [];
+        this.lastWidget = null;
         if (!opts?.publishableKey)
             throw new Error("[Graine] publishableKey is required.");
         if (!opts?.baseUrl)
@@ -57,7 +58,15 @@ export class GraineInAppClient {
         this.listeners.get(event).add(fn);
         return () => this.listeners.get(event)?.delete(fn);
     }
+    get pendingWidget() {
+        return this.lastWidget;
+    }
+    clearPendingWidget() {
+        this.lastWidget = null;
+    }
     emit(event, payload) {
+        if (event === "widget")
+            this.lastWidget = payload ?? null;
         for (const fn of this.listeners.get(event) ?? []) {
             try {
                 fn(payload);

package/dist/index.d.ts

@@ -1,4 +1,5 @@
-export type { ActionHandler, AppActionRequest, AppActionResult, AppEvent, ScreenContext, ScreenField, } from "./protocol.js";
+export type { ActionHandler, AppActionRequest, AppActionResult, AppEvent, ScreenContext, ScreenField, WidgetSurface, } from "./protocol.js";
+export { widgetSurface } from "./protocol.js";
 export { GraineInAppClient, type GraineInAppOptions, type SessionConfig, type ActionDiagnosis, } from "./client.js";
 export { FrictionDetector, resolveFriction, rulesFor, DEFAULT_FRICTION, type FrictionConfig, type FrictionScreenRules, type FrictionNudge, type FrictionSignal, type FrictionKind, } from "./friction.js";
 export { VoiceSession, liveAudioStreamAdapter, base64ToPcm16, CAPTURE_SAMPLE_RATE, type AudioAdapter, type VoiceSessionOptions, } from "./voice.js";

package/dist/index.js

@@ -1,3 +1,4 @@
+export { widgetSurface } from "./protocol.js";
 export { GraineInAppClient, } from "./client.js";
 export { FrictionDetector, resolveFriction, rulesFor, DEFAULT_FRICTION, } from "./friction.js";
 export { VoiceSession, liveAudioStreamAdapter, base64ToPcm16, CAPTURE_SAMPLE_RATE, } from "./voice.js";

package/dist/protocol.d.ts

@@ -62,3 +62,5 @@ export declare const ACTION_DEADLINE_MS = 6000;
 export declare const CONTEXT_THROTTLE_MS = 400;
 export declare const UNNAMED_TAP = "tap:screen";
 export declare function resolveWidgetImages(data: Record<string, unknown>, baseUrl: string): Record<string, unknown>;
+export type WidgetSurface = "screen" | "sheet" | "card";
+export declare function widgetSurface(kind: string | null | undefined): WidgetSurface;

package/dist/protocol.js

@@ -29,3 +29,15 @@ export function resolveWidgetImages(data, baseUrl) {
     }
     return out;
 }
+const SURFACE = {
+    product_list: "screen",
+    products: "screen",
+    plan_comparison: "sheet",
+    choices: "sheet",
+    quick_actions: "sheet",
+    calendar_slots: "sheet",
+    info_card: "card",
+};
+export function widgetSurface(kind) {
+    return SURFACE[String(kind ?? "").trim().toLowerCase()] ?? "card";
+}

package/dist/react-native/index.d.ts

@@ -4,6 +4,8 @@ import { type AudioAdapter, type VoiceSessionOptions } from "../voice.js";
 import type { ActionHandler, ScreenContext, ScreenField } from "../protocol.js";
 export { GraineFab, GraineTouchCapture } from "./fab.js";
 export type { GraineFabProps, GraineTouchCaptureProps } from "./fab.js";
+export { widgetSurface } from "../protocol.js";
+export type { WidgetSurface } from "../protocol.js";
 import type { FrictionConfig } from "../friction.js";
 import { type LauncherInset, type LauncherVisibility } from "./navigation.js";
 interface GraineContextValue {
@@ -123,6 +125,11 @@ export declare function useGraineHighlight(name: string): {
 };
 export declare function useGraineWidget(): {
     widget: GraineWidget | null;
+    answered: {
+        widget: GraineWidget;
+        data: Record<string, unknown>;
+        summary: string;
+    } | null;
     submit: (data: Record<string, unknown>, summary: string) => void;
     dismiss: () => void;
 };

package/dist/react-native/index.js

@@ -6,6 +6,7 @@ import { VoiceSession } from "../voice.js";
 import { resolveWidgetImages } from "../protocol.js";
 import { GraineFab, GraineTouchCapture } from "./fab.js";
 export { GraineFab, GraineTouchCapture } from "./fab.js";
+export { widgetSurface } from "../protocol.js";
 import { LauncherVisibilityTracker, activeRouteName, } from "./navigation.js";
 export const Ctx = createContext(null);
 let defaultClient = null;
@@ -389,25 +390,42 @@ export function useGraineHighlight(name) {
 }
 export function useGraineWidget() {
     const client = useGraineClient();
-    const [widget, setWidget] = useState(null);
-    useEffect(() => client.on("widget", (w) => {
-        if (!w?.widget_id)
-            return;
-        setWidget({
+    const adopt = useCallback((w) => w?.widget_id
+        ? {
             id: String(w.widget_id),
             kind: String(w.kind || ""),
             data: resolveWidgetImages((w.data || {}), client.opts.baseUrl),
             fallbackText: String(w.fallback_text || ""),
+        }
+        : null, [client]);
+    const [widget, setWidget] = useState(() => adopt(client.pendingWidget));
+    const [answered, setAnswered] = useState(null);
+    useEffect(() => {
+        const pending = adopt(client.pendingWidget);
+        if (pending)
+            setWidget((cur) => (cur && cur.id === pending.id ? cur : pending));
+        return client.on("widget", (w) => {
+            const next = adopt(w);
+            if (!next)
+                return;
+            setWidget(next);
+            setAnswered(null);
         });
-    }), [client]);
+    }, [client, adopt]);
     const submit = useCallback((data, summary) => {
         if (!widget)
             return;
         client.submitWidget(widget.id, data, summary);
+        client.clearPendingWidget();
         setWidget(null);
+        setAnswered({ widget, data, summary });
     }, [client, widget]);
-    const dismiss = useCallback(() => setWidget(null), []);
-    return { widget, submit, dismiss };
+    const dismiss = useCallback(() => {
+        client.clearPendingWidget();
+        setWidget(null);
+        setAnswered(null);
+    }, [client]);
+    return { widget, answered, submit, dismiss };
 }
 export function useGraineAction(name, handler) {
     const client = useGraineClient();

package/dist/react-native/voice-launcher.js

@@ -138,6 +138,9 @@ export function GraineVoiceLauncher({ webView: WebView, autoStart = false, activ
                     startedRef.current = true;
                     void beginCall();
                 }
+                else if (!activeRef.current && !startedRef.current) {
+                    post({ type: "graine:warm" });
+                }
                 return;
             case "graine:call":
                 setConnected(!!msg.connected);
@@ -200,6 +203,7 @@ export function GraineVoiceLauncher({ webView: WebView, autoStart = false, activ
         start: useCallback(() => {
             setConnecting(true);
             setCaptions([]);
+            client.clearPendingWidget();
             if (!ready) {
                 pendingStartRef.current = true;
                 return;
@@ -243,6 +247,7 @@ export function GraineVoiceLauncher({ webView: WebView, autoStart = false, activ
         setConnected(false);
         setConnecting(false);
         setCaptions([]);
+        client.clearPendingWidget();
         onCallState?.({ connected: false, connecting: false });
     }, [active]);
     useEffect(() => {

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@graineai/inapp-react-native",
-  "version": "0.30.0",
+  "version": "0.32.0",
   "type": "module",
-  "description": "Graine in-app agent for React Native \u2014 an agent that sees the screen your customer is on and can act on it.",
+  "description": "Graine in-app agent for React Native — an agent that sees the screen your customer is on and can act on it.",
   "license": "MIT",
   "private": false,
   "main": "dist/index.js",