From 386388a2aca859d155586a7f4b86b9c8cdc87089 Mon Sep 17 00:00:00 2001 From: Paul Rostorp Date: Tue, 1 Nov 2022 10:12:47 +0100 Subject: [PATCH 1/5] find proper index --- src/components/bottomSheet/BottomSheet.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/bottomSheet/BottomSheet.tsx b/src/components/bottomSheet/BottomSheet.tsx index b16644070..5ff6ff7a4 100644 --- a/src/components/bottomSheet/BottomSheet.tsx +++ b/src/components/bottomSheet/BottomSheet.tsx @@ -695,7 +695,7 @@ const BottomSheetComponent = forwardRef( */ animatedNextPosition.value = position; animatedNextPositionIndex.value = - animatedSnapPoints.value.indexOf(position); + animatedSnapPoints.value.indexOf(position + animatedKeyboardHeight.value); /** * fire `onAnimate` callback From 94e8a54f3f4ecbd8c08784b22ceb5f055dc9a35a Mon Sep 17 00:00:00 2001 From: Paul Rostorp Date: Tue, 1 Nov 2022 10:52:16 +0100 Subject: [PATCH 2/5] also add kb height to next position --- src/components/bottomSheet/BottomSheet.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/bottomSheet/BottomSheet.tsx b/src/components/bottomSheet/BottomSheet.tsx index 5ff6ff7a4..e7b382cd0 100644 --- a/src/components/bottomSheet/BottomSheet.tsx +++ b/src/components/bottomSheet/BottomSheet.tsx @@ -693,7 +693,7 @@ const BottomSheetComponent = forwardRef( /** * store next position */ - animatedNextPosition.value = position; + animatedNextPosition.value = position + animatedKeyboardHeight.value; animatedNextPositionIndex.value = animatedSnapPoints.value.indexOf(position + animatedKeyboardHeight.value); From 191a4ec7aabd6d191177eba1c5f56c5e66eb46c9 Mon Sep 17 00:00:00 2001 From: Paul Rostorp Date: Tue, 1 Nov 2022 11:15:11 +0100 Subject: [PATCH 3/5] fix onAnimate wrong "to" index --- src/components/bottomSheet/BottomSheet.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/bottomSheet/BottomSheet.tsx b/src/components/bottomSheet/BottomSheet.tsx index e7b382cd0..797bca140 100644 --- a/src/components/bottomSheet/BottomSheet.tsx +++ b/src/components/bottomSheet/BottomSheet.tsx @@ -603,7 +603,7 @@ const BottomSheetComponent = forwardRef( const handleOnAnimate = useCallback( function handleOnAnimate(toPoint: number) { const snapPoints = animatedSnapPoints.value; - const toIndex = snapPoints.indexOf(toPoint); + const toIndex = snapPoints.indexOf(toPoint + animatedKeyboardHeight.value); print({ component: BottomSheet.name, From 0c7e1532eaac8cd56488ca4c9221c1afdd2714fc Mon Sep 17 00:00:00 2001 From: Paul Rostorp Date: Tue, 1 Nov 2022 11:40:35 +0100 Subject: [PATCH 4/5] pass proper indexes to `onAnimate` --- src/components/bottomSheet/BottomSheet.tsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/src/components/bottomSheet/BottomSheet.tsx b/src/components/bottomSheet/BottomSheet.tsx index 797bca140..2b61e1a54 100644 --- a/src/components/bottomSheet/BottomSheet.tsx +++ b/src/components/bottomSheet/BottomSheet.tsx @@ -603,7 +603,7 @@ const BottomSheetComponent = forwardRef( const handleOnAnimate = useCallback( function handleOnAnimate(toPoint: number) { const snapPoints = animatedSnapPoints.value; - const toIndex = snapPoints.indexOf(toPoint + animatedKeyboardHeight.value); + const toIndex = snapPoints.indexOf(toPoint); print({ component: BottomSheet.name, @@ -693,14 +693,16 @@ const BottomSheetComponent = forwardRef( /** * store next position */ - animatedNextPosition.value = position + animatedKeyboardHeight.value; + const keyboardOffset = animatedKeyboardState.value == KEYBOARD_STATE.SHOWN ? animatedKeyboardHeight.value : 0; + + animatedNextPosition.value = position + keyboardOffset; animatedNextPositionIndex.value = - animatedSnapPoints.value.indexOf(position + animatedKeyboardHeight.value); + animatedSnapPoints.value.indexOf(position + keyboardOffset); /** * fire `onAnimate` callback */ - runOnJS(handleOnAnimate)(position); + runOnJS(handleOnAnimate)(position + keyboardOffset); /** * force animation configs from parameters, if provided From 7e59769f0819c3ceb0ac8e8b0a06f98bf908615f Mon Sep 17 00:00:00 2001 From: Paul Rostorp Date: Tue, 1 Nov 2022 15:21:57 +0100 Subject: [PATCH 5/5] return `INITIAL_SNAP_POINT` when position is zero (fully extended sheet) --- src/components/bottomSheet/BottomSheet.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/bottomSheet/BottomSheet.tsx b/src/components/bottomSheet/BottomSheet.tsx index 2b61e1a54..b5374e81d 100644 --- a/src/components/bottomSheet/BottomSheet.tsx +++ b/src/components/bottomSheet/BottomSheet.tsx @@ -602,8 +602,9 @@ const BottomSheetComponent = forwardRef( ); const handleOnAnimate = useCallback( function handleOnAnimate(toPoint: number) { + const keyboardOffset = animatedKeyboardState.value == KEYBOARD_STATE.SHOWN ? animatedKeyboardHeight.value : 0; const snapPoints = animatedSnapPoints.value; - const toIndex = snapPoints.indexOf(toPoint); + const toIndex = toPoint == 0 ? INITIAL_SNAP_POINT : snapPoints.indexOf(toPoint + keyboardOffset); print({ component: BottomSheet.name, @@ -696,13 +697,12 @@ const BottomSheetComponent = forwardRef( const keyboardOffset = animatedKeyboardState.value == KEYBOARD_STATE.SHOWN ? animatedKeyboardHeight.value : 0; animatedNextPosition.value = position + keyboardOffset; - animatedNextPositionIndex.value = - animatedSnapPoints.value.indexOf(position + keyboardOffset); + animatedNextPositionIndex.value = position == 0 ? INITIAL_SNAP_POINT : animatedSnapPoints.value.indexOf(position + keyboardOffset); /** * fire `onAnimate` callback */ - runOnJS(handleOnAnimate)(position + keyboardOffset); + runOnJS(handleOnAnimate)(position); /** * force animation configs from parameters, if provided