@incodetech/prizma-core-screens 0.1.0

package/dist/VideoSelfieRetryScreen.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import { type PrizmaListScreenProps } from './ListScreen';
+import type { PrizmaScreenActionHandler, PrizmaScreenOverrides } from './types';
+import type { VideoSelfieStrings } from './VideoSelfieStrings';
+import './ScreenLayout.css';
+export interface VideoSelfieRetryScreenProps extends Omit<PrizmaListScreenProps, 'status' | 'title' | 'subtitle' | 'children' | 'ctaLabel' | 'secondaryCtaLabel' | 'linkLabel' | 'verifiedLabel' | 'navLabel'> {
+    /** Module copy — this screen reads the `errors.retry` slice. */
+    strings: VideoSelfieStrings;
+    screenId?: string;
+    overrides?: PrizmaScreenOverrides;
+    onAction?: PrizmaScreenActionHandler;
+}
+/**
+ * Video Selfie — the recoverable "something went wrong" with the coaching list,
+ * built on the List archetype (GUIDELINES.md §6-G). Figma: purple section
+ * `video selfie - general errors 14.1 - retry`.
+ *
+ * The one section of group 14 that is NOT archetype F: the middle is a numbered
+ * list of three things to do differently, spanning the column from the top,
+ * which is exactly the distinction `ScreenLayout.css` draws between `__flex`
+ * (centred illustration) and `__list`. The rows are Core's `PrizmaList`
+ * (`variant="circles"`) verbatim, and the Spacing/24 above them is the
+ * archetype's.
+ *
+ * The title carries no status mark — Figma draws the bare H2 here, unlike its
+ * three sibling errors — so the archetype's default `status="none"` stands.
+ * Chrome follows the module's error family (owner rule `#PI-8` / `#F-34`):
+ * header and tag both stay.
+ */
+export declare const VideoSelfieRetryScreen: React.ForwardRefExoticComponent<VideoSelfieRetryScreenProps & React.RefAttributes<HTMLDivElement>>;
+export default VideoSelfieRetryScreen;

package/dist/VideoSelfieRetryScreen.js

@@ -0,0 +1,32 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { PrizmaListItem } from '@incodetech/prizma-core-web/list';
+import { PrizmaListScreen } from './ListScreen';
+import './ScreenLayout.css';
+/**
+ * Video Selfie — the recoverable "something went wrong" with the coaching list,
+ * built on the List archetype (GUIDELINES.md §6-G). Figma: purple section
+ * `video selfie - general errors 14.1 - retry`.
+ *
+ * The one section of group 14 that is NOT archetype F: the middle is a numbered
+ * list of three things to do differently, spanning the column from the top,
+ * which is exactly the distinction `ScreenLayout.css` draws between `__flex`
+ * (centred illustration) and `__list`. The rows are Core's `PrizmaList`
+ * (`variant="circles"`) verbatim, and the Spacing/24 above them is the
+ * archetype's.
+ *
+ * The title carries no status mark — Figma draws the bare H2 here, unlike its
+ * three sibling errors — so the archetype's default `status="none"` stands.
+ * Chrome follows the module's error family (owner rule `#PI-8` / `#F-34`):
+ * header and tag both stay.
+ */
+export const VideoSelfieRetryScreen = forwardRef(({ strings, screenId = 'video-selfie-error-retry', overrides, onAction, ...shell }, ref) => {
+    const slice = strings.errors.retry;
+    return (_jsx(PrizmaListScreen, { ref: ref, title: slice.title, ctaLabel: slice.ctaLabel, verifiedLabel: strings.verifiedLabel, navLabel: strings.navLabel, screenId: screenId, 
+        /* Left-aligned, like `2.5`/`2.6`: a centred headline above a
+           left-led numbered list reads as a mistake (#VS-14). */
+        overrides: { align: 'left', ...overrides }, onAction: onAction, ...shell, children: _jsx("ol", { className: "video-selfie-steps__rows", children: slice.tips.map((tip, i) => (_jsx("li", { children: _jsx(PrizmaListItem, { variant: "number", number: i + 1, label: tip }) }, i))) }) }));
+});
+VideoSelfieRetryScreen.displayName = 'VideoSelfieRetryScreen';
+export default VideoSelfieRetryScreen;

package/dist/VideoSelfieSelfieCaptureScreen.d.ts

@@ -0,0 +1,52 @@
+import React, { type ReactNode } from 'react';
+import { type PrizmaCaptureScreenProps } from './CaptureScreen';
+import type { PrizmaScreenActionHandler, PrizmaScreenOverrides } from './types';
+import type { VideoSelfieFeedbackKind, VideoSelfieStrings } from './VideoSelfieStrings';
+import './ScreenLayout.css';
+/** Which purple liveness section to render (group 8). */
+export type VideoSelfieSelfieState = 'start' | 'processing' | 'success' | 'failed';
+export interface VideoSelfieSelfieCaptureScreenProps extends Omit<PrizmaCaptureScreenProps, 'state' | 'feedbackText' | 'statusLabels' | 'verifiedLabel' | 'navLabel'> {
+    /** Module copy — this screen reads the `selfieCapture` slice. */
+    strings: VideoSelfieStrings;
+    /** Which purple section of group 8 to render. Default `start`. */
+    state?: VideoSelfieSelfieState;
+    /**
+     * Which of group 9's ELEVEN live-feedback lines to show under the ring.
+     * Only meaningful while the ring is live (`state="start"`): the sections of
+     * group 9 are that same frame with a different instruction. Omit for `8.0`,
+     * which shows the plain "Look at your front camera" line.
+     */
+    feedback?: VideoSelfieFeedbackKind;
+    /** Live camera feed (<video>) or sample still (<img>). */
+    camera?: ReactNode;
+    screenId?: string;
+    overrides?: PrizmaScreenOverrides;
+    onAction?: PrizmaScreenActionHandler;
+}
+/**
+ * Video Selfie — the liveness ring (Archetype B, GUIDELINES.md §6-B).
+ * ONE screen for FIFTEEN purple sections: `selfie capture 8.0–8.3` and every
+ * `selfie capture feedback 9.1–9.11` message. They are `state` × `feedbackText`
+ * variants of Core's `PrizmaSelfieCapture`, which owns the ring, the
+ * silhouette, the ring offset (40), the instruction gap (32), the instruction
+ * typography and every verdict treatment. None of it is re-implemented (§7),
+ * and this file declares no layout at all.
+ *
+ * **Figma vs Core — Core wins, reported.** These sections draw the camera
+ * FULL-BLEED behind a scrimmed ring, on a black surface. Core's
+ * `PrizmaSelfieCapture` puts the feed inside the ring's circular window on a
+ * light surface, and pins light while the feed is open on purpose — "the
+ * capture screen stays WHITE in both modes, light is needed for the shot"
+ * (owner decision 2026-07-14, DEVIATIONS #F-27). Reshaping it here would mean
+ * re-implementing a Core primitive with a second full-bleed recipe, so the
+ * screen ships Core's treatment and the divergence is logged, exactly as the
+ * Face Capture pilot settled it.
+ *
+ * Figma also draws the journey stepper at the top of all fifteen sections.
+ * Archetype B has no slot for it and this module does not hand-roll one —
+ * reported. Nothing collapses without it: the four states and the eleven
+ * messages already render distinctly through Core's own ring treatments and
+ * instruction copy.
+ */
+export declare const VideoSelfieSelfieCaptureScreen: React.ForwardRefExoticComponent<VideoSelfieSelfieCaptureScreenProps & React.RefAttributes<HTMLDivElement>>;
+export default VideoSelfieSelfieCaptureScreen;

package/dist/VideoSelfieSelfieCaptureScreen.js

@@ -0,0 +1,58 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { PrizmaCaptureScreen } from './CaptureScreen';
+import './ScreenLayout.css';
+/** Purple state → Core `PrizmaSelfieCapture` state. Core models the in-flight
+ *  and verdict beats as capture STATES — the ring dissolves into the spinner or
+ *  the status mark in its own slot (DEVIATIONS #11) — so all four are one
+ *  archetype call, not a separate processing screen. */
+const CAPTURE_STATE = {
+    start: 'ready',
+    processing: 'uploading',
+    success: 'success',
+    failed: 'error',
+};
+/**
+ * Video Selfie — the liveness ring (Archetype B, GUIDELINES.md §6-B).
+ * ONE screen for FIFTEEN purple sections: `selfie capture 8.0–8.3` and every
+ * `selfie capture feedback 9.1–9.11` message. They are `state` × `feedbackText`
+ * variants of Core's `PrizmaSelfieCapture`, which owns the ring, the
+ * silhouette, the ring offset (40), the instruction gap (32), the instruction
+ * typography and every verdict treatment. None of it is re-implemented (§7),
+ * and this file declares no layout at all.
+ *
+ * **Figma vs Core — Core wins, reported.** These sections draw the camera
+ * FULL-BLEED behind a scrimmed ring, on a black surface. Core's
+ * `PrizmaSelfieCapture` puts the feed inside the ring's circular window on a
+ * light surface, and pins light while the feed is open on purpose — "the
+ * capture screen stays WHITE in both modes, light is needed for the shot"
+ * (owner decision 2026-07-14, DEVIATIONS #F-27). Reshaping it here would mean
+ * re-implementing a Core primitive with a second full-bleed recipe, so the
+ * screen ships Core's treatment and the divergence is logged, exactly as the
+ * Face Capture pilot settled it.
+ *
+ * Figma also draws the journey stepper at the top of all fifteen sections.
+ * Archetype B has no slot for it and this module does not hand-roll one —
+ * reported. Nothing collapses without it: the four states and the eleven
+ * messages already render distinctly through Core's own ring treatments and
+ * instruction copy.
+ */
+export const VideoSelfieSelfieCaptureScreen = forwardRef(({ strings, state = 'start', feedback, camera, screenId = `video-selfie-selfie-capture-${feedback ?? state}`, overrides, onAction, ...shell }, ref) => {
+    const slice = strings.selfieCapture;
+    /* The live ring carries an instruction; the in-flight and verdict beats
+       carry Core's own status copy instead (its `statusLabels` slot), which is
+       why the feedback line is scoped to the live state. */
+    const feedbackText = CAPTURE_STATE[state] === 'ready'
+        ? feedback
+            ? slice.feedback[feedback]
+            : slice.startLabel
+        : undefined;
+    return (_jsx(PrizmaCaptureScreen, { ref: ref, state: CAPTURE_STATE[state], cameraOpen: state === 'start', camera: camera, feedbackText: feedbackText, statusLabels: {
+            uploading: slice.processingLabel,
+            success: slice.successLabel,
+            error: slice.failedLabel,
+        }, verifiedLabel: strings.verifiedLabel, navLabel: strings.navLabel, screenId: screenId, overrides: overrides, onAction: onAction, ...shell }));
+});
+VideoSelfieSelfieCaptureScreen.displayName = 'VideoSelfieSelfieCaptureScreen';
+export default VideoSelfieSelfieCaptureScreen;

package/dist/VideoSelfieSpeakScreen.d.ts

@@ -0,0 +1,64 @@
+import React, { type ReactNode } from 'react';
+import { type PrizmaScreenShellProps } from './ScreenShell';
+import type { PrizmaScreenActionHandler, PrizmaScreenOverrides } from './types';
+import type { VideoSelfieDocumentType, VideoSelfieSpeakFamily, VideoSelfieStrings } from './VideoSelfieStrings';
+import './ScreenLayout.css';
+import './ViewfinderScreen.css';
+import './VideoSelfieLayout.css';
+/** Which purple section of groups 10 / 11 to render. */
+export type VideoSelfieSpeakStage = 'idle' | 'recording' | 'processing' | 'success' | 'confirm';
+export interface VideoSelfieSpeakScreenProps extends Omit<PrizmaScreenShellProps, 'dark' | 'title' | 'children'> {
+    /** Module copy — this screen reads the `speak` slice. */
+    strings: VideoSelfieStrings;
+    /** Which prompt family: the consent sentence (group 10) or the identity
+     *  questions (group 11). Default `voiceConsent`. */
+    family?: VideoSelfieSpeakFamily;
+    /** Which prompt of the family to show. Default `0`. */
+    promptIndex?: number;
+    /** Which purple section to render. Default `idle`. */
+    stage?: VideoSelfieSpeakStage;
+    /** Which document the journey collects — the Stepper's own `documentType`. */
+    documentType?: VideoSelfieDocumentType;
+    /** Live camera feed (<video>) or sample still (<img>). */
+    camera?: ReactNode;
+    screenId?: string;
+    overrides?: PrizmaScreenOverrides;
+    onAction?: PrizmaScreenActionHandler;
+}
+/**
+ * Video Selfie — the spoken steps. ONE screen for ELEVEN purple sections:
+ * `voice consent 10.0–10.4` and `questions 11.0–11.5`. The two Figma groups
+ * draw the identical skeleton — the live camera under Core's Modal card, the
+ * journey stepper on top — and differ only in which prompt the card asks and
+ * which beat of the stepper is lit. Two files would have been two chances to
+ * drift, the same reasoning `GeolocationBrowserStepsScreen` settled for its
+ * nine browser sections.
+ *
+ * No archetype models "a card over a live camera": archetype A's `overlay` slot
+ * is the closest, but its base is a tutorial, not a viewfinder. So this screen
+ * owns its composition the way archetype D is owned (a recipe, not a
+ * component), reusing the foundation's camera-surface and HUD-typography
+ * classes verbatim (`.prizma-viewfinder__surface` / `__content` / `__title`).
+ * The card itself is Core's `PrizmaModalContent` — the exact instance Figma
+ * names (`modal-light`) — and the scrim/panel positioning is the recipe
+ * Document Capture's method sheet already established (DEVIATIONS #DC-30): the
+ * safe presenter portals to `document.body`, which would escape the 390×844
+ * frame and the host's `transform: scale()`.
+ *
+ * Two divergences from the frames, both Core-wins and both reported:
+ *
+ * - **Eyebrow position.** Figma stacks "Please say out loud" ABOVE the prompt.
+ *   Core's Modal renders `subtitle` BELOW `title` and has no eyebrow slot, so
+ *   the eyebrow ships as the subtitle.
+ * - **Leading media.** Figma puts the spinner / verdict mark ABOVE the label on
+ *   the `processing` and `success` cards. Core's Modal renders `body` and
+ *   `image` after the heading; a Core `leading` slot is requested.
+ *
+ * Every stage renders differently: `idle` draws the outlined "Tap to answer",
+ * `recording` swaps it for the filled "Tap when done" AND lights the sound-wave
+ * HUD over the camera, `processing` replaces the card body with Core's spinner,
+ * `success` with the verdict mark, and `confirm` dims the whole screen behind a
+ * centred two-button dialog.
+ */
+export declare const VideoSelfieSpeakScreen: React.ForwardRefExoticComponent<VideoSelfieSpeakScreenProps & React.RefAttributes<HTMLDivElement>>;
+export default VideoSelfieSpeakScreen;

package/dist/VideoSelfieSpeakScreen.js

@@ -0,0 +1,95 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { IconSoundWave, IconStatusPositive } from '@incodetech/prizma-core-icons';
+import { PrizmaLoadingSpinner } from '@incodetech/prizma-core-web/loading-spinner';
+import { PrizmaModalContent } from '@incodetech/prizma-core-web/modal';
+import { PrizmaStepper } from '@incodetech/prizma-core-web/stepper';
+import { PrizmaScreenShell } from './ScreenShell';
+import './ScreenLayout.css';
+import './ViewfinderScreen.css';
+import './VideoSelfieLayout.css';
+/** Which beat of the seven-step journey each spoken family occupies — the
+ *  questions are step 6, the consent sentence is the last one. */
+const STEP = { question: 6, voiceConsent: 7 };
+/**
+ * Video Selfie — the spoken steps. ONE screen for ELEVEN purple sections:
+ * `voice consent 10.0–10.4` and `questions 11.0–11.5`. The two Figma groups
+ * draw the identical skeleton — the live camera under Core's Modal card, the
+ * journey stepper on top — and differ only in which prompt the card asks and
+ * which beat of the stepper is lit. Two files would have been two chances to
+ * drift, the same reasoning `GeolocationBrowserStepsScreen` settled for its
+ * nine browser sections.
+ *
+ * No archetype models "a card over a live camera": archetype A's `overlay` slot
+ * is the closest, but its base is a tutorial, not a viewfinder. So this screen
+ * owns its composition the way archetype D is owned (a recipe, not a
+ * component), reusing the foundation's camera-surface and HUD-typography
+ * classes verbatim (`.prizma-viewfinder__surface` / `__content` / `__title`).
+ * The card itself is Core's `PrizmaModalContent` — the exact instance Figma
+ * names (`modal-light`) — and the scrim/panel positioning is the recipe
+ * Document Capture's method sheet already established (DEVIATIONS #DC-30): the
+ * safe presenter portals to `document.body`, which would escape the 390×844
+ * frame and the host's `transform: scale()`.
+ *
+ * Two divergences from the frames, both Core-wins and both reported:
+ *
+ * - **Eyebrow position.** Figma stacks "Please say out loud" ABOVE the prompt.
+ *   Core's Modal renders `subtitle` BELOW `title` and has no eyebrow slot, so
+ *   the eyebrow ships as the subtitle.
+ * - **Leading media.** Figma puts the spinner / verdict mark ABOVE the label on
+ *   the `processing` and `success` cards. Core's Modal renders `body` and
+ *   `image` after the heading; a Core `leading` slot is requested.
+ *
+ * Every stage renders differently: `idle` draws the outlined "Tap to answer",
+ * `recording` swaps it for the filled "Tap when done" AND lights the sound-wave
+ * HUD over the camera, `processing` replaces the card body with Core's spinner,
+ * `success` with the verdict mark, and `confirm` dims the whole screen behind a
+ * centred two-button dialog.
+ */
+export const VideoSelfieSpeakScreen = forwardRef(({ strings, family = 'voiceConsent', promptIndex = 0, stage = 'idle', documentType = 'id', camera, screenId = `video-selfie-${family}-${stage}`, overrides, onAction, className, ...shell }, ref) => {
+    const slice = strings.speak[family];
+    const prompt = slice.prompts[promptIndex] ?? slice.prompts[0] ?? '';
+    const isConfirm = stage === 'confirm';
+    const card = isConfirm ? (_jsx(PrizmaModalContent, { title: slice.confirm.title, subtitle: slice.confirm.subtitle, showCloseIcon: false, buttonGroupProps: {
+            orientation: 'vertical-v1',
+            showPrimary: true,
+            showSecondary: true,
+            primaryLabel: slice.confirm.ctaLabel,
+            onPrimaryClick: () => onAction?.({ type: 'cta', screenId }),
+            secondaryLabel: slice.confirm.retryLabel,
+            onSecondaryClick: () => onAction?.({ type: 'secondary', screenId }),
+        } })) : stage === 'processing' ? (_jsx(PrizmaModalContent, { title: slice.processingLabel, showButtonGroup: false, closeLabel: slice.closeLabel, onClose: () => onAction?.({ type: 'tertiary', screenId }), body: _jsx(PrizmaLoadingSpinner, { loadingLabel: slice.processingLabel }) })) : stage === 'success' ? (_jsx(PrizmaModalContent, { title: slice.successLabel, showButtonGroup: false, closeLabel: slice.closeLabel, onClose: () => onAction?.({ type: 'tertiary', screenId }), body: _jsx("span", { className: "video-selfie-sheet-status", children: _jsx(IconStatusPositive, { size: "xl" }) }) })) : (_jsx(PrizmaModalContent, { title: prompt, subtitle: slice.eyebrow, 
+        /* No dismiss ✕ on the record step: the sheet IS the step, and closing it
+           would strand the user mid-recording with no way back into the flow
+           (owner-reported 2026-08-19). The confirm sheet already suppressed it;
+           this is the same call, applied consistently. DEVIATIONS #VS-5. */
+        showCloseIcon: false, buttonGroupProps: stage === 'recording'
+            ? {
+                orientation: 'vertical-v1',
+                showPrimary: true,
+                showSecondary: false,
+                primaryLabel: slice.recordingCtaLabel,
+                onPrimaryClick: () => onAction?.({ type: 'cta', screenId }),
+            }
+            : {
+                orientation: 'vertical-v1',
+                showPrimary: false,
+                showSecondary: true,
+                secondaryLabel: slice.idleCtaLabel,
+                onSecondaryClick: () => onAction?.({ type: 'cta', screenId }),
+            } }));
+    return (_jsxs(PrizmaScreenShell, { ref: ref, dark: true, className: className, ...shell, children: [_jsx("div", { className: "prizma-viewfinder__surface", children: camera }), _jsx("div", { className: "video-selfie-stepper", children: _jsx(PrizmaStepper, { steps: 7, currentState: STEP[family], documentType: documentType, completedValueText: strings.stepperCompletedLabel }) }), _jsx("div", { className: [
+                    'prizma-viewfinder__content',
+                    overrides?.align === 'left' ? 'prizma-viewfinder__content--left' : '',
+                ]
+                    .filter(Boolean)
+                    .join(' '), children: _jsx("div", { className: "video-selfie-band", children: stage === 'recording' ? (_jsxs("span", { className: "video-selfie-recording", children: [_jsx(IconSoundWave, { size: "xl" }), _jsx("span", { className: "prizma-viewfinder__title", children: slice.recordingLabel })] })) : null }) }), isConfirm ? (_jsx("div", { className: "video-selfie-sheet-scrim", "aria-hidden": "true" })) : null, _jsx("div", { "data-prizma-theme": "light", className: [
+                    'video-selfie-sheet-panel',
+                    isConfirm ? 'video-selfie-sheet-panel--centered' : '',
+                ]
+                    .filter(Boolean)
+                    .join(' '), children: card })] }));
+});
+VideoSelfieSpeakScreen.displayName = 'VideoSelfieSpeakScreen';
+export default VideoSelfieSpeakScreen;

package/dist/VideoSelfieStrings.d.ts

@@ -0,0 +1,196 @@
+/** Which document the journey is collecting — drives the tutorial row list
+ *  and Core's `PrizmaStepper` icon sequence. */
+export type VideoSelfieDocumentType = 'id' | 'passport';
+/** One icon + label row of the tutorial's "you'll be requested to" list. */
+export interface VideoSelfieTutorialRow {
+    /** Which canonical bank glyph leads the row. */
+    kind: VideoSelfieTutorialRowKind;
+    label: string;
+}
+/**
+ * The seven beats of the journey, in Figma order. They double as the icon keys
+ * for the tutorial rows — the same seven glyphs Core's `PrizmaStepper` uses
+ * (its icon set is documented as "the Video Selfie sequence").
+ */
+export type VideoSelfieTutorialRowKind = 'recording' | 'idFront' | 'idBack' | 'passport' | 'frontCamera' | 'waveHand' | 'questions' | 'speak';
+/** The eleven live-feedback messages of group 9, in Figma order. */
+export type VideoSelfieFeedbackKind = 'dark' | 'blurry' | 'maskDetected' | 'glassesDetected' | 'headTilted' | 'lookAtCamera' | 'turnRight' | 'turnLeft' | 'alignFace' | 'moveCloser' | 'moveAway';
+/** Which face of the document the ID stage is on (groups 3 and 5). */
+export type VideoSelfieIdSide = 'front' | 'back';
+/** Why an ID read was rejected (group 6, the `.1`–`.4` variants). */
+/**
+ * REMOVED (2026-08-19). A rejection-REASON axis (`scanFailed | name | photo |
+ * typeMismatch`) was invented: group 6 draws exactly FOUR sections —
+ * `6.1.1`/`6.2.1` (front try-again / failed) and `6.3.1`/`6.4.1` (back) — with
+ * no reason axis at all, so the four kinds multiplied the gallery to 16 error
+ * cards where the spec has 4. Severity is the only real axis. DEVIATIONS #VS-1.
+ */
+/** Whether the rejection invites a retry (`6.1` / `6.3`) or is terminal
+ *  (`6.2` / `6.4`). */
+export type VideoSelfieIdErrorSeverity = 'tryAgain' | 'failed';
+/** Which prompt family the speak step is running: the consent sentence
+ *  (group 10) or one of the identity questions (group 11). */
+export type VideoSelfieSpeakFamily = 'voiceConsent' | 'question';
+/**
+ * Which device family the settings walk-through documents. The purple section
+ * `permissions 2.5 - camera access instructions` holds TWO Incode-drawn
+ * symbols, not one: `2.5 - ios` and `2.6 - android`. They are NOT the same
+ * screen with translated copy — Android draws a SECOND five-step numbered list
+ * under "Screen recording permission" where iOS draws a one-line remark, and
+ * adds a closing note under both lists.
+ */
+export type VideoSelfieStepsOs = 'ios' | 'android';
+/** One device variant of the OS settings walk-through (`2.5` / `2.6`). */
+export interface VideoSelfieStepsStrings {
+    title: string;
+    subtitle: string;
+    /** Label over the first numbered list. */
+    microphoneTitle: string;
+    /** The five numbered microphone rows — different wording per OS. */
+    microphoneSteps: string[];
+    /** Label over the screen-recording section. */
+    recordingTitle: string;
+    /** iOS (`2.5`) closes the recording section with a plain remark and NO steps.
+     *  Read only when `recordingSteps` is absent. */
+    recordingNote?: string;
+    /** Android (`2.6`) draws a SECOND numbered list here instead of the remark. */
+    recordingSteps?: string[];
+    /** Android (`2.6`) only — the closing remark under both lists. */
+    closingNote?: string;
+    ctaLabel: string;
+}
+export interface VideoSelfieSpeakStrings {
+    /** Small line above the prompt ("Please say out loud"). */
+    eyebrow: string;
+    /** The sentences/questions the user must speak, in Figma order. */
+    prompts: string[];
+    /** CTA before recording starts. */
+    idleCtaLabel: string;
+    /** CTA while recording. */
+    recordingCtaLabel: string;
+    /** HUD line over the camera while recording ("Recording…"). */
+    recordingLabel: string;
+    /** In-flight card copy. */
+    processingLabel: string;
+    /** Accepted card copy. */
+    successLabel: string;
+    /** Accessible name for the card's dismiss control. */
+    closeLabel: string;
+    /** The "Finished speaking?" confirmation dialog (10.4). */
+    confirm: {
+        title: string;
+        subtitle: string;
+        ctaLabel: string;
+        retryLabel: string;
+    };
+}
+export interface VideoSelfieStrings {
+    /** Accessible name for the nav region. */
+    navLabel: string;
+    /** "verified by" attribution copy for the footer tag. */
+    verifiedLabel: string;
+    /** Accessible name Core's Stepper announces when the journey is done. */
+    stepperCompletedLabel: string;
+    /** Group 1 — tutorial (`1.0` id · `1.2` passport). */
+    tutorial: {
+        title: string;
+        subtitle: string;
+        ctaLabel: string;
+        /** Row list per document type — the two purple variants. */
+        rows: Record<VideoSelfieDocumentType, VideoSelfieTutorialRow[]>;
+    };
+    /** Group 2 — permissions. */
+    permission: {
+        /** `2.0` — the in-page request. */
+        request: {
+            title: string;
+            subtitle: string;
+            ctaLabel: string;
+            learnMoreLabel: string;
+        };
+        /** `2.2` — permission refused / required. */
+        required: {
+            title: string;
+            rows: string[];
+            ctaLabel: string;
+            quitLabel: string;
+        };
+        /** `2.5` / `2.6` — the OS settings walk-through, one entry per device
+         *  family. Both symbols live inside the SAME purple section. */
+        steps: Record<VideoSelfieStepsOs, VideoSelfieStepsStrings>;
+    };
+    /** Groups 3 · 5 · 6 — the document stage. */
+    idCapture: {
+        /** In-flight label under the frame (`3.2` / `5.2`). */
+        processingLabel: string;
+        /** Accepted label (`3.3` / `5.3`). */
+        successLabel: string;
+        /** Rejection copy, keyed reason → severity (group 6). */
+        /** Rejection copy per severity (group 6: try-again vs failed). */
+        errors: Record<VideoSelfieIdErrorSeverity, string>;
+    };
+    /** Group 4 — the flip interstitial. */
+    flipId: {
+        title: string;
+    };
+    /** Group 7 — the camera swap interstitial. */
+    flipCamera: {
+        title: string;
+    };
+    /** Groups 8 · 9 — the liveness ring. */
+    selfieCapture: {
+        /** `8.0` instruction. */
+        startLabel: string;
+        /** `8.1` in-flight. */
+        processingLabel: string;
+        /** `8.2` accepted. */
+        successLabel: string;
+        /** `8.3` rejected. */
+        failedLabel: string;
+        /** Group 9 — the eleven live-feedback lines. */
+        feedback: Record<VideoSelfieFeedbackKind, string>;
+    };
+    /** Groups 10 · 11 — the spoken steps. */
+    speak: Record<VideoSelfieSpeakFamily, VideoSelfieSpeakStrings>;
+    /** Group 12. */
+    processing: {
+        title: string;
+        subtitle: string;
+    };
+    /** Group 13. */
+    success: {
+        title: string;
+    };
+    /** Group 14 — the generic errors. */
+    errors: {
+        /** `14.0` — the module could not process the recording. */
+        processingFailed: {
+            title: string;
+            subtitle: string;
+            ctaLabel: string;
+        };
+        /** `14.1` — recoverable, with the "how to do better" list. */
+        retry: {
+            title: string;
+            tips: string[];
+            ctaLabel: string;
+        };
+        /** `14.2` — a single step blew up (drawn on the dark camera surface). */
+        stepError: {
+            title: string;
+            ctaLabel: string;
+        };
+        /** `14.3` — the whole module blew up. */
+        moduleError: {
+            title: string;
+            ctaLabel: string;
+            quitLabel: string;
+        };
+        /** `14.4` — connectivity. */
+        noConnection: {
+            title: string;
+            ctaLabel: string;
+            quitLabel: string;
+        };
+    };
+}

package/dist/VideoSelfieStrings.js

@@ -0,0 +1,14 @@
+// Video Selfie — module copy contract.
+//
+// Every string the module's screens render arrives through this shape: the
+// screens themselves ship NO English (GUIDELINES.md §9, same rule as
+// prizma-core-web). Figma: `🎥 Video selfie - Screens specs & behavior`
+// (X1clC8Sf8V0vJ1CbD61VJu, page 2013:23309) — 14 numbered groups holding 54
+// purple spec sections.
+//
+// The slice names track the Figma group numbers so a designer can go from a
+// frame to a key without a translation table:
+//   tutorial (1) · permission (2) · idCapture (3 · 5 · 6) · flipId (4) ·
+//   flipCamera (7) · selfieCapture (8 · 9) · speak (10 · 11) ·
+//   processing (12) · success (13) · errors (14).
+export {};

package/dist/VideoSelfieSuccessScreen.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import { type PrizmaProcessingScreenProps } from './ProcessingScreen';
+import type { PrizmaScreenActionHandler, PrizmaScreenOverrides } from './types';
+import type { VideoSelfieStrings } from './VideoSelfieStrings';
+import './ScreenLayout.css';
+export interface VideoSelfieSuccessScreenProps extends Omit<PrizmaProcessingScreenProps, 'status' | 'title' | 'subtitle' | 'verifiedLabel' | 'navLabel'> {
+    /** Module copy — this screen reads the `success` slice. */
+    strings: VideoSelfieStrings;
+    screenId?: string;
+    overrides?: PrizmaScreenOverrides;
+    onAction?: PrizmaScreenActionHandler;
+}
+/**
+ * Video Selfie — the module's verdict, built on the Processing archetype
+ * (GUIDELINES.md §6-C). Figma: purple section `video selfie - success
+ * 13.0 - default`.
+ *
+ * The same skeleton as the processing screen with the spinner swapped for
+ * Core's positive status mark and no supporting line — which is precisely the
+ * `status` axis archetype C already models, so the two screens cannot drift
+ * apart. Still archetype C rather than F: the section carries no button at all
+ * (the host advances the flow).
+ */
+export declare const VideoSelfieSuccessScreen: React.ForwardRefExoticComponent<VideoSelfieSuccessScreenProps & React.RefAttributes<HTMLDivElement>>;
+export default VideoSelfieSuccessScreen;

package/dist/VideoSelfieSuccessScreen.js

@@ -0,0 +1,19 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { PrizmaProcessingScreen, } from './ProcessingScreen';
+import './ScreenLayout.css';
+/**
+ * Video Selfie — the module's verdict, built on the Processing archetype
+ * (GUIDELINES.md §6-C). Figma: purple section `video selfie - success
+ * 13.0 - default`.
+ *
+ * The same skeleton as the processing screen with the spinner swapped for
+ * Core's positive status mark and no supporting line — which is precisely the
+ * `status` axis archetype C already models, so the two screens cannot drift
+ * apart. Still archetype C rather than F: the section carries no button at all
+ * (the host advances the flow).
+ */
+export const VideoSelfieSuccessScreen = forwardRef(({ strings, screenId = 'video-selfie-success', showHeader = true, overrides, onAction, ...shell }, ref) => (_jsx(PrizmaProcessingScreen, { ref: ref, showHeader: showHeader, status: "success", title: strings.success.title, verifiedLabel: strings.verifiedLabel, navLabel: strings.navLabel, screenId: screenId, overrides: overrides, onAction: onAction, ...shell })));
+VideoSelfieSuccessScreen.displayName = 'VideoSelfieSuccessScreen';
+export default VideoSelfieSuccessScreen;

package/dist/VideoSelfieTutorialScreen.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { type PrizmaListScreenProps } from './ListScreen';
+import type { PrizmaScreenActionHandler, PrizmaScreenOverrides } from './types';
+import type { VideoSelfieDocumentType, VideoSelfieStrings } from './VideoSelfieStrings';
+import './ScreenLayout.css';
+export interface VideoSelfieTutorialScreenProps extends Omit<PrizmaListScreenProps, 'status' | 'title' | 'subtitle' | 'children' | 'ctaLabel' | 'secondaryCtaLabel' | 'linkLabel' | 'verifiedLabel' | 'navLabel'> {
+    /** Module copy — this screen reads the `tutorial` slice. */
+    strings: VideoSelfieStrings;
+    /** Which purple tutorial section: `1.0` (id) or `1.2` (passport). Default
+     *  `id`. The two differ ONLY in the row list — the passport journey collects
+     *  one photo page instead of a front and a back. */
+    documentType?: VideoSelfieDocumentType;
+    screenId?: string;
+    overrides?: PrizmaScreenOverrides;
+    onAction?: PrizmaScreenActionHandler;
+}
+/**
+ * Video Selfie — tutorial, built on the List archetype (GUIDELINES.md §6-G,
+ * `PrizmaListScreen`). Figma: purple sections `video selfie - tutorial 1.0`
+ * and `1.2 - with passport`.
+ *
+ * The screen is a title block over a promise list and one CTA, which is exactly
+ * archetype G: the rows are Core's `PrizmaListItem` (`icon-m`) verbatim (only
+ * the leading glyph is chosen here, from `ROW_ICONS`), the Spacing/24 above the
+ * list is the archetype's `__list`, and the band is the archetype's. This file
+ * declares no layout of its own.
+ *
+ * NOT archetype A: A centres one illustration in the flexible middle; here the
+ * middle is a seven-row list that must span the column and start at the top —
+ * the distinction `ScreenLayout.css` draws between `__flex` and `__list`.
+ */
+export declare const VideoSelfieTutorialScreen: React.ForwardRefExoticComponent<VideoSelfieTutorialScreenProps & React.RefAttributes<HTMLDivElement>>;
+export default VideoSelfieTutorialScreen;