Skip to contents

Compact row of color wells. The client applies window.shinyglass.setPrimary() immediately; the value is also a Shiny input (input[[inputId]]) so the server can persist or restyle plots. Pair with observe_glass_accent() if you also want update_glass_theme() to echo the change.

Usage

glass_accent_input(
  inputId = "glass_accent",
  label = "Accent",
  selected = "blue",
  colors = glass_system_colors()
)

Arguments

inputId

The input slot that will be used to access the hex value.

label

Display label (or NULL for none).

selected

Initially selected well: a name in colors or a hex string.

colors

Named character vector of hex colors. Defaults to glass_system_colors().

Value

A Shiny UI tag hierarchy.

Examples

wells <- glass_accent_input()
wells
#> <div class="form-group shiny-input-container glass-accent-input" id="glass_accent" data-glass-accent-input="glass_accent" role="radiogroup">
#>   <label class="control-label" id="glass_accent-label">Accent</label>
#>   <div class="glass-accent-wells">
#>     <button type="button" class="glass-accent-well is-selected" style="--glass-well-color:#007AFF;background:#007AFF;" data-glass-primary="#007AFF" data-glass-accent-input="glass_accent" aria-label="blue" aria-checked="true" role="radio"></button>
#>     <button type="button" class="glass-accent-well " style="--glass-well-color:#AF52DE;background:#AF52DE;" data-glass-primary="#AF52DE" data-glass-accent-input="glass_accent" aria-label="purple" aria-checked="false" role="radio"></button>
#>     <button type="button" class="glass-accent-well " style="--glass-well-color:#FF2D55;background:#FF2D55;" data-glass-primary="#FF2D55" data-glass-accent-input="glass_accent" aria-label="pink" aria-checked="false" role="radio"></button>
#>     <button type="button" class="glass-accent-well " style="--glass-well-color:#FF9500;background:#FF9500;" data-glass-primary="#FF9500" data-glass-accent-input="glass_accent" aria-label="orange" aria-checked="false" role="radio"></button>
#>     <button type="button" class="glass-accent-well " style="--glass-well-color:#34C759;background:#34C759;" data-glass-primary="#34C759" data-glass-accent-input="glass_accent" aria-label="green" aria-checked="false" role="radio"></button>
#>     <button type="button" class="glass-accent-well " style="--glass-well-color:#64D2FF;background:#64D2FF;" data-glass-primary="#64D2FF" data-glass-accent-input="glass_accent" aria-label="teal" aria-checked="false" role="radio"></button>
#>   </div>
#> </div>