@corva/ui 3.1.0-rc.5 → 3.1.0

package/components/RangeSlider/RangeSlider.js

@@ -1,404 +1 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useState, useRef, useEffect } from 'react';
-import classNames from 'classnames';
-import { round, throttle } from 'lodash';
-import { Tooltip } from '@material-ui/core';
-import { isMobileDetected } from '../../utils/mobileDetect.js';
-import { horizontalStrategy } from './strategies/horizontal.js';
-import { verticalStrategy } from './strategies/vertical.js';
-import { getToolipBoundingClientRect, calculatePercentForValue, calculateValueFromPercent, updateFromValue, updateToValue } from './utils.js';
-import FromInput from './inputs/FromInput.js';
-import ToInput from './inputs/ToInput.js';
-import { RangeSliderControl, DEFAULT_FOCUSED_EL, RangeSliderOrientation } from './constants.js';
-import styles from './RangeSlider.css.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-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) { _defineProperty(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; }
-var RangeSlider = function RangeSlider(_ref) {
-  var _railRef$current, _classNames, _classNames2, _classNames3, _classNames4;
-  var from = _ref.from,
-    to = _ref.to,
-    _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    _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$orientation = _ref.orientation,
-    orientation = _ref$orientation === void 0 ? 'horizontal' : _ref$orientation,
-    _ref$precision = _ref.precision,
-    precision = _ref$precision === void 0 ? 0 : _ref$precision,
-    _ref$minRange = _ref.minRange,
-    minRange = _ref$minRange === void 0 ? 0 : _ref$minRange,
-    _ref$onChange = _ref.onChange,
-    onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
-    _ref$isSingleRange = _ref.isSingleRange,
-    isSingleRange = _ref$isSingleRange === void 0 ? false : _ref$isSingleRange,
-    _ref$isWithoutInput = _ref.isWithoutInput,
-    isWithoutInput = _ref$isWithoutInput === void 0 ? false : _ref$isWithoutInput;
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    fromInputValue = _useState2[0],
-    setFromInputValue = _useState2[1];
-  var _useState3 = useState(null),
-    _useState4 = _slicedToArray(_useState3, 2),
-    toInputValue = _useState4[0],
-    setToInputValue = _useState4[1];
-  var _useState5 = useState({}),
-    _useState6 = _slicedToArray(_useState5, 2),
-    tooltipPosition = _useState6[0],
-    setTooltipPosition = _useState6[1];
-  var _useState7 = useState(''),
-    _useState8 = _slicedToArray(_useState7, 2),
-    tooltipTitle = _useState8[0],
-    setTooltipTitle = _useState8[1];
-  var _useState9 = useState(null),
-    _useState10 = _slicedToArray(_useState9, 2),
-    strategy = _useState10[0],
-    setStrategy = _useState10[1];
-  var _useState11 = useState(RangeSliderControl.FROM),
-    _useState12 = _slicedToArray(_useState11, 2),
-    lastMoved = _useState12[0],
-    setLastMoved = _useState12[1];
-  var _useState13 = useState(null),
-    _useState14 = _slicedToArray(_useState13, 2),
-    activeInput = _useState14[0],
-    setActiveInput = _useState14[1];
-  var _useState15 = useState({}),
-    _useState16 = _slicedToArray(_useState15, 2),
-    computedStyles = _useState16[0],
-    setComputedStyles = _useState16[1];
-  var _useState17 = useState(DEFAULT_FOCUSED_EL),
-    _useState18 = _slicedToArray(_useState17, 2),
-    focusedEl = _useState18[0],
-    setFocusedEl = _useState18[1];
-  var railRef = useRef(null);
-  var fromThumbRef = useRef(null);
-  var toThumbRef = useRef(null);
-  var fromInputRef = useRef(null);
-  var toInputRef = useRef(null);
-  var railPosition = (_railRef$current = railRef.current) === null || _railRef$current === void 0 ? void 0 : _railRef$current.getBoundingClientRect();
-  var isHorizontalOrientation = orientation === RangeSliderOrientation.HORIZONTAL;
-  var isVerticalOrientation = orientation === RangeSliderOrientation.VERTICAL;
-  var isSingleRangeWithoutInput = isSingleRange && isWithoutInput;
-  useEffect(function () {
-    if (orientation === RangeSliderOrientation.HORIZONTAL) {
-      setStrategy(horizontalStrategy);
-    }
-    if (orientation === RangeSliderOrientation.VERTICAL) {
-      setStrategy(verticalStrategy);
-    }
-  }, [orientation]);
-  useEffect(function () {
-    if (isSingleRange) {
-      onChange({
-        from: 0,
-        to: to
-      });
-    }
-  }, [isSingleRange]);
-  useEffect(function () {
-    if (strategy) {
-      var _setComputedStyles;
-      var roundedFrom = round(from, precision);
-      var roundedTo = round(to, precision);
-      var roundedMin = round(min, precision);
-      var roundedMax = round(max, precision);
-      var fromPercent = calculatePercentForValue(roundedFrom, roundedMin, roundedMax);
-      var toPercent = calculatePercentForValue(roundedTo, roundedMin, roundedMax);
-      setComputedStyles((_setComputedStyles = {}, _defineProperty(_setComputedStyles, RangeSliderControl.FROM, strategy.getThumbStyles(fromPercent, lastMoved === RangeSliderControl.FROM)), _defineProperty(_setComputedStyles, RangeSliderControl.TO, strategy.getThumbStyles(toPercent, lastMoved === RangeSliderControl.TO)), _defineProperty(_setComputedStyles, RangeSliderControl.BAR, strategy.getBarStyles(fromPercent, toPercent)), _defineProperty(_setComputedStyles, RangeSliderControl.FROM_INPUT, strategy.getInputStyles(activeInput === RangeSliderControl.FROM || activeInput === RangeSliderControl.BAR || focusedEl.from)), _defineProperty(_setComputedStyles, RangeSliderControl.TO_INPUT, strategy.getInputStyles(activeInput === RangeSliderControl.TO || activeInput === RangeSliderControl.BAR || focusedEl.to)), _setComputedStyles));
-      setFromInputValue(roundedFrom.toString());
-      setToInputValue(roundedTo.toString());
-    }
-  }, [strategy, min, max, from, to, activeInput, focusedEl]);
-  var onFromMove = function onFromMove(event) {
-    var coordinates = strategy.getCoordinates(event, railRef.current.getBoundingClientRect());
-    var percent = calculatePercentForValue(coordinates.new, coordinates.min, coordinates.max);
-    var newFrom = round(calculateValueFromPercent(percent, min, max), precision);
-    if (newFrom !== from) {
-      var _range = updateFromValue(newFrom, from, to, min, minRange);
-      onChange(_range);
-    }
-  };
-  var onToMove = function onToMove(event) {
-    var coordinates = isVerticalOrientation && isSingleRange ? strategy.getRotatedCoordinates(event, railRef.current.getBoundingClientRect()) : strategy.getCoordinates(event, railRef.current.getBoundingClientRect());
-    var percent = calculatePercentForValue(coordinates.new, coordinates.min, coordinates.max);
-    var newTo = round(calculateValueFromPercent(percent, min, max), precision);
-    if (newTo !== to) {
-      var _range2 = updateToValue(newTo, from, to, max, minRange);
-      onChange(_range2);
-    }
-  };
-  var onBarMove = function onBarMove(event, startCoordinates) {
-    var coordinates = strategy.getBarCoordinates(event, startCoordinates, railRef.current.getBoundingClientRect());
-    var percent = calculatePercentForValue(coordinates.new, coordinates.min, coordinates.max);
-    var newFrom = round(calculateValueFromPercent(percent, min, max), precision);
-    var newTo = round(to + (newFrom - from), precision);
-    if (newFrom < min) {
-      var diff = min - newFrom;
-      newFrom = min;
-      newTo = round(newTo + diff, precision);
-    }
-    if (newTo > max) {
-      var _diff = newTo - max;
-      newTo = max;
-      newFrom = round(newFrom - _diff, precision);
-    }
-    if (newFrom !== from && newTo !== to && newFrom >= min && newTo <= max) {
-      onChange({
-        from: newFrom,
-        to: newTo
-      });
-    }
-  };
-  var onMove = function onMove(control) {
-    if (control === RangeSliderControl.FROM) {
-      return onFromMove;
-    }
-    if (control === RangeSliderControl.TO) {
-      return onToMove;
-    }
-    return onBarMove;
-  };
-  var _onMouseEnter = function onMouseEnter(control) {
-    if (control === RangeSliderControl.BAR) {
-      setFocusedEl({
-        from: true,
-        bar: true,
-        to: true
-      });
-      return;
-    }
-    setFocusedEl(_objectSpread(_objectSpread({}, DEFAULT_FOCUSED_EL), {}, _defineProperty({}, control, true)));
-  };
-  var _onMouseLeave = function onMouseLeave(control) {
-    if (control === RangeSliderControl.BAR) {
-      setFocusedEl(DEFAULT_FOCUSED_EL);
-      return;
-    }
-    setFocusedEl(_objectSpread(_objectSpread({}, focusedEl), {}, _defineProperty({}, control, false)));
-  };
-  var _onMouseDown = function onMouseDown(control, startEvent) {
-    if (isSingleRange && control === RangeSliderControl.BAR || disabled) {
-      return;
-    }
-    // Block layout grid drag
-    startEvent.stopPropagation();
-    setLastMoved(control);
-    setActiveInput(control);
-    var clientX = startEvent.clientX,
-      clientY = startEvent.clientY;
-    var _getBoundingClientRec = startEvent.target.getBoundingClientRect(),
-      x = _getBoundingClientRec.x,
-      y = _getBoundingClientRec.y;
-    function onMouseMove(event) {
-      onMove(control)(event, {
-        clientX: clientX,
-        clientY: clientY,
-        x: x,
-        y: y
-      });
-    }
-
-    // lock slider update rate to 240+ per sec
-    var throttledMove = throttle(onMouseMove, 4);
-    function onMouseUp() {
-      setActiveInput(null);
-      document.removeEventListener('mousemove', throttledMove);
-      document.removeEventListener('mouseup', onMouseUp);
-    }
-    document.addEventListener('mousemove', throttledMove);
-    document.addEventListener('mouseup', onMouseUp);
-  };
-  var setControlValue = function setControlValue(control) {
-    if (control === RangeSliderControl.FROM) {
-      return setFromInputValue;
-    }
-    return setToInputValue;
-  };
-  var onInputChange = function onInputChange(control, event) {
-    var value = event.target.value;
-    if (!Number.isNaN(Number(value))) {
-      setControlValue(control)(value);
-    }
-  };
-  var validateInputChange = function validateInputChange(control, event) {
-    var value = event.target.value;
-    var roundValue = round(Number(value), precision);
-    if (control === RangeSliderControl.FROM) {
-      var _range3 = updateFromValue(roundValue, from, to, min, minRange);
-      onChange(_range3);
-      setFromInputValue(_range3.from);
-    }
-    if (control === RangeSliderControl.TO) {
-      var _range4 = updateToValue(roundValue, from, to, max, minRange);
-      onChange(_range4);
-      setToInputValue(_range4.to);
-    }
-  };
-  var handleTooltipMouseMove = function handleTooltipMouseMove(event) {
-    var x = event.clientX,
-      y = event.clientY;
-    var clientCoordinates = isHorizontalOrientation ? {
-      clientX: x
-    } : {
-      clientY: y
-    };
-    var coordinates = isVerticalOrientation && isSingleRange ? strategy.getRotatedCoordinates(clientCoordinates, railRef.current.getBoundingClientRect()) : strategy.getCoordinates(clientCoordinates, railRef.current.getBoundingClientRect());
-    if (focusedEl.bar) {
-      setTooltipTitle('');
-      setTooltipPosition({
-        x: x,
-        y: y
-      });
-      return;
-    }
-    var percent = calculatePercentForValue(coordinates.new, coordinates.min, coordinates.max);
-    var currentValue = round(calculateValueFromPercent(percent, min, max), precision);
-    if (currentValue < min) {
-      setTooltipTitle(min.toString());
-    }
-    if (currentValue > max) {
-      setTooltipTitle(max.toString());
-    }
-    if (currentValue >= min && currentValue <= max) {
-      setTooltipTitle(currentValue.toString());
-    }
-    setTooltipPosition({
-      x: x,
-      y: y
-    });
-  };
-  var handleRailClick = function handleRailClick(event) {
-    if (focusedEl.bar || focusedEl.from || focusedEl.to) return;
-    var x = event.clientX,
-      y = event.clientY;
-    var clientCoordinates = isHorizontalOrientation ? {
-      clientX: x
-    } : {
-      clientY: y
-    };
-    var coordinates = isVerticalOrientation && isSingleRange ? strategy.getRotatedCoordinates(clientCoordinates, railRef.current.getBoundingClientRect()) : strategy.getCoordinates(clientCoordinates, railRef.current.getBoundingClientRect());
-    var percent = calculatePercentForValue(coordinates.new, coordinates.min, coordinates.max);
-    var currentValue = round(calculateValueFromPercent(percent, min, max), precision);
-    if (isSingleRange) {
-      onChange({
-        from: from,
-        to: currentValue
-      });
-      return;
-    }
-    onChange({
-      from: from > currentValue ? currentValue : from,
-      to: to < currentValue ? currentValue : to
-    });
-  };
-  useEffect(function () {
-    var rail = railRef.current;
-    rail.addEventListener('click', handleRailClick);
-    return function () {
-      return rail.removeEventListener('click', handleRailClick);
-    };
-  }, [isSingleRange, strategy, focusedEl]);
-  return /*#__PURE__*/jsxs("div", {
-    className: classNames((_classNames = {}, _defineProperty(_classNames, styles.disabled, disabled), _defineProperty(_classNames, styles.rangeSliderHorizontal, isHorizontalOrientation), _defineProperty(_classNames, styles.rangeSliderVertical, isVerticalOrientation), _defineProperty(_classNames, styles.rotatedVerticalRange, isVerticalOrientation && isSingleRange), _classNames)),
-    children: [!isSingleRange && /*#__PURE__*/jsx(FromInput, {
-      compStyles: computedStyles[RangeSliderControl.FROM_INPUT],
-      isVerticalOrientation: isVerticalOrientation,
-      max: max,
-      disabled: disabled,
-      precision: precision,
-      fromInputRef: fromInputRef,
-      from: from,
-      fromInputValue: fromInputValue,
-      onInputChange: onInputChange,
-      validateInputChange: validateInputChange
-    }), /*#__PURE__*/jsx(Tooltip, {
-      title: tooltipTitle,
-      placement: isHorizontalOrientation ? 'top' : 'left',
-      onMouseMove: handleTooltipMouseMove,
-      PopperProps: {
-        anchorEl: {
-          clientHeight: 0,
-          clientWidth: 0,
-          getBoundingClientRect: function getBoundingClientRect() {
-            return getToolipBoundingClientRect({
-              isHorizontalOrientation: isHorizontalOrientation,
-              railPosition: railPosition,
-              tooltipPosition: tooltipPosition
-            });
-          }
-        }
-      },
-      children: /*#__PURE__*/jsxs("div", {
-        className: classNames(styles.rangeSliderRail, (_classNames2 = {}, _defineProperty(_classNames2, styles.rangeSliderRailHorizontal, isHorizontalOrientation), _defineProperty(_classNames2, styles.rangeSliderRailVertical, isVerticalOrientation), _classNames2)),
-        ref: railRef,
-        children: [!isSingleRange && /*#__PURE__*/jsx("div", {
-          ref: fromThumbRef,
-          className: classNames(styles.rangeSliderThumb, isMobileDetected && styles.mobileRangeSliderThumb),
-          style: computedStyles[RangeSliderControl.FROM],
-          onMouseDown: function onMouseDown(event) {
-            return _onMouseDown(RangeSliderControl.FROM, event);
-          },
-          onMouseEnter: function onMouseEnter() {
-            _onMouseEnter(RangeSliderControl.FROM);
-          },
-          onMouseLeave: function onMouseLeave() {
-            _onMouseLeave(RangeSliderControl.FROM);
-          },
-          children: /*#__PURE__*/jsx("div", {
-            className: styles.rangeSliderLabel
-          })
-        }), /*#__PURE__*/jsx("div", {
-          className: classNames(styles.rangeSliderBar, (_classNames3 = {}, _defineProperty(_classNames3, styles.rangeSliderBarHorizontal, isHorizontalOrientation), _defineProperty(_classNames3, styles.rangeSliderBarVertical, isVerticalOrientation), _classNames3)),
-          style: computedStyles[RangeSliderControl.BAR],
-          onMouseDown: function onMouseDown(event) {
-            return _onMouseDown(RangeSliderControl.BAR, event);
-          },
-          onMouseEnter: function onMouseEnter() {
-            _onMouseEnter(RangeSliderControl.BAR);
-          },
-          onMouseLeave: function onMouseLeave() {
-            _onMouseLeave(RangeSliderControl.BAR);
-          },
-          children: /*#__PURE__*/jsx("div", {
-            className: classNames(styles.rangeSliderBarView, (_classNames4 = {}, _defineProperty(_classNames4, styles.rangeSliderBarViewHorizontal, isHorizontalOrientation), _defineProperty(_classNames4, styles.rangeSliderBarViewVertical, isVerticalOrientation), _classNames4))
-          })
-        }), /*#__PURE__*/jsx("div", {
-          ref: toThumbRef,
-          className: classNames(styles.rangeSliderThumb, isMobileDetected && styles.mobileRangeSliderThumb),
-          style: computedStyles[RangeSliderControl.TO],
-          onMouseDown: function onMouseDown(event) {
-            return _onMouseDown(RangeSliderControl.TO, event);
-          },
-          onMouseEnter: function onMouseEnter() {
-            _onMouseEnter(RangeSliderControl.TO);
-          },
-          onMouseLeave: function onMouseLeave() {
-            _onMouseLeave(RangeSliderControl.TO);
-          },
-          children: /*#__PURE__*/jsx("div", {
-            className: styles.rangeSliderLabel
-          })
-        })]
-      })
-    }), !isSingleRangeWithoutInput && /*#__PURE__*/jsx(ToInput, {
-      compStyles: computedStyles[RangeSliderControl.TO_INPUT],
-      disabled: disabled,
-      isVerticalOrientation: isVerticalOrientation,
-      rotated: isVerticalOrientation && isSingleRange,
-      max: max,
-      precision: precision,
-      toInputRef: toInputRef,
-      to: to,
-      toInputValue: toInputValue,
-      onInputChange: onInputChange,
-      validateInputChange: validateInputChange
-    })]
-  });
-};
-
-export { RangeSlider as default };
-//# sourceMappingURL=RangeSlider.js.map
+import{__assign as e}from'./../../ext-esm/tslib/tslib.es6.js';import{jsxs as n,jsx as t}from"react/jsx-runtime";import{useState as i,useRef as r,useEffect as o}from"react";import a from"classnames";import{round as l,throttle as u}from"lodash";import{Tooltip as c}from"@material-ui/core";import{isMobileDetected as s}from"../../utils/mobileDetect.js";import{horizontalStrategy as m}from"./strategies/horizontal.js";import{verticalStrategy as d}from"./strategies/vertical.js";import{getToolipBoundingClientRect as f,calculatePercentForValue as g,updateToValue as v,calculateValueFromPercent as R,updateFromValue as p}from"./utils.js";import O from"./inputs/FromInput.js";import S from"./inputs/ToInput.js";import{RangeSliderControl as B,DEFAULT_FOCUSED_EL as C,RangeSliderOrientation as T}from"./constants.js";import h from"./RangeSlider.css.js";var M=function(M){var b,I,N,L,x,y=M.from,A=M.to,F=M.disabled,V=void 0!==F&&F,E=M.min,w=void 0===E?0:E,j=M.max,P=void 0===j?100:j,H=M.orientation,z=void 0===H?"horizontal":H,X=M.precision,Y=void 0===X?0:X,_=M.minRange,D=void 0===_?0:_,U=M.onChange,k=void 0===U?function(){}:U,W=M.isSingleRange,Z=void 0!==W&&W,q=M.isWithoutInput,G=void 0!==q&&q,J=i(null),K=J[0],Q=J[1],$=i(null),ee=$[0],ne=$[1],te=i({}),ie=te[0],re=te[1],oe=i(""),ae=oe[0],le=oe[1],ue=i(null),ce=ue[0],se=ue[1],me=i(B.FROM),de=me[0],fe=me[1],ge=i(null),ve=ge[0],Re=ge[1],pe=i({}),Oe=pe[0],Se=pe[1],Be=i(C),Ce=Be[0],Te=Be[1],he=r(null),Me=r(null),be=r(null),Ie=r(null),Ne=r(null),Le=null===(x=he.current)||void 0===x?void 0:x.getBoundingClientRect(),xe=z===T.HORIZONTAL,ye=z===T.VERTICAL,Ae=Z&&G;o((function(){z===T.HORIZONTAL&&se(m),z===T.VERTICAL&&se(d)}),[z]),o((function(){Z&&k({from:0,to:A})}),[Z]),o((function(){var e;if(ce){var n=l(y,Y),t=l(A,Y),i=l(w,Y),r=l(P,Y),o=g(n,i,r),a=g(t,i,r);Se(((e={})[B.FROM]=ce.getThumbStyles(o,de===B.FROM),e[B.TO]=ce.getThumbStyles(a,de===B.TO),e[B.BAR]=ce.getBarStyles(o,a),e[B.FROM_INPUT]=ce.getInputStyles(ve===B.FROM||ve===B.BAR||Ce.from),e[B.TO_INPUT]=ce.getInputStyles(ve===B.TO||ve===B.BAR||Ce.to),e)),Q(n.toString()),ne(t.toString())}}),[ce,w,P,y,A,ve,Ce]);var Fe=function(e){var n=ce.getCoordinates(e,he.current.getBoundingClientRect()),t=g(n.new,n.min,n.max),i=l(R(t,w,P),Y);if(i!==y){var r=p(i,y,A,w,D);k(r)}},Ve=function(e){var n=ye&&Z?ce.getRotatedCoordinates(e,he.current.getBoundingClientRect()):ce.getCoordinates(e,he.current.getBoundingClientRect()),t=g(n.new,n.min,n.max),i=l(R(t,w,P),Y);if(i!==A){var r=v(i,y,A,P,D);k(r)}},Ee=function(e,n){var t=ce.getBarCoordinates(e,n,he.current.getBoundingClientRect()),i=g(t.new,t.min,t.max),r=l(R(i,w,P),Y),o=l(A+(r-y),Y);if(r<w){var a=w-r;r=w,o=l(o+a,Y)}if(o>P){a=o-P;o=P,r=l(r-a,Y)}r!==y&&o!==A&&r>=w&&o<=P&&k({from:r,to:o})},we=function(n){var t;n!==B.BAR?Te(e(e({},C),((t={})[n]=!0,t))):Te({from:!0,bar:!0,to:!0})},je=function(n){var t;n!==B.BAR?Te(e(e({},Ce),((t={})[n]=!1,t))):Te(C)},Pe=function(e,n){if(!(Z&&e===B.BAR||V)){n.stopPropagation(),fe(e),Re(e);var t=n.clientX,i=n.clientY,r=n.target.getBoundingClientRect(),o=r.x,a=r.y,l=u((function(n){!function(e){return e===B.FROM?Fe:e===B.TO?Ve:Ee}(e)(n,{clientX:t,clientY:i,x:o,y:a})}),4);document.addEventListener("mousemove",l),document.addEventListener("mouseup",(function e(){Re(null),document.removeEventListener("mousemove",l),document.removeEventListener("mouseup",e)}))}},He=function(e,n){var t=n.target.value;Number.isNaN(Number(t))||function(e){return e===B.FROM?Q:ne}(e)(t)},ze=function(e,n){var t=n.target.value,i=l(Number(t),Y);if(e===B.FROM){var r=p(i,y,A,w,D);k(r),Q(r.from)}if(e===B.TO){r=v(i,y,A,P,D);k(r),ne(r.to)}},Xe=function(e){if(!(Ce.bar||Ce.from||Ce.to)){var n=e.clientX,t=e.clientY,i=xe?{clientX:n}:{clientY:t},r=ye&&Z?ce.getRotatedCoordinates(i,he.current.getBoundingClientRect()):ce.getCoordinates(i,he.current.getBoundingClientRect()),o=g(r.new,r.min,r.max),a=l(R(o,w,P),Y);k(Z?{from:y,to:a}:{from:y>a?a:y,to:A<a?a:A})}};return o((function(){var e=he.current;return e.addEventListener("click",Xe),function(){return e.removeEventListener("click",Xe)}}),[Z,ce,Ce]),n("div",{className:a((b={},b[h.disabled]=V,b[h.rangeSliderHorizontal]=xe,b[h.rangeSliderVertical]=ye,b[h.rotatedVerticalRange]=ye&&Z,b)),children:[!Z&&t(O,{compStyles:Oe[B.FROM_INPUT],isVerticalOrientation:ye,max:P,disabled:V,precision:Y,fromInputRef:Ie,from:y,fromInputValue:K,onInputChange:He,validateInputChange:ze}),t(c,{title:ae,placement:xe?"top":"left",onMouseMove:function(e){var n=e.clientX,t=e.clientY,i=xe?{clientX:n}:{clientY:t},r=ye&&Z?ce.getRotatedCoordinates(i,he.current.getBoundingClientRect()):ce.getCoordinates(i,he.current.getBoundingClientRect());if(Ce.bar)return le(""),void re({x:n,y:t});var o=g(r.new,r.min,r.max),a=l(R(o,w,P),Y);a<w&&le(w.toString()),a>P&&le(P.toString()),a>=w&&a<=P&&le(a.toString()),re({x:n,y:t})},PopperProps:{anchorEl:{clientHeight:0,clientWidth:0,getBoundingClientRect:function(){return f({isHorizontalOrientation:xe,railPosition:Le,tooltipPosition:ie})}}},children:n("div",{className:a(h.rangeSliderRail,(I={},I[h.rangeSliderRailHorizontal]=xe,I[h.rangeSliderRailVertical]=ye,I)),ref:he,children:[!Z&&t("div",{ref:Me,className:a(h.rangeSliderThumb,s&&h.mobileRangeSliderThumb),style:Oe[B.FROM],onMouseDown:function(e){return Pe(B.FROM,e)},onMouseEnter:function(){we(B.FROM)},onMouseLeave:function(){je(B.FROM)},children:t("div",{className:h.rangeSliderLabel})}),t("div",{className:a(h.rangeSliderBar,(N={},N[h.rangeSliderBarHorizontal]=xe,N[h.rangeSliderBarVertical]=ye,N)),style:Oe[B.BAR],onMouseDown:function(e){return Pe(B.BAR,e)},onMouseEnter:function(){we(B.BAR)},onMouseLeave:function(){je(B.BAR)},children:t("div",{className:a(h.rangeSliderBarView,(L={},L[h.rangeSliderBarViewHorizontal]=xe,L[h.rangeSliderBarViewVertical]=ye,L))})}),t("div",{ref:be,className:a(h.rangeSliderThumb,s&&h.mobileRangeSliderThumb),style:Oe[B.TO],onMouseDown:function(e){return Pe(B.TO,e)},onMouseEnter:function(){we(B.TO)},onMouseLeave:function(){je(B.TO)},children:t("div",{className:h.rangeSliderLabel})})]})}),!Ae&&t(S,{compStyles:Oe[B.TO_INPUT],disabled:V,isVerticalOrientation:ye,rotated:ye&&Z,max:P,precision:Y,toInputRef:Ne,to:A,toInputValue:ee,onInputChange:He,validateInputChange:ze})]})};export{M as default};

package/components/RangeSlider/constants.js

@@ -1,23 +1 @@
-var RangeSliderControl;
-(function (RangeSliderControl) {
-  RangeSliderControl["FROM"] = "from";
-  RangeSliderControl["TO"] = "to";
-  RangeSliderControl["BAR"] = "bar";
-  RangeSliderControl["RAIL"] = "rail";
-  RangeSliderControl["FROM_INPUT"] = "from-input";
-  RangeSliderControl["TO_INPUT"] = "to-input";
-  RangeSliderControl["COMPACT_INPUTS"] = "compact-inputs";
-})(RangeSliderControl || (RangeSliderControl = {}));
-var RangeSliderOrientation = {
-  HORIZONTAL: 'horizontal',
-  VERTICAL: 'vertical'
-};
-var TOOLTIP_MARGIN = 6;
-var DEFAULT_FOCUSED_EL = {
-  from: false,
-  bar: false,
-  to: false
-};
-
-export { DEFAULT_FOCUSED_EL, RangeSliderControl, RangeSliderOrientation, TOOLTIP_MARGIN };
-//# sourceMappingURL=constants.js.map
+var o;!function(o){o.FROM="from",o.TO="to",o.BAR="bar",o.RAIL="rail",o.FROM_INPUT="from-input",o.TO_INPUT="to-input",o.COMPACT_INPUTS="compact-inputs"}(o||(o={}));var r={HORIZONTAL:"horizontal",VERTICAL:"vertical"},t=6,a={from:!1,bar:!1,to:!1};export{a as DEFAULT_FOCUSED_EL,o as RangeSliderControl,r as RangeSliderOrientation,t as TOOLTIP_MARGIN};

package/components/RangeSlider/inputs/FromInput.js

@@ -1,42 +1 @@
-import { round } from 'lodash';
-import { RangeSliderControl } from '../constants.js';
-import styles from '../Input.css.js';
-import { jsx } from 'react/jsx-runtime';
-
-var FromInput = function FromInput(props) {
-  var compStyles = props.compStyles,
-    fromInputRef = props.fromInputRef,
-    disabled = props.disabled,
-    precision = props.precision,
-    from = props.from,
-    fromInputValue = props.fromInputValue,
-    onInputChange = props.onInputChange,
-    validateInputChange = props.validateInputChange;
-  var roundedFrom = round(from, precision);
-  var onKeyDown = function onKeyDown(event) {
-    if (event.key === 'Enter') {
-      validateInputChange(RangeSliderControl.FROM, event);
-    }
-  };
-  return /*#__PURE__*/jsx("div", {
-    children: /*#__PURE__*/jsx("input", {
-      style: compStyles,
-      ref: fromInputRef,
-      disabled: disabled,
-      className: styles.rangeSliderInput,
-      type: "text",
-      size: "".concat(roundedFrom).length || 1,
-      value: fromInputValue,
-      onChange: function onChange(event) {
-        onInputChange(RangeSliderControl.FROM, event);
-      },
-      onBlur: function onBlur(event) {
-        return validateInputChange(RangeSliderControl.FROM, event);
-      },
-      onKeyDown: onKeyDown
-    })
-  });
-};
-
-export { FromInput as default };
-//# sourceMappingURL=FromInput.js.map
+import{round as n}from"lodash";import{RangeSliderControl as t}from"../constants.js";import e from"../Input.css.js";import{jsx as r}from"react/jsx-runtime";var o=function(o){var a=o.compStyles,i=o.fromInputRef,u=o.disabled,s=o.precision,p=o.from,f=o.fromInputValue,l=o.onInputChange,m=o.validateInputChange,c=n(p,s);return r("div",{children:r("input",{style:a,ref:i,disabled:u,className:e.rangeSliderInput,type:"text",size:"".concat(c).length||1,value:f,onChange:function(n){l(t.FROM,n)},onBlur:function(n){return m(t.FROM,n)},onKeyDown:function(n){"Enter"===n.key&&m(t.FROM,n)}})})};export{o as default};

package/components/RangeSlider/inputs/ToInput.js

@@ -1,45 +1 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { round } from 'lodash';
-import classNames from 'classnames';
-import { RangeSliderControl } from '../constants.js';
-import styles from '../Input.css.js';
-import { jsx } from 'react/jsx-runtime';
-
-var ToInput = function ToInput(props) {
-  var compStyles = props.compStyles,
-    rotated = props.rotated,
-    precision = props.precision,
-    toInputRef = props.toInputRef,
-    disabled = props.disabled,
-    to = props.to,
-    toInputValue = props.toInputValue,
-    onInputChange = props.onInputChange,
-    validateInputChange = props.validateInputChange;
-  var roundedTo = round(to, precision);
-  var onKeyDown = function onKeyDown(event) {
-    if (event.key === 'Enter') {
-      validateInputChange(RangeSliderControl.TO, event);
-    }
-  };
-  return /*#__PURE__*/jsx("div", {
-    children: /*#__PURE__*/jsx("input", {
-      style: compStyles,
-      ref: toInputRef,
-      disabled: disabled,
-      className: classNames(styles.rangeSliderInput, _defineProperty({}, styles.rotated, rotated)),
-      type: "text",
-      size: "".concat(roundedTo).length || 1,
-      value: toInputValue,
-      onChange: function onChange(event) {
-        return onInputChange(RangeSliderControl.TO, event);
-      },
-      onBlur: function onBlur(event) {
-        return validateInputChange(RangeSliderControl.TO, event);
-      },
-      onKeyDown: onKeyDown
-    })
-  });
-};
-
-export { ToInput as default };
-//# sourceMappingURL=ToInput.js.map
+import t from"@babel/runtime/helpers/defineProperty";import{round as e}from"lodash";import n from"classnames";import{RangeSliderControl as r}from"../constants.js";import o from"../Input.css.js";import{jsx as a}from"react/jsx-runtime";var i=function(i){var s=i.compStyles,u=i.rotated,p=i.precision,l=i.toInputRef,m=i.disabled,c=i.to,f=i.toInputValue,d=i.onInputChange,h=i.validateInputChange,y=e(c,p);return a("div",{children:a("input",{style:s,ref:l,disabled:m,className:n(o.rangeSliderInput,t({},o.rotated,u)),type:"text",size:"".concat(y).length||1,value:f,onChange:function(t){return d(r.TO,t)},onBlur:function(t){return h(r.TO,t)},onKeyDown:function(t){"Enter"===t.key&&h(r.TO,t)}})})};export{i as default};

package/components/RangeSlider/strategies/horizontal.js

@@ -1,49 +1 @@
-function getCoordinates(event, rect) {
-  return {
-    new: event.clientX,
-    min: rect.x,
-    max: rect.x + rect.width
-  };
-}
-function getBarCoordinates(event, startCoordinates, rect) {
-  var startX = startCoordinates.clientX;
-  var startFromX = startCoordinates.x;
-  var grabOffset = startX - startFromX;
-  return {
-    new: event.clientX - grabOffset,
-    min: rect.x,
-    max: rect.x + rect.width
-  };
-}
-function getThumbStyles(percent, isLastMoved) {
-  return {
-    top: '50%',
-    left: percent < 50 ? "calc(".concat(percent, "% + 3px)") : "calc(".concat(percent, "% - 3px)"),
-    zIndex: isLastMoved ? 10 : 2
-  };
-}
-function getBarStyles(fromPercent, toPercent) {
-  return {
-    left: "".concat(fromPercent, "%"),
-    width: "".concat(toPercent - fromPercent, "%")
-  };
-}
-function getInputStyles(isActive) {
-  if (!isActive) return {};
-  return {
-    border: '1px solid #03BCD4',
-    color: '#ffffff',
-    backgroundColor: '#008ba3',
-    textDecoration: 'underline'
-  };
-}
-var horizontalStrategy = {
-  getCoordinates: getCoordinates,
-  getBarCoordinates: getBarCoordinates,
-  getThumbStyles: getThumbStyles,
-  getBarStyles: getBarStyles,
-  getInputStyles: getInputStyles
-};
-
-export { horizontalStrategy };
-//# sourceMappingURL=horizontal.js.map
+var t={getCoordinates:function(t,n){return{new:t.clientX,min:n.x,max:n.x+n.width}},getBarCoordinates:function(t,n,e){var r=n.clientX-n.x;return{new:t.clientX-r,min:e.x,max:e.x+e.width}},getThumbStyles:function(t,n){return{top:"50%",left:"calc(".concat(t,t<50?"% + 3px)":"% - 3px)"),zIndex:n?10:2}},getBarStyles:function(t,n){return{left:"".concat(t,"%"),width:"".concat(n-t,"%")}},getInputStyles:function(t){return t?{border:"1px solid #03BCD4",color:"#ffffff",backgroundColor:"#008ba3",textDecoration:"underline"}:{}}};export{t as horizontalStrategy};

package/components/RangeSlider/strategies/vertical.js

@@ -1,57 +1 @@
-function getCoordinates(event, rect) {
-  return {
-    new: event.clientY,
-    min: rect.y,
-    max: rect.y + rect.height
-  };
-}
-function getRotatedCoordinates(event, rect) {
-  return {
-    new: rect.y + rect.height - event.clientY + rect.y,
-    min: rect.y,
-    max: rect.y + rect.height
-  };
-}
-function getBarCoordinates(event, startCoordinates, rect) {
-  var startY = startCoordinates.clientY;
-  var startFromY = startCoordinates.y;
-  var grabOffset = startY - startFromY;
-  return {
-    new: event.clientY - grabOffset,
-    min: rect.y,
-    max: rect.y + rect.height
-  };
-}
-function getThumbStyles(percent, isLastMoved) {
-  return {
-    left: '50%',
-    top: percent < 50 ? "calc(".concat(percent, "% + 3px)") : "calc(".concat(percent, "% - 3px)"),
-    zIndex: isLastMoved ? 10 : 2
-  };
-}
-function getBarStyles(fromPercent, toPercent) {
-  return {
-    top: "".concat(fromPercent, "%"),
-    height: "".concat(toPercent - fromPercent, "%")
-  };
-}
-function getInputStyles(isActive) {
-  if (!isActive) return {};
-  return {
-    border: '1px solid #03BCD4',
-    color: '#ffffff',
-    backgroundColor: '#008ba3',
-    textDecoration: 'underline'
-  };
-}
-var verticalStrategy = {
-  getCoordinates: getCoordinates,
-  getRotatedCoordinates: getRotatedCoordinates,
-  getBarCoordinates: getBarCoordinates,
-  getThumbStyles: getThumbStyles,
-  getBarStyles: getBarStyles,
-  getInputStyles: getInputStyles
-};
-
-export { verticalStrategy };
-//# sourceMappingURL=vertical.js.map
+var t={getCoordinates:function(t,n){return{new:t.clientY,min:n.y,max:n.y+n.height}},getRotatedCoordinates:function(t,n){return{new:n.y+n.height-t.clientY+n.y,min:n.y,max:n.y+n.height}},getBarCoordinates:function(t,n,e){var o=n.clientY-n.y;return{new:t.clientY-o,min:e.y,max:e.y+e.height}},getThumbStyles:function(t,n){return{left:"50%",top:"calc(".concat(t,t<50?"% + 3px)":"% - 3px)"),zIndex:n?10:2}},getBarStyles:function(t,n){return{top:"".concat(t,"%"),height:"".concat(n-t,"%")}},getInputStyles:function(t){return t?{border:"1px solid #03BCD4",color:"#ffffff",backgroundColor:"#008ba3",textDecoration:"underline"}:{}}};export{t as verticalStrategy};