@momo-kits/calendar 0.0.55-beta.10 → 0.0.55-beta.11

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 (10) hide show
  1. package/package.json +3 -4
  2. package/src/Calendar.js +4 -32
  3. package/src/CalendarPro.js +35 -23
  4. package/src/Day/index.js +20 -43
  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
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@momo-kits/calendar",
3
- "version": "0.0.55-beta.10",
3
+ "version": "0.0.55-beta.11",
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
309
309
  style={styles.txtLunar}
310
310
  onPress={this.toggleLunarDate}>
311
311
  {SwitchLanguage.showLunar}
312
- </Text.Description1>
312
+ </Text>
313
313
  </View>
314
314
  )}
315
315
 
@@ -327,21 +327,32 @@ 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"
337
- style={styles.txtMonthLunar}>
340
+ <Text style={styles.txtMonthLunar}>
338
341
  {labelDate}
339
- </Text.Description2>
340
- <Text.Description2
341
- status="hint"
342
- style={styles.subTextLunar}>
342
+ </Text>
343
+ <Text style={styles.subTextLunar}>
343
344
  {`${labelHoliday} `}
344
- </Text.Description2>
345
+ {labelHighlight ? (
346
+ <Text
347
+ style={{
348
+ color: Colors.red_05,
349
+ }}>
350
+ {labelHighlight}
351
+ </Text>
352
+ ) : (
353
+ ''
354
+ )}
355
+ </Text>
345
356
  </View>
346
357
  );
347
358
  })}
@@ -377,7 +388,7 @@ CalendarPro.defaultProps = {
377
388
 
378
389
  const styles = StyleSheet.create({
379
390
  row: { flexDirection: 'row' },
380
- txtMonthLunar: { color: Colors.red_05, marginRight: Spacing.S },
391
+ txtMonthLunar: { color: Colors.red_05, width: 80 },
381
392
  subTextLunar: {
382
393
  // fontSize: 12,
383
394
  color: '#222222',
@@ -390,13 +401,14 @@ const styles = StyleSheet.create({
390
401
  paddingLeft: 6,
391
402
  color: '#222222',
392
403
  // fontSize: 12,
404
+ lineHeight: 14,
393
405
  },
394
406
  viewLunar: {
395
407
  flexDirection: 'row',
396
408
  alignItems: 'center',
397
- marginHorizontal: Spacing.M,
398
- borderTopWidth: 1,
399
- paddingTop: Spacing.M,
409
+ marginHorizontal: 12,
410
+ paddingVertical: 12,
411
+ borderBottomWidth: 1,
400
412
  borderStyle: 'solid',
401
413
  borderColor: '#c7c7cd',
402
414
  },
package/src/Day/index.js CHANGED
@@ -1,9 +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 } 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
7
 
9
8
  class Day extends Component {
@@ -145,18 +144,13 @@ class Day extends Component {
145
144
  <TouchableHighlight
146
145
  style={[
147
146
  style.day,
148
- {
149
- paddingVertical: !!price
150
- ? Spacing.XS
151
- : Spacing.S,
152
- },
153
147
  (this.isStart || this.isEnd) && style.focused,
154
148
  ]}
155
149
  underlayColor="rgba(255, 255, 255, 0.35)"
156
150
  onPress={this.chooseDay}>
157
151
  <>
158
152
  {this.lunarDate && this.showLunar && (
159
- <Text.Label4
153
+ <Text
160
154
  style={[
161
155
  style.lunarDayText,
162
156
  (this.isLunarHoliday ||
@@ -168,9 +162,9 @@ class Day extends Component {
168
162
  {this.lunarDate.lunarDay === 1
169
163
  ? `${this.lunarDate.lunarDay}/${this.lunarDate.lunarMonth}`
170
164
  : this.lunarDate.lunarDay}
171
- </Text.Label4>
165
+ </Text>
172
166
  )}
173
- <Text.Label1
167
+ <Text
174
168
  style={[
175
169
  style.dayText,
176
170
  this.isWeekEnd && style.weekendDay,
@@ -179,29 +173,13 @@ class Day extends Component {
179
173
  style.focusedText,
180
174
  ]}>
181
175
  {text}
182
- </Text.Label1>
183
- {this.isValid && this.isInScope && !!price ? (
184
- <Text.Description3
185
- style={[
186
- style.price,
187
- isBestPrice && {
188
- color: Colors.pink_03,
189
- },
190
- (this.isStart || this.isEnd) && {
191
- color: Colors.black_01,
192
- },
193
- ]}>
194
- {price}
195
- </Text.Description3>
196
- ) : (
197
- <View style={{ height: Spacing.S }} />
198
- )}
176
+ </Text>
199
177
  </>
200
178
  </TouchableHighlight>
201
179
  ) : (
202
180
  <View style={[style.day]}>
203
181
  {this.lunarDate && this.showLunar && text ? (
204
- <Text.Label4
182
+ <Text
205
183
  style={[
206
184
  style.lunarDayText,
207
185
  style.dayTextDisabled,
@@ -209,28 +187,27 @@ class Day extends Component {
209
187
  {this.lunarDate.lunarDay === 1
210
188
  ? `${this.lunarDate.lunarDay}/${this.lunarDate.lunarMonth}`
211
189
  : this.lunarDate.lunarDay}
212
- </Text.Label4>
190
+ </Text>
213
191
  ) : (
214
192
  <View />
215
193
  )}
216
- <Text.Label1
194
+ <Text
217
195
  style={[style.dayText, style.dayTextDisabled]}>
218
196
  {text}
219
- </Text.Label1>
220
- {this.isValid && this.isInScope && (
221
- <Text.Description3
222
- style={[
223
- style.price,
224
- isBestPrice && {
225
- color: Colors.pink_03,
226
- },
227
- ]}>
228
- {'1000'}
229
- </Text.Description3>
230
- )}
197
+ </Text>
231
198
  </View>
232
199
  )}
233
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
+ )}
234
211
  </View>
235
212
  );
236
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.Title1
119
119
  style={[
120
120
  styles.dayLabel,
121
121
  { color: this.colorTextDisable },
122
122
  ]}>
123
123
  {day}
124
- </Text.Label1>
124
+ </Text.Title1>
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.Title1
136
136
  style={[
137
137
  styles.dayLabel,
138
138
  { color: this.colorText },
139
139
  ]}>
140
140
  {day}
141
- </Text.Label1>
141
+ </Text.Title1>
142
142
  </TouchableOpacity>
143
143
  </View>
144
144
  )}