Add possibility to add custom styles

Author: Jiri Kolarik

src/index.js

@@ -44,7 +44,7 @@ type WeekType = {
   onDisableClicked: (date: moment) => void
 }
 
-const styles = StyleSheet.create({
+const defaultStyles = StyleSheet.create({
   calendar: {
     backgroundColor: 'rgb(255, 255, 255)'
   },
@@ -117,7 +117,8 @@ export const Week = (props: WeekType) => {
     startOfWeek,
     onDatesChange,
     isDateBlocked,
-    onDisableClicked
+    onDisableClicked,
+    styles
   } = props;
 
   const days = [];
@@ -197,7 +198,8 @@ export const Month = (props: MonthType) => {
     focusedMonth,
     onDatesChange,
     isDateBlocked,
-    onDisableClicked
+    onDisableClicked,
+    styles
   } = props;
 
   const dayNames = [];
@@ -229,6 +231,7 @@ export const Month = (props: MonthType) => {
         onDatesChange={onDatesChange}
         isDateBlocked={isDateBlocked}
         onDisableClicked={onDisableClicked}
+        styles={styles}
       />
     );
   });
@@ -258,6 +261,8 @@ export default class Dates extends Component {
     const nextMonth = () => {
       this.setState({ focusedMonth: this.state.focusedMonth.add(1, 'M') });
     };
+    
+    const styles = {...defaultStyles, ...(this.props.styles || {})};
 
     return (
       <View style={styles.calendar}>
@@ -281,6 +286,7 @@ export default class Dates extends Component {
           onDatesChange={this.props.onDatesChange}
           isDateBlocked={this.props.isDateBlocked}
           onDisableClicked={this.props.onDisableClicked}
+          styles={styles}
         />
       </View>
     );