@pedidopago/ui 1.0.6

package/dist/components/Tag/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Tag/styles.ts"],"names":[],"mappings":";AAIA,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yGAmBnB,CAAC;AAEF,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;aAGN,OAAO;2GAUjB,CAAC;AAEF,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qHA4BjB,CAAC"}

package/dist/components/Tag/styles.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Wrapper = exports.Text = exports.Close = void 0;
+
+var _react = require("@emotion/react");
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+var Wrapper = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", ";\n"])), function (_ref) {
+  var theme = _ref.theme,
+      fillColor = _ref.fillColor,
+      overtoneHue = _ref.overtoneHue,
+      size = _ref.size;
+  return (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    padding: ", ";\n    background-color: ", ";\n    color: ", ";\n    border-radius: 6px;\n    box-sizing: border-box;\n    display: inline-flex;\n    align-items: center;\n    justify-content: space-between;\n    height: fit-content;\n  "])), size, fillColor || (theme.colorMode === 'dark' ? theme.colors.neutral.neutral5 : theme.colors.neutral.neutral1), overtoneHue || (theme.colorMode === 'dark' ? theme.colors.neutral.white : theme.colors.neutral.neutral5));
+});
+
+exports.Wrapper = Wrapper;
+
+var Text = _styled.default.span(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref2) {
+  var theme = _ref2.theme,
+      overtoneHue = _ref2.overtoneHue,
+      isLarge = _ref2.isLarge;
+  return (0, _react.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    color: ", ";\n    font-size: ", ";\n    line-height: 1;\n    margin-left: 6px;\n    margin-right: 10px;\n  "])), overtoneHue || (theme.colorMode === 'dark' ? theme.colors.neutral.white : theme.colors.neutral.neutral5), isLarge ? '16px' : theme.fontSizes.xxs);
+});
+
+exports.Text = Text;
+
+var Close = _styled.default.button(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref3) {
+  var theme = _ref3.theme,
+      overtoneHue = _ref3.overtoneHue,
+      fillColor = _ref3.fillColor;
+  return (0, _react.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    background: transparent;\n    color: ", ";\n    outline: 0;\n    cursor: pointer;\n    border: none;\n    border-radius: 50%;\n    padding: 10px 0;\n    padding: 2px;\n    ", "\n  "])), overtoneHue || (theme.colorMode === 'dark' ? theme.colors.neutral.white : theme.colors.neutral.neutral5), fillColor ? (0, _react.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n          &:active {\n            background-color: ", ";\n            filter: saturate(0.6);\n          }\n        "])), fillColor) : (0, _react.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n          &:active {\n            background-color: ", ";\n          }\n        "])), theme.colors.neutral.neutral2));
+});
+
+exports.Close = Close;

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"tag.test.d.ts","sourceRoot":"","sources":["../../../src/components/Tag/tag.test.tsx"],"names":[],"mappings":"AAGA,OAAO,2BAA2B,CAAC"}

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

@@ -0,0 +1,76 @@
+"use strict";
+
+var _react = require("@testing-library/react");
+
+var _testUtils = require("../../shared/tests/test-utils");
+
+require("@testing-library/jest-dom");
+
+var _ = _interopRequireDefault(require("."));
+
+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, {
+      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, {
+      label: ""
+    })),
+        container = _render.container;
+
+    expect(container.querySelector('svg')).not.toBeInTheDocument();
+  });
+  it('Should render button inside tag', function () {
+    var _screen$getByText$nex;
+
+    (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.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');
+  });
+  it('Should Must always render icons at the ends of the tag', function () {
+    var _screen$getByRole$fir;
+
+    (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.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');
+  });
+  it('Should render left icon if leftIcon is provided', function () {
+    var _screen$getByRole$fir2, _screen$getByText$pre;
+
+    (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.default, {
+      label: "any_label",
+      leftIcon: "plus"
+    }));
+    expect((_screen$getByRole$fir2 = _react.screen.getByRole('button').firstElementChild) === null || _screen$getByRole$fir2 === void 0 ? void 0 : _screen$getByRole$fir2.tagName).toBe('svg');
+    expect((_screen$getByText$pre = _react.screen.getByText('any_label').previousSibling) === null || _screen$getByText$pre === void 0 ? void 0 : _screen$getByText$pre.nodeName).toBe('svg');
+  });
+  it('Should call onClick mehod if onClick is provided', function () {
+    var fn = jest.fn();
+    (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.default, {
+      label: "any_label",
+      onClick: fn
+    }));
+
+    _react.fireEvent.click(_react.screen.getByRole('button'));
+
+    expect(fn).toBeCalled();
+  });
+  it('Should render with custom colors', function () {
+    (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.default, {
+      label: "any_label",
+      fillColor: "#4C2DC8"
+    }));
+
+    var wrapper = _react.screen.getByText('any_label').parentElement;
+
+    var style = window.getComputedStyle(wrapper).getPropertyValue('background-color');
+    expect(style).toBe('rgb(76, 45, 200)');
+  });
+});

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

@@ -0,0 +1,10 @@
+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/Tag/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Tag/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,SAAS,CAAC,EAAE,QAAQ,CAAC;IACrB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB"}

package/dist/components/Tag/types.js

@@ -0,0 +1 @@
+"use strict";

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

@@ -0,0 +1,5 @@
+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.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TextAreaInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;AAGrC,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAE9C,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,mBAAmB,CA2B1C,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/TextAreaInput/index.js

@@ -0,0 +1,65 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = require("react");
+
+var _styles = require("./styles");
+
+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 _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+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; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+var TextAreaInput = function TextAreaInput(_ref) {
+  var label = _ref.label,
+      isInvalid = _ref.isInvalid,
+      alertType = _ref.alertType,
+      isDisabled = _ref.isDisabled,
+      helpText = _ref.helpText,
+      maxWidth = _ref.maxWidth,
+      height = _ref.height,
+      args = _objectWithoutProperties(_ref, _excluded);
+
+  var _useState = (0, _react.useState)(''),
+      _useState2 = _slicedToArray(_useState, 2),
+      textValue = _useState2[0],
+      setTextValue = _useState2[1];
+
+  return /*#__PURE__*/React.createElement(_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));
+};
+
+var _default = TextAreaInput;
+exports.default = _default;

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

@@ -0,0 +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>, {}>;
+//# sourceMappingURL=styles.d.ts.map

package/dist/components/TextAreaInput/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/TextAreaInput/styles.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAE/C,eAAO,MAAM,OAAO;;;gIAOnB,CAAC;AAEF,eAAO,MAAM,KAAK;;;yIAYjB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;kJAyIpB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;kIAKpB,CAAC"}

package/dist/components/TextAreaInput/styles.js

@@ -0,0 +1,64 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Wrapper = exports.TextArea = exports.Label = exports.HelpText = void 0;
+
+var _react = require("@emotion/react");
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+var Wrapper = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref) {
+  var maxWidth = _ref.maxWidth,
+      height = _ref.height;
+  return (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    box-sizing: border-box;\n    max-width: ", ";\n    height: ", ";\n    position: relative;\n  "])), typeof maxWidth === 'number' ? maxWidth + 'px' : maxWidth, !height ? '70px' : typeof height === 'number' ? height + 'px' : height);
+});
+
+exports.Wrapper = Wrapper;
+
+var Label = _styled.default.label(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref2) {
+  var theme = _ref2.theme;
+  return (0, _react.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    font-size: ", ";\n    font-weight: ", ";\n    transition: 0.2s ease;\n    background-color: transparent;\n    line-height: 1;\n    position: absolute;\n    top: 20px;\n    left: 20px;\n    pointer-events: none;\n  "])), theme.fontSizes.xxs, theme.fontWeight['500']);
+});
+
+exports.Label = Label;
+
+var TextArea = _styled.default.textarea(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  ", "\n\n  ", ";\n\n  ", ";\n"])), function (_ref3) {
+  var theme = _ref3.theme;
+  return (0, _react.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    width: 100%;\n    height: 100%;\n    box-sizing: border-box;\n    padding: 20px;\n    border-radius: ", ";\n    border-width: 2px;\n    border-style: solid;\n    border-color: ", ";\n    color: ", ";\n    line-height: 1.4;\n    background-color: transparent;\n    font-family: inherit;\n    font-size: ", ";\n    font-weight: ", ";\n    outline: none;\n    resize: none;\n\n    &::placeholder {\n      color: ", ";\n    }\n\n    &:hover {\n      color: ", ";\n      border-color: ", ";\n    }\n\n    &:focus {\n      color: ", ";\n      border-color: ", ";\n      background-color: ", ";\n    }\n\n    &:hover + label {\n      color: ", ";\n    }\n\n    &:focus + label {\n      color: ", ";\n    }\n\n    & + label {\n      color: ", ";\n    }\n\n    &[disabled] {\n      background-color: ", ";\n\n      &::placeholder {\n        color: ", ";\n      }\n\n      & + label {\n        color: ", ";\n      }\n\n      &:hover {\n        border-color: ", ";\n      }\n    }\n  "])), theme.borderRadius.default, theme.colorMode === 'light' ? theme.colors.tertiary.default : theme.colors.tertiary.focus, theme.colorMode === 'light' ? theme.colors.neutral.neutral5 : theme.colors.neutral.white, theme.fontSizes.xs, theme.fontWeight['500'], theme.colorMode === 'light' ? theme.colors.neutral.neutral5 : theme.colors.neutral.neutral3, theme.colorMode === 'light' ? theme.colors.neutral.black : theme.colors.neutral.neutral1, theme.colors.primary.hover, theme.colorMode === 'light' ? theme.colors.neutral.black : theme.colors.neutral.neutral1, theme.colors.primary.hover, theme.colorMode === 'light' ? theme.colors.neutral.white : theme.colors.neutral.black, theme.colorMode === 'light' ? theme.colors.neutral.neutral5 : theme.colors.neutral.neutral3, theme.colorMode === 'light' ? theme.colors.neutral.neutral5 : theme.colors.neutral.neutral3, theme.colorMode === 'light' ? theme.colors.neutral.neutral5 : theme.colors.neutral.neutral3, theme.colorMode === 'light' ? theme.colors.tertiary.disabled : theme.colors.neutral.neutral6, theme.colorMode === 'light' ? theme.colors.tertiary.hover : theme.colors.tertiary.focus, theme.colorMode === 'light' ? theme.colors.tertiary.hover : theme.colors.tertiary.focus, theme.colorMode === 'light' ? theme.colors.tertiary.default : theme.colors.tertiary.focus);
+}, function (_ref4) {
+  var isInvalid = _ref4.isInvalid,
+      _ref4$alertType = _ref4.alertType,
+      alertType = _ref4$alertType === void 0 ? 'informative' : _ref4$alertType,
+      theme = _ref4.theme;
+  return isInvalid && (0, _react.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n      border-color: ", ";\n      box-shadow: 0 0 0 3px ", ";\n\n      &:hover,\n      &:focus {\n        border-color: ", ";\n        background-color: ", ";\n      }\n\n      &::placeholder {\n        color: ", ";\n      }\n    "])), theme.colors[alertType].default, theme.colors[alertType].blurred, theme.colors[alertType].default, theme.colorMode === 'light' ? theme.colors.neutral.white : theme.colors.neutral.black, theme.colors.neutral.black);
+}, function (_ref5) {
+  var placeholder = _ref5.placeholder,
+      value = _ref5.value,
+      theme = _ref5.theme;
+  return !placeholder && !value ? (0, _react.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n          &:focus + label {\n            padding: 0px 8px;\n            background-color: ", ";\n            top: -10px;\n            left: 16px;\n            color: ", ";\n          }\n        "])), theme.colorMode === 'light' ? theme.colors.neutral.white : theme.colors.neutral.black, theme.colorMode === 'light' ? theme.colors.neutral.neutral5 : theme.colors.neutral.neutral3) : (0, _react.css)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n          & + label {\n            padding: 0px 8px;\n            background-color: ", ";\n            top: -10px;\n            left: 16px;\n            bottom: auto;\n            color: ", ";\n          }\n        "])), theme.colorMode === 'light' ? theme.colors.neutral.white : theme.colors.neutral.black, theme.colorMode === 'light' ? theme.colors.neutral.neutral5 : theme.colors.neutral.neutral3);
+});
+
+exports.TextArea = TextArea;
+
+var HelpText = _styled.default.span(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  font-size: ", ";\n  color: ", ";\n  font-weight: ", ";\n  padding-left: 20px;\n"])), function (_ref6) {
+  var theme = _ref6.theme;
+  return theme.fontSizes.xxs;
+}, function (_ref7) {
+  var theme = _ref7.theme,
+      _ref7$alertType = _ref7.alertType,
+      alertType = _ref7$alertType === void 0 ? 'informative' : _ref7$alertType;
+  return theme.colors[alertType].default;
+}, function (_ref8) {
+  var theme = _ref8.theme;
+  return theme.fontWeight['500'];
+});
+
+exports.HelpText = HelpText;

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"text-area-input.test.d.ts","sourceRoot":"","sources":["../../../src/components/TextAreaInput/text-area-input.test.tsx"],"names":[],"mappings":"AAEA,OAAO,2BAA2B,CAAC"}

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

@@ -0,0 +1,90 @@
+"use strict";
+
+var _react = require("@testing-library/react");
+
+var _testUtils = require("../../shared/tests/test-utils");
+
+require("@testing-library/jest-dom");
+
+var _ = _interopRequireDefault(require("."));
+
+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); }
+
+var makeSut = function makeSut(props) {
+  var sut = (0, _testUtils.render)( /*#__PURE__*/React.createElement(_.default, _extends({
+    label: "Any Label",
+    placeholder: "any placeholder"
+  }, props)));
+  var textarea = sut.container.querySelector('textarea');
+  var helpText = sut.container.querySelector('span');
+  return {
+    sut: sut,
+    textarea: textarea,
+    helpText: helpText
+  };
+};
+
+describe('TextAreaInput', function () {
+  it('should render with correct placeholder', function () {
+    var _makeSut = makeSut(),
+        sut = _makeSut.sut;
+
+    expect(sut.getByPlaceholderText('any placeholder')).toHaveAttribute('placeholder', 'any placeholder');
+  });
+  it('should render with correct label text', function () {
+    var _makeSut2 = makeSut(),
+        sut = _makeSut2.sut;
+
+    expect(sut.getByText('Any Label', {
+      selector: 'label'
+    }).innerHTML).toBe('Any Label');
+  });
+  it('should disabled textarea when prop isDisabled is provided', function () {
+    var _makeSut3 = makeSut({
+      isDisabled: true
+    }),
+        sut = _makeSut3.sut;
+
+    expect(sut.container.querySelector('textarea')).toBeDisabled();
+  });
+  it('should textarea change value on typing', function () {
+    var _makeSut4 = makeSut(),
+        textarea = _makeSut4.textarea;
+
+    _react.fireEvent.change(textarea, {
+      target: {
+        value: 'any_text'
+      }
+    });
+
+    expect(textarea.value).toBe('any_text');
+  });
+  it('should show helpText with isInvalid is provided', function () {
+    var _makeSut5 = makeSut({
+      isInvalid: true,
+      helpText: 'any help text'
+    }),
+        helpText = _makeSut5.helpText;
+
+    expect(helpText).toBeInTheDocument();
+  });
+  it('should not show helpText with isInvalid not provided', function () {
+    var _makeSut6 = makeSut({
+      isInvalid: false,
+      helpText: 'any help text'
+    }),
+        helpText = _makeSut6.helpText;
+
+    expect(helpText).not.toBeInTheDocument();
+  });
+  it('should not render helpText with helpText not provided', function () {
+    var _makeSut7 = makeSut({
+      isInvalid: true
+    }),
+        helpText = _makeSut7.helpText;
+
+    expect(helpText).not.toBeInTheDocument();
+  });
+});

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

@@ -0,0 +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;
+};
+//# sourceMappingURL=types.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/TextAreaInput/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,GAAG,EAAE,sBAAsB,EAAE,MAAM,OAAO,CAAC;AACxE,oBAAY,YAAY,GAAG,aAAa,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAE3E,oBAAY,YAAY,GAAG;IACzB,QAAQ,EAAE,kBAAkB,CAAC,mBAAmB,CAAC,CAAC;IAClD,MAAM,EAAE,kBAAkB,CAAC;IAC3B,GAAG,EAAE,GAAG,CAAC,GAAG,CAAC,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AACF,MAAM,WAAW,mBAAoB,SAAQ,sBAAsB,CAAC,GAAG,CAAC;IACtE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,YAAY,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B;AAED,oBAAY,oBAAoB,GAAG;IACjC,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,YAAY,CAAC;CAC1B,CAAC"}

package/dist/components/TextAreaInput/types.js

@@ -0,0 +1 @@
+"use strict";

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

@@ -0,0 +1,4 @@
+/// <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.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Thumbnail/index.tsx"],"names":[],"mappings":";AAeA,OAAO,EAAc,eAAe,EAAE,MAAM,SAAS,CAAC;AAEtD,wBAAgB,SAAS,CAAC,EACxB,GAAG,EACH,GAAG,EACH,cAAkB,EAClB,KAAK,EACL,WAAW,EACX,IAAW,EACX,QAAQ,EACR,aAAa,GACd,EAAE,eAAe,eAyHjB"}