@pedidopago/ui 1.3.8 → 1.3.11

package/dist/components/DateInput/dateInput.test.js

@@ -38,4 +38,15 @@ describe('DateInput', function () {
 
     expect(container).toBeInTheDocument();
   });
+  it('should render the datepicker with minimum and maximum dates', function () {
+    var _setup3 = setup({
+      value: new Date(),
+      onChange: jest.fn(),
+      minDate: new Date(),
+      maxDate: new Date()
+    }),
+        container = _setup3.container;
+
+    expect(container).toBeInTheDocument();
+  });
 });

package/dist/components/DateInput/index.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { DateInputProps } from './types';
-export declare function DateInput({ label, placeholder, alert, helperText, value, locales, localeOptions, onChange, disabled, ...rest }: DateInputProps): JSX.Element;
+export declare function DateInput({ label, placeholder, alert, helperText, value, locales, localeOptions, minDate, maxDate, onChange, disabled, ...rest }: DateInputProps): JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/DateInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DateInput/index.tsx"],"names":[],"mappings":";AAeA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,WAAW,EACX,KAAK,EACL,UAAU,EACV,KAAK,EACL,OAAO,EACP,aAAa,EACb,QAAQ,EACR,QAAgB,EAChB,GAAG,IAAI,EACR,EAAE,cAAc,eAqFhB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DateInput/index.tsx"],"names":[],"mappings":";AAeA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,WAAW,EACX,KAAK,EACL,UAAU,EACV,KAAK,EACL,OAAO,EACP,aAAa,EACb,OAAO,EACP,OAAO,EACP,QAAQ,EACR,QAAgB,EAChB,GAAG,IAAI,EACR,EAAE,cAAc,eA2FhB"}

package/dist/components/DateInput/index.js

@@ -23,7 +23,7 @@ var _useDisableBodyScroll = require("../../shared/hooks/useDisableBodyScroll");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-var _excluded = ["label", "placeholder", "alert", "helperText", "value", "locales", "localeOptions", "onChange", "disabled"];
+var _excluded = ["label", "placeholder", "alert", "helperText", "value", "locales", "localeOptions", "minDate", "maxDate", "onChange", "disabled"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -59,6 +59,8 @@ function DateInput(_ref) {
       value = _ref.value,
       locales = _ref.locales,
       localeOptions = _ref.localeOptions,
+      minDate = _ref.minDate,
+      maxDate = _ref.maxDate,
       onChange = _ref.onChange,
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
@@ -89,7 +91,7 @@ function DateInput(_ref) {
   }
 
   (0, _react.useEffect)(function () {
-    setCurrentValue(value);
+    setCurrentValue(value === undefined ? new Date() : value);
   }, [value]);
   (0, _useDisableBodyScroll.useDisableBodyScroll)(datePickerOpen);
 
@@ -116,17 +118,17 @@ function DateInput(_ref) {
       }),
       disabled: disabled,
       tabIndex: disabled ? -1 : 0,
-      value: currentValue ? Array.isArray(currentValue) ? "".concat(currentValue[0].toLocaleDateString(locales, localeOptions), " - ").concat(currentValue[1].toLocaleDateString(locales, localeOptions)) : currentValue.toLocaleDateString(locales) : '',
+      value: currentValue ? Array.isArray(currentValue) ? "".concat(currentValue[0].toLocaleDateString(locales, localeOptions), " - ").concat(currentValue[1].toLocaleDateString(locales, localeOptions)) : new Date(currentValue).toLocaleDateString() : '',
       onClick: toggleOptionsAreaView,
       onMouseOver: handleRepositionModal
-    }), datePickerOpen && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Overlay, {
-        onClick: function onClick() {
-          return setDatePickerOpen(false);
-        }
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ReactPortal.ReactPortal, {
+    }), datePickerOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ReactPortal.ReactPortal, {
         wrapperId: "portal-root",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalWrapper.ModalWrapper, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Overlay, {
+          onClick: function onClick() {
+            return setDatePickerOpen(false);
+          }
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalWrapper.ModalWrapper, {
           open: datePickerOpen,
           left: "".concat((_containerRef$current3 = containerRef.current) === null || _containerRef$current3 === void 0 ? void 0 : _containerRef$current3.getBoundingClientRect().left, "px"),
           top: Number(positionContainer) < 540 ? "calc(".concat(((_containerRef$current4 = containerRef.current) === null || _containerRef$current4 === void 0 ? void 0 : _containerRef$current4.getBoundingClientRect().bottom) || 0, "px + 10px)") : "calc(".concat(((_containerRef$current5 = containerRef.current) === null || _containerRef$current5 === void 0 ? void 0 : _containerRef$current5.getBoundingClientRect().top) || 0, "px - ", 360, "px)"),
@@ -134,10 +136,12 @@ function DateInput(_ref) {
           maxWidth: "auto",
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DatePicker.default, _objectSpread({
             value: currentValue,
-            onChange: selectDate
+            onChange: selectDate,
+            minDate: minDate,
+            maxDate: maxDate
           }, rest))
-        })
-      })]
+        })]
+      })
     })]
   });
 }

package/dist/components/DateInput/types.d.ts

@@ -11,5 +11,7 @@ export interface DateInputProps extends DatePickerProps {
     disabled?: boolean;
     locales?: string | string[];
     localeOptions?: Intl.DateTimeFormatOptions;
+    minDate?: Date;
+    maxDate?: Date;
 }
 //# sourceMappingURL=types.d.ts.map

package/dist/components/DateInput/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/DateInput/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEjD,oBAAY,wBAAwB,GAAG;IACrC,QAAQ,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;CAC7B,CAAC;AAEF,MAAM,WAAW,cAAe,SAAQ,eAAe;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC5B,aAAa,CAAC,EAAE,IAAI,CAAC,qBAAqB,CAAC;CAC5C"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/DateInput/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEjD,oBAAY,wBAAwB,GAAG;IACrC,QAAQ,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;CAC7B,CAAC;AAEF,MAAM,WAAW,cAAe,SAAQ,eAAe;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC5B,aAAa,CAAC,EAAE,IAAI,CAAC,qBAAqB,CAAC;IAC3C,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC;CAChB"}

package/dist/components/DatePicker/components/DatePickerContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DatePickerContent.d.ts","sourceRoot":"","sources":["../../../../src/components/DatePicker/components/DatePickerContent.tsx"],"names":[],"mappings":";AAkBA,OAAO,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAElD,eAAO,MAAM,iBAAiB,4KAc3B,sBAAsB,gBAyNxB,CAAC"}
+{"version":3,"file":"DatePickerContent.d.ts","sourceRoot":"","sources":["../../../../src/components/DatePicker/components/DatePickerContent.tsx"],"names":[],"mappings":";AAkBA,OAAO,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAElD,eAAO,MAAM,iBAAiB,4KAc3B,sBAAsB,gBAmOxB,CAAC"}

package/dist/components/DatePicker/components/DatePickerContent.js

@@ -56,11 +56,6 @@ var DatePickerContent = function DatePickerContent(_ref) {
     if (maxDate || minDate) {
       var newDate = new Date(date);
       newDate.setMonth(newDate.getMonth() + (to === 'up' ? 1 : -1));
-
-      if (maxDate && newDate > maxDate || minDate && newDate < minDate) {
-        return;
-      }
-
       handleChangeDate(newDate);
     }
 
@@ -109,6 +104,20 @@ var DatePickerContent = function DatePickerContent(_ref) {
     return groupedDaysWithWeekDays;
   };
 
+  var checkIfSelectedDateIsInvalid = function checkIfSelectedDateIsInvalid(cellDate) {
+    var isDateInvalid = false;
+
+    if (minDate && cellDate < minDate) {
+      isDateInvalid = true;
+    }
+
+    if (maxDate && cellDate > maxDate) {
+      isDateInvalid = true;
+    }
+
+    return isDateInvalid;
+  };
+
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_framerMotion.motion.div, {
     initial: {
       opacity: 0
@@ -194,12 +203,13 @@ var DatePickerContent = function DatePickerContent(_ref) {
                   var removeZeros = days.filter(function (day) {
                     return day !== 0;
                   });
+                  var isDateBeyondMinAndMaxLimits = checkIfSelectedDateIsInvalid(cellDate);
                   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.DatePickerTableCell, {
                     role: "gridcell",
                     title: cellTitle,
                     "data-date": cellDate,
                     tabIndex: -1,
-                    disabled: isDisabled,
+                    disabled: isDisabled || isDateBeyondMinAndMaxLimits,
                     "aria-label": cellDate.toLocaleDateString('pt-BR', {
                       weekday: 'short',
                       year: '2-digit',
@@ -213,7 +223,7 @@ var DatePickerContent = function DatePickerContent(_ref) {
                     isEndDateOfRange: type === 'range' && isEndDateOfRange,
                     isToday: isToday,
                     isSelected: isStartDateOfRange,
-                    isPrevNextMonth: isPreviousMonth || isNextMonth,
+                    isPrevNextMonth: isPreviousMonth || isNextMonth || isDateBeyondMinAndMaxLimits,
                     isFirstDayOfMonth: isExtended && rowIndex === 0 && day === 1,
                     isLastDayOfMonth: isExtended && rowIndex === monthDaysLength - 1 && day === removeZeros[removeZeros.length - 1],
                     onMouseOver: function onMouseOver() {

package/dist/components/DatePicker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DatePicker/index.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE1C,QAAA,MAAM,UAAU,iEAQb,eAAe,gBAuJjB,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DatePicker/index.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE1C,QAAA,MAAM,UAAU,iEAQb,eAAe,gBAoJjB,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/components/DatePicker/index.js

@@ -134,8 +134,8 @@ var DatePicker = function DatePicker(_ref) {
     isInTheRange: isInTheRange,
     handleMouseOver: handleMouseOver,
     handleChange: handleChange,
-    minDate: minDate && new Date(minDate),
-    maxDate: maxDate && new Date(maxDate)
+    minDate: minDate,
+    maxDate: maxDate
   };
 
   var handleToggleYearPicker = function handleToggleYearPicker() {
@@ -156,7 +156,7 @@ var DatePicker = function DatePicker(_ref) {
             enableYearPicker: !maxDate && !minDate
           }), {}, {
             date: firstCalendarDate,
-            maxDate: variant === 'extended' ? new Date(secondCalendarDate.getFullYear(), secondCalendarDate.getMonth() - 1, 1) : DatePickerContentProps.maxDate,
+            maxDate: variant === 'extended' ? new Date(secondCalendarDate.getFullYear(), secondCalendarDate.getMonth(), 1) : maxDate,
             handleChangeDate: function handleChangeDate(newDate) {
               return setFirstCalendarDate(newDate);
             }
@@ -165,7 +165,8 @@ var DatePicker = function DatePicker(_ref) {
             minDate: new Date(firstCalendarDate.getFullYear(), firstCalendarDate.getMonth() + 1, 1),
             handleChangeDate: function handleChangeDate(newDate) {
               return setSecondCalendarDate(newDate);
-            }
+            },
+            maxDate: maxDate
           }))]
         }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_DateYearPicker.DateYearPicker, {
           date: firstCalendarDate,

package/dist/components/DatePicker/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/DatePicker/styles.ts"],"names":[],"mappings":";AAOA,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAE7C,eAAO,MAAM,0BAA0B;;;;gBACzB,OAAO;yGAsBpB,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;yGAG/B,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;yGAM5B,CAAC;AAEF,eAAO,MAAM,qBAAqB;;;;;yGAwBjC,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;;;qHAwBlC,CAAC;AAEF,eAAO,MAAM,cAAc;;;yGAE1B,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;uIAiB/B,CAAC;AACF,eAAO,MAAM,kBAAkB;;;;;mHAkB9B,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;+HA0J/B,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;gIAGnC,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;yGAGnC,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;yGAG9B,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;;;yGAoC9B,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/DatePicker/styles.ts"],"names":[],"mappings":";AAOA,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAE7C,eAAO,MAAM,0BAA0B;;;;gBACzB,OAAO;yGAsBpB,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;yGAG/B,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;yGAM5B,CAAC;AAEF,eAAO,MAAM,qBAAqB;;;;;yGAwBjC,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;;;qHAwBlC,CAAC;AAEF,eAAO,MAAM,cAAc;;;yGAE1B,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;uIAiB/B,CAAC;AACF,eAAO,MAAM,kBAAkB;;;;;mHAkB9B,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;+HAyJ/B,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;gIAGnC,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;yGAGnC,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;yGAG9B,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;;;yGAoC9B,CAAC"}

package/dist/components/DatePicker/styles.js

@@ -74,7 +74,7 @@ var DatePickerTableCell = _styled.default.td(_templateObject9 || (_templateObjec
 }, function (props) {
   return props.isPrevNextMonth && !props.isSelected && !props.isEndDateOfRange && !props['aria-selected'] ? (0, _colorCheck.parseHslColorToString)(props.theme.colorMode === 'dark' ? (0, _colorToGray.convertColor)((0, _getColorValue.getColorValue)(props.theme.colorSelected, props.theme)).neutral3 : (0, _colorToGray.convertColor)((0, _getColorValue.getColorValue)(props.theme.colorSelected, props.theme)).neutral1) : props.isSelected || props.isEndDateOfRange ? props.theme.colors.body.light : props['aria-selected'] ? (0, _getColorValue.getColorValue)(props.theme.colorSelected, props.theme) : props.theme.colorMode === 'dark' ? props.theme.colors.neutral.white : props.theme.colors.neutral.black;
 }, function (props) {
-  return props.disabled && "\n    cursor: default; \n    pointer-events: none;\n    visibility: hidden;\n  ";
+  return props.disabled && "\n    cursor: default; \n    pointer-events: none;\n  ";
 }, function (props) {
   return props.isToday && !props.isSelected && !props.isEndDateOfRange && "\n    &:after {\n      content: '';\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      width: 100%;\n      height: 100%;\n      border-radius: 50%;\n      border: solid 1px ".concat(props.theme.colorMode === 'dark' ? props.theme.colors.neutral.neutral3 : props.theme.colors.neutral.neutral2, ";\n      transform: translate(-50%, -50%);\n    }\n  ");
 }, function (props) {

package/dist/components/Icon/data/dash.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dash.d.ts","sourceRoot":"","sources":["../../../../src/components/Icon/data/dash.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,SAAS;;;;;;;GAi2ErB,CAAC"}
+{"version":3,"file":"dash.d.ts","sourceRoot":"","sources":["../../../../src/components/Icon/data/dash.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,SAAS;;;;;;;GAyiFrB,CAAC"}