@momo-kits/calendar 0.0.55-beta.9 → 0.0.56-beta.1

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 +3 -4
  2. package/src/Calendar.js +4 -32
  3. package/src/CalendarPro.js +35 -21
  4. package/src/Day/index.js +20 -44
  5. package/src/Day/style.js +25 -19
  6. package/src/HeaderControl.js +4 -6
  7. package/src/Month/index.js +19 -24
  8. package/src/MonthList.js +2 -3
  9. package/src/TabHeader.js +14 -9
  10. package/src/calendarPicker/Day.js +5 -5
  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.9",
3
+ "version": "0.0.56-beta.1",
4
4
  "private": false,
5
5
  "main": "index.js",
6
6
  "dependencies": {
@@ -12,9 +12,8 @@
12
12
  "react": "16.9.0",
13
13
  "react-native": ">=0.55",
14
14
  "prop-types": "^15.7.2",
15
- "@momo-kits/core": ">=0.0.5-beta",
16
- "@momo-kits/v2-core": "^0.0.51-beta.5"
15
+ "@momo-kits/core": ">=0.0.5-beta"
17
16
  },
18
17
  "devDependencies": {},
19
18
  "license": "MoMo"
20
- }
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,15 @@ 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,
20
+ Spacing,
21
+ Radius,
18
22
  } from '@momo-kits/core';
19
- import { Text, Colors, Spacing, Radius } from '@momo-kits/v2-core';
20
23
  import MonthList from './MonthList';
21
24
  import HeaderControl from './HeaderControl';
22
25
  import LunarDateConverter from './LunarDateConverter';
@@ -248,10 +251,10 @@ export default class CalendarPro extends Component {
248
251
  onPressNextArrow={this.onPressNextArrow}
249
252
  />
250
253
  <View style={styles.blueSeperator} />
251
- <View>
254
+ <View style={{ paddingHorizontal: Spacing.M }}>
252
255
  <View style={styles.viewDay}>
253
256
  {[1, 2, 3, 4, 5, 6, 7].map((item) => (
254
- <Text.Label2
257
+ <Text
255
258
  style={[
256
259
  styles.textDay,
257
260
  {
@@ -263,7 +266,7 @@ export default class CalendarPro extends Component {
263
266
  ]}
264
267
  key={item}>
265
268
  {Util.mapWeeKDate(item)}
266
- </Text.Label2>
269
+ </Text>
267
270
  ))}
268
271
  </View>
269
272
  <MonthList
@@ -290,13 +293,10 @@ export default class CalendarPro extends Component {
290
293
  </View>
291
294
  </View>
292
295
  {!isOffLunar && (
293
- <View style={[styles.viewLunar]}>
296
+ <View style={styles.viewLunar}>
294
297
  <TouchableWithoutFeedback
295
298
  onPress={this.toggleLunarDate}>
296
299
  <Image
297
- tintColor={
298
- showLunar ? Colors.pink_03 : Colors.black_17
299
- }
300
300
  source={
301
301
  showLunar
302
302
  ? IconSource.ic_checkbox_checked_24
@@ -305,11 +305,11 @@ export default class CalendarPro extends Component {
305
305
  style={styles.iconSelected}
306
306
  />
307
307
  </TouchableWithoutFeedback>
308
- <Text.Description1
308
+ <Text.SubTitle
309
309
  style={styles.txtLunar}
310
310
  onPress={this.toggleLunarDate}>
311
311
  {SwitchLanguage.showLunar}
312
- </Text.Description1>
312
+ </Text.SubTitle>
313
313
  </View>
314
314
  )}
315
315
 
@@ -327,21 +327,34 @@ export default class CalendarPro extends Component {
327
327
  const labelHighlight = showLunar
328
328
  ? item.highlight || ''
329
329
  : '';
330
- const labelDate = `${item.day}/${item.month}`;
330
+ const labelDate =
331
+ LocalizedStrings.defaultLanguage === 'en'
332
+ ? `${Util.mapMonthShorten(
333
+ item.month,
334
+ )} ${item.day}`
335
+ : `${item.day} tháng ${item.month}`;
331
336
  return (
332
337
  <View
333
338
  style={styles.row}
334
339
  key={idx.toString()}>
335
- <Text.Description2
336
- status="red"
340
+ <Text.SubTitle
337
341
  style={styles.txtMonthLunar}>
338
342
  {labelDate}
339
- </Text.Description2>
340
- <Text.Description2
341
- status="hint"
343
+ </Text.SubTitle>
344
+ <Text.SubTitle
342
345
  style={styles.subTextLunar}>
343
346
  {`${labelHoliday} `}
344
- </Text.Description2>
347
+ {labelHighlight ? (
348
+ <Text
349
+ style={{
350
+ color: Colors.red_05,
351
+ }}>
352
+ {labelHighlight}
353
+ </Text>
354
+ ) : (
355
+ ''
356
+ )}
357
+ </Text.SubTitle>
345
358
  </View>
346
359
  );
347
360
  })}
@@ -377,7 +390,7 @@ CalendarPro.defaultProps = {
377
390
 
378
391
  const styles = StyleSheet.create({
379
392
  row: { flexDirection: 'row' },
380
- txtMonthLunar: { color: Colors.red_05, marginRight: Spacing.S },
393
+ txtMonthLunar: { color: Colors.red_05, width: 80 },
381
394
  subTextLunar: {
382
395
  // fontSize: 12,
383
396
  color: '#222222',
@@ -390,13 +403,14 @@ const styles = StyleSheet.create({
390
403
  paddingLeft: 6,
391
404
  color: '#222222',
392
405
  // fontSize: 12,
406
+ lineHeight: 14,
393
407
  },
394
408
  viewLunar: {
395
409
  flexDirection: 'row',
396
410
  alignItems: 'center',
397
- marginHorizontal: Spacing.M,
398
- borderTopWidth: 1,
399
- paddingTop: Spacing.M,
411
+ marginHorizontal: 12,
412
+ paddingVertical: 12,
413
+ borderBottomWidth: 1,
400
414
  borderStyle: 'solid',
401
415
  borderColor: '#c7c7cd',
402
416
  },
package/src/Day/index.js CHANGED
@@ -1,11 +1,9 @@
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 } from '@momo-kits/core';
6
- import { Colors, Text } from '@momo-kits/v2-core';
4
+ import { View, TouchableHighlight, Text } from 'react-native';
5
+ import { Colors, SwitchLanguage } from '@momo-kits/core';
7
6
  import style from './style';
8
- import styles from '../../../../core/components/modalize/styles';
9
7
 
10
8
  class Day extends Component {
11
9
  constructor(props) {
@@ -146,18 +144,13 @@ class Day extends Component {
146
144
  <TouchableHighlight
147
145
  style={[
148
146
  style.day,
149
- {
150
- paddingVertical: !!price
151
- ? Spacing.XS
152
- : Spacing.S,
153
- },
154
147
  (this.isStart || this.isEnd) && style.focused,
155
148
  ]}
156
149
  underlayColor="rgba(255, 255, 255, 0.35)"
157
150
  onPress={this.chooseDay}>
158
151
  <>
159
152
  {this.lunarDate && this.showLunar && (
160
- <Text.Label4
153
+ <Text
161
154
  style={[
162
155
  style.lunarDayText,
163
156
  (this.isLunarHoliday ||
@@ -169,9 +162,9 @@ class Day extends Component {
169
162
  {this.lunarDate.lunarDay === 1
170
163
  ? `${this.lunarDate.lunarDay}/${this.lunarDate.lunarMonth}`
171
164
  : this.lunarDate.lunarDay}
172
- </Text.Label4>
165
+ </Text>
173
166
  )}
174
- <Text.Label1
167
+ <Text
175
168
  style={[
176
169
  style.dayText,
177
170
  this.isWeekEnd && style.weekendDay,
@@ -180,29 +173,13 @@ class Day extends Component {
180
173
  style.focusedText,
181
174
  ]}>
182
175
  {text}
183
- </Text.Label1>
184
- {this.isValid && this.isInScope && !!price ? (
185
- <Text.Description3
186
- style={[
187
- style.price,
188
- isBestPrice && {
189
- color: Colors.pink_03,
190
- },
191
- (this.isStart || this.isEnd) && {
192
- color: Colors.black_01,
193
- },
194
- ]}>
195
- {price}
196
- </Text.Description3>
197
- ) : (
198
- <View style={{ height: Spacing.S }} />
199
- )}
176
+ </Text>
200
177
  </>
201
178
  </TouchableHighlight>
202
179
  ) : (
203
180
  <View style={[style.day]}>
204
181
  {this.lunarDate && this.showLunar && text ? (
205
- <Text.Label4
182
+ <Text
206
183
  style={[
207
184
  style.lunarDayText,
208
185
  style.dayTextDisabled,
@@ -210,28 +187,27 @@ class Day extends Component {
210
187
  {this.lunarDate.lunarDay === 1
211
188
  ? `${this.lunarDate.lunarDay}/${this.lunarDate.lunarMonth}`
212
189
  : this.lunarDate.lunarDay}
213
- </Text.Label4>
190
+ </Text>
214
191
  ) : (
215
192
  <View />
216
193
  )}
217
- <Text.Label1
194
+ <Text
218
195
  style={[style.dayText, style.dayTextDisabled]}>
219
196
  {text}
220
- </Text.Label1>
221
- {this.isValid && this.isInScope && (
222
- <Text.Description3
223
- style={[
224
- style.price,
225
- isBestPrice && {
226
- color: Colors.pink_03,
227
- },
228
- ]}>
229
- {'1000'}
230
- </Text.Description3>
231
- )}
197
+ </Text>
232
198
  </View>
233
199
  )}
234
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
+ )}
235
211
  </View>
236
212
  );
237
213
  }
package/src/Day/style.js CHANGED
@@ -1,10 +1,9 @@
1
1
  import { Dimensions } from 'react-native';
2
- import { Spacing } from '@momo-kits/core';
3
- import { Colors } from '@momo-kits/v2-core';
2
+ import { Colors } from '@momo-kits/core';
4
3
 
5
4
  const dayWidth = (Dimensions.get('window').width - 38) / 7;
6
5
  const SCREEN_WIDTH = Dimensions.get('window').width;
7
- const SCREEN_DPI_WIDTH = SCREEN_WIDTH * Dimensions.get('window').scale;
6
+ const SCREEN_DPI_WIDTH = (SCREEN_WIDTH * Dimensions.get('window').scale);
8
7
  const IPHONE_4_5_WIDTH = 640;
9
8
  const dayTextSize = SCREEN_DPI_WIDTH === IPHONE_4_5_WIDTH ? 13 : 15;
10
9
  const lunarTextSize = SCREEN_DPI_WIDTH === IPHONE_4_5_WIDTH ? 8 : 10;
@@ -12,8 +11,7 @@ const priceTextSize = SCREEN_DPI_WIDTH === IPHONE_4_5_WIDTH ? 8 : 10;
12
11
  const lineHeightDayText = 1.3 * dayTextSize;
13
12
  const lineHeightLunarText = 1.3 * lunarTextSize;
14
13
  const lineHeightPriceText = 1.3 * priceTextSize;
15
- const containerDayHeight =
16
- lineHeightDayText + lineHeightLunarText + lineHeightPriceText + 10;
14
+ const containerDayHeight = lineHeightDayText + lineHeightLunarText + lineHeightPriceText + 10;
17
15
  const heightDefault = lineHeightDayText + lineHeightLunarText;
18
16
  export default {
19
17
  dayContainer: {
@@ -24,46 +22,52 @@ export default {
24
22
  },
25
23
  day: {
26
24
  width: dayWidth,
25
+ paddingVertical: 5,
27
26
  overflow: 'hidden',
28
27
  justifyContent: 'center',
29
28
  alignItems: 'center',
30
29
  borderRadius: 4,
30
+ height: heightDefault + 5
31
31
  },
32
32
  dayText: {
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',
41
+ fontSize: SCREEN_DPI_WIDTH === IPHONE_4_5_WIDTH ? 8 : 10,
38
42
  paddingRight: 5,
39
- position: 'absolute',
40
- top: Spacing.XXS,
43
+ color: '#222222'
41
44
  },
42
45
  todayText: {
43
- color: 'blue',
46
+ color: 'blue'
44
47
  },
45
48
  weekendDay: {
46
- color: Colors.red_03,
49
+ color: '#e82956'
47
50
  },
48
51
  dayTextDisabled: {
49
- opacity: 0.2,
52
+ opacity: 0.2
50
53
  },
51
54
  focused: {
52
- backgroundColor: Colors.pink_03,
55
+ backgroundColor: Colors.pink_05_b
53
56
  },
54
57
  focusedText: {
55
- fontWeight: 'bold',
56
- color: 'white',
58
+ color: 'white'
57
59
  },
58
60
  dayStartContainer: {
59
61
  borderTopLeftRadius: 4,
60
62
  borderBottomLeftRadius: 4,
61
63
  backgroundColor: Colors.pink_09,
64
+ // height: heightDefault
62
65
  },
63
66
  dayEndContainer: {
64
67
  borderTopRightRadius: 4,
65
68
  borderBottomRightRadius: 4,
66
69
  backgroundColor: Colors.pink_09,
70
+ // height: heightDefault
67
71
  },
68
72
  mid: {
69
73
  backgroundColor: Colors.pink_09,
@@ -76,7 +80,7 @@ export default {
76
80
  height: 20,
77
81
  borderRadius: 10,
78
82
  justifyContent: 'center',
79
- alignItems: 'center',
83
+ alignItems: 'center'
80
84
  },
81
85
  returnLabel: {
82
86
  position: 'absolute',
@@ -87,7 +91,7 @@ export default {
87
91
  justifyContent: 'center',
88
92
  alignItems: 'center',
89
93
  top: 0,
90
- right: 0,
94
+ right: 0
91
95
  },
92
96
  containerDayHeight,
93
97
  txtBack: {
@@ -101,7 +105,7 @@ export default {
101
105
  width: 15,
102
106
  height: 15,
103
107
  justifyContent: 'center',
104
- alignItems: 'center',
108
+ alignItems: 'center'
105
109
  },
106
110
  txtGo: {
107
111
  position: 'absolute',
@@ -114,10 +118,12 @@ export default {
114
118
  width: 15,
115
119
  height: 15,
116
120
  justifyContent: 'center',
117
- alignItems: 'center',
121
+ alignItems: 'center'
118
122
  },
119
123
  price: {
120
- color: Colors.black_15,
124
+ fontSize: priceTextSize,
125
+ lineHeight: lineHeightPriceText,
126
+ color: '#8d919d'
121
127
  },
122
- lineHeightPriceText,
128
+ lineHeightPriceText
123
129
  };
package/src/HeaderControl.js CHANGED
@@ -1,9 +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 } from '@momo-kits/core';
5
- import { Text, Colors, Spacing } from '@momo-kits/v2-core';
6
-
4
+ import { Text, Icon, Colors, Spacing, ScaleSize } from '@momo-kits/core';
7
5
  import Util from './Util';
8
6
 
9
7
  const HeaderControl = forwardRef(
@@ -35,9 +33,7 @@ const HeaderControl = forwardRef(
35
33
  style={styles.icon}
36
34
  />
37
35
  </TouchableOpacity>
38
- <Text.HeaderText2 style={styles.txtHeader}>
39
- {headerFormat}
40
- </Text.HeaderText2>
36
+ <Text.H4 style={styles.txtHeader}>{headerFormat}</Text.H4>
41
37
  <TouchableOpacity
42
38
  style={styles.btnRight}
43
39
  onPress={onPressNextArrow}>
@@ -59,8 +55,10 @@ const styles = StyleSheet.create({
59
55
  icon: { width: 24, height: 24, resizeMode: 'contain' },
60
56
  txtHeader: {
61
57
  // fontSize: 15,
58
+ lineHeight: 19,
62
59
  fontWeight: 'bold',
63
60
  textAlign: 'center',
61
+ color: Colors.black_17,
64
62
  },
65
63
  btnRight: {
66
64
  width: 36,
package/src/Month/index.js CHANGED
@@ -1,21 +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 } from '@momo-kits/core';
7
- import { ScaleSize } from '@momo-kits/v2-core';
8
-
9
- const { width } = Dimensions.get('window');
10
8
 
11
9
  export default class Month extends PureComponent {
12
10
  constructor(props) {
13
11
  super(props);
14
12
  const { dateList } = props;
15
13
  this.rowArray = new Array(dateList.length / 7).fill('');
16
- this.temp = this.rowArray.map((item, i) =>
17
- dateList.slice(i * 7, i * 7 + 7),
18
- );
14
+ this.temp = this.rowArray.map((item, i) => dateList.slice(i * 7, i * 7 + 7));
19
15
  }
20
16
 
21
17
  findHoliday = (date) => {
@@ -23,9 +19,7 @@ export default class Month extends PureComponent {
23
19
  if (date && holidays && holidays.length > 0) {
24
20
  const day = date.date();
25
21
  const month = date.month() + 1;
26
- return holidays.find(
27
- (item) => item.day === day && item.month === month,
28
- );
22
+ return holidays.find((item) => item.day === day && item.month === month);
29
23
  }
30
24
  return null;
31
25
  };
@@ -34,7 +28,7 @@ export default class Month extends PureComponent {
34
28
  const holiday = this.findHoliday(date);
35
29
  return {
36
30
  isSolarHoliday: !!(holiday && !holiday.lunar),
37
- isLunarHoliday: !!(holiday && holiday.lunar),
31
+ isLunarHoliday: !!(holiday && holiday.lunar)
38
32
  };
39
33
  };
40
34
 
@@ -42,9 +36,10 @@ export default class Month extends PureComponent {
42
36
  <View
43
37
  style={{
44
38
  flexDirection: 'row',
45
- justifyContent: 'space-between',
39
+ justifyContent: 'space-between'
46
40
  }}
47
- key={`row${index}`}>
41
+ key={`row${index}`}
42
+ >
48
43
  {dayList.map((item, i) => {
49
44
  const keyDay = moment(item.date).format('YYYY-MM-DD');
50
45
  const priceInfo = this.props?.priceListDate?.[keyDay];
@@ -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();
package/src/TabHeader.js CHANGED
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { TouchableWithoutFeedback, View } from 'react-native';
3
3
  import Moment from 'moment';
4
4
  import Util from './Util';
5
- import { Colors, Text } from '@momo-kits/v2-core';
5
+ import { Colors, Text } from '@momo-kits/core';
6
6
 
7
7
  export default class TabHeader extends React.Component {
8
8
  constructor(props) {
@@ -55,31 +55,36 @@ export default class TabHeader extends React.Component {
55
55
  flex: 1,
56
56
  backgroundColor: Colors.white,
57
57
  }}>
58
- <Text.Description1
59
- status="hint"
58
+ <Text
60
59
  style={{
61
60
  fontSize: 12,
62
61
  lineHeight: 16,
62
+ color: Colors.black_09,
63
63
  }}>
64
64
  {label}
65
- </Text.Description1>
66
- <Text.Description1
67
- weight={active ? 'bold' : 'regular'}
65
+ </Text>
66
+ <Text
67
+ weight={active ? 'semibold' : 'regular'}
68
68
  style={{
69
69
  marginTop: 3,
70
70
  fontSize: 14,
71
+ color: Colors.black_17,
71
72
  }}>
72
- <Text.Description1 weight={active ? 'bold' : 'regular'}>
73
+ <Text
74
+ weight={active ? 'semibold' : 'regular'}
75
+ style={{
76
+ color: Colors.black_17,
77
+ }}>
73
78
  {`${
74
79
  dayOfWeekFromState ||
75
80
  dayOfWeekFromDefault ||
76
81
  '--'
77
82
  } `}
78
- </Text.Description1>
83
+ </Text>
79
84
  {formattedDateFromState ||
80
85
  formattedDateFromDefault ||
81
86
  '--/--/----'}
82
- </Text.Description1>
87
+ </Text>
83
88
  </View>
84
89
  </TouchableWithoutFeedback>
85
90
  );
package/src/calendarPicker/Day.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import React, { Component } from 'react';
2
2
  import { TouchableOpacity, View } from 'react-native';
3
3
  import PropTypes from 'prop-types';
4
- import { Text } from '@momo-kits/v2-core';
4
+ import { Text } from '@momo-kits/core';
5
5
  import styles from './styles';
6
6
 
7
7
  export default class Day extends Component {
@@ -115,13 +115,13 @@ export default class Day extends Component {
115
115
  <View style={this.styleDouble} />
116
116
  {this.disableTouch || otherMonth ? (
117
117
  <View style={styles.dayButton}>
118
- <Text.Label1
118
+ <Text.Title
119
119
  style={[
120
120
  styles.dayLabel,
121
121
  { color: this.colorTextDisable },
122
122
  ]}>
123
123
  {day}
124
- </Text.Label1>
124
+ </Text.Title>
125
125
  </View>
126
126
  ) : (
127
127
  <View
@@ -132,13 +132,13 @@ export default class Day extends Component {
132
132
  <TouchableOpacity
133
133
  style={styles.dayButton}
134
134
  onPress={() => onDayChange(day, month, year)}>
135
- <Text.Label1
135
+ <Text.Title
136
136
  style={[
137
137
  styles.dayLabel,
138
138
  { color: this.colorText },
139
139
  ]}>
140
140
  {day}
141
- </Text.Label1>
141
+ </Text.Title>
142
142
  </TouchableOpacity>
143
143
  </View>
144
144
  )}
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
  );