chaincss 2.1.2 → 2.1.4

package/dist/cli/index.js

@@ -1407,6 +1407,9 @@ ${rules}}
 });
 
 // src/compiler/prefixer.ts
+function __import__(name) {
+  return new Function("name", "return import(name)")(name);
+}
 async function loadPostcss() {
   if (postcss) return postcss;
   if (loadingPromises.has("postcss")) return loadingPromises.get("postcss");
@@ -1433,7 +1436,7 @@ async function loadAutoprefixer() {
   const promise = (async () => {
     if (!autoprefixerLoaded) {
       try {
-        const module = await import("autoprefixer");
+        const module = __import__("autoprefixer");
         autoprefixer = module.default || module;
       } catch (err) {
         if (process.env.DEBUG) {

package/dist/compiler/index.js

@@ -3980,6 +3980,9 @@ ${rules}}
 
 // src/compiler/prefixer.ts
 var postcss = null;
+function __import__(name) {
+  return new Function("name", "return import(name)")(name);
+}
 var autoprefixer = null;
 var postcssLoaded = false;
 var autoprefixerLoaded = false;
@@ -4010,7 +4013,7 @@ async function loadAutoprefixer() {
   const promise = (async () => {
     if (!autoprefixerLoaded) {
       try {
-        const module = await import("autoprefixer");
+        const module = __import__("autoprefixer");
         autoprefixer = module.default || module;
       } catch (err) {
         if (process.env.DEBUG) {

package/dist/index.d.ts

@@ -38,7 +38,6 @@ export type { ChainCSSConfig, CompileResult, ChainCSSPlugin } from './core/types
 export type { Chain } from './compiler/Chain.js';
 export type { AnimationConfig, KeyframeDefinition } from './compiler/animations.js';
 export type { BreakpointsMap, ResponsiveStyle } from './compiler/breakpoints.js';
-export * from './runtime/index.js';
 export declare const VERSION = "3.0.0";
 import { chain } from './compiler/Chain.js';
 export default chain;

package/dist/index.js

@@ -2046,8 +2046,8 @@ var helpers = {
   rgba: (r, g, b, a = 1) => {
     return `rgba(${r}, ${g}, ${b}, ${a})`;
   },
-  hsla: (h2, s, l, a = 1) => {
-    return `hsla(${h2}, ${s}%, ${l}%, ${a})`;
+  hsla: (h, s, l, a = 1) => {
+    return `hsla(${h}, ${s}%, ${l}%, ${a})`;
   },
   // String helpers
   url: (path6) => {
@@ -2655,18 +2655,6 @@ var chain = (useTokens = true) => createChain(useTokens);
 var debugMode2 = false;
 var runtimeMacros = { ...macros };
 var globalManifest = {};
-var setManifest = (manifest) => {
-  if (manifest.atomicMap) {
-    globalManifest = manifest.atomicMap;
-  } else if (manifest.atomicClasses) {
-    globalManifest = manifest.atomicClasses;
-  } else {
-    globalManifest = manifest || {};
-  }
-  if (debugMode2) {
-    console.log("[ChainCSS] Manifest loaded with", Object.keys(globalManifest).length, "entries");
-  }
-};
 var RuntimeChain = class _RuntimeChain {
   constructor(useTokens = false) {
     this.useTokens = useTokens;
@@ -2808,7 +2796,6 @@ var RuntimeChain = class _RuntimeChain {
     return { ...this.catcher };
   }
 };
-var $t = () => new RuntimeChain(true).proxy;
 
 // src/core/auto-detector.ts
 var AutoDetector = class _AutoDetector {
@@ -3364,43 +3351,7 @@ ${rules}}
   }
 };
 var styleInjector = new StyleInjector();
-var setTokens = (t) => styleInjector.setTokens(t);
 var compileRuntime = (s, moduleId) => styleInjector.injectMultiple(s, moduleId);
-var removeRuntimeModule = (moduleId) => styleInjector.removeModule(moduleId);
-function runRuntime(...styles) {
-  let css = "";
-  for (const style of styles) {
-    if (style.selectors && style.selectors.length > 0) {
-      const combinedSelector = style.selectors.join(", ");
-      const mainBody = processStyleObject(style, styleInjector["tokenStore"], { useTokens: true, debug: false });
-      if (mainBody && Object.keys(mainBody).length > 0) {
-        let rules = "";
-        for (const [prop, val] of Object.entries(mainBody)) {
-          rules += `  ${prop}: ${val};
-`;
-        }
-        css += `${combinedSelector} {
-${rules}}
-`;
-      }
-      if (style.hover) {
-        const hoverBody = processStyleObject(style.hover, styleInjector["tokenStore"], { useTokens: true, debug: false });
-        if (hoverBody && Object.keys(hoverBody).length > 0) {
-          let rules = "";
-          for (const [prop, val] of Object.entries(hoverBody)) {
-            rules += `  ${prop}: ${val};
-`;
-          }
-          css += `${combinedSelector}:hover {
-${rules}}
-`;
-        }
-      }
-    }
-  }
-  styleInjector.writeToDOM(css);
-  return css;
-}
 
 // src/runtime/auto-hooks.tsx
 function useSmartStyles(styleBuilder, deps = [], options = {}) {
@@ -3454,8 +3405,8 @@ function useSmartStyles(styleBuilder, deps = [], options = {}) {
 }
 function createSmartComponent(Component, baseStyles) {
   const SmartComponent = (props) => {
-    const styles = useSmartStyles((chain3) => {
-      let instance = chain3();
+    const styles = useSmartStyles((chain2) => {
+      let instance = chain2();
       if (baseStyles) {
         instance = baseStyles(instance);
       }
@@ -4989,6 +4940,9 @@ ${rules}}
 
 // src/compiler/prefixer.ts
 var postcss = null;
+function __import__(name) {
+  return new Function("name", "return import(name)")(name);
+}
 var autoprefixer = null;
 var postcssLoaded = false;
 var autoprefixerLoaded = false;
@@ -4999,8 +4953,8 @@ async function loadPostcss() {
   const promise = (async () => {
     if (!postcssLoaded) {
       try {
-        const module2 = await import("postcss");
-        postcss = module2.default || module2;
+        const module = await import("postcss");
+        postcss = module.default || module;
       } catch (err) {
         if (process.env.DEBUG) {
           console.warn("postcss not installed, using lightweight prefixing");
@@ -5019,8 +4973,8 @@ async function loadAutoprefixer() {
   const promise = (async () => {
     if (!autoprefixerLoaded) {
       try {
-        const module2 = await import("autoprefixer");
-        autoprefixer = module2.default || module2;
+        const module = __import__("autoprefixer");
+        autoprefixer = module.default || module;
       } catch (err) {
         if (process.env.DEBUG) {
           console.warn("autoprefixer not installed");
@@ -5868,9 +5822,9 @@ var CacheManager = class {
     if (cached !== void 0) {
       return cached;
     }
-    const computed2 = await compute();
-    this.set(key, computed2, ttl);
-    return computed2;
+    const computed = await compute();
+    this.set(key, computed, ttl);
+    return computed;
   }
 };
 
@@ -6988,490 +6942,6 @@ function createTheme(contract, themeValues) {
   return new Theme(tokens3);
 }
 
-// src/runtime/react.tsx
-import React2, { useMemo, useRef as useRef2, useState as useState2, useEffect as useEffect2 } from "react";
-import { Fragment, jsx } from "react/jsx-runtime";
-function hashStyleObject(obj) {
-  const str = JSON.stringify(obj);
-  let hash = 0;
-  for (let i = 0; i < str.length; i++) {
-    const char = str.charCodeAt(i);
-    hash = (hash << 5) - hash + char;
-    hash = hash & hash;
-  }
-  return Math.abs(hash).toString(36);
-}
-function useChainStyles(styles, deps = [], options = {}) {
-  const { namespace = "c", debug = false, ssr = false } = options;
-  const instanceId = useRef2(Math.random().toString(36).substring(2, 7));
-  const moduleId = useRef2(`chaincss-module-${instanceId.current}`);
-  const [forceUpdate, setForceUpdate] = useState2(0);
-  useEffect2(() => {
-    return () => {
-      if (!ssr && moduleId.current) {
-        removeRuntimeModule(moduleId.current);
-        if (debug) {
-          console.log(`[ChainCSS] Cleaned up module: ${moduleId.current}`);
-        }
-      }
-    };
-  }, [ssr]);
-  return useMemo(() => {
-    const finalClassMap = {};
-    const injectionBundle = {};
-    for (const [key, styleDef] of Object.entries(styles)) {
-      let styleObject = {};
-      if (styleDef && typeof styleDef.$el === "function") {
-        styleObject = styleDef.$el();
-        if (debug) {
-          console.log(`[ChainCSS] Processing style: ${key}`, styleObject);
-        }
-      } else if (styleDef && typeof styleDef === "object") {
-        styleObject = { ...styleDef };
-      }
-      const staticClasses = Array.isArray(styleObject._classes) ? styleObject._classes : [];
-      const internalKeys = ["catcher", "proxy", "useTokens", "componentName", "_isChain", "_classes", "_name"];
-      internalKeys.forEach((k) => delete styleObject[k]);
-      const hash = hashStyleObject(styleObject);
-      const dynamicClassName = `${namespace}-${key}-${hash}`;
-      const hasStyles = Object.keys(styleObject).length > 0;
-      if (!ssr && hasStyles) {
-        injectionBundle[dynamicClassName] = styleObject;
-      }
-      const classParts = [...staticClasses];
-      if (hasStyles) {
-        classParts.push(dynamicClassName);
-      }
-      finalClassMap[key] = classParts.join(" ").trim();
-    }
-    if (!ssr && Object.keys(injectionBundle).length > 0) {
-      compileRuntime(injectionBundle, moduleId.current);
-      if (debug) {
-        console.log(`[ChainCSS] Injected ${Object.keys(injectionBundle).length} styles for module ${moduleId.current}`);
-      }
-    }
-    return finalClassMap;
-  }, [forceUpdate, ...deps]);
-}
-function useDynamicChainStyles(styleFactory, deps = [], options) {
-  const styles = useMemo(() => styleFactory(), deps);
-  return useChainStyles(styles, deps, options);
-}
-function useThemeChainStyles(styles, theme, options) {
-  const themedStyles = useMemo(() => {
-    if (typeof styles === "function") return styles(theme);
-    return styles;
-  }, [styles, theme]);
-  return useChainStyles(themedStyles, [theme], options);
-}
-function ChainCSSGlobal({ styles, tokens: tokens3, children }) {
-  if (tokens3) {
-    setTokens(tokens3);
-  }
-  if (styles) {
-    useChainStyles(styles, [], { watch: true });
-  }
-  return /* @__PURE__ */ jsx(Fragment, { children });
-}
-function cx(...classes) {
-  const result = [];
-  for (const cls of classes) {
-    if (!cls) continue;
-    if (typeof cls === "string") {
-      result.push(cls);
-    } else if (typeof cls === "object") {
-      for (const [key, value] of Object.entries(cls)) {
-        if (value) result.push(key);
-      }
-    }
-  }
-  return result.join(" ");
-}
-function withChainStyles(styles, options) {
-  return function WrappedComponent(props) {
-    const styleProps = typeof styles === "function" ? styles(props) : styles;
-    const classNames = useChainStyles(styleProps, [], options);
-    const Component = props.component || props.wrappedComponent;
-    return /* @__PURE__ */ jsx(Component, { ...props, chainStyles: classNames });
-  };
-}
-function createStyledComponent(elementType, styles, options) {
-  const StyledComponent = (props) => {
-    const { className: additionalClassName, ...rest } = props;
-    const styleDef = typeof styles === "function" ? styles() : styles;
-    const classNames = useChainStyles({ root: styleDef }, [], options);
-    const combinedClassName = cx(classNames.root, additionalClassName);
-    return React2.createElement(elementType, {
-      ...rest,
-      className: combinedClassName
-    });
-  };
-  const displayName = typeof elementType === "string" ? elementType : elementType.displayName || "Component";
-  StyledComponent.displayName = `ChainCSS.${displayName}`;
-  return StyledComponent;
-}
-function useComputedStyles(styles, props, deps = [], options) {
-  const computedStyles = useMemo(() => styles(props), [props, ...deps]);
-  return useChainStyles(computedStyles, deps, options);
-}
-var debugEnabled = false;
-function enableChainCSSDebug() {
-  debugEnabled = true;
-  if (typeof window !== "undefined") {
-    window.__CHAINCSS_DEBUG__ = true;
-    console.log("\u{1F50D} ChainCSS Debug Mode Enabled");
-  }
-}
-function disableChainCSSDebug() {
-  debugEnabled = false;
-  if (typeof window !== "undefined") {
-    window.__CHAINCSS_DEBUG__ = false;
-    console.log("\u{1F50D} ChainCSS Debug Mode Disabled");
-  }
-}
-function isDebugEnabled() {
-  return debugEnabled || typeof window !== "undefined" && window.__CHAINCSS_DEBUG__;
-}
-
-// src/runtime/vue.ts
-import { ref, computed, watch, onUnmounted, inject, provide, h } from "vue";
-var CHAIN_CSS_KEY = /* @__PURE__ */ Symbol("chaincss");
-function useAtomicClasses(styles, options = {}) {
-  const { atomic = true, global = false, debug = false } = options;
-  const id = `chain-${Math.random().toString(36).substring(2, 11)}`;
-  const moduleId = `chaincss-vue-module-${id}`;
-  const classMap = ref({});
-  onUnmounted(() => {
-    removeRuntimeModule(moduleId);
-    if (debug) {
-      console.log(`[ChainCSS Vue] Cleaned up module: ${moduleId}`);
-    }
-  });
-  const compileStyles = () => {
-    const resolvedStyles = typeof styles === "function" ? styles() : styles?.value || styles;
-    if (!resolvedStyles) return {};
-    const compiledStyles = {};
-    const classNames = {};
-    for (const [key, styleDef] of Object.entries(resolvedStyles)) {
-      const className = `${key}-${id}`;
-      const styleObj = typeof styleDef === "function" ? styleDef() : styleDef;
-      classNames[key] = className;
-      compiledStyles[`${key}_${id}`] = {
-        selectors: [`.${className}`],
-        ...styleObj
-      };
-    }
-    const result = compileRuntime(compiledStyles, moduleId);
-    if (debug) {
-      console.log(`[ChainCSS Vue] Compiled ${Object.keys(classNames).length} styles for module ${moduleId}`);
-    }
-    classMap.value = classNames;
-    return result;
-  };
-  if (typeof styles === "object" && styles !== null && "value" in styles) {
-    watch(styles, () => {
-      compileStyles();
-    }, { deep: true });
-  }
-  compileStyles();
-  return {
-    classes: computed(() => classMap.value),
-    cx: (name) => classMap.value[name] || "",
-    cn: (...names) => names.map((name) => classMap.value[name]).filter(Boolean).join(" "),
-    inject: (newStyles) => {
-      const injectedId = `chaincss-injected-${Date.now()}`;
-      compileRuntime(newStyles, injectedId);
-      if (debug) {
-        console.log(`[ChainCSS Vue] Injected additional styles: ${injectedId}`);
-      }
-    }
-  };
-}
-var ChainCSSGlobal2 = {
-  name: "ChainCSSGlobal",
-  props: {
-    styles: {
-      type: Object,
-      required: false,
-      default: () => ({})
-    },
-    tokens: {
-      type: Object,
-      required: false,
-      default: () => ({})
-    },
-    debug: {
-      type: Boolean,
-      default: false
-    }
-  },
-  setup(props) {
-    if (props.tokens && Object.keys(props.tokens).length > 0) {
-      styleInjector.setTokens(props.tokens);
-    }
-    if (props.styles && Object.keys(props.styles).length > 0) {
-      useAtomicClasses(props.styles, { debug: props.debug });
-    }
-    return () => null;
-  }
-};
-function createStyledComponent2(styles, tag = "div", options = {}) {
-  return {
-    name: "ChainCSSStyledComponent",
-    props: {
-      className: { type: String, default: "" },
-      as: { type: String, default: tag }
-    },
-    setup(props, { slots, attrs }) {
-      const resolvedStyles = typeof styles === "function" ? styles() : styles;
-      const { classes } = useAtomicClasses({ root: resolvedStyles }, options);
-      const combinedClass = computed(() => {
-        const rootClass = classes.value?.root || "";
-        return [rootClass, props.className].filter(Boolean).join(" ");
-      });
-      return () => {
-        return h(props.as || tag, {
-          class: combinedClass.value,
-          ...attrs
-        }, slots.default?.());
-      };
-    }
-  };
-}
-function createStyledComponents(components, options) {
-  const result = {};
-  for (const [name, config] of Object.entries(components)) {
-    const { element = "div", styles } = config;
-    result[name] = createStyledComponent2(styles, element, options);
-  }
-  return result;
-}
-function useComputedStyles2(styles, props, options) {
-  const computedStyles = computed(() => ({ root: styles(props) }));
-  const { classes } = useAtomicClasses(computedStyles, options);
-  return {
-    classes,
-    rootClass: computed(() => classes.value?.root || "")
-  };
-}
-function provideStyleContext(theme) {
-  const themeRef = ref(theme);
-  provide(CHAIN_CSS_KEY, themeRef);
-  return themeRef;
-}
-function injectStyleContext() {
-  return inject(CHAIN_CSS_KEY, ref({}));
-}
-
-// src/runtime/svelte.ts
-function useAtomicClasses2() {
-  return { subscribe: () => {
-  }, get: () => ({}) };
-}
-function cx2(...args) {
-  return args.filter(Boolean).join(" ");
-}
-function ChainCSSGlobal3() {
-  return null;
-}
-function createStyledComponent3() {
-  return () => null;
-}
-function createStyledComponents2() {
-  return {};
-}
-function useComputedStyles3() {
-  return { subscribe: () => {
-  }, get: () => "" };
-}
-function provideStyleContext2() {
-}
-function injectStyleContext2() {
-  return {};
-}
-function chainStyles() {
-  return {};
-}
-
-// src/runtime/hmr.ts
-function getHMREnvironment() {
-  if (typeof window === "undefined") return "none";
-  if (typeof import.meta !== "undefined" && import.meta.hot) {
-    return "vite";
-  }
-  if (module.hot) {
-    return "webpack";
-  }
-  return "none";
-}
-function setupHMR() {
-  const env = getHMREnvironment();
-  if (env === "vite") {
-    setupViteHMR();
-  } else if (env === "webpack") {
-    setupWebpackHMR();
-  }
-}
-function setupViteHMR() {
-  if (typeof window === "undefined") return;
-  const hot = import.meta.hot;
-  if (!hot) return;
-  hot.on("chaincss:update", (payload) => {
-    console.log(`[ChainCSS HMR] \u{1F504} Updating styles for ${payload.file}`);
-    if (payload.css) {
-      const styleId = "chaincss-hmr-styles";
-      let styleElement = document.getElementById(styleId);
-      if (!styleElement) {
-        styleElement = document.createElement("style");
-        styleElement.id = styleId;
-        styleElement.setAttribute("data-chaincss", "hmr");
-        document.head.appendChild(styleElement);
-      }
-      styleElement.textContent = payload.css;
-      console.log(`[ChainCSS HMR] \u2705 Injected ${payload.css.length} bytes of CSS`);
-    }
-    if (payload.map) {
-      if (typeof window !== "undefined") {
-        window.__CHAINCSS_MANIFEST__ = payload.map;
-      }
-      console.log(`[ChainCSS HMR] \u2705 Updated manifest with ${Object.keys(payload.map).length} entries`);
-    }
-    if (payload.styles) {
-      const moduleId = `hmr-${payload.file}-${payload.timestamp || Date.now()}`;
-      const result = compileRuntime(payload.styles, moduleId);
-      console.log(`[ChainCSS HMR] \u2705 Recompiled ${Object.keys(result).length} styles`);
-    }
-  });
-  hot.on("vite:beforeUpdate", () => {
-    console.log("[ChainCSS HMR] \u{1F9F9} Clearing runtime styles before update");
-    styleInjector.removeAll();
-  });
-  console.log("[ChainCSS HMR] \u2705 Vite HMR setup complete");
-}
-function setupWebpackHMR() {
-  if (typeof window === "undefined") return;
-  const hot = module.hot;
-  if (!hot) return;
-  hot.accept((err) => {
-    if (err) {
-      console.error("[ChainCSS HMR] \u274C Update failed:", err);
-      return;
-    }
-    console.log("[ChainCSS HMR] \u{1F504} Webpack HMR update");
-    styleInjector.removeAll();
-  });
-  hot.dispose(() => {
-    console.log("[ChainCSS HMR] \u{1F9F9} Cleaning up styles");
-    styleInjector.removeAll();
-  });
-  console.log("[ChainCSS HMR] \u2705 Webpack HMR setup complete");
-}
-function registerForHMR(moduleId, styles, callback) {
-  const env = getHMREnvironment();
-  if (env === "vite") {
-    registerViteHMR(moduleId, styles, callback);
-  } else if (env === "webpack") {
-    registerWebpackHMR(moduleId, styles, callback);
-  }
-}
-function registerViteHMR(moduleId, styles, callback) {
-  const hot = import.meta.hot;
-  if (!hot) return;
-  hot.accept(() => {
-    console.log(`[ChainCSS HMR] \u{1F504} Accepting update for ${moduleId}`);
-    styleInjector.removeModule(moduleId);
-    if (callback && styles) {
-      callback(styles);
-    }
-  });
-  hot.dispose(() => {
-    console.log(`[ChainCSS HMR] \u{1F9F9} Disposing module: ${moduleId}`);
-    styleInjector.removeModule(moduleId);
-  });
-}
-function registerWebpackHMR(moduleId, styles, callback) {
-  const hot = module.hot;
-  if (!hot) return;
-  hot.accept(() => {
-    console.log(`[ChainCSS HMR] \u{1F504} Webpack HMR accept for ${moduleId}`);
-    if (callback && styles) {
-      callback(styles);
-    }
-  });
-  hot.dispose(() => {
-    console.log(`[ChainCSS HMR] \u{1F9F9} Webpack HMR dispose for ${moduleId}`);
-    styleInjector.removeModule(moduleId);
-  });
-}
-if (typeof window !== "undefined") {
-  setupHMR();
-}
-
-// src/runtime/utils.ts
-function generateStyleId(prefix = "chain") {
-  const random = Math.random().toString(36).substring(2, 10);
-  const timestamp = Date.now().toString(36);
-  return `${prefix}-${timestamp}-${random}`;
-}
-function hashString2(str) {
-  let hash = 0;
-  for (let i = 0; i < str.length; i++) {
-    hash = (hash << 5) - hash + str.charCodeAt(i);
-    hash |= 0;
-  }
-  return Math.abs(hash).toString(36);
-}
-function kebabCase2(str) {
-  return str.replace(/([A-Z])/g, "-$1").toLowerCase();
-}
-var isBrowser = typeof window !== "undefined" && typeof document !== "undefined";
-var isDevelopment = process.env.NODE_ENV === "development";
-var isProduction = process.env.NODE_ENV === "production";
-function debounce(fn, delay) {
-  let timeoutId;
-  return (...args) => {
-    clearTimeout(timeoutId);
-    timeoutId = setTimeout(() => fn(...args), delay);
-  };
-}
-function memoize(fn) {
-  const cache = /* @__PURE__ */ new Map();
-  const memoized = ((...args) => {
-    const key = JSON.stringify(args);
-    if (cache.has(key)) {
-      return cache.get(key);
-    }
-    const result = fn(...args);
-    cache.set(key, result);
-    return result;
-  });
-  memoized.cache = cache;
-  return memoized;
-}
-function cn(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-function devWarn(message, ...args) {
-  if (isDevelopment) {
-    console.warn(`[ChainCSS] ${message}`, ...args);
-  }
-}
-function devLog(message, ...args) {
-  if (isDevelopment) {
-    console.log(`[ChainCSS] ${message}`, ...args);
-  }
-}
-function logError(message, error) {
-  console.error(`[ChainCSS] ${message}`, error || "");
-}
-function createDebugger(module2) {
-  return {
-    log: (...args) => devLog(`[${module2}]`, ...args),
-    warn: (...args) => devWarn(`[${module2}]`, ...args),
-    error: (...args) => logError(`[${module2}]`, ...args)
-  };
-}
-
 // src/index.ts
 var VERSION2 = "3.0.0";
 var index_default = chain;
@@ -7484,14 +6954,10 @@ if (typeof process !== "undefined" && process.env?.NODE_ENV !== "test") {
 }
 export {
   chain as $,
-  $t,
   AtomicOptimizer,
   AutoDetector,
   CacheManager,
   ChainCSSCompiler,
-  ChainCSSGlobal,
-  ChainCSSGlobal3 as ChainCSSGlobalSvelte,
-  ChainCSSGlobal2 as ChainCSSGlobalVue,
   ChainCSSPrefixer,
   DesignTokens,
   PersistentCache,
@@ -7501,38 +6967,21 @@ export {
   autoDetector,
   buildChain,
   chain,
-  chainStyles,
   smartChain as chainV3,
   clearTimeline,
-  cn as cnUtils,
-  compileRuntime as compile,
   compileChainCSS,
   configureAtomic,
   createAnimation,
-  createDebugger,
   createTokens as createDesignTokens,
   createSmartComponent,
-  createStyledComponent,
-  createStyledComponent3 as createStyledSvelteComponent,
-  createStyledComponents2 as createStyledSvelteComponents,
-  createStyledComponent2 as createStyledVueComponent,
-  createStyledComponents as createStyledVueComponents,
   createTheme,
   createThemeContract,
   createTokens2 as createTokens,
-  cx,
-  cx2 as cxSvelte,
-  debounce,
   index_default as default,
-  devLog,
-  devWarn,
-  disableChainCSSDebug,
-  enableChainCSSDebug,
   enableDebug,
   enableTimeline,
   expandShorthand,
   exportTimeline,
-  generateStyleId,
   getAnimationPreset,
   getAnimationPresetNames,
   getAvailableShorthands,
@@ -7545,42 +6994,16 @@ export {
   getSuggestions,
   handleShorthand,
   hasAnimationPreset,
-  hashString2 as hashString,
   helpers,
-  injectStyleContext,
-  injectStyleContext2 as injectStyleContextSvelte,
-  isBrowser,
-  isDebugEnabled,
-  isDevelopment,
-  isProduction,
   isShorthand,
-  kebabCase2 as kebabCase,
-  logError,
   macros,
-  memoize,
-  provideStyleContext,
-  provideStyleContext2 as provideStyleContextSvelte,
   recipe,
-  registerForHMR,
-  runRuntime as run,
   runtimeChain,
   setBreakpoints,
-  setManifest,
-  setupHMR,
   shorthandMap,
   smartChain,
-  styleInjector,
   tokens2 as tokens,
-  useAtomicClasses,
-  useAtomicClasses2 as useAtomicClassesSvelte,
-  useChainStyles,
-  useComputedStyles,
-  useComputedStyles3 as useComputedStylesSvelte,
-  useComputedStyles2 as useComputedStylesVue,
-  useDynamicChainStyles,
   useSmartStyles,
-  useThemeChainStyles,
   validateTheme,
-  withChainStyles,
   withSmartStyles
 };

package/dist/plugins/vite.js

@@ -1357,6 +1357,9 @@ ${rules}}
 
 // src/compiler/prefixer.ts
 var postcss = null;
+function __import__(name) {
+  return new Function("name", "return import(name)")(name);
+}
 var autoprefixer = null;
 var postcssLoaded = false;
 var autoprefixerLoaded = false;
@@ -1387,7 +1390,7 @@ async function loadAutoprefixer() {
   const promise = (async () => {
     if (!autoprefixerLoaded) {
       try {
-        const module = await import("autoprefixer");
+        const module = __import__("autoprefixer");
         autoprefixer = module.default || module;
       } catch (err) {
         if (process.env.DEBUG) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chaincss",
-  "version": "2.1.2",
+  "version": "2.1.4",
   "description": "ChainCSS v3.0 - The first CSS-in-JS library with true auto-detection mixed mode. Zero runtime by default, dynamic when you need it.",
   "type": "module",
   "main": "./dist/index.js",

package/src/compiler/prefixer.ts

@@ -23,6 +23,12 @@ type Autoprefixer = any;
 
 // Declare variables for optional dependencies (initially null)
 let postcss: PostCSS | null = null;
+
+// Helper to load optional deps without Vite static analysis
+function __import__(name: string): Promise<any> {
+  return new Function("name", "return import(name)")(name);
+}
+
 let browserslist: Browserslist | null = null;
 let caniuse: any = null;
 let autoprefixer: Autoprefixer | null = null;
@@ -65,8 +71,8 @@ async function loadBrowserslist() {
   const promise = (async () => {
     if (!browserslistLoaded) {
       try {
-        const module = await import(/* @vite-ignore */ 'browserslist');
-        browserslist = module.default || module;
+        const module = __import__('browserslist');
+        browserslist = (module as any).default || module;
       } catch (err) {
         browserslist = null;
       }
@@ -109,8 +115,8 @@ async function loadAutoprefixer() {
     if (!autoprefixerLoaded) {
       try {
         // @ts-ignore - autoprefixer is optional
-        const module = await import('autoprefixer');
-        autoprefixer = module.default || module;
+        const module = __import__('autoprefixer');
+        autoprefixer = (module as any).default || module;
       } catch (err) {
         if (process.env.DEBUG) {
           console.warn('autoprefixer not installed');

package/src/index.ts

@@ -153,7 +153,8 @@ export type { BreakpointsMap, ResponsiveStyle } from './compiler/breakpoints.js'
 // ============================================================================
 // Runtime Exports (for runtime mode) - unchanged
 // ============================================================================
-export * from './runtime/index.js';
+// Runtime available via separate import: "chaincss/runtime"
+// export * from './runtime/index.js';
 
 // ============================================================================
 // Version - UPDATE to 3.0.0