windrunner 1.1.1 → 1.1.3

package/dist/index.js

@@ -20,71 +20,17 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var index_exports = {};
 __export(index_exports, {
   compileClass: () => compileClass,
+  compileCriticalCss: () => compileCriticalCss,
   createWindrunner: () => createWindrunner,
   defineResponsiveUtilities: () => defineResponsiveUtilities,
   defineUtilities: () => defineUtilities,
+  extractClassNames: () => extractClassNames,
   parseClass: () => parseClass,
   plugin: () => plugin,
   windrunner: () => windrunner
 });
 module.exports = __toCommonJS(index_exports);
 
-// src/variants.js
-var variants = {
-  accentColor: ["hover", "focus", "not-hover", "not-focus", "not-disabled"],
-  accessibility: ["hover", "focus"],
-  aspect: ["hover", "focus"],
-  backgroundColor: ["hover", "focus", "not-hover", "not-focus", "not-disabled"],
-  blur: ["hover", "focus"],
-  borderColor: ["hover", "focus", "not-hover", "not-focus", "not-disabled"],
-  boxShadow: ["hover", "focus"],
-  brightness: ["hover", "focus"],
-  caretColor: ["hover", "focus", "not-hover", "not-focus", "not-disabled"],
-  contrast: ["hover", "focus"],
-  dropShadow: ["hover", "focus"],
-  fill: ["hover", "focus", "not-hover", "not-focus", "not-disabled"],
-  flexBasis: ["hover", "focus"],
-  gradientColorStops: ["hover", "focus", "not-hover", "not-focus", "not-disabled"],
-  grayscale: ["hover", "focus"],
-  hueRotate: ["hover", "focus"],
-  insetRing: ["hover", "focus"],
-  insetShadow: ["hover", "focus"],
-  invert: ["hover", "focus"],
-  opacity: ["hover", "focus"],
-  outlineColor: ["hover", "focus", "not-hover", "not-focus", "not-disabled"],
-  outlineOffset: ["hover", "focus"],
-  outlineStyle: ["hover", "focus"],
-  outlineWidth: ["hover", "focus"],
-  placeholderColor: ["hover", "focus", "not-hover", "not-focus", "not-disabled"],
-  ringColor: ["hover", "focus", "not-hover", "not-focus", "not-disabled"],
-  ringOffsetColor: ["hover", "focus", "not-hover", "not-focus", "not-disabled"],
-  ringOffsetWidth: ["hover", "focus"],
-  ringWidth: ["hover", "focus"],
-  rotate: ["hover", "focus"],
-  saturate: ["hover", "focus"],
-  scale: ["hover", "focus"],
-  sepia: ["hover", "focus"],
-  skew: ["hover", "focus"],
-  stroke: ["hover", "focus", "not-hover", "not-focus", "not-disabled"],
-  strokeWidth: ["hover", "focus"],
-  textColor: ["hover", "focus", "not-hover", "not-focus", "not-disabled"],
-  textDecoration: ["focus", "hover"],
-  textDecorationColor: ["focus", "hover", "not-hover", "not-focus", "not-disabled"],
-  textDecorationStyle: ["focus", "hover"],
-  textDecorationThickness: ["focus", "hover"],
-  textShadowBlur: ["hover", "focus"],
-  textShadowColor: ["hover", "focus", "not-hover", "not-focus", "not-disabled"],
-  textShadowOpacity: ["hover", "focus"],
-  textShadowX: ["hover", "focus"],
-  textShadowY: ["hover", "focus"],
-  touchAction: ["hover", "focus"],
-  mask: ["hover", "focus"],
-  transform3d: ["hover", "focus"],
-  translate: ["hover", "focus"],
-  zIndex: ["hover", "focus"]
-};
-var variants_default = variants;
-
 // src/theme.js
 var theme = {
   accentColor: ({ theme: theme2 }) => ({
@@ -1432,7 +1378,6 @@ var vars_default = vars;
 
 // src/config.js
 var configOptions = {
-  variants: variants_default,
   theme: theme_default,
   vars: vars_default
 };
@@ -1442,29 +1387,70 @@ var config_default = configOptions;
 function isFunction(fn) {
   return fn && {}.toString.call(fn) === "[object Function]";
 }
+var configCache = /* @__PURE__ */ new WeakMap();
+var defaultContextCache = null;
+function createLazyTheme(userTheme = {}, userThemeExtend = {}) {
+  const resolved = /* @__PURE__ */ new Map();
+  const defaultTheme = config_default.theme;
+  return new Proxy({}, {
+    get(_, key) {
+      if (resolved.has(key)) {
+        return resolved.get(key);
+      }
+      let value = Object.prototype.hasOwnProperty.call(userTheme, key) ? userTheme[key] : defaultTheme[key];
+      if (isFunction(value)) {
+        value = value({
+          theme: (keyRef) => {
+            if (resolved.has(keyRef)) return resolved.get(keyRef);
+            return createLazyTheme(userTheme, userThemeExtend)[keyRef];
+          }
+        });
+      }
+      if (userThemeExtend[key]) {
+        value = Object.assign({}, value, userThemeExtend[key]);
+      }
+      resolved.set(key, value);
+      return value;
+    },
+    has(_, key) {
+      return key in defaultTheme || key in userTheme;
+    },
+    ownKeys(_) {
+      return [.../* @__PURE__ */ new Set([...Object.keys(defaultTheme), ...Object.keys(userTheme)])];
+    },
+    getOwnPropertyDescriptor(_, key) {
+      if (key in defaultTheme || key in userTheme) {
+        return {
+          enumerable: true,
+          configurable: true
+        };
+      }
+    }
+  });
+}
 function getConfigOptions(options = {}, pluginKeys = []) {
+  if (!options || typeof options === "object" && Object.keys(options).length === 0) {
+    if (!defaultContextCache) {
+      defaultContextCache = {
+        ...config_default,
+        theme: createLazyTheme({}, {})
+      };
+    }
+    return defaultContextCache;
+  }
+  if (configCache.has(options)) {
+    return configCache.get(options);
+  }
   const { theme: theme2 = {} } = options;
   const { extend: themeExtend = {} } = theme2;
-  const newTheme = {};
-  const themeKeys = Object.keys(config_default.theme);
-  themeKeys.forEach((key) => {
-    newTheme[key] = Object.prototype.hasOwnProperty.call(theme2, key) ? theme2[key] : config_default.theme[key];
-  });
-  themeKeys.forEach((key) => {
-    if (isFunction(newTheme[key])) {
-      newTheme[key] = newTheme[key]({
-        theme: (keyRef) => newTheme[keyRef]
-      });
-    }
-    if (themeExtend[key]) {
-      newTheme[key] = Object.assign({}, newTheme[key], themeExtend[key]);
-    }
-  });
-  return {
+  const lazyTheme = createLazyTheme(theme2, themeExtend);
+  const config = {
     ...config_default,
     ...options,
-    theme: newTheme
+    theme: lazyTheme
   };
+  configCache.set(options, config);
+  return config;
 }
 
 // src/constants.js
@@ -1548,112 +1534,93 @@ function escapeCssIdentifier(value) {
 }
 function appendImportant(declaration, isImportant) {
   if (!isImportant) return declaration;
-  const entries = declaration.split(";").map((item) => item.trim()).filter(Boolean).map((item) => item.includes("!important") ? item : `${item} !important`);
-  return `${entries.join("; ")};`;
+  return declaration.replace(/([^;{}]+);/g, (match, decl) => {
+    const trimmed = decl.trim();
+    if (!trimmed || trimmed.includes("!important")) return match;
+    return `${trimmed} !important;`;
+  });
 }
 function splitByVariantDelimiter(token) {
   const parts = [];
-  let current = "";
+  let start = 0;
   let bracketDepth = 0;
   for (let i = 0; i < token.length; i += 1) {
     const char = token[i];
-    if (char === "[") bracketDepth += 1;
-    if (char === "]") bracketDepth = Math.max(0, bracketDepth - 1);
-    if (char === ":" && bracketDepth === 0) {
-      parts.push(current);
-      current = "";
-    } else {
-      current += char;
+    if (char === "[") {
+      bracketDepth += 1;
+    } else if (char === "]") {
+      bracketDepth = Math.max(0, bracketDepth - 1);
+    } else if (char === ":" && bracketDepth === 0) {
+      parts.push(token.slice(start, i));
+      start = i + 1;
     }
   }
-  if (current) parts.push(current);
+  parts.push(token.slice(start));
   return parts;
 }
 
 // src/maps/layout.maps.js
+function createSimpleMap(prop, values, keyMap = {}) {
+  const map = {};
+  values.forEach((value) => {
+    const key = keyMap[value] || value;
+    map[key] = `${prop}: ${value};`;
+  });
+  return map;
+}
 var DISPLAY_MAP = {
-  block: "display: block;",
-  inline: "display: inline;",
-  "inline-block": "display: inline-block;",
-  flex: "display: flex;",
-  "inline-flex": "display: inline-flex;",
-  grid: "display: grid;",
-  "inline-grid": "display: inline-grid;",
-  hidden: "display: none;",
-  contents: "display: contents;",
-  "flow-root": "display: flow-root;",
-  "list-item": "display: list-item;",
-  table: "display: table;",
-  "inline-table": "display: inline-table;",
-  "table-caption": "display: table-caption;",
-  "table-cell": "display: table-cell;",
-  "table-column": "display: table-column;",
-  "table-column-group": "display: table-column-group;",
-  "table-footer-group": "display: table-footer-group;",
-  "table-header-group": "display: table-header-group;",
-  "table-row-group": "display: table-row-group;",
-  "table-row": "display: table-row;"
-};
-var POSITION_MAP = {
-  static: "position: static;",
-  fixed: "position: fixed;",
-  absolute: "position: absolute;",
-  relative: "position: relative;",
-  sticky: "position: sticky;"
+  ...createSimpleMap("display", [
+    "block",
+    "inline",
+    "inline-block",
+    "flex",
+    "inline-flex",
+    "grid",
+    "inline-grid",
+    "contents",
+    "flow-root",
+    "list-item",
+    "table",
+    "inline-table",
+    "table-caption",
+    "table-cell",
+    "table-column",
+    "table-column-group",
+    "table-footer-group",
+    "table-header-group",
+    "table-row-group",
+    "table-row"
+  ]),
+  hidden: "display: none;"
+  // Special case
 };
+var POSITION_MAP = createSimpleMap("position", [
+  "static",
+  "fixed",
+  "absolute",
+  "relative",
+  "sticky"
+]);
 var VISIBILITY_MAP = {
-  visible: "visibility: visible;",
-  invisible: "visibility: hidden;",
-  collapse: "visibility: collapse;"
-};
-var OVERFLOW_MAP = {
-  auto: "overflow: auto;",
-  hidden: "overflow: hidden;",
-  clip: "overflow: clip;",
-  visible: "overflow: visible;",
-  scroll: "overflow: scroll;"
-};
-var OVERFLOW_X_MAP = {
-  auto: "overflow-x: auto;",
-  hidden: "overflow-x: hidden;",
-  clip: "overflow-x: clip;",
-  visible: "overflow-x: visible;",
-  scroll: "overflow-x: scroll;"
-};
-var OVERFLOW_Y_MAP = {
-  auto: "overflow-y: auto;",
-  hidden: "overflow-y: hidden;",
-  clip: "overflow-y: clip;",
-  visible: "overflow-y: visible;",
-  scroll: "overflow-y: scroll;"
-};
-var OVERSCROLL_MAP = {
-  auto: "overscroll-behavior: auto;",
-  contain: "overscroll-behavior: contain;",
-  none: "overscroll-behavior: none;"
-};
-var OVERSCROLL_X_MAP = {
-  auto: "overscroll-behavior-x: auto;",
-  contain: "overscroll-behavior-x: contain;",
-  none: "overscroll-behavior-x: none;"
-};
-var OVERSCROLL_Y_MAP = {
-  auto: "overscroll-behavior-y: auto;",
-  contain: "overscroll-behavior-y: contain;",
-  none: "overscroll-behavior-y: none;"
+  ...createSimpleMap("visibility", ["visible", "collapse"]),
+  invisible: "visibility: hidden;"
+  // Key differs from value
 };
+var OVERFLOW_VALUES = ["auto", "hidden", "clip", "visible", "scroll"];
+var OVERFLOW_MAP = createSimpleMap("overflow", OVERFLOW_VALUES);
+var OVERFLOW_X_MAP = createSimpleMap("overflow-x", OVERFLOW_VALUES);
+var OVERFLOW_Y_MAP = createSimpleMap("overflow-y", OVERFLOW_VALUES);
+var OVERSCROLL_VALUES = ["auto", "contain", "none"];
+var OVERSCROLL_MAP = createSimpleMap("overscroll-behavior", OVERSCROLL_VALUES);
+var OVERSCROLL_X_MAP = createSimpleMap("overscroll-behavior-x", OVERSCROLL_VALUES);
+var OVERSCROLL_Y_MAP = createSimpleMap("overscroll-behavior-y", OVERSCROLL_VALUES);
 var FLOAT_MAP = {
-  left: "float: left;",
-  right: "float: right;",
-  none: "float: none;",
+  ...createSimpleMap("float", ["left", "right", "none"]),
   start: "float: inline-start;",
   end: "float: inline-end;"
 };
 var CLEAR_MAP = {
-  left: "clear: left;",
-  right: "clear: right;",
-  both: "clear: both;",
-  none: "clear: none;",
+  ...createSimpleMap("clear", ["left", "right", "both", "none"]),
   start: "clear: inline-start;",
   end: "clear: inline-end;"
 };
@@ -1661,13 +1628,13 @@ var ISOLATION_MAP = {
   isolate: "isolation: isolate;",
   "isolation-auto": "isolation: auto;"
 };
-var OBJECT_FIT_MAP = {
-  contain: "object-fit: contain;",
-  cover: "object-fit: cover;",
-  fill: "object-fit: fill;",
-  none: "object-fit: none;",
-  "scale-down": "object-fit: scale-down;"
-};
+var OBJECT_FIT_MAP = createSimpleMap("object-fit", [
+  "contain",
+  "cover",
+  "fill",
+  "none",
+  "scale-down"
+]);
 var TRANSFORM_STYLE_MAP = {
   "transform-style-flat": "transform-style: flat;",
   "transform-style-3d": "transform-style: preserve-3d;",
@@ -1685,81 +1652,64 @@ var BOX_SIZING_MAP = {
   border: "box-sizing: border-box;",
   content: "box-sizing: content-box;"
 };
+var BREAK_AFTER_BEFORE_VALUES = [
+  "auto",
+  "avoid",
+  "avoid-page",
+  "avoid-column",
+  "page",
+  "left",
+  "right",
+  "recto",
+  "verso"
+];
 var BREAK_AFTER_MAP = {
-  auto: "break-after: auto;",
-  avoid: "break-after: avoid;",
-  "avoid-page": "break-after: avoid-page;",
-  "avoid-column": "break-after: avoid-column;",
-  page: "break-after: page;",
-  all: "break-after: all;",
-  left: "break-after: left;",
-  right: "break-after: right;",
-  recto: "break-after: recto;",
-  verso: "break-after: verso;"
-};
-var BREAK_BEFORE_MAP = {
-  auto: "break-before: auto;",
-  avoid: "break-before: avoid;",
-  "avoid-page": "break-before: avoid-page;",
-  "avoid-column": "break-before: avoid-column;",
-  page: "break-before: page;",
-  left: "break-before: left;",
-  right: "break-before: right;",
-  recto: "break-before: recto;",
-  verso: "break-before: verso;"
-};
-var BREAK_INSIDE_MAP = {
-  auto: "break-inside: auto;",
-  avoid: "break-inside: avoid;",
-  "avoid-page": "break-inside: avoid-page;",
-  "avoid-column": "break-inside: avoid-column;"
-};
-var BOX_DECORATION_BREAK_MAP = {
-  slice: "box-decoration-break: slice;",
-  clone: "box-decoration-break: clone;"
-};
-var HYPHENS_MAP = {
-  none: "hyphens: none;",
-  manual: "hyphens: manual;",
-  auto: "hyphens: auto;"
-};
-var COLOR_SCHEME_MAP = {
-  light: "color-scheme: light;",
-  dark: "color-scheme: dark;",
-  normal: "color-scheme: normal;"
-};
-var SCROLLBAR_COLOR_MAP = {
-  auto: "scrollbar-color: auto;",
-  transparent: "scrollbar-color: transparent;",
-  current: "scrollbar-color: currentColor;"
-};
-var SCROLLBAR_WIDTH_MAP = {
-  auto: "scrollbar-width: auto;",
-  thin: "scrollbar-width: thin;",
-  none: "scrollbar-width: none;"
+  ...createSimpleMap("break-after", BREAK_AFTER_BEFORE_VALUES),
+  all: "break-after: all;"
 };
+var BREAK_BEFORE_MAP = createSimpleMap("break-before", BREAK_AFTER_BEFORE_VALUES);
+var BREAK_INSIDE_MAP = createSimpleMap("break-inside", [
+  "auto",
+  "avoid",
+  "avoid-page",
+  "avoid-column"
+]);
+var BOX_DECORATION_BREAK_MAP = createSimpleMap("box-decoration-break", [
+  "slice",
+  "clone"
+]);
+var HYPHENS_MAP = createSimpleMap("hyphens", ["none", "manual", "auto"]);
+var COLOR_SCHEME_MAP = createSimpleMap("color-scheme", [
+  "light",
+  "dark",
+  "normal"
+]);
+var SCROLLBAR_COLOR_MAP = createSimpleMap("scrollbar-color", [
+  "auto",
+  "transparent",
+  "current"
+]);
+var SCROLLBAR_WIDTH_MAP = createSimpleMap("scrollbar-width", [
+  "auto",
+  "thin",
+  "none"
+]);
 var SCROLLBAR_GUTTER_MAP = {
   auto: "scrollbar-gutter: auto;",
   stable: "scrollbar-gutter: stable;",
   "stable-both-edges": "scrollbar-gutter: stable both-edges;",
   "both-edges": "scrollbar-gutter: both-edges;"
 };
-var TABLE_LAYOUT_MAP = {
-  auto: "table-layout: auto;",
-  fixed: "table-layout: fixed;"
-};
-var CAPTION_SIDE_MAP = {
-  top: "caption-side: top;",
-  bottom: "caption-side: bottom;"
-};
-var BORDER_COLLAPSE_MAP = {
-  collapse: "border-collapse: collapse;",
-  separate: "border-collapse: separate;"
-};
-var SCROLL_BEHAVIOR_MAP = {
-  auto: "scroll-behavior: auto;",
-  smooth: "scroll-behavior: smooth;"
-};
+var TABLE_LAYOUT_MAP = createSimpleMap("table-layout", ["auto", "fixed"]);
+var CAPTION_SIDE_MAP = createSimpleMap("caption-side", ["top", "bottom"]);
+var BORDER_COLLAPSE_MAP = createSimpleMap("border-collapse", [
+  "collapse",
+  "separate"
+]);
+var SCROLL_BEHAVIOR_MAP = createSimpleMap("scroll-behavior", [
+  "auto",
+  "smooth"
+]);
 var SIDE_PROPS = {
   "": [""],
   t: ["-top"],
@@ -1790,71 +1740,69 @@ var ROUNDED_PROPS = {
 };
 
 // src/maps/interactivity.maps.js
-var CURSOR_MAP = {
-  auto: "cursor: auto;",
-  default: "cursor: default;",
-  pointer: "cursor: pointer;",
-  wait: "cursor: wait;",
-  text: "cursor: text;",
-  move: "cursor: move;",
-  help: "cursor: help;",
-  "not-allowed": "cursor: not-allowed;",
-  none: "cursor: none;",
-  "context-menu": "cursor: context-menu;",
-  progress: "cursor: progress;",
-  cell: "cursor: cell;",
-  crosshair: "cursor: crosshair;",
-  "vertical-text": "cursor: vertical-text;",
-  alias: "cursor: alias;",
-  copy: "cursor: copy;",
-  "no-drop": "cursor: no-drop;",
-  grab: "cursor: grab;",
-  grabbing: "cursor: grabbing;",
-  "all-scroll": "cursor: all-scroll;",
-  "zoom-in": "cursor: zoom-in;",
-  "zoom-out": "cursor: zoom-out;"
-};
-var POINTER_EVENTS_MAP = {
-  none: "pointer-events: none;",
-  auto: "pointer-events: auto;"
-};
-var USER_SELECT_MAP = {
-  none: "user-select: none;",
-  text: "user-select: text;",
-  all: "user-select: all;",
-  auto: "user-select: auto;"
-};
-var APPEARANCE_MAP = {
-  none: "appearance: none;",
-  auto: "appearance: auto;"
-};
-var TOUCH_ACTION_MAP = {
-  auto: "touch-action: auto;",
-  none: "touch-action: none;",
-  "pan-x": "touch-action: pan-x;",
-  "pan-left": "touch-action: pan-left;",
-  "pan-right": "touch-action: pan-right;",
-  "pan-y": "touch-action: pan-y;",
-  "pan-up": "touch-action: pan-up;",
-  "pan-down": "touch-action: pan-down;",
-  "pinch-zoom": "touch-action: pinch-zoom;",
-  manipulation: "touch-action: manipulation;"
-};
+function createSimpleMap2(prop, values) {
+  const map = {};
+  values.forEach((value) => {
+    map[value] = `${prop}: ${value};`;
+  });
+  return map;
+}
+var CURSOR_MAP = createSimpleMap2("cursor", [
+  "auto",
+  "default",
+  "pointer",
+  "wait",
+  "text",
+  "move",
+  "help",
+  "not-allowed",
+  "none",
+  "context-menu",
+  "progress",
+  "cell",
+  "crosshair",
+  "vertical-text",
+  "alias",
+  "copy",
+  "no-drop",
+  "grab",
+  "grabbing",
+  "all-scroll",
+  "zoom-in",
+  "zoom-out"
+]);
+var POINTER_EVENTS_MAP = createSimpleMap2("pointer-events", ["none", "auto"]);
+var USER_SELECT_MAP = createSimpleMap2("user-select", [
+  "none",
+  "text",
+  "all",
+  "auto"
+]);
+var APPEARANCE_MAP = createSimpleMap2("appearance", ["none", "auto"]);
+var TOUCH_ACTION_MAP = createSimpleMap2("touch-action", [
+  "auto",
+  "none",
+  "pan-x",
+  "pan-left",
+  "pan-right",
+  "pan-y",
+  "pan-up",
+  "pan-down",
+  "pinch-zoom",
+  "manipulation"
+]);
 var OUTLINE_STYLE_MAP = {
   none: "outline: 2px solid transparent; outline-offset: 2px;",
-  solid: "outline-style: solid;",
-  dashed: "outline-style: dashed;",
-  dotted: "outline-style: dotted;",
-  double: "outline-style: double;"
-};
-var BORDER_STYLE_MAP = {
-  solid: "border-style: solid;",
-  dashed: "border-style: dashed;",
-  dotted: "border-style: dotted;",
-  double: "border-style: double;",
-  hidden: "border-style: hidden;",
-  none: "border-style: none;"
+  ...createSimpleMap2("outline-style", ["solid", "dashed", "dotted", "double"])
 };
+var BORDER_STYLE_MAP = createSimpleMap2("border-style", [
+  "solid",
+  "dashed",
+  "dotted",
+  "double",
+  "hidden",
+  "none"
+]);
 var TRANSITION_PROPERTY_MAP = {
   none: "none",
   all: "all",
@@ -3307,7 +3255,8 @@ function buildDivideDeclaration(baseToken, theme2) {
 // src/plugins.js
 var PluginRegistry = class {
   constructor() {
-    this.utilities = /* @__PURE__ */ new Map();
+    this.exactUtilities = /* @__PURE__ */ new Map();
+    this.regexUtilities = [];
     this.variants = /* @__PURE__ */ new Map();
   }
   /**
@@ -3316,7 +3265,11 @@ var PluginRegistry = class {
    * @param {Function|string} handler - Function that returns CSS or CSS string
    */
   addUtility(pattern, handler) {
-    this.utilities.set(pattern, handler);
+    if (pattern instanceof RegExp) {
+      this.regexUtilities.push([pattern, handler]);
+    } else {
+      this.exactUtilities.set(pattern, handler);
+    }
   }
   /**
    * Register multiple utilities at once
@@ -3339,25 +3292,29 @@ var PluginRegistry = class {
    * Register multiple variants at once
    * @param {Object} variants - Object mapping names to handlers
    */
-  addVariants(variants2) {
-    Object.entries(variants2).forEach(([name, handler]) => {
+  addVariants(variants) {
+    Object.entries(variants).forEach(([name, handler]) => {
       this.addVariant(name, handler);
     });
   }
   /**
    * Check if a token matches any custom utility pattern
+   * Optimized: O(1) fast path for exact matches, O(n) only for regex patterns
    * @param {string} token - The base token to match
    * @returns {Object|null} - { handler, match } or null
    */
   matchUtility(token) {
-    for (const [pattern, handler] of this.utilities) {
-      if (pattern instanceof RegExp) {
-        const match = pattern.exec(token);
-        if (match) {
-          return { handler, match };
-        }
-      } else if (pattern === token) {
-        return { handler, match: [token] };
+    if (this.exactUtilities.has(token)) {
+      return {
+        handler: this.exactUtilities.get(token),
+        match: [token]
+      };
+    }
+    for (let i = 0; i < this.regexUtilities.length; i += 1) {
+      const [pattern, handler] = this.regexUtilities[i];
+      const match = pattern.exec(token);
+      if (match) {
+        return { handler, match };
       }
     }
     return null;
@@ -3374,7 +3331,10 @@ var PluginRegistry = class {
    * Get all registered utility patterns (for debugging)
    */
   getUtilities() {
-    return Array.from(this.utilities.keys());
+    return [
+      ...Array.from(this.exactUtilities.keys()),
+      ...this.regexUtilities.map(([pattern]) => pattern)
+    ];
   }
   /**
    * Get all registered variant names (for debugging)
@@ -3386,7 +3346,8 @@ var PluginRegistry = class {
    * Clear all registered plugins
    */
   clear() {
-    this.utilities.clear();
+    this.exactUtilities.clear();
+    this.regexUtilities = [];
     this.variants.clear();
   }
 };
@@ -3591,8 +3552,26 @@ function extractPrefix(token) {
   }
   return prefix;
 }
+var UNKNOWN_PREFIX_CACHE = /* @__PURE__ */ new Set();
+var MAX_UNKNOWN_CACHE_SIZE = 500;
 function checkAllBuilders(baseToken, theme2) {
-  return buildLayoutDeclaration(baseToken, theme2) || buildPositionInsetDeclaration(baseToken, theme2) || buildSpacingDeclaration(baseToken, theme2) || buildSpaceBetweenDeclaration(baseToken, theme2) || buildGapDeclaration(baseToken, theme2) || buildDimensionDeclaration(baseToken, theme2) || buildFlexGridDeclaration(baseToken, theme2) || buildBorderDeclaration(baseToken, theme2) || buildBorderRadiusDeclaration(baseToken, theme2) || buildBorderSpacingDeclaration(baseToken, theme2) || buildDivideDeclaration(baseToken, theme2) || buildOpacityDeclaration(baseToken, theme2) || buildShadowDeclaration(baseToken, theme2) || buildInsetShadowDeclaration(baseToken, theme2) || buildInsetRingDeclaration(baseToken, theme2) || buildRingDeclaration(baseToken, theme2) || buildRingOffsetDeclaration(baseToken, theme2) || buildTextShadowDeclaration(baseToken, theme2) || buildTransitionDeclaration(baseToken) || buildTransformDeclaration(baseToken, theme2) || buildFilterDeclaration(baseToken, theme2) || buildBackgroundDeclaration(baseToken, theme2) || buildGradientDeclaration(baseToken, theme2) || buildColorDeclaration(baseToken, theme2) || buildTypographyDeclaration(baseToken, theme2) || buildBlendingDeclaration(baseToken) || buildInteractivityDeclaration(baseToken, theme2) || buildAnimationDeclaration(baseToken) || buildMaskDeclaration(baseToken) || buildContainerQueryDeclaration(baseToken) || buildScrollSnapDeclaration(baseToken) || buildAccessibilityDeclaration(baseToken) || buildZoomDeclaration(baseToken, theme2) || buildForcedColorDeclaration(baseToken);
+  const prefix = extractPrefix(baseToken);
+  if (UNKNOWN_PREFIX_CACHE.has(prefix)) {
+    return void 0;
+  }
+  const result = buildLayoutDeclaration(baseToken, theme2) || buildPositionInsetDeclaration(baseToken, theme2) || buildSpacingDeclaration(baseToken, theme2) || buildSpaceBetweenDeclaration(baseToken, theme2) || buildGapDeclaration(baseToken, theme2) || buildDimensionDeclaration(baseToken, theme2) || buildFlexGridDeclaration(baseToken, theme2) || buildBorderDeclaration(baseToken, theme2) || buildBorderRadiusDeclaration(baseToken, theme2) || buildBorderSpacingDeclaration(baseToken, theme2) || buildDivideDeclaration(baseToken, theme2) || buildOpacityDeclaration(baseToken, theme2) || buildShadowDeclaration(baseToken, theme2) || buildInsetShadowDeclaration(baseToken, theme2) || buildInsetRingDeclaration(baseToken, theme2) || buildRingDeclaration(baseToken, theme2) || buildRingOffsetDeclaration(baseToken, theme2) || buildTextShadowDeclaration(baseToken, theme2) || buildTransitionDeclaration(baseToken) || buildTransformDeclaration(baseToken, theme2) || buildFilterDeclaration(baseToken, theme2) || buildBackgroundDeclaration(baseToken, theme2) || buildGradientDeclaration(baseToken, theme2) || buildColorDeclaration(baseToken, theme2) || buildTypographyDeclaration(baseToken, theme2) || buildBlendingDeclaration(baseToken) || buildInteractivityDeclaration(baseToken, theme2) || buildAnimationDeclaration(baseToken) || buildMaskDeclaration(baseToken) || buildContainerQueryDeclaration(baseToken) || buildScrollSnapDeclaration(baseToken) || buildAccessibilityDeclaration(baseToken) || buildZoomDeclaration(baseToken, theme2) || buildForcedColorDeclaration(baseToken);
+  if (!result && prefix) {
+    if (UNKNOWN_PREFIX_CACHE.size >= MAX_UNKNOWN_CACHE_SIZE) {
+      const toRemove = Math.floor(MAX_UNKNOWN_CACHE_SIZE / 2);
+      const iterator = UNKNOWN_PREFIX_CACHE.values();
+      for (let i = 0; i < toRemove; i += 1) {
+        const value = iterator.next().value;
+        if (value) UNKNOWN_PREFIX_CACHE.delete(value);
+      }
+    }
+    UNKNOWN_PREFIX_CACHE.add(prefix);
+  }
+  return result;
 }
 function compileBaseToken(baseToken, theme2, pluginRegistry) {
   if (pluginRegistry) {
@@ -3621,9 +3600,75 @@ function compileBaseToken(baseToken, theme2, pluginRegistry) {
   }
   return checkAllBuilders(baseToken, theme2);
 }
-function applyVariants(selector, variants2, pluginRegistry) {
+var VARIANT_MAP = /* @__PURE__ */ new Map([
+  // Dark mode
+  ["dark", (s) => `.dark ${s}`],
+  // Pseudo-classes – interactive
+  ["hover", (s) => `${s}:hover`],
+  ["focus", (s) => `${s}:focus`],
+  ["focus-visible", (s) => `${s}:focus-visible`],
+  ["focus-within", (s) => `${s}:focus-within`],
+  ["active", (s) => `${s}:active`],
+  ["visited", (s) => `${s}:visited`],
+  ["disabled", (s) => `${s}:disabled`],
+  ["checked", (s) => `${s}:checked`],
+  ["indeterminate", (s) => `${s}:indeterminate`],
+  ["required", (s) => `${s}:required`],
+  ["valid", (s) => `${s}:valid`],
+  ["invalid", (s) => `${s}:invalid`],
+  ["target", (s) => `${s}:target`],
+  ["enabled", (s) => `${s}:enabled`],
+  ["default", (s) => `${s}:default`],
+  ["optional", (s) => `${s}:optional`],
+  ["user-valid", (s) => `${s}:user-valid`],
+  ["user-invalid", (s) => `${s}:user-invalid`],
+  ["in-range", (s) => `${s}:in-range`],
+  ["out-of-range", (s) => `${s}:out-of-range`],
+  ["placeholder-shown", (s) => `${s}:placeholder-shown`],
+  ["autofill", (s) => `${s}:autofill`],
+  ["details-content", (s) => `${s}:details-content`],
+  ["read-only", (s) => `${s}:read-only`],
+  ["open", (s) => `${s}[open]`],
+  // Pseudo-elements
+  ["placeholder", (s) => `${s}::placeholder`],
+  ["backdrop", (s) => `${s}::backdrop`],
+  ["before", (s) => `${s}::before`],
+  ["after", (s) => `${s}::after`],
+  ["first-letter", (s) => `${s}::first-letter`],
+  ["first-line", (s) => `${s}::first-line`],
+  ["marker", (s) => `${s}::marker`],
+  ["selection", (s) => `${s}::selection`],
+  ["file", (s) => `${s}::file-selector-button`],
+  // Structural pseudo-classes
+  ["first", (s) => `${s}:first-child`],
+  ["last", (s) => `${s}:last-child`],
+  ["odd", (s) => `${s}:nth-child(odd)`],
+  ["even", (s) => `${s}:nth-child(even)`],
+  ["first-of-type", (s) => `${s}:first-of-type`],
+  ["last-of-type", (s) => `${s}:last-of-type`],
+  ["only", (s) => `${s}:only-child`],
+  ["only-of-type", (s) => `${s}:only-of-type`],
+  ["empty", (s) => `${s}:empty`],
+  // Group & peer variants
+  ["group-hover", (s) => `.group:hover ${s}`],
+  ["group-focus", (s) => `.group:focus ${s}`],
+  ["group-active", (s) => `.group:active ${s}`],
+  ["peer-hover", (s) => `.peer:hover ~ ${s}`],
+  ["peer-focus", (s) => `.peer:focus ~ ${s}`],
+  ["peer-checked", (s) => `.peer:checked ~ ${s}`],
+  ["peer-disabled", (s) => `.peer:disabled ~ ${s}`],
+  // Negation variants
+  ["not-hover", (s) => `${s}:not(:hover)`],
+  ["not-focus", (s) => `${s}:not(:focus)`],
+  ["not-disabled", (s) => `${s}:not(:disabled)`],
+  ["not-checked", (s) => `${s}:not(:checked)`],
+  // In-* variants (group-based)
+  ["in-hover", (s) => `.group:hover ${s}`],
+  ["in-focus", (s) => `.group:focus ${s}`]
+]);
+function applyVariants(selector, variants, pluginRegistry) {
   let currentSelector = selector;
-  for (const variant of variants2) {
+  for (const variant of variants) {
     if (pluginRegistry) {
       const customHandler = pluginRegistry.matchVariant(variant);
       if (customHandler) {
@@ -3638,180 +3683,11 @@ function applyVariants(selector, variants2, pluginRegistry) {
         }
       }
     }
-    switch (variant) {
-      case "dark":
-        currentSelector = `.dark ${currentSelector}`;
-        break;
-      case "hover":
-        currentSelector = `${currentSelector}:hover`;
-        break;
-      case "focus":
-        currentSelector = `${currentSelector}:focus`;
-        break;
-      case "focus-visible":
-        currentSelector = `${currentSelector}:focus-visible`;
-        break;
-      case "focus-within":
-        currentSelector = `${currentSelector}:focus-within`;
-        break;
-      case "active":
-        currentSelector = `${currentSelector}:active`;
-        break;
-      case "visited":
-        currentSelector = `${currentSelector}:visited`;
-        break;
-      case "disabled":
-        currentSelector = `${currentSelector}:disabled`;
-        break;
-      case "checked":
-        currentSelector = `${currentSelector}:checked`;
-        break;
-      case "indeterminate":
-        currentSelector = `${currentSelector}:indeterminate`;
-        break;
-      case "required":
-        currentSelector = `${currentSelector}:required`;
-        break;
-      case "valid":
-        currentSelector = `${currentSelector}:valid`;
-        break;
-      case "invalid":
-        currentSelector = `${currentSelector}:invalid`;
-        break;
-      case "target":
-        currentSelector = `${currentSelector}:target`;
-        break;
-      case "enabled":
-        currentSelector = `${currentSelector}:enabled`;
-        break;
-      case "default":
-        currentSelector = `${currentSelector}:default`;
-        break;
-      case "optional":
-        currentSelector = `${currentSelector}:optional`;
-        break;
-      case "user-valid":
-        currentSelector = `${currentSelector}:user-valid`;
-        break;
-      case "user-invalid":
-        currentSelector = `${currentSelector}:user-invalid`;
-        break;
-      case "in-range":
-        currentSelector = `${currentSelector}:in-range`;
-        break;
-      case "out-of-range":
-        currentSelector = `${currentSelector}:out-of-range`;
-        break;
-      case "placeholder-shown":
-        currentSelector = `${currentSelector}:placeholder-shown`;
-        break;
-      case "autofill":
-        currentSelector = `${currentSelector}:autofill`;
-        break;
-      case "details-content":
-        currentSelector = `${currentSelector}:details-content`;
-        break;
-      case "placeholder":
-        currentSelector = `${currentSelector}::placeholder`;
-        break;
-      case "backdrop":
-        currentSelector = `${currentSelector}::backdrop`;
-        break;
-      case "before":
-        currentSelector = `${currentSelector}::before`;
-        break;
-      case "after":
-        currentSelector = `${currentSelector}::after`;
-        break;
-      case "first-letter":
-        currentSelector = `${currentSelector}::first-letter`;
-        break;
-      case "first-line":
-        currentSelector = `${currentSelector}::first-line`;
-        break;
-      case "marker":
-        currentSelector = `${currentSelector}::marker`;
-        break;
-      case "selection":
-        currentSelector = `${currentSelector}::selection`;
-        break;
-      case "file":
-        currentSelector = `${currentSelector}::file-selector-button`;
-        break;
-      case "first":
-        currentSelector = `${currentSelector}:first-child`;
-        break;
-      case "last":
-        currentSelector = `${currentSelector}:last-child`;
-        break;
-      case "odd":
-        currentSelector = `${currentSelector}:nth-child(odd)`;
-        break;
-      case "even":
-        currentSelector = `${currentSelector}:nth-child(even)`;
-        break;
-      case "first-of-type":
-        currentSelector = `${currentSelector}:first-of-type`;
-        break;
-      case "last-of-type":
-        currentSelector = `${currentSelector}:last-of-type`;
-        break;
-      case "only":
-        currentSelector = `${currentSelector}:only-child`;
-        break;
-      case "only-of-type":
-        currentSelector = `${currentSelector}:only-of-type`;
-        break;
-      case "empty":
-        currentSelector = `${currentSelector}:empty`;
-        break;
-      case "read-only":
-        currentSelector = `${currentSelector}:read-only`;
-        break;
-      case "open":
-        currentSelector = `${currentSelector}[open]`;
-        break;
-      case "group-hover":
-        currentSelector = `.group:hover ${currentSelector}`;
-        break;
-      case "group-focus":
-        currentSelector = `.group:focus ${currentSelector}`;
-        break;
-      case "group-active":
-        currentSelector = `.group:active ${currentSelector}`;
-        break;
-      case "peer-hover":
-        currentSelector = `.peer:hover ~ ${currentSelector}`;
-        break;
-      case "peer-focus":
-        currentSelector = `.peer:focus ~ ${currentSelector}`;
-        break;
-      case "peer-checked":
-        currentSelector = `.peer:checked ~ ${currentSelector}`;
-        break;
-      case "peer-disabled":
-        currentSelector = `.peer:disabled ~ ${currentSelector}`;
-        break;
-      case "not-hover":
-        currentSelector = `${currentSelector}:not(:hover)`;
-        break;
-      case "not-focus":
-        currentSelector = `${currentSelector}:not(:focus)`;
-        break;
-      case "not-disabled":
-        currentSelector = `${currentSelector}:not(:disabled)`;
-        break;
-      case "not-checked":
-        currentSelector = `${currentSelector}:not(:checked)`;
-        break;
-      case "in-hover":
-        currentSelector = `.group:hover ${currentSelector}`;
-        break;
-      case "in-focus":
-        currentSelector = `.group:focus ${currentSelector}`;
-        break;
-      default:
-        return void 0;
+    const builtinHandler = VARIANT_MAP.get(variant);
+    if (builtinHandler) {
+      currentSelector = builtinHandler(currentSelector);
+    } else {
+      return void 0;
     }
   }
   return currentSelector;
@@ -3827,7 +3703,7 @@ function resolveRuntimeContext(options = {}) {
             addUtility: (pattern, handler) => pluginRegistry.addUtility(pattern, handler),
             addUtilities: (utilities) => pluginRegistry.addUtilities(utilities),
             addVariant: (name, handler) => pluginRegistry.addVariant(name, handler),
-            addVariants: (variants2) => pluginRegistry.addVariants(variants2),
+            addVariants: (variants) => pluginRegistry.addVariants(variants),
             theme: (key) => {
               if (!key) return config.theme || {};
               const keys = key.split(".");
@@ -3880,7 +3756,7 @@ function parseClass(className, screens = {}, containers = {}) {
   const parts = splitByVariantDelimiter(normalized);
   if (parts.length === 0) return null;
   const baseToken = parts[parts.length - 1];
-  const variants2 = [];
+  const variants = [];
   let breakpoint = null;
   let containerBreakpoint = null;
   let starting = false;
@@ -3901,9 +3777,9 @@ function parseClass(className, screens = {}, containers = {}) {
       breakpoint = part;
       continue;
     }
-    variants2.push(part);
+    variants.push(part);
   }
-  const result = { original: token, baseToken, variants: variants2, breakpoint, containerBreakpoint, important, starting };
+  const result = { original: token, baseToken, variants, breakpoint, containerBreakpoint, important, starting };
   if (parseCache.size >= PARSE_CACHE_MAX_SIZE) {
     const firstKey = parseCache.keys().next().value;
     parseCache.delete(firstKey);
@@ -3939,6 +3815,30 @@ function compileRuntimeClassNameWithContext(className, context) {
 function compileClass(className, options = {}) {
   return compileRuntimeClassNameWithContext(className, resolveRuntimeContext(options));
 }
+function compileCriticalCss(classNames, options = {}) {
+  const classList = typeof classNames === "string" ? classNames.split(/\s+/).filter(Boolean) : Array.isArray(classNames) ? classNames.flatMap(
+    (str) => typeof str === "string" ? str.split(/\s+/).filter(Boolean) : []
+  ) : [];
+  const context = resolveRuntimeContext(options);
+  const cssRules = /* @__PURE__ */ new Set();
+  classList.forEach((className) => {
+    const css = compileRuntimeClassNameWithContext(className, context);
+    if (css) {
+      cssRules.add(css);
+    }
+  });
+  return Array.from(cssRules).join("\n");
+}
+function extractClassNames(html) {
+  const classSet = /* @__PURE__ */ new Set();
+  const classRegex = /class(?:Name)?=["']([^"']+)["']/g;
+  let match;
+  while ((match = classRegex.exec(html)) !== null) {
+    const classes = match[1].split(/\s+/).filter(Boolean);
+    classes.forEach((cls) => classSet.add(cls));
+  }
+  return Array.from(classSet);
+}
 
 // src/preflight.js
 var preflight = `
@@ -4012,6 +3912,9 @@ function createWindrunner(options = {}) {
   const preflight2 = options.preflight !== false;
   const compatMode = options.compatMode || "none";
   const compatStyleId = options.compatStyleId || `${styleId}-full`;
+  const maxCacheSize = options.maxCacheSize || 1e4;
+  const onError = typeof options.onError === "function" ? options.onError : null;
+  const onCompile = typeof options.onCompile === "function" ? options.onCompile : null;
   const tailwindOptions = getBaseTailwindOptions(options);
   const context = resolveRuntimeContext(tailwindOptions);
   const cache = /* @__PURE__ */ new Map();
@@ -4057,6 +3960,10 @@ function createWindrunner(options = {}) {
   const compileWithCache = (className) => {
     if (cache.has(className)) return cache.get(className);
     const cssRule = compileRuntimeClassNameWithContext(className, context);
+    if (cache.size >= maxCacheSize) {
+      const firstKey = cache.keys().next().value;
+      cache.delete(firstKey);
+    }
     cache.set(className, cssRule);
     return cssRule;
   };
@@ -4079,8 +3986,19 @@ function createWindrunner(options = {}) {
     const cssRule = compileWithCache(className);
     if (!cssRule) {
       ensureCompatStyle();
+      if (onError) {
+        const parsed = parseClass(className, context.screens, context.containers);
+        const errorContext = {
+          reason: parsed ? "unknown-utility" : "parse-error",
+          baseToken: parsed ? parsed.baseToken : className,
+          variants: parsed ? parsed.variants : void 0,
+          details: parsed ? `Could not compile utility "${parsed.baseToken}"${parsed.variants.length ? ` with variants: ${parsed.variants.join(", ")}` : ""}` : `Failed to parse class name "${className}"`
+        };
+        onError(className, errorContext);
+      }
     } else {
       insertRule(cssRule);
+      if (onCompile) onCompile(className, cssRule);
     }
     return cssRule;
   };
@@ -4101,9 +4019,39 @@ function createWindrunner(options = {}) {
   };
   const scan = (root = document) => {
     if (typeof document !== "object" || !root) return;
-    if (root.nodeType === 1) processElementTree(root);
+    const startTime = typeof performance !== "undefined" ? performance.now() : Date.now();
+    const scannedElements = /* @__PURE__ */ new Set();
+    const foundClasses = /* @__PURE__ */ new Set();
+    const initialRuleCount = insertedRules.size;
+    if (root.nodeType === 1) {
+      processElementTree(root);
+      if (root.classList) {
+        scannedElements.add(root);
+        root.classList.forEach((cls) => foundClasses.add(cls));
+      }
+    }
     const elements = root.querySelectorAll ? root.querySelectorAll("[class]") : [];
-    elements.forEach((element) => processElement(element));
+    elements.forEach((element) => {
+      processElement(element);
+      scannedElements.add(element);
+      if (element.classList) {
+        element.classList.forEach((cls) => foundClasses.add(cls));
+      }
+    });
+    if (typeof options.onScanComplete === "function") {
+      const endTime = typeof performance !== "undefined" ? performance.now() : Date.now();
+      const stats = {
+        elementCount: scannedElements.size,
+        classCount: foundClasses.size,
+        ruleCount: insertedRules.size - initialRuleCount,
+        duration: endTime - startTime
+      };
+      if (typeof requestAnimationFrame === "function") {
+        requestAnimationFrame(() => options.onScanComplete(stats));
+      } else {
+        setTimeout(() => options.onScanComplete(stats), 0);
+      }
+    }
   };
   const flushQueue = () => {
     scheduled = false;
@@ -4136,12 +4084,18 @@ function createWindrunner(options = {}) {
       });
       scheduleFlush();
     });
-    observer.observe(root, {
-      childList: true,
-      subtree: true,
-      attributes: true,
-      attributeFilter: ["class"]
-    });
+    const observerConfig = options.observerOptions || {};
+    const finalConfig = {
+      childList: observerConfig.childList !== false,
+      // default: true
+      subtree: observerConfig.subtree !== false,
+      // default: true
+      attributes: observerConfig.attributes !== false,
+      // default: true
+      attributeFilter: observerConfig.attributeFilter || ["class"]
+      // default: ["class"]
+    };
+    observer.observe(root, finalConfig);
   };
   const disconnect = () => {
     pendingElements.clear();
@@ -4183,6 +4137,16 @@ function createWindrunner(options = {}) {
     }
     runStart();
   };
+  const clearCache = () => {
+    cache.clear();
+  };
+  const getStats = () => ({
+    cacheSize: cache.size,
+    insertedRuleCount: insertedRules.size,
+    pendingElementCount: pendingElements.size,
+    isObserving: observer !== null,
+    isCompatLoaded: compatLoaded
+  });
   return {
     processClassName,
     processClassList,
@@ -4192,6 +4156,8 @@ function createWindrunner(options = {}) {
     flush,
     start,
     disconnect,
+    clearCache,
+    getStats,
     isCompatLoaded: () => compatLoaded,
     getCacheSize: () => cache.size,
     getInsertedRuleCount: () => insertedRules.size
@@ -4207,10 +4173,13 @@ function windrunner(options = {}) {
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   compileClass,
+  compileCriticalCss,
   createWindrunner,
   defineResponsiveUtilities,
   defineUtilities,
+  extractClassNames,
   parseClass,
   plugin,
   windrunner
 });
+//# sourceMappingURL=index.js.map