@jupyter/chat 0.20.0-alpha.3 → 0.20.0

package/lib/components/attachments.js

@@ -3,10 +3,11 @@
  * Distributed under the terms of the Modified BSD License.
  */
 import CloseIcon from '@mui/icons-material/Close';
-import { Box, Button, Tooltip } from '@mui/material';
+import { Box, Tooltip } from '@mui/material';
 import React from 'react';
 import { PathExt } from '@jupyterlab/coreutils';
 import { UUID } from '@lumino/coreutils';
+import { TooltippedIconButton } from './mui-extras';
 import { useChatContext } from '../context';
 const ATTACHMENT_CLASS = 'jp-chat-attachment';
 const ATTACHMENT_CLICKABLE_CLASS = 'jp-chat-attachment-clickable';
@@ -79,17 +80,11 @@ export function AttachmentPreview(props) {
                         }
                         : {}
                 } }, getAttachmentDisplayName(props.attachment))),
-        props.onRemove && (React.createElement(Tooltip, { title: remove_tooltip, placement: "top", arrow: true },
-            React.createElement("span", null,
-                React.createElement(Button, { onClick: () => props.onRemove(props.attachment), size: "small", className: REMOVE_BUTTON_CLASS, "aria-label": remove_tooltip, sx: {
-                        minWidth: 'unset',
-                        padding: 0,
-                        lineHeight: 0,
-                        color: 'var(--jp-ui-font-color2)',
-                        '&:hover': {
-                            color: 'var(--jp-ui-font-color0)',
-                            backgroundColor: 'transparent'
-                        }
-                    } },
-                    React.createElement(CloseIcon, { fontSize: "small" })))))));
+        props.onRemove && (React.createElement(TooltippedIconButton, { tooltip: remove_tooltip, onClick: () => props.onRemove(props.attachment), className: REMOVE_BUTTON_CLASS, inputToolbar: false, sx: {
+                width: 'unset',
+                minWidth: 'unset',
+                height: 'unset',
+                padding: 0
+            } },
+            React.createElement(CloseIcon, { fontSize: "small" })))));
 }

package/lib/index.d.ts

@@ -1,5 +1,6 @@
 export * from './active-cell-manager';
 export * from './components';
+export * from './context';
 export * from './icons';
 export * from './input-model';
 export * from './model';

package/lib/index.js

@@ -4,6 +4,7 @@
  */
 export * from './active-cell-manager';
 export * from './components';
+export * from './context';
 export * from './icons';
 export * from './input-model';
 export * from './model';

package/lib/message.d.ts

@@ -1,6 +1,5 @@
-import { IRenderMime } from '@jupyterlab/rendermime';
 import { ISignal } from '@lumino/signaling';
-import { IAttachment, IMessageContent, IMessage, IMessageMetadata, IUser } from './types';
+import { IAttachment, IMessageContent, IMessage, IMessageMetadata, IUser, IMimeModelBody } from './types';
 /**
  * The message object.
  */
@@ -19,7 +18,7 @@ export declare class Message implements IMessage {
      * Getters for each attribute individually.
      */
     get type(): string;
-    get body(): string | (Partial<IRenderMime.IMimeModel> & Pick<IRenderMime.IMimeModel, 'data'>);
+    get body(): string | IMimeModelBody;
     get id(): string;
     get time(): number;
     get sender(): IUser;

package/lib/theme-provider.js

@@ -159,10 +159,6 @@ export async function getJupyterLabTheme() {
             }
         },
         palette: {
-            background: {
-                paper: getCSSVariable('--jp-layout-color1'),
-                default: getCSSVariable('--jp-layout-color1')
-            },
             mode: light ? 'light' : 'dark',
             primary: {
                 main: getCSSVariable(`--jp-brand-color${light ? '1' : '2'}`),

package/lib/tokens.d.ts

@@ -1,10 +1,17 @@
 import { IWidgetTracker, MainAreaWidget } from '@jupyterlab/apputils';
 import { Token } from '@lumino/coreutils';
 import { ChatWidget } from './widgets';
+import { IChatModel } from './model';
+/**
+ * The main area chat widget type.
+ */
+export type MainAreaChat = MainAreaWidget<ChatWidget> & {
+    model: IChatModel;
+};
 /**
  * the chat tracker type.
  */
-export type IChatTracker = IWidgetTracker<ChatWidget | MainAreaWidget<ChatWidget>>;
+export type IChatTracker = IWidgetTracker<ChatWidget | MainAreaChat>;
 /**
  * A chat tracker token.
  */

package/lib/types.d.ts

@@ -53,6 +53,10 @@ export interface IConfig {
      */
     showDeleted?: boolean;
 }
+/**
+ * Mime model body type, a partial mime bundle model containing at least the data.
+ */
+export type IMimeModelBody = Partial<IRenderMime.IMimeModel> & Pick<IRenderMime.IMimeModel, 'data'>;
 /**
  * An empty interface to describe optional metadata attached to a chat message.
  * Extensions can augment this interface to add custom fields:
@@ -72,7 +76,7 @@ export interface IMessageMetadata {
  */
 export type IMessageContent<T = IUser, U = IAttachment> = {
     type: string;
-    body: string | (Partial<IRenderMime.IMimeModel> & Pick<IRenderMime.IMimeModel, 'data'>);
+    body: string | IMimeModelBody;
     id: string;
     time: number;
     sender: T;

package/lib/widgets/chat-selector-popup.js

@@ -277,7 +277,7 @@ function ChatSelectorList({ names, selectedName, loadedModels, onSelect, onUpdat
         onClose(name);
     };
     if (names.length === 0) {
-        return React.createElement("div", { className: POPUP_EMPTY_CLASS }, "No chats found");
+        return React.createElement("div", { className: POPUP_EMPTY_CLASS }, "No chat found");
     }
     return (React.createElement("ul", { ref: listRef, className: POPUP_LIST_CLASS }, names.map(name => {
         const isLoaded = loadedModels.has(name);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jupyter/chat",
-  "version": "0.20.0-alpha.3",
+  "version": "0.20.0",
   "description": "A package that provides UI components that can be used to create a chat in a Jupyterlab extension.",
   "keywords": [
     "jupyter",

package/src/components/attachments.tsx

@@ -4,11 +4,12 @@
  */
 
 import CloseIcon from '@mui/icons-material/Close';
-import { Box, Button, Tooltip } from '@mui/material';
+import { Box, Tooltip } from '@mui/material';
 import React from 'react';
 import { PathExt } from '@jupyterlab/coreutils';
 import { UUID } from '@lumino/coreutils';
 
+import { TooltippedIconButton } from './mui-extras';
 import { useChatContext } from '../context';
 import { IAttachment } from '../types';
 
@@ -131,28 +132,20 @@ export function AttachmentPreview(props: AttachmentProps): JSX.Element {
         </Box>
       </Tooltip>
       {props.onRemove && (
-        <Tooltip title={remove_tooltip} placement="top" arrow>
-          <span>
-            <Button
-              onClick={() => props.onRemove!(props.attachment)}
-              size="small"
-              className={REMOVE_BUTTON_CLASS}
-              aria-label={remove_tooltip}
-              sx={{
-                minWidth: 'unset',
-                padding: 0,
-                lineHeight: 0,
-                color: 'var(--jp-ui-font-color2)',
-                '&:hover': {
-                  color: 'var(--jp-ui-font-color0)',
-                  backgroundColor: 'transparent'
-                }
-              }}
-            >
-              <CloseIcon fontSize="small" />
-            </Button>
-          </span>
-        </Tooltip>
+        <TooltippedIconButton
+          tooltip={remove_tooltip}
+          onClick={() => props.onRemove!(props.attachment)}
+          className={REMOVE_BUTTON_CLASS}
+          inputToolbar={false}
+          sx={{
+            width: 'unset',
+            minWidth: 'unset',
+            height: 'unset',
+            padding: 0
+          }}
+        >
+          <CloseIcon fontSize="small" />
+        </TooltippedIconButton>
       )}
     </Box>
   );

package/src/index.ts

@@ -5,6 +5,7 @@
 
 export * from './active-cell-manager';
 export * from './components';
+export * from './context';
 export * from './icons';
 export * from './input-model';
 export * from './model';

package/src/message.ts

@@ -3,14 +3,14 @@
  * Distributed under the terms of the Modified BSD License.
  */
 
-import { IRenderMime } from '@jupyterlab/rendermime';
 import { ISignal, Signal } from '@lumino/signaling';
 import {
   IAttachment,
   IMessageContent,
   IMessage,
   IMessageMetadata,
-  IUser
+  IUser,
+  IMimeModelBody
 } from './types';
 
 /**
@@ -39,9 +39,7 @@ export class Message implements IMessage {
   get type(): string {
     return this._content.type;
   }
-  get body():
-    | string
-    | (Partial<IRenderMime.IMimeModel> & Pick<IRenderMime.IMimeModel, 'data'>) {
+  get body(): string | IMimeModelBody {
     return this._content.body;
   }
   get id(): string {

package/src/theme-provider.ts

@@ -184,10 +184,6 @@ export async function getJupyterLabTheme(): Promise<Theme> {
       }
     },
     palette: {
-      background: {
-        paper: getCSSVariable('--jp-layout-color1'),
-        default: getCSSVariable('--jp-layout-color1')
-      },
       mode: light ? 'light' : 'dark',
       primary: {
         main: getCSSVariable(`--jp-brand-color${light ? '1' : '2'}`),

package/src/tokens.ts

@@ -7,13 +7,19 @@ import { IWidgetTracker, MainAreaWidget } from '@jupyterlab/apputils';
 import { Token } from '@lumino/coreutils';
 
 import { ChatWidget } from './widgets';
+import { IChatModel } from './model';
+
+/**
+ * The main area chat widget type.
+ */
+export type MainAreaChat = MainAreaWidget<ChatWidget> & {
+  model: IChatModel;
+};
 
 /**
  * the chat tracker type.
  */
-export type IChatTracker = IWidgetTracker<
-  ChatWidget | MainAreaWidget<ChatWidget>
->;
+export type IChatTracker = IWidgetTracker<ChatWidget | MainAreaChat>;
 
 /**
  * A chat tracker token.

package/src/types.ts

@@ -61,6 +61,12 @@ export interface IConfig {
   showDeleted?: boolean;
 }
 
+/**
+ * Mime model body type, a partial mime bundle model containing at least the data.
+ */
+export type IMimeModelBody = Partial<IRenderMime.IMimeModel> &
+  Pick<IRenderMime.IMimeModel, 'data'>;
+
 /**
  * An empty interface to describe optional metadata attached to a chat message.
  * Extensions can augment this interface to add custom fields:
@@ -80,10 +86,7 @@ export interface IMessageMetadata {} /* eslint-disable-line @typescript-eslint/n
  */
 export type IMessageContent<T = IUser, U = IAttachment> = {
   type: string;
-  body:
-    | string
-    // Should contain at least the data of the mime model.
-    | (Partial<IRenderMime.IMimeModel> & Pick<IRenderMime.IMimeModel, 'data'>);
+  body: string | IMimeModelBody;
   id: string;
   time: number;
   sender: T;

package/src/widgets/chat-selector-popup.tsx

@@ -388,7 +388,7 @@ function ChatSelectorList({
   };
 
   if (names.length === 0) {
-    return <div className={POPUP_EMPTY_CLASS}>No chats found</div>;
+    return <div className={POPUP_EMPTY_CLASS}>No chat found</div>;
   }
 
   return (