Site icon R-bloggers

Tabler 0.1.0 is here!

[This article was first published on https://pacha.dev/blog, and kindly contributed to R-bloggers]. (You can report issue about the content on this page here)
Want to share your content on R-bloggers? click here if you have a blog, or here if you don't.
< !DOCTYPE html> < charset="utf-8"> < http-equiv="X-UA-Compatible" content="IE=edge"> < name="viewport" content="width=device-width, initial-scale=1.0"> pacha.dev/blog < !-- MathJax Configuration --> < !-- Smart header: libraries detected based on content --> < !-- File: /tmp/tmp.N1anU9yLZv/index.html -->
  • < !-- DEBUG: Found sourceCode --> < !-- DEBUG: Found d3po --> < !-- Load custom CSS after any library CSS to ensure proper precedence -->
  • < header class="site-top">

    Mauricio “Pachá” Vargas Sepúlveda

    Blog with notes about R, Shiny, SQL, Python, Linux and C++. This blog is listed on R-Bloggers.

    HOME 🏠
    < !-- categories are printed below this--> < nav class="sidebar-nav">

    Categories

    < header id="title-block-header" class="quarto-title-block default">

    Tabler 0.1.0 is here!

    Tabler Dashboard implementation for R/Shiny
    Author

    Mauricio “Pachá” Vargas S.

    Published

    October 27, 2025

    If this post is useful to you I kindly ask a minimal donation on Buy Me a Coffee. It shall be used to continue my Open Source efforts.

    You can send me questions for the blog using this form and subscribe to receive an email when there is a new post.

    < section id="about" class="level2">

    About

    Tabler for R is a modern dashboard framework for R Shiny using the beautiful Tabler Dashboard.

    Here is a short video overview of Tabler for R:

    I am aware there is a TablerDash package. This is a different implementation that I started from scratch to provide more flexibility and options for layouts, themes, and colours.

    Furthermore, this implementation is FOSS (Free and Open Source Software) under the Apache 2.0 license, which means you can use it freely in government or NGO projects without worrying about licensing fees. D3po (see the previous) post is also Apache 2.0 licensed for the same reason.

    While this project is a one man show, I welcome contributions and suggestions via GitHub issues or pull requests that adhere to The Apache Way.

    Here are some screenshots of different layouts and themes:

    Navbar Overlap – Light

    Vertical – Dark

    Vertical – Light
    < section id="installation" class="level2">

    Installation

    # using the R-Universe
    install.packages("tabler", repos = "https://pachadotdev.r-universe.dev")
    
    # or using the remotes package
    remotes::install_github("pachadotdev/tabler")
    < section id="quick-start" class="level2">

    Quick Start

    Please see the documentation: https://pacha.dev/tabler/

    Here is a complete example that I use to test all layouts with the theme (light/dark) and colour options: https://github.com/pachadotdev/tabler/blob/main/examples/shiny-test-layouts.R

    Here’s a minimal example using the “combo” layout with sidebar and top navbar: https://github.com/pachadotdev/tabler/blob/main/examples/shiny-test-combo.R

    if (!require("d3po")) {
      install.packages("d3po", repos = "https://pachadotdev.r-universe.dev")
    }
    
    library(shiny)
    
    # library(tabler)
    load_all()
    
    library(d3po)
    
    sidebar_nav <- navbar_menu(
      brand = "Combo Layout",
      menu_item("Home", icon = "home"),
      menu_dropdown(
        "Layout",
        icon = "layout-2",
        href = "./",
        items = list(
          c("Boxed", "./"),
          c("Combined", "./"),
          c("Condensed", "./"),
          c("Fluid", "./"),
          c("Fluid vertical", "./"),
          c("Horizontal", "./"),
          c("Navbar dark", "./"),
          c("Navbar overlap", "./"),
          c("Navbar sticky", "./"),
          c("Right vertical", "./"),
          c("RTL mode", "./"),
          c("Vertical", "./"),
          c("Vertical transparent", "./")
        )
      )
    )
    
    # Simplified menu for the top navbar (just labels, no icons for simplicity)
    top_nav <- navbar_menu(
      menu_item("Button 1", icon = NULL),
      menu_dropdown(
        "Button 2",
        icon = "layout-2",
        href = "./",
        items = list(
          c("Button 3", "./")
        )
      )
    )
    
    # Combine both for combo layout
    main_navbar <- list(side = sidebar_nav, top = top_nav)
    
    ui <- tabler_page(
      theme = "light",
      color = "teal",
      title = "Combo Layout",
      layout = "combo",
      show_theme_button = FALSE,
      navbar = main_navbar,
      body = list(
        # Page header
        page_header(
          title_text = "Combo Layout",
          pretitle_text = "Overview"
        ),
        # Page body content
        shiny::tags$div(
          class = "page-body",
          shiny::tags$div(
            class = "container-xl",
            column(
              6,
              tabler_card(
                title = "My title",
                footer = "Footer.",
                p("My text"),
                p("More text", class = "text-muted"),
                d3po_output("plot", width = "100%", height = "500px")
              )
            )
          )
        )
      ),
      footer = tabler_footer(
        left = "Tabler",
        right = shiny::tags$span("v1.4.0")
      )
    )
    
    server <- function(input, output, session) {
      output$plot <- render_d3po({
        set.seed(123)
    
        sim <- data.frame(
          x = rnorm(100),
          y = rnorm(100),
          letter = sample(letters[1:3], 100, replace = TRUE)
        )
    
        # for light theme
        axis_color <- "#000"
        tooltip_color <- "#fff"
    
        # for dark theme
        axis_color <- "#fff"
        tooltip_color <- "#000"
    
        d3po(sim) %>%
          po_scatter(daes(x = x, y = y, group = letter)) %>%
          po_labels(title = "Weight Distribution by Type") %>%
          po_background("transparent") %>%
          po_theme(axis = axis_color, tooltips = tooltip_color)
      })
    }
    
    shinyApp(ui, server)
    < section id="available-layouts" class="level2">

    Available Layouts

    All examples use the same basic structure from the Quick Start example above. Here are the key differences for each layout:

    • Boxed (Default): Basic dashboard with top navbar and constrained width content area. This is the default layout.
    • Combo: Combines vertical sidebar navigation with top header.
    • Condensed: Compact layout with reduced padding/margins.
    • Fluid: Full-width layout without container constraints.
    • Fluid Vertical: Full-width layout with vertical sidebar.
    • Horizontal: Layout with horizontal navigation menu.
    • Navbar Dark: Layout with dark navbar theme.
    • Navbar Overlap: Layout where content overlaps with navbar for a modern look.
    • Navbar Sticky: Layout with sticky/fixed navbar that stays at the top when scrolling.
    • RTL: Right-to-left layout for Hebrew/Arabic languages.
    • Vertical: Vertical sidebar layout without top navbar.
    • Vertical Right: Vertical sidebar positioned on the right side.
    • Vertical Transparent: Vertical layout with transparent sidebar.
    < footer>

    Loading…

  • < !-- Load shared sidebar -->
    To leave a comment for the author, please follow the link and comment on their blog: https://pacha.dev/blog.

    R-bloggers.com offers daily e-mail updates about R news and tutorials about learning R and many other topics. Click here if you're looking to post or find an R/data-science job.
    Want to share your content on R-bloggers? click here if you have a blog, or here if you don't.
    Exit mobile version