Table¶
marimo.ui.table
¶
table(
data: Union[
ListOrTuple[
Union[str, int, float, bool, MIME, None]
],
ListOrTuple[dict[str, JSONType]],
dict[str, ListOrTuple[JSONType]],
IntoDataFrame,
],
pagination: Optional[bool] = None,
selection: Optional[
Literal[
"single", "multi", "single-cell", "multi-cell"
]
] = "multi",
initial_selection: Optional[
Union[list[int], list[tuple[str, str]]]
] = None,
page_size: int = 10,
show_column_summaries: Optional[
Union[bool, Literal["stats", "chart"]]
] = None,
format_mapping: Optional[
dict[str, Union[str, Callable[..., Any]]]
] = None,
freeze_columns_left: Optional[Sequence[str]] = None,
freeze_columns_right: Optional[Sequence[str]] = None,
text_justify_columns: Optional[
dict[str, Literal["left", "center", "right"]]
] = None,
wrapped_columns: Optional[list[str]] = None,
show_download: bool = True,
max_columns: Optional[int] = 50,
*,
label: str = "",
on_change: Optional[
Callable[
[
Union[
list[JSONType],
dict[str, ListOrTuple[JSONType]],
IntoDataFrame,
list[TableCell],
]
],
None,
]
] = None,
style_cell: Optional[
Callable[[str, str, Any], dict[str, Any]]
] = None,
_internal_column_charts_row_limit: Optional[int] = None,
_internal_summary_row_limit: Optional[int] = None,
_internal_total_rows: Optional[
Union[int, Literal["too_many"]]
] = None
)
Bases: UIElement[Union[list[str], list[int], list[dict[str, Any]]], Union[list[JSONType], IntoDataFrame, list[TableCell]]]
A table component with selectable rows.
Get the selected rows with table.value
. The table data can be supplied as:
- a list of dicts, with one dict for each row, keyed by column names;
- a list of values, representing a table with a single column;
- a Pandas dataframe; or
- a Polars dataframe; or
- an Ibis dataframe; or
- a PyArrow table.
Examples:
Create a table from a list of dicts, one for each row:
table = mo.ui.table(
data=[
{"first_name": "Michael", "last_name": "Scott"},
{"first_name": "Dwight", "last_name": "Schrute"},
],
label="Users",
)
Create a table from a single column of data:
table = mo.ui.table(
data=[
{"first_name": "Michael", "last_name": "Scott"},
{"first_name": "Dwight", "last_name": "Schrute"},
],
label="Users",
)
Create a table from a dataframe:
# df is a Pandas or Polars dataframe
table = mo.ui.table(
data=df,
# use pagination when your table has many rows
pagination=True,
label="Dataframe",
)
Create a table with format mapping:
# format_mapping is a dict keyed by column names,
# with values as formatting functions or strings
def format_name(name):
return name.upper()
table = mo.ui.table(
data=[
{"first_name": "Michael", "last_name": "Scott", "age": 45},
{"first_name": "Dwight", "last_name": "Schrute", "age": 40},
],
format_mapping={
"first_name": format_name, # Use callable to format first names
"age": "{:.1f}".format, # Use string format for age
},
label="Format Mapping",
)
Create a table with conditional cell formatting:
import random
# rowId and columnName are strings.
def style_cell(_rowId, _columnName, value):
# Apply inline styling to the visible individual cells.
return {
"backgroundColor": "lightcoral"
if value < 4
else "cornflowerblue",
"color": "white",
"fontStyle": "italic",
}
table = mo.ui.table(
data=[random.randint(0, 10) for x in range(200)],
style_cell=style_cell,
)
table
In each case, access the table data with table.value
.
ATTRIBUTE | DESCRIPTION |
---|---|
value |
The selected rows, in the same format as the original data, or None if no selection.
TYPE:
|
data |
The original table data.
TYPE:
|
PARAMETER | DESCRIPTION |
---|---|
data
|
Values can be primitives (
TYPE:
|
pagination
|
Whether to paginate; if False, all rows will be shown. Defaults to True when above 10 rows, False otherwise.
TYPE:
|
selection
|
'single' or 'multi' to enable row selection, 'single-cell' or 'multi-cell' to enable cell selection or None to disable. Defaults to "multi".
TYPE:
|
initial_selection
|
Indices of the rows you want selected by default.
TYPE:
|
page_size
|
The number of rows to show per page. Defaults to 10.
TYPE:
|
show_column_summaries
|
Whether to show column summaries. Defaults to True when the table has less than 40 columns and at least 10 rows, False otherwise. If "stats", only show stats. If "chart", only show charts. |
show_download
|
Whether to show the download button. Defaults to True for dataframes, False otherwise.
TYPE:
|
format_mapping
|
A mapping from column names to formatting strings or functions.
TYPE:
|
freeze_columns_left
|
List of column names to freeze on the left. |
freeze_columns_right
|
List of column names to freeze on the right. |
text_justify_columns
|
Dictionary of column names to text justification options: left, center, right.
TYPE:
|
wrapped_columns
|
List of column names to wrap.
TYPE:
|
label
|
Markdown label for the element. Defaults to "".
TYPE:
|
on_change
|
Optional callback to run when this element's value changes.
TYPE:
|
style_cell
|
A function that takes the row id, column name and value and returns a dictionary of CSS styles.
TYPE:
|
max_columns
|
Maximum number of columns to display. Defaults to 50. Set to None to show all columns.
TYPE:
|
data
property
¶
Get the original table data.
RETURNS | DESCRIPTION |
---|---|
TableData
|
The original data passed to the table constructor, in its original format (list, dict, dataframe, etc.).
TYPE:
|
batch
¶
Convert an HTML object with templated text into a UI element.
This method lets you create custom UI elements that are represented by arbitrary HTML.
Example
user_info = mo.md(
'''
- What's your name?: {name}
- When were you born?: {birthday}
'''
).batch(name=mo.ui.text(), birthday=mo.ui.date())
In this example, user_info
is a UI Element whose output is markdown
and whose value is a dict with keys 'name'
and 'birthday
'
(and values equal to the values of their corresponding elements).
PARAMETER | DESCRIPTION |
---|---|
elements
|
the UI elements to interpolate into the HTML template.
TYPE:
|
callout
¶
Create a callout containing this HTML element.
A callout wraps your HTML element in a raised box, emphasizing its
importance. You can style the callout for different situations with the
kind
argument.
Examples:
form
¶
form(
label: str = "",
*,
bordered: bool = True,
loading: bool = False,
submit_button_label: str = "Submit",
submit_button_tooltip: Optional[str] = None,
submit_button_disabled: bool = False,
clear_on_submit: bool = False,
show_clear_button: bool = False,
clear_button_label: str = "Clear",
clear_button_tooltip: Optional[str] = None,
validate: Optional[
Callable[[Optional[JSONType]], Optional[str]]
] = None,
on_change: Optional[
Callable[[Optional[T]], None]
] = None
) -> form[S, T]
Create a submittable form out of this UIElement
.
Creates a form that gates submission of a UIElement
's value until a submit button is clicked.
The form's value is the value of the underlying element from the last submission.
Examples:
Convert any UIElement
into a form:
Combine with HTML.batch
to create a form made out of multiple UIElements
:
form = (
mo.ui.md(
'''
**Enter your prompt.**
{prompt}
**Choose a random seed.**
{seed}
'''
)
.batch(
prompt=mo.ui.text_area(),
seed=mo.ui.number(),
)
.form()
)
PARAMETER | DESCRIPTION |
---|---|
label
|
A text label for the form.
TYPE:
|
bordered
|
Whether the form should have a border.
TYPE:
|
loading
|
Whether the form should be in a loading state.
TYPE:
|
submit_button_label
|
The label of the submit button.
TYPE:
|
submit_button_tooltip
|
The tooltip of the submit button. |
submit_button_disabled
|
Whether the submit button should be disabled.
TYPE:
|
clear_on_submit
|
Whether the form should clear its contents after submitting.
TYPE:
|
show_clear_button
|
Whether the form should show a clear button.
TYPE:
|
clear_button_label
|
The label of the clear button.
TYPE:
|
clear_button_tooltip
|
The tooltip of the clear button. |
validate
|
A function that takes the form's value and returns an error message if invalid,
or
TYPE:
|
on_change
|
A callback that takes the form's value and returns an error message if invalid,
or |
send_message
¶
Send a message to the element rendered on the frontend from the backend.