rift-ds 1.8.0 → 1.10.0

package/chat/TurnQuestion.d.ts

@@ -0,0 +1,19 @@
+import { ChatReply, ChatTurn } from './types';
+/**
+ * The questions an assistant turn asks, drawn under its prose. Live only
+ * while the turn is the newest and nothing is streaming: once the
+ * conversation moves on without an answer the card stays as it was offered,
+ * inert, so the transcript still shows what was asked.
+ */
+export declare function TurnQuestion({ turn }: {
+    turn: ChatTurn;
+}): import("react").JSX.Element | null;
+/**
+ * A user turn that answered a set of questions: each question over its
+ * answers. One question, with one pick or several, stays the ordinary
+ * bubble, its picks joined with commas.
+ */
+export declare function ReplyBody({ reply, text }: {
+    reply?: ChatReply;
+    text: string;
+}): import("react").JSX.Element;

package/chat/TurnQuestion.js

@@ -0,0 +1,38 @@
+"use client";
+import { jsx, Fragment } from "react/jsx-runtime";
+import { useRef, useEffect } from "react";
+import { QuestionSummary, QuestionCard } from "../components/QuestionCard/QuestionCard.js";
+import { useChatWidget } from "./context.js";
+import { isBlockingQuestion } from "./questions.js";
+function TurnQuestion({ turn }) {
+  const { turns, live, answerQuestion, skipQuestion } = useChatWidget();
+  const set = turn.question;
+  const newest = turns[turns.length - 1]?.id === turn.id;
+  const blocking = newest && isBlockingQuestion(turn, live !== null);
+  const ref = useRef(null);
+  useEffect(() => {
+    if (!blocking) return;
+    ref.current?.querySelector("button:not(:disabled)")?.focus({ preventScroll: true });
+  }, []);
+  if (!set) return null;
+  return /* @__PURE__ */ jsx(
+    QuestionCard,
+    {
+      ref,
+      className: "ds-chat-widget__question",
+      questions: set.questions,
+      values: turn.answers,
+      disabled: turn.answers === void 0 && (!newest || live !== null),
+      onValuesChange: (answers) => answerQuestion(turn.id, answers),
+      onSkip: blocking ? () => skipQuestion(turn.id) : void 0
+    }
+  );
+}
+function ReplyBody({ reply, text }) {
+  if (!reply || reply.items.length === 1) return /* @__PURE__ */ jsx(Fragment, { children: text });
+  return /* @__PURE__ */ jsx(QuestionSummary, { variant: "plain", items: reply.items });
+}
+export {
+  ReplyBody,
+  TurnQuestion
+};

package/chat/artifacts.d.ts

@@ -0,0 +1,5 @@
+import { ChatArtifact, ChatCard } from './types';
+/** The artifact a card carries, or null when it is some other kind of card. */
+export declare const cardArtifact: (card: ChatCard | undefined) => ChatArtifact | null;
+/** Wraps an artifact as the card a transport sends. */
+export declare const artifactCard: (artifact: ChatArtifact) => ChatCard;

package/chat/artifacts.js

@@ -0,0 +1,14 @@
+import { ARTIFACT_CARD_KIND } from "./types.js";
+const isArtifact = (data) => {
+  const candidate = data;
+  return typeof candidate === "object" && candidate !== null && typeof candidate.id === "string" && typeof candidate.title === "string" && typeof candidate.kind === "string";
+};
+const cardArtifact = (card) => card?.kind === ARTIFACT_CARD_KIND && isArtifact(card.data) ? card.data : null;
+const artifactCard = (artifact) => ({
+  kind: ARTIFACT_CARD_KIND,
+  data: artifact
+});
+export {
+  artifactCard,
+  cardArtifact
+};

package/chat/context.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
 import { ChatPlacement, ChatSide } from './placement';
 import { ThreadsState } from './threads';
-import { ChatFeedbackVerdict } from './types';
+import { ChatArtifact, ChatFeedbackVerdict } from './types';
 import { ChatState } from './useChat';
 /** Panel is the docked rail; full is the viewport takeover. */
 export type ChatView = 'panel' | 'full';
@@ -10,6 +10,17 @@ export type ChatView = 'panel' | 'full';
  * a kind with no renderer draws nothing.
  */
 export type ChatCardRenderers = Record<string, (data: unknown) => ReactNode>;
+/**
+ * Draws an artifact's preview as a React node, keyed by the artifact's
+ * `kind`. A kind with no renderer falls back to the built-in frames.
+ */
+export type ChatArtifactRenderers = Record<string, (artifact: ChatArtifact) => ReactNode>;
+/**
+ * Whether the widget rendering this subtree seats the artifact panel (its
+ * `artifacts` prop). With no seat an artifact has nowhere to open, so the
+ * thread draws no tile for it: the feature is whole or it is absent.
+ */
+export declare const ArtifactSeatContext: import('react').Context<boolean>;
 /** How the widget renders a link the model wrote. */
 export type ChatLinkRenderer = (props: {
     href: string;
@@ -52,6 +63,12 @@ export interface ChatWidgetContextValue extends ChatState {
     /** The thread lifecycle behind the built-in threads and tabs. */
     threads: ThreadsState;
     renderers: ChatCardRenderers;
+    /** The artifact on stage in the artifact panel, or null while it is closed. */
+    artifact: ChatArtifact | null;
+    /** Puts an artifact on stage. The widget seats the panel; this only says which. */
+    openArtifact: (artifact: ChatArtifact) => void;
+    closeArtifact: () => void;
+    artifactRenderers: ChatArtifactRenderers;
     renderLink: ChatLinkRenderer;
     isInternalHref: (href: string) => boolean;
     /** Record and send a thumbs verdict; null when feedback is off. */

package/chat/context.js

@@ -1,5 +1,6 @@
 "use client";
 import { useContext, createContext } from "react";
+const ArtifactSeatContext = createContext(false);
 const ChatWidgetContext = createContext(null);
 function useChatWidget() {
   const context = useContext(ChatWidgetContext);
@@ -20,6 +21,7 @@ function createFeedbackPoster(endpoint = "/api/chat/feedback") {
   };
 }
 export {
+  ArtifactSeatContext,
   ChatWidgetContext,
   createFeedbackPoster,
   isInternalPath,

package/chat/demo-artifacts.d.ts

@@ -0,0 +1,6 @@
+import { ChatArtifactRenderers } from './context';
+import { ChatArtifact } from './types';
+/** Draws the demo's live artifact kinds. Pass to `ChatProvider`'s `artifactRenderers`. */
+export declare const DEMO_ARTIFACT_RENDERERS: ChatArtifactRenderers;
+export declare const DEMO_DASHBOARD_ARTIFACT: ChatArtifact;
+export declare const DEMO_PAGE_ARTIFACT: ChatArtifact;

package/chat/demo-artifacts.js

@@ -0,0 +1,80 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { DemoDashboardArtifact } from "./demo-card-components.js";
+const DEMO_ARTIFACT_RENDERERS = {
+  "demo-dashboard": () => /* @__PURE__ */ jsx(DemoDashboardArtifact, {})
+};
+const DEMO_DASHBOARD_ARTIFACT = {
+  id: "launch-dashboard",
+  title: "Launch dashboard",
+  kind: "demo-dashboard",
+  meta: "Dashboard",
+  icon: "space_dashboard"
+};
+const LAUNCH_PAGE_HTML = `<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<meta name="color-scheme" content="light dark">
+<title>Acme Workspaces</title>
+<style>
+  * { box-sizing: border-box; }
+  body { margin: 0; font-family: ui-sans-serif, system-ui, sans-serif; color: #14181f; background: #f6f4ef; line-height: 1.5; }
+  header { display: flex; align-items: center; justify-content: space-between; padding: 20px 32px; }
+  .brand { font-weight: 700; letter-spacing: -0.01em; }
+  nav { display: flex; gap: 20px; font-size: 14px; color: #55606e; }
+  .hero { padding: 56px 32px 40px; max-width: 720px; }
+  .eyebrow { font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: #7a5cff; }
+  h1 { margin: 12px 0 16px; font-size: clamp(32px, 6vw, 52px); line-height: 1.05; letter-spacing: -0.03em; }
+  .lede { margin: 0 0 28px; font-size: 18px; color: #414b58; max-width: 52ch; }
+  .cta { display: inline-block; padding: 12px 22px; border-radius: 999px; background: #14181f; color: #fff; font-weight: 600; font-size: 15px; }
+  .ghost { margin-left: 16px; font-size: 15px; font-weight: 600; color: #14181f; }
+  .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 16px; padding: 8px 32px 48px; }
+  .card { padding: 20px; border-radius: 16px; background: #fff; border: 1px solid #e7e3da; }
+  .card h2 { margin: 0 0 6px; font-size: 16px; }
+  .card p { margin: 0; font-size: 14px; color: #55606e; }
+  footer { padding: 20px 32px 32px; font-size: 13px; color: #7b8592; }
+  @media (prefers-color-scheme: dark) {
+    body { color: #eef0f3; background: #101216; }
+    nav, .card p, footer { color: #98a1ad; }
+    .eyebrow { color: #a999ff; }
+    .lede { color: #c2c8d0; }
+    .cta { background: #eef0f3; color: #101216; }
+    .ghost { color: #eef0f3; }
+    .card { background: #181b21; border-color: #2a2e36; }
+  }
+</style>
+</head>
+<body>
+<header>
+  <span class="brand">Acme</span>
+  <nav><span>Product</span><span>Plans</span><span>Sign in</span></nav>
+</header>
+<section class="hero">
+  <span class="eyebrow">Launching this week</span>
+  <h1>One workspace for the whole team.</h1>
+  <p class="lede">Shared projects, guest seats and ninety days of version history, ready the moment your team joins.</p>
+  <span class="cta">Start the free trial</span><span class="ghost">See the plans</span>
+</section>
+<section class="grid">
+  <div class="card"><h2>Shared workspaces</h2><p>Every project in one place, open to the people who need it.</p></div>
+  <div class="card"><h2>Guest seats</h2><p>Bring in a client or a contractor without buying a full seat.</p></div>
+  <div class="card"><h2>Version history</h2><p>Ninety days of every change, one click from restored.</p></div>
+</section>
+<footer>Acme is a made-up company. This page is a demo artifact.</footer>
+</body>
+</html>`;
+const DEMO_PAGE_ARTIFACT = {
+  id: "launch-page",
+  title: "Launch page",
+  kind: "html",
+  meta: "Web page",
+  icon: "web",
+  html: LAUNCH_PAGE_HTML
+};
+export {
+  DEMO_ARTIFACT_RENDERERS,
+  DEMO_DASHBOARD_ARTIFACT,
+  DEMO_PAGE_ARTIFACT
+};

package/chat/demo-card-components.d.ts

@@ -44,3 +44,5 @@ export declare function DemoStack({ card, renderers }: {
     card: DemoStackCard;
     renderers: ChatCardRenderers;
 }): import("react").JSX.Element;
+/** The dashboard's rows ask the chat, like the welcome board's. */
+export declare function DemoDashboardArtifact(): import("react").JSX.Element;

package/chat/demo-card-components.js

@@ -8,6 +8,8 @@ import { CodeBlock } from "../components/CodeBlock/CodeBlock.js";
 import { InterruptCard } from "../components/InterruptCard/InterruptCard.js";
 import { MessageCard } from "../components/MessageCard/MessageCard.js";
 import { ToolCall } from "../components/ToolCall/ToolCall.js";
+import { useChatWidget } from "./context.js";
+import { DemoBoard } from "./DemoWelcome.js";
 const RETRY_RUN_MS = 1400;
 function DemoToolCall({ card }) {
   const [status, setStatus] = useState(card.status);
@@ -51,8 +53,13 @@ function DemoStack({ card, renderers }) {
     return render ? /* @__PURE__ */ jsx("div", { children: render(item.data) }, index) : null;
   }) });
 }
+function DemoDashboardArtifact() {
+  const { send } = useChatWidget();
+  return /* @__PURE__ */ jsx("div", { className: "ds-chat-demo__artifact-board", children: /* @__PURE__ */ jsx(DemoBoard, { onAsk: (prompt) => send(prompt) }) });
+}
 export {
   DemoChart,
+  DemoDashboardArtifact,
   DemoInterrupt,
   DemoStack,
   DemoToolCall

package/chat/demo-script.js

@@ -1,3 +1,5 @@
+import { artifactCard } from "./artifacts.js";
+import { DEMO_DASHBOARD_ARTIFACT, DEMO_PAGE_ARTIFACT } from "./demo-artifacts.js";
 import { scriptChat } from "./sim.js";
 const TRIAL_SIGNUPS = [
   { week: "W1", signups: 320 },
@@ -18,7 +20,44 @@ const PLAN_STEPS = [
   { label: "Invite the three teammates", status: "active" },
   { label: "Post the welcome note", status: "pending" }
 ];
+const KICKOFF_STEPS = [
+  { label: "Hold the slot on every calendar", status: "completed" },
+  { label: "Draft the agenda from the launch plan", status: "active" },
+  { label: "Send the invites", status: "pending" }
+];
 const card = (kind, data) => ({ kind, data });
+function planFor(answer) {
+  const size = answer.toLowerCase();
+  const plan = size.includes("just me") ? "the Starter plan covers you: unlimited projects, no seats to manage" : size.includes("more than 50") ? "the Business plan fits: single sign-on, audit logs and pooled seats" : "the Team plan fits: shared workspaces for everyone, and guest seats stay free";
+  return {
+    steps: [{ status: "Matching the plan", point: "Team size decides the plan; nothing else differs." }],
+    text: `For ${answer.trim().replace(/[.!?]$/, "")}, ${plan}.`,
+    followups: ["What do the plans include?", "Invite my team to a workspace", "Set up notifications for me"]
+  };
+}
+const INVITES_SENT = {
+  steps: [
+    { status: "Sending the invites", point: "Three teammates to invite, all editors." },
+    { status: "Confirming delivery", point: "One call covers the batch." }
+  ],
+  text: "All three invites are out. Everyone lands in the workspace with editor access.",
+  card: card("tool-call", {
+    name: "invite_teammates",
+    summary: "3 editors to acme-design",
+    status: "success",
+    duration: "0.6s",
+    args: '{\n  "workspace": "acme-design",\n  "role": "editor",\n  "emails": 3\n}'
+  }),
+  followups: ["Set up notifications for me", "Take us up to twelve seats", "Plan our launch kickoff"]
+};
+const PLANS_COMPARED = {
+  steps: [
+    { status: "Comparing the plans", point: "Three plans differ on collaboration, not on limits." },
+    { status: "Drafting the answer", point: "Name what the Team plan adds over the base." }
+  ],
+  text: "Every plan includes unlimited projects. The Team plan adds shared workspaces, guest seats, and a 90 day version history.",
+  followups: ["Which plan fits a team of five?", "Help me pick a plan", "Where is that written down?"]
+};
 const DEMO_STARTERS = [
   { id: "start", label: "How do I get started?" },
   { id: "plans", label: "What do the plans include?" },
@@ -40,16 +79,7 @@ const DEMO_SCRIPT = scriptChat().user("How do I get started?").assistant(
   ],
   card: card("plan", { steps: PLAN_STEPS }),
   followups: ["Find a time we can all meet", "Take us up to twelve seats", "How is the trial going?"]
-}).user("What do the plans include?").assistant(
-  "Every plan includes unlimited projects. The Team plan adds shared workspaces, guest seats, and a 90 day version history.",
-  {
-    steps: [
-      { status: "Comparing the plans", point: "Three plans differ on collaboration, not on limits." },
-      { status: "Drafting the answer", point: "Name what the Team plan adds over the base." }
-    ],
-    followups: ["Which plan fits a team of five?", "Where is that written down?", "How is the trial going?"]
-  }
-).user("Which plan fits a team of five?").assistant("The Team plan fits what you described: shared workspaces for the whole team, and guest seats stay free.", {
+}).user("What do the plans include?").assistant(PLANS_COMPARED.text, PLANS_COMPARED).user("Which plan fits a team of five?").assistant("The Team plan fits what you described: shared workspaces for the whole team, and guest seats stay free. Shall we go with it?", {
   steps: [
     { status: "Matching plans to the team", point: "The visitor needs shared workspaces and guest seats." },
     { status: "Drafting the answer", point: "The Team plan covers both; lead with the card." }
@@ -57,13 +87,26 @@ const DEMO_SCRIPT = scriptChat().user("How do I get started?").assistant(
   card: card("product-card", {
     title: "Team plan",
     description: "Shared workspaces, guest seats, and version history for the whole team.",
-    meta: "Billed monthly, cancel any time",
-    actions: [
-      { label: "Choose plan", variant: "secondary" },
-      { label: "Compare plans", variant: "tertiary" }
-    ]
+    meta: "Billed monthly, cancel any time"
   }),
-  followups: ["Where is that written down?", "Invite my team to a workspace", "How is the trial going?"]
+  question: {
+    id: "team-plan",
+    questions: [
+      {
+        id: "plan",
+        prompt: "Go with the Team plan?",
+        options: [
+          { value: "choose", label: "Choose the Team plan" },
+          { value: "compare", label: "Compare the plans first" }
+        ]
+      }
+    ]
+  },
+  answered: (answer) => answer.toLowerCase().includes("compare") ? PLANS_COMPARED : {
+    steps: [{ status: "Switching the plan", point: "Move the workspace to Team from today." }],
+    text: "Done. The workspace is on the Team plan from today, billed monthly, and you can step back down any time.",
+    followups: ["Invite my team to a workspace", "Where is that written down?", "How is the trial going?"]
+  }
 }).user("Where is that written down?").assistant("Each chip opens the page the answer came from, so nothing here needs taking on trust.", {
   steps: [
     { status: "Collecting the sources", point: "Three product pages back the answer." },
@@ -110,26 +153,30 @@ const DEMO_SCRIPT = scriptChat().user("How do I get started?").assistant(
     label: "Signups"
   }),
   followups: ["Which plan fits a team of five?", "Invite my team to a workspace", "Where is that written down?"]
-}).user("Invite my team to a workspace").assistant("Happy to. Give me the word and I will send invites to the three teammates on your account, all as editors.", {
+}).user("Invite my team to a workspace").assistant("Happy to. Shall I send invites to the three teammates on your account, all as editors?", {
   steps: [
     { status: "Checking the account", point: "Three teammates sit on the account, none invited yet." },
     { status: "Drafting the answer", point: "Confirm before sending anything." }
   ],
-  followups: ["Go ahead and invite the other three", "Take us up to twelve seats", "Find a time we can all meet"]
-}).user("Go ahead and invite the other three").assistant("All three invites are out. Everyone lands in the workspace with editor access.", {
-  steps: [
-    { status: "Sending the invites", point: "Three teammates to invite, all editors." },
-    { status: "Confirming delivery", point: "One call covers the batch." }
-  ],
-  card: card("tool-call", {
-    name: "invite_teammates",
-    summary: "3 editors to acme-design",
-    status: "success",
-    duration: "0.6s",
-    args: '{\n  "workspace": "acme-design",\n  "role": "editor",\n  "emails": 3\n}'
-  }),
-  followups: ["Find a time we can all meet", "Take us up to twelve seats", "How is the trial going?"]
-}).user("Take us up to twelve seats").assistant("Only the seat count moves, from five to twelve. Everything else in the config stays as it was.", {
+  question: {
+    id: "invites",
+    questions: [
+      {
+        id: "send",
+        prompt: "Send the invites?",
+        options: [
+          { value: "send", label: "Invite all three" },
+          { value: "wait", label: "Not yet" }
+        ]
+      }
+    ]
+  },
+  answered: (answer) => answer.toLowerCase().startsWith("not yet") ? {
+    steps: [{ status: "Holding the invites", point: "Nothing sent; keep the list ready." }],
+    text: "Nothing sent. The three are ready to go whenever you are.",
+    followups: ["Take us up to twelve seats", "Find a time we can all meet", "How is the trial going?"]
+  } : INVITES_SENT
+}).user("Go ahead and invite the other three").assistant(INVITES_SENT.text, INVITES_SENT).user("Take us up to twelve seats").assistant("Only the seat count moves, from five to twelve. Everything else in the config stays as it was. Apply it?", {
   steps: [
     { status: "Locating the seat limit", point: "The seat limit lives in workspace.config.ts." },
     { status: "Preparing the change", point: "One line changes; show the diff." }
@@ -138,7 +185,34 @@ const DEMO_SCRIPT = scriptChat().user("How do I get started?").assistant(
     filename: "workspace.config.ts",
     diff: '@@ -12,7 +12,7 @@\n export const workspace = {\n   name: "acme-design",\n-  seats: 5,\n+  seats: 12,\n   region: "eu-west",\n };'
   }),
-  followups: ["Go ahead and invite the other three", "What do the plans include?", "Find a time we can all meet"]
+  question: {
+    id: "seats",
+    questions: [
+      {
+        id: "apply",
+        prompt: "Apply the change?",
+        options: [
+          { value: "apply", label: "Apply it" },
+          { value: "wait", label: "Not yet" }
+        ]
+      }
+    ]
+  },
+  answered: (answer) => answer.toLowerCase().startsWith("not yet") ? {
+    steps: [{ status: "Leaving the config", point: "The diff stays a proposal." }],
+    text: "Left as it is. The workspace stays at five seats until you say otherwise.",
+    followups: ["What do the plans include?", "Invite my team to a workspace", "How is the trial going?"]
+  } : {
+    steps: [{ status: "Applying the change", point: "One line in workspace.config.ts." }],
+    text: "Applied. The workspace takes twelve seats from now, and the next invoice picks up the difference.",
+    card: card("tool-call", {
+      name: "update_config",
+      summary: "workspace.config.ts, seats 5 to 12",
+      status: "success",
+      duration: "0.4s"
+    }),
+    followups: ["Invite my team to a workspace", "Find a time we can all meet", "How is the trial going?"]
+  }
 }).user("Here is the launch plan we are working from.").assistant(
   "Three phases, and most of the budget sits behind launch week itself. The dates line up with the workspace you already set up, so nothing needs to move.",
   {
@@ -167,31 +241,185 @@ const DEMO_SCRIPT = scriptChat().user("How do I get started?").assistant(
     }),
     followups: ["Set it all up for me", "Take us up to twelve seats", "Find a time we can all meet"]
   }
-).user("Sync the shared calendar").assistant("The sync timed out on the provider's side. Retry below and it should land.", {
+).user("Sync the shared calendar").assistant("The sync timed out on the provider's side. It usually lands on a second try. Run it again?", {
   steps: [{ status: "Starting the calendar sync", point: "The calendar sync runs after the invites." }],
   card: card("tool-call", {
     name: "sync_calendar",
     summary: "the shared team calendar",
     status: "error",
-    duration: "2.1s",
-    retryable: true
+    duration: "2.1s"
   }),
-  followups: ["Find a time we can all meet", "Go ahead and invite the other three", "How is the trial going?"]
-}).user("Find a time we can all meet").assistant("I can check everyone's calendar for a slot, once you allow it below.", {
+  question: {
+    id: "sync-retry",
+    questions: [
+      {
+        id: "retry",
+        prompt: "Try the sync again?",
+        options: [
+          { value: "retry", label: "Retry the sync" },
+          { value: "leave", label: "Leave it for now" }
+        ]
+      }
+    ]
+  },
+  answered: (answer) => answer.toLowerCase().startsWith("leave") ? {
+    steps: [{ status: "Leaving the sync", point: "Nothing to retry until asked." }],
+    text: "Left for now. Nothing else depends on it, and it can run again whenever you like.",
+    followups: ["Find a time we can all meet", "Invite my team to a workspace", "How is the trial going?"]
+  } : {
+    steps: [{ status: "Retrying the sync", point: "Second attempt against the provider." }],
+    text: "Second time lucky. The shared calendar is in sync.",
+    card: card("tool-call", {
+      name: "sync_calendar",
+      summary: "the shared team calendar",
+      status: "success",
+      duration: "1.2s"
+    }),
+    followups: ["Find a time we can all meet", "Plan our launch kickoff", "How is the trial going?"]
+  }
+}).user("Find a time we can all meet").assistant("I can check everyone's calendar for a slot. Can I read the shared team calendar?", {
   steps: [
     { status: "Checking what this needs", point: "Suggesting times needs calendar access." },
     { status: "Preparing the request", point: "Ask before connecting anything." }
   ],
-  card: card("interrupt", {
-    title: "Connect the shared calendar?",
-    description: "The assistant wants read access to the team calendar to suggest meeting times.",
-    options: [
-      { value: "allow", label: "Allow once", variant: "primary" },
-      { value: "always", label: "Always allow", variant: "secondary" },
-      { value: "deny", label: "Not now", variant: "secondary" }
+  question: {
+    id: "calendar-access",
+    questions: [
+      {
+        id: "access",
+        prompt: "Read the shared calendar?",
+        options: [
+          { value: "once", label: "Yes, just this once" },
+          { value: "always", label: "Yes, always" },
+          { value: "no", label: "Not now" }
+        ]
+      }
     ]
-  }),
-  followups: ["Go ahead and invite the other three", "How is the trial going?", "How do I get started?"]
+  },
+  answered: (answer) => answer.toLowerCase().startsWith("not now") ? {
+    steps: [{ status: "Leaving the calendar alone", point: "No access; offer the manual route." }],
+    text: "No problem, nothing is connected. You can share a few times that suit you and I will send them round.",
+    followups: ["Go ahead and invite the other three", "How is the trial going?", "How do I get started?"]
+  } : {
+    steps: [
+      { status: "Reading the shared calendar", point: "Four calendars, the next ten working days." },
+      { status: "Finding a free slot", point: "Thursday afternoon is clear for everyone." }
+    ],
+    text: answer.toLowerCase().includes("always") ? "Connected for good. Thursday at 2pm is the first slot everyone has free, and I will keep an eye out when plans change." : "Read once and disconnected. Thursday at 2pm is the first slot everyone has free.",
+    followups: ["Plan our launch kickoff", "Go ahead and invite the other three", "How is the trial going?"]
+  }
+}).user("Build me a launch dashboard").assistant(
+  "Here is the launch on one board: what is running now, the trial signups, the projects and what is waiting on you. The rows that ask a question will ask it here.",
+  {
+    steps: [
+      { status: "Gathering the launch numbers", point: "Signups, seats and open work all belong on one board." },
+      { status: "Laying out the dashboard", point: "Too much for a card; build it as an artifact." }
+    ],
+    card: artifactCard(DEMO_DASHBOARD_ARTIFACT),
+    followups: ["Draft the launch page", "How is the trial going?", "Which plan fits a team of five?"]
+  }
+).user("Draft the launch page").assistant(
+  "A first draft of the launch page is up beside the chat: the headline, the three things the Team plan adds, and one call to action. The source is behind the Code view.",
+  {
+    steps: [
+      { status: "Reading the launch plan", point: "The page should lead with the workspace, then the plan." },
+      { status: "Writing the page", point: "One document, its own styles, no scripts." }
+    ],
+    card: artifactCard(DEMO_PAGE_ARTIFACT),
+    followups: ["Build me a launch dashboard", "What do the plans include?", "How is the trial going?"]
+  }
+).user("Help me pick a plan").assistant("Happy to. How big is the team that will use the workspace?", {
+  steps: [{ status: "Reading the plans", point: "Plans differ by team size; ask before recommending." }],
+  question: {
+    id: "team-size",
+    questions: [
+      {
+        id: "size",
+        prompt: "How big is the team?",
+        options: [
+          { value: "solo", label: "Just me" },
+          { value: "small", label: "2 to 10 people" },
+          { value: "medium", label: "11 to 50 people" },
+          { value: "large", label: "More than 50" }
+        ],
+        other: true
+      }
+    ]
+  },
+  answered: planFor
+}).user("Set up notifications for me").assistant("Sure. Which of these should reach you? Pick as many as you like.", {
+  steps: [{ status: "Reading your settings", point: "Four kinds of notification; ask which matter." }],
+  question: {
+    id: "notifications",
+    questions: [
+      {
+        id: "kinds",
+        prompt: "Notify me about",
+        mode: "multi",
+        options: [
+          { value: "mentions", label: "Mentions", description: "When someone writes your name" },
+          { value: "comments", label: "Comments on my files" },
+          { value: "invites", label: "Invites accepted" },
+          { value: "summary", label: "A weekly summary", description: "Mondays, one email" }
+        ],
+        other: true
+      }
+    ]
+  },
+  answered: (answer) => ({
+    steps: [{ status: "Saving your settings", point: "Turn on what was picked, everything else off." }],
+    text: `Done. You will hear about ${answer.trim().toLowerCase()}, and nothing else. Change it any time in Settings.`,
+    followups: ["Plan our launch kickoff", "Help me pick a plan", "How is the trial going?"]
+  })
+}).user("Plan our launch kickoff").assistant("Three quick questions first, so the kickoff fits the team.", {
+  steps: [
+    { status: "Reading the launch plan", point: "The kickoff needs a date, a guest list and a format." },
+    { status: "Preparing the questions", point: "Ask all three before booking anything." }
+  ],
+  question: {
+    id: "kickoff",
+    questions: [
+      {
+        id: "when",
+        prompt: "When should it happen?",
+        options: [
+          { value: "this-week", label: "This week" },
+          { value: "next-week", label: "Next week" },
+          { value: "after-beta", label: "After the beta" }
+        ]
+      },
+      {
+        id: "who",
+        prompt: "Who should be there?",
+        mode: "multi",
+        options: [
+          { value: "design", label: "Design" },
+          { value: "engineering", label: "Engineering" },
+          { value: "marketing", label: "Marketing" },
+          { value: "sales", label: "Sales" }
+        ]
+      },
+      {
+        id: "format",
+        prompt: "What format?",
+        options: [
+          { value: "room", label: "In person" },
+          { value: "video", label: "A video call" },
+          { value: "async", label: "An async update" }
+        ],
+        other: true
+      }
+    ]
+  },
+  answered: {
+    steps: [
+      { status: "Booking the kickoff", point: "Find the first slot everyone named is free." },
+      { status: "Drafting the agenda", point: "Lead with the launch dates, then owners." }
+    ],
+    text: "Kickoff is on the calendar. The slot is held for everyone you named, and the agenda is being drafted from the launch plan.",
+    card: card("plan", { steps: KICKOFF_STEPS }),
+    followups: ["Find a time we can all meet", "Build me a launch dashboard", "Set up notifications for me"]
+  }
 }).fallback(
   "The launch is on track overall. Three of the four readiness tracks are green, and the one item I would watch is the **legal review**, since it gates the pricing rollout.",
   {
@@ -203,10 +431,10 @@ const DEMO_SCRIPT = scriptChat().user("How do I get started?").assistant(
     followups: ["Which track is behind?", "Who owns the legal review?", "What happens if pricing slips?"]
   }
 ).fallback(
-  "This chat is a scripted preview of the widget, so free text gets one of a few written replies. The suggestion chips lead through the parts of the story that show off the rich content: a plan, a chart, a diff, a tool call and an approval.",
+  "This chat is a scripted preview of the widget, so free text gets one of a few written replies. The suggestion chips lead through the parts of the story that show off the rich content: a plan, a chart, a diff, a tool call, an artifact and questions to answer.",
   {
     steps: [{ status: "Reading the question", point: "Nothing scripted matches this one." }],
-    followups: ["How do I get started?", "What do the plans include?", "How is the trial going?"]
+    followups: ["How do I get started?", "Help me pick a plan", "Plan our launch kickoff"]
   }
 ).build();
 export {