@datalayer/jupyter-react 0.0.8 → 0.0.11

package/lib/JupyterExample.d.ts

@@ -0,0 +1 @@
+import "./../style/index.css";

package/lib/JupyterExample.js

@@ -0,0 +1,56 @@
+import { jsxs as _jsxs, Fragment as _Fragment, jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { useState } from "react";
+import { useDispatch } from "react-redux";
+import { createRoot } from 'react-dom/client';
+import { Box, Button, ButtonGroup } from '@primer/react';
+import Jupyter from './jupyter/Jupyter';
+import { useJupyter } from './jupyter/JupyterContext';
+import Kernel from './jupyter/services/kernel/Kernel';
+import Cell from './components/cell/Cell';
+import { selectCell, cellActions } from './components/cell/CellState';
+import Notebook from './components/notebook/Notebook';
+import { notebookActions } from './components/notebook/NotebookState';
+import CellSidebarDefault from './components/notebook/cell/sidebar/CellSidebarDefault';
+import Output from "./components/outputs/Output";
+import "./../style/index.css";
+const SOURCE_IPYWIDGET = `import ipywidgets as widgets
+widgets.IntSlider(
+    value=7,
+    min=0,
+    max=10,
+    step=1
+)`;
+const CellPreview = () => {
+    const cell = selectCell();
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { children: ["source: ", cell.source] }, void 0),
+            _jsxs("div", { children: ["kernel available: ", String(cell.kernelAvailable)] }, void 0)] }, void 0));
+};
+const CellToolbar = () => {
+    const cell = selectCell();
+    const dispatch = useDispatch();
+    return (_jsxs(_Fragment, { children: [_jsx(Box, Object.assign({ display: "flex" }, { children: _jsxs(ButtonGroup, { children: [_jsx(Button, Object.assign({ variant: "default", size: "small", onClick: () => dispatch(cellActions.execute()) }, { children: "Run the cell" }), void 0),
+                        _jsx(Button, Object.assign({ variant: "outline", size: "small", onClick: () => dispatch(cellActions.outputsCount(0)) }, { children: "Reset outputs count" }), void 0)] }, void 0) }), void 0),
+            _jsxs(Box, { children: ["Outputs count: ", cell.outputsCount] }, void 0)] }, void 0));
+};
+const NotebookToolbar = () => {
+    const dispatch = useDispatch();
+    return (_jsx(_Fragment, { children: _jsx(Box, Object.assign({ display: "flex" }, { children: _jsxs(ButtonGroup, { children: [_jsx(Button, Object.assign({ variant: "default", size: "small", onClick: () => dispatch(notebookActions.save.started(undefined)) }, { children: "Save the notebook" }), void 0),
+                    _jsx(Button, Object.assign({ variant: "default", size: "small", onClick: () => dispatch(notebookActions.runAll.started()) }, { children: "Run all" }), void 0)] }, void 0) }), void 0) }, void 0));
+};
+const OutputExample = () => {
+    const { baseUrl, wsUrl } = useJupyter();
+    const [kernel,] = useState(new Kernel({ baseUrl, wsUrl }));
+    return (_jsx(Output, { showEditor: true, autoRun: true, kernel: kernel, code: SOURCE_IPYWIDGET }, void 0));
+};
+const div = document.createElement('div');
+document.body.appendChild(div);
+const root = createRoot(div);
+root.render(_jsxs(Jupyter, { children: [_jsx(CellPreview, {}, void 0),
+        _jsx(CellToolbar, {}, void 0),
+        _jsx(Cell, {}, void 0),
+        _jsx("hr", {}, void 0),
+        _jsx(OutputExample, {}, void 0),
+        _jsx("hr", {}, void 0),
+        _jsx(NotebookToolbar, {}, void 0),
+        _jsx(Notebook, { path: "test.ipynb", CellSidebar: CellSidebarDefault }, void 0)] }, void 0));
+//# sourceMappingURL=JupyterExample.js.map

package/lib/JupyterExample.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"JupyterExample.js","sourceRoot":"","sources":["../src/JupyterExample.tsx"],"names":[],"mappings":"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"}

package/lib/JupyterLiteExample.d.ts

@@ -0,0 +1 @@
+import "./../style/index.css";

package/lib/JupyterLiteExample.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { createRoot } from 'react-dom/client';
+import Jupyter from './jupyter/Jupyter';
+import Console from './components/console/Console';
+import "./../style/index.css";
+const div = document.createElement('div');
+document.body.appendChild(div);
+const root = createRoot(div);
+root.render(_jsx(Jupyter, Object.assign({ lite: true }, { children: _jsx(Console, {}, void 0) }), void 0));
+//# sourceMappingURL=JupyterLiteExample.js.map

package/lib/JupyterLiteExample.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"JupyterLiteExample.js","sourceRoot":"","sources":["../src/JupyterLiteExample.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,OAAO,MAAM,mBAAmB,CAAC;AACxC,OAAO,OAAO,MAAM,8BAA8B,CAAC;AAEnD,OAAO,sBAAsB,CAAC;AAE9B,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;AAC/B,MAAM,IAAI,GAAG,UAAU,CAAC,GAAG,CAAC,CAAA;AAE5B,IAAI,CAAC,MAAM,CACT,KAAC,OAAO,kBAAC,IAAI,EAAE,IAAI,gBACjB,KAAC,OAAO,aAAE,YACF,CACX,CAAC"}

package/lib/components/cell/Cell.css

@@ -1,10 +1,15 @@
+/*
 .jp-Toolbar {
+  height: auto !important;
+  height: 0px !important;
   display: none;
   position: relative !important;
-/*  height: auto !important; */
-  height: 0px !important;
 }
-
+*/
+.dla-JupyterCell {
+  margin-top: 30px;
+}
+  
 .jp-Cell {
   width: 100%;
 }
@@ -18,3 +23,7 @@
 .jp-Completer-Cell {
   position: fixed;
 }
+
+.jp-CodeMirrorEditor {
+  cursor: text !important;
+}

package/lib/components/cell/Cell.d.ts

@@ -0,0 +1,16 @@
+import '@jupyterlab/application/style/index.css';
+import '@jupyterlab/codemirror/style/index.css';
+import '@jupyterlab/cells/style/index.css';
+import '@jupyterlab/theme-light-extension/style/theme.css';
+import '@jupyterlab/theme-light-extension/style/variables.css';
+import '@jupyterlab/completer/style/index.css';
+import './Cell.css';
+export declare type ICellProps = {
+    source?: string;
+    autoStart?: boolean;
+};
+export declare const Cell: {
+    (props: ICellProps): import("@emotion/react/jsx-runtime").JSX.Element;
+    defaultProps: Partial<ICellProps>;
+};
+export default Cell;

package/lib/components/cell/Cell.js

@@ -0,0 +1,56 @@
+import { jsx as _jsx, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
+import { useState, useEffect } from 'react';
+import { useDispatch } from "react-redux";
+import { CodeCell } from '@jupyterlab/cells';
+import { useJupyter } from './../../jupyter/JupyterContext';
+import LuminoAttached from '../../jupyter/lumino/LuminoAttached';
+import { cellActions } from './CellState';
+import CellAdapter from './CellAdapter';
+import '@jupyterlab/application/style/index.css';
+import '@jupyterlab/codemirror/style/index.css';
+import '@jupyterlab/cells/style/index.css';
+import '@jupyterlab/theme-light-extension/style/theme.css'; // This should be only index.css, looks like jupyterlab has a regression here...
+import '@jupyterlab/theme-light-extension/style/variables.css';
+import '@jupyterlab/completer/style/index.css';
+import './Cell.css';
+const DEFAULT_SOURCE = `from IPython.display import display
+
+for i in range(10):
+    display('String {} added to the DOM in separated DIV.'.format(i))`;
+export const Cell = (props) => {
+    const { source, autoStart } = props;
+    const { serviceManager } = useJupyter();
+    const dispatch = useDispatch();
+    const [adapter, setAdapter] = useState();
+    useEffect(() => {
+        if (serviceManager) {
+            const adapter = new CellAdapter(source, serviceManager);
+            dispatch(cellActions.update({ adapter }));
+            dispatch(cellActions.source(props.source));
+            adapter.codeCell.model.value.changed.connect((sender, changedArgs) => {
+                dispatch(cellActions.source(sender.text));
+            });
+            adapter.codeCell.outputArea.outputLengthChanged.connect((outputArea, outputsCount) => {
+                dispatch(cellActions.outputsCount(outputsCount));
+            });
+            adapter.sessionContext.initialize().then(() => {
+                if (autoStart) {
+                    const execute = CodeCell.execute(adapter.codeCell, adapter.sessionContext);
+                    execute.then((msg) => {
+                        dispatch(cellActions.update({
+                            kernelAvailable: true,
+                        }));
+                    });
+                }
+            });
+            setAdapter(adapter);
+        }
+    }, [source, serviceManager]);
+    return adapter ? _jsx(LuminoAttached, { children: adapter.panel }, void 0) : _jsx(_Fragment, { children: "Loading..." }, void 0);
+};
+Cell.defaultProps = {
+    source: DEFAULT_SOURCE,
+    autoStart: true,
+};
+export default Cell;
+//# sourceMappingURL=Cell.js.map

package/lib/components/cell/Cell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Cell.js","sourceRoot":"","sources":["../../../src/components/cell/Cell.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC5D,OAAO,cAAc,MAAM,qCAAqC,CAAC;AACjE,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,WAAW,MAAM,eAAe,CAAC;AAExC,OAAO,yCAAyC,CAAC;AACjD,OAAO,wCAAwC,CAAC;AAChD,OAAO,mCAAmC,CAAC;AAC3C,OAAO,mDAAmD,CAAC,CAAC,gFAAgF;AAC5I,OAAO,uDAAuD,CAAC;AAC/D,OAAO,uCAAuC,CAAC;AAE/C,OAAO,YAAY,CAAC;AAEpB,MAAM,cAAc,GAAG;;;sEAG+C,CAAA;AAOtE,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,KAAiB,EAAE,EAAE;IACxC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IACpC,MAAM,EAAE,cAAc,EAAE,GAAG,UAAU,EAAE,CAAC;IACxC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,EAAe,CAAC;IACtD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,cAAc,EAAE;YAClB,MAAM,OAAO,GAAG,IAAI,WAAW,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC;YACxD,QAAQ,CAAC,WAAW,CAAC,MAAM,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC,CAAC;YAC1C,QAAQ,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,MAAO,CAAC,CAAC,CAAC;YAC5C,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,WAAW,EAAE,EAAE;gBACnE,QAAQ,CAAC,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;YAC5C,CAAC,CAAC,CAAC;YACH,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,mBAAmB,CAAC,OAAO,CAAC,CAAC,UAAU,EAAE,YAAY,EAAE,EAAE;gBACnF,QAAQ,CAAC,WAAW,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC,CAAC;YACnD,CAAC,CAAC,CAAC;YACH,OAAO,CAAC,cAAc,CAAC,UAAU,EAAE,CAAC,IAAI,CAAC,GAAG,EAAE;gBAC5C,IAAI,SAAS,EAAE;oBACb,MAAM,OAAO,GAAG,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,QAAQ,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;oBAC3E,OAAO,CAAC,IAAI,CAAC,CAAC,GAA0C,EAAE,EAAE;wBAC1D,QAAQ,CAAC,WAAW,CAAC,MAAM,CAAC;4BAC1B,eAAe,EAAE,IAAI;yBACtB,CAAC,CAAC,CAAC;oBACN,CAAC,CAAC,CAAC;iBACJ;YACH,CAAC,CAAC,CAAC;YACH,UAAU,CAAC,OAAO,CAAC,CAAC;SACrB;IACH,CAAC,EAAE,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC;IAC7B,OAAO,OAAO,CAAC,CAAC,CAAC,KAAC,cAAc,cAAE,OAAO,CAAC,KAAK,WAAkB,CAAC,CAAC,CAAC,mDAAe,CAAA;AACrF,CAAC,CAAA;AAED,IAAI,CAAC,YAAY,GAAG;IAClB,MAAM,EAAE,cAAc;IACtB,SAAS,EAAE,IAAI;CACO,CAAC;AAEzB,eAAe,IAAI,CAAC"}

package/lib/components/cell/CellAdapter.d.ts

@@ -0,0 +1,15 @@
+import { BoxPanel } from '@lumino/widgets';
+import { SessionContext } from '@jupyterlab/apputils';
+import { CodeCell } from '@jupyterlab/cells';
+import { ServiceManager } from '@jupyterlab/services';
+export declare class CellAdapter {
+    private _codeCell;
+    private _cellPanel;
+    private _sessionContext;
+    constructor(source?: string, serviceManager?: ServiceManager);
+    get panel(): BoxPanel;
+    get codeCell(): CodeCell;
+    get sessionContext(): SessionContext;
+    execute: () => void;
+}
+export default CellAdapter;

package/lib/components/cell/CellAdapter.js

@@ -0,0 +1,133 @@
+import { BoxPanel, Widget } from '@lumino/widgets';
+import { SessionContext, Toolbar, ToolbarButton } from '@jupyterlab/apputils';
+import { CodeCellModel, CodeCell } from '@jupyterlab/cells';
+import { CodeMirrorMimeTypeService } from '@jupyterlab/codemirror';
+import { runIcon } from '@jupyterlab/ui-components';
+import { Completer, CompleterModel, CompletionHandler, ConnectorProxy, KernelCompleterProvider } from '@jupyterlab/completer';
+import { RenderMimeRegistry, standardRendererFactories as initialFactories } from '@jupyterlab/rendermime';
+import { SessionManager, KernelManager, KernelSpecManager } from '@jupyterlab/services';
+import { CommandRegistry } from '@lumino/commands';
+import { IPyWidgetsClassicManager } from "../../jupyter/ipywidgets/IPyWidgetsClassicManager";
+import { requireLoader } from "@jupyter-widgets/html-manager";
+import { WIDGET_MIMETYPE, WidgetRenderer } from "@jupyter-widgets/html-manager/lib/output_renderers";
+import CellCommands from './CellCommands';
+export class CellAdapter {
+    constructor(source, serviceManager) {
+        this.execute = () => {
+            CodeCell.execute(this._codeCell, this._sessionContext);
+        };
+        if (serviceManager === undefined || source === undefined) {
+            return;
+        }
+        this._cellPanel = new BoxPanel();
+        this._cellPanel.direction = 'top-to-bottom';
+        this._cellPanel.spacing = 0;
+        const serverSettings = serviceManager.serverSettings;
+        const kernelManager = new KernelManager({
+            serverSettings
+        });
+        const specsManager = new KernelSpecManager({
+            serverSettings
+        });
+        const sessionManager = new SessionManager({
+            serverSettings,
+            kernelManager
+        });
+        this._sessionContext = new SessionContext({
+            sessionManager,
+            specsManager,
+            name: 'Jupyter React'
+        });
+        const mimeService = new CodeMirrorMimeTypeService();
+        const commands = new CommandRegistry();
+        const useCapture = true;
+        document.addEventListener('keydown', event => {
+            commands.processKeydownEvent(event);
+        }, useCapture);
+        const rendermime = new RenderMimeRegistry({ initialFactories });
+        const iPyWidgetsClassicManager = new IPyWidgetsClassicManager({ loader: requireLoader });
+        rendermime.addFactory({
+            safe: false,
+            mimeTypes: [WIDGET_MIMETYPE],
+            createRenderer: (options) => new WidgetRenderer(options, iPyWidgetsClassicManager),
+        }, 0);
+        const codeCell = new CodeCell({
+            rendermime,
+            model: new CodeCellModel({
+                cell: {
+                    cell_type: 'code',
+                    source: source,
+                    metadata: {}
+                }
+            })
+        });
+        this._sessionContext.kernelChanged.connect((sender, arg) => {
+            const kernelConnection = arg.newValue;
+            iPyWidgetsClassicManager.registerWithKernel(kernelConnection);
+        });
+        this._codeCell = codeCell.initializeState();
+        this._codeCell.addClass('dla-JupyterCell');
+        this._sessionContext.kernelChanged.connect(() => {
+            var _a, _b;
+            void ((_b = (_a = this._sessionContext.session) === null || _a === void 0 ? void 0 : _a.kernel) === null || _b === void 0 ? void 0 : _b.info.then(info => {
+                const lang = info.language_info;
+                const mimeType = mimeService.getMimeTypeByLanguage(lang);
+                this._codeCell.model.mimeType = mimeType;
+            }));
+        });
+        this._sessionContext.kernelPreference = {
+            autoStartDefault: true,
+            name: 'python3',
+        };
+        const editor = this._codeCell.editor;
+        const model = new CompleterModel();
+        const completer = new Completer({ editor, model });
+        const timeout = 1000;
+        const provider = new KernelCompleterProvider();
+        const connector = new ConnectorProxy({ widget: this._codeCell, editor, session: this._sessionContext.session }, [provider], timeout);
+        const handler = new CompletionHandler({ completer, connector });
+        void this._sessionContext.ready.then(() => {
+            const provider = new KernelCompleterProvider();
+            handler.connector = new ConnectorProxy({ widget: this._codeCell, editor, session: this._sessionContext.session }, [provider], timeout);
+        });
+        handler.editor = editor;
+        CellCommands(commands, this._codeCell, this._sessionContext, handler);
+        completer.hide();
+        completer.addClass('jp-Completer-Cell');
+        Widget.attach(completer, document.body);
+        const toolbar = new Toolbar();
+        toolbar.addItem('spacer', Toolbar.createSpacerItem());
+        const runButton = new ToolbarButton({
+            icon: runIcon,
+            onClick: () => {
+                CodeCell.execute(this._codeCell, this._sessionContext);
+            },
+            tooltip: 'Run'
+        });
+        toolbar.addItem('run', runButton);
+        toolbar.addItem('interrupt', Toolbar.createInterruptButton(this._sessionContext));
+        toolbar.addItem('restart', Toolbar.createRestartButton(this._sessionContext));
+        // toolbar.addItem('name', Toolbar.createKernelNameItem(this._sessionContext));
+        toolbar.addItem('status', Toolbar.createKernelStatusItem(this._sessionContext));
+        this._cellPanel.addWidget(toolbar);
+        BoxPanel.setStretch(toolbar, 0);
+        this._cellPanel.addWidget(this._codeCell);
+        BoxPanel.setStretch(this._codeCell, 1);
+        window.addEventListener('resize', () => {
+            this._cellPanel.update();
+        });
+        this._codeCell.outputsScrolled = false;
+        this._codeCell.activate();
+    }
+    get panel() {
+        return this._cellPanel;
+    }
+    get codeCell() {
+        return this._codeCell;
+    }
+    get sessionContext() {
+        return this._sessionContext;
+    }
+}
+export default CellAdapter;
+//# sourceMappingURL=CellAdapter.js.map

package/lib/components/cell/CellAdapter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellAdapter.js","sourceRoot":"","sources":["../../../src/components/cell/CellAdapter.ts"],"names":[],"mappings":"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"}

package/lib/components/cell/CellCommands.d.ts

@@ -0,0 +1,6 @@
+import { CommandRegistry } from "@lumino/commands";
+import { CompletionHandler } from "@jupyterlab/completer";
+import { CodeCell } from '@jupyterlab/cells';
+import { SessionContext } from '@jupyterlab/apputils';
+export declare const CellCommands: (commandRegistry: CommandRegistry, codeCell: CodeCell, sessionContext: SessionContext, completerHandler: CompletionHandler) => void;
+export default CellCommands;

package/lib/components/cell/CellCommands.js

@@ -0,0 +1,38 @@
+import { CodeCell } from '@jupyterlab/cells';
+const cmdIds = {
+    invoke: "completer:invoke",
+    select: "completer:select",
+};
+export const CellCommands = (commandRegistry, codeCell, sessionContext, completerHandler) => {
+    commandRegistry.addCommand(cmdIds.invoke, {
+        label: "Completer: Invoke",
+        execute: () => completerHandler.invoke(),
+    });
+    commandRegistry.addCommand(cmdIds.select, {
+        label: "Completer: Select",
+        execute: () => completerHandler.completer.selectActive(),
+    });
+    commandRegistry.addCommand('run:cell', {
+        execute: () => CodeCell.execute(codeCell, sessionContext)
+    });
+    commandRegistry.addKeyBinding({
+        selector: '.jp-InputArea-editor.jp-mod-completer-enabled',
+        keys: ['Tab'],
+        command: cmdIds.invoke
+    });
+    commandRegistry.addKeyBinding({
+        selector: '.jp-InputArea-editor',
+        keys: ['Shift Enter'],
+        command: 'run:cell'
+    });
+    const bindings = [
+        {
+            selector: `.jp-InputArea-editor.jp-mod-completer-active`,
+            keys: ["Enter"],
+            command: cmdIds.select,
+        },
+    ];
+    bindings.map((binding) => commandRegistry.addKeyBinding(binding));
+};
+export default CellCommands;
+//# sourceMappingURL=CellCommands.js.map

package/lib/components/cell/CellCommands.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellCommands.js","sourceRoot":"","sources":["../../../src/components/cell/CellCommands.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAG7C,MAAM,MAAM,GAAG;IACb,MAAM,EAAE,kBAAkB;IAC1B,MAAM,EAAE,kBAAkB;CAC3B,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,CAC1B,eAAgC,EAChC,QAAkB,EAClB,cAA8B,EAC9B,gBAAmC,EAC7B,EAAE;IACR,eAAe,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE;QACxC,KAAK,EAAE,mBAAmB;QAC1B,OAAO,EAAE,GAAG,EAAE,CAAC,gBAAgB,CAAC,MAAM,EAAE;KACzC,CAAC,CAAC;IACH,eAAe,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE;QACxC,KAAK,EAAE,mBAAmB;QAC1B,OAAO,EAAE,GAAG,EAAE,CAAC,gBAAgB,CAAC,SAAS,CAAC,YAAY,EAAE;KACzD,CAAC,CAAC;IACH,eAAe,CAAC,UAAU,CAAC,UAAU,EAAE;QACrC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,EAAE,cAAc,CAAC;KAC1D,CAAC,CAAC;IACH,eAAe,CAAC,aAAa,CAAC;QAC5B,QAAQ,EAAE,+CAA+C;QACzD,IAAI,EAAE,CAAC,KAAK,CAAC;QACb,OAAO,EAAE,MAAM,CAAC,MAAM;KACvB,CAAC,CAAC;IACH,eAAe,CAAC,aAAa,CAAC;QAC5B,QAAQ,EAAE,sBAAsB;QAChC,IAAI,EAAE,CAAC,aAAa,CAAC;QACrB,OAAO,EAAE,UAAU;KACpB,CAAC,CAAC;IACH,MAAM,QAAQ,GAAG;QACf;YACE,QAAQ,EAAE,8CAA8C;YACxD,IAAI,EAAE,CAAC,OAAO,CAAC;YACf,OAAO,EAAE,MAAM,CAAC,MAAM;SACvB;KACF,CAAC;IACF,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC;AACpE,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/components/cell/CellState.d.ts

@@ -0,0 +1,22 @@
+import CellAdapter from "./CellAdapter";
+export interface ICellState {
+    source: string;
+    outputsCount: number;
+    kernelAvailable: boolean;
+    adapter?: CellAdapter;
+}
+export declare const cellInitialState: ICellState;
+export declare const selectCell: () => ICellState;
+export declare enum CellActionType {
+    SOURCE = "cell/SOURCE",
+    OUTPUTS_COUNT = "cell/OUTPUTS_COUNT",
+    EXECUTE = "cell/EXECUTE",
+    UPDATE = "cell/UPDATE"
+}
+export declare const cellActions: {
+    source: import("typescript-fsa").ActionCreator<string>;
+    outputsCount: import("typescript-fsa").ActionCreator<number>;
+    execute: import("typescript-fsa").ActionCreator<void>;
+    update: import("typescript-fsa").ActionCreator<Partial<ICellState>>;
+};
+export declare const cellReducer: import("typescript-fsa-reducers").ReducerBuilder<ICellState, ICellState>;

package/lib/components/cell/CellState.js

@@ -0,0 +1,46 @@
+import actionCreatorFactory from "typescript-fsa";
+import { useSelector } from "react-redux";
+import { reducerWithInitialState } from "typescript-fsa-reducers";
+export const cellInitialState = {
+    source: '',
+    outputsCount: -1,
+    kernelAvailable: false,
+};
+/* Selectors */
+export const selectCell = () => useSelector((state) => {
+    if (state.cell) {
+        return state.cell;
+    }
+    return cellInitialState;
+});
+/* Actions */
+export var CellActionType;
+(function (CellActionType) {
+    CellActionType["SOURCE"] = "cell/SOURCE";
+    CellActionType["OUTPUTS_COUNT"] = "cell/OUTPUTS_COUNT";
+    CellActionType["EXECUTE"] = "cell/EXECUTE";
+    CellActionType["UPDATE"] = "cell/UPDATE";
+})(CellActionType || (CellActionType = {}));
+const actionCreator = actionCreatorFactory('jupyterReact');
+export const cellActions = {
+    source: actionCreator(CellActionType.SOURCE),
+    outputsCount: actionCreator(CellActionType.OUTPUTS_COUNT),
+    execute: actionCreator(CellActionType.EXECUTE),
+    update: actionCreator(CellActionType.UPDATE),
+};
+/* Reducers */
+export const cellReducer = reducerWithInitialState(cellInitialState)
+    .case(cellActions.execute, (state, payload) => {
+    if (state.adapter) {
+        state.adapter.execute();
+    }
+    return Object.assign({}, state);
+})
+    .case(cellActions.source, (state, source) => {
+    return Object.assign(Object.assign({}, state), { source });
+})
+    .case(cellActions.update, (state, partial) => (Object.assign(Object.assign({}, state), partial)))
+    .case(cellActions.outputsCount, (state, outputsCount) => {
+    return Object.assign(Object.assign({}, state), { outputsCount });
+});
+//# sourceMappingURL=CellState.js.map

package/lib/components/cell/CellState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellState.js","sourceRoot":"","sources":["../../../src/components/cell/CellState.ts"],"names":[],"mappings":"AAAA,OAAO,oBAAoB,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,uBAAuB,EAAE,MAAM,yBAAyB,CAAC;AAYlE,MAAM,CAAC,MAAM,gBAAgB,GAAe;IAC1C,MAAM,EAAE,EAAE;IACV,YAAY,EAAE,CAAC,CAAC;IAChB,eAAe,EAAE,KAAK;CACvB,CAAA;AAED,eAAe;AAEf,MAAM,CAAC,MAAM,UAAU,GAAG,GAAe,EAAE,CACzC,WAAW,CAAC,CAAC,KAAiB,EAAE,EAAE;IAChC,IAAK,KAAa,CAAC,IAAI,EAAE;QACvB,OAAQ,KAAa,CAAC,IAAI,CAAC;KAC5B;IACD,OAAO,gBAAgB,CAAC;AAC1B,CAAC,CACF,CAAC;AAEF,aAAa;AAEb,MAAM,CAAN,IAAY,cAKX;AALD,WAAY,cAAc;IACxB,wCAAsB,CAAA;IACtB,sDAAoC,CAAA;IACpC,0CAAwB,CAAA;IACxB,wCAAsB,CAAA;AACxB,CAAC,EALW,cAAc,KAAd,cAAc,QAKzB;AAED,MAAM,aAAa,GAAG,oBAAoB,CAAC,cAAc,CAAC,CAAC;AAE3D,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,MAAM,EAAE,aAAa,CACnB,cAAc,CAAC,MAAM,CACtB;IACD,YAAY,EAAE,aAAa,CACzB,cAAc,CAAC,aAAa,CAC7B;IACD,OAAO,EAAE,aAAa,CACpB,cAAc,CAAC,OAAO,CACvB;IACD,MAAM,EAAE,aAAa,CACnB,cAAc,CAAC,MAAM,CACtB;CACF,CAAA;AAED,cAAc;AAEd,MAAM,CAAC,MAAM,WAAW,GAAG,uBAAuB,CAAC,gBAAgB,CAAC;KACjE,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE,CAAC,KAAiB,EAAE,OAAa,EAAE,EAAE;IAC9D,IAAI,KAAK,CAAC,OAAO,EAAE;QACjB,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;KACzB;IACD,yBACK,KAAK,EACT;AACH,CAAC,CAAC;KACD,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE,CAAC,KAAiB,EAAE,MAAc,EAAE,EAAE;IAC9D,uCACK,KAAK,KACR,MAAM,IACP;AACH,CAAC,CAAC;KACD,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE,CAAC,KAAiB,EAAE,OAA4B,EAAE,EAAE,CAAC,iCAC1E,KAAK,GACL,OAAO,EACV,CAAC;KACF,IAAI,CAAC,WAAW,CAAC,YAAY,EAAE,CAAC,KAAiB,EAAE,YAAoB,EAAE,EAAE;IAC1E,uCACK,KAAK,KACR,YAAY,IACb;AACH,CAAC,CACF,CAAC"}

package/lib/components/codemirror/CodeMirrorEditor.d.ts

@@ -0,0 +1,14 @@
+import Kernel from './../../jupyter/services/kernel/Kernel';
+import OutputAdapter from './../outputs/OutputAdapter';
+export declare const CodeMirrorEditor: (props: {
+    code: string;
+    codePre?: string | undefined;
+    outputAdapter: OutputAdapter;
+    kernel: Kernel;
+    autoRun: boolean;
+    disableRun: boolean;
+    sourceId: string;
+    toolbarPosition: 'up' | 'middle' | 'none';
+    insertText?: ((payload?: any) => string) | undefined;
+}) => import("@emotion/react/jsx-runtime").JSX.Element;
+export default CodeMirrorEditor;

package/lib/components/codemirror/CodeMirrorEditor.js

@@ -0,0 +1,110 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { useState, useRef, useEffect } from 'react';
+import { useDispatch } from 'react-redux';
+import { basicSetup } from 'codemirror';
+import { EditorState, Compartment } from '@codemirror/state';
+import { keymap, EditorView } from '@codemirror/view';
+import { python } from '@codemirror/lang-python';
+import codeMirrorTheme from './CodeMirrorTheme';
+import OutputToolbar from './../outputs/OutputToolbar';
+import { selectDataset, selectJupyterSetSource, outputActions } from './../outputs/OutputState';
+export const CodeMirrorEditor = (props) => {
+    const { code, codePre, outputAdapter, autoRun, disableRun, sourceId, toolbarPosition, insertText, kernel } = props;
+    const dispatch = useDispatch();
+    const [view, setView] = useState();
+    const dataset = selectDataset(sourceId);
+    const setSource = selectJupyterSetSource(sourceId);
+    const editorDiv = useRef();
+    const setEditorSource = (source) => {
+        if (view && source) {
+            view.dispatch({
+                changes: {
+                    from: 0,
+                    to: view.state.doc.length,
+                    insert: source
+                }
+            });
+        }
+    };
+    const doInsertText = (payload) => {
+        if (view && insertText) {
+            view.dispatch({
+                changes: {
+                    from: 0,
+                    insert: insertText(payload)
+                }
+            });
+        }
+    };
+    const executeCode = (editorView, code) => {
+        if (disableRun) {
+            alert('Code execution is disabled for this snippet editor. There should be a button on the page to run this snippet editor.');
+            return true;
+        }
+        if (code) {
+            outputAdapter.execute(code);
+        }
+        else {
+            outputAdapter.execute(editorView.state.doc.toString());
+        }
+        return true;
+    };
+    useEffect(() => {
+        dispatch(outputActions.source({
+            sourceId,
+            source: code,
+        }));
+        let editorView;
+        const language = new Compartment();
+        const keyBinding = [
+            {
+                key: 'Shift-Enter',
+                run: () => executeCode(editorView),
+                preventDefault: true,
+            },
+        ];
+        const state = EditorState.create({
+            doc: code,
+            extensions: [
+                basicSetup,
+                language.of(python()),
+                EditorView.lineWrapping,
+                keymap.of([...keyBinding]),
+                codeMirrorTheme,
+                EditorView.updateListener.of((viewUpdate) => {
+                    if (viewUpdate.docChanged) {
+                        const source = viewUpdate.state.doc.toString();
+                        dispatch(outputActions.source({
+                            sourceId,
+                            source,
+                        }));
+                    }
+                })
+            ],
+        });
+        editorView = new EditorView({
+            state: state,
+            parent: editorDiv.current,
+        });
+        setView(editorView);
+        if (autoRun) {
+            executeCode(editorView);
+        }
+        return () => {
+            editorView.destroy();
+        };
+    }, [code]);
+    useEffect(() => {
+        doInsertText(dataset === null || dataset === void 0 ? void 0 : dataset.dataset);
+    }, [dataset]);
+    useEffect(() => {
+        setEditorSource(setSource === null || setSource === void 0 ? void 0 : setSource.source);
+    }, [setSource]);
+    return (_jsxs(_Fragment, { children: [toolbarPosition === 'up' &&
+                _jsx(OutputToolbar, { editorView: view, codePre: codePre, kernel: kernel, outputAdapter: outputAdapter, executeCode: executeCode }, void 0),
+            _jsx("div", { ref: editorDiv }, void 0),
+            toolbarPosition === 'middle' &&
+                _jsx(OutputToolbar, { editorView: view, codePre: codePre, kernel: kernel, outputAdapter: outputAdapter, executeCode: executeCode }, void 0)] }, void 0));
+};
+export default CodeMirrorEditor;
+//# sourceMappingURL=CodeMirrorEditor.js.map

package/lib/components/codemirror/CodeMirrorEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CodeMirrorEditor.js","sourceRoot":"","sources":["../../../src/components/codemirror/CodeMirrorEditor.tsx"],"names":[],"mappings":"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"}

package/lib/components/codemirror/CodeMirrorTheme.d.ts

@@ -0,0 +1,3 @@
+import { Extension } from "@codemirror/state";
+export declare const codeMirrorTheme: Extension;
+export default codeMirrorTheme;

package/lib/components/codemirror/CodeMirrorTheme.js

@@ -0,0 +1,21 @@
+import { EditorView } from '@codemirror/view';
+const theme = EditorView.theme({
+    "&": {
+        fontSize: "9pt",
+        border: "1px solid #c0c0c0"
+    },
+    ".cm-content": {
+        fontFamily: "Menlo, Monaco, Lucida Console, monospace",
+        minHeight: "10px"
+    },
+    ".cm-gutters": {
+        minHeight: "10px"
+    },
+    ".cm-scroller": {
+        overflow: "auto",
+        //    maxHeight: "600px"
+    }
+}, { dark: false });
+export const codeMirrorTheme = [theme];
+export default codeMirrorTheme;
+//# sourceMappingURL=CodeMirrorTheme.js.map