intelicoreact 0.2.30 → 0.2.33

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

@@ -134,21 +134,25 @@ function RangeSlider(_ref) {
   };
 
   var getRangeWidth = function getRangeWidth() {
-    return (to - from) * 100 / (max - min);
+    return getTrackXByPoints(to) - getTrackXByPoints(from);
   };
 
   var getRangeOffset = function getRangeOffset() {
-    return (from - min) * 100 / (max - min);
+    return getTrackXByPoints(from);
   };
 
   var getXByPoints = function getXByPoints(pts) {
-    return pts / pointsPerPx + trackPosition;
+    return (pts - min) / pointsPerPx + trackPosition;
   };
 
   var getPointsByX = function getPointsByX(x) {
     return (x - trackPosition) * pointsPerPx + min;
   };
 
+  var getTrackXByPoints = function getTrackXByPoints(pts) {
+    return (pts - min) / pointsPerPx;
+  };
+
   var prepareValue = function prepareValue(value) {
     return parseInt(parseFloat(value) * Math.pow(10, precision)) / Math.pow(10, precision);
   };
@@ -160,15 +164,35 @@ function RangeSlider(_ref) {
 
     switch (type) {
       case 'from':
-        if (value < min && validate) setFrom(min); // else if (value > max - extremumRange && extremumRange > minRange && validate) setFrom(max - extremumRange);
-        // else if (value > to - extremumRange && extremumRange > minRange && validate) setFrom(to - extremumRange);
-        else if (value > to - minRange && minRange > extremumRange && validate) setFrom(to - minRange);else setFrom(value);
+        if (validate) {
+          if (value < min) {
+            setFrom(min);
+            return;
+          }
+
+          if (value > to - minRange) {
+            setFrom(to - minRange);
+            return;
+          }
+        }
+
+        setFrom(value);
         break;
 
       case 'to':
-        if (value > max && validate) setTo(max); // else if (value < min + extremumRange && extremumRange > minRange && validate) setTo(min+ + extremumRange);
-        // else if (value < from + extremumRange && extremumRange > minRange && validate) setTo(from + extremumRange);
-        else if (value < from + minRange && minRange > extremumRange && validate) setTo(from + minRange);else setTo(value);
+        if (validate) {
+          if (value > max) {
+            setTo(max);
+            return;
+          }
+
+          if (value < from + minRange) {
+            setTo(from + minRange);
+            return;
+          }
+        }
+
+        setTo(value);
         break;
     }
   };
@@ -184,13 +208,13 @@ function RangeSlider(_ref) {
     if (!isTriggerMoved) setIsTriggerMoved(true);
     if (!movingTrigger) return false;
     var x = e.clientX;
-    if (x < trackPosition || x > trackPosition + trackWidth) return false;
 
     var _movingTrigger$getBou = movingTrigger === null || movingTrigger === void 0 ? void 0 : movingTrigger.getBoundingClientRect(),
         _movingTrigger$getBou2 = _movingTrigger$getBou.width,
         triggerWidth = _movingTrigger$getBou2 === void 0 ? 16 : _movingTrigger$getBou2;
 
-    x = movingTriggerType === 'from' ? x - triggerWidth / 2 : x + triggerWidth / 2;
+    if (x < trackPosition || x > trackPosition + trackWidth + triggerWidth) return false;
+    x -= triggerWidth / 2;
     onRangeChange(movingTriggerType, getPointsByX(x));
   };
 
@@ -206,35 +230,23 @@ function RangeSlider(_ref) {
   };
 
   (0, _react.useLayoutEffect)(function () {
-    var _trackRef$current;
+    var _trackRef$current, _fromTriggerRef$curre, _fromTriggerRef$curre2, _toTriggerRef$current, _toTriggerRef$current2;
 
     var _trackRef$current$get = trackRef === null || trackRef === void 0 ? void 0 : (_trackRef$current = trackRef.current) === null || _trackRef$current === void 0 ? void 0 : _trackRef$current.getBoundingClientRect(),
         width = _trackRef$current$get.width,
         x = _trackRef$current$get.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);
     setPointsPerPx(countPointsPerPx(width));
     setTrackWidth(width);
     setTrackPosition(x);
   }, [trackRef]);
-  (0, _react.useLayoutEffect)(function () {
-    var _fromTriggerRef$curre, _toTriggerRef$current;
-
-    var _ref2 = (fromTriggerRef === null || fromTriggerRef === void 0 ? void 0 : (_fromTriggerRef$curre = fromTriggerRef.current) === null || _fromTriggerRef$curre === void 0 ? void 0 : _fromTriggerRef$curre.getBoundingClientRect()) || {},
-        fromTriggerWidth = _ref2.width;
-
-    var _ref3 = (toTriggerRef === null || toTriggerRef === void 0 ? void 0 : (_toTriggerRef$current = toTriggerRef.current) === null || _toTriggerRef$current === void 0 ? void 0 : _toTriggerRef$current.getBoundingClientRect()) || {},
-        toTriggerWidth = _ref3.width;
-
-    setExtremumRange((fromTriggerWidth + toTriggerWidth) * pointsPerPx);
-    setExtremumWidth(fromTriggerWidth + toTriggerWidth);
-  }, [fromTriggerRef, toTriggerRef, pointsPerPx]);
   (0, _react.useEffect)(function () {
     var _value$from2, _value$to2;
 
-    if (extremumRange === 0) return null;
     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);
-  }, [extremumRange]); // MouseUp Event Controller
+  }, []); // MouseUp Event Controller
 
   (0, _react.useEffect)(function () {
     var resetMovingTrigger = function resetMovingTrigger() {
@@ -329,28 +341,35 @@ function RangeSlider(_ref) {
 
   var renderTrackRange = function renderTrackRange() {
     var style = {
-      width: getRangeWidth().toString().concat('%'),
-      left: getRangeOffset().toString().concat('%'),
-      minWidth: extremumWidth.toString().concat('px')
+      width: getRangeWidth().toString().concat('px'),
+      left: getRangeOffset().toString().concat('px')
     };
-    var extremumWidthPercent = extremumWidth * 100 / trackWidth;
-
-    if (getRangeOffset() + extremumWidthPercent >= 100) {
-      style.left = (100 - extremumWidthPercent).toString().concat('%');
-    }
-
     return /*#__PURE__*/_react.default.createElement("div", {
       className: "range-slider__track__range",
       style: style
+    });
+  };
+
+  var renderTrackTriggers = function renderTrackTriggers() {
+    var fromStyle = {
+      left: getTrackXByPoints(from).toString().concat('px')
+    };
+    var toStyle = {
+      left: getTrackXByPoints(to).toString().concat('px')
+    };
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: "range-slider__track__range-triggers"
     }, /*#__PURE__*/_react.default.createElement("div", {
       ref: fromTriggerRef,
-      className: "range-slider__track__range--trigger",
+      style: fromStyle,
+      className: "range-slider__track__range-triggers--trigger range-slider__track__range-triggers--trigger-left",
       onMouseDown: function onMouseDown(e) {
         return onTriggerMouseDown(e, 'from');
       }
     }), /*#__PURE__*/_react.default.createElement("div", {
       ref: toTriggerRef,
-      className: "range-slider__track__range--trigger",
+      style: toStyle,
+      className: "range-slider__track__range-triggers--trigger range-slider__track__range-triggers--trigger-right",
       onMouseDown: function onMouseDown(e) {
         return onTriggerMouseDown(e, 'to');
       }
@@ -363,7 +382,7 @@ function RangeSlider(_ref) {
       ref: trackRef
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: "range-slider__track__line"
-    }), renderTrackRange());
+    }), renderTrackRange(), renderTrackTriggers());
   };
 
   var render = function render() {

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

@@ -100,6 +100,7 @@
     height: 16px;
     margin-top: 2px;
     position: relative;
+    padding: 0 8px;
 
     &__line {
       position: absolute;
@@ -107,6 +108,8 @@
       height: 4px;
       background: #d6d9e4;
       border-radius: 4px;
+      box-sizing: border-box;
+      left: 0;
     }
     &__range {
       position: relative;
@@ -117,24 +120,30 @@
       border-radius: 4px;
       justify-content: space-between;
 
-      &--trigger {
-        position: relative;
-        width: 16px;
-        height: 16px;
-        background: #ffffff;
-        border: 1px solid #1f7499;
-        box-shadow: 0px 4px 26px rgba(0, 67, 96, 0.1);
-        border-radius: 50%;
-        transform: translateY(-50%);
-        top: 50%;
-        box-sizing: border-box;
-        cursor: move;
-
-        &-left {
-          transform: translate(-50%, 0);
-        }
+      &-triggers {
+        width: 100%;
+        position: absolute;
 
-        &-right {
+        &--trigger {
+          z-index: 3;
+          position: absolute;
+          width: 16px;
+          height: 16px;
+          background: #ffffff;
+          border: 1px solid #1f7499;
+          box-shadow: 0px 4px 26px rgba(0, 67, 96, 0.1);
+          border-radius: 50%;
+          top: 50%;
+          box-sizing: border-box;
+          cursor: move;
+
+          &-left {
+            transform: translate(-50%, -50%);
+          }
+
+          &-right {
+            transform: translate(-50%, -50%);
+          }
         }
       }
     }
@@ -142,5 +151,5 @@
 }
 
 .moving-cursor {
-  cursor: move!important;
+  cursor: move !important;
 }

package/dist/Atomic/FormElements/SwitcherRadio/SwitcherRadio.js

@@ -7,6 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
 var _react = _interopRequireDefault(require("react"));
@@ -48,17 +50,13 @@ var SwitcherRadio = function SwitcherRadio(_ref) {
     return /*#__PURE__*/_react.default.createElement("div", {
       className: (0, _classnames.default)("".concat(RC, "__wrap"), (0, _defineProperty2.default)({}, "switcher-radio_".concat(direction), direction))
     }, options === null || options === void 0 ? void 0 : options.map(function (option) {
-      return /*#__PURE__*/_react.default.createElement(_RadioInput.default, {
-        key: option.id,
+      return /*#__PURE__*/_react.default.createElement(_RadioInput.default, (0, _extends2.default)({}, option, {
         className: "switcher-radio__radio",
-        value: option.value,
-        name: option.name,
         checked: safelyValue,
-        label: option.label,
         onChange: function onChange(val) {
           return _onChange(val);
         }
-      });
+      }));
     }));
   };
 

package/dist/Atomic/UI/AccordionTable/AccordionTable.js

@@ -106,8 +106,11 @@ var AccordionTable = function AccordionTable(_ref) {
     }, row.label)), /*#__PURE__*/_react.default.createElement("div", null, row.titleContent));
   };
 
+  (0, _react.useEffect)(function () {
+    setAccordions(rows);
+  }, [rows]);
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)('accordion-table')
+    className: (0, _classnames.default)('accordion-table', className)
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "accordion-table__header"
   }, header === null || header === void 0 ? void 0 : header.map(function (item) {

package/dist/Atomic/UI/NavLine/NavLine.js

@@ -216,18 +216,26 @@ var NavLine = function NavLine(_ref) {
   var onWheel = function onWheel(e) {
     e.preventDefault();
     e.stopPropagation();
-    var deltaY = e.deltaY;
-    deltaY > 0 ? pushScrollTask('next') : pushScrollTask('prev');
+    var deltaY = e.deltaY,
+        shiftKey = e.shiftKey;
+
+    if (shiftKey) {
+      if (deltaY > 0) pushScrollTask('next');else pushScrollTask('prev');
+    }
   };
 
   var onTabChange = function onTabChange(item) {
     onChange(item.tabId);
-  }; // useEffect(() => {
-  //   if (!wrapperRef?.current) return false;
-  //   wrapperRef?.current?.addEventListener("mousewheel", onWheel, { passive: false });
-  // }, [wrapperRef]);
-  // Count Total NavLine Items Width
+  };
 
+  (0, _react.useEffect)(function () {
+    var _wrapperRef$current;
+
+    if (!(wrapperRef !== null && wrapperRef !== void 0 && wrapperRef.current)) return false;
+    wrapperRef === null || wrapperRef === void 0 ? void 0 : (_wrapperRef$current = wrapperRef.current) === null || _wrapperRef$current === void 0 ? void 0 : _wrapperRef$current.addEventListener("mousewheel", onWheel, {
+      passive: false
+    });
+  }, [wrapperRef]); // Count Total NavLine Items Width
 
   (0, _react.useEffect)(function () {
     var _navLineItems$0$ref$c, _navLineItems$, _navLineItems$$ref, _navLineItems$$ref$cu;
@@ -251,9 +259,9 @@ var NavLine = function NavLine(_ref) {
   }, [navLineItems === null || navLineItems === void 0 ? void 0 : navLineItems.length]); // Count Wrapper Width
 
   (0, _react.useEffect)(function () {
-    var _wrapperRef$current$g, _wrapperRef$current, _wrapperRef$current$g2;
+    var _wrapperRef$current$g, _wrapperRef$current2, _wrapperRef$current2$;
 
-    setWrapperRefWidth((_wrapperRef$current$g = wrapperRef === null || wrapperRef === void 0 ? void 0 : (_wrapperRef$current = wrapperRef.current) === null || _wrapperRef$current === void 0 ? void 0 : (_wrapperRef$current$g2 = _wrapperRef$current.getBoundingClientRect()) === null || _wrapperRef$current$g2 === void 0 ? void 0 : _wrapperRef$current$g2.width) !== null && _wrapperRef$current$g !== void 0 ? _wrapperRef$current$g : 0);
+    setWrapperRefWidth((_wrapperRef$current$g = wrapperRef === null || wrapperRef === void 0 ? void 0 : (_wrapperRef$current2 = wrapperRef.current) === null || _wrapperRef$current2 === void 0 ? void 0 : (_wrapperRef$current2$ = _wrapperRef$current2.getBoundingClientRect()) === null || _wrapperRef$current2$ === void 0 ? void 0 : _wrapperRef$current2$.width) !== null && _wrapperRef$current$g !== void 0 ? _wrapperRef$current$g : 0);
   }, [wrapperRef]); //Init NavLine Items
 
   (0, _react.useEffect)(function () {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "intelicoreact",
-  "version": "0.2.30",
+  "version": "0.2.33",
   "description": "",
   "main": "dist/index.js",
   "files": [