"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.sliderTooltipProps = exports.sliderSingleProps = exports.sliderRangeProps = exports.sliderProps = exports.sliderBaseProps = exports.default = void 0;
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _vue = require("vue");
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _ngSlider = _interopRequireWildcard(require("../ng-slider"));
var _type = require("../_util/type");
var _abstractTooltipProps = _interopRequireDefault(require("../tooltip/abstractTooltipProps"));
var _Context = require("./Context");
var _useConfigInject = _interopRequireDefault(require("../config-provider/hooks/useConfigInject"));
var _style = _interopRequireDefault(require("./style"));
var _DisabledContext = require("../config-provider/DisabledContext");
var _useRafLock = _interopRequireDefault(require("./useRafLock"));
var _classNames = _interopRequireDefault(require("../_util/classNames"));
var _raf = _interopRequireDefault(require("../_util/raf"));
var _SliderTooltip = _interopRequireDefault(require("./SliderTooltip"));
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
const sliderProps = () => (0, _extends2.default)((0, _extends2.default)({}, (0, _ngSlider.sliderProps)()), {
  classNames: Object,
  styles: Object
});
exports.sliderProps = sliderProps;
const sliderTooltipProps = () => (0, _extends2.default)((0, _extends2.default)({}, (0, _abstractTooltipProps.default)()), {
  prefixCls: String,
  open: {
    type: Boolean,
    default: undefined
  },
  placement: String,
  getPopupContainer: Function,
  formatter: Function,
  autoAdjustOverflow: {
    type: Boolean,
    default: undefined
  }
});
exports.sliderTooltipProps = sliderTooltipProps;
const sliderBaseProps = () => ({
  prefixCls: String,
  reverse: Boolean,
  min: Number,
  max: Number,
  step: Number,
  marks: Object,
  dots: Boolean,
  included: {
    type: Boolean,
    default: true
  },
  disabled: Boolean,
  keyboard: {
    type: Boolean,
    default: true
  },
  vertical: Boolean,
  className: String,
  rootClassName: String,
  id: String,
  style: Object,
  tooltip: {
    type: Object
  },
  autoFocus: Boolean,
  styles: Object,
  classNames: Object,
  onFocus: Function,
  onBlur: Function,
  /** @deprecated `tooltipPrefixCls` is deprecated. Please use `tooltip.prefixCls` instead. */
  tooltipPrefixCls: String,
  /** @deprecated `tipFormatter` is deprecated. Please use `tooltip.formatter` instead. */
  tipFormatter: Function,
  /** @deprecated `tooltipVisible` is deprecated. Please use `tooltip.open` instead. */
  tooltipVisible: {
    type: Boolean,
    default: undefined
  },
  /**
   * @deprecated `getTooltipPopupContainer` is deprecated. Please use `tooltip.getPopupContainer`
   *   instead.
   */
  getTooltipPopupContainer: Function,
  /** @deprecated `tooltipPlacement` is deprecated. Please use `tooltip.placement` instead. */
  tooltipPlacement: String,
  // Accessibility
  tabIndex: [Number, Array],
  ariaLabelForHandle: [String, Array],
  ariaLabelledByForHandle: [String, Array],
  ariaRequired: {
    type: Boolean,
    default: undefined
  },
  ariaValueTextFormatterForHandle: [Function, Array]
});
exports.sliderBaseProps = sliderBaseProps;
const sliderSingleProps = () => (0, _extends2.default)((0, _extends2.default)({}, sliderBaseProps()), {
  range: Boolean,
  value: Number,
  defaultValue: Number,
  onChange: Function,
  'onUpdate:value': Function,
  /** @deprecated Please use `onChangeComplete` instead */
  onAfterChange: Function,
  onChangeComplete: Function,
  /** @deprecated Please use `styles.handle` instead */
  handleStyle: Object,
  /** @deprecated Please use `styles.track` instead */
  trackStyle: Object,
  /** @deprecated Please use `styles.rail` instead */
  railStyle: Object
});
exports.sliderSingleProps = sliderSingleProps;
const sliderRangeProps = () => (0, _extends2.default)((0, _extends2.default)({}, sliderBaseProps()), {
  range: [Boolean, Object],
  value: Array,
  defaultValue: Array,
  onChange: Function,
  'onUpdate:value': Function,
  /** @deprecated Please use `onChangeComplete` instead */
  onAfterChange: Function,
  onChangeComplete: Function,
  /** @deprecated Please use `styles.handle` instead */
  handleStyle: Array,
  /** @deprecated Please use `styles.track` instead */
  trackStyle: Array,
  /** @deprecated Please use `styles.rail` instead */
  railStyle: Object
});
exports.sliderRangeProps = sliderRangeProps;
const finalSliderProps = () => (0, _extends2.default)((0, _extends2.default)({}, sliderBaseProps()), {
  range: {
    type: [Boolean, Object],
    default: false
  },
  value: [Number, Array],
  defaultValue: [Number, Array],
  onChange: Function,
  'onUpdate:value': Function,
  onAfterChange: Function,
  onChangeComplete: Function,
  handleStyle: [Object, Array],
  trackStyle: [Object, Array]
});
function getTipFormatter(tipFormatter, legacyTipFormatter) {
  if (tipFormatter || tipFormatter === null) {
    return tipFormatter;
  }
  if (legacyTipFormatter || legacyTipFormatter === null) {
    return legacyTipFormatter;
  }
  return val => typeof val === 'number' ? val.toString() : '';
}
const Slider = (0, _vue.defineComponent)({
  name: 'ASlider',
  props: (0, _extends2.default)({}, finalSliderProps()),
  setup(props, {
    expose
  }) {
    const {
      prefixCls,
      direction,
      getPopupContainer,
      configProvider
    } = (0, _useConfigInject.default)('slider', props);
    const disabled = (0, _DisabledContext.useInjectDisabled)();
    const sliderRef = (0, _vue.ref)();
    expose({
      focus: () => {
        var _a;
        return (_a = sliderRef.value) === null || _a === void 0 ? void 0 : _a.focus();
      },
      blur: () => {
        var _a;
        return (_a = sliderRef.value) === null || _a === void 0 ? void 0 : _a.blur();
      }
    });
    const mergedDisabled = (0, _vue.computed)(() => {
      var _a;
      return (_a = props.disabled) !== null && _a !== void 0 ? _a : disabled.value;
    });
    // ============================= Context ==============================
    const {
      handleRender: contextHandleRender,
      direction: internalContextDirection
    } = (0, _Context.useInjectSliderInternal)();
    const mergedDirection = (0, _vue.computed)(() => (internalContextDirection === null || internalContextDirection === void 0 ? void 0 : internalContextDirection.value) || direction.value);
    const isRTL = (0, _vue.computed)(() => mergedDirection.value === 'rtl');
    // =============================== Open ===============================
    const [hoverOpen, setHoverOpen] = (0, _useRafLock.default)();
    const [focusOpen, setFocusOpen] = (0, _useRafLock.default)();
    const tooltipProps = (0, _vue.computed)(() => (0, _extends2.default)({}, props.tooltip));
    const lockOpen = (0, _vue.computed)(() => {
      var _a;
      return (_a = tooltipProps.value.open) !== null && _a !== void 0 ? _a : props.tooltipVisible;
    });
    const activeOpen = (0, _vue.computed)(() => (hoverOpen.value || focusOpen.value) && lockOpen.value !== false);
    const mergedTipFormatter = getTipFormatter(tooltipProps.value.formatter, props.tipFormatter);
    // ============================= Change ==============================
    const [dragging, setDragging] = (0, _useRafLock.default)();
    const onInternalChangeComplete = nextValues => {
      var _a;
      (_a = props.onChangeComplete) === null || _a === void 0 ? void 0 : _a.call(props, nextValues);
      setDragging(false);
    };
    // ============================ Placement ============================
    const getTooltipPlacement = (placement, vert) => {
      if (placement) {
        return placement;
      }
      if (!vert) {
        return 'top';
      }
      return isRTL.value ? 'left' : 'right';
    };
    // ============================== Style ===============================
    const [wrapSSR, hashId] = (0, _style.default)(prefixCls);
    const rootClassNames = (0, _vue.computed)(() => {
      var _a;
      return (0, _classNames.default)(props.className, (_a = props.classNames) === null || _a === void 0 ? void 0 : _a.root, props.rootClassName, {
        [`${prefixCls.value}-rtl`]: isRTL.value,
        [`${prefixCls.value}-lock`]: dragging.value
      }, hashId.value);
    });
    const reverse = (0, _vue.computed)(() => isRTL.value && props.vertical ? !props.reverse : props.reverse);
    // ============================== Handle ==============================
    (0, _vue.onMounted)(() => {
      const onMouseUp = () => {
        (0, _raf.default)(() => {
          setFocusOpen(false);
        }, 1);
      };
      document.addEventListener('mouseup', onMouseUp);
      (0, _vue.onBeforeUnmount)(() => {
        document.removeEventListener('mouseup', onMouseUp);
      });
    });
    const useActiveTooltipHandle = (0, _vue.computed)(() => props.range && !lockOpen.value);
    const handleRender = contextHandleRender || ((node, info) => {
      var _a, _b;
      const {
        index
      } = info;
      const nodeProps = node.props;
      function proxyEvent(eventName, event, triggerRestPropsEvent) {
        var _a, _b, _c, _d;
        if (triggerRestPropsEvent) {
          (_b = (_a = props)[eventName]) === null || _b === void 0 ? void 0 : _b.call(_a, event);
        }
        (_d = (_c = nodeProps)[eventName]) === null || _d === void 0 ? void 0 : _d.call(_c, event);
      }
      const passedProps = (0, _extends2.default)((0, _extends2.default)({}, nodeProps), {
        onMouseenter: e => {
          setHoverOpen(true);
          proxyEvent('onMouseenter', e);
        },
        onMouseleave: e => {
          setHoverOpen(false);
          proxyEvent('onMouseleave', e);
        },
        onMousedown: e => {
          setFocusOpen(true);
          setDragging(true);
          proxyEvent('onMousedown', e);
        },
        onFocus: e => {
          var _a;
          setFocusOpen(true);
          (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, e);
          proxyEvent('onFocus', e, true);
        },
        onBlur: e => {
          var _a;
          setFocusOpen(false);
          (_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props, e);
          proxyEvent('onBlur', e, true);
        }
      });
      const cloneNode = (0, _vue.cloneVNode)(node, (0, _extends2.default)({}, passedProps));
      const open = (!!lockOpen.value || activeOpen.value) && mergedTipFormatter !== null;
      if (!useActiveTooltipHandle.value) {
        return (0, _vue.createVNode)(_SliderTooltip.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, tooltipProps.value), {}, {
          "prefixCls": configProvider.getPrefixCls('tooltip', (_a = tooltipProps.value.prefixCls) !== null && _a !== void 0 ? _a : props.tooltipPrefixCls),
          "title": mergedTipFormatter ? mergedTipFormatter(info.value) : '',
          "value": info.value,
          "open": open,
          "placement": getTooltipPlacement((_b = tooltipProps.value.placement) !== null && _b !== void 0 ? _b : props.tooltipPlacement, props.vertical),
          "key": index,
          "overlayClassName": `${prefixCls.value}-tooltip`,
          "getPopupContainer": tooltipProps.value.getPopupContainer || props.getTooltipPopupContainer || getPopupContainer.value
        }), {
          default: () => [cloneNode]
        });
      }
      return cloneNode;
    });
    // ========================== Active Handle ===========================
    const activeHandleRender = useActiveTooltipHandle.value ? (handle, info) => {
      var _a, _b;
      const cloneNode = (0, _vue.cloneVNode)(handle, {
        style: (0, _extends2.default)((0, _extends2.default)({}, handle.props.style), {
          visibility: 'hidden'
        })
      }, true);
      return (0, _vue.createVNode)(_SliderTooltip.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, tooltipProps.value), {}, {
        "prefixCls": configProvider.getPrefixCls('tooltip', (_a = tooltipProps.value.prefixCls) !== null && _a !== void 0 ? _a : props.tooltipPrefixCls),
        "title": mergedTipFormatter ? mergedTipFormatter(info.value) : '',
        "open": mergedTipFormatter !== null && activeOpen.value,
        "placement": getTooltipPlacement((_b = tooltipProps.value.placement) !== null && _b !== void 0 ? _b : props.tooltipPlacement, props.vertical),
        "key": "tooltip",
        "class": `${prefixCls.value}-tooltip`,
        "getPopupContainer": tooltipProps.value.getPopupContainer || props.getTooltipPopupContainer || getPopupContainer.value,
        "draggingDelete": info.draggingDelete
      }), {
        default: () => [cloneNode]
      });
    } : undefined;
    // ============================== Render ==============================
    return () => {
      var _a, _b, _c, _d, _e;
      const rootStyle = (0, _extends2.default)((0, _extends2.default)({}, (_a = props.styles) === null || _a === void 0 ? void 0 : _a.root), props.style);
      const mergedTracksClassNames = (_b = props.classNames) === null || _b === void 0 ? void 0 : _b.tracks;
      return wrapSSR((0, _vue.createVNode)(_ngSlider.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
        "classNames": {
          handle: (_c = props.classNames) === null || _c === void 0 ? void 0 : _c.handle,
          rail: (_d = props.classNames) === null || _d === void 0 ? void 0 : _d.rail,
          track: (_e = props.classNames) === null || _e === void 0 ? void 0 : _e.track,
          tracks: mergedTracksClassNames
        },
        "styles": props.styles,
        "reverse": reverse.value,
        "step": props.step,
        "range": props.range,
        "className": rootClassNames.value,
        "style": rootStyle,
        "disabled": mergedDisabled.value,
        "ref": sliderRef,
        "prefixCls": prefixCls.value,
        "handleRender": handleRender,
        "activeHandleRender": activeHandleRender,
        "onChangeComplete": onInternalChangeComplete
      }), null));
    };
  }
});
var _default = exports.default = (0, _type.withInstall)(Slider);