diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml index efa7d4918..21f192233 100644 --- a/.github/ISSUE_TEMPLATE/config.yml +++ b/.github/ISSUE_TEMPLATE/config.yml @@ -1,5 +1,5 @@ blank_issues_enabled: false contact_links: - name: Start a Discussion - url: https://github.com/idom-team/idom/discussions + url: https://github.com/reactive-python/reactpy/discussions about: Report issues, request features, ask questions, and share ideas diff --git a/.github/workflows/.nox-session.yml b/.github/workflows/.nox-session.yml index 8f68188cc..9cf5f645b 100644 --- a/.github/workflows/.nox-session.yml +++ b/.github/workflows/.nox-session.yml @@ -3,10 +3,10 @@ name: Nox Session on: workflow_call: inputs: - session-name: + nox-args: required: true type: string - session-arguments: + session-args: required: false type: string runs-on-array: @@ -45,4 +45,4 @@ jobs: run: pip install -r requirements/nox-deps.txt - name: Run Tests env: { "CI": "true" } - run: nox -s ${{ inputs.session-name }} --stop-on-first-error -- ${{ inputs.session-arguments }} + run: nox ${{ inputs.nox-args }} --stop-on-first-error -- ${{ inputs.session-args }} diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index 673bf9b32..7779049b8 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -15,22 +15,22 @@ jobs: uses: ./.github/workflows/.nox-session.yml with: job-name: "python-{0}" - session-name: test_python - session-arguments: --maxfail=3 + nox-args: "-t check-python" + session-args: "--pytest --maxfail=3 --reruns 3" python-environments: uses: ./.github/workflows/.nox-session.yml with: - session-name: test_python_suite - session-arguments: --maxfail=3 --no-cov + nox-args: "-s check-python-tests" + session-args: "--no-cov --pytest --maxfail=3 --reruns 3" runs-on-array: '["ubuntu-latest", "macos-latest", "windows-latest"]' python-version-array: '["3.7", "3.8", "3.9", "3.10", "3.11"]' docs: uses: ./.github/workflows/.nox-session.yml with: job-name: "python-{0}" - session-name: test_docs + nox-args: "-s check-docs" javascript: uses: ./.github/workflows/.nox-session.yml with: job-name: "{1}" - session-name: test_javascript + nox-args: "-t check-javascript" diff --git a/.gitignore b/.gitignore index 50febabbe..652e5015b 100644 --- a/.gitignore +++ b/.gitignore @@ -1,5 +1,5 @@ # --- Build Artifacts --- -src/idom/_client +src/reactpy/_client # --- Jupyter --- *.ipynb_checkpoints diff --git a/.pre-commit-config.yaml b/.pre-commit-config.yaml index b47a49829..9a67422d5 100644 --- a/.pre-commit-config.yaml +++ b/.pre-commit-config.yaml @@ -9,6 +9,6 @@ repos: - id: isort name: isort - repo: https://github.com/pre-commit/mirrors-prettier - rev: v2.7.1 + rev: v3.0.0-alpha.4 hooks: - id: prettier diff --git a/MANIFEST.in b/MANIFEST.in index b49a2df3d..b989938fa 100644 --- a/MANIFEST.in +++ b/MANIFEST.in @@ -1,3 +1,3 @@ -recursive-include src/idom/_client * -recursive-include src/idom/web/templates * -include src/idom/py.typed +recursive-include src/reactpy/_client * +recursive-include src/reactpy/web/templates * +include src/reactpy/py.typed diff --git a/README.md b/README.md index b6304e748..a9a54e963 100644 --- a/README.md +++ b/README.md @@ -1,24 +1,40 @@ -# IDOM · [![Tests](https://github.com/idom-team/idom/workflows/test/badge.svg)](https://github.com/idom-team/idom/actions?query=workflow%3ATest) [![PyPI Version](https://img.shields.io/pypi/v/idom.svg)](https://pypi.python.org/pypi/idom) [![License](https://img.shields.io/badge/License-MIT-purple.svg)](https://github.com/idom-team/idom/blob/main/LICENSE) - -IDOM connects your Python web framework of choice to a ReactJS frontend, allowing you to create **interactive websites without needing JavaScript!** - -Following ReactJS styling, web elements are combined into [reusable "components"](https://idom-docs.herokuapp.com/docs/guides/creating-interfaces/your-first-components/index.html#parametrizing-components). These components can utilize [hooks](https://idom-docs.herokuapp.com/docs/reference/hooks-api.html) and [events](https://idom-docs.herokuapp.com/docs/guides/adding-interactivity/responding-to-events/index.html#async-event-handlers) to create infinitely complex web pages. - -When needed, IDOM can [use components directly from NPM](https://idom-docs.herokuapp.com/docs/guides/escape-hatches/javascript-components.html#dynamically-loaded-components). For additional flexibility, components can also be [fully developed in JavaScript](https://idom-docs.herokuapp.com/docs/guides/escape-hatches/javascript-components.html#custom-javascript-components). - -Any Python web framework with Websockets can support IDOM. See below for what frameworks are supported out of the box. - -| Supported Frameworks | Supported Frameworks (External) | -| --- | --- | -| [`Flask`, `FastAPI`, `Sanic`, `Tornado`](https://idom-docs.herokuapp.com/docs/guides/getting-started/installing-idom.html#officially-supported-servers) | [`Django`](https://github.com/idom-team/django-idom), [`Plotly-Dash`](https://github.com/idom-team/idom-dash), [`Jupyter`](https://github.com/idom-team/idom-jupyter) | - +# ReactPy · [![Tests](https://github.com/reactive-python/reactpy/workflows/test/badge.svg)](https://github.com/reactive-python/reactpy/actions?query=workflow%3ATest) [![PyPI Version](https://img.shields.io/pypi/v/reactpy.svg)](https://pypi.python.org/pypi/reactpy) [![License](https://img.shields.io/badge/License-MIT-purple.svg)](https://github.com/reactive-python/reactpy/blob/main/LICENSE) + +ReactPy is a library for building user interfaces in Python without Javascript. ReactPy +interfaces are made from components which look and behave similarly to this found in +[ReactJS](https://reactjs.org/). Designed with simplicity in mind, ReactPy can be used +by those without web development experience while also being powerful enough to grow +with your ambitions. + + + + + + + + + + + + + + +
Supported ServersSupported Integrations
+ + Flask, FastAPI, Sanic, Tornado + + + Django, + Jupyter, + Plotly-Dash +
# At a Glance -To get a rough idea of how to write apps in IDOM, take a look at this tiny _Hello World_ application. +To get a rough idea of how to write apps in ReactPy, take a look at this tiny _Hello World_ application. ```python -from idom import component, html, run +from reactpy import component, html, run @component def HelloWorld(): @@ -31,8 +47,8 @@ run(HelloWorld) Follow the links below to find out more about this project. -- [Try it Now](https://mybinder.org/v2/gh/idom-team/idom-jupyter/main?urlpath=lab/tree/notebooks/introduction.ipynb) - check out IDOM in a Jupyter Notebook. -- [Documentation](https://idom-docs.herokuapp.com/) - learn how to install, run, and use IDOM. -- [Community Forum](https://github.com/idom-team/idom/discussions) - ask questions, share ideas, and show off projects. -- [Contributor Guide](https://idom-docs.herokuapp.com/docs/developing-idom/contributor-guide.html) - see how you can help develop this project. -- [Code of Conduct](https://github.com/idom-team/idom/blob/main/CODE_OF_CONDUCT.md) - standards for interacting with this community. +- [Try it Now](https://mybinder.org/v2/gh/reactive-python/reactpy-jupyter/main?urlpath=lab/tree/notebooks/introduction.ipynb) - check out ReactPy in a Jupyter Notebook. +- [Documentation](https://reactpy-docs.herokuapp.com/) - learn how to install, run, and use ReactPy. +- [Community Forum](https://github.com/reactive-python/reactpy/discussions) - ask questions, share ideas, and show off projects. +- [Contributor Guide](https://reactpy-docs.herokuapp.com/docs/developing-reactpy/contributor-guide.html) - see how you can help develop this project. +- [Code of Conduct](https://github.com/reactive-python/reactpy/blob/main/CODE_OF_CONDUCT.md) - standards for interacting with this community. diff --git a/branding/ico/idom-logo-black-square-small.ico b/branding/ico/idom-logo-black-square-small.ico deleted file mode 100644 index 7005d2938..000000000 Binary files a/branding/ico/idom-logo-black-square-small.ico and /dev/null differ diff --git a/branding/ico/idom-logo-white-square-small.ico b/branding/ico/idom-logo-white-square-small.ico deleted file mode 100644 index 6a5c139fb..000000000 Binary files a/branding/ico/idom-logo-white-square-small.ico and /dev/null differ diff --git a/branding/png/idom-logo-black-square-small.png b/branding/png/idom-logo-black-square-small.png deleted file mode 100644 index 7971eaa68..000000000 Binary files a/branding/png/idom-logo-black-square-small.png and /dev/null differ diff --git a/branding/png/idom-logo-black-square.png b/branding/png/idom-logo-black-square.png deleted file mode 100644 index 049f6fd55..000000000 Binary files a/branding/png/idom-logo-black-square.png and /dev/null differ diff --git a/branding/png/idom-logo-black.png b/branding/png/idom-logo-black.png deleted file mode 100644 index 9a78e48fc..000000000 Binary files a/branding/png/idom-logo-black.png and /dev/null differ diff --git a/branding/png/idom-logo-white-square-small.png b/branding/png/idom-logo-white-square-small.png deleted file mode 100644 index 957c58bfa..000000000 Binary files a/branding/png/idom-logo-white-square-small.png and /dev/null differ diff --git a/branding/png/idom-logo-white-square.png b/branding/png/idom-logo-white-square.png deleted file mode 100644 index f4dbb4db1..000000000 Binary files a/branding/png/idom-logo-white-square.png and /dev/null differ diff --git a/branding/png/idom-logo-white.png b/branding/png/idom-logo-white.png deleted file mode 100644 index 2ef265474..000000000 Binary files a/branding/png/idom-logo-white.png and /dev/null differ diff --git a/branding/reactpy-logo-padded.png b/branding/reactpy-logo-padded.png new file mode 100644 index 000000000..46b8b8a07 Binary files /dev/null and b/branding/reactpy-logo-padded.png differ diff --git a/branding/reactpy-logo-padded.svg b/branding/reactpy-logo-padded.svg new file mode 100644 index 000000000..601707bce --- /dev/null +++ b/branding/reactpy-logo-padded.svg @@ -0,0 +1,159 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/branding/reactpy-logo-wide.svg b/branding/reactpy-logo-wide.svg new file mode 100644 index 000000000..d57a85606 --- /dev/null +++ b/branding/reactpy-logo-wide.svg @@ -0,0 +1,169 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ReactPy + diff --git a/branding/reactpy-logo.ico b/branding/reactpy-logo.ico new file mode 100644 index 000000000..62be5f5ba Binary files /dev/null and b/branding/reactpy-logo.ico differ diff --git a/branding/reactpy-logo.svg b/branding/reactpy-logo.svg new file mode 100644 index 000000000..312fb87a5 --- /dev/null +++ b/branding/reactpy-logo.svg @@ -0,0 +1,160 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/branding/svg/idom-logo-backed-square.svg b/branding/svg/idom-logo-backed-square.svg deleted file mode 100644 index 9e34b6808..000000000 --- a/branding/svg/idom-logo-backed-square.svg +++ /dev/null @@ -1,61 +0,0 @@ - - - - - - - - - - - - image/svg+xml - - - - - - - - - - - - - - - - - - diff --git a/branding/svg/idom-logo-backed.svg b/branding/svg/idom-logo-backed.svg deleted file mode 100644 index 290fc7ed0..000000000 --- a/branding/svg/idom-logo-backed.svg +++ /dev/null @@ -1,61 +0,0 @@ - - - - - - - - - - - - image/svg+xml - - - - - - - - - - - - - - - - - - diff --git a/branding/svg/idom-logo-square-small.svg b/branding/svg/idom-logo-square-small.svg deleted file mode 100644 index eb36c7b11..000000000 --- a/branding/svg/idom-logo-square-small.svg +++ /dev/null @@ -1,45 +0,0 @@ - - - - - - - - - - - - image/svg+xml - - - - - - - - - - - - - diff --git a/branding/svg/idom-logo-square.svg b/branding/svg/idom-logo-square.svg deleted file mode 100644 index 354f961e4..000000000 --- a/branding/svg/idom-logo-square.svg +++ /dev/null @@ -1,50 +0,0 @@ - - - - - - - - - - - - image/svg+xml - - - - - - - - - - - - - - - diff --git a/branding/svg/idom-logo.svg b/branding/svg/idom-logo.svg deleted file mode 100644 index ffcee8d96..000000000 --- a/branding/svg/idom-logo.svg +++ /dev/null @@ -1,49 +0,0 @@ - - - - - - - - - - - - image/svg+xml - - - - - - - - - - - - - - - diff --git a/docs/Dockerfile b/docs/Dockerfile index 5cc8979af..12e133d2c 100644 --- a/docs/Dockerfile +++ b/docs/Dockerfile @@ -15,7 +15,7 @@ RUN python3 -m venv $VIRTUAL_ENV ENV PATH="$VIRTUAL_ENV/bin:$PATH" RUN pip install --upgrade pip -# Install IDOM +# Install ReactPy # ------------ COPY requirements ./requirements RUN pip install -r requirements/build-docs.txt @@ -44,6 +44,6 @@ RUN sphinx-build -v -W -b html docs/source docs/build # Define Entrypoint # ----------------- ENV PORT 5000 -ENV IDOM_DEBUG_MODE=1 -ENV IDOM_CHECK_VDOM_SPEC=0 +ENV REACTPY_DEBUG_MODE=1 +ENV REACTPY_CHECK_VDOM_SPEC=0 CMD python scripts/run_docs.py diff --git a/docs/README.md b/docs/README.md index 067adc0b8..156fe4ea1 100644 --- a/docs/README.md +++ b/docs/README.md @@ -1,14 +1,16 @@ -# IDOM's Documentation +# ReactPy's Documentation -We provide two main ways to run the docs. Both use `nox` which has a `noxfile.py` at the -root of the repository. Running the docs with `nox -s docs` will start up an iteractive -session which will rebuild the docs any time a file is modified. Using `nox -s -docs_in_docker` on the other hand, will build a docker image and run the docs from -there. The latter command mimics how the docs will behave in production. As such, if any -changes to the core of the documentation are made (i.e. to non-`*.rst` files), then you -should run a manual test of the documentation using the `docs_in_docker` session. +We provide two main ways to run the docs. Both use +[`nox`](https://pypi.org/project/nox/): -If you with to build and run the docs by hand you need to perform two commands, each +- `nox -s docs` - displayes the docs and rebuilds when files are modified. +- `nox -s docs-in-docker` - builds a docker image and runs the docs from there. + +If any changes to the core of the documentation are made (i.e. to non-`*.rst` files), +then you should run a manual test of the documentation using the `docs_in_docker` +session. + +If you wish to build and run the docs by hand you need to perform two commands, each being run from the root of the repository: - `sphinx-build -b html docs/source docs/build` diff --git a/docs/app.py b/docs/app.py index 4bbabf148..0b1ad302a 100644 --- a/docs/app.py +++ b/docs/app.py @@ -3,20 +3,20 @@ from sanic import Sanic, response -from idom import component -from idom.backend.sanic import Options, configure, use_request -from idom.core.types import ComponentConstructor +from reactpy import component +from reactpy.backend.sanic import Options, configure, use_request +from reactpy.core.types import ComponentConstructor from .examples import get_normalized_example_name, load_examples HERE = Path(__file__).parent -IDOM_MODEL_SERVER_URL_PREFIX = "/_idom" +REACTPY_MODEL_SERVER_URL_PREFIX = "/_reactpy" logger = getLogger(__name__) -IDOM_MODEL_SERVER_URL_PREFIX = "/_idom" +REACTPY_MODEL_SERVER_URL_PREFIX = "/_reactpy" @component @@ -52,7 +52,7 @@ async def forward_to_index(request): configure( app, Example, - Options(url_prefix=IDOM_MODEL_SERVER_URL_PREFIX), + Options(url_prefix=REACTPY_MODEL_SERVER_URL_PREFIX), ) return app diff --git a/docs/examples.py b/docs/examples.py index 4bcbf5148..142d49429 100644 --- a/docs/examples.py +++ b/docs/examples.py @@ -5,14 +5,14 @@ from traceback import format_exc from typing import Callable, Iterator -import idom -from idom.types import ComponentType +import reactpy +from reactpy.types import ComponentType HERE = Path(__file__) SOURCE_DIR = HERE.parent / "source" CONF_FILE = SOURCE_DIR / "conf.py" -RUN_IDOM = idom.run +RUN_ReactPy = reactpy.run def load_examples() -> Iterator[tuple[str, Callable[[], ComponentType]]]: @@ -95,7 +95,7 @@ def capture_component(component_constructor): nonlocal captured_component_constructor captured_component_constructor = component_constructor - idom.run = capture_component + reactpy.run = capture_component try: code = compile(file.read_text(), str(file), "exec") exec( @@ -109,21 +109,23 @@ def capture_component(component_constructor): except Exception: return _make_error_display(format_exc()) finally: - idom.run = RUN_IDOM + reactpy.run = RUN_ReactPy if captured_component_constructor is None: return _make_example_did_not_run(str(file)) - @idom.component + @reactpy.component def Wrapper(): - return idom.html.div(captured_component_constructor(), PrintView()) + return reactpy.html.div(captured_component_constructor(), PrintView()) - @idom.component + @reactpy.component def PrintView(): - text, set_text = idom.hooks.use_state(print_buffer.getvalue()) + text, set_text = reactpy.hooks.use_state(print_buffer.getvalue()) print_buffer.set_callback(set_text) return ( - idom.html.pre({"class_name": "printout"}, text) if text else idom.html.div() + reactpy.html.pre({"class_name": "printout"}, text) + if text + else reactpy.html.div() ) return Wrapper() @@ -161,16 +163,16 @@ def write(self, text: str) -> None: def _make_example_did_not_run(example_name): - @idom.component + @reactpy.component def ExampleDidNotRun(): - return idom.html.code(f"Example {example_name} did not run") + return reactpy.html.code(f"Example {example_name} did not run") return ExampleDidNotRun() def _make_error_display(message): - @idom.component + @reactpy.component def ShowError(): - return idom.html.pre(message) + return reactpy.html.pre(message) return ShowError() diff --git a/docs/source/_custom_js/README.md b/docs/source/_custom_js/README.md index 8c77d450b..4d5d75dc2 100644 --- a/docs/source/_custom_js/README.md +++ b/docs/source/_custom_js/README.md @@ -1,4 +1,4 @@ -# Custom Javascript for IDOM's Docs +# Custom Javascript for ReactPy's Docs Build the javascript with diff --git a/docs/source/_custom_js/package-lock.json b/docs/source/_custom_js/package-lock.json index ec1c3b1c7..5e8cdba10 100644 --- a/docs/source/_custom_js/package-lock.json +++ b/docs/source/_custom_js/package-lock.json @@ -1,14 +1,14 @@ { - "name": "idom-docs-example-loader", + "name": "reactpy-docs-example-loader", "version": "1.0.0", "lockfileVersion": 2, "requires": true, "packages": { "": { - "name": "idom-docs-example-loader", + "name": "reactpy-docs-example-loader", "version": "1.0.0", "dependencies": { - "idom-client-react": "file:../../../src/client/packages/idom-client-react" + "@reactpy/client": "file:../../../src/client/packages/client" }, "devDependencies": { "@rollup/plugin-commonjs": "^21.0.1", @@ -18,9 +18,10 @@ "rollup": "^2.35.1" } }, - "../../../src/client/packages/idom-client-react": { + "../../../src/client/packages/@reactpy/client": { "version": "0.44.0", "integrity": "sha512-pIK5eNwFSHKXg7ClpASWFVKyZDYxz59MSFpVaX/OqJFkrJaAxBuhKGXNTMXmuyWOL5Iyvb/ErwwDRxQRzMNkfQ==", + "extraneous": true, "license": "MIT", "dependencies": { "fast-json-patch": "^3.0.0-1", @@ -37,15 +38,28 @@ "react-dom": ">=16" } }, - "../../../src/client/packages/idom-client-react/node_modules/fast-json-patch": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/fast-json-patch/-/fast-json-patch-3.1.0.tgz", - "integrity": "sha512-IhpytlsVTRndz0hU5t0/MGzS/etxLlfrpG5V5M9mVbuj9TrJLWaMfsox9REM5rkuGX0T+5qjpe8XA1o0gZ42nA==" + "../../../src/client/packages/client": { + "name": "@reactpy/client", + "version": "1.0.0-a6", + "license": "MIT", + "dependencies": { + "htm": "^3.0.3", + "json-pointer": "^0.6.2" + }, + "devDependencies": { + "jsdom": "16.5.0", + "lodash": "^4.17.21", + "prettier": "^2.5.1", + "uvu": "^0.5.1" + }, + "peerDependencies": { + "react": ">=16", + "react-dom": ">=16" + } }, - "../../../src/client/packages/idom-client-react/node_modules/htm": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/htm/-/htm-3.1.0.tgz", - "integrity": "sha512-L0s3Sid5r6YwrEvkig14SK3Emmc+kIjlfLhEGn2Vy3bk21JyDEes4MoDsbJk6luaPp8bugErnxPz86ZuAw6e5Q==" + "node_modules/@reactpy/client": { + "resolved": "../../../src/client/packages/client", + "link": true }, "node_modules/@rollup/plugin-commonjs": { "version": "21.0.1", @@ -264,10 +278,6 @@ "node": ">= 0.4.0" } }, - "node_modules/idom-client-react": { - "resolved": "../../../src/client/packages/idom-client-react", - "link": true - }, "node_modules/inflight": { "version": "1.0.6", "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", @@ -422,6 +432,17 @@ } }, "dependencies": { + "@reactpy/client": { + "version": "file:../../../src/client/packages/client", + "requires": { + "htm": "^3.0.3", + "jsdom": "16.5.0", + "json-pointer": "^0.6.2", + "lodash": "^4.17.21", + "prettier": "^2.5.1", + "uvu": "^0.5.1" + } + }, "@rollup/plugin-commonjs": { "version": "21.0.1", "resolved": "https://registry.npmjs.org/@rollup/plugin-commonjs/-/plugin-commonjs-21.0.1.tgz", @@ -599,29 +620,6 @@ "function-bind": "^1.1.1" } }, - "idom-client-react": { - "version": "file:../../../src/client/packages/idom-client-react", - "requires": { - "fast-json-patch": "^3.0.0-1", - "htm": "^3.0.3", - "jsdom": "16.5.0", - "lodash": "^4.17.21", - "prettier": "^2.5.1", - "uvu": "^0.5.1" - }, - "dependencies": { - "fast-json-patch": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/fast-json-patch/-/fast-json-patch-3.1.0.tgz", - "integrity": "sha512-IhpytlsVTRndz0hU5t0/MGzS/etxLlfrpG5V5M9mVbuj9TrJLWaMfsox9REM5rkuGX0T+5qjpe8XA1o0gZ42nA==" - }, - "htm": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/htm/-/htm-3.1.0.tgz", - "integrity": "sha512-L0s3Sid5r6YwrEvkig14SK3Emmc+kIjlfLhEGn2Vy3bk21JyDEes4MoDsbJk6luaPp8bugErnxPz86ZuAw6e5Q==" - } - } - }, "inflight": { "version": "1.0.6", "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", diff --git a/docs/source/_custom_js/package.json b/docs/source/_custom_js/package.json index 633a43739..5d3e41d13 100644 --- a/docs/source/_custom_js/package.json +++ b/docs/source/_custom_js/package.json @@ -1,7 +1,7 @@ { - "name": "idom-docs-example-loader", + "name": "reactpy-docs-example-loader", "version": "1.0.0", - "description": "simple javascript client for IDOM's documentation", + "description": "simple javascript client for ReactPy's documentation", "main": "index.js", "scripts": { "build": "rollup --config", @@ -15,6 +15,6 @@ "rollup": "^2.35.1" }, "dependencies": { - "idom-client-react": "file:../../../src/client/packages/idom-client-react" + "@reactpy/client": "file:../../../src/client/packages/client" } } diff --git a/docs/source/_custom_js/src/index.js b/docs/source/_custom_js/src/index.js index 1aa401123..41a21334d 100644 --- a/docs/source/_custom_js/src/index.js +++ b/docs/source/_custom_js/src/index.js @@ -1,25 +1,25 @@ -import { mountWithLayoutServer, LayoutServerInfo } from "idom-client-react"; +import { mountWithLayoutServer, LayoutServerInfo } from "@reactpy/client"; let didMountDebug = false; export function mountWidgetExample( mountID, viewID, - idomServerHost, + reactpyServerHost, useActivateButton ) { - let idomHost, idomPort; - if (idomServerHost) { - [idomHost, idomPort] = idomServerHost.split(":", 2); + let reactpyHost, reactpyPort; + if (reactpyServerHost) { + [reactpyHost, reactpyPort] = reactpyServerHost.split(":", 2); } else { - idomHost = window.location.hostname; - idomPort = window.location.port; + reactpyHost = window.location.hostname; + reactpyPort = window.location.port; } const serverInfo = new LayoutServerInfo({ - host: idomHost, - port: idomPort, - path: "/_idom/", + host: reactpyHost, + port: reactpyPort, + path: "/_reactpy/", query: `view_id=${viewID}`, secure: window.location.protocol == "https:", }); diff --git a/docs/source/_exts/autogen_api_docs.py b/docs/source/_exts/autogen_api_docs.py index 4419f5d69..9f833ac14 100644 --- a/docs/source/_exts/autogen_api_docs.py +++ b/docs/source/_exts/autogen_api_docs.py @@ -9,7 +9,7 @@ HERE = Path(__file__).parent SRC = HERE.parent.parent.parent / "src" -PYTHON_PACKAGE = SRC / "idom" +PYTHON_PACKAGE = SRC / "reactpy" AUTO_DIR = HERE.parent / "_auto" AUTO_DIR.mkdir(exist_ok=True) diff --git a/docs/source/_exts/copy_vdom_json_schema.py b/docs/source/_exts/copy_vdom_json_schema.py index f78a163c2..38fc171ac 100644 --- a/docs/source/_exts/copy_vdom_json_schema.py +++ b/docs/source/_exts/copy_vdom_json_schema.py @@ -3,7 +3,7 @@ from sphinx.application import Sphinx -from idom.core.vdom import VDOM_JSON_SCHEMA +from reactpy.core.vdom import VDOM_JSON_SCHEMA def setup(app: Sphinx) -> None: diff --git a/docs/source/_exts/idom_example.py b/docs/source/_exts/reactpy_example.py similarity index 97% rename from docs/source/_exts/idom_example.py rename to docs/source/_exts/reactpy_example.py index 3741ca954..7cad84853 100644 --- a/docs/source/_exts/idom_example.py +++ b/docs/source/_exts/reactpy_example.py @@ -72,7 +72,7 @@ def run(self): ) result_tab_item = ( - "▶️ result", + "🚀 result", _interactive_widget( name=example_name, with_activate_button=not activate_result, @@ -162,7 +162,7 @@ def _interactive_widget(name, with_activate_button): _interactive_widget_template = """ -.. idom-view:: {name} +.. reactpy-view:: {name} {activate_button_opt} """ @@ -179,4 +179,4 @@ def _string_to_nested_lines(content): def setup(app: Sphinx) -> None: - app.add_directive("idom", WidgetExample) + app.add_directive("reactpy", WidgetExample) diff --git a/docs/source/_exts/idom_view.py b/docs/source/_exts/reactpy_view.py similarity index 79% rename from docs/source/_exts/idom_view.py rename to docs/source/_exts/reactpy_view.py index 748ef71f8..477a6caca 100644 --- a/docs/source/_exts/idom_view.py +++ b/docs/source/_exts/reactpy_view.py @@ -8,8 +8,10 @@ from docs.examples import get_normalized_example_name -_IDOM_EXAMPLE_HOST = os.environ.get("IDOM_DOC_EXAMPLE_SERVER_HOST", "") -_IDOM_STATIC_HOST = os.environ.get("IDOM_DOC_STATIC_SERVER_HOST", "/docs").rstrip("/") +_REACTPY_EXAMPLE_HOST = os.environ.get("REACTPY_DOC_EXAMPLE_SERVER_HOST", "") +_REACTPY_STATIC_HOST = os.environ.get("REACTPY_DOC_STATIC_SERVER_HOST", "/docs").rstrip( + "/" +) class IteractiveWidget(SphinxDirective): @@ -24,7 +26,7 @@ class IteractiveWidget(SphinxDirective): def run(self): IteractiveWidget._next_id += 1 - container_id = f"idom-widget-{IteractiveWidget._next_id}" + container_id = f"reactpy-widget-{IteractiveWidget._next_id}" view_id = get_normalized_example_name( self.arguments[0], # only used if example name starts with "/" @@ -41,11 +43,11 @@ def run(self): style="margin-bottom: {self.options.get("margin", 0)}px;" /> @@ -57,4 +59,4 @@ def run(self): def setup(app: Sphinx) -> None: - app.add_directive("idom-view", IteractiveWidget) + app.add_directive("reactpy-view", IteractiveWidget) diff --git a/docs/source/_static/css/furo-theme-overrides.css b/docs/source/_static/css/furo-theme-overrides.css index cbe4e99ef..a258e025e 100644 --- a/docs/source/_static/css/furo-theme-overrides.css +++ b/docs/source/_static/css/furo-theme-overrides.css @@ -1,8 +1,6 @@ -body { - --admonition-title-font-size: 1rem !important; - --admonition-font-size: 1rem !important; -} - .sidebar-container { width: 18em; } +.sidebar-brand-text { + display: none; +} diff --git a/docs/source/_static/css/idom-view.css b/docs/source/_static/css/reactpy-view.css similarity index 100% rename from docs/source/_static/css/idom-view.css rename to docs/source/_static/css/reactpy-view.css diff --git a/docs/source/_static/css/sphinx-design-overrides.css b/docs/source/_static/css/sphinx-design-overrides.css index cc9b285c0..767d9d16c 100644 --- a/docs/source/_static/css/sphinx-design-overrides.css +++ b/docs/source/_static/css/sphinx-design-overrides.css @@ -1,12 +1,3 @@ -body { - --sd-color-info: var(--color-admonition-title-background--note); - --sd-color-warning: var(--color-admonition-title-background--warning); - --sd-color-danger: var(--color-admonition-title-background--danger); - --sd-color-info-text: var(--color-admonition-title--note); - --sd-color-warning-text: var(--color-admonition-title--warning); - --sd-color-danger-text: var(--color-admonition-title--danger); -} - .sd-card-body { display: flex; flex-direction: column; diff --git a/docs/source/_static/install-and-run-idom.gif b/docs/source/_static/install-and-run-idom.gif deleted file mode 100644 index 67d226a12..000000000 Binary files a/docs/source/_static/install-and-run-idom.gif and /dev/null differ diff --git a/docs/source/_static/install-and-run-reactpy.gif b/docs/source/_static/install-and-run-reactpy.gif new file mode 100644 index 000000000..49d431341 Binary files /dev/null and b/docs/source/_static/install-and-run-reactpy.gif differ diff --git a/docs/source/about/changelog.rst b/docs/source/about/changelog.rst index 3472f8da6..e4e98037c 100644 --- a/docs/source/about/changelog.rst +++ b/docs/source/about/changelog.rst @@ -3,8 +3,8 @@ Changelog .. note:: - The IDOM team manages their short and long term plans with `GitHub Projects - `__. If you have questions about what + The ReactPy team manages their short and long term plans with `GitHub Projects + `__. If you have questions about what the team are working on, or have feedback on how issues should be prioritized, feel free to :discussion-type:`open up a discussion `. @@ -76,7 +76,7 @@ v1.0.0-a3 **Removed** -- :pull:`907` - accidental import of idom.testing +- :pull:`907` - accidental import of reactpy.testing v1.0.0-a2 @@ -117,13 +117,13 @@ v1.0.0-a1 All attributes are written using ``snake_case``. - In conjunction, with these changes, IDOM now supplies a command line utility that + In conjunction, with these changes, ReactPy now supplies a command line utility that makes a "best effort" attempt to automatically convert code to the new API. Usage of this utility is as follows: .. code-block:: bash - idom update-html-usages [PATHS] + reactpy update-html-usages [PATHS] Where ``[PATHS]`` is any number of directories or files that should be rewritten. @@ -145,7 +145,7 @@ v0.44.0 **Deprecated** -- :pull:`876` - ``idom.widgets.hotswap``. The function has no clear uses outside of some +- :pull:`876` - ``reactpy.widgets.hotswap``. The function has no clear uses outside of some internal applications. For this reason it has been deprecated. **Removed** @@ -153,7 +153,7 @@ v0.44.0 - :pull:`886` - Ability to access element value from events via `event['value']` key. Instead element value should be accessed via `event['target']['value']`. Originally deprecated in :ref:`v0.34.0`. -- :pull:`886` - old misspelled option ``idom.config.IDOM_WED_MODULES_DIR``. Originally +- :pull:`886` - old misspelled option ``reactpy.config.REACTPY_WED_MODULES_DIR``. Originally deprecated in :ref:`v0.36.1`. @@ -181,7 +181,7 @@ v0.42.0 **Added** -- :pull:`835` - Ability to customize the ```` element of IDOM's built-in client. +- :pull:`835` - Ability to customize the ```` element of ReactPy's built-in client. - :pull:`835` - ``vdom_to_html`` utility function. - :pull:`843` - Ability to subscribe to changes that are made to mutable options. - :pull:`832` - ``del_html_head_body_transform`` to remove ````, ````, and ```` while preserving children. @@ -189,13 +189,13 @@ v0.42.0 **Fixed** -- :issue:`582` - ``IDOM_DEBUG_MODE`` is now mutable and can be changed at runtime +- :issue:`582` - ``REACTPY_DEBUG_MODE`` is now mutable and can be changed at runtime - :pull:`832` - Fix ``html_to_vdom`` improperly removing ````, ````, and ```` nodes. **Removed** -- :pull:`832` - Removed ``idom.html.body`` as it is currently unusable due to technological limitations, and thus not needed. -- :pull:`840` - remove ``IDOM_FEATURE_INDEX_AS_DEFAULT_KEY`` option +- :pull:`832` - Removed ``reactpy.html.body`` as it is currently unusable due to technological limitations, and thus not needed. +- :pull:`840` - remove ``REACTPY_FEATURE_INDEX_AS_DEFAULT_KEY`` option - :pull:`835` - ``serve_static_files`` option from backend configuration **Deprecated** @@ -212,16 +212,16 @@ v0.41.0 implementation specific and are now available as top-level imports. Instead of each backend defining these hooks, backends establish a ``ConnectionContext`` with this information. -- :pull:`824` - IDOM's built-in backend server now expose the following routes: +- :pull:`824` - ReactPy's built-in backend server now expose the following routes: - - ``/_idom/assets/`` - - ``/_idom/stream/`` - - ``/_idom/modules/`` + - ``/_reactpy/assets/`` + - ``/_reactpy/stream/`` + - ``/_reactpy/modules/`` - ``//`` This should allow the browser to cache static resources. Even if your ``url_prefix`` - is ``/_idom``, your app should still work as expected. Though if you're using - ``idom-router``, IDOM's server routes will always take priority. + is ``/_reactpy``, your app should still work as expected. Though if you're using + ``reactpy-router``, ReactPy's server routes will always take priority. - :pull:`824` - Backend implementations now strip any URL prefix in the pathname for ``use_location``. - :pull:`827` - ``use_state`` now returns a named tuple with ``value`` and ``set_value`` @@ -301,14 +301,14 @@ v0.39.0 **Fixed** -- :pull:`763` - ``No module named 'idom.server'`` from ``idom.run`` +- :pull:`763` - ``No module named 'reactpy.server'`` from ``reactpy.run`` - :pull:`749` - Setting appropriate MIME type for web modules in `sanic` server implementation **Changed** - :pull:`763` - renamed various: - - ``idom.testing.server -> idom.testing.backend`` + - ``reactpy.testing.server -> reactpy.testing.backend`` - ``ServerFixture -> BackendFixture`` - ``DisplayFixture.server -> DisplayFixture.backend`` @@ -326,7 +326,7 @@ v0.38.1 **Fixed** -- `idom-team/idom-jupyter#22 `__ - +- `reactive-python/reactpy-jupyter#22 `__ - a missing file extension was causing a problem with WebPack. @@ -347,7 +347,7 @@ v0.38.0-a4 **Changed** -- :pull:`733` - renamed ``assert_idom_logged`` testing util to ``assert_idom_did_log`` +- :pull:`733` - renamed ``assert_reactpy_logged`` testing util to ``assert_reactpy_did_log`` v0.38.0-a3 @@ -367,12 +367,12 @@ v0.38.0-a2 - :pull:`721` - Implement ``use_location()`` hook. Navigating to any route below the root of the application will be reflected in the ``location.pathname``. This operates - in concert with how IDOM's configured routes have changed. This will ultimately work + in concert with how ReactPy's configured routes have changed. This will ultimately work towards resolving :issue:`569`. **Changed** -- :pull:`721` - The routes IDOM configures on apps have changed +- :pull:`721` - The routes ReactPy configures on apps have changed .. code-block:: text @@ -380,14 +380,14 @@ v0.38.0-a2 prefix/_api/stream websocket endpoint prefix/* client react app - This means that IDOM's client app is available at any route below the configured + This means that ReactPy's client app is available at any route below the configured ``url_prefix`` besides ``prefix/_api``. The ``_api`` route will likely remain a route - which is reserved by IDOM. The route navigated to below the ``prefix`` will be shown + which is reserved by ReactPy. The route navigated to below the ``prefix`` will be shown in ``use_location``. -- :pull:`721` - IDOM's client now uses Preact instead of React +- :pull:`721` - ReactPy's client now uses Preact instead of React -- :pull:`726` - Renamed ``idom.server`` to ``idom.backend``. Other references to "server +- :pull:`726` - Renamed ``reactpy.server`` to ``reactpy.backend``. Other references to "server implementations" have been renamed to "backend implementations" throughout the documentation and code. @@ -402,9 +402,9 @@ v0.38.0-a1 **Changed** -- :pull:`703` - How IDOM integrates with servers. ``idom.run`` no longer accepts an app - instance to discourage use outside of testing. IDOM's server implementations now - provide ``configure()`` functions instead. ``idom.testing`` has been completely +- :pull:`703` - How ReactPy integrates with servers. ``reactpy.run`` no longer accepts an app + instance to discourage use outside of testing. ReactPy's server implementations now + provide ``configure()`` functions instead. ``reactpy.testing`` has been completely reworked in order to support async web drivers - :pull:`703` - ``PerClientStateServer`` has been functionally replaced by ``configure`` @@ -414,14 +414,14 @@ v0.38.0-a1 **Removed** -- :issue:`669` - Removed ``idom.widgets.multiview`` since basic routing view ``use_scope`` is +- :issue:`669` - Removed ``reactpy.widgets.multiview`` since basic routing view ``use_scope`` is now possible as well as all ``SharedClientStateServer`` implementations. **Fixed** -- :issue:`591` - IDOM's test suite no longer uses sync web drivers +- :issue:`591` - ReactPy's test suite no longer uses sync web drivers - :issue:`678` - Updated Sanic requirement to ``>=21`` -- :issue:`657` - How we advertise ``idom.run`` +- :issue:`657` - How we advertise ``reactpy.run`` v0.37.2 @@ -431,11 +431,11 @@ v0.37.2 **Changed** - :pull:`701` - The name of ``proto`` modules to ``types`` and added a top level - ``idom.types`` module + ``reactpy.types`` module **Fixed** -- :pull:`716` - A typo caused IDOM to use the insecure ``ws`` web-socket protocol on +- :pull:`716` - A typo caused ReactPy to use the insecure ``ws`` web-socket protocol on pages loaded with ``https`` instead of the secure ``wss`` protocol @@ -515,8 +515,8 @@ v0.36.1 ------- :octicon:`milestone` *released on 2022-02-02* -Includes bug fixes and renames the configuration option ``IDOM_WED_MODULES_DIR`` to -``IDOM_WEB_MODULES_DIR`` with a corresponding deprecation warning. +Includes bug fixes and renames the configuration option ``REACTPY_WED_MODULES_DIR`` to +``REACTPY_WEB_MODULES_DIR`` with a corresponding deprecation warning. **Closed Issues** @@ -526,7 +526,7 @@ Includes bug fixes and renames the configuration option ``IDOM_WED_MODULES_DIR`` **Merged Pull Requests** - mark old state as None if unmounting - :pull:`641` -- rename IDOM_WED_MODULES_DIR to IDOM_WEB_MODULES_DIR - :pull:`638` +- rename REACTPY_WED_MODULES_DIR to REACTPY_WEB_MODULES_DIR - :pull:`638` v0.36.0 @@ -621,8 +621,8 @@ v0.35.0 The highlight of this release is that the default :ref:`"key" ` of all elements will be their index amongst their neighbors. Previously this -behavior could be engaged by setting ``IDOM_FEATURE_INDEX_AS_DEFAULT_KEY=1`` when -running IDOM. In this release though, you will need to explicitly turn off this feature +behavior could be engaged by setting ``REACTPY_FEATURE_INDEX_AS_DEFAULT_KEY=1`` when +running ReactPy. In this release though, you will need to explicitly turn off this feature (i.e. ``=0``) to return to the old behavior. With this change, some may notice additional error logs which warn that: @@ -638,9 +638,9 @@ on :ref:`Organizing Items With Keys`. - Support Starlette Server - :issue:`588` - Fix unhandled case in module_from_template - :issue:`584` -- Hide "Children" within IDOM_DEBUG_MODE key warnings - :issue:`562` +- Hide "Children" within REACTPY_DEBUG_MODE key warnings - :issue:`562` - Bug in Element Key Identity - :issue:`556` -- Add iFrame to idom.html - :issue:`542` +- Add iFrame to reactpy.html - :issue:`542` - Create a use_linked_inputs widget instead of Input - :issue:`475` - React warning from module_from_template - :issue:`440` - Use Index as Default Key - :issue:`351` @@ -689,7 +689,7 @@ v0.33.3 :octicon:`milestone` *released on 2021-10-08* Contains a small number of bug fixes and improvements. The most significant change is -the addition of a warning stating that `IDOM_FEATURE_INDEX_AS_DEFAULT_KEY=1` will become +the addition of a warning stating that `REACTPY_FEATURE_INDEX_AS_DEFAULT_KEY=1` will become the default in a future release. Beyond that, a lesser improvement makes it possible to use the default export from a Javascript module when calling `module_from_template` by specifying `exports_default=True` as a parameter. A @@ -702,7 +702,7 @@ specifying `exports_default=True` as a parameter. A **Pull Requests** -- warn that IDOM_FEATURE_INDEX_AS_DEFAULT_KEY=1 will be the default - :pull:`515` +- warn that REACTPY_FEATURE_INDEX_AS_DEFAULT_KEY=1 will be the default - :pull:`515` - clean up patch queues after exit - :pull:`514` - Remove Reconnecting WS alert - :pull:`513` - Fix 502 - :pull:`503` @@ -745,13 +745,13 @@ suite, we added a test that should hopefully catch this in the future by proxy. The most important breaking change, is yet another which modifies the Custom Javascript Component interface. We now add a ``create()`` function to the ``bind()`` interface that -allows IDOM's client to recursively create components from that (and only that) import +allows ReactPy's client to recursively create components from that (and only that) import source. Prior to this, the interface was given unrendered models for child elements. The imported module was then responsible for rendering them. This placed a large burden on the author to understand how to handle these unrendered child models. In addition, in the React template used by ``module_from_template`` we needed to import a version of -``idom-client-react`` from the CDN - this had already caused some issues where the -template required a version of ``idom-client-react`` in the which had not been released +``@reactpy/client`` from the CDN - this had already caused some issues where the +template required a version of ``@reactpy/client`` in the which had not been released yet. **Closed Issues** @@ -762,14 +762,14 @@ yet. - Examples broken in docs - :issue:`451` - Rework docs landing page - :issue:`446` - eventHandlers should be a mapping of generic callables - :issue:`423` -- Allow customization of built-in IDOM client - :issue:`253` +- Allow customization of built-in ReactPy client - :issue:`253` **Pull Requests** - move VdomDict and VdomJson to proto - :pull:`492` - only send error info in debug mode - :pull:`491` - correctly apply client-side JSON patch - :pull:`490` -- add script to set version of all packages in IDOM - :pull:`483` +- add script to set version of all packages in ReactPy - :pull:`483` - Pass import source to bind - :pull:`482` - Do not mutate client-side model - :pull:`481` - assume import source children come from same source - :pull:`479` @@ -795,7 +795,7 @@ See :ref:`Custom JavaScript Components` for details on the new interface. - Query params in package name for module_from_template not stripped - :issue:`455` - Make docs section margins larger - :issue:`450` - Search broken in docs - :issue:`443` -- Move src/idom/client out of Python package - :issue:`429` +- Move src/reactpy/client out of Python package - :issue:`429` - Use composition instead of classes async with Layout and LifeCycleHook - :issue:`412` - Remove Python language extension - :issue:`282` - Add keys to models so React doesn't complain of child arrays requiring them - @@ -818,12 +818,12 @@ v0.31.0 ------- :octicon:`milestone` *released on 2021-07-14* -The :class:`~idom.core.layout.Layout` is now a prototype, and ``Layout.update`` is no +The :class:`~reactpy.core.layout.Layout` is now a prototype, and ``Layout.update`` is no longer a public API. This is combined with a much more significant refactor of the underlying rendering logic. The biggest issue that has been resolved relates to the relationship between -:class:`~idom.core.hooks.LifeCycleHook` and ``Layout``. Previously, the +:class:`~reactpy.core.hooks.LifeCycleHook` and ``Layout``. Previously, the ``LifeCycleHook`` accepted a layout instance in its constructor and called ``Layout.update``. Additionally, the ``Layout`` would manipulate the ``LifeCycleHook.component`` attribute whenever the component instance changed after a @@ -883,23 +883,23 @@ runtime reliance on NPM. Doing so has many virtuous knock-on effects: are located, and as a result, it's also easier to coordinate the server and client code. 4. Alternate client implementations benefit from this simplicity. Now, it's possible to - install idom-client-react normally and write a ``loadImportSource()`` function that - looks for route serving the contents of `IDOM_WEB_MODULES_DIR.` + install @reactpy/client normally and write a ``loadImportSource()`` function that + looks for route serving the contents of `REACTPY_WEB_MODULES_DIR.` This change includes large breaking changes: - The CLI is being removed as it won't be needed any longer -- The `idom.client` is being removed in favor of a stripped down ``idom.web`` module -- The `IDOM_CLIENT_BUILD_DIR` config option will no longer exist and a new - ``IDOM_WEB_MODULES_DIR`` which only contains dynamically linked web modules. While +- The `reactpy.client` is being removed in favor of a stripped down ``reactpy.web`` module +- The `REACTPY_CLIENT_BUILD_DIR` config option will no longer exist and a new + ``REACTPY_WEB_MODULES_DIR`` which only contains dynamically linked web modules. While this new directory's location is configurable, it is meant to be transient and should not be re-used across sessions. -The new ``idom.web`` module takes a simpler approach to constructing import sources and +The new ``reactpy.web`` module takes a simpler approach to constructing import sources and expands upon the logic for resolving imports by allowing exports from URLs to be -discovered too. Now, that IDOM isn't using NPM to dynamically install component -libraries ``idom.web`` instead creates JS modules from template files and links them -into ``IDOM_WEB_MODULES_DIR``. These templates ultimately direct the browser to load the +discovered too. Now, that ReactPy isn't using NPM to dynamically install component +libraries ``reactpy.web`` instead creates JS modules from template files and links them +into ``REACTPY_WEB_MODULES_DIR``. These templates ultimately direct the browser to load the desired library from a CDN. **Pull Requests** @@ -908,7 +908,7 @@ desired library from a CDN. - Fix typo in index.rst - :pull:`411` - Add event handlers docs - :pull:`410` - Misc doc improvements - :pull:`409` -- Port first IDOM article to docs - :pull:`408` +- Port first ReactPy article to docs - :pull:`408` - Test build in CI - :pull:`404` - Remove all runtime reliance on NPM - :pull:`398` @@ -920,8 +920,8 @@ v0.29.0 Contains breaking changes, the most significant of which are: - Moves the runtime client build directory to a "user data" directory rather a directory - where IDOM's code was installed. This has the advantage of not requiring write - permissions to rebuild the client if IDOM was installed globally rather than in a + where ReactPy's code was installed. This has the advantage of not requiring write + permissions to rebuild the client if ReactPy was installed globally rather than in a virtual environment. - The custom JS component interface has been reworked to expose an API similar to the ``createElement``, ``render``, ``unmountComponentAtNode`` functions from React. @@ -955,7 +955,7 @@ Includes a wide variety of improvements: - support for the ``files`` attribute from the target of input elements - model children are passed to the Javascript ``mount()`` function - began to add tests to client-side javascript -- add a ``mountLayoutWithWebSocket`` function to ``idom-client-react`` +- add a ``mountLayoutWithWebSocket`` function to ``@reactpy/client`` and breaking changes, the most significant of which are: @@ -966,7 +966,7 @@ and breaking changes, the most significant of which are: concerns and common workspace scripts in ``package.json``. - Use a ``loadImportSource()`` function instead of trying to infer the path to dynamic modules which was brittle and inflexible. Allowing the specific client implementation - to discover where "import sources" are located means ``idom-client-react`` doesn't + to discover where "import sources" are located means ``@reactpy/client`` doesn't need to try and devise a solution that will work for all cases. The fallout from this change is the addition of `importSource.sourceType` which, for the moment can either be ``"NAME"`` or ``"URL"`` where the former indicates the client is expected to know @@ -1073,7 +1073,7 @@ its state do the same. In a future update, the default key for all elements and components will be its index with respect to its siblings in the layout. The -:attr:`~idom.config.IDOM_FEATURE_INDEX_AS_DEFAULT_KEY` feature flag has been introduced +:attr:`~reactpy.config.REACTPY_FEATURE_INDEX_AS_DEFAULT_KEY` feature flag has been introduced to allow users to enable this behavior early. **Highlighted Commits:** @@ -1110,15 +1110,15 @@ v0.23.0 - automatically reconnect to server - :commit:`3477e2b` - allow no reconnect in client - :commit:`ef263c2` - cleaner way to specify import sources - :commit:`ea19a07` -- add the idom-react-client back into the main repo - :commit:`5dcc3bb` +- add the reactpy-react-client back into the main repo - :commit:`5dcc3bb` - implement fastapi render server - :commit:`94e0620` -- improve docstring for IDOM_CLIENT_BUILD_DIR - :commit:`962d885` +- improve docstring for REACTPY_CLIENT_BUILD_DIR - :commit:`962d885` - cli improvements - :commit:`788fd86` - rename SERIALIZED_VDOM_JSON_SCHEMA to VDOM_JSON_SCHEMA - :commit:`74ad578` - better logging for modules - :commit:`39565b9` - move client utils into private module - :commit:`f825e96` -- redirect BUILD_DIR imports to IDOM_CLIENT_BUILD_DIR option - :commit:`53fb23b` +- redirect BUILD_DIR imports to REACTPY_CLIENT_BUILD_DIR option - :commit:`53fb23b` - upgrade snowpack - :commit:`5697a2d` -- better logs for idom.run + flask server - :commit:`2b34e3d` +- better logs for reactpy.run + flask server - :commit:`2b34e3d` - move package to src dir - :commit:`066c9c5` -- idom restore uses backup - :commit:`773f78e` +- reactpy restore uses backup - :commit:`773f78e` diff --git a/docs/source/about/contributor-guide.rst b/docs/source/about/contributor-guide.rst index f0eb39711..11ff79a43 100644 --- a/docs/source/about/contributor-guide.rst +++ b/docs/source/about/contributor-guide.rst @@ -4,11 +4,11 @@ Contributor Guide .. note:: The - `Code of Conduct `__ + `Code of Conduct `__ applies in all community spaces. If you are not familiar with our Code of Conduct policy, take a minute to read it before making your first contribution. -The IDOM team welcomes contributions and contributors of all kinds - whether they come +The ReactPy team welcomes contributions and contributors of all kinds - whether they come as code changes, participation in the discussions, opening issues and pointing out bugs, or simply sharing your work with your colleagues and friends. We're excited to see how you can help move this project and community forward! @@ -23,7 +23,7 @@ Trust us, there's so many ways to support the project. We're always looking for who can: - Improve our documentation -- Teach and tell others about IDOM +- Teach and tell others about ReactPy - Share ideas for new features - Report bugs - Participate in general discussions @@ -35,13 +35,13 @@ we'll help you make your first contribution. Making a Pull Request --------------------- -To make your first code contribution to IDOM, you'll need to install Git_ (or +To make your first code contribution to ReactPy, you'll need to install Git_ (or `Git Bash`_ on Windows). Thankfully there are many helpful `tutorials `__ -about how to get started. To make a change to IDOM you'll do the following: +about how to get started. To make a change to ReactPy you'll do the following: -`Fork IDOM `__: - Go to `this URL `__ and click the "Fork" button. +`Fork ReactPy `__: + Go to `this URL `__ and click the "Fork" button. `Clone your fork `__: You use a ``git clone`` command to copy the code from GitHub to your computer. @@ -50,10 +50,10 @@ about how to get started. To make a change to IDOM you'll do the following: You'll ``git checkout -b your-first-branch`` to create a new space to start your work. :ref:`Prepare your Development Environment `: - We explain in more detail below how to install all IDOM's dependencies. + We explain in more detail below how to install all ReactPy's dependencies. `Push your changes `__: - Once you've made changes to IDOM, you'll ``git push`` them to your fork. + Once you've made changes to ReactPy, you'll ``git push`` them to your fork. :ref:`Create a changelog entry `: Record your changes in the :ref:`changelog` so we can publicize them in the next release. @@ -72,7 +72,7 @@ Development Environment If you have any questions during set up or development post on our :discussion-type:`discussion board ` and we'll answer them. -In order to develop IDOM locally you'll first need to install the following: +In order to develop ReactPy locally you'll first need to install the following: .. list-table:: :header-rows: 1 @@ -103,8 +103,8 @@ Once done, you can clone a local copy of this repository: .. code-block:: bash - git clone https://github.com/idom-team/idom.git - cd idom + git clone https://github.com/reactive-python/reactpy.git + cd reactpy Then, you should be able to run the command below to: @@ -118,7 +118,7 @@ Then, you should be able to run the command below to: pip install -e . -r requirements.txt && pre-commit install -If you modify any Javascript, you'll need to re-install IDOM: +If you modify any Javascript, you'll need to re-install ReactPy: .. code-block:: bash @@ -131,7 +131,7 @@ However you may also ``cd`` to the ``src/client`` directory which contains a Running The Tests ----------------- -The test suite for IDOM is executed with Nox_, which should already be installed if you +The test suite for ReactPy is executed with Nox_, which should already be installed if you followed the `earlier instructions `_. The suite covers: 1. Server-side Python code with PyTest_ @@ -182,7 +182,7 @@ The following are currently being used: - Prettier_ - a tool for automatically formatting various file types The most strict measure of quality enforced on the codebase is 100% test coverage in -Python files. This means that every line of coded added to IDOM requires a test case +Python files. This means that every line of coded added to ReactPy requires a test case that exercises it. This doesn't prevent all bugs, but it should ensure that we catch the most common ones. @@ -233,7 +233,7 @@ Creating a Changelog Entry -------------------------- As part of your pull request, you'll want to edit the `Changelog -`__ by +`__ by adding an entry describing what you've changed or improved. You should write an entry in the style of `Keep a Changelog `__ that falls under one of the following categories, and add it to the :ref:`Unreleased` section of the changelog: @@ -276,7 +276,7 @@ changelog entry might look like: Release Process --------------- -Creating a release for IDOM involves two steps: +Creating a release for ReactPy involves two steps: 1. Tagging a version 2. Publishing a release @@ -308,19 +308,19 @@ use GitHub's "Auto-generated release notes". Other Core Repositories ----------------------- -IDOM depends on, or is used by several other core projects. For documentation on them +ReactPy depends on, or is used by several other core projects. For documentation on them you should refer to their respective documentation in the links below: -- `idom-react-component-cookiecutter - `__ - Template repo +- `reactpy-react-component-cookiecutter + `__ - Template repo for making :ref:`Custom Javascript Components`. -- `flake8-idom-hooks `__ - Enforces the +- `flake8-reactpy-hooks `__ - Enforces the :ref:`Rules of Hooks` -- `idom-jupyter `__ - IDOM integration for +- `reactpy-jupyter `__ - ReactPy integration for Jupyter -- `idom-dash `__ - IDOM integration for Plotly +- `reactpy-dash `__ - ReactPy integration for Plotly Dash -- `django-idom `__ - IDOM integration for +- `django-reactpy `__ - ReactPy integration for Django .. Links @@ -332,7 +332,7 @@ you should refer to their respective documentation in the links below: .. _Git: https://git-scm.com/book/en/v2/Getting-Started-Installing-Git .. _Git Bash: https://gitforwindows.org/ .. _NPM: https://www.npmjs.com/get-npm -.. _PyPI: https://pypi.org/project/idom +.. _PyPI: https://pypi.org/project/reactpy .. _pip: https://pypi.org/project/pip/ .. _PyTest: pytest `__ license. While many things have been transformed, we paraphrase and, in some places, -copy language or examples where IDOM's behavior mirrors that of React's. +copy language or examples where ReactPy's behavior mirrors that of React's. Source Code License diff --git a/docs/source/conf.py b/docs/source/conf.py index 3b065f987..71364b00d 100644 --- a/docs/source/conf.py +++ b/docs/source/conf.py @@ -25,37 +25,37 @@ # -- Project information ----------------------------------------------------- -project = "IDOM" -title = "IDOM Docs" +project = "ReactPy" +title = "ReactPy" description = ( - "IDOM is a Python web framework for building interactive websites without needing " + "ReactPy is a Python web framework for building interactive websites without needing " "a single line of Javascript. It can be run standalone, in a Jupyter Notebook, or " "as part of an existing application." ) -copyright = "2020, Ryan Morshead" +copyright = "2023, Ryan Morshead" author = "Ryan Morshead" # -- Common External Links --------------------------------------------------- extlinks = { "issue": ( - "https://github.com/idom-team/idom/issues/%s", + "https://github.com/reactive-python/reactpy/issues/%s", "#", ), "pull": ( - "https://github.com/idom-team/idom/pull/%s", + "https://github.com/reactive-python/reactpy/pull/%s", "#", ), "discussion": ( - "https://github.com/idom-team/idom/discussions/%s", + "https://github.com/reactive-python/reactpy/discussions/%s", "#", ), "discussion-type": ( - "https://github.com/idom-team/idom/discussions/categories/%s", + "https://github.com/reactive-python/reactpy/discussions/categories/%s", "", ), "commit": ( - "https://github.com/idom-team/idom/commit/%s", + "https://github.com/reactive-python/reactpy/commit/%s", "", ), } @@ -87,9 +87,9 @@ "async_doctest", "autogen_api_docs", "copy_vdom_json_schema", - "idom_view", + "reactpy_view", "patched_html_translator", - "idom_example", + "reactpy_example", "build_custom_js", "custom_autosectionlabel", ] @@ -163,8 +163,8 @@ # -- sphinxext.opengraph -- -ogp_site_url = "https://idom-docs.herokuapp.com/" -ogp_image = "https://raw.githubusercontent.com/idom-team/idom/main/branding/png/idom-logo-black.png" +ogp_site_url = "https://reactpy-docs.herokuapp.com/" +ogp_image = "https://raw.githubusercontent.com/reactive-python/reactpy/main/branding/png/reactpy-logo-padded.png" # We manually specify this below # ogp_description_length = 200 ogp_type = "website" @@ -188,14 +188,27 @@ # a list of builtin themes. # html_theme = "furo" -html_logo = str(ROOT_DIR / "branding" / "svg" / "idom-logo.svg") -html_favicon = str(ROOT_DIR / "branding" / "svg" / "idom-logo-square-small.svg") +html_logo = str(ROOT_DIR / "branding" / "reactpy-logo-wide.svg") +html_favicon = str(ROOT_DIR / "branding" / "reactpy-logo.ico") # Theme options are theme-specific and customize the look and feel of a theme # further. For a list of options available for each theme, see the # documentation. -# -# html_theme_options = {} + +html_theme_options = { + "light_css_variables": { + # furo + "admonition-title-font-size": "1rem", + "admonition-font-size": "1rem", + # sphinx-design + "sd-color-info": "var(--color-admonition-title-background--note)", + "sd-color-warning": "var(--color-admonition-title-background--warning)", + "sd-color-danger": "var(--color-admonition-title-background--danger)", + "sd-color-info-text": "var(--color-admonition-title--note)", + "sd-color-warning-text": "var(--color-admonition-title--warning)", + "sd-color-danger-text": "var(--color-admonition-title--danger)", + }, +} # Add any paths that contain custom static files (such as style sheets) here, # relative to this directory. They are copied after the builtin static files, @@ -232,7 +245,7 @@ # -- Options for HTMLHelp output --------------------------------------------- # Output file base name for HTML help builder. -htmlhelp_basename = "IDOMdoc" +htmlhelp_basename = "ReactPydoc" # -- Options for LaTeX output ------------------------------------------------ @@ -255,14 +268,14 @@ # Grouping the document tree into LaTeX files. List of tuples # (source start file, target name, title, # author, documentclass [howto, manual, or own class]). -latex_documents = [(master_doc, "IDOM.tex", html_title, "Ryan Morshead", "manual")] +latex_documents = [(master_doc, "ReactPy.tex", html_title, "Ryan Morshead", "manual")] # -- Options for manual page output ------------------------------------------ # One entry per manual page. List of tuples # (source start file, name, description, authors, manual section). -man_pages = [(master_doc, "idom", html_title, [author], 1)] +man_pages = [(master_doc, "reactpy", html_title, [author], 1)] # -- Options for Texinfo output ---------------------------------------------- @@ -273,10 +286,10 @@ texinfo_documents = [ ( master_doc, - "IDOM", + "ReactPy", html_title, author, - "IDOM", + "ReactPy", "One line description of project.", "Miscellaneous", ) diff --git a/docs/source/guides/adding-interactivity/components-with-state/_examples/adding_state_variable/main.py b/docs/source/guides/adding-interactivity/components-with-state/_examples/adding_state_variable/main.py index bbadfb06e..860cd093b 100644 --- a/docs/source/guides/adding-interactivity/components-with-state/_examples/adding_state_variable/main.py +++ b/docs/source/guides/adding-interactivity/components-with-state/_examples/adding_state_variable/main.py @@ -1,7 +1,7 @@ import json from pathlib import Path -from idom import component, hooks, html, run +from reactpy import component, hooks, html, run HERE = Path(__file__) diff --git a/docs/source/guides/adding-interactivity/components-with-state/_examples/isolated_state/main.py b/docs/source/guides/adding-interactivity/components-with-state/_examples/isolated_state/main.py index 2434f5239..3149e6396 100644 --- a/docs/source/guides/adding-interactivity/components-with-state/_examples/isolated_state/main.py +++ b/docs/source/guides/adding-interactivity/components-with-state/_examples/isolated_state/main.py @@ -1,7 +1,7 @@ import json from pathlib import Path -from idom import component, hooks, html, run +from reactpy import component, hooks, html, run HERE = Path(__file__) diff --git a/docs/source/guides/adding-interactivity/components-with-state/_examples/multiple_state_variables/main.py b/docs/source/guides/adding-interactivity/components-with-state/_examples/multiple_state_variables/main.py index 2ab39e5e0..3d31b1bfa 100644 --- a/docs/source/guides/adding-interactivity/components-with-state/_examples/multiple_state_variables/main.py +++ b/docs/source/guides/adding-interactivity/components-with-state/_examples/multiple_state_variables/main.py @@ -1,7 +1,7 @@ import json from pathlib import Path -from idom import component, hooks, html, run +from reactpy import component, hooks, html, run HERE = Path(__file__) diff --git a/docs/source/guides/adding-interactivity/components-with-state/_examples/when_variables_are_not_enough/main.py b/docs/source/guides/adding-interactivity/components-with-state/_examples/when_variables_are_not_enough/main.py index 7558fc328..c617586de 100644 --- a/docs/source/guides/adding-interactivity/components-with-state/_examples/when_variables_are_not_enough/main.py +++ b/docs/source/guides/adding-interactivity/components-with-state/_examples/when_variables_are_not_enough/main.py @@ -7,7 +7,7 @@ import json from pathlib import Path -from idom import component, html, run +from reactpy import component, html, run HERE = Path(__file__) diff --git a/docs/source/guides/adding-interactivity/components-with-state/index.rst b/docs/source/guides/adding-interactivity/components-with-state/index.rst index 5317b98a2..f8235ac0d 100644 --- a/docs/source/guides/adding-interactivity/components-with-state/index.rst +++ b/docs/source/guides/adding-interactivity/components-with-state/index.rst @@ -5,7 +5,7 @@ Components often need to change what’s on the screen as a result of an interac example, typing into the form should update the input field, clicking “next” on an image carousel should change which image is displayed, clicking “buy” should put a product in the shopping cart. Components need to “remember” things like the current input value, -the current image, the shopping cart. In IDOM, this kind of component-specific memory is +the current image, the shopping cart. In ReactPy, this kind of component-specific memory is called state. @@ -16,7 +16,7 @@ Below is a gallery of images about sculpture. Clicking the "Next" button should increment the ``index`` and, as a result, change what image is displayed. However, this does not work: -.. idom:: _examples/when_variables_are_not_enough +.. reactpy:: _examples/when_variables_are_not_enough .. note:: @@ -36,10 +36,10 @@ that still wouldn't fix the underlying problems: destroyed when it updates. 2. **Changes to local variables do not cause components to re-render** - there's no way - for IDOM to observe when these variables change. Thus IDOM is not aware that + for ReactPy to observe when these variables change. Thus ReactPy is not aware that something has changed and that a re-render should take place. -To address these problems, IDOM provides the :func:`~idom.core.hooks.use_state` "hook" +To address these problems, ReactPy provides the :func:`~reactpy.core.hooks.use_state` "hook" which provides: 1. A **state variable** whose data is retained across renders. @@ -51,12 +51,12 @@ which provides: Adding State to Components -------------------------- -To create a state variable and state setter with :func:`~idom.core.hooks.use_state` hook +To create a state variable and state setter with :func:`~reactpy.core.hooks.use_state` hook as described above, we'll begin by importing it: .. testcode:: - from idom import use_state + from reactpy import use_state Then we'll make the following changes to our code :ref:`from before `: @@ -84,16 +84,16 @@ After making those changes we should get: We'll talk more about what this is doing :ref:`shortly `, but for now let's just verify that this does in fact fix the problems from before: -.. idom:: _examples/adding_state_variable +.. reactpy:: _examples/adding_state_variable Your First Hook --------------- -In IDOM, ``use_state``, as well as any other function whose name starts with ``use``, is -called a "hook". These are special functions that should only be called while IDOM is +In ReactPy, ``use_state``, as well as any other function whose name starts with ``use``, is +called a "hook". These are special functions that should only be called while ReactPy is :ref:`rendering `. They let you "hook into" the different -capabilities of IDOM's components of which ``use_state`` is just one (well get into the +capabilities of ReactPy's components of which ``use_state`` is just one (well get into the other :ref:`later `). While hooks are just normal functions, but it's helpful to think of them as @@ -107,7 +107,7 @@ words, you'll "use" hooks at the top of your component in the same way you might Introduction to ``use_state`` ----------------------------- -When you call :func:`~idom.core.hooks.use_state` inside the body of a component's render +When you call :func:`~reactpy.core.hooks.use_state` inside the body of a component's render function, you're declaring that this component needs to remember something. That "something" which needs to be remembered, is known as **state**. So when we look at an assignment expression like the one below @@ -156,7 +156,7 @@ below highlights a line of code where something of interest occurs: :emphasize-lines: 2 At this point, we've just begun to render the ``Gallery`` component. As yet, - IDOM is not aware that this component has any state or what view it will + ReactPy is not aware that this component has any state or what view it will display. This will change in a moment though when we move to the next line... .. tab-item:: 2 @@ -169,7 +169,7 @@ below highlights a line of code where something of interest occurs: :lines: 12-33 :emphasize-lines: 3 - The ``Gallery`` component has just declared some state. IDOM now knows that it + The ``Gallery`` component has just declared some state. ReactPy now knows that it must remember the ``index`` and trigger an update of this component when ``set_index`` is called. Currently the value of ``index`` is ``0`` as per the default value given to ``use_state``. Thus, the resulting view will display @@ -216,7 +216,7 @@ below highlights a line of code where something of interest occurs: :lines: 12-33 :emphasize-lines: 5 - A user has just clicked the button 🖱️! IDOM has sent information about the event + A user has just clicked the button 🖱️! ReactPy has sent information about the event to the ``handle_click`` function and it is about to execute. In a moment we will update the state of this component and schedule a re-render. @@ -230,7 +230,7 @@ below highlights a line of code where something of interest occurs: :lines: 12-33 :emphasize-lines: 6 - We've just now told IDOM that we want to update the state of our ``Gallery`` and + We've just now told ReactPy that we want to update the state of our ``Gallery`` and that it needs to be re-rendered. More specifically, we are incrementing its ``index``, and once ``Gallery`` re-renders the index *will* be ``1``. Importantly, at this point, the value of ``index`` is still ``0``! This will @@ -246,7 +246,7 @@ below highlights a line of code where something of interest occurs: :lines: 12-33 :emphasize-lines: 2 - The scheduled re-render of ``Gallery`` has just begun. IDOM has now updated its + The scheduled re-render of ``Gallery`` has just begun. ReactPy has now updated its internal state store such that, the next time we call ``use_state`` we will get back the updated value of ``index``. @@ -260,8 +260,8 @@ below highlights a line of code where something of interest occurs: :lines: 12-33 :emphasize-lines: 3 - With IDOM's state store updated, as we call ``use_state``, instead of returning - ``0`` for the value of ``index`` as it did before, IDOM now returns the value + With ReactPy's state store updated, as we call ``use_state``, instead of returning + ``0`` for the value of ``index`` as it did before, ReactPy now returns the value ``1``. With this change the view we display will be altered - instead of displaying data for the first item in our ``sculpture_data`` list we will now display information about the second. @@ -293,14 +293,14 @@ below highlights a line of code where something of interest occurs: Multiple State Declarations --------------------------- -The powerful thing about hooks like :func:`~idom.core.hooks.use_state` is that you're +The powerful thing about hooks like :func:`~reactpy.core.hooks.use_state` is that you're not limited to just one state declaration. You can call ``use_state()`` as many times as you need to in one component. For example, in the example below we've added a ``show_more`` state variable along with a few other modifications (e.g. renaming ``handle_click``) to make the description for each sculpture optionally displayed. Only when the user clicks the "Show details" button is this description shown: -.. idom:: _examples/multiple_state_variables +.. reactpy:: _examples/multiple_state_variables It's generally a good idea to define separate state variables if the data they represent is unrelated. In this case, ``index`` corresponds to what sculpture information is being @@ -326,7 +326,7 @@ In this example, the ``Gallery`` component from earlier is rendered twice with n changes to its logic. Try clicking the buttons inside each of the galleries. Notice that their state is independent: -.. idom:: _examples/isolated_state +.. reactpy:: _examples/isolated_state :result-is-default-tab: This is what makes state different from regular variables that you might declare at the @@ -347,5 +347,5 @@ remove it without impacting the rest of the components. ^^^^^^^^^^^^^^^^^^^^^^^^^ What if you wanted both galleries to keep their states in sync? The right way to do - it in IDOM is to remove state from child components and add it to their closest + it in ReactPy is to remove state from child components and add it to their closest shared parent. diff --git a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/dict_remove.py b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/dict_remove.py index c3ca24266..6c3c783da 100644 --- a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/dict_remove.py +++ b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/dict_remove.py @@ -1,4 +1,4 @@ -from idom import component, html, run, use_state +from reactpy import component, html, run, use_state @component diff --git a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/dict_update.py b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/dict_update.py index 518bd3132..32dd4073a 100644 --- a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/dict_update.py +++ b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/dict_update.py @@ -1,4 +1,4 @@ -from idom import component, html, run, use_state +from reactpy import component, html, run, use_state @component diff --git a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_insert.py b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_insert.py index 98617e341..1f4072e0b 100644 --- a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_insert.py +++ b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_insert.py @@ -1,4 +1,4 @@ -from idom import component, html, run, use_state +from reactpy import component, html, run, use_state @component diff --git a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_re_order.py b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_re_order.py index 37ce97f7d..b3bf5a85a 100644 --- a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_re_order.py +++ b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_re_order.py @@ -1,4 +1,4 @@ -from idom import component, html, run, use_state +from reactpy import component, html, run, use_state @component diff --git a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_remove.py b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_remove.py index 3a9126802..6223284f6 100644 --- a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_remove.py +++ b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_remove.py @@ -1,4 +1,4 @@ -from idom import component, html, run, use_state +from reactpy import component, html, run, use_state @component diff --git a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_replace.py b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_replace.py index ce9ae1aec..4952b9597 100644 --- a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_replace.py +++ b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/list_replace.py @@ -1,4 +1,4 @@ -from idom import component, html, run, use_state +from reactpy import component, html, run, use_state @component diff --git a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/moving_dot.py b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/moving_dot.py index 6e5e66b67..e5ab54dca 100644 --- a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/moving_dot.py +++ b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/moving_dot.py @@ -1,4 +1,4 @@ -from idom import component, html, run, use_state +from reactpy import component, html, run, use_state @component diff --git a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/moving_dot_broken.py b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/moving_dot_broken.py index 68198c93a..8972ce74e 100644 --- a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/moving_dot_broken.py +++ b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/moving_dot_broken.py @@ -1,6 +1,6 @@ # :linenos: -from idom import component, html, run, use_state +from reactpy import component, html, run, use_state @component diff --git a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/set_remove.py b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/set_remove.py index a56eaa9ab..be5366cb2 100644 --- a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/set_remove.py +++ b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/set_remove.py @@ -1,4 +1,4 @@ -from idom import component, html, run, use_state +from reactpy import component, html, run, use_state @component diff --git a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/set_update.py b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/set_update.py index 0d38462fa..8ff2e1ca4 100644 --- a/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/set_update.py +++ b/docs/source/guides/adding-interactivity/dangers-of-mutability/_examples/set_update.py @@ -1,4 +1,4 @@ -from idom import component, html, run, use_state +from reactpy import component, html, run, use_state @component diff --git a/docs/source/guides/adding-interactivity/dangers-of-mutability/index.rst b/docs/source/guides/adding-interactivity/dangers-of-mutability/index.rst index 80a4e6a04..35dfe580a 100644 --- a/docs/source/guides/adding-interactivity/dangers-of-mutability/index.rst +++ b/docs/source/guides/adding-interactivity/dangers-of-mutability/index.rst @@ -2,7 +2,7 @@ Dangers of Mutability ===================== While state can hold any type of value, you should be careful to avoid directly -modifying objects that you declare as state with IDOM. In other words, you must not +modifying objects that you declare as state with ReactPy. In other words, you must not :ref:`"mutate" ` values which are held as state. Rather, to change these values you should use new ones or create copies. @@ -51,13 +51,13 @@ have not had to consider the consiquences of mutations. Why Avoid Mutation? ------------------- -Unfortunately, IDOM does not understand that when a value is mutated, it may have +Unfortunately, ReactPy does not understand that when a value is mutated, it may have changed. As a result, mutating values will not trigger re-renders. Thus, you must be -careful to avoid mutation whenever you want IDOM to re-render a component. For example, +careful to avoid mutation whenever you want ReactPy to re-render a component. For example, the intention of the code below is to make the red dot move when you touch or hover over the preview area. However it doesn't - the dot remains stationary: -.. idom:: _examples/moving_dot_broken +.. reactpy:: _examples/moving_dot_broken The problem is with this section of code: @@ -68,7 +68,7 @@ The problem is with this section of code: :lineno-start: 13 This code mutates the ``position`` dictionary from the prior render instead of using the -state variable's associated state setter. Without calling setter IDOM has no idea that +state variable's associated state setter. Without calling setter ReactPy has no idea that the variable's data has been modified. While it can be possible to get away with mutating state variables, it's highly dicsouraged. Doing so can cause strange and unpredictable behavior. As a result, you should always treat the data within a state @@ -80,7 +80,7 @@ call it by passing a *new* dictionary with the values for the next render. Notic by making these alterations to the code, that the dot now follows your pointer when you touch or hover over the preview: -.. idom:: _examples/moving_dot +.. reactpy:: _examples/moving_dot .. dropdown:: Local mutation can be alright @@ -208,7 +208,7 @@ updating user information with a preview of the currently entered data. We can accomplish this using `"unpacking" `__ with the ``**`` syntax: -.. idom:: _examples/dict_update +.. reactpy:: _examples/dict_update .. _removing-dictionary-items: @@ -249,7 +249,7 @@ set of keys. One way to do this is with a dictionary comprehension. The example shows an interface where you're able to enter a new term and definition. Once added, you can click a delete button to remove the term and definition: -.. idom:: _examples/dict_remove +.. reactpy:: _examples/dict_remove Working with Lists @@ -349,7 +349,7 @@ the items we want to append instead. There are several ways to do this for one o values however it's often simplest to use `"unpacking" `__ with the ``*`` syntax. -.. idom:: _examples/list_insert +.. reactpy:: _examples/list_insert .. _removing-list-items: @@ -378,7 +378,7 @@ not quite as clean. You must select the portion the list prior to the item which be removed (``l[:index]``) and the portion after the item (``l[index + 1:]``) and add them together: -.. idom:: _examples/list_remove +.. reactpy:: _examples/list_remove .. _replacing-list-items: @@ -409,7 +409,7 @@ must select the portion before and after the item in question. But this time, in of adding those two selections together, you must insert that values you want to replace between them: -.. idom:: _examples/list_replace +.. reactpy:: _examples/list_replace .. _re-ordering-list-items: @@ -441,7 +441,7 @@ list object, you should use the builtin functions :func:`sorted` and :func:`reve and pass the resulting iterator into the :class:`list` constructor to create a sorted or reversed copy of the given list: -.. idom:: _examples/list_re_order +.. reactpy:: _examples/list_re_order Working with Sets @@ -512,7 +512,7 @@ or operator ``|`` serves as a succinct way to compute the union of two sets. How you should be careful to not use an in-place assignment with this operator as that will (counterintuitively) mutate the original set rather than creating a new one. -.. idom:: _examples/set_update +.. reactpy:: _examples/set_update .. _removing-set-items: @@ -558,7 +558,7 @@ methods to return new sets without mutating them. As before when :ref:`adding se you need to avoid using the inline assignment operators since that will (counterintuitively) mutate the original set rather than given you a new one: -.. idom:: _examples/set_remove +.. reactpy:: _examples/set_remove Useful Packages diff --git a/docs/source/guides/adding-interactivity/index.rst b/docs/source/guides/adding-interactivity/index.rst index a09db3f51..5f08bc5e4 100644 --- a/docs/source/guides/adding-interactivity/index.rst +++ b/docs/source/guides/adding-interactivity/index.rst @@ -56,11 +56,11 @@ Adding Interactivity Section 1: Responding to Events ------------------------------- -IDOM lets you add event handlers to your parts of the interface. This means that you can +ReactPy lets you add event handlers to your parts of the interface. This means that you can define synchronous or asynchronous functions that are triggered when a particular user interaction occurs like clicking, hovering, of focusing on form inputs, and more. -.. idom:: responding-to-events/_examples/button_prints_message +.. reactpy:: responding-to-events/_examples/button_prints_message It may feel weird to define a function within a function like this, but doing so allows the ``handle_event`` function to access information from within the scope of the @@ -85,16 +85,16 @@ Components often need to change what’s on the screen as a result of an interac example, typing into the form should update the input field, clicking a “Comment” button should bring up a text input field, clicking “Buy” should put a product in the shopping cart. Components need to “remember” things like the current input value, the current -image, the shopping cart. In IDOM, this kind of component-specific memory is created and +image, the shopping cart. In ReactPy, this kind of component-specific memory is created and updated with a "hook" called ``use_state()`` that creates a **state variable** and **state setter** respectively: -.. idom:: components-with-state/_examples/adding_state_variable +.. reactpy:: components-with-state/_examples/adding_state_variable -In IDOM, ``use_state``, as well as any other function whose name starts with ``use``, is -called a "hook". These are special functions that should only be called while IDOM is +In ReactPy, ``use_state``, as well as any other function whose name starts with ``use``, is +called a "hook". These are special functions that should only be called while ReactPy is :ref:`rendering `. They let you "hook into" the different -capabilities of IDOM's components of which ``use_state`` is just one (well get into the +capabilities of ReactPy's components of which ``use_state`` is just one (well get into the other :ref:`later `). .. card:: @@ -122,7 +122,7 @@ which owns the state. set_count(count + 1) # schedule a re-render where count is 1 print(count) # still prints: 0 -This behavior of IDOM means that each render of a component is like taking a snapshot of +This behavior of ReactPy means that each render of a component is like taking a snapshot of the UI based on the component's state at that time. Treating state in this way can help reduce subtle bugs. For instance, in the code below there's a simple chat app with a message input and recipient selector. The catch is that the message actually gets sent 5 @@ -130,7 +130,7 @@ seconds after the "Send" button is clicked. So what would happen if we changed t recipient between the time the "Send" button was clicked and the moment the message is actually sent? -.. idom:: state-as-a-snapshot/_examples/print_chat_message +.. reactpy:: state-as-a-snapshot/_examples/print_chat_message As it turns out, changing the message recipient after pressing send does not change where the message ulitmately goes. However, one could imagine a bug where the recipient @@ -138,7 +138,7 @@ of a message is determined at the time the message is sent rather than at the ti "Send" button it clicked. Thus changing the recipient after pressing send would change where the message got sent. -In many cases, IDOM avoids this class of bug entirely because it treats state as a +In many cases, ReactPy avoids this class of bug entirely because it treats state as a snapshot. .. card:: @@ -159,10 +159,10 @@ changes to state only take effect in the next render, not in the current one. Fu changes to state are batched, calling a particular state setter 3 times won't trigger 3 renders, it will only trigger 1. This means that multiple state assignments are batched - so long as the event handler is synchronous (i.e. the event handler is not an -``async`` function), IDOM waits until all the code in an event handler has run before +``async`` function), ReactPy waits until all the code in an event handler has run before processing state and starting the next render: -.. idom:: multiple-state-updates/_examples/set_color_3_times +.. reactpy:: multiple-state-updates/_examples/set_color_3_times Sometimes though, you need to update a state variable more than once before the next render. In these cases, instead of having updates batched, you instead want them to be @@ -172,7 +172,7 @@ To accomplish this, instead of passing the next state value directly (e.g. ``compute_new_state(old_state)`` to the state setter (e.g. ``set_state(compute_new_state)``): -.. idom:: multiple-state-updates/_examples/set_state_function +.. reactpy:: multiple-state-updates/_examples/set_state_function .. card:: :link: multiple-state-updates/index @@ -188,17 +188,17 @@ Section 5: Dangers of Mutability -------------------------------- While state can hold any type of value, you should be careful to avoid directly -modifying objects that you declare as state with IDOM. In other words, you must not +modifying objects that you declare as state with ReactPy. In other words, you must not :ref:`"mutate" ` values which are held as state. Rather, to change these values you should use new ones or create copies. -This is because IDOM does not understand that when a value is mutated, it may have +This is because ReactPy does not understand that when a value is mutated, it may have changed. As a result, mutating values will not trigger re-renders. Thus, you must be -careful to avoid mutation whenever you want IDOM to re-render a component. For example, +careful to avoid mutation whenever you want ReactPy to re-render a component. For example, instead of mutating dictionaries to update their items you should instead create a copy that contains the desired changes: -.. idom:: dangers-of-mutability/_examples/dict_update +.. reactpy:: dangers-of-mutability/_examples/dict_update .. card:: :link: dangers-of-mutability/index diff --git a/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/delay_before_count_updater.py b/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/delay_before_count_updater.py index 77a723b03..e53c5b1ad 100644 --- a/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/delay_before_count_updater.py +++ b/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/delay_before_count_updater.py @@ -1,6 +1,6 @@ import asyncio -from idom import component, html, run, use_state +from reactpy import component, html, run, use_state @component diff --git a/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/delay_before_set_count.py b/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/delay_before_set_count.py index f3df72475..bb64724f1 100644 --- a/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/delay_before_set_count.py +++ b/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/delay_before_set_count.py @@ -1,6 +1,6 @@ import asyncio -from idom import component, html, run, use_state +from reactpy import component, html, run, use_state @component diff --git a/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/set_color_3_times.py b/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/set_color_3_times.py index d4c8f3e77..59d7d0f20 100644 --- a/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/set_color_3_times.py +++ b/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/set_color_3_times.py @@ -1,4 +1,4 @@ -from idom import component, html, run, use_state +from reactpy import component, html, run, use_state @component diff --git a/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/set_state_function.py b/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/set_state_function.py index cdf8931fe..56bbe80e3 100644 --- a/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/set_state_function.py +++ b/docs/source/guides/adding-interactivity/multiple-state-updates/_examples/set_state_function.py @@ -1,4 +1,4 @@ -from idom import component, html, run, use_state +from reactpy import component, html, run, use_state def increment(old_number): diff --git a/docs/source/guides/adding-interactivity/multiple-state-updates/index.rst b/docs/source/guides/adding-interactivity/multiple-state-updates/index.rst index 73524e173..6cfc415cd 100644 --- a/docs/source/guides/adding-interactivity/multiple-state-updates/index.rst +++ b/docs/source/guides/adding-interactivity/multiple-state-updates/index.rst @@ -15,16 +15,16 @@ This is why, in the example below, even though it might seem like clicking the "Increment" button would cause the ``number`` to increase by ``3``, it only does by ``1``: -.. idom:: ../state-as-a-snapshot/_examples/set_counter_3_times +.. reactpy:: ../state-as-a-snapshot/_examples/set_counter_3_times The reason this happens is because, so long as the event handler is synchronous (i.e. -the event handler is not an ``async`` function), IDOM waits until all the code in an +the event handler is not an ``async`` function), ReactPy waits until all the code in an event handler has run before processing state and starting the next render. Thus, it's the last call to a given state setter that matters. In the example below, even though we set the color of the button to ``"orange"`` and then ``"pink"`` before ``"blue"``, the color does not quickly flash orange and pink before blue - it alway remains blue: -.. idom:: _examples/set_color_3_times +.. reactpy:: _examples/set_color_3_times This behavior let's you make multiple state changes without triggering unnecessary renders or renders with inconsistent state where only some of the variables have been @@ -33,13 +33,13 @@ handlers have finished running. .. note:: - For asynchronous event handlers, IDOM will not render until you ``await`` something. + For asynchronous event handlers, ReactPy will not render until you ``await`` something. As we saw in :ref:`prior examples `, if you introduce an asynchronous delay to an event handler after changing state, renders may take place before the remainder of the event handler completes. However, state variables within handlers, even async ones, always remains static. -This behavior of IDOM to "batch" state changes that take place inside a single event +This behavior of ReactPy to "batch" state changes that take place inside a single event handler, do not extend across event handlers. In other words, distinct events will always produce distinct renders. To give an example, if clicking a button increments a counter by one, no matter how fast the user clicks, the view will never jump from 1 to 3 @@ -77,9 +77,9 @@ In our case, ``new_state = old_state + 1``. So we might define: Which we can use to replace ``set_number(number + 1)`` with ``set_number(increment)``: -.. idom:: _examples/set_state_function +.. reactpy:: _examples/set_state_function -The way to think about how IDOM runs though this series of ``set_state(increment)`` +The way to think about how ReactPy runs though this series of ``set_state(increment)`` calls is to imagine that each one updates the internally managed state with its return value, then that return value is being passed to the next updater function. Ultimately, this is functionally equivalent to the following: @@ -94,14 +94,14 @@ introduced a delay before ``set_number(number + 1)``. What would happen if we cl the "Increment" button more than once before the delay in the first triggered event completed? -.. idom:: _examples/delay_before_set_count +.. reactpy:: _examples/delay_before_set_count From an :ref:`earlier lesson `, we learned that introducing delays do not change the fact that state variables do not change until the next render. As a result, despite clicking many times before the delay completes, the ``number`` only increments by one. To solve this we can use updater functions: -.. idom:: _examples/delay_before_count_updater +.. reactpy:: _examples/delay_before_count_updater Now when you click the "Increment" button, each click, though delayed, corresponds to ``number`` being increased. This is because the ``old_number`` in the updater function diff --git a/docs/source/guides/adding-interactivity/responding-to-events/_examples/audio_player.py b/docs/source/guides/adding-interactivity/responding-to-events/_examples/audio_player.py index 41e216971..82826c50d 100644 --- a/docs/source/guides/adding-interactivity/responding-to-events/_examples/audio_player.py +++ b/docs/source/guides/adding-interactivity/responding-to-events/_examples/audio_player.py @@ -1,21 +1,21 @@ import json -import idom +import reactpy -@idom.component +@reactpy.component def PlayDinosaurSound(): - event, set_event = idom.hooks.use_state(None) - return idom.html.div( - idom.html.audio( + event, set_event = reactpy.hooks.use_state(None) + return reactpy.html.div( + reactpy.html.audio( { "controls": True, "on_time_update": lambda e: set_event(e), "src": "https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3", } ), - idom.html.pre(json.dumps(event, indent=2)), + reactpy.html.pre(json.dumps(event, indent=2)), ) -idom.run(PlayDinosaurSound) +reactpy.run(PlayDinosaurSound) diff --git a/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_async_handlers.py b/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_async_handlers.py index a1c57eb03..992641e00 100644 --- a/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_async_handlers.py +++ b/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_async_handlers.py @@ -1,6 +1,6 @@ import asyncio -from idom import component, html, run +from reactpy import component, html, run @component diff --git a/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_does_nothing.py b/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_does_nothing.py index e26e770d2..ea8313263 100644 --- a/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_does_nothing.py +++ b/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_does_nothing.py @@ -1,4 +1,4 @@ -from idom import component, html, run +from reactpy import component, html, run @component diff --git a/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_handler_as_arg.py b/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_handler_as_arg.py index f08bcd95f..e5276bef3 100644 --- a/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_handler_as_arg.py +++ b/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_handler_as_arg.py @@ -1,4 +1,4 @@ -from idom import component, html, run +from reactpy import component, html, run @component diff --git a/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_prints_event.py b/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_prints_event.py index 32854d8f6..38638db4b 100644 --- a/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_prints_event.py +++ b/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_prints_event.py @@ -1,4 +1,4 @@ -from idom import component, html, run +from reactpy import component, html, run @component diff --git a/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_prints_message.py b/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_prints_message.py index e2790ce52..56118a57f 100644 --- a/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_prints_message.py +++ b/docs/source/guides/adding-interactivity/responding-to-events/_examples/button_prints_message.py @@ -1,4 +1,4 @@ -from idom import component, html, run +from reactpy import component, html, run @component diff --git a/docs/source/guides/adding-interactivity/responding-to-events/_examples/prevent_default_event_actions.py b/docs/source/guides/adding-interactivity/responding-to-events/_examples/prevent_default_event_actions.py index 3b9cfc1ae..d3f0941bd 100644 --- a/docs/source/guides/adding-interactivity/responding-to-events/_examples/prevent_default_event_actions.py +++ b/docs/source/guides/adding-interactivity/responding-to-events/_examples/prevent_default_event_actions.py @@ -1,4 +1,4 @@ -from idom import component, event, html, run +from reactpy import component, event, html, run @component diff --git a/docs/source/guides/adding-interactivity/responding-to-events/_examples/stop_event_propagation.py b/docs/source/guides/adding-interactivity/responding-to-events/_examples/stop_event_propagation.py index 0a7543ce7..15e345bdd 100644 --- a/docs/source/guides/adding-interactivity/responding-to-events/_examples/stop_event_propagation.py +++ b/docs/source/guides/adding-interactivity/responding-to-events/_examples/stop_event_propagation.py @@ -1,4 +1,4 @@ -from idom import component, event, hooks, html, run +from reactpy import component, event, hooks, html, run @component diff --git a/docs/source/guides/adding-interactivity/responding-to-events/index.rst b/docs/source/guides/adding-interactivity/responding-to-events/index.rst index 6e916b6bf..26f1c49e4 100644 --- a/docs/source/guides/adding-interactivity/responding-to-events/index.rst +++ b/docs/source/guides/adding-interactivity/responding-to-events/index.rst @@ -1,7 +1,7 @@ Responding to Events ==================== -IDOM lets you add event handlers to your parts of the interface. These events handlers +ReactPy lets you add event handlers to your parts of the interface. These events handlers are functions which can be assigned to a part of a UI such that, when a user iteracts with the interface, those functions get triggered. Examples of interaction include clicking, hovering, of focusing on form inputs, and more. @@ -12,7 +12,7 @@ Adding Event Handlers To start out we'll just display a button that, for the moment, doesn't do anything: -.. idom:: _examples/button_does_nothing +.. reactpy:: _examples/button_does_nothing To add an event handler to this button we'll do three things: @@ -20,19 +20,19 @@ To add an event handler to this button we'll do three things: 2. Add logic to ``handle_event`` that will print the ``event`` it receives to the console. 3. Add an ``"onClick": handle_event`` attribute to the ``