fix: allowed content max height be applied for dynamic sizing

gorhom · Jan 3, 2024 · 57c196c · 57c196c
1 parent 8017fb6
commit 57c196c
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 13 deletions.
diff --git a/src/components/bottomSheet/BottomSheet.tsx b/src/components/bottomSheet/BottomSheet.tsx
@@ -89,10 +89,6 @@ type BottomSheet = BottomSheetMethods;
 
 const BottomSheetComponent = forwardRef<BottomSheet, BottomSheetProps>(
   function BottomSheet(props, ref) {
-    //#region validate props
-    usePropsValidator(props);
-    //#endregion
-
     //#region extract props
     const {
       // animations configurations
@@ -161,6 +157,16 @@ const BottomSheetComponent = forwardRef<BottomSheet, BottomSheetProps>(
     } = props;
     //#endregion
 
+    //#region validate props
+    usePropsValidator({
+      index: _providedIndex,
+      snapPoints: _providedSnapPoints,
+      enableDynamicSizing,
+      topInset,
+      bottomInset,
+    });
+    //#endregion
+
     //#region layout variables
     /**
      * This variable is consider an internal variable,

diff --git a/src/components/bottomSheetScrollable/createBottomSheetScrollableComponent.tsx b/src/components/bottomSheetScrollable/createBottomSheetScrollableComponent.tsx
@@ -61,6 +61,7 @@ export function createBottomSheetScrollableComponent<T, P>(
       animatedFooterHeight,
       animatedContentHeight,
       animatedScrollableState,
+      enableDynamicSizing,
     } = useBottomSheetInternal();
     //#endregion
 
@@ -89,7 +90,9 @@ export function createBottomSheetScrollableComponent<T, P>(
     //#region callbacks
     const handleContentSizeChange = useStableCallback(
       (contentWidth: number, contentHeight: number) => {
-        animatedContentHeight.value = contentHeight;
+        if (enableDynamicSizing) {
+          animatedContentHeight.value = contentHeight;
+        }
 
         if (onContentSizeChange) {
           onContentSizeChange(contentWidth, contentHeight);

diff --git a/src/hooks/useNormalizedSnapPoints.ts b/src/hooks/useNormalizedSnapPoints.ts
@@ -1,4 +1,5 @@
-import Animated, {
+import {
+  SharedValue,
   useDerivedValue,
   useSharedValue,
 } from 'react-native-reanimated';
@@ -23,12 +24,12 @@ import {
  */
 export const useNormalizedSnapPoints = (
   snapPoints: BottomSheetProps['snapPoints'],
-  containerHeight: Animated.SharedValue<number>,
-  contentHeight: Animated.SharedValue<number>,
-  handleHeight: Animated.SharedValue<number>,
+  containerHeight: SharedValue<number>,
+  contentHeight: SharedValue<number>,
+  handleHeight: SharedValue<number>,
   enableDynamicSizing: BottomSheetProps['enableDynamicSizing'],
   maxDynamicContentSize: BottomSheetProps['maxDynamicContentSize']
-): [Animated.SharedValue<number[]>, Animated.SharedValue<number>] => {
+): [SharedValue<number[]>, SharedValue<number>] => {
   const dynamicSnapPointIndex = useSharedValue<number>(-1);
   const normalizedSnapPoints = useDerivedValue(() => {
     // early exit, if container layout is not ready
@@ -87,7 +88,6 @@ export const useNormalizedSnapPoints = (
       _normalizedSnapPoints.indexOf(dynamicSnapPoint);
 
     return _normalizedSnapPoints;
-  }, [snapPoints]);
-
+  }, [snapPoints, enableDynamicSizing, maxDynamicContentSize]);
   return [normalizedSnapPoints, dynamicSnapPointIndex];
 };
diff --git a/src/hooks/usePropsValidator.ts b/src/hooks/usePropsValidator.ts
@@ -14,7 +14,10 @@ export const usePropsValidator = ({
   enableDynamicSizing,
   topInset,
   bottomInset,
-}: BottomSheetProps) => {
+}: Pick<
+  BottomSheetProps,
+  'index' | 'snapPoints' | 'enableDynamicSizing' | 'topInset' | 'bottomInset'
+>) => {
   useMemo(() => {
     //#region snap points
     const _snapPoints = snapPoints