@jupyter/chat 0.18.0 → 0.18.2

package/lib/widgets/chat-sidebar.d.ts

@@ -1,3 +1,3 @@
-import { ReactWidget } from '@jupyterlab/apputils';
 import { Chat } from '../components/chat';
-export declare function buildChatSidebar(options: Chat.IOptions): ReactWidget;
+import { ChatWidget } from './chat-widget';
+export declare function buildChatSidebar(options: Chat.IOptions): ChatWidget;

package/lib/widgets/chat-sidebar.js

@@ -2,14 +2,12 @@
  * Copyright (c) Jupyter Development Team.
  * Distributed under the terms of the Modified BSD License.
  */
-import { ReactWidget } from '@jupyterlab/apputils';
-import React from 'react';
-import { Chat } from '../components/chat';
 import { chatIcon } from '../icons';
+import { ChatWidget } from './chat-widget';
 export function buildChatSidebar(options) {
-    const ChatWidget = ReactWidget.create(React.createElement(Chat, { ...options }));
-    ChatWidget.id = 'jupyter-chat::side-panel';
-    ChatWidget.title.icon = chatIcon;
-    ChatWidget.title.caption = 'Jupyter Chat'; // TODO: i18n
-    return ChatWidget;
+    const widget = new ChatWidget(options);
+    widget.id = 'jupyter-chat::side-panel';
+    widget.title.icon = chatIcon;
+    widget.title.caption = 'Jupyter Chat'; // TODO: i18n
+    return widget;
 }

package/lib/widgets/multichat-panel.d.ts

@@ -110,7 +110,7 @@ export declare namespace MultiChatPanel {
          *
          * @param name - the name of the chat to move.
          */
-        openInMain?: (name: string) => void;
+        openInMain?: (name: string) => Promise<boolean>;
         /**
          * An optional callback to rename a chat.
          *
@@ -195,7 +195,7 @@ export declare namespace ChatSection {
          *
          * @param name - the name of the chat to move.
          */
-        openInMain?: (name: string) => void;
+        openInMain?: (name: string) => Promise<boolean>;
         /**
          * An optional callback to rename a chat.
          *

package/lib/widgets/multichat-panel.js

@@ -280,12 +280,13 @@ export class ChatSection extends PanelWithToolbar {
                 icon: launchIcon,
                 iconLabel: 'Move the chat to the main area',
                 className: 'jp-mod-styled',
-                onClick: () => {
+                onClick: async () => {
                     var _a;
                     const name = this.model.name;
-                    this.model.dispose();
-                    (_a = options.openInMain) === null || _a === void 0 ? void 0 : _a.call(options, name);
-                    this.dispose();
+                    if (await ((_a = options.openInMain) === null || _a === void 0 ? void 0 : _a.call(options, name))) {
+                        this.model.dispose();
+                        this.dispose();
+                    }
                 }
             });
             this.toolbar.addItem('moveMain', moveToMain);

package/package.json

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

package/src/widgets/chat-sidebar.tsx

@@ -3,16 +3,14 @@
  * Distributed under the terms of the Modified BSD License.
  */
 
-import { ReactWidget } from '@jupyterlab/apputils';
-import React from 'react';
-
 import { Chat } from '../components/chat';
 import { chatIcon } from '../icons';
+import { ChatWidget } from './chat-widget';
 
-export function buildChatSidebar(options: Chat.IOptions): ReactWidget {
-  const ChatWidget = ReactWidget.create(<Chat {...options} />);
-  ChatWidget.id = 'jupyter-chat::side-panel';
-  ChatWidget.title.icon = chatIcon;
-  ChatWidget.title.caption = 'Jupyter Chat'; // TODO: i18n
-  return ChatWidget;
+export function buildChatSidebar(options: Chat.IOptions): ChatWidget {
+  const widget = new ChatWidget(options);
+  widget.id = 'jupyter-chat::side-panel';
+  widget.title.icon = chatIcon;
+  widget.title.caption = 'Jupyter Chat'; // TODO: i18n
+  return widget;
 }

package/src/widgets/multichat-panel.tsx

@@ -279,7 +279,7 @@ export class MultiChatPanel extends SidePanel {
     name?: string
   ) => Promise<MultiChatPanel.IAddChatArgs>;
   private _getChatNames?: () => Promise<{ [name: string]: string }>;
-  private _openInMain?: (name: string) => void;
+  private _openInMain?: (name: string) => Promise<boolean>;
   private _renameChat?: (oldName: string, newName: string) => Promise<boolean>;
 
   private _openChatWidget?: ReactWidget;
@@ -317,7 +317,7 @@ export namespace MultiChatPanel {
      *
      * @param name - the name of the chat to move.
      */
-    openInMain?: (name: string) => void;
+    openInMain?: (name: string) => Promise<boolean>;
     /**
      * An optional callback to rename a chat.
      *
@@ -406,11 +406,12 @@ export class ChatSection extends PanelWithToolbar {
         icon: launchIcon,
         iconLabel: 'Move the chat to the main area',
         className: 'jp-mod-styled',
-        onClick: () => {
+        onClick: async () => {
           const name = this.model.name;
-          this.model.dispose();
-          options.openInMain?.(name);
-          this.dispose();
+          if (await options.openInMain?.(name)) {
+            this.model.dispose();
+            this.dispose();
+          }
         }
       });
       this.toolbar.addItem('moveMain', moveToMain);
@@ -521,7 +522,7 @@ export namespace ChatSection {
      *
      * @param name - the name of the chat to move.
      */
-    openInMain?: (name: string) => void;
+    openInMain?: (name: string) => Promise<boolean>;
     /**
      * An optional callback to rename a chat.
      *

package/style/chat.css

@@ -194,7 +194,7 @@
 }
 
 .jp-chat-navigation-bottom {
-  bottom: 100px;
+  bottom: 120px;
 }
 
 .jp-chat-attachments {

package/style/input.css

@@ -12,7 +12,7 @@
   display: flex;
   flex-direction: column;
   justify-content: center;
-  min-height: 56px;
+  flex: 0 0 auto;
 }
 
 .jp-chat-input-container.jp-chat-drag-hover::after {