Light / dark / auto theme toggle buttons

Drop-in button group for switching the glass preset. Each button sets the preset on the client immediately (window.shinyglass.setPreset) and also has a 'shiny' input id so observe_glass_theme_toggle() can keep the server in sync (important on hosts that rewrite custom messages).

Usage

glass_theme_toggle(
  inputId = "glass_toggle",
  selected = c("auto", "light", "dark"),
  labels = c(light = "Light", dark = "Dark", auto = "Auto (OS)"),
  class = "glass-theme-toggle"
)

Arguments

inputId

Base id. Buttons are {inputId}_light, {inputId}_dark, and {inputId}_auto.

selected

Initially highlighted mode ("light", "dark", or "auto"). Cosmetic only; the page theme still comes from glass_theme().

labels

Named character vector for button labels. Names must be light, dark, and/or auto.

class

Extra CSS classes for the wrapper.

Value

An htmltools::tag() button group.

See also

observe_glass_theme_toggle(), update_glass_theme(), glass_preset_input()

Other glass controls: glass_accent_input(), glass_intensity_slider(), glass_plot_surface_input(), glass_preset_input(), glass_resolved_preset(), glass_scene_input(), glass_system_colors(), observe_glass(), observe_glass_accent(), observe_glass_intensity(), observe_glass_plot_surface(), observe_glass_preset_input(), observe_glass_scene(), observe_glass_theme_toggle()

Examples

glass_theme_toggle(selected = "dark")
#> <div class="glass-theme-toggle" role="group" aria-label="Glass theme preset">
#>   <button aria-pressed="false" class="btn btn-default action-button btn-sm btn-secondary" data-glass-preset-mode="light" id="glass_toggle_light" type="button"><span class="action-label">Light</span></button>
#>   <button aria-pressed="true" class="btn btn-default action-button btn-sm btn-primary" data-glass-preset-mode="dark" id="glass_toggle_dark" type="button"><span class="action-label">Dark</span></button>
#>   <button aria-pressed="false" class="btn btn-default action-button btn-sm btn-secondary" data-glass-preset-mode="auto" id="glass_toggle_auto" type="button"><span class="action-label">Auto (OS)</span></button>
#> </div>