@ruimte/agents-react 0.0.0 → 0.7.0

package/dist/chat/ui/BookmarkMarker.js

@@ -0,0 +1,59 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef } from 'react';
+import clsx from 'clsx';
+import { useTranslation } from 'react-i18next';
+import { Bookmark, Pencil, X } from 'lucide-react';
+import { CHAT_BOOKMARK_LIMITS } from '@ruimte/agent-contracts';
+import { nameBookmark, removeBookmark, useBookmarkNaming } from '../bookmarks';
+import { bookmarkLabel } from '../logic/bookmarks';
+import { useChatScope } from '../../scope';
+import { BTN_GROUP } from '@ruimte/ui/classes';
+import { Icon } from '@ruimte/ui/Icon';
+import { Tooltip } from '@ruimte/ui/Tooltip';
+/*
+ * A bookmark as a chapter line across the thread, drawn before the message it marks. Without a
+ * bookmark it only stands while the name field of a mark still on its way to the host is open.
+ */
+export function BookmarkMarker({ chatId, itemId, bookmark }) {
+    const { t } = useTranslation('agent-chat');
+    const scope = useChatScope();
+    const chatKey = scope.keyOf(chatId);
+    const naming = useBookmarkNaming((s) => s.chatKey === chatKey && s.itemId === itemId);
+    if (bookmark === null && !naming) {
+        return null;
+    }
+    return (_jsxs("div", { className: "group/bookmark mb-2 flex h-7 min-w-0 items-center gap-2 text-xs select-none", children: [_jsx(Icon, { icon: Bookmark, size: 14, className: "shrink-0 text-accent" }), naming ? (_jsx(NameField, { initial: bookmark?.name ?? '', onDone: (name) => {
+                    useBookmarkNaming.getState().close();
+                    if (name !== null) {
+                        void nameBookmark(scope, chatId, itemId, name, bookmark?.name);
+                    }
+                } })) : (bookmark !== null && (_jsx("span", { className: clsx('min-w-0 truncate', bookmark.name === undefined ? 'text-text-muted' : 'text-text'), children: bookmarkLabel(bookmark) }))), _jsx("span", { className: "min-w-6 grow border-t border-border" }), bookmark !== null && !naming && (_jsxs("span", { className: clsx(BTN_GROUP, '-ml-2 max-w-0 shrink-0 overflow-hidden opacity-0 group-hover/bookmark:ml-0 group-hover/bookmark:max-w-none group-hover/bookmark:opacity-100 group-has-focus-visible/bookmark:ml-0 group-has-focus-visible/bookmark:max-w-none group-has-focus-visible/bookmark:opacity-100'), children: [_jsx(Tooltip, { label: t('bookmarks.rename'), name: true, children: _jsx("button", { type: "button", className: "icon-btn icon-btn-xs", onClick: () => useBookmarkNaming.getState().open(chatKey, itemId), children: _jsx(Icon, { icon: Pencil, size: 12 }) }) }), _jsx(Tooltip, { label: t('bookmarks.remove'), name: true, children: _jsx("button", { type: "button", className: "icon-btn icon-btn-xs", onClick: () => void removeBookmark(scope, chatId, bookmark), children: _jsx(Icon, { icon: X, size: 12 }) }) })] }))] }));
+}
+/* Settles with the name on Enter or when the focus leaves, and with null on Escape, which keeps the name as it was. */
+function NameField({ initial, onDone }) {
+    const { t } = useTranslation('agent-chat');
+    const ref = useRef(null);
+    const settled = useRef(false);
+    // Again a frame later: the menu the field was opened from hands the focus back as it closes.
+    useEffect(() => {
+        ref.current?.focus();
+        const frame = requestAnimationFrame(() => ref.current?.focus());
+        return () => cancelAnimationFrame(frame);
+    }, []);
+    const settle = (name) => {
+        if (settled.current) {
+            return;
+        }
+        settled.current = true;
+        onDone(name);
+    };
+    return (_jsx("input", { ref: ref, defaultValue: initial, maxLength: CHAT_BOOKMARK_LIMITS.name, placeholder: t('bookmarks.namePlaceholder'), "aria-label": t('bookmarks.nameLabel'), className: "field field-sm w-64 max-w-full min-w-0 select-text", onPointerDown: (e) => e.stopPropagation(), onFocus: (e) => e.currentTarget.select(), onBlur: (e) => settle(e.currentTarget.value), onKeyDown: (e) => {
+            e.stopPropagation();
+            if (e.key === 'Enter') {
+                settle(e.currentTarget.value);
+            }
+            if (e.key === 'Escape') {
+                settle(null);
+            }
+        } }));
+}

package/dist/chat/ui/BookmarkSubmenu.d.ts

@@ -0,0 +1,3 @@
+export declare function BookmarkSubmenu({ chatId }: {
+    chatId: string;
+}): import("react").JSX.Element | null;

package/dist/chat/ui/BookmarkSubmenu.js

@@ -0,0 +1,44 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import clsx from 'clsx';
+import { useTranslation } from 'react-i18next';
+import { Menu } from '@base-ui-components/react/menu';
+import { Bookmark, ChevronRight, Pencil, X } from 'lucide-react';
+import { goToBookmark, removeBookmark } from '../bookmarks';
+import { bookmarkLabel, bookmarksInThreadOrder } from '../logic/bookmarks';
+import { chatHost } from '../../host';
+import { useChatScope } from '../../scope';
+import { useChatRow } from '../../state/chats';
+import { BTN_GROUP } from '@ruimte/ui/classes';
+import { Icon } from '@ruimte/ui/Icon';
+import { Tooltip } from '@ruimte/ui/Tooltip';
+const actionOf = (e) => {
+    const action = e.target.closest('[data-bookmark-action]')?.dataset.bookmarkAction;
+    return action === 'rename' || action === 'remove' ? action : null;
+};
+/*
+ * "Bookmarks" in the menu of a chat node or a chat view: the chat's bookmarks in the order of the
+ * thread, each a jump to its message. Rename and remove sit on the row itself; the message's own
+ * menu offers both to a keyboard. A chat without bookmarks draws nothing.
+ */
+export function BookmarkSubmenu({ chatId }) {
+    const { t } = useTranslation('agent-chat');
+    const scope = useChatScope();
+    const bookmarks = useChatRow(chatId, (row) => row?.bookmarks);
+    const order = useChatRow(chatId, (row) => row?.order);
+    const place = chatHost().useChatPlace(chatId);
+    const sorted = useMemo(() => bookmarksInThreadOrder(bookmarks ?? [], order ?? []), [bookmarks, order]);
+    if (sorted.length === 0) {
+        return null;
+    }
+    return (_jsxs(Menu.SubmenuRoot, { children: [_jsxs(Menu.SubmenuTrigger, { className: "menu-item", children: [_jsx(Icon, { icon: Bookmark, size: 14 }), " ", t('bookmarks.menu'), _jsx(Icon, { icon: ChevronRight, size: 14, className: "ml-auto text-text-faint" })] }), _jsx(Menu.Portal, { children: _jsx(Menu.Positioner, { className: "z-(--z-popup)", sideOffset: 4, alignOffset: -4, children: _jsx(Menu.Popup, { className: "menu-popup max-w-80 min-w-56", children: sorted.map((bookmark) => (_jsxs(Menu.Item, { className: "menu-item group/bookmark", onClick: (e) => {
+                                const action = actionOf(e);
+                                if (action === 'remove') {
+                                    void removeBookmark(scope, chatId, bookmark);
+                                    return;
+                                }
+                                if (!goToBookmark(scope, chatId, bookmark.itemId, action === 'rename')) {
+                                    place.go();
+                                }
+                            }, children: [_jsx(Icon, { icon: Bookmark, size: 14, className: "shrink-0 text-accent" }), _jsx("span", { className: clsx('min-w-0 grow truncate', bookmark.name === undefined && 'text-text-muted'), children: bookmarkLabel(bookmark) }), _jsxs("span", { className: `${BTN_GROUP} -my-1 ml-2 shrink-0 opacity-0 group-data-[highlighted]/bookmark:opacity-100`, children: [_jsx(Tooltip, { label: t('bookmarks.rename'), name: true, children: _jsx("button", { type: "button", tabIndex: -1, "data-bookmark-action": "rename", className: "icon-btn icon-btn-xs", children: _jsx(Icon, { icon: Pencil, size: 12 }) }) }), _jsx(Tooltip, { label: t('bookmarks.remove'), name: true, children: _jsx("button", { type: "button", tabIndex: -1, "data-bookmark-action": "remove", className: "icon-btn icon-btn-xs", children: _jsx(Icon, { icon: X, size: 12 }) }) })] })] }, bookmark.itemId))) }) }) })] }));
+}

package/dist/chat/ui/ChatActivity.d.ts

@@ -0,0 +1,3 @@
+export declare function ChatActivity({ chatId }: {
+    chatId: string;
+}): import("react").JSX.Element | null;

package/dist/chat/ui/ChatActivity.js

@@ -0,0 +1,87 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { Popover } from '@base-ui-components/react/popover';
+import clsx from 'clsx';
+import { useTranslation } from 'react-i18next';
+import { Activity, Square, SquareTerminal } from 'lucide-react';
+import { backgroundCounts } from '../activity';
+import { badgeCountOf, entryTimeOf, flyoutSubagents, statusWordOf, subagentTitle, summaryWordOf, taskIdOf } from '../subagent-list';
+import { useSubagentSupport } from '../subagent-support';
+import { canOpenSubagent, crumbOf, openFromMain, useSubagentTrail } from '../subagent-view';
+import { SubagentStopButton } from './SubagentStopButton';
+import { formatElapsedShort } from '@ruimte/ui/format/duration';
+import { useChatRow } from '../../state/chats';
+import { chatHost } from '../../host';
+import { useChatScope } from '../../scope';
+import { useChatActions } from '../actions';
+import { FLOAT } from '@ruimte/ui/classes';
+import { Icon } from '@ruimte/ui/Icon';
+import { statusLookOf } from '../../agents/status-look';
+import { Tooltip } from '@ruimte/ui/Tooltip';
+import { useNow } from '@ruimte/ui/useNow';
+const NO_TASKS = [];
+const NO_ITEMS = [];
+const CHIP = `${FLOAT} pointer-events-auto inline-flex h-7.5 items-center gap-1.5 rounded-full px-3 text-xs text-text-muted hover:text-text`;
+const ROW_BODY = 'flex min-h-9 min-w-0 grow items-center gap-2.5 rounded-md px-2.5 py-1.5 text-left';
+/* What the chat keeps working on beside the thread, in one small line over the composer: its sub-agents and what runs in the background. */
+export function ChatActivity({ chatId }) {
+    const { t } = useTranslation('agent-chat');
+    const order = useChatRow(chatId, (row) => row?.order) ?? NO_ITEMS;
+    const structure = useChatRow(chatId, (row) => row?.structure);
+    const subagents = useMemo(() => (structure === undefined ? [] : flyoutSubagents(order, structure)), [order, structure]);
+    const { id } = useChatScope();
+    const tasks = chatHost().tasks.useTasks(id);
+    const words = useMemo(() => subagents.map((item) => {
+        const taskId = taskIdOf(item);
+        return statusWordOf(item, taskId === null ? null : (tasks?.[taskId] ?? null));
+    }), [subagents, tasks]);
+    const background = useChatRow(chatId, (row) => row?.info.background) ?? NO_TASKS;
+    if (subagents.length === 0 && background.length === 0) {
+        return null;
+    }
+    const { shells, monitors } = backgroundCounts(background);
+    return (_jsxs("div", { className: "mb-3 flex flex-wrap items-center gap-2", children: [subagents.length > 0 && (_jsx(Flyout, { icon: _jsx(StatusIcon, { word: summaryWordOf(words) }), label: t('activity.subagents', { count: badgeCountOf(words) }), heading: t('activity.subagents', { count: subagents.length }), children: _jsx(SubagentRows, { chatId: chatId, items: subagents }) })), background.length > 0 && (_jsx(Flyout, { icon: _jsx(Icon, { icon: shells > 0 ? SquareTerminal : Activity, size: 14 }), label: [shells > 0 && t('activity.shells', { count: shells }), monitors > 0 && t('activity.monitors', { count: monitors })]
+                    .filter(Boolean)
+                    .join(' · '), children: _jsx(BackgroundTaskRows, { chatId: chatId, tasks: background }) }))] }));
+}
+function StatusIcon({ word }) {
+    const look = statusLookOf(word);
+    return _jsx(Icon, { icon: look.icon, size: 14, className: clsx('shrink-0', look.tone, look.spins && 'animate-spin') });
+}
+/* A chip that opens a list over it, headed by what the chip says unless the list counts more than the chip does. */
+function Flyout({ icon, label, heading = label, children }) {
+    return (_jsxs(Popover.Root, { children: [_jsxs(Popover.Trigger, { className: CHIP, children: [icon, label] }), _jsx(Popover.Portal, { children: _jsx(Popover.Positioner, { side: "top", sideOffset: 8, align: "start", className: "z-(--z-popup)", children: _jsxs(Popover.Popup, { className: "menu-popup w-80", children: [_jsx("div", { className: "px-2.5 pt-1.5 pb-1 text-xs text-text-faint", children: heading }), children] }) }) })] }));
+}
+/* One line of a flyout; with `onOpen` the line leads somewhere and closes the flyout on the way. */
+function ActivityRow({ icon, title, detail, time, onOpen, children }) {
+    const body = (_jsxs(_Fragment, { children: [icon, _jsxs("span", { className: "flex min-w-0 grow flex-col", children: [_jsx("span", { className: "truncate text-sm text-text", children: title }), detail && _jsx("span", { className: "truncate font-mono text-xs text-text-faint", children: detail })] }), time !== '' && _jsx("span", { className: "shrink-0 text-xs text-text-faint tabular-nums", children: time })] }));
+    // The stop is a button of its own beside the line, since a button cannot hold another.
+    return (_jsxs("div", { className: clsx('flex items-center gap-1 rounded-md', onOpen && 'hover:bg-surface-hover'), children: [onOpen ? (_jsx(Popover.Close, { className: ROW_BODY, onClick: onOpen, children: body })) : (_jsx("div", { className: ROW_BODY, children: body })), children] }));
+}
+/* Only drawn while the flyout is open, so the clock ticks for nobody otherwise. */
+function SubagentRows({ chatId, items }) {
+    const now = useNow(1000, items.some((item) => item.status === 'running'));
+    return items.map((item) => _jsx(SubagentEntry, { chatId: chatId, item: item, now: now }, item.id));
+}
+function SubagentEntry({ chatId, item, now }) {
+    const { t } = useTranslation('agent-chat');
+    const { id } = useChatScope();
+    const refused = useSubagentSupport((s) => s.unsupported[id] === true);
+    const task = chatHost().tasks.useTask(id, taskIdOf(item));
+    const { show } = useSubagentTrail(chatId);
+    const word = statusWordOf(item, task);
+    return (_jsx(ActivityRow, { icon: _jsx(StatusIcon, { word: word }), title: _jsxs(_Fragment, { children: [subagentTitle(item), _jsxs("span", { className: "sr-only", children: [", ", t(`common.status.${word}`)] })] }), time: entryTimeOf(item, task, now), onOpen: canOpenSubagent(item, refused) ? () => show(openFromMain(crumbOf(item))) : undefined, children: _jsx(SubagentStopButton, { chatId: chatId, item: item, className: "mr-1.5" }) }));
+}
+/* Only drawn while the flyout is open, so the clock ticks for nobody otherwise. */
+function BackgroundTaskRows({ chatId, tasks }) {
+    const { t } = useTranslation('agent-chat');
+    const now = useNow(1000);
+    const actions = useChatActions();
+    function stop(taskId) {
+        void actions.stopTask(chatId, taskId).catch((e) => {
+            const description = e instanceof Error ? e.message : t('subagents.noAnswer');
+            chatHost().notify({ kind: 'error', title: t('activity.stopFailed'), description });
+        });
+    }
+    return tasks.map((task) => (_jsx(ActivityRow, { icon: _jsx(Icon, { icon: task.kind === 'shell' ? SquareTerminal : Activity, size: 14, className: "shrink-0 text-text-faint" }), title: task.description || task.command || t(`activity.${task.kind}`), detail: task.description ? task.command : null, time: formatElapsedShort(now - task.startedAt), children: _jsx(Tooltip, { label: t('activity.stop'), name: true, children: _jsx("button", { type: "button", className: "icon-btn icon-btn-xs mr-1.5", onClick: () => stop(task.id), children: _jsx(Icon, { icon: Square, size: 12 }) }) }) }, task.id)));
+}

package/dist/chat/ui/ChatReferenceChip.d.ts

@@ -0,0 +1,4 @@
+export declare function ChatReferenceChip({ chatId, onRemove }: {
+    chatId: string;
+    onRemove?: () => void;
+}): import("react").JSX.Element;

package/dist/chat/ui/ChatReferenceChip.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import clsx from 'clsx';
+import { useTranslation } from 'react-i18next';
+import { MessageSquare, X } from 'lucide-react';
+import { chatHost } from '../../host';
+import { CHIP_IN_MESSAGE, MENTION_TONE } from './chips';
+import { Icon } from '@ruimte/ui/Icon';
+import { Tooltip } from '@ruimte/ui/Tooltip';
+/* A chat attached to a message, under the title it has now rather than the one it had when it was attached. */
+export function ChatReferenceChip({ chatId, onRemove }) {
+    const { t } = useTranslation('agent-chat');
+    const chat = chatHost()
+        .useReferableChats()
+        .find((candidate) => candidate.id === chatId);
+    const title = chat === undefined ? t('chatReference.gone') : chat.title || t('chatReference.untitled');
+    return (_jsxs("span", { className: clsx(MENTION_TONE, CHIP_IN_MESSAGE), children: [_jsx(Icon, { icon: MessageSquare, size: 12, className: "shrink-0" }), _jsx("span", { className: "truncate", children: title }), onRemove && (_jsx(Tooltip, { label: t('chatReference.remove', { title }), name: true, children: _jsx("button", { className: "-mr-0.5 shrink-0 rounded-sm opacity-70 hover:opacity-100", onClick: onRemove, children: _jsx(Icon, { icon: X, size: 12 }) }) }))] }));
+}

package/dist/chat/ui/CodeBlock.d.ts

@@ -0,0 +1,4 @@
+export declare function CodeBlock({ code, lang }: {
+    code: string;
+    lang: string;
+}): import("react").JSX.Element;

package/dist/chat/ui/CodeBlock.js

@@ -0,0 +1,130 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment, memo, useContext, useEffect, useMemo, useState } from 'react';
+import clsx from 'clsx';
+import { IncrementalLines } from './code-lines';
+import { CodeStreamingContext } from './code-streaming';
+import { WHOLE_FADE_CLASS } from './rehype-fade';
+import { shikiThemeOf, useCodeTheme } from './code-theme';
+// A plain language needs no grammar; shiki draws it in the theme's own foreground.
+const PLAIN = 'text';
+let highlighter = null;
+let highlighterLoad = null;
+const loadedLanguages = new Set([PLAIN]);
+const languageLoads = new Map();
+const loadedThemes = new Set();
+const themeLoads = new Map();
+const tokenizers = new Map();
+// Shiki loads on the first code block, not with the app; the web bundle covers the languages a coding agent writes.
+const loadHighlighter = () => {
+    highlighterLoad ??= import('shiki/bundle/web').then(async ({ createHighlighter }) => {
+        highlighter = await createHighlighter({ themes: [], langs: [] });
+        return highlighter;
+    });
+    return highlighterLoad;
+};
+const resolveLanguage = (lang, known) => (known !== null && lang in known ? lang : PLAIN);
+let bundled = null;
+/* Loads the highlighter and the grammar of one language, once each. */
+const loadLanguage = (lang) => {
+    let load = languageLoads.get(lang);
+    if (!load) {
+        load = Promise.all([loadHighlighter(), import('shiki/bundle/web')]).then(async ([loaded, { bundledLanguages }]) => {
+            bundled = bundledLanguages;
+            const language = resolveLanguage(lang, bundledLanguages);
+            if (!loadedLanguages.has(language)) {
+                await loaded.loadLanguage(language);
+                loadedLanguages.add(language);
+            }
+        });
+        languageLoads.set(lang, load);
+    }
+    return load;
+};
+/* Loads a theme into the highlighter, once. */
+const loadTheme = (theme) => {
+    let load = themeLoads.get(theme);
+    if (!load) {
+        load = loadHighlighter().then(async (loaded) => {
+            await loaded.loadTheme(shikiThemeOf(theme));
+            loadedThemes.add(theme);
+        });
+        themeLoads.set(theme, load);
+    }
+    return load;
+};
+/* The tokenizer for a language in a theme, or null while shiki, the grammar or the theme is still on its way. */
+const tokenizerFor = (lang, theme) => {
+    if (highlighter === null || bundled === null || !languageLoads.has(lang) || !loadedThemes.has(theme)) {
+        return null;
+    }
+    const language = resolveLanguage(lang, bundled);
+    if (!loadedLanguages.has(language)) {
+        return null;
+    }
+    const key = `${language}:${theme}`;
+    let entry = tokenizers.get(key);
+    if (!entry) {
+        const loaded = highlighter;
+        const options = { lang: language, theme };
+        entry = {
+            tokenize: (code, state) => {
+                const result = loaded.codeToTokens(code, state ? { ...options, grammarState: state } : options);
+                return { lines: result.tokens, state: result.grammarState };
+            },
+            fg: loaded.getTheme(theme).fg
+        };
+        tokenizers.set(key, entry);
+    }
+    return entry;
+};
+const styleOf = (token) => {
+    const style = token.fontStyle ?? 0;
+    if (token.color === undefined && style <= 0) {
+        return undefined;
+    }
+    const decorations = [style & 4 ? 'underline' : '', style & 8 ? 'line-through' : ''].filter(Boolean).join(' ');
+    return {
+        color: token.color,
+        ...(style & 1 ? { fontStyle: 'italic' } : {}),
+        ...(style & 2 ? { fontWeight: 'bold' } : {}),
+        ...(decorations ? { textDecoration: decorations } : {})
+    };
+};
+/* A line whose tokens did not change keeps its elements, so a selection in it survives the next delta. */
+const CodeLine = memo(function CodeLine({ tokens }) {
+    return (_jsx("span", { className: "line", children: tokens.map((token, index) => (_jsx("span", { style: styleOf(token), children: token.content }, index))) }));
+});
+/*
+ * A fenced block, highlighted a line at a time. Until shiki and the grammar are there it holds its
+ * place invisibly in the same shape, so there is never a frame of bare code that turns colored. A
+ * fence that is still open is tokenized as it grows, and the same component carries on once it
+ * closes, so closing it does not draw it again.
+ */
+export function CodeBlock({ code, lang }) {
+    const theme = useCodeTheme();
+    const streaming = useContext(CodeStreamingContext);
+    // What loaded last, so a block whose theme changes draws again once the new one is in.
+    const [loaded, setLoaded] = useState(null);
+    const tokenizer = tokenizerFor(lang, theme);
+    // Only a block that had to wait fades in; one drawn highlighted from its first frame just stands there.
+    const [waited] = useState(tokenizer === null);
+    const lines = useMemo(() => (tokenizer ? new IncrementalLines(tokenizer.tokenize) : null), [tokenizer]);
+    const tokens = useMemo(() => lines?.update(code, !streaming) ?? null, [lines, code, streaming]);
+    useEffect(() => {
+        if (tokenizer !== null) {
+            return;
+        }
+        let cancelled = false;
+        Promise.all([loadLanguage(lang), loadTheme(theme)])
+            .then(() => !cancelled && setLoaded(`${lang}:${theme}`))
+            .catch(() => !cancelled && setLoaded('failed'));
+        return () => {
+            cancelled = true;
+        };
+    }, [lang, theme, tokenizer]);
+    if (tokenizer === null || tokens === null) {
+        const failed = loaded === 'failed';
+        return (_jsx("div", { className: clsx('chat-code', !failed && 'invisible'), "aria-hidden": failed ? undefined : true, children: _jsx("pre", { children: _jsx("code", { children: code }) }) }));
+    }
+    return (_jsx("div", { className: clsx('chat-code', waited && WHOLE_FADE_CLASS), children: _jsx("pre", { style: { color: tokenizer.fg }, children: _jsx("code", { children: tokens.map((line, index) => (_jsxs(Fragment, { children: [_jsx(CodeLine, { tokens: line }), index < tokens.length - 1 && '\n'] }, index))) }) }) }));
+}

package/dist/chat/ui/Composer.d.ts

@@ -0,0 +1,14 @@
+import type { AgentKind, ChatInfo, ModelSelection } from '@ruimte/agent-contracts';
+import type { ChatSendExtras } from '../chat-client';
+interface ComposerProps {
+    chatId: string;
+    info: ChatInfo;
+    focused: boolean;
+    answerPromptsElsewhere?: () => void;
+    disabled: boolean;
+    providerFixed: boolean;
+    onSend(text: string, extras: ChatSendExtras): void;
+    onRetarget(provider: AgentKind, selection: ModelSelection): void;
+}
+export declare function Composer({ chatId, info, focused, answerPromptsElsewhere, disabled, providerFixed, onSend, onRetarget }: ComposerProps): import("react").JSX.Element;
+export {};