@rootnative/inertia 0.0.8 → 0.0.9

package/CHANGELOG.md

@@ -4,6 +4,18 @@ All notable changes to `@rootnative/inertia` are documented here. The format fol
 
 ## [Unreleased]
 
+## [0.0.9] - 2026-08-22
+
+### Changed
+
+- **`useInterpolatedStyle` types its return against the map it was given, so a `style` array no longer needs a cast.** The hook returned `ReturnType<typeof useAnimatedStyle>`, which resolves to Reanimated's `DefaultStyle` — the union `ViewStyle | ImageStyle | TextStyle`. Assigning that union to a single style works, but a **style array** checks every member, and `TextStyle` is not assignable to `ViewStyle` (`cursor` is `string` there and `CursorValue` here). So the documented, dominant call shape — a transform/opacity fragment spread into `style={[base, fragment]}` — was a type error, and consumers cast it away.
+
+  The return is now `InterpolatedStyle<K>`, computed from the map's own keys: view keys satisfy `StyleProp<ViewStyle>`, text-metric keys (`fontSize`, `lineHeight`, `letterSpacing`) satisfy `StyleProp<TextStyle>`, `tintColor` satisfies `StyleProp<ImageStyle>`, and transform keys collapse into the single `transform` array the worklet emits. The narrowing is exact rather than permissive — a text-only fragment is still rejected from a `ViewStyle` slot, pinned in both directions by `__type-tests__/interpolated-style.test-d.tsx`.
+
+  Types only: no runtime change, and no bundle-size change. Removing a now-unnecessary `as ViewStyle` is safe; the cast remains harmless if left in place. `InterpolatedStyle` is exported from the root barrel.
+
+  Surfaced by the `reelist` validation consumer, and it is the independent-application half of the loop reporting its first library defect.
+
 ## [0.0.8] - 2026-08-16
 
 ### Added
@@ -273,7 +285,8 @@ Initial alpha publish. The full initial surface is in place; APIs are still subj
 - SVG path morphing, gradient interpolation, and shared-element transitions across screens are out of scope until `0.2.x` / `1.x` per the roadmap.
 - `react-native-gesture-handler` integration (drag, pan, swipe sub-states) lands in `0.2` via the optional `@rootnative/inertia-gestures` adapter.
 
-[unreleased]: https://github.com/rootnative/inertia/compare/core+gestures+gradients+svg@0.0.8...HEAD
+[unreleased]: https://github.com/rootnative/inertia/compare/core+gestures+gradients+svg@0.0.9...HEAD
+[0.0.9]: https://github.com/rootnative/inertia/releases/tag/core+gestures+gradients+svg@0.0.9
 [0.0.8]: https://github.com/rootnative/inertia/releases/tag/core+gestures+gradients+svg@0.0.8
 [0.0.7]: https://github.com/rootnative/inertia/releases/tag/core+gestures+gradients+svg@0.0.7
 [0.0.6]: https://github.com/rootnative/inertia/releases/tag/core+gestures+gradients+svg@0.0.6

package/README.md

@@ -12,7 +12,7 @@
 
 Declarative animation primitives for React Native, built as a thin wrapper around [`react-native-reanimated`](https://docs.swmansion.com/react-native-reanimated/). Inspired by Framer Motion (web) and react-spring (cross-platform).
 
-> **Status:** `0.0.8` — stable. Pre-`1.0.0` minor versions may break — see the root [README](https://github.com/rootnative/inertia#versioning--release).
+> **Status:** `0.0.9` — stable. Pre-`1.0.0` minor versions may break — see the root [README](https://github.com/rootnative/inertia#versioning--release).
 
 ## Install
 

package/dist/index.d.mts

@@ -1,7 +1,7 @@
 import * as react from 'react';
 import { ComponentType, ReactNode } from 'react';
 import * as react_native from 'react-native';
-import { NativeSyntheticEvent, NativeScrollEvent } from 'react-native';
+import { TextStyle, ImageStyle, ViewStyle, NativeSyntheticEvent, NativeScrollEvent } from 'react-native';
 import { M as MotionComponent, V as VariantsMap, a as MotionProps, N as NamedTransitions, b as TransitionInput, T as TransitionConfig, A as AnimatableValue, E as EasingInput, S as SpringTransition, c as TransitionName, d as VariantController } from './types-DyJpG64F.mjs';
 export { e as AnimateStyle, f as AnimationCallbackInfo, B as BoxShadowInput, D as DecayTransition, g as EasingFunction, h as EasingFunctionFactory, i as GestureSubStates, j as NoAnimationTransition, P as PerPropertyTransition, R as RegisteredTransitions, k as RepeatConfig, l as SequenceStep, m as TimingTransition, n as Transition } from './types-DyJpG64F.mjs';
 import { SharedValue, useAnimatedStyle } from 'react-native-reanimated';
@@ -689,6 +689,22 @@ type InterpolatedStyleMap = {
 } & {
     [K in ColorStyleKey]?: readonly string[];
 };
+/**
+ * The style shape a map of `K` produces. Transform keys collapse into the
+ * single `transform` array the worklet emits; every other key survives under
+ * its own name, typed from the RN style family it belongs to.
+ *
+ * This is what lets the return narrow to `ViewStyle` at a call site whose map
+ * holds only view keys. Reanimated's own `useAnimatedStyle` resolves to
+ * `DefaultStyle` (`ViewStyle | ImageStyle | TextStyle`), and that union is
+ * rejected inside a `StyleProp<ViewStyle>` array — `TextStyle` fails on
+ * `cursor` — so a consumer had to cast.
+ */
+type InterpolatedStyle<K extends keyof InterpolatedStyleMap> = {
+    [P in Exclude<K, TransformKey>]: P extends keyof TextStyle ? TextStyle[P] : P extends keyof ImageStyle ? ImageStyle[P] : P extends keyof ViewStyle ? ViewStyle[P] : never;
+} & (Extract<K, TransformKey> extends never ? unknown : {
+    transform: NonNullable<ViewStyle['transform']>;
+});
 interface UseInterpolatedStyleOptions {
     /**
      * Input range mapped onto every key's output range. Defaults to `[0, 1]`
@@ -746,7 +762,7 @@ interface UseInterpolatedStyleOptions {
  * hook stays fully declarative and hashable so unchanged maps produce zero
  * new UI-thread closures.
  */
-declare function useInterpolatedStyle(progress: SharedValue<number>, map: InterpolatedStyleMap, options?: UseInterpolatedStyleOptions): ReturnType<typeof useAnimatedStyle>;
+declare function useInterpolatedStyle<K extends keyof InterpolatedStyleMap>(progress: SharedValue<number>, map: Pick<InterpolatedStyleMap, K>, options?: UseInterpolatedStyleOptions): InterpolatedStyle<K>;
 
 /**
  * Create an animatable value owned by JS but readable from worklets.
@@ -976,4 +992,4 @@ declare function useShadow({ from, to, progress, }: UseShadowOptions): ReturnTyp
  */
 declare function useVariants<V extends Readonly<Record<string, object>>>(variants: V, initial?: keyof V & string): VariantController<keyof V & string>;
 
-export { AnimatableValue, type AnimationCallback, type Animator, type BoxShadowLayer, type ColorCascadeLayer, type ColorStyleKey, EasingInput, type ExtrapolationMode, type InterpolatedStyleMap, Motion, MotionComponent, MotionConfig, type MotionConfigProps, type MotionConfigValue, MotionProps, NamedTransitions, type NumericStyleKey, Presence, type PresenceContextValue, type ReducedMotion, type ShadowConfig, SpringTransition, Stagger, type StaggerProps, TRANSPARENT, type TransformKey, TransitionConfig, TransitionInput, TransitionName, type UseColorCascadeOptions, type UseColorTransitionOptions, type UseInterpolatedStyleOptions, type UseScrollResult, type UseShadowOptions, type UseTransformOptions, VariantController, VariantsMap, applyDelay, buildReleaseAnimation, createMotionComponent, cubicBezier, ensureWorkletEasing, resolveAnimatableValue, resolveNamedTransition, resolveTransition, useAnimation, useAnimator, useBooleanSpring, useColorCascade, useColorTransition, useInterpolatedStyle, useMotionConfig, useMotionValue, useNamedTransitions, usePresence, useScroll, useShadow, useShouldReduceMotion, useSpring, useStaggerDelay, useTransform, useVariants };
+export { AnimatableValue, type AnimationCallback, type Animator, type BoxShadowLayer, type ColorCascadeLayer, type ColorStyleKey, EasingInput, type ExtrapolationMode, type InterpolatedStyle, type InterpolatedStyleMap, Motion, MotionComponent, MotionConfig, type MotionConfigProps, type MotionConfigValue, MotionProps, NamedTransitions, type NumericStyleKey, Presence, type PresenceContextValue, type ReducedMotion, type ShadowConfig, SpringTransition, Stagger, type StaggerProps, TRANSPARENT, type TransformKey, TransitionConfig, TransitionInput, TransitionName, type UseColorCascadeOptions, type UseColorTransitionOptions, type UseInterpolatedStyleOptions, type UseScrollResult, type UseShadowOptions, type UseTransformOptions, VariantController, VariantsMap, applyDelay, buildReleaseAnimation, createMotionComponent, cubicBezier, ensureWorkletEasing, resolveAnimatableValue, resolveNamedTransition, resolveTransition, useAnimation, useAnimator, useBooleanSpring, useColorCascade, useColorTransition, useInterpolatedStyle, useMotionConfig, useMotionValue, useNamedTransitions, usePresence, useScroll, useShadow, useShouldReduceMotion, useSpring, useStaggerDelay, useTransform, useVariants };

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import * as react from 'react';
 import { ComponentType, ReactNode } from 'react';
 import * as react_native from 'react-native';
-import { NativeSyntheticEvent, NativeScrollEvent } from 'react-native';
+import { TextStyle, ImageStyle, ViewStyle, NativeSyntheticEvent, NativeScrollEvent } from 'react-native';
 import { M as MotionComponent, V as VariantsMap, a as MotionProps, N as NamedTransitions, b as TransitionInput, T as TransitionConfig, A as AnimatableValue, E as EasingInput, S as SpringTransition, c as TransitionName, d as VariantController } from './types-DyJpG64F.js';
 export { e as AnimateStyle, f as AnimationCallbackInfo, B as BoxShadowInput, D as DecayTransition, g as EasingFunction, h as EasingFunctionFactory, i as GestureSubStates, j as NoAnimationTransition, P as PerPropertyTransition, R as RegisteredTransitions, k as RepeatConfig, l as SequenceStep, m as TimingTransition, n as Transition } from './types-DyJpG64F.js';
 import { SharedValue, useAnimatedStyle } from 'react-native-reanimated';
@@ -689,6 +689,22 @@ type InterpolatedStyleMap = {
 } & {
     [K in ColorStyleKey]?: readonly string[];
 };
+/**
+ * The style shape a map of `K` produces. Transform keys collapse into the
+ * single `transform` array the worklet emits; every other key survives under
+ * its own name, typed from the RN style family it belongs to.
+ *
+ * This is what lets the return narrow to `ViewStyle` at a call site whose map
+ * holds only view keys. Reanimated's own `useAnimatedStyle` resolves to
+ * `DefaultStyle` (`ViewStyle | ImageStyle | TextStyle`), and that union is
+ * rejected inside a `StyleProp<ViewStyle>` array — `TextStyle` fails on
+ * `cursor` — so a consumer had to cast.
+ */
+type InterpolatedStyle<K extends keyof InterpolatedStyleMap> = {
+    [P in Exclude<K, TransformKey>]: P extends keyof TextStyle ? TextStyle[P] : P extends keyof ImageStyle ? ImageStyle[P] : P extends keyof ViewStyle ? ViewStyle[P] : never;
+} & (Extract<K, TransformKey> extends never ? unknown : {
+    transform: NonNullable<ViewStyle['transform']>;
+});
 interface UseInterpolatedStyleOptions {
     /**
      * Input range mapped onto every key's output range. Defaults to `[0, 1]`
@@ -746,7 +762,7 @@ interface UseInterpolatedStyleOptions {
  * hook stays fully declarative and hashable so unchanged maps produce zero
  * new UI-thread closures.
  */
-declare function useInterpolatedStyle(progress: SharedValue<number>, map: InterpolatedStyleMap, options?: UseInterpolatedStyleOptions): ReturnType<typeof useAnimatedStyle>;
+declare function useInterpolatedStyle<K extends keyof InterpolatedStyleMap>(progress: SharedValue<number>, map: Pick<InterpolatedStyleMap, K>, options?: UseInterpolatedStyleOptions): InterpolatedStyle<K>;
 
 /**
  * Create an animatable value owned by JS but readable from worklets.
@@ -976,4 +992,4 @@ declare function useShadow({ from, to, progress, }: UseShadowOptions): ReturnTyp
  */
 declare function useVariants<V extends Readonly<Record<string, object>>>(variants: V, initial?: keyof V & string): VariantController<keyof V & string>;
 
-export { AnimatableValue, type AnimationCallback, type Animator, type BoxShadowLayer, type ColorCascadeLayer, type ColorStyleKey, EasingInput, type ExtrapolationMode, type InterpolatedStyleMap, Motion, MotionComponent, MotionConfig, type MotionConfigProps, type MotionConfigValue, MotionProps, NamedTransitions, type NumericStyleKey, Presence, type PresenceContextValue, type ReducedMotion, type ShadowConfig, SpringTransition, Stagger, type StaggerProps, TRANSPARENT, type TransformKey, TransitionConfig, TransitionInput, TransitionName, type UseColorCascadeOptions, type UseColorTransitionOptions, type UseInterpolatedStyleOptions, type UseScrollResult, type UseShadowOptions, type UseTransformOptions, VariantController, VariantsMap, applyDelay, buildReleaseAnimation, createMotionComponent, cubicBezier, ensureWorkletEasing, resolveAnimatableValue, resolveNamedTransition, resolveTransition, useAnimation, useAnimator, useBooleanSpring, useColorCascade, useColorTransition, useInterpolatedStyle, useMotionConfig, useMotionValue, useNamedTransitions, usePresence, useScroll, useShadow, useShouldReduceMotion, useSpring, useStaggerDelay, useTransform, useVariants };
+export { AnimatableValue, type AnimationCallback, type Animator, type BoxShadowLayer, type ColorCascadeLayer, type ColorStyleKey, EasingInput, type ExtrapolationMode, type InterpolatedStyle, type InterpolatedStyleMap, Motion, MotionComponent, MotionConfig, type MotionConfigProps, type MotionConfigValue, MotionProps, NamedTransitions, type NumericStyleKey, Presence, type PresenceContextValue, type ReducedMotion, type ShadowConfig, SpringTransition, Stagger, type StaggerProps, TRANSPARENT, type TransformKey, TransitionConfig, TransitionInput, TransitionName, type UseColorCascadeOptions, type UseColorTransitionOptions, type UseInterpolatedStyleOptions, type UseScrollResult, type UseShadowOptions, type UseTransformOptions, VariantController, VariantsMap, applyDelay, buildReleaseAnimation, createMotionComponent, cubicBezier, ensureWorkletEasing, resolveAnimatableValue, resolveNamedTransition, resolveTransition, useAnimation, useAnimator, useBooleanSpring, useColorCascade, useColorTransition, useInterpolatedStyle, useMotionConfig, useMotionValue, useNamedTransitions, usePresence, useScroll, useShadow, useShouldReduceMotion, useSpring, useStaggerDelay, useTransform, useVariants };

package/dist/index.js

@@ -249,7 +249,11 @@ function buildEntries(map, options) {
 function useInterpolatedStyle(progress, map, options) {
   const extrapolate = mapExtrapolation(options?.extrapolate);
   const sig = buildSignature(map, options);
-  const entries = react.useMemo(() => buildEntries(map, options), [sig]);
+  const entries = react.useMemo(
+    () => buildEntries(map, options),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [sig]
+  );
   return reactNativeReanimated.useAnimatedStyle(() => {
     "worklet";
     const out = {};

package/dist/index.mjs

@@ -256,7 +256,11 @@ function buildEntries(map, options) {
 function useInterpolatedStyle(progress, map, options) {
   const extrapolate = mapExtrapolation(options?.extrapolate);
   const sig = buildSignature(map, options);
-  const entries = useMemo(() => buildEntries(map, options), [sig]);
+  const entries = useMemo(
+    () => buildEntries(map, options),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [sig]
+  );
   return useAnimatedStyle(() => {
     "worklet";
     const out = {};

package/llms.txt

@@ -80,7 +80,7 @@ import { MotionFlatList } from '@rootnative/inertia/flat-list'
 - `useShadow({ from, to, progress })` — pure value-layer interpolator between two `ShadowConfig`s (`shadowOpacity` / `shadowRadius` / `shadowOffset` / `elevation` / `shadowColor`, plus `boxShadow` as a CSS string or `BoxShadowLayer[]` — the shadow surface on web and RN 0.76+ new-arch; multi-layer, CSS-transition padding semantics, malformed strings throw at setup) driven by a `SharedValue<number>` (0→1). Returns an animated style fragment to spread onto `style`; only emits keys present on either side, absent sides default to natural zero. The hook does not animate on its own — drive `progress` with a spring, a scroll-derived `useTransform`, or any other shared value source.
 - `useColorTransition(progress, [from, to], options?)` — pure value-layer interpolator for a single color channel, driven by a `SharedValue<number>` (0→1). Returns an animated style fragment with one color key (default `backgroundColor`; configurable via `options.key` to `color` / `borderColor` / `tintColor` / `shadowColor` / per-side border colors). For raw `SharedValue<string>` output, use `useTransform(progress, [0, 1], [from, to])` instead.
 - `useColorCascade(rest, layers, options?)` — pure value-layer interpolator compositing a **priority-ordered** stack of color layers over a base `rest` color; each `layers` entry is `{ progress: SharedValue<number>, color: string }`, later entries win as their progress rises (equivalent to the nested `focus(error(hover(rest)))` `interpolateColor` chain). `options.key` reuses `ColorStyleKey` (default `backgroundColor`). Returns a spreadable animated style fragment; memoized on a colors+key signature. Color-only by design — cascade a numeric key separately via `useInterpolatedStyle` + `useTransform` max. `useColorTransition` stays the single-layer fast path.
-- `useInterpolatedStyle(progress, map, options?)` — pure value-layer interpolator mapping one `SharedValue<number>` onto **N** style props at once, returned as a spreadable animated style fragment (the multi-key, style-fragment counterpart to `useTransform`'s output-range form). Numeric keys (`opacity` / `height` / `fontSize` / …) route through `interpolate`; transform keys (`translateX` / `scale` / `rotate` / …) lift into a `transform` array in map key-order (`rotate*` emit `'<n>deg'`); color keys (`backgroundColor` / `borderColor` / …) route through `interpolateColor` (a multi-stop `useColorTransition`). Stop types are compile-checked. `options.inputRange` (default `[0,1]` / evenly-spaced) and `options.extrapolate` (default `'clamp'`) apply to every key. Memoized on an order-preserving signature. For function-valued or multi-source composition, drop to `useTransform`'s worklet form or a hand-rolled `useAnimatedStyle`.
+- `useInterpolatedStyle(progress, map, options?)` — pure value-layer interpolator mapping one `SharedValue<number>` onto **N** style props at once, returned as a spreadable animated style fragment (the multi-key, style-fragment counterpart to `useTransform`'s output-range form). Numeric keys (`opacity` / `height` / `fontSize` / …) route through `interpolate`; transform keys (`translateX` / `scale` / `rotate` / …) lift into a `transform` array in map key-order (`rotate*` emit `'<n>deg'`); color keys (`backgroundColor` / `borderColor` / …) route through `interpolateColor` (a multi-stop `useColorTransition`). Stop types are compile-checked. **The return type is derived from the map's own keys (`InterpolatedStyle<K>`), so it narrows to the right style family and needs no cast in a `style` array** — view keys satisfy `StyleProp<ViewStyle>`, text-metric keys (`fontSize` / `lineHeight` / `letterSpacing`) satisfy `StyleProp<TextStyle>`, `tintColor` satisfies `StyleProp<ImageStyle>`, and transform keys collapse into the emitted `transform` array. (Reanimated's `useAnimatedStyle` returns the `DefaultStyle` union, whose `TextStyle` member fails against `ViewStyle` on `cursor` inside a style array.) `options.inputRange` (default `[0,1]` / evenly-spaced) and `options.extrapolate` (default `'clamp'`) apply to every key. Memoized on an order-preserving signature. For function-valued or multi-source composition, drop to `useTransform`'s worklet form or a hand-rolled `useAnimatedStyle`.
 - `useScroll()` — returns `{ scrollX, scrollY, onScroll }` for use with `Motion.ScrollView` or `Motion.FlatList`. Scroll events fire on the UI thread. Set `scrollEventThrottle={16}` on a `Motion.ScrollView`; `Motion.FlatList` defaults it to 1.
 - `createMotionComponent<C>(C)` — wrap any component with the same Motion prop surface, inferring style from `C`.
 - `buildReleaseAnimation(transition, toValue)` — worklet-safe single-step animation builder (spring / timing / decay / no-animation). For assigning Inertia-resolved animations to shared values from inside a gesture worklet. Used internally by `@rootnative/inertia-gestures`'s `useDrag({ onRelease })`.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rootnative/inertia",
-  "version": "0.0.8",
+  "version": "0.0.9",
   "description": "Declarative animation primitives for React Native, built on react-native-reanimated.",
   "license": "MIT",
   "author": "RootNative",

package/src/index.ts

@@ -74,6 +74,7 @@ export type {
   ColorCascadeLayer,
   ColorStyleKey,
   ExtrapolationMode,
+  InterpolatedStyle,
   InterpolatedStyleMap,
   NumericStyleKey,
   ShadowConfig,

package/src/values/index.ts

@@ -18,6 +18,7 @@ export {
 } from './useGesture'
 export {
   useInterpolatedStyle,
+  type InterpolatedStyle,
   type InterpolatedStyleMap,
   type NumericStyleKey,
   type TransformKey,

package/src/values/useInterpolatedStyle.ts

@@ -1,4 +1,5 @@
 import { useMemo } from 'react'
+import type { ImageStyle, TextStyle, ViewStyle } from 'react-native'
 import {
   Extrapolation,
   interpolate,
@@ -83,6 +84,29 @@ export type InterpolatedStyleMap = {
   [K in ColorStyleKey]?: readonly string[]
 }
 
+/**
+ * The style shape a map of `K` produces. Transform keys collapse into the
+ * single `transform` array the worklet emits; every other key survives under
+ * its own name, typed from the RN style family it belongs to.
+ *
+ * This is what lets the return narrow to `ViewStyle` at a call site whose map
+ * holds only view keys. Reanimated's own `useAnimatedStyle` resolves to
+ * `DefaultStyle` (`ViewStyle | ImageStyle | TextStyle`), and that union is
+ * rejected inside a `StyleProp<ViewStyle>` array — `TextStyle` fails on
+ * `cursor` — so a consumer had to cast.
+ */
+export type InterpolatedStyle<K extends keyof InterpolatedStyleMap> = {
+  [P in Exclude<K, TransformKey>]: P extends keyof TextStyle
+    ? TextStyle[P]
+    : P extends keyof ImageStyle
+      ? ImageStyle[P]
+      : P extends keyof ViewStyle
+        ? ViewStyle[P]
+        : never
+} & (Extract<K, TransformKey> extends never
+  ? unknown
+  : { transform: NonNullable<ViewStyle['transform']> })
+
 export interface UseInterpolatedStyleOptions {
   /**
    * Input range mapped onto every key's output range. Defaults to `[0, 1]`
@@ -262,17 +286,17 @@ function buildEntries(
  * hook stays fully declarative and hashable so unchanged maps produce zero
  * new UI-thread closures.
  */
-export function useInterpolatedStyle(
+export function useInterpolatedStyle<K extends keyof InterpolatedStyleMap>(
   progress: SharedValue<number>,
-  map: InterpolatedStyleMap,
+  map: Pick<InterpolatedStyleMap, K>,
   options?: UseInterpolatedStyleOptions,
-): ReturnType<typeof useAnimatedStyle> {
+): InterpolatedStyle<K> {
   const extrapolate = mapExtrapolation(options?.extrapolate)
 
   // Order-preserving signature: the map's key order is load-bearing (transform
   // lifting emits axes in author order), so `stableSig` (which sorts keys) is
   // wrong here — sign the ordered key/output pairs plus the options directly.
-  const sig = buildSignature(map, options)
+  const sig = buildSignature(map as InterpolatedStyleMap, options)
 
   // Resolve every key's plan once on the JS thread so the worklet body only
   // consumes flat arrays — consistent with the JS-thread resolver principle
@@ -280,9 +304,15 @@ export function useInterpolatedStyle(
   // principle 8). Memoized on `sig` so a fresh-but-equal map literal each
   // render yields the same `entries` reference — Reanimated then sees an
   // unchanged closure dependency and does not rebuild the UI-thread worklet.
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  const entries = useMemo<Entry[]>(() => buildEntries(map, options), [sig])
+  const entries = useMemo<Entry[]>(
+    () => buildEntries(map as InterpolatedStyleMap, options),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [sig],
+  )
 
+  // The worklet builds a `Record<string, unknown>` by design — the emitted keys
+  // are only known from `entries` at run time. `InterpolatedStyle<K>` is the
+  // static statement of that same shape, so the cast is where the two meet.
   return useAnimatedStyle(() => {
     'worklet'
     const out: Record<string, unknown> = {}
@@ -313,7 +343,7 @@ export function useInterpolatedStyle(
     }
     if (transform.length > 0) out.transform = transform
     return out
-  })
+  }) as InterpolatedStyle<K>
 }
 
 declare const __DEV__: boolean