@smileid/usesmileid 12.0.0 → 12.0.2

package/src/presentation/screen/helpers/use_capture_orientation_lock.ts

@@ -3,6 +3,14 @@ import * as ScreenOrientation from "expo-screen-orientation";
 import { UseSmileIDCrashReporting } from "@smileid/usesmileid_bridge";
 import type { DocumentOrientation } from "../../../core/models/document_type";
 
+export type CaptureOrientationOptions = {
+  /**
+   * Lock applied when the capture screen unmounts. Defaults to portrait-up;
+   * threaded from the builder's `exitOrientations`.
+   */
+  readonly exitLock?: ScreenOrientation.OrientationLock;
+};
+
 /**
  * Lock device orientation for a capture screen, scoped to its lifetime
  * (`"Landscape"` → landscape, `"Portrait"` → portrait-up).
@@ -10,26 +18,76 @@ import type { DocumentOrientation } from "../../../core/models/document_type";
  * Each screen asserts its OWN orientation on mount, so document → selfie
  * reverts deterministically rather than depending on the previous
  * screen's teardown winning a race against the next camera initialising.
- * Unmount restores portrait-up as a safety net.
  *
  * Locks are global: the host app must permit the locked orientations at
  * the OS level (iOS `UISupportedInterfaceOrientations`, Android activity
- * `screenOrientation`) for the lock to take effect.
+ * `screenOrientation`) for the lock to take effect — a host that does not
+ * is warned about and reported rather than silently staying upright.
  */
 export function useCaptureOrientationLock(
   orientation: DocumentOrientation,
+  {
+    exitLock = ScreenOrientation.OrientationLock.PORTRAIT_UP,
+  }: CaptureOrientationOptions = {},
 ): void {
   useEffect(() => {
     const target =
       orientation === "Landscape"
         ? ScreenOrientation.OrientationLock.LANDSCAPE
         : ScreenOrientation.OrientationLock.PORTRAIT_UP;
+    void reportIfLockUnsupported(target);
     void lockOrientation(target);
 
     return () => {
-      void lockOrientation(ScreenOrientation.OrientationLock.PORTRAIT_UP);
+      void lockOrientation(exitLock);
     };
-  }, [orientation]);
+  }, [orientation, exitLock]);
+}
+
+/**
+ * Surface a host build that cannot honour `target`. `lockAsync` resolves
+ * successfully in that case, so without this preflight the capture screen
+ * just stays in the wrong orientation with no signal. (Expo's `app.json`
+ * `orientation` value is not such a case: the module's app-delegate hook
+ * outranks the baked `Info.plist` on iOS — device-verified.)
+ */
+async function reportIfLockUnsupported(
+  target: ScreenOrientation.OrientationLock,
+): Promise<void> {
+  let supported: boolean;
+  try {
+    supported = await ScreenOrientation.supportsOrientationLockAsync(target);
+  } catch (error) {
+    reportOrientationFailure(error);
+    return;
+  }
+  if (supported) return;
+
+  // `typeof` guard: `__DEV__` is bundler-injected and absent outside Metro-like
+  // environments, where a bare reference throws rather than reading falsy.
+  const isDevBuild = typeof __DEV__ !== "undefined" && __DEV__;
+  if (isDevBuild && !warnedUnsupportedTargets.has(target)) {
+    warnedUnsupportedTargets.add(target);
+    console.warn(
+      "[UseSmileID] The capture screen needs to lock the device orientation, " +
+        "but this build does not permit it. Allow the required orientations " +
+        "in your app's iOS Info.plist / Android manifest.",
+    );
+  }
+  reportOrientationFailure(
+    new Error(`orientation lock unsupported by host build: ${target}`),
+  );
+}
+
+/**
+ * Dedupes the dev warning per target: a flow remounts the capture screen for the back
+ * side and interstitial, and the misconfiguration can't change mid-session.
+ */
+const warnedUnsupportedTargets = new Set<ScreenOrientation.OrientationLock>();
+
+/** Test seam: clears the once-per-target dev-warning dedupe. */
+export function resetUnsupportedLockWarningsForTesting(): void {
+  warnedUnsupportedTargets.clear();
 }
 
 /** Lock to `target`, routing a native failure through crash reporting. */
@@ -39,8 +97,12 @@ async function lockOrientation(
   try {
     await ScreenOrientation.lockAsync(target);
   } catch (error) {
-    UseSmileIDCrashReporting.captureException(
-      error instanceof Error ? error : new Error(String(error)),
-    );
+    reportOrientationFailure(error);
   }
 }
+
+function reportOrientationFailure(error: unknown): void {
+  UseSmileIDCrashReporting.captureException(
+    error instanceof Error ? error : new Error(String(error)),
+  );
+}

package/src/presentation/screen/use_smile_id_capture_screen.tsx

@@ -28,11 +28,14 @@ import type {
   DocumentAnalyzer,
   FaceAnalyzer,
 } from "@smileid/usesmileid_platform_interface";
-import type { CaptureReadyEvent, ScanState } from "@smileid/usesmileid_bridge";
+import type {
+  CaptureReadyEvent,
+  UseSmileIDScanState,
+} from "@smileid/usesmileid_bridge";
 import {
   CaptureReadyEventKind,
   DocumentSide,
-  ScanStateType,
+  UseSmileIDScanStateType,
 } from "@smileid/usesmileid_bridge";
 import { CaptureType } from "../../core/models/ml_config";
 import type { DocumentCaptureMode } from "../../core/models/document_capture_mode";
@@ -108,7 +111,7 @@ export type UseSmileIDCaptureScreenProps = {
   readonly onDocumentOrigin?: (origin: DocumentImageOrigin) => void;
 
   /** Fires when the state machine reaches `"timeout"`; the screen stops streaming. */
-  readonly onCaptureTimeout?: (state: ScanState) => void;
+  readonly onCaptureTimeout?: (state: UseSmileIDScanState) => void;
 
   readonly onBack?: () => void;
   readonly showAttribution?: boolean;
@@ -116,6 +119,9 @@ export type UseSmileIDCaptureScreenProps = {
   /** Keeps the oval rim neutral through CAPTURING/PROCESSING — ESS has no green oval treatment. */
   readonly enableEnhancedLiveness?: boolean;
 
+  /** Runs a selfie capture on the rear camera. Ignored for document capture. */
+  readonly allowAgentMode?: boolean;
+
   /**
    * Document aspect ratio (width / height) for the document capture
    * guide cutout. Ignored for selfie capture. Omitted ⇒ the overlay's
@@ -162,9 +168,12 @@ export function UseSmileIDCaptureScreen(props: UseSmileIDCaptureScreenProps) {
   const theme = props.theme ?? defaultLightTheme;
   const showAttribution = props.showAttribution ?? true;
   const enableEnhancedLiveness = props.enableEnhancedLiveness ?? false;
+  const allowAgentMode = props.allowAgentMode ?? false;
   // Literal union — useCameraDevice takes the lowercase string directly.
   const cameraFacing: "front" | "back" =
-    props.captureType === CaptureType.selfie ? "front" : "back";
+    props.captureType === CaptureType.selfie && !allowAgentMode
+      ? "front"
+      : "back";
 
   const { hasPermission, requestPermission } = useCameraPermission();
   const device = useCameraDevice(cameraFacing);
@@ -202,8 +211,8 @@ export function UseSmileIDCaptureScreen(props: UseSmileIDCaptureScreenProps) {
   }, [hasPermission, requestPermission]);
 
   // Per-frame scan state drives the overlay + feedback bubble.
-  const [scanState, setScanState] = useState<ScanState>({
-    type: ScanStateType.Initial,
+  const [scanState, setScanState] = useState<UseSmileIDScanState>({
+    type: UseSmileIDScanStateType.Initial,
   });
   const [streaming, setStreaming] = useState<boolean>(false);
   // Bumped on every Start tap to reset the feedback debouncer.
@@ -213,6 +222,13 @@ export function UseSmileIDCaptureScreen(props: UseSmileIDCaptureScreenProps) {
   const [hasAnalyzedFrame, setHasAnalyzedFrame] = useState<boolean>(false);
   // Fallback shutter, revealed after activateManualAfterMs. Resets per mount.
   const [manualShutterRevealed, setManualShutterRevealed] = useState(false);
+  // Set when a document scan times out, so the recovery controls stay on screen
+  // after the scan (and `streaming`) stops. `timedOutRef` keeps the terminal
+  // branch idempotent without latching the one-shot delivery gate.
+  const [captureTimedOut, setCaptureTimedOut] = useState(false);
+  const timedOutRef = useRef(false);
+  // Set when streaming produced no analyzed frame at all, which the analyzer's own timeout cannot report.
+  const [captureStalled, setCaptureStalled] = useState(false);
   // True while a manual/gallery delivery is in flight — disables the controls.
   const [deliveringDocument, setDeliveringDocument] = useState(false);
   // Transient gallery-import error; overrides the live chip, self-clears so the user can re-pick.
@@ -232,7 +248,7 @@ export function UseSmileIDCaptureScreen(props: UseSmileIDCaptureScreenProps) {
   const completedRef = useRef<boolean>(false);
   // Raw (not committed) frame state for the session-boundary check, so
   // transitions the 1% bucketing skips committing are still seen.
-  const previousScanStateRef = useRef<ScanState | null>(null);
+  const previousScanStateRef = useRef<UseSmileIDScanState | null>(null);
 
   // Capture telemetry: wall-clock start (first analyzed frame) and a
   // rising-edge `unsatisfied` retry counter, surfaced via onCaptureComplete.
@@ -268,8 +284,28 @@ export function UseSmileIDCaptureScreen(props: UseSmileIDCaptureScreenProps) {
     setSessionEpoch((epoch) => epoch + 1);
     // A new session must not compare against the old session's last state.
     previousScanStateRef.current = null;
-    setStreaming(true);
-  }, [streaming, onStartCapture]);
+    // Clear the terminal latches so a retry after a timeout or a stall is a fresh session.
+    const wasTerminal = timedOutRef.current;
+    timedOutRef.current = false;
+    setCaptureTimedOut(false);
+    setCaptureStalled(false);
+    setScanState({ type: UseSmileIDScanStateType.Initial });
+    setHasAnalyzedFrame(false);
+    // Frames banked before the abandoned session must not pad this one.
+    capturedEventsRef.current = [];
+    if (wasTerminal) {
+      // A timed-out native session is terminal — stream only after it resets,
+      // or the first retry frame re-reports Timeout and re-latches the error.
+      void props.analyzer
+        .reset()
+        .catch((error) => UseSmileIDCrashReporting.captureException(error))
+        .finally(() => {
+          if (!completedRef.current) setStreaming(true);
+        });
+    } else {
+      setStreaming(true);
+    }
+  }, [streaming, onStartCapture, props.analyzer]);
 
   const analyzer = props.analyzer;
   const onCaptureComplete = props.onCaptureComplete;
@@ -475,13 +511,14 @@ export function UseSmileIDCaptureScreen(props: UseSmileIDCaptureScreenProps) {
       if (captureStartedAtRef.current === null) {
         captureStartedAtRef.current = Date.now();
       }
-      const isUnsatisfied = result.state.type === ScanStateType.Unsatisfied;
+      const isUnsatisfied =
+        result.state.type === UseSmileIDScanStateType.Unsatisfied;
       if (isUnsatisfied && !wasUnsatisfiedRef.current) {
         captureRetriesRef.current += 1;
       }
       wasUnsatisfiedRef.current = isUnsatisfied;
 
-      if (result.state.type === ScanStateType.Unsatisfied) {
+      if (result.state.type === UseSmileIDScanStateType.Unsatisfied) {
         capturedEventsRef.current = [];
       } else if (result.capturedEvents.length > 0) {
         capturedEventsRef.current = [
@@ -507,8 +544,9 @@ export function UseSmileIDCaptureScreen(props: UseSmileIDCaptureScreenProps) {
 
       // Terminal states: finished → flush + complete; timeout → failure
       // without flushing (no captured artifacts to wait on).
-      if (result.state.type === ScanStateType.Finished) {
-        if (completedRef.current) return;
+      if (result.state.type === UseSmileIDScanStateType.Finished) {
+        // `timedOutRef` too: stopping the stream is async, so a frame queued before the timeout can still land here.
+        if (completedRef.current || timedOutRef.current) return;
         completedRef.current = true;
         setStreaming(false);
         // flush() waits for every emitted JPG to land on disk before we
@@ -524,10 +562,12 @@ export function UseSmileIDCaptureScreen(props: UseSmileIDCaptureScreenProps) {
             onDocumentOrigin?.(DocumentImageOrigin.CameraAutoCapture);
             onCaptureComplete?.(capturedEventsRef.current, captureTelemetry());
           });
-      } else if (result.state.type === ScanStateType.Timeout) {
-        if (completedRef.current) return;
-        completedRef.current = true;
+      } else if (result.state.type === UseSmileIDScanStateType.Timeout) {
+        if (completedRef.current || timedOutRef.current) return;
         setStreaming(false);
+        // The terminal state rides on `timedOutRef`, not the one-shot delivery gate, so the shutter and Start button stay usable.
+        timedOutRef.current = true;
+        setCaptureTimedOut(true);
         onCaptureTimeout?.(result.state);
       }
     },
@@ -549,7 +589,10 @@ export function UseSmileIDCaptureScreen(props: UseSmileIDCaptureScreenProps) {
     sessionEpoch,
   );
   const isInstructionState =
-    scanState.type === ScanStateType.Initial && !streaming;
+    scanState.type === UseSmileIDScanStateType.Initial && !streaming;
+  // A selfie timeout leaves `scanState` on Timeout, so the instruction predicate alone would hide the only way to retry.
+  const showStartButton =
+    (isInstructionState || captureTimedOut) && !isDocumentCapture;
   const canStart = !streaming && !completedRef.current;
 
   const previewReady = hasPermission && device != null;
@@ -564,6 +607,28 @@ export function UseSmileIDCaptureScreen(props: UseSmileIDCaptureScreenProps) {
     [analyzer.frameProcessorPluginName],
   );
 
+  // Every terminal signal arrives inside a frame result, so a camera that delivers no frame at all would sit on the initial state forever.
+  // Latest-ref, not a dep: an inline `onCaptureTimeout` prop is a fresh identity every render, which would restart the wall clock.
+  const onCaptureTimeoutRef = useRef(onCaptureTimeout);
+  onCaptureTimeoutRef.current = onCaptureTimeout;
+  useEffect(() => {
+    if (!streaming || hasAnalyzedFrame) return;
+    const timer = setTimeout(() => {
+      if (completedRef.current || timedOutRef.current) return;
+      timedOutRef.current = true;
+      setCaptureStalled(true);
+      setCaptureTimedOut(true);
+      setStreaming(false);
+      onCaptureTimeoutRef.current?.({ type: UseSmileIDScanStateType.Timeout });
+    }, CameraDefaults.firstFrameTimeoutMs);
+    return () => clearTimeout(timer);
+  }, [streaming, hasAnalyzedFrame]);
+
+  // A frame disproves the stall; document capture has no Start button to clear it by hand.
+  useEffect(() => {
+    if (hasAnalyzedFrame) setCaptureStalled(false);
+  }, [hasAnalyzedFrame]);
+
   // A missing plugin means no frame ever produces a result — report once
   // on capture start rather than sitting silently on the initial state.
   const pluginErrorReportedRef = useRef(false);
@@ -687,13 +752,18 @@ export function UseSmileIDCaptureScreen(props: UseSmileIDCaptureScreenProps) {
   // Document controls — live capture only (after Start). Manual shutter
   // follows the capture mode + fallback timer; gallery follows
   // allowGalleryUpload. Renderer also hides both during CAPTURING/PROCESSING.
+  // A timeout offers the shutter in every capture mode — it is the recovery
+  // affordance, so it outranks `captureMode` and survives `streaming` going
+  // false with the scan.
   const manualShutterAvailable =
     isDocumentCapture &&
-    streaming &&
-    (captureMode?.kind === "manualCapture" ||
-      (captureMode?.kind === "autoCaptureWithManualFallback" &&
-        manualShutterRevealed));
-  const galleryAvailable = isDocumentCapture && streaming && allowGalleryUpload;
+    (captureTimedOut ||
+      (streaming &&
+        (captureMode?.kind === "manualCapture" ||
+          (captureMode?.kind === "autoCaptureWithManualFallback" &&
+            manualShutterRevealed))));
+  const galleryAvailable =
+    isDocumentCapture && (streaming || captureTimedOut) && allowGalleryUpload;
 
   // Deps are scalar fields (mapCaptureUiState returns a fresh object per
   // render). captureProgress intentionally stays a separate per-frame prop.
@@ -704,10 +774,12 @@ export function UseSmileIDCaptureScreen(props: UseSmileIDCaptureScreenProps) {
       enableEnhancedLiveness,
       animationDirection: uiState.animationDirection,
       poseMatched: uiState.poseMatched,
-      // A transient gallery-import error preempts the live feedback chip.
-      feedbackKey: galleryErrorKey ?? settledFeedbackKey,
+      // A stalled camera, then a transient gallery-import error, preempt the live feedback chip.
+      feedbackKey: captureStalled
+        ? "si_capture_camera_unavailable"
+        : (galleryErrorKey ?? settledFeedbackKey),
       // Documents auto-start (no Start button); selfie keeps its.
-      showCaptureButton: isInstructionState && !isDocumentCapture,
+      showCaptureButton: showStartButton,
       showManualShutter: manualShutterAvailable,
       showGalleryUpload: galleryAvailable,
       isBackSide: documentSide === DocumentSide.Back,
@@ -726,7 +798,8 @@ export function UseSmileIDCaptureScreen(props: UseSmileIDCaptureScreenProps) {
       uiState.poseMatched,
       settledFeedbackKey,
       galleryErrorKey,
-      isInstructionState,
+      captureStalled,
+      showStartButton,
       isDocumentCapture,
       manualShutterAvailable,
       galleryAvailable,
@@ -806,8 +879,14 @@ export function UseSmileIDCaptureScreen(props: UseSmileIDCaptureScreenProps) {
     <UseSmileIDThemeProvider value={theme}>
       {/* Translucent status bar → full-bleed window so the oval's reference
           frame is the full screen (no-op on iOS). On-device-pending: residual
-          inset also depends on the host SafeAreaProvider config. */}
-      <StatusBar translucent backgroundColor="transparent" />
+          inset also depends on the host SafeAreaProvider config.
+          `dark-content` because the capture overlay draws a near-opaque white
+          scrim behind the status bar, whatever the host app's own bar style. */}
+      <StatusBar
+        translucent
+        backgroundColor="transparent"
+        barStyle="dark-content"
+      />
       <UseSmileIDCaptureContent
         state={contentState}
         captureProgress={uiState.captureProgress}

package/src/presentation/screen/use_smile_id_consent_screen.tsx

@@ -26,6 +26,7 @@ import { UseSmileIDLearnMoreContent } from "../components/use_smile_id_learn_mor
 import { UseSmileIDPartnerIcon } from "../components/use_smile_id_partner_icon";
 import { UseSmileIDRoundedCheckbox } from "../components/use_smile_id_rounded_checkbox";
 import { useUseSmileIDLocalizations } from "../../l10n/use_smile_id_localizations_provider";
+import { GlobalPrivacyControl } from "../../core/models/global_privacy_control";
 import { getDefaultConsentState, getDeviceLocale } from "../utils/locale_utils";
 import {
   buildConsentRows,
@@ -59,6 +60,12 @@ export type UseSmileIDConsentScreenProps = {
   readonly showAttribution?: boolean;
   readonly onAllow?: (info: ConsentInformation) => void;
   readonly onDeny?: () => void;
+  /**
+   * Partner-declared consent posture; seeds the checkbox's initial state
+   * via `getDefaultConsentState`. Defaults to the universal opt-out
+   * baseline (`GlobalPrivacyControl.OptOut`).
+   */
+  readonly globalPrivacyControl?: GlobalPrivacyControl;
   readonly theme?: UseSmileIDTheme;
   /**
    * Render the bottom-pinned Allow button via a partner-supplied
@@ -107,11 +114,15 @@ export function UseSmileIDConsentScreen(props: UseSmileIDConsentScreenProps) {
   const loc = useUseSmileIDLocalizations();
   const showAttribution = props.showAttribution ?? true;
 
-  // Locale-aware default: ticked outside the EU (`true`), unticked
-  // inside (`false`) to honour GDPR opt-in. `getDefaultConsentState()`
-  // reads the resolved BCP-47 locale and checks the country segment
-  // against the EU member-state set.
-  const [consented, setConsented] = useState(() => getDefaultConsentState());
+  const globalPrivacyControl =
+    props.globalPrivacyControl ?? GlobalPrivacyControl.OptOut;
+
+  // Posture-aware default: the opt-out baseline starts ticked everywhere;
+  // the legacy opt-in posture consults the resolved BCP-47 locale and
+  // starts unticked for EU member states (GDPR opt-in).
+  const [consented, setConsented] = useState(() =>
+    getDefaultConsentState(globalPrivacyControl),
+  );
   const [learnMoreOpen, setLearnMoreOpen] = useState(false);
 
   const subtitleParts = composeConsentSubtitleParts(props.partnerName, loc);

package/src/presentation/screen/use_smile_id_document_back_instructions.tsx

@@ -1,7 +1,8 @@
-import { Pressable, StyleSheet, Text, View } from "react-native";
+import { StyleSheet, Text, View } from "react-native";
 import { SafeAreaView } from "react-native-safe-area-context";
 import type { UseSmileIDTheme } from "../theme/theme";
 import { useUseSmileIDTheme } from "../theme/theme_context";
+import { UseSmileIDAttribution } from "../components/use_smile_id_attribution";
 import { UseSmileIDBackButton } from "../components/use_smile_id_back_button";
 import { UseSmileIDButton } from "../components/use_smile_id_button";
 import { UseSmileIDInstructionsHero } from "../components/use_smile_id_instructions_hero";
@@ -48,7 +49,7 @@ export function UseSmileIDDocumentBackInstructions(
         styles.root,
         {
           backgroundColor: theme.colors.background,
-          paddingHorizontal: theme.spacing.large,
+          paddingHorizontal: theme.spacing.medium,
           paddingVertical: theme.spacing.medium,
         },
       ]}
@@ -70,12 +71,15 @@ export function UseSmileIDDocumentBackInstructions(
           ...theme.typography.pageHeading,
           fontWeight: "800",
           color: theme.colors.titleText,
+          textAlign: "center",
         }}
         testID="si_document_back_instructions_title"
       >
         {localizations.siDocumentFlipTitle(props.documentTypeDisplayName)}
       </Text>
 
+      <View style={{ height: theme.spacing.medium }} />
+
       <View style={styles.hero} testID="si_document_back_instructions_hero">
         <UseSmileIDInstructionsHero
           source={heroSource}
@@ -98,24 +102,17 @@ export function UseSmileIDDocumentBackInstructions(
         {allowSkip ? (
           <>
             <View style={{ height: theme.spacing.small }} />
-            <Pressable
-              onPress={onSkip}
-              accessibilityRole="button"
+            <UseSmileIDButton
+              label={localizations.siDocumentSkipBack}
+              onClick={onSkip}
+              variant="secondary"
+              theme={theme}
               testID="si_document_skip_back_button"
-              style={styles.skip}
-            >
-              <Text
-                style={{
-                  ...theme.typography.button,
-                  color: theme.colors.primary,
-                  textAlign: "center",
-                }}
-              >
-                {localizations.siDocumentSkipBack}
-              </Text>
-            </Pressable>
+            />
           </>
         ) : null}
+        <View style={{ height: theme.spacing.small }} />
+        <UseSmileIDAttribution theme={theme} />
       </View>
     </SafeAreaView>
   );
@@ -125,10 +122,4 @@ const styles = StyleSheet.create({
   root: { flex: 1 },
   hero: { flex: 1 },
   bottom: { alignItems: "center" },
-  skip: {
-    height: 48,
-    alignItems: "center",
-    justifyContent: "center",
-    alignSelf: "stretch",
-  },
 });

package/src/presentation/screen/use_smile_id_document_preview_screen.tsx

@@ -47,7 +47,7 @@ export function UseSmileIDDocumentPreviewScreen(
       edges={["left", "right", "bottom"]}
       style={[
         styles.root,
-        { backgroundColor: theme.colors.captureReviewBackground },
+        { backgroundColor: theme.colors.background },
       ]}
       testID="si_document_preview_screen"
     >

package/src/presentation/screen/use_smile_id_preview_screen.tsx

@@ -1,4 +1,4 @@
-import { useState, type ReactNode } from "react";
+import { useState } from "react";
 import { StyleSheet, Text, View, type LayoutChangeEvent } from "react-native";
 import { SafeAreaView } from "react-native-safe-area-context";
 import type { UseSmileIDTheme } from "../theme/theme";
@@ -16,28 +16,13 @@ export type UseSmileIDPreviewScreenProps = {
   readonly showAttribution?: boolean;
   readonly onAccept?: () => void;
   readonly onReject?: () => void;
-  /**
-   * Render the Accept button via a partner-supplied slot.
-   *
-   * **Slot contract:** providing *any* slot (continue or cancel)
-   * replaces the *entire* default confirmation row. If you supply
-   * `continueButton` and want a Retake control too, supply
-   * `cancelButton` as well — the default Retake tile does not
-   * fall through.
-   */
-  readonly continueButton?: (props: { onClick: () => void }) => ReactNode;
-  /**
-   * Render the Reject (retake) button via a partner-supplied slot.
-   * See the slot contract note on `continueButton`.
-   */
-  readonly cancelButton?: (props: { onClick: () => void }) => ReactNode;
   readonly theme?: UseSmileIDTheme;
 };
 
 /**
  * Preview screen — confirms the captured selfie before submission.
  *
- *   - Uniform page (`captureReviewBackground`, theme-following) with the
+ *   - Uniform page (`background`, theme-following) with the
  *     captured image clipped to the face oval. The oval scales to the
  *     leftover height above the card so the two never overlap; no scrim
  *     is painted.
@@ -74,16 +59,12 @@ export function UseSmileIDPreviewScreen(props: UseSmileIDPreviewScreenProps) {
     if (state.canRetake) props.onReject?.();
   };
 
-  const customContinue = props.continueButton;
-  const customCancel = props.cancelButton;
-  const hasSlots = Boolean(customContinue || customCancel);
-
   return (
     <SafeAreaView
       edges={["left", "right", "bottom"]}
       style={[
         styles.root,
-        { backgroundColor: theme.colors.captureReviewBackground },
+        { backgroundColor: theme.colors.background },
       ]}
       testID="si_preview_screen"
       onLayout={onScreenLayout}
@@ -122,23 +103,16 @@ export function UseSmileIDPreviewScreen(props: UseSmileIDPreviewScreenProps) {
           {loc.siPreviewSubtitle}
         </Text>
         <View style={{ marginTop: theme.spacing.medium }}>
-          {hasSlots ? (
-            <View style={styles.buttonRow}>
-              {customCancel ? customCancel({ onClick: handleReject }) : null}
-              {customContinue
-                ? customContinue({ onClick: handleAccept })
-                : null}
-            </View>
-          ) : (
-            <UseSmileIDConfirmationButtons
-              onAccept={handleAccept}
-              onReject={handleReject}
-              acceptLabel={loc.siPreviewConfirm}
-              rejectLabel={loc.siPreviewRetake}
-              theme={theme}
-              testID="si_preview_confirmation_buttons"
-            />
-          )}
+          {/* The confirm/retake buttons are the fixed icon pair and are not
+              customisable. */}
+          <UseSmileIDConfirmationButtons
+            onAccept={handleAccept}
+            onReject={handleReject}
+            acceptLabel={loc.siPreviewConfirm}
+            rejectLabel={loc.siPreviewRetake}
+            theme={theme}
+            testID="si_preview_confirmation_buttons"
+          />
         </View>
       </UseSmileIDCardSurface>
 
@@ -150,10 +124,4 @@ export function UseSmileIDPreviewScreen(props: UseSmileIDPreviewScreenProps) {
 const styles = StyleSheet.create({
   root: { flex: 1, overflow: "hidden" },
   card: { alignItems: "center" },
-  buttonRow: {
-    flexDirection: "row",
-    alignSelf: "stretch",
-    justifyContent: "space-between",
-    alignItems: "center",
-  },
 });

package/src/presentation/screen/use_smile_id_processing_screen.tsx

@@ -110,7 +110,7 @@ export function UseSmileIDProcessingScreen(
     <SafeAreaView
       style={[
         styles.root,
-        { backgroundColor: theme.colors.captureReviewBackground },
+        { backgroundColor: theme.colors.background },
       ]}
       testID="si_processing_screen"
       onLayout={onScreenLayout}