@hipay/hipay-material-ui 3.13.1 → 3.13.3

package/HiIconButton/HiIconButton.js

@@ -74,7 +74,7 @@ var HiIconButton = _react.default.forwardRef(function (props, ref) {
 });
 
 HiIconButton.defaultProps = {
-  color: 'default'
+  color: 'neutral'
 };
 var _default = HiIconButton;
 exports.default = _default;

package/HiScrollStepper/HiScrollStepper.js

@@ -94,6 +94,11 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
       stepLabelVisible = _useState2[0],
       setStepLabelVisible = _useState2[1];
 
+  var _useState3 = (0, _react.useState)(document.body.scrollHeight > document.body.clientHeight),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      pageHasScroll = _useState4[0],
+      setPageHasScroll = _useState4[1];
+
   var instantActiveStep = 0;
   var stepsRef = (0, _react.useMemo)(function () {
     return Array(steps.length).fill(0).map(function () {
@@ -121,7 +126,7 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
 
   var handleScroll = function handleScroll() {
     var newActiveStep = 0;
-    var scrollOffset = window.pageYOffset;
+    var scrollOffset = window.pageYOffset + 1;
 
     if (scrollOffset < stepMargin) {
       newActiveStep = 0;
@@ -166,12 +171,18 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
     setStepLabelVisible(newVisibility);
   };
 
+  var handleResize = function handleResize() {
+    setPageHasScroll(document.body.scrollHeight > document.body.clientHeight);
+  };
+
   (0, _reactUse.useMount)(function () {
     window.addEventListener('scroll', handleScroll);
+    window.addEventListener('resize', handleResize);
   });
   (0, _react.useEffect)(function () {
     return function () {
       window.removeEventListener('scroll', handleScroll);
+      window.removeEventListener('resize', handleResize);
     };
   }, []);
   return /*#__PURE__*/_react.default.createElement("div", {
@@ -191,7 +202,8 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
       },
       indicator: step.indicator,
       label: stepLabelVisible ? step.label : null,
-      status: status[index]
+      status: pageHasScroll ? status[index] : null,
+      disabled: !pageHasScroll
     });
   }))), stepLabelVisibilityToggle && /*#__PURE__*/_react.default.createElement(_HiIconButton.default, {
     className: (0, _classnames.default)(classes.hideLabelToggle, customClasses.hideLabelToggle),

package/es/HiIconButton/HiIconButton.js

@@ -74,7 +74,7 @@ var HiIconButton = _react.default.forwardRef(function (props, ref) {
 });
 
 HiIconButton.defaultProps = {
-  color: 'default'
+  color: 'neutral'
 };
 var _default = HiIconButton;
 exports.default = _default;

package/es/HiScrollStepper/HiScrollStepper.js

@@ -94,6 +94,11 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
       stepLabelVisible = _useState2[0],
       setStepLabelVisible = _useState2[1];
 
+  var _useState3 = (0, _react.useState)(document.body.scrollHeight > document.body.clientHeight),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      pageHasScroll = _useState4[0],
+      setPageHasScroll = _useState4[1];
+
   var instantActiveStep = 0;
   var stepsRef = (0, _react.useMemo)(function () {
     return Array(steps.length).fill(0).map(function () {
@@ -121,7 +126,7 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
 
   var handleScroll = function handleScroll() {
     var newActiveStep = 0;
-    var scrollOffset = window.pageYOffset;
+    var scrollOffset = window.pageYOffset + 1;
 
     if (scrollOffset < stepMargin) {
       newActiveStep = 0;
@@ -166,12 +171,18 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
     setStepLabelVisible(newVisibility);
   };
 
+  var handleResize = function handleResize() {
+    setPageHasScroll(document.body.scrollHeight > document.body.clientHeight);
+  };
+
   (0, _reactUse.useMount)(function () {
     window.addEventListener('scroll', handleScroll);
+    window.addEventListener('resize', handleResize);
   });
   (0, _react.useEffect)(function () {
     return function () {
       window.removeEventListener('scroll', handleScroll);
+      window.removeEventListener('resize', handleResize);
     };
   }, []);
   return /*#__PURE__*/_react.default.createElement("div", {
@@ -191,7 +202,8 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
       },
       indicator: step.indicator,
       label: stepLabelVisible ? step.label : null,
-      status: status[index]
+      status: pageHasScroll ? status[index] : null,
+      disabled: !pageHasScroll
     });
   }))), stepLabelVisibilityToggle && /*#__PURE__*/_react.default.createElement(_HiIconButton.default, {
     className: (0, _classnames.default)(classes.hideLabelToggle, customClasses.hideLabelToggle),

package/package.json

@@ -1,7 +1,6 @@
 {
   "name": "@hipay/hipay-material-ui",
-  "private": false,
-  "version": "3.13.1",
+  "version": "3.13.3",
   "description": "React components that implement Google's Material Design.",
   "repository": {
     "type": "git",
@@ -13,11 +12,11 @@
   },
   "homepage": "http://materialui.hipay.dev.local/",
   "peerDependencies": {
-    "@hipay/design-system": "^1.0.1",
-    "@mui/material": "5.5.3",
-    "@mui/styles": "5.5.3",
-    "@mui/styled-engine": "npm:@mui/styled-engine-sc@5.4.2",
-    "@mui/styled-engine-sc": "5.4.2",
+    "@hipay/design-system": "^1.0.2",
+    "@mui/material": "5.8.4",
+    "@mui/styles": "5.8.4",
+    "@mui/styled-engine": "npm:@mui/styled-engine-sc@5.8.0",
+    "@mui/styled-engine-sc": "5.8.0",
     "mdi-material-ui": "7.1.0",
     "moment-timezone": "0.5.27",
     "react": "17.0.2",
@@ -27,7 +26,7 @@
   "dependencies": {
     "@babel/plugin-transform-runtime": "^7.8.3",
     "@babel/runtime": "7.6.3",
-    "@mui/lab": "^5.0.0-alpha.64",
+    "@mui/lab": "5.0.0-alpha.89",
     "@mui/icons-material": "^5.2.5",
     "brcast": "3.0.1",
     "classnames": "2.2.6",
@@ -74,8 +73,8 @@
     "node": ">=6.0.0"
   },
   "resolutions": {
-    "@mui/styled-engine": "npm:@mui/styled-engine-sc@5.4.2"
+    "@mui/styled-engine": "npm:@mui/styled-engine-sc@5.8.0"
   },
   "main": "./index.js",
   "module": "./esm/index.js"
-}
+}