@pedidopago/ui 1.3.7 → 1.3.8

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/DateInput/components/ModalWrapper/index.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,eAAO,MAAM,YAAY,8GA+BxB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/DateInput/components/ModalWrapper/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,eAAO,MAAM,YAAY,8GAkBxB,CAAC"}

package/dist/components/DateInput/components/ModalWrapper/index.js

@@ -7,8 +7,6 @@ exports.ModalWrapper = void 0;
 
 var _react = require("react");
 
-var _useDisableBodyScroll = require("../../../../shared/hooks/useDisableBodyScroll");
-
 var _styles = require("./styles");
 
 var _jsxRuntime = require("react/jsx-runtime");
@@ -21,15 +19,12 @@ var ModalWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
       top = _ref$top === void 0 ? '' : _ref$top,
       _ref$offsetX = _ref.offsetX,
       offsetX = _ref$offsetX === void 0 ? '0px' : _ref$offsetX,
-      _ref$disableScrollOnO = _ref.disableScrollOnOpen,
-      disableScrollOnOpen = _ref$disableScrollOnO === void 0 ? true : _ref$disableScrollOnO,
       maxWidth = _ref.maxWidth,
       children = _ref.children;
   var optionsContainerRef = (0, _react.useRef)(null);
   (0, _react.useImperativeHandle)(ref, function () {
     return optionsContainerRef.current;
   });
-  (0, _useDisableBodyScroll.useDisableBodyScroll)(open && disableScrollOnOpen);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ModalWrapperContainer, {
     ref: optionsContainerRef,
     open: open,

package/dist/components/DateInput/components/ModalWrapper/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/DateInput/components/ModalWrapper/styles.ts"],"names":[],"mappings":";AAIA,UAAU,0BAA0B;IAClC,IAAI,EAAE,OAAO,CAAC;IAEd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;CACb;AAED,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uCAyBjC,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/DateInput/components/ModalWrapper/styles.ts"],"names":[],"mappings":";AAIA,UAAU,0BAA0B;IAClC,IAAI,EAAE,OAAO,CAAC;IAEd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;CACb;AAED,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uCAsBjC,CAAC"}

package/dist/components/DateInput/components/ModalWrapper/styles.js

@@ -27,6 +27,6 @@ var ModalWrapperContainer = (0, _styled.default)(_framerMotion.motion.div)(funct
   var theme = _ref.theme,
       props = _objectWithoutProperties(_ref, _excluded);
 
-  return (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      display: flex;\n      flex-direction: column;\n      width: auto;\n      position: fixed;\n      left: ", ";\n      top: ", ";\n      z-index: ", ";\n      opacity: ", ";\n      pointer-events: ", ";\n      transition: opacity ease ", ";\n      overflow-y: hidden;\n      overflow-x: hidden;\n      background: ", ";\n      /* border: 2px solid ", "; */\n      border-radius: ", ";\n      box-shadow: ", ";\n\n      li {\n        list-style: none;\n      }\n    "])), props.left, props.top, theme.zIndex.level24, props.open ? 1 : 0, props.open ? 'auto' : 'none', theme.transition.speed, theme.colors.background.light, theme.colors.neutral.neutral1, theme.borderRadius.default, theme.shadow.level3);
+  return (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      display: flex;\n      flex-direction: column;\n      width: auto;\n      position: fixed;\n      left: ", ";\n      top: ", ";\n      z-index: ", ";\n      opacity: ", ";\n      pointer-events: ", ";\n      transition: opacity ease ", ";\n      background: ", ";\n      border-radius: ", ";\n      box-shadow: ", ";\n\n      li {\n        list-style: none;\n      }\n    "])), props.left, props.top, theme.zIndex.level24, props.open ? 1 : 0, props.open ? 'auto' : 'none', theme.transition.speed, theme.colors.background.light, theme.borderRadius.default, theme.shadow.level3);
 });
 exports.ModalWrapperContainer = ModalWrapperContainer;

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

@@ -10,7 +10,5 @@ export interface ModalWrapperProps extends HTMLAttributes<HTMLDivElement> {
     offsetX?: string;
     /** The max width of the Modal. */
     maxWidth?: string | number;
-    /** Optional. Will disable the scroll body scroll. */
-    disableScrollOnOpen?: boolean;
 }
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/components/DateInput/components/ModalWrapper/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,iBAAkB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACvE,mCAAmC;IACnC,IAAI,EAAE,OAAO,CAAC;IAEd,sEAAsE;IACtE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qEAAqE;IACrE,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,gDAAgD;IAChD,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE3B,qDAAqD;IACrD,mBAAmB,CAAC,EAAE,OAAO,CAAC;CAC/B"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/components/DateInput/components/ModalWrapper/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,iBAAkB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACvE,mCAAmC;IACnC,IAAI,EAAE,OAAO,CAAC;IAEd,sEAAsE;IACtE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qEAAqE;IACrE,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,gDAAgD;IAChD,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC5B"}

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;AAGzC,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,eAyFhB"}
+{"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"}

package/dist/components/DateInput/index.js

@@ -19,6 +19,8 @@ var _DatePicker = _interopRequireDefault(require("../DatePicker"));
 
 var _ModalWrapper = require("./components/ModalWrapper");
 
+var _useDisableBodyScroll = require("../../shared/hooks/useDisableBodyScroll");
+
 var _jsxRuntime = require("react/jsx-runtime");
 
 var _excluded = ["label", "placeholder", "alert", "helperText", "value", "locales", "localeOptions", "onChange", "disabled"];
@@ -47,9 +49,8 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-// TODO: Mudar a posição do datepicker dependendo da posição dele aberto.
 function DateInput(_ref) {
-  var _containerRef$current, _optionsModalRef$curr, _containerRef$current3, _containerRef$current4, _containerRef$current5;
+  var _containerRef$current, _containerRef$current3, _containerRef$current4, _containerRef$current5;
 
   var label = _ref.label,
       placeholder = _ref.placeholder,
@@ -81,11 +82,6 @@ function DateInput(_ref) {
       datePickerOpen = _useState6[0],
       setDatePickerOpen = _useState6[1];
 
-  var _useState7 = (0, _react.useState)((_optionsModalRef$curr = optionsModalRef.current) === null || _optionsModalRef$curr === void 0 ? void 0 : _optionsModalRef$curr.getBoundingClientRect().height),
-      _useState8 = _slicedToArray(_useState7, 2),
-      heightModal = _useState8[0],
-      setHeightModal = _useState8[1];
-
   function selectDate(value) {
     setCurrentValue(value);
     setDatePickerOpen(false);
@@ -95,12 +91,12 @@ function DateInput(_ref) {
   (0, _react.useEffect)(function () {
     setCurrentValue(value);
   }, [value]);
+  (0, _useDisableBodyScroll.useDisableBodyScroll)(datePickerOpen);
 
   function handleRepositionModal() {
-    var _containerRef$current2, _optionsModalRef$curr2;
+    var _containerRef$current2;
 
-    setPositionContainer((_containerRef$current2 = containerRef.current) === null || _containerRef$current2 === void 0 ? void 0 : _containerRef$current2.getBoundingClientRect().top);
-    setHeightModal((_optionsModalRef$curr2 = optionsModalRef.current) === null || _optionsModalRef$curr2 === void 0 ? void 0 : _optionsModalRef$curr2.getBoundingClientRect().height);
+    setPositionContainer((_containerRef$current2 = containerRef.current) === null || _containerRef$current2 === void 0 ? void 0 : _containerRef$current2.getBoundingClientRect().top); // setHeightModal(optionsModalRef.current?.getBoundingClientRect().height);
   }
 
   var toggleOptionsAreaView = (0, _react.useCallback)(function (event) {
@@ -131,9 +127,9 @@ function DateInput(_ref) {
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ReactPortal.ReactPortal, {
         wrapperId: "portal-root",
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalWrapper.ModalWrapper, {
-          open: true,
+          open: datePickerOpen,
           left: "".concat((_containerRef$current3 = containerRef.current) === null || _containerRef$current3 === void 0 ? void 0 : _containerRef$current3.getBoundingClientRect().left, "px"),
-          top: Number(positionContainer) < 470 ? "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 - ").concat(heightModal && heightModal + 10, "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)"),
           ref: optionsModalRef,
           maxWidth: "auto",
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DatePicker.default, _objectSpread({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pedidopago/ui",
-  "version": "1.3.7",
+  "version": "1.3.8",
   "description": "Quick build beatiful Pedido Pago apps",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",