element-plus/es/components/infinite-scroll/src/index.mjs.map

A Component Library for Vue 3

{"version":3,"file":"index.mjs","sources":["../../../../../../packages/components/infinite-scroll/src/index.ts"],"sourcesContent":["import { nextTick } from 'vue'\nimport { isFunction } from '@vue/shared'\nimport throttle from 'lodash/throttle'\nimport {\n  getScrollContainer,\n  getOffsetTopDistance,\n} from '@element-plus/utils/dom'\nimport { throwError } from '@element-plus/utils/error'\n\nimport type { ObjectDirective, ComponentPublicInstance } from 'vue'\n\nexport const SCOPE = 'ElInfiniteScroll'\nexport const CHECK_INTERVAL = 50\nexport const DEFAULT_DELAY = 200\nexport const DEFAULT_DISTANCE = 0\n\nconst attributes = {\n  delay: {\n    type: Number,\n    default: DEFAULT_DELAY,\n  },\n  distance: {\n    type: Number,\n    default: DEFAULT_DISTANCE,\n  },\n  disabled: {\n    type: Boolean,\n    default: false,\n  },\n  immediate: {\n    type: Boolean,\n    default: true,\n  },\n}\n\ntype Attrs = typeof attributes\ntype ScrollOptions = { [K in keyof Attrs]: Attrs[K]['default'] }\ntype InfiniteScrollCallback = () => void\ntype InfiniteScrollEl = HTMLElement & {\n  [SCOPE]: {\n    container: HTMLElement | Window\n    containerEl: HTMLElement\n    instance: ComponentPublicInstance\n    delay: number // export for test\n    lastScrollTop: number\n    cb: InfiniteScrollCallback\n    onScroll: () => void\n    observer?: MutationObserver\n  }\n}\n\nconst getScrollOptions = (\n  el: HTMLElement,\n  instance: ComponentPublicInstance\n): ScrollOptions => {\n  return Object.entries(attributes).reduce((acm, [name, option]) => {\n    const { type, default: defaultValue } = option\n    const attrVal = el.getAttribute(`infinite-scroll-${name}`)\n    let value = instance[attrVal] ?? attrVal ?? defaultValue\n    value = value === 'false' ? false : value\n    value = type(value)\n    acm[name] = Number.isNaN(value) ? defaultValue : value\n    return acm\n  }, {} as ScrollOptions)\n}\n\nconst destroyObserver = (el: InfiniteScrollEl) => {\n  const { observer } = el[SCOPE]\n\n  if (observer) {\n    observer.disconnect()\n    delete el[SCOPE].observer\n  }\n}\n\nconst handleScroll = (el: InfiniteScrollEl, cb: InfiniteScrollCallback) => {\n  const { container, containerEl, instance, observer, lastScrollTop } =\n    el[SCOPE]\n  const { disabled, distance } = getScrollOptions(el, instance)\n  const { clientHeight, scrollHeight, scrollTop } = containerEl\n  const delta = scrollTop - lastScrollTop\n\n  el[SCOPE].lastScrollTop = scrollTop\n\n  // trigger only if full check has done and not disabled and scroll down\n  if (observer || disabled || delta < 0) return\n\n  let shouldTrigger = false\n\n  if (container === el) {\n    shouldTrigger = scrollHeight - (clientHeight + scrollTop) <= distance\n  } else {\n    // get the scrollHeight since el might be visible overflow\n    const { clientTop, scrollHeight: height } = el\n    const offsetTop = getOffsetTopDistance(el, containerEl)\n    shouldTrigger =\n      scrollTop + clientHeight >= offsetTop + clientTop + height - distance\n  }\n\n  if (shouldTrigger) {\n    cb.call(instance)\n  }\n}\n\nfunction checkFull(el: InfiniteScrollEl, cb: InfiniteScrollCallback) {\n  const { containerEl, instance } = el[SCOPE]\n  const { disabled } = getScrollOptions(el, instance)\n\n  if (disabled) return\n\n  if (containerEl.scrollHeight <= containerEl.clientHeight) {\n    cb.call(instance)\n  } else {\n    destroyObserver(el)\n  }\n}\n\nconst InfiniteScroll: ObjectDirective<\n  InfiniteScrollEl,\n  InfiniteScrollCallback\n> = {\n  async mounted(el, binding) {\n    const { instance, value: cb } = binding\n\n    if (!isFunction(cb)) {\n      throwError(SCOPE, \"'v-infinite-scroll' binding value must be a function\")\n    }\n\n    // ensure parentNode mounted\n    await nextTick()\n\n    const { delay, immediate } = getScrollOptions(el, instance)\n    const container = getScrollContainer(el, true)\n    const containerEl =\n      container === window\n        ? document.documentElement\n        : (container as HTMLElement)\n    const onScroll = throttle(handleScroll.bind(null, el, cb), delay)\n\n    if (!container) return\n\n    el[SCOPE] = {\n      instance,\n      container,\n      containerEl,\n      delay,\n      cb,\n      onScroll,\n      lastScrollTop: containerEl.scrollTop,\n    }\n\n    if (immediate) {\n      const observer = new MutationObserver(\n        throttle(checkFull.bind(null, el, cb), CHECK_INTERVAL)\n      )\n      el[SCOPE].observer = observer\n      observer.observe(el, { childList: true, subtree: true })\n      checkFull(el, cb)\n    }\n\n    container.addEventListener('scroll', onScroll)\n  },\n  unmounted(el) {\n    const { container, onScroll } = el[SCOPE]\n\n    container?.removeEventListener('scroll', onScroll)\n    destroyObserver(el)\n  },\n}\n\nexport default InfiniteScroll\n"],"names":[],"mappings":"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"}