@pedidopago/ui 1.3.1 → 1.3.2

package/dist/components/Input/styles.js

@@ -19,7 +19,7 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
 
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 
-var InputGroupElement = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 8px;\n  border-radius: ", ";\n  font-weight: ", ";\n\n  transition: all 0.2s ease-in-out;\n\n  &:hover fieldset {\n    border-color: ", ";\n  }\n\n  &:hover > div > div:first-of-type {\n    border-color: ", ";\n  }\n\n  &:focus-within > div > div:first-of-type {\n    background: ", ";\n    border-color: ", ";\n  }\n\n  &:focus-within > div > div:first-of-type span {\n    color: ", ";\n  }\n\n  &:focus-within {\n    border-radius: 2px solid ", ";\n  }\n\n  &:focus-within > div {\n    box-shadow: 0 0 0 2px\n      ", ";\n  }\n\n  &:focus-within label {\n    transform: translate(19px, -11px) scale(0.8);\n\n    background-color: ", ";\n    height: 16px;\n  }\n\n  &:focus-within fieldset {\n    border-width: 2px;\n    border-color: ", ";\n  }\n\n  ", "\n\n  & label {\n    transform: ", ";\n\n    background-color: ", ";\n\n    height: ", ";\n  }\n"])), function (props) {
+var InputGroupElement = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 8px;\n  border-radius: ", ";\n  font-weight: ", ";\n\n  transition: all 0.2s ease-in-out;\n\n  &:hover fieldset {\n    border-color: ", ";\n  }\n\n  &:hover > div > div:first-of-type {\n    border-color: ", ";\n    &:hover label {\n      color: ", ";\n    }\n  }\n\n  &:focus-within > div > div:first-of-type {\n    background: ", ";\n    border-color: ", ";\n  }\n\n  &:focus-within > div > div:first-of-type span {\n    color: ", ";\n  }\n\n  &:focus-within {\n    border-radius: 2px solid ", ";\n  }\n  &:focus-within label {\n    color: ", ";\n  }\n\n  &:focus-within > div {\n    box-shadow: 0 0 0 2px\n      ", ";\n  }\n\n  &:focus-within label {\n    transform: translate(19px, -11px) scale(0.8);\n\n    background-color: ", ";\n    height: 16px;\n  }\n\n  &:focus-within fieldset {\n    border-width: 2px;\n    border-color: ", ";\n  }\n\n  ", "\n\n  & label {\n    transform: ", ";\n\n    background-color: ", ";\n\n    height: ", ";\n  }\n"])), function (props) {
   return props.theme.borderRadius.default;
 }, function (props) {
   return props.theme.fontWeight[400];
@@ -51,6 +51,9 @@ var InputGroupElement = _styled.default.div(_templateObject || (_templateObject
   }
 
   return theme.colors.primary.hover;
+}, function (_ref3) {
+  var theme = _ref3.theme;
+  return theme.colors.neutral.neutral5;
 }, function (props) {
   return !props.alert && props.withAddon && props.theme.colors.primary.disabled;
 }, function (props) {
@@ -59,8 +62,11 @@ var InputGroupElement = _styled.default.div(_templateObject || (_templateObject
   return !props.alert && props.theme.colors.primary.focus;
 }, function (props) {
   return props.theme.colors.primary.disabled;
+}, function (_ref4) {
+  var theme = _ref4.theme;
+  return theme.colors.neutral.neutral5;
 }, function (props) {
-  return props.alert ? props.theme.colorMode === 'dark' ? props.theme.colors[props.alert].dark : props.theme.colors[props.alert].blurred : props.theme.colors.primary.disabled;
+  return props.alert ? props.theme.colorMode === 'dark' ? props.theme.colors[props.alert].dark : "".concat(props.theme.colors[props.alert].blurred, "33") : props.theme.colors.primary.disabled;
 }, function (props) {
   if (props.labelBackground) {
     if (_typeof(props.labelBackground) === 'object') {
@@ -78,8 +84,10 @@ var InputGroupElement = _styled.default.div(_templateObject || (_templateObject
   return !props.alert && props.theme.colors.primary.hover;
 }, function (props) {
   return props.addonContent && (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      &:focus-within > div > div:first-of-type {\n        border-color: ", ";\n        background-color: ", ";\n      }\n    "])), props.alert ? 'transparent' : props.theme.colors.primary.focus, props.alert && props.alert === 'success' ? props.theme.colors.primary.focus : '');
-}, function (props) {
-  return props.hasValueOnInput ? 'translate(19px, -11px) scale(0.8) !important' : 'translate(20px, calc(100% - 10px))';
+}, function (_ref5) {
+  var hasValueOnInput = _ref5.hasValueOnInput,
+      withIcon = _ref5.withIcon;
+  return hasValueOnInput ? 'translate(19px, -11px) scale(0.8) !important' : withIcon ? 'translate(60px, calc(100% - 10px))' : 'translate(20px, calc(100% - 10px))';
 }, function (props) {
   if (!props.hasValueOnInput) return 'unset';
 
@@ -95,8 +103,8 @@ var InputGroupElement = _styled.default.div(_templateObject || (_templateObject
     dark: props.theme.colors.neutral.black,
     light: props.theme.colors.neutral.white
   }[props.theme.colorMode];
-}, function (_ref3) {
-  var hasValueOnInput = _ref3.hasValueOnInput;
+}, function (_ref6) {
+  var hasValueOnInput = _ref6.hasValueOnInput;
   return hasValueOnInput ? '16px' : 'unset';
 });
 
@@ -128,54 +136,47 @@ var InputIcon = _styled.default.div(_templateObject6 || (_templateObject6 = _tag
 
 exports.InputIcon = InputIcon;
 
-var Input = _styled.default.input(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  width: 100%;\n  padding: ", ";\n  flex: 1;\n  height: 100%;\n  border: none;\n  color: ", ";\n\n  &::placeholder {\n    color: ", ";\n  }\n\n  font-family: inherit;\n  outline: none;\n  font-size: ", ";\n  background-color: transparent;\n  position: relative;\n  z-index: ", ";\n"])), function (props) {
+var Input = _styled.default.input(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  width: 100%;\n  padding: ", ";\n  flex: 1;\n  height: 100%;\n  border: none;\n  color: ", ";\n\n  &::placeholder {\n    color: ", ";\n  }\n\n  font-family: inherit;\n  outline: none;\n  font-size: ", ";\n  background-color: transparent;\n  position: relative;\n"])), function (props) {
   return props.withIcon ? props.hiddenContent ? '0 0' : '0 20px 0 0' : props.hiddenContent ? '0 0 0 20px' : '0 20px';
 }, function (props) {
   return props.theme.colorMode === 'dark' ? props.theme.colors.neutral.white : props.theme.colors.neutral.black;
-}, function (props) {
-  return props.theme.colorMode === 'dark' ? props.theme.colors.neutral.neutral4 : props.theme.colors.neutral.neutral3;
+}, function (_ref7) {
+  var theme = _ref7.theme;
+  return theme.colors.neutral.neutral5;
 }, function (props) {
   return props.theme.fontSizes.xs;
-}, function (props) {
-  return props.theme.zIndex.level2;
 });
 
 exports.Input = Input;
 
-var InputLabel = _styled.default.label(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  top: 0;\n  left: 0;\n  height: auto;\n  padding: 0 6px;\n  position: absolute;\n  z-index: ", ";\n  pointer-events: none;\n  color: ", ";\n  background-color: transparent;\n  transform-origin: left;\n  transition: transform 0.2s ease, background-color 0.1s cubic-bezier(0.075, 0.82, 0.165, 1);\n"])), function (props) {
+var InputLabel = _styled.default.label(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  top: 0;\n  left: 0;\n  height: auto;\n  padding: 0 6px;\n  position: absolute;\n  z-index: ", ";\n  pointer-events: none;\n  color: ", ";\n  background-color: transparent;\n  transform-origin: left;\n  transition: all ease 0.2s;\n  font-weight: 500;\n"])), function (props) {
   return props.theme.zIndex.level1;
 }, function (props) {
-  return props.hasDisabled ? props.theme.colors.neutral.neutral3 : props.theme.colorMode === 'dark' ? props.theme.colors.neutral.white : props.theme.colors.neutral.black;
+  return props.theme.colorMode === 'dark' ? props.theme.colors.neutral.white : props.theme.colors.neutral.neutral3;
 });
 
 exports.InputLabel = InputLabel;
 
-var Fieldset = _styled.default.fieldset(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  margin: 0;\n  top: 0;\n  pointer-events: none;\n  padding: 0 17px;\n  overflow: hidden;\n\n  background-color: ", ";\n\n  border-radius: ", ";\n  border: 2px solid\n    ", ";\n  border-left: ", ";\n\n  transition: all 0.2s ease;\n"])), function (_ref4) {
-  var alert = _ref4.alert,
-      theme = _ref4.theme,
-      hasDisabled = _ref4.hasDisabled;
+var Fieldset = _styled.default.fieldset(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  margin: 0;\n  top: 0;\n  pointer-events: none;\n  padding: 0 17px;\n  overflow: hidden;\n\n  background-color: ", ";\n\n  border-radius: ", ";\n  border: 2px solid\n    ", ";\n  border-left: ", ";\n\n  transition: all 0.2s ease;\n"])), function (_ref8) {
+  var alert = _ref8.alert,
+      theme = _ref8.theme,
+      hasDisabled = _ref8.hasDisabled;
 
   if (alert && !hasDisabled) {
-    return {
-      light: theme.colors[alert].blurred,
-      dark: theme.colors[alert].dark
-    }[theme.colorMode];
+    return "".concat(theme.colors[alert].blurred, "33");
   }
 
   if (hasDisabled) {
-    return {
-      light: theme.colors.neutral.neutral1,
-      dark: theme.colors.neutral.neutral4
-    }[theme.colorMode];
+    return theme.colors.neutral.neutral1;
   }
 
   return 'transparent';
 }, function (props) {
   return props.withAddon ? "0 ".concat(props.theme.borderRadius.default, " ").concat(props.theme.borderRadius.default, " 0") : props.theme.borderRadius.default;
-}, function (_ref5) {
-  var theme = _ref5.theme,
-      hasDisabled = _ref5.hasDisabled,
-      alert = _ref5.alert;
+}, function (_ref9) {
+  var theme = _ref9.theme,
+      hasDisabled = _ref9.hasDisabled,
+      alert = _ref9.alert;
 
   if (alert && !hasDisabled) {
     return theme.colors[alert].default;
@@ -223,10 +224,10 @@ var AddonElement = _styled.default.div(_templateObject13 || (_templateObject13 =
     light: props.theme.colors.neutral.neutral1,
     dark: props.theme.colors.neutral.neutral6
   }[props.theme.colorMode];
-}, function (_ref6) {
-  var theme = _ref6.theme,
-      hasDisabled = _ref6.hasDisabled,
-      alert = _ref6.alert;
+}, function (_ref10) {
+  var theme = _ref10.theme,
+      hasDisabled = _ref10.hasDisabled,
+      alert = _ref10.alert;
 
   if (alert && !hasDisabled) {
     return theme.colors[alert].default;

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

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

package/dist/components/Label/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Label/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAU3B,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEtC,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,WAAW,CAkB/B,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Label/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAG3B,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAErC,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,UAAU,CAkB9B,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/components/Label/index.js

@@ -7,43 +7,32 @@ exports.default = void 0;
 
 var _react = require("@emotion/react");
 
-var _styles = require("./styles");
-
 var _Icon = _interopRequireDefault(require("../Icon"));
 
-var _allIcons = require("../Icon/utils/allIcons");
-
-var _invertColor = require("../../utils/invertColor");
+var _styles = require("./styles");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 var LabelInput = function LabelInput(_ref) {
-  var Label = _ref.Label,
-      LabelType = _ref.LabelType,
-      Icon = _ref.Icon,
-      _ref$IconSide = _ref.IconSide,
-      IconSide = _ref$IconSide === void 0 ? 'left' : _ref$IconSide,
-      Color = _ref.Color;
+  var label = _ref.label,
+      _ref$labelType = _ref.labelType,
+      labelType = _ref$labelType === void 0 ? 'success' : _ref$labelType,
+      Icon = _ref.icon,
+      _ref$iconSide = _ref.iconSide,
+      iconSide = _ref$iconSide === void 0 ? 'left' : _ref$iconSide;
   var theme = (0, _react.useTheme)();
-
-  var iconExists = function iconExists() {
-    return _allIcons.allIcons.some(function (svg) {
-      return svg.name === Icon;
-    });
-  };
-
-  var backgroundColor = LabelType ? theme.colors[LabelType].blurred : Color || (theme.colorMode === 'dark' ? theme.colors.neutral.neutral5 : theme.colors.neutral.neutral1);
-  var color = (0, _invertColor.invertColor)(backgroundColor || '#fff', true);
+  var backgroundColor = theme.colors[labelType].blurred;
+  var textColor = theme.colors[labelType].default;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.LabelWrapper, {
     backgroundColor: backgroundColor,
-    color: color,
+    color: textColor,
     "data-testid": "label-wrapper",
-    children: [Icon && IconSide === 'left' && iconExists() && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
+    children: [Icon && iconSide === 'left' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
       name: Icon,
       size: "16px"
-    }), Label || 'default', Icon && IconSide === 'right' && iconExists() && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
+    }), label || 'default', Icon && iconSide === 'right' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
       name: Icon,
       size: "16px"
     })]

package/dist/components/Label/label.test.d.ts

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

package/dist/components/Label/label.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"label.test.d.ts","sourceRoot":"","sources":["../../../src/components/Label/label.test.tsx"],"names":[],"mappings":"AAEA,OAAO,yCAAyC,CAAC"}

package/dist/components/Label/label.test.js

@@ -0,0 +1,105 @@
+"use strict";
+
+var _testUtils = require("../../shared/tests/test-utils");
+
+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); } }
+
+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, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, _objectSpread({}, props)));
+  var LabelWrapper = utils.getByTestId('label-wrapper');
+  return _objectSpread({
+    LabelWrapper: LabelWrapper
+  }, utils);
+};
+
+describe('Label', function () {
+  it('Should be Rendered', function () {
+    var _setup = setup(),
+        LabelWrapper = _setup.LabelWrapper;
+
+    expect(LabelWrapper).toBeInTheDocument();
+  });
+  it('Render other labels', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+    var LabelTest, _setup2, findByText, label;
+
+    return regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            LabelTest = 'Teste';
+            _setup2 = setup({
+              label: LabelTest
+            }), findByText = _setup2.findByText;
+            _context.next = 4;
+            return findByText(LabelTest);
+
+          case 4:
+            label = _context.sent;
+            expect(label.innerHTML).toEqual(LabelTest);
+
+          case 6:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee);
+  })));
+  it('Render Icons', function () {
+    var _LabelWrapper$querySe;
+
+    var icon = 'mail';
+
+    var _setup3 = setup({
+      icon: icon
+    }),
+        LabelWrapper = _setup3.LabelWrapper;
+
+    var SvgName = (_LabelWrapper$querySe = LabelWrapper.querySelector('svg')) === null || _LabelWrapper$querySe === void 0 ? void 0 : _LabelWrapper$querySe.getAttribute('name');
+    expect(SvgName).toEqual(icon);
+  });
+  it('Render Icons in Left', function () {
+    var _LabelWrapper$querySe2;
+
+    var label = 'Testing';
+
+    var _setup4 = setup({
+      icon: 'mail',
+      label: label
+    }),
+        LabelWrapper = _setup4.LabelWrapper;
+
+    var Icon = (_LabelWrapper$querySe2 = LabelWrapper.querySelector('svg')) === null || _LabelWrapper$querySe2 === void 0 ? void 0 : _LabelWrapper$querySe2.outerHTML;
+    expect(LabelWrapper.innerHTML).toEqual(Icon + label);
+  });
+  it('Render Icons in Right', function () {
+    var _LabelWrapper$querySe3;
+
+    var label = 'Testing';
+
+    var _setup5 = setup({
+      icon: 'mail',
+      iconSide: 'right',
+      label: label
+    }),
+        LabelWrapper = _setup5.LabelWrapper;
+
+    var Icon = (_LabelWrapper$querySe3 = LabelWrapper.querySelector('svg')) === null || _LabelWrapper$querySe3 === void 0 ? void 0 : _LabelWrapper$querySe3.outerHTML;
+    expect(LabelWrapper.innerHTML).toEqual(label + Icon);
+  });
+});

package/dist/components/Label/styles.js

@@ -21,7 +21,7 @@ var LabelWrapper = _styled.default.div(_templateObject || (_templateObject = _ta
   return color;
 }, function (_ref3) {
   var theme = _ref3.theme;
-  return theme.fontSizes.xs;
+  return theme.fontSizes.xxs;
 });
 
 exports.LabelWrapper = LabelWrapper;

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

@@ -7,11 +7,10 @@ export declare type IStyleProps = {
     backgroundColor?: string;
     color?: string;
 };
-export declare type IInputProps = {
-    LabelType?: 'success' | 'error' | 'warning' | 'informative' | 'critical' | 'success_secondary' | 'warning_secondary';
-    Icon?: IconName;
-    Label?: string;
-    IconSide?: 'left' | 'right';
-    Color?: string;
+export declare type LabelProps = {
+    labelType?: 'success' | 'error' | 'warning' | 'informative' | 'critical' | 'success_secondary' | 'warning_secondary';
+    icon?: IconName;
+    label?: string;
+    iconSide?: 'left' | 'right';
 };
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Label/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,oBAAY,WAAW,GAAG;IACxB,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,oBAAY,WAAW,GAAG;IACxB,SAAS,CAAC,EACN,SAAS,GACT,OAAO,GACP,SAAS,GACT,aAAa,GACb,UAAU,GACV,mBAAmB,GACnB,mBAAmB,CAAC;IACxB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Label/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,oBAAY,WAAW,GAAG;IACxB,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,oBAAY,UAAU,GAAG;IACvB,SAAS,CAAC,EACN,SAAS,GACT,OAAO,GACP,SAAS,GACT,aAAa,GACb,UAAU,GACV,mBAAmB,GACnB,mBAAmB,CAAC;IACxB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;CAC7B,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/styles.ts"],"names":[],"mappings":";AACA,OAAO,EAAO,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAE5C,UAAU,mBAAmB;IAC3B,IAAI,EAAE,OAAO,CAAC;IAEd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,eAAe,EAAE,MAAM,CAAC;IAExB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;CACb;AAED,eAAO,MAAM,cAAc;;;+HAqBzB,CAAC;AAEH,eAAO,MAAM,YAAY;;;;UACjB,OAAO;;;yGA6Cb,CAAC;AAEH,eAAO,MAAM,OAAO;;;yGAelB,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/styles.ts"],"names":[],"mappings":";AACA,OAAO,EAAO,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAE5C,UAAU,mBAAmB;IAC3B,IAAI,EAAE,OAAO,CAAC;IAEd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,eAAe,EAAE,MAAM,CAAC;IAExB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;CACb;AAED,eAAO,MAAM,cAAc;;;+HAsBzB,CAAC;AAEH,eAAO,MAAM,YAAY;;;;UACjB,OAAO;;;yGA4Cb,CAAC;AAEH,eAAO,MAAM,OAAO;;;yGAgBlB,CAAC"}

package/dist/components/Modal/styles.js

@@ -26,7 +26,7 @@ var ModalContainer = _styled.default.div(function (_ref) {
   var theme = _ref.theme,
       props = _objectWithoutProperties(_ref, _excluded);
 
-  return (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    display: flex;\n\n    padding-bottom: 16px;\n\n    width: 100%;\n    max-width: ", ";\n    max-height: ", ";\n\n    position: fixed;\n    left: ", ";\n    top: ", ";\n    transform: ", ";\n\n    opacity: ", ";\n\n    pointer-events: ", ";\n\n    transition: opacity ease ", ";\n  "])), props.maxWidth, props.maxHeight, props.left, props.top, props.anchorTranslate, props.open ? 1 : 0, props.open ? 'auto' : 'none', theme.transition.speed);
+  return (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    display: flex;\n\n    padding-bottom: 16px;\n\n    width: 100%;\n    max-width: ", ";\n    max-height: ", ";\n\n    position: fixed;\n    left: ", ";\n    top: ", ";\n    z-index: ", ";\n    transform: ", ";\n\n    opacity: ", ";\n\n    pointer-events: ", ";\n\n    transition: opacity ease ", ";\n  "])), props.maxWidth, props.maxHeight, props.left, props.top, theme.zIndex.level24, props.anchorTranslate, props.open ? 1 : 0, props.open ? 'auto' : 'none', theme.transition.speed);
 });
 
 exports.ModalContainer = ModalContainer;
@@ -35,14 +35,14 @@ var ModalElement = _styled.default.div(function (_ref2) {
   var theme = _ref2.theme,
       props = _objectWithoutProperties(_ref2, _excluded2);
 
-  return (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    width: 100%;\n    max-height: ", ";\n\n    border-radius: ", ";\n\n    z-index: ", ";\n    overflow-y: auto;\n    overflow-x: hidden;\n\n    transform: scale(", ");\n\n    background: ", ";\n    box-shadow: ", ";\n\n    transition: transform ease ", ";\n\n    &::-webkit-scrollbar {\n      width: 6px;\n    }\n\n    &::-webkit-scrollbar-track {\n      background: transparent;\n    }\n\n    &::-webkit-scrollbar-thumb {\n      border-radius: ", ";\n      background: ", ";\n    }\n\n    ", "\n  "])), props.maxHeight, theme.borderRadius.default, theme.zIndex.level24, props.open ? 1 : 0.8, theme.colors.background.light, theme.shadow.level1, theme.transition.speed, theme.borderRadius.default, theme.colors.primary.default, props.hideScrollBar && (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      ::-webkit-scrollbar {\n        display: none;\n      }\n\n      scrollbar-width: none;\n\n      -ms-overflow-style: none;\n    "]))));
+  return (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    width: 100%;\n    max-height: ", ";\n\n    border-radius: ", ";\n\n    overflow-y: auto;\n    overflow-x: hidden;\n\n    transform: scale(", ");\n\n    background: ", ";\n    box-shadow: ", ";\n\n    transition: transform ease ", ";\n\n    &::-webkit-scrollbar {\n      width: 6px;\n    }\n\n    &::-webkit-scrollbar-track {\n      background: transparent;\n    }\n\n    &::-webkit-scrollbar-thumb {\n      border-radius: ", ";\n      background: ", ";\n    }\n\n    ", "\n  "])), props.maxHeight, theme.borderRadius.default, props.open ? 1 : 0.8, theme.colors.background.light, theme.shadow.level1, theme.transition.speed, theme.borderRadius.default, theme.colors.primary.default, props.hideScrollBar && (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      ::-webkit-scrollbar {\n        display: none;\n      }\n\n      scrollbar-width: none;\n\n      -ms-overflow-style: none;\n    "]))));
 });
 
 exports.ModalElement = ModalElement;
 
 var Overlay = _styled.default.div(function (props) {
   var theme = props.theme;
-  return (0, _react.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    position: fixed;\n    left: 0px;\n    right: 0px;\n    top: 0px;\n    bottom: 0px;\n\n    background: ", ";\n    opacity: 0;\n\n    transition: opacity ease ", ";\n  "])), theme.colors.neutral.neutral5, theme.transition.speed);
+  return (0, _react.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    position: fixed;\n    left: 0px;\n    right: 0px;\n    top: 0px;\n    bottom: 0px;\n    z-index: ", ";\n\n    background: ", ";\n    opacity: 0;\n\n    transition: opacity ease ", ";\n  "])), theme.zIndex.level24, theme.colors.neutral.neutral5, theme.transition.speed);
 });
 
 exports.Overlay = Overlay;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,mBAAmB,EAKpB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAQtC,QAAA,MAAM,MAAM,kJA8HX,CAAC;AAGF,eAAe,MAAM,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,mBAAmB,EAKpB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAQtC,QAAA,MAAM,MAAM,kJAqIX,CAAC;AAGF,eAAe,MAAM,CAAC"}

package/dist/components/Select/index.js

@@ -90,18 +90,32 @@ var Select = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     }
 
     setSelectedOption(option);
+    setFilled(option !== undefined);
     setOptionsMenuOpen(false);
-  }
+  } // Sets default value
+
 
   (0, _react.useEffect)(function () {
-    // Sets default value
     if (rest.defaultValue) {
       var defaultOptionIndex = options.findIndex(function (c) {
         return c.value === rest.defaultValue;
       });
       if (defaultOptionIndex >= 0) selectOption(defaultOptionIndex);
     }
-  }, []);
+  }, []); // Assures the option is selected throughout renders.
+
+  (0, _react.useEffect)(function () {
+    var _inputRef$current;
+
+    if (selectedOption === undefined || ((_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.value) !== options[selectedOption].value) {
+      var optionIndex = options.findIndex(function (c) {
+        var _inputRef$current2;
+
+        return c.value === ((_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.value);
+      });
+      if (optionIndex > 0) selectOption(optionIndex);
+    }
+  });
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.SelectContainer, {
       filled: filled || !!placeholder,
@@ -137,7 +151,7 @@ var Select = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
           name: "chevron-down"
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("fieldset", {
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("legend", {
+          children: !!label && /*#__PURE__*/(0, _jsxRuntime.jsx)("legend", {
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
               fontSize: "xxs",
               variant: "span",
@@ -145,7 +159,7 @@ var Select = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
             })
           })
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("fieldset", {
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("legend", {
+          children: !!label && /*#__PURE__*/(0, _jsxRuntime.jsx)("legend", {
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
               fontSize: "xxs",
               variant: "span",
@@ -156,17 +170,10 @@ var Select = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
       }), !!helperText && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
         fontSize: "xxs",
         children: helperText
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("input", _objectSpread(_objectSpread({
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("input", _objectSpread({
         ref: inputRef,
         tabIndex: -1
-      }, rest), {}, {
-        onChange: function onChange(e) {
-          var _rest$onChange;
-
-          setFilled(!!e.currentTarget.value);
-          (_rest$onChange = rest.onChange) === null || _rest$onChange === void 0 ? void 0 : _rest$onChange.call(rest, e);
-        }
-      }))]
+      }, rest))]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.OptionsModal, {
       open: optionsMenuOpen,
       left: "".concat((_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.getBoundingClientRect().left, "px"),
@@ -176,7 +183,6 @@ var Select = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
       offsetY: "".concat((_containerRef$current3 = containerRef.current) === null || _containerRef$current3 === void 0 ? void 0 : _containerRef$current3.getBoundingClientRect().height, "px"),
       maxWidth: "".concat((_containerRef$current4 = containerRef.current) === null || _containerRef$current4 === void 0 ? void 0 : _containerRef$current4.getBoundingClientRect().width, "px"),
       hideOverlay: true,
-      disableScrollOnOpen: false,
       onClose: function onClose() {
         return setOptionsMenuOpen(false);
       },

package/dist/components/Table/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Table/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAkD,MAAM,OAAO,CAAC;AAsBjG,OAAO,EAAE,WAAW,EAAkB,MAAM,SAAS,CAAC;AAMtD,wBAAgB,KAAK,CAAC,EACpB,UAAU,EACV,cAAc,EACd,gBAAgB,EAChB,MAAM,EACN,IAAI,EACJ,GAAG,IAAI,EACR,EAAE,WAAW,GAAG,wBAAwB,CAAC,OAAO,CAAC,eA8LjD"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Table/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAkD,MAAM,OAAO,CAAC;AAsBjG,OAAO,EAAE,WAAW,EAAkB,MAAM,SAAS,CAAC;AAMtD,wBAAgB,KAAK,CAAC,EACpB,UAAU,EACV,cAAc,EACd,gBAAgB,EAChB,MAAM,EACN,IAAI,EACJ,GAAG,IAAI,EACR,EAAE,WAAW,GAAG,wBAAwB,CAAC,OAAO,CAAC,eAsMjD"}

package/dist/components/Table/index.js

@@ -206,13 +206,23 @@ function Table(_ref) {
           }), header.map(function (label) {
             return /*#__PURE__*/(0, _jsxRuntime.jsx)("th", {
               children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
-                fontSize: "xxs",
+                color: "neutral.neutral5",
+                fontSize: "xxxs",
                 fontWeight: "600",
                 children: label
               })
             }, (0, _GenerateKey.generateKey)());
           })]
-        }), haveActions && /*#__PURE__*/(0, _jsxRuntime.jsx)("th", {})]
+        }), haveActions && /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("th", {
+            children: !selectedRows.length && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+              color: "neutral.neutral5",
+              fontSize: "xxxs",
+              fontWeight: "600",
+              children: "A\xE7\xF5es"
+            })
+          })
+        })]
       })
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("tbody", {
       children: rowsWithKey.map(function (row) {
@@ -229,7 +239,7 @@ function Table(_ref) {
           }), row.items.map(function (cell) {
             return /*#__PURE__*/(0, _jsxRuntime.jsx)("td", {
               children: typeof cell === 'string' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
-                fontSize: "xxs",
+                fontSize: "xxxs",
                 fontWeight: "500",
                 children: cell
               }) : cell

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

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Table/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAElD,eAAO,MAAM,WAAW;;;uIAsGtB,CAAC;AAEH,eAAO,MAAM,cAAc;;;yGAG1B,CAAC;AAEF,eAAO,MAAM,aAAa;;;0IAoExB,CAAC;AAEH,eAAO,MAAM,eAAe;;;yGAE3B,CAAC;AAEF,eAAO,MAAM,oBAAoB;;;0IAiBhC,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;;;;;yGAsB7B,CAAC;AAEF,eAAO,MAAM,eAAe;;;8HA6B3B,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Table/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAElD,eAAO,MAAM,WAAW;;;uIAoGtB,CAAC;AAEH,eAAO,MAAM,cAAc;;;yGAG1B,CAAC;AAEF,eAAO,MAAM,aAAa;;;0IAmExB,CAAC;AAEH,eAAO,MAAM,eAAe;;;yGAE3B,CAAC;AAEF,eAAO,MAAM,oBAAoB;;;0IAiBhC,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;;;;;yGAiB7B,CAAC;AAEF,eAAO,MAAM,eAAe;;;8HA6B3B,CAAC"}

package/dist/components/Table/styles.js

@@ -17,13 +17,13 @@ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(
 
 var StyledTable = _styled.default.table(function (props) {
   var theme = props.theme;
-  return (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    border-spacing: 0px;\n\n    & > thead {\n      & > tr {\n        height: 64px;\n\n        & > th {\n          background: hsla(156, 13%, 92%, 0.5);\n          border-top: 1px solid\n            ", ";\n          border-bottom: 1px solid\n            ", ";\n          padding-left: 16px;\n          padding-right: 16px;\n          text-align: left;\n          * {\n            color: #587169;\n            font-size: ", ";\n          }\n\n          &:first-of-type {\n            border-left: 1px solid\n              ", ";\n            border-radius: 4px 0px 0px 4px;\n          }\n\n          &:last-child {\n            border-right: 1px solid\n              ", ";\n            border-radius: 0px 4px 4px 0px;\n          }\n        }\n      }\n    }\n\n    & > tbody {\n      tr {\n        height: 64px;\n\n        &:not(:last-child) {\n          & > td {\n            border-bottom: 1px solid\n              ", ";\n          }\n        }\n\n        &:hover {\n          & > td {\n            background: ", ";\n\n            &:first-of-type {\n              border-radius: 4px 0px 0px 4px;\n            }\n\n            &:last-child {\n              border-radius: 0px 4px 4px 0px;\n            }\n          }\n        }\n\n        &:focus {\n          outline: 2px solid ", ";\n          border-radius: 4px;\n        }\n\n        &[data-selected='true'] {\n          & > td {\n            background: ", ";\n          }\n        }\n\n        & > td {\n          padding-left: 16px;\n          padding-right: 16px;\n\n          text-align: left;\n\n          color: ", ";\n        }\n      }\n    }\n  "])), {
+  return (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    border-spacing: 0px;\n\n    & > thead {\n      & > tr {\n        height: 64px;\n\n        & > th {\n          background: hsla(156, 13%, 92%, 0.5);\n          border-top: 1px solid\n            ", ";\n          border-bottom: 1px solid\n            ", ";\n          padding-left: 16px;\n          padding-right: 16px;\n          text-align: left;\n\n          &:first-of-type {\n            border-left: 1px solid\n              ", ";\n            border-radius: 8px 0px 0px 0px;\n          }\n\n          &:last-child {\n            border-right: 1px solid\n              ", ";\n            border-radius: 0px 8px 0px 0px;\n          }\n        }\n      }\n    }\n\n    & > tbody {\n      tr {\n        height: 64px;\n        &:nth-child(even) {\n          background: hsla(150, 16%, 97%, 0.75);\n        }\n        &:not(:last-child) {\n          & > td {\n            border-bottom: 1px solid\n              ", ";\n          }\n        }\n\n        &:hover {\n          & > td {\n            background: ", ";\n\n            &:first-of-type {\n              border-radius: 4px 0px 0px 4px;\n            }\n\n            &:last-child {\n              border-radius: 0px 4px 4px 0px;\n            }\n          }\n        }\n\n        &:focus {\n          outline: 2px solid ", ";\n          border-radius: 4px;\n        }\n\n        &[data-selected='true'] {\n          & > td {\n            background: ", ";\n          }\n        }\n\n        & > td {\n          padding-left: 16px;\n          padding-right: 16px;\n\n          text-align: left;\n\n          color: ", ";\n        }\n      }\n    }\n  "])), {
     dark: theme.colors.neutral.neutral5,
     light: theme.colors.neutral.neutral2
   }[theme.colorMode], {
     dark: theme.colors.neutral.neutral5,
     light: theme.colors.neutral.neutral2
-  }[theme.colorMode], theme.fontSizes.xxxs, {
+  }[theme.colorMode], {
     dark: theme.colors.neutral.neutral5,
     light: theme.colors.neutral.neutral2
   }[theme.colorMode], {
@@ -31,7 +31,7 @@ var StyledTable = _styled.default.table(function (props) {
     light: theme.colors.neutral.neutral2
   }[theme.colorMode], {
     dark: theme.colors.neutral.neutral5,
-    light: theme.colors.neutral.neutral2
+    light: theme.colors.neutral.neutral1
   }[theme.colorMode], {
     dark: theme.colors.neutral.neutral6,
     light: theme.colors.neutral.neutral1
@@ -49,7 +49,7 @@ exports.SelectedHeader = SelectedHeader;
 
 var ActionsButton = _styled.default.button(function (props) {
   var theme = props.theme;
-  return (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    appearance: none;\n    font-family: inherit;\n\n    display: flex;\n    align-items: center;\n    gap: 8px;\n\n    margin: 0px -2px 0px 0px;\n    outline: none;\n    border: 2px solid\n      ", ";\n    padding: 0px 24px;\n\n    height: 44px;\n\n    white-space: nowrap;\n\n    color: ", ";\n    background: ", ";\n\n    transition: background-color linear ", ";\n\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n\n    &:first-of-type {\n      color: ", ";\n      border-radius: 8px 0px 0px 8px;\n    }\n\n    &:last-of-type {\n      border-radius: 0px 8px 8px 0px;\n    }\n\n    &:only-child {\n      border-radius: 8px;\n    }\n\n    &:hover,\n    &:focus {\n      z-index: 1;\n\n      border-color: ", ";\n      background: ", ";\n    }\n\n    &:active {\n      background: ", ";\n    }\n  "])), {
+  return (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    appearance: none;\n    font-family: inherit;\n\n    display: flex;\n    align-items: center;\n    gap: 8px;\n\n    margin: 0px -2px 0px 0px;\n    outline: none;\n    border: 2px solid\n      ", ";\n    padding: 0px 24px;\n    height: 44px;\n\n    white-space: nowrap;\n\n    color: ", ";\n    background: ", ";\n\n    transition: background-color linear ", ";\n\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n\n    &:first-of-type {\n      color: ", ";\n      border-radius: 8px 0px 0px 8px;\n    }\n\n    &:last-of-type {\n      border-radius: 0px 8px 8px 0px;\n    }\n\n    &:only-child {\n      border-radius: 8px;\n    }\n\n    &:hover,\n    &:focus {\n      z-index: 1;\n\n      border-color: ", ";\n      background: ", ";\n    }\n\n    &:active {\n      background: ", ";\n    }\n  "])), {
     dark: theme.colors.neutral.neutral4,
     light: theme.colors.neutral.neutral2
   }[theme.colorMode], theme.colors.neutral.neutral5, {
@@ -85,10 +85,7 @@ var MenuItemContainer = _styled.default.div(_templateObject6 || (_templateObject
   return props.isOpen ? 'block' : 'none';
 }, function (_ref) {
   var theme = _ref.theme;
-  return {
-    dark: theme.colors.neutral.neutral6,
-    light: theme.colors.neutral.neutral1
-  }[theme.colorMode];
+  return theme.colors.neutral.white;
 }, function (props) {
   return props.posRight ? props.posRight : 0;
 }, function (props) {

package/dist/components/Toast/components/Toast.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../../src/components/Toast/components/Toast.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAa,MAAM,OAAO,CAAC;AAOtC,OAAO,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,UAAU,CAAC;AAEhD,QAAA,MAAM,KAAK,EAAE,EAAE,CAAC,WAAW,CA2E1B,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../../src/components/Toast/components/Toast.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAa,MAAM,OAAO,CAAC;AAOtC,OAAO,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,UAAU,CAAC;AAEhD,QAAA,MAAM,KAAK,EAAE,EAAE,CAAC,WAAW,CAyE1B,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/dist/components/Toast/components/Toast.js

@@ -23,12 +23,12 @@ var Toast = function Toast(_ref) {
   var type = _ref.type,
       close = _ref.close,
       duration = _ref.duration,
-      message = _ref.message,
+      content = _ref.content,
+      icon = _ref.icon,
       id = _ref.toastId,
-      buttonTitle = _ref.buttonTitle,
-      onButtonClick = _ref.onButtonClick,
       title = _ref.title,
-      position = _ref.position;
+      _ref$position = _ref.position,
+      position = _ref$position === void 0 ? 'top-right' : _ref$position;
   (0, _react.useEffect)(function () {
     var timer = setTimeout(function () {
       close(id);
@@ -73,12 +73,11 @@ var Toast = function Toast(_ref) {
     className: "pp-toast-".concat(position),
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StyledToastComponent, {
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Alert.default, {
-        message: message,
+        content: content,
         title: title,
+        icon: icon,
         variant: "closable",
         type: type,
-        buttonTitle: buttonTitle,
-        onButtonClick: onButtonClick,
         onClose: handleCloseButtonClick
       })
     })