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