@btndprojects/loam-ui-native 0.2.1 → 0.3.1

package/dist/chunk-IHSIENOE.js

@@ -0,0 +1,3950 @@
+import { useElapsed, formatRecordingTime } from './chunk-VLMT6KYT.js';
+import { LevelMeter } from './chunk-EOLZWRV6.js';
+import { Markdown } from './chunk-ONKQUJWD.js';
+import { Textarea } from './chunk-RIK6UX2K.js';
+import { CopyButton } from './chunk-TYOSA7JG.js';
+import { Progress } from './chunk-L2WMOA2V.js';
+import { Checkbox } from './chunk-KNILMM4H.js';
+import { Chip } from './chunk-7NGMUVNU.js';
+import { Avatar } from './chunk-JWCVBFDU.js';
+import { IconTile } from './chunk-XBXUBBJZ.js';
+import { useThinkingPulse, Thinking } from './chunk-LUZFCCSD.js';
+import { useFormFactor } from './chunk-AWKQIE5I.js';
+import { Alert } from './chunk-Z7I4ZSO6.js';
+import { Sheet } from './chunk-B7JZ3N5G.js';
+import { Button } from './chunk-5DTKORLI.js';
+import { Badge } from './chunk-LGNTP5XA.js';
+import { Skeleton } from './chunk-YJ5PXOX3.js';
+import { expandedProps } from './chunk-W23G6JLF.js';
+import { SegmentedControl } from './chunk-NZG75DGA.js';
+import { Input } from './chunk-KXLDK6HB.js';
+import { haptics } from './chunk-NY2U3PBI.js';
+import { isAndroidIdiom } from './chunk-TH4PW2WU.js';
+import { useLabels } from './chunk-APCWFOZW.js';
+import { Icon } from './chunk-PCEFCOLN.js';
+import { springConfig, BREAKAWAY, resist, rubberband, useResolvedMotion } from './chunk-J64KGCGX.js';
+import * as React10 from 'react';
+import { Platform, UIManager, Animated, View, Text, Pressable, Image, ScrollView, I18nManager, PanResponder, LayoutAnimation, Easing, BackHandler, TextInput, AccessibilityInfo, KeyboardAvoidingView } from 'react-native';
+import { createStyleSheet, useStyles, useLoamTheme } from '@btndprojects/loam-theme-native';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+// src/chat/chat-labels.ts
+function formatChatDuration(ms) {
+  if (ms < 1e3) return `${Math.round(ms)}ms`;
+  const s = ms / 1e3;
+  if (s < 60) return `${s < 10 ? s.toFixed(1) : Math.round(s)}s`;
+  const m = Math.floor(s / 60);
+  return `${m}m ${String(Math.round(s % 60)).padStart(2, "0")}s`;
+}
+function formatChatBytes(bytes) {
+  if (bytes < 1024) return `${bytes} B`;
+  if (bytes < 1024 * 1024) return `${Math.round(bytes / 1024)} KB`;
+  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+}
+var DEFAULT_CHAT_LABELS = {
+  chat: "Chat",
+  messages: "Messages",
+  emptyTitle: "How can I help?",
+  placeholder: "Send a message\u2026",
+  composer: "Message",
+  assistant: "Assistant",
+  you: "You",
+  attachFiles: "Attach files",
+  attachments: "Attachments",
+  dropFiles: "Drop files to attach",
+  send: "Send",
+  stop: "Stop",
+  replyingTo: (author) => `Replying to ${author}`,
+  cancelReply: "Cancel reply",
+  removeAttachment: (name) => `Remove ${name}`,
+  uploading: "Uploading\u2026",
+  uploadFailed: "Upload failed",
+  file: "File",
+  duration: formatChatDuration,
+  bytes: formatChatBytes,
+  elapsed: (s) => `${s}s`,
+  saidBy: (name) => `${name} said`,
+  responding: (name) => `${name} is responding\u2026`,
+  said: (name, text) => `${name} said: ${text}`,
+  stoppedAnnouncement: (name, text) => `${name} stopped. ${text}`,
+  stopped: "Stopped",
+  loadEarlier: "Load earlier messages",
+  loadingEarlier: "Loading earlier messages",
+  writing: "Writing\u2026",
+  newMessages: "New messages",
+  jumpToLatest: "Jump to latest",
+  followUps: "Suggested follow-ups",
+  copyMessage: "Copy message",
+  copy: "Copy",
+  copyResponse: "Copy response",
+  editMessage: "Edit message",
+  editNote: "Sending replaces this message and everything after it.",
+  editHint: "Long-press to edit",
+  reply: "Reply",
+  regenerate: "Regenerate",
+  retry: "Retry",
+  notSent: "Not sent.",
+  cancel: "Cancel",
+  goodResponse: "Good response",
+  badResponse: "Bad response",
+  feedbackTitle: "What went wrong?",
+  feedbackReasons: [
+    "Not accurate",
+    "Not helpful",
+    "Too long",
+    "Didn\u2019t follow instructions",
+    "Something else"
+  ],
+  feedbackNote: "Tell us more (optional)",
+  sendFeedback: "Send feedback",
+  thanks: "Thanks for the feedback.",
+  thinking: "Thinking\u2026",
+  reasoning: "Reasoning",
+  thoughtFor: (d) => `Thought for ${d}`,
+  steps: (n) => `${n} ${n === 1 ? "step" : "steps"}`,
+  working: (n) => `Working \xB7 ${n} ${n === 1 ? "step" : "steps"}`,
+  usedTools: (n, failed) => `Used ${n} ${n === 1 ? "tool" : "tools"}${failed ? ` \xB7 ${failed} failed` : ""}`,
+  toolRunning: "running",
+  toolDone: "done",
+  toolFailed: "failed",
+  moreSuggestions: "More suggestions",
+  previousSuggestions: "Previous suggestions",
+  suggestionsPage: (p, n) => `Suggestions page ${p} of ${n}`,
+  suggestionsPageOf: (p, n) => `Page ${p} of ${n}`,
+  loadingSuggestions: "Loading suggestions",
+  notUseful: "Not useful",
+  notUsefulFor: (label) => `Not useful: ${label}`,
+  why: (r) => `Why: ${r}`,
+  continue: "Continue",
+  dictate: "Dictate",
+  cancelRecording: "Cancel recording",
+  doneRecording: "Done",
+  listening: "Listening\u2026",
+  transcribing: "Transcribing\u2026",
+  micBlocked: "Microphone is blocked",
+  micHelp: "How to allow",
+  micOff: "Microphone is off for this app",
+  openSettings: "Settings",
+  context: "Context",
+  contextUsed: (p) => `Context ${p}% used`,
+  contextTokens: (u, t) => `${u} / ${t} tokens`,
+  summarise: "Summarise and continue",
+  chatFull: "This chat is full",
+  startNewChat: "Start new chat",
+  chatAlmostFull: "This chat is almost full",
+  contextExplain: "Older messages drop out of what the assistant can see. Starting over with a summary keeps the decisions so far.",
+  newChatWithSummary: "New chat with a summary",
+  keepGoing: "Keep going",
+  queuePlaceholder: "Write another\u2026",
+  queued: "Queued messages",
+  moreQueued: (n) => `+${n} queued`,
+  editQueued: "Edit",
+  removeQueued: "Remove",
+  sendNow: "Send now",
+  needsApproval: "Needs approval",
+  allow: "Allow",
+  deny: "Deny",
+  alwaysAllow: "Always allow in this chat",
+  expired: "Expired",
+  allowed: "Allowed",
+  denied: "Denied",
+  toolsWaiting: (n) => `${n} ${n === 1 ? "tool" : "tools"} waiting for you`,
+  review: "Review",
+  source: (n) => `Source ${n}`,
+  sources: "Sources",
+  moreSources: (n) => `${n} more sources`,
+  openSource: "Open source",
+  sourceUnavailable: "Unavailable",
+  versionOf: (i, n) => `${i} of ${n}`,
+  previousVersion: "Previous version",
+  nextVersion: "Next version",
+  commands: "Commands",
+  people: "People",
+  files: "Files",
+  noMatches: "No matches",
+  chats: "Chats",
+  newChat: "New chat",
+  searchChats: "Search chats",
+  more: "More",
+  renameChat: "Rename chat",
+  unread: "Unread",
+  answering: "Answering",
+  open: "Open",
+  preview: "Preview",
+  code: "Code",
+  close: "Close",
+  delete: "Delete",
+  save: "Save",
+  noChats: "No chats yet",
+  share: "Share",
+  artifactName: (title, kind) => `${title}, ${kind}`,
+  rows: (n) => `${n} ${n === 1 ? "row" : "rows"}`,
+  expand: "Expand",
+  download: "Download",
+  openExternal: "Open in new tab"
+};
+if (Platform.OS === "android" && UIManager.setLayoutAnimationEnabledExperimental) {
+  UIManager.setLayoutAnimationEnabledExperimental(true);
+}
+function useArrival(enabled, kind = "in", delayMs = 0) {
+  const theme = useLoamTheme("chat");
+  const [run] = React10.useState(enabled);
+  const p = React10.useRef(new Animated.Value(run ? 0 : 1)).current;
+  React10.useEffect(() => {
+    if (!run) return;
+    if (theme.reduceMotion) {
+      Animated.timing(p, { toValue: 1, duration: theme.duration.fast, delay: delayMs, useNativeDriver: true }).start();
+      return;
+    }
+    Animated.sequence([
+      Animated.delay(delayMs),
+      Animated.spring(p, { ...springConfig(theme, "ds"), toValue: 1, useNativeDriver: true })
+    ]).start();
+  }, [run, p, delayMs, theme]);
+  if (!run) return void 0;
+  if (theme.reduceMotion) return { opacity: p };
+  const rise = 8;
+  const scale = kind === "sent" ? 0.96 : kind === "card" ? 0.985 : 1;
+  return {
+    opacity: p.interpolate({ inputRange: [0, 1], outputRange: [0, 1], extrapolate: "clamp" }),
+    transform: [
+      { translateY: p.interpolate({ inputRange: [0, 1], outputRange: [rise, 0] }) },
+      { scale: p.interpolate({ inputRange: [0, 1], outputRange: [scale, 1] }) }
+    ]
+  };
+}
+function useAutoDisclosure(live, animate) {
+  const theme = useLoamTheme("chat");
+  const [open, setOpen] = React10.useState(live);
+  const owned = React10.useRef(false);
+  const ease = React10.useCallback(() => {
+    if (!animate) return;
+    const duration = theme.motion.expand.duration;
+    LayoutAnimation.configureNext({
+      duration,
+      update: { type: LayoutAnimation.Types.easeInEaseOut },
+      create: { type: LayoutAnimation.Types.easeInEaseOut, property: LayoutAnimation.Properties.opacity, duration },
+      delete: { type: LayoutAnimation.Types.easeInEaseOut, property: LayoutAnimation.Properties.opacity, duration }
+    });
+  }, [animate, theme.motion.expand.duration]);
+  React10.useEffect(() => {
+    if (owned.current) return;
+    ease();
+    setOpen(live);
+  }, [live, ease]);
+  const toggle = React10.useCallback(() => {
+    owned.current = true;
+    ease();
+    setOpen((o) => !o);
+  }, [ease]);
+  return [open, toggle];
+}
+function Disclosure({
+  open,
+  onToggle,
+  summary,
+  icon,
+  shimmer,
+  children
+}) {
+  const { styles } = useStyles(sheet);
+  const theme = useLoamTheme("chat");
+  const pulse = useThinkingPulse(shimmer);
+  return /* @__PURE__ */ jsxs(View, { children: [
+    /* @__PURE__ */ jsxs(
+      Pressable,
+      {
+        role: "button",
+        accessibilityRole: "button",
+        accessibilityLabel: summary,
+        ...expandedProps(open),
+        accessibilityState: { expanded: open },
+        onPress: onToggle,
+        hitSlop: (theme.hit.sm - theme.ctl.sm) / 2,
+        style: ({ pressed }) => [styles.summary, pressed && styles.down],
+        children: [
+          icon,
+          /* @__PURE__ */ jsx(Animated.Text, { style: [styles.summaryText, pulse], children: summary }),
+          /* @__PURE__ */ jsx(View, { style: { transform: [{ rotate: open ? "90deg" : "0deg" }] }, children: /* @__PURE__ */ jsx(Icon, { name: "chevron-right", size: theme.icon.xs, color: theme.color.text2 }) })
+        ]
+      }
+    ),
+    open ? /* @__PURE__ */ jsx(View, { style: styles.panel, children }) : null
+  ] });
+}
+function ReasoningView({
+  part,
+  live,
+  animate,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet);
+  const theme = useLoamTheme("chat");
+  const [open, toggle] = useAutoDisclosure(live, animate);
+  const summary = live ? labels.thinking : part.durationMs != null ? labels.thoughtFor(labels.duration(part.durationMs)) : labels.reasoning;
+  return /* @__PURE__ */ jsx(
+    Disclosure,
+    {
+      open,
+      onToggle: toggle,
+      summary,
+      shimmer: live && animate,
+      icon: /* @__PURE__ */ jsx(Icon, { name: "brain", size: theme.icon.sm, color: theme.color.text3 }),
+      children: /* @__PURE__ */ jsx(View, { style: styles.rail, children: /* @__PURE__ */ jsx(Text, { style: styles.reasoning, children: part.text }) })
+    }
+  );
+}
+function ToolMark({ status, animate }) {
+  const theme = useLoamTheme("chat");
+  const pop = React10.useRef(new Animated.Value(status === "running" || !animate ? 1 : 0)).current;
+  const prev = React10.useRef(status);
+  React10.useEffect(() => {
+    if (prev.current === "running" && status !== "running" && animate) {
+      pop.setValue(0);
+      Animated.spring(pop, { toValue: 1, useNativeDriver: true, speed: 18, bounciness: 10 }).start();
+    }
+    prev.current = status;
+  }, [status, animate, pop]);
+  if (status === "running") {
+    return /* @__PURE__ */ jsx(Thinking, { label: "", size: "sm", announce: false, motion: animate ? "full" : "none" });
+  }
+  return /* @__PURE__ */ jsx(Animated.View, { style: { opacity: pop, transform: [{ scale: pop.interpolate({ inputRange: [0, 1], outputRange: [0.6, 1] }) }] }, children: /* @__PURE__ */ jsx(
+    Icon,
+    {
+      name: status === "error" ? "x" : "check",
+      size: theme.icon.xs,
+      color: status === "error" ? theme.color.danger : theme.color.good
+    }
+  ) });
+}
+function ToolGroupView({
+  tools,
+  animate,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet);
+  const theme = useLoamTheme("chat");
+  const running = tools.some((t) => t.status === "running");
+  const failed = tools.filter((t) => t.status === "error").length;
+  const [open, toggle] = useAutoDisclosure(running, animate);
+  const n = tools.length;
+  const summary = running ? labels.working(n) : labels.usedTools(n, failed);
+  return /* @__PURE__ */ jsx(
+    Disclosure,
+    {
+      open,
+      onToggle: toggle,
+      summary,
+      shimmer: running && animate,
+      icon: /* @__PURE__ */ jsx(Icon, { name: "wrench", size: theme.icon.sm, color: theme.color.text3 }),
+      children: /* @__PURE__ */ jsx(View, { accessibilityRole: "list", children: tools.map((tool, i) => /* @__PURE__ */ jsxs(View, { role: "listitem", style: styles.step, children: [
+        /* @__PURE__ */ jsxs(View, { style: styles.nodeCol, children: [
+          i > 0 ? /* @__PURE__ */ jsx(View, { style: [styles.line, styles.lineTop] }) : null,
+          i < n - 1 ? /* @__PURE__ */ jsx(View, { style: [styles.line, styles.lineBottom] }) : null,
+          /* @__PURE__ */ jsx(View, { style: [styles.node, tool.status === "error" && styles.nodeError], children: /* @__PURE__ */ jsx(
+            Icon,
+            {
+              name: tool.icon ?? "wrench",
+              size: theme.icon.xs,
+              color: tool.status === "error" ? theme.color.dangerOnSoft : theme.color.text2
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ jsxs(View, { style: styles.stepBody, children: [
+          /* @__PURE__ */ jsxs(View, { style: styles.stepHead, children: [
+            /* @__PURE__ */ jsx(Text, { style: styles.stepTitle, numberOfLines: 2, children: tool.title }),
+            /* @__PURE__ */ jsx(ToolMark, { status: tool.status, animate }),
+            tool.durationMs != null && tool.status !== "running" ? /* @__PURE__ */ jsx(Text, { style: styles.count, children: labels.duration(tool.durationMs) }) : null
+          ] }),
+          tool.detail ? /* @__PURE__ */ jsx(Text, { style: styles.meta, numberOfLines: 2, children: tool.detail }) : null
+        ] })
+      ] }, tool.id)) })
+    }
+  );
+}
+function WorkingIndicator({
+  phase: phaseProp,
+  startedAt,
+  animate,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const phase = phaseProp ?? labels.thinking;
+  const { styles } = useStyles(sheet);
+  const pulse = useThinkingPulse(animate);
+  const [now, setNow] = React10.useState(() => Date.now());
+  React10.useEffect(() => {
+    if (startedAt == null) return;
+    const id = setInterval(() => setNow(Date.now()), 1e3);
+    return () => clearInterval(id);
+  }, [startedAt]);
+  const elapsed = startedAt != null ? Math.max(0, Math.floor((now - startedAt) / 1e3)) : null;
+  return /* @__PURE__ */ jsxs(View, { style: styles.working, role: "status", accessibilityLabel: phase, children: [
+    /* @__PURE__ */ jsx(Thinking, { label: "", size: "sm", announce: false, motion: animate ? "full" : "none" }),
+    /* @__PURE__ */ jsx(Animated.Text, { style: [styles.summaryText, pulse], children: phase }),
+    elapsed != null && elapsed > 0 ? /* @__PURE__ */ jsxs(Text, { style: styles.meta, children: [
+      "\xB7 ",
+      labels.elapsed(elapsed)
+    ] }) : null
+  ] });
+}
+function AttachmentChip({
+  attachment,
+  onRemove,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet);
+  const theme = useLoamTheme("chat");
+  const status = attachment.status ?? "done";
+  const image = attachment.type?.startsWith("image/") && attachment.previewUrl;
+  const sub = status === "uploading" ? labels.uploading : status === "error" ? labels.uploadFailed : attachment.size != null ? labels.bytes(attachment.size) : void 0;
+  return /* @__PURE__ */ jsxs(View, { style: [styles.chip, onRemove && styles.chipRemovable, status === "error" && styles.chipError], children: [
+    image ? /* @__PURE__ */ jsx(Image, { source: { uri: attachment.previewUrl }, style: styles.thumb, accessibilityIgnoresInvertColors: true }) : /* @__PURE__ */ jsx(View, { style: styles.fileIcon, children: /* @__PURE__ */ jsx(
+      Icon,
+      {
+        name: status === "uploading" ? "loader" : "file",
+        size: theme.icon.sm,
+        color: theme.color.text2
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(View, { style: styles.chipText, children: [
+      /* @__PURE__ */ jsx(Text, { style: styles.chipName, numberOfLines: 1, children: attachment.name }),
+      sub ? /* @__PURE__ */ jsx(Text, { style: [styles.meta, status === "error" && { color: theme.color.dangerOnSoft }], children: sub }) : null
+    ] }),
+    onRemove ? /* @__PURE__ */ jsx(
+      Pressable,
+      {
+        accessibilityRole: "button",
+        accessibilityLabel: labels.removeAttachment(attachment.name),
+        onPress: onRemove,
+        hitSlop: (theme.hit.xs - theme.ctl.xs) / 2,
+        style: ({ pressed }) => [styles.remove, pressed && styles.down],
+        children: /* @__PURE__ */ jsx(Icon, { name: "x", size: theme.ctl.icon.xs, color: theme.color.text2 })
+      }
+    ) : null
+  ] });
+}
+var NODE = 22;
+var sheet = createStyleSheet((theme) => ({
+  summary: {
+    flexDirection: "row",
+    alignItems: "center",
+    alignSelf: "flex-start",
+    gap: theme.space.s2,
+    // A ghost sm row: 30, r 8, px 8 pulled back by 8 so the glyph keeps the
+    // text column.
+    height: theme.ctl.sm,
+    paddingHorizontal: theme.space.s2,
+    marginStart: -theme.space.s2,
+    borderRadius: theme.ctl.r.sm
+  },
+  down: { backgroundColor: theme.state.pressed },
+  summaryText: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    lineHeight: theme.type.footnote.lineHeight,
+    color: theme.color.text2
+  },
+  panel: { paddingTop: theme.space.s2 },
+  rail: {
+    borderStartWidth: theme.borderWidth.base,
+    borderStartColor: theme.color.border,
+    paddingStart: theme.space.s3,
+    marginStart: theme.space[6]
+  },
+  reasoning: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    lineHeight: theme.type.footnote.lineHeight,
+    color: theme.color.text2
+  },
+  step: { flexDirection: "row", gap: theme.space.s3, paddingVertical: theme.space[6] },
+  nodeCol: { width: NODE, alignItems: "center" },
+  line: {
+    position: "absolute",
+    width: theme.borderWidth.base,
+    backgroundColor: theme.color.border,
+    left: (NODE - theme.borderWidth.base) / 2
+  },
+  lineTop: { top: -theme.space[6], height: theme.space[6] + theme.space[2] },
+  lineBottom: { top: theme.space[2] + NODE, bottom: -theme.space[6] },
+  node: {
+    marginTop: theme.space[2],
+    width: NODE,
+    height: NODE,
+    borderRadius: theme.radius[6],
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.color.border,
+    backgroundColor: theme.color.surface3,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  nodeError: { borderColor: theme.edge.danger, backgroundColor: theme.color.dangerSoft },
+  stepBody: { flex: 1, minWidth: 0, gap: theme.space[2], paddingTop: theme.space[4] },
+  stepHead: { flexDirection: "row", alignItems: "center", gap: theme.space.s2 },
+  stepTitle: {
+    flexShrink: 1,
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    lineHeight: theme.type.footnote.lineHeight,
+    color: theme.color.text
+  },
+  meta: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.caption1.fontSize,
+    lineHeight: theme.type.caption1.lineHeight,
+    color: theme.color.text2
+  },
+  count: {
+    fontFamily: theme.font.mono,
+    fontSize: theme.type.caption1.fontSize,
+    fontWeight: theme.fontWeight.medium,
+    fontVariant: ["tabular-nums"],
+    color: theme.color.text2
+  },
+  working: { flexDirection: "row", alignItems: "center", gap: theme.space.s2, minHeight: theme.ctl.sm },
+  chip: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s2,
+    maxWidth: theme.ctl.sm * 7,
+    // 44, the lg tier: a 30 thumb 7 in, concentric with the r 12 corner.
+    minHeight: theme.ctl.lg,
+    paddingStart: theme.space[7],
+    paddingEnd: theme.space[10],
+    borderRadius: theme.radius.md,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.color.border,
+    backgroundColor: theme.color.surface
+  },
+  chipRemovable: { paddingEnd: (theme.ctl.lg - theme.ctl.xs) / 2 },
+  chipError: { borderColor: theme.edge.danger },
+  thumb: { width: theme.ctl.sm, height: theme.ctl.sm, borderRadius: theme.radius[6] },
+  fileIcon: {
+    width: theme.ctl.sm,
+    height: theme.ctl.sm,
+    borderRadius: theme.radius[6],
+    backgroundColor: theme.color.surface2,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  chipText: { flexShrink: 1, minWidth: 0 },
+  chipName: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    lineHeight: theme.type.footnote.lineHeight,
+    fontWeight: theme.fontWeight.medium,
+    color: theme.color.text
+  },
+  remove: {
+    width: theme.ctl.xs,
+    height: theme.ctl.xs,
+    borderRadius: theme.ctl.r.xs,
+    alignItems: "center",
+    justifyContent: "center"
+  }
+}));
+function findChatTrigger(text, caret) {
+  const before = text.slice(0, caret);
+  const m = /(^|\s)([/@])([^\s/@]*)$/.exec(before);
+  if (!m) return null;
+  const char = m[2];
+  return { char, query: m[3] ?? "", start: before.length - (m[3]?.length ?? 0) - 1 };
+}
+function matches(name, query) {
+  return name.toLowerCase().includes(query.toLowerCase());
+}
+function chatSlashEntries(trigger, commands, mentions) {
+  if (trigger.char === "/") {
+    return commands.filter((c) => matches(c.name, trigger.query)).map((c) => ({ type: "command", key: `c:${c.id}`, name: c.name, command: c }));
+  }
+  return mentions.filter((m) => matches(m.name, trigger.query)).map((m) => ({
+    type: m.kind === "file" ? "file" : "person",
+    key: `m:${m.id}`,
+    name: m.name,
+    mention: m
+  })).sort((a, b) => a.type === b.type ? 0 : a.type === "person" ? -1 : 1);
+}
+function Matched({ text, query, style }) {
+  const theme = useLoamTheme("chat");
+  const at = query ? text.toLowerCase().indexOf(query.toLowerCase()) : -1;
+  if (at < 0) return /* @__PURE__ */ jsx(Text, { style, children: text });
+  return /* @__PURE__ */ jsxs(Text, { style, children: [
+    text.slice(0, at),
+    /* @__PURE__ */ jsx(Text, { style: { fontWeight: theme.fontWeight.semibold }, children: text.slice(at, at + query.length) }),
+    text.slice(at + query.length)
+  ] });
+}
+function ChatSlashMenu({
+  entries,
+  query,
+  onPick,
+  labels
+}) {
+  const { styles } = useStyles(sheet2);
+  const theme = useLoamTheme("chat");
+  const sections = [];
+  for (const entry of entries) {
+    const title = entry.type === "command" ? labels.commands : entry.type === "person" ? labels.people : labels.files;
+    const last = sections[sections.length - 1];
+    if (last && last.title === title) last.rows.push(entry);
+    else sections.push({ title, rows: [entry] });
+  }
+  return /* @__PURE__ */ jsx(View, { style: styles.menu, testID: "chat-slash-menu", children: /* @__PURE__ */ jsxs(ScrollView, { keyboardShouldPersistTaps: "always", style: styles.scroll, children: [
+    sections.length === 0 ? /* @__PURE__ */ jsxs(Text, { style: [styles.desc, styles.empty], children: [
+      labels.noMatches,
+      query ? ` \u201C${query}\u201D` : ""
+    ] }) : null,
+    sections.map((s) => /* @__PURE__ */ jsxs(View, { role: "list", accessibilityLabel: s.title, children: [
+      /* @__PURE__ */ jsx(Text, { style: styles.overline, children: s.title }),
+      s.rows.map((entry) => /* @__PURE__ */ jsx(View, { role: "listitem", children: /* @__PURE__ */ jsx(
+        Pressable,
+        {
+          accessibilityRole: "button",
+          accessibilityLabel: entry.type === "command" ? `/${entry.name}${entry.command?.description ? `, ${entry.command.description}` : ""}` : entry.name,
+          onPress: () => onPick(entry),
+          style: ({ pressed }) => [
+            styles.row,
+            entry.type === "command" ? styles.rowTall : styles.rowShort,
+            pressed && styles.down
+          ],
+          children: entry.type === "command" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(Icon, { name: entry.command?.icon ?? "terminal", size: theme.icon.sm, color: theme.color.text2 }),
+            /* @__PURE__ */ jsxs(View, { style: styles.text, children: [
+              /* @__PURE__ */ jsx(Matched, { text: `/${entry.name}`, query, style: styles.name }),
+              entry.command?.description ? /* @__PURE__ */ jsx(Text, { numberOfLines: 1, style: styles.desc, children: entry.command.description }) : null
+            ] })
+          ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            entry.type === "person" ? /* @__PURE__ */ jsx(Avatar, { size: "sm", name: entry.name, src: entry.mention?.avatar }) : /* @__PURE__ */ jsx(Icon, { name: "file", size: theme.icon.sm, color: theme.color.text2 }),
+            /* @__PURE__ */ jsx(Matched, { text: entry.name, query, style: [styles.name, styles.grow] }),
+            entry.mention?.role ? /* @__PURE__ */ jsx(Text, { numberOfLines: 1, style: styles.desc, children: entry.mention.role }) : null
+          ] })
+        }
+      ) }, entry.key))
+    ] }, s.title))
+  ] }) });
+}
+var sheet2 = createStyleSheet((theme) => ({
+  empty: { paddingHorizontal: theme.space[8], paddingVertical: theme.space[8] },
+  menu: {
+    marginBottom: theme.space[8],
+    padding: theme.space[8],
+    borderRadius: theme.radius.md,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.color.border,
+    backgroundColor: theme.color.surface,
+    ...theme.shadow.md
+  },
+  scroll: { maxHeight: theme.space[56] * 4 },
+  overline: {
+    ...theme.type.overline,
+    paddingHorizontal: theme.space[8],
+    paddingVertical: theme.space[4],
+    fontFamily: theme.font.sans,
+    color: theme.color.text3
+  },
+  row: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s3,
+    paddingHorizontal: theme.space[8],
+    borderRadius: theme.radius.sm
+  },
+  rowTall: { minHeight: theme.space[56] },
+  rowShort: { minHeight: theme.space[48] },
+  down: { backgroundColor: theme.state.pressed },
+  text: { flex: 1, minWidth: 0, gap: theme.space[2] },
+  grow: { flex: 1, minWidth: 0 },
+  name: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.callout.fontSize,
+    lineHeight: theme.type.callout.lineHeight,
+    color: theme.color.text2
+  },
+  desc: {
+    flexShrink: 1,
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    lineHeight: theme.type.footnote.lineHeight,
+    color: theme.color.text2
+  }
+}));
+function ChatComposer({
+  onSend,
+  replyTo,
+  onCancelReply,
+  running = false,
+  onStop,
+  value: valueProp,
+  defaultValue = "",
+  onValueChange,
+  placeholder: placeholderProp,
+  label: labelProp,
+  attachments = [],
+  onAttach,
+  onRemoveAttachment,
+  accept,
+  toolbar,
+  recall,
+  hint,
+  disabled = false,
+  queue = [],
+  onQueue,
+  onEditQueued,
+  onRemoveQueued,
+  onSendQueued,
+  voice,
+  context,
+  approvals,
+  inputRef,
+  commands,
+  mentions,
+  onCommand,
+  onMention,
+  maxRows = 8,
+  motion = "full",
+  style,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const queueing = running && !!onQueue;
+  const placeholder = placeholderProp ?? (queueing ? labels.queuePlaceholder : labels.placeholder);
+  const label = labelProp ?? labels.composer;
+  const { styles } = useStyles(sheet3);
+  const theme = useLoamTheme("chat");
+  const animate = useResolvedMotion(motion, "chat") === "full";
+  const [inner, setInner] = React10.useState(defaultValue);
+  const value = valueProp ?? inner;
+  const setValue = (next) => {
+    if (valueProp === void 0) setInner(next);
+    onValueChange?.(next);
+  };
+  const [focused, setFocused] = React10.useState(false);
+  const [caret, setCaret] = React10.useState(null);
+  const [dismissed, setDismissed] = React10.useState(null);
+  const voiceStatus = voice?.status ?? "idle";
+  const recording = voiceStatus === "recording";
+  const transcribing = voiceStatus === "transcribing";
+  const full = !!context && context.used >= context.total;
+  const uploading = attachments.some((a) => a.status === "uploading");
+  const hasDraft = value.trim() !== "" || attachments.length > 0;
+  const canSend = !disabled && !running && !uploading && !full && !transcribing && hasDraft;
+  const canQueue = !disabled && queueing && !uploading && !full && hasDraft;
+  const showStop = running && !!onStop && !canQueue;
+  const [menuFor, setMenuFor] = React10.useState(null);
+  const swap = React10.useRef(new Animated.Value(showStop ? 1 : 0)).current;
+  React10.useEffect(() => {
+    Animated.timing(swap, {
+      toValue: showStop ? 1 : 0,
+      duration: animate ? theme.motion.swap.duration : 0,
+      easing: Easing.bezier(...theme.motion.swap.easing),
+      useNativeDriver: true
+    }).start();
+  }, [showStop, animate, swap, theme.motion.swap]);
+  const trigger = commands || mentions ? findChatTrigger(value, Math.min(caret ?? value.length, value.length)) : null;
+  const entries = trigger ? chatSlashEntries(trigger, commands ?? [], mentions ?? []) : [];
+  const menuOpen = !!trigger && entries.length > 0 && dismissed !== trigger.start && !disabled && !full;
+  const [tokens, setTokens] = React10.useState([]);
+  const [scrollY, setScrollY] = React10.useState(0);
+  const cancelReply = replyTo ? onCancelReply : void 0;
+  React10.useEffect(() => {
+    if (!cancelReply) return void 0;
+    const sub = BackHandler.addEventListener("hardwareBackPress", () => {
+      cancelReply();
+      return true;
+    });
+    return () => sub.remove();
+  }, [cancelReply]);
+  const pick = (entry) => {
+    if (!trigger) return;
+    const text = `${trigger.char}${entry.name} `;
+    setTokens((t) => t.includes(`${trigger.char}${entry.name}`) ? t : [...t, `${trigger.char}${entry.name}`]);
+    const end = trigger.start + 1 + trigger.query.length;
+    setValue(value.slice(0, trigger.start) + text + value.slice(end));
+    setCaret(trigger.start + text.length);
+    if (entry.command) onCommand?.(entry.command);
+    if (entry.mention) onMention?.(entry.mention);
+  };
+  const send = () => {
+    if (canQueue) {
+      onQueue?.(value.trim(), attachments);
+      setValue("");
+      setTokens([]);
+      return;
+    }
+    if (!canSend) return;
+    onSend(value.trim(), attachments);
+    setValue("");
+    setTokens([]);
+  };
+  const active = showStop || canSend || canQueue;
+  const slop = Math.max(0, (theme.hit.lg - theme.ctl.lg) / 2);
+  return /* @__PURE__ */ jsxs(View, { style: [styles.root, style], children: [
+    menuOpen && trigger ? /* @__PURE__ */ jsx(ChatSlashMenu, { entries, query: trigger.query, onPick: pick, labels }) : null,
+    /* @__PURE__ */ jsxs(View, { style: [styles.box, focused && styles.boxFocused, disabled && styles.disabled], children: [
+      full ? /* @__PURE__ */ jsx(Band, { icon: "alert-circle", iconColor: theme.color.dangerOnSoft, title: labels.chatFull, children: context?.onNewChat ? /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", onPress: context.onNewChat, children: labels.startNewChat }) : null }) : null,
+      voiceStatus === "blocked" ? /* @__PURE__ */ jsx(Band, { icon: "mic-off", iconColor: theme.color.warnOnSoft, title: labels.micOff, children: voice?.onHelp ? /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", onPress: voice.onHelp, children: labels.openSettings }) : null }) : null,
+      approvals && approvals.count > 0 ? /* @__PURE__ */ jsx(Band, { icon: "shield", iconColor: theme.color.accentOnSoft, title: labels.toolsWaiting(approvals.count), children: /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", onPress: approvals.onReview, children: labels.review }) }) : null,
+      queue.length > 0 ? /* @__PURE__ */ jsxs(View, { accessibilityLabel: labels.queued, role: "list", children: [
+        queue.slice(0, 3).map((q) => /* @__PURE__ */ jsx(View, { role: "listitem", children: /* @__PURE__ */ jsxs(Band, { icon: "clock", quote: q.text, children: [
+          !running && onSendQueued ? /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", onPress: () => onSendQueued(q.id), children: labels.sendNow }) : null,
+          onEditQueued || onRemoveQueued ? /* @__PURE__ */ jsx(
+            ToolButton,
+            {
+              icon: "more-horizontal",
+              label: labels.more,
+              size: "xs",
+              onPress: () => setMenuFor(q.id)
+            }
+          ) : null
+        ] }) }, q.id)),
+        queue.length > 3 ? /* @__PURE__ */ jsx(View, { style: styles.moreQueued, role: "listitem", children: /* @__PURE__ */ jsx(Text, { style: styles.moreQueuedText, children: labels.moreQueued(queue.length - 3) }) }) : null
+      ] }) : null,
+      replyTo ? /* @__PURE__ */ jsx(
+        ReplyBar,
+        {
+          reply: replyTo,
+          animate,
+          onCancel: onCancelReply,
+          labels
+        },
+        replyTo.text
+      ) : null,
+      attachments.length > 0 ? /* @__PURE__ */ jsx(
+        ScrollView,
+        {
+          horizontal: true,
+          showsHorizontalScrollIndicator: false,
+          contentContainerStyle: styles.chips,
+          children: attachments.map((a) => /* @__PURE__ */ jsx(
+            AttachmentChip,
+            {
+              attachment: a,
+              onRemove: onRemoveAttachment ? () => onRemoveAttachment(a.id) : void 0,
+              labels
+            },
+            a.id
+          ))
+        }
+      ) : null,
+      recording ? /* @__PURE__ */ jsx(Text, { style: [styles.input, styles.listening], children: labels.listening }) : transcribing ? /* @__PURE__ */ jsx(View, { style: [styles.input, styles.transcribing], children: /* @__PURE__ */ jsx(Thinking, { size: "sm", label: labels.transcribing }) }) : null,
+      /* @__PURE__ */ jsxs(View, { style: [(recording || transcribing) && styles.hidden], children: [
+        tokens.length ? /* @__PURE__ */ jsx(ComposerTokens, { value, tokens, maxRows, scrollY }) : null,
+        /* @__PURE__ */ jsx(
+          TextInput,
+          {
+            ref: inputRef,
+            accessibilityLabel: label,
+            placeholder,
+            placeholderTextColor: theme.color.text3,
+            editable: !disabled && !full,
+            accessibilityState: { disabled: !!disabled },
+            "aria-disabled": disabled || void 0,
+            multiline: true,
+            value,
+            onChangeText: (t) => {
+              setValue(t);
+              if (commands || mentions) setCaret(null);
+            },
+            onSelectionChange: commands || mentions ? (e) => setCaret(e.nativeEvent.selection.end) : void 0,
+            onScroll: tokens.length ? (e) => (
+              // Native reports contentOffset; react-native-web hands over the DOM event.
+              setScrollY(
+                e.nativeEvent.contentOffset?.y ?? e.target.scrollTop ?? 0
+              )
+            ) : void 0,
+            onFocus: () => setFocused(true),
+            onBlur: () => setFocused(false),
+            onKeyPress: (e) => {
+              if (e.nativeEvent.key === "Escape" && menuOpen && trigger) setDismissed(trigger.start);
+              if (e.nativeEvent.key === "ArrowUp" && value === "" && recall) setValue(recall);
+            },
+            style: [
+              styles.input,
+              { maxHeight: theme.type.body.lineHeight * maxRows }
+            ]
+          }
+        )
+      ] }),
+      recording ? /* @__PURE__ */ jsx(VoiceBar, { voice, labels }) : /* @__PURE__ */ jsxs(View, { style: styles.bar, children: [
+        onAttach ? /* @__PURE__ */ jsx(
+          ToolButton,
+          {
+            icon: "paperclip",
+            label: labels.attachFiles,
+            disabled,
+            onPress: () => onAttach(accept)
+          }
+        ) : null,
+        voice ? /* @__PURE__ */ jsx(
+          ToolButton,
+          {
+            icon: voiceStatus === "blocked" ? "mic-off" : "mic",
+            label: labels.dictate,
+            disabled: disabled || transcribing || voiceStatus === "blocked" || !voice.onStart,
+            onPress: () => {
+              haptics.impact("light");
+              voice.onStart?.();
+            }
+          }
+        ) : null,
+        toolbar,
+        /* @__PURE__ */ jsx(View, { style: styles.spacer }),
+        context ? /* @__PURE__ */ jsx(ContextMeter, { context, labels }) : null,
+        /* @__PURE__ */ jsxs(
+          Pressable,
+          {
+            accessibilityRole: "button",
+            accessibilityLabel: showStop ? labels.stop : labels.send,
+            accessibilityState: { disabled: !active },
+            disabled: !active,
+            onPress: showStop ? onStop : send,
+            hitSlop: slop,
+            style: [styles.send, !active && styles.sendIdle],
+            children: [
+              /* @__PURE__ */ jsx(
+                Animated.View,
+                {
+                  style: [
+                    styles.glyph,
+                    {
+                      opacity: swap.interpolate({ inputRange: [0, 1], outputRange: [1, 0] }),
+                      transform: [
+                        { scale: swap.interpolate({ inputRange: [0, 1], outputRange: [1, 0.5] }) }
+                      ]
+                    }
+                  ],
+                  children: /* @__PURE__ */ jsx(Icon, { name: "arrow-up", size: theme.ctl.icon.lg, color: theme.color.accentInk })
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Animated.View,
+                {
+                  style: [
+                    styles.glyph,
+                    {
+                      opacity: swap,
+                      transform: [
+                        { scale: swap.interpolate({ inputRange: [0, 1], outputRange: [0.5, 1] }) }
+                      ]
+                    }
+                  ],
+                  children: /* @__PURE__ */ jsx(Icon, { name: "stop", size: theme.ctl.icon.md, color: theme.color.accentInk })
+                }
+              )
+            ]
+          }
+        )
+      ] })
+    ] }),
+    menuFor !== null ? /* @__PURE__ */ jsxs(Sheet, { open: true, title: labels.queued, onClose: () => setMenuFor(null), children: [
+      onEditQueued ? /* @__PURE__ */ jsx(
+        SheetRow,
+        {
+          icon: "edit",
+          label: labels.editQueued,
+          onPress: () => {
+            const id = menuFor;
+            setMenuFor(null);
+            onEditQueued(id);
+          }
+        }
+      ) : null,
+      onRemoveQueued ? /* @__PURE__ */ jsx(
+        SheetRow,
+        {
+          icon: "x",
+          label: labels.removeQueued,
+          destructive: true,
+          onPress: () => {
+            const id = menuFor;
+            setMenuFor(null);
+            onRemoveQueued(id);
+          }
+        }
+      ) : null
+    ] }) : null,
+    hint ? /* @__PURE__ */ jsx(Text, { style: styles.hint, children: hint }) : null
+  ] });
+}
+function ReplyBar({
+  reply,
+  animate,
+  onCancel,
+  labels
+}) {
+  const arrival = useArrival(animate, "card");
+  return /* @__PURE__ */ jsx(Animated.View, { style: arrival, role: "group", accessibilityLabel: labels.replyingTo(reply.author), children: /* @__PURE__ */ jsx(Band, { icon: "reply", title: labels.replyingTo(reply.author), small: true, quote: reply.text, children: onCancel ? /* @__PURE__ */ jsx(ToolButton, { icon: "x", label: labels.cancelReply, size: "xs", onPress: onCancel }) : null }) });
+}
+function Band({
+  icon,
+  iconColor,
+  title,
+  small = false,
+  quote,
+  children
+}) {
+  const { styles } = useStyles(sheet3);
+  const theme = useLoamTheme("chat");
+  return /* @__PURE__ */ jsxs(View, { style: styles.band, children: [
+    /* @__PURE__ */ jsx(Icon, { name: icon, size: theme.icon.sm, color: iconColor ?? theme.color.text2 }),
+    /* @__PURE__ */ jsxs(View, { style: styles.bandBody, children: [
+      title ? /* @__PURE__ */ jsx(Text, { style: small ? styles.replyAuthor : styles.bandTitle, numberOfLines: 1, children: title }) : null,
+      quote ? /* @__PURE__ */ jsx(Text, { style: small ? styles.replyText : styles.bandQuote, numberOfLines: 1, children: quote }) : null
+    ] }),
+    children ? /* @__PURE__ */ jsx(View, { style: styles.bandActions, children }) : null
+  ] });
+}
+function ToolButton({
+  icon,
+  label,
+  onPress,
+  disabled = false,
+  size = "lg",
+  selected = false,
+  variant = "ghost",
+  children
+}) {
+  const { styles } = useStyles(sheet3);
+  const theme = useLoamTheme("chat");
+  const box = theme.ctl[size];
+  const slop = Math.max(0, (theme.hit[size] - box) / 2);
+  const primary = variant === "primary";
+  return /* @__PURE__ */ jsxs(
+    Pressable,
+    {
+      accessibilityRole: "button",
+      accessibilityLabel: label,
+      accessibilityState: { disabled, selected },
+      disabled,
+      onPress,
+      hitSlop: slop,
+      style: ({ pressed }) => [
+        styles.tool,
+        { minWidth: box, height: box, borderRadius: theme.ctl.r[size] },
+        primary && styles.toolPrimary,
+        selected && styles.toolSelected,
+        pressed && !primary && styles.toolDown,
+        disabled && styles.disabled
+      ],
+      children: [
+        children,
+        icon ? /* @__PURE__ */ jsx(Icon, { name: icon, size: theme.ctl.icon[size], color: primary ? theme.color.accentInk : theme.color.text2 }) : null
+      ]
+    }
+  );
+}
+function SheetRow({
+  icon,
+  label,
+  destructive = false,
+  onPress
+}) {
+  const { styles } = useStyles(sheet3);
+  const theme = useLoamTheme("chat");
+  const color = destructive ? theme.color.danger : theme.color.text;
+  return /* @__PURE__ */ jsxs(
+    Pressable,
+    {
+      accessibilityRole: "button",
+      accessibilityLabel: label,
+      onPress,
+      style: ({ pressed }) => [styles.sheetRow, pressed && styles.toolDown],
+      children: [
+        /* @__PURE__ */ jsx(Icon, { name: icon, size: theme.icon.sm, color: destructive ? color : theme.color.text2 }),
+        /* @__PURE__ */ jsx(Text, { style: [styles.sheetRowText, { color }], children: label })
+      ]
+    }
+  );
+}
+function VoiceBar({
+  voice,
+  labels
+}) {
+  const { styles } = useStyles(sheet3);
+  const elapsed = useElapsed(voice?.startedAt, true);
+  return /* @__PURE__ */ jsxs(View, { style: styles.bar, testID: "chat-voice-bar", children: [
+    /* @__PURE__ */ jsx(ToolButton, { icon: "x", label: labels.cancelRecording, onPress: voice?.onCancel }),
+    /* @__PURE__ */ jsx(View, { style: styles.dotSlot, accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", children: /* @__PURE__ */ jsx(View, { style: styles.dot }) }),
+    /* @__PURE__ */ jsx(Text, { style: styles.timer, accessibilityRole: "timer", children: formatRecordingTime(elapsed) }),
+    /* @__PURE__ */ jsx(View, { style: styles.wave, children: /* @__PURE__ */ jsx(LevelMeter, { level: voice?.level ?? 0, size: 24, bars: 48, showStatus: false }) }),
+    /* @__PURE__ */ jsx(
+      ToolButton,
+      {
+        icon: "check",
+        variant: "primary",
+        label: labels.doneRecording,
+        onPress: () => {
+          haptics.impact("light");
+          voice?.onDone?.();
+        }
+      }
+    )
+  ] });
+}
+function compactTokens(n) {
+  if (n >= 1e6) return `${Math.round(n / 1e5) / 10}M`;
+  if (n >= 1e3) return `${Math.round(n / 1e3)}k`;
+  return String(n);
+}
+var RING = 16;
+var RING_STROKE = 2;
+function ContextMeter({
+  context,
+  labels
+}) {
+  const { styles } = useStyles(sheet3);
+  const theme = useLoamTheme("chat");
+  const [open, setOpen] = React10.useState(false);
+  const ratio = context.total > 0 ? Math.min(1, Math.max(0, context.used / context.total)) : 0;
+  const pct = Math.round(ratio * 100);
+  const arc = pct >= 90 ? theme.color.danger : pct >= 75 ? theme.color.warn : theme.color.text2;
+  const tone = pct >= 90 ? "danger" : pct >= 75 ? "warn" : "neutral";
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(ToolButton, { label: labels.contextUsed(pct), selected: open, onPress: () => setOpen(true), children: [
+      pct >= 90 ? /* @__PURE__ */ jsxs(Text, { style: [styles.count, pct >= 100 && { color: theme.color.dangerOnSoft }], children: [
+        pct,
+        "%"
+      ] }) : null,
+      /* @__PURE__ */ jsx(Ring, { ratio, color: arc, track: theme.color.borderStrong })
+    ] }),
+    /* @__PURE__ */ jsx(Sheet, { open: open || !!context.open, title: labels.context, onClose: () => setOpen(false), children: /* @__PURE__ */ jsxs(View, { style: styles.contextBody, children: [
+      /* @__PURE__ */ jsxs(View, { style: styles.contextHead, children: [
+        /* @__PURE__ */ jsx(Text, { style: styles.contextTitle, children: pct >= 100 ? labels.chatFull : labels.chatAlmostFull }),
+        /* @__PURE__ */ jsxs(Text, { style: styles.count, children: [
+          compactTokens(context.used),
+          " / ",
+          compactTokens(context.total)
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(Progress, { value: pct, max: 100, size: "sm", tone, accessibilityLabel: labels.contextUsed(pct) }),
+      /* @__PURE__ */ jsx(Text, { style: styles.contextExplain, children: labels.contextExplain }),
+      /* @__PURE__ */ jsxs(View, { style: styles.contextActions, children: [
+        context.onSummarise ? /* @__PURE__ */ jsx(
+          Button,
+          {
+            fullWidth: true,
+            onPress: () => {
+              setOpen(false);
+              context.onSummarise?.();
+            },
+            children: labels.newChatWithSummary
+          }
+        ) : null,
+        /* @__PURE__ */ jsx(Button, { variant: "outline", fullWidth: true, onPress: () => setOpen(false), children: labels.keepGoing })
+      ] })
+    ] }) })
+  ] });
+}
+function Ring({ ratio, color, track }) {
+  const deg = ratio * 360;
+  const half = RING / 2;
+  const circle = {
+    position: "absolute",
+    width: RING,
+    height: RING,
+    borderRadius: half,
+    borderWidth: RING_STROKE
+  };
+  const halfArc = (side, sweep) => /* @__PURE__ */ jsx(
+    View,
+    {
+      style: {
+        position: "absolute",
+        width: half,
+        height: RING,
+        overflow: "hidden",
+        [side === "right" ? "right" : "left"]: 0
+      },
+      children: /* @__PURE__ */ jsx(
+        View,
+        {
+          style: [
+            circle,
+            side === "right" ? { right: 0 } : { left: 0 },
+            {
+              borderColor: "transparent",
+              [side === "right" ? "borderTopColor" : "borderBottomColor"]: color,
+              [side === "right" ? "borderRightColor" : "borderLeftColor"]: color,
+              transform: [{ rotate: `${sweep - 135}deg` }]
+            }
+          ]
+        }
+      )
+    }
+  );
+  return /* @__PURE__ */ jsxs(View, { testID: "chat-context-ring", style: { width: RING, height: RING }, children: [
+    /* @__PURE__ */ jsx(View, { style: [circle, { borderColor: track }] }),
+    deg > 0 ? halfArc("right", Math.min(180, deg)) : null,
+    deg > 180 ? halfArc("left", deg - 180) : null
+  ] });
+}
+var sheet3 = createStyleSheet((theme) => ({
+  root: { gap: theme.space.s2 },
+  band: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s2,
+    minHeight: theme.hit.sm,
+    paddingVertical: theme.space[6],
+    paddingStart: theme.space[14],
+    paddingEnd: theme.space[5],
+    borderBottomWidth: theme.borderWidth.base,
+    borderBottomColor: theme.color.border
+  },
+  bandBody: { flex: 1, minWidth: 0 },
+  bandActions: { flexDirection: "row", alignItems: "center", gap: theme.space.s1 },
+  bandTitle: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.subheadline.fontSize,
+    lineHeight: theme.type.subheadline.lineHeight,
+    fontWeight: theme.fontWeight.semibold,
+    color: theme.color.text
+  },
+  bandQuote: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.subheadline.fontSize,
+    lineHeight: theme.type.subheadline.lineHeight,
+    color: theme.color.text
+  },
+  replyAuthor: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.caption1.fontSize,
+    lineHeight: theme.type.caption1.lineHeight,
+    fontWeight: theme.fontWeight.semibold,
+    color: theme.color.text2
+  },
+  replyText: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    lineHeight: theme.type.footnote.lineHeight,
+    color: theme.color.text
+  },
+  moreQueued: {
+    minHeight: theme.hit.sm,
+    justifyContent: "center",
+    paddingStart: theme.space[38],
+    borderBottomWidth: theme.borderWidth.base,
+    borderBottomColor: theme.color.border
+  },
+  moreQueuedText: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    fontWeight: theme.fontWeight.medium,
+    color: theme.color.text2
+  },
+  box: {
+    overflow: "hidden",
+    borderRadius: theme.radius[12],
+    borderWidth: theme.borderWidth.strong,
+    borderColor: theme.color.borderStrong,
+    backgroundColor: theme.color.surface2
+  },
+  boxFocused: { borderColor: theme.focus.ringColor, backgroundColor: theme.color.surface },
+  disabled: { opacity: theme.state.disabledOpacity },
+  hidden: { display: "none" },
+  tokens: {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    right: 0,
+    overflow: "hidden",
+    pointerEvents: "none"
+  },
+  tokenText: { color: "transparent" },
+  // loam-contrast-ignore — transparent-text highlight mirrored behind the input; a border would offset the glyph overlay.
+  token: {
+    backgroundColor: theme.color.accentSoft,
+    color: "transparent"
+  },
+  chips: { gap: theme.space.s2, paddingHorizontal: theme.space[14], paddingTop: theme.space[10] },
+  input: {
+    minHeight: theme.type.body.lineHeight + theme.space[14],
+    maxHeight: theme.type.body.lineHeight * 8,
+    paddingHorizontal: theme.space[14],
+    paddingTop: theme.space[10],
+    paddingBottom: theme.space.s1,
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.body.fontSize,
+    lineHeight: theme.type.body.lineHeight,
+    color: theme.color.text,
+    textAlignVertical: "top"
+  },
+  listening: { color: theme.color.text3 },
+  transcribing: { flexDirection: "row", alignItems: "center" },
+  bar: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s1,
+    // lg 44 pieces (Final 12 iOS / Android "composer lg 44"; Refinement 37 F55
+    // supersedes the sm 30 bar of Refinement 26 / the web row on native).
+    minHeight: theme.ctl.lg + theme.space[10],
+    paddingHorizontal: theme.space[5]
+  },
+  spacer: { flex: 1 },
+  tool: {
+    flexDirection: "row",
+    gap: theme.space[6],
+    paddingHorizontal: theme.space[7],
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  toolPrimary: { backgroundColor: theme.color.accent },
+  toolSelected: { backgroundColor: theme.state.selected },
+  toolDown: { backgroundColor: theme.state.pressed },
+  send: {
+    width: theme.ctl.lg,
+    height: theme.ctl.lg,
+    borderRadius: theme.radius.full,
+    backgroundColor: theme.color.accent,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  // Button's disabled state: a dim, never a repaint (R5).
+  sendIdle: { opacity: theme.state.disabledOpacity },
+  glyph: { position: "absolute" },
+  dotSlot: { width: theme.ctl.sm, height: theme.ctl.sm, alignItems: "center", justifyContent: "center" },
+  dot: {
+    width: theme.space[8],
+    height: theme.space[8],
+    borderRadius: theme.radius[4],
+    backgroundColor: theme.color.danger,
+    // The 3 px danger-soft halo of the live dot.
+    borderWidth: 0,
+    boxShadow: `0 0 0 ${theme.space[3]}px ${theme.color.dangerSoft}`
+  },
+  timer: {
+    fontFamily: theme.font.mono,
+    fontSize: theme.type.caption1.fontSize,
+    fontWeight: theme.fontWeight.medium,
+    fontVariant: ["tabular-nums"],
+    color: theme.color.text
+  },
+  wave: { flex: 1, minWidth: 0, marginHorizontal: theme.space.s2, overflow: "hidden", alignItems: "flex-end" },
+  count: {
+    fontFamily: theme.font.mono,
+    fontSize: theme.type.caption1.fontSize,
+    fontWeight: theme.fontWeight.medium,
+    fontVariant: ["tabular-nums"],
+    color: theme.color.text2
+  },
+  contextBody: { gap: theme.space[12], paddingBottom: theme.space.s4 },
+  contextHead: { flexDirection: "row", alignItems: "baseline", justifyContent: "space-between", gap: theme.space.s2 },
+  contextTitle: {
+    flex: 1,
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.subheadline.fontSize,
+    lineHeight: theme.type.subheadline.lineHeight,
+    fontWeight: theme.fontWeight.semibold,
+    color: theme.color.text
+  },
+  contextExplain: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    lineHeight: theme.type.footnote.lineHeight,
+    color: theme.color.text2
+  },
+  contextActions: { gap: theme.space.s2, marginTop: theme.space.s1 },
+  sheetRow: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space[12],
+    minHeight: theme.space[48],
+    paddingHorizontal: theme.space[12],
+    borderRadius: theme.radius[12]
+  },
+  sheetRowText: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.subheadline.fontSize,
+    lineHeight: theme.type.subheadline.lineHeight
+  },
+  hint: {
+    textAlign: "center",
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.caption1.fontSize,
+    lineHeight: theme.type.caption1.lineHeight,
+    color: theme.color.text2
+  }
+}));
+function ComposerTokens({
+  value,
+  tokens,
+  maxRows,
+  scrollY
+}) {
+  const { styles } = useStyles(sheet3);
+  const theme = useLoamTheme("chat");
+  const escaped = tokens.map((t) => t.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")).sort((a, b) => b.length - a.length);
+  const re = new RegExp(`(^|\\s)(${escaped.join("|")})(?=\\s|$)`, "g");
+  const out = [];
+  let last = 0;
+  for (const m of value.matchAll(re)) {
+    const start = (m.index ?? 0) + m[1].length;
+    if (start > last) out.push(value.slice(last, start));
+    out.push(
+      /* @__PURE__ */ jsx(Text, { testID: "chat-token", style: styles.token, children: m[2] }, start)
+    );
+    last = start + m[2].length;
+  }
+  out.push(value.slice(last));
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      "aria-hidden": true,
+      importantForAccessibility: "no-hide-descendants",
+      testID: "chat-tokens",
+      style: [styles.tokens, { maxHeight: theme.type.body.lineHeight * maxRows }],
+      children: /* @__PURE__ */ jsx(Text, { style: [styles.input, styles.tokenText, { maxHeight: void 0, transform: [{ translateY: -scrollY }] }], children: out })
+    }
+  );
+}
+function StepTile({ icon, tone }) {
+  const { styles } = useStyles(sheet4);
+  const theme = useLoamTheme("chat");
+  const color = tone === "warn" ? theme.color.warnOnSoft : tone === "accent" ? theme.color.accentOnSoft : theme.color.text2;
+  return /* @__PURE__ */ jsx(View, { style: [styles.tile, styles[`tile_${tone}`]], children: /* @__PURE__ */ jsx(Icon, { name: icon, size: theme.icon.xs, color }) });
+}
+function ApprovalView({
+  part,
+  animate,
+  onAnswer,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet4);
+  const theme = useLoamTheme("chat");
+  const arrival = useArrival(animate && (part.status ?? "pending") === "pending", "card");
+  const status = part.status ?? "pending";
+  const [always, setAlways] = React10.useState(false);
+  const icon = part.icon ?? "wrench";
+  if (status !== "pending") {
+    return /* @__PURE__ */ jsxs(View, { style: styles.step, children: [
+      /* @__PURE__ */ jsx(StepTile, { icon, tone: "neutral" }),
+      /* @__PURE__ */ jsxs(View, { style: styles.stepBody, children: [
+        /* @__PURE__ */ jsxs(View, { style: styles.stepHead, children: [
+          /* @__PURE__ */ jsx(Text, { style: styles.stepTitle, numberOfLines: 1, children: part.title }),
+          status === "expired" ? /* @__PURE__ */ jsx(Badge, { variant: "neutral", size: "sm", children: labels.expired }) : /* @__PURE__ */ jsx(
+            Icon,
+            {
+              name: status === "allowed" ? "check" : "x",
+              size: theme.icon.xs,
+              color: status === "allowed" ? theme.color.good : theme.color.danger,
+              accessibilityLabel: status === "allowed" ? labels.allowed : labels.denied
+            }
+          )
+        ] }),
+        part.detail ? /* @__PURE__ */ jsx(Text, { style: styles.meta, children: part.detail }) : null
+      ] })
+    ] });
+  }
+  const warn = !!part.destructive;
+  return /* @__PURE__ */ jsxs(Animated.View, { style: [styles.pending, arrival], children: [
+    /* @__PURE__ */ jsxs(View, { style: styles.step, children: [
+      /* @__PURE__ */ jsx(StepTile, { icon, tone: warn ? "warn" : "accent" }),
+      /* @__PURE__ */ jsxs(View, { style: [styles.stepHead, styles.stepBody], children: [
+        /* @__PURE__ */ jsx(Text, { style: styles.stepTitle, numberOfLines: 1, children: part.title }),
+        /* @__PURE__ */ jsx(Badge, { variant: warn ? "warn" : "accent", size: "sm", outline: true, children: labels.needsApproval })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs(
+      View,
+      {
+        role: "group",
+        accessibilityLabel: part.tool,
+        style: [styles.card, warn ? styles.cardWarn : styles.cardAccent],
+        children: [
+          /* @__PURE__ */ jsxs(View, { style: styles.band, children: [
+            /* @__PURE__ */ jsx(
+              Icon,
+              {
+                name: icon,
+                size: theme.icon.sm,
+                color: warn ? theme.color.warnOnSoft : theme.color.accentOnSoft
+              }
+            ),
+            /* @__PURE__ */ jsx(Text, { style: styles.tool, children: part.tool }),
+            part.target ? /* @__PURE__ */ jsx(Text, { style: styles.target, numberOfLines: 1, children: part.target }) : null
+          ] }),
+          part.args?.length ? /* @__PURE__ */ jsx(View, { style: styles.args, children: part.args.map((a) => /* @__PURE__ */ jsxs(View, { style: styles.arg, children: [
+            /* @__PURE__ */ jsx(Text, { style: styles.argKey, children: a.key }),
+            /* @__PURE__ */ jsx(Text, { style: styles.argValue, children: a.value })
+          ] }, a.key)) }) : null,
+          /* @__PURE__ */ jsx(View, { style: styles.always, children: /* @__PURE__ */ jsx(
+            Checkbox,
+            {
+              label: labels.alwaysAllow,
+              checked: always,
+              onCheckedChange: setAlways,
+              size: "md"
+            }
+          ) }),
+          /* @__PURE__ */ jsxs(View, { style: styles.decide, children: [
+            /* @__PURE__ */ jsx(View, { style: styles.decideCell, children: /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "outline",
+                size: "lg",
+                fullWidth: true,
+                disabled: !onAnswer,
+                onPress: () => onAnswer?.({ allow: false, always }),
+                children: labels.deny
+              }
+            ) }),
+            /* @__PURE__ */ jsx(View, { style: styles.decideCell, children: /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "primary",
+                size: "lg",
+                fullWidth: true,
+                disabled: !onAnswer,
+                leadingIcon: warn ? "alert-triangle" : void 0,
+                onPress: () => onAnswer?.({ allow: true, always }),
+                children: part.allowLabel ?? labels.allow
+              }
+            ) })
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+function CitationMark({
+  n,
+  source,
+  active,
+  onOpen,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet4);
+  const theme = useLoamTheme("chat");
+  const gone = !source || source.unavailable;
+  const slop = Math.max(0, (theme.tapMin - theme.space[20]) / 2);
+  return /* @__PURE__ */ jsx(
+    Pressable,
+    {
+      accessibilityRole: "button",
+      accessibilityLabel: gone ? `${labels.source(n)}, ${labels.sourceUnavailable}` : labels.source(n),
+      accessibilityState: { disabled: !!gone, selected: active },
+      disabled: !!gone,
+      hitSlop: slop,
+      onPress: () => source && onOpen?.(source),
+      style: [styles.marker, active && styles.markerActive, !!gone && styles.markerGone],
+      children: /* @__PURE__ */ jsx(Text, { style: [styles.markerText, !!gone && styles.struck], children: n })
+    }
+  );
+}
+var VISIBLE_SOURCES = 4;
+function SourcesRow({
+  sources,
+  onOpen,
+  onOpenAll,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet4);
+  const shown = sources.slice(0, VISIBLE_SOURCES);
+  const rest = sources.length - shown.length;
+  return /* @__PURE__ */ jsxs(View, { accessibilityLabel: labels.sources, role: "list", style: styles.chips, children: [
+    shown.map((s, i) => /* @__PURE__ */ jsx(View, { role: "listitem", children: /* @__PURE__ */ jsx(
+      Chip,
+      {
+        variant: "suggestion",
+        size: "sm",
+        disabled: s.unavailable,
+        onPress: () => onOpen(s),
+        accessibilityLabel: `${i + 1} ${s.unavailable ? labels.sourceUnavailable : s.domain ?? s.title}`,
+        children: `${i + 1}  ${s.unavailable ? labels.sourceUnavailable : s.domain ?? s.title}`
+      }
+    ) }, s.id)),
+    rest > 0 ? /* @__PURE__ */ jsx(View, { role: "listitem", children: /* @__PURE__ */ jsx(
+      Chip,
+      {
+        variant: "suggestion",
+        size: "sm",
+        accessibilityLabel: labels.moreSources(rest),
+        onPress: onOpenAll,
+        children: `+${rest}`
+      }
+    ) }) : null
+  ] });
+}
+function Snippet({ text, quote }) {
+  const { styles } = useStyles(sheet4);
+  const at = quote ? text.indexOf(quote) : -1;
+  if (!quote || at === -1) return /* @__PURE__ */ jsx(Text, { style: styles.snippet, children: text });
+  return /* @__PURE__ */ jsxs(Text, { style: styles.snippet, children: [
+    text.slice(0, at),
+    /* @__PURE__ */ jsx(Text, { style: styles.quote, children: quote }),
+    text.slice(at + quote.length)
+  ] });
+}
+function SourcesSheet({
+  open,
+  sources,
+  active,
+  onClose,
+  onOpenSource,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet4);
+  const theme = useLoamTheme("chat");
+  if (!open) return null;
+  return /* @__PURE__ */ jsx(Sheet, { open: true, title: `${labels.sources} ${sources.length}`, onClose, closeLabel: labels.close, children: /* @__PURE__ */ jsx(View, { role: "list", accessibilityLabel: `${labels.sources} ${sources.length}`, style: styles.sourceList, children: sources.map((s, i) => {
+    const chosen = active === s.id;
+    return /* @__PURE__ */ jsxs(View, { role: "listitem", children: [
+      /* @__PURE__ */ jsxs(
+        Pressable,
+        {
+          accessibilityRole: "button",
+          accessibilityLabel: `${i + 1}. ${s.title}${s.unavailable ? `, ${labels.sourceUnavailable}` : ""}`,
+          accessibilityState: { disabled: !!s.unavailable, selected: chosen },
+          disabled: s.unavailable,
+          onPress: () => onOpenSource?.(s),
+          style: ({ pressed }) => [
+            styles.sourceRow,
+            chosen && styles.sourceChosen,
+            pressed && styles.down
+          ],
+          children: [
+            /* @__PURE__ */ jsx(Text, { style: styles.sourceNumber, children: i + 1 }),
+            /* @__PURE__ */ jsxs(View, { style: styles.sourceText, children: [
+              /* @__PURE__ */ jsx(
+                Text,
+                {
+                  numberOfLines: 1,
+                  style: [styles.sourceTitle, s.unavailable && styles.sourceGone],
+                  children: s.title
+                }
+              ),
+              /* @__PURE__ */ jsx(Text, { numberOfLines: 1, style: styles.meta, children: s.unavailable ? labels.sourceUnavailable : s.detail ?? s.domain })
+            ] }),
+            s.unavailable ? null : /* @__PURE__ */ jsx(Icon, { name: "external-link", size: theme.icon.sm, color: theme.color.text2 })
+          ]
+        }
+      ),
+      chosen && s.snippet ? /* @__PURE__ */ jsx(View, { style: styles.snippetBox, children: /* @__PURE__ */ jsx(Snippet, { text: s.snippet, quote: s.quote }) }) : null
+    ] }, s.id);
+  }) }) });
+}
+function SwitchButton({
+  icon,
+  label,
+  disabled,
+  onPress
+}) {
+  const { styles } = useStyles(sheet4);
+  const theme = useLoamTheme("chat");
+  return /* @__PURE__ */ jsx(
+    Pressable,
+    {
+      accessibilityRole: "button",
+      accessibilityLabel: label,
+      accessibilityState: { disabled },
+      disabled,
+      onPress,
+      hitSlop: (theme.hit.sm - theme.ctl.sm) / 2,
+      style: ({ pressed }) => [
+        styles.switchButton,
+        disabled && styles.switchOff,
+        pressed && styles.down
+      ],
+      children: /* @__PURE__ */ jsx(Icon, { name: icon, size: theme.ctl.icon.sm, color: theme.color.text2 })
+    }
+  );
+}
+function VersionSwitcher({
+  index,
+  count,
+  streaming,
+  onChange,
+  rule,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet4);
+  return /* @__PURE__ */ jsxs(View, { style: styles.switcher, children: [
+    /* @__PURE__ */ jsx(
+      SwitchButton,
+      {
+        icon: "chevron-left",
+        label: labels.previousVersion,
+        disabled: index <= 1 || !onChange,
+        onPress: () => onChange?.(index - 1)
+      }
+    ),
+    /* @__PURE__ */ jsx(Text, { accessibilityLiveRegion: "polite", style: styles.versionCount, children: labels.versionOf(index, count) }),
+    streaming ? /* @__PURE__ */ jsx(View, { style: styles.switchSlot, children: /* @__PURE__ */ jsx(Thinking, { label: "", size: "sm", announce: false }) }) : /* @__PURE__ */ jsx(
+      SwitchButton,
+      {
+        icon: "chevron-right",
+        label: labels.nextVersion,
+        disabled: index >= count || !onChange,
+        onPress: () => onChange?.(index + 1)
+      }
+    ),
+    rule ? /* @__PURE__ */ jsx(View, { accessibilityElementsHidden: true, style: styles.rule }) : null
+  ] });
+}
+var sheet4 = createStyleSheet((theme) => ({
+  pending: { gap: theme.space.s2 },
+  step: { flexDirection: "row", gap: theme.space.s3, paddingVertical: theme.space[6] },
+  stepBody: { flex: 1, minWidth: 0, gap: theme.space[2] },
+  stepHead: { flexDirection: "row", alignItems: "center", gap: theme.space.s2, minHeight: theme.space[26] },
+  stepTitle: {
+    flexShrink: 1,
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    lineHeight: theme.type.footnote.lineHeight,
+    color: theme.color.text
+  },
+  meta: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    lineHeight: theme.type.footnote.lineHeight,
+    color: theme.color.text2
+  },
+  tile: {
+    width: theme.space[22],
+    height: theme.space[22],
+    marginTop: theme.space[2],
+    borderRadius: theme.radius[6],
+    borderWidth: theme.borderWidth.base,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  tile_neutral: { borderColor: theme.color.border, backgroundColor: theme.color.surface3 },
+  tile_accent: { borderColor: theme.edge.accent, backgroundColor: theme.color.accentSoft },
+  tile_warn: { borderColor: theme.edge.warn, backgroundColor: theme.color.warnSoft },
+  card: {
+    overflow: "hidden",
+    borderRadius: theme.radius.lg,
+    borderWidth: theme.borderWidth.strong,
+    backgroundColor: theme.color.surface
+  },
+  cardAccent: { borderColor: theme.edge.accent },
+  cardWarn: { borderColor: theme.edge.warn },
+  // The 40 band, the same as a code block's.
+  band: {
+    height: theme.space[40],
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s2,
+    paddingHorizontal: theme.space[12],
+    borderBottomWidth: theme.borderWidth.base,
+    borderBottomColor: theme.color.border
+  },
+  tool: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    fontWeight: theme.fontWeight.semibold,
+    color: theme.color.text
+  },
+  target: {
+    flex: 1,
+    minWidth: 0,
+    fontFamily: theme.font.mono,
+    fontSize: theme.type.caption1.fontSize,
+    fontWeight: theme.fontWeight.medium,
+    color: theme.color.text2
+  },
+  args: { gap: theme.space[10], padding: theme.space[12] },
+  arg: { gap: theme.space[2] },
+  argKey: {
+    fontFamily: theme.font.mono,
+    fontSize: theme.type.caption1.fontSize,
+    fontWeight: theme.fontWeight.medium,
+    color: theme.color.text2
+  },
+  argValue: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.subheadline.fontSize,
+    lineHeight: theme.type.subheadline.lineHeight,
+    color: theme.color.text
+  },
+  always: {
+    minHeight: theme.space[48],
+    justifyContent: "center",
+    paddingHorizontal: theme.space[12],
+    borderTopWidth: theme.borderWidth.base,
+    borderTopColor: theme.color.border
+  },
+  decide: { flexDirection: "row", gap: theme.space.s2, padding: theme.space[8], paddingTop: 0 },
+  decideCell: { flex: 1 },
+  marker: {
+    minWidth: theme.space[20],
+    height: theme.space[20],
+    paddingHorizontal: theme.space[5],
+    marginHorizontal: theme.space[2],
+    borderRadius: theme.radius.xs,
+    // Final 12 "Marker": accent-soft / accent-on-soft (latest over Refinement 25's surface-3).
+    backgroundColor: theme.color.accentSoft,
+    borderWidth: theme.borderWidth.thin,
+    borderColor: theme.edge.accent,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  markerActive: { backgroundColor: theme.state.selected },
+  markerGone: { backgroundColor: theme.color.surface3 },
+  markerText: {
+    fontFamily: theme.font.mono,
+    fontSize: theme.type.caption1.fontSize,
+    lineHeight: theme.space[20],
+    fontWeight: theme.fontWeight.medium,
+    fontVariant: ["tabular-nums"],
+    color: theme.color.accentOnSoft
+  },
+  struck: { textDecorationLine: "line-through", color: theme.color.text2 },
+  chips: { flexDirection: "row", flexWrap: "wrap", gap: theme.space.s2 },
+  sourceList: { gap: theme.space[2], padding: theme.space[8] },
+  // 56 rows, r 12 inside the 8 pad of the r 24 sheet.
+  sourceRow: {
+    minHeight: theme.space[56],
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s3,
+    paddingHorizontal: theme.space[8],
+    borderRadius: theme.radius.md
+  },
+  sourceChosen: { backgroundColor: theme.state.selected },
+  down: { backgroundColor: theme.state.pressed },
+  sourceNumber: {
+    width: theme.space[20],
+    textAlign: "center",
+    fontFamily: theme.font.mono,
+    fontSize: theme.type.caption1.fontSize,
+    fontWeight: theme.fontWeight.medium,
+    color: theme.color.text2
+  },
+  sourceText: { flex: 1, minWidth: 0, gap: theme.space[2] },
+  sourceTitle: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.callout.fontSize,
+    lineHeight: theme.type.callout.lineHeight,
+    fontWeight: theme.fontWeight.medium,
+    color: theme.color.text
+  },
+  sourceGone: { textDecorationLine: "line-through", color: theme.color.text3 },
+  snippetBox: { paddingHorizontal: theme.space[44], paddingBottom: theme.space[8] },
+  snippet: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    lineHeight: theme.type.footnote.lineHeight,
+    color: theme.color.text2
+  },
+  quote: { backgroundColor: theme.state.selected, color: theme.color.text },
+  switcher: { flexDirection: "row", alignItems: "center" },
+  switchButton: {
+    width: theme.ctl.sm,
+    height: theme.ctl.sm,
+    borderRadius: theme.ctl.r.sm,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  switchOff: { opacity: theme.state.disabledOpacity },
+  switchSlot: {
+    width: theme.ctl.sm,
+    height: theme.ctl.sm,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  versionCount: {
+    minWidth: theme.space[52],
+    textAlign: "center",
+    fontFamily: theme.font.mono,
+    fontSize: theme.type.footnote.fontSize,
+    fontWeight: theme.fontWeight.medium,
+    fontVariant: ["tabular-nums"],
+    color: theme.color.text2
+  },
+  rule: {
+    width: theme.borderWidth.base,
+    height: theme.space[16],
+    marginHorizontal: theme.space[4],
+    backgroundColor: theme.color.borderStrong
+  }
+}));
+function ChatArtifactCard({
+  artifact,
+  onOpen,
+  open,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet5);
+  const theme = useLoamTheme("chat");
+  const meta = [artifact.kind, artifact.updated].filter(Boolean).join(" \xB7 ");
+  return /* @__PURE__ */ jsxs(
+    Pressable,
+    {
+      accessibilityRole: "button",
+      accessibilityLabel: labels.artifactName(artifact.title, artifact.kind),
+      accessibilityHint: labels.open,
+      accessibilityState: { selected: !!open },
+      onPress: onOpen,
+      style: ({ pressed }) => [styles.card, open && styles.cardOpen, pressed && styles.down],
+      children: [
+        /* @__PURE__ */ jsx(IconTile, { icon: artifact.icon ?? "file-text", tone: "accent", size: "md" }),
+        /* @__PURE__ */ jsxs(View, { style: styles.text, children: [
+          /* @__PURE__ */ jsx(Text, { numberOfLines: 1, style: styles.title, children: artifact.title }),
+          /* @__PURE__ */ jsx(Text, { numberOfLines: 1, style: styles.meta, children: meta })
+        ] }),
+        /* @__PURE__ */ jsx(Icon, { name: "chevron-right", size: theme.icon.sm, color: theme.color.text3 })
+      ]
+    }
+  );
+}
+function ChatArtifactSheet({
+  artifact,
+  open,
+  onClose,
+  onVersionChange,
+  onShare,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet5);
+  const [view, setView] = React10.useState("preview");
+  if (!open) return null;
+  const v = artifact.version;
+  return /* @__PURE__ */ jsxs(
+    Sheet,
+    {
+      open: true,
+      title: artifact.title,
+      onClose,
+      closeLabel: labels.close,
+      detents: ["full"],
+      initialDetent: "full",
+      footer: onShare ? /* @__PURE__ */ jsx(View, { style: styles.footer, children: /* @__PURE__ */ jsx(Button, { variant: "outline", size: "lg", fullWidth: true, leadingIcon: "share", onPress: () => onShare(artifact), children: labels.share }) }) : void 0,
+      children: [
+        /* @__PURE__ */ jsxs(View, { style: styles.bar, children: [
+          artifact.code != null ? /* @__PURE__ */ jsx(
+            SegmentedControl,
+            {
+              size: "sm",
+              accessibilityLabel: artifact.title,
+              items: [
+                { value: "preview", label: labels.preview },
+                { value: "code", label: labels.code }
+              ],
+              value: view,
+              onValueChange: (next) => setView(next)
+            }
+          ) : null,
+          v && v.count > 1 ? /* @__PURE__ */ jsx(
+            VersionSwitcher,
+            {
+              index: v.index,
+              count: v.count,
+              onChange: onVersionChange ? (i) => onVersionChange(artifact, i) : void 0,
+              labels
+            }
+          ) : null
+        ] }),
+        /* @__PURE__ */ jsx(View, { style: styles.body, children: view === "code" && artifact.code != null ? /* @__PURE__ */ jsx(ScrollView, { horizontal: true, tabIndex: 0, children: /* @__PURE__ */ jsx(Text, { selectable: true, style: styles.code, children: artifact.code }) }) : artifact.preview })
+      ]
+    }
+  );
+}
+var sheet5 = createStyleSheet((theme) => ({
+  card: {
+    minHeight: theme.space[56],
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s3,
+    paddingHorizontal: theme.space[12],
+    borderRadius: theme.radius.lg,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.color.border,
+    backgroundColor: theme.color.surface
+  },
+  cardOpen: { backgroundColor: theme.state.selected },
+  down: { backgroundColor: theme.state.pressed },
+  text: { flex: 1, minWidth: 0, gap: theme.space[2] },
+  title: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.callout.fontSize,
+    lineHeight: theme.type.callout.lineHeight,
+    fontWeight: theme.fontWeight.semibold,
+    color: theme.color.text
+  },
+  meta: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    lineHeight: theme.type.footnote.lineHeight,
+    color: theme.color.text2
+  },
+  bar: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    gap: theme.space.s3,
+    paddingHorizontal: theme.space[16],
+    paddingBottom: theme.space[8]
+  },
+  body: { padding: theme.space[16] },
+  footer: { padding: theme.space[16] },
+  code: {
+    fontFamily: theme.font.mono,
+    fontSize: theme.type.footnote.fontSize,
+    lineHeight: theme.type.footnote.lineHeight,
+    color: theme.color.text
+  }
+}));
+var COLUMN = 120;
+function ChatInlineTable({
+  part,
+  onExpand,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet6);
+  const total = part.total ?? part.rows.length;
+  return /* @__PURE__ */ jsxs(View, { style: styles.root, role: "group", accessibilityLabel: part.title, children: [
+    /* @__PURE__ */ jsxs(View, { style: styles.band, children: [
+      /* @__PURE__ */ jsx(Text, { numberOfLines: 1, style: styles.title, children: part.title }),
+      /* @__PURE__ */ jsx(Text, { style: styles.count, children: labels.rows(total) }),
+      onExpand ? /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onPress: () => onExpand(part), children: labels.expand }) : null
+    ] }),
+    /* @__PURE__ */ jsx(ScrollView, { horizontal: true, showsHorizontalScrollIndicator: false, tabIndex: 0, children: /* @__PURE__ */ jsxs(View, { role: "table", children: [
+      /* @__PURE__ */ jsx(View, { role: "row", style: [styles.row, styles.head], children: part.columns.map((c) => /* @__PURE__ */ jsx(
+        Text,
+        {
+          role: "columnheader",
+          style: [styles.cell, styles.headText, { width: c.width ?? COLUMN }, c.align === "end" && styles.end],
+          children: c.label
+        },
+        c.key
+      )) }),
+      part.rows.map((r, i) => /* @__PURE__ */ jsx(View, { role: "row", style: [styles.row, i > 0 && styles.ruled], children: part.columns.map((c) => /* @__PURE__ */ jsx(
+        Text,
+        {
+          role: "cell",
+          numberOfLines: 1,
+          style: [styles.cell, styles.cellText, { width: c.width ?? COLUMN }, c.align === "end" && styles.end],
+          children: r[c.key]
+        },
+        c.key
+      )) }, i))
+    ] }) })
+  ] });
+}
+var sheet6 = createStyleSheet((theme) => ({
+  root: {
+    overflow: "hidden",
+    borderRadius: theme.radius.lg,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.color.border,
+    backgroundColor: theme.color.surface
+  },
+  band: {
+    height: theme.space[40],
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s2,
+    paddingHorizontal: theme.space[12],
+    borderBottomWidth: theme.borderWidth.base,
+    borderBottomColor: theme.color.border
+  },
+  title: {
+    flex: 1,
+    minWidth: 0,
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    fontWeight: theme.fontWeight.semibold,
+    color: theme.color.text
+  },
+  count: {
+    fontFamily: theme.font.mono,
+    fontSize: theme.type.caption1.fontSize,
+    color: theme.color.text2
+  },
+  row: { flexDirection: "row", height: theme.space[44], alignItems: "center" },
+  head: { backgroundColor: theme.color.surface3 },
+  ruled: { borderTopWidth: theme.borderWidth.base, borderTopColor: theme.color.border },
+  cell: { paddingHorizontal: theme.space[12] },
+  end: { textAlign: "right" },
+  // Table header: footnote 13 / 600 on iOS, 12 / 500 on Android; cells at the subheadline.
+  headText: {
+    ...theme.type.footnote,
+    fontFamily: theme.font.sans,
+    fontWeight: theme.platform === "Android" ? theme.fontWeight.medium : theme.fontWeight.semibold,
+    color: theme.color.text2
+  },
+  cellText: {
+    ...theme.type.subheadline,
+    fontFamily: theme.font.sans,
+    color: theme.color.text
+  }
+}));
+
+// src/chat/chat-types.ts
+function chatMessageText(message) {
+  return message.parts.filter((p) => p.kind === "text").map((p) => p.text).join("\n\n").trim();
+}
+function AssistantMark() {
+  const { styles } = useStyles(sheet7);
+  const theme = useLoamTheme("chat");
+  return /* @__PURE__ */ jsx(View, { style: styles.mark, children: /* @__PURE__ */ jsx(Icon, { name: "sparkle", size: theme.icon.sm, color: theme.color.accentOnSoft }) });
+}
+function segment(parts) {
+  const out = [];
+  for (const part of parts) {
+    const last = out[out.length - 1];
+    if (part.kind === "tool") {
+      if (last?.kind === "tools") last.tools.push(part);
+      else out.push({ kind: "tools", id: part.id, tools: [part] });
+    } else out.push({ kind: "part", part });
+  }
+  return out;
+}
+function Action({
+  label,
+  icon,
+  onPress,
+  pressed
+}) {
+  const { styles } = useStyles(sheet7);
+  const theme = useLoamTheme("chat");
+  return /* @__PURE__ */ jsx(
+    Pressable,
+    {
+      accessibilityRole: "button",
+      accessibilityLabel: label,
+      accessibilityState: pressed != null ? { selected: pressed } : void 0,
+      "aria-pressed": pressed,
+      onPress,
+      hitSlop: (theme.hit.sm - theme.ctl.sm) / 2,
+      style: ({ pressed: down }) => [
+        styles.action,
+        pressed && styles.actionSelected,
+        down && styles.actionDown
+      ],
+      children: /* @__PURE__ */ jsx(Icon, { name: icon, size: theme.ctl.icon.sm, color: theme.color.text2 })
+    }
+  );
+}
+var REPLY_ARM = 56;
+function useSwipeReply(onReply, animate) {
+  const theme = useLoamTheme("chat");
+  const tx = React10.useRef(new Animated.Value(0)).current;
+  const live = React10.useRef({ onReply, animate, theme });
+  live.current = { onReply, animate, theme };
+  const state = React10.useRef({ armed: false, broke: false });
+  const sign = I18nManager.isRTL ? -1 : 1;
+  const pan = React10.useRef(
+    // One horizontal pull on a bubble inside a vertical list; no gesture
+    // library is allowed on native, so `PanResponder`, as `Toast` does.
+    // eslint-disable-next-line loam/no-pan-responder
+    PanResponder.create({
+      onMoveShouldSetPanResponder: (_e, g) => !!live.current.onReply && g.dx * sign > 8 && Math.abs(g.dx) > Math.abs(g.dy) * 1.5,
+      onPanResponderGrant: () => {
+        tx.stopAnimation();
+        state.current = { armed: false, broke: false };
+      },
+      onPanResponderMove: (_e, g) => {
+        const a = Math.max(0, g.dx * sign);
+        const s = state.current;
+        const armed = a >= REPLY_ARM;
+        if (armed && !s.armed) haptics.selection();
+        s.armed = armed;
+        if (a < BREAKAWAY && !s.broke) return tx.setValue(sign * resist(a));
+        const target = sign * (armed ? REPLY_ARM + rubberband(a - REPLY_ARM, REPLY_ARM * 4) : a);
+        if (!s.broke && live.current.animate) {
+          s.broke = true;
+          Animated.spring(tx, {
+            toValue: target,
+            ...springConfig(live.current.theme, "fs"),
+            useNativeDriver: true
+          }).start();
+          return;
+        }
+        s.broke = true;
+        tx.setValue(target);
+      },
+      onPanResponderRelease: (_e, g) => {
+        const { onReply: reply, animate: anim, theme: th } = live.current;
+        if (anim) {
+          Animated.spring(tx, {
+            toValue: 0,
+            ...springConfig(th, "fs", { velocity: g.vx }),
+            useNativeDriver: true
+          }).start();
+        } else tx.setValue(0);
+        if (state.current.armed) reply?.();
+        state.current.armed = false;
+      },
+      onPanResponderTerminate: () => {
+        state.current.armed = false;
+        tx.setValue(0);
+      }
+    })
+  ).current;
+  const reveal = tx.interpolate({
+    inputRange: sign > 0 ? [0, REPLY_ARM] : [-REPLY_ARM, 0],
+    outputRange: sign > 0 ? [0, 1] : [1, 0],
+    extrapolate: "clamp"
+  });
+  const cueScale = tx.interpolate({
+    inputRange: sign > 0 ? [0, REPLY_ARM - 0.01, REPLY_ARM] : [-REPLY_ARM, -REPLY_ARM + 0.01, 0],
+    outputRange: sign > 0 ? [0.5, 0.9, 1] : [1, 0.9, 0.5],
+    extrapolate: "clamp"
+  });
+  return { tx, panHandlers: onReply ? pan.panHandlers : {}, reveal, cueScale };
+}
+function SwipeReply({
+  onReply,
+  animate,
+  style,
+  children
+}) {
+  const { styles } = useStyles(sheet7);
+  const theme = useLoamTheme("chat");
+  const swipe = useSwipeReply(onReply, animate);
+  return /* @__PURE__ */ jsxs(View, { style, children: [
+    onReply ? /* @__PURE__ */ jsx(
+      Animated.View,
+      {
+        pointerEvents: "none",
+        importantForAccessibility: "no-hide-descendants",
+        accessibilityElementsHidden: true,
+        style: [
+          styles.replyCue,
+          { opacity: swipe.reveal, transform: [{ scale: swipe.cueScale }] }
+        ],
+        children: /* @__PURE__ */ jsx(Icon, { name: "reply", size: theme.icon.xs, color: theme.color.text2 })
+      }
+    ) : null,
+    /* @__PURE__ */ jsx(
+      Animated.View,
+      {
+        testID: "chat-swipe-reply",
+        style: { transform: [{ translateX: swipe.tx }] },
+        ...swipe.panHandlers,
+        children
+      }
+    )
+  ] });
+}
+var ChatMessageRow = React10.memo(function ChatMessageRow2(props) {
+  return props.message.role === "user" ? /* @__PURE__ */ jsx(UserRow, { ...props }) : /* @__PURE__ */ jsx(AssistantRow, { ...props });
+});
+function UserRow({
+  message,
+  appearing,
+  animate,
+  user,
+  running,
+  onEdit,
+  onRetry,
+  onCopy,
+  onReply,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet7);
+  const theme = useLoamTheme("chat");
+  const arrival = useArrival(appearing && animate, "sent");
+  const [editing, setEditing] = React10.useState(false);
+  const text = chatMessageText(message);
+  const [draft, setDraft] = React10.useState(text);
+  const status = message.status ?? "done";
+  const failed = status === "failed";
+  const canEdit = !!onEdit && !running && status === "done" && !!text;
+  const reply = onReply && status === "done" && !editing ? () => onReply(message) : void 0;
+  const save = () => {
+    const t = draft.trim();
+    setEditing(false);
+    if (t && t !== text) onEdit?.(message, t);
+  };
+  return /* @__PURE__ */ jsxs(
+    Animated.View,
+    {
+      role: "group",
+      accessibilityLabel: labels.saidBy(user?.name ?? labels.you),
+      accessibilityActions: reply ? [{ name: "reply", label: labels.reply }] : void 0,
+      onAccessibilityAction: reply ? (e) => e.nativeEvent.actionName === "reply" && reply() : void 0,
+      style: [styles.userRow, arrival],
+      children: [
+        message.attachments?.length ? /* @__PURE__ */ jsx(View, { style: styles.userAttachments, children: message.attachments.map((a) => /* @__PURE__ */ jsx(AttachmentChip, { attachment: a, labels }, a.id)) }) : null,
+        editing ? /* @__PURE__ */ jsxs(View, { style: styles.edit, children: [
+          /* @__PURE__ */ jsx(
+            Textarea,
+            {
+              accessibilityLabel: labels.editMessage,
+              value: draft,
+              onChangeText: setDraft,
+              autoFocus: true,
+              autoGrow: true,
+              minRows: 2,
+              maxRows: 10
+            }
+          ),
+          /* @__PURE__ */ jsx(Text, { style: styles.meta, children: labels.editNote }),
+          /* @__PURE__ */ jsxs(View, { style: styles.editActions, children: [
+            /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onPress: () => setEditing(false), children: labels.cancel }),
+            /* @__PURE__ */ jsx(Button, { size: "sm", onPress: save, disabled: !draft.trim(), children: labels.send })
+          ] })
+        ] }) : text ? /* @__PURE__ */ jsx(SwipeReply, { onReply: reply, animate, style: styles.userSwipe, children: /* @__PURE__ */ jsx(
+          Pressable,
+          {
+            accessibilityHint: canEdit ? labels.editHint : void 0,
+            accessibilityActions: canEdit ? [{ name: "edit", label: labels.editMessage }] : void 0,
+            onAccessibilityAction: canEdit ? (e) => {
+              if (e.nativeEvent.actionName !== "edit") return;
+              setDraft(text);
+              setEditing(true);
+            } : void 0,
+            onLongPress: canEdit ? () => {
+              setDraft(text);
+              setEditing(true);
+            } : void 0,
+            style: [
+              styles.bubble,
+              styles.bubbleFill,
+              (failed || status === "sending") && styles.faded
+            ],
+            children: /* @__PURE__ */ jsx(Text, { style: styles.bubbleText, selectable: true, children: text })
+          }
+        ) }) : null,
+        failed ? /* @__PURE__ */ jsxs(View, { style: styles.failed, accessibilityRole: "alert", children: [
+          /* @__PURE__ */ jsx(Icon, { name: "alert-circle", size: theme.icon.xs, color: theme.color.dangerOnSoft }),
+          /* @__PURE__ */ jsx(Text, { style: [styles.meta, { color: theme.color.dangerOnSoft }], children: labels.notSent }),
+          onRetry ? /* @__PURE__ */ jsx(
+            Pressable,
+            {
+              accessibilityRole: "button",
+              onPress: () => onRetry(message),
+              hitSlop: theme.space[12],
+              children: /* @__PURE__ */ jsx(Text, { style: styles.retry, children: labels.retry })
+            }
+          ) : null
+        ] }) : !editing ? /* @__PURE__ */ jsxs(View, { style: styles.actions, children: [
+          message.time ? /* @__PURE__ */ jsx(Text, { style: [styles.meta, styles.time], children: message.time }) : null,
+          text && onCopy ? /* @__PURE__ */ jsx(
+            CopyButton,
+            {
+              value: text,
+              size: "sm",
+              accessibilityLabel: labels.copyMessage,
+              onCopy: () => onCopy(message, text)
+            }
+          ) : null,
+          canEdit ? /* @__PURE__ */ jsx(
+            Action,
+            {
+              label: labels.editMessage,
+              icon: "edit",
+              onPress: () => {
+                setDraft(text);
+                setEditing(true);
+              }
+            }
+          ) : null,
+          reply ? /* @__PURE__ */ jsx(Action, { label: labels.reply, icon: "reply", onPress: reply }) : null
+        ] }) : null
+      ]
+    }
+  );
+}
+function FeedbackPanel({
+  reasons,
+  animate,
+  onSubmit,
+  onCancel,
+  labels
+}) {
+  const { styles } = useStyles(sheet7);
+  const arrival = useArrival(animate, "card");
+  const [reason, setReason] = React10.useState();
+  const [note, setNote] = React10.useState("");
+  return /* @__PURE__ */ jsxs(
+    Animated.View,
+    {
+      style: [styles.feedback, arrival],
+      role: "group",
+      accessibilityLabel: labels.feedbackTitle,
+      children: [
+        /* @__PURE__ */ jsx(Text, { style: styles.feedbackTitle, children: labels.feedbackTitle }),
+        /* @__PURE__ */ jsx(View, { style: styles.chips, children: reasons.map((r) => /* @__PURE__ */ jsx(
+          Chip,
+          {
+            variant: "filter",
+            size: "sm",
+            selected: reason === r,
+            onSelectedChange: (on) => setReason(on ? r : void 0),
+            children: r
+          },
+          r
+        )) }),
+        /* @__PURE__ */ jsx(
+          Textarea,
+          {
+            accessibilityLabel: labels.feedbackNote,
+            placeholder: labels.feedbackNote,
+            value: note,
+            onChangeText: setNote,
+            autoGrow: true,
+            minRows: 2,
+            maxRows: 6
+          }
+        ),
+        /* @__PURE__ */ jsxs(View, { style: styles.editActions, children: [
+          /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onPress: onCancel, children: labels.cancel }),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              size: "sm",
+              disabled: !reason && !note.trim(),
+              onPress: () => onSubmit(reason, note.trim()),
+              children: labels.sendFeedback
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+function AssistantRow({
+  message,
+  latest,
+  appearing,
+  animate,
+  assistant,
+  feedbackReasons,
+  running,
+  onRegenerate,
+  onFeedback,
+  onCopy,
+  onReply,
+  onLinkPress,
+  onApproval,
+  onOpenSource,
+  onVersionChange,
+  onContinue,
+  onArtifactVersionChange,
+  onShareArtifact,
+  onExpandTable,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet7);
+  const theme = useLoamTheme("chat");
+  const arrival = useArrival(appearing && animate, "in");
+  const sources = message.sources;
+  const [sourcesOpen, setSourcesOpen] = React10.useState(null);
+  const [artifactOpen, setArtifactOpen] = React10.useState(null);
+  const openSource = (source) => {
+    setSourcesOpen({ active: source.id });
+    onOpenSource?.(message, source);
+  };
+  const renderCitation = sources?.length ? (ref) => {
+    const idx = /^\d+$/.test(ref) ? Number(ref) - 1 : sources.findIndex((x) => x.id === ref);
+    const source = sources[idx];
+    return /* @__PURE__ */ jsx(
+      CitationMark,
+      {
+        n: idx + 1 || Number(ref) || 0,
+        source,
+        active: !!source && sourcesOpen?.active === source.id,
+        onOpen: openSource,
+        labels
+      }
+    );
+  } : void 0;
+  const status = message.status ?? "done";
+  const streaming = status === "streaming";
+  const text = chatMessageText(message);
+  const reply = onReply && !streaming && text ? () => onReply(message) : void 0;
+  const [feedback, setFeedback] = React10.useState(message.feedback);
+  const [asking, setAsking] = React10.useState(false);
+  const [thanked, setThanked] = React10.useState(false);
+  React10.useEffect(() => setFeedback(message.feedback), [message.feedback]);
+  const lastPart = message.parts[message.parts.length - 1];
+  const hasVisible = message.parts.some((p) => p.kind !== "text" || p.text.trim() !== "");
+  const showWorking = streaming && (!hasVisible || lastPart?.kind === "tool" && lastPart.status !== "running");
+  const rate = (value) => {
+    if (feedback === value) return;
+    setFeedback(value);
+    if (value === "up") {
+      setAsking(false);
+      setThanked(true);
+      onFeedback?.(message, { value });
+    } else {
+      setThanked(false);
+      setAsking(true);
+    }
+  };
+  return /* @__PURE__ */ jsxs(
+    Animated.View,
+    {
+      role: "group",
+      accessibilityLabel: labels.saidBy(assistant.name),
+      "aria-busy": streaming || void 0,
+      accessibilityActions: reply ? [{ name: "reply", label: labels.reply }] : void 0,
+      onAccessibilityAction: reply ? (e) => e.nativeEvent.actionName === "reply" && reply() : void 0,
+      style: [styles.assistantRow, arrival],
+      children: [
+        /* @__PURE__ */ jsx(View, { importantForAccessibility: "no-hide-descendants", accessibilityElementsHidden: true, children: assistant.avatar ?? /* @__PURE__ */ jsx(AssistantMark, {}) }),
+        /* @__PURE__ */ jsxs(View, { style: styles.assistantBody, children: [
+          /* @__PURE__ */ jsx(SwipeReply, { onReply: reply, animate, children: /* @__PURE__ */ jsxs(View, { style: styles.assistantParts, children: [
+            segment(message.parts).map((seg) => {
+              if (seg.kind === "tools")
+                return /* @__PURE__ */ jsx(ToolGroupView, { tools: seg.tools, animate, labels }, seg.id);
+              const part = seg.part;
+              switch (part.kind) {
+                case "text":
+                  return /* @__PURE__ */ jsx(
+                    Markdown,
+                    {
+                      content: part.text,
+                      streaming: streaming && part === lastPart,
+                      motion: animate ? "full" : "none",
+                      onLinkPress,
+                      renderCitation
+                    },
+                    part.id
+                  );
+                case "approval":
+                  return /* @__PURE__ */ jsx(
+                    ApprovalView,
+                    {
+                      part,
+                      animate,
+                      onAnswer: onApproval ? (d) => onApproval(message, part, d) : void 0,
+                      labels
+                    },
+                    part.id
+                  );
+                case "table":
+                  return /* @__PURE__ */ jsx(
+                    ChatInlineTable,
+                    {
+                      part,
+                      onExpand: onExpandTable ? (p) => onExpandTable(message, p) : void 0,
+                      labels
+                    },
+                    part.id
+                  );
+                case "artifact":
+                  return /* @__PURE__ */ jsxs(React10.Fragment, { children: [
+                    /* @__PURE__ */ jsx(
+                      ChatArtifactCard,
+                      {
+                        artifact: part.artifact,
+                        open: artifactOpen === part.id,
+                        onOpen: () => setArtifactOpen(part.id),
+                        labels
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      ChatArtifactSheet,
+                      {
+                        artifact: part.artifact,
+                        open: artifactOpen === part.id,
+                        onClose: () => setArtifactOpen(null),
+                        onVersionChange: onArtifactVersionChange ? (a, v) => onArtifactVersionChange(message, a, v) : void 0,
+                        onShare: onShareArtifact ? (a) => onShareArtifact(message, a) : void 0,
+                        labels
+                      }
+                    )
+                  ] }, part.id);
+                case "reasoning":
+                  return /* @__PURE__ */ jsx(
+                    ReasoningView,
+                    {
+                      part,
+                      live: streaming && part === lastPart,
+                      animate,
+                      labels
+                    },
+                    part.id
+                  );
+                case "error":
+                  return /* @__PURE__ */ jsx(Alert, { tone: "danger", size: "compact", title: part.message }, part.id);
+                case "custom":
+                  return /* @__PURE__ */ jsx(CustomPart, { animate, children: part.content }, part.id);
+                default:
+                  return null;
+              }
+            }),
+            showWorking ? /* @__PURE__ */ jsx(
+              WorkingIndicator,
+              {
+                phase: message.phase,
+                startedAt: message.startedAt,
+                animate,
+                labels
+              }
+            ) : null
+          ] }) }),
+          !streaming && sources?.length ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              SourcesRow,
+              {
+                sources,
+                onOpen: openSource,
+                onOpenAll: () => setSourcesOpen({}),
+                labels
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              SourcesSheet,
+              {
+                open: !!sourcesOpen,
+                sources,
+                active: sourcesOpen?.active,
+                onClose: () => setSourcesOpen(null),
+                onOpenSource: (source) => onOpenSource?.(message, source),
+                labels
+              }
+            )
+          ] }) : null,
+          !streaming ? /* @__PURE__ */ jsxs(View, { style: styles.actions, children: [
+            message.version && message.version.count > 1 ? /* @__PURE__ */ jsx(
+              VersionSwitcher,
+              {
+                index: message.version.index,
+                count: message.version.count,
+                streaming: message.version.streaming,
+                onChange: onVersionChange ? (i) => onVersionChange(message, i) : void 0,
+                rule: true,
+                labels
+              }
+            ) : null,
+            status === "stopped" ? /* @__PURE__ */ jsxs(View, { style: styles.stopped, children: [
+              /* @__PURE__ */ jsx(Icon, { name: "stop", size: theme.icon.xs, color: theme.color.text2 }),
+              /* @__PURE__ */ jsx(Text, { style: styles.meta, children: labels.stopped })
+            ] }) : null,
+            status === "stopped" && latest && onContinue && !running ? /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", leadingIcon: "play", onPress: () => onContinue(message), children: labels.continue }) : null,
+            text && onCopy ? /* @__PURE__ */ jsx(
+              CopyButton,
+              {
+                value: text,
+                size: "sm",
+                accessibilityLabel: labels.copyResponse,
+                onCopy: () => onCopy(message, text)
+              }
+            ) : null,
+            onFeedback && text ? /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(
+                Action,
+                {
+                  label: labels.goodResponse,
+                  icon: "thumbs-up",
+                  pressed: feedback === "up",
+                  onPress: () => rate("up")
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Action,
+                {
+                  label: labels.badResponse,
+                  icon: "thumbs-down",
+                  pressed: feedback === "down",
+                  onPress: () => rate("down")
+                }
+              )
+            ] }) : null,
+            latest && onRegenerate && !running ? /* @__PURE__ */ jsx(Action, { label: labels.regenerate, icon: "refresh", onPress: () => onRegenerate(message) }) : null,
+            reply ? /* @__PURE__ */ jsx(Action, { label: labels.reply, icon: "reply", onPress: reply }) : null,
+            message.meta || message.time ? /* @__PURE__ */ jsxs(Text, { style: styles.meta, children: [
+              message.meta,
+              message.meta && message.time ? " \xB7 " : null,
+              message.time ? /* @__PURE__ */ jsx(Text, { style: styles.time, children: message.time }) : null
+            ] }) : null,
+            thanked ? /* @__PURE__ */ jsx(Text, { style: styles.meta, accessibilityLiveRegion: "polite", role: "status", children: labels.thanks }) : null
+          ] }) : null,
+          asking ? /* @__PURE__ */ jsx(
+            FeedbackPanel,
+            {
+              reasons: feedbackReasons,
+              animate,
+              labels,
+              onCancel: () => {
+                setAsking(false);
+                setFeedback(message.feedback);
+              },
+              onSubmit: (reason, note) => {
+                setAsking(false);
+                setThanked(true);
+                onFeedback?.(message, { value: "down", reason, note: note || void 0 });
+              }
+            }
+          ) : null
+        ] })
+      ]
+    }
+  );
+}
+function CustomPart({ animate, children }) {
+  const arrival = useArrival(animate, "card");
+  return /* @__PURE__ */ jsx(Animated.View, { style: arrival, children });
+}
+var sheet7 = createStyleSheet((theme) => ({
+  mark: {
+    width: theme.ctl.sm,
+    height: theme.ctl.sm,
+    borderRadius: theme.radius.sm,
+    backgroundColor: theme.color.accentSoft,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.edge.accent,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  userRow: { alignItems: "flex-end", gap: theme.space[6] },
+  userAttachments: {
+    flexDirection: "row",
+    flexWrap: "wrap",
+    justifyContent: "flex-end",
+    gap: theme.space.s2
+  },
+  bubble: {
+    maxWidth: "85%",
+    // Final 12 state "Bubble (user)": surface-2 (the written entry, latest over Ref 24's "fill unchanged").
+    backgroundColor: theme.color.surface2,
+    borderRadius: theme.radius.lg,
+    borderBottomEndRadius: theme.radius.xs,
+    paddingHorizontal: theme.space.s4,
+    paddingVertical: theme.space[10]
+  },
+  // Sending / failed: a hint of "not yet delivered", never `disabledOpacity`
+  // — at 0.38 the message itself fell to ~2:1 and could not be read back.
+  // Same 0.72 as the web bubble.
+  faded: { opacity: theme.opacity[72] },
+  bubbleText: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.body.fontSize,
+    lineHeight: theme.type.body.lineHeight,
+    color: theme.color.text
+  },
+  failed: { flexDirection: "row", alignItems: "center", gap: theme.space.s2 },
+  retry: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.caption1.fontSize,
+    fontWeight: theme.fontWeight.semibold,
+    color: theme.color.dangerOnSoft
+  },
+  edit: { alignSelf: "stretch", gap: theme.space.s2 },
+  editActions: { flexDirection: "row", justifyContent: "flex-end", gap: theme.space.s2 },
+  actions: { flexDirection: "row", flexWrap: "wrap", alignItems: "center", gap: theme.space.s1 },
+  action: {
+    width: theme.ctl.sm,
+    height: theme.ctl.sm,
+    borderRadius: theme.ctl.r.sm,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  actionSelected: { backgroundColor: theme.state.selected },
+  actionDown: { backgroundColor: theme.state.pressed },
+  meta: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.caption1.fontSize,
+    lineHeight: theme.type.caption1.lineHeight,
+    color: theme.color.text2
+  },
+  // A clock time takes the count style.
+  time: {
+    fontFamily: theme.font.mono,
+    fontWeight: theme.fontWeight.medium,
+    fontVariant: ["tabular-nums"]
+  },
+  stopped: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space[6],
+    marginEnd: theme.space.s2
+  },
+  assistantRow: { flexDirection: "row", gap: theme.space.s3 },
+  assistantBody: { flex: 1, minWidth: 0, gap: theme.space.s2 },
+  assistantParts: { gap: theme.space.s2 },
+  userSwipe: { maxWidth: "85%" },
+  bubbleFill: { maxWidth: "100%" },
+  replyCue: {
+    position: "absolute",
+    start: -theme.ctl.sm,
+    top: "50%",
+    marginTop: -theme.icon.sm,
+    width: theme.icon.sm * 2,
+    height: theme.icon.sm * 2,
+    borderRadius: theme.radius.full,
+    backgroundColor: theme.color.surface3,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  feedback: {
+    gap: theme.space.s3,
+    padding: theme.space.s3,
+    borderRadius: theme.radius.lg,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.color.border,
+    backgroundColor: theme.color.surface
+  },
+  feedbackTitle: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    fontWeight: theme.fontWeight.semibold,
+    color: theme.color.text
+  },
+  chips: { flexDirection: "row", flexWrap: "wrap", gap: theme.space.s2 }
+}));
+var keyOf = (s) => s.id ?? s.label;
+function paginate(list, perPage) {
+  if (list.some((s) => s.page !== void 0)) {
+    const by = /* @__PURE__ */ new Map();
+    for (const s of list) {
+      const p = s.page ?? 0;
+      by.set(p, [...by.get(p) ?? [], s]);
+    }
+    return [...by.keys()].sort((a, b) => a - b).map((p) => by.get(p));
+  }
+  const size = Math.max(1, perPage);
+  const out = [];
+  for (let i = 0; i < list.length; i += size) out.push(list.slice(i, i + size));
+  return out;
+}
+function sectionsOf(page) {
+  const out = [];
+  for (const s of page) {
+    const hit = out.find((g) => g.title === s.group);
+    if (hit) hit.items.push(s);
+    else out.push({ title: s.group, items: [s] });
+  }
+  return out;
+}
+function ChatSuggestions({
+  suggestions,
+  perPage,
+  onPick,
+  onDismiss,
+  loading = false,
+  animate,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet8);
+  const theme = useLoamTheme("chat");
+  const [hidden, setHidden] = React10.useState(() => /* @__PURE__ */ new Set());
+  const pages = React10.useMemo(
+    () => paginate(suggestions.filter((s) => !hidden.has(keyOf(s))), perPage),
+    [suggestions, hidden, perPage]
+  );
+  const [index, setIndex] = React10.useState(0);
+  const [visit, setVisit] = React10.useState(0);
+  const current = Math.min(index, Math.max(0, pages.length - 1));
+  const [width, setWidth] = React10.useState(0);
+  const scroller = React10.useRef(null);
+  const settle = (next) => {
+    if (next === current) return;
+    setIndex(next);
+    setVisit((v) => v + 1);
+  };
+  const goTo = (next) => {
+    const clamped = Math.max(0, Math.min(pages.length - 1, next));
+    scroller.current?.scrollTo({ x: clamped * width, animated: animate });
+    settle(clamped);
+  };
+  const onScrollEnd = (e) => {
+    if (width > 0) settle(Math.round(e.nativeEvent.contentOffset.x / width));
+  };
+  const dismiss = (s) => {
+    if (animate) {
+      LayoutAnimation.configureNext(
+        LayoutAnimation.create(theme.motion.collapse.duration, LayoutAnimation.Types.easeInEaseOut, LayoutAnimation.Properties.opacity)
+      );
+    }
+    setHidden((prev) => new Set(prev).add(keyOf(s)));
+    onDismiss?.(s);
+  };
+  if (loading) {
+    return (
+      // One "Loading" for the whole card (the SkeletonText pattern); the bones
+      // are decorative, or a screen reader says "Loading" a dozen times.
+      /* @__PURE__ */ jsx(
+        View,
+        {
+          style: styles.card,
+          accessible: true,
+          accessibilityRole: "image",
+          accessibilityLabel: labels.loadingSuggestions,
+          accessibilityState: { busy: true },
+          children: Array.from({ length: Math.min(perPage, 4) }, (_, i) => /* @__PURE__ */ jsxs(View, { style: styles.skeletonRow, children: [
+            /* @__PURE__ */ jsx(
+              Skeleton,
+              {
+                variant: "rect",
+                width: theme.icon.sm,
+                height: theme.icon.sm,
+                radius: "sm",
+                decorative: true
+              }
+            ),
+            /* @__PURE__ */ jsxs(View, { style: styles.rowText, children: [
+              /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: theme.ctl.md * 4, decorative: true }),
+              /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: theme.ctl.md * 2.5, decorative: true })
+            ] })
+          ] }, i))
+        }
+      )
+    );
+  }
+  if (pages.length === 0) return null;
+  return /* @__PURE__ */ jsxs(View, { style: styles.card, onLayout: (e) => setWidth(e.nativeEvent.layout.width - theme.space.s2 * 2), children: [
+    /* @__PURE__ */ jsx(
+      ScrollView,
+      {
+        ref: scroller,
+        horizontal: true,
+        pagingEnabled: true,
+        scrollEnabled: pages.length > 1,
+        showsHorizontalScrollIndicator: false,
+        onMomentumScrollEnd: onScrollEnd,
+        children: pages.map((page, p) => /* @__PURE__ */ jsx(
+          View,
+          {
+            style: width ? { width } : styles.fill,
+            accessibilityElementsHidden: p !== current,
+            importantForAccessibility: p === current ? "auto" : "no-hide-descendants",
+            children: /* @__PURE__ */ jsx(
+              Page,
+              {
+                page,
+                animate: animate && p === current,
+                onPick,
+                onDismiss: onDismiss ? dismiss : void 0,
+                labels
+              }
+            )
+          },
+          p === current ? `on-${visit}` : `off-${p}`
+        ))
+      }
+    ),
+    pages.length > 1 ? /* @__PURE__ */ jsxs(View, { style: styles.pager, role: "group", accessibilityLabel: labels.moreSuggestions, children: [
+      /* @__PURE__ */ jsx(PagerButton, { icon: "chevron-left", label: labels.previousSuggestions, disabled: current === 0, onPress: () => goTo(current - 1) }),
+      /* @__PURE__ */ jsx(View, { style: styles.dots, children: pages.map((_, p) => /* @__PURE__ */ jsx(
+        Dot,
+        {
+          index: p,
+          count: pages.length,
+          active: p === current,
+          animate,
+          onPress: () => goTo(p),
+          labels
+        },
+        p
+      )) }),
+      /* @__PURE__ */ jsx(
+        PagerButton,
+        {
+          icon: "chevron-right",
+          label: labels.moreSuggestions,
+          disabled: current === pages.length - 1,
+          onPress: () => goTo(current + 1)
+        }
+      )
+    ] }) : null
+  ] });
+}
+function Page({
+  page,
+  animate,
+  onPick,
+  onDismiss,
+  labels
+}) {
+  const { styles } = useStyles(sheet8);
+  let n = 0;
+  return /* @__PURE__ */ jsx(View, { children: sectionsOf(page).map((section, si) => /* @__PURE__ */ jsxs(View, { style: si > 0 ? styles.sectionRule : void 0, children: [
+    section.title ? /* @__PURE__ */ jsx(Rise, { i: n, animate, children: /* @__PURE__ */ jsx(Text, { accessibilityRole: "header", style: styles.sectionTitle, children: section.title }) }) : null,
+    section.items.map((s) => /* @__PURE__ */ jsx(Rise, { i: ++n, animate, children: /* @__PURE__ */ jsx(Row, { suggestion: s, onPick, onDismiss, labels }) }, keyOf(s)))
+  ] }, section.title ?? `untitled-${si}`)) });
+}
+function Rise({ i, animate, children }) {
+  const theme = useLoamTheme("chat");
+  const style = useArrival(animate, "in", i * theme.duration.fast * 0.27);
+  return /* @__PURE__ */ jsx(Animated.View, { style, children });
+}
+function Row({
+  suggestion: s,
+  onPick,
+  onDismiss,
+  labels
+}) {
+  const { styles } = useStyles(sheet8);
+  const theme = useLoamTheme("chat");
+  const tone = {
+    neutral: theme.color.text3,
+    accent: theme.color.accent,
+    good: theme.color.good,
+    warn: theme.color.warn,
+    danger: theme.color.danger
+  };
+  const swap = React10.useRef(new Animated.Value(0)).current;
+  const fade = React10.useRef(new Animated.Value(1)).current;
+  const to = (v) => Animated.timing(swap, {
+    toValue: v,
+    duration: theme.motion.swap.duration,
+    easing: Easing.bezier(...theme.motion.swap.easing),
+    useNativeDriver: true
+  }).start();
+  const lift = theme.space[3];
+  const leave = () => {
+    Animated.timing(fade, {
+      toValue: 0,
+      duration: theme.motion.exit.duration,
+      easing: Easing.bezier(...theme.motion.exit.easing),
+      useNativeDriver: true
+    }).start(() => onDismiss?.(s));
+  };
+  return /* @__PURE__ */ jsxs(Animated.View, { style: [styles.row, { opacity: fade }], children: [
+    /* @__PURE__ */ jsxs(
+      Pressable,
+      {
+        accessibilityRole: "button",
+        accessibilityLabel: s.label,
+        accessibilityHint: [s.description, s.reason && labels.why(s.reason)].filter(Boolean).join(". ") || void 0,
+        onPress: () => onPick(s),
+        onPressIn: s.reason ? () => to(1) : void 0,
+        onPressOut: s.reason ? () => to(0) : void 0,
+        style: ({ pressed }) => [styles.rowPress, pressed && styles.rowPressed],
+        children: [
+          /* @__PURE__ */ jsx(Icon, { name: s.icon ?? "sparkle", size: theme.icon.xs, color: tone[s.tone ?? "neutral"] }),
+          /* @__PURE__ */ jsxs(View, { style: styles.rowText, children: [
+            /* @__PURE__ */ jsx(Text, { numberOfLines: 1, style: styles.label, children: s.label }),
+            s.description || s.reason ? /* @__PURE__ */ jsxs(View, { children: [
+              /* @__PURE__ */ jsx(
+                Animated.Text,
+                {
+                  numberOfLines: 1,
+                  style: [
+                    styles.meta,
+                    s.reason && {
+                      opacity: swap.interpolate({ inputRange: [0, 1], outputRange: [1, 0] }),
+                      transform: [{ translateY: swap.interpolate({ inputRange: [0, 1], outputRange: [0, -lift] }) }]
+                    }
+                  ],
+                  children: s.description ?? " "
+                }
+              ),
+              s.reason ? /* @__PURE__ */ jsx(
+                Animated.Text,
+                {
+                  numberOfLines: 1,
+                  importantForAccessibility: "no",
+                  accessibilityElementsHidden: true,
+                  style: [
+                    styles.meta,
+                    styles.reason,
+                    {
+                      opacity: swap,
+                      transform: [{ translateY: swap.interpolate({ inputRange: [0, 1], outputRange: [lift, 0] }) }]
+                    }
+                  ],
+                  children: s.reason
+                }
+              ) : null
+            ] }) : null
+          ] })
+        ]
+      }
+    ),
+    onDismiss ? /* @__PURE__ */ jsx(
+      Pressable,
+      {
+        accessibilityRole: "button",
+        accessibilityLabel: labels.notUsefulFor(s.label),
+        onPress: leave,
+        hitSlop: theme.space[8],
+        style: ({ pressed }) => [styles.dismiss, pressed && styles.rowPressed],
+        children: /* @__PURE__ */ jsx(Icon, { name: "x", size: theme.icon.xs, color: theme.color.text3 })
+      }
+    ) : null
+  ] });
+}
+function Dot({
+  index,
+  count,
+  active,
+  animate,
+  onPress,
+  labels
+}) {
+  const { styles } = useStyles(sheet8);
+  const theme = useLoamTheme("chat");
+  const p = React10.useRef(new Animated.Value(active ? 1 : 0)).current;
+  React10.useEffect(() => {
+    Animated.timing(p, {
+      toValue: active ? 1 : 0,
+      duration: animate ? theme.motion.indicator.duration : 0,
+      easing: Easing.bezier(...theme.motion.indicator.easing),
+      useNativeDriver: false
+    }).start();
+  }, [active, animate, p, theme.motion.indicator]);
+  const dot = theme.space[6];
+  return /* @__PURE__ */ jsx(
+    Pressable,
+    {
+      accessibilityRole: "button",
+      accessibilityLabel: labels.suggestionsPage(index + 1, count),
+      accessibilityState: { selected: active },
+      onPress,
+      hitSlop: theme.space[8],
+      children: /* @__PURE__ */ jsx(
+        Animated.View,
+        {
+          style: [
+            styles.dot,
+            {
+              width: p.interpolate({ inputRange: [0, 1], outputRange: [dot, dot * 2.67] }),
+              backgroundColor: p.interpolate({ inputRange: [0, 1], outputRange: [theme.color.borderStrong, theme.color.accent] })
+            }
+          ]
+        }
+      )
+    }
+  );
+}
+function PagerButton({
+  icon,
+  label,
+  disabled,
+  onPress
+}) {
+  const { styles } = useStyles(sheet8);
+  const theme = useLoamTheme("chat");
+  return /* @__PURE__ */ jsx(
+    Pressable,
+    {
+      accessibilityRole: "button",
+      accessibilityLabel: label,
+      accessibilityState: { disabled },
+      disabled,
+      onPress,
+      hitSlop: theme.space[8],
+      style: ({ pressed }) => [styles.pagerButton, pressed && styles.rowPressed, disabled && styles.disabled],
+      children: /* @__PURE__ */ jsx(Icon, { name: icon, size: theme.icon.sm, color: theme.color.text3 })
+    }
+  );
+}
+var sheet8 = createStyleSheet((theme) => ({
+  card: {
+    alignSelf: "stretch",
+    padding: theme.space.s2,
+    // Final 12 Suggestions: card r-lg, p 8 (rows r 8, 44 on the lg tier).
+    borderRadius: theme.radius.lg,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.color.border,
+    backgroundColor: theme.color.surface,
+    overflow: "hidden"
+  },
+  fill: { flex: 1 },
+  sectionRule: {
+    marginTop: theme.space.s1,
+    paddingTop: theme.space.s1,
+    borderTopWidth: theme.borderWidth.base,
+    borderTopColor: theme.color.border
+  },
+  sectionTitle: {
+    ...theme.type.overline,
+    paddingHorizontal: theme.space.s3,
+    paddingTop: theme.space.s2,
+    paddingBottom: theme.space.s1,
+    fontFamily: theme.font.sans,
+    color: theme.color.text3
+  },
+  row: { flexDirection: "row", alignItems: "center", borderRadius: theme.radius.sm },
+  rowPress: {
+    flex: 1,
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s3,
+    minHeight: theme.ctl.lg,
+    paddingHorizontal: theme.space.s3,
+    paddingVertical: theme.space.s2,
+    borderRadius: theme.radius.sm,
+    borderWidth: theme.borderWidth.base,
+    borderColor: "transparent"
+  },
+  // accent-soft never marks pressed or hover: the shared state layer does.
+  rowPressed: { backgroundColor: theme.state.pressed },
+  rowText: { flex: 1, gap: theme.space[2] },
+  label: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.fontSize[14],
+    lineHeight: theme.space[20],
+    fontWeight: theme.fontWeight.medium,
+    color: theme.color.text
+  },
+  meta: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.caption1.fontSize,
+    lineHeight: theme.type.caption1.lineHeight,
+    color: theme.color.text2
+  },
+  reason: { position: "absolute", start: 0, end: 0, top: 0, color: theme.color.accentStrong },
+  dismiss: {
+    width: theme.ctl.iconBtnSm,
+    height: theme.ctl.iconBtnSm,
+    borderRadius: theme.ctl.r.xs,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  skeletonRow: { flexDirection: "row", alignItems: "center", gap: theme.space.s3, padding: theme.space.s3 },
+  pager: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    marginTop: theme.space.s1,
+    paddingTop: theme.space.s1,
+    borderTopWidth: theme.borderWidth.base,
+    borderTopColor: theme.color.border
+  },
+  pagerButton: {
+    width: theme.ctl.iconBtnSm,
+    height: theme.ctl.iconBtnSm,
+    borderRadius: theme.ctl.r.xs,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  disabled: { opacity: theme.state.disabledOpacity },
+  dots: { flexDirection: "row", alignItems: "center", gap: theme.space.s2 },
+  dot: { height: theme.space[6], borderRadius: theme.radius.full }
+}));
+function useChatScroll({ threshold = 32 } = {}) {
+  const ref = React10.useRef(null);
+  const pinnedRef = React10.useRef(true);
+  const [pinned, setPinnedState] = React10.useState(true);
+  const driving = React10.useRef({ drag: false, momentum: false });
+  const setPinned = React10.useCallback((next) => {
+    if (pinnedRef.current === next) return;
+    pinnedRef.current = next;
+    setPinnedState(next);
+  }, []);
+  const scrollToBottom = React10.useCallback(
+    (animated = true) => {
+      setPinned(true);
+      ref.current?.scrollToEnd({ animated });
+    },
+    [setPinned]
+  );
+  const follow = React10.useCallback(() => {
+    if (pinnedRef.current) ref.current?.scrollToEnd({ animated: false });
+  }, []);
+  const scrollProps = React10.useMemo(
+    () => ({
+      ref,
+      scrollEventThrottle: 16,
+      onScroll: (e) => {
+        const { contentOffset, contentSize, layoutMeasurement } = e.nativeEvent;
+        const distance = contentSize.height - contentOffset.y - layoutMeasurement.height;
+        if (distance <= threshold) setPinned(true);
+        else if (driving.current.drag || driving.current.momentum) setPinned(false);
+      },
+      onScrollBeginDrag: () => {
+        driving.current.drag = true;
+      },
+      onScrollEndDrag: () => {
+        driving.current.drag = false;
+      },
+      onMomentumScrollBegin: () => {
+        driving.current.momentum = true;
+      },
+      onMomentumScrollEnd: () => {
+        driving.current.momentum = false;
+      },
+      onContentSizeChange: follow,
+      onLayout: follow
+    }),
+    [follow, setPinned, threshold]
+  );
+  return { pinned, scrollToBottom, scrollProps };
+}
+var CHAT_FEEDBACK_REASONS = DEFAULT_CHAT_LABELS.feedbackReasons;
+function useArrivals(messages) {
+  const seen = React10.useRef(null);
+  const prevLast = React10.useRef(void 0);
+  if (seen.current === null) {
+    seen.current = new Set(messages.map((m) => m.id));
+    prevLast.current = messages[messages.length - 1]?.id;
+  }
+  const boundary = prevLast.current ? messages.findIndex((m) => m.id === prevLast.current) : -1;
+  const arriving = /* @__PURE__ */ new Set();
+  messages.forEach((m, i) => {
+    if (!seen.current.has(m.id) && i > boundary) arriving.add(m.id);
+  });
+  React10.useEffect(() => {
+    for (const m of messages) seen.current.add(m.id);
+    prevLast.current = messages[messages.length - 1]?.id;
+  }, [messages]);
+  return (id) => arriving.has(id);
+}
+function Staggered({
+  i,
+  animate,
+  children
+}) {
+  const theme = useLoamTheme("chat");
+  const style = useArrival(animate, "in", i * theme.duration.fast * 0.27);
+  return /* @__PURE__ */ jsx(Animated.View, { style, children });
+}
+function Chat({
+  messages,
+  running = false,
+  onSend,
+  onStop,
+  onRegenerate,
+  onEdit,
+  onRetry,
+  onFeedback,
+  onCopy,
+  onReply,
+  onApproval,
+  onOpenSource,
+  onVersionChange,
+  onContinue,
+  onArtifactVersionChange,
+  onShareArtifact,
+  onExpandTable,
+  feedbackReasons: feedbackReasonsProp,
+  assistant: assistantProp,
+  user,
+  suggestions,
+  suggestionAction = "send",
+  suggestionsPerPage = 4,
+  suggestionsLoading = false,
+  onDismissSuggestion,
+  followUps,
+  emptyTitle: emptyTitleProp,
+  emptyDescription,
+  emptyState,
+  hasOlder = false,
+  loadingOlder = false,
+  onLoadOlder,
+  showJumpToLatest = false,
+  draft: draftProp,
+  onDraftChange,
+  placeholder,
+  attachments,
+  onAttach,
+  accept,
+  onRemoveAttachment,
+  composerToolbar,
+  composerFeatures,
+  disclaimer,
+  disabled,
+  header,
+  onLinkPress,
+  insets,
+  label: labelProp,
+  motion = "full",
+  style,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const assistant = React10.useMemo(
+    () => assistantProp ?? { name: labels.assistant },
+    [assistantProp, labels.assistant]
+  );
+  const feedbackReasons = feedbackReasonsProp ?? labels.feedbackReasons;
+  const emptyTitle = emptyTitleProp ?? labels.emptyTitle;
+  const label = labelProp ?? labels.chat;
+  const { styles } = useStyles(sheet9);
+  const theme = useLoamTheme("chat");
+  const animate = useResolvedMotion(motion, "chat") === "full";
+  const { pinned: scrollPinned, scrollToBottom, scrollProps } = useChatScroll();
+  const pinned = scrollPinned && !showJumpToLatest;
+  const { readingMeasure } = useFormFactor();
+  const column = {
+    width: "100%",
+    maxWidth: readingMeasure + theme.ctl.sm + theme.space.s3 + theme.space.s4 * 2,
+    alignSelf: "center"
+  };
+  const isArriving = useArrivals(messages);
+  const inputRef = React10.useRef(null);
+  const [innerDraft, setInnerDraft] = React10.useState("");
+  const draft = draftProp ?? innerDraft;
+  const setDraft = (next) => {
+    if (draftProp === void 0) setInnerDraft(next);
+    onDraftChange?.(next);
+  };
+  const last = messages[messages.length - 1];
+  const latestAssistantId = [...messages].reverse().find((m) => m.role === "assistant")?.id;
+  const [replyingTo, setReplyingTo] = React10.useState(null);
+  const reply = onReply ? (m) => {
+    setReplyingTo(m);
+    onReply(m);
+    inputRef.current?.focus();
+  } : void 0;
+  const send = (text, files) => {
+    if (replyingTo) onSend(text, files, replyingTo);
+    else onSend(text, files);
+    setReplyingTo(null);
+    scrollToBottom();
+  };
+  const pick = (s) => {
+    const prompt = s.prompt ?? s.label;
+    if (suggestionAction === "fill") {
+      setDraft(prompt);
+      inputRef.current?.focus();
+    } else send(prompt, []);
+  };
+  const [unseen, setUnseen] = React10.useState(false);
+  const prevCount = React10.useRef(messages.length);
+  React10.useEffect(() => {
+    if (pinned) setUnseen(false);
+    else if (messages.length > prevCount.current) setUnseen(true);
+    prevCount.current = messages.length;
+  }, [messages.length, pinned]);
+  const pillLabel = running ? labels.writing : unseen ? labels.newMessages : labels.jumpToLatest;
+  const pill = React10.useRef(new Animated.Value(pinned ? 0 : 1)).current;
+  React10.useEffect(() => {
+    Animated.timing(pill, {
+      toValue: pinned ? 0 : 1,
+      duration: animate ? theme.motion.enter.duration : 0,
+      useNativeDriver: true
+    }).start();
+  }, [pinned, animate, pill, theme.motion.enter.duration]);
+  const streamingId = messages.find((m) => m.status === "streaming")?.id;
+  const prevStreaming = React10.useRef(streamingId);
+  const prevRunning = React10.useRef(running);
+  React10.useEffect(() => {
+    if (running && !prevRunning.current) {
+      AccessibilityInfo.announceForAccessibility?.(labels.responding(assistant.name));
+    }
+    if (prevStreaming.current && prevStreaming.current !== streamingId) {
+      const m = messages.find((x) => x.id === prevStreaming.current);
+      if (m)
+        AccessibilityInfo.announceForAccessibility?.(labels.said(assistant.name, chatMessageText(m)));
+    }
+    prevStreaming.current = streamingId;
+    prevRunning.current = running;
+  }, [running, streamingId, messages, assistant.name, labels]);
+  const lastUserText = React10.useMemo(() => {
+    const m = [...messages].reverse().find((x) => x.role === "user");
+    return m ? chatMessageText(m) : void 0;
+  }, [messages]);
+  const pendingReply = running && last?.role === "user";
+  const showFollowUps = !running && !!followUps?.length && last?.role === "assistant" && (last.status ?? "done") === "done";
+  return /* @__PURE__ */ jsxs(
+    KeyboardAvoidingView,
+    {
+      accessibilityLabel: label,
+      behavior: Platform.OS === "ios" ? "padding" : void 0,
+      keyboardVerticalOffset: insets?.top ?? 0,
+      style: [styles.root, style],
+      children: [
+        header,
+        /* @__PURE__ */ jsxs(View, { style: styles.stage, children: [
+          /* @__PURE__ */ jsxs(
+            ScrollView,
+            {
+              ...scrollProps,
+              accessibilityLabel: labels.messages,
+              keyboardShouldPersistTaps: "handled",
+              keyboardDismissMode: "interactive",
+              contentContainerStyle: [styles.content, column],
+              onScroll: (e) => {
+                scrollProps.onScroll(e);
+                if (hasOlder && !loadingOlder && e.nativeEvent.contentOffset.y < theme.space.s8)
+                  onLoadOlder?.();
+              },
+              children: [
+                hasOlder ? /* @__PURE__ */ jsx(View, { style: styles.older, children: loadingOlder ? /* @__PURE__ */ jsx(Thinking, { label: labels.loadingEarlier, size: "sm", motion }) : /* @__PURE__ */ jsx(
+                  Pressable,
+                  {
+                    accessibilityRole: "button",
+                    onPress: onLoadOlder,
+                    hitSlop: theme.space[8],
+                    children: /* @__PURE__ */ jsx(Text, { style: styles.olderText, children: labels.loadEarlier })
+                  }
+                ) }) : null,
+                messages.length === 0 ? emptyState ?? /* @__PURE__ */ jsxs(View, { style: styles.empty, children: [
+                  /* @__PURE__ */ jsx(Staggered, { i: 0, animate, children: /* @__PURE__ */ jsxs(View, { style: styles.emptyHead, children: [
+                    /* @__PURE__ */ jsx(AssistantMark, {}),
+                    /* @__PURE__ */ jsx(Text, { accessibilityRole: "header", style: styles.emptyTitle, children: emptyTitle }),
+                    emptyDescription ? /* @__PURE__ */ jsx(Text, { style: styles.emptyText, children: emptyDescription }) : null
+                  ] }) }),
+                  suggestionsLoading || suggestions?.length ? /* @__PURE__ */ jsx(Staggered, { i: 2, animate, children: /* @__PURE__ */ jsx(
+                    ChatSuggestions,
+                    {
+                      suggestions: suggestions ?? [],
+                      perPage: suggestionsPerPage,
+                      loading: suggestionsLoading,
+                      onPick: pick,
+                      onDismiss: onDismissSuggestion,
+                      animate,
+                      labels
+                    }
+                  ) }) : null
+                ] }) : messages.map((m, i) => /* @__PURE__ */ jsxs(React10.Fragment, { children: [
+                  m.day && m.day !== messages[i - 1]?.day ? /* @__PURE__ */ jsxs(View, { style: styles.day, accessibilityRole: "header", accessibilityLabel: m.day, children: [
+                    /* @__PURE__ */ jsx(View, { style: styles.dayLine }),
+                    /* @__PURE__ */ jsx(Text, { style: styles.dayText, children: m.day }),
+                    /* @__PURE__ */ jsx(View, { style: styles.dayLine })
+                  ] }) : null,
+                  /* @__PURE__ */ jsx(
+                    ChatMessageRow,
+                    {
+                      message: m,
+                      latest: m.id === latestAssistantId,
+                      appearing: isArriving(m.id),
+                      animate,
+                      assistant,
+                      user,
+                      feedbackReasons,
+                      running,
+                      onRegenerate,
+                      onEdit,
+                      onRetry,
+                      onFeedback,
+                      onCopy,
+                      onReply: reply,
+                      onLinkPress,
+                      onApproval,
+                      onOpenSource,
+                      onVersionChange,
+                      onContinue,
+                      onArtifactVersionChange,
+                      onShareArtifact,
+                      onExpandTable,
+                      labels
+                    }
+                  )
+                ] }, m.id)),
+                pendingReply ? /* @__PURE__ */ jsxs(View, { style: styles.pending, children: [
+                  assistant.avatar ?? /* @__PURE__ */ jsx(AssistantMark, {}),
+                  /* @__PURE__ */ jsx(WorkingIndicator, { animate, labels })
+                ] }) : null,
+                showFollowUps ? /* @__PURE__ */ jsx(View, { style: styles.followUps, role: "group", accessibilityLabel: labels.followUps, children: followUps.map((s, i) => /* @__PURE__ */ jsx(Staggered, { i, animate, children: /* @__PURE__ */ jsxs(
+                  Pressable,
+                  {
+                    accessibilityRole: "button",
+                    accessibilityLabel: s.label,
+                    onPress: () => send(s.prompt ?? s.label, []),
+                    style: ({ pressed }) => [styles.followUp, pressed && styles.pressed],
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        Icon,
+                        {
+                          name: s.icon ?? "arrow-right",
+                          size: theme.icon.xs,
+                          color: theme.color.text3
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(Text, { style: styles.followUpText, children: s.label })
+                    ]
+                  }
+                ) }, s.id ?? s.label)) }) : null
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Animated.View,
+            {
+              pointerEvents: pinned ? "none" : "box-none",
+              importantForAccessibility: pinned ? "no-hide-descendants" : "auto",
+              accessibilityElementsHidden: pinned,
+              style: [
+                styles.pillWrap,
+                {
+                  opacity: pill,
+                  transform: [
+                    {
+                      translateY: pill.interpolate({
+                        inputRange: [0, 1],
+                        outputRange: [theme.space[8], 0]
+                      })
+                    }
+                  ]
+                }
+              ],
+              children: /* @__PURE__ */ jsxs(
+                Pressable,
+                {
+                  accessibilityRole: "button",
+                  accessibilityLabel: pillLabel,
+                  onPress: () => scrollToBottom(),
+                  style: styles.pill,
+                  children: [
+                    running ? /* @__PURE__ */ jsx(Thinking, { label: "", size: "sm", announce: false, motion }) : /* @__PURE__ */ jsx(Icon, { name: "arrow-down", size: theme.icon.xs, color: theme.color.text }),
+                    /* @__PURE__ */ jsx(Text, { style: styles.pillText, children: pillLabel })
+                  ]
+                }
+              )
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(
+          ChatComposer,
+          {
+            inputRef,
+            value: draft,
+            onValueChange: setDraft,
+            onSend: send,
+            replyTo: replyingTo ? {
+              author: replyingTo.role === "user" ? user?.name ?? labels.you : assistant.name,
+              text: chatMessageText(replyingTo)
+            } : null,
+            onCancelReply: () => setReplyingTo(null),
+            running,
+            onStop,
+            placeholder,
+            attachments,
+            onAttach,
+            accept,
+            recall: lastUserText,
+            onRemoveAttachment,
+            toolbar: composerToolbar,
+            hint: disclaimer,
+            disabled,
+            motion,
+            labels,
+            style: [styles.composer, column],
+            ...composerFeatures
+          }
+        )
+      ]
+    }
+  );
+}
+var sheet9 = createStyleSheet((theme) => ({
+  root: { flex: 1, backgroundColor: theme.color.surface },
+  stage: { flex: 1 },
+  content: { flexGrow: 1, gap: theme.space.s6, padding: theme.space.s4 },
+  older: { alignItems: "center" },
+  olderText: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.caption1.fontSize,
+    color: theme.color.text3
+  },
+  empty: {
+    flex: 1,
+    justifyContent: "center",
+    gap: theme.space.s2,
+    paddingVertical: theme.space.s8
+  },
+  emptyHead: { alignItems: "center", gap: theme.space.s3, marginBottom: theme.space.s4 },
+  emptyTitle: {
+    fontFamily: theme.font.display,
+    fontSize: theme.type.title3.fontSize,
+    lineHeight: theme.type.title3.lineHeight,
+    fontWeight: theme.fontWeight.bold,
+    color: theme.color.text,
+    textAlign: "center"
+  },
+  emptyText: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    lineHeight: theme.type.footnote.lineHeight,
+    color: theme.color.text2,
+    textAlign: "center"
+  },
+  pressed: { backgroundColor: theme.state.pressed },
+  meta: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.caption1.fontSize,
+    lineHeight: theme.type.caption1.lineHeight,
+    color: theme.color.text3
+  },
+  day: { flexDirection: "row", alignItems: "center", gap: theme.space.s3 },
+  dayLine: { flex: 1, height: theme.borderWidth.base, backgroundColor: theme.color.border },
+  dayText: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.caption1.fontSize,
+    fontWeight: theme.fontWeight.bold,
+    color: theme.color.text3
+  },
+  pending: { flexDirection: "row", gap: theme.space.s3, alignItems: "center" },
+  followUps: {
+    flexDirection: "row",
+    flexWrap: "wrap",
+    gap: theme.space.s2,
+    paddingLeft: theme.ctl.sm + theme.space.s3
+  },
+  followUp: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space[6],
+    paddingHorizontal: theme.space.s3,
+    paddingVertical: theme.space.s2,
+    borderRadius: theme.radius.full,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.color.border
+  },
+  followUpText: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    color: theme.color.text2
+  },
+  pillWrap: {
+    position: "absolute",
+    left: 0,
+    right: 0,
+    bottom: theme.space.s3,
+    alignItems: "center"
+  },
+  pill: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space[6],
+    paddingHorizontal: theme.space.s3,
+    paddingVertical: theme.space.s2,
+    borderRadius: theme.radius.full,
+    borderWidth: theme.borderWidth.base,
+    borderColor: theme.color.border,
+    backgroundColor: theme.color.surface,
+    ...theme.shadow.md
+  },
+  // The sm tier's label role, so the pill reads beside the sm actions (R12).
+  pillText: {
+    ...theme.ctl.label.sm,
+    fontFamily: theme.font.sans,
+    color: theme.color.text
+  },
+  composer: { paddingHorizontal: theme.space.s4, paddingBottom: theme.space.s4 }
+}));
+function ChatHistory({
+  conversations,
+  activeId,
+  onSelect,
+  onNew,
+  onRename,
+  onDelete,
+  query: queryProp,
+  defaultQuery = "",
+  defaultRenamingId,
+  onQueryChange,
+  labels: labelsProp
+}) {
+  const labels = useLabels("chat", DEFAULT_CHAT_LABELS, labelsProp);
+  const { styles } = useStyles(sheet10);
+  const theme = useLoamTheme("chat");
+  const android = isAndroidIdiom(theme);
+  const [inner, setInner] = React10.useState(defaultQuery);
+  const query = queryProp ?? inner;
+  const initialRename = onRename ? conversations.find((c) => c.id === defaultRenamingId) ?? null : null;
+  const [menuFor, setMenuFor] = React10.useState(initialRename);
+  const [renaming, setRenaming] = React10.useState(initialRename !== null);
+  const [draft, setDraft] = React10.useState(initialRename?.title ?? "");
+  const shown = conversations.filter((c) => c.title.toLowerCase().includes(query.trim().toLowerCase()));
+  const groups = [];
+  for (const c of shown) {
+    const last = groups[groups.length - 1];
+    if (last && last.title === c.group) last.rows.push(c);
+    else groups.push({ title: c.group, rows: [c] });
+  }
+  const hasMenu = !!onRename || !!onDelete;
+  const closeMenu = () => {
+    setMenuFor(null);
+    setRenaming(false);
+  };
+  return /* @__PURE__ */ jsxs(View, { style: styles.root, role: "navigation", accessibilityLabel: labels.chats, children: [
+    /* @__PURE__ */ jsxs(View, { style: styles.head, children: [
+      /* @__PURE__ */ jsx(Text, { accessibilityRole: "header", style: styles.title, children: labels.chats }),
+      onNew ? /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", leadingIcon: "plus", onPress: onNew, children: labels.newChat }) : null
+    ] }),
+    /* @__PURE__ */ jsx(View, { style: styles.search, children: /* @__PURE__ */ jsx(
+      Input,
+      {
+        accessibilityLabel: labels.searchChats,
+        placeholder: labels.searchChats,
+        leadingIcon: "search",
+        value: query,
+        onChangeText: (t) => {
+          if (queryProp === void 0) setInner(t);
+          onQueryChange?.(t);
+        }
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(ScrollView, { style: styles.scroll, contentContainerStyle: styles.list, children: [
+      shown.length === 0 ? /* @__PURE__ */ jsx(Text, { style: styles.empty, children: labels.noChats }) : null,
+      groups.map((g, i) => /* @__PURE__ */ jsxs(View, { role: "list", accessibilityLabel: g.title, children: [
+        g.title ? /* @__PURE__ */ jsx(Text, { style: styles.group, children: g.title }) : null,
+        g.rows.map((c) => {
+          const active = c.id === activeId;
+          return /* @__PURE__ */ jsx(View, { role: "listitem", children: /* @__PURE__ */ jsxs(
+            Pressable,
+            {
+              accessibilityRole: "button",
+              accessibilityLabel: c.title,
+              accessibilityState: { selected: active },
+              "aria-current": active ? "page" : void 0,
+              accessibilityActions: hasMenu ? [
+                ...onRename ? [{ name: "rename", label: labels.renameChat }] : [],
+                ...onDelete ? [{ name: "delete", label: labels.delete }] : []
+              ] : void 0,
+              onAccessibilityAction: (e) => {
+                if (e.nativeEvent.actionName === "delete") onDelete?.(c.id);
+                if (e.nativeEvent.actionName === "rename") {
+                  setDraft(c.title);
+                  setMenuFor(c);
+                  setRenaming(true);
+                }
+              },
+              onPress: () => onSelect?.(c.id),
+              onLongPress: hasMenu ? () => setMenuFor(c) : void 0,
+              style: ({ pressed }) => [
+                styles.row,
+                // OS list row: 48 on iOS, 56 on Android.
+                android && { minHeight: theme.space[56] },
+                active && styles.rowActive,
+                pressed && styles.down
+              ],
+              children: [
+                /* @__PURE__ */ jsx(Text, { numberOfLines: 1, style: [styles.rowTitle, active && styles.rowTitleActive], children: c.title }),
+                c.status === "answering" ? /* @__PURE__ */ jsx(Thinking, { size: "sm", label: labels.answering, announce: false }) : c.status === "unseen" ? /* @__PURE__ */ jsx(View, { accessibilityLabel: labels.unread, role: "img", style: styles.dot }) : null
+              ]
+            }
+          ) }, c.id);
+        })
+      ] }, `${g.title ?? ""}${i}`))
+    ] }),
+    menuFor ? /* @__PURE__ */ jsx(Sheet, { open: true, title: menuFor.title, onClose: closeMenu, closeLabel: labels.close, children: renaming ? /* @__PURE__ */ jsxs(View, { style: styles.rename, children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          accessibilityLabel: labels.renameChat,
+          value: draft,
+          onChangeText: setDraft,
+          autoFocus: true
+        }
+      ),
+      /* @__PURE__ */ jsxs(View, { style: styles.renameActions, children: [
+        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "lg", onPress: closeMenu, children: labels.cancel }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            size: "lg",
+            disabled: !draft.trim(),
+            onPress: () => {
+              onRename?.(menuFor.id, draft.trim());
+              closeMenu();
+            },
+            children: labels.save
+          }
+        )
+      ] })
+    ] }) : /* @__PURE__ */ jsxs(View, { style: styles.menu, children: [
+      onRename ? /* @__PURE__ */ jsx(
+        MenuRow,
+        {
+          icon: "edit",
+          label: labels.renameChat,
+          onPress: () => {
+            setDraft(menuFor.title);
+            setRenaming(true);
+          }
+        }
+      ) : null,
+      onDelete ? /* @__PURE__ */ jsx(
+        MenuRow,
+        {
+          icon: "trash",
+          label: labels.delete,
+          danger: true,
+          onPress: () => {
+            onDelete(menuFor.id);
+            closeMenu();
+          }
+        }
+      ) : null
+    ] }) }) : null
+  ] });
+  function MenuRow({
+    icon,
+    label,
+    danger,
+    onPress
+  }) {
+    return /* @__PURE__ */ jsxs(
+      Pressable,
+      {
+        accessibilityRole: "button",
+        accessibilityLabel: label,
+        onPress,
+        style: ({ pressed }) => [styles.menuRow, pressed && styles.down],
+        children: [
+          /* @__PURE__ */ jsx(Icon, { name: icon, size: theme.icon.sm, color: danger ? theme.color.dangerOnSoft : theme.color.text2 }),
+          /* @__PURE__ */ jsx(Text, { style: [styles.rowTitle, danger && { color: theme.color.dangerOnSoft }], children: label })
+        ]
+      }
+    );
+  }
+}
+var sheet10 = createStyleSheet((theme) => ({
+  root: { flex: 1, backgroundColor: theme.color.surface },
+  head: {
+    minHeight: theme.space[56],
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    paddingHorizontal: theme.space[16]
+  },
+  title: {
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.headline.fontSize,
+    fontWeight: theme.fontWeight.semibold,
+    color: theme.color.text
+  },
+  search: { paddingHorizontal: theme.space[12], paddingBottom: theme.space[8] },
+  scroll: { flex: 1 },
+  list: { padding: theme.space[8], gap: theme.space[8] },
+  group: {
+    ...theme.type.overline,
+    paddingHorizontal: theme.space[8],
+    paddingVertical: theme.space[4],
+    fontFamily: theme.font.sans,
+    color: theme.color.text3
+  },
+  empty: {
+    padding: theme.space[16],
+    textAlign: "center",
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.footnote.fontSize,
+    color: theme.color.text2
+  },
+  row: {
+    minHeight: theme.space[48],
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s3,
+    paddingHorizontal: theme.space[12],
+    borderRadius: theme.radius.md
+  },
+  rowActive: { backgroundColor: theme.state.selected },
+  down: { backgroundColor: theme.state.pressed },
+  rowTitle: {
+    flex: 1,
+    minWidth: 0,
+    fontFamily: theme.font.sans,
+    fontSize: theme.type.callout.fontSize,
+    lineHeight: theme.type.callout.lineHeight,
+    color: theme.color.text
+  },
+  rowTitleActive: { fontWeight: theme.fontWeight.medium },
+  dot: {
+    width: theme.space[8],
+    height: theme.space[8],
+    borderRadius: theme.radius.full,
+    backgroundColor: theme.color.accent
+  },
+  menu: { padding: theme.space[8] },
+  menuRow: {
+    minHeight: theme.space[48],
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.space.s3,
+    paddingHorizontal: theme.space[12],
+    borderRadius: theme.radius.md
+  },
+  rename: { padding: theme.space[16], gap: theme.space[12] },
+  renameActions: { flexDirection: "row", justifyContent: "flex-end", gap: theme.space.s2 }
+}));
+
+export { ApprovalView, CHAT_FEEDBACK_REASONS, Chat, ChatArtifactCard, ChatArtifactSheet, ChatComposer, ChatHistory, ChatInlineTable, ChatSlashMenu, CitationMark, SourcesRow, SourcesSheet, VersionSwitcher, chatMessageText, chatSlashEntries, findChatTrigger };