You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

0 lines
24 KiB

1 month ago
  1. {"ast":null,"code":"import { inject, ref, computed, nextTick, watch } from 'vue';\nimport { debounce } from 'lodash-unified';\nimport { useEventListener } from '@vueuse/core';\nimport { sliderContextKey } from '../constants.mjs';\nimport { EVENT_CODE } from '../../../../constants/aria.mjs';\nimport { UPDATE_MODEL_EVENT } from '../../../../constants/event.mjs';\nconst useTooltip = (props, formatTooltip, showTooltip) => {\n const tooltip = ref();\n const tooltipVisible = ref(false);\n const enableFormat = computed(() => {\n return formatTooltip.value instanceof Function;\n });\n const formatValue = computed(() => {\n return enableFormat.value && formatTooltip.value(props.modelValue) || props.modelValue;\n });\n const displayTooltip = debounce(() => {\n showTooltip.value && (tooltipVisible.value = true);\n }, 50);\n const hideTooltip = debounce(() => {\n showTooltip.value && (tooltipVisible.value = false);\n }, 50);\n return {\n tooltip,\n tooltipVisible,\n formatValue,\n displayTooltip,\n hideTooltip\n };\n};\nconst useSliderButton = (props, initData, emit) => {\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(sliderContextKey);\n const {\n tooltip,\n tooltipVisible,\n formatValue,\n displayTooltip,\n hideTooltip\n } = useTooltip(props, formatTooltip, showTooltip);\n const button = ref();\n const currentPosition = computed(() => {\n return `${(props.modelValue - min.value) / (max.value - min.value) * 100}%`;\n });\n const wrapperStyle = computed(() => {\n return props.vertical ? {\n bottom: currentPosition.value\n } : {\n left: currentPosition.value\n };\n });\n const handleMouseEnter = () => {\n initData.hovering = true;\n displayTooltip();\n };\n const handleMouseLeave = () => {\n initData.hovering = false;\n if (!initData.dragging) {\n hideTooltip();\n }\n };\n const onButtonDown = event => {\n if (disabled.value) return;\n event.preventDefault();\n onDragStart(event);\n window.addEventListener(\"mousemove\", onDragging);\n window.addEventListener(\"touchmove\", onDragging);\n window.addEventListener(\"mouseup\", onDragEnd);\n window.addEventListener(\"touchend\", onDragEnd);\n window.addEventListener(\"contextmenu\", onDragEnd);\n button.value.focus();\n };\n const incrementPosition = amount => {\n if (disabled.value) return;\n initData.newPosition = Number.parseFloat(currentPosition.value) + amount / (max.value - min.value) * 100;\n setPosition(initData.newPosition);\n emitChange();\n };\n const onLeftKeyDown = () => {\n incrementPosition(-step.value);\n };\n const onRightKeyDown = () => {\n incrementPosition(step.value);\n };\n const onPageDownKeyDown = () => {\n incrementPosition(-step.value * 4);\n };\n const onPageUpKeyDown = () => {\n incrementPosition(step.value * 4);\n };\n const onHomeKeyDown = () => {\n if (disabled.value) return;\n setPosition(0);\n emitChange();\n };\n const onEndKeyDown = () => {\n if (disabled.value) return;\n setPosition(100);\n emitChange();\n };\n const onKeyDown = event => {\n let isPreventDefault = true;\n switch (event.code) {\n case EVENT_CODE.left:\n case EVENT_CODE.down:\n onLeftKeyDown();\n break;\n case EVENT_CODE.right:\n case EVENT_CODE.up:\n onRightKeyDown();\n break;\n case EVENT_CODE.home:\n onHomeKeyDown();\n break;\n case EVENT_CODE.end:\n onEndKeyDown();\n break;\n case EVENT_CODE.pageDown:\n onPageDownKeyDown();\n break;\n case EVENT_CODE.pageUp:\n onPageUpKeyDown();\n break;\n default:\n isPreventDefault = false;\n break;\n }\n isPreventDefault && event.preventDefault();\n };\n const getClientXY = event => {\n let clientX;\n let clientY;\n if (event.type.startsWith(\"touc