@pedidopago/ui 1.1.0 → 1.1.1

package/dist/components/Tabs/tabs.test.js

@@ -8,9 +8,11 @@ var _ = require(".");
 
 var _TabsExample = require("./TabsExample");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 describe('Tabs', function () {
   it('should it render tabs components', function () {
-    var _render = (0, _testUtils.render)( /*#__PURE__*/React.createElement(_TabsExample.TabsExample, {
+    var _render = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabsExample.TabsExample, {
       value: 1,
       onChangeTab: function onChangeTab() {}
     })),
@@ -19,96 +21,111 @@ describe('Tabs', function () {
     expect(container).toBeInTheDocument();
   });
   it('should it render with initial value', function () {
-    var _render2 = (0, _testUtils.render)( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_.Tabs, {
-      value: 1,
-      onChangeTab: jest.fn()
-    }, /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 1",
-      value: "1"
-    }), /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 2",
-      value: "2"
-    }), /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 3",
-      value: "3"
-    })))),
+    var _render2 = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.Tabs, {
+        value: 1,
+        onChangeTab: jest.fn(),
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 1",
+          value: "1"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 2",
+          value: "2"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 3",
+          value: "3"
+        })]
+      })
+    })),
         container = _render2.container;
 
     expect(container).toBeInTheDocument();
   });
   it('should it render with disabled prop', function () {
-    var _render3 = (0, _testUtils.render)( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_.Tabs, {
-      value: 1,
-      onChangeTab: jest.fn()
-    }, /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 1",
-      value: "1",
-      disabled: true
-    }), /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 2",
-      value: "2"
-    }), /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 3",
-      value: "3"
-    })))),
+    var _render3 = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.Tabs, {
+        value: 1,
+        onChangeTab: jest.fn(),
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 1",
+          value: "1",
+          disabled: true
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 2",
+          value: "2"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 3",
+          value: "3"
+        })]
+      })
+    })),
         container = _render3.container;
 
     expect(container).toBeInTheDocument();
     expect(container.querySelector('#simple-tab-1')).toBeDisabled();
   });
   it('should it render with loading prop', function () {
-    var _render4 = (0, _testUtils.render)( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_.Tabs, {
-      value: 1,
-      onChangeTab: jest.fn(),
-      isLoading: true
-    }, /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 1",
-      value: "1"
-    }), /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 2",
-      value: "2"
-    }), /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 3",
-      value: "3"
-    })))),
+    var _render4 = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.Tabs, {
+        value: 1,
+        onChangeTab: jest.fn(),
+        isLoading: true,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 1",
+          value: "1"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 2",
+          value: "2"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 3",
+          value: "3"
+        })]
+      })
+    })),
         container = _render4.container;
 
     expect(container).toBeInTheDocument();
   });
   it('should it render with centered prop', function () {
-    var _render5 = (0, _testUtils.render)( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_.Tabs, {
-      value: 1,
-      onChangeTab: jest.fn(),
-      centered: true
-    }, /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 1",
-      value: "1"
-    }), /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 2",
-      value: "2"
-    }), /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 3",
-      value: "3"
-    })))),
+    var _render5 = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.Tabs, {
+        value: 1,
+        onChangeTab: jest.fn(),
+        centered: true,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 1",
+          value: "1"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 2",
+          value: "2"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 3",
+          value: "3"
+        })]
+      })
+    })),
         container = _render5.container;
 
     expect(container).toBeInTheDocument();
   });
   it('should it render with fullWidth prop', function () {
-    var _render6 = (0, _testUtils.render)( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_.Tabs, {
-      value: 1,
-      onChangeTab: jest.fn(),
-      fullWidth: true
-    }, /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 1",
-      value: "1"
-    }), /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 2",
-      value: "2"
-    }), /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 3",
-      value: "3"
-    })))),
+    var _render6 = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.Tabs, {
+        value: 1,
+        onChangeTab: jest.fn(),
+        fullWidth: true,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 1",
+          value: "1"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 2",
+          value: "2"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 3",
+          value: "3"
+        })]
+      })
+    })),
         container = _render6.container;
 
     expect(container).toBeInTheDocument();
@@ -116,19 +133,22 @@ describe('Tabs', function () {
   it('should it call the on change function when the tab is clicked', function () {
     var onChangeTab = jest.fn();
 
-    var _render7 = (0, _testUtils.render)( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_.Tabs, {
-      value: 1,
-      onChangeTab: onChangeTab
-    }, /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 1",
-      value: "1"
-    }), /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 2",
-      value: "2"
-    }), /*#__PURE__*/React.createElement(_.Tab, {
-      label: "Tab 3",
-      value: "3"
-    })))),
+    var _render7 = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.Tabs, {
+        value: 1,
+        onChangeTab: onChangeTab,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 1",
+          value: "1"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 2",
+          value: "2"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Tab, {
+          label: "Tab 3",
+          value: "3"
+        })]
+      })
+    })),
         container = _render7.container;
 
     var tab = container.querySelector('#simple-tab-2');

package/dist/components/Tag/index.js

@@ -11,6 +11,8 @@ var _Icon = _interopRequireDefault(require("../Icon"));
 
 var _styles = require("./styles");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 var Tag = function Tag(_ref) {
@@ -27,24 +29,27 @@ var Tag = function Tag(_ref) {
     lg: '8px'
   };
   if (!label) return null;
-  return /*#__PURE__*/React.createElement(_styles.Wrapper, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Wrapper, {
     fillColor: fillColor,
     overtoneHue: fillColor && (0, _invertColor.invertColor)(fillColor, true),
-    size: size ? sizes[size] : sizes.md
-  }, leftIcon && /*#__PURE__*/React.createElement(_Icon.default, {
-    name: leftIcon,
-    size: size === 'lg' ? '15' : '13'
-  }), /*#__PURE__*/React.createElement(_styles.Text, {
-    overtoneHue: fillColor && (0, _invertColor.invertColor)(fillColor, true),
-    isLarge: size === 'lg'
-  }, label), /*#__PURE__*/React.createElement(_styles.Close, {
-    onClick: onClick,
-    overtoneHue: fillColor && (0, _invertColor.invertColor)(fillColor, true),
-    fillColor: fillColor
-  }, /*#__PURE__*/React.createElement(_Icon.default, {
-    name: rightIcon || 'x-circle',
-    size: size === 'lg' ? '15' : '13'
-  })));
+    size: size ? sizes[size] : sizes.md,
+    children: [leftIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
+      name: leftIcon,
+      size: size === 'lg' ? '15' : '13'
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Text, {
+      overtoneHue: fillColor && (0, _invertColor.invertColor)(fillColor, true),
+      isLarge: size === 'lg',
+      children: label
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Close, {
+      onClick: onClick,
+      overtoneHue: fillColor && (0, _invertColor.invertColor)(fillColor, true),
+      fillColor: fillColor,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
+        name: rightIcon || 'x-circle',
+        size: size === 'lg' ? '15' : '13'
+      })
+    })]
+  });
 };
 
 var _default = Tag;

package/dist/components/Tag/tag.test.js

@@ -8,17 +8,19 @@ require("@testing-library/jest-dom");
 
 var _ = _interopRequireDefault(require("."));
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 describe('Tag', function () {
   it('Should render tag with correct text values', function () {
-    (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.default, {
+    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
       label: "any_label"
     }));
     expect(_react.screen.getByText('any_label')).toBeInTheDocument();
   });
   it('Should not render tag component if label not provided', function () {
-    var _render = (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.default, {
+    var _render = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
       label: ""
     })),
         container = _render.container;
@@ -28,7 +30,7 @@ describe('Tag', function () {
   it('Should render button inside tag', function () {
     var _screen$getByText$nex;
 
-    (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.default, {
+    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
       label: "any_label"
     }));
     expect((_screen$getByText$nex = _react.screen.getByText('any_label').nextElementSibling) === null || _screen$getByText$nex === void 0 ? void 0 : _screen$getByText$nex.tagName).toBe('BUTTON');
@@ -36,7 +38,7 @@ describe('Tag', function () {
   it('Should Must always render icons at the ends of the tag', function () {
     var _screen$getByRole$fir;
 
-    (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.default, {
+    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
       label: "any_label"
     }));
     expect((_screen$getByRole$fir = _react.screen.getByRole('button').firstElementChild) === null || _screen$getByRole$fir === void 0 ? void 0 : _screen$getByRole$fir.tagName).toBe('svg');
@@ -44,7 +46,7 @@ describe('Tag', function () {
   it('Should render left icon if leftIcon is provided', function () {
     var _screen$getByRole$fir2, _screen$getByText$pre;
 
-    (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.default, {
+    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
       label: "any_label",
       leftIcon: "plus"
     }));
@@ -53,7 +55,7 @@ describe('Tag', function () {
   });
   it('Should call onClick mehod if onClick is provided', function () {
     var fn = jest.fn();
-    (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.default, {
+    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
       label: "any_label",
       onClick: fn
     }));
@@ -63,7 +65,7 @@ describe('Tag', function () {
     expect(fn).toBeCalled();
   });
   it('Should render with custom colors', function () {
-    (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.default, {
+    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
       label: "any_label",
       fillColor: "#4C2DC8"
     }));

package/dist/components/TextAreaInput/index.js

@@ -9,9 +9,15 @@ var _react = require("react");
 
 var _styles = require("./styles");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 var _excluded = ["label", "isInvalid", "alertType", "isDisabled", "helpText", "maxWidth", "height"];
 
-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 _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
@@ -44,21 +50,25 @@ var TextAreaInput = function TextAreaInput(_ref) {
       textValue = _useState2[0],
       setTextValue = _useState2[1];
 
-  return /*#__PURE__*/React.createElement(_styles.Wrapper, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Wrapper, {
     maxWidth: maxWidth,
-    height: height
-  }, /*#__PURE__*/React.createElement(_styles.TextArea, _extends({
-    isInvalid: isInvalid,
-    alertType: alertType,
-    disabled: isDisabled,
-    value: textValue,
-    onChange: function onChange(_ref2) {
-      var target = _ref2.target;
-      return setTextValue(target.value);
-    }
-  }, args, args.formRegister)), /*#__PURE__*/React.createElement(_styles.Label, null, label), isInvalid && helpText && /*#__PURE__*/React.createElement(_styles.HelpText, {
-    alertType: alertType
-  }, helpText));
+    height: height,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.TextArea, _objectSpread(_objectSpread({
+      isInvalid: isInvalid,
+      alertType: alertType,
+      disabled: isDisabled,
+      value: textValue,
+      onChange: function onChange(_ref2) {
+        var target = _ref2.target;
+        return setTextValue(target.value);
+      }
+    }, args), args.formRegister)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Label, {
+      children: label
+    }), isInvalid && helpText && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.HelpText, {
+      alertType: alertType,
+      children: helpText
+    })]
+  });
 };
 
 var _default = TextAreaInput;

package/dist/components/TextAreaInput/text-area-input.test.js

@@ -8,12 +8,18 @@ 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 _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; }
 
 var makeSut = function makeSut(props) {
-  var sut = (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.default, _extends({
+  var sut = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, _objectSpread({
     label: "Any Label",
     placeholder: "any placeholder"
   }, props)));

package/dist/components/Thumbnail/index.js

@@ -19,6 +19,8 @@ var _utils = require("./utils");
 
 var _styles = require("./styles");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
@@ -129,64 +131,73 @@ function Thumbnail(_ref) {
     }
   }
 
-  return /*#__PURE__*/React.createElement(React.Fragment, null, !thumbImage.preview ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_styles.FileWrapper, {
-    size: wrapperSize[size],
-    grayColor: colors.grayColor,
-    darkGray: colors.darkGray,
-    darkerGray: colors.darkerGray,
-    borderGray: colors.borderGray
-  }, /*#__PURE__*/React.createElement(_styles.FileInput, {
-    "aria-label": "Clique para adicionar uma foto"
-  }, /*#__PURE__*/React.createElement("input", {
-    type: "file",
-    onChange: handleChange
-  }), /*#__PURE__*/React.createElement(_Icon.default, {
-    name: "plus-circle",
-    color: colors.borderGray,
-    size: 22
-  }))), helpText && /*#__PURE__*/React.createElement(_styles.HelpText, {
-    textColor: colors.textColor
-  }, helpText)) : /*#__PURE__*/React.createElement(_styles.ThumbWrapper, {
-    style: !checked ? {
-      borderColor: hover ? colors.borderGray : 'transparent'
-    } : undefined,
-    selectedColor: colors.selectedColor,
-    grayColor: colors.grayColor,
-    darkGray: colors.darkGray,
-    borderGray: colors.borderGray,
-    onMouseEnter: function onMouseEnter() {
-      if (thumbImage.preview) setHover(true);
-    },
-    onMouseLeave: function onMouseLeave() {
-      if (thumbImage.preview) setHover(false);
-    },
-    toBeSelected: checked,
-    isFileInput: !thumbImage.preview,
-    size: wrapperSize[size],
-    onClick: function onClick() {
-      if (thumbImage.preview) setChecked(true);
-    }
-  }, /*#__PURE__*/React.createElement(_styles.PreviewImage, {
-    src: thumbImage.preview,
-    alt: thumbImage.alt,
-    sizeImage: previewImageSize[size]
-  }), /*#__PURE__*/React.createElement(_styles.SelectRadio, {
-    showRadio: hover || checked
-  }, /*#__PURE__*/React.createElement(_styles.InputRadio, {
-    type: "radio",
-    checked: checked,
-    onChange: function onChange(e) {
-      setChecked(true);
-      onSelect === null || onSelect === void 0 ? void 0 : onSelect(e);
-    },
-    selectedColor: colors.selectedColor,
-    borderGray: colors.borderGray
-  }), checked && /*#__PURE__*/React.createElement(_Icon.default, {
-    name: "check",
-    color: "neutral.white",
-    size: "16"
-  })), isUploading && /*#__PURE__*/React.createElement(_Spinner.default, {
-    emptyColor: "neutral.neutral2",
-    color: colors.selectedColor
-  })));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: !thumbImage.preview ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.FileWrapper, {
+        size: wrapperSize[size],
+        grayColor: colors.grayColor,
+        darkGray: colors.darkGray,
+        darkerGray: colors.darkerGray,
+        borderGray: colors.borderGray,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.FileInput, {
+          "aria-label": "Clique para adicionar uma foto",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+            type: "file",
+            onChange: handleChange
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
+            name: "plus-circle",
+            color: colors.borderGray,
+            size: 22
+          })]
+        })
+      }), helpText && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.HelpText, {
+        textColor: colors.textColor,
+        children: helpText
+      })]
+    }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.ThumbWrapper, {
+      style: !checked ? {
+        borderColor: hover ? colors.borderGray : 'transparent'
+      } : undefined,
+      selectedColor: colors.selectedColor,
+      grayColor: colors.grayColor,
+      darkGray: colors.darkGray,
+      borderGray: colors.borderGray,
+      onMouseEnter: function onMouseEnter() {
+        if (thumbImage.preview) setHover(true);
+      },
+      onMouseLeave: function onMouseLeave() {
+        if (thumbImage.preview) setHover(false);
+      },
+      toBeSelected: checked,
+      isFileInput: !thumbImage.preview,
+      size: wrapperSize[size],
+      onClick: function onClick() {
+        if (thumbImage.preview) setChecked(true);
+      },
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.PreviewImage, {
+        src: thumbImage.preview,
+        alt: thumbImage.alt,
+        sizeImage: previewImageSize[size]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.SelectRadio, {
+        showRadio: hover || checked,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.InputRadio, {
+          type: "radio",
+          checked: checked,
+          onChange: function onChange(e) {
+            setChecked(true);
+            onSelect === null || onSelect === void 0 ? void 0 : onSelect(e);
+          },
+          selectedColor: colors.selectedColor,
+          borderGray: colors.borderGray
+        }), checked && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
+          name: "check",
+          color: "neutral.white",
+          size: "16"
+        })]
+      }), isUploading && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Spinner.default, {
+        emptyColor: "neutral.neutral2",
+        color: colors.selectedColor
+      })]
+    })
+  });
 }

package/dist/components/Thumbnail/thumbnail.test.js

@@ -10,10 +10,18 @@ var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
 
 var _ = 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; }
+
+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 makeSut = function makeSut(props) {
-  var _render = (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.Thumbnail, props)),
+  var _render = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Thumbnail, _objectSpread({}, props))),
       container = _render.container;
 
   var file = new File(['any_content'], 'any_name.png', {

package/dist/components/Timeline/components/Timeline.js

@@ -9,6 +9,8 @@ var _react = require("@emotion/react");
 
 var _styles = require("../styles");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 var Timeline = function Timeline(_ref) {
   var children = _ref.children,
       _ref$position = _ref.position,
@@ -19,13 +21,15 @@ var Timeline = function Timeline(_ref) {
     right: 'row-reverse',
     alternate: 'alternate'
   };
-  return /*#__PURE__*/React.createElement(_react.ThemeProvider, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.ThemeProvider, {
     theme: {
       position: flexDirections[position]
-    }
-  }, /*#__PURE__*/React.createElement(_styles.TimelineContainer, {
-    fullWidth: fullWidth
-  }, children));
+    },
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.TimelineContainer, {
+      fullWidth: fullWidth,
+      children: children
+    })
+  });
 };
 
 exports.Timeline = Timeline;