R: Add a popover to a UI element

popover {bslib}

R Documentation

Description

Display additional information when clicking on a UI element (typically a button).

Usage

popover(
  trigger,
  ...,
  title = NULL,
  id = NULL,
  placement = c("auto", "top", "right", "bottom", "left"),
  options = list()
)

toggle_popover(id, show = NULL, session = get_current_session())

update_popover(id, ..., title = NULL, session = get_current_session())

Arguments

`trigger`	The UI element to serve as the popover trigger (typically a `shiny::actionButton()` or similar). If `trigger` renders as multiple HTML elements (e.g., it's a `tagList()`), the last HTML element is used for the trigger. If the `trigger` should contain all of those elements, wrap the object in a `div()` or `span()`.
`...`	UI elements for the popover's body. Character strings are automatically escaped unless marked as `HTML()`.
`title`	A title (header) for the popover.
`id`	A character string. Required to re-actively respond to the visibility of the popover (via the `input[[id]]` value) and/or update the visibility/contents of the popover.
`placement`	The placement of the popover relative to its trigger.
`options`	A list of additional options.
`show`	Whether to show (`TRUE`) or hide (`FALSE`) the popover. The default (`NULL`) will show if currently hidden and hide if currently shown. Note that a popover will not be shown if the trigger is not visible (e.g., it's hidden behind a tab).
`session`	A Shiny session object (the default should almost always be used).

Functions

popover(): Add a popover to a UI element
toggle_popover(): Programmatically show/hide a popover.
update_popover(): Update the contents of a popover.

Closing popovers

In addition to clicking the close_button, popovers can be closed by pressing the Esc/Space key when the popover (and/or its trigger) is focused.

Theming/Styling

Like other bslib components, popovers can be themed by supplying relevant theming variables to bs_theme(), which effects styling of every popover on the page. To style a specific popover differently from other popovers, utilize the customClass option:

popover(
  "Trigger", "Popover message",
  options = list(customClass = "my-pop")
)

And then add relevant rules to bs_theme() via bs_add_rules():

bs_theme() |> bs_add_rules(".my-pop { max-width: none; }")

References

https://getbootstrap.com/docs/5.3/components/popovers/

Examples



popover(
  shiny::actionButton("btn", "A button"),
  "Popover body content...",
  title = "Popover title"
)

library(shiny)

ui <- page_fixed(
  card(class = "mt-5",
    card_header(
      popover(
        uiOutput("card_title", inline = TRUE),
        title = "Provide a new title",
        textInput("card_title", NULL, "An editable title")
      )
    ),
    "The card body..."
  )
)

server <- function(input, output) {
  output$card_title <- renderUI({
    list(input$card_title, bsicons::bs_icon("pencil-square"))
  })
}

shinyApp(ui, server)

[Package bslib version 0.5.1 Index]

Add a popover to a UI element