@oxyhq/services 22.12.4 → 22.12.7

package/lib/commonjs/ui/components/OxyAuthChooser.js

@@ -6,17 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = require("react");
 var _reactNative = require("react-native");
-var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
-var _vectorIcons = require("@expo/vector-icons");
-var _reactNativeQrcodeSvg = _interopRequireDefault(require("react-native-qrcode-svg"));
-var _avatar = require("@oxyhq/bloom/avatar");
-var _avatarGroup = require("@oxyhq/bloom/avatar-group");
-var _button = require("@oxyhq/bloom/button");
-var _pressableScale = require("@oxyhq/bloom/pressable-scale");
-var _compositionBar = require("@oxyhq/bloom/composition-bar");
-var _settingsList = require("@oxyhq/bloom/settings-list");
 var _bloom = require("@oxyhq/bloom");
-var _typography = require("@oxyhq/bloom/typography");
 var _theme = require("@oxyhq/bloom/theme");
 var _core = require("@oxyhq/core");
 var _reactQuery = require("@tanstack/react-query");
@@ -26,11 +16,12 @@ var _accountDialogManager = require("../navigation/accountDialogManager.js");
 var _isWebBrowser = require("../utils/isWebBrowser.js");
 var _commonsStoreLinks = require("../utils/commonsStoreLinks.js");
 var _useServicesQueries = require("../hooks/queries/useServicesQueries.js");
-var _oxyAuthChooserStyles = require("./oxyAuthChooserStyles.js");
-var _AvatarCameraBadge = _interopRequireDefault(require("./AvatarCameraBadge.js"));
+var _AccountsMenuView = _interopRequireDefault(require("./authChooser/AccountsMenuView.js"));
+var _SignInEntryView = _interopRequireDefault(require("./authChooser/SignInEntryView.js"));
+var _SignInRequestView = _interopRequireDefault(require("./authChooser/SignInRequestView.js"));
+var _SignUpView = _interopRequireDefault(require("./authChooser/SignUpView.js"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 /**
  * OxyAuthChooser — the account switcher + sign-in/sign-up surface, WITHOUT
  * any dialog chrome.
@@ -43,35 +34,22 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
  * cross-origin passkey popup (b2) — same chooser, two hosts, two completion
  * strategies via the `onComplete` prop. Neither host duplicates view logic.
  *
- * Views (from `snapshot.view`):
- *  - `accounts` — the unified `SwitchableAccount[]` list. Tapping a row
- *    switches through `controller.switchTo(accountId)`, the active row is
- *    flagged, and a "+ Add account" row opens the sign-in entry.
- *  - `add` / `signin` — the sign-in entry. On WEB this auto-starts "Sign in
- *    with Oxy" (native shared-keychain silently, else the QR handoff) the
- *    instant the view is entered — the QR is the PRIMARY web surface, not a
- *    button behind a click. On NATIVE it stays button-driven (unchanged):
- *    primary "Sign in with Oxy", secondary "Scan a QR from another device".
- *    Both platforms get a footer entry into `signup`.
- *  - `signup` — account creation. Commons is ALWAYS the priority path (owner
- *    mandate) and leads everywhere it appears: native shows only "Create your
- *    identity in Commons" (or "Get Commons" first, if not installed); web on
- *    a first-party Oxy origin leads with the SAME "Get Commons" CTA, with
- *    inline passkey creation (username + `registerWithPasskey`) offered
- *    UNDERNEATH as the de-emphasized "don't want to install anything"
- *    alternative — never co-equal, never a competing button. Anywhere else (a
- *    non-Oxy web origin, before the b2 hub-relay ships) shows an honest "not
- *    available here yet" message instead of a broken button.
- *  - `qr` — the cross-device Commons handoff, and the PRIMARY web sign-in
- *    surface. On a first-party Oxy origin this ALSO carries a "No Commons?"
- *    passkey link — identity is ONE thing (Commons key or browser passkey,
- *    same Oxy ID), so there is no separate "sign in with a passkey" button
- *    anywhere in this file, but passkey is explicitly the LIGHTWEIGHT
- *    ALTERNATIVE for someone who doesn't want to install Commons, never
- *    co-equal: same small-text-link subordination, same framing, wherever it
- *    appears. Native additionally branches on `commonsAvailability`: when
- *    Commons isn't installed, this leads with a "Get Commons" CTA instead of
- *    a same-device dead-end QR.
+ * This file owns WIRING only: the controller binding, the action handlers, and
+ * which view module renders. Every view lives in `./authChooser/`, one
+ * responsibility each:
+ *
+ *  - `accounts` → `AccountsMenuView` — the signed-in Oxy account menu.
+ *  - `add` / `signin` → `SignInEntryView` — ONE primary action, "Continue with
+ *    Oxy" (issue #691, Phase 5). On WEB this view is transient: the flow
+ *    auto-starts the instant the view is reached, because the request surface
+ *    (a QR on an unknown desktop, "Check Commons on your phone" where Oxy could
+ *    deliver) IS the primary route there, never something behind a second tap.
+ *  - `qr` → `SignInRequestView` — the ACTIVE REQUEST: the controller-bound
+ *    wiring over the shared, presentational `OxySignInRequestSurface` (the same
+ *    component the auth.oxy.so IdP mounts from its OAuth-bound request). It maps
+ *    `snapshot.signIn` onto that surface's props; alternatives stay behind
+ *    "Having trouble?" until the chosen route reports `routeFailed`.
+ *  - `signup` → `SignUpView` — account creation, Commons-first.
  *
  * Per-account color re-theming uses Bloom's `APP_COLOR_PRESETS` + `BloomColorScope`
  * (same visual language auth.oxy.so uses). Base theming is `useTheme()` + a
@@ -79,11 +57,6 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
  * that do not use NativeWind (e.g. the accounts app).
  */
 
-/** Diameter of a row avatar (the sign-in view's account rows). */const ROW_AVATAR_SIZE = 40;
-/** High-contrast QR colors — intentionally fixed (NOT themed) for scan reliability. */
-const QR_PLATE_BG = '#FFFFFF';
-const QR_FOREGROUND = '#000000';
-const QR_SIZE = 196;
 /** Commons' own identity-creation deep link (mirrors the `approve`/`attest`/`card` intents). */
 const COMMONS_CREATE_IDENTITY_URL = 'oxycommons://create-identity';
 /**
@@ -93,22 +66,6 @@ const COMMONS_CREATE_IDENTITY_URL = 'oxycommons://create-identity';
  * hands off to Commons; nothing here invents new API endpoints.
  */
 const ACCOUNTS_APP_URL = 'https://accounts.oxy.so';
-/**
- * Resolve an account's stored color (a named Bloom preset, e.g. `'purple'`) to
- * a concrete brand hex for the row accent. Falls back to the theme primary when
- * the account has no color or the value is not a recognized preset, so the accent
- * renders in EVERY consumer regardless of NativeWind availability.
- */
-function resolveAccentHex(color, fallback) {
-  const preset = toPreset(color);
-  return preset ? _theme.APP_COLOR_PRESETS[preset].hex : fallback;
-}
-
-/** Narrow a stored color string to a known `AppColorName`, or `undefined`. */
-function toPreset(color) {
-  if (!color) return undefined;
-  return _theme.APP_COLOR_NAMES.includes(color) ? color : undefined;
-}
 /**
  * The account switcher + sign-in/sign-up chooser. Mounted by `OxyAccountDialogScreen`
  * (wrapped in Bloom's `<Dialog>`) today; mountable bare by any future host that
@@ -146,7 +103,6 @@ const OxyAuthChooser = ({
     if (!(0, _isWebBrowser.isWebBrowser)()) return 'none';
     return (0, _core.isOxyRpOrigin)() ? 'direct' : 'hub';
   }, []);
-  const passkeyAvailable = passkeyMode !== 'none';
   const [signInPasskeyPending, setSignInPasskeyPending] = (0, _react.useState)(false);
   const handleSignInWithPasskey = (0, _react.useCallback)(async () => {
     if (signInPasskeyPending) return;
@@ -158,7 +114,7 @@ const OxyAuthChooser = ({
       // A cancelled/failed ceremony keeps the view open so the user can retry
       // or fall back to the QR — surface the reason as a toast (owner mandate:
       // errors never render inline inside the dialog), never swallow.
-      _bloom.toast.error(error instanceof Error && error.message ? error.message : t('accountSwitcher.toasts.passkeySignInFailed') || 'Passkey sign-in failed.');
+      _bloom.toast.error(error instanceof Error && error.message ? error.message : t('accountSwitcher.toasts.passkeySignInFailed'));
     } finally {
       setSignInPasskeyPending(false);
     }
@@ -173,20 +129,21 @@ const OxyAuthChooser = ({
       });
       onComplete?.();
     } catch (error) {
-      _bloom.toast.error(error instanceof Error && error.message ? error.message : t('signup.toasts.passkeyCreateFailed') || 'Account creation failed.');
+      _bloom.toast.error(error instanceof Error && error.message ? error.message : t('signup.toasts.passkeyCreateFailed'));
     } finally {
       setCreatePasskeyPending(false);
     }
   }, [createPasskeyPending, registerWithPasskey, onComplete, t]);
 
   // Web: auto-start "Sign in with Oxy" when the sign-in entry becomes the shown
-  // view — the QR handoff is the PRIMARY web surface, not a button behind a tap.
+  // view — the request surface is the PRIMARY web route, not something behind a
+  // second tap (the user's ONE action was the sign-in button that opened this).
   // `signInWithOxy()` tries the shared keychain first (silently, native-only)
-  // then falls to the QR handoff, which is what actually renders. Driven from the
-  // EVENTS that reach that view — the initial `subscribe` pass below (an
+  // then falls to the device flow, whose route the controller picks. Driven from
+  // the EVENTS that reach that view — the initial `subscribe` pass below (an
   // open-to-sign-in) and the add / back-to-sign-in handlers — never a watcher
-  // effect. Guarded so it never restarts a live flow (phase must be idle) and is a
-  // no-op on native (button-driven). Reads the live snapshot at call time (an
+  // effect. Guarded so it never restarts a live flow (phase must be idle) and is
+  // a no-op on native (button-driven). Reads the live snapshot at call time (an
   // event callback, not render), so it is stable across renders.
   const autoStartSignIn = (0, _react.useCallback)(() => {
     if (!controller || !(0, _isWebBrowser.isWebBrowser)()) return;
@@ -207,8 +164,8 @@ const OxyAuthChooser = ({
   // callbacks, not render/effect — so neither is a React effect hook:
   //  1. Sign-in device-flow failures (poll / socket / popup-cancel land on
   //     `signIn` asynchronously) are toasted at the notification site, deduped
-  //     per subscription — NEVER an inline banner in the QR view (owner mandate,
-  //     same contract as account-switch).
+  //     per subscription — NEVER an inline banner in the request view (owner
+  //     mandate, same contract as account-switch).
   //  2. On subscribe (mount / re-subscribe — a passive effect, the SAME timing
   //     the removed effects had) the web sign-in flow auto-starts if the opening
   //     view is the sign-in entry.
@@ -256,7 +213,7 @@ const OxyAuthChooser = ({
       // re-fetches — the same side effects the context's own
       // `switchToAccount` performs.
       if (controller.getSnapshot().error) {
-        _bloom.toast.error(t('accountSwitcher.toasts.switchFailed') || 'There was a problem switching accounts. Please try again.');
+        _bloom.toast.error(t('accountSwitcher.toasts.switchFailed'));
         return;
       }
       void refreshAccounts();
@@ -297,9 +254,31 @@ const OxyAuthChooser = ({
     onEditAvatar: () => openAvatarPicker()
   }), [handleSwitch, handleAdd, handleManage, openAvatarPicker]);
 
+  // Everything that is NOT the surface's one primary action. Wired once here;
+  // each view picks the subset that is a genuine alternative to ITS primary
+  // surface and hides them behind "Having trouble?" (issue #691).
+  const alternatives = (0, _react.useMemo)(() => ({
+    passkeyAvailable: passkeyMode !== 'none',
+    // The hub-popup flow reports progress through `snapshot.signIn` (already
+    // rendered by the request view) — only the DIRECT ceremony uses this
+    // component-local pending flag. A ceremony FAILURE is toasted by
+    // `handleSignInWithPasskey`, never rendered inline.
+    passkeyPending: passkeyMode === 'direct' ? signInPasskeyPending : false,
+    onSignInWithPasskey: () => {
+      if (passkeyMode === 'direct') {
+        void handleSignInWithPasskey();
+        return;
+      }
+      void controller?.startPasskeyHubSignIn();
+    },
+    onShowQr: () => void controller?.showQr(),
+    onGetCommons: () => void _reactNative.Linking.openURL((0, _commonsStoreLinks.getCommonsAcquisitionUrl)(_reactNative.Platform.OS)),
+    onCreateAccount: () => controller?.startSignup()
+  }), [passkeyMode, signInPasskeyPending, handleSignInWithPasskey, controller]);
+
   // Real storage usage for the account menu's "Oxy storage" block. Disabled
   // (no fetch) until a private-API session exists, so it is inert on the
-  // sign-in/QR/sign-up views; when present the block shows live used/total.
+  // sign-in/request/sign-up views; when present the block shows live used/total.
   const storageQuery = (0, _useServicesQueries.useAccountStorageUsage)();
   const storage = (0, _react.useMemo)(() => storageQuery.data ? {
     usedBytes: storageQuery.data.totalUsedBytes,
@@ -347,7 +326,7 @@ const OxyAuthChooser = ({
     return null;
   }
   if (view === 'accounts') {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(AccountsView, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_AccountsMenuView.default, {
       snapshot: snapshot,
       theme: theme,
       t: t,
@@ -357,1073 +336,38 @@ const OxyAuthChooser = ({
     });
   }
   if (view === 'qr') {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(QrView, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SignInRequestView.default, {
       snapshot: snapshot,
-      theme: theme,
       t: t,
       onRetry: () => void controller.showQr(),
-      passkeyAvailable: passkeyAvailable,
-      onSignInWithPasskey: passkeyMode === 'direct' ? () => void handleSignInWithPasskey() : () => void controller.startPasskeyHubSignIn()
-      // The hub-popup flow's pending state is `snapshot.signIn` (already
-      // rendered elsewhere in this view) — only the DIRECT ceremony uses this
-      // component-local pending flag. A ceremony FAILURE is surfaced as a
-      // toast by `handleSignInWithPasskey`, never inline.
-      ,
-      passkeyPending: passkeyMode === 'direct' ? signInPasskeyPending : false,
-      onCreateAccount: () => controller.startSignup()
+      alternatives: alternatives
     });
   }
   if (view === 'signup') {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(SignUpView, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SignUpView.default, {
       snapshot: snapshot,
       theme: theme,
       t: t,
       oxyServices: oxyServices,
       passkeyMode: passkeyMode,
-      onCreateWithPasskey: handleCreateWithPasskey,
+      onCreateWithPasskey: username => void handleCreateWithPasskey(username),
       createPending: createPasskeyPending,
       onOpenHub: () => void controller.startPasskeyHubSignIn(),
+      onCreateIdentityInCommons: () => void _reactNative.Linking.openURL(COMMONS_CREATE_IDENTITY_URL),
+      onGetCommons: alternatives.onGetCommons,
       onBackToSignIn: () => {
         controller.setView('signin');
         autoStartSignIn();
       }
     });
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(SignInView, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SignInEntryView.default, {
     snapshot: snapshot,
     theme: theme,
     t: t,
     handlers: handlers,
-    onSignInWithOxy: () => void controller.signInWithOxy(),
-    onScanQr: () => void controller.showQr(),
-    onCreateAccount: () => controller.startSignup()
-  });
-};
-
-// ---------------------------------------------------------------------------
-// Accounts view — the signed-in Oxy account MENU (NativeWind)
-// ---------------------------------------------------------------------------
-
-/** Used/total storage bytes for the "Oxy storage" block, or `null` when unknown. */
-
-/** The account-menu row actions the container wires (deep-links / sheets / sign-out). */
-
-/**
- * Leading glyph for the rows that live in a Bloom grouped section (the MENU
- * block) and for the storage card's cloud, which lines its title up with them.
- * It is Bloom's OWN icon-slot size: `SettingsListItem` reserves a fixed 20px
- * leading column and Bloom is consumed exactly as it ships, so a menu glyph
- * larger than this would overhang into the row's title.
- */
-const ROW_ICON_SIZE = 20;
-/**
- * The switch card's two corner states. Collapsed it is one row and reads as a
- * PILL; opened it is a card holding rows, on the same 16px corner the Bloom
- * grouped section below it uses. Interpolated across the reveal, never snapped.
- */
-const SWITCH_CARD_PILL_RADIUS = 999;
-const SWITCH_CARD_RADIUS = 16;
-/**
- * The fraction of the reveal over which the corner resolves. The corner is a
- * FASTER gesture than the reveal — it has to be finished before the rows read as
- * rows, or the card still looks like a pill while a list falls out of it — so it
- * is clamped to the reveal's opening fraction instead of tracking it end to end.
- * Measured in a browser against the 240ms reveal: the corner reaches its card
- * value ~120ms in, with the list only ~20% revealed, and (mirrored) the pill is
- * back ~250ms into the close, with the list already down to ~0.
- */
-const SWITCH_CARD_RADIUS_SETTLE = 0.2;
-/** Diameter of an account row's avatar in the switch list (own markup). */
-const SWITCH_AVATAR_SIZE = 36;
-/** Glyph inside a bordered affordance badge, sized to the avatar it stands in for. */
-const BADGE_GLYPH_SIZE = 19;
-/** The hero block's large current-account avatar. */
-const HERO_AVATAR_SIZE = 72;
-
-/**
- * The hero's address line, shown under the "Hi, <name>!" greeting: the account's
- * canonical `@oxy.so` email when it has one, else its normalized `@handle`. Never
- * synthesizes a `username@oxy.so` address (the identity contract forbids it) — a
- * non-Oxy or missing email falls back to `getNormalizedUserHandle`.
- */
-function heroAddressLine(account) {
-  if (account.email?.toLowerCase().endsWith('@oxy.so')) {
-    return account.email;
-  }
-  const handle = (0, _core.getNormalizedUserHandle)(account.user);
-  return handle ? `@${handle}` : null;
-}
-/** Avatars shown in the switch row's facepile before it collapses into `+N`. */
-const FACEPILE_MAX = 2;
-/** Facepile avatar diameter — one clear step down from a switch-list avatar. */
-const FACEPILE_AVATAR_SIZE = 32;
-/**
- * Facepile overlap. Well under Bloom's `size / 3` default: the stack draws the
- * FIRST item on top, so a deep overlap would bury the trailing `+N` chip's own
- * label under the avatar before it.
- */
-const FACEPILE_OVERLAP = 4;
-
-/**
- * `bytes` → `"11.6 GB"`. Whole plan sizes read as whole numbers (`"17 GB"`, not
- * `"17.0 GB"`), and anything ≥ 100 GB drops the decimal entirely.
- */
-function formatStorageGb(bytes) {
-  const gb = bytes / 1024 ** 3;
-  if (gb >= 100 || Number.isInteger(gb)) return `${Math.round(gb)} GB`;
-  return `${gb.toFixed(1)} GB`;
-}
-/**
- * A `Pressable` that appends a hover-tint NativeWind token while pointer-hovered.
- * The Metro web pipeline here does NOT emit NativeWind `hover:` variants, so hover
- * is driven by RN's cross-platform `onHoverIn`/`onHoverOut` (they fire only on web
- * via react-native-web; a no-op on native) toggling a plain background token —
- * the tint stays a NativeWind class, only the trigger is JS.
- */
-const HoverPressable = ({
-  baseClassName,
-  hoverClassName,
-  ...rest
-}) => {
-  const [hovered, setHovered] = (0, _react.useState)(false);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
-    ...rest,
-    className: hovered ? `${baseClassName} ${hoverClassName}` : baseClassName,
-    onHoverIn: () => setHovered(true),
-    onHoverOut: () => setHovered(false)
-  });
-};
-
-/**
- * The signed-in Oxy account MENU — a Google-account-menu-style full menu built
- * entirely with NativeWind `className` (the dynamic per-account accent hex is
- * the one inline style NativeWind can't express). Structure mirrors the
- * approved demo:
- *  - ACCOUNT on its own distinct panel surface: a COMPACT current-account row
- *    (avatar + name + email + expand chevron) that toggles the switch list, a
- *    "Manage your Oxy account" pill, and — when expanded — the other switchable
- *    accounts + "Add another account" + "Manage accounts on this device".
- *  - OXY STORAGE: cloud + used/total + a progress bar + Upgrade / Manage chips.
- *  - MENU rows: Your data in Oxy · Oxy settings · Help & feedback · Sign out —
- *    Bloom's grouped section (`SettingsListGroup`/`SettingsListItem`), the same
- *    component every other SDK settings surface uses, not a local row copy.
- *  - FOOTER: Privacy Policy · Terms of Service.
- *
- * All three blocks share ONE rhythm taken from that grouped section: a 12px
- * content inset, a 12px gap after the leading element, 16px between blocks, and
- * a 16px trailing chevron column.
- *
- * Collapse state is a plain `useState` toggled in the current row's press
- * handler — no effect hook, no derived-from-props sync. With only ONE account
- * (nothing to switch to) the chevron is hidden and the list renders inline so
- * "Add another account" stays reachable without a pointless toggle.
- */
-const AccountsView = ({
-  snapshot,
-  theme,
-  t,
-  handlers,
-  storage,
-  menu
-}) => {
-  const [expanded, setExpanded] = (0, _react.useState)(false);
-  // Measured natural height of the switch list, so the reveal animates to an
-  // exact height (and the content below reflows down smoothly) instead of a
-  // guessed max. The measuring wrapper is style-based, NOT className'd — on
-  // RN-Web `onLayout` never fires for className'd Views (see AGENTS.md).
-  const [listContentHeight, setListContentHeight] = (0, _react.useState)(0);
-  // 0 = collapsed, 1 = expanded. Set imperatively in the toggle handler (no
-  // effect hook). On RN-Web there is no worklets plugin, so every shared value a
-  // mapper reads MUST be in its deps array or it freezes on the first frame
-  // (AGENTS.md "Reanimated (web)").
-  const listProgress = (0, _reactNativeReanimated.useSharedValue)(0);
-  const listStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
-    height: listProgress.value * listContentHeight,
-    opacity: listProgress.value
-  }), [listProgress, listContentHeight]);
-  const chevronStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
-    transform: [{
-      rotate: `${listProgress.value * 180}deg`
-    }]
-  }), [listProgress]);
-  // Collapsed, the switch card is a single row and reads as a PILL; opened, it
-  // becomes a card holding rows and takes the grouped-section corner. The corner
-  // is driven off the SAME `listProgress` as the reveal — but clamped to its
-  // opening fraction, so it resolves early instead of trailing the rows: the
-  // card already reads as a card by the time they are visible. Collapsing is the
-  // mirror image, the pill returning over the closing tail.
-  const switchCardStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
-    borderRadius: (0, _reactNativeReanimated.interpolate)(listProgress.value, [0, SWITCH_CARD_RADIUS_SETTLE], [SWITCH_CARD_PILL_RADIUS, SWITCH_CARD_RADIUS], _reactNativeReanimated.Extrapolation.CLAMP)
-  }), [listProgress]);
-  // `CompositionBar` ships as an interactive breakdown: a selected segment
-  // replaces its hint line with that segment's readout. Tapping the selected one
-  // again clears it.
-  const [storageSegment, setStorageSegment] = (0, _react.useState)(null);
-  const toggleStorageSegment = (0, _react.useCallback)(key => setStorageSegment(previous => previous === key ? null : key), []);
-  const toggleExpanded = (0, _react.useCallback)(() => {
-    const next = !expanded;
-    setExpanded(next);
-    listProgress.value = (0, _reactNativeReanimated.withTiming)(next ? 1 : 0, {
-      duration: 240
-    });
-  }, [expanded, listProgress]);
-  if (snapshot.loading && snapshot.accounts.length === 0) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      className: "items-center justify-center gap-space-12 py-space-24",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.MaterialCommunityIcons, {
-        name: "loading",
-        size: 24,
-        color: theme.colors.textSecondary
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-        className: "text-body text-text-secondary text-center",
-        children: t('accountSwitcher.loading')
-      })]
-    });
-  }
-  const switchingDisabled = snapshot.switchingAccountId !== null;
-  const current = snapshot.accounts.find(account => account.isCurrent) ?? snapshot.accounts[0];
-  const others = current ? snapshot.accounts.filter(account => account.accountId !== current.accountId) : snapshot.accounts;
-  const currentAccent = current ? resolveAccentHex(current.color, theme.colors.primary) : theme.colors.primary;
-  // The hero's address line under the greeting: the account's canonical @oxy.so
-  // email when it has one, else its normalized `@handle` (never a synthesized
-  // `username@oxy.so`, per the identity contract — `getNormalizedUserHandle`).
-  const currentAddress = current ? heroAddressLine(current) : null;
-  // The switch list repeats the CURRENT account (first, ringed) — unlike the old
-  // compact header it is not represented anywhere else once the hero moved out
-  // of the card, and the list is where you switch back to it.
-  const switchableAccounts = current ? [current, ...others] : others;
-  const facepile = switchableAccounts.map(account => ({
-    id: account.accountId,
-    uri: account.avatarUrl ?? undefined,
-    displayName: account.displayName
-  }));
-
-  // Used vs free is a two-part COMPOSITION (the parts always fill the bar), not
-  // a progress value — exactly what Bloom's `CompositionBar` models. Both colors
-  // are theme tokens, so the bar is correct in light and dark.
-  const storageCategories = storage ? [{
-    key: 'used',
-    name: t('accountMenu.storage.used'),
-    amount: storage.usedBytes,
-    color: theme.colors.primary
-  }, {
-    key: 'free',
-    name: t('accountMenu.storage.free'),
-    amount: Math.max(0, storage.limitBytes - storage.usedBytes),
-    color: theme.colors.contrast50
-  }] : [];
-  const usageLabel = storage ? t('accountMenu.storage.usage', {
-    used: formatStorageGb(storage.usedBytes),
-    total: formatStorageGb(storage.limitBytes)
-  }) : t('accountMenu.storage.unavailable');
-
-  // The switch list body, revealed under the "Switch account" row. Own markup,
-  // not a Bloom grouped section: this is not a list of settings rows and the
-  // component is not a card container. It mirrors the section's rhythm by hand —
-  // 12px content inset, 12px after the avatar, a hairline between rows — and
-  // draws those hairlines INSIDE the animated clip, so a collapsed list never
-  // strands one against the header row.
-  const listItems = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [switchableAccounts.map((account, index) => {
-      const accent = resolveAccentHex(account.color, theme.colors.primary);
-      const isSwitching = snapshot.switchingAccountId === account.accountId;
-      return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
-        children: [index > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          className: "h-px bg-border opacity-30 ml-space-12"
-        }) : null, /*#__PURE__*/(0, _jsxRuntime.jsxs)(HoverPressable, {
-          baseClassName: `flex-row items-center gap-space-12 px-space-12 py-[10px]${switchingDisabled ? ' opacity-60' : ''}`,
-          hoverClassName: "bg-fill-secondary",
-          onPress: () => handlers.onSwitch(account.accountId),
-          disabled: switchingDisabled,
-          accessibilityRole: "button",
-          accessibilityLabel: account.displayName,
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_avatar.Avatar, {
-              source: account.avatarUrl ?? undefined,
-              variant: "thumb",
-              name: account.displayName,
-              size: SWITCH_AVATAR_SIZE
-            }), account.isCurrent ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-              style: [_oxyAuthChooserStyles.authChooserStyles.currentAvatarRing, {
-                borderColor: accent
-              }],
-              pointerEvents: "none"
-            }) : null]
-          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-            className: "flex-1 min-w-0",
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-              className: "text-body font-semibold text-text",
-              numberOfLines: 1,
-              children: account.displayName
-            }), account.email ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-              className: "text-caption text-text-secondary",
-              numberOfLines: 1,
-              children: account.email
-            }) : null]
-          }), isSwitching ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.MaterialCommunityIcons, {
-            name: "loading",
-            size: 20,
-            color: accent
-          }) : null]
-        })]
-      }, account.accountId);
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      className: "h-px bg-border opacity-30 ml-space-12"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(AccountAffordanceRow, {
-      icon: "plus",
-      label: t('accountMenu.addAnother'),
-      onPress: handlers.onAdd,
-      disabled: switchingDisabled,
-      theme: theme
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      className: "h-px bg-border opacity-30 ml-space-12"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(AccountAffordanceRow, {
-      icon: "account-multiple-outline",
-      label: t('accountSwitcher.manageOnDevice'),
-      onPress: handlers.onManage,
-      disabled: switchingDisabled,
-      theme: theme
-    })]
-  });
-  const manageLabel = t('accountMenu.manage');
-  const switchLabel = t('accountMenu.switchAccount');
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: _oxyAuthChooserStyles.authChooserStyles.hero,
-      children: [current ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_pressableScale.PressableScale, {
-          onPress: handlers.onEditAvatar,
-          accessibilityRole: "button",
-          accessibilityLabel: t('editProfile.changeAvatar'),
-          style: _oxyAuthChooserStyles.authChooserStyles.heroAvatarPressable,
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_avatar.Avatar, {
-            source: current.avatarUrl ?? undefined,
-            name: current.displayName,
-            size: HERO_AVATAR_SIZE
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-            style: [_oxyAuthChooserStyles.authChooserStyles.heroAvatarRing, {
-              borderColor: currentAccent
-            }],
-            pointerEvents: "none"
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_AvatarCameraBadge.default, {})]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          style: _oxyAuthChooserStyles.authChooserStyles.heroNameBlock,
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-            style: [_oxyAuthChooserStyles.authChooserStyles.heroGreeting, {
-              color: theme.colors.text
-            }],
-            numberOfLines: 2,
-            children: t('accountMenu.greeting', {
-              name: current.displayName
-            })
-          }), currentAddress ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-            style: [_oxyAuthChooserStyles.authChooserStyles.heroAddress, {
-              color: theme.colors.textSecondary
-            }],
-            numberOfLines: 1,
-            children: currentAddress
-          }) : null]
-        })]
-      }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
-        variant: "secondary",
-        size: "small",
-        onPress: handlers.onManage,
-        accessibilityLabel: manageLabel,
-        children: manageLabel
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeReanimated.default.View, {
-      className: "bg-fill overflow-hidden mb-space-16",
-      style: switchCardStyle,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(HoverPressable, {
-        baseClassName: `flex-row items-center gap-space-12 px-space-12 py-[10px] min-h-[44px]${switchingDisabled ? ' opacity-60' : ''}`,
-        hoverClassName: "bg-fill-secondary",
-        onPress: toggleExpanded,
-        disabled: switchingDisabled,
-        accessibilityRole: "button"
-        // The ARIA prop, not `accessibilityState`: react-native-web 0.21
-        // forwards only this one, and RN maps it to
-        // `accessibilityState.expanded` natively — so the disclosure state
-        // reaches assistive tech on BOTH platforms.
-        ,
-        "aria-expanded": expanded,
-        accessibilityLabel: switchLabel,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-          className: "flex-1 text-body text-text",
-          numberOfLines: 1,
-          children: switchLabel
-        }), expanded ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_avatarGroup.AvatarGroup, {
-          items: facepile,
-          layout: "stack",
-          size: FACEPILE_AVATAR_SIZE,
-          max: FACEPILE_MAX,
-          overlap: FACEPILE_OVERLAP,
-          variant: "thumb",
-          showInitials: true,
-          ringColor: theme.colors.card
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: [_oxyAuthChooserStyles.authChooserStyles.chevronCircle, {
-            backgroundColor: theme.colors.contrast50
-          }],
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
-            style: chevronStyle,
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.MaterialCommunityIcons, {
-              name: "chevron-down",
-              size: 20,
-              color: theme.colors.text
-            })
-          })
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
-        style: [_oxyAuthChooserStyles.authChooserStyles.collapse, listStyle],
-        pointerEvents: expanded ? 'auto' : 'none',
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: _oxyAuthChooserStyles.authChooserStyles.collapseMeasure,
-          onLayout: event => setListContentHeight(event.nativeEvent.layout.height),
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-            children: listItems
-          })
-        })
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      className: "bg-fill rounded-[16px] overflow-hidden mb-space-16 px-space-12 py-[10px] gap-space-12",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        className: "flex-row items-center gap-space-12 min-h-[24px]",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          className: "w-[20px] items-center",
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.MaterialCommunityIcons, {
-            name: "cloud-outline",
-            size: ROW_ICON_SIZE,
-            color: theme.colors.textSecondary
-          })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-          className: "flex-1 text-body font-semibold text-text",
-          numberOfLines: 1,
-          children: t('accountMenu.storage.title')
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_compositionBar.CompositionBar, {
-        categories: storageCategories,
-        selectedKey: storageSegment,
-        onSelect: toggleStorageSegment,
-        hintLabel: usageLabel,
-        formatReadout: (bytes, percent) => `${formatStorageGb(bytes)} · ${percent}%`
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        className: "flex-row gap-space-8",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(StorageChip, {
-          label: t('accountMenu.storage.upgrade'),
-          onPress: menu.onUpgradeStorage
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(StorageChip, {
-          label: t('accountMenu.storage.manage'),
-          onPress: menu.onManageStorage
-        })]
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_settingsList.SettingsListGroup, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_settingsList.SettingsListItem, {
-        icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuIcon, {
-          name: "tray-arrow-down",
-          theme: theme
-        }),
-        title: t('accountMenu.data'),
-        onPress: menu.onOpenData
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_settingsList.SettingsListItem, {
-        icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuIcon, {
-          name: "cog-outline",
-          theme: theme
-        }),
-        title: t('accountMenu.settings'),
-        onPress: menu.onOpenSettings
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_settingsList.SettingsListItem, {
-        icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuIcon, {
-          name: "help-circle-outline",
-          theme: theme
-        }),
-        title: t('accountMenu.help'),
-        onPress: menu.onHelp
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_settingsList.SettingsListItem, {
-        icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuIcon, {
-          name: "logout",
-          theme: theme
-        }),
-        title: t('accountMenu.signOut'),
-        onPress: menu.onSignOut,
-        showChevron: false
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      className: "flex-row items-center justify-center gap-space-12 px-space-12 pb-space-8",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
-        onPress: menu.onPrivacy,
-        accessibilityRole: "link",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-          className: "text-bodySmall text-text-secondary",
-          children: t('accountMenu.privacy')
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-        className: "text-bodySmall text-text-tertiary",
-        children: "\xB7"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
-        onPress: menu.onTerms,
-        accessibilityRole: "link",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-          className: "text-bodySmall text-text-secondary",
-          children: t('accountMenu.terms')
-        })
-      })]
-    })]
-  });
-};
-
-// ---------------------------------------------------------------------------
-// Account-menu row building blocks (NativeWind)
-// ---------------------------------------------------------------------------
-
-/**
- * An account-list AFFORDANCE row ("Add another account", "Manage accounts on
- * this device") — a bordered circle sized to the avatar it stands in for, so its
- * label lands on the same line as every account name above it. Own markup, like
- * the account rows it closes: this list is not a Bloom grouped section.
- */
-const AccountAffordanceRow = ({
-  icon,
-  label,
-  onPress,
-  disabled,
-  theme
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(HoverPressable, {
-  baseClassName: `flex-row items-center gap-space-12 px-space-12 py-[10px]${disabled ? ' opacity-60' : ''}`,
-  hoverClassName: "bg-fill-secondary",
-  onPress: onPress,
-  disabled: disabled,
-  accessibilityRole: "button",
-  accessibilityLabel: label,
-  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-    className: "w-[36px] h-[36px] items-center justify-center rounded-radius-max border border-border",
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.MaterialCommunityIcons, {
-      name: icon,
-      size: BADGE_GLYPH_SIZE,
-      color: theme.colors.textSecondary
-    })
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-    className: "flex-1 text-body font-semibold text-text",
-    numberOfLines: 1,
-    children: label
-  })]
-});
-
-/**
- * The leading glyph for a grouped-section menu row, sized to Bloom's 20px icon
- * column so the icons, the storage block's cloud and every row title align.
- */
-const MenuIcon = ({
-  name,
-  theme
-}) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.MaterialCommunityIcons, {
-  name: name,
-  size: ROW_ICON_SIZE,
-  color: theme.colors.textSecondary
-});
-
-/** A storage action chip — a bordered pill on the sheet background. */
-const StorageChip = ({
-  label,
-  onPress
-}) => /*#__PURE__*/(0, _jsxRuntime.jsx)(HoverPressable, {
-  baseClassName: "rounded-radius-max border border-border bg-bg py-[9px] px-[14px]",
-  hoverClassName: "bg-fill-secondary",
-  onPress: onPress,
-  accessibilityRole: "button",
-  accessibilityLabel: label,
-  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-    className: "text-bodySmall font-semibold text-text",
-    children: label
-  })
-});
-const AccountRow = ({
-  account,
-  theme,
-  switching,
-  disabled,
-  onPress
-}) => {
-  const accent = resolveAccentHex(account.color, theme.colors.primary);
-  const rowStyle = [_oxyAuthChooserStyles.authChooserStyles.accountRow, {
-    borderColor: account.isCurrent ? accent : theme.colors.border,
-    backgroundColor: theme.colors.card
-  }, disabled && !switching ? _oxyAuthChooserStyles.authChooserStyles.rowDisabled : null];
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_theme.BloomColorScope, {
-    colorPreset: toPreset(account.color),
-    asChild: true,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Pressable, {
-      style: rowStyle,
-      onPress: onPress,
-      disabled: disabled,
-      accessibilityRole: "button",
-      accessibilityState: {
-        selected: account.isCurrent,
-        disabled
-      },
-      accessibilityLabel: account.displayName,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: [_oxyAuthChooserStyles.authChooserStyles.avatarRing, {
-          borderColor: account.isCurrent ? accent : 'transparent'
-        }],
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_avatar.Avatar, {
-          source: account.avatarUrl ?? undefined,
-          variant: "thumb",
-          name: account.displayName,
-          size: ROW_AVATAR_SIZE
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: _oxyAuthChooserStyles.authChooserStyles.rowMeta,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-          style: [_oxyAuthChooserStyles.authChooserStyles.rowName, {
-            color: theme.colors.text
-          }],
-          numberOfLines: 1,
-          children: account.displayName
-        }), account.email ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-          style: [_oxyAuthChooserStyles.authChooserStyles.rowHandle, {
-            color: theme.colors.textSecondary
-          }],
-          numberOfLines: 1,
-          children: account.email
-        }) : null]
-      }), switching ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.MaterialCommunityIcons, {
-        name: "loading",
-        size: 20,
-        color: accent
-      }) : account.isCurrent ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.MaterialCommunityIcons, {
-        name: "check-circle",
-        size: 20,
-        color: accent
-      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.MaterialCommunityIcons, {
-        name: "chevron-right",
-        size: 20,
-        color: theme.colors.textSecondary
-      })]
-    })
-  });
-};
-
-// ---------------------------------------------------------------------------
-// Sign-in view (add / signin) — NATIVE-facing today: on web `autoStartSignIn`
-// (fired from the subscribe pass / the add / back-to-sign-in handlers) moves the
-// view to `qr` almost immediately, so this renders only for a brief instant there.
-// ---------------------------------------------------------------------------
-
-const SignInView = ({
-  snapshot,
-  theme,
-  t,
-  handlers,
-  onSignInWithOxy,
-  onScanQr,
-  onCreateAccount
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-  style: _oxyAuthChooserStyles.authChooserStyles.signInBlock,
-  children: [snapshot.accounts.length > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    style: _oxyAuthChooserStyles.authChooserStyles.rows,
-    children: [snapshot.accounts.map(account => /*#__PURE__*/(0, _jsxRuntime.jsx)(AccountRow, {
-      account: account,
-      theme: theme,
-      switching: snapshot.switchingAccountId === account.accountId,
-      disabled: snapshot.switchingAccountId !== null,
-      onPress: () => handlers.onSwitch(account.accountId)
-    }, account.accountId)), /*#__PURE__*/(0, _jsxRuntime.jsx)(Dividerish, {
-      theme: theme,
-      label: t('signin.or') || 'or'
-    })]
-  }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
-    variant: "primary",
-    onPress: onSignInWithOxy,
-    style: _oxyAuthChooserStyles.authChooserStyles.primaryButton,
-    children: t('accountSwitcher.signInWithOxy') || 'Sign in with Oxy'
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
-    variant: "secondary",
-    onPress: onScanQr,
-    style: _oxyAuthChooserStyles.authChooserStyles.secondaryButton,
-    children: t('accountSwitcher.scanQr') || 'Scan a QR from another device'
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(SignUpFooterLink, {
-    theme: theme,
-    t: t,
-    onPress: onCreateAccount
-  })]
-});
-const Dividerish = ({
-  theme,
-  label
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-  style: _oxyAuthChooserStyles.authChooserStyles.dividerRow,
-  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-    style: [_oxyAuthChooserStyles.authChooserStyles.dividerLine, {
-      backgroundColor: theme.colors.border
-    }]
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-    style: [_oxyAuthChooserStyles.authChooserStyles.dividerText, {
-      color: theme.colors.textSecondary
-    }],
-    children: label
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-    style: [_oxyAuthChooserStyles.authChooserStyles.dividerLine, {
-      backgroundColor: theme.colors.border
-    }]
-  })]
-});
-
-/** "New to Oxy? Create one" — shared by `SignInView` and `QrView`. */
-const SignUpFooterLink = ({
-  theme,
-  t,
-  onPress
-}) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
-  onPress: onPress,
-  accessibilityRole: "button",
-  style: _oxyAuthChooserStyles.authChooserStyles.footerLink,
-  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-    style: [_oxyAuthChooserStyles.authChooserStyles.linkText, {
-      color: theme.colors.textSecondary
-    }],
-    children: t('signin.createAccountLink') || 'New to Oxy? Create one'
-  })
-});
-
-/** "Already have an account? Sign in" — used by `SignUpView`. */
-const SignInFooterLink = ({
-  theme,
-  t,
-  onPress
-}) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
-  onPress: onPress,
-  accessibilityRole: "button",
-  style: _oxyAuthChooserStyles.authChooserStyles.footerLink,
-  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-    style: [_oxyAuthChooserStyles.authChooserStyles.linkText, {
-      color: theme.colors.textSecondary
-    }],
-    children: t('signup.backToSignInLink') || 'Already have an account? Sign in'
-  })
-});
-
-// ---------------------------------------------------------------------------
-// QR view — the PRIMARY web sign-in surface, and the ONLY sign-in surface on
-// native. Commons is ALWAYS the priority path (owner mandate): the QR here
-// and the "Get Commons" CTA below are the leading content everywhere they
-// appear. The passkey link is explicitly the lightweight, de-emphasized
-// alternative for someone who doesn't want to install Commons — same visual
-// subordination (a small text link, never a button) and the same "No
-// Commons?" framing in its copy wherever it's offered.
-// ---------------------------------------------------------------------------
-
-const QrView = ({
-  snapshot,
-  theme,
-  t,
-  onRetry,
-  passkeyAvailable,
-  onSignInWithPasskey,
-  passkeyPending,
-  onCreateAccount
-}) => {
-  const {
-    signIn,
-    commonsAvailability
-  } = snapshot;
-  const [showQrAnyway, setShowQrAnyway] = (0, _react.useState)(false);
-
-  // A ceremony FAILURE is surfaced as a toast by `handleSignInWithPasskey` — the
-  // link itself never renders an inline error (owner mandate).
-  const passkeyLink = passkeyAvailable && signIn.phase !== 'authorized' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
-    onPress: onSignInWithPasskey,
-    disabled: passkeyPending,
-    accessibilityRole: "button",
-    style: _oxyAuthChooserStyles.authChooserStyles.footerLink,
-    testID: "passkey-signin-link",
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-      style: [_oxyAuthChooserStyles.authChooserStyles.linkText, {
-        color: theme.colors.textSecondary
-      }],
-      children: passkeyPending ? t('accountSwitcher.passkeySigningIn') || 'Signing in…' : t('accountSwitcher.useIdentityOnDevice') || 'No Commons? Use a passkey on this device instead'
-    })
-  }) : null;
-
-  // Native, Commons confirmed NOT installed: a same-device QR is a dead
-  // end (the user can't scan their own screen) — lead with "Get Commons"
-  // instead, and demote the QR to an explicit "I have it elsewhere" reveal.
-  if (commonsAvailability === 'unavailable' && !showQrAnyway) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: _oxyAuthChooserStyles.authChooserStyles.centeredBlock,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-        style: [_oxyAuthChooserStyles.authChooserStyles.mutedText, {
-          color: theme.colors.textSecondary
-        }],
-        children: t('accountSwitcher.commonsNotInstalled') || "Don't have Commons? Get the app to sign in with your Oxy ID."
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
-        variant: "primary",
-        onPress: () => void _reactNative.Linking.openURL((0, _commonsStoreLinks.getCommonsAcquisitionUrl)(_reactNative.Platform.OS)),
-        style: _oxyAuthChooserStyles.authChooserStyles.primaryButton,
-        children: t('accountSwitcher.getCommons') || 'Get Commons'
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
-        onPress: () => setShowQrAnyway(true),
-        accessibilityRole: "button",
-        style: _oxyAuthChooserStyles.authChooserStyles.footerLink,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-          style: [_oxyAuthChooserStyles.authChooserStyles.linkText, {
-            color: theme.colors.textSecondary
-          }],
-          children: t('accountSwitcher.showQrAnyway') || 'I have Commons on another device'
-        })
-      }), passkeyLink, /*#__PURE__*/(0, _jsxRuntime.jsx)(SignUpFooterLink, {
-        theme: theme,
-        t: t,
-        onPress: onCreateAccount
-      })]
-    });
-  }
-  if (signIn.phase === 'error') {
-    // The failure reason is toasted by the controller subscription above — no
-    // inline error copy here (owner mandate).
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: _oxyAuthChooserStyles.authChooserStyles.centeredBlock,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
-        variant: "secondary",
-        onPress: onRetry,
-        style: _oxyAuthChooserStyles.authChooserStyles.secondaryButton,
-        children: t('common.actions.tryAgain') || 'Try again'
-      }), passkeyLink]
-    });
-  }
-  if (signIn.phase === 'starting' || signIn.phase === 'authorized' || !signIn.qrPayload) {
-    const label = signIn.phase === 'authorized' ? t('signin.status.signingIn') || 'Signing in…' : t('accountSwitcher.loading') || 'Preparing sign-in…';
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: _oxyAuthChooserStyles.authChooserStyles.centeredBlock,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.MaterialCommunityIcons, {
-        name: "loading",
-        size: 26,
-        color: theme.colors.primary
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-        style: [_oxyAuthChooserStyles.authChooserStyles.mutedText, {
-          color: theme.colors.textSecondary
-        }],
-        children: label
-      })]
-    });
-  }
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    style: _oxyAuthChooserStyles.authChooserStyles.centeredBlock,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-      style: [_oxyAuthChooserStyles.authChooserStyles.qrHeadline, {
-        color: theme.colors.text
-      }],
-      children: t('accountSwitcher.qrHeadline') || 'Sign in with your Oxy identity'
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: _oxyAuthChooserStyles.authChooserStyles.qrPlate,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeQrcodeSvg.default, {
-        value: signIn.qrPayload,
-        size: QR_SIZE,
-        backgroundColor: QR_PLATE_BG,
-        color: QR_FOREGROUND
-      })
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-      style: [_oxyAuthChooserStyles.authChooserStyles.mutedText, {
-        color: theme.colors.textSecondary
-      }],
-      children: t('accountSwitcher.scanWithOxy') || 'Scan with Commons on your phone to continue.'
-    }), passkeyLink, /*#__PURE__*/(0, _jsxRuntime.jsx)(SignUpFooterLink, {
-      theme: theme,
-      t: t,
-      onPress: onCreateAccount
-    })]
-  });
-};
-
-// ---------------------------------------------------------------------------
-// Sign-up view
-// ---------------------------------------------------------------------------
-
-/** Debounced username-availability check over the existing SDK method. */
-function useUsernameAvailability(oxyServices, t) {
-  const [status, setStatus] = (0, _react.useState)('idle');
-  const timerRef = (0, _react.useRef)(null);
-  const requestSeqRef = (0, _react.useRef)(0);
-  const check = (0, _react.useCallback)(value => {
-    if (timerRef.current) clearTimeout(timerRef.current);
-    const seq = ++requestSeqRef.current;
-    if (!value || value.length < 3) {
-      setStatus('idle');
-      return;
-    }
-    setStatus('checking');
-    timerRef.current = setTimeout(() => {
-      void oxyServices.checkUsernameAvailability(value).then(result => {
-        if (seq !== requestSeqRef.current) return; // superseded by a newer check
-        setStatus(result.available ? 'available' : 'taken');
-      }).catch(() => {
-        if (seq !== requestSeqRef.current) return;
-        // Reset the (now stale) verdict rather than block on it, and surface
-        // the failure as a toast — never an inline error inside the dialog.
-        setStatus('idle');
-        _bloom.toast.error(t('accounts.create.username.checkFailed') || 'Could not check availability');
-      });
-    }, 400);
-  }, [oxyServices, t]);
-  return {
-    status,
-    check
-  };
-}
-const UsernameStatusText = ({
-  status,
-  theme,
-  t
-}) => {
-  if (status === 'idle') return null;
-  if (status === 'checking') {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-      style: [_oxyAuthChooserStyles.authChooserStyles.mutedText, {
-        color: theme.colors.textSecondary
-      }],
-      children: t('signup.usernameChecking') || 'Checking…'
-    });
-  }
-  if (status === 'available') {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-      style: [_oxyAuthChooserStyles.authChooserStyles.mutedText, {
-        color: theme.colors.success
-      }],
-      children: t('signup.usernameAvailable') || 'Available'
-    });
-  }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-    style: [_oxyAuthChooserStyles.authChooserStyles.mutedText, {
-      color: theme.colors.error
-    }],
-    children: t('signup.usernameTaken') || 'This username is taken'
-  });
-};
-const SignUpView = ({
-  snapshot,
-  theme,
-  t,
-  oxyServices,
-  passkeyMode,
-  onCreateWithPasskey,
-  createPending,
-  onOpenHub,
-  onBackToSignIn
-}) => {
-  const [username, setUsername] = (0, _react.useState)('');
-  const {
-    status: usernameStatus,
-    check: checkUsername
-  } = useUsernameAvailability(oxyServices, t);
-  const canSubmit = username.trim().length >= 3 && usernameStatus === 'available' && !createPending;
-
-  // Native — Commons owns identity creation. Mirrors the QR view's own
-  // commonsAvailability branch: deep-link straight in when installed, else
-  // lead with the same "Get Commons" fallback.
-  if (!(0, _isWebBrowser.isWebBrowser)()) {
-    const commonsInstalled = snapshot.commonsAvailability === 'available';
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: _oxyAuthChooserStyles.authChooserStyles.centeredBlock,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
-        variant: "primary",
-        onPress: () => void _reactNative.Linking.openURL(commonsInstalled ? COMMONS_CREATE_IDENTITY_URL : (0, _commonsStoreLinks.getCommonsAcquisitionUrl)(_reactNative.Platform.OS)),
-        style: _oxyAuthChooserStyles.authChooserStyles.primaryButton,
-        children: commonsInstalled ? t('signup.createInCommons') || 'Create your identity in Commons' : t('accountSwitcher.getCommons') || 'Get Commons'
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(SignInFooterLink, {
-        theme: theme,
-        t: t,
-        onPress: onBackToSignIn
-      })]
-    });
-  }
-
-  // Web, first-party Oxy origin. Commons leads (owner mandate: it's ALWAYS
-  // the priority path, everywhere the two appear) with a "Get Commons" CTA;
-  // passkey creation is the de-emphasized alternative underneath for someone
-  // who doesn't want to install anything — secondary button, introduced by
-  // its own "No Commons?" framing, same subordination as the QR view's link.
-  if (passkeyMode === 'direct') {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: _oxyAuthChooserStyles.authChooserStyles.signInBlock,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-        style: [_oxyAuthChooserStyles.authChooserStyles.qrHeadline, {
-          color: theme.colors.text
-        }],
-        children: t('signup.commonsHeadline') || 'Create your identity in Commons'
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-        style: [_oxyAuthChooserStyles.authChooserStyles.mutedText, {
-          color: theme.colors.textSecondary
-        }],
-        children: t('signup.commonsExplainer') || 'Commons is your full self-custody Oxy identity — one app, works everywhere.'
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
-        variant: "primary",
-        onPress: () => void _reactNative.Linking.openURL((0, _commonsStoreLinks.getCommonsAcquisitionUrl)(_reactNative.Platform.OS)),
-        style: _oxyAuthChooserStyles.authChooserStyles.primaryButton,
-        children: t('accountSwitcher.getCommons') || 'Get Commons'
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Dividerish, {
-        theme: theme,
-        label: t('signin.or') || 'or'
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-        style: [_oxyAuthChooserStyles.authChooserStyles.mutedText, {
-          color: theme.colors.textSecondary
-        }],
-        children: t('signup.passkeyAlternative') || "No Commons? Create a passkey on this device instead"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TextInput, {
-        style: [_oxyAuthChooserStyles.authChooserStyles.usernameInput, {
-          borderColor: theme.colors.border,
-          color: theme.colors.text
-        }],
-        placeholder: t('signup.usernamePlaceholder') || 'Choose a username',
-        placeholderTextColor: theme.colors.textSecondary,
-        value: username,
-        autoCapitalize: "none",
-        autoCorrect: false,
-        autoComplete: "username",
-        onChangeText: value => {
-          setUsername(value);
-          checkUsername(value.trim());
-        },
-        testID: "signup-username-input"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(UsernameStatusText, {
-        status: usernameStatus,
-        theme: theme,
-        t: t
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
-        variant: "secondary",
-        onPress: () => void onCreateWithPasskey(username.trim()),
-        disabled: !canSubmit,
-        style: _oxyAuthChooserStyles.authChooserStyles.secondaryButton,
-        testID: "signup-create-button",
-        children: createPending ? t('signup.creating') || 'Creating…' : t('signup.createAccount') || 'Create account'
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(SignInFooterLink, {
-        theme: theme,
-        t: t,
-        onPress: onBackToSignIn
-      })]
-    });
-  }
-
-  // Web, non-Oxy origin (b2): passkey creation can't run locally here — the
-  // same WebAuthn RP-ID boundary as sign-in — so this opens the SAME
-  // auth.oxy.so passkey hub popup `QrView`'s "No Commons?" link uses.
-  // Completing EITHER a sign-in OR a fresh sign-up there relays the resulting
-  // session back via the SAME poll/socket engine `showQr` drives.
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    style: _oxyAuthChooserStyles.authChooserStyles.centeredBlock,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-      style: [_oxyAuthChooserStyles.authChooserStyles.mutedText, {
-        color: theme.colors.textSecondary
-      }],
-      children: t('signup.hubExplainer') || 'Create your Oxy ID in a secure window, then come right back.'
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
-      variant: "primary",
-      onPress: onOpenHub,
-      style: _oxyAuthChooserStyles.authChooserStyles.primaryButton,
-      children: t('signup.continueInWindow') || 'Continue in a new window'
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(SignInFooterLink, {
-      theme: theme,
-      t: t,
-      onPress: onBackToSignIn
-    })]
+    onContinueWithOxy: () => void controller.signInWithOxy(),
+    alternatives: alternatives
   });
 };
 
@@ -1443,7 +387,12 @@ const EMPTY_SNAPSHOT = {
     authorizeCode: null,
     qrPayload: null,
     expiresAt: null,
-    error: null
+    error: null,
+    route: null,
+    routeFailed: false,
+    pushSentAt: null,
+    openedAt: null,
+    progress: 'idle'
   },
   commonsAvailability: 'unknown'
 };