1 line
12 KiB
Plaintext
1 line
12 KiB
Plaintext
|
{"version":3,"file":"scrollStrategies.mjs","names":["effectScope","nextTick","onScopeDispose","watchEffect","requestNewFrame","convertToUnit","getScrollParents","hasScrollbar","IN_BROWSER","propsFactory","scrollStrategies","none","close","closeScrollStrategy","block","blockScrollStrategy","reposition","repositionScrollStrategy","makeScrollStrategyProps","scrollStrategy","type","String","Function","default","validator","val","useScrollStrategies","props","data","scope","stop","isActive","value","active","run","onScroll","e","bindScroll","targetEl","contentEl","offsetParent","root","scrollElements","Set","contained","undefined","filter","el","classList","contains","scrollbarWidth","window","innerWidth","document","documentElement","offsetWidth","scrollableParent","add","forEach","i","style","setProperty","scrollLeft","scrollTop","x","parseFloat","getPropertyValue","y","scrollBehavior","removeProperty","remove","slow","raf","ric","update","start","performance","now","updateLocation","time","requestIdleCallback","cb","cancelAnimationFrame","requestAnimationFrame","cancelIdleCallback","addEventListener","passive","removeEventListener"],"sources":["../../../src/components/VOverlay/scrollStrategies.ts"],"sourcesContent":["// Utilities\nimport { effectScope, nextTick, onScopeDispose, watchEffect } from 'vue'\nimport { requestNewFrame } from './requestNewFrame'\nimport { convertToUnit, getScrollParents, hasScrollbar, IN_BROWSER, propsFactory } from '@/util'\n\n// Types\nimport type { EffectScope, PropType, Ref } from 'vue'\n\nexport interface ScrollStrategyData {\n root: Ref<HTMLElement | undefined>\n contentEl: Ref<HTMLElement | undefined>\n targetEl: Ref<HTMLElement | undefined>\n isActive: Ref<boolean>\n updateLocation: Ref<((e: Event) => void) | undefined>\n}\n\ntype ScrollStrategyFn = (data: ScrollStrategyData, props: StrategyProps, scope: EffectScope) => void\n\nconst scrollStrategies = {\n none: null,\n close: closeScrollStrategy,\n block: blockScrollStrategy,\n reposition: repositionScrollStrategy,\n}\n\nexport interface StrategyProps {\n scrollStrategy: keyof typeof scrollStrategies | ScrollStrategyFn\n contained: boolean | undefined\n}\n\nexport const makeScrollStrategyProps = propsFactory({\n scrollStrategy: {\n type: [String, Function] as PropType<StrategyProps['scrollStrategy']>,\n default: 'block',\n validator: (val: any) => typeof val === 'function' || val in scrollStrategies,\n },\n}, 'VOverlay-scroll-strategies')\n\nexport function useScrollStrategies (\n props: StrategyProps,\n data: ScrollStrategyData\n) {\n if (!IN_BROWSER) return\n\n let scope: EffectScope | undefined\n watchEffect(async () => {\n scope?.stop()\n\n if (!(data.isActive.value && props.scrollStrategy)) return\n\n scope = effectScope()\n await nextTick()\n scope.active && scope.run(() => {\n if (typeof props.scrollStrategy === 'function') {\n props.scrollStrategy(data, props, scope!)\n } else {\n scrollStrategies[props.scrollStrategy]?.(data, props, scope!)\n }\n })\n })\n\n onScopeDispose(() => {\n scope?.stop()\n })\n}\n\nfunction closeScrollStrategy (data: ScrollStrategyData) {\n function onScroll (e: Event) {\n data.isActive.value = false\n }\n\n bindScroll(data.targetEl.value ?? data.contentEl.value, onScroll)\n}\n\nfunction blockScrollStrategy (data: ScrollStrategyData, props: StrategyProps) {\n const offsetParent = data.root.value?.offsetParent\n const scrollElements = [...new Set([\n ...getScrollParents(data.targetEl.value, props.contained ? offsetParent : undefined),\n ...getScrollParents(data.contentEl.value, props.contained ? offsetParent : undefined),\n ])].filter(el => !el.classList.contains('v-overlay-scroll-blocked'))\n const scrollbarWidth = window.innerWidth - document.documentElement.offsetWidth\n\n const scrollableParent = (el => hasScrollbar(el) && el)(offsetParent || document.documentElement)\n if (scrollableParent) {\n data.root.value!.classList.add('v-overlay--scroll-blocked')\n }\n\n scrollElements.forEach((el, i) => {\n
|