@pedidopago/ui 1.1.0 → 1.1.4

package/dist/components/Tag/tag.test.d.ts

@@ -1,2 +1,2 @@
-import '@testing-library/jest-dom';
+import '@testing-library/jest-dom';
 //# sourceMappingURL=tag.test.d.ts.map

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/Tag/types.d.ts

@@ -1,10 +1,10 @@
-import { IconName } from '../Icon/types';
-export interface ITagProps {
-    label: string;
-    fillColor?: string;
-    leftIcon?: IconName;
-    rightIcon?: IconName;
-    size?: 'sm' | 'md' | 'lg';
-    onClick?: () => void;
-}
+import { IconName } from '../Icon/types';
+export interface ITagProps {
+    label: string;
+    fillColor?: string;
+    leftIcon?: IconName;
+    rightIcon?: IconName;
+    size?: 'sm' | 'md' | 'lg';
+    onClick?: () => void;
+}
 //# sourceMappingURL=types.d.ts.map

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

@@ -1,5 +1,5 @@
-import { FC } from 'react';
-import { ITextAreaInputProps } from './types';
-declare const TextAreaInput: FC<ITextAreaInputProps>;
-export default TextAreaInput;
+import { FC } from 'react';
+import { ITextAreaInputProps } from './types';
+declare const TextAreaInput: FC<ITextAreaInputProps>;
+export default TextAreaInput;
 //# sourceMappingURL=index.d.ts.map

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/styles.d.ts

@@ -1,19 +1,19 @@
-/// <reference types="react" />
-import { IStyledTextAreaInput } from './types';
-export declare const Wrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledTextAreaInput, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const Label: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledTextAreaInput, import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {}>;
-export declare const TextArea: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledTextAreaInput, import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, {}>;
-export declare const HelpText: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledTextAreaInput, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+/// <reference types="react" />
+import { IStyledTextAreaInput } from './types';
+export declare const Wrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledTextAreaInput, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Label: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledTextAreaInput, import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {}>;
+export declare const TextArea: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledTextAreaInput, import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, {}>;
+export declare const HelpText: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledTextAreaInput, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 //# sourceMappingURL=styles.d.ts.map

package/dist/components/TextAreaInput/text-area-input.test.d.ts

@@ -1,2 +1,2 @@
-import '@testing-library/jest-dom';
+import '@testing-library/jest-dom';
 //# sourceMappingURL=text-area-input.test.d.ts.map

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/TextAreaInput/types.d.ts

@@ -1,26 +1,26 @@
-import { ChangeEventHandler, Ref, TextareaHTMLAttributes } from 'react';
-export declare type AlertOptions = 'informative' | 'success' | 'warning' | 'error';
-export declare type formRegister = {
-    onChange: ChangeEventHandler<HTMLTextAreaElement>;
-    onBlur: ChangeEventHandler;
-    ref: Ref<any>;
-    name: string;
-};
-export interface ITextAreaInputProps extends TextareaHTMLAttributes<any> {
-    isDisabled?: boolean;
-    alertType?: AlertOptions;
-    isInvalid?: boolean;
-    label?: string;
-    helpText?: string;
-    maxWidth?: number | string;
-    height?: number | string;
-    formRegister?: formRegister;
-}
-export declare type IStyledTextAreaInput = {
-    height?: number | string;
-    maxWidth?: number | string;
-    isLoading?: boolean;
-    isInvalid?: boolean;
-    alertType?: AlertOptions;
-};
+import { ChangeEventHandler, Ref, TextareaHTMLAttributes } from 'react';
+export declare type AlertOptions = 'informative' | 'success' | 'warning' | 'error';
+export declare type formRegister = {
+    onChange: ChangeEventHandler<HTMLTextAreaElement>;
+    onBlur: ChangeEventHandler;
+    ref: Ref<any>;
+    name: string;
+};
+export interface ITextAreaInputProps extends TextareaHTMLAttributes<any> {
+    isDisabled?: boolean;
+    alertType?: AlertOptions;
+    isInvalid?: boolean;
+    label?: string;
+    helpText?: string;
+    maxWidth?: number | string;
+    height?: number | string;
+    formRegister?: formRegister;
+}
+export declare type IStyledTextAreaInput = {
+    height?: number | string;
+    maxWidth?: number | string;
+    isLoading?: boolean;
+    isInvalid?: boolean;
+    alertType?: AlertOptions;
+};
 //# sourceMappingURL=types.d.ts.map

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

@@ -1,4 +1,4 @@
-/// <reference types="react" />
-import { IThumbnailProps } from './types';
-export declare function Thumbnail({ src, alt, maxAllowedSize, color, isUploading, size, onSelect, getThumbImage, }: IThumbnailProps): JSX.Element;
+/// <reference types="react" />
+import { IThumbnailProps } from './types';
+export declare function Thumbnail({ src, alt, maxAllowedSize, color, isUploading, size, onSelect, getThumbImage, }: IThumbnailProps): JSX.Element;
 //# sourceMappingURL=index.d.ts.map

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/styles.d.ts

@@ -1,43 +1,43 @@
-/// <reference types="react" />
-import { IStyledThumbnail } from './types';
-export declare const Wrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledThumbnail, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const FileWrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledThumbnail & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    children?: import("react").ReactNode;
-} & {
-    theme?: import("@emotion/react").Theme | undefined;
-}, {}, {}>;
-export declare const ThumbWrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledThumbnail & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    children?: import("react").ReactNode;
-} & {
-    theme?: import("@emotion/react").Theme | undefined;
-}, {}, {}>;
-export declare const PreviewImage: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledThumbnail, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
-export declare const SelectRadio: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledThumbnail, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const FileInput: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {}>;
-export declare const InputRadio: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledThumbnail, import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {}>;
-export declare const HelpText: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledThumbnail, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+/// <reference types="react" />
+import { IStyledThumbnail } from './types';
+export declare const Wrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledThumbnail, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const FileWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledThumbnail & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export declare const ThumbWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledThumbnail & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export declare const PreviewImage: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledThumbnail, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
+export declare const SelectRadio: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledThumbnail, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const FileInput: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {}>;
+export declare const InputRadio: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledThumbnail, import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {}>;
+export declare const HelpText: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledThumbnail, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 //# sourceMappingURL=styles.d.ts.map

package/dist/components/Thumbnail/thumbnail.test.d.ts

@@ -1,2 +1,2 @@
-import '@testing-library/jest-dom';
+import '@testing-library/jest-dom';
 //# sourceMappingURL=thumbnail.test.d.ts.map

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/Thumbnail/types.d.ts

@@ -1,29 +1,29 @@
-import { ChangeEvent } from 'react';
-export interface IThumbnailProps {
-    src?: string;
-    alt?: string;
-    isUploading?: boolean;
-    maxAllowedSize?: number;
-    color?: string;
-    size?: 'sm' | 'md' | 'lg';
-    onSelect?: (event: ChangeEvent<HTMLInputElement>) => void;
-    getThumbImage?: (file: File) => void;
-}
-export declare type ImageState = {
-    preview: string;
-    alt?: string;
-};
-export interface IStyledThumbnail {
-    selectedColor?: string;
-    darkerGray?: string;
-    darkGray?: string;
-    grayColor?: string;
-    borderGray?: string;
-    showRadio?: boolean;
-    toBeSelected?: boolean;
-    size?: string;
-    sizeImage?: string;
-    isFileInput?: boolean;
-    textColor?: string;
-}
+import { ChangeEvent } from 'react';
+export interface IThumbnailProps {
+    src?: string;
+    alt?: string;
+    isUploading?: boolean;
+    maxAllowedSize?: number;
+    color?: string;
+    size?: 'sm' | 'md' | 'lg';
+    onSelect?: (event: ChangeEvent<HTMLInputElement>) => void;
+    getThumbImage?: (file: File) => void;
+}
+export declare type ImageState = {
+    preview: string;
+    alt?: string;
+};
+export interface IStyledThumbnail {
+    selectedColor?: string;
+    darkerGray?: string;
+    darkGray?: string;
+    grayColor?: string;
+    borderGray?: string;
+    showRadio?: boolean;
+    toBeSelected?: boolean;
+    size?: string;
+    sizeImage?: string;
+    isFileInput?: boolean;
+    textColor?: string;
+}
 //# sourceMappingURL=types.d.ts.map

package/dist/components/Thumbnail/utils/index.d.ts

@@ -1,3 +1,3 @@
-export * from './validate-file-size';
-export * from './validate-file-type';
+export * from './validate-file-size';
+export * from './validate-file-type';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Thumbnail/utils/validate-file-size.d.ts

@@ -1,2 +1,2 @@
-export declare function isValidFileSize(fileSize: number, maxAllowedSize: number): boolean;
+export declare function isValidFileSize(fileSize: number, maxAllowedSize: number): boolean;
 //# sourceMappingURL=validate-file-size.d.ts.map

package/dist/components/Thumbnail/utils/validate-file-type.d.ts

@@ -1,2 +1,2 @@
-export declare function isValidFileType(fileName: string): boolean;
+export declare function isValidFileType(fileName: string): boolean;
 //# sourceMappingURL=validate-file-type.d.ts.map