fix(scss): Remove updated scss files and restore R sass compilation (#4272)

* Revert changes in 8861645d99 from #4252

We compile from R sass. So we should be partial to R's compiler, no the latest in npm

* Restore original compile script (with message) that built using R-sass, not npm

* Add step in build command to update the sass output

* run new command

inst/www/shared/shiny_scss/shiny.scss

@@ -1,4 +1,3 @@
-@use "sass:meta";
 // DEFAULTS
 $shiny-disconnected-bg:             #999 !default;
 $shiny-table-na:                    #909090 !default;
@@ -48,7 +47,7 @@ $shiny-file-over-shadow:            inset 0 1px 1px rgba(black, .075), 0 0 8px r
 // Both BS3 and BS4 define a border radius mixin, but just in case
 // we're trying to compile this without bootstrapSass
 @mixin border-radius-shim($radius) {
-  @if meta.mixin-exists("border-radius") {
+  @if mixin-exists("border-radius") {
     @include border-radius($radius);
   } @else {
     border-radius: $radius;

srcts/build/extras.ts

@@ -4,12 +4,16 @@
 // ```
 
 import autoprefixer from "autoprefixer";
+import { exec } from "child_process";
 import { sassPlugin } from "esbuild-sass-plugin";
 import postcss from "postcss";
 import postcssPresetEnv from "postcss-preset-env";
+import { promisify } from "util";
 
 import { banner, build, outDir } from "./_build.js";
 
+const execAsync = promisify(exec);
+
 const sassOpts = {
   minify: true,
   banner: banner,
@@ -45,20 +49,18 @@ async function main(): Promise<void> {
       outdir: outDir,
     }),
 
+    // Shiny sass MUST be built using `Rscript tools/updateShinyCss.R`
+    execAsync("Rscript tools/updateShinyCss.R").then(({ stdout, stderr }) => {
+      if (stdout) console.log(stdout);
+      if (stderr) console.error(stderr);
+    }),
+
     // Sass builds
     build({
       ...sassOpts,
       entryPoints: ["srcts/extras/shiny-showcase.scss"],
       outfile: outDir + "shiny-showcase.css",
     }),
-    build({
-      ...sassOpts,
-      entryPoints: [
-        // Must keep shiny.scss within `inst` to be able to use as htmldependency
-        outDir + "shiny_scss/shiny.scss",
-      ],
-      outfile: outDir + "shiny.min.css",
-    }),
     build({
       ...sassOpts,
       entryPoints: ["srcts/extras/busy-indicators/busy-indicators.scss"],

tools/updateShinyCss.R

@@ -0,0 +1,11 @@
+#!/usr/bin/env Rscript
+library(rprojroot)
+library(sass)
+
+scss <- find_package_root_file("inst/www/shared/shiny_scss/shiny.scss")
+shiny_css <- sass(
+  sass_file(scss), cache = NULL,
+  options = sass_options(output_style = "compressed"),
+  output = find_package_root_file("inst/www/shared/shiny.min.css")
+)
+message("Built inst/www/shared/shiny.min.css")