@pedidopago/ui 1.4.0 → 1.4.1

package/dist/components/Rating/rating.test.js

@@ -1,102 +1,79 @@
 "use strict";
 
+var _index = require("./index");
+
+require("@testing-library/jest-dom");
+
 var _testUtils = require("../../shared/tests/test-utils");
 
 var _react = require("@testing-library/react");
 
-require("@testing-library/jest-dom/extend-expect");
-
-var _ = _interopRequireDefault(require("."));
+var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
 
 var _jsxRuntime = require("react/jsx-runtime");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-var setup = function setup() {
-  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  var utils = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, _objectSpread({}, props)));
-  var RatingWrapper = utils.getByTestId('rating-wrapper');
-  var RatingIcon = utils.getByTestId('rating-icon-0');
-  return _objectSpread({
-    RatingWrapper: RatingWrapper,
-    RatingIcon: RatingIcon
-  }, utils);
-};
-
 describe('Rating', function () {
-  it('Should be Rendered', function () {
-    var _setup = setup(),
-        RatingWrapper = _setup.RatingWrapper;
-
-    expect(RatingWrapper).toBeInTheDocument();
-    expect(RatingWrapper.querySelectorAll('svg').length).toBeGreaterThan(1);
+  it('should be rendered', function () {
+    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Rating, {}));
+    expect(_react.screen.getAllByRole('button')[4]).toBeInTheDocument();
   });
-  it('should be able to render a icon with name prop', function () {
-    var iconName = 'heart';
+  it('should be call onChange when onChange prop is provided', function () {
+    var onChange = jest.fn();
+    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Rating, {
+      value: 5,
+      onChange: onChange
+    }));
 
-    var _setup2 = setup({
-      name: iconName
-    }),
-        RatingWrapper = _setup2.RatingWrapper;
+    _userEvent.default.click(_react.screen.getAllByRole('button')[4]);
 
-    var oneSVG = RatingWrapper.querySelector('svg');
-    var svgName = oneSVG === null || oneSVG === void 0 ? void 0 : oneSVG.getAttribute('name');
-    expect(svgName).toBe(iconName);
+    expect(onChange).toHaveBeenCalled();
   });
-  it('should be able to render any quantity of icons', function () {
-    var _setup3 = setup({
-      name: 'star',
-      iconsQuantity: 8
-    }),
-        RatingWrapper = _setup3.RatingWrapper;
-
-    var icons = RatingWrapper.querySelectorAll('svg');
-    var iconsQuantity = icons.length;
-    expect(iconsQuantity).toEqual(8);
+  it('should be able to render any quantity of icons ', function () {
+    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Rating, {
+      value: 4,
+      quantity: 7
+    }));
+    expect(_react.screen.getAllByRole('button')[6]).toBeInTheDocument();
   });
   it('should be able to fill svg if hover', function () {
-    var _setup4 = setup({
-      name: 'star'
-    }),
-        RatingIcon = _setup4.RatingIcon;
+    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Rating, {}));
 
-    var RatingIconPath = RatingIcon.querySelector('path');
+    var RatingIcon = _react.screen.getAllByRole('button')[4];
 
-    _react.fireEvent.mouseMove(RatingIconPath);
+    _react.fireEvent.mouseMove(RatingIcon);
 
-    expect(RatingIcon === null || RatingIcon === void 0 ? void 0 : RatingIcon.style.fill).toBe('url(#star_gradient)');
+    expect(RatingIcon === null || RatingIcon === void 0 ? void 0 : RatingIcon.style.fill).not.toBe('none');
   });
   it('should be able to change precision', function () {
-    var _setup5 = setup({
-      name: 'star',
-      precision: '1'
-    }),
-        RatingIcon = _setup5.RatingIcon;
-
-    var RatingIconPath = RatingIcon.querySelector('path');
-
-    _react.fireEvent.mouseMove(RatingIconPath);
-
-    expect(RatingIcon === null || RatingIcon === void 0 ? void 0 : RatingIcon.style.fill).toBe('yellow');
+    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Rating, {
+      value: 4.5,
+      precision: 0.5
+    }));
+    expect(_react.screen.getAllByRole('button')[4]).toBeInTheDocument();
   });
-  it('should be able to change primary color', function () {
-    var _setup6 = setup({
-      name: 'star',
-      precision: '1',
-      primaryColor: 'red'
-    }),
-        RatingIcon = _setup6.RatingIcon;
-
-    var RatingIconPath = RatingIcon.querySelector('path');
+  it('should be able to change color', function () {
+    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Rating, {
+      value: 5,
+      colorFilledIcon: "neutral.neutral5"
+    }));
 
-    _react.fireEvent.mouseMove(RatingIconPath);
+    var RatingIcon = _react.screen.getAllByRole('button')[0];
 
-    expect(RatingIcon === null || RatingIcon === void 0 ? void 0 : RatingIcon.style.fill).toBe('red');
+    expect(RatingIcon.firstChild).toHaveStyle('fill: #587169;');
+  });
+  it('should be able to change size 40px', function () {
+    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Rating, {
+      value: 5,
+      size: "40px"
+    }));
+
+    var RatingIcons = _react.screen.getAllByRole('button')[0];
+
+    expect(RatingIcons.firstChild).toHaveStyle({
+      width: 40,
+      height: 40
+    });
   });
 });

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

@@ -0,0 +1,19 @@
+/// <reference types="react" />
+import { ContainerIconsProps } from './types';
+export declare const RatingContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    readOnly: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ContainerIcon: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    readOnly: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ContainerFilled: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & ContainerIconsProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+//# sourceMappingURL=styles.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAE9C,eAAO,MAAM,eAAe;;;;cAA0B,OAAO;yGAQ5D,CAAC;AAEF,eAAO,MAAM,aAAa;;;;cAA0B,OAAO;yGAM1D,CAAC;AAEF,eAAO,MAAM,eAAe;;;+HAM3B,CAAC"}

package/dist/components/Rating/styles.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RatingContainer = exports.ContainerIcon = exports.ContainerFilled = void 0;
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _react = require("@emotion/react");
+
+var _templateObject, _templateObject2, _templateObject3;
+
+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 RatingContainer = _styled.default.div(function (_ref) {
+  var readOnly = _ref.readOnly;
+  return (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    display: inline-flex;\n    position: relative;\n    cursor: pointer;\n    pointer-events: ", ";\n    text-align: left;\n  "])), readOnly ? 'none' : 'auto');
+});
+
+exports.RatingContainer = RatingContainer;
+
+var ContainerIcon = _styled.default.div(function (_ref2) {
+  var readOnly = _ref2.readOnly;
+  return (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    position: relative;\n    cursor: pointer;\n    pointer-events: ", ";\n  "])), readOnly ? 'none' : 'auto');
+});
+
+exports.ContainerIcon = ContainerIcon;
+
+var ContainerFilled = _styled.default.div(function (_ref3) {
+  var showRatingWithPrecision = _ref3.showRatingWithPrecision,
+      activeState = _ref3.activeState;
+  return (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    width: ", ";\n    overflow: hidden;\n    position: absolute;\n  "])), showRatingWithPrecision ? "".concat(activeState % 1 * 100, "%") : '0%');
+});
+
+exports.ContainerFilled = ContainerFilled;

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

@@ -1,29 +1,20 @@
-import { ExtendThemeProps } from '../../shared/theme';
-import { GradientIconName } from './components/GradientIcon/types';
-export declare type SizeType = 'small' | 'medium' | 'large';
-export declare type IStyleProps = {
-    primaryColor?: string;
-    secondaryColor?: string;
-    theme?: ExtendThemeProps;
-    disabled?: boolean;
-    active?: boolean;
-    size?: SizeType;
-    isActive?: boolean;
-    SwitchType?: 'success' | 'error' | 'warning' | 'informative' | 'critical' | 'success_secondary' | 'warning_secondary';
-};
-export declare type IInputProps = {
-    name: GradientIconName;
+import { GlobalColorsProps } from '../../shared/theme';
+import { IconName } from '../Icon/types';
+export interface RatingProps {
+    precision?: 1 | 0.5 | 0.25;
     value?: number;
-    defaultValue?: number;
-    iconsQuantity?: number;
-    precision?: '1' | '0.5';
-    size?: SizeType;
+    quantity?: number;
+    colorFilledIcon?: GlobalColorsProps | (string & {});
+    colorOutlinedIcon?: GlobalColorsProps | (string & {});
+    size?: string;
     readOnly?: boolean;
-    disabled?: boolean;
-    primaryColor?: string;
-    secondaryColor?: string;
-    strokeColor?: string;
-    onChangeValue?: (value: number) => void;
+    filledIcon?: IconName;
+    outlinedIcon?: IconName;
     onChange?: (value: number) => void;
-};
+}
+export interface ContainerIconsProps {
+    showRatingWithPrecision?: boolean;
+    showEmptyIcon?: boolean;
+    activeState: number;
+}
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AAEnE,oBAAY,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEpD,oBAAY,WAAW,GAAG;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EACP,SAAS,GACT,OAAO,GACP,SAAS,GACT,aAAa,GACb,UAAU,GACV,mBAAmB,GACnB,mBAAmB,CAAC;CACzB,CAAC;AAEF,oBAAY,WAAW,GAAG;IACxB,IAAI,EAAE,gBAAgB,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,GAAG,GAAG,KAAK,CAAC;IACxB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,MAAM,WAAW,WAAW;IAC1B,SAAS,CAAC,EAAE,CAAC,GAAG,GAAG,GAAG,IAAI,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,eAAe,CAAC,EAAE,iBAAiB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IACpD,iBAAiB,CAAC,EAAE,iBAAiB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IACtD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,QAAQ,CAAC;IACtB,YAAY,CAAC,EAAE,QAAQ,CAAC;IACxB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAED,MAAM,WAAW,mBAAmB;IAClC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,EAAE,MAAM,CAAC;CACrB"}

package/dist/components/Select/components/OptionsSelect/styles.d.ts

@@ -8,259 +8,8 @@ interface OptionsContainerProps {
     top: string;
 }
 export declare const OptionsContainer: import("@emotion/styled").StyledComponent<{
-    slot?: string | undefined;
-    title?: string | undefined;
-    color?: string | undefined;
-    translate?: "no" | "yes" | undefined;
-    id?: string | undefined;
-    hidden?: boolean | undefined;
-    className?: string | undefined;
-    lang?: string | undefined;
-    role?: import("react").AriaRole | undefined;
-    tabIndex?: number | undefined;
-    "aria-activedescendant"?: string | undefined;
-    "aria-atomic"?: (boolean | "false" | "true") | undefined;
-    "aria-autocomplete"?: "none" | "list" | "inline" | "both" | undefined;
-    "aria-busy"?: (boolean | "false" | "true") | undefined;
-    "aria-checked"?: boolean | "mixed" | "false" | "true" | undefined;
-    "aria-colcount"?: number | undefined;
-    "aria-colindex"?: number | undefined;
-    "aria-colspan"?: number | undefined;
-    "aria-controls"?: string | undefined;
-    "aria-current"?: boolean | "time" | "page" | "false" | "true" | "step" | "location" | "date" | undefined;
-    "aria-describedby"?: string | undefined;
-    "aria-details"?: string | undefined;
-    "aria-disabled"?: (boolean | "false" | "true") | undefined;
-    "aria-dropeffect"?: "link" | "none" | "copy" | "move" | "execute" | "popup" | undefined;
-    "aria-errormessage"?: string | undefined;
-    "aria-expanded"?: (boolean | "false" | "true") | undefined;
-    "aria-flowto"?: string | undefined;
-    "aria-grabbed"?: (boolean | "false" | "true") | undefined;
-    "aria-haspopup"?: boolean | "dialog" | "menu" | "grid" | "listbox" | "false" | "true" | "tree" | undefined;
-    "aria-hidden"?: (boolean | "false" | "true") | undefined;
-    "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
-    "aria-keyshortcuts"?: string | undefined;
-    "aria-label"?: string | undefined;
-    "aria-labelledby"?: string | undefined;
-    "aria-level"?: number | undefined;
-    "aria-live"?: "off" | "assertive" | "polite" | undefined;
-    "aria-modal"?: (boolean | "false" | "true") | undefined;
-    "aria-multiline"?: (boolean | "false" | "true") | undefined;
-    "aria-multiselectable"?: (boolean | "false" | "true") | undefined;
-    "aria-orientation"?: "horizontal" | "vertical" | undefined;
-    "aria-owns"?: string | undefined;
-    "aria-placeholder"?: string | undefined;
-    "aria-posinset"?: number | undefined;
-    "aria-pressed"?: boolean | "mixed" | "false" | "true" | undefined;
-    "aria-readonly"?: (boolean | "false" | "true") | undefined;
-    "aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
-    "aria-required"?: (boolean | "false" | "true") | undefined;
-    "aria-roledescription"?: string | undefined;
-    "aria-rowcount"?: number | undefined;
-    "aria-rowindex"?: number | undefined;
-    "aria-rowspan"?: number | undefined;
-    "aria-selected"?: (boolean | "false" | "true") | undefined;
-    "aria-setsize"?: number | undefined;
-    "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
-    "aria-valuemax"?: number | undefined;
-    "aria-valuemin"?: number | undefined;
-    "aria-valuenow"?: number | undefined;
-    "aria-valuetext"?: string | undefined;
-    children?: import("react").ReactNode;
-    dangerouslySetInnerHTML?: {
-        __html: string;
-    } | undefined;
-    onCopy?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
-    onCopyCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
-    onCut?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
-    onCutCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
-    onPaste?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
-    onPasteCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
-    onCompositionEnd?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
-    onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
-    onCompositionStart?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
-    onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
-    onCompositionUpdate?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
-    onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
-    onFocus?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
-    onFocusCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
-    onBlur?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
-    onBlurCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
-    onChange?: import("react").FormEventHandler<HTMLDivElement> | undefined;
-    onChangeCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
-    onBeforeInput?: import("react").FormEventHandler<HTMLDivElement> | undefined;
-    onBeforeInputCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
-    onInput?: import("react").FormEventHandler<HTMLDivElement> | undefined;
-    onInputCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
-    onReset?: import("react").FormEventHandler<HTMLDivElement> | undefined;
-    onResetCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
-    onSubmit?: import("react").FormEventHandler<HTMLDivElement> | undefined;
-    onSubmitCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
-    onInvalid?: import("react").FormEventHandler<HTMLDivElement> | undefined;
-    onInvalidCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
-    onLoad?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onLoadCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onError?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onErrorCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onKeyDown?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
-    onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
-    onKeyPress?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
-    onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
-    onKeyUp?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
-    onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
-    onAbort?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onAbortCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onCanPlay?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onCanPlayCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onCanPlayThrough?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onDurationChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onDurationChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onEmptied?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onEmptiedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onEncrypted?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onEncryptedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onEnded?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onEndedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onLoadedData?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onLoadedDataCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onLoadedMetadata?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onLoadStart?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onLoadStartCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onPause?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onPauseCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onPlay?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onPlayCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onPlaying?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onPlayingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onProgress?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onProgressCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onRateChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onRateChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onSeeked?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onSeekedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onSeeking?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onSeekingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onStalled?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onStalledCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onSuspend?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onSuspendCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onTimeUpdate?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onVolumeChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onWaiting?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onWaitingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onAuxClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onAuxClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onContextMenu?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onContextMenuCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onDoubleClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onDoubleClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onDragCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
-    onDragEndCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
-    onDragEnter?: import("react").DragEventHandler<HTMLDivElement> | undefined;
-    onDragEnterCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
-    onDragExit?: import("react").DragEventHandler<HTMLDivElement> | undefined;
-    onDragExitCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
-    onDragLeave?: import("react").DragEventHandler<HTMLDivElement> | undefined;
-    onDragLeaveCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
-    onDragOver?: import("react").DragEventHandler<HTMLDivElement> | undefined;
-    onDragOverCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
-    onDragStartCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
-    onDrop?: import("react").DragEventHandler<HTMLDivElement> | undefined;
-    onDropCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
-    onMouseDown?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseDownCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseEnter?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseLeave?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseMove?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseMoveCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseOut?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseOutCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseOver?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseOverCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseUp?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onMouseUpCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
-    onSelect?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onSelectCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
-    onTouchCancel?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
-    onTouchCancelCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
-    onTouchEnd?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
-    onTouchEndCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
-    onTouchMove?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
-    onTouchMoveCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
-    onTouchStart?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
-    onTouchStartCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
-    onPointerDown?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerDownCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerMove?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerMoveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerUp?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerUpCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerCancel?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerCancelCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerEnter?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerEnterCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerLeave?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerOver?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerOverCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerOut?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerOutCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onGotPointerCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onLostPointerCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onScroll?: import("react").UIEventHandler<HTMLDivElement> | undefined;
-    onScrollCapture?: import("react").UIEventHandler<HTMLDivElement> | undefined;
-    onWheel?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
-    onWheelCapture?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
-    onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
-    onAnimationEnd?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
-    onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
-    onAnimationIteration?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
-    onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
-    onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
-    onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
-    defaultChecked?: boolean | undefined;
-    defaultValue?: string | number | readonly string[] | undefined;
-    suppressContentEditableWarning?: boolean | undefined;
-    suppressHydrationWarning?: boolean | undefined;
-    accessKey?: string | undefined;
-    contentEditable?: "inherit" | (boolean | "false" | "true") | undefined;
-    contextMenu?: string | undefined;
-    dir?: string | undefined;
-    draggable?: (boolean | "false" | "true") | undefined;
-    placeholder?: string | undefined;
-    spellCheck?: (boolean | "false" | "true") | undefined;
-    radioGroup?: string | undefined;
-    about?: string | undefined;
-    datatype?: string | undefined;
-    inlist?: any;
-    prefix?: string | undefined;
-    property?: string | undefined;
-    resource?: string | undefined;
-    typeof?: string | undefined;
-    vocab?: string | undefined;
-    autoCapitalize?: string | undefined;
-    autoCorrect?: string | undefined;
-    autoSave?: string | undefined;
-    itemProp?: string | undefined;
-    itemScope?: boolean | undefined;
-    itemType?: string | undefined;
-    itemID?: string | undefined;
-    itemRef?: string | undefined;
-    results?: number | undefined;
-    security?: string | undefined;
-    unselectable?: "off" | "on" | undefined;
-    inputMode?: "search" | "text" | "none" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
-    is?: string | undefined;
-} & import("framer-motion").MotionProps & import("react").RefAttributes<HTMLDivElement> & {
     theme?: import("@emotion/react").Theme | undefined;
-} & OptionsContainerProps, {}, {}>;
+    as?: import("react").ElementType<any> | undefined;
+} & OptionsContainerProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export {};
 //# sourceMappingURL=styles.d.ts.map

package/dist/components/Select/components/OptionsSelect/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Select/components/OptionsSelect/styles.ts"],"names":[],"mappings":";AAIA,UAAU,qBAAqB;IAC7B,IAAI,EAAE,OAAO,CAAC;IAEd,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;CACb;AAED,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kCAqC3B,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Select/components/OptionsSelect/styles.ts"],"names":[],"mappings":";AAGA,UAAU,qBAAqB;IAC7B,IAAI,EAAE,OAAO,CAAC;IAEd,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;CACb;AAED,eAAO,MAAM,gBAAgB;;;iIAqC3B,CAAC"}

package/dist/components/Select/components/OptionsSelect/styles.js

@@ -9,8 +9,6 @@ var _react = require("@emotion/react");
 
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 
-var _framerMotion = require("framer-motion");
-
 var _templateObject;
 
 var _excluded = ["theme"];
@@ -23,10 +21,11 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 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 OptionsContainer = (0, _styled.default)(_framerMotion.motion.div)(function (_ref) {
+var OptionsContainer = _styled.default.div(function (_ref) {
   var theme = _ref.theme,
       props = _objectWithoutProperties(_ref, _excluded);
 
   return (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n    max-width: ", ";\n    min-width: ", ";\n    max-height: calc(", " - 20px);\n    position: fixed;\n    left: ", ";\n    top: ", ";\n    z-index: ", ";\n    opacity: ", ";\n    pointer-events: ", ";\n    transition: opacity ease ", ";\n    overflow-y: auto;\n    overflow-x: hidden;\n    background: ", ";\n    border: 2px solid ", ";\n    border-radius: ", ";\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    li {\n      list-style: none;\n    }\n  "])), props.maxWidth, props.minWidth || 'initial', props.maxHeight, props.left, props.top, theme.zIndex.level24, props.open ? 1 : 0, props.open ? 'auto' : 'none', theme.transition.speed, theme.colors.background.light, theme.colors.neutral.neutral1, theme.borderRadius.default, theme.borderRadius.default, theme.colors.primary.default);
 });
+
 exports.OptionsContainer = OptionsContainer;

package/dist/components/Select/index.js

@@ -225,7 +225,7 @@ var Select = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
         tabIndex: -1
       }, rest))]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ReactPortal.ReactPortal, {
-      wrapperId: "portal-root",
+      wrapperId: "portal-select",
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_OptionsSelect.OptionsSelect, {
         open: optionsMenuOpen,
         left: "".concat((_containerRef$current3 = containerRef.current) === null || _containerRef$current3 === void 0 ? void 0 : _containerRef$current3.getBoundingClientRect().left, "px"),

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

@@ -1 +1 @@
-{"version":3,"file":"ToastProvider.d.ts","sourceRoot":"","sources":["../../../../src/components/Toast/contexts/ToastProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,EAAE,EAAyB,MAAM,OAAO,CAAC;AAGjE,OAAO,EAA4B,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAExE,eAAO,MAAM,YAAY,6CAA0C,CAAC;AAEpE,QAAA,MAAM,aAAa,EAAE,EAmCpB,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"ToastProvider.d.ts","sourceRoot":"","sources":["../../../../src/components/Toast/contexts/ToastProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,EAAE,EAAyB,MAAM,OAAO,CAAC;AAGjE,OAAO,EAA4B,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAExE,eAAO,MAAM,YAAY,6CAA0C,CAAC;AAEpE,QAAA,MAAM,aAAa,EAAE,EAqCpB,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/Toast/contexts/ToastProvider.js

@@ -65,12 +65,16 @@ var ToastProvider = function ToastProvider(_ref) {
   }, []);
   var remoteToast = (0, _react.useCallback)(function (id) {
     setToasts(function (prevState) {
-      var _filterToast$0$config, _filterToast$0$config2;
-
       var filterToast = prevState.filter(function (toast) {
         return toast.id === id;
       });
-      (_filterToast$0$config = (_filterToast$0$config2 = filterToast[0].config).onClose) === null || _filterToast$0$config === void 0 ? void 0 : _filterToast$0$config.call(_filterToast$0$config2, id);
+
+      if (filterToast[0]) {
+        var _filterToast$0$config, _filterToast$0$config2;
+
+        (_filterToast$0$config = (_filterToast$0$config2 = filterToast[0].config).onClose) === null || _filterToast$0$config === void 0 ? void 0 : _filterToast$0$config.call(_filterToast$0$config2, id);
+      }
+
       return prevState.filter(function (toast) {
         return toast.id !== id;
       });

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Toast/index.tsx"],"names":[],"mappings":";AAcA,QAAA,MAAM,cAAc,mBAuFnB,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Toast/index.tsx"],"names":[],"mappings":";AAeA,QAAA,MAAM,cAAc,mBAuFnB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/Toast/index.js

@@ -11,6 +11,8 @@ var _framerMotion = require("framer-motion");
 
 var _Toast = _interopRequireDefault(require("./components/Toast"));
 
+var _ReactPortal = require("../ReactPortal");
+
 var _ToastProvider = require("./contexts/ToastProvider");
 
 var _styles = require("./styles");
@@ -30,7 +32,8 @@ var ToastContainer = function ToastContainer() {
       toasts = _useContext.toasts,
       remove = _useContext.remove;
 
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Fragment, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ReactPortal.ReactPortal, {
+    wrapperId: "toast-root",
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.StyledToastContainerOverlay, {
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StyledToastManagerOverlay, {
         position: "top",