UNPKG

element-plus

Version:

A Component Library for Vue 3

1 lines 3.19 kB
{"version":3,"file":"use-scrollbar.mjs","names":[],"sources":["../../../../../../../packages/components/table-v2/src/composables/use-scrollbar.ts"],"sourcesContent":["import { ref, unref, watch } from 'vue'\n\nimport type { Ref } from 'vue'\nimport type { Alignment as ScrollStrategy } from '@element-plus/components/virtual-list'\nimport type { TableV2Props } from '../table'\nimport type { TableGridInstance } from '../table-grid'\n\nexport type ScrollPos = { scrollLeft: number; scrollTop: number }\ntype GridInstanceRef = Ref<TableGridInstance | undefined>\n\ntype UseScrollBarProps = {\n mainTableRef: GridInstanceRef\n leftTableRef: GridInstanceRef\n rightTableRef: GridInstanceRef\n\n onMaybeEndReached: () => void\n}\n\nexport type { ScrollStrategy }\n\nexport const useScrollbar = (\n props: TableV2Props,\n {\n mainTableRef,\n leftTableRef,\n rightTableRef,\n onMaybeEndReached,\n }: UseScrollBarProps\n) => {\n const scrollPos = ref<ScrollPos>({ scrollLeft: 0, scrollTop: 0 })\n\n function doScroll(params: ScrollPos) {\n const { scrollTop } = params\n\n mainTableRef.value?.scrollTo(params)\n leftTableRef.value?.scrollToTop(scrollTop)\n rightTableRef.value?.scrollToTop(scrollTop)\n }\n\n // methods\n function scrollTo(params: ScrollPos) {\n scrollPos.value = params\n\n doScroll(params)\n }\n\n function scrollToTop(scrollTop: number) {\n scrollPos.value.scrollTop = scrollTop\n\n doScroll(unref(scrollPos))\n }\n\n function scrollToLeft(scrollLeft: number) {\n scrollPos.value.scrollLeft = scrollLeft\n\n mainTableRef.value?.scrollTo?.(unref(scrollPos))\n }\n\n function onScroll(params: ScrollPos) {\n scrollTo(params)\n props.onScroll?.(params)\n }\n\n function onVerticalScroll({ scrollTop }: ScrollPos) {\n const { scrollTop: currentScrollTop } = unref(scrollPos)\n if (scrollTop !== currentScrollTop) scrollToTop(scrollTop)\n }\n\n function scrollToRow(row: number, strategy: ScrollStrategy = 'auto') {\n mainTableRef.value?.scrollToRow(row, strategy)\n }\n\n // When scrollTop changes, maybe reaching the bottom\n watch(\n () => unref(scrollPos).scrollTop,\n (cur, prev) => {\n if (cur > prev) onMaybeEndReached()\n }\n )\n\n return {\n scrollPos,\n\n scrollTo,\n scrollToLeft,\n scrollToTop,\n scrollToRow,\n onScroll,\n onVerticalScroll,\n }\n}\n"],"mappings":";;;AAoBA,MAAa,gBACX,OACA,EACE,cACA,cACA,eACA,wBAEC;CACH,MAAM,YAAY,IAAe;EAAE,YAAY;EAAG,WAAW;EAAG,CAAC;CAEjE,SAAS,SAAS,QAAmB;EACnC,MAAM,EAAE,cAAc;AAEtB,eAAa,OAAO,SAAS,OAAO;AACpC,eAAa,OAAO,YAAY,UAAU;AAC1C,gBAAc,OAAO,YAAY,UAAU;;CAI7C,SAAS,SAAS,QAAmB;AACnC,YAAU,QAAQ;AAElB,WAAS,OAAO;;CAGlB,SAAS,YAAY,WAAmB;AACtC,YAAU,MAAM,YAAY;AAE5B,WAAS,MAAM,UAAU,CAAC;;CAG5B,SAAS,aAAa,YAAoB;AACxC,YAAU,MAAM,aAAa;AAE7B,eAAa,OAAO,WAAW,MAAM,UAAU,CAAC;;CAGlD,SAAS,SAAS,QAAmB;AACnC,WAAS,OAAO;AAChB,QAAM,WAAW,OAAO;;CAG1B,SAAS,iBAAiB,EAAE,aAAwB;EAClD,MAAM,EAAE,WAAW,qBAAqB,MAAM,UAAU;AACxD,MAAI,cAAc,iBAAkB,aAAY,UAAU;;CAG5D,SAAS,YAAY,KAAa,WAA2B,QAAQ;AACnE,eAAa,OAAO,YAAY,KAAK,SAAS;;AAIhD,aACQ,MAAM,UAAU,CAAC,YACtB,KAAK,SAAS;AACb,MAAI,MAAM,KAAM,oBAAmB;GAEtC;AAED,QAAO;EACL;EAEA;EACA;EACA;EACA;EACA;EACA;EACD"}