linear-react-components-ui 0.4.77-beta.26 → 0.4.77-beta.28

package/lib/inputs/period/index.js

@@ -1,6 +1,6 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -11,7 +11,7 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _moment = _interopRequireDefault(require("moment"));
 
-var _PeriodList = _interopRequireDefault(require("./PeriodList"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _BaseMask = _interopRequireDefault(require("../mask/BaseMask"));
 
@@ -25,6 +25,10 @@ var _icons = _interopRequireDefault(require("../../icons"));
 
 var _Dialog = _interopRequireDefault(require("./Dialog"));
 
+var _colorStyles = _interopRequireDefault(require("../../internals/colorStyles"));
+
+var _PeriodList = _interopRequireDefault(require("./PeriodList"));
+
 var helperBase = _interopRequireWildcard(require("../base/helpers"));
 
 require("../../assets/styles/periodpicker.scss");
@@ -35,7 +39,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
@@ -45,38 +49,33 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _iterableToArrayLimit(arr, i) { var _i = arr && (typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]); if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-var PeriodPicker = function PeriodPicker(props) {
-  var _props$value2, _props$value3;
-
-  var _props$showButtonOpen = props.showButtonOpen,
-      showButtonOpen = _props$showButtonOpen === void 0 ? true : _props$showButtonOpen,
-      _props$openOnFocus = props.openOnFocus,
-      openOnFocus = _props$openOnFocus === void 0 ? true : _props$openOnFocus,
-      _props$shouldCloseOnS = props.shouldCloseOnSelect,
-      shouldCloseOnSelect = _props$shouldCloseOnS === void 0 ? true : _props$shouldCloseOnS,
-      _props$showCalendarIn = props.showCalendarInDialog,
-      showCalendarInDialog = _props$showCalendarIn === void 0 ? false : _props$showCalendarIn,
-      _props$dialogSize = props.dialogSize,
-      dialogSize = _props$dialogSize === void 0 ? {
-    width: '350px',
-    height: '350px'
-  } : _props$dialogSize,
-      calendarColorStyle = props.calendarColorStyle;
+function usePrevious(value) {
+  var ref = (0, _react.useRef)();
+  (0, _react.useEffect)(function () {
+    ref.current = value;
+  });
+  return ref.current;
+}
 
-  var _useState = (0, _react.useState)(props.value && props.value.valueInitial ? (0, _moment.default)(props.value.valueInitial) : undefined),
+var PeriodPicker = function PeriodPicker(props) {
+  var _useState = (0, _react.useState)(props.value && props.value.initial ? (0, _moment.default)(props.value.initial) : undefined),
       _useState2 = _slicedToArray(_useState, 2),
       valueInitial = _useState2[0],
       setValueInitial = _useState2[1];
 
-  var _useState3 = (0, _react.useState)(props.value && props.value.valueFinal ? (0, _moment.default)(props.value.valueFinal) : undefined),
+  var _useState3 = (0, _react.useState)(props.value && props.value.final ? (0, _moment.default)(props.value.final) : undefined),
       _useState4 = _slicedToArray(_useState3, 2),
       valueFinal = _useState4[0],
       setValueFinal = _useState4[1];
 
+  var previusValueInitial = usePrevious(valueInitial);
+  var previusValueFinal = usePrevious(valueFinal);
+  var previusValueProp = usePrevious(props.value);
+
   var _useState5 = (0, _react.useState)('valueInitial'),
       _useState6 = _slicedToArray(_useState5, 2),
       changing = _useState6[0],
@@ -97,28 +96,26 @@ var PeriodPicker = function PeriodPicker(props) {
       showPeriodSelection = _useState12[0],
       setShowPeriodSelection = _useState12[1];
 
-  var _useState13 = (0, _react.useState)(),
+  var _useState13 = (0, _react.useState)(null),
       _useState14 = _slicedToArray(_useState13, 2),
       inputDimensions = _useState14[0],
       setInputDimensions = _useState14[1];
 
-  var _useState15 = (0, _react.useState)(),
+  var _useState15 = (0, _react.useState)(undefined),
       _useState16 = _slicedToArray(_useState15, 2),
       onDenied = _useState16[0],
       setOnDenied = _useState16[1];
 
-  var inputContainerRef = (0, _react.useRef)(null);
-  var inputInitialRef = (0, _react.useRef)(null);
-  var buttonOpenRef = (0, _react.useRef)(null);
-  var buttonSelectPeriodRef = (0, _react.useRef)(null);
-  var dropdownCalendarContainer = (0, _react.useRef)(null);
-  var dropdownPeriodContainer = (0, _react.useRef)(null);
-  var inputFinalRef = (0, _react.useRef)(null);
+  var inputContainerRef = (0, _react.useRef)();
+  var inputInitialRef = (0, _react.useRef)();
+  var buttonOpenRef = (0, _react.useRef)();
+  var buttonSelectPeriodRef = (0, _react.useRef)();
+  var dropdownCalendarContainer = (0, _react.useRef)();
+  var dropdownPeriodContainer = (0, _react.useRef)();
+  var inputFinalRef = (0, _react.useRef)();
 
   var onScreenResize = function onScreenResize() {
-    var _inputContainerRef$cu;
-
-    var inputDimensionsAux = inputContainerRef === null || inputContainerRef === void 0 ? void 0 : (_inputContainerRef$cu = inputContainerRef.current) === null || _inputContainerRef$cu === void 0 ? void 0 : _inputContainerRef$cu.getBoundingClientRect();
+    var inputDimensionsAux = inputContainerRef.current.getBoundingClientRect();
     setInputDimensions(inputDimensionsAux);
   };
 
@@ -145,23 +142,28 @@ var PeriodPicker = function PeriodPicker(props) {
     };
   }, []);
   (0, _react.useEffect)(function () {
-    if (valueFinal && valueInitial && (0, _moment.default)(valueFinal).isBefore((0, _moment.default)(valueInitial))) {
-      setValueInitial(valueFinal);
-      setValueFinal(valueInitial);
-    } else if (props.onChange) {
-      var initial = valueInitial ? valueInitial.format('YYYY-MM-DD') : '';
-      var final = valueFinal ? valueFinal.format('YYYY-MM-DD') : '';
-      props.onChange(undefined, '', {
-        initial: initial,
-        final: final
-      });
+    if (valueFinal && valueInitial && (previusValueFinal !== valueFinal || previusValueInitial !== valueInitial)) {
+      // Se for selecionado um valor para data final menor que data inicial trocar as datas
+      if (valueFinal < valueInitial) {
+        var valueInitialAux = (0, _moment.default)(valueInitial);
+        setValueInitial(valueFinal);
+        setValueFinal(valueInitialAux); // Sempre que for alterado o estado interno chamar o callback
+      } else if (props.onChange) {
+        var initial = valueInitial ? valueInitial.format('YYYY-MM-DD') : '';
+        var final = valueFinal ? valueFinal.format('YYYY-MM-DD') : '';
+        props.onChange({
+          initial: initial,
+          final: final
+        });
+      }
     }
-  }, [valueInitial, valueFinal]);
+  }, [valueFinal, valueInitial]);
   (0, _react.useEffect)(function () {
-    if (props.value) {
+    // sempre que alterado a prop 'value' atualiza o state interno
+    if (props.value !== previusValueProp) {
       var _props$value = props.value,
-          valueInitialProp = _props$value.valueInitial,
-          valueFinalProp = _props$value.valueFinal;
+          valueInitialProp = _props$value.initial,
+          valueFinalProp = _props$value.final;
       var newValueInitial;
       var newValueFinal;
 
@@ -176,7 +178,7 @@ var PeriodPicker = function PeriodPicker(props) {
       setValueInitial(newValueInitial);
       setValueFinal(newValueFinal);
     }
-  }, [(_props$value2 = props.value) === null || _props$value2 === void 0 ? void 0 : _props$value2.valueInitial, (_props$value3 = props.value) === null || _props$value3 === void 0 ? void 0 : _props$value3.valueFinal]);
+  }, [props.value]);
 
   var openCalendar = function openCalendar() {
     setShowCalendar(true);
@@ -188,30 +190,27 @@ var PeriodPicker = function PeriodPicker(props) {
   };
 
   var onInputFocus = function onInputFocus(e) {
-    var _ref = e.target,
-        name = _ref.name;
+    var openOnFocus = props.openOnFocus;
+    var name = e.target.name;
     setChanging(name);
     if (openOnFocus) openCalendar();
   };
 
   var onInputChange = function onInputChange(event, value) {
-    if (event) {
-      var _ref2 = event.target,
-          changingAux = _ref2.name;
-
-      if (value && value.replace(/\D/g, '') === '') {
-        if (changingAux === 'valueInitial') {
-          setValueInitial(undefined);
-        } else {
-          setValueFinal(undefined);
-        }
+    var changingAux = event.target.name;
+
+    if (value.replace(/\D/g, '') === '') {
+      if (changingAux === 'valueInitial') {
+        setValueInitial(undefined);
+      } else {
+        setValueFinal(undefined);
       }
     }
   };
 
   var setValue = function setValue(e, value) {
     var sholdOpenDropdown = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
-    var changingAux = e ? e.target.name : '';
+    var changingAux = e.target.name;
     var dateObj = (0, _moment.default)(value, 'DD/MM/YYYY');
 
     if (changingAux === 'valueInitial') {
@@ -219,17 +218,20 @@ var PeriodPicker = function PeriodPicker(props) {
     } else {
       setValueFinal(dateObj);
     }
+    /*
+      Caso valor setado for inicial e valor final vazio,
+      dar focus na data final e abrir dropdown para selecao de data final
+    */
 
-    if (changingAux === 'valueInitial' && !valueFinal && sholdOpenDropdown) {
-      var _inputFinalRef$curren;
 
-      if (valueFinal) setChanging(valueFinal);
+    if (changingAux === 'valueInitial' && !valueFinal && sholdOpenDropdown) {
+      setChanging(valueFinal);
       setShowCalendar(false);
-      (_inputFinalRef$curren = inputFinalRef.current) === null || _inputFinalRef$curren === void 0 ? void 0 : _inputFinalRef$curren.focus();
+      inputFinalRef.current.focus();
       setTimeout(function () {
         return setShowCalendar(true);
       }, 100);
-    } else if (shouldCloseOnSelect) {
+    } else if (props.shouldCloseOnSelect) {
       setShowCalendar(false);
     }
   };
@@ -240,6 +242,7 @@ var PeriodPicker = function PeriodPicker(props) {
   };
 
   var getButtonOpen = function getButtonOpen() {
+    var showButtonOpen = props.showButtonOpen;
     if (!showButtonOpen) return null;
     return /*#__PURE__*/_react.default.createElement(_buttons.default, {
       key: "button-open",
@@ -248,14 +251,12 @@ var PeriodPicker = function PeriodPicker(props) {
         name: "calendar"
       }),
       onClick: function onClick() {
-        var _inputInitialRef$curr;
-
-        (_inputInitialRef$curr = inputInitialRef.current) === null || _inputInitialRef$curr === void 0 ? void 0 : _inputInitialRef$curr.focus();
+        inputInitialRef.current.focus();
         setChanging('valueInitial');
         openCalendar();
       },
       customClass: "calendar-button",
-      tabIndex: -1,
+      tabIndex: "-1",
       targetRef: function targetRef(ref) {
         buttonOpenRef.current = ref;
       },
@@ -263,10 +264,10 @@ var PeriodPicker = function PeriodPicker(props) {
     });
   };
 
-  var getPeriodSelection = function getPeriodSelection(valuePeriodSelectionAux, setPeriodDates) {
+  var getPeriodSelection = function getPeriodSelection(valuePeriodSelectionAux, setPeridDates) {
     return /*#__PURE__*/_react.default.createElement(_PeriodList.default, {
       selected: valuePeriodSelectionAux,
-      handleOnSelect: setPeriodDates
+      handleOnSelect: setPeridDates
     });
   };
 
@@ -290,7 +291,7 @@ var PeriodPicker = function PeriodPicker(props) {
         return openPeriodSelecion();
       },
       customClass: "calendar-button",
-      tabIndex: -1,
+      tabIndex: "-1",
       targetRef: function targetRef(ref) {
         buttonSelectPeriodRef.current = ref;
       },
@@ -298,9 +299,9 @@ var PeriodPicker = function PeriodPicker(props) {
     });
   };
 
-  var getCalendar = function getCalendar(value, calendarColorStyleCalendar, changingAux) {
+  var getCalendar = function getCalendar(value, calendarColorStyle, changingAux) {
     return /*#__PURE__*/_react.default.createElement(_calendar.default, {
-      currentDate: value !== undefined ? (0, _moment.default)(value) : (0, _moment.default)(),
+      currentDate: value !== undefined ? value : (0, _moment.default)(),
       onDateChange: function onDateChange(date) {
         return setValue({
           target: {
@@ -308,15 +309,13 @@ var PeriodPicker = function PeriodPicker(props) {
           }
         }, date);
       },
-      colorStyle: calendarColorStyleCalendar
+      colorStyle: calendarColorStyle
     });
   };
 
-  var setPeriodDates = function setPeriodDates(selected, dates) {
+  var setPeridDates = function setPeridDates(selected, dates) {
     if (selected === 'custom') {
-      var _inputInitialRef$curr2;
-
-      (_inputInitialRef$curr2 = inputInitialRef.current) === null || _inputInitialRef$curr2 === void 0 ? void 0 : _inputInitialRef$curr2.focus();
+      inputInitialRef.current.focus();
       setValuePeriodSelection(selected);
       setChanging('valueInitial');
       setShowPeriodSelection(false);
@@ -325,19 +324,19 @@ var PeriodPicker = function PeriodPicker(props) {
     }
 
     setValuePeriodSelection(selected);
+    setValueInitial(dates[0]);
+    setValueFinal(dates[1]);
 
-    if (dates) {
-      setValueInitial(dates[0]);
-      setValueFinal(dates[1]);
-    }
-
-    if (shouldCloseOnSelect) {
+    if (props.shouldCloseOnSelect) {
       setShowPeriodSelection(false);
     }
   };
 
   var getWrapperComponentCalendar = function getWrapperComponentCalendar() {
     var value = changing === 'valueInitial' ? valueInitial : valueFinal;
+    var showCalendarInDialog = props.showCalendarInDialog,
+        dialogSize = props.dialogSize,
+        calendarColorStyle = props.calendarColorStyle;
     if (onDenied && onDenied.readOnly) return null;
 
     if (showCalendarInDialog) {
@@ -351,9 +350,9 @@ var PeriodPicker = function PeriodPicker(props) {
 
     return /*#__PURE__*/_react.default.createElement(_Dropdown.default, {
       targetElement: inputContainerRef.current,
-      topPosition: inputDimensions ? inputDimensions.top + inputDimensions.height + 5 : '',
-      leftPosition: inputDimensions ? inputDimensions.left : '',
-      width: inputDimensions ? inputDimensions.width : '',
+      topPosition: inputDimensions.top + inputDimensions.height + 5,
+      leftPosition: inputDimensions.left,
+      width: inputDimensions.width,
       dropdownRef: function dropdownRef(el) {
         dropdownCalendarContainer.current = el;
       }
@@ -361,45 +360,54 @@ var PeriodPicker = function PeriodPicker(props) {
   };
 
   var getWrapperComponentPeriodSelection = function getWrapperComponentPeriodSelection() {
+    var showCalendarInDialog = props.showCalendarInDialog,
+        dialogSize = props.dialogSize;
+
     if (showCalendarInDialog) {
       return /*#__PURE__*/_react.default.createElement(_Dialog.default, {
         dialogSize: dialogSize,
         handlerClose: function handlerClose() {
           return setShowPeriodSelection(false);
         }
-      }, getPeriodSelection(valuePeriodSelection, setPeriodDates));
+      }, getPeriodSelection(valuePeriodSelection, setPeridDates));
     }
 
     return /*#__PURE__*/_react.default.createElement(_Dropdown.default, {
       targetElement: inputContainerRef.current,
-      topPosition: inputDimensions ? inputDimensions.top + inputDimensions.height + 5 : '',
-      leftPosition: inputDimensions ? inputDimensions.left : '',
-      width: inputDimensions ? inputDimensions.width : '',
+      topPosition: inputDimensions.top + inputDimensions.height + 5,
+      leftPosition: inputDimensions.left,
+      width: inputDimensions.width,
       dropdownRef: function dropdownRef(el) {
         dropdownPeriodContainer.current = el;
       }
-    }, getPeriodSelection(valuePeriodSelection, setPeriodDates));
+    }, getPeriodSelection(valuePeriodSelection, setPeridDates));
   };
 
+  var required = props.required,
+      label = props.label,
+      customClassForLabel = props.customClassForLabel,
+      labelUppercase = props.labelUppercase,
+      errorMessages = props.errorMessages;
   if (onDenied && onDenied.unvisible) return null;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "input-base-component"
-  }, props.label && /*#__PURE__*/_react.default.createElement("div", {
+  }, label && /*#__PURE__*/_react.default.createElement("div", {
     className: "labelcontainer"
   }, /*#__PURE__*/_react.default.createElement("span", {
-    className: "label ".concat(props.customClassForLabel, " ").concat(props.labelUppercase && ' -uppercase')
-  }, props.label, props.required && /*#__PURE__*/_react.default.createElement("span", {
+    className: "label ".concat(customClassForLabel, " ").concat(labelUppercase && ' -uppercase')
+  }, label, required && /*#__PURE__*/_react.default.createElement("span", {
     className: "-requiredlabel"
   }, "*"))), /*#__PURE__*/_react.default.createElement("div", {
     className: "periodpicker-component ".concat(helperBase.getInputWrapperClass(_extends({}, props, {
-      value: !valueInitial ? '' : (0, _moment.default)(valueInitial).format('DD/MM/YYYY'),
       disabled: shouldDisable()
     }))),
-    ref: inputContainerRef
+    ref: function ref(el) {
+      inputContainerRef.current = el;
+    }
   }, /*#__PURE__*/_react.default.createElement(_BaseMask.default, {
     permissionAttr: props.permissionAttr,
     name: "valueInitial",
-    value: !valueInitial ? '' : (0, _moment.default)(valueInitial).format('DD/MM/YYYY'),
+    value: !valueInitial ? '' : valueInitial.format('DD/MM/YYYY'),
     mask: "00/00/0000",
     onComplete: function onComplete(e, date) {
       setValue(e, date, false);
@@ -407,34 +415,74 @@ var PeriodPicker = function PeriodPicker(props) {
     onFocus: onInputFocus,
     onChange: onInputChange,
     inputRef: function inputRef(el) {
-      if (el) inputInitialRef.current = el;
+      inputInitialRef.current = el;
     },
-    handlerSetOnDenied: function handlerSetOnDenied(denied) {
-      setOnDenied(denied);
+    handlerSetOnDenied: function handlerSetOnDenied(value) {
+      return setOnDenied(value);
     },
-    required: props.required
+    required: required
   }), /*#__PURE__*/_react.default.createElement(_icons.default, {
     name: "arrow_right",
     customClass: "separation_icon"
   }), /*#__PURE__*/_react.default.createElement(_BaseMask.default, {
     permissionAttr: props.permissionAttr,
     name: "valueFinal",
-    value: !valueFinal ? '' : (0, _moment.default)(valueFinal).format('DD/MM/YYYY'),
+    value: !valueFinal ? '' : valueFinal.format('DD/MM/YYYY'),
     mask: "00/00/0000",
     onComplete: function onComplete(e, date) {
-      setValue(e, date, false);
+      return setValue(e, date, false);
     },
     onFocus: onInputFocus,
     onChange: onInputChange,
     inputRef: function inputRef(el) {
       inputFinalRef.current = el;
     },
-    handlerSetOnDenied: function handlerSetOnDenied(denied) {
-      return setOnDenied(denied);
+    handlerSetOnDenied: function handlerSetOnDenied(value) {
+      return setOnDenied(value);
     },
-    required: props.required
-  }), getButtonOpen(), getButtonSelectPeriod()), showCalendar && getWrapperComponentCalendar(), showPeriodSelection && getWrapperComponentPeriodSelection(), props.errorMessages && helperBase.getErrorMessages(props.errorMessages));
+    required: required
+  }), getButtonOpen(), getButtonSelectPeriod()), showCalendar && getWrapperComponentCalendar(), showPeriodSelection && getWrapperComponentPeriodSelection(), helperBase.getErrorMessages(errorMessages));
 };
 
+PeriodPicker.propTypes = {
+  label: _propTypes.default.string,
+  value: _propTypes.default.object,
+  customClassForLabel: _propTypes.default.string,
+  labelUppercase: _propTypes.default.string,
+  showButtonOpen: _propTypes.default.bool,
+  shouldCloseOnSelect: _propTypes.default.bool,
+  openOnFocus: _propTypes.default.bool,
+  showCalendarInDialog: _propTypes.default.bool,
+  dialogSize: _propTypes.default.object,
+  calendarColorStyle: _propTypes.default.oneOf(['', _colorStyles.default.PRIMARY, _colorStyles.default.SUCCESS, _colorStyles.default.WARNING, _colorStyles.default.INFO, _colorStyles.default.DANGER]),
+  required: _propTypes.default.bool,
+  onChange: _propTypes.default.func,
+  disabled: _propTypes.default.bool,
+  permissionAttr: _propTypes.default.object,
+  errorMessages: _propTypes.default.arrayOf(_propTypes.default.string)
+};
+PeriodPicker.defaultProps = {
+  value: {
+    valueInitial: undefined,
+    valueFinal: undefined
+  },
+  label: undefined,
+  customClassForLabel: undefined,
+  labelUppercase: undefined,
+  showButtonOpen: true,
+  openOnFocus: true,
+  shouldCloseOnSelect: true,
+  showCalendarInDialog: false,
+  dialogSize: {
+    width: '350px',
+    height: '350px'
+  },
+  calendarColorStyle: '',
+  required: false,
+  onChange: undefined,
+  disabled: false,
+  permissionAttr: undefined,
+  errorMessages: []
+};
 var _default = PeriodPicker;
 exports.default = _default;