tailwind-styled-v4 5.0.11 → 5.0.12

package/dist/webpackLoader.mjs

@@ -27,7 +27,7 @@ function resolveNativeBinary(runtimeDir) {
   if (isBrowser) {
     return { path: null, source: "not-found", platform, tried: ["not available in browser"] };
   }
-  if (process.env.TWS_DISABLE_NATIVE === "1") {
+  if (process.env.TWS_NO_NATIVE === "1" || process.env.TWS_DISABLE_NATIVE === "1") {
     return { path: null, source: "not-found", platform, tried: [] };
   }
   const envPath = process.env.TW_NATIVE_PATH?.trim();
@@ -132,7 +132,7 @@ var _loadNative, log, NATIVE_UNAVAILABLE_MESSAGE, nativeBridge, bridgeLoadAttemp
 var init_nativeBridge = __esm({
   "packages/domain/compiler/src/nativeBridge.ts"() {
     init_src();
-    _loadNative = (path4) => __require(path4);
+    _loadNative = (path6) => __require(path6);
     log = (...args) => {
       if (process.env.DEBUG?.includes("compiler:native")) {
         console.log("[compiler:native]", ...args);
@@ -189,42 +189,146 @@ Tried paths: ${result.tried.join("\n")}`);
     }
   }
 });
-
-// packages/domain/compiler/src/index.ts
-init_nativeBridge();
-var transformSource = (source, opts) => {
+function _layoutClassesToCss(classes) {
   const native = getNativeBridge();
-  if (!native?.transformSource) {
-    throw new Error("FATAL: Native binding 'transformSource' is required but not available.");
+  if (!native?.layoutClassesToCss) {
+    throw new Error("FATAL: Native binding 'layoutClassesToCss' is required but not available.");
   }
-  const result = native.transformSource(source, opts);
-  if (!result) {
-    throw new Error("FATAL: transformSource returned null");
+  return native.layoutClassesToCss(classes);
+}
+function _hashContainer(tag, containerJson, name) {
+  const sortedKey = tag + (name ?? "") + containerJson;
+  const native = getNativeBridge();
+  if (!native?.hashContent) {
+    throw new Error("FATAL: Native binding 'hashContent' is required but not available.");
   }
-  return result;
-};
-var runLoaderTransform = (ctx) => {
-  const { filepath, source, options } = ctx;
-  const result = transformSource(source, { filename: filepath, ...options });
-  return {
-    code: result?.code || "",
-    changed: result?.changed || false,
-    classes: result?.classes || []
-  };
-};
-var shouldSkipFile = (filepath) => {
-  const SKIP_PATHS = ["node_modules", ".next", ".rspack-dist", ".turbo", "dist/", "out/"];
-  const skipExtensions = [".css", ".json", ".md", ".txt", ".yaml", ".yml"];
-  for (const p of SKIP_PATHS) {
-    if (filepath.includes(p)) return true;
+  return `tw-cq-${native.hashContent(sortedKey, "fnv", 6)}`;
+}
+function extractContainerCssFromSource(source) {
+  const native = getNativeBridge();
+  if (!native?.extractTwContainerConfigs) {
+    throw new Error("FATAL: Native binding 'extractTwContainerConfigs' is required but not available.");
   }
-  for (const ext of skipExtensions) {
-    if (filepath.endsWith(ext)) return true;
+  const configs = native.extractTwContainerConfigs(source);
+  const rules = [];
+  for (const cfg of configs) {
+    const id = _hashContainer(cfg.tag, cfg.containerJson, cfg.containerName);
+    for (const { key, classes } of cfg.breakpoints) {
+      const minWidth = _CONTAINER_BREAKPOINTS[key] ?? key;
+      const css = _layoutClassesToCss(classes);
+      if (!css) continue;
+      const query = cfg.containerName ? `@container ${cfg.containerName} (min-width: ${minWidth})` : `@container (min-width: ${minWidth})`;
+      rules.push(`${query}{.${id}{${css}}}`);
+    }
   }
-  return false;
-};
-var registerFileClasses = (_filepath, _classes) => {
-};
+  return rules.join("\n");
+}
+var transformSource, _CONTAINER_BREAKPOINTS, runLoaderTransform, shouldSkipFile, registerFileClasses, extractTwStateConfigs, generateStaticStateCss, extractAndGenerateStateCss;
+var init_src2 = __esm({
+  "packages/domain/compiler/src/index.ts"() {
+    init_nativeBridge();
+    transformSource = (source, opts) => {
+      const native = getNativeBridge();
+      if (!native?.transformSource) {
+        throw new Error("FATAL: Native binding 'transformSource' is required but not available.");
+      }
+      const result = native.transformSource(source, opts);
+      if (!result) {
+        throw new Error("FATAL: transformSource returned null");
+      }
+      return result;
+    };
+    _CONTAINER_BREAKPOINTS = {
+      xs: "240px",
+      sm: "320px",
+      md: "640px",
+      lg: "1024px",
+      xl: "1280px",
+      "2xl": "1536px"
+    };
+    runLoaderTransform = (ctx) => {
+      const { filepath, source, options } = ctx;
+      const result = transformSource(source, { filename: filepath, ...options });
+      let staticCss;
+      try {
+        const cssChunks = [];
+        const stateRules = extractAndGenerateStateCss(source, filepath);
+        if (stateRules.length > 0) {
+          cssChunks.push(stateRules.map((r) => r.cssRule).join("\n"));
+        }
+        const containerCss = extractContainerCssFromSource(source);
+        if (containerCss) cssChunks.push(containerCss);
+        const combined = cssChunks.join("\n").trim();
+        if (combined) staticCss = combined;
+      } catch {
+      }
+      return {
+        code: result?.code || "",
+        changed: result?.changed || false,
+        classes: result?.classes || [],
+        staticCss
+      };
+    };
+    shouldSkipFile = (filepath) => {
+      const SKIP_PATHS = ["node_modules", ".next", ".rspack-dist", ".turbo", "dist/", "out/"];
+      const skipExtensions = [".css", ".json", ".md", ".txt", ".yaml", ".yml"];
+      for (const p of SKIP_PATHS) {
+        if (filepath.includes(p)) return true;
+      }
+      for (const ext of skipExtensions) {
+        if (filepath.endsWith(ext)) return true;
+      }
+      return false;
+    };
+    registerFileClasses = (_filepath, _classes) => {
+    };
+    extractTwStateConfigs = (source, filename) => {
+      const native = getNativeBridge();
+      if (!native?.extractTwStateConfigs) {
+        throw new Error("FATAL: Native binding 'extractTwStateConfigs' is required but not available.");
+      }
+      return native.extractTwStateConfigs(source, filename);
+    };
+    generateStaticStateCss = (inputs, resolvedCss = null) => {
+      const native = getNativeBridge();
+      if (!native?.generateStaticStateCss) {
+        throw new Error("FATAL: Native binding 'generateStaticStateCss' is required but not available.");
+      }
+      return native.generateStaticStateCss(inputs, resolvedCss);
+    };
+    extractAndGenerateStateCss = (source, filename) => {
+      const native = getNativeBridge();
+      if (!native?.extractAndGenerateStateCss) {
+        const configs = extractTwStateConfigs(source, filename);
+        if (configs.length === 0) return [];
+        return generateStaticStateCss(
+          configs.map((c) => ({ tag: c.tag, componentName: c.componentName, statesJson: c.statesJson }))
+        );
+      }
+      return native.extractAndGenerateStateCss(source, filename);
+    };
+  }
+});
+
+// packages/domain/compiler/src/internal.ts
+var init_internal = __esm({
+  "packages/domain/compiler/src/internal.ts"() {
+    init_src2();
+  }
+});
+
+// packages/presentation/next/src/webpackLoader.ts
+init_internal();
+var _fileStaticCssMap = /* @__PURE__ */ new Map();
+function setFileStaticCss(filepath, css) {
+  if (css && css.trim()) {
+    _fileStaticCssMap.set(filepath, css.trim());
+  } else {
+    _fileStaticCssMap.delete(filepath);
+  }
+}
+
+// packages/presentation/next/src/webpackLoader.ts
 var WebpackLoaderOptionsSchema = z.object({
   mode: z.literal("zero-runtime").optional(),
   autoClientBoundary: z.boolean().optional(),
@@ -233,7 +337,8 @@ var WebpackLoaderOptionsSchema = z.object({
   routeCss: z.boolean().optional(),
   incremental: z.boolean().optional(),
   verbose: z.boolean().optional(),
-  preserveImports: z.boolean().optional()
+  preserveImports: z.boolean().optional(),
+  safelistPath: z.string().optional()
 });
 var isNextBuildArtifact = (filepath) => filepath.includes(`${path__default.sep}.next${path__default.sep}`);
 function webpackLoader(source) {
@@ -267,6 +372,7 @@ function webpackLoader(source) {
     if (typeof output.code !== "string") {
       throw new TypeError(`[tailwind-styled] Invalid transform output for ${filepath}: code is not a string`);
     }
+    setFileStaticCss(filepath, output.staticCss);
     if (!output.changed) {
       callback(null, source);
       return;