Name | streamlit-bridge JSON |
Version |
1.1.8
JSON |
| download |
home_page | https://github.com/binh-vu/streamlit-bridge |
Summary | A hidden streamlit component that allows client side (javascript) to trigger events on the server side (python) and vice versa |
upload_time | 2025-02-16 19:35:50 |
maintainer | None |
docs_url | None |
author | Binh Vu |
requires_python | <4.0,>=3.6 |
license | MIT |
keywords |
|
VCS |
 |
bugtrack_url |
|
requirements |
No requirements were recorded.
|
Travis-CI |
No Travis.
|
coveralls test coverage |
No coveralls.
|
# Streamlit Bridge  [](https://opensource.org/licenses/MIT)
Two <a href="https://streamlit.io/">Streamlit</a> components that allow client side (javascript) to send data to the server side (python) and render HTML content without being processed by Markdown.
## Introduction
These two components offer more flexibility in creating Streamlit applications by allowing you to easily incorporate HTML and JS.
Here are some examples:
1. [List of inline buttons](/examples/inline_buttons.py) 
```python
import streamlit as st
from st_bridge import bridge, html
data = bridge("my-bridge", default="no button is clicked")
html("""
<button onClick="window.top.stBridges.send('my-bridge', 'button 1 is clicked')">Button 1</button>
<button onClick="window.top.stBridges.send('my-bridge', 'button 2 is clicked')">Button 2</button>
<button onClick="window.top.stBridges.send('my-bridge', 'button 3 is clicked')">Button 3</button>
""")
st.write(data)
```
2. [Timer](/examples/timer.py)
## Installation
```bash
pip install streamlit-bridge
```
## API
Bridge Component
```python
def bridge(
name: str,
default: Optional[Any] = None,
key: Optional[str] = None,
):
"""Create a new instance of "Streamlit Bridge", allowing call from the client to
the server.
Everytime JS client send data to the server, streamlit will trigger a rerun and the data
is returned by this function.
Args:
name: unique name of the bridge to identify the bridge Javascript's call will send data to
default: the initial return value of the component before the user has interacted with it.
key: streamlit component's id
"""
```
To send data from the client to a corresponding bridge component with `<bridge-name>`, use the function: `window.stBridges.send(<bridge-name>, <data>);` or `window.top.stBridges.send(<bridge-name>, <data>);` if you are running it inside an component (i.e., running inside an iframe) or Streamlit Cloud. Note that `window.top` is important to access the `stBridges` variable stored in the top-most window by the bridge component.
HTML Component
```python
def html(html: str, iframe: bool = False, key: Optional[str]=None) -> None:
"""Render HTML in Streamlit without being processed by Markdown.
Args:
html: HTML to render
iframe: whether to render the HTML in an iframe or in the main document.
By default streamlit component is rendered inside an iframe, so by
setting it to false, we allow the HTML to rendered in the main document.
key: streamlit component's id
"""
pass
```
## Development
- To build a streamlit component after modifying them:
- visiting their folder: `st_bridge/<component>`
- run `yarn install; yarn build`
- To test a component interactively, set `_RELEASE = False` in `st_bridge/<component>.py` and run `streamlit run st_bridge/<component>.py`
- To release, build the streamlit components first, then run `poetry publish --build`.
Raw data
{
"_id": null,
"home_page": "https://github.com/binh-vu/streamlit-bridge",
"name": "streamlit-bridge",
"maintainer": null,
"docs_url": null,
"requires_python": "<4.0,>=3.6",
"maintainer_email": null,
"keywords": null,
"author": "Binh Vu",
"author_email": "binh@toan2.com",
"download_url": "https://files.pythonhosted.org/packages/83/78/ee7e838a564f0eceb875f085741fdbc403a9320f35b48611645b19734992/streamlit_bridge-1.1.8.tar.gz",
"platform": null,
"description": "# Streamlit Bridge  [](https://opensource.org/licenses/MIT)\n\nTwo <a href=\"https://streamlit.io/\">Streamlit</a> components that allow client side (javascript) to send data to the server side (python) and render HTML content without being processed by Markdown.\n\n## Introduction\n\nThese two components offer more flexibility in creating Streamlit applications by allowing you to easily incorporate HTML and JS.\n\nHere are some examples:\n\n1. [List of inline buttons](/examples/inline_buttons.py) \n\n ```python\n import streamlit as st\n from st_bridge import bridge, html\n\n data = bridge(\"my-bridge\", default=\"no button is clicked\")\n\n html(\"\"\"\n <button onClick=\"window.top.stBridges.send('my-bridge', 'button 1 is clicked')\">Button 1</button>\n <button onClick=\"window.top.stBridges.send('my-bridge', 'button 2 is clicked')\">Button 2</button>\n <button onClick=\"window.top.stBridges.send('my-bridge', 'button 3 is clicked')\">Button 3</button>\n \"\"\")\n\n st.write(data)\n ```\n\n2. [Timer](/examples/timer.py)\n\n## Installation\n\n```bash\npip install streamlit-bridge\n```\n\n## API\n\nBridge Component\n\n```python\ndef bridge(\n name: str,\n default: Optional[Any] = None,\n key: Optional[str] = None,\n):\n \"\"\"Create a new instance of \"Streamlit Bridge\", allowing call from the client to\n the server.\n\n Everytime JS client send data to the server, streamlit will trigger a rerun and the data\n is returned by this function.\n\n Args:\n name: unique name of the bridge to identify the bridge Javascript's call will send data to\n default: the initial return value of the component before the user has interacted with it.\n key: streamlit component's id\n \"\"\"\n```\n\nTo send data from the client to a corresponding bridge component with `<bridge-name>`, use the function: `window.stBridges.send(<bridge-name>, <data>);` or `window.top.stBridges.send(<bridge-name>, <data>);` if you are running it inside an component (i.e., running inside an iframe) or Streamlit Cloud. Note that `window.top` is important to access the `stBridges` variable stored in the top-most window by the bridge component.\n\nHTML Component\n\n```python\ndef html(html: str, iframe: bool = False, key: Optional[str]=None) -> None:\n \"\"\"Render HTML in Streamlit without being processed by Markdown.\n\n Args:\n html: HTML to render\n iframe: whether to render the HTML in an iframe or in the main document.\n By default streamlit component is rendered inside an iframe, so by\n setting it to false, we allow the HTML to rendered in the main document.\n key: streamlit component's id\n \"\"\"\n pass\n```\n\n## Development\n\n- To build a streamlit component after modifying them:\n - visiting their folder: `st_bridge/<component>`\n - run `yarn install; yarn build`\n- To test a component interactively, set `_RELEASE = False` in `st_bridge/<component>.py` and run `streamlit run st_bridge/<component>.py`\n- To release, build the streamlit components first, then run `poetry publish --build`.\n",
"bugtrack_url": null,
"license": "MIT",
"summary": "A hidden streamlit component that allows client side (javascript) to trigger events on the server side (python) and vice versa",
"version": "1.1.8",
"project_urls": {
"Homepage": "https://github.com/binh-vu/streamlit-bridge"
},
"split_keywords": [],
"urls": [
{
"comment_text": "",
"digests": {
"blake2b_256": "99148b46b0fe40cc5ac88d6313f050667752793dbbc57f5e8a12c16b4407e663",
"md5": "a8009bb1ab22db301bd0b4f69d7f24fe",
"sha256": "13e4c8e3e9936c58fb241e1d45378c1f66876f947f5c4e900793419deca57c85"
},
"downloads": -1,
"filename": "streamlit_bridge-1.1.8-py3-none-any.whl",
"has_sig": false,
"md5_digest": "a8009bb1ab22db301bd0b4f69d7f24fe",
"packagetype": "bdist_wheel",
"python_version": "py3",
"requires_python": "<4.0,>=3.6",
"size": 2305485,
"upload_time": "2025-02-16T19:35:47",
"upload_time_iso_8601": "2025-02-16T19:35:47.226172Z",
"url": "https://files.pythonhosted.org/packages/99/14/8b46b0fe40cc5ac88d6313f050667752793dbbc57f5e8a12c16b4407e663/streamlit_bridge-1.1.8-py3-none-any.whl",
"yanked": false,
"yanked_reason": null
},
{
"comment_text": "",
"digests": {
"blake2b_256": "8378ee7e838a564f0eceb875f085741fdbc403a9320f35b48611645b19734992",
"md5": "4538fd60829450e2af62f576a5b9b780",
"sha256": "b056401a519fa34dfc7cb9d4b36aa38cc813652d212895f00681a19af8f6844e"
},
"downloads": -1,
"filename": "streamlit_bridge-1.1.8.tar.gz",
"has_sig": false,
"md5_digest": "4538fd60829450e2af62f576a5b9b780",
"packagetype": "sdist",
"python_version": "source",
"requires_python": "<4.0,>=3.6",
"size": 2278532,
"upload_time": "2025-02-16T19:35:50",
"upload_time_iso_8601": "2025-02-16T19:35:50.528194Z",
"url": "https://files.pythonhosted.org/packages/83/78/ee7e838a564f0eceb875f085741fdbc403a9320f35b48611645b19734992/streamlit_bridge-1.1.8.tar.gz",
"yanked": false,
"yanked_reason": null
}
],
"upload_time": "2025-02-16 19:35:50",
"github": true,
"gitlab": false,
"bitbucket": false,
"codeberg": false,
"github_user": "binh-vu",
"github_project": "streamlit-bridge",
"travis_ci": false,
"coveralls": false,
"github_actions": false,
"lcname": "streamlit-bridge"
}