Metadata-Version: 2.4
Name: st-datatables
Version: 0.1.1
Summary: Streamlit custom component: DataTables (React) wrapper
Author: junmae
License: MIT
Project-URL: Homepage, https://github.com/junmae/streamlit-datatables-actions
Project-URL: Source, https://github.com/junmae/streamlit-datatables-actions
Project-URL: Issues, https://github.com/junmae/streamlit-datatables-actions/issues
Keywords: streamlit,component,datatable,react
Classifier: Programming Language :: Python :: 3
Classifier: License :: OSI Approved :: MIT License
Classifier: Operating System :: OS Independent
Classifier: Development Status :: 3 - Alpha
Classifier: Topic :: Software Development :: Libraries
Requires-Python: >=3.7
Description-Content-Type: text/markdown
License-File: LICENSE
Requires-Dist: streamlit>=0.63
Provides-Extra: devel
Requires-Dist: wheel; extra == "devel"
Requires-Dist: pytest==7.4.0; extra == "devel"
Requires-Dist: playwright==1.48.0; extra == "devel"
Requires-Dist: requests==2.31.0; extra == "devel"
Requires-Dist: pytest-playwright-snapshot==1.0; extra == "devel"
Requires-Dist: pytest-rerunfailures==12.0; extra == "devel"
Dynamic: license-file

# st-datatables

Streamlit custom component wrapping DataTables for interactive dataframe display.

It is designed for tables that need row selection, action buttons, column
visibility controls, scrolling, and HTML/SVG cells such as RDKit molecule
structure drawings.

## Installation

```sh
pip install st-datatables
```

## Usage

```python
import pandas as pd
import streamlit as st
from st_datatables import st_datatables

df = pd.DataFrame(
    [
        {"ID": "mol-1", "SMILES": "CCO", "MOLWT": 46.07},
        {"ID": "mol-2", "SMILES": "c1ccccc1", "MOLWT": 78.11},
    ]
)

selected = st_datatables(
    df=df,
    id_col="ID",
    orderable_cols=["MOLWT"],
    searchable_cols=["ID", "SMILES"],
    select="single",
    key="molecule_table",
)

st.write(selected)
```

## Molecule Structure Columns

Use `html_cols` or `column_config` when a column contains pre-rendered SVG or
HTML, for example RDKit SVG drawings.

```python
selected = st_datatables(
    df=df_with_structure_svg,
    id_col="ID",
    html_cols=["structure_svg"],
    column_config={
        "structure_svg": {
            "html": True,
            "width": 220,
            "orderable": False,
            "searchable": False,
        },
        "SMILES": {"mono": True},
        "MOLWT": {"format": ".2f", "orderable": True},
    },
    rowHeight=220,
    structure_img_width=200,
    structure_img_height=200,
    preserve_selection_on_rerun=True,
    preserve_table_state=True,
    key="molecule_table",
)
```

## Returned Value

The component returns a dictionary containing selected rows and stable row IDs.

```python
{
    "rows": [...],
    "indexes": [...],
    "ids": [...],
    "count": 1,
    "event_id": "...",
    "table_state": {...},
}
```

When an action button is clicked, the row data is returned with an `action`
field and `_rowIndex`.

## Reset Selection

```python
from st_datatables import reset_selection

if st.button("Reset"):
    reset_selection("molecule_table")
```
