@skafform/vite-plugin 0.1.2 → 0.1.4

package/base.css

@@ -42,6 +42,7 @@
 
   /* Mise en page */
   --skafform-navbar-height:   60px;
+  --skafform-page-gutter:     40px;
 }
 
 html, body {

package/dist/index.js

@@ -57,10 +57,22 @@ function skafform() {
   let root = process.cwd();
   let brickIndex = /* @__PURE__ */ new Set();
   let config = {};
+  let themeJsonCache = null;
+  let bricksConfigCache = null;
   function getThemeJson(theme) {
+    if (themeJsonCache) return themeJsonCache;
     const childPath = resolve(root, `themes/${theme}/child/theme.json`);
     if (!existsSync(childPath)) return {};
-    return JSON.parse(readFileSync(childPath, "utf-8"));
+    const parsed = JSON.parse(readFileSync(childPath, "utf-8"));
+    themeJsonCache = parsed;
+    return parsed;
+  }
+  function getBricksConfig() {
+    if (bricksConfigCache) return bricksConfigCache;
+    const path = resolve(root, "skafform-bricks.json");
+    if (!existsSync(path)) return null;
+    bricksConfigCache = JSON.parse(readFileSync(path, "utf-8"));
+    return bricksConfigCache;
   }
   function readCss(path) {
     return readFileSync(path, "utf-8").replace(/^/, "");
@@ -73,20 +85,92 @@ function skafform() {
 ${vars}
 }`;
   }
+  const TAILWIND_TOKEN_MAP = {
+    "primary": "--color-primary",
+    "primary-fg": "--color-primary-fg",
+    "primary-hover": "--color-primary-hover",
+    "background": "--color-background",
+    "foreground": "--color-foreground",
+    "muted": "--color-muted",
+    "muted-fg": "--color-muted-fg",
+    "border": "--color-border",
+    "border-subtle": "--color-border-subtle",
+    "error": "--color-error",
+    "font": "--font-sans",
+    "font-heading": "--font-heading",
+    "font-body": "--font-body",
+    "font-size-xs": "--text-xs",
+    "font-size-sm": "--text-sm",
+    "font-size-base": "--text-base",
+    "font-size-lg": "--text-lg",
+    "font-size-xl": "--text-xl",
+    "font-size-2xl": "--text-2xl",
+    "radius": "--radius",
+    "radius-sm": "--radius-sm",
+    "radius-md": "--radius-md",
+    "radius-lg": "--radius-lg",
+    "radius-full": "--radius-full",
+    "shadow-sm": "--shadow-sm",
+    "shadow-md": "--shadow-md",
+    "shadow-lg": "--shadow-lg"
+  };
+  function generateTailwindTheme(tokens) {
+    const lines = [];
+    for (const key of Object.keys(tokens)) {
+      const twVar = TAILWIND_TOKEN_MAP[key];
+      if (twVar) lines.push(`  ${twVar}: var(--skafform-${key});`);
+    }
+    if (lines.length === 0) return "";
+    return `@theme inline {
+${lines.join("\n")}
+}`;
+  }
+  function generateDarkTokensCss(darkTokens, lightTokens) {
+    const entries = Object.entries(darkTokens);
+    if (entries.length === 0) return "";
+    const darkVars = entries.map(([k, v]) => `    --skafform-${k}: ${v};`).join("\n");
+    const classVars = entries.map(([k, v]) => `  --skafform-${k}: ${v};`).join("\n");
+    const lightVars = entries.filter(([k]) => k in lightTokens).map(([k]) => `  --skafform-${k}: ${lightTokens[k]};`).join("\n");
+    return [
+      `@media (prefers-color-scheme: dark) {
+  :root {
+${darkVars}
+  }
+}`,
+      `.dark {
+${classVars}
+}`,
+      lightVars ? `.light {
+${lightVars}
+}` : ""
+    ].filter(Boolean).join("\n");
+  }
   function getCssString() {
     const themeJson = getThemeJson(config.theme);
     const themeCssPath = resolve(root, `themes/${config.theme}/styles/theme.css`);
     const base = readCss(baseCssPath);
     const theme = existsSync(themeCssPath) ? readCss(themeCssPath) : "";
     const tokens = generateTokensCss(themeJson.tokens ?? {});
-    return base + "\n" + theme + (tokens ? "\n" + tokens : "");
+    const dark = themeJson.tokens_dark ? generateDarkTokensCss(themeJson.tokens_dark, themeJson.tokens ?? {}) : "";
+    const css = base + "\n" + theme + (tokens ? "\n" + tokens : "") + (dark ? "\n" + dark : "");
+    if (config.tailwind) {
+      const tailwindTheme = generateTailwindTheme(themeJson.tokens ?? {});
+      return `@import "tailwindcss";
+
+` + css + (tailwindTheme ? "\n" + tailwindTheme : "");
+    }
+    return css;
   }
   return {
     name: "skafform",
     enforce: "pre",
     configResolved(resolved) {
       root = resolved.root;
-      config = JSON.parse(readFileSync(resolve(root, "skafform.config.json"), "utf-8"));
+      try {
+        config = JSON.parse(readFileSync(resolve(root, "skafform.config.json"), "utf-8"));
+      } catch (err) {
+        throw new Error(`[skafform] Cannot read skafform.config.json: ${err instanceof Error ? err.message : err}`);
+      }
       brickIndex = loadBrickIndex(root);
       writeFileSync(resolve(root, "app/skafform-theme.css"), getCssString(), "utf-8");
     },
@@ -117,13 +201,13 @@ ${vars}
         const themeJson = getThemeJson(config.theme);
         return `export default ${JSON.stringify({
           ...config,
-          customize: { ...themeJson.customize ?? {}, ...config.customize ?? {} }
+          customize: { ...themeJson.customize ?? {}, ...config.customize ?? {} },
+          fonts: themeJson.fonts ?? []
         })}`;
       }
       if (id === RESOLVED_ADMIN_SECTIONS) {
-        const bricksConfigPath = resolve(root, "skafform-bricks.json");
-        if (!existsSync(bricksConfigPath)) return "export default []";
-        const bricksConfig = JSON.parse(readFileSync(bricksConfigPath, "utf-8"));
+        const bricksConfig = getBricksConfig();
+        if (!bricksConfig) return "export default []";
         const sections = [];
         for (const brick of Object.values(bricksConfig.bricks ?? {})) {
           for (const section of brick.adminSections ?? []) {
@@ -133,23 +217,31 @@ ${vars}
         return `export default ${JSON.stringify(sections)}`;
       }
       if (id === RESOLVED_SERVER_INIT) {
-        const bricksConfigPath = resolve(root, "skafform-bricks.json");
-        if (!existsSync(bricksConfigPath)) return "";
-        const bricksConfig = JSON.parse(readFileSync(bricksConfigPath, "utf-8"));
+        const bricksConfig = getBricksConfig();
+        if (!bricksConfig) return "";
         const adapters = bricksConfig.adapters ?? {};
         if (!adapters.auth) return "";
         const adapterPath = resolve(root, adapters.auth).replace(/\\/g, "/");
         return [
           `import { setAdapter } from "@skafform/core/runtime"`,
-          `import { authAdapter } from "${adapterPath}"`,
+          `import { authAdapter } from ${JSON.stringify(adapterPath)}`,
           `setAdapter(authAdapter)`
         ].join("\n");
       }
     },
     handleHotUpdate({ file, server }) {
-      if (file.includes("skafform.config") || file.includes("themes") || file.includes("bricks")) {
-        config = JSON.parse(readFileSync(resolve(root, "skafform.config.json"), "utf-8"));
+      const f = norm(file);
+      const r = norm(root);
+      if (f === `${r}/skafform.config.json` || f.startsWith(`${r}/themes/`) || f.startsWith(`${r}/bricks/`)) {
+        try {
+          config = JSON.parse(readFileSync(resolve(root, "skafform.config.json"), "utf-8"));
+        } catch {
+          return;
+        }
         brickIndex = loadBrickIndex(root);
+        themeJsonCache = null;
+        bricksConfigCache = null;
+        writeFileSync(resolve(root, "app/skafform-theme.css"), getCssString(), "utf-8");
         server.moduleGraph.invalidateAll();
         server.ws.send({ type: "full-reload" });
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skafform/vite-plugin",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "type": "module",
   "exports": {
     ".": {