chore: Organize third party dep helpers (#412)

## Description

This PR moves `react-native-reanimated` and
`react-native-haptic-feedback` helpers from the common `hooks` and
`utils` dirs to the separate `integrations` directory.

Author: MatiPl01

packages/react-native-sortables/src/components/SortableGrid.tsx

@@ -4,7 +4,8 @@ import type { SharedValue } from 'react-native-reanimated';
 import { useAnimatedStyle, useDerivedValue } from 'react-native-reanimated';
 
 import { DEFAULT_SORTABLE_GRID_PROPS } from '../constants';
-import { useAnimatableValue, useDragEndHandler } from '../hooks';
+import { useDragEndHandler } from '../hooks';
+import { useAnimatableValue } from '../integrations/reanimated';
 import {
   GRID_STRATEGIES,
   GridLayoutProvider,

packages/react-native-sortables/src/components/shared/DraggableView/ActiveItemPortal.tsx

@@ -5,8 +5,8 @@ import {
   useAnimatedReaction
 } from 'react-native-reanimated';
 
+import { useMutableValue } from '../../../integrations/reanimated';
 import { usePortalContext } from '../../../providers';
-import { useMutableValue } from '../../../utils';
 
 type ActiveItemPortalProps = PropsWithChildren<{
   teleportedItemId: string;

packages/react-native-sortables/src/components/shared/DraggableView/DraggableView.tsx

@@ -3,9 +3,15 @@ import { Fragment, memo, useEffect, useState } from 'react';
 import { GestureDetector } from 'react-native-gesture-handler';
 import {
   LayoutAnimationConfig,
+  runOnUI,
   useDerivedValue
 } from 'react-native-reanimated';
 
+import type {
+  AnimatedStyleProp,
+  LayoutAnimation
+} from '../../../integrations/reanimated';
+import { useMutableValue } from '../../../integrations/reanimated';
 import {
   CommonValuesContext,
   ItemContextProvider,
@@ -15,8 +21,7 @@ import {
   useMeasurementsContext,
   usePortalContext
 } from '../../../providers';
-import type { AnimatedStyleProp, LayoutAnimation } from '../../../types';
-import { getContextProvider, useMutableValue } from '../../../utils';
+import { getContextProvider } from '../../../utils';
 import ActiveItemPortal from './ActiveItemPortal';
 import ItemCell from './ItemCell';
 import TeleportedItemCell from './TeleportedItemCell';
@@ -50,9 +55,10 @@ function DraggableView({
   const itemStyles = useItemStyles(key, isActive, activationAnimationProgress);
   const gesture = useItemPanGesture(key, activationAnimationProgress);
 
-  useEffect(() => {
-    return () => removeItemMeasurements(key);
-  }, [key, removeItemMeasurements]);
+  useEffect(
+    () => runOnUI(removeItemMeasurements)(key),
+    [key, removeItemMeasurements]
+  );
 
   useEffect(() => {
     if (!portalContext) {

packages/react-native-sortables/src/components/shared/DraggableView/ItemCell.tsx

@@ -9,9 +9,9 @@ import Animated from 'react-native-reanimated';
 
 import type {
   AnimatedStyleProp,
-  LayoutAnimation,
-  MeasureCallback
-} from '../../../types';
+  LayoutAnimation
+} from '../../../integrations/reanimated';
+import type { MeasureCallback } from '../../../types';
 import AnimatedOnLayoutView from '../AnimatedOnLayoutView';
 
 export type ItemCellProps = PropsWithChildren<{

packages/react-native-sortables/src/components/shared/DraggableView/TeleportedItemCell.tsx

@@ -2,8 +2,9 @@ import type { PropsWithChildren } from 'react';
 import type { SharedValue } from 'react-native-reanimated';
 import { LayoutAnimationConfig } from 'react-native-reanimated';
 
+import type { AnimatedStyleProp } from '../../../integrations/reanimated';
 import { useTeleportedItemStyles } from '../../../providers';
-import type { AnimatedStyleProp, MeasureCallback } from '../../../types';
+import type { MeasureCallback } from '../../../types';
 import ItemCell from './ItemCell';
 
 type TeleportedItemCellProps = PropsWithChildren<{

packages/react-native-sortables/src/components/shared/DropIndicator.tsx

@@ -11,13 +11,13 @@ import Animated, {
   withTiming
 } from 'react-native-reanimated';
 
+import { useMutableValue } from '../../integrations/reanimated';
 import { useCommonValuesContext } from '../../providers';
 import type {
   Dimensions,
   DropIndicatorComponentProps,
   Vector
 } from '../../types';
-import { useMutableValue } from '../../utils';
 
 const DEFAULT_STYLE: ViewStyle = {
   opacity: 0

packages/react-native-sortables/src/constants/props.ts

@@ -1,8 +1,8 @@
 import type { ViewStyle } from 'react-native';
 
 import { DefaultDropIndicator } from '../components/defaults';
+import type { DefaultProps } from '../helperTypes';
 import type {
-  DefaultProps,
   SharedProps,
   SortableCallbacks,
   SortableFlexProps,

…eact-native-sortables/src/types/utils.ts …eact-native-sortables/src/helperTypes.tspackages/react-native-sortables/src/types/utils.ts renamed to packages/react-native-sortables/src/helperTypes.ts packages/react-native-sortables/src/types/utils.ts renamed to packages/react-native-sortables/src/helperTypes.ts

@@ -1,27 +1,15 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-
 import type { SharedValue } from 'react-native-reanimated';
 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 export type AnyFunction = (...args: Array<any>) => any;
 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 export type AnyRecord = Record<string, any>;
 
 export type Simplify<T> = {
   [K in keyof T]: T[K];
 } & {};
 
-export type Animatable<V> = SharedValue<V> | V;
-
-type UnAnimatable<V> = V extends SharedValue<infer U> ? U : V;
-
-export type AnimatableProps<T extends Record<string, any>> = {
-  [K in keyof T]: Animatable<UnAnimatable<T[K]>>;
-};
-
-export type AnimatedValues<T extends Record<string, any>> = {
-  [K in keyof T]: SharedValue<UnAnimatable<T[K]>>;
-};
-
 type RequiredExcept<T, K extends keyof T> = Omit<Required<T>, K> & Pick<T, K>;
 
 export type RequiredBy<T, K extends keyof T> = Omit<T, K> &
@@ -32,7 +20,7 @@ export type PartialBy<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;
 export type Maybe<T> = null | T | undefined;
 
 export type DefaultProps<
-  P extends Record<string, any>,
+  P extends AnyRecord,
   O extends keyof P = never, // optional props
   E extends keyof P = never // exclude from default props (must be passed by the user)
 > = Omit<RequiredExcept<P, O>, E>;
@@ -44,7 +32,7 @@ type ReadonlySharedValue<V> = Readonly<Omit<SharedValue<V>, 'set'>>;
 export type DeepReadonly<T> = {
   readonly [K in keyof T]: T[K] extends SharedValue<infer U>
     ? ReadonlySharedValue<U>
-    : T[K] extends Record<string, any>
+    : T[K] extends AnyRecord
       ? DeepReadonly<T[K]>
       : Readonly<T[K]>;
 };

packages/react-native-sortables/src/hooks/callbacks/useDebouncedStableCallback.ts

@@ -1,6 +1,6 @@
 import { useRef } from 'react';
 
-import type { AnyFunction } from '../../types';
+import type { AnyFunction } from '../../helperTypes';
 import useStableCallback from './useStableCallback';
 
 export default function useDebouncedStableCallback<C extends AnyFunction>(

packages/react-native-sortables/src/hooks/callbacks/useStableCallback.ts

@@ -1,6 +1,6 @@
 import { useCallback, useEffect, useRef } from 'react';
 
-import type { AnyFunction } from '../../types';
+import type { AnyFunction } from '../../helperTypes';
 
 export default function useStableCallback<C extends AnyFunction>(callback: C) {
   const callbackRef = useRef(callback);