Widget Snippet Catalogue

This page is the working reference for the three widget factories exposed by factor_wiki_widgets: grid, chart, and dashboard. Every snippet below is a runnable {pyodide} cell, so you can compare expected output against what your page actually renders.

The Python module ships as a wheel served from this site at /wheels/factor_wiki_widgets-latest-py3-none-any.whl. The pyodide.packages: block above is the literal block to paste into the front matter of any page that needs the widgets.

Panel requires its tabulator and plotly extensions to be activated once per page before any widget renders. Run the cell below first; every later cell on the page can then assume the extensions are loaded:

Section 1 — Grid from an inline DataFrame

grid(df) wraps a pandas.DataFrame in a Panel Tabulator widget with sensible defaults: sizing_mode="stretch_width", no pagination, the checkbox column for selection, header-filter widgets on every column, and configuration={"clipboard": True} so a reader can copy rows. Pass any keyword argument Tabulator accepts to override a default:

Section 2 — Chart from a plotly Figure

chart(fig) wraps a plotly.graph_objects.Figure in a Panel Plotly pane with sizing_mode="stretch_width". The factory does NOT mutate the figure: no fig.update_layout, no fig.add_*. If you want a title, set it on the figure before passing it to chart:

Section 3 — Static dashboard

dashboard(grid_widget, charts, layout="static") arranges one grid and any number of charts in a pn.Column with the grid on top and the charts in a pn.Row underneath. Use this layout for read-only walk-through pages where the spatial arrangement is part of the story:

Section 4 — GridStack dashboard

dashboard(grid_widget, charts, layout="gridstack") returns a Panel GridStack template whose panels are draggable and resizable in the browser. Use this layout for exploratory pages where readers should rearrange the panels themselves:

Section 5 — load_dataset → grid cross-spec composition

The data-access spec ships a factor_wiki_data wheel that exposes load_dataset(path) -> DataFrame. The grid factory accepts the returned DataFrame directly — there is no glue code between the two specs. The composition pattern is:

from factor_wiki_data import load_dataset
from factor_wiki_widgets import grid

df = await load_dataset("smoke/tiny.parquet")
grid(df)
Note

This snippet is shown as a static code block until the data-access spec (.kiro/specs/data-access/) ships the factor_wiki_data wheel. Once that wheel is published to /wheels/factor_wiki_data-latest-py3-none-any.whl, add its URL to the pyodide.packages: block above and convert this block into a {pyodide} cell. The widget factories themselves require no change — grid accepts any pandas.DataFrame regardless of how it was produced.

Error surface

Each factory validates its inputs and raises a subclass of WidgetError:

  • grid(not_a_df) raises WidgetTypeError naming the type it received.
  • chart(not_a_figure) raises WidgetTypeError naming the type it received.
  • dashboard(..., layout="kanban") raises WidgetLayoutError listing the accepted layouts ("static", "gridstack").

Catch the base class to handle any widget error, or catch a subclass for a specific failure mode:

from factor_wiki_widgets import WidgetError, WidgetTypeError

try:
    grid(some_value)
except WidgetTypeError as e:
    # input was the wrong shape; show a hint
    raise
except WidgetError:
    # any other widget error
    raise