@onesy/ui-react 1.0.163 → 1.0.165

package/Slider/Slider.js

@@ -433,28 +433,13 @@ const useStyle = (0, _styleReact.style)(theme => {
   name: 'onesy-Slider'
 });
 const Slider = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
-  var _String$split$;
+  var _theme$ui, _theme$ui2, _theme$elements, _theme$elements2, _theme$elements3, _theme$elements4, _String$split$;
   const theme = (0, _styleReact.useOnesyTheme)();
-  const props = _react.default.useMemo(() => {
-    var _theme$ui, _theme$ui2;
-    return _objectSpread(_objectSpread(_objectSpread({}, theme === null || theme === void 0 || (_theme$ui = theme.ui) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.elements) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.all) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.props) === null || _theme$ui === void 0 ? void 0 : _theme$ui.default), theme === null || theme === void 0 || (_theme$ui2 = theme.ui) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.elements) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.onesySlider) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
-  }, [props_]);
-  const IconButton = _react.default.useMemo(() => {
-    var _theme$elements;
-    return (theme === null || theme === void 0 || (_theme$elements = theme.elements) === null || _theme$elements === void 0 ? void 0 : _theme$elements.IconButton) || _IconButton.default;
-  }, [theme]);
-  const Tooltip = _react.default.useMemo(() => {
-    var _theme$elements2;
-    return (theme === null || theme === void 0 || (_theme$elements2 = theme.elements) === null || _theme$elements2 === void 0 ? void 0 : _theme$elements2.Tooltip) || _Tooltip.default;
-  }, [theme]);
-  const Zoom = _react.default.useMemo(() => {
-    var _theme$elements3;
-    return (theme === null || theme === void 0 || (_theme$elements3 = theme.elements) === null || _theme$elements3 === void 0 ? void 0 : _theme$elements3.Zoom) || _Zoom.default;
-  }, [theme]);
-  const Type = _react.default.useMemo(() => {
-    var _theme$elements4;
-    return (theme === null || theme === void 0 || (_theme$elements4 = theme.elements) === null || _theme$elements4 === void 0 ? void 0 : _theme$elements4.Type) || _Type.default;
-  }, [theme]);
+  const props = _objectSpread(_objectSpread(_objectSpread({}, theme === null || theme === void 0 || (_theme$ui = theme.ui) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.elements) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.all) === null || _theme$ui === void 0 || (_theme$ui = _theme$ui.props) === null || _theme$ui === void 0 ? void 0 : _theme$ui.default), theme === null || theme === void 0 || (_theme$ui2 = theme.ui) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.elements) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.onesySlider) === null || _theme$ui2 === void 0 || (_theme$ui2 = _theme$ui2.props) === null || _theme$ui2 === void 0 ? void 0 : _theme$ui2.default), props_);
+  const IconButton = (theme === null || theme === void 0 || (_theme$elements = theme.elements) === null || _theme$elements === void 0 ? void 0 : _theme$elements.IconButton) || _IconButton.default;
+  const Tooltip = (theme === null || theme === void 0 || (_theme$elements2 = theme.elements) === null || _theme$elements2 === void 0 ? void 0 : _theme$elements2.Tooltip) || _Tooltip.default;
+  const Zoom = (theme === null || theme === void 0 || (_theme$elements3 = theme.elements) === null || _theme$elements3 === void 0 ? void 0 : _theme$elements3.Zoom) || _Zoom.default;
+  const Type = (theme === null || theme === void 0 || (_theme$elements4 = theme.elements) === null || _theme$elements4 === void 0 ? void 0 : _theme$elements4.Type) || _Type.default;
   const {
       tonal = true,
       color: color_ = 'primary',
@@ -535,25 +520,25 @@ const Slider = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     let previous = (0, _utils.clamp)(+(value__ - value__ % precision).toFixed(valueDecimals), refs.min.current, refs.max.current);
     if (value__ < 0) previous -= precision;
     if (onlyMarks && (0, _utils.is)('array', marks)) {
-      const previousMark = marks.map(item => item.value).sort((a, b) => b - a).find(item => item <= value__);
+      const previousMark = marks.map(item_0 => item_0.value).sort((a_0, b_0) => b_0 - a_0).find(item_1 => item_1 <= value__);
       previous = previousMark !== undefined ? previousMark : refs.min.current;
     }
 
     // next value
     let next = (0, _utils.clamp)(+(previous + precision).toFixed(valueDecimals), refs.min.current, refs.max.current);
     if (onlyMarks && (0, _utils.is)('array', marks)) {
-      const nextMark = marks.map(item => item.value).sort((a, b) => a - b).find(item => item >= value__);
+      const nextMark = marks.map(item_2 => item_2.value).sort((a_1, b_1) => a_1 - b_1).find(item_3 => item_3 >= value__);
       next = nextMark !== undefined ? nextMark : refs.max.current;
     }
-    const valueNew = value__ < previous + (next - previous) / 2 ? previous : next;
+    const valueNew_0 = value__ < previous + (next - previous) / 2 ? previous : next;
     if (mouseDownButtonUpdate && (0, _utils.is)('array', refs.value.current)) {
-      const items = refs.value.current.map(item => Math.abs(valueNew - item));
+      const items = refs.value.current.map(item_4 => Math.abs(valueNew_0 - item_4));
       const minItem = Math.min(...items);
-      const index = items.findIndex(item => item === minItem);
+      const index = items.findIndex(item_5 => item_5 === minItem);
       setMouseDownButton(index);
       refs.mouseDownButton.current = index;
     }
-    return valueNew;
+    return valueNew_0;
   };
   _react.default.useEffect(() => {
     var _refs$root$current;
@@ -581,24 +566,24 @@ const Slider = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
         } = rect;
 
         // Value to the precision point value
-        const value__ = valuePrecision(orientation === 'horizontal' ? (x - rect.x) / width : 1 - (y - rect.y) / height);
-        const valueNew = (0, _utils.is)('array', refs.value.current) ? [...refs.value.current] : value__;
+        const value___0 = valuePrecision(orientation === 'horizontal' ? (x - rect.x) / width : 1 - (y - rect.y) / height);
+        const valueNew_1 = (0, _utils.is)('array', refs.value.current) ? [...refs.value.current] : value___0;
         if ((0, _utils.is)('array', refs.value.current)) {
-          let index = (0, _utils.is)('number', refs.mouseDownButton.current) ? refs.mouseDownButton.current : 0;
-          if (index > 0 && value__ < refs.value.current[index - 1]) {
-            index -= 1;
-            setMouseDownButton(index);
+          let index_0 = (0, _utils.is)('number', refs.mouseDownButton.current) ? refs.mouseDownButton.current : 0;
+          if (index_0 > 0 && value___0 < refs.value.current[index_0 - 1]) {
+            index_0 -= 1;
+            setMouseDownButton(index_0);
           }
-          if (index < refs.value.current.length - 1 && value__ > refs.value.current[index + 1]) {
-            index += 1;
-            setMouseDownButton(index);
+          if (index_0 < refs.value.current.length - 1 && value___0 > refs.value.current[index_0 + 1]) {
+            index_0 += 1;
+            setMouseDownButton(index_0);
           }
-          valueNew[index] = value__;
+          valueNew_1[index_0] = value___0;
         }
-        if (!(0, _utils.equalDeep)(valueNew, refs.value.current)) {
+        if (!(0, _utils.equalDeep)(valueNew_1, refs.value.current)) {
           // Inner controlled value
-          if (!props.hasOwnProperty('value')) setValue(valueNew);
-          if ((0, _utils.is)('function', onChange)) onChange(valueNew);
+          if (!props.hasOwnProperty('value')) setValue(valueNew_1);
+          if ((0, _utils.is)('function', onChange)) onChange(valueNew_1);
         }
       }
     };
@@ -622,98 +607,98 @@ const Slider = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
   _react.default.useEffect(() => {
     if (init && value_ !== value) setValue(value_);
   }, [value_]);
-  const move = _react.default.useCallback((x, y) => {
+  const move = (x_0, y_0) => {
     if (!disabled && !readOnly) {
-      const rect = refs.root.current.getBoundingClientRect();
+      const rect_0 = refs.root.current.getBoundingClientRect();
       const {
-        width,
-        height
-      } = rect;
+        width: width_0,
+        height: height_0
+      } = rect_0;
 
       // Value to the precision point value
-      const value__ = valuePrecision(orientation === 'horizontal' ? (x - rect.x) / width : 1 - (y - rect.y) / height, true);
-      const valueNew = (0, _utils.is)('array', refs.value.current) ? [...refs.value.current] : value__;
+      const value___1 = valuePrecision(orientation === 'horizontal' ? (x_0 - rect_0.x) / width_0 : 1 - (y_0 - rect_0.y) / height_0, true);
+      const valueNew_2 = (0, _utils.is)('array', refs.value.current) ? [...refs.value.current] : value___1;
       if ((0, _utils.is)('array', refs.value.current)) {
-        let index = (0, _utils.is)('number', refs.mouseDownButton.current) ? refs.mouseDownButton.current : 0;
-        if (index > 0 && value__ <= refs.value.current[index - 1]) {
-          index -= 1;
-          setMouseDownButton(index);
+        let index_1 = (0, _utils.is)('number', refs.mouseDownButton.current) ? refs.mouseDownButton.current : 0;
+        if (index_1 > 0 && value___1 <= refs.value.current[index_1 - 1]) {
+          index_1 -= 1;
+          setMouseDownButton(index_1);
         }
-        if (index < refs.value.current.length - 1 && value__ >= refs.value.current[index + 1]) {
-          index += 1;
-          setMouseDownButton(index);
+        if (index_1 < refs.value.current.length - 1 && value___1 >= refs.value.current[index_1 + 1]) {
+          index_1 += 1;
+          setMouseDownButton(index_1);
         }
-        valueNew[index] = value__;
+        valueNew_2[index_1] = value___1;
       }
-      if (!(0, _utils.equalDeep)(valueNew, refs.value.current)) {
+      if (!(0, _utils.equalDeep)(valueNew_2, refs.value.current)) {
         // Inner controlled value
-        if (!props.hasOwnProperty('value')) setValue(valueNew);
-        if ((0, _utils.is)('function', onChange)) onChange(valueNew);
+        if (!props.hasOwnProperty('value')) setValue(valueNew_2);
+        if ((0, _utils.is)('function', onChange)) onChange(valueNew_2);
       }
     }
-  }, [disabled, readOnly, onChange, value, mouseDownButton]);
+  };
   const moveItem = (forward_ = true) => {
     const forward = orientation === 'vertical' || theme.direction === 'ltr' && orientation === 'horizontal' ? forward_ : !forward_;
-    let valueNew = (0, _utils.is)('array', refs.value.current) ? [...refs.value.current] : refs.value.current;
-    let index = refs.focusButton.current || 0;
-    let value__ = (0, _utils.is)('array', valueNew) ? valueNew[index] : valueNew;
+    let valueNew_3 = (0, _utils.is)('array', refs.value.current) ? [...refs.value.current] : refs.value.current;
+    let index_2 = refs.focusButton.current || 0;
+    let value___2 = (0, _utils.is)('array', valueNew_3) ? valueNew_3[index_2] : valueNew_3;
 
     // previous value
-    let previous = (0, _utils.clamp)(+(value__ - precision).toFixed(valueDecimals), refs.min.current, refs.max.current);
+    let previous_0 = (0, _utils.clamp)(+(value___2 - precision).toFixed(valueDecimals), refs.min.current, refs.max.current);
     if (onlyMarks && (0, _utils.is)('array', marks)) {
-      const previousMark = marks.map(item => item.value).sort((a, b) => b - a).find(item => item < value__);
-      previous = previousMark !== undefined ? previousMark : refs.min.current;
+      const previousMark_0 = marks.map(item_6 => item_6.value).sort((a_2, b_2) => b_2 - a_2).find(item_7 => item_7 < value___2);
+      previous_0 = previousMark_0 !== undefined ? previousMark_0 : refs.min.current;
     }
 
     // next value
-    let next = (0, _utils.clamp)(+(value__ + precision).toFixed(valueDecimals), refs.min.current, refs.max.current);
+    let next_0 = (0, _utils.clamp)(+(value___2 + precision).toFixed(valueDecimals), refs.min.current, refs.max.current);
     if (onlyMarks && (0, _utils.is)('array', marks)) {
-      const nextMark = marks.map(item => item.value).sort((a, b) => a - b).find(item => item > value__);
-      next = nextMark !== undefined ? nextMark : refs.max.current;
+      const nextMark_0 = marks.map(item_8 => item_8.value).sort((a_3, b_3) => a_3 - b_3).find(item_9 => item_9 > value___2);
+      next_0 = nextMark_0 !== undefined ? nextMark_0 : refs.max.current;
     }
-    value__ = forward ? next : previous;
+    value___2 = forward ? next_0 : previous_0;
     if ((0, _utils.is)('array', refs.value.current)) {
-      if (index > 0 && value__ < refs.value.current[index - 1]) {
-        index -= 1;
-        refs.focusButton.current = index;
-        setFocusButton(index);
-        refs.iconButtons.current[index].focus();
-      }
-      if (index < refs.value.current.length - 1 && value__ > refs.value.current[index + 1]) {
-        index += 1;
-        refs.focusButton.current = index;
-        setFocusButton(index);
-        refs.iconButtons.current[index].focus();
-      }
-      valueNew[index] = value__;
-    } else valueNew = value__;
-    if (!(0, _utils.equalDeep)(valueNew, refs.value.current)) {
-      if (!props.hasOwnProperty('value')) setValue(valueNew);
-      if ((0, _utils.is)('function', onChange)) onChange(valueNew);
+      if (index_2 > 0 && value___2 < refs.value.current[index_2 - 1]) {
+        index_2 -= 1;
+        refs.focusButton.current = index_2;
+        setFocusButton(index_2);
+        refs.iconButtons.current[index_2].focus();
+      }
+      if (index_2 < refs.value.current.length - 1 && value___2 > refs.value.current[index_2 + 1]) {
+        index_2 += 1;
+        refs.focusButton.current = index_2;
+        setFocusButton(index_2);
+        refs.iconButtons.current[index_2].focus();
+      }
+      valueNew_3[index_2] = value___2;
+    } else valueNew_3 = value___2;
+    if (!(0, _utils.equalDeep)(valueNew_3, refs.value.current)) {
+      if (!props.hasOwnProperty('value')) setValue(valueNew_3);
+      if ((0, _utils.is)('function', onChange)) onChange(valueNew_3);
     }
   };
-  const onKeyDown = _react.default.useCallback(event => {
+  const onKeyDown = event_0 => {
     if (!disabled && !readOnly) {
-      if (['Enter', 'Escape', 'ArrowUp', 'ArrowRight', 'ArrowDown', 'ArrowLeft', 'Home', 'End'].includes(event.key)) {
+      if (['Enter', 'Escape', 'ArrowUp', 'ArrowRight', 'ArrowDown', 'ArrowLeft', 'Home', 'End'].includes(event_0.key)) {
         // Prevent default
-        event.preventDefault();
-        let valueNew = refs.value.current;
-        switch (event.key) {
+        event_0.preventDefault();
+        let valueNew_4 = refs.value.current;
+        switch (event_0.key) {
           case 'End':
             if ((0, _utils.is)('array', refs.value.current)) {
-              valueNew = [...refs.value.current];
-              valueNew[0] = refs.min.current;
-            } else valueNew = refs.min.current;
-            if (!props.hasOwnProperty('value')) setValue(valueNew);
-            if ((0, _utils.is)('function', onChange)) return onChange(valueNew);
+              valueNew_4 = [...refs.value.current];
+              valueNew_4[0] = refs.min.current;
+            } else valueNew_4 = refs.min.current;
+            if (!props.hasOwnProperty('value')) setValue(valueNew_4);
+            if ((0, _utils.is)('function', onChange)) return onChange(valueNew_4);
             return;
           case 'Home':
             if ((0, _utils.is)('array', refs.value.current)) {
-              valueNew = [...refs.value.current];
-              valueNew[valueNew.length - 1] = refs.max.current;
-            } else valueNew = refs.max.current;
-            if (!props.hasOwnProperty('value')) setValue(valueNew);
-            if ((0, _utils.is)('function', onChange)) return onChange(valueNew);
+              valueNew_4 = [...refs.value.current];
+              valueNew_4[valueNew_4.length - 1] = refs.max.current;
+            } else valueNew_4 = refs.max.current;
+            if (!props.hasOwnProperty('value')) setValue(valueNew_4);
+            if ((0, _utils.is)('function', onChange)) return onChange(valueNew_4);
             return;
           case 'ArrowUp':
           case 'ArrowRight':
@@ -726,39 +711,39 @@ const Slider = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
         }
       }
     }
-  }, [disabled, readOnly, value, precision, focusButton]);
-  const onFocus = _react.default.useCallback(() => {
+  };
+  const onFocus = () => {
     if (!disabled && !readOnly && !mouseDown) setFocus(true);
-  }, [disabled, readOnly, mouseDown]);
-  const onBlur = _react.default.useCallback(() => {
+  };
+  const onBlur = () => {
     if (!disabled && !readOnly) setFocus(false);
-  }, [disabled, readOnly]);
-  const onFocusButton = _react.default.useCallback(index => {
-    if (!disabled && !readOnly) setFocusButton(index);
-  }, [disabled, readOnly]);
-  const onMouseDownButton = _react.default.useCallback((event, index) => {
-    if (!disabled && !readOnly) setMouseDownButton(index);
-  }, [disabled, readOnly]);
-  const onMouseDown = _react.default.useCallback(event => {
+  };
+  const onFocusButton = index_3 => {
+    if (!disabled && !readOnly) setFocusButton(index_3);
+  };
+  const onMouseDownButton = (event_1, index_4) => {
+    if (!disabled && !readOnly) setMouseDownButton(index_4);
+  };
+  const onMouseDown = event_2 => {
     if (!disabled && !readOnly) {
       var _touches, _touches2;
       setMouseDown(true);
-      const x = event.clientX ? event.clientX : (_touches = event.touches) === null || _touches === void 0 || (_touches = _touches[0]) === null || _touches === void 0 ? void 0 : _touches.clientX;
-      const y = event.clientY ? event.clientY : (_touches2 = event.touches) === null || _touches2 === void 0 || (_touches2 = _touches2[0]) === null || _touches2 === void 0 ? void 0 : _touches2.clientY;
-      move(x, y);
+      const x_1 = event_2.clientX ? event_2.clientX : (_touches = event_2.touches) === null || _touches === void 0 || (_touches = _touches[0]) === null || _touches === void 0 ? void 0 : _touches.clientX;
+      const y_1 = event_2.clientY ? event_2.clientY : (_touches2 = event_2.touches) === null || _touches2 === void 0 || (_touches2 = _touches2[0]) === null || _touches2 === void 0 ? void 0 : _touches2.clientY;
+      move(x_1, y_1);
     }
-    if ((0, _utils.is)('function', onMouseDown_)) onMouseDown_(event);
-  }, [disabled, readOnly, onMouseDown_]);
-  const onTouchStart = _react.default.useCallback(event => {
+    if ((0, _utils.is)('function', onMouseDown_)) onMouseDown_(event_2);
+  };
+  const onTouchStart = event_3 => {
     if (!disabled && !readOnly) {
       var _touches3, _touches4;
       setMouseDown(true);
-      const x = event.clientX ? event.clientX : (_touches3 = event.touches) === null || _touches3 === void 0 || (_touches3 = _touches3[0]) === null || _touches3 === void 0 ? void 0 : _touches3.clientX;
-      const y = event.clientY ? event.clientY : (_touches4 = event.touches) === null || _touches4 === void 0 || (_touches4 = _touches4[0]) === null || _touches4 === void 0 ? void 0 : _touches4.clientY;
-      move(x, y);
+      const x_2 = event_3.clientX ? event_3.clientX : (_touches3 = event_3.touches) === null || _touches3 === void 0 || (_touches3 = _touches3[0]) === null || _touches3 === void 0 ? void 0 : _touches3.clientX;
+      const y_2 = event_3.clientY ? event_3.clientY : (_touches4 = event_3.touches) === null || _touches4 === void 0 || (_touches4 = _touches4[0]) === null || _touches4 === void 0 ? void 0 : _touches4.clientY;
+      move(x_2, y_2);
     }
-    if ((0, _utils.is)('function', onMouseDown_)) onMouseDown_(event);
-  }, [disabled, readOnly, onTouchStart_]);
+    if ((0, _utils.is)('function', onMouseDown_)) onMouseDown_(event_3);
+  };
   const styles = {
     root: {},
     icon: {},
@@ -778,28 +763,28 @@ const Slider = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
   styles.label.background = !tonal ? (palette === null || palette === void 0 ? void 0 : palette[40]) || (color === 'default' ? theme.palette.text.default.primary : theme.palette.color[color].main) : theme.methods.palette.color.value(color, 40, true, palette);
   styles.label.color = theme.methods.palette.color.text(styles.label.background, true, 'light');
   const values = (0, _utils.is)('array', value) ? value : [value];
-  const valueValue = (value__ = values[0]) => {
-    let valueNew = value__;
-    if (value__ === refs.min.current) valueNew = 0;else if (value__ === refs.max.current) valueNew = 100;else valueNew = (0, _utils.percentageFromValueWithinRange)(value__, refs.min.current, refs.max.current);
-    return (0, _utils.clamp)(valueNew, 0, 100);
+  const valueValue = (value___3 = values[0]) => {
+    let valueNew_5 = value___3;
+    if (value___3 === refs.min.current) valueNew_5 = 0;else if (value___3 === refs.max.current) valueNew_5 = 100;else valueNew_5 = (0, _utils.percentageFromValueWithinRange)(value___3, refs.min.current, refs.max.current);
+    return (0, _utils.clamp)(valueNew_5, 0, 100);
   };
-  const valueMark = value__ => {
-    if (value__ === refs.min.current) return 0;
-    if (value__ === refs.max.current) return `calc(100% - 2px)`;
-    return `calc(${valueValue(value__)}% - 1px)`;
+  const valueMark = value___4 => {
+    if (value___4 === refs.min.current) return 0;
+    if (value___4 === refs.max.current) return `calc(100% - 2px)`;
+    return `calc(${valueValue(value___4)}% - 1px)`;
   };
   const propInset = orientation === 'horizontal' ? 'insetInlineStart' : 'insetBlockEnd';
-  const iconButtonStyles = value__ => {
+  const iconButtonStyles = value___5 => {
     const style_ = {};
-    if ((0, _utils.is)('function', iconButtonPositionResolve)) style_[propInset] = iconButtonPositionResolve(value__, valueValue(value__), size);else {
+    if ((0, _utils.is)('function', iconButtonPositionResolve)) style_[propInset] = iconButtonPositionResolve(value___5, valueValue(value___5), size);else {
       if (size === 'small') {
-        style_[propInset] = `calc(${valueValue(value__)}% - 15px)`;
+        style_[propInset] = `calc(${valueValue(value___5)}% - 15px)`;
       }
       if (size === 'regular') {
-        style_[propInset] = `calc(${valueValue(value__)}% - 20px)`;
+        style_[propInset] = `calc(${valueValue(value___5)}% - 20px)`;
       }
       if (size === 'large') {
-        style_[propInset] = `calc(${valueValue(value__)}% - 25px)`;
+        style_[propInset] = `calc(${valueValue(value___5)}% - 25px)`;
       }
     }
     return style_;
@@ -822,13 +807,13 @@ const Slider = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
   if (marks) {
     if ((0, _utils.is)('array', marks)) marks_ = marks;else if (marksValue <= 1e3) {
       let markSum = refs.min.current;
-      let index = 1;
+      let index_5 = 1;
       marks_.push({
         value: refs.min.current,
         label: refs.min.current
       });
       while (markSum <= refs.max.current) {
-        markSum = refs.min.current + precision * index++;
+        markSum = refs.min.current + precision * index_5++;
         if (markSum < refs.max.current) marks_.push({
           value: markSum,
           label: markSum
@@ -840,16 +825,16 @@ const Slider = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
       });
     }
   }
-  const markTrack = value__ => {
-    if (values.length === 1) return !inverted ? value__ <= values[0] : value__ > values[0];else return !inverted ? value__ >= values[0] && value__ <= values[values.length - 1] : value__ < values[0] || value__ > values[values.length - 1];
+  const markTrack = value___6 => {
+    if (values.length === 1) return !inverted ? value___6 <= values[0] : value___6 > values[0];else return !inverted ? value___6 >= values[0] && value___6 <= values[values.length - 1] : value___6 < values[0] || value___6 > values[values.length - 1];
   };
-  const labelMethod = (0, _utils.is)('function', labelTooltipResolve) ? labelTooltipResolve : value__ => +value__.toFixed();
+  const labelMethod = (0, _utils.is)('function', labelTooltipResolve) ? labelTooltipResolve : value___7 => +value___7.toFixed();
   return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
-    ref: item => {
+    ref: item_10 => {
       if (ref) {
-        if ((0, _utils.is)('function', ref)) ref(item);else ref.current = item;
+        if ((0, _utils.is)('function', ref)) ref(item_10);else ref.current = item_10;
       }
-      refs.root.current = item;
+      refs.root.current = item_10;
     },
     tabIndex: noButtons ? 0 : -1,
     onFocus: onFocus,
@@ -873,35 +858,35 @@ const Slider = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
     style: styles.track
   }), !!marks_.length && /*#__PURE__*/_react.default.createElement("span", {
     className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Slider', theme) && ['onesy-Slider-marks'], classes.marks, classes[`orientation_${orientation}`], classes[`track_size_${size}`]])
-  }, marks_.map((item, index) => /*#__PURE__*/_react.default.createElement("span", {
-    key: index,
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Slider', theme) && ['onesy-Slider-mark'], classes.mark, markTrack(item.value) ? classes[`rail_color_${color}`] : [classes[`track_color_${color}`], tonal && classes[`track_tonal_color_${color}`]]]),
-    style: _objectSpread(_objectSpread({}, markTrack(item.value) ? styles.markRail : styles.markTrack), {}, {
-      [propInset]: valueMark(item.value)
+  }, marks_.map((item_11, index_6) => /*#__PURE__*/_react.default.createElement("span", {
+    key: index_6,
+    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Slider', theme) && ['onesy-Slider-mark'], classes.mark, markTrack(item_11.value) ? classes[`rail_color_${color}`] : [classes[`track_color_${color}`], tonal && classes[`track_tonal_color_${color}`]]]),
+    style: _objectSpread(_objectSpread({}, markTrack(item_11.value) ? styles.markRail : styles.markTrack), {}, {
+      [propInset]: valueMark(item_11.value)
     })
   }))), labels && !!marks_.length && /*#__PURE__*/_react.default.createElement("span", {
     className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Slider', theme) && ['onesy-Slider-labels'], classes.labels, classes[`labels_orientation_${orientation}`]])
-  }, marks_.map((item, index) => /*#__PURE__*/_react.default.createElement(Type, (0, _extends2.default)({
-    key: index,
+  }, marks_.map((item_12, index_7) => /*#__PURE__*/_react.default.createElement(Type, (0, _extends2.default)({
+    key: index_7,
     version: size === 'large' ? 'b1' : size === 'regular' ? 'b2' : 'b3'
   }, LabelProps, {
-    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Slider', theme) && ['onesy-Slider-label'], LabelProps === null || LabelProps === void 0 ? void 0 : LabelProps.className, classes.label, classes[`label_orientation_${orientation}`], theme.direction === 'rtl' && classes[`label_orientation_${orientation}_rtl`], item.value <= value && classes.label_active]),
+    className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Slider', theme) && ['onesy-Slider-label'], LabelProps === null || LabelProps === void 0 ? void 0 : LabelProps.className, classes.label, classes[`label_orientation_${orientation}`], theme.direction === 'rtl' && classes[`label_orientation_${orientation}_rtl`], item_12.value <= value && classes.label_active]),
     style: _objectSpread({
-      [propInset]: valueMark(item.value)
+      [propInset]: valueMark(item_12.value)
     }, LabelProps === null || LabelProps === void 0 ? void 0 : LabelProps.style)
-  }), item.label))), !noButtons && values.map((value__, index) => {
+  }), item_12.label))), !noButtons && values.map((value___8, index_8) => {
     var _icon$props, _icon$props2;
-    const classNameIcon = (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Slider', theme) && ['onesy-Slider-icon'], classes.icon, classes[`track_color_${color}`], tonal && classes[`track_tonal_color_${color}`], classes[`icon_size_${size}`], mouseDownButton === index && classes.iconActive]);
+    const classNameIcon = (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Slider', theme) && ['onesy-Slider-icon'], classes.icon, classes[`track_color_${color}`], tonal && classes[`track_tonal_color_${color}`], classes[`icon_size_${size}`], mouseDownButton === index_8 && classes.iconActive]);
     return /*#__PURE__*/_react.default.createElement(Tooltip, (0, _extends2.default)({
-      key: index,
+      key: index_8,
       className: (0, _styleReact.classNames)([classes.tooltip, classes[`tooltip_orientation_${orientation}`]]),
       classNameSwitch: classes[`tooltip_switch_orientation_${orientation}_${theme.direction}`]
-    }, tooltip === 'always' || tooltip !== undefined && mouseDownButton === index ? {
+    }, tooltip === 'always' || tooltip !== undefined && mouseDownButton === index_8 ? {
       open: true
     } : tooltip === undefined ? {
       open: false
     } : {}, {
-      label: labelMethod(value__),
+      label: labelMethod(value___8),
       position: orientation === 'horizontal' ? 'top' : theme.direction === 'ltr' ? 'left' : 'right',
       alignment: "center",
       TransitionComponent: Zoom,
@@ -917,23 +902,23 @@ const Slider = /*#__PURE__*/_react.default.forwardRef((props_, ref) => {
         className: classes.tooltipLabelText
       }
     }, TooltipProps), /*#__PURE__*/_react.default.createElement(IconButton, (0, _extends2.default)({
-      ref: item => refs.iconButtons.current.push(item),
+      ref: item_13 => refs.iconButtons.current.push(item_13),
       size: size,
       tonal: tonal,
       color: color,
       onBlur: onBlur,
       onFocus: () => {
         onFocus();
-        onFocusButton(index);
+        onFocusButton(index_8);
       },
-      onMouseDown: event => onMouseDownButton(event, index),
-      "aria-valuenow": valueValue(value__),
-      "aria-valuetext": `${valueValue(value__)}%`,
+      onMouseDown: event_4 => onMouseDownButton(event_4, index_8),
+      "aria-valuenow": valueValue(value___8),
+      "aria-valuetext": `${valueValue(value___8)}%`,
       "aria-valuemin": min,
       "aria-valuemax": max
     }, IconButtonProps, {
       className: (0, _styleReact.classNames)([(0, _utils2.staticClassName)('Slider', theme) && ['onesy-Slider-icon-button'], IconButtonProps === null || IconButtonProps === void 0 ? void 0 : IconButtonProps.className, classes.iconButton, classes[`orientation_${orientation}`], !tonal && classes[`iconButton_color_${color}`], tonal && classes[`iconButton_tonal_color_${color}`]]),
-      style: _objectSpread(_objectSpread({}, iconButtonStyles(value__)), IconButtonProps === null || IconButtonProps === void 0 ? void 0 : IconButtonProps.style)
+      style: _objectSpread(_objectSpread({}, iconButtonStyles(value___8)), IconButtonProps === null || IconButtonProps === void 0 ? void 0 : IconButtonProps.style)
     }), icon ? /*#__PURE__*/_react.default.cloneElement(icon, {
       className: (0, _styleReact.classNames)([icon === null || icon === void 0 || (_icon$props = icon.props) === null || _icon$props === void 0 ? void 0 : _icon$props.className, classNameIcon]),
       style: _objectSpread(_objectSpread({}, styles.icon), icon === null || icon === void 0 || (_icon$props2 = icon.props) === null || _icon$props2 === void 0 ? void 0 : _icon$props2.style)

package/SmartTextField/SmartTextField.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { ITextField } from '../TextField/TextField';
 import { IPropsAny } from '../types';
-export type ISmartTextField = ITextField & {
+export declare type ISmartTextField = ITextField & {
     placeholder?: any;
     edit?: boolean;
     mention?: boolean;