@signalcore/ui 0.1.0 → 1.0.0-beta.1

package/dist/AgentAbout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AgentAbout.js","names":[],"sources":["../src/AgentAbout.tsx"],"sourcesContent":["import {\n  useCallback,\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n  type ReactNode,\n} from \"react\";\n\nimport {\n  BooksIcon,\n  BroadcastIcon,\n  KeyIcon,\n  LightbulbIcon,\n  PuzzlePieceIcon,\n  WrenchIcon,\n  type Icon as Glyph,\n} from \"@phosphor-icons/react\";\nimport {\n  aboutState,\n  appTitle,\n  automationsOf,\n  countOf,\n  formatSize,\n  toneOf,\n  toolName,\n  toolTitle,\n  type AboutOut,\n  type ActionFact,\n  type AutomationFact,\n  type AutomationKind,\n  type ChannelFact,\n  type ChannelKind,\n  type ConnectionFact,\n  type DataFact,\n  type Facts,\n  type FileFact,\n  type Icon,\n  type MemoryFact,\n  type Provider,\n  type StatusTone,\n  type Told,\n  type Topic,\n  type VaultFact,\n} from \"./about\";\nimport { Automation } from \"./automation/Automation\";\nimport { RunView } from \"./automation/RunView\";\nimport type { Automation as Standing, Run } from \"./automation/types\";\nimport { agentGlyph } from \"./agentIcons\";\nimport { classes } from \"./classes\";\nimport { ApiError, type Client } from \"./client\";\nimport { baseName } from \"./files\";\nimport { GLYPHS } from \"./icons\";\nimport { KitProvider, useKit, type KitClassNames, type KitPart } from \"./kit/context\";\nimport { FileMark } from \"./kit/FileMark\";\nimport { List, Row } from \"./kit/List\";\nimport { Mark } from \"./kit/Mark\";\nimport { MarkStack } from \"./kit/MarkStack\";\nimport { Tag } from \"./kit/Tag\";\nimport { KIT_MESSAGES, type KitLocale, type KitMessages } from \"./kit/messages\";\nimport { actionMark, channelMark, deviceMark, providerMark } from \"./marks\";\n\n/** What each part of what it works with is, at a glance: bare, beside its name. */\nconst TOPIC_GLYPHS: Readonly<Record<Topic, Glyph>> = {\n  apps: PuzzlePieceIcon,\n  tools: WrenchIcon,\n  knowledge: BooksIcon,\n  learning: LightbulbIcon,\n  channels: BroadcastIcon,\n  keys: KeyIcon,\n};\nimport type { Channel, ChannelStatus } from \"./types\";\nimport { agentTint } from \"./tint\";\nimport { usePolled } from \"./usePolled\";\n\n/** The words Qué puede says; a host gives its own, in its language. */\nexport interface AboutMessages {\n  /** While the words are read, before anything is known. */\n  loading: string;\n  /** While the agent writes what it does the first time: a model call, a few seconds. */\n  writing: (name: string) => string;\n  /** Under the words while the agent writes them again, because it changed since. */\n  updating: string;\n  /** The button that tries again when the words could not be read or written. */\n  refresh: string;\n  /** Over what it asks the person's leave for. */\n  asks: string;\n  /** Over the tools that come with every agent, when it has its own too. */\n  builtIn: string;\n  /** The words could not be read or written; the server's own sentence follows when it gave one. */\n  failed: string;\n  /** Over what it does on its own. */\n  does: string;\n  /** In their place when it does nothing on its own yet. */\n  noAutomations: string;\n  /** On an automation that is off. */\n  paused: string;\n  /** What an automation waits for, when the agent hasn't said when yet. */\n  kinds: Readonly<Record<AutomationKind, string>>;\n  /** Each topic's name, on its tile and over it when open. */\n  topics: Readonly<Record<Topic, string>>;\n  /** A topic with nothing: on its row, and as its one line when open. */\n  empty: Readonly<Record<Topic, string>>;\n  /** Under an open topic's name: what it is, in a line. */\n  hints: Readonly<Record<Topic, string>>;\n  /** Over what is the agent's own, inside what it knows and its keys. */\n  theirs: (name: string) => string;\n  /** Over what is the organization's, shared with every agent: said once, by this heading. */\n  organization: string;\n  /** Over the tables, inside what it knows. */\n  tables: string;\n  /** Under a file `search_files` does not read: it is only kept. */\n  kept: string;\n  /** Beside a tool that is off. */\n  off: string;\n  /** What it may do in a table, beside it. */\n  can: Readonly<Record<string, string>>;\n  /** Over the words, and on the way back from a topic: who this is about. */\n  title: (name: string) => string;\n  /** Over the topics. */\n  facts: string;\n  /** In place of a run that is no longer there. */\n  runGone: string;\n  /** What the kit's pieces say in it (an automation, a run): their words, in the host's language. */\n  kit: Partial<KitMessages>;\n  /** A shipped action's name in the owner's words, by its code name; the rest keep the code name. */\n  actions: Readonly<Record<string, string>>;\n  /** A file's size, as the host's people read it. */\n  size: (bytes: number) => string;\n  /** When a memory was kept, beside it. */\n  ago: (when: Date) => string;\n  /** A channel's name, by its kind: its row's title. */\n  channelNames: Readonly<Record<ChannelKind, string>>;\n  /** How a channel stands, beside its dot. */\n  channelStates: Readonly<Record<ChannelStatus, string>>;\n  /** The provider's word on a channel's status (English, as the API keeps it), in the host's. */\n  channelDetail: (detail: string) => string;\n}\n\nexport const ABOUT_MESSAGES: AboutMessages = {\n  loading: \"Loading…\",\n  writing: (name) => `${name} is writing down what it does…`,\n  updating: \"Updating…\",\n  refresh: \"Try again\",\n  asks: \"It asks you before\",\n  builtIn: \"Built in\",\n  failed: \"What it can do could not be read.\",\n  does: \"What it does on its own\",\n  noAutomations: \"Nothing on its own yet: it answers when someone writes to it.\",\n  paused: \"Paused\",\n  kinds: { schedule: \"At a time\", webhook: \"When called\", event: \"On an event\" },\n  topics: {\n    apps: \"Apps\",\n    tools: \"Tools\",\n    knowledge: \"Knowledge\",\n    learning: \"Learning\",\n    channels: \"Channels\",\n    keys: \"Keys\",\n  },\n  empty: {\n    apps: \"None yet\",\n    tools: \"None on\",\n    knowledge: \"Nothing yet\",\n    learning: \"Nothing yet\",\n    channels: \"None yet\",\n    keys: \"None\",\n  },\n  hints: {\n    apps: \"The business's apps it uses, and what it may do in each.\",\n    tools: \"What it can do while it talks with someone.\",\n    knowledge: \"The documents and tables it reads to answer.\",\n    learning: \"What it has learned from its conversations.\",\n    channels: \"Where it works: where people write to it, and the devices it uses.\",\n    keys: \"Passwords and keys it uses, kept sealed.\",\n  },\n  theirs: (name) => `${name}'s own`,\n  organization: \"The organization's\",\n  tables: \"Tables\",\n  kept: \"Only kept\",\n  off: \"off\",\n  can: { find: \"looks up\", add: \"adds\", update: \"changes\" },\n  title: (name) => `About ${name}`,\n  facts: \"What it works with\",\n  runGone: \"This run is no longer there.\",\n  kit: KIT_MESSAGES,\n  actions: {},\n  size: (bytes) => formatSize(bytes),\n  ago: (when) => when.toLocaleDateString(),\n  channelNames: {\n    whatsapp: \"WhatsApp\",\n    instagram: \"Instagram\",\n    sms: \"SMS\",\n    email: \"Email\",\n    web: \"Web chat\",\n    phone: \"Phone\",\n  },\n  channelStates: {\n    active: \"Active\",\n    pending: \"Pending\",\n    error: \"Error\",\n    disconnected: \"Disconnected\",\n  },\n  channelDetail: (detail) => detail,\n};\n\n/** The parts, by the class each carries; `classNames` adds a host's own under the same keys. */\nexport type AboutPart =\n  | \"sc-about\"\n  | \"sc-about__pane\"\n  | \"sc-about__intro\"\n  | \"sc-about__heading\"\n  | \"sc-about__name\"\n  | \"sc-about__topics\"\n  | \"sc-about__topic\"\n  | \"sc-about__topic-name\"\n  | \"sc-about__topic-none\"\n  | \"sc-about__topic-count\"\n  | \"sc-about__topic-go\"\n  | \"sc-about__lead\"\n  | \"sc-about__updated\"\n  | \"sc-about__updating\"\n  | \"sc-about__section\"\n  | \"sc-about__label\"\n  | \"sc-about__asks\"\n  | \"sc-about__menu\"\n  | \"sc-about__memory\"\n  | \"sc-about__back\"\n  | \"sc-about__bar\"\n  | \"sc-about__bar-end\"\n  | \"sc-about__automation\"\n  | \"sc-about__run\"\n  | \"sc-about__group\"\n  | \"sc-about__title\"\n  | \"sc-about__subtitle\"\n  | \"sc-about__file\"\n  | \"sc-about__detail\"\n  | \"sc-about__hint\"\n  | \"sc-about__count\"\n  | \"sc-about__tools\"\n  | \"sc-about__dot\"\n  | \"sc-about__state\"\n  | \"sc-about__empty\"\n  | \"sc-about__writing\";\n\n/** The panel's own parts and the kit's it is drawn with: a host styles both under one prop. */\ntype ClassNames = Partial<Record<AboutPart | KitPart, string>> | undefined;\n\n/** What a host's control is given, besides the thing it stands beside. */\nexport interface AboutTools {\n  /**\n   * Reads the facts again, and has the agent write its words anew when the change made them\n   * stale; the open topic stays. Call it after a change.\n   */\n  refresh: () => Promise<void>;\n}\n\ntype Control<T> = ((thing: T, tools: AboutTools) => ReactNode) | undefined;\n\n/**\n * The host's own controls: the package only reads, a host that lets its people change things\n * draws them here. Each one is drawn at the right end of what it stands beside.\n */\nexport interface AboutControls {\n  /** Over what it does on its own (a new automation). */\n  newAutomation?: ((tools: AboutTools) => ReactNode) | undefined;\n  /** On each automation (switch it off, delete it). */\n  automation?: Control<AutomationFact>;\n  /** Under its automations: what else it does on its own (the tasks it runs for contacts). */\n  automationsNote?: ((tools: AboutTools) => ReactNode) | undefined;\n  /** Over an open topic (add an app, upload a file, add a key). */\n  topic?: Partial<Record<Topic, (tools: AboutTools) => ReactNode>> | undefined;\n  app?: Control<ConnectionFact>;\n  tool?: Control<ActionFact>;\n  file?: Control<FileFact>;\n  table?: Control<DataFact>;\n  memory?: Control<MemoryFact>;\n  key?: Control<VaultFact>;\n  /** On each channel the agent answers (its settings, a check, disconnecting it). */\n  channel?: Control<Channel>;\n}\n\n/**\n * How a host draws an app's mark, with its own brands (the package carries none): v2's\n * `AppDirectory`. `provider` says the catalog and the app (`arcade:gmail`); `icon` is the one the\n * provider declares, when it does.\n */\nexport interface AppDirectory {\n  logo: (app: {\n    provider: string;\n    name: string;\n    icon?: string | null | undefined;\n    size: number;\n  }) => ReactNode;\n}\n\nexport interface AgentAboutProps {\n  client: Client;\n  agentId: string;\n  /** Its mark (`AGENT_ICONS`), drawn beside its name in its tint; a sparkle until it has one. */\n  icon?: string | null | undefined;\n  /** The agent's name, for the words that address it. */\n  name: string;\n  messages?: Partial<AboutMessages> | undefined;\n  classNames?: ClassNames;\n  controls?: AboutControls | undefined;\n  /** The host's logos for apps; without them an app shows the mark its provider gives. */\n  apps?: AppDirectory | undefined;\n  /**\n   * Opens a file the owner presses in what it knows (in the host's viewer: `FileView` in a\n   * dialog); without it the files are only listed.\n   */\n  onOpenFile?: ((file: FileFact) => void) | undefined;\n  /**\n   * What is open in it: its home, a topic, an automation, a run of one. Given, the host keeps it\n   * (in its address, say) and hears each move through `onViewChange`; without it the panel keeps\n   * its own.\n   */\n  view?: AboutView | undefined;\n  onViewChange?: ((view: AboutView) => void) | undefined;\n  /** Opens a conversation a run opened or was asked in; without it, none opens. */\n  onOpenConversation?: ((id: string) => void) | undefined;\n  /** The language its dates and times are said in. */\n  locale?: KitLocale | undefined;\n}\n\n/**\n * What is open in the panel, one level under another: its home; a topic or an automation from\n * it; a run from its automation.\n */\nexport type AboutView =\n  | { kind: \"home\" }\n  | { kind: \"topic\"; topic: Topic }\n  | { kind: \"automation\"; name: string }\n  | { kind: \"run\"; name: string; run: string };\n\nexport const ABOUT_HOME: AboutView = { kind: \"home\" };\n\n/** How far a view is from the home: what says whether a move goes in or back out. */\nconst depthOf = (view: AboutView): number =>\n  view.kind === \"home\" ? 0 : view.kind === \"run\" ? 2 : 1;\n\n/** A view as one string: what tells two apart. */\nconst keyOf = (view: AboutView): string =>\n  view.kind === \"home\"\n    ? \"home\"\n    : view.kind === \"topic\"\n      ? `topic:${view.topic}`\n      : view.kind === \"automation\"\n        ? `automation:${view.name}`\n        : `run:${view.name}:${view.run}`;\n\n/** The view a step back from `view` goes to. */\nexport function aboutBack(view: AboutView): AboutView {\n  return view.kind === \"run\" ? { kind: \"automation\", name: view.name } : ABOUT_HOME;\n}\n\n/**\n * Qué puede, made to sit beside the conversation: who it is about, in its own words (a line or\n * two); what it does on its own, one row per automation (its kind's mark, or its app's logo),\n * what it does and when, as the agent tells it; what it asks leave for; then what it works with,\n * as a grid of tiles, one per topic (its apps, tools, what it knows and has learned, where it\n * works, its keys), each with its count and a glimpse of what it holds, opening it in the same\n * place. Every list is the kit's `List` and `Row`, and every tile its `Tile`, the ones an agent's\n * screens use, so a host styles them once. The words are written by the agent the first time and\n * again whenever it changed since, by themselves. The component only reads; a host draws its own\n * controls through `controls` and calls `tools.refresh()` after a change, and opens a file\n * through `onOpenFile`. An automation opens in the panel itself, one level in (what it does, its\n * steps, its runs), and a run one more, each with its way back; `view` lets the host keep where\n * it is. Another agent starts afresh.\n */\nexport function AgentAbout(props: AgentAboutProps) {\n  return (\n    <KitProvider\n      classNames={props.classNames as KitClassNames}\n      messages={props.messages?.kit}\n      locale={props.locale}\n    >\n      <View key={props.agentId} {...props} />\n    </KitProvider>\n  );\n}\n\nfunction View({\n  client,\n  agentId,\n  icon,\n  name,\n  messages,\n  classNames,\n  controls,\n  apps,\n  onOpenFile,\n  view: given,\n  onViewChange,\n  onOpenConversation,\n}: AgentAboutProps) {\n  const words = { ...ABOUT_MESSAGES, ...messages };\n  const [data, setData] = useState<AboutOut | null>(null);\n  const [live, setLive] = useState<readonly Standing[] | null>(null);\n  const [writing, setWriting] = useState(false);\n  const [problem, setProblem] = useState<unknown>(null);\n  // Every change the host makes reads the open automation or run again, too.\n  const [version, setVersion] = useState(0);\n  const [own, setOwn] = useState<AboutView>(ABOUT_HOME);\n  const view = given ?? own;\n  const motion = useMotion(view);\n  const root = useRef<HTMLDivElement>(null);\n  const scrolled = useRef(new Map<string, number>());\n  const intro = useId();\n\n  /** Opens `next`, keeping where the panel was scrolled to on the way in, for the way back. */\n  const go = (next: AboutView) => {\n    const scroller = scrollerOf(root.current);\n    if (scroller !== null && depthOf(next) > depthOf(view)) {\n      scrolled.current.set(keyOf(view), scroller.scrollTop);\n    }\n    (onViewChange ?? setOwn)(next);\n  };\n\n  // A view opens at its top, or back where it was left.\n  const shown = keyOf(view);\n  useLayoutEffect(() => {\n    const scroller = scrollerOf(root.current);\n    if (scroller !== null) scroller.scrollTop = scrolled.current.get(shown) ?? 0;\n  }, [shown]);\n\n  // Each call takes `still`, whether its answer is still wanted: a mount undone before the answer\n  // (StrictMode runs effects twice) keeps nothing, so one writing runs, not two.\n\n  /** Has the agent write about itself anew; what it answers is the words and the facts both. */\n  const write = useCallback(\n    async (still: () => boolean) => {\n      setProblem(null);\n      setWriting(true);\n      try {\n        const written = await client.agents.describe(agentId);\n        if (still()) setData(written);\n      } catch (error) {\n        if (still()) setProblem(error);\n      } finally {\n        if (still()) setWriting(false);\n      }\n    },\n    [client, agentId],\n  );\n\n  /**\n   * Reads the words and the facts, and how each automation stands (a server without them leaves\n   * the rows as they were told); when the words are missing or stale, has the agent write them.\n   */\n  const read = useCallback(\n    async (still: () => boolean) => {\n      setProblem(null);\n      try {\n        const [first, standing] = await Promise.all([\n          client.agents.about(agentId),\n          client.automations.list(agentId).catch(() => null),\n        ]);\n        if (!still()) return;\n        setData(first);\n        setLive(standing);\n        // Words never written, or written before the agent last changed: it writes them again\n        // by itself, so what it says stays true without anyone asking.\n        if (first.about === null || first.about_at === null) await write(still);\n      } catch (error) {\n        if (still()) setProblem(error);\n      }\n    },\n    [client, agentId, write],\n  );\n\n  useEffect(() => {\n    let gone = false;\n    void read(() => !gone);\n    return () => {\n      gone = true;\n    };\n  }, [read]);\n\n  const tools = useMemo<AboutTools>(\n    () => ({\n      refresh: async () => {\n        setVersion((count) => count + 1);\n        await read(() => true);\n      },\n    }),\n    [read],\n  );\n  // What to try again after a failure: the reading when nothing was read, the writing otherwise.\n  const retry = () => (data === null ? read(() => true) : write(() => true));\n  // A tool by the owner's words for it; one of its own code, by its name made words.\n  const label = (action: ActionFact) =>\n    action.source === \"own\" ? toolName(action.name) : (words.actions[action.name] ?? action.name);\n  const pane = (bar: ReactNode, children: ReactNode) => (\n    <div ref={root} className={`sc ${classes(classNames, \"sc-about\")}`}>\n      <div key={shown} data-motion={motion} className={classes(classNames, \"sc-about__pane\")}>\n        {bar}\n        {children}\n      </div>\n    </div>\n  );\n  const home = words.title(name);\n\n  if (view.kind === \"topic\" && data !== null) {\n    return pane(\n      <Bar back={home} onBack={() => go(ABOUT_HOME)} classNames={classNames} />,\n      <TopicView\n        client={client}\n        agentId={agentId}\n        name={name}\n        version={version}\n        topic={view.topic}\n        facts={data.facts}\n        apps={apps}\n        label={label}\n        words={words}\n        classNames={classNames}\n        tools={tools}\n        controls={controls}\n        onOpenFile={onOpenFile}\n      />,\n    );\n  }\n\n  if (view.kind === \"automation\") {\n    const fact = data?.facts.automations.find((each) => each.name === view.name);\n    return pane(\n      <Bar\n        back={home}\n        onBack={() => go(ABOUT_HOME)}\n        end={fact !== undefined ? controls?.automation?.(fact, tools) : undefined}\n        classNames={classNames}\n      />,\n      <AutomationPane\n        key={version}\n        client={client}\n        agentId={agentId}\n        name={view.name}\n        apps={apps}\n        words={words}\n        classNames={classNames}\n        onOpenRun={(run) => go({ kind: \"run\", name: view.name, run: run.id })}\n      />,\n    );\n  }\n\n  if (view.kind === \"run\") {\n    return pane(\n      <Bar\n        back={live?.find((each) => each.name === view.name)?.title ?? home}\n        onBack={() => go({ kind: \"automation\", name: view.name })}\n        classNames={classNames}\n      />,\n      <RunPane\n        key={version}\n        client={client}\n        agentId={agentId}\n        name={view.name}\n        run={view.run}\n        apps={apps}\n        words={words}\n        classNames={classNames}\n        onOpenConversation={onOpenConversation}\n      />,\n    );\n  }\n\n  const state = data === null ? null : aboutState(data.about, data.about_at, writing);\n  return pane(\n    null,\n    <>\n      <section aria-labelledby={intro} className={classes(classNames, \"sc-about__intro\")}>\n        <AgentName\n          id={intro}\n          agentId={agentId}\n          icon={icon}\n          name={name}\n          label={home}\n          classNames={classNames}\n        />\n        {problem !== null ? (\n          <Problem words={words} classNames={classNames} onRetry={retry}>\n            {words.failed}\n            {problem instanceof ApiError && ` ${problem.detail}`}\n          </Problem>\n        ) : data === null || data.about === null ? (\n          <Writing\n            text={data === null ? words.loading : words.writing(name)}\n            classNames={classNames}\n          />\n        ) : (\n          <p className={classes(classNames, \"sc-about__lead\")}>{data.about.summary}</p>\n        )}\n        {state === \"writing\" && data?.about != null && (\n          <p role=\"status\" className={classes(classNames, \"sc-about__updating\")}>\n            {words.updating}\n          </p>\n        )}\n      </section>\n      {data !== null && (\n        <>\n          <Automations\n            apps={apps}\n            told={automationsOf(data.about, data.facts)}\n            live={live}\n            words={words}\n            classNames={classNames}\n            tools={tools}\n            controls={controls}\n            onOpen={(automation) => go({ kind: \"automation\", name: automation.name })}\n          />\n          {data.about !== null && data.about.asks.length > 0 && (\n            <Asks asks={data.about.asks} words={words} classNames={classNames} />\n          )}\n          <nav aria-label={words.facts} className={classes(classNames, \"sc-about__menu\")}>\n            <p className={classes(classNames, \"sc-about__label\")}>{words.facts}</p>\n            <div className={classes(classNames, \"sc-about__topics\")}>\n              {HOME_TOPICS.map((topic) => (\n                <TopicRow\n                  key={topic}\n                  topic={topic}\n                  facts={data.facts}\n                  apps={apps}\n                  words={words}\n                  classNames={classNames}\n                  onOpen={() => go({ kind: \"topic\", topic })}\n                />\n              ))}\n            </div>\n          </nav>\n        </>\n      )}\n    </>,\n  );\n}\n\n/**\n * What the panel's home shows the agent works with, in the order the owner looks for it: where\n * people reach it, the apps it uses, what it knows, what it learned, its keys. Its tools are\n * the platform's business: they show in the technical view, not here.\n */\nconst HOME_TOPICS: readonly Topic[] = [\"channels\", \"apps\", \"knowledge\", \"learning\", \"keys\"];\n\n/** How many icons a topic's row draws before \"+N\". */\nconst MOST_MARKS = 5;\n\n/**\n * A topic on the panel's home, as icons: its name, then what it holds as their logos or marks\n * (the channels', the apps', the files') and how many; a topic with nothing says so, quietly.\n * Pressing it opens the topic.\n */\nfunction TopicRow({\n  topic,\n  facts,\n  apps,\n  words,\n  classNames,\n  onOpen,\n}: {\n  topic: Topic;\n  facts: Facts;\n  apps: AppDirectory | undefined;\n  words: AboutMessages;\n  classNames: ClassNames;\n  onOpen: () => void;\n}) {\n  const count = countOf(topic, facts);\n  return (\n    <button\n      type=\"button\"\n      onClick={onOpen}\n      data-empty={count === 0 || undefined}\n      className={classes(classNames, \"sc-about__topic\")}\n    >\n      <span className={classes(classNames, \"sc-about__topic-name\")}>{words.topics[topic]}</span>\n      {count === 0 ? (\n        <span className={classes(classNames, \"sc-about__topic-none\")}>{words.empty[topic]}</span>\n      ) : (\n        <>\n          <TopicMarks topic={topic} facts={facts} apps={apps} words={words} count={count} />\n          <span className={classes(classNames, \"sc-about__topic-count\")}>{count}</span>\n        </>\n      )}\n      <svg\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        aria-hidden\n        className={classes(classNames, \"sc-about__topic-go\")}\n      >\n        <path\n          d=\"M6 3.5 10.5 8 6 12.5\"\n          stroke=\"currentColor\"\n          strokeWidth=\"1.5\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        />\n      </svg>\n    </button>\n  );\n}\n\n/** What a topic holds, as icons: each channel's and app's logo, each file's mark; else its glyph. */\nfunction TopicMarks({\n  topic,\n  facts,\n  apps,\n  words,\n  count,\n}: {\n  topic: Topic;\n  facts: Facts;\n  apps: AppDirectory | undefined;\n  words: AboutMessages;\n  count: number;\n}) {\n  const marks: ReactNode[] =\n    topic === \"channels\"\n      ? facts.channels.map((channel) => (\n          <span key={`${channel.kind}:${channel.name}`}>\n            {channelLogo(channel.kind, apps, words, 20)}\n          </span>\n        ))\n      : topic === \"apps\"\n        ? facts.connections.map((connection) => (\n            <span key={connection.name}>{appMark(connectionApp(connection), apps, 20)}</span>\n          ))\n        : topic === \"knowledge\"\n          ? facts.files.map((file) => <FileMark key={file.path} name={file.path} size={20} />)\n          : [<Mark key={topic} icon={TOPIC_GLYPHS[topic]} size={20} />];\n  const shown = marks.slice(0, MOST_MARKS);\n  const drawn = topic === \"learning\" || topic === \"keys\" ? 0 : count;\n  return <MarkStack more={Math.max(0, drawn - shown.length)}>{shown}</MarkStack>;\n}\n\n/**\n * Who the panel is about, at its top: the agent's mark in its tint, bare, beside its name; the\n * panel's title (\"About Ana\") stays for screen readers.\n */\nfunction AgentName({\n  id,\n  agentId,\n  icon,\n  name,\n  label,\n  classNames,\n}: {\n  id: string;\n  agentId: string;\n  icon: string | null | undefined;\n  name: string;\n  label: string;\n  classNames: ClassNames;\n}) {\n  const Glyph = agentGlyph(icon);\n  return (\n    <h2\n      id={id}\n      aria-label={label}\n      data-tint={agentTint(agentId)}\n      className={classes(classNames, \"sc-about__name\")}\n    >\n      <Glyph aria-hidden weight=\"duotone\" />\n      <span>{name}</span>\n    </h2>\n  );\n}\n\n/**\n * Which way the panel moved to show `view`: in (one level deeper), back out, or nowhere (the first\n * view). Kept per view, so a view's own updates never replay it.\n */\nfunction useMotion(view: AboutView): \"in\" | \"out\" | undefined {\n  const key = keyOf(view);\n  const depth = depthOf(view);\n  const [moved, setMoved] = useState<{\n    key: string;\n    depth: number;\n    motion: \"in\" | \"out\" | undefined;\n  }>({ key, depth, motion: undefined });\n  if (moved.key !== key) {\n    setMoved({ key, depth, motion: depth >= moved.depth ? \"in\" : \"out\" });\n  }\n  return moved.motion;\n}\n\n/** The nearest box around `element` that scrolls: where the panel's place is kept. */\nfunction scrollerOf(element: HTMLElement | null): HTMLElement | null {\n  for (let at = element?.parentElement ?? null; at !== null; at = at.parentElement) {\n    const overflow = getComputedStyle(at).overflowY;\n    if (overflow === \"auto\" || overflow === \"scroll\") return at;\n  }\n  return null;\n}\n\n/**\n * The bar over a view opened from another: the way back to it, named, at its start; the host's\n * controls at its end. It stays at the top as the view scrolls.\n */\nfunction Bar({\n  back,\n  onBack,\n  end,\n  classNames,\n}: {\n  back: string;\n  onBack: () => void;\n  end?: ReactNode;\n  classNames: ClassNames;\n}) {\n  return (\n    <div className={classes(classNames, \"sc-about__bar\")}>\n      <button type=\"button\" onClick={onBack} className={classes(classNames, \"sc-about__back\")}>\n        <svg viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden>\n          <path\n            d=\"M10 3.5 5.5 8l4.5 4.5\"\n            stroke=\"currentColor\"\n            strokeWidth=\"1.5\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          />\n        </svg>\n        <span>{back}</span>\n      </button>\n      {end != null && <span className={classes(classNames, \"sc-about__bar-end\")}>{end}</span>}\n    </div>\n  );\n}\n\n/**\n * An automation, open in the panel: what starts it and when it runs next, the owner's sentence,\n * its steps, the table it moves, its runs (each opening its record). Read again every few\n * seconds while a run of it is under way.\n */\nfunction AutomationPane({\n  client,\n  agentId,\n  name,\n  apps,\n  words,\n  classNames,\n  onOpenRun,\n}: Drawn & {\n  client: Client;\n  agentId: string;\n  name: string;\n  apps: AppDirectory | undefined;\n  onOpenRun: (run: Run) => void;\n}) {\n  const { messages } = useKit();\n  const read = usePolled(\n    () => client.automations.get(agentId, name),\n    `${agentId}:${name}`,\n    (automation) => automation.runs.some((run) => run.status === \"running\"),\n  );\n  if (read.gone) return <Gone classNames={classNames}>{messages.automation.gone}</Gone>;\n  if (read.value === null) {\n    return read.problem === null ? (\n      <Loading words={words} classNames={classNames} />\n    ) : (\n      <Gone classNames={classNames}>{words.failed}</Gone>\n    );\n  }\n  return (\n    <Automation\n      className={classes(classNames, \"sc-about__automation\")}\n      automation={read.value}\n      runs={read.value.runs}\n      apps={apps}\n      onOpenRun={onOpenRun}\n    />\n  );\n}\n\n/**\n * A run, open in the panel: how it went, step by step in words, what it opened. Read with its\n * automation (its steps' order and its apps' names), again while it is under way.\n */\nfunction RunPane({\n  client,\n  agentId,\n  name,\n  run,\n  apps,\n  words,\n  classNames,\n  onOpenConversation,\n}: Drawn & {\n  client: Client;\n  agentId: string;\n  name: string;\n  run: string;\n  apps: AppDirectory | undefined;\n  onOpenConversation: ((id: string) => void) | undefined;\n}) {\n  const read = usePolled(\n    async () => {\n      const [record, automation] = await Promise.all([\n        client.runs.get(run),\n        client.automations.get(agentId, name).catch(() => null),\n      ]);\n      return { record, automation };\n    },\n    run,\n    ({ record }) => record.status === \"running\",\n  );\n  if (read.gone) return <Gone classNames={classNames}>{words.runGone}</Gone>;\n  if (read.value === null) {\n    return read.problem === null ? (\n      <Loading words={words} classNames={classNames} />\n    ) : (\n      <Gone classNames={classNames}>{words.failed}</Gone>\n    );\n  }\n  return (\n    <RunView\n      className={classes(classNames, \"sc-about__run\")}\n      run={read.value.record}\n      automation={read.value.automation}\n      apps={apps}\n      onOpenConversation={onOpenConversation}\n    />\n  );\n}\n\n/** A view whose thing is being read: lines with a light sweeping them. */\nfunction Loading({ words, classNames }: Drawn) {\n  return <Writing text={words.loading} classNames={classNames} />;\n}\n\n/** In place of what is no longer there, or could not be read. */\nfunction Gone({ classNames, children }: { classNames: ClassNames; children: ReactNode }) {\n  return <p className={classes(classNames, \"sc-about__empty\")}>{children}</p>;\n}\n\n/** An automation's mark says its kind: a time, a call from another system, an event. */\nconst KIND_ICONS: Readonly<Record<AutomationKind, Icon>> = {\n  schedule: \"clock\",\n  webhook: \"code\",\n  event: \"bell\",\n};\n\n/** An app's mark: the host's logo when it draws one, else the provider's, bare. */\nfunction appMark(\n  app: { provider: string; name: string; icon?: string | null | undefined },\n  apps: AppDirectory | undefined,\n  size: number,\n) {\n  if (apps !== undefined) return apps.logo({ ...app, size });\n  return (\n    <Mark logo size={size}>\n      {providerMark(app.provider.split(\":\")[0] as Provider, app.icon ?? undefined)}\n    </Mark>\n  );\n}\n\nconst connectionApp = (connection: ConnectionFact) => ({\n  provider: `${connection.provider}:${connection.toolkit ?? connection.name}`,\n  name: appTitle(connection),\n  icon: connection.icon,\n});\n\n/**\n * A channel's mark: the host's logo for its brand when it draws apps (WhatsApp, Instagram, the\n * plain mark of a text message), else the package's glyph, bare.\n */\nfunction channelLogo(\n  kind: ChannelKind,\n  apps: AppDirectory | undefined,\n  words: AboutMessages,\n  size: number,\n) {\n  if (apps !== undefined)\n    return apps.logo({ provider: kind, name: words.channelNames[kind], size });\n  return <Mark size={size}>{channelMark(kind)}</Mark>;\n}\n\ninterface Drawn {\n  words: AboutMessages;\n  classNames: ClassNames;\n}\n\n/** What could not be read or written, in the warning tone, and the button to try again. */\nfunction Problem({\n  words,\n  classNames,\n  onRetry,\n  children,\n}: Drawn & { onRetry: () => Promise<void>; children: ReactNode }) {\n  return (\n    <p role=\"alert\" className={classes(classNames, \"sc-about__updated\")}>\n      <span>{children}</span>\n      <button type=\"button\" onClick={() => void onRetry()}>\n        {words.refresh}\n      </button>\n    </p>\n  );\n}\n\n/** The agent writing: the lead's lines with a light sweeping them, and the sentence saying so. */\nfunction Writing({ text, classNames }: { text: string; classNames: ClassNames }) {\n  return (\n    <div role=\"status\" className={classes(classNames, \"sc-about__writing\")}>\n      <div aria-hidden>\n        <i />\n        <i />\n      </div>\n      <p>{text}</p>\n    </div>\n  );\n}\n\n/** What it asks leave for: its label, then the things, a short list. */\nfunction Asks({ asks, words, classNames }: Drawn & { asks: string[] }) {\n  const id = useId();\n  return (\n    <section\n      aria-labelledby={id}\n      className={classes(classNames, \"sc-about__section\", \"sc-about__asks\")}\n    >\n      <div className={classes(classNames, \"sc-about__label\")}>\n        <h3 id={id}>{words.asks}</h3>\n      </div>\n      <ul>\n        {asks.map((ask, index) => (\n          <li key={index}>{ask}</li>\n        ))}\n      </ul>\n    </section>\n  );\n}\n\n/**\n * What it does on its own: one row per automation, its kind's mark (or, on an app's event, the\n * app's logo), what it does then over when, as the agent tells it (its title and its kind until\n * it has), a paused one quieter; how it stands now when that needs a look (a run under way, the\n * last one failed); the host's control at each row's end, and over them the way to a new one. A\n * row opens its automation.\n */\nfunction Automations({\n  told,\n  live,\n  words,\n  classNames,\n  tools,\n  controls,\n  apps,\n  onOpen,\n}: Drawn & {\n  told: Told[];\n  live: readonly Standing[] | null;\n  tools: AboutTools;\n  controls: AboutControls | undefined;\n  apps: AppDirectory | undefined;\n  onOpen: (automation: AutomationFact) => void;\n}) {\n  const id = useId();\n  const { messages } = useKit();\n  const standing = new Map(live?.map((automation) => [automation.name, automation]));\n  return (\n    <section aria-labelledby={id} className={classes(classNames, \"sc-about__section\")}>\n      <div className={classes(classNames, \"sc-about__label\")}>\n        <h3 id={id}>{words.does}</h3>\n        {controls?.newAutomation !== undefined && (\n          <span className={classes(classNames, \"sc-about__tools\")}>\n            {controls.newAutomation(tools)}\n          </span>\n        )}\n      </div>\n      {told.length === 0 ? (\n        <p className={classes(classNames, \"sc-about__empty\")}>{words.noAutomations}</p>\n      ) : (\n        <List>\n          {told.map(({ automation, line }) => {\n            const when = line?.when ?? words.kinds[automation.kind];\n            const now = standing.get(automation.name);\n            const going = now?.last_run?.status === \"running\";\n            return (\n              <Row\n                key={automation.id}\n                mark={\n                  automation.provider === undefined ? (\n                    <Mark icon={GLYPHS[KIND_ICONS[automation.kind]]} />\n                  ) : (\n                    appMark(\n                      {\n                        provider: automation.provider,\n                        name:\n                          automation.app_title ?? toolName(automation.app ?? automation.provider),\n                        icon: automation.icon,\n                      },\n                      apps,\n                      28,\n                    )\n                  )\n                }\n                title={line?.text ?? automation.title}\n                subtitle={when}\n                error={now?.state === \"failing\" ? messages.automation.states.failing : undefined}\n                meta={\n                  going ? (\n                    <Tag tone=\"info\">\n                      <i aria-hidden className={classes(classNames, \"sc-run__live\")} />\n                      {messages.automation.statuses.running}\n                    </Tag>\n                  ) : automation.on ? undefined : (\n                    <Tag>{words.paused}</Tag>\n                  )\n                }\n                quiet={!automation.on}\n                onPress={() => onOpen(automation)}\n                trailing={controls?.automation?.(automation, tools)}\n              />\n            );\n          })}\n        </List>\n      )}\n      {controls?.automationsNote?.(tools)}\n    </section>\n  );\n}\n\n/**\n * One topic, open: its name with its count and the host's control, a line saying what it is, then\n * its rows (what it knows as its files and its tables; what it learned; the rest with a mark and\n * a note), or its one line when it holds nothing.\n */\nfunction TopicView({\n  client,\n  agentId,\n  name,\n  version,\n  topic,\n  facts,\n  apps,\n  label,\n  words,\n  classNames,\n  tools,\n  controls,\n  onOpenFile,\n}: Drawn & {\n  client: Client;\n  agentId: string;\n  /** The agent's name, over what is its own. */\n  name: string;\n  /** Moves with every change the host makes: what the topic reads itself, it reads again. */\n  version: number;\n  topic: Topic;\n  facts: Facts;\n  apps: AppDirectory | undefined;\n  label: (action: ActionFact) => string;\n  tools: AboutTools;\n  controls: AboutControls | undefined;\n  onOpenFile: ((file: FileFact) => void) | undefined;\n}) {\n  const id = useId();\n  const tool = controls?.topic?.[topic];\n  const count = countOf(topic, facts);\n  // The tools are all listed, the ones that are off too: they are what the owner turns on.\n  const shown = topic === \"tools\" ? facts.actions.length : count;\n  return (\n    <section aria-labelledby={id} className={classes(classNames, \"sc-about__group\")}>\n      <h3 id={id} className={classes(classNames, \"sc-about__title\")}>\n        <span>{words.topics[topic]}</span>\n        {count > 0 && <b className={classes(classNames, \"sc-about__count\")}>{count}</b>}\n        {tool !== undefined && (\n          <span className={classes(classNames, \"sc-about__tools\")}>{tool(tools)}</span>\n        )}\n      </h3>\n      <p className={classes(classNames, \"sc-about__hint\")}>{words.hints[topic]}</p>\n      {topic === \"channels\" ? (\n        <Channels\n          client={client}\n          agentId={agentId}\n          version={version}\n          facts={facts}\n          apps={apps}\n          words={words}\n          classNames={classNames}\n          tools={tools}\n          controls={controls}\n        />\n      ) : shown === 0 ? (\n        <p className={classes(classNames, \"sc-about__empty\")}>{words.empty[topic]}</p>\n      ) : topic === \"knowledge\" ? (\n        <Knowledge\n          name={name}\n          facts={facts}\n          words={words}\n          classNames={classNames}\n          tools={tools}\n          controls={controls}\n          onOpenFile={onOpenFile}\n        />\n      ) : topic === \"tools\" ? (\n        <Tools\n          name={name}\n          facts={facts}\n          label={label}\n          words={words}\n          classNames={classNames}\n          tools={tools}\n          controls={controls}\n        />\n      ) : topic === \"keys\" ? (\n        <Keys\n          name={name}\n          facts={facts}\n          words={words}\n          classNames={classNames}\n          tools={tools}\n          controls={controls}\n        />\n      ) : topic === \"learning\" ? (\n        <List>\n          {facts.memories.map((memory) => (\n            <Row\n              key={memory.id}\n              className={classes(classNames, \"sc-about__memory\")}\n              title={memory.text}\n              subtitle={words.ago(new Date(memory.created_at))}\n              trailing={controls?.memory?.(memory, tools)}\n            />\n          ))}\n        </List>\n      ) : (\n        <Rows items={appItems(facts, tools, controls, apps)} classNames={classNames} />\n      )}\n    </section>\n  );\n}\n\n/** How each state of a channel reads beside its dot: working, waiting, broken, or off. */\nconst CHANNEL_TONES: Readonly<Record<ChannelStatus, StatusTone | \"wait\">> = {\n  active: \"on\",\n  pending: \"wait\",\n  error: \"off\",\n  disconnected: \"quiet\",\n};\n\nconst isStatus = (status: string): status is ChannelStatus => status in CHANNEL_TONES;\n\n/** The order channels are listed in: by kind, as people reach a business most; disconnected last. */\nconst KIND_ORDER: readonly ChannelKind[] = [\n  \"whatsapp\",\n  \"instagram\",\n  \"sms\",\n  \"email\",\n  \"web\",\n  \"phone\",\n];\n\nconst inOrder = (channels: readonly Channel[]): Channel[] =>\n  [...channels].sort(\n    (a, b) =>\n      Number(a.status === \"disconnected\") - Number(b.status === \"disconnected\") ||\n      KIND_ORDER.indexOf(a.kind) - KIND_ORDER.indexOf(b.kind),\n  );\n\n/**\n * Where it works: each channel it answers, as the API lists them (WhatsApp, Instagram, SMS; the\n * disconnected ones last, quieter), by its brand's mark and name, its number or handle, how it stands with the\n * provider's word on it, and the host's control at its end; then the devices it uses. Read\n * when the topic opens and after each change the host makes; until then, or on a server without\n * the list, the facts' rows.\n */\nfunction Channels({\n  client,\n  agentId,\n  version,\n  facts,\n  apps,\n  words,\n  classNames,\n  tools,\n  controls,\n}: Drawn & {\n  client: Client;\n  agentId: string;\n  version: number;\n  facts: Facts;\n  apps: AppDirectory | undefined;\n  tools: AboutTools;\n  controls: AboutControls | undefined;\n}) {\n  const [listed, setListed] = useState<readonly Channel[] | null>(null);\n  useEffect(() => {\n    let gone = false;\n    client.channels.list(agentId).then(\n      (channels) => {\n        if (!gone) setListed(channels);\n      },\n      () => undefined,\n    );\n    return () => {\n      gone = true;\n    };\n  }, [client, agentId, version]);\n\n  const state = (status: string) => {\n    const known = isStatus(status);\n    return (\n      <span\n        data-tone={known ? CHANNEL_TONES[status] : toneOf(status)}\n        className={classes(classNames, \"sc-about__state\")}\n      >\n        <i aria-hidden className={classes(classNames, \"sc-about__dot\")} />\n        {known ? words.channelStates[status] : status}\n      </span>\n    );\n  };\n  // Its number or handle, and under it the provider's word on it; on an error, that word is why.\n  const told = (channel: Channel) => {\n    const detail = channel.detail === null ? null : words.channelDetail(channel.detail);\n    const error = channel.status === \"error\";\n    return {\n      subtitle: (\n        <>\n          {channel.name}\n          {!error && detail !== null && detail !== \"\" && (\n            <span className={classes(classNames, \"sc-about__detail\")}>{detail}</span>\n          )}\n        </>\n      ),\n      error: error ? (detail ?? undefined) : undefined,\n    };\n  };\n  const rows =\n    listed === null\n      ? facts.channels.map((channel: ChannelFact) => (\n          <Row\n            key={`${channel.kind}:${channel.name}`}\n            mark={channelLogo(channel.kind, apps, words, 28)}\n            title={words.channelNames[channel.kind]}\n            subtitle={channel.name}\n            meta={state(channel.status)}\n          />\n        ))\n      : inOrder(listed).map((channel) => (\n          <Row\n            key={channel.id}\n            mark={channelLogo(channel.kind, apps, words, 28)}\n            title={words.channelNames[channel.kind]}\n            {...told(channel)}\n            meta={state(channel.status)}\n            quiet={channel.status === \"disconnected\"}\n            trailing={controls?.channel?.(channel, tools) ?? undefined}\n          />\n        ));\n  const devices = facts.devices.map((device) => (\n    <Row\n      key={`device:${device.kind}:${device.name}`}\n      mark={<Mark>{deviceMark(device.kind)}</Mark>}\n      title={device.name}\n      meta={\n        <i\n          aria-hidden\n          data-tone={toneOf(device.status)}\n          className={classes(classNames, \"sc-about__dot\")}\n        />\n      }\n    />\n  ));\n  if (rows.length + devices.length === 0) {\n    return <p className={classes(classNames, \"sc-about__empty\")}>{words.empty.channels}</p>;\n  }\n  return (\n    <List>\n      {rows}\n      {devices}\n    </List>\n  );\n}\n\n/**\n * One row of a topic: a mark, a name, a quieter line (what an app may do there, a note), a dot\n * for a status, and the host's control at its end.\n */\ninterface Item {\n  key: string;\n  mark: ReactNode;\n  label: string;\n  note?: string | undefined;\n  status?: StatusTone | undefined;\n  off?: boolean | undefined;\n  control?: ReactNode;\n}\n\n/** Its apps: each by its logo and name, what it may do there under it, how it stands at its end. */\nfunction appItems(\n  facts: Facts,\n  tools: AboutTools,\n  controls: AboutControls | undefined,\n  apps: AppDirectory | undefined,\n): Item[] {\n  return facts.connections.map((connection) => ({\n    key: `${connection.provider}:${connection.name}`,\n    mark: appMark(connectionApp(connection), apps, 28),\n    label: appTitle(connection),\n    note: connection.actions.map((action) => toolTitle(connection, action)).join(\", \"),\n    status: connection.status === undefined ? undefined : toneOf(connection.status),\n    control: controls?.app?.(connection, tools),\n  }));\n}\n\n/**\n * What it can do while it talks: its own code's actions, then the ones every agent comes with\n * (each under its heading when it has both); in each, the ones it has first, then the ones the\n * owner can turn on, quieter, saying so.\n */\nfunction Tools({\n  name,\n  facts,\n  label,\n  words,\n  classNames,\n  tools,\n  controls,\n}: Drawn & {\n  name: string;\n  facts: Facts;\n  label: (action: ActionFact) => string;\n  tools: AboutTools;\n  controls: AboutControls | undefined;\n}) {\n  const groups = [\n    { key: \"own\", title: words.theirs(name), actions: facts.actions.filter(isOwn) },\n    { key: \"built\", title: words.builtIn, actions: facts.actions.filter((a) => !isOwn(a)) },\n  ].filter((group) => group.actions.length > 0);\n  const rows = (actions: readonly ActionFact[]) => (\n    <Rows\n      items={[...actions.filter((a) => a.on), ...actions.filter((a) => !a.on)].map((action) => ({\n        key: `${action.source}:${action.name}`,\n        mark: <Mark>{actionMark(action.name, action.source)}</Mark>,\n        label: label(action),\n        note: action.on ? undefined : words.off,\n        off: !action.on,\n        control: controls?.tool?.(action, tools),\n      }))}\n      classNames={classNames}\n    />\n  );\n  if (groups.length === 1) return rows(groups[0]?.actions ?? []);\n  return (\n    <>\n      {groups.map((group) => (\n        <Group key={group.key} title={group.title} classNames={classNames}>\n          {rows(group.actions)}\n        </Group>\n      ))}\n    </>\n  );\n}\n\nconst isOwn = (action: ActionFact): boolean => action.source === \"own\";\n\n/** A part of a topic under its small heading: whose things they are, or what kind. */\nfunction Group({\n  title,\n  classNames,\n  children,\n}: {\n  title: string;\n  classNames: ClassNames;\n  children: ReactNode;\n}) {\n  return (\n    <>\n      <h4 className={classes(classNames, \"sc-about__subtitle\")}>{title}</h4>\n      {children}\n    </>\n  );\n}\n\n/** What is the agent's own, then the organization's: the heading says whose, once. */\nfunction byOwner<T extends { shared?: boolean | undefined }>(\n  things: readonly T[],\n  name: string,\n  words: AboutMessages,\n): { key: string; title: string; things: T[] }[] {\n  return [\n    { key: \"own\", title: words.theirs(name), things: things.filter((thing) => !thing.shared) },\n    {\n      key: \"shared\",\n      title: words.organization,\n      things: things.filter((thing) => thing.shared === true),\n    },\n  ].filter((group) => group.things.length > 0);\n}\n\n/**\n * What it knows, by whose it is: its own files, then the organization's (shared with every\n * agent: the heading says so, once), then the tables it reads or writes. A file is its kind's\n * mark, its name on one line, its folder under it (and that it is only kept, when `search_files`\n * does not read it), its size at the right; pressed, the host opens it; the host's controls at\n * its end.\n */\nfunction Knowledge({\n  name,\n  facts,\n  words,\n  classNames,\n  tools,\n  controls,\n  onOpenFile,\n}: Drawn & {\n  name: string;\n  facts: Facts;\n  tools: AboutTools;\n  controls: AboutControls | undefined;\n  onOpenFile: ((file: FileFact) => void) | undefined;\n}) {\n  return (\n    <>\n      {byOwner(facts.files, name, words).map((group) => (\n        <Group key={group.key} title={group.title} classNames={classNames}>\n          <List>\n            {group.things.map((file) => (\n              <Row\n                key={file.path}\n                className={classes(classNames, \"sc-about__file\")}\n                mark={<FileMark name={file.path} />}\n                title={<span title={file.path}>{baseName(file.path)}</span>}\n                subtitle={fileLine(file, words)}\n                meta={words.size(file.size)}\n                onPress={onOpenFile && (() => onOpenFile(file))}\n                trailing={controls?.file?.(file, tools) ?? undefined}\n              />\n            ))}\n          </List>\n        </Group>\n      ))}\n      {facts.data.length > 0 && (\n        <Group title={words.tables} classNames={classNames}>\n          <Rows\n            items={facts.data.map((table) => ({\n              key: table.table,\n              mark: <Mark icon={GLYPHS.table} />,\n              label: table.title ?? table.table,\n              note: table.can.map((can) => words.can[can] ?? can).join(\", \"),\n              control: controls?.table?.(table, tools),\n            }))}\n            classNames={classNames}\n          />\n        </Group>\n      )}\n    </>\n  );\n}\n\n/** Under a file's name: its folder, and that it is only kept when nothing reads it at a search. */\nfunction fileLine(file: FileFact, words: AboutMessages): string | undefined {\n  const folder = folderOf(file.path);\n  if (file.searchable) return folder === \"\" ? undefined : folder;\n  return folder === \"\" ? words.kept : `${folder} · ${words.kept}`;\n}\n\n/** Its keys, its own then the organization's, each with where it may be sent. */\nfunction Keys({\n  name,\n  facts,\n  words,\n  classNames,\n  tools,\n  controls,\n}: Drawn & {\n  name: string;\n  facts: Facts;\n  tools: AboutTools;\n  controls: AboutControls | undefined;\n}) {\n  return (\n    <>\n      {byOwner(facts.vault, name, words).map((group) => (\n        <Group key={group.key} title={group.title} classNames={classNames}>\n          <Rows\n            items={group.things.map((secret) => ({\n              key: `${group.key}:${secret.name}`,\n              mark: <Mark icon={GLYPHS.lock} />,\n              label: secret.name,\n              note: secret.hosts?.join(\", \"),\n              control: controls?.key?.(secret, tools),\n            }))}\n            classNames={classNames}\n          />\n        </Group>\n      ))}\n    </>\n  );\n}\n\n/** The folders a file sits in: \"\" for one at the top. */\nconst folderOf = (path: string): string => path.slice(0, Math.max(0, path.lastIndexOf(\"/\")));\n\nfunction Rows({ items, classNames }: { items: Item[]; classNames: ClassNames }) {\n  return (\n    <List>\n      {items.map((item) => (\n        <Row\n          key={item.key}\n          mark={item.mark}\n          title={item.label}\n          subtitle={item.note === undefined || item.note === \"\" ? undefined : item.note}\n          meta={\n            item.status === undefined ? undefined : (\n              <i\n                aria-hidden\n                data-tone={item.status}\n                className={classes(classNames, \"sc-about__dot\")}\n              />\n            )\n          }\n          quiet={item.off}\n          trailing={item.control ?? undefined}\n        />\n      ))}\n    </List>\n  );\n}\n"],"mappings":"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"}

package/dist/AgentCard.d.ts

@@ -0,0 +1,49 @@
+import { ReactNode } from "react";
+//#region src/AgentCard.d.ts
+/**
+ * One thing the card says: what the host knows it by (`renderValue` switches on it), its label,
+ * its text, the words that stand in while it is empty, and whether it is a long text.
+ */
+export interface CardField<Key extends string = string> {
+  key: Key;
+  label: string;
+  value: string;
+  /** Drawn, muted, while the value is empty. */
+  placeholder?: string | undefined;
+  /** A long text: its own section under a small heading, at a reading measure. */
+  block?: boolean | undefined;
+}
+/** The parts, by the class each carries; `classNames` adds a host's own under the same keys. */
+export type CardPart = "sc-card" | "sc-card--sky" | "sc-card--rose" | "sc-card--sand" | "sc-card__head" | "sc-card__mark" | "sc-card__who" | "sc-card__name" | "sc-card__role" | "sc-card__facts" | "sc-card__fact" | "sc-card__body" | "sc-card__row" | "sc-card__label" | "sc-card__value" | "sc-card__empty";
+type ClassNames = Partial<Record<CardPart, string>> | undefined;
+export interface AgentCardProps<Key extends string = string> {
+  /** The agent's id: its mark keeps the tint `agentTint` gives it wherever it appears. */
+  id: string;
+  /** Its mark (`AGENT_ICONS`), in its tint; a sparkle until it has one. */
+  icon?: string | null | undefined;
+  /** Who it is, at the top: the name over the role. */
+  name: CardField<Key>;
+  role: CardField<Key>;
+  /**
+   * What it says, in order: the short ones (its model, when it was made) as a list of
+   * properties, each label beside its value; the long ones (`block`: its description, its
+   * instructions) under them, each its own section.
+   */
+  fields: readonly CardField<Key>[];
+  /**
+   * Draws a value in the text's place, the name and role included: the host's own control, so
+   * the card edits where it stands. `undefined` leaves that field to the card.
+   */
+  renderValue?: ((field: CardField<Key>) => ReactNode) | undefined;
+  classNames?: ClassNames;
+}
+/**
+ * The Ficha, as a page about the agent: its mark bare in its tint beside its name, the role
+ * under it; its short facts as a quiet list of properties, the label beside its value; then its
+ * long texts, each under a small heading at a reading measure. Typography and space carry it; no
+ * band, no tiles. The card draws text; a host that edits in place gives `renderValue`.
+ */
+export declare function AgentCard<Key extends string = string>({ id, icon, name, role, fields, renderValue, classNames }: AgentCardProps<Key>): import("react").JSX.Element;
+//#endregion
+export {};
+//# sourceMappingURL=AgentCard.d.ts.map

package/dist/AgentCard.js

@@ -0,0 +1,77 @@
+import { classes } from "./classes.js";
+import { agentGlyph } from "./agentIcons.js";
+import { agentTint } from "./tint.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/AgentCard.tsx
+/**
+* The Ficha, as a page about the agent: its mark bare in its tint beside its name, the role
+* under it; its short facts as a quiet list of properties, the label beside its value; then its
+* long texts, each under a small heading at a reading measure. Typography and space carry it; no
+* band, no tiles. The card draws text; a host that edits in place gives `renderValue`.
+*/
+function AgentCard({ id, icon, name, role, fields, renderValue, classNames }) {
+	const Glyph = agentGlyph(icon);
+	const draw = (field) => {
+		const own = renderValue?.(field);
+		if (own !== void 0) return own;
+		if (field.value.trim() !== "") return field.value;
+		return /* @__PURE__ */ jsx("span", {
+			className: classes(classNames, "sc-card__empty"),
+			children: field.placeholder ?? "—"
+		});
+	};
+	const facts = fields.filter((field) => !field.block);
+	const texts = fields.filter((field) => field.block);
+	return /* @__PURE__ */ jsxs("article", {
+		className: `sc ${classes(classNames, "sc-card", `sc-card--${agentTint(id)}`)}`,
+		children: [
+			/* @__PURE__ */ jsxs("header", {
+				className: classes(classNames, "sc-card__head"),
+				children: [/* @__PURE__ */ jsx("span", {
+					"aria-hidden": true,
+					className: classes(classNames, "sc-card__mark"),
+					children: /* @__PURE__ */ jsx(Glyph, { weight: "duotone" })
+				}), /* @__PURE__ */ jsxs("div", {
+					className: classes(classNames, "sc-card__who"),
+					children: [/* @__PURE__ */ jsx("h2", {
+						className: classes(classNames, "sc-card__name"),
+						children: draw(name)
+					}), /* @__PURE__ */ jsx("p", {
+						className: classes(classNames, "sc-card__role"),
+						children: draw(role)
+					})]
+				})]
+			}),
+			facts.length > 0 && /* @__PURE__ */ jsx("dl", {
+				className: classes(classNames, "sc-card__facts"),
+				children: facts.map((field) => /* @__PURE__ */ jsxs("div", {
+					className: classes(classNames, "sc-card__fact"),
+					children: [/* @__PURE__ */ jsx("dt", {
+						className: classes(classNames, "sc-card__label"),
+						children: field.label
+					}), /* @__PURE__ */ jsx("dd", {
+						className: classes(classNames, "sc-card__value"),
+						children: draw(field)
+					})]
+				}, field.key))
+			}),
+			texts.length > 0 && /* @__PURE__ */ jsx("dl", {
+				className: classes(classNames, "sc-card__body"),
+				children: texts.map((field) => /* @__PURE__ */ jsxs("div", {
+					className: classes(classNames, "sc-card__row"),
+					children: [/* @__PURE__ */ jsx("dt", {
+						className: classes(classNames, "sc-card__label"),
+						children: field.label
+					}), /* @__PURE__ */ jsx("dd", {
+						className: classes(classNames, "sc-card__value"),
+						children: draw(field)
+					})]
+				}, field.key))
+			})
+		]
+	});
+}
+//#endregion
+export { AgentCard };
+
+//# sourceMappingURL=AgentCard.js.map

package/dist/AgentCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AgentCard.js","names":[],"sources":["../src/AgentCard.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\n\nimport { agentGlyph } from \"./agentIcons\";\nimport { classes } from \"./classes\";\nimport { agentTint } from \"./tint\";\n\n/**\n * One thing the card says: what the host knows it by (`renderValue` switches on it), its label,\n * its text, the words that stand in while it is empty, and whether it is a long text.\n */\nexport interface CardField<Key extends string = string> {\n  key: Key;\n  label: string;\n  value: string;\n  /** Drawn, muted, while the value is empty. */\n  placeholder?: string | undefined;\n  /** A long text: its own section under a small heading, at a reading measure. */\n  block?: boolean | undefined;\n}\n\n/** The parts, by the class each carries; `classNames` adds a host's own under the same keys. */\nexport type CardPart =\n  | \"sc-card\"\n  | \"sc-card--sky\"\n  | \"sc-card--rose\"\n  | \"sc-card--sand\"\n  | \"sc-card__head\"\n  | \"sc-card__mark\"\n  | \"sc-card__who\"\n  | \"sc-card__name\"\n  | \"sc-card__role\"\n  | \"sc-card__facts\"\n  | \"sc-card__fact\"\n  | \"sc-card__body\"\n  | \"sc-card__row\"\n  | \"sc-card__label\"\n  | \"sc-card__value\"\n  | \"sc-card__empty\";\n\ntype ClassNames = Partial<Record<CardPart, string>> | undefined;\n\nexport interface AgentCardProps<Key extends string = string> {\n  /** The agent's id: its mark keeps the tint `agentTint` gives it wherever it appears. */\n  id: string;\n  /** Its mark (`AGENT_ICONS`), in its tint; a sparkle until it has one. */\n  icon?: string | null | undefined;\n  /** Who it is, at the top: the name over the role. */\n  name: CardField<Key>;\n  role: CardField<Key>;\n  /**\n   * What it says, in order: the short ones (its model, when it was made) as a list of\n   * properties, each label beside its value; the long ones (`block`: its description, its\n   * instructions) under them, each its own section.\n   */\n  fields: readonly CardField<Key>[];\n  /**\n   * Draws a value in the text's place, the name and role included: the host's own control, so\n   * the card edits where it stands. `undefined` leaves that field to the card.\n   */\n  renderValue?: ((field: CardField<Key>) => ReactNode) | undefined;\n  classNames?: ClassNames;\n}\n\n/**\n * The Ficha, as a page about the agent: its mark bare in its tint beside its name, the role\n * under it; its short facts as a quiet list of properties, the label beside its value; then its\n * long texts, each under a small heading at a reading measure. Typography and space carry it; no\n * band, no tiles. The card draws text; a host that edits in place gives `renderValue`.\n */\nexport function AgentCard<Key extends string = string>({\n  id,\n  icon,\n  name,\n  role,\n  fields,\n  renderValue,\n  classNames,\n}: AgentCardProps<Key>) {\n  const Glyph = agentGlyph(icon);\n  const draw = (field: CardField<Key>): ReactNode => {\n    const own = renderValue?.(field);\n    if (own !== undefined) return own;\n    if (field.value.trim() !== \"\") return field.value;\n    return (\n      <span className={classes(classNames, \"sc-card__empty\")}>{field.placeholder ?? \"—\"}</span>\n    );\n  };\n  const facts = fields.filter((field) => !field.block);\n  const texts = fields.filter((field) => field.block);\n  return (\n    <article className={`sc ${classes(classNames, \"sc-card\", `sc-card--${agentTint(id)}`)}`}>\n      <header className={classes(classNames, \"sc-card__head\")}>\n        <span aria-hidden className={classes(classNames, \"sc-card__mark\")}>\n          <Glyph weight=\"duotone\" />\n        </span>\n        <div className={classes(classNames, \"sc-card__who\")}>\n          <h2 className={classes(classNames, \"sc-card__name\")}>{draw(name)}</h2>\n          <p className={classes(classNames, \"sc-card__role\")}>{draw(role)}</p>\n        </div>\n      </header>\n      {facts.length > 0 && (\n        <dl className={classes(classNames, \"sc-card__facts\")}>\n          {facts.map((field) => (\n            <div key={field.key} className={classes(classNames, \"sc-card__fact\")}>\n              <dt className={classes(classNames, \"sc-card__label\")}>{field.label}</dt>\n              <dd className={classes(classNames, \"sc-card__value\")}>{draw(field)}</dd>\n            </div>\n          ))}\n        </dl>\n      )}\n      {texts.length > 0 && (\n        <dl className={classes(classNames, \"sc-card__body\")}>\n          {texts.map((field) => (\n            <div key={field.key} className={classes(classNames, \"sc-card__row\")}>\n              <dt className={classes(classNames, \"sc-card__label\")}>{field.label}</dt>\n              <dd className={classes(classNames, \"sc-card__value\")}>{draw(field)}</dd>\n            </div>\n          ))}\n        </dl>\n      )}\n    </article>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAqEA,SAAgB,UAAuC,EACrD,IACA,MACA,MACA,MACA,QACA,aACA,cACsB;CACtB,MAAM,QAAQ,WAAW,IAAI;CAC7B,MAAM,QAAQ,UAAqC;EACjD,MAAM,MAAM,cAAc,KAAK;EAC/B,IAAI,QAAQ,KAAA,GAAW,OAAO;EAC9B,IAAI,MAAM,MAAM,KAAK,MAAM,IAAI,OAAO,MAAM;EAC5C,OACE,oBAAC,QAAD;GAAM,WAAW,QAAQ,YAAY,gBAAgB;GAAI,UAAA,MAAM,eAAe;EAAU,CAAA;CAE5F;CACA,MAAM,QAAQ,OAAO,QAAQ,UAAU,CAAC,MAAM,KAAK;CACnD,MAAM,QAAQ,OAAO,QAAQ,UAAU,MAAM,KAAK;CAClD,OACE,qBAAC,WAAD;EAAS,WAAW,MAAM,QAAQ,YAAY,WAAW,YAAY,UAAU,EAAE,GAAG;EAApF,UAAA;GACE,qBAAC,UAAD;IAAQ,WAAW,QAAQ,YAAY,eAAe;IAAtD,UAAA,CACE,oBAAC,QAAD;KAAM,eAAA;KAAY,WAAW,QAAQ,YAAY,eAAe;KAC9D,UAAA,oBAAC,OAAD,EAAO,QAAO,UAAW,CAAA;IACrB,CAAA,GACN,qBAAC,OAAD;KAAK,WAAW,QAAQ,YAAY,cAAc;KAAlD,UAAA,CACE,oBAAC,MAAD;MAAI,WAAW,QAAQ,YAAY,eAAe;MAAI,UAAA,KAAK,IAAI;KAAM,CAAA,GACrE,oBAAC,KAAD;MAAG,WAAW,QAAQ,YAAY,eAAe;MAAI,UAAA,KAAK,IAAI;KAAK,CAAA,CAChE;IACC,CAAA,CAAA;;GACP,MAAM,SAAS,KACd,oBAAC,MAAD;IAAI,WAAW,QAAQ,YAAY,gBAAgB;IAChD,UAAA,MAAM,KAAK,UACV,qBAAC,OAAD;KAAqB,WAAW,QAAQ,YAAY,eAAe;KAAnE,UAAA,CACE,oBAAC,MAAD;MAAI,WAAW,QAAQ,YAAY,gBAAgB;MAAI,UAAA,MAAM;KAAU,CAAA,GACvE,oBAAC,MAAD;MAAI,WAAW,QAAQ,YAAY,gBAAgB;MAAI,UAAA,KAAK,KAAK;KAAM,CAAA,CACpE;IAHK,GAAA,MAAM,GAGX,CACN;GACC,CAAA;GAEL,MAAM,SAAS,KACd,oBAAC,MAAD;IAAI,WAAW,QAAQ,YAAY,eAAe;IAC/C,UAAA,MAAM,KAAK,UACV,qBAAC,OAAD;KAAqB,WAAW,QAAQ,YAAY,cAAc;KAAlE,UAAA,CACE,oBAAC,MAAD;MAAI,WAAW,QAAQ,YAAY,gBAAgB;MAAI,UAAA,MAAM;KAAU,CAAA,GACvE,oBAAC,MAAD;MAAI,WAAW,QAAQ,YAAY,gBAAgB;MAAI,UAAA,KAAK,KAAK;KAAM,CAAA,CACpE;IAHK,GAAA,MAAM,GAGX,CACN;GACC,CAAA;EAEC;;AAEb"}

package/dist/AgentChat.d.ts

@@ -0,0 +1,233 @@
+import { Attachment, Delivery, Handover, Holder } from "./types.js";
+import { Client } from "./client.js";
+import { KitLocale, KitMessages } from "./kit/messages.js";
+import { KitPart } from "./kit/context.js";
+import { ToolHandler } from "./useConversation.js";
+import { BrowserMessages, BrowserPart } from "./BrowserView.js";
+import { Dictate } from "./useDictation.js";
+import { SurfaceComponents, SurfacePart } from "./surface/scope.js";
+import { ReactNode } from "react";
+//#region src/AgentChat.d.ts
+/** The words the chat says; a host gives its own, in its language. */
+export interface ChatMessages {
+  /** The composer's invitation, and the field's name; `fresh` while nothing has been said. */
+  placeholder: (name: string, fresh: boolean) => string;
+  /** In the composer while the socket is not open. */
+  connecting: string;
+  /** In the composer while the turn waits for the person to act above. */
+  awaiting: string;
+  /** Over the composer while a reply is on its way. */
+  thinking: (name: string) => string;
+  /** Over the composer while a reply is on its way, where the agent's steps are hidden. */
+  typing: string;
+  /** The builder's line over the composer, while nothing runs and nothing is written yet. */
+  working: string;
+  /** The builder's line over the composer, while its words come. */
+  writing: string;
+  /** How long the reply has taken so far, beside it. */
+  elapsed: (seconds: number) => string;
+  /** At the end of that line: how to stop the reply. */
+  escape: string;
+  /** Under the log once a reply is in: how long it took. */
+  done: (seconds: number) => string;
+  /** A conversation with nothing said yet: its title. */
+  empty: (name: string) => string;
+  /** Under the title, a line on what to say; nothing when empty. */
+  intro: (name: string) => string;
+  /** The send button's name. */
+  send: string;
+  /** The button that attaches files, by its name. */
+  attach: string;
+  /** Over the chat while files are dragged over it. */
+  drop: string;
+  /** The microphone's name: to dictate, and to stop and have it written. */
+  dictate: string;
+  dictateStop: string;
+  /** Beside the microphone while it listens, writes, or could not. */
+  dictation: Readonly<Record<"listening" | "writing" | "failed", string>>;
+  /** The stop button's name, in the send button's place while a reply is on its way. */
+  stop: string;
+  /** The message list's name, for screen readers. */
+  log: string;
+  /** A step's name, by the action's name as the platform gives it; the name itself otherwise. */
+  steps: Readonly<Record<string, string>>;
+  /** Beside a step that failed, in the builder's look: the colour is never the whole message. */
+  failed: string;
+  /** What heads the card of an action that needs the person's leave. */
+  approval: string;
+  /** The agent wants to run an action that needs the person's leave. */
+  request: (name: string, action: string) => string;
+  /** An action's input fields, by their name, as the approval card labels them. */
+  inputs: Readonly<Record<string, string>>;
+  allow: string;
+  decline: string;
+  /**
+   * On a person's page, in place of the approval card: what the agent asked to do waits for the
+   * business's yes (`decides: "business"`), which its people give from their app.
+   */
+  confirming: string;
+  /** The line across the log where the agent handed the conversation to a person. */
+  handedOff: string;
+  /**
+   * The line across the log where who answers the conversation changed (`handovers`), before
+   * why: to whom (`holder`), and who changed it (`by`).
+   */
+  handover: (holder: Holder, by: HandoverBy, name: string) => string;
+  /** Under a person's message the agent let pass this time (a `skip`), before why. */
+  skipped: string;
+  /**
+   * On a call, under a reply the person cut short: the last of what they heard of it (`""`:
+   * nothing of it).
+   */
+  cut: (heard: string) => string;
+  /** The composer's invitation when the host takes what is written (`write`): the business's. */
+  write: string;
+  /** Under what a person of the business wrote on the channel: who it was. */
+  business: string;
+  /** A voice note's player, by its name. */
+  voiceNote: string;
+  /** Where what went out on a channel got to, as its mark's name. */
+  delivery: Readonly<Record<Delivery, string>>;
+  /** Beside a message that never reached the person, with the provider's reason when it gave one. */
+  undelivered: (error: string | null) => string;
+  /**
+   * What the page answers when the agent calls one of the host's tools and the chat was given no
+   * `onTool` to run it: read by the agent, never shown.
+   */
+  noTool: string;
+  /** What the kit's controls say on the agent's screens: a form's checks, a calendar, a list. */
+  kit: Partial<KitMessages>;
+  /** What the browser the agent drives says: who holds it, take it, give it back. */
+  browser: BrowserMessages;
+}
+export declare const CHAT_MESSAGES: ChatMessages;
+/** The chat's parts, by the class each carries; `classNames` adds a host's own under the same keys. */
+export type ChatPart = "sc-chat" | "sc-chat--builder" | "sc-chat--console" | "sc-chat__log" | "sc-chat__log--channel" | "sc-chat__message" | "sc-chat__message--person" | "sc-chat__message--agent" | "sc-chat__message--action" | "sc-chat__message--business" | "sc-chat__said" | "sc-chat__business" | "sc-chat__meta" | "sc-chat__delivery" | "sc-chat__text" | "sc-chat__steps" | "sc-chat__step" | "sc-chat__mark" | "sc-chat__step--running" | "sc-chat__step--queued" | "sc-chat__step--waiting" | "sc-chat__step--done" | "sc-chat__step--failed" | "sc-chat__output" | "sc-chat__request" | "sc-chat__confirming" | "sc-chat__screen" | "sc-chat__screen--bare" | "sc-chat__handoff" | "sc-chat__handover" | "sc-chat__decision" | "sc-chat__message--heard" | "sc-chat__message--voice" | "sc-chat__transcript" | "sc-chat__cut" | "sc-chat__reply" | "sc-chat__status" | "sc-chat__done" | "sc-chat__empty" | "sc-chat__suggestion" | "sc-chat__composer" | "sc-chat__files" | "sc-chat__attach" | "sc-chat__dictate" | "sc-chat__typing" | "sc-chat__dictation" | "sc-chat__drop" | "sc-chat__input" | "sc-chat__actions" | "sc-chat__send" | "sc-chat__stop";
+type ClassNames = Partial<Record<ChatPart | SurfacePart | KitPart | BrowserPart, string>> | undefined;
+/**
+ * How the chat looks. `agent` is an agent's conversation. `builder` is the builder's, v2's: the
+ * working line says what it does under the brand's sweeping light, the steps open on what they
+ * returned, the send is the brand's; `console` is the same seen as a console beside the work, the
+ * person's words as prompt lines.
+ */
+export type ChatLook = "agent" | "builder" | "console";
+/**
+ * Whether the chat shows the steps the agent took (searching its files, remembering, calling a
+ * tool, with what each returned): `shown` for the business, who wants to see the work; `hidden`
+ * for the people it serves, who see only what the agent says and shows, and a quiet line while
+ * it works.
+ */
+export type ChatSteps = "shown" | "hidden";
+/**
+ * Who changed who answers a conversation: one of the business's people (`owner`), the agent itself
+ * (its `escalate`), the platform (a release after quiet hours, a contact the owner marked), or an
+ * automation, by its title.
+ */
+export type HandoverBy = {
+  kind: "owner" | "agent" | "platform";
+} | {
+  kind: "automation";
+  title: string;
+};
+/** Something the host hands the chat from outside it, to say or to leave in the composer. */
+export interface ChatCompose {
+  text: string;
+  /** Said at once; otherwise left in the composer for the person to finish. */
+  send: boolean;
+  /** Tells one request from the last: each new key is taken once. */
+  key: number;
+}
+export interface AgentChatProps {
+  client: Client;
+  conversationId: string;
+  /** The agent's name, for the words that address it. */
+  name: string;
+  messages?: Partial<ChatMessages> | undefined;
+  classNames?: ClassNames;
+  /** The host's own drawing of a block type, for every surface the agent shows. */
+  components?: SurfaceComponents | undefined;
+  /** The language of the surfaces' calendars, days, times and numbers; English by default. */
+  locale?: KitLocale | undefined;
+  /** An error's code, from the socket or `load` for a history that could not be read; the host words it. */
+  onError?: ((code: string) => void) | undefined;
+  /** The host's own controls, at the composer's left. */
+  actions?: ReactNode;
+  /** A few things the person might say first, offered while nothing has been said; a click says it. */
+  suggestions?: readonly string[] | undefined;
+  /**
+   * A request from elsewhere on the page (a button beside the chat), taken once each time `key`
+   * changes; the one the chat mounts with is not. With `send` it is said, once the socket is open;
+   * while a reply is on its way or the turn waits, it goes into the composer instead. Without, it
+   * goes into the composer, focused with the caret at its end.
+   */
+  compose?: ChatCompose | undefined;
+  /** An agent's conversation by default; the builder's, or the builder's as a console. */
+  look?: ChatLook | undefined;
+  /**
+   * Whether the agent's steps show: by default as the page speaks (`client.who`): `shown` for the
+   * business, `hidden` for a person or a visitor, who see what the agent says and shows (its
+   * surfaces, files, a yes it waits for) and `typing` while it works.
+   */
+  steps?: ChatSteps | undefined;
+  /**
+   * Whether the person can attach files to what they say (the paperclip, dropping them on the
+   * chat, pasting a picture): each uploads to the conversation at once. On in every look, the
+   * builder's too; a host turns it off where nobody talks (a transcript read).
+   */
+  attachments?: boolean | undefined;
+  /**
+   * Opens a file of the conversation (one the person sent, one sent through a form), as the host
+   * shows files (`FileView` in a dialog, its bytes from the API); without it, files only read.
+   */
+  onOpenFile?: ((file: Attachment) => void) | undefined;
+  /**
+   * Turns what the person says out loud into words in the composer (the microphone beside the
+   * paperclip): the host's speech to text. Without it there is no microphone.
+   */
+  dictate?: Dictate | undefined;
+  /**
+   * Where what is written goes instead of the socket: on a conversation on a channel, a person of
+   * the business writing to the person there (`POST /conversations/{id}/operator`). The composer
+   * then says `write`, takes words and files whatever the agent is doing, and empties once the
+   * promise resolves (a rejection leaves them, for the host to say why); what was written comes
+   * back on the socket as a message.
+   */
+  write?: ((text: string, files: readonly string[]) => Promise<unknown>) | undefined;
+  /**
+   * Whether the log draws who answers the conversation, for a host of the business's (the inbox,
+   * the activity): each change (read with the history, then heard live) a quiet line where it
+   * fell, with why and when, and under a person's message the agent let pass, that it did. Off,
+   * the log draws only where the agent handed it to a person, from its `escalate` step.
+   */
+  handovers?: boolean | undefined;
+  /** Hears each change of who answers the conversation, live: the host's own views of it follow. */
+  onHolder?: ((holder: Holder, handover: Handover) => void) | undefined;
+  /** Hears each step the agent starts, live, by its action's name: the host's views follow. */
+  onStep?: ((action: string) => void) | undefined;
+  /**
+   * The conversation's last change of who answers it, as the host knows it (one it made itself,
+   * as its request answered): drawn at once, whether or not the socket tells it, and kept once.
+   */
+  handover?: Handover | null | undefined;
+  /**
+   * Runs one of the host's own tools the agent calls in the page (opening a record in the host's
+   * screen, say): what it resolves to goes back to the agent, what it rejects with as why it
+   * failed; its step shows as working meanwhile. Without it, each is refused with `noTool`.
+   */
+  onTool?: ToolHandler | undefined;
+}
+/**
+ * The conversation with an agent: the person's messages at the right in a bubble, the agent's at
+ * the left as text with the steps it took and what they drew, its reply growing as it streams;
+ * the composer at the foot. On a channel, the business's side stays at the left: the agent's
+ * words with where they got to (a quiet mark), and what a person of the business wrote set apart
+ * in a bubble of its own; the surfaces went to the person there, so they only read here, and the
+ * reply, which runs on its own time, can't be stopped from here. With `handovers`, each change of
+ * who answers it is a quiet line where it fell, the moment it is made, and a person's message the
+ * agent let pass says so under it. The host picks the conversation; another id starts the chat
+ * afresh.
+ */
+export declare function AgentChat(props: AgentChatProps): import("react").JSX.Element;
+//#endregion
+export {};
+//# sourceMappingURL=AgentChat.d.ts.map