@momo-kits/foundation 0.92.1-tracking.2 → 0.92.1-tracking.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Application/BottomTab.tsx +2 -2
- package/Application/Components.tsx +37 -29
- package/Application/ModalScreen.tsx +107 -131
- package/Application/NavigationContainer.tsx +59 -53
- package/Application/StackScreen.tsx +19 -14
- package/Application/index.ts +0 -4
- package/Application/types.ts +6 -7
- package/Application/utils.tsx +3 -10
- package/Button/index.tsx +12 -4
- package/CheckBox/index.tsx +7 -4
- package/Image/index.tsx +1 -1
- package/Input/Input.tsx +10 -5
- package/Input/InputDropDown.tsx +9 -6
- package/Input/InputMoney.tsx +10 -7
- package/Input/InputOTP.tsx +7 -5
- package/Input/InputSearch.tsx +8 -5
- package/Input/InputTextArea.tsx +13 -9
- package/Input/styles.ts +3 -3
- package/Popup/PopupNotify.tsx +15 -11
- package/Popup/PopupPromotion.tsx +10 -8
- package/Radio/index.tsx +7 -4
- package/Switch/index.tsx +7 -5
- package/Text/index.tsx +3 -5
- package/Text/styles.ts +7 -7
- package/package.json +2 -1
- package/verify.js +9 -6
package/Popup/PopupNotify.tsx
CHANGED
|
@@ -4,10 +4,14 @@ import {PopupNotifyProps} from './types';
|
|
|
4
4
|
import {Radius, Spacing, Styles} from '../Consts';
|
|
5
5
|
import {Image} from '../Image';
|
|
6
6
|
import {Text} from '../Text';
|
|
7
|
-
import {ApplicationContext
|
|
7
|
+
import {ApplicationContext} from '../Application';
|
|
8
8
|
import {Button} from '../Button';
|
|
9
9
|
import {Icon} from '../Icon';
|
|
10
|
-
import {getAccessibilityID} from
|
|
10
|
+
import {getAccessibilityID} from '../Application/utils';
|
|
11
|
+
|
|
12
|
+
const {
|
|
13
|
+
MiniAppContext,
|
|
14
|
+
} = require('react-native/Libraries/Components/ScreenContext');
|
|
11
15
|
|
|
12
16
|
const PopupNotify: React.FC<PopupNotifyProps> = ({
|
|
13
17
|
id,
|
|
@@ -20,7 +24,7 @@ const PopupNotify: React.FC<PopupNotifyProps> = ({
|
|
|
20
24
|
buttonDirection = 'row',
|
|
21
25
|
onIconClose,
|
|
22
26
|
}) => {
|
|
23
|
-
const context = useContext(MiniAppContext);
|
|
27
|
+
const context = useContext<any>(MiniAppContext);
|
|
24
28
|
const {theme, navigator, translate} = useContext(ApplicationContext);
|
|
25
29
|
const [scrollContent, setScrollContent] = useState(false);
|
|
26
30
|
const closeAction = useRef('touch_outside');
|
|
@@ -109,13 +113,13 @@ const PopupNotify: React.FC<PopupNotifyProps> = ({
|
|
|
109
113
|
);
|
|
110
114
|
};
|
|
111
115
|
const renderColumn = () => {
|
|
112
|
-
const accessibilityPrimaryID = getAccessibilityID('btn_popup_allow')
|
|
113
|
-
const accessibilitySecondID = getAccessibilityID('btn_popup_cancel')
|
|
116
|
+
const accessibilityPrimaryID = getAccessibilityID?.('btn_popup_allow');
|
|
117
|
+
const accessibilitySecondID = getAccessibilityID?.('btn_popup_cancel');
|
|
114
118
|
|
|
115
119
|
return (
|
|
116
120
|
<View style={Styles.columnCenter}>
|
|
117
121
|
<Button
|
|
118
|
-
|
|
122
|
+
accessibilityID={accessibilityPrimaryID}
|
|
119
123
|
title={primary.title}
|
|
120
124
|
size="medium"
|
|
121
125
|
onPress={() => {
|
|
@@ -127,7 +131,7 @@ const PopupNotify: React.FC<PopupNotifyProps> = ({
|
|
|
127
131
|
<>
|
|
128
132
|
<View style={styles.buttonSpace} />
|
|
129
133
|
<Button
|
|
130
|
-
|
|
134
|
+
accessibilityID={accessibilitySecondID}
|
|
131
135
|
title={secondary?.title}
|
|
132
136
|
type="text"
|
|
133
137
|
size="medium"
|
|
@@ -161,11 +165,11 @@ const PopupNotify: React.FC<PopupNotifyProps> = ({
|
|
|
161
165
|
* build close action
|
|
162
166
|
*/
|
|
163
167
|
const buildCloseIcon = () => {
|
|
164
|
-
const accessibilityCloseID = getAccessibilityID('ic_popup_close')
|
|
168
|
+
const accessibilityCloseID = getAccessibilityID?.('ic_popup_close');
|
|
165
169
|
|
|
166
170
|
return (
|
|
167
171
|
<TouchableOpacity
|
|
168
|
-
|
|
172
|
+
{...accessibilityCloseID}
|
|
169
173
|
style={styles.iconCloseContainer}
|
|
170
174
|
onPress={() => {
|
|
171
175
|
closeAction.current = 'icon_close';
|
|
@@ -189,11 +193,11 @@ const PopupNotify: React.FC<PopupNotifyProps> = ({
|
|
|
189
193
|
);
|
|
190
194
|
};
|
|
191
195
|
|
|
192
|
-
const accessibilityID = getAccessibilityID(`pu_${context.code}_notify`)
|
|
196
|
+
const accessibilityID = getAccessibilityID?.(`pu_${context.code}_notify`);
|
|
193
197
|
|
|
194
198
|
return (
|
|
195
199
|
<View
|
|
196
|
-
|
|
200
|
+
{...accessibilityID}
|
|
197
201
|
style={[
|
|
198
202
|
styles.container,
|
|
199
203
|
{backgroundColor: theme.colors.background.surface},
|
package/Popup/PopupPromotion.tsx
CHANGED
|
@@ -1,18 +1,22 @@
|
|
|
1
1
|
import React, {useContext, useEffect, useRef} from 'react';
|
|
2
2
|
import {StyleSheet, TouchableOpacity, View} from 'react-native';
|
|
3
3
|
import {PopupPromotionProps} from './types';
|
|
4
|
-
import {ApplicationContext
|
|
4
|
+
import {ApplicationContext} from '../Application';
|
|
5
5
|
import {Image} from '../Image';
|
|
6
6
|
import {Radius, Spacing} from '../Consts';
|
|
7
7
|
import {Icon} from '../Icon';
|
|
8
|
-
import {getAccessibilityID} from
|
|
8
|
+
import {getAccessibilityID} from '../Application/utils';
|
|
9
|
+
|
|
10
|
+
const {
|
|
11
|
+
MiniAppContext,
|
|
12
|
+
} = require('react-native/Libraries/Components/ScreenContext');
|
|
9
13
|
|
|
10
14
|
const PopupPromotion: React.FC<PopupPromotionProps> = ({
|
|
11
15
|
id,
|
|
12
16
|
image,
|
|
13
17
|
onIconClose,
|
|
14
18
|
}) => {
|
|
15
|
-
const context = useContext(MiniAppContext);
|
|
19
|
+
const context = useContext<any>(MiniAppContext);
|
|
16
20
|
const {theme, navigator} = useContext(ApplicationContext);
|
|
17
21
|
const closeAction = useRef('touch_outside');
|
|
18
22
|
|
|
@@ -49,7 +53,7 @@ const PopupPromotion: React.FC<PopupPromotionProps> = ({
|
|
|
49
53
|
* build close action
|
|
50
54
|
*/
|
|
51
55
|
const buildCloseIcon = () => {
|
|
52
|
-
const accessibilityCloseID = getAccessibilityID('ic_popup_close')
|
|
56
|
+
const accessibilityCloseID = getAccessibilityID?.('ic_popup_close');
|
|
53
57
|
|
|
54
58
|
return (
|
|
55
59
|
<View {...accessibilityCloseID} style={styles.iconCloseContainer}>
|
|
@@ -78,12 +82,10 @@ const PopupPromotion: React.FC<PopupPromotionProps> = ({
|
|
|
78
82
|
</View>
|
|
79
83
|
);
|
|
80
84
|
};
|
|
81
|
-
const accessibilityID = getAccessibilityID(`pu_${context.code}_promotion`)
|
|
85
|
+
const accessibilityID = getAccessibilityID?.(`pu_${context.code}_promotion`);
|
|
82
86
|
|
|
83
87
|
return (
|
|
84
|
-
<View
|
|
85
|
-
{...accessibilityID}
|
|
86
|
-
>
|
|
88
|
+
<View {...accessibilityID}>
|
|
87
89
|
<Image
|
|
88
90
|
source={{
|
|
89
91
|
uri: image,
|
package/Radio/index.tsx
CHANGED
|
@@ -4,12 +4,13 @@ import {TouchableOpacity, View} from 'react-native';
|
|
|
4
4
|
import {RadioProps} from './types';
|
|
5
5
|
import {Text} from '../Text';
|
|
6
6
|
import styles from './styles';
|
|
7
|
-
import {ApplicationContext
|
|
7
|
+
import {ApplicationContext} from '../Application';
|
|
8
8
|
import {Spacing} from '../Consts';
|
|
9
9
|
import {formatNameLength, getAccessibilityID} from '../Application/utils';
|
|
10
10
|
|
|
11
11
|
const {
|
|
12
12
|
ScreenContext,
|
|
13
|
+
MiniAppContext,
|
|
13
14
|
} = require('react-native/Libraries/Components/ScreenContext');
|
|
14
15
|
|
|
15
16
|
const Radio: FC<RadioProps> = ({
|
|
@@ -22,7 +23,7 @@ const Radio: FC<RadioProps> = ({
|
|
|
22
23
|
params,
|
|
23
24
|
componentId,
|
|
24
25
|
}) => {
|
|
25
|
-
|
|
26
|
+
const {appId} = useContext<any>(MiniAppContext);
|
|
26
27
|
const {theme} = useContext(ApplicationContext);
|
|
27
28
|
const screenInfo = useContext<any>(ScreenContext);
|
|
28
29
|
const selected = value === groupValue;
|
|
@@ -45,7 +46,9 @@ const Radio: FC<RadioProps> = ({
|
|
|
45
46
|
: theme.colors.text.disable,
|
|
46
47
|
};
|
|
47
48
|
}
|
|
48
|
-
|
|
49
|
+
const accessibilityID = getAccessibilityID?.(
|
|
50
|
+
`${appId}/${screenInfo.screenName}/rdo_${label}_${value}`,
|
|
51
|
+
);
|
|
49
52
|
|
|
50
53
|
return (
|
|
51
54
|
<ScreenContext.Provider
|
|
@@ -60,7 +63,7 @@ const Radio: FC<RadioProps> = ({
|
|
|
60
63
|
action: 'click',
|
|
61
64
|
}}>
|
|
62
65
|
<TouchableOpacity
|
|
63
|
-
|
|
66
|
+
{...accessibilityID}
|
|
64
67
|
onPress={onChange}
|
|
65
68
|
disabled={disabled}
|
|
66
69
|
style={[
|
package/Switch/index.tsx
CHANGED
|
@@ -3,15 +3,15 @@ import {TouchableOpacity, View} from 'react-native';
|
|
|
3
3
|
import {SwitchProps} from './types';
|
|
4
4
|
import styles from './styles';
|
|
5
5
|
import {Colors} from '../Consts';
|
|
6
|
-
import {getAccessibilityID} from
|
|
7
|
-
import {MiniAppContext} from "../Application";
|
|
6
|
+
import {getAccessibilityID} from '../Application/utils';
|
|
8
7
|
|
|
9
8
|
const {
|
|
10
9
|
ScreenContext,
|
|
10
|
+
MiniAppContext,
|
|
11
11
|
} = require('react-native/Libraries/Components/ScreenContext');
|
|
12
12
|
|
|
13
13
|
const Switch: FC<SwitchProps> = props => {
|
|
14
|
-
|
|
14
|
+
const {appId} = useContext<any>(MiniAppContext);
|
|
15
15
|
const {value, onChange, disabled, style, params, componentId} = props;
|
|
16
16
|
const screenInfo = useContext<any>(ScreenContext);
|
|
17
17
|
|
|
@@ -22,7 +22,9 @@ const Switch: FC<SwitchProps> = props => {
|
|
|
22
22
|
if (disabled) {
|
|
23
23
|
backgroundColor = value ? Colors.green_09 : Colors.black_05;
|
|
24
24
|
}
|
|
25
|
-
|
|
25
|
+
const accessibilityID = getAccessibilityID?.(
|
|
26
|
+
`${appId}/${screenInfo.screenName}/swt_${value}`,
|
|
27
|
+
);
|
|
26
28
|
|
|
27
29
|
return (
|
|
28
30
|
<ScreenContext.Provider
|
|
@@ -36,7 +38,7 @@ const Switch: FC<SwitchProps> = props => {
|
|
|
36
38
|
action: 'click',
|
|
37
39
|
}}>
|
|
38
40
|
<TouchableOpacity
|
|
39
|
-
|
|
41
|
+
{...accessibilityID}
|
|
40
42
|
disabled={disabled}
|
|
41
43
|
onPress={() => onChange?.(!value)}
|
|
42
44
|
style={[
|
package/Text/index.tsx
CHANGED
|
@@ -51,8 +51,9 @@ export interface TextProps extends RNTextProps {
|
|
|
51
51
|
*/
|
|
52
52
|
color?: string;
|
|
53
53
|
}
|
|
54
|
+
|
|
54
55
|
const Text: React.FC<TextProps> = ({
|
|
55
|
-
typography,
|
|
56
|
+
typography = 'body_default_regular',
|
|
56
57
|
color,
|
|
57
58
|
children,
|
|
58
59
|
style,
|
|
@@ -94,6 +95,7 @@ const Text: React.FC<TextProps> = ({
|
|
|
94
95
|
};
|
|
95
96
|
|
|
96
97
|
const textStyle = getTypoStyle(typography);
|
|
98
|
+
|
|
97
99
|
return (
|
|
98
100
|
<RNText
|
|
99
101
|
{...rest}
|
|
@@ -103,8 +105,4 @@ const Text: React.FC<TextProps> = ({
|
|
|
103
105
|
);
|
|
104
106
|
};
|
|
105
107
|
|
|
106
|
-
Text.defaultProps = {
|
|
107
|
-
typography: 'body_default_regular',
|
|
108
|
-
};
|
|
109
|
-
|
|
110
108
|
export {Text, scaleSize};
|
package/Text/styles.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
export default {
|
|
2
|
-
headline_default_bold: {fontSize: 24, lineHeight:
|
|
3
|
-
header_m_bold: {fontSize: 18, lineHeight:
|
|
2
|
+
headline_default_bold: {fontSize: 24, lineHeight: 34, fontWeight: '700'},
|
|
3
|
+
header_m_bold: {fontSize: 18, lineHeight: 26, fontWeight: '700'},
|
|
4
4
|
header_default_bold: {fontSize: 16, lineHeight: 22, fontWeight: '700'},
|
|
5
5
|
header_s_semibold: {fontSize: 14, lineHeight: 20, fontWeight: '600'},
|
|
6
|
-
header_xs_semibold: {fontSize: 12, lineHeight:
|
|
6
|
+
header_xs_semibold: {fontSize: 12, lineHeight: 18, fontWeight: '600'},
|
|
7
7
|
body_default_regular: {fontSize: 14, lineHeight: 20, fontWeight: '400'},
|
|
8
8
|
body_regularstrikethrought: {
|
|
9
9
|
fontSize: 14,
|
|
@@ -13,12 +13,12 @@ export default {
|
|
|
13
13
|
},
|
|
14
14
|
description_default_regular: {
|
|
15
15
|
fontSize: 12,
|
|
16
|
-
lineHeight:
|
|
16
|
+
lineHeight: 18,
|
|
17
17
|
fontWeight: '400',
|
|
18
18
|
},
|
|
19
19
|
description_default_regularstrikethrought: {
|
|
20
20
|
fontSize: 12,
|
|
21
|
-
lineHeight:
|
|
21
|
+
lineHeight: 18,
|
|
22
22
|
fontWeight: '400',
|
|
23
23
|
textDecorationLine: 'line-through',
|
|
24
24
|
},
|
|
@@ -30,11 +30,11 @@ export default {
|
|
|
30
30
|
textDecorationLine: 'line-through',
|
|
31
31
|
},
|
|
32
32
|
label_default_medium: {fontSize: 14, lineHeight: 20, fontWeight: '500'},
|
|
33
|
-
label_s_medium: {fontSize: 12, lineHeight:
|
|
33
|
+
label_s_medium: {fontSize: 12, lineHeight: 18, fontWeight: '500'},
|
|
34
34
|
label_xs_medium: {fontSize: 10, lineHeight: 14, fontWeight: '500'},
|
|
35
35
|
action_default_bold: {fontSize: 16, lineHeight: 22, fontWeight: '700'},
|
|
36
36
|
action_s_bold: {fontSize: 14, lineHeight: 20, fontWeight: '700'},
|
|
37
|
-
action_xs_bold: {fontSize: 12, lineHeight:
|
|
37
|
+
action_xs_bold: {fontSize: 12, lineHeight: 18, fontWeight: '700'},
|
|
38
38
|
action_xxs_bold: {fontSize: 10, lineHeight: 14, fontWeight: '700'},
|
|
39
39
|
/**non-support**/
|
|
40
40
|
headline_default: {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@momo-kits/foundation",
|
|
3
|
-
"version": "0.92.1-tracking.
|
|
3
|
+
"version": "0.92.1-tracking.20",
|
|
4
4
|
"description": "React Native Component Kits",
|
|
5
5
|
"main": "index.ts",
|
|
6
6
|
"scripts": {
|
|
@@ -14,6 +14,7 @@
|
|
|
14
14
|
"react-native-safe-area-context": "3.1.4",
|
|
15
15
|
"react-native-linear-gradient": "2.8.3",
|
|
16
16
|
"react-native-gesture-handler": "1.10.3",
|
|
17
|
+
"react-native-modalize": "2.1.1",
|
|
17
18
|
"react-native-fast-image": "8.1.5",
|
|
18
19
|
"@react-navigation/bottom-tabs": "git+https://gitlab.com/momo-platform/react-navigation-bottom-tabs.git#main",
|
|
19
20
|
"@react-navigation/core": "5.16.1",
|
package/verify.js
CHANGED
|
@@ -2,21 +2,24 @@ const fs = require('fs');
|
|
|
2
2
|
const path = require('path');
|
|
3
3
|
|
|
4
4
|
try {
|
|
5
|
-
const
|
|
6
|
-
|
|
5
|
+
const packageInfo = JSON.parse(
|
|
6
|
+
fs.readFileSync(path.join(`${__dirname}`, 'package.json'), 'utf8'),
|
|
7
|
+
);
|
|
7
8
|
const packageVersion = parseInt(packageInfo?.version.split('.')?.[1]);
|
|
8
9
|
|
|
9
10
|
const app = path.join(`${__dirname}/../../../`, 'app.json');
|
|
10
11
|
const miniJson = path.join(`${__dirname}/../../../`, 'package.json');
|
|
12
|
+
|
|
13
|
+
if (!fs.existsSync(app) || fs.existsSync(miniJson)) {
|
|
14
|
+
return;
|
|
15
|
+
}
|
|
16
|
+
|
|
11
17
|
const appInfo = JSON.parse(fs.readFileSync(app, 'utf8'));
|
|
12
18
|
const miniInfo = JSON.parse(fs.readFileSync(miniJson, 'utf8'));
|
|
19
|
+
|
|
13
20
|
const iOSAppTarget = appInfo?.client?.ios.deploymentTarget;
|
|
14
21
|
const androidAppTarget = appInfo?.client?.android.deploymentTarget;
|
|
15
22
|
|
|
16
|
-
if (Object.values(appInfo).length < 1) {
|
|
17
|
-
return;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
23
|
if (packageVersion > iOSAppTarget || packageVersion > androidAppTarget) {
|
|
21
24
|
console.error(
|
|
22
25
|
`Package ${packageInfo.name} version: ${packageInfo.version} require deploymentTarget ${packageVersion}`,
|