7e4e398 · rowtype-yoga/purescript-yoga-react-native

git.iko.soy/rowtype-yoga/purescript-yoga-react-native

commit7e4e398252c8ede10fd1700d24ba127f616dd77b authorMark <mark.eibes@gmail.com> dateFri 20 Feb 2026, 15:16 (7 months ago) parent8d7121a

2 files changed+32

compare with main

unifiedsplit

src/Yoga/React/Native/Reanimated.js+14 src/Yoga/React/Native/Reanimated.purs+18

src/Yoga/React/Native/Reanimated.js+14

@@ -32,6 +32,20 @@ export const useSharedValueImpl = (initial) => () => useSharedValue(initial);

3232export const useAnimatedStyleImpl = (updater) => () =>

3333 useAnimatedStyle(updater);

3434

35+// useAnimatedStyle that interpolates a single shared value into style properties.

36+// styleMap is an array of { prop, inputRange, outputRange, extrapolation }.

37+// This keeps the .value read inside the worklet so Reanimated can track it.

38+export const useInterpolatedStyleImpl = (sv) => (styleMap) => () =>

39+ useAnimatedStyle(() => {

40+ "worklet";

41+ const style = {};

42+ for (let i = 0; i < styleMap.length; i++) {

43+ const { prop, inputRange, outputRange, extrapolation } = styleMap[i];

44+ style[prop] = interpolate(sv.value, inputRange, outputRange, extrapolation);

45+ }

46+ return style;

47+ });

48+

3549// Read shared value

3650export const readSharedValue = (sv) => () => sv.value;

3751

src/Yoga/React/Native/Reanimated.purs+18

@@ -55,6 +55,8 @@ module Yoga.React.Native.Reanimated

5555 , fadeInDuration

5656 , fadeOutDuration

5757 , readValue

58+ , StyleInterp

59+ , useInterpolatedStyle

5860 ) where

5961

6062import Prelude

@@ -103,6 +105,22 @@ foreign import useAnimatedStyleImpl :: (Unit -> Style) -> Effect Style

103105useAnimatedStyle :: (Unit -> Style) -> Hook UseAnimatedStyle Style

104106useAnimatedStyle updater = unsafeHook (useAnimatedStyleImpl updater)

105107

108+-- | Style interpolation config for useInterpolatedStyle.

109+-- | Each entry maps a CSS property name to an interpolation range.

110+type StyleInterp =

111+ { prop :: String

112+ , inputRange :: Array Number

113+ , outputRange :: Array Number

114+ , extrapolation :: ExtrapolationType

115+ }

116+

117+foreign import useInterpolatedStyleImpl :: SharedValue Number -> Array StyleInterp -> Effect Style

118+

119+-- | Hook that interpolates a shared value into style properties inside a worklet.

120+-- | Use this instead of useAnimatedStyle when you need .value reads to be tracked.

121+useInterpolatedStyle :: SharedValue Number -> Array StyleInterp -> Hook UseAnimatedStyle Style

122+useInterpolatedStyle sv styleMap = unsafeHook (useInterpolatedStyleImpl sv styleMap)

123+

106124-- Shared value operations

107125

108126foreign import readSharedValue :: forall a. SharedValue a -> Effect a