@megafon/ui-core 5.11.0 → 5.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (16) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/dist/es/components/Sliders/Slider/Slider.css +1 -0
  3. package/dist/es/components/Sliders/Slider/Slider.js +0 -1
  4. package/dist/es/components/Sliders/SliderRange/SliderRange.css +2 -0
  5. package/dist/es/components/Sliders/SliderRange/SliderRange.js +8 -12
  6. package/dist/es/components/Sliders/SliderRatio/SliderRatio.css +1 -0
  7. package/dist/es/components/Sliders/components/SliderDisplayValue/SliderDisplayValue.css +1 -0
  8. package/dist/es/components/Sliders/helpers.js +6 -5
  9. package/dist/lib/components/Sliders/Slider/Slider.css +1 -0
  10. package/dist/lib/components/Sliders/Slider/Slider.js +0 -1
  11. package/dist/lib/components/Sliders/SliderRange/SliderRange.css +2 -0
  12. package/dist/lib/components/Sliders/SliderRange/SliderRange.js +8 -12
  13. package/dist/lib/components/Sliders/SliderRatio/SliderRatio.css +1 -0
  14. package/dist/lib/components/Sliders/components/SliderDisplayValue/SliderDisplayValue.css +1 -0
  15. package/dist/lib/components/Sliders/helpers.js +6 -5
  16. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -3,6 +3,17 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # [5.12.0](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/compare/@megafon/ui-core@5.11.0...@megafon/ui-core@5.12.0) (2024-05-14)
7
+
8
+
9
+ ### Features
10
+
11
+ * **sliders:** add support for non-multiple min value ([51ed0cf](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/commit/51ed0cfa3829bb4fab446086729a3b1ea1dcff61))
12
+
13
+
14
+
15
+
16
+
6
17
  # [5.11.0](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/compare/@megafon/ui-core@5.10.1...@megafon/ui-core@5.11.0) (2024-05-06)
7
18
 
8
19
 
package/dist/es/components/Sliders/Slider/Slider.css CHANGED
@@ -23,6 +23,7 @@
23
23
  margin-left: auto;
24
24
  }
25
25
  .mfui-slider__range-input {
26
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
26
27
  height: 12px;
27
28
  margin: 6px 0;
28
29
  border-radius: 100px;
package/dist/es/components/Sliders/Slider/Slider.js CHANGED
@@ -84,7 +84,6 @@ var Slider = function Slider(_ref) {
84
84
  value: rangeValue,
85
85
  min: minValue,
86
86
  max: maxValue,
87
- step: step,
88
87
  onChange: handleInputChange(true),
89
88
  disabled: disabled,
90
89
  style: {
package/dist/es/components/Sliders/SliderRange/SliderRange.css CHANGED
@@ -27,8 +27,10 @@
27
27
  position: relative;
28
28
  height: 12px;
29
29
  margin: 6px 0;
30
+ cursor: pointer;
30
31
  }
31
32
  .mfui-slider-range__range-input {
33
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
32
34
  position: absolute;
33
35
  top: 50%;
34
36
  width: 100%;
package/dist/es/components/Sliders/SliderRange/SliderRange.js CHANGED
@@ -19,10 +19,8 @@ var SliderRange = function SliderRange(_ref) {
19
19
  displayLeftValuePrefix = _ref.displayLeftValuePrefix,
20
20
  displayRightValuePrefix = _ref.displayRightValuePrefix,
21
21
  displayValueUnit = _ref.displayValueUnit,
22
- _ref$leftValue = _ref.leftValue,
23
- outerLeftValue = _ref$leftValue === void 0 ? 0 : _ref$leftValue,
24
- _ref$rightValue = _ref.rightValue,
25
- outerRightValue = _ref$rightValue === void 0 ? 0 : _ref$rightValue,
22
+ outerLeftValue = _ref.leftValue,
23
+ outerRightValue = _ref.rightValue,
26
24
  minValue = _ref.minValue,
27
25
  maxValue = _ref.maxValue,
28
26
  _ref$isControlled = _ref.isControlled,
@@ -35,8 +33,8 @@ var SliderRange = function SliderRange(_ref) {
35
33
  disabled = _ref$disabled === void 0 ? false : _ref$disabled,
36
34
  dataAttrs = _ref.dataAttrs,
37
35
  onChange = _ref.onChange;
38
- var defaultLeftRangeValue = outerLeftValue || minValue;
39
- var defaultRightRangeValue = outerRightValue || maxValue;
36
+ var outerLeftRangeValue = getRangeValue(outerLeftValue !== null && outerLeftValue !== void 0 ? outerLeftValue : minValue, minValue, maxValue, step);
37
+ var outerRightRangeValue = getRangeValue(outerRightValue !== null && outerRightValue !== void 0 ? outerRightValue : maxValue, minValue, maxValue, step);
40
38
  var rangeTrackInnerRef = React.useRef(null);
41
39
 
42
40
  var _React$useState = React.useState(null),
@@ -49,18 +47,18 @@ var SliderRange = function SliderRange(_ref) {
49
47
  rawRightInputValue = _React$useState4[0],
50
48
  setRawRightInputValue = _React$useState4[1];
51
49
 
52
- var _React$useState5 = React.useState(defaultLeftRangeValue),
50
+ var _React$useState5 = React.useState(outerLeftRangeValue),
53
51
  _React$useState6 = _slicedToArray(_React$useState5, 2),
54
52
  innerLeftRangeValue = _React$useState6[0],
55
53
  setInnerLeftRangeValue = _React$useState6[1];
56
54
 
57
- var _React$useState7 = React.useState(defaultRightRangeValue),
55
+ var _React$useState7 = React.useState(outerRightRangeValue),
58
56
  _React$useState8 = _slicedToArray(_React$useState7, 2),
59
57
  innerRightRangeValue = _React$useState8[0],
60
58
  setInnerRightRangeValue = _React$useState8[1];
61
59
 
62
- var leftRangeValue = isControlled ? outerLeftValue : innerLeftRangeValue;
63
- var rightRangeValue = isControlled ? outerRightValue : innerRightRangeValue;
60
+ var leftRangeValue = isControlled ? outerLeftRangeValue : innerLeftRangeValue;
61
+ var rightRangeValue = isControlled ? outerRightRangeValue : innerRightRangeValue;
64
62
  var trackSize = getTrackSize(leftRangeValue, rightRangeValue, minValue, maxValue);
65
63
  var isThumbAtEndOfTrack = checkForThumbAtEndOfTrack(leftRangeValue, minValue, maxValue, THUMB_SIZE);
66
64
  var showHead = !!label || !!displayValueType;
@@ -160,7 +158,6 @@ var SliderRange = function SliderRange(_ref) {
160
158
  value: leftRangeValue,
161
159
  min: minValue,
162
160
  max: maxValue,
163
- step: step,
164
161
  onChange: handleLeftInputChange(true),
165
162
  disabled: disabled
166
163
  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.leftRangeInput))), /*#__PURE__*/React.createElement("input", _extends({
@@ -171,7 +168,6 @@ var SliderRange = function SliderRange(_ref) {
171
168
  value: rightRangeValue,
172
169
  min: minValue,
173
170
  max: maxValue,
174
- step: step,
175
171
  onChange: handleRightInputChange(true),
176
172
  disabled: disabled
177
173
  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.rightRangeInput))), /*#__PURE__*/React.createElement("div", {
package/dist/es/components/Sliders/SliderRatio/SliderRatio.css CHANGED
@@ -28,6 +28,7 @@
28
28
  width: 100%;
29
29
  }
30
30
  .mfui-slider-ratio__range-input {
31
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
31
32
  position: relative;
32
33
  z-index: 1;
33
34
  display: block;
package/dist/es/components/Sliders/components/SliderDisplayValue/SliderDisplayValue.css CHANGED
@@ -50,6 +50,7 @@
50
50
  color: var(--spbSky3);
51
51
  }
52
52
  .mfui-slider-display-value__input {
53
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
53
54
  display: block;
54
55
  width: 10px;
55
56
  min-width: 100%;
package/dist/es/components/Sliders/helpers.js CHANGED
@@ -1,21 +1,22 @@
1
1
  import "core-js/modules/es.number.constructor.js";
2
2
  import "core-js/modules/es.number.to-fixed.js";
3
3
  export var getRangeValue = function getRangeValue(value, minValue, maxValue, step) {
4
- var numberValue = Number(value);
4
+ var sourceValue = Number(value);
5
5
 
6
- if (numberValue < minValue) {
6
+ if (minValue === maxValue || sourceValue < minValue) {
7
7
  return minValue;
8
8
  }
9
9
 
10
- if (numberValue > maxValue) {
10
+ if (sourceValue > maxValue) {
11
11
  return maxValue;
12
12
  }
13
13
 
14
14
  var valueDifference = maxValue - minValue;
15
15
  var expectedStepCount = valueDifference / step;
16
- var receivedStepCount = valueDifference / numberValue;
16
+ var receivedStepCount = valueDifference / sourceValue;
17
17
  var stepPosition = Math.round(expectedStepCount / receivedStepCount);
18
- return step * stepPosition;
18
+ var valueWithStep = step * stepPosition;
19
+ return valueWithStep < minValue ? minValue : valueWithStep;
19
20
  };
20
21
  export var getTrackSize = function getTrackSize() {
21
22
  var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
package/dist/lib/components/Sliders/Slider/Slider.css CHANGED
@@ -23,6 +23,7 @@
23
23
  margin-left: auto;
24
24
  }
25
25
  .mfui-slider__range-input {
26
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
26
27
  height: 12px;
27
28
  margin: 6px 0;
28
29
  border-radius: 100px;
package/dist/lib/components/Sliders/Slider/Slider.js CHANGED
@@ -107,7 +107,6 @@ var Slider = function Slider(_ref) {
107
107
  value: rangeValue,
108
108
  min: minValue,
109
109
  max: maxValue,
110
- step: step,
111
110
  onChange: handleInputChange(true),
112
111
  disabled: disabled,
113
112
  style: {
package/dist/lib/components/Sliders/SliderRange/SliderRange.css CHANGED
@@ -27,8 +27,10 @@
27
27
  position: relative;
28
28
  height: 12px;
29
29
  margin: 6px 0;
30
+ cursor: pointer;
30
31
  }
31
32
  .mfui-slider-range__range-input {
33
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
32
34
  position: absolute;
33
35
  top: 50%;
34
36
  width: 100%;
package/dist/lib/components/Sliders/SliderRange/SliderRange.js CHANGED
@@ -43,10 +43,8 @@ var SliderRange = function SliderRange(_ref) {
43
43
  displayLeftValuePrefix = _ref.displayLeftValuePrefix,
44
44
  displayRightValuePrefix = _ref.displayRightValuePrefix,
45
45
  displayValueUnit = _ref.displayValueUnit,
46
- _ref$leftValue = _ref.leftValue,
47
- outerLeftValue = _ref$leftValue === void 0 ? 0 : _ref$leftValue,
48
- _ref$rightValue = _ref.rightValue,
49
- outerRightValue = _ref$rightValue === void 0 ? 0 : _ref$rightValue,
46
+ outerLeftValue = _ref.leftValue,
47
+ outerRightValue = _ref.rightValue,
50
48
  minValue = _ref.minValue,
51
49
  maxValue = _ref.maxValue,
52
50
  _ref$isControlled = _ref.isControlled,
@@ -59,8 +57,8 @@ var SliderRange = function SliderRange(_ref) {
59
57
  disabled = _ref$disabled === void 0 ? false : _ref$disabled,
60
58
  dataAttrs = _ref.dataAttrs,
61
59
  onChange = _ref.onChange;
62
- var defaultLeftRangeValue = outerLeftValue || minValue;
63
- var defaultRightRangeValue = outerRightValue || maxValue;
60
+ var outerLeftRangeValue = (0, _helpers.getRangeValue)(outerLeftValue !== null && outerLeftValue !== void 0 ? outerLeftValue : minValue, minValue, maxValue, step);
61
+ var outerRightRangeValue = (0, _helpers.getRangeValue)(outerRightValue !== null && outerRightValue !== void 0 ? outerRightValue : maxValue, minValue, maxValue, step);
64
62
  var rangeTrackInnerRef = React.useRef(null);
65
63
 
66
64
  var _React$useState = React.useState(null),
@@ -73,18 +71,18 @@ var SliderRange = function SliderRange(_ref) {
73
71
  rawRightInputValue = _React$useState4[0],
74
72
  setRawRightInputValue = _React$useState4[1];
75
73
 
76
- var _React$useState5 = React.useState(defaultLeftRangeValue),
74
+ var _React$useState5 = React.useState(outerLeftRangeValue),
77
75
  _React$useState6 = (0, _slicedToArray2["default"])(_React$useState5, 2),
78
76
  innerLeftRangeValue = _React$useState6[0],
79
77
  setInnerLeftRangeValue = _React$useState6[1];
80
78
 
81
- var _React$useState7 = React.useState(defaultRightRangeValue),
79
+ var _React$useState7 = React.useState(outerRightRangeValue),
82
80
  _React$useState8 = (0, _slicedToArray2["default"])(_React$useState7, 2),
83
81
  innerRightRangeValue = _React$useState8[0],
84
82
  setInnerRightRangeValue = _React$useState8[1];
85
83
 
86
- var leftRangeValue = isControlled ? outerLeftValue : innerLeftRangeValue;
87
- var rightRangeValue = isControlled ? outerRightValue : innerRightRangeValue;
84
+ var leftRangeValue = isControlled ? outerLeftRangeValue : innerLeftRangeValue;
85
+ var rightRangeValue = isControlled ? outerRightRangeValue : innerRightRangeValue;
88
86
  var trackSize = (0, _helpers2.getTrackSize)(leftRangeValue, rightRangeValue, minValue, maxValue);
89
87
  var isThumbAtEndOfTrack = (0, _helpers2.checkForThumbAtEndOfTrack)(leftRangeValue, minValue, maxValue, THUMB_SIZE);
90
88
  var showHead = !!label || !!displayValueType;
@@ -184,7 +182,6 @@ var SliderRange = function SliderRange(_ref) {
184
182
  value: leftRangeValue,
185
183
  min: minValue,
186
184
  max: maxValue,
187
- step: step,
188
185
  onChange: handleLeftInputChange(true),
189
186
  disabled: disabled
190
187
  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.leftRangeInput))), /*#__PURE__*/React.createElement("input", (0, _extends2["default"])({
@@ -195,7 +192,6 @@ var SliderRange = function SliderRange(_ref) {
195
192
  value: rightRangeValue,
196
193
  min: minValue,
197
194
  max: maxValue,
198
- step: step,
199
195
  onChange: handleRightInputChange(true),
200
196
  disabled: disabled
201
197
  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.rightRangeInput))), /*#__PURE__*/React.createElement("div", {
package/dist/lib/components/Sliders/SliderRatio/SliderRatio.css CHANGED
@@ -28,6 +28,7 @@
28
28
  width: 100%;
29
29
  }
30
30
  .mfui-slider-ratio__range-input {
31
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
31
32
  position: relative;
32
33
  z-index: 1;
33
34
  display: block;
package/dist/lib/components/Sliders/components/SliderDisplayValue/SliderDisplayValue.css CHANGED
@@ -50,6 +50,7 @@
50
50
  color: var(--spbSky3);
51
51
  }
52
52
  .mfui-slider-display-value__input {
53
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
53
54
  display: block;
54
55
  width: 10px;
55
56
  min-width: 100%;
package/dist/lib/components/Sliders/helpers.js CHANGED
@@ -10,21 +10,22 @@ require("core-js/modules/es.number.constructor.js");
10
10
  require("core-js/modules/es.number.to-fixed.js");
11
11
 
12
12
  var getRangeValue = function getRangeValue(value, minValue, maxValue, step) {
13
- var numberValue = Number(value);
13
+ var sourceValue = Number(value);
14
14
 
15
- if (numberValue < minValue) {
15
+ if (minValue === maxValue || sourceValue < minValue) {
16
16
  return minValue;
17
17
  }
18
18
 
19
- if (numberValue > maxValue) {
19
+ if (sourceValue > maxValue) {
20
20
  return maxValue;
21
21
  }
22
22
 
23
23
  var valueDifference = maxValue - minValue;
24
24
  var expectedStepCount = valueDifference / step;
25
- var receivedStepCount = valueDifference / numberValue;
25
+ var receivedStepCount = valueDifference / sourceValue;
26
26
  var stepPosition = Math.round(expectedStepCount / receivedStepCount);
27
- return step * stepPosition;
27
+ var valueWithStep = step * stepPosition;
28
+ return valueWithStep < minValue ? minValue : valueWithStep;
28
29
  };
29
30
 
30
31
  exports.getRangeValue = getRangeValue;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megafon/ui-core",
3
- "version": "5.11.0",
3
+ "version": "5.12.0",
4
4
  "files": [
5
5
  "dist",
6
6
  "styles"
@@ -97,5 +97,5 @@
97
97
  "react-popper": "^2.2.3",
98
98
  "swiper": "^6.5.6"
99
99
  },
100
- "gitHead": "3450c82e4358cc0decaa76da57c8fb37c774391f"
100
+ "gitHead": "41cea5802cbc51e28d7f4c3d214996b12f3e5439"
101
101
  }