intelicoreact 1.3.22 → 1.3.24

package/dist/Atomic/FormElements/RangeList/RangeList.scss

@@ -13,8 +13,8 @@
   --background-color: transparent;
   --labels-background-color: transparent;
   --inputs-background-color: transparent;
-  --tag-input-background-color: #FFF;
-  --values-background-color: #FFF;
+  --tag-input-background-color: #fff;
+  --values-background-color: #fff;
 
   width: 500px;
   height: fit-content;
@@ -23,10 +23,10 @@
 
   &__row {
     display: grid;
+    grid-template-columns: 1fr 1fr var(--button-size);
 
     width: 100%;
     height: 30px;
-    grid-template-columns: 1fr 1fr var(--button-size);
   }
 
   &__labels,
@@ -37,46 +37,46 @@
   &__labels {
     margin-bottom: 10px;
 
-    color: var(--labels-color);
-    background-color: var(--labels-background-color);
-
     font-family: inherit;
     font-size: var(--labels-font-size);
     font-weight: 400;
     font-style: inherit;
     line-height: 24px;
+
+    color: var(--labels-color);
+    background-color: var(--labels-background-color);
   }
 
   &__inputs {
     margin-bottom: 6px;
 
-    color: var(--inputs-color);
-    background-color: var(--inputs-background-color);
-
     font-family: inherit;
     font-size: var(--inputs-font-size);
     font-weight: 400;
     font-style: inherit;
     line-height: 24px;
 
+    color: var(--inputs-color);
+    background-color: var(--inputs-background-color);
+
     & input {
       background-color: var(--tag-input-background-color);
     }
   }
 
   &__values {
-    color: var(--values-color);
-    border-right: 1px solid var(--border-color);
-    border-bottom: 1px solid var(--border-color);
-    border-left: 1px solid var(--border-color);
-    background-color: var(--values-background-color);
-
     font-family: inherit;
     font-size: var(--values-font-size);
     font-weight: 400;
     font-style: inherit;
     line-height: 24px;
 
+    color: var(--values-color);
+    border-right: 1px solid var(--border-color);
+    border-bottom: 1px solid var(--border-color);
+    border-left: 1px solid var(--border-color);
+    background-color: var(--values-background-color);
+
     &_first-value {
       border-top: 1px solid var(--border-color);
     }
@@ -92,27 +92,27 @@
     &-label,
     &-input input,
     &-value {
-      color: inherit;
-
       font-family: inherit;
       font-size: inherit;
       font-weight: inherit;
       font-style: inherit;
       line-height: inherit;
+
+      color: inherit;
     }
 
     &-label {
       display: flex;
-      align-items: center;
       flex-flow: row nowrap;
       justify-content: flex-start;
+      align-items: center;
     }
 
     &-value {
       display: flex;
-      align-items: center;
       flex-flow: row nowrap;
       justify-content: flex-start;
+      align-items: center;
 
       padding: 0 7.5px;
 
@@ -121,9 +121,9 @@
 
     &-action {
       display: flex;
-      align-items: center;
       flex-flow: row nowrap;
       justify-content: center;
+      align-items: center;
 
       cursor: pointer;
 
@@ -137,13 +137,13 @@
     margin-bottom: 5px;
     margin-left: 5px;
 
-    color: #F06D8D;
-
     font-family: inherit;
     font-size: 10px;
     font-weight: 400;
     font-style: normal;
     line-height: normal;
+
+    color: #f06d8d;
   }
 
   &_disabled {
@@ -154,9 +154,9 @@
 
   &__null-value {
     display: flex;
-    align-items: center;
     flex-flow: row nowrap;
     justify-content: center;
+    align-items: center;
 
     border: none;
   }

package/dist/Atomic/FormElements/RangeList/partial/AnyOuterClass.scss

@@ -1,15 +1,16 @@
 // @import url('https://fonts.googleapis.com/css2?family=Palette+Mosaic&family=Roboto:wght@300;400;500&display=swap');
+
 @import "https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap";
 
 .any-outer-class__range-list {
-  --border-color: #F4F7F9;
+  --border-color: #f4f7f9;
   --labels-font-size: 12px;
   --inputs-font-size: 13px;
   --values-font-size: 13px;
   --button-text-font-size: 13px;
-  --labels-color: #1E1E2D;
-  --inputs-color: #1E1E2D;
-  --values-color: #1E1E2D;
+  --labels-color: #1e1e2d;
+  --inputs-color: #1e1e2d;
+  --values-color: #1e1e2d;
   // font-family: 'Palette Mosaic', cursive;
 
   font-family: Roboto, sans-serif;

package/dist/Atomic/FormElements/RangeList/partial/RangeListRow.js

@@ -8,7 +8,7 @@ exports.default = exports.RangeListCell = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _reactFeather = require("react-feather");
-const RC = 'range-list';
+const RC = "range-list";
 const RangeListCell = _ref => {
   let {
     children,

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

@@ -7,11 +7,11 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = RangeSlider;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
-var _reactFeather = require("react-feather");
 var _classnames = _interopRequireDefault(require("classnames"));
-var _useIsMobile = _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(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -32,8 +32,8 @@ function RangeSlider(_ref) {
       from: min,
       to: max
     },
-    unit = '',
-    label = '',
+    unit = "",
+    label = "",
     isUseBitPoints = true,
     onChange = () => {}
   } = _ref;
@@ -46,7 +46,7 @@ function RangeSlider(_ref) {
   const fromTriggerRef = (0, _react.useRef)(0);
   const toTriggerRef = (0, _react.useRef)(0);
   const prepareValue = value => {
-    return parseInt(parseFloat(value) * 10 ** precision) / 10 ** precision;
+    return parseInt(parseFloat(value) * 10 ** precision, 10) / 10 ** precision;
   };
   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));
@@ -98,7 +98,7 @@ function RangeSlider(_ref) {
     if (validate) value = prepareValue(value);
     if (isNaN(value)) value = 0;
     switch (type) {
-      case 'from':
+      case "from":
         if (validate) {
           if (value < min) {
             value = min;
@@ -109,7 +109,7 @@ function RangeSlider(_ref) {
         }
         validate ? setFrom(value) : setFromValue(value);
         break;
-      case 'to':
+      case "to":
         if (validate) {
           if (value > max) {
             value = max;
@@ -157,19 +157,19 @@ function RangeSlider(_ref) {
   };
   const onRangeInputBlur = (e, type) => {
     setIsInputFocused(type, false);
-    onRangeChange(type, type === 'from' ? from : to);
+    onRangeChange(type, type === "from" ? from : to);
   };
   (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);
+    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);
+    document.addEventListener("mouseup", onTriggerMoveEnd);
     return () => {
-      document.removeEventListener('mouseup', onTriggerMoveEnd);
+      document.removeEventListener("mouseup", onTriggerMoveEnd);
     };
   }, []);
 
@@ -180,14 +180,14 @@ function RangeSlider(_ref) {
     const handleMouseMove = e => {
       onTriggerMove(e);
     };
-    document.addEventListener('mousemove', handleMouseMove);
+    document.addEventListener("mousemove", handleMouseMove);
     return () => {
-      document.removeEventListener('mousemove', handleMouseMove);
+      document.removeEventListener("mousemove", handleMouseMove);
     };
   }, [movingTrigger, isTriggerMoved]);
   (0, _react.useEffect)(() => {
     if (movingController) {
-      document.addEventListener('mousemove', onTriggerMove, {
+      document.addEventListener("mousemove", onTriggerMove, {
         signal: movingController === null || movingController === void 0 ? void 0 : movingController.signal
       });
     }
@@ -242,7 +242,7 @@ function RangeSlider(_ref) {
       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)));
@@ -260,11 +260,11 @@ function RangeSlider(_ref) {
     }, /*#__PURE__*/_react.default.createElement(_Input.default, (0, _extends2.default)({
       "data-testid": "rangeSlider--input--".concat(testId, "--type-from"),
       value: from.toString(),
-      onFocus: e => onRangeInputFocus(e, 'from'),
-      onBlur: e => onRangeInputBlur(e, 'from'),
-      onChange: value => onRangeChange('from', value, false),
+      onFocus: e => onRangeInputFocus(e, "from"),
+      onBlur: e => onRangeInputBlur(e, "from"),
+      onChange: value => onRangeChange("from", value, false),
       onlyNumbers: {
-        type: 'float',
+        type: "float",
         decimalPlaces,
         min,
         max
@@ -275,11 +275,11 @@ function RangeSlider(_ref) {
     }, /*#__PURE__*/_react.default.createElement(_Input.default, (0, _extends2.default)({
       "data-testid": "rangeSlider--input--".concat(testId, "--type-to"),
       value: to.toString(),
-      onFocus: e => onRangeInputFocus(e, 'to'),
-      onBlur: e => onRangeInputBlur(e, 'to'),
-      onChange: value => onRangeChange('to', value, false),
+      onFocus: e => onRangeInputFocus(e, "to"),
+      onBlur: e => onRangeInputBlur(e, "to"),
+      onChange: value => onRangeChange("to", value, false),
       onlyNumbers: {
-        type: 'float',
+        type: "float",
         decimalPlaces,
         min,
         max
@@ -306,7 +306,7 @@ function RangeSlider(_ref) {
     };
     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
@@ -321,8 +321,8 @@ function RangeSlider(_ref) {
       ref: fromTriggerRef,
       style: fromStyle,
       className: "range-slider__track__range-triggers--trigger range-slider__track__range-triggers--trigger-left",
-      onMouseDown: e => !isMobile ? onTriggerMouseDown(e, 'from') : {},
-      onTouchStart: e => onTriggerMouseDown(e, 'from'),
+      onMouseDown: e => !isMobile ? onTriggerMouseDown(e, "from") : {},
+      onTouchStart: e => onTriggerMouseDown(e, "from"),
       onTouchMove: onTriggerMove,
       onTouchEnd: onTriggerMoveEnd,
       onClick: () => {} // DONT REMOVE! MOBILE WILL NOT WORK WITHOUT IT
@@ -331,8 +331,8 @@ function RangeSlider(_ref) {
       ref: toTriggerRef,
       style: toStyle,
       className: "range-slider__track__range-triggers--trigger range-slider__track__range-triggers--trigger-right",
-      onMouseDown: e => !isMobile ? onTriggerMouseDown(e, 'to') : {},
-      onTouchStart: e => onTriggerMouseDown(e, 'to'),
+      onMouseDown: e => !isMobile ? onTriggerMouseDown(e, "to") : {},
+      onTouchStart: e => onTriggerMouseDown(e, "to"),
       onTouchMove: onTriggerMove,
       onTouchEnd: onTriggerMoveEnd,
       onClick: () => {} // DONT REMOVE! MOBILE WILL NOT WORK WITHOUT IT
@@ -340,7 +340,7 @@ function RangeSlider(_ref) {
   };
   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

package/dist/Atomic/FormElements/RangeSlider/RangeSlider.scss

@@ -14,15 +14,14 @@
     margin-bottom: 2px;
 
     &__label {
-      letter-spacing: 0.2px;
-
-      color: #757F8C;
-
       font-family: Sarabun, sans-serif;
       font-size: 12px;
       font-weight: 500;
       font-style: normal;
       line-height: 18px;
+      letter-spacing: 0.2px;
+
+      color: #757f8c;
     }
 
     &__selected-range {
@@ -32,20 +31,19 @@
       padding: 0 4px 0 8px;
 
       border-radius: 16px;
-      background: #EAF2FF;
+      background: #eaf2ff;
 
       &--text {
         margin-right: 2px;
 
-        letter-spacing: 0.2px;
-
-        color: #3B414B;
-
         font-family: Sarabun, sans-serif;
         font-size: 12px;
         font-weight: 400;
         font-style: normal;
         line-height: 18px;
+        letter-spacing: 0.2px;
+
+        color: #3b414b;
       }
 
       &--reset {
@@ -54,8 +52,8 @@
 
         cursor: pointer;
 
-        color: #9AA0B9;
-        border-left: 1px solid #CDE1FF;
+        color: #9aa0b9;
+        border-left: 1px solid #cde1ff;
 
         svg {
           width: 16px;
@@ -80,15 +78,14 @@
       box-sizing: border-box;
       height: auto;
       max-height: 40px;
-
       padding: 9px 16px;
 
-      border: 1px solid #E1E8F1;
+      border: 1px solid #e1e8f1;
       border-radius: 6px;
-      background: #FFF;
+      background: #fff;
 
       &_focus {
-        border-color: #166C92;
+        border-color: #166c92;
         filter: none;
       }
 
@@ -96,15 +93,14 @@
         box-sizing: border-box;
         padding: 0;
 
-        letter-spacing: 0.2px;
-
-        color: #171D33;
-
         font-family: Sarabun, sans-serif;
         font-size: 16px;
         font-weight: 500;
         font-style: normal;
         line-height: 22px;
+        letter-spacing: 0.2px;
+
+        color: #171d33;
       }
     }
   }
@@ -128,7 +124,7 @@
       height: 4px;
 
       border-radius: 4px;
-      background: #D6D9E4;
+      background: #d6d9e4;
     }
 
     &__range {
@@ -140,8 +136,7 @@
       height: 4px;
 
       border-radius: 4px;
-
-      background: #1F7499;
+      background: #1f7499;
 
       &-triggers {
         position: absolute;
@@ -159,9 +154,9 @@
 
           cursor: move;
 
-          border: 1px solid #1F7499;
+          border: 1px solid #1f7499;
           border-radius: 50%;
-          background: #FFF;
+          background: #fff;
           box-shadow: 0 4px 26px rgb(0 67 96 / 10%);
 
           &-left {

package/dist/Atomic/FormElements/RangeSlider/RangeSlider.stories.scss

@@ -5,8 +5,8 @@
   padding: 4px 12px;
 
   border-radius: 8px;
-  background: #F7F7F7;
-  box-shadow: 0 0 8px 2px #E9E7E7;
+  background: #f7f7f7;
+  box-shadow: 0 0 8px 2px #e9e7e7;
 
   h4 {
     margin: 0;
@@ -14,17 +14,17 @@
     padding: 0;
     padding-bottom: 8px;
 
-    color: #1F7499;
-    border-bottom: 1px solid #E9E7E7;
-
     font-size: 14px;
     line-height: 1;
+
+    color: #1f7499;
+    border-bottom: 1px solid #e9e7e7;
   }
 
   code {
-    color: #171D33;
-
     font-size: 12px;
     line-height: 16px;
+
+    color: #171d33;
   }
 }

package/dist/Atomic/FormElements/RangeSlider2/RangeSlider.stories.scss

@@ -5,8 +5,8 @@
   padding: 4px 12px;
 
   border-radius: 8px;
-  background: #F7F7F7;
-  box-shadow: 0 0 8px 2px #E9E7E7;
+  background: #f7f7f7;
+  box-shadow: 0 0 8px 2px #e9e7e7;
 
   h4 {
     margin: 0;
@@ -14,21 +14,21 @@
     padding: 0;
     padding-bottom: 8px;
 
-    color: #1F7499;
-    border-bottom: 1px solid #E9E7E7;
-
     font-size: 14px;
     line-height: 1;
+
+    color: #1f7499;
+    border-bottom: 1px solid #e9e7e7;
   }
 
   code {
-    color: #171D33;
-
     font-size: 12px;
     line-height: 16px;
+
+    color: #171d33;
   }
 }
 
 .range-slider2 {
-  max-width: 680px!important;
+  max-width: 680px !important;
 }

package/dist/Atomic/FormElements/RangeSlider2/RangeSlider2.js

@@ -6,13 +6,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = RangeSlider2;
 var _react = _interopRequireWildcard(require("react"));
-var _reactFeather = require("react-feather");
 var _classnames = _interopRequireDefault(require("classnames"));
-require("./RangeSlider2.scss");
+var _reactFeather = require("react-feather");
 var _utils = require("../../../Functions/utils");
+require("./RangeSlider2.scss");
 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; }
-const COMPONENT_CLASS = 'range-slider2';
+const COMPONENT_CLASS = "range-slider2";
 const {
   LEFT_COLLISSION,
   RIGHT_COLLISION,
@@ -32,9 +32,9 @@ const {
   ASSIGN_TO_RIGHT: 1
 });
 const POINT_VALUE_TYPES = Object.freeze({
-  FROM: 'from',
-  TO: 'to',
-  BOTH: 'both'
+  FROM: "from",
+  TO: "to",
+  BOTH: "both"
 });
 function RangeSlider2(_ref) {
   let {
@@ -59,7 +59,7 @@ function RangeSlider2(_ref) {
   const [trackPosition, setTrackPosition] = (0, _react.useState)(0);
   const [mouseTrackPosition, setMouseTrackPosition] = (0, _react.useState)(0);
   const prepareValue = value => {
-    return parseInt(parseFloat(value) * 10 ** precision) / 10 ** precision;
+    return parseInt(parseFloat(value) * 10 ** precision, 10) / 10 ** precision;
   };
   const [ranges, setRanges] = (0, _react.useState)(value);
   const addRange = _ref2 => {
@@ -416,7 +416,7 @@ function RangeSlider2(_ref) {
       return false;
     }
     if (!isTriggerMoved) setIsTriggerMoved(true);
-    let {
+    const {
       clientX: x
     } = e;
     const {
@@ -436,9 +436,9 @@ function RangeSlider2(_ref) {
   // USE EFFECT'S //
   // MouseUp Event Controller
   (0, _react.useEffect)(() => {
-    document.addEventListener('mouseup', resetMovingTrigger);
+    document.addEventListener("mouseup", resetMovingTrigger);
     return () => {
-      document.removeEventListener('mouseup', resetMovingTrigger);
+      document.removeEventListener("mouseup", resetMovingTrigger);
     };
   }, []);
   // MouseMove Event Controller
@@ -451,19 +451,19 @@ function RangeSlider2(_ref) {
     } else if (movingTrigger && !isTriggerMoved) {
       setMovingController(new AbortController());
     }
-    const body = document.getElementsByTagName('body')[0];
-    (_body$classList = body.classList) === null || _body$classList === void 0 || _body$classList[movingTrigger ? 'add' : 'remove']('moving-cursor');
+    const body = document.getElementsByTagName("body")[0];
+    (_body$classList = body.classList) === null || _body$classList === void 0 || _body$classList[movingTrigger ? "add" : "remove"]("moving-cursor");
   }, [movingTrigger]);
   (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.useLayoutEffect)(() => {
     var _trackRef$current;
-    let {
+    const {
       width,
       x
     } = (trackRef === null || trackRef === void 0 || (_trackRef$current = trackRef.current) === null || _trackRef$current === void 0 ? void 0 : _trackRef$current.getBoundingClientRect()) || {};
@@ -536,18 +536,18 @@ function RangeSlider2(_ref) {
       isBothCollision,
       className
     } = _ref14;
-    const pieces = parseInt((max - min) / minRange);
+    const pieces = parseInt((max - min) / minRange, 10);
     const {
       width: trackWidth
     } = (_trackRef$current$get = trackRef === null || trackRef === void 0 || (_trackRef$current2 = trackRef.current) === null || _trackRef$current2 === void 0 ? void 0 : _trackRef$current2.getBoundingClientRect()) !== null && _trackRef$current$get !== void 0 ? _trackRef$current$get : {};
     const collisionWidth = trackWidth / pieces - 4;
     const width = isCollisionVisible ? isBothCollision ? collisionWidth * 2 : isLeftCollision || isRightCollision ? collisionWidth : 0 : 0;
     return /*#__PURE__*/_react.default.createElement("div", {
-      className: (0, _classnames.default)('collision', className, {
-        'collision--visible': isCollisionVisible,
-        'collision--left': isLeftCollision && !isBothCollision,
-        'collision--right': isRightCollision && !isBothCollision,
-        'collision--both': isBothCollision
+      className: (0, _classnames.default)("collision", className, {
+        "collision--visible": isCollisionVisible,
+        "collision--left": isLeftCollision && !isBothCollision,
+        "collision--right": isRightCollision && !isBothCollision,
+        "collision--both": isBothCollision
       }),
       style: {
         width
@@ -648,7 +648,7 @@ function RangeSlider2(_ref) {
     return /*#__PURE__*/_react.default.createElement("div", {
       key: "".concat(COMPONENT_CLASS, "__track__range-triggers--trigger-").concat(triggerIndex),
       style: {
-        left: getTrackXByScore(triggerScore).toString().concat('px')
+        left: getTrackXByScore(triggerScore).toString().concat("px")
       },
       className: (0, _classnames.default)("".concat(COMPONENT_CLASS, "__track__range-triggers--trigger"), {
         ["".concat(COMPONENT_CLASS, "__track__range-triggers--trigger__moving")]: isCurrentTriggerMoving,
@@ -718,7 +718,7 @@ function RangeSlider2(_ref) {
         className: "".concat(COMPONENT_CLASS, "__track__line__dividers--item")
       });
     };
-    const dividersCount = parseInt((max - min) / dividersRange);
+    const dividersCount = parseInt((max - min) / dividersRange, 10);
     const dividers = [];
     for (let i = 0; i < dividersCount; ++i) dividers.push(renderTrackDivider(i));
     return /*#__PURE__*/_react.default.createElement("div", {