@pedidopago/ui 1.1.4 → 1.2.1

package/dist/@types/index.d.ts

@@ -1,7 +1,7 @@
-import { ExtendThemeProps } from '../shared/theme/theme.types';
-export declare type GenericStyledProps = {
-    theme?: ExtendThemeProps & {
-        colorMode: 'light' | 'dark';
-    };
-};
+import { ExtendThemeProps } from '../shared/theme/theme.types';
+export declare type GenericStyledProps = {
+    theme?: ExtendThemeProps & {
+        colorMode: 'light' | 'dark';
+    };
+};
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Alert/alert.test.d.ts

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

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAe3B,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEtC,QAAA,MAAM,KAAK,EAAE,EAAE,CAAC,WAAW,CA4C1B,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAgB3B,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEtC,QAAA,MAAM,KAAK,EAAE,EAAE,CAAC,WAAW,CAkD1B,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/dist/components/Alert/index.js

@@ -23,6 +23,9 @@ var Alert = function Alert(_ref) {
       title = _ref.title,
       fullWidth = _ref.fullWidth,
       isLoading = _ref.isLoading,
+      children = _ref.children,
+      _ref$icon = _ref.icon,
+      icon = _ref$icon === void 0 ? 'info' : _ref$icon,
       _ref$type = _ref.type,
       type = _ref$type === void 0 ? 'default' : _ref$type,
       _ref$variant = _ref.variant,
@@ -39,7 +42,7 @@ var Alert = function Alert(_ref) {
         variant: variant,
         havePadding: variant === 'outlined',
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
-          name: "info",
+          name: icon,
           size: variant === 'outlined' ? '1.375rem' : '2rem'
         })
       }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.StyledColumn, {
@@ -48,19 +51,19 @@ var Alert = function Alert(_ref) {
           fontSize: "xs",
           fontWeight: "bold",
           children: title
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
-          fontSize: "xs",
-          fontWeight: "400",
-          children: message
-        }), buttonTitle && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StyledButtonRow, {
-          variant: variant,
-          type: type,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StyledButton, {
-            onClick: function onClick() {
-              return onButtonClick && onButtonClick();
-            },
-            children: buttonTitle
-          })
+        }), children || /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+            fontSize: "xs",
+            fontWeight: "400",
+            children: message
+          }), buttonTitle && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StyledButtonRow, {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StyledButton, {
+              onClick: function onClick() {
+                return onButtonClick && onButtonClick();
+              },
+              children: buttonTitle
+            })
+          })]
         })]
       }), variant === 'closable' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StyledCloseIcon, {
         onClick: function onClick() {

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

@@ -1,37 +1,37 @@
-/// <reference types="react" />
-import { IStyledAlert } from './types';
-export declare const StyledAlertContainer: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const StyledAlertWrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledAlert, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const StyledIconBox: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledAlert & {
-    havePadding: boolean;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const StyledColumn: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledAlert, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const StyledCloseIcon: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const StyledAlertSkeleton: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledAlert, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const StyledButtonRow: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledAlert, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const StyledButton: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+/// <reference types="react" />
+import { IStyledAlert } from './types';
+export declare const StyledAlertContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledAlertWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledAlert, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledIconBox: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledAlert & {
+    havePadding: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledColumn: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledAlert, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledCloseIcon: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledAlertSkeleton: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & IStyledAlert, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledButtonRow: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledButton: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
 //# sourceMappingURL=styles.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAEvC,eAAO,MAAM,oBAAoB;;;yGAEhC,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;wHAqB7B,CAAC;AAEH,eAAO,MAAM,aAAa;;;;iBAA4C,OAAO;yGAyB3E,CAAC;AAEH,eAAO,MAAM,YAAY;;;wHASxB,CAAC;AAEF,eAAO,MAAM,eAAe;;;yGAS3B,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;wHA+B/B,CAAC;AAEF,eAAO,MAAM,eAAe;;;wHA6B1B,CAAC;AAEH,eAAO,MAAM,YAAY;;;qHAcxB,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAEvC,eAAO,MAAM,oBAAoB;;;yGAEhC,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;wHAmD7B,CAAC;AAEH,eAAO,MAAM,aAAa;;;;iBAA4C,OAAO;yGA0B3E,CAAC;AAEH,eAAO,MAAM,YAAY;;;wHASxB,CAAC;AAEF,eAAO,MAAM,eAAe;;;yGAS3B,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;wHA+B/B,CAAC;AAEF,eAAO,MAAM,eAAe;;;yGAK3B,CAAC;AAEF,eAAO,MAAM,YAAY;;;qHAAkB,CAAC"}

package/dist/components/Alert/styles.js

@@ -22,8 +22,10 @@ var StyledAlertContainer = _styled.default.div(_templateObject || (_templateObje
 exports.StyledAlertContainer = StyledAlertContainer;
 
 var StyledAlertWrapper = _styled.default.div(function (props) {
+  var buttonPrimaryColor = props.type !== 'default' && props.type ? props.theme.colors[props.type].default : props.theme.colors.neutral.neutral3;
+  var buttonSecondaryColor = props.type !== 'default' && props.type ? props.theme.colorMode === 'dark' ? props.theme.colors[props.type].dark : props.theme.colors[props.type].blurred : props.theme.colors.neutral.neutral1;
   var secondaryColor = props.type !== 'default' && props.type ? props.theme.colorMode === 'dark' ? props.theme.colors[props.type].dark : props.theme.colors[props.type].blurred : props.theme.colorMode === 'dark' ? props.theme.colors.neutral.neutral6 : props.theme.colors.neutral.neutral1;
-  return (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    display: flex;\n    align-items: flex-start;\n    padding: 1rem;\n    gap: 1rem;\n    border-radius: 8px;\n    max-width: ", ";\n    background-color: ", ";\n    border: ", ";\n    color: ", ";\n  "])), props.fullWidth ? '100%' : '459px', props.variant === 'outlined' ? 'transparent' : secondaryColor, props.variant === 'outlined' ? "2px solid ".concat(secondaryColor, ";") : '', props.variant === 'outlined' ? props.theme.colors.neutral.neutral4 : '');
+  return (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    display: flex;\n    align-items: flex-start;\n    padding: 1rem;\n    gap: 1rem;\n    border-radius: 8px;\n    max-width: ", ";\n    background-color: ", ";\n    border: ", ";\n    color: ", ";\n\n    & button {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      font-family: inherit;\n      font-weight: 600;\n      cursor: pointer;\n      border-radius: 8px;\n      padding: 8px 24px;\n      background-color: ", ";\n      border: ", ";\n      color: ", ";\n    }\n  "])), props.fullWidth ? '100%' : '459px', props.variant === 'outlined' ? 'transparent' : secondaryColor, props.variant === 'outlined' ? "2px solid ".concat(secondaryColor, ";") : '', props.variant === 'outlined' ? props.theme.colors.neutral.neutral4 : '', props.variant === 'outlined' ? buttonSecondaryColor : 'transparent', props.variant !== 'outlined' ? "2px solid ".concat(buttonPrimaryColor) : '0', props.variant === 'outlined' ? buttonPrimaryColor : props.theme.colorMode === 'dark' ? props.theme.colors.neutral.white : props.theme.colors.neutral.black);
 });
 
 exports.StyledAlertWrapper = StyledAlertWrapper;
@@ -32,7 +34,7 @@ var StyledIconBox = _styled.default.div(function (props) {
   var primaryColor = props.type !== 'default' && props.type ? props.theme.colors[props.type].default : props.theme.colors.neutral.neutral1;
   var secondaryColor = props.type !== 'default' && props.type ? (0, _colorCheck.parseHexColorToRgba)(props.theme.colors[props.type].default, 0.2) : props.theme.colors.neutral.neutral1;
   var iconColor = props.type !== 'default' ? primaryColor : props.theme.colors.neutral.neutral3;
-  return (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: ", ";\n    border-radius: 9999999px;\n    background-color: ", ";\n\n    & svg {\n      color: ", ";\n    }\n  "])), props.havePadding ? '10px' : '0', props.variant === 'outlined' ? secondaryColor : '', iconColor);
+  return (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    padding: ", ";\n    border-radius: 9999999px;\n    background-color: ", ";\n\n    & svg {\n      color: ", ";\n    }\n  "])), props.havePadding ? '10px' : '0', props.variant === 'outlined' ? secondaryColor : '', iconColor);
 });
 
 exports.StyledIconBox = StyledIconBox;
@@ -57,14 +59,10 @@ var StyledAlertSkeleton = _styled.default.div(_templateObject6 || (_templateObje
 
 exports.StyledAlertSkeleton = StyledAlertSkeleton;
 
-var StyledButtonRow = _styled.default.div(function (props) {
-  var primaryColor = props.type !== 'default' && props.type ? props.theme.colors[props.type].default : props.theme.colors.neutral.neutral3;
-  var secondaryColor = props.type !== 'default' && props.type ? props.theme.colorMode === 'dark' ? props.theme.colors[props.type].dark : props.theme.colors[props.type].blurred : props.theme.colors.neutral.neutral1;
-  return (0, _react.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    flex-wrap: wrap;\n\n    & > button {\n      background-color: ", ";\n      border: ", ";\n      color: ", ";\n    }\n  "])), props.variant === 'outlined' ? secondaryColor : '', props.variant !== 'outlined' ? "2px solid ".concat(primaryColor) : '', props.variant === 'outlined' ? primaryColor : props.theme.colorMode === 'dark' ? props.theme.colors.neutral.white : props.theme.colors.neutral.black);
-});
+var StyledButtonRow = _styled.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex-wrap: wrap;\n"])));
 
 exports.StyledButtonRow = StyledButtonRow;
 
-var StyledButton = _styled.default.button(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-family: inherit;\n  font-weight: 600;\n\n  cursor: pointer;\n\n  background: transparent;\n  outline: 0;\n  border: 0;\n  border-radius: 8px;\n  padding: 8px 24px;\n"])));
+var StyledButton = _styled.default.button(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral([""])));
 
 exports.StyledButton = StyledButton;

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

@@ -1,49 +1,61 @@
-import { ExtendThemeProps } from 'src';
-export declare type IAlertProps = {
-    /**
-     * The variantion of the alert component style
-     * @default 'filled'
-     */
-    variant?: 'outlined' | 'filled' | 'closable';
-    /**
-     * The type of the alert component
-     * @default 'default'
-     */
-    type?: 'default' | 'success' | 'warning' | 'error' | 'critical' | 'informative';
-    /**
-     * The message of the alet
-     */
-    message: string;
-    /**
-     * The title of the alert
-     */
-    title: string;
-    /**
-     * The title of the alert button
-     */
-    buttonTitle?: string;
-    /**
-     * The action of the alert button
-     */
-    onButtonClick?: () => void;
-    /**
-     * Whether the alert is loading
-     */
-    isLoading?: boolean;
-    /**
-     * Sets a full width alert
-     */
-    fullWidth?: boolean;
-    /**
-     * Provides a callback that is called when the close button is clicked.
-     * @description This props are available when variant is set to 'closable'
-     */
-    onClose?: () => void;
-};
-export declare type IStyledAlert = {
-    fullWidth?: boolean;
-    variant?: 'outlined' | 'filled' | 'closable';
-    type?: 'default' | 'success' | 'warning' | 'error' | 'critical' | 'informative';
-    theme?: ExtendThemeProps;
-};
+import { ReactNode } from 'react';
+import { ExtendThemeProps } from 'src';
+import { IconName } from '../Icon/types';
+export declare type IAlertProps = {
+    /**
+     * The icon of the alert.
+     * @default 'info'
+     */
+    icon?: IconName;
+    /**
+     * The variantion of the alert component style
+     * @default 'filled'
+     */
+    variant?: 'outlined' | 'filled' | 'closable';
+    /**
+     * The type of the alert component
+     * @default 'default'
+     */
+    type?: 'default' | 'success' | 'warning' | 'error' | 'critical' | 'informative';
+    /**
+     * The message of the alert
+     */
+    message: string;
+    /**
+     * The children of the alert
+     * @default undefined
+     */
+    children?: ReactNode;
+    /**
+     * The title of the alert
+     */
+    title: string;
+    /**
+     * The title of the alert button
+     */
+    buttonTitle?: string;
+    /**
+     * The action of the alert button
+     */
+    onButtonClick?: () => void;
+    /**
+     * Whether the alert is loading
+     */
+    isLoading?: boolean;
+    /**
+     * Sets a full width alert
+     */
+    fullWidth?: boolean;
+    /**
+     * Provides a callback that is called when the close button is clicked.
+     * @description This props are available when variant is set to 'closable'
+     */
+    onClose?: () => void;
+};
+export declare type IStyledAlert = {
+    fullWidth?: boolean;
+    variant?: 'outlined' | 'filled' | 'closable';
+    type?: 'default' | 'success' | 'warning' | 'error' | 'critical' | 'informative';
+    theme?: ExtendThemeProps;
+};
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,KAAK,CAAC;AAEvC,oBAAY,WAAW,GAAG;IACxB;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAC;IAC7C;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,GAAG,aAAa,CAAC;IAChF;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,oBAAY,YAAY,GAAG;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAC;IAC7C,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,GAAG,aAAa,CAAC;IAChF,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC1B,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,gBAAgB,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,oBAAY,WAAW,GAAG;IACxB;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAC;IAC7C;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,GAAG,aAAa,CAAC;IAChF;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,oBAAY,YAAY,GAAG;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAC;IAC7C,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,GAAG,aAAa,CAAC;IAChF,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC1B,CAAC"}

package/dist/components/Avatar/avatar.test.d.ts

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

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

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

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

@@ -1,26 +1,26 @@
-/// <reference types="react" />
-import { GenericAvatarStyled } from './types';
-export declare const AvatarWrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & GenericAvatarStyled, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const AvatarImage: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & GenericAvatarStyled, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
-export declare const AvatarInitials: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & GenericAvatarStyled, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const AvatarInformation: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & GenericAvatarStyled, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const AvatarSkeleton: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & GenericAvatarStyled & {
-    circle?: boolean | undefined;
-    description?: boolean | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/// <reference types="react" />
+import { GenericAvatarStyled } from './types';
+export declare const AvatarWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & GenericAvatarStyled, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const AvatarImage: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & GenericAvatarStyled, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
+export declare const AvatarInitials: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & GenericAvatarStyled, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const AvatarInformation: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & GenericAvatarStyled, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const AvatarSkeleton: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & GenericAvatarStyled & {
+    circle?: boolean | undefined;
+    description?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 //# sourceMappingURL=styles.d.ts.map

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

@@ -1,16 +1,16 @@
-import { ExtendThemeProps, GlobalColorsProps } from 'src';
-export declare type IAvatarComponent = {
-    name: string;
-    src?: string;
-    information?: string;
-    boxColor?: GlobalColorsProps | (string & {});
-    size?: 'small' | 'medium' | 'large';
-    isLoading?: boolean;
-};
-export declare type GenericAvatarStyled = {
-    boxColor?: GlobalColorsProps | (string & {});
-    theme?: {
-        size: 'small' | 'medium' | 'large';
-    } & ExtendThemeProps;
-};
+import { ExtendThemeProps, GlobalColorsProps } from 'src';
+export declare type IAvatarComponent = {
+    name: string;
+    src?: string;
+    information?: string;
+    boxColor?: GlobalColorsProps | (string & {});
+    size?: 'small' | 'medium' | 'large';
+    isLoading?: boolean;
+};
+export declare type GenericAvatarStyled = {
+    boxColor?: GlobalColorsProps | (string & {});
+    theme?: {
+        size: 'small' | 'medium' | 'large';
+    } & ExtendThemeProps;
+};
 //# sourceMappingURL=types.d.ts.map

package/dist/components/Badge/badge.test.d.ts

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

package/dist/components/Badge/badge.test.js

@@ -8,6 +8,8 @@ var _ = _interopRequireDefault(require("."));
 
 var _jsxRuntime = require("react/jsx-runtime");
 
+var _excluded = ["children"];
+
 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; }
@@ -16,22 +18,35 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 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)));
+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 setup = function setup(_ref) {
+  var children = _ref.children,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  var utils = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, _objectSpread(_objectSpread({}, props), {}, {
+    children: children
+  })));
   return utils;
 };
 
 describe('Badge', function () {
   it('should it render the badge component', function () {
     var utils = setup({
-      text: 'Teste badge',
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: "Teste badge"
+      }),
       type: 'primary'
     });
     expect(utils.container).toBeInTheDocument();
   });
   it('should it render the badge component in loading state', function () {
     var utils = setup({
-      text: 'Teste badge',
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: "Teste badge"
+      }),
       type: 'primary',
       isLoading: true
     });
@@ -40,7 +55,9 @@ describe('Badge', function () {
   it('should it render multiply badges', function () {
     var utils = function utils(type) {
       return setup({
-        text: 'Teste badge',
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          children: "Teste badge"
+        }),
         type: type,
         isLoading: true
       });

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

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

package/dist/components/Badge/index.js

@@ -18,15 +18,13 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 // Styles
 var Badge = function Badge(_ref) {
   var type = _ref.type,
-      text = _ref.text,
-      isLoading = _ref.isLoading;
+      isLoading = _ref.isLoading,
+      children = _ref.children;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.BadgeContainer, {
     children: !isLoading ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.BadgeCircle, {
         type: type
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.BadgeText, {
-        children: text
-      })]
+      }), children]
     }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Flex.default, {
       spacing: "2",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.default, {

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

@@ -1,21 +1,17 @@
-/// <reference types="react" />
-import { BadgeStyledProps } from './types';
-export declare const BadgeContainer: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const BadgeCircle: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & BadgeStyledProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const BadgeText: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-export declare const BadgeSkeleton: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & {
-    circle?: boolean | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/// <reference types="react" />
+import { BadgeStyledProps } from './types';
+export declare const BadgeContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const BadgeCircle: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & BadgeStyledProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const BadgeSkeleton: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    circle?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 //# sourceMappingURL=styles.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/styles.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAE3C,eAAO,MAAM,cAAc;;;yGAG1B,CAAC;AAEF,eAAO,MAAM,WAAW;;;4HAetB,CAAC;AAEH,eAAO,MAAM,SAAS;;;2GAMrB,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;yGAoCzB,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/styles.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAE3C,eAAO,MAAM,cAAc;;;yGAG1B,CAAC;AAEF,eAAO,MAAM,WAAW;;;4HAetB,CAAC;AAEH,eAAO,MAAM,aAAa;;;;;yGAoCzB,CAAC"}

package/dist/components/Badge/styles.js

@@ -3,11 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.BadgeText = exports.BadgeSkeleton = exports.BadgeContainer = exports.BadgeCircle = void 0;
+exports.BadgeSkeleton = exports.BadgeContainer = exports.BadgeCircle = void 0;
 
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 
-var _templateObject, _templateObject2, _templateObject3;
+var _templateObject, _templateObject2;
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -26,15 +26,7 @@ var BadgeCircle = _styled.default.div(function (props) {
 
 exports.BadgeCircle = BadgeCircle;
 
-var BadgeText = _styled.default.span(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  font-size: ", ";\n  color: ", ";\n"])), function (props) {
-  return props.theme.fontSizes.xxs;
-}, function (props) {
-  return props.theme.colorMode === 'light' ? props.theme.colors.neutral.neutral5 : props.theme.colors.neutral.white;
-});
-
-exports.BadgeText = BadgeText;
-
-var BadgeSkeleton = _styled.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  width: ", ";\n  height: 10px;\n  display: block;\n  border-radius: ", ";\n  background-color: ", ";\n  overflow: hidden;\n\n  &:not(:last-child) {\n    margin-right: 8px;\n  }\n\n  &::after {\n    content: '';\n    inset: 0px;\n    width: 100%;\n    height: 100%;\n    display: block;\n    animation: 1.6s linear 0.5s infinite normal none running move;\n    transform: translateX(-100%);\n    background: linear-gradient(\n      90deg,\n      transparent,\n      ", ",\n      transparent\n    );\n  }\n\n  @keyframes move {\n    0% {\n      transform: translateX(-100%);\n    }\n    100% {\n      transform: translateX(100%);\n    }\n  }\n"])), function (props) {
+var BadgeSkeleton = _styled.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  width: ", ";\n  height: 10px;\n  display: block;\n  border-radius: ", ";\n  background-color: ", ";\n  overflow: hidden;\n\n  &:not(:last-child) {\n    margin-right: 8px;\n  }\n\n  &::after {\n    content: '';\n    inset: 0px;\n    width: 100%;\n    height: 100%;\n    display: block;\n    animation: 1.6s linear 0.5s infinite normal none running move;\n    transform: translateX(-100%);\n    background: linear-gradient(\n      90deg,\n      transparent,\n      ", ",\n      transparent\n    );\n  }\n\n  @keyframes move {\n    0% {\n      transform: translateX(-100%);\n    }\n    100% {\n      transform: translateX(100%);\n    }\n  }\n"])), function (props) {
   return props.circle ? '10px' : '4rem';
 }, function (props) {
   return props.circle ? '999999px' : '2px';