@momo-kits/date-picker 0.0.40-beta.4 → 0.0.41-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 (3) hide show
  1. package/datePicker/DatePicker.js +317 -113
  2. package/package.json +5 -5
  3. package/publish.sh +1 -1
package/datePicker/DatePicker.js CHANGED
@@ -1,12 +1,16 @@
1
1
  /* eslint-disable max-len */
2
2
  /* eslint-disable react/no-unused-prop-types */
3
3
  import React, { Component } from 'react';
4
- import {
5
- View, StyleSheet, Dimensions
6
- } from 'react-native';
4
+ import { View, StyleSheet, Dimensions } from 'react-native';
7
5
  import PropTypes from 'prop-types';
8
6
  import {
9
- BottomPopupHeader, Button, Text, ScreenUtils, SwitchLanguage, Spacing, Colors
7
+ BottomPopupHeader,
8
+ Button,
9
+ Text,
10
+ ScreenUtils,
11
+ SwitchLanguage,
12
+ Spacing,
13
+ Colors,
10
14
  } from '@momo-kits/core';
11
15
  import WheelPicker from './WheelPicker';
12
16
  import DatePickerHelper from './helper/DatePickerHelper';
@@ -27,7 +31,7 @@ const styles = StyleSheet.create({
27
31
  alignItems: 'center',
28
32
  justifyContent: 'center',
29
33
  paddingHorizontal: 21,
30
- paddingTop: 12
34
+ paddingTop: 12,
31
35
  },
32
36
  column: {
33
37
  borderWidth: 2,
@@ -40,28 +44,29 @@ const styles = StyleSheet.create({
40
44
  height: 64,
41
45
  borderBottomColor: Colors.black_04,
42
46
  borderBottomWidth: 1,
43
- alignItems:'center',
44
- justifyContent:'center',
47
+ alignItems: 'center',
48
+ justifyContent: 'center',
45
49
  marginBottom: 0, // Spacing.S,
46
50
  },
47
51
  view: {
48
52
  backgroundColor: 'white',
49
53
  borderTopRightRadius: 16,
50
54
  borderTopLeftRadius: 16,
51
- overflow: 'hidden'
55
+ overflow: 'hidden',
52
56
  },
53
57
  titleCancel: {
54
58
  fontSize: 17,
55
- color: '#4A90E2'
59
+ color: '#4A90E2',
56
60
  },
57
61
  titleConfirm: {
58
62
  fontSize: 17,
59
63
  color: '#4A90E2',
60
- textAlign: 'right'
61
- }
64
+ textAlign: 'right',
65
+ },
62
66
  });
63
67
 
64
- const getStrings = (strings) => (strings?.length === 1 ? `0${strings}` : strings);
68
+ const getStrings = (strings) =>
69
+ strings?.length === 1 ? `0${strings}` : strings;
65
70
  class DatePicker extends Component {
66
71
  constructor(props) {
67
72
  super(props);
@@ -95,35 +100,60 @@ class DatePicker extends Component {
95
100
  if (props) {
96
101
  const propsMinDate = props.minDate ? props.minDate : props.minValue;
97
102
  const propsMaxDate = props.maxDate ? props.maxDate : props.maxValue;
98
- const propsSelectedDate = props.selectedDate ? props.selectedDate : props.value;
103
+ const propsSelectedDate = props.selectedDate
104
+ ? props.selectedDate
105
+ : props.value;
99
106
 
100
107
  if (propsMinDate) {
101
- this.minDate = DatePickerHelper.formatDate(propsMinDate, props.format);
108
+ this.minDate = DatePickerHelper.formatDate(
109
+ propsMinDate,
110
+ props.format,
111
+ );
102
112
  } else if (props.maxAge) {
103
- this.minDate = DatePickerHelper.calculateDateSinceYearAgo(props.maxAge);
113
+ this.minDate = DatePickerHelper.calculateDateSinceYearAgo(
114
+ props.maxAge,
115
+ );
104
116
  } else {
105
117
  this.minDate = null;
106
118
  }
107
119
 
108
120
  if (propsMaxDate) {
109
- this.maxDate = DatePickerHelper.formatDate(propsMaxDate, props.format);
121
+ this.maxDate = DatePickerHelper.formatDate(
122
+ propsMaxDate,
123
+ props.format,
124
+ );
110
125
  } else if (props.minAge) {
111
- this.maxDate = DatePickerHelper.calculateDateSinceYearAgo(props.minAge);
126
+ this.maxDate = DatePickerHelper.calculateDateSinceYearAgo(
127
+ props.minAge,
128
+ );
112
129
  } else {
113
130
  this.maxDate = null;
114
131
  }
115
132
 
116
- if (this.maxDate && this.minDate && this.maxDate.getTime() < this.minDate.getTime()) {
133
+ if (
134
+ this.maxDate &&
135
+ this.minDate &&
136
+ this.maxDate.getTime() < this.minDate.getTime()
137
+ ) {
117
138
  this.maxDate = null;
118
139
  this.minDate = null;
119
140
  }
120
141
 
121
142
  if (propsSelectedDate) {
122
- this.selectedDate = DatePickerHelper.formatDate(propsSelectedDate, props.format);
143
+ this.selectedDate = DatePickerHelper.formatDate(
144
+ propsSelectedDate,
145
+ props.format,
146
+ );
123
147
  if (this.selectedDate) {
124
- if (this.minDate && this.selectedDate.getTime() < this.minDate.getTime()) {
148
+ if (
149
+ this.minDate &&
150
+ this.selectedDate.getTime() < this.minDate.getTime()
151
+ ) {
125
152
  this.selectedDate = null;
126
- } else if (this.maxDate && this.maxDate.getTime() < this.selectedDate.getTime()) {
153
+ } else if (
154
+ this.maxDate &&
155
+ this.maxDate.getTime() < this.selectedDate.getTime()
156
+ ) {
127
157
  this.selectedDate = null;
128
158
  }
129
159
  }
@@ -131,17 +161,42 @@ class DatePicker extends Component {
131
161
  this.selectedDate = null;
132
162
  }
133
163
  if (props.format === 'hh:mm') {
134
- this.selectedDate = props.isRanged ? {
135
- from: DatePickerHelper.formatDate(propsSelectedDate.from, props.format),
136
- to: DatePickerHelper.formatDate(propsSelectedDate.to, props.format)
137
- } : DatePickerHelper.formatDate(propsSelectedDate, props.format);
164
+ this.selectedDate = props.isRanged
165
+ ? {
166
+ from: DatePickerHelper.formatDate(
167
+ propsSelectedDate.from,
168
+ props.format,
169
+ ),
170
+ to: DatePickerHelper.formatDate(
171
+ propsSelectedDate.to,
172
+ props.format,
173
+ ),
174
+ }
175
+ : DatePickerHelper.formatDate(
176
+ propsSelectedDate,
177
+ props.format,
178
+ );
138
179
  }
139
180
  }
140
- this.createDataDate(this.minDate, this.maxDate, props.minuteArray, props.rangeHour);
181
+ this.createDataDate(
182
+ this.minDate,
183
+ this.maxDate,
184
+ props.minuteArray,
185
+ props.startTime,
186
+ props.endTime,
187
+ props.rangeHour,
188
+ );
141
189
  this.selectedIndexDate();
142
190
  }
143
191
 
144
- createDataDate(minDate, maxDate, minuteArray, rangeHour) {
192
+ createDataDate(
193
+ minDate,
194
+ maxDate,
195
+ minuteArray,
196
+ startTime,
197
+ endTime,
198
+ rangeHour,
199
+ ) {
145
200
  this.minDay = 1;
146
201
  this.minMonth = 1;
147
202
  this.minYear = 1970;
@@ -169,6 +224,8 @@ class DatePicker extends Component {
169
224
  this.minutes = DatePickerHelper.makeRange(0, 59, true);
170
225
  }
171
226
  this.ranged = rangeHour || DatePickerHelper.arrayRange;
227
+ this.startTime = startTime || DatePickerHelper.arrayRange;
228
+ this.endTime = endTime || DatePickerHelper.arrayRange;
172
229
  }
173
230
 
174
231
  selectedIndexDate() {
@@ -180,15 +237,35 @@ class DatePicker extends Component {
180
237
  current = this.maxDate;
181
238
  }
182
239
  if (format === 'hh:mm' && isRanged) {
183
- const valueHours_1 = this.selectedDate?.from ? `${getStrings(this.selectedDate?.from?.getHours()?.toString())}:${getStrings(this.selectedDate?.from?.getMinutes()?.toString())}` : '00:00';
184
- const valueHours_2 = this.selectedDate?.to ? `${getStrings(this.selectedDate?.to?.getHours()?.toString())}:${getStrings(this.selectedDate?.to?.getMinutes()?.toString())}` : '00:00';
240
+ const valueHours_1 = this.selectedDate?.from
241
+ ? `${getStrings(
242
+ this.selectedDate?.from?.getHours()?.toString(),
243
+ )}:${getStrings(
244
+ this.selectedDate?.from?.getMinutes()?.toString(),
245
+ )}`
246
+ : '00:00';
247
+ const valueHours_2 = this.selectedDate?.to
248
+ ? `${getStrings(
249
+ this.selectedDate?.to?.getHours()?.toString(),
250
+ )}:${getStrings(
251
+ this.selectedDate?.to?.getMinutes()?.toString(),
252
+ )}`
253
+ : '00:00';
185
254
  this.hourRangeIndex_1 = valueHours_1
186
255
  ? this.ranged.indexOf(valueHours_1)
187
- : this.ranged.indexOf(`${current.getHours().toString()}:${current.getMinutes().toString()}`);
256
+ : this.ranged.indexOf(
257
+ `${current.getHours().toString()}:${current
258
+ .getMinutes()
259
+ .toString()}`,
260
+ );
188
261
 
189
262
  this.hourRangeIndex_2 = valueHours_2
190
263
  ? this.ranged.indexOf(valueHours_2)
191
- : this.ranged.indexOf(`${current.getHours().toString()}:${current.getMinutes().toString()}`);
264
+ : this.ranged.indexOf(
265
+ `${current.getHours().toString()}:${current
266
+ .getMinutes()
267
+ .toString()}`,
268
+ );
192
269
  return;
193
270
  }
194
271
  this.dayIndex = this.selectedDate
@@ -204,40 +281,66 @@ class DatePicker extends Component {
204
281
  : this.years.indexOf(current.getFullYear().toString());
205
282
 
206
283
  if (format === 'hh:mm' && !isRanged) {
207
- const valueHours = this.selectedDate ? this.selectedDate?.getHours()?.toString()?.length === 1 ? `0${this.selectedDate.getHours().toString()}` : this.selectedDate?.getHours()?.toString() || '' : '';
208
- const valueMinute = this.selectedDate ? this.selectedDate?.getMinutes()?.toString()?.length === 1 ? `0${this.selectedDate.getMinutes().toString()}` : this.selectedDate?.getMinutes()?.toString() || '' : '';
209
-
284
+ const valueHours = this.selectedDate
285
+ ? this.selectedDate?.getHours()?.toString()?.length === 1
286
+ ? `0${this.selectedDate.getHours().toString()}`
287
+ : this.selectedDate?.getHours()?.toString() || ''
288
+ : '';
289
+ const valueMinute = this.selectedDate
290
+ ? this.selectedDate?.getMinutes()?.toString()?.length === 1
291
+ ? `0${this.selectedDate.getMinutes().toString()}`
292
+ : this.selectedDate?.getMinutes()?.toString() || ''
293
+ : '';
294
+
210
295
  this.hourIndex = this.selectedDate
211
296
  ? this.hours.indexOf(valueHours)
212
- : this.hours.indexOf(current.getHours().toString().length === 1 ? `0${current.getHours().toString()}` : current.getHours().toString());
297
+ : this.hours.indexOf(
298
+ current.getHours().toString().length === 1
299
+ ? `0${current.getHours().toString()}`
300
+ : current.getHours().toString(),
301
+ );
213
302
 
214
303
  this.minuteIndex = this.selectedDate
215
304
  ? this.minutes.indexOf(valueMinute)
216
- : this.minutes.indexOf(current.getMinutes().toString().length === 1 ? `0${current.getMinutes().toString()}` : current.getMinutes().toString());
305
+ : this.minutes.indexOf(
306
+ current.getMinutes().toString().length === 1
307
+ ? `0${current.getMinutes().toString()}`
308
+ : current.getMinutes().toString(),
309
+ );
217
310
  }
218
311
  }
219
312
 
220
313
  onBeginDrag = (refName) => {
221
314
  // eslint-disable-next-line no-restricted-syntax
222
315
  for (const i in this.arrayRef) {
223
- if (i && i !== refName && this.arrayRef && this.arrayRef[i] && this.arrayRef[i].update) {
316
+ if (
317
+ i &&
318
+ i !== refName &&
319
+ this.arrayRef &&
320
+ this.arrayRef[i] &&
321
+ this.arrayRef[i].update
322
+ ) {
224
323
  this.arrayRef[i].setScrollEnabled(false);
225
324
  }
226
325
  }
227
- }
326
+ };
228
327
 
229
328
  onEndDrag = (refName) => {
230
329
  // eslint-disable-next-line no-restricted-syntax
231
330
  for (const i in this.arrayRef) {
232
- if (i && i !== refName && this.arrayRef && this.arrayRef[i] && this.arrayRef[i].update) {
331
+ if (
332
+ i &&
333
+ i !== refName &&
334
+ this.arrayRef &&
335
+ this.arrayRef[i] &&
336
+ this.arrayRef[i].update
337
+ ) {
233
338
  this.arrayRef[i].setScrollEnabled(true);
234
339
  }
235
340
  }
236
- }
237
-
238
- show = () => {
341
+ };
239
342
 
240
- }
343
+ show = () => {};
241
344
 
242
345
  hide = () => {
243
346
  const { onClose, requestClose } = this.props;
@@ -248,12 +351,10 @@ class DatePicker extends Component {
248
351
  }
249
352
  });
250
353
  }
251
- }
354
+ };
252
355
 
253
356
  finish = () => {
254
- const {
255
- format, onSelected, isRanged, selectedDate
256
- } = this.props;
357
+ const { format, onSelected, isRanged, selectedDate } = this.props;
257
358
  if (isRanged && format === 'hh:mm') {
258
359
  const from = this.ranged[this.hourRangeIndex_1];
259
360
  const to = this.ranged[this.hourRangeIndex_2];
@@ -268,19 +369,30 @@ class DatePicker extends Component {
268
369
  const year = this.years[this.yearIndex];
269
370
  const hour = this.hours[this.hourIndex] || '00';
270
371
  const minute = this.minutes[this.minuteIndex] || '00';
271
- const selectedDateFormatted = DatePickerHelper.toString(day, month, year, hour, minute, format);
372
+ const selectedDateFormatted = DatePickerHelper.toString(
373
+ day,
374
+ month,
375
+ year,
376
+ hour,
377
+ minute,
378
+ format,
379
+ );
272
380
  if (onSelected && typeof onSelected === 'function') {
273
- onSelected(selectedDateFormatted || selectedDate || DatePickerHelper.getCurrentDate(format));
381
+ onSelected(
382
+ selectedDateFormatted ||
383
+ selectedDate ||
384
+ DatePickerHelper.getCurrentDate(format),
385
+ );
274
386
  }
275
387
  this.hide();
276
- }
388
+ };
277
389
 
278
390
  renderUpdate(param) {
279
391
  if (param && param.day != null) {
280
392
  this.dayIndex = param.day;
281
393
  this.updateWheelPiker('DayView', {
282
394
  arrayValue: this.days,
283
- value: param.day
395
+ value: param.day,
284
396
  });
285
397
  }
286
398
 
@@ -288,7 +400,7 @@ class DatePicker extends Component {
288
400
  this.monthIndex = param.month;
289
401
  this.updateWheelPiker('MonthView', {
290
402
  arrayValue: this.months,
291
- value: param.month
403
+ value: param.month,
292
404
  });
293
405
  }
294
406
 
@@ -296,7 +408,7 @@ class DatePicker extends Component {
296
408
  this.yearIndex = param.year;
297
409
  this.updateWheelPiker('YearView', {
298
410
  arrayValue: this.years,
299
- value: param.year
411
+ value: param.year,
300
412
  });
301
413
  }
302
414
 
@@ -304,7 +416,7 @@ class DatePicker extends Component {
304
416
  this.hourIndex = param.hour;
305
417
  this.updateWheelPiker('HourView', {
306
418
  arrayValue: this.hours,
307
- value: param.hour
419
+ value: param.hour,
308
420
  });
309
421
  }
310
422
 
@@ -312,7 +424,7 @@ class DatePicker extends Component {
312
424
  this.minuteIndex = param.minute;
313
425
  this.updateWheelPiker('MinuteView', {
314
426
  arrayValue: this.minutes,
315
- value: param.minute
427
+ value: param.minute,
316
428
  });
317
429
  }
318
430
 
@@ -320,7 +432,7 @@ class DatePicker extends Component {
320
432
  this.hourRangeIndex_1 = param.hourRange_1;
321
433
  this.updateWheelPiker('HourRange1', {
322
434
  arrayValue: this.ranged,
323
- value: param.hourRange_1
435
+ value: param.hourRange_1,
324
436
  });
325
437
  }
326
438
 
@@ -328,7 +440,7 @@ class DatePicker extends Component {
328
440
  this.hourRangeIndex_2 = param.hourRange_2;
329
441
  this.updateWheelPiker('HourRange2', {
330
442
  arrayValue: this.ranged,
331
- value: param.hourRange_2
443
+ value: param.hourRange_2,
332
444
  });
333
445
  }
334
446
  }
@@ -358,13 +470,18 @@ class DatePicker extends Component {
358
470
 
359
471
  if (isUpDate) {
360
472
  this.days = DatePickerHelper.makeRange(minDay, maxDay);
361
- index = day > maxDay ? this.days?.length - 1 : (day < minDay ? 0 : this.days.indexOf(day.toString()));
473
+ index =
474
+ day > maxDay
475
+ ? this.days?.length - 1
476
+ : day < minDay
477
+ ? 0
478
+ : this.days.indexOf(day.toString());
362
479
  }
363
480
 
364
481
  this.renderUpdate({
365
482
  day: index,
366
483
  month: monthIndex,
367
- year: yearIndex
484
+ year: yearIndex,
368
485
  });
369
486
  }
370
487
 
@@ -382,15 +499,21 @@ class DatePicker extends Component {
382
499
  if (this.minMonth && year === this.minYear) {
383
500
  minMonth = this.minMonth;
384
501
  }
385
- if (maxMonth !== this.months?.length || minMonth !== parseInt(this.months[0])) {
502
+ if (
503
+ maxMonth !== this.months?.length ||
504
+ minMonth !== parseInt(this.months[0])
505
+ ) {
386
506
  isUpDate = true;
387
507
  }
388
508
  let index = monthIndex;
389
509
  if (isUpDate) {
390
510
  this.months = DatePickerHelper.makeRange(minMonth, maxMonth);
391
- index = month > maxMonth
392
- ? this.months?.length - 1
393
- : (month < minMonth ? 0 : this.months?.indexOf(month.toString()));
511
+ index =
512
+ month > maxMonth
513
+ ? this.months?.length - 1
514
+ : month < minMonth
515
+ ? 0
516
+ : this.months?.indexOf(month.toString());
394
517
  }
395
518
  this.setStateDate(dayIndex, index, yearIndex);
396
519
  }
@@ -405,7 +528,15 @@ class DatePicker extends Component {
405
528
  }
406
529
  }
407
530
 
408
- renderColumn(refName, valueInput, arrayValue, label, bottomOffset, callback, reversePreFix) {
531
+ renderColumn(
532
+ refName,
533
+ valueInput,
534
+ arrayValue,
535
+ label,
536
+ bottomOffset,
537
+ callback,
538
+ reversePreFix,
539
+ ) {
409
540
  if (!this.arrayRef) {
410
541
  this.arrayRef = {};
411
542
  }
@@ -434,7 +565,14 @@ class DatePicker extends Component {
434
565
 
435
566
  renderHeader() {
436
567
  const {
437
- title, placeholder, body, buttonTitle, onButtonPress, headerStyle, iconClosePosition = 'right', iconType
568
+ title,
569
+ placeholder,
570
+ body,
571
+ buttonTitle,
572
+ onButtonPress,
573
+ headerStyle,
574
+ iconClosePosition = 'right',
575
+ iconType,
438
576
  } = this.props;
439
577
  return (
440
578
  <BottomPopupHeader
@@ -474,25 +612,50 @@ class DatePicker extends Component {
474
612
  const { description, descriptionStyle, renderDescription } = this.props;
475
613
  if (renderDescription) return renderDescription;
476
614
  return description ? (
477
- <Text.Title style={[{ marginBottom: Spacing.S }, descriptionStyle]}>{description}</Text.Title>
615
+ <Text.Title style={[{ marginBottom: Spacing.S }, descriptionStyle]}>
616
+ {description}
617
+ </Text.Title>
478
618
  ) : null;
479
619
  };
480
620
 
481
621
  renderContent() {
482
622
  const {
483
- format, labelDay, labelMonth, labelYear, bottomOffset, labelMinute, labelHour, isRanged
623
+ format,
624
+ labelDay,
625
+ labelMonth,
626
+ labelYear,
627
+ bottomOffset,
628
+ labelMinute,
629
+ labelHour,
630
+ isRanged,
484
631
  } = this.props;
485
632
  if (isRanged && format === 'hh:mm') {
486
633
  return (
487
634
  <View style={styles.container}>
488
635
  {this.renderDescription()}
489
636
  <View style={styles.content}>
490
- {this.renderColumn('HourRange1', this.hourRangeIndex_1, this.ranged, SwitchLanguage.from, bottomOffset, (value) => {
491
- this.renderUpdate({ hourRange_1: value });
492
- }, true)}
493
- {this.renderColumn('HourRange2', this.hourRangeIndex_2, this.ranged, SwitchLanguage.to, bottomOffset, (value) => {
494
- this.renderUpdate({ hourRange_2: value });
495
- }, true)}
637
+ {this.renderColumn(
638
+ 'HourRange1',
639
+ this.hourRangeIndex_1,
640
+ this.startTime,
641
+ SwitchLanguage.from,
642
+ bottomOffset,
643
+ (value) => {
644
+ this.renderUpdate({ hourRange_1: value });
645
+ },
646
+ true,
647
+ )}
648
+ {this.renderColumn(
649
+ 'HourRange2',
650
+ this.hourRangeIndex_2,
651
+ this.endTime,
652
+ SwitchLanguage.to,
653
+ bottomOffset,
654
+ (value) => {
655
+ this.renderUpdate({ hourRange_2: value });
656
+ },
657
+ true,
658
+ )}
496
659
  </View>
497
660
  </View>
498
661
  );
@@ -501,58 +664,98 @@ class DatePicker extends Component {
501
664
  <View style={styles.container}>
502
665
  {this.renderDescription()}
503
666
  <View style={styles.content}>
504
- {
505
- format.indexOf('dd') !== -1
506
- ? this.renderColumn('DayView', this.dayIndex, this.days, labelDay || SwitchLanguage.day, bottomOffset, (value) => {
507
- this.renderUpdate({ day: value });
508
- })
509
- : null
510
- }
511
- {
512
- format.indexOf('MM') !== -1
513
- ? this.renderColumn('MonthView', this.monthIndex, this.months, labelMonth || SwitchLanguage.month, bottomOffset, (value) => {
514
- this.setStateDate(this.dayIndex, value, this.yearIndex);
515
- })
516
- : null
517
- }
518
- {
519
- format.indexOf('YYYY') !== -1
520
- ? this.renderColumn('YearView', this.yearIndex, this.years, labelYear || SwitchLanguage.year, bottomOffset, (value) => {
521
- this.setStateMonth(this.dayIndex, this.monthIndex, value);
522
- })
523
- : null
524
- }
525
- {
526
- format.indexOf('hh') !== -1
527
- ? this.renderColumn('HourView', this.hourIndex, this.hours, labelHour || SwitchLanguage.hour, bottomOffset, (value) => {
528
- this.renderUpdate({ hour: value });
529
- }, true)
530
- : null
531
- }
532
- {
533
- format.indexOf('mm') !== -1
534
- ? this.renderColumn('MinuteView', this.minuteIndex, this.minutes, labelMinute || SwitchLanguage.minute, bottomOffset, (value) => {
535
- this.renderUpdate({ minute: value });
536
- }, true)
537
- : null
538
- }
667
+ {format.indexOf('dd') !== -1
668
+ ? this.renderColumn(
669
+ 'DayView',
670
+ this.dayIndex,
671
+ this.days,
672
+ labelDay || SwitchLanguage.day,
673
+ bottomOffset,
674
+ (value) => {
675
+ this.renderUpdate({ day: value });
676
+ },
677
+ )
678
+ : null}
679
+ {format.indexOf('MM') !== -1
680
+ ? this.renderColumn(
681
+ 'MonthView',
682
+ this.monthIndex,
683
+ this.months,
684
+ labelMonth || SwitchLanguage.month,
685
+ bottomOffset,
686
+ (value) => {
687
+ this.setStateDate(
688
+ this.dayIndex,
689
+ value,
690
+ this.yearIndex,
691
+ );
692
+ },
693
+ )
694
+ : null}
695
+ {format.indexOf('YYYY') !== -1
696
+ ? this.renderColumn(
697
+ 'YearView',
698
+ this.yearIndex,
699
+ this.years,
700
+ labelYear || SwitchLanguage.year,
701
+ bottomOffset,
702
+ (value) => {
703
+ this.setStateMonth(
704
+ this.dayIndex,
705
+ this.monthIndex,
706
+ value,
707
+ );
708
+ },
709
+ )
710
+ : null}
711
+ {format.indexOf('hh') !== -1
712
+ ? this.renderColumn(
713
+ 'HourView',
714
+ this.hourIndex,
715
+ this.hours,
716
+ labelHour || SwitchLanguage.hour,
717
+ bottomOffset,
718
+ (value) => {
719
+ this.renderUpdate({ hour: value });
720
+ },
721
+ true,
722
+ )
723
+ : null}
724
+ {format.indexOf('mm') !== -1
725
+ ? this.renderColumn(
726
+ 'MinuteView',
727
+ this.minuteIndex,
728
+ this.minutes,
729
+ labelMinute || SwitchLanguage.minute,
730
+ bottomOffset,
731
+ (value) => {
732
+ this.renderUpdate({ minute: value });
733
+ },
734
+ true,
735
+ )
736
+ : null}
539
737
  </View>
540
-
541
738
  </View>
542
739
  );
543
740
  }
544
741
 
545
742
  renderFooter() {
546
743
  const { titleFooter, renderFooter } = this.props;
547
- return renderFooter ? renderFooter() : (
548
- <View style={{ paddingHorizontal: 12, marginBottom: ifIphoneX(35, 12), marginTop: 16 }}>
744
+ return renderFooter ? (
745
+ renderFooter()
746
+ ) : (
747
+ <View
748
+ style={{
749
+ paddingHorizontal: 12,
750
+ marginBottom: ifIphoneX(35, 12),
751
+ marginTop: 16,
752
+ }}>
549
753
  <Button
550
754
  onPress={this.finish}
551
755
  title={titleFooter || SwitchLanguage.confirm}
552
756
  type="primary"
553
757
  />
554
758
  </View>
555
-
556
759
  );
557
760
  }
558
761
 
@@ -592,6 +795,8 @@ DatePicker.propTypes = {
592
795
  rangeHour: PropTypes.array,
593
796
  iconClosePosition: PropTypes.oneOf(['left', 'right']),
594
797
  iconType: PropTypes.oneOf(['icon', 'text']),
798
+ startTime: PropTypes.array,
799
+ endTime: PropTypes.array,
595
800
  };
596
801
 
597
802
  DatePicker.defaultProps = {
@@ -609,4 +814,3 @@ DatePicker.defaultProps = {
609
814
  };
610
815
 
611
816
  export default DatePicker;
612
-
package/package.json CHANGED
@@ -1,16 +1,16 @@
1
1
  {
2
2
  "name": "@momo-kits/date-picker",
3
- "version": "0.0.40-beta.4",
3
+ "version": "0.0.41-beta.11",
4
4
  "private": false,
5
5
  "main": "index.js",
6
6
  "dependencies": {},
7
7
  "peerDependencies": {
8
- "react-native": ">=0.55",
8
+ "@momo-kits/core": ">=0.0.5-beta",
9
+ "lodash": "^4.17.15",
9
10
  "prop-types": "^15.7.2",
10
11
  "react": "16.9.0",
11
- "@momo-kits/core": ">=0.0.5-beta",
12
- "lodash": "^4.17.15"
12
+ "react-native": ">=0.55"
13
13
  },
14
14
  "devDependencies": {},
15
15
  "license": "MoMo"
16
- }
16
+ }
package/publish.sh CHANGED
@@ -21,7 +21,7 @@ rsync -r --verbose --exclude '*.mdx' --exclude '*Demo.js' --exclude 'props-type
21
21
  #npm login
22
22
  #publish dist to npm
23
23
  cd dist
24
- npm publish --tag beta --access=public
24
+ npm publish --access=public --tag beta
25
25
  cd ..
26
26
  rm -rf dist
27
27