@kbach/react-native 1.0.0-beta.10 → 1.0.0-beta.12

package/dist/{chunk-DLIXI5OW.mjs → chunk-4DQXTAM3.mjs}

@@ -1,3 +1,7 @@
+import {
+  getGlobalDarkMode
+} from "./chunk-RBJXE32L.mjs";
+
 // src/jsxRuntimeCore.ts
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment } from "react";
@@ -15,6 +19,10 @@ function resolvedStyleFor(resolveStyle, classStrRaw, userStyle, pressed) {
   }
   return [resolved, userStyle];
 }
+var DARK_MODIFIER_RE = /(^|\s)dark:/;
+function darkModeKeySuffix(classStrRaw) {
+  return DARK_MODIFIER_RE.test(classStrRaw) ? `:kb-dark-${getGlobalDarkMode()}` : "";
+}
 function processElement(resolveStyle, type, rawProps, key, isStaticChildren) {
   if (type === null || typeof type === "symbol" || !rawProps) {
     return makeElement(isStaticChildren, type, rawProps ?? {}, key);
@@ -24,7 +32,9 @@ function processElement(resolveStyle, type, rawProps, key, isStaticChildren) {
     return makeElement(isStaticChildren, type, rawProps, key);
   }
   const finalStyle = type === Pressable ? (state) => resolvedStyleFor(resolveStyle, classStrRaw, userStyle, state.pressed) : resolvedStyleFor(resolveStyle, classStrRaw, userStyle, false);
-  return makeElement(isStaticChildren, type, { ...rest, style: finalStyle }, key);
+  const suffix = darkModeKeySuffix(classStrRaw);
+  const finalKey = suffix ? `${key ?? ""}${suffix}` : key;
+  return makeElement(isStaticChildren, type, { ...rest, style: finalStyle }, finalKey);
 }
 function createJsxFunctions(resolveStyle) {
   function jsx(type, props, key) {

package/dist/{chunk-4N7UEVQL.mjs → chunk-7AIH5MXY.mjs}

@@ -1,9 +1,9 @@
 import {
   resolveStyle
-} from "./chunk-XHL653X2.mjs";
+} from "./chunk-MGXMALPC.mjs";
 import {
   createJsxFunctions
-} from "./chunk-DLIXI5OW.mjs";
+} from "./chunk-4DQXTAM3.mjs";
 
 // src/jsx-runtime.tsx
 var { jsx, jsxs } = createJsxFunctions(resolveStyle);

package/dist/{chunk-XHL653X2.mjs → chunk-MGXMALPC.mjs}

@@ -642,6 +642,36 @@ function lookupHex(theme, key) {
   const entry = theme.colors[key];
   return typeof entry === "string" ? entry : null;
 }
+function hexToRgb(hex) {
+  const m = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i.exec(hex.trim());
+  if (!m) return null;
+  let h = m[1];
+  if (h.length === 3) h = h.split("").map((c) => c + c).join("");
+  const n = parseInt(h, 16);
+  return [n >> 16 & 255, n >> 8 & 255, n & 255];
+}
+function splitOpacity(value) {
+  const slash = value.lastIndexOf("/");
+  if (slash === -1) return [value, null];
+  const opacityText = value.slice(slash + 1);
+  const n = Number(opacityText);
+  if (opacityText !== "" && Number.isInteger(n) && n >= 0 && n <= 100) {
+    return [value.slice(0, slash), n];
+  }
+  return [value, null];
+}
+function colorValue(theme, parsed) {
+  const value = parsed.value;
+  if (value === null) return null;
+  if (parsed.isArbitrary) return value;
+  const [name, opacity] = splitOpacity(value);
+  const hex = lookupHex(theme, name);
+  if (hex === null) return null;
+  if (opacity === null) return hex;
+  const rgb = hexToRgb(hex);
+  if (rgb === null) return hex;
+  return `rgba(${rgb.join(",")},${opacity / 100})`;
+}
 
 // src/jsEngine/resolvers/border.ts
 function radiusSize(key) {
@@ -1047,9 +1077,7 @@ function resolveLeadingTrackingNative(parsed) {
   return null;
 }
 function nativeHexColor(parsed, theme) {
-  const value = parsed.value;
-  if (value === null) return null;
-  return parsed.isArbitrary ? value : lookupHex(theme, value);
+  return colorValue(theme, parsed);
 }
 function resolveTextNative(parsed, theme) {
   if (!parsed.isArbitrary && parsed.value !== null) {

package/dist/{chunk-YOC3SHF5.mjs → chunk-OJIFXMLD.mjs}

@@ -1,6 +1,6 @@
 import {
   resolveClassName
-} from "./chunk-H5Z24XX5.mjs";
+} from "./chunk-3LNPXJEW.mjs";
 
 // src/jsxRuntimeCoreWeb.ts
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";

package/dist/index.js

@@ -1095,6 +1095,36 @@ function lookupHex(theme, key) {
   const entry = theme.colors[key];
   return typeof entry === "string" ? entry : null;
 }
+function hexToRgb(hex) {
+  const m = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i.exec(hex.trim());
+  if (!m) return null;
+  let h = m[1];
+  if (h.length === 3) h = h.split("").map((c) => c + c).join("");
+  const n = parseInt(h, 16);
+  return [n >> 16 & 255, n >> 8 & 255, n & 255];
+}
+function splitOpacity(value) {
+  const slash = value.lastIndexOf("/");
+  if (slash === -1) return [value, null];
+  const opacityText = value.slice(slash + 1);
+  const n = Number(opacityText);
+  if (opacityText !== "" && Number.isInteger(n) && n >= 0 && n <= 100) {
+    return [value.slice(0, slash), n];
+  }
+  return [value, null];
+}
+function colorValue(theme, parsed) {
+  const value = parsed.value;
+  if (value === null) return null;
+  if (parsed.isArbitrary) return value;
+  const [name, opacity] = splitOpacity(value);
+  const hex = lookupHex(theme, name);
+  if (hex === null) return null;
+  if (opacity === null) return hex;
+  const rgb = hexToRgb(hex);
+  if (rgb === null) return hex;
+  return `rgba(${rgb.join(",")},${opacity / 100})`;
+}
 
 // src/jsEngine/resolvers/border.ts
 function radiusSize(key) {
@@ -1500,9 +1530,7 @@ function resolveLeadingTrackingNative(parsed) {
   return null;
 }
 function nativeHexColor(parsed, theme) {
-  const value = parsed.value;
-  if (value === null) return null;
-  return parsed.isArbitrary ? value : lookupHex(theme, value);
+  return colorValue(theme, parsed);
 }
 function resolveTextNative(parsed, theme) {
   if (!parsed.isArbitrary && parsed.value !== null) {

package/dist/index.mjs

@@ -7,7 +7,7 @@ import {
 } from "./chunk-TDWBXJH5.mjs";
 import {
   resolveStyle
-} from "./chunk-XHL653X2.mjs";
+} from "./chunk-MGXMALPC.mjs";
 import {
   getGlobalDarkMode,
   getGlobalThemeMode,