express.ui.nav_panel

express.ui.nav_panel(title, *, value=None, icon=None)

Context manager for nav item pointing to some internal content.

This function wraps nav.

Parameters

title: TagChild

A title to display. Can be a character string or UI elements (i.e., tags).

value: Optional[str] = None

The value of the item. This is used to determine whether the item is active (when an id is provided to the nav container), programmatically select the item (e.g., update_navs), and/or be provided to the selected argument of the navigation container (e.g., navset_tab).

icon: TagChild = None

An icon to appear inline with the button/link.

Examples

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

## file: app.py
from shiny.express import ui

ui.page_opts(title="Nav Panel Example")

with ui.nav_panel("Page 1"):
    "Page 1 content"

with ui.nav_panel("Page 2"):
    with ui.navset_card_underline():
        with ui.nav_panel("Tab 1"):
            "Tab 1 content"
        with ui.nav_panel("Tab 2"):
            "Tab 2 content"
        with ui.nav_panel("Tab 3"):
            "Tab 3 content"

ui.nav_spacer()

with ui.nav_menu("Links", align="right"):
    with ui.nav_control():
        ui.a("Shiny", href="https://shiny.posit.co/py/", target="_blank")
    "----"
    "Plain text"
    "----"
    with ui.nav_control():
        ui.a("Posit", href="https://posit.co", target="_blank")