Skip to content

Latest commit

 

History

History
59 lines (38 loc) · 2.68 KB

README.md

File metadata and controls

59 lines (38 loc) · 2.68 KB

@nteract/jupyter-widgets

Note: The implementation of @nteract/jupyter-widgets is currently in-progress. Please follow this issue.

This package exposes a React component for rendering ipywidgets into a notebook application. It also exposes components for building custom widget renderers.

Installation

$ yarn add @nteract/jupyter-widgets

$ npm install --save @nteract/jupyter-widgets

Usage

import WidgetDisplay from "@nteract/jupyter-widgets";

export default class MyNotebookApp extends ReactComponent {
  render() {
    return <WidgetDisplay data={{ model_id: "widget-model-guid" }} />;
  }
}

Documentation

The jupyter-widgets package supports two types of widgets:

The WidgetDisplay component has an additional prop named customWidgetLoader to provide custom loaders for fetching 3rd party widgets. A reference implementation for a custom loader which serves as the default for this package can be found in widget-loader.ts.

customWidgetLoader?: (moduleName: string, moduleVersion: string) => Promise<any>;

Custom Widgets

Since custom widgets are hosted on CDN, we set https://unkpg.com as our default CDN Base URL. The default base URL can be overriden by specifying another URL via the HTML attribute "data-jupyter-widgets-cdn" on any script tag of the page.

For instance if your js bundle is loaded as bundle.js on your page and you wanted to set jsdelivr as your default CDN url for custom widgets, you could do the following:

<script data-jupyter-widgets-cdn="https://cdn.jsdelivr.net/npm" src="bundle.js"></script>

Note: Custom widgets are fetched and loaded using the requireJS library. Please ensure that the library is loaded on your page and that the require and define APIs are available on the window object. We attempt to detect the presence of these APIs and emit a warning that custom widgets won't work when requirejs is missing.

Support

If you experience an issue while using this package or have a feature request, please file an issue on the issue board and add the pkg:jupyter-widgets label.

License

BSD-3-Clause