@momo-kits/calendar 0.0.55-beta.4 → 0.0.55-beta.6

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@momo-kits/calendar",
-    "version": "0.0.55-beta.4",
+    "version": "0.0.55-beta.6",
     "private": false,
     "main": "index.js",
     "dependencies": {

package/src/Calendar.js

@@ -2,7 +2,7 @@ import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { View, ScrollView, Platform, StyleSheet } from 'react-native';
 import moment from 'moment';
-import { Text, SwitchLanguage, Colors, Spacing } from '@momo-kits/core';
+import { Text, SwitchLanguage, Colors, Spacing, Radius } from '@momo-kits/core';
 import Switch from '@momo-kits/switch';
 import CalendarPro from './CalendarPro';
 import TabHeader from './TabHeader';
@@ -419,9 +419,15 @@ class Calendar extends Component {
         } = this.props;
         const { isDoubleDateMode } = this.state;
         return (
-            <ScrollView style={{ flex: 1, backgroundColor: 'white' }}>
-                {!isHiddenSwitch && this.renderSwitchReturnSelection()}
-                {!isHideHeaderPanel && this.renderHeaderPanel()}
+            <ScrollView style={{ flex: 1, backgroundColor: 'transparent' }}>
+                <View
+                    style={{
+                        backgroundColor: Colors.black_01,
+                        borderRadius: Radius.XS,
+                    }}>
+                    {!isHiddenSwitch && this.renderSwitchReturnSelection()}
+                    {!isHideHeaderPanel && this.renderHeaderPanel()}
+                </View>
                 <CalendarPro
                     ref={this.calendarPicker}
                     startDate={doubleDate?.first}

package/src/CalendarPro.js

@@ -18,6 +18,7 @@ import {
     Image,
     IconSource,
     Spacing,
+    Radius,
 } from '@momo-kits/core';
 import MonthList from './MonthList';
 import HeaderControl from './HeaderControl';
@@ -250,44 +251,46 @@ export default class CalendarPro extends Component {
                         onPressNextArrow={this.onPressNextArrow}
                     />
                     <View style={styles.blueSeperator} />
-                    <View style={styles.viewDay}>
-                        {[1, 2, 3, 4, 5, 6, 7].map((item) => (
-                            <Text
-                                style={[
-                                    styles.textDay,
-                                    {
-                                        color:
-                                            item === 6 || item === 7
-                                                ? Colors.red_05
-                                                : Colors.black_12,
-                                    },
-                                ]}
-                                key={item}>
-                                {Util.mapWeeKDate(item)}
-                            </Text>
-                        ))}
+                    <View style={{ paddingHorizontal: Spacing.M }}>
+                        <View style={styles.viewDay}>
+                            {[1, 2, 3, 4, 5, 6, 7].map((item) => (
+                                <Text
+                                    style={[
+                                        styles.textDay,
+                                        {
+                                            color:
+                                                item === 6 || item === 7
+                                                    ? Colors.red_05
+                                                    : Colors.black_12,
+                                        },
+                                    ]}
+                                    key={item}>
+                                    {Util.mapWeeKDate(item)}
+                                </Text>
+                            ))}
+                        </View>
+                        <MonthList
+                            ref="MonthList"
+                            today={this.today}
+                            minDate={this.minDate}
+                            maxDate={this.maxDate}
+                            startDate={startDate}
+                            endDate={endDate}
+                            onChoose={this.onChoose}
+                            i18n={i18n}
+                            onScrollCalendar={this.onScrollCalendar}
+                            isShowLunar={!isOffLunar && showLunar}
+                            isDoubleDateMode={isDoubleDateMode}
+                            tabSelected={tabSelected}
+                            lunarConverter={this.converter}
+                            holidays={holidays}
+                            selectedDate={this.selectedDate}
+                            priceList={priceListFormat}
+                            labelFrom={labelFrom}
+                            labelTo={labelTo}
+                            isHideLabel={isHideLabel}
+                        />
                     </View>
-                    <MonthList
-                        ref="MonthList"
-                        today={this.today}
-                        minDate={this.minDate}
-                        maxDate={this.maxDate}
-                        startDate={startDate}
-                        endDate={endDate}
-                        onChoose={this.onChoose}
-                        i18n={i18n}
-                        onScrollCalendar={this.onScrollCalendar}
-                        isShowLunar={!isOffLunar && showLunar}
-                        isDoubleDateMode={isDoubleDateMode}
-                        tabSelected={tabSelected}
-                        lunarConverter={this.converter}
-                        holidays={holidays}
-                        selectedDate={this.selectedDate}
-                        priceList={priceListFormat}
-                        labelFrom={labelFrom}
-                        labelTo={labelTo}
-                        isHideLabel={isHideLabel}
-                    />
                 </View>
                 {!isOffLunar && (
                     <View style={styles.viewLunar}>
@@ -409,7 +412,7 @@ const styles = StyleSheet.create({
         borderStyle: 'solid',
         borderColor: '#c7c7cd',
     },
-    viewDate: { paddingHorizontal: 12 },
+    viewDate: {},
     textDay: {
         // fontSize: 14,
         lineHeight: 16,
@@ -424,7 +427,12 @@ const styles = StyleSheet.create({
         paddingTop: 15,
         paddingBottom: 10,
     },
-    container: { flex: 1, backgroundColor: 'white', marginTop: 20 },
+    container: {
+        flex: 1,
+        backgroundColor: 'white',
+        marginTop: Spacing.S,
+        borderRadius: Radius.XS,
+    },
     blueSeperator: {
         height: 1,
         width: '100%',