feat: Toasts

[gadenbuie]

Introduces a comprehensive toast notification system for Shiny applications, including toast() (with toast_header() helper), show_toast() and hide_toast().

Toasts are small notification messages that are shown temporarily on screen. By default they autohide after 5 seconds, but this delay can be customized. bslib toasts have a few interesting features above and beyond the Bootstrap standard toasts:

1. A progress border give the user a sense of how long the toast will remain on screen
2. Hovering over an auto-hiding toast will pause the auto-hide timer, giving users a way to keep a toast on screen as long as they need (or if they're interacting with it)
3. Toasts that are not auto-hiding can be hidden with server logic: show_toast() returns the ID of the toast that was shown (either auto-generated or from the toast object being shown). This ID can then be used with hide_toast() to hide the toast.
4. Toasts can be positioned in any combination of top, middle, bottom and left, center, right. We automatically group toasts together if another toast in the same position already exists.

bslib toasts come with an additional demo app to try out all of the features:

shiny::runExample("toast", package = "bslib")

Examples

Basic toast

show_toast(toast("This is a toast notification!"))

# or more simply
show_toast("This is a toast notification!")

Toast with header

show_toast(
  toast(
    "This is a toast notification!",
    header = toast_header(
      title = "Notification Title",
      icon = bsicons::bs_icon("star"),
      status = "16s ago"
    )
  )
)

Toast with header and type = "success"

show_toast(
  toast(
    "Your profile has been updated successfully",
    header = toast_header(
      title = "Profile updated",
      icon = bsicons::bs_icon("check", class = "text-success"),
      status = "just now"
    )
  )
)

Toast with Shiny controls

show_toast(
  toast(
    id = "unsaved_changes_toast",
    p("Would you like to save your changes?"),
    actionButton("save_yes", "Save", class = "btn-sm btn-primary me-2"),         
    actionButton(
      "save_no",
      "Don't Save",
      class = "btn-sm btn-secondary"
    ),
    header = "Unsaved Changes",
    type = "warning",
    duration_s = 0
  )
)

[cpsievert]

If I click 'show' repeatedly, then 'hide' repeatedly, only the 1st hide works (since we're only tracking the last ID).

Related to this problem, would it make sense for hide_toast() to remove the "oldest" toast? Or provide access to a input[["toast_id"]] == T/F ?

[gadenbuie]

Yeah, that's why I labelled the button "Hide Last Toast". We certainly could keep track of a stack of toasts, but I don't think it's worth it for this example app.

I'm also fairly strongly against creating inputs for toasts to track their state. Toasts are primarily ephemeral by design; I don't think it's a good idea to add to the input namespace for something that is intended to be short-lived in the app.

I could be convinced to add a toast_state(id) helper that would return a reactive value indicating whether a toast with the given ID is currently visible or not. But I don't think it's a necessary feature so I'd rather hold off on that for now.