@pedidopago/ui 1.2.1 → 1.2.4

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAOjD,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAGvC,QAAA,MAAM,MAAM,EAAE,EAAE,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,GAAG,YAAY,CAiEtE,CAAC;AAEF,eAAe,MAAM,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAOjD,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAGvC,QAAA,MAAM,MAAM,EAAE,EAAE,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,GAAG,YAAY,CAkEtE,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/components/Button/index.js

@@ -17,7 +17,7 @@ var _Skeleton = _interopRequireDefault(require("../Skeleton"));
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-var _excluded = ["children", "leftIcon", "rightIcon", "isLoading", "variant", "bgColor", "size", "fullWidth", "textColor"];
+var _excluded = ["children", "leftIcon", "rightIcon", "isLoading", "variant", "bgColor", "size", "fullWidth", "textColor", "type"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -45,6 +45,8 @@ var Button = function Button(_ref) {
       fullWidth = _ref.fullWidth,
       _ref$textColor = _ref.textColor,
       textColor = _ref$textColor === void 0 ? '' : _ref$textColor,
+      _ref$type = _ref.type,
+      type = _ref$type === void 0 ? 'button' : _ref$type,
       props = _objectWithoutProperties(_ref, _excluded);
 
   var _useTheme = (0, _index.useTheme)(),

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

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Button/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAGxC,eAAO,MAAM,OAAO;;;qIAuInB,CAAC;AAEF,eAAO,MAAM,aAAa;;;yGAKzB,CAAC;AAEF,eAAO,MAAM,WAAW;;;yGAIvB,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Button/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAGxC,eAAO,MAAM,OAAO;;;qIAsInB,CAAC;AAEF,eAAO,MAAM,aAAa;;;yGAKzB,CAAC;AAEF,eAAO,MAAM,WAAW;;;yGAIvB,CAAC"}

package/dist/components/Button/styles.js

@@ -19,9 +19,9 @@ 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 Buttons = _styled.default.button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  font-family: Poppins;\n  font-style: normal;\n  font-weight: ", ";\n  font-size: ", ";\n  border-radius: 8px;\n  border: 0px;\n  cursor: pointer;\n  padding-inline: 24px;\n  --button-brightness: brightness(0.85);\n\n  transition: all 0.15s ease-in-out;\n\n  color: ", ";\n\n  background-color: ", ";\n\n  height: ", ";\n\n  width: ", ";\n\n  &:disabled {\n    filter: opacity(0.5);\n    cursor: default;\n  }\n\n  ", "\n\n  @media screen and (min-width: ", ") {\n    width: ", ";\n  }\n\n  @media screen and (min-width: ", ") {\n    width: ", ";\n  }\n\n  @media screen and (min-width: ", ") {\n    width: ", ";\n  }\n\n  @media screen and (min-width: ", ") {\n    width: ", ";\n  }\n"])), function (_ref) {
+var Buttons = _styled.default.button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  font-family: inherit;\n  font-weight: ", ";\n  font-size: ", ";\n  border-radius: 8px;\n  border: 0px;\n  cursor: pointer;\n  padding-inline: 24px;\n  --button-brightness: brightness(0.85);\n\n  transition: all 0.15s ease-in-out;\n\n  color: ", ";\n\n  background-color: ", ";\n\n  height: ", ";\n\n  width: ", ";\n\n  &:disabled {\n    filter: opacity(0.5);\n    cursor: default;\n  }\n\n  ", "\n\n  @media screen and (min-width: ", ") {\n    width: ", ";\n  }\n\n  @media screen and (min-width: ", ") {\n    width: ", ";\n  }\n\n  @media screen and (min-width: ", ") {\n    width: ", ";\n  }\n\n  @media screen and (min-width: ", ") {\n    width: ", ";\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
-  return theme.fontWeight.normal;
+  return theme.fontWeight[600];
 }, function (_ref2) {
   var theme = _ref2.theme;
   return theme.fontSizes.xs;

package/dist/components/DateInput/components/SelectButton.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.SelectButton = SelectButton;
 
-var _Icon = _interopRequireDefault(require("src/components/Icon"));
+var _Icon = _interopRequireDefault(require("../../Icon"));
 
-var _theme = require("src/shared/theme");
+var _theme = require("../../../shared/theme");
 
 var _styles = require("./styles");
 

package/dist/components/DateInput/index.js

@@ -7,11 +7,11 @@ exports.DateInput = void 0;
 
 var _react = require("react");
 
-var _useOnClickOutside = require("src/shared/hooks/useOnClickOutside");
+var _useOnClickOutside = require("../../shared/hooks/useOnClickOutside");
 
-var _theme = require("src/shared/theme");
+var _theme = require("../../shared/theme");
 
-var _getColorValue = require("src/utils/getColorValue");
+var _getColorValue = require("../../utils/getColorValue");
 
 var _DatePicker = _interopRequireDefault(require("../DatePicker"));
 

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

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Input/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAGlD,eAAO,MAAM,iBAAiB;;;;;yGAkI7B,CAAC;AAEF,eAAO,MAAM,WAAW;;;yGASvB,CAAC;AAEF,eAAO,MAAM,YAAY;;;;;yGAKxB,CAAC;AAEF,eAAO,MAAM,eAAe;;;yGAK3B,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;yGAarB,CAAC;AAEF,eAAO,MAAM,KAAK;;;+HA+BjB,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;kHAgBtB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;2HA+CpB,CAAC;AAEF,eAAO,MAAM,MAAM;;;+GAQlB,CAAC;AAEF,eAAO,MAAM,UAAU;;;2GAItB,CAAC;AAEF,eAAO,MAAM,UAAU;;;wHAUtB,CAAC;AAEF,eAAO,MAAM,YAAY;;;;;yGAyCxB,CAAC;AAEF,eAAO,MAAM,YAAY;;;2GAOxB,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Input/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAGlD,eAAO,MAAM,iBAAiB;;;;;yGAkI7B,CAAC;AAEF,eAAO,MAAM,WAAW;;;yGASvB,CAAC;AAEF,eAAO,MAAM,YAAY;;;;;yGAKxB,CAAC;AAEF,eAAO,MAAM,eAAe;;;yGAK3B,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;yGAarB,CAAC;AAEF,eAAO,MAAM,KAAK;;;+HA+BjB,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;kHAiBtB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;2HA+CpB,CAAC;AAEF,eAAO,MAAM,MAAM;;;+GAQlB,CAAC;AAEF,eAAO,MAAM,UAAU;;;2GAItB,CAAC;AAEF,eAAO,MAAM,UAAU;;;wHAUtB,CAAC;AAEF,eAAO,MAAM,YAAY;;;;;yGAyCxB,CAAC;AAEF,eAAO,MAAM,YAAY;;;2GAOxB,CAAC"}

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  max-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  }\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) {
   return props.theme.borderRadius.default;
 }, function (props) {
   return props.theme.fontWeight[400];
@@ -102,7 +102,7 @@ var InputGroupElement = _styled.default.div(_templateObject || (_templateObject
 
 exports.InputGroupElement = InputGroupElement;
 
-var InputColumn = _styled.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  position: relative;\n  display: grid;\n  grid-template-columns: repeat(12, 1fr);\n  align-items: center;\n  border-radius: ", ";\n\n  width: 100%;\n  min-height: 52px;\n"])), function (props) {
+var InputColumn = _styled.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  position: relative;\n  display: grid;\n  grid-template-columns: repeat(12, 1fr);\n  align-items: center;\n  border-radius: ", ";\n\n  width: 100%;\n  min-height: 56px;\n"])), function (props) {
   return props.theme.borderRadius.default;
 });
 
@@ -142,7 +142,7 @@ var Input = _styled.default.input(_templateObject7 || (_templateObject7 = _tagge
 
 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  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: transform 0.2s ease, background-color 0.1s cubic-bezier(0.075, 0.82, 0.165, 1);\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;

package/dist/components/Modal/index.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Modal = Modal;
 
-var _useDisableBodyScroll = require("src/shared/hooks/useDisableBodyScroll");
+var _useDisableBodyScroll = require("../../shared/hooks/useDisableBodyScroll");
 
 var _useKeyPress = require("../../shared/hooks/useKeyPress");
 

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { IStepsProps } from './types';
-declare const Steps: ({ current, steps, activeColor, fullWidth, isReducedSteps, }: IStepsProps) => JSX.Element;
+declare const Steps: ({ current, steps, activeColor, fullWidth, isReducedSteps, enableCurrentStepChecked, }: IStepsProps) => JSX.Element;
 export default Steps;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Steps/index.tsx"],"names":[],"mappings":";AAgBA,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAGtC,QAAA,MAAM,KAAK,gEAMR,WAAW,gBAkFb,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Steps/index.tsx"],"names":[],"mappings":";AAgBA,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAGtC,QAAA,MAAM,KAAK,0FAOR,WAAW,gBAgGb,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/dist/components/Steps/index.js

@@ -40,19 +40,14 @@ var Steps = function Steps(_ref) {
       activeColor = _ref$activeColor === void 0 ? 'primary' : _ref$activeColor,
       fullWidth = _ref.fullWidth,
       _ref$isReducedSteps = _ref.isReducedSteps,
-      isReducedSteps = _ref$isReducedSteps === void 0 ? false : _ref$isReducedSteps;
+      isReducedSteps = _ref$isReducedSteps === void 0 ? false : _ref$isReducedSteps,
+      enableCurrentStepChecked = _ref.enableCurrentStepChecked;
 
   var _useState = (0, _react.useState)(false),
       _useState2 = _slicedToArray(_useState, 2),
       isMobile = _useState2[0],
       setIsMobile = _useState2[1];
 
-  var checkWindowSize = function checkWindowSize() {
-    setIsMobile(window.innerWidth < 500);
-  };
-
-  window.addEventListener('resize', checkWindowSize);
-
   var getStepIconPosition = function getStepIconPosition(index) {
     if (index === 0 && index < steps.length - 1) {
       return _utils.STEP_POSITION.INITIAL_BEFORE_UNSELECTED;
@@ -75,6 +70,16 @@ var Steps = function Steps(_ref) {
     return index === steps.length - 1 || index === current - 1 && index < steps.length - 1;
   };
 
+  var checkWindowSize = function checkWindowSize() {
+    setIsMobile(window.innerWidth < 500);
+  };
+
+  (0, _react.useEffect)(function () {
+    window.addEventListener('resize', checkWindowSize);
+    return function () {
+      window.removeEventListener('resize', checkWindowSize);
+    };
+  }, []);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StepsContainer, {
     fullWidth: fullWidth,
     isReducedSteps: isReducedSteps,
@@ -105,19 +110,19 @@ var Steps = function Steps(_ref) {
         id: "simple-step-".concat(index + 1),
         tabIndex: index + 1 === current ? 0 : -1,
         isCurrent: current === index + 1,
-        isFinished: current > index + 1,
         children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.StepsItemsDetailsContainer, {
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StepsCircle, {
             activeColor: activeColor,
             isCurrent: current === index + 1,
-            isFinished: current > index + 1,
-            children: current > index + 1 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
+            isFinished: current > index + 1 || enableCurrentStepChecked && current === index + 1,
+            children: current > index + 1 || enableCurrentStepChecked && current === index + 1 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
               name: "check"
             }) : index + 1
           }), current === index + 1 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StepsItemText, {
+            isDisabled: enableCurrentStepChecked,
             children: step
           })]
-        }), current === index + 1 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StepsSeparator, {})]
+        }), current === index + 1 && current < steps.length && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StepsSeparator, {})]
       }, index);
     })
   });

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

@@ -23,7 +23,6 @@ export declare const StepsItemContainer: import("@emotion/styled").StyledCompone
     as?: import("react").ElementType<any> | undefined;
 } & {
     isCurrent: boolean;
-    isFinished: boolean;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const ReducedStepsContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
@@ -42,5 +41,6 @@ export declare const StepsItemText: import("@emotion/styled").StyledComponent<{
     as?: import("react").ElementType<any> | undefined;
 } & {
     isReducedSteps?: boolean | undefined;
+    isDisabled?: boolean | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {}>;
 //# sourceMappingURL=styles.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Steps/styles.ts"],"names":[],"mappings":";AAEA,eAAO,MAAM,cAAc;;;;;;yGAa1B,CAAC;AAEF,eAAO,MAAM,WAAW;;;;iBACT,SAAS,GAAG,WAAW,GAAG,UAAU;;;yGAiDlD,CAAC;AAEF,eAAO,MAAM,cAAc;;;yGAI1B,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;;eAClB,OAAO;gBACN,OAAO;yGAWpB,CAAC;AAEF,eAAO,MAAM,qBAAqB;;;yGAajC,CAAC;AAEF,eAAO,MAAM,2BAA2B;;;yGAIvC,CAAC;AAEF,eAAO,MAAM,0BAA0B;;;yGAItC,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;iHAWzB,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Steps/styles.ts"],"names":[],"mappings":";AAEA,eAAO,MAAM,cAAc;;;;;;yGAc1B,CAAC;AAEF,eAAO,MAAM,WAAW;;;;iBACT,SAAS,GAAG,WAAW,GAAG,UAAU;;;yGAiDlD,CAAC;AAEF,eAAO,MAAM,cAAc;;;yGAK1B,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;;eAClB,OAAO;yGAWnB,CAAC;AAEF,eAAO,MAAM,qBAAqB;;;yGAajC,CAAC;AAEF,eAAO,MAAM,2BAA2B;;;yGAIvC,CAAC;AAEF,eAAO,MAAM,0BAA0B;;;yGAItC,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;iHAmCzB,CAAC"}

package/dist/components/Steps/styles.js

@@ -13,15 +13,15 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 
-var StepsContainer = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  gap: ", ";\n\n  ", ";\n  width: 100%;\n  @media only screen and (max-width: 500px) {\n    flex-direction: ", ";\n  }\n"])), function (_ref) {
+var StepsContainer = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  gap: ", ";\n  flex-direction: ", ";\n\n  ", ";\n\n  @media only screen and (min-width: 500px) {\n    flex-direction: row;\n  }\n"])), function (_ref) {
   var isReducedSteps = _ref.isReducedSteps;
   return isReducedSteps ? '0' : '12px';
 }, function (_ref2) {
-  var fullWidth = _ref2.fullWidth;
-  return fullWidth ? "width: 100%;" : "width: 356px";
-}, function (_ref3) {
-  var isReducedSteps = _ref3.isReducedSteps;
+  var isReducedSteps = _ref2.isReducedSteps;
   return isReducedSteps ? 'column' : 'row';
+}, function (_ref3) {
+  var fullWidth = _ref3.fullWidth;
+  return fullWidth ? "width: 100%;" : "width: fit-content;";
 });
 
 exports.StepsContainer = StepsContainer;
@@ -39,7 +39,7 @@ var StepsCircle = _styled.default.div(_templateObject2 || (_templateObject2 = _t
 
 exports.StepsCircle = StepsCircle;
 
-var StepsSeparator = _styled.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  height: 2px;\n  width: 100%;\n  background-color: ", ";\n"])), function (_ref6) {
+var StepsSeparator = _styled.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  height: 2px;\n  width: 100%;\n  min-width: 40px;\n  background-color: ", ";\n"])), function (_ref6) {
   var theme = _ref6.theme;
   return theme.colors.neutral.neutral1;
 });
@@ -64,9 +64,21 @@ var StepsItemsDetailsContainer = _styled.default.div(_templateObject7 || (_templ
 
 exports.StepsItemsDetailsContainer = StepsItemsDetailsContainer;
 
-var StepsItemText = _styled.default.h3(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  font-family: inherit;\n  font-weight: 600;\n  font-size: 1.25rem;\n  color: ", ";\n  @media only screen and (max-width: 500px) {\n    ", ";\n  }\n"])), function (_ref7) {
-  var theme = _ref7.theme;
-  return theme.colorMode === 'light' ? theme.colors.neutral.black : theme.colors.neutral.white;
+var StepsItemText = _styled.default.h3(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  font-family: inherit;\n  font-weight: 600;\n  font-size: 1.25rem;\n  white-space: nowrap;\n\n  ", "\n\n  @media only screen and (max-width: 500px) {\n    ", ";\n    white-space: normal;\n  }\n"])), function (_ref7) {
+  var isDisabled = _ref7.isDisabled,
+      theme = _ref7.theme;
+
+  if (isDisabled) {
+    return "\n        color: ".concat({
+      light: theme.colors.tertiary.hover,
+      dark: theme.colors.neutral.neutral4
+    }[theme.colorMode], ";\n      ");
+  }
+
+  return "\n      color: ".concat({
+    light: theme.colors.neutral.black,
+    dark: theme.colors.neutral.white
+  }[theme.colorMode], ";\n    ");
 }, function (_ref8) {
   var isReducedSteps = _ref8.isReducedSteps;
   return isReducedSteps ? "width: 100%;" : "";

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

@@ -4,6 +4,7 @@ export declare type IStepsProps = {
     activeColor?: 'primary' | 'secondary' | 'tertiary';
     fullWidth?: boolean;
     isReducedSteps?: boolean;
+    enableCurrentStepChecked?: boolean;
 };
 export declare type IStepIcon = {
     isSelectedStep: boolean;

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Steps/types.ts"],"names":[],"mappings":"AAAA,oBAAY,WAAW,GAAG;IACxB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC;AAEF,oBAAY,SAAS,GAAG;IACtB,cAAc,EAAE,OAAO,CAAC;IACxB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,cAAc,EAAE,OAAO,CAAC;IACxB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;CACnD,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Steps/types.ts"],"names":[],"mappings":"AAAA,oBAAY,WAAW,GAAG;IACxB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,wBAAwB,CAAC,EAAE,OAAO,CAAC;CACpC,CAAC;AAEF,oBAAY,SAAS,GAAG;IACtB,cAAc,EAAE,OAAO,CAAC;IACxB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,cAAc,EAAE,OAAO,CAAC;IACxB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;CACnD,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pedidopago/ui",
-  "version": "1.2.1",
+  "version": "1.2.4",
   "description": "Quick build beatiful Pedido Pago apps",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",