@momo-kits/foundation 0.79.5 → 0.79.6-beta.4

package/Application/ModalScreen.tsx

@@ -1,11 +1,4 @@
-import React, {
-  useCallback,
-  useContext,
-  useEffect,
-  useMemo,
-  useRef,
-  useState,
-} from 'react';
+import React, {useContext, useEffect, useMemo, useRef} from 'react';
 import {
   KeyboardAvoidingView,
   Platform,
@@ -14,7 +7,11 @@ import {
   View,
 } from 'react-native';
 import {SafeAreaView} from 'react-native-safe-area-context';
-import {BottomSheetBackdrop, BottomSheetModal} from '@gorhom/bottom-sheet';
+import {
+  BottomSheetBackdrop,
+  BottomSheetModal,
+  BottomSheetView,
+} from '@gorhom/bottom-sheet';
 import Navigation from './Navigation';
 import {BottomSheetParams, ModalParams} from './types';
 import {Radius, Spacing, Styles} from '../Consts';
@@ -91,11 +88,7 @@ const Modal: React.FC<ModalParams> = props => {
 
 const BottomSheet: React.FC<BottomSheetParams> = props => {
   const {theme, navigator} = useContext(ApplicationContext);
-  const {
-    screen,
-    options,
-    useSnap = true,
-  }: BottomSheetParams = props.route.params;
+  const {screen, options, snapPoint}: BottomSheetParams = props.route.params;
   const Component = useRef(screen).current;
   const navigation = new Navigation(props.navigation, theme);
   const params = {
@@ -105,31 +98,16 @@ const BottomSheet: React.FC<BottomSheetParams> = props => {
 
   delete params.screen;
 
-  const [contentHeight, setContentHeight] = useState(undefined);
   const snapPoints = useMemo(() => {
-    if (useSnap) {
-      return ['50%', '90%'];
+    if (snapPoint) {
+      return [snapPoint];
     }
-    return [contentHeight ?? '50%'];
-  }, [contentHeight]);
+    return ['50%', '90%'];
+  }, []);
 
   const bottomSheetRef = useRef<any>(null);
   const mountedRef = useRef(true);
 
-  let handleOnLayout;
-  if (!useSnap) {
-    handleOnLayout = useCallback(
-      ({
-        nativeEvent: {
-          layout: {height},
-        },
-      }) => {
-        setContentHeight(height);
-      },
-      [],
-    );
-  }
-
   let backgroundColor = theme.colors.background.default;
   if (options?.surface) {
     backgroundColor = theme.colors.background.surface;
@@ -162,7 +140,7 @@ const BottomSheet: React.FC<BottomSheetParams> = props => {
         }}
         handleComponent={null}
         backdropComponent={backdropComponent}>
-        <View onLayout={handleOnLayout} accessibilityLabel={'BottomSheet'}>
+        <BottomSheetView accessibilityLabel={'BottomSheet'}>
           <View style={[styles.sheetContainer, {backgroundColor}]}>
             <View style={styles.indicatorContainer}>
               <View
@@ -222,7 +200,7 @@ const BottomSheet: React.FC<BottomSheetParams> = props => {
               }}
             />
           </View>
-        </View>
+        </BottomSheetView>
       </BottomSheetModal>
     </SafeAreaView>
   );

package/Application/types.ts

@@ -107,7 +107,7 @@ export interface ModalParams extends ScreenParams {
 export interface BottomSheetParams extends ScreenParams {
   [key: string]: any;
   onDismiss?: () => void;
-  useSnap?: boolean;
+  snapPoint?: '30%' | '50%' | '70%' | '90%';
 }
 
 export type NavigationButtonProps = {

package/package.json

@@ -1,10 +1,10 @@
 {
     "name": "@momo-kits/foundation",
-    "version": "0.79.5",
+    "version": "0.79.6-beta.4",
     "description": "React Native Component Kits",
     "main": "index.ts",
     "scripts": {
-        "test": "echo \"Error: no test specified\" && exit 1"
+        "postinstall": "node verify.js"
     },
     "keywords": [
         "@momo-kits/foundation"
@@ -42,4 +42,4 @@
     },
     "author": "@momo-kits/foundation",
     "license": "ISC"
-}
+}

package/verify.js

@@ -0,0 +1,12 @@
+const fs = require('fs');
+const path = require('path');
+
+console.log(`App Info`);
+const main = async () => {
+  const appJson = path.join(__dirname, 'app.json');
+  const app = JSON.parse(fs.readFileSync(appJson, 'utf8'));
+
+  console.log(`App Info: ${app}`);
+};
+
+main().catch(console.error);