@momo-kits/foundation 0.92.27 → 0.92.29

package/Application/BottomSheet.tsx

@@ -1,18 +1,18 @@
-import React, {useCallback, useContext, useEffect, useRef} from 'react';
+import React, {useRef, useEffect, useCallback, useContext} from 'react';
 import {
   Animated,
   Dimensions,
   KeyboardAvoidingView,
-  Modal,
   PanResponder,
   Platform,
   StyleSheet,
   TouchableOpacity,
   View,
+  Modal,
 } from 'react-native';
+import {useSafeAreaInsets} from 'react-native-safe-area-context';
 import {ApplicationContext} from './index';
 import {BottomSheetParams} from './types';
-import {useSafeAreaInsets} from 'react-native-safe-area-context';
 import {Colors, Radius, Spacing, Styles} from '../Consts';
 import {Text} from '../Text';
 import {Icon} from '../Icon';
@@ -24,6 +24,7 @@ const BottomSheet: React.FC<BottomSheetParams> = props => {
   const {
     screen: Screen,
     options,
+    useNativeModal = false,
     surface,
     barrierDismissible = false,
     draggable = true,
@@ -36,6 +37,7 @@ const BottomSheet: React.FC<BottomSheetParams> = props => {
       x: 0,
     })
   ).current;
+
   const panResponder = useRef(
     PanResponder.create({
       onStartShouldSetPanResponder: () => draggable,
@@ -61,7 +63,10 @@ const BottomSheet: React.FC<BottomSheetParams> = props => {
       },
     })
   ).current;
-
+  let Container: any = View;
+  if (useNativeModal) {
+    Container = Modal;
+  }
   let backgroundColor = theme.colors.background.default;
   if (surface) {
     backgroundColor = theme.colors.background.surface;
@@ -74,7 +79,7 @@ const BottomSheet: React.FC<BottomSheetParams> = props => {
     Animated.timing(pan, {
       toValue: {x: 0, y: 0},
       useNativeDriver: false,
-      duration: 200,
+      duration: 150,
     }).start();
     return () => {
       props.route.params?.onDismiss?.();
@@ -88,18 +93,20 @@ const BottomSheet: React.FC<BottomSheetParams> = props => {
     if (barrierDismissible && !force) {
       return;
     }
+    setTimeout(() => {
+      callback?.();
+    }, 300);
     Animated.timing(pan, {
       toValue: {x: 0, y: heightDevice},
       useNativeDriver: false,
       duration: 200,
     }).start(() => {
       navigator?.pop();
-      callback?.();
     });
   };
 
   /**
-   * manual close
+   * on request close
    */
   const onRequestClose = useCallback((callback?: () => void) => {
     onDismiss(true, callback);
@@ -146,7 +153,11 @@ const BottomSheet: React.FC<BottomSheetParams> = props => {
   }, []);
 
   return (
-    <Modal transparent visible={true} onRequestClose={() => onDismiss()}>
+    <Container
+      transparent
+      visible={true}
+      onRequestClose={() => onDismiss()}
+      style={styles.overlay}>
       <KeyboardAvoidingView
         behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
         keyboardVerticalOffset={keyboardVerticalOffset ?? -20}
@@ -170,23 +181,14 @@ const BottomSheet: React.FC<BottomSheetParams> = props => {
           </View>
         </Animated.View>
       </KeyboardAvoidingView>
-    </Modal>
+    </Container>
   );
 };
 
-export default BottomSheet;
-
 const styles = StyleSheet.create({
-  container: {
-    width: '100%',
-    height: 0,
-    overflow: 'hidden',
-    borderTopLeftRadius: Radius.M,
-    borderTopRightRadius: Radius.M,
-  },
-  draggableContainer: {
-    width: '100%',
-    alignItems: 'center',
+  overlay: {
+    ...StyleSheet.absoluteFillObject,
+    justifyContent: 'flex-end',
   },
   indicator: {
     width: 40,
@@ -210,3 +212,5 @@ const styles = StyleSheet.create({
     marginHorizontal: Spacing.M,
   },
 });
+
+export default BottomSheet;

package/Application/types.ts

@@ -115,6 +115,7 @@ export type BottomSheetParams = {
     title: string;
     surface?: boolean;
   };
+  useNativeModal?: boolean;
   surface?: boolean;
   onDismiss?: (type?: string) => void;
   barrierDismissible?: boolean;

package/Input/InputOTP.tsx

@@ -74,6 +74,7 @@ const InputOTP = forwardRef(
       placeholder,
       onChangeText,
       onBlur,
+      onFocus,
       dataType = 'number',
       params,
       style,
@@ -215,7 +216,7 @@ const InputOTP = forwardRef(
               value={value}
               onChangeText={_onChangeText}
               keyboardType={dataType === 'number' ? 'number-pad' : 'default'}
-              onFocus={onFocusInput}
+              onFocus={onFocus}
               onBlur={onBlurInput}
               style={{opacity: 0}}
               selectionColor={theme.colors.primary}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@momo-kits/foundation",
-    "version": "0.92.27",
+    "version": "0.92.29",
     "description": "React Native Component Kits",
     "main": "index.ts",
     "scripts": {},

package/verify.js

@@ -3,14 +3,14 @@ const path = require('path');
 
 try {
   const packageInfo = JSON.parse(
-    fs.readFileSync(path.join(`${__dirname}`, 'package.json'), 'utf8'),
+    fs.readFileSync(path.join(`${__dirname}`, 'package.json'), 'utf8')
   );
   const packageVersion = parseInt(packageInfo?.version.split('.')?.[1]);
 
   const app = path.join(`${__dirname}/../../../`, 'app.json');
   const miniJson = path.join(`${__dirname}/../../../`, 'package.json');
 
-  if (!fs.existsSync(app) || fs.existsSync(miniJson)) {
+  if (!fs.existsSync(app) || !fs.existsSync(miniJson)) {
     return;
   }
 
@@ -22,10 +22,10 @@ try {
 
   if (packageVersion > iOSAppTarget || packageVersion > androidAppTarget) {
     console.error(
-      `Package ${packageInfo.name} version: ${packageInfo.version} require deploymentTarget ${packageVersion}`,
+      `Package ${packageInfo.name} version: ${packageInfo.version} require deploymentTarget ${packageVersion}`
     );
     throw new Error(
-      `Package ${packageInfo.name} version: ${packageInfo.version} require deploymentTarget ${packageVersion}`,
+      `Package ${packageInfo.name} version: ${packageInfo.version} require deploymentTarget ${packageVersion}`
     );
   }
 
@@ -35,13 +35,13 @@ try {
       packageInfo?.version
   ) {
     console.error(
-      `Package ${packageInfo.name} version: ${packageInfo.version} require install resolutions @momo-platform/momo-core ${packageInfo.version}`,
+      `Package ${packageInfo.name} version: ${packageInfo.version} require install resolutions @momo-platform/momo-core ${packageInfo.version}`
     );
     throw new Error(
-      `Package ${packageInfo.name} version: ${packageInfo.version} require install resolutions @momo-platform/momo-core ${packageInfo.version}`,
+      `Package ${packageInfo.name} version: ${packageInfo.version} require install resolutions @momo-platform/momo-core ${packageInfo.version}`
     );
   }
 } catch (error) {
   console.error(`Installation failed: ${error.message}`);
-  process.exit(1);
+  process.exit(0);
 }