fomantic-ui-react/es/_util/useSlider.js

Fomantic-UI React -- A React Component Library.

/**
 * fomantic-ui-react v0.0.1-alpha.10
 * (c) 2022 FireLoong <fireloong@foxmail.com>
 * @license MIT
 */

import { _ as _slicedToArray } from '../_chunks/dep-dc9b74a1.js';
import { useRef, useEffect } from 'react';
import { useMountedState, useSetState } from 'react-use';

var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};

function getDefaultExportFromCjs (x) {
	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
}

function getDefaultExportFromNamespaceIfPresent (n) {
	return n && Object.prototype.hasOwnProperty.call(n, 'default') ? n['default'] : n;
}

function getDefaultExportFromNamespaceIfNotNamed (n) {
	return n && Object.prototype.hasOwnProperty.call(n, 'default') && Object.keys(n).length === 1 ? n['default'] : n;
}

function getAugmentedNamespace(n) {
	if (n.__esModule) return n;
	var a = Object.defineProperty({}, '__esModule', {value: true});
	Object.keys(n).forEach(function (k) {
		var d = Object.getOwnPropertyDescriptor(n, k);
		Object.defineProperty(a, k, d.get ? d : {
			enumerable: true,
			get: function () {
				return n[k];
			}
		});
	});
	return a;
}

function commonjsRequire (path) {
	throw new Error('Could not dynamically require "' + path + '". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rollup/plugin-commonjs appropriately for this require call to work.');
}

var util = {};

"use strict";

Object.defineProperty(util, "__esModule", {
  value: true
});
var isNavigator = util.isNavigator = isBrowser = util.isBrowser = off_1 = util.off = on_1 = util.on = noop_1 = util.noop = void 0;

var noop = function noop() {};

var noop_1 = util.noop = noop;

function on(obj) {
  var args = [];

  for (var _i = 1; _i < arguments.length; _i++) {
    args[_i - 1] = arguments[_i];
  }

  if (obj && obj.addEventListener) {
    obj.addEventListener.apply(obj, args);
  }
}

var on_1 = util.on = on;

function off(obj) {
  var args = [];

  for (var _i = 1; _i < arguments.length; _i++) {
    args[_i - 1] = arguments[_i];
  }

  if (obj && obj.removeEventListener) {
    obj.removeEventListener.apply(obj, args);
  }
}

var off_1 = util.off = off;
var isBrowser = util.isBrowser = typeof window !== 'undefined';
isNavigator = util.isNavigator = typeof navigator !== 'undefined';

var useSlider = function useSlider(ref) {
  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
    start: 0
  };
  var isMounted = useMountedState();
  var isSliding = useRef(false);
  var valueRef = useRef(0);
  var frame = useRef(0);

  var _useSetState = useSetState({
    isSliding: false,
    value: options.start || 0
  }),
      _useSetState2 = _slicedToArray(_useSetState, 2),
      state = _useSetState2[0],
      setState = _useSetState2[1];

  valueRef.current = state.value;
  useEffect(function () {
    if (isBrowser) {
      var styles = options.styles === void 0 ? true : options.styles;
      var reverse = options.reverse === void 0 ? false : options.reverse;

      if (ref.current && styles) {
        ref.current.style.userSelect = "none";
      }

      var startScrubbing = function startScrubbing() {
        if (!isSliding.current && isMounted()) {
          (options.onScrubStart || noop_1)();
          isSliding.current = true;
          setState({
            isSliding: true
          });
          bindEvents();
        }
      };

      var stopScrubbing = function stopScrubbing() {
        if (isSliding.current && isMounted()) {
          (options.onScrubStop || noop_1)(valueRef.current);
          isSliding.current = false;
          setState({
            isSliding: false
          });
          unbindEvents();
        }
      };

      var onMouseDown = function onMouseDown(event) {
        startScrubbing();
        onMouseMove(event);
      };

      var onMouseMove = options.vertical ? function (event) {
        return onScrub(event.clientY);
      } : function (event) {
        return onScrub(event.clientX);
      };

      var onTouchStart = function onTouchStart(event) {
        startScrubbing();
        onTouchMove(event);
      };

      var onTouchMove = options.vertical ? function (event) {
        return onScrub(event.changedTouches[0].clientY);
      } : function (event) {
        return onScrub(event.changedTouches[0].clientX);
      };

      var bindEvents = function bindEvents() {
        on_1(document, "mousemove", onMouseMove);
        on_1(document, "mouseup", stopScrubbing);
        on_1(document, "touchmove", onTouchMove);
        on_1(document, "touchend", stopScrubbing);
      };

      var unbindEvents = function unbindEvents() {
        off_1(document, "mousemove", onMouseMove);
        off_1(document, "mouseup", stopScrubbing);
        off_1(document, "touchmove", onTouchMove);
        off_1(document, "touchend", stopScrubbing);
      };

      var onScrub = function onScrub(clientXY) {
        cancelAnimationFrame(frame.current);
        frame.current = requestAnimationFrame(function () {
          if (isMounted() && ref.current) {
            var rect = ref.current.getBoundingClientRect();
            var pos = options.vertical ? rect.top : rect.left;
            var length = options.vertical ? rect.height : rect.width;

            if (!length) {
              return;
            }

            var value = (clientXY - pos) / length;

            if (value > 1) {
              value = 1;
            } else if (value < 0) {
              value = 0;
            }

            if (reverse) {
              value = 1 - value;
            }

            setState({
              value: value
            });
            (options.onScrub || noop_1)(value);
          }
        });
      };

      on_1(ref.current, "mousedown", onMouseDown);
      on_1(ref.current, "touchstart", onTouchStart);
      return function () {
        off_1(ref.current, "mousedown", onMouseDown);
        off_1(ref.current, "touchstart", onTouchStart);
      };
    } else {
      return void 0;
    }
  }, [ref, options.vertical]);
  return state;
};

export { useSlider as default };
//# sourceMappingURL=useSlider.js.map