@momo-kits/foundation 0.112.1-rn76.7 → 0.112.1-testing.20

package/Application/BottomSheet.tsx

@@ -16,7 +16,7 @@ import {BottomSheetParams} from './types';
 import {Colors, Radius, Spacing, Styles} from '../Consts';
 import {Text} from '../Text';
 import {Icon} from '../Icon';
-import {useHeaderHeight} from '@react-navigation/elements';
+import {useHeaderHeight} from '@react-navigation/stack';
 import Animated, {Easing, Extrapolate} from 'react-native-reanimated';
 
 const BottomSheet: React.FC<BottomSheetParams> = props => {
@@ -82,7 +82,7 @@ const BottomSheet: React.FC<BottomSheetParams> = props => {
           }).start();
         }
       },
-    }),
+    })
   ).current;
 
   let Container: any = View;

package/Application/BottomTab/index.tsx

@@ -1,11 +1,7 @@
 import {createBottomTabNavigator} from '@react-navigation/bottom-tabs';
-import {
-  NavigationContainer,
-  NavigationIndependentTree,
-  useFocusEffect,
-} from '@react-navigation/native';
+import {NavigationContainer, useFocusEffect} from '@react-navigation/native';
 import {createStackNavigator} from '@react-navigation/stack';
-import React, {useContext, useEffect, useRef} from 'react';
+import React, {useContext, useEffect} from 'react';
 import {Animated, Platform, StatusBar} from 'react-native';
 import {useSafeAreaInsets} from 'react-native-safe-area-context';
 import {Colors} from '../../Consts';
@@ -15,7 +11,7 @@ import {ApplicationContext} from '../index';
 import StackScreen from '../StackScreen';
 import {BottomTabProps} from '../types';
 import {getOptions, getStackOptions} from '../utils';
-// import BottomTabBar from './BottomTabBar';
+import BottomTabBar from './BottomTabBar';
 
 const Tab = createBottomTabNavigator();
 const Stack = createStackNavigator();
@@ -25,19 +21,18 @@ const TabScreen: React.FC<any> = ({route, navigation}) => {
 
   const opacityValue = 0.3;
   const scaleValue = 0.97;
-
-  const opacity = useRef(new Animated.Value(opacityValue));
-  const scale = useRef(new Animated.Value(scaleValue));
+  const opacity = new Animated.Value(opacityValue);
+  const scale = new Animated.Value(scaleValue);
 
   useFocusEffect(
     React.useCallback(() => {
       Animated.parallel([
-        Animated.timing(opacity.current, {
+        Animated.timing(opacity, {
           toValue: 1,
           duration: 200,
           useNativeDriver: true,
         }),
-        Animated.timing(scale.current, {
+        Animated.timing(scale, {
           toValue: 1,
           duration: 200,
           useNativeDriver: true,
@@ -46,12 +41,12 @@ const TabScreen: React.FC<any> = ({route, navigation}) => {
       return () => {
         if (navigation.getState().index !== route?.params.index) {
           Animated.parallel([
-            Animated.timing(opacity.current, {
+            Animated.timing(opacity, {
               toValue: opacityValue,
               duration: 200,
               useNativeDriver: true,
             }),
-            Animated.timing(scale.current, {
+            Animated.timing(scale, {
               toValue: scaleValue,
               duration: 200,
               useNativeDriver: true,
@@ -59,7 +54,7 @@ const TabScreen: React.FC<any> = ({route, navigation}) => {
           ]).start();
         }
       };
-    }, [navigation, route?.params.index]),
+    }, [navigation])
   );
 
   let stackOptions = {};
@@ -69,12 +64,7 @@ const TabScreen: React.FC<any> = ({route, navigation}) => {
 
   if (nested) {
     return (
-      <Animated.View
-        style={{
-          flex: 1,
-          opacity: opacity.current,
-          transform: [{scale: scale.current}],
-        }}>
+      <Animated.View style={{flex: 1, opacity, transform: [{scale}]}}>
         <Stack.Navigator>
           <Stack.Screen
             name="Stack"
@@ -92,28 +82,21 @@ const TabScreen: React.FC<any> = ({route, navigation}) => {
   }
 
   return (
-    <Animated.View
-      style={{
-        flex: 1,
-        opacity: opacity.current,
-        transform: [{scale: scale.current}],
-      }}>
-      <NavigationIndependentTree>
-        <NavigationContainer>
-          <Stack.Navigator>
-            <Stack.Screen
-              name="Stack"
-              component={StackScreen}
-              initialParams={{
-                screen,
-                options: stackOptions,
-                initialParams,
-              }}
-              options={{...getStackOptions(), ...options}}
-            />
-          </Stack.Navigator>
-        </NavigationContainer>
-      </NavigationIndependentTree>
+    <Animated.View style={{flex: 1, opacity, transform: [{scale}]}}>
+      <NavigationContainer independent={true}>
+        <Stack.Navigator>
+          <Stack.Screen
+            name="Stack"
+            component={StackScreen}
+            initialParams={{
+              screen,
+              options: stackOptions,
+              initialParams,
+            }}
+            options={{...getStackOptions(), ...options}}
+          />
+        </Stack.Navigator>
+      </NavigationContainer>
     </Animated.View>
   );
 };
@@ -135,7 +118,7 @@ const BottomTab: React.FC<BottomTabProps> = ({
       headerTransparent: true,
       headerBackground: undefined,
     });
-  }, [navigation]);
+  }, []);
 
   const handler: {
     tabPress?: (e: any) => void;
@@ -159,13 +142,13 @@ const BottomTab: React.FC<BottomTabProps> = ({
     <Tab.Navigator
       initialRouteName={initialRouteName}
       backBehavior={'firstRoute'}
-      // tabBar={props => (
-      //   <BottomTabBar
-      //     {...props}
-      //     floatingButton={floatingButton}
-      //     inactiveTintColor={theme.colors.text.hint}
-      //   />
-      // )}
+      tabBar={props => (
+        <BottomTabBar
+          {...props}
+          floatingButton={floatingButton}
+          inactiveTintColor={theme.colors.text.hint}
+        />
+      )}
       tabBarOptions={{
         style: {
           height: 64 + Math.min(insets.bottom, 21),

package/Application/NavigationContainer.tsx

@@ -1,10 +1,8 @@
 import React, {useContext, useEffect, useRef, useState} from 'react';
-import type {NavigationState} from '@react-navigation/routers';
 import {SafeAreaProvider} from 'react-native-safe-area-context';
 import {
   NavigationContainer as ReactNavigationContainer,
   NavigationContainerRef,
-  NavigationIndependentTree,
 } from '@react-navigation/native';
 import {
   createStackNavigator,
@@ -18,7 +16,7 @@ import {getDialogOptions, getModalOptions, getStackOptions} from './utils';
 import {NavigationContainerProps} from './types';
 import {ApplicationContext, MiniAppContext} from './index';
 import Localize from './Localize';
-import {Configs, defaultTheme} from '../Consts';
+import {defaultTheme, Configs} from '../Consts';
 
 const Stack = createStackNavigator();
 
@@ -31,7 +29,7 @@ const NavigationContainer: React.FC<NavigationContainerProps> = ({
   localize = new Localize({vi: {}, en: {}}),
 }) => {
   const context = useContext<any>(MiniAppContext);
-  const navigationRef = useRef<NavigationContainerRef<any>>(null);
+  const navigationRef = useRef<NavigationContainerRef>(null);
   const routes = useRef<any>();
   const isReady = useRef(false);
   const navigator = useRef(new Navigator(navigationRef, isReady));
@@ -52,7 +50,7 @@ const NavigationContainer: React.FC<NavigationContainerProps> = ({
       'onChangeGrid',
       enable => {
         setShowGrid(!!enable);
-      },
+      }
     );
 
     return () => {
@@ -60,10 +58,6 @@ const NavigationContainer: React.FC<NavigationContainerProps> = ({
     };
   }, []);
 
-  /**
-   * translate context method
-   * @param data
-   */
   const translate = (data?: string | {vi: string; en: string}) => {
     if (data && typeof data !== 'string') {
       return localize?.translateData(data);
@@ -80,7 +74,7 @@ const NavigationContainer: React.FC<NavigationContainerProps> = ({
   const onScreenNavigated = (
     preScreenName: string,
     screenName: string,
-    action: string,
+    action: string
   ) => {
     console.log(preScreenName, screenName, action);
     context?.autoTracking?.({
@@ -92,6 +86,9 @@ const NavigationContainer: React.FC<NavigationContainerProps> = ({
       action,
     });
 
+    /**
+     * debug toast
+     */
     maxApi?.showToastDebug?.({
       appId: context.appId,
       message: `${screenName} screen_navigated`,
@@ -99,46 +96,11 @@ const NavigationContainer: React.FC<NavigationContainerProps> = ({
     });
   };
 
-  /**
-   * onStateChange
-   * @param state
-   */
-  const onStateChange = (state: Readonly<NavigationState> | undefined) => {
-    const lastedRoute: any = state?.routes?.[state?.routes?.length - 1];
-    const oldRoute: any = routes.current?.[routes.current?.length - 1];
-    const lasted = lastedRoute?.params?.screen;
-    const previous = oldRoute?.params?.screen;
-    const preScreenName = previous?.name ?? previous?.type?.name;
-    const screenName = lasted?.name ?? lasted?.type?.name;
-
-    let action = 'push';
-    if (routes.current?.length > (state?.routes?.length ?? 0)) {
-      action = 'back';
-    }
-    onScreenNavigated(preScreenName, screenName, action);
-    maxApi?.setObserver('CURRENT_SCREEN', {screenName});
-    routes.current = state?.routes;
-  };
-
-  /**
-   * onReady
-   */
-  const onReady = () => {
-    isReady.current = true;
-    routes.current = navigationRef.current?.getRootState?.()?.routes;
-    maxApi?.getDataObserver('CURRENT_SCREEN', (data: any) => {
-      onScreenNavigated(data?.screenName, screen?.name, 'push');
-      maxApi?.setObserver('CURRENT_SCREEN', {
-        screenName: screen?.name,
-      });
-    });
-  };
-
-  navigator.current.setCurrentContext = setCurrentContext;
-
   const headerBackground = theme.assets?.headerBackground || Configs.headerBar;
   const headerGradient = Configs?.headerGradient || theme.colors?.gradient;
 
+  navigator.current.setCurrentContext = setCurrentContext;
+
   return (
     <SafeAreaProvider>
       <MiniAppContext.Provider
@@ -163,69 +125,72 @@ const NavigationContainer: React.FC<NavigationContainerProps> = ({
             showGrid,
             translate,
           }}>
-          <NavigationIndependentTree>
-            <ReactNavigationContainer
-              theme={{
-                dark: false,
-                colors: {
-                  primary: theme.colors.primary,
-                  background: theme.colors.background.default,
-                  card: theme.colors.background.surface,
-                  text: theme.colors.text.default,
-                  border: theme.colors.border.default,
-                  notification: theme.colors.error.primary,
-                },
-                fonts: {
-                  regular: {
-                    fontFamily: 'SFProText',
-                    fontWeight: '400',
-                  },
-                  medium: {
-                    fontFamily: 'SFProText',
-                    fontWeight: '400',
-                  },
-                  bold: {
-                    fontFamily: 'SFProText',
-                    fontWeight: '400',
-                  },
-                  heavy: {
-                    fontFamily: 'SFProText',
-                    fontWeight: '400',
-                  },
-                },
-              }}
-              ref={navigationRef}
-              onReady={onReady}
-              onStateChange={onStateChange}>
-              <Stack.Navigator
-                initialRouteName="Stack"
-                screenOptions={{
-                  headerMode: 'screen',
-                }}>
-                <Stack.Screen
-                  name="Stack"
-                  component={StackScreen}
-                  initialParams={{screen, initialParams}}
-                  options={{
-                    ...getStackOptions(),
-                    ...(options as StackNavigationOptions),
-                  }}
-                />
-                <Stack.Screen
-                  name="Dialog"
-                  component={StackScreen}
-                  options={getDialogOptions()}
-                  initialParams={{screen}}
-                />
-                <Stack.Screen
-                  name="Modal"
-                  component={ModalScreen}
-                  options={getModalOptions()}
-                  initialParams={{screen}}
-                />
-              </Stack.Navigator>
-            </ReactNavigationContainer>
-          </NavigationIndependentTree>
+          <ReactNavigationContainer
+            theme={{
+              ...theme,
+              colors: {
+                ...theme.colors,
+                background: theme.colors.background.default,
+                card: theme.colors.background.surface,
+                text: theme.colors.text.default,
+                border: theme.colors.border.default,
+                notification: theme.colors.error.primary,
+              },
+            }}
+            ref={navigationRef}
+            onReady={() => {
+              isReady.current = true;
+              routes.current = navigationRef.current?.getRootState?.()?.routes;
+              maxApi?.getDataObserver('CURRENT_SCREEN', (data: any) => {
+                onScreenNavigated(data?.screenName, screen?.name, 'push');
+                maxApi?.setObserver('CURRENT_SCREEN', {
+                  screenName: screen?.name,
+                });
+              });
+            }}
+            onStateChange={state => {
+              const lastedRoute: any =
+                state?.routes?.[state?.routes?.length - 1];
+              const oldRoute: any =
+                routes.current?.[routes.current?.length - 1];
+              const lasted = lastedRoute?.params?.screen;
+              const previous = oldRoute?.params?.screen;
+              const preScreenName = previous?.name ?? previous?.type?.name;
+              const screenName = lasted?.name ?? lasted?.type?.name;
+
+              let action = 'push';
+              if (routes.current?.length > (state?.routes?.length ?? 0)) {
+                action = 'back';
+              }
+              onScreenNavigated(preScreenName, screenName, action);
+              maxApi?.setObserver('CURRENT_SCREEN', {screenName});
+              routes.current = state?.routes;
+            }}
+            independent={true}>
+            <Stack.Navigator initialRouteName="Stack" headerMode="screen">
+              <Stack.Screen
+                name="Stack"
+                component={StackScreen}
+                initialParams={{screen, initialParams}}
+                options={{
+                  ...getStackOptions(),
+                  ...(options as StackNavigationOptions),
+                }}
+              />
+              <Stack.Screen
+                name="Dialog"
+                component={StackScreen}
+                options={getDialogOptions()}
+                initialParams={{screen}}
+              />
+              <Stack.Screen
+                name="Modal"
+                component={ModalScreen}
+                options={getModalOptions()}
+                initialParams={{screen}}
+              />
+            </Stack.Navigator>
+          </ReactNavigationContainer>
         </ApplicationContext.Provider>
       </MiniAppContext.Provider>
     </SafeAreaProvider>

package/Application/StackScreen.tsx

@@ -1,6 +1,6 @@
 import React, {useContext, useEffect, useLayoutEffect, useRef} from 'react';
+import {useHeaderHeight} from '@react-navigation/stack';
 import {Alert, InteractionManager} from 'react-native';
-import {useHeaderHeight} from '@react-navigation/elements';
 import {ScreenParams} from './types';
 import Navigation from './Navigation';
 import {ApplicationContext, MiniAppContext, ScreenContext} from './index';
@@ -77,14 +77,14 @@ const StackScreen: React.FC<ScreenParams> = props => {
       context,
       (data: any) => {
         tracking.current.traceIdLoad = data?.traceId;
-      },
+      }
     );
     navigator?.maxApi?.startTraceScreenInteraction?.(
       screenName,
       context,
       (data: any) => {
         tracking.current.traceIdInteraction = data?.traceId;
-      },
+      }
     );
 
     tracking.current.timeoutTracking = setTimeout(() => {
@@ -121,7 +121,7 @@ const StackScreen: React.FC<ScreenParams> = props => {
       navigator?.maxApi?.stopTrace?.(
         tracking.current.traceIdLoad,
         {value: timeLoad / 1000},
-        null,
+        null
       );
       tracking.current.releaseLoad = true;
 
@@ -139,7 +139,7 @@ const StackScreen: React.FC<ScreenParams> = props => {
       ) {
         Alert.alert(
           `${screenName}- load ${timeLoad}ms`,
-          JSON.stringify(lastElement.current?.children?.current),
+          JSON.stringify(lastElement.current?.children?.current)
         );
       }
     }
@@ -169,7 +169,7 @@ const StackScreen: React.FC<ScreenParams> = props => {
       navigator?.maxApi?.stopTrace?.(
         tracking.current.traceIdInteraction,
         {value: tracking.current.timeInteraction / 1000},
-        null,
+        null
       );
       tracking.current.releaseInteraction = true;
 

package/Input/InputMoney.tsx

@@ -25,203 +25,8 @@ import {
 import {InputMoneyProps} from './index';
 import styles from './styles';
 import {formatMoneyToNumber, formatNumberToMoney} from './utils';
+import {Input} from '@momo-kits/foundation';
 
-const InputMoney = forwardRef(
-  (
-    {
-      onChangeText,
-      floatingValue,
-      floatingIcon,
-      size = 'small',
-      loading,
-      onBlur,
-      onFocus,
-      errorMessage,
-      icon,
-      iconColor,
-      onPressIcon,
-      trailing,
-      trailingColor,
-      onPressTrailing,
-      disabled = false,
-      floatingIconColor,
-      required = false,
-      errorSpacing,
-      style,
-      params,
-      defaultValue = '',
-      accessibilityLabel,
-      hintText,
-      value: _value,
-      onPressFloatingIcon,
-      placeholder = '0đ',
-      currency = 'đ',
-      showClearIcon = true,
-      ...props
-    }: InputMoneyProps,
-    ref
-  ) => {
-    const {theme} = useContext(ApplicationContext);
-
-    const [focused, setFocused] = useState(false);
-    const inputRef = useRef<TextInput>(null);
-
-    useEffect(() => {
-      if (_value) {
-        setValue(validateText(_value));
-        onChangeText?.(formatMoneyToNumber(_value, currency).toString());
-      }
-    }, [_value]);
-
-    const validateText = (text: string) => {
-      const valueFormat = formatMoneyToNumber(text, currency);
-      return formatNumberToMoney(valueFormat, currency);
-    };
-
-    const [value, setValue] = useState(
-      defaultValue ? validateText(defaultValue) : ''
-    );
-
-    const onClearText = () => {
-      inputRef?.current?.clear();
-      setValue('');
-      onChangeText?.('');
-    };
-
-    const _onChangeText = (text: string) => {
-      if (text.length < value.length && value.indexOf(text) === 0) {
-        text = value.slice(0, -2) + currency;
-      }
-      setValue(validateText(text));
-      onChangeText?.(formatMoneyToNumber(text, currency).toString());
-    };
-
-    useImperativeHandle(ref, () => {
-      return {
-        clear: onClearText,
-        focus: () => inputRef.current?.focus(),
-        blur: () => inputRef.current?.blur(),
-        setText: _onChangeText,
-      };
-    });
-
-    const _onFocus = (e: NativeSyntheticEvent<TextInputFocusEventData>) => {
-      setFocused(true);
-      onFocus?.(e);
-    };
-
-    const _onBlur = (e: NativeSyntheticEvent<TextInputFocusEventData>) => {
-      setFocused(false);
-      onBlur?.(e);
-    };
-
-    const renderInputView = () => {
-      const disabledColor = theme.colors.text.disable;
-      let textColor = theme.colors.text.default;
-      let placeholderColor = theme.colors.text.hint;
-      let iconTintColor = trailingColor ?? iconColor;
-
-      if (disabled) {
-        textColor = disabledColor;
-        placeholderColor = disabledColor;
-        iconTintColor = disabledColor;
-      }
-
-      return (
-        <View
-          style={[
-            styles.inputWrapper,
-            {backgroundColor: theme.colors.background.surface},
-            getSizeStyle(size),
-            getBorderColor(theme, focused, errorMessage, disabled),
-          ]}>
-          <FloatingView
-            floatingValue={floatingValue}
-            floatingIconColor={floatingIconColor}
-            disabled={disabled}
-            required={required}
-            floatingIcon={floatingIcon}
-            onPress={onPressFloatingIcon}
-          />
-          <View style={styles.inputView}>
-            <TextInput
-              {...props}
-              accessibilityLabel={accessibilityLabel}
-              editable={!disabled}
-              ref={inputRef}
-              keyboardType={'number-pad'}
-              allowFontScaling={false}
-              style={[
-                styles.moneyInput,
-                {
-                  color: textColor,
-                },
-              ]}
-              value={value}
-              onChangeText={_onChangeText}
-              onFocus={_onFocus}
-              onBlur={_onBlur}
-              selectionColor={theme.colors.primary}
-              placeholderTextColor={placeholderColor}
-              placeholder={placeholder}
-            />
-          </View>
-          <View style={styles.iconView}>
-            {showClearIcon && focused && (
-              <TouchableOpacity
-                style={styles.iconWrapper}
-                onPress={onClearText}>
-                <Icon
-                  source="24_navigation_close_circle_full"
-                  size={16}
-                  color={theme.colors.text.hint}
-                />
-              </TouchableOpacity>
-            )}
-            <RenderTrailing
-              color={iconTintColor}
-              icon={icon}
-              trailing={trailing}
-              onPressTrailing={onPressTrailing}
-              onPressIcon={onPressIcon}
-              loading={loading}
-            />
-          </View>
-        </View>
-      );
-    };
-
-    let inputState = 'active';
-
-    if (value && value?.length > 0) {
-      inputState = 'filled';
-    }
-    if (errorMessage && errorMessage?.length > 0) {
-      inputState = 'error';
-    }
-
-    if (disabled) {
-      inputState = 'disabled';
-    }
-
-    return (
-      <ComponentContext.Provider
-        value={{
-          componentName: 'InputMoney',
-          params,
-          state: inputState,
-        }}>
-        <View style={[style, styles.wrapper]}>
-          {renderInputView()}
-          <ErrorView
-            errorMessage={errorMessage}
-            errorSpacing={errorSpacing}
-            hintText={hintText}
-          />
-        </View>
-      </ComponentContext.Provider>
-    );
-  }
-);
+const InputMoney = Input;
 
 export default InputMoney;

package/Layout/Screen.tsx

@@ -1,5 +1,4 @@
-import {StackNavigationOptions} from '@react-navigation/stack';
-import {useHeaderHeight} from '@react-navigation/elements';
+import {StackNavigationOptions, useHeaderHeight} from '@react-navigation/stack';
 import React, {
   forwardRef,
   Fragment,
@@ -176,14 +175,14 @@ const Screen = forwardRef(
       headerBackground,
       gradientColor,
     }: ScreenProps,
-    ref: any,
+    ref: any
   ) => {
     const screenRef = useRef<View | ScrollView>();
     const {theme} = useContext(ApplicationContext);
     const insets = useSafeAreaInsets();
     const heightHeader = useHeaderHeight();
     const animatedValue = useRef<Animated.Value>(
-      customAnimatedValue || new Animated.Value(0),
+      customAnimatedValue || new Animated.Value(0)
     );
     const currentTint = useRef<string | undefined>(undefined);
     const isTab = navigation?.instance?.getState?.()?.type === 'tab';
@@ -424,7 +423,7 @@ const Screen = forwardRef(
               }
             }
           },
-        },
+        }
       );
     }
 
@@ -574,7 +573,7 @@ const Screen = forwardRef(
         </KeyboardAvoidingView>
       </View>
     );
-  },
+  }
 );
 
 export default Screen;

package/Layout/index.ts

@@ -7,7 +7,6 @@ import {GridContextProps} from './types';
 import Item from './Item';
 import ItemList from './ItemList';
 import ItemSectionList from './ItemSectionList';
-import Screen from './Screen';
 
 const GridContext = createContext<GridContextProps>({
   numberOfColumns: 12,
@@ -25,5 +24,4 @@ export {
   Item,
   ItemList,
   ItemSectionList,
-  Screen,
 };

package/index.ts

@@ -49,3 +49,10 @@ export * from './Title';
 export * from './Title/types';
 export * from './Badge';
 export * from './Badge/types';
+
+/**
+ * export trick for keep old mini app working
+ * @deprecated
+ */
+export * from 'react-native-modalize';
+export * from '@gorhom/bottom-sheet';

package/package.json

@@ -1,35 +1,50 @@
 {
-    "name": "@momo-kits/foundation",
-    "version": "0.112.1-rn76.7",
-    "description": "React Native Component Kits",
-    "main": "index.ts",
-    "scripts": {},
-    "keywords": [
-        "@momo-kits/foundation"
-    ],
-    "dependencies": {
-        "react-native-safe-area-context": "5.1.0",
-        "react-native-linear-gradient": "2.8.3",
-        "react-native-gesture-handler": "2.22.0",
-        "react-native-fast-image": "8.6.3",
-        "react-native-reanimated": "3.16.7",
-        "lottie-react-native": "7.2.2",
-        "@react-navigation/bottom-tabs": "7.2.0",
-        "@react-navigation/core": "7.3.1",
-        "@react-navigation/native": "7.0.14",
-        "@react-navigation/routers": "7.1.2",
-        "@react-navigation/stack": "7.1.1",
-        "@react-navigation/elements": "2.2.5"
-    },
-    "peerDependencies": {
-        "react-native": "*"
-    },
-    "devDependencies": {
-        "@momo-platform/versions": "4.1.11",
-        "@types/color": "3.0.6"
-    },
-    "publishConfig": {
-        "registry": "https://registry.npmjs.org/"
-    },
-    "license": "MoMo"
-}
+  "name": "@momo-kits/foundation",
+  "version": "0.112.1-testing.20",
+  "description": "React Native Component Kits",
+  "main": "index.ts",
+  "scripts": {},
+  "keywords": [
+    "@momo-kits/foundation"
+  ],
+  "dependencies": {
+    "@gorhom/bottom-sheet": "2.4.1",
+    "react-native-modalize": "2.1.1",
+    "react-native-safe-area-context": "3.1.4",
+    "react-native-linear-gradient": "2.8.3",
+    "react-native-gesture-handler": "1.10.3",
+    "react-native-fast-image": "8.1.5",
+    "@react-navigation/bottom-tabs": "https://gitlab.mservice.com.vn/momo-platform/react-native-bottom-tabs.git",
+    "@react-navigation/core": "5.16.1",
+    "@react-navigation/native": "5.9.8",
+    "@react-navigation/routers": "5.7.4",
+    "react-native-reanimated": "git+https://gitlab.mservice.com.vn/momo-platform/react-native-reanimated.git#v1.13.4_gradle_7",
+    "lottie-react-native": "git+https://gitlab.mservice.com.vn/momo-platform/momo-lottie-react-native.git",
+    "@react-navigation/stack": "https://gitlab.mservice.com.vn/momo-platform/react-navigation-stack.git"
+  },
+  "peerDependencies": {
+    "react-native": "*"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.12.9",
+    "@babel/runtime": "^7.12.5",
+    "@react-native-community/eslint-config": "^2.0.0",
+    "@types/jest": "26.0.23",
+    "@types/react-native": "0.64.4",
+    "@types/react-test-renderer": "16.9.2",
+    "@types/d3-shape": "1.3.7",
+    "babel-jest": "^26.6.3",
+    "eslint": "^7.14.0",
+    "jest": "^26.6.3",
+    "metro-react-native-babel-preset": "^0.64.0",
+    "react-test-renderer": "17.0.1",
+    "typescript": "^4.0.3",
+    "@momo-platform/versions": "4.1.11",
+    "react-scanner": "^1.1.0",
+    "@types/color": "3.0.6"
+  },
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
+  },
+  "license": "MoMo"
+}

package/publish.sh

@@ -2,16 +2,16 @@
 
 
 if [ "$1" == "stable" ]; then
-  #npm version $(npm view @momo-kits/foundation@stable version)
-  #npm version patch
+  npm version $(npm view @momo-kits/foundation@stable version)
+  npm version patch
   npm publish --tag stable --access=public
 elif [ "$1" == "latest" ]; then
-  #npm version $(npm view @momo-kits/foundation@latest version)
-  #npm version prerelease --preid=rc
+  npm version $(npm view @momo-kits/foundation@latest version)
+  npm version prerelease --preid=rc
   npm publish --tag latest --access=public
 else
-  #npm version $(npm view @momo-kits/foundation@beta version)
-  #npm version prerelease --preid=beta
+  npm version $(npm view @momo-kits/foundation@beta version)
+  npm version prerelease --preid=beta
   npm publish --tag beta --access=public
 fi
 PACKAGE_NAME=$(npm pkg get name)