feat(layout_column_wrap): Allow items to be smaller than min width (#851)

Author: gadenbuie

NEWS.md

@@ -42,6 +42,8 @@
 
 * `layout_sidebar()` now uses an `<aside>` element for the sidebar's container and a `<header>` element for the sidebar title. The classes of each element remain the same, but the semantic meaning of the elements is now better reflected in the HTML markup. (#580)
 
+* In `layout_column_wrap()`, when `width` is a CSS unit -- e.g. `width = "400px"` or `width = "25%"` -- and `fixed_width = FALSE`, `layout_column_wrap()` will ensure that the columns are at least `width` wide, unless the parent container is narrower than `width`. (#851)
+
 ## Bug fixes
 
 * `toggle_switch()` now works correctly when called from within a Shiny module. `update_switch()` worked as expected, but `toggle_switch()` didn't apply the module's namespace to the `id` of the switch to be updated. (#769)

R/layout.R

@@ -20,9 +20,14 @@
 #'   * `NULL`
 #'     * Allows power users to set the `grid-template-columns` CSS property
 #'       manually, either via a `style` attribute or a CSS stylesheet.
-#' @param fixed_width Whether or not to interpret the `width` as a minimum
-#'   (`fixed_width=FALSE`) or fixed (`fixed_width=TRUE`) width when it is a CSS
-#'   length unit.
+#' @param fixed_width When `width` is greater than 1 or is a CSS length unit,
+#'   e.g. `"200px"`, `fixed_width` indicates whether that `width` value
+#'   represents the absolute size of each column (`fixed_width=TRUE`) or the
+#'   minimum size of a column (`fixed_width=FALSE`). When `fixed_width=FALSE`,
+#'   new columns are added to a row when `width` space is available and columns
+#'   will never exceed the container or viewport size. When `fixed_width=TRUE`,
+#'   all columns will be exactly `width` wide, which may result in columns
+#'   overflowing the parent container.
 #' @param heights_equal If `"all"` (the default), every card in every row of the
 #'   grid will have the same height. If `"row"`, then every card in _each_ row
 #'   of the grid will have the same height, but heights may vary between rows.
@@ -77,7 +82,10 @@ layout_column_wrap <- function(
       if (fixed_width) {
         paste0("repeat(auto-fit, ", validateCssUnit(width), ")")
       } else {
-        paste0("repeat(auto-fit, minmax(", validateCssUnit(width), ", 1fr))")
+        sprintf(
+          "repeat(auto-fit, minmax(min(%s, 100%%), 1fr))",
+          validateCssUnit(width)
+        )
       }
     }
   }