diff --git a/README.md b/README.md index ae562df..d580b17 100644 --- a/README.md +++ b/README.md @@ -1,48 +1,57 @@ -# Streamlit modal +# st-modal -Modal support for streamlit. The hackish way. +A modern modal dialog component for Streamlit applications. This is a fork of the original [streamlit_modal](https://github.com/teamtv/streamlit_modal) with improvements and adjustments. -## Example +## Installation + +```bash +pip install st-modal +``` + +## Quick Start ```python import streamlit as st -from streamlit_modal import Modal - -import streamlit.components.v1 as components +from st_modal import Modal +# Create modal +modal = Modal("My Modal", key="my-modal") -modal = Modal( - "Demo Modal", - key="demo-modal", - - # Optional - padding=20, # default value - max_width=744 # default value -) -open_modal = st.button("Open") -if open_modal: +# Trigger to open modal +if st.button("Open Modal"): modal.open() +# Modal content if modal.is_open(): with modal.container(): - st.write("Text goes here") + st.write("Hello from inside the modal!") + + value = st.slider("Pick a value", 0, 100, 50) + st.write(f"Selected: {value}") + + if st.button("Close", key="close-modal"): + modal.close() +``` - html_string = ''' -

HTML string in RED

+## API Reference - - ''' - components.html(html_string) +### Modal Class - st.write("Some fancy text") - value = st.checkbox("Check me") - st.write(f"Checkbox checked: {value}") +```python +Modal(title, key, padding=20, max_width=744, show_close_button=True, show_title=True, show_divider=True) ``` -## Install - -```shell script -pip install streamlit-modal -``` +**Parameters:** +- `title` (str): Title displayed at the top of the modal +- `key` (str): Unique identifier for the modal (required) +- `padding` (int): Internal padding in pixels (default: 20) +- `max_width` (int): Maximum width in pixels (default: 744) +- `show_close_button` (bool): Whether to show the X close button (default: True) +- `show_title` (bool): Whether to show the title header (default: True) +- `show_divider` (bool): Whether to show the divider line below the header (default: True) + +**Methods:** +- `modal.open()`: Opens the modal and triggers a rerun +- `modal.close()`: Closes the modal and triggers a rerun +- `modal.is_open()`: Returns True if modal is currently open +- `modal.container()`: Context manager for adding content to the modal \ No newline at end of file diff --git a/examples/simple.py b/examples/simple.py index 0c3af13..75fe671 100644 --- a/examples/simple.py +++ b/examples/simple.py @@ -1,5 +1,5 @@ import streamlit as st -from streamlit_modal import Modal +from st_modal import Modal import streamlit.components.v1 as components diff --git a/examples/with_sidebar.py b/examples/with_sidebar.py index 8136314..6607bc0 100644 --- a/examples/with_sidebar.py +++ b/examples/with_sidebar.py @@ -1,5 +1,5 @@ import streamlit as st -from streamlit_modal import Modal +from st_modal import Modal import streamlit.components.v1 as components diff --git a/pyproject.toml b/pyproject.toml new file mode 100644 index 0000000..dc40217 --- /dev/null +++ b/pyproject.toml @@ -0,0 +1,44 @@ +[build-system] +requires = ["setuptools>=61.0", "wheel"] +build-backend = "setuptools.build_meta" + +[project] +name = "st-modal" +version = "1.0.2" +description = "Modal for streamlit" +readme = "README.md" +license = {text = "BSD"} +authors = [ + {name = "Peter van Lunteren"} +] +classifiers = [ + "Intended Audience :: Developers", + "Intended Audience :: Science/Research", + "Programming Language :: Python :: 3", + "Programming Language :: Python :: 3.7", + "Programming Language :: Python :: 3.8", + "Programming Language :: Python :: 3.9", + "Programming Language :: Python :: 3.10", + "Programming Language :: Python :: 3.11", + "Programming Language :: Python :: 3.12", + "License :: OSI Approved :: BSD License", + "Topic :: Scientific/Engineering", + "Development Status :: 4 - Beta" +] +keywords = ["streamlit", "modal", "dialog", "ui", "component"] +dependencies = [ + "streamlit", + "deprecation" +] +requires-python = ">=3.7" + +[project.urls] +Homepage = "https://github.com/PetervanLunteren/st-modal" +Repository = "https://github.com/PetervanLunteren/st-modal" +Issues = "https://github.com/PetervanLunteren/st-modal/issues" + +[tool.setuptools] +packages = ["st_modal"] + +[tool.setuptools.package-data] +st_modal = ["*.py"] \ No newline at end of file diff --git a/setup.py b/setup.py deleted file mode 100644 index 2bb2185..0000000 --- a/setup.py +++ /dev/null @@ -1,37 +0,0 @@ -import setuptools -from distutils.core import setup - - -def setup_package(): - with open("README.md", "r") as f: - readme = f.read() - - setup( - name="streamlit_modal", - install_requires=['streamlit', 'deprecation'], - version="0.1.2", - author="Koen Vossen", - author_email="info@koenvossen.nl", - url="https://github.com/teamtv/streamlit_modal", - packages=setuptools.find_packages(), - license="BSD", - description="Modal for streamlit", - long_description=readme, - long_description_content_type="text/markdown", - classifiers=[ - "Intended Audience :: Developers", - "Intended Audience :: Science/Research", - "Programming Language :: Python :: 3", - "Programming Language :: Python :: 3.6", - "Programming Language :: Python :: 3.7", - "Programming Language :: Python :: 3.8", - "Programming Language :: Python :: 3.9", - "Programming Language :: Python :: 3.10", - "License :: OSI Approved", - "Topic :: Scientific/Engineering", - ] - ) - - -if __name__ == "__main__": - setup_package() \ No newline at end of file diff --git a/streamlit_modal/__init__.py b/st_modal/__init__.py similarity index 88% rename from streamlit_modal/__init__.py rename to st_modal/__init__.py index 794b28e..5d84c09 100644 --- a/streamlit_modal/__init__.py +++ b/st_modal/__init__.py @@ -13,17 +13,23 @@ class Modal: - def __init__(self, title, key, padding=20, max_width=744): + def __init__(self, title, key, padding=20, max_width=744, show_close_button=True, show_title=True, show_divider=True): """ :param title: title of the Modal shown in the h1 :param key: unique key identifying this modal instance :param padding: padding of the content within the modal :param max_width: maximum width this modal should use + :param show_close_button: whether to show the X close button + :param show_title: whether to show the title header + :param show_divider: whether to show the divider line below the header """ self.title = title self.padding = padding self.max_width = str(max_width) + "px" self.key = key + self.show_close_button = show_close_button + self.show_title = show_title + self.show_divider = show_divider def is_open(self): return st.session_state.get(f'{self.key}-opened', False) @@ -111,15 +117,17 @@ def container(self): _container = st.container() title, close_button = _container.columns([0.9, 0.1]) - if self.title: + if self.show_title and self.title: with title: st.header(self.title) - with close_button: - close_ = st.button('X', key=f'{self.key}-close') - if close_: - self.close() - - _container.divider() + if self.show_close_button: + with close_button: + close_ = st.button('X', key=f'{self.key}-close') + if close_: + self.close() + + if self.show_divider: + _container.divider() components.html( f"""