diff --git a/README.md b/README.md index 0b0db7b..dccfd3e 100644 --- a/README.md +++ b/README.md @@ -18,22 +18,6 @@ To install use `pip`: pip install reactpy_jupyter ``` -Then, before anything else, do one of the following: - -1. At the top of your notebook run - - ```python - import reactpy_jupyter - ``` - -2. Register `reactpy_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 = [ - 'reactpy_jupyter' - ] - ``` - ## Usage Once you're done [getting started](#getting-started), you can author and display ReactPy @@ -54,11 +38,11 @@ ClickCount() ``` You can also turn an `reactpy` element constructor into one that returns an `ipywidget` with -the `reactpy_juptyer.widgetize` function. This is useful if you wish to use ReactPy in combination +the `reactpy_juptyer.to_widget` function. This is useful if you wish to use ReactPy in combination with other Jupyter Widgets as in the following example: ```python -ClickCountWidget = reactpy_jupyter.widgetize(ClickCount) +ClickCountWidget = reactpy_jupyter.to_widget(ClickCount) ipywidgets.Box( [ ClickCountWidget(), @@ -67,17 +51,6 @@ ipywidgets.Box( ) ``` -Alternatively just wrap an `reactpy` element instance in an `reactpy_jupyter.LayoutWidget`: - -```python -ipywidgets.Box( - [ - reactpy_jupyter.LayoutWidget(ClickCount()), - reactpy_jupyter.LayoutWidget(ClickCount()), - ] -) -``` - For a more detailed introduction check out this live demo here: diff --git a/notebooks/introduction.ipynb b/notebooks/introduction.ipynb index 59b56e5..304c932 100644 --- a/notebooks/introduction.ipynb +++ b/notebooks/introduction.ipynb @@ -1,6 +1,7 @@ { "cells": [ { + "attachments": {}, "cell_type": "markdown", "metadata": {}, "source": [ @@ -12,6 +13,7 @@ ] }, { + "attachments": {}, "cell_type": "markdown", "metadata": {}, "source": [ @@ -22,27 +24,11 @@ }, { "cell_type": "code", - "execution_count": 1, + "execution_count": null, "metadata": { "tags": [] }, - "outputs": [ - { - "data": { - "application/vnd.jupyter.widget-view+json": { - "model_id": "e0c3c63d3e1c4d88a71bb7bbc6ae45e0", - "version_major": 2, - "version_minor": 0 - }, - "text/plain": [ - "LayoutWidget(Layout(ContextProvider()))" - ] - }, - "execution_count": 1, - "metadata": {}, - "output_type": "execute_result" - } - ], + "outputs": [], "source": [ "from reactpy import component, html\n", "\n", @@ -56,6 +42,7 @@ ] }, { + "attachments": {}, "cell_type": "markdown", "metadata": {}, "source": [ @@ -68,27 +55,11 @@ }, { "cell_type": "code", - "execution_count": 2, + "execution_count": null, "metadata": { "tags": [] }, - "outputs": [ - { - "data": { - "application/vnd.jupyter.widget-view+json": { - "model_id": "a87baeb77dcc44e1a29ab154df1dd8a7", - "version_major": 2, - "version_minor": 0 - }, - "text/plain": [ - "LayoutWidget(Layout(ContextProvider()))" - ] - }, - "execution_count": 2, - "metadata": {}, - "output_type": "execute_result" - } - ], + "outputs": [], "source": [ "from reactpy import component, html\n", "\n", @@ -125,6 +96,7 @@ ] }, { + "attachments": {}, "cell_type": "markdown", "metadata": {}, "source": [ @@ -137,27 +109,11 @@ }, { "cell_type": "code", - "execution_count": 3, + "execution_count": null, "metadata": { "tags": [] }, - "outputs": [ - { - "data": { - "application/vnd.jupyter.widget-view+json": { - "model_id": "920e5f89aba644528257e20deae25f2e", - "version_major": 2, - "version_minor": 0 - }, - "text/plain": [ - "LayoutWidget(Layout(ContextProvider()))" - ] - }, - "execution_count": 3, - "metadata": {}, - "output_type": "execute_result" - } - ], + "outputs": [], "source": [ "import json\n", "from pathlib import Path\n", @@ -197,6 +153,7 @@ ] }, { + "attachments": {}, "cell_type": "markdown", "metadata": {}, "source": [ @@ -207,25 +164,9 @@ }, { "cell_type": "code", - "execution_count": 4, + "execution_count": null, "metadata": {}, - "outputs": [ - { - "data": { - "application/vnd.jupyter.widget-view+json": { - "model_id": "67cb81abf4ce4c9e991a9771607b9d5e", - "version_major": 2, - "version_minor": 0 - }, - "text/plain": [ - "LayoutWidget(Layout(ContextProvider()))" - ] - }, - "execution_count": 4, - "metadata": {}, - "output_type": "execute_result" - } - ], + "outputs": [], "source": [ "from reactpy_jupyter import from_widget\n", "from ipywidgets import IntSlider\n", @@ -237,6 +178,7 @@ ] }, { + "attachments": {}, "cell_type": "markdown", "metadata": {}, "source": [ @@ -245,7 +187,7 @@ }, { "cell_type": "code", - "execution_count": 5, + "execution_count": null, "metadata": { "tags": [] }, @@ -276,6 +218,7 @@ ] }, { + "attachments": {}, "cell_type": "markdown", "metadata": {}, "source": [ @@ -284,27 +227,11 @@ }, { "cell_type": "code", - "execution_count": 6, + "execution_count": null, "metadata": { "tags": [] }, - "outputs": [ - { - "data": { - "application/vnd.jupyter.widget-view+json": { - "model_id": "c586a0f0fe0b44a3bab173ccb9fa52d8", - "version_major": 2, - "version_minor": 0 - }, - "text/plain": [ - "LayoutWidget(Layout(ContextProvider()))" - ] - }, - "execution_count": 6, - "metadata": {}, - "output_type": "execute_result" - } - ], + "outputs": [], "source": [ "from ipywidgets import IntSlider\n", "\n", @@ -312,6 +239,7 @@ ] }, { + "attachments": {}, "cell_type": "markdown", "metadata": {}, "source": [ @@ -320,27 +248,11 @@ }, { "cell_type": "code", - "execution_count": 8, + "execution_count": null, "metadata": { "tags": [] }, - "outputs": [ - { - "data": { - "application/vnd.jupyter.widget-view+json": { - "model_id": "a0180ea4781b4dda9f77d1be75fbcad3", - "version_major": 2, - "version_minor": 0 - }, - "text/plain": [ - "Box(children=(IntSlider(value=0, readout=False), LayoutWidget(Layout(ContextProvider())), LayoutWidget(Layout…" - ] - }, - "execution_count": 9, - "metadata": {}, - "output_type": "execute_result" - } - ], + "outputs": [], "source": [ "slider = IntSlider(readout=False)\n", "slider_observer_constructor = to_widget(SliderObserver)\n", @@ -389,6 +286,7 @@ ] }, { + "attachments": {}, "cell_type": "markdown", "metadata": {}, "source": [ @@ -424,6 +322,7 @@ ] }, { + "attachments": {}, "cell_type": "markdown", "metadata": {}, "source": [