tailwind-styled-v4 5.0.10 → 5.0.11

package/dist/index.mjs

@@ -1,9 +1,9 @@
+import { createRequire } from 'module';
 import * as path from 'path';
 import { dirname } from 'path';
 import { fileURLToPath } from 'url';
 import 'crypto';
 import * as fs from 'fs';
-import { createRequire } from 'module';
 import React3 from 'react';
 
 /* tailwind-styled-v4 v5.0.4 | MIT | https://github.com/dictionar32/tailwind-styled-v4 */
@@ -16,12 +16,12 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
 var isBrowser = typeof window !== "undefined" || typeof document !== "undefined";
 var _require = typeof __require !== "undefined" ? __require : createRequire(import.meta.url);
 var PLATFORM_MAP = {
-  "linux-x64": ["@tailwind-styled/native-linux-x64"],
-  "linux-arm64": ["@tailwind-styled/native-linux-arm64"],
+  "linux-x64": ["@tailwind-styled/native-linux-x64-gnu", "@tailwind-styled/native-linux-x64"],
+  "linux-arm64": ["@tailwind-styled/native-linux-arm64-gnu", "@tailwind-styled/native-linux-arm64"],
   "darwin-x64": ["@tailwind-styled/native-darwin-x64"],
   "darwin-arm64": ["@tailwind-styled/native-darwin-arm64"],
-  "win32-x64": ["@tailwind-styled/native-win32-x64"],
-  "win32-arm64": ["@tailwind-styled/native-win32-arm64"]
+  "win32-x64": ["@tailwind-styled/native-win32-x64-msvc", "@tailwind-styled/native-win32-x64"],
+  "win32-arm64": ["@tailwind-styled/native-win32-arm64-msvc", "@tailwind-styled/native-win32-arm64"]
 };
 function platformKey() {
   if (isBrowser) return "browser";
@@ -55,9 +55,24 @@ function resolveNativeBinary(runtimeDir) {
       tried.push(`prebuilt:${pkg} (not installed)`);
     }
   }
+  const napiPlatform = platform === "linux-x64" ? "linux-x64-gnu" : platform === "linux-arm64" ? "linux-arm64-gnu" : platform;
+  const BINARY_NAMES_SELF = ["tailwind-styled-native", "tailwind_styled_parser"];
+  if (runtimeDir) {
+    for (const depth of ["..", path.join("..", ".."), path.join("..", "..", "..")]) {
+      const pkgRoot = path.resolve(runtimeDir, depth);
+      for (const bin of BINARY_NAMES_SELF) {
+        for (const suffix of ["", `.${platform}`, `.${napiPlatform}`]) {
+          const candidate = path.resolve(pkgRoot, "native", `${bin}${suffix}.node`);
+          tried.push(`self-bundled:${candidate}`);
+          if (fs.existsSync(candidate)) {
+            return { path: candidate, source: "prebuilt", platform, tried };
+          }
+        }
+      }
+    }
+  }
   const cwd = process.cwd();
   const base = runtimeDir ?? cwd;
-  const napiPlatform = platform === "linux-x64" ? "linux-x64-gnu" : platform === "linux-arm64" ? "linux-arm64-gnu" : platform;
   const BINARY_NAMES = ["tailwind-styled-native", "tailwind_styled_parser"];
   const localCandidates = [];
   for (const bin of BINARY_NAMES) {
@@ -96,7 +111,8 @@ createRequire(import.meta.url);
 // packages/domain/core/src/native.ts
 var isBrowser2 = typeof window !== "undefined" || typeof document !== "undefined";
 var NATIVE_UNAVAILABLE_MESSAGE = "[tailwind-styled/core] Native binding is required but not available.\nPlease ensure you have run: npm run build:rust";
-var _loadNative = (path3) => __require(path3);
+var _nodeRequire = createRequire(import.meta.url);
+var _loadNative = (path3) => _nodeRequire(path3);
 var nativeBinding = null;
 var bindingLoadAttempted = false;
 var getBinding = () => {
@@ -140,10 +156,25 @@ var containerRegistry = /* @__PURE__ */ new Map();
 if (typeof window !== "undefined") {
   window.__TW_CONTAINER_REGISTRY__ = containerRegistry;
 }
+var _hashContainerCache = /* @__PURE__ */ new Map();
 function hashContainer(tag, container, name) {
-  const key = tag + (name ?? "") + JSON.stringify(Object.entries(container).sort());
-  const hash = key.split("").reduce((h, char) => (h << 5) + h ^ char.charCodeAt(0), 5381);
-  return `tw-cq-${Math.abs(hash).toString(36).slice(0, 6)}`;
+  const sortedKey = tag + (name ?? "") + JSON.stringify(Object.entries(container).sort());
+  const cached = _hashContainerCache.get(sortedKey);
+  if (cached) return cached;
+  let id;
+  try {
+    const native = getNativeBinding();
+    if (native?.hashContent) {
+      id = `tw-cq-${native.hashContent(sortedKey, "fnv", 6)}`;
+    } else {
+      throw new Error("no hashContent");
+    }
+  } catch {
+    const hash = sortedKey.split("").reduce((h, char) => (h << 5) + h ^ char.charCodeAt(0), 5381);
+    id = `tw-cq-${Math.abs(hash).toString(36).slice(0, 6)}`;
+  }
+  _hashContainerCache.set(sortedKey, id);
+  return id;
 }
 var LAYOUT_MAP = {
   "flex-col": "flex-direction:column",
@@ -228,17 +259,21 @@ function buildContainerRules(id, container, containerName) {
   }).filter(Boolean);
   return rules.join("\n");
 }
+var _cqBatchedInjectFn = null;
+try {
+  const mod = __require("@tailwind-styled/runtime-css/batched");
+  if (typeof mod?.batchedInject === "function") _cqBatchedInjectFn = mod.batchedInject;
+} catch {
+}
 function injectContainerStyles(id, container, containerName) {
   if (typeof document === "undefined") return;
   const styleId = `tw-cq-${id}`;
   if (document.getElementById(styleId)) return;
   const css = buildContainerRules(id, container, containerName);
   if (!css) return;
-  try {
-    const { batchedInject } = __require("@tailwind-styled/runtime-css/batched");
-    for (const rule of css.split("\n").filter(Boolean)) batchedInject(rule);
+  if (_cqBatchedInjectFn) {
+    for (const rule of css.split("\n").filter(Boolean)) _cqBatchedInjectFn(rule);
     return;
-  } catch {
   }
   const style = document.createElement("style");
   style.id = styleId;
@@ -286,17 +321,27 @@ function getContainerRegistry() {
 
 // packages/domain/core/src/merge.ts
 function normalizeClassInput(classLists) {
-  return classLists.filter(Boolean).map((v) => String(v).trim()).filter((v) => v.length > 0);
+  const result = [];
+  for (let i = 0; i < classLists.length; i++) {
+    const v = classLists[i];
+    if (!v) continue;
+    const s = String(v).trim();
+    if (s.length > 0) result.push(s);
+  }
+  return result;
 }
 function createTwMerge(_options = {}) {
   return function twMerge2(...classLists) {
     const clean = normalizeClassInput(classLists);
     if (clean.length === 0) return "";
-    const native = getNativeBinding();
-    if (!native?.twMergeMany) {
-      throw new Error("FATAL: Native binding 'twMergeMany' is required but not available.");
+    try {
+      const native = getNativeBinding();
+      if (native?.twMergeMany) {
+        return native.twMergeMany(clean);
+      }
+    } catch {
     }
-    return native.twMergeMany(clean);
+    return clean.join(" ");
   };
 }
 var twMerge = createTwMerge();
@@ -314,17 +359,44 @@ var stateRegistry = /* @__PURE__ */ new Map();
 if (typeof window !== "undefined") {
   window.__TW_STATE_REGISTRY__ = stateRegistry;
 }
+var _hashStateCache = /* @__PURE__ */ new Map();
 function hashState(tag, state) {
-  const key = tag + JSON.stringify(Object.entries(state).sort());
-  const hash = key.split("").reduce((h, char) => (h << 5) + h ^ char.charCodeAt(0), 5381);
-  return `tw-s-${Math.abs(hash).toString(36).slice(0, 6)}`;
+  const sortedKey = tag + JSON.stringify(Object.entries(state).sort());
+  const cached = _hashStateCache.get(sortedKey);
+  if (cached) return cached;
+  let id;
+  try {
+    const native = getNativeBinding();
+    if (native?.hashContent) {
+      const raw = native.hashContent(sortedKey, "fnv", 6);
+      id = `tw-s-${raw}`;
+    } else {
+      throw new Error("no hashContent");
+    }
+  } catch {
+    const hash = sortedKey.split("").reduce((h, char) => (h << 5) + h ^ char.charCodeAt(0), 5381);
+    id = `tw-s-${Math.abs(hash).toString(36).slice(0, 6)}`;
+  }
+  _hashStateCache.set(sortedKey, id);
+  return id;
 }
+var _twClassesToCssCache = /* @__PURE__ */ new Map();
 function twClassesToCss(classes) {
+  const cached = _twClassesToCssCache.get(classes);
+  if (cached !== void 0) return cached;
   const native = getNativeBinding();
   if (!native?.twClassesToCss) {
     throw new Error("FATAL: Native binding 'twClassesToCss' is required but not available.");
   }
-  return native.twClassesToCss(classes);
+  const result = native.twClassesToCss(classes);
+  _twClassesToCssCache.set(classes, result);
+  return result;
+}
+var _batchedInjectFn = null;
+try {
+  const mod = __require("@tailwind-styled/runtime-css/batched");
+  if (typeof mod?.batchedInject === "function") _batchedInjectFn = mod.batchedInject;
+} catch {
 }
 function injectStateStyles(id, state) {
   if (typeof document === "undefined") return;
@@ -335,11 +407,9 @@ function injectStateStyles(id, state) {
     return css ? `.${id}[data-${stateName}="true"]{${css}}` : null;
   }).filter(Boolean);
   if (rules.length === 0) return;
-  try {
-    const { batchedInject } = __require("@tailwind-styled/runtime-css/batched");
-    for (const rule of rules) batchedInject(rule);
+  if (_batchedInjectFn) {
+    for (const rule of rules) _batchedInjectFn(rule);
     return;
-  } catch {
   }
   const style = document.createElement("style");
   style.id = styleId;
@@ -377,35 +447,120 @@ function getStateRegistry() {
 
 // packages/domain/core/src/createComponent.ts
 var ALWAYS_BLOCKED = /* @__PURE__ */ new Set(["base", "_ref", "state", "container", "containerName"]);
-function parseSubComponentBlocks(template) {
-  const native = getNativeBinding();
-  if (!native?.parseSubcomponentBlocksNapi) {
-    throw new Error("FATAL: Native binding 'parseSubcomponentBlocksNapi' is required but not available.");
-  }
-  const result = native.parseSubcomponentBlocksNapi(template, "tw");
-  const raw = JSON.parse(result.subMapJson);
-  return new Map(Object.entries(raw));
-}
-function extractBaseClasses(template) {
+var _templateParseCache = /* @__PURE__ */ new Map();
+var _statesLookupCache = /* @__PURE__ */ new Map();
+function _getParsedTemplate(template) {
+  const cached = _templateParseCache.get(template);
+  if (cached) return cached;
+  let result;
   try {
     const native = getNativeBinding();
     if (native?.parseSubcomponentBlocksNapi) {
-      const result = native.parseSubcomponentBlocksNapi(template, "tw");
-      return result.baseClasses;
+      const r = native.parseSubcomponentBlocksNapi(template, "tw");
+      const raw = JSON.parse(r.subMapJson);
+      result = {
+        baseClasses: r.baseClasses.trim().replace(/\s+/g, " "),
+        subMap: new Map(Object.entries(raw))
+      };
+      _templateParseCache.set(template, result);
+      return result;
     }
   } catch {
   }
-  return template.replace(/(?:\[[a-zA-Z][a-zA-Z0-9_-]*\]|[a-zA-Z][a-zA-Z0-9_-]*)\s*\{[^}]*\}/g, "").replace(/\s+/g, " ").trim();
+  const subMap = /* @__PURE__ */ new Map();
+  const regex = /((?:\[[a-zA-Z][a-zA-Z0-9_-]*\]|[a-zA-Z][a-zA-Z0-9_-]*))\s*\{([^}]*)\}/g;
+  let match;
+  while ((match = regex.exec(template)) !== null) {
+    const rawName = match[1];
+    const name = rawName.startsWith("[") ? rawName.slice(1, -1) : rawName;
+    const classes = match[2].trim().replace(/\s+/g, " ");
+    if (classes) subMap.set(name, classes);
+  }
+  const baseClasses = template.replace(/(?:\[[a-zA-Z][a-zA-Z0-9_-]*\]|[a-zA-Z][a-zA-Z0-9_-]*)\s*\{[^}]*\}/g, "").replace(/\s+/g, " ").trim();
+  result = { baseClasses, subMap };
+  _templateParseCache.set(template, result);
+  return result;
+}
+function parseSubComponentBlocks(template) {
+  return _getParsedTemplate(template).subMap;
+}
+function extractBaseClasses(template) {
+  return _getParsedTemplate(template).baseClasses;
 }
-function createSubComponentAccessor(parentDisplayName, name, classes) {
+var SEMANTIC_HTML_TAGS = /* @__PURE__ */ new Set([
+  "article",
+  "aside",
+  "details",
+  "figcaption",
+  "figure",
+  "footer",
+  "header",
+  "main",
+  "mark",
+  "nav",
+  "section",
+  "summary",
+  "time",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "p",
+  "ul",
+  "ol",
+  "li",
+  "dl",
+  "dt",
+  "dd",
+  "table",
+  "thead",
+  "tbody",
+  "tfoot",
+  "tr",
+  "th",
+  "td",
+  "form",
+  "fieldset",
+  "legend",
+  "label",
+  "a",
+  "button",
+  "img",
+  "span",
+  "div",
+  "blockquote",
+  "pre",
+  "code",
+  "em",
+  "strong",
+  "small"
+]);
+function parseSubKey(key) {
+  const colonIdx = key.indexOf(":");
+  if (colonIdx !== -1) {
+    const tag = key.slice(0, colonIdx).trim();
+    const componentName = key.slice(colonIdx + 1).trim();
+    return { tag: tag || "span", componentName: componentName || tag };
+  }
+  const isSemanticTag = SEMANTIC_HTML_TAGS.has(key);
+  return { tag: isSemanticTag ? key : "span", componentName: key };
+}
+function createSubComponentAccessor(parentDisplayName, name, classes, tag = "span", asChild = false) {
   const SubComponent = ({
     children,
     className
-  }) => React3.createElement(
-    "span",
-    { className: className ? `${classes} ${className}` : classes },
-    children
-  );
+  }) => {
+    const mergedClass = className ? `${classes} ${className}` : classes;
+    if (asChild && React3.isValidElement(children)) {
+      const child = React3.Children.only(children);
+      return React3.cloneElement(child, {
+        className: child.props.className ? `${mergedClass} ${child.props.className}` : mergedClass
+      });
+    }
+    return React3.createElement(tag, { className: mergedClass }, children);
+  };
   SubComponent.displayName = `${parentDisplayName}[${name}]`;
   return SubComponent;
 }
@@ -413,8 +568,26 @@ function registerSubComponents(component, template, configSub) {
   const displayName = component.displayName ?? "tw";
   const map = component;
   if (configSub) {
-    for (const [name, classes] of Object.entries(configSub)) {
-      map[name] = createSubComponentAccessor(displayName, name, classes.trim().replace(/\s+/g, " "));
+    for (const [key, value] of Object.entries(configSub)) {
+      if (typeof value === "string") {
+        const { tag, componentName } = parseSubKey(key);
+        map[componentName] = createSubComponentAccessor(
+          displayName,
+          componentName,
+          value.trim().replace(/\s+/g, " "),
+          tag
+        );
+      } else {
+        const tag = key;
+        for (const [componentName, classes] of Object.entries(value)) {
+          map[componentName] = createSubComponentAccessor(
+            displayName,
+            componentName,
+            classes.trim().replace(/\s+/g, " "),
+            tag
+          );
+        }
+      }
     }
   }
   const blocks = parseSubComponentBlocks(template);
@@ -427,11 +600,12 @@ function registerSubComponents(component, template, configSub) {
 function normalizeClassName(value) {
   return typeof value === "string" ? value : void 0;
 }
-function makeFilterProps(variantKeys) {
+function makeFilterProps(variantKeys, stateKeys = /* @__PURE__ */ new Set()) {
   return function filterProps(props) {
     const out = {};
     for (const key in props) {
       if (variantKeys.has(key)) continue;
+      if (stateKeys.has(key)) continue;
       if (key.startsWith("$")) continue;
       if (ALWAYS_BLOCKED.has(key)) continue;
       out[key] = props[key];
@@ -440,15 +614,42 @@ function makeFilterProps(variantKeys) {
   };
 }
 function resolveVariants(variants, props, defaults) {
-  const binding = getNativeBinding();
-  if (!binding?.resolveSimpleVariants) {
-    throw new Error("FATAL: Native binding 'resolveSimpleVariants' is required but not available.");
-  }
+  const variantKeys = Object.keys(variants);
   const cleanProps = {};
-  for (const [k, v] of Object.entries(props)) {
+  for (const k of variantKeys) {
+    const v = props[k];
     if (v !== void 0 && v !== null) cleanProps[k] = String(v);
   }
-  return binding.resolveSimpleVariants(null, variants, defaults, cleanProps);
+  try {
+    const binding = getNativeBinding();
+    if (binding?.resolveSimpleVariants) {
+      const result = binding.resolveSimpleVariants(null, variants, defaults, cleanProps);
+      return result.trim().replace(/\s+/g, " ");
+    }
+  } catch {
+  }
+  const resolved = { ...defaults, ...cleanProps };
+  const classes = [];
+  const sortedVariantEntries = Object.entries(variants).sort(([a], [b]) => a.localeCompare(b));
+  for (const [variantKey, variantMap] of sortedVariantEntries) {
+    const selected = resolved[variantKey];
+    if (selected !== void 0 && variantMap[selected] !== void 0) {
+      const normalized = variantMap[selected].trim().replace(/\s+/g, " ");
+      classes.push(normalized);
+    }
+  }
+  return classes.filter(Boolean).join(" ");
+}
+function resolveStates(statesConfig, stateKeys, statesLookup, props) {
+  if (statesLookup && stateKeys.length > 0) {
+    let mask = 0;
+    for (let i = 0; i < stateKeys.length; i++) {
+      if (props[stateKeys[i]]) mask |= 1 << i;
+    }
+    return statesLookup[mask] ?? "";
+  }
+  const activeClasses = stateKeys.filter((k) => props[k]).map((k) => statesConfig[k]).filter(Boolean);
+  return activeClasses.join(" ");
 }
 function resolveCompound(compounds, props) {
   const classes = [];
@@ -545,19 +746,46 @@ function createComponent(tag, config) {
   const containerConfig = typeof config === "string" ? void 0 : config.container;
   const containerName = typeof config === "string" ? void 0 : config.containerName;
   const configSub = typeof config === "string" ? void 0 : config.sub;
+  const statesConfig = typeof config === "string" ? void 0 : config.states;
+  let statesLookup = null;
+  let stateKeys = [];
+  if (statesConfig && Object.keys(statesConfig).length > 0) {
+    stateKeys = Object.keys(statesConfig);
+    const statesCacheKey = JSON.stringify(statesConfig, Object.keys(statesConfig).sort());
+    const cachedStates = _statesLookupCache.get(statesCacheKey);
+    if (cachedStates) {
+      statesLookup = cachedStates.lookup;
+      stateKeys = cachedStates.keys;
+    } else {
+      try {
+        const native = getNativeBinding();
+        if (native?.pregenerateStatesNapi) {
+          const result2 = native.pregenerateStatesNapi(statesConfig);
+          statesLookup = JSON.parse(result2.lookupJson);
+          stateKeys = result2.stateKeys;
+          _statesLookupCache.set(statesCacheKey, { lookup: statesLookup, keys: stateKeys });
+        }
+      } catch (e) {
+        console.warn("[tailwind-styled-v4] states pre-generation failed, falling back to runtime cx()", e);
+      }
+    }
+  }
   const stateResult = stateConfig ? processState(typeof tag === "string" ? tag : "component", stateConfig) : null;
   const containerResult = containerConfig ? processContainer(typeof tag === "string" ? tag : "component", containerConfig, containerName) : null;
   const engineClasses = [stateResult?.stateClass, containerResult?.containerClass].filter(Boolean).join(" ");
-  const filterProps = makeFilterProps(new Set(Object.keys(variants)));
+  const filterProps = makeFilterProps(new Set(Object.keys(variants)), new Set(stateKeys));
   const tagLabel = typeof tag === "string" ? tag : tag.displayName ?? "Component";
   if (isStatic || Object.keys(variants).length === 0) {
     const baseComponent2 = React3.forwardRef((props, ref) => {
       const { className, ...rest } = props;
       const runtimeClassName = normalizeClassName(className);
+      const statesClasses = statesConfig ? resolveStates(statesConfig, stateKeys, statesLookup, props) : "";
+      const mergedBase = twMerge(extractBaseClasses(base), engineClasses, runtimeClassName);
+      const className2 = statesClasses ? `${mergedBase} ${statesClasses}`.trim() : mergedBase;
       return React3.createElement(tag, {
         ref,
         ...filterProps(rest),
-        className: twMerge(extractBaseClasses(base), engineClasses, runtimeClassName)
+        className: className2
       });
     });
     const component2 = baseComponent2;
@@ -571,10 +799,13 @@ function createComponent(tag, config) {
     const runtimeClassName = normalizeClassName(className);
     const variantClasses = resolveVariants(variants, props, defaultVariants);
     const compoundClasses = resolveCompound(compoundVariants, props);
+    const statesClasses = statesConfig ? resolveStates(statesConfig, stateKeys, statesLookup, props) : "";
+    const mergedBase = twMerge(extractBaseClasses(base), variantClasses, compoundClasses, engineClasses, runtimeClassName);
+    const className2 = statesClasses ? `${mergedBase} ${statesClasses}`.trim() : mergedBase;
     return React3.createElement(tag, {
       ref,
       ...filterProps(rest),
-      className: twMerge(extractBaseClasses(base), variantClasses, compoundClasses, engineClasses, runtimeClassName)
+      className: className2
     });
   });
   const component = baseComponent;
@@ -614,47 +845,114 @@ function wrapWithSubProxy(component, tagLabel) {
 
 // packages/domain/core/src/cv.ts
 var __generatedRegistry = {};
-function lookupGenerated(componentId, props, defaultVariants) {
+var _sortedVariantKeysCache = /* @__PURE__ */ new Map();
+function lookupGenerated(componentId, props, defaultVariants, variantKeys) {
   const table = __generatedRegistry[componentId];
   if (!table) return void 0;
   const merged = { ...defaultVariants, ...props };
-  const key = Object.keys(merged).sort().filter((k) => k !== "className").map((k) => `${k}:${String(merged[k])}`).join("|");
+  let sortedKeys = _sortedVariantKeysCache.get(componentId);
+  if (!sortedKeys) {
+    const keysToUse = variantKeys ? variantKeys : Object.keys(merged).filter((k) => k !== "className");
+    sortedKeys = [...keysToUse].sort();
+    _sortedVariantKeysCache.set(componentId, sortedKeys);
+  }
+  let key = "";
+  for (let i = 0; i < sortedKeys.length; i++) {
+    if (i > 0) key += "|";
+    key += sortedKeys[i] + ":" + String(merged[sortedKeys[i]]);
+  }
   return table[key];
 }
+var _configJsonCache = /* @__PURE__ */ new WeakMap();
+function _getConfigJson(config) {
+  let json = _configJsonCache.get(config);
+  if (!json) {
+    json = JSON.stringify(config);
+    _configJsonCache.set(config, json);
+  }
+  return json;
+}
 function resolveVariantsNative(config, props) {
   const { base = "", variants = {}, compoundVariants = [], defaultVariants = {} } = config;
-  const binding = getNativeBinding();
-  if (binding?.resolveSimpleVariants) {
-    const mergedProps = {};
-    for (const [k, v] of Object.entries(defaultVariants)) {
-      if (v !== void 0 && v !== null) mergedProps[k] = String(v);
-    }
-    for (const [k, v] of Object.entries(props)) {
-      if (v !== void 0 && v !== null && k !== "className") {
-        mergedProps[k] = String(v);
+  const variantKeys = Object.keys(variants);
+  try {
+    const binding = getNativeBinding();
+    if (binding?.resolveVariants) {
+      const configJson = _getConfigJson(config);
+      const cleanProps = {};
+      for (const k of variantKeys) {
+        const dv = defaultVariants[k];
+        if (dv !== void 0 && dv !== null) cleanProps[k] = String(dv);
+      }
+      for (const k of variantKeys) {
+        const v = props[k];
+        if (v !== void 0 && v !== null) cleanProps[k] = String(v);
       }
+      const propsJson = JSON.stringify(cleanProps);
+      const result = binding.resolveVariants(configJson, propsJson);
+      return result.classes;
     }
-    let result = binding.resolveSimpleVariants(
-      base || null,
-      variants,
-      {},
-      // already merged into mergedProps
-      mergedProps
-    );
-    const resolved = { ...defaultVariants, ...props };
-    const extra = [];
-    for (const compound of compoundVariants) {
-      const { class: compoundClass, className: compoundClassName, ...conditions } = compound;
-      const matches = Object.entries(conditions).every(([key, val]) => resolved[key] === val);
-      if (matches) {
-        if (compoundClass) extra.push(String(compoundClass));
-        if (compoundClassName) extra.push(String(compoundClassName));
+    if (binding?.resolveSimpleVariants) {
+      const mergedProps = {};
+      for (const k of variantKeys) {
+        const dv = defaultVariants[k];
+        if (dv !== void 0 && dv !== null) mergedProps[k] = String(dv);
+      }
+      for (const k of variantKeys) {
+        const v = props[k];
+        if (v !== void 0 && v !== null) mergedProps[k] = String(v);
+      }
+      let result = binding.resolveSimpleVariants(
+        base || null,
+        variants,
+        {},
+        mergedProps
+      );
+      if (compoundVariants.length > 0) {
+        const resolved2 = { ...defaultVariants, ...props };
+        const extra = [];
+        for (const compound of compoundVariants) {
+          const { class: compoundClass, className: compoundClassName, ...conditions } = compound;
+          const matches = Object.entries(conditions).every(([key, val]) => resolved2[key] === val);
+          if (matches) {
+            if (compoundClass) extra.push(String(compoundClass));
+            if (compoundClassName) extra.push(String(compoundClassName));
+          }
+        }
+        if (extra.length > 0) result = `${result} ${extra.join(" ")}`.trim();
       }
+      return result;
+    }
+  } catch {
+  }
+  const resolved = {};
+  for (const k of variantKeys) {
+    const dv = defaultVariants[k];
+    if (dv !== void 0) resolved[k] = dv;
+  }
+  for (const k of variantKeys) {
+    const v = props[k];
+    if (v !== void 0 && v !== null) resolved[k] = String(v);
+  }
+  const classes = [];
+  if (base) classes.push(base);
+  for (const k of variantKeys) {
+    const variantMap = variants[k];
+    const selected = resolved[k];
+    if (selected !== void 0 && variantMap?.[selected] !== void 0) {
+      classes.push(variantMap[selected]);
+    }
+  }
+  const resolvedFull = { ...defaultVariants, ...props };
+  for (const compound of compoundVariants) {
+    const { class: compoundClass, className: compoundClassName, ...conditions } = compound;
+    const matches = Object.entries(conditions).every(([key, val]) => resolvedFull[key] === val);
+    if (matches) {
+      if (compoundClass) classes.push(String(compoundClass));
+      if (compoundClassName) classes.push(String(compoundClassName));
     }
-    if (extra.length > 0) result = `${result} ${extra.join(" ")}`.trim();
-    return result;
   }
-  throw new Error("FATAL: Native binding 'resolveSimpleVariants' is required but not available.");
+  return classes.filter(Boolean).join(" ");
 }
 function cv(config, componentId) {
   if (process.env.NODE_ENV !== "production") {
@@ -667,11 +965,13 @@ function cv(config, componentId) {
   }
   return (props = {}) => {
     let result;
+    const variantKeys = Object.keys(config.variants ?? {});
     if (componentId) {
       const generated = lookupGenerated(
         componentId,
         props,
-        config.defaultVariants
+        config.defaultVariants,
+        variantKeys
       );
       result = generated ?? resolveVariantsNative(config, props);
     } else {
@@ -683,24 +983,34 @@ function cv(config, componentId) {
 
 // packages/domain/core/src/cx.ts
 function cn(...inputs) {
-  const native = getNativeBinding();
-  if (!native?.resolveClassNames) {
-    throw new Error("FATAL: Native binding 'resolveClassNames' is required but not available.");
+  const strings = [];
+  for (const item of inputs) {
+    if (Array.isArray(item)) {
+      for (const v of item) {
+        if (v) strings.push(String(v));
+      }
+    } else if (item) {
+      strings.push(String(item));
+    }
+  }
+  if (strings.length === 0) return "";
+  try {
+    const native = getNativeBinding();
+    if (native?.resolveClassNames) return native.resolveClassNames(strings);
+  } catch {
   }
-  const strings = inputs.flat().filter(Boolean);
-  return native.resolveClassNames(strings);
+  return strings.join(" ");
 }
 function cx(...inputs) {
   const filtered = inputs.flat().filter(Boolean);
   if (filtered.length === 0) return "";
-  const native = getNativeBinding();
-  if (!native?.twMergeMany && !native?.twMerge) {
-    throw new Error("FATAL: Native binding 'twMerge' or 'twMergeMany' is required but not available.");
-  }
-  if (native.twMergeMany) {
-    return native.twMergeMany(filtered);
+  try {
+    const native = getNativeBinding();
+    if (native?.twMergeMany) return native.twMergeMany(filtered);
+    if (native?.twMerge) return native.twMerge(filtered.join(" "));
+  } catch {
   }
-  return native.twMerge(filtered.join(" "));
+  return filtered.join(" ");
 }
 var cxm = cx;
 var TOKEN_ENGINE_KEY = "__TW_TOKEN_ENGINE__";
@@ -1149,29 +1459,49 @@ function parseTemplateFallback(strings, exprs) {
   SUB_RE.lastIndex = 0;
   while ((match = SUB_RE.exec(raw)) !== null) {
     const name = match[1] ?? match[2];
-    const inner = match[3].replace(COMMENT_RE, "").split("\n").map((l) => l.trim()).filter(Boolean).join(" ").replace(/\s+/g, " ").trim();
+    const rawInner = match[3].replace(COMMENT_RE, "");
+    let inner = "";
+    for (const line of rawInner.split("\n")) {
+      const t2 = line.trim();
+      if (t2) inner += (inner ? " " : "") + t2;
+    }
+    inner = inner.replace(/\s+/g, " ").trim();
     subs[name] = inner;
     base = base.replace(match[0], "");
   }
-  const cleanBase = base.replace(COMMENT_RE, "").split("\n").map((l) => l.trim()).filter(Boolean).join(" ").replace(/\s+/g, " ").trim();
+  const rawBase = base.replace(COMMENT_RE, "");
+  let cleanBase = "";
+  for (const line of rawBase.split("\n")) {
+    const t2 = line.trim();
+    if (t2) cleanBase += (cleanBase ? " " : "") + t2;
+  }
+  cleanBase = cleanBase.replace(/\s+/g, " ").trim();
   return { base: cleanBase, subs, hasSubs: Object.keys(subs).length > 0 };
 }
+var _parsedTemplateCache = /* @__PURE__ */ new Map();
 function parseTemplate(strings, exprs) {
   const raw = strings.raw.reduce((acc, str, i) => {
     const expr = exprs[i];
     const exprStr = typeof expr === "function" ? "" : expr ?? "";
     return acc + str + String(exprStr);
   }, "");
+  const cached = _parsedTemplateCache.get(raw);
+  if (cached) return cached;
+  let result;
   try {
     const binding = getNativeBinding();
     if (binding?.parseTemplate) {
-      const result = binding.parseTemplate(raw);
-      const subs = result.hasSubs ? JSON.parse(result.subsJson) : {};
-      return { base: result.base, subs, hasSubs: result.hasSubs };
+      const r = binding.parseTemplate(raw);
+      const subs = r.hasSubs ? JSON.parse(r.subsJson) : {};
+      result = { base: r.base, subs, hasSubs: r.hasSubs };
+      _parsedTemplateCache.set(raw, result);
+      return result;
     }
   } catch {
   }
-  return parseTemplateFallback(strings, exprs);
+  result = parseTemplateFallback(strings, exprs);
+  _parsedTemplateCache.set(raw, result);
+  return result;
 }
 function makeTag(tag) {
   return ((stringsOrConfig, ...exprs) => {