Give users the option to hide the "X" close button with argument show_close_button

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 = '''
-        <h1>HTML string in RED</h1>
+## API Reference
 
-        <script language="javascript">
-          document.querySelector("h1").style.color = "red";
-        </script>
-        '''
-        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

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
 

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
 

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"]

streamlit_modal/__init__.py → 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"""