@appinternalleads/ui 0.4.0 → 0.4.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appinternalleads/ui",
-  "version": "0.4.0",
+  "version": "0.4.2",
   "description": "React + React Native component library. Components are generated from JSON; see SPEC.md.",
   "workspaces": [
     "site"
@@ -15,6 +15,33 @@
     "lint": "eslint src tests tools",
     "generate": "vite-node -c vite.tools.config.ts tools/generate.ts",
     "rive:receipt-printer": "node tools/rive-receipt-printer.mjs",
+    "rive:animated-status": "node tools/rive-animated-status.mjs",
+    "rive:send-completion": "node tools/rive-send-completion.mjs",
+    "rive:replication-2": "node tools/rive-replication-2.mjs",
+    "replication2:studio": "cd remotion-prototype && mkdir -p public/replication-2 && cp ../node_modules/@rive-app/canvas/rive.wasm public/replication-2/ && npx remotion studio src/index.ts",
+    "replication2:render:landscape": "cd remotion-prototype && mkdir -p public/replication-2 && cp ../node_modules/@rive-app/canvas/rive.wasm public/replication-2/ && npx remotion render src/index.ts replication-2-landscape-4k out/replication-2-landscape-4k.mp4 --codec=h264 --pixel-format=yuv420p --color-space=bt709 --crf=12 --x264-preset=slow --props=content/replication-2/reference.json",
+    "replication2:render:portrait": "cd remotion-prototype && mkdir -p public/replication-2 && cp ../node_modules/@rive-app/canvas/rive.wasm public/replication-2/ && npx remotion render src/index.ts replication-2-portrait-4k out/replication-2-portrait-4k.mp4 --codec=h264 --pixel-format=yuv420p --color-space=bt709 --crf=12 --x264-preset=slow --props=content/replication-2/portrait.json",
+    "replication2:render:square": "cd remotion-prototype && mkdir -p public/replication-2 && cp ../node_modules/@rive-app/canvas/rive.wasm public/replication-2/ && npx remotion render src/index.ts replication-2-square-4k out/replication-2-square-4k.mp4 --codec=h264 --pixel-format=yuv420p --color-space=bt709 --crf=12 --x264-preset=slow --props=content/replication-2/square.json",
+    "replication2:configs": "vite-node -c vite.tools.config.ts replication-2-prototype/tools/export-configs.ts",
+    "promo:studio": "cd remotion-prototype && npx remotion studio src/index.ts",
+    "promo:configs": "cd remotion-prototype && npx tsx tools/export-promo-configs.ts",
+    "promo:render:landscape": "cd remotion-prototype && npx tsx tools/render-promo.ts PromoProductShowcaseLandscape content/promo-product-showcase/reference.json out/promo/promo-product-showcase-landscape-4k.mp4",
+    "promo:render:portrait": "cd remotion-prototype && npx tsx tools/render-promo.ts PromoProductShowcasePortrait content/promo-product-showcase/portrait.json out/promo/promo-product-showcase-portrait-4k.mp4",
+    "promo:render:square": "cd remotion-prototype && npx tsx tools/render-promo.ts PromoProductShowcaseSquare content/promo-product-showcase/square.json out/promo/promo-product-showcase-square-4k.mp4",
+    "promo:render:own-saas": "cd remotion-prototype && npx tsx tools/render-promo.ts PromoProductShowcaseLandscape content/promo-product-showcase/own-saas.json out/promo/promo-product-showcase-own-saas-4k.mp4",
+    "paperfold:studio": "cd remotion-prototype && npx remotion studio src/index.ts",
+    "paperfold:configs": "cd remotion-prototype && npx tsx tools/export-paper-fold-configs.ts && npx tsx tools/export-paper-fold-assets.ts",
+    "paperfold:stills": "cd remotion-prototype && npx tsx tools/paper-fold-stills.ts content/paper-fold-promo/reference.json out/paper-fold/stills",
+    "paperfold:render:portrait": "cd remotion-prototype && npx tsx tools/render-paper-fold.ts PaperFoldPromoPortrait content/paper-fold-promo/reference.json out/paper-fold/paper-fold-promo-portrait-4k.mp4",
+    "paperfold:render:landscape": "cd remotion-prototype && npx tsx tools/render-paper-fold.ts PaperFoldPromoLandscape content/paper-fold-promo/landscape.json out/paper-fold/paper-fold-promo-landscape-4k.mp4",
+    "paperfold:render:square": "cd remotion-prototype && npx tsx tools/render-paper-fold.ts PaperFoldPromoSquare content/paper-fold-promo/square.json out/paper-fold/paper-fold-promo-square-4k.mp4",
+    "paperfold:render:demo": "cd remotion-prototype && npx tsx tools/render-paper-fold.ts PaperFoldPromoPortrait content/paper-fold-promo/demo.json out/paper-fold/paper-fold-promo-demo-4k.mp4",
+    "paperfold:render:acme": "cd remotion-prototype && npx tsx tools/render-paper-fold.ts PaperFoldPromoLandscape content/paper-fold-promo/acme.json out/paper-fold/paper-fold-promo-acme-4k.mp4",
+    "cat:convert": "node tools/cat-rig/eps-to-svg.mjs",
+    "neon:reference": "node tools/neon-text/eps-reference.mjs",
+    "neon:audio": "vite-node -c vite.tools.config.ts tools/neon-text/make-audio.ts",
+    "cat:compare": "node tools/cat-rig/compare-to-jpg.mjs",
+    "cat:render": "cd remotion-prototype && npx remotion render CatTailWiggle out/cat/cat-tail-wiggle.mp4 --codec=h264 --pixel-format=yuv420p",
     "publish:npm": "node tools/publish-npm.mjs",
     "storybook": "storybook dev -p 6006 --no-open",
     "build-storybook": "storybook build",
@@ -29,7 +56,7 @@
     "say": "vite-node -c vite.tools.config.ts tools/say-block.ts --",
     "say:detect": "node tools/speak.mjs --detect",
     "ask": "node tools/ask/cli.mjs",
-    "ask:build": "vite build --config tools/ask/vite.config.ts && esbuild tools/speech/speakable.ts --bundle --format=esm --platform=node --outfile=tools/ask/dist/speakable.mjs --log-level=error && esbuild tools/ask/elicit.ts --bundle --format=esm --platform=node --outfile=tools/ask/dist/elicit.mjs --log-level=error && esbuild tools/ask/components.ts --bundle --format=esm --platform=node --outfile=tools/ask/dist/components.mjs --log-level=error && node tools/ask/build-support.mjs",
+    "ask:build": "vite build --config tools/ask/vite.config.ts && esbuild tools/speech/speakable.ts --bundle --format=esm --platform=node --outfile=tools/ask/dist/speakable.mjs --log-level=error && esbuild tools/ask/elicit.ts --bundle --format=esm --platform=node --outfile=tools/ask/dist/elicit.mjs --log-level=error && esbuild tools/ask/components.ts --bundle --format=esm --platform=node --outfile=tools/ask/dist/components.mjs --log-level=error && esbuild tools/ask/neon-page.tsx --bundle --format=esm --platform=browser --jsx=automatic --minify --define:process.env.NODE_ENV=\\\"production\\\" --outfile=tools/ask/dist/neon.js --log-level=error && node tools/ask/build-support.mjs",
     "ask:check": "node tools/ask/check.mjs",
     "ask:tui": "vite-node -c vite.tools.config.ts tools/ask/tui/index.tsx --",
     "ask:mcp": "node tools/ask/mcp.mjs",
@@ -109,6 +136,12 @@
       "import": "./dist/esm/agent/core.js",
       "require": "./dist/cjs/agent/core.js"
     },
+    "./motion": {
+      "types": "./dist/esm/motion/index.d.ts",
+      "node": "./dist/cjs/motion/index.js",
+      "import": "./dist/esm/motion/index.js",
+      "require": "./dist/cjs/motion/index.js"
+    },
     "./native": {
       "types": "./dist/esm/native/index.d.ts",
       "import": "./dist/esm/native/index.js",
@@ -138,6 +171,7 @@
     "dist",
     "src",
     "spec",
+    "docs/TYPE-SURFACE.md",
     "!src/**/*.test.*",
     "!src/**/*.stories.*",
     "!src/agent/search/wordvectors.json",
@@ -145,6 +179,7 @@
     "tools/ask/serve.mjs",
     "tools/ask/stale.mjs",
     "tools/ask/policy.mjs",
+    "tools/ask/neon-render.mjs",
     "tools/ask/dist",
     "tools/speak.mjs"
   ],
@@ -162,6 +197,7 @@
     "comppack-ask": "tools/ask/mcp.mjs"
   },
   "dependencies": {
+    "@rive-app/canvas": "2.43.1",
     "@rive-app/react-canvas": "^4.35.0"
   }
 }

package/spec/examples/components/onboarding/animated-status/case1.json

@@ -0,0 +1,42 @@
+{
+  "schema": "onboarding/1",
+  "component": "animated-status",
+  "key": "animated_status_case1",
+  "preset": "case1",
+  "meta": {
+    "eyebrow": "Case study 1 · Brand",
+    "title": "Brand promo",
+    "scenario": "The reference animation, word for word: Hey, the stacked Scroller, “Scrolling Won't Get Your BRAND Noticed”, BUT WE WILL, and the end card."
+  },
+  "config": {
+    "loadingLabel": "Loading {title}",
+    "attentionLabel": "Needs attention",
+    "loadErrorTitle": "Couldn’t load the animation",
+    "loadErrorBody": "Nothing was lost. Retry to load it again.",
+    "retryLabel": "Retry",
+    "emptyTitle": "Nothing to animate yet",
+    "emptyBody": "The words for this animation haven’t arrived.",
+    "emptyCta": "Refresh",
+    "type": "agent",
+    "icon": "sparkle",
+    "title": "Brand promo",
+    "subtitle": "Animated status · plays once",
+    "scene1Text": "Hey",
+    "scene2Text": "Scroller",
+    "scene3Text": "Scrolling Won't Get Your BRAND Noticed",
+    "scene4Text": "BUT WE WILL",
+    "scene5Text": "contact us today",
+    "scene6Text": "comppack.vercel.app",
+    "textColor": "#0A0A0A",
+    "accentColor": "#8C2C3A",
+    "emblemIcon": "sparkles",
+    "autoplay": false,
+    "playLabel": "Play",
+    "replayLabel": "Replay",
+    "resetLabel": "Reset",
+    "idleLabel": "Ready",
+    "playingLabel": "Playing",
+    "doneLabel": "Played",
+    "hintText": "Plays once · {seconds} s"
+  }
+}

package/spec/examples/components/onboarding/animated-status/case2.json

@@ -0,0 +1,42 @@
+{
+  "schema": "onboarding/1",
+  "component": "animated-status",
+  "key": "animated_status_case2",
+  "preset": "case2",
+  "meta": {
+    "eyebrow": "Case study 2 · Search",
+    "title": "Restaurant search",
+    "scenario": "An agent is finding a table nearby. Same motion, new words, a coral end card with the location icon. “Finding restaurants” is shown progress — not a result."
+  },
+  "config": {
+    "loadingLabel": "Loading {title}",
+    "attentionLabel": "Needs attention",
+    "loadErrorTitle": "Couldn’t load the animation",
+    "loadErrorBody": "Nothing was lost. Retry to load it again.",
+    "retryLabel": "Retry",
+    "emptyTitle": "Nothing to animate yet",
+    "emptyBody": "The words for this animation haven’t arrived.",
+    "emptyCta": "Refresh",
+    "type": "data",
+    "icon": "search",
+    "title": "Restaurant search",
+    "subtitle": "While the agent looks for a table",
+    "scene1Text": "Search",
+    "scene2Text": "Nearby",
+    "scene3Text": "Hungry? Let Us Find TABLES Nearby",
+    "scene4Text": "WE FIND IT",
+    "scene5Text": "Finding restaurants",
+    "scene6Text": "tablefinder.app",
+    "textColor": "#1A1A1A",
+    "accentColor": "coral",
+    "emblemIcon": "location",
+    "autoplay": false,
+    "playLabel": "Play",
+    "replayLabel": "Replay",
+    "resetLabel": "Reset",
+    "idleLabel": "Ready",
+    "playingLabel": "Playing",
+    "doneLabel": "Played",
+    "hintText": "Plays once · {seconds} s"
+  }
+}

package/spec/examples/components/onboarding/animated-status/case3.json

@@ -0,0 +1,42 @@
+{
+  "schema": "onboarding/1",
+  "component": "animated-status",
+  "key": "animated_status_case3",
+  "preset": "case3",
+  "meta": {
+    "eyebrow": "Case study 3 · Documents",
+    "title": "Contract review",
+    "scenario": "A document is being read. Sky-blue words from a hue token, the document icon."
+  },
+  "config": {
+    "loadingLabel": "Loading {title}",
+    "attentionLabel": "Needs attention",
+    "loadErrorTitle": "Couldn’t load the animation",
+    "loadErrorBody": "Nothing was lost. Retry to load it again.",
+    "retryLabel": "Retry",
+    "emptyTitle": "Nothing to animate yet",
+    "emptyBody": "The words for this animation haven’t arrived.",
+    "emptyCta": "Refresh",
+    "type": "file",
+    "icon": "doc",
+    "title": "Contract review",
+    "subtitle": "While a document is read",
+    "scene1Text": "Opening",
+    "scene2Text": "Contract",
+    "scene3Text": "Reading Every Clause For YOU Now",
+    "scene4Text": "NEARLY THERE NOW",
+    "scene5Text": "Preparing results",
+    "scene6Text": "docs.acme.co",
+    "textColor": "skyDeep",
+    "accentColor": "sky",
+    "emblemIcon": "document",
+    "autoplay": false,
+    "playLabel": "Play",
+    "replayLabel": "Replay",
+    "resetLabel": "Reset",
+    "idleLabel": "Ready",
+    "playingLabel": "Playing",
+    "doneLabel": "Played",
+    "hintText": "Plays once · {seconds} s"
+  }
+}

package/spec/examples/components/onboarding/animated-status/case4.json

@@ -0,0 +1,42 @@
+{
+  "schema": "onboarding/1",
+  "component": "animated-status",
+  "key": "animated_status_case4",
+  "preset": "case4",
+  "meta": {
+    "eyebrow": "Case study 4 · Scheduling",
+    "title": "Meeting finder",
+    "scenario": "Calendars are being compared, with the calendar icon on a butter end card."
+  },
+  "config": {
+    "loadingLabel": "Loading {title}",
+    "attentionLabel": "Needs attention",
+    "loadErrorTitle": "Couldn’t load the animation",
+    "loadErrorBody": "Nothing was lost. Retry to load it again.",
+    "retryLabel": "Retry",
+    "emptyTitle": "Nothing to animate yet",
+    "emptyBody": "The words for this animation haven’t arrived.",
+    "emptyCta": "Refresh",
+    "type": "schedule",
+    "icon": "calendar",
+    "title": "Meeting finder",
+    "subtitle": "While calendars are compared",
+    "scene1Text": "Checking",
+    "scene2Text": "Calendars",
+    "scene3Text": "Finding A Time That WORKS Everyone",
+    "scene4Text": "ONE SLOT LEFT",
+    "scene5Text": "Checking availability",
+    "scene6Text": "meet.acme.co",
+    "textColor": "#2A2724",
+    "accentColor": "butterDeep",
+    "emblemIcon": "calendar",
+    "autoplay": false,
+    "playLabel": "Play",
+    "replayLabel": "Replay",
+    "resetLabel": "Reset",
+    "idleLabel": "Ready",
+    "playingLabel": "Playing",
+    "doneLabel": "Played",
+    "hintText": "Plays once · {seconds} s"
+  }
+}

package/spec/examples/components/onboarding/animated-status/case5.json

@@ -0,0 +1,42 @@
+{
+  "schema": "onboarding/1",
+  "component": "animated-status",
+  "key": "animated_status_case5",
+  "preset": "case5",
+  "meta": {
+    "eyebrow": "Case study 5 · Assistant",
+    "title": "Assistant reply",
+    "scenario": "An assistant is writing a reply: dark ink, a lilac end card and the sparkles icon."
+  },
+  "config": {
+    "loadingLabel": "Loading {title}",
+    "attentionLabel": "Needs attention",
+    "loadErrorTitle": "Couldn’t load the animation",
+    "loadErrorBody": "Nothing was lost. Retry to load it again.",
+    "retryLabel": "Retry",
+    "emptyTitle": "Nothing to animate yet",
+    "emptyBody": "The words for this animation haven’t arrived.",
+    "emptyCta": "Refresh",
+    "type": "agent",
+    "icon": "spark",
+    "title": "Assistant reply",
+    "subtitle": "While a response is written",
+    "scene1Text": "Thinking",
+    "scene2Text": "Drafting",
+    "scene3Text": "Writing Your Reply With CARE Today",
+    "scene4Text": "ALMOST READY NOW",
+    "scene5Text": "Generating response",
+    "scene6Text": "assistant.acme.ai",
+    "textColor": "#1F1B2E",
+    "accentColor": "lilacDeep",
+    "emblemIcon": "sparkles",
+    "autoplay": false,
+    "playLabel": "Play",
+    "replayLabel": "Replay",
+    "resetLabel": "Reset",
+    "idleLabel": "Ready",
+    "playingLabel": "Playing",
+    "doneLabel": "Played",
+    "hintText": "Plays once · {seconds} s"
+  }
+}

package/spec/examples/components/onboarding/send-completion/case1.json

@@ -0,0 +1,48 @@
+{
+  "schema": "onboarding/1",
+  "component": "send-completion",
+  "key": "send_completion_case1",
+  "preset": "case1",
+  "meta": {
+    "eyebrow": "Case study 1 · Messaging",
+    "title": "Send → Sent!",
+    "scenario": "The reference’s motion as it ships: the tap cue, the press, the paper plane’s loop, the button balling up into a check and the “Sent!” pill — on no ground of its own, so it sits on any surface. The check waits for the host’s send."
+  },
+  "config": {
+    "loadingLabel": "Loading {title}",
+    "attentionLabel": "Needs attention",
+    "loadErrorTitle": "Couldn’t load the button",
+    "loadErrorBody": "Nothing was lost. Retry to load it again.",
+    "retryLabel": "Retry",
+    "emptyTitle": "Nothing to send yet",
+    "emptyBody": "There’s nothing ready to send.",
+    "emptyCta": "Refresh",
+    "type": "action",
+    "icon": "rocket",
+    "title": "Send a message",
+    "subtitle": "Press the button: it launches, then confirms",
+    "label": "Send",
+    "completedLabel": "Sent!",
+    "tapHint": "TAP/CLICK",
+    "backgroundColor": "transparent",
+    "buttonColor": "#281483",
+    "textColor": "#FFFFFF",
+    "iconColor": "#AEB6FF",
+    "completionColor": "#FFFFFF",
+    "trailColor": "#5461DC",
+    "sendIcon": "plane",
+    "iconScale": 1,
+    "cornerRadius": 6,
+    "width": 480,
+    "showTapCue": true,
+    "autoplay": false,
+    "loop": false,
+    "resetLabel": "Reset",
+    "idleChip": "Ready",
+    "sendingChip": "Sending",
+    "sentChip": "Sent",
+    "failTitle": "Couldn’t send",
+    "failBody": "Nothing was sent. Press the button to try again.",
+    "doneAnnouncement": "{completedLabel}"
+  }
+}

package/spec/examples/components/onboarding/send-completion/case2.json

@@ -0,0 +1,48 @@
+{
+  "schema": "onboarding/1",
+  "component": "send-completion",
+  "key": "send_completion_case2",
+  "preset": "case2",
+  "meta": {
+    "eyebrow": "Case study 2 · Forms",
+    "title": "Submit → Submitted!",
+    "scenario": "A form’s submit button: new words and the arrow icon, no tap cue. Nothing about the motion changes — “Submitted!” shrinks to fit the pill."
+  },
+  "config": {
+    "loadingLabel": "Loading {title}",
+    "attentionLabel": "Needs attention",
+    "loadErrorTitle": "Couldn’t load the button",
+    "loadErrorBody": "Nothing was lost. Retry to load it again.",
+    "retryLabel": "Retry",
+    "emptyTitle": "Nothing to send yet",
+    "emptyBody": "There’s nothing ready to send.",
+    "emptyCta": "Refresh",
+    "type": "file",
+    "icon": "doc",
+    "title": "Submit the form",
+    "subtitle": "The same motion, different words",
+    "label": "Submit",
+    "completedLabel": "Submitted!",
+    "tapHint": "TAP/CLICK",
+    "backgroundColor": "transparent",
+    "buttonColor": "#281483",
+    "textColor": "#FFFFFF",
+    "iconColor": "#AEB6FF",
+    "completionColor": "#FFFFFF",
+    "trailColor": "#5461DC",
+    "sendIcon": "arrow",
+    "iconScale": 1,
+    "cornerRadius": 6,
+    "width": 480,
+    "showTapCue": false,
+    "autoplay": false,
+    "loop": false,
+    "resetLabel": "Reset",
+    "idleChip": "Ready",
+    "sendingChip": "Sending",
+    "sentChip": "Sent",
+    "failTitle": "Couldn’t send",
+    "failBody": "Nothing was sent. Press the button to try again.",
+    "doneAnnouncement": "{completedLabel}"
+  }
+}

package/spec/examples/components/onboarding/send-completion/case3.json

@@ -0,0 +1,48 @@
+{
+  "schema": "onboarding/1",
+  "component": "send-completion",
+  "key": "send_completion_case3",
+  "preset": "case3",
+  "meta": {
+    "eyebrow": "Case study 3 · Files",
+    "title": "Upload → Uploaded",
+    "scenario": "An upload in sky blue: colours from Solarium hue tokens and a rounder button."
+  },
+  "config": {
+    "loadingLabel": "Loading {title}",
+    "attentionLabel": "Needs attention",
+    "loadErrorTitle": "Couldn’t load the button",
+    "loadErrorBody": "Nothing was lost. Retry to load it again.",
+    "retryLabel": "Retry",
+    "emptyTitle": "Nothing to send yet",
+    "emptyBody": "There’s nothing ready to send.",
+    "emptyCta": "Refresh",
+    "type": "file",
+    "icon": "upload",
+    "title": "Upload a file",
+    "subtitle": "Colours from Solarium hue tokens",
+    "label": "Upload",
+    "completedLabel": "Uploaded",
+    "tapHint": "TAP/CLICK",
+    "backgroundColor": "transparent",
+    "buttonColor": "skyDeep",
+    "textColor": "#FFFFFF",
+    "iconColor": "#CFE3F3",
+    "completionColor": "#FFFFFF",
+    "trailColor": "sky",
+    "sendIcon": "arrow",
+    "iconScale": 1,
+    "cornerRadius": 20,
+    "width": 480,
+    "showTapCue": false,
+    "autoplay": false,
+    "loop": false,
+    "resetLabel": "Reset",
+    "idleChip": "Ready",
+    "sendingChip": "Sending",
+    "sentChip": "Sent",
+    "failTitle": "Couldn’t send",
+    "failBody": "Nothing was sent. Press the button to try again.",
+    "doneAnnouncement": "{completedLabel}"
+  }
+}

package/spec/examples/components/onboarding/send-completion/case4.json

@@ -0,0 +1,48 @@
+{
+  "schema": "onboarding/1",
+  "component": "send-completion",
+  "key": "send_completion_case4",
+  "preset": "case4",
+  "meta": {
+    "eyebrow": "Case study 4 · Commerce",
+    "title": "Confirm → Confirmed",
+    "scenario": "A checkout confirm: a dark pill-shaped button, a larger chevron, a green check, a smaller stage."
+  },
+  "config": {
+    "loadingLabel": "Loading {title}",
+    "attentionLabel": "Needs attention",
+    "loadErrorTitle": "Couldn’t load the button",
+    "loadErrorBody": "Nothing was lost. Retry to load it again.",
+    "retryLabel": "Retry",
+    "emptyTitle": "Nothing to send yet",
+    "emptyBody": "There’s nothing ready to send.",
+    "emptyCta": "Refresh",
+    "type": "action",
+    "icon": "bolt",
+    "title": "Confirm the order",
+    "subtitle": "A dark, rounder button and a larger icon",
+    "label": "Confirm",
+    "completedLabel": "Confirmed",
+    "tapHint": "TAP/CLICK",
+    "backgroundColor": "transparent",
+    "buttonColor": "#0F172A",
+    "textColor": "#FFF7ED",
+    "iconColor": "#FDBA74",
+    "completionColor": "#86EFAC",
+    "trailColor": "#EA580C",
+    "sendIcon": "chevron",
+    "iconScale": 1.25,
+    "cornerRadius": 40,
+    "width": 360,
+    "showTapCue": false,
+    "autoplay": false,
+    "loop": false,
+    "resetLabel": "Reset",
+    "idleChip": "Ready",
+    "sendingChip": "Sending",
+    "sentChip": "Sent",
+    "failTitle": "Couldn’t send",
+    "failBody": "Nothing was sent. Press the button to try again.",
+    "doneAnnouncement": "{completedLabel}"
+  }
+}

package/spec/examples/components/onboarding/send-completion/case5.json

@@ -0,0 +1,48 @@
+{
+  "schema": "onboarding/1",
+  "component": "send-completion",
+  "key": "send_completion_case5",
+  "preset": "case5",
+  "meta": {
+    "eyebrow": "Case study 5 · Decoration",
+    "title": "Save, on repeat",
+    "scenario": "A looping illustration of saving: it presses itself, holds “Saved!” and resets, forever. Decorative — no send is made."
+  },
+  "config": {
+    "loadingLabel": "Loading {title}",
+    "attentionLabel": "Needs attention",
+    "loadErrorTitle": "Couldn’t load the button",
+    "loadErrorBody": "Nothing was lost. Retry to load it again.",
+    "retryLabel": "Retry",
+    "emptyTitle": "Nothing to send yet",
+    "emptyBody": "There’s nothing ready to send.",
+    "emptyCta": "Refresh",
+    "type": "agent",
+    "icon": "sparkle",
+    "title": "Save — on repeat",
+    "subtitle": "Loops on its own, as a decoration",
+    "label": "Save",
+    "completedLabel": "Saved!",
+    "tapHint": "TAP/CLICK",
+    "backgroundColor": "transparent",
+    "buttonColor": "lilacDeep",
+    "textColor": "#FFFFFF",
+    "iconColor": "#EEEBF7",
+    "completionColor": "#FFFFFF",
+    "trailColor": "lilacDeep",
+    "sendIcon": "plane",
+    "iconScale": 1,
+    "cornerRadius": 6,
+    "width": 320,
+    "showTapCue": true,
+    "autoplay": false,
+    "loop": true,
+    "resetLabel": "Reset",
+    "idleChip": "Ready",
+    "sendingChip": "Sending",
+    "sentChip": "Sent",
+    "failTitle": "Couldn’t send",
+    "failBody": "Nothing was sent. Press the button to try again.",
+    "doneAnnouncement": "{completedLabel}"
+  }
+}