# idom-jupyter
A client for [IDOM](https://github.com/idom-team/idom) implemented using Jupyter widgets
## Try It Now!
Check out some live examples by clicking the badge below:
<a href="https://mybinder.org/v2/gh/idom-team/idom-jupyter/main?filepath=notebooks%2Fintroduction.ipynb">
<img alt="Binder" height="25px" src="https://mybinder.org/badge_logo.svg" />
</a>
## 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
```python
import idom_jupyter
```
2. Register `idom_jupyter` as a permanant IPython extension in [your config file](https://ipython.readthedocs.io/en/stable/config/intro.html#introduction-to-ipython-configuration):
```python
c.InteractiveShellApp.extensions = [
'idom_jupyter'
]
```
## Usage
Once you're done [getting started](#getting-started), you can author and display IDOM
layouts natively in your Jupyter Notebook:
```python
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:
```python
ClickCountWidget = idom_jupyter.widgetize(ClickCount)
ipywidgets.Box(
[
ClickCountWidget(),
ClickCountWidget(),
]
)
```
Alternatively just wrap an `idom` element instance in an `idom_jupyter.LayoutWidget`:
```python
ipywidgets.Box(
[
idom_jupyter.LayoutWidget(ClickCount()),
idom_jupyter.LayoutWidget(ClickCount()),
]
)
```
For a more detailed introduction check out this live demo here:
<a href="https://mybinder.org/v2/gh/idom-team/idom-jupyter/main?filepath=notebooks%2Fintroduction.ipynb">
<img alt="Binder" height="25px" src="https://mybinder.org/badge_logo.svg" />
</a>
## Development Installation
For a development installation (requires [Node.js](https://nodejs.org) and [Yarn version 1](https://classic.yarnpkg.com/)),
$ 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.
Raw data
{
"_id": null,
"home_page": "https://github.com/idom-team/idom-jupyter",
"name": "idom-jupyter",
"maintainer": "",
"docs_url": null,
"requires_python": ">=3.7",
"maintainer_email": "",
"keywords": "ipython,jupyter,widgets",
"author": "Ryan Morshead",
"author_email": "ryan.morshead@gmail.com",
"download_url": "https://files.pythonhosted.org/packages/65/3e/f2c32f0ac8372b3be41582503bac2c8f739a4d860e63e299c587ca266afc/idom_jupyter-0.7.7.tar.gz",
"platform": null,
"description": "# idom-jupyter\n\nA client for [IDOM](https://github.com/idom-team/idom) implemented using Jupyter widgets\n\n## Try It Now!\n\nCheck out some live examples by clicking the badge below:\n\n<a href=\"https://mybinder.org/v2/gh/idom-team/idom-jupyter/main?filepath=notebooks%2Fintroduction.ipynb\">\n <img alt=\"Binder\" height=\"25px\" src=\"https://mybinder.org/badge_logo.svg\" />\n</a>\n\n## Getting Started\n\nTo install use `pip`:\n\n```\npip install idom_jupyter\n```\n\nThen, before anything else, do one of the following:\n\n1. At the top of your notebook run\n\n ```python\n import idom_jupyter\n ```\n\n2. Register `idom_jupyter` as a permanant IPython extension in [your config file](https://ipython.readthedocs.io/en/stable/config/intro.html#introduction-to-ipython-configuration):\n\n ```python\n c.InteractiveShellApp.extensions = [\n 'idom_jupyter'\n ]\n ```\n\n## Usage\n\nOnce you're done [getting started](#getting-started), you can author and display IDOM\nlayouts natively in your Jupyter Notebook:\n\n```python\nimport idom\n\n@idom.component\ndef ClickCount():\n count, set_count = idom.hooks.use_state(0)\n return idom.html.button(\n {\"onClick\": lambda event: set_count(count + 1)},\n [f\"Click count: {count}\"],\n )\n\nClickCount()\n```\n\nYou can also turn an `idom` element constructor into one that returns an `ipywidget` with\nthe `idom_juptyer.widgetize` function. This is useful if you wish to use IDOM in combination\nwith other Jupyter Widgets as in the following example:\n\n```python\nClickCountWidget = idom_jupyter.widgetize(ClickCount)\nipywidgets.Box(\n [\n ClickCountWidget(),\n ClickCountWidget(),\n ]\n)\n```\n\nAlternatively just wrap an `idom` element instance in an `idom_jupyter.LayoutWidget`:\n\n```python\nipywidgets.Box(\n [\n idom_jupyter.LayoutWidget(ClickCount()),\n idom_jupyter.LayoutWidget(ClickCount()),\n ]\n)\n```\n\nFor a more detailed introduction check out this live demo here:\n\n<a href=\"https://mybinder.org/v2/gh/idom-team/idom-jupyter/main?filepath=notebooks%2Fintroduction.ipynb\">\n <img alt=\"Binder\" height=\"25px\" src=\"https://mybinder.org/badge_logo.svg\" />\n</a>\n\n## Development Installation\n\nFor a development installation (requires [Node.js](https://nodejs.org) and [Yarn version 1](https://classic.yarnpkg.com/)),\n\n $ git clone https://github.com/idom-team/idom-jupyter.git\n $ cd idom-jupyter\n $ pip install -e .\n $ jupyter nbextension install --py --symlink --overwrite --sys-prefix idom_jupyter\n $ jupyter nbextension enable --py --sys-prefix idom_jupyter\n\nWhen actively developing your extension for JupyterLab, run the command:\n\n $ jupyter labextension develop --overwrite idom_jupyter\n\nThen you need to rebuild the JS when you make a code change:\n\n $ cd js\n $ yarn run build\n\nYou then need to refresh the JupyterLab page when your javascript changes.\n",
"bugtrack_url": null,
"license": "BSD 3-Clause License",
"summary": "A client for IDOM implemented using Jupyter widgets",
"version": "0.7.7",
"split_keywords": [
"ipython",
"jupyter",
"widgets"
],
"urls": [
{
"comment_text": "",
"digests": {
"md5": "43c37dfb11fba857a082b093fe9f9c86",
"sha256": "2af11083de1d9147290318c029f22b20d407300aab2a9db59b521725f271923a"
},
"downloads": -1,
"filename": "idom_jupyter-0.7.7-py3-none-any.whl",
"has_sig": false,
"md5_digest": "43c37dfb11fba857a082b093fe9f9c86",
"packagetype": "bdist_wheel",
"python_version": "py3",
"requires_python": ">=3.7",
"size": 155902,
"upload_time": "2022-12-28T22:27:28",
"upload_time_iso_8601": "2022-12-28T22:27:28.674410Z",
"url": "https://files.pythonhosted.org/packages/64/d9/803b88eb01e8dcd9d0597a3453e27221545e619a1ad1073008c68653bb64/idom_jupyter-0.7.7-py3-none-any.whl",
"yanked": false,
"yanked_reason": null
},
{
"comment_text": "",
"digests": {
"md5": "8653e4c97793c772cb74b24d19e3a6de",
"sha256": "56386a2e072dcdc004c07fcece8fdfc2a5647fdc27a6539f32b8a4cf61641485"
},
"downloads": -1,
"filename": "idom_jupyter-0.7.7.tar.gz",
"has_sig": false,
"md5_digest": "8653e4c97793c772cb74b24d19e3a6de",
"packagetype": "sdist",
"python_version": "source",
"requires_python": ">=3.7",
"size": 210444,
"upload_time": "2022-12-28T22:27:31",
"upload_time_iso_8601": "2022-12-28T22:27:31.097960Z",
"url": "https://files.pythonhosted.org/packages/65/3e/f2c32f0ac8372b3be41582503bac2c8f739a4d860e63e299c587ca266afc/idom_jupyter-0.7.7.tar.gz",
"yanked": false,
"yanked_reason": null
}
],
"upload_time": "2022-12-28 22:27:31",
"github": true,
"gitlab": false,
"bitbucket": false,
"github_user": "idom-team",
"github_project": "idom-jupyter",
"travis_ci": false,
"coveralls": false,
"github_actions": false,
"requirements": [],
"lcname": "idom-jupyter"
}
JSON
