@momo-kits/foundation 0.81.43 → 0.81.49

package/Popup/PopupNotify.tsx

@@ -4,7 +4,7 @@ import {PopupNotifyProps} from './types';
 import {Radius, Spacing, Styles} from '../Consts';
 import {Image} from '../Image';
 import {Text} from '../Text';
-import {ApplicationContext} from '../Application';
+import {ApplicationContext, MiniAppContext} from '../Application';
 import {Button} from '../Button';
 import {Icon} from '../Icon';
 
@@ -19,6 +19,7 @@ const PopupNotify: React.FC<PopupNotifyProps> = ({
   buttonDirection = 'row',
   onIconClose,
 }) => {
+  const context = useContext(MiniAppContext);
   const {theme, navigator, translate} = useContext(ApplicationContext);
   const [scrollContent, setScrollContent] = useState(false);
   const closeAction = useRef('touch_outside');
@@ -34,35 +35,31 @@ const PopupNotify: React.FC<PopupNotifyProps> = ({
    * tracking
    */
   useEffect(() => {
-    if (navigator?.trackingInfo) {
-      const routes = navigator.ref.current?.getRootState()?.routes || [];
-      const routesLength = routes.length;
-      let screen_name = routes?.[0]?.params?.screen?.name;
-      if (routesLength > 1) {
-        screen_name = routes[routesLength - 2]?.params?.screen?.name;
-      }
-      const tracking = {
-        feature_code: navigator?.trackingInfo?.code,
-        app_id: navigator?.trackingInfo?.appId,
-        miniapp_version: navigator?.trackingInfo?.buildNumber,
-        flow_partner_id: navigator?.trackingInfo?.flowPartnerId,
-        screen_name,
-        component_type: 'popup',
-        component_name: id,
-        error_code: error ? error : undefined,
-      };
-      navigator?.maxApi?.trackEvent?.('service_component_displayed', {
+    const routes = navigator?.ref.current?.getRootState()?.routes || [];
+    const routesLength = routes.length;
+    let screen_name = routes?.[0]?.params?.screen?.name;
+    if (routesLength > 1) {
+      screen_name = routes[routesLength - 2]?.params?.screen?.name;
+    }
+    const tracking = {
+      ...context,
+      screen_name,
+      component_type: 'popup',
+      component_name: id,
+      error_code: error ? error : undefined,
+    };
+    navigator?.maxApi?.trackEvent?.('service_component_displayed', {
+      ...tracking,
+      trigger_id: '111012100000000000',
+    });
+
+    return () => {
+      navigator?.maxApi?.trackEvent?.('service_popup_dismissed', {
         ...tracking,
-        trigger_id: '111012100000000000',
+        trigger_id: '111154100000000001',
+        action_type: closeAction.current,
       });
-      return () => {
-        navigator?.maxApi?.trackEvent?.('service_popup_dismissed', {
-          ...tracking,
-          trigger_id: '111154100000000001',
-          action_type: closeAction.current,
-        });
-      };
-    }
+    };
   }, []);
 
   /**
@@ -185,19 +182,18 @@ const PopupNotify: React.FC<PopupNotifyProps> = ({
 
   return (
     <View
-      accessibilityLabel={'PopupNotify'}
       style={[
         styles.container,
         {backgroundColor: theme.colors.background.surface},
       ]}>
       {!!image && <Image source={{uri: image}} style={styles.image} />}
       <View style={styles.content}>
-        <Text typography={'title_xs'} numberOfLines={1}>
+        <Text typography={'header_default_bold'} numberOfLines={1}>
           {title}
         </Text>
         <Description style={[styles.description, descriptionStyle]}>
           <Text
-            typography={'paragraph_default'}
+            typography={'body_default_regular'}
             onTextLayout={({nativeEvent: {lines}}) => {
               const enableScroll = lines.length > 3;
               if (enableScroll != scrollContent) {
@@ -210,7 +206,7 @@ const PopupNotify: React.FC<PopupNotifyProps> = ({
         {!!error && (
           <View style={styles.information}>
             <Text
-              typography={'description_xs'}
+              typography={'description_xs_regular'}
               color={theme.colors.text.hint}
               numberOfLines={1}>
               {translate?.('errorCode')}

package/Popup/PopupPromotion.tsx

@@ -1,7 +1,7 @@
 import React, {useContext, useEffect, useRef} from 'react';
 import {StyleSheet, TouchableOpacity, View} from 'react-native';
 import {PopupPromotionProps} from './types';
-import {ApplicationContext} from '../Application';
+import {ApplicationContext, MiniAppContext} from '../Application';
 import {Image} from '../Image';
 import {Radius, Spacing} from '../Consts';
 import {Icon} from '../Icon';
@@ -11,6 +11,7 @@ const PopupPromotion: React.FC<PopupPromotionProps> = ({
   image,
   onIconClose,
 }) => {
+  const context = useContext(MiniAppContext);
   const {theme, navigator} = useContext(ApplicationContext);
   const closeAction = useRef('touch_outside');
 
@@ -18,34 +19,29 @@ const PopupPromotion: React.FC<PopupPromotionProps> = ({
    * tracking
    */
   useEffect(() => {
-    if (navigator?.trackingInfo) {
-      const routes = navigator.ref.current?.getRootState()?.routes || [];
-      const routesLength = routes.length;
-      let screen_name = routes?.[0]?.params?.screen?.name;
-      if (routesLength > 1) {
-        screen_name = routes[routesLength - 2]?.params?.screen?.name;
-      }
-      const tracking = {
-        feature_code: navigator?.trackingInfo?.code,
-        app_id: navigator?.trackingInfo?.appId,
-        miniapp_version: navigator?.trackingInfo?.buildNumber,
-        flow_partner_id: navigator?.trackingInfo?.flowPartnerId,
-        screen_name,
-        component_type: 'popup',
-        component_name: id,
-      };
-      navigator?.maxApi?.trackEvent?.('service_component_displayed', {
+    const routes = navigator?.ref.current?.getRootState()?.routes || [];
+    const routesLength = routes.length;
+    let screen_name = routes?.[0]?.params?.screen?.name;
+    if (routesLength > 1) {
+      screen_name = routes[routesLength - 2]?.params?.screen?.name;
+    }
+    const tracking = {
+      ...context,
+      screen_name,
+      component_type: 'popup',
+      component_name: id,
+    };
+    navigator?.maxApi?.trackEvent?.('service_component_displayed', {
+      ...tracking,
+      trigger_id: '111012100000000000',
+    });
+    return () => {
+      navigator?.maxApi?.trackEvent?.('service_popup_dismissed', {
         ...tracking,
-        trigger_id: '111012100000000000',
+        trigger_id: '111154100000000001',
+        action_type: closeAction.current,
       });
-      return () => {
-        navigator?.maxApi?.trackEvent?.('service_popup_dismissed', {
-          ...tracking,
-          trigger_id: '111154100000000001',
-          action_type: closeAction.current,
-        });
-      };
-    }
+    };
   }, []);
 
   /**
@@ -81,7 +77,7 @@ const PopupPromotion: React.FC<PopupPromotionProps> = ({
   };
 
   return (
-    <View accessibilityLabel={'PopupPromotion'}>
+    <View>
       <Image
         source={{
           uri: image,

package/Radio/index.tsx

@@ -39,7 +39,6 @@ const Radio: FC<RadioProps> = ({
 
   return (
     <TouchableOpacity
-      accessibilityLabel={`Radio/${label}/${value}`}
       onPress={onChange}
       disabled={disabled}
       style={[
@@ -57,7 +56,7 @@ const Radio: FC<RadioProps> = ({
           {marginRight: label ? Spacing.XS : 0},
         ]}
       />
-      {!!label && <Text typography={'description_default'}>{label}</Text>}
+      {!!label && <Text typography={'body_default_regular'}>{label}</Text>}
     </TouchableOpacity>
   );
 };

package/Skeleton/index.tsx

@@ -41,7 +41,7 @@ const Skeleton: React.FC<SkeletonTypes> = ({style}) => {
     }
   };
   return (
-    <View style={[styles.container, style]} accessibilityLabel={'Skeleton'}>
+    <View style={[styles.container, style]}>
       <View
         onLayout={e => onLayout(e.nativeEvent.layout.width)}
         style={[Styles.flex, {backgroundColor: PRIMARY_COLOR}]}>

package/Switch/index.tsx

@@ -16,7 +16,6 @@ const Switch: FC<SwitchProps> = props => {
 
   return (
     <TouchableOpacity
-      accessibilityLabel={'Switch'}
       disabled={disabled}
       onPress={() => onChange?.(!value)}
       style={[

package/Tag/index.tsx

@@ -60,9 +60,7 @@ const Tag: FC<TagProps> = ({
   }
 
   return (
-    <View
-      style={[style, sizeStyle, {backgroundColor: tagColor}]}
-      accessibilityLabel={`Tag/${label}`}>
+    <View style={[style, sizeStyle, {backgroundColor: tagColor}]}>
       {!!icon && (
         <Icon
           style={styles.icon}
@@ -71,7 +69,7 @@ const Tag: FC<TagProps> = ({
           color={labelColor}
         />
       )}
-      <Text color={labelColor} typography={'label_s'}>
+      <Text color={labelColor} typography={'label_s_medium'}>
         {label}
       </Text>
     </View>

package/Text/index.tsx

@@ -84,6 +84,7 @@ const Text: React.FC<TextProps> = ({
     }
 
     return {
+      ...typoStyle,
       fontFamily,
       fontSize: scaleSize(fontSize),
       lineHeight: scaleSize(lineHeight),
@@ -96,7 +97,6 @@ const Text: React.FC<TextProps> = ({
   return (
     <RNText
       {...rest}
-      accessibilityLabel={`Text/${children}`}
       style={[style, textStyle, {color: color ?? theme.colors.text.default}]}>
       {children ?? ''}
     </RNText>
@@ -104,7 +104,7 @@ const Text: React.FC<TextProps> = ({
 };
 
 Text.defaultProps = {
-  typography: 'paragraph_default',
+  typography: 'body_default_regular',
 };
 
 export {Text, scaleSize};

package/Text/styles.ts

@@ -1,4 +1,42 @@
 export default {
+  headline_default_bold: {fontSize: 24, lineHeight: 32, fontWeight: '700'},
+  header_m_bold: {fontSize: 18, lineHeight: 28, fontWeight: '700'},
+  header_default_bold: {fontSize: 16, lineHeight: 22, fontWeight: '700'},
+  header_s_semibold: {fontSize: 14, lineHeight: 20, fontWeight: '600'},
+  header_xs_semibold: {fontSize: 12, lineHeight: 16, fontWeight: '600'},
+  body_default_regular: {fontSize: 14, lineHeight: 20, fontWeight: '400'},
+  body_regularstrikethrought: {
+    fontSize: 14,
+    lineHeight: 20,
+    fontWeight: '400',
+    textDecorationLine: 'line-through',
+  },
+  description_default_regular: {
+    fontSize: 12,
+    lineHeight: 16,
+    fontWeight: '400',
+  },
+  description_default_regularstrikethrought: {
+    fontSize: 12,
+    lineHeight: 16,
+    fontWeight: '400',
+    textDecorationLine: 'line-through',
+  },
+  description_xs_regular: {fontSize: 10, lineHeight: 14, fontWeight: '400'},
+  description_xs_regularstrikethrought: {
+    fontSize: 10,
+    lineHeight: 14,
+    fontWeight: '400',
+    textDecorationLine: 'line-through',
+  },
+  label_default_medium: {fontSize: 14, lineHeight: 20, fontWeight: '500'},
+  label_s_medium: {fontSize: 12, lineHeight: 16, fontWeight: '500'},
+  label_xs_medium: {fontSize: 10, lineHeight: 14, fontWeight: '500'},
+  action_default_bold: {fontSize: 16, lineHeight: 22, fontWeight: '700'},
+  action_s_bold: {fontSize: 14, lineHeight: 20, fontWeight: '700'},
+  action_xs_bold: {fontSize: 12, lineHeight: 16, fontWeight: '700'},
+  action_xxs_bold: {fontSize: 10, lineHeight: 14, fontWeight: '700'},
+  /**non-support**/
   headline_default: {
     fontSize: 28,
     lineHeight: 34,

package/Text/types.ts

@@ -14,27 +14,21 @@ export type TypographyWeight = {
 };
 
 export type Typography =
-  | 'headline_default'
-  | 'headline_s'
-  | 'headline_l'
-  | 'headline_xl'
-  | 'title_default'
-  | 'title_xs'
-  | 'title_s'
-  | 'header_default'
-  | 'header_xs'
-  | 'header_s'
-  | 'paragraph_default'
-  | 'paragraph_bold'
-  | 'paragraph_italic'
-  | 'description_default'
-  | 'description_xs'
-  | 'description_s'
-  | 'label_default'
-  | 'label_xxs'
-  | 'label_xs'
-  | 'label_s'
-  | 'action_default'
-  | 'action_xxs'
-  | 'action_xs'
-  | 'action_s';
+  | 'headline_default_bold'
+  | 'header_m_bold'
+  | 'header_default_bold'
+  | 'header_s_semibold'
+  | 'header_xs_semibold'
+  | 'body_default_regular'
+  | 'body_regularstrikethrought'
+  | 'description_default_regular'
+  | 'description_default_regularstrikethrought'
+  | 'description_xs_regular'
+  | 'description_xs_regularstrikethrought'
+  | 'label_default_medium'
+  | 'label_s_medium'
+  | 'label_xs_medium'
+  | 'action_default_bold'
+  | 'action_s_bold'
+  | 'action_xs_bold'
+  | 'action_xxs_bold';

package/Title/index.tsx

@@ -39,7 +39,7 @@ const Title: FC<TitleProps> = ({
   const renderAction = () => {
     return !!actionTitle && titleFlex ? (
       <TouchableOpacity onPress={onPressAction}>
-        <Text typography={'action_s'} color={theme.colors.primary}>
+        <Text typography={'action_s_bold'} color={theme.colors.primary}>
           {actionTitle}
         </Text>
       </TouchableOpacity>
@@ -116,7 +116,7 @@ const Title: FC<TitleProps> = ({
           {!!description && type !== 'screen' && (
             <Text
               numberOfLines={1}
-              typography={'description_s'}
+              typography={'description_default_regular'}
               color={theme.colors.text.secondary}>
               {description}
             </Text>

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@momo-kits/foundation",
-    "version": "0.81.43",
+    "version": "0.81.49",
     "description": "React Native Component Kits",
     "main": "index.ts",
     "scripts": {
@@ -43,4 +43,4 @@
     },
     "author": "@momo-kits/foundation",
     "license": "ISC"
-}
+}

package/publish.sh

@@ -13,7 +13,7 @@ echo VERSION: $VERSION
 rsync -r --verbose --exclude '*.mdx' --exclude '*Demo.js'  --exclude 'props-type.js' --exclude 'prop-types.js' ./* dist
 
 cd dist
-npm publish --tag latest --access=public
+npm publish --tag beta --access=public
 
 #clear dist and package json
 cd ..

package/verify.js

@@ -1,43 +1,41 @@
 const fs = require('fs');
 const path = require('path');
 
-try {
-  const package = path.join(`${__dirname}`, 'package.json');
-  const packageInfo = JSON.parse(fs.readFileSync(package, 'utf8'));
-  const packageVersion = parseInt(packageInfo?.version.split('.')?.[1]);
-
-  const app = path.join(`${__dirname}/../../../`, 'app.json');
-  const miniJson = path.join(`${__dirname}/../../../`, 'package.json');
-  const appInfo = JSON.parse(fs.readFileSync(app, 'utf8'));
-  const miniInfo = JSON.parse(fs.readFileSync(miniJson, 'utf8'));
-  const iOSAppTarget = appInfo?.client?.ios.deploymentTarget;
-  const androidAppTarget = appInfo?.client?.android.deploymentTarget;
-
-  if (appInfo.name === 'MoMoPlatform') {
-    return;
-  }
-
-  if (packageVersion > iOSAppTarget || packageVersion > androidAppTarget) {
-    console.error(
-      `Package ${packageInfo.name} version: ${packageInfo.version} require deploymentTarget ${packageVersion}`,
-    );
-    throw new Error(
-      `Package ${packageInfo.name} version: ${packageInfo.version} require deploymentTarget ${packageVersion}`,
-    );
-  }
-
-  if (
-    miniInfo?.name !== '@momo-platform/momo-core' &&
-    miniInfo?.resolutions?.['@momo-platform/momo-core'] !== packageInfo?.version
-  ) {
-    console.error(
-      `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}`,
-    );
-  }
-} catch (error) {
-  console.error(`Installation failed: ${error.message}`);
-  process.exit(1);
+const packageInfo = JSON.parse(
+  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)) {
+  return;
+}
+
+const appInfo = JSON.parse(fs.readFileSync(app, 'utf8'));
+const miniInfo = JSON.parse(fs.readFileSync(miniJson, 'utf8'));
+
+const iOSAppTarget = appInfo?.client?.ios.deploymentTarget;
+const androidAppTarget = appInfo?.client?.android.deploymentTarget;
+
+if (
+  miniInfo?.dependencies?.['@momo-platform/momo-core']?.includes('optimize')
+) {
+  return;
+}
+
+if (packageVersion > iOSAppTarget || packageVersion > androidAppTarget) {
+  throw new Error(
+    `\x1b[41m Package ${packageInfo.name} version: ${packageInfo.version} require deploymentTarget ${packageVersion}`
+  );
+}
+
+if (
+  miniInfo?.dependencies?.['@momo-platform/momo-core'] &&
+  miniInfo?.dependencies?.['@momo-platform/momo-core'] !== packageInfo?.version
+) {
+  throw new Error(
+    `\x1b[41m Package ${packageInfo.name} version: ${packageInfo.version} require install resolutions @momo-platform/momo-core ${packageInfo.version}`
+  );
 }