@kbach/react 0.5.47 → 0.5.48

package/dist/jsx-runtime.js

@@ -33,7 +33,8 @@ __export(jsx_runtime_exports, {
   Fragment: () => import_react5.Fragment,
   _invalidateDefaultFontCache: () => _invalidateDefaultFontCache,
   jsx: () => jsx,
-  jsxs: () => jsxs
+  jsxs: () => jsxs,
+  registerWebElement: () => registerWebElement
 });
 module.exports = __toCommonJS(jsx_runtime_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
@@ -787,7 +788,12 @@ function resolveColor(value, colors, isArbitrary) {
     }
   }
   if (!hex) return null;
-  if (!opacityPart) return hex;
+  if (!opacityPart) {
+    if (!isWeb && hex.startsWith("#") && hex.length === 9) {
+      return hexToRgba(hex, Math.round(parseInt(hex.slice(7, 9), 16) / 255 * 1e3) / 1e3);
+    }
+    return hex;
+  }
   let alpha;
   if (opacityPart.startsWith("[") && opacityPart.endsWith("]")) {
     const v = parseFloat(opacityPart.slice(1, -1));
@@ -2350,12 +2356,6 @@ var RESOLVERS = {
 function resolveUtility(parsed, theme) {
   if (!parsed.value) {
     if (parsed.utility in PLUGIN_STANDALONE) return PLUGIN_STANDALONE[parsed.utility] ?? null;
-    if (parsed.utility === "grd" || parsed.utility === "grid") {
-      return getEffectiveIsWeb() ? { display: "grid" } : null;
-    }
-    if (parsed.utility === "inline-grid") {
-      return getEffectiveIsWeb() ? { display: "inline-grid" } : null;
-    }
     if (parsed.utility in getStandalone()) return getStandalone()[parsed.utility] ?? null;
   }
   const resolver = PLUGIN_RESOLVERS[parsed.utility] ?? RESOLVERS[parsed.utility];
@@ -2940,6 +2940,8 @@ function buildConfig(userConfig) {
   };
   clearPluginUtilities();
   clearPluginModifiers();
+  const _store = getConfigStore();
+  for (const k of Object.keys(_store.customVariants)) delete _store.customVariants[k];
   const pluginAPI = makePluginAPI(resolved.theme);
   for (const plugin of resolved.plugins) {
     plugin(pluginAPI);
@@ -3146,7 +3148,7 @@ var InteractiveWrapper = (0, import_react3.forwardRef)(
     const handleBlur = (0, import_react3.useCallback)(chain(onBlur, () => setFocused(false)), [onBlur]);
     const computedStyle = (0, import_react3.useMemo)(
       () => {
-        const s = flatten(resolvedStyle, isDark, { pressed, hover: hovered, focus: focused }, breakpoints);
+        const s = flatten(resolvedStyle, isDark, { pressed, hover: hovered, focus: focused, disabled: !!rest.disabled, checked: !!rest.checked }, breakpoints);
         delete s.__divideX;
         delete s.__divideY;
         delete s.__divideColor;
@@ -3180,8 +3182,8 @@ var InteractiveWrapper = (0, import_react3.forwardRef)(
       [resolvedStyle, isDark, pressed, hovered, focused, width]
       // eslint-disable-line react-hooks/exhaustive-deps
     );
-    const isWebHTMLElement = !isNative && typeof Component === "string";
-    const finalStyle = isWebHTMLElement ? styleProp ?? void 0 : styleProp ? Array.isArray(styleProp) ? Object.assign({}, computedStyle, ...styleProp) : { ...computedStyle, ...styleProp } : computedStyle;
+    const skipComputedInline = isWeb || !isNative && typeof Component === "string";
+    const finalStyle = skipComputedInline ? styleProp ?? void 0 : styleProp ? Array.isArray(styleProp) ? Object.assign({}, computedStyle, ...styleProp) : { ...computedStyle, ...styleProp } : computedStyle;
     const { children, ...restWithoutChildren } = rest;
     const componentProps = {
       ref,
@@ -3209,11 +3211,15 @@ var DarkWrapper = import_react4.default.forwardRef(
     const needsWidth = hasResponsiveBuckets(resolvedStyle);
     const width = useConditionalWidth(needsWidth);
     const breakpoints = needsWidth ? getActiveBreakpoints(width) : EMPTY_BREAKPOINTS2;
-    const computedStyle = flatten(resolvedStyle, isDark, {}, breakpoints);
-    stripInternalMarkers(computedStyle);
-    if (typeof Component !== "string") stripWebOnlyProps(computedStyle);
-    const isWebHTMLElement = !isNative && typeof Component === "string";
-    const finalStyle = isWebHTMLElement ? styleProp ?? void 0 : styleProp ? Array.isArray(styleProp) ? Object.assign({}, computedStyle, ...styleProp) : { ...computedStyle, ...styleProp } : computedStyle;
+    const isNonStringComponent = typeof Component !== "string";
+    const computedStyle = (0, import_react4.useMemo)(() => {
+      const s = flatten(resolvedStyle, isDark, {}, breakpoints);
+      stripInternalMarkers(s);
+      if (isNonStringComponent) stripWebOnlyProps(s);
+      return s;
+    }, [resolvedStyle, isDark, width, isNonStringComponent]);
+    const skipComputedInline = isWeb || !isNative && typeof Component === "string";
+    const finalStyle = skipComputedInline ? styleProp ?? void 0 : styleProp ? Array.isArray(styleProp) ? Object.assign({}, computedStyle, ...styleProp) : { ...computedStyle, ...styleProp } : computedStyle;
     const props = { ref, ...rest, style: finalStyle };
     return Array.isArray(children) ? import_react4.default.createElement(Component, props, ...children) : import_react4.default.createElement(Component, props, children);
   }
@@ -3331,14 +3337,101 @@ function stripWebOnlyInlineProps(s) {
     delete s.position;
   }
 }
+var _rnToHtml = {
+  View: "div",
+  SafeAreaView: "div",
+  KeyboardAvoidingView: "div",
+  ScrollView: "div",
+  VirtualizedList: "div",
+  Text: "span",
+  Pressable: "div",
+  TouchableOpacity: "div",
+  TouchableHighlight: "div",
+  TouchableWithoutFeedback: "div",
+  TouchableNativeFeedback: "div"
+};
+var _userWebTypeMap = /* @__PURE__ */ new Map();
+var _webTypeCache = /* @__PURE__ */ new WeakMap();
+function registerWebElement(rnComponent, htmlTag) {
+  if (typeof rnComponent !== "object" && typeof rnComponent !== "function") return;
+  _userWebTypeMap.set(rnComponent, htmlTag);
+  _webTypeCache.delete(rnComponent);
+}
+function getWebTag(type) {
+  if (typeof type === "string") return null;
+  if (type === null || typeof type !== "function" && typeof type !== "object") return null;
+  const obj = type;
+  if (_userWebTypeMap.has(obj)) return _userWebTypeMap.get(obj);
+  if (_webTypeCache.has(obj)) return _webTypeCache.get(obj);
+  const name = obj.displayName ?? obj.name;
+  const tag = name ? _rnToHtml[name] ?? null : null;
+  _webTypeCache.set(obj, tag);
+  return tag;
+}
+var _rnOnlyProps = /* @__PURE__ */ new Set([
+  "onLongPress",
+  "delayLongPress",
+  "activeOpacity",
+  "underlayColor",
+  "hitSlop",
+  "pressRetentionOffset",
+  "accessible",
+  "accessibilityState",
+  "accessibilityLiveRegion",
+  "importantForAccessibility",
+  "nativeID",
+  "collapsable",
+  "needsOffscreenAlphaCompositing",
+  "renderToHardwareTextureAndroid",
+  "shouldRasterizeIOS",
+  "pointerEvents"
+  // RN prop — values differ from HTML pointer-events CSS
+]);
+var _pressableDisplayNames = /* @__PURE__ */ new Set([
+  "Pressable",
+  "TouchableOpacity",
+  "TouchableHighlight",
+  "TouchableWithoutFeedback",
+  "TouchableNativeFeedback"
+]);
+function transformToWebProps(originalName, props) {
+  const out = {};
+  const isPressable = _pressableDisplayNames.has(originalName);
+  for (const [k, v] of Object.entries(props)) {
+    if (_rnOnlyProps.has(k)) continue;
+    if (k === "onPress") {
+      if (!("onClick" in props)) out.onClick = v;
+      continue;
+    }
+    if (k === "accessibilityLabel") {
+      if (out["aria-label"] == null) out["aria-label"] = v;
+      continue;
+    }
+    if (k === "accessibilityRole") {
+      if (out.role == null) out.role = v;
+      continue;
+    }
+    if (k === "testID") {
+      if (out["data-testid"] == null) out["data-testid"] = v;
+      continue;
+    }
+    out[k] = v;
+  }
+  if (isPressable && !out.role) out.role = "button";
+  return out;
+}
 function processElement(type, rawProps, key, isStaticChildren) {
   if (typeof type === "symbol") return makeElement(isStaticChildren, type, rawProps ?? {}, key);
-  if (!rawProps) return (0, import_jsx_runtime.jsx)(type, null, key);
-  const { className, kb: kbProp, __kbachStyles, __kbachClasses } = rawProps;
+  const webTag = isWeb ? getWebTag(type) : null;
+  const effectiveType = webTag ?? type;
+  const originalName = webTag ? type?.displayName ?? type?.name : void 0;
+  if (!rawProps) return (0, import_jsx_runtime.jsx)(effectiveType, null, key);
+  const workingProps = webTag && originalName ? transformToWebProps(originalName, rawProps) : rawProps;
+  const { className, kb: kbProp, __kbachStyles, __kbachClasses } = workingProps;
   const classStr = className ?? kbProp ?? __kbachClasses;
   if (!isNative && isRuntimeCSSDisabled() && classStr && !__kbachStyles) {
-    const { style: userStyle2, ...passProps2 } = omitConsumed(rawProps);
-    return makeElement(isStaticChildren, type, {
+    const { style: userStyle2, ...passProps2 } = omitConsumed(workingProps);
+    return makeElement(isStaticChildren, effectiveType, {
       ...passProps2,
       className: normalizeClassString(classStr),
       ...userStyle2 !== void 0 ? { style: userStyle2 } : {}
@@ -3346,18 +3439,18 @@ function processElement(type, rawProps, key, isStaticChildren) {
   }
   if (!classStr && !__kbachStyles) {
     const defaultFont = getCachedDefaultFont();
-    if (!defaultFont) return makeElement(isStaticChildren, type, rawProps, key);
-    const { style: userStyle2, ...passProps2 } = omitConsumed(rawProps);
+    if (!defaultFont) return makeElement(isStaticChildren, effectiveType, workingProps, key);
+    const { style: userStyle2, ...passProps2 } = omitConsumed(workingProps);
     const finalStyle2 = userStyle2 ? Array.isArray(userStyle2) ? { fontFamily: defaultFont, ...Object.assign({}, ...userStyle2) } : { fontFamily: defaultFont, ...userStyle2 } : { fontFamily: defaultFont };
-    return makeElement(isStaticChildren, type, { ...passProps2, style: finalStyle2 }, key);
+    return makeElement(isStaticChildren, effectiveType, { ...passProps2, style: finalStyle2 }, key);
   }
   const config = getConfig();
   const resolved = __kbachStyles ?? (classStr ? resolve(classStr, config.theme, config.darkMode) : {});
-  const { style: userStyle, ...passProps } = omitConsumed(rawProps);
+  const { style: userStyle, ...passProps } = omitConsumed(workingProps);
   const { interactive, modeOrResponsive } = bucketMods(resolved);
   if (interactive) {
     return (0, import_jsx_runtime.jsx)(InteractiveWrapper, {
-      Component: type,
+      Component: effectiveType,
       resolvedStyle: resolved,
       ...!isNative && classStr ? { className: normalizeClassString(classStr) } : {},
       style: userStyle,
@@ -3366,24 +3459,24 @@ function processElement(type, rawProps, key, isStaticChildren) {
   }
   if (modeOrResponsive) {
     return (0, import_jsx_runtime.jsx)(DarkWrapper, {
-      Component: type,
+      Component: effectiveType,
       resolvedStyle: resolved,
       ...!isNative && classStr ? { className: normalizeClassString(classStr) } : {},
       style: userStyle,
       ...passProps
     }, key);
   }
-  const isWebHTMLElement = !isNative && typeof type === "string";
+  const skipComputedInline = isWeb || !isNative && typeof effectiveType === "string";
   let finalStyle;
-  if (!isWebHTMLElement) {
+  if (!skipComputedInline) {
     const computedStyle = flatten(resolved, false);
     stripInternalMarkers2(computedStyle);
-    if (typeof type !== "string") stripWebOnlyInlineProps(computedStyle);
+    if (typeof effectiveType !== "string") stripWebOnlyInlineProps(computedStyle);
     finalStyle = mergeStyle(computedStyle, userStyle);
   } else {
     finalStyle = userStyle ?? void 0;
   }
-  return makeElement(isStaticChildren, type, {
+  return makeElement(isStaticChildren, effectiveType, {
     ...passProps,
     style: finalStyle,
     ...!isNative && classStr ? { className: normalizeClassString(classStr) } : {}
@@ -3400,5 +3493,6 @@ function jsxs(type, props, key) {
   Fragment,
   _invalidateDefaultFontCache,
   jsx,
-  jsxs
+  jsxs,
+  registerWebElement
 });

package/dist/jsx-runtime.mjs

@@ -2,13 +2,14 @@ import {
   Fragment,
   _invalidateDefaultFontCache,
   jsx,
-  jsxs
-} from "./chunk-LCK5OGHT.mjs";
-import "./chunk-U3GY5Y6J.mjs";
-import "./chunk-NIBECTRQ.mjs";
+  jsxs,
+  registerWebElement
+} from "./chunk-YZNSWFJT.mjs";
+import "./chunk-BKSXIWL7.mjs";
 export {
   Fragment,
   _invalidateDefaultFontCache,
   jsx,
-  jsxs
+  jsxs,
+  registerWebElement
 };

package/dist/vite-plugin.js

@@ -642,7 +642,12 @@ function resolveColor(value, colors, isArbitrary) {
     }
   }
   if (!hex) return null;
-  if (!opacityPart) return hex;
+  if (!opacityPart) {
+    if (!isWeb && hex.startsWith("#") && hex.length === 9) {
+      return hexToRgba(hex, Math.round(parseInt(hex.slice(7, 9), 16) / 255 * 1e3) / 1e3);
+    }
+    return hex;
+  }
   let alpha;
   if (opacityPart.startsWith("[") && opacityPart.endsWith("]")) {
     const v = parseFloat(opacityPart.slice(1, -1));
@@ -2205,12 +2210,6 @@ var RESOLVERS = {
 function resolveUtility(parsed, theme) {
   if (!parsed.value) {
     if (parsed.utility in PLUGIN_STANDALONE) return PLUGIN_STANDALONE[parsed.utility] ?? null;
-    if (parsed.utility === "grd" || parsed.utility === "grid") {
-      return getEffectiveIsWeb() ? { display: "grid" } : null;
-    }
-    if (parsed.utility === "inline-grid") {
-      return getEffectiveIsWeb() ? { display: "inline-grid" } : null;
-    }
     if (parsed.utility in getStandalone()) return getStandalone()[parsed.utility] ?? null;
   }
   const resolver = PLUGIN_RESOLVERS[parsed.utility] ?? RESOLVERS[parsed.utility];
@@ -2763,6 +2762,8 @@ function buildConfig(userConfig) {
   };
   clearPluginUtilities();
   clearPluginModifiers();
+  const _store = getConfigStore();
+  for (const k of Object.keys(_store.customVariants)) delete _store.customVariants[k];
   const pluginAPI = makePluginAPI(resolved.theme);
   for (const plugin of resolved.plugins) {
     plugin(pluginAPI);
@@ -3008,13 +3009,25 @@ function extractClassStrings(code) {
       i++;
     }
     jsxExprRe.lastIndex = i + 1;
-    const innerStrings = block.match(/["'`]([^"'`]{1,300})["'`]/g) ?? [];
+    const innerStrings = block.match(/["'`]([^"'`]{1,2000})["'`]/g) ?? [];
     for (const s of innerStrings) pushTokens(s.slice(1, -1), found);
   }
-  const clsxRe = /(?:clsx|cn|classnames|cx)\(([^)]{1,1000})\)/g;
-  while ((m = clsxRe.exec(code)) !== null) {
-    const block = m[1];
-    const innerStrings = block.match(/["'`]([^"'`]{1,300})["'`]/g) ?? [];
+  const clsxCallRe = /(?:clsx|cn|classnames|cx)\(/g;
+  while ((m = clsxCallRe.exec(code)) !== null) {
+    let depth = 1;
+    let i = m.index + m[0].length;
+    let block = "";
+    while (i < code.length && depth > 0) {
+      const ch = code[i];
+      if (ch === "(") depth++;
+      else if (ch === ")") {
+        if (--depth === 0) break;
+      }
+      block += ch;
+      i++;
+    }
+    clsxCallRe.lastIndex = i + 1;
+    const innerStrings = block.match(/["'`]([^"'`]{1,2000})["'`]/g) ?? [];
     for (const s of innerStrings) pushTokens(s.slice(1, -1), found);
   }
   const templateRe = /`([^`]{1,2000})`/g;
@@ -3064,12 +3077,10 @@ function kbach(userConfig) {
   function processFile(filePath, code) {
     const key = normPath(filePath);
     const tokens = /* @__PURE__ */ new Set();
-    for (const cls of extractClassStrings(code)) {
-      for (const tok of splitClassTokens(cls)) {
-        tokens.add(tok);
-        if (!tokenCSS.has(tok)) {
-          tokenCSS.set(tok, generateClassCSS(tok, cfg.theme, cfg.darkMode, screens));
-        }
+    for (const tok of extractClassStrings(code)) {
+      tokens.add(tok);
+      if (!tokenCSS.has(tok)) {
+        tokenCSS.set(tok, generateClassCSS(tok, cfg.theme, cfg.darkMode, screens));
       }
     }
     fileTokens.set(key, tokens);

package/dist/vite-plugin.mjs

@@ -4,7 +4,7 @@ import {
   generateClassCSS,
   setCSSGenMode,
   splitClassTokens
-} from "./chunk-NIBECTRQ.mjs";
+} from "./chunk-BKSXIWL7.mjs";
 
 // src/vite-plugin.ts
 import { readFileSync, writeFileSync, readdirSync, statSync } from "fs";
@@ -186,13 +186,25 @@ function extractClassStrings(code) {
       i++;
     }
     jsxExprRe.lastIndex = i + 1;
-    const innerStrings = block.match(/["'`]([^"'`]{1,300})["'`]/g) ?? [];
+    const innerStrings = block.match(/["'`]([^"'`]{1,2000})["'`]/g) ?? [];
     for (const s of innerStrings) pushTokens(s.slice(1, -1), found);
   }
-  const clsxRe = /(?:clsx|cn|classnames|cx)\(([^)]{1,1000})\)/g;
-  while ((m = clsxRe.exec(code)) !== null) {
-    const block = m[1];
-    const innerStrings = block.match(/["'`]([^"'`]{1,300})["'`]/g) ?? [];
+  const clsxCallRe = /(?:clsx|cn|classnames|cx)\(/g;
+  while ((m = clsxCallRe.exec(code)) !== null) {
+    let depth = 1;
+    let i = m.index + m[0].length;
+    let block = "";
+    while (i < code.length && depth > 0) {
+      const ch = code[i];
+      if (ch === "(") depth++;
+      else if (ch === ")") {
+        if (--depth === 0) break;
+      }
+      block += ch;
+      i++;
+    }
+    clsxCallRe.lastIndex = i + 1;
+    const innerStrings = block.match(/["'`]([^"'`]{1,2000})["'`]/g) ?? [];
     for (const s of innerStrings) pushTokens(s.slice(1, -1), found);
   }
   const templateRe = /`([^`]{1,2000})`/g;
@@ -242,12 +254,10 @@ function kbach(userConfig) {
   function processFile(filePath, code) {
     const key = normPath(filePath);
     const tokens = /* @__PURE__ */ new Set();
-    for (const cls of extractClassStrings(code)) {
-      for (const tok of splitClassTokens(cls)) {
-        tokens.add(tok);
-        if (!tokenCSS.has(tok)) {
-          tokenCSS.set(tok, generateClassCSS(tok, cfg.theme, cfg.darkMode, screens));
-        }
+    for (const tok of extractClassStrings(code)) {
+      tokens.add(tok);
+      if (!tokenCSS.has(tok)) {
+        tokenCSS.set(tok, generateClassCSS(tok, cfg.theme, cfg.darkMode, screens));
       }
     }
     fileTokens.set(key, tokens);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kbach/react",
-  "version": "0.5.47",
+  "version": "0.5.48",
   "description": "React / React Native components and hooks for the Kbach framework",
   "source": "./src/index.ts",
   "main": "./dist/index.js",

package/dist/chunk-LCK5OGHT.mjs

@@ -1,226 +0,0 @@
-import {
-  EMPTY_BREAKPOINTS2 as EMPTY_BREAKPOINTS,
-  InteractiveWrapper,
-  hasResponsiveBuckets,
-  useConditionalWidth,
-  useGlobalDarkMode
-} from "./chunk-U3GY5Y6J.mjs";
-import {
-  flatten,
-  getActiveBreakpoints,
-  getConfig,
-  getDefaultFontFamily,
-  getInteractiveModifiers,
-  getModeModifiers,
-  getResponsiveModifiers,
-  isNative,
-  isRuntimeCSSDisabled,
-  normalizeClassString,
-  resolve
-} from "./chunk-NIBECTRQ.mjs";
-
-// src/jsx-runtime.tsx
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Fragment } from "react";
-
-// src/DarkWrapper.tsx
-import React from "react";
-var DarkWrapper = React.forwardRef(
-  function DarkWrapper2({ Component, resolvedStyle, style: styleProp, children, ...rest }, ref) {
-    const isDark = useGlobalDarkMode();
-    const needsWidth = hasResponsiveBuckets(resolvedStyle);
-    const width = useConditionalWidth(needsWidth);
-    const breakpoints = needsWidth ? getActiveBreakpoints(width) : EMPTY_BREAKPOINTS;
-    const computedStyle = flatten(resolvedStyle, isDark, {}, breakpoints);
-    stripInternalMarkers(computedStyle);
-    if (typeof Component !== "string") stripWebOnlyProps(computedStyle);
-    const isWebHTMLElement = !isNative && typeof Component === "string";
-    const finalStyle = isWebHTMLElement ? styleProp ?? void 0 : styleProp ? Array.isArray(styleProp) ? Object.assign({}, computedStyle, ...styleProp) : { ...computedStyle, ...styleProp } : computedStyle;
-    const props = { ref, ...rest, style: finalStyle };
-    return Array.isArray(children) ? React.createElement(Component, props, ...children) : React.createElement(Component, props, children);
-  }
-);
-DarkWrapper.displayName = "Kbach.DarkWrapper";
-function stripInternalMarkers(s) {
-  delete s.__divideX;
-  delete s.__divideY;
-  delete s.__divideColor;
-  delete s.__divideStyle;
-  delete s.__keyframe;
-}
-function stripWebOnlyProps(s) {
-  if (s.display === "grid" || s.display === "inline-grid") delete s.display;
-  delete s.gridTemplateColumns;
-  delete s.gridTemplateRows;
-  delete s.gridColumn;
-  delete s.gridRow;
-  delete s.gridArea;
-  delete s.gridColumnStart;
-  delete s.gridColumnEnd;
-  delete s.gridRowStart;
-  delete s.gridRowEnd;
-  delete s.gridAutoFlow;
-  delete s.gridAutoColumns;
-  delete s.gridAutoRows;
-  delete s.placeItems;
-  delete s.placeContent;
-  delete s.justifyItems;
-  delete s.placeSelf;
-  delete s.justifySelf;
-  if (s.position === "sticky" || s.position === "fixed" || s.position === "static") {
-    delete s.position;
-  }
-}
-
-// src/jsx-runtime.tsx
-var _cachedDefaultFont = void 0;
-var _defaultFontVersion = 0;
-var _lastFontVersion = -1;
-function _invalidateDefaultFontCache() {
-  _defaultFontVersion++;
-}
-function getCachedDefaultFont() {
-  if (_lastFontVersion !== _defaultFontVersion) {
-    _cachedDefaultFont = getDefaultFontFamily();
-    _lastFontVersion = _defaultFontVersion;
-  }
-  return _cachedDefaultFont;
-}
-var _bucketModsCache = /* @__PURE__ */ new WeakMap();
-function bucketMods(resolved) {
-  const cached = _bucketModsCache.get(resolved);
-  if (cached) return cached;
-  const interactiveMods = getInteractiveModifiers();
-  const modeMods = getModeModifiers();
-  const responsiveMods = getResponsiveModifiers();
-  let interactive = false;
-  let modeOrResponsive = false;
-  for (const key of Object.keys(resolved)) {
-    if (key === "base") continue;
-    for (const mod of key.split(":")) {
-      if (!interactive && interactiveMods.has(mod)) interactive = true;
-      if (!modeOrResponsive && (modeMods.has(mod) || responsiveMods.has(mod))) modeOrResponsive = true;
-    }
-    if (interactive && modeOrResponsive) break;
-  }
-  const result = { interactive, modeOrResponsive };
-  _bucketModsCache.set(resolved, result);
-  return result;
-}
-var CONSUMED_PROPS = /* @__PURE__ */ new Set(["className", "kb", "__kbachStyles", "__kbachClasses"]);
-function omitConsumed(props) {
-  const out = {};
-  for (const key of Object.keys(props)) {
-    if (!CONSUMED_PROPS.has(key)) out[key] = props[key];
-  }
-  return out;
-}
-function mergeStyle(computed, userStyle) {
-  if (!userStyle) return computed;
-  if (Array.isArray(userStyle)) return Object.assign({}, computed, ...userStyle);
-  return { ...computed, ...userStyle };
-}
-function makeElement(isStaticChildren, type, props, key) {
-  return (isStaticChildren ? _jsxs : _jsx)(type, props, key);
-}
-function stripInternalMarkers2(s) {
-  delete s.__divideX;
-  delete s.__divideY;
-  delete s.__divideColor;
-  delete s.__divideStyle;
-  delete s.__keyframe;
-}
-function stripWebOnlyInlineProps(s) {
-  if (s.display === "grid" || s.display === "inline-grid") delete s.display;
-  delete s.gridTemplateColumns;
-  delete s.gridTemplateRows;
-  delete s.gridColumn;
-  delete s.gridRow;
-  delete s.gridArea;
-  delete s.gridColumnStart;
-  delete s.gridColumnEnd;
-  delete s.gridRowStart;
-  delete s.gridRowEnd;
-  delete s.gridAutoFlow;
-  delete s.gridAutoColumns;
-  delete s.gridAutoRows;
-  delete s.placeItems;
-  delete s.placeContent;
-  delete s.justifyItems;
-  delete s.placeSelf;
-  delete s.justifySelf;
-  if (s.position === "sticky" || s.position === "fixed" || s.position === "static") {
-    delete s.position;
-  }
-}
-function processElement(type, rawProps, key, isStaticChildren) {
-  if (typeof type === "symbol") return makeElement(isStaticChildren, type, rawProps ?? {}, key);
-  if (!rawProps) return _jsx(type, null, key);
-  const { className, kb: kbProp, __kbachStyles, __kbachClasses } = rawProps;
-  const classStr = className ?? kbProp ?? __kbachClasses;
-  if (!isNative && isRuntimeCSSDisabled() && classStr && !__kbachStyles) {
-    const { style: userStyle2, ...passProps2 } = omitConsumed(rawProps);
-    return makeElement(isStaticChildren, type, {
-      ...passProps2,
-      className: normalizeClassString(classStr),
-      ...userStyle2 !== void 0 ? { style: userStyle2 } : {}
-    }, key);
-  }
-  if (!classStr && !__kbachStyles) {
-    const defaultFont = getCachedDefaultFont();
-    if (!defaultFont) return makeElement(isStaticChildren, type, rawProps, key);
-    const { style: userStyle2, ...passProps2 } = omitConsumed(rawProps);
-    const finalStyle2 = userStyle2 ? Array.isArray(userStyle2) ? { fontFamily: defaultFont, ...Object.assign({}, ...userStyle2) } : { fontFamily: defaultFont, ...userStyle2 } : { fontFamily: defaultFont };
-    return makeElement(isStaticChildren, type, { ...passProps2, style: finalStyle2 }, key);
-  }
-  const config = getConfig();
-  const resolved = __kbachStyles ?? (classStr ? resolve(classStr, config.theme, config.darkMode) : {});
-  const { style: userStyle, ...passProps } = omitConsumed(rawProps);
-  const { interactive, modeOrResponsive } = bucketMods(resolved);
-  if (interactive) {
-    return _jsx(InteractiveWrapper, {
-      Component: type,
-      resolvedStyle: resolved,
-      ...!isNative && classStr ? { className: normalizeClassString(classStr) } : {},
-      style: userStyle,
-      ...passProps
-    }, key);
-  }
-  if (modeOrResponsive) {
-    return _jsx(DarkWrapper, {
-      Component: type,
-      resolvedStyle: resolved,
-      ...!isNative && classStr ? { className: normalizeClassString(classStr) } : {},
-      style: userStyle,
-      ...passProps
-    }, key);
-  }
-  const isWebHTMLElement = !isNative && typeof type === "string";
-  let finalStyle;
-  if (!isWebHTMLElement) {
-    const computedStyle = flatten(resolved, false);
-    stripInternalMarkers2(computedStyle);
-    if (typeof type !== "string") stripWebOnlyInlineProps(computedStyle);
-    finalStyle = mergeStyle(computedStyle, userStyle);
-  } else {
-    finalStyle = userStyle ?? void 0;
-  }
-  return makeElement(isStaticChildren, type, {
-    ...passProps,
-    style: finalStyle,
-    ...!isNative && classStr ? { className: normalizeClassString(classStr) } : {}
-  }, key);
-}
-function jsx(type, props, key) {
-  return processElement(type, props, key, false);
-}
-function jsxs(type, props, key) {
-  return processElement(type, props, key, true);
-}
-
-export {
-  Fragment,
-  _invalidateDefaultFontCache,
-  jsx,
-  jsxs
-};