kss-modern 1.2.1 → 1.3.0-beta.0

package/dist/node/lib/index.mjs

@@ -3,8 +3,8 @@ import process from 'node:process';
 import { fileURLToPath } from 'node:url';
 import fs from 'fs-extra';
 import { glob } from 'tinyglobby';
-import { l as logger, s as sanitizeSpecialCharacters, I as INSERT_VITE_PUG_TAG_RE, P as PUG_SRC_RE, a as PUG_ERROR_OVERLAY_TAG, c as compileMarkup, p as pugErrorFile, b as slugify, d as sectionSanitizeId, e as stripPugErrorOverlay, f as ensureStartingSlash, g as generateId, r as replaceWrapperContent, h as htmlToSearchText } from '../shared/kss-modern.rh78o-vW.mjs';
-export { i as createLogger } from '../shared/kss-modern.rh78o-vW.mjs';
+import { l as logger, s as sanitizeSpecialCharacters, I as INSERT_VITE_PUG_TAG_RE, P as PUG_SRC_RE, a as PUG_ERROR_OVERLAY_TAG, c as compileMarkup, p as pugErrorFile, b as slugify, d as sectionSanitizeId, e as stripPugErrorOverlay, f as ensureStartingSlash, g as generateId, r as replaceWrapperContent, h as htmlToSearchText } from '../shared/kss-modern.BQiL0d8K.mjs';
+export { i as createLogger } from '../shared/kss-modern.BQiL0d8K.mjs';
 import htmlLang from '@shikijs/langs/html';
 import markdownLang from '@shikijs/langs/markdown';
 import scssLang from '@shikijs/langs/scss';
@@ -1230,6 +1230,7 @@ async function logicalWriteFile(filepath, content) {
 }
 
 async function generateFullPageFile(data) {
+  const supportsDarkMode = !(data.deactivateDarkMode ?? false);
   const computedScriptTags = data.js.filter((entry) => entry.type !== "overwriteStyleguide").map((js) => {
     const additionalAttributes = js.additionalAttributes ? Object.entries(js.additionalAttributes).map(([key, value]) => `${key}="${value}"`).join(" ") : "";
     return `<script src="${js.src}" ${additionalAttributes}><\/script>`;
@@ -1239,7 +1240,7 @@ async function generateFullPageFile(data) {
   }).join("\n");
   const content = `
 <!DOCTYPE html>
-<html lang="${data.page.lang}"${data.page.htmlclass ? ` class="scroll-smooth ${data.page.htmlclass}"` : ""}>
+<html lang="${data.page.lang}"${data.page.htmlclass ? ` class="scroll-smooth ${data.page.htmlclass}"` : ""} data-styleguide-dark-mode="${supportsDarkMode}">
 <head>
     <title>${sanitizeSpecialCharacters(data.page.title)}</title>
     ${data.page.description ? `<meta name="description" content="${sanitizeSpecialCharacters(data.page.description)}">` : ""}
@@ -1252,7 +1253,7 @@ async function generateFullPageFile(data) {
           <meta name="theme-color" media="(prefers-color-scheme: light)" content="${data.theme.light}">
           <meta name="theme-color" media="(prefers-color-scheme: dark)" content="${data.theme.dark}">
       ` : `<meta name="theme-color" content="${data.theme}">`}
-    <script type="module" src="/styleguide-assets/fullpage-CGBSSxKh.js"><\/script>
+    <script type="module" src="/styleguide-assets/fullpage-DpAT8aw3.js"><\/script>
     ${computedStyleTags}
 </head>
 <body${data.page.bodyclass ? ` class="${data.page.bodyclass}"` : ""}>
@@ -2059,7 +2060,7 @@ async function generatePreviewFile(data) {
           <meta name="theme-color" media="(prefers-color-scheme: light)" content="${data.theme.light}">
           <meta name="theme-color" media="(prefers-color-scheme: dark)" content="${data.theme.dark}">
       ` : `<meta name="theme-color" content="${data.theme}">`}
-    <link rel="stylesheet" type="text/css" href="/styleguide-assets/kss-modern-3dYdkdaU.css">
+    <link rel="stylesheet" type="text/css" href="/styleguide-assets/kss-modern-Bw6-exnr.css">
     <script>
   //#region client/lib/iframe-resize.ts
 var e = [
@@ -2170,8 +2171,16 @@ var u = async (e) => {
 	normal: "theme-normal",
 	light: "theme-light",
 	dark: "theme-dark"
+}, f = {
+	normal: "light dark",
+	light: "only light",
+	dark: "only dark"
 };
-function f(e) {
+function p(e, t) {
+	let n = e.contentDocument?.documentElement;
+	n && (n.style.colorScheme = f[t]);
+}
+function m(e) {
 	let t = window.matchMedia("(prefers-color-scheme: dark)");
 	function n() {
 		return localStorage.getItem("in2theme") || (localStorage.setItem("in2theme", "normal"), "normal");
@@ -2183,7 +2192,7 @@ function f(e) {
 			Object.values(d).forEach((t) => e.classList.remove(t));
 		};
 		a(e), e.classList.add(i), a(document.body), document.body.classList.add(i), document.querySelectorAll("iframe").forEach((e) => {
-			a(e), e.classList.add(i);
+			a(e), e.classList.add(i), p(e, r);
 		}), Array.from(document.querySelectorAll("iframe")).filter((e) => e.src.includes("embed.figma.com")).forEach((e) => {
 			let t = new URL(e.src);
 			t.searchParams.set("theme", r === "normal" ? "system" : r), e.src = t.href;
@@ -2191,7 +2200,9 @@ function f(e) {
 			document.body.classList.add("allow-transitions");
 		}, 500);
 	}
-	r();
+	r(), document.querySelectorAll("iframe").forEach((e) => {
+		e.addEventListener("load", () => p(e, n()));
+	});
 	let i = e.querySelector(\`input[value="\${n()}"]\`);
 	i && (i.checked = !0), e.addEventListener("change", () => {
 		let t = e.querySelector("input[name=\\"theme\\"]:checked");
@@ -2205,14 +2216,14 @@ function f(e) {
 //#region client/preview-inline.ts
 document.addEventListener("DOMContentLoaded", () => {
 	let e = document.querySelector(".theme-select");
-	e && f(e);
+	e && m(e);
 	let t = Array.from(document.querySelectorAll(".preview-iframe"));
 	t.length > 0 ? u(t).catch(console.error) : l(), a();
 });
 //#endregion
 ;
 <\/script>
-    <script type="module" src="/styleguide-assets/preview-B-NERQ5n.js"><\/script>
+    <script type="module" src="/styleguide-assets/preview-BNQ_kTZ_.js"><\/script>
     <link rel="preload" href="/styleguide-assets/fonts/geist-mono-latin-400-normal.woff2" as="font" type="font/woff2" crossorigin="anonymous">
     <link rel="preload" href="/styleguide-assets/fonts/geist-mono-latin-600-normal.woff2" as="font" type="font/woff2" crossorigin="anonymous">
     <link rel="preload" href="/styleguide-assets/fonts/geist-mono-latin-300-normal.woff2" as="font" type="font/woff2" crossorigin="anonymous">
@@ -2441,6 +2452,7 @@ async function writeFullPageFile(config, baseDirectory, section) {
       js: config.html.assets.js,
       html: htmlMarkup,
       theme: config.theme,
+      deactivateDarkMode: config.deactivateDarkMode,
       ogImageUrl: config.plugins?.ogImage ? config.plugins.ogImage(section) : void 0
     });
   } catch (error) {

package/dist/node/lib/pug/worker.mjs

@@ -1,5 +1,5 @@
 import { parentPort } from 'node:worker_threads';
-import { c as compileMarkup, p as pugErrorFile } from '../../shared/kss-modern.rh78o-vW.mjs';
+import { c as compileMarkup, p as pugErrorFile } from '../../shared/kss-modern.BQiL0d8K.mjs';
 import 'node:fs';
 import 'node:fs/promises';
 import 'node:path';

package/dist/node/shared/{kss-modern.rh78o-vW.mjs → kss-modern.BQiL0d8K.mjs}

@@ -147,22 +147,25 @@ function getBiome() {
   })();
   return biomePromise;
 }
-async function biomeFormat(content) {
+async function biomeFormat(content, sectionId) {
+  const filePath = "example.html";
   try {
     const { biome, projectKey } = await getBiome();
-    const result = biome.formatContent(projectKey, content, {
-      filePath: "example.html"
-    });
-    const hasFatalErrors = result.diagnostics?.some(
+    const result = biome.formatContent(projectKey, content, { filePath });
+    const fatalDiagnostics = result.diagnostics?.filter(
       (diag) => diag.severity === "fatal" || diag.severity === "error"
     );
-    if (hasFatalErrors) {
-      logger.warn("Biome HTML formatting has errors, falling back to original content");
+    if (fatalDiagnostics?.length) {
+      const rendered = biome.printDiagnostics(fatalDiagnostics, { filePath, fileSource: content });
+      logger.warn(
+        `Biome HTML formatting failed for section ${sectionId}, using unformatted markup:
+${rendered}`
+      );
       return content;
     }
     return result.content;
   } catch (error) {
-    logger.warn("Biome HTML formatting not supported or failed:", error);
+    logger.warn(`Biome HTML formatting not supported or failed for section ${sectionId}:`, error);
     return content;
   }
 }
@@ -242,7 +245,7 @@ async function compileMarkup(contentDir, mode, html, sectionId) {
   result = expanded.html;
   dependencies.push(...expanded.dependencies);
   if (mode === "production") {
-    result = await biomeFormat(result);
+    result = await biomeFormat(result, sectionId);
   }
   result = fixAccessibilityIssues(result);
   return { html: result, dependencies: [...new Set(dependencies)] };

package/dist/styleguide-assets/.vite/manifest.json

@@ -1,10 +1,10 @@
 {
-  "_animate-DRGZltJ3.js": {
-    "file": "animate-DRGZltJ3.js",
+  "_animate-x_9xNIEv.js": {
+    "file": "animate-x_9xNIEv.js",
     "name": "animate"
   },
-  "_code-highlight-BygtMiLu.js": {
-    "file": "code-highlight-BygtMiLu.js",
+  "_code-highlight-Fm7cxf-E.js": {
+    "file": "code-highlight-Fm7cxf-E.js",
     "name": "code-highlight"
   },
   "_rolldown-runtime-B1bRi_D7.js": {
@@ -24,7 +24,7 @@
     "name": "utils"
   },
   "client/fullpage.ts": {
-    "file": "fullpage-CGBSSxKh.js",
+    "file": "fullpage-DpAT8aw3.js",
     "name": "fullpage",
     "src": "client/fullpage.ts",
     "isEntry": true,
@@ -38,12 +38,12 @@
     ]
   },
   "client/lib/clipboard.ts": {
-    "file": "clipboard-0X6xnPVo.js",
+    "file": "clipboard-BUvXbiCa.js",
     "name": "clipboard",
     "src": "client/lib/clipboard.ts",
     "isDynamicEntry": true,
     "imports": [
-      "_animate-DRGZltJ3.js",
+      "_animate-x_9xNIEv.js",
       "_signal-ZVBNTRLw.js",
       "_utils-DrMb1LbR.js"
     ]
@@ -55,40 +55,40 @@
     "isDynamicEntry": true
   },
   "client/lib/html-validator.ts": {
-    "file": "html-validator-CeH3wXbU.js",
+    "file": "html-validator-BGApR8VB.js",
     "name": "html-validator",
     "src": "client/lib/html-validator.ts",
     "isDynamicEntry": true,
     "imports": [
-      "_code-highlight-BygtMiLu.js",
+      "_code-highlight-Fm7cxf-E.js",
       "_utils-DrMb1LbR.js",
       "_shared-hGcWlnRM.js"
     ]
   },
   "client/lib/icons.ts": {
-    "file": "icons-Do1H6FzJ.js",
+    "file": "icons-C6KKEuT_.js",
     "name": "icons",
     "src": "client/lib/icons.ts",
     "isDynamicEntry": true,
     "imports": [
-      "_animate-DRGZltJ3.js",
+      "_animate-x_9xNIEv.js",
       "_utils-DrMb1LbR.js"
     ]
   },
   "client/preview-inline.ts": {
-    "file": "preview-inline-CW9Pw65W.js",
+    "file": "preview-inline-ByTkw_pt.js",
     "name": "preview-inline",
     "src": "client/preview-inline.ts",
     "isEntry": true
   },
   "client/preview.ts": {
-    "file": "preview-B-NERQ5n.js",
+    "file": "preview-BNQ_kTZ_.js",
     "name": "preview",
     "src": "client/preview.ts",
     "isEntry": true,
     "imports": [
-      "_animate-DRGZltJ3.js",
-      "_code-highlight-BygtMiLu.js",
+      "_animate-x_9xNIEv.js",
+      "_code-highlight-Fm7cxf-E.js",
       "_signal-ZVBNTRLw.js",
       "_utils-DrMb1LbR.js",
       "_shared-hGcWlnRM.js"
@@ -110,7 +110,7 @@
     ]
   },
   "node_modules/html-validate/dist/esm/browser.js": {
-    "file": "browser-BgMZpraI.js",
+    "file": "browser-nU7CpeVb.js",
     "name": "browser",
     "src": "node_modules/html-validate/dist/esm/browser.js",
     "isDynamicEntry": true,
@@ -119,7 +119,7 @@
     ]
   },
   "style.css": {
-    "file": "kss-modern-3dYdkdaU.css",
+    "file": "kss-modern-Bw6-exnr.css",
     "src": "style.css"
   }
 }