@alia.onl/sdk 19.1.0 → 20.1.0

package/CHANGELOG.md

@@ -1,5 +1,46 @@
 # @alia.onl/sdk
 
+## 20.1.0
+
+The one sheet is the whole surface an app needs for an agent: it picks a conversation up again and
+the app can close it.
+
+### Added
+
+- **`useAskAgent().resume(agentKey, conversationId)`** opens the sheet of that agent on a stored
+  conversation, where the person left it (`AliaChatSheetRef.resume`).
+- **`useAskAgent().dismiss()`**, and `AliaAskProvider` forwards a ref to the same `AliaAsk`, for
+  the code that configures the sheet and so sits above it — a host-tool executor that changed the
+  page under the sheet closes it once the turn is written.
+- **The sheet's recent conversations.** Under the greeting, the person's three latest conversations
+  with the lead (`AliaRecentConversations`; Alia's sheet lists any). `recentConversations={false}`
+  turns it off. New label `recentConversations` (`'Recent'`).
+- **`AliaChatContent` `welcomeAccessory`**, drawn under the empty chat's greeting.
+
+## 20.0.0
+
+Generic chat UI is Bloom's; the SDK composes it and keeps only what is Alia's. Two copies the SDK
+carried of things Bloom already had are deleted (a clean cut: no aliases).
+
+### Removed
+
+- **`AliaMarkdown`, `AliaMarkdownProps` and `RenderCodeBlock`.** Replies render with Bloom's
+  `Markdown` (`@oxy.so/bloom/markdown`, `size="lg"`), which streams (an unfinished trailing
+  construct is closed instead of showing its markers, and only the last block is re-read), draws
+  accessible links (`role="link"`, an anchor on web) and vets every URL. `react-native-markdown-display`
+  is no longer a dependency. A Markdown image (an exclamation mark before a link) now reads as a link carrying its alt
+  text and is not fetched; Alia's own images arrive as `[ALIA_IMAGE]` blocks and are unchanged.
+- **`joinFlights`.** The join choreography is Bloom's `useAvatarJoin` / `avatarJoinFlights`
+  (`@oxy.so/bloom/avatar-flight`), the same one Bloom's `MultiAgentChat` uses; `useParticipants`
+  wires the conversation's consulted agents into it, with the same behaviour.
+
+### Changed
+
+- **`ReplyMarkdown`** takes `streaming`, and `onCitationPress` now also receives an inline `[n]`
+  marker that names a source (Bloom's `onLinkPress`), not only the references list.
+- **`AliaParticipantsHeader`** is Bloom's `AiChatHeader` around `AliaParticipants`.
+- **Peer `@oxy.so/bloom` >= 10.17.0**, the first release with `useAvatarJoin` and `AiChatHeader`.
+
 ## 19.1.0
 
 An app's own agent may be confined to that app by Oxy (Alia ADR 0021, Oxy ADRs 0044 and 0045).

package/README.md

@@ -163,10 +163,16 @@ import { AliaAskProvider, useAskAgent } from '@alia.onl/sdk';
   {children}
 </AliaAskProvider>;
 
-const { ask } = useAskAgent();
+const { ask, resume, dismiss } = useAskAgent();
 ask('sindi', { text: 'Is this flat a good price?' }); // signed out: Oxy's sign-in instead
+resume('sindi', conversationId); // a stored conversation, where the person left it
+dismiss(); // e.g. after a host tool changed the page under the sheet
 ```
 
+The sheet offers the person's latest conversations with its lead under the greeting
+(`recentConversations={false}` turns it off). The code that configures the sheet sits above it, so
+`AliaAskProvider` forwards a ref to the same `AliaAsk` for it.
+
 - **The lead.** `agent={{ id }}` (on `AliaChatSheet`, `AliaChatScreen` and `AliaChatContent`) makes
   that agent the conversation's lead: its greeting, name, character and starters
   (`GET /v1/agents/:id/profile`) and the header's first avatar. Omitted, Alia.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alia.onl/sdk",
-  "version": "19.1.0",
+  "version": "20.1.0",
   "description": "Alia AI chat SDK — the conversation runtime, chat UI, voice calls and dictation for Oxy apps",
   "main": "src/index.ts",
   "react-native": "src/index.ts",
@@ -43,7 +43,6 @@
   },
   "dependencies": {
     "clsx": "^2.1.1",
-    "react-native-markdown-display": "^7.0.2",
     "socket.io-client": "^4.8.3",
     "tailwind-merge": "^3.7.0",
     "zustand": "^5.0.15"
@@ -52,7 +51,7 @@
     "react": "^19.2.3",
     "react-native": "^0.86.0",
     "@expo/vector-icons": "^15.1.1",
-    "@oxy.so/bloom": ">=10.9.0",
+    "@oxy.so/bloom": ">=10.17.0",
     "@oxy.so/core": ">=3.0.0",
     "@oxy.so/services": ">=11.12.0",
     "@tanstack/react-query": "^5.101",

package/src/components/AliaAskProvider.tsx

@@ -10,10 +10,12 @@
 import { useAuth } from '@oxy.so/services/ui/client';
 import {
   createContext,
+  forwardRef,
   type ReactNode,
   useCallback,
   useContext,
   useEffect,
+  useImperativeHandle,
   useMemo,
   useRef,
   useState,
@@ -38,6 +40,7 @@ export interface AliaAskProviderProps
     | 'apiUrl'
     | 'characterRuntimeUrl'
     | 'headerMenu'
+    | 'recentConversations'
   > {
   /** The agents `ask` opens, by key. Omitted, the sheet only ever opens on Alia. */
   agents?: AliaAskAgents;
@@ -52,6 +55,13 @@ export interface AliaAsk {
    * ("ask Sindi about this listing"). Signed out, opens Oxy's sign-in instead.
    */
   ask: (agentKey?: string, turn?: AliaTurn) => void;
+  /** Open the sheet on the agent `agentKey` (omitted, Alia), on its stored conversation `conversationId`. */
+  resume: (agentKey: string | undefined, conversationId: string) => void;
+  /**
+   * Close the sheet — a host tool that changed the page under it shows the person the result, once
+   * the turn has been written.
+   */
+  dismiss: () => void;
 }
 
 const AskContext = createContext<AliaAsk | null>(null);
@@ -67,16 +77,20 @@ export function useAskAgent(): AliaAsk {
 interface Opening {
   key: string | undefined;
   turn: AliaTurn | undefined;
+  /** A stored conversation to open instead of the welcome. */
+  conversationId?: string;
   /** Changes on every `ask`, so asking the same agent twice opens twice. */
   serial: number;
 }
 
-export function AliaAskProvider({
-  agents,
-  welcomeSuggestions,
-  children,
-  ...sheet
-}: AliaAskProviderProps) {
+/**
+ * Mounts the app's one sheet. Its ref is the same `AliaAsk` as `useAskAgent()`, for the code that
+ * configures the sheet and so sits above it — a host-tool executor that closes it.
+ */
+export const AliaAskProvider = forwardRef<AliaAsk, AliaAskProviderProps>(function AliaAskProvider(
+  { agents, welcomeSuggestions, children, ...sheet },
+  ref,
+) {
   const { canUsePrivateApi, signIn } = useAuth();
   const sheetRef = useRef<AliaChatSheetRef>(null);
   const [opening, setOpening] = useState<Opening | null>(null);
@@ -84,8 +98,8 @@ export function AliaAskProvider({
   const agentsRef = useRef(agents);
   agentsRef.current = agents;
 
-  const ask = useCallback(
-    (agentKey?: string, turn?: AliaTurn) => {
+  const open = useCallback(
+    (agentKey: string | undefined, turn?: AliaTurn, conversationId?: string) => {
       if (agentKey !== undefined && agentsRef.current?.[agentKey] === undefined) {
         throw new Error(`AliaAskProvider has no agent "${agentKey}"`);
       }
@@ -94,21 +108,35 @@ export function AliaAskProvider({
         return;
       }
       setCurrent(agentKey);
-      setOpening((previous) => ({ key: agentKey, turn, serial: (previous?.serial ?? 0) + 1 }));
+      setOpening((previous) => ({
+        key: agentKey,
+        turn,
+        ...(conversationId === undefined ? {} : { conversationId }),
+        serial: (previous?.serial ?? 0) + 1,
+      }));
     },
     [canUsePrivateApi, signIn],
   );
+  const ask = useCallback((agentKey?: string, turn?: AliaTurn) => open(agentKey, turn), [open]);
+  const resume = useCallback(
+    (agentKey: string | undefined, conversationId: string) =>
+      open(agentKey, undefined, conversationId),
+    [open],
+  );
+  const dismiss = useCallback(() => sheetRef.current?.dismiss(), []);
 
   // Presented once the sheet for that agent is the one mounted (a different agent is a new sheet).
   useEffect(() => {
     if (opening === null || opening.key !== current) return;
-    sheetRef.current?.present(opening.turn);
+    if (opening.conversationId !== undefined) sheetRef.current?.resume(opening.conversationId);
+    else sheetRef.current?.present(opening.turn);
     setOpening(null);
   }, [opening, current]);
 
   const agentId = current === undefined ? undefined : agents?.[current]?.id;
   const agent = useMemo(() => (agentId === undefined ? undefined : { id: agentId }), [agentId]);
-  const value = useMemo<AliaAsk>(() => ({ ask }), [ask]);
+  const value = useMemo<AliaAsk>(() => ({ ask, resume, dismiss }), [ask, resume, dismiss]);
+  useImperativeHandle(ref, () => value, [value]);
 
   return (
     <AskContext.Provider value={value}>
@@ -124,4 +152,4 @@ export function AliaAskProvider({
       ) : null}
     </AskContext.Provider>
   );
-}
+});

package/src/components/AliaChatContent.tsx

@@ -170,6 +170,8 @@ export interface AliaChatContentProps {
   welcomeSubtitle?: string;
   /** The lines offered over the composer on an empty chat; omitted, the agent's starters. */
   welcomeSuggestions?: AliaSuggestion[];
+  /** Drawn under the empty chat's greeting — the sheet's recent conversations with its lead. */
+  welcomeAccessory?: ReactNode;
   /** What the host found for the typed text (see `onSuggestionQuery`). */
   suggestionMatches?: AliaSuggestion[];
   /** The typed text, once typing has settled, for the host to search suggestions with. */
@@ -279,6 +281,7 @@ function AliaConversationView({
   welcomeGreeting,
   welcomeSubtitle,
   welcomeSuggestions,
+  welcomeAccessory,
   suggestionMatches,
   onSuggestionQuery,
   onSuggestionPicked,
@@ -471,9 +474,12 @@ function AliaConversationView({
   const welcome = useMemo(
     () =>
       profileLoading ? null : (
-        <AliaWelcomeMessage greeting={greeting} subtitle={welcomeSubtitle} lead={lead} />
+        <View className="items-center gap-8">
+          <AliaWelcomeMessage greeting={greeting} subtitle={welcomeSubtitle} lead={lead} />
+          {welcomeAccessory}
+        </View>
       ),
-    [profileLoading, greeting, welcomeSubtitle, lead],
+    [profileLoading, greeting, welcomeSubtitle, lead, welcomeAccessory],
   );
 
   // ── The agent's offer to start the next stretch fresh ──

package/src/components/AliaChatSheet.tsx

@@ -30,6 +30,7 @@ import {
   type AliaChatContentProps,
 } from './AliaChatContent';
 import { AliaChatHeader } from './AliaChatHeader';
+import { AliaRecentConversations } from './AliaRecentConversations';
 import { ThoughtPanel } from './thought/ThoughtPanel';
 import type { AliaSuggestion } from '../types';
 
@@ -88,6 +89,8 @@ export interface AliaChatSheetProps {
   onShare?: (share: AliaConversationShare) => void;
   /** More rows for the header's menu (`DropdownMenuItem`s from `@oxy.so/bloom/dropdown-menu`). */
   headerMenu?: React.ReactNode;
+  /** The person's latest conversations with the lead, under the greeting. Default `true`. */
+  recentConversations?: boolean;
 }
 
 export interface AliaChatSheetRef {
@@ -97,6 +100,9 @@ export interface AliaChatSheetRef {
    * opens on its welcome, with the composer focused.
    */
   present: (turn?: AliaTurn) => void;
+  /** Opens the sheet on a stored conversation with its lead, where the person left it. */
+  resume: (conversationId: string) => void;
+  /** Closes the sheet and what is stacked on it, stopping a turn still being written. */
   dismiss: () => void;
 }
 
@@ -121,6 +127,7 @@ export const AliaChatSheet = forwardRef<AliaChatSheetRef, AliaChatSheetProps>(
       characterRuntimeUrl = ALIA_CHARACTER_RUNTIME_URL,
       onShare,
       headerMenu,
+      recentConversations = true,
     },
     ref,
   ) => {
@@ -135,9 +142,13 @@ export const AliaChatSheet = forwardRef<AliaChatSheetRef, AliaChatSheetProps>(
     const mainStopRef = useRef<(() => void) | null>(null);
     const conversationStopRef = useRef<(() => void) | null>(null);
 
-    // The conversation sheet, stacked over the main one while a chat is open. The key makes
-    // every conversation a fresh chat.
-    const [conversation, setConversation] = useState<{ key: number; turn: AliaTurn } | null>(null);
+    // The conversation sheet, stacked over the main one while a chat is open: begun by a first
+    // turn, or a stored one picked up again. The key makes every opening a fresh chat.
+    const [conversation, setConversation] = useState<{
+      key: number;
+      turn?: AliaTurn;
+      conversationId?: string;
+    } | null>(null);
 
     const registerMainStop = useCallback((stop: (() => void) | null) => {
       mainStopRef.current = stop;
@@ -149,6 +160,13 @@ export const AliaChatSheet = forwardRef<AliaChatSheetRef, AliaChatSheetProps>(
     const startConversation = useCallback((turn: AliaTurn) => {
       setConversation((current) => ({ key: (current?.key ?? 0) + 1, turn }));
     }, []);
+    const resumeConversation = useCallback((conversationId: string) => {
+      setConversation((current) => ({ key: (current?.key ?? 0) + 1, conversationId }));
+    }, []);
+    // The chat inside follows its conversation (a first turn creates it, "start over" leaves it).
+    const followConversation = useCallback((conversationId: string | undefined) => {
+      setConversation((current) => (current ? { ...current, conversationId } : current));
+    }, []);
     useEffect(() => {
       if (conversation) conversationRef.current?.present();
     }, [conversation]);
@@ -197,9 +215,13 @@ export const AliaChatSheet = forwardRef<AliaChatSheetRef, AliaChatSheetProps>(
           mainRef.current?.present();
           if (turn) startConversation(turn);
         },
+        resume: (conversationId) => {
+          mainRef.current?.present();
+          resumeConversation(conversationId);
+        },
         dismiss: handleDismiss,
       }),
-      [handleDismiss, startConversation],
+      [handleDismiss, startConversation, resumeConversation],
     );
 
     // Closing the main sheet (a drag, backdrop press, Back or Escape) closes what is stacked on it.
@@ -282,6 +304,11 @@ export const AliaChatSheet = forwardRef<AliaChatSheetRef, AliaChatSheetProps>(
             welcomeSuggestions={welcomeSuggestions}
             suggestionMatches={suggestionMatches}
             onSuggestionQuery={onSuggestionQuery}
+            welcomeAccessory={
+              recentConversations ? (
+                <AliaRecentConversations agentId={agent?.id} onOpen={resumeConversation} />
+              ) : undefined
+            }
             presentedProgress={mainProgress}
             onStopReady={registerMainStop}
             onStart={startConversation}
@@ -303,6 +330,8 @@ export const AliaChatSheet = forwardRef<AliaChatSheetRef, AliaChatSheetProps>(
             <AliaChatContent
               {...shared}
               initialTurn={conversation.turn}
+              conversationId={conversation.conversationId}
+              onConversationChange={followConversation}
               presentedProgress={conversationProgress}
               onStopReady={registerConversationStop}
               chrome={conversationChrome}

package/src/components/AliaParticipants.tsx

@@ -1,22 +1,21 @@
 /**
  * The conversation's participants: Bloom's `AgentProfile` with `[lead, ...joined]`, and the
- * choreography by which a consulted agent joins it (ADR 0020 §7).
+ * agents joining it (ADR 0020 §7).
  *
  * When the lead consults another agent (`alia.agent_start`), the agent's reply appears in the
  * thread under its own identity (anchor `reply:<agentId>`), and that avatar flies into the header
- * — Bloom's multi-agent join: `centeredLanding`, merging into the profile, staggered when several
- * join at once. The header gains the agent only when its flight lands; with reduced motion, or
- * when there is nothing to measure, it gains it at once. An agent already in the conversation
- * when the chat opens is simply there.
+ * through Bloom's `useAvatarJoin`: one choreography for every multi-agent conversation, Bloom's
+ * own `MultiAgentChat` included. The header gains the agent only when its flight lands; with
+ * reduced motion, or when there is nothing to measure, it gains it at once. An agent already in
+ * the conversation when the chat opens is simply there.
  *
- * This is the ONLY file that draws `AgentProfile` or builds a join flight
- * (`one-thread.test.tsx` holds it), so the header of the sheet, the screen and the Alia app are
- * one header.
+ * This is the ONLY file that draws `AgentProfile` or joins agents to it (`one-thread.test.tsx`
+ * holds it), so the header of the sheet, the screen and the Alia app are one header.
  */
 
 import { AgentProfile } from '@oxy.so/bloom/agent-reply';
-import { type AvatarFlights, centeredLanding } from '@oxy.so/bloom/avatar-flight';
-import { memo, useEffect, useMemo, useRef, useState } from 'react';
+import { type AvatarFlights, useAvatarJoin } from '@oxy.so/bloom/avatar-flight';
+import { memo, useMemo } from 'react';
 import { ANCHORS, useAliaFlights } from '../lib/flights';
 import {
   type AliaChatParticipants,
@@ -26,45 +25,6 @@ import {
 } from '../lib/participants';
 import type { Message } from '../runtime/types';
 
-/** As Bloom's multi-agent chat flies a waiting agent into its profile. */
-const JOIN_DURATION = 950;
-const JOIN_STAGGER = 120;
-const JOIN_LANDING_SIZE = 14;
-
-/** The flights of agents joining the header: from each one's reply, merging into the profile. */
-export function joinFlights(agents: readonly AliaParticipant[]) {
-  return agents.map((agent, index) => ({
-    key: `join:${agent.id}`,
-    character: agent.character,
-    from: ANCHORS.reply(agent.id),
-    to: ANCHORS.profile,
-    landing: centeredLanding(JOIN_LANDING_SIZE),
-    duration: JOIN_DURATION,
-    delay: index * JOIN_STAGGER,
-    merge: true,
-  }));
-}
-
-/** Two frames: the reply that carries the avatar mounts, then lays out, before it is measured. */
-function afterLayout(run: () => void): () => void {
-  const raf =
-    typeof requestAnimationFrame === 'function'
-      ? requestAnimationFrame
-      : (callback: () => void) => setTimeout(callback, 16) as unknown as number;
-  const cancelRaf =
-    typeof cancelAnimationFrame === 'function'
-      ? cancelAnimationFrame
-      : (id: number) => clearTimeout(id as unknown as ReturnType<typeof setTimeout>);
-  let second: number | undefined;
-  const first = raf(() => {
-    second = raf(run);
-  });
-  return () => {
-    cancelRaf(first);
-    if (second !== undefined) cancelRaf(second);
-  };
-}
-
 export interface UseParticipantsOptions {
   lead: AliaLead;
   messages: readonly Message[];
@@ -72,97 +32,33 @@ export interface UseParticipantsOptions {
   flights: AvatarFlights | null;
 }
 
-/**
- * Who the header shows, and the joins under way.
- *
- * One batch flies at a time: agents that start answering while a batch (or the lead's own
- * welcome flight) is in the air wait for it to land, then fly together, staggered.
- */
+const fromReply = (agent: AliaParticipant) => ANCHORS.reply(agent.id);
+const characterOf = (agent: AliaParticipant) => agent.character;
+
+/** Who the header shows: the lead, then the agents it consulted as each one's avatar lands. */
 export function useParticipants({
   lead,
   messages,
   flights,
 }: UseParticipantsOptions): AliaChatParticipants {
-  const consulted = useMemo(() => consultedAgents(messages, lead.id), [messages, lead.id]);
-  const [joined, setJoined] = useState<AliaParticipant[]>([]);
-  /** Agents waiting for a flight, and the batch in the air (`launched` once it took off). */
-  const queue = useRef<AliaParticipant[]>([]);
-  const [batch, setBatch] = useState<{ agents: AliaParticipant[]; launched: boolean } | null>(null);
-  const [queued, setQueued] = useState(0);
-  const flightsRef = useRef(flights);
-  flightsRef.current = flights;
-
-  // A new lead is a new conversation: nobody has joined it.
-  // biome-ignore lint/correctness/useExhaustiveDependencies: reset on the lead alone
-  useEffect(() => {
-    queue.current = [];
-    setJoined([]);
-    setBatch(null);
-  }, [lead.id]);
-
-  // Everybody who answered is in the header, or on the way to it.
-  useEffect(() => {
-    const known = new Set([
-      ...joined.map((agent) => agent.id),
-      ...queue.current.map((agent) => agent.id),
-      ...(batch?.agents.map((agent) => agent.id) ?? []),
-    ]);
-    const already: AliaParticipant[] = [];
-    let waiting = false;
-    for (const { participant, live } of consulted) {
-      if (known.has(participant.id)) continue;
-      if (live && flightsRef.current !== null) {
-        queue.current = [...queue.current, participant];
-        waiting = true;
-      } else {
-        already.push(participant);
-      }
-    }
-    if (already.length > 0) setJoined((current) => [...current, ...already]);
-    if (waiting) setQueued((count) => count + 1);
-  }, [consulted, joined, batch]);
-
-  // A batch takes off once nothing else is landing on the header.
-  const landing = flights?.isLanding(ANCHORS.profile) ?? false;
-  // biome-ignore lint/correctness/useExhaustiveDependencies: `queued` signals the queue (a ref) grew
-  useEffect(() => {
-    if (batch !== null || landing || queue.current.length === 0) return;
-    const agents = queue.current;
-    queue.current = [];
-    setBatch({ agents, launched: false });
-  }, [batch, landing, queued]);
-
-  useEffect(() => {
-    if (batch === null || batch.launched) return;
-    let live = true;
-    const cancel = afterLayout(() => {
-      const current = flightsRef.current;
-      void (current ? current.launch(joinFlights(batch.agents)) : Promise.resolve(false)).then(
-        (flying) => {
-          if (!live) return;
-          if (flying) setBatch({ agents: batch.agents, launched: true });
-          else {
-            // Reduced motion, nothing measurable, or superseded: they join without flying.
-            setJoined((current) => [...current, ...batch.agents]);
-            setBatch(null);
-          }
-        },
-      );
-    });
-    return () => {
-      live = false;
-      cancel();
-    };
-  }, [batch]);
-
-  // The batch is in: the header gains its agents as their avatars land.
-  useEffect(() => {
-    if (batch === null || !batch.launched || landing) return;
-    setJoined((current) => [...current, ...batch.agents]);
-    setBatch(null);
-  }, [batch, landing]);
-
-  return useMemo(() => ({ lead, joined }), [lead, joined]);
+  const arrivals = useMemo(
+    () =>
+      consultedAgents(messages, lead.id).map(({ participant, live }) => ({
+        agent: participant,
+        live,
+      })),
+    [messages, lead.id],
+  );
+  const joined = useAvatarJoin({
+    arrivals,
+    flights,
+    from: fromReply,
+    to: ANCHORS.profile,
+    character: characterOf,
+    // A new lead is a new conversation: nobody has joined it.
+    resetKey: lead.id,
+  });
+  return useMemo(() => ({ lead, joined: [...joined] }), [lead, joined]);
 }
 
 export interface AliaParticipantsProps {

package/src/components/AliaParticipantsHeader.tsx

@@ -1,8 +1,5 @@
-import { useAiChatShell } from '@oxy.so/bloom/ai-chat';
-import { Button } from '@oxy.so/bloom/button';
-import { RiMenuLine } from '@oxy.so/bloom/icons/RiMenuLine';
+import { AiChatHeader } from '@oxy.so/bloom/ai-chat';
 import { memo } from 'react';
-import { View } from 'react-native';
 import type { AliaChatParticipants } from '../lib/participants';
 import { AliaParticipants } from './AliaParticipants';
 
@@ -13,48 +10,18 @@ export interface AliaParticipantsHeaderProps {
 }
 
 /**
- * The conversation's header inside Bloom's AI chat shell: the participants as its title, between
- * the shell's own buttons — the navigation drawer's on a narrow screen and the panel's below `xl`,
- * as `AiChatMobileHeader` places them. That header's title is a string; this one is the
- * conversation's participants, so a host puts this in `chrome.header` instead of drawing a title
- * of its own. Outside a shell it is the participants alone.
+ * The conversation's header inside Bloom's AI chat shell: the participants as its title, in
+ * Bloom's `AiChatHeader`, between the shell's own navigation and panel buttons on a compact
+ * screen. A host puts this in `chrome.header` instead of drawing a title of its own. Outside a
+ * shell it is the participants alone.
  */
 export const AliaParticipantsHeader = memo(function AliaParticipantsHeader({
   participants,
   onPress,
 }: AliaParticipantsHeaderProps) {
-  const shell = useAiChatShell();
-  const nav = shell?.compact === true && shell.navCollapsed && shell.hasNav;
-  const panel = shell?.compact === true && shell.hasPanel;
   return (
-    <View className="min-h-12 shrink-0 flex-row items-center justify-between px-3 pt-3">
-      <View className="w-10">
-        {nav && shell ? (
-          <Button
-            size="md"
-            icon={RiMenuLine}
-            accessibilityLabel={shell.labels.openNavigation}
-            onPress={shell.openNav}
-            appearance="plain"
-            tone="neutral"
-          />
-        ) : null}
-      </View>
-      <View className="min-w-0 shrink items-center">
-        <AliaParticipants participants={participants} onPress={onPress} />
-      </View>
-      <View className="w-10 items-end">
-        {panel && shell ? (
-          <Button
-            size="md"
-            icon={shell.panelIcon}
-            accessibilityLabel={shell.labels.openPanel(shell.panelLabel)}
-            onPress={shell.openPanel}
-            appearance="plain"
-            tone="neutral"
-          />
-        ) : null}
-      </View>
-    </View>
+    <AiChatHeader>
+      <AliaParticipants participants={participants} onPress={onPress} />
+    </AiChatHeader>
   );
 });

package/src/components/AliaRecentConversations.tsx

@@ -0,0 +1,58 @@
+import { Item } from '@oxy.so/bloom/item';
+import { Text } from '@oxy.so/bloom/typography';
+import { useMemo } from 'react';
+import { View } from 'react-native';
+import { useLabels } from '../lib/labels';
+import { useConversations } from '../runtime/conversations';
+
+/** How many of the lead's conversations the sheet offers to pick up again. */
+export const RECENT_CONVERSATIONS_SHOWN = 3;
+
+/**
+ * The person's latest conversations with the sheet's lead, under its greeting: "Ask Sindi" picks
+ * up where it left off instead of every opening being a blank page. Alia's own sheet lists the
+ * person's latest conversations of any kind. Nothing while loading or when there are none.
+ */
+export function AliaRecentConversations({
+  agentId,
+  onOpen,
+}: {
+  /** The lead; omitted, Alia. */
+  agentId?: string;
+  onOpen: (conversationId: string) => void;
+}) {
+  const labels = useLabels();
+  const { data } = useConversations(agentId === undefined ? {} : { agentId });
+  const recent = useMemo(
+    () => data?.pages[0]?.conversations.slice(0, RECENT_CONVERSATIONS_SHOWN) ?? [],
+    [data],
+  );
+  const when = useMemo(
+    () => new Intl.DateTimeFormat(labels.locale, { day: 'numeric', month: 'short' }),
+    [labels.locale],
+  );
+  if (recent.length === 0) return null;
+  return (
+    <View accessibilityRole="list" className="w-full max-w-[480px] self-center gap-1">
+      <Text className="px-3 text-sm text-text-secondary">{labels.recentConversations}</Text>
+      {recent.map((conversation) => {
+        const title = conversation.title || labels.newChat;
+        return (
+          <Item
+            key={conversation.id}
+            density="compact"
+            accessibilityRole="button"
+            accessibilityLabel={title}
+            onPress={() => onOpen(conversation.id)}
+            title={<Text numberOfLines={1}>{title}</Text>}
+            trailing={
+              <Text className="text-xs text-text-tertiary">
+                {when.format(new Date(conversation.updatedAt))}
+              </Text>
+            }
+          />
+        );
+      })}
+    </View>
+  );
+}

package/src/components/ReplyMarkdown.tsx

@@ -1,4 +1,5 @@
 import { CodeBlock } from '@oxy.so/bloom/code';
+import { Markdown } from '@oxy.so/bloom/markdown';
 import { Text } from '@oxy.so/bloom/typography';
 import * as Clipboard from 'expo-clipboard';
 import * as WebBrowser from 'expo-web-browser';
@@ -13,7 +14,6 @@ import {
 } from '../lib/citations';
 import { useLabels } from '../lib/labels';
 import type { ToolInvocation } from '../runtime/types';
-import { AliaMarkdown, type RenderCodeBlock } from './Markdown';
 import { Banner, CompactList, Comparison, Credibility, RichImage, Timeline } from './RichBlocks';
 
 // Cheap pre-check: plain markdown (the overwhelmingly common case) skips the
@@ -227,13 +227,11 @@ function openSource(url: string): void {
 /**
  * The references section of a research answer, as links.
  *
- * The API now writes each entry as a Markdown link, and the SDK's renderer
- * would make those pressable on its own — but not ACCESSIBLE: its link rule
- * is a `Text` with `onPress`, which a screen reader reads as text and a
- * keyboard cannot reach. So the section is cut off the Markdown and drawn
- * here, one `accessibilityRole="link"` per entry — an `<a href>` on web, so
- * Tab reaches it and Enter opens it — named "Source n: title". Older answers,
- * whose entries were a title over a bare URL, split the same way.
+ * The API writes each entry as a Markdown link. The section is cut off the
+ * Markdown and drawn here as a list of sources rather than running text: one
+ * `accessibilityRole="link"` per entry — an `<a href>` on web, so Tab reaches
+ * it and Enter opens it — named "Source n: title", with its domain. Older
+ * answers, whose entries were a title over a bare URL, split the same way.
  */
 function ReferenceList({
   entries,
@@ -300,10 +298,10 @@ const copyCode = async (code: string) => {
 
 /**
  * Fenced code as Bloom's code card: the language chip, a copy button and
- * numbered lines. Module-level so its identity is stable — it is part of the
- * SDK renderer's rules memo.
+ * numbered lines. Module-level so its identity is stable, as Bloom's
+ * `Markdown` asks of `renderCodeBlock`.
  */
-const renderCodeBlock: RenderCodeBlock = (code, language) => (
+const renderCodeBlock = (code: string, language?: string) => (
   <CodeBlock code={code} language={language} onCopy={copyCode} />
 );
 
@@ -318,20 +316,23 @@ const renderCodeBlock: RenderCodeBlock = (code, language) => (
  * are normalised first. A message with neither prop renders exactly as
  * before.
  *
- * `onCitationPress` replaces opening the URL for the references list. The
- * inline markers are rendered by the SDK's link rule, which opens the URL
- * itself and offers no hook, so they do not reach it.
+ * `onCitationPress` replaces opening a source's URL, for the references list
+ * and for an inline marker alike; any other link opens as Bloom's `Markdown`
+ * opens it. `streaming` is the reply still arriving: Bloom's `Markdown` closes
+ * an unfinished trailing construct instead of showing its raw markers.
  */
 export function ReplyMarkdown({
   content,
   toolInvocations,
   researchSources,
   onCitationPress,
+  streaming = false,
 }: {
   content: string;
   toolInvocations?: ToolInvocation[];
   researchSources?: Array<{ id: number; url: string; title: string }> | null;
   onCitationPress?: (source: CitationSource) => void;
+  streaming?: boolean;
 }) {
   const sources = useMemo(
     () => extractCitationSources(toolInvocations, researchSources),
@@ -340,13 +341,29 @@ export function ReplyMarkdown({
   const { body, references } = useMemo(() => splitReferences(content, sources), [content, sources]);
   const linked = useMemo(() => linkifyCitations(body, sources), [body, sources]);
   const blocks = useMemo(() => parseSpecialBlocks(linked), [linked]);
+  const onLinkPress = useMemo(() => {
+    if (!onCitationPress) return undefined;
+    return (url: string) => {
+      const source = sources.find((entry) => entry.url === url);
+      if (source) onCitationPress(source);
+      else openSource(url);
+    };
+  }, [onCitationPress, sources]);
 
   return (
     <View>
       {blocks.map((block, idx) => {
         if (block.type === 'text') {
           return (
-            <AliaMarkdown key={idx} content={block.content} renderCodeBlock={renderCodeBlock} />
+            <Markdown
+              key={idx}
+              size="lg"
+              streaming={streaming && idx === blocks.length - 1}
+              renderCodeBlock={renderCodeBlock}
+              onLinkPress={onLinkPress}
+            >
+              {block.content}
+            </Markdown>
           );
         } else if (block.type === 'block' && block.blockType) {
           return renderBlock(block.blockType, block.data, idx);

package/src/components/thread/ThreadRow.tsx

@@ -447,6 +447,7 @@ function ReplyTurn({
                   content={text}
                   toolInvocations={message.toolInvocations}
                   researchSources={message.researchProgress?.sources}
+                  streaming={message.isStreaming === true}
                 />
               )}
             </AiChatAssistantMessage>

package/src/index.ts

@@ -10,7 +10,7 @@ export type {
   AliaChatContentProps,
   AliaChatState,
 } from './components/AliaChatContent';
-export { AliaParticipants, joinFlights, useParticipants } from './components/AliaParticipants';
+export { AliaParticipants, useParticipants } from './components/AliaParticipants';
 export type { AliaParticipantsProps, UseParticipantsOptions } from './components/AliaParticipants';
 export { AliaParticipantsHeader } from './components/AliaParticipantsHeader';
 export type { AliaParticipantsHeaderProps } from './components/AliaParticipantsHeader';
@@ -27,6 +27,7 @@ export type { AliaAddMenu } from './lib/add-menu';
 export type { AliaVoiceOptions } from './hooks/useChatVoice';
 export { AliaChatSheet } from './components/AliaChatSheet';
 export type { AliaChatSheetProps, AliaChatSheetRef } from './components/AliaChatSheet';
+export { AliaRecentConversations } from './components/AliaRecentConversations';
 export type { AliaTurn } from './hooks/useChatComposer';
 export { AliaChatScreen } from './components/AliaChatScreen';
 export type { AliaChatScreenProps } from './components/AliaChatScreen';
@@ -47,8 +48,6 @@ export { useAliaActivity } from './hooks/useAliaActivity';
 export type { UseAliaActivityOptions } from './hooks/useAliaActivity';
 export { IdentityMark } from './components/IdentityMark';
 export type { IdentityMarkProps, IdentityMarkState } from './components/IdentityMark';
-export { AliaMarkdown } from './components/Markdown';
-export type { AliaMarkdownProps, RenderCodeBlock } from './components/Markdown';
 export { ReplyMarkdown } from './components/ReplyMarkdown';
 export { AliaThread } from './components/thread/AliaThread';
 export type { AliaThreadProps, NewConversationOfferProps } from './components/thread/AliaThread';

package/src/lib/labels.tsx

@@ -87,6 +87,8 @@ export interface AliaChatLabels {
   // Conversations (the runtime's own words: toasts and the errors it raises)
   /** A conversation's title until it has one. */
   newChat: string;
+  /** Over the sheet's recent conversations with its lead. */
+  recentConversations: string;
   /** A turn could not be sent and the composer got its text back. */
   sendFailed: string;
   /** The session ended mid-request. */
@@ -165,6 +167,7 @@ export const DEFAULT_LABELS: AliaChatLabels = {
   t: englishCopy,
   locale: 'en',
   newChat: 'New chat',
+  recentConversations: 'Recent',
   sendFailed: "Your message couldn't be sent",
   signInRequired: 'Sign in to keep chatting',
   conversationSaveFailed: 'Failed to save conversation',

package/src/components/Markdown.tsx

@@ -1,515 +0,0 @@
-import React, { useMemo, type ReactNode } from 'react';
-import { View, Text, Platform, Linking } from 'react-native';
-import { useTheme } from '@oxy.so/bloom/theme';
-import Markdown, { MarkdownIt, type ASTNode } from 'react-native-markdown-display';
-import { CodeBlock } from '@oxy.so/bloom/code';
-import { fontFamilies } from '@oxy.so/bloom/fonts';
-import type { AliaColors } from '../theme';
-
-// Hardcoded fallback colors for standalone SDK usage (when no color override is passed).
-// The main app always passes resolved colors via the `colors` prop.
-const BODY_TEXT = { fontSize: 16, lineHeight: 28 } as const;
-const HEADING_TEXT = { fontSize: 16, lineHeight: 22 } as const;
-const MONO_FONT = Platform.select({ ios: 'Courier', android: 'monospace', default: 'monospace' })!;
-
-function createRules(colors: AliaColors, renderCodeBlock?: RenderCodeBlock) {
-  const { text: textColor, muted, border, primary, mutedForeground } = colors;
-
-  /**
-   * Fenced and indented code: Bloom's `CodeBlock` unless the host brings a
-   * code card of its own.
-   */
-  const drawCodeBlock: RenderCodeBlock =
-    renderCodeBlock ?? ((code, language) => <CodeBlock code={code} language={language} />);
-  const codeRules = {
-    fence: (node: ASTNode) => (
-      <View key={node.key} style={{ marginVertical: 8 }}>
-        {drawCodeBlock(node.content.replace(/\n$/, ''), codeLanguage(node))}
-      </View>
-    ),
-    code_block: (node: ASTNode) => (
-      <View key={node.key} style={{ marginVertical: 8 }}>
-        {drawCodeBlock(node.content.replace(/\n$/, ''), undefined)}
-      </View>
-    ),
-  };
-
-  return {
-    ...codeRules,
-    heading1: (node: ASTNode, children: ReactNode[]) => (
-      <Text
-        key={node.key}
-        style={{
-          marginBottom: 8,
-          marginTop: 12,
-          fontSize: 18,
-          fontWeight: '600',
-          lineHeight: 24,
-          color: textColor,
-        }}
-      >
-        {children}
-      </Text>
-    ),
-    heading2: (node: ASTNode, children: ReactNode[]) => (
-      <Text
-        key={node.key}
-        style={{
-          marginBottom: 8,
-          marginTop: 12,
-          ...HEADING_TEXT,
-          fontWeight: '600',
-          color: textColor,
-        }}
-      >
-        {children}
-      </Text>
-    ),
-    heading3: (node: ASTNode, children: ReactNode[]) => (
-      <Text
-        key={node.key}
-        style={{
-          marginBottom: 6,
-          marginTop: 8,
-          ...HEADING_TEXT,
-          fontWeight: '600',
-          color: textColor,
-        }}
-      >
-        {children}
-      </Text>
-    ),
-    heading4: (node: ASTNode, children: ReactNode[]) => (
-      <Text
-        key={node.key}
-        style={{
-          marginBottom: 6,
-          marginTop: 8,
-          ...HEADING_TEXT,
-          fontWeight: '500',
-          color: textColor,
-        }}
-      >
-        {children}
-      </Text>
-    ),
-    heading5: (node: ASTNode, children: ReactNode[]) => (
-      <Text
-        key={node.key}
-        style={{
-          marginBottom: 4,
-          marginTop: 8,
-          ...HEADING_TEXT,
-          fontWeight: '500',
-          color: textColor,
-        }}
-      >
-        {children}
-      </Text>
-    ),
-    heading6: (node: ASTNode, children: ReactNode[]) => (
-      <Text
-        key={node.key}
-        style={{
-          marginBottom: 4,
-          marginTop: 8,
-          ...HEADING_TEXT,
-          fontWeight: '500',
-          color: textColor,
-        }}
-      >
-        {children}
-      </Text>
-    ),
-    code: (node: ASTNode, children: ReactNode[], parent: ASTNode[]) => {
-      return parent.length > 1 ? (
-        <View
-          key={node.key}
-          style={{
-            marginVertical: 8,
-            overflow: 'hidden',
-            borderRadius: 6,
-            backgroundColor: muted,
-            borderWidth: 1,
-            borderColor: border,
-            padding: 12,
-          }}
-        >
-          <Text style={{ fontSize: 13, fontFamily: MONO_FONT }}>{children}</Text>
-        </View>
-      ) : (
-        <Text
-          key={node.key}
-          style={{
-            backgroundColor: muted,
-            paddingHorizontal: 4,
-            paddingVertical: 1,
-            fontSize: 13,
-            fontFamily: MONO_FONT,
-            borderRadius: 3,
-          }}
-        >
-          {children}
-        </Text>
-      );
-    },
-    list_item: (node: ASTNode, children: ReactNode[], parent: ASTNode[]) => {
-      const isOrdered = parent[parent.length - 1]?.type === 'ordered_list';
-      const bullet = isOrdered
-        ? `${parent[parent.length - 1].children.indexOf(node) + 1}.`
-        : '\u2022';
-
-      return (
-        <View key={node.key} style={{ flexDirection: 'row', paddingVertical: 2, paddingLeft: 16 }}>
-          <Text style={{ marginRight: 8, minWidth: 14, ...BODY_TEXT, color: mutedForeground }}>
-            {bullet}
-          </Text>
-          {/* A View, not a Text: a nested list is a View, and inside a Text it runs inline. */}
-          <View style={{ flex: 1 }}>{children}</View>
-        </View>
-      );
-    },
-    ordered_list: (node: ASTNode, children: ReactNode[]) => (
-      <View key={node.key} style={{ marginVertical: 8 }}>
-        {children}
-      </View>
-    ),
-    unordered_list: (node: ASTNode, children: ReactNode[]) => (
-      <View key={node.key} style={{ marginVertical: 8 }}>
-        {children}
-      </View>
-    ),
-    strong: (node: ASTNode, children: ReactNode[]) => (
-      <Text key={node.key} style={{ fontWeight: '600', ...BODY_TEXT, color: textColor }}>
-        {children}
-      </Text>
-    ),
-    link: (node: ASTNode, children: ReactNode[]) => (
-      <Text
-        key={node.key}
-        style={{ color: primary, textDecorationLine: 'underline', ...BODY_TEXT }}
-        onPress={() => {
-          if (node.attributes?.href) Linking.openURL(node.attributes.href);
-        }}
-      >
-        {children}
-      </Text>
-    ),
-    paragraph: (node: ASTNode, children: ReactNode[]) => (
-      <Text key={node.key} style={{ marginBottom: 8, ...BODY_TEXT, color: textColor }}>
-        {children}
-      </Text>
-    ),
-    blockquote: (node: ASTNode, children: ReactNode[]) => (
-      <View
-        key={node.key}
-        style={{
-          marginVertical: 8,
-          borderLeftWidth: 4,
-          borderLeftColor: border,
-          backgroundColor: muted,
-          paddingHorizontal: 12,
-          paddingVertical: 4,
-          borderTopRightRadius: 6,
-          borderBottomRightRadius: 6,
-        }}
-      >
-        {children}
-      </View>
-    ),
-    hr: (node: ASTNode) => (
-      <View
-        key={node.key}
-        style={{
-          marginVertical: 16,
-          height: 1,
-          backgroundColor: border,
-        }}
-      />
-    ),
-    body: (node: ASTNode, children: ReactNode[]) => {
-      return (
-        <View key={node.key} style={{ marginBottom: -8 }}>
-          {children}
-        </View>
-      );
-    },
-  };
-}
-
-function createStyles(colors: AliaColors, fontFamily: string | undefined) {
-  const { text: textColor, muted, border, primary, mutedForeground } = colors;
-
-  return {
-    // On WEB the family arrives through the cascade down to `html`, so naming
-    // one here would override Bloom rather than complement it.
-    //
-    // On NATIVE nothing arrives. Bloom's only app-wide mechanism is the
-    // `Text.defaultProps.style` mutation in its `FontLoader.native.tsx`, and
-    // **React 19 drops `defaultProps` under the automatic JSX runtime** that
-    // Expo compiles to — measured on react@19.2.3: `createElement(Foo, {})`
-    // yields `{style:{fontFamily}}` while `jsx(Foo, {})` yields `{}`, for
-    // function AND class components alike. So that mutation reaches no `<Text>`
-    // in any Expo consumer, and this renderer cannot inherit a face.
-    //
-    // `fontFamily` therefore comes from the caller, which is the only party
-    // that both knows the family and is allowed to name it: react-native-markdown-display
-    // takes RN style objects, so there is no className path to NativeWind's token.
-    body: { ...BODY_TEXT, color: textColor, fontFamily },
-    text: { ...BODY_TEXT, color: textColor, fontFamily },
-    paragraph: { marginTop: 0, marginBottom: 8 },
-    strong: { fontWeight: '600' as const },
-    em: { fontStyle: 'italic' as const },
-    s: { textDecorationLine: 'line-through' as const },
-    bullet_list_icon: { marginLeft: 0, marginRight: 8, ...BODY_TEXT, color: mutedForeground },
-    ordered_list_icon: { marginLeft: 0, marginRight: 8, ...BODY_TEXT, color: mutedForeground },
-    bullet_list_content: { flex: 1 },
-    ordered_list_content: { flex: 1 },
-    code_inline: {
-      fontSize: 13,
-      fontFamily: MONO_FONT,
-      backgroundColor: muted,
-      borderWidth: 0,
-      borderRadius: 3,
-      paddingHorizontal: 4,
-      paddingVertical: 1,
-    },
-    code_block: {
-      fontSize: 13,
-      fontFamily: MONO_FONT,
-      backgroundColor: muted,
-      borderWidth: 1,
-      borderColor: border,
-      borderRadius: 6,
-      padding: 12,
-    },
-    fence: {
-      fontSize: 13,
-      fontFamily: MONO_FONT,
-      backgroundColor: muted,
-      borderWidth: 1,
-      borderColor: border,
-      borderRadius: 6,
-      padding: 12,
-    },
-    table: {
-      borderWidth: 1,
-      borderColor: border,
-      borderRadius: 12,
-      marginVertical: 8,
-      overflow: 'hidden' as const,
-    },
-    thead: { backgroundColor: muted },
-    th: { flex: 1, padding: 8, fontWeight: '600' as const, ...BODY_TEXT, color: textColor },
-    td: { flex: 1, padding: 8, ...BODY_TEXT, color: textColor },
-    tr: { borderBottomWidth: 1, borderColor: border, flexDirection: 'row' as const },
-    link: { textDecorationLine: 'underline' as const, color: primary, ...BODY_TEXT },
-    hr: { backgroundColor: border, height: 1, marginVertical: 16 },
-    heading1: { fontSize: 18, fontWeight: '600' as const },
-    heading2: { ...HEADING_TEXT, fontWeight: '600' as const },
-    heading3: { ...HEADING_TEXT, fontWeight: '600' as const },
-    heading4: { ...HEADING_TEXT, fontWeight: '500' as const },
-    heading5: { ...HEADING_TEXT, fontWeight: '500' as const },
-    heading6: { ...HEADING_TEXT, fontWeight: '500' as const },
-  };
-}
-
-/** Draws one block of code: its source, and the fence's language when it named one. */
-export type RenderCodeBlock = (code: string, language: string | undefined) => ReactNode;
-
-/** The fence's info string up to the first space (```ts title=x → `ts`). */
-function codeLanguage(node: ASTNode): string | undefined {
-  const info = (node as ASTNode & { sourceInfo?: string }).sourceInfo?.trim() ?? '';
-  const language = info.split(/\s+/)[0];
-  return language === '' ? undefined : language;
-}
-
-/**
- * The body face, which `react-native-markdown-display` cannot inherit on native.
- *
- * It is driven by RN STYLE OBJECTS and supports no `className`, so NativeWind's `--font-sans`
- * cannot reach the `<Text>` elements it renders. And Bloom's app-wide native default — the
- * `Text.defaultProps` mutation in its `FontLoader.native.tsx` — does not apply: React 19 drops
- * `defaultProps` under the automatic JSX runtime Expo compiles to. So the family is handed over
- * explicitly, taken from Bloom's own token so it has one owner. `fontFamilies.sans` is a CSS
- * STACK and RN's `fontFamily` takes a single family, hence the leading entry. Web is left
- * undefined on purpose: there the cascade from `html` already carries `--bloom-font-sans`, and
- * naming a family would override Bloom instead of complementing it.
- */
-const BODY_FONT = Platform.OS === 'web' ? undefined : fontFamilies.sans.split(',')[0].trim();
-
-export interface AliaMarkdownProps {
-  /**
-   * The sans family for body text, as a SINGLE family name — RN's `fontFamily` takes one, not a
-   * CSS stack. Omitted, Bloom's own (see `BODY_FONT`).
-   */
-  fontFamily?: string;
-  content: string;
-  colors?: Partial<AliaColors>;
-  /**
-   * Draw fenced code with the host's own code card. Keep the function's
-   * identity stable (a module-level function or a `useCallback`): it is part of
-   * the rules' memo, and a new one per render re-parses every block.
-   */
-  renderCodeBlock?: RenderCodeBlock;
-}
-
-const FENCE_RE = /^\s*(?:```|~~~)/;
-const LIST_OR_TABLE_RE = /^\s*(?:[-*+]\s|\d+[.)]\s|\|)/;
-// Link reference definitions ([1]: https://…) resolve per-parse, so a document
-// using them cannot be split into independently parsed blocks.
-const LINK_REF_DEF_RE = /^\s*\[[^\]]+\]:\s/m;
-
-/**
- * Split markdown into top-level blocks at blank-line boundaries, keeping
- * fenced code, list runs, and tables intact. During streaming only the last
- * block's text changes, so every completed block hits React.memo and skips
- * its markdown-it re-parse — the per-flush cost drops from O(document) to
- * O(trailing block).
- */
-function splitMarkdownBlocks(content: string): string[] {
-  if (LINK_REF_DEF_RE.test(content)) return [content];
-
-  const lines = content.split('\n');
-  const blocks: string[] = [];
-  let current: string[] = [];
-  let lastNonBlank = '';
-  let inFence = false;
-  let i = 0;
-
-  while (i < lines.length) {
-    const line = lines[i];
-    if (FENCE_RE.test(line)) {
-      inFence = !inFence;
-      current.push(line);
-      lastNonBlank = line;
-      i += 1;
-      continue;
-    }
-    if (!inFence && line.trim() === '') {
-      let j = i;
-      while (j < lines.length && lines[j].trim() === '') j += 1;
-      const next = j < lines.length ? lines[j] : '';
-      // Splitting a list or table at a blank line would restart ordered-list
-      // numbering and break table parsing — keep those runs in one block.
-      const keepTogether = LIST_OR_TABLE_RE.test(lastNonBlank) || LIST_OR_TABLE_RE.test(next);
-      if (keepTogether || current.length === 0) {
-        for (; i < j; i += 1) current.push(lines[i]);
-      } else {
-        blocks.push(current.join('\n'));
-        current = [];
-        i = j;
-      }
-      continue;
-    }
-    current.push(line);
-    lastNonBlank = line;
-    i += 1;
-  }
-  if (current.length > 0) blocks.push(current.join('\n'));
-  return blocks.length > 0 ? blocks : [content];
-}
-
-type MarkdownBlockProps = {
-  content: string;
-  rules: ReturnType<typeof createRules>;
-  styles: ReturnType<typeof createStyles>;
-};
-
-/**
- * `react-native-markdown-display` gives three of its props DEFAULT VALUES that
- * are new objects on every render: `markdownit = MarkdownIt({ typographer:
- * true })`, `allowedImageHandlers = [...]` and `topLevelMaxExceededItem =
- * <Text>`. A default parameter is evaluated per call, so each render of each
- * `<Markdown>` built a parser (compiling linkify-it's regexes), and the two
- * others sit in the deps of its renderer's `useMemo`, so the renderer — and
- * the `StyleSheet.create` of every style inside it — was rebuilt every render
- * too. A streamed answer re-renders its last block per token, and opening a
- * thread renders every block once: both paid for it. Passing the defaults'
- * own values, created once, makes both memos hold. The parser is shared:
- * `parse` keeps no state between calls.
- *
- * The typings omit the last two props, which the component does take.
- */
-const PARSER = MarkdownIt({ typographer: true });
-const IMAGE_HANDLERS = [
-  'data:image/png;base64',
-  'data:image/gif;base64',
-  'data:image/jpeg;base64',
-  'https://',
-  'http://',
-];
-const TOP_LEVEL_EXCEEDED = <Text key="dotdotdot">...</Text>;
-const StableMarkdown = Markdown as React.ComponentType<
-  React.ComponentProps<typeof Markdown> & {
-    allowedImageHandlers?: string[];
-    topLevelMaxExceededItem?: ReactNode;
-  }
->;
-
-function ParsedMarkdown({ content, rules, styles }: MarkdownBlockProps) {
-  return (
-    <StableMarkdown
-      rules={rules}
-      style={styles}
-      markdownit={PARSER}
-      allowedImageHandlers={IMAGE_HANDLERS}
-      topLevelMaxExceededItem={TOP_LEVEL_EXCEEDED}
-    >
-      {content}
-    </StableMarkdown>
-  );
-}
-
-const MarkdownBlock = React.memo(ParsedMarkdown);
-
-export function AliaMarkdown({
-  content,
-  colors: colorOverrides,
-  fontFamily = BODY_FONT,
-  renderCodeBlock,
-}: AliaMarkdownProps) {
-  // Bloom's theme, which follows the app's chosen mode, not the system's scheme: a person who
-  // picked light on a dark OS gets dark text on a light surface, not the reverse.
-  const { colors: theme } = useTheme();
-  const colors = {
-    text: theme.text,
-    muted: theme.backgroundSecondary,
-    border: theme.border,
-    primary: theme.primary,
-    mutedForeground: theme.textSecondary,
-    ...colorOverrides,
-  } as AliaColors;
-
-  const customRules = useMemo(
-    () => createRules(colors, renderCodeBlock),
-    [
-      colors.text,
-      colors.muted,
-      colors.border,
-      colors.primary,
-      colors.mutedForeground,
-      renderCodeBlock,
-    ],
-  );
-  const markdownStyles = useMemo(
-    () => createStyles(colors, fontFamily),
-    [colors.text, colors.muted, colors.border, colors.primary, colors.mutedForeground, fontFamily],
-  );
-  const blocks = useMemo(() => splitMarkdownBlocks(content), [content]);
-
-  if (blocks.length === 1) {
-    return <ParsedMarkdown content={blocks[0]} rules={customRules} styles={markdownStyles} />;
-  }
-
-  // Each block's `body` rule cancels its own trailing paragraph margin
-  // (marginBottom: -8), so rowGap restores the exact inter-paragraph spacing
-  // a single continuous parse would produce.
-  return (
-    <View style={{ rowGap: 8 }}>
-      {blocks.map((block, i) => (
-        <MarkdownBlock key={i} content={block} rules={customRules} styles={markdownStyles} />
-      ))}
-    </View>
-  );
-}