@pedidopago/ui 1.1.0 → 1.1.1

package/dist/components/Toast/toast.test.js

@@ -8,10 +8,20 @@ var _buttonExample = _interopRequireDefault(require("./button-example"));
 
 var _ToastProvider = _interopRequireDefault(require("./contexts/ToastProvider"));
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 var setup = function setup(props) {
-  return (0, _testUtils.render)( /*#__PURE__*/React.createElement(_ToastProvider.default, null, /*#__PURE__*/React.createElement(_buttonExample.default, props)));
+  return (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ToastProvider.default, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_buttonExample.default, _objectSpread({}, props))
+  }));
 };
 
 describe('Toast', function () {

package/dist/components/Tooltip/componenteTeste.js

@@ -8,32 +8,60 @@ exports.TesteComponent = TesteComponent;
 
 var _Input = _interopRequireDefault(require("../Input"));
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function TesteComponent(_ref) {
   var theme = _ref.theme;
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     style: {
       padding: 10,
       width: 200,
       color: 'white'
-    }
-  }, /*#__PURE__*/React.createElement("p", null, "Estat\xEDsticas das transa\xE7\xF5es \xE9 dividida em duas partes:"), /*#__PURE__*/React.createElement("h3", {
-    style: {
-      color: theme.colors.primary.default
-    }
-  }, "\xCDndice de convers\xE3o"), /*#__PURE__*/React.createElement("p", null, "\xC9 a raz\xE3o entre o n\xFAmero de visitantes de uma loja e a quantidade de compras, efetivamente separadas por."), /*#__PURE__*/React.createElement("ul", null, /*#__PURE__*/React.createElement("li", null, "Convers\xE3o no cr\xE9tido"), /*#__PURE__*/React.createElement("li", null, "Convers\xE3o no pix"), /*#__PURE__*/React.createElement("li", null, "Convers\xE3o no boleto")), /*#__PURE__*/React.createElement("h3", {
-    style: {
-      color: theme.colors.primary.default
-    }
-  }, "Forma de pagamento"), /*#__PURE__*/React.createElement("p", null, "Trata-se apenas das porcentagens entre:"), /*#__PURE__*/React.createElement("ul", null, /*#__PURE__*/React.createElement("li", null, "Convers\xE3o no cr\xE9tido"), /*#__PURE__*/React.createElement("li", null, "Convers\xE3o no pix"), /*#__PURE__*/React.createElement("li", null, "Convers\xE3o no boleto")));
+    },
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+      children: "Estat\xEDsticas das transa\xE7\xF5es \xE9 dividida em duas partes:"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("h3", {
+      style: {
+        color: theme.colors.primary.default
+      },
+      children: "\xCDndice de convers\xE3o"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+      children: "\xC9 a raz\xE3o entre o n\xFAmero de visitantes de uma loja e a quantidade de compras, efetivamente separadas por."
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("ul", {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+        children: "Convers\xE3o no cr\xE9tido"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+        children: "Convers\xE3o no pix"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+        children: "Convers\xE3o no boleto"
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("h3", {
+      style: {
+        color: theme.colors.primary.default
+      },
+      children: "Forma de pagamento"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+      children: "Trata-se apenas das porcentagens entre:"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("ul", {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+        children: "Convers\xE3o no cr\xE9tido"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+        children: "Convers\xE3o no pix"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+        children: "Convers\xE3o no boleto"
+      })]
+    })]
+  });
 }
 
 function ComponentTeste() {
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     style: {
       margin: '0 auto',
       width: 200
-    }
-  }, /*#__PURE__*/React.createElement(_Input.default, null));
+    },
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Input.default, {})
+  });
 }

package/dist/components/Tooltip/index.js

@@ -17,6 +17,8 @@ var _framerMotion = require("framer-motion");
 
 var _Icon = _interopRequireDefault(require("../Icon"));
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 var _excluded = ["position", "heightToExpand", "maxWidth", "label", "labelColor", "expandable", "hasArrow", "isOpen", "isExpanded", "animationDuration", "backgroundColor", "width", "children"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -75,55 +77,63 @@ var Tooltip = function Tooltip(_ref) {
       expanded = _useState4[0],
       setExpanded = _useState4[1];
 
-  return /*#__PURE__*/React.createElement(_styles.TooltipComponentWrapper, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.TooltipComponentWrapper, {
     hasArrow: hasArrow,
     position: position,
-    backgroundColor: backgroundColor
-  }, /*#__PURE__*/React.createElement(_styles.TooltipTarget, {
-    onMouseEnter: function onMouseEnter() {
-      return setShowTooltip(true);
-    },
-    onMouseLeave: function onMouseLeave() {
-      return setShowTooltip(false);
-    },
-    "data-testid": "tooltip-target"
-  }, children || /*#__PURE__*/React.createElement(_componenteTeste.ComponentTeste, null)), /*#__PURE__*/React.createElement(_framerMotion.AnimatePresence, null, (showTooltip || isExpanded || expanded || isOpen) && /*#__PURE__*/React.createElement(_styles.MotionDiv, {
-    initial: {
-      height: expandable ? expanded ? 'max-content' : heightToExpand : '',
-      opacity: 0
-    },
-    animate: {
-      height: expandable ? expanded || isExpanded ? 'max-content' : heightToExpand : '',
-      opacity: 1
-    },
-    exit: {
-      opacity: 0
-    },
-    transition: {
-      duration: animationDuration
-    },
-    onMouseEnter: function onMouseEnter() {
-      return setExpanded(true);
-    },
-    onMouseLeave: function onMouseLeave() {
-      return setExpanded(false);
-    },
-    className: "TooltipArea",
-    "data-testid": "tooltip-area",
-    position: position,
     backgroundColor: backgroundColor,
-    isLabelString: typeof label === 'string' && label.length > 0,
-    width: width,
-    maxWidth: maxWidth
-  }, /*#__PURE__*/React.createElement(_styles.TooltipWrapper, {
-    labelColor: labelColor
-  }, label || /*#__PURE__*/React.createElement(_componenteTeste.TesteComponent, {
-    theme: theme
-  })), expandable && !isExpanded && !expanded && /*#__PURE__*/React.createElement(_styles.TooltipDots, null, /*#__PURE__*/React.createElement(_Icon.default, {
-    name: "chevron-down",
-    size: "40px",
-    color: "neutral.white"
-  })))));
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.TooltipTarget, {
+      onMouseEnter: function onMouseEnter() {
+        return setShowTooltip(true);
+      },
+      onMouseLeave: function onMouseLeave() {
+        return setShowTooltip(false);
+      },
+      "data-testid": "tooltip-target",
+      children: children || /*#__PURE__*/(0, _jsxRuntime.jsx)(_componenteTeste.ComponentTeste, {})
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_framerMotion.AnimatePresence, {
+      children: (showTooltip || isExpanded || expanded || isOpen) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.MotionDiv, {
+        initial: {
+          height: expandable ? expanded ? 'max-content' : heightToExpand : '',
+          opacity: 0
+        },
+        animate: {
+          height: expandable ? expanded || isExpanded ? 'max-content' : heightToExpand : '',
+          opacity: 1
+        },
+        exit: {
+          opacity: 0
+        },
+        transition: {
+          duration: animationDuration
+        },
+        onMouseEnter: function onMouseEnter() {
+          return setExpanded(true);
+        },
+        onMouseLeave: function onMouseLeave() {
+          return setExpanded(false);
+        },
+        className: "TooltipArea",
+        "data-testid": "tooltip-area",
+        position: position,
+        backgroundColor: backgroundColor,
+        isLabelString: typeof label === 'string' && label.length > 0,
+        width: width,
+        maxWidth: maxWidth,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.TooltipWrapper, {
+          labelColor: labelColor,
+          children: label || /*#__PURE__*/(0, _jsxRuntime.jsx)(_componenteTeste.TesteComponent, {
+            theme: theme
+          })
+        }), expandable && !isExpanded && !expanded && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.TooltipDots, {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
+            name: "chevron-down",
+            size: "40px",
+            color: "neutral.white"
+          })
+        })]
+      })
+    })]
+  });
 };
 
 var _default = Tooltip;

package/dist/components/Tooltip/tooltip.test.js

@@ -8,6 +8,8 @@ require("@testing-library/jest-dom/extend-expect");
 
 var _ = _interopRequireDefault(require("."));
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
@@ -21,7 +23,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 var setup = function setup(props) {
-  var utils = (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.default, props));
+  var utils = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, _objectSpread({}, props)));
   var TooltipTarget = utils.getByTestId('tooltip-target');
 
   var getTooltipMotion = function getTooltipMotion() {
@@ -35,11 +37,14 @@ var setup = function setup(props) {
 };
 
 function MockComponent() {
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     style: {
       height: 600
-    }
-  }, /*#__PURE__*/React.createElement("p", null, "Mocked"));
+    },
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+      children: "Mocked"
+    })
+  });
 }
 
 describe('Tooltip', function () {
@@ -51,7 +56,7 @@ describe('Tooltip', function () {
         switch (_context.prev = _context.next) {
           case 0:
             _setup = setup({
-              children: /*#__PURE__*/React.createElement(MockComponent, null)
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MockComponent, {})
             }), findByText = _setup.findByText;
             _context.next = 3;
             return findByText('Mocked');
@@ -75,7 +80,7 @@ describe('Tooltip', function () {
         switch (_context2.prev = _context2.next) {
           case 0:
             _setup2 = setup({
-              children: /*#__PURE__*/React.createElement(MockComponent, null),
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MockComponent, {}),
               label: 'MockLabel'
             }), findByText = _setup2.findByText, TooltipTarget = _setup2.TooltipTarget;
 
@@ -103,7 +108,7 @@ describe('Tooltip', function () {
         switch (_context3.prev = _context3.next) {
           case 0:
             _setup3 = setup({
-              children: /*#__PURE__*/React.createElement(MockComponent, null),
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MockComponent, {}),
               label: 'MockLabel',
               isOpen: true
             }), findByText = _setup3.findByText;
@@ -129,7 +134,7 @@ describe('Tooltip', function () {
         switch (_context4.prev = _context4.next) {
           case 0:
             _setup4 = setup({
-              children: /*#__PURE__*/React.createElement(MockComponent, null),
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MockComponent, {}),
               label: 'Mock label boladíssima',
               width: '100px'
             }), getTooltipMotion = _setup4.getTooltipMotion, TooltipTarget = _setup4.TooltipTarget;

package/dist/components/Typography/index.js

@@ -11,9 +11,15 @@ var _getColorValue = require("../../utils/getColorValue");
 
 var _styles = require("./styles");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 var _excluded = ["variant", "color", "children"];
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
@@ -32,10 +38,12 @@ var Typography = function Typography(_ref) {
       colorMode = _useColorMode.colorMode;
 
   var textColor = (0, _getColorValue.getColorValue)(color || (colorMode === 'dark' ? 'neutral.white' : 'neutral.black'), theme);
-  return /*#__PURE__*/React.createElement(_styles.StyledText, _extends({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StyledText, _objectSpread(_objectSpread({
     as: variant,
     textColor: textColor
-  }, rest), children);
+  }, rest), {}, {
+    children: children
+  }));
 };
 
 var _default = Typography;

package/dist/components/Typography/typography.test.js

@@ -6,6 +6,8 @@ require("@testing-library/jest-dom");
 
 var _ = _interopRequireDefault(require("."));
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -15,7 +17,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 var setup = function setup(props) {
-  var utils = (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.default, props));
+  var utils = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, _objectSpread({}, props)));
   return _objectSpread({}, utils);
 };
 

package/dist/shared/components/FocusLock/index.js

@@ -7,9 +7,15 @@ exports.default = void 0;
 
 var _react = require("react");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 var _excluded = ["isLocked", "children"];
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
@@ -83,9 +89,10 @@ var FocusLock = function FocusLock(_ref) {
       window.removeEventListener('keydown', handleKeyPress);
     };
   }, [isLocked, focusableItems]);
-  return /*#__PURE__*/React.createElement("div", _extends({}, otherProps, {
-    ref: rootNode
-  }), children);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, otherProps), {}, {
+    ref: rootNode,
+    children: children
+  }));
 };
 
 var _default = FocusLock;

package/dist/shared/tests/test-utils.js

@@ -11,6 +11,8 @@ var _useTheme2 = require("../theme/hooks/useTheme");
 
 var _react = require("@testing-library/react");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -23,10 +25,11 @@ var AllTheProviders = function AllTheProviders(_ref) {
   var _useTheme = (0, _useTheme2.useTheme)(),
       theme = _useTheme.theme;
 
-  return /*#__PURE__*/React.createElement(_ThemeContext.PPUIThemeProvider, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ThemeContext.PPUIThemeProvider, {
     initialColorMode: "light",
-    theme: theme
-  }, children);
+    theme: theme,
+    children: children
+  });
 };
 
 function customRender(ui, options) {

package/dist/shared/theme/button-example.js

@@ -9,6 +9,8 @@ var _styled = _interopRequireDefault(require("@emotion/styled"));
 
 var _ = require(".");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 var _templateObject;
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -28,11 +30,12 @@ var Button = function Button() {
 
   var colorBg = (0, _.useColorModeValue)('rgba(0, 0, 0, .1)', '#000');
   var colorText = (0, _.useColorModeValue)('#000', '#fff');
-  return /*#__PURE__*/React.createElement(StyledButton, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledButton, {
     colorBg: colorBg,
     colorText: colorText,
-    onClick: switchColorMode
-  }, "Toggle ", colorMode === 'light' ? 'dark' : 'light', " Mode");
+    onClick: switchColorMode,
+    children: ["Toggle ", colorMode === 'light' ? 'dark' : 'light', " Mode"]
+  });
 };
 
 exports.Button = Button;

package/dist/shared/theme/contexts/ThemeContext.js

@@ -16,6 +16,8 @@ var _ = require("..");
 
 var _localStorageController = require("../utils/localStorageController");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -65,15 +67,19 @@ function PPUIThemeProvider(_ref) {
     setColorMode(newColorMode);
   }
 
-  return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ThemeContext.Provider, {
     value: {
       theme: theme || _.defaultTheme,
       colorMode: colorMode,
       switchColorMode: switchColorMode
-    }
-  }, /*#__PURE__*/React.createElement(_react2.ThemeProvider, {
-    theme: _objectSpread(_objectSpread({}, theme || _.defaultTheme), {}, {
-      colorMode: colorMode ? 'dark' : 'light'
+    },
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_react2.ThemeProvider, {
+      theme: _objectSpread(_objectSpread({}, theme || _.defaultTheme), {}, {
+        colorMode: colorMode ? 'dark' : 'light'
+      }),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ToastProvider.default, {
+        children: children
+      })
     })
-  }, /*#__PURE__*/React.createElement(_ToastProvider.default, null, children)));
+  });
 }

package/dist/shared/theme/theme.test.js

@@ -6,12 +6,22 @@ require("@testing-library/jest-dom");
 
 var _ = require(".");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
 
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 var setup = function setup(props) {
-  var utils = (0, _react.render)( /*#__PURE__*/React.createElement(_.PPUIThemeProvider, props, props.children));
+  var utils = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.PPUIThemeProvider, _objectSpread(_objectSpread({}, props), {}, {
+    children: props.children
+  })));
   return utils;
 };
 
@@ -32,12 +42,14 @@ describe('Theme', function () {
               var _useTheme = (0, _.useTheme)(),
                   theme = _useTheme.theme;
 
-              return /*#__PURE__*/React.createElement("div", null, theme.colors.primary);
+              return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+                children: theme.colors.primary
+              });
             };
 
             utils = setup({
               theme: newTheme,
-              children: /*#__PURE__*/React.createElement(TestComponent, null)
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(TestComponent, {})
             });
             _context.t0 = expect;
             _context.next = 6;
@@ -60,14 +72,15 @@ describe('Theme', function () {
           colorMode = _useColorMode.colorMode,
           switchColorMode = _useColorMode.switchColorMode;
 
-      return /*#__PURE__*/React.createElement("button", {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
         "data-testid": "button-child",
-        onClick: switchColorMode
-      }, colorMode === 'light' ? 'Light mode' : 'Dark mode');
+        onClick: switchColorMode,
+        children: colorMode === 'light' ? 'Light mode' : 'Dark mode'
+      });
     };
 
     var utils = setup({
-      children: /*#__PURE__*/React.createElement(ChildComponent, null)
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ChildComponent, {})
     });
     expect(utils.getByTestId('button-child')).toHaveTextContent('Light mode');
 
@@ -83,14 +96,15 @@ describe('Theme', function () {
           switchColorMode = _useColorMode2.switchColorMode;
 
       var color = (0, _.useColorModeValue)('#ff0000', '#0000ff');
-      return /*#__PURE__*/React.createElement("button", {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
         "data-testid": "button-child",
-        onClick: switchColorMode
-      }, color);
+        onClick: switchColorMode,
+        children: color
+      });
     };
 
     var utils = setup({
-      children: /*#__PURE__*/React.createElement(ChildComponent, null)
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ChildComponent, {})
     });
     expect(utils.getByTestId('button-child')).toHaveTextContent('#ff0000');
 

package/package.json

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