@applicaster/quick-brick-core 13.0.0-alpha.1244047241 → 13.0.0-alpha.1290120403

package/App/ModalProvider/ModalBottomSheet/ModalBottomSheetFrame.tsx

@@ -3,15 +3,7 @@ import { LayoutChangeEvent, StyleSheet, View } from "react-native";
 
 import { Handle, HandleProps } from "./Handle";
 import { DraggableBottomSheet } from "./DraggableBottomSheet";
-import {
-  SafeAreaView,
-  useSafeAreaInsets,
-} from "react-native-safe-area-context";
-import {
-  isAndroidPlatform,
-  isAndroidVersionAtLeast,
-  platformSelect,
-} from "@applicaster/zapp-react-native-utils/reactUtils";
+import { SafeAreaView } from "react-native-safe-area-context";
 
 type Props = {
   children: React.ReactChild;
@@ -22,11 +14,7 @@ type Props = {
   visible: boolean;
   handleProps: HandleProps;
   closeToast: () => void;
-  dimensions: {
-    statusBarHeight: any;
-    width: number;
-    height: number;
-  };
+  dimensions: { width: number; height: number };
 };
 
 const styles = StyleSheet.create({
@@ -36,34 +24,6 @@ const styles = StyleSheet.create({
   },
 });
 
-const defaultBottomOffset = platformSelect({
-  ios: 34,
-  android: 0,
-});
-
-const getSheetHeight = ({ height, bottomOffset, maxHeight, dimensions }) => {
-  return platformSelect({
-    ios: height - bottomOffset,
-    default:
-      !isAndroidVersionAtLeast(35) && isAndroidPlatform()
-        ? (height || maxHeight) - (bottomOffset + dimensions.statusBarHeight)
-        : height || maxHeight,
-  });
-};
-
-const useGetSheetHeight = (height, maxHeight, dimensions) => {
-  const { bottom = defaultBottomOffset } = useSafeAreaInsets();
-
-  const bottomOffset = bottom;
-
-  return getSheetHeight({
-    height,
-    bottomOffset,
-    maxHeight,
-    dimensions,
-  });
-};
-
 export function ModalBottomSheetFrame(props: Props) {
   const {
     children,
@@ -94,28 +54,22 @@ export function ModalBottomSheetFrame(props: Props) {
     }
   };
 
-  const { bottom = defaultBottomOffset } = useSafeAreaInsets();
-
-  const bottomOffset = bottom;
-
-  const sheetHeight = useGetSheetHeight(height, maxHeight, dimensions);
-
   return (
     <DraggableBottomSheet
-      sheetHeight={sheetHeight}
-      visible={height > 0 && visible}
+      sheetHeight={height}
+      visible={visible}
       dismiss={props.closeToast}
       hasHeader={handleProps.enabled}
       header={(dragging) => <Handle {...handleProps} focused={dragging} />}
       maxWidth={maxWidth}
       {...dimensions}
-      height={dimensions.height - bottomOffset}
     >
       <SafeAreaView
         edges={["left", "right", "bottom"]}
         style={[styles.toastFrameContainer, extraStyles]}
+        onLayout={onLayout}
       >
-        <View onLayout={onLayout}>{children}</View>
+        <View>{children}</View>
       </SafeAreaView>
     </DraggableBottomSheet>
   );

package/App/ModalProvider/ModalBottomSheet/index.tsx

@@ -1,7 +1,9 @@
 /// <reference types="@applicaster/applicaster-types" />
 import { useTheme } from "@applicaster/zapp-react-native-utils/theme";
+import { platformSelect } from "@applicaster/zapp-react-native-utils/reactUtils";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
 
-import React, { useCallback, useEffect, useState } from "react";
+import React, { useEffect, useState } from "react";
 import { Keyboard, StyleSheet, View } from "react-native";
 
 import { Overlay } from "./Overlay";
@@ -27,11 +29,20 @@ type Props = {
   modalBottomSheetContentProps: Record<string, any>;
 };
 
+const defaultBottomOffset = platformSelect({
+  ios: 34,
+  android: 0,
+});
+
 export function ModalBottomSheet(props: Props) {
   const theme = useTheme<BaseThemePropertiesMobile>();
   const navigator = useNavigation();
   const dimensions = useDimensions();
   const [visible, setVisible] = useState(true);
+  const dismiss = () => setVisible(false);
+  const { bottom = defaultBottomOffset } = useSafeAreaInsets();
+
+  const bottomOffset = bottom;
 
   const {
     modal_bottom_sheet_background_color: sheetBackgroundColor,
@@ -54,8 +65,6 @@ export function ModalBottomSheet(props: Props) {
     Keyboard.dismiss();
   }, []);
 
-  const dismiss = useCallback(() => setVisible(false), []);
-
   const isTablet = useIsTablet();
 
   const maxWidth = isTablet ? sheetTabletMaxWidth : dimensions.width;
@@ -70,7 +79,7 @@ export function ModalBottomSheet(props: Props) {
       <ModalBottomSheetFrame
         backgroundColor={sheetBackgroundColor}
         cornerRadius={sheetCornerRadius}
-        maxHeight={sheetMaxHeight}
+        maxHeight={sheetMaxHeight + bottomOffset}
         maxWidth={maxWidth}
         dimensions={dimensions}
         visible={visible}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/quick-brick-core",
-  "version": "13.0.0-alpha.1244047241",
+  "version": "13.0.0-alpha.1290120403",
   "description": "Core package for Applicaster's Quick Brick App",
   "main": "index.js",
   "types": "index.d.ts",
@@ -28,13 +28,13 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "13.0.0-alpha.1244047241",
-    "@applicaster/quick-brick-core-plugins": "13.0.0-alpha.1244047241",
-    "@applicaster/zapp-pipes-v2-client": "13.0.0-alpha.1244047241",
-    "@applicaster/zapp-react-native-bridge": "13.0.0-alpha.1244047241",
-    "@applicaster/zapp-react-native-redux": "13.0.0-alpha.1244047241",
-    "@applicaster/zapp-react-native-ui-components": "13.0.0-alpha.1244047241",
-    "@applicaster/zapp-react-native-utils": "13.0.0-alpha.1244047241",
+    "@applicaster/applicaster-types": "13.0.0-alpha.1290120403",
+    "@applicaster/quick-brick-core-plugins": "13.0.0-alpha.1290120403",
+    "@applicaster/zapp-pipes-v2-client": "13.0.0-alpha.1290120403",
+    "@applicaster/zapp-react-native-bridge": "13.0.0-alpha.1290120403",
+    "@applicaster/zapp-react-native-redux": "13.0.0-alpha.1290120403",
+    "@applicaster/zapp-react-native-ui-components": "13.0.0-alpha.1290120403",
+    "@applicaster/zapp-react-native-utils": "13.0.0-alpha.1290120403",
     "atob": "^2.1.2",
     "axios": "^0.28.0",
     "btoa": "^1.2.1",