feat: added ability to provide grouping labels for the widgets

inst/shiny/modules/tlg_plot.R

@@ -80,6 +80,10 @@ tlg_plot_server <- function(id, render_plot, options = NULL, data = NULL) {
 
     #' creates widgets responsible for custimizing the plots
     option_widgets <- purrr::imap(options, function(opt_def, opt_id) {
+      if (grepl(".group_label", opt_id)) {
+        return(tags$h1(opt_def, class = "tlg-group-label"))
+      }
+
       observeEvent(input[[opt_id]], {
         options_[[opt_id]] <- input[[opt_id]]
       })

inst/shiny/tlg.yaml

@@ -22,6 +22,9 @@
 #                 # outright or using a special keyword:
                   #   - .colnames keyword will pull the choices from the data column names
                   #   - .COLUMN_NAME keyword will pull choices from values of a specific column
+#     There are additional keywords to allow shaping the resulting interface:
+#     .group_label_N: # will create a label to help visually group related widgets; should be a character
+#                     # string; N should be replaced with an integer to uniquely identify the keyword 
 g_pkconc_ind_lin:
   is_default: true
   type: Graph
@@ -32,6 +35,7 @@ g_pkconc_ind_lin:
   link: https://insightsengineering.github.io/tlg-catalog/stable/graphs/pharmacokinetic/pkcg01.html
   fun: g_pkconc_ind_lin
   options:
+    .group_label_1: "General"
     xvar:
       type: select
       label: X axis
@@ -50,6 +54,7 @@ g_pkconc_ind_lin:
         - PCSPEC
         - PARAM
         - USUBJID
+    .group_label_2: "Labels"
     footnote:
       type: text
       label: Footnote
@@ -60,6 +65,7 @@ g_pkconc_ind_lin:
     ylab:
       type: text
       label: Y axis label
+    .group_label_3: "Limits"
     xmin:
       type: numeric
     xmax:

inst/shiny/www/style.css

@@ -149,4 +149,12 @@
     justify-content: space-around;
     align-items: baseline;
     margin-bottom: 1em;
-  }
+  }
+
+  /* tlg tab */
+  h1.tlg-group-label {
+  font-weight: bold;
+  font-size: 3rem;
+  border-bottom: thin solid #337ab7;
+  border-radius: 0 0 .25em 0;
+}