@smarter.sh/ui-chat 0.3.0 → 0.7.0

package/dist/types/src/components/AppTitle/Component.d.ts

@@ -0,0 +1,13 @@
+/**
+ * The chat's title: the LLMClient's app name and version, with icons for whether it is valid, and
+ * whether it is deployed or is still in the sandbox.
+ */
+import "@/components/AppTitle/styles.css";
+interface AppTitleProps {
+    title: string;
+    isReady: boolean;
+    isValid: boolean;
+    isDeployed: boolean;
+}
+declare function AppTitle({ title, isReady, isValid, isDeployed }: AppTitleProps): import("react").JSX.Element;
+export default AppTitle;

package/dist/types/src/components/AppTitle/index.d.ts

@@ -0,0 +1,2 @@
+import AppTitle from "@/components/AppTitle/Component";
+export default AppTitle;

package/dist/types/src/components/Console/Component.d.ts

@@ -0,0 +1,17 @@
+import { type ConsoleConfig } from "@/components/Console/data";
+import "@/components/Console/styles.css";
+interface ConsoleProps {
+    /** The LLMClient's configuration, from its config api. Empty until it loads. */
+    config: ConsoleConfig;
+    /** The url of the user's server log stream. Without it, there is no "Server Logs" tab. */
+    logStreamUrl?: string | null;
+    /**
+     * The minimum log level of the server logs, e.g. "DEBUG" in sandbox mode. Without it, the server's
+     * own log level. A change reconnects the stream, which replays the history at the new level.
+     */
+    logLevel?: string | null;
+    /** Changes when a new chat session starts, which clears the server logs. */
+    resetKey?: number | string;
+}
+declare function Console({ config, logStreamUrl, logLevel, resetKey }: ConsoleProps): import("react").JSX.Element;
+export default Console;

package/dist/types/src/components/Console/ServerLogs.d.ts

@@ -0,0 +1,8 @@
+import type { LogEvent } from "@/lib/logStream";
+interface ServerLogsProps {
+    logs: LogEvent[];
+    connected: boolean;
+    error: string | null;
+}
+declare function ServerLogs(props: ServerLogsProps): import("react").JSX.Element;
+export default ServerLogs;

package/dist/types/src/components/Console/data.d.ts

@@ -0,0 +1,7 @@
+/** The data that the Console displays for each of its menu items. */
+import type { ChatConfig } from "../../types";
+import { type MenuItem } from "./enums";
+/** The LLMClient's configuration, from its config api. Empty until it loads. */
+export type ConsoleConfig = ChatConfig | Record<string, never> | null;
+/** The JSON objects to display for a menu item. */
+export declare function consoleData(config: ConsoleConfig, item: MenuItem): object[];

package/dist/types/src/components/Console/enums.d.ts

@@ -0,0 +1,9 @@
+/** The Console's menu items: the configuration, the chat session's histories, and the server logs. */
+export declare const MenuItems: {
+    readonly CHAT_CONFIG: "chat_config";
+    readonly LLMCLIENT_REQUEST_HISTORY: "llmclient_request_history";
+    readonly CHAT_TOOL_CALL_HISTORY: "chat_tool_call_history";
+    readonly CHAT_PLUGIN_USAGE_HISTORY: "chat_plugin_usage_history";
+    readonly SERVER_LOGS: "server_logs";
+};
+export type MenuItem = (typeof MenuItems)[keyof typeof MenuItems];

package/dist/types/src/components/Console/index.d.ts

@@ -0,0 +1,2 @@
+import Console from "@/components/Console/Component";
+export default Console;

package/dist/types/src/components/ErrorBoundary/Component.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Catches a rendering error in its children, and displays a message instead of an empty page.
+ */
+import { Component, type ErrorInfo, type ReactNode } from "react";
+interface ErrorBoundaryProps {
+    children: ReactNode;
+}
+interface ErrorBoundaryState {
+    error: Error | null;
+}
+declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
+    state: ErrorBoundaryState;
+    static getDerivedStateFromError(error: Error): ErrorBoundaryState;
+    componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
+    render(): string | number | bigint | boolean | import("react").JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+}
+export default ErrorBoundary;

package/dist/types/src/components/ErrorBoundary/index.d.ts

@@ -0,0 +1,2 @@
+import ErrorBoundary from "@/components/ErrorBoundary/Component";
+export default ErrorBoundary;

package/dist/types/src/components/SmarterChat/Component.d.ts

@@ -0,0 +1,26 @@
+/**
+ * SmarterChat: a chat with a Smarter LLMClient, with an optional Console beside it.
+ *
+ * It fetches the LLMClient's configuration, which includes the chat session's history, then sends
+ * the chat thread to the LLMClient's prompt api with each new message, and adds the response's
+ * messages to the thread. Failed prompts are displayed in the thread, as "smarter_error" messages.
+ * While a prompt runs, its progress (e.g. its tool calls and MCP server requests) is displayed in
+ * the thread, with a spinner beside its current step, and is replaced by the response's messages
+ * when it finishes. Code blocks in messages
+ * are syntax highlighted, and have a copy button.
+ *
+ * The user can resize the chat and the Console by dragging the separator between them, and can
+ * hide the Console, which slides out to the right. In sandbox mode, the thread also displays
+ * Smarter's system, tool and meta data messages. In production mode, it displays only the
+ * conversation, as the LLMClient's users see it. The Console's server logs follow the mode: DEBUG
+ * and above in sandbox mode, and the server's own log level in production mode. A new chat also
+ * clears the Console's server logs.
+ *
+ * This is the component that the @smarter.sh/ui-chat npm package exports, and that the Smarter web
+ * console's LLMClient prompt workbench renders. See main.tsx.
+ */
+import "@chatscope/chat-ui-kit-styles/dist/default/styles.min.css";
+import type { SmarterChatProps } from "@/types";
+import "@/components/SmarterChat/styles.css";
+declare function SmarterChat({ apiUrl, apiKey, toggleMetadata, csrfCookieName, csrftoken, debugCookieName, debugCookieExpiration, debugMode, sessionCookieName, sessionCookieExpiration, showConsole, cookieDomain, smarterRequestId, logStreamUrl, streamProgress, }: SmarterChatProps): import("react").JSX.Element;
+export default SmarterChat;

package/dist/types/src/components/SmarterChat/icons.d.ts

@@ -0,0 +1,17 @@
+/**
+ * The chat toolbar's icons, from Bootstrap Icons (MIT license, https://icons.getbootstrap.com),
+ * inline so that the package needs neither its font nor its css.
+ */
+/** A blank sheet of paper: a new chat. (bi-file-earmark) */
+export declare function NewChatIcon(): import("react").JSX.Element;
+/**
+ * A window with a panel on its right, as the Console is: filled while the Console is visible
+ * (bi-layout-sidebar-inset-reverse), and empty while it is hidden (bi-layout-sidebar-reverse).
+ */
+export declare function ConsoleIcon({ visible }: {
+    visible: boolean;
+}): import("react").JSX.Element;
+/** Tools: sandbox mode, which displays Smarter's system, tool and meta data messages. (bi-tools) */
+export declare function SandboxIcon(): import("react").JSX.Element;
+/** A shield: production mode, which displays the conversation only, as its users see it. (bi-shield-check) */
+export declare function ProductionIcon(): import("react").JSX.Element;

package/dist/types/src/components/SmarterChat/index.d.ts

@@ -0,0 +1,2 @@
+import SmarterChat from "@/components/SmarterChat/Component";
+export default SmarterChat;

package/dist/types/src/const.d.ts

@@ -0,0 +1,5 @@
+export declare const projectName: string;
+export declare const projectVersion: string;
+export declare const loggerPrefix: string;
+/** The default lifetime of the chat session and debug cookies: one day, in milliseconds. */
+export declare const DEFAULT_COOKIE_EXPIRATION: number;

package/dist/types/src/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @smarter.sh/ui-chat: the public api of the npm package. See vite.config.ts (--mode lib).
+ *
+ * The Smarter web console builds this package as an app instead. See main.tsx.
+ */
+export { default as SmarterChat } from "./components/SmarterChat";
+export { default as Console } from "./components/Console";
+export { MenuItems } from "./components/Console/enums";
+export { MessageDirectionEnum, SenderRoleEnum, ValidMessageRolesEnum } from "./lib/enums";
+export { projectVersion as version } from "./const";
+export type { PromptProgressEvent } from "./lib/api";
+export type { ApiMessage, ChatConfig, ChatHistory, ChatMessage, ChatMetaData, ChatbotConfig, SmarterChatProps, } from "./types";

package/dist/types/src/lib/ansi.d.ts

@@ -0,0 +1,33 @@
+/**
+ * ANSI escape codes, as the server's log records have them, e.g. "\x1b[1;34m...\x1b[0m".
+ *
+ * The text of a log record is split into segments, each with the color and the emphasis that its
+ * SGR (Select Graphic Rendition) codes give it, so that the Console displays the records as the
+ * Smarter web console's log viewer (smarter-terminal-emulator, an xterm.js terminal) does. Other
+ * escape sequences, e.g. cursor movements, are removed.
+ */
+import type { CSSProperties } from "react";
+/** The xterm.js theme of smarter-terminal-emulator, by ANSI color number: 0-7, then bright 8-15. */
+export declare const ANSI_PALETTE: string[];
+/** The text style that SGR codes set. */
+export interface AnsiStyle {
+    color?: string;
+    backgroundColor?: string;
+    bold?: boolean;
+    dim?: boolean;
+    italic?: boolean;
+    underline?: boolean;
+}
+/** A run of text, with its style. */
+export interface AnsiSegment {
+    text: string;
+    style: AnsiStyle;
+}
+/** The style after the given SGR codes. An empty list of codes is a reset. */
+export declare function applySgr(style: AnsiStyle, codes: number[]): AnsiStyle;
+/** The text's segments, each with its style, without the escape sequences. */
+export declare function parseAnsi(text: string): AnsiSegment[];
+/** The text without its escape sequences. */
+export declare function stripAnsi(text: string): string;
+/** The css of a style. */
+export declare function ansiCss(style: AnsiStyle): CSSProperties;

package/dist/types/src/lib/api.d.ts

@@ -0,0 +1,73 @@
+/**
+ * The Smarter api calls of Smarter Chat: the LLMClient's configuration, and its prompts.
+ *
+ * Both are POSTs, with Django's CSRF token, and with the browser's cookies, so that the Smarter web
+ * console's session authenticates them. Each response wraps its payload in "data". See:
+ *
+ * - smarter.apps.prompt.views.detailviews.prompt_config_view.PromptConfigView: <apiUrl>config/
+ * - smarter.apps.llmclient.api.v1.views.base: the LLMClient's prompt api, chatbot.url_chatbot. Its
+ *   payload is an AWS Lambda style response, whose body is a JSON string of the completion, with
+ *   Smarter's own messages in body.smarter.messages. A failed prompt has the LLM provider's status,
+ *   and its body is {error: {status, message}, response: <the completion>}, whose messages include a
+ *   "smarter_error" message.
+ *
+ * A prompt can stream its progress, e.g. its tool calls and MCP server requests, as Server-Sent
+ * Events: the request accepts text/event-stream, and the response is "progress" events, then a
+ * "result" event with the same JSON as a non-streaming response. Servers that don't stream answer
+ * with JSON, as before. See smarter.apps.prompt.progress.
+ */
+import type { ApiMessage, ChatConfig, ChatCookies, ClientContext } from "../types";
+export declare class SmarterApiError extends Error {
+    status: number;
+    constructor(message: string, status: number);
+}
+/** The result of a prompt: the messages to add to the thread, and the error, if it failed. */
+export interface PromptResult {
+    messages: ApiMessage[];
+    error: string | null;
+}
+/** A step of a prompt that is still running, e.g. a tool call. */
+export interface PromptProgressEvent {
+    /** e.g. llm_request, tool_requested, tool_responded, plugin_called, mcp_tool_called */
+    type: string;
+    /** A short, human-readable description of the step. */
+    message: string;
+    [key: string]: unknown;
+}
+/** The http status of a response, as errorMessage() reads it. */
+type ResponseStatus = Pick<Response, "status" | "statusText">;
+/** The url of an api endpoint, relative to apiUrl, with the chat session's key. */
+export declare function urlFactory(apiUrl: string, endpoint: string | null, sessionKey: string | null): string;
+/**
+ * The request headers. Any custom header must also be in Django's CORS_ALLOW_HEADERS, in
+ * smarter.settings.base, for pages on other domains.
+ */
+export declare function requestHeadersFactory(cookies: ChatCookies, context: ClientContext): Record<string, string>;
+/** The error message of an api error response, whatever its shape. */
+export declare function errorMessage(json: Record<string, unknown>, response: ResponseStatus): string;
+/**
+ * The LLMClient's configuration. A new chat session's key, and the debug mode, are saved in their
+ * cookies, for the next page load.
+ */
+export declare function fetchConfig(apiUrl: string, cookies: ChatCookies, context: ClientContext): Promise<ChatConfig>;
+/**
+ * Reads a Server-Sent Events stream, and calls onEvent with each event's name and data. Comments
+ * (e.g. keepalives) and retry hints are ignored.
+ */
+export declare function readEventStream(body: ReadableStream<Uint8Array>, onEvent: (event: string, data: string) => void): Promise<void>;
+/**
+ * A "smarter" message that explains a completion that the LLM stopped because it reached the
+ * LLMClient's max tokens, i.e. whose finish_reason is "length", or null. A reasoning model can
+ * spend all of its tokens reasoning, and then return an empty response, which is otherwise
+ * displayed as nothing at all.
+ */
+export declare function maxTokensMessage(completion: Record<string, unknown> | null | undefined): ApiMessage | null;
+/**
+ * Sends the thread to the LLMClient's prompt api. Resolves to the messages to add to the thread.
+ * A failed prompt resolves too, with its error, and with a "smarter_error" message to display.
+ *
+ * With onProgress, the prompt's progress is requested as Server-Sent Events, and each step is
+ * passed to onProgress while the prompt runs.
+ */
+export declare function fetchPrompt(config: ChatConfig, messages: ApiMessage[], cookies: ChatCookies, context: ClientContext, onProgress?: (event: PromptProgressEvent) => void): Promise<PromptResult>;
+export {};

package/dist/types/src/lib/code.d.ts

@@ -0,0 +1,32 @@
+export declare const CODE_BLOCK_CLASS = "smarter-chat-code";
+export declare const COPY_BUTTON_CLASS = "smarter-chat-code-copy";
+export declare const MERMAID_BLOCK_CLASS = "smarter-chat-mermaid";
+/**
+ * The language of a code block, from its fence's info string, e.g. "python" from
+ * "```python title=asgi.py", or "" when it has none.
+ */
+export declare function codeLanguage(info: string | undefined): string;
+/**
+ * A code block's text, without a closing fence that is at the end of its last line rather than on
+ * a line of its own, e.g. "  )```", which LLMs sometimes write. Markdown does not close the block
+ * there, so the block ends with the message, and the fence would otherwise be displayed as code.
+ */
+export declare function stripTrailingFence(text: string): string;
+/**
+ * Html for a code block's code: highlighted if its language is one that highlight.js knows, by
+ * name or alias (e.g. "py", "js", "sh", "yml"), and otherwise escaped, as GitHub does.
+ */
+export declare function highlightCode(text: string, language: string): string;
+/**
+ * Html for a fenced or indented code block: a header with its language and a copy button, and its
+ * highlighted code. A mermaid block is also marked, so that it can be displayed as a diagram. See
+ * mermaid.ts.
+ */
+export declare function codeBlockHtml(text: string, info?: string): string;
+/**
+ * Copies a code block's code to the clipboard when its copy button is clicked, and shows that it
+ * did on the button for a moment. Clicks on anything else are ignored.
+ *
+ * :returns: whether the click was on a copy button.
+ */
+export declare function copyCodeBlock(target: EventTarget | null): boolean;

package/dist/types/src/lib/cookie.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Cookie management for Smarter Chat: the Django CSRF cookie, which it reads, and the chat
+ * session and debug cookies, which it sets for the page's path, so that each LLMClient's
+ * workbench has its own chat session.
+ */
+import type { CookieMeta } from "../types";
+/**
+ * Whether the page's hostname is in a cookie's domain. Django's cookie domain settings may
+ * include a port (localhost:9357) or a leading dot (.smarter.sh), and may be empty or "None",
+ * which means the page's own domain.
+ */
+export declare function inCookieDomain(hostname: string, domain: string | null | undefined): boolean;
+/** The cookie's value: its preset value, else the browser's cookie, else defaultValue. */
+export declare function getCookie(cookie: CookieMeta, defaultValue?: string | null): string | null;
+/** Sets the cookie for the page's path, or deletes it when value is empty. */
+export declare function setCookie(cookie: CookieMeta, value: string | boolean | null | undefined): void;
+export declare function cookieMetaFactory(name: string, expiration: number | null, domain: string | undefined, value?: string | null): CookieMeta;

package/dist/types/src/lib/enums.d.ts

@@ -0,0 +1,26 @@
+/**
+ * The direction and the sender of a chat message.
+ *
+ * The roles are those of the OpenAI chat completion api, plus Smarter's own: "smarter" messages
+ * describe what the Smarter backend did, e.g. which plugins it selected, and "smarter_error"
+ * messages describe a failed prompt. See OpenAIMessageKeys in
+ * smarter.apps.provider.services.text_completion.const.
+ */
+export declare const MessageDirectionEnum: {
+    readonly INCOMING: "incoming";
+    readonly OUTGOING: "outgoing";
+};
+export type MessageDirection = (typeof MessageDirectionEnum)[keyof typeof MessageDirectionEnum];
+export declare const SenderRoleEnum: {
+    readonly SYSTEM: "system";
+    readonly ASSISTANT: "assistant";
+    readonly USER: "user";
+    readonly TOOL: "tool";
+    readonly SMARTER: "smarter";
+    readonly SMARTER_ERROR: "smarter_error";
+};
+export type SenderRole = (typeof SenderRoleEnum)[keyof typeof SenderRoleEnum];
+/** The roles that the LLM provider accepts. Smarter's own messages are only displayed. */
+export declare const ValidMessageRolesEnum: SenderRole[];
+/** The roles of the backend's messages, which the metadata toggle shows and hides. */
+export declare const MetadataRolesEnum: SenderRole[];

package/dist/types/src/lib/layout.d.ts

@@ -0,0 +1,42 @@
+/**
+ * The layout of the chat and the Console: the width of the chat, which the user changes by dragging
+ * the separator between them, whether the Console is visible, and whether its server logs' long
+ * lines wrap. They are remembered in the browser's localStorage, which may be unavailable, e.g. in a private window, so they have defaults.
+ */
+import { type KeyboardEvent, type PointerEvent, type RefObject, type SetStateAction } from "react";
+/** The chat's width, as a percentage of the component's width. */
+export declare const DEFAULT_CHAT_WIDTH = 33.33;
+export declare const MIN_CHAT_WIDTH = 20;
+export declare const MAX_CHAT_WIDTH = 80;
+/** The change in the chat's width, in percent, for each arrow key press on the separator. */
+export declare const KEYBOARD_STEP = 5;
+export declare const CHAT_WIDTH_STORAGE_KEY = "smarter-chat.chat-width";
+export declare const CONSOLE_VISIBLE_STORAGE_KEY = "smarter-chat.console-visible";
+export declare const LOG_WRAP_STORAGE_KEY = "smarter-chat.log-wrap";
+export declare function clampChatWidth(width: number): number;
+/** Whether the Console is visible. It is, until the user hides it. */
+export declare function useConsoleVisible(): readonly [boolean, (action: SetStateAction<boolean>) => void];
+/** Whether the server logs' long lines wrap. They don't, until the user wraps them: they scroll. */
+export declare function useLogWrap(): readonly [boolean, (action: SetStateAction<boolean>) => void];
+/**
+ * The chat's width, and the props of the separator that resizes it. The separator is a focusable
+ * "separator", whose value is the chat's width: drag it, or use the arrow, Home and End keys.
+ * Double-click it to restore the default width.
+ */
+export declare function useChatWidth(containerRef: RefObject<HTMLElement | null>): {
+    chatWidth: number;
+    separatorProps: {
+        role: string;
+        tabIndex: number;
+        "aria-orientation": "vertical";
+        "aria-label": string;
+        "aria-valuenow": number;
+        "aria-valuemin": number;
+        "aria-valuemax": number;
+        onPointerDown: (event: PointerEvent<HTMLElement>) => void;
+        onPointerMove: (event: PointerEvent<HTMLElement>) => void;
+        onPointerUp: (event: PointerEvent<HTMLElement>) => void;
+        onDoubleClick: () => void;
+        onKeyDown: (event: KeyboardEvent<HTMLElement>) => void;
+    };
+};

package/dist/types/src/lib/logStream.d.ts

@@ -0,0 +1,30 @@
+/** A log record. Records that aren't JSON are displayed as their message. */
+export interface LogEvent {
+    message: string;
+    level?: string;
+    levelname?: string;
+    timestamp?: number | string;
+    logger?: string;
+    [key: string]: unknown;
+}
+/** The most records to keep. Older records are dropped. */
+export declare const MAX_LOG_EVENTS = 2000;
+/** The log level of the stream in sandbox mode. Production mode uses the server's log level. */
+export declare const SANDBOX_LOG_LEVEL = "DEBUG";
+/**
+ * The log stream's url, for the records at or above the given log level, e.g. "DEBUG". Without a
+ * level, the url is unchanged, and the stream sends the records at or above the server's log level.
+ */
+export declare function logStreamUrlForLevel(streamUrl: string | null, level?: string | null): string | null;
+/**
+ * The log stream's records, and its connection state. Connects only while streamUrl is set.
+ *
+ * clear() removes the records, e.g. for a new chat session. The records that were logged before
+ * then are not displayed again, even when a reconnection replays the history.
+ */
+export declare function useLogStream(streamUrl: string | null): {
+    logs: LogEvent[];
+    connected: boolean;
+    error: string | null;
+    clear: () => void;
+};

package/dist/types/src/lib/math.d.ts

@@ -0,0 +1,18 @@
+import "katex/dist/katex.min.css";
+import type { MarkedExtension } from "marked";
+import "./math.css";
+/**
+ * Html for a LaTeX expression, inline or displayed, or for its source if it is not valid LaTeX. A
+ * dollar sign, which is not valid in math, e.g. a price in \($1.20\), is a dollar sign.
+ */
+export declare function mathHtml(tex: string, displayMode: boolean): string;
+/**
+ * The marked extension that tokenizes and renders math. See convertMarkdownToHTML in messages.ts.
+ *
+ * A display equation that follows a line of text, without a blank line between them, would be read
+ * as part of that paragraph, and a line of its own that is "=" or "-", e.g. between the two sides of
+ * an equation, would make the paragraph a setext heading, which splits the equation. So a setext
+ * heading that contains a display equation is not a heading: the paragraph then ends where the
+ * equation begins, and blockMath tokenizes it.
+ */
+export declare const mathExtension: MarkedExtension;

package/dist/types/src/lib/mermaid.d.ts

@@ -0,0 +1,27 @@
+import "./mermaid.css";
+export declare const DIAGRAM_CLASS = "smarter-chat-mermaid-diagram";
+export declare const TOGGLE_BUTTON_CLASS = "smarter-chat-mermaid-toggle";
+/** A diagram's svg, without anything that could run a script, but with its own styles. */
+export declare function sanitizeSvg(svg: string): string;
+/**
+ * A diagram's source, with the ">" of its quoted labels written as mermaid's "#gt;". With svg text
+ * labels, mermaid drops ">" from quoted flowchart labels, e.g. "a >= b > 0" is drawn as "a = b 0".
+ * Other diagrams display "#gt;" as ">" too.
+ */
+export declare function escapeQuotedLabels(source: string): string;
+/** A diagram's sanitized svg, rendered once for each source, or null if it can't be rendered. */
+export declare function diagramSvg(source: string): Promise<string | null>;
+/**
+ * Displays the mermaid code blocks within root as their diagrams. Blocks that are already
+ * displayed, or are being rendered, are left as they are. A block that leaves the page while its
+ * diagram renders, e.g. because its message was displayed again, is skipped: its new block finds
+ * the diagram in the cache.
+ */
+export declare function renderMermaidDiagrams(root: ParentNode | null | undefined): Promise<void>;
+/**
+ * Shows a diagram's code instead of the diagram, or the diagram again, when its button is clicked.
+ * Clicks on anything else are ignored.
+ *
+ * :returns: whether the click was on a diagram's button.
+ */
+export declare function toggleMermaidDiagram(target: EventTarget | null): boolean;

package/dist/types/src/lib/messages.d.ts

@@ -0,0 +1,52 @@
+import type { ApiMessage, ChatMessage } from "../types";
+import { type MessageDirection } from "./enums";
+export declare function escapeHtml(text: string): string;
+/**
+ * Html for a message's text: escaped, with markdown images and links as html.
+ *
+ * - ``![alt](url)`` is an image, which opens at full size in a new tab, unless it's a data url,
+ *   which browsers don't open.
+ * - ``[![alt](url)](href)`` is an image that links to href.
+ * - ``[text](href)`` is a link, which opens in a new tab.
+ *
+ * Urls are http(s) or relative to the page. Images may also be base64 png, jpeg, gif or webp data
+ * urls. Anything else, e.g. a javascript: url, stays as text.
+ */
+export declare function convertMarkdownLinksToHTML(text: string): string;
+/**
+ * Html for a markdown message, e.g. an LLM's response: GitHub flavored markdown, i.e. headings,
+ * emphasis, lists, tables, block quotes, code, links and images, and math. Line breaks are kept. Code
+ * blocks are syntax highlighted, as GitHub's are. See code.ts. Math, in LaTeX, is typeset by KaTeX.
+ * See math.ts.
+ *
+ * Raw html is displayed as text, and links and images follow the rules of
+ * convertMarkdownLinksToHTML. A message that is a single paragraph is not wrapped in one,
+ * so that its chat bubble stays as compact as the text.
+ */
+export declare function convertMarkdownToHTML(text: string): string;
+/** The direction of a message from the given sender. */
+export declare function directionOf(sender: string): MessageDirection;
+/** Html for a message's text: the user's as they typed it, and the others as markdown. */
+export declare function messageHtml(content: string, sender: string): string;
+/**
+ * A new chat message. Messages without text, e.g. an assistant's tool calls, stay in the thread,
+ * so that they are sent back to the api, but are not displayed.
+ */
+export declare function messageFactory(content: string | null | undefined, sender: string, originalMessage?: ApiMessage, direction?: MessageDirection): ChatMessage;
+/** The thread of a chat session, from the messages that the backend saved. */
+export declare function chatRestoreFromBackend(chatHistory: ApiMessage[] | null | undefined): ChatMessage[];
+/** Example prompts, which help the user to get started, as a markdown list. */
+export declare function examplePrompts(prompts: string[] | null | undefined): string;
+/** The thread of a new chat session: the system role, the welcome message, and example prompts. */
+export declare function chatIntro(welcomeMessage: string, systemRole: string, prompts: string[] | null | undefined): ChatMessage[];
+/** The thread of a chat session: its saved history, or the introduction to a new one. */
+export declare function chatInit(welcomeMessage: string, systemRole: string, prompts: string[] | null | undefined, chatHistory: ApiMessage[] | null | undefined): ChatMessage[];
+/**
+ * The thread as the api's messages: those the LLM accepts, without Smarter's own. The api's
+ * original messages keep their other fields, e.g. an assistant's tool_calls.
+ */
+export declare function chatMessages2RequestMessages(messages: ChatMessage[]): ApiMessage[];
+/** Shows or hides the backend's messages (smarter, system and tool), and always shows the rest. */
+export declare function toggleMetadataMessages(messages: ChatMessage[], show: boolean, metadataRoles: string[]): ChatMessage[];
+/** Removes html tags, which pasting text into the message input tends to add. */
+export declare function sanitizeInput(text: string): string;