react-native-unistyles 3.0.0-nightly-20250609 → 3.0.0-nightly-20250616

package/lib/module/web/utils/unistyle.js

@@ -2,7 +2,7 @@
 
 import { Animated } from 'react-native';
 import { ColorScheme, Orientation } from '../../specs/types';
-import { isUnistylesMq, parseMq } from '../../utils';
+import { isDefined, isUnistylesMq, parseMq } from '../../utils';
 import * as unistyles from '../services';
 import { UNI_GENERATED_KEYS } from '../types';
 import { hyphenate, keyInObject, reduceObject } from './common';
@@ -108,4 +108,15 @@ export const convertTheme = (key, value, prev = '-') => {
   }
   return [key, value];
 };
+export const getClosestBreakpointValue = (runtime, values) => {
+  const breakpoints = runtime.breakpoints;
+  const breakpointValues = Object.entries(values)
+  // Filter out non-breakpoint values
+  .filter(pair => pair[0] in breakpoints)
+  // Sort in descending order
+  .sort(([a], [b]) => (breakpoints[b] ?? 0) - (breakpoints[a] ?? 0));
+  // Get breakpoint value with highest priority
+  const [_, currentBreakpointValue] = breakpointValues.find(([key]) => isDefined(runtime.breakpoint) && (breakpoints[key] ?? 0) <= (breakpoints[runtime.breakpoint] ?? 0)) ?? [];
+  return currentBreakpointValue;
+};
 //# sourceMappingURL=unistyle.js.map

package/lib/module/web/utils/unistyle.js.map

@@ -1 +1 @@
-{"version":3,"names":["Animated","ColorScheme","Orientation","isUnistylesMq","parseMq","unistyles","UNI_GENERATED_KEYS","hyphenate","keyInObject","reduceObject","schemeToTheme","scheme","Dark","Light","assignSecrets","object","secrets","secretsId","Math","random","toString","slice","Object","defineProperties","secret","value","enumerable","configurable","extractSecrets","undefined","entries","find","key","startsWith","getOwnPropertyDescriptors","removeInlineStyles","values","returnValue","getMediaQuery","query","allBreakpoints","includes","minWidth","maxWidth","minHeight","maxHeight","queries","filter","Boolean","join","breakpointValue","services","runtime","breakpoints","nextBreakpoint","b","map","sort","a","extractUnistyleDependencies","dependencies","uni__dependencies","Array","isArray","checkForProp","prop","some","nestedValue","_web","checkForAnimated","objectValues","Node","length","keys","isGeneratedUnistyle","every","convertTheme","prev","fromEntries","nestedKey"],"sourceRoot":"../../../../src","sources":["web/utils/unistyle.ts"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["Animated","ColorScheme","Orientation","isDefined","isUnistylesMq","parseMq","unistyles","UNI_GENERATED_KEYS","hyphenate","keyInObject","reduceObject","schemeToTheme","scheme","Dark","Light","assignSecrets","object","secrets","secretsId","Math","random","toString","slice","Object","defineProperties","secret","value","enumerable","configurable","extractSecrets","undefined","entries","find","key","startsWith","getOwnPropertyDescriptors","removeInlineStyles","values","returnValue","getMediaQuery","query","allBreakpoints","includes","minWidth","maxWidth","minHeight","maxHeight","queries","filter","Boolean","join","breakpointValue","services","runtime","breakpoints","nextBreakpoint","b","map","sort","a","extractUnistyleDependencies","dependencies","uni__dependencies","Array","isArray","checkForProp","prop","some","nestedValue","_web","checkForAnimated","objectValues","Node","length","keys","isGeneratedUnistyle","every","convertTheme","prev","fromEntries","nestedKey","getClosestBreakpointValue","breakpointValues","pair","_","currentBreakpointValue","breakpoint"],"sourceRoot":"../../../../src","sources":["web/utils/unistyle.ts"],"mappings":"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","ignoreList":[]}

package/lib/typescript/src/components/ScopedTheme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScopedTheme.d.ts","sourceRoot":"","sources":["../../../../src/components/ScopedTheme.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA;AAKhD,KAAK,UAAU,GAAG;IACd,IAAI,EAAE,MAAM,eAAe,CAAC;IAC5B,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC7B,GAAG;IACA,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,gBAAgB,EAAE,IAAI,CAAA;CACzB,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAgCpF,CAAA"}
+{"version":3,"file":"ScopedTheme.d.ts","sourceRoot":"","sources":["../../../../src/components/ScopedTheme.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA;AAKhD,KAAK,UAAU,GAAG;IACd,IAAI,EAAE,MAAM,eAAe,CAAC;IAC5B,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC7B,GAAG;IACA,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,gBAAgB,EAAE,IAAI,CAAA;CACzB,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAqCpF,CAAA"}

package/lib/typescript/src/core/withUnistyles/types.d.ts

@@ -2,5 +2,7 @@ import type { UnistylesMiniRuntime } from '../../specs';
 import type { UnistylesTheme } from '../../types';
 export declare const SUPPORTED_STYLE_PROPS: readonly ["style", "contentContainerStyle"];
 export type SupportedStyleProps = typeof SUPPORTED_STYLE_PROPS[number];
-export type Mappings<T = {}> = (theme: UnistylesTheme, rt: UnistylesMiniRuntime) => Omit<Partial<T>, SupportedStyleProps>;
+export type Mappings<T = {}> = (theme: UnistylesTheme, rt: UnistylesMiniRuntime) => Omit<Partial<T>, SupportedStyleProps> & {
+    key?: string;
+};
 //# sourceMappingURL=types.d.ts.map

package/lib/typescript/src/core/withUnistyles/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/core/withUnistyles/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD,eAAO,MAAM,qBAAqB,6CAA8C,CAAA;AAEhF,MAAM,MAAM,mBAAmB,GAAG,OAAO,qBAAqB,CAAC,MAAM,CAAC,CAAA;AACtE,MAAM,MAAM,QAAQ,CAAC,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,cAAc,EAAE,EAAE,EAAE,oBAAoB,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,mBAAmB,CAAC,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/core/withUnistyles/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD,eAAO,MAAM,qBAAqB,6CAA8C,CAAA;AAEhF,MAAM,MAAM,mBAAmB,GAAG,OAAO,qBAAqB,CAAC,MAAM,CAAC,CAAA;AACtE,MAAM,MAAM,QAAQ,CAAC,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,cAAc,EAAE,EAAE,EAAE,oBAAoB,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,mBAAmB,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA"}

package/lib/typescript/src/core/withUnistyles/withUnistyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"withUnistyles.d.ts","sourceRoot":"","sources":["../../../../../src/core/withUnistyles/withUnistyles.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAkC,KAAK,cAAc,EAAqB,MAAM,OAAO,CAAA;AAMrG,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAGvC,KAAK,qBAAqB,CAAC,CAAC,IAAI,cAAc,CAAC,CAAC,CAAC,CAAA;AAIjD,eAAO,MAAM,aAAa,GAAI,UAAU,EAAE,SAAS,SAAS,qBAAqB,CAAC,UAAU,CAAC,EAAE,WAAW,UAAU,EAAE,WAAW,QAAQ,CAAC,SAAS,CAAC;eAGjI,QAAQ,kCAAQ;yDAqDlC,CAAA"}
+{"version":3,"file":"withUnistyles.d.ts","sourceRoot":"","sources":["../../../../../src/core/withUnistyles/withUnistyles.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAkC,KAAK,cAAc,EAAqB,MAAM,OAAO,CAAA;AAMrG,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAGvC,KAAK,qBAAqB,CAAC,CAAC,IAAI,cAAc,CAAC,CAAC,CAAC,CAAA;AAIjD,eAAO,MAAM,aAAa,GAAI,UAAU,EAAE,SAAS,SAAS,qBAAqB,CAAC,UAAU,CAAC,EAAE,WAAW,UAAU,EAAE,WAAW,QAAQ,CAAC,SAAS,CAAC;eAGjI,QAAQ,kCAAQ;yDAwDlC,CAAA"}

package/lib/typescript/src/core/withUnistyles/withUnistyles.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"withUnistyles.native.d.ts","sourceRoot":"","sources":["../../../../../src/core/withUnistyles/withUnistyles.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAA;AAMhF,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAGvC,KAAK,qBAAqB,CAAC,CAAC,IAAI,cAAc,CAAC,CAAC,CAAC,CAAA;AAcjD,eAAO,MAAM,aAAa,GAAI,UAAU,EAAE,SAAS,SAAS,qBAAqB,CAAC,UAAU,CAAC,EAAE,WAAW,UAAU,EAAE,WAAW,QAAQ,CAAC,SAAS,CAAC,yCAuEnJ,CAAA"}
+{"version":3,"file":"withUnistyles.native.d.ts","sourceRoot":"","sources":["../../../../../src/core/withUnistyles/withUnistyles.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAA;AAMhF,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAGvC,KAAK,qBAAqB,CAAC,CAAC,IAAI,cAAc,CAAC,CAAC,CAAC,CAAA;AAcjD,eAAO,MAAM,aAAa,GAAI,UAAU,EAAE,SAAS,SAAS,qBAAqB,CAAC,UAAU,CAAC,EAAE,WAAW,UAAU,EAAE,WAAW,QAAQ,CAAC,SAAS,CAAC,yCA8EnJ,CAAA"}

package/lib/typescript/src/reanimated/index.d.ts

@@ -1,2 +1,3 @@
 export { useAnimatedTheme } from './useAnimatedTheme';
+export { useAnimatedVariantColor } from './variant';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/reanimated/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/reanimated/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/reanimated/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AACrD,OAAO,EAAE,uBAAuB,EAAE,MAAM,WAAW,CAAA"}

package/lib/typescript/src/reanimated/variant/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useAnimatedVariantColor';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/reanimated/variant/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/reanimated/variant/index.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAA"}

package/lib/typescript/src/reanimated/variant/types.d.ts

@@ -0,0 +1,10 @@
+export type ColorKeys<T> = {
+    [K in keyof T]: K extends string ? K extends `${string}color${string}` | `${string}Color${string}` ? K : never : never;
+}[keyof T];
+export type UseUpdateVariantColorConfig<T extends Record<string, any>> = {
+    animateCallback?: (from: string, to: string) => void;
+    colorKey: ColorKeys<T>;
+    style: T;
+    secretKey: string | undefined;
+};
+//# sourceMappingURL=types.d.ts.map

package/lib/typescript/src/reanimated/variant/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/reanimated/variant/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,SAAS,CAAC,CAAC,IAAI;KACtB,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,SAAS,MAAM,GAC1B,CAAC,SAAS,GAAG,MAAM,QAAQ,MAAM,EAAE,GAAG,GAAG,MAAM,QAAQ,MAAM,EAAE,GAC3D,CAAC,GACD,KAAK,GACT,KAAK;CACd,CAAC,MAAM,CAAC,CAAC,CAAA;AAEV,MAAM,MAAM,2BAA2B,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,IAAI;IACrE,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACrD,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;IACvB,KAAK,EAAE,CAAC,CAAC;IACT,SAAS,EAAE,MAAM,GAAG,SAAS,CAAA;CAChC,CAAA"}

package/lib/typescript/src/reanimated/variant/useAnimatedVariantColor.d.ts

@@ -0,0 +1,3 @@
+import type { ColorKeys } from './types';
+export declare const useAnimatedVariantColor: <T extends Record<string, any>>(style: T, colorKey: ColorKeys<T>) => import("react-native-reanimated").DerivedValue<string>;
+//# sourceMappingURL=useAnimatedVariantColor.d.ts.map

package/lib/typescript/src/reanimated/variant/useAnimatedVariantColor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAnimatedVariantColor.d.ts","sourceRoot":"","sources":["../../../../../src/reanimated/variant/useAnimatedVariantColor.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAGxC,eAAO,MAAM,uBAAuB,GAAI,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,OAAO,CAAC,EAAE,UAAU,SAAS,CAAC,CAAC,CAAC,2DAiCtG,CAAA"}

package/lib/typescript/src/reanimated/variant/useUpdateVariantColor.d.ts

@@ -0,0 +1,6 @@
+import type { UseUpdateVariantColorConfig } from './types';
+export declare const useUpdateVariantColor: <T extends Record<string, any>>({ animateCallback, colorKey, style }: UseUpdateVariantColorConfig<T>) => {
+    fromValue: import("react-native-reanimated").SharedValue<string>;
+    toValue: import("react-native-reanimated").SharedValue<string>;
+};
+//# sourceMappingURL=useUpdateVariantColor.d.ts.map

package/lib/typescript/src/reanimated/variant/useUpdateVariantColor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useUpdateVariantColor.d.ts","sourceRoot":"","sources":["../../../../../src/reanimated/variant/useUpdateVariantColor.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,SAAS,CAAA;AAE1D,eAAO,MAAM,qBAAqB,GAAI,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,sCAIlE,2BAA2B,CAAC,CAAC,CAAC;;;CAoEhC,CAAA"}

package/lib/typescript/src/reanimated/variant/useUpdateVariantColor.native.d.ts

@@ -0,0 +1,6 @@
+import type { UseUpdateVariantColorConfig } from './types';
+export declare const useUpdateVariantColor: <T extends Record<string, any>>({ colorKey, style, secretKey }: UseUpdateVariantColorConfig<T>) => {
+    fromValue: import("react-native-reanimated").SharedValue<string>;
+    toValue: import("react-native-reanimated").SharedValue<string>;
+};
+//# sourceMappingURL=useUpdateVariantColor.native.d.ts.map

package/lib/typescript/src/reanimated/variant/useUpdateVariantColor.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useUpdateVariantColor.native.d.ts","sourceRoot":"","sources":["../../../../../src/reanimated/variant/useUpdateVariantColor.native.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,SAAS,CAAA;AAE1D,eAAO,MAAM,qBAAqB,GAAI,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,gCAIlE,2BAA2B,CAAC,CAAC,CAAC;;;CA4BhC,CAAA"}

package/lib/typescript/src/web/convert/pseudo.d.ts

@@ -1,6 +1,9 @@
-export declare const pseudos: readonly ["_-moz-broken", "_-moz-drag-over", "_-moz-first-node", "_-moz-handler-blocked", "_-moz-handler-crashed", "_-moz-handler-disabled", "_-moz-last-node", "_-moz-loading", "_-moz-locale-dir(ltr)", "_-moz-locale-dir(rtl)", "_-moz-only-whitespace", "_-moz-submit-invalid", "_-moz-suppressed", "_-moz-user-disabled", "_-moz-window-inactive", "_active", "_any-link", "_autofill", "_blank", "_buffering", "_checked", "_current", "_default", "_defined", "_dir(", "_disabled", "_empty", "_enabled", "_first", "_first-child", "_first-of-type", "_focus", "_focus-visible", "_focus-within", "_fullscreen", "_future", "_has(", "_host", "_host-context(", "_host(", "_hover", "_in-range", "_indeterminate", "_invalid", "_is(", "_lang(", "_last-child", "_last-of-type", "_left", "_link", "_local-link", "_modal", "_muted", "_not(", "_nth-child(", "_nth-last-child(", "_nth-last-of-type(", "_nth-of-type(", "_only-child", "_only-of-type", "_optional", "_out-of-range", "_past", "_paused", "_picture-in-picture", "_placeholder-shown", "_playing", "_popover-open", "_read-only", "_read-write", "_required", "_right", "_scope", "_seeking", "_stalled", "_state(", "_target", "_target-within", "_user-invalid", "_user-valid", "_valid", "_visited", "_volume-locked", "_where(", "_-moz-color-swatch", "_-moz-focus-inner", "_-moz-list-bullet", "_-moz-list-number", "_-moz-meter-bar", "_-moz-progress-bar", "_-moz-range-progress", "_-moz-range-thumb", "_-moz-range-track", "_-webkit-inner-spin-button", "_-webkit-meter-barDeprecated", "_-webkit-meter-even-less-good-value", "_-webkit-meter-inner-element", "_-webkit-meter-optimum-value", "_-webkit-meter-suboptimum-value", "_-webkit-progress-bar", "_-webkit-progress-inner-element", "_-webkit-progress-value", "_-webkit-scrollbar", "_-webkit-search-cancel-button", "_-webkit-search-results-button", "_-webkit-slider-runnable-track", "_-webkit-slider-thumb", "_after", "_backdrop", "_before", "_cue", "_file-selector-button", "_first-letter", "_first-line", "_grammar-error", "_highlight(", "_marker", "_part(", "_placeholder", "_selection", "_slotted(", "_spelling-error", "_target-text", "_view-transition", "_view-transition-group", "_view-transition-image-pair", "_view-transition-new", "_view-transition-old"];
-export declare const isPseudo: (selector: string) => boolean;
+declare const pseudoClasses: readonly ["_active", "_any-link", "_autofill", "_buffering", "_checked", "_default", "_defined", "_dir(", "_disabled", "_empty", "_enabled", "_first", "_first-child", "_first-of-type", "_focus", "_focus-visible", "_focus-within", "_future", "_has-slotted", "_has(", "_host", "_host-context(", "_host(", "_hover", "_in-range", "_indeterminate", "_invalid", "_is(", "_lang(", "_last-child", "_last-of-type", "_left", "_link", "_modal", "_muted", "_not(", "_nth-child(", "_nth-last-child(", "_nth-last-of-type(", "_nth-of-type(", "_only-child", "_only-of-type", "_open", "_optional", "_out-of-range", "_past", "_paused", "_picture-in-picture", "_placeholder-shown", "_playing", "_popover-open", "_read-only", "_read-write", "_required", "_right", "_root", "_scope", "_seeking", "_stalled", "_state(", "_target", "_user-invalid", "_user-valid", "_valid", "_visited", "_volume-locked", "_where"];
+declare const pseudoElements: readonly ["_after", "_backdrop", "_before", "_cue", "_details-content", "_file-selector-button", "_first-letter", "_first-line", "_grammar-error", "_highlight(", "_marker", "_part(", "_placeholder", "_selection", "_slotted(", "_spelling-error", "_target-text", "_view-transition", "_view-transition-group(", "_view-transition-image-pair(", "_view-transition-new(", "_view-transition-old("];
 type AddDynamicSelector<T extends string> = T extends `${infer U}(` ? `${U}(${string})` : T;
-export type Pseudo = AddDynamicSelector<typeof pseudos[number]>;
+export type Pseudo = AddDynamicSelector<(typeof pseudoClasses)[number] | (typeof pseudoElements)[number]>;
+export declare const isPseudoClass: (selector: string) => boolean;
+export declare const isPseudoElement: (selector: string) => boolean;
+export declare const isPseudo: (selector: string) => boolean;
 export {};
 //# sourceMappingURL=pseudo.d.ts.map

package/lib/typescript/src/web/convert/pseudo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pseudo.d.ts","sourceRoot":"","sources":["../../../../../src/web/convert/pseudo.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO,ssEAiIV,CAAA;AAEV,eAAO,MAAM,QAAQ,GAAI,UAAU,MAAM,YAAwD,CAAA;AAEjG,KAAK,kBAAkB,CAAC,CAAC,SAAS,MAAM,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC,GAAG,GAAG,GAAG,CAAC,IAAI,MAAM,GAAG,GAAG,CAAC,CAAA;AAE3F,MAAM,MAAM,MAAM,GAAG,kBAAkB,CAAC,OAAO,OAAO,CAAC,MAAM,CAAC,CAAC,CAAA"}
+{"version":3,"file":"pseudo.d.ts","sourceRoot":"","sources":["../../../../../src/web/convert/pseudo.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,aAAa,43BAoET,CAAA;AAGV,QAAA,MAAM,cAAc,uYAuBV,CAAA;AAEV,KAAK,kBAAkB,CAAC,CAAC,SAAS,MAAM,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC,GAAG,GAAG,GAAG,CAAC,IAAI,MAAM,GAAG,GAAG,CAAC,CAAA;AAE3F,MAAM,MAAM,MAAM,GAAG,kBAAkB,CAAC,CAAC,OAAO,aAAa,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC,CAAA;AAEzG,eAAO,MAAM,aAAa,GAAI,UAAU,MAAM,YAA8D,CAAA;AAE5G,eAAO,MAAM,eAAe,GAAI,UAAU,MAAM,YAA+D,CAAA;AAE/G,eAAO,MAAM,QAAQ,GAAI,UAAU,MAAM,YAAyD,CAAA"}

package/lib/typescript/src/web/css/core.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"core.d.ts","sourceRoot":"","sources":["../../../../../src/web/css/core.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAEvC,eAAO,MAAM,YAAY,GAAI,MAAM,MAAM,EAAE,OAAO,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,OAAO,QAAQ,SA8DrF,CAAA"}
+{"version":3,"file":"core.d.ts","sourceRoot":"","sources":["../../../../../src/web/css/core.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAEvC,eAAO,MAAM,YAAY,GAAI,MAAM,MAAM,EAAE,OAAO,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,OAAO,QAAQ,SA+DrF,CAAA"}

package/lib/typescript/src/web/shadowRegistry.d.ts

@@ -14,6 +14,7 @@ export declare class UnistylesShadowRegistry {
     addStyles: (unistyles: Array<UnistylesValues>, forChild?: boolean) => UniGeneratedStyle | {
         injectedClassName: string;
         hash: string;
+        parsedStyles: UnistylesValues;
     };
     setScopedTheme: (theme?: UnistylesTheme) => void;
     getScopedTheme: () => undefined;

package/lib/typescript/src/web/shadowRegistry.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"shadowRegistry.d.ts","sourceRoot":"","sources":["../../../../src/web/shadowRegistry.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE/D,OAAO,KAAK,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAInE,qBAAa,uBAAuB;IAYpB,OAAO,CAAC,QAAQ;IAV5B,IAAI,SAA4B;IAChC,MAAM,SAAQ;IACd,MAAM,gBAAa;IACnB,QAAQ,eAAkC;IAC1C,OAAO,aAAW;IAGlB,OAAO,CAAC,WAAW,CAAwC;IAC3D,OAAO,CAAC,UAAU,CAAkC;gBAEhC,QAAQ,EAAE,iBAAiB;IAE/C,GAAG,GAAI,KAAK,GAAG,EAAE,OAAO,MAAM,UAM7B;IAED,SAAS,GAAI,WAAW,KAAK,CAAC,eAAe,CAAC,EAAE,WAAW,OAAO;;;MAoEjE;IAED,cAAc,GAAI,QAAQ,cAAc,UAEvC;IAED,cAAc,kBAAyB;IAEvC,MAAM,GAAI,KAAK,GAAG,EAAE,OAAO,MAAM,UAchC;IAED,KAAK,aAAW;CACnB"}
+{"version":3,"file":"shadowRegistry.d.ts","sourceRoot":"","sources":["../../../../src/web/shadowRegistry.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE/D,OAAO,KAAK,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAInE,qBAAa,uBAAuB;IAYpB,OAAO,CAAC,QAAQ;IAV5B,IAAI,SAA4B;IAChC,MAAM,SAAQ;IACd,MAAM,gBAAa;IACnB,QAAQ,eAAkC;IAC1C,OAAO,aAAW;IAGlB,OAAO,CAAC,WAAW,CAAwC;IAC3D,OAAO,CAAC,UAAU,CAAkC;gBAEhC,QAAQ,EAAE,iBAAiB;IAE/C,GAAG,GAAI,KAAK,GAAG,EAAE,OAAO,MAAM,UAM7B;IAED,SAAS,GAAI,WAAW,KAAK,CAAC,eAAe,CAAC,EAAE,WAAW,OAAO;;;;MAoEjE;IAED,cAAc,GAAI,QAAQ,cAAc,UAEvC;IAED,cAAc,kBAAyB;IAEvC,MAAM,GAAI,KAAK,GAAG,EAAE,OAAO,MAAM,UAchC;IAED,KAAK,aAAW;CACnB"}

package/lib/typescript/src/web/types.d.ts

@@ -1,3 +1,4 @@
+import type { UnistylesValues } from '../types';
 import type { UnistylesListener } from './listener';
 import type { UnistylesRegistry } from './registry';
 import type { UnistylesRuntime } from './runtime';
@@ -12,5 +13,7 @@ export type UnistylesServices = {
 };
 export declare const UNI_GENERATED_KEYS: readonly ["$$css", "hash", "injectedClassName"];
 export type UniGeneratedKey = typeof UNI_GENERATED_KEYS[number];
-export type UniGeneratedStyle = Record<UniGeneratedKey, string>;
+export type UniGeneratedStyle = Record<UniGeneratedKey, string> & {
+    parsedStyles?: UnistylesValues;
+};
 //# sourceMappingURL=types.d.ts.map

package/lib/typescript/src/web/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/web/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AACnD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AACnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AACjD,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,kBAAkB,CAAA;AAC/D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE7C,MAAM,MAAM,iBAAiB,GAAG;IAC5B,OAAO,EAAE,gBAAgB,CAAC;IAC1B,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,cAAc,EAAE,uBAAuB,CAAC;IACxC,KAAK,EAAE,cAAc,CAAC;IACtB,QAAQ,EAAE,iBAAiB,CAAA;CAC9B,CAAA;AAED,eAAO,MAAM,kBAAkB,iDAAkD,CAAA;AACjF,MAAM,MAAM,eAAe,GAAG,OAAO,kBAAkB,CAAC,MAAM,CAAC,CAAA;AAE/D,MAAM,MAAM,iBAAiB,GAAG,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/web/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAC/C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AACnD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AACnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AACjD,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,kBAAkB,CAAA;AAC/D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE7C,MAAM,MAAM,iBAAiB,GAAG;IAC5B,OAAO,EAAE,gBAAgB,CAAC;IAC1B,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,cAAc,EAAE,uBAAuB,CAAC;IACxC,KAAK,EAAE,cAAc,CAAC;IACtB,QAAQ,EAAE,iBAAiB,CAAA;CAC9B,CAAA;AAED,eAAO,MAAM,kBAAkB,iDAAkD,CAAA;AACjF,MAAM,MAAM,eAAe,GAAG,OAAO,kBAAkB,CAAC,MAAM,CAAC,CAAA;AAE/D,MAAM,MAAM,iBAAiB,GAAG,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,GAAG;IAC9D,YAAY,CAAC,EAAE,eAAe,CAAA;CACjC,CAAA"}

package/lib/typescript/src/web/utils/unistyle.d.ts

@@ -1,13 +1,15 @@
+import type { UnistylesBreakpoints } from '../../global';
 import type { UnistyleDependency } from '../../specs/NativePlatform/NativePlatform.nitro';
 import { ColorScheme } from '../../specs/types';
 import type { StyleSheet, StyleSheetWithSuperPowers, UnistylesValues } from '../../types/stylesheet';
+import type { UnistylesRuntime } from '../runtime';
 import { type UniGeneratedStyle } from '../types';
 export declare const schemeToTheme: (scheme: ColorScheme) => "light" | "dark";
 export type UnistyleSecrets = {
     __uni__stylesheet: StyleSheetWithSuperPowers<StyleSheet>;
     __uni__key: string;
     __uni__args?: Array<any>;
-    __uni_variants: Record<string, string | boolean | undefined>;
+    __stylesheetVariants: Record<string, string | boolean | undefined>;
 };
 export declare const assignSecrets: <T>(object: T, secrets: UnistyleSecrets) => T;
 export declare const extractSecrets: (object: any) => {
@@ -20,4 +22,5 @@ export declare const checkForProp: (value: any, prop: string) => boolean;
 export declare const checkForAnimated: (value: any) => boolean;
 export declare const isGeneratedUnistyle: (value: Record<string, any>) => value is UniGeneratedStyle;
 export declare const convertTheme: (key: string, value: any, prev?: string) => [string, any];
+export declare const getClosestBreakpointValue: <T>(runtime: UnistylesRuntime, values: Partial<Record<keyof UnistylesBreakpoints, T>>) => T | undefined;
 //# sourceMappingURL=unistyle.d.ts.map

package/lib/typescript/src/web/utils/unistyle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"unistyle.d.ts","sourceRoot":"","sources":["../../../../../src/web/utils/unistyle.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iDAAiD,CAAA;AACzF,OAAO,EAAE,WAAW,EAAe,MAAM,mBAAmB,CAAA;AAC5D,OAAO,KAAK,EAAE,UAAU,EAAE,yBAAyB,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAGpG,OAAO,EAA4C,KAAK,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAG3F,eAAO,MAAM,aAAa,GAAI,QAAQ,WAAW,qBAQhD,CAAA;AAED,MAAM,MAAM,eAAe,GAAG;IAC1B,iBAAiB,EAAE,yBAAyB,CAAC,UAAU,CAAC,CAAC;IACzD,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACzB,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,CAAA;CAC/D,CAAA;AAED,eAAO,MAAM,aAAa,GAAI,CAAC,EAAE,QAAQ,CAAC,EAAE,SAAS,eAAe,MAanE,CAAA;AAED,eAAO,MAAM,cAAc,GAAI,QAAQ,GAAG;;aAYzC,CAAA;AAED,eAAO,MAAM,kBAAkB,GAAI,QAAQ,eAAe,OAUzD,CAAA;AAED,eAAO,MAAM,aAAa,GAAI,OAAO,MAAM,EAAE,gBAAgB,KAAK,CAAC,MAAM,CAAC,WA6BzE,CAAA;AAED,eAAO,MAAM,2BAA2B,GAAI,OAAO,GAAG,yBAQrD,CAAA;AAED,eAAO,MAAM,YAAY,GAAI,OAAO,GAAG,EAAE,MAAM,MAAM,KAAG,OAcvD,CAAA;AAED,eAAO,MAAM,gBAAgB,GAAI,OAAO,GAAG,KAAG,OAgB7C,CAAA;AAED,eAAO,MAAM,mBAAmB,GAAI,OAAO,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAG,KAAK,IAAI,iBAIzE,CAAA;AAED,eAAO,MAAM,YAAY,GAAI,KAAK,MAAM,EAAE,OAAO,GAAG,EAAE,aAAU,KAAG,CAAC,MAAM,EAAE,GAAG,CAU9E,CAAA"}
+{"version":3,"file":"unistyle.d.ts","sourceRoot":"","sources":["../../../../../src/web/utils/unistyle.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAA;AACxD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iDAAiD,CAAA;AACzF,OAAO,EAAE,WAAW,EAAe,MAAM,mBAAmB,CAAA;AAC5D,OAAO,KAAK,EAAE,UAAU,EAAE,yBAAyB,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAEpG,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAElD,OAAO,EAA4C,KAAK,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAG3F,eAAO,MAAM,aAAa,GAAI,QAAQ,WAAW,qBAQhD,CAAA;AAED,MAAM,MAAM,eAAe,GAAG;IAC1B,iBAAiB,EAAE,yBAAyB,CAAC,UAAU,CAAC,CAAC;IACzD,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACzB,oBAAoB,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,CAAA;CACrE,CAAA;AAED,eAAO,MAAM,aAAa,GAAI,CAAC,EAAE,QAAQ,CAAC,EAAE,SAAS,eAAe,MAanE,CAAA;AAED,eAAO,MAAM,cAAc,GAAI,QAAQ,GAAG;;aAYzC,CAAA;AAED,eAAO,MAAM,kBAAkB,GAAI,QAAQ,eAAe,OAUzD,CAAA;AAED,eAAO,MAAM,aAAa,GAAI,OAAO,MAAM,EAAE,gBAAgB,KAAK,CAAC,MAAM,CAAC,WA6BzE,CAAA;AAED,eAAO,MAAM,2BAA2B,GAAI,OAAO,GAAG,yBAQrD,CAAA;AAED,eAAO,MAAM,YAAY,GAAI,OAAO,GAAG,EAAE,MAAM,MAAM,KAAG,OAcvD,CAAA;AAED,eAAO,MAAM,gBAAgB,GAAI,OAAO,GAAG,KAAG,OAgB7C,CAAA;AAED,eAAO,MAAM,mBAAmB,GAAI,OAAO,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAG,KAAK,IAAI,iBAIzE,CAAA;AAED,eAAO,MAAM,YAAY,GAAI,KAAK,MAAM,EAAE,OAAO,GAAG,EAAE,aAAU,KAAG,CAAC,MAAM,EAAE,GAAG,CAU9E,CAAA;AAED,eAAO,MAAM,yBAAyB,GAAI,CAAC,EAAE,SAAS,gBAAgB,EAAE,QAAQ,OAAO,CAAC,MAAM,CAAC,MAAM,oBAAoB,EAAE,CAAC,CAAC,CAAC,kBAa7H,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-unistyles",
-  "version": "3.0.0-nightly-20250609",
+  "version": "3.0.0-nightly-20250616",
   "description": "Level up your React Native StyleSheet",
   "scripts": {
     "test": "NODE_ENV=babel-test jest ./plugin",

package/src/components/ScopedTheme.tsx

@@ -17,9 +17,14 @@ export const ScopedTheme: React.FunctionComponent<React.PropsWithChildren<ThemeP
     children,
     invertedAdaptive
 }) => {
-    const isAdaptiveTheme = invertedAdaptive && UnistylesRuntime.hasAdaptiveThemes
+    const hasAdaptiveThemes = UnistylesRuntime.hasAdaptiveThemes
+    const isAdaptiveTheme = invertedAdaptive && hasAdaptiveThemes
 
-    if (!isAdaptiveTheme && !name) {
+    if (invertedAdaptive && !hasAdaptiveThemes) {
+        return children
+    }
+
+    if (!invertedAdaptive && !name) {
         if (__DEV__) {
             console.error('ScopedTheme: name or invertedAdaptive must be provided')
         }

package/src/core/withUnistyles/types.ts

@@ -4,4 +4,4 @@ import type { UnistylesTheme } from '../../types';
 export const SUPPORTED_STYLE_PROPS = ['style', 'contentContainerStyle'] as const
 
 export type SupportedStyleProps = typeof SUPPORTED_STYLE_PROPS[number]
-export type Mappings<T = {}> = (theme: UnistylesTheme, rt: UnistylesMiniRuntime) => Omit<Partial<T>, SupportedStyleProps>
+export type Mappings<T = {}> = (theme: UnistylesTheme, rt: UnistylesMiniRuntime) => Omit<Partial<T>, SupportedStyleProps> & { key?: string }

package/src/core/withUnistyles/withUnistyles.native.tsx

@@ -26,6 +26,7 @@ export const withUnistyles = <TComponent, TMappings extends GenericComponentProp
     type PropsWithUnistyles = Partial<TProps> & {
         uniProps?: Mappings<TProps>
     }
+
     const getSecrets = (styleProps: Record<string, any> = {}): MappedSecrets => {
         const styles = Array.isArray(styleProps)
             ? styleProps.flat()
@@ -74,8 +75,8 @@ export const withUnistyles = <TComponent, TMappings extends GenericComponentProp
             addDependencies(Array.from(new Set([...styleSecrets.dependencies, ...contentContainerStyleSecrets.dependencies])))
         }, [narrowedProps.style, narrowedProps.contentContainerStyle])
 
-        const mappingsProps = mappings ? mappings(proxifiedTheme, proxifiedRuntime) : {}
-        const unistyleProps = narrowedProps.uniProps ? narrowedProps.uniProps(proxifiedTheme, proxifiedRuntime) : {}
+        const { key: mappingsKey, ...mappingsProps } = mappings ? mappings(proxifiedTheme, proxifiedRuntime) : {}
+        const { key: uniPropsKey, ...unistyleProps } = narrowedProps.uniProps ? narrowedProps.uniProps(proxifiedTheme, proxifiedRuntime) : {}
 
         const styleSecrets = getSecrets(narrowedProps.style)
         const contentContainerStyleSecrets = getSecrets(narrowedProps.contentContainerStyle)
@@ -90,6 +91,12 @@ export const withUnistyles = <TComponent, TMappings extends GenericComponentProp
             } : {},
         } as any
 
-        return <NativeComponent {...finalProps as TProps} ref={ref} />
+        return (
+            <NativeComponent
+                key={uniPropsKey || mappingsKey}
+                {...finalProps as TProps}
+                ref={ref}
+            />
+        )
     })
 }

package/src/core/withUnistyles/withUnistyles.tsx

@@ -27,16 +27,15 @@ export const withUnistyles = <TComponent, TMappings extends GenericComponentProp
         const contentContainerStyleClassNames = getClassName(narrowedProps.contentContainerStyle)
         const { proxifiedRuntime, proxifiedTheme } = useProxifiedUnistyles()
 
-        const mappingsProps = mappings ? mappings(proxifiedTheme, proxifiedRuntime) : {}
-        const unistyleProps = narrowedProps.uniProps ? narrowedProps.uniProps(proxifiedTheme, proxifiedRuntime) : {}
-
+        const { key: mappingsKey, ...mappingsProps } = mappings ? mappings(proxifiedTheme, proxifiedRuntime) : {}
+        const { key: uniPropsKey, ...unistyleProps } = narrowedProps.uniProps ? narrowedProps.uniProps(proxifiedTheme, proxifiedRuntime) : {}
 
         const emptyStyles = narrowedProps.style
             ? Object.fromEntries(
-                  Object.entries(Object.getOwnPropertyDescriptors(narrowedProps.style))
-                      .filter(([key]) => !key.startsWith("unistyles") && !key.startsWith("_"))
-                      .map(([key]) => [key, undefined])
-              )
+                Object.entries(Object.getOwnPropertyDescriptors(narrowedProps.style))
+                    .filter(([key]) => !key.startsWith("unistyles") && !key.startsWith("_"))
+                    .map(([key]) => [key, undefined])
+            )
             : undefined
 
         const combinedProps = {
@@ -63,7 +62,11 @@ export const withUnistyles = <TComponent, TMappings extends GenericComponentProp
                 className={classNames?.hash}
                 style={{ display: 'contents' }}
             >
-                <NativeComponent {...combinedProps} ref={ref} />
+                <NativeComponent
+                    key={uniPropsKey || mappingsKey}
+                    {...combinedProps}
+                    ref={ref}
+                />
             </div>
         )
     })

package/src/reanimated/index.ts

@@ -1 +1,2 @@
 export { useAnimatedTheme } from './useAnimatedTheme'
+export { useAnimatedVariantColor } from './variant'

package/src/reanimated/variant/index.ts

@@ -0,0 +1 @@
+export * from './useAnimatedVariantColor'

package/src/reanimated/variant/types.ts

@@ -0,0 +1,14 @@
+export type ColorKeys<T> = {
+    [K in keyof T]: K extends string
+        ? K extends `${string}color${string}` | `${string}Color${string}`
+            ? K
+            : never
+        : never
+}[keyof T]
+
+export type UseUpdateVariantColorConfig<T extends Record<string, any>> = {
+    animateCallback?: (from: string, to: string) => void,
+    colorKey: ColorKeys<T>,
+    style: T,
+    secretKey: string | undefined
+}

package/src/reanimated/variant/useAnimatedVariantColor.ts

@@ -0,0 +1,38 @@
+import { interpolateColor, useDerivedValue, useSharedValue } from 'react-native-reanimated'
+import type { ColorKeys } from './types'
+import { useUpdateVariantColor } from './useUpdateVariantColor'
+
+export const useAnimatedVariantColor = <T extends Record<string, any>>(style: T, colorKey: ColorKeys<T>) => {
+    const secretKey = Object.keys(style).find(key => key.startsWith('unistyles_'))
+    // @ts-ignore this is hidden from TS
+    const hasVariants = style[secretKey]?.__stylesheetVariants
+
+    if (!hasVariants || !colorKey.toLowerCase().includes('color')) {
+        throw new Error('useAnimatedVariantColor: Style was not created by Unistyles, does not have variants or has no color property')
+    }
+
+    const { fromValue, toValue } = useUpdateVariantColor({
+        animateCallback: (from, to) => animate(from, to),
+        colorKey,
+        secretKey,
+        style,
+    })
+
+    const progress = useSharedValue(1)
+    const animate = (from: string, to: string) => {
+        'worklet'
+
+        fromValue.set(from)
+        toValue.set(to)
+    }
+
+    const derivedColor = useDerivedValue(() => {
+        return interpolateColor(
+            progress.value,
+            [0, 1],
+            [fromValue.get(), toValue.get()]
+        )
+    })
+
+    return derivedColor
+}

package/src/reanimated/variant/useUpdateVariantColor.native.ts

@@ -0,0 +1,38 @@
+import { useEffect, useLayoutEffect } from 'react'
+import { useSharedValue } from 'react-native-reanimated'
+import { StyleSheet, UnistyleDependency } from '../../specs'
+import type { UseUpdateVariantColorConfig } from './types'
+
+export const useUpdateVariantColor = <T extends Record<string, any>>({
+    colorKey,
+    style,
+    secretKey
+}: UseUpdateVariantColorConfig<T>) => {
+    const fromValue = useSharedValue<string>(style[colorKey])
+    const toValue = useSharedValue<string>(style[colorKey])
+
+    useEffect(() => {
+        // @ts-ignore this is hidden from TS
+        const dispose = StyleSheet.addChangeListener(changedDependencies => {
+            if (changedDependencies.includes(UnistyleDependency.Theme) || changedDependencies.includes(UnistyleDependency.Breakpoints)) {
+                // @ts-ignore
+                const newStyles = style[secretKey]?.uni__getStyles()
+
+                fromValue.set(toValue.value)
+                toValue.set(newStyles[colorKey])
+            }
+        })
+
+        return () => dispose()
+    }, [style, colorKey])
+
+    useLayoutEffect(() => {
+        fromValue.set(toValue.value)
+        toValue.set(style[colorKey])
+    }, [style, colorKey])
+
+    return {
+        fromValue,
+        toValue
+    }
+}

package/src/reanimated/variant/useUpdateVariantColor.ts

@@ -0,0 +1,81 @@
+import { useCallback, useEffect, useLayoutEffect, useMemo, useState } from 'react'
+import { runOnUI, useSharedValue } from 'react-native-reanimated'
+import { UnistyleDependency } from '../../specs'
+import type { UnistylesValues } from '../../types'
+import { services } from '../../web/services'
+import { getClosestBreakpointValue } from '../../web/utils'
+import type { UseUpdateVariantColorConfig } from './types'
+
+export const useUpdateVariantColor = <T extends Record<string, any>>({
+    animateCallback,
+    colorKey,
+    style
+}: UseUpdateVariantColorConfig<T>) => {
+    const [dummyDiv] = useState(() => {
+        const div = document.createElement('div')
+
+        div.style.display = 'none'
+        document.body.appendChild(div)
+
+        return div
+    })
+    const parsedStyles = useMemo(() => {
+        return services.shadowRegistry.addStyles([style]).parsedStyles
+    }, [style])
+    const getCurrentColor = useCallback(
+        () => {
+            if (!parsedStyles) {
+                return 'rgb(0, 0, 0)'
+            }
+
+            const currentColor = parsedStyles[colorKey as keyof UnistylesValues] as string | Record<string, string>
+            const currentColorVar = typeof currentColor === 'string'
+                ? currentColor
+                : getClosestBreakpointValue<string>(services.runtime, currentColor) ?? 'rgb(0, 0, 0)'
+
+            if (currentColorVar.startsWith('var(--')) {
+                dummyDiv.style.color = currentColorVar
+
+                return getComputedStyle(dummyDiv).color
+            }
+
+            return currentColorVar
+        },
+        [style, colorKey]
+    )
+    const fromValue = useSharedValue<string>(getCurrentColor())
+    const toValue = useSharedValue<string>(getCurrentColor())
+
+    useEffect(() => {
+        const dispose = services.listener.addListeners([UnistyleDependency.Theme], () => {
+            runOnUI(() => {
+                animateCallback?.(toValue.get(), getCurrentColor())
+            })()
+        })
+
+        return () => dispose()
+    }, [style, colorKey])
+
+    useLayoutEffect(() => {
+        animateCallback?.(toValue.get(), getCurrentColor())
+
+        const colorStyle = parsedStyles?.[colorKey as keyof UnistylesValues]
+
+        if (typeof colorStyle !== 'object' || colorStyle === null) {
+            return
+        }
+
+        const dispose = services.listener.addListeners([UnistyleDependency.Breakpoints], () => {
+            animateCallback?.(toValue.get(), getCurrentColor())
+        })
+
+        return () => dispose()
+    }, [style, colorKey])
+
+    useEffect(() => () => dummyDiv.remove(), [])
+
+    return {
+        fromValue,
+        toValue
+    }
+}