@colorye/react-native-css 0.3.0 → 0.3.2

package/src/transformer-runtime.js

@@ -7,6 +7,7 @@ try {
 
 const Appearance = RN.Appearance || { getColorScheme: () => "light" };
 const Dimensions = RN.Dimensions || { get: () => ({ width: 375, height: 812 }) };
+const Platform = RN.Platform || { OS: "ios" };
 
 // ============================================================================
 // Constants
@@ -57,7 +58,8 @@ function getColorScheme() {
 function getCacheKey() {
   const { width, height } = getDimensions();
   const colorScheme = getColorScheme();
-  return `${width}x${height}:${colorScheme}`;
+  const os = Platform?.OS || "ios";
+  return `${width}x${height}:${colorScheme}:${os}`;
 }
 
 function invalidateCache() {
@@ -120,6 +122,110 @@ function getFlattenStyle(declarations) {
   return Object.keys(result).length > 0 ? result : undefined;
 }
 
+function resolveCssVars(val, rootVars, localVars) {
+  if (typeof val !== "string" || !val.includes("var(")) return val;
+  let res = val;
+  let iterations = 0;
+  while (res.includes("var(") && iterations < 5) {
+    iterations++;
+    res = res.replace(/var\(\s*(--[a-zA-Z0-9_-]+)(?:\s*,\s*([^)]+))?\s*\)/g, (_, name, fb) => {
+      if (localVars && localVars[name] !== undefined) return localVars[name];
+      return rootVars[name] !== undefined ? rootVars[name] : (fb || "");
+    });
+  }
+  return res;
+}
+
+function resolveCssValue(prop, val, rootVars, localVars) {
+  if (typeof val !== "string") return val;
+  let v = resolveCssVars(val, rootVars, localVars).trim();
+
+  if (prop === "boxShadow") {
+    const parts = v
+      .split(/,(?![^(]*\))/)
+      .map((p) => p.trim())
+      .filter((p) => p && !p.includes("0 0 #0000") && !p.includes("0 0 #000") && !p.includes("0 0 0 0"));
+    if (parts.length === 0) return undefined;
+    v = parts.join(", ");
+  }
+
+  if (v.startsWith("calc(") && v.endsWith(")")) {
+    let inner = v.slice(5, -1).trim();
+    inner = inner.replace(/([\d.]+)rem/g, (_, n) => parseFloat(n) * 16 + "px");
+    inner = inner.replace(/px/g, "");
+    try {
+      v = Function('"use strict"; return (' + inner + ')')();
+    } catch {}
+  }
+
+  if (typeof v === "string" && v.endsWith("rem")) {
+    v = parseFloat(v) * 16;
+  } else if (typeof v === "string" && v.endsWith("px")) {
+    v = parseFloat(v);
+  } else if (typeof v === "string" && (v.endsWith("vh") || v.endsWith("vw"))) {
+    v = parseFloat(v) + "%";
+  }
+
+  if (prop.toLowerCase().endsWith("radius") && (v === "50%" || v === "9999px" || v === 9999)) {
+    return 9999;
+  }
+  if (prop === "fontWeight") {
+    return String(v).replace("px", "").replace("rem", "");
+  }
+  if (
+    typeof v === "string" &&
+    !isNaN(Number(v)) &&
+    !["color", "fontFamily", "fontWeight"].includes(prop) &&
+    !prop.endsWith("Color")
+  ) {
+    v = Number(v);
+  }
+  return v;
+}
+
+function applyResolvedEntry(resolved, entry, rootVars) {
+  if (!entry) return;
+
+  const localVars = {};
+  if (entry._static) {
+    for (const [k, v] of Object.entries(entry._static)) {
+      if (k.startsWith("--") && typeof v === "string") {
+        localVars[k] = v;
+      }
+    }
+  }
+
+  if (entry._static) {
+    for (const [k, v] of Object.entries(entry._static)) {
+      if (k.startsWith("--")) continue;
+      const val = resolveCssValue(k, v, rootVars, localVars);
+      if (val !== undefined && val !== null) {
+        resolved[k] = val;
+      }
+    }
+  }
+
+  if (entry._dynamic) {
+    for (const [k, v] of Object.entries(entry._dynamic)) {
+      if (k.startsWith("--")) continue;
+      const val = resolveCssValue(k, v, rootVars, localVars);
+      if (val !== undefined && val !== null) {
+        resolved[k] = val;
+      }
+    }
+  }
+
+  if (!entry._static && !entry._dynamic) {
+    for (const [k, v] of Object.entries(entry)) {
+      if (k.startsWith("--")) continue;
+      const val = resolveCssValue(k, v, rootVars, localVars);
+      if (val !== undefined && val !== null) {
+        resolved[k] = val;
+      }
+    }
+  }
+}
+
 // ============================================================================
 // Main Native Rust Stylesheet Transform
 // ============================================================================
@@ -129,6 +235,7 @@ function transformStyles(stylesheet, classNames) {
     stylesheet = stylesheet.default;
   }
 
+  const rootVars = stylesheet[":root"] || {};
   const { width, height } = getDimensions();
   const colorScheme = getColorScheme();
 
@@ -145,18 +252,54 @@ function transformStyles(stylesheet, classNames) {
   const classes = classNames.trim().split(/\s+/);
   const resolved = {};
 
-  for (const cls of classes) {
+  const os = Platform?.OS || "ios";
+
+  for (let cls of classes) {
     if (!cls) continue;
+
+    // Platform variants: ios:, android:, web:
+    if (cls.startsWith("ios:")) {
+      if (os !== "ios") continue;
+      cls = cls.slice(4);
+    } else if (cls.startsWith("android:")) {
+      if (os !== "android") continue;
+      cls = cls.slice(8);
+    } else if (cls.startsWith("web:")) {
+      if (os !== "web") continue;
+      cls = cls.slice(4);
+    }
+
+    // Media query variants: sm:, md:, lg:, xl:, 2xl:
+    if (cls.startsWith("sm:")) {
+      if (width < 640) continue;
+      cls = cls.slice(3);
+    } else if (cls.startsWith("md:")) {
+      if (width < 768) continue;
+      cls = cls.slice(3);
+    } else if (cls.startsWith("lg:")) {
+      if (width < 1024) continue;
+      cls = cls.slice(3);
+    } else if (cls.startsWith("xl:")) {
+      if (width < 1280) continue;
+      cls = cls.slice(3);
+    } else if (cls.startsWith("2xl:")) {
+      if (width < 1536) continue;
+      cls = cls.slice(4);
+    }
+
+    // Dark / Light variants
+    if (cls.startsWith("dark:")) {
+      if (colorScheme !== "dark") continue;
+      cls = cls.slice(5);
+    } else if (cls.startsWith("light:")) {
+      if (colorScheme !== "light") continue;
+      cls = cls.slice(6);
+    }
+
     const entry = stylesheet[cls];
     if (!entry) continue;
 
-    if (entry._static) {
-      Object.assign(resolved, entry._static);
-    } else if (entry._dynamic) {
-      Object.assign(resolved, entry._dynamic);
-    } else if (typeof entry === "object") {
-      Object.assign(resolved, entry);
-    }
+    applyResolvedEntry(resolved, entry, rootVars);
   }
 
   const result = Object.keys(resolved).length > 0 ? resolved : undefined;
@@ -170,10 +313,13 @@ function transformStyles(stylesheet, classNames) {
 function getInheritStyle(declarations) {
   if (!declarations) return undefined;
 
+  const flat = Array.isArray(declarations) ? getFlattenStyle(declarations) : declarations;
+  if (!flat || typeof flat !== "object") return undefined;
+
   const inheritDeclarations = {};
   for (const key of INHERIT_PROPERTIES) {
-    if (declarations[key] !== undefined) {
-      inheritDeclarations[key] = declarations[key];
+    if (flat[key] !== undefined) {
+      inheritDeclarations[key] = flat[key];
     }
   }
 
@@ -221,13 +367,21 @@ function mergeStyles(inheritStyle, staticStyles, inlineStyle) {
   const result = {};
   if (inherited) Object.assign(result, inherited);
   if (staticStyles) {
-    for (const key in staticStyles) {
-      if (!key.startsWith("--")) {
-        result[key] = staticStyles[key];
+    const flatStatic = Array.isArray(staticStyles) ? getFlattenStyle(staticStyles) : staticStyles;
+    if (flatStatic && typeof flatStatic === "object") {
+      for (const key in flatStatic) {
+        if (!key.startsWith("--")) {
+          result[key] = flatStatic[key];
+        }
       }
     }
   }
-  if (inlineStyle) Object.assign(result, inlineStyle);
+  if (inlineStyle) {
+    const flatInline = Array.isArray(inlineStyle) ? getFlattenStyle(inlineStyle) : inlineStyle;
+    if (flatInline && typeof flatInline === "object") {
+      Object.assign(result, flatInline);
+    }
+  }
 
   return Object.keys(result).length > 0 ? result : undefined;
 }

package/src/transformer.js

@@ -1,14 +1,46 @@
 import fs from "fs";
 import path from "path";
-import Stylesheet from "./features/stylesheet";
-import { parseStylesheetWithLightning } from "./utils/css";
+
+let native = null;
+try {
+  native = require("./native");
+} catch {
+  try {
+    native = require("../crates/transformer");
+  } catch {}
+}
+
+let cachedStylesheet = null;
+
+function getCachedStylesheetJson(projectRoot) {
+  if (cachedStylesheet) return cachedStylesheet;
+  try {
+    const root = projectRoot || process.cwd();
+    const candidates = [
+      path.resolve(root, "index.css.json"),
+      path.resolve(root, "src/assets/styles/index.css.json"),
+      path.join(__dirname, "exported-stylesheet.json"),
+      path.resolve(__dirname, "../src/exported-stylesheet.json"),
+    ];
+    for (const p of candidates) {
+      if (fs.existsSync(p)) {
+        cachedStylesheet = fs.readFileSync(p, "utf-8");
+        return cachedStylesheet;
+      }
+    }
+  } catch {}
+  return "{}";
+}
 
 export function getStylesheet(css, filename) {
-  const rawStylesheet = parseStylesheetWithLightning(css);
-  const stylesheet = new Stylesheet();
-  stylesheet.setRawStylesheet(rawStylesheet);
+  if (!native || !native.compileCss) {
+    throw new Error(
+      "[@colorye/react-native-css] Native Rust transformer binding is not loaded. Cannot compile CSS.",
+    );
+  }
 
-  const jsonContent = stylesheet.toJSON();
+  const jsonContent = native.compileCss(css);
+  cachedStylesheet = jsonContent;
   writeStylesheetJSON(jsonContent, filename);
 
   return jsonContent;
@@ -58,9 +90,7 @@ export function transform({ src, filename, options }) {
                 const resolved = require.resolve("metro-react-native-babel-transformer", resolveOptions);
                 return eval("require")(resolved);
               } catch {
-                throw new Error(
-                  "Failed to load any upstream babel-transformer. Please ensure either '@expo/metro-config', '@react-native/metro-babel-transformer', or 'metro-react-native-babel-transformer' is installed.",
-                );
+                return null;
               }
             }
           }
@@ -71,13 +101,43 @@ export function transform({ src, filename, options }) {
 
   if (filename.endsWith(".css")) {
     const jsonContent = getStylesheet(src, filename);
-    return resolveTransformer.transform({
-      src: `const sheet = ${jsonContent};\nmodule.exports = sheet;\nmodule.exports.default = sheet;\nmodule.exports.__esModule = true;`,
-      filename,
-      options,
-    });
+    const cssCode = `const sheet = ${jsonContent};\nmodule.exports = sheet;\nmodule.exports.default = sheet;\nmodule.exports.__esModule = true;`;
+    if (resolveTransformer && resolveTransformer.transform) {
+      return resolveTransformer.transform({
+        src: cssCode,
+        filename,
+        options,
+      });
+    }
+    return { code: cssCode, map: null };
+  }
+
+  // Fast native Rust SWC transformer for JSX/TSX
+  if (
+    native &&
+    native.transformJsx &&
+    (filename.endsWith(".tsx") || filename.endsWith(".jsx")) &&
+    !filename.includes("node_modules")
+  ) {
+    try {
+      const stylesheetJson = options?.stylesheetJson || getCachedStylesheetJson(projectRoot);
+      const res = native.transformJsx(src, {
+        filename,
+        stylesheetJson,
+        sourceMaps: true,
+      });
+      if (res && res.code) {
+        src = res.code;
+      }
+    } catch {
+      // Graceful fallback to Babel if native transform hits unexpected syntax
+    }
+  }
+
+  if (resolveTransformer && resolveTransformer.transform) {
+    return resolveTransformer.transform({ src, filename, options });
   }
-  return resolveTransformer.transform({ src, filename, options });
+  return { code: src, map: null };
 }
 
 export default {

package/dist/exported-stylesheet.json

@@ -1 +0,0 @@
-{":root":{"--font-sans":"-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\",\n      \"Noto Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\",\n      \"Segoe UI Symbol\", \"Noto Color Emoji\"","--font-mono":"ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n      \"Courier New\", monospace","--spacing":".25rem","--font-weight-semibold":"600","--font-weight-bold":"700","--tracking-wider":".05em","--default-transition-duration":".15s","--default-transition-timing-function":"cubic-bezier(.4, 0, .2, 1)","--default-font-family":"var(--font-sans)","--default-mono-font-family":"var(--font-mono)","--color-yellow-500":"lab(77.1036% 13.6926 83.561)","--color-green-200":"lab(95.239% -10.8266 9.24107)","--color-green-500":"lab(57.4893% -40.5347 37.516)","--color-orange-500":"lab(66.2947% 49.6344 117.647)","--color-red-500":"lab(45.0394% 75.4726 71.4577)","--color-blue-200":"lab(88.4823% -12.6735 -16.6484)","--color-blue-500":"lab(43.2001% 15.8505 -66.7688)","--color-magenta-500":"lab(34.1384% 59.3948 -45.5364)","--color-black":"lab(0% 0 0)","--color-white":"lab(100% 0 0)","--color-navy-100":"lab(95.2175% -1.96895 -3.05733)","--color-navy-200":"lab(88.3954% -1.94326 -3.07581)","--color-navy-300":"lab(76.7078% -5.64724 -9.13405)","--color-navy-400":"lab(58.179% -8.91814 -15.0204)","--color-navy-500":"lab(39.6076% -11.2321 -20.6616)","--color-navy-600":"lab(20.9196% -10.7469 -25.9701)","--color-navy-700":"lab(3.17211% 1.80869 -28.6588)","--color-primary":"var(--color-blue-500)","--color-success":"var(--color-green-500)","--text-2xs":"10px","--text-2xs--line-height":"12px","--text-xs":"12px","--text-xs--line-height":"16px","--text-sm":"14px","--text-sm--line-height":"20px","--text-md":"18px","--text-md--line-height":"24px","--text-2xl":"32px","--text-2xl--line-height":"36px","--radius-lg":"16px","--radius-xl":"20px","--radius-full":"50%"},"static":{"position":"static"},"container":{"_static":{"width":"100%"},"_dynamic":{"@media (min-width: 580px)":{"_static":{"maxWidth":580},"_dynamic":{}},"@media (min-width: 768px)":{"_static":{"maxWidth":768},"_dynamic":{}},"@media (min-width: 980px)":{"_static":{"maxWidth":980},"_dynamic":{}},"@media (min-width: 1200px)":{"_static":{"maxWidth":1200},"_dynamic":{}}}},"mt-0.5":{"_static":{},"_dynamic":{"marginTop":"calc(var(--spacing) * .5)"}},"mt-1":{"_static":{},"_dynamic":{"marginTop":"var(--spacing)"}},"mt-4":{"_static":{},"_dynamic":{"marginTop":"calc(var(--spacing) * 4)"}},"mb-1":{"_static":{},"_dynamic":{"marginBottom":"var(--spacing)"}},"mb-2":{"_static":{},"_dynamic":{"marginBottom":"calc(var(--spacing) * 2)"}},"mb-3":{"_static":{},"_dynamic":{"marginBottom":"calc(var(--spacing) * 3)"}},"mb-4":{"_static":{},"_dynamic":{"marginBottom":"calc(var(--spacing) * 4)"}},"mb-5":{"_static":{},"_dynamic":{"marginBottom":"calc(var(--spacing) * 5)"}},"h-20":{"_static":{},"_dynamic":{"height":"calc(var(--spacing) * 20)"}},"w-20":{"_static":{},"_dynamic":{"width":"calc(var(--spacing) * 20)"}},"w-[48%]":{"width":"48%"},"flex-1":{"flex":1},"transform":{"_static":{},"_dynamic":{"transform":"var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, )"}},"flex-row":{"flexDirection":"row"},"flex-wrap":{"flexWrap":"wrap"},"items-center":{"alignItems":"center"},"justify-between":{"justifyContent":"space-between"},"justify-center":{"justifyContent":"center"},"gap-1":{"_static":{},"_dynamic":{"gap":"var(--spacing)"}},"gap-2":{"_static":{},"_dynamic":{"gap":"calc(var(--spacing) * 2)"}},"gap-y-2.5":{"_static":{},"_dynamic":{"rowGap":"calc(var(--spacing) * 2.5)"}},"rounded-full":{"_static":{},"_dynamic":{"borderRadius":"var(--radius-full)"}},"rounded-lg":{"_static":{},"_dynamic":{"borderRadius":"var(--radius-lg)"}},"rounded-xl":{"_static":{},"_dynamic":{"borderRadius":"var(--radius-xl)"}},"border":{"_static":{"borderWidth":1},"_dynamic":{"borderStyle":"var(--tw-border-style)"}},"border-s-4":{"_static":{"borderInlineStartWidth":4},"_dynamic":{"borderInlineStartStyle":"var(--tw-border-style)"}},"border-blue-500":{"_static":{},"_dynamic":{"borderColor":"var(--color-blue-500)"}},"border-blue-500/30":{"_static":{},"_dynamic":{"borderColor":"color-mix(in oklab, var(--color-blue-500) 30%, transparent)"}},"border-green-500":{"_static":{},"_dynamic":{"borderColor":"var(--color-green-500)"}},"border-green-500/30":{"_static":{},"_dynamic":{"borderColor":"color-mix(in oklab, var(--color-green-500) 30%, transparent)"}},"border-navy-300":{"_static":{},"_dynamic":{"borderColor":"var(--color-navy-300)"}},"border-navy-500":{"_static":{},"_dynamic":{"borderColor":"var(--color-navy-500)"}},"border-orange-500":{"_static":{},"_dynamic":{"borderColor":"var(--color-orange-500)"}},"border-primary":{"_static":{},"_dynamic":{"borderColor":"var(--color-primary)"}},"bg-blue-500":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-blue-500)"}},"bg-blue-500/10":{"_static":{},"_dynamic":{"backgroundColor":"color-mix(in oklab, var(--color-blue-500) 10%, transparent)"}},"bg-blue-500/20":{"_static":{},"_dynamic":{"backgroundColor":"color-mix(in oklab, var(--color-blue-500) 20%, transparent)"}},"bg-green-500":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-green-500)"}},"bg-green-500/10":{"_static":{},"_dynamic":{"backgroundColor":"color-mix(in oklab, var(--color-green-500) 10%, transparent)"}},"bg-green-500/20":{"_static":{},"_dynamic":{"backgroundColor":"color-mix(in oklab, var(--color-green-500) 20%, transparent)"}},"bg-magenta-500":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-magenta-500)"}},"bg-navy-100":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-navy-100)"}},"bg-navy-600":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-navy-600)"}},"bg-navy-700":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-navy-700)"}},"bg-orange-500":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-orange-500)"}},"bg-orange-500/10":{"_static":{},"_dynamic":{"backgroundColor":"color-mix(in oklab, var(--color-orange-500) 10%, transparent)"}},"bg-primary":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-primary)"}},"bg-primary/20":{"_static":{},"_dynamic":{"backgroundColor":"color-mix(in oklab, var(--color-primary) 20%, transparent)"}},"bg-primary/40":{"_static":{},"_dynamic":{"backgroundColor":"color-mix(in oklab, var(--color-primary) 40%, transparent)"}},"bg-primary/60":{"_static":{},"_dynamic":{"backgroundColor":"color-mix(in oklab, var(--color-primary) 60%, transparent)"}},"bg-primary/80":{"_static":{},"_dynamic":{"backgroundColor":"color-mix(in oklab, var(--color-primary) 80%, transparent)"}},"bg-red-500":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-red-500)"}},"bg-success":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-success)"}},"bg-transparent":{"backgroundColor":"#0000"},"bg-yellow-500":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-yellow-500)"}},"bg-gradient-to-tr":{"_static":{"--tw-gradient-position":"to top right in oklab"},"_dynamic":{"backgroundImage":"linear-gradient(var(--tw-gradient-stops))"}},"p-1":{"_static":{},"_dynamic":{"paddingTop":"var(--spacing)","paddingRight":"var(--spacing)","paddingBottom":"var(--spacing)","paddingLeft":"var(--spacing)"}},"p-3":{"_static":{},"_dynamic":{"paddingTop":"calc(var(--spacing) * 3)","paddingRight":"calc(var(--spacing) * 3)","paddingBottom":"calc(var(--spacing) * 3)","paddingLeft":"calc(var(--spacing) * 3)"}},"p-3.5":{"_static":{},"_dynamic":{"paddingTop":"calc(var(--spacing) * 3.5)","paddingRight":"calc(var(--spacing) * 3.5)","paddingBottom":"calc(var(--spacing) * 3.5)","paddingLeft":"calc(var(--spacing) * 3.5)"}},"p-4":{"_static":{},"_dynamic":{"paddingTop":"calc(var(--spacing) * 4)","paddingRight":"calc(var(--spacing) * 4)","paddingBottom":"calc(var(--spacing) * 4)","paddingLeft":"calc(var(--spacing) * 4)"}},"p-5":{"_static":{},"_dynamic":{"paddingTop":"calc(var(--spacing) * 5)","paddingRight":"calc(var(--spacing) * 5)","paddingBottom":"calc(var(--spacing) * 5)","paddingLeft":"calc(var(--spacing) * 5)"}},"p-6":{"_static":{},"_dynamic":{"paddingTop":"calc(var(--spacing) * 6)","paddingRight":"calc(var(--spacing) * 6)","paddingBottom":"calc(var(--spacing) * 6)","paddingLeft":"calc(var(--spacing) * 6)"}},"px-3":{"_static":{},"_dynamic":{"paddingHorizontal":"calc(var(--spacing) * 3)"}},"px-3.5":{"_static":{},"_dynamic":{"paddingHorizontal":"calc(var(--spacing) * 3.5)"}},"px-4":{"_static":{},"_dynamic":{"paddingHorizontal":"calc(var(--spacing) * 4)"}},"px-5":{"_static":{},"_dynamic":{"paddingHorizontal":"calc(var(--spacing) * 5)"}},"py-1":{"_static":{},"_dynamic":{"paddingVertical":"var(--spacing)"}},"py-2":{"_static":{},"_dynamic":{"paddingVertical":"calc(var(--spacing) * 2)"}},"py-2.5":{"_static":{},"_dynamic":{"paddingVertical":"calc(var(--spacing) * 2.5)"}},"py-3.5":{"_static":{},"_dynamic":{"paddingVertical":"calc(var(--spacing) * 3.5)"}},"py-4":{"_static":{},"_dynamic":{"paddingVertical":"calc(var(--spacing) * 4)"}},"pr-3":{"_static":{},"_dynamic":{"paddingRight":"calc(var(--spacing) * 3)"}},"pb-20":{"_static":{},"_dynamic":{"paddingBottom":"calc(var(--spacing) * 20)"}},"text-2xl":{"_static":{},"_dynamic":{"fontSize":"var(--text-2xl)","lineHeight":"var(--tw-leading, var(--text-2xl--line-height))"}},"text-2xs":{"_static":{},"_dynamic":{"fontSize":"var(--text-2xs)","lineHeight":"var(--tw-leading, var(--text-2xs--line-height))"}},"text-md":{"_static":{},"_dynamic":{"fontSize":"var(--text-md)","lineHeight":"var(--tw-leading, var(--text-md--line-height))"}},"text-sm":{"_static":{},"_dynamic":{"fontSize":"var(--text-sm)","lineHeight":"var(--tw-leading, var(--text-sm--line-height))"}},"text-xs":{"_static":{},"_dynamic":{"fontSize":"var(--text-xs)","lineHeight":"var(--tw-leading, var(--text-xs--line-height))"}},"font-bold":{"_static":{"--tw-font-weight":"var(--font-weight-bold)"},"_dynamic":{"fontWeight":"var(--font-weight-bold)"}},"font-semibold":{"_static":{"--tw-font-weight":"var(--font-weight-semibold)"},"_dynamic":{"fontWeight":"var(--font-weight-semibold)"}},"tracking-wider":{"_static":{"--tw-tracking":"var(--tracking-wider)"},"_dynamic":{"letterSpacing":"var(--tracking-wider)"}},"text-blue-200":{"_static":{},"_dynamic":{"color":"var(--color-blue-200)"}},"text-green-200":{"_static":{},"_dynamic":{"color":"var(--color-green-200)"}},"text-green-500":{"_static":{},"_dynamic":{"color":"var(--color-green-500)"}},"text-navy-200":{"_static":{},"_dynamic":{"color":"var(--color-navy-200)"}},"text-navy-300":{"_static":{},"_dynamic":{"color":"var(--color-navy-300)"}},"text-navy-600":{"_static":{},"_dynamic":{"color":"var(--color-navy-600)"}},"text-navy-700":{"_static":{},"_dynamic":{"color":"var(--color-navy-700)"}},"text-white":{"_static":{},"_dynamic":{"color":"var(--color-white)"}},"text-yellow-500":{"_static":{},"_dynamic":{"color":"var(--color-yellow-500)"}},"capitalize":{"textTransform":"capitalize"},"uppercase":{"textTransform":"uppercase"},"shadow-base":{"_static":{"--tw-shadow":"0px 0px 4px var(--tw-shadow-color, lab(0% 0 0 / .1))"},"_dynamic":{"boxShadow":"var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)"}},"transition":{"_static":{"transitionProperty":"color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events"},"_dynamic":{"transitionTimingFunction":"var(--tw-ease, var(--default-transition-timing-function))","transitionDuration":"var(--tw-duration, var(--default-transition-duration))"}},"transition-all":{"_static":{"transitionProperty":"all"},"_dynamic":{"transitionTimingFunction":"var(--tw-ease, var(--default-transition-timing-function))","transitionDuration":"var(--tw-duration, var(--default-transition-duration))"}},"group-active:scale-105":{"_static":{"--tw-scale-x":"105%","--tw-scale-y":"105%","--tw-scale-z":"105%"},"_dynamic":{"scale":"var(--tw-scale-x) var(--tw-scale-y)"}},"group-active:bg-yellow-500":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-yellow-500)"}},"group-active:text-black":{"_static":{},"_dynamic":{"color":"var(--color-black)"}},"group-active:text-yellow-500":{"_static":{},"_dynamic":{"color":"var(--color-yellow-500)"}},"active:scale-95":{"_static":{"--tw-scale-x":"95%","--tw-scale-y":"95%","--tw-scale-z":"95%"},"_dynamic":{"scale":"var(--tw-scale-x) var(--tw-scale-y)"}},"scale-95":{"_static":{"--tw-scale-x":"95%","--tw-scale-y":"95%","--tw-scale-z":"95%"},"_dynamic":{"scale":"var(--tw-scale-x) var(--tw-scale-y)"}},"active:border-primary":{"_static":{},"_dynamic":{"borderColor":"var(--color-primary)"}},"active:bg-navy-600":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-navy-600)"}},"active:opacity-75":{"opacity":0.75},"opacity-75":{"opacity":0.75},"active:opacity-80":{"opacity":0.8},"opacity-80":{"opacity":0.8},"disabled:bg-navy-400":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-navy-400)"}},"bg-navy-400":{"_static":{},"_dynamic":{"backgroundColor":"var(--color-navy-400)"}},"disabled:opacity-40":{"opacity":0.4},"opacity-40":{"opacity":0.4}}