@hipay/hipay-material-ui 3.13.3 → 3.13.4

Sign up to get free protection for your applications and to get access to all the features.
Files changed (3) hide show
  1. package/HiScrollStepper/HiScrollStepper.js +15 -7
  2. package/es/HiScrollStepper/HiScrollStepper.js +15 -7
  3. package/package.json +6 -5
package/HiScrollStepper/HiScrollStepper.js CHANGED
@@ -74,7 +74,9 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
74
74
  _ref$customClasses = _ref.customClasses,
75
75
  customClasses = _ref$customClasses === void 0 ? {} : _ref$customClasses,
76
76
  _ref$stepMargin = _ref.stepMargin,
77
- stepMargin = _ref$stepMargin === void 0 ? 60 : _ref$stepMargin;
77
+ stepMargin = _ref$stepMargin === void 0 ? 60 : _ref$stepMargin,
78
+ _ref$minScrollHeightT = _ref.minScrollHeightToEnable,
79
+ minScrollHeightToEnable = _ref$minScrollHeightT === void 0 ? 0 : _ref$minScrollHeightT;
78
80
  var classes = useStyles();
79
81
 
80
82
  var _useMap = (0, _reactUse.useMap)({
@@ -94,10 +96,10 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
94
96
  stepLabelVisible = _useState2[0],
95
97
  setStepLabelVisible = _useState2[1];
96
98
 
97
- var _useState3 = (0, _react.useState)(document.body.scrollHeight > document.body.clientHeight),
99
+ var _useState3 = (0, _react.useState)(document.body.scrollHeight - minScrollHeightToEnable >= document.body.clientHeight),
98
100
  _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
99
- pageHasScroll = _useState4[0],
100
- setPageHasScroll = _useState4[1];
101
+ stepperEnabled = _useState4[0],
102
+ setStepperEnabled = _useState4[1];
101
103
 
102
104
  var instantActiveStep = 0;
103
105
  var stepsRef = (0, _react.useMemo)(function () {
@@ -172,7 +174,7 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
172
174
  };
173
175
 
174
176
  var handleResize = function handleResize() {
175
- setPageHasScroll(document.body.scrollHeight > document.body.clientHeight);
177
+ setStepperEnabled(document.body.scrollHeight - minScrollHeightToEnable >= document.body.clientHeight);
176
178
  };
177
179
 
178
180
  (0, _reactUse.useMount)(function () {
@@ -185,6 +187,12 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
185
187
  window.removeEventListener('resize', handleResize);
186
188
  };
187
189
  }, []);
190
+ (0, _react.useEffect)(function () {
191
+ handleResize();
192
+ }, [document.body.scrollHeight]);
193
+ (0, _react.useEffect)(function () {
194
+ handleScroll();
195
+ }, [stepperEnabled]);
188
196
  return /*#__PURE__*/_react.default.createElement("div", {
189
197
  className: (0, _classnames.default)(classes.root, customClasses.root)
190
198
  }, /*#__PURE__*/_react.default.createElement("div", {
@@ -202,8 +210,8 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
202
210
  },
203
211
  indicator: step.indicator,
204
212
  label: stepLabelVisible ? step.label : null,
205
- status: pageHasScroll ? status[index] : null,
206
- disabled: !pageHasScroll
213
+ status: stepperEnabled ? status[index] : null,
214
+ disabled: !stepperEnabled
207
215
  });
208
216
  }))), stepLabelVisibilityToggle && /*#__PURE__*/_react.default.createElement(_HiIconButton.default, {
209
217
  className: (0, _classnames.default)(classes.hideLabelToggle, customClasses.hideLabelToggle),
package/es/HiScrollStepper/HiScrollStepper.js CHANGED
@@ -74,7 +74,9 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
74
74
  _ref$customClasses = _ref.customClasses,
75
75
  customClasses = _ref$customClasses === void 0 ? {} : _ref$customClasses,
76
76
  _ref$stepMargin = _ref.stepMargin,
77
- stepMargin = _ref$stepMargin === void 0 ? 60 : _ref$stepMargin;
77
+ stepMargin = _ref$stepMargin === void 0 ? 60 : _ref$stepMargin,
78
+ _ref$minScrollHeightT = _ref.minScrollHeightToEnable,
79
+ minScrollHeightToEnable = _ref$minScrollHeightT === void 0 ? 0 : _ref$minScrollHeightT;
78
80
  var classes = useStyles();
79
81
 
80
82
  var _useMap = (0, _reactUse.useMap)({
@@ -94,10 +96,10 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
94
96
  stepLabelVisible = _useState2[0],
95
97
  setStepLabelVisible = _useState2[1];
96
98
 
97
- var _useState3 = (0, _react.useState)(document.body.scrollHeight > document.body.clientHeight),
99
+ var _useState3 = (0, _react.useState)(document.body.scrollHeight - minScrollHeightToEnable >= document.body.clientHeight),
98
100
  _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
99
- pageHasScroll = _useState4[0],
100
- setPageHasScroll = _useState4[1];
101
+ stepperEnabled = _useState4[0],
102
+ setStepperEnabled = _useState4[1];
101
103
 
102
104
  var instantActiveStep = 0;
103
105
  var stepsRef = (0, _react.useMemo)(function () {
@@ -172,7 +174,7 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
172
174
  };
173
175
 
174
176
  var handleResize = function handleResize() {
175
- setPageHasScroll(document.body.scrollHeight > document.body.clientHeight);
177
+ setStepperEnabled(document.body.scrollHeight - minScrollHeightToEnable >= document.body.clientHeight);
176
178
  };
177
179
 
178
180
  (0, _reactUse.useMount)(function () {
@@ -185,6 +187,12 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
185
187
  window.removeEventListener('resize', handleResize);
186
188
  };
187
189
  }, []);
190
+ (0, _react.useEffect)(function () {
191
+ handleResize();
192
+ }, [document.body.scrollHeight]);
193
+ (0, _react.useEffect)(function () {
194
+ handleScroll();
195
+ }, [stepperEnabled]);
188
196
  return /*#__PURE__*/_react.default.createElement("div", {
189
197
  className: (0, _classnames.default)(classes.root, customClasses.root)
190
198
  }, /*#__PURE__*/_react.default.createElement("div", {
@@ -202,8 +210,8 @@ var HiScrollStepper = function HiScrollStepper(_ref) {
202
210
  },
203
211
  indicator: step.indicator,
204
212
  label: stepLabelVisible ? step.label : null,
205
- status: pageHasScroll ? status[index] : null,
206
- disabled: !pageHasScroll
213
+ status: stepperEnabled ? status[index] : null,
214
+ disabled: !stepperEnabled
207
215
  });
208
216
  }))), stepLabelVisibilityToggle && /*#__PURE__*/_react.default.createElement(_HiIconButton.default, {
209
217
  className: (0, _classnames.default)(classes.hideLabelToggle, customClasses.hideLabelToggle),
package/package.json CHANGED
@@ -1,6 +1,7 @@
1
1
  {
2
2
  "name": "@hipay/hipay-material-ui",
3
- "version": "3.13.3",
3
+ "private": false,
4
+ "version": "3.13.4",
4
5
  "description": "React components that implement Google's Material Design.",
5
6
  "repository": {
6
7
  "type": "git",
@@ -15,8 +16,8 @@
15
16
  "@hipay/design-system": "^1.0.2",
16
17
  "@mui/material": "5.8.4",
17
18
  "@mui/styles": "5.8.4",
18
- "@mui/styled-engine": "npm:@mui/styled-engine-sc@5.8.0",
19
- "@mui/styled-engine-sc": "5.8.0",
19
+ "@mui/styled-engine": "npm:@mui/styled-engine-sc@5.10.0",
20
+ "@mui/styled-engine-sc": "5.10.0",
20
21
  "mdi-material-ui": "7.1.0",
21
22
  "moment-timezone": "0.5.27",
22
23
  "react": "17.0.2",
@@ -73,8 +74,8 @@
73
74
  "node": ">=6.0.0"
74
75
  },
75
76
  "resolutions": {
76
- "@mui/styled-engine": "npm:@mui/styled-engine-sc@5.8.0"
77
+ "@mui/styled-engine": "npm:@mui/styled-engine-sc@5.10.0"
77
78
  },
78
79
  "main": "./index.js",
79
80
  "module": "./esm/index.js"
80
- }
81
+ }