@megafon/ui-core 6.2.1 → 7.0.0

package/dist/lib/components/Sliders/SliderRatio/SliderRatio.css

@@ -1,219 +1 @@
-.mfui-slider-ratio {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-}
-.mfui-slider-ratio__head {
-  font-size: 15px;
-  line-height: 24px;
-  font-weight: 500;
-  margin-bottom: 8px;
-}
-.mfui-slider-ratio__display-values {
-  display: grid;
-  grid-template-columns: 45% 45%;
-  -webkit-box-pack: justify;
-      -ms-flex-pack: justify;
-          justify-content: space-between;
-  width: 100%;
-  margin-top: 8px;
-}
-.mfui-slider-ratio__display-value_left {
-  margin-right: auto;
-}
-.mfui-slider-ratio__display-value_right {
-  margin-left: auto;
-}
-.mfui-slider-ratio__range-container {
-  position: relative;
-  width: 100%;
-}
-.mfui-slider-ratio__range-input {
-  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-  position: relative;
-  z-index: 1;
-  display: block;
-  width: 100%;
-  height: 12px;
-  margin: 6px 0;
-  border-radius: 100px;
-  background: var(--brandPurple);
-  background-image: -webkit-gradient(linear, left top, left bottom, from(var(--brandGreen)), to(var(--brandGreen)));
-  background-image: linear-gradient(var(--brandGreen), var(--brandGreen));
-  background-repeat: no-repeat;
-  outline: none;
-  cursor: pointer;
-  -webkit-appearance: none;
-     -moz-appearance: none;
-          appearance: none;
-  pointer-events: none;
-}
-.mfui-slider-ratio__range-input:focus {
-  outline: none;
-}
-.mfui-slider-ratio__range-input::-webkit-slider-thumb {
-  width: var(--thumbSize);
-  height: var(--thumbSize);
-  border: none;
-  border-radius: 50%;
-  background-color: var(--stcWhite);
-  background-image: url('./i/thumb.png');
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
-  -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
-          box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
-  -webkit-appearance: none;
-  pointer-events: auto;
-}
-.mfui-slider-ratio__range-input::-moz-range-thumb {
-  width: var(--thumbSize);
-  height: var(--thumbSize);
-  border: none;
-  border-radius: 50%;
-  background-color: var(--stcWhite);
-  background-image: url('./i/thumb.png');
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
-  -webkit-appearance: none;
-  pointer-events: auto;
-}
-.mfui-slider-ratio__range-input::-ms-thumb {
-  width: var(--thumbSize);
-  height: var(--thumbSize);
-  border: none;
-  border-radius: 50%;
-  background-color: var(--stcWhite);
-  background-image: url('./i/thumb.png');
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
-  -webkit-appearance: none;
-  pointer-events: auto;
-}
-.mfui-slider-ratio__range-input::-webkit-slider-runnable-track {
-  border: none;
-  background: transparent;
-  -webkit-box-shadow: none;
-          box-shadow: none;
-  -webkit-appearance: none;
-}
-.mfui-slider-ratio__range-input::-moz-range-track {
-  border: none;
-  background: transparent;
-  box-shadow: none;
-  -webkit-appearance: none;
-}
-.mfui-slider-ratio__range-input::-ms-track {
-  border: none;
-  background: transparent;
-  box-shadow: none;
-  -webkit-appearance: none;
-}
-.mfui-slider-ratio__range-track {
-  position: absolute;
-  top: 0;
-  z-index: 0;
-  width: 100%;
-  height: 100%;
-  cursor: pointer;
-}
-.mfui-slider-ratio__scale {
-  position: absolute;
-  top: 0;
-  right: calc(var(--thumbSize) / 2);
-  bottom: 0;
-  left: calc(var(--thumbSize) / 2);
-  z-index: 2;
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  -webkit-box-pack: justify;
-      -ms-flex-pack: justify;
-          justify-content: space-between;
-  pointer-events: none;
-}
-.mfui-slider-ratio__scale-item {
-  width: 4px;
-  height: 4px;
-  border-radius: 50%;
-  background-color: var(--stcWhite);
-}
-.mfui-slider-ratio__scale-item:first-child {
-  margin-left: -2px;
-}
-.mfui-slider-ratio__scale-item:last-child {
-  margin-right: -2px;
-}
-.mfui-slider-ratio_disabled .mfui-slider-ratio__head {
-  color: var(--spbSky3);
-}
-.mfui-slider-ratio_disabled .mfui-slider-ratio__range-input {
-  background-color: var(--spbSky1);
-  background-image: -webkit-gradient(linear, left top, left bottom, from(var(--spbSky0)), to(var(--spbSky0)));
-  background-image: linear-gradient(var(--spbSky0), var(--spbSky0));
-  cursor: default;
-}
-.mfui-slider-ratio_disabled .mfui-slider-ratio__range-input::-webkit-slider-thumb {
-  width: var(--thumbSize);
-  height: var(--thumbSize);
-  border: none;
-  border-radius: 50%;
-  background-color: var(--stcWhite);
-  background-image: url('./i/thumb.png');
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
-  -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
-          box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
-  -webkit-appearance: none;
-  pointer-events: auto;
-  background-color: var(--spbSky2);
-  background-image: none;
-  -webkit-box-shadow: none;
-          box-shadow: none;
-}
-.mfui-slider-ratio_disabled .mfui-slider-ratio__range-input::-moz-range-thumb {
-  width: var(--thumbSize);
-  height: var(--thumbSize);
-  border: none;
-  border-radius: 50%;
-  background-color: var(--stcWhite);
-  background-image: url('./i/thumb.png');
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
-  -webkit-appearance: none;
-  pointer-events: auto;
-  background-color: var(--spbSky2);
-  background-image: none;
-  box-shadow: none;
-}
-.mfui-slider-ratio_disabled .mfui-slider-ratio__range-input::-ms-thumb {
-  width: var(--thumbSize);
-  height: var(--thumbSize);
-  border: none;
-  border-radius: 50%;
-  background-color: var(--stcWhite);
-  background-image: url('./i/thumb.png');
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
-  -webkit-appearance: none;
-  pointer-events: auto;
-  background-color: var(--spbSky2);
-  background-image: none;
-  box-shadow: none;
-}
-.mfui-slider-ratio_disabled .mfui-slider-ratio__range-track {
-  cursor: default;
-}
-.mfui-slider-ratio_disabled .mfui-slider-ratio__scale {
-  display: none;
-}
+h1,h2,h3,h4,h5{margin:0}.mfui-slider-ratio{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.mfui-slider-ratio__head{font-size:15px;font-weight:500;line-height:24px;margin-bottom:8px}.mfui-slider-ratio__display-values{display:grid;grid-template-columns:45% 45%;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-top:8px;width:100%}.mfui-slider-ratio__display-value_left{margin-right:auto}.mfui-slider-ratio__display-value_right{margin-left:auto}.mfui-slider-ratio__range-container{position:relative;width:100%}.mfui-slider-ratio__range-input{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--brandPurple);background-image:-webkit-gradient(linear,left top,left bottom,from(var(--brandGreen)),to(var(--brandGreen)));background-image:linear-gradient(var(--brandGreen),var(--brandGreen));background-repeat:no-repeat;border-radius:100px;cursor:pointer;display:block;height:12px;margin:6px 0;outline:none;pointer-events:none;position:relative;width:100%;z-index:1}.mfui-slider-ratio__range-input:focus{outline:none}.mfui-slider-ratio__range-input::-webkit-slider-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-image:url(i/thumb.png);background-repeat:no-repeat;background-size:100% 100%;border:none;border-radius:50%;-webkit-box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:0 2px 6px rgba(0,0,0,.16);height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-ratio__range-input::-moz-range-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-image:url(i/thumb.png);background-repeat:no-repeat;background-size:100% 100%;border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-ratio__range-input::-ms-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-image:url(i/thumb.png);background-repeat:no-repeat;background-size:100% 100%;border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-ratio__range-input::-webkit-slider-runnable-track{-webkit-appearance:none;background:transparent;border:none;-webkit-box-shadow:none;box-shadow:none}.mfui-slider-ratio__range-input::-moz-range-track{-webkit-appearance:none;background:transparent;border:none;box-shadow:none}.mfui-slider-ratio__range-input::-ms-track{-webkit-appearance:none;background:transparent;border:none;box-shadow:none}.mfui-slider-ratio__range-track{cursor:pointer;height:100%;position:absolute;top:0;width:100%;z-index:0}.mfui-slider-ratio__scale{bottom:0;display:-webkit-box;display:-ms-flexbox;display:flex;left:calc(var(--thumbSize)/2);position:absolute;right:calc(var(--thumbSize)/2);top:0;z-index:2;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;pointer-events:none}.mfui-slider-ratio__scale-item{background-color:var(--stcWhite);border-radius:50%;height:4px;width:4px}.mfui-slider-ratio__scale-item:first-child{margin-left:-2px}.mfui-slider-ratio__scale-item:last-child{margin-right:-2px}.mfui-slider-ratio_disabled .mfui-slider-ratio__head{color:var(--spbSky3)}.mfui-slider-ratio_disabled .mfui-slider-ratio__range-input{background-color:var(--spbSky1);background-image:-webkit-gradient(linear,left top,left bottom,from(var(--spbSky0)),to(var(--spbSky0)));background-image:linear-gradient(var(--spbSky0),var(--spbSky0));cursor:default}.mfui-slider-ratio_disabled .mfui-slider-ratio__range-input::-webkit-slider-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-color:var(--spbSky2);background-image:url(i/thumb.png);background-image:none;background-repeat:no-repeat;background-size:100% 100%;border:none;border-radius:50%;-webkit-box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:0 2px 6px rgba(0,0,0,.16);-webkit-box-shadow:none;box-shadow:none;height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-ratio_disabled .mfui-slider-ratio__range-input::-moz-range-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-color:var(--spbSky2);background-image:url(i/thumb.png);background-image:none;background-repeat:no-repeat;background-size:100% 100%;border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:none;height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-ratio_disabled .mfui-slider-ratio__range-input::-ms-thumb{-webkit-appearance:none;background-color:var(--stcWhite);background-color:var(--spbSky2);background-image:url(i/thumb.png);background-image:none;background-repeat:no-repeat;background-size:100% 100%;border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.16);box-shadow:none;height:var(--thumbSize);pointer-events:auto;width:var(--thumbSize)}.mfui-slider-ratio_disabled .mfui-slider-ratio__range-track{cursor:default}.mfui-slider-ratio_disabled .mfui-slider-ratio__scale{display:none}

package/dist/lib/components/Sliders/SliderRatio/SliderRatio.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { DisplayValueType } from '../components/SliderDisplayValue/SliderDisplayValue';
 import { ValueType } from './types';
-import './SliderRatio.less';
+import './SliderRatio.scss';
 export interface ISliderRatio {
     /** Дополнительный класс корневого элемента */
     className?: string;

package/dist/lib/components/Sliders/SliderRatio/SliderRatio.js

@@ -1,111 +1,79 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
-
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
+require("core-js/modules/es.array.find-index.js");
 require("core-js/modules/es.array.iterator.js");
-
+require("core-js/modules/es.array.map.js");
+require("core-js/modules/es.number.constructor.js");
 require("core-js/modules/es.object.to-string.js");
-
 require("core-js/modules/web.dom-collections.iterator.js");
-
-require("core-js/modules/es.number.constructor.js");
-
-require("core-js/modules/es.array.find-index.js");
-
-require("core-js/modules/es.array.map.js");
-
-require("core-js/modules/es.object.values.js");
-
 var React = _interopRequireWildcard(require("react"));
-
 var _uiHelpers = require("@megafon/ui-helpers");
-
-var PropTypes = _interopRequireWildcard(require("prop-types"));
-
 var _SliderDisplayValue = _interopRequireWildcard(require("../components/SliderDisplayValue/SliderDisplayValue"));
-
 var _helpers = require("../helpers");
-
 var _helpers2 = require("./helpers");
-
 var _types = require("./types");
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
 var THUMB_SIZE = 24;
 var MIN_RANGE_VALUE = 0;
 var MAX_RANGE_VALUE = 100;
 var cn = (0, _uiHelpers.cnCreate)('mfui-slider-ratio');
-
 var SliderRatio = function SliderRatio(_ref) {
   var className = _ref.className,
-      label = _ref.label,
-      _ref$displayValueType = _ref.displayValueType,
-      displayValueType = _ref$displayValueType === void 0 ? _SliderDisplayValue.DisplayValue.LINE : _ref$displayValueType,
-      displayLeftValuePrefix = _ref.displayLeftValuePrefix,
-      displayRightValuePrefix = _ref.displayRightValuePrefix,
-      displayLeftValueUnit = _ref.displayLeftValueUnit,
-      displayRightValueUnit = _ref.displayRightValueUnit,
-      values = _ref.values,
-      _ref$index = _ref.index,
-      outerIndex = _ref$index === void 0 ? 0 : _ref$index,
-      _ref$isControlled = _ref.isControlled,
-      isControlled = _ref$isControlled === void 0 ? false : _ref$isControlled,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      _ref$showScale = _ref.showScale,
-      showScale = _ref$showScale === void 0 ? false : _ref$showScale,
-      dataAttrs = _ref.dataAttrs,
-      onChange = _ref.onChange;
-
+    label = _ref.label,
+    _ref$displayValueType = _ref.displayValueType,
+    displayValueType = _ref$displayValueType === void 0 ? _SliderDisplayValue.DisplayValue.LINE : _ref$displayValueType,
+    displayLeftValuePrefix = _ref.displayLeftValuePrefix,
+    displayRightValuePrefix = _ref.displayRightValuePrefix,
+    displayLeftValueUnit = _ref.displayLeftValueUnit,
+    displayRightValueUnit = _ref.displayRightValueUnit,
+    values = _ref.values,
+    _ref$index = _ref.index,
+    outerIndex = _ref$index === void 0 ? 0 : _ref$index,
+    _ref$isControlled = _ref.isControlled,
+    isControlled = _ref$isControlled === void 0 ? false : _ref$isControlled,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    _ref$showScale = _ref.showScale,
+    showScale = _ref$showScale === void 0 ? false : _ref$showScale,
+    dataAttrs = _ref.dataAttrs,
+    onChange = _ref.onChange;
   var _a, _b;
-
   var stepCount = values.length - 1;
   var rangeInputRef = React.useRef(null);
   var rangeTrackRef = React.useRef(null);
-
   var _React$useState = React.useState(false),
-      _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
-      isPointerUpped = _React$useState2[0],
-      setIsPointerUpped = _React$useState2[1];
-
+    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
+    isPointerUpped = _React$useState2[0],
+    setIsPointerUpped = _React$useState2[1];
   var _React$useState3 = React.useState(outerIndex),
-      _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
-      innerIndex = _React$useState4[0],
-      setInnerIndex = _React$useState4[1];
-
+    _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
+    innerIndex = _React$useState4[0],
+    setInnerIndex = _React$useState4[1];
   var _React$useReducer = React.useReducer(_helpers2.inputReducer, {
-    left: null,
-    right: null
-  }),
-      _React$useReducer2 = (0, _slicedToArray2["default"])(_React$useReducer, 2),
-      rawInputValue = _React$useReducer2[0],
-      dispatchRawInputValue = _React$useReducer2[1];
-
+      left: null,
+      right: null
+    }),
+    _React$useReducer2 = (0, _slicedToArray2["default"])(_React$useReducer, 2),
+    rawInputValue = _React$useReducer2[0],
+    dispatchRawInputValue = _React$useReducer2[1];
   var _React$useState5 = React.useState(null),
-      _React$useState6 = (0, _slicedToArray2["default"])(_React$useState5, 2),
-      rawRangeValue = _React$useState6[0],
-      setRawRangeValue = _React$useState6[1];
-
+    _React$useState6 = (0, _slicedToArray2["default"])(_React$useState5, 2),
+    rawRangeValue = _React$useState6[0],
+    setRawRangeValue = _React$useState6[1];
   var currentIndex = isControlled ? outerIndex : innerIndex;
   var rangeValue = rawRangeValue !== null && rawRangeValue !== void 0 ? rawRangeValue : (0, _helpers2.getRangeStepValue)(stepCount, currentIndex);
   var leftInputValue = (_a = rawInputValue.left) !== null && _a !== void 0 ? _a : values[currentIndex].leftValue;
   var rightInputValue = (_b = rawInputValue.right) !== null && _b !== void 0 ? _b : values[currentIndex].rightValue;
   var trackSize = (0, _helpers.getTrackSize)(rangeValue, MIN_RANGE_VALUE, MAX_RANGE_VALUE);
-
   var handleInputChange = function handleInputChange(key) {
     return function (e) {
       var targetValue = (0, _helpers.removeFirstZeros)(e.target.value);
@@ -121,17 +89,14 @@ var SliderRatio = function SliderRatio(_ref) {
       });
     };
   };
-
   var handleRangeInputChange = function handleRangeInputChange(e) {
     // Cross browser fix: Firefox calls onChange after calling onPointerUp, but Chrome doesn't
     if (isPointerUpped) {
       setIsPointerUpped(false);
       return;
     }
-
     setRawRangeValue(Number(e.target.value));
   };
-
   var handleRangeInputPointerUp = function handleRangeInputPointerUp() {
     var newIndex = (0, _helpers2.getIndexByRangeValue)(rangeValue, stepCount);
     setIsPointerUpped(true);
@@ -139,12 +104,10 @@ var SliderRatio = function SliderRatio(_ref) {
     !isControlled && setInnerIndex(newIndex);
     newIndex !== currentIndex && (onChange === null || onChange === void 0 ? void 0 : onChange(newIndex));
   };
-
   var handleRangeTrackPointerUp = function handleRangeTrackPointerUp(e) {
     if (disabled) {
       return;
     }
-
     var currentTarget = e.currentTarget;
     var newRangeValue = (0, _helpers2.getRangeValueByPageX)(e.pageX, currentTarget, THUMB_SIZE);
     var newIndex = (0, _helpers2.getIndexByRangeValue)(newRangeValue, stepCount);
@@ -152,24 +115,18 @@ var SliderRatio = function SliderRatio(_ref) {
     !isControlled && setInnerIndex(newIndex);
     newIndex !== currentIndex && (onChange === null || onChange === void 0 ? void 0 : onChange(newIndex));
   };
-
   var handleRangeTrackPointerLeave = React.useCallback(function () {
     var _a, _b;
-
     (_a = rangeInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
     (_b = rangeTrackRef.current) === null || _b === void 0 ? void 0 : _b.removeEventListener('pointerleave', handleRangeTrackPointerLeave);
   }, []);
-
   var handleRangeTrackPointerDown = function handleRangeTrackPointerDown() {
     var _a;
-
     if (disabled) {
       return;
     }
-
     (_a = rangeTrackRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener('pointerleave', handleRangeTrackPointerLeave);
   };
-
   var handleInputBlur = function handleInputBlur(key) {
     return function () {
       onChange === null || onChange === void 0 ? void 0 : onChange(currentIndex);
@@ -179,7 +136,6 @@ var SliderRatio = function SliderRatio(_ref) {
       });
     };
   };
-
   return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
     className: cn({
       disabled: disabled
@@ -252,31 +208,4 @@ var SliderRatio = function SliderRatio(_ref) {
     });
   }))));
 };
-
-SliderRatio.propTypes = {
-  className: PropTypes.string,
-  values: PropTypes.arrayOf(PropTypes.shape({
-    leftValue: PropTypes.number.isRequired,
-    rightValue: PropTypes.number.isRequired
-  }).isRequired).isRequired,
-  index: PropTypes.number,
-  label: PropTypes.string,
-  displayValueType: PropTypes.oneOf(Object.values(_SliderDisplayValue.DisplayValue)),
-  displayLeftValuePrefix: PropTypes.string,
-  displayRightValuePrefix: PropTypes.string,
-  displayLeftValueUnit: PropTypes.string,
-  displayRightValueUnit: PropTypes.string,
-  isControlled: PropTypes.bool,
-  disabled: PropTypes.bool,
-  showScale: PropTypes.bool,
-  dataAttrs: PropTypes.shape({
-    root: PropTypes.objectOf(PropTypes.string.isRequired),
-    leftInput: PropTypes.objectOf(PropTypes.string.isRequired),
-    rightInput: PropTypes.objectOf(PropTypes.string.isRequired),
-    rangeInput: PropTypes.objectOf(PropTypes.string.isRequired),
-    scale: PropTypes.objectOf(PropTypes.string.isRequired)
-  }),
-  onChange: PropTypes.func
-};
-var _default = SliderRatio;
-exports["default"] = _default;
+var _default = exports["default"] = SliderRatio;

package/dist/lib/components/Sliders/SliderRatio/helpers.js

@@ -3,56 +3,37 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.findClosestValue = exports.getIndexByRangeValue = exports.getRangeStepValue = exports.getRangeValueByPageX = exports.inputReducer = void 0;
-
+exports.inputReducer = exports.getRangeValueByPageX = exports.getRangeStepValue = exports.getIndexByRangeValue = exports.findClosestValue = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 require("core-js/modules/es.array.reduce.js");
-
+require("core-js/modules/es.object.to-string.js");
 var _types = require("./types");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-var inputReducer = function inputReducer(state, action) {
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var inputReducer = exports.inputReducer = function inputReducer(state, action) {
   if (action.type === _types.KeyValueEnum.LEFT) {
     return (0, _extends2["default"])((0, _extends2["default"])({}, state), {
       left: action.value
     });
   }
-
   return (0, _extends2["default"])((0, _extends2["default"])({}, state), {
     right: action.value
   });
 };
-
-exports.inputReducer = inputReducer;
-
-var getRangeValueByPageX = function getRangeValueByPageX(pageX, trackInnerNode, thumbSize) {
+var getRangeValueByPageX = exports.getRangeValueByPageX = function getRangeValueByPageX(pageX, trackInnerNode, thumbSize) {
   var clickPosition = pageX - (trackInnerNode.getBoundingClientRect().left + thumbSize / 2);
   var clickPositionPercent = clickPosition * 100 / (trackInnerNode.offsetWidth - thumbSize);
   return Math.round(clickPositionPercent);
 };
-
-exports.getRangeValueByPageX = getRangeValueByPageX;
-
-var getRangeStepValue = function getRangeStepValue(valuesCount, index) {
+var getRangeStepValue = exports.getRangeStepValue = function getRangeStepValue(valuesCount, index) {
   var step = 100 / valuesCount;
   return step * index;
 };
-
-exports.getRangeStepValue = getRangeStepValue;
-
-var getIndexByRangeValue = function getIndexByRangeValue(rangeValue, valuesCount) {
+var getIndexByRangeValue = exports.getIndexByRangeValue = function getIndexByRangeValue(rangeValue, valuesCount) {
   var step = 100 / valuesCount;
   return Math.round(rangeValue / step);
 };
-
-exports.getIndexByRangeValue = getIndexByRangeValue;
-
-var findClosestValue = function findClosestValue(values, target, key) {
+var findClosestValue = exports.findClosestValue = function findClosestValue(values, target, key) {
   return values.reduce(function (closest, value) {
     return Math.abs(value[key] - target) > Math.abs(closest - target) ? closest : value[key];
   }, values[0][key]);
-};
-
-exports.findClosestValue = findClosestValue;
+};

package/dist/lib/components/Sliders/SliderRatio/types.d.ts

@@ -2,7 +2,7 @@ export declare enum KeyValueEnum {
     LEFT = "leftValue",
     RIGHT = "rightValue"
 }
-export declare type ValueType = {
+export type ValueType = {
     [KeyValueEnum.LEFT]: number;
     [KeyValueEnum.RIGHT]: number;
 };

package/dist/lib/components/Sliders/SliderRatio/types.js

@@ -5,8 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.KeyValueEnum = void 0;
 var KeyValueEnum;
-exports.KeyValueEnum = KeyValueEnum;
-
 (function (KeyValueEnum) {
   KeyValueEnum["LEFT"] = "leftValue";
   KeyValueEnum["RIGHT"] = "rightValue";

package/dist/lib/components/Sliders/components/SliderDisplayValue/SliderDisplayValue.css

@@ -1,84 +1 @@
-.mfui-slider-display-value {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  max-width: 100%;
-  color: var(--content);
-  font-weight: 400;
-}
-.mfui-slider-display-value_interactive {
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  min-width: 90px;
-  padding: 7px 16px;
-  border: 1px solid var(--spbSky2);
-  border-radius: 12px;
-  overflow: hidden;
-  background-color: var(--base);
-  cursor: text;
-}
-.mfui-slider-display-value_interactive.mfui-slider-display-value:hover,
-.mfui-slider-display-value_interactive.mfui-slider-display-value_focus {
-  border-color: var(--content);
-}
-.mfui-slider-display-value_disabled {
-  border-color: var(--spbSky0);
-  color: var(--spbSky3);
-  background-color: var(--spbSky0);
-  cursor: default;
-}
-.mfui-slider-display-value_disabled.mfui-slider-display-value_interactive:hover {
-  border-color: var(--spbSky0);
-}
-.mfui-slider-display-value__box {
-  overflow: hidden;
-}
-.mfui-slider-display-value__line {
-  font-weight: 500;
-}
-.mfui-slider-display-value__unit {
-  margin-left: 4px;
-}
-.mfui-slider-display-value_interactive .mfui-slider-display-value__line {
-  height: 0;
-  visibility: hidden;
-  opacity: 0;
-}
-.mfui-slider-display-value__prefix {
-  margin-right: 4px;
-  color: var(--spbSky3);
-}
-.mfui-slider-display-value__input {
-  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-  display: block;
-  width: 10px;
-  min-width: 100%;
-  margin: 0;
-  padding: 0;
-  border: none;
-  border-radius: 0;
-  color: inherit;
-  font-weight: 400;
-  background-color: transparent;
-  outline: none;
-  -webkit-box-shadow: none;
-          box-shadow: none;
-  cursor: text;
-  opacity: 1;
-  -webkit-appearance: none;
-     -moz-appearance: none;
-          appearance: none;
-  caret-color: var(--brandGreen);
-  font-family: inherit;
-  font-size: 15px;
-  line-height: 24px;
-}
-.mfui-slider-display-value__input::-webkit-outer-spin-button,
-.mfui-slider-display-value__input::-webkit-inner-spin-button {
-  margin: 0;
-  -webkit-appearance: none;
-}
-.mfui-slider-display-value__input[type='number'] {
-  -moz-appearance: textfield;
-}
+h1,h2,h3,h4,h5{margin:0}.mfui-slider-display-value{color:var(--content);display:-webkit-box;display:-ms-flexbox;display:flex;font-weight:400;max-width:100%}.mfui-slider-display-value_interactive{-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--base);border:1px solid var(--spbSky2);border-radius:12px;cursor:text;min-width:90px;overflow:hidden;padding:7px 16px}.mfui-slider-display-value_interactive.mfui-slider-display-value:hover,.mfui-slider-display-value_interactive.mfui-slider-display-value_focus{border-color:var(--content)}.mfui-slider-display-value_disabled{background-color:var(--spbSky0);border-color:var(--spbSky0);color:var(--spbSky3);cursor:default}.mfui-slider-display-value_disabled.mfui-slider-display-value_interactive:hover{border-color:var(--spbSky0)}.mfui-slider-display-value__box{overflow:hidden}.mfui-slider-display-value__line{font-weight:500}.mfui-slider-display-value__unit{margin-left:4px}.mfui-slider-display-value_interactive .mfui-slider-display-value__line{height:0;opacity:0;visibility:hidden}.mfui-slider-display-value__prefix{color:var(--spbSky3);margin-right:4px}.mfui-slider-display-value__input{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;border-radius:0;-webkit-box-shadow:none;box-shadow:none;caret-color:var(--brandGreen);color:inherit;cursor:text;display:block;font-family:inherit;font-size:15px;font-weight:400;line-height:24px;margin:0;min-width:100%;opacity:1;outline:none;padding:0;width:10px}.mfui-slider-display-value__input::-webkit-inner-spin-button,.mfui-slider-display-value__input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.mfui-slider-display-value__input[type=number]{-moz-appearance:textfield}

package/dist/lib/components/Sliders/components/SliderDisplayValue/SliderDisplayValue.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
-import './SliderDisplayValue.less';
+import './SliderDisplayValue.scss';
 export declare const DisplayValue: {
     readonly LINE: "line";
     readonly INPUT: "input";
 };
-export declare type DisplayValueType = typeof DisplayValue[keyof typeof DisplayValue];
+export type DisplayValueType = (typeof DisplayValue)[keyof typeof DisplayValue];
 export interface ISliderDisplayValue {
     className?: string;
     value: string | number;