diff --git a/packages/pluggableWidgets/bottom-sheet-native/CHANGELOG.md b/packages/pluggableWidgets/bottom-sheet-native/CHANGELOG.md index 53e843cc4..f4e86de0a 100644 --- a/packages/pluggableWidgets/bottom-sheet-native/CHANGELOG.md +++ b/packages/pluggableWidgets/bottom-sheet-native/CHANGELOG.md @@ -6,6 +6,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), ## [Unreleased] +### Fixed + +- Replaced a deprecated prop 'containerHeight' with the respective 'containerLayoutState' option. + ## [5.3.2] - 2026-8-4 ### Fixed diff --git a/packages/pluggableWidgets/bottom-sheet-native/package.json b/packages/pluggableWidgets/bottom-sheet-native/package.json index 565b25da9..2add18485 100644 --- a/packages/pluggableWidgets/bottom-sheet-native/package.json +++ b/packages/pluggableWidgets/bottom-sheet-native/package.json @@ -1,7 +1,7 @@ { "name": "bottom-sheet-native", "widgetName": "BottomSheet", - "version": "5.3.2", + "version": "5.3.3", "license": "Apache-2.0", "repository": { "type": "git", diff --git a/packages/pluggableWidgets/bottom-sheet-native/src/components/CustomModalSheet.tsx b/packages/pluggableWidgets/bottom-sheet-native/src/components/CustomModalSheet.tsx index 2f0fccea2..f4df0c66f 100644 --- a/packages/pluggableWidgets/bottom-sheet-native/src/components/CustomModalSheet.tsx +++ b/packages/pluggableWidgets/bottom-sheet-native/src/components/CustomModalSheet.tsx @@ -1,5 +1,6 @@ import { ReactElement, ReactNode, useCallback, useEffect, useRef, useState } from "react"; import { Modal, Pressable, useWindowDimensions } from "react-native"; +import { useSharedValue } from "react-native-reanimated"; import BottomSheet, { BottomSheetBackdrop, BottomSheetBackdropProps, @@ -17,6 +18,14 @@ interface CustomModalSheetProps { export const CustomModalSheet = (props: CustomModalSheetProps): ReactElement => { const bottomSheetRef = useRef(null); const { height: windowHeight } = useWindowDimensions(); + const containerLayout = useSharedValue({ + height: windowHeight, + offset: { top: 0, bottom: 0, left: 0, right: 0 } + }); + + useEffect(() => { + containerLayout.value = { height: windowHeight, offset: { top: 0, bottom: 0, left: 0, right: 0 } }; + }, [windowHeight, containerLayout]); const externalOpen = props.triggerAttribute?.status === ValueStatus.Available && props.triggerAttribute.value === true; @@ -86,7 +95,7 @@ export const CustomModalSheet = (props: CustomModalSheetProps): ReactElement => animateOnMount enableDynamicSizing maxDynamicContentSize={maxHeight} - containerHeight={windowHeight} + containerLayoutState={containerLayout} enablePanDownToClose onChange={handleChange} onClose={() => handleChange(-1)} diff --git a/packages/pluggableWidgets/bottom-sheet-native/src/package.xml b/packages/pluggableWidgets/bottom-sheet-native/src/package.xml index ad216156a..93fd3e5f0 100644 --- a/packages/pluggableWidgets/bottom-sheet-native/src/package.xml +++ b/packages/pluggableWidgets/bottom-sheet-native/src/package.xml @@ -1,6 +1,6 @@ - +