{"version":3,"file":"scrollbar.mjs","sources":["../../../../../../packages/components/scrollbar/src/scrollbar.vue"],"sourcesContent":["<template>\n  <div ref=\"scrollbarRef\" :class=\"namespace\">\n    <div\n      ref=\"wrapRef\"\n      :class=\"[\n        wrapClass,\n        'scrollbar-wrap',\n        native ? '' : 'scrollbar-wrap-hidden',\n      ]\"\n      :style=\"style\"\n      @scroll=\"handleScroll\"\n    >\n      <component\n        :is=\"tag\"\n        :id=\"id\"\n        ref=\"resizeRef\"\n        :class=\"['scrollbar-view', viewClass]\"\n        :style=\"viewStyle\"\n        :role=\"role\"\n        :aria-label=\"ariaLabel\"\n        :aria-orientation=\"ariaOrientation\"\n      >\n        <slot></slot>\n      </component>\n    </div>\n    <template v-if=\"!native\">\n      <bar ref=\"barRef\" :always=\"always\" :min-size=\"minSize\" />\n    </template>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  nextTick,\n  onActivated,\n  onMounted,\n  provide,\n  ref,\n  watch,\n  reactive,\n  onUpdated,\n} from 'vue'\nimport { useResizeObserver, useEventListener } from '@vueuse/core'\nimport { debugWarn, addUnit, isNumber, isObject } from '@hongluan-ui/utils'\nimport { useNamespace } from '@hongluan-ui/hooks'\nimport { scrollbarContextKey } from '@hongluan-ui/tokens'\nimport Bar from './bar.vue'\n\nimport { scrollbarProps } from './scrollbar'\nimport type { StyleValue, CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'Scrollbar',\n  components: {\n    Bar,\n  },\n  props: scrollbarProps,\n  emits: ['scroll', 'at-end'],\n\n  setup(props, { emit }) {\n    let stopResizeObserver: (() => void) | undefined = undefined\n    let stopResizeListener: (() => void) | undefined = undefined\n    let wrapScrollTop = 0\n    let wrapScrollLeft = 0\n    let oldScrollTop = Number.MAX_SAFE_INTEGER\n\n    const scrollbarRef = ref<HTMLDivElement>()\n    const wrapRef = ref<HTMLDivElement>()\n    const resizeRef = ref<HTMLElement>()\n    const barRef = ref()\n\n    const SCOPE = 'Scrollbar'\n\n    const style = computed<StyleValue>(() => {\n      const style: CSSProperties = {}\n      if (props.height) style.height = addUnit(props.height)\n      if (props.maxHeight) style.maxHeight = addUnit(props.maxHeight)\n      return [props.wrapStyle, style]\n    })\n\n    const handleScroll = () => {\n      if (wrapRef.value) {\n        barRef.value?.handleScroll(wrapRef.value)\n        wrapScrollTop = wrapRef.value.scrollTop\n        wrapScrollLeft = wrapRef.value.scrollLeft\n\n        emit('scroll', {\n          scrollTop: wrapRef.value.scrollTop,\n          scrollLeft: wrapRef.value.scrollLeft,\n        })\n\n        if (wrapRef.value.scrollTop > oldScrollTop && wrapRef.value.scrollTop + wrapRef.value.offsetHeight + props.distance >= wrapRef.value.scrollHeight) {\n          emit('at-end', { vertical: true })\n        }\n        oldScrollTop = wrapRef.value.scrollTop\n      }\n    }\n\n    function scrollTo(xCord: number, yCord?: number): void\n    function scrollTo(options: ScrollToOptions): void\n    function scrollTo(arg1: unknown, arg2?: number) {\n      if (isObject(arg1)) {\n        wrapRef.value.scrollTo(arg1)\n      } else if (isNumber(arg1) && isNumber(arg2)) {\n        wrapRef.value.scrollTo(arg1, arg2)\n      }\n    }\n\n    const setScrollTop = (value: number) => {\n      if (!isNumber(value)) {\n        debugWarn(SCOPE, 'value must be a number')\n        return\n      }\n      wrapRef.value.scrollTop = value\n    }\n\n    const setScrollLeft = (value: number) => {\n      if (!isNumber(value)) {\n        debugWarn(SCOPE, 'value must be a number')\n        return\n      }\n      wrapRef.value.scrollLeft = value\n    }\n\n    const update = () => {\n      barRef.value?.update()\n    }\n\n    watch(\n      () => props.noresize,\n      noresize => {\n        if (noresize) {\n          stopResizeObserver?.()\n          stopResizeListener?.()\n        } else {\n          ({ stop: stopResizeObserver } = useResizeObserver(resizeRef, update))\n          stopResizeListener = useEventListener('resize', update)\n        }\n      },\n      { immediate: true },\n    )\n\n    provide(\n      scrollbarContextKey,\n      reactive({\n        scrollbarElement: scrollbarRef,\n        wrapElement: wrapRef,\n      }),\n    )\n    onActivated(() => {\n      wrapRef.value!.scrollTop = wrapScrollTop\n      wrapRef.value!.scrollLeft = wrapScrollLeft\n    })\n\n    onMounted(() => {\n      if (!props.native) {\n        nextTick(() => {\n          update()\n        })\n      }\n    })\n    onUpdated(() => update())\n\n    const { namespace } = useNamespace('scrollbar')\n    return {\n      namespace,\n      scrollbarRef,\n      wrapRef,\n      resizeRef,\n      barRef,\n\n      style,\n      update,\n      handleScroll,\n      setScrollTop,\n      setScrollLeft,\n      scrollTo,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAoDA,MAAK,YAAa,gBAAa;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA;AACF,EACA,OAAO;AAAA,EACP,OAAO,CAAC,UAAU,QAAQ;AAAA,EAE1B,MAAM,OAAO,EAAE,QAAQ;AACrB,QAAI,qBAA+C;AACnD,QAAI,qBAA+C;AACnD,QAAI,gBAAgB;AACpB,QAAI,iBAAiB;AACrB,QAAI,eAAe,OAAO;AAE1B,UAAM,eAAe;AACrB,UAAM,UAAU;AAChB,UAAM,YAAY;AAClB,UAAM,SAAS;AAEf,UAAM,QAAQ;AAEd,UAAM,QAAQ,SAAqB,MAAM;AACvC,YAAM,SAAuB;AAC7B,UAAI,MAAM;AAAQ,eAAM,SAAS,QAAQ,MAAM,MAAM;AACrD,UAAI,MAAM;AAAW,eAAM,YAAY,QAAQ,MAAM,SAAS;AAC9D,aAAO,CAAC,MAAM,WAAW,MAAK;AAAA,KAC/B;AAED,UAAM,eAAe,MAAM;AACzB,UAAI;AACF;AACA,sCAA8B;AAC9B;AAEA;AAAe,qBACF;AAAc,UACzB;AAA0B;AAG5B;AACE,yBAAe;AAAkB;AAEnC;AAA6B;AAC/B;AAKF;AACE,0BAAoB;AAClB;AAA2B,8BACL,KAAK;AAC3B,+BAAuB;AAAU;AACnC;AAGF;AACE,UAAI,eAAe;AACjB,yBAAiB;AACjB;AAAA;AAEF;AAA0B;AAG5B;AACE,UAAI;AACF,yBAAiB;AACjB;AAAA;AAEF;AAA2B;AAG7B;AACE;AAAqB;AAGvB;AAGI;AACE;AACA;AAAqB;AAErB,QAAC;AACD;AAAsD;AACxD,0BAGJ;AAEA;AAEW,wBACW;AAAA;AACL,MAEjB;AACA;AACE;AACA;AAA4B;AAG9B,cAAU,MAAM;AACd;AACE;AACE,iBAAO;AAAA,QACT;AAAC;AACH;AAEF;AAEA;AACA;AAAO;AACL;AACA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AACF;AAEJ;;;2CAxJQ;AAAA;AA3BG;AAAgC;IACvC;AAsBM;AArBA;AACE;AAAY;QAA6C,cAAM;AAAA;aAK/D;AAAO;AACJ;qBAET;AACU;AACH;AACD,QACH;AAAmC,QACnC;AAAgB,QAChB;AAAM,QACN;AAAY,QACZ;AAAkB;0BAEnB,MAAa;AAAA;AAAA;;;;;AAI0C;;AAAhD,MAAU;AAAQ,MAAS;AAAU;;;;;;;;;"}