@kbach/react-native 1.0.0-beta.25 → 1.0.0-beta.27

package/dist/index.web.mjs

@@ -3,19 +3,20 @@ import {
   getDynamicToken,
   getGlobalDarkMode,
   getGlobalThemeMode,
+  resyncDomWithActiveTheme,
   seedDefaultMode,
   setDynamicToken,
   setGlobalThemeMode,
   subscribeDynamicTokens,
   subscribeGlobalDarkMode,
   toggleGlobalDarkMode
-} from "./chunk-JENWPIJT.mjs";
+} from "./chunk-MXIT3EDJ.mjs";
 import {
   defaultTheme,
   getTheme,
   resolveClassName,
   setTheme
-} from "./chunk-TBDAJIR3.mjs";
+} from "./chunk-BEXNFWW6.mjs";
 
 // src/config.ts
 function parseHexRgb(hex) {
@@ -77,6 +78,7 @@ function resolveKbachConfig(config) {
 function applyKbachConfig(config) {
   const theme = resolveKbachConfig(config);
   setTheme(theme);
+  resyncDomWithActiveTheme();
   return theme;
 }
 
@@ -144,6 +146,7 @@ function ThemeProvider({ children, defaultMode = "system", persist = false }) {
 }
 
 // src/useColors.ts
+import { useMemo as useMemo2 } from "react";
 function parseHexRgb2(hex) {
   const m = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i.exec(hex.trim());
   if (!m) return null;
@@ -204,7 +207,8 @@ function makeColorsProxy(theme, isDark) {
 }
 function useColors() {
   const { isDark } = useTheme();
-  return makeColorsProxy(getTheme(), isDark);
+  const theme = getTheme();
+  return useMemo2(() => makeColorsProxy(theme, isDark), [theme, isDark]);
 }
 
 // src/useDynamicToken.ts

package/dist/jsx-dev-runtime.js

@@ -1938,16 +1938,33 @@ function resolveStyleJsWithWarnings(classString, theme, colorScheme, pressed, wi
 }
 
 // src/nativeBridge.ts
+var RESOLVE_STYLE_CACHE_MAX = 500;
+var resolveStyleCache = /* @__PURE__ */ new Map();
+var cachedForThemeJson = null;
 function resolveStyle(classString, pressed = false) {
   const colorScheme = (0, import_darkModeStore2.getGlobalDarkMode)() ? "dark" : "light";
   const width = import_react_native2.Dimensions.get("window").width;
+  const themeJson = (0, import_theme.getThemeJson)();
+  if (themeJson !== cachedForThemeJson) {
+    resolveStyleCache.clear();
+    cachedForThemeJson = themeJson;
+  }
+  const cacheKey = `${classString}\0${pressed}\0${colorScheme}\0${width}`;
+  const cached = resolveStyleCache.get(cacheKey);
+  if (cached !== void 0) return { ...cached };
+  const style = resolveStyleUncached(classString, pressed, colorScheme, width, themeJson);
+  if (resolveStyleCache.size >= RESOLVE_STYLE_CACHE_MAX) resolveStyleCache.clear();
+  resolveStyleCache.set(cacheKey, style);
+  return { ...style };
+}
+function resolveStyleUncached(classString, pressed, colorScheme, width, themeJson) {
   const KbachModule = import_react_native2.TurboModuleRegistry.get("KbachModule");
   if (!KbachModule) {
     const { style: style2, warnings: warnings2 } = resolveStyleJsWithWarnings(classString, (0, import_theme.getTheme)(), colorScheme, pressed, width);
     warnIfDev(classString, warnings2);
     return style2;
   }
-  const json = KbachModule.resolveStyle(classString, (0, import_theme.getThemeJson)(), colorScheme, pressed, width);
+  const json = KbachModule.resolveStyle(classString, themeJson, colorScheme, pressed, width);
   const style = JSON.parse(json);
   const warnings = style.__kbachWarnings;
   if (warnings !== void 0) {