@smileid/usesmileid 12.0.2 → 12.1.1

package/dist/presentation/components/use_smile_id_instructions_hero.js

@@ -1,164 +1 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useRef, useState } from "react";
-import { Animated, Easing, Platform, StyleSheet, View, } from "react-native";
-import Svg, { Ellipse } from "react-native-svg";
-import { useUseSmileIDTheme } from "../theme/theme_context";
-import { useReducedMotion } from "../utils/use_reduced_motion";
-import { AnimatedLottieView } from "./helpers/animated_lottie_view";
-import { FaceOvalDefaults } from "./face_oval_defaults";
-// Oval bounded by 74% of the slot width / 84% of its height; the Lottie
-// frame is slightly wider and nudged down so the face sits centered.
-const OVAL_ASPECT_RATIO = 241 / 324; // width / height
-const OVAL_WIDTH_FRACTION = 0.74;
-const OVAL_HEIGHT_FRACTION = 0.84;
-const ANIMATION_TO_OVAL_WIDTH_RATIO = 279 / 241;
-const ANIMATION_VERTICAL_OFFSET_RATIO = 0.06;
-const STROKE_WIDTH = FaceOvalDefaults.strokeWidth; // matches the capture overlay's oval stroke
-const DEFAULT_LOOP_MS = 2000;
-// The oval progress ring fills on its own fixed-duration loop, independent of
-// the hero animation's playback speed, so a long hero composition can't slow
-// the fill down to a crawl.
-export const OVAL_PROGRESS_DURATION_MS = 5500;
-// Document hero card: 4:3 frame, corner radius = 40/384 of its width.
-const HERO_CARD_WIDTH_TO_HEIGHT = 384 / 288;
-const HERO_CARD_CORNER_RATIO = 40 / 384;
-/** Loop duration from the Lottie composition (`(op - ip) / fr`), else default. */
-export function loopDurationMs(source) {
-    if (source && typeof source === "object" && "fr" in source) {
-        const composition = source;
-        if (composition.fr && composition.op !== undefined) {
-            const milliseconds = ((composition.op - (composition.ip ?? 0)) / composition.fr) * 1000;
-            if (Number.isFinite(milliseconds) && milliseconds > 0) {
-                return milliseconds;
-            }
-        }
-    }
-    return DEFAULT_LOOP_MS;
-}
-/**
- * Hero animation with an optional face-oval ring. The hero plays at its own
- * natural composition pace while the ring's green fill rises on a separate,
- * fixed-duration loop, so the two are decoupled. Honors reduced motion (holds
- * the final frame, ring filled).
- */
-export function UseSmileIDInstructionsHero({ source, showOval = false, showOvalProgress = true, showCardBackground = false, theme: themeProp, }) {
-    const themeFromContext = useUseSmileIDTheme();
-    const theme = themeProp ?? themeFromContext;
-    const [size, setSize] = useState({ width: 0, height: 0 });
-    const reducedMotion = useReducedMotion();
-    // Drives the Lottie hero frame at its natural composition pace.
-    const heroProgress = useRef(new Animated.Value(0)).current;
-    // Drives the rising green ring fill on its own fixed-duration loop.
-    const ovalProgress = useRef(new Animated.Value(0)).current;
-    // Loop only when the ring animates; otherwise pin the value (1 under reduced
-    // motion = full ring / final frame, else 0).
-    const animate = showOvalProgress && !reducedMotion;
-    // Hero animation: plays over its own composition duration, untouched by the
-    // ring fill speed.
-    useEffect(() => {
-        if (animate) {
-            heroProgress.setValue(0);
-            const loop = Animated.loop(Animated.timing(heroProgress, {
-                toValue: 1,
-                duration: loopDurationMs(source),
-                easing: Easing.linear,
-                useNativeDriver: false,
-            }));
-            loop.start();
-            return () => loop.stop();
-        }
-        heroProgress.setValue(reducedMotion ? 1 : 0);
-        return undefined;
-    }, [animate, reducedMotion, source, heroProgress]);
-    // Ring fill: dedicated linear loop completing in OVAL_PROGRESS_DURATION_MS,
-    // independent of the hero animation. Reduced motion holds it fully filled.
-    useEffect(() => {
-        if (animate) {
-            ovalProgress.setValue(0);
-            const loop = Animated.loop(Animated.timing(ovalProgress, {
-                toValue: 1,
-                duration: OVAL_PROGRESS_DURATION_MS,
-                easing: Easing.linear,
-                useNativeDriver: false,
-            }));
-            loop.start();
-            return () => loop.stop();
-        }
-        ovalProgress.setValue(reducedMotion ? 1 : 0);
-        return undefined;
-        // `source` is intentionally omitted: the ring's duration is the fixed
-        // OVAL_PROGRESS_DURATION_MS constant, so it must not re-key on the hero
-        // composition (that coupling is exactly what this effect avoids).
-    }, [animate, reducedMotion, ovalProgress]);
-    const ovalWidth = Math.min(size.width * OVAL_WIDTH_FRACTION, size.height * OVAL_HEIGHT_FRACTION * OVAL_ASPECT_RATIO);
-    const ovalHeight = ovalWidth / OVAL_ASPECT_RATIO;
-    const animationSize = ovalWidth * ANIMATION_TO_OVAL_WIDTH_RATIO;
-    const verticalOffset = animationSize * ANIMATION_VERTICAL_OFFSET_RATIO;
-    const hasSize = ovalWidth > 0 && ovalHeight > 0;
-    const cardWidth = Math.min(size.width, size.height * HERO_CARD_WIDTH_TO_HEIGHT);
-    const cardHeight = cardWidth / HERO_CARD_WIDTH_TO_HEIGHT;
-    const cardRadius = cardWidth * HERO_CARD_CORNER_RATIO;
-    const onLayout = (event) => {
-        const { width, height } = event.nativeEvent.layout;
-        setSize((previous) => previous.width === width && previous.height === height
-            ? previous
-            : { width, height });
-    };
-    // Drive the Lottie from the hero progress value when the ring is shown or
-    // motion is reduced; otherwise let it play on its own clock (autoPlay+loop).
-    const lottieDrivenByProgress = showOvalProgress || reducedMotion;
-    // lottie-ios's Core Animation engine mis-renders the document heroes' track mattes,
-    // so oval-less heroes use the main-thread engine on iOS; Android keeps its default.
-    const renderModeProps = Platform.OS === "ios" && !showOval
-        ? { renderMode: "SOFTWARE" }
-        : {};
-    // Inset the ring by half the stroke so it isn't clipped at the SVG edge.
-    const ellipseProps = {
-        cx: ovalWidth / 2,
-        cy: ovalHeight / 2,
-        rx: (ovalWidth - STROKE_WIDTH) / 2,
-        ry: (ovalHeight - STROKE_WIDTH) / 2,
-        strokeWidth: STROKE_WIDTH,
-        fill: "none",
-    };
-    return (_jsx(View, { style: styles.container, onLayout: onLayout, testID: "si_instructions_hero", children: hasSize ? (showCardBackground ? (_jsx(View, { style: {
-                position: "absolute",
-                left: (size.width - cardWidth) / 2,
-                top: (size.height - cardHeight) / 2,
-                width: cardWidth,
-                height: cardHeight,
-                borderRadius: cardRadius,
-                overflow: "hidden",
-                backgroundColor: theme.colors.instructionCardBackground,
-            }, testID: "si_instructions_hero_card", children: _jsx(AnimatedLottieView, { source: source, autoPlay: !lottieDrivenByProgress, loop: !lottieDrivenByProgress, ...(lottieDrivenByProgress ? { progress: heroProgress } : {}), ...renderModeProps, resizeMode: "contain", style: { width: cardWidth, height: cardHeight } }) })) : (_jsxs(_Fragment, { children: [showOval ? (_jsxs(_Fragment, { children: [_jsx(Svg, { width: ovalWidth, height: ovalHeight, style: {
-                                position: "absolute",
-                                left: (size.width - ovalWidth) / 2,
-                                top: (size.height - ovalHeight) / 2,
-                            }, children: _jsx(Ellipse, { ...ellipseProps, stroke: theme.colors.ovalDefault }) }), showOvalProgress ? (_jsx(View, { pointerEvents: "none", style: {
-                                position: "absolute",
-                                left: (size.width - ovalWidth) / 2,
-                                top: (size.height - ovalHeight) / 2,
-                                width: ovalWidth,
-                                height: ovalHeight,
-                            }, children: _jsx(Animated.View, { style: {
-                                    position: "absolute",
-                                    left: 0,
-                                    right: 0,
-                                    bottom: 0,
-                                    overflow: "hidden",
-                                    height: ovalProgress.interpolate({
-                                        inputRange: [0, 1],
-                                        outputRange: [0, ovalHeight],
-                                    }),
-                                }, children: _jsx(Svg, { width: ovalWidth, height: ovalHeight, style: { position: "absolute", left: 0, bottom: 0 }, children: _jsx(Ellipse, { ...ellipseProps, stroke: theme.colors.ovalActive }) }) }) })) : null] })) : null, _jsx(AnimatedLottieView, { source: source, autoPlay: !lottieDrivenByProgress, loop: !lottieDrivenByProgress, ...(lottieDrivenByProgress ? { progress: heroProgress } : {}), ...renderModeProps, style: {
-                        position: "absolute",
-                        width: animationSize,
-                        height: animationSize,
-                        left: (size.width - animationSize) / 2,
-                        top: (size.height - animationSize) / 2 + verticalOffset,
-                    } })] }))) : null }));
-}
-const styles = StyleSheet.create({
-    container: { flex: 1, alignSelf: "stretch" },
-});
-//# sourceMappingURL=use_smile_id_instructions_hero.js.map
+"use strict";import{jsx as o,Fragment as S,jsxs as D}from"react/jsx-runtime";import{useEffect as E,useRef as V,useState as U}from"react";import{Animated as a,Easing as v,Platform as G,StyleSheet as B,View as O}from"react-native";import H,{Ellipse as b}from"react-native-svg";import{useUseSmileIDTheme as K}from"../theme/theme_context";import{useReducedMotion as q}from"../utils/use_reduced_motion";import{AnimatedLottieView as M}from"./helpers/animated_lottie_view";import{FaceOvalDefaults as J}from"./face_oval_defaults";const x=241/324,Q=.74,X=.84,Y=279/241,Z=.06,R=J.strokeWidth,$=2e3;export const OVAL_PROGRESS_DURATION_MS=5500;const F=384/288,tt=40/384;export function loopDurationMs(i){if(i&&typeof i=="object"&&"fr"in i){const s=i;if(s.fr&&s.op!==void 0){const r=(s.op-(s.ip??0))/s.fr*1e3;if(Number.isFinite(r)&&r>0)return r}}return $}export function UseSmileIDInstructionsHero({source:i,showOval:s=!1,showOvalProgress:r=!0,showCardBackground:L=!1,theme:N}){const C=K(),g=N??C,[t,P]=U({width:0,height:0}),h=q(),c=V(new a.Value(0)).current,u=V(new a.Value(0)).current,m=r&&!h;E(()=>{if(m){c.setValue(0);const l=a.loop(a.timing(c,{toValue:1,duration:loopDurationMs(i),easing:v.linear,useNativeDriver:!1}));return l.start(),()=>l.stop()}c.setValue(h?1:0)},[m,h,i,c]),E(()=>{if(m){u.setValue(0);const l=a.loop(a.timing(u,{toValue:1,duration:OVAL_PROGRESS_DURATION_MS,easing:v.linear,useNativeDriver:!1}));return l.start(),()=>l.stop()}u.setValue(h?1:0)},[m,h,u]);const e=Math.min(t.width*Q,t.height*X*x),n=e/x,f=e*Y,W=f*Z,k=e>0&&n>0,p=Math.min(t.width,t.height*F),_=p/F,j=p*tt,z=l=>{const{width:w,height:y}=l.nativeEvent.layout;P(A=>A.width===w&&A.height===y?A:{width:w,height:y})},d=r||h,T=G.OS==="ios"&&!s?{renderMode:"SOFTWARE"}:{},I={cx:e/2,cy:n/2,rx:(e-R)/2,ry:(n-R)/2,strokeWidth:R,fill:"none"};return o(O,{style:et.container,onLayout:z,testID:"si_instructions_hero",children:k?L?o(O,{style:{position:"absolute",left:(t.width-p)/2,top:(t.height-_)/2,width:p,height:_,borderRadius:j,overflow:"hidden",backgroundColor:g.colors.instructionCardBackground},testID:"si_instructions_hero_card",children:o(M,{source:i,autoPlay:!d,loop:!d,...d?{progress:c}:{},...T,resizeMode:"contain",style:{width:p,height:_}})}):D(S,{children:[s?D(S,{children:[o(H,{width:e,height:n,style:{position:"absolute",left:(t.width-e)/2,top:(t.height-n)/2},children:o(b,{...I,stroke:g.colors.ovalDefault})}),r?o(O,{pointerEvents:"none",style:{position:"absolute",left:(t.width-e)/2,top:(t.height-n)/2,width:e,height:n},children:o(a.View,{style:{position:"absolute",left:0,right:0,bottom:0,overflow:"hidden",height:u.interpolate({inputRange:[0,1],outputRange:[0,n]})},children:o(H,{width:e,height:n,style:{position:"absolute",left:0,bottom:0},children:o(b,{...I,stroke:g.colors.ovalActive})})})}):null]}):null,o(M,{source:i,autoPlay:!d,loop:!d,...d?{progress:c}:{},...T,style:{position:"absolute",width:f,height:f,left:(t.width-f)/2,top:(t.height-f)/2+W}})]}):null})}const et=B.create({container:{flex:1,alignSelf:"stretch"}});

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

@@ -21,4 +21,3 @@ export type UseSmileIDLearnMoreContentProps = {
  * keeps the localizations class one-token-per-method.
  */
 export declare function UseSmileIDLearnMoreContent(props: UseSmileIDLearnMoreContentProps): import("react").JSX.Element;
-//# sourceMappingURL=use_smile_id_learn_more_content.d.ts.map

package/dist/presentation/components/use_smile_id_learn_more_content.js

@@ -1,70 +1 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Linking, StyleSheet, Text, View } from "react-native";
-import { useUseSmileIDTheme } from "../theme/theme_context";
-import { useUseSmileIDLocalizations } from "../../l10n/use_smile_id_localizations_provider";
-import { UseSmileIDCrashReporting } from "@smileid/usesmileid_bridge";
-const SMILE_ID_PRIVACY_URL = "https://usesmileid.com/privacy-policy/";
-/**
- * Privacy-policy / consent details, rendered in an expandable section
- * on the consent screen. Composes the canonical
- * `si_consent_learn_more_description` template with `{smile_id}`,
- * `{partner}`, `{retention}` placeholders.
- *
- * Tap targets:
- *   • Smile ID link → `https://usesmileid.com/privacy-policy/`
- *   • Partner link  → `partnerPrivacyPolicyUrl` (silent no-op when omitted)
- *   • DSAR link     → opens Smile ID DSAR page
- *
- * Substitution is done locally because
- * `siConsentLearnMoreDescription` is a non-parameterised getter —
- * keeps the localizations class one-token-per-method.
- */
-export function UseSmileIDLearnMoreContent(props) {
-    const themeFromContext = useUseSmileIDTheme();
-    const theme = props.theme ?? themeFromContext;
-    const loc = useUseSmileIDLocalizations();
-    const description = loc.siConsentLearnMoreDescription
-        .split("{smile_id}")
-        .join(loc.siConsentLearnMoreDescriptionSmileId)
-        .split("{partner}")
-        .join(props.partnerName)
-        .split("{retention}")
-        .join(loc.siConsentLearnMoreDescriptionRetention);
-    const openSmileId = () => {
-        Linking.openURL(SMILE_ID_PRIVACY_URL).catch((err) => {
-            // Concrete scenario: device has no browser registered, or URL
-            // handler rejects. Route through crash reporting so partners
-            // see the failure in observability instead of "tap does
-            // nothing" in QA.
-            UseSmileIDCrashReporting.captureException(err);
-        });
-    };
-    const openPartner = () => {
-        const url = props.partnerPrivacyPolicyUrl;
-        if (!url)
-            return;
-        Linking.openURL(url).catch((err) => {
-            // Concrete scenario: partner ships a malformed
-            // `partnerPrivacyPolicyUrl` — tap silently fails. Surface to
-            // crash reporting so partner QA catches it pre-release.
-            UseSmileIDCrashReporting.captureException(err);
-        });
-    };
-    const linkStyle = {
-        ...theme.typography.body,
-        color: theme.colors.primary,
-        textDecorationLine: "underline",
-    };
-    return (_jsxs(View, { testID: props.testID, style: [
-            styles.container,
-            { paddingVertical: theme.spacing.medium, gap: theme.spacing.small },
-        ], children: [_jsx(Text, { style: {
-                    ...theme.typography.body,
-                    color: theme.colors.cardText,
-                    lineHeight: 18,
-                }, children: description }), _jsxs(Text, { style: { ...theme.typography.body, color: theme.colors.cardText }, children: [loc.siConsentLearnMoreDsarPrefix, _jsx(Text, { onPress: openSmileId, style: linkStyle, children: loc.siConsentLearnMoreDsarLink }), "."] }), _jsxs(Text, { style: { ...theme.typography.body, color: theme.colors.cardText }, children: [loc.siConsentLearnMorePrivacyPrefix, _jsx(Text, { onPress: openSmileId, style: linkStyle, children: loc.siConsentLearnMorePrivacySmileLink }), loc.siConsentLearnMorePrivacyAnd, _jsx(Text, { onPress: openPartner, style: linkStyle, children: loc.siConsentLearnMorePrivacyPartnerLink(props.partnerName) }), loc.siConsentLearnMorePrivacySuffix] })] }));
-}
-const styles = StyleSheet.create({
-    container: {},
-});
-//# sourceMappingURL=use_smile_id_learn_more_content.js.map
+"use strict";import{jsx as i,jsxs as c}from"react/jsx-runtime";import{Linking as l,StyleSheet as L,Text as r,View as x}from"react-native";import{useUseSmileIDTheme as P}from"../theme/theme_context";import{useUseSmileIDLocalizations as C}from"../../l10n/use_smile_id_localizations_provider";import{UseSmileIDCrashReporting as p}from"@smileid/usesmileid_bridge";const D="https://usesmileid.com/privacy-policy/";export function UseSmileIDLearnMoreContent(o){const y=P(),e=o.theme??y,n=C(),m=n.siConsentLearnMoreDescription.split("{smile_id}").join(n.siConsentLearnMoreDescriptionSmileId).split("{partner}").join(o.partnerName).split("{retention}").join(n.siConsentLearnMoreDescriptionRetention),a=()=>{l.openURL(D).catch(t=>{p.captureException(t)})},d=()=>{const t=o.partnerPrivacyPolicyUrl;t&&l.openURL(t).catch(h=>{p.captureException(h)})},s={...e.typography.body,color:e.colors.primary,textDecorationLine:"underline"};return c(x,{testID:o.testID,style:[u.container,{paddingVertical:e.spacing.medium,gap:e.spacing.small}],children:[i(r,{style:{...e.typography.body,color:e.colors.cardText,lineHeight:18},children:m}),c(r,{style:{...e.typography.body,color:e.colors.cardText},children:[n.siConsentLearnMoreDsarPrefix,i(r,{onPress:a,style:s,children:n.siConsentLearnMoreDsarLink}),"."]}),c(r,{style:{...e.typography.body,color:e.colors.cardText},children:[n.siConsentLearnMorePrivacyPrefix,i(r,{onPress:a,style:s,children:n.siConsentLearnMorePrivacySmileLink}),n.siConsentLearnMorePrivacyAnd,i(r,{onPress:d,style:s,children:n.siConsentLearnMorePrivacyPartnerLink(o.partnerName)}),n.siConsentLearnMorePrivacySuffix]})]})}const u=L.create({container:{}});

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

@@ -11,4 +11,3 @@ export type UseSmileIDLoadingContentProps = {
  * by the screen itself, so the same indicator doesn't appear twice.
  */
 export declare function UseSmileIDLoadingContent(props: UseSmileIDLoadingContentProps): import("react").JSX.Element;
-//# sourceMappingURL=use_smile_id_loading_content.d.ts.map

package/dist/presentation/components/use_smile_id_loading_content.js

@@ -1,31 +1 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { StyleSheet, Text, View } from "react-native";
-import { useUseSmileIDTheme } from "../theme/theme_context";
-import { useUseSmileIDLocalizations } from "../../l10n/use_smile_id_localizations_provider";
-/**
- * Loading-state body of the processing screen's bottom card —
- * "Submitting…" message (or partner override) only. The active
- * spinner is rendered separately, centered inside the face oval
- * by the screen itself, so the same indicator doesn't appear twice.
- */
-export function UseSmileIDLoadingContent(props) {
-    const themeFromContext = useUseSmileIDTheme();
-    const theme = props.theme ?? themeFromContext;
-    const loc = useUseSmileIDLocalizations();
-    const message = props.message ?? loc.siProcessingSubmitting;
-    return (_jsxs(View, { testID: props.testID, style: [styles.container, { paddingVertical: theme.spacing.small }], children: [_jsx(Text, { style: {
-                    ...theme.typography.cardHeading,
-                    color: theme.colors.primary,
-                    textAlign: "center",
-                    letterSpacing: -0.425,
-                }, children: message }), _jsx(Text, { style: {
-                    ...theme.typography.cardCaption,
-                    color: theme.colors.cardText,
-                    textAlign: "center",
-                    marginTop: theme.spacing.extraSmall,
-                }, children: loc.siProcessingSubmittingSubtitle })] }));
-}
-const styles = StyleSheet.create({
-    container: { alignItems: "center", justifyContent: "center" },
-});
-//# sourceMappingURL=use_smile_id_loading_content.js.map
+"use strict";import{jsx as n,jsxs as c}from"react/jsx-runtime";import{StyleSheet as a,Text as i,View as l}from"react-native";import{useUseSmileIDTheme as m}from"../theme/theme_context";import{useUseSmileIDLocalizations as g}from"../../l10n/use_smile_id_localizations_provider";export function UseSmileIDLoadingContent(t){const o=m(),e=t.theme??o,s=g(),r=t.message??s.siProcessingSubmitting;return c(l,{testID:t.testID,style:[p.container,{paddingVertical:e.spacing.small}],children:[n(i,{style:{...e.typography.cardHeading,color:e.colors.primary,textAlign:"center",letterSpacing:-.425},children:r}),n(i,{style:{...e.typography.cardCaption,color:e.colors.cardText,textAlign:"center",marginTop:e.spacing.extraSmall},children:s.siProcessingSubmittingSubtitle})]})}const p=a.create({container:{alignItems:"center",justifyContent:"center"}});

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

@@ -12,4 +12,3 @@ export type UseSmileIDLoadingIndicatorProps = {
  * still reads as "in progress" without animating.
  */
 export declare function UseSmileIDLoadingIndicator(props: UseSmileIDLoadingIndicatorProps): import("react").JSX.Element;
-//# sourceMappingURL=use_smile_id_loading_indicator.d.ts.map

package/dist/presentation/components/use_smile_id_loading_indicator.js

@@ -1,48 +1 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect, useRef } from "react";
-import { Animated, Easing } from "react-native";
-import Svg, { Circle } from "react-native-svg";
-import { useUseSmileIDTheme } from "../theme/theme_context";
-import { useReducedMotion } from "../utils/use_reduced_motion";
-const DEFAULT_SIZE = 64;
-const STROKE_WIDTH = 4;
-// 270° visible arc — the open quarter is what reads as "spinning".
-const SWEEP_FRACTION = 0.75;
-const SPIN_DURATION_MS = 1000;
-/**
- * Submission spinner — a `submittingIndicator`-green arc (round cap,
- * 270° sweep) that rotates once per second. When the OS reports
- * reduced-motion, the arc is held static (no rotation) so the screen
- * still reads as "in progress" without animating.
- */
-export function UseSmileIDLoadingIndicator(props) {
-    const themeFromContext = useUseSmileIDTheme();
-    const theme = props.theme ?? themeFromContext;
-    const size = props.size ?? DEFAULT_SIZE;
-    const radius = (size - STROKE_WIDTH) / 2;
-    const circumference = 2 * Math.PI * radius;
-    const arcLength = circumference * SWEEP_FRACTION;
-    const reduceMotion = useReducedMotion();
-    const rotation = useRef(new Animated.Value(0)).current;
-    useEffect(() => {
-        if (reduceMotion)
-            return;
-        const loop = Animated.loop(Animated.timing(rotation, {
-            toValue: 1,
-            duration: SPIN_DURATION_MS,
-            easing: Easing.linear,
-            useNativeDriver: true,
-        }));
-        loop.start();
-        return () => loop.stop();
-    }, [reduceMotion, rotation]);
-    const spin = rotation.interpolate({
-        inputRange: [0, 1],
-        outputRange: ["0deg", "360deg"],
-    });
-    return (_jsx(Animated.View, { testID: props.testID, style: [
-            { width: size, height: size },
-            reduceMotion ? null : { transform: [{ rotate: spin }] },
-        ], children: _jsx(Svg, { width: size, height: size, viewBox: `0 0 ${size} ${size}`, children: _jsx(Circle, { cx: size / 2, cy: size / 2, r: radius, stroke: theme.colors.submittingIndicator, strokeWidth: STROKE_WIDTH, strokeLinecap: "round", strokeDasharray: `${arcLength} ${circumference}`, fill: "none" }) }) }));
-}
-//# sourceMappingURL=use_smile_id_loading_indicator.js.map
+"use strict";import{jsx as i}from"react/jsx-runtime";import{useEffect as f,useRef as g}from"react";import{Animated as e,Easing as I}from"react-native";import p,{Circle as D}from"react-native-svg";import{useUseSmileIDTheme as S}from"../theme/theme_context";import{useReducedMotion as E}from"../utils/use_reduced_motion";const R=64,m=4,x=.75,T=1e3;export function UseSmileIDLoadingIndicator(o){const u=S(),d=o.theme??u,t=o.size??R,s=(t-m)/2,c=2*Math.PI*s,l=c*x,n=E(),r=g(new e.Value(0)).current;f(()=>{if(n)return;const a=e.loop(e.timing(r,{toValue:1,duration:T,easing:I.linear,useNativeDriver:!0}));return a.start(),()=>a.stop()},[n,r]);const h=r.interpolate({inputRange:[0,1],outputRange:["0deg","360deg"]});return i(e.View,{testID:o.testID,style:[{width:t,height:t},n?null:{transform:[{rotate:h}]}],children:i(p,{width:t,height:t,viewBox:`0 0 ${t} ${t}`,children:i(D,{cx:t/2,cy:t/2,r:s,stroke:d.colors.submittingIndicator,strokeWidth:m,strokeLinecap:"round",strokeDasharray:`${l} ${c}`,fill:"none"})})})}

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

@@ -9,4 +9,3 @@ export type OvalBorderColorToken = Extract<keyof UseSmileIDColors, "ovalDefault"
 export declare const UseSmileIDOvalBorderPalette: {
     readonly tokenFor: (captureState: UseSmileIDOverlayState, enableEnhancedLiveness: boolean) => OvalBorderColorToken;
 };
-//# sourceMappingURL=use_smile_id_oval_border_palette.d.ts.map

package/dist/presentation/components/use_smile_id_oval_border_palette.js

@@ -1,49 +1 @@
-import { UseSmileIDOverlayState } from "../state/use_smile_id_overlay_state";
-/**
- * Pure overlay-state → border colour-token table, unit-tested directly;
- * `UseSmileIDFaceOverlay` resolves the token through the active theme.
- */
-export const UseSmileIDOvalBorderPalette = {
-    tokenFor(captureState, enableEnhancedLiveness) {
-        switch (captureState) {
-            case UseSmileIDOverlayState.INSTRUCTION:
-            case UseSmileIDOverlayState.IDLE:
-            case UseSmileIDOverlayState.FACE_DETECTED:
-            case UseSmileIDOverlayState.HEAD_TURN:
-                return "ovalDefault";
-            case UseSmileIDOverlayState.READY:
-                return "ovalActive";
-            // ESS has no green oval treatment.
-            case UseSmileIDOverlayState.CAPTURING:
-            case UseSmileIDOverlayState.PROCESSING:
-                return enableEnhancedLiveness ? "ovalDefault" : "ovalActive";
-            // Directional hints keep a neutral rim; the red arc carries colour.
-            case UseSmileIDOverlayState.MOVE_LEFT:
-            case UseSmileIDOverlayState.MOVE_RIGHT:
-            case UseSmileIDOverlayState.MOVE_UP:
-            case UseSmileIDOverlayState.MOVE_DOWN:
-                return "ovalDefault";
-            case UseSmileIDOverlayState.TOO_CLOSE:
-            case UseSmileIDOverlayState.TOO_FAR:
-            case UseSmileIDOverlayState.FACE_NOT_CENTERED:
-            case UseSmileIDOverlayState.LOW_LIGHT:
-            case UseSmileIDOverlayState.BRIGHT_LIGHT:
-            case UseSmileIDOverlayState.WRONG_ORIENTATION:
-            case UseSmileIDOverlayState.NOT_SMILING:
-            case UseSmileIDOverlayState.MULTIPLE_FACES:
-                return "ovalWarning";
-            // Document states (UseSmileIDDocumentOverlay resolves its border through
-            // this same table): green once the document is correctly framed, red
-            // while it is detected but mispositioned (too far / close / off-centre /
-            // not steady).
-            case UseSmileIDOverlayState.DOCUMENT_READY:
-                return "ovalActive";
-            case UseSmileIDOverlayState.DOCUMENT_NOT_CENTERED:
-            case UseSmileIDOverlayState.DOCUMENT_TOO_FAR:
-            case UseSmileIDOverlayState.DOCUMENT_TOO_CLOSE:
-            case UseSmileIDOverlayState.DOCUMENT_HOLD_STILL:
-                return "ovalWarning";
-        }
-    },
-};
-//# sourceMappingURL=use_smile_id_oval_border_palette.js.map
+"use strict";import{UseSmileIDOverlayState as e}from"../state/use_smile_id_overlay_state";export const UseSmileIDOvalBorderPalette={tokenFor(a,O){switch(a){case e.INSTRUCTION:case e.IDLE:case e.FACE_DETECTED:case e.HEAD_TURN:return"ovalDefault";case e.READY:return"ovalActive";case e.CAPTURING:case e.PROCESSING:return O?"ovalDefault":"ovalActive";case e.MOVE_LEFT:case e.MOVE_RIGHT:case e.MOVE_UP:case e.MOVE_DOWN:return"ovalDefault";case e.TOO_CLOSE:case e.TOO_FAR:case e.FACE_NOT_CENTERED:case e.LOW_LIGHT:case e.BRIGHT_LIGHT:case e.WRONG_ORIENTATION:case e.NOT_SMILING:return"ovalWarning";case e.DOCUMENT_READY:return"ovalActive";case e.DOCUMENT_NOT_CENTERED:case e.DOCUMENT_TOO_FAR:case e.DOCUMENT_TOO_CLOSE:case e.DOCUMENT_HOLD_STILL:return"ovalWarning"}}};

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

@@ -4,6 +4,8 @@ export type UseSmileIDPartnerIconProps = {
     readonly partnerName: string;
     /** Optional custom icon — partner brand mark. Falls back to initial-letter placeholder. */
     readonly icon?: ReactNode;
+    /** Accessible name for the mark; defaults to `partnerName`. */
+    readonly accessibilityLabel?: string;
     readonly testID?: string;
     readonly theme?: UseSmileIDTheme;
 };
@@ -13,6 +15,6 @@ export type UseSmileIDPartnerIconProps = {
  * shape and size (~30 px for the consent header), so no circular crop
  * is applied. When `icon` is null, falls back to a styled
  * initial-letter placeholder derived from `partnerName`.
+ * Either path names the mark from `partnerName`, or hides it when that is blank.
  */
 export declare function UseSmileIDPartnerIcon(props: UseSmileIDPartnerIconProps): import("react").JSX.Element;
-//# sourceMappingURL=use_smile_id_partner_icon.d.ts.map

package/dist/presentation/components/use_smile_id_partner_icon.js

@@ -1,34 +1 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { StyleSheet, Text, View } from "react-native";
-import { useUseSmileIDTheme } from "../theme/theme_context";
-const SIZE = 36;
-/**
- * Partner brand mark shown at the top of the consent screen. A
- * supplied `icon` renders as-is — the partner's mark carries its own
- * shape and size (~30 px for the consent header), so no circular crop
- * is applied. When `icon` is null, falls back to a styled
- * initial-letter placeholder derived from `partnerName`.
- */
-export function UseSmileIDPartnerIcon(props) {
-    const themeFromContext = useUseSmileIDTheme();
-    const theme = props.theme ?? themeFromContext;
-    if (props.icon) {
-        return _jsx(View, { testID: props.testID, children: props.icon });
-    }
-    const initial = props.partnerName.trim().charAt(0).toUpperCase() || "?";
-    return (_jsx(View, { testID: props.testID, style: [styles.circle, { backgroundColor: theme.colors.cardBackground }], children: _jsx(Text, { style: {
-                ...theme.typography.cardTitle,
-                color: theme.colors.titleText,
-            }, children: initial }) }));
-}
-const styles = StyleSheet.create({
-    circle: {
-        width: SIZE,
-        height: SIZE,
-        borderRadius: SIZE / 2,
-        alignItems: "center",
-        justifyContent: "center",
-        overflow: "hidden",
-    },
-});
-//# sourceMappingURL=use_smile_id_partner_icon.js.map
+"use strict";import{jsx as i}from"react/jsx-runtime";import{StyleSheet as a,Text as m,View as s}from"react-native";import{useUseSmileIDTheme as d}from"../theme/theme_context";const c=36;export function UseSmileIDPartnerIcon(e){const o=d(),t=e.theme??o,r=(e.accessibilityLabel??e.partnerName).trim(),n=r?{accessibilityRole:"image",accessibilityLabel:r}:{accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants"};if(e.icon)return i(s,{testID:e.testID,...n,children:e.icon});const l=e.partnerName.trim().charAt(0).toUpperCase()||"?";return i(s,{testID:e.testID,...n,style:[h.circle,{backgroundColor:t.colors.cardBackground}],children:i(m,{importantForAccessibility:"no",accessibilityElementsHidden:!0,style:{...t.typography.cardTitle,color:t.colors.titleText},children:l})})}const h=a.create({circle:{width:c,height:c,borderRadius:c/2,alignItems:"center",justifyContent:"center",overflow:"hidden"}});

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

@@ -23,4 +23,3 @@ export type UseSmileIDProcessingCenterIndicatorProps = {
  * indicator in the top-left before the layout settles).
  */
 export declare function UseSmileIDProcessingCenterIndicator(props: UseSmileIDProcessingCenterIndicatorProps): import("react").JSX.Element | null;
-//# sourceMappingURL=use_smile_id_processing_center_indicator.d.ts.map

package/dist/presentation/components/use_smile_id_processing_center_indicator.js

@@ -1,44 +1 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { StyleSheet, View } from "react-native";
-import { useUseSmileIDTheme } from "../theme/theme_context";
-import { UseSmileIDLoadingIndicator } from "./use_smile_id_loading_indicator";
-import { UseSmileIDStatusIndicator } from "./use_smile_id_status_indicator";
-import { computeFaceOvalGeometry } from "./face_oval_defaults";
-/**
- * Status indicator centered inside the face-oval rect on the
- * processing screen. The indicator visually anchors to the same
- * place the captured image lives, so the user's eye is already on
- * the rect when the spinner / check / cross resolves.
- *
- *   - loading → tinted spinner
- *   - success → green ✓
- *   - failed  → red ✕
- *
- * Returns `null` until the canvas has measured (avoids rendering at
- * the {0,0} default geometry, which would briefly flash the
- * indicator in the top-left before the layout settles).
- */
-export function UseSmileIDProcessingCenterIndicator(props) {
-    const themeFromContext = useUseSmileIDTheme();
-    const theme = props.theme ?? themeFromContext;
-    if (props.containerWidth <= 0 || props.containerHeight <= 0)
-        return null;
-    const { ovalWidth, ovalHeight, ovalLeft, ovalTop } = computeFaceOvalGeometry(props.containerWidth, props.containerHeight);
-    return (_jsxs(View, { pointerEvents: "none", style: [
-            styles.container,
-            {
-                width: ovalWidth,
-                height: ovalHeight,
-                left: ovalLeft,
-                top: ovalTop,
-            },
-        ], testID: props.testID, children: [props.state.kind === "loading" ? (_jsx(UseSmileIDLoadingIndicator, { theme: theme })) : null, props.state.kind === "success" ? (_jsx(UseSmileIDStatusIndicator, { state: "success", theme: theme })) : null, props.state.kind === "failed" ? (_jsx(UseSmileIDStatusIndicator, { state: "failure", theme: theme })) : null] }));
-}
-const styles = StyleSheet.create({
-    container: {
-        position: "absolute",
-        alignItems: "center",
-        justifyContent: "center",
-    },
-});
-//# sourceMappingURL=use_smile_id_processing_center_indicator.js.map
+"use strict";import{jsx as n,jsxs as m}from"react/jsx-runtime";import{StyleSheet as c,View as h}from"react-native";import{useUseSmileIDTheme as u}from"../theme/theme_context";import{UseSmileIDLoadingIndicator as d}from"./use_smile_id_loading_indicator";import{UseSmileIDStatusIndicator as i}from"./use_smile_id_status_indicator";import{computeFaceOvalGeometry as f}from"./face_oval_defaults";export function UseSmileIDProcessingCenterIndicator(e){const o=u(),t=e.theme??o;if(e.containerWidth<=0||e.containerHeight<=0)return null;const{ovalWidth:s,ovalHeight:a,ovalLeft:r,ovalTop:l}=f(e.containerWidth,e.containerHeight);return m(h,{pointerEvents:"none",style:[I.container,{width:s,height:a,left:r,top:l}],testID:e.testID,children:[e.state.kind==="loading"?n(d,{theme:t}):null,e.state.kind==="success"?n(i,{state:"success",theme:t}):null,e.state.kind==="failed"?n(i,{state:"failure",theme:t}):null]})}const I=c.create({container:{position:"absolute",alignItems:"center",justifyContent:"center"}});

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

@@ -15,4 +15,3 @@ export type UseSmileIDRoundedCheckboxProps = {
  * 2pt border, 60% inner check.
  */
 export declare function UseSmileIDRoundedCheckbox(props: UseSmileIDRoundedCheckboxProps): import("react").JSX.Element;
-//# sourceMappingURL=use_smile_id_rounded_checkbox.d.ts.map

package/dist/presentation/components/use_smile_id_rounded_checkbox.js

@@ -1,41 +1 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Pressable, StyleSheet, View } from "react-native";
-import { useUseSmileIDTheme } from "../theme/theme_context";
-import { SiCheckboxCheck } from "./icons";
-const SIZE = 20;
-const CHECK_SIZE = SIZE * 0.6;
-const RADIUS = 4;
-const BORDER_WIDTH = 2;
-/**
- * Rounded square checkbox primitive — used in the consent screen's
- * "I consent…" row.
- *
- * Filled with `offBlack` and a white check mark when checked;
- * transparent with the `offBlack` border when unchecked. Matches
- * the canonical SDK styling — 20pt outer, 4pt rounded corners,
- * 2pt border, 60% inner check.
- */
-export function UseSmileIDRoundedCheckbox(props) {
-    const themeFromContext = useUseSmileIDTheme();
-    const theme = props.theme ?? themeFromContext;
-    return (_jsx(Pressable, { onPress: () => props.onChange(!props.checked), accessibilityRole: "checkbox", accessibilityState: { checked: props.checked }, testID: props.testID, hitSlop: 8, style: [
-            styles.box,
-            {
-                borderColor: theme.colors.offBlack,
-                backgroundColor: props.checked
-                    ? theme.colors.offBlack
-                    : "transparent",
-            },
-        ], children: props.checked ? (_jsx(View, { children: _jsx(SiCheckboxCheck, { size: CHECK_SIZE, color: theme.colors.offWhite }) })) : null }));
-}
-const styles = StyleSheet.create({
-    box: {
-        width: SIZE,
-        height: SIZE,
-        borderRadius: RADIUS,
-        borderWidth: BORDER_WIDTH,
-        alignItems: "center",
-        justifyContent: "center",
-    },
-});
-//# sourceMappingURL=use_smile_id_rounded_checkbox.js.map
+"use strict";import{jsx as o}from"react/jsx-runtime";import{Pressable as l,StyleSheet as h,View as n}from"react-native";import{useUseSmileIDTheme as r}from"../theme/theme_context";import{useUseSmileIDLocalizations as d}from"../../l10n/use_smile_id_localizations_provider";import{SiCheckboxCheck as a}from"./icons";const i=20,m=i*.6,b=4,k=2;export function UseSmileIDRoundedCheckbox(e){const s=r(),c=d(),t=e.theme??s;return o(l,{onPress:()=>e.onChange(!e.checked),accessibilityRole:"checkbox",accessibilityLabel:c.siCdCheckbox,accessibilityState:{checked:e.checked},accessibilityValue:{text:e.checked?c.siCdCheckboxChecked:c.siCdCheckboxUnchecked},testID:e.testID,hitSlop:8,style:[C.box,{borderColor:t.colors.offBlack,backgroundColor:e.checked?t.colors.offBlack:"transparent"}],children:e.checked?o(n,{children:o(a,{size:m,color:t.colors.offWhite})}):null})}const C=h.create({box:{width:i,height:i,borderRadius:b,borderWidth:k,alignItems:"center",justifyContent:"center"}});

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

@@ -13,4 +13,3 @@ export type UseSmileIDStatusIndicatorProps = {
  *   - failure → filled red close circle
  */
 export declare function UseSmileIDStatusIndicator(props: UseSmileIDStatusIndicatorProps): import("react").JSX.Element;
-//# sourceMappingURL=use_smile_id_status_indicator.d.ts.map

package/dist/presentation/components/use_smile_id_status_indicator.js

@@ -1,22 +1 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { StyleSheet, View } from "react-native";
-import { useUseSmileIDTheme } from "../theme/theme_context";
-import { UseSmileIDLoadingIndicator } from "./use_smile_id_loading_indicator";
-import { SiFilledCheckCircle, SiFilledCloseCircle } from "./icons";
-const SIZE = 64;
-/**
- * Tri-state badge centered inside the processing screen's face oval:
- *
- *   - loading → green arc spinner
- *   - success → filled green check circle
- *   - failure → filled red close circle
- */
-export function UseSmileIDStatusIndicator(props) {
-    const themeFromContext = useUseSmileIDTheme();
-    const theme = props.theme ?? themeFromContext;
-    return (_jsx(View, { style: styles.wrap, testID: props.testID, children: props.state === "loading" ? (_jsx(UseSmileIDLoadingIndicator, { theme: theme, size: SIZE })) : props.state === "success" ? (_jsx(SiFilledCheckCircle, { size: SIZE })) : (_jsx(SiFilledCloseCircle, { size: SIZE })) }));
-}
-const styles = StyleSheet.create({
-    wrap: { alignItems: "center", justifyContent: "center" },
-});
-//# sourceMappingURL=use_smile_id_status_indicator.js.map
+"use strict";import{jsx as t}from"react/jsx-runtime";import{StyleSheet as r,View as m}from"react-native";import{useUseSmileIDTheme as n}from"../theme/theme_context";import{UseSmileIDLoadingIndicator as c}from"./use_smile_id_loading_indicator";import{SiFilledCheckCircle as l,SiFilledCloseCircle as a}from"./icons";const i=64;export function UseSmileIDStatusIndicator(e){const s=n(),o=e.theme??s;return t(m,{style:I.wrap,testID:e.testID,children:e.state==="loading"?t(c,{theme:o,size:i}):e.state==="success"?t(l,{size:i}):t(a,{size:i})})}const I=r.create({wrap:{alignItems:"center",justifyContent:"center"}});

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

@@ -14,4 +14,3 @@ export type UseSmileIDSuccessContentProps = {
  * screen itself, so it doesn't appear twice in the same view.
  */
 export declare function UseSmileIDSuccessContent(props: UseSmileIDSuccessContentProps): import("react").JSX.Element;
-//# sourceMappingURL=use_smile_id_success_content.d.ts.map