accordion: Create a vertically collapsing accordion

View source: R/accordion.R

accordionR Documentation

Create a vertically collapsing accordion



An accordion can be used to organize UI elements and content in a limited space. It comprises multiple, vertically stacked panels that expand or collapse when clicked, providing a compact layout that works well for grouping input elements in a sidebar() or for organizing detailed context-specific information.


  id = NULL,
  open = NULL,
  multiple = TRUE,
  class = NULL,
  width = NULL,
  height = NULL

accordion_panel(title, ..., value = title, icon = NULL)



Named arguments become attributes on the ⁠<div class="accordion">⁠ element. Unnamed arguments should be accordion_panel()s.


If provided, you can use input$id in your server logic to determine which of the accordion_panel()s are currently active. The value will correspond to the accordion_panel()'s value argument.


A character vector of accordion_panel() values to open (i.e., show) by default. The default value of NULL will open the first accordion_panel(). Use a value of TRUE to open all (or FALSE to open none) of the items. It's only possible to open more than one panel when multiple=TRUE.


Whether multiple accordion_panel() can be open at once.


Additional CSS classes to include on the accordion div.

width, height

Any valid CSS unit; for example, height="100%".


A title to appear in the accordion_panel()'s header.


A character string that uniquely identifies this panel.


A htmltools::tag child (e.g., bsicons::bs_icon()) which is positioned just before the title.


bslib's accordion component is derived from the Bootstrap Accordion component. Accordions are also featured on the bslib website:

See Also

accordion_panel_set(), accordion_panel_open() and accordion_panel_close() programmatically interact with the state of an accordion panel.

accordion_panel_insert(), accordion_panel_remove() and accordion_panel_update() add or remove accordion panels from an accordion.

Other Components: card(), popover(), tooltip(), value_box()


items <- lapply(LETTERS, function(x) {
  accordion_panel(paste("Section", x), paste("Some narrative for section", x))

# First shown by default
# Nothing shown by default
accordion(!!!items, open = FALSE)
# Everything shown by default
accordion(!!!items, open = TRUE)

# Show particular sections
accordion(!!!items, open = "Section B")
accordion(!!!items, open = c("Section A", "Section B"))

# Provide an id to create a shiny input binding

ui <- page_fluid(
  accordion(!!!items, id = "acc")

server <- function(input, output) {

shinyApp(ui, server)

bslib documentation built on May 29, 2024, 6:31 a.m.