@teaflask/assistant 0.0.0 → 0.6.0

package/dist/components/conversation-view.js

@@ -0,0 +1,74 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { NO_GATE } from "../core/connect-gate.js";
+import { ObservableCell } from "../core/observable-cell.js";
+import { Composer } from "./composer.js";
+import { ConversationContext, useConversation, } from "./conversation-context.js";
+import { NoticeBanner, PendingDecisionGapNotice } from "./notice-banner.js";
+import { useOptionalAssistantSession } from "./teaflask-assistant-provider.js";
+import { useCell } from "./use-store-cell.js";
+import { ArrowRightIcon, BookIcon, ComposeIcon, FlagIcon, SearchIcon, } from "./icons.js";
+import { TfButton } from "./primitives/button.js";
+import { SurfaceBoundary } from "./surface-boundary.js";
+import { Transcript } from "./transcript.js";
+import { MessageList } from "./message-list.js";
+import { withPendingUserEcho } from "../core/transcript-rows.js";
+const NO_GATE_CELL = new ObservableCell(NO_GATE);
+function _asSuggestion(input) {
+    return typeof input === "string" ? { prompt: input } : input;
+}
+export function ConversationView({ core, surface, suggestions, welcomeTitle, welcomeMark, }) {
+    const session = useOptionalAssistantSession();
+    const gate = useCell(session?.conversationGate ?? NO_GATE_CELL);
+    return (_jsx(ConversationContext.Provider, { value: core.composerContract, children: _jsx("div", { "data-tf-conversation": "", className: "tf:relative tf:flex tf:min-h-0 tf:min-w-0 tf:flex-1 tf:flex-col", children: _jsxs("div", { "data-tf-conversation-body": "", className: "tf:contents", children: [core.showInterruptionBanner ? (_jsxs(NoticeBanner, { children: ["The connection to the assistant was interrupted.", _jsx(TfButton, { variant: "ghost", onClick: core.retryStream, children: "Retry" })] })) : null, core.sendError !== null ? (_jsx(NoticeBanner, { children: core.sendError })) : null, core.pendingDecisionGap ? (_jsx(PendingDecisionGapNotice, { onRetry: () => {
+                            void core.refreshConversation();
+                        } })) : null, core.turnFailure !== null ? (_jsx(NoticeBanner, { children: core.turnFailure })) : null, gate.kind === "sign_in" ? (_jsx("div", { className: "tf:flex tf:flex-1 tf:items-center tf:justify-center tf:p-6", children: _jsx(SignInRequiredState, {}) })) : core.threadOpening ? (_jsx(TranscriptSkeleton, {})) : core.conversation !== null ? (_jsx(SurfaceBoundary, { surface: "transcript", children: _jsx(Transcript, { surface: surface }) }, `${core.conversation.thread.id}#${String(core.reconnectNonce)}`)) : (_jsx(SurfaceBoundary, { surface: "welcome", children: _jsx(EmptyConversation, { surface: surface, suggestions: gate.kind === "none" ? suggestions : undefined, welcomeTitle: welcomeTitle, welcomeMark: welcomeMark }) }))] }) }) }));
+}
+function SignInRequiredState() {
+    return (_jsxs("div", { className: "tf:max-w-md tf:text-center", children: [_jsx("h2", { className: "tf:text-tf-heading tf:font-medium", children: "This assistant is available to signed-in users." }), _jsx("p", { className: "tf:mt-1 tf:text-tf-label tf:text-tf-muted-foreground", children: "Sign in to this site to start chatting." })] }));
+}
+export function TranscriptSkeleton() {
+    return (_jsx("div", { "aria-hidden": "true", "data-tf-skeleton": "", className: "tf:min-h-0 tf:flex-1 tf:overflow-hidden tf:px-4 tf:py-6", children: _jsxs("div", { className: "tf:mx-auto tf:flex tf:w-full tf:max-w-3xl tf:flex-col tf:gap-6", children: [_jsx("div", { className: "tf:flex tf:justify-end", children: _jsx("div", { className: "tf:h-8 tf:w-2/5 tf:rounded-xl tf:bg-tf-muted" }) }), _jsxs("div", { className: "tf:flex tf:flex-col tf:gap-2", children: [_jsx("div", { className: "tf:h-4 tf:w-full tf:rounded-tf tf:bg-tf-muted" }), _jsx("div", { className: "tf:h-4 tf:w-11/12 tf:rounded-tf tf:bg-tf-muted" }), _jsx("div", { className: "tf:h-4 tf:w-3/5 tf:rounded-tf tf:bg-tf-muted" })] }), _jsx("div", { className: "tf:flex tf:justify-end", children: _jsx("div", { className: "tf:h-8 tf:w-1/4 tf:rounded-xl tf:bg-tf-muted" }) }), _jsxs("div", { className: "tf:flex tf:flex-col tf:gap-2", children: [_jsx("div", { className: "tf:h-4 tf:w-10/12 tf:rounded-tf tf:bg-tf-muted" }), _jsx("div", { className: "tf:h-4 tf:w-1/2 tf:rounded-tf tf:bg-tf-muted" })] })] }) }));
+}
+export function SetupErrorState({ message, code, }) {
+    return (_jsxs("div", { className: "tf:max-w-md tf:text-center", children: [_jsx("h2", { className: "tf:text-tf-heading tf:font-medium", children: "The assistant couldn't connect" }), _jsx("p", { className: "tf:mt-1 tf:text-tf-label tf:text-tf-muted-foreground", children: message }), _jsx("p", { className: "tf:mt-2 tf:font-mono tf:text-xs tf:text-tf-muted-foreground", children: code })] }));
+}
+function EmptyConversation({ surface, suggestions, welcomeTitle = "Where should we begin?", welcomeMark, }) {
+    const { pendingEcho } = useConversation();
+    const pendingRows = withPendingUserEcho([], pendingEcho);
+    if (surface === "companion") {
+        return (_jsx(CompanionWelcome, { suggestions: suggestions, welcomeTitle: welcomeTitle, welcomeMark: welcomeMark, pendingRows: pendingRows }));
+    }
+    return (_jsx("div", { className: "tf:flex tf:min-h-0 tf:flex-1 tf:flex-col " +
+            (pendingEcho === null ? "tf:overflow-y-auto" : ""), children: _jsxs("div", { className: pendingEcho === null
+                ? "tf:my-auto tf:flex tf:w-full tf:flex-col tf:pt-4 tf:pb-16"
+                : "tf:contents", children: [pendingEcho !== null ? (_jsx(SurfaceBoundary, { surface: "message-list", children: _jsx(MessageList, { rows: pendingRows, cards: [], live: true }) })) : (_jsxs("div", { className: "tf:flex tf:items-center tf:justify-center tf:gap-2 tf:px-6 tf:pb-5 tf:text-center", children: [_jsx("span", { "data-tf-host-view": "", className: "tf:contents", children: welcomeMark }), _jsx("h2", { className: "tf:text-3xl tf:font-semibold tf:tracking-[-0.04em] tf:text-balance", children: welcomeTitle })] })), _jsx(SurfaceBoundary, { surface: "composer", children: _jsx(Composer, { compact: pendingEcho === null, surface: surface }) }), pendingEcho === null &&
+                    suggestions !== undefined &&
+                    suggestions.length > 0 ? (_jsx("div", { className: "tf:px-4 tf:pb-4", children: _jsx("div", { className: "tf:mx-auto tf:flex tf:w-full tf:max-w-xl tf:flex-col", children: _jsx(SuggestionRows, { suggestions: suggestions }) }) })) : null] }) }));
+}
+function CompanionWelcome({ suggestions, welcomeTitle, welcomeMark, pendingRows, }) {
+    return (_jsxs("div", { className: "tf:@container tf:flex tf:min-h-0 tf:min-w-0 tf:flex-1 tf:flex-col", children: [pendingRows.length > 0 ? (_jsx(SurfaceBoundary, { surface: "message-list", children: _jsx(MessageList, { rows: pendingRows, cards: [], live: true }) })) : (_jsx("div", { className: "tf:flex tf:min-h-0 tf:flex-1 tf:flex-col tf:overflow-y-auto", children: _jsxs("div", { className: suggestions !== undefined && suggestions.length > 0
+                        ? "tf:my-auto tf:flex tf:w-full tf:flex-col tf:pt-4 tf:pb-6"
+                        : "tf:my-auto tf:flex tf:w-full tf:flex-col tf:pt-16 tf:pb-6", children: [_jsx("div", { className: "tf:flex tf:justify-center", children: welcomeMark }), _jsx("div", { className: "tf:px-6 tf:pt-3 tf:pb-5 tf:text-center", children: _jsx("h2", { className: "tf:text-xl tf:font-semibold tf:tracking-[-0.04em] tf:text-balance tf:@md:text-2xl", children: welcomeTitle }) }), suggestions !== undefined && suggestions.length > 0 ? (_jsx("div", { className: "tf:px-4", children: _jsx("div", { className: "tf:mx-auto tf:flex tf:w-full tf:max-w-3xl tf:flex-col", children: _jsx(SuggestionRows, { suggestions: suggestions }) }) })) : null] }) })), _jsx("div", { className: "tf:shrink-0", children: _jsx(SurfaceBoundary, { surface: "composer", children: _jsx(Composer, { surface: "companion" }) }) })] }));
+}
+export const SUGGESTION_MARKS = {
+    ask: SearchIcon,
+    review: FlagIcon,
+    write: ComposeIcon,
+    learn: BookIcon,
+};
+function _suggestionMarkOf(kind) {
+    const named = kind ?? "ask";
+    return Object.hasOwn(SUGGESTION_MARKS, named)
+        ? SUGGESTION_MARKS[named]
+        : SUGGESTION_MARKS.ask;
+}
+function SuggestionRows({ suggestions, }) {
+    const { busy, sendMessage } = useConversation();
+    return (_jsx(_Fragment, { children: suggestions.map(_asSuggestion).map((suggestion) => {
+            const Mark = _suggestionMarkOf(suggestion.kind);
+            return (_jsxs(TfButton, { variant: "prompt", disabled: busy, onClick: () => {
+                    void sendMessage(suggestion.prompt);
+                }, children: [_jsx("span", { "data-tf-prompt-mark": "", className: "tf:flex tf:shrink-0", children: _jsx(Mark, {}) }), _jsx("span", { className: "tf:min-w-0 tf:flex-1 tf:line-clamp-2", children: suggestion.prompt }), _jsx("span", { "data-tf-prompt-go": "", className: "tf:flex tf:shrink-0 tf:text-tf-muted-foreground", children: _jsx(ArrowRightIcon, {}) })] }, suggestion.prompt));
+        }) }));
+}

package/dist/components/copy-text-button.d.ts

@@ -0,0 +1,5 @@
+export declare function CopyTextButton({ text, label, className, }: {
+    text: string;
+    label: string;
+    className?: string;
+}): import("react").JSX.Element;

package/dist/components/copy-text-button.js

@@ -0,0 +1,33 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { CheckIcon, CopyIcon } from "lucide-react";
+import { useEffect, useRef, useState } from "react";
+import { TfButton } from "./primitives/button.js";
+const COPIED_FLASH_MS = 2000;
+export function CopyTextButton({ text, label, className, }) {
+    const [copied, setCopied] = useState(false);
+    const flash = useRef(null);
+    useEffect(() => () => {
+        if (flash.current !== null) {
+            clearTimeout(flash.current);
+        }
+    }, []);
+    const copy = async () => {
+        try {
+            await navigator.clipboard.writeText(text);
+        }
+        catch {
+            return;
+        }
+        setCopied(true);
+        if (flash.current !== null) {
+            clearTimeout(flash.current);
+        }
+        flash.current = setTimeout(() => {
+            setCopied(false);
+        }, COPIED_FLASH_MS);
+    };
+    return (_jsx(TfButton, { variant: "icon", className: className, "aria-label": copied ? "Copied" : label, onClick: () => {
+            void copy();
+        }, children: copied ? (_jsx(CheckIcon, { "aria-hidden": true, className: "tf:size-3.5" })) : (_jsx(CopyIcon, { "aria-hidden": true, className: "tf:size-3.5" })) }));
+}

package/dist/components/elicitation-context.d.ts

@@ -0,0 +1,14 @@
+import type { ElicitationCardModel, QuestionSetCardModel } from "../core/elicitation-cards.js";
+import { QuestionDraftStore } from "../core/question-drafts.js";
+export interface ElicitationSurface {
+    cards: readonly ElicitationCardModel[];
+    submitQuestionAnswers: (card: QuestionSetCardModel, answers: readonly {
+        id: string;
+        text: string;
+    }[]) => Promise<void>;
+    cancelQuestionSet: (card: QuestionSetCardModel) => Promise<void>;
+    drafts: QuestionDraftStore;
+}
+export declare const ElicitationsContext: import("react").Context<ElicitationSurface>;
+export declare function useElicitations(): ElicitationSurface;
+export declare function anchoredElicitationsFor(cards: readonly ElicitationCardModel[], toolCallId: string): ElicitationCardModel[];

package/dist/components/elicitation-context.js

@@ -0,0 +1,24 @@
+"use client";
+import { createContext, useContext } from "react";
+import { QuestionDraftStore } from "../core/question-drafts.js";
+const EMPTY_ELICITATION_SURFACE = {
+    cards: [],
+    submitQuestionAnswers: (card) => {
+        const error = new Error(`submitQuestionAnswers called outside an elicitation surface (interrupt ${card.interruptId}) — the answers were NOT sent.`);
+        console.error(error);
+        return Promise.reject(error);
+    },
+    cancelQuestionSet: (card) => {
+        const error = new Error(`cancelQuestionSet called outside an elicitation surface (interrupt ${card.interruptId}) — the set was NOT cancelled.`);
+        console.error(error);
+        return Promise.reject(error);
+    },
+    drafts: new QuestionDraftStore(),
+};
+export const ElicitationsContext = createContext(EMPTY_ELICITATION_SURFACE);
+export function useElicitations() {
+    return useContext(ElicitationsContext);
+}
+export function anchoredElicitationsFor(cards, toolCallId) {
+    return cards.filter((card) => card.anchored && card.toolCallId === toolCallId);
+}

package/dist/components/elicitation-receipt-row.d.ts

@@ -0,0 +1,4 @@
+import type { SettledQuestionsReceipt } from "../core/question-receipt.js";
+export declare function QuestionSetReceiptRow({ receipt, }: {
+    receipt: SettledQuestionsReceipt;
+}): import("react").JSX.Element;

package/dist/components/elicitation-receipt-row.js

@@ -0,0 +1,16 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ToolRow } from "./tool-row.js";
+export function QuestionSetReceiptRow({ receipt, }) {
+    return (_jsx(ToolRow, { view: {
+            toolName: "ask_user",
+            state: "output-available",
+            input: JSON.stringify({ questions: receipt.questions }),
+            output: JSON.stringify({ answers: receipt.answers }),
+            display: {
+                completeText: "Asked for your input",
+                icon: "question",
+                view: { key: "teaflask.questions", version: 1 },
+            },
+        } }));
+}

package/dist/components/human-file-size.d.ts

@@ -0,0 +1 @@
+export declare function humanFileSize(byteSize: number): string;

package/dist/components/human-file-size.js

@@ -0,0 +1,9 @@
+export function humanFileSize(byteSize) {
+    if (byteSize >= 1024 * 1024) {
+        return `${(byteSize / (1024 * 1024)).toFixed(1)} MB`;
+    }
+    if (byteSize >= 1024) {
+        return `${(byteSize / 1024).toFixed(1)} KB`;
+    }
+    return `${String(byteSize)} B`;
+}

package/dist/components/icons.d.ts

@@ -0,0 +1,15 @@
+export declare function ComposeIcon(): import("react").JSX.Element;
+export declare function ArrowUpIcon(): import("react").JSX.Element;
+export declare function StopIcon(): import("react").JSX.Element;
+export declare function ChevronDownIcon(): import("react").JSX.Element;
+export declare function MinimizeIcon(): import("react").JSX.Element;
+export declare function SidebarIcon(): import("react").JSX.Element;
+export declare function CheckIcon(): import("react").JSX.Element;
+export declare function CloseIcon(): import("react").JSX.Element;
+export declare function ArrowRightIcon(): import("react").JSX.Element;
+export declare function SearchIcon(): import("react").JSX.Element;
+export declare function FlagIcon(): import("react").JSX.Element;
+export declare function BookIcon(): import("react").JSX.Element;
+export declare function FileIcon(): import("react").JSX.Element;
+export declare function PlusIcon(): import("react").JSX.Element;
+export declare function OpenAiMarkIcon(): import("react").JSX.Element;

package/dist/components/icons.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function ComposeIcon() {
+    return (_jsxs("svg", { viewBox: "0 0 16 16", "aria-hidden": "true", className: "tf:size-4 tf:shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M8 2.5H4A1.5 1.5 0 0 0 2.5 4v8A1.5 1.5 0 0 0 4 13.5h8a1.5 1.5 0 0 0 1.5-1.5V8" }), _jsx("path", { d: "M12.3 2.3a1.2 1.2 0 0 1 1.7 1.7L8.5 9.5l-2.3.6.6-2.3z" })] }));
+}
+export function ArrowUpIcon() {
+    return (_jsx("svg", { viewBox: "0 0 16 16", "aria-hidden": "true", className: "tf:size-4 tf:shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "1.75", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: "M8 12.5v-9M4 7l4-3.5L12 7" }) }));
+}
+export function StopIcon() {
+    return (_jsx("svg", { viewBox: "0 0 16 16", "aria-hidden": "true", className: "tf:size-4 tf:shrink-0", fill: "currentColor", stroke: "none", children: _jsx("rect", { x: "4.25", y: "4.25", width: "7.5", height: "7.5", rx: "1.5" }) }));
+}
+export function ChevronDownIcon() {
+    return (_jsx("svg", { viewBox: "0 0 16 16", "aria-hidden": "true", className: "tf:size-4 tf:shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: "M3.5 6l4.5 4.5L12.5 6" }) }));
+}
+export function MinimizeIcon() {
+    return (_jsx("svg", { viewBox: "0 0 16 16", "aria-hidden": "true", className: "tf:size-4 tf:shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: "M3.5 8h9" }) }));
+}
+export function SidebarIcon() {
+    return (_jsxs("svg", { viewBox: "0 0 16 16", "aria-hidden": "true", className: "tf:size-4 tf:shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("rect", { x: "2.5", y: "2.5", width: "11", height: "11", rx: "1.5" }), _jsx("path", { d: "M9.5 2.5v11" })] }));
+}
+export function CheckIcon() {
+    return (_jsx("svg", { viewBox: "0 0 16 16", "aria-hidden": "true", className: "tf:size-4 tf:shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: "M3 8.5l3.2 3L13 4.5" }) }));
+}
+export function CloseIcon() {
+    return (_jsx("svg", { viewBox: "0 0 16 16", "aria-hidden": "true", className: "tf:size-4 tf:shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: "M4 4l8 8M12 4l-8 8" }) }));
+}
+export function ArrowRightIcon() {
+    return (_jsx("svg", { viewBox: "0 0 16 16", "aria-hidden": "true", className: "tf:size-4 tf:shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: "M3.5 8h9M9 4.5L12.5 8 9 11.5" }) }));
+}
+export function SearchIcon() {
+    return (_jsxs("svg", { viewBox: "0 0 16 16", "aria-hidden": "true", className: "tf:size-4 tf:shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("circle", { cx: "7.2", cy: "7.2", r: "4.2" }), _jsx("path", { d: "M10.4 10.4L13.5 13.5" })] }));
+}
+export function FlagIcon() {
+    return (_jsx("svg", { viewBox: "0 0 16 16", "aria-hidden": "true", className: "tf:size-4 tf:shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: "M3.5 14V2.5h6l-.7 2.3 3.7 0v5H6.3l.5-2.3H3.5" }) }));
+}
+export function BookIcon() {
+    return (_jsxs("svg", { viewBox: "0 0 16 16", "aria-hidden": "true", className: "tf:size-4 tf:shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M2.5 3.2A1.2 1.2 0 0 1 3.7 2H8v11.5H3.7a1.2 1.2 0 0 0-1.2 1.2z" }), _jsx("path", { d: "M13.5 3.2A1.2 1.2 0 0 0 12.3 2H8v11.5h4.3a1.2 1.2 0 0 1 1.2 1.2z" })] }));
+}
+export function FileIcon() {
+    return (_jsxs("svg", { viewBox: "0 0 16 16", "aria-hidden": "true", className: "tf:size-4 tf:shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M9 1.8H4.5A1.5 1.5 0 0 0 3 3.3v9.4a1.5 1.5 0 0 0 1.5 1.5h7a1.5 1.5 0 0 0 1.5-1.5V5.8z" }), _jsx("path", { d: "M9 1.8v4h4" })] }));
+}
+export function PlusIcon() {
+    return (_jsx("svg", { viewBox: "0 0 16 16", "aria-hidden": "true", className: "tf:size-4 tf:shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: "M8 3.2v9.6M3.2 8h9.6" }) }));
+}
+export function OpenAiMarkIcon() {
+    return (_jsx("svg", { viewBox: "0 0 24 24", "aria-hidden": "true", className: "tf:size-3.5 tf:shrink-0", fill: "currentColor", children: _jsx("path", { d: "M22.2819 9.8211a5.9847 5.9847 0 0 0-.5157-4.9108 6.0462 6.0462 0 0 0-6.5098-2.9A6.0651 6.0651 0 0 0 4.9807 4.1818a5.9847 5.9847 0 0 0-3.9977 2.9 6.0462 6.0462 0 0 0 .7427 7.0966 5.98 5.98 0 0 0 .511 4.9107 6.051 6.051 0 0 0 6.5146 2.9001A5.9847 5.9847 0 0 0 13.2599 24a6.0557 6.0557 0 0 0 5.7718-4.2058 5.9894 5.9894 0 0 0 3.9977-2.9001 6.0557 6.0557 0 0 0-.7475-7.0729zm-9.022 12.6081a4.4755 4.4755 0 0 1-2.8764-1.0408l.1419-.0804 4.7783-2.7582a.7948.7948 0 0 0 .3927-.6813v-6.7369l2.02 1.1686a.071.071 0 0 1 .038.052v5.5826a4.504 4.504 0 0 1-4.4945 4.4944zm-9.6607-4.1254a4.4708 4.4708 0 0 1-.5346-3.0137l.142.0852 4.783 2.7582a.7712.7712 0 0 0 .7806 0l5.8428-3.3685v2.3324a.0804.0804 0 0 1-.0332.0615L9.74 19.9502a4.4992 4.4992 0 0 1-6.1408-1.6464zM2.3408 7.8956a4.485 4.485 0 0 1 2.3655-1.9728V11.6a.7664.7664 0 0 0 .3879.6765l5.8144 3.3543-2.0201 1.1685a.0757.0757 0 0 1-.071 0l-4.8303-2.7865A4.504 4.504 0 0 1 2.3408 7.872zm16.5963 3.8558L13.1038 8.364 15.1192 7.2a.0757.0757 0 0 1 .071 0l4.8303 2.7913a4.4944 4.4944 0 0 1-.6765 8.1042v-5.6772a.79.79 0 0 0-.407-.667zm2.0107-3.0231l-.142-.0852-4.7735-2.7818a.7759.7759 0 0 0-.7854 0L9.409 9.2297V6.8974a.0662.0662 0 0 1 .0284-.0615l4.8303-2.7866a4.4992 4.4992 0 0 1 6.6802 4.66zM8.3065 12.863l-2.02-1.1638a.0804.0804 0 0 1-.038-.0567V6.0742a4.4992 4.4992 0 0 1 7.3757-3.4537l-.142.0805L8.704 5.459a.7948.7948 0 0 0-.3927.6813zm1.0976-2.3654l2.602-1.4998 2.6069 1.4998v2.9994l-2.5974 1.4997-2.6067-1.4997Z" }) }));
+}

package/dist/components/lazy-body.d.ts

@@ -0,0 +1,4 @@
+import { type ReactNode } from "react";
+export declare function LazyBody({ children }: {
+    children: ReactNode;
+}): import("react").JSX.Element;

package/dist/components/lazy-body.js

@@ -0,0 +1,30 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Component, Suspense } from "react";
+import { TfButton } from "./primitives/button.js";
+import { useAssistantSession } from "./teaflask-assistant-provider.js";
+export function LazyBody({ children }) {
+    const { reportError } = useAssistantSession();
+    return (_jsx(LazyBodyBoundary, { onFailure: reportError, children: _jsx(Suspense, { fallback: _jsx(BodyNotice, { children: "Loading\u2026" }), children: children }) }));
+}
+function BodyNotice({ children }) {
+    return (_jsx("div", { className: "tf:flex tf:flex-1 tf:flex-col tf:items-center tf:justify-center tf:gap-3 tf:p-6 tf:text-center tf:text-tf-label tf:text-tf-muted-foreground", children: children }));
+}
+class LazyBodyBoundary extends Component {
+    state = { failed: false };
+    static getDerivedStateFromError() {
+        return { failed: true };
+    }
+    componentDidCatch(error, info) {
+        this.props.onFailure(error);
+        console.error("[teaflask-assistant] A surface failed to load.", error, info.componentStack);
+    }
+    render() {
+        if (!this.state.failed) {
+            return this.props.children;
+        }
+        return (_jsxs(BodyNotice, { children: [_jsx("span", { children: "This part of the assistant didn\u2019t load." }), _jsx(TfButton, { variant: "ghost", onClick: () => {
+                        window.location.reload();
+                    }, children: "Reload the page" })] }));
+    }
+}

package/dist/components/markdown/assistant-markdown.d.ts

@@ -0,0 +1,3 @@
+export declare function AssistantMarkdown({ children }: {
+    children: string;
+}): import("react").JSX.Element;

package/dist/components/markdown/assistant-markdown.js

@@ -0,0 +1,12 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { CodeBlock } from "./code-block.js";
+import { preBlockFor, TranscriptLink } from "./markdown-structure.js";
+import { MarkdownBlocks } from "./memoized-blocks.js";
+const COMPONENTS = {
+    pre: preBlockFor(CodeBlock),
+    a: TranscriptLink,
+};
+export function AssistantMarkdown({ children }) {
+    return (_jsx("div", { "data-tf-markdown": "", className: "tf:min-w-0 tf:text-tf-body", children: _jsx(MarkdownBlocks, { components: COMPONENTS, children: children }) }));
+}

package/dist/components/markdown/code-block.d.ts

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

package/dist/components/markdown/code-block.js

@@ -0,0 +1,8 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CopyTextButton } from "../copy-text-button.js";
+import { useHighlightedHtml } from "./use-highlighted-html.js";
+export function CodeBlock({ code, language, }) {
+    const highlighted = useHighlightedHtml(code, language);
+    return (_jsxs("div", { className: "tf:my-3 tf:flex tf:w-full tf:flex-col tf:first:mt-0 tf:last:mb-0", children: [_jsxs("div", { className: "tf:flex tf:items-center tf:justify-between tf:rounded-t-xl tf:border tf:border-b-0 tf:bg-tf-muted tf:px-3.5 tf:py-1", children: [_jsx("span", { className: "tf:text-xs tf:font-medium tf:text-tf-muted-foreground tf:lowercase", children: language ?? "text" }), _jsx(CopyTextButton, { text: code, label: "Copy code" })] }), highlighted === null ? (_jsx("pre", { className: "tf:overflow-x-auto tf:rounded-b-xl tf:border tf:p-3.5 tf:text-tf-label tf:leading-relaxed", children: _jsx("code", { className: "tf:font-mono", children: code }) })) : (_jsx("div", { "data-tf-code-html": "", className: "tf:overflow-x-auto tf:rounded-b-xl tf:border tf:p-3.5 tf:font-mono tf:text-tf-label tf:leading-relaxed", dangerouslySetInnerHTML: { __html: highlighted } }))] }));
+}

package/dist/components/markdown/highlight.d.ts

@@ -0,0 +1 @@
+export declare function highlightToHtml(code: string, language: string): Promise<string | null>;

package/dist/components/markdown/highlight.js

@@ -0,0 +1,15 @@
+let highlighterModule = null;
+function loadHighlighter() {
+    highlighterModule ??= import("./shiki-highlighter.js").catch(() => {
+        highlighterModule = null;
+        return null;
+    });
+    return highlighterModule;
+}
+export async function highlightToHtml(code, language) {
+    const module = await loadHighlighter();
+    if (module === null) {
+        return null;
+    }
+    return module.highlightWithShiki(code, language);
+}

package/dist/components/markdown/markdown-structure.d.ts

@@ -0,0 +1,16 @@
+import { type ComponentType, type ReactNode } from "react";
+import type { Components } from "react-markdown";
+export interface CodeBlockProps {
+    code: string;
+    language: string | null;
+}
+export declare function preBlockFor(CodeBlock: ComponentType<CodeBlockProps>): Components["pre"];
+export declare function TranscriptLink({ href, children, }: {
+    href?: string;
+    children?: ReactNode;
+}): import("react").JSX.Element;
+export declare function TranscriptImage({ src, alt, title, }: {
+    src?: string;
+    alt?: string;
+    title?: string;
+}): import("react").JSX.Element;

package/dist/components/markdown/markdown-structure.js

@@ -0,0 +1,67 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { createContext, isValidElement, useContext, } from "react";
+export function preBlockFor(CodeBlock) {
+    return function PreBlock({ children }) {
+        const code = _codeElementOf(children);
+        if (code === null) {
+            return _jsx("pre", { children: children });
+        }
+        return (_jsx(CodeBlock, { code: _textOf(code.children), language: _languageOf(code) }));
+    };
+}
+const InsideLinkContext = createContext(false);
+export function TranscriptLink({ href, children, }) {
+    return (_jsx(InsideLinkContext.Provider, { value: true, children: _jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", children: children }) }));
+}
+const HTTP_URL = /^https?:\/\//i;
+const MAX_FILENAME_LABEL = 60;
+function _filenameOf(src) {
+    if (src === undefined || /^data:/i.test(src)) {
+        return "";
+    }
+    try {
+        const path = new URL(src, "https://placeholder.invalid").pathname;
+        return decodeURIComponent(path.split("/").filter(Boolean).at(-1) ?? "");
+    }
+    catch {
+        return "";
+    }
+}
+function _imageLabelOf(alt, src) {
+    const described = alt?.trim() ?? "";
+    if (described !== "") {
+        return described;
+    }
+    const filename = _filenameOf(src);
+    return filename === ""
+        ? "(no description)"
+        : filename.slice(0, MAX_FILENAME_LABEL);
+}
+export function TranscriptImage({ src, alt, title, }) {
+    const insideLink = useContext(InsideLinkContext);
+    const body = (_jsxs(_Fragment, { children: [_jsx("span", { "data-tf-markdown-image-marker": "", children: "Image:\u00a0" }), _jsx("span", { "data-tf-markdown-image-label": "", children: _imageLabelOf(alt, src) })] }));
+    if (insideLink || src === undefined || !HTTP_URL.test(src)) {
+        return (_jsx("span", { "data-tf-markdown-image": "", title: title, children: body }));
+    }
+    return (_jsx("a", { "data-tf-markdown-image": "", href: src, title: title, target: "_blank", rel: "noopener noreferrer", children: body }));
+}
+function _codeElementOf(children) {
+    if (isValidElement(children) && children.type === "code") {
+        return children.props;
+    }
+    return null;
+}
+function _textOf(children) {
+    if (typeof children === "string") {
+        return children.replace(/\n$/, "");
+    }
+    if (Array.isArray(children)) {
+        return children.map(_textOf).join("").replace(/\n$/, "");
+    }
+    return "";
+}
+function _languageOf(code) {
+    const match = /language-([\w-]+)/.exec(code.className ?? "");
+    return match === null ? null : match[1];
+}

package/dist/components/markdown/memoized-blocks.d.ts

@@ -0,0 +1,6 @@
+import { type Components } from "react-markdown";
+export interface MarkdownBlocksProps {
+    children: string;
+    components: Partial<Components>;
+}
+export declare function MarkdownBlocks({ children, components }: MarkdownBlocksProps): import("react").JSX.Element;

package/dist/components/markdown/memoized-blocks.js

@@ -0,0 +1,20 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { marked } from "marked";
+import { memo, useId, useMemo } from "react";
+import ReactMarkdown, {} from "react-markdown";
+import remarkBreaks from "remark-breaks";
+import remarkGfm from "remark-gfm";
+import { TranscriptImage } from "./markdown-structure.js";
+function parseMarkdownIntoBlocks(markdown) {
+    return marked.lexer(markdown).map((token) => token.raw);
+}
+const MemoizedBlock = memo(function MarkdownBlock({ content, components, }) {
+    return (_jsx(ReactMarkdown, { remarkPlugins: [remarkGfm, remarkBreaks], components: components, children: content }));
+}, (prev, next) => prev.content === next.content && prev.components === next.components);
+export function MarkdownBlocks({ children, components }) {
+    const blockId = useId();
+    const blocks = useMemo(() => parseMarkdownIntoBlocks(children), [children]);
+    const guarded = useMemo(() => ({ ...components, img: TranscriptImage }), [components]);
+    return (_jsx(_Fragment, { children: blocks.map((block, index) => (_jsx(MemoizedBlock, { content: block, components: guarded }, `${blockId}-${String(index)}`))) }));
+}

package/dist/components/markdown/paced-assistant-markdown.d.ts

@@ -0,0 +1,4 @@
+export declare function PacedAssistantMarkdown({ text, streaming, }: {
+    text: string;
+    streaming: boolean;
+}): import("react").JSX.Element;

package/dist/components/markdown/paced-assistant-markdown.js

@@ -0,0 +1,10 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { usePacedReveal } from "./use-paced-reveal.js";
+import { repairedStreamingMarkdown } from "./streaming-repair.js";
+import { AssistantMarkdown } from "./assistant-markdown.js";
+export function PacedAssistantMarkdown({ text, streaming, }) {
+    const { revealed, revealHostRef } = usePacedReveal(text, streaming);
+    const settled = !streaming && revealed === text;
+    return (_jsx("div", { ref: revealHostRef, className: "tf:min-w-0", children: _jsx(AssistantMarkdown, { children: settled ? text : repairedStreamingMarkdown(revealed) }) }));
+}

package/dist/components/markdown/reveal-pacer.d.ts

@@ -0,0 +1,20 @@
+export declare class RevealPacer {
+    private arrived;
+    private position;
+    private committedAt;
+    private ratePerMs;
+    private expectedGapMs;
+    private lastArrivalAt;
+    private calibrated;
+    private instant;
+    constructor(arrivedLength: number, nowMs: number);
+    observe(arrivedLength: number, nowMs: number): void;
+    beginDrain(nowMs: number): void;
+    revealInstantly(): void;
+    revealedLength(nowMs: number): number;
+    isCaughtUp(nowMs: number): boolean;
+    private _arrivalShrankBelowRevealed;
+    private _isStillInTheMountBurst;
+    private _foldGapIntoExpectation;
+    private _commitRevealedAt;
+}

package/dist/components/markdown/reveal-pacer.js

@@ -0,0 +1,85 @@
+const NOMINAL_GAP_MS = 400;
+const GAP_EWMA_ALPHA = 0.3;
+const MIN_GAP_MS = 120;
+const MAX_GAP_MS = 1500;
+const BURST_GAP_MS = 50;
+const MIN_RATE_CHARS_PER_MS = 0.08;
+const MAX_RATE_CHARS_PER_MS = 4;
+const DRAIN_MS = 200;
+export class RevealPacer {
+    arrived;
+    position;
+    committedAt;
+    ratePerMs = 0;
+    expectedGapMs = NOMINAL_GAP_MS;
+    lastArrivalAt;
+    calibrated = false;
+    instant = false;
+    constructor(arrivedLength, nowMs) {
+        this.arrived = arrivedLength;
+        this.position = arrivedLength;
+        this.committedAt = nowMs;
+        this.lastArrivalAt = nowMs;
+    }
+    observe(arrivedLength, nowMs) {
+        if (this._arrivalShrankBelowRevealed(arrivedLength, nowMs)) {
+            this.arrived = arrivedLength;
+            this.revealInstantly();
+            return;
+        }
+        this._commitRevealedAt(nowMs);
+        const gapMs = nowMs - this.lastArrivalAt;
+        this.lastArrivalAt = nowMs;
+        this.arrived = arrivedLength;
+        if (this.instant || this._isStillInTheMountBurst(gapMs)) {
+            this.position = arrivedLength;
+            return;
+        }
+        this.calibrated = true;
+        if (gapMs >= BURST_GAP_MS) {
+            this._foldGapIntoExpectation(gapMs);
+        }
+        this.ratePerMs = _clamp((this.arrived - this.position) / this.expectedGapMs, MIN_RATE_CHARS_PER_MS, MAX_RATE_CHARS_PER_MS);
+    }
+    beginDrain(nowMs) {
+        if (this.instant) {
+            return;
+        }
+        this._commitRevealedAt(nowMs);
+        const remaining = this.arrived - this.position;
+        if (remaining <= 0) {
+            return;
+        }
+        this.ratePerMs = Math.max(this.ratePerMs, remaining / DRAIN_MS);
+    }
+    revealInstantly() {
+        this.instant = true;
+        this.position = this.arrived;
+        this.ratePerMs = 0;
+    }
+    revealedLength(nowMs) {
+        const advanced = this.position + this.ratePerMs * Math.max(0, nowMs - this.committedAt);
+        return Math.min(this.arrived, Math.floor(advanced));
+    }
+    isCaughtUp(nowMs) {
+        return this.revealedLength(nowMs) >= this.arrived;
+    }
+    _arrivalShrankBelowRevealed(arrivedLength, nowMs) {
+        return arrivedLength < this.revealedLength(nowMs);
+    }
+    _isStillInTheMountBurst(gapMs) {
+        return !this.calibrated && gapMs < BURST_GAP_MS;
+    }
+    _foldGapIntoExpectation(gapMs) {
+        const taught = _clamp(gapMs, MIN_GAP_MS, MAX_GAP_MS);
+        this.expectedGapMs =
+            GAP_EWMA_ALPHA * taught + (1 - GAP_EWMA_ALPHA) * this.expectedGapMs;
+    }
+    _commitRevealedAt(nowMs) {
+        this.position = Math.min(this.arrived, this.position + this.ratePerMs * Math.max(0, nowMs - this.committedAt));
+        this.committedAt = nowMs;
+    }
+}
+function _clamp(value, min, max) {
+    return Math.min(max, Math.max(min, value));
+}

package/dist/components/markdown/shiki-highlighter.d.ts

@@ -0,0 +1 @@
+export declare function highlightWithShiki(code: string, language: string): Promise<string | null>;