@appinternalleads/ui 0.2.0

package/src/components/onboarding/tag-creation/TagCreationView.tsx

@@ -0,0 +1,101 @@
+import { useEffect } from 'react';
+import { Box } from '../../../core';
+import { Callout, TagInput } from '../../../ds';
+import type { DensityName } from '../../../tokens';
+import { resolveConfig, type OnboardingPreset, type OnboardingResult, type PatternStatus } from '../shared/contract';
+import { ONBOARDING_TIMING, type OnboardingOperation } from '../shared/mock';
+import { InvalidConfig } from '../shared/InvalidConfig';
+import { FieldLabel, OnboardingCard } from '../shared/OnboardingCard';
+import { runOutcome, useDefaultOperation, usePatternStatus, useSceneReport, useSeededReducer } from '../shared/runtime';
+import { useOperationRunner } from '../../../runtime/operations';
+import { TAG_PRESETS, validateTagCreation, type TagCreationSettings } from './contract';
+import { initialTags, reduceTags, tagSeed, tagView, type TagSeed } from './engine';
+import { guarded } from '../shared/guard';
+
+export type TagCreationOperations = { save: OnboardingOperation<{ tags: string[] }> };
+
+export type TagCreationProps = {
+  preset?: OnboardingPreset;
+  config?: Partial<TagCreationSettings>;
+  density?: DensityName;
+  status?: PatternStatus;
+  result?: OnboardingResult;
+  operations?: TagCreationOperations;
+  reload?: OnboardingOperation<void>;
+  initial?: TagSeed;
+  onChange?: (tags: string[]) => void;
+  onSave?: (tags: string[]) => void;
+  onScene?: (scene: string) => void;
+  testID?: string;
+};
+
+/**
+ * **Tag Creation** — a tag field (C11, `filled`): Enter or comma adds, Backspace in an empty field
+ * removes the last, tags add and leave with M14. A duplicate keeps the text and says "Tag already
+ * exists"; at `max` the field is disabled and says why. The helper line is live.
+ */
+function TagCreationView(props: TagCreationProps) {
+  const config = resolveConfig(TAG_PRESETS, props.preset, props.config);
+  const issues = validateTagCreation(config);
+  if (issues.length) return <InvalidConfig title={config.title} issues={issues} testID={props.testID} />;
+  return <Valid {...props} config={config} />;
+}
+
+function Valid({
+  config, density, status = 'ready', result, operations, reload, initial, onChange, onSave, onScene, testID,
+}: Omit<TagCreationProps, 'config'> & { config: TagCreationSettings }) {
+  const runner = useOperationRunner();
+  const key = JSON.stringify([config, initial ?? null]);
+  const [state, send, ref] = useSeededReducer(
+    reduceTags,
+    () => initialTags(config, initial ?? (config.ship ? tagSeed(config, config.ship) : {})),
+    key,
+    () => runner.cancel('save'),
+  );
+  const pattern = usePatternStatus(status, reload);
+  const v = tagView(config, state);
+  useSceneReport(pattern.status === 'ready' ? v.scene : pattern.status, onScene);
+  const save = useDefaultOperation(operations?.save, ONBOARDING_TIMING.save, () => result === 'error');
+  const run = () => {
+    const tags = ref.current.tags;
+    runOutcome(runner, 'save', save, { tags }, { ok: () => { send({ type: 'saved' }); onSave?.(tags); }, fail: () => send({ type: 'failed' }) });
+  };
+  useEffect(() => { if (ref.current.save === 'saving') run(); }, [key]);
+  const tagsKey = state.tags.join('\u0000');
+  useEffect(() => { onChange?.(ref.current.tags); }, [tagsKey]);
+
+  return (
+    <OnboardingCard
+      testID={testID}
+      header={config}
+      copy={config}
+      density={density}
+      status={pattern.status}
+      onRetry={pattern.retry}
+      onEmptyAction={() => { send({ type: 'tags', tags: [] }); pattern.set('ready'); }}
+      chip={v.chip}
+      hint={v.footerHint}
+      primary={{ label: v.primaryLabel, disabled: !v.canSave, busy: state.save === 'saving', onPress: () => { if (!tagView(config, ref.current).canSave) return; send({ type: 'save' }); run(); } }}>
+      <Box gap="s1">
+        <FieldLabel>{config.label}</FieldLabel>
+        <TagInput
+          variant="filled"
+          label={config.label}
+          value={state.tags}
+          onChange={tags => send({ type: 'tags', tags })}
+          draft={state.draft}
+          onDraftChange={draft => send({ type: 'draft', draft })}
+          max={config.max}
+          placeholder={config.placeholder}
+          disabled={state.save === 'saving'}
+          error={v.duplicate ? 'Tag already exists' : undefined}
+          helper={v.helper}
+        />
+        {state.save === 'failed' ? <Box pt="s2"><Callout alert title={config.saveErrorTitle}>{config.saveErrorBody}</Callout></Box> : null}
+      </Box>
+    </OnboardingCard>
+  );
+}
+
+/** TagCreation, guarded: a wrong-kind config is refused by name and a render error is caught, never thrown to the page (`shared/guard`). */
+export const TagCreation = guarded(TagCreationView, TAG_PRESETS, 'TagCreation');

package/src/components/onboarding/tag-creation/contract.ts

@@ -0,0 +1,41 @@
+import type { HeaderConfig, LoadCopy, OnboardingIssue, PresetsFile } from '../shared/contract';
+import presetsJson from './presets.json';
+
+/** **Tag Creation (batch 2 §3.12)** — create and remove tags, up to `max`. */
+
+export const TAG_SCENES = ['default', 'none', 'typing', 'duplicate', 'atMax', 'saving', 'saved', 'failed', 'loading', 'empty', 'error'] as const;
+export type TagScene = (typeof TAG_SCENES)[number];
+/** Scenes that are an operation in flight — see `sceneProps`. */
+export const TAG_IN_FLIGHT: readonly string[] = ['saving'];
+
+export type TagCreationSettings = HeaderConfig & LoadCopy & {
+  tags: string[];
+  max: number;
+  placeholder: string;
+  noun: string;
+  nouns: string;
+  /** The field's name — "Tags", "Skills". */
+  label: string;
+  /** The helper with no tags yet. */
+  emptyHelp: string;
+  /** Demo only: the "typing" scene's draft, and the tags the "atMax" scene fills with. */
+  typingDemo?: string;
+  maxDemo?: string[];
+  ship?: TagScene;
+  primaryLabel: string;
+  savedHint: string;
+  saveErrorTitle: string;
+  saveErrorBody: string;
+};
+
+export const TAG_PRESETS = presetsJson as unknown as PresetsFile<TagCreationSettings>;
+
+export function validateTagCreation(c: TagCreationSettings): OnboardingIssue[] {
+  if (!Array.isArray(c.tags)) return [{ path: 'tags', message: 'tags must be a list.' }];
+  const issues: OnboardingIssue[] = [];
+  if (!(c.max >= 1)) issues.push({ path: 'max', message: 'max must be at least 1.' });
+  if (c.tags.length > c.max) issues.push({ path: 'tags', message: 'More tags than max allows.' });
+  const seen = new Set<string>();
+  for (const t of c.tags) { if (seen.has(t.toLowerCase())) issues.push({ path: 'tags', message: `“${t}” is listed twice.` }); seen.add(t.toLowerCase()); }
+  return issues;
+}

package/src/components/onboarding/tag-creation/engine.ts

@@ -0,0 +1,55 @@
+import type { StateChipTone } from '../../../ds';
+import type { SavePhase } from '../shared/contract';
+import type { TagCreationSettings, TagScene } from './contract';
+
+/** **The Tag Creation engine** — pure: the tags, the draft, the save. */
+
+export type TagState = { tags: string[]; draft: string; save: SavePhase };
+export type TagSeed = Partial<TagState>;
+export type TagAction = { type: 'tags'; tags: string[] } | { type: 'draft'; draft: string } | { type: 'save' } | { type: 'saved' } | { type: 'failed' };
+
+export function initialTags(c: TagCreationSettings, seed: TagSeed = {}): TagState {
+  return { tags: seed.tags ?? c.tags.slice(), draft: seed.draft ?? '', save: seed.save ?? 'idle' };
+}
+
+export function tagSeed(c: TagCreationSettings, scene: TagScene): TagSeed {
+  if (scene === 'none') return { tags: [] };
+  if (scene === 'typing') return { draft: c.typingDemo ?? '' };
+  if (scene === 'duplicate' && c.tags[0]) return { draft: c.tags[0] };
+  if (scene === 'atMax') {
+    const extra = c.maxDemo ?? [];
+    const tags = c.tags.slice();
+    for (let i = tags.length; i < c.max; i++) tags.push(extra[i - c.tags.length] ?? `tag-${i + 1}`);
+    return { tags: tags.slice(0, c.max) };
+  }
+  if (scene === 'saving' || scene === 'saved' || scene === 'failed') return { save: scene };
+  return {};
+}
+
+export function reduceTags(s: TagState, a: TagAction): TagState {
+  switch (a.type) {
+    case 'tags': return s.save === 'saving' ? s : { ...s, tags: a.tags, draft: '', save: 'idle' };
+    case 'draft': return { ...s, draft: a.draft };
+    case 'save': return s.save === 'saving' || s.save === 'saved' ? s : { ...s, save: 'saving' };
+    case 'saved': return s.save === 'saving' ? { ...s, save: 'saved' } : s;
+    case 'failed': return s.save === 'saving' ? { ...s, save: 'failed' } : s;
+  }
+}
+
+export function tagView(c: TagCreationSettings, s: TagState) {
+  const n = s.tags.length;
+  const d = s.draft.trim().toLowerCase();
+  const dup = Boolean(d) && s.tags.some(t => t.toLowerCase() === d);
+  const atMax = n >= c.max;
+  return {
+    duplicate: dup,
+    atMax,
+    scene: (s.save !== 'idle' ? s.save : dup ? 'duplicate' : atMax ? 'atMax' : s.draft ? 'typing' : n === 0 ? 'none' : 'default') as TagScene,
+    chip: s.save === 'saving' ? { tone: 'neutral' as StateChipTone, label: 'Saving…' }
+      : { tone: (s.save === 'saved' ? 'success' : 'neutral') as StateChipTone, label: s.save === 'saved' ? 'Saved' : `${n} ${n === 1 ? c.noun : c.nouns}` },
+    helper: atMax ? `You’ve reached ${c.max} ${c.nouns}. Remove one to add another.` : n === 0 ? c.emptyHelp : `Press Enter or comma to add · ${n} of ${c.max}`,
+    footerHint: s.save === 'saved' ? c.savedHint : `${n} of ${c.max} ${c.nouns}`,
+    primaryLabel: s.save === 'saving' ? 'Saving…' : s.save === 'saved' ? 'Saved' : s.save === 'failed' ? c.retryLabel : c.primaryLabel,
+    canSave: s.save !== 'saving' && s.save !== 'saved',
+  };
+}

package/src/components/onboarding/tag-creation/index.ts

@@ -0,0 +1,6 @@
+export {
+  TAG_IN_FLIGHT, TAG_PRESETS, TAG_SCENES, validateTagCreation,
+  type TagCreationSettings, type TagScene,
+} from './contract';
+export { initialTags, reduceTags, tagSeed, tagView, type TagAction, type TagSeed, type TagState } from './engine';
+export { TagCreation, type TagCreationOperations, type TagCreationProps } from './TagCreationView';

package/src/components/onboarding/tag-creation/presets.json

@@ -0,0 +1,145 @@
+{
+  "component": "tag-creation",
+  "baseCopy": {
+    "loadErrorTitle": "Couldn’t load this step",
+    "loadErrorBody": "Nothing was lost. Retry to load it again.",
+    "retryLabel": "Retry",
+    "emptyCta": "Refresh"
+  },
+  "base": {
+    "type": "data",
+    "icon": "tag",
+    "title": "Create content tags",
+    "subtitle": "Readers use tags to find related posts.",
+    "noun": "tag",
+    "nouns": "tags",
+    "label": "Tags",
+    "tags": [],
+    "max": 10,
+    "placeholder": "Add a tag",
+    "typingDemo": "product upd",
+    "emptyHelp": "No tags yet. Type one and press Enter.",
+    "primaryLabel": "Save tags",
+    "savedHint": "Saved · tags appear on new posts",
+    "saveErrorTitle": "Couldn’t save tags",
+    "saveErrorBody": "Your tags are still here. Retry when you’re ready.",
+    "emptyTitle": "Tags are turned off",
+    "emptyBody": "Turn tags on to organise posts.",
+    "emptyCta": "Turn on tags"
+  },
+  "cases": {
+    "case1": {
+      "maxDemo": [
+        "news",
+        "guides",
+        "product",
+        "culture",
+        "hiring",
+        "events",
+        "design",
+        "engineering",
+        "customers",
+        "updates"
+      ]
+    },
+    "case2": {
+      "type": "action",
+      "icon": "inbox",
+      "title": "Create ticket labels",
+      "subtitle": "Agents use labels to sort and report.",
+      "noun": "label",
+      "nouns": "labels",
+      "label": "Labels",
+      "tags": [
+        "bug",
+        "billing"
+      ],
+      "placeholder": "Add a label",
+      "typingDemo": "feature req",
+      "ship": "typing",
+      "emptyHelp": "No labels yet."
+    },
+    "case3": {
+      "type": "data",
+      "icon": "box",
+      "title": "Add product attributes",
+      "subtitle": "Shown as filters on the product page.",
+      "noun": "attribute",
+      "nouns": "attributes",
+      "label": "Attributes",
+      "tags": [
+        "cotton",
+        "summer",
+        "new"
+      ],
+      "placeholder": "Add an attribute",
+      "max": 8
+    },
+    "case4": {
+      "type": "agent",
+      "icon": "contacts",
+      "title": "Create contact segments",
+      "subtitle": "Group contacts for campaigns.",
+      "noun": "segment",
+      "nouns": "segments",
+      "label": "Segments",
+      "tags": [
+        "VIP",
+        "lead",
+        "partner"
+      ],
+      "placeholder": "Add a segment",
+      "ship": "duplicate"
+    },
+    "case5": {
+      "type": "action",
+      "icon": "briefcase",
+      "title": "Add candidate skills",
+      "subtitle": "Used to match candidates to roles.",
+      "noun": "skill",
+      "nouns": "skills",
+      "label": "Skills",
+      "tags": [
+        "React",
+        "TypeScript",
+        "Node.js",
+        "GraphQL",
+        "SQL",
+        "AWS",
+        "Docker",
+        "Figma",
+        "Testing",
+        "Mentoring"
+      ],
+      "placeholder": "Add a skill",
+      "max": 10
+    }
+  },
+  "meta": {
+    "case1": {
+      "eyebrow": "Case study 1 · Blog",
+      "title": "Content tags",
+      "scenario": "An editor creates the first tags for a blog. There are none yet."
+    },
+    "case2": {
+      "eyebrow": "Case study 2 · Support",
+      "title": "Ticket labels",
+      "scenario": "A support lead adds labels. The board ships mid-typing."
+    },
+    "case3": {
+      "eyebrow": "Case study 3 · E-commerce",
+      "title": "Product attributes",
+      "scenario": "A merchant tags a product with attributes shoppers can filter by."
+    },
+    "case4": {
+      "eyebrow": "Case study 4 · CRM",
+      "title": "Contact segments",
+      "scenario": "A marketer types a segment that already exists."
+    },
+    "case5": {
+      "eyebrow": "Case study 5 · Hiring",
+      "title": "Candidate skills",
+      "scenario": "A recruiter has already added ten skills, the maximum, so the input is disabled."
+    }
+  }
+}

package/src/components/onboarding/terms-consent/TermsConsentView.tsx

@@ -0,0 +1,106 @@
+import { useEffect } from 'react';
+import { Box, ExternalLink, Icon, Text } from '../../../core';
+import { Callout, Checkbox } from '../../../ds';
+import { blockRadii, useDs, type DensityName } from '../../../tokens';
+import { resolveConfig, type OnboardingPreset, type OnboardingResult, type PatternStatus } from '../shared/contract';
+import type { OnboardingOperation } from '../shared/mock';
+import { InvalidConfig } from '../shared/InvalidConfig';
+import { OnboardingCard } from '../shared/OnboardingCard';
+import { runOutcome, useDefaultOperation, usePatternStatus, useSceneReport, useSeededReducer } from '../shared/runtime';
+import { useOperationRunner } from '../../../runtime/operations';
+import { TERMS_PRESETS, validateTermsConsent, type TermsConsentSettings } from './contract';
+import { initialTerms, reduceTerms, termsView, type TermsSeed } from './engine';
+import { guarded } from '../shared/guard';
+
+export type ConsentRecord = { label: string; accepted: boolean }[];
+export type TermsConsentOperations = { accept: OnboardingOperation<{ consent: ConsentRecord }> };
+
+export type TermsConsentProps = {
+  preset?: OnboardingPreset;
+  config?: Partial<TermsConsentSettings>;
+  density?: DensityName;
+  status?: PatternStatus;
+  result?: OnboardingResult;
+  operations?: TermsConsentOperations;
+  reload?: OnboardingOperation<void>;
+  initial?: TermsSeed;
+  onAccept?: (consent: ConsentRecord) => void;
+  onScene?: (scene: string) => void;
+  testID?: string;
+};
+
+/**
+ * **Terms Consent** — one checkbox row per item (C1): the name, " (optional)" in muted text for an
+ * opt-in, a one-line description, and a "Read" link that opens in a new tab and says so. The primary
+ * waits for every required box; Accepting… → Accepted, or an apricot alert and Retry.
+ */
+function TermsConsentView(props: TermsConsentProps) {
+  const config = resolveConfig(TERMS_PRESETS, props.preset, props.config);
+  const issues = validateTermsConsent(config);
+  if (issues.length) return <InvalidConfig title={config.title} issues={issues} testID={props.testID} />;
+  return <Valid {...props} config={config} />;
+}
+
+function Valid({
+  config, density, status, result, operations, reload, initial, onAccept, onScene, testID,
+}: Omit<TermsConsentProps, 'config'> & { config: TermsConsentSettings }) {
+  const { colors } = useDs();
+  const runner = useOperationRunner();
+  const key = JSON.stringify([config, initial ?? null]);
+  const [state, send, ref] = useSeededReducer(reduceTerms, () => initialTerms(config, initial), key, () => runner.cancel('accept'));
+  const pattern = usePatternStatus(status ?? (config.items.length ? 'ready' : 'empty'), reload);
+  const v = termsView(config, state);
+  useSceneReport(pattern.status === 'ready' ? v.scene : pattern.status, onScene);
+  const accept = useDefaultOperation(operations?.accept, 1200, () => result === 'error');
+  const run = () => {
+    const consent = config.items.map((it, i) => ({ label: it.label, accepted: ref.current.checks[i]! }));
+    runOutcome(runner, 'accept', accept, { consent }, { ok: () => { send({ type: 'accepted' }); onAccept?.(consent); }, fail: () => send({ type: 'failed' }) });
+  };
+  useEffect(() => { if (ref.current.run === 'accepting') run(); }, [key]);
+
+  return (
+    <OnboardingCard
+      testID={testID}
+      header={config}
+      copy={config}
+      density={density}
+      status={pattern.status}
+      onRetry={pattern.retry}
+      onEmptyAction={pattern.retry}
+      chip={v.chip}
+      hint={v.footerHint}
+      primary={{ label: v.primaryLabel, disabled: !v.canAccept, busy: state.run === 'accepting', onPress: () => { if (!termsView(config, ref.current).canAccept) return; send({ type: 'accept' }); run(); } }}>
+      <Box gap="s3">
+        <Box>
+          {config.items.map((it, i) => (
+            <Box key={it.label} row align="flex-start" gap="s3" style={{ paddingVertical: 12, borderBottomWidth: i < config.items.length - 1 ? 1 : 0, borderBottomColor: colors.hairline }}>
+              <Box flex={1} style={{ minWidth: 0 }}>
+                <Checkbox
+                  label={it.label}
+                  labelSuffix={it.required ? '' : ' (optional)'}
+                  description={it.description}
+                  checked={state.checks[i]!}
+                  disabled={v.locked}
+                  onChange={() => send({ type: 'toggle', index: i })}
+                />
+              </Box>
+              {it.href ? (
+                <ExternalLink
+                  href={it.href}
+                  aria-label={`Read ${it.label} (opens in a new tab)`}
+                  style={{ flexDirection: 'row', alignItems: 'center', gap: 4, paddingHorizontal: 6, paddingVertical: 4, marginTop: 8, borderRadius: blockRadii.inset }}>
+                  <Text variant="caption" style={{ fontSize: 12, fontWeight: '600', color: colors.textPrimary }}>Read</Text>
+                  <Icon name="external" size={13} color={colors.textSecondary} />
+                </ExternalLink>
+              ) : null}
+            </Box>
+          ))}
+        </Box>
+        {state.run === 'failed' ? <Callout alert title={config.failTitle}>{config.failBody}</Callout> : null}
+      </Box>
+    </OnboardingCard>
+  );
+}
+
+/** TermsConsent, guarded: a wrong-kind config is refused by name and a render error is caught, never thrown to the page (`shared/guard`). */
+export const TermsConsent = guarded(TermsConsentView, TERMS_PRESETS, 'TermsConsent');

package/src/components/onboarding/terms-consent/contract.ts

@@ -0,0 +1,31 @@
+import type { HeaderConfig, LoadCopy, OnboardingIssue, PresetsFile } from '../shared/contract';
+import presetsJson from './presets.json';
+
+/**
+ * **Terms Consent (batch 2 §3.13)** — accept the required terms, with optional opt-ins. Optional
+ * items are marked by copy ("(optional)"), never by colour.
+ */
+
+export type ConsentItem = { label: string; description: string; href: string; required: boolean };
+
+export const TERMS_SCENES = ['default', 'partial', 'allChecked', 'accepting', 'accepted', 'failed', 'loading', 'empty', 'error'] as const;
+export type TermsScene = (typeof TERMS_SCENES)[number];
+/** Scenes that are an operation in flight — see `sceneProps`. */
+export const TERMS_IN_FLIGHT: readonly string[] = ['accepting'];
+
+export type TermsConsentSettings = HeaderConfig & LoadCopy & {
+  items: ConsentItem[];
+  primaryLabel: string;
+  acceptedHint: string;
+  failTitle: string;
+  failBody: string;
+};
+
+export const TERMS_PRESETS = presetsJson as unknown as PresetsFile<TermsConsentSettings>;
+
+export function validateTermsConsent(c: TermsConsentSettings): OnboardingIssue[] {
+  if (!Array.isArray(c.items)) return [{ path: 'items', message: 'items must be a list.' }];
+  const issues: OnboardingIssue[] = [];
+  c.items.forEach((it, i) => { if (it.href && !/^https?:\/\//.test(it.href)) issues.push({ path: `items[${i}].href`, message: 'Links must be http(s) URLs.' }); });
+  return issues;
+}

package/src/components/onboarding/terms-consent/engine.ts

@@ -0,0 +1,50 @@
+import type { StateChipTone } from '../../../ds';
+import type { TermsConsentSettings, TermsScene } from './contract';
+
+/** **The Terms Consent engine** — pure: which boxes are checked, and accepting. */
+
+export type ConsentRun = 'idle' | 'accepting' | 'accepted' | 'failed';
+export type TermsState = { checks: boolean[]; run: ConsentRun };
+export type TermsSeed = Partial<TermsState>;
+export type TermsAction = { type: 'toggle'; index: number } | { type: 'accept' } | { type: 'accepted' } | { type: 'failed' };
+
+export function initialTerms(c: TermsConsentSettings, seed: TermsSeed = {}): TermsState {
+  return { checks: seed.checks ?? c.items.map(() => false), run: seed.run ?? 'idle' };
+}
+
+export function termsSeed(c: TermsConsentSettings, scene: TermsScene): TermsSeed {
+  if (scene === 'partial') {
+    const k = c.items.findIndex(i => i.required);
+    return { checks: c.items.map((_, i) => i === k) };
+  }
+  if (scene === 'allChecked' || scene === 'accepting' || scene === 'accepted' || scene === 'failed') {
+    return { checks: c.items.map(i => i.required), ...(scene === 'allChecked' ? {} : { run: scene }) };
+  }
+  return {};
+}
+
+export function reduceTerms(s: TermsState, a: TermsAction): TermsState {
+  const locked = s.run === 'accepting' || s.run === 'accepted';
+  switch (a.type) {
+    case 'toggle': return locked ? s : { checks: s.checks.map((v, i) => (i === a.index ? !v : v)), run: s.run === 'failed' ? 'idle' : s.run };
+    case 'accept': return locked ? s : { ...s, run: 'accepting' };
+    case 'accepted': return s.run === 'accepting' ? { ...s, run: 'accepted' } : s;
+    case 'failed': return s.run === 'accepting' ? { ...s, run: 'failed' } : s;
+  }
+}
+
+export function termsView(c: TermsConsentSettings, s: TermsState) {
+  const req = c.items.filter(i => i.required).length;
+  const ok = c.items.filter((it, i) => it.required && s.checks[i]).length;
+  const all = ok === req;
+  return {
+    all,
+    locked: s.run === 'accepting' || s.run === 'accepted',
+    scene: (s.run !== 'idle' ? s.run : all && req > 0 ? 'allChecked' : ok > 0 ? 'partial' : 'default') as TermsScene,
+    chip: s.run === 'accepting' ? { tone: 'neutral' as StateChipTone, label: 'Accepting…' }
+      : { tone: (s.run === 'accepted' ? 'success' : 'neutral') as StateChipTone, label: s.run === 'accepted' ? 'Accepted' : `${ok} of ${req} required` },
+    footerHint: s.run === 'accepted' ? c.acceptedHint : all ? 'Ready to continue' : 'Accept the required items to continue',
+    primaryLabel: s.run === 'accepting' ? 'Accepting…' : s.run === 'accepted' ? 'Accepted' : s.run === 'failed' ? c.retryLabel : c.primaryLabel,
+    canAccept: all && s.run !== 'accepting' && s.run !== 'accepted',
+  };
+}

package/src/components/onboarding/terms-consent/index.ts

@@ -0,0 +1,6 @@
+export {
+  TERMS_IN_FLIGHT, TERMS_PRESETS, TERMS_SCENES, validateTermsConsent,
+  type ConsentItem, type TermsConsentSettings, type TermsScene,
+} from './contract';
+export { initialTerms, reduceTerms, termsSeed, termsView, type ConsentRun, type TermsAction, type TermsSeed, type TermsState } from './engine';
+export { TermsConsent, type ConsentRecord, type TermsConsentOperations, type TermsConsentProps } from './TermsConsentView';