import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, extends as _extends } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
import React__default, { useState } from 'react';
import cls from 'classnames';
import { classes } from '../../Slider.tokens.js';
import { useRangeHandlers } from '../../hooks/useRangeHandlers.js';
import { getTickStyle } from '../../utils/getTickStyle.js';
import { getSingleSliderLayout } from '../../utils/getSingleSliderLayout.js';
import { SingleWrapper, LabelContent, SliderBaseWrapper, StyledRangeValue, SliderContainer, StyledTrack, StyledProgress, StyledRange, StyledCurrentValue, ScaleTicksWrapper, ScaleTick, ScaleTickDot } from './Single.styles.js';
import { LabelWrapper, Label } from '../SliderBase/SliderBase.styles.js';

var _StyledTrack;
var _excluded = ["min", "max", "value", "defaultValue", "name", "step", "label", "labelContentLeft", "labelContent", "labelPlacement", "labelReversed", "showScale", "showRangeValues", "scaleAlign", "hideMinValueDiff", "hideMaxValueDiff", "pointerSize", "pointerVisibility", "showCurrentValue", "currentValueVisibility", "orientation", "sliderAlign", "reversed", "multipleStepSize", "rangeValuesPlacement", "disabled", "onChange", "onChangeCommitted", "ariaLabel", "scaleTicks"];
var clamp = function clamp(value, min, max) {
  return Math.max(min, Math.min(value, max));
};
var SingleSlider = function SingleSlider(_ref) {
  var min = _ref.min,
    max = _ref.max,
    outerValue = _ref.value,
    defaultValue = _ref.defaultValue,
    name = _ref.name,
    _ref$step = _ref.step,
    step = _ref$step === void 0 ? 1 : _ref$step,
    label = _ref.label,
    labelContentLeft = _ref.labelContentLeft,
    labelContent = _ref.labelContent,
    _ref$labelPlacement = _ref.labelPlacement,
    labelPlacement = _ref$labelPlacement === void 0 ? 'top' : _ref$labelPlacement,
    labelReversed = _ref.labelReversed,
    showScale = _ref.showScale,
    showRangeValues = _ref.showRangeValues,
    _ref$scaleAlign = _ref.scaleAlign,
    scaleAlign = _ref$scaleAlign === void 0 ? 'bottom' : _ref$scaleAlign,
    hideMinValueDiff = _ref.hideMinValueDiff,
    hideMaxValueDiff = _ref.hideMaxValueDiff,
    _ref$pointerSize = _ref.pointerSize,
    pointerSize = _ref$pointerSize === void 0 ? 'small' : _ref$pointerSize,
    _ref$pointerVisibilit = _ref.pointerVisibility,
    pointerVisibility = _ref$pointerVisibilit === void 0 ? 'always' : _ref$pointerVisibilit,
    showCurrentValue = _ref.showCurrentValue,
    _ref$currentValueVisi = _ref.currentValueVisibility,
    currentValueVisibility = _ref$currentValueVisi === void 0 ? 'always' : _ref$currentValueVisi,
    _ref$orientation = _ref.orientation,
    orientation = _ref$orientation === void 0 ? 'horizontal' : _ref$orientation,
    _ref$sliderAlign = _ref.sliderAlign,
    sliderAlign = _ref$sliderAlign === void 0 ? 'left' : _ref$sliderAlign,
    reversed = _ref.reversed,
    _ref$multipleStepSize = _ref.multipleStepSize,
    multipleStepSize = _ref$multipleStepSize === void 0 ? 10 : _ref$multipleStepSize,
    rangeValuesPlacementOld = _ref.rangeValuesPlacement,
    disabled = _ref.disabled,
    onChange = _ref.onChange,
    onChangeCommitted = _ref.onChangeCommitted,
    ariaLabel = _ref.ariaLabel,
    scaleTicks = _ref.scaleTicks,
    rest = _objectWithoutProperties(_ref, _excluded);
  var isVertical = orientation === 'vertical';
  var _useState = useState(false),
    _useState2 = _slicedToArray(_useState, 2),
    isHovered = _useState2[0],
    setIsHovered = _useState2[1];
  var clampedOuterValue = outerValue !== undefined ? clamp(outerValue, min, max) : undefined;
  var clampedDefaultValue = defaultValue !== undefined ? clamp(defaultValue, min, max) : undefined;
  var _useState3 = useState(clampedDefaultValue !== null && clampedDefaultValue !== void 0 ? clampedDefaultValue : min),
    _useState4 = _slicedToArray(_useState3, 2),
    dragValue = _useState4[0],
    setDragValue = _useState4[1];
  var value = clampedOuterValue !== null && clampedOuterValue !== void 0 ? clampedOuterValue : dragValue;
  var _getSingleSliderLayou = getSingleSliderLayout({
      value: value,
      min: min,
      max: max,
      isVertical: isVertical,
      isHovered: isHovered,
      reversed: reversed,
      scaleTicks: scaleTicks,
      showRangeValues: showRangeValues,
      showScale: showScale,
      showCurrentValue: showCurrentValue,
      currentValueVisibility: currentValueVisibility,
      label: label,
      labelContentLeft: labelContentLeft,
      labelContent: labelContent,
      labelPlacement: labelPlacement,
      sliderAlign: sliderAlign,
      rangeValuesPlacementOld: rangeValuesPlacementOld,
      scaleAlign: scaleAlign,
      pointerSize: pointerSize,
      pointerVisibility: pointerVisibility
    }),
    innerShowScale = _getSingleSliderLayou.innerShowScale,
    innerShowCurrentValue = _getSingleSliderLayou.innerShowCurrentValue,
    hasLabelContent = _getSingleSliderLayou.hasLabelContent,
    labelPlacementClass = _getSingleSliderLayou.labelPlacementClass,
    rangeValuesPlacement = _getSingleSliderLayou.rangeValuesPlacement,
    scaleAlignClass = _getSingleSliderLayou.scaleAlignClass,
    labelVerticalPlacement = _getSingleSliderLayou.labelVerticalPlacement,
    showPointer = _getSingleSliderLayou.showPointer,
    currentValueStyle = _getSingleSliderLayou.currentValueStyle,
    progressSizeStyle = _getSingleSliderLayou.progressSizeStyle;
  var emitChange = function emitChange(newValue) {
    if (!onChange) return;
    if (outerValue !== undefined || !name) {
      onChange(newValue);
      return;
    }
    onChange({
      target: {
        value: newValue,
        name: name
      }
    });
  };
  var handleTickClick = function handleTickClick(tick) {
    if (disabled) {
      return;
    }
    var clamped = clamp(tick, min, max);
    if (outerValue === undefined) {
      setDragValue(clamped);
    }
    emitChange(clamped);
    if (onChangeCommitted) {
      onChangeCommitted(clamped);
    }
  };
  var _useRangeHandlers = useRangeHandlers({
      min: min,
      max: max,
      value: value,
      step: step,
      multipleStepSize: multipleStepSize,
      isControlled: outerValue !== undefined,
      onSetValue: setDragValue,
      onEmit: emitChange,
      onCommit: onChangeCommitted
    }),
    handleChange = _useRangeHandlers.handleChange,
    handleChangeCommitted = _useRangeHandlers.handleChangeCommitted,
    handleKeyDown = _useRangeHandlers.handleKeyDown;
  return /*#__PURE__*/React__default.createElement(SingleWrapper, {
    className: cls(labelPlacementClass, scaleAlignClass, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, classes.verticalOrientation, isVertical), classes.labelContentReversed, labelReversed), classes.labelPlacementBottom, labelVerticalPlacement === 'bottom'), classes.labelAlignRight, sliderAlign === 'left'), classes.labelAlignLeft, sliderAlign === 'right'), classes.labelAlignCenter, (sliderAlign === 'center' || sliderAlign === 'none') && !scaleTicks), classes.scalePlacementTop, scaleAlign === 'top')),
    hasTicks: Boolean(scaleTicks),
    onPointerEnter: function onPointerEnter() {
      return setIsHovered(true);
    },
    onPointerLeave: function onPointerLeave() {
      return setIsHovered(false);
    }
  }, hasLabelContent && /*#__PURE__*/React__default.createElement(LabelWrapper, null, (labelContentLeft || labelContent) && /*#__PURE__*/React__default.createElement(LabelContent, null, labelContent), label && /*#__PURE__*/React__default.createElement(Label, null, label)), /*#__PURE__*/React__default.createElement(SliderBaseWrapper, {
    className: cls(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, classes.verticalOrientation, isVertical), classes.rangeValuesPlacementInner, !isVertical && rangeValuesPlacement !== 'outer'), classes.rangeValuesPlacementOuter, !isVertical && rangeValuesPlacement === 'outer'), classes.scalePlacementTop, scaleAlign === 'top'))
  }, innerShowScale && /*#__PURE__*/React__default.createElement(StyledRangeValue, {
    className: cls(_defineProperty(_defineProperty({}, classes.hideMinValue, showCurrentValue && (reversed ? hideMaxValueDiff && max - value <= hideMaxValueDiff : hideMinValueDiff && value - min <= hideMinValueDiff)), classes.activeRangeValue, value === min))
  }, reversed ? max : min), /*#__PURE__*/React__default.createElement(SliderContainer, _extends({
    className: cls(isVertical && classes.verticalOrientation, reversed && classes.reversed),
    pointerSize: pointerSize
  }, rest), _StyledTrack || (_StyledTrack = /*#__PURE__*/React__default.createElement(StyledTrack, null)), /*#__PURE__*/React__default.createElement(StyledProgress, {
    style: progressSizeStyle
  }), /*#__PURE__*/React__default.createElement(StyledRange, {
    type: "range",
    name: name,
    value: value,
    min: min,
    max: max,
    step: step,
    disabled: disabled,
    showPointer: showPointer,
    datatype: "slider-single",
    "aria-label": ariaLabel,
    "aria-valuemin": min,
    "aria-valuemax": max,
    "aria-valuenow": value,
    "aria-orientation": orientation,
    onChange: handleChange,
    onMouseUp: handleChangeCommitted,
    onTouchEnd: handleChangeCommitted,
    onKeyUp: handleChangeCommitted,
    onKeyDown: handleKeyDown
  }), innerShowCurrentValue && /*#__PURE__*/React__default.createElement(StyledCurrentValue, {
    style: currentValueStyle
  }, value)), innerShowScale && /*#__PURE__*/React__default.createElement(StyledRangeValue, {
    className: cls(classes.maxRangeValue, _defineProperty(_defineProperty({}, classes.hideMaxValue, showCurrentValue && (reversed ? hideMinValueDiff && value - min <= hideMinValueDiff : hideMaxValueDiff && max - value <= hideMaxValueDiff)), classes.activeRangeValue, value === max))
  }, reversed ? min : max), scaleTicks && /*#__PURE__*/React__default.createElement(ScaleTicksWrapper, {
    isVertical: isVertical,
    reversed: reversed
  }, scaleTicks.map(function (tick) {
    var tickStyle = getTickStyle({
      tick: tick,
      min: min,
      max: max,
      isVertical: isVertical,
      reversed: reversed !== null && reversed !== void 0 ? reversed : false
    });
    return /*#__PURE__*/React__default.createElement(ScaleTick, {
      key: tick,
      tickValue: tick,
      isVertical: isVertical,
      sliderAlign: sliderAlign,
      scaleAlign: scaleAlign,
      style: tickStyle,
      onClick: function onClick() {
        return handleTickClick(tick);
      }
    }, /*#__PURE__*/React__default.createElement(ScaleTickDot, {
      isVertical: isVertical,
      filled: tick <= value,
      reversed: reversed,
      scaleAlign: scaleAlign,
      sliderAlign: sliderAlign
    }));
  }))));
};

export { SingleSlider };
