react-native-reanimated 4.0.2 → 4.1.0-jsx-fix

package/src/fabricUtils.ts

@@ -1,53 +1,40 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 'use strict';
-/* eslint-disable */
-
-import type { ShadowNodeWrapper } from './commonTypes';
-import {
-  findHostInstance,
-  HostInstance,
-} from './platform-specific/findHostInstance';
+import type { ShadowNodeWrapper, WrapperRef } from './commonTypes';
+import type { HostInstance } from './platform-specific/findHostInstance';
+import { findHostInstance } from './platform-specific/findHostInstance';
 
 let getInternalInstanceHandleFromPublicInstance: (ref: unknown) => {
   stateNode: { node: unknown };
 };
 
 export function getShadowNodeWrapperFromRef(
-  ref: React.Component,
+  ref: WrapperRef,
   hostInstance?: HostInstance
 ): ShadowNodeWrapper {
   if (getInternalInstanceHandleFromPublicInstance === undefined) {
     try {
       getInternalInstanceHandleFromPublicInstance =
+        // eslint-disable-next-line @typescript-eslint/no-require-imports, @typescript-eslint/no-var-requires
         require('react-native/Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricPublicInstance')
           .getInternalInstanceHandleFromPublicInstance ??
         ((_ref: any) => _ref._internalInstanceHandle);
-    } catch (e) {
+    } catch {
       getInternalInstanceHandleFromPublicInstance = (_ref: any) =>
         _ref._internalInstanceHandle;
     }
   }
 
-  // TODO: Clean this up since 0.74 is the minimum supported version now.
-  // taken from https://github.com/facebook/react-native/commit/803bb16531697233686efd475f004c1643e03617#diff-d8172256c6d63b5d32db10e54d7b10f37a26b337d5280d89f5bfd7bcea778292R196
-  // @ts-ignore some weird stuff on RN 0.74 - see examples with scrollView
-  const scrollViewRef = ref?.getScrollResponder?.()?.getNativeScrollRef?.();
-  // @ts-ignore some weird stuff on RN 0.74  - see examples with scrollView
-  const otherScrollViewRef = ref?.getNativeScrollRef?.();
-  // @ts-ignore some weird stuff on RN 0.74 - see setNativeProps example
-  const textInputRef = ref?.__internalInstanceHandle?.stateNode?.node;
+  const resolvedRef =
+    ref.getScrollResponder?.()?.getNativeScrollRef?.() ??
+    ref.getNativeScrollRef?.() ??
+    ref;
 
-  let resolvedRef;
-  if (scrollViewRef) {
-    resolvedRef = scrollViewRef.__internalInstanceHandle.stateNode.node;
-  } else if (otherScrollViewRef) {
-    resolvedRef = otherScrollViewRef.__internalInstanceHandle.stateNode.node;
-  } else if (textInputRef) {
-    resolvedRef = textInputRef;
-  } else {
-    const instance = hostInstance ?? findHostInstance(ref);
-    resolvedRef =
-      getInternalInstanceHandleFromPublicInstance(instance).stateNode.node;
-  }
+  const resolvedInstance =
+    ref?.__internalInstanceHandle ??
+    getInternalInstanceHandleFromPublicInstance(
+      hostInstance ?? findHostInstance(resolvedRef)
+    );
 
-  return resolvedRef;
+  return resolvedInstance?.stateNode?.node;
 }

package/src/featureFlags/{dynamicFlags.ts → index.ts}

@@ -1,6 +1,7 @@
 'use strict';
 import { logger } from '../common';
 import { ReanimatedModule } from '../ReanimatedModule';
+import type StaticFeatureFlagsJSON from './staticFlags.json';
 
 type DynamicFlagsType = {
   EXAMPLE_DYNAMIC_FLAG: boolean;
@@ -11,7 +12,7 @@ type DynamicFlagName = keyof Omit<Omit<DynamicFlagsType, 'setFlag'>, 'init'>;
 
 /** @knipIgnore */
 export const DynamicFlags: DynamicFlagsType = {
-  EXAMPLE_DYNAMIC_FLAG: true,
+  EXAMPLE_DYNAMIC_FLAG: false,
 
   init() {
     Object.keys(DynamicFlags).forEach((key) => {
@@ -43,3 +44,34 @@ export function setDynamicFeatureFlag(
 ): void {
   DynamicFlags.setFlag(name, value);
 }
+
+/**
+ * This constant is needed for typechecking and preserving static typechecks in
+ * generated .d.ts files. Without it, the static flags resolve to an object
+ * without specific keys.
+ */
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+const DefaultStaticFeatureFlags = {
+  RUNTIME_TEST_FLAG: false,
+  DISABLE_COMMIT_PAUSING_MECHANISM: false,
+  ANDROID_SYNCHRONOUSLY_UPDATE_UI_PROPS: false,
+  EXPERIMENTAL_CSS_ANIMATIONS_FOR_SVG_COMPONENTS: false,
+  USE_SYNCHRONIZABLE_FOR_MUTABLES: false,
+} as const satisfies typeof StaticFeatureFlagsJSON;
+
+type StaticFeatureFlagsSchema = {
+  -readonly [K in keyof typeof DefaultStaticFeatureFlags]: boolean;
+};
+
+const staticFeatureFlags: Partial<StaticFeatureFlagsSchema> = {};
+
+export function getStaticFeatureFlag(
+  name: keyof StaticFeatureFlagsSchema
+): boolean {
+  if (name in staticFeatureFlags) {
+    return staticFeatureFlags[name]!;
+  }
+  const featureFlagValue = ReanimatedModule.getStaticFeatureFlag(name);
+  staticFeatureFlags[name] = featureFlagValue;
+  return featureFlagValue;
+}

package/src/featureFlags/staticFlags.json

@@ -1,5 +1,7 @@
 {
-  "EXAMPLE_STATIC_FLAG": true,
+  "RUNTIME_TEST_FLAG": false,
   "DISABLE_COMMIT_PAUSING_MECHANISM": false,
-  "ANDROID_SYNCHRONOUSLY_UPDATE_UI_PROPS": false
+  "ANDROID_SYNCHRONOUSLY_UPDATE_UI_PROPS": false,
+  "EXPERIMENTAL_CSS_ANIMATIONS_FOR_SVG_COMPONENTS": false,
+  "USE_SYNCHRONIZABLE_FOR_MUTABLES": false
 }

package/src/helperTypes.ts

@@ -7,15 +7,16 @@ until time comes to refactor the code and get necessary types right.
 This will not be easy though! 
 */
 
-import type { RegisteredStyle, StyleProp } from 'react-native';
+import type { StyleProp } from 'react-native';
 
 import type {
   AnimatedStyle,
   EntryExitAnimationFunction,
   LayoutAnimationFunction,
   SharedValue,
-  TransformArrayItem,
 } from './commonTypes';
+import type { CSSStyle } from './css';
+import type { AddArrayPropertyType } from './css/types';
 import type { BaseAnimationBuilder } from './layoutReanimation/animationBuilder/BaseAnimationBuilder';
 import type { ReanimatedKeyframe } from './layoutReanimation/animationBuilder/Keyframe';
 
@@ -99,29 +100,9 @@ export type AnimatedProps<Props extends object> = RestProps<Props> &
      *
      * @see https://docs.swmansion.com/react-native-reanimated/docs/core/useAnimatedProps
      */
-    animatedProps?: Partial<AnimatedPropsProp<Props>>;
+    animatedProps?: AddArrayPropertyType<
+      Partial<AnimatedPropsProp<Props>> | CSSStyle<Props>
+    >;
   };
 
 // THE LAND OF THE DEPRECATED
-
-/** @deprecated This type is no longer relevant. */
-export type Adaptable<T> =
-  | T
-  | ReadonlyArray<T | ReadonlyArray<T>>
-  | SharedValue<T>;
-
-/** @deprecated This type is no longer relevant. */
-export type AdaptTransforms<T> = {
-  [P in keyof T]: Adaptable<T[P]>;
-};
-
-/** @deprecated Please use {@link TransformArrayItem} type instead. */
-export type TransformStyleTypes = TransformArrayItem;
-
-/** @deprecated This type is no longer relevant. */
-export type AnimatedStyleProp<T> =
-  | AnimatedStyle<T>
-  | RegisteredStyle<AnimatedStyle<T>>;
-
-/** @deprecated Please use {@link AnimatedProps} type instead. */
-export type AnimateProps<Props extends object> = AnimatedProps<Props>;

package/src/hook/commonTypes.ts

@@ -1,5 +1,5 @@
 'use strict';
-import type { Component, MutableRefObject } from 'react';
+import type { RefObject } from 'react';
 import type {
   ImageStyle,
   NativeScrollEvent,
@@ -13,6 +13,8 @@ import type {
   AnimatedPropsAdapterFunction,
   AnimatedStyle,
   ShadowNodeWrapper,
+  StyleUpdaterContainer,
+  WrapperRef,
 } from '../commonTypes';
 import type { AnimatedProps } from '../createAnimatedComponent/commonTypes';
 import type { ReanimatedHTMLElement } from '../ReanimatedModule/js-reanimated';
@@ -29,19 +31,22 @@ export type MaybeObserverCleanup = (() => void) | undefined;
 
 export type AnimatedRefObserver = (tag: number | null) => MaybeObserverCleanup;
 
-export type AnimatedRef<T extends Component> = {
-  (component?: T):
+export type AnimatedRef<TRef extends WrapperRef> = {
+  (ref?: TRef | null):
     | ShadowNodeWrapper // Native
     | HTMLElement; // web
-  current: T | null;
+  current: TRef | null;
   observe: (observer: AnimatedRefObserver) => void;
   getTag?: () => number | null;
 };
 
 // Might make that type generic if it's ever needed.
-export type AnimatedRefOnJS = AnimatedRef<Component>;
+export type AnimatedRefOnJS = AnimatedRef<WrapperRef>;
 
-/** `AnimatedRef` is mapped to this type on the UI thread via a shareable handle. */
+/**
+ * `AnimatedRef` is mapped to this type on the UI thread via a serializable
+ * handle.
+ */
 export type AnimatedRefOnUI = {
   (): number | ShadowNodeWrapper | null;
 };
@@ -91,14 +96,15 @@ export interface AnimatedStyleHandle<
     value: AnimatedStyle<Style>;
     updater: () => AnimatedStyle<Style>;
   };
+  styleUpdaterContainer: StyleUpdaterContainer;
 }
 
 export interface JestAnimatedStyleHandle<
   Style extends DefaultStyle | AnimatedProps = DefaultStyle,
 > extends AnimatedStyleHandle<Style> {
   jestAnimatedValues:
-    | MutableRefObject<AnimatedStyle<Style>>
-    | MutableRefObject<AnimatedProps>;
+    | RefObject<AnimatedStyle<Style>>
+    | RefObject<AnimatedProps>;
   toJSON: () => string;
 }
 

package/src/hook/useAnimatedRef.ts

@@ -1,14 +1,12 @@
 'use strict';
-import type { Component } from 'react';
 import { useRef, useState } from 'react';
-import type { FlatList } from 'react-native';
 import {
-  makeShareableCloneRecursive,
-  shareableMappingCache,
+  createSerializable,
+  serializableMappingCache,
 } from 'react-native-worklets';
 
 import { SHOULD_BE_USE_WEB } from '../common/constants';
-import type { ShadowNodeWrapper } from '../commonTypes';
+import type { ShadowNodeWrapper, WrapperRef } from '../commonTypes';
 import { getShadowNodeWrapperFromRef } from '../fabricUtils';
 import { makeMutable } from '../mutables';
 import { findNodeHandle } from '../platformFunctions/findNodeHandle';
@@ -19,42 +17,27 @@ import type {
   MaybeObserverCleanup,
 } from './commonTypes';
 
-interface MaybeScrollableComponent extends Component {
-  getNativeScrollRef?: FlatList['getNativeScrollRef'];
-  getScrollableNode?: FlatList['getScrollableNode'];
+function getComponentOrScrollable(ref: WrapperRef) {
+  return ref.getNativeScrollRef?.() ?? ref.getScrollableNode?.() ?? ref;
 }
 
-function getComponentOrScrollable(component: MaybeScrollableComponent) {
-  if (component.getNativeScrollRef) {
-    return component.getNativeScrollRef();
-  }
-  if (component.getScrollableNode) {
-    return component.getScrollableNode();
-  }
-  return component;
-}
-
-function useAnimatedRefBase<TComponent extends Component>(
-  getWrapper: (component: TComponent) => ShadowNodeWrapper
-): AnimatedRef<TComponent> {
+function useAnimatedRefBase<TRef extends WrapperRef>(
+  getWrapper: (ref: TRef) => ShadowNodeWrapper
+): AnimatedRef<TRef> {
   const observers = useRef<Map<AnimatedRefObserver, MaybeObserverCleanup>>(
     new Map()
   ).current;
   const wrapperRef = useRef<ShadowNodeWrapper | null>(null);
+  const resultRef = useRef<AnimatedRef<TRef> | null>(null);
 
-  const ref = useRef<AnimatedRef<TComponent> | null>(null);
-
-  if (!ref.current) {
-    const fun: AnimatedRef<TComponent> = <AnimatedRef<TComponent>>((
-      component
-    ) => {
-      if (component) {
-        wrapperRef.current = getWrapper(component);
+  if (!resultRef.current) {
+    const fun = <AnimatedRef<TRef>>((ref) => {
+      if (ref) {
+        wrapperRef.current = getWrapper(ref);
 
         // We have to unwrap the tag from the shadow node wrapper.
-        fun.getTag = () =>
-          findNodeHandle(getComponentOrScrollable(component) as Component)!;
-        fun.current = component;
+        fun.getTag = () => findNodeHandle(getComponentOrScrollable(ref));
+        fun.current = ref;
 
         if (observers.size) {
           const currentTag = fun?.getTag?.() ?? null;
@@ -84,22 +67,22 @@ function useAnimatedRefBase<TComponent extends Component>(
     };
 
     fun.current = null;
-    ref.current = fun;
+    resultRef.current = fun;
   }
 
-  return ref.current;
+  return resultRef.current;
 }
 
 function useAnimatedRefNative<
-  TComponent extends Component,
->(): AnimatedRef<TComponent> {
+  TRef extends WrapperRef = React.Component,
+>(): AnimatedRef<TRef> {
   const [sharedWrapper] = useState(() =>
     makeMutable<ShadowNodeWrapper | null>(null)
   );
 
-  const ref = useAnimatedRefBase<TComponent>((component) => {
+  const resultRef = useAnimatedRefBase<TRef>((ref) => {
     const currentWrapper = getShadowNodeWrapperFromRef(
-      getComponentOrScrollable(component) as Component
+      getComponentOrScrollable(ref)
     );
 
     sharedWrapper.value = currentWrapper;
@@ -107,32 +90,30 @@ function useAnimatedRefNative<
     return currentWrapper;
   });
 
-  if (!shareableMappingCache.get(ref)) {
-    const animatedRefShareableHandle = makeShareableCloneRecursive({
+  if (!serializableMappingCache.get(resultRef)) {
+    const animatedRefSerializableHandle = createSerializable({
       __init: (): AnimatedRefOnUI => {
         'worklet';
         return () => sharedWrapper.value;
       },
     });
-    shareableMappingCache.set(ref, animatedRefShareableHandle);
+    serializableMappingCache.set(resultRef, animatedRefSerializableHandle);
   }
 
-  return ref;
+  return resultRef;
 }
 
 function useAnimatedRefWeb<
-  TComponent extends Component,
->(): AnimatedRef<TComponent> {
-  return useAnimatedRefBase<TComponent>((component) =>
-    getComponentOrScrollable(component)
-  );
+  TRef extends WrapperRef = React.Component,
+>(): AnimatedRef<TRef> {
+  return useAnimatedRefBase<TRef>((ref) => getComponentOrScrollable(ref));
 }
 
 /**
  * Lets you get a reference of a view that you can use inside a worklet.
  *
- * @returns An object with a `.current` property which contains an instance of a
- *   component.
+ * @returns An object with a `.current` property which contains an instance of
+ *   the reference object.
  * @see https://docs.swmansion.com/react-native-reanimated/docs/core/useAnimatedRef
  */
 export const useAnimatedRef = SHOULD_BE_USE_WEB

package/src/hook/useAnimatedStyle.ts

@@ -1,6 +1,5 @@
 'use strict';
-
-import type { MutableRefObject } from 'react';
+import type { RefObject } from 'react';
 import { useEffect, useRef } from 'react';
 import type { WorkletFunction } from 'react-native-worklets';
 import { isWorkletFunction, makeShareable } from 'react-native-worklets';
@@ -15,6 +14,7 @@ import type {
   NestedObjectValues,
   SharedValue,
   StyleProps,
+  StyleUpdaterContainer,
   Timestamp,
 } from '../commonTypes';
 import { startMapper, stopMapper } from '../core';
@@ -51,6 +51,7 @@ interface AnimatedUpdaterData {
   };
   remoteState: AnimatedState;
   viewDescriptors: ViewDescriptorsSet;
+  styleUpdaterContainer: StyleUpdaterContainer;
 }
 
 function prepareAnimation(
@@ -198,7 +199,8 @@ function styleUpdater(
   updater: WorkletFunction<[], AnimatedStyle<any>> | (() => AnimatedStyle<any>),
   state: AnimatedState,
   animationsActive: SharedValue<boolean>,
-  isAnimatedProps = false
+  isAnimatedProps = false,
+  forceUpdate?: boolean
 ): void {
   'worklet';
   const animations = state.animations ?? {};
@@ -293,7 +295,7 @@ function styleUpdater(
     state.isAnimationCancelled = true;
     state.animations = [];
 
-    if (!shallowEqual(oldValues, newValues)) {
+    if (!shallowEqual(oldValues, newValues) || forceUpdate) {
       updateProps(viewDescriptors, newValues, isAnimatedProps);
     }
   }
@@ -305,8 +307,9 @@ function jestStyleUpdater(
   updater: WorkletFunction<[], AnimatedStyle<any>> | (() => AnimatedStyle<any>),
   state: AnimatedState,
   animationsActive: SharedValue<boolean>,
-  animatedValues: MutableRefObject<AnimatedStyle<any>>,
-  adapters: AnimatedPropsAdapterFunction[]
+  animatedValues: RefObject<AnimatedStyle<any>>,
+  adapters: AnimatedPropsAdapterFunction[],
+  forceUpdate?: boolean
 ): void {
   'worklet';
   const animations: AnimatedStyle<any> = state.animations ?? {};
@@ -390,7 +393,7 @@ function jestStyleUpdater(
   // calculate diff
   state.last = newValues;
 
-  if (!shallowEqual(oldValues, newValues)) {
+  if (!shallowEqual(oldValues, newValues) || forceUpdate) {
     updatePropsJestWrapper(
       viewDescriptors,
       newValues,
@@ -518,6 +521,7 @@ For more, see the docs: \`https://docs.swmansion.com/react-native-reanimated/doc
         isAnimationRunning: false,
       }),
       viewDescriptors: makeViewDescriptorsSet(),
+      styleUpdaterContainer: { current: undefined },
     };
   }
 
@@ -541,7 +545,7 @@ For more, see the docs: \`https://docs.swmansion.com/react-native-reanimated/doc
     }
 
     if (IS_JEST) {
-      fun = () => {
+      fun = (forceUpdate?: boolean) => {
         'worklet';
         jestStyleUpdater(
           shareableViewDescriptors,
@@ -549,21 +553,26 @@ For more, see the docs: \`https://docs.swmansion.com/react-native-reanimated/doc
           remoteState,
           areAnimationsActive,
           jestAnimatedValues,
-          adaptersArray
+          adaptersArray,
+          forceUpdate
         );
       };
     } else {
-      fun = () => {
+      fun = (forceUpdate?: boolean) => {
         'worklet';
         styleUpdater(
           shareableViewDescriptors,
           updaterFn,
           remoteState,
           areAnimationsActive,
-          isAnimatedProps
+          isAnimatedProps,
+          forceUpdate
         );
       };
     }
+    if (animatedUpdaterData.current) {
+      animatedUpdaterData.current.styleUpdaterContainer.current = fun;
+    }
     const mapperId = startMapper(fun, inputs);
     return () => {
       stopMapper(mapperId);
@@ -589,14 +598,17 @@ For more, see the docs: \`https://docs.swmansion.com/react-native-reanimated/doc
   >(null);
 
   if (!animatedStyleHandle.current) {
+    const styleUpdaterContainer =
+      animatedUpdaterData.current.styleUpdaterContainer;
     animatedStyleHandle.current = IS_JEST
       ? {
           viewDescriptors,
           initial,
           jestAnimatedValues,
           toJSON: animatedStyleHandleToJSON,
+          styleUpdaterContainer,
         }
-      : { viewDescriptors, initial };
+      : { viewDescriptors, initial, styleUpdaterContainer };
   }
 
   return animatedStyleHandle.current;

package/src/hook/useHandler.ts

@@ -27,7 +27,7 @@ type GeneralHandlers<
 type GeneralWorkletHandlers<
   Event extends object,
   Context extends Record<string, unknown>,
-> = Record<string, GeneralWorkletHandler<Event, Context> | undefined>;
+> = Record<string, GeneralWorkletHandler<Event, Context>>;
 
 interface ContextWithDependencies<Context extends Record<string, unknown>> {
   context: Context;
@@ -93,7 +93,7 @@ export function useHandler<
 
   dependencies = buildDependencies(
     dependencies,
-    handlers as Record<string, WorkletFunction | undefined>
+    handlers as Record<string, WorkletFunction>
   );
 
   const doDependenciesDiffer = !areDependenciesEqual(

package/src/hook/useScrollOffset.ts

@@ -1,10 +1,8 @@
 'use strict';
-import type { Component } from 'react';
 import { useCallback, useEffect, useRef } from 'react';
-import type { ScrollView, ScrollViewProps } from 'react-native';
 
 import { IS_WEB, logger } from '../common';
-import type { SharedValue } from '../commonTypes';
+import type { SharedValue, WrapperRef } from '../commonTypes';
 import type {
   AnimatedRef,
   ReanimatedScrollEvent,
@@ -15,7 +13,7 @@ import { useEvent } from './useEvent';
 import { useSharedValue } from './useSharedValue';
 
 const NOT_INITIALIZED_WARNING =
-  'animatedRef is not initialized in useScrollViewOffset. Make sure to pass the animated ref to the scrollable component to get scroll offset updates.';
+  'animatedRef is not initialized in useScrollOffset. Make sure to pass the animated ref to the scrollable component to get scroll offset updates.';
 
 const NATIVE_SCROLL_EVENT_NAMES = [
   'onScroll',
@@ -25,11 +23,6 @@ const NATIVE_SCROLL_EVENT_NAMES = [
   'onMomentumScrollEnd',
 ] as const;
 
-type ScrollableComponent = Component<
-  Pick<ScrollViewProps, (typeof NATIVE_SCROLL_EVENT_NAMES)[number]>
-> &
-  Pick<ScrollView, 'getScrollableNode'>;
-
 /**
  * Lets you synchronously get the current offset of a scrollable component.
  *
@@ -44,8 +37,8 @@ export const useScrollOffset = IS_WEB
   ? useScrollOffsetWeb
   : useScrollOffsetNative;
 
-function useScrollOffsetWeb<C extends ScrollableComponent>(
-  animatedRef: AnimatedRef<C> | null,
+function useScrollOffsetWeb<TRef extends WrapperRef>(
+  animatedRef: AnimatedRef<TRef> | null,
   providedOffset?: SharedValue<number>
 ): SharedValue<number> {
   const internalOffset = useSharedValue(0);
@@ -53,7 +46,7 @@ function useScrollOffsetWeb<C extends ScrollableComponent>(
 
   const eventHandler = useCallback(() => {
     'worklet';
-    if (animatedRef) {
+    if (animatedRef?.current) {
       const element = getWebScrollableElement(animatedRef.current);
       // scrollLeft is the X axis scrolled offset, works properly also with RTL layout
       offset.value =
@@ -67,7 +60,7 @@ function useScrollOffsetWeb<C extends ScrollableComponent>(
     }
 
     return animatedRef.observe((tag) => {
-      if (!tag) {
+      if (!animatedRef.current || !tag) {
         logger.warn(NOT_INITIALIZED_WARNING);
         return;
       }
@@ -84,8 +77,8 @@ function useScrollOffsetWeb<C extends ScrollableComponent>(
   return offset;
 }
 
-function useScrollOffsetNative<C extends ScrollableComponent>(
-  animatedRef: AnimatedRef<C> | null,
+function useScrollOffsetNative<TRef extends WrapperRef>(
+  animatedRef: AnimatedRef<TRef> | null,
   providedOffset?: SharedValue<number>
 ): SharedValue<number> {
   const internalOffset = useSharedValue(0);
@@ -125,11 +118,6 @@ function useScrollOffsetNative<C extends ScrollableComponent>(
   return offset;
 }
 
-function getWebScrollableElement(
-  scrollComponent: ScrollableComponent | null
-): HTMLElement {
-  return (
-    (scrollComponent?.getScrollableNode() as unknown as HTMLElement) ??
-    scrollComponent
-  );
+function getWebScrollableElement(scrollComponent: WrapperRef): HTMLElement {
+  return scrollComponent?.getScrollableNode?.() ?? scrollComponent;
 }

package/src/hook/utils.ts

@@ -22,12 +22,11 @@ export function buildWorkletsHash<Args extends unknown[], ReturnValue>(
 // Builds dependencies array for useEvent handlers.
 export function buildDependencies(
   dependencies: DependencyList,
-  handlers: Record<string, WorkletFunction | undefined>
+  handlers: Record<string, WorkletFunction>
 ) {
-  type Handler = (typeof handlers)[keyof typeof handlers];
   const handlersList = Object.values(handlers).filter(
     (handler) => handler !== undefined
-  ) as NonNullable<Handler>[];
+  );
   if (!dependencies) {
     return handlersList;
   }

package/src/index.ts

@@ -54,7 +54,6 @@ export type {
   AnimatedSensor,
   AnimatedStyle,
   AnimatedTransform,
-  AnimateStyle,
   Animation,
   AnimationCallback,
   AnimationObject,
@@ -75,7 +74,6 @@ export type {
   SensorConfig,
   SharedValue,
   StyleProps,
-  StylesOrDefault,
   TransformArrayItem,
   Value3D,
   ValueRotation,
@@ -102,23 +100,11 @@ export {
   makeMutable,
 } from './core';
 export * from './css';
-export type {
-  EasingFactoryFn,
-  EasingFn,
-  EasingFunctionFactory,
-} from './Easing';
+export type { EasingFunctionFactory } from './Easing';
 export { Easing } from './Easing';
-export { setDynamicFeatureFlag } from './featureFlags/dynamicFlags';
+export { getStaticFeatureFlag, setDynamicFeatureFlag } from './featureFlags';
 export type { FrameInfo } from './frameCallback';
-export type {
-  Adaptable,
-  AdaptTransforms,
-  AnimatedProps,
-  AnimatedStyleProp,
-  AnimateProps,
-  EntryOrExitLayoutType,
-  TransformStyleTypes,
-} from './helperTypes';
+export type { AnimatedProps, EntryOrExitLayoutType } from './helperTypes';
 export type {
   AnimatedRef,
   DerivedValue,