@farcaster/snap 2.6.4 → 2.7.1

package/dist/react-native/snap-view-core.js

@@ -8,39 +8,14 @@ import { SnapVersionProvider } from "./snap-version-context.js";
 import { useCallback, useEffect, useMemo, useRef, useState, } from "react";
 import { ActivityIndicator, StyleSheet, View } from "react-native";
 import { DEFAULT_THEME_ACCENT, PALETTE_LIGHT_HEX, PALETTE_DARK_HEX, } from "@farcaster/snap";
-// ─── Shared helpers ──────────────────────────────────
-export function applyStatePaths(model, changes) {
-    if (!changes)
-        return;
-    const entries = Array.isArray(changes)
-        ? changes.map((c) => [c.path, c.value])
-        : Object.entries(changes);
-    for (const [path, value] of entries) {
-        const trimmed = path.startsWith("/") ? path : `/${path}`;
-        const parts = trimmed.split("/").filter(Boolean);
-        if (parts.length < 2)
-            continue;
-        const [top, ...rest] = parts;
-        if (top === "inputs") {
-            if (typeof model.inputs !== "object" || model.inputs === null) {
-                model.inputs = {};
-            }
-            const inputs = model.inputs;
-            if (rest.length === 1) {
-                inputs[rest[0]] = value;
-            }
-            continue;
-        }
-        if (top === "theme") {
-            if (typeof model.theme !== "object" || model.theme === null) {
-                model.theme = {};
-            }
-            const theme = model.theme;
-            if (rest.length === 1) {
-                theme[rest[0]] = value;
-            }
-        }
-    }
+import { applyStatePaths, buildInitialRenderState, cloneSnapRenderState, getUnpresentedSnapEffects, markSnapEffectsPresented, } from "../render-state.js";
+function asRecord(value) {
+    return value && typeof value === "object"
+        ? value
+        : {};
+}
+function optionalString(value) {
+    return value ? String(value) : undefined;
 }
 function withDefaultElementProps(spec) {
     if (!spec || typeof spec !== "object" || !("elements" in spec))
@@ -70,28 +45,18 @@ export function resolveAccentHex(accent, appearance) {
     return map[name];
 }
 // ─── Core rendering component (no validation) ────────
-export function SnapViewCoreInner({ snap, handlers, loading = false, loadingOverlay, }) {
+export function SnapViewCoreInner({ snap, handlers, loading = false, loadingOverlay, initialRenderState, onRenderStateChange, }) {
     const { mode } = useSnapTheme();
     const spec = useMemo(() => withDefaultElementProps(snap.ui), [snap.ui]);
     const accentHex = resolveAccentHex(snap.theme?.accent, mode);
-    const initialState = useMemo(() => ({
-        ...(spec.state ?? {}),
-        inputs: { ...(spec.state?.inputs ?? {}) },
-        theme: {
-            ...(spec.state?.theme ?? {}),
-            ...(snap.theme ? { accent: snap.theme.accent } : {}),
-        },
-    }), [spec, snap.theme]);
+    const initialState = useMemo(() => buildInitialRenderState({
+        specState: spec.state,
+        initialRenderState,
+        themeAccent: snap.theme?.accent,
+    }), [initialRenderState, spec.state, snap.theme?.accent]);
     const stateRef = useRef(initialState);
     useEffect(() => {
-        stateRef.current = {
-            inputs: {
-                ...(initialState.inputs ?? {}),
-            },
-            theme: {
-                ...(initialState.theme ?? {}),
-            },
-        };
+        stateRef.current = cloneSnapRenderState(initialState);
     }, [initialState]);
     useEffect(() => {
         const catalogResult = snapJsonRenderCatalog.validate(spec);
@@ -104,16 +69,49 @@ export function SnapViewCoreInner({ snap, handlers, loading = false, loadingOver
     useEffect(() => {
         setPageKey((k) => k + 1);
     }, [spec]);
-    const showConfetti = snap.effects?.includes("confetti") ?? false;
-    const showFireworks = snap.effects?.includes("fireworks") ?? false;
-    const [confettiKey, setConfettiKey] = useState(0);
-    const [fireworksKey, setFireworksKey] = useState(0);
+    const effectSignature = snap.effects?.join("\u0000") ?? "";
+    const snapEffects = useMemo(() => (effectSignature ? effectSignature.split("\u0000") : []), [effectSignature]);
+    const showConfetti = snapEffects.includes("confetti");
+    const showFireworks = snapEffects.includes("fireworks");
+    const [effectRunKeys, setEffectRunKeys] = useState({
+        confetti: 0,
+        fireworks: 0,
+    });
+    const onRenderStateChangeRef = useRef(onRenderStateChange);
     useEffect(() => {
-        if (showConfetti)
-            setConfettiKey((k) => k + 1);
-        if (showFireworks)
-            setFireworksKey((k) => k + 1);
-    }, [showConfetti, showFireworks, snap]);
+        onRenderStateChangeRef.current = onRenderStateChange;
+    }, [onRenderStateChange]);
+    useEffect(() => {
+        const effectsToPresent = getUnpresentedSnapEffects(stateRef.current, snapEffects);
+        if (effectsToPresent.length === 0) {
+            setEffectRunKeys((current) => {
+                const next = {
+                    confetti: showConfetti ? current.confetti : 0,
+                    fireworks: showFireworks ? current.fireworks : 0,
+                };
+                return next.confetti === current.confetti &&
+                    next.fireworks === current.fireworks
+                    ? current
+                    : next;
+            });
+            return;
+        }
+        if (markSnapEffectsPresented(stateRef.current, effectsToPresent)) {
+            onRenderStateChangeRef.current?.(cloneSnapRenderState(stateRef.current));
+        }
+        setEffectRunKeys((current) => ({
+            confetti: effectsToPresent.includes("confetti")
+                ? current.confetti + 1
+                : showConfetti
+                    ? current.confetti
+                    : 0,
+            fireworks: effectsToPresent.includes("fireworks")
+                ? current.fireworks + 1
+                : showFireworks
+                    ? current.fireworks
+                    : 0,
+        }));
+    }, [initialState, showConfetti, showFireworks, snapEffects]);
     const handlersRef = useRef(handlers);
     handlersRef.current = handlers;
     const handleAction = useCallback((name, params) => {
@@ -165,25 +163,52 @@ export function SnapViewCoreInner({ snap, handlers, loading = false, loadingOver
                     buyToken: p.buyToken ? String(p.buyToken) : undefined,
                 });
                 break;
+            case "send_transaction":
+                h.send_transaction?.({
+                    chainId: String(p.chainId ?? ""),
+                    to: String(p.to ?? ""),
+                    data: optionalString(p.data),
+                    value: optionalString(p.value),
+                    gas: optionalString(p.gas),
+                    gasPrice: optionalString(p.gasPrice),
+                    maxFeePerGas: optionalString(p.maxFeePerGas),
+                    maxPriorityFeePerGas: optionalString(p.maxPriorityFeePerGas),
+                });
+                break;
+            case "send_calls":
+                h.send_calls?.({
+                    version: p.version === "1.0" ? "1.0" : undefined,
+                    chainId: String(p.chainId ?? ""),
+                    atomicRequired: typeof p.atomicRequired === "boolean"
+                        ? p.atomicRequired
+                        : undefined,
+                    id: optionalString(p.id),
+                    calls: Array.isArray(p.calls)
+                        ? p.calls.map((call) => {
+                            const c = asRecord(call);
+                            return {
+                                to: optionalString(c.to),
+                                data: optionalString(c.data),
+                                value: optionalString(c.value),
+                            };
+                        })
+                        : [],
+                });
+                break;
             default:
                 break;
         }
     }, []);
-    return (_jsxs(View, { style: styles.container, children: [loading
-                ? loadingOverlay === undefined
-                    ? (_jsx(SnapLoadingOverlay, { appearance: mode, accentHex: accentHex }))
-                    : loadingOverlay
-                : null, _jsx(SnapVersionProvider, { value: snap.version === "2.0" ? "2.0" : "1.0", children: _jsx(SnapCatalogView, { spec: spec, state: initialState, loading: false, onStateChange: (changes) => {
+    return (_jsxs(View, { style: styles.container, children: [loading ? (loadingOverlay === undefined ? (_jsx(SnapLoadingOverlay, { appearance: mode, accentHex: accentHex })) : (loadingOverlay)) : null, _jsx(SnapVersionProvider, { value: snap.version === "2.0" ? "2.0" : "1.0", children: _jsx(SnapCatalogView, { spec: spec, state: initialState, loading: false, onStateChange: (changes) => {
                         applyStatePaths(stateRef.current, changes);
-                    }, onAction: handleAction }, pageKey) }), showConfetti && _jsx(ConfettiOverlay, {}, confettiKey), showFireworks && _jsx(FireworksOverlay, {}, fireworksKey)] }));
+                        onRenderStateChange?.(cloneSnapRenderState(stateRef.current));
+                    }, onAction: handleAction }, pageKey) }), showConfetti && effectRunKeys.confetti > 0 && (_jsx(ConfettiOverlay, {}, effectRunKeys.confetti)), showFireworks && effectRunKeys.fireworks > 0 && (_jsx(FireworksOverlay, {}, effectRunKeys.fireworks))] }));
 }
 export function SnapLoadingOverlay({ appearance, accentHex, }) {
     return (_jsx(View, { style: [
             styles.overlay,
             {
-                backgroundColor: appearance === "dark"
-                    ? "rgba(0,0,0,0.1)"
-                    : "rgba(255,255,255,0.2)",
+                backgroundColor: appearance === "dark" ? "rgba(0,0,0,0.1)" : "rgba(255,255,255,0.2)",
             },
         ], children: _jsx(ActivityIndicator, { size: "large", color: accentHex }) }));
 }

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

@@ -1,4 +1,6 @@
 import type { Spec } from "@json-render/core";
+import type { SnapRenderState } from "../render-state.js";
+export type { SnapRenderState };
 export type JsonValue = string | number | boolean | null | JsonValue[] | {
     [key: string]: JsonValue;
 };
@@ -10,6 +12,27 @@ export type SnapPage = {
     effects?: string[];
     ui: Spec;
 };
+export type SnapSendTransactionParams = {
+    chainId: string;
+    to: string;
+    data?: string;
+    value?: string;
+    gas?: string;
+    gasPrice?: string;
+    maxFeePerGas?: string;
+    maxPriorityFeePerGas?: string;
+};
+export type SnapSendCallsParams = {
+    version?: "1.0";
+    chainId: string;
+    atomicRequired?: boolean;
+    id?: string;
+    calls: Array<{
+        to?: string;
+        data?: string;
+        value?: string;
+    }>;
+};
 export type SnapActionHandlers = {
     submit: (target: string, inputs: Record<string, JsonValue>) => void;
     open_url: (target: string) => void;
@@ -39,4 +62,6 @@ export type SnapActionHandlers = {
         sellToken?: string;
         buyToken?: string;
     }) => void;
+    send_transaction?: (params: SnapSendTransactionParams) => void;
+    send_calls?: (params: SnapSendCallsParams) => void;
 };

package/dist/react-native/v1/snap-view.d.ts

@@ -1,13 +1,15 @@
 import { type ReactNode } from "react";
 import { type SnapNativeColors } from "../theme.js";
-import type { SnapPage, SnapActionHandlers } from "../types.js";
-export declare function SnapViewV1Inner({ snap, handlers, loading, loadingOverlay, }: {
+import type { SnapActionHandlers, SnapPage, SnapRenderState } from "../types.js";
+export declare function SnapViewV1Inner({ snap, handlers, loading, loadingOverlay, initialRenderState, onRenderStateChange, }: {
     snap: SnapPage;
     handlers: SnapActionHandlers;
     loading?: boolean;
     loadingOverlay?: ReactNode;
+    initialRenderState?: SnapRenderState;
+    onRenderStateChange?: (state: SnapRenderState) => void;
 }): import("react").JSX.Element;
-export declare function SnapViewV1({ snap, handlers, loading, appearance, colors, loadingOverlay, }: {
+export declare function SnapViewV1({ snap, handlers, loading, appearance, colors, loadingOverlay, initialRenderState, onRenderStateChange, }: {
     snap: SnapPage;
     handlers: SnapActionHandlers;
     loading?: boolean;
@@ -15,8 +17,10 @@ export declare function SnapViewV1({ snap, handlers, loading, appearance, colors
     colors?: Partial<SnapNativeColors>;
     /** Custom content rendered while `loading` is true. Pass `null` to render nothing. */
     loadingOverlay?: ReactNode;
+    initialRenderState?: SnapRenderState;
+    onRenderStateChange?: (state: SnapRenderState) => void;
 }): import("react").JSX.Element;
-export declare function SnapCardV1({ snap, handlers, loading, appearance, colors, borderRadius, actionError, plain, loadingOverlay, forceExpanded, expandButtonLabel, onExpandPress, }: {
+export declare function SnapCardV1({ snap, handlers, loading, appearance, colors, borderRadius, actionError, plain, loadingOverlay, forceExpanded, expandButtonLabel, onExpandPress, initialRenderState, onRenderStateChange, }: {
     snap: SnapPage;
     handlers: SnapActionHandlers;
     loading?: boolean;
@@ -33,4 +37,8 @@ export declare function SnapCardV1({ snap, handlers, loading, appearance, colors
     expandButtonLabel?: string;
     /** Called from the collapsed expand button instead of toggling internal state. */
     onExpandPress?: () => void;
+    /** JSON-render local state used to seed this presenter mount. */
+    initialRenderState?: SnapRenderState;
+    /** Called with the full JSON-render local state after state changes. */
+    onRenderStateChange?: (state: SnapRenderState) => void;
 }): import("react").JSX.Element;

package/dist/react-native/v1/snap-view.js

@@ -5,14 +5,14 @@ import { SnapThemeProvider, useSnapTheme } from "../theme.js";
 import { SnapLoadingOverlay, SnapViewCoreInner, resolveAccentHex, } from "../snap-view-core.js";
 import { getSnapExpansionState } from "../expand-state.js";
 // ─── SnapViewV1 (no validation) ──────────────────────
-export function SnapViewV1Inner({ snap, handlers, loading = false, loadingOverlay, }) {
-    return (_jsx(SnapViewCoreInner, { snap: snap, handlers: handlers, loading: loading, loadingOverlay: loadingOverlay }));
+export function SnapViewV1Inner({ snap, handlers, loading = false, loadingOverlay, initialRenderState, onRenderStateChange, }) {
+    return (_jsx(SnapViewCoreInner, { snap: snap, handlers: handlers, loading: loading, loadingOverlay: loadingOverlay, initialRenderState: initialRenderState, onRenderStateChange: onRenderStateChange }));
 }
-export function SnapViewV1({ snap, handlers, loading = false, appearance = "dark", colors, loadingOverlay, }) {
-    return (_jsx(SnapThemeProvider, { appearance: appearance, colors: colors, children: _jsx(SnapViewV1Inner, { snap: snap, handlers: handlers, loading: loading, loadingOverlay: loadingOverlay }) }));
+export function SnapViewV1({ snap, handlers, loading = false, appearance = "dark", colors, loadingOverlay, initialRenderState, onRenderStateChange, }) {
+    return (_jsx(SnapThemeProvider, { appearance: appearance, colors: colors, children: _jsx(SnapViewV1Inner, { snap: snap, handlers: handlers, loading: loading, loadingOverlay: loadingOverlay, initialRenderState: initialRenderState, onRenderStateChange: onRenderStateChange }) }));
 }
 // ─── SnapCardV1 (card frame with expandable clipping) ──
-function SnapCardV1Inner({ snap, handlers, loading = false, borderRadius, actionError, appearance, plain, loadingOverlay, forceExpanded, expandButtonLabel, onExpandPress, }) {
+function SnapCardV1Inner({ snap, handlers, loading = false, borderRadius, actionError, appearance, plain, loadingOverlay, forceExpanded, expandButtonLabel, onExpandPress, initialRenderState, onRenderStateChange, }) {
     const { colors, mode } = useSnapTheme();
     const accentHex = resolveAccentHex(snap.theme?.accent, mode);
     const [contentHeight, setContentHeight] = useState(0);
@@ -48,7 +48,7 @@ function SnapCardV1Inner({ snap, handlers, loading = false, borderRadius, action
                                             : currentHeight === nextHeight
                                                 ? currentHeight
                                                 : nextHeight);
-                                    }, style: plain ? undefined : cardStyles.body, children: _jsx(SnapViewV1Inner, { snap: snap, handlers: handlers, loading: loading, loadingOverlay: null }) }) }), loading
+                                    }, style: plain ? undefined : cardStyles.body, children: _jsx(SnapViewV1Inner, { snap: snap, handlers: handlers, loading: loading, loadingOverlay: null, initialRenderState: initialRenderState, onRenderStateChange: onRenderStateChange }) }) }), loading
                                 ? loadingOverlay === undefined
                                     ? _jsx(SnapLoadingOverlay, { appearance: mode, accentHex: accentHex })
                                     : loadingOverlay
@@ -76,8 +76,8 @@ function SnapCardV1Inner({ snap, handlers, loading = false, borderRadius, action
                     },
                 ], children: actionError }))] }));
 }
-export function SnapCardV1({ snap, handlers, loading = false, appearance = "dark", colors, borderRadius = 16, actionError, plain = false, loadingOverlay, forceExpanded, expandButtonLabel, onExpandPress, }) {
-    return (_jsx(SnapThemeProvider, { appearance: appearance, colors: colors, children: _jsx(SnapCardV1Inner, { snap: snap, handlers: handlers, loading: loading, borderRadius: borderRadius, actionError: actionError, appearance: appearance, plain: plain, loadingOverlay: loadingOverlay, forceExpanded: forceExpanded, expandButtonLabel: expandButtonLabel, onExpandPress: onExpandPress }) }));
+export function SnapCardV1({ snap, handlers, loading = false, appearance = "dark", colors, borderRadius = 16, actionError, plain = false, loadingOverlay, forceExpanded, expandButtonLabel, onExpandPress, initialRenderState, onRenderStateChange, }) {
+    return (_jsx(SnapThemeProvider, { appearance: appearance, colors: colors, children: _jsx(SnapCardV1Inner, { snap: snap, handlers: handlers, loading: loading, borderRadius: borderRadius, actionError: actionError, appearance: appearance, plain: plain, loadingOverlay: loadingOverlay, forceExpanded: forceExpanded, expandButtonLabel: expandButtonLabel, onExpandPress: onExpandPress, initialRenderState: initialRenderState, onRenderStateChange: onRenderStateChange }) }));
 }
 const cardStyles = StyleSheet.create({
     frameRing: { alignSelf: "stretch" },

package/dist/react-native/v2/snap-view.d.ts

@@ -1,16 +1,18 @@
 import type { ReactNode } from "react";
 import { type SnapNativeColors } from "../theme.js";
 import { type ValidationResult } from "@farcaster/snap";
-import type { SnapPage, SnapActionHandlers } from "../types.js";
-export declare function SnapViewV2Inner({ snap, handlers, loading, onValidationError, validationErrorFallback, loadingOverlay, }: {
+import type { SnapActionHandlers, SnapPage, SnapRenderState } from "../types.js";
+export declare function SnapViewV2Inner({ snap, handlers, loading, onValidationError, validationErrorFallback, loadingOverlay, initialRenderState, onRenderStateChange, }: {
     snap: SnapPage;
     handlers: SnapActionHandlers;
     loading?: boolean;
     onValidationError?: (result: ValidationResult) => void;
     validationErrorFallback?: ReactNode;
     loadingOverlay?: ReactNode;
+    initialRenderState?: SnapRenderState;
+    onRenderStateChange?: (state: SnapRenderState) => void;
 }): import("react").JSX.Element;
-export declare function SnapViewV2({ snap, handlers, loading, appearance, colors, onValidationError, validationErrorFallback, loadingOverlay, }: {
+export declare function SnapViewV2({ snap, handlers, loading, appearance, colors, onValidationError, validationErrorFallback, loadingOverlay, initialRenderState, onRenderStateChange, }: {
     snap: SnapPage;
     handlers: SnapActionHandlers;
     loading?: boolean;
@@ -20,8 +22,10 @@ export declare function SnapViewV2({ snap, handlers, loading, appearance, colors
     validationErrorFallback?: ReactNode;
     /** Custom content rendered while `loading` is true. Pass `null` to render nothing. */
     loadingOverlay?: ReactNode;
+    initialRenderState?: SnapRenderState;
+    onRenderStateChange?: (state: SnapRenderState) => void;
 }): import("react").JSX.Element;
-export declare function SnapCardV2({ snap, handlers, loading, appearance, colors, borderRadius, showOverflowWarning, onValidationError, validationErrorFallback, actionError, plain, loadingOverlay, forceExpanded, expandButtonLabel, onExpandPress, }: {
+export declare function SnapCardV2({ snap, handlers, loading, appearance, colors, borderRadius, showOverflowWarning, onValidationError, validationErrorFallback, actionError, plain, loadingOverlay, forceExpanded, expandButtonLabel, onExpandPress, initialRenderState, onRenderStateChange, }: {
     snap: SnapPage;
     handlers: SnapActionHandlers;
     loading?: boolean;
@@ -41,4 +45,8 @@ export declare function SnapCardV2({ snap, handlers, loading, appearance, colors
     expandButtonLabel?: string;
     /** Called from the collapsed expand button instead of toggling internal state. */
     onExpandPress?: () => void;
+    /** JSON-render local state used to seed this presenter mount. */
+    initialRenderState?: SnapRenderState;
+    /** Called with the full JSON-render local state after state changes. */
+    onRenderStateChange?: (state: SnapRenderState) => void;
 }): import("react").JSX.Element;

package/dist/react-native/v2/snap-view.js

@@ -25,7 +25,7 @@ const fallbackStyles = StyleSheet.create({
     },
 });
 // ─── SnapViewV2 (with validation) ────────────────────
-export function SnapViewV2Inner({ snap, handlers, loading = false, onValidationError, validationErrorFallback, loadingOverlay, }) {
+export function SnapViewV2Inner({ snap, handlers, loading = false, onValidationError, validationErrorFallback, loadingOverlay, initialRenderState, onRenderStateChange, }) {
     const validation = useMemo(() => validateSnapResponse(snap), [snap]);
     const valid = validation.valid;
     const validationMessage = validation.issues[0]?.message;
@@ -45,13 +45,13 @@ export function SnapViewV2Inner({ snap, handlers, loading = false, onValidationE
             return null;
         return (_jsx(_Fragment, { children: validationErrorFallback ?? _jsx(SnapValidationFallback, { message: validationMessage }) }));
     }
-    return (_jsx(SnapViewCoreInner, { snap: snap, handlers: handlers, loading: loading, loadingOverlay: loadingOverlay }));
+    return (_jsx(SnapViewCoreInner, { snap: snap, handlers: handlers, loading: loading, loadingOverlay: loadingOverlay, initialRenderState: initialRenderState, onRenderStateChange: onRenderStateChange }));
 }
-export function SnapViewV2({ snap, handlers, loading = false, appearance = "dark", colors, onValidationError, validationErrorFallback, loadingOverlay, }) {
-    return (_jsx(SnapThemeProvider, { appearance: appearance, colors: colors, children: _jsx(SnapViewV2Inner, { snap: snap, handlers: handlers, loading: loading, onValidationError: onValidationError, validationErrorFallback: validationErrorFallback, loadingOverlay: loadingOverlay }) }));
+export function SnapViewV2({ snap, handlers, loading = false, appearance = "dark", colors, onValidationError, validationErrorFallback, loadingOverlay, initialRenderState, onRenderStateChange, }) {
+    return (_jsx(SnapThemeProvider, { appearance: appearance, colors: colors, children: _jsx(SnapViewV2Inner, { snap: snap, handlers: handlers, loading: loading, onValidationError: onValidationError, validationErrorFallback: validationErrorFallback, loadingOverlay: loadingOverlay, initialRenderState: initialRenderState, onRenderStateChange: onRenderStateChange }) }));
 }
 // ─── SnapCardV2 (card frame + height limits) ─────────
-function SnapCardV2Inner({ snap, handlers, loading, borderRadius, showOverflowWarning, onValidationError, validationErrorFallback, actionError, appearance, plain, loadingOverlay, forceExpanded, expandButtonLabel, onExpandPress, }) {
+function SnapCardV2Inner({ snap, handlers, loading, borderRadius, showOverflowWarning, onValidationError, validationErrorFallback, actionError, appearance, plain, loadingOverlay, forceExpanded, expandButtonLabel, onExpandPress, initialRenderState, onRenderStateChange, }) {
     const { colors, mode } = useSnapTheme();
     const accentHex = resolveAccentHex(snap.theme?.accent, mode);
     const [contentHeight, setContentHeight] = useState(0);
@@ -69,7 +69,7 @@ function SnapCardV2Inner({ snap, handlers, loading, borderRadius, showOverflowWa
         showOverflowWarning,
     });
     const expandButtonInsideCard = typeof onExpandPress === "function";
-    const content = (_jsx(SnapViewV2Inner, { snap: snap, handlers: handlers, loading: loading, onValidationError: onValidationError, validationErrorFallback: validationErrorFallback, loadingOverlay: null }));
+    const content = (_jsx(SnapViewV2Inner, { snap: snap, handlers: handlers, loading: loading, onValidationError: onValidationError, validationErrorFallback: validationErrorFallback, loadingOverlay: null, initialRenderState: initialRenderState, onRenderStateChange: onRenderStateChange }));
     if (plain) {
         return (_jsxs(_Fragment, { children: [_jsx(View, { style: expansion.clipped
                         ? { maxHeight: expansion.maxHeight, overflow: "hidden" }
@@ -151,8 +151,8 @@ function SnapCardV2Inner({ snap, handlers, loading, borderRadius, showOverflowWa
                         : "rgba(200,0,0,0.8)",
                 }, children: actionError }))] }));
 }
-export function SnapCardV2({ snap, handlers, loading = false, appearance = "dark", colors, borderRadius = 16, showOverflowWarning = false, onValidationError, validationErrorFallback, actionError, plain = false, loadingOverlay, forceExpanded, expandButtonLabel, onExpandPress, }) {
-    return (_jsx(SnapThemeProvider, { appearance: appearance, colors: colors, children: _jsx(SnapCardV2Inner, { snap: snap, handlers: handlers, loading: loading, borderRadius: borderRadius, showOverflowWarning: showOverflowWarning, onValidationError: onValidationError, validationErrorFallback: validationErrorFallback, actionError: actionError, appearance: appearance, plain: plain, loadingOverlay: loadingOverlay, forceExpanded: forceExpanded, expandButtonLabel: expandButtonLabel, onExpandPress: onExpandPress }) }));
+export function SnapCardV2({ snap, handlers, loading = false, appearance = "dark", colors, borderRadius = 16, showOverflowWarning = false, onValidationError, validationErrorFallback, actionError, plain = false, loadingOverlay, forceExpanded, expandButtonLabel, onExpandPress, initialRenderState, onRenderStateChange, }) {
+    return (_jsx(SnapThemeProvider, { appearance: appearance, colors: colors, children: _jsx(SnapCardV2Inner, { snap: snap, handlers: handlers, loading: loading, borderRadius: borderRadius, showOverflowWarning: showOverflowWarning, onValidationError: onValidationError, validationErrorFallback: validationErrorFallback, actionError: actionError, appearance: appearance, plain: plain, loadingOverlay: loadingOverlay, forceExpanded: forceExpanded, expandButtonLabel: expandButtonLabel, onExpandPress: onExpandPress, initialRenderState: initialRenderState, onRenderStateChange: onRenderStateChange }) }));
 }
 const cardStyles = StyleSheet.create({
     frameRing: { alignSelf: "stretch" },

package/dist/render-state.d.ts

@@ -0,0 +1,14 @@
+export type SnapRenderState = Record<string, unknown>;
+export type SnapRenderStateChanges = {
+    path: string;
+    value: unknown;
+}[] | Record<string, unknown> | null | undefined;
+export declare function cloneSnapRenderState<T>(value: T): T;
+export declare function applyStatePaths(model: Record<string, unknown>, changes: SnapRenderStateChanges): void;
+export declare function getUnpresentedSnapEffects(model: SnapRenderState, effects: readonly string[] | undefined): string[];
+export declare function markSnapEffectsPresented(model: SnapRenderState, effects: readonly string[] | undefined): boolean;
+export declare function buildInitialRenderState({ specState, initialRenderState, themeAccent, }: {
+    specState: unknown;
+    initialRenderState?: SnapRenderState;
+    themeAccent?: string;
+}): SnapRenderState;

package/dist/render-state.js

@@ -0,0 +1,116 @@
+const SNAP_RENDER_STATE_META_KEY = "__snapRender";
+function isRecord(value) {
+    return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function normalizeEffects(effects) {
+    if (!effects)
+        return [];
+    return Array.from(new Set(effects.filter((effect) => typeof effect === "string" && effect.length > 0)));
+}
+function getRenderStateMeta(model) {
+    const meta = model[SNAP_RENDER_STATE_META_KEY];
+    return isRecord(meta) ? meta : undefined;
+}
+function getPresentedSnapEffects(model) {
+    const presentedEffects = getRenderStateMeta(model)?.presentedEffects;
+    if (!Array.isArray(presentedEffects))
+        return new Set();
+    return new Set(presentedEffects.filter((effect) => typeof effect === "string" && effect.length > 0));
+}
+export function cloneSnapRenderState(value) {
+    if (Array.isArray(value)) {
+        return value.map((item) => cloneSnapRenderState(item));
+    }
+    if (isRecord(value)) {
+        const next = {};
+        for (const [key, nestedValue] of Object.entries(value)) {
+            next[key] = cloneSnapRenderState(nestedValue);
+        }
+        return next;
+    }
+    return value;
+}
+function mergeRenderState(base, override) {
+    if (!override)
+        return cloneSnapRenderState(base);
+    const next = cloneSnapRenderState(base);
+    for (const [key, value] of Object.entries(override)) {
+        const existing = next[key];
+        next[key] =
+            isRecord(existing) && isRecord(value)
+                ? mergeRenderState(existing, value)
+                : cloneSnapRenderState(value);
+    }
+    return next;
+}
+function normalizeStatePath(path) {
+    const trimmed = path.startsWith("/") ? path.slice(1) : path;
+    return trimmed.split("/").filter(Boolean);
+}
+function setStateValue(model, parts, value) {
+    let cursor = model;
+    for (let index = 0; index < parts.length; index += 1) {
+        const part = parts[index];
+        if (index === parts.length - 1) {
+            cursor[part] = cloneSnapRenderState(value);
+            return;
+        }
+        const next = cursor[part];
+        if (!isRecord(next)) {
+            cursor[part] = {};
+        }
+        cursor = cursor[part];
+    }
+}
+export function applyStatePaths(model, changes) {
+    if (!changes)
+        return;
+    const entries = Array.isArray(changes)
+        ? changes.map((change) => [change.path, change.value])
+        : Object.entries(changes);
+    for (const [path, value] of entries) {
+        const parts = normalizeStatePath(path);
+        if (parts.length === 0)
+            continue;
+        setStateValue(model, parts, value);
+    }
+}
+export function getUnpresentedSnapEffects(model, effects) {
+    const presentedEffects = getPresentedSnapEffects(model);
+    return normalizeEffects(effects).filter((effect) => !presentedEffects.has(effect));
+}
+export function markSnapEffectsPresented(model, effects) {
+    const nextEffects = normalizeEffects(effects);
+    if (nextEffects.length === 0)
+        return false;
+    const presentedEffects = getPresentedSnapEffects(model);
+    let changed = false;
+    for (const effect of nextEffects) {
+        if (!presentedEffects.has(effect)) {
+            presentedEffects.add(effect);
+            changed = true;
+        }
+    }
+    if (!changed)
+        return false;
+    let meta = getRenderStateMeta(model);
+    if (!meta) {
+        meta = {};
+        model[SNAP_RENDER_STATE_META_KEY] = meta;
+    }
+    meta.presentedEffects = Array.from(presentedEffects);
+    return true;
+}
+export function buildInitialRenderState({ specState, initialRenderState, themeAccent, }) {
+    const authoredState = isRecord(specState) ? specState : {};
+    const restoredState = initialRenderState
+        ? mergeRenderState(authoredState, initialRenderState)
+        : cloneSnapRenderState(authoredState);
+    if (!isRecord(restoredState.inputs)) {
+        restoredState.inputs = {};
+    }
+    const theme = isRecord(restoredState.theme) ? restoredState.theme : {};
+    restoredState.theme =
+        themeAccent === undefined ? theme : { ...theme, accent: themeAccent };
+    return restoredState;
+}

package/dist/ui/catalog.d.ts

@@ -572,6 +572,33 @@ export declare const snapJsonRenderCatalog: import("@json-render/core").Catalog<
                 buyToken: z.ZodOptional<z.ZodString>;
             }, z.core.$strip>;
         };
+        send_transaction: {
+            description: string;
+            params: z.ZodObject<{
+                chainId: z.ZodString;
+                to: z.ZodString;
+                data: z.ZodOptional<z.ZodString>;
+                value: z.ZodOptional<z.ZodString>;
+                gas: z.ZodOptional<z.ZodString>;
+                gasPrice: z.ZodOptional<z.ZodString>;
+                maxFeePerGas: z.ZodOptional<z.ZodString>;
+                maxPriorityFeePerGas: z.ZodOptional<z.ZodString>;
+            }, z.core.$strip>;
+        };
+        send_calls: {
+            description: string;
+            params: z.ZodObject<{
+                version: z.ZodOptional<z.ZodLiteral<"1.0">>;
+                chainId: z.ZodString;
+                atomicRequired: z.ZodOptional<z.ZodBoolean>;
+                id: z.ZodOptional<z.ZodString>;
+                calls: z.ZodArray<z.ZodObject<{
+                    to: z.ZodOptional<z.ZodString>;
+                    data: z.ZodOptional<z.ZodString>;
+                    value: z.ZodOptional<z.ZodString>;
+                }, z.core.$strip>>;
+            }, z.core.$strip>;
+        };
         paginator_next: {
             description: string;
             params: z.ZodObject<{

package/dist/ui/catalog.js

@@ -151,6 +151,33 @@ export const snapJsonRenderCatalog = defineCatalog(snapJsonRenderSchema, {
                 buyToken: z.string().optional(),
             }),
         },
+        send_transaction: {
+            description: "Request an EVM transaction through the host wallet using eth_sendTransaction.",
+            params: z.object({
+                chainId: z.string(),
+                to: z.string(),
+                data: z.string().optional(),
+                value: z.string().optional(),
+                gas: z.string().optional(),
+                gasPrice: z.string().optional(),
+                maxFeePerGas: z.string().optional(),
+                maxPriorityFeePerGas: z.string().optional(),
+            }),
+        },
+        send_calls: {
+            description: "Request one or more EVM calls through the host wallet using wallet_sendCalls.",
+            params: z.object({
+                version: z.literal("1.0").optional(),
+                chainId: z.string(),
+                atomicRequired: z.boolean().optional(),
+                id: z.string().optional(),
+                calls: z.array(z.object({
+                    to: z.string().optional(),
+                    data: z.string().optional(),
+                    value: z.string().optional(),
+                })),
+            }),
+        },
         paginator_next: {
             description: "Move the snap's paginator to the next page locally. Does not POST and is ignored when no paginator is rendered.",
             params: z.object({ page: z.number().int().min(0).optional() }),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@farcaster/snap",
-  "version": "2.6.4",
+  "version": "2.7.1",
   "description": "Farcaster Snaps 🫰",
   "repository": {
     "type": "git",

package/src/index.ts

@@ -47,3 +47,4 @@ export {
   type SnapGetPayload,
 } from "./schemas";
 export { validateSnapResponse, type ValidationResult } from "./validator";
+export type { SnapRenderState } from "./render-state";