@jupyter/chat 0.10.1 → 0.12.0

package/lib/components/chat-messages.d.ts

@@ -3,6 +3,7 @@ import { PromiseDelegate } from '@lumino/coreutils';
 import React from 'react';
 import { IInputToolbarRegistry } from './input';
 import { IChatCommandRegistry } from '../chat-commands';
+import { IMessageFooterRegistry } from '../footers';
 import { IChatModel } from '../model';
 import { IChatMessage, IUser } from '../types';
 /**
@@ -25,6 +26,14 @@ type BaseMessageProps = {
      * The input toolbar registry.
      */
     inputToolbarRegistry: IInputToolbarRegistry;
+    /**
+     * The footer registry.
+     */
+    messageFooterRegistry?: IMessageFooterRegistry;
+    /**
+     * The welcome message.
+     */
+    welcomeMessage?: string;
 };
 /**
  * The messages list component.

package/lib/components/chat-messages.js

@@ -10,7 +10,9 @@ import clsx from 'clsx';
 import React, { useEffect, useState, useRef, forwardRef } from 'react';
 import { AttachmentPreviewList } from './attachments';
 import { ChatInput } from './chat-input';
-import { MarkdownRenderer } from './markdown-renderer';
+import { MessageFooter } from './messages/footer';
+import { MessageRenderer } from './messages/message-renderer';
+import { WelcomeMessage } from './messages/welcome';
 import { ScrollContainer } from './scroll-container';
 import { InputModel } from '../input-model';
 import { replaceSpanToMention } from '../utils';
@@ -61,7 +63,7 @@ export function ChatMessages(props) {
             setMessages([...model.messages]);
         }
         function handleWritersChange(_, writers) {
-            setCurrentWriters(writers);
+            setCurrentWriters(writers.map(writer => writer.user));
         }
         model.messagesUpdated.connect(handleChatEvents);
         (_a = model.writersChanged) === null || _a === void 0 ? void 0 : _a.connect(handleWritersChange);
@@ -132,13 +134,15 @@ export function ChatMessages(props) {
     }, [messages, allRendered]);
     return (React.createElement(React.Fragment, null,
         React.createElement(ScrollContainer, { sx: { flexGrow: 1 } },
+            props.welcomeMessage && (React.createElement(WelcomeMessage, { rmRegistry: props.rmRegistry, content: props.welcomeMessage })),
             React.createElement(Box, { ref: refMsgBox, className: clsx(MESSAGES_BOX_CLASS) }, messages.map((message, i) => {
                 renderedPromise.current[i] = new PromiseDelegate();
                 return (
                 // extra div needed to ensure each bubble is on a new line
                 React.createElement(Box, { key: i, className: clsx(MESSAGE_CLASS, message.stacked ? MESSAGE_STACKED_CLASS : '') },
                     React.createElement(ChatMessageHeader, { message: message }),
-                    React.createElement(ChatMessage, { ...props, message: message, index: i, renderedPromise: renderedPromise.current[i], ref: el => (listRef.current[i] = el) })));
+                    React.createElement(ChatMessage, { ...props, message: message, index: i, renderedPromise: renderedPromise.current[i], ref: el => (listRef.current[i] = el) }),
+                    props.messageFooterRegistry && (React.createElement(MessageFooter, { registry: props.messageFooterRegistry, message: message, model: model }))));
             })),
             React.createElement(Writers, { writers: currentWriters })),
         React.createElement(Navigation, { ...props, refMsgBox: refMsgBox, allRendered: allRendered })));
@@ -228,15 +232,19 @@ export const ChatMessage = forwardRef((props, ref) => {
     const [deleted, setDeleted] = useState(false);
     const [canEdit, setCanEdit] = useState(false);
     const [canDelete, setCanDelete] = useState(false);
-    const [inputModel, setInputModel] = useState(null);
     // Look if the message can be deleted or edited.
     useEffect(() => {
         var _a;
+        // Init canDelete and canEdit state.
         setDeleted((_a = message.deleted) !== null && _a !== void 0 ? _a : false);
         if (model.user !== undefined && !message.deleted) {
             if (model.user.username === message.sender.username) {
                 setCanEdit(model.updateMessage !== undefined);
                 setCanDelete(model.deleteMessage !== undefined);
+                return;
+            }
+            if (message.sender.bot) {
+                setCanDelete(model.deleteMessage !== undefined);
             }
         }
         else {
@@ -245,40 +253,41 @@ export const ChatMessage = forwardRef((props, ref) => {
         }
     }, [model, message]);
     // Create an input model only if the message is edited.
-    useEffect(() => {
-        if (edit && canEdit) {
-            setInputModel(() => {
-                var _a;
-                let body = message.body;
-                (_a = message.mentions) === null || _a === void 0 ? void 0 : _a.forEach(user => {
-                    body = replaceSpanToMention(body, user);
-                });
-                return new InputModel({
-                    chatContext: model.createChatContext(),
-                    onSend: (input, model) => updateMessage(message.id, input, model),
-                    onCancel: () => cancelEdition(),
-                    value: body,
-                    activeCellManager: model.activeCellManager,
-                    selectionWatcher: model.selectionWatcher,
-                    documentManager: model.documentManager,
-                    config: {
-                        sendWithShiftEnter: model.config.sendWithShiftEnter
-                    },
-                    attachments: message.attachments,
-                    mentions: message.mentions
-                });
-            });
-        }
-        else {
-            setInputModel(null);
+    const startEdition = () => {
+        var _a;
+        if (!canEdit) {
+            return;
         }
-    }, [edit]);
+        let body = message.body;
+        (_a = message.mentions) === null || _a === void 0 ? void 0 : _a.forEach(user => {
+            body = replaceSpanToMention(body, user);
+        });
+        const inputModel = new InputModel({
+            chatContext: model.createChatContext(),
+            onSend: (input, model) => updateMessage(message.id, input, model),
+            onCancel: () => cancelEdition(),
+            value: body,
+            activeCellManager: model.activeCellManager,
+            selectionWatcher: model.selectionWatcher,
+            documentManager: model.documentManager,
+            config: {
+                sendWithShiftEnter: model.config.sendWithShiftEnter
+            },
+            attachments: message.attachments,
+            mentions: message.mentions
+        });
+        model.addEditionModel(message.id, inputModel);
+        setEdit(true);
+    };
     // Cancel the current edition of the message.
     const cancelEdition = () => {
+        var _a;
+        (_a = model.getEditionModel(message.id)) === null || _a === void 0 ? void 0 : _a.dispose();
         setEdit(false);
     };
     // Update the content of the message.
     const updateMessage = (id, input, inputModel) => {
+        var _a;
         if (!canEdit || !inputModel) {
             return;
         }
@@ -288,6 +297,7 @@ export const ChatMessage = forwardRef((props, ref) => {
         updatedMessage.attachments = inputModel.attachments;
         updatedMessage.mentions = inputModel.mentions;
         model.updateMessage(id, updatedMessage);
+        (_a = model.getEditionModel(message.id)) === null || _a === void 0 ? void 0 : _a.dispose();
         setEdit(false);
     };
     // Delete the message.
@@ -299,7 +309,7 @@ export const ChatMessage = forwardRef((props, ref) => {
     };
     // Empty if the message has been deleted.
     return deleted ? (React.createElement("div", { ref: ref, "data-index": props.index })) : (React.createElement("div", { ref: ref, "data-index": props.index },
-        edit && canEdit && inputModel ? (React.createElement(ChatInput, { onCancel: () => cancelEdition(), model: inputModel, chatCommandRegistry: props.chatCommandRegistry, toolbarRegistry: props.inputToolbarRegistry })) : (React.createElement(MarkdownRenderer, { rmRegistry: rmRegistry, markdownStr: message.body, model: model, edit: canEdit ? () => setEdit(true) : undefined, delete: canDelete ? () => deleteMessage(message.id) : undefined, rendered: props.renderedPromise })),
+        edit && canEdit && model.getEditionModel(message.id) ? (React.createElement(ChatInput, { onCancel: () => cancelEdition(), model: model.getEditionModel(message.id), chatCommandRegistry: props.chatCommandRegistry, toolbarRegistry: props.inputToolbarRegistry })) : (React.createElement(MessageRenderer, { rmRegistry: rmRegistry, markdownStr: message.body, model: model, edit: canEdit ? startEdition : undefined, delete: canDelete ? () => deleteMessage(message.id) : undefined, rendered: props.renderedPromise })),
         message.attachments && !edit && (
         // Display the attachments only if message is not edited, otherwise the
         // input component display them.
@@ -391,7 +401,8 @@ export function Navigation(props) {
     useEffect(() => {
         var _a, _b;
         const viewportChanged = (model, viewport) => {
-            setLastInViewport(viewport.includes(model.messages.length - 1));
+            setLastInViewport(model.messages.length === 0 ||
+                viewport.includes(model.messages.length - 1));
         };
         (_a = model.viewportChanged) === null || _a === void 0 ? void 0 : _a.connect(viewportChanged);
         viewportChanged(model, (_b = model.messagesInViewport) !== null && _b !== void 0 ? _b : []);

package/lib/components/chat.d.ts

@@ -3,6 +3,7 @@ import { IThemeManager } from '@jupyterlab/apputils';
 import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
 import { IChatCommandRegistry } from '../chat-commands';
 import { IInputToolbarRegistry } from './input';
+import { IMessageFooterRegistry } from '../footers';
 import { IChatModel } from '../model';
 import { IAttachmentOpenerRegistry } from '../registry';
 export declare function ChatBody(props: Chat.IChatBodyProps): JSX.Element;
@@ -35,6 +36,14 @@ export declare namespace Chat {
          * The input toolbar registry
          */
         inputToolbarRegistry?: IInputToolbarRegistry;
+        /**
+         * The footer registry.
+         */
+        messageFooterRegistry?: IMessageFooterRegistry;
+        /**
+         * The welcome message.
+         */
+        welcomeMessage?: string;
     }
     /**
      * The options to build the Chat UI.

package/lib/components/chat.js

@@ -19,7 +19,7 @@ export function ChatBody(props) {
         inputToolbarRegistry = InputToolbarRegistry.defaultToolbarRegistry();
     }
     return (React.createElement(AttachmentOpenerContext.Provider, { value: props.attachmentOpenerRegistry },
-        React.createElement(ChatMessages, { rmRegistry: props.rmRegistry, model: model, chatCommandRegistry: props.chatCommandRegistry, inputToolbarRegistry: inputToolbarRegistry }),
+        React.createElement(ChatMessages, { rmRegistry: props.rmRegistry, model: model, chatCommandRegistry: props.chatCommandRegistry, inputToolbarRegistry: inputToolbarRegistry, messageFooterRegistry: props.messageFooterRegistry, welcomeMessage: props.welcomeMessage }),
         React.createElement(ChatInput, { sx: {
                 paddingLeft: 4,
                 paddingRight: 4,

package/lib/components/index.d.ts

@@ -4,7 +4,6 @@ export * from './chat-messages';
 export * from './code-blocks';
 export * from './input';
 export * from './jl-theme-provider';
-export * from './markdown-renderer';
 export * from './mui-extras';
 export * from './scroll-container';
 export * from './toolbar';

package/lib/components/index.js

@@ -8,7 +8,6 @@ export * from './chat-messages';
 export * from './code-blocks';
 export * from './input';
 export * from './jl-theme-provider';
-export * from './markdown-renderer';
 export * from './mui-extras';
 export * from './scroll-container';
 export * from './toolbar';

package/lib/components/messages/footer.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import { IMessageFooterRegistry, MessageFooterSectionProps } from '../../footers';
+/**
+ * The chat footer component properties.
+ */
+export interface IMessageFootersProps extends MessageFooterSectionProps {
+    /**
+     * The chat footer registry.
+     */
+    registry: IMessageFooterRegistry;
+}
+/**
+ * The chat footer component, which displays footer components on a row according to
+ * their respective positions.
+ */
+export declare function MessageFooter(props: IMessageFootersProps): JSX.Element;

package/lib/components/messages/footer.js

@@ -0,0 +1,19 @@
+/*
+ * Copyright (c) Jupyter Development Team.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { Box } from '@mui/material';
+import React from 'react';
+/**
+ * The chat footer component, which displays footer components on a row according to
+ * their respective positions.
+ */
+export function MessageFooter(props) {
+    var _a, _b, _c;
+    const { message, model, registry } = props;
+    const footer = registry.getFooter();
+    return (React.createElement(Box, { sx: { display: 'flex', justifyContent: 'space-between' } },
+        ((_a = footer.left) === null || _a === void 0 ? void 0 : _a.component) ? (React.createElement(footer.left.component, { message: message, model: model })) : (React.createElement("div", null)),
+        ((_b = footer.center) === null || _b === void 0 ? void 0 : _b.component) ? (React.createElement(footer.center.component, { message: message, model: model })) : (React.createElement("div", null)),
+        ((_c = footer.right) === null || _c === void 0 ? void 0 : _c.component) ? (React.createElement(footer.right.component, { message: message, model: model })) : (React.createElement("div", null))));
+}

package/lib/components/{markdown-renderer.d.ts → messages/message-renderer.d.ts}

@@ -1,8 +1,11 @@
 import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
 import { PromiseDelegate } from '@lumino/coreutils';
 import React from 'react';
-import { IChatModel } from '../model';
-type MarkdownRendererProps = {
+import { IChatModel } from '../../model';
+/**
+ * The type of the props for the MessageRenderer component.
+ */
+type MessageRendererProps = {
     /**
      * The string to render.
      */
@@ -32,6 +35,9 @@ type MarkdownRendererProps = {
      */
     delete?: () => void;
 };
-declare function MarkdownRendererBase(props: MarkdownRendererProps): JSX.Element;
-export declare const MarkdownRenderer: React.MemoExoticComponent<typeof MarkdownRendererBase>;
+/**
+ * The message renderer base component.
+ */
+declare function MessageRendererBase(props: MessageRendererProps): JSX.Element;
+export declare const MessageRenderer: React.MemoExoticComponent<typeof MessageRendererBase>;
 export {};

package/lib/components/{markdown-renderer.js → messages/message-renderer.js}

@@ -4,47 +4,24 @@
  */
 import React, { useState, useEffect } from 'react';
 import { createPortal } from 'react-dom';
-import { CodeToolbar } from './code-blocks/code-toolbar';
-import { MessageToolbar } from './toolbar';
-const MD_MIME_TYPE = 'text/markdown';
-const MD_RENDERED_CLASS = 'jp-chat-rendered-markdown';
+import { CodeToolbar } from '../code-blocks/code-toolbar';
+import { MessageToolbar } from '../toolbar';
+import { MarkdownRenderer, MD_RENDERED_CLASS } from '../../markdown-renderer';
 /**
- * Escapes backslashes in LaTeX delimiters such that they appear in the DOM
- * after the initial MarkDown render. For example, this function takes '\(` and
- * returns `\\(`.
- *
- * Required for proper rendering of MarkDown + LaTeX markup in the chat by
- * `ILatexTypesetter`.
+ * The message renderer base component.
  */
-function escapeLatexDelimiters(text) {
-    return text
-        .replace(/\\\(/g, '\\\\(')
-        .replace(/\\\)/g, '\\\\)')
-        .replace(/\\\[/g, '\\\\[')
-        .replace(/\\\]/g, '\\\\]');
-}
-function MarkdownRendererBase(props) {
+function MessageRendererBase(props) {
+    const { markdownStr, rmRegistry } = props;
     const appendContent = props.appendContent || false;
     const [renderedContent, setRenderedContent] = useState(null);
     // each element is a two-tuple with the structure [codeToolbarRoot, codeToolbarProps].
     const [codeToolbarDefns, setCodeToolbarDefns] = useState([]);
     useEffect(() => {
         const renderContent = async () => {
-            var _a, _b;
-            // initialize mime model
-            const mdStr = escapeLatexDelimiters(props.markdownStr);
-            const model = props.rmRegistry.createModel({
-                data: { [MD_MIME_TYPE]: mdStr }
+            const renderer = await MarkdownRenderer.renderContent({
+                content: markdownStr,
+                rmRegistry
             });
-            const renderer = props.rmRegistry.createRenderer(MD_MIME_TYPE);
-            // step 1: render markdown
-            await renderer.renderModel(model);
-            (_a = props.rmRegistry.latexTypesetter) === null || _a === void 0 ? void 0 : _a.typeset(renderer.node);
-            if (!renderer.node) {
-                throw new Error('Rendermime was unable to render Markdown content within a chat message. Please report this upstream to Jupyter chat on GitHub.');
-            }
-            // step 2: render LaTeX via MathJax.
-            (_b = props.rmRegistry.latexTypesetter) === null || _b === void 0 ? void 0 : _b.typeset(renderer.node);
             const newCodeToolbarDefns = [];
             // Attach CodeToolbar root element to each <pre> block
             const preBlocks = renderer.node.querySelectorAll('pre');
@@ -63,7 +40,7 @@ function MarkdownRendererBase(props) {
             props.rendered.resolve();
         };
         renderContent();
-    }, [props.markdownStr, props.rmRegistry]);
+    }, [markdownStr, rmRegistry]);
     return (React.createElement("div", { className: MD_RENDERED_CLASS },
         renderedContent &&
             (appendContent ? (React.createElement("div", { ref: node => node && node.appendChild(renderedContent) })) : (React.createElement("div", { ref: node => node && node.replaceChildren(renderedContent) }))),
@@ -76,4 +53,4 @@ function MarkdownRendererBase(props) {
             return createPortal(React.createElement(CodeToolbar, { ...codeToolbarProps }), codeToolbarRoot);
         })));
 }
-export const MarkdownRenderer = React.memo(MarkdownRendererBase);
+export const MessageRenderer = React.memo(MessageRendererBase);

package/lib/components/messages/welcome.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { MarkdownRenderer } from '../../markdown-renderer';
+/**
+ * The welcome message component.
+ * This message is displayed on top of the chat messages, and is rendered using a
+ * markdown renderer.
+ */
+export declare function WelcomeMessage(props: MarkdownRenderer.IOptions): JSX.Element;

package/lib/components/messages/welcome.js

@@ -0,0 +1,41 @@
+/*
+ * Copyright (c) Jupyter Development Team.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { classes } from '@jupyterlab/ui-components';
+import React, { useEffect, useRef } from 'react';
+import { MarkdownRenderer, MD_RENDERED_CLASS } from '../../markdown-renderer';
+const WELCOME_MESSAGE_CLASS = 'jp-chat-welcome-message';
+/**
+ * The welcome message component.
+ * This message is displayed on top of the chat messages, and is rendered using a
+ * markdown renderer.
+ */
+export function WelcomeMessage(props) {
+    const { rmRegistry } = props;
+    const content = props.content + '\n----\n';
+    // ref that tracks the content container to store the rendermime node in
+    const renderingContainer = useRef(null);
+    // ref that tracks whether the rendermime node has already been inserted
+    const renderingInserted = useRef(false);
+    /**
+     * Effect: use Rendermime to render `props.markdownStr` into an HTML element,
+     * and insert it into `renderingContainer` if not yet inserted.
+     */
+    useEffect(() => {
+        const renderContent = async () => {
+            const renderer = await MarkdownRenderer.renderContent({
+                content,
+                rmRegistry
+            });
+            // insert the rendering into renderingContainer if not yet inserted
+            if (renderingContainer.current !== null && !renderingInserted.current) {
+                renderingContainer.current.appendChild(renderer.node);
+                renderingInserted.current = true;
+            }
+        };
+        renderContent();
+    }, [content]);
+    return (React.createElement("div", { className: classes(MD_RENDERED_CLASS, WELCOME_MESSAGE_CLASS) },
+        React.createElement("div", { ref: renderingContainer })));
+}

package/lib/components/scroll-container.js

@@ -28,6 +28,6 @@ export function ScrollContainer(props) {
             },
             ...props.sx
         } },
-        React.createElement(Box, { sx: { minHeight: '100.01%' } }, props.children),
+        React.createElement(Box, null, props.children),
         React.createElement(Box, { sx: { overflowAnchor: 'auto', height: '1px' } })));
 }

package/lib/footers/index.d.ts

@@ -0,0 +1,2 @@
+export * from './registry';
+export * from './types';

package/lib/footers/index.js

@@ -0,0 +1,6 @@
+/*
+ * Copyright (c) Jupyter Development Team.
+ * Distributed under the terms of the Modified BSD License.
+ */
+export * from './registry';
+export * from './types';

package/lib/footers/registry.d.ts

@@ -0,0 +1,36 @@
+import { Token } from '@lumino/coreutils';
+import { MessageFooter, MessageFooterSection } from './types';
+/**
+ * The interface of a registry to provide chat footer.
+ */
+export interface IMessageFooterRegistry {
+    /**
+     * Get the message footer.
+     */
+    getFooter(): MessageFooter;
+    /**
+     * Add a message footer section.
+     * If multiple labextensions add a section in the same region, only
+     * the last one will be displayed.
+     */
+    addSection(section: MessageFooterSection): void;
+}
+/**
+ * The default implementation of the message footer registry.
+ */
+export declare class MessageFooterRegistry implements IMessageFooterRegistry {
+    /**
+     * Get the footer from the registry.
+     */
+    getFooter(): MessageFooter;
+    /**
+     * Add a message footer.
+     * If several extension add footers, only the last one will be displayed.
+     */
+    addSection(footer: MessageFooterSection): void;
+    private _footers;
+}
+/**
+ * The token providing the chat footer registry.
+ */
+export declare const IMessageFooterRegistry: Token<IMessageFooterRegistry>;

package/lib/footers/registry.js

@@ -0,0 +1,30 @@
+/*
+ * Copyright (c) Jupyter Development Team.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { Token } from '@lumino/coreutils';
+/**
+ * The default implementation of the message footer registry.
+ */
+export class MessageFooterRegistry {
+    constructor() {
+        this._footers = {};
+    }
+    /**
+     * Get the footer from the registry.
+     */
+    getFooter() {
+        return this._footers;
+    }
+    /**
+     * Add a message footer.
+     * If several extension add footers, only the last one will be displayed.
+     */
+    addSection(footer) {
+        this._footers[footer.position] = footer;
+    }
+}
+/**
+ * The token providing the chat footer registry.
+ */
+export const IMessageFooterRegistry = new Token('@jupyter/chat:ChatFooterRegistry');

package/lib/footers/types.d.ts

@@ -0,0 +1,26 @@
+/// <reference types="react" />
+import { IChatModel } from '../model';
+import { IChatMessage } from '../types';
+/**
+ * The props sent passed to each `MessageFooterSection` React component.
+ */
+export type MessageFooterSectionProps = {
+    model: IChatModel;
+    message: IChatMessage;
+};
+/**
+ * A message footer section which can be added to the footer registry.
+ */
+export type MessageFooterSection = {
+    component: React.FC<MessageFooterSectionProps>;
+    position: 'left' | 'center' | 'right';
+};
+/**
+ * The message footer returned by the registry, composed of 'left', 'center',
+ * and 'right' sections.
+ */
+export type MessageFooter = {
+    left?: MessageFooterSection;
+    center?: MessageFooterSection;
+    right?: MessageFooterSection;
+};

package/lib/footers/types.js

@@ -0,0 +1,5 @@
+/*
+ * Copyright (c) Jupyter Development Team.
+ * Distributed under the terms of the Modified BSD License.
+ */
+export {};

package/lib/index.d.ts

@@ -1,8 +1,10 @@
 export * from './active-cell-manager';
 export * from './chat-commands';
 export * from './components';
+export * from './footers';
 export * from './icons';
 export * from './input-model';
+export * from './markdown-renderer';
 export * from './model';
 export * from './registry';
 export * from './selection-watcher';

package/lib/index.js

@@ -5,8 +5,10 @@
 export * from './active-cell-manager';
 export * from './chat-commands';
 export * from './components';
+export * from './footers';
 export * from './icons';
 export * from './input-model';
+export * from './markdown-renderer';
 export * from './model';
 export * from './registry';
 export * from './selection-watcher';

package/lib/input-model.d.ts

@@ -114,6 +114,10 @@ export interface IInputModel extends IDisposable {
      * Clear mentions list.
      */
     clearMentions(): void;
+    /**
+     * A signal emitting when disposing of the model.
+     */
+    readonly onDisposed: ISignal<InputModel, void>;
 }
 /**
  * The input model.
@@ -231,6 +235,10 @@ export declare class InputModel implements IInputModel {
      * Dispose the input model.
      */
     dispose(): void;
+    /**
+     * A signal emitting when disposing of the model.
+     */
+    get onDisposed(): ISignal<InputModel, void>;
     /**
      * Whether the input model is disposed.
      */
@@ -252,6 +260,7 @@ export declare class InputModel implements IInputModel {
     private _configChanged;
     private _focusInputSignal;
     private _attachmentsChanged;
+    private _onDisposed;
     private _isDisposed;
 }
 export declare namespace InputModel {

package/lib/input-model.js

@@ -60,6 +60,7 @@ export class InputModel {
         this._configChanged = new Signal(this);
         this._focusInputSignal = new Signal(this);
         this._attachmentsChanged = new Signal(this);
+        this._onDisposed = new Signal(this);
         this._isDisposed = false;
         this._onSend = options.onSend;
         this._chatContext = options.chatContext;
@@ -235,8 +236,15 @@ export class InputModel {
         if (this.isDisposed) {
             return;
         }
+        this._onDisposed.emit();
         this._isDisposed = true;
     }
+    /**
+     * A signal emitting when disposing of the model.
+     */
+    get onDisposed() {
+        return this._onDisposed;
+    }
     /**
      * Whether the input model is disposed.
      */

package/lib/markdown-renderer.d.ts

@@ -0,0 +1,38 @@
+import { IRenderMime, IRenderMimeRegistry } from '@jupyterlab/rendermime';
+export declare const MD_RENDERED_CLASS = "jp-chat-rendered-markdown";
+export declare const MD_MIME_TYPE = "text/markdown";
+/**
+ * A namespace for the MarkdownRenderer.
+ */
+export declare namespace MarkdownRenderer {
+    /**
+     * The options for the MarkdownRenderer.
+     */
+    interface IOptions {
+        /**
+         * The rendermime registry.
+         */
+        rmRegistry: IRenderMimeRegistry;
+        /**
+         * The markdown content.
+         */
+        content: string;
+    }
+    /**
+     * A generic function to render a markdown string into a DOM element.
+     *
+     * @param content - the markdown content.
+     * @param rmRegistry - the rendermime registry.
+     * @returns a promise that resolves to the renderer.
+     */
+    function renderContent(options: IOptions): Promise<IRenderMime.IRenderer>;
+    /**
+     * Escapes backslashes in LaTeX delimiters such that they appear in the DOM
+     * after the initial MarkDown render. For example, this function takes '\(` and
+     * returns `\\(`.
+     *
+     * Required for proper rendering of MarkDown + LaTeX markup in the chat by
+     * `ILatexTypesetter`.
+     */
+    function escapeLatexDelimiters(text: string): string;
+}