vuestic-ui/dist/esm-node/src/components/va-data-table/hooks/useTableScroll.mjs.map

Vue 3 UI Framework

{"version":3,"file":"useTableScroll.mjs","sources":["../../../../../../src/components/va-data-table/hooks/useTableScroll.ts"],"sourcesContent":["import { getCurrentInstance, computed, ExtractPropTypes } from 'vue'\n\nimport { useIntersectionObserver, useElementRef, useNumericProp } from '../../../composables'\n\nexport const useTableScrollProps = {\n  scrollTopMargin: { type: [Number, String], default: 0 },\n  scrollBottomMargin: { type: [Number, String], default: 0 },\n}\n\nexport const useTableScrollEmits = ['scroll:top', 'scroll:bottom']\n\nexport const useTableScroll = (\n  props: ExtractPropTypes<typeof useTableScrollProps>,\n  emit: (event: 'scroll:bottom' | 'scroll:top', ...args: any[]) => void,\n) => {\n  // NOTE: unfortunately, this is not reactive\n  // TODO: replace 'vNodeProps' with '$listeners' when it's available in vue 3\n  const vNodeProps = getCurrentInstance()?.vnode.props\n  const doRenderTopTrigger = vNodeProps?.['onScroll:top'] !== undefined\n  const doRenderBottomTrigger = vNodeProps?.['onScroll:bottom'] !== undefined\n\n  const scrollContainer = useElementRef()\n  const topTrigger = useElementRef()\n  const bottomTrigger = useElementRef()\n  const scrollTopMarginComputed = useNumericProp('scrollTopMargin')\n  const scrollBottomMarginComputed = useNumericProp('scrollBottomMargin')\n\n  const isObservable = computed(() => !!scrollContainer.value)\n\n  const intersectionHandler = (entries: IntersectionObserverEntry[]) => {\n    entries.forEach((entry) => {\n      if (entry.isIntersecting) {\n        entry.target === topTrigger.value\n          ? emit('scroll:top')\n          : emit('scroll:bottom')\n      }\n    })\n  }\n\n  const targets = computed<HTMLElement[]>(() => {\n    const list: HTMLElement[] = []\n\n    if (isObservable.value) {\n      topTrigger.value && list.push(topTrigger.value)\n      bottomTrigger.value && list.push(bottomTrigger.value)\n    }\n\n    return list\n  })\n\n  const options = computed<IntersectionObserverInit>(() => ({\n    root: scrollContainer.value,\n    rootMargin: `${scrollTopMarginComputed.value ?? 0}px 0px ${scrollBottomMarginComputed.value ?? 0}px 0px`,\n  }))\n\n  useIntersectionObserver(intersectionHandler, options, targets)\n\n  return {\n    scrollContainer,\n    topTrigger,\n    bottomTrigger,\n    doRenderTopTrigger,\n    doRenderBottomTrigger,\n  }\n}\n"],"names":[],"mappings":";;;;AAIO,MAAM,sBAAsB;AAAA,EACjC,iBAAiB,EAAE,MAAM,CAAC,QAAQ,MAAM,GAAG,SAAS,EAAE;AAAA,EACtD,oBAAoB,EAAE,MAAM,CAAC,QAAQ,MAAM,GAAG,SAAS,EAAE;AAC3D;AAEa,MAAA,sBAAsB,CAAC,cAAc,eAAe;AAEpD,MAAA,iBAAiB,CAC5B,OACA,SACG;;AAGG,QAAA,cAAa,8BAAA,mBAAsB,MAAM;AACzC,QAAA,sBAAqB,yCAAa,qBAAoB;AACtD,QAAA,yBAAwB,yCAAa,wBAAuB;AAElE,QAAM,kBAAkB;AACxB,QAAM,aAAa;AACnB,QAAM,gBAAgB;AAChB,QAAA,0BAA0B,eAAe,iBAAiB;AAC1D,QAAA,6BAA6B,eAAe,oBAAoB;AAEtE,QAAM,eAAe,SAAS,MAAM,CAAC,CAAC,gBAAgB,KAAK;AAErD,QAAA,sBAAsB,CAAC,YAAyC;AAC5D,YAAA,QAAQ,CAAC,UAAU;AACzB,UAAI,MAAM,gBAAgB;AACxB,cAAM,WAAW,WAAW,QACxB,KAAK,YAAY,IACjB,KAAK,eAAe;AAAA,MAC1B;AAAA,IAAA,CACD;AAAA,EAAA;AAGG,QAAA,UAAU,SAAwB,MAAM;AAC5C,UAAM,OAAsB,CAAA;AAE5B,QAAI,aAAa,OAAO;AACtB,iBAAW,SAAS,KAAK,KAAK,WAAW,KAAK;AAC9C,oBAAc,SAAS,KAAK,KAAK,cAAc,KAAK;AAAA,IACtD;AAEO,WAAA;AAAA,EAAA,CACR;AAEK,QAAA,UAAU,SAAmC,OAAO;AAAA,IACxD,MAAM,gBAAgB;AAAA,IACtB,YAAY,GAAG,wBAAwB,SAAS,CAAC,UAAU,2BAA2B,SAAS,CAAC;AAAA,EAChG,EAAA;AAEsB,0BAAA,qBAAqB,SAAS,OAAO;AAEtD,SAAA;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}