@momo-kits/chip 0.72.2 → 0.72.6

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 (3) hide show
  1. package/index.js +35 -40
  2. package/package.json +2 -2
  3. package/publish.sh +1 -1
package/index.js CHANGED
@@ -7,7 +7,7 @@ import {
7
7
  Spacing,
8
8
  Text,
9
9
  TouchableOpacity,
10
- } from '@momo-kits/core-v2';
10
+ } from '@momo-kits/core';
11
11
  import PropTypes from 'prop-types';
12
12
 
13
13
  const textSize = {
@@ -36,66 +36,62 @@ const imageSize = {
36
36
  },
37
37
  };
38
38
 
39
- const chevronDown =
40
- 'https://img.mservice.com.vn/momo_app_v2/new_version/img/appx_icon/16_arrow_chevron_down.png';
41
- const remove = 'https://img.mservice.com.vn/app/img/kits/ic_close.png';
42
39
  const Chip = props => {
43
40
  const {
44
- image,
41
+ icon,
45
42
  title,
46
43
  size,
47
44
  onPress,
48
45
  active,
49
46
  style,
50
- onIconPress,
51
- type,
52
- whiteBackground,
53
47
  activeBackgroundColor,
54
48
  activeBorderColor,
55
49
  activeTextColor,
50
+ disabled,
51
+ iconTintColor,
56
52
  } = props;
57
53
 
58
54
  const mapTextSize = textSize[size] || textSize.default;
59
55
  const mapImageSize = imageSize[size] || imageSize.default;
60
- const iconSource = type === 'removable' ? remove : chevronDown;
61
56
 
62
57
  const selectedStyle = {
63
58
  backgroundColor: activeBackgroundColor,
64
59
  };
65
60
 
61
+ const disabledStyle = {
62
+ backgroundColor: Colors.black_02,
63
+ };
64
+
65
+ let textColor = active ? activeTextColor : Colors.black_17;
66
+
67
+ if (disabled) {
68
+ textColor = Colors.black_09;
69
+ }
66
70
  return (
67
71
  <TouchableOpacity
68
72
  style={[{alignSelf: 'baseline'}, style]}
69
- onPress={() => onPress?.(!active)}>
73
+ disabled={disabled}
74
+ onPress={() => {
75
+ onPress?.(!active);
76
+ }}>
70
77
  <View
71
78
  style={[
72
79
  styles.container,
73
- whiteBackground && {backgroundColor: Colors.black_01},
74
80
  active && selectedStyle,
81
+ disabled && disabledStyle,
75
82
  ]}>
76
- {image && <Image source={image} style={[mapImageSize]} />}
77
- <Text.Label2
78
- weight="medium"
79
- style={[
80
- mapTextSize,
81
- {color: active ? activeTextColor : Colors.black_17},
82
- ]}>
83
- {title}
84
- </Text.Label2>
85
- {type !== 'default' && (
86
- <TouchableOpacity
87
- onPress={onIconPress}
88
- disabled={!onIconPress}
89
- style={styles.iconContainer}>
90
- <Image
91
- source={iconSource}
92
- style={[
93
- styles.icon,
94
- type === 'removable' && {tintColor: Colors.black_12},
95
- ]}
96
- />
97
- </TouchableOpacity>
83
+ {icon && (
84
+ <Image
85
+ source={icon}
86
+ tintColor={disabled ? Colors.black_09 : iconTintColor}
87
+ style={[mapImageSize]}
88
+ />
98
89
  )}
90
+ <Text.SubTitle
91
+ weight={active ? 'bold' : 'regular'}
92
+ style={[mapTextSize, {color: textColor}]}>
93
+ {title}
94
+ </Text.SubTitle>
99
95
  </View>
100
96
  {active && (
101
97
  <View
@@ -141,28 +137,27 @@ const styles = StyleSheet.create({
141
137
  });
142
138
 
143
139
  Chip.propTypes = {
144
- image: PropTypes.string,
140
+ icon: PropTypes.string,
145
141
  title: PropTypes.string,
146
142
  size: PropTypes.oneOf(['small', 'default']),
147
143
  onPress: PropTypes.func,
148
144
  active: PropTypes.bool,
149
145
  style: PropTypes.oneOfType([PropTypes.array, PropTypes.object]),
150
146
  onIconPress: PropTypes.func,
151
- type: PropTypes.oneOf(['default', 'removable', 'action']),
152
147
  activeBackgroundColor: PropTypes.string,
153
148
  activeBorderColor: PropTypes.string,
154
149
  activeTextColor: PropTypes.string,
155
150
  whiteBackground: PropTypes.bool,
151
+ iconTintColor: PropTypes.string,
156
152
  };
157
153
 
158
154
  Chip.defaultProps = {
159
155
  size: 'default',
160
- type: 'default',
161
156
  active: false,
162
- activeBackgroundColor: Colors.pink_10,
163
- activeBorderColor: Colors.pink_06,
164
- activeTextColor: Colors.pink_03,
165
- whiteBackground: false,
157
+ activeBackgroundColor: Colors.pink_11,
158
+ activeBorderColor: Colors.pink_07,
159
+ activeTextColor: Colors.pink_05_b,
160
+ iconTintColor: null,
166
161
  };
167
162
 
168
163
  export default Chip;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@momo-kits/chip",
3
- "version": "0.72.2",
3
+ "version": "0.72.6",
4
4
  "private": false,
5
5
  "main": "index.js",
6
6
  "dependencies": {
@@ -14,4 +14,4 @@
14
14
  },
15
15
  "devDependencies": {},
16
16
  "license": "MoMo"
17
- }
17
+ }
package/publish.sh CHANGED
@@ -26,4 +26,4 @@ cd ..
26
26
  rm -rf dist
27
27
 
28
28
 
29
- #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/chip new version release: '*"$VERSION"*' https://www.npmjs.com/package/@momo-kits/chip"}'
29
+ 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/chip new version release: '*"$VERSION"*' https://www.npmjs.com/package/@momo-kits/chip"}'