@smileid/usesmileid 12.0.0-beta01 → 12.0.0

package/dist/presentation/components/use_smile_id_document_capture_controls.js

@@ -1,22 +1,42 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Pressable, StyleSheet, View } from "react-native";
+import { SafeAreaView } from "react-native-safe-area-context";
 import { defaultLightTheme } from "../theme/theme";
-import { SiGallery } from "./icons";
-import { UseSmileIDCaptureSpinner } from "./use_smile_id_capture_spinner";
-const SHUTTER_SIZE = 72;
-const SHUTTER_INNER_SIZE = 56;
-const GALLERY_SIZE = 52;
-const CONTROL_GAP = 20;
+import { SiGallery, SiOutlineClose } from "./icons";
+const SHUTTER_SIZE = 64;
+const SHUTTER_INNER_SIZE = 46;
+const GALLERY_SIZE = 56;
+const CONTROL_GAP = 24;
+const CLOSE_SIZE = 40;
+/** Trailing-edge inset for the landscape lane (spacing.large). */
+const LANE_EDGE = 24;
+/** Bottom inset for the portrait control row above the safe area (spacing.large). */
+const PORTRAIT_ROW_BOTTOM = 24;
+/** Top/bottom inset bounding the ✕ and the centred controls inside the lane. */
+const LANE_VERTICAL_PADDING = 16;
 /**
- * Document capture controls — manual shutter + gallery upload, a trailing-edge
- * column in landscape and a centred bottom row in portrait (matches the capture design).
+ * Document capture controls — manual shutter + gallery upload, plus the close ✕
+ * in landscape (laid out as a trailing-edge lane; portrait is a centred bottom
+ * row with the ✕ in the top chrome).
  */
 export function UseSmileIDDocumentCaptureControls(props) {
     // Light-palette forced: overlay is locked to light mode so brand-blue reads over the dim feed.
     const theme = defaultLightTheme;
-    if (!props.capturing && !props.showManualShutter && !props.showGallery) {
+    const controlsVisible = props.showManualShutter || props.showGallery;
+    // The lane keeps the ✕ even when shutter/gallery hide (during capture); portrait
+    // renders nothing here once the controls are hidden.
+    const showCloseInLane = props.isLandscape && props.onClose !== undefined;
+    if (!controlsVisible && !showCloseInLane) {
         return null;
     }
+    const closeButton = props.onClose ? (_jsx(Pressable, { onPress: props.onClose, accessibilityRole: "button", accessibilityLabel: props.closeAccessibilityLabel, testID: "si_document_close_button", style: ({ pressed }) => [
+            styles.closeButton,
+            {
+                backgroundColor: theme.colors.offBlack,
+                borderColor: theme.colors.backButtonBorder,
+                opacity: pressed ? 0.7 : 1,
+            },
+        ], children: _jsx(SiOutlineClose, { size: 20, color: theme.colors.offWhite }) })) : null;
     const shutter = props.showManualShutter ? (_jsx(Pressable, { onPress: props.onManualShutter, disabled: !props.enabled, accessibilityRole: "button", accessibilityLabel: props.shutterAccessibilityLabel, accessibilityState: { disabled: !props.enabled }, testID: "si_document_manual_shutter", style: ({ pressed }) => [
             styles.shutterOuter,
             { opacity: pressed || !props.enabled ? 0.6 : 1 },
@@ -28,34 +48,57 @@ export function UseSmileIDDocumentCaptureControls(props) {
                 opacity: pressed || !props.enabled ? 0.6 : 1,
             },
         ], children: _jsx(SiGallery, { size: 24, color: theme.colors.primaryForeground }) })) : null;
-    return (_jsx(View, { style: props.isLandscape ? styles.landscapeColumn : styles.portraitRow, pointerEvents: "box-none", testID: "si_document_capture_controls", children: props.capturing ? (_jsx(UseSmileIDCaptureSpinner, { color: theme.colors.ovalActive, testID: "si_document_capture_spinner" })) : props.isLandscape ? (_jsxs(_Fragment, { children: [shutter, gallery] })) : (_jsxs(_Fragment, { children: [gallery, shutter] })) }));
+    if (props.isLandscape) {
+        // Trailing-edge lane: ✕ at the top, shutter/gallery vertically centred
+        // between two flex spacers so the controls hold the lane's vertical centre.
+        return (_jsxs(SafeAreaView, { edges: ["top", "right", "bottom", "left"], style: styles.landscapeLane, pointerEvents: "box-none", testID: "si_document_capture_controls", children: [_jsx(View, { style: styles.laneSlot, children: closeButton }), _jsx(View, { style: styles.laneSpacer }), controlsVisible ? (_jsxs(View, { style: styles.landscapeControls, children: [shutter, gallery] })) : null, _jsx(View, { style: styles.laneSpacer })] }));
+    }
+    // Portrait: centred bottom row (gallery left of shutter).
+    return (_jsxs(SafeAreaView, { edges: ["top", "right", "bottom", "left"], style: styles.portraitRow, pointerEvents: "box-none", testID: "si_document_capture_controls", children: [gallery, shutter] }));
 }
 const styles = StyleSheet.create({
-    landscapeColumn: {
+    // No fixed width: the lane sizes to its (≤ SHUTTER_SIZE-wide) content so the
+    // additive horizontal safe-area inset SHIFTS it inward instead of squeezing the
+    // controls (RN is border-box; padding inside a fixed width would clip them).
+    landscapeLane: {
         position: "absolute",
         top: 0,
         bottom: 0,
-        end: 24,
+        end: LANE_EDGE,
+        flexDirection: "column",
+        alignItems: "center",
+        paddingVertical: LANE_VERTICAL_PADDING,
+    },
+    laneSpacer: { flex: 1 },
+    laneSlot: { width: SHUTTER_SIZE, alignItems: "center" },
+    landscapeControls: {
         flexDirection: "column",
         alignItems: "center",
-        justifyContent: "center",
         gap: CONTROL_GAP,
     },
     portraitRow: {
         position: "absolute",
         start: 0,
         end: 0,
-        bottom: 96,
+        bottom: PORTRAIT_ROW_BOTTOM,
         flexDirection: "row",
         alignItems: "center",
         justifyContent: "center",
         gap: CONTROL_GAP * 1.6,
     },
+    closeButton: {
+        width: CLOSE_SIZE,
+        height: CLOSE_SIZE,
+        borderRadius: CLOSE_SIZE / 2,
+        borderWidth: 1,
+        alignItems: "center",
+        justifyContent: "center",
+    },
     shutterOuter: {
         width: SHUTTER_SIZE,
         height: SHUTTER_SIZE,
         borderRadius: SHUTTER_SIZE / 2,
-        borderWidth: 3,
+        borderWidth: 4,
         borderColor: "#FFFFFF",
         alignItems: "center",
         justifyContent: "center",

package/dist/presentation/components/use_smile_id_document_capture_controls.js.map

@@ -1 +1 @@
-{"version":3,"file":"use_smile_id_document_capture_controls.js","sourceRoot":"","sources":["../../../src/presentation/components/use_smile_id_document_capture_controls.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"use_smile_id_document_capture_controls.js","sourceRoot":"","sources":["../../../src/presentation/components/use_smile_id_document_capture_controls.tsx"],"names":[],"mappings":"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"}

package/dist/presentation/components/use_smile_id_document_overlay.d.ts

@@ -1,11 +1,16 @@
 import type { UseSmileIDTheme } from "../theme/theme";
 import { type UseSmileIDOverlayState as OverlayState } from "../state/use_smile_id_overlay_state";
+import type { DocumentType } from "../../core/models/document_type";
 export type UseSmileIDDocumentOverlayProps = {
     readonly state: OverlayState;
     readonly containerWidth: number;
     readonly containerHeight: number;
     /** Optional aspect ratio hint — e.g. CR-80 ID card = 1.586. */
     readonly knownIdAspectRatio?: number;
+    /** Document type — selects the in-frame shimmer skeleton. */
+    readonly documentTypeKind?: DocumentType["kind"];
+    /** Generic-document back side — swaps the front skeleton for the back. */
+    readonly isBackSide?: boolean;
     /**
      * Coaching copy shown in the dark pill below the frame. Rendered here so it
      * tracks the frame geometry instead of a fixed screen offset.
@@ -14,12 +19,24 @@ export type UseSmileIDDocumentOverlayProps = {
     readonly testID?: string;
     readonly theme?: UseSmileIDTheme;
 };
+/** Default document aspect (CR-80 ID-1 card) when no known ratio is supplied. */
+export declare const DEFAULT_DOCUMENT_ASPECT = 1.586;
 /**
- * Document capture frame — two-layer dim (faint full-feed tint + darker surround
- * outside the cutout, ~0.15 inside / ~0.49 outside) plus a border that flips to
- * `ovalActive` on `DOCUMENT_READY`. The cutout is one even-odd path, NOT a `<Mask>`:
- * masks rasterize the full-screen layer to a bitmap on the UI thread per invalidation,
- * freezing the camera preview. Respects `knownIdAspectRatio`; the frame stays centred.
+ * Centred document guide rectangle (container px) for a document [aspect] and
+ * viewport. Single source of truth shared by the overlay (draws the frame) and
+ * the capture screen (derives the native crop region), so the saved capture
+ * matches the frame the user saw.
+ */
+export declare function documentGuideRect(aspect: number, containerWidth: number, containerHeight: number): {
+    readonly left: number;
+    readonly top: number;
+    readonly width: number;
+    readonly height: number;
+};
+/**
+ * Document capture frame — two-layer dim + a border that flips to `ovalActive`
+ * on `DOCUMENT_READY`. The cutout is one even-odd path, NOT a `<Mask>` (masks
+ * rasterize the full-screen layer per invalidation, freezing the preview).
  */
 export declare function UseSmileIDDocumentOverlay(props: UseSmileIDDocumentOverlayProps): import("react").JSX.Element | null;
 //# sourceMappingURL=use_smile_id_document_overlay.d.ts.map

package/dist/presentation/components/use_smile_id_document_overlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use_smile_id_document_overlay.d.ts","sourceRoot":"","sources":["../../../src/presentation/components/use_smile_id_document_overlay.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEtD,OAAO,EAEL,KAAK,sBAAsB,IAAI,YAAY,EAC5C,MAAM,qCAAqC,CAAC;AAG7C,MAAM,MAAM,8BAA8B,GAAG;IAC3C,QAAQ,CAAC,KAAK,EAAE,YAAY,CAAC;IAC7B,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAChC,QAAQ,CAAC,eAAe,EAAE,MAAM,CAAC;IACjC,+DAA+D;IAC/D,QAAQ,CAAC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IACrC;;;OAGG;IACH,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAC/B,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,KAAK,CAAC,EAAE,eAAe,CAAC;CAClC,CAAC;AAuBF;;;;;;GAMG;AACH,wBAAgB,yBAAyB,CACvC,KAAK,EAAE,8BAA8B,sCAsHtC"}
+{"version":3,"file":"use_smile_id_document_overlay.d.ts","sourceRoot":"","sources":["../../../src/presentation/components/use_smile_id_document_overlay.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEtD,OAAO,EAEL,KAAK,sBAAsB,IAAI,YAAY,EAC5C,MAAM,qCAAqC,CAAC;AAC7C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAKpE,MAAM,MAAM,8BAA8B,GAAG;IAC3C,QAAQ,CAAC,KAAK,EAAE,YAAY,CAAC;IAC7B,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAChC,QAAQ,CAAC,eAAe,EAAE,MAAM,CAAC;IACjC,+DAA+D;IAC/D,QAAQ,CAAC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IACrC,6DAA6D;IAC7D,QAAQ,CAAC,gBAAgB,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IACjD,0EAA0E;IAC1E,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAC/B,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,KAAK,CAAC,EAAE,eAAe,CAAC;CAClC,CAAC;AAqBF,iFAAiF;AACjF,eAAO,MAAM,uBAAuB,QAAQ,CAAC;AAE7C;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAC/B,MAAM,EAAE,MAAM,EACd,cAAc,EAAE,MAAM,EACtB,eAAe,EAAE,MAAM,GACtB;IACD,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;CACzB,CAcA;AASD;;;;GAIG;AACH,wBAAgB,yBAAyB,CACvC,KAAK,EAAE,8BAA8B,sCAmKtC"}

package/dist/presentation/components/use_smile_id_document_overlay.js

@@ -1,53 +1,78 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { memo } from "react";
 import { StyleSheet, Text, View } from "react-native";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
 import Svg, { Path } from "react-native-svg";
 import { useUseSmileIDTheme } from "../theme/theme_context";
 import { isDocumentCaptureActive, } from "../state/use_smile_id_overlay_state";
-import { UseSmileIDDocumentFrameGlyph } from "./use_smile_id_document_frame_glyph";
+import { UseSmileIDOvalBorderPalette } from "./use_smile_id_oval_border_palette";
+import { UseSmileIDDocumentShimmer } from "./use_smile_id_document_shimmer";
+import { UseSmileIDCaptureSpinner } from "./use_smile_id_capture_spinner";
 /** Gap between the frame's bottom edge and the coaching pill (Figma: 16dp). */
 const CHIP_TOP_GAP = 16;
 /**
- * Fraction of the container width the document frame spans, per orientation.
- * Matches the Figma capture frames: landscape ID-1 card ≈ 0.53 of the (wide)
- * screen; portrait booklet / passport ≈ 0.68 of the (narrow) screen.
+ * Frame spans ≤71% of container width, height capped at 61% (re-deriving width
+ * from aspect when the cap bites — keeps a wide ID-1 card from overflowing in
+ * landscape). One ratio pair drives both orientations.
  */
-const FRAME_WIDTH_FRACTION_LANDSCAPE = 0.53;
-const FRAME_WIDTH_FRACTION_PORTRAIT = 0.68;
+const FRAME_MAX_WIDTH_RATIO = 0.71;
+const FRAME_MAX_HEIGHT_RATIO = 0.61;
 /** Frame corner radius (matches the bordered frame's `borderRadius`). */
-const FRAME_CORNER_RADIUS = 8;
+const FRAME_CORNER_RADIUS = 16;
+/** Guide-rect border thickness; drawn straddling the frame edge (centred stroke, matching the other SDKs). */
+const FRAME_BORDER_WIDTH = 4;
+/** Capture-progress spinner shown beside the frame (landscape) or bottom-centre (portrait). */
+const SPINNER_SIZE = 48;
+/** Portrait spinner gap above the safe-area bottom (spacing.large) — matches the shutter row. */
+const PORTRAIT_SPINNER_BOTTOM_GAP = 24;
+/** Default document aspect (CR-80 ID-1 card) when no known ratio is supplied. */
+export const DEFAULT_DOCUMENT_ASPECT = 1.586;
 /**
- * Faint black tint over the WHOLE live feed (net ~0.15 inside the frame). A
- * component constant, not a theme colour — the surround dim (`documentOverlayScrim`)
- * is the partner-overridable layer.
+ * Centred document guide rectangle (container px) for a document [aspect] and
+ * viewport. Single source of truth shared by the overlay (draws the frame) and
+ * the capture screen (derives the native crop region), so the saved capture
+ * matches the frame the user saw.
+ */
+export function documentGuideRect(aspect, containerWidth, containerHeight) {
+    let width = containerWidth * FRAME_MAX_WIDTH_RATIO;
+    let height = width / aspect;
+    const maxHeight = containerHeight * FRAME_MAX_HEIGHT_RATIO;
+    if (height > maxHeight) {
+        height = maxHeight;
+        width = height * aspect;
+    }
+    return {
+        left: (containerWidth - width) / 2,
+        top: (containerHeight - height) / 2,
+        width,
+        height,
+    };
+}
+/**
+ * Faint black tint over the whole live feed (~0.15 inside the frame). Component
+ * constant, not a theme colour — the surround dim is the overridable layer.
  */
 const DOCUMENT_CAMERA_TINT = "#00000026"; // black @15%
 /** Fallback surround dim when the theme omits `documentOverlayScrim`. */
 const DEFAULT_DOCUMENT_OVERLAY_SCRIM = "#00000066"; // black @40%
 /**
- * Document capture frame — two-layer dim (faint full-feed tint + darker surround
- * outside the cutout, ~0.15 inside / ~0.49 outside) plus a border that flips to
- * `ovalActive` on `DOCUMENT_READY`. The cutout is one even-odd path, NOT a `<Mask>`:
- * masks rasterize the full-screen layer to a bitmap on the UI thread per invalidation,
- * freezing the camera preview. Respects `knownIdAspectRatio`; the frame stays centred.
+ * Document capture frame — two-layer dim + a border that flips to `ovalActive`
+ * on `DOCUMENT_READY`. The cutout is one even-odd path, NOT a `<Mask>` (masks
+ * rasterize the full-screen layer per invalidation, freezing the preview).
  */
 export function UseSmileIDDocumentOverlay(props) {
     const themeFromContext = useUseSmileIDTheme();
     const theme = props.theme ?? themeFromContext;
-    const aspect = props.knownIdAspectRatio ?? 1.586;
-    const isLandscapeFrame = aspect >= 1;
-    const frameWidth = props.containerWidth *
-        (isLandscapeFrame
-            ? FRAME_WIDTH_FRACTION_LANDSCAPE
-            : FRAME_WIDTH_FRACTION_PORTRAIT);
-    const frameHeight = frameWidth / aspect;
-    const left = (props.containerWidth - frameWidth) / 2;
-    const top = (props.containerHeight - frameHeight) / 2;
-    // Two-state border: neutral light while idle/positioning, green once committing.
+    const insets = useSafeAreaInsets();
+    const aspect = props.knownIdAspectRatio ?? DEFAULT_DOCUMENT_ASPECT;
+    const isPortrait = aspect < 1;
+    const { left, top, width: frameWidth, height: frameHeight, } = documentGuideRect(aspect, props.containerWidth, props.containerHeight);
+    // Three-state border, shared with the selfie oval (UseSmileIDOvalBorderPalette):
+    // green once the document is correctly framed (ready / capturing / processing),
+    // red while detected but mispositioned (too far / close / off-centre / not
+    // steady), neutral while idle.
     const captureActive = isDocumentCaptureActive(props.state);
-    const borderColor = captureActive
-        ? theme.colors.ovalActive
-        : theme.colors.stroke;
+    const borderColor = theme.colors[UseSmileIDOvalBorderPalette.tokenFor(props.state, false)];
     const surroundColor = theme.colors.documentOverlayScrim ?? DEFAULT_DOCUMENT_OVERLAY_SCRIM;
     if (props.containerWidth <= 0 || props.containerHeight <= 0) {
         return null;
@@ -56,21 +81,36 @@ export function UseSmileIDDocumentOverlay(props) {
                     StyleSheet.absoluteFill,
                     { backgroundColor: DOCUMENT_CAMERA_TINT },
                 ] }), _jsx(DocumentScrimSurround, { containerWidth: props.containerWidth, containerHeight: props.containerHeight, frameLeft: left, frameTop: top, frameWidth: frameWidth, frameHeight: frameHeight, cornerRadius: FRAME_CORNER_RADIUS, color: surroundColor }), !captureActive ? (_jsx(View, { style: {
+                    // Inset 10% per axis so the shimmer guide never touches the frame edge.
                     position: "absolute",
-                    left,
-                    top,
-                    width: frameWidth,
-                    height: frameHeight,
-                }, pointerEvents: "none", children: _jsx(UseSmileIDDocumentFrameGlyph, { width: frameWidth, height: frameHeight, isLandscape: isLandscapeFrame }) })) : null, _jsx(View, { style: {
+                    left: left + frameWidth * 0.1,
+                    top: top + frameHeight * 0.1,
+                    width: frameWidth * 0.8,
+                    height: frameHeight * 0.8,
+                }, pointerEvents: "none", children: _jsx(UseSmileIDDocumentShimmer, { width: frameWidth * 0.8, height: frameHeight * 0.8, isBackSide: props.isBackSide ?? false, ...(props.documentTypeKind !== undefined
+                        ? { documentTypeKind: props.documentTypeKind }
+                        : {}) }) })) : null, _jsx(View, { style: {
                     position: "absolute",
-                    left,
-                    top,
-                    width: frameWidth,
-                    height: frameHeight,
-                    borderWidth: 1.5,
-                    borderRadius: FRAME_CORNER_RADIUS,
+                    left: left - FRAME_BORDER_WIDTH / 2,
+                    top: top - FRAME_BORDER_WIDTH / 2,
+                    width: frameWidth + FRAME_BORDER_WIDTH,
+                    height: frameHeight + FRAME_BORDER_WIDTH,
+                    borderWidth: FRAME_BORDER_WIDTH,
+                    borderRadius: FRAME_CORNER_RADIUS + FRAME_BORDER_WIDTH / 2,
                     borderColor,
-                } }), props.feedbackText ? (_jsx(View, { style: {
+                } }), captureActive ? (isPortrait ? (_jsx(View, { style: {
+                    position: "absolute",
+                    left: 0,
+                    right: 0,
+                    bottom: insets.bottom + PORTRAIT_SPINNER_BOTTOM_GAP,
+                    alignItems: "center",
+                }, pointerEvents: "none", children: _jsx(UseSmileIDCaptureSpinner, { size: SPINNER_SIZE, color: theme.colors.ovalActive, testID: "si_document_capture_spinner" }) })) : (_jsx(View, { style: {
+                    position: "absolute",
+                    left: left +
+                        frameWidth +
+                        (props.containerWidth - (left + frameWidth) - SPINNER_SIZE) / 2,
+                    top: top + (frameHeight - SPINNER_SIZE) / 2,
+                }, pointerEvents: "none", children: _jsx(UseSmileIDCaptureSpinner, { size: SPINNER_SIZE, color: theme.colors.ovalActive, testID: "si_document_capture_spinner" }) }))) : null, props.feedbackText ? (_jsx(View, { style: {
                     position: "absolute",
                     top: top + frameHeight + CHIP_TOP_GAP,
                     start: 0,

package/dist/presentation/components/use_smile_id_document_overlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"use_smile_id_document_overlay.js","sourceRoot":"","sources":["../../../src/presentation/components/use_smile_id_document_overlay.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"use_smile_id_document_overlay.js","sourceRoot":"","sources":["../../../src/presentation/components/use_smile_id_document_overlay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAC7B,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,GAAG,EAAE,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAE7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EACL,uBAAuB,GAExB,MAAM,qCAAqC,CAAC;AAE7C,OAAO,EAAE,2BAA2B,EAAE,MAAM,oCAAoC,CAAC;AACjF,OAAO,EAAE,yBAAyB,EAAE,MAAM,iCAAiC,CAAC;AAC5E,OAAO,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAqB1E,+EAA+E;AAC/E,MAAM,YAAY,GAAG,EAAE,CAAC;AAExB;;;;GAIG;AACH,MAAM,qBAAqB,GAAG,IAAI,CAAC;AACnC,MAAM,sBAAsB,GAAG,IAAI,CAAC;AACpC,yEAAyE;AACzE,MAAM,mBAAmB,GAAG,EAAE,CAAC;AAC/B,8GAA8G;AAC9G,MAAM,kBAAkB,GAAG,CAAC,CAAC;AAC7B,+FAA+F;AAC/F,MAAM,YAAY,GAAG,EAAE,CAAC;AACxB,iGAAiG;AACjG,MAAM,2BAA2B,GAAG,EAAE,CAAC;AAEvC,iFAAiF;AACjF,MAAM,CAAC,MAAM,uBAAuB,GAAG,KAAK,CAAC;AAE7C;;;;;GAKG;AACH,MAAM,UAAU,iBAAiB,CAC/B,MAAc,EACd,cAAsB,EACtB,eAAuB;IAOvB,IAAI,KAAK,GAAG,cAAc,GAAG,qBAAqB,CAAC;IACnD,IAAI,MAAM,GAAG,KAAK,GAAG,MAAM,CAAC;IAC5B,MAAM,SAAS,GAAG,eAAe,GAAG,sBAAsB,CAAC;IAC3D,IAAI,MAAM,GAAG,SAAS,EAAE,CAAC;QACvB,MAAM,GAAG,SAAS,CAAC;QACnB,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;IAC1B,CAAC;IACD,OAAO;QACL,IAAI,EAAE,CAAC,cAAc,GAAG,KAAK,CAAC,GAAG,CAAC;QAClC,GAAG,EAAE,CAAC,eAAe,GAAG,MAAM,CAAC,GAAG,CAAC;QACnC,KAAK;QACL,MAAM;KACP,CAAC;AACJ,CAAC;AACD;;;GAGG;AACH,MAAM,oBAAoB,GAAG,WAAW,CAAC,CAAC,aAAa;AACvD,yEAAyE;AACzE,MAAM,8BAA8B,GAAG,WAAW,CAAC,CAAC,aAAa;AAEjE;;;;GAIG;AACH,MAAM,UAAU,yBAAyB,CACvC,KAAqC;IAErC,MAAM,gBAAgB,GAAG,kBAAkB,EAAE,CAAC;IAC9C,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,IAAI,gBAAgB,CAAC;IAC9C,MAAM,MAAM,GAAG,iBAAiB,EAAE,CAAC;IACnC,MAAM,MAAM,GAAG,KAAK,CAAC,kBAAkB,IAAI,uBAAuB,CAAC;IACnE,MAAM,UAAU,GAAG,MAAM,GAAG,CAAC,CAAC;IAC9B,MAAM,EACJ,IAAI,EACJ,GAAG,EACH,KAAK,EAAE,UAAU,EACjB,MAAM,EAAE,WAAW,GACpB,GAAG,iBAAiB,CAAC,MAAM,EAAE,KAAK,CAAC,cAAc,EAAE,KAAK,CAAC,eAAe,CAAC,CAAC;IAC3E,iFAAiF;IACjF,gFAAgF;IAChF,2EAA2E;IAC3E,+BAA+B;IAC/B,MAAM,aAAa,GAAG,uBAAuB,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAC3D,MAAM,WAAW,GACf,KAAK,CAAC,MAAM,CAAC,2BAA2B,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC;IACzE,MAAM,aAAa,GACjB,KAAK,CAAC,MAAM,CAAC,oBAAoB,IAAI,8BAA8B,CAAC;IAEtE,IAAI,KAAK,CAAC,cAAc,IAAI,CAAC,IAAI,KAAK,CAAC,eAAe,IAAI,CAAC,EAAE,CAAC;QAC5D,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,MAAC,IAAI,IACH,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,KAAK,EAAE,UAAU,CAAC,YAAY,EAC9B,aAAa,EAAC,MAAM,aAGpB,KAAC,IAAI,IACH,KAAK,EAAE;oBACL,UAAU,CAAC,YAAY;oBACvB,EAAE,eAAe,EAAE,oBAAoB,EAAE;iBAC1C,GACD,EAGF,KAAC,qBAAqB,IACpB,cAAc,EAAE,KAAK,CAAC,cAAc,EACpC,eAAe,EAAE,KAAK,CAAC,eAAe,EACtC,SAAS,EAAE,IAAI,EACf,QAAQ,EAAE,GAAG,EACb,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,mBAAmB,EACjC,KAAK,EAAE,aAAa,GACpB,EAED,CAAC,aAAa,CAAC,CAAC,CAAC,CAChB,KAAC,IAAI,IACH,KAAK,EAAE;oBACL,wEAAwE;oBACxE,QAAQ,EAAE,UAAU;oBACpB,IAAI,EAAE,IAAI,GAAG,UAAU,GAAG,GAAG;oBAC7B,GAAG,EAAE,GAAG,GAAG,WAAW,GAAG,GAAG;oBAC5B,KAAK,EAAE,UAAU,GAAG,GAAG;oBACvB,MAAM,EAAE,WAAW,GAAG,GAAG;iBAC1B,EACD,aAAa,EAAC,MAAM,YAEpB,KAAC,yBAAyB,IACxB,KAAK,EAAE,UAAU,GAAG,GAAG,EACvB,MAAM,EAAE,WAAW,GAAG,GAAG,EACzB,UAAU,EAAE,KAAK,CAAC,UAAU,IAAI,KAAK,KACjC,CAAC,KAAK,CAAC,gBAAgB,KAAK,SAAS;wBACvC,CAAC,CAAC,EAAE,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,EAAE;wBAC9C,CAAC,CAAC,EAAE,CAAC,GACP,GACG,CACR,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,IAAI,IACH,KAAK,EAAE;oBACL,QAAQ,EAAE,UAAU;oBACpB,IAAI,EAAE,IAAI,GAAG,kBAAkB,GAAG,CAAC;oBACnC,GAAG,EAAE,GAAG,GAAG,kBAAkB,GAAG,CAAC;oBACjC,KAAK,EAAE,UAAU,GAAG,kBAAkB;oBACtC,MAAM,EAAE,WAAW,GAAG,kBAAkB;oBACxC,WAAW,EAAE,kBAAkB;oBAC/B,YAAY,EAAE,mBAAmB,GAAG,kBAAkB,GAAG,CAAC;oBAC1D,WAAW;iBACZ,GACD,EAGD,aAAa,CAAC,CAAC,CAAC,CACf,UAAU,CAAC,CAAC,CAAC,CACX,KAAC,IAAI,IACH,KAAK,EAAE;oBACL,QAAQ,EAAE,UAAU;oBACpB,IAAI,EAAE,CAAC;oBACP,KAAK,EAAE,CAAC;oBACR,MAAM,EAAE,MAAM,CAAC,MAAM,GAAG,2BAA2B;oBACnD,UAAU,EAAE,QAAQ;iBACrB,EACD,aAAa,EAAC,MAAM,YAEpB,KAAC,wBAAwB,IACvB,IAAI,EAAE,YAAY,EAClB,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,UAAU,EAC9B,MAAM,EAAC,6BAA6B,GACpC,GACG,CACR,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IACH,KAAK,EAAE;oBACL,QAAQ,EAAE,UAAU;oBACpB,IAAI,EACF,IAAI;wBACJ,UAAU;wBACV,CAAC,KAAK,CAAC,cAAc,GAAG,CAAC,IAAI,GAAG,UAAU,CAAC,GAAG,YAAY,CAAC,GAAG,CAAC;oBACjE,GAAG,EAAE,GAAG,GAAG,CAAC,WAAW,GAAG,YAAY,CAAC,GAAG,CAAC;iBAC5C,EACD,aAAa,EAAC,MAAM,YAEpB,KAAC,wBAAwB,IACvB,IAAI,EAAE,YAAY,EAClB,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,UAAU,EAC9B,MAAM,EAAC,6BAA6B,GACpC,GACG,CACR,CACF,CAAC,CAAC,CAAC,IAAI,EAEP,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,CACpB,KAAC,IAAI,IACH,KAAK,EAAE;oBACL,QAAQ,EAAE,UAAU;oBACpB,GAAG,EAAE,GAAG,GAAG,WAAW,GAAG,YAAY;oBACrC,KAAK,EAAE,CAAC;oBACR,GAAG,EAAE,CAAC;oBACN,UAAU,EAAE,QAAQ;iBACrB,EACD,aAAa,EAAC,MAAM,YAEpB,KAAC,IAAI,IACH,KAAK,EAAE;wBACL,QAAQ,EAAE,KAAK;wBACf,YAAY,EAAE,CAAC;wBACf,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,QAAQ;wBACtC,iBAAiB,EAAE,KAAK,CAAC,OAAO,CAAC,MAAM;wBACvC,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK;qBACrC,YAED,KAAC,IAAI,IACH,KAAK,EAAE;4BACL,GAAG,KAAK,CAAC,UAAU,CAAC,SAAS;4BAC7B,KAAK,EAAE,SAAS;4BAChB,SAAS,EAAE,QAAQ;yBACpB,EACD,MAAM,EAAC,2BAA2B,YAEjC,KAAK,CAAC,YAAY,GACd,GACF,GACF,CACR,CAAC,CAAC,CAAC,IAAI,IACH,CACR,CAAC;AACJ,CAAC;AAED;;;GAGG;AACH,MAAM,qBAAqB,GAAG,IAAI,CAAC,SAAS,qBAAqB,CAAC,KASjE;IACC,MAAM,EACJ,cAAc,EACd,eAAe,EACf,SAAS,EACT,QAAQ,EACR,UAAU,EACV,WAAW,EACX,YAAY,EACZ,KAAK,GACN,GAAG,KAAK,CAAC;IACV,2EAA2E;IAC3E,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE,UAAU,GAAG,CAAC,EAAE,WAAW,GAAG,CAAC,CAAC,CAAC;IACvE,MAAM,SAAS,GAAG,QAAQ,cAAc,IAAI,eAAe,KAAK,CAAC;IACjE,MAAM,UAAU,GAAG,eAAe,CAChC,SAAS,EACT,QAAQ,EACR,UAAU,EACV,WAAW,EACX,MAAM,CACP,CAAC;IACF,OAAO,CACL,KAAC,GAAG,IACF,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAE,OAAO,cAAc,IAAI,eAAe,EAAE,EACnD,mBAAmB,EAAC,MAAM,EAC1B,KAAK,EAAE,UAAU,CAAC,YAAY,YAE9B,KAAC,IAAI,IAAC,CAAC,EAAE,GAAG,SAAS,IAAI,UAAU,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAC,SAAS,GAAG,GACrE,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,yEAAyE;AACzE,SAAS,eAAe,CACtB,CAAS,EACT,CAAS,EACT,KAAa,EACb,MAAc,EACd,CAAS;IAET,MAAM,KAAK,GAAG,CAAC,GAAG,KAAK,CAAC;IACxB,MAAM,MAAM,GAAG,CAAC,GAAG,MAAM,CAAC;IAC1B,OAAO,CACL,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;QAChB,IAAI,KAAK,GAAG,CAAC,EAAE;QACf,IAAI,CAAC,IAAI,CAAC,UAAU,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE;QACpC,IAAI,MAAM,GAAG,CAAC,EAAE;QAChB,IAAI,CAAC,IAAI,CAAC,UAAU,KAAK,GAAG,CAAC,IAAI,MAAM,EAAE;QACzC,IAAI,CAAC,GAAG,CAAC,EAAE;QACX,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,MAAM,GAAG,CAAC,EAAE;QACrC,IAAI,CAAC,GAAG,CAAC,EAAE;QACX,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;QAChC,GAAG,CACJ,CAAC;AACJ,CAAC"}

package/dist/presentation/components/use_smile_id_document_shimmer.d.ts

@@ -0,0 +1,15 @@
+import type { DocumentType } from "../../core/models/document_type";
+/** Translucent in-frame document shimmer — the per-type "align here" skeleton, scaled to fit the capture frame. */
+export type UseSmileIDDocumentShimmerProps = {
+    readonly width: number;
+    readonly height: number;
+    /** Selects the skeleton; the green book and passport ignore `isBackSide`. */
+    readonly documentTypeKind?: DocumentType["kind"];
+    /** Generic documents only: show the back-side skeleton instead of the front. */
+    readonly isBackSide?: boolean;
+    readonly testID?: string;
+};
+/** Shimmer skeleton for a document type + side. Only generic documents have front/back; passport and green book ignore the side. */
+export declare function documentShimmerXml(documentTypeKind: DocumentType["kind"] | undefined, isBackSide: boolean): string;
+export declare const UseSmileIDDocumentShimmer: import("react").MemoExoticComponent<(props: UseSmileIDDocumentShimmerProps) => import("react").JSX.Element | null>;
+//# sourceMappingURL=use_smile_id_document_shimmer.d.ts.map

package/dist/presentation/components/use_smile_id_document_shimmer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use_smile_id_document_shimmer.d.ts","sourceRoot":"","sources":["../../../src/presentation/components/use_smile_id_document_shimmer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAQpE,mHAAmH;AACnH,MAAM,MAAM,8BAA8B,GAAG;IAC3C,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,6EAA6E;IAC7E,QAAQ,CAAC,gBAAgB,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IACjD,gFAAgF;IAChF,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAC;IAC9B,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEF,oIAAoI;AACpI,wBAAgB,kBAAkB,CAChC,gBAAgB,EAAE,YAAY,CAAC,MAAM,CAAC,GAAG,SAAS,EAClD,UAAU,EAAE,OAAO,GAClB,MAAM,CASR;AAED,eAAO,MAAM,yBAAyB,8CACM,8BAA8B,wCAazE,CAAC"}

package/dist/presentation/components/use_smile_id_document_shimmer.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from "react";
+import { SvgXml } from "react-native-svg";
+import { SI_DOCUMENT_BACK_SHIMMER, SI_DOCUMENT_FRONT_SHIMMER, SI_DOCUMENT_GREEN_BOOK_SHIMMER, SI_DOCUMENT_PASSPORT_SHIMMER, } from "../assets/svg/document_shimmer_strings";
+/** Shimmer skeleton for a document type + side. Only generic documents have front/back; passport and green book ignore the side. */
+export function documentShimmerXml(documentTypeKind, isBackSide) {
+    switch (documentTypeKind) {
+        case "passport":
+            return SI_DOCUMENT_PASSPORT_SHIMMER;
+        case "southAfricaGreenBook":
+            return SI_DOCUMENT_GREEN_BOOK_SHIMMER;
+        default:
+            return isBackSide ? SI_DOCUMENT_BACK_SHIMMER : SI_DOCUMENT_FRONT_SHIMMER;
+    }
+}
+export const UseSmileIDDocumentShimmer = memo(function UseSmileIDDocumentShimmer(props) {
+    const { width, height, documentTypeKind, isBackSide = false } = props;
+    if (width <= 0 || height <= 0)
+        return null;
+    // Default preserveAspectRatio (meet) fits the skeleton in the frame, undistorted.
+    return (_jsx(SvgXml, { xml: documentShimmerXml(documentTypeKind, isBackSide), width: width, height: height, ...(props.testID !== undefined ? { testID: props.testID } : {}) }));
+});
+//# sourceMappingURL=use_smile_id_document_shimmer.js.map

package/dist/presentation/components/use_smile_id_document_shimmer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use_smile_id_document_shimmer.js","sourceRoot":"","sources":["../../../src/presentation/components/use_smile_id_document_shimmer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAC7B,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAE1C,OAAO,EACL,wBAAwB,EACxB,yBAAyB,EACzB,8BAA8B,EAC9B,4BAA4B,GAC7B,MAAM,wCAAwC,CAAC;AAahD,oIAAoI;AACpI,MAAM,UAAU,kBAAkB,CAChC,gBAAkD,EAClD,UAAmB;IAEnB,QAAQ,gBAAgB,EAAE,CAAC;QACzB,KAAK,UAAU;YACb,OAAO,4BAA4B,CAAC;QACtC,KAAK,sBAAsB;YACzB,OAAO,8BAA8B,CAAC;QACxC;YACE,OAAO,UAAU,CAAC,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC,yBAAyB,CAAC;IAC7E,CAAC;AACH,CAAC;AAED,MAAM,CAAC,MAAM,yBAAyB,GAAG,IAAI,CAC3C,SAAS,yBAAyB,CAAC,KAAqC;IACtE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,gBAAgB,EAAE,UAAU,GAAG,KAAK,EAAE,GAAG,KAAK,CAAC;IACtE,IAAI,KAAK,IAAI,CAAC,IAAI,MAAM,IAAI,CAAC;QAAE,OAAO,IAAI,CAAC;IAC3C,kFAAkF;IAClF,OAAO,CACL,KAAC,MAAM,IACL,GAAG,EAAE,kBAAkB,CAAC,gBAAgB,EAAE,UAAU,CAAC,EACrD,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,KACV,CAAC,KAAK,CAAC,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,GAChE,CACH,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/presentation/components/use_smile_id_enhanced_smart_selfie_clip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use_smile_id_enhanced_smart_selfie_clip.d.ts","sourceRoot":"","sources":["../../../src/presentation/components/use_smile_id_enhanced_smart_selfie_clip.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAU3D,eAAO,MAAM,4BAA4B,EACsB,eAAe,CAAC;AAE/E,gFAAgF;AAChF,eAAO,MAAM,oCAAoC,MAAM,CAAC;AACxD,gEAAgE;AAChE,eAAO,MAAM,yBAAyB,MAAM,CAAC;AAE7C,MAAM,MAAM,sCAAsC,GAAG;IACnD,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,yEAAyE;IACzE,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAChC,QAAQ,CAAC,eAAe,EAAE,MAAM,CAAC;IACjC,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF;;;;;;GAMG;AACH,wBAAgB,iCAAiC,CAC/C,KAAK,EAAE,sCAAsC,sCA4D9C"}
+{"version":3,"file":"use_smile_id_enhanced_smart_selfie_clip.d.ts","sourceRoot":"","sources":["../../../src/presentation/components/use_smile_id_enhanced_smart_selfie_clip.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAS3D,eAAO,MAAM,4BAA4B,EACsB,eAAe,CAAC;AAE/E,gFAAgF;AAChF,eAAO,MAAM,oCAAoC,MAAM,CAAC;AACxD,gEAAgE;AAChE,eAAO,MAAM,yBAAyB,MAAM,CAAC;AAE7C,MAAM,MAAM,sCAAsC,GAAG;IACnD,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,yEAAyE;IACzE,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAChC,QAAQ,CAAC,eAAe,EAAE,MAAM,CAAC;IACjC,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF;;;;;;GAMG;AACH,wBAAgB,iCAAiC,CAC/C,KAAK,EAAE,sCAAsC,sCA0D9C"}

package/dist/presentation/components/use_smile_id_enhanced_smart_selfie_clip.js

@@ -4,7 +4,7 @@ import { View } from "react-native";
 import LottieView from "lottie-react-native";
 import { useReducedMotion } from "../utils/use_reduced_motion";
 import { FaceOvalDefaults } from "./face_oval_defaults";
-import { ENHANCED_SMART_SELFIE_ANIMATION_OPACITY, ENHANCED_SMART_SELFIE_ANIMATION_SPEED, ENHANCED_SMART_SELFIE_TOTAL_FRAMES, } from "./helpers/enhanced_smart_selfie_animation_frames";
+import { ENHANCED_SMART_SELFIE_ANIMATION_SPEED, ENHANCED_SMART_SELFIE_TOTAL_FRAMES, } from "./helpers/enhanced_smart_selfie_animation_frames";
 // eslint-disable-next-line @typescript-eslint/no-require-imports
 export const ESS_ALL_DIRECTIONS_ANIMATION = require("../assets/si_ess_animation_all_directions.json");
 /** Square box the Enhanced Smart Selfie cues render in, centred on the oval. */
@@ -32,8 +32,6 @@ export function UseSmileIDEnhancedSmartSelfieClip(props) {
         top: ovalCenterY - size / 2 + VERTICAL_ALIGNMENT_OFFSET,
         width: size,
         height: size,
-        // Translucent so the face stays the focal point behind the arrow cue.
-        opacity: ENHANCED_SMART_SELFIE_ANIMATION_OPACITY,
     };
     if (reducedMotion) {
         return (_jsx(View, { pointerEvents: "none", style: containerStyle, testID: props.testID, children: _jsx(LottieView, { source: ESS_ALL_DIRECTIONS_ANIMATION, progress: endFrame / ENHANCED_SMART_SELFIE_TOTAL_FRAMES, autoPlay: false, loop: false, style: { width: "100%", height: "100%" } }) }));

package/dist/presentation/components/use_smile_id_enhanced_smart_selfie_clip.js.map

@@ -1 +1 @@
-{"version":3,"file":"use_smile_id_enhanced_smart_selfie_clip.js","sourceRoot":"","sources":["../../../src/presentation/components/use_smile_id_enhanced_smart_selfie_clip.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"use_smile_id_enhanced_smart_selfie_clip.js","sourceRoot":"","sources":["../../../src/presentation/components/use_smile_id_enhanced_smart_selfie_clip.tsx"],"names":[],"mappings":"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"}

package/dist/presentation/components/use_smile_id_guideline_thumbnail.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use_smile_id_guideline_thumbnail.d.ts","sourceRoot":"","sources":["../../../src/presentation/components/use_smile_id_guideline_thumbnail.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAGtD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAehF,MAAM,MAAM,iCAAiC,GAAG;IAC9C,QAAQ,CAAC,SAAS,EAAE,oBAAoB,CAAC;IACzC,QAAQ,CAAC,KAAK,CAAC,EAAE,eAAe,CAAC;CAClC,CAAC;AAEF;;;GAGG;AACH,wBAAgB,4BAA4B,CAAC,EAC3C,SAAS,EACT,KAAK,EAAE,SAAS,GACjB,EAAE,iCAAiC,+BA6DnC"}
+{"version":3,"file":"use_smile_id_guideline_thumbnail.d.ts","sourceRoot":"","sources":["../../../src/presentation/components/use_smile_id_guideline_thumbnail.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAGtD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAwBhF,MAAM,MAAM,iCAAiC,GAAG;IAC9C,QAAQ,CAAC,SAAS,EAAE,oBAAoB,CAAC;IACzC,QAAQ,CAAC,KAAK,CAAC,EAAE,eAAe,CAAC;CAClC,CAAC;AAEF;;;GAGG;AACH,wBAAgB,4BAA4B,CAAC,EAC3C,SAAS,EACT,KAAK,EAAE,SAAS,GACjB,EAAE,iCAAiC,+BAiJnC"}

package/dist/presentation/components/use_smile_id_guideline_thumbnail.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
 import { StyleSheet, Text, View } from "react-native";
 import { useUseSmileIDTheme } from "../theme/theme_context";
 import { useUseSmileIDLocalizations } from "../../l10n/use_smile_id_localizations_provider";
@@ -14,6 +15,14 @@ const BADGE_SIZE = 16;
 const BADGE_ICON_SIZE = 14;
 // The badge overhangs the top-end corner of the card.
 const BADGE_OVERHANG = -10;
+// Document card SVGs carry a transparent bleed around the visible card (3px
+// L/R, 2px top, 4px bottom); the tile offsets the SVG by it so the card fills
+// the framed box exactly.
+const DOC_CARD_RADIUS = 4;
+const DOC_BLEED_X = 3;
+const DOC_BLEED_TOP = 2;
+const DOC_BLEED_BOTTOM = 4;
+const DOC_BADGE_OVERHANG = -8;
 /**
  * A capture-guideline tile: a bordered card with the illustration and a status
  * pill, a check/close badge overhanging the top-end corner, and a caption.
@@ -22,12 +31,51 @@ export function UseSmileIDGuidelineThumbnail({ guideline, theme: themeProp, }) {
     const themeFromContext = useUseSmileIDTheme();
     const theme = themeProp ?? themeFromContext;
     const localizations = useUseSmileIDLocalizations();
+    // Measured card width — the card scales to its column, so the SVG size and
+    // bleed offset scale with it.
+    const [measuredCardWidth, setMeasuredCardWidth] = useState(0);
     const allowed = guideline.status === "allowed";
     const Illustration = guideline.image;
     const Badge = allowed ? SiFilledCheckCircle : SiFilledCloseCircle;
     const badgeLabel = allowed
         ? localizations.siCdGuidelineAllowed
         : localizations.siCdGuidelineBlocked;
+    const caption = guideline.label(localizations);
+    // Document tile: one of four equal columns (so all four fit one row); the
+    // self-contained card SVG fills the column, framed by a border + shadow with
+    // an overhanging badge (no pill).
+    if (guideline.card) {
+        const { width: figmaCardWidth, height: figmaCardHeight } = guideline.card;
+        const scale = measuredCardWidth > 0 ? measuredCardWidth / figmaCardWidth : 0;
+        return (_jsxs(View, { style: styles.documentTile, children: [_jsxs(View, { style: [styles.documentCardWrap, { maxWidth: figmaCardWidth }], children: [_jsxs(View, { style: [
+                                styles.documentCard,
+                                {
+                                    aspectRatio: figmaCardWidth / figmaCardHeight,
+                                    backgroundColor: theme.colors.cardBackground,
+                                },
+                            ], onLayout: (event) => {
+                                const width = event.nativeEvent.layout.width;
+                                setMeasuredCardWidth((previous) => Math.abs(previous - width) < 0.5 ? previous : width);
+                            }, children: [scale > 0 ? (_jsx(View, { style: {
+                                        position: "absolute",
+                                        left: -DOC_BLEED_X * scale,
+                                        top: -DOC_BLEED_TOP * scale,
+                                    }, children: _jsx(Illustration, { width: (figmaCardWidth + DOC_BLEED_X * 2) * scale, height: (figmaCardHeight + DOC_BLEED_TOP + DOC_BLEED_BOTTOM) * scale }) })) : null, _jsx(View, { pointerEvents: "none", style: [
+                                        styles.documentCardBorder,
+                                        { borderColor: theme.colors.stroke },
+                                    ] })] }), _jsx(View, { style: [
+                                styles.badge,
+                                styles.documentBadge,
+                                { backgroundColor: theme.colors.cardBackground },
+                            ], accessibilityRole: "image", accessibilityLabel: badgeLabel, children: _jsx(Badge, { size: BADGE_ICON_SIZE }) })] }), _jsx(Text, { numberOfLines: 1, style: {
+                        ...theme.typography.cardCaption,
+                        fontSize: 10,
+                        lineHeight: 12,
+                        color: theme.colors.cardText,
+                        textAlign: "center",
+                        marginTop: theme.spacing.extraSmall,
+                    }, children: caption })] }));
+    }
     return (_jsxs(View, { style: styles.container, children: [_jsxs(View, { children: [_jsxs(View, { style: [
                             styles.card,
                             {
@@ -51,7 +99,7 @@ export function UseSmileIDGuidelineThumbnail({ guideline, theme: themeProp, }) {
                     color: theme.colors.primary,
                     textAlign: "center",
                     marginTop: theme.spacing.extraSmall,
-                }, children: guideline.label(localizations) })] }));
+                }, children: caption })] }));
 }
 const styles = StyleSheet.create({
     container: { alignItems: "center" },
@@ -92,5 +140,40 @@ const styles = StyleSheet.create({
         shadowOffset: { width: 0, height: 1 },
         elevation: 1,
     },
+    // One of four equal columns so the document guidelines always fit one row.
+    documentTile: {
+        width: "25%",
+        alignItems: "center",
+        paddingHorizontal: 3,
+    },
+    // Capped at the artwork's natural width (inline maxWidth) so it never grows
+    // past its design size on wide screens.
+    documentCardWrap: {
+        width: "100%",
+        alignSelf: "center",
+    },
+    documentCard: {
+        width: "100%",
+        borderRadius: DOC_CARD_RADIUS,
+        // No `overflow: hidden` — would clip the SVG's bleed and the shadow.
+        shadowColor: "#000000",
+        shadowOpacity: 0.1,
+        shadowRadius: 3,
+        shadowOffset: { width: 0, height: 1 },
+        elevation: 1,
+    },
+    documentCardBorder: {
+        position: "absolute",
+        top: 0,
+        bottom: 0,
+        start: 0,
+        end: 0,
+        borderRadius: DOC_CARD_RADIUS,
+        borderWidth: 1,
+    },
+    documentBadge: {
+        top: DOC_BADGE_OVERHANG,
+        end: DOC_BADGE_OVERHANG,
+    },
 });
 //# sourceMappingURL=use_smile_id_guideline_thumbnail.js.map