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.
1 lines
12 KiB
1 lines
12 KiB
{"ast":null,"code":"import { defineComponent, shallowRef, ref, computed, watch, onMounted, watchEffect, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, createElementVNode, renderSlot } from 'vue';\nimport { useWindowSize, useElementBounding, useEventListener } from '@vueuse/core';\nimport { affixProps, affixEmits } from './affix2.mjs';\nimport _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';\nimport { useNamespace } from '../../../hooks/use-namespace/index.mjs';\nimport { getScrollContainer } from '../../../utils/dom/scroll.mjs';\nimport { addUnit } from '../../../utils/dom/style.mjs';\nimport { throwError } from '../../../utils/error.mjs';\nconst COMPONENT_NAME = \"ElAffix\";\nconst __default__ = defineComponent({\n name: COMPONENT_NAME\n});\nconst _sfc_main = /* @__PURE__ */defineComponent({\n ...__default__,\n props: affixProps,\n emits: affixEmits,\n setup(__props, {\n expose,\n emit\n }) {\n const props = __props;\n const ns = useNamespace(\"affix\");\n const target = shallowRef();\n const root = shallowRef();\n const scrollContainer = shallowRef();\n const {\n height: windowHeight\n } = useWindowSize();\n const {\n height: rootHeight,\n width: rootWidth,\n top: rootTop,\n bottom: rootBottom,\n update: updateRoot\n } = useElementBounding(root, {\n windowScroll: false\n });\n const targetRect = useElementBounding(target);\n const fixed = ref(false);\n const scrollTop = ref(0);\n const transform = ref(0);\n const rootStyle = computed(() => {\n return {\n height: fixed.value ? `${rootHeight.value}px` : \"\",\n width: fixed.value ? `${rootWidth.value}px` : \"\"\n };\n });\n const affixStyle = computed(() => {\n if (!fixed.value) return {};\n const offset = props.offset ? addUnit(props.offset) : 0;\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 transform: transform.value ? `translateY(${transform.value}px)` : \"\",\n zIndex: props.zIndex\n };\n });\n const update = () => {\n if (!scrollContainer.value) return;\n scrollTop.value = scrollContainer.value instanceof Window ? document.documentElement.scrollTop : scrollContainer.value.scrollTop || 0;\n const {\n position,\n target: target2,\n offset\n } = props;\n const rootHeightOffset = offset + rootHeight.value;\n if (position === \"top\") {\n if (target2) {\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 (target2) {\n const difference = windowHeight.value - targetRect.top.value - rootHeightOffset;\n fixed.value = windowHeight.value - offset < rootBottom.value && 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 const handleScroll = () => {\n updateRoot();\n emit(\"scroll\", {\n scrollTop: scrollTop.value,\n fixed: fixed.value\n });\n };\n watch(fixed, val => emit(\"change\", val));\n onMounted(() => {\n var _a;\n if (props.target) {\n target.value = (_a = document.querySelector(props.target)) != null ? _a : void 0;\n if (!target.value) 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 useEventListener(scrollContainer, \"scroll\", handleScroll);\n watchEffect(update);\n expose({\n update,\n updateRoot\n });\n return (_ctx, _cache) => {\n return openBlock(), createElementBlock(\"div\", {\n ref_key: \"root\",\n ref: root,\n class: normalizeClass(unref(ns).b()),\n style: normalizeStyle(unref(rootStyle))\n }, [createElementVNode(\"div\", {\n class: normalizeClass({\n [unref(ns).m(\"fixed\")]: fixed.value\n }),\n style: normalizeStyle(unref(affixStyle))\n }, [renderSlot(_ctx.$slots, \"default\")], 6)], 6);\n };\n }\n});\nvar Affix = /* @__PURE__ */_export_sfc(_sfc_main, [[\"__file\", \"affix.vue\"]]);\nexport { Affix as default };","map":{"version":3,"names":["name","COMPONENT_NAME","ns","useNamespace","target","shallowRef","root","scrollContainer","height","windowHeight","useWindowSize","rootHeight","width","rootWidth","top","rootTop","bottom","rootBottom","update","updateRoot","useElementBounding","windowScroll","targetRect","fixed","ref","scrollTop","transform","rootStyle","computed","value","affixStyle","offset","props","addUnit","position","zIndex","Window","document","documentElement","target2","rootHeightOffset","difference","handleScroll","emit","watch","val","onMounted","_a","querySelector","throwError","getScrollContainer","useEventListener","watchEffect","expose"],"sources":["../../../../../../packages/components/affix/src/affix.vue"],"sourcesContent":["<template>\n <div ref=\"root\" :class=\"ns.b()\" :style=\"rootStyle\">\n <div :class=\"{ [ns.m('fixed')]: fixed }\" :style=\"affixStyle\">\n <slot />\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, onMounted, ref, shallowRef, watch, watchEffect } from 'vue'\nimport {\n useElementBounding,\n useEventListener,\n useWindowSize,\n} from '@vueuse/core'\nimport { addUnit, getScrollContainer, throwError } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { affixEmits, affixProps } from './affix'\nimport type { CSSProperties } from 'vue'\n\nconst COMPONENT_NAME = 'ElAffix'\ndefineOptions({\n name: COMPONENT_NAME,\n})\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 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 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 = props.offset ? addUnit(props.offset) : 0\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 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 handleScroll = () => {\n updateRoot()\n emit('scroll', {\n scrollTop: scrollTop.value,\n fixed: fixed.value,\n })\n}\n\nwatch(fixed, (val) => emit('change', 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,\n})\n</script>\n"],"mappings":";;;;;;;;;mCAqBc;EACZA,IAAM,EAAAC;AACR;;;;;;;;;;IAKM,MAAAC,EAAA,GAAKC,YAAA,CAAa,OAAO;IAE/B,MAAMC,MAAA,GAASC,UAAwB;IACvC,MAAMC,IAAA,GAAOD,UAA2B;IACxC,MAAME,eAAA,GAAkBF,UAAiC;IACzD,MAAM;MAAEG,MAAA,EAAQC;IAAa,IAAIC,aAAc;IACzC;MACJF,MAAQ,EAAAG,UAAA;MACRC,KAAO,EAAAC,SAAA;MACPC,GAAK,EAAAC,OAAA;MACLC,MAAQ,EAAAC,UAAA;MACRC,MAAQ,EAAAC;IAAA,IACNC,kBAAmB,CAAAd,IAAA,EAAM;MAAEe,YAAA,EAAc;IAAA,CAAO;IAC9C,MAAAC,UAAA,GAAaF,kBAAA,CAAmBhB,MAAM;IAEtC,MAAAmB,KAAA,GAAQC,GAAA,CAAI,KAAK;IACjB,MAAAC,SAAA,GAAYD,GAAA,CAAI,CAAC;IACjB,MAAAE,SAAA,GAAYF,GAAA,CAAI,CAAC;IAEjB,MAAAG,SAAA,GAAYC,QAAA,CAAwB,MAAM;MACvC;QACLpB,MAAA,EAAQe,KAAM,CAAAM,KAAA,GAAQ,GAAGlB,UAAA,CAAWkB,KAAK,IAAO;QAChDjB,KAAA,EAAOW,KAAM,CAAAM,KAAA,GAAQ,GAAGhB,SAAA,CAAUgB,KAAK,IAAO;MAAA,CAChD;IAAA,CACD;IAEK,MAAAC,UAAA,GAAaF,QAAA,CAAwB,MAAM;MAC/C,IAAI,CAACL,KAAA,CAAMM,KAAO,EAElB;MACO,MAAAE,MAAA,GAAAC,KAAA,CAAAD,MAAA,GAAAE,OAAA,CAAAD,KAAA,CAAAD,MAAA;MACL;QACAvB,MAAA,EAAU,GAAAG,UAAe,CAAAkB,KAAA;QACzBjB,KAAK,KAAAC,SAAmB,CAAAgB,KAAA;QACxBf,GAAQ,EAAAkB,KAAA,CAAAE,QAAmB,aAAAH,MAAW,GAAS;QAC/Cf,MAAA,EAAAgB,KAAqB,CAAAE,QAAA,aAAsB,GAAAH,MAAA;QAC3CL,SAAc,EAAAA,SAAA,CAAAG,KAAA,iBAAAH,SAAA,CAAAG,KAAA;QAChBM,MAAA,EAAAH,KAAA,CAAAG;MAAA,CACD;IAED;IACM,MAAAjB,MAAA,GAAAA,CAAA;MAEM,KAAAX,eAAA,CAAAsB,KAAA,EAKV;MACMJ,SAAA,CAAAI,KAAA,GAAAtB,eAAA,CAA4BsB,KAAW,YAAAO,MAAA,GAAAC,QAAA,CAAAC,eAAA,CAAAb,SAAA,GAAAlB,eAAA,CAAAsB,KAAA,CAAAJ,SAAA;MAE7C;QAAAS,QAAA;QAAwB9B,MAAA,EAAAmC,OAAA;QAAAR;MAAA,IAAAC,KAAA;MACtB,MAAIQ,gBAAQ,GAAAT,MAAA,GAAApB,UAAA,CAAAkB,KAAA;MACJ,IAAAK,QAAA,YAAwB;QAC9B,IAAAK,OAAA;UACU,MAAAE,UAAA,GAAqBnB,UAAA,CAAAN,MAAiB,CAAAa,KAAA,GAAAW,gBAAA;UAC3CjB,KAAA,CAAAM,KAAA,GAAAE,MAAA,GAAAhB,OAAA,CAAAc,KAAA,IAAAP,UAAA,CAAAN,MAAA,CAAAa,KAAA;UACCH,SAAA,CAAAG,KAAA,GAAAY,UAAyB,OAAAA,UAAA;QAAA,CACjC;UAAAlB,KAAA,CAAAM,KACiB,GAAAE,MAAA,GAAAhB,OAAA,CAAAc,KAAA;QACjB;MAEA,CAAM,UAAAU,OAAA;QAGN,MAAAE,UAAkB,GAAAhC,YAAa,CAAIoB,KAAc,GAAAP,UAAA,CAAAR,GAAA,CAAAe,KAAA,GAAAW,gBAAA;QAC5CjB,KAAA,CAAAM,KAAA,GAAApB,YAAA,CAAAoB,KAAA,GAAAE,MAAA,GAAAd,UAAA,CAAAY,KAAA,IAAApB,YAAA,CAAAoB,KAAA,GAAAP,UAAA,CAAAR,GAAA,CAAAe,KAAA;QACLH,SAAc,CAAAG,KAAA,GAAAY,UAAqB,QAAAA,UAAoB;MAAA,CACzD;QACFlB,KAAA,CAAAM,KAAA,GAAApB,YAAA,CAAAoB,KAAA,GAAAE,MAAA,GAAAd,UAAA,CAAAY,KAAA;MAEA;IACE,CAAW;IACX,MAAAa,YAAe,GAAAA,CAAA;MAAAvB,UAAA;MACQwB,IAAA,SACR;QACdlB,SAAA,EAAAA,SAAA,CAAAI,KAAA;QACHN,KAAA,EAAAA,KAAA,CAAAM;MAEA;IAEA;IACEe,KAAA,CAAIrB,KAAA,EAAcsB,GAAA,IAAAF,IAAA,WAAAE,GAAA;IAChBC,SAAA,OACE;MACF,IAAAC,EAAI;MACF,IAAAf,KAAA,CAAA5B,MAA2B;QACxBA,MAAA,CAAAyB,KAAA,IAAAkB,EAAA,GAAAV,QAAA,CAAAW,aAAA,CAAAhB,KAAA,CAAA5B,MAAA,aAAA2C,EAAA;QACL,KAAA3C,MAAA,CAAAyB,KAAwB,EAC1BoB,UAAA,CAAAhD,cAAA,4BAAA+B,KAAA,CAAA5B,MAAA;MACA;QACWA,MAAA,CAAAyB,KAAA,GAAAQ,QAAA,CAAAC,eAAA;MAAA;MAGI/B,eAAA,CAAAsB,KAAA,GAAAqB,kBAA2B,CAAY5C,IAAA,CAAAuB,KAAA;MACxDV,UAAY,EAAM;IAElB,CAAa;IAAAgC,gBAAA,CAAA5C,eAAA,YAAAmC,YAAA;IAEXU,WAAA,CAAAlC,MAAA;IAAAmC,MAAA;MAEAnC,MAAA;MACDC","ignoreList":[]},"metadata":{},"sourceType":"module","externalDependencies":[]}
|