@momo-kits/foundation 0.75.1-beta.8 → 0.75.2-beta.0

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.
Files changed (112) hide show
  1. package/Application/BottomTab/BottomTabBar.tsx +478 -0
  2. package/Application/BottomTab/index.tsx +134 -0
  3. package/Application/Components.tsx +552 -0
  4. package/Application/ModalScreen.tsx +244 -0
  5. package/Application/Navigation.ts +50 -0
  6. package/Application/NavigationContainer.tsx +128 -0
  7. package/Application/Navigator.ts +151 -0
  8. package/Application/StackScreen.tsx +146 -0
  9. package/Application/index.ts +37 -0
  10. package/{Navigation → Application}/types.ts +96 -27
  11. package/Application/utils.tsx +175 -0
  12. package/Assets/DotAnimation.json +256 -0
  13. package/Assets/SpinnerAnimation.json +1027 -0
  14. package/Assets/icon.json +89 -5
  15. package/Assets/icon_bank.json +506 -0
  16. package/Assets/language.json +202 -0
  17. package/Badge/Badge.tsx +56 -0
  18. package/Badge/BadgeDot.tsx +11 -0
  19. package/Badge/BadgeRibbon.tsx +125 -0
  20. package/Badge/Shape.tsx +29 -0
  21. package/Badge/index.tsx +7 -0
  22. package/Badge/styles.ts +58 -0
  23. package/Badge/types.ts +63 -0
  24. package/Button/index.tsx +90 -39
  25. package/Button/styles.ts +19 -0
  26. package/CheckBox/index.tsx +58 -43
  27. package/CheckBox/styles.ts +1 -1
  28. package/CheckBox/types.ts +6 -4
  29. package/Consts/colors+spacing+radius.ts +18 -0
  30. package/Consts/styles.ts +0 -26
  31. package/Consts/theme.ts +5 -1
  32. package/Divider/index.tsx +3 -1
  33. package/Icon/index.tsx +14 -10
  34. package/Icon/types.ts +4 -3
  35. package/IconButton/index.tsx +24 -15
  36. package/Image/index.tsx +63 -45
  37. package/Image/styles.ts +1 -9
  38. package/Image/types.ts +5 -1
  39. package/Input/Input.tsx +227 -115
  40. package/Input/InputDropDown.tsx +132 -0
  41. package/Input/InputMoney.tsx +174 -110
  42. package/Input/InputOTP.tsx +257 -0
  43. package/Input/InputSearch.tsx +160 -130
  44. package/Input/InputTextArea.tsx +149 -121
  45. package/Input/common.tsx +43 -18
  46. package/Input/index.tsx +205 -17
  47. package/Input/styles.ts +44 -7
  48. package/Input/utils.ts +2 -2
  49. package/Layout/Card.tsx +154 -62
  50. package/Layout/FloatingButton.tsx +128 -0
  51. package/Layout/GridSystem.tsx +35 -23
  52. package/Layout/Item.tsx +56 -0
  53. package/Layout/ItemList.tsx +55 -0
  54. package/Layout/ItemSectionList.tsx +39 -0
  55. package/Layout/Screen.tsx +378 -0
  56. package/Layout/Section.tsx +74 -39
  57. package/Layout/index.ts +14 -3
  58. package/Layout/styles.ts +101 -0
  59. package/Layout/types.ts +1 -39
  60. package/Layout/utils.ts +42 -37
  61. package/Loader/DotLoader.tsx +37 -0
  62. package/Loader/Loader.tsx +13 -0
  63. package/Loader/ProgressBar.tsx +44 -0
  64. package/Loader/Spinner.tsx +29 -0
  65. package/Loader/index.tsx +4 -0
  66. package/Loader/styles.ts +10 -0
  67. package/Loader/types.ts +35 -0
  68. package/Loader/utils.ts +25 -0
  69. package/Pagination/Dot.tsx +1 -1
  70. package/Pagination/PaginationDot.tsx +8 -3
  71. package/Pagination/PaginationNumber.tsx +8 -7
  72. package/Pagination/PaginationScroll.tsx +1 -1
  73. package/Pagination/PaginationWhiteDot.tsx +8 -5
  74. package/Pagination/styles.ts +3 -0
  75. package/Pagination/types.ts +2 -0
  76. package/Popup/PopupNotify.tsx +102 -44
  77. package/Popup/PopupPromotion.tsx +63 -22
  78. package/Popup/types.ts +15 -4
  79. package/Radio/index.tsx +35 -21
  80. package/Radio/types.ts +7 -5
  81. package/Skeleton/index.tsx +1 -1
  82. package/Skeleton/types.ts +3 -0
  83. package/Switch/index.tsx +35 -24
  84. package/Switch/types.ts +5 -3
  85. package/Tag/index.tsx +1 -1
  86. package/Text/index.tsx +32 -26
  87. package/Text/styles.ts +38 -0
  88. package/Text/types.ts +25 -13
  89. package/Text/utils.ts +14 -0
  90. package/Title/index.tsx +186 -0
  91. package/Title/styles.ts +79 -0
  92. package/Title/types.ts +20 -0
  93. package/code-scanner.js +143 -0
  94. package/index.ts +17 -3
  95. package/migrate_typo.js +56 -0
  96. package/package.json +44 -39
  97. package/publish.sh +2 -5
  98. package/tsconfig.json +24 -0
  99. package/verify.js +47 -0
  100. package/Assets/header-background.png +0 -0
  101. package/Layout/ScreenContainer.tsx +0 -122
  102. package/Navigation/BottomTab.tsx +0 -39
  103. package/Navigation/Components.tsx +0 -365
  104. package/Navigation/ModalScreen.tsx +0 -226
  105. package/Navigation/Navigation.ts +0 -44
  106. package/Navigation/NavigationButton.tsx +0 -54
  107. package/Navigation/NavigationContainer.tsx +0 -77
  108. package/Navigation/Navigator.ts +0 -82
  109. package/Navigation/Observer.ts +0 -79
  110. package/Navigation/StackScreen.tsx +0 -27
  111. package/Navigation/index.ts +0 -14
  112. package/Navigation/utils.tsx +0 -137
@@ -0,0 +1,56 @@
1
+ const {readFileSync, writeFileSync, readdirSync, statSync} = require('fs');
2
+ const path = require('path');
3
+ let rootPath = process.argv[2];
4
+
5
+ const migrateText = [
6
+ {typo1: 'headline_s', typo2: 'headline_default_bold'},
7
+ {typo1: 'header_s', typo2: 'header_s_semibold'},
8
+ {typo1: 'header_xs', typo2: 'header_xs_semibold'},
9
+ {typo1: 'description_default', typo2: 'body_default_regular'},
10
+ {typo1: 'description_s', typo2: 'description_default_regular'},
11
+ {typo1: 'description_xs', typo2: 'description_xs_regular'},
12
+ {typo1: 'label_default', typo2: 'label_default_medium'},
13
+ {typo1: 'label_s', typo2: 'label_s_medium'},
14
+ {typo1: 'label_xs', typo2: 'label_xs_medium'},
15
+ {typo1: 'action_default', typo2: 'action_default_bold'},
16
+ {typo1: 'action_xs', typo2: 'action_xs_bold'},
17
+ {typo1: 'action_xxs', typo2: 'action_xxs_bold'},
18
+ ];
19
+
20
+ function replaceTextInFile(oldText, newText, filePath) {
21
+ try {
22
+ let content = readFileSync(filePath, {encoding: 'utf-8'});
23
+ const regex = new RegExp(`\\b${oldText}\\b`, 'g');
24
+ content = content.replace(regex, newText);
25
+ writeFileSync(filePath, content, 'utf8');
26
+ console.log(`Replaced text in: ${filePath}`);
27
+ } catch (error) {
28
+ console.error(`Error processing file ${filePath}:`, error);
29
+ }
30
+ }
31
+
32
+ function scanDirectory(directory, oldText, newText) {
33
+ const files = readdirSync(directory);
34
+
35
+ files.forEach(file => {
36
+ const filePath = path.join(directory, file);
37
+ const stat = statSync(filePath);
38
+
39
+ if (stat.isDirectory()) {
40
+ scanDirectory(filePath, oldText, newText);
41
+ } else if (
42
+ stat.isFile() &&
43
+ (filePath.endsWith('.tsx') || filePath.endsWith('.ts'))
44
+ ) {
45
+ replaceTextInFile(oldText, newText, filePath);
46
+ }
47
+ });
48
+ }
49
+
50
+ function main() {
51
+ migrateText.forEach(({typo1, typo2}) => {
52
+ scanDirectory(rootPath, typo1, typo2);
53
+ });
54
+ }
55
+
56
+ main();
package/package.json CHANGED
@@ -1,41 +1,46 @@
1
1
  {
2
- "name": "@momo-kits/foundation",
3
- "version": "0.75.1-beta.8",
4
- "description": "React Native Component Kits",
5
- "main": "index.ts",
6
- "scripts": {
7
- "test": "echo \"Error: no test specified\" && exit 1"
8
- },
9
- "keywords": [
10
- "@momo-kits/foundation"
11
- ],
12
- "dependencies": {
13
- "react-native-safe-area-context": "3.1.4",
14
- "react-native-linear-gradient": "2.5.6",
15
- "@react-navigation/bottom-tabs": "git+https://gitlab.com/dung.huynh1/react-navigation-bottom-tabs.git#main",
16
- "@react-navigation/core": "5.16.1",
17
- "@react-navigation/native": "5.9.8",
18
- "@react-navigation/routers": "5.7.4",
19
- "@react-navigation/stack": "git+https://gitlab.com/dung.huynh1/react-navigation-stack.git#main",
20
- "@gorhom/bottom-sheet": "2.4.1"
21
- },
22
- "peerDependencies": {
23
- "react-native": "*"
24
- },
25
- "devDependencies": {
26
- "@babel/core": "^7.12.9",
27
- "@babel/runtime": "^7.12.5",
28
- "@react-native-community/eslint-config": "^2.0.0",
29
- "@types/jest": "26.0.23",
30
- "@types/react-native": "0.64.4",
31
- "@types/react-test-renderer": "16.9.2",
32
- "babel-jest": "^26.6.3",
33
- "eslint": "^7.14.0",
34
- "jest": "^26.6.3",
35
- "metro-react-native-babel-preset": "^0.64.0",
36
- "react-test-renderer": "17.0.1",
37
- "typescript": "^4.0.3"
38
- },
39
- "author": "@momo-kits/foundation",
40
- "license": "ISC"
2
+ "name": "@momo-kits/foundation",
3
+ "version": "0.75.2-beta.0",
4
+ "description": "React Native Component Kits",
5
+ "main": "index.ts",
6
+ "scripts": {},
7
+ "keywords": [
8
+ "@momo-kits/foundation"
9
+ ],
10
+ "dependencies": {
11
+ "@gorhom/bottom-sheet": "2.4.1",
12
+ "@react-navigation/bottom-tabs": "https://oauth2:5WXQLHPMxxCyvGt_Py4D@gitlab.mservice.com.vn/momo-platform/react-native-bottom-tabs.git",
13
+ "@react-navigation/core": "5.16.1",
14
+ "@react-navigation/native": "5.9.8",
15
+ "@react-navigation/routers": "5.7.4",
16
+ "@react-navigation/stack": "https://oauth2:eX-jVhzQdLc343AjD3Sc@gitlab.mservice.com.vn/momo-platform/react-navigation-stack.git",
17
+ "lottie-react-native": "3.3.2",
18
+ "react-native-fast-image": "8.1.5",
19
+ "react-native-gesture-handler": "1.10.3",
20
+ "react-native-linear-gradient": "2.8.3",
21
+ "react-native-modalize": "2.1.1",
22
+ "react-native-safe-area-context": "3.1.4"
23
+ },
24
+ "peerDependencies": {
25
+ "react-native": "*"
26
+ },
27
+ "devDependencies": {
28
+ "@babel/core": "^7.12.9",
29
+ "@babel/runtime": "^7.12.5",
30
+ "@momo-platform/versions": "4.1.11",
31
+ "@react-native-community/eslint-config": "^2.0.0",
32
+ "@types/d3-shape": "1.3.7",
33
+ "@types/jest": "26.0.23",
34
+ "@types/react-native": "0.64.4",
35
+ "@types/react-test-renderer": "16.9.2",
36
+ "babel-jest": "^26.6.3",
37
+ "eslint": "^7.14.0",
38
+ "jest": "^26.6.3",
39
+ "metro-react-native-babel-preset": "^0.64.0",
40
+ "react-scanner": "^1.1.0",
41
+ "react-test-renderer": "17.0.1",
42
+ "typescript": "^4.0.3"
43
+ },
44
+ "author": "@momo-kits/foundation",
45
+ "license": "ISC"
41
46
  }
package/publish.sh CHANGED
@@ -12,15 +12,12 @@ echo VERSION: $VERSION
12
12
 
13
13
  rsync -r --verbose --exclude '*.mdx' --exclude '*Demo.js' --exclude 'props-type.js' --exclude 'prop-types.js' ./* dist
14
14
 
15
- #babel component to dist
16
- #babel ./dist -d dist --copy-files
17
-
18
15
  cd dist
19
- npm publish --tag beta --access=public
16
+ npm publish --tag latest --access=public
20
17
 
21
18
  #clear dist and package json
22
19
  cd ..
23
20
  rm -rf dist
24
21
 
25
22
 
26
- #curl -X POST -H 'Content-Type: application/json' 'https://chat.googleapis.com/v1/spaces/AAAAbP8987c/messages?key=AIzaSyDdI0hCZtE6vySjMm-WEfRq3CPzqKqqsHI&token=UGSFRvk_oYb9uGsAgs31bVvMm6jDkmD8zihGm3eyaQA%3D&threadKey=JoaXTEYaNNkl' -d '{"text": "@momo-kits/core new version release: '*"$VERSION"*' https://www.npmjs.com/package/@momo-kits/core"}'
23
+ #curl -X POST -H 'Content-Type: application/json' 'https://chat.googleapis.com/v1/spaces/AAAAbP8987c/messages?key=AIzaSyDdI0hCZtE6vySjMm-WEfRq3CPzqKqqsHI&token=UGSFRvk_oYb9uGsAgs31bVvMm6jDkmD8zihGm3eyaQA%3D&threadKey=JoaXTEYaNNkl' -d '{"text": "@momo-kits/core new version release: '*"$VERSION"*' https://www.npmjs.com/package/@momo-kits/foundation"}'
package/tsconfig.json ADDED
@@ -0,0 +1,24 @@
1
+ {
2
+ "compilerOptions": {
3
+ "rootDir": ".",
4
+ "allowUnreachableCode": false,
5
+ "allowUnusedLabels": false,
6
+ "esModuleInterop": true,
7
+ "forceConsistentCasingInFileNames": true,
8
+ "jsx": "react",
9
+ "lib": ["esnext"],
10
+ "module": "esnext",
11
+ "moduleResolution": "node",
12
+ "noFallthroughCasesInSwitch": true,
13
+ "noImplicitReturns": false,
14
+ "noImplicitUseStrict": false,
15
+ "noStrictGenericChecks": false,
16
+ "noUncheckedIndexedAccess": true,
17
+ "noUnusedLocals": true,
18
+ "noUnusedParameters": true,
19
+ "resolveJsonModule": true,
20
+ "skipLibCheck": true,
21
+ "strict": true,
22
+ "target": "esnext",
23
+ }
24
+ }
package/verify.js ADDED
@@ -0,0 +1,47 @@
1
+ const fs = require('fs');
2
+ const path = require('path');
3
+
4
+ try {
5
+ const packageInfo = JSON.parse(
6
+ fs.readFileSync(path.join(`${__dirname}`, 'package.json'), 'utf8'),
7
+ );
8
+ const packageVersion = parseInt(packageInfo?.version.split('.')?.[1]);
9
+
10
+ const app = path.join(`${__dirname}/../../../`, 'app.json');
11
+ const miniJson = path.join(`${__dirname}/../../../`, 'package.json');
12
+
13
+ if (!fs.existsSync(app) || fs.existsSync(miniJson)) {
14
+ return;
15
+ }
16
+
17
+ const appInfo = JSON.parse(fs.readFileSync(app, 'utf8'));
18
+ const miniInfo = JSON.parse(fs.readFileSync(miniJson, 'utf8'));
19
+
20
+ const iOSAppTarget = appInfo?.client?.ios.deploymentTarget;
21
+ const androidAppTarget = appInfo?.client?.android.deploymentTarget;
22
+
23
+ if (packageVersion > iOSAppTarget || packageVersion > androidAppTarget) {
24
+ console.error(
25
+ `Package ${packageInfo.name} version: ${packageInfo.version} require deploymentTarget ${packageVersion}`,
26
+ );
27
+ throw new Error(
28
+ `Package ${packageInfo.name} version: ${packageInfo.version} require deploymentTarget ${packageVersion}`,
29
+ );
30
+ }
31
+
32
+ if (
33
+ miniInfo?.dependencies?.['@momo-platform/momo-core'] &&
34
+ miniInfo?.dependencies?.['@momo-platform/momo-core'] !==
35
+ packageInfo?.version
36
+ ) {
37
+ console.error(
38
+ `Package ${packageInfo.name} version: ${packageInfo.version} require install resolutions @momo-platform/momo-core ${packageInfo.version}`,
39
+ );
40
+ throw new Error(
41
+ `Package ${packageInfo.name} version: ${packageInfo.version} require install resolutions @momo-platform/momo-core ${packageInfo.version}`,
42
+ );
43
+ }
44
+ } catch (error) {
45
+ console.error(`Installation failed: ${error.message}`);
46
+ process.exit(1);
47
+ }
Binary file
@@ -1,122 +0,0 @@
1
- import {Animated, KeyboardAvoidingView, Platform, View} from 'react-native';
2
- import {useHeaderHeight} from '@react-navigation/stack';
3
- import {useSafeAreaInsets} from 'react-native-safe-area-context';
4
- import React, {useContext} from 'react';
5
- import {ScreenContainerProps} from '../Navigation/types';
6
- import {Spacing, Styles} from '../Consts';
7
- import {Section, validateChildren} from './index';
8
-
9
- import {ApplicationContext} from '../Navigation';
10
-
11
- const ScreenContainer: React.FC<ScreenContainerProps> = ({
12
- children,
13
- enableKeyboardAvoidingView,
14
- scrollable,
15
- scrollY,
16
- headerBackground,
17
- scrollViewProps,
18
- footerComponent: Footer,
19
- }) => {
20
- const {theme} = useContext(ApplicationContext);
21
- const insets = useSafeAreaInsets();
22
- let marginHeader = 0;
23
- let handleScroll;
24
- let imageAnimatedStyle = {};
25
- let Component: any = View;
26
- if (scrollable) {
27
- Component = Animated.ScrollView;
28
- }
29
- if (scrollY) {
30
- marginHeader = useHeaderHeight();
31
- imageAnimatedStyle = {
32
- transform: [
33
- {
34
- scale: scrollY.interpolate?.({
35
- inputRange: [-300, 0, 1],
36
- outputRange: [1.75, 1, 1],
37
- extrapolate: 'clamp',
38
- }),
39
- },
40
- ],
41
- };
42
- handleScroll = Animated.event(
43
- [{nativeEvent: {contentOffset: {y: scrollY}}}],
44
- {useNativeDriver: true},
45
- );
46
- }
47
-
48
- /**
49
- * build content for screen
50
- */
51
- const renderContent = () => {
52
- const results = validateChildren(children, Section);
53
- if (Array.isArray(results)) {
54
- return results.map((item, index) => {
55
- return (
56
- <View
57
- key={`Section${index}`}
58
- style={{
59
- marginTop: item.props?.useMargin ? Spacing.M : 0,
60
- flex: item.props?.expanded ? 1 : undefined,
61
- }}>
62
- {item}
63
- </View>
64
- );
65
- });
66
- }
67
- return results;
68
- };
69
-
70
- return (
71
- <View style={Styles.flex} accessibilityLabel={`ScreenContainer`}>
72
- <View
73
- style={{
74
- position: 'absolute',
75
- height: 300,
76
- width: '100%',
77
- }}>
78
- {!!headerBackground && (
79
- <Animated.Image
80
- source={{
81
- uri: headerBackground,
82
- }}
83
- style={{
84
- aspectRatio: 1.3,
85
- ...imageAnimatedStyle,
86
- }}
87
- />
88
- )}
89
- </View>
90
- <KeyboardAvoidingView
91
- style={Styles.flex}
92
- enabled={enableKeyboardAvoidingView}
93
- behavior={Platform.select({
94
- ios: 'padding',
95
- android: undefined,
96
- })}>
97
- <Component
98
- {...scrollViewProps}
99
- onScroll={handleScroll}
100
- style={[Styles.flex, {marginTop: marginHeader}]}>
101
- {renderContent()}
102
- </Component>
103
- {Footer && (
104
- <View
105
- style={{
106
- paddingTop: Spacing.S,
107
- paddingBottom: insets.bottom,
108
- backgroundColor: theme.colors.background.surface,
109
- }}>
110
- <Section>{Footer}</Section>
111
- </View>
112
- )}
113
- </KeyboardAvoidingView>
114
- </View>
115
- );
116
- };
117
-
118
- ScreenContainer.defaultProps = {
119
- enableKeyboardAvoidingView: false,
120
- scrollable: false,
121
- };
122
- export default ScreenContainer;
@@ -1,39 +0,0 @@
1
- import React, {FC} from 'react';
2
- import {BottomTabProps} from './types';
3
- import {createBottomTabNavigator} from '@react-navigation/bottom-tabs';
4
- import {Icon} from '../Icon';
5
-
6
- const Tab = createBottomTabNavigator();
7
-
8
- const BottomTab: FC<BottomTabProps> = ({tabs}) => {
9
- return (
10
- <Tab.Navigator>
11
- {tabs.map((item, index) => {
12
- return (
13
- <Tab.Screen
14
- key={`${item.label}-${index}`}
15
- name={item.label}
16
- component={item.screen}
17
- options={{
18
- tabBarLabel: item.label,
19
- tabBarBadge: item?.badgeLabel,
20
- tabBarBadgeStyle: {
21
- borderColor: 'white',
22
- borderWidth: 2,
23
- fontSize: 10,
24
- lineHeight: 14,
25
- fontWeight: 'bold',
26
- alignSelf: 'center',
27
- },
28
- tabBarIcon: ({color, size}) => (
29
- <Icon source={item.icon} color={color} size={size} />
30
- ),
31
- }}
32
- />
33
- );
34
- })}
35
- </Tab.Navigator>
36
- );
37
- };
38
-
39
- export default BottomTab;