chore: use dev htmtlools (#1228)

Author: gadenbuie

CHANGELOG.md

@@ -31,6 +31,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Other changes
 
+* The fill CSS used by fillable containers (i.e. when `fillable=True`) now uses a [CSS cascade layer](https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Cascade_layers) named `htmltools` to reduce the precedence order of the fill CSS. (#1228)
+
 ## [0.8.1] - 2024-03-06
 
 ### Breaking Changes

scripts/htmlDependencies.R

@@ -21,7 +21,7 @@ ignore <- capture.output({
     "rstudio/bslib@main",
     "rstudio/shiny@main",
     "rstudio/sass@main",
-    "cran::htmltools"
+    "rstudio/htmltools@main"
   ))
   #pak::pkg_install(c("rstudio/bslib@main", "rstudio/shiny@main", "rstudio/htmltools@main"))
 })

shiny/_versions.py

@@ -1,6 +1,6 @@
 shiny_html_deps = "1.8.0.9000"
 bslib = "0.6.1.9001"
-htmltools = "0.5.7"
+htmltools = "0.5.7.9000"
 bootstrap = "5.3.1"
 requirejs = "2.3.6"
 

shiny/www/shared/bootstrap/_version.json

@@ -2,6 +2,6 @@
   "note!": "This file is auto-generated by scripts/htmlDependencies.R",
   "shiny_version": "Github (rstudio/shiny@ae308e03adcb040756ac5d13c76b50244216173d)",
   "bslib_version": "Github (rstudio/bslib@2ec3067eb20fcdcd25260a8ee7ec6a7607839429)",
-  "htmltools_version": "CRAN (R 4.3.1)",
+  "htmltools_version": "Github (rstudio/htmltools@f8e059157c3de6f03bf8d8dcebcaff531bc97fd4)",
   "bootstrap_version": "5.3.1"
 }

shiny/www/shared/htmltools/_version.json

@@ -1,5 +1,5 @@
 {
   "note!": "This file is auto-generated by scripts/htmlDependencies.R",
   "package": "htmltools",
-  "version": "CRAN (R 4.3.1)"
+  "version": "Github (rstudio/htmltools@f8e059157c3de6f03bf8d8dcebcaff531bc97fd4)"
 }

shiny/www/shared/htmltools/fill/fill.css

@@ -1,19 +1,21 @@
-.html-fill-container {
-  display: flex;
-  flex-direction: column;
-  /* Prevent the container from expanding vertically or horizontally beyond its
-     parent's constraints. */
-  min-height: 0;
-  min-width: 0;
-}
-.html-fill-container > .html-fill-item {
-  /* Fill items can grow and shrink freely within
-     available vertical space in fillable container */
-  flex: 1 1 auto;
-  min-height: 0;
-  min-width: 0;
-}
-.html-fill-container > :not(.html-fill-item) {
-  /* Prevent shrinking or growing of non-fill items */
-  flex: 0 0 auto;
+@layer htmltools {
+  .html-fill-container {
+    display: flex;
+    flex-direction: column;
+    /* Prevent the container from expanding vertically or horizontally beyond its
+    parent's constraints. */
+    min-height: 0;
+    min-width: 0;
+  }
+  .html-fill-container > .html-fill-item {
+    /* Fill items can grow and shrink freely within
+    available vertical space in fillable container */
+    flex: 1 1 auto;
+    min-height: 0;
+    min-width: 0;
+  }
+  .html-fill-container > :not(.html-fill-item) {
+    /* Prevent shrinking or growing of non-fill items */
+    flex: 0 0 auto;
+  }
 }