jupyter-specta 0.1.1

package/lib/shell.js

@@ -0,0 +1,206 @@
+import { ArrayExt } from '@lumino/algorithm';
+import { MessageLoop } from '@lumino/messaging';
+import { Debouncer } from '@lumino/polling';
+import { Signal } from '@lumino/signaling';
+import { BoxLayout, BoxPanel, Panel, Widget } from '@lumino/widgets';
+/**
+ * The class name added to AppShell instances.
+ */
+const APPLICATION_SHELL_CLASS = 'jp-LabShell';
+/**
+ * The default rank of items added to a sidebar.
+ */
+const DEFAULT_RANK = 900;
+/**
+ * The application shell.
+ */
+export class SpectaShell extends Widget {
+    constructor() {
+        super();
+        this._layoutDebouncer = new Debouncer(() => {
+            this._layoutModified.emit(undefined);
+        }, 0);
+        this._layoutModified = new Signal(this);
+        this.id = 'main';
+        const rootLayout = new BoxLayout();
+        rootLayout.alignment = 'start';
+        rootLayout.spacing = 0;
+        this.addClass(APPLICATION_SHELL_CLASS);
+        const topHandler = (this._topHandler = new Private.PanelHandler());
+        topHandler.panel.id = 'specta-top-panel';
+        topHandler.panel.node.setAttribute('role', 'banner');
+        BoxLayout.setStretch(topHandler.panel, 0);
+        topHandler.panel.hide();
+        rootLayout.addWidget(topHandler.panel);
+        const hboxPanel = (this._mainPanel = new BoxPanel());
+        hboxPanel.id = 'jp-main-content-panel';
+        hboxPanel.direction = 'top-to-bottom';
+        BoxLayout.setStretch(hboxPanel, 1);
+        rootLayout.addWidget(hboxPanel);
+        const bottomPanel = (this._bottomPanel = new Panel());
+        bottomPanel.node.setAttribute('role', 'contentinfo');
+        bottomPanel.id = 'specta-bottom-panel';
+        BoxLayout.setStretch(bottomPanel, 0);
+        rootLayout.addWidget(bottomPanel);
+        bottomPanel.hide();
+        this.layout = rootLayout;
+    }
+    /**
+     * The current widget in the shell's main area.
+     */
+    get currentWidget() {
+        return this._mainPanel.widgets[0];
+    }
+    activateById(id) {
+        // no-op
+    }
+    /**
+     * Add a widget to the application shell.
+     *
+     * @param widget - The widget being added.
+     *
+     * @param area - Optional region in the shell into which the widget should
+     * be added.
+     *
+     */
+    add(widget, area, options) {
+        switch (area) {
+            case 'top':
+                this._addToTopArea(widget, options);
+                break;
+            case 'bottom':
+                this._addToBottomArea(widget, options);
+                break;
+            case 'main':
+                this._mainPanel.addWidget(widget);
+                break;
+            default:
+                console.warn(`Area ${area} is not implemented yet!`);
+                break;
+        }
+    }
+    widgets(area) {
+        switch (area) {
+            case 'top':
+                return this._topHandler.panel.children();
+            case 'bottom':
+                return this._bottomPanel.children();
+            case 'main':
+                this._mainPanel.children();
+                break;
+            default:
+                return [][Symbol.iterator]();
+        }
+        return [][Symbol.iterator]();
+    }
+    /**
+     * Add a widget to the top content area.
+     *
+     * #### Notes
+     * Widgets must have a unique `id` property, which will be used as the DOM id.
+     */
+    _addToTopArea(widget, options) {
+        var _a;
+        if (!widget.id) {
+            console.error('Widgets added to app shell must have unique id property.');
+            return;
+        }
+        options = options || {};
+        const rank = (_a = options.rank) !== null && _a !== void 0 ? _a : DEFAULT_RANK;
+        this._topHandler.addWidget(widget, rank);
+        this._onLayoutModified();
+        if (this._topHandler.panel.isHidden) {
+            this._topHandler.panel.show();
+        }
+    }
+    /**
+     * Add a widget to the bottom content area.
+     *
+     * #### Notes
+     * Widgets must have a unique `id` property, which will be used as the DOM id.
+     */
+    _addToBottomArea(widget, options) {
+        if (!widget.id) {
+            console.error('Widgets added to app shell must have unique id property.');
+            return;
+        }
+        this._bottomPanel.addWidget(widget);
+        this._onLayoutModified();
+        if (this._bottomPanel.isHidden) {
+            this._bottomPanel.show();
+        }
+    }
+    /**
+     * Handle a change to the layout.
+     */
+    _onLayoutModified() {
+        void this._layoutDebouncer.invoke();
+    }
+}
+var Private;
+(function (Private) {
+    /**
+     * A less-than comparison function for side bar rank items.
+     */
+    function itemCmp(first, second) {
+        return first.rank - second.rank;
+    }
+    Private.itemCmp = itemCmp;
+    /**
+     * A class which manages a panel and sorts its widgets by rank.
+     */
+    class PanelHandler {
+        constructor() {
+            /**
+             * A message hook for child add/remove messages on the main area dock panel.
+             */
+            this._panelChildHook = (handler, msg) => {
+                switch (msg.type) {
+                    case 'child-added':
+                        {
+                            const widget = msg.child;
+                            // If we already know about this widget, we're done
+                            if (this._items.find(v => v.widget === widget)) {
+                                break;
+                            }
+                            // Otherwise, add to the end by default
+                            const rank = this._items[this._items.length - 1].rank;
+                            this._items.push({ widget, rank });
+                        }
+                        break;
+                    case 'child-removed':
+                        {
+                            const widget = msg.child;
+                            ArrayExt.removeFirstWhere(this._items, v => v.widget === widget);
+                        }
+                        break;
+                    default:
+                        break;
+                }
+                return true;
+            };
+            this._items = new Array();
+            this._panel = new Panel();
+            MessageLoop.installMessageHook(this._panel, this._panelChildHook);
+        }
+        /**
+         * Get the panel managed by the handler.
+         */
+        get panel() {
+            return this._panel;
+        }
+        /**
+         * Add a widget to the panel.
+         *
+         * If the widget is already added, it will be moved.
+         */
+        addWidget(widget, rank) {
+            widget.parent = null;
+            const item = { widget, rank };
+            const index = ArrayExt.upperBound(this._items, item, Private.itemCmp);
+            ArrayExt.insert(this._items, index, item);
+            this._panel.insertWidget(index, widget);
+        }
+    }
+    Private.PanelHandler = PanelHandler;
+})(Private || (Private = {}));

package/lib/specta_cell_output.d.ts

@@ -0,0 +1,14 @@
+import { Panel, Widget } from '@lumino/widgets';
+import * as nbformat from '@jupyterlab/nbformat';
+export interface ICellInfo {
+    hidden?: boolean;
+    cellModel?: nbformat.ICell;
+}
+export declare class SpectaCellOutput extends Panel {
+    constructor(cellIdentity: string, cell: Widget, info: ICellInfo);
+    readonly cellIdentity: string;
+    get cellOutput(): Widget;
+    get info(): ICellInfo;
+    private _info;
+    private _cellOutput;
+}

package/lib/specta_cell_output.js

@@ -0,0 +1,24 @@
+import { Panel } from '@lumino/widgets';
+export class SpectaCellOutput extends Panel {
+    constructor(cellIdentity, cell, info) {
+        super();
+        this._info = {};
+        this.removeClass('lm-Widget');
+        this.removeClass('p-Widget');
+        this.addClass('specta-cell-output');
+        const content = new Panel();
+        content.addClass('specta-cell-content');
+        cell.addClass('specta-item-widget');
+        content.addWidget(cell);
+        this.addWidget(content);
+        this._cellOutput = cell;
+        this.cellIdentity = cellIdentity;
+        this._info = info !== null && info !== void 0 ? info : {};
+    }
+    get cellOutput() {
+        return this._cellOutput;
+    }
+    get info() {
+        return this._info;
+    }
+}

package/lib/specta_model.d.ts

@@ -0,0 +1,42 @@
+import { ICellModel } from '@jupyterlab/cells';
+import { IEditorMimeTypeService, IEditorServices } from '@jupyterlab/codeeditor';
+import { DocumentRegistry } from '@jupyterlab/docregistry';
+import { CellList, INotebookModel, INotebookTracker, NotebookPanel, StaticNotebook } from '@jupyterlab/notebook';
+import { SimplifiedOutputArea } from '@jupyterlab/outputarea';
+import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
+import { ServiceManager } from '@jupyterlab/services';
+import { IExecuteReplyMsg } from '@jupyterlab/services/lib/kernel/messages';
+import { SpectaCellOutput } from './specta_cell_output';
+export declare const VIEW = "grid_default";
+export declare class AppModel {
+    private options;
+    constructor(options: AppModel.IOptions);
+    /**
+     * Whether the handler is disposed.
+     */
+    get isDisposed(): boolean;
+    dispose(): void;
+    get rendermime(): IRenderMimeRegistry;
+    get cells(): CellList | undefined;
+    get context(): DocumentRegistry.IContext<INotebookModel>;
+    get panel(): NotebookPanel | undefined;
+    initialize(): Promise<void>;
+    createCell(cellModel: ICellModel): SpectaCellOutput;
+    executeCell(cell: ICellModel, output: SimplifiedOutputArea): Promise<IExecuteReplyMsg | undefined>;
+    private _notebookPanel?;
+    private _context;
+    private _isDisposed;
+}
+export declare namespace AppModel {
+    interface IOptions {
+        context: DocumentRegistry.IContext<INotebookModel>;
+        manager: ServiceManager.IManager;
+        rendermime: IRenderMimeRegistry;
+        tracker: INotebookTracker;
+        contentFactory: NotebookPanel.IContentFactory;
+        mimeTypeService: IEditorMimeTypeService;
+        editorConfig: StaticNotebook.IEditorConfig;
+        notebookConfig: StaticNotebook.INotebookConfig;
+        editorServices: IEditorServices;
+    }
+}

package/lib/specta_model.js

@@ -0,0 +1,116 @@
+import { MarkdownCell, RawCell } from '@jupyterlab/cells';
+import { OutputAreaModel, SimplifiedOutputArea } from '@jupyterlab/outputarea';
+import { createNotebookPanel } from './create_notebook_panel';
+import { SpectaCellOutput } from './specta_cell_output';
+export const VIEW = 'grid_default';
+export class AppModel {
+    constructor(options) {
+        this.options = options;
+        this._isDisposed = false;
+        this._context = options.context;
+    }
+    /**
+     * Whether the handler is disposed.
+     */
+    get isDisposed() {
+        return this._isDisposed;
+    }
+    dispose() {
+        var _a, _b;
+        if (this.isDisposed) {
+            return;
+        }
+        this._isDisposed = true;
+        (_a = this._context) === null || _a === void 0 ? void 0 : _a.dispose();
+        (_b = this._notebookPanel) === null || _b === void 0 ? void 0 : _b.dispose();
+    }
+    get rendermime() {
+        return this.options.rendermime;
+    }
+    get cells() {
+        var _a;
+        return (_a = this._context) === null || _a === void 0 ? void 0 : _a.model.cells;
+    }
+    get context() {
+        return this._context;
+    }
+    get panel() {
+        return this._notebookPanel;
+    }
+    async initialize() {
+        var _a;
+        await ((_a = this._context) === null || _a === void 0 ? void 0 : _a.sessionContext.ready);
+        this._notebookPanel = createNotebookPanel({
+            context: this._context,
+            rendermime: this.options.rendermime,
+            editorServices: this.options.editorServices
+        });
+        this.options.tracker.widgetAdded.emit(this._notebookPanel);
+    }
+    createCell(cellModel) {
+        let item;
+        const cellModelJson = cellModel.toJSON();
+        const info = {
+            cellModel: cellModelJson
+        };
+        switch (cellModel.type) {
+            case 'code': {
+                const outputareamodel = new OutputAreaModel({ trusted: true });
+                const out = new SimplifiedOutputArea({
+                    model: outputareamodel,
+                    rendermime: this.options.rendermime
+                });
+                item = new SpectaCellOutput(cellModel.id, out, info);
+                break;
+            }
+            case 'markdown': {
+                const markdownCell = new MarkdownCell({
+                    model: cellModel,
+                    rendermime: this.options.rendermime,
+                    contentFactory: this.options.contentFactory,
+                    editorConfig: this.options.editorConfig.markdown
+                });
+                markdownCell.inputHidden = false;
+                markdownCell.rendered = true;
+                Private.removeElements(markdownCell.node, 'jp-Collapser');
+                Private.removeElements(markdownCell.node, 'jp-InputPrompt');
+                item = new SpectaCellOutput(cellModel.id, markdownCell, info);
+                break;
+            }
+            default: {
+                const rawCell = new RawCell({
+                    model: cellModel,
+                    contentFactory: this.options.contentFactory,
+                    editorConfig: this.options.editorConfig.raw
+                });
+                rawCell.inputHidden = false;
+                Private.removeElements(rawCell.node, 'jp-Collapser');
+                Private.removeElements(rawCell.node, 'jp-InputPrompt');
+                item = new SpectaCellOutput(cellModel.id, rawCell, info);
+                break;
+            }
+        }
+        return item;
+    }
+    async executeCell(cell, output) {
+        if (cell.type !== 'code' || !this._context) {
+            return;
+        }
+        const source = cell.sharedModel.source;
+        const rep = await SimplifiedOutputArea.execute(source, output, this._context.sessionContext);
+        return rep;
+    }
+}
+var Private;
+(function (Private) {
+    /**
+     * Remove children by className from an HTMLElement.
+     */
+    function removeElements(node, className) {
+        const elements = node.getElementsByClassName(className);
+        for (let i = 0; i < elements.length; i++) {
+            elements[i].remove();
+        }
+    }
+    Private.removeElements = removeElements;
+})(Private || (Private = {}));

package/lib/specta_widget.d.ts

@@ -0,0 +1,29 @@
+import { Message } from '@lumino/messaging';
+import { Panel } from '@lumino/widgets';
+import { AppModel } from './specta_model';
+import { ISpectaLayoutRegistry } from './token';
+export declare class AppWidget extends Panel {
+    constructor(options: AppWidget.IOptions);
+    /**
+     * A promise that is fulfilled when the model is ready.
+     */
+    get ready(): Promise<void>;
+    get model(): AppModel;
+    addSpinner(): void;
+    dispose(): void;
+    render(): Promise<void>;
+    protected onCloseRequest(msg: Message): void;
+    private _model;
+    private _ready;
+    private _host;
+    private _layoutRegistry;
+    private _loaderHost?;
+}
+export declare namespace AppWidget {
+    interface IOptions {
+        id: string;
+        label: string;
+        model: AppModel;
+        layoutRegistry: ISpectaLayoutRegistry;
+    }
+}

package/lib/specta_widget.js

@@ -0,0 +1,92 @@
+import { PromiseDelegate } from '@lumino/coreutils';
+import { Panel, Widget } from '@lumino/widgets';
+import { hideAppLoadingIndicator, isSpectaApp } from './tool';
+export class AppWidget extends Panel {
+    constructor(options) {
+        super();
+        this._ready = new PromiseDelegate();
+        this.node.id = options.id;
+        this.title.label = options.label;
+        this.title.closable = true;
+        this._model = options.model;
+        this._layoutRegistry = options.layoutRegistry;
+        this.node.style.padding = '5px';
+        this._host = new Panel();
+        this._host.addClass('specta-output-host');
+        this.addWidget(this._host);
+        this.node.style.overflow = 'auto';
+        if (!isSpectaApp()) {
+            // Not a specta app, add spinner
+            this.addSpinner();
+        }
+        this._model.initialize().then(() => {
+            this.render()
+                .catch(console.error)
+                .then(() => window.dispatchEvent(new Event('resize')));
+        });
+    }
+    /**
+     * A promise that is fulfilled when the model is ready.
+     */
+    get ready() {
+        return this._ready.promise;
+    }
+    get model() {
+        return this._model;
+    }
+    addSpinner() {
+        const loaderHost = (this._loaderHost = new Widget());
+        loaderHost.addClass('specta-loader-host');
+        const spinner = document.createElement('div');
+        spinner.className = 'specta-loader';
+        loaderHost.node.appendChild(spinner);
+        const text = document.createElement('div');
+        text.className = 'specta-loading-indicator-text';
+        text.textContent = 'Loading Specta';
+        loaderHost.node.appendChild(text);
+        this.addWidget(loaderHost);
+    }
+    dispose() {
+        if (this.isDisposed) {
+            return;
+        }
+        this._model.dispose();
+        super.dispose();
+    }
+    async render() {
+        var _a;
+        const cellList = (_a = this._model.cells) !== null && _a !== void 0 ? _a : [];
+        const outputs = [];
+        for (const cell of cellList) {
+            const src = cell.sharedModel.source;
+            if (src.length === 0) {
+                continue;
+            }
+            const el = this._model.createCell(cell);
+            await this._model.executeCell(cell, el.cellOutput);
+            outputs.push(el);
+        }
+        const readyCallback = async () => {
+            if (this._loaderHost) {
+                this._loaderHost.node.style.opacity = '0';
+                setTimeout(() => {
+                    var _a;
+                    (_a = this.layout) === null || _a === void 0 ? void 0 : _a.removeWidget(this._loaderHost);
+                }, 100);
+            }
+            else {
+                hideAppLoadingIndicator();
+            }
+        };
+        await this._layoutRegistry.selectedLayout.layout.render({
+            host: this._host,
+            items: outputs,
+            notebook: this._model.context.model.toJSON(),
+            readyCallback
+        });
+    }
+    onCloseRequest(msg) {
+        this._model.dispose();
+        super.onCloseRequest(msg);
+    }
+}

package/lib/specta_widget_factory.d.ts

@@ -0,0 +1,25 @@
+import { IEditorMimeTypeService, IEditorServices } from '@jupyterlab/codeeditor';
+import { INotebookTracker, NotebookPanel, INotebookModel } from '@jupyterlab/notebook';
+import { DocumentRegistry } from '@jupyterlab/docregistry';
+import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
+import { ServiceManager } from '@jupyterlab/services';
+import { AppWidget } from './specta_widget';
+import { ISpectaLayoutRegistry } from './token';
+export declare class SpectaWidgetFactory {
+    constructor(options: SpectaWidgetFactory.IOptions);
+    createNew(options: {
+        context: DocumentRegistry.IContext<INotebookModel>;
+    }): Promise<AppWidget>;
+    private _options;
+}
+export declare namespace SpectaWidgetFactory {
+    interface IOptions {
+        manager: ServiceManager.IManager;
+        rendermime: IRenderMimeRegistry;
+        tracker: INotebookTracker;
+        contentFactory: NotebookPanel.IContentFactory;
+        mimeTypeService: IEditorMimeTypeService;
+        editorServices: IEditorServices;
+        spectaLayoutRegistry: ISpectaLayoutRegistry;
+    }
+}

package/lib/specta_widget_factory.js

@@ -0,0 +1,30 @@
+import { StaticNotebook } from '@jupyterlab/notebook';
+import { AppModel } from './specta_model';
+import { AppWidget } from './specta_widget';
+import { UUID } from '@lumino/coreutils';
+export class SpectaWidgetFactory {
+    constructor(options) {
+        this._options = options;
+    }
+    async createNew(options) {
+        const { context } = options;
+        const model = new AppModel({
+            context,
+            manager: this._options.manager,
+            rendermime: this._options.rendermime,
+            tracker: this._options.tracker,
+            contentFactory: this._options.contentFactory,
+            mimeTypeService: this._options.mimeTypeService,
+            editorConfig: StaticNotebook.defaultEditorConfig,
+            notebookConfig: StaticNotebook.defaultNotebookConfig,
+            editorServices: this._options.editorServices
+        });
+        const panel = new AppWidget({
+            id: UUID.uuid4(),
+            label: '',
+            model,
+            layoutRegistry: this._options.spectaLayoutRegistry
+        });
+        return panel;
+    }
+}

package/lib/token.d.ts

@@ -0,0 +1,31 @@
+import { Token } from '@lumino/coreutils';
+import { Panel, Widget } from '@lumino/widgets';
+import { SpectaCellOutput } from './specta_cell_output';
+import * as nbformat from '@jupyterlab/nbformat';
+import { ISignal } from '@lumino/signaling';
+import { IWidgetTracker } from '@jupyterlab/apputils';
+export interface ISpectaLayout {
+    render(options: {
+        host: Panel;
+        items: SpectaCellOutput[];
+        notebook: nbformat.INotebookContent;
+        readyCallback: () => Promise<void>;
+    }): Promise<void>;
+}
+export interface ISpectaLayoutRegistry {
+    get(name: string): ISpectaLayout | undefined;
+    register(name: string, layout: ISpectaLayout): void;
+    allLayouts(): string[];
+    layoutAdded: ISignal<ISpectaLayoutRegistry, string>;
+    selectedLayout: {
+        name: string;
+        layout: ISpectaLayout;
+    };
+    setSelectedLayout(name: string): void;
+    selectedLayoutChanged: ISignal<ISpectaLayoutRegistry, {
+        name: string;
+        layout: ISpectaLayout;
+    }>;
+}
+export declare const ISpectaLayoutRegistry: Token<ISpectaLayoutRegistry>;
+export declare const ISpectaDocTracker: Token<IWidgetTracker<Widget>>;

package/lib/token.js

@@ -0,0 +1,3 @@
+import { Token } from '@lumino/coreutils';
+export const ISpectaLayoutRegistry = new Token('specta:ISpectaLayoutRegistry');
+export const ISpectaDocTracker = new Token('exampleDocTracker');

package/lib/tool.d.ts

@@ -0,0 +1,23 @@
+import { JupyterFrontEnd } from '@jupyterlab/application';
+import { WidgetTracker } from '@jupyterlab/apputils';
+import { IEditorServices } from '@jupyterlab/codeeditor';
+import { INotebookTracker, NotebookPanel } from '@jupyterlab/notebook';
+import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
+import { VoilaFileBrowser } from '@voila-dashboards/voila';
+import { IDocumentManager } from '@jupyterlab/docmanager';
+import { ISpectaLayoutRegistry } from './token';
+export declare function registerDocumentFactory(options: {
+    factoryName: string;
+    app: JupyterFrontEnd;
+    rendermime: IRenderMimeRegistry;
+    tracker: INotebookTracker;
+    editorServices: IEditorServices;
+    contentFactory: NotebookPanel.IContentFactory;
+    spectaTracker: WidgetTracker;
+    spectaLayoutRegistry: ISpectaLayoutRegistry;
+}): void;
+export declare function createFileBrowser(options: {
+    docManager: IDocumentManager;
+}): VoilaFileBrowser;
+export declare function hideAppLoadingIndicator(): void;
+export declare function isSpectaApp(): boolean;