@dxc-technology/halstack-react 0.0.0-a9c6846 → 0.0.0-aa1e975

package/dist/alert/Alert.js

@@ -100,7 +100,7 @@ function _templateObject4() {
 }
 
 function _templateObject3() {
-  var data = (0, _taggedTemplateLiteral2["default"])(["\n  margin: ", ";\n  margin-top: ", ";\n  margin-right: ", ";\n  margin-bottom: ", ";\n  margin-left: ", ";\n  display: ", ";\n  overflow: hidden;\n\n  background-color: ", ";\n\n  border-radius: ", ";\n  border-width: ", ";\n  border-style: ", ";\n  border-color: ", ";\n\n  padding-left: 12px;\n  padding-right: 12px;\n  justify-content: ", ";\n  align-items: ", ";\n  max-width: ", ";\n  width: ", ";\n  z-index: ", ";\n"]);
+  var data = (0, _taggedTemplateLiteral2["default"])(["\n  margin: ", ";\n  margin-top: ", ";\n  margin-right: ", ";\n  margin-bottom: ", ";\n  margin-left: ", ";\n  display: ", ";\n  overflow: hidden;\n  box-sizing: border-box;\n\n  background-color: ", ";\n\n  border-radius: ", ";\n  border-width: ", ";\n  border-style: ", ";\n  border-color: ", ";\n\n  padding-left: 12px;\n  padding-right: 12px;\n  justify-content: ", ";\n  align-items: ", ";\n  max-width: ", ";\n  width: ", ";\n  z-index: ", ";\n"]);
 
   _templateObject3 = function _templateObject3() {
     return data;
@@ -295,7 +295,7 @@ var AlertContainer = _styledComponents["default"].div(_templateObject3(), functi
 }, function (props) {
   return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
 }, function (props) {
-  return props.children && "inline-block" || "inline-flex";
+  return props.size === "fitContent" ? "inline-block" : "block";
 }, function (props) {
   return props.type === "info" && props.theme.infoBackgroundColor || props.type === "confirm" && props.theme.successBackgroundColor || props.type === "warning" && props.theme.warningBackgroundColor || props.type === "error" && props.theme.errorBackgroundColor;
 }, function (props) {
@@ -311,9 +311,9 @@ var AlertContainer = _styledComponents["default"].div(_templateObject3(), functi
 }, function (props) {
   return props.mode === "modal" ? "center" : "";
 }, function (props) {
-  return props.size === "fitContent" ? calculateWidth(props.margin, "fillParent") : calculateWidth(props.margin, props.size);
+  return props.size !== "fillParent" && calculateWidth(props.margin, "fillParent");
 }, function (props) {
-  return calculateWidth(props.margin, props.size);
+  return props.size !== "fillParent" && calculateWidth(props.margin, props.size);
 }, function (props) {
   return props.mode === "modal" ? "1300" : "";
 });

package/dist/common/variables.js

@@ -123,7 +123,7 @@ var globalTokens = {
   type_leading_compact_02: "1.25em",
   type_leading_compact_01: "1.365em",
   type_leading_normal: "1.5em",
-  type_leading_loose_01: "1.75em",
+  type_leading_loose_01: "1.715em",
   type_leading_loose_02: "2em",
   fontSize10: "10px",
   // Spacing
@@ -144,11 +144,14 @@ var globalTokens = {
   spacing_14: "7rem",
   // Border
   border_width_0: "0px",
-  border_width_01: "1px",
-  border_width_02: "2px",
-  border_radius_01: "2px",
-  border_radius_02: "4px",
-  border_radius_03: "6px",
+  border_width_1: "1px",
+  border_width_2: "2px",
+  border_width_4: "4px",
+  border_radius_none: "0rem",
+  border_radius_small: "0.125rem",
+  border_radius_medium: "0.25rem",
+  border_radius_large: "0.375rem",
+  border_radius_full: "9999px",
   border_solid: "solid",
   border_dashed: "dashed",
   border_none: "none",
@@ -291,7 +294,7 @@ var componentTokens = {
     primaryDisabledFontColorOnDark: globalTokens.hal_grey_l_60,
     primaryBorderThickness: globalTokens.border_width_0,
     primaryBorderStyle: globalTokens.border_none,
-    primaryBorderRadius: globalTokens.border_radius_02,
+    primaryBorderRadius: globalTokens.border_radius_medium,
     primaryFontFamily: globalTokens.type_sans,
     primaryFontSize: globalTokens.type_scale_03,
     primaryFontWeight: globalTokens.type_regular,
@@ -313,9 +316,9 @@ var componentTokens = {
     secondaryDisabledFontColorOnDark: globalTokens.hal_grey_l_60,
     secondaryDisabledBorderColor: globalTokens.hal_grey_l_60,
     secondaryDisabledBorderColorOnDark: globalTokens.hal_grey_l_60,
-    secondaryBorderThickness: globalTokens.border_width_01,
+    secondaryBorderThickness: globalTokens.border_width_1,
     secondaryBorderStyle: globalTokens.border_solid,
-    secondaryBorderRadius: globalTokens.border_radius_02,
+    secondaryBorderRadius: globalTokens.border_radius_medium,
     secondaryFontFamily: globalTokens.type_sans,
     secondaryFontSize: globalTokens.type_scale_03,
     secondaryFontWeight: globalTokens.type_regular,
@@ -333,7 +336,7 @@ var componentTokens = {
     textDisabledFontColorOnDark: globalTokens.hal_grey_l_60,
     textBorderThickness: globalTokens.border_width_0,
     textBorderStyle: globalTokens.border_none,
-    textBorderRadius: globalTokens.border_radius_02,
+    textBorderRadius: globalTokens.border_radius_medium,
     textFontFamily: globalTokens.type_sans,
     textFontSize: globalTokens.type_scale_03,
     textFontWeight: globalTokens.type_regular
@@ -532,12 +535,12 @@ var componentTokens = {
     errorMessageFontSize: globalTokens.type_scale_01,
     errorMessageFontWeight: globalTokens.type_regular,
     errorMessageLineHeight: globalTokens.type_scale_05,
-    dropBorderThickness: globalTokens.border_width_01,
+    dropBorderThickness: globalTokens.border_width_1,
     dropBorderStyle: globalTokens.border_dashed,
-    dropBorderRadius: globalTokens.border_radius_03,
-    fileItemBorderThickness: globalTokens.border_width_01,
+    dropBorderRadius: globalTokens.border_radius_large,
+    fileItemBorderThickness: globalTokens.border_width_1,
     fileItemBorderStyle: globalTokens.border_solid,
-    fileItemBorderRadius: globalTokens.border_radius_02
+    fileItemBorderRadius: globalTokens.border_radius_medium
   },
   footer: {
     height: "124px",
@@ -920,6 +923,90 @@ var componentTokens = {
     focusColor: globalTokens.hal_blue_l_50,
     focusColorOnDark: globalTokens.hal_blue_l_50
   },
+  newSelect: {
+    fontFamily: globalTokens.type_sans,
+    enabledBorderColor: globalTokens.hal_black,
+    enabledBorderColorOnDark: globalTokens.hal_white,
+    hoverBorderColor: globalTokens.hal_purple_l_65,
+    hoverBorderColorOnDark: globalTokens.hal_purple_l_65,
+    focusBorderColor: globalTokens.hal_blue_l_50,
+    focusBorderColorOnDark: globalTokens.hal_blue_l_50,
+    disabledBorderColor: globalTokens.hal_grey_l_60,
+    disabledBorderColorOnDark: globalTokens.hal_grey_l_60,
+    disabledContainerFillColor: globalTokens.hal_grey_l_95,
+    disabledContainerFillColorOnDark: globalTokens.hal_grey_s_40,
+    errorBorderColor: globalTokens.hal_red_s_41,
+    errorBorderColorOnDark: globalTokens.hal_red_l_60,
+    hoverErrorBorderColor: "#fe0123",
+    hoverErrorBorderColorOnDark: "#fe677b",
+    errorMessageColor: globalTokens.hal_red_s_41,
+    errorMessageColorOnDark: globalTokens.hal_red_l_60,
+    errorIconColor: globalTokens.hal_red_s_41,
+    errorIconColorOnDark: globalTokens.hal_red_l_60,
+    labelFontColor: globalTokens.hal_black,
+    labelFontColorOnDark: globalTokens.hal_white,
+    labelFontSize: globalTokens.type_scale_02,
+    labelFontStyle: globalTokens.type_normal,
+    labelFontWeight: globalTokens.type_semibold,
+    disabledLabelFontColor: globalTokens.hal_grey_l_60,
+    disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
+    optionalLabelFontWeight: globalTokens.type_regular,
+    helperTextFontColor: globalTokens.hal_black,
+    helperTextFontColorOnDark: globalTokens.hal_white,
+    helperTextFontSize: globalTokens.type_scale_01,
+    helperTextFontStyle: globalTokens.type_normal,
+    helperTextFontWeight: globalTokens.type_regular,
+    disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
+    disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
+    placeholderFontColor: "#808080",
+    placeholderFontColorOnDark: globalTokens.hal_grey_l_95,
+    disabledPlaceholderFontColor: globalTokens.hal_grey_l_60,
+    disabledPlaceholderFontColorOnDark: globalTokens.hal_grey_l_60,
+    valueFontColor: globalTokens.hal_black,
+    valueFontColorOnDark: globalTokens.hal_white,
+    valueFontSize: globalTokens.type_scale_03,
+    valueFontStyle: globalTokens.type_normal,
+    valueFontWeight: globalTokens.type_regular,
+    disabledValueFontColor: globalTokens.hal_grey_l_60,
+    disabledValueFontColorOnDark: globalTokens.hal_grey_l_60,
+    actionIconColor: globalTokens.hal_black,
+    actionIconColorOnDark: globalTokens.hal_white,
+    disabledActionIconColor: globalTokens.hal_grey_l_60,
+    disabledActionIconColorOnDark: globalTokens.hal_grey_l_60,
+    hoverActionIconColor: globalTokens.hal_black,
+    hoverActionIconColorOnDark: globalTokens.hal_white,
+    focusActionIconColor: globalTokens.hal_black,
+    focusActionIconColorOnDark: globalTokens.hal_white,
+    activeActionIconColor: globalTokens.hal_black,
+    activeActionIconColorOnDark: globalTokens.hal_black,
+    actionBackgroundColor: globalTokens.transparent,
+    actionBackgroundColorOnDark: globalTokens.transparent,
+    disabledActionBackgroundColor: globalTokens.transparent,
+    disabledActionBackgroundColorOnDark: globalTokens.transparent,
+    hoverActionBackgroundColor: globalTokens.hal_grey_l_95,
+    hoverActionBackgroundColorOnDark: globalTokens.hal_grey_s_40,
+    focusActionBorderColor: globalTokens.hal_blue_l_50,
+    focusActionBorderColorOnDark: globalTokens.hal_blue_l_50,
+    activeActionBackgroundColor: globalTokens.hal_grey_l_80,
+    activeActionBackgroundColorOnDark: globalTokens.hal_grey_l_60,
+    listOptionFontColor: globalTokens.hal_black,
+    listOptionFontSize: globalTokens.type_scale_02,
+    listOptionFontStyle: globalTokens.type_normal,
+    listOptionFontWeight: globalTokens.type_regular,
+    systemMessageFontColor: globalTokens.hal_grey_s_40,
+    errorMessageBorderColor: globalTokens.hal_red_s_41,
+    errorMessageBackgroundColor: globalTokens.hal_red_l_95,
+    hoverListOptionBackgroundColor: globalTokens.hal_grey_l_95,
+    activeListOptionBackgroundColor: globalTokens.hal_grey_l_90,
+    // NUEVO
+    arrowColor: globalTokens.hal_black,
+    arrowColorOnDark: globalTokens.hal_white,
+    disabledArrowColor: globalTokens.hal_grey_l_60,
+    disabledArrowColorOnDark: globalTokens.hal_grey_l_60,
+    enabledListBorderColor: globalTokens.hal_grey_l_80,
+    listOptionBorderBottomColor: globalTokens.hal_grey_l_90,
+    selectedListOptionBackgroundColor: globalTokens.hal_grey_l_90
+  },
   sidenav: {
     backgroundColor: globalTokens.hal_grey_l_95,
     arrowContainerColor: globalTokens.hal_grey_l_90,
@@ -959,13 +1046,28 @@ var componentTokens = {
     fontSize: globalTokens.type_scale_03,
     fontStyle: globalTokens.type_normal,
     fontWeight: globalTokens.type_regular,
+    labelFontFamily: globalTokens.type_sans,
+    labelFontSize: globalTokens.type_scale_02,
+    labelFontStyle: globalTokens.type_normal,
+    labelFontWeight: globalTokens.type_semibold,
+    labelLineHeight: globalTokens.type_leading_loose_01,
+    helperTextFontFamily: globalTokens.type_sans,
+    helperTextFontSize: globalTokens.type_scale_01,
+    helperTextFontStyle: globalTokens.type_normal,
+    helperTextFontWeight: globalTokens.type_regular,
+    helperTextLineHeight: globalTokens.type_leading_normal,
     fontColor: globalTokens.hal_black,
     fontColorOnDark: globalTokens.hal_white,
+    labelFontColor: globalTokens.hal_black,
+    helperTextFontColor: globalTokens.hal_black,
     disabledFontColor: globalTokens.hal_grey_l_60,
     fontLetterSpacing: globalTokens.type_spacing_normal,
     thumbHeight: "12px",
     thumbWidth: "12px",
+    hoverThumbHeight: "14px",
+    hoverThumbWidth: "14px",
     thumbVerticalPosition: "12px",
+    hoverThumbVerticalPosition: "11px",
     thumbBackgroundColor: globalTokens.hal_blue_s_35,
     thumbBackgroundColorOnDark: globalTokens.hal_blue_l_50,
     hoverThumbScale: "1.166666",
@@ -1000,7 +1102,10 @@ var componentTokens = {
     disabledTotalLineColor: globalTokens.hal_grey_l_95,
     disabledTotalLineColorOnDark: globalTokens.hal_grey_s_40,
     focusColor: globalTokens.hal_blue_l_50,
-    focusColorOnDark: globalTokens.hal_blue_l_50
+    focusColorOnDark: globalTokens.hal_blue_l_50,
+    floorLabelMarginRight: globalTokens.type_scale_03,
+    ceilLabelMarginLeft: globalTokens.type_scale_03,
+    inputMarginLeft: globalTokens.type_scale_06
   },
   spinner: {
     trackCircleColor: "#5f249f",

package/dist/file-input/FileInput.js

@@ -219,8 +219,11 @@ var DxcFileInput = function DxcFileInput(_ref) {
       files = _useState4[0],
       setFiles = _useState4[1];
 
+  var _useState5 = (0, _react.useState)("file-input-".concat((0, _uuid.v4)())),
+      _useState6 = (0, _slicedToArray2["default"])(_useState5, 1),
+      fileInputId = _useState6[0];
+
   var colorsTheme = (0, _useTheme["default"])();
-  var fileInputId = "file-input-".concat((0, _uuid.v4)());
   (0, _react.useEffect)(function () {
     if (value) {
       setFiles(value);

package/dist/main.d.ts

@@ -1,4 +1,5 @@
 export { default as DxcAlert } from "./alert/index";
+export { default as DxcNewSelect } from "./new-select/index";
 export { default as DxcNewInputText } from "./new-input-text/index";
 export { default as DxcNewDate } from "./new-date/index";
 export { default as DxcNewTextarea } from "./new-textarea/index";

package/dist/main.js

@@ -247,6 +247,12 @@ Object.defineProperty(exports, "DxcNewTextarea", {
     return _NewTextarea["default"];
   }
 });
+Object.defineProperty(exports, "DxcNewSelect", {
+  enumerable: true,
+  get: function get() {
+    return _NewSelect["default"];
+  }
+});
 Object.defineProperty(exports, "DxcFileInput", {
   enumerable: true,
   get: function get() {
@@ -352,6 +358,8 @@ var _Number = _interopRequireDefault(require("./number/Number"));
 
 var _NewTextarea = _interopRequireDefault(require("./new-textarea/NewTextarea"));
 
+var _NewSelect = _interopRequireDefault(require("./new-select/NewSelect"));
+
 var _FileInput = _interopRequireDefault(require("./file-input/FileInput"));
 
 var _ThemeContext = _interopRequireWildcard(require("./ThemeContext.js"));

package/dist/new-input-text/NewInputText.js

@@ -318,27 +318,15 @@ var DxcNewInputText = _react["default"].forwardRef(function (_ref, ref) {
       visualFocusedSuggIndex = _useState16[0],
       changeVisualFocusedSuggIndex = _useState16[1];
 
-  var _useState17 = (0, _react.useState)(null),
-      _useState18 = (0, _slicedToArray2["default"])(_useState17, 2),
-      minNumber = _useState18[0],
-      setMinNumber = _useState18[1];
-
-  var _useState19 = (0, _react.useState)(null),
-      _useState20 = (0, _slicedToArray2["default"])(_useState19, 2),
-      maxNumber = _useState20[0],
-      setMaxNumber = _useState20[1];
-
-  var _useState21 = (0, _react.useState)(null),
-      _useState22 = (0, _slicedToArray2["default"])(_useState21, 2),
-      stepNumber = _useState22[0],
-      setStepNumber = _useState22[1];
+  var _useState17 = (0, _react.useState)("input-".concat((0, _uuid.v4)())),
+      _useState18 = (0, _slicedToArray2["default"])(_useState17, 1),
+      inputId = _useState18[0];
 
   var suggestionsRef = (0, _react.useRef)(null);
   var inputRef = (0, _react.useRef)(null);
   var actionRef = (0, _react.useRef)(null);
   var colorsTheme = (0, _useTheme["default"])();
   var backgroundType = (0, _react.useContext)(_BackgroundColorContext["default"]);
-  var inputId = "input-".concat((0, _uuid.v4)());
   var autosuggestId = "".concat(inputId, "-listBox");
   var errorId = "error-message-".concat(inputId);
   var numberContext = (0, _react.useContext)(_NumberContext["default"]);
@@ -352,7 +340,7 @@ var DxcNewInputText = _react["default"].forwardRef(function (_ref, ref) {
   };
 
   var isNumberIncorrect = function isNumberIncorrect(value) {
-    return minNumber && parseInt(value) < minNumber || maxNumber && parseInt(value) > maxNumber;
+    return (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber) && parseInt(value) < (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber) || (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber) && parseInt(value) > (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber);
   };
 
   var isTextInputType = function isTextInputType() {
@@ -362,7 +350,7 @@ var DxcNewInputText = _react["default"].forwardRef(function (_ref, ref) {
   };
 
   var getNumberErrorMessage = function getNumberErrorMessage(value) {
-    if (minNumber && parseInt(value) < minNumber) return "Value must be greater than or equal to ".concat(minNumber, ".");else if (maxNumber && parseInt(value) > maxNumber) return "Value must be less than or equal to ".concat(maxNumber, ".");
+    if (numberContext !== null && numberContext !== void 0 && numberContext.minNumber && parseInt(value) < (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber)) return "Value must be greater than or equal to ".concat(numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber, ".");else if (numberContext !== null && numberContext !== void 0 && numberContext.maxNumber && parseInt(value) > (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber)) return "Value must be less than or equal to ".concat(numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber, ".");
   };
 
   var hasInputSuggestions = function hasInputSuggestions() {
@@ -508,9 +496,6 @@ var DxcNewInputText = _react["default"].forwardRef(function (_ref, ref) {
     min && (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current4 = inputRef.current) === null || _inputRef$current4 === void 0 ? void 0 : _inputRef$current4.setAttribute("min", min));
     max && (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current5 = inputRef.current) === null || _inputRef$current5 === void 0 ? void 0 : _inputRef$current5.setAttribute("max", max));
     step && (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current6 = inputRef.current) === null || _inputRef$current6 === void 0 ? void 0 : _inputRef$current6.setAttribute("step", step));
-    setMinNumber(min);
-    setMaxNumber(max);
-    setStepNumber(step);
   };
 
   (0, _react.useLayoutEffect)(function () {
@@ -580,18 +565,18 @@ var DxcNewInputText = _react["default"].forwardRef(function (_ref, ref) {
   }));
 
   var decrementNumber = function decrementNumber() {
-    var numberValue = value || innerValue;
+    var numberValue = value !== null && value !== void 0 ? value : innerValue;
 
-    if (minNumber && parseInt(numberValue) < minNumber) {
+    if (numberContext !== null && numberContext !== void 0 && numberContext.minNumber && parseInt(numberValue) < (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber)) {
       changeValue(parseInt(numberValue));
-    } else if (maxNumber && parseInt(numberValue) > maxNumber) {
-      changeValue(maxNumber);
-    } else if (minNumber && (parseInt(numberValue) === minNumber || numberValue === "" || stepNumber && parseInt(numberValue) - stepNumber < minNumber)) {
-      changeValue(minNumber);
-    } else if (stepNumber && minNumber && parseInt(numberValue) - stepNumber >= minNumber || stepNumber && numberValue !== "") {
-      changeValue(parseInt(numberValue) - stepNumber);
-    } else if (stepNumber && numberValue == "") {
-      changeValue(-stepNumber);
+    } else if (numberContext !== null && numberContext !== void 0 && numberContext.maxNumber && parseInt(numberValue) > (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber)) {
+      changeValue(numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber);
+    } else if (numberContext !== null && numberContext !== void 0 && numberContext.minNumber && (parseInt(numberValue) === (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber) || numberValue === "" || numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && parseInt(numberValue) - (numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber) < (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber))) {
+      changeValue(numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber);
+    } else if (numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && numberContext !== null && numberContext !== void 0 && numberContext.minNumber && parseInt(numberValue) - (numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber) >= (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber) || numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && numberValue !== "") {
+      changeValue(parseInt(numberValue) - (numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber));
+    } else if (numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && numberValue == "") {
+      changeValue(-(numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber));
     } else if (numberValue === "") {
       changeValue(-1);
     } else {
@@ -600,18 +585,18 @@ var DxcNewInputText = _react["default"].forwardRef(function (_ref, ref) {
   };
 
   var incrementNumber = function incrementNumber() {
-    var numberValue = value || innerValue;
+    var numberValue = value !== null && value !== void 0 ? value : innerValue;
 
-    if (maxNumber && parseInt(numberValue) > maxNumber) {
+    if (numberContext !== null && numberContext !== void 0 && numberContext.maxNumber && parseInt(numberValue) > (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber)) {
       changeValue(parseInt(numberValue));
-    } else if (minNumber && (parseInt(numberValue) < minNumber || numberValue === "")) {
-      changeValue(minNumber);
-    } else if (maxNumber && (parseInt(numberValue) === maxNumber || stepNumber && parseInt(numberValue) + stepNumber > maxNumber)) {
-      changeValue(maxNumber);
-    } else if (stepNumber && maxNumber && parseInt(numberValue) + stepNumber <= maxNumber || stepNumber && numberValue !== "") {
-      changeValue(parseInt(numberValue) + stepNumber);
-    } else if (stepNumber && numberValue == "") {
-      changeValue(stepNumber);
+    } else if (numberContext !== null && numberContext !== void 0 && numberContext.minNumber && (parseInt(numberValue) < (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber) || numberValue === "")) {
+      changeValue(numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber);
+    } else if (numberContext !== null && numberContext !== void 0 && numberContext.maxNumber && (parseInt(numberValue) === (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber) || numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && parseInt(numberValue) + (numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber) > (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber))) {
+      changeValue(numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber);
+    } else if (numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && numberContext !== null && numberContext !== void 0 && numberContext.maxNumber && parseInt(numberValue) + (numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber) <= (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber) || numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && numberValue !== "") {
+      changeValue(parseInt(numberValue) + (numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber));
+    } else if (numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && numberValue == "") {
+      changeValue(numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber);
     } else if (numberValue === "") {
       changeValue(1);
     } else {