@incodetech/prizma-core-screens 0.1.3 → 0.2.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (80) hide show
  1. package/dist/DemoScreensConfigScreen.d.ts +36 -0
  2. package/dist/DemoScreensConfigScreen.js +30 -0
  3. package/dist/DemoScreensConfigSheetScreen.d.ts +39 -0
  4. package/dist/DemoScreensConfigSheetScreen.js +33 -0
  5. package/dist/DemoScreensEditSheetScreen.d.ts +30 -0
  6. package/dist/DemoScreensEditSheetScreen.js +28 -0
  7. package/dist/DemoScreensEndScreen.d.ts +9 -21
  8. package/dist/DemoScreensEndScreen.js +9 -14
  9. package/dist/DemoScreensLaunchScreen.d.ts +28 -0
  10. package/dist/DemoScreensLaunchScreen.js +26 -0
  11. package/dist/DemoScreensLayout.css +542 -0
  12. package/dist/DemoScreensRedirectScreen.d.ts +50 -0
  13. package/dist/DemoScreensRedirectScreen.js +38 -0
  14. package/dist/DemoScreensResultScreen.d.ts +52 -0
  15. package/dist/DemoScreensResultScreen.js +46 -0
  16. package/dist/DemoScreensRunningScreen.d.ts +22 -0
  17. package/dist/DemoScreensRunningScreen.js +16 -0
  18. package/dist/DemoScreensSettingsScreen.d.ts +37 -0
  19. package/dist/DemoScreensSettingsScreen.js +40 -0
  20. package/dist/DemoScreensSplashScreen.d.ts +27 -0
  21. package/dist/DemoScreensSplashScreen.js +25 -0
  22. package/dist/DemoScreensStartScreen.d.ts +38 -0
  23. package/dist/DemoScreensStartScreen.js +37 -0
  24. package/dist/DemoScreensStrings.d.ts +192 -0
  25. package/dist/DemoScreensStrings.js +11 -11
  26. package/dist/DemoScreensTermsScreen.d.ts +28 -0
  27. package/dist/DemoScreensTermsScreen.js +26 -0
  28. package/dist/EkybAddressDetailsScreen.js +9 -5
  29. package/dist/EkybBusinessDetailsScreen.js +6 -3
  30. package/dist/EkybOwnersScreen.d.ts +4 -0
  31. package/dist/EkybOwnersScreen.js +13 -5
  32. package/dist/EkybStrings.d.ts +12 -1
  33. package/dist/EkycCountryCatalog.d.ts +46 -0
  34. package/dist/EkycCountryCatalog.js +139 -0
  35. package/dist/EkycCountryFormScreen.d.ts +36 -0
  36. package/dist/EkycCountryFormScreen.js +94 -0
  37. package/dist/EkycDetailsScreen.js +11 -4
  38. package/dist/EkycLayout.css +23 -0
  39. package/dist/EkycLicenseScreen.js +7 -3
  40. package/dist/EkycStrings.d.ts +26 -0
  41. package/dist/FaceMatchComparisonScreen.d.ts +4 -2
  42. package/dist/FaceMatchComparisonScreen.js +3 -1
  43. package/dist/FaceMatchLayout.css +53 -3
  44. package/dist/FormScreen.css +74 -0
  45. package/dist/FormScreen.d.ts +17 -0
  46. package/dist/FormScreen.js +12 -1
  47. package/dist/index.d.ts +15 -2
  48. package/dist/index.js +13 -0
  49. package/dist/styles.css +1 -0
  50. package/package.json +64 -3
  51. package/src/DemoScreensConfigScreen.tsx +101 -0
  52. package/src/DemoScreensConfigSheetScreen.tsx +120 -0
  53. package/src/DemoScreensEditSheetScreen.tsx +103 -0
  54. package/src/DemoScreensEndScreen.tsx +14 -38
  55. package/src/DemoScreensLaunchScreen.tsx +96 -0
  56. package/src/DemoScreensLayout.css +542 -0
  57. package/src/DemoScreensRedirectScreen.tsx +190 -0
  58. package/src/DemoScreensResultScreen.tsx +115 -0
  59. package/src/DemoScreensRunningScreen.tsx +45 -0
  60. package/src/DemoScreensSettingsScreen.tsx +101 -0
  61. package/src/DemoScreensSplashScreen.tsx +47 -0
  62. package/src/DemoScreensStartScreen.tsx +105 -0
  63. package/src/DemoScreensStrings.ts +204 -11
  64. package/src/DemoScreensTermsScreen.tsx +82 -0
  65. package/src/EkybAddressDetailsScreen.tsx +7 -1
  66. package/src/EkybBusinessDetailsScreen.tsx +6 -1
  67. package/src/EkybOwnersScreen.tsx +46 -2
  68. package/src/EkybStrings.ts +12 -0
  69. package/src/EkycCountryCatalog.ts +199 -0
  70. package/src/EkycCountryFormScreen.tsx +184 -0
  71. package/src/EkycDetailsScreen.tsx +29 -20
  72. package/src/EkycLayout.css +23 -0
  73. package/src/EkycLicenseScreen.tsx +22 -16
  74. package/src/EkycStrings.ts +25 -0
  75. package/src/FaceMatchComparisonScreen.tsx +11 -3
  76. package/src/FaceMatchLayout.css +53 -3
  77. package/src/FormScreen.css +74 -0
  78. package/src/FormScreen.tsx +27 -1
  79. package/src/index.ts +65 -1
  80. package/src/styles.css +1 -0
@@ -0,0 +1,36 @@
1
+ import React from 'react';
2
+ import { type PrizmaScreenShellProps } from './ScreenShell';
3
+ import type { PrizmaScreenActionHandler, PrizmaScreenOverrides } from './types';
4
+ import type { DemoScreensStrings } from './DemoScreensStrings';
5
+ import './ScreenLayout.css';
6
+ import './DemoScreensLayout.css';
7
+ /**
8
+ * The five states the `Configuration` section draws:
9
+ * - `empty` `demo_2` — placeholders, CTA disabled
10
+ * - `filled` `demo_4` — Client ID typed, environment chosen
11
+ * - `environmentOpen` `demo_4` — the environment menu open
12
+ * - `custom` `demo_3` — environment "Custom" reveals the URL field
13
+ * - `error` `Error Client ID` — the backend rejected the ID
14
+ */
15
+ export type DemoScreensConfigState = 'empty' | 'filled' | 'environmentOpen' | 'custom' | 'error';
16
+ export interface DemoScreensConfigScreenProps extends Omit<PrizmaScreenShellProps, 'dark' | 'title' | 'children'> {
17
+ /** Family copy — this screen reads the `config` slice. */
18
+ strings: DemoScreensStrings;
19
+ state?: DemoScreensConfigState;
20
+ screenId?: string;
21
+ overrides?: PrizmaScreenOverrides;
22
+ onAction?: PrizmaScreenActionHandler;
23
+ }
24
+ /**
25
+ * Demo screens · NATIVE — the configuration form, `Configuration` (2010:4704)
26
+ * in `Demo App - Latest Design`: the logo nav, Client ID, Environment, and a
27
+ * URL field once the environment is Custom. Continue stays disabled until
28
+ * both fields hold a value.
29
+ *
30
+ * Archetype E's shape without E's title: the frame draws no heading, and
31
+ * `PrizmaFormScreen` insists on one (DEVIATIONS #GEN-13), so the screen
32
+ * composes the nav and E's layout classes itself. Fields and CTA are Core's.
33
+ * The keyboard on the typing frames is OS chrome and is not drawn (#DC-20).
34
+ */
35
+ export declare const DemoScreensConfigScreen: React.ForwardRefExoticComponent<DemoScreensConfigScreenProps & React.RefAttributes<HTMLDivElement>>;
36
+ export default DemoScreensConfigScreen;
@@ -0,0 +1,30 @@
1
+ 'use client';
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import { forwardRef } from 'react';
4
+ import { PrizmaButton } from '@incodetech/prizma-core-web/button';
5
+ import { PrizmaTextField } from '@incodetech/prizma-core-web/text-field';
6
+ import { PrizmaDropdown } from '@incodetech/prizma-core-web/dropdown';
7
+ import { PrizmaScreenShell } from './ScreenShell';
8
+ import { PrizmaScreenNav } from './ScreenNav';
9
+ import './ScreenLayout.css';
10
+ import './DemoScreensLayout.css';
11
+ /**
12
+ * Demo screens · NATIVE — the configuration form, `Configuration` (2010:4704)
13
+ * in `Demo App - Latest Design`: the logo nav, Client ID, Environment, and a
14
+ * URL field once the environment is Custom. Continue stays disabled until
15
+ * both fields hold a value.
16
+ *
17
+ * Archetype E's shape without E's title: the frame draws no heading, and
18
+ * `PrizmaFormScreen` insists on one (DEVIATIONS #GEN-13), so the screen
19
+ * composes the nav and E's layout classes itself. Fields and CTA are Core's.
20
+ * The keyboard on the typing frames is OS chrome and is not drawn (#DC-20).
21
+ */
22
+ export const DemoScreensConfigScreen = forwardRef(({ strings, state = 'empty', screenId = `demo-screens-config-${state}`, overrides, onAction, ...shell }, ref) => {
23
+ const c = strings.config;
24
+ const filled = state !== 'empty';
25
+ const custom = state === 'custom';
26
+ const environment = state === 'empty' ? null : custom ? c.customEnvironment : c.environments[0]?.value ?? null;
27
+ return (_jsxs(PrizmaScreenShell, { ref: ref, "data-screen-id": screenId, ...shell, children: [_jsx(PrizmaScreenNav, { logo: overrides?.logo, navLabel: strings.navLabel }), _jsx("div", { className: "prizma-screen-layout__content", children: _jsxs("div", { className: "demo-screens-config__fields", children: [_jsx(PrizmaTextField, { label: c.clientIdLabel, placeholder: c.clientIdPlaceholder, defaultValue: filled ? c.clientIdValue : '', error: state === 'error', errorText: state === 'error' ? c.clientIdError : undefined, showRequiredMarker: false }, state), _jsx(PrizmaDropdown, { label: c.environmentLabel, placeholder: c.environmentPlaceholder, options: c.environments, value: environment, showRequiredMarker: false, forceOpen: state === 'environmentOpen' }), custom ? (_jsx(PrizmaTextField, { label: c.urlLabel, defaultValue: c.urlValue, showRequiredMarker: false })) : null] }) }), _jsx("div", { className: "prizma-screen-layout__band prizma-screen-layout__band--bare demo-screens-band", children: _jsx("div", { className: "prizma-screen-layout__band__ctas", children: _jsx(PrizmaButton, { variant: "primary", size: "L", disabled: !filled || state === 'error', onClick: () => onAction?.({ type: 'cta', screenId }), children: c.ctaLabel }) }) })] }));
28
+ });
29
+ DemoScreensConfigScreen.displayName = 'DemoScreensConfigScreen';
30
+ export default DemoScreensConfigScreen;
@@ -0,0 +1,39 @@
1
+ import React, { type ReactNode } from 'react';
2
+ import { type PrizmaScreenShellProps } from './ScreenShell';
3
+ import type { PrizmaScreenActionHandler } from './types';
4
+ import type { DemoScreensStrings } from './DemoScreensStrings';
5
+ import './ScreenLayout.css';
6
+ import './DemoScreensLayout.css';
7
+ /**
8
+ * The four states of the `Demo config screen` row (2118:20999):
9
+ * - `default` "Build Predefined", Save disabled
10
+ * - `flowOpen` the flow menu open, with its search
11
+ * - `selected` "uxv2" chosen, Save live
12
+ * - `saved` back from the edit sheet: "settings saved" snackbar
13
+ */
14
+ export type DemoScreensConfigSheetState = 'default' | 'flowOpen' | 'selected' | 'saved';
15
+ export interface DemoScreensConfigSheetScreenProps extends Omit<PrizmaScreenShellProps, 'dark' | 'title' | 'children'> {
16
+ /** Family copy — this screen reads the `configSheet` slice. */
17
+ strings: DemoScreensStrings;
18
+ state?: DemoScreensConfigSheetState;
19
+ screenId?: string;
20
+ onAction?: PrizmaScreenActionHandler;
21
+ }
22
+ /** Scrim + Core's sheet panel, the way Document Capture's method sheet does it
23
+ * (DEVIATIONS #DC-30): the screen owns the scrim, Core owns the panel. */
24
+ export declare const DemoScreensSheet: React.FC<{
25
+ ariaLabel: string;
26
+ children: ReactNode;
27
+ }>;
28
+ /**
29
+ * Demo screens · NATIVE — the configuration sheet the Launch menu opens
30
+ * (`Configuration › Demo config screen`, 2118:20999): choose the flow to run,
31
+ * read which Client ID and environment are set, or go edit them.
32
+ *
33
+ * Core's bottom sheet carries the panel; inside it Navigation (close only),
34
+ * a left Title, a searchable Dropdown, two read-only lines, and a CTA band of
35
+ * primary → tertiary link → build caption. The sheet's own header slot is not
36
+ * used because the frame puts the nav row ABOVE the title.
37
+ */
38
+ export declare const DemoScreensConfigSheetScreen: React.ForwardRefExoticComponent<DemoScreensConfigSheetScreenProps & React.RefAttributes<HTMLDivElement>>;
39
+ export default DemoScreensConfigSheetScreen;
@@ -0,0 +1,33 @@
1
+ 'use client';
2
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import { forwardRef } from 'react';
4
+ import { PrizmaButton } from '@incodetech/prizma-core-web/button';
5
+ import { PrizmaTitle } from '@incodetech/prizma-core-web/title';
6
+ import { PrizmaNavigation } from '@incodetech/prizma-core-web/navigation';
7
+ import { PrizmaDropdown } from '@incodetech/prizma-core-web/dropdown';
8
+ import { PrizmaSnackbar } from '@incodetech/prizma-core-web/snackbar';
9
+ import { PrizmaBottomSheetContent } from '@incodetech/prizma-core-web/bottom-sheet';
10
+ import { PrizmaScreenShell } from './ScreenShell';
11
+ import './ScreenLayout.css';
12
+ import './DemoScreensLayout.css';
13
+ /** Scrim + Core's sheet panel, the way Document Capture's method sheet does it
14
+ * (DEVIATIONS #DC-30): the screen owns the scrim, Core owns the panel. */
15
+ export const DemoScreensSheet = ({ ariaLabel, children }) => (_jsxs(_Fragment, { children: [_jsx("div", { className: "demo-screens-sheet-scrim", "aria-hidden": "true" }), _jsx("div", { className: "demo-screens-sheet-panel", children: _jsx(PrizmaBottomSheetContent, { variant: "dialog", ariaLabel: ariaLabel, showButtonGroup: false, body: children }) })] }));
16
+ /**
17
+ * Demo screens · NATIVE — the configuration sheet the Launch menu opens
18
+ * (`Configuration › Demo config screen`, 2118:20999): choose the flow to run,
19
+ * read which Client ID and environment are set, or go edit them.
20
+ *
21
+ * Core's bottom sheet carries the panel; inside it Navigation (close only),
22
+ * a left Title, a searchable Dropdown, two read-only lines, and a CTA band of
23
+ * primary → tertiary link → build caption. The sheet's own header slot is not
24
+ * used because the frame puts the nav row ABOVE the title.
25
+ */
26
+ export const DemoScreensConfigSheetScreen = forwardRef(({ strings, state = 'default', screenId = `demo-screens-config-sheet-${state}`, onAction, ...shell }, ref) => {
27
+ const s = strings.configSheet;
28
+ const options = [{ value: s.flowValue, label: s.flowValue }, ...s.flows];
29
+ const value = state === 'selected' ? s.flowSelected : s.flowValue;
30
+ return (_jsxs(PrizmaScreenShell, { ref: ref, "data-screen-id": screenId, ...shell, children: [state === 'saved' ? (_jsx("div", { className: "demo-screens-toast", children: _jsx(PrizmaSnackbar, { state: "success", contentResizing: "fill", isMultiline: true, children: s.savedSnackbar }) })) : null, _jsxs(DemoScreensSheet, { ariaLabel: s.title, children: [_jsx("div", { className: "demo-screens-sheet__nav", children: _jsx(PrizmaNavigation, { showIncodeLogo: false, showRightIcon: true, closeLabel: s.closeLabel, onRightIconClick: () => onAction?.({ type: 'help', screenId }), "aria-label": s.title }) }), _jsx("div", { className: "demo-screens-sheet__title", children: _jsx(PrizmaTitle, { variant: "left", title: s.title, showSubtitle: true, subtitle: s.subtitle }) }), _jsxs("div", { className: "demo-screens-sheet__fields", children: [_jsx(PrizmaDropdown, { label: s.flowLabel, options: options, value: value, showRequiredMarker: false, searchable: true, searchPlaceholder: s.searchPlaceholder, clearSearchLabel: s.clearSearchLabel, forceOpen: state === 'flowOpen' }), _jsxs("div", { className: "demo-screens-sheet__lines", children: [_jsx("p", { className: "demo-screens-sheet__line", children: s.clientIdLine }), _jsx("p", { className: "demo-screens-sheet__line", children: s.environmentLine })] })] }), _jsxs("div", { className: "demo-screens-sheet__band", children: [_jsx(PrizmaButton, { variant: "primary", size: "L", disabled: state !== 'selected', onClick: () => onAction?.({ type: 'cta', screenId }), children: s.saveLabel }), _jsx(PrizmaButton, { variant: "tertiary-link", size: "L", onClick: () => onAction?.({ type: 'tertiary', screenId }), children: s.editLinkLabel }), _jsx("p", { className: "demo-screens-build", children: s.buildLabel })] })] })] }));
31
+ });
32
+ DemoScreensConfigSheetScreen.displayName = 'DemoScreensConfigSheetScreen';
33
+ export default DemoScreensConfigSheetScreen;
@@ -0,0 +1,30 @@
1
+ import React from 'react';
2
+ import { type PrizmaScreenShellProps } from './ScreenShell';
3
+ import type { PrizmaScreenActionHandler } from './types';
4
+ import type { DemoScreensStrings } from './DemoScreensStrings';
5
+ import './ScreenLayout.css';
6
+ import './DemoScreensLayout.css';
7
+ /**
8
+ * The five states of the `Edit Client ID or Environment` row (2118:21000 …):
9
+ * - `default` nothing changed yet, Update disabled
10
+ * - `environmentOpen` the environment menu open
11
+ * - `filled` a new environment chosen, Update live
12
+ * - `loading` Update pressed, the backend checking
13
+ * - `error` "Wrong Client ID"
14
+ */
15
+ export type DemoScreensEditSheetState = 'default' | 'environmentOpen' | 'filled' | 'loading' | 'error';
16
+ export interface DemoScreensEditSheetScreenProps extends Omit<PrizmaScreenShellProps, 'dark' | 'title' | 'children'> {
17
+ /** Family copy — this screen reads the `editSheet` slice. */
18
+ strings: DemoScreensStrings;
19
+ state?: DemoScreensEditSheetState;
20
+ screenId?: string;
21
+ onAction?: PrizmaScreenActionHandler;
22
+ }
23
+ /**
24
+ * Demo screens · NATIVE — the second sheet, reached from the first's link:
25
+ * change the Client ID or the environment, and let the backend check the pair.
26
+ * Navigation with back AND close, a left Title with subtitle, a TextField, a
27
+ * Dropdown, the Update CTA and the build caption.
28
+ */
29
+ export declare const DemoScreensEditSheetScreen: React.ForwardRefExoticComponent<DemoScreensEditSheetScreenProps & React.RefAttributes<HTMLDivElement>>;
30
+ export default DemoScreensEditSheetScreen;
@@ -0,0 +1,28 @@
1
+ 'use client';
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import { forwardRef } from 'react';
4
+ import { PrizmaButton } from '@incodetech/prizma-core-web/button';
5
+ import { PrizmaTitle } from '@incodetech/prizma-core-web/title';
6
+ import { PrizmaNavigation } from '@incodetech/prizma-core-web/navigation';
7
+ import { PrizmaTextField } from '@incodetech/prizma-core-web/text-field';
8
+ import { PrizmaDropdown } from '@incodetech/prizma-core-web/dropdown';
9
+ import { PrizmaScreenShell } from './ScreenShell';
10
+ import { DemoScreensSheet } from './DemoScreensConfigSheetScreen';
11
+ import './ScreenLayout.css';
12
+ import './DemoScreensLayout.css';
13
+ /**
14
+ * Demo screens · NATIVE — the second sheet, reached from the first's link:
15
+ * change the Client ID or the environment, and let the backend check the pair.
16
+ * Navigation with back AND close, a left Title with subtitle, a TextField, a
17
+ * Dropdown, the Update CTA and the build caption.
18
+ */
19
+ export const DemoScreensEditSheetScreen = forwardRef(({ strings, state = 'default', screenId = `demo-screens-edit-sheet-${state}`, onAction, ...shell }, ref) => {
20
+ const e = strings.editSheet;
21
+ const changed = state === 'filled' || state === 'loading' || state === 'error';
22
+ const options = e.environments.some(o => o.value === e.environmentValue)
23
+ ? e.environments
24
+ : [{ value: e.environmentValue, label: e.environmentValue }, ...e.environments];
25
+ return (_jsx(PrizmaScreenShell, { ref: ref, "data-screen-id": screenId, ...shell, children: _jsxs(DemoScreensSheet, { ariaLabel: e.title, children: [_jsx("div", { className: "demo-screens-sheet__nav", children: _jsx(PrizmaNavigation, { showIncodeLogo: false, showLeftIcon: true, backLabel: e.backLabel, onLeftIconClick: () => onAction?.({ type: 'secondary', screenId }), showRightIcon: true, closeLabel: e.closeLabel, onRightIconClick: () => onAction?.({ type: 'help', screenId }), "aria-label": e.title }) }), _jsx("div", { className: "demo-screens-sheet__title", children: _jsx(PrizmaTitle, { variant: "left", title: e.title, showSubtitle: true, subtitle: e.subtitle }) }), _jsxs("div", { className: "demo-screens-sheet__fields", children: [_jsx(PrizmaTextField, { label: e.clientIdLabel, defaultValue: e.clientIdValue, error: state === 'error', errorText: state === 'error' ? e.clientIdError : undefined, showRequiredMarker: false }, state), _jsx(PrizmaDropdown, { label: e.environmentLabel, options: options, value: changed ? e.environmentSelected : e.environmentValue, showRequiredMarker: false, forceOpen: state === 'environmentOpen' })] }), _jsxs("div", { className: "demo-screens-sheet__band", children: [_jsx(PrizmaButton, { variant: "primary", size: "L", disabled: !changed || state === 'error', loading: state === 'loading', onClick: () => onAction?.({ type: 'cta', screenId }), children: e.ctaLabel }), _jsx("p", { className: "demo-screens-build", children: e.buildLabel })] })] }) }));
26
+ });
27
+ DemoScreensEditSheetScreen.displayName = 'DemoScreensEditSheetScreen';
28
+ export default DemoScreensEditSheetScreen;
@@ -1,33 +1,21 @@
1
1
  import React from 'react';
2
- import { type PrizmaResultScreenProps } from './ResultScreen';
3
- import type { PrizmaScreenActionHandler, PrizmaScreenOverrides } from './types';
4
- import type { DemoScreensStrings } from './DemoScreensStrings';
2
+ import { type DemoScreensResultScreenProps } from './DemoScreensResultScreen';
5
3
  import './ScreenLayout.css';
6
- export interface DemoScreensEndScreenProps extends Omit<PrizmaResultScreenProps, 'status' | 'title' | 'subtitle' | 'glyph' | 'verifiedLabel' | 'navLabel'> {
7
- /** Family copy — this screen reads the `end` slice. */
8
- strings: DemoScreensStrings;
9
- screenId?: string;
10
- overrides?: PrizmaScreenOverrides;
11
- onAction?: PrizmaScreenActionHandler;
4
+ export interface DemoScreensEndScreenProps extends Omit<DemoScreensResultScreenProps, 'status'> {
12
5
  }
13
6
  /**
14
- * Demo screens — "Verification complete!", built on the Result archetype
15
- * (GUIDELINES.md §6-F, `PrizmaResultScreen`).
7
+ * Demo screens — "Verification complete!", `Module Generic Screens` frame
8
+ * `63:399`: the demo is over and the result is with a human.
16
9
  *
17
- * Figma: `Module Generic Screens` frame `63:399`. The last thing a prospect
18
- * sees in a sample flow: logo header → a centred title and supporting line →
19
- * the verified tag. No CTA, because the demo has nowhere left to go.
20
- *
21
- * Result rather than Processing, even though the skeleton is Processing's:
22
- * archetype C's status vocabulary is `loading | success | error | warning`, so
23
- * a MARK-FREE centred title is not expressible there. `status="none"` is
24
- * archetype F's, and with no CTA the band never renders — F degenerates to
25
- * exactly C's shape and keeps the mark off.
10
+ * Since 2026-09-24 this is the `inReview` case of `DemoScreensResultScreen`,
11
+ * kept under its original name so the hub entry `demo-screens-end` and the
12
+ * iPhone Duo exploration that renders it by id keep resolving. New consumers
13
+ * should reach for the result screen and pass the session status.
26
14
  *
27
15
  * Figma draws no status mark above the title, deliberately: the demo did not
28
16
  * verify anything, it finished. A success tick here would claim a verdict the
29
17
  * session never reached — the copy already says the result is still under
30
- * review.
18
+ * review. No CTA, because the demo has nowhere left to go.
31
19
  */
32
20
  export declare const DemoScreensEndScreen: React.ForwardRefExoticComponent<DemoScreensEndScreenProps & React.RefAttributes<HTMLDivElement>>;
33
21
  export default DemoScreensEndScreen;
@@ -1,27 +1,22 @@
1
1
  'use client';
2
2
  import { jsx as _jsx } from "react/jsx-runtime";
3
3
  import { forwardRef } from 'react';
4
- import { PrizmaResultScreen } from './ResultScreen';
4
+ import { DemoScreensResultScreen, } from './DemoScreensResultScreen';
5
5
  import './ScreenLayout.css';
6
6
  /**
7
- * Demo screens — "Verification complete!", built on the Result archetype
8
- * (GUIDELINES.md §6-F, `PrizmaResultScreen`).
7
+ * Demo screens — "Verification complete!", `Module Generic Screens` frame
8
+ * `63:399`: the demo is over and the result is with a human.
9
9
  *
10
- * Figma: `Module Generic Screens` frame `63:399`. The last thing a prospect
11
- * sees in a sample flow: logo header → a centred title and supporting line →
12
- * the verified tag. No CTA, because the demo has nowhere left to go.
13
- *
14
- * Result rather than Processing, even though the skeleton is Processing's:
15
- * archetype C's status vocabulary is `loading | success | error | warning`, so
16
- * a MARK-FREE centred title is not expressible there. `status="none"` is
17
- * archetype F's, and with no CTA the band never renders — F degenerates to
18
- * exactly C's shape and keeps the mark off.
10
+ * Since 2026-09-24 this is the `inReview` case of `DemoScreensResultScreen`,
11
+ * kept under its original name so the hub entry `demo-screens-end` and the
12
+ * iPhone Duo exploration that renders it by id keep resolving. New consumers
13
+ * should reach for the result screen and pass the session status.
19
14
  *
20
15
  * Figma draws no status mark above the title, deliberately: the demo did not
21
16
  * verify anything, it finished. A success tick here would claim a verdict the
22
17
  * session never reached — the copy already says the result is still under
23
- * review.
18
+ * review. No CTA, because the demo has nowhere left to go.
24
19
  */
25
- export const DemoScreensEndScreen = forwardRef(({ strings, screenId = 'demo-screens-end', overrides, onAction, ...shell }, ref) => (_jsx(PrizmaResultScreen, { ref: ref, status: "none", title: strings.end.title, subtitle: strings.end.subtitle, verifiedLabel: strings.verifiedLabel, navLabel: strings.navLabel, screenId: screenId, overrides: overrides, onAction: onAction, ...shell })));
20
+ export const DemoScreensEndScreen = forwardRef(({ screenId = 'demo-screens-end', ...rest }, ref) => (_jsx(DemoScreensResultScreen, { ref: ref, status: "inReview", screenId: screenId, ...rest })));
26
21
  DemoScreensEndScreen.displayName = 'DemoScreensEndScreen';
27
22
  export default DemoScreensEndScreen;
@@ -0,0 +1,28 @@
1
+ import React from 'react';
2
+ import { type PrizmaScreenShellProps } from './ScreenShell';
3
+ import type { PrizmaScreenActionHandler } from './types';
4
+ import type { DemoScreensStrings } from './DemoScreensStrings';
5
+ import './ScreenLayout.css';
6
+ import './DemoScreensLayout.css';
7
+ export interface DemoScreensLaunchScreenProps extends Omit<PrizmaScreenShellProps, 'dark' | 'title' | 'children'> {
8
+ /** Family copy — this screen reads `appName` and `launch`. */
9
+ strings: DemoScreensStrings;
10
+ /** The CTA is pressed and the session is being created (`Loading`). */
11
+ loading?: boolean;
12
+ /** The configuration sheet just saved: "Flow saved" over the header. */
13
+ saved?: boolean;
14
+ screenId?: string;
15
+ onAction?: PrizmaScreenActionHandler;
16
+ }
17
+ /**
18
+ * Demo screens · NATIVE — `Launch screen` (2010:5024), `Loading` (2082:8004)
19
+ * and the "Flow saved" return (2118:21170): the app is configured. Header row
20
+ * with the flow's name on the left and the menu on the right, the wordmark in
21
+ * the middle, one CTA, and the environment named under it.
22
+ *
23
+ * The web Start screen's twin: same header row, same wordmark block, same
24
+ * bare CTA band; only the header's left slot and the caption differ.
25
+ * `onAction`: `cta` for Start, `help` for the menu (it opens the sheet).
26
+ */
27
+ export declare const DemoScreensLaunchScreen: React.ForwardRefExoticComponent<DemoScreensLaunchScreenProps & React.RefAttributes<HTMLDivElement>>;
28
+ export default DemoScreensLaunchScreen;
@@ -0,0 +1,26 @@
1
+ 'use client';
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import { forwardRef } from 'react';
4
+ import { PrizmaButton } from '@incodetech/prizma-core-web/button';
5
+ import { PrizmaLogo } from '@incodetech/prizma-core-web/logo';
6
+ import { PrizmaSnackbar } from '@incodetech/prizma-core-web/snackbar';
7
+ import { PrizmaScreenShell } from './ScreenShell';
8
+ import { MenuDotsGlyph } from './DemoScreensStartScreen';
9
+ import './ScreenLayout.css';
10
+ import './DemoScreensLayout.css';
11
+ /**
12
+ * Demo screens · NATIVE — `Launch screen` (2010:5024), `Loading` (2082:8004)
13
+ * and the "Flow saved" return (2118:21170): the app is configured. Header row
14
+ * with the flow's name on the left and the menu on the right, the wordmark in
15
+ * the middle, one CTA, and the environment named under it.
16
+ *
17
+ * The web Start screen's twin: same header row, same wordmark block, same
18
+ * bare CTA band; only the header's left slot and the caption differ.
19
+ * `onAction`: `cta` for Start, `help` for the menu (it opens the sheet).
20
+ */
21
+ export const DemoScreensLaunchScreen = forwardRef(({ strings, loading = false, saved = false, screenId = loading ? 'demo-screens-launch-loading' : saved ? 'demo-screens-launch-saved' : 'demo-screens-launch', onAction, ...shell }, ref) => {
22
+ const l = strings.launch;
23
+ return (_jsxs(PrizmaScreenShell, { ref: ref, "data-screen-id": screenId, ...shell, children: [saved ? (_jsx("div", { className: "demo-screens-toast", children: _jsx(PrizmaSnackbar, { state: "success", contentResizing: "fill", children: l.savedSnackbar }) })) : null, _jsxs("header", { className: "demo-screens-start__header", "aria-label": strings.navLabel, children: [_jsx("span", { className: "demo-screens-start__flow", children: l.flowLabel }), _jsx("button", { type: "button", className: "prizma-nav__icon demo-screens-start__menu", "aria-label": l.menuLabel, onClick: () => onAction?.({ type: 'help', screenId }), children: _jsx(MenuDotsGlyph, {}) })] }), _jsx("div", { className: "prizma-screen-layout__content", children: _jsx("div", { className: "demo-screens-start__middle", children: _jsxs("div", { className: "demo-screens-wordmark", children: [_jsx(PrizmaLogo, { variant: "incode" }), _jsx("p", { className: "demo-screens-wordmark__caption", children: strings.appName })] }) }) }), _jsxs("div", { className: "prizma-screen-layout__band prizma-screen-layout__band--bare demo-screens-band", children: [_jsx("div", { className: "prizma-screen-layout__band__ctas", children: _jsx(PrizmaButton, { variant: "primary", size: "L", loading: loading, onClick: () => onAction?.({ type: 'cta', screenId }), children: l.ctaLabel }) }), _jsxs("p", { className: "demo-screens-launch__env", children: [l.environmentCaption, " ", _jsx("b", { children: l.environmentValue })] })] })] }));
24
+ });
25
+ DemoScreensLaunchScreen.displayName = 'DemoScreensLaunchScreen';
26
+ export default DemoScreensLaunchScreen;