@lanaco/lnc-react-ui 3.11.7 → 3.11.8

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.
package/lib/index.esm.js CHANGED
@@ -3320,7 +3320,9 @@ var lanaco_light = {
3320
3320
  backgroundDayOpacity: 200
3321
3321
  },
3322
3322
  disabled: {
3323
- border: 200
3323
+ border: 200,
3324
+ text: 400,
3325
+ background: 0
3324
3326
  }
3325
3327
  },
3326
3328
  teal: {
@@ -14314,7 +14316,7 @@ Icon.propTypes = {
14314
14316
  };
14315
14317
 
14316
14318
  var _templateObject$1n;
14317
- var Styled_DatePickerWrapper = newStyled.div(_templateObject$1n || (_templateObject$1n = _taggedTemplateLiteral(["\n ", "\n & .react-datepicker__header__dropdown {\n position: absolute !important;\n z-index: 30;\n width: ", ";\n \n top: 1.3rem;\n font-size: 1rem;\n @media (max-width: 725px) {\n width: ", ";\n }\n @media (max-width: 550px) {\n width: 100%;\n }\n }\n & input {\n border: none;\n outline: none;\n ", "\n }\n & .react-datepicker {\n position: relative;\n background-color: ", ";\n color: ", ";\n border: none;\n box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1),\n 0px 2px 4px -1px rgba(0, 0, 0, 0.06);\n border-radius: 16px;\n }\n & .react-datepicker__day {\n min-width: 2rem;\n padding: 0.375rem;\n }\n & .react-datepicker__month-read-view--down-arrow,\n .react-datepicker__year-read-view--down-arrow {\n display: none;\n }\n & .react-datepicker__day--today {\n border: 1px solid\n ", ";\n color: ", " !important;\n border-radius: 8px;\n }\n & .react-datepicker__current-month,\n & .react-datepicker-time__header,\n & .react-datepicker-year-header {\n display: none;\n }\n & .react-datepicker__day--outside-month {\n color: ", " !important;\n background-color: transparent !important;\n }\n & .react-datepicker__header {\n border-radius: 8px 8px 0 0;\n background-color: transparent;\n border-bottom: 1px solid transparent;\n font-size: 1rem;\n }\n & .react-datepicker__day-names {\n margin-top: 3.5rem;\n color: ", " !important;\n }\n & .react-datepicker__day-name,\n & .react-datepicker__day,\n & .react-datepicker__time-name {\n color: var(--primary);\n font-size: 1rem;\n min-width: 2rem;\n padding: 0.375rem 0.375rem 0.375rem 0.375rem;\n }\n & .react-datepicker__day-name {\n line-height: 0;\n }\n & .react-datepicker__day--keyboard-selected:hover,\n & .react-datepicker__month-text--keyboard-selected:hover,\n & .react-datepicker__quarter-text--keyboard-selected:hover,\n & .react-datepicker__year-text--keyboard-selected:hover,\n & .react-datepicker__day:hover {\n background-color: ", ";\n color: ", ";\n }\n & .react-datepicker__year-dropdown,\n & .react-datepicker__month-dropdown,\n & .react-datepicker__month-year-dropdown {\n font-size: 1rem;\n background-color: ", ";\n }\n\n & .react-datepicker__year-dropdown,\n & .react-datepicker__month-dropdown,\n & .react-datepicker__month-year-dropdown {\n width: 100%;\n left: 0%;\n display: flex;\n flex-wrap: wrap;\n border: 1px solid transparent;\n box-shadow: 0px 0px 20px rgba(65, 43, 118, 0.1);\n border-radius: 8px;\n padding: 4px;\n }\n\n & .react-datepicker__year-option,\n & .react-datepicker__month-year-option {\n width: 33.33%;\n margin-left: 0;\n padding: 0.45rem;\n margin-right: 0;\n }\n & .react-datepicker__month-option {\n width: 50%;\n margin-left: 0;\n padding: 0.45rem;\n margin-right: 0;\n }\n & .react-datepicker__year-option:hover,\n & .react-datepicker__month-option:hover,\n & .react-datepicker__month-year-option:hover {\n border-radius: 8px;\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n\n & .react-datepicker__year-option:nth-of-type(1),\n & .react-datepicker__month-year-option:nth-of-type(1),\n & .react-datepicker__year-option:last-of-type,\n & .react-datepicker__month-year-option:last-of-type {\n width: 100%;\n }\n\n & .react-datepicker__year-option--selected,\n & .react-datepicker__month-option--selected,\n & .react-datepicker__month-year-option--selected {\n position: unset;\n }\n\n & .react-datepicker__year-option--selected_year {\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n\n & .react-datepicker__year-option--selected,\n & .react-datepicker__month-option--selected {\n display: none;\n }\n\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-upcoming {\n top: -4px;\n border-bottom-color: #ccc;\n }\n & .react-datepicker__year-read-view,\n & .react-datepicker__month-read-view,\n & .react-datepicker__month-year-read-view {\n visibility: visible !important;\n }\n\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-previous {\n top: 4px;\n border-top-color: #ccc;\n }\n\n & .react-datepicker__navigation--years {\n background: none;\n line-height: 1.7rem;\n text-align: center;\n cursor: pointer;\n padding: 0;\n border: 0.45rem solid transparent;\n z-index: 1;\n height: 10px;\n width: 10px;\n text-indent: -999em;\n overflow: hidden;\n position: relative;\n display: block;\n margin-left: auto;\n margin-right: auto;\n }\n & .react-datepicker__year-read-view--down-arrow,\n & .react-datepicker__month-read-view--down-arrow,\n & .react-datepicker__month-year-read-view--down-arrow,\n & .react-datepicker__navigation-icon::before {\n border-width: 1px 1px 0 0;\n }\n & .react-datepicker__navigation {\n top: 1rem;\n z-index: 40;\n }\n & .react-datepicker__year-read-view--down-arrow,\n & .react-datepicker__month-read-view--down-arrow,\n & .react-datepicker__month-year-read-view--down-arrow {\n top: 4px;\n border-color: transparent;\n padding: 4px;\n }\n & .react-datepicker__year-read-view--down-arrow,\n & .react-datepicker__month-read-view--down-arrow,\n & .react-datepicker__month-year-read-view--down-arrow,\n & .react-datepicker__navigation-icon::before {\n border-color: ", ";\n }\n & .react-datepicker__header--time {\n border-bottom: none;\n }\n & .react-datepicker__time {\n ", "\n background-color: var(--primary-100) !important;\n font-size: 0.9rem;\n }\n &\n .react-datepicker__time-container\n .react-datepicker__time\n .react-datepicker__time-box\n ul.react-datepicker__time-list\n li.react-datepicker__time-list-item:hover {\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n &\n .react-datepicker__time-container\n .react-datepicker__time\n .react-datepicker__time-box\n ul.react-datepicker__time-list\n li.react-datepicker__time-list-item--selected {\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-upcoming {\n border-bottom-color: var(--primary);\n }\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-previous {\n border-top-color: var(--primary);\n }\n & .react-datepicker-popper[data-placement^=\"bottom\"] {\n padding-top: 0;\n }\n & .react-datepicker__day--selected,\n & .react-datepicker__day--in-selecting-range,\n & .react-datepicker__day--in-range,\n & .react-datepicker__month-text--selected,\n & .react-datepicker__month-text--in-selecting-range,\n & .react-datepicker__month-text--in-range,\n & .react-datepicker__quarter-text--selected,\n & .react-datepicker__quarter-text--in-selecting-range,\n & .react-datepicker__quarter-text--in-range,\n & .react-datepicker__year-text--selected,\n & .react-datepicker__year-text--in-selecting-range,\n & .react-datepicker__year-text--in-range {\n background-color: ", ";\n color: ", ";\n border: none;\n }\n &\n .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__day--selecting-range-start, .react-datepicker__day--selecting-range-end, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),\n &\n .react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),\n &\n .react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),\n &\n .react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range) {\n border-radius: 8px;\n background-color: ", ";\n color: ", ";\n }\n & .react-datepicker__day--selecting-range-start,\n & .react-datepicker__day--selecting-range-end {\n background-color: ", ";\n color: ", ";\n }\n\n & .react-datepicker__day--keyboard-selected {\n background-color: transparent;\n }\n"])), function (props) {
14319
+ var Styled_DatePickerWrapper = newStyled.div(_templateObject$1n || (_templateObject$1n = _taggedTemplateLiteral(["\n ", "\n & .react-datepicker__header__dropdown {\n position: absolute !important;\n z-index: 30;\n width: ", ";\n\n top: 1.3rem;\n font-size: 1rem;\n @media (max-width: 725px) {\n width: ", ";\n }\n @media (max-width: 550px) {\n width: 100%;\n }\n }\n & input {\n border: none;\n outline: none;\n ", "\n }\n & .react-datepicker {\n position: relative;\n background-color: ", ";\n color: ", ";\n border: none;\n box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1),\n 0px 2px 4px -1px rgba(0, 0, 0, 0.06);\n border-radius: 16px;\n }\n & .react-datepicker__day {\n min-width: 2rem;\n padding: 0.375rem;\n }\n & .react-datepicker__month-read-view--down-arrow,\n .react-datepicker__year-read-view--down-arrow {\n display: none;\n }\n & .react-datepicker__day--today {\n border: 1px solid\n ", ";\n color: ", " !important;\n border-radius: 8px;\n }\n & .react-datepicker__current-month,\n & .react-datepicker-time__header,\n & .react-datepicker-year-header {\n display: none;\n }\n & .react-datepicker__day--outside-month {\n color: ", " !important;\n background-color: transparent !important;\n }\n & .react-datepicker__header {\n border-radius: 8px 8px 0 0;\n background-color: transparent;\n border-bottom: 1px solid transparent;\n font-size: 1rem;\n }\n & .react-datepicker__day-names {\n margin-top: 3.5rem;\n color: ", " !important;\n }\n & .react-datepicker__day-name,\n & .react-datepicker__day,\n & .react-datepicker__time-name {\n color: var(--primary);\n font-size: 1rem;\n min-width: 2rem;\n padding: 0.375rem 0.375rem 0.375rem 0.375rem;\n }\n & .react-datepicker__day-name {\n line-height: 0;\n }\n & .react-datepicker__day--keyboard-selected:hover,\n & .react-datepicker__month-text--keyboard-selected:hover,\n & .react-datepicker__quarter-text--keyboard-selected:hover,\n & .react-datepicker__year-text--keyboard-selected:hover,\n & .react-datepicker__day:hover {\n background-color: ", ";\n color: ", ";\n }\n & .react-datepicker__year-dropdown,\n & .react-datepicker__month-dropdown,\n & .react-datepicker__month-year-dropdown {\n font-size: 1rem;\n background-color: ", ";\n }\n\n & .react-datepicker__year-dropdown,\n & .react-datepicker__month-dropdown,\n & .react-datepicker__month-year-dropdown {\n width: 100%;\n left: 0%;\n display: flex;\n flex-wrap: wrap;\n border: 1px solid transparent;\n box-shadow: 0px 0px 20px rgba(65, 43, 118, 0.1);\n border-radius: 8px;\n padding: 4px;\n }\n\n & .react-datepicker__year-option,\n & .react-datepicker__month-year-option {\n width: 33.33%;\n margin-left: 0;\n padding: 0.45rem;\n margin-right: 0;\n }\n & .react-datepicker__month-option {\n width: 50%;\n margin-left: 0;\n padding: 0.45rem;\n margin-right: 0;\n }\n & .react-datepicker__year-option:hover,\n & .react-datepicker__month-option:hover,\n & .react-datepicker__month-year-option:hover {\n border-radius: 8px;\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n\n & .react-datepicker__year-option:nth-of-type(1),\n & .react-datepicker__month-year-option:nth-of-type(1),\n & .react-datepicker__year-option:last-of-type,\n & .react-datepicker__month-year-option:last-of-type {\n width: 100%;\n }\n\n & .react-datepicker__year-option--selected,\n & .react-datepicker__month-option--selected,\n & .react-datepicker__month-year-option--selected {\n position: unset;\n }\n\n & .react-datepicker__year-option--selected_year {\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n\n & .react-datepicker__year-option--selected,\n & .react-datepicker__month-option--selected {\n display: none;\n }\n\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-upcoming {\n top: -4px;\n border-bottom-color: #ccc;\n }\n & .react-datepicker__year-read-view,\n & .react-datepicker__month-read-view,\n & .react-datepicker__month-year-read-view {\n visibility: visible !important;\n }\n\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-previous {\n top: 4px;\n border-top-color: #ccc;\n }\n\n & .react-datepicker__navigation--years {\n background: none;\n line-height: 1.7rem;\n text-align: center;\n cursor: pointer;\n padding: 0;\n border: 0.45rem solid transparent;\n z-index: 1;\n height: 10px;\n width: 10px;\n text-indent: -999em;\n overflow: hidden;\n position: relative;\n display: block;\n margin-left: auto;\n margin-right: auto;\n }\n & .react-datepicker__year-read-view--down-arrow,\n & .react-datepicker__month-read-view--down-arrow,\n & .react-datepicker__month-year-read-view--down-arrow,\n & .react-datepicker__navigation-icon::before {\n border-width: 1px 1px 0 0;\n }\n & .react-datepicker__navigation {\n top: 1rem;\n z-index: 40;\n }\n & .react-datepicker__year-read-view--down-arrow,\n & .react-datepicker__month-read-view--down-arrow,\n & .react-datepicker__month-year-read-view--down-arrow {\n top: 4px;\n border-color: transparent;\n padding: 4px;\n }\n & .react-datepicker__year-read-view--down-arrow,\n & .react-datepicker__month-read-view--down-arrow,\n & .react-datepicker__month-year-read-view--down-arrow,\n & .react-datepicker__navigation-icon::before {\n border-color: ", ";\n }\n & .react-datepicker__header--time {\n border-bottom: none;\n }\n & .react-datepicker__time {\n ", "\n background-color: var(--primary-100) !important;\n font-size: 0.9rem;\n }\n &\n .react-datepicker__time-container\n .react-datepicker__time\n .react-datepicker__time-box\n ul.react-datepicker__time-list\n li.react-datepicker__time-list-item:hover {\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n &\n .react-datepicker__time-container\n .react-datepicker__time\n .react-datepicker__time-box\n ul.react-datepicker__time-list\n li.react-datepicker__time-list-item--selected {\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-upcoming {\n border-bottom-color: var(--primary);\n }\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-previous {\n border-top-color: var(--primary);\n }\n & .react-datepicker-popper[data-placement^=\"bottom\"] {\n padding-top: 0;\n }\n & .react-datepicker__day--selected,\n & .react-datepicker__day--in-selecting-range,\n & .react-datepicker__day--in-range,\n & .react-datepicker__month-text--selected,\n & .react-datepicker__month-text--in-selecting-range,\n & .react-datepicker__month-text--in-range,\n & .react-datepicker__quarter-text--selected,\n & .react-datepicker__quarter-text--in-selecting-range,\n & .react-datepicker__quarter-text--in-range,\n & .react-datepicker__year-text--selected,\n & .react-datepicker__year-text--in-selecting-range,\n & .react-datepicker__year-text--in-range {\n background-color: ", ";\n color: ", ";\n border: none;\n }\n &\n .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__day--selecting-range-start, .react-datepicker__day--selecting-range-end, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),\n &\n .react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),\n &\n .react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),\n &\n .react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range) {\n border-radius: 8px;\n background-color: ", ";\n color: ", ";\n }\n & .react-datepicker__day--selecting-range-start,\n & .react-datepicker__day--selecting-range-end {\n background-color: ", ";\n color: ", ";\n }\n\n & .react-datepicker__day--keyboard-selected {\n background-color: transparent;\n }\n\n & .react-datepicker__day--disabled {\n background-color: ", ";\n color: ", ";\n\n &:hover {\n background-color: ", ";\n color: ", ";\n }\n }\n"])), function (props) {
14318
14320
  return getComponentTypographyCss(props.theme, "DateInput", props.size, "enabled");
14319
14321
  }, function (props) {
14320
14322
  return props.monthsShown > 2 ? 3 * 100 + "%" : props.monthsShown * 100 + "%";
@@ -14372,6 +14374,14 @@ var Styled_DatePickerWrapper = newStyled.div(_templateObject$1n || (_templateObj
14372
14374
  return getColorRgbaValue(props.theme, "DateInput", props.color, "active", "background");
14373
14375
  }, function (props) {
14374
14376
  return getColorRgbaValue(props.theme, "DateInput", props.color, "active", "text");
14377
+ }, function (props) {
14378
+ return getColorRgbaValue(props.theme, "DateInput", props.color, "disabled", "background");
14379
+ }, function (props) {
14380
+ return getColorRgbaValue(props.theme, "DateInput", props.color, "disabled", "text");
14381
+ }, function (props) {
14382
+ return getColorRgbaValue(props.theme, "DateInput", props.color, "disabled", "background");
14383
+ }, function (props) {
14384
+ return getColorRgbaValue(props.theme, "DateInput", props.color, "disabled", "text");
14375
14385
  });
14376
14386
 
14377
14387
  var reactDatepicker_min = {exports: {}};
@@ -43457,7 +43467,7 @@ TextInput.propTypes = {
43457
43467
  };
43458
43468
 
43459
43469
  var _DateInput$defaultPro;
43460
- var _excluded$1d = ["size", "color", "className", "style", "disabled", "readOnly", "onFocus", "onBlur", "value", "dateFormat", "tabIndex", "minDate", "maxDate", "monthsShown", "selectsRange", "withPortal", "shouldCloseOnOpen", "showTimeInput", "showTimeSelect", "onChange"];
43470
+ var _excluded$1d = ["size", "color", "className", "style", "disabled", "readOnly", "onFocus", "onBlur", "value", "dateFormat", "tabIndex", "monthsShown", "selectsRange", "withPortal", "shouldCloseOnOpen", "showTimeInput", "showTimeSelect", "onChange"];
43461
43471
  var DateInput = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
43462
43472
  var size = props.size,
43463
43473
  color = props.color,
@@ -43470,8 +43480,6 @@ var DateInput = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
43470
43480
  props.value;
43471
43481
  var dateFormat = props.dateFormat;
43472
43482
  props.tabIndex;
43473
- props.minDate;
43474
- props.maxDate;
43475
43483
  var monthsShown = props.monthsShown,
43476
43484
  selectsRange = props.selectsRange,
43477
43485
  withPortal = props.withPortal,
@@ -43534,8 +43542,6 @@ DateInput.propTypes = {
43534
43542
  disabled: PropTypes.bool,
43535
43543
  readOnly: PropTypes.bool,
43536
43544
  dateFormat: PropTypes.string,
43537
- minDate: PropTypes.any,
43538
- maxDate: PropTypes.any,
43539
43545
  tabIndex: PropTypes.number,
43540
43546
  monthsShown: PropTypes.number,
43541
43547
  withPortal: PropTypes.bool,
package/lib/index.js CHANGED
@@ -3369,7 +3369,9 @@ var lanaco_light = {
3369
3369
  backgroundDayOpacity: 200
3370
3370
  },
3371
3371
  disabled: {
3372
- border: 200
3372
+ border: 200,
3373
+ text: 400,
3374
+ background: 0
3373
3375
  }
3374
3376
  },
3375
3377
  teal: {
@@ -14363,7 +14365,7 @@ Icon.propTypes = {
14363
14365
  };
14364
14366
 
14365
14367
  var _templateObject$1n;
14366
- var Styled_DatePickerWrapper = newStyled.div(_templateObject$1n || (_templateObject$1n = _taggedTemplateLiteral__default["default"](["\n ", "\n & .react-datepicker__header__dropdown {\n position: absolute !important;\n z-index: 30;\n width: ", ";\n \n top: 1.3rem;\n font-size: 1rem;\n @media (max-width: 725px) {\n width: ", ";\n }\n @media (max-width: 550px) {\n width: 100%;\n }\n }\n & input {\n border: none;\n outline: none;\n ", "\n }\n & .react-datepicker {\n position: relative;\n background-color: ", ";\n color: ", ";\n border: none;\n box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1),\n 0px 2px 4px -1px rgba(0, 0, 0, 0.06);\n border-radius: 16px;\n }\n & .react-datepicker__day {\n min-width: 2rem;\n padding: 0.375rem;\n }\n & .react-datepicker__month-read-view--down-arrow,\n .react-datepicker__year-read-view--down-arrow {\n display: none;\n }\n & .react-datepicker__day--today {\n border: 1px solid\n ", ";\n color: ", " !important;\n border-radius: 8px;\n }\n & .react-datepicker__current-month,\n & .react-datepicker-time__header,\n & .react-datepicker-year-header {\n display: none;\n }\n & .react-datepicker__day--outside-month {\n color: ", " !important;\n background-color: transparent !important;\n }\n & .react-datepicker__header {\n border-radius: 8px 8px 0 0;\n background-color: transparent;\n border-bottom: 1px solid transparent;\n font-size: 1rem;\n }\n & .react-datepicker__day-names {\n margin-top: 3.5rem;\n color: ", " !important;\n }\n & .react-datepicker__day-name,\n & .react-datepicker__day,\n & .react-datepicker__time-name {\n color: var(--primary);\n font-size: 1rem;\n min-width: 2rem;\n padding: 0.375rem 0.375rem 0.375rem 0.375rem;\n }\n & .react-datepicker__day-name {\n line-height: 0;\n }\n & .react-datepicker__day--keyboard-selected:hover,\n & .react-datepicker__month-text--keyboard-selected:hover,\n & .react-datepicker__quarter-text--keyboard-selected:hover,\n & .react-datepicker__year-text--keyboard-selected:hover,\n & .react-datepicker__day:hover {\n background-color: ", ";\n color: ", ";\n }\n & .react-datepicker__year-dropdown,\n & .react-datepicker__month-dropdown,\n & .react-datepicker__month-year-dropdown {\n font-size: 1rem;\n background-color: ", ";\n }\n\n & .react-datepicker__year-dropdown,\n & .react-datepicker__month-dropdown,\n & .react-datepicker__month-year-dropdown {\n width: 100%;\n left: 0%;\n display: flex;\n flex-wrap: wrap;\n border: 1px solid transparent;\n box-shadow: 0px 0px 20px rgba(65, 43, 118, 0.1);\n border-radius: 8px;\n padding: 4px;\n }\n\n & .react-datepicker__year-option,\n & .react-datepicker__month-year-option {\n width: 33.33%;\n margin-left: 0;\n padding: 0.45rem;\n margin-right: 0;\n }\n & .react-datepicker__month-option {\n width: 50%;\n margin-left: 0;\n padding: 0.45rem;\n margin-right: 0;\n }\n & .react-datepicker__year-option:hover,\n & .react-datepicker__month-option:hover,\n & .react-datepicker__month-year-option:hover {\n border-radius: 8px;\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n\n & .react-datepicker__year-option:nth-of-type(1),\n & .react-datepicker__month-year-option:nth-of-type(1),\n & .react-datepicker__year-option:last-of-type,\n & .react-datepicker__month-year-option:last-of-type {\n width: 100%;\n }\n\n & .react-datepicker__year-option--selected,\n & .react-datepicker__month-option--selected,\n & .react-datepicker__month-year-option--selected {\n position: unset;\n }\n\n & .react-datepicker__year-option--selected_year {\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n\n & .react-datepicker__year-option--selected,\n & .react-datepicker__month-option--selected {\n display: none;\n }\n\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-upcoming {\n top: -4px;\n border-bottom-color: #ccc;\n }\n & .react-datepicker__year-read-view,\n & .react-datepicker__month-read-view,\n & .react-datepicker__month-year-read-view {\n visibility: visible !important;\n }\n\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-previous {\n top: 4px;\n border-top-color: #ccc;\n }\n\n & .react-datepicker__navigation--years {\n background: none;\n line-height: 1.7rem;\n text-align: center;\n cursor: pointer;\n padding: 0;\n border: 0.45rem solid transparent;\n z-index: 1;\n height: 10px;\n width: 10px;\n text-indent: -999em;\n overflow: hidden;\n position: relative;\n display: block;\n margin-left: auto;\n margin-right: auto;\n }\n & .react-datepicker__year-read-view--down-arrow,\n & .react-datepicker__month-read-view--down-arrow,\n & .react-datepicker__month-year-read-view--down-arrow,\n & .react-datepicker__navigation-icon::before {\n border-width: 1px 1px 0 0;\n }\n & .react-datepicker__navigation {\n top: 1rem;\n z-index: 40;\n }\n & .react-datepicker__year-read-view--down-arrow,\n & .react-datepicker__month-read-view--down-arrow,\n & .react-datepicker__month-year-read-view--down-arrow {\n top: 4px;\n border-color: transparent;\n padding: 4px;\n }\n & .react-datepicker__year-read-view--down-arrow,\n & .react-datepicker__month-read-view--down-arrow,\n & .react-datepicker__month-year-read-view--down-arrow,\n & .react-datepicker__navigation-icon::before {\n border-color: ", ";\n }\n & .react-datepicker__header--time {\n border-bottom: none;\n }\n & .react-datepicker__time {\n ", "\n background-color: var(--primary-100) !important;\n font-size: 0.9rem;\n }\n &\n .react-datepicker__time-container\n .react-datepicker__time\n .react-datepicker__time-box\n ul.react-datepicker__time-list\n li.react-datepicker__time-list-item:hover {\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n &\n .react-datepicker__time-container\n .react-datepicker__time\n .react-datepicker__time-box\n ul.react-datepicker__time-list\n li.react-datepicker__time-list-item--selected {\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-upcoming {\n border-bottom-color: var(--primary);\n }\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-previous {\n border-top-color: var(--primary);\n }\n & .react-datepicker-popper[data-placement^=\"bottom\"] {\n padding-top: 0;\n }\n & .react-datepicker__day--selected,\n & .react-datepicker__day--in-selecting-range,\n & .react-datepicker__day--in-range,\n & .react-datepicker__month-text--selected,\n & .react-datepicker__month-text--in-selecting-range,\n & .react-datepicker__month-text--in-range,\n & .react-datepicker__quarter-text--selected,\n & .react-datepicker__quarter-text--in-selecting-range,\n & .react-datepicker__quarter-text--in-range,\n & .react-datepicker__year-text--selected,\n & .react-datepicker__year-text--in-selecting-range,\n & .react-datepicker__year-text--in-range {\n background-color: ", ";\n color: ", ";\n border: none;\n }\n &\n .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__day--selecting-range-start, .react-datepicker__day--selecting-range-end, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),\n &\n .react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),\n &\n .react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),\n &\n .react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range) {\n border-radius: 8px;\n background-color: ", ";\n color: ", ";\n }\n & .react-datepicker__day--selecting-range-start,\n & .react-datepicker__day--selecting-range-end {\n background-color: ", ";\n color: ", ";\n }\n\n & .react-datepicker__day--keyboard-selected {\n background-color: transparent;\n }\n"])), function (props) {
14368
+ var Styled_DatePickerWrapper = newStyled.div(_templateObject$1n || (_templateObject$1n = _taggedTemplateLiteral__default["default"](["\n ", "\n & .react-datepicker__header__dropdown {\n position: absolute !important;\n z-index: 30;\n width: ", ";\n\n top: 1.3rem;\n font-size: 1rem;\n @media (max-width: 725px) {\n width: ", ";\n }\n @media (max-width: 550px) {\n width: 100%;\n }\n }\n & input {\n border: none;\n outline: none;\n ", "\n }\n & .react-datepicker {\n position: relative;\n background-color: ", ";\n color: ", ";\n border: none;\n box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1),\n 0px 2px 4px -1px rgba(0, 0, 0, 0.06);\n border-radius: 16px;\n }\n & .react-datepicker__day {\n min-width: 2rem;\n padding: 0.375rem;\n }\n & .react-datepicker__month-read-view--down-arrow,\n .react-datepicker__year-read-view--down-arrow {\n display: none;\n }\n & .react-datepicker__day--today {\n border: 1px solid\n ", ";\n color: ", " !important;\n border-radius: 8px;\n }\n & .react-datepicker__current-month,\n & .react-datepicker-time__header,\n & .react-datepicker-year-header {\n display: none;\n }\n & .react-datepicker__day--outside-month {\n color: ", " !important;\n background-color: transparent !important;\n }\n & .react-datepicker__header {\n border-radius: 8px 8px 0 0;\n background-color: transparent;\n border-bottom: 1px solid transparent;\n font-size: 1rem;\n }\n & .react-datepicker__day-names {\n margin-top: 3.5rem;\n color: ", " !important;\n }\n & .react-datepicker__day-name,\n & .react-datepicker__day,\n & .react-datepicker__time-name {\n color: var(--primary);\n font-size: 1rem;\n min-width: 2rem;\n padding: 0.375rem 0.375rem 0.375rem 0.375rem;\n }\n & .react-datepicker__day-name {\n line-height: 0;\n }\n & .react-datepicker__day--keyboard-selected:hover,\n & .react-datepicker__month-text--keyboard-selected:hover,\n & .react-datepicker__quarter-text--keyboard-selected:hover,\n & .react-datepicker__year-text--keyboard-selected:hover,\n & .react-datepicker__day:hover {\n background-color: ", ";\n color: ", ";\n }\n & .react-datepicker__year-dropdown,\n & .react-datepicker__month-dropdown,\n & .react-datepicker__month-year-dropdown {\n font-size: 1rem;\n background-color: ", ";\n }\n\n & .react-datepicker__year-dropdown,\n & .react-datepicker__month-dropdown,\n & .react-datepicker__month-year-dropdown {\n width: 100%;\n left: 0%;\n display: flex;\n flex-wrap: wrap;\n border: 1px solid transparent;\n box-shadow: 0px 0px 20px rgba(65, 43, 118, 0.1);\n border-radius: 8px;\n padding: 4px;\n }\n\n & .react-datepicker__year-option,\n & .react-datepicker__month-year-option {\n width: 33.33%;\n margin-left: 0;\n padding: 0.45rem;\n margin-right: 0;\n }\n & .react-datepicker__month-option {\n width: 50%;\n margin-left: 0;\n padding: 0.45rem;\n margin-right: 0;\n }\n & .react-datepicker__year-option:hover,\n & .react-datepicker__month-option:hover,\n & .react-datepicker__month-year-option:hover {\n border-radius: 8px;\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n\n & .react-datepicker__year-option:nth-of-type(1),\n & .react-datepicker__month-year-option:nth-of-type(1),\n & .react-datepicker__year-option:last-of-type,\n & .react-datepicker__month-year-option:last-of-type {\n width: 100%;\n }\n\n & .react-datepicker__year-option--selected,\n & .react-datepicker__month-option--selected,\n & .react-datepicker__month-year-option--selected {\n position: unset;\n }\n\n & .react-datepicker__year-option--selected_year {\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n\n & .react-datepicker__year-option--selected,\n & .react-datepicker__month-option--selected {\n display: none;\n }\n\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-upcoming {\n top: -4px;\n border-bottom-color: #ccc;\n }\n & .react-datepicker__year-read-view,\n & .react-datepicker__month-read-view,\n & .react-datepicker__month-year-read-view {\n visibility: visible !important;\n }\n\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-previous {\n top: 4px;\n border-top-color: #ccc;\n }\n\n & .react-datepicker__navigation--years {\n background: none;\n line-height: 1.7rem;\n text-align: center;\n cursor: pointer;\n padding: 0;\n border: 0.45rem solid transparent;\n z-index: 1;\n height: 10px;\n width: 10px;\n text-indent: -999em;\n overflow: hidden;\n position: relative;\n display: block;\n margin-left: auto;\n margin-right: auto;\n }\n & .react-datepicker__year-read-view--down-arrow,\n & .react-datepicker__month-read-view--down-arrow,\n & .react-datepicker__month-year-read-view--down-arrow,\n & .react-datepicker__navigation-icon::before {\n border-width: 1px 1px 0 0;\n }\n & .react-datepicker__navigation {\n top: 1rem;\n z-index: 40;\n }\n & .react-datepicker__year-read-view--down-arrow,\n & .react-datepicker__month-read-view--down-arrow,\n & .react-datepicker__month-year-read-view--down-arrow {\n top: 4px;\n border-color: transparent;\n padding: 4px;\n }\n & .react-datepicker__year-read-view--down-arrow,\n & .react-datepicker__month-read-view--down-arrow,\n & .react-datepicker__month-year-read-view--down-arrow,\n & .react-datepicker__navigation-icon::before {\n border-color: ", ";\n }\n & .react-datepicker__header--time {\n border-bottom: none;\n }\n & .react-datepicker__time {\n ", "\n background-color: var(--primary-100) !important;\n font-size: 0.9rem;\n }\n &\n .react-datepicker__time-container\n .react-datepicker__time\n .react-datepicker__time-box\n ul.react-datepicker__time-list\n li.react-datepicker__time-list-item:hover {\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n &\n .react-datepicker__time-container\n .react-datepicker__time\n .react-datepicker__time-box\n ul.react-datepicker__time-list\n li.react-datepicker__time-list-item--selected {\n color: ", ";\n border-radius: 8px;\n background-color: ", ";\n }\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-upcoming {\n border-bottom-color: var(--primary);\n }\n &\n .react-datepicker__navigation--years.react-datepicker__navigation--years-previous {\n border-top-color: var(--primary);\n }\n & .react-datepicker-popper[data-placement^=\"bottom\"] {\n padding-top: 0;\n }\n & .react-datepicker__day--selected,\n & .react-datepicker__day--in-selecting-range,\n & .react-datepicker__day--in-range,\n & .react-datepicker__month-text--selected,\n & .react-datepicker__month-text--in-selecting-range,\n & .react-datepicker__month-text--in-range,\n & .react-datepicker__quarter-text--selected,\n & .react-datepicker__quarter-text--in-selecting-range,\n & .react-datepicker__quarter-text--in-range,\n & .react-datepicker__year-text--selected,\n & .react-datepicker__year-text--in-selecting-range,\n & .react-datepicker__year-text--in-range {\n background-color: ", ";\n color: ", ";\n border: none;\n }\n &\n .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__day--selecting-range-start, .react-datepicker__day--selecting-range-end, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),\n &\n .react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),\n &\n .react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),\n &\n .react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range) {\n border-radius: 8px;\n background-color: ", ";\n color: ", ";\n }\n & .react-datepicker__day--selecting-range-start,\n & .react-datepicker__day--selecting-range-end {\n background-color: ", ";\n color: ", ";\n }\n\n & .react-datepicker__day--keyboard-selected {\n background-color: transparent;\n }\n\n & .react-datepicker__day--disabled {\n background-color: ", ";\n color: ", ";\n\n &:hover {\n background-color: ", ";\n color: ", ";\n }\n }\n"])), function (props) {
14367
14369
  return getComponentTypographyCss(props.theme, "DateInput", props.size, "enabled");
14368
14370
  }, function (props) {
14369
14371
  return props.monthsShown > 2 ? 3 * 100 + "%" : props.monthsShown * 100 + "%";
@@ -14421,6 +14423,14 @@ var Styled_DatePickerWrapper = newStyled.div(_templateObject$1n || (_templateObj
14421
14423
  return getColorRgbaValue(props.theme, "DateInput", props.color, "active", "background");
14422
14424
  }, function (props) {
14423
14425
  return getColorRgbaValue(props.theme, "DateInput", props.color, "active", "text");
14426
+ }, function (props) {
14427
+ return getColorRgbaValue(props.theme, "DateInput", props.color, "disabled", "background");
14428
+ }, function (props) {
14429
+ return getColorRgbaValue(props.theme, "DateInput", props.color, "disabled", "text");
14430
+ }, function (props) {
14431
+ return getColorRgbaValue(props.theme, "DateInput", props.color, "disabled", "background");
14432
+ }, function (props) {
14433
+ return getColorRgbaValue(props.theme, "DateInput", props.color, "disabled", "text");
14424
14434
  });
14425
14435
 
14426
14436
  var reactDatepicker_min = {exports: {}};
@@ -43506,7 +43516,7 @@ TextInput.propTypes = {
43506
43516
  };
43507
43517
 
43508
43518
  var _DateInput$defaultPro;
43509
- var _excluded$1d = ["size", "color", "className", "style", "disabled", "readOnly", "onFocus", "onBlur", "value", "dateFormat", "tabIndex", "minDate", "maxDate", "monthsShown", "selectsRange", "withPortal", "shouldCloseOnOpen", "showTimeInput", "showTimeSelect", "onChange"];
43519
+ var _excluded$1d = ["size", "color", "className", "style", "disabled", "readOnly", "onFocus", "onBlur", "value", "dateFormat", "tabIndex", "monthsShown", "selectsRange", "withPortal", "shouldCloseOnOpen", "showTimeInput", "showTimeSelect", "onChange"];
43510
43520
  var DateInput = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
43511
43521
  var size = props.size,
43512
43522
  color = props.color,
@@ -43519,8 +43529,6 @@ var DateInput = /*#__PURE__*/React__default["default"].forwardRef(function (prop
43519
43529
  props.value;
43520
43530
  var dateFormat = props.dateFormat;
43521
43531
  props.tabIndex;
43522
- props.minDate;
43523
- props.maxDate;
43524
43532
  var monthsShown = props.monthsShown,
43525
43533
  selectsRange = props.selectsRange,
43526
43534
  withPortal = props.withPortal,
@@ -43583,8 +43591,6 @@ DateInput.propTypes = {
43583
43591
  disabled: PropTypes__default["default"].bool,
43584
43592
  readOnly: PropTypes__default["default"].bool,
43585
43593
  dateFormat: PropTypes__default["default"].string,
43586
- minDate: PropTypes__default["default"].any,
43587
- maxDate: PropTypes__default["default"].any,
43588
43594
  tabIndex: PropTypes__default["default"].number,
43589
43595
  monthsShown: PropTypes__default["default"].number,
43590
43596
  withPortal: PropTypes__default["default"].bool,
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@lanaco/lnc-react-ui",
3
3
  "type": "module",
4
- "version": "3.11.7",
4
+ "version": "3.11.8",
5
5
  "description": "component library",
6
6
  "main": "lib/index.js",
7
7
  "module": "lib/index.esm.js",