Skip to main content

A client for IDOM implemented using Jupyter widgets

Project description

idom-jupyter

A client for IDOM implemented using Jupyter widgets

Try It Now!

Check out some live examples by clicking the badge below:

Binder

Getting Started

To install use pip:

pip install idom_jupyter

Then, before anything else, do one of the following:

  1. At the top of your notebook run

    import idom_jupyter
    
  2. Register idom_jupyter as a permanant IPython extension in your config file:

    c.InteractiveShellApp.extensions = [
        'idom_jupyter'
    ]
    

Usage

Once you're done getting started, you can author and display IDOM layouts natively in your Jupyter Notebook:

import idom

@idom.component
def ClickCount():
    count, set_count = idom.hooks.use_state(0)
    return idom.html.button(
        {"onClick": lambda event: set_count(count + 1)},
        [f"Click count: {count}"],
    )

ClickCount()

You can also turn an idom element constructor into one that returns an ipywidget with the idom_juptyer.widgetize function. This is useful if you wish to use IDOM in combination with other Jupyter Widgets as in the following example:

ClickCountWidget = idom_jupyter.widgetize(ClickCount)
ipywidgets.Box(
    [
        ClickCountWidget(),
        ClickCountWidget(),
    ]
)

Alternatively just wrap an idom element instance in an idom_jupyter.LayoutWidget:

ipywidgets.Box(
    [
        idom_jupyter.LayoutWidget(ClickCount()),
        idom_jupyter.LayoutWidget(ClickCount()),
    ]
)

For a more detailed introduction check out this live demo here:

Binder

Development Installation

For a development installation (requires Node.js and Yarn version 1),

$ git clone https://github.com/idom-team/idom-jupyter.git
$ cd idom-jupyter
$ pip install -e .
$ jupyter nbextension install --py --symlink --overwrite --sys-prefix idom_jupyter
$ jupyter nbextension enable --py --sys-prefix idom_jupyter

When actively developing your extension for JupyterLab, run the command:

$ jupyter labextension develop --overwrite idom_jupyter

Then you need to rebuild the JS when you make a code change:

$ cd js
$ yarn run build

You then need to refresh the JupyterLab page when your javascript changes.

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

idom_jupyter-0.7.7.tar.gz (210.4 kB view details)

Uploaded Source

Built Distribution

idom_jupyter-0.7.7-py3-none-any.whl (155.9 kB view details)

Uploaded Python 3

File details

Details for the file idom_jupyter-0.7.7.tar.gz.

File metadata

  • Download URL: idom_jupyter-0.7.7.tar.gz
  • Upload date:
  • Size: 210.4 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/4.0.1 CPython/3.10.6

File hashes

Hashes for idom_jupyter-0.7.7.tar.gz
Algorithm Hash digest
SHA256 56386a2e072dcdc004c07fcece8fdfc2a5647fdc27a6539f32b8a4cf61641485
MD5 8653e4c97793c772cb74b24d19e3a6de
BLAKE2b-256 653ef2c32f0ac8372b3be41582503bac2c8f739a4d860e63e299c587ca266afc

See more details on using hashes here.

Provenance

File details

Details for the file idom_jupyter-0.7.7-py3-none-any.whl.

File metadata

  • Download URL: idom_jupyter-0.7.7-py3-none-any.whl
  • Upload date:
  • Size: 155.9 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/4.0.1 CPython/3.10.6

File hashes

Hashes for idom_jupyter-0.7.7-py3-none-any.whl
Algorithm Hash digest
SHA256 2af11083de1d9147290318c029f22b20d407300aab2a9db59b521725f271923a
MD5 43c37dfb11fba857a082b093fe9f9c86
BLAKE2b-256 64d9803b88eb01e8dcd9d0597a3453e27221545e619a1ad1073008c68653bb64

See more details on using hashes here.

Provenance

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