Skip to main content

A reusable Jupyter Widget

Project description

anywidget

create custom jupyter widgets without tooling hell

PyPI License Open In Colab

pip install anywidget

usage

import anywidget
import traitlets

ESM = """
export function render(view) {
    function setCount(update) {
        p.innerText = update;
        view.model.set("count", update);
        view.model.save_changes();
    }
    let root = document.createElement("div");
    Object.assign(root.style, {
        display: "grid",
        gridAutoFlow: "column",
        textAlign: "center",
    })
    let p = Object.assign(document.createElement("p"), {
        innerText: view.model.get("count") ?? 0,
    });
    let decrement = Object.assign(document.createElement("button"), {
        innerText: "-",
        onclick: () => setCount(view.model.get("count") - 1),
    });
    let increment = Object.assign(document.createElement("button"), {
        innerText: "+",
        onclick: () => setCount(view.model.get("count") + 1),
    });
    root.appendChild(decrement);
    root.appendChild(p);
    root.appendChild(increment);
    view.el.appendChild(root);
}
"""

# Alternatively, a URL
# ESM = "http://localhost:5173/index.js"

class CounterWidget(anywidget.AnyWidget):
    _module = traitlets.Unicode(ESM).tag(sync=True) # required, must be ESM
    count = traitlets.Int(0).tag(sync=True)
Counter with increment and decrement buttons

why

The official widget cookiecutter templates include complicated build configuration to ensure widgets may be published and correctly installed in a variety of notebook environments. I want to make widgets quickly and the overhead to create and maintain a project derived from one of these templates is challenging.

anywidget is an experiment to enable the creation of custom widgets via simple Python modules – no complicated build steps or bundling.

how

Widgets are defined by combining an ECMAScript Module with a Python class which derives from anywidget.AnyWidget. The provided ECMAScript Module must include a named export called render to render the corresponding view. You can add and sync new properties by adding traitlets in your derived Python classes and subscribing and publishing changes via view.model in the client render function.

Note Your JS code must be vaid ESM. You can import dependencies from a CDN (e.g., import * as d3 from "https://esm.sh/d3") or use a bundler to target ESM.

development

pip install -e .

If you are using the classic Jupyter Notebook you need to install the nbextension:

jupyter nbextension install --py --symlink --sys-prefix anywidget
jupyter nbextension enable --py --sys-prefix anywidget

Note for developers:

  • the -e pip option allows one to modify the Python code in-place. Restart the kernel in order to see the changes.
  • the --symlink argument on Linux or OS X allows one to modify the JavaScript code in-place. This feature is not available with Windows.

For developing with JupyterLab:

jupyter labextension develop --overwrite anywidget

release

npm version [major|minor|patch]
git tag -a vX.X.X -m "vX.X.X"
git push --follow-tags

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

anywidget-0.0.1.tar.gz (11.8 kB view details)

Uploaded Source

Built Distribution

anywidget-0.0.1-py3-none-any.whl (19.6 kB view details)

Uploaded Python 3

File details

Details for the file anywidget-0.0.1.tar.gz.

File metadata

  • Download URL: anywidget-0.0.1.tar.gz
  • Upload date:
  • Size: 11.8 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/4.0.1 CPython/3.10.8

File hashes

Hashes for anywidget-0.0.1.tar.gz
Algorithm Hash digest
SHA256 340d624301fce9e5324396b6299ad549f8a2e4f7a613c7b15043aca0b59c7f85
MD5 c1c8d50730d7f9b9939ca659ac3926a9
BLAKE2b-256 70d7b08cbb02ba593acfb08e1280a18efcba02579323d3f64d719b8997c922fb

See more details on using hashes here.

File details

Details for the file anywidget-0.0.1-py3-none-any.whl.

File metadata

  • Download URL: anywidget-0.0.1-py3-none-any.whl
  • Upload date:
  • Size: 19.6 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/4.0.1 CPython/3.10.8

File hashes

Hashes for anywidget-0.0.1-py3-none-any.whl
Algorithm Hash digest
SHA256 3adbfd20ddb610e8ede32d030555753ae19ead1edb5d47ee75e23a329567de1b
MD5 bae2b236fd88e0e31ef2eaf148b9cb67
BLAKE2b-256 9d2804172c60031d4686072ea481c27271c179fc2ee88e9746ddbc6da86185e6

See more details on using hashes here.

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page