intelicoreact 1.3.21 → 1.3.23

package/dist/Atomic/FormElements/RangeSlider/RangeSlider.js

@@ -1,395 +1,258 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = RangeSlider;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _react = _interopRequireWildcard(require("react"));
-
-var _reactFeather = require("react-feather");
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
-var _useIsMobile2 = _interopRequireDefault(require("../../../Functions/useIsMobile"));
-
-var _mobileKeyboardTypesPresets = require("../../../Functions/presets/mobileKeyboardTypesPresets");
-
+var _reactFeather = require("react-feather");
 var _fieldValueFormatters = require("../../../Functions/fieldValueFormatters");
-
+var _mobileKeyboardTypesPresets = require("../../../Functions/presets/mobileKeyboardTypesPresets");
+var _useIsMobile = _interopRequireDefault(require("../../../Functions/useIsMobile"));
 var _Input = _interopRequireDefault(require("../Input/Input"));
-
 require("./RangeSlider.scss");
-
-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 ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (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 && Object.prototype.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 RangeSlider(_ref) {
   var _value$from, _value$to;
-
-  var required = _ref.required,
-      noTrack = _ref.noTrack,
-      rangeSymbol = _ref.rangeSymbol,
-      _ref$min = _ref.min,
-      min = _ref$min === void 0 ? 0 : _ref$min,
-      _ref$max = _ref.max,
-      max = _ref$max === void 0 ? 100 : _ref$max,
-      _ref$decimalPlaces = _ref.decimalPlaces,
-      decimalPlaces = _ref$decimalPlaces === void 0 ? 2 : _ref$decimalPlaces,
-      _ref$minRange = _ref.minRange,
-      minRange = _ref$minRange === void 0 ? 0 : _ref$minRange,
-      _ref$precision = _ref.precision,
-      precision = _ref$precision === void 0 ? 0 : _ref$precision,
-      testId = _ref.testId,
-      _ref$value = _ref.value,
-      value = _ref$value === void 0 ? {
-    from: min,
-    to: max
-  } : _ref$value,
-      _ref$unit = _ref.unit,
-      unit = _ref$unit === void 0 ? '' : _ref$unit,
-      _ref$label = _ref.label,
-      label = _ref$label === void 0 ? '' : _ref$label,
-      _ref$isUseBitPoints = _ref.isUseBitPoints,
-      isUseBitPoints = _ref$isUseBitPoints === void 0 ? true : _ref$isUseBitPoints,
-      _ref$onChange = _ref.onChange,
-      onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange;
-
-  var _useIsMobile = (0, _useIsMobile2.default)(),
-      isMobile = _useIsMobile.isMobile;
-
-  var trackRef = (0, _react.useRef)(0);
-
-  var _useState = (0, _react.useState)(0),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      trackWidth = _useState2[0],
-      setTrackWidth = _useState2[1];
-
-  var _useState3 = (0, _react.useState)(0),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      trackPosition = _useState4[0],
-      setTrackPosition = _useState4[1];
-
-  var fromTriggerRef = (0, _react.useRef)(0);
-  var toTriggerRef = (0, _react.useRef)(0);
-
-  var prepareValue = function prepareValue(value) {
-    return parseInt(parseFloat(value) * Math.pow(10, precision)) / Math.pow(10, precision);
+  let {
+    required,
+    noTrack,
+    rangeSymbol,
+    min = 0,
+    max = 100,
+    decimalPlaces = 2,
+    minRange = 0,
+    precision = 0,
+    testId,
+    value = {
+      from: min,
+      to: max
+    },
+    unit = "",
+    label = "",
+    isUseBitPoints = true,
+    onChange = () => {}
+  } = _ref;
+  const {
+    isMobile
+  } = (0, _useIsMobile.default)();
+  const trackRef = (0, _react.useRef)(0);
+  const [trackWidth, setTrackWidth] = (0, _react.useState)(0);
+  const [trackPosition, setTrackPosition] = (0, _react.useState)(0);
+  const fromTriggerRef = (0, _react.useRef)(0);
+  const toTriggerRef = (0, _react.useRef)(0);
+  const prepareValue = value => {
+    return parseInt(parseFloat(value) * 10 ** precision, 10) / 10 ** precision;
   };
-
-  var _useState5 = (0, _react.useState)((_value$from = value === null || value === void 0 ? void 0 : value.from) !== null && _value$from !== void 0 ? _value$from : min),
-      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-      from = _useState6[0],
-      setFromValue = _useState6[1];
-
-  var setFrom = function setFrom(v) {
-    return setFromValue(prepareValue(v));
-  };
-
-  var _useState7 = (0, _react.useState)((_value$to = value === null || value === void 0 ? void 0 : value.to) !== null && _value$to !== void 0 ? _value$to : max),
-      _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
-      to = _useState8[0],
-      setToValue = _useState8[1];
-
-  var setTo = function setTo(v) {
-    return setToValue(prepareValue(v));
-  };
-
-  var _useState9 = (0, _react.useState)(null),
-      _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
-      focusedType = _useState10[0],
-      setFocusedType = _useState10[1];
-
-  var _useState11 = (0, _react.useState)(null),
-      _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
-      frezeedValues = _useState12[0],
-      setFrezeedValues = _useState12[1];
-
-  var _useState13 = (0, _react.useState)({
+  const [from, setFromValue] = (0, _react.useState)((_value$from = value === null || value === void 0 ? void 0 : value.from) !== null && _value$from !== void 0 ? _value$from : min);
+  const setFrom = v => setFromValue(prepareValue(v));
+  const [to, setToValue] = (0, _react.useState)((_value$to = value === null || value === void 0 ? void 0 : value.to) !== null && _value$to !== void 0 ? _value$to : max);
+  const setTo = v => setToValue(prepareValue(v));
+  const [focusedType, setFocusedType] = (0, _react.useState)(null);
+  const [frezeedValues, setFrezeedValues] = (0, _react.useState)(null);
+  const [isInputsFocused, setIsInputsFocused] = (0, _react.useState)({
     from: false,
     to: false
-  }),
-      _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
-      isInputsFocused = _useState14[0],
-      setIsInputsFocused = _useState14[1];
-
-  var setIsInputFocused = function setIsInputFocused(input, value) {
-    return setIsInputsFocused(function (state) {
-      return _objectSpread(_objectSpread({}, state), {}, (0, _defineProperty2.default)({}, input, value));
-    });
-  };
-
-  var fromValue = frezeedValues ? frezeedValues === null || frezeedValues === void 0 ? void 0 : frezeedValues.from : from;
-  var toValue = frezeedValues ? frezeedValues === null || frezeedValues === void 0 ? void 0 : frezeedValues.to : to;
-
-  var _useState15 = (0, _react.useState)(null),
-      _useState16 = (0, _slicedToArray2.default)(_useState15, 2),
-      movingController = _useState16[0],
-      setMovingController = _useState16[1];
-
-  var _useState17 = (0, _react.useState)(null),
-      _useState18 = (0, _slicedToArray2.default)(_useState17, 2),
-      movingTrigger = _useState18[0],
-      setMovingTrigger = _useState18[1];
-
-  var _useState19 = (0, _react.useState)(null),
-      _useState20 = (0, _slicedToArray2.default)(_useState19, 2),
-      movingTriggerType = _useState20[0],
-      setMovingTriggerType = _useState20[1];
-
-  var _useState21 = (0, _react.useState)(false),
-      _useState22 = (0, _slicedToArray2.default)(_useState21, 2),
-      isTriggerMoved = _useState22[0],
-      setIsTriggerMoved = _useState22[1];
-
-  var _useState23 = (0, _react.useState)(0),
-      _useState24 = (0, _slicedToArray2.default)(_useState23, 2),
-      pointsPerPx = _useState24[0],
-      setPointsPerPx = _useState24[1];
-
-  var _useState25 = (0, _react.useState)(0),
-      _useState26 = (0, _slicedToArray2.default)(_useState25, 2),
-      extremumRange = _useState26[0],
-      setExtremumRange = _useState26[1];
-
-  var _useState27 = (0, _react.useState)(0),
-      _useState28 = (0, _slicedToArray2.default)(_useState27, 2),
-      extremumWidth = _useState28[0],
-      setExtremumWidth = _useState28[1];
-
-  var countPointsPerPx = function countPointsPerPx(width) {
+  });
+  const setIsInputFocused = (input, value) => setIsInputsFocused(state => ({
+    ...state,
+    [input]: value
+  }));
+  const fromValue = frezeedValues ? frezeedValues === null || frezeedValues === void 0 ? void 0 : frezeedValues.from : from;
+  const toValue = frezeedValues ? frezeedValues === null || frezeedValues === void 0 ? void 0 : frezeedValues.to : to;
+  const [movingController, setMovingController] = (0, _react.useState)(null);
+  const [movingTrigger, setMovingTrigger] = (0, _react.useState)(null);
+  const [movingTriggerType, setMovingTriggerType] = (0, _react.useState)(null);
+  const [isTriggerMoved, setIsTriggerMoved] = (0, _react.useState)(false);
+  const [pointsPerPx, setPointsPerPx] = (0, _react.useState)(0);
+  const [extremumRange, setExtremumRange] = (0, _react.useState)(0);
+  const [extremumWidth, setExtremumWidth] = (0, _react.useState)(0);
+  const countPointsPerPx = width => {
     return (max - min) / width;
   };
-
-  var resetRange = function resetRange() {
+  const resetRange = () => {
     setFrom(min);
     setTo(max);
   };
-
-  var getTrackXByPoints = function getTrackXByPoints(pts) {
+  const getTrackXByPoints = pts => {
     return (pts - min) / pointsPerPx;
   };
-
-  var getRangeWidth = function getRangeWidth() {
+  const getRangeWidth = () => {
     return getTrackXByPoints(toValue) - getTrackXByPoints(fromValue);
   };
-
-  var getRangeOffset = function getRangeOffset() {
+  const getRangeOffset = () => {
     return getTrackXByPoints(fromValue);
   };
-
-  var getXByPoints = function getXByPoints(pts) {
+  const getXByPoints = pts => {
     return (pts - min) / pointsPerPx + trackPosition;
   };
-
-  var getPointsByX = function getPointsByX(x) {
+  const getPointsByX = x => {
     return (x - trackPosition) * pointsPerPx + min;
   };
-
-  var onRangeChange = function onRangeChange(type, value) {
-    var validate = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+  const onRangeChange = function (type, value) {
+    let validate = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
     if (validate) value = prepareValue(value);
     if (isNaN(value)) value = 0;
-
     switch (type) {
-      case 'from':
+      case "from":
         if (validate) {
           if (value < min) {
             value = min;
           }
-
           if (value > to - minRange) {
             value = to - minRange;
           }
         }
-
         validate ? setFrom(value) : setFromValue(value);
         break;
-
-      case 'to':
+      case "to":
         if (validate) {
           if (value > max) {
             value = max;
           }
-
           if (value < from + minRange) {
             value = from + minRange;
           }
         }
-
         validate ? setTo(value) : setToValue(value);
         break;
     }
-  }; // MouseDown Event Controller
-
-
-  var onTriggerMouseDown = function onTriggerMouseDown(e, type) {
+  };
+  // MouseDown Event Controller
+  const onTriggerMouseDown = (e, type) => {
     if (e.button !== 0 && !isMobile) return; // Отменить обработку, если нажата не левая кнопка мыши
-
     setMovingTrigger(e.target);
     setMovingTriggerType(type);
     setIsTriggerMoved(true); // Установить флаг движения в true при клике
   };
-
-  var onTriggerMove = function onTriggerMove(e) {
+  const onTriggerMove = e => {
     var _e$touches;
-
     if (!isMobile) {
       e.preventDefault();
       e.stopPropagation();
     }
-
     if (!isTriggerMoved) setIsTriggerMoved(true);
     if (!movingTrigger) return false;
-
-    var _ref2 = isMobile ? e === null || e === void 0 ? void 0 : (_e$touches = e.touches) === null || _e$touches === void 0 ? void 0 : _e$touches[0] : e,
-        x = _ref2.clientX;
-
-    var _ref3 = (movingTrigger === null || movingTrigger === void 0 ? void 0 : movingTrigger.getBoundingClientRect()) || {},
-        _ref3$width = _ref3.width,
-        triggerWidth = _ref3$width === void 0 ? 16 : _ref3$width;
-
+    let {
+      clientX: x
+    } = isMobile ? e === null || e === void 0 || (_e$touches = e.touches) === null || _e$touches === void 0 ? void 0 : _e$touches[0] : e;
+    const {
+      width: triggerWidth = 16
+    } = (movingTrigger === null || movingTrigger === void 0 ? void 0 : movingTrigger.getBoundingClientRect()) || {};
     if (x < trackPosition || x > trackPosition + trackWidth + triggerWidth) return false;
     x -= triggerWidth / 2;
     onRangeChange(movingTriggerType, getPointsByX(x));
   };
-
-  var onTriggerMoveEnd = function onTriggerMoveEnd() {
+  const onTriggerMoveEnd = () => {
     setMovingTrigger(null);
     setMovingTriggerType(null);
     setIsTriggerMoved(false);
   };
-
-  var onRangeInputFocus = function onRangeInputFocus(e, type) {
-    setTimeout(function () {
-      return setIsInputFocused(type, true);
-    }, 1);
+  const onRangeInputFocus = (e, type) => {
+    setTimeout(() => setIsInputFocused(type, true), 1);
   };
-
-  var onRangeInputBlur = function onRangeInputBlur(e, type) {
+  const onRangeInputBlur = (e, type) => {
     setIsInputFocused(type, false);
-    onRangeChange(type, type === 'from' ? from : to);
+    onRangeChange(type, type === "from" ? from : to);
   };
-
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     var _value$from2, _value$to2;
-
-    onRangeChange('from', (_value$from2 = value === null || value === void 0 ? void 0 : value.from) !== null && _value$from2 !== void 0 ? _value$from2 : max);
-    onRangeChange('to', (_value$to2 = value === null || value === void 0 ? void 0 : value.to) !== null && _value$to2 !== void 0 ? _value$to2 : min);
-  }, []); /// MouseUp Event Controller
-
-  (0, _react.useEffect)(function () {
-    document.addEventListener('mouseup', onTriggerMoveEnd);
-    return function () {
-      document.removeEventListener('mouseup', onTriggerMoveEnd);
+    onRangeChange("from", (_value$from2 = value === null || value === void 0 ? void 0 : value.from) !== null && _value$from2 !== void 0 ? _value$from2 : max);
+    onRangeChange("to", (_value$to2 = value === null || value === void 0 ? void 0 : value.to) !== null && _value$to2 !== void 0 ? _value$to2 : min);
+  }, []);
+
+  /// MouseUp Event Controller
+  (0, _react.useEffect)(() => {
+    document.addEventListener("mouseup", onTriggerMoveEnd);
+    return () => {
+      document.removeEventListener("mouseup", onTriggerMoveEnd);
     };
-  }, []); // MouseMove Event Controller
+  }, []);
 
-  (0, _react.useEffect)(function () {
+  // MouseMove Event Controller
+  (0, _react.useEffect)(() => {
     // Прекратить обработку, если нет активного триггера или не было движения
     if (!movingTrigger || !isTriggerMoved) return;
-
-    var handleMouseMove = function handleMouseMove(e) {
+    const handleMouseMove = e => {
       onTriggerMove(e);
     };
-
-    document.addEventListener('mousemove', handleMouseMove);
-    return function () {
-      document.removeEventListener('mousemove', handleMouseMove);
+    document.addEventListener("mousemove", handleMouseMove);
+    return () => {
+      document.removeEventListener("mousemove", handleMouseMove);
     };
   }, [movingTrigger, isTriggerMoved]);
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     if (movingController) {
-      document.addEventListener('mousemove', onTriggerMove, {
+      document.addEventListener("mousemove", onTriggerMove, {
         signal: movingController === null || movingController === void 0 ? void 0 : movingController.signal
       });
     }
   }, [movingController]);
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     setFrezeedValues(null);
   }, [isTriggerMoved]);
-  (0, _react.useEffect)(function () {
-    if (Object.values(isInputsFocused).every(function (v) {
-      return !v;
-    }) && !isTriggerMoved) onChange({
-      from: from,
-      to: to
+  (0, _react.useEffect)(() => {
+    if (Object.values(isInputsFocused).every(v => !v) && !isTriggerMoved) onChange({
+      from,
+      to
     });
     if (isTriggerMoved) setFrezeedValues({
-      from: from,
-      to: to
+      from,
+      to
     });
   }, [from, to, isInputsFocused, isTriggerMoved]);
-  (0, _react.useLayoutEffect)(function () {
+  (0, _react.useLayoutEffect)(() => {
     setFrom(value.from);
     setTo(value.to);
   }, [value]);
-  (0, _react.useLayoutEffect)(function () {
-    var _trackRef$current, _fromTriggerRef$curre, _fromTriggerRef$curre2, _toTriggerRef$current, _toTriggerRef$current2;
-
-    var _ref4 = (trackRef === null || trackRef === void 0 ? void 0 : (_trackRef$current = trackRef.current) === null || _trackRef$current === void 0 ? void 0 : _trackRef$current.getBoundingClientRect()) || {},
-        width = _ref4.width,
-        x = _ref4.x;
-
-    width -= (fromTriggerRef === null || fromTriggerRef === void 0 ? void 0 : (_fromTriggerRef$curre = fromTriggerRef.current) === null || _fromTriggerRef$curre === void 0 ? void 0 : (_fromTriggerRef$curre2 = _fromTriggerRef$curre.getBoundingClientRect()) === null || _fromTriggerRef$curre2 === void 0 ? void 0 : _fromTriggerRef$curre2.width) || (toTriggerRef === null || toTriggerRef === void 0 ? void 0 : (_toTriggerRef$current = toTriggerRef.current) === null || _toTriggerRef$current === void 0 ? void 0 : (_toTriggerRef$current2 = _toTriggerRef$current.getBoundingClientRect()) === null || _toTriggerRef$current2 === void 0 ? void 0 : _toTriggerRef$current2.width);
+  (0, _react.useLayoutEffect)(() => {
+    var _trackRef$current, _fromTriggerRef$curre, _toTriggerRef$current;
+    let {
+      width,
+      x
+    } = (trackRef === null || trackRef === void 0 || (_trackRef$current = trackRef.current) === null || _trackRef$current === void 0 ? void 0 : _trackRef$current.getBoundingClientRect()) || {};
+    width -= (fromTriggerRef === null || fromTriggerRef === void 0 || (_fromTriggerRef$curre = fromTriggerRef.current) === null || _fromTriggerRef$curre === void 0 || (_fromTriggerRef$curre = _fromTriggerRef$curre.getBoundingClientRect()) === null || _fromTriggerRef$curre === void 0 ? void 0 : _fromTriggerRef$curre.width) || (toTriggerRef === null || toTriggerRef === void 0 || (_toTriggerRef$current = toTriggerRef.current) === null || _toTriggerRef$current === void 0 || (_toTriggerRef$current = _toTriggerRef$current.getBoundingClientRect()) === null || _toTriggerRef$current === void 0 ? void 0 : _toTriggerRef$current.width);
     setPointsPerPx(countPointsPerPx(width));
     setTrackWidth(width);
     setTrackPosition(x);
   }, [trackRef]);
-  (0, _react.useEffect)(function () {
-    if (Object.values(isInputsFocused).every(function (v) {
-      return !v;
-    })) {
+  (0, _react.useEffect)(() => {
+    if (Object.values(isInputsFocused).every(v => !v)) {
       setFrezeedValues(false);
     } else {
       setFrezeedValues({
-        from: from,
-        to: to
+        from,
+        to
       });
     }
   }, [isInputsFocused]);
-
-  var renderLabel = function renderLabel() {
+  const renderLabel = () => {
     return /*#__PURE__*/_react.default.createElement("div", {
       className: "range-slider__header__label"
     }, label, required && /*#__PURE__*/_react.default.createElement("span", {
       className: "label_isRequired"
     }, "*"));
   };
-
-  var renderSelectedRange = function renderSelectedRange() {
+  const renderSelectedRange = () => {
     return /*#__PURE__*/_react.default.createElement("div", {
       className: "range-slider__header__selected-range"
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: "range-slider__header__selected-range--text"
-    }, "from ", isUseBitPoints ? (0, _fieldValueFormatters.formatToAddBitDepthPoints)(fromValue) : fromValue, " to ", isUseBitPoints ? (0, _fieldValueFormatters.formatToAddBitDepthPoints)(toValue) : toValue, rangeSymbol, unit), /*#__PURE__*/_react.default.createElement("div", {
+    }, "from ", isUseBitPoints ? (0, _fieldValueFormatters.formatToAddBitDepthPoints)(fromValue) : fromValue, " to", " ", isUseBitPoints ? (0, _fieldValueFormatters.formatToAddBitDepthPoints)(toValue) : toValue, rangeSymbol, unit), /*#__PURE__*/_react.default.createElement("div", {
       className: "range-slider__header__selected-range--reset",
       onClick: resetRange
     }, /*#__PURE__*/_react.default.createElement(_reactFeather.X, null)));
   };
-
-  var renderHeader = function renderHeader() {
+  const renderHeader = () => {
     return /*#__PURE__*/_react.default.createElement("div", {
       className: "range-slider__header"
     }, renderLabel(), min !== fromValue || max !== toValue ? renderSelectedRange() : null);
   };
-
-  var renderInputs = function renderInputs() {
+  const renderInputs = () => {
     return /*#__PURE__*/_react.default.createElement("div", {
       className: "range-slider__inputs"
     }, /*#__PURE__*/_react.default.createElement("div", {
@@ -397,20 +260,14 @@ function RangeSlider(_ref) {
     }, /*#__PURE__*/_react.default.createElement(_Input.default, (0, _extends2.default)({
       "data-testid": "rangeSlider--input--".concat(testId, "--type-from"),
       value: from.toString(),
-      onFocus: function onFocus(e) {
-        return onRangeInputFocus(e, 'from');
-      },
-      onBlur: function onBlur(e) {
-        return onRangeInputBlur(e, 'from');
-      },
-      onChange: function onChange(value) {
-        return onRangeChange('from', value, false);
-      },
+      onFocus: e => onRangeInputFocus(e, "from"),
+      onBlur: e => onRangeInputBlur(e, "from"),
+      onChange: value => onRangeChange("from", value, false),
       onlyNumbers: {
-        type: 'float',
-        decimalPlaces: decimalPlaces,
-        min: min,
-        max: max
+        type: "float",
+        decimalPlaces,
+        min,
+        max
       },
       isPriceInput: isUseBitPoints
     }, _mobileKeyboardTypesPresets.NUMERIC_KEYBOARD))), /*#__PURE__*/_react.default.createElement("div", {
@@ -418,27 +275,20 @@ function RangeSlider(_ref) {
     }, /*#__PURE__*/_react.default.createElement(_Input.default, (0, _extends2.default)({
       "data-testid": "rangeSlider--input--".concat(testId, "--type-to"),
       value: to.toString(),
-      onFocus: function onFocus(e) {
-        return onRangeInputFocus(e, 'to');
-      },
-      onBlur: function onBlur(e) {
-        return onRangeInputBlur(e, 'to');
-      },
-      onChange: function onChange(value) {
-        return onRangeChange('to', value, false);
-      },
+      onFocus: e => onRangeInputFocus(e, "to"),
+      onBlur: e => onRangeInputBlur(e, "to"),
+      onChange: value => onRangeChange("to", value, false),
       onlyNumbers: {
-        type: 'float',
-        decimalPlaces: decimalPlaces,
-        min: min,
-        max: max
+        type: "float",
+        decimalPlaces,
+        min,
+        max
       },
       isPriceInput: isUseBitPoints
     }, _mobileKeyboardTypesPresets.NUMERIC_KEYBOARD))));
   };
-
-  var renderTrackRange = function renderTrackRange() {
-    var style = {
+  const renderTrackRange = () => {
+    const style = {
       width: "".concat(getRangeWidth(), "px"),
       left: "".concat(getRangeOffset(), "px")
     };
@@ -447,18 +297,16 @@ function RangeSlider(_ref) {
       style: style
     });
   };
-
-  var renderTrackTriggers = function renderTrackTriggers() {
-    var fromStyle = {
+  const renderTrackTriggers = () => {
+    const fromStyle = {
       left: "".concat(getTrackXByPoints(fromValue), "px")
     };
-    var toStyle = {
+    const toStyle = {
       left: "".concat(getTrackXByPoints(toValue), "px")
     };
-
-    var renderTrack = function renderTrack() {
+    const renderTrack = () => {
       return /*#__PURE__*/_react.default.createElement("div", {
-        className: (0, _classnames.default)('range-slider__track', {
+        className: (0, _classnames.default)("range-slider__track", {
           hidden: noTrack
         }),
         ref: trackRef
@@ -466,7 +314,6 @@ function RangeSlider(_ref) {
         className: "range-slider__track__line"
       }), renderTrackRange(), renderTrackTriggers());
     };
-
     return /*#__PURE__*/_react.default.createElement("div", {
       className: "range-slider__track__range-triggers"
     }, /*#__PURE__*/_react.default.createElement("div", {
@@ -474,37 +321,26 @@ function RangeSlider(_ref) {
       ref: fromTriggerRef,
       style: fromStyle,
       className: "range-slider__track__range-triggers--trigger range-slider__track__range-triggers--trigger-left",
-      onMouseDown: function onMouseDown(e) {
-        return !isMobile ? onTriggerMouseDown(e, 'from') : {};
-      },
-      onTouchStart: function onTouchStart(e) {
-        return onTriggerMouseDown(e, 'from');
-      },
+      onMouseDown: e => !isMobile ? onTriggerMouseDown(e, "from") : {},
+      onTouchStart: e => onTriggerMouseDown(e, "from"),
       onTouchMove: onTriggerMove,
       onTouchEnd: onTriggerMoveEnd,
-      onClick: function onClick() {} // DONT REMOVE! MOBILE WILL NOT WORK WITHOUT IT
-
+      onClick: () => {} // DONT REMOVE! MOBILE WILL NOT WORK WITHOUT IT
     }), /*#__PURE__*/_react.default.createElement("div", {
       "data-testid": "rangeSlider--track--".concat(testId, "--type-to"),
       ref: toTriggerRef,
       style: toStyle,
       className: "range-slider__track__range-triggers--trigger range-slider__track__range-triggers--trigger-right",
-      onMouseDown: function onMouseDown(e) {
-        return !isMobile ? onTriggerMouseDown(e, 'to') : {};
-      },
-      onTouchStart: function onTouchStart(e) {
-        return onTriggerMouseDown(e, 'to');
-      },
+      onMouseDown: e => !isMobile ? onTriggerMouseDown(e, "to") : {},
+      onTouchStart: e => onTriggerMouseDown(e, "to"),
       onTouchMove: onTriggerMove,
       onTouchEnd: onTriggerMoveEnd,
-      onClick: function onClick() {} // DONT REMOVE! MOBILE WILL NOT WORK WITHOUT IT
-
+      onClick: () => {} // DONT REMOVE! MOBILE WILL NOT WORK WITHOUT IT
     }));
   };
-
-  var renderTrack = function renderTrack() {
+  const renderTrack = () => {
     return /*#__PURE__*/_react.default.createElement("div", {
-      className: (0, _classnames.default)('range-slider__track', {
+      className: (0, _classnames.default)("range-slider__track", {
         hidden: noTrack
       }),
       ref: trackRef
@@ -512,7 +348,6 @@ function RangeSlider(_ref) {
       className: "range-slider__track__line"
     }), renderTrackRange(), renderTrackTriggers());
   };
-
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "range-slider"
   }, renderHeader(), renderInputs(), renderTrack());