@pedidopago/ui 1.3.20 → 1.3.23

package/dist/components/Progress/style.js

@@ -95,7 +95,7 @@ var Value = _styled.default.div(_templateObject5 || (_templateObject5 = _taggedT
 
 exports.Value = Value;
 
-var SVGArea = _styled.default.svg(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  width: ", "px;\n  height: ", "px;\n"])), function (_ref19) {
+var SVGArea = _styled.default.svg(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  width: ", "px;\n  height: ", "px;\n  transform: rotate(-90deg);\n"])), function (_ref19) {
   var size = _ref19.size;
   return size || 101;
 }, function (_ref20) {

package/dist/components/Select/components/OptionsSelect/index.js

@@ -76,7 +76,7 @@ var OptionsSelect = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
       }
     });
   });
-  (0, _useDisableBodyScroll.useDisableBodyScroll)(open && disableScrollOnOpen);
+  (0, _useDisableBodyScroll.useDisableBodyScroll)(open && disableScrollOnOpen, 'child_element');
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.OptionsContainer, {
     ref: optionsContainerRef,
     open: open,

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

@@ -1,6 +1,7 @@
+import { ReactNode } from 'react';
 export declare type SelectAlertType = 'success' | 'error' | 'warning' | 'informative' | 'critical' | 'success_secondary' | 'warning_secondary';
 export interface SelectOption {
-    label: string;
+    label: ReactNode;
     value: string | number;
 }
 export declare type sizeSelect = 'sm' | 'md';

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Select/types.ts"],"names":[],"mappings":"AAAA,oBAAY,eAAe,GACvB,SAAS,GACT,OAAO,GACP,SAAS,GACT,aAAa,GACb,UAAU,GACV,mBAAmB,GACnB,mBAAmB,CAAC;AAExB,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,oBAAY,UAAU,GAAG,IAAI,GAAG,IAAI,CAAC;AAErC,MAAM,WAAW,WAAW;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;IACjC,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB;AAED,MAAM,WAAW,oBAAoB;IACnC,OAAO,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;IACjC,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Select/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,oBAAY,eAAe,GACvB,SAAS,GACT,OAAO,GACP,SAAS,GACT,aAAa,GACb,UAAU,GACV,mBAAmB,GACnB,mBAAmB,CAAC;AAExB,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,oBAAY,UAAU,GAAG,IAAI,GAAG,IAAI,CAAC;AAErC,MAAM,WAAW,WAAW;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;IACjC,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB;AAED,MAAM,WAAW,oBAAoB;IACnC,OAAO,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;IACjC,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB"}

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

@@ -15,12 +15,12 @@ export declare type ISkeletonProps = {
      * The width of the skeleton
      * @default '100%'
      */
-    width?: number;
+    width?: number | string;
     /**
      * The height of the skeleton
      * @default '100%'
      */
-    height?: number;
+    height?: number | string;
     /**
      * The color of the skeleton
      * @default '#EEEEEE'

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Skeleton/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAEnE,oBAAY,cAAc,GAAG;IAC3B;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,QAAQ,CAAC;IAC1C;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;IACxC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,iBAAiB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAC1C;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Skeleton/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAEnE,oBAAY,cAAc,GAAG;IAC3B;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,QAAQ,CAAC;IAC1C;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;IACxC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB;;;OAGG;IACH,KAAK,CAAC,EAAE,iBAAiB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAC1C;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC"}

package/dist/components/Toast/contexts/ToastProvider.js

@@ -50,7 +50,7 @@ var ToastProvider = function ToastProvider(_ref) {
       toasts = _useState2[0],
       setToasts = _useState2[1];
 
-  var addToast = function addToast(options) {
+  var addToast = (0, _react.useCallback)(function (options) {
     var toastOptions = {
       config: _objectSpread(_objectSpread({}, options), {}, {
         icon: options.icon || 'info',
@@ -62,8 +62,7 @@ var ToastProvider = function ToastProvider(_ref) {
       id: Math.random().toString(36).substring(2, 9)
     };
     setToasts([].concat(_toConsumableArray(toasts), [toastOptions]));
-  };
-
+  }, []);
   var remoteToast = (0, _react.useCallback)(function (id) {
     setToasts(function (prevState) {
       var _filterToast$0$config, _filterToast$0$config2;

package/dist/shared/hooks/useDisableBodyScroll.d.ts

@@ -1,2 +1,2 @@
-export declare const useDisableBodyScroll: (disable: boolean) => void;
+export declare const useDisableBodyScroll: (disable: boolean, type?: 'modal' | 'child_element') => void;
 //# sourceMappingURL=useDisableBodyScroll.d.ts.map

package/dist/shared/hooks/useDisableBodyScroll.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useDisableBodyScroll.d.ts","sourceRoot":"","sources":["../../../src/shared/hooks/useDisableBodyScroll.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,oBAAoB,YAAa,OAAO,SAWpD,CAAC"}
+{"version":3,"file":"useDisableBodyScroll.d.ts","sourceRoot":"","sources":["../../../src/shared/hooks/useDisableBodyScroll.tsx"],"names":[],"mappings":"AAoCA,eAAO,MAAM,oBAAoB,YACtB,OAAO,SACV,OAAO,GAAG,eAAe,SAehC,CAAC"}

package/dist/shared/hooks/useDisableBodyScroll.js

@@ -7,17 +7,56 @@ exports.useDisableBodyScroll = void 0;
 
 var _react = require("react");
 
+function disableBodyOverflow() {
+  var scrollBarWidth = window.innerWidth - document.documentElement.clientWidth;
+  document.body.style.paddingRight = "".concat(scrollBarWidth, "px");
+  document.body.style.overflow = 'hidden';
+}
+
+function enableBodyOverflow() {
+  document.body.style.overflow = '';
+  document.body.style.paddingRight = '';
+}
+
+function setBodyOverflow(disable, type) {
+  // disable body scroll when type modal:
+  if (disable && type === 'modal') {
+    document.body.setAttribute('data-modal-open', 'true');
+    return disableBodyOverflow();
+  } // enable body scroll when type modal:
+
+
+  if (!disable && type === 'modal') {
+    document.body.setAttribute('data-modal-open', 'false');
+    return enableBodyOverflow();
+  } // disable body scroll when type child_element:
+
+
+  if (disable && type === 'child_element') {
+    if (document.body.getAttribute('data-modal-open') === 'true') return;
+    return disableBodyOverflow();
+  } // enable body scroll when type child_element:
+
+
+  if (!disable && type === 'child_element') {
+    if (document.body.getAttribute('data-modal-open') === 'true') return;
+    return enableBodyOverflow();
+  }
+}
+
 var useDisableBodyScroll = function useDisableBodyScroll(disable) {
+  var type = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'child_element';
   (0, _react.useEffect)(function () {
-    if (disable) {
-      var scrollBarWidth = window.innerWidth - document.documentElement.clientWidth;
-      document.body.style.paddingRight = "".concat(scrollBarWidth, "px");
-      document.body.style.overflow = 'hidden';
-    } else {
-      document.body.style.overflow = '';
-      document.body.style.paddingRight = '';
-    }
-  }, [disable]);
+    setBodyOverflow(disable, type);
+    document.body.addEventListener('data-modal-open', function () {
+      setBodyOverflow(disable, type);
+    });
+    return function () {
+      document.body.removeEventListener('data-modal-open', function () {
+        setBodyOverflow(disable, type);
+      });
+    };
+  }, [disable, type]);
 };
 
 exports.useDisableBodyScroll = useDisableBodyScroll;

package/dist/utils/getColorValue.d.ts

@@ -289,4 +289,5 @@ export declare const getColorValue: (color: string, theme?: {
         level48: string;
     };
 } | undefined, defaultValue?: string | undefined) => string;
+export declare const getThemeHex: (path: string, obj: object, separator?: string) => any;
 //# sourceMappingURL=getColorValue.d.ts.map

package/dist/utils/getColorValue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"getColorValue.d.ts","sourceRoot":"","sources":["../../src/utils/getColorValue.ts"],"names":[],"mappings":"AAIA;;;;;;;;GAQG;AACH,eAAO,MAAM,aAAa,UACjB,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qDAGZ,MAMF,CAAC"}
+{"version":3,"file":"getColorValue.d.ts","sourceRoot":"","sources":["../../src/utils/getColorValue.ts"],"names":[],"mappings":"AAIA;;;;;;;;GAQG;AACH,eAAO,MAAM,aAAa,UACjB,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qDAGZ,MAMF,CAAC;AAEF,eAAO,MAAM,WAAW,SAAU,MAAM,OAAO,MAAM,yBAAoB,GAGxE,CAAC"}

package/dist/utils/getColorValue.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getColorValue = void 0;
+exports.getThemeHex = exports.getColorValue = void 0;
 
 var _colorCheck = require("../utils/colorCheck");
 
@@ -22,4 +22,14 @@ var getColorValue = function getColorValue(color, theme, defaultValue) {
   return colorIsThemeColor || defaultValue || 'inherit';
 };
 
-exports.getColorValue = getColorValue;
+exports.getColorValue = getColorValue;
+
+var getThemeHex = function getThemeHex(path, obj) {
+  var separator = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '.';
+  var properties = path.split(separator);
+  return properties.reduce(function (prev, curr) {
+    return prev && prev[curr];
+  }, obj);
+};
+
+exports.getThemeHex = getThemeHex;

package/package.json

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