UNPKG

element-plus

Version:

A Component Library for Vue 3

1 lines 9.5 kB
{"version":3,"file":"affix2.mjs","sources":["../../../../../../packages/components/affix/src/affix.vue"],"sourcesContent":["<template>\n <div ref=\"root\" :class=\"ns.b()\" :style=\"rootStyle\">\n <el-teleport :disabled=\"teleportDisabled\" :to=\"appendTo\">\n <div :class=\"{ [ns.m('fixed')]: fixed }\" :style=\"affixStyle\">\n <slot />\n </div>\n </el-teleport>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n computed,\n nextTick,\n onMounted,\n ref,\n shallowRef,\n watch,\n watchEffect,\n} from 'vue'\nimport {\n useElementBounding,\n useEventListener,\n useWindowSize,\n} from '@vueuse/core'\nimport ElTeleport from '@element-plus/components/teleport'\nimport { addUnit, getScrollContainer, throwError } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { CHANGE_EVENT } from '@element-plus/constants'\nimport { affixEmits, affixProps } from './affix'\n\nimport type { CSSProperties } from 'vue'\n\nconst COMPONENT_NAME = 'ElAffix'\ndefineOptions({\n name: COMPONENT_NAME,\n})\nconst props = defineProps(affixProps)\nconst emit = defineEmits(affixEmits)\n\nconst ns = useNamespace('affix')\n\nconst target = shallowRef<HTMLElement>()\nconst root = shallowRef<HTMLDivElement>()\nconst scrollContainer = shallowRef<HTMLElement | Window>()\nconst { height: windowHeight } = useWindowSize()\nconst {\n height: rootHeight,\n width: rootWidth,\n top: rootTop,\n bottom: rootBottom,\n left: rootLeft,\n update: updateRoot,\n} = useElementBounding(root, { windowScroll: false })\nconst targetRect = useElementBounding(target)\n\nconst fixed = ref(false)\nconst scrollTop = ref(0)\nconst transform = ref(0)\n\nconst teleportDisabled = computed(() => {\n return !props.teleported || !fixed.value\n})\n\nconst rootStyle = computed<CSSProperties>(() => {\n return {\n height: fixed.value ? `${rootHeight.value}px` : '',\n width: fixed.value ? `${rootWidth.value}px` : '',\n }\n})\n\nconst affixStyle = computed<CSSProperties>(() => {\n if (!fixed.value) return {}\n\n const offset = addUnit(props.offset)\n return {\n height: `${rootHeight.value}px`,\n width: `${rootWidth.value}px`,\n top: props.position === 'top' ? offset : '',\n bottom: props.position === 'bottom' ? offset : '',\n left: props.teleported ? `${rootLeft.value}px` : '',\n transform: transform.value ? `translateY(${transform.value}px)` : '',\n zIndex: props.zIndex,\n }\n})\n\nconst update = () => {\n if (!scrollContainer.value) return\n\n scrollTop.value =\n scrollContainer.value instanceof Window\n ? document.documentElement.scrollTop\n : scrollContainer.value.scrollTop || 0\n\n const { position, target, offset } = props\n const rootHeightOffset = offset + rootHeight.value\n\n if (position === 'top') {\n if (target) {\n const difference = targetRect.bottom.value - rootHeightOffset\n fixed.value = offset > rootTop.value && targetRect.bottom.value > 0\n transform.value = difference < 0 ? difference : 0\n } else {\n fixed.value = offset > rootTop.value\n }\n } else if (target) {\n const difference =\n windowHeight.value - targetRect.top.value - rootHeightOffset\n fixed.value =\n windowHeight.value - offset < rootBottom.value &&\n windowHeight.value > targetRect.top.value\n transform.value = difference < 0 ? -difference : 0\n } else {\n fixed.value = windowHeight.value - offset < rootBottom.value\n }\n}\n\nconst updateRootRect = async () => {\n if (!fixed.value) {\n updateRoot()\n return\n }\n\n fixed.value = false\n await nextTick()\n updateRoot()\n fixed.value = true\n}\n\nconst handleScroll = async () => {\n updateRoot()\n await nextTick()\n emit('scroll', {\n scrollTop: scrollTop.value,\n fixed: fixed.value,\n })\n}\n\nwatch(fixed, (val) => emit(CHANGE_EVENT, val))\n\nonMounted(() => {\n if (props.target) {\n target.value =\n document.querySelector<HTMLElement>(props.target) ?? undefined\n if (!target.value)\n throwError(COMPONENT_NAME, `Target does not exist: ${props.target}`)\n } else {\n target.value = document.documentElement\n }\n scrollContainer.value = getScrollContainer(root.value!, true)\n updateRoot()\n})\n\nuseEventListener(scrollContainer, 'scroll', handleScroll)\nwatchEffect(update)\n\ndefineExpose({\n /** @description update affix status */\n update,\n /** @description update rootRect info */\n updateRoot: updateRootRect,\n})\n</script>\n"],"names":["target","_openBlock","_createElementBlock","_normalizeClass","_unref","_normalizeStyle","_createVNode","appendTo","_createElementVNode","_renderSlot"],"mappings":"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"}