express.ui.layout_sidebar

express.ui.layout_sidebar(
    fillable=True,
    fill=True,
    bg=None,
    fg=None,
    border=None,
    border_radius=None,
    border_color=None,
    gap=None,
    padding=None,
    height=None,
    **kwargs,
)

Context manager for sidebar layout

This function wraps layout_sidebar.

Create a sidebar layout component which can be dropped inside any Shiny UI page method (e.g. page_fillable) or card context.

The first child needs to be of class Sidebar object created by sidebar. The remaining arguments will contain the contents to the main content area. Or tag attributes that are supplied to the resolved Tag object.

Parameters

fillable : bool = True

Whether or not the main content area should be wrapped in a fillable container. See as_fillable_container for details.

fill : bool = True

Whether or not the sidebar layout should be wrapped in a fillable container. See as_fill_item for details.

bg : Optional[str] = None

A background or foreground color.

border : Optional[bool] = None

Whether or not to show a border around the sidebar layout.

border_radius : Optional[bool] = None

Whether or not to round the corners of the sidebar layout.

border_color : Optional[str] = None

A border color.

gap : Optional[CssUnit] = None

A CSS length unit defining the vertical gap (i.e., spacing) between elements provided to *args. This value will only be used if fillable is True.

padding : Optional[CssUnit | list[CssUnit]] = None

Padding within the sidebar itself. This can be a numeric vector (which will be interpreted as pixels) or a character vector with valid CSS lengths. padding may be one to four values. If one, then that value will be used for all four sides. If two, then the first value will be used for the top and bottom, while the second value will be used for left and right. If three, then the first will be used for top, the second will be left and right, and the third will be bottom. If four, then the values will be interpreted as top, right, bottom, and left respectively.

height : Optional[CssUnit] = None

Any valid CSS unit to use for the height.

Examples

#| standalone: true
#| components: [editor, viewer]
#| layout: vertical
#| viewerHeight: 400

## file: app.py
import matplotlib.pyplot as plt
import numpy as np

from shiny.express import input, render, ui

with ui.layout_sidebar():
    with ui.sidebar():
        ui.input_slider("n", "N", min=0, max=100, value=20)

    @render.plot(alt="A histogram")
    def plot() -> object:
        np.random.seed(19680801)
        x = 100 + 15 * np.random.randn(437)

        fig, ax = plt.subplots()
        ax.hist(x, input.n(), density=True)
        return fig