// node scripts/css.mjs [--minify] [--watch]
//
// Tailwind writes to a scratch file; the scoped, optionally minified result
// is what lands in styles.css. See scope-css.mjs for why the extra step.
import { spawn, spawnSync } from "node:child_process";
import { readFileSync, watch, writeFileSync } from "node:fs";
import { join } from "node:path";
import { scopeCss } from "./scope-css.mjs";

const root = new URL("..", import.meta.url).pathname;
const args = new Set(process.argv.slice(2));
const minify = args.has("--minify");
const watching = args.has("--watch");

const input = join(root, "src/tailwind.css");
const scratch = join(root, ".tailwind.css");
const output = join(root, "styles.css");
const cli = join(root, "node_modules/.bin/tailwindcss");

function finish() {
  const built = readFileSync(scratch, "utf8");
  writeFileSync(output, scopeCss(built, { minify }));
  console.log(`css: wrote styles.css (${minify ? "minified, " : ""}scoped)`);
}

if (watching) {
  writeFileSync(scratch, "");
  const child = spawn(cli, ["-i", input, "-o", scratch, "--watch"], {
    stdio: "inherit",
  });
  let timer = null;
  watch(scratch, () => {
    if (timer) {
      clearTimeout(timer);
    }
    timer = setTimeout(() => {
      timer = null;
      try {
        finish();
      } catch (error) {
        console.error("css:", error);
      }
    }, 60);
  });
  child.on("exit", (code) => process.exit(code ?? 0));
} else {
  const run = spawnSync(cli, ["-i", input, "-o", scratch], {
    stdio: "inherit",
  });
  if (run.status !== 0) {
    process.exit(run.status ?? 1);
  }
  finish();
}