tailwind-styled-v4 1.0.1 → 4.0.0

package/dist/css.cjs

@@ -0,0 +1,71 @@
+'use strict';
+
+var fs = require('fs');
+var path = require('path');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var fs__default = /*#__PURE__*/_interopDefault(fs);
+var path__default = /*#__PURE__*/_interopDefault(path);
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+/* tailwind-styled-v4 v4 | MIT | https://github.com/dictionar32/tailwind-styled-v4 */
+
+async function TwCssInjector({
+  cssDir,
+  route,
+  includeGlobal = true,
+  minify = true,
+  asLink = false
+}) {
+  const resolvedDir = cssDir != null ? cssDir : path__default.default.join(process.cwd(), ".next", "static", "css", "tw");
+  const cssChunks = [];
+  if (includeGlobal) {
+    const globalCss = loadCssFile(path__default.default.join(resolvedDir, "_global.css"));
+    if (globalCss) cssChunks.push(globalCss);
+  }
+  const targetRoute = route != null ? route : "/";
+  const routeFile = routeToFilename(targetRoute);
+  const routeCss = loadCssFile(path__default.default.join(resolvedDir, routeFile));
+  if (routeCss) cssChunks.push(routeCss);
+  if (cssChunks.length === 0) return React__default.default.createElement(React__default.default.Fragment, null);
+  const combined = cssChunks.join("\n");
+  const final = minify ? minifyCss(combined) : combined;
+  if (asLink) {
+    return React__default.default.createElement("link", {
+      rel: "stylesheet",
+      href: `/_next/static/css/tw/${routeFile}`,
+      crossOrigin: "anonymous"
+    });
+  }
+  return React__default.default.createElement("style", {
+    dangerouslySetInnerHTML: { __html: final },
+    "data-tw-route": targetRoute
+  });
+}
+function useTwClasses(classes) {
+  return classes;
+}
+function loadCssFile(filepath) {
+  try {
+    if (fs__default.default.existsSync(filepath)) {
+      return fs__default.default.readFileSync(filepath, "utf-8");
+    }
+  } catch (e) {
+  }
+  return null;
+}
+function routeToFilename(route) {
+  if (route === "/") return "index.css";
+  if (route === "__global") return "_global.css";
+  return `${route.replace(/^\//, "").replace(/\//g, "_")}.css`;
+}
+function minifyCss(css) {
+  return css.replace(/\/\*[^*]*\*+([^/*][^*]*\*+)*\//g, "").replace(/\s+/g, " ").replace(/\s*{\s*/g, "{").replace(/\s*}\s*/g, "}").replace(/\s*;\s*/g, ";").trim();
+}
+
+exports.TwCssInjector = TwCssInjector;
+exports.useTwClasses = useTwClasses;
+//# sourceMappingURL=css.cjs.map
+//# sourceMappingURL=css.cjs.map

package/dist/css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../runtime-css/src/CssInjector.tsx"],"names":["path","React","fs"],"mappings":";;;;;;;;;;;;;;AAsCA,eAAsB,aAAA,CAAc;AAAA,EAClC,MAAA;AAAA,EACA,KAAA;AAAA,EACA,aAAA,GAAgB,IAAA;AAAA,EAChB,MAAA,GAAS,IAAA;AAAA,EACT,MAAA,GAAS;AACX,CAAA,EAAkD;AAChD,EAAA,MAAM,WAAA,GAAc,MAAA,IAAA,IAAA,GAAA,MAAA,GAAUA,qBAAA,CAAK,IAAA,CAAK,OAAA,CAAQ,KAAI,EAAG,OAAA,EAAS,QAAA,EAAU,KAAA,EAAO,IAAI,CAAA;AAErF,EAAA,MAAM,YAAsB,EAAC;AAG7B,EAAA,IAAI,aAAA,EAAe;AACjB,IAAA,MAAM,YAAY,WAAA,CAAYA,qBAAA,CAAK,IAAA,CAAK,WAAA,EAAa,aAAa,CAAC,CAAA;AACnE,IAAA,IAAI,SAAA,EAAW,SAAA,CAAU,IAAA,CAAK,SAAS,CAAA;AAAA,EACzC;AAGA,EAAA,MAAM,cAAc,KAAA,IAAA,IAAA,GAAA,KAAA,GAAS,GAAA;AAC7B,EAAA,MAAM,SAAA,GAAY,gBAAgB,WAAW,CAAA;AAC7C,EAAA,MAAM,WAAW,WAAA,CAAYA,qBAAA,CAAK,IAAA,CAAK,WAAA,EAAa,SAAS,CAAC,CAAA;AAC9D,EAAA,IAAI,QAAA,EAAU,SAAA,CAAU,IAAA,CAAK,QAAQ,CAAA;AAErC,EAAA,IAAI,SAAA,CAAU,WAAW,CAAA,EAAG,OAAOC,uBAAM,aAAA,CAAcA,sBAAA,CAAM,UAAU,IAAI,CAAA;AAE3E,EAAA,MAAM,QAAA,GAAW,SAAA,CAAU,IAAA,CAAK,IAAI,CAAA;AACpC,EAAA,MAAM,KAAA,GAAQ,MAAA,GAAS,SAAA,CAAU,QAAQ,CAAA,GAAI,QAAA;AAE7C,EAAA,IAAI,MAAA,EAAQ;AAEV,IAAA,OAAOA,sBAAA,CAAM,cAAc,MAAA,EAAQ;AAAA,MACjC,GAAA,EAAK,YAAA;AAAA,MACL,IAAA,EAAM,wBAAwB,SAAS,CAAA,CAAA;AAAA,MACvC,WAAA,EAAa;AAAA,KACd,CAAA;AAAA,EACH;AAGA,EAAA,OAAOA,sBAAA,CAAM,cAAc,OAAA,EAAS;AAAA,IAClC,uBAAA,EAAyB,EAAE,MAAA,EAAQ,KAAA,EAAM;AAAA,IACzC,eAAA,EAAiB;AAAA,GAClB,CAAA;AACH;AAYO,SAAS,aAAa,OAAA,EAAyB;AAGpD,EAAA,OAAO,OAAA;AACT;AAMA,SAAS,YAAY,QAAA,EAAiC;AACpD,EAAA,IAAI;AACF,IAAA,IAAIC,mBAAA,CAAG,UAAA,CAAW,QAAQ,CAAA,EAAG;AAC3B,MAAA,OAAOA,mBAAA,CAAG,YAAA,CAAa,QAAA,EAAU,OAAO,CAAA;AAAA,IAC1C;AAAA,EACF,CAAA,CAAA,OAAQ,CAAA,EAAA;AAAA,EAER;AACA,EAAA,OAAO,IAAA;AACT;AAEA,SAAS,gBAAgB,KAAA,EAAuB;AAC9C,EAAA,IAAI,KAAA,KAAU,KAAK,OAAO,WAAA;AAC1B,EAAA,IAAI,KAAA,KAAU,YAAY,OAAO,aAAA;AACjC,EAAA,OAAO,CAAA,EAAG,MAAM,OAAA,CAAQ,KAAA,EAAO,EAAE,CAAA,CAAE,OAAA,CAAQ,KAAA,EAAO,GAAG,CAAC,CAAA,IAAA,CAAA;AACxD;AAEA,SAAS,UAAU,GAAA,EAAqB;AACtC,EAAA,OAAO,GAAA,CACJ,QAAQ,iCAAA,EAAmC,EAAE,EAC7C,OAAA,CAAQ,MAAA,EAAQ,GAAG,CAAA,CACnB,OAAA,CAAQ,YAAY,GAAG,CAAA,CACvB,QAAQ,UAAA,EAAY,GAAG,EACvB,OAAA,CAAQ,UAAA,EAAY,GAAG,CAAA,CACvB,IAAA,EAAK;AACV","file":"css.cjs","sourcesContent":["/**\n * tailwind-styled-v4 — CSS Injector (React Server Component)\n *\n * Inject CSS yang sudah di-generate per-route langsung ke <head>.\n * Dipakai di Next.js App Router layout atau page.\n *\n * Di server component — inject inline CSS, zero client JS.\n * Streaming friendly — CSS di-emit bersamaan dengan HTML.\n *\n * Usage:\n *   // app/layout.tsx\n *   import { TwCssInjector } from \"tailwind-styled-v4/css\"\n *   export default function Layout({ children }) {\n *     return <html><head><TwCssInjector/></head><body>{children}</body></html>\n *   }\n */\n\nimport fs from \"node:fs\"\nimport path from \"node:path\"\nimport React from \"react\"\n\ninterface CssInjectorProps {\n  /** Override CSS directory. Default: .next/static/css/tw */\n  cssDir?: string\n  /** Specific route to inject. Default: auto-detect dari headers */\n  route?: string\n  /** Inject global CSS juga. Default: true */\n  includeGlobal?: boolean\n  /** Minify inline CSS. Default: true */\n  minify?: boolean\n  /** Add <link> tag instead of inline <style> untuk cached CSS */\n  asLink?: boolean\n}\n\n/**\n * Server Component — inject route-specific CSS into <head>.\n * No client JS, no hydration overhead.\n */\nexport async function TwCssInjector({\n  cssDir,\n  route,\n  includeGlobal = true,\n  minify = true,\n  asLink = false,\n}: CssInjectorProps): Promise<React.ReactElement> {\n  const resolvedDir = cssDir ?? path.join(process.cwd(), \".next\", \"static\", \"css\", \"tw\")\n\n  const cssChunks: string[] = []\n\n  // 1. Global CSS (base styles, reset)\n  if (includeGlobal) {\n    const globalCss = loadCssFile(path.join(resolvedDir, \"_global.css\"))\n    if (globalCss) cssChunks.push(globalCss)\n  }\n\n  // 2. Route-specific CSS\n  const targetRoute = route ?? \"/\"\n  const routeFile = routeToFilename(targetRoute)\n  const routeCss = loadCssFile(path.join(resolvedDir, routeFile))\n  if (routeCss) cssChunks.push(routeCss)\n\n  if (cssChunks.length === 0) return React.createElement(React.Fragment, null)\n\n  const combined = cssChunks.join(\"\\n\")\n  const final = minify ? minifyCss(combined) : combined\n\n  if (asLink) {\n    // Return <link> tag — CSS cached by browser\n    return React.createElement(\"link\", {\n      rel: \"stylesheet\",\n      href: `/_next/static/css/tw/${routeFile}`,\n      crossOrigin: \"anonymous\",\n    })\n  }\n\n  // Inline <style> — zero network request, fastest FCP\n  return React.createElement(\"style\", {\n    dangerouslySetInnerHTML: { __html: final },\n    \"data-tw-route\": targetRoute,\n  })\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Hook for client components\n// ─────────────────────────────────────────────────────────────────────────────\n\n/**\n * Lightweight hook to get current route's CSS classes.\n * Useful for dynamic class injection in client components.\n *\n * Returns empty string on server (SSR) — CSS already injected by TwCssInjector.\n */\nexport function useTwClasses(classes: string): string {\n  // In client environment, return classes as-is\n  // CSS is already handled by TwCssInjector at server level\n  return classes\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Helpers\n// ─────────────────────────────────────────────────────────────────────────────\n\nfunction loadCssFile(filepath: string): string | null {\n  try {\n    if (fs.existsSync(filepath)) {\n      return fs.readFileSync(filepath, \"utf-8\")\n    }\n  } catch {\n    // file not found or unreadable\n  }\n  return null\n}\n\nfunction routeToFilename(route: string): string {\n  if (route === \"/\") return \"index.css\"\n  if (route === \"__global\") return \"_global.css\"\n  return `${route.replace(/^\\//, \"\").replace(/\\//g, \"_\")}.css`\n}\n\nfunction minifyCss(css: string): string {\n  return css\n    .replace(/\\/\\*[^*]*\\*+([^/*][^*]*\\*+)*\\//g, \"\")\n    .replace(/\\s+/g, \" \")\n    .replace(/\\s*{\\s*/g, \"{\")\n    .replace(/\\s*}\\s*/g, \"}\")\n    .replace(/\\s*;\\s*/g, \";\")\n    .trim()\n}\n"]}

package/dist/css.d.cts

@@ -0,0 +1,45 @@
+import React from 'react';
+
+/**
+ * tailwind-styled-v4 — CSS Injector (React Server Component)
+ *
+ * Inject CSS yang sudah di-generate per-route langsung ke <head>.
+ * Dipakai di Next.js App Router layout atau page.
+ *
+ * Di server component — inject inline CSS, zero client JS.
+ * Streaming friendly — CSS di-emit bersamaan dengan HTML.
+ *
+ * Usage:
+ *   // app/layout.tsx
+ *   import { TwCssInjector } from "tailwind-styled-v4/css"
+ *   export default function Layout({ children }) {
+ *     return <html><head><TwCssInjector/></head><body>{children}</body></html>
+ *   }
+ */
+
+interface CssInjectorProps {
+    /** Override CSS directory. Default: .next/static/css/tw */
+    cssDir?: string;
+    /** Specific route to inject. Default: auto-detect dari headers */
+    route?: string;
+    /** Inject global CSS juga. Default: true */
+    includeGlobal?: boolean;
+    /** Minify inline CSS. Default: true */
+    minify?: boolean;
+    /** Add <link> tag instead of inline <style> untuk cached CSS */
+    asLink?: boolean;
+}
+/**
+ * Server Component — inject route-specific CSS into <head>.
+ * No client JS, no hydration overhead.
+ */
+declare function TwCssInjector({ cssDir, route, includeGlobal, minify, asLink, }: CssInjectorProps): Promise<React.ReactElement>;
+/**
+ * Lightweight hook to get current route's CSS classes.
+ * Useful for dynamic class injection in client components.
+ *
+ * Returns empty string on server (SSR) — CSS already injected by TwCssInjector.
+ */
+declare function useTwClasses(classes: string): string;
+
+export { TwCssInjector, useTwClasses };

package/dist/css.d.ts

@@ -0,0 +1,45 @@
+import React from 'react';
+
+/**
+ * tailwind-styled-v4 — CSS Injector (React Server Component)
+ *
+ * Inject CSS yang sudah di-generate per-route langsung ke <head>.
+ * Dipakai di Next.js App Router layout atau page.
+ *
+ * Di server component — inject inline CSS, zero client JS.
+ * Streaming friendly — CSS di-emit bersamaan dengan HTML.
+ *
+ * Usage:
+ *   // app/layout.tsx
+ *   import { TwCssInjector } from "tailwind-styled-v4/css"
+ *   export default function Layout({ children }) {
+ *     return <html><head><TwCssInjector/></head><body>{children}</body></html>
+ *   }
+ */
+
+interface CssInjectorProps {
+    /** Override CSS directory. Default: .next/static/css/tw */
+    cssDir?: string;
+    /** Specific route to inject. Default: auto-detect dari headers */
+    route?: string;
+    /** Inject global CSS juga. Default: true */
+    includeGlobal?: boolean;
+    /** Minify inline CSS. Default: true */
+    minify?: boolean;
+    /** Add <link> tag instead of inline <style> untuk cached CSS */
+    asLink?: boolean;
+}
+/**
+ * Server Component — inject route-specific CSS into <head>.
+ * No client JS, no hydration overhead.
+ */
+declare function TwCssInjector({ cssDir, route, includeGlobal, minify, asLink, }: CssInjectorProps): Promise<React.ReactElement>;
+/**
+ * Lightweight hook to get current route's CSS classes.
+ * Useful for dynamic class injection in client components.
+ *
+ * Returns empty string on server (SSR) — CSS already injected by TwCssInjector.
+ */
+declare function useTwClasses(classes: string): string;
+
+export { TwCssInjector, useTwClasses };

package/dist/css.js

@@ -0,0 +1,62 @@
+import fs from 'fs';
+import path from 'path';
+import React from 'react';
+
+/* tailwind-styled-v4 v4 | MIT | https://github.com/dictionar32/tailwind-styled-v4 */
+
+async function TwCssInjector({
+  cssDir,
+  route,
+  includeGlobal = true,
+  minify = true,
+  asLink = false
+}) {
+  const resolvedDir = cssDir != null ? cssDir : path.join(process.cwd(), ".next", "static", "css", "tw");
+  const cssChunks = [];
+  if (includeGlobal) {
+    const globalCss = loadCssFile(path.join(resolvedDir, "_global.css"));
+    if (globalCss) cssChunks.push(globalCss);
+  }
+  const targetRoute = route != null ? route : "/";
+  const routeFile = routeToFilename(targetRoute);
+  const routeCss = loadCssFile(path.join(resolvedDir, routeFile));
+  if (routeCss) cssChunks.push(routeCss);
+  if (cssChunks.length === 0) return React.createElement(React.Fragment, null);
+  const combined = cssChunks.join("\n");
+  const final = minify ? minifyCss(combined) : combined;
+  if (asLink) {
+    return React.createElement("link", {
+      rel: "stylesheet",
+      href: `/_next/static/css/tw/${routeFile}`,
+      crossOrigin: "anonymous"
+    });
+  }
+  return React.createElement("style", {
+    dangerouslySetInnerHTML: { __html: final },
+    "data-tw-route": targetRoute
+  });
+}
+function useTwClasses(classes) {
+  return classes;
+}
+function loadCssFile(filepath) {
+  try {
+    if (fs.existsSync(filepath)) {
+      return fs.readFileSync(filepath, "utf-8");
+    }
+  } catch (e) {
+  }
+  return null;
+}
+function routeToFilename(route) {
+  if (route === "/") return "index.css";
+  if (route === "__global") return "_global.css";
+  return `${route.replace(/^\//, "").replace(/\//g, "_")}.css`;
+}
+function minifyCss(css) {
+  return css.replace(/\/\*[^*]*\*+([^/*][^*]*\*+)*\//g, "").replace(/\s+/g, " ").replace(/\s*{\s*/g, "{").replace(/\s*}\s*/g, "}").replace(/\s*;\s*/g, ";").trim();
+}
+
+export { TwCssInjector, useTwClasses };
+//# sourceMappingURL=css.js.map
+//# sourceMappingURL=css.js.map

package/dist/css.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../runtime-css/src/CssInjector.tsx"],"names":[],"mappings":";;;;;;AAsCA,eAAsB,aAAA,CAAc;AAAA,EAClC,MAAA;AAAA,EACA,KAAA;AAAA,EACA,aAAA,GAAgB,IAAA;AAAA,EAChB,MAAA,GAAS,IAAA;AAAA,EACT,MAAA,GAAS;AACX,CAAA,EAAkD;AAChD,EAAA,MAAM,WAAA,GAAc,MAAA,IAAA,IAAA,GAAA,MAAA,GAAU,IAAA,CAAK,IAAA,CAAK,OAAA,CAAQ,KAAI,EAAG,OAAA,EAAS,QAAA,EAAU,KAAA,EAAO,IAAI,CAAA;AAErF,EAAA,MAAM,YAAsB,EAAC;AAG7B,EAAA,IAAI,aAAA,EAAe;AACjB,IAAA,MAAM,YAAY,WAAA,CAAY,IAAA,CAAK,IAAA,CAAK,WAAA,EAAa,aAAa,CAAC,CAAA;AACnE,IAAA,IAAI,SAAA,EAAW,SAAA,CAAU,IAAA,CAAK,SAAS,CAAA;AAAA,EACzC;AAGA,EAAA,MAAM,cAAc,KAAA,IAAA,IAAA,GAAA,KAAA,GAAS,GAAA;AAC7B,EAAA,MAAM,SAAA,GAAY,gBAAgB,WAAW,CAAA;AAC7C,EAAA,MAAM,WAAW,WAAA,CAAY,IAAA,CAAK,IAAA,CAAK,WAAA,EAAa,SAAS,CAAC,CAAA;AAC9D,EAAA,IAAI,QAAA,EAAU,SAAA,CAAU,IAAA,CAAK,QAAQ,CAAA;AAErC,EAAA,IAAI,SAAA,CAAU,WAAW,CAAA,EAAG,OAAO,MAAM,aAAA,CAAc,KAAA,CAAM,UAAU,IAAI,CAAA;AAE3E,EAAA,MAAM,QAAA,GAAW,SAAA,CAAU,IAAA,CAAK,IAAI,CAAA;AACpC,EAAA,MAAM,KAAA,GAAQ,MAAA,GAAS,SAAA,CAAU,QAAQ,CAAA,GAAI,QAAA;AAE7C,EAAA,IAAI,MAAA,EAAQ;AAEV,IAAA,OAAO,KAAA,CAAM,cAAc,MAAA,EAAQ;AAAA,MACjC,GAAA,EAAK,YAAA;AAAA,MACL,IAAA,EAAM,wBAAwB,SAAS,CAAA,CAAA;AAAA,MACvC,WAAA,EAAa;AAAA,KACd,CAAA;AAAA,EACH;AAGA,EAAA,OAAO,KAAA,CAAM,cAAc,OAAA,EAAS;AAAA,IAClC,uBAAA,EAAyB,EAAE,MAAA,EAAQ,KAAA,EAAM;AAAA,IACzC,eAAA,EAAiB;AAAA,GAClB,CAAA;AACH;AAYO,SAAS,aAAa,OAAA,EAAyB;AAGpD,EAAA,OAAO,OAAA;AACT;AAMA,SAAS,YAAY,QAAA,EAAiC;AACpD,EAAA,IAAI;AACF,IAAA,IAAI,EAAA,CAAG,UAAA,CAAW,QAAQ,CAAA,EAAG;AAC3B,MAAA,OAAO,EAAA,CAAG,YAAA,CAAa,QAAA,EAAU,OAAO,CAAA;AAAA,IAC1C;AAAA,EACF,CAAA,CAAA,OAAQ,CAAA,EAAA;AAAA,EAER;AACA,EAAA,OAAO,IAAA;AACT;AAEA,SAAS,gBAAgB,KAAA,EAAuB;AAC9C,EAAA,IAAI,KAAA,KAAU,KAAK,OAAO,WAAA;AAC1B,EAAA,IAAI,KAAA,KAAU,YAAY,OAAO,aAAA;AACjC,EAAA,OAAO,CAAA,EAAG,MAAM,OAAA,CAAQ,KAAA,EAAO,EAAE,CAAA,CAAE,OAAA,CAAQ,KAAA,EAAO,GAAG,CAAC,CAAA,IAAA,CAAA;AACxD;AAEA,SAAS,UAAU,GAAA,EAAqB;AACtC,EAAA,OAAO,GAAA,CACJ,QAAQ,iCAAA,EAAmC,EAAE,EAC7C,OAAA,CAAQ,MAAA,EAAQ,GAAG,CAAA,CACnB,OAAA,CAAQ,YAAY,GAAG,CAAA,CACvB,QAAQ,UAAA,EAAY,GAAG,EACvB,OAAA,CAAQ,UAAA,EAAY,GAAG,CAAA,CACvB,IAAA,EAAK;AACV","file":"css.js","sourcesContent":["/**\n * tailwind-styled-v4 — CSS Injector (React Server Component)\n *\n * Inject CSS yang sudah di-generate per-route langsung ke <head>.\n * Dipakai di Next.js App Router layout atau page.\n *\n * Di server component — inject inline CSS, zero client JS.\n * Streaming friendly — CSS di-emit bersamaan dengan HTML.\n *\n * Usage:\n *   // app/layout.tsx\n *   import { TwCssInjector } from \"tailwind-styled-v4/css\"\n *   export default function Layout({ children }) {\n *     return <html><head><TwCssInjector/></head><body>{children}</body></html>\n *   }\n */\n\nimport fs from \"node:fs\"\nimport path from \"node:path\"\nimport React from \"react\"\n\ninterface CssInjectorProps {\n  /** Override CSS directory. Default: .next/static/css/tw */\n  cssDir?: string\n  /** Specific route to inject. Default: auto-detect dari headers */\n  route?: string\n  /** Inject global CSS juga. Default: true */\n  includeGlobal?: boolean\n  /** Minify inline CSS. Default: true */\n  minify?: boolean\n  /** Add <link> tag instead of inline <style> untuk cached CSS */\n  asLink?: boolean\n}\n\n/**\n * Server Component — inject route-specific CSS into <head>.\n * No client JS, no hydration overhead.\n */\nexport async function TwCssInjector({\n  cssDir,\n  route,\n  includeGlobal = true,\n  minify = true,\n  asLink = false,\n}: CssInjectorProps): Promise<React.ReactElement> {\n  const resolvedDir = cssDir ?? path.join(process.cwd(), \".next\", \"static\", \"css\", \"tw\")\n\n  const cssChunks: string[] = []\n\n  // 1. Global CSS (base styles, reset)\n  if (includeGlobal) {\n    const globalCss = loadCssFile(path.join(resolvedDir, \"_global.css\"))\n    if (globalCss) cssChunks.push(globalCss)\n  }\n\n  // 2. Route-specific CSS\n  const targetRoute = route ?? \"/\"\n  const routeFile = routeToFilename(targetRoute)\n  const routeCss = loadCssFile(path.join(resolvedDir, routeFile))\n  if (routeCss) cssChunks.push(routeCss)\n\n  if (cssChunks.length === 0) return React.createElement(React.Fragment, null)\n\n  const combined = cssChunks.join(\"\\n\")\n  const final = minify ? minifyCss(combined) : combined\n\n  if (asLink) {\n    // Return <link> tag — CSS cached by browser\n    return React.createElement(\"link\", {\n      rel: \"stylesheet\",\n      href: `/_next/static/css/tw/${routeFile}`,\n      crossOrigin: \"anonymous\",\n    })\n  }\n\n  // Inline <style> — zero network request, fastest FCP\n  return React.createElement(\"style\", {\n    dangerouslySetInnerHTML: { __html: final },\n    \"data-tw-route\": targetRoute,\n  })\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Hook for client components\n// ─────────────────────────────────────────────────────────────────────────────\n\n/**\n * Lightweight hook to get current route's CSS classes.\n * Useful for dynamic class injection in client components.\n *\n * Returns empty string on server (SSR) — CSS already injected by TwCssInjector.\n */\nexport function useTwClasses(classes: string): string {\n  // In client environment, return classes as-is\n  // CSS is already handled by TwCssInjector at server level\n  return classes\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Helpers\n// ─────────────────────────────────────────────────────────────────────────────\n\nfunction loadCssFile(filepath: string): string | null {\n  try {\n    if (fs.existsSync(filepath)) {\n      return fs.readFileSync(filepath, \"utf-8\")\n    }\n  } catch {\n    // file not found or unreadable\n  }\n  return null\n}\n\nfunction routeToFilename(route: string): string {\n  if (route === \"/\") return \"index.css\"\n  if (route === \"__global\") return \"_global.css\"\n  return `${route.replace(/^\\//, \"\").replace(/\\//g, \"_\")}.css`\n}\n\nfunction minifyCss(css: string): string {\n  return css\n    .replace(/\\/\\*[^*]*\\*+([^/*][^*]*\\*+)*\\//g, \"\")\n    .replace(/\\s+/g, \" \")\n    .replace(/\\s*{\\s*/g, \"{\")\n    .replace(/\\s*}\\s*/g, \"}\")\n    .replace(/\\s*;\\s*/g, \";\")\n    .trim()\n}\n"]}