fixed wring side indicator for period

rghorbani · Mar 10, 2018 · 4a7f570 · 4a7f570
1 parent f1bdeb9
commit 4a7f570
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 4 deletions.
diff --git a/src/calendar/day/period/index.js b/src/calendar/day/period/index.js
@@ -31,7 +31,7 @@ class Day extends React.Component {
   constructor(props) {
     super(props);
     this.theme = {...defaultStyle, ...(props.theme || {})};
-    this.style = styleConstructor(props.theme);
+    this.style = styleConstructor(props.theme, props);
     this.markingStyle = this.getDrawingStyle(props.marking || []);
     this.onDayPress = this.onDayPress.bind(this);
   }
@@ -208,7 +208,14 @@ const STYLESHEET_ID = 'stylesheet.day.period';
 
 const FILLER_HEIGHT = 34;
 
-function styleConstructor(theme = {}) {
+function styleConstructor(theme = {}, {rtl, type}) {
+  if (rtl === undefined) {
+    if (type === 'jalaali') {
+      rtl = true;
+    } else {
+      rtl = false;
+    }
+  }
   const appStyle = {...defaultStyle, ...theme};
   return StyleSheet.create({
     wrapper: {
@@ -226,7 +233,7 @@ function styleConstructor(theme = {}) {
     fillers: {
       position: 'absolute',
       height: FILLER_HEIGHT,
-      flexDirection: 'row',
+      flexDirection: rtl ? 'row-reverse' : 'row',
       left: 0,
       right: 0
     },

diff --git a/src/calendar/index.js b/src/calendar/index.js
@@ -49,7 +49,7 @@ class Calendar extends React.Component {
     // If firstDay=1 week starts from Monday. Note that dayNames and dayNamesShort should still start from Sunday.
     firstDay: PropTypes.number,
 
-    // Date marking style [simple/period]. Default = 'simple'
+    // Date marking style [simple/multi-dot/period]. Default = 'simple'
     markingType: PropTypes.string,
 
     // Hide month navigation arrows. Default = false
@@ -211,6 +211,7 @@ class Calendar extends React.Component {
           state={state}
           type={this.props.type}
           theme={this.props.theme}
+          rtl={this.props.rtl}
           onPress={this.pressDay}
           date={xdateToData(this.props.type, day)}
           marking={this.getDateMarking(day)}
@@ -290,6 +291,7 @@ class Calendar extends React.Component {
         <CalendarHeader
           type={this.props.type}
           theme={this.props.theme}
+          rtl={this.props.rtl}
           hideArrows={this.props.hideArrows}
           month={this.state.currentMonth}
           addMonth={this.addMonth}