@tapthrough/expo 0.0.0-stage → 0.1.1

package/dist/Feedback.js

@@ -0,0 +1,977 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import Constants from 'expo-constants';
+import { usePathname } from 'expo-router';
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { ActivityIndicator, Animated, AppState, Image, Keyboard, KeyboardAvoidingView, Linking, Platform, Pressable, ScrollView, StyleSheet, Text, TextInput, useWindowDimensions, View, } from 'react-native';
+import { Annotator } from './Annotator.js';
+import { Bubble, COLORS, screenBounds } from './Bubble.js';
+import { defaultPosition } from './core/bubble.js';
+import { createDiagnostics, installDiagnostics } from './core/diagnostics.js';
+import { failedStepBody, fetchChecklist, fileIssue, previewContextFromManifest, requestFix, requestLaunch, reviewBadge, sendCause, sendFeedback, sendRecheck, sendStepResult, } from './core/feedback.js';
+import { answerIdea, approveMessage, fetchIdeas, fetchOpenPrs, ideaAction, ideasNeedingYou, isMoving, sendStaffReport, submitIdea, } from './core/ideas.js';
+import { nextOpenStep, popoverPlacement, resultsFrom, stepId } from './core/review.js';
+import { useLaunchState } from './hooks.js';
+import { Overlay, useBackPress } from './Overlay.js';
+import { ReviewerName, ReviewPopover, } from './Popover.js';
+import { controller } from './runtime.js';
+import { captureScreenshot } from './screenshot.js';
+import { haptics, useReduceMotion } from './ui/native.js';
+import { Capsule, CircleButton, Icon, Surface } from './ui/parts.js';
+import { SPRING, text, useColors } from './ui/theme.js';
+/** Remembered for the session, so reviewers type their name once. */
+let rememberedName = '';
+/** Where idea updates go, if the person gave an email; also kept for the session. */
+let rememberedEmail = '';
+const diagnostics = createDiagnostics();
+let diagnosticsInstalled = false;
+function deviceInfo() {
+    const constants = Platform.constants;
+    if (Platform.OS === 'ios') {
+        return {
+            os: 'iOS',
+            osVersion: String(Platform.Version),
+            model: constants.interfaceIdiom === 'pad' ? 'iPad' : 'iPhone',
+        };
+    }
+    const model = [constants.Manufacturer, constants.Model].filter(Boolean).join(' ');
+    return {
+        os: 'Android',
+        osVersion: String(constants.Release ?? Platform.Version),
+        ...(model ? { model } : {}),
+    };
+}
+/** e.g. "iPhone · iOS 26.1", for the composer's list of what's attached. */
+function deviceLabel() {
+    const { os, osVersion, model } = deviceInfo();
+    return `${model ?? os} · ${os} ${osVersion}`;
+}
+/** The app's version and build, from its config, for reports from staff builds. */
+function appVersion() {
+    const config = Constants.expoConfig;
+    const build = Platform.OS === 'ios' ? config?.ios?.buildNumber : config?.android?.versionCode;
+    return {
+        ...(config?.version ? { version: config.version } : {}),
+        ...(build !== undefined ? { build: String(build) } : {}),
+    };
+}
+/** e.g. "Version 2.4.0 (311)", for staff builds' panel and composer. */
+function appLabel() {
+    const { version, build } = appVersion();
+    if (!version)
+        return 'This build';
+    return build ? `Version ${version} (${build})` : `Version ${version}`;
+}
+/** What a staff build's panel shows instead of a PR's checklist: nothing to check. */
+const STAFF_CHECKLIST = {
+    pr: 0,
+    sha: '',
+    open: true,
+    scenarios: [],
+    recheck: [],
+    library: [],
+    newerBuild: null,
+    reset: null,
+};
+function nextFrame() {
+    return new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(() => resolve())));
+}
+/**
+ * Puts the app's keyboard away. A sheet that opens while it's up can't tell
+ * it's there, so the bottom of the sheet would sit under it. Resolves once it's
+ * gone, so a screenshot taken next doesn't catch it halfway down.
+ */
+function dismissKeyboard() {
+    if (!Keyboard.isVisible())
+        return Promise.resolve();
+    return new Promise((resolve) => {
+        const done = () => {
+            subscription.remove();
+            clearTimeout(fallback);
+            resolve();
+        };
+        const subscription = Keyboard.addListener('keyboardDidHide', done);
+        // In case the event never comes, e.g. a hardware keyboard.
+        const fallback = setTimeout(done, 500);
+        Keyboard.dismiss();
+    });
+}
+/** How often a PR preview checks for new results and newer builds while in the foreground. */
+const REFRESH_MS = 30_000;
+/** How often an open idea that's moving checks for its next step. */
+const IDEA_REFRESH_MS = 8_000;
+/** Update groups the reviewer has already been told about, so the toast shows once. */
+const announcedBuilds = new Set();
+/**
+ * A small draggable Review button over a PR preview. Tapping it grows a
+ * popover listing what the PR needs tested; picking a scenario can set the app
+ * up for it and then walks through its steps. Without a plan it goes straight
+ * to reporting an issue with a screenshot of the screen behind it. It keeps
+ * the checklist fresh in the background, so it can say when a newer build is out.
+ */
+export function ReportButton({ apiUrl, canSetUp, appKey, }) {
+    const preview = useMemo(() => previewContextFromManifest(Constants.manifest2), []);
+    // A PR build proves itself with its update; any other build needs the app key.
+    const caller = useMemo(() => (preview ? { kind: 'build', preview } : appKey ? { kind: 'key', appKey } : null), [preview, appKey]);
+    const staffMode = caller?.kind === 'key';
+    const pathname = usePathname();
+    const { width, height } = useWindowDimensions();
+    const bounds = screenBounds(width, height);
+    const [phase, setPhase] = useState('idle');
+    const [checklist, setChecklist] = useState(staffMode ? STAFF_CHECKLIST : null);
+    const [nav, setNav] = useState({ view: 'list' });
+    const [direction, setDirection] = useState('forward');
+    const [full, setFull] = useState(false);
+    const [overrides, setOverrides] = useState({});
+    const [rechecked, setRechecked] = useState({});
+    const [setup, setSetup] = useState(null);
+    const [anchor, setAnchor] = useState(null);
+    const [error, setError] = useState(null);
+    const [name, setName] = useState(rememberedName);
+    const [failing, setFailing] = useState(null);
+    const [screenshot, setScreenshot] = useState(null);
+    const [toast, setToast] = useState(null);
+    const [ideas, setIdeas] = useState([]);
+    const [ideaBusy, setIdeaBusy] = useState(null);
+    const [pulls, setPulls] = useState(null);
+    const [composerKind, setComposerKind] = useState('issue');
+    const launch = useLaunchState();
+    const platform = Platform.OS === 'ios' || Platform.OS === 'android' ? Platform.OS : null;
+    const results = useMemo(() => ({ ...resultsFrom(checklist), ...overrides }), [checklist, overrides]);
+    // PR previews and staff builds record diagnostics; store builds are never hooked.
+    useEffect(() => {
+        if (!caller || diagnosticsInstalled)
+            return;
+        diagnosticsInstalled = true;
+        installDiagnostics(diagnostics, {
+            console,
+            errorUtils: typeof ErrorUtils === 'undefined' ? undefined : ErrorUtils,
+            fetchHost: globalThis,
+        }, apiUrl);
+    }, [caller, apiUrl]);
+    useEffect(() => {
+        if (caller)
+            diagnostics.recordScreen(pathname);
+    }, [caller, pathname]);
+    async function refresh() {
+        if (!caller || !platform)
+            return null;
+        const [list, recent] = await Promise.all([
+            preview ? fetchChecklist(preview, platform, { apiUrl }) : Promise.resolve(STAFF_CHECKLIST),
+            fetchIdeas(caller, platform, { apiUrl }),
+        ]);
+        if (list)
+            setChecklist(list);
+        setIdeas(recent);
+        const newer = list?.newerBuild;
+        if (newer && !announcedBuilds.has(newer.updateGroupId)) {
+            announcedBuilds.add(newer.updateGroupId);
+            setToast(newer);
+        }
+        return list;
+    }
+    // Fetch up front so the popover opens instantly, then poll while the app is in front.
+    // biome-ignore lint/correctness/useExhaustiveDependencies: refresh reads current props
+    useEffect(() => {
+        if (!caller || !platform)
+            return;
+        let timer;
+        const start = () => {
+            clearInterval(timer);
+            void refresh();
+            timer = setInterval(() => void refresh(), REFRESH_MS);
+        };
+        const stop = () => clearInterval(timer);
+        if (AppState.currentState === 'active')
+            start();
+        const subscription = AppState.addEventListener('change', (next) => next === 'active' ? start() : stop());
+        return () => {
+            stop();
+            subscription.remove();
+        };
+    }, [caller, platform, apiUrl]);
+    // Watching an idea that's being written up or built: check every few seconds, not every 30.
+    const watched = nav.view === 'idea' ? ideas.find((i) => i.id === nav.id) : undefined;
+    const watching = phase === 'open' && watched !== undefined && isMoving(watched);
+    useEffect(() => {
+        if (!watching || !caller || !platform)
+            return;
+        const timer = setInterval(async () => {
+            setIdeas(await fetchIdeas(caller, platform, { apiUrl }));
+        }, IDEA_REFRESH_MS);
+        return () => clearInterval(timer);
+    }, [watching, caller, platform, apiUrl]);
+    useEffect(() => {
+        if (!toast)
+            return;
+        const timer = setTimeout(() => setToast(null), 6000);
+        return () => clearTimeout(timer);
+    }, [toast]);
+    // A setup this popover started: follow the launch through its stages.
+    useEffect(() => {
+        if (!setup || setup.error || setup.progress === 'done')
+            return;
+        if (launch.status === 'idle' || launch.source !== 'app')
+            return;
+        if (launch.status === 'launching') {
+            if (launch.stage && launch.stage !== setup.progress) {
+                setSetup({ ...setup, progress: launch.stage });
+            }
+            return;
+        }
+        controller.dismiss();
+        if (launch.status === 'error') {
+            haptics.warning();
+            setSetup({ ...setup, error: launch.error.message });
+            return;
+        }
+        haptics.success();
+        setSetup({ ...setup, progress: 'done' });
+    }, [launch, setup]);
+    // Once every line is ticked, let it show for a moment, then start the steps.
+    // biome-ignore lint/correctness/useExhaustiveDependencies: begin reads the current checklist
+    useEffect(() => {
+        if (setup?.progress !== 'done' || setup.error)
+            return;
+        const key = setup.key;
+        const timer = setTimeout(() => {
+            setSetup(null);
+            begin(key);
+            void refresh();
+        }, 700);
+        return () => clearTimeout(timer);
+    }, [setup]);
+    if (!caller || !platform)
+        return null;
+    function go(next, dir = 'forward') {
+        setDirection(dir);
+        setNav(next);
+        setError(null);
+    }
+    function rememberName() {
+        rememberedName = name.trim();
+    }
+    /** Starts a scenario's steps where they're left off, or explores another state. */
+    function begin(key) {
+        const scenario = checklist?.scenarios.find((s) => s.key === key);
+        if (!scenario?.steps.length) {
+            go({ view: 'explore', key });
+            return;
+        }
+        const index = nextOpenStep(scenario, results);
+        go(index >= 0 ? { view: 'step', key, index } : { view: 'done', key });
+    }
+    async function setUp(key) {
+        if (!preview || !platform)
+            return;
+        haptics.selection();
+        controller.dismiss();
+        go({ view: 'setup', key });
+        setSetup({ key, progress: 'requesting' });
+        const result = await requestLaunch({ preview, platform, scenarioKey: key }, { apiUrl });
+        if (!result.ok) {
+            haptics.warning();
+            setSetup({ key, progress: 'requesting', error: result.message });
+            return;
+        }
+        if (!controller.offer(result.launchUrl, 'app')) {
+            setSetup({
+                key,
+                progress: 'requesting',
+                error: 'That setup link was already used. Try again.',
+            });
+        }
+    }
+    async function pass(key, index) {
+        const scenario = checklist?.scenarios.find((s) => s.key === key);
+        const step = scenario?.steps[index];
+        if (!preview || !platform || !scenario || !step)
+            return;
+        rememberName();
+        haptics.selection();
+        const id = stepId(key, step.index);
+        const previous = results[id];
+        const after = { ...results, [id]: 'pass' };
+        setOverrides((current) => ({ ...current, [id]: 'pass' }));
+        // Let the green show, then slide in the next step.
+        setTimeout(() => {
+            const next = nextOpenStep(scenario, after, index + 1);
+            go(next >= 0 ? { view: 'step', key, index: next } : { view: 'done', key });
+            if (next < 0)
+                haptics.success();
+        }, 280);
+        const sent = await sendStepResult({
+            preview,
+            platform,
+            scenarioKey: key,
+            stepIndex: step.index,
+            result: 'pass',
+            ...(rememberedName ? { reporterName: rememberedName } : {}),
+        }, { apiUrl });
+        if (!sent.ok) {
+            setOverrides((current) => ({ ...current, [id]: previous }));
+            setError(sent.message);
+        }
+    }
+    function fail(key, index) {
+        const step = checklist?.scenarios.find((s) => s.key === key)?.steps[index];
+        if (!step)
+            return;
+        rememberName();
+        haptics.warning();
+        void startReport({ scenarioKey: key, step, position: index });
+    }
+    async function recheck(item, result) {
+        if (!preview || !platform)
+            return;
+        rememberName();
+        haptics.selection();
+        setRechecked((current) => ({ ...current, [item.id]: result }));
+        setTimeout(() => go({ view: 'list' }, 'back'), 350);
+        const sent = await sendRecheck({
+            preview,
+            platform,
+            findingId: item.id,
+            result,
+            ...(rememberedName ? { reporterName: rememberedName } : {}),
+        }, { apiUrl });
+        if (!sent.ok) {
+            setRechecked(({ [item.id]: _, ...rest }) => rest);
+            setError(sent.message);
+        }
+    }
+    async function toggle() {
+        if (phase === 'open') {
+            close();
+            return;
+        }
+        setToast(null);
+        const keyboardGone = dismissKeyboard();
+        // A setup that finished or failed while closed shouldn't leave a spinner behind.
+        if (nav.view === 'setup' && !setup)
+            setNav({ view: 'list' });
+        // With a checklist the popover always opens, so ideas and other PRs are a tap away.
+        if (checklist) {
+            setPhase('open');
+            void refresh();
+            return;
+        }
+        setPhase('loading');
+        const list = await refresh();
+        if (list) {
+            setPhase('open');
+        }
+        else {
+            await keyboardGone;
+            await startReport(null);
+        }
+    }
+    function close() {
+        setPhase('idle');
+        setFull(false);
+        setError(null);
+    }
+    /** Hides everything, screenshots the app, then opens the composer. */
+    async function startReport(step, kind = 'issue') {
+        setFailing(step);
+        setComposerKind(step ? 'issue' : kind);
+        setToast(null);
+        setPhase('capturing');
+        try {
+            await nextFrame();
+            setScreenshot(await captureScreenshot());
+        }
+        finally {
+            // Whatever happens to the screenshot, the reviewer gets the composer.
+            setPhase('composing');
+        }
+    }
+    /** Back from the composer without sending: to the popover if that's where it started. */
+    function cancelReport() {
+        setScreenshot(null);
+        setFailing(null);
+        setPhase(checklist ? 'open' : 'idle');
+    }
+    /** After an idea is sent: straight to it in the popover, where its progress shows. */
+    function viewIdea(idea) {
+        setIdeas((current) => [idea, ...current.filter((i) => i.id !== idea.id)]);
+        setScreenshot(null);
+        setFailing(null);
+        go({ view: 'idea', id: idea.id });
+        setPhase(checklist ? 'open' : 'idle');
+    }
+    function replaceIdea(idea) {
+        setIdeas((current) => current.map((i) => (i.id === idea.id ? idea : i)));
+    }
+    async function answer(id, answers) {
+        if (!caller || !platform)
+            return;
+        rememberName();
+        setIdeaBusy(id);
+        const result = await answerIdea({ caller, platform, id, answers, ...(rememberedName ? { by: rememberedName } : {}) }, { apiUrl });
+        setIdeaBusy(null);
+        if (!result.ok) {
+            haptics.warning();
+            setError(result.message);
+            return;
+        }
+        haptics.success();
+        replaceIdea(result.idea);
+    }
+    async function act(id, action) {
+        if (!caller || !platform)
+            return;
+        rememberName();
+        haptics.selection();
+        setIdeaBusy(id);
+        const result = await ideaAction({ caller, platform, id, action, ...(rememberedName ? { by: rememberedName } : {}) }, { apiUrl });
+        setIdeaBusy(null);
+        if (!result.ok) {
+            haptics.warning();
+            setError(result.message);
+            return;
+        }
+        haptics.success();
+        replaceIdea(action === 'approve' ? { ...result.idea, note: approveMessage(result.approve) } : result.idea);
+    }
+    async function showPulls() {
+        if (!preview || !platform)
+            return;
+        setPulls(null);
+        const list = await fetchOpenPrs(preview, platform, { apiUrl });
+        if (list)
+            setPulls(list);
+        else {
+            setPulls([]);
+            setError('Couldn’t load the open pull requests. Try again in a moment.');
+        }
+    }
+    /** Opens another PR's latest build in this app, the same way a newer build opens. */
+    function switchPr(pr) {
+        if (!pr.openUrl)
+            return;
+        haptics.selection();
+        close();
+        Linking.openURL(pr.openUrl);
+    }
+    /** After a report is sent: a failed step moves the plan on; the next tap carries on there. */
+    function finishReport() {
+        if (failing) {
+            const scenario = checklist?.scenarios.find((s) => s.key === failing.scenarioKey);
+            const id = stepId(failing.scenarioKey, failing.step.index);
+            const after = { ...results, [id]: 'fail' };
+            setOverrides((current) => ({ ...current, [id]: 'fail' }));
+            if (scenario) {
+                const next = nextOpenStep(scenario, after, failing.position + 1);
+                go(next >= 0
+                    ? { view: 'step', key: scenario.key, index: next }
+                    : { view: 'done', key: scenario.key });
+            }
+        }
+        setScreenshot(null);
+        setFailing(null);
+        setPhase('idle');
+        void refresh();
+    }
+    const placement = popoverPlacement(anchor ?? defaultPosition(bounds), bounds);
+    const showButton = phase === 'idle' || phase === 'loading' || (phase === 'open' && !full);
+    return (_jsxs(Overlay, { children: [toast && phase !== 'open' && phase !== 'composing' && phase !== 'capturing' ? (_jsx(NewBuildToast, { build: toast, onPress: toggle })) : null, phase === 'open' && checklist ? (_jsx(ReviewPopover, { staff: staffMode ? appLabel() : null, checklist: checklist, results: results, rechecked: rechecked, nav: nav, direction: direction, onNav: (next, dir) => {
+                    haptics.selection();
+                    go(next, dir);
+                }, placement: placement, bounds: bounds, full: full, onToggleFull: () => {
+                    haptics.light();
+                    setFull((current) => !current);
+                }, onClose: close, canSetUp: canSetUp, setup: setup, onSetUp: setUp, onStart: (key) => {
+                    haptics.selection();
+                    setSetup(null);
+                    begin(key);
+                }, onPass: pass, onFail: fail, onRecheck: recheck, onReportOther: () => void startReport(null), ideas: ideas, onShareIdea: () => void startReport(null, 'idea'), onAnswerIdea: (id, answers) => void answer(id, answers), onIdeaAction: (id, action) => void act(id, action), ideaBusy: ideaBusy, pulls: pulls, onShowPulls: () => void showPulls(), onSwitchPr: switchPr, name: name, onNameChange: (next) => {
+                    setName(next);
+                    rememberedName = next.trim();
+                }, error: error })) : null, showButton ? (_jsx(Bubble, { onPress: toggle, badge: reviewBadge(checklist) ?? (ideasNeedingYou(ideas) ? { kind: 'idea' } : null), busy: phase === 'loading', active: phase === 'open', onRest: setAnchor })) : null, phase === 'composing' && screenshot ? _jsx(CaptureFlash, {}) : null, phase === 'composing' ? (_jsx(Composer, { screenshot: screenshot, route: pathname, branch: preview?.branch, staff: staffMode ? appLabel() : null, onSendStaff: (input) => sendStaffReport({
+                    appKey: appKey ?? '',
+                    platform,
+                    report: {
+                        ...input,
+                        route: pathname,
+                        device: deviceInfo(),
+                        app: appVersion(),
+                        diagnostics: diagnostics.snapshot(),
+                    },
+                }, { apiUrl }), device: deviceLabel(), hasScenario: Boolean(controller.lastScenarioId()), failedStep: failing?.step ?? null, kind: composerKind, onKindChange: setComposerKind, onSendIdea: (draft) => submitIdea({
+                    caller,
+                    platform,
+                    draft: { ...draft, route: pathname, device: deviceInfo() },
+                }, { apiUrl }), onViewIdea: viewIdea, onSend: async (input) => {
+                    if (!preview)
+                        return { ok: false, message: 'This build isn’t a PR preview.' };
+                    const result = await sendFeedback({
+                        ...input,
+                        body: failing ? failedStepBody(failing.step, input.body) : input.body,
+                        // A failed step in the PR's own plan is the PR's to fix.
+                        ...(failing ? { cause: 'pr' } : {}),
+                        preview,
+                        platform,
+                        route: pathname,
+                        device: deviceInfo(),
+                        diagnostics: diagnostics.snapshot(),
+                        ...(controller.lastScenarioId() ? { scenarioId: controller.lastScenarioId() } : {}),
+                    }, { apiUrl });
+                    if (result.ok && failing) {
+                        await sendStepResult({
+                            preview,
+                            platform,
+                            scenarioKey: failing.scenarioKey,
+                            stepIndex: failing.step.index,
+                            result: 'fail',
+                            ...(input.reporterName ? { reporterName: input.reporterName } : {}),
+                            ...(result.findingId ? { findingId: result.findingId } : {}),
+                        }, { apiUrl });
+                    }
+                    return result;
+                }, onSetCause: (findingId, cause) => preview
+                    ? sendCause({ preview, platform, findingId, cause }, { apiUrl })
+                    : Promise.resolve({ ok: false, message: 'Not a PR preview.' }), onFileIssue: (findingId) => preview
+                    ? fileIssue({ preview, platform, findingId }, { apiUrl })
+                    : Promise.resolve({
+                        ok: false,
+                        message: 'Not a PR preview.',
+                        openInBrowser: false,
+                    }), onRequestFix: (findingId) => !preview
+                    ? Promise.resolve({ ok: false, message: 'Not a PR preview.' })
+                    : requestFix({
+                        preview,
+                        platform,
+                        findingId,
+                        ...(rememberedName ? { reporterName: rememberedName } : {}),
+                    }, { apiUrl }), onCancel: cancelReport, onClose: finishReport })) : null] }));
+}
+/**
+ * A floating glass sheet that rises from the bottom edge and sits above the
+ * keyboard. It's a plain view in the overlay rather than a Modal, because on
+ * iOS a Modal can't present while the app is already showing a native modal
+ * screen. With `scrim`, the app behind dims and a tap on it closes the sheet.
+ */
+function Sheet({ onClose, scrim = false, children, }) {
+    const { height } = useWindowDimensions();
+    const reduceMotion = useReduceMotion();
+    const shown = useRef(new Animated.Value(0)).current;
+    useBackPress(onClose);
+    useEffect(() => {
+        if (reduceMotion) {
+            shown.setValue(1);
+            return;
+        }
+        Animated.spring(shown, { toValue: 1, ...SPRING, useNativeDriver: true }).start();
+    }, [shown, reduceMotion]);
+    return (_jsxs(KeyboardAvoidingView, { style: [
+            StyleSheet.absoluteFill,
+            styles.backdrop,
+            { paddingTop: screenBounds(0, 0).insetTop },
+        ], behavior: Platform.OS === 'ios' ? 'padding' : undefined, children: [_jsx(Animated.View, { style: [StyleSheet.absoluteFill, scrim && styles.scrim, { opacity: shown }], children: _jsx(Pressable, { style: StyleSheet.absoluteFill, onPress: scrim ? onClose : undefined, accessible: scrim, accessibilityRole: "button", accessibilityLabel: "Close" }) }), _jsx(Animated.View, { style: [
+                    styles.sheet,
+                    // Slides only: fading a view that holds glass stops the glass rendering.
+                    {
+                        transform: [
+                            {
+                                translateY: shown.interpolate({
+                                    inputRange: [0, 1],
+                                    outputRange: [height * 0.6, 0],
+                                }),
+                            },
+                        ],
+                    },
+                ], accessibilityViewIsModal: true, children: _jsx(Surface, { radius: 38, style: styles.sheetSurface, children: children }) })] }));
+}
+/** Close or Done on the left, a centered title, and the main action on the right. */
+function SheetHeader({ title, subtitle, left, right, }) {
+    const colors = useColors();
+    return (_jsxs(View, { style: styles.sheetHeader, children: [_jsx(View, { style: styles.sheetSide, children: left }), _jsxs(View, { style: styles.sheetTitle, children: [title ? (_jsx(Text, { style: [text.headline, styles.center, { color: colors.label }], numberOfLines: 1, children: title })) : null, subtitle ? (_jsx(Text, { style: [text.footnote, styles.center, { color: colors.secondary }], numberOfLines: 1, children: subtitle })) : null] }), _jsx(View, { style: [styles.sheetSide, styles.sheetSideRight], children: right })] }));
+}
+/** A short white flash as the screen is captured, like the system screenshot. */
+function CaptureFlash() {
+    const opacity = useRef(new Animated.Value(0.85)).current;
+    const [done, setDone] = useState(false);
+    useEffect(() => {
+        Animated.timing(opacity, { toValue: 0, duration: 260, useNativeDriver: true }).start(() => setDone(true));
+    }, [opacity]);
+    if (done)
+        return null;
+    return (_jsx(Animated.View, { style: [StyleSheet.absoluteFill, styles.flash, { opacity }], pointerEvents: "none" }));
+}
+/** "A new build is ready" for a moment at the top, then it's just the bubble's dot. */
+function NewBuildToast({ build, onPress }) {
+    const colors = useColors();
+    return (_jsx(View, { style: styles.toastWrap, pointerEvents: "box-none", children: _jsx(Pressable, { onPress: onPress, style: ({ pressed }) => [pressed && styles.pressed], accessibilityRole: "button", accessibilityLiveRegion: "polite", children: _jsxs(Surface, { radius: 24, style: styles.toast, children: [_jsx(View, { style: [styles.toastDot, { backgroundColor: COLORS.tape }] }), _jsx(Text, { style: [text.subhead, styles.strong, { color: colors.label }], children: build.hasFix ? 'Claude’s fix is ready to test' : 'A new build is ready' }), _jsx(Text, { style: [text.subhead, styles.strong, { color: colors.tint }], children: "View" })] }) }) }));
+}
+function Composer({ screenshot, route, branch, device, hasScenario, failedStep, kind, staff, onSendStaff, onKindChange, onSendIdea, onViewIdea, onSend, onSetCause, onRequestFix, onFileIssue, onCancel, onClose, }) {
+    const colors = useColors();
+    const { width, height } = useWindowDimensions();
+    const [body, setBody] = useState('');
+    const [name, setName] = useState(rememberedName);
+    const [email, setEmail] = useState(rememberedEmail);
+    const [includeScreenshot, setIncludeScreenshot] = useState(screenshot !== null);
+    const [annotations, setAnnotations] = useState([]);
+    const [annotating, setAnnotating] = useState(false);
+    const [status, setStatus] = useState({ kind: 'editing' });
+    const pr = branch?.match(/^pr-(\d+)$/)?.[1];
+    const sending = status.kind === 'sending';
+    const canSend = (failedStep !== null || body.trim() !== '') && !sending;
+    const withShot = includeScreenshot && screenshot !== null;
+    const idea = kind === 'idea' && failedStep === null;
+    async function sendIdea() {
+        rememberedName = name.trim();
+        rememberedEmail = email.trim();
+        setStatus({ kind: 'sending' });
+        const result = await onSendIdea({
+            body: body.trim(),
+            ...(name.trim() ? { authorName: name.trim() } : {}),
+            ...(email.trim() ? { authorEmail: email.trim() } : {}),
+            ...(withShot && screenshot ? { screenshot } : {}),
+        });
+        if (!result.ok) {
+            haptics.warning();
+            setStatus({ kind: 'error', message: result.message });
+            return;
+        }
+        haptics.success();
+        Keyboard.dismiss();
+        setStatus({ kind: 'idea_sent', idea: result.idea, emailed: email.trim() !== '' });
+    }
+    async function sendStaff() {
+        rememberedName = name.trim();
+        setStatus({ kind: 'sending' });
+        const result = await onSendStaff({
+            body: body.trim(),
+            ...(name.trim() ? { reporterName: name.trim() } : {}),
+            ...(withShot && screenshot ? { screenshot, annotations } : {}),
+        });
+        if (!result.ok) {
+            haptics.warning();
+            setStatus({ kind: 'error', message: result.message });
+            return;
+        }
+        haptics.success();
+        Keyboard.dismiss();
+        setStatus({ kind: 'filed', issueNumber: result.issueNumber, issueUrl: result.issueUrl });
+    }
+    async function send() {
+        if (idea)
+            return sendIdea();
+        if (staff)
+            return sendStaff();
+        rememberedName = name.trim();
+        setStatus({ kind: 'sending' });
+        const result = await onSend({
+            body: body.trim(),
+            ...(name.trim() ? { reporterName: name.trim() } : {}),
+            ...(withShot && screenshot ? { screenshot, annotations } : {}),
+        });
+        if (!result.ok) {
+            haptics.warning();
+            setStatus({ kind: 'error', message: result.message });
+            return;
+        }
+        haptics.success();
+        Keyboard.dismiss();
+        setStatus({
+            kind: 'sent',
+            commentUrl: result.commentUrl,
+            withScreenshot: withShot,
+            ...(result.findingId ? { findingId: result.findingId } : {}),
+            triage: {
+                cause: result.cause ?? 'unknown',
+                causeSource: result.causeSource ?? 'guess',
+                reasons: result.reasons ?? [],
+                ...(result.issueUrl ? { issueUrl: result.issueUrl } : {}),
+            },
+        });
+    }
+    const attached = [
+        withShot ? 'this screenshot' : null,
+        route === '/' ? 'the home screen' : `the screen (${route})`,
+        hasScenario ? 'the scenario’s setup' : null,
+        device,
+        'recent logs',
+    ].filter(Boolean);
+    const attachedText = `Attached: ${attached.slice(0, -1).join(', ')} and ${attached.at(-1)}.`;
+    return (_jsxs(_Fragment, { children: [_jsx(Sheet, { onClose: status.kind === 'sent' || status.kind === 'idea_sent' || status.kind === 'filed'
+                    ? onClose
+                    : onCancel, scrim: status.kind === 'sent' || status.kind === 'idea_sent' || status.kind === 'filed', children: status.kind === 'filed' ? (_jsx(Filed, { issueNumber: status.issueNumber, issueUrl: status.issueUrl, onClose: onClose })) : status.kind === 'idea_sent' ? (_jsx(IdeaSent, { emailed: status.emailed, onView: () => onViewIdea(status.idea), onClose: onClose })) : status.kind === 'sent' ? (_jsx(Sent, { pr: pr, commentUrl: status.commentUrl, triage: status.triage, withScreenshot: status.withScreenshot, onSetCause: status.findingId
+                        ? (cause) => onSetCause(status.findingId, cause)
+                        : undefined, onRequestFix: status.findingId ? () => onRequestFix(status.findingId) : undefined, onFileIssue: status.findingId ? () => onFileIssue(status.findingId) : undefined, onClose: onClose })) : (_jsxs(_Fragment, { children: [_jsx(SheetHeader, { title: failedStep ? 'Step Failed' : idea ? 'Share an Idea' : 'Report an Issue', subtitle: staff ?? (pr ? `PR #${pr}` : undefined), left: _jsx(CircleButton, { icon: "xmark", label: "Cancel", onPress: onCancel, disabled: sending }), right: _jsx(CircleButton, { icon: "arrow.up", label: idea ? 'Send idea to Claude' : staff ? 'File as a GitHub issue' : 'Send to PR', tint: true, onPress: send, disabled: !canSend, busy: sending }) }), _jsxs(ScrollView, { keyboardShouldPersistTaps: "handled", style: styles.sheetScroll, contentContainerStyle: styles.form, children: [failedStep ? null : (_jsx(Segmented, { label: "What you're sending", value: kind, onChange: onKindChange, options: [
+                                        { value: 'issue', title: 'Something’s Wrong' },
+                                        { value: 'idea', title: 'Idea' },
+                                    ] })), failedStep ? (_jsxs(View, { style: styles.quote, children: [_jsx(View, { style: [styles.quoteMark, { backgroundColor: colors.fail }], children: _jsx(Icon, { name: "xmark", size: 10, color: "#FFFFFF", weight: "bold" }) }), _jsxs(View, { style: styles.quoteText, children: [_jsx(Text, { style: [text.subhead, styles.strong, { color: colors.label }], children: failedStep.action }), _jsxs(Text, { style: [text.footnote, { color: colors.secondary }], children: ["Expected: ", failedStep.expect] })] })] })) : null, _jsx(TextInput, { value: body, onChangeText: setBody, placeholder: failedStep
+                                        ? 'What happened instead? (optional)'
+                                        : idea
+                                            ? 'What should the app do? Say what you’d change, and where.'
+                                            : 'What’s wrong? What did you expect?', placeholderTextColor: colors.secondary, multiline: true, autoFocus: true, style: [
+                                        text.body,
+                                        styles.note,
+                                        { color: colors.label, backgroundColor: colors.fill },
+                                    ], accessibilityLabel: idea ? 'Your idea' : "What's wrong" }), status.kind === 'error' ? (_jsx(Text, { style: [text.footnote, styles.inset, { color: colors.fail }], accessibilityRole: "alert", children: status.message })) : null, _jsxs(View, { style: styles.attach, children: [screenshot ? (_jsxs(Pressable, { onPress: () => setIncludeScreenshot((on) => !on), accessibilityRole: "switch", accessibilityLabel: "Include screenshot", accessibilityState: { checked: includeScreenshot }, style: [
+                                                styles.thumb,
+                                                {
+                                                    height: Math.round((THUMB_WIDTH * height) / Math.max(width, 1)),
+                                                    borderColor: colors.separator,
+                                                },
+                                                !includeScreenshot && styles.thumbOff,
+                                            ], children: [_jsx(Image, { source: { uri: `data:${screenshot.contentType};base64,${screenshot.base64}` }, style: StyleSheet.absoluteFill, resizeMode: "cover", accessibilityLabel: "Screenshot of the current screen" }), _jsx(View, { style: styles.thumbX, children: _jsx(Icon, { name: includeScreenshot ? 'xmark' : 'arrow.clockwise', size: 8, color: "#FFFFFF", weight: "bold" }) })] })) : null, _jsxs(View, { style: styles.attachMeta, children: [withShot && !idea ? (_jsx(Pressable, { onPress: () => setAnnotating(true), accessibilityRole: "button", style: ({ pressed }) => [
+                                                        styles.pill,
+                                                        { backgroundColor: colors.tintFill },
+                                                        pressed && styles.pressed,
+                                                    ], children: _jsx(Text, { style: [text.subhead, styles.strong, { color: colors.tint }], children: annotations.length ? `Mark Up (${annotations.length})` : 'Mark Up' }) })) : null, _jsx(Text, { style: [text.footnote, { color: colors.secondary }], children: attachedText })] })] }), _jsx(View, { style: styles.inset, children: _jsx(ReviewerName, { name: name, onChange: setName, colors: colors }) }), idea ? (_jsxs(_Fragment, { children: [_jsx(TextInput, { value: email, onChangeText: setEmail, placeholder: "Email for updates (optional)", placeholderTextColor: colors.secondary, keyboardType: "email-address", autoCapitalize: "none", autoCorrect: false, style: [
+                                                text.subhead,
+                                                styles.email,
+                                                { color: colors.label, backgroundColor: colors.fill },
+                                            ], accessibilityLabel: "Email for updates" }), _jsx(Text, { style: [text.footnote, styles.inset, { color: colors.secondary }], children: "Claude reads the code and writes this up as a GitHub issue, asking you first if it needs to. Then anyone on the team can tap Build It, and you get a build to test." })] })) : staff ? (_jsx(Text, { style: [text.footnote, styles.inset, { color: colors.secondary }], children: "Sending opens a GitHub issue with what you wrote, the screenshot, this screen, the app\u2019s version and recent errors." })) : (_jsxs(Text, { style: [text.footnote, styles.inset, { color: colors.secondary }], children: ["Sending posts this as a comment on ", pr ? `PR #${pr}` : 'the PR', ". If it was already broken before this PR, you can file it as a GitHub issue next."] }))] })] })) }), annotating && screenshot ? (_jsx(Annotator, { screenshot: screenshot, initial: annotations, onDone: (boxes) => {
+                    setAnnotations(boxes);
+                    setAnnotating(false);
+                }, onCancel: () => setAnnotating(false) })) : null] }));
+}
+const THUMB_WIDTH = 55;
+/** Two choices in one capsule; neither is picked until the cause is known. */
+function Segmented({ options, value, onChange, label, }) {
+    const colors = useColors();
+    return (_jsx(View, { style: [styles.segments, { backgroundColor: colors.fill }], accessibilityRole: "radiogroup", accessibilityLabel: label, children: options.map((option) => {
+            const on = option.value === value;
+            return (_jsx(Pressable, { onPress: () => {
+                    if (on)
+                        return;
+                    haptics.selection();
+                    onChange(option.value);
+                }, accessibilityRole: "radio", accessibilityState: { checked: on }, style: [styles.segment, on && [styles.segmentOn, { backgroundColor: colors.segment }]], children: _jsx(Text, { style: [
+                        text.footnote,
+                        styles.segmentText,
+                        on && styles.strong,
+                        { color: colors.label },
+                    ], numberOfLines: 1, children: option.title }) }, option.value));
+        }) }));
+}
+/** What filing an issue did, said plainly: where it went and whether Claude is on it. */
+function issueStatus(number, fix) {
+    const filed = `Created issue #${number}, linked from the PR.`;
+    if (fix === 'started')
+        return `${filed} It has the tapthrough:fix label, so Claude is starting a fix in its own PR.`;
+    if (fix === 'not_set_up')
+        return `${filed} Claude can’t fix it yet: Fix with Claude isn’t set up on this repo. The issue says what a developer needs to do.`;
+    if (fix === 'refused')
+        return `${filed} Claude didn’t start. The issue says why.`;
+    if (fix === 'off')
+        return `${filed} A developer can add the tapthrough:fix label to have Claude fix it.`;
+    return `${filed}`;
+}
+/** After a staff build's report: the issue it became. */
+function Filed({ issueNumber, issueUrl, onClose, }) {
+    const colors = useColors();
+    return (_jsxs(_Fragment, { children: [_jsx(SheetHeader, { title: "Filed", left: _jsx(CircleButton, { icon: "xmark", label: "Done", onPress: onClose }) }), _jsxs(View, { style: [styles.form, styles.ideaSent], children: [_jsx(View, { style: [styles.ideaMark, { backgroundColor: colors.tintFill }], children: _jsx(Icon, { name: "checkmark", size: 22, color: colors.tint }) }), _jsxs(Text, { style: [text.subhead, styles.center, { color: colors.label }], children: ["Created issue #", issueNumber, " with your screenshot and details. The team sees it on GitHub."] }), _jsx(Capsule, { title: "View on GitHub", kind: "plain", onPress: () => Linking.openURL(issueUrl) }), _jsx(Capsule, { title: "Done", onPress: onClose })] })] }));
+}
+/** After an idea is sent: what happens next, and where to follow it. */
+function IdeaSent({ emailed, onView, onClose, }) {
+    const colors = useColors();
+    return (_jsxs(_Fragment, { children: [_jsx(SheetHeader, { title: "Sent to Claude", left: _jsx(CircleButton, { icon: "xmark", label: "Done", onPress: onClose }) }), _jsxs(View, { style: [styles.form, styles.ideaSent], children: [_jsx(View, { style: [styles.ideaMark, { backgroundColor: colors.tintFill }], children: _jsx(Icon, { name: "lightbulb", size: 22, color: colors.tint }) }), _jsxs(Text, { style: [text.subhead, styles.center, { color: colors.label }], children: ["Claude is reading the code and writing your idea up. If it has questions, they show up under Ideas in the Review panel", emailed ? ', and in your email' : '', "."] }), _jsx(Capsule, { title: "View Idea", onPress: onView }), _jsx(Capsule, { title: "Done", kind: "plain", onPress: onClose })] })] }));
+}
+/**
+ * After a report is sent: whether it looks like the PR's bug, and the one tap
+ * that follows. A bug the PR didn't cause can be filed as a GitHub issue from here.
+ */
+function Sent({ pr, commentUrl, triage, withScreenshot, onSetCause, onRequestFix, onFileIssue, onClose, }) {
+    const colors = useColors();
+    const [cause, setCause] = useState(triage.cause);
+    const [fix, setFix] = useState('idle');
+    const [byReporter, setByReporter] = useState(triage.causeSource === 'reporter');
+    const [error, setError] = useState(null);
+    const [issue, setIssue] = useState({ state: 'idle' });
+    async function createIssue() {
+        if (!onFileIssue) {
+            if (triage.issueUrl)
+                Linking.openURL(triage.issueUrl);
+            return;
+        }
+        setIssue({ state: 'filing' });
+        setError(null);
+        const result = await onFileIssue();
+        if (result.ok) {
+            haptics.success();
+            setIssue({
+                state: 'filed',
+                number: result.issueNumber,
+                url: result.issueUrl,
+                fix: result.fix,
+            });
+            return;
+        }
+        setIssue({ state: 'idle' });
+        // Tapthrough can't file it here (old server, or no Issues permission yet): GitHub's own form still works.
+        if (result.openInBrowser && triage.issueUrl) {
+            Linking.openURL(triage.issueUrl);
+            return;
+        }
+        setError(result.message);
+    }
+    async function askFix() {
+        if (!onRequestFix)
+            return;
+        setFix('asking');
+        setError(null);
+        const result = await onRequestFix();
+        if (result.ok) {
+            setFix(result.status);
+        }
+        else {
+            setFix('idle');
+            setError(result.message);
+        }
+    }
+    async function choose(next) {
+        if (!onSetCause)
+            return;
+        const previous = cause;
+        setCause(next);
+        setByReporter(true);
+        setError(null);
+        const result = await onSetCause(next);
+        if (!result.ok) {
+            setCause(previous);
+            setError(result.message);
+        }
+    }
+    const where = pr ? `PR #${pr}` : 'the PR';
+    const guess = cause !== 'unknown' && !byReporter && triage.reasons.length > 0
+        ? `Tapthrough’s guess: ${triage.reasons.join(' ')}`
+        : null;
+    const autoFix = triage.issueFix === 'auto';
+    const why = cause === 'unknown'
+        ? 'Did this PR cause it, or was it already broken?'
+        : cause === 'pr'
+            ? `It stays on ${where} as a comment for the author to fix. Claude can fix it on this PR’s branch.`
+            : autoFix
+                ? `It stays on ${where} as a note and won’t block the merge. A GitHub issue tracks it on its own, and Claude starts a fix for it in a separate PR.`
+                : `It stays on ${where} as a note and won’t block the merge. A GitHub issue tracks it on its own. A developer can add the tapthrough:fix label to have Claude fix it in a separate PR.`;
+    return (_jsxs(_Fragment, { children: [_jsx(SheetHeader, { right: _jsx(CircleButton, { icon: "checkmark", label: "Done", onPress: onClose }) }), _jsxs(View, { style: styles.sent, children: [_jsx(View, { style: [styles.bigMark, { backgroundColor: colors.pass }], children: _jsx(Icon, { name: "checkmark", size: 28, color: "#FFFFFF", weight: "bold" }) }), _jsxs(Text, { style: [text.title2, styles.center, { color: colors.label }], children: ["Sent to ", pr ? `PR #${pr}` : 'the PR'] }), _jsx(Text, { style: [text.subhead, styles.center, { color: colors.secondary }], children: withScreenshot ? 'Posted to the PR with your screenshot.' : 'Posted to the PR.' })] }), onSetCause ? (_jsx(Segmented, { label: "Cause", value: cause === 'unknown' ? null : cause, onChange: choose, options: [
+                    { value: 'pr', title: 'Caused by this PR' },
+                    { value: 'unrelated', title: 'Already broken' },
+                ] })) : null, _jsx(Text, { style: [text.footnote, styles.center, styles.why, { color: colors.secondary }], children: why }), guess ? (_jsx(Text, { style: [text.caption, styles.center, styles.why, { color: colors.tertiary }], children: guess })) : null, _jsxs(View, { style: styles.next, children: [cause === 'pr' && onRequestFix ? (fix === 'idle' ? (_jsx(Capsule, { title: "Ask Claude to Fix", onPress: askFix })) : (_jsxs(View, { style: [styles.status, { backgroundColor: colors.fill }], children: [fix === 'asking' ? _jsx(ActivityIndicator, { size: "small" }) : null, _jsx(Text, { style: [text.footnote, styles.statusText, { color: colors.label }], children: fix === 'asking'
+                                    ? 'Asking Claude…'
+                                    : fix === 'requested'
+                                        ? 'Claude is on it. When the fix builds, the Review button shows a dot.'
+                                        : 'Fix with Claude isn’t set up on this repo yet. The PR comment has the two setup steps for a developer.' })] }))) : null, cause === 'unrelated' && (onFileIssue || triage.issueUrl) ? (issue.state === 'filed' ? (_jsxs(_Fragment, { children: [_jsx(View, { style: [styles.status, { backgroundColor: colors.fill }], children: _jsx(Text, { style: [text.footnote, styles.statusText, { color: colors.label }], children: issueStatus(issue.number, issue.fix) }) }), _jsx(Capsule, { kind: "plain", title: `View Issue #${issue.number}`, onPress: () => Linking.openURL(issue.url) })] })) : (_jsx(Capsule, { title: autoFix ? 'Create Issue for Claude' : 'Create GitHub Issue', onPress: createIssue, busy: issue.state === 'filing' }))) : null, error ? (_jsx(Text, { style: [text.footnote, styles.center, { color: colors.fail }], accessibilityRole: "alert", children: error })) : null, _jsx(Capsule, { kind: "plain", title: "View on GitHub", onPress: () => Linking.openURL(commentUrl) })] })] }));
+}
+const styles = StyleSheet.create({
+    pressed: { opacity: 0.7 },
+    strong: { fontWeight: '600' },
+    center: { textAlign: 'center' },
+    inset: { paddingHorizontal: 8 },
+    backdrop: { justifyContent: 'flex-end' },
+    scrim: { backgroundColor: 'rgba(0, 0, 0, 0.14)' },
+    flash: { backgroundColor: '#FFFFFF' },
+    sheet: { marginHorizontal: 8, marginBottom: 8, flexShrink: 1 },
+    sheetSurface: { flexShrink: 1, padding: 8, overflow: 'hidden' },
+    sheetHeader: { flexDirection: 'row', alignItems: 'center', gap: 8, paddingBottom: 4 },
+    sheetSide: { width: 44 },
+    sheetSideRight: { alignItems: 'flex-end' },
+    sheetTitle: { flex: 1, minWidth: 0 },
+    sheetScroll: { flexGrow: 0, flexShrink: 1 },
+    form: { paddingHorizontal: 8, paddingTop: 6, paddingBottom: 12, gap: 14 },
+    quote: { flexDirection: 'row', gap: 12, alignItems: 'flex-start', paddingHorizontal: 8 },
+    quoteMark: {
+        width: 22,
+        height: 22,
+        borderRadius: 11,
+        marginTop: 1,
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    quoteText: { flex: 1, gap: 2 },
+    note: {
+        minHeight: 104,
+        borderRadius: 20,
+        paddingHorizontal: 14,
+        paddingTop: 12,
+        paddingBottom: 12,
+        textAlignVertical: 'top',
+    },
+    email: { borderRadius: 14, paddingHorizontal: 12, paddingVertical: 10, marginHorizontal: 8 },
+    ideaSent: { alignItems: 'stretch', gap: 12, paddingTop: 8 },
+    ideaMark: {
+        width: 48,
+        height: 48,
+        borderRadius: 24,
+        alignItems: 'center',
+        justifyContent: 'center',
+        alignSelf: 'center',
+    },
+    attach: { flexDirection: 'row', gap: 14, alignItems: 'flex-start', paddingHorizontal: 8 },
+    thumb: {
+        width: THUMB_WIDTH,
+        borderRadius: 9,
+        overflow: 'hidden',
+        borderWidth: StyleSheet.hairlineWidth,
+    },
+    thumbOff: { opacity: 0.3 },
+    thumbX: {
+        position: 'absolute',
+        top: 4,
+        right: 4,
+        width: 18,
+        height: 18,
+        borderRadius: 9,
+        backgroundColor: 'rgba(0, 0, 0, 0.55)',
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    attachMeta: { flex: 1, gap: 8, alignItems: 'flex-start' },
+    pill: { paddingVertical: 7, paddingHorizontal: 16, borderRadius: 999 },
+    sent: { alignItems: 'center', gap: 6, paddingHorizontal: 20 },
+    bigMark: {
+        width: 64,
+        height: 64,
+        borderRadius: 32,
+        alignItems: 'center',
+        justifyContent: 'center',
+        marginBottom: 8,
+    },
+    segments: {
+        flexDirection: 'row',
+        marginTop: 20,
+        marginHorizontal: 12,
+        padding: 3,
+        borderRadius: 999,
+    },
+    segment: { flex: 1, paddingVertical: 8, borderRadius: 999, alignItems: 'center' },
+    segmentOn: {
+        shadowColor: '#000000',
+        shadowOpacity: 0.12,
+        shadowRadius: 8,
+        shadowOffset: { width: 0, height: 3 },
+        elevation: 2,
+    },
+    segmentText: { fontSize: 14 },
+    why: { paddingHorizontal: 24, paddingTop: 10 },
+    next: { paddingHorizontal: 12, paddingTop: 16, paddingBottom: 10, gap: 6 },
+    status: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        gap: 10,
+        paddingVertical: 14,
+        paddingHorizontal: 16,
+        borderRadius: 22,
+    },
+    statusText: { flex: 1 },
+    toastWrap: {
+        position: 'absolute',
+        top: Platform.OS === 'ios' ? 58 : 28,
+        left: 0,
+        right: 0,
+        alignItems: 'center',
+    },
+    toast: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        gap: 8,
+        paddingVertical: 12,
+        paddingHorizontal: 18,
+    },
+    toastDot: { width: 8, height: 8, borderRadius: 4 },
+});
+//# sourceMappingURL=Feedback.js.map