pcm-shared-components 0.0.139 → 0.0.142

package/dist/components/Date/DateRangeCalendar/index.js

@@ -19,8 +19,7 @@ import './css/style.css';
 export const DateRangeCalendar = props => {
   const {
     minBookingDate,
-    numberOfMonthsMobile,
-    numberOfMonthsDesktop,
+    numberOfMonthsVisible,
     dateFormat,
     minBookingDays,
     onDayRender,
@@ -30,22 +29,13 @@ export const DateRangeCalendar = props => {
     onFocusChange,
     startDate,
     endDate,
-    variant
+    variant,
+    vertical,
+    zIndex
   } = props;
 
-  const isValidRenderFunction = functionToCheck => {
-    try {
-      //Makes sure we have a function and also that it's a valid react element which the calendar will use to display the date.
-      return functionToCheck && /*#__PURE__*/React.isValidElement(functionToCheck) ? true : false;
-    } catch (error) {
-      console.error(error);
-    }
-
-    return false;
-  };
-
   const handleOnDayRender = date => {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, onDayRender && isValidRenderFunction(onDayRender(date)) ? /*#__PURE__*/React.createElement(React.Fragment, null, onDayRender(date)) : /*#__PURE__*/React.createElement("span", {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, onDayRender ? /*#__PURE__*/React.createElement(React.Fragment, null, onDayRender(date)) : /*#__PURE__*/React.createElement("span", {
       className: ""
     }, new Date(date).getDate()));
   };
@@ -103,7 +93,10 @@ export const DateRangeCalendar = props => {
         selectDateDateFontSize: 18,
         dateRangeArrowIconColor: orange[700],
         inputLabelBorder: variant === 'outlined' ? undefined : 'none',
-        datepickerBorderRadius: 5
+        datepickerBorderRadius: 5,
+        datepickerZIndex: zIndex,
+        dateRangeZIndex: zIndex,
+        dateSingleZIndex: zIndex
       }
     }
   }, /*#__PURE__*/React.createElement(DateRangeInput, {
@@ -126,8 +119,8 @@ export const DateRangeCalendar = props => {
     firstDayOfWeek: 0,
     minBookingDays: minBookingDays,
     minBookingDate: minBookingDate,
-    vertical: window.innerWidth < 800 ? true : false,
-    numberOfMonths: window.innerWidth < 800 ? numberOfMonthsMobile : numberOfMonthsDesktop,
+    vertical: vertical,
+    numberOfMonths: numberOfMonthsVisible,
     onDatesChange: handleOnDatesChange,
     onFocusChange: handleOnFocusChange,
     startDate: startDate // Date or null
@@ -141,8 +134,7 @@ export const DateRangeCalendar = props => {
 export default DateRangeCalendar;
 DateRangeCalendar.defaultProps = {
   minBookingDate: new Date(new Date().setDate(new Date().getDate() + 1)),
-  numberOfMonthsMobile: 1,
-  numberOfMonthsDesktop: 2,
+  numberOfMonthsVisible: 2,
   dateFormat: 'MMM d, yyyy',
   minBookingDays: 1,
   onDayRender: undefined,
@@ -152,17 +144,16 @@ DateRangeCalendar.defaultProps = {
   startDate: null,
   endDate: null,
   focusedInput: null,
-  variant: 'standard'
+  variant: 'standard',
+  vertical: false,
+  zIndex: 1000
 };
 DateRangeCalendar.propTypes = {
   /** Used to provide the minimum booking date.  To allow date selection past todays date simply pas it an old past date example 'new Date('1999-10-02')' */
   minBookingDate: PropTypes.instanceOf(Date),
 
-  /** Number of calendar months to display when we are in mobile view.*/
-  numberOfMonthsMobile: PropTypes.number,
-
-  /** Number of calendar months to display when we are in desktop view.*/
-  numberOfMonthsDesktop: PropTypes.number,
+  /** Number of calendar months to display.*/
+  numberOfMonthsVisible: PropTypes.number,
 
   /** Date format to use when displaying the selected dates in the text boxes.*/
   dateFormat: PropTypes.string,
@@ -192,5 +183,11 @@ DateRangeCalendar.propTypes = {
   focusedInput: PropTypes.oneOf(['startDate', 'endDate', null]),
 
   /** Controls the type of border to display around the date input boxes*/
-  variant: PropTypes.oneOf(['outlined', 'standard', 'none'])
+  variant: PropTypes.oneOf(['outlined', 'standard', 'none']),
+
+  /** Controls the orientation of the calendar */
+  vertical: PropTypes.bool,
+
+  /** Controls the z-index of the calendar dropdown date selection */
+  zIndex: PropTypes.number
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pcm-shared-components",
-  "version": "0.0.139",
+  "version": "0.0.142",
   "private": false,
   "main": "dist/index.js",
   "babel": {