yaver-feedback-react-native 0.7.17 → 0.8.1

package/dist/FeedbackModal.js

@@ -40,6 +40,7 @@ const YaverFeedback_1 = require("./YaverFeedback");
 const capture_1 = require("./capture");
 const upload_1 = require("./upload");
 const AuthOverlay_1 = require("./AuthOverlay");
+const QuickActionIcon_1 = require("./QuickActionIcon");
 const FeedbackModal = () => {
     const [visible, setVisible] = (0, react_1.useState)(false);
     const [action, setAction] = (0, react_1.useState)('idle');
@@ -47,11 +48,12 @@ const FeedbackModal = () => {
     const [toast, setToast] = (0, react_1.useState)(null);
     const [progress, setProgress] = (0, react_1.useState)(null);
     const [isRecordingVideo, setIsRecordingVideo] = (0, react_1.useState)(false);
-    const [isRecordingVoice, setIsRecordingVoice] = (0, react_1.useState)(false);
-    // Cached once on mount — bare-RN apps without expo-av get a clean
-    // hidden button instead of a runtime error.
-    const voiceSupported = (0, react_1.useRef)((0, capture_1.isVoiceCaptureSupported)()).current;
     const [lastVideo, setLastVideo] = (0, react_1.useState)(null);
+    // Tracks whether the user has hidden the QuickActionIcon via its
+    // long-press menu. Shake is always available, so the feedback modal
+    // is our guaranteed UI for bringing the icon back — we surface a
+    // small "Show quick icon" row when this is true.
+    const [quickIconHidden, setQuickIconHidden] = (0, react_1.useState)(false);
     // Vibing-input mode: same expand-on-tap pattern as email login.
     // Tap "Vibing" once → the button reveals an input + Send; that lets
     // the user say WHAT they want to vibe on instead of firing a canned
@@ -59,6 +61,7 @@ const FeedbackModal = () => {
     // the wrong project because the matcher grepped the prompt itself).
     const [showVibeInput, setShowVibeInput] = (0, react_1.useState)(false);
     const [vibePrompt, setVibePrompt] = (0, react_1.useState)('');
+    const [showCaptureChoices, setShowCaptureChoices] = (0, react_1.useState)(false);
     const [lastVibeTaskId, setLastVibeTaskId] = (0, react_1.useState)(null);
     const mountedRef = (0, react_1.useRef)(true);
     (0, react_1.useEffect)(() => {
@@ -69,6 +72,16 @@ const FeedbackModal = () => {
                 setError(null);
                 setToast(null);
                 setAction('idle');
+                setShowCaptureChoices(false);
+                // Re-read the "user hid the quick icon" flag on every open so
+                // the re-enable row reflects the latest preference (the user
+                // might have hidden or shown it between opens).
+                YaverFeedback_1.YaverFeedback.isQuickIconHidden()
+                    .then((v) => {
+                    if (mountedRef.current)
+                        setQuickIconHidden(v);
+                })
+                    .catch(() => { });
             }
         });
         // Agent streams build / compile progress through the BlackBox
@@ -108,6 +121,7 @@ const FeedbackModal = () => {
         setError(null);
         setToast(null);
         setAction('idle');
+        setShowCaptureChoices(false);
     }, []);
     // Helper: run a P2P call; on network failure, ask YaverFeedback to
     // re-query Convex for the fresh IP and retry once. Solves the common
@@ -188,26 +202,50 @@ const FeedbackModal = () => {
                 setAction('idle');
         }
     }, [closeSoon, runWithReconnect]);
-    // ─── 2. Screenshot + Fix ───────────────────────────────────────────
-    //
-    // Hide the modal first so the screenshot captures the actual screen
-    // (the bug) — not the modal card. Await a short animation delay,
-    // snapshot, upload the feedback bundle with any buffered errors, then
-    // kick `/feedback/{id}/fix` to create the repair task.
-    const handleScreenshotAndFix = (0, react_1.useCallback)(async () => {
+    const uploadBundleWithOptionalFix = (0, react_1.useCallback)(async (bundle, fixOnUpload, successToast, failureToast) => {
         const client = YaverFeedback_1.YaverFeedback.getP2PClient();
         const config = YaverFeedback_1.YaverFeedback.getConfig();
         if (!client || !config?.agentUrl) {
             setError('Not connected to the agent yet.');
             return;
         }
+        try {
+            const uploaded = await (0, upload_1.uploadFeedback)(config.agentUrl, config.authToken ?? '', bundle);
+            // The agent returns the new report id as `id` (see
+            // feedback_http.go::ReceiveFeedback). Trigger the fix loop if we got
+            // one back; otherwise just ack the upload.
+            const reportId = uploaded?.id ??
+                uploaded?.reportId;
+            if (reportId && fixOnUpload) {
+                try {
+                    await client.triggerFix(reportId);
+                    setToast(successToast);
+                }
+                catch (err) {
+                    setToast(failureToast ?? 'Report uploaded — fix trigger failed');
+                    setError(err instanceof Error ? err.message : String(err));
+                }
+            }
+            else {
+                setToast(successToast);
+            }
+            closeSoon(1400);
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : String(err));
+        }
+    }, [closeSoon]);
+    // ─── 3. Screenshot / Upload ───────────────────────────────────────
+    const handleCaptureChoiceToggle = (0, react_1.useCallback)(() => {
+        setShowCaptureChoices((v) => !v);
+    }, []);
+    const handleScreenshotAndFix = (0, react_1.useCallback)(async () => {
         setAction('capturing');
         setError(null);
-        // Step 1: Hide the modal so the screenshot contains the real screen.
+        setShowCaptureChoices(false);
         setVisible(false);
-        // Wait out the slide-down animation on both platforms.
         await new Promise((resolve) => setTimeout(resolve, 350));
-        let path = null;
+        let path;
         try {
             path = await (0, capture_1.captureScreenshot)();
         }
@@ -217,7 +255,6 @@ const FeedbackModal = () => {
             setAction('idle');
             return;
         }
-        // Step 2: Re-show the modal for progress + ack.
         setVisible(true);
         await new Promise((resolve) => setTimeout(resolve, 150));
         try {
@@ -241,35 +278,57 @@ const FeedbackModal = () => {
                 screenshots: [path],
                 errors: capturedErrors.length > 0 ? capturedErrors : undefined,
             };
-            const uploaded = await (0, upload_1.uploadFeedback)(config.agentUrl, config.authToken ?? '', bundle);
-            // The agent returns the new report id as `id` (see
-            // feedback_http.go::ReceiveFeedback). Trigger the fix loop if we got
-            // one back; otherwise just ack the upload.
-            const reportId = uploaded?.id ??
-                uploaded?.reportId;
-            if (reportId) {
-                try {
-                    await client.triggerFix(reportId);
-                    setToast('Fix task started');
-                }
-                catch (err) {
-                    setToast('Report uploaded — fix trigger failed');
-                    setError(err instanceof Error ? err.message : String(err));
-                }
-            }
-            else {
-                setToast('Report uploaded');
+            await uploadBundleWithOptionalFix(bundle, true, 'Fix task started');
+        }
+        finally {
+            if (mountedRef.current)
+                setAction('idle');
+        }
+    }, [uploadBundleWithOptionalFix]);
+    const handleFileUpload = (0, react_1.useCallback)(async () => {
+        setAction('capturing');
+        setError(null);
+        setShowCaptureChoices(false);
+        try {
+            const picked = await (0, capture_1.pickFeedbackFile)();
+            const { Dimensions } = require('react-native');
+            const { width, height } = Dimensions.get('window');
+            const deviceInfo = {
+                platform: react_native_1.Platform.OS,
+                osVersion: String(react_native_1.Platform.Version),
+                model: react_native_1.Platform.OS === 'ios' ? 'iOS Device' : 'Android Device',
+                screenWidth: width,
+                screenHeight: height,
+            };
+            const capturedErrors = YaverFeedback_1.YaverFeedback.getCapturedErrors();
+            const bundle = {
+                metadata: {
+                    timestamp: new Date().toISOString(),
+                    device: deviceInfo,
+                    app: {},
+                    userNote: `[Uploaded file] ${picked.name}`,
+                },
+                screenshots: picked.kind === 'image' ? [picked.path] : [],
+                video: picked.kind === 'video' ? picked.path : undefined,
+                audio: picked.kind === 'audio' ? picked.path : undefined,
+                errors: capturedErrors.length > 0 ? capturedErrors : undefined,
+            };
+            if (picked.kind === 'unknown') {
+                throw new Error('Pick an image, video, or audio file.');
             }
-            closeSoon(1400);
+            await uploadBundleWithOptionalFix(bundle, picked.kind === 'image', picked.kind === 'image' ? 'Fix task started' : 'File uploaded');
         }
         catch (err) {
-            setError(err instanceof Error ? err.message : String(err));
+            const message = err instanceof Error ? err.message : String(err);
+            if (message !== 'File selection canceled.') {
+                setError(message);
+            }
         }
         finally {
             if (mountedRef.current)
                 setAction('idle');
         }
-    }, [closeSoon]);
+    }, [uploadBundleWithOptionalFix]);
     // ─── 3. Vibing ─────────────────────────────────────────────────────
     // First tap expands the input; second submit fires the actual
     // /vibing/execute. Mirrors the Yaver mobile app's Vibing tab —
@@ -322,180 +381,124 @@ const FeedbackModal = () => {
                 setAction('idle');
         }
     }, [vibePrompt]);
-    // ─── 4. Toggle screen recording ────────────────────────────────────
-    const handleToggleRecording = (0, react_1.useCallback)(async () => {
+    // ─── 4. Screen recording ───────────────────────────────────────────
+    const handleScreenRecording = (0, react_1.useCallback)(async () => {
         setError(null);
-        if (isRecordingVideo) {
+        if (!isRecordingVideo && lastVideo) {
+            const config = YaverFeedback_1.YaverFeedback.getConfig();
+            if (!config?.agentUrl) {
+                setError('Not connected to the agent yet.');
+                return;
+            }
+            setAction('uploading-video');
             try {
-                const result = await (0, capture_1.stopVideoRecording)();
+                const { Dimensions } = require('react-native');
+                const { width, height } = Dimensions.get('window');
+                const deviceInfo = {
+                    platform: react_native_1.Platform.OS,
+                    osVersion: String(react_native_1.Platform.Version),
+                    model: react_native_1.Platform.OS === 'ios' ? 'iOS Device' : 'Android Device',
+                    screenWidth: width,
+                    screenHeight: height,
+                };
+                const bundle = {
+                    metadata: {
+                        timestamp: new Date().toISOString(),
+                        device: deviceInfo,
+                        app: {},
+                        userNote: '[Screen recording]',
+                    },
+                    screenshots: [],
+                    video: lastVideo.path,
+                    errors: YaverFeedback_1.YaverFeedback.getCapturedErrors().length
+                        ? YaverFeedback_1.YaverFeedback.getCapturedErrors()
+                        : undefined,
+                };
+                await (0, upload_1.uploadFeedback)(config.agentUrl, config.authToken ?? '', bundle);
                 if (mountedRef.current) {
-                    setIsRecordingVideo(false);
-                    setLastVideo(result);
-                    setToast(`Recording stopped — ${Math.round(result.duration)}s`);
+                    setToast(`Recording uploaded — ${Math.round(lastVideo.duration)}s`);
+                    setLastVideo(null);
                 }
+                closeSoon(1200);
             }
             catch (err) {
-                setIsRecordingVideo(false);
                 setError(err instanceof Error ? err.message : String(err));
             }
+            finally {
+                if (mountedRef.current)
+                    setAction('idle');
+            }
+            return;
         }
-        else {
+        if (isRecordingVideo) {
             try {
-                await (0, capture_1.startVideoRecording)();
+                const result = await (0, capture_1.stopVideoRecording)();
                 if (mountedRef.current) {
-                    setIsRecordingVideo(true);
-                    setToast('Recording…');
+                    setIsRecordingVideo(false);
+                    setLastVideo(result);
+                    setAction('uploading-video');
+                    setToast('Uploading recording…');
+                }
+                const config = YaverFeedback_1.YaverFeedback.getConfig();
+                if (!config?.agentUrl) {
+                    throw new Error('Not connected to the agent yet.');
+                }
+                const { Dimensions } = require('react-native');
+                const { width, height } = Dimensions.get('window');
+                const deviceInfo = {
+                    platform: react_native_1.Platform.OS,
+                    osVersion: String(react_native_1.Platform.Version),
+                    model: react_native_1.Platform.OS === 'ios' ? 'iOS Device' : 'Android Device',
+                    screenWidth: width,
+                    screenHeight: height,
+                };
+                const bundle = {
+                    metadata: {
+                        timestamp: new Date().toISOString(),
+                        device: deviceInfo,
+                        app: {},
+                        userNote: '[Screen recording]',
+                    },
+                    screenshots: [],
+                    video: result.path,
+                    errors: YaverFeedback_1.YaverFeedback.getCapturedErrors().length
+                        ? YaverFeedback_1.YaverFeedback.getCapturedErrors()
+                        : undefined,
+                };
+                await (0, upload_1.uploadFeedback)(config.agentUrl, config.authToken ?? '', bundle);
+                if (mountedRef.current) {
+                    setToast(`Recording uploaded — ${Math.round(result.duration)}s`);
                     setLastVideo(null);
                 }
+                closeSoon(1200);
             }
             catch (err) {
+                setIsRecordingVideo(false);
                 setError(err instanceof Error ? err.message : String(err));
             }
+            finally {
+                if (mountedRef.current)
+                    setAction('idle');
+            }
         }
-    }, [isRecordingVideo]);
-    // ─── Voice note: record → transcribe → send as feedback ───────────
-    // Tap once to start; tap again to stop. On stop: upload the audio
-    // to the agent's /voice/transcribe (which routes through whichever
-    // STT provider is configured — Whisper / Deepgram / OpenAI / etc.),
-    // then file the transcript as a bug report. The audio file itself
-    // is also attached to the feedback bundle so the agent can re-play
-    // it if the transcript is wrong.
-    const handleToggleVoice = (0, react_1.useCallback)(async () => {
-        setError(null);
-        if (!isRecordingVoice) {
+        else {
             try {
-                await (0, capture_1.startAudioRecording)();
+                await (0, capture_1.startVideoRecording)();
                 if (mountedRef.current) {
-                    setIsRecordingVoice(true);
-                    setAction('recording-voice');
-                    setToast('Recording voice note…');
+                    setIsRecordingVideo(true);
+                    setToast('Recording… tap again to stop and upload');
+                    setLastVideo(null);
                 }
             }
             catch (err) {
-                setIsRecordingVoice(false);
-                setAction('idle');
                 setError(err instanceof Error ? err.message : String(err));
             }
-            return;
-        }
-        // Stopping → transcribe → send.
-        try {
-            const audio = await (0, capture_1.stopAudioRecording)();
-            setIsRecordingVoice(false);
-            if (!audio) {
-                setAction('idle');
-                return;
-            }
-            setAction('transcribing-voice');
-            setToast('Transcribing…');
-            const config = YaverFeedback_1.YaverFeedback.getConfig();
-            if (!config?.agentUrl) {
-                setError('Not connected to the agent yet.');
-                setAction('idle');
-                return;
-            }
-            let transcript = '';
-            try {
-                const client = YaverFeedback_1.YaverFeedback.getP2PClient();
-                if (client) {
-                    const res = await client.transcribeVoice(audio.path);
-                    transcript = res.text ?? '';
-                }
-            }
-            catch {
-                // Transcription can fail (no STT provider configured on the
-                // agent, network blip, etc.). Don't block the flow — ship
-                // the raw audio file with a "[no transcript]" note so the
-                // agent + human reviewer can still play it back.
-            }
-            const { Dimensions } = require('react-native');
-            const { width, height } = Dimensions.get('window');
-            const deviceInfo = {
-                platform: react_native_1.Platform.OS,
-                osVersion: String(react_native_1.Platform.Version),
-                model: react_native_1.Platform.OS === 'ios' ? 'iOS Device' : 'Android Device',
-                screenWidth: width,
-                screenHeight: height,
-            };
-            const bundle = {
-                metadata: {
-                    timestamp: new Date().toISOString(),
-                    device: deviceInfo,
-                    app: {},
-                    userNote: transcript.length > 0
-                        ? `[Voice note] ${transcript}`
-                        : `[Voice note · ${Math.round(audio.duration)}s — transcription unavailable]`,
-                },
-                screenshots: [],
-                audio: audio.path,
-                errors: YaverFeedback_1.YaverFeedback.getCapturedErrors().length
-                    ? YaverFeedback_1.YaverFeedback.getCapturedErrors()
-                    : undefined,
-            };
-            await (0, upload_1.uploadFeedback)(config.agentUrl, config.authToken ?? '', bundle);
-            setToast(transcript ? `Sent: "${transcript.slice(0, 60)}${transcript.length > 60 ? '…' : ''}"` : 'Voice note sent');
-            closeSoon(1800);
-        }
-        catch (err) {
-            setError(err instanceof Error ? err.message : String(err));
-        }
-        finally {
-            if (mountedRef.current)
-                setAction('idle');
-        }
-    }, [isRecordingVoice, closeSoon]);
-    // ─── 5. Send the last recorded video ───────────────────────────────
-    const handleSendVideo = (0, react_1.useCallback)(async () => {
-        const config = YaverFeedback_1.YaverFeedback.getConfig();
-        if (!config?.agentUrl) {
-            setError('Not connected to the agent yet.');
-            return;
-        }
-        if (!lastVideo) {
-            setError('No video recorded yet.');
-            return;
-        }
-        setAction('sending-video');
-        setError(null);
-        try {
-            const { Dimensions } = require('react-native');
-            const { width, height } = Dimensions.get('window');
-            const deviceInfo = {
-                platform: react_native_1.Platform.OS,
-                osVersion: String(react_native_1.Platform.Version),
-                model: react_native_1.Platform.OS === 'ios' ? 'iOS Device' : 'Android Device',
-                screenWidth: width,
-                screenHeight: height,
-            };
-            const bundle = {
-                metadata: {
-                    timestamp: new Date().toISOString(),
-                    device: deviceInfo,
-                    app: {},
-                    userNote: '[Screen recording]',
-                },
-                screenshots: [],
-                video: lastVideo.path,
-                errors: YaverFeedback_1.YaverFeedback.getCapturedErrors().length
-                    ? YaverFeedback_1.YaverFeedback.getCapturedErrors()
-                    : undefined,
-            };
-            await (0, upload_1.uploadFeedback)(config.agentUrl, config.authToken ?? '', bundle);
-            setToast('Video sent');
-            setLastVideo(null);
-            closeSoon(1200);
-        }
-        catch (err) {
-            setError(err instanceof Error ? err.message : String(err));
-        }
-        finally {
-            if (mountedRef.current)
-                setAction('idle');
         }
-    }, [lastVideo, closeSoon]);
+    }, [closeSoon, isRecordingVideo, lastVideo]);
     const busy = action !== 'idle';
     return (<>
       <AuthOverlay_1.AuthOverlay />
+      <QuickActionIcon_1.QuickActionIcon />
       {visible && (<react_native_1.Modal visible={visible} animationType="slide" transparent onRequestClose={handleClose}>
           <react_native_1.Pressable style={styles.overlay} onPress={handleClose}>
             <react_native_1.Pressable style={styles.modal} onPress={(e) => e.stopPropagation()}>
@@ -509,11 +512,6 @@ const FeedbackModal = () => {
               {/* 1. Hot Reload — the common path */}
               <ActionRow label={action === 'hot-reloading' ? 'Reloading…' : 'Hot Reload'} tint="#fbbf24" onPress={handleHotReload} disabled={busy} busy={action === 'hot-reloading'}/>
 
-              {/* 2. Screenshot + Fix — for bug fixes */}
-              <ActionRow label={action === 'capturing'
-                ? 'Capturing…'
-                : 'Screenshot & Fix'} tint="#22c55e" onPress={handleScreenshotAndFix} disabled={busy} busy={action === 'capturing'}/>
-
               {/* 3. Vibing — expands to an input box on first tap
                  so the user says WHAT they want to vibe on, just
                  like the Yaver mobile app's Vibing tab. Second
@@ -539,24 +537,22 @@ const FeedbackModal = () => {
                   Last vibing task: {lastVibeTaskId.slice(0, 12)}…
                 </react_native_1.Text>)}
 
-              {/* Voice note — only rendered when expo-av is installed.
-                Tap to start, tap again to stop → transcribes via
-                the agent and files as a feedback report. */}
-              {voiceSupported && (<ActionRow label={action === 'transcribing-voice'
-                    ? 'Transcribing…'
-                    : isRecordingVoice
-                        ? 'Stop & Send Voice'
-                        : 'Voice Note'} tint={isRecordingVoice ? '#ef4444' : '#f472b6'} onPress={handleToggleVoice} disabled={busy && action !== 'recording-voice' && action !== 'idle'} busy={action === 'transcribing-voice'}/>)}
-
-              {/* 4. Start/Stop Recording */}
-              <ActionRow label={isRecordingVideo ? 'Stop Recording' : 'Start Recording'} tint={isRecordingVideo ? '#ef4444' : '#60a5fa'} onPress={handleToggleRecording} disabled={busy && action !== 'idle' && !isRecordingVideo}/>
+              {/* Screenshot / Upload */}
+              {!showCaptureChoices ? (<ActionRow label={action === 'capturing'
+                    ? 'Working…'
+                    : 'Screenshot / Upload'} tint="#22c55e" onPress={handleCaptureChoiceToggle} disabled={busy} busy={action === 'capturing'}/>) : (<react_native_1.View style={styles.captureChoices}>
+                  <ActionRow label="Take Screenshot" tint="#22c55e" onPress={handleScreenshotAndFix} disabled={busy}/>
+                  <ActionRow label="Upload File" tint="#34d399" onPress={handleFileUpload} disabled={busy}/>
+                </react_native_1.View>)}
 
-              {/* 5. Send Video (only tappable when a clip is ready) */}
-              <ActionRow label={action === 'sending-video'
-                ? 'Sending…'
-                : lastVideo
-                    ? `Send Video · ${Math.round(lastVideo.duration)}s`
-                    : 'Send Video'} tint="#a78bfa" onPress={handleSendVideo} disabled={busy || !lastVideo} busy={action === 'sending-video'}/>
+              {/* 4. Screen recording */}
+              <ActionRow label={action === 'uploading-video'
+                ? 'Uploading…'
+                : isRecordingVideo
+                    ? 'Stop & Upload Recording'
+                    : lastVideo
+                        ? `Retry Upload Recording · ${Math.round(lastVideo.duration)}s`
+                        : 'Screen Recording'} tint={isRecordingVideo ? '#ef4444' : '#60a5fa'} onPress={handleScreenRecording} disabled={busy && action !== 'uploading-video' && !isRecordingVideo} busy={action === 'uploading-video'}/>
 
               {progress !== null && (<react_native_1.View style={styles.progressTrack}>
                   <react_native_1.View style={[
@@ -566,6 +562,34 @@ const FeedbackModal = () => {
                 </react_native_1.View>)}
               {toast && <react_native_1.Text style={styles.toast}>{toast}</react_native_1.Text>}
               {error && <react_native_1.Text style={styles.error}>{error}</react_native_1.Text>}
+
+              {/* Quick-icon toggle. The user's three ways to control
+                the floating icon are: (1) long-press the icon →
+                Hide, (2) tap this row to toggle it on/off, (3) shake
+                → this modal → tap this row. Shake is the unkillable
+                back-door when the icon is hidden and the dev hasn't
+                exposed their own settings UI. */}
+              <react_native_1.Pressable onPress={async () => {
+                const next = !quickIconHidden;
+                setQuickIconHidden(next);
+                await YaverFeedback_1.YaverFeedback.setQuickIconVisible(!next);
+            }} style={({ pressed }) => [
+                styles.quickIconToggle,
+                pressed && { opacity: 0.7 },
+            ]} accessibilityRole="button" accessibilityLabel={quickIconHidden ? 'Show quick icon' : 'Hide quick icon'}>
+                <react_native_1.Text style={styles.quickIconToggleText}>
+                  {quickIconHidden
+                ? '◯  Show quick-access icon'
+                : '●  Hide quick-access icon'}
+                </react_native_1.Text>
+              </react_native_1.Pressable>
+
+              <react_native_1.Pressable onPress={handleClose} style={({ pressed }) => [
+                styles.cancelBtn,
+                pressed && styles.buttonPressed,
+            ]} accessibilityRole="button" accessibilityLabel="Cancel">
+                <react_native_1.Text style={styles.cancelBtnText}>Cancel</react_native_1.Text>
+              </react_native_1.Pressable>
             </react_native_1.Pressable>
           </react_native_1.Pressable>
         </react_native_1.Modal>)}
@@ -686,6 +710,9 @@ const styles = react_native_1.StyleSheet.create({
         fontSize: 15,
         fontWeight: '700',
     },
+    captureChoices: {
+        gap: 10,
+    },
     progressTrack: {
         height: 6,
         borderRadius: 3,
@@ -710,4 +737,33 @@ const styles = react_native_1.StyleSheet.create({
         textAlign: 'center',
         marginTop: 4,
     },
+    quickIconToggle: {
+        marginTop: 4,
+        alignSelf: 'center',
+        paddingVertical: 6,
+        paddingHorizontal: 12,
+    },
+    quickIconToggleText: {
+        color: '#9ca3af',
+        fontSize: 12,
+        fontWeight: '500',
+    },
+    cancelBtn: {
+        marginTop: 4,
+        borderRadius: 14,
+        borderWidth: 1,
+        borderColor: 'rgba(255,255,255,0.1)',
+        paddingVertical: 15,
+        alignItems: 'center',
+        justifyContent: 'center',
+        backgroundColor: 'rgba(255,255,255,0.04)',
+    },
+    cancelBtnText: {
+        color: '#e5e7eb',
+        fontSize: 15,
+        fontWeight: '700',
+    },
+    buttonPressed: {
+        opacity: 0.7,
+    },
 });

package/dist/P2PClient.js

@@ -152,6 +152,13 @@ class P2PClient {
                 name: 'screen_recording.mp4',
             });
         }
+        if (bundle.audio) {
+            formData.append('audio', {
+                uri: react_native_1.Platform.OS === 'android' ? `file://${bundle.audio}` : bundle.audio,
+                type: 'audio/m4a',
+                name: 'voice_note.m4a',
+            });
+        }
         const response = await fetch(`${this.baseUrl}/feedback`, {
             method: 'POST',
             headers: {

package/dist/QuickActionIcon.d.ts

@@ -0,0 +1,43 @@
+import React from 'react';
+export interface QuickActionIconProps {
+    /** Deprecated alias for `backgroundColor`. */
+    color?: string;
+    /** Override the background from FeedbackConfig.quickIconBackgroundColor. */
+    backgroundColor?: string;
+    /** Override the label color from FeedbackConfig.quickIconForegroundColor. */
+    foregroundColor?: string;
+    /** Override the border color from FeedbackConfig.quickIconBorderColor. */
+    borderColor?: string;
+    /** Override the shadow color from FeedbackConfig.quickIconShadowColor. */
+    shadowColor?: string;
+    /** Override the initial position from FeedbackConfig.quickIconInitialPosition. */
+    initialPosition?: {
+        x: number;
+        y: number;
+    };
+    /** Override the icon diameter. Default 44. */
+    size?: number;
+}
+/**
+ * Small tap-to-open icon for the Yaver Feedback SDK.
+ *
+ * Default UX:
+ *  - **Tap** opens the feedback modal (same as shake).
+ *  - **Long-press** (~550ms) opens a menu with "Open feedback" and
+ *    "Hide icon". Hiding is persisted to AsyncStorage so the user's
+ *    decision survives app relaunches.
+ *  - **Drag** repositions the icon.
+ *
+ * Shake always keeps working independently — even when the icon is
+ * hidden the user can still shake to open feedback.
+ *
+ * Visibility is controlled by `FeedbackConfig.quickIcon`:
+ *  - `'auto'` (default) → `'after-shake'` on iOS/Android, `'off'` on web.
+ *  - `'always'` → visible from first render.
+ *  - `'after-shake'` → hidden until `yaverFeedback:firstShake` fires.
+ *  - `'off'` → never rendered.
+ *
+ * Suppressed entirely when the SDK is loaded inside Yaver's super-host
+ * (the Yaver mobile app owns the shake gesture + overlay in that case).
+ */
+export declare const QuickActionIcon: React.FC<QuickActionIconProps>;