{"version":3,"file":"hooks.cjs","sources":["../../../components/native-scroll/hooks.ts"],"sourcesContent":["import { computed, onMounted, reactive, ref, watch } from 'vue'\n\nimport { isHiddenElement, useManualRef, useMounted, useRtl } from '@vexip-ui/hooks'\nimport { boundRange, debounce, debounceMinor, isElement, multipleFixed } from '@vexip-ui/utils'\nimport { animateScrollTo } from './helper'\n\nimport type { Ref } from 'vue'\nimport type { NativeScrollMode } from './symbol'\n\nexport function useScrollWrapper({\n mode,\n disabled,\n appear,\n scrollX,\n scrollY,\n onResize,\n onBeforeRefresh,\n onAfterRefresh,\n}: {\n mode: Ref,\n disabled: Ref,\n appear: Ref,\n // width: Ref,\n // height: Ref,\n scrollX: Ref,\n scrollY: Ref,\n onResize?: (entity: ResizeObserverEntry) => void,\n onBeforeRefresh?: () => void,\n onAfterRefresh?: () => void\n}) {\n const { manualRef, triggerUpdate } = useManualRef()\n\n const { isRtl } = useRtl()\n\n const contentEl = ref()\n\n const content = reactive({\n el: contentEl,\n scrollWidth: 0,\n offsetWidth: 0,\n scrollHeight: 0,\n offsetHeight: 0,\n })\n\n // 当前滚动位置\n const x = manualRef(0)\n const y = manualRef(0)\n\n const percentX = manualRef(0)\n const percentY = manualRef(0)\n\n const xScrollLimit = computed(() => {\n return content.el ? content.scrollWidth - content.offsetWidth : 0\n })\n const yScrollLimit = computed(() => {\n return content.el ? content.scrollHeight - content.offsetHeight : 0\n })\n const enableXScroll = computed(() => {\n return (\n !disabled.value &&\n mode.value !== 'vertical' &&\n !!content.el &&\n content.scrollWidth > content.offsetWidth\n )\n })\n const enableYScroll = computed(() => {\n return (\n !disabled.value &&\n mode.value !== 'horizontal' &&\n !!content.el &&\n content.scrollHeight > content.offsetHeight\n )\n })\n const xBarLength = computed(() => {\n if (content.el) {\n return boundRange((content.offsetWidth / (content.scrollWidth || 1)) * 100, 5, 99)\n }\n\n return 35\n })\n const yBarLength = computed(() => {\n if (content.el) {\n return boundRange((content.offsetHeight / (content.scrollHeight || 1)) * 100, 5, 99)\n }\n\n return 35\n })\n\n watch(contentEl, () => {\n computeContentSize()\n })\n watch(scrollX, value => {\n setScrollX(value)\n })\n watch(scrollY, value => {\n setScrollY(value)\n })\n\n function setScrollX(value: number) {\n x.value = boundRange(value, 0, xScrollLimit.value)\n syncScroll()\n }\n\n function setScrollY(value: number) {\n y.value = boundRange(value, 0, yScrollLimit.value)\n syncScroll()\n }\n\n function syncScroll() {\n if (content.el) {\n content.el.scrollTo({\n top: y.value,\n left: isRtl.value ? -x.value : x.value,\n behavior: 'instant',\n })\n }\n }\n\n const { isMounted } = useMounted()\n\n function computeContentSize() {\n if (!content.el || isHiddenElement(content.el)) return\n\n content.scrollWidth = content.el.scrollWidth\n content.offsetWidth = content.el.offsetWidth\n content.scrollHeight = content.el.scrollHeight\n content.offsetHeight = content.el.offsetHeight\n\n if (mode.value !== 'vertical') {\n setScrollX(!isMounted.value && appear.value ? scrollX.value : x.value || 0)\n }\n\n if (mode.value !== 'horizontal') {\n setScrollY(!isMounted.value && appear.value ? scrollY.value : y.value || 0)\n }\n\n computePercent()\n triggerUpdate()\n }\n\n function computePercent() {\n if (content.el) {\n percentX.value = isRtl.value\n ? -multipleFixed(x.value / (xScrollLimit.value || 1), 100, 2)\n : multipleFixed(x.value / (xScrollLimit.value || 1), 100, 2)\n percentY.value = multipleFixed(y.value / (yScrollLimit.value || 1), 100, 2)\n }\n }\n\n function handleResize(entity: ResizeObserverEntry) {\n refresh()\n onResize?.(entity)\n }\n\n onMounted(() => {\n refresh()\n\n if (appear.value) {\n scrollTo(scrollX.value, scrollY.value)\n }\n })\n\n const refresh = debounceMinor(() => {\n return new Promise(resolve => {\n if (typeof onBeforeRefresh === 'function') {\n onBeforeRefresh()\n }\n\n computeContentSize()\n setTimeout(() => {\n if (typeof onAfterRefresh === 'function') {\n onAfterRefresh()\n }\n\n resolve()\n }, 0)\n })\n })\n\n function scrollTo(clientX: number, clientY: number, duration = 500) {\n return new Promise(resolve => {\n if (!content.el) return\n\n if (!enableXScroll.value || Math.abs(x.value - clientX) < 0.01) {\n clientX = x.value\n }\n\n if (!enableYScroll.value || Math.abs(y.value - clientY) < 0.01) {\n clientY = y.value\n }\n\n animateScrollTo({\n duration,\n el: content.el,\n xFrom: x.value,\n xTo: boundRange(clientX, 0, xScrollLimit.value),\n yFrom: y.value,\n yTo: boundRange(clientY, 0, yScrollLimit.value),\n callback: resolve,\n })\n })\n }\n\n function scrollBy(deltaX: number, deltaY: number, duration = 500) {\n return scrollTo(x.value + deltaX, y.value + deltaY, duration)\n }\n\n function scrollToElement(el: string | Element, duration?: number, offset = 0) {\n if (!content.el) return Promise.resolve()\n\n if (typeof el === 'string') {\n el = content.el.querySelector(el)!\n }\n\n if (!isElement(el)) return Promise.resolve()\n\n const wrapperRect = content.el.getBoundingClientRect()\n const elRect = el.getBoundingClientRect()\n\n let clientX = 0\n let clientY = 0\n\n if (mode.value !== 'vertical') {\n clientX = elRect.left - wrapperRect.left + offset\n }\n\n if (mode.value !== 'horizontal') {\n clientY = elRect.top - wrapperRect.top + offset\n }\n\n return scrollTo(clientX, clientY, duration)\n }\n\n return {\n contentEl,\n\n content,\n x,\n y,\n percentX,\n percentY,\n xScrollLimit,\n yScrollLimit,\n enableXScroll,\n enableYScroll,\n xBarLength,\n yBarLength,\n\n handleResize: debounce(handleResize),\n setScrollX,\n setScrollY,\n computePercent,\n refresh,\n scrollTo,\n scrollBy,\n scrollToElement,\n triggerUpdate,\n }\n}\n"],"names":["useScrollWrapper","mode","disabled","appear","scrollX","scrollY","onResize","onBeforeRefresh","onAfterRefresh","manualRef","triggerUpdate","useManualRef","isRtl","useRtl","contentEl","ref","content","reactive","x","y","percentX","percentY","xScrollLimit","computed","yScrollLimit","enableXScroll","enableYScroll","xBarLength","boundRange","yBarLength","watch","computeContentSize","value","setScrollX","setScrollY","syncScroll","isMounted","useMounted","isHiddenElement","computePercent","multipleFixed","handleResize","entity","refresh","onMounted","scrollTo","debounceMinor","resolve","clientX","clientY","duration","animateScrollTo","scrollBy","deltaX","deltaY","scrollToElement","el","offset","isElement","wrapperRect","elRect","debounce"],"mappings":"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"}