Wip stylin

packages/chatbox/src/panel.ts

@@ -42,7 +42,7 @@ import {
 } from '@phosphor/widgets';
 
 import {
-  CodeChatbox
+  Chatbox
 } from './widget';
 
 
@@ -101,7 +101,7 @@ class ChatboxPanel extends Panel {
     session.kernelChanged.connect(this._updateTitle, this);
     session.propertyChanged.connect(this._updateTitle, this);
 
-    this.title.icon = 'jp-ImageCodeChatbox';
+    this.title.icon = 'jp-ImageChatbox';
     this.title.closable = true;
     this.id = `chatbox-${count}`;
   }
@@ -109,7 +109,7 @@ class ChatboxPanel extends Panel {
   /**
    * The chatbox widget used by the panel.
    */
-  readonly chatbox: CodeChatbox;
+  readonly chatbox: Chatbox;
 
   /**
    * The session used by the panel.
@@ -151,7 +151,7 @@ class ChatboxPanel extends Panel {
   /**
    * Handle a chatbox execution.
    */
-  private _onExecuted(sender: CodeChatbox, args: Date) {
+  private _onExecuted(sender: Chatbox, args: Date) {
     this._executed = args;
     this._updateTitle();
   }
@@ -218,7 +218,7 @@ namespace ChatboxPanel {
     /**
      * The model factory for the chatbox widget.
      */
-    modelFactory?: CodeChatbox.IModelFactory;
+    modelFactory?: Chatbox.IModelFactory;
 
     /**
      * The service used to look up mime types.
@@ -239,12 +239,12 @@ namespace ChatboxPanel {
     /**
      * The factory for code chatbox content.
      */
-    readonly chatboxContentFactory: CodeChatbox.IContentFactory;
+    readonly chatboxContentFactory: Chatbox.IContentFactory;
 
     /**
      * Create a new chatbox panel.
      */
-    createChatbox(options: CodeChatbox.IOptions): CodeChatbox;
+    createChatbox(options: Chatbox.IOptions): Chatbox;
   }
 
   /**
@@ -258,7 +258,7 @@ namespace ChatboxPanel {
     constructor(options: ContentFactory.IOptions) {
       this.editorFactory = options.editorFactory;
       this.chatboxContentFactory = (options.chatboxContentFactory ||
-        new CodeChatbox.ContentFactory({
+        new Chatbox.ContentFactory({
           editorFactory: this.editorFactory,
           outputAreaContentFactory: options.outputAreaContentFactory,
           codeCellContentFactory: options.codeCellContentFactory,
@@ -275,13 +275,13 @@ namespace ChatboxPanel {
     /**
      * The factory for code chatbox content.
      */
-    readonly chatboxContentFactory: CodeChatbox.IContentFactory;
+    readonly chatboxContentFactory: Chatbox.IContentFactory;
 
     /**
      * Create a new chatbox panel.
      */
-    createChatbox(options: CodeChatbox.IOptions): CodeChatbox {
-      return new CodeChatbox(options);
+    createChatbox(options: Chatbox.IOptions): Chatbox {
+      return new Chatbox(options);
     }
   }
 
@@ -321,7 +321,7 @@ namespace ChatboxPanel {
        * The factory for chatbox widget content.  If given, this will
        * take precedence over the output area and cell factories.
        */
-      chatboxContentFactory?: CodeChatbox.IContentFactory;
+      chatboxContentFactory?: Chatbox.IContentFactory;
     }
   }
 

packages/chatbox/src/widget.ts

@@ -91,11 +91,11 @@ const EXECUTION_TIMEOUT = 250;
  * instance. Under most circumstances, it is not instantiated by user code.
  */
 export
-class CodeChatbox extends Widget {
+class Chatbox extends Widget {
   /**
    * Construct a chatbox widget.
    */
-  constructor(options: CodeChatbox.IOptions) {
+  constructor(options: Chatbox.IOptions) {
     super();
     this.addClass(CHATBOX_CLASS);
 
@@ -107,7 +107,7 @@ class CodeChatbox extends Widget {
 
     let factory = this.contentFactory = options.contentFactory;
     this.modelFactory = (
-      options.modelFactory || CodeChatbox.defaultModelFactory
+      options.modelFactory || Chatbox.defaultModelFactory
     );
     this.rendermime = options.rendermime;
     this.session = options.session;
@@ -146,12 +146,12 @@ class CodeChatbox extends Widget {
   /**
    * The content factory used by the chatbox.
    */
-  readonly contentFactory: CodeChatbox.IContentFactory;
+  readonly contentFactory: Chatbox.IContentFactory;
 
   /**
    * The model factory for the chatbox widget.
    */
-  readonly modelFactory: CodeChatbox.IModelFactory;
+  readonly modelFactory: Chatbox.IModelFactory;
 
   /**
    * The rendermime instance used by the chatbox.
@@ -507,7 +507,7 @@ class CodeChatbox extends Widget {
  * A namespace for CodeChatbox statics.
  */
 export
-namespace CodeChatbox {
+namespace Chatbox {
   /**
    * The initialization options for a chatbox widget.
    */
@@ -567,7 +567,7 @@ namespace CodeChatbox {
     /**
      * Create a new prompt widget.
      */
-    createPrompt(options: MarkdownCellWidget.IOptions, parent: CodeChatbox): MarkdownCellWidget;
+    createPrompt(options: MarkdownCellWidget.IOptions, parent: Chatbox): MarkdownCellWidget;
 
   }
 
@@ -620,7 +620,7 @@ namespace CodeChatbox {
     /**
      * Create a new prompt widget.
      */
-    createPrompt(options: MarkdownCellWidget.IOptions, parent: CodeChatbox): MarkdownCellWidget {
+    createPrompt(options: MarkdownCellWidget.IOptions, parent: Chatbox): MarkdownCellWidget {
       return new MarkdownCellWidget(options);
     }
   }

packages/chatbox/style/index.css

@@ -51,6 +51,9 @@
   padding-bottom: 8px;
 }
 
+.jp-Chatbox .jp-Cell-prompt {
+  display: none;
+}
 
 .jp-Chatbox-content .jp-InputArea-editor.jp-CellEditor {
   background: transparent;
@@ -70,8 +73,3 @@
   height: 100%;
   min-height: 100%;
 }
-
-
-.jp-Chatbox-content .jp-Chatbox-banner .jp-Cell-prompt {
-  display: none;
-}

packages/default-theme/package.json

@@ -20,6 +20,7 @@
     "@jupyterlab/application": "^0.5.0",
     "@jupyterlab/apputils": "^0.5.0",
     "@jupyterlab/cells": "^0.5.1",
+    "@jupyterlab/chatbox": "^0.1.0",
     "@jupyterlab/codeeditor": "^0.5.0",
     "@jupyterlab/codemirror": "^0.5.0",
     "@jupyterlab/completer": "^0.5.0",

packages/default-theme/style/index.css

@@ -14,6 +14,7 @@
 @import url('~@jupyterlab/apputils/style/index.css');
 @import url('~@jupyterlab/about-extension/style/index.css');
 @import url('~@jupyterlab/cells/style/index.css');
+@import url('~@jupyterlab/chatbox/style/index.css');
 @import url('~@jupyterlab/codeeditor/style/index.css');
 @import url('~@jupyterlab/codemirror/style/index.css');
 @import url('~@jupyterlab/completer/style/index.css');