{"version":3,"file":"useSliderButton.mjs","sources":["../../../../../packages/components/slider/src/useSliderButton.ts"],"sourcesContent":["import { computed, inject, nextTick, ref, watch } from 'vue'\nimport { debounce } from 'lodash-unified'\nimport { UPDATE_MODEL_EVENT } from '@element-ultra/shared'\nimport { off, on } from '@element-ultra/utils'\n\nimport type { ComputedRef, CSSProperties } from 'vue'\nimport type {\n  ISliderButtonInitData,\n  ISliderButtonProps,\n  ISliderProvider,\n} from './slider.type'\n\nconst useTooltip = (\n  props: ISliderButtonProps,\n  formatTooltip: ComputedRef<(value: number) => number | string>,\n  showTooltip: ComputedRef<boolean>\n) => {\n  const tooltip = ref(null)\n\n  const tooltipVisible = ref(false)\n\n  const enableFormat = computed(() => {\n    return formatTooltip.value instanceof Function\n  })\n\n  const formatValue = computed(() => {\n    return (\n      (enableFormat.value && formatTooltip.value(props.modelValue)) ||\n      props.modelValue\n    )\n  })\n\n  const displayTooltip = debounce(() => {\n    showTooltip.value && (tooltipVisible.value = true)\n  }, 50)\n\n  const hideTooltip = debounce(() => {\n    showTooltip.value && (tooltipVisible.value = false)\n  }, 50)\n\n  return {\n    tooltip,\n    tooltipVisible,\n    formatValue,\n    displayTooltip,\n    hideTooltip,\n  }\n}\n\nexport const useSliderButton = (\n  props: ISliderButtonProps,\n  initData: ISliderButtonInitData,\n  emit\n) => {\n  const {\n    disabled,\n    min,\n    max,\n    step,\n    showTooltip,\n    precision,\n    sliderSize,\n    formatTooltip,\n    emitChange,\n    resetSize,\n    updateDragging,\n  } = inject<ISliderProvider>('SliderProvider')\n\n  const { tooltip, tooltipVisible, formatValue, displayTooltip, hideTooltip } =\n    useTooltip(props, formatTooltip, showTooltip)\n\n  const currentPosition = computed(() => {\n    return `${\n      ((props.modelValue - min.value) / (max.value - min.value)) * 100\n    }%`\n  })\n\n  const wrapperStyle = computed(() => {\n    return (\n      props.vertical\n        ? { bottom: currentPosition.value }\n        : { left: currentPosition.value }\n    ) as CSSProperties\n  })\n\n  const handleMouseEnter = () => {\n    initData.hovering = true\n    displayTooltip()\n  }\n\n  const handleMouseLeave = () => {\n    initData.hovering = false\n    if (!initData.dragging) {\n      hideTooltip()\n    }\n  }\n\n  const onButtonDown = (event: MouseEvent | TouchEvent) => {\n    if (disabled.value) return\n    event.preventDefault()\n    onDragStart(event)\n    on(window, 'mousemove', onDragging)\n    on(window, 'touchmove', onDragging)\n    on(window, 'mouseup', onDragEnd)\n    on(window, 'touchend', onDragEnd)\n    on(window, 'contextmenu', onDragEnd)\n  }\n\n  const onLeftKeyDown = () => {\n    if (disabled.value) return\n    initData.newPosition =\n      parseFloat(currentPosition.value) -\n      (step.value / (max.value - min.value)) * 100\n    setPosition(initData.newPosition)\n    emitChange()\n  }\n\n  const onRightKeyDown = () => {\n    if (disabled.value) return\n    initData.newPosition =\n      parseFloat(currentPosition.value) +\n      (step.value / (max.value - min.value)) * 100\n    setPosition(initData.newPosition)\n    emitChange()\n  }\n\n  const getClientXY = (event: MouseEvent | TouchEvent) => {\n    let clientX: number\n    let clientY: number\n    if (event.type.startsWith('touch')) {\n      clientY = (event as TouchEvent).touches[0].clientY\n      clientX = (event as TouchEvent).touches[0].clientX\n    } else {\n      clientY = (event as MouseEvent).clientY\n      clientX = (event as MouseEvent).clientX\n    }\n    return {\n      clientX,\n      clientY,\n    }\n  }\n\n  const onDragStart = (event: MouseEvent | TouchEvent) => {\n    initData.dragging = true\n    initData.isClick = true\n    const { clientX, clientY } = getClientXY(event)\n    if (props.vertical) {\n      initData.startY = clientY\n    } else {\n      initData.startX = clientX\n    }\n    initData.startPosition = parseFloat(currentPosition.value)\n    initData.newPosition = initData.startPosition\n  }\n\n  const onDragging = (event: MouseEvent | TouchEvent) => {\n    if (initData.dragging) {\n      initData.isClick = false\n      displayTooltip()\n      resetSize()\n      let diff: number\n      const { clientX, clientY } = getClientXY(event)\n      if (props.vertical) {\n        initData.currentY = clientY\n        diff = ((initData.startY - initData.currentY) / sliderSize.value) * 100\n      } else {\n        initData.currentX = clientX\n        diff = ((initData.currentX - initData.startX) / sliderSize.value) * 100\n      }\n      initData.newPosition = initData.startPosition + diff\n      setPosition(initData.newPosition)\n    }\n  }\n\n  const onDragEnd = () => {\n    if (initData.dragging) {\n      /*\n       * 防止在 mouseup 后立即触发 click，导致滑块有几率产生一小段位移\n       * 不使用 preventDefault 是因为 mouseup 和 click 没有注册在同一个 DOM 上\n       */\n      setTimeout(() => {\n        initData.dragging = false\n        if (!initData.hovering) {\n          hideTooltip()\n        }\n        if (!initData.isClick) {\n          setPosition(initData.newPosition)\n          emitChange()\n        }\n      }, 0)\n      off(window, 'mousemove', onDragging)\n      off(window, 'touchmove', onDragging)\n      off(window, 'mouseup', onDragEnd)\n      off(window, 'touchend', onDragEnd)\n      off(window, 'contextmenu', onDragEnd)\n    }\n  }\n\n  const setPosition = async (newPosition: number) => {\n    if (newPosition === null || isNaN(newPosition)) return\n    if (newPosition < 0) {\n      newPosition = 0\n    } else if (newPosition > 100) {\n      newPosition = 100\n    }\n    const lengthPerStep = 100 / ((max.value - min.value) / step.value)\n    const steps = Math.round(newPosition / lengthPerStep)\n    let value =\n      steps * lengthPerStep * (max.value - min.value) * 0.01 + min.value\n    value = parseFloat(value.toFixed(precision.value))\n    emit(UPDATE_MODEL_EVENT, value)\n\n    if (!initData.dragging && props.modelValue !== initData.oldValue) {\n      initData.oldValue = props.modelValue\n    }\n\n    await nextTick()\n    initData.dragging && displayTooltip()\n    tooltip.value.updatePopper()\n  }\n\n  watch(\n    () => initData.dragging,\n    (val) => {\n      updateDragging(val)\n    }\n  )\n\n  return {\n    tooltip,\n    tooltipVisible,\n    showTooltip,\n    wrapperStyle,\n    formatValue,\n    handleMouseEnter,\n    handleMouseLeave,\n    onButtonDown,\n    onLeftKeyDown,\n    onRightKeyDown,\n    setPosition,\n  }\n}\n"],"names":[],"mappings":"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"}