{"version":3,"file":"ScrollAreaScrollbar.js","sources":["../../src/ScrollArea/ScrollAreaScrollbar.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport { createContext, useForwardExpose } from '@/shared'\n\nexport interface ScrollAreaScrollbarProps extends PrimitiveProps {\n  /** The orientation of the scrollbar */\n  orientation?: 'vertical' | 'horizontal'\n  /**\n   * Used to force mounting when more control is needed. Useful when\n   * controlling animation with Vue animation libraries.\n   */\n  forceMount?: boolean\n}\n\nexport interface ScrollAreaScollbarContext {\n  as: Ref<PrimitiveProps['as']>\n  orientation: Ref<'vertical' | 'horizontal'>\n  forceMount?: Ref<boolean>\n  isHorizontal: Ref<boolean>\n  asChild: Ref<boolean>\n}\n\nexport const [injectScrollAreaScrollbarContext, provideScrollAreaScrollbarContext]\n  = createContext<ScrollAreaScollbarContext>('ScrollAreaScrollbar')\n</script>\n\n<script setup lang=\"ts\">\nimport {\n  computed,\n  onUnmounted,\n  toRefs,\n  watch,\n} from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport ScrollAreaScrollbarAuto from './ScrollAreaScrollbarAuto.vue'\nimport ScrollAreaScrollbarHover from './ScrollAreaScrollbarHover.vue'\nimport ScrollAreaScrollbarScroll from './ScrollAreaScrollbarScroll.vue'\nimport ScrollAreaScrollbarVisible from './ScrollAreaScrollbarVisible.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<ScrollAreaScrollbarProps>(), {\n  orientation: 'vertical',\n  as: 'div',\n})\n\nconst { forwardRef } = useForwardExpose()\nconst rootContext = injectScrollAreaRootContext()\n\nconst isHorizontal = computed(() => props.orientation === 'horizontal')\n\nwatch(\n  isHorizontal,\n  () => {\n    if (isHorizontal.value)\n      rootContext.onScrollbarXEnabledChange(true)\n    else rootContext.onScrollbarYEnabledChange(true)\n  },\n  { immediate: true },\n)\n\nonUnmounted(() => {\n  rootContext.onScrollbarXEnabledChange(false)\n  rootContext.onScrollbarYEnabledChange(false)\n})\n\nconst { orientation, forceMount, asChild, as } = toRefs(props)\nprovideScrollAreaScrollbarContext({\n  orientation,\n  forceMount,\n  isHorizontal,\n  as,\n  asChild,\n})\n</script>\n\n<template>\n  <ScrollAreaScrollbarHover\n    v-if=\"rootContext.type.value === 'hover'\"\n    v-bind=\"$attrs\"\n    :ref=\"forwardRef\"\n    :force-mount=\"forceMount\"\n  >\n    <slot />\n  </ScrollAreaScrollbarHover>\n  <ScrollAreaScrollbarScroll\n    v-else-if=\"rootContext.type.value === 'scroll'\"\n    v-bind=\"$attrs\"\n    :ref=\"forwardRef\"\n    :force-mount=\"forceMount\"\n  >\n    <slot />\n  </ScrollAreaScrollbarScroll>\n  <ScrollAreaScrollbarAuto\n    v-else-if=\"rootContext.type.value === 'auto'\"\n    v-bind=\"$attrs\"\n    :ref=\"forwardRef\"\n    :force-mount=\"forceMount\"\n  >\n    <slot />\n  </ScrollAreaScrollbarAuto>\n  <ScrollAreaScrollbarVisible\n    v-else-if=\"rootContext.type.value === 'always'\"\n    v-bind=\"$attrs\"\n    :ref=\"forwardRef\"\n    data-state=\"visible\"\n  >\n    <slot />\n  </ScrollAreaScrollbarVisible>\n</template>\n"],"names":[],"mappings":";;;;;;;;;AAuBO,MAAM,CAAC,gCAAA,EAAkC,iCAAiC,CAAA,GAC7E,cAAyC,qBAAqB;;;;;;;;;;;;;AAoBlE,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAM,MAAA,EAAE,UAAW,EAAA,GAAI,gBAAiB,EAAA;AACxC,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAEhD,IAAA,MAAM,YAAe,GAAA,QAAA,CAAS,MAAM,KAAA,CAAM,gBAAgB,YAAY,CAAA;AAEtE,IAAA,KAAA;AAAA,MACE,YAAA;AAAA,MACA,MAAM;AACJ,QAAA,IAAI,YAAa,CAAA,KAAA;AACf,UAAA,WAAA,CAAY,0BAA0B,IAAI,CAAA;AAAA,aACvC,WAAA,CAAY,0BAA0B,IAAI,CAAA;AAAA,OACjD;AAAA,MACA,EAAE,WAAW,IAAK;AAAA,KACpB;AAEA,IAAA,WAAA,CAAY,MAAM;AAChB,MAAA,WAAA,CAAY,0BAA0B,KAAK,CAAA;AAC3C,MAAA,WAAA,CAAY,0BAA0B,KAAK,CAAA;AAAA,KAC5C,CAAA;AAED,IAAA,MAAM,EAAE,WAAa,EAAA,UAAA,EAAY,SAAS,EAAG,EAAA,GAAI,OAAO,KAAK,CAAA;AAC7D,IAAkC,iCAAA,CAAA;AAAA,MAChC,WAAA;AAAA,MACA,UAAA;AAAA,MACA,YAAA;AAAA,MACA,EAAA;AAAA,MACA;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}