@appinternalleads/ui 0.2.0

package/dist/esm/components/onboarding/rate-limit/engine.js

@@ -0,0 +1,68 @@
+export function initialRateLimit(c, seed = {}) {
+    const overage = c.defaultOverage ?? c.overageOptions[0]?.value ?? '';
+    const saved = seed.saved ?? { limit: c.defaultLimit, overage };
+    return { usage: seed.usage ?? c.usage, limit: seed.limit ?? c.pendingLimit ?? c.defaultLimit, overage: seed.overage ?? overage, saved, save: seed.save ?? 'idle' };
+}
+/** The prototype's scenes: usage set against the saved limit, or a limit picked below usage. */
+export function rateLimitSeed(c, scene) {
+    const base = initialRateLimit(c);
+    const L = c.limits;
+    const limit = base.saved.limit;
+    if (scene === 'normal')
+        return { limit, usage: Math.round(limit * 0.55) };
+    if (scene === 'near')
+        return { limit, usage: Math.round(limit * 0.86) };
+    if (scene === 'atLimit')
+        return { limit, usage: limit };
+    if (scene === 'below') {
+        const lower = L.filter(x => x < base.usage);
+        return lower.length ? { limit: lower.at(-1) } : { limit: L[0], usage: Math.round(L[0] * 1.2) };
+    }
+    if (scene === 'saving' || scene === 'saved' || scene === 'failed') {
+        const next = L[Math.min(L.length - 1, L.indexOf(limit) + 1)];
+        return { limit: next, save: scene, ...(scene === 'saved' ? { saved: { limit: next, overage: base.overage } } : {}) };
+    }
+    return {};
+}
+export function reduceRateLimit(s, a) {
+    switch (a.type) {
+        case 'limit': return s.save === 'saving' ? s : { ...s, limit: a.limit, save: 'idle' };
+        case 'overage': return s.save === 'saving' ? s : { ...s, overage: a.overage, save: 'idle' };
+        case 'save': return { ...s, save: 'saving' };
+        case 'saved': return s.save === 'saving' ? { ...s, save: 'saved', saved: { limit: s.limit, overage: s.overage } } : s;
+        case 'failed': return s.save === 'saving' ? { ...s, save: 'failed' } : s;
+    }
+}
+export function usageMode(c, s) {
+    const r = s.limit ? s.usage / s.limit : 0;
+    return s.usage > s.limit ? 'below' : s.usage === s.limit ? 'at' : r >= c.attentionAt ? 'near' : 'normal';
+}
+export function rateLimitView(c, s) {
+    const r = s.limit ? s.usage / s.limit : 0;
+    const mode = usageMode(c, s);
+    const warn = mode !== 'normal';
+    const opt = c.overageOptions.find(o => o.value === s.overage) ?? c.overageOptions[0];
+    const dirty = s.limit !== s.saved.limit || s.overage !== s.saved.overage;
+    const n = (x) => x.toLocaleString('en-US');
+    const chipLabel = s.save === 'saved' ? 'Saved' : mode === 'below' ? 'Over limit' : mode === 'at' ? 'At limit' : mode === 'near' ? 'Near limit' : `${Math.round(r * 100)}% used`;
+    return {
+        mode,
+        warn,
+        pct: Math.min(100, Math.round(r * 100)),
+        usageText: `${n(s.usage)} / ${n(s.limit)} ${c.unit}`,
+        option: opt,
+        note: mode === 'below' ? `Current usage (${n(s.usage)}) is above this limit. Extra ${c.unitNoun} will be ${opt.outcome} straight away.`
+            : mode === 'at' ? `You’ve reached the limit. New ${c.unitNoun} are ${opt.outcome}.`
+                : mode === 'near' ? `You’re at ${Math.round(r * 100)}% of the limit. At 100%, new ${c.unitNoun} will be ${opt.outcome}.` : '',
+        scene: (s.save !== 'idle' ? s.save : mode === 'below' ? 'below' : mode === 'at' ? 'atLimit' : mode === 'near' ? 'near' : 'default'),
+        chip: {
+            tone: (s.save === 'saving' ? 'neutral' : warn ? 'attention' : s.save === 'saved' ? 'success' : 'neutral'),
+            label: s.save === 'saving' ? 'Saving…' : chipLabel,
+        },
+        dirty,
+        footerHint: s.save === 'saved' && !dirty ? c.savedHint : dirty ? 'Unsaved changes' : 'No changes yet',
+        primaryLabel: s.save === 'saving' ? 'Saving…' : s.save === 'saved' && !dirty ? 'Saved' : s.save === 'failed' ? c.retryLabel : c.primaryLabel,
+        canSave: (dirty || s.save === 'failed') && s.save !== 'saving',
+    };
+}
+//# sourceMappingURL=engine.js.map

package/dist/esm/components/onboarding/rate-limit/engine.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"engine.js","sourceRoot":"","sources":["../../../../../src/components/onboarding/rate-limit/engine.ts"],"names":[],"mappings":"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"}

package/dist/esm/components/onboarding/rate-limit/index.d.ts

@@ -0,0 +1,4 @@
+export { RATE_LIMIT_IN_FLIGHT, RATE_LIMIT_PRESETS, RATE_LIMIT_SCENES, validateRateLimit, type OverageOption, type RateLimitScene, type RateLimitSettings, } from './contract';
+export { initialRateLimit, rateLimitSeed, rateLimitView, reduceRateLimit, usageMode, type RateLimitAction, type RateLimitSeed, type RateLimitState, type UsageMode, } from './engine';
+export { RateLimit, type RateLimitOperations, type RateLimitProps } from './RateLimitView';
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/onboarding/rate-limit/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/onboarding/rate-limit/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,oBAAoB,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,iBAAiB,EAC9E,KAAK,aAAa,EAAE,KAAK,cAAc,EAAE,KAAK,iBAAiB,GAChE,MAAM,YAAY,CAAC;AACpB,OAAO,EACL,gBAAgB,EAAE,aAAa,EAAE,aAAa,EAAE,eAAe,EAAE,SAAS,EAC1E,KAAK,eAAe,EAAE,KAAK,aAAa,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,GAC9E,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,SAAS,EAAE,KAAK,mBAAmB,EAAE,KAAK,cAAc,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/esm/components/onboarding/rate-limit/index.js

@@ -0,0 +1,4 @@
+export { RATE_LIMIT_IN_FLIGHT, RATE_LIMIT_PRESETS, RATE_LIMIT_SCENES, validateRateLimit, } from './contract';
+export { initialRateLimit, rateLimitSeed, rateLimitView, reduceRateLimit, usageMode, } from './engine';
+export { RateLimit } from './RateLimitView';
+//# sourceMappingURL=index.js.map

package/dist/esm/components/onboarding/rate-limit/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/onboarding/rate-limit/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,oBAAoB,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,iBAAiB,GAE/E,MAAM,YAAY,CAAC;AACpB,OAAO,EACL,gBAAgB,EAAE,aAAa,EAAE,aAAa,EAAE,eAAe,EAAE,SAAS,GAE3E,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,SAAS,EAAiD,MAAM,iBAAiB,CAAC"}

package/dist/esm/components/onboarding/rate-limit/presets.json

@@ -0,0 +1,213 @@
+{
+    "component": "rate-limit",
+    "baseCopy": {
+        "loadErrorTitle": "Couldn’t load this step",
+        "loadErrorBody": "Nothing was lost. Retry to load it again.",
+        "retryLabel": "Retry",
+        "emptyCta": "Refresh"
+    },
+    "base": {
+        "type": "data",
+        "icon": "pulse",
+        "title": "Set your API rate limit",
+        "subtitle": "Protects your service from traffic spikes.",
+        "unit": "req/min",
+        "unitNoun": "requests",
+        "usage": 5600,
+        "defaultLimit": 10000,
+        "limits": [
+            5000,
+            10000,
+            20000,
+            50000
+        ],
+        "attentionAt": 0.8,
+        "overageOptions": [
+            {
+                "value": "reject",
+                "label": "Reject (429)",
+                "description": "Extra requests get a 429 Too Many Requests response.",
+                "outcome": "rejected with a 429"
+            },
+            {
+                "value": "queue",
+                "label": "Queue",
+                "description": "Extra requests wait up to 30 seconds, then run in order.",
+                "outcome": "queued"
+            },
+            {
+                "value": "bill",
+                "label": "Allow and bill",
+                "description": "Extra requests go through and are billed at $0.40 per 1,000.",
+                "outcome": "allowed and billed"
+            }
+        ],
+        "limitLabel": "Limit",
+        "usageLabel": "Current usage",
+        "overageLabel": "When the limit is exceeded",
+        "primaryLabel": "Save limit",
+        "savedHint": "Saved · applies within a minute",
+        "saveErrorTitle": "Couldn’t save the limit",
+        "saveErrorBody": "Your previous limit is still in place. Retry when you’re ready.",
+        "emptyTitle": "No usage yet",
+        "emptyBody": "Make your first request to see usage and set a limit.",
+        "emptyCta": "Refresh"
+    },
+    "cases": {
+        "case1": {},
+        "case2": {
+            "type": "action",
+            "icon": "mail",
+            "title": "Set a sending limit",
+            "subtitle": "Stops a campaign from flooding inboxes.",
+            "unit": "emails/hour",
+            "unitNoun": "emails",
+            "usage": 4400,
+            "defaultLimit": 5000,
+            "limits": [
+                1000,
+                2500,
+                5000,
+                10000
+            ],
+            "overageOptions": [
+                {
+                    "value": "queue",
+                    "label": "Queue",
+                    "description": "Extra emails are sent in the next hour.",
+                    "outcome": "queued for the next hour"
+                },
+                {
+                    "value": "pause",
+                    "label": "Pause campaign",
+                    "description": "The campaign pauses until you resume it.",
+                    "outcome": "held and the campaign paused"
+                }
+            ]
+        },
+        "case3": {
+            "type": "agent",
+            "icon": "sparkle",
+            "title": "Set a token budget",
+            "subtitle": "How much your assistant can use each day.",
+            "unit": "tokens/day",
+            "unitNoun": "requests",
+            "usage": 420000,
+            "defaultLimit": 1000000,
+            "limits": [
+                250000,
+                500000,
+                1000000,
+                2000000
+            ],
+            "overageOptions": [
+                {
+                    "value": "pause",
+                    "label": "Pause agent",
+                    "description": "The assistant stops until midnight UTC.",
+                    "outcome": "paused until tomorrow"
+                },
+                {
+                    "value": "notify",
+                    "label": "Notify only",
+                    "description": "Keep working and email the owner.",
+                    "outcome": "allowed, and the owner notified"
+                },
+                {
+                    "value": "payg",
+                    "label": "Pay as you go",
+                    "description": "Keep working at $2 per extra million tokens.",
+                    "outcome": "allowed and billed"
+                }
+            ]
+        },
+        "case4": {
+            "type": "file",
+            "icon": "hardDrive",
+            "title": "Set a storage quota",
+            "subtitle": "How much each person can store.",
+            "unit": "GB/user",
+            "unitNoun": "uploads",
+            "usage": 50,
+            "defaultLimit": 50,
+            "limits": [
+                10,
+                25,
+                50,
+                100
+            ],
+            "overageOptions": [
+                {
+                    "value": "block",
+                    "label": "Block uploads",
+                    "description": "People can still view and delete files.",
+                    "outcome": "blocked"
+                },
+                {
+                    "value": "notify",
+                    "label": "Notify admin",
+                    "description": "Uploads continue and admins get an email.",
+                    "outcome": "allowed, and admins notified"
+                }
+            ]
+        },
+        "case5": {
+            "type": "schedule",
+            "icon": "chat",
+            "title": "Set an SMS limit",
+            "subtitle": "Appointment reminders sent each month.",
+            "unit": "SMS/month",
+            "unitNoun": "reminders",
+            "usage": 1240,
+            "defaultLimit": 2000,
+            "pendingLimit": 1000,
+            "limits": [
+                500,
+                1000,
+                2000,
+                5000
+            ],
+            "overageOptions": [
+                {
+                    "value": "stop",
+                    "label": "Stop sending",
+                    "description": "No more reminders until next month.",
+                    "outcome": "not sent"
+                },
+                {
+                    "value": "email",
+                    "label": "Switch to email",
+                    "description": "Patients with an email get it there instead.",
+                    "outcome": "sent by email instead"
+                }
+            ]
+        }
+    },
+    "meta": {
+        "case1": {
+            "eyebrow": "Case study 1 · Platform",
+            "title": "API rate limit",
+            "scenario": "A developer sets a per-minute request limit and what happens to extra requests."
+        },
+        "case2": {
+            "eyebrow": "Case study 2 · Email infra",
+            "title": "Sending limit",
+            "scenario": "A marketer caps hourly sends. Usage is already near the limit."
+        },
+        "case3": {
+            "eyebrow": "Case study 3 · AI agent",
+            "title": "Token budget",
+            "scenario": "A team lead sets a daily token budget for their assistant."
+        },
+        "case4": {
+            "eyebrow": "Case study 4 · SaaS",
+            "title": "Storage quota",
+            "scenario": "An admin sets per-person storage. Usage is exactly at the limit."
+        },
+        "case5": {
+            "eyebrow": "Case study 5 · Clinic",
+            "title": "SMS reminders",
+            "scenario": "A clinic lowers its monthly SMS limit below this month’s usage, so the warning shows before saving."
+        }
+    }
+}

package/dist/esm/components/onboarding/receipt-printer/ReceiptPaper.d.ts

@@ -0,0 +1,16 @@
+import type { ReceiptLines, PrinterPhase } from './engine';
+/**
+ * **The receipt as a still** — the golden roller and the paper at rest, drawn with the primitives.
+ * It is what React Native shows (the Rive runtime used on the web has no native half here), and
+ * what the web shows if that runtime cannot load, so a print always ends with a receipt on screen.
+ * Idle, only the torn tip and the message show below the roller, as in the Rive file. It is as long
+ * as its lines, one row per item, and grows rather than keeping the Rive stage's ratio.
+ */
+export declare function ReceiptPaper({ lines, phase, maxWidth, label, testID }: {
+    lines: ReceiptLines;
+    phase: PrinterPhase;
+    maxWidth: number;
+    label: string;
+    testID?: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=ReceiptPaper.d.ts.map

package/dist/esm/components/onboarding/receipt-printer/ReceiptPaper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReceiptPaper.d.ts","sourceRoot":"","sources":["../../../../../src/components/onboarding/receipt-printer/ReceiptPaper.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAE3D;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE;IAAE,KAAK,EAAE,YAAY,CAAC;IAAC,KAAK,EAAE,YAAY,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAA;CAAE,+BAsCrK"}

package/dist/esm/components/onboarding/receipt-printer/ReceiptPaper.js

@@ -0,0 +1,21 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Box, Text } from '../../../core';
+import { HUE, blockRadii, useDs } from '../../../tokens';
+/**
+ * **The receipt as a still** — the golden roller and the paper at rest, drawn with the primitives.
+ * It is what React Native shows (the Rive runtime used on the web has no native half here), and
+ * what the web shows if that runtime cannot load, so a print always ends with a receipt on screen.
+ * Idle, only the torn tip and the message show below the roller, as in the Rive file. It is as long
+ * as its lines, one row per item, and grows rather than keeping the Rive stage's ratio.
+ */
+export function ReceiptPaper({ lines, phase, maxWidth, label, testID }) {
+    const { colors, fonts } = useDs();
+    const butter = HUE.butter;
+    const mono = { fontFamily: fonts.mono, color: butter.on };
+    const row = (left, right, strong = false) => (_jsxs(Box, { row: true, justify: "space-between", gap: "s2", children: [_jsx(Text, { numberOfLines: 1, style: { ...mono, fontSize: 11, flexShrink: 1, color: strong ? butter.hd : colors.textSecondary }, children: left }), _jsx(Text, { numberOfLines: 1, style: { ...mono, fontSize: 11, flexShrink: 1, textAlign: 'right', ...(strong ? { color: butter.hd, fontWeight: '600' } : null) }, children: right })] }));
+    const rule = _jsx(Box, { style: { height: 1, backgroundColor: butter.hs, marginVertical: 8 } });
+    const open = phase !== 'idle';
+    return (_jsxs(Box, { testID: testID, role: "img", "aria-label": label, align: "center", style: { width: '100%', maxWidth, borderRadius: blockRadii.mid, backgroundColor: butter.hs, paddingTop: 24, paddingBottom: 24, overflow: 'hidden' }, children: [_jsx(Box, { style: { width: '88%', height: 28, borderRadius: 14, backgroundColor: butter.h, zIndex: 1 } }), _jsxs(Box, { style: { width: '76%', marginTop: -6, backgroundColor: colors.surface1, paddingHorizontal: 14, paddingTop: open ? 18 : 10, paddingBottom: 12, borderBottomLeftRadius: 2, borderBottomRightRadius: 2 }, children: [open ? (_jsxs(_Fragment, { children: [lines.title ? _jsx(Text, { numberOfLines: 1, style: { ...mono, fontSize: 10, letterSpacing: 1 }, children: lines.title }) : null, _jsx(Text, { numberOfLines: 1, style: { ...mono, fontSize: 20, fontWeight: '600', marginTop: 2 }, children: lines.total }), _jsx(Text, { numberOfLines: 1, style: { ...mono, fontSize: 9, color: colors.textSecondary, marginTop: 2 }, children: lines.meta }), rule, lines.details.map((d, i) => _jsx(Box, { children: row(d.label, d.value) }, i)), rule, _jsx(Box, { role: "list", gap: "s1", children: lines.items.map((it, i) => _jsx(Box, { role: "listitem", children: row(it.line, it.amount) }, i)) }), rule, row(lines.paymentLabel, lines.paymentMethod), rule, row(lines.totalLabel, lines.total, true), rule] })) : null, _jsx(Text, { numberOfLines: 1, style: { ...mono, fontSize: 10, letterSpacing: 1, textAlign: 'center', marginTop: open ? 10 : 0 }, children: lines.message })] })] }));
+}
+//# sourceMappingURL=ReceiptPaper.js.map

package/dist/esm/components/onboarding/receipt-printer/ReceiptPaper.js.map

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

package/dist/esm/components/onboarding/receipt-printer/ReceiptPrinterView.d.ts

@@ -0,0 +1,56 @@
+import { type ComponentType } from 'react';
+import { type DensityName } from '../../../tokens';
+import { type OnboardingPreset, type OnboardingResult, type PatternStatus } from '../shared/contract';
+import { type OnboardingOperation } from '../shared/mock';
+import { type ReceiptFieldDef, type ReceiptPrinterSettings, type ReceiptValues } from './contract';
+import { type ReceiptDraft, type ReceiptLines, type ReceiptPrinterSeed } from './engine';
+import type { ReceiptStageProps } from './ReceiptStage.types';
+export type ReceiptPrinterOperations = {
+    /**
+     * Record, send or print the receipt for real — a POS, an email, a thermal printer. The paper
+     * feeds while it runs, and the receipt is `printed` once both are done. Default: succeeds.
+     */
+    print: OnboardingOperation<{
+        receipt: ReceiptValues;
+        lines: ReceiptLines;
+    }>;
+};
+/** How wide the printer may grow: 260, 340 or 420 points. It shrinks with its container below that. */
+export type ReceiptPrinterSize = 'small' | 'medium' | 'large';
+export type ReceiptPrinterProps = {
+    preset?: OnboardingPreset;
+    config?: Partial<ReceiptPrinterSettings>;
+    density?: DensityName;
+    status?: PatternStatus;
+    result?: OnboardingResult;
+    operations?: ReceiptPrinterOperations;
+    reload?: OnboardingOperation<void>;
+    initial?: ReceiptPrinterSeed;
+    size?: ReceiptPrinterSize;
+    /**
+     * What draws the printer. Default: the Rive printer on the web and a still receipt on native. A
+     * React Native app that installs the Rive runtime passes `RiveReceiptStage` from
+     * `@comppack/ui/native/receipt-printer` (or uses `NativeReceiptPrinter`, which does) for the same animated printer.
+     */
+    stage?: ComponentType<ReceiptStageProps>;
+    /** The form as typed, on every change. */
+    onChange?: (draft: ReceiptDraft) => void;
+    /** The receipt is printed and at rest: the values it was printed from, and its lines. */
+    onPrinted?: (receipt: ReceiptValues, lines: ReceiptLines) => void;
+    onReset?: () => void;
+    /**
+     * The fields were redefined in the "Edit fields" mode — added, removed, renamed, re-keyed or a
+     * new heading. The list is config-shaped: save it as `config.fields` and the form comes back the same.
+     */
+    onFieldsChange?: (fields: ReceiptFieldDef[]) => void;
+    onScene?: (scene: string) => void;
+    testID?: string;
+};
+/** The printed receipt, as one sentence for a screen reader. */
+export declare function receiptSpeech(l: ReceiptLines): string;
+/** Receipt Printer, guarded: a wrong-kind config is refused by name and a render error is caught, never thrown to the page (`shared/guard`). */
+export declare const ReceiptPrinter: {
+    ({ onError, actions, onButtonAction, ...props }: ReceiptPrinterProps & import("..").GuardProps): import("react").JSX.Element;
+    displayName: string;
+};
+//# sourceMappingURL=ReceiptPrinterView.d.ts.map

package/dist/esm/components/onboarding/receipt-printer/ReceiptPrinterView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReceiptPrinterView.d.ts","sourceRoot":"","sources":["../../../../../src/components/onboarding/receipt-printer/ReceiptPrinterView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsC,KAAK,aAAa,EAAkB,MAAM,OAAO,CAAC;AAG/F,OAAO,EAAS,KAAK,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAE1D,OAAO,EAAiB,KAAK,gBAAgB,EAAE,KAAK,gBAAgB,EAAE,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACrH,OAAO,EAAqB,KAAK,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAM7E,OAAO,EAEc,KAAK,eAAe,EAAyB,KAAK,sBAAsB,EAAE,KAAK,aAAa,EAChH,MAAM,YAAY,CAAC;AACpB,OAAO,EAEL,KAAK,YAAY,EAA0B,KAAK,YAAY,EAAE,KAAK,kBAAkB,EACtF,MAAM,UAAU,CAAC;AAElB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAE9D,MAAM,MAAM,wBAAwB,GAAG;IACrC;;;OAGG;IACH,KAAK,EAAE,mBAAmB,CAAC;QAAE,OAAO,EAAE,aAAa,CAAC;QAAC,KAAK,EAAE,YAAY,CAAA;KAAE,CAAC,CAAC;CAC7E,CAAC;AAEF,uGAAuG;AACvG,MAAM,MAAM,kBAAkB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAG9D,MAAM,MAAM,mBAAmB,GAAG;IAChC,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAC,sBAAsB,CAAC,CAAC;IACzC,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B,UAAU,CAAC,EAAE,wBAAwB,CAAC;IACtC,MAAM,CAAC,EAAE,mBAAmB,CAAC,IAAI,CAAC,CAAC;IACnC,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B;;;;OAIG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IACzC,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IACzC,yFAAyF;IACzF,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAClE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,EAAE,KAAK,IAAI,CAAC;IACrD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAqZF,gEAAgE;AAChE,wBAAgB,aAAa,CAAC,CAAC,EAAE,YAAY,GAAG,MAAM,CAIrD;AAED,gJAAgJ;AAChJ,eAAO,MAAM,cAAc;;;CAAyE,CAAC"}

package/dist/esm/components/onboarding/receipt-printer/ReceiptPrinterView.js

@@ -0,0 +1,165 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useId, useRef, useState } from 'react';
+import { Box, Input, Select, Text, useReduceMotion } from '../../../core';
+import { Button, Callout, Checkbox, IconButton } from '../../../ds';
+import { useDs } from '../../../tokens';
+import { useOperationRunner } from '../../../runtime/operations';
+import { resolveConfig } from '../shared/contract';
+import { ONBOARDING_TIMING } from '../shared/mock';
+import { InvalidConfig } from '../shared/InvalidConfig';
+import { FieldLabel, OnboardingCard } from '../shared/OnboardingCard';
+import { Hidden } from '../shared/parts';
+import { runOutcome, useDefaultOperation, usePatternStatus, useSceneReport, useSeededReducer } from '../shared/runtime';
+import { guarded } from '../shared/guard';
+import { RECEIPT_MAX_LENGTH, RECEIPT_PRINTER_PRESETS, validateReceiptPrinter, } from './contract';
+import { currenciesOf, hasChoices, initialReceiptPrinter, methodsOf, receiptPrinterSeed, receiptPrinterView, reduceReceiptPrinter, valuesOf, } from './engine';
+import { ReceiptStage } from './ReceiptStage';
+const STAGE_WIDTH = { small: 260, medium: 340, large: 420 };
+/**
+ * **Receipt Printer** — a payment form and a golden roll printer. Print checks the form; if it is
+ * complete the fields lock, the host's `print` operation runs, and the receipt feeds out of the
+ * printer with exactly what was typed on it. Printed, the receipt stays; Print again reprints the
+ * form as it now stands, and Reset puts the form and the printer back where they started.
+ *
+ * Reduced motion keeps the print and drops the feed: the receipt appears at rest. The printed
+ * receipt is also read out, since the printer itself is a picture.
+ */
+function ReceiptPrinterView(props) {
+    const config = resolveConfig(RECEIPT_PRINTER_PRESETS, props.preset, props.config);
+    const issues = validateReceiptPrinter(config);
+    if (issues.length)
+        return _jsx(InvalidConfig, { title: config.title, issues: issues, testID: props.testID });
+    return _jsx(Valid, { ...props, config: config });
+}
+/** Each built-in field's label is a config key, so it can be renamed; these are the fallbacks for a blank one. */
+const LABEL_KEYS = {
+    currency: 'currencyLabel', paymentMethod: 'paymentMethodLabel', date: 'dateLabel', message: 'messageLabel',
+};
+const FALLBACK = {
+    currencyLabel: 'Currency', paymentMethodLabel: 'Payment method', dateLabel: 'Date', messageLabel: 'Message', itemsLabel: 'Items',
+    itemNameLabel: 'Item', quantityLabel: 'Qty', amountLabel: 'Amount', optionalLabel: 'optional', addItemLabel: 'Add item',
+    removeItemLabel: 'Remove', editFieldsLabel: 'Edit fields', doneEditingLabel: 'Done', addFieldLabel: 'Add field',
+    removeFieldLabel: 'Remove field', fieldLabelLabel: 'Label', fieldKeyLabel: 'Key', headingLabel: 'Heading',
+};
+/** A field list as config — what `onFieldsChange` reports and `config.fields` takes back. */
+const asConfig = (fields) => fields.map(f => ({ key: f.key, label: f.label, value: f.value, ...(f.heading ? { heading: true } : {}) }));
+const labelOf = (c, key) => {
+    const v = c[key];
+    return typeof v === 'string' && v.trim() ? v : FALLBACK[key] ?? '';
+};
+function Valid({ config, density, status = 'ready', result, operations, reload, initial, size = 'medium', stage: Stage = ReceiptStage, onChange, onPrinted, onReset, onFieldsChange, onScene, testID, }) {
+    const { colors } = useDs();
+    const uid = useId();
+    const runner = useOperationRunner();
+    const reduceMotion = useReduceMotion();
+    const key = JSON.stringify([config, initial ?? null]);
+    const [state, send, ref] = useSeededReducer(reduceReceiptPrinter, () => initialReceiptPrinter(config, initial ?? (config.ship ? receiptPrinterSeed(config, config.ship) : {})), key, () => runner.cancel('print'));
+    const pattern = usePatternStatus(hasChoices(config) ? status : status === 'ready' ? 'empty' : status, reload);
+    const v = receiptPrinterView(config, state);
+    useSceneReport(pattern.status === 'ready' ? v.scene : pattern.status, onScene);
+    const print = useDefaultOperation(operations?.print, ONBOARDING_TIMING.print, () => result === 'error');
+    const runPrint = (job) => {
+        const s = ref.current;
+        if (!s.printed)
+            return;
+        runOutcome(runner, 'print', print, { receipt: valuesOf(s.draft), lines: s.printed }, {
+            ok: () => send({ type: 'acknowledged', job }),
+            fail: message => send({ type: 'failed', job, message }),
+        });
+    };
+    /* A board that ships mid-print runs its operation, as a real print would. */
+    useEffect(() => { if (ref.current.run === 'printing')
+        runPrint(ref.current.job); }, [key]);
+    /* Printed means both halves are done; say so once per print, with what was printed. A receipt that
+       was already printed when the board mounted (a restored session) is not announced again. */
+    const announced = useRef(state.run === 'printed' ? state.job : 0);
+    useEffect(() => {
+        if (state.run !== 'printed' || !state.printed || state.job === announced.current)
+            return;
+        announced.current = state.job;
+        onPrinted?.(valuesOf(state.draft), state.printed);
+    }, [state.run, state.job]);
+    const submit = () => {
+        const before = ref.current;
+        const next = reduceReceiptPrinter(before, { type: 'print', config });
+        send({ type: 'print', config });
+        if (next.run === 'printing' && next.job !== before.job) {
+            ref.current = next;
+            runPrint(next.job);
+        }
+    };
+    const reset = () => { runner.cancel('print'); send({ type: 'reset', config }); onReset?.(); };
+    const edit = (field, value) => {
+        send({ type: 'field', field, value });
+        onChange?.({ ...ref.current.draft, [field]: value });
+    };
+    const [editingFields, setEditingFields] = useState(false);
+    /* The builder's edits: apply, then report the new structure (a value typed is not a structure change). */
+    const defineField = (a) => {
+        const next = reduceReceiptPrinter(ref.current, a);
+        send(a);
+        onChange?.(next.draft);
+        onFieldsChange?.(asConfig(next.draft.fields));
+    };
+    const editFieldValue = (index, value) => {
+        send({ type: 'fieldValue', index, value });
+        onChange?.(reduceReceiptPrinter(ref.current, { type: 'fieldValue', index, value }).draft);
+    };
+    const editItem = (index, field, value) => {
+        send({ type: 'item', index, field, value });
+        onChange?.({ ...ref.current.draft, items: ref.current.draft.items.map((it, i) => (i === index ? { ...it, [field]: value } : it)) });
+    };
+    const addItem = () => { send({ type: 'addItem' }); onChange?.(reduceReceiptPrinter(ref.current, { type: 'addItem' }).draft); };
+    const removeItem = (index) => { send({ type: 'removeItem', index }); onChange?.(reduceReceiptPrinter(ref.current, { type: 'removeItem', index }).draft); };
+    const currencies = currenciesOf(config);
+    const methods = methodsOf(config);
+    const symbol = currencies.find(c => c.code === state.draft.currency)?.symbol;
+    const id = (f) => `${uid}-${f}`;
+    const locked = v.busy;
+    const field = (f, extra = {}) => (_jsx(Input, { nativeID: id(f), value: state.draft[f], onChangeText: t => edit(f, t), onSubmit: submit, disabled: locked, maxLength: f === 'message' ? RECEIPT_MAX_LENGTH.message + 8 : undefined, numeric: extra.numeric, prefix: extra.prefix, placeholder: extra.placeholder, error: Boolean(v.errors[f]), "aria-required": f !== 'message', "aria-invalid": Boolean(v.errors[f]), "aria-labelledby": `${id(f)}-label`, "aria-describedby": v.errors[f] ? `${id(f)}-error` : undefined }));
+    const cell = (f, control, basis = 200) => (_jsxs(Box, { gap: "s1", style: { flexGrow: 1, flexBasis: basis, minWidth: 0 }, children: [_jsx(FieldLabel, { nativeID: `${id(f)}-label`, hint: f === 'message' ? labelOf(config, 'optionalLabel') : undefined, children: labelOf(config, LABEL_KEYS[f]) }), control, v.errors[f] ? _jsx(Text, { nativeID: `${id(f)}-error`, variant: "caption", style: { fontSize: 12, color: colors.status.needsUser }, children: v.errors[f] }) : null] }, f));
+    return (_jsx(OnboardingCard, { testID: testID, header: config, copy: config, density: density, status: pattern.status, onRetry: pattern.retry, onEmptyAction: pattern.retry, chip: v.chip, hint: v.hint, secondary: v.canReset ? { label: config.resetLabel, onPress: reset } : undefined, primary: { label: v.primaryLabel, busy: v.busy, disabled: v.busy, onPress: submit }, children: _jsxs(Box, { gap: "s4", children: [_jsxs(Box, { row: true, wrap: true, gap: "s5", align: "flex-start", children: [_jsxs(Box, { role: "group", "aria-label": config.title, row: true, wrap: true, gap: "s3", style: { flexGrow: 1, flexBasis: 280, minWidth: 0 }, children: [_jsx(FieldsEditor, { uid: uid, config: config, fields: state.draft.fields, errors: v.errors, locked: locked, editing: editingFields && !locked, canAdd: v.canAddField, onToggle: () => setEditingFields(e => !e), onValue: editFieldValue, onDefine: defineField, onSubmit: submit }), _jsx(ItemsEditor, { uid: uid, config: config, items: state.draft.items, errors: v.errors, symbol: symbol, locked: locked, canAdd: v.canAddItem, canRemove: v.canRemoveItem, onEdit: editItem, onAdd: addItem, onRemove: removeItem, onSubmit: submit }), cell('currency', (_jsx(Select, { value: state.draft.currency || undefined, onChange: c => edit('currency', c), options: currencies.map(c => ({ value: c.code, label: `${c.code} (${c.symbol})` })), disabled: locked, error: Boolean(v.errors.currency), "aria-labelledby": `${id('currency')}-label` })), 120), cell('paymentMethod', (_jsx(Select, { value: state.draft.paymentMethod || undefined, onChange: m => edit('paymentMethod', m), options: methods.map(m => ({ value: m.id, label: m.label })), disabled: locked, error: Boolean(v.errors.paymentMethod), "aria-labelledby": `${id('paymentMethod')}-label` })), 140), cell('date', field('date', { placeholder: 'YYYY-MM-DD' }), 140), cell('message', field('message'), 140)] }), _jsx(Box, { align: "center", style: { flexGrow: 1, flexBasis: 240, minWidth: 0 }, children: _jsx(Stage, { testID: testID ? `${testID}-printer` : undefined, lines: v.lines, job: state.job, phase: v.phase, reduceMotion: reduceMotion, onPrinted: job => send({ type: 'fed', job }), label: v.phase === 'idle' ? 'Receipt printer, ready' : `Receipt printer, ${v.phase === 'printing' ? 'printing' : 'printed'} receipt`, maxWidth: STAGE_WIDTH[size] ?? STAGE_WIDTH.medium }) })] }), state.run === 'failed' ? _jsx(Callout, { alert: true, title: config.failTitle, children: state.failMessage || config.failBody }) : null, _jsxs(Box, { role: "status", "aria-live": "polite", children: [state.run === 'printing' ? _jsx(Hidden, { children: config.printingHint }) : null, state.run === 'printed' && state.printed ? _jsx(Hidden, { children: receiptSpeech(state.printed) }) : null] })] }) }));
+}
+/**
+ * **The host's own fields.** Normally a labelled input each — the labels are the host's. "Edit
+ * fields" turns each into its definition instead: its label, its key (which follows the label until
+ * typed by hand), whether it is the receipt's heading, and Remove; and adds Add field. Done goes
+ * back to the values. Every change to a definition is reported through `onFieldsChange`.
+ */
+function FieldsEditor({ uid, config, fields, errors, locked, editing, canAdd, onToggle, onValue, onDefine, onSubmit, }) {
+    const { colors } = useDs();
+    const err = (i, part) => errors[`fields.${i}.${part}`];
+    const errorText = (id, text) => text ? _jsx(Text, { nativeID: id, variant: "caption", style: { fontSize: 12, color: colors.status.needsUser }, children: text }) : null;
+    return (_jsxs(Box, { gap: "s3", style: { flexGrow: 1, flexBasis: '100%', minWidth: 0 }, children: [_jsx(Box, { row: true, justify: "flex-end", children: _jsx(Button, { variant: "secondary", size: "xsmall", onPress: onToggle, disabled: locked, "aria-pressed": editing, children: editing ? labelOf(config, 'doneEditingLabel') : labelOf(config, 'editFieldsLabel') }) }), editing ? (_jsxs(Box, { role: "group", "aria-label": labelOf(config, 'editFieldsLabel'), gap: "s3", children: [fields.map((f, i) => {
+                        const name = f.label || `${labelOf(config, 'fieldLabelLabel')} ${i + 1}`;
+                        const problems = [err(i, 'label'), err(i, 'key')].filter(Boolean).join(' ');
+                        return (_jsxs(Box, { gap: "s1", style: { borderRadius: 10, backgroundColor: colors.surfaceSunken, padding: 10 }, children: [_jsxs(Box, { row: true, gap: "s2", align: "center", children: [_jsx(Box, { style: { flexGrow: 1, flexBasis: 0, minWidth: 80 }, children: _jsx(Input, { value: f.label, onChangeText: t => onDefine({ type: 'fieldDef', index: i, label: t }), placeholder: labelOf(config, 'fieldLabelLabel'), error: Boolean(err(i, 'label')), "aria-invalid": Boolean(err(i, 'label')), "aria-label": `${labelOf(config, 'fieldLabelLabel')} ${i + 1}`, "aria-describedby": problems ? `${uid}-fielddef-${i}-error` : undefined }) }), _jsx(Box, { style: { flexGrow: 1, flexBasis: 0, minWidth: 80 }, children: _jsx(Input, { value: f.key, onChangeText: t => onDefine({ type: 'fieldDef', index: i, key: t.replace(/\s+/g, '') }), mono: true, error: Boolean(err(i, 'key')), "aria-invalid": Boolean(err(i, 'key')), "aria-label": `${labelOf(config, 'fieldKeyLabel')} ${i + 1}`, "aria-describedby": problems ? `${uid}-fielddef-${i}-error` : undefined }) }), _jsx(IconButton, { icon: "close", label: `${labelOf(config, 'removeFieldLabel')} ${name}`, onPress: () => onDefine({ type: 'removeField', index: i }) })] }), _jsx(Checkbox, { checked: f.heading, onChange: on => onDefine({ type: 'fieldDef', index: i, heading: on }), label: `${labelOf(config, 'headingLabel')} — ${name}` }), errorText(`${uid}-fielddef-${i}-error`, problems)] }, i));
+                    }), _jsx(Box, { row: true, children: _jsx(Button, { variant: "secondary", size: "xsmall", onPress: () => onDefine({ type: 'addField' }), disabled: !canAdd, children: `+ ${labelOf(config, 'addFieldLabel')}` }) })] })) : (_jsx(Box, { row: true, wrap: true, gap: "s3", children: fields.map((f, i) => (_jsxs(Box, { gap: "s1", style: { flexGrow: 1, flexBasis: f.heading ? '100%' : 140, minWidth: 0 }, children: [_jsx(FieldLabel, { nativeID: `${uid}-field-${i}-label`, children: f.label || `${labelOf(config, 'fieldLabelLabel')} ${i + 1}` }), _jsx(Input, { nativeID: `${uid}-field-${i}`, value: f.value, onChangeText: t => onValue(i, t), onSubmit: onSubmit, disabled: locked, error: Boolean(err(i, 'value')), "aria-required": true, "aria-invalid": Boolean(err(i, 'value')), "aria-labelledby": `${uid}-field-${i}-label`, "aria-describedby": err(i, 'value') || err(i, 'label') || err(i, 'key') ? `${uid}-field-${i}-error` : undefined }), errorText(`${uid}-field-${i}-error`, [err(i, 'value'), err(i, 'label') || err(i, 'key') ? `${labelOf(config, 'editFieldsLabel')} to fix its label or key.` : ''].filter(Boolean).join(' ') || undefined)] }, i))) }))] }));
+}
+/**
+ * **The item lines** — one row per line (item, quantity, price of one) with Remove, and Add item
+ * under them, up to `RECEIPT_MAX_ITEMS`. The column labels are config keys like every other label;
+ * each input also carries its line number in its accessible name ("Item 2").
+ */
+function ItemsEditor({ uid, config, items, errors, symbol, locked, canAdd, canRemove, onEdit, onAdd, onRemove, onSubmit, }) {
+    const { colors } = useDs();
+    const [itemL, qtyL, amountL] = [labelOf(config, 'itemNameLabel'), labelOf(config, 'quantityLabel'), labelOf(config, 'amountLabel')];
+    const input = (i, f, label, extra = {}) => {
+        const err = errors[`items.${i}.${f}`];
+        return (_jsx(Input, { nativeID: `${uid}-items-${i}-${f}`, value: items[i][f], onChangeText: t => onEdit(i, f, t), onSubmit: onSubmit, disabled: locked, numeric: extra.numeric, prefix: extra.prefix, maxLength: extra.maxLength, error: Boolean(err), "aria-required": true, "aria-invalid": Boolean(err), "aria-label": `${label} ${i + 1}`, "aria-describedby": err ? `${uid}-items-${i}-error` : undefined }));
+    };
+    return (_jsxs(Box, { role: "group", "aria-label": labelOf(config, 'itemsLabel'), gap: "s2", style: { flexGrow: 1, flexBasis: '100%', minWidth: 0 }, children: [_jsx(FieldLabel, { children: labelOf(config, 'itemsLabel') }), _jsxs(Box, { row: true, gap: "s2", "aria-hidden": true, children: [_jsx(Text, { variant: "caption", color: "textSecondary", style: { fontSize: 11, flexGrow: 1, flexBasis: 0, minWidth: 0 }, children: itemL }), _jsx(Text, { variant: "caption", color: "textSecondary", style: { fontSize: 11, width: 52 }, children: qtyL }), _jsx(Text, { variant: "caption", color: "textSecondary", style: { fontSize: 11, width: 96 }, children: amountL }), canRemove ? _jsx(Box, { style: { width: 32 } }) : null] }), items.map((_, i) => {
+                const rowErrors = ['name', 'quantity', 'amount'].map(f => errors[`items.${i}.${f}`]).filter(Boolean);
+                return (_jsxs(Box, { gap: "s1", children: [_jsxs(Box, { row: true, gap: "s2", align: "center", children: [_jsx(Box, { style: { flexGrow: 1, flexBasis: 0, minWidth: 64 }, children: input(i, 'name', itemL, { maxLength: RECEIPT_MAX_LENGTH.itemName + 8 }) }), _jsx(Box, { style: { width: 52 }, children: input(i, 'quantity', qtyL, { numeric: true }) }), _jsx(Box, { style: { width: 96 }, children: input(i, 'amount', amountL, { numeric: true, prefix: symbol }) }), canRemove ? (_jsx(IconButton, { icon: "close", label: `${labelOf(config, 'removeItemLabel')} ${itemL} ${i + 1}`, onPress: () => onRemove(i), disabled: locked })) : null] }), rowErrors.length ? _jsx(Text, { nativeID: `${uid}-items-${i}-error`, variant: "caption", style: { fontSize: 12, color: colors.status.needsUser }, children: rowErrors.join(' ') }) : null] }, i));
+            }), errors.items ? _jsx(Text, { variant: "caption", style: { fontSize: 12, color: colors.status.needsUser }, children: errors.items }) : null, _jsx(Box, { row: true, children: _jsx(Button, { variant: "secondary", size: "xsmall", onPress: onAdd, disabled: !canAdd, children: `+ ${labelOf(config, 'addItemLabel')}` }) })] }));
+}
+/** The printed receipt, as one sentence for a screen reader. */
+export function receiptSpeech(l) {
+    const items = l.items.map(it => `${it.line}, ${it.amount}`).join('; ');
+    const details = l.details.map(d => `${d.label}: ${d.value}`).join(', ');
+    return `Receipt printed. ${l.title ? `${l.title}, ` : ''}${l.meta}. ${details ? `${details}. ` : ''}${items}. ${l.paymentLabel} ${l.paymentMethod}. ${l.totalLabel} ${l.total}.${l.message ? ` ${l.message}` : ''}`;
+}
+/** Receipt Printer, guarded: a wrong-kind config is refused by name and a render error is caught, never thrown to the page (`shared/guard`). */
+export const ReceiptPrinter = guarded(ReceiptPrinterView, RECEIPT_PRINTER_PRESETS, 'ReceiptPrinter');
+//# sourceMappingURL=ReceiptPrinterView.js.map