express.ui.navset_card_pill

express.ui.navset_card_pill(id=None, selected=None, title=None, sidebar=None, header=None, footer=None, placement='above')

Context manager for a set of nav items as a tabset inside a card container.

This function wraps navset_card_pill.

Parameters

id: Optional[str] = None: If provided, will create an input value that holds the currently selected nav item.
selected: Optional[str] = None: Choose a particular nav item to select by default value (should match it’s value).
sidebar: Optional[ui.Sidebar] = None: A shiny.express.ui.Sidebar component to display on every nav page.
header: TagChild = None: UI to display above the selected content.
footer: TagChild = None: UI to display below the selected content.
placement: Literal[‘above’, ‘below’] = ‘above’: Placement of the nav items relative to the content.

Examples

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

## file: app.py
from shiny.express import input, render, ui

with ui.navset_card_pill(id="selected_navset_card_pill"):
    with ui.nav_panel("A"):
        "Panel A content"

    with ui.nav_panel("B"):
        "Panel B content"

    with ui.nav_panel("C"):
        "Panel C content"

    with ui.nav_menu("Other links"):
        with ui.nav_panel("D"):
            "Page D content"

        "----"
        "Description:"
        with ui.nav_control():
            ui.a("Shiny", href="https://shiny.posit.co", target="_blank")
ui.h5("Selected:")


@render.code
def _():
    return input.selected_navset_card_pill()