@desynova-digital/components 8.19.47 → 8.19.49

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/atoms/datePicker/datePicker.js +191 -163
  2. package/package.json +2 -2
package/atoms/datePicker/datePicker.js CHANGED
@@ -9,7 +9,7 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
9
9
 
10
10
  var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
11
11
 
12
- var _templateObject = _taggedTemplateLiteral(["\n & div.form-input > input {\n display: ", ";\n }\n\n .form-input input {\n width: 100%;\n box-sizing: border-box;\n\n background: ", ";\n\n border: none;\n border-radius: 0px;\n -webkit-appearance: none;\n\n font-family: \"SFUIText-Medium\";\n color: ", ";\n cursor: ", ";\n pointer-events: ", ";\n font-size: 14px;\n padding: 10px 20px 4px 0px;\n display: block;\n \n &:disabled:hover {\n border-color: ", ";\n }\n &:disabled {\n border-color: ", ";\n color: ", ";\n }\n &:focus {\n outline: none;\n }\n &::placeholder {\n color: ", ";\n opacity: ", ";\n transition: 0.2s ease all;\n }\n &:focus::placeholder {\n color: ", ";\n\n opacity: ", ";\n }\n }\n\n .form-input {\n border-bottom: 1px solid\n ", ";\n \n &:hover {\n border-color: ", ";\n }\n position: relative;\n margin-top: 20px;\n display: flex;\n align-items:center;\n .calender-icon {\n cursor: pointer;\n path {\n fill-rule:evenodd;\n clip-rule:evenodd;\n }\n }\n\n .clear-icon {\n position: absolute;\n right: 0px;\n bottom: 6px;\n cursor: pointer;\n path {\n fill: #ef5350;\n }\n }\n }\n .form-input label {\n color: ", ";\n font-size: 14px;\n font-family: \"SFUIText-Regular\";\n position: ", ";\n pointer-events: none;\n text-transform: none;\n left: 0px;\n top: ", ";\n transition: 0.2s ease all;\n -moz-transition: 0.2s ease all;\n -webkit-transition: 0.2s ease all;\n }\n\n .form-input label.floaton {\n top: ", ";\n left: 0px;\n font-size: 10px;\n color: ", ";\n text-transform: capitalize;\n }\n\n /* ======Date picker====== */\n\n &.ardp-date-picker {\n font-size: 16px;\n font-family: \"SFUIText-Regular\";\n box-sizing: border-box;\n position: relative;\n }\n &.ardp-date-picker * {\n box-sizing: border-box;\n }\n &.ardp-date-picker div.calendar {\n position: ", ";\n z-index: ", ";\n background: ", ";\n width: 300px;\n border-radius: 0px;\n height: auto;\n overflow: hidden;\n border: 1px solid\n ", ";\n }\n\n &.ardp-date-picker div.calendar:after,\n &.ardp-date-picker div.calendar:before {\n display: table;\n content: \" \";\n box-sizing: border-box;\n }\n\n &.ardp-date-picker div.calendar.calendar-show {\n visibility: visible;\n opacity: 1;\n transition: opacity 100ms linear;\n }\n &.ardp-date-picker div.calendar.calendar-hide {\n visibility: ", ";\n opacity: ", ";\n transition: visibility 0s 100ms, opacity 100ms linear;\n }\n\n &.ardp-date-picker div.calendar div.month-header {\n float: left;\n width: 100%;\n display: flex;\n justify-content: space-between;\n align-items: baseline;\n padding: 10px;\n border-bottom: 1px solid\n ", ";\n }\n &.ardp-date-picker div.calendar div.month-header > span > i {\n cursor: pointer;\n padding: 6px;\n border-radius: 50%;\n width: 25px;\n text-align: center;\n height: 25px;\n border-radius: 18px;\n background-color: ", ";\n ;\n }\n &.ardp-date-picker div.calendar div.month-header > span > i:hover {\n path {\n stroke: ", ";\n }\n }\n &.ardp-date-picker div.calendar div.month-header > span > i > svg {\n path {\n fill: transparent;\n }\n }\n &.ardp-date-picker div.calendar div.month-header > span.month-header-text {\n color: ", ";\n width: 150px;\n text-align: center;\n }\n &.ardp-date-picker\n div.calendar\n div.month-header\n > span.month-header-text\n > .month-text {\n font-family: \"SFUIText-Medium\";\n color: ", ";\n text-transform: uppercase;\n }\n\n &.ardp-date-picker div.calendar div.week-header {\n float: left;\n width: 100%;\n display: block;\n padding: 10px 3px;\n }\n &.ardp-date-picker div.calendar div.week-header > span {\n float: left;\n width: 14.285714285714286%;\n font-size: 14px;\n text-transform: uppercase;\n color: ", ";\n text-align: center;\n }\n &.ardp-date-picker div.calendar div.weeks {\n float: left;\n width: 100%;\n overflow: hidden;\n position: relative;\n padding: 5px 0px;\n }\n &.ardp-date-picker div.calendar div.weeks > div {\n width: 300px;\n }\n &.ardp-date-picker div.calendar div.weeks > div.current {\n left: 0;\n }\n &.ardp-date-picker div.calendar div.weeks > div.other {\n left: 300px;\n position: absolute;\n }\n &.ardp-date-picker div.calendar div.weeks > div.other.right {\n left: -300px;\n }\n &.ardp-date-picker div.calendar div.weeks > div.sliding {\n transition: transform 250ms ease;\n -webkit-transition: -webkit-transform 250ms ease;\n }\n &.ardp-date-picker div.calendar div.weeks > div.sliding.left {\n transform: translate3d(-300px, 0, 0);\n -webkit-transform: translate3d(-300px, 0, 0);\n }\n &.ardp-date-picker div.calendar div.weeks > div.sliding.right {\n transform: translate3d(300px, 0, 0);\n -webkit-transform: translate3d(300px, 0, 0);\n }\n &.ardp-date-picker div.calendar div.weeks div.week {\n float: left;\n width: 100%;\n margin: 5px 0px;\n }\n &.ardp-date-picker div.calendar div.weeks div.week div.day {\n float: left;\n width: 14.285714285714286%;\n font-size: 14px;\n text-align: center;\n /* padding: 2px 0px; */\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day > span {\n //padding: 11px 0px 5px;\n display: inline-block;\n border-radius: 50%;\n height: 30px;\n width: 30px;\n text-align: center;\n border: 1px solid transparent;\n background: ", ";\n color: ", ";\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day > span:hover,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.today\n > span:hover {\n background: ", ";\n cursor: pointer;\n color: ", ";\n }\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.other-month\n > span {\n color: ", ";\n }\n &.ardp-date-picker div.calendar div.weeks div.week div.day.disabled > span,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.disabled\n > span:hover {\n color: ", ";\n cursor: not-allowed;\n background: ", ";\n }\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.other-month.disabled\n > span {\n color: ", ";\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day.today > span {\n border: 1px none\n ", ";\n color: ", ";\n }\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.today.disabled\n > span {\n background: ", ";\n border: 1px solid transparent;\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day.selected > span,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.today\n > span:hover {\n background: ", ";\n color: ", ";\n }\n\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.disabled\n > span,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.disabled\n > span:hover {\n background: ", ";\n }\n\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.range-start {\n background: ", ";\n\n border-top-left-radius: 30px;\n border-bottom-left-radius: 30px;\n\n & > span {\n background: transparent;\n border-top-right-radius: 0px;\n border-bottom-right-radius: 0px;\n }\n }\n\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.range-end {\n background: ", ";\n\n border-top-right-radius: 30px;\n border-bottom-right-radius: 30px;\n\n & > span {\n background: transparent;\n border-top-left-radius: 0px;\n border-bottom-left-radius: 0px;\n }\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day.in-selected-range {\n background: ", ";\n & > span {\n background: transparent;\n color: #fff;\n }\n }\n"], ["\n & div.form-input > input {\n display: ", ";\n }\n\n .form-input input {\n width: 100%;\n box-sizing: border-box;\n\n background: ", ";\n\n border: none;\n border-radius: 0px;\n -webkit-appearance: none;\n\n font-family: \"SFUIText-Medium\";\n color: ", ";\n cursor: ", ";\n pointer-events: ", ";\n font-size: 14px;\n padding: 10px 20px 4px 0px;\n display: block;\n \n &:disabled:hover {\n border-color: ", ";\n }\n &:disabled {\n border-color: ", ";\n color: ", ";\n }\n &:focus {\n outline: none;\n }\n &::placeholder {\n color: ", ";\n opacity: ", ";\n transition: 0.2s ease all;\n }\n &:focus::placeholder {\n color: ", ";\n\n opacity: ", ";\n }\n }\n\n .form-input {\n border-bottom: 1px solid\n ", ";\n \n &:hover {\n border-color: ", ";\n }\n position: relative;\n margin-top: 20px;\n display: flex;\n align-items:center;\n .calender-icon {\n cursor: pointer;\n path {\n fill-rule:evenodd;\n clip-rule:evenodd;\n }\n }\n\n .clear-icon {\n position: absolute;\n right: 0px;\n bottom: 6px;\n cursor: pointer;\n path {\n fill: #ef5350;\n }\n }\n }\n .form-input label {\n color: ", ";\n font-size: 14px;\n font-family: \"SFUIText-Regular\";\n position: ", ";\n pointer-events: none;\n text-transform: none;\n left: 0px;\n top: ", ";\n transition: 0.2s ease all;\n -moz-transition: 0.2s ease all;\n -webkit-transition: 0.2s ease all;\n }\n\n .form-input label.floaton {\n top: ", ";\n left: 0px;\n font-size: 10px;\n color: ", ";\n text-transform: capitalize;\n }\n\n /* ======Date picker====== */\n\n &.ardp-date-picker {\n font-size: 16px;\n font-family: \"SFUIText-Regular\";\n box-sizing: border-box;\n position: relative;\n }\n &.ardp-date-picker * {\n box-sizing: border-box;\n }\n &.ardp-date-picker div.calendar {\n position: ", ";\n z-index: ", ";\n background: ", ";\n width: 300px;\n border-radius: 0px;\n height: auto;\n overflow: hidden;\n border: 1px solid\n ", ";\n }\n\n &.ardp-date-picker div.calendar:after,\n &.ardp-date-picker div.calendar:before {\n display: table;\n content: \" \";\n box-sizing: border-box;\n }\n\n &.ardp-date-picker div.calendar.calendar-show {\n visibility: visible;\n opacity: 1;\n transition: opacity 100ms linear;\n }\n &.ardp-date-picker div.calendar.calendar-hide {\n visibility: ", ";\n opacity: ", ";\n transition: visibility 0s 100ms, opacity 100ms linear;\n }\n\n &.ardp-date-picker div.calendar div.month-header {\n float: left;\n width: 100%;\n display: flex;\n justify-content: space-between;\n align-items: baseline;\n padding: 10px;\n border-bottom: 1px solid\n ", ";\n }\n &.ardp-date-picker div.calendar div.month-header > span > i {\n cursor: pointer;\n padding: 6px;\n border-radius: 50%;\n width: 25px;\n text-align: center;\n height: 25px;\n border-radius: 18px;\n background-color: ", ";\n ;\n }\n &.ardp-date-picker div.calendar div.month-header > span > i:hover {\n path {\n stroke: ", ";\n }\n }\n &.ardp-date-picker div.calendar div.month-header > span > i > svg {\n path {\n fill: transparent;\n }\n }\n &.ardp-date-picker div.calendar div.month-header > span.month-header-text {\n color: ", ";\n width: 150px;\n text-align: center;\n }\n &.ardp-date-picker\n div.calendar\n div.month-header\n > span.month-header-text\n > .month-text {\n font-family: \"SFUIText-Medium\";\n color: ", ";\n text-transform: uppercase;\n }\n\n &.ardp-date-picker div.calendar div.week-header {\n float: left;\n width: 100%;\n display: block;\n padding: 10px 3px;\n }\n &.ardp-date-picker div.calendar div.week-header > span {\n float: left;\n width: 14.285714285714286%;\n font-size: 14px;\n text-transform: uppercase;\n color: ", ";\n text-align: center;\n }\n &.ardp-date-picker div.calendar div.weeks {\n float: left;\n width: 100%;\n overflow: hidden;\n position: relative;\n padding: 5px 0px;\n }\n &.ardp-date-picker div.calendar div.weeks > div {\n width: 300px;\n }\n &.ardp-date-picker div.calendar div.weeks > div.current {\n left: 0;\n }\n &.ardp-date-picker div.calendar div.weeks > div.other {\n left: 300px;\n position: absolute;\n }\n &.ardp-date-picker div.calendar div.weeks > div.other.right {\n left: -300px;\n }\n &.ardp-date-picker div.calendar div.weeks > div.sliding {\n transition: transform 250ms ease;\n -webkit-transition: -webkit-transform 250ms ease;\n }\n &.ardp-date-picker div.calendar div.weeks > div.sliding.left {\n transform: translate3d(-300px, 0, 0);\n -webkit-transform: translate3d(-300px, 0, 0);\n }\n &.ardp-date-picker div.calendar div.weeks > div.sliding.right {\n transform: translate3d(300px, 0, 0);\n -webkit-transform: translate3d(300px, 0, 0);\n }\n &.ardp-date-picker div.calendar div.weeks div.week {\n float: left;\n width: 100%;\n margin: 5px 0px;\n }\n &.ardp-date-picker div.calendar div.weeks div.week div.day {\n float: left;\n width: 14.285714285714286%;\n font-size: 14px;\n text-align: center;\n /* padding: 2px 0px; */\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day > span {\n //padding: 11px 0px 5px;\n display: inline-block;\n border-radius: 50%;\n height: 30px;\n width: 30px;\n text-align: center;\n border: 1px solid transparent;\n background: ", ";\n color: ", ";\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day > span:hover,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.today\n > span:hover {\n background: ", ";\n cursor: pointer;\n color: ", ";\n }\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.other-month\n > span {\n color: ", ";\n }\n &.ardp-date-picker div.calendar div.weeks div.week div.day.disabled > span,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.disabled\n > span:hover {\n color: ", ";\n cursor: not-allowed;\n background: ", ";\n }\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.other-month.disabled\n > span {\n color: ", ";\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day.today > span {\n border: 1px none\n ", ";\n color: ", ";\n }\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.today.disabled\n > span {\n background: ", ";\n border: 1px solid transparent;\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day.selected > span,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.today\n > span:hover {\n background: ", ";\n color: ", ";\n }\n\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.disabled\n > span,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.disabled\n > span:hover {\n background: ", ";\n }\n\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.range-start {\n background: ", ";\n\n border-top-left-radius: 30px;\n border-bottom-left-radius: 30px;\n\n & > span {\n background: transparent;\n border-top-right-radius: 0px;\n border-bottom-right-radius: 0px;\n }\n }\n\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.range-end {\n background: ", ";\n\n border-top-right-radius: 30px;\n border-bottom-right-radius: 30px;\n\n & > span {\n background: transparent;\n border-top-left-radius: 0px;\n border-bottom-left-radius: 0px;\n }\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day.in-selected-range {\n background: ", ";\n & > span {\n background: transparent;\n color: #fff;\n }\n }\n"]),
12
+ var _templateObject = _taggedTemplateLiteral(["\n & div.form-input > input {\n display: ", ";\n }\n\n .form-input input {\n width: 100%;\n box-sizing: border-box;\n\n background: ", ";\n\n border: none;\n border-radius: 0px;\n -webkit-appearance: none;\n\n font-family: \"SFUIText-Medium\";\n color: ", ";\n cursor: ", ";\n pointer-events: ", ";\n font-size: 14px;\n padding: 10px 20px 4px 0px;\n display: block;\n \n &:disabled:hover {\n border-color: ", ";\n }\n &:disabled {\n border-color: ", ";\n color: ", ";\n }\n &:focus {\n outline: none;\n }\n &::placeholder {\n color: ", ";\n opacity: ", ";\n transition: 0.2s ease all;\n }\n &:focus::placeholder {\n color: ", ";\n\n opacity: ", ";\n }\n }\n\n .form-input {\n border-bottom: 1px solid\n ", ";\n \n &:hover {\n border-color: ", ";\n }\n position: relative;\n margin-top: 20px;\n display: flex;\n align-items:center;\n .calender-icon {\n cursor: pointer;\n path {\n fill-rule:evenodd;\n clip-rule:evenodd;\n }\n }\n\n .clear-icon {\n position: absolute;\n right: 0px;\n bottom: 6px;\n cursor: pointer;\n path {\n fill: #ef5350;\n }\n }\n }\n .form-input label {\n color: ", ";\n font-size: 14px;\n font-family: \"SFUIText-Regular\";\n position: ", ";\n pointer-events: none;\n text-transform: none;\n left: 0px;\n top: ", ";\n transition: 0.2s ease all;\n -moz-transition: 0.2s ease all;\n -webkit-transition: 0.2s ease all;\n }\n\n .form-input label.floaton {\n top: ", ";\n left: 0px;\n font-size: 10px;\n color: ", ";\n text-transform: capitalize;\n }\n\n /* ======Date picker====== */\n\n &.ardp-date-picker {\n font-size: 16px;\n font-family: \"SFUIText-Regular\";\n box-sizing: border-box;\n position: relative;\n }\n &.ardp-date-picker * {\n box-sizing: border-box;\n }\n &.ardp-date-picker div.calendar {\n position: ", ";\n z-index: ", ";\n background: ", ";\n width: 300px;\n border-radius: 0px;\n height: auto;\n overflow: hidden;\n border: 1px solid\n ", ";\n }\n\n &.ardp-date-picker div.calendar:after,\n &.ardp-date-picker div.calendar:before {\n display: table;\n content: \" \";\n box-sizing: border-box;\n }\n\n &.ardp-date-picker div.calendar.calendar-show {\n visibility: visible;\n opacity: 1;\n transition: opacity 100ms linear;\n }\n &.ardp-date-picker div.calendar.calendar-hide {\n visibility: ", ";\n opacity: ", ";\n transition: visibility 0s 100ms, opacity 100ms linear;\n }\n\n &.ardp-date-picker div.calendar div.month-header {\n float: left;\n width: 100%;\n display: flex;\n justify-content: space-between;\n align-items: baseline;\n padding: 10px;\n border-bottom: 1px solid\n ", ";\n }\n &.ardp-date-picker div.calendar div.month-header > span > i {\n cursor: pointer;\n padding: 6px;\n border-radius: 50%;\n width: 25px;\n text-align: center;\n height: 25px;\n border-radius: 18px;\n background-color: ", ";\n ;\n }\n &.ardp-date-picker div.calendar div.month-header > span > i:hover {\n path {\n stroke: ", ";\n }\n }\n &.ardp-date-picker div.calendar div.month-header > span > i > svg {\n path {\n fill: transparent;\n }\n }\n &.ardp-date-picker div.calendar div.month-header > span.month-header-text {\n color: ", ";\n width: 150px;\n text-align: center;\n }\n &.ardp-date-picker\n div.calendar\n div.month-header\n > span.month-header-text\n > .month-text {\n font-family: \"SFUIText-Medium\";\n color: ", ";\n text-transform: uppercase;\n }\n\n &.ardp-date-picker div.calendar div.week-header {\n float: left;\n width: 100%;\n display: block;\n padding: 10px 3px;\n }\n &.ardp-date-picker div.calendar div.week-header > span {\n float: left;\n width: 14.285714285714286%;\n font-size: 14px;\n text-transform: uppercase;\n color: ", ";\n text-align: center;\n }\n &.ardp-date-picker div.calendar div.weeks {\n float: left;\n width: 100%;\n overflow: hidden;\n position: relative;\n padding: 5px 0px;\n }\n &.ardp-date-picker div.calendar div.weeks > div {\n width: 300px;\n }\n &.ardp-date-picker div.calendar div.weeks > div.current {\n left: 0;\n }\n &.ardp-date-picker div.calendar div.weeks > div.other {\n left: 300px;\n position: absolute;\n }\n &.ardp-date-picker div.calendar div.weeks > div.other.right {\n left: -300px;\n }\n &.ardp-date-picker div.calendar div.weeks > div.sliding {\n transition: transform 250ms ease;\n -webkit-transition: -webkit-transform 250ms ease;\n }\n &.ardp-date-picker div.calendar div.weeks > div.sliding.left {\n transform: translate3d(-300px, 0, 0);\n -webkit-transform: translate3d(-300px, 0, 0);\n }\n &.ardp-date-picker div.calendar div.weeks > div.sliding.right {\n transform: translate3d(300px, 0, 0);\n -webkit-transform: translate3d(300px, 0, 0);\n }\n &.ardp-date-picker div.calendar div.weeks div.week {\n float: left;\n width: 100%;\n margin: 5px 0px;\n }\n &.ardp-date-picker div.calendar div.weeks div.week div.day {\n float: left;\n width: 14.285714285714286%;\n font-size: 14px;\n text-align: center;\n /* padding: 2px 0px; */\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day > span {\n //padding: 11px 0px 5px;\n display: inline-block;\n border-radius: 50%;\n height: 30px;\n width: 30px;\n text-align: center;\n border: 1px solid transparent;\n background: ", ";\n color: ", ";\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day > span:hover,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.today\n > span:hover {\n background: ", ";\n cursor: pointer;\n color: ", ";\n }\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.other-month\n > span {\n color: ", ";\n }\n &.ardp-date-picker div.calendar div.weeks div.week div.day.disabled > span,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.disabled\n > span:hover {\n color: ", ";\n cursor: not-allowed;\n background: ", ";\n }\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.other-month.disabled\n > span {\n color: ", ";\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day.today > span {\n border: 1px none\n ", ";\n color: ", ";\n }\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.today.disabled\n > span {\n background: ", ";\n border: 1px solid transparent;\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day.selected > span,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.today\n > span:hover {\n background: ", ";\n color: ", ";\n }\n\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.disabled\n > span,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.disabled\n > span:hover {\n background: ", ";\n }\n\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.range-start {\n background: ", ";\n\n border-top-left-radius: 30px;\n border-bottom-left-radius: 30px;\n\n & > span {\n background: transparent;\n border-top-right-radius: 0px;\n border-bottom-right-radius: 0px;\n }\n }\n\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.range-end {\n background: ", ";\n\n border-top-right-radius: 30px;\n border-bottom-right-radius: 30px;\n\n & > span {\n background: transparent;\n border-top-left-radius: 0px;\n border-bottom-left-radius: 0px;\n }\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day.in-selected-range {\n background: ", ";\n & > span {\n background: transparent;\n color: #fff;\n }\n }\n"], ["\n & div.form-input > input {\n display: ", ";\n }\n\n .form-input input {\n width: 100%;\n box-sizing: border-box;\n\n background: ", ";\n\n border: none;\n border-radius: 0px;\n -webkit-appearance: none;\n\n font-family: \"SFUIText-Medium\";\n color: ", ";\n cursor: ", ";\n pointer-events: ", ";\n font-size: 14px;\n padding: 10px 20px 4px 0px;\n display: block;\n \n &:disabled:hover {\n border-color: ", ";\n }\n &:disabled {\n border-color: ", ";\n color: ", ";\n }\n &:focus {\n outline: none;\n }\n &::placeholder {\n color: ", ";\n opacity: ", ";\n transition: 0.2s ease all;\n }\n &:focus::placeholder {\n color: ", ";\n\n opacity: ", ";\n }\n }\n\n .form-input {\n border-bottom: 1px solid\n ", ";\n \n &:hover {\n border-color: ", ";\n }\n position: relative;\n margin-top: 20px;\n display: flex;\n align-items:center;\n .calender-icon {\n cursor: pointer;\n path {\n fill-rule:evenodd;\n clip-rule:evenodd;\n }\n }\n\n .clear-icon {\n position: absolute;\n right: 0px;\n bottom: 6px;\n cursor: pointer;\n path {\n fill: #ef5350;\n }\n }\n }\n .form-input label {\n color: ", ";\n font-size: 14px;\n font-family: \"SFUIText-Regular\";\n position: ", ";\n pointer-events: none;\n text-transform: none;\n left: 0px;\n top: ", ";\n transition: 0.2s ease all;\n -moz-transition: 0.2s ease all;\n -webkit-transition: 0.2s ease all;\n }\n\n .form-input label.floaton {\n top: ", ";\n left: 0px;\n font-size: 10px;\n color: ", ";\n text-transform: capitalize;\n }\n\n /* ======Date picker====== */\n\n &.ardp-date-picker {\n font-size: 16px;\n font-family: \"SFUIText-Regular\";\n box-sizing: border-box;\n position: relative;\n }\n &.ardp-date-picker * {\n box-sizing: border-box;\n }\n &.ardp-date-picker div.calendar {\n position: ", ";\n z-index: ", ";\n background: ", ";\n width: 300px;\n border-radius: 0px;\n height: auto;\n overflow: hidden;\n border: 1px solid\n ", ";\n }\n\n &.ardp-date-picker div.calendar:after,\n &.ardp-date-picker div.calendar:before {\n display: table;\n content: \" \";\n box-sizing: border-box;\n }\n\n &.ardp-date-picker div.calendar.calendar-show {\n visibility: visible;\n opacity: 1;\n transition: opacity 100ms linear;\n }\n &.ardp-date-picker div.calendar.calendar-hide {\n visibility: ", ";\n opacity: ", ";\n transition: visibility 0s 100ms, opacity 100ms linear;\n }\n\n &.ardp-date-picker div.calendar div.month-header {\n float: left;\n width: 100%;\n display: flex;\n justify-content: space-between;\n align-items: baseline;\n padding: 10px;\n border-bottom: 1px solid\n ", ";\n }\n &.ardp-date-picker div.calendar div.month-header > span > i {\n cursor: pointer;\n padding: 6px;\n border-radius: 50%;\n width: 25px;\n text-align: center;\n height: 25px;\n border-radius: 18px;\n background-color: ", ";\n ;\n }\n &.ardp-date-picker div.calendar div.month-header > span > i:hover {\n path {\n stroke: ", ";\n }\n }\n &.ardp-date-picker div.calendar div.month-header > span > i > svg {\n path {\n fill: transparent;\n }\n }\n &.ardp-date-picker div.calendar div.month-header > span.month-header-text {\n color: ", ";\n width: 150px;\n text-align: center;\n }\n &.ardp-date-picker\n div.calendar\n div.month-header\n > span.month-header-text\n > .month-text {\n font-family: \"SFUIText-Medium\";\n color: ", ";\n text-transform: uppercase;\n }\n\n &.ardp-date-picker div.calendar div.week-header {\n float: left;\n width: 100%;\n display: block;\n padding: 10px 3px;\n }\n &.ardp-date-picker div.calendar div.week-header > span {\n float: left;\n width: 14.285714285714286%;\n font-size: 14px;\n text-transform: uppercase;\n color: ", ";\n text-align: center;\n }\n &.ardp-date-picker div.calendar div.weeks {\n float: left;\n width: 100%;\n overflow: hidden;\n position: relative;\n padding: 5px 0px;\n }\n &.ardp-date-picker div.calendar div.weeks > div {\n width: 300px;\n }\n &.ardp-date-picker div.calendar div.weeks > div.current {\n left: 0;\n }\n &.ardp-date-picker div.calendar div.weeks > div.other {\n left: 300px;\n position: absolute;\n }\n &.ardp-date-picker div.calendar div.weeks > div.other.right {\n left: -300px;\n }\n &.ardp-date-picker div.calendar div.weeks > div.sliding {\n transition: transform 250ms ease;\n -webkit-transition: -webkit-transform 250ms ease;\n }\n &.ardp-date-picker div.calendar div.weeks > div.sliding.left {\n transform: translate3d(-300px, 0, 0);\n -webkit-transform: translate3d(-300px, 0, 0);\n }\n &.ardp-date-picker div.calendar div.weeks > div.sliding.right {\n transform: translate3d(300px, 0, 0);\n -webkit-transform: translate3d(300px, 0, 0);\n }\n &.ardp-date-picker div.calendar div.weeks div.week {\n float: left;\n width: 100%;\n margin: 5px 0px;\n }\n &.ardp-date-picker div.calendar div.weeks div.week div.day {\n float: left;\n width: 14.285714285714286%;\n font-size: 14px;\n text-align: center;\n /* padding: 2px 0px; */\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day > span {\n //padding: 11px 0px 5px;\n display: inline-block;\n border-radius: 50%;\n height: 30px;\n width: 30px;\n text-align: center;\n border: 1px solid transparent;\n background: ", ";\n color: ", ";\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day > span:hover,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.today\n > span:hover {\n background: ", ";\n cursor: pointer;\n color: ", ";\n }\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.other-month\n > span {\n color: ", ";\n }\n &.ardp-date-picker div.calendar div.weeks div.week div.day.disabled > span,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.disabled\n > span:hover {\n color: ", ";\n cursor: not-allowed;\n background: ", ";\n }\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.other-month.disabled\n > span {\n color: ", ";\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day.today > span {\n border: 1px none\n ", ";\n color: ", ";\n }\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.today.disabled\n > span {\n background: ", ";\n border: 1px solid transparent;\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day.selected > span,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.today\n > span:hover {\n background: ", ";\n color: ", ";\n }\n\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.disabled\n > span,\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.disabled\n > span:hover {\n background: ", ";\n }\n\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.range-start {\n background: ", ";\n\n border-top-left-radius: 30px;\n border-bottom-left-radius: 30px;\n\n & > span {\n background: transparent;\n border-top-right-radius: 0px;\n border-bottom-right-radius: 0px;\n }\n }\n\n &.ardp-date-picker\n div.calendar\n div.weeks\n div.week\n div.day.selected.range-end {\n background: ", ";\n\n border-top-right-radius: 30px;\n border-bottom-right-radius: 30px;\n\n & > span {\n background: transparent;\n border-top-left-radius: 0px;\n border-bottom-left-radius: 0px;\n }\n }\n\n &.ardp-date-picker div.calendar div.weeks div.week div.day.in-selected-range {\n background: ", ";\n & > span {\n background: transparent;\n color: #fff;\n }\n }\n"]),
13
13
  _templateObject2 = _taggedTemplateLiteral(["\n color: ", ";\n font-family: 'SFUIText-Medium' !important;\n padding-top: 5px;\n display: inline-block;\n font-size: 12px;\n font-family: inherit;\n width: 100%;\n text-align: left;\n"], ["\n color: ", ";\n font-family: 'SFUIText-Medium' !important;\n padding-top: 5px;\n display: inline-block;\n font-size: 12px;\n font-family: inherit;\n width: 100%;\n text-align: left;\n"]);
14
14
 
15
15
  var _react = require("react");
@@ -41,15 +41,15 @@ function _taggedTemplateLiteral(strings, raw) { return Object.freeze(Object.defi
41
41
  //'@desynova-digital/tokens'
42
42
 
43
43
  var DatePickerInput = _styledComponents2.default.div(_templateObject, function (props) {
44
- return props.inline ? "none" : "block";
44
+ return props.inline ? 'none' : 'block';
45
45
  }, function (props) {
46
46
  return _tokens.colors[props.theme].inputCommon.background;
47
47
  }, function (props) {
48
48
  return _tokens.colors[props.theme].datepicker.selectedColor;
49
49
  }, function (props) {
50
- return props.readOnly ? "not-allowed" : "pointer";
50
+ return props.readOnly ? 'not-allowed' : 'pointer';
51
51
  }, function (props) {
52
- return props.readOnly ? "none" : "all";
52
+ return props.readOnly ? 'none' : 'all';
53
53
  }, function (props) {
54
54
  return _tokens.colors[props.theme].inputCommon.borderDisabled;
55
55
  }, function (props) {
@@ -57,11 +57,11 @@ var DatePickerInput = _styledComponents2.default.div(_templateObject, function (
57
57
  }, function (props) {
58
58
  return _tokens.colors[props.theme].inputCommon.colorDisabled;
59
59
  }, function (props) {
60
- return props.label ? "transparent" : function (props) {
60
+ return props.label ? 'transparent' : function (props) {
61
61
  return _tokens.colors[props.theme].inputCommon.placeholder;
62
62
  };
63
63
  }, function (props) {
64
- return props.label ? "0" : "1";
64
+ return props.label ? '0' : '1';
65
65
  }, function (props) {
66
66
  return props.placeholder ? function (props) {
67
67
  return _tokens.colors[props.theme].inputCommon.placeholder;
@@ -69,41 +69,39 @@ var DatePickerInput = _styledComponents2.default.div(_templateObject, function (
69
69
  return _tokens.colors[props.theme].inputCommon.placeholder;
70
70
  };
71
71
  }, function (props) {
72
- return props.placeholder ? "1" : "1";
72
+ return props.placeholder ? '1' : '1';
73
73
  }, function (props) {
74
74
  if (props.error) {
75
75
  return _tokens.colors[props.theme].inputError.border;
76
- } else {
77
- return _tokens.colors[props.theme].inputCommon.border;
78
76
  }
77
+ return _tokens.colors[props.theme].inputCommon.border;
79
78
  }, function (props) {
80
79
  if (props.error) {
81
80
  return _tokens.colors[props.theme].inputError.borderHover;
82
- } else {
83
- return _tokens.colors[props.theme].inputCommon.borderHover;
84
81
  }
82
+ return _tokens.colors[props.theme].inputCommon.borderHover;
85
83
  }, function (props) {
86
84
  return _tokens.colors[props.theme].inputLabel.color;
87
85
  }, function (props) {
88
- return props.inline ? "relative" : "absolute";
86
+ return props.inline ? 'relative' : 'absolute';
89
87
  }, function (props) {
90
- return props.inline ? "0px" : "10px";
88
+ return props.inline ? '0px' : '10px';
91
89
  }, function (props) {
92
- return props.inline ? "0px" : "-10px;";
90
+ return props.inline ? '0px' : '-10px;';
93
91
  }, function (props) {
94
92
  return _tokens.colors[props.theme].inputLabel.colorOnFocus;
95
93
  }, function (props) {
96
- return props.inline ? "relative" : "absolute";
94
+ return props.inline ? 'relative' : 'absolute';
97
95
  }, function (props) {
98
- return props.inline ? "0" : "10";
96
+ return props.inline ? '0' : '10';
99
97
  }, function (props) {
100
98
  return _tokens.colors[props.theme].datepicker.background;
101
99
  }, function (props) {
102
100
  return _tokens.colors[props.theme].datepicker.calenderBorder;
103
101
  }, function (props) {
104
- return props.inline ? "visible" : "hidden";
102
+ return props.inline ? 'visible' : 'hidden';
105
103
  }, function (props) {
106
- return props.inline ? "1" : "0";
104
+ return props.inline ? '1' : '0';
107
105
  }, function (props) {
108
106
  return _tokens.colors[props.theme].datepicker.monthHeaderBorder;
109
107
  }, function (props) {
@@ -159,35 +157,32 @@ var InputError = _styledComponents2.default.span(_templateObject2, function (pro
159
157
  var DateUtilities = {
160
158
  pad: function pad(value, length) {
161
159
  while (value.length < length) {
162
- value = "0" + value;
160
+ value = '0' + value;
163
161
  }return value;
164
162
  },
165
-
166
163
  clone: function clone(date) {
167
- return new Date(date.getFullYear(), date.getMonth(), date.getDate(), 0, 0, 0, 0);
164
+ if (date) {
165
+ return new Date(date.getFullYear(), date.getMonth(), date.getDate(), 0, 0, 0, 0);
166
+ }
167
+ return null;
168
168
  },
169
-
170
169
  toString: function toString(date) {
171
170
  if (date) {
172
- return DateUtilities.pad(date.getDate().toString(), 2) + "/" + DateUtilities.pad((date.getMonth() + 1).toString(), 2) + "/" + date.getFullYear();
173
- } else {
174
- return "";
171
+ return DateUtilities.pad(date.getDate().toString(), 2) + '/' + DateUtilities.pad((date.getMonth() + 1).toString(), 2) + '/' + date.getFullYear();
175
172
  }
173
+ return '';
176
174
  },
177
-
178
175
  toDayOfMonthString: function toDayOfMonthString(date) {
179
176
  return DateUtilities.pad(date.getDate().toString());
180
177
  },
181
-
182
178
  toMonthAndYearString: function toMonthAndYearString(date) {
183
- var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
179
+ var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
184
180
  return {
185
- monthYear: months[date.getMonth()] + " " + date.getFullYear(),
181
+ monthYear: months[date.getMonth()] + ' ' + date.getFullYear(),
186
182
  month: months[date.getMonth()],
187
183
  year: date.getFullYear()
188
184
  };
189
185
  },
190
-
191
186
  moveToDayOfWeek: function moveToDayOfWeek(date, dayOfWeek, lookForward) {
192
187
  while (date.getDay() !== dayOfWeek) {
193
188
  if (lookForward) {
@@ -198,28 +193,26 @@ var DateUtilities = {
198
193
  }
199
194
  return date;
200
195
  },
201
-
202
196
  isSameDay: function isSameDay(first, second) {
203
197
  return first.getFullYear() === second.getFullYear() && first.getMonth() === second.getMonth() && first.getDate() === second.getDate();
204
198
  },
205
-
206
199
  stringToDate: function stringToDate(date) {
207
- if (typeof date === "string") {
208
- return new Date(date.split("/")[1] + "/" + date.split("/")[0] + "/" + date.split("/")[2]);
209
- } else if (typeof date === "number") {
200
+
201
+ if (typeof date === 'string') {
202
+ return date.trim().length ? new Date(date.split('/')[1] + '/' + date.split('/')[0] + '/' + date.split('/')[2]) : null;
203
+ }if (typeof date === 'number') {
210
204
  return new Date(date);
211
205
  }
212
206
  },
213
207
  isBefore: function isBefore(first, second) {
214
- if (typeof second === "string" || typeof second === "number") {
208
+ if (typeof second === 'string' || typeof second === 'number') {
215
209
  second = DateUtilities.stringToDate(second);
216
210
  }
217
211
 
218
212
  return first.getTime() < second.getTime();
219
213
  },
220
-
221
214
  isAfter: function isAfter(first, second) {
222
- if (typeof second === "string" || typeof second === "number") {
215
+ if (typeof second === 'string' || typeof second === 'number') {
223
216
  second = DateUtilities.stringToDate(second);
224
217
  }
225
218
  return first.getTime() > second.getTime();
@@ -239,20 +232,28 @@ var DatePicker = function (_Component) {
239
232
  var def = null;
240
233
  var view = [new Date(), new Date()];
241
234
  var selectedDates = [];
242
- if (typeof props.selected === "string") {
243
- def = DateUtilities.stringToDate(props.selected);
244
- view[0] = def;
245
- selectedDates = [def];
235
+ if (typeof props.selected === 'string') {
236
+ if (!props.selected.trim()) {
237
+ selectedDates = [];
238
+ view[0] = null;
239
+ } else {
240
+ def = DateUtilities.stringToDate(props.selected);
241
+ view[0] = def;
242
+ selectedDates = [def];
243
+ }
246
244
  } else if (Array.isArray(props.selected)) {
247
245
  selectedDates = props.selected.map(function (dateVal, idx) {
248
- if (typeof dateVal === "number") {
246
+ if (typeof dateVal === 'number') {
249
247
  dateVal = new Date(dateVal);
250
248
  view[idx] = dateVal;
251
-
252
249
  return dateVal;
250
+ }if (typeof dateVal === 'string') {
251
+ if (dateVal.trim()) {
252
+ view[idx] = DateUtilities.stringToDate(dateVal);
253
+ return DateUtilities.stringToDate(dateVal);
254
+ }
253
255
  } else {
254
256
  view[idx] = DateUtilities.stringToDate(dateVal);
255
-
256
257
  return DateUtilities.stringToDate(dateVal);
257
258
  }
258
259
  });
@@ -281,21 +282,23 @@ var DatePicker = function (_Component) {
281
282
  _createClass(DatePicker, [{
282
283
  key: "componentDidMount",
283
284
  value: function componentDidMount() {
284
- document.addEventListener("click", this.hideOnDocumentClick);
285
+ document.addEventListener('click', this.hideOnDocumentClick);
285
286
  }
286
287
  }, {
287
288
  key: "componentWillUnmount",
288
289
  value: function componentWillUnmount() {
289
- document.removeEventListener("click", this.hideOnDocumentClick);
290
+ document.removeEventListener('click', this.hideOnDocumentClick);
290
291
  }
291
292
  }, {
292
293
  key: "hideOnDocumentClick",
293
294
  value: function hideOnDocumentClick(e) {
294
295
  if (
295
- //e.target.className !== 'date-picker-trigger-' + this.state.ids[0] &&
296
- //e.target.className !== 'date-picker-trigger-' + this.state.ids[1] &&
296
+ /*
297
+ * e.target.className !== 'date-picker-trigger-' + this.state.ids[0] &&
298
+ * e.target.className !== 'date-picker-trigger-' + this.state.ids[1] &&
299
+ */
297
300
 
298
- typeof e.target.className === "string" && !e.target.className.includes("date-picker-trigger-") && !(this.parentsHaveClassName(e.target, "ardp-calendar-" + this.state.ids[0]) || this.parentsHaveClassName(e.target, "ardp-calendar-" + this.state.ids[1])) && !(this.parentsHaveClassName(e.target, "date-picker-trigger-" + this.state.ids[0]) || this.parentsHaveClassName(e.target, "date-picker-trigger-" + this.state.ids[1]))) {
301
+ typeof e.target.className === 'string' && !e.target.className.includes('date-picker-trigger-') && !(this.parentsHaveClassName(e.target, 'ardp-calendar-' + this.state.ids[0]) || this.parentsHaveClassName(e.target, 'ardp-calendar-' + this.state.ids[1])) && !(this.parentsHaveClassName(e.target, 'date-picker-trigger-' + this.state.ids[0]) || this.parentsHaveClassName(e.target, 'date-picker-trigger-' + this.state.ids[1]))) {
299
302
  this.hide();
300
303
  }
301
304
  }
@@ -306,14 +309,14 @@ var DatePicker = function (_Component) {
306
309
  return Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1);
307
310
  }
308
311
 
309
- return s4() + s4() + "-" + s4() + "-" + s4() + "-" + s4() + "-" + s4() + s4() + s4();
312
+ return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
310
313
  }
311
314
  }, {
312
315
  key: "parentsHaveClassName",
313
316
  value: function parentsHaveClassName(element, className) {
314
317
  var parent = element;
315
318
  while (parent) {
316
- if (parent.className && typeof parent.className === "string" && parent.className.indexOf(className) > -1) return true;
319
+ if (parent.className && typeof parent.className === 'string' && parent.className.indexOf(className) > -1) return true;
317
320
 
318
321
  parent = parent.parentNode;
319
322
  }
@@ -337,32 +340,39 @@ var DatePicker = function (_Component) {
337
340
 
338
341
  var selectedDateArr = [].concat(_toConsumableArray(this.state.selectedDate));
339
342
 
340
- /*if (dayIdx === 0 && this.state.selectedDate[1]) {
341
- if (!DateUtilities.isBefore(day, this.state.selectedDate[1])) {
342
- selectedDateArr[1] = null
343
- }
344
- }
345
- if(selectedDateArr[0] && this.props.rangePicker){
346
- selectedDateArr[1] = day
347
- }else{
348
- selectedDateArr[0] = day
349
- } */
343
+ /*
344
+ *if (dayIdx === 0 && this.state.selectedDate[1]) {
345
+ *if (!DateUtilities.isBefore(day, this.state.selectedDate[1])) {
346
+ * selectedDateArr[1] = null
347
+ *}
348
+ *}
349
+ *
350
+ *if(selectedDateArr[0] && this.props.rangePicker){
351
+ *selectedDateArr[1] = day
352
+ *}else{
353
+ *selectedDateArr[0] = day
354
+ *}
355
+ */
350
356
 
351
357
  if (this.props.rangePicker) {
352
- // if(selectedDateArr[0]){
353
- // selectedDateArr[1] = day;
354
- // }else{
355
- // selectedDateArr[0] = day;
356
- // }
358
+ /*
359
+ * if(selectedDateArr[0]){
360
+ * selectedDateArr[1] = day;
361
+ * }else{
362
+ * selectedDateArr[0] = day;
363
+ * }
364
+ */
357
365
 
358
366
  if (selectedDateArr[0] && selectedDateArr[1] && this.state.dateSelectionFor == 0 && this.props.datepickerStep != 2) {
359
367
  selectedDateArr[0] = null;
360
368
  selectedDateArr[1] = null;
361
369
  } else {
362
370
  selectedDateArr[this.state.dateSelectionFor] = day;
363
- // if(selectedDateArr[1] && this.state.dateSelectionFor == 0){
364
- // selectedDateArr[1] = null;
365
- // }
371
+ /*
372
+ * if(selectedDateArr[1] && this.state.dateSelectionFor == 0){
373
+ * selectedDateArr[1] = null;
374
+ * }
375
+ */
366
376
  if (selectedDateArr[0] && !selectedDateArr[1] && this.state.dateSelectionFor == 0) {
367
377
  selectedDateArr[1] = day;
368
378
  } else if (this.props.datepickerStep == 2 && this.state.dateSelectionFor == 0) {
@@ -376,11 +386,13 @@ var DatePicker = function (_Component) {
376
386
  }
377
387
  }
378
388
 
379
- /*if(selectedDateArr[1] && DateUtilities.isBefore(selectedDateArr[1], selectedDateArr[0])){
380
- let temp = selectedDateArr[0];
381
- selectedDateArr[0] = selectedDateArr[1];
382
- selectedDateArr[1] = temp;
383
- } */
389
+ /*
390
+ *if(selectedDateArr[1] && DateUtilities.isBefore(selectedDateArr[1], selectedDateArr[0])){
391
+ * let temp = selectedDateArr[0];
392
+ * selectedDateArr[0] = selectedDateArr[1];
393
+ * selectedDateArr[1] = temp;
394
+ *}
395
+ */
384
396
  } else {
385
397
  selectedDateArr[0] = day;
386
398
  }
@@ -408,7 +420,7 @@ var DatePicker = function (_Component) {
408
420
  value: function clearDateValue() {
409
421
  var _this3 = this;
410
422
 
411
- //let selectedDateArr = [...this.state.selectedDate];
423
+ // let selectedDateArr = [...this.state.selectedDate];
412
424
  this.setState({
413
425
  selectedDate: this.props.rangePicker ? [null, null] : [null],
414
426
  dateSelectionFor: 0
@@ -435,10 +447,11 @@ var DatePicker = function (_Component) {
435
447
  left: 0
436
448
  });
437
449
  } else {
438
- var trigger = this.refs.trigger,
439
- rect = trigger.getBoundingClientRect(),
440
- isTopHalf = rect.top > window.innerHeight / 2,
441
- calendarHeight = 203;
450
+ var trigger = this.refs.trigger;
451
+
452
+ var rect = trigger.getBoundingClientRect();
453
+ var isTopHalf = rect.top > window.innerHeight / 2;
454
+ var calendarHeight = 203;
442
455
 
443
456
  this.refs.calendar.show({
444
457
  top: isTopHalf ? rect.top + window.scrollY - calendarHeight - 3 : rect.top + trigger.clientHeight + window.scrollY + 3,
@@ -451,10 +464,10 @@ var DatePicker = function (_Component) {
451
464
  if (this.props.inline) {
452
465
  this.refs.calendar1.show();
453
466
  } else {
454
- var _trigger = this.refs.trigger1,
455
- _rect = _trigger.getBoundingClientRect(),
456
- _isTopHalf = _rect.top > window.innerHeight / 2,
457
- _calendarHeight = 203;
467
+ var _trigger = this.refs.trigger1;
468
+ var _rect = _trigger.getBoundingClientRect();
469
+ var _isTopHalf = _rect.top > window.innerHeight / 2;
470
+ var _calendarHeight = 203;
458
471
 
459
472
  this.refs.calendar1.show({
460
473
  top: _isTopHalf ? _rect.top + window.scrollY - _calendarHeight - 3 : _rect.top + _trigger.clientHeight + window.scrollY + 3,
@@ -488,8 +501,8 @@ var DatePicker = function (_Component) {
488
501
 
489
502
  var dateStr = DateUtilities.toString(this.state.selectedDate[0]);
490
503
  if (this.props.rangePicker && this.state.selectedDate[1]) {
491
- dateStr = dateStr + " - ";
492
- dateStr = dateStr.concat(this.state.selectedDate[1] ? DateUtilities.toString(this.state.selectedDate[1]) : null); //dateStr+ this.state.selectedDate[1]? DateUtilities.toString(this.state.selectedDate[1]):null
504
+ dateStr += ' - ';
505
+ dateStr = dateStr.concat(this.state.selectedDate[1] ? DateUtilities.toString(this.state.selectedDate[1]) : null); // dateStr+ this.state.selectedDate[1]? DateUtilities.toString(this.state.selectedDate[1]):null
493
506
  }
494
507
  return _react2.default.createElement(
495
508
  "div",
@@ -497,7 +510,7 @@ var DatePicker = function (_Component) {
497
510
  _react2.default.createElement(
498
511
  DatePickerInput,
499
512
  _extends({}, this.props, {
500
- className: this.props.className ? "ardp-date-picker " + this.props.className : "ardp-date-picker"
513
+ className: this.props.className ? 'ardp-date-picker ' + this.props.className : 'ardp-date-picker'
501
514
  }),
502
515
  _react2.default.createElement(
503
516
  "div",
@@ -505,9 +518,9 @@ var DatePicker = function (_Component) {
505
518
  this.props.labelAsText ? _react2.default.createElement(
506
519
  "div",
507
520
  {
508
- ref: "trigger",
509
- type: "text",
510
- className: "label-text date-picker-trigger-" + this.state.ids[0],
521
+ ref: 'trigger',
522
+ type: 'text',
523
+ className: 'label-text date-picker-trigger-' + this.state.ids[0],
511
524
  onClick: function onClick() {
512
525
  return _this4.show(0);
513
526
  }
@@ -519,18 +532,18 @@ var DatePicker = function (_Component) {
519
532
  _react2.default.createElement(
520
533
  "label",
521
534
  {
522
- className: DateUtilities.toString(this.state.selectedDate[0]).length > 0 ? "floaton" : ""
535
+ className: DateUtilities.toString(this.state.selectedDate[0]).length > 0 ? 'floaton' : ''
523
536
  },
524
- this.props.label && "" + this.props.label + (this.props.isRequired ? "*" : '')
537
+ this.props.label && "" + this.props.label + (this.props.isRequired ? '*' : '')
525
538
  ),
526
539
  _react2.default.createElement("input", _extends({
527
540
  type: "text",
528
541
  placeholder: this.props.placeholder,
529
542
  theme: this.props.theme
530
543
  }, {
531
- ref: "trigger",
532
- type: "text",
533
- className: "date-picker-trigger-" + this.state.ids[0],
544
+ ref: 'trigger',
545
+ type: 'text',
546
+ className: 'date-picker-trigger-' + this.state.ids[0],
534
547
  readOnly: true,
535
548
  value: dateStr, // ( DateUtilities.toString(this.state.selectedDate[0])+''+ this.state.selectedDate[1]? DateUtilities.toString(this.state.selectedDate[0]):null ),
536
549
  onClick: function onClick() {
@@ -561,13 +574,13 @@ var DatePicker = function (_Component) {
561
574
  }
562
575
  },
563
576
  _react2.default.createElement(_icon2.default, { name: "cross", height: "12", weight: "12" }),
564
- " "
577
+ ' '
565
578
  )
566
579
  ),
567
580
  _react2.default.createElement(Calendar, _extends({
568
581
  theme: this.props.theme
569
582
  }, {
570
- ref: "calendar",
583
+ ref: 'calendar',
571
584
  id: this.state.ids[0],
572
585
  view: this.state.view[0],
573
586
  selected: this.state.selectedDate[0],
@@ -601,20 +614,28 @@ var _initialiseProps = function _initialiseProps() {
601
614
  var def = null;
602
615
  var view = [new Date(), new Date()];
603
616
  var selectedDates = [];
604
- if (typeof newProps.selected === "string") {
605
- def = DateUtilities.stringToDate(newProps.selected);
606
- view[0] = def;
607
- selectedDates = [def];
617
+ if (typeof newProps.selected === 'string') {
618
+ if (!props.selected.trim()) {
619
+ selectedDates = [];
620
+ view[0] = null;
621
+ } else {
622
+ def = DateUtilities.stringToDate(props.selected);
623
+ view[0] = def;
624
+ selectedDates = [def];
625
+ }
608
626
  } else if (Array.isArray(newProps.selected)) {
609
627
  selectedDates = newProps.selected.map(function (dateVal, idx) {
610
- if (typeof dateVal === "number") {
628
+ if (typeof dateVal === 'number') {
611
629
  dateVal = new Date(dateVal);
612
630
  view[idx] = dateVal;
613
-
614
631
  return dateVal;
632
+ }if (typeof dateVal === 'string') {
633
+ if (dateVal.trim()) {
634
+ view[idx] = DateUtilities.stringToDate(dateVal);
635
+ return DateUtilities.stringToDate(dateVal);
636
+ }
615
637
  } else {
616
638
  view[idx] = DateUtilities.stringToDate(dateVal);
617
-
618
639
  return DateUtilities.stringToDate(dateVal);
619
640
  }
620
641
  });
@@ -666,8 +687,10 @@ var Calendar = function (_Component2) {
666
687
  this.setState({
667
688
  visible: true,
668
689
  style: {
669
- // top: position.top,
670
- // left: position.left
690
+ /*
691
+ * top: position.top,
692
+ * left: position.left
693
+ */
671
694
  }
672
695
  });
673
696
  }
@@ -682,14 +705,14 @@ var Calendar = function (_Component2) {
682
705
  return _react2.default.createElement(
683
706
  "div",
684
707
  {
685
- ref: "calendar",
686
- className: "ardp-calendar-" + this.props.id + " calendar" + (this.state.visible ? " calendar-show" : " calendar-hide"),
708
+ ref: 'calendar',
709
+ className: 'ardp-calendar-' + this.props.id + ' calendar' + (this.state.visible ? ' calendar-show' : ' calendar-hide'),
687
710
  style: this.state.style
688
711
  },
689
712
  _react2.default.createElement(MonthHeader, _extends({
690
713
  theme: this.props.theme
691
714
  }, {
692
- ref: "monthHeader",
715
+ ref: 'monthHeader',
693
716
  dateIdx: this.props.dateIdx,
694
717
  view: this.props.view,
695
718
  onMove: this.onMove,
@@ -698,7 +721,7 @@ var Calendar = function (_Component2) {
698
721
  })),
699
722
  _react2.default.createElement(WeekHeader, null),
700
723
  _react2.default.createElement(Weeks, {
701
- ref: "weeks",
724
+ ref: 'weeks',
702
725
  view: this.props.view,
703
726
  selected: this.props.selected,
704
727
  selected2: this.props.selected2,
@@ -789,8 +812,8 @@ var MonthHeader = function (_Component3) {
789
812
  var current = DateUtilities.clone(view);
790
813
  current.setDate(current.getDate() + 7);
791
814
 
792
- var starts = [view],
793
- month = current.getMonth();
815
+ var starts = [view];
816
+ var month = current.getMonth();
794
817
 
795
818
  while (current.getMonth() === month) {
796
819
  starts.push(DateUtilities.clone(current));
@@ -802,9 +825,8 @@ var MonthHeader = function (_Component3) {
802
825
 
803
826
  if (direction) {
804
827
  return this.props.minDate && DateUtilities.isBefore(first, this.props.minDate);
805
- } else {
806
- return this.props.maxDate && DateUtilities.isAfter(last, this.props.maxDate);
807
828
  }
829
+ return this.props.maxDate && DateUtilities.isAfter(last, this.props.maxDate);
808
830
  }
809
831
  }, {
810
832
  key: "render",
@@ -813,53 +835,54 @@ var MonthHeader = function (_Component3) {
813
835
 
814
836
  var enabled = this.state.enabled;
815
837
 
816
- return _react2.default.createElement("div", { className: "month-header" }, _react2.default.createElement("span", {
817
- className: enabled && !this.limitDates(true) ? "prev-month" : "next-month disabled",
838
+
839
+ return _react2.default.createElement('div', { className: 'month-header' }, _react2.default.createElement('span', {
840
+ className: enabled && !this.limitDates(true) ? 'prev-month' : 'next-month disabled',
818
841
  onClick: function onClick() {
819
842
  _this8.limitDates(true) ? null : _this8.moveBackward('year');
820
843
  }
821
844
  }, _react2.default.createElement(_icon2.default, {
822
- name: "angle-left-double",
845
+ name: 'angle-left-double',
823
846
  width: 16,
824
847
  height: 16,
825
848
  color: _tokens.colors[this.props.theme].datepicker.nextPrevIconStroke,
826
849
  stroke: _tokens.colors[this.props.theme].datepicker.nextPrevIconStroke
827
- }, null)), _react2.default.createElement("span", {
828
- className: enabled && !this.limitDates(true) ? "prev-month" : "next-month disabled",
850
+ }, null)), _react2.default.createElement('span', {
851
+ className: enabled && !this.limitDates(true) ? 'prev-month' : 'next-month disabled',
829
852
  onClick: function onClick() {
830
853
  _this8.limitDates(true) ? null : _this8.moveBackward('month');
831
854
  }
832
855
  }, _react2.default.createElement(_icon2.default, {
833
- name: "angle-left",
856
+ name: 'angle-left',
834
857
  width: 8,
835
858
  height: 16,
836
859
  stroke: _tokens.colors[this.props.theme].datepicker.nextPrevIconStroke
837
- }, null)), _react2.default.createElement("span", { className: "month-header-text" }, _react2.default.createElement(
860
+ }, null)), _react2.default.createElement('span', { className: 'month-header-text' }, _react2.default.createElement(
838
861
  "span",
839
862
  { className: "month-text" },
840
863
  DateUtilities.toMonthAndYearString(this.state.view).month
841
864
  ), _react2.default.createElement(
842
865
  "span",
843
866
  { className: "year-text" },
844
- " ",
867
+ ' ',
845
868
  DateUtilities.toMonthAndYearString(this.state.view).year
846
- )), _react2.default.createElement("span", {
847
- className: enabled && !this.limitDates(false) ? "next-month" : "next-month disabled",
869
+ )), _react2.default.createElement('span', {
870
+ className: enabled && !this.limitDates(false) ? 'next-month' : 'next-month disabled',
848
871
  onClick: function onClick() {
849
872
  _this8.limitDates(false) ? null : _this8.moveForward('month');
850
873
  }
851
874
  }, _react2.default.createElement(_icon2.default, {
852
- name: "angle-right",
875
+ name: 'angle-right',
853
876
  width: 8,
854
877
  height: 16,
855
878
  stroke: _tokens.colors[this.props.theme].datepicker.nextPrevIconStroke
856
- }, null)), _react2.default.createElement("span", {
857
- className: enabled && !this.limitDates(false) ? "next-month" : "next-month disabled",
879
+ }, null)), _react2.default.createElement('span', {
880
+ className: enabled && !this.limitDates(false) ? 'next-month' : 'next-month disabled',
858
881
  onClick: function onClick() {
859
882
  _this8.limitDates(false) ? null : _this8.moveForward('year');
860
883
  }
861
884
  }, _react2.default.createElement(_icon2.default, {
862
- name: "angle-right-double",
885
+ name: 'angle-right-double',
863
886
  color: _tokens.colors[this.props.theme].datepicker.nextPrevIconStroke,
864
887
  width: 16,
865
888
  height: 16,
@@ -870,9 +893,11 @@ var MonthHeader = function (_Component3) {
870
893
  key: "getDerivedStateFromProps",
871
894
  value: function getDerivedStateFromProps(props, state) {
872
895
  if (props.dateIdx === 1 && props.minDate && (props.minDate.getMonth() !== state.view.getMonth() || props.minDate.getFullYear() !== state.view.getFullYear())) {
873
- // return {
874
- // view: DateUtilities.clone(props.minDate)
875
- // }
896
+ /*
897
+ * return {
898
+ * view: DateUtilities.clone(props.minDate)
899
+ * }
900
+ */
876
901
  }
877
902
  return null;
878
903
  }
@@ -893,7 +918,7 @@ var WeekHeader = function (_Component4) {
893
918
  _createClass(WeekHeader, [{
894
919
  key: "render",
895
920
  value: function render() {
896
- return _react2.default.createElement("div", { className: "week-header" }, _react2.default.createElement("span", null, "Sun"), _react2.default.createElement("span", null, "Mon"), _react2.default.createElement("span", null, "Tue"), _react2.default.createElement("span", null, "Wed"), _react2.default.createElement("span", null, "Thu"), _react2.default.createElement("span", null, "Fri"), _react2.default.createElement("span", null, "Sat"));
921
+ return _react2.default.createElement('div', { className: 'week-header' }, _react2.default.createElement('span', null, 'Sun'), _react2.default.createElement('span', null, 'Mon'), _react2.default.createElement('span', null, 'Tue'), _react2.default.createElement('span', null, 'Wed'), _react2.default.createElement('span', null, 'Thu'), _react2.default.createElement('span', null, 'Fri'), _react2.default.createElement('span', null, 'Sat'));
897
922
  }
898
923
  }]);
899
924
 
@@ -923,7 +948,7 @@ var Weeks = function (_Component5) {
923
948
  _createClass(Weeks, [{
924
949
  key: "componentDidMount",
925
950
  value: function componentDidMount() {
926
- this.refs.current.addEventListener("transitionend", this.onTransitionEnd);
951
+ this.refs.current.addEventListener('transitionend', this.onTransitionEnd);
927
952
  }
928
953
  }, {
929
954
  key: "onTransitionEnd",
@@ -944,8 +969,8 @@ var Weeks = function (_Component5) {
944
969
  var current = DateUtilities.clone(view);
945
970
  current.setDate(current.getDate() + 7);
946
971
 
947
- var starts = [view],
948
- month = current.getMonth();
972
+ var starts = [view];
973
+ var month = current.getMonth();
949
974
 
950
975
  while (current.getMonth() === month) {
951
976
  starts.push(DateUtilities.clone(current));
@@ -957,26 +982,26 @@ var Weeks = function (_Component5) {
957
982
  key: "moveTo",
958
983
  value: function moveTo(view, isForward) {
959
984
  this.setState({
960
- sliding: isForward ? "left" : "right",
985
+ sliding: isForward ? 'left' : 'right',
961
986
  other: DateUtilities.clone(view)
962
987
  });
963
988
  }
964
989
  }, {
965
990
  key: "render",
966
991
  value: function render() {
967
- return _react2.default.createElement("div", { className: "weeks" }, _react2.default.createElement("div", {
968
- ref: "current",
969
- className: "current" + (this.state.sliding ? " sliding " + this.state.sliding : "")
970
- }, this.renderWeeks(this.state.view)), _react2.default.createElement("div", {
971
- ref: "other",
972
- className: "other" + (this.state.sliding ? " sliding " + this.state.sliding : "")
992
+ return _react2.default.createElement('div', { className: 'weeks' }, _react2.default.createElement('div', {
993
+ ref: 'current',
994
+ className: 'current' + (this.state.sliding ? ' sliding ' + this.state.sliding : '')
995
+ }, this.renderWeeks(this.state.view)), _react2.default.createElement('div', {
996
+ ref: 'other',
997
+ className: 'other' + (this.state.sliding ? ' sliding ' + this.state.sliding : '')
973
998
  }, this.renderWeeks(this.state.other)));
974
999
  }
975
1000
  }, {
976
1001
  key: "renderWeeks",
977
1002
  value: function renderWeeks(view) {
978
- var starts = this.getWeekStartDates(view),
979
- month = starts[1].getMonth();
1003
+ var starts = this.getWeekStartDates(view);
1004
+ var month = starts[1].getMonth();
980
1005
 
981
1006
  return starts.map(function (s, i) {
982
1007
  return _react2.default.createElement(Week, {
@@ -998,10 +1023,12 @@ var Weeks = function (_Component5) {
998
1023
  key: "getDerivedStateFromProps",
999
1024
  value: function getDerivedStateFromProps(props, state) {
1000
1025
  if (props.dateIdx === 1 && props.minDate && (props.minDate.getMonth() !== state.view.getMonth() || props.minDate.getFullYear() !== state.view.getFullYear())) {
1001
- // return {
1002
- // view: DateUtilities.clone(props.minDate),
1003
- // other: DateUtilities.clone(props.minDate)
1004
- // }
1026
+ /*
1027
+ * return {
1028
+ * view: DateUtilities.clone(props.minDate),
1029
+ * other: DateUtilities.clone(props.minDate)
1030
+ * }
1031
+ */
1005
1032
  }
1006
1033
  return null;
1007
1034
  }
@@ -1029,8 +1056,8 @@ var Week = function (_Component6) {
1029
1056
  _createClass(Week, [{
1030
1057
  key: "buildDays",
1031
1058
  value: function buildDays(start) {
1032
- var days = [DateUtilities.clone(start)],
1033
- clone = DateUtilities.clone(start);
1059
+ var days = [DateUtilities.clone(start)];
1060
+ var clone = DateUtilities.clone(start);
1034
1061
  for (var i = 1; i <= 6; i++) {
1035
1062
  clone = DateUtilities.clone(clone);
1036
1063
  clone.setDate(clone.getDate() + 1);
@@ -1046,19 +1073,19 @@ var Week = function (_Component6) {
1046
1073
  }, {
1047
1074
  key: "getDayClassName",
1048
1075
  value: function getDayClassName(day) {
1049
- var className = "day";
1050
- if (DateUtilities.isSameDay(day, new Date())) className += " today";
1051
- if (this.props.month !== day.getMonth()) className += " other-month";
1076
+ var className = 'day';
1077
+ if (DateUtilities.isSameDay(day, new Date())) className += ' today';
1078
+ if (this.props.month !== day.getMonth()) className += ' other-month';
1052
1079
  if (this.props.selected && DateUtilities.isSameDay(day, this.props.selected)) {
1053
- className += this.props.rangePicker ? " selected range-start" : " selected";
1080
+ className += this.props.rangePicker ? ' selected range-start' : ' selected';
1054
1081
  }
1055
1082
  if (this.props.selected2 && DateUtilities.isSameDay(day, this.props.selected2)) {
1056
- className += this.props.rangePicker ? " selected range-end" : " selected";
1083
+ className += this.props.rangePicker ? ' selected range-end' : ' selected';
1057
1084
  }
1058
1085
  if (this.props.selected && this.props.selected2 && DateUtilities.isAfter(day, this.props.selected) && DateUtilities.isBefore(day, this.props.selected2)) {
1059
- className += " in-selected-range";
1086
+ className += ' in-selected-range';
1060
1087
  }
1061
- if (this.isDisabled(day)) className += " disabled";
1088
+ if (this.isDisabled(day)) className += ' disabled';
1062
1089
  return className;
1063
1090
  }
1064
1091
  }, {
@@ -1071,8 +1098,9 @@ var Week = function (_Component6) {
1071
1098
  }, {
1072
1099
  key: "isDisabled",
1073
1100
  value: function isDisabled(day) {
1074
- var minDate = this.props.minDate,
1075
- maxDate = this.props.maxDate;
1101
+ var minDate = this.props.minDate;
1102
+ var maxDate = this.props.maxDate;
1103
+
1076
1104
 
1077
1105
  return minDate && DateUtilities.isBefore(day, minDate) || maxDate && DateUtilities.isAfter(day, maxDate) || this.isDateFromDisabled(day);
1078
1106
  }
@@ -1091,10 +1119,10 @@ var Week = function (_Component6) {
1091
1119
  key: "render",
1092
1120
  value: function render() {
1093
1121
  var days = this.buildDays(this.props.start);
1094
- return _react2.default.createElement("div", { className: "week" }, days.map(function (day, i) {
1122
+ return _react2.default.createElement('div', { className: 'week' }, days.map(function (day, i) {
1095
1123
  var _this12 = this;
1096
1124
 
1097
- return _react2.default.createElement("div", {
1125
+ return _react2.default.createElement('div', {
1098
1126
  key: i,
1099
1127
  onClick: function onClick() {
1100
1128
  _this12.onSelect(day);
@@ -1114,10 +1142,10 @@ var Week = function (_Component6) {
1114
1142
  }(_react.Component);
1115
1143
 
1116
1144
  DatePicker.defaultProps = {
1117
- theme: "light",
1145
+ theme: 'light',
1118
1146
  inline: false,
1119
1147
  rangePicker: false,
1120
- defaultSelcted: "",
1148
+ defaultSelcted: '',
1121
1149
  disabledDates: []
1122
1150
  };
1123
1151
 
package/package.json CHANGED
@@ -1,13 +1,13 @@
1
1
  {
2
2
  "name": "@desynova-digital/components",
3
- "version": "8.19.47",
3
+ "version": "8.19.49",
4
4
  "description": "Components for Desynova Digital",
5
5
  "main": "index.js",
6
6
  "author": "desynova-digital",
7
7
  "license": "MIT",
8
8
  "repository": "desynova-digital",
9
9
  "dependencies": {
10
- "@desynova-digital/tokens": "8.19.47",
10
+ "@desynova-digital/tokens": "8.19.49",
11
11
  "prop-types": "^15.7.2",
12
12
  "styled-components": "^4.3.2"
13
13
  },