--- title: "glasstabs Cheatsheet" output: rmarkdown::html_vignette vignette: > %\VignetteIndexEntry{glasstabs Cheatsheet} %\VignetteEngine{knitr::rmarkdown} %\VignetteEncoding{UTF-8} --- ```{r setup, include=FALSE} knitr::opts_chunk$set(eval = FALSE) ``` ## One rule Call `useGlassTabs()` once somewhere in your UI before using any widget. ```{r} ui <- fluidPage( useGlassTabs(), # widgets go here ) ``` ## Tabs: basic pattern ```{r} ui <- fluidPage( useGlassTabs(), glassTabsUI( "main", glassTabPanel("overview", "Overview", selected = TRUE, h3("Overview")), glassTabPanel("details", "Details", h3("Details")) ) ) server <- function(input, output, session) { active_tab <- glassTabsServer("main") } ``` ## Tabs: server actions ```{r} # Switch active tab updateGlassTabsUI(session, "main", "details") # Hide or show a tab hideGlassTab(session, "main", "admin") showGlassTab(session, "main", "admin") # Append or remove a tab at runtime appendGlassTab( session, "main", glassTabPanel("compare", "Compare", h3("Compare")), select = TRUE ) removeGlassTab(session, "main", "compare") ``` ## Tabs: common options ```{r} glassTabsUI( "main", glassTabPanel("a", "A", selected = TRUE, p("A")), glassTabPanel("b", "B", p("B")), selected = "a", wrap = TRUE, extra_ui = tags$div("Right side UI"), theme = "light" ) ``` ## Multi-select: basic pattern ```{r} choices <- c(Revenue = "revenue", Orders = "orders", Returns = "returns") ui <- fluidPage( useGlassTabs(), glassMultiSelect("metric", choices), glassFilterTags("metric") ) server <- function(input, output, session) { metric <- glassMultiSelectValue(input, "metric") } ``` ## Multi-select: update from server ```{r} updateGlassMultiSelect( session, "metric", selected = c("revenue", "orders"), check_style = "filled" ) # Clear selection updateGlassMultiSelect(session, "metric", selected = character(0)) ``` ## Multi-select: useful arguments ```{r} glassMultiSelect( "metric", choices, selected = unname(choices), label = "Metrics", placeholder = "Choose metrics", all_label = "All metrics", check_style = "checkbox", show_style_switcher = TRUE, show_select_all = TRUE, show_clear_all = TRUE, theme = "dark" ) ``` ## Single-select: basic pattern ```{r} regions <- c("All Regions" = "all", North = "north", South = "south") ui <- fluidPage( useGlassTabs(), glassSelect("region", regions, selected = "all") ) server <- function(input, output, session) { region <- glassSelectValue(input, "region") } ``` ## Single-select: update from server ```{r} updateGlassSelect(session, "region", selected = "south") # Clear value updateGlassSelect(session, "region", selected = character(0)) ``` ## Single-select: useful arguments ```{r} glassSelect( "region", regions, selected = "all", label = "Region", placeholder = "Pick a region", searchable = TRUE, clearable = TRUE, include_all = FALSE, check_style = "checkbox", theme = "light" ) ``` ## Theme helpers ```{r} # Tabs glassTabsUI( "main", glassTabPanel("a", "A", selected = TRUE, p("A")), theme = glass_tab_theme( halo_bg = "rgba(251,191,36,0.15)", tab_active_text = "#fef3c7" ) ) # Select widgets glassMultiSelect( "metric", choices, theme = glass_select_theme( mode = "dark", accent_color = "#38bdf8" ) ) ``` ## Input values at a glance | Widget | Server value | |----|----| | `glassTabsUI("main", ...)` | `input[["main-active_tab"]]` or `glassTabsServer("main")()` | | `glassMultiSelect("metric", ...)` | `input$metric` or `glassMultiSelectValue(input, "metric")$selected()` | | multi-select style | `input$metric_style` or `glassMultiSelectValue(input, "metric")$style()` | | `glassSelect("region", ...)` | `input$region` or `glassSelectValue(input, "region")()` | ## Common gotchas - `useGlassTabs()` must be called once in the UI. - `glassSelectValue()` returns a reactive function, not a list. - `glassMultiSelectValue()` returns a list with `selected()` and `style()`. - For `glassMultiSelect()`, `selected` should use choice values, not labels. - If you add new JS/CSS behavior during development, reinstall or `load_all()` before retesting.