@braineet/ui/dist/cjs/components/slider/index.js

Braineet design system

"use strict";

exports.__esModule = true;
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _reactRange = require("react-range");
var _components = require("./components");
var _styles = require("./styles");
var _jsxRuntime = require("react/jsx-runtime");
var _excluded = ["theme", "step", "min", "max", "value", "onChange", "disabled", "containerProps", "marksStep"];
/* eslint-disable react/prop-types */
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
var Slider = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
  var theme = _ref.theme,
    stepValue = _ref.step,
    min = _ref.min,
    max = _ref.max,
    value = _ref.value,
    onChange = _ref.onChange,
    disabled = _ref.disabled,
    containerProps = _ref.containerProps,
    marksStep = _ref.marksStep,
    restProps = _objectWithoutPropertiesLoose(_ref, _excluded);
  var step = stepValue || (max - min) / 100;
  var _React$useState = _react.default.useState([value]),
    val = _React$useState[0],
    setValue = _React$useState[1];
  var handleChange = function handleChange(v) {
    if (onChange) onChange(v);
    setValue(v);
  };
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRange.Range, {
    step: step,
    min: min,
    max: max,
    values: val,
    disabled: disabled,
    onChange: handleChange,
    renderTrack: function renderTrack(_ref2) {
      var props = _ref2.props,
        children = _ref2.children;
      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, _extends({
        onMouseDown: props.onMouseDown,
        onTouchStart: props.onTouchStart,
        disabled: disabled
      }, containerProps, props.style, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Inner, {
          ref: props.ref,
          sliderValues: val,
          minVal: min,
          maxVal: max,
          children: children
        })
      }));
    },
    renderMark: function renderMark(_ref3) {
      var props = _ref3.props,
        index = _ref3.index;
      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Mark, {
        markProps: props,
        index: index,
        min: min,
        max: max,
        step: step,
        value: val,
        marksStep: marksStep
      });
    },
    renderThumb: function renderThumb(_ref4) {
      var props = _ref4.props,
        currentValue = _ref4.value;
      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Thumb, {
        thumbRef: ref,
        props: props,
        value: currentValue,
        max: max,
        min: min,
        restProps: restProps
      });
    }
  });
});
Slider.defaultProps = {
  value: 0,
  step: 1,
  min: 0,
  max: 10,
  marksStep: 1,
  containerProps: {},
  onChange: function onChange() {},
  disabled: false
};
var _default = exports.default = Slider;