@momo-kits/date-picker 0.0.62-alpha.2 → 0.0.62-alpha.20

package/datePicker/DatePicker.js

@@ -11,7 +11,7 @@ import {
     SwitchLanguage,
     Spacing,
     Colors,
-} from '@momo-kits/core';
+} from '@momo-kits/core-v2';
 import WheelPicker from './WheelPicker';
 import DatePickerHelper from './helper/DatePickerHelper';
 
@@ -67,6 +67,7 @@ const styles = StyleSheet.create({
 
 const getStrings = (strings) =>
     strings?.length === 1 ? `0${strings}` : strings;
+
 class DatePicker extends Component {
     constructor(props) {
         super(props);
@@ -224,8 +225,6 @@ class DatePicker extends Component {
             this.minutes = DatePickerHelper.makeRange(0, 59, true);
         }
         this.ranged = rangeHour || DatePickerHelper.arrayRange;
-        this.startTime = startTime || DatePickerHelper.arrayRange;
-        this.endTime = endTime || DatePickerHelper.arrayRange;
     }
 
     selectedIndexDate() {
@@ -358,8 +357,12 @@ class DatePicker extends Component {
         if (isRanged && format === 'hh:mm') {
             const from = this.ranged[this.hourRangeIndex_1];
             const to = this.ranged[this.hourRangeIndex_2];
+
             if (onSelected && typeof onSelected === 'function') {
-                onSelected({ from, to });
+                onSelected({
+                    from,
+                    to,
+                });
             }
             this.hide();
             return;
@@ -594,9 +597,10 @@ class DatePicker extends Component {
         const { description, descriptionStyle, renderDescription } = this.props;
         if (renderDescription) return renderDescription;
         return description ? (
-            <Text.Title style={[{ marginBottom: Spacing.S }, descriptionStyle]}>
+            <Text.Paragraph
+                style={[{ marginBottom: Spacing.S }, descriptionStyle]}>
                 {description}
-            </Text.Title>
+            </Text.Paragraph>
         ) : null;
     };
 
@@ -611,6 +615,7 @@ class DatePicker extends Component {
             labelHour,
             isRanged,
         } = this.props;
+
         if (isRanged && format === 'hh:mm') {
             return (
                 <View style={styles.container}>
@@ -619,7 +624,7 @@ class DatePicker extends Component {
                         {this.renderColumn(
                             'HourRange1',
                             this.hourRangeIndex_1,
-                            this.startTime,
+                            this.ranged,
                             SwitchLanguage.from,
                             bottomOffset,
                             (value) => {
@@ -630,7 +635,7 @@ class DatePicker extends Component {
                         {this.renderColumn(
                             'HourRange2',
                             this.hourRangeIndex_2,
-                            this.endTime,
+                            this.ranged,
                             SwitchLanguage.to,
                             bottomOffset,
                             (value) => {

package/datePicker/DatePickerInput.js

@@ -9,7 +9,8 @@ import {
     Colors,
     ValueUtil,
     Image,
-} from '@momo-kits/core';
+    Radius,
+} from '@momo-kits/core-v2';
 import DatePicker from './DatePicker';
 
 const DatePickerInput = ({
@@ -64,14 +65,14 @@ const DatePickerInput = ({
                 ValueUtil.extractStyle(style),
                 otherStyle,
             ]}>
-            <Text.Title
+            <Text.Paragraph
                 style={[
                     styles.defaultText,
                     ValueUtil.extractStyle(textStyle),
                     isEmpty(selected) ? { color: Colors.black_09 } : {},
                 ]}>
                 {isEmpty(selected) ? format : selected}
-            </Text.Title>
+            </Text.Paragraph>
             {showRightIcon ? (
                 <Image
                     source={icon || IconSource.ic_calendar}
@@ -118,7 +119,7 @@ const styles = StyleSheet.create({
     container: {
         flexDirection: 'row',
         height: 42,
-        borderRadius: 4,
+        borderRadius: Radius.S,
         borderColor: Colors.black_06,
         borderWidth: 1,
         alignItems: 'center',
@@ -127,7 +128,7 @@ const styles = StyleSheet.create({
         backgroundColor: Colors.black_01,
     },
     error: {
-        borderColor: Colors.red_05,
+        borderColor: Colors.red_03,
     },
     defaultText: {
         // fontSize: 14

package/datePicker/ListPicker.js

@@ -9,7 +9,7 @@ import {
     Image,
     DeviceUtils,
     SwitchLanguage,
-} from '@momo-kits/core';
+} from '@momo-kits/core-v2';
 import WheelPicker from './WheelPicker';
 
 const { isIphoneX } = DeviceUtils;
@@ -63,9 +63,10 @@ export default class ListPicker extends Component {
 
     renderRight = () => (
         <TouchableOpacity onPress={this.onPressChoose}>
-            <Text.Title style={{ fontWeight: 'bold', color: Colors.pink_05 }}>
+            <Text.Paragraph
+                style={{ fontWeight: 'bold', color: Colors.pink_05 }}>
                 {SwitchLanguage.save}
-            </Text.Title>
+            </Text.Paragraph>
         </TouchableOpacity>
     );
 

package/datePicker/WheelPicker.js

@@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 import { Dimensions, View } from 'react-native';
-import { LinearGradient, Text, Colors, ScaleSize } from '@momo-kits/core';
+import { LinearGradient, Text, Colors, ScaleSize } from '@momo-kits/core-v2';
 import ScrollCustom from './custom/ScrollCustom';
 import DatePickerHelper from './helper/DatePickerHelper';
 
@@ -32,6 +32,7 @@ export default class WheelPicker extends Component {
 
     componentDidMount() {
         const { value } = this.props;
+        console.log(value);
         this.scrollToPosition(value);
     }
 
@@ -186,21 +187,24 @@ export default class WheelPicker extends Component {
         const { items, value, width } = this.state;
         const { preFix, bottomOffset } = this.props;
         return (
-            <View style={{ flex: 1, height: heightContain + 40 }}>
-                <Text.SubTitle
-                    weight="bold"
+            <View
+                style={{
+                    flex: 1,
+                    height: heightContain + 40,
+                }}>
+                <Text.Description2
+                    weight="semibold"
                     style={{
                         color: Colors.black_17,
                         marginLeft: 6,
                         marginBottom: 3,
                     }}>
                     {DatePickerHelper.capitalizeFirstLetter(preFix || '')}
-                </Text.SubTitle>
+                </Text.Description2>
                 <View
                     style={{
                         flex: 1,
                         height: heightContain,
-                        //backgroundColor: 'blue',
                         marginHorizontal: 6,
                         paddingBottom: 20,
                         borderWidth: 1,
@@ -275,22 +279,21 @@ export default class WheelPicker extends Component {
                                     justifyContent: 'center',
                                     alignItems: 'center',
                                 }}>
-                                <Text
+                                <Text.Action2
+                                    weight={
+                                        value === index ? 'bold' : 'semibold'
+                                    }
                                     style={{
                                         color:
                                             value === index
                                                 ? Colors.black_17
-                                                : '#909090',
-                                        fontWeight:
-                                            value === index ? 'bold' : '700',
-                                        fontSize:
-                                            value === index
-                                                ? ScaleSize(20)
-                                                : ScaleSize(16),
+                                                : Colors.black_12,
+
+                                        fontSize: 15,
                                     }}>
                                     {valueItem}
                                     {/* {reversePreFix ? `${valueItem} ${preFix}` : `${preFix} ${valueItem}`} */}
-                                </Text>
+                                </Text.Action2>
                             </View>
                         ))}
                         {this.renderHiddenItem(

package/datePicker/helper/DatePickerHelper.js

@@ -49,7 +49,7 @@ export default class DatePickerHelper {
         '22:00',
         '22:30',
         '23:00',
-        '23:30'
+        '23:30',
     ];
 
     static makeRange(min, max, isDouble) {
@@ -57,7 +57,8 @@ export default class DatePickerHelper {
         // eslint-disable-next-line no-plusplus
         for (let i = min; i <= max; i++) {
             const string = String(i);
-            const value = string.length === 1 && isDouble ? `0${string}` : string;
+            const value =
+                string.length === 1 && isDouble ? `0${string}` : string;
             array.push(value);
         }
         return array;
@@ -69,7 +70,14 @@ export default class DatePickerHelper {
             const day = current.getDate().toString();
             const month = (current.getMonth() + 1).toString();
             const year = current.getFullYear().toString();
-            return DatePickerHelper.toString(day, month, year, null, null, format);
+            return DatePickerHelper.toString(
+                day,
+                month,
+                year,
+                null,
+                null,
+                format,
+            );
         }
         return '';
     }
@@ -77,10 +85,17 @@ export default class DatePickerHelper {
     static formatDate(date, format) {
         if (date && format) {
             const {
-                year, month, day, hour, minute, second = 0
+                year,
+                month,
+                day,
+                hour,
+                minute,
+                second = 0,
             } = DatePickerHelper.getDateTimeFromFormat(date, format);
-            if (DatePickerHelper.checkValidDate(year, month, day)
-                && DatePickerHelper.checkValidTime(hour, minute, second)) {
+            if (
+                DatePickerHelper.checkValidDate(year, month, day) &&
+                DatePickerHelper.checkValidTime(hour, minute, second)
+            ) {
                 return new Date(year, month, day, hour, minute, second);
             }
             return null;
@@ -119,8 +134,14 @@ export default class DatePickerHelper {
 
         const today = new Date();
 
-        const year = yearIndex > -1 ? dateItems?.[yearIndex] : today.getFullYear();
-        const month = monthIndex > -1 ? dateItems?.[monthIndex] - 1 : today.getMonth() === 0 ? 1 : today.getMonth() - 1;
+        const year =
+            yearIndex > -1 ? dateItems?.[yearIndex] : today.getFullYear();
+        const month =
+            monthIndex > -1
+                ? dateItems?.[monthIndex] - 1
+                : today.getMonth() === 0
+                ? 1
+                : today.getMonth() - 1;
         const day = dayIndex > -1 ? dateItems?.[dayIndex] : today.getDate();
 
         const hour = hourIndex > -1 ? dateItems[hourIndex] : 0;
@@ -142,7 +163,7 @@ export default class DatePickerHelper {
             return number;
         }
         return `0${number}`;
-    }
+    };
 
     static toString(day, month, year, hour, minute, format) {
         if (day && month && year && format) {
@@ -160,24 +181,32 @@ export default class DatePickerHelper {
         const year = parseInt(y);
         const month = parseInt(m);
         const day = parseInt(d);
-        const months31 = [0, 2, 4, 6, 7, 9, 11];
-        const months30 = [3, 5, 8, 10];
-        const months28 = [1];
-        const isLeap = ((year % 4 === 0) && (year % 100 !== 0)) || (year % 400 === 0);
+        const months31 = [1, 3, 5, 7, 8, 10, 12];
+        const months30 = [4, 6, 9, 11];
+        const months28 = [2];
+        const isLeap = (year % 4 === 0 && year % 100 !== 0) || year % 400 === 0;
         if (year != null && month != null && day != null) {
             const isDayValid = day > 0;
-            const isMonthValid = (months31.indexOf(parseInt(month)) != -1 && day <= 31)
-            || (months30.indexOf(month) != -1 && day <= 30)
-            || (months30.indexOf(month) != -1 && day <= 31)
-            || (months28.indexOf(month) != -1 && day <= 28)
-            || (months28.indexOf(month) != -1 && day <= 29 && isLeap);
+            const isMonthValid =
+                (months31.indexOf(parseInt(month)) != -1 && day <= 31) ||
+                (months30.indexOf(month) != -1 && day <= 30) ||
+                (months30.indexOf(month) != -1 && day <= 31) ||
+                (months28.indexOf(month) != -1 && day <= 28) ||
+                (months28.indexOf(month) != -1 && day <= 29 && isLeap);
             return isDayValid && isMonthValid;
         }
         return false;
     }
 
     static checkValidTime(hour, minute, second) {
-        if ((hour >= 0 && hour < 24) && (minute >= 0 && minute < 60) && (second >= 0 && second < 60)) {
+        if (
+            hour >= 0 &&
+            hour < 24 &&
+            minute >= 0 &&
+            minute < 60 &&
+            second >= 0 &&
+            second < 60
+        ) {
             return true;
         }
         return false;
@@ -185,11 +214,18 @@ export default class DatePickerHelper {
 
     static calculateDateSinceYearAgo(yearAgo) {
         let nowDate = new Date();
-        nowDate = new Date(nowDate.getFullYear() - yearAgo, nowDate.getMonth(), nowDate.getDate());
+        nowDate = new Date(
+            nowDate.getFullYear() - yearAgo,
+            nowDate.getMonth(),
+            nowDate.getDate(),
+        );
         return nowDate;
     }
 
-    static getMaxDate(month = new Date().getMonth(), year = new Date().getFullYear()) {
+    static getMaxDate(
+        month = new Date().getMonth(),
+        year = new Date().getFullYear(),
+    ) {
         const monthLength = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
         // Adjust for leap years
         if (year % 400 === 0 || (year % 100 !== 0 && year % 4 === 0)) {
@@ -201,5 +237,5 @@ export default class DatePickerHelper {
 
     static capitalizeFirstLetter(string) {
         return string.charAt(0).toUpperCase() + string.slice(1);
-      }
+    }
 }

package/package.json

@@ -1,11 +1,11 @@
 {
     "name": "@momo-kits/date-picker",
-    "version": "0.0.62-alpha.2",
+    "version": "0.0.62-alpha.20",
     "private": false,
     "main": "index.js",
     "dependencies": {},
     "peerDependencies": {
-        "@momo-kits/core": ">=0.0.5-beta",
+        "@momo-kits/core-v2": ">=0.0.5-beta",
         "lodash": "^4.17.15",
         "prop-types": "^15.7.2",
         "react": "16.9.0",
@@ -13,4 +13,4 @@
     },
     "devDependencies": {},
     "license": "MoMo"
-}
+}