@desynova-digital/components 8.19.47 → 8.19.48

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 +183 -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,23 @@ 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;
253
- } else {
250
+ }if (dateVal.trim()) {
254
251
  view[idx] = DateUtilities.stringToDate(dateVal);
255
-
256
252
  return DateUtilities.stringToDate(dateVal);
257
253
  }
258
254
  });
@@ -281,21 +277,23 @@ var DatePicker = function (_Component) {
281
277
  _createClass(DatePicker, [{
282
278
  key: "componentDidMount",
283
279
  value: function componentDidMount() {
284
- document.addEventListener("click", this.hideOnDocumentClick);
280
+ document.addEventListener('click', this.hideOnDocumentClick);
285
281
  }
286
282
  }, {
287
283
  key: "componentWillUnmount",
288
284
  value: function componentWillUnmount() {
289
- document.removeEventListener("click", this.hideOnDocumentClick);
285
+ document.removeEventListener('click', this.hideOnDocumentClick);
290
286
  }
291
287
  }, {
292
288
  key: "hideOnDocumentClick",
293
289
  value: function hideOnDocumentClick(e) {
294
290
  if (
295
- //e.target.className !== 'date-picker-trigger-' + this.state.ids[0] &&
296
- //e.target.className !== 'date-picker-trigger-' + this.state.ids[1] &&
291
+ /*
292
+ * e.target.className !== 'date-picker-trigger-' + this.state.ids[0] &&
293
+ * e.target.className !== 'date-picker-trigger-' + this.state.ids[1] &&
294
+ */
297
295
 
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]))) {
296
+ 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
297
  this.hide();
300
298
  }
301
299
  }
@@ -306,14 +304,14 @@ var DatePicker = function (_Component) {
306
304
  return Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1);
307
305
  }
308
306
 
309
- return s4() + s4() + "-" + s4() + "-" + s4() + "-" + s4() + "-" + s4() + s4() + s4();
307
+ return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
310
308
  }
311
309
  }, {
312
310
  key: "parentsHaveClassName",
313
311
  value: function parentsHaveClassName(element, className) {
314
312
  var parent = element;
315
313
  while (parent) {
316
- if (parent.className && typeof parent.className === "string" && parent.className.indexOf(className) > -1) return true;
314
+ if (parent.className && typeof parent.className === 'string' && parent.className.indexOf(className) > -1) return true;
317
315
 
318
316
  parent = parent.parentNode;
319
317
  }
@@ -337,32 +335,39 @@ var DatePicker = function (_Component) {
337
335
 
338
336
  var selectedDateArr = [].concat(_toConsumableArray(this.state.selectedDate));
339
337
 
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
- } */
338
+ /*
339
+ *if (dayIdx === 0 && this.state.selectedDate[1]) {
340
+ *if (!DateUtilities.isBefore(day, this.state.selectedDate[1])) {
341
+ * selectedDateArr[1] = null
342
+ *}
343
+ *}
344
+ *
345
+ *if(selectedDateArr[0] && this.props.rangePicker){
346
+ *selectedDateArr[1] = day
347
+ *}else{
348
+ *selectedDateArr[0] = day
349
+ *}
350
+ */
350
351
 
351
352
  if (this.props.rangePicker) {
352
- // if(selectedDateArr[0]){
353
- // selectedDateArr[1] = day;
354
- // }else{
355
- // selectedDateArr[0] = day;
356
- // }
353
+ /*
354
+ * if(selectedDateArr[0]){
355
+ * selectedDateArr[1] = day;
356
+ * }else{
357
+ * selectedDateArr[0] = day;
358
+ * }
359
+ */
357
360
 
358
361
  if (selectedDateArr[0] && selectedDateArr[1] && this.state.dateSelectionFor == 0 && this.props.datepickerStep != 2) {
359
362
  selectedDateArr[0] = null;
360
363
  selectedDateArr[1] = null;
361
364
  } else {
362
365
  selectedDateArr[this.state.dateSelectionFor] = day;
363
- // if(selectedDateArr[1] && this.state.dateSelectionFor == 0){
364
- // selectedDateArr[1] = null;
365
- // }
366
+ /*
367
+ * if(selectedDateArr[1] && this.state.dateSelectionFor == 0){
368
+ * selectedDateArr[1] = null;
369
+ * }
370
+ */
366
371
  if (selectedDateArr[0] && !selectedDateArr[1] && this.state.dateSelectionFor == 0) {
367
372
  selectedDateArr[1] = day;
368
373
  } else if (this.props.datepickerStep == 2 && this.state.dateSelectionFor == 0) {
@@ -376,11 +381,13 @@ var DatePicker = function (_Component) {
376
381
  }
377
382
  }
378
383
 
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
- } */
384
+ /*
385
+ *if(selectedDateArr[1] && DateUtilities.isBefore(selectedDateArr[1], selectedDateArr[0])){
386
+ * let temp = selectedDateArr[0];
387
+ * selectedDateArr[0] = selectedDateArr[1];
388
+ * selectedDateArr[1] = temp;
389
+ *}
390
+ */
384
391
  } else {
385
392
  selectedDateArr[0] = day;
386
393
  }
@@ -408,7 +415,7 @@ var DatePicker = function (_Component) {
408
415
  value: function clearDateValue() {
409
416
  var _this3 = this;
410
417
 
411
- //let selectedDateArr = [...this.state.selectedDate];
418
+ // let selectedDateArr = [...this.state.selectedDate];
412
419
  this.setState({
413
420
  selectedDate: this.props.rangePicker ? [null, null] : [null],
414
421
  dateSelectionFor: 0
@@ -435,10 +442,11 @@ var DatePicker = function (_Component) {
435
442
  left: 0
436
443
  });
437
444
  } else {
438
- var trigger = this.refs.trigger,
439
- rect = trigger.getBoundingClientRect(),
440
- isTopHalf = rect.top > window.innerHeight / 2,
441
- calendarHeight = 203;
445
+ var trigger = this.refs.trigger;
446
+
447
+ var rect = trigger.getBoundingClientRect();
448
+ var isTopHalf = rect.top > window.innerHeight / 2;
449
+ var calendarHeight = 203;
442
450
 
443
451
  this.refs.calendar.show({
444
452
  top: isTopHalf ? rect.top + window.scrollY - calendarHeight - 3 : rect.top + trigger.clientHeight + window.scrollY + 3,
@@ -451,10 +459,10 @@ var DatePicker = function (_Component) {
451
459
  if (this.props.inline) {
452
460
  this.refs.calendar1.show();
453
461
  } else {
454
- var _trigger = this.refs.trigger1,
455
- _rect = _trigger.getBoundingClientRect(),
456
- _isTopHalf = _rect.top > window.innerHeight / 2,
457
- _calendarHeight = 203;
462
+ var _trigger = this.refs.trigger1;
463
+ var _rect = _trigger.getBoundingClientRect();
464
+ var _isTopHalf = _rect.top > window.innerHeight / 2;
465
+ var _calendarHeight = 203;
458
466
 
459
467
  this.refs.calendar1.show({
460
468
  top: _isTopHalf ? _rect.top + window.scrollY - _calendarHeight - 3 : _rect.top + _trigger.clientHeight + window.scrollY + 3,
@@ -488,8 +496,8 @@ var DatePicker = function (_Component) {
488
496
 
489
497
  var dateStr = DateUtilities.toString(this.state.selectedDate[0]);
490
498
  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
499
+ dateStr += ' - ';
500
+ 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
501
  }
494
502
  return _react2.default.createElement(
495
503
  "div",
@@ -497,7 +505,7 @@ var DatePicker = function (_Component) {
497
505
  _react2.default.createElement(
498
506
  DatePickerInput,
499
507
  _extends({}, this.props, {
500
- className: this.props.className ? "ardp-date-picker " + this.props.className : "ardp-date-picker"
508
+ className: this.props.className ? 'ardp-date-picker ' + this.props.className : 'ardp-date-picker'
501
509
  }),
502
510
  _react2.default.createElement(
503
511
  "div",
@@ -505,9 +513,9 @@ var DatePicker = function (_Component) {
505
513
  this.props.labelAsText ? _react2.default.createElement(
506
514
  "div",
507
515
  {
508
- ref: "trigger",
509
- type: "text",
510
- className: "label-text date-picker-trigger-" + this.state.ids[0],
516
+ ref: 'trigger',
517
+ type: 'text',
518
+ className: 'label-text date-picker-trigger-' + this.state.ids[0],
511
519
  onClick: function onClick() {
512
520
  return _this4.show(0);
513
521
  }
@@ -519,18 +527,18 @@ var DatePicker = function (_Component) {
519
527
  _react2.default.createElement(
520
528
  "label",
521
529
  {
522
- className: DateUtilities.toString(this.state.selectedDate[0]).length > 0 ? "floaton" : ""
530
+ className: DateUtilities.toString(this.state.selectedDate[0]).length > 0 ? 'floaton' : ''
523
531
  },
524
- this.props.label && "" + this.props.label + (this.props.isRequired ? "*" : '')
532
+ this.props.label && "" + this.props.label + (this.props.isRequired ? '*' : '')
525
533
  ),
526
534
  _react2.default.createElement("input", _extends({
527
535
  type: "text",
528
536
  placeholder: this.props.placeholder,
529
537
  theme: this.props.theme
530
538
  }, {
531
- ref: "trigger",
532
- type: "text",
533
- className: "date-picker-trigger-" + this.state.ids[0],
539
+ ref: 'trigger',
540
+ type: 'text',
541
+ className: 'date-picker-trigger-' + this.state.ids[0],
534
542
  readOnly: true,
535
543
  value: dateStr, // ( DateUtilities.toString(this.state.selectedDate[0])+''+ this.state.selectedDate[1]? DateUtilities.toString(this.state.selectedDate[0]):null ),
536
544
  onClick: function onClick() {
@@ -561,13 +569,13 @@ var DatePicker = function (_Component) {
561
569
  }
562
570
  },
563
571
  _react2.default.createElement(_icon2.default, { name: "cross", height: "12", weight: "12" }),
564
- " "
572
+ ' '
565
573
  )
566
574
  ),
567
575
  _react2.default.createElement(Calendar, _extends({
568
576
  theme: this.props.theme
569
577
  }, {
570
- ref: "calendar",
578
+ ref: 'calendar',
571
579
  id: this.state.ids[0],
572
580
  view: this.state.view[0],
573
581
  selected: this.state.selectedDate[0],
@@ -601,18 +609,23 @@ var _initialiseProps = function _initialiseProps() {
601
609
  var def = null;
602
610
  var view = [new Date(), new Date()];
603
611
  var selectedDates = [];
604
- if (typeof newProps.selected === "string") {
605
- def = DateUtilities.stringToDate(newProps.selected);
606
- view[0] = def;
607
- selectedDates = [def];
612
+ if (typeof newProps.selected === 'string') {
613
+ if (!props.selected.trim()) {
614
+ selectedDates = [];
615
+ view[0] = null;
616
+ } else {
617
+ def = DateUtilities.stringToDate(props.selected);
618
+ view[0] = def;
619
+ selectedDates = [def];
620
+ }
608
621
  } else if (Array.isArray(newProps.selected)) {
609
622
  selectedDates = newProps.selected.map(function (dateVal, idx) {
610
- if (typeof dateVal === "number") {
623
+ if (typeof dateVal === 'number') {
611
624
  dateVal = new Date(dateVal);
612
625
  view[idx] = dateVal;
613
626
 
614
627
  return dateVal;
615
- } else {
628
+ }if (dateVal.trim()) {
616
629
  view[idx] = DateUtilities.stringToDate(dateVal);
617
630
 
618
631
  return DateUtilities.stringToDate(dateVal);
@@ -666,8 +679,10 @@ var Calendar = function (_Component2) {
666
679
  this.setState({
667
680
  visible: true,
668
681
  style: {
669
- // top: position.top,
670
- // left: position.left
682
+ /*
683
+ * top: position.top,
684
+ * left: position.left
685
+ */
671
686
  }
672
687
  });
673
688
  }
@@ -682,14 +697,14 @@ var Calendar = function (_Component2) {
682
697
  return _react2.default.createElement(
683
698
  "div",
684
699
  {
685
- ref: "calendar",
686
- className: "ardp-calendar-" + this.props.id + " calendar" + (this.state.visible ? " calendar-show" : " calendar-hide"),
700
+ ref: 'calendar',
701
+ className: 'ardp-calendar-' + this.props.id + ' calendar' + (this.state.visible ? ' calendar-show' : ' calendar-hide'),
687
702
  style: this.state.style
688
703
  },
689
704
  _react2.default.createElement(MonthHeader, _extends({
690
705
  theme: this.props.theme
691
706
  }, {
692
- ref: "monthHeader",
707
+ ref: 'monthHeader',
693
708
  dateIdx: this.props.dateIdx,
694
709
  view: this.props.view,
695
710
  onMove: this.onMove,
@@ -698,7 +713,7 @@ var Calendar = function (_Component2) {
698
713
  })),
699
714
  _react2.default.createElement(WeekHeader, null),
700
715
  _react2.default.createElement(Weeks, {
701
- ref: "weeks",
716
+ ref: 'weeks',
702
717
  view: this.props.view,
703
718
  selected: this.props.selected,
704
719
  selected2: this.props.selected2,
@@ -789,8 +804,8 @@ var MonthHeader = function (_Component3) {
789
804
  var current = DateUtilities.clone(view);
790
805
  current.setDate(current.getDate() + 7);
791
806
 
792
- var starts = [view],
793
- month = current.getMonth();
807
+ var starts = [view];
808
+ var month = current.getMonth();
794
809
 
795
810
  while (current.getMonth() === month) {
796
811
  starts.push(DateUtilities.clone(current));
@@ -802,9 +817,8 @@ var MonthHeader = function (_Component3) {
802
817
 
803
818
  if (direction) {
804
819
  return this.props.minDate && DateUtilities.isBefore(first, this.props.minDate);
805
- } else {
806
- return this.props.maxDate && DateUtilities.isAfter(last, this.props.maxDate);
807
820
  }
821
+ return this.props.maxDate && DateUtilities.isAfter(last, this.props.maxDate);
808
822
  }
809
823
  }, {
810
824
  key: "render",
@@ -813,53 +827,54 @@ var MonthHeader = function (_Component3) {
813
827
 
814
828
  var enabled = this.state.enabled;
815
829
 
816
- return _react2.default.createElement("div", { className: "month-header" }, _react2.default.createElement("span", {
817
- className: enabled && !this.limitDates(true) ? "prev-month" : "next-month disabled",
830
+
831
+ return _react2.default.createElement('div', { className: 'month-header' }, _react2.default.createElement('span', {
832
+ className: enabled && !this.limitDates(true) ? 'prev-month' : 'next-month disabled',
818
833
  onClick: function onClick() {
819
834
  _this8.limitDates(true) ? null : _this8.moveBackward('year');
820
835
  }
821
836
  }, _react2.default.createElement(_icon2.default, {
822
- name: "angle-left-double",
837
+ name: 'angle-left-double',
823
838
  width: 16,
824
839
  height: 16,
825
840
  color: _tokens.colors[this.props.theme].datepicker.nextPrevIconStroke,
826
841
  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",
842
+ }, null)), _react2.default.createElement('span', {
843
+ className: enabled && !this.limitDates(true) ? 'prev-month' : 'next-month disabled',
829
844
  onClick: function onClick() {
830
845
  _this8.limitDates(true) ? null : _this8.moveBackward('month');
831
846
  }
832
847
  }, _react2.default.createElement(_icon2.default, {
833
- name: "angle-left",
848
+ name: 'angle-left',
834
849
  width: 8,
835
850
  height: 16,
836
851
  stroke: _tokens.colors[this.props.theme].datepicker.nextPrevIconStroke
837
- }, null)), _react2.default.createElement("span", { className: "month-header-text" }, _react2.default.createElement(
852
+ }, null)), _react2.default.createElement('span', { className: 'month-header-text' }, _react2.default.createElement(
838
853
  "span",
839
854
  { className: "month-text" },
840
855
  DateUtilities.toMonthAndYearString(this.state.view).month
841
856
  ), _react2.default.createElement(
842
857
  "span",
843
858
  { className: "year-text" },
844
- " ",
859
+ ' ',
845
860
  DateUtilities.toMonthAndYearString(this.state.view).year
846
- )), _react2.default.createElement("span", {
847
- className: enabled && !this.limitDates(false) ? "next-month" : "next-month disabled",
861
+ )), _react2.default.createElement('span', {
862
+ className: enabled && !this.limitDates(false) ? 'next-month' : 'next-month disabled',
848
863
  onClick: function onClick() {
849
864
  _this8.limitDates(false) ? null : _this8.moveForward('month');
850
865
  }
851
866
  }, _react2.default.createElement(_icon2.default, {
852
- name: "angle-right",
867
+ name: 'angle-right',
853
868
  width: 8,
854
869
  height: 16,
855
870
  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",
871
+ }, null)), _react2.default.createElement('span', {
872
+ className: enabled && !this.limitDates(false) ? 'next-month' : 'next-month disabled',
858
873
  onClick: function onClick() {
859
874
  _this8.limitDates(false) ? null : _this8.moveForward('year');
860
875
  }
861
876
  }, _react2.default.createElement(_icon2.default, {
862
- name: "angle-right-double",
877
+ name: 'angle-right-double',
863
878
  color: _tokens.colors[this.props.theme].datepicker.nextPrevIconStroke,
864
879
  width: 16,
865
880
  height: 16,
@@ -870,9 +885,11 @@ var MonthHeader = function (_Component3) {
870
885
  key: "getDerivedStateFromProps",
871
886
  value: function getDerivedStateFromProps(props, state) {
872
887
  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
- // }
888
+ /*
889
+ * return {
890
+ * view: DateUtilities.clone(props.minDate)
891
+ * }
892
+ */
876
893
  }
877
894
  return null;
878
895
  }
@@ -893,7 +910,7 @@ var WeekHeader = function (_Component4) {
893
910
  _createClass(WeekHeader, [{
894
911
  key: "render",
895
912
  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"));
913
+ 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
914
  }
898
915
  }]);
899
916
 
@@ -923,7 +940,7 @@ var Weeks = function (_Component5) {
923
940
  _createClass(Weeks, [{
924
941
  key: "componentDidMount",
925
942
  value: function componentDidMount() {
926
- this.refs.current.addEventListener("transitionend", this.onTransitionEnd);
943
+ this.refs.current.addEventListener('transitionend', this.onTransitionEnd);
927
944
  }
928
945
  }, {
929
946
  key: "onTransitionEnd",
@@ -944,8 +961,8 @@ var Weeks = function (_Component5) {
944
961
  var current = DateUtilities.clone(view);
945
962
  current.setDate(current.getDate() + 7);
946
963
 
947
- var starts = [view],
948
- month = current.getMonth();
964
+ var starts = [view];
965
+ var month = current.getMonth();
949
966
 
950
967
  while (current.getMonth() === month) {
951
968
  starts.push(DateUtilities.clone(current));
@@ -957,26 +974,26 @@ var Weeks = function (_Component5) {
957
974
  key: "moveTo",
958
975
  value: function moveTo(view, isForward) {
959
976
  this.setState({
960
- sliding: isForward ? "left" : "right",
977
+ sliding: isForward ? 'left' : 'right',
961
978
  other: DateUtilities.clone(view)
962
979
  });
963
980
  }
964
981
  }, {
965
982
  key: "render",
966
983
  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 : "")
984
+ return _react2.default.createElement('div', { className: 'weeks' }, _react2.default.createElement('div', {
985
+ ref: 'current',
986
+ className: 'current' + (this.state.sliding ? ' sliding ' + this.state.sliding : '')
987
+ }, this.renderWeeks(this.state.view)), _react2.default.createElement('div', {
988
+ ref: 'other',
989
+ className: 'other' + (this.state.sliding ? ' sliding ' + this.state.sliding : '')
973
990
  }, this.renderWeeks(this.state.other)));
974
991
  }
975
992
  }, {
976
993
  key: "renderWeeks",
977
994
  value: function renderWeeks(view) {
978
- var starts = this.getWeekStartDates(view),
979
- month = starts[1].getMonth();
995
+ var starts = this.getWeekStartDates(view);
996
+ var month = starts[1].getMonth();
980
997
 
981
998
  return starts.map(function (s, i) {
982
999
  return _react2.default.createElement(Week, {
@@ -998,10 +1015,12 @@ var Weeks = function (_Component5) {
998
1015
  key: "getDerivedStateFromProps",
999
1016
  value: function getDerivedStateFromProps(props, state) {
1000
1017
  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
- // }
1018
+ /*
1019
+ * return {
1020
+ * view: DateUtilities.clone(props.minDate),
1021
+ * other: DateUtilities.clone(props.minDate)
1022
+ * }
1023
+ */
1005
1024
  }
1006
1025
  return null;
1007
1026
  }
@@ -1029,8 +1048,8 @@ var Week = function (_Component6) {
1029
1048
  _createClass(Week, [{
1030
1049
  key: "buildDays",
1031
1050
  value: function buildDays(start) {
1032
- var days = [DateUtilities.clone(start)],
1033
- clone = DateUtilities.clone(start);
1051
+ var days = [DateUtilities.clone(start)];
1052
+ var clone = DateUtilities.clone(start);
1034
1053
  for (var i = 1; i <= 6; i++) {
1035
1054
  clone = DateUtilities.clone(clone);
1036
1055
  clone.setDate(clone.getDate() + 1);
@@ -1046,19 +1065,19 @@ var Week = function (_Component6) {
1046
1065
  }, {
1047
1066
  key: "getDayClassName",
1048
1067
  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";
1068
+ var className = 'day';
1069
+ if (DateUtilities.isSameDay(day, new Date())) className += ' today';
1070
+ if (this.props.month !== day.getMonth()) className += ' other-month';
1052
1071
  if (this.props.selected && DateUtilities.isSameDay(day, this.props.selected)) {
1053
- className += this.props.rangePicker ? " selected range-start" : " selected";
1072
+ className += this.props.rangePicker ? ' selected range-start' : ' selected';
1054
1073
  }
1055
1074
  if (this.props.selected2 && DateUtilities.isSameDay(day, this.props.selected2)) {
1056
- className += this.props.rangePicker ? " selected range-end" : " selected";
1075
+ className += this.props.rangePicker ? ' selected range-end' : ' selected';
1057
1076
  }
1058
1077
  if (this.props.selected && this.props.selected2 && DateUtilities.isAfter(day, this.props.selected) && DateUtilities.isBefore(day, this.props.selected2)) {
1059
- className += " in-selected-range";
1078
+ className += ' in-selected-range';
1060
1079
  }
1061
- if (this.isDisabled(day)) className += " disabled";
1080
+ if (this.isDisabled(day)) className += ' disabled';
1062
1081
  return className;
1063
1082
  }
1064
1083
  }, {
@@ -1071,8 +1090,9 @@ var Week = function (_Component6) {
1071
1090
  }, {
1072
1091
  key: "isDisabled",
1073
1092
  value: function isDisabled(day) {
1074
- var minDate = this.props.minDate,
1075
- maxDate = this.props.maxDate;
1093
+ var minDate = this.props.minDate;
1094
+ var maxDate = this.props.maxDate;
1095
+
1076
1096
 
1077
1097
  return minDate && DateUtilities.isBefore(day, minDate) || maxDate && DateUtilities.isAfter(day, maxDate) || this.isDateFromDisabled(day);
1078
1098
  }
@@ -1091,10 +1111,10 @@ var Week = function (_Component6) {
1091
1111
  key: "render",
1092
1112
  value: function render() {
1093
1113
  var days = this.buildDays(this.props.start);
1094
- return _react2.default.createElement("div", { className: "week" }, days.map(function (day, i) {
1114
+ return _react2.default.createElement('div', { className: 'week' }, days.map(function (day, i) {
1095
1115
  var _this12 = this;
1096
1116
 
1097
- return _react2.default.createElement("div", {
1117
+ return _react2.default.createElement('div', {
1098
1118
  key: i,
1099
1119
  onClick: function onClick() {
1100
1120
  _this12.onSelect(day);
@@ -1114,10 +1134,10 @@ var Week = function (_Component6) {
1114
1134
  }(_react.Component);
1115
1135
 
1116
1136
  DatePicker.defaultProps = {
1117
- theme: "light",
1137
+ theme: 'light',
1118
1138
  inline: false,
1119
1139
  rangePicker: false,
1120
- defaultSelcted: "",
1140
+ defaultSelcted: '',
1121
1141
  disabledDates: []
1122
1142
  };
1123
1143
 
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.48",
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.48",
11
11
  "prop-types": "^15.7.2",
12
12
  "styled-components": "^4.3.2"
13
13
  },