Skip to content

Commit 7f718ea

Browse files
yayveryyayvery
committed
remove deprecated reanimated apis/types
remove deprecated useWorkletCallback remove deprecated Animated.SharedValue and Animated.AnimateProps replaced with SharedValue and AnimatedProps remove deprecated easingfunction
1 parent 0d3590c commit 7f718ea

21 files changed

+138
-110
lines changed

‎example/src/screens/integrations/map/Weather.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,8 @@ import { ShowcaseLabel, useShowcaseTheme } from '@gorhom/showcase-template';
1010
import { MIDDLE_SNAP_POINT } from './LocationListBottomSheet';
1111

1212
interface WeatherProps {
13-
animatedPosition: Animated.SharedValue<number>;
14-
animatedIndex: Animated.SharedValue<number>;
13+
animatedPosition: SharedValue<number>;
14+
animatedIndex: SharedValue<number>;
1515
}
1616

1717
const SPACE = 8;

‎src/components/bottomSheet/BottomSheet.tsx

+22-9
Original file line numberDiff line numberDiff line change
@@ -18,9 +18,9 @@ import Animated, {
1818
Extrapolate,
1919
runOnUI,
2020
cancelAnimation,
21-
useWorkletCallback,
2221
WithSpringConfig,
2322
WithTimingConfig,
23+
type SharedValue,
2424
} from 'react-native-reanimated';
2525
import { State } from 'react-native-gesture-handler';
2626
import {
@@ -203,7 +203,7 @@ const BottomSheetComponent = forwardRef<BottomSheetMethods, BottomSheetProps>(
203203
});
204204
const animatedContainerOffset = useReactiveSharedValue(
205205
_providedContainerOffset ?? INITIAL_CONTAINER_OFFSET
206-
) as Animated.SharedValue<Insets>;
206+
) as SharedValue<Insets>;
207207
const animatedHandleHeight = useReactiveSharedValue(
208208
_providedHandleHeight ?? INITIAL_HANDLE_HEIGHT
209209
);
@@ -528,7 +528,7 @@ const BottomSheetComponent = forwardRef<BottomSheetMethods, BottomSheetProps>(
528528
/**
529529
* Calculate the next position based on keyboard state.
530530
*/
531-
const getNextPosition = useWorkletCallback(
531+
const getNextPosition = useCallback(
532532
function getNextPosition() {
533533
'worklet';
534534
const currentIndex = animatedCurrentIndex.value;
@@ -663,7 +663,8 @@ const BottomSheetComponent = forwardRef<BottomSheetMethods, BottomSheetProps>(
663663
//#endregion
664664

665665
//#region animation
666-
const stopAnimation = useWorkletCallback(() => {
666+
const stopAnimation = useCallback(() => {
667+
'worklet';
667668
cancelAnimation(animatedPosition);
668669
isForcedClosing.value = false;
669670
animatedAnimationSource.value = ANIMATION_SOURCE.NONE;
@@ -674,8 +675,9 @@ const BottomSheetComponent = forwardRef<BottomSheetMethods, BottomSheetProps>(
674675
animatedAnimationSource,
675676
animatedAnimationState,
676677
]);
677-
const animateToPositionCompleted = useWorkletCallback(
678+
const animateToPositionCompleted = useCallback(
678679
function animateToPositionCompleted(isFinished?: boolean) {
680+
'worklet';
679681
isForcedClosing.value = false;
680682

681683
if (!isFinished) {
@@ -695,15 +697,24 @@ const BottomSheetComponent = forwardRef<BottomSheetMethods, BottomSheetProps>(
695697
animatedAnimationState.value = ANIMATION_STATE.STOPPED;
696698
animatedNextPosition.value = INITIAL_VALUE;
697699
animatedNextPositionIndex.value = INITIAL_VALUE;
698-
}
700+
},
701+
[
702+
animatedAnimationSource,
703+
animatedAnimationState,
704+
animatedCurrentIndex,
705+
animatedNextPosition,
706+
animatedNextPositionIndex,
707+
isForcedClosing,
708+
]
699709
);
700-
const animateToPosition: AnimateToPositionType = useWorkletCallback(
710+
const animateToPosition: AnimateToPositionType = useCallback(
701711
function animateToPosition(
702712
position: number,
703713
source: ANIMATION_SOURCE,
704714
velocity: number = 0,
705715
configs?: WithTimingConfig | WithSpringConfig
706716
) {
717+
'worklet';
707718
if (
708719
position === animatedPosition.value ||
709720
position === undefined ||
@@ -772,8 +783,9 @@ const BottomSheetComponent = forwardRef<BottomSheetMethods, BottomSheetProps>(
772783
*
773784
* @param targetPosition position to be set.
774785
*/
775-
const setToPosition = useWorkletCallback(
786+
const setToPosition = useCallback(
776787
function setToPosition(targetPosition: number) {
788+
'worklet';
777789
if (
778790
targetPosition === animatedPosition.value ||
779791
targetPosition === undefined ||
@@ -877,11 +889,12 @@ const BottomSheetComponent = forwardRef<BottomSheetMethods, BottomSheetProps>(
877889
animatedNextPositionIndex,
878890
]
879891
);
880-
const handleSnapToPosition = useWorkletCallback(
892+
const handleSnapToPosition = useCallback(
881893
function handleSnapToPosition(
882894
position: number | string,
883895
animationConfigs?: WithSpringConfig | WithTimingConfig
884896
) {
897+
'worklet';
885898
print({
886899
component: BottomSheet.name,
887900
method: handleSnapToPosition.name,

‎src/components/bottomSheetContainer/types.d.ts

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
import type { ReactNode } from 'react';
22
import type { Insets, StyleProp, ViewStyle } from 'react-native';
3-
import type Animated from 'react-native-reanimated';
3+
import type { SharedValue } from 'react-native-reanimated';
44
import type { BottomSheetProps } from '../bottomSheet/types';
55

66
export interface BottomSheetContainerProps
77
extends Partial<
88
Pick<BottomSheetProps, 'topInset' | 'bottomInset' | 'detached'>
99
> {
10-
containerHeight: Animated.SharedValue<number>;
11-
containerOffset: Animated.SharedValue<Insets>;
10+
containerHeight: SharedValue<number>;
11+
containerOffset: SharedValue<Insets>;
1212
shouldCalculateHeight?: boolean;
1313
style?: StyleProp<ViewStyle>;
1414
children: ReactNode;

‎src/components/bottomSheetDebugView/BottomSheetDebugView.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
import React from 'react';
22
import { View } from 'react-native';
3-
import type Animated from 'react-native-reanimated';
3+
import type { SharedValue } from 'react-native-reanimated';
44
import ReText from './ReText';
55
import { styles } from './styles';
66

77
interface BottomSheetDebugViewProps {
8-
values: Record<string, Animated.SharedValue<number | boolean> | number>;
8+
values: Record<string, SharedValue<number | boolean> | number>;
99
}
1010

1111
const BottomSheetDebugView = ({ values }: BottomSheetDebugViewProps) => {

‎src/components/bottomSheetDebugView/ReText.tsx

+4-2
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,14 @@ import { TextProps as RNTextProps, TextInput } from 'react-native';
33
import Animated, {
44
useAnimatedProps,
55
useDerivedValue,
6+
type SharedValue,
7+
type AnimatedProps,
68
} from 'react-native-reanimated';
79

810
interface TextProps {
911
text: string;
10-
value: Animated.SharedValue<number | boolean> | number;
11-
style?: Animated.AnimateProps<RNTextProps>['style'];
12+
value: SharedValue<number | boolean> | number;
13+
style?: AnimatedProps<RNTextProps>['style'];
1214
}
1315

1416
const AnimatedTextInput = Animated.createAnimatedComponent(TextInput);

‎src/components/bottomSheetDebugView/ReText.webx.tsx

+4-2
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,14 @@ import { TextProps as RNTextProps, TextInput } from 'react-native';
33
import Animated, {
44
useAnimatedReaction,
55
useDerivedValue,
6+
type SharedValue,
7+
type AnimatedProps,
68
} from 'react-native-reanimated';
79

810
interface TextProps {
911
text: string;
10-
value: Animated.SharedValue<number | boolean> | number;
11-
style?: Animated.AnimateProps<RNTextProps>['style'];
12+
value: SharedValue<number | boolean> | number;
13+
style?: AnimatedProps<RNTextProps>['style'];
1214
}
1315

1416
const AnimatedTextInput = Animated.createAnimatedComponent(TextInput);

‎src/components/bottomSheetFooter/types.d.ts

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
import type { ReactNode } from 'react';
22
import { ViewStyle } from 'react-native';
3-
import type Animated from 'react-native-reanimated';
3+
import type { SharedValue } from 'react-native-reanimated';
44

55
export interface BottomSheetFooterProps {
66
/**
77
* Calculated footer animated position.
88
*
9-
* @type Animated.SharedValue<number>
9+
* @type SharedValue<number>
1010
*/
11-
animatedFooterPosition: Animated.SharedValue<number>;
11+
animatedFooterPosition: SharedValue<number>;
1212
}
1313

1414
export interface BottomSheetDefaultFooterProps extends BottomSheetFooterProps {

‎src/components/bottomSheetHandleContainer/types.d.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { PanGestureHandlerProperties } from 'react-native-gesture-handler';
2-
import type Animated from 'react-native-reanimated';
2+
import type { SharedValue } from 'react-native-reanimated';
33
import type { BottomSheetProps } from '../bottomSheet';
44
import type { BottomSheetHandleProps } from '../bottomSheetHandle';
55
import type { useInteractivePanGestureHandlerConfigs } from '../../hooks/useGestureHandler';
@@ -21,5 +21,5 @@ export interface BottomSheetHandleContainerProps
2121
| 'keyboardBehavior'
2222
>,
2323
BottomSheetHandleProps {
24-
handleHeight: Animated.SharedValue<number>;
24+
handleHeight: SharedValue<number>;
2525
}

‎src/components/bottomSheetScrollable/types.d.ts

+6-6
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import type {
1616
NodeHandle,
1717
ScrollResponderMixin,
1818
} from 'react-native';
19-
import type Animated from 'react-native-reanimated';
19+
import type { AnimatedProps } from 'react-native-reanimated';
2020
import type { ScrollEventsHandlersHookType } from '../../types';
2121
import type { FlashListProps } from '@shopify/flash-list';
2222

@@ -62,7 +62,7 @@ export interface BottomSheetScrollableProps {
6262
/**
6363
* The optional lockable scrollable content offset ref, which will remain the same value when scrollable is locked.
6464
*/
65-
lockableScrollableContentOffsetY?: Animated.SharedValue<number>;
65+
lockableScrollableContentOffsetY?: SharedValue<number>;
6666
}
6767

6868
export type ScrollableProps<T> =
@@ -73,7 +73,7 @@ export type ScrollableProps<T> =
7373

7474
//#region FlatList
7575
export type BottomSheetFlatListProps<T> = Omit<
76-
Animated.AnimateProps<FlatListProps<T>>,
76+
AnimatedProps<FlatListProps<T>>,
7777
'decelerationRate' | 'scrollEventThrottle'
7878
> &
7979
BottomSheetScrollableProps & {
@@ -234,7 +234,7 @@ export interface BottomSheetFlashListMethods {
234234

235235
//#region ScrollView
236236
export type BottomSheetScrollViewProps = Omit<
237-
Animated.AnimateProps<ScrollViewProps>,
237+
AnimatedProps<ScrollViewProps>,
238238
'decelerationRate' | 'scrollEventThrottle'
239239
> &
240240
BottomSheetScrollableProps & {
@@ -299,7 +299,7 @@ export interface BottomSheetScrollViewMethods {
299299

300300
//#region SectionList
301301
type BottomSheetSectionListProps<ItemT, SectionT> = Omit<
302-
Animated.AnimateProps<SectionListProps<ItemT, SectionT>>,
302+
AnimatedProps<SectionListProps<ItemT, SectionT>>,
303303
'decelerationRate' | 'scrollEventThrottle'
304304
> &
305305
BottomSheetScrollableProps & {
@@ -342,7 +342,7 @@ export interface BottomSheetSectionListMethods {
342342

343343
//#region
344344
export type BottomSheetVirtualizedListProps<T> = Omit<
345-
Animated.AnimateProps<VirtualizedListProps<T>>,
345+
AnimatedProps<VirtualizedListProps<T>>,
346346
'decelerationRate' | 'scrollEventThrottle'
347347
> &
348348
BottomSheetScrollableProps & {

‎src/constants.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { Dimensions, Platform } from 'react-native';
2-
import Animated, { Easing } from 'react-native-reanimated';
2+
import { Easing, EasingFunction } from 'react-native-reanimated';
33

44
const { height: WINDOW_HEIGHT, width: WINDOW_WIDTH } = Dimensions.get('window');
55
const { height: SCREEN_HEIGHT, width: SCREEN_WIDTH } = Dimensions.get('screen');
@@ -68,7 +68,7 @@ enum SNAP_POINT_TYPE {
6868
DYNAMIC,
6969
}
7070

71-
const ANIMATION_EASING: Animated.EasingFunction = Easing.out(Easing.exp);
71+
const ANIMATION_EASING: EasingFunction = Easing.out(Easing.exp);
7272
const ANIMATION_DURATION = 250;
7373

7474
const ANIMATION_CONFIGS_IOS = {

‎src/contexts/internal.ts

+27-27
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { createContext, RefObject } from 'react';
22
import type { State } from 'react-native-gesture-handler';
3-
import type Animated from 'react-native-reanimated';
3+
import type { SharedValue } from 'react-native-reanimated';
44
import type {
55
AnimateToPositionType,
66
BottomSheetGestureProps,
@@ -28,34 +28,34 @@ export interface BottomSheetInternalContextType
2828
>
2929
> {
3030
// animated states
31-
animatedAnimationState: Animated.SharedValue<ANIMATION_STATE>;
32-
animatedSheetState: Animated.SharedValue<SHEET_STATE>;
33-
animatedScrollableState: Animated.SharedValue<SCROLLABLE_STATE>;
34-
animatedKeyboardState: Animated.SharedValue<KEYBOARD_STATE>;
35-
animatedContentGestureState: Animated.SharedValue<State>;
36-
animatedHandleGestureState: Animated.SharedValue<State>;
31+
animatedAnimationState: SharedValue<ANIMATION_STATE>;
32+
animatedSheetState: SharedValue<SHEET_STATE>;
33+
animatedScrollableState: SharedValue<SCROLLABLE_STATE>;
34+
animatedKeyboardState: SharedValue<KEYBOARD_STATE>;
35+
animatedContentGestureState: SharedValue<State>;
36+
animatedHandleGestureState: SharedValue<State>;
3737

3838
// animated values
39-
animatedSnapPoints: Animated.SharedValue<number[]>;
40-
animatedPosition: Animated.SharedValue<number>;
41-
animatedIndex: Animated.SharedValue<number>;
42-
animatedContainerHeight: Animated.SharedValue<number>;
43-
animatedContentHeight: Animated.SharedValue<number>;
44-
animatedHighestSnapPoint: Animated.SharedValue<number>;
45-
animatedClosedPosition: Animated.SharedValue<number>;
46-
animatedFooterHeight: Animated.SharedValue<number>;
47-
animatedHandleHeight: Animated.SharedValue<number>;
48-
animatedKeyboardHeight: Animated.SharedValue<number>;
49-
animatedKeyboardHeightInContainer: Animated.SharedValue<number>;
50-
animatedScrollableType: Animated.SharedValue<SCROLLABLE_TYPE>;
51-
animatedScrollableContentOffsetY: Animated.SharedValue<number>;
52-
animatedScrollableOverrideState: Animated.SharedValue<SCROLLABLE_STATE>;
53-
isScrollableLocked: Animated.SharedValue<boolean>;
54-
isScrollableRefreshable: Animated.SharedValue<boolean>;
55-
isScrollEnded: Animated.SharedValue<boolean>;
56-
isContentHeightFixed: Animated.SharedValue<boolean>;
57-
isInTemporaryPosition: Animated.SharedValue<boolean>;
58-
shouldHandleKeyboardEvents: Animated.SharedValue<boolean>;
39+
animatedSnapPoints: SharedValue<number[]>;
40+
animatedPosition: SharedValue<number>;
41+
animatedIndex: SharedValue<number>;
42+
animatedContainerHeight: SharedValue<number>;
43+
animatedContentHeight: SharedValue<number>;
44+
animatedHighestSnapPoint: SharedValue<number>;
45+
animatedClosedPosition: SharedValue<number>;
46+
animatedFooterHeight: SharedValue<number>;
47+
animatedHandleHeight: SharedValue<number>;
48+
animatedKeyboardHeight: SharedValue<number>;
49+
animatedKeyboardHeightInContainer: SharedValue<number>;
50+
animatedScrollableType: SharedValue<SCROLLABLE_TYPE>;
51+
animatedScrollableContentOffsetY: SharedValue<number>;
52+
animatedScrollableOverrideState: SharedValue<SCROLLABLE_STATE>;
53+
isScrollableLocked: SharedValue<boolean>;
54+
isScrollableRefreshable: SharedValue<boolean>;
55+
isScrollEnded: SharedValue<boolean>;
56+
isContentHeightFixed: SharedValue<boolean>;
57+
isInTemporaryPosition: SharedValue<boolean>;
58+
shouldHandleKeyboardEvents: SharedValue<boolean>;
5959

6060
// methods
6161
stopAnimation: () => void;

‎src/contexts/modal/internal.ts

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
import { createContext, Ref } from 'react';
22
import type { Insets } from 'react-native';
3-
import type Animated from 'react-native-reanimated';
3+
import type { SharedValue } from 'react-native-reanimated';
44
import type { BottomSheetModalStackBehavior } from '../../components/bottomSheetModal';
55
import type { BottomSheetMethods } from '../../types';
66

77
export interface BottomSheetModalInternalContextType {
8-
containerHeight: Animated.SharedValue<number>;
9-
containerOffset: Animated.SharedValue<Required<Insets>>;
8+
containerHeight: SharedValue<number>;
9+
containerOffset: SharedValue<Required<Insets>>;
1010
mountSheet: (
1111
key: string,
1212
ref: Ref<BottomSheetMethods>,

0 commit comments

Comments
 (0)