custom jupyter widgets made easy
- 🛠️ create widgets without complicated cookiecutter templates
- 📚 publish to PyPI like any other Python package
- 🤖 prototype within
.ipynb
or.py
files - 🚀 run in Jupyter, JupyterLab, Google Colab, VSCode, and more
- ⚡ develop with instant HMR, like modern web frameworks
Learn more in the Jupyter blog.
anywidget is available on PyPI and
may be installed with pip
:
pip install "anywidget[dev]"
It is also available on conda-forge. If you have Anaconda or Miniconda installed on your computer, you can install anywidget with the following command:
conda install -c conda-forge anywidget
import anywidget
import traitlets
class CounterWidget(anywidget.AnyWidget):
# Widget front-end JavaScript code
_esm = """
export function render({ model, el }) {
let button = document.createElement("button");
button.innerHTML = `count is ${model.get("value")}`;
button.addEventListener("click", () => {
model.set("value", model.get("value") + 1);
model.save_changes();
});
model.on("change:value", () => {
button.innerHTML = `count is ${model.get("value")}`;
});
el.appendChild(button);
}
"""
# Stateful property that can be accessed by JavaScript & Python
value = traitlets.Int(0).tag(sync=True)
Front-end code can also live in separate files (recommend):
import pathlib
import anywidget
import traitlets
class CounterWidget(anywidget.AnyWidget):
_esm = pathlib.Path("index.js")
_css = pathlib.Path("styles.css")
value = traitlets.Int(0).tag(sync=True)
Read the documentation to learn more.
See CONTRIBUTING.md for information on how to develop anywidget locally.