@momo-kits/calendar 0.0.55-beta.22 → 0.0.55-beta.30

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 (11) hide show
  1. package/package.json +2 -2
  2. package/src/Calendar.js +4 -32
  3. package/src/CalendarPro.js +30 -25
  4. package/src/Day/index.js +21 -71
  5. package/src/Day/style.js +29 -27
  6. package/src/HeaderControl.js +5 -6
  7. package/src/Month/index.js +19 -24
  8. package/src/MonthList.js +2 -4
  9. package/src/TabHeader.js +13 -7
  10. package/src/calendarPicker/Day.js +2 -1
  11. package/src/calendarPicker/WeekDaysLabels.js +2 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@momo-kits/calendar",
3
- "version": "0.0.55-beta.22",
3
+ "version": "0.0.55-beta.30",
4
4
  "private": false,
5
5
  "main": "index.js",
6
6
  "dependencies": {
@@ -16,4 +16,4 @@
16
16
  },
17
17
  "devDependencies": {},
18
18
  "license": "MoMo"
19
- }
19
+ }
package/src/Calendar.js CHANGED
@@ -1,21 +1,8 @@
1
1
  import PropTypes from 'prop-types';
2
2
  import React, { Component } from 'react';
3
- import {
4
- View,
5
- ScrollView,
6
- Platform,
7
- StyleSheet,
8
- Dimensions,
9
- } from 'react-native';
3
+ import { View, ScrollView, Platform, StyleSheet } from 'react-native';
10
4
  import moment from 'moment';
11
- import {
12
- Text,
13
- SwitchLanguage,
14
- Colors,
15
- Spacing,
16
- Radius,
17
- ScaleSize,
18
- } from '@momo-kits/core';
5
+ import { Text, SwitchLanguage, Colors, Spacing, Radius } from '@momo-kits/core';
19
6
  import Switch from '@momo-kits/switch';
20
7
  import CalendarPro from './CalendarPro';
21
8
  import TabHeader from './TabHeader';
@@ -429,19 +416,10 @@ class Calendar extends Component {
429
416
  maxDate,
430
417
  doubleDate,
431
418
  isHideHeaderPanel,
432
- style,
433
419
  } = this.props;
434
420
  const { isDoubleDateMode } = this.state;
435
- const { width } = Dimensions.get('window');
436
421
  return (
437
- <ScrollView
438
- style={[
439
- styles.scrollView,
440
- {
441
- width: width - ScaleSize(24),
442
- },
443
- style,
444
- ]}>
422
+ <ScrollView style={{ flex: 1, backgroundColor: 'transparent' }}>
445
423
  <View
446
424
  style={{
447
425
  backgroundColor: Colors.black_01,
@@ -451,7 +429,6 @@ class Calendar extends Component {
451
429
  {!isHideHeaderPanel && this.renderHeaderPanel()}
452
430
  </View>
453
431
  <CalendarPro
454
- priceList={priceList}
455
432
  ref={this.calendarPicker}
456
433
  startDate={doubleDate?.first}
457
434
  endDate={doubleDate?.second}
@@ -460,6 +437,7 @@ class Calendar extends Component {
460
437
  selectedDate={this.selectedDate}
461
438
  isShowLunar={isShowLunar}
462
439
  onCallbackCalendar={onCallbackCalendar}
440
+ priceList={priceList}
463
441
  labelFrom={labelFrom}
464
442
  labelTo={labelTo}
465
443
  isHideLabel={isHideLabel}
@@ -503,7 +481,6 @@ Calendar.propTypes = {
503
481
  PropTypes.string,
504
482
  PropTypes.instanceOf(Date),
505
483
  ]),
506
- style: PropTypes.oneOfType([PropTypes.array, PropTypes.object]),
507
484
  };
508
485
 
509
486
  Calendar.defaultProps = {
@@ -544,9 +521,4 @@ const styles = StyleSheet.create({
544
521
  paddingHorizontal: 12,
545
522
  paddingVertical: 8,
546
523
  },
547
- scrollView: {
548
- flex: 1,
549
- backgroundColor: 'transparent',
550
- alignSelf: 'center',
551
- },
552
524
  });
package/src/CalendarPro.js CHANGED
@@ -11,12 +11,12 @@ import {
11
11
  } from 'react-native';
12
12
  import Moment from 'moment';
13
13
  import {
14
+ Text,
14
15
  SwitchLanguage,
15
16
  LocalizedStrings,
17
+ Colors,
16
18
  Image,
17
19
  IconSource,
18
- Text,
19
- Colors,
20
20
  Spacing,
21
21
  Radius,
22
22
  } from '@momo-kits/core';
@@ -251,7 +251,7 @@ export default class CalendarPro extends Component {
251
251
  onPressNextArrow={this.onPressNextArrow}
252
252
  />
253
253
  <View style={styles.blueSeperator} />
254
- <View>
254
+ <View style={{ paddingHorizontal: Spacing.M }}>
255
255
  <View style={styles.viewDay}>
256
256
  {[1, 2, 3, 4, 5, 6, 7].map((item) => (
257
257
  <Text
@@ -293,15 +293,10 @@ export default class CalendarPro extends Component {
293
293
  </View>
294
294
  </View>
295
295
  {!isOffLunar && (
296
- <View style={[styles.viewLunar]}>
296
+ <View style={styles.viewLunar}>
297
297
  <TouchableWithoutFeedback
298
298
  onPress={this.toggleLunarDate}>
299
299
  <Image
300
- tintColor={
301
- showLunar
302
- ? Colors.pink_05_b
303
- : Colors.black_17
304
- }
305
300
  source={
306
301
  showLunar
307
302
  ? IconSource.ic_checkbox_checked_24
@@ -310,11 +305,11 @@ export default class CalendarPro extends Component {
310
305
  style={styles.iconSelected}
311
306
  />
312
307
  </TouchableWithoutFeedback>
313
- <Text
308
+ <Text.SubTitle
314
309
  style={styles.txtLunar}
315
310
  onPress={this.toggleLunarDate}>
316
311
  {SwitchLanguage.showLunar}
317
- </Text>
312
+ </Text.SubTitle>
318
313
  </View>
319
314
  )}
320
315
 
@@ -332,13 +327,12 @@ export default class CalendarPro extends Component {
332
327
  const labelHighlight = showLunar
333
328
  ? item.highlight || ''
334
329
  : '';
335
- const labelDate = `${
336
- item.day > 9 ? item.day : `0${item.day}`
337
- }/${
338
- item.month > 9
339
- ? item.month
340
- : `0${item.month}`
341
- }`;
330
+ const labelDate =
331
+ LocalizedStrings.defaultLanguage === 'en'
332
+ ? `${Util.mapMonthShorten(
333
+ item.month,
334
+ )} ${item.day}`
335
+ : `${item.day} tháng ${item.month}`;
342
336
  return (
343
337
  <View
344
338
  style={styles.row}
@@ -350,6 +344,16 @@ export default class CalendarPro extends Component {
350
344
  <Text.SubTitle
351
345
  style={styles.subTextLunar}>
352
346
  {`${labelHoliday} `}
347
+ {labelHighlight ? (
348
+ <Text
349
+ style={{
350
+ color: Colors.red_05,
351
+ }}>
352
+ {labelHighlight}
353
+ </Text>
354
+ ) : (
355
+ ''
356
+ )}
353
357
  </Text.SubTitle>
354
358
  </View>
355
359
  );
@@ -386,7 +390,7 @@ CalendarPro.defaultProps = {
386
390
 
387
391
  const styles = StyleSheet.create({
388
392
  row: { flexDirection: 'row' },
389
- txtMonthLunar: { color: Colors.red_05, marginRight: Spacing.S },
393
+ txtMonthLunar: { color: Colors.red_05, width: 80 },
390
394
  subTextLunar: {
391
395
  // fontSize: 12,
392
396
  color: '#222222',
@@ -398,20 +402,21 @@ const styles = StyleSheet.create({
398
402
  txtLunar: {
399
403
  paddingLeft: 6,
400
404
  color: '#222222',
401
- fontSize: 14,
405
+ // fontSize: 12,
406
+ lineHeight: 14,
402
407
  },
403
408
  viewLunar: {
404
409
  flexDirection: 'row',
405
410
  alignItems: 'center',
406
- marginHorizontal: Spacing.M,
407
- borderTopWidth: 1,
408
- paddingTop: Spacing.M,
411
+ marginHorizontal: 12,
412
+ paddingVertical: 12,
413
+ borderBottomWidth: 1,
409
414
  borderStyle: 'solid',
410
- borderColor: Colors.black_04,
415
+ borderColor: '#c7c7cd',
411
416
  },
412
417
  viewDate: {},
413
418
  textDay: {
414
- fontSize: 12,
419
+ // fontSize: 14,
415
420
  lineHeight: 16,
416
421
  width: (widthScreen - 38) / 7,
417
422
  textAlign: 'center',
package/src/Day/index.js CHANGED
@@ -1,8 +1,8 @@
1
1
  import React, { Component } from 'react';
2
2
  import PropTypes from 'prop-types';
3
3
 
4
- import { View, TouchableHighlight } from 'react-native';
5
- import { Spacing, SwitchLanguage, Colors, Text } from '@momo-kits/core';
4
+ import { View, TouchableHighlight, Text } from 'react-native';
5
+ import { Colors, SwitchLanguage } from '@momo-kits/core';
6
6
  import style from './style';
7
7
 
8
8
  class Day extends Component {
@@ -144,18 +144,13 @@ class Day extends Component {
144
144
  <TouchableHighlight
145
145
  style={[
146
146
  style.day,
147
- {
148
- paddingVertical: !!price
149
- ? Spacing.XS
150
- : Spacing.S,
151
- },
152
147
  (this.isStart || this.isEnd) && style.focused,
153
148
  ]}
154
149
  underlayColor="rgba(255, 255, 255, 0.35)"
155
150
  onPress={this.chooseDay}>
156
151
  <>
157
152
  {this.lunarDate && this.showLunar && (
158
- <Text.Caption
153
+ <Text
159
154
  style={[
160
155
  style.lunarDayText,
161
156
  (this.isLunarHoliday ||
@@ -167,58 +162,24 @@ class Day extends Component {
167
162
  {this.lunarDate.lunarDay === 1
168
163
  ? `${this.lunarDate.lunarDay}/${this.lunarDate.lunarMonth}`
169
164
  : this.lunarDate.lunarDay}
170
- </Text.Caption>
165
+ </Text>
171
166
  )}
172
- <Text.Title
167
+ <Text
173
168
  style={[
174
169
  style.dayText,
175
- { paddingTop: !!price ? 4 : 0 },
176
170
  this.isWeekEnd && style.weekendDay,
177
171
  this.isSolarHoliday && style.weekendDay,
178
172
  (this.isStart || this.isEnd) &&
179
173
  style.focusedText,
180
174
  ]}>
181
175
  {text}
182
- </Text.Title>
183
- {!!price ? (
184
- <Text.Caption
185
- style={[
186
- this.isValid && this.isInScope
187
- ? style.price
188
- : style.dayTextDisabled,
189
- isBestPrice && {
190
- color: Colors.pink_03,
191
- },
192
- (this.isStart || this.isEnd) && {
193
- color: Colors.black_01,
194
- },
195
- ]}>
196
- {price}
197
- </Text.Caption>
198
- ) : (
199
- <View
200
- style={{
201
- paddingBottom: this.props
202
- .havePriceList
203
- ? Spacing.S
204
- : 0,
205
- }}
206
- />
207
- )}
176
+ </Text>
208
177
  </>
209
178
  </TouchableHighlight>
210
179
  ) : (
211
- <View
212
- style={[
213
- style.day,
214
- {
215
- paddingVertical: !!price
216
- ? Spacing.XS + Spacing.XXS
217
- : Spacing.S,
218
- },
219
- ]}>
180
+ <View style={[style.day]}>
220
181
  {this.lunarDate && this.showLunar && text ? (
221
- <Text.Caption
182
+ <Text
222
183
  style={[
223
184
  style.lunarDayText,
224
185
  style.dayTextDisabled,
@@ -226,38 +187,27 @@ class Day extends Component {
226
187
  {this.lunarDate.lunarDay === 1
227
188
  ? `${this.lunarDate.lunarDay}/${this.lunarDate.lunarMonth}`
228
189
  : this.lunarDate.lunarDay}
229
- </Text.Caption>
190
+ </Text>
230
191
  ) : (
231
192
  <View />
232
193
  )}
233
- <Text.Title
194
+ <Text
234
195
  style={[style.dayText, style.dayTextDisabled]}>
235
196
  {text}
236
- </Text.Title>
237
- {text && !!price ? (
238
- <Text.Caption
239
- style={[
240
- this.isValid && this.isInScope
241
- ? style.price
242
- : style.dayTextDisabled,
243
- isBestPrice && {
244
- color: Colors.pink_05_b,
245
- },
246
- ]}>
247
- {price}
248
- </Text.Caption>
249
- ) : (
250
- <View
251
- style={{
252
- paddingBottom: this.props.havePriceList
253
- ? Spacing.S
254
- : 0,
255
- }}
256
- />
257
- )}
197
+ </Text>
258
198
  </View>
259
199
  )}
260
200
  </View>
201
+
202
+ {this.isValid && this.isInScope && !!price && (
203
+ <Text
204
+ style={[
205
+ style.price,
206
+ isBestPrice && { color: Colors.pink_05_b },
207
+ ]}>
208
+ {price}
209
+ </Text>
210
+ )}
261
211
  </View>
262
212
  );
263
213
  }
package/src/Day/style.js CHANGED
@@ -1,9 +1,9 @@
1
1
  import { Dimensions } from 'react-native';
2
- import { Spacing, Colors } from '@momo-kits/core';
2
+ import { Colors } from '@momo-kits/core';
3
3
 
4
4
  const dayWidth = (Dimensions.get('window').width - 38) / 7;
5
5
  const SCREEN_WIDTH = Dimensions.get('window').width;
6
- const SCREEN_DPI_WIDTH = SCREEN_WIDTH * Dimensions.get('window').scale;
6
+ const SCREEN_DPI_WIDTH = (SCREEN_WIDTH * Dimensions.get('window').scale);
7
7
  const IPHONE_4_5_WIDTH = 640;
8
8
  const dayTextSize = SCREEN_DPI_WIDTH === IPHONE_4_5_WIDTH ? 13 : 15;
9
9
  const lunarTextSize = SCREEN_DPI_WIDTH === IPHONE_4_5_WIDTH ? 8 : 10;
@@ -11,8 +11,7 @@ const priceTextSize = SCREEN_DPI_WIDTH === IPHONE_4_5_WIDTH ? 8 : 10;
11
11
  const lineHeightDayText = 1.3 * dayTextSize;
12
12
  const lineHeightLunarText = 1.3 * lunarTextSize;
13
13
  const lineHeightPriceText = 1.3 * priceTextSize;
14
- const containerDayHeight =
15
- lineHeightDayText + lineHeightLunarText + lineHeightPriceText + 10;
14
+ const containerDayHeight = lineHeightDayText + lineHeightLunarText + lineHeightPriceText + 10;
16
15
  const heightDefault = lineHeightDayText + lineHeightLunarText;
17
16
  export default {
18
17
  dayContainer: {
@@ -23,52 +22,55 @@ export default {
23
22
  },
24
23
  day: {
25
24
  width: dayWidth,
25
+ paddingVertical: 5,
26
26
  overflow: 'hidden',
27
27
  justifyContent: 'center',
28
28
  alignItems: 'center',
29
29
  borderRadius: 4,
30
+ height: heightDefault + 5
30
31
  },
31
32
  dayText: {
32
- lineHeight: 24,
33
+ fontSize: dayTextSize,
33
34
  textAlign: 'center',
35
+ fontWeight: 'bold',
36
+ color: '#222222'
34
37
  },
35
38
  lunarDayText: {
36
39
  width: dayWidth,
37
40
  textAlign: 'right',
38
- paddingRight: Spacing.XS,
39
- position: 'absolute',
40
- top: Spacing.XXS,
41
- lineHeight: 14,
41
+ fontSize: SCREEN_DPI_WIDTH === IPHONE_4_5_WIDTH ? 8 : 10,
42
+ paddingRight: 5,
43
+ color: '#222222'
42
44
  },
43
45
  todayText: {
44
- color: 'blue',
46
+ color: 'blue'
45
47
  },
46
48
  weekendDay: {
47
- color: Colors.red_05,
49
+ color: '#e82956'
48
50
  },
49
51
  dayTextDisabled: {
50
- opacity: 0.4,
52
+ opacity: 0.2
51
53
  },
52
-
53
54
  focused: {
54
- backgroundColor: Colors.pink_05_b,
55
+ backgroundColor: Colors.pink_05_b
55
56
  },
56
57
  focusedText: {
57
- fontWeight: 'bold',
58
- color: 'white',
58
+ color: 'white'
59
59
  },
60
60
  dayStartContainer: {
61
61
  borderTopLeftRadius: 4,
62
62
  borderBottomLeftRadius: 4,
63
- backgroundColor: Colors.pink_05_b,
63
+ backgroundColor: Colors.pink_09,
64
+ // height: heightDefault
64
65
  },
65
66
  dayEndContainer: {
66
67
  borderTopRightRadius: 4,
67
68
  borderBottomRightRadius: 4,
68
- backgroundColor: Colors.pink_05_b,
69
+ backgroundColor: Colors.pink_09,
70
+ // height: heightDefault
69
71
  },
70
72
  mid: {
71
- backgroundColor: Colors.pink_11,
73
+ backgroundColor: Colors.pink_09,
72
74
  // height: heightDefault
73
75
  },
74
76
  departLabel: {
@@ -78,7 +80,7 @@ export default {
78
80
  height: 20,
79
81
  borderRadius: 10,
80
82
  justifyContent: 'center',
81
- alignItems: 'center',
83
+ alignItems: 'center'
82
84
  },
83
85
  returnLabel: {
84
86
  position: 'absolute',
@@ -89,7 +91,7 @@ export default {
89
91
  justifyContent: 'center',
90
92
  alignItems: 'center',
91
93
  top: 0,
92
- right: 0,
94
+ right: 0
93
95
  },
94
96
  containerDayHeight,
95
97
  txtBack: {
@@ -103,7 +105,7 @@ export default {
103
105
  width: 15,
104
106
  height: 15,
105
107
  justifyContent: 'center',
106
- alignItems: 'center',
108
+ alignItems: 'center'
107
109
  },
108
110
  txtGo: {
109
111
  position: 'absolute',
@@ -116,12 +118,12 @@ export default {
116
118
  width: 15,
117
119
  height: 15,
118
120
  justifyContent: 'center',
119
- alignItems: 'center',
121
+ alignItems: 'center'
120
122
  },
121
123
  price: {
122
- color: Colors.black_15,
123
- marginTop: -4,
124
- lineHeight: 14,
124
+ fontSize: priceTextSize,
125
+ lineHeight: lineHeightPriceText,
126
+ color: '#8d919d'
125
127
  },
126
- lineHeightPriceText,
128
+ lineHeightPriceText
127
129
  };
package/src/HeaderControl.js CHANGED
@@ -1,8 +1,7 @@
1
1
  import React, { useState, forwardRef, useImperativeHandle } from 'react';
2
2
  import { View, TouchableOpacity, StyleSheet } from 'react-native';
3
3
  import moment from 'moment';
4
- import { Icon, ScaleSize, Text, Colors, Spacing } from '@momo-kits/core';
5
-
4
+ import { Text, Icon, Colors, Spacing, ScaleSize } from '@momo-kits/core';
6
5
  import Util from './Util';
7
6
 
8
7
  const HeaderControl = forwardRef(
@@ -34,9 +33,7 @@ const HeaderControl = forwardRef(
34
33
  style={styles.icon}
35
34
  />
36
35
  </TouchableOpacity>
37
- <Text.Title style={styles.txtHeader}>
38
- {headerFormat}
39
- </Text.Title>
36
+ <Text.H4 style={styles.txtHeader}>{headerFormat}</Text.H4>
40
37
  <TouchableOpacity
41
38
  style={styles.btnRight}
42
39
  onPress={onPressNextArrow}>
@@ -58,8 +55,10 @@ const styles = StyleSheet.create({
58
55
  icon: { width: 24, height: 24, resizeMode: 'contain' },
59
56
  txtHeader: {
60
57
  // fontSize: 15,
58
+ lineHeight: 19,
61
59
  fontWeight: 'bold',
62
60
  textAlign: 'center',
61
+ color: Colors.black_17,
63
62
  },
64
63
  btnRight: {
65
64
  width: 36,
@@ -77,7 +76,7 @@ const styles = StyleSheet.create({
77
76
  height: ScaleSize(44),
78
77
  flexDirection: 'row',
79
78
  justifyContent: 'space-between',
80
- backgroundColor: Colors.blue_11,
79
+ backgroundColor: Colors.blue_10,
81
80
  alignItems: 'center',
82
81
  borderRadius: 4,
83
82
  },
package/src/Month/index.js CHANGED
@@ -1,20 +1,17 @@
1
1
  import React, { PureComponent } from 'react';
2
2
 
3
- import { View, Dimensions } from 'react-native';
3
+ import {
4
+ View
5
+ } from 'react-native';
4
6
  import moment from 'moment';
5
7
  import Day from '../Day';
6
- import { Spacing, ScaleSize } from '@momo-kits/core';
7
-
8
- const { width } = Dimensions.get('window');
9
8
 
10
9
  export default class Month extends PureComponent {
11
10
  constructor(props) {
12
11
  super(props);
13
12
  const { dateList } = props;
14
13
  this.rowArray = new Array(dateList.length / 7).fill('');
15
- this.temp = this.rowArray.map((item, i) =>
16
- dateList.slice(i * 7, i * 7 + 7),
17
- );
14
+ this.temp = this.rowArray.map((item, i) => dateList.slice(i * 7, i * 7 + 7));
18
15
  }
19
16
 
20
17
  findHoliday = (date) => {
@@ -22,9 +19,7 @@ export default class Month extends PureComponent {
22
19
  if (date && holidays && holidays.length > 0) {
23
20
  const day = date.date();
24
21
  const month = date.month() + 1;
25
- return holidays.find(
26
- (item) => item.day === day && item.month === month,
27
- );
22
+ return holidays.find((item) => item.day === day && item.month === month);
28
23
  }
29
24
  return null;
30
25
  };
@@ -33,7 +28,7 @@ export default class Month extends PureComponent {
33
28
  const holiday = this.findHoliday(date);
34
29
  return {
35
30
  isSolarHoliday: !!(holiday && !holiday.lunar),
36
- isLunarHoliday: !!(holiday && holiday.lunar),
31
+ isLunarHoliday: !!(holiday && holiday.lunar)
37
32
  };
38
33
  };
39
34
 
@@ -41,9 +36,10 @@ export default class Month extends PureComponent {
41
36
  <View
42
37
  style={{
43
38
  flexDirection: 'row',
44
- justifyContent: 'space-between',
39
+ justifyContent: 'space-between'
45
40
  }}
46
- key={`row${index}`}>
41
+ key={`row${index}`}
42
+ >
47
43
  {dayList.map((item, i) => {
48
44
  const keyDay = moment(item.date).format('YYYY-MM-DD');
49
45
  const priceInfo = this.props?.priceListDate?.[keyDay];
@@ -52,7 +48,6 @@ export default class Month extends PureComponent {
52
48
  {...this.props}
53
49
  {...this.checkHoliday(item.date)}
54
50
  date={item.date}
55
- havePriceList={!!this.props.priceListDate}
56
51
  lunarDate={item.lunarDate}
57
52
  empty={item.empty}
58
53
  key={`day${i.toString()}`}
@@ -61,25 +56,25 @@ export default class Month extends PureComponent {
61
56
  isBestPrice={priceInfo?.isBestPrice}
62
57
  />
63
58
  );
64
- })}
59
+ }
60
+ )}
65
61
  </View>
66
62
  );
63
+
67
64
  render() {
68
- const { month } = this.props;
65
+ const {
66
+ month
67
+ } = this.props;
69
68
  if (month) {
70
69
  return (
71
70
  <View>
72
- <View
73
- style={{
74
- paddingHorizontal: Spacing.S,
75
- paddingVertical: 5,
76
- width: width - ScaleSize(24),
77
- }}>
78
- {this.temp.map((item, i) => this.renderDayRow(item, i))}
71
+ <View style={{ paddingHorizontal: 7, paddingVertical: 5 }}>
72
+ {this.temp.map((item, i) => this.renderDayRow(item, i)
73
+ )}
79
74
  </View>
80
75
  </View>
81
76
  );
82
77
  }
83
- return <View />;
78
+ return (<View />);
84
79
  }
85
80
  }
package/src/MonthList.js CHANGED
@@ -1,13 +1,12 @@
1
1
  /* eslint-disable react/no-did-update-set-state */
2
2
  import React, { Component } from 'react';
3
- import { FlatList, Dimensions, Platform, View } from 'react-native';
3
+ import { FlatList, Dimensions, Platform } from 'react-native';
4
4
  import moment from 'moment';
5
5
  import Month from './Month';
6
6
  import style from './Day/style';
7
7
  import LunarDateConverter from './LunarDateConverter';
8
- import { ScaleSize } from '@momo-kits/core';
9
8
 
10
- const ITEM_WIDTH = Dimensions.get('window').width - ScaleSize(24);
9
+ const ITEM_WIDTH = Dimensions.get('window').width - 24;
11
10
  const MAX_RENDER_PER_BATCH = Platform.OS === 'android' ? 1 : 12;
12
11
 
13
12
  const converter = new LunarDateConverter();
@@ -267,7 +266,6 @@ export default class MonthList extends Component {
267
266
  onViewableItemsChanged={this.getCurrentVisibleMonth}
268
267
  onScrollToIndexFailed={() => {}}
269
268
  // removeClippedSubviews
270
- scrollEnabled
271
269
  initialNumToRender={1}
272
270
  maxToRenderPerBatch={MAX_RENDER_PER_BATCH}
273
271
  windowSize={3}
package/src/TabHeader.js CHANGED
@@ -55,30 +55,36 @@ export default class TabHeader extends React.Component {
55
55
  flex: 1,
56
56
  backgroundColor: Colors.white,
57
57
  }}>
58
- <Text.SubTitle
58
+ <Text
59
59
  style={{
60
60
  fontSize: 12,
61
61
  lineHeight: 16,
62
62
  color: Colors.black_09,
63
63
  }}>
64
64
  {label}
65
- </Text.SubTitle>
66
- <Text.Title
67
- weight={active ? 'bold' : 'regular'}
65
+ </Text>
66
+ <Text
67
+ weight={active ? 'semibold' : 'regular'}
68
68
  style={{
69
69
  marginTop: 3,
70
+ fontSize: 14,
71
+ color: Colors.black_17,
70
72
  }}>
71
- <Text.Title weight={active ? 'bold' : 'regular'}>
73
+ <Text
74
+ weight={active ? 'semibold' : 'regular'}
75
+ style={{
76
+ color: Colors.black_17,
77
+ }}>
72
78
  {`${
73
79
  dayOfWeekFromState ||
74
80
  dayOfWeekFromDefault ||
75
81
  '--'
76
82
  } `}
77
- </Text.Title>
83
+ </Text>
78
84
  {formattedDateFromState ||
79
85
  formattedDateFromDefault ||
80
86
  '--/--/----'}
81
- </Text.Title>
87
+ </Text>
82
88
  </View>
83
89
  </TouchableWithoutFeedback>
84
90
  );
package/src/calendarPicker/Day.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import React, { Component } from 'react';
2
- import { TouchableOpacity, View, Text } from 'react-native';
2
+ import { TouchableOpacity, View } from 'react-native';
3
3
  import PropTypes from 'prop-types';
4
+ import { Text } from '@momo-kits/core';
4
5
  import styles from './styles';
5
6
 
6
7
  export default class Day extends Component {
package/src/calendarPicker/WeekDaysLabels.js CHANGED
@@ -9,11 +9,11 @@ const colorDay = '#9199a2';
9
9
  const WeekDaysLabels = () => (
10
10
  <View style={styles.dayLabelsWrapper}>
11
11
  {WEEKDAYS.map((day, key) => (
12
- <Text.Title1
12
+ <Text.Title
13
13
  key={key.toString()}
14
14
  style={[styles.dayLabels, { color: colorDay, fontSize: 16 }]}>
15
15
  {day}
16
- </Text.Title1>
16
+ </Text.Title>
17
17
  ))}
18
18
  </View>
19
19
  );