@rpg-engine/long-bow 0.5.83 → 0.5.84

package/dist/long-bow.esm.js

@@ -16317,13 +16317,15 @@ var RangeSliderType;
   RangeSliderType["Slider"] = "rpgui-slider";
   RangeSliderType["GoldSlider"] = "rpgui-slider golden";
 })(RangeSliderType || (RangeSliderType = {}));
-var RangeSlider = function RangeSlider(_ref) {
+var RangeSlider = /*#__PURE__*/React.memo(function (_ref) {
   var type = _ref.type,
     valueMin = _ref.valueMin,
     valueMax = _ref.valueMax,
     width = _ref.width,
-    _onChange = _ref.onChange,
-    value = _ref.value;
+    onChange = _ref.onChange,
+    value = _ref.value,
+    _ref$step = _ref.step,
+    step = _ref$step === void 0 ? 1 : _ref$step;
   var sliderId = v4();
   var containerRef = useRef(null);
   var _useState = useState(0),
@@ -16335,6 +16337,9 @@ var RangeSlider = function RangeSlider(_ref) {
     setLeft(Math.max((value - valueMin) / (valueMax - valueMin) * (calculatedWidth - 35) + 10));
   }, [value, valueMin, valueMax]);
   var typeClass = type === RangeSliderType.GoldSlider ? 'golden' : '';
+  var handleChange = useCallback(function (e) {
+    onChange(Number(e.target.value));
+  }, [onChange]);
   return React.createElement("div", {
     style: {
       width: width,
@@ -16365,13 +16370,12 @@ var RangeSlider = function RangeSlider(_ref) {
     },
     min: valueMin,
     max: valueMax,
-    onChange: function onChange(e) {
-      return _onChange(Number(e.target.value));
-    },
+    step: step,
+    onChange: handleChange,
     value: value,
     className: "rpgui-cursor-point"
   }));
-};
+});
 var Input$1 = /*#__PURE__*/styled.input.withConfig({
   displayName: "RangeSlider__Input",
   componentId: "sc-v8mte9-0"