Skip to contents

Ecosystem compatibility

Source: vignettes/compatibility.Rmd
compatibility.Rmd

shinyglass is a theme layer, not a universal skin. It targets Bootstrap 5 / bslib surfaces first, then overlays denser dashboard stacks where practical.

Support matrix (as of 0.5.0)

Stack Status Notes
fluidPage / navbarPage Supported Drop-in theme = glass_theme() or glass_page()
bslib page_navbar / nav_menu Supported See chrome-kitchen-sink.R
bslib page_sidebar / layout_sidebar Supported Floating glass sidebar; nested layouts stay in-flow (0.1.1+)
bslib cards, value boxes, navsets, accordion Supported Tooltip / popover / toast use the glass menu surface
DT Supported Visible .page-link chips (not li-only)
reactable Supported Avoids double-framing the html-output
gt Supported Table / heading / stripe / summary chrome
leaflet Supported Map container transparency
plotly Good Glass frame + modebar; set paper_bgcolor transparent in R for best dark
shinyWidgets (common inputs) Good Slider tooltips / noUiSlider chips
shinydashboard / bs4Dash / shinydashboardPlus Overlay Glass header/sidebar/boxes/controlbar/dropdowns; layout stays AdminLTE
teal Good Use options(teal.bs_theme = glass_theme())
waiter / shinybusy / loaders Good Blurred overlays, not solid white scrims
shinyalert / SweetAlert2 Good Popup uses glass menu surface
rhandsontable Partial Frame + cell ink; core grid still third-party
echarts4r / highcharter / apex Partial Host wrapper glass; chart internals set in R
Bootstrap 3-only apps Limited Theme is BS5 via bslib
shinyreact Supported glass_page_react() loads the React components and useGlassTheme() (vignette("shinyreact")). page_react(theme = glass_theme()) gets the CSS without the component module. page_react_html() takes glass_theme_dependencies() as extra_deps. Do not hard-code panel colors. Shadow roots need window.shinyglass.adoptShadow().
shinychat Supported page_chat(theme = glass_theme()) and embedded chat_ui(). See vignette("shinychat") and vignette("migrating").
bslib offcanvas() Supported Glass material, scale from the trigger, scroll edge on the header. Bootstrap still owns the slide.

Layout contract

  • Open bslib sidebars reserve space in main so content is not buried under the floating chrome.
  • Nested layout_sidebar() does not double-float.
  • AdminLTE left sidebars keep fixed AdminLTE geometry; glass is visual overlay only.

Examples 

# overlays: datepicker, notifications, showModal, accordion, navbar menu
shiny::runApp(system.file("examples", "chrome-kitchen-sink.R", package = "shinyglass"))

# plotly + gt (+ waiter if installed)
shiny::runApp(system.file("examples", "plotly-gt-demo.R", package = "shinyglass"))

# denser AdminLTE (requires shinydashboardPlus)
shiny::runApp(system.file("examples", "shinydashboardPlus-glass-demo.R", package = "shinyglass"))

# React client (requires shinyreact). www/ui.js is the UI.
shiny::runApp(system.file("examples/shinyreact-glass", package = "shinyglass"))

Dual-theme contrast audit (optional ecosystem apps skip if packages missing):

Rscript inst/scripts/audit-glass-contrast.R --apps=demo,dashboard,inputs,plotly_gt,chrome,chat

Tips

  • Prefer bslib page functions when you can. Glass was designed around them.
  • For plotly dark mode, pass transparent paper_bgcolor / plot_bgcolor in layout() (or plotly_glass()). See plotly-gt-demo.R; CSS handles the modebar. Use plot_surface = "opaque" when the chart itself needs a panel.
  • For print / chromote / PDF, call glass_flatten() or open with ?glass_flatten=1 so backdrop blur does not wash out the capture.
  • For dark mode in dense AdminLTE apps, re-check value/info box contrast after switching preset at runtime.
  • preset = "auto" is ideal for demos; pin "light" or "dark" for screenshots and tests.