vexip-ui/lib/components/scrollbar/hooks.cjs.map

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

{"version":3,"file":"hooks.cjs","sources":["../../../components/scrollbar/hooks.ts"],"sourcesContent":["import { ref } from 'vue'\n\nimport { USE_TOUCH, noop } from '@vexip-ui/utils'\nimport { ScrollbarType } from './symbol'\n\nimport type { Ref } from 'vue'\n\nexport function useTrack({\n  currentScroll = ref(0),\n  trackSpeed = ref(2),\n  track = ref(null),\n  bar = ref(null),\n  tracking = ref(false),\n  type = ref(ScrollbarType.VERTICAL),\n  barLength = ref(35),\n  disabled = ref(false),\n  onDown = noop,\n  onMove = noop,\n  onUp = noop,\n  onScroll = noop,\n}: {\n  currentScroll: Ref<number>,\n  type: Ref<ScrollbarType>,\n  trackSpeed?: Ref<number>,\n  track?: Ref<HTMLElement | null | undefined>,\n  bar?: Ref<HTMLElement | null | undefined>,\n  tracking?: Ref<boolean>,\n  barLength?: Ref<number>,\n  disabled?: Ref<boolean>,\n  onDown?: (scroll: number) => void,\n  onMove?: (scroll: number) => void,\n  onUp?: (scroll: number) => void,\n  onScroll?: (scroll: number) => void,\n}) {\n  let length: number\n  let startAt: number\n  let cursorAt: number\n  let targetScroll: number\n  let forward = true\n  let processing = false\n\n  function animateMoveBar() {\n    if (!tracking.value) return\n\n    processing = true\n\n    const speedRate = computeSpeedRate(targetScroll, currentScroll.value)\n    let changed = false\n\n    if (forward) {\n      if (currentScroll.value < targetScroll) {\n        currentScroll.value += speedRate * trackSpeed.value\n        changed = true\n      }\n    } else if (currentScroll.value > targetScroll) {\n      currentScroll.value -= speedRate * trackSpeed.value\n      changed = true\n    }\n\n    if (changed) {\n      verifyScroll()\n      onScroll(currentScroll.value)\n    }\n\n    if (\n      tracking.value && forward\n        ? currentScroll.value < targetScroll\n        : currentScroll.value > targetScroll\n    ) {\n      requestAnimationFrame(animateMoveBar)\n    } else {\n      processing = false\n    }\n  }\n\n  function handleMouseDown(event: PointerEvent) {\n    if (disabled.value || event.button > 0) {\n      return false\n    }\n\n    event.stopPropagation()\n    event.preventDefault()\n\n    if (!track.value || !bar.value) return false\n\n    document.addEventListener('pointermove', handleMouseMove)\n    document.addEventListener('pointerup', handleMouseUp)\n\n    const rect = track.value.getBoundingClientRect()\n    const barRect = bar.value.getBoundingClientRect()\n\n    let position: number\n\n    if (type.value === ScrollbarType.VERTICAL) {\n      length = rect.height\n      startAt = barRect.top - rect.top\n      cursorAt = barRect.top\n      position = startAt + event.clientY - cursorAt\n    } else {\n      length = rect.width\n      startAt = barRect.left - rect.left\n      cursorAt = barRect.left\n      position = startAt + event.clientX - cursorAt\n    }\n\n    targetScroll = Math.max(\n      0,\n      Math.min((position / length / (100 - barLength.value / 2)) * 1e4, 100),\n    )\n    forward = targetScroll >= currentScroll.value\n\n    tracking.value = true\n\n    onDown(currentScroll.value)\n    animateMoveBar()\n  }\n\n  function handleMouseMove(event: PointerEvent) {\n    event.stopPropagation()\n\n    if (!USE_TOUCH) {\n      event.preventDefault()\n    }\n\n    onMove(currentScroll.value)\n\n    let position: number\n\n    if (type.value === ScrollbarType.VERTICAL) {\n      position = startAt + event.clientY - cursorAt\n    } else {\n      position = startAt + event.clientX - cursorAt\n    }\n\n    targetScroll = Math.max(\n      0,\n      Math.min((position / length / (100 - barLength.value / 2)) * 1e4, 100),\n    )\n\n    !processing && animateMoveBar()\n  }\n\n  function handleMouseUp(event: PointerEvent) {\n    event.preventDefault()\n\n    document.removeEventListener('pointermove', handleMouseMove)\n    document.removeEventListener('pointerup', handleMouseUp)\n\n    tracking.value = false\n\n    onUp(currentScroll.value)\n  }\n\n  function verifyScroll() {\n    currentScroll.value = Math.max(0, Math.min(currentScroll.value, 100))\n  }\n\n  return {\n    currentScroll,\n    trackSpeed,\n    track,\n    bar,\n    tracking,\n    type,\n    barLength,\n    disabled,\n\n    handleMouseDown,\n  }\n}\n\nfunction computeSpeedRate(start: number, end: number) {\n  const span = Math.abs(start - end)\n\n  for (let i = 0; i < 5; ++i) {\n    if (span < (i + 1) * 20) {\n      return 1 + 0.25 * i\n    }\n  }\n\n  return 2\n}\n"],"names":["useTrack","currentScroll","ref","trackSpeed","track","bar","tracking","type","ScrollbarType","barLength","disabled","onDown","noop","onMove","onUp","onScroll","length","startAt","cursorAt","targetScroll","forward","processing","animateMoveBar","speedRate","computeSpeedRate","changed","verifyScroll","handleMouseDown","event","handleMouseMove","handleMouseUp","rect","barRect","position","USE_TOUCH","start","end","span","i"],"mappings":"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"}