Name | streamlit-sortables JSON |
Version |
0.3.1
JSON |
| download |
home_page | https://github.com/ohtaman/streamlit-sortables |
Summary | A Streamlit component to provide sortable list. |
upload_time | 2025-01-13 07:37:44 |
maintainer | None |
docs_url | None |
author | ohtaman |
requires_python | !=2.7.*,!=3.0.*,!=3.1.*,!=3.2.*,!=3.3.*,!=3.4.*,!=3.5.*,!=3.6.*,!=3.7.*,!=3.8.*,>=3.9 |
license | Apache License (2.0) |
keywords |
streamlit
sortable
list
|
VCS |
|
bugtrack_url |
|
requirements |
No requirements were recorded.
|
Travis-CI |
No Travis.
|
coveralls test coverage |
No coveralls.
|
# Streamlit Sortables
Streamlit Sortables is a component for Streamlit applications that allows users to create sortable lists. This component enhances the interactivity of your Streamlit apps by enabling users to sort lists of strings in the UI.
https://user-images.githubusercontent.com/329750/163662202-ce292fc4-2882-46ac-8c2c-ca4b9df675d2.mp4
## Features
- **Sortable Lists**: Easily sort lists of strings or dictionaries.
- **Multiple Containers**: Support for sorting items across multiple containers.
- **Custom Styling**: Apply custom CSS styles to match your application's theme.
## Installation
Install the package via pip:
```bash
pip install streamlit-sortables
```
## Usage
### Sorting a List of Strings
Use the `sort_items` method to sort a list of strings. The return value is the sorted list.
```python
import streamlit as st
from streamlit_sortables import sort_items
original_items = ['A', 'B', 'C']
sorted_items = sort_items(original_items)
st.write(f'Original items: {original_items}')
st.write(f'Sorted items: {sorted_items}')
```
### Sorting with Multiple Containers
You can pass a list of dictionaries with `multi_containers=True` to sort items across multiple containers.
```python
import streamlit as st
from streamlit_sortables import sort_items
original_items = [
{'header': 'First Container', 'items': ['A', 'B', 'C']},
{'header': 'Second Container', 'items': ['D', 'E', 'F']}
]
sorted_items = sort_items(original_items, multi_containers=True)
st.write(f'Original items: {original_items}')
st.write(f'Sorted items: {sorted_items}')
```
### Theme Customization
Here's a simple example of how to customize the theme by changing the background color and font size, and numbering the items. By default, styles are defined in [SortableComponent.css](streamlit_sortables/frontend/src/SortableComponent.css):
```python
import streamlit as st
from streamlit_sortables import sort_items
original_items = [
{'header': 'Container', 'items': ['Item 1', 'Item 2', 'Item 3']}
]
simple_style = """
.sortable-component {
background-color:rgb(0, 225, 255);
font-size: 16px;
counter-reset: item;
}
.sortable-item {
background-color: black;
color: white;
}
"""
sorted_items = sort_items(original_items, multi_containers=True, custom_style=simple_style)
st.write(f'Original items: {original_items}')
st.write(f'Sorted items: {sorted_items}')
```
This example changes the background color to a light blue, sets the font size to 16px, and numbers the items.
### Advanced CSS Customization
This example demonstrates advanced CSS customization, including theme customization and item numbering. Apply custom CSS styles using the `custom_style` option.
```python
import streamlit as st
from streamlit_sortables import sort_items
original_items = [
{'header': 'First Container', 'items': ['A', 'B', 'C']},
{'header': 'Second Container', 'items': ['D', 'E', 'F']}
]
custom_style = """
.sortable-component {
border: 3px solid #6495ED;
border-radius: 10px;
padding: 5px;
}
.sortable-container {
background-color: #F0F0F0;
counter-reset: item;
}
.sortable-container-header {
background-color: #FFBFDF;
padding-left: 1rem;
}
.sortable-container-body {
background-color: #F0F0F0;
}
.sortable-item, .sortable-item:hover {
background-color: #6495ED;
font-color: #FFFFFF;
font-weight: bold;
}
.sortable-item::before {
content: counter(item) ". ";
counter-increment: item;
}
"""
sorted_items = sort_items(original_items, multi_containers=True, custom_style=custom_style)
st.write(f'Original items: {original_items}')
st.write(f'Sorted items: {sorted_items}')
```
![Styling Example](imgs/styling.png)
## Contributing
Contributions are welcome! Please submit issues or pull requests for any bugs or feature requests.
## License
This project is licensed under the Apache License 2.0. See the [LICENSE](LICENSE) file for details.
Raw data
{
"_id": null,
"home_page": "https://github.com/ohtaman/streamlit-sortables",
"name": "streamlit-sortables",
"maintainer": null,
"docs_url": null,
"requires_python": "!=2.7.*,!=3.0.*,!=3.1.*,!=3.2.*,!=3.3.*,!=3.4.*,!=3.5.*,!=3.6.*,!=3.7.*,!=3.8.*,>=3.9",
"maintainer_email": null,
"keywords": "streamlit, sortable, list",
"author": "ohtaman",
"author_email": "ohtamans@gmail.com",
"download_url": "https://files.pythonhosted.org/packages/11/10/00c3ae0f183d41bb3608157283a2c92e4f4db87cb21a73e96b3c2c2ca58f/streamlit_sortables-0.3.1.tar.gz",
"platform": null,
"description": "# Streamlit Sortables\n\nStreamlit Sortables is a component for Streamlit applications that allows users to create sortable lists. This component enhances the interactivity of your Streamlit apps by enabling users to sort lists of strings in the UI.\n\nhttps://user-images.githubusercontent.com/329750/163662202-ce292fc4-2882-46ac-8c2c-ca4b9df675d2.mp4\n\n## Features\n\n- **Sortable Lists**: Easily sort lists of strings or dictionaries.\n- **Multiple Containers**: Support for sorting items across multiple containers.\n- **Custom Styling**: Apply custom CSS styles to match your application's theme.\n\n## Installation\n\nInstall the package via pip:\n\n```bash\npip install streamlit-sortables\n```\n\n## Usage\n\n### Sorting a List of Strings\n\nUse the `sort_items` method to sort a list of strings. The return value is the sorted list.\n\n```python\nimport streamlit as st\nfrom streamlit_sortables import sort_items\n\noriginal_items = ['A', 'B', 'C']\nsorted_items = sort_items(original_items)\n\nst.write(f'Original items: {original_items}')\nst.write(f'Sorted items: {sorted_items}')\n```\n\n### Sorting with Multiple Containers\n\nYou can pass a list of dictionaries with `multi_containers=True` to sort items across multiple containers.\n\n```python\nimport streamlit as st\nfrom streamlit_sortables import sort_items\n\noriginal_items = [\n {'header': 'First Container', 'items': ['A', 'B', 'C']},\n {'header': 'Second Container', 'items': ['D', 'E', 'F']}\n]\n\nsorted_items = sort_items(original_items, multi_containers=True)\n\nst.write(f'Original items: {original_items}')\nst.write(f'Sorted items: {sorted_items}')\n```\n\n### Theme Customization\n\nHere's a simple example of how to customize the theme by changing the background color and font size, and numbering the items. By default, styles are defined in [SortableComponent.css](streamlit_sortables/frontend/src/SortableComponent.css):\n\n```python\nimport streamlit as st\nfrom streamlit_sortables import sort_items\n\noriginal_items = [\n {'header': 'Container', 'items': ['Item 1', 'Item 2', 'Item 3']}\n]\n\nsimple_style = \"\"\"\n.sortable-component {\n background-color:rgb(0, 225, 255);\n font-size: 16px;\n counter-reset: item;\n}\n.sortable-item {\n background-color: black;\n color: white;\n}\n\"\"\"\n\nsorted_items = sort_items(original_items, multi_containers=True, custom_style=simple_style)\n\nst.write(f'Original items: {original_items}')\nst.write(f'Sorted items: {sorted_items}')\n```\n\nThis example changes the background color to a light blue, sets the font size to 16px, and numbers the items.\n\n### Advanced CSS Customization\n\nThis example demonstrates advanced CSS customization, including theme customization and item numbering. Apply custom CSS styles using the `custom_style` option.\n\n```python\nimport streamlit as st\nfrom streamlit_sortables import sort_items\n\noriginal_items = [\n {'header': 'First Container', 'items': ['A', 'B', 'C']},\n {'header': 'Second Container', 'items': ['D', 'E', 'F']}\n]\n\ncustom_style = \"\"\"\n.sortable-component {\n border: 3px solid #6495ED;\n border-radius: 10px;\n padding: 5px;\n}\n.sortable-container {\n background-color: #F0F0F0;\n counter-reset: item;\n}\n.sortable-container-header {\n background-color: #FFBFDF;\n padding-left: 1rem;\n}\n.sortable-container-body {\n background-color: #F0F0F0;\n}\n.sortable-item, .sortable-item:hover {\n background-color: #6495ED;\n font-color: #FFFFFF;\n font-weight: bold;\n}\n.sortable-item::before {\n content: counter(item) \". \";\n counter-increment: item;\n}\n\"\"\"\nsorted_items = sort_items(original_items, multi_containers=True, custom_style=custom_style)\n\nst.write(f'Original items: {original_items}')\nst.write(f'Sorted items: {sorted_items}')\n```\n\n![Styling Example](imgs/styling.png)\n\n## Contributing\n\nContributions are welcome! Please submit issues or pull requests for any bugs or feature requests.\n\n## License\n\nThis project is licensed under the Apache License 2.0. See the [LICENSE](LICENSE) file for details.\n",
"bugtrack_url": null,
"license": "Apache License (2.0)",
"summary": "A Streamlit component to provide sortable list.",
"version": "0.3.1",
"project_urls": {
"Homepage": "https://github.com/ohtaman/streamlit-sortables"
},
"split_keywords": [
"streamlit",
" sortable",
" list"
],
"urls": [
{
"comment_text": "",
"digests": {
"blake2b_256": "3db4edbef9fa8e49f5df2745a178c44b23553d8472c22fb23f44f6949d544410",
"md5": "9106987f8f2bff7bddd19e6cf44ca927",
"sha256": "1847b2fa2041762b6442e21224bd8c0316c5412e4eb3a38fa748cf7ced834d49"
},
"downloads": -1,
"filename": "streamlit_sortables-0.3.1-py3-none-any.whl",
"has_sig": false,
"md5_digest": "9106987f8f2bff7bddd19e6cf44ca927",
"packagetype": "bdist_wheel",
"python_version": "py3",
"requires_python": "!=2.7.*,!=3.0.*,!=3.1.*,!=3.2.*,!=3.3.*,!=3.4.*,!=3.5.*,!=3.6.*,!=3.7.*,!=3.8.*,>=3.9",
"size": 570356,
"upload_time": "2025-01-13T07:37:42",
"upload_time_iso_8601": "2025-01-13T07:37:42.852654Z",
"url": "https://files.pythonhosted.org/packages/3d/b4/edbef9fa8e49f5df2745a178c44b23553d8472c22fb23f44f6949d544410/streamlit_sortables-0.3.1-py3-none-any.whl",
"yanked": false,
"yanked_reason": null
},
{
"comment_text": "",
"digests": {
"blake2b_256": "111000c3ae0f183d41bb3608157283a2c92e4f4db87cb21a73e96b3c2c2ca58f",
"md5": "fd4feabbf8e218c460fd320b316b4ab8",
"sha256": "9bed78f4407f2b9b1ddead8b6459d1af839aab427b7b5fe4c091e6870630acfe"
},
"downloads": -1,
"filename": "streamlit_sortables-0.3.1.tar.gz",
"has_sig": false,
"md5_digest": "fd4feabbf8e218c460fd320b316b4ab8",
"packagetype": "sdist",
"python_version": "source",
"requires_python": "!=2.7.*,!=3.0.*,!=3.1.*,!=3.2.*,!=3.3.*,!=3.4.*,!=3.5.*,!=3.6.*,!=3.7.*,!=3.8.*,>=3.9",
"size": 564139,
"upload_time": "2025-01-13T07:37:44",
"upload_time_iso_8601": "2025-01-13T07:37:44.533751Z",
"url": "https://files.pythonhosted.org/packages/11/10/00c3ae0f183d41bb3608157283a2c92e4f4db87cb21a73e96b3c2c2ca58f/streamlit_sortables-0.3.1.tar.gz",
"yanked": false,
"yanked_reason": null
}
],
"upload_time": "2025-01-13 07:37:44",
"github": true,
"gitlab": false,
"bitbucket": false,
"codeberg": false,
"github_user": "ohtaman",
"github_project": "streamlit-sortables",
"travis_ci": false,
"coveralls": false,
"github_actions": false,
"lcname": "streamlit-sortables"
}