diff --git a/examples/cra/src/examples/AllExamples.tsx b/examples/cra/src/examples/AllExamples.tsx
index 96964f52..a7c43fca 100755
--- a/examples/cra/src/examples/AllExamples.tsx
+++ b/examples/cra/src/examples/AllExamples.tsx
@@ -100,7 +100,9 @@ const AllExample = () => {
-
+
diff --git a/examples/cra/src/examples/GalleryExample.tsx b/examples/cra/src/examples/GalleryExample.tsx
index ef7faa52..9543fb94 100755
--- a/examples/cra/src/examples/GalleryExample.tsx
+++ b/examples/cra/src/examples/GalleryExample.tsx
@@ -231,7 +231,6 @@ const GalleryExample = () => {
>
diff --git a/examples/cra/src/examples/NotebookExample.tsx b/examples/cra/src/examples/NotebookExample.tsx
index 2ee97d5f..b3d37b0f 100755
--- a/examples/cra/src/examples/NotebookExample.tsx
+++ b/examples/cra/src/examples/NotebookExample.tsx
@@ -15,7 +15,7 @@ const Example = () => {
-
+
);
};
diff --git a/examples/cra/src/examples/NotebookSidebarExample.tsx b/examples/cra/src/examples/NotebookSidebarExample.tsx
index f9c80e15..86dc9d28 100755
--- a/examples/cra/src/examples/NotebookSidebarExample.tsx
+++ b/examples/cra/src/examples/NotebookSidebarExample.tsx
@@ -12,9 +12,8 @@ export default function NotebookSidebarComponent() {
diff --git a/packages/react/src/components/notebook/Notebook.tsx b/packages/react/src/components/notebook/Notebook.tsx
index d8dfa889..af77a12d 100644
--- a/packages/react/src/components/notebook/Notebook.tsx
+++ b/packages/react/src/components/notebook/Notebook.tsx
@@ -22,6 +22,7 @@ export type INotebookProps = {
cellSidebarMargin: number;
height?: string;
ipywidgets: 'classic' | 'lab';
+ externalIPyWidgets?: string[];
kernel?: Kernel;
maxHeight?: string;
nbformat?: INotebookContent;
diff --git a/packages/react/src/components/notebook/NotebookAdapter.ts b/packages/react/src/components/notebook/NotebookAdapter.ts
index 4545a1cf..3f2003a9 100755
--- a/packages/react/src/components/notebook/NotebookAdapter.ts
+++ b/packages/react/src/components/notebook/NotebookAdapter.ts
@@ -33,41 +33,44 @@ const FALLBACK_PATH = "ping.ipynb"
export class NotebookAdapter {
private _boxPanel: BoxPanel;
- private _notebookPanel?: NotebookPanel;
- private _uid: string;
- private _serviceManager: ServiceManager;
private _commandRegistry: CommandRegistry;
- private _path?: string;
- private _nbformat?: INotebookContent;
- private _tracker?: NotebookTracker;
- private _kernel: Kernel;
- private _store?: Store;
- private _ipywidgets: 'lab' | 'classic';
+ private _context?: Context;
+ private _externalIPyWidgets?: string[];
private _iPyWidgetsClassicManager?: IPyWidgetsManager;
- private _CellSidebar?: (props: any) => JSX.Element;
+ private _ipywidgets: 'lab' | 'classic';
+ private _kernel: Kernel;
+ private _nbformat?: INotebookContent;
private _nbgrader: boolean;
+ private _notebookPanel?: NotebookPanel;
+ private _path?: string;
private _readOnly: boolean;
- private _context?: Context;
private _renderers: IRenderMime.IRendererFactory[];
private _rendermime?: RenderMimeRegistry;
+ private _serviceManager: ServiceManager;
+ private _store?: Store;
+ private _tracker?: NotebookTracker;
+ private _uid: string;
+ private _CellSidebar?: (props: any) => JSX.Element;
constructor(props: INotebookProps, store: any, serviceManager: ServiceManager) {
- this._path = props.path;
- this._store = store;
- this._serviceManager = serviceManager;
+ this._externalIPyWidgets = props.externalIPyWidgets;
+ this._ipywidgets = props.ipywidgets;
+ this._kernel = props.kernel!;
this._nbformat = props.nbformat;
- this._CellSidebar = props.CellSidebar;
this._nbgrader = props.nbgrader;
+ this._path = props.path;
this._readOnly = props.readOnly;
- this._ipywidgets = props.ipywidgets;
- this._kernel = props.kernel!;
- this._uid = props.uid;
this._renderers = props.renderers;
+ this._serviceManager = serviceManager;
+ this._store = store;
+ this._uid = props.uid;
+ this._CellSidebar = props.CellSidebar;
+ //
this._boxPanel = new BoxPanel();
this._boxPanel.addClass('dla-Jupyter-Notebook');
this._boxPanel.spacing = 0;
this._commandRegistry = new CommandRegistry();
-// this.loadNotebook = this.loadNotebook.bind(this);
+ //
this.loadNotebook();
}
@@ -250,7 +253,9 @@ export class NotebookAdapter {
break;
}
case 'lab': {
- externalIPyWidgetsPlugin(this._context, this._tracker)
+ if (this._externalIPyWidgets) {
+ externalIPyWidgetsPlugin(this._context, this._tracker, this._externalIPyWidgets);
+ }
break;
}
}
diff --git a/packages/react/src/examples/Bokeh.tsx b/packages/react/src/examples/Bokeh.tsx
index 4187eb5a..d071436e 100644
--- a/packages/react/src/examples/Bokeh.tsx
+++ b/packages/react/src/examples/Bokeh.tsx
@@ -10,11 +10,11 @@ const NotebookExample = () => (
)
diff --git a/packages/react/src/examples/Bqplot.tsx b/packages/react/src/examples/Bqplot.tsx
index 0144e5ad..08af9b43 100644
--- a/packages/react/src/examples/Bqplot.tsx
+++ b/packages/react/src/examples/Bqplot.tsx
@@ -6,15 +6,16 @@ import CellSidebarDefault from "../components/notebook/cell/sidebar/CellSidebarD
import "./../../style/index.css";
-const NotebookExample = () => (
+const Bqplot = () => (
)
@@ -24,5 +25,5 @@ document.body.appendChild(div);
const root = createRoot(div)
root.render(
-
+
);
diff --git a/packages/react/src/examples/Matplotlib.tsx b/packages/react/src/examples/Matplotlib.tsx
index 94c23933..790fb0a3 100644
--- a/packages/react/src/examples/Matplotlib.tsx
+++ b/packages/react/src/examples/Matplotlib.tsx
@@ -9,12 +9,12 @@ import notebook from "./samples/Matplotlib.ipynb.json";
import "./../../style/index.css";
-
const Matplotlib = () => (
, notebookTracker: NotebookTracker) => {
- requireLoader("jupyter-matplotlib", "0.11.3").then((mod) => {
- const exports = { ...mod };
- delete exports['MODULE_NAME'];
- delete exports['MODULE_VERSION'];
- const data = {
- name: mod.MODULE_NAME,
- version: mod.MODULE_VERSION,
- exports,
- };
- WIDGET_REGISTRY.push(data);
- notebookTracker.forEach((notebookPanel) => {
- const widgetManager = Private.widgetManagerProperty.get(context);
- widgetManager!.register(data);
- registerWidgetManager(
- notebookPanel.context,
- notebookPanel.content.rendermime,
- chain(
- widgetRenderers(notebookPanel.content),
- // outputViews(app, panel.context.path)
- )
- );
- bindUnhandledIOPubMessageSignal(notebookPanel, null);
+export const externalIPyWidgetsPlugin = (context: Context, notebookTracker: NotebookTracker, ipywidgets: string[]) => {
+ const loadIPyWidget = (name: string, version: string ) => {
+ requireLoader(name, version).then((mod) => {
+ const exports = { ...mod };
+ const data = {
+ name,
+ version,
+ exports,
+ };
+ WIDGET_REGISTRY.push(data);
+ notebookTracker.forEach((notebookPanel) => {
+ const widgetManager = Private.widgetManagerProperty.get(context);
+ widgetManager!.register(data);
+ registerWidgetManager(
+ notebookPanel.context,
+ notebookPanel.content.rendermime,
+ chain(
+ widgetRenderers(notebookPanel.content),
+ // outputViews(app, panel.context.path)
+ )
+ );
+ bindUnhandledIOPubMessageSignal(notebookPanel, null);
+ });
});
+ };
+ ipywidgets.forEach(ipywidget => {
+ const splits = ipywidget.split(":");
+ loadIPyWidget(splits[0], splits[1]);
});
}
diff --git a/packages/react/webpack.config.js b/packages/react/webpack.config.js
index 7fce7de5..ac2de7b2 100644
--- a/packages/react/webpack.config.js
+++ b/packages/react/webpack.config.js
@@ -13,7 +13,7 @@ function shim(regExp) {
const ENTRY = process.env.BUILD_APP == "true" ?
"./src/app/App"
:
- "./src/examples/Matplotlib";
+ "./src/examples/Bqplot";
const IS_JUPYTER_SERVER_LOCAL = process.env.LOCAL_JUPYTER_SERVER == "true";
const indexPage = IS_JUPYTER_SERVER_LOCAL ? "index-local.html" : "index.html";