reka-ui 2.1.1 → 2.2.1

package/dist/RovingFocus/RovingFocusItem.js

@@ -1,6 +1,6 @@
-import { defineComponent, computed, onMounted, onUnmounted, openBlock, createBlock, unref, withCtx, createVNode, renderSlot, nextTick } from 'vue';
-import { g as getFocusIntent, w as wrapArray, f as focusFirst } from './utils.js';
+import { defineComponent, computed, onMounted, onUnmounted, createBlock, openBlock, unref, withCtx, createVNode, renderSlot, nextTick } from 'vue';
 import { u as useCollection } from '../Collection/Collection.js';
+import { g as getFocusIntent, w as wrapArray, f as focusFirst } from './utils.js';
 import { i as injectRovingFocusGroupContext } from './RovingFocusGroup.js';
 import { u as useId } from '../shared/useId.js';
 import { P as Primitive } from '../Primitive/Primitive.js';
@@ -10,7 +10,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   props: {
     tabStopId: {},
     focusable: { type: Boolean, default: true },
-    active: { type: Boolean, default: true },
+    active: { type: Boolean },
     allowShiftKey: { type: Boolean },
     asChild: { type: Boolean },
     as: { default: "span" }
@@ -44,7 +44,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         context.orientation.value,
         context.dir.value
       );
-      if (focusIntent !== undefined) {
+      if (focusIntent !== void 0) {
         if (event.metaKey || event.ctrlKey || event.altKey || (props.allowShiftKey ? false : event.shiftKey))
           return;
         event.preventDefault();
@@ -68,8 +68,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           createVNode(unref(Primitive), {
             tabindex: isCurrentTabStop.value ? 0 : -1,
             "data-orientation": unref(context).orientation.value,
-            "data-active": _ctx.active,
-            "data-disabled": !_ctx.focusable ? "" : undefined,
+            "data-active": _ctx.active ? "" : void 0,
+            "data-disabled": !_ctx.focusable ? "" : void 0,
             as: _ctx.as,
             "as-child": _ctx.asChild,
             onMousedown: _cache[0] || (_cache[0] = (event) => {

package/dist/RovingFocus/RovingFocusItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"RovingFocusItem.js","sources":["../../src/RovingFocus/RovingFocusItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface RovingFocusItemProps extends PrimitiveProps {\n  tabStopId?: string\n  focusable?: boolean\n  active?: boolean\n  allowShiftKey?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, nextTick, onMounted, onUnmounted } from 'vue'\nimport { injectRovingFocusGroupContext } from './RovingFocusGroup.vue'\nimport { Primitive } from '@/Primitive'\nimport { focusFirst, getFocusIntent, wrapArray } from './utils'\nimport { useId } from '@/shared'\nimport { useCollection } from '@/Collection'\n\nconst props = withDefaults(defineProps<RovingFocusItemProps>(), {\n  focusable: true,\n  active: true,\n  as: 'span',\n})\n\nconst context = injectRovingFocusGroupContext()\nconst randomId = useId()\nconst id = computed(() => props.tabStopId || randomId)\nconst isCurrentTabStop = computed(\n  () => context.currentTabStopId.value === id.value,\n)\n\nconst { getItems, CollectionItem } = useCollection()\n\nonMounted(() => {\n  if (props.focusable)\n    context.onFocusableItemAdd()\n})\nonUnmounted(() => {\n  if (props.focusable)\n    context.onFocusableItemRemove()\n})\n\nfunction handleKeydown(event: KeyboardEvent) {\n  if (event.key === 'Tab' && event.shiftKey) {\n    context.onItemShiftTab()\n    return\n  }\n\n  if (event.target !== event.currentTarget)\n    return\n\n  const focusIntent = getFocusIntent(\n    event,\n    context.orientation.value,\n    context.dir.value,\n  )\n\n  if (focusIntent !== undefined) {\n    if (event.metaKey || event.ctrlKey || event.altKey || (props.allowShiftKey ? false : event.shiftKey))\n      return\n    event.preventDefault()\n    let candidateNodes = [...getItems().map(i => i.ref).filter(i => i.dataset.disabled !== '')]\n\n    if (focusIntent === 'last') {\n      candidateNodes.reverse()\n    }\n    else if (focusIntent === 'prev' || focusIntent === 'next') {\n      if (focusIntent === 'prev')\n        candidateNodes.reverse()\n      const currentIndex = candidateNodes.indexOf(\n        event.currentTarget as HTMLElement,\n      )\n\n      candidateNodes = context.loop.value\n        ? wrapArray(candidateNodes, currentIndex + 1)\n        : candidateNodes.slice(currentIndex + 1)\n    }\n\n    nextTick(() => focusFirst(candidateNodes))\n  }\n}\n</script>\n\n<template>\n  <CollectionItem>\n    <Primitive\n      :tabindex=\"isCurrentTabStop ? 0 : -1\"\n      :data-orientation=\"context.orientation.value\"\n      :data-active=\"active\"\n      :data-disabled=\"!focusable ? '' : undefined\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      @mousedown=\"\n        (event) => {\n          // We prevent focusing non-focusable items on `mousedown`.\n          // Even though the item has tabIndex={-1}, that only means take it out of the tab order.\n          if (!focusable) event.preventDefault();\n          // Safari doesn't focus a button when clicked so we run our logic on mousedown also\n          else context.onItemFocus(id);\n        }\n      \"\n      @focus=\"context.onItemFocus(id)\"\n      @keydown=\"handleKeydown\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionItem>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAmBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAMd,IAAA,MAAM,UAAU,6BAA8B,EAAA;AAC9C,IAAA,MAAM,WAAW,KAAM,EAAA;AACvB,IAAA,MAAM,EAAK,GAAA,QAAA,CAAS,MAAM,KAAA,CAAM,aAAa,QAAQ,CAAA;AACrD,IAAA,MAAM,gBAAmB,GAAA,QAAA;AAAA,MACvB,MAAM,OAAA,CAAQ,gBAAiB,CAAA,KAAA,KAAU,EAAG,CAAA;AAAA,KAC9C;AAEA,IAAA,MAAM,EAAE,QAAA,EAAU,cAAe,EAAA,GAAI,aAAc,EAAA;AAEnD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,KAAM,CAAA,SAAA;AACR,QAAA,OAAA,CAAQ,kBAAmB,EAAA;AAAA,KAC9B,CAAA;AACD,IAAA,WAAA,CAAY,MAAM;AAChB,MAAA,IAAI,KAAM,CAAA,SAAA;AACR,QAAA,OAAA,CAAQ,qBAAsB,EAAA;AAAA,KACjC,CAAA;AAED,IAAA,SAAS,cAAc,KAAsB,EAAA;AAC3C,MAAA,IAAI,KAAM,CAAA,GAAA,KAAQ,KAAS,IAAA,KAAA,CAAM,QAAU,EAAA;AACzC,QAAA,OAAA,CAAQ,cAAe,EAAA;AACvB,QAAA;AAAA;AAGF,MAAI,IAAA,KAAA,CAAM,WAAW,KAAM,CAAA,aAAA;AACzB,QAAA;AAEF,MAAA,MAAM,WAAc,GAAA,cAAA;AAAA,QAClB,KAAA;AAAA,QACA,QAAQ,WAAY,CAAA,KAAA;AAAA,QACpB,QAAQ,GAAI,CAAA;AAAA,OACd;AAEA,MAAA,IAAI,gBAAgB,SAAW,EAAA;AAC7B,QAAI,IAAA,KAAA,CAAM,WAAW,KAAM,CAAA,OAAA,IAAW,MAAM,MAAW,KAAA,KAAA,CAAM,aAAgB,GAAA,KAAA,GAAQ,KAAM,CAAA,QAAA,CAAA;AACzF,UAAA;AACF,QAAA,KAAA,CAAM,cAAe,EAAA;AACrB,QAAA,IAAI,iBAAiB,CAAC,GAAG,QAAS,EAAA,CAAE,IAAI,CAAK,CAAA,KAAA,CAAA,CAAE,GAAG,CAAA,CAAE,OAAO,CAAK,CAAA,KAAA,CAAA,CAAE,OAAQ,CAAA,QAAA,KAAa,EAAE,CAAC,CAAA;AAE1F,QAAA,IAAI,gBAAgB,MAAQ,EAAA;AAC1B,UAAA,cAAA,CAAe,OAAQ,EAAA;AAAA,SAEhB,MAAA,IAAA,WAAA,KAAgB,MAAU,IAAA,WAAA,KAAgB,MAAQ,EAAA;AACzD,UAAA,IAAI,WAAgB,KAAA,MAAA;AAClB,YAAA,cAAA,CAAe,OAAQ,EAAA;AACzB,UAAA,MAAM,eAAe,cAAe,CAAA,OAAA;AAAA,YAClC,KAAM,CAAA;AAAA,WACR;AAEA,UAAiB,cAAA,GAAA,OAAA,CAAQ,IAAK,CAAA,KAAA,GAC1B,SAAU,CAAA,cAAA,EAAgB,YAAe,GAAA,CAAC,CAC1C,GAAA,cAAA,CAAe,KAAM,CAAA,YAAA,GAAe,CAAC,CAAA;AAAA;AAG3C,QAAS,QAAA,CAAA,MAAM,UAAW,CAAA,cAAc,CAAC,CAAA;AAAA;AAC3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"RovingFocusItem.js","sources":["../../src/RovingFocus/RovingFocusItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface RovingFocusItemProps extends PrimitiveProps {\n  tabStopId?: string\n  /**\n   * When `false`, item will not be focusable.\n   * @defaultValue `true`\n   */\n  focusable?: boolean\n  /** When `true`, item will be initially focused. */\n  active?: boolean\n  /** When `true`, shift + arrow key will allow focusing on next/previous item. */\n  allowShiftKey?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { useCollection } from '@/Collection'\nimport { Primitive } from '@/Primitive'\nimport { useId } from '@/shared'\nimport { computed, nextTick, onMounted, onUnmounted } from 'vue'\nimport { injectRovingFocusGroupContext } from './RovingFocusGroup.vue'\nimport { focusFirst, getFocusIntent, wrapArray } from './utils'\n\nconst props = withDefaults(defineProps<RovingFocusItemProps>(), {\n  focusable: true,\n  as: 'span',\n})\n\nconst context = injectRovingFocusGroupContext()\nconst randomId = useId()\nconst id = computed(() => props.tabStopId || randomId)\nconst isCurrentTabStop = computed(\n  () => context.currentTabStopId.value === id.value,\n)\n\nconst { getItems, CollectionItem } = useCollection()\n\nonMounted(() => {\n  if (props.focusable)\n    context.onFocusableItemAdd()\n})\nonUnmounted(() => {\n  if (props.focusable)\n    context.onFocusableItemRemove()\n})\n\nfunction handleKeydown(event: KeyboardEvent) {\n  if (event.key === 'Tab' && event.shiftKey) {\n    context.onItemShiftTab()\n    return\n  }\n\n  if (event.target !== event.currentTarget)\n    return\n\n  const focusIntent = getFocusIntent(\n    event,\n    context.orientation.value,\n    context.dir.value,\n  )\n\n  if (focusIntent !== undefined) {\n    if (event.metaKey || event.ctrlKey || event.altKey || (props.allowShiftKey ? false : event.shiftKey))\n      return\n    event.preventDefault()\n    let candidateNodes = [...getItems().map(i => i.ref).filter(i => i.dataset.disabled !== '')]\n\n    if (focusIntent === 'last') {\n      candidateNodes.reverse()\n    }\n    else if (focusIntent === 'prev' || focusIntent === 'next') {\n      if (focusIntent === 'prev')\n        candidateNodes.reverse()\n      const currentIndex = candidateNodes.indexOf(\n        event.currentTarget as HTMLElement,\n      )\n\n      candidateNodes = context.loop.value\n        ? wrapArray(candidateNodes, currentIndex + 1)\n        : candidateNodes.slice(currentIndex + 1)\n    }\n\n    nextTick(() => focusFirst(candidateNodes))\n  }\n}\n</script>\n\n<template>\n  <CollectionItem>\n    <Primitive\n      :tabindex=\"isCurrentTabStop ? 0 : -1\"\n      :data-orientation=\"context.orientation.value\"\n      :data-active=\"active ? '' : undefined\"\n      :data-disabled=\"!focusable ? '' : undefined\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      @mousedown=\"\n        (event) => {\n          // We prevent focusing non-focusable items on `mousedown`.\n          // Even though the item has tabIndex={-1}, that only means take it out of the tab order.\n          if (!focusable) event.preventDefault();\n          // Safari doesn't focus a button when clicked so we run our logic on mousedown also\n          else context.onItemFocus(id);\n        }\n      \"\n      @focus=\"context.onItemFocus(id)\"\n      @keydown=\"handleKeydown\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionItem>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAyBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAA,MAAM,UAAU,6BAA8B,EAAA;AAC9C,IAAA,MAAM,WAAW,KAAM,EAAA;AACvB,IAAA,MAAM,EAAK,GAAA,QAAA,CAAS,MAAM,KAAA,CAAM,aAAa,QAAQ,CAAA;AACrD,IAAA,MAAM,gBAAmB,GAAA,QAAA;AAAA,MACvB,MAAM,OAAA,CAAQ,gBAAiB,CAAA,KAAA,KAAU,EAAG,CAAA;AAAA,KAC9C;AAEA,IAAA,MAAM,EAAE,QAAA,EAAU,cAAe,EAAA,GAAI,aAAc,EAAA;AAEnD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,KAAM,CAAA,SAAA;AACR,QAAA,OAAA,CAAQ,kBAAmB,EAAA;AAAA,KAC9B,CAAA;AACD,IAAA,WAAA,CAAY,MAAM;AAChB,MAAA,IAAI,KAAM,CAAA,SAAA;AACR,QAAA,OAAA,CAAQ,qBAAsB,EAAA;AAAA,KACjC,CAAA;AAED,IAAA,SAAS,cAAc,KAAsB,EAAA;AAC3C,MAAA,IAAI,KAAM,CAAA,GAAA,KAAQ,KAAS,IAAA,KAAA,CAAM,QAAU,EAAA;AACzC,QAAA,OAAA,CAAQ,cAAe,EAAA;AACvB,QAAA;AAAA;AAGF,MAAI,IAAA,KAAA,CAAM,WAAW,KAAM,CAAA,aAAA;AACzB,QAAA;AAEF,MAAA,MAAM,WAAc,GAAA,cAAA;AAAA,QAClB,KAAA;AAAA,QACA,QAAQ,WAAY,CAAA,KAAA;AAAA,QACpB,QAAQ,GAAI,CAAA;AAAA,OACd;AAEA,MAAA,IAAI,gBAAgB,MAAW,EAAA;AAC7B,QAAI,IAAA,KAAA,CAAM,WAAW,KAAM,CAAA,OAAA,IAAW,MAAM,MAAW,KAAA,KAAA,CAAM,aAAgB,GAAA,KAAA,GAAQ,KAAM,CAAA,QAAA,CAAA;AACzF,UAAA;AACF,QAAA,KAAA,CAAM,cAAe,EAAA;AACrB,QAAA,IAAI,iBAAiB,CAAC,GAAG,QAAS,EAAA,CAAE,IAAI,CAAK,CAAA,KAAA,CAAA,CAAE,GAAG,CAAA,CAAE,OAAO,CAAK,CAAA,KAAA,CAAA,CAAE,OAAQ,CAAA,QAAA,KAAa,EAAE,CAAC,CAAA;AAE1F,QAAA,IAAI,gBAAgB,MAAQ,EAAA;AAC1B,UAAA,cAAA,CAAe,OAAQ,EAAA;AAAA,SAEhB,MAAA,IAAA,WAAA,KAAgB,MAAU,IAAA,WAAA,KAAgB,MAAQ,EAAA;AACzD,UAAA,IAAI,WAAgB,KAAA,MAAA;AAClB,YAAA,cAAA,CAAe,OAAQ,EAAA;AACzB,UAAA,MAAM,eAAe,cAAe,CAAA,OAAA;AAAA,YAClC,KAAM,CAAA;AAAA,WACR;AAEA,UAAiB,cAAA,GAAA,OAAA,CAAQ,IAAK,CAAA,KAAA,GAC1B,SAAU,CAAA,cAAA,EAAgB,YAAe,GAAA,CAAC,CAC1C,GAAA,cAAA,CAAe,KAAM,CAAA,YAAA,GAAe,CAAC,CAAA;AAAA;AAG3C,QAAS,QAAA,CAAA,MAAM,UAAW,CAAA,cAAc,CAAC,CAAA;AAAA;AAC3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/RovingFocus/utils.cjs

@@ -22,9 +22,9 @@ function getDirectionAwareKey(key, dir) {
 function getFocusIntent(event, orientation, dir) {
   const key = getDirectionAwareKey(event.key, dir);
   if (orientation === "vertical" && ["ArrowLeft", "ArrowRight"].includes(key))
-    return undefined;
+    return void 0;
   if (orientation === "horizontal" && ["ArrowUp", "ArrowDown"].includes(key))
-    return undefined;
+    return void 0;
   return MAP_KEY_TO_FOCUS_INTENT[key];
 }
 function focusFirst(candidates, preventScroll = false) {

package/dist/RovingFocus/utils.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"utils.cjs","sources":["../../src/RovingFocus/utils.ts"],"sourcesContent":["import { getActiveElement } from '@/shared'\n\nexport type Orientation = 'horizontal' | 'vertical'\nexport type Direction = 'ltr' | 'rtl'\n\nexport const ENTRY_FOCUS = 'rovingFocusGroup.onEntryFocus'\nexport const EVENT_OPTIONS = { bubbles: false, cancelable: true }\n\nexport const MAP_KEY_TO_FOCUS_INTENT: Record<string, FocusIntent> = {\n  ArrowLeft: 'prev',\n  ArrowUp: 'prev',\n  ArrowRight: 'next',\n  ArrowDown: 'next',\n  PageUp: 'first',\n  Home: 'first',\n  PageDown: 'last',\n  End: 'last',\n}\n\nexport function getDirectionAwareKey(key: string, dir?: Direction) {\n  if (dir !== 'rtl')\n    return key\n  return key === 'ArrowLeft'\n    ? 'ArrowRight'\n    : key === 'ArrowRight'\n      ? 'ArrowLeft'\n      : key\n}\n\ntype FocusIntent = 'first' | 'last' | 'prev' | 'next'\n\nexport function getFocusIntent(\n  event: KeyboardEvent,\n  orientation?: Orientation,\n  dir?: Direction,\n) {\n  const key = getDirectionAwareKey(event.key, dir)\n  if (orientation === 'vertical' && ['ArrowLeft', 'ArrowRight'].includes(key))\n    return undefined\n  if (orientation === 'horizontal' && ['ArrowUp', 'ArrowDown'].includes(key))\n    return undefined\n  return MAP_KEY_TO_FOCUS_INTENT[key]\n}\n\nexport function focusFirst(candidates: HTMLElement[], preventScroll = false) {\n  const PREVIOUSLY_FOCUSED_ELEMENT = getActiveElement()\n  for (const candidate of candidates) {\n    // if focus is already where we want to go, we don't want to keep going through the candidates\n    if (candidate === PREVIOUSLY_FOCUSED_ELEMENT)\n      return\n    candidate.focus({ preventScroll })\n    if (getActiveElement() !== PREVIOUSLY_FOCUSED_ELEMENT)\n      return\n  }\n}\n\n/**\n * Wraps an array around itself at a given start index\n * Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']`\n */\nexport function wrapArray<T>(array: T[], startIndex: number) {\n  return array.map((_, index) => array[(startIndex + index) % array.length])\n}\n"],"names":["getActiveElement"],"mappings":";;;;AAKO,MAAM,WAAc,GAAA;AACpB,MAAM,aAAgB,GAAA,EAAE,OAAS,EAAA,KAAA,EAAO,YAAY,IAAK;AAEzD,MAAM,uBAAuD,GAAA;AAAA,EAClE,SAAW,EAAA,MAAA;AAAA,EACX,OAAS,EAAA,MAAA;AAAA,EACT,UAAY,EAAA,MAAA;AAAA,EACZ,SAAW,EAAA,MAAA;AAAA,EACX,MAAQ,EAAA,OAAA;AAAA,EACR,IAAM,EAAA,OAAA;AAAA,EACN,QAAU,EAAA,MAAA;AAAA,EACV,GAAK,EAAA;AACP;AAEgB,SAAA,oBAAA,CAAqB,KAAa,GAAiB,EAAA;AACjE,EAAA,IAAI,GAAQ,KAAA,KAAA;AACV,IAAO,OAAA,GAAA;AACT,EAAA,OAAO,GAAQ,KAAA,WAAA,GACX,YACA,GAAA,GAAA,KAAQ,eACN,WACA,GAAA,GAAA;AACR;AAIgB,SAAA,cAAA,CACd,KACA,EAAA,WAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,GAAM,GAAA,oBAAA,CAAqB,KAAM,CAAA,GAAA,EAAK,GAAG,CAAA;AAC/C,EAAA,IAAI,gBAAgB,UAAc,IAAA,CAAC,aAAa,YAAY,CAAA,CAAE,SAAS,GAAG,CAAA;AACxE,IAAO,OAAA,SAAA;AACT,EAAA,IAAI,gBAAgB,YAAgB,IAAA,CAAC,WAAW,WAAW,CAAA,CAAE,SAAS,GAAG,CAAA;AACvE,IAAO,OAAA,SAAA;AACT,EAAA,OAAO,wBAAwB,GAAG,CAAA;AACpC;AAEgB,SAAA,UAAA,CAAW,UAA2B,EAAA,aAAA,GAAgB,KAAO,EAAA;AAC3E,EAAA,MAAM,6BAA6BA,wCAAiB,EAAA;AACpD,EAAA,KAAA,MAAW,aAAa,UAAY,EAAA;AAElC,IAAA,IAAI,SAAc,KAAA,0BAAA;AAChB,MAAA;AACF,IAAU,SAAA,CAAA,KAAA,CAAM,EAAE,aAAA,EAAe,CAAA;AACjC,IAAA,IAAIA,0CAAuB,KAAA,0BAAA;AACzB,MAAA;AAAA;AAEN;AAMgB,SAAA,SAAA,CAAa,OAAY,UAAoB,EAAA;AAC3D,EAAO,OAAA,KAAA,CAAM,GAAI,CAAA,CAAC,CAAG,EAAA,KAAA,KAAU,OAAO,UAAa,GAAA,KAAA,IAAS,KAAM,CAAA,MAAM,CAAC,CAAA;AAC3E;;;;;;;;;"}
+{"version":3,"file":"utils.cjs","sources":["../../src/RovingFocus/utils.ts"],"sourcesContent":["import { getActiveElement } from '@/shared'\n\nexport type Orientation = 'horizontal' | 'vertical'\nexport type Direction = 'ltr' | 'rtl'\n\nexport const ENTRY_FOCUS = 'rovingFocusGroup.onEntryFocus'\nexport const EVENT_OPTIONS = { bubbles: false, cancelable: true }\n\nexport const MAP_KEY_TO_FOCUS_INTENT: Record<string, FocusIntent> = {\n  ArrowLeft: 'prev',\n  ArrowUp: 'prev',\n  ArrowRight: 'next',\n  ArrowDown: 'next',\n  PageUp: 'first',\n  Home: 'first',\n  PageDown: 'last',\n  End: 'last',\n}\n\nexport function getDirectionAwareKey(key: string, dir?: Direction) {\n  if (dir !== 'rtl')\n    return key\n  return key === 'ArrowLeft'\n    ? 'ArrowRight'\n    : key === 'ArrowRight'\n      ? 'ArrowLeft'\n      : key\n}\n\ntype FocusIntent = 'first' | 'last' | 'prev' | 'next'\n\nexport function getFocusIntent(\n  event: KeyboardEvent,\n  orientation?: Orientation,\n  dir?: Direction,\n) {\n  const key = getDirectionAwareKey(event.key, dir)\n  if (orientation === 'vertical' && ['ArrowLeft', 'ArrowRight'].includes(key))\n    return undefined\n  if (orientation === 'horizontal' && ['ArrowUp', 'ArrowDown'].includes(key))\n    return undefined\n  return MAP_KEY_TO_FOCUS_INTENT[key]\n}\n\nexport function focusFirst(candidates: HTMLElement[], preventScroll = false) {\n  const PREVIOUSLY_FOCUSED_ELEMENT = getActiveElement()\n  for (const candidate of candidates) {\n    // if focus is already where we want to go, we don't want to keep going through the candidates\n    if (candidate === PREVIOUSLY_FOCUSED_ELEMENT)\n      return\n    candidate.focus({ preventScroll })\n    if (getActiveElement() !== PREVIOUSLY_FOCUSED_ELEMENT)\n      return\n  }\n}\n\n/**\n * Wraps an array around itself at a given start index\n * Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']`\n */\nexport function wrapArray<T>(array: T[], startIndex: number) {\n  return array.map((_, index) => array[(startIndex + index) % array.length])\n}\n"],"names":["getActiveElement"],"mappings":";;;;AAKO,MAAM,WAAc,GAAA;AACpB,MAAM,aAAgB,GAAA,EAAE,OAAS,EAAA,KAAA,EAAO,YAAY,IAAK;AAEzD,MAAM,uBAAuD,GAAA;AAAA,EAClE,SAAW,EAAA,MAAA;AAAA,EACX,OAAS,EAAA,MAAA;AAAA,EACT,UAAY,EAAA,MAAA;AAAA,EACZ,SAAW,EAAA,MAAA;AAAA,EACX,MAAQ,EAAA,OAAA;AAAA,EACR,IAAM,EAAA,OAAA;AAAA,EACN,QAAU,EAAA,MAAA;AAAA,EACV,GAAK,EAAA;AACP;AAEgB,SAAA,oBAAA,CAAqB,KAAa,GAAiB,EAAA;AACjE,EAAA,IAAI,GAAQ,KAAA,KAAA;AACV,IAAO,OAAA,GAAA;AACT,EAAA,OAAO,GAAQ,KAAA,WAAA,GACX,YACA,GAAA,GAAA,KAAQ,eACN,WACA,GAAA,GAAA;AACR;AAIgB,SAAA,cAAA,CACd,KACA,EAAA,WAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,GAAM,GAAA,oBAAA,CAAqB,KAAM,CAAA,GAAA,EAAK,GAAG,CAAA;AAC/C,EAAA,IAAI,gBAAgB,UAAc,IAAA,CAAC,aAAa,YAAY,CAAA,CAAE,SAAS,GAAG,CAAA;AACxE,IAAO,OAAA,MAAA;AACT,EAAA,IAAI,gBAAgB,YAAgB,IAAA,CAAC,WAAW,WAAW,CAAA,CAAE,SAAS,GAAG,CAAA;AACvE,IAAO,OAAA,MAAA;AACT,EAAA,OAAO,wBAAwB,GAAG,CAAA;AACpC;AAEgB,SAAA,UAAA,CAAW,UAA2B,EAAA,aAAA,GAAgB,KAAO,EAAA;AAC3E,EAAA,MAAM,6BAA6BA,wCAAiB,EAAA;AACpD,EAAA,KAAA,MAAW,aAAa,UAAY,EAAA;AAElC,IAAA,IAAI,SAAc,KAAA,0BAAA;AAChB,MAAA;AACF,IAAU,SAAA,CAAA,KAAA,CAAM,EAAE,aAAA,EAAe,CAAA;AACjC,IAAA,IAAIA,0CAAuB,KAAA,0BAAA;AACzB,MAAA;AAAA;AAEN;AAMgB,SAAA,SAAA,CAAa,OAAY,UAAoB,EAAA;AAC3D,EAAO,OAAA,KAAA,CAAM,GAAI,CAAA,CAAC,CAAG,EAAA,KAAA,KAAU,OAAO,UAAa,GAAA,KAAA,IAAS,KAAM,CAAA,MAAM,CAAC,CAAA;AAC3E;;;;;;;;;"}

package/dist/RovingFocus/utils.js

@@ -20,9 +20,9 @@ function getDirectionAwareKey(key, dir) {
 function getFocusIntent(event, orientation, dir) {
   const key = getDirectionAwareKey(event.key, dir);
   if (orientation === "vertical" && ["ArrowLeft", "ArrowRight"].includes(key))
-    return undefined;
+    return void 0;
   if (orientation === "horizontal" && ["ArrowUp", "ArrowDown"].includes(key))
-    return undefined;
+    return void 0;
   return MAP_KEY_TO_FOCUS_INTENT[key];
 }
 function focusFirst(candidates, preventScroll = false) {

package/dist/RovingFocus/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../src/RovingFocus/utils.ts"],"sourcesContent":["import { getActiveElement } from '@/shared'\n\nexport type Orientation = 'horizontal' | 'vertical'\nexport type Direction = 'ltr' | 'rtl'\n\nexport const ENTRY_FOCUS = 'rovingFocusGroup.onEntryFocus'\nexport const EVENT_OPTIONS = { bubbles: false, cancelable: true }\n\nexport const MAP_KEY_TO_FOCUS_INTENT: Record<string, FocusIntent> = {\n  ArrowLeft: 'prev',\n  ArrowUp: 'prev',\n  ArrowRight: 'next',\n  ArrowDown: 'next',\n  PageUp: 'first',\n  Home: 'first',\n  PageDown: 'last',\n  End: 'last',\n}\n\nexport function getDirectionAwareKey(key: string, dir?: Direction) {\n  if (dir !== 'rtl')\n    return key\n  return key === 'ArrowLeft'\n    ? 'ArrowRight'\n    : key === 'ArrowRight'\n      ? 'ArrowLeft'\n      : key\n}\n\ntype FocusIntent = 'first' | 'last' | 'prev' | 'next'\n\nexport function getFocusIntent(\n  event: KeyboardEvent,\n  orientation?: Orientation,\n  dir?: Direction,\n) {\n  const key = getDirectionAwareKey(event.key, dir)\n  if (orientation === 'vertical' && ['ArrowLeft', 'ArrowRight'].includes(key))\n    return undefined\n  if (orientation === 'horizontal' && ['ArrowUp', 'ArrowDown'].includes(key))\n    return undefined\n  return MAP_KEY_TO_FOCUS_INTENT[key]\n}\n\nexport function focusFirst(candidates: HTMLElement[], preventScroll = false) {\n  const PREVIOUSLY_FOCUSED_ELEMENT = getActiveElement()\n  for (const candidate of candidates) {\n    // if focus is already where we want to go, we don't want to keep going through the candidates\n    if (candidate === PREVIOUSLY_FOCUSED_ELEMENT)\n      return\n    candidate.focus({ preventScroll })\n    if (getActiveElement() !== PREVIOUSLY_FOCUSED_ELEMENT)\n      return\n  }\n}\n\n/**\n * Wraps an array around itself at a given start index\n * Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']`\n */\nexport function wrapArray<T>(array: T[], startIndex: number) {\n  return array.map((_, index) => array[(startIndex + index) % array.length])\n}\n"],"names":[],"mappings":";;AAKO,MAAM,WAAc,GAAA;AACpB,MAAM,aAAgB,GAAA,EAAE,OAAS,EAAA,KAAA,EAAO,YAAY,IAAK;AAEzD,MAAM,uBAAuD,GAAA;AAAA,EAClE,SAAW,EAAA,MAAA;AAAA,EACX,OAAS,EAAA,MAAA;AAAA,EACT,UAAY,EAAA,MAAA;AAAA,EACZ,SAAW,EAAA,MAAA;AAAA,EACX,MAAQ,EAAA,OAAA;AAAA,EACR,IAAM,EAAA,OAAA;AAAA,EACN,QAAU,EAAA,MAAA;AAAA,EACV,GAAK,EAAA;AACP;AAEgB,SAAA,oBAAA,CAAqB,KAAa,GAAiB,EAAA;AACjE,EAAA,IAAI,GAAQ,KAAA,KAAA;AACV,IAAO,OAAA,GAAA;AACT,EAAA,OAAO,GAAQ,KAAA,WAAA,GACX,YACA,GAAA,GAAA,KAAQ,eACN,WACA,GAAA,GAAA;AACR;AAIgB,SAAA,cAAA,CACd,KACA,EAAA,WAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,GAAM,GAAA,oBAAA,CAAqB,KAAM,CAAA,GAAA,EAAK,GAAG,CAAA;AAC/C,EAAA,IAAI,gBAAgB,UAAc,IAAA,CAAC,aAAa,YAAY,CAAA,CAAE,SAAS,GAAG,CAAA;AACxE,IAAO,OAAA,SAAA;AACT,EAAA,IAAI,gBAAgB,YAAgB,IAAA,CAAC,WAAW,WAAW,CAAA,CAAE,SAAS,GAAG,CAAA;AACvE,IAAO,OAAA,SAAA;AACT,EAAA,OAAO,wBAAwB,GAAG,CAAA;AACpC;AAEgB,SAAA,UAAA,CAAW,UAA2B,EAAA,aAAA,GAAgB,KAAO,EAAA;AAC3E,EAAA,MAAM,6BAA6B,gBAAiB,EAAA;AACpD,EAAA,KAAA,MAAW,aAAa,UAAY,EAAA;AAElC,IAAA,IAAI,SAAc,KAAA,0BAAA;AAChB,MAAA;AACF,IAAU,SAAA,CAAA,KAAA,CAAM,EAAE,aAAA,EAAe,CAAA;AACjC,IAAA,IAAI,kBAAuB,KAAA,0BAAA;AACzB,MAAA;AAAA;AAEN;AAMgB,SAAA,SAAA,CAAa,OAAY,UAAoB,EAAA;AAC3D,EAAO,OAAA,KAAA,CAAM,GAAI,CAAA,CAAC,CAAG,EAAA,KAAA,KAAU,OAAO,UAAa,GAAA,KAAA,IAAS,KAAM,CAAA,MAAM,CAAC,CAAA;AAC3E;;;;"}
+{"version":3,"file":"utils.js","sources":["../../src/RovingFocus/utils.ts"],"sourcesContent":["import { getActiveElement } from '@/shared'\n\nexport type Orientation = 'horizontal' | 'vertical'\nexport type Direction = 'ltr' | 'rtl'\n\nexport const ENTRY_FOCUS = 'rovingFocusGroup.onEntryFocus'\nexport const EVENT_OPTIONS = { bubbles: false, cancelable: true }\n\nexport const MAP_KEY_TO_FOCUS_INTENT: Record<string, FocusIntent> = {\n  ArrowLeft: 'prev',\n  ArrowUp: 'prev',\n  ArrowRight: 'next',\n  ArrowDown: 'next',\n  PageUp: 'first',\n  Home: 'first',\n  PageDown: 'last',\n  End: 'last',\n}\n\nexport function getDirectionAwareKey(key: string, dir?: Direction) {\n  if (dir !== 'rtl')\n    return key\n  return key === 'ArrowLeft'\n    ? 'ArrowRight'\n    : key === 'ArrowRight'\n      ? 'ArrowLeft'\n      : key\n}\n\ntype FocusIntent = 'first' | 'last' | 'prev' | 'next'\n\nexport function getFocusIntent(\n  event: KeyboardEvent,\n  orientation?: Orientation,\n  dir?: Direction,\n) {\n  const key = getDirectionAwareKey(event.key, dir)\n  if (orientation === 'vertical' && ['ArrowLeft', 'ArrowRight'].includes(key))\n    return undefined\n  if (orientation === 'horizontal' && ['ArrowUp', 'ArrowDown'].includes(key))\n    return undefined\n  return MAP_KEY_TO_FOCUS_INTENT[key]\n}\n\nexport function focusFirst(candidates: HTMLElement[], preventScroll = false) {\n  const PREVIOUSLY_FOCUSED_ELEMENT = getActiveElement()\n  for (const candidate of candidates) {\n    // if focus is already where we want to go, we don't want to keep going through the candidates\n    if (candidate === PREVIOUSLY_FOCUSED_ELEMENT)\n      return\n    candidate.focus({ preventScroll })\n    if (getActiveElement() !== PREVIOUSLY_FOCUSED_ELEMENT)\n      return\n  }\n}\n\n/**\n * Wraps an array around itself at a given start index\n * Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']`\n */\nexport function wrapArray<T>(array: T[], startIndex: number) {\n  return array.map((_, index) => array[(startIndex + index) % array.length])\n}\n"],"names":[],"mappings":";;AAKO,MAAM,WAAc,GAAA;AACpB,MAAM,aAAgB,GAAA,EAAE,OAAS,EAAA,KAAA,EAAO,YAAY,IAAK;AAEzD,MAAM,uBAAuD,GAAA;AAAA,EAClE,SAAW,EAAA,MAAA;AAAA,EACX,OAAS,EAAA,MAAA;AAAA,EACT,UAAY,EAAA,MAAA;AAAA,EACZ,SAAW,EAAA,MAAA;AAAA,EACX,MAAQ,EAAA,OAAA;AAAA,EACR,IAAM,EAAA,OAAA;AAAA,EACN,QAAU,EAAA,MAAA;AAAA,EACV,GAAK,EAAA;AACP;AAEgB,SAAA,oBAAA,CAAqB,KAAa,GAAiB,EAAA;AACjE,EAAA,IAAI,GAAQ,KAAA,KAAA;AACV,IAAO,OAAA,GAAA;AACT,EAAA,OAAO,GAAQ,KAAA,WAAA,GACX,YACA,GAAA,GAAA,KAAQ,eACN,WACA,GAAA,GAAA;AACR;AAIgB,SAAA,cAAA,CACd,KACA,EAAA,WAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,GAAM,GAAA,oBAAA,CAAqB,KAAM,CAAA,GAAA,EAAK,GAAG,CAAA;AAC/C,EAAA,IAAI,gBAAgB,UAAc,IAAA,CAAC,aAAa,YAAY,CAAA,CAAE,SAAS,GAAG,CAAA;AACxE,IAAO,OAAA,MAAA;AACT,EAAA,IAAI,gBAAgB,YAAgB,IAAA,CAAC,WAAW,WAAW,CAAA,CAAE,SAAS,GAAG,CAAA;AACvE,IAAO,OAAA,MAAA;AACT,EAAA,OAAO,wBAAwB,GAAG,CAAA;AACpC;AAEgB,SAAA,UAAA,CAAW,UAA2B,EAAA,aAAA,GAAgB,KAAO,EAAA;AAC3E,EAAA,MAAM,6BAA6B,gBAAiB,EAAA;AACpD,EAAA,KAAA,MAAW,aAAa,UAAY,EAAA;AAElC,IAAA,IAAI,SAAc,KAAA,0BAAA;AAChB,MAAA;AACF,IAAU,SAAA,CAAA,KAAA,CAAM,EAAE,aAAA,EAAe,CAAA;AACjC,IAAA,IAAI,kBAAuB,KAAA,0BAAA;AACzB,MAAA;AAAA;AAEN;AAMgB,SAAA,SAAA,CAAa,OAAY,UAAoB,EAAA;AAC3D,EAAO,OAAA,KAAA,CAAM,GAAI,CAAA,CAAC,CAAG,EAAA,KAAA,KAAU,OAAO,UAAa,GAAA,KAAA,IAAS,KAAM,CAAA,MAAM,CAAC,CAAA;AAC3E;;;;"}

package/dist/ScrollArea/ScrollAreaCorner.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaCorner.cjs","sources":["../../src/ScrollArea/ScrollAreaCorner.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nexport interface ScrollAreaCornerProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport ScrollAreaCornerImpl from './ScrollAreaCornerImpl.vue'\n\nconst props = defineProps<ScrollAreaCornerProps>()\n\nconst { forwardRef } = useForwardExpose()\nconst rootContext = injectScrollAreaRootContext()\n\nconst hasBothScrollbarsVisible = computed(\n  () => !!rootContext.scrollbarX.value && !!rootContext.scrollbarY.value,\n)\nconst hasCorner = computed(\n  () => rootContext.type.value !== 'scroll' && hasBothScrollbarsVisible.value,\n)\n</script>\n\n<template>\n  <ScrollAreaCornerImpl\n    v-if=\"hasCorner\"\n    v-bind=\"props\"\n    :ref=\"forwardRef\"\n  >\n    <slot />\n  </ScrollAreaCornerImpl>\n</template>\n"],"names":["useForwardExpose","injectScrollAreaRootContext","computed"],"mappings":";;;;;;;;;;;;;;AAYA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAEd,IAAM,MAAA,EAAE,UAAW,EAAA,GAAIA,wCAAiB,EAAA;AACxC,IAAA,MAAM,cAAcC,qDAA4B,EAAA;AAEhD,IAAA,MAAM,wBAA2B,GAAAC,YAAA;AAAA,MAC/B,MAAM,CAAC,CAAC,WAAA,CAAY,WAAW,KAAS,IAAA,CAAC,CAAC,WAAA,CAAY,UAAW,CAAA;AAAA,KACnE;AACA,IAAA,MAAM,SAAY,GAAAA,YAAA;AAAA,MAChB,MAAM,WAAA,CAAY,IAAK,CAAA,KAAA,KAAU,YAAY,wBAAyB,CAAA;AAAA,KACxE;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaCorner.cjs","sources":["../../src/ScrollArea/ScrollAreaCorner.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nexport interface ScrollAreaCornerProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport ScrollAreaCornerImpl from './ScrollAreaCornerImpl.vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\n\nconst props = defineProps<ScrollAreaCornerProps>()\n\nconst { forwardRef } = useForwardExpose()\nconst rootContext = injectScrollAreaRootContext()\n\nconst hasBothScrollbarsVisible = computed(\n  () => !!rootContext.scrollbarX.value && !!rootContext.scrollbarY.value,\n)\nconst hasCorner = computed(\n  () => rootContext.type.value !== 'scroll' && hasBothScrollbarsVisible.value,\n)\n</script>\n\n<template>\n  <ScrollAreaCornerImpl\n    v-if=\"hasCorner\"\n    v-bind=\"props\"\n    :ref=\"forwardRef\"\n  >\n    <slot />\n  </ScrollAreaCornerImpl>\n</template>\n"],"names":["useForwardExpose","injectScrollAreaRootContext","computed"],"mappings":";;;;;;;;;;;;;;AAYA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAEd,IAAM,MAAA,EAAE,UAAW,EAAA,GAAIA,wCAAiB,EAAA;AACxC,IAAA,MAAM,cAAcC,qDAA4B,EAAA;AAEhD,IAAA,MAAM,wBAA2B,GAAAC,YAAA;AAAA,MAC/B,MAAM,CAAC,CAAC,WAAA,CAAY,WAAW,KAAS,IAAA,CAAC,CAAC,WAAA,CAAY,UAAW,CAAA;AAAA,KACnE;AACA,IAAA,MAAM,SAAY,GAAAA,YAAA;AAAA,MAChB,MAAM,WAAA,CAAY,IAAK,CAAA,KAAA,KAAU,YAAY,wBAAyB,CAAA;AAAA,KACxE;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaCorner.js

@@ -1,4 +1,4 @@
-import { defineComponent, computed, openBlock, createBlock, mergeProps, unref, withCtx, renderSlot, createCommentVNode } from 'vue';
+import { defineComponent, computed, createBlock, createCommentVNode, openBlock, mergeProps, unref, withCtx, renderSlot } from 'vue';
 import { _ as _sfc_main$1 } from './ScrollAreaCornerImpl.js';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';
 import { i as injectScrollAreaRootContext } from './ScrollAreaRoot.js';

package/dist/ScrollArea/ScrollAreaCorner.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaCorner.js","sources":["../../src/ScrollArea/ScrollAreaCorner.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nexport interface ScrollAreaCornerProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport ScrollAreaCornerImpl from './ScrollAreaCornerImpl.vue'\n\nconst props = defineProps<ScrollAreaCornerProps>()\n\nconst { forwardRef } = useForwardExpose()\nconst rootContext = injectScrollAreaRootContext()\n\nconst hasBothScrollbarsVisible = computed(\n  () => !!rootContext.scrollbarX.value && !!rootContext.scrollbarY.value,\n)\nconst hasCorner = computed(\n  () => rootContext.type.value !== 'scroll' && hasBothScrollbarsVisible.value,\n)\n</script>\n\n<template>\n  <ScrollAreaCornerImpl\n    v-if=\"hasCorner\"\n    v-bind=\"props\"\n    :ref=\"forwardRef\"\n  >\n    <slot />\n  </ScrollAreaCornerImpl>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;AAYA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAEd,IAAM,MAAA,EAAE,UAAW,EAAA,GAAI,gBAAiB,EAAA;AACxC,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAEhD,IAAA,MAAM,wBAA2B,GAAA,QAAA;AAAA,MAC/B,MAAM,CAAC,CAAC,WAAA,CAAY,WAAW,KAAS,IAAA,CAAC,CAAC,WAAA,CAAY,UAAW,CAAA;AAAA,KACnE;AACA,IAAA,MAAM,SAAY,GAAA,QAAA;AAAA,MAChB,MAAM,WAAA,CAAY,IAAK,CAAA,KAAA,KAAU,YAAY,wBAAyB,CAAA;AAAA,KACxE;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaCorner.js","sources":["../../src/ScrollArea/ScrollAreaCorner.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nexport interface ScrollAreaCornerProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport ScrollAreaCornerImpl from './ScrollAreaCornerImpl.vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\n\nconst props = defineProps<ScrollAreaCornerProps>()\n\nconst { forwardRef } = useForwardExpose()\nconst rootContext = injectScrollAreaRootContext()\n\nconst hasBothScrollbarsVisible = computed(\n  () => !!rootContext.scrollbarX.value && !!rootContext.scrollbarY.value,\n)\nconst hasCorner = computed(\n  () => rootContext.type.value !== 'scroll' && hasBothScrollbarsVisible.value,\n)\n</script>\n\n<template>\n  <ScrollAreaCornerImpl\n    v-if=\"hasCorner\"\n    v-bind=\"props\"\n    :ref=\"forwardRef\"\n  >\n    <slot />\n  </ScrollAreaCornerImpl>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;AAYA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAEd,IAAM,MAAA,EAAE,UAAW,EAAA,GAAI,gBAAiB,EAAA;AACxC,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAEhD,IAAA,MAAM,wBAA2B,GAAA,QAAA;AAAA,MAC/B,MAAM,CAAC,CAAC,WAAA,CAAY,WAAW,KAAS,IAAA,CAAC,CAAC,WAAA,CAAY,UAAW,CAAA;AAAA,KACnE;AACA,IAAA,MAAM,SAAY,GAAA,QAAA;AAAA,MAChB,MAAM,WAAA,CAAY,IAAK,CAAA,KAAA,KAAU,YAAY,wBAAyB,CAAA;AAAA,KACxE;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaCornerImpl.cjs

@@ -2,8 +2,8 @@
 
 const vue = require('vue');
 const core = require('@vueuse/core');
-const Primitive_Primitive = require('../Primitive/Primitive.cjs');
 const ScrollArea_ScrollAreaRoot = require('./ScrollAreaRoot.cjs');
+const Primitive_Primitive = require('../Primitive/Primitive.cjs');
 
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "ScrollAreaCornerImpl",
@@ -33,8 +33,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
           width: `${width.value}px`,
           height: `${height.value}px`,
           position: "absolute",
-          right: vue.unref(rootContext).dir.value === "ltr" ? 0 : undefined,
-          left: vue.unref(rootContext).dir.value === "rtl" ? 0 : undefined,
+          right: vue.unref(rootContext).dir.value === "ltr" ? 0 : void 0,
+          left: vue.unref(rootContext).dir.value === "rtl" ? 0 : void 0,
           bottom: 0
         }
       }, _ctx.$parent?.$props), {

package/dist/ScrollArea/ScrollAreaCornerImpl.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaCornerImpl.cjs","sources":["../../src/ScrollArea/ScrollAreaCornerImpl.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport { Primitive } from '@/Primitive'\n\nconst rootContext = injectScrollAreaRootContext()\n\nconst width = ref(0)\nconst height = ref(0)\n\nconst hasSize = computed(() => !!width.value && !!height.value)\n\nfunction setCornerHeight() {\n  const offsetHeight = rootContext.scrollbarX.value?.offsetHeight || 0\n  rootContext.onCornerHeightChange(offsetHeight)\n  height.value = offsetHeight\n}\nfunction setCornerWidth() {\n  const offsetWidth = rootContext.scrollbarY.value?.offsetWidth || 0\n  rootContext.onCornerWidthChange(offsetWidth)\n  width.value = offsetWidth\n}\n\nuseResizeObserver(rootContext.scrollbarX.value, setCornerHeight)\nuseResizeObserver(rootContext.scrollbarY.value, setCornerWidth)\n\n// because we are not remounting the component, useResizeObserver doesn't trigger, thus using watcher here\nwatch(() => rootContext.scrollbarX.value, setCornerHeight)\nwatch(() => rootContext.scrollbarY.value, setCornerWidth)\n</script>\n\n<template>\n  <Primitive\n    v-if=\"hasSize\"\n    :style=\"{\n      width: `${width}px`,\n      height: `${height}px`,\n      position: 'absolute',\n      right: rootContext.dir.value === 'ltr' ? 0 : undefined,\n      left: rootContext.dir.value === 'rtl' ? 0 : undefined,\n      bottom: 0,\n    }\"\n    v-bind=\"$parent?.$props\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["injectScrollAreaRootContext","ref","computed","useResizeObserver","watch"],"mappings":";;;;;;;;;;AAMA,IAAA,MAAM,cAAcA,qDAA4B,EAAA;AAEhD,IAAM,MAAA,KAAA,GAAQC,QAAI,CAAC,CAAA;AACnB,IAAM,MAAA,MAAA,GAASA,QAAI,CAAC,CAAA;AAEpB,IAAM,MAAA,OAAA,GAAUC,YAAS,CAAA,MAAM,CAAC,CAAC,MAAM,KAAS,IAAA,CAAC,CAAC,MAAA,CAAO,KAAK,CAAA;AAE9D,IAAA,SAAS,eAAkB,GAAA;AACzB,MAAA,MAAM,YAAe,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,YAAgB,IAAA,CAAA;AACnE,MAAA,WAAA,CAAY,qBAAqB,YAAY,CAAA;AAC7C,MAAA,MAAA,CAAO,KAAQ,GAAA,YAAA;AAAA;AAEjB,IAAA,SAAS,cAAiB,GAAA;AACxB,MAAA,MAAM,WAAc,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,WAAe,IAAA,CAAA;AACjE,MAAA,WAAA,CAAY,oBAAoB,WAAW,CAAA;AAC3C,MAAA,KAAA,CAAM,KAAQ,GAAA,WAAA;AAAA;AAGhB,IAAkBC,sBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AAC/D,IAAkBA,sBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;AAG9D,IAAAC,SAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AACzD,IAAAA,SAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaCornerImpl.cjs","sources":["../../src/ScrollArea/ScrollAreaCornerImpl.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { useResizeObserver } from '@vueuse/core'\nimport { computed, ref, watch } from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\n\nconst rootContext = injectScrollAreaRootContext()\n\nconst width = ref(0)\nconst height = ref(0)\n\nconst hasSize = computed(() => !!width.value && !!height.value)\n\nfunction setCornerHeight() {\n  const offsetHeight = rootContext.scrollbarX.value?.offsetHeight || 0\n  rootContext.onCornerHeightChange(offsetHeight)\n  height.value = offsetHeight\n}\nfunction setCornerWidth() {\n  const offsetWidth = rootContext.scrollbarY.value?.offsetWidth || 0\n  rootContext.onCornerWidthChange(offsetWidth)\n  width.value = offsetWidth\n}\n\nuseResizeObserver(rootContext.scrollbarX.value, setCornerHeight)\nuseResizeObserver(rootContext.scrollbarY.value, setCornerWidth)\n\n// because we are not remounting the component, useResizeObserver doesn't trigger, thus using watcher here\nwatch(() => rootContext.scrollbarX.value, setCornerHeight)\nwatch(() => rootContext.scrollbarY.value, setCornerWidth)\n</script>\n\n<template>\n  <Primitive\n    v-if=\"hasSize\"\n    :style=\"{\n      width: `${width}px`,\n      height: `${height}px`,\n      position: 'absolute',\n      right: rootContext.dir.value === 'ltr' ? 0 : undefined,\n      left: rootContext.dir.value === 'rtl' ? 0 : undefined,\n      bottom: 0,\n    }\"\n    v-bind=\"$parent?.$props\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["injectScrollAreaRootContext","ref","computed","useResizeObserver","watch"],"mappings":";;;;;;;;;;AAMA,IAAA,MAAM,cAAcA,qDAA4B,EAAA;AAEhD,IAAM,MAAA,KAAA,GAAQC,QAAI,CAAC,CAAA;AACnB,IAAM,MAAA,MAAA,GAASA,QAAI,CAAC,CAAA;AAEpB,IAAM,MAAA,OAAA,GAAUC,YAAS,CAAA,MAAM,CAAC,CAAC,MAAM,KAAS,IAAA,CAAC,CAAC,MAAA,CAAO,KAAK,CAAA;AAE9D,IAAA,SAAS,eAAkB,GAAA;AACzB,MAAA,MAAM,YAAe,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,YAAgB,IAAA,CAAA;AACnE,MAAA,WAAA,CAAY,qBAAqB,YAAY,CAAA;AAC7C,MAAA,MAAA,CAAO,KAAQ,GAAA,YAAA;AAAA;AAEjB,IAAA,SAAS,cAAiB,GAAA;AACxB,MAAA,MAAM,WAAc,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,WAAe,IAAA,CAAA;AACjE,MAAA,WAAA,CAAY,oBAAoB,WAAW,CAAA;AAC3C,MAAA,KAAA,CAAM,KAAQ,GAAA,WAAA;AAAA;AAGhB,IAAkBC,sBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AAC/D,IAAkBA,sBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;AAG9D,IAAAC,SAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AACzD,IAAAA,SAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaCornerImpl.js

@@ -1,7 +1,7 @@
-import { defineComponent, ref, computed, watch, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot, createCommentVNode } from 'vue';
+import { defineComponent, ref, computed, watch, createBlock, createCommentVNode, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { useResizeObserver } from '@vueuse/core';
-import { P as Primitive } from '../Primitive/Primitive.js';
 import { i as injectScrollAreaRootContext } from './ScrollAreaRoot.js';
+import { P as Primitive } from '../Primitive/Primitive.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "ScrollAreaCornerImpl",
@@ -31,8 +31,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           width: `${width.value}px`,
           height: `${height.value}px`,
           position: "absolute",
-          right: unref(rootContext).dir.value === "ltr" ? 0 : undefined,
-          left: unref(rootContext).dir.value === "rtl" ? 0 : undefined,
+          right: unref(rootContext).dir.value === "ltr" ? 0 : void 0,
+          left: unref(rootContext).dir.value === "rtl" ? 0 : void 0,
           bottom: 0
         }
       }, _ctx.$parent?.$props), {

package/dist/ScrollArea/ScrollAreaCornerImpl.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaCornerImpl.js","sources":["../../src/ScrollArea/ScrollAreaCornerImpl.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport { Primitive } from '@/Primitive'\n\nconst rootContext = injectScrollAreaRootContext()\n\nconst width = ref(0)\nconst height = ref(0)\n\nconst hasSize = computed(() => !!width.value && !!height.value)\n\nfunction setCornerHeight() {\n  const offsetHeight = rootContext.scrollbarX.value?.offsetHeight || 0\n  rootContext.onCornerHeightChange(offsetHeight)\n  height.value = offsetHeight\n}\nfunction setCornerWidth() {\n  const offsetWidth = rootContext.scrollbarY.value?.offsetWidth || 0\n  rootContext.onCornerWidthChange(offsetWidth)\n  width.value = offsetWidth\n}\n\nuseResizeObserver(rootContext.scrollbarX.value, setCornerHeight)\nuseResizeObserver(rootContext.scrollbarY.value, setCornerWidth)\n\n// because we are not remounting the component, useResizeObserver doesn't trigger, thus using watcher here\nwatch(() => rootContext.scrollbarX.value, setCornerHeight)\nwatch(() => rootContext.scrollbarY.value, setCornerWidth)\n</script>\n\n<template>\n  <Primitive\n    v-if=\"hasSize\"\n    :style=\"{\n      width: `${width}px`,\n      height: `${height}px`,\n      position: 'absolute',\n      right: rootContext.dir.value === 'ltr' ? 0 : undefined,\n      left: rootContext.dir.value === 'rtl' ? 0 : undefined,\n      bottom: 0,\n    }\"\n    v-bind=\"$parent?.$props\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;AAMA,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAEhD,IAAM,MAAA,KAAA,GAAQ,IAAI,CAAC,CAAA;AACnB,IAAM,MAAA,MAAA,GAAS,IAAI,CAAC,CAAA;AAEpB,IAAM,MAAA,OAAA,GAAU,QAAS,CAAA,MAAM,CAAC,CAAC,MAAM,KAAS,IAAA,CAAC,CAAC,MAAA,CAAO,KAAK,CAAA;AAE9D,IAAA,SAAS,eAAkB,GAAA;AACzB,MAAA,MAAM,YAAe,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,YAAgB,IAAA,CAAA;AACnE,MAAA,WAAA,CAAY,qBAAqB,YAAY,CAAA;AAC7C,MAAA,MAAA,CAAO,KAAQ,GAAA,YAAA;AAAA;AAEjB,IAAA,SAAS,cAAiB,GAAA;AACxB,MAAA,MAAM,WAAc,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,WAAe,IAAA,CAAA;AACjE,MAAA,WAAA,CAAY,oBAAoB,WAAW,CAAA;AAC3C,MAAA,KAAA,CAAM,KAAQ,GAAA,WAAA;AAAA;AAGhB,IAAkB,iBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AAC/D,IAAkB,iBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;AAG9D,IAAA,KAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AACzD,IAAA,KAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaCornerImpl.js","sources":["../../src/ScrollArea/ScrollAreaCornerImpl.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { useResizeObserver } from '@vueuse/core'\nimport { computed, ref, watch } from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\n\nconst rootContext = injectScrollAreaRootContext()\n\nconst width = ref(0)\nconst height = ref(0)\n\nconst hasSize = computed(() => !!width.value && !!height.value)\n\nfunction setCornerHeight() {\n  const offsetHeight = rootContext.scrollbarX.value?.offsetHeight || 0\n  rootContext.onCornerHeightChange(offsetHeight)\n  height.value = offsetHeight\n}\nfunction setCornerWidth() {\n  const offsetWidth = rootContext.scrollbarY.value?.offsetWidth || 0\n  rootContext.onCornerWidthChange(offsetWidth)\n  width.value = offsetWidth\n}\n\nuseResizeObserver(rootContext.scrollbarX.value, setCornerHeight)\nuseResizeObserver(rootContext.scrollbarY.value, setCornerWidth)\n\n// because we are not remounting the component, useResizeObserver doesn't trigger, thus using watcher here\nwatch(() => rootContext.scrollbarX.value, setCornerHeight)\nwatch(() => rootContext.scrollbarY.value, setCornerWidth)\n</script>\n\n<template>\n  <Primitive\n    v-if=\"hasSize\"\n    :style=\"{\n      width: `${width}px`,\n      height: `${height}px`,\n      position: 'absolute',\n      right: rootContext.dir.value === 'ltr' ? 0 : undefined,\n      left: rootContext.dir.value === 'rtl' ? 0 : undefined,\n      bottom: 0,\n    }\"\n    v-bind=\"$parent?.$props\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;AAMA,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAEhD,IAAM,MAAA,KAAA,GAAQ,IAAI,CAAC,CAAA;AACnB,IAAM,MAAA,MAAA,GAAS,IAAI,CAAC,CAAA;AAEpB,IAAM,MAAA,OAAA,GAAU,QAAS,CAAA,MAAM,CAAC,CAAC,MAAM,KAAS,IAAA,CAAC,CAAC,MAAA,CAAO,KAAK,CAAA;AAE9D,IAAA,SAAS,eAAkB,GAAA;AACzB,MAAA,MAAM,YAAe,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,YAAgB,IAAA,CAAA;AACnE,MAAA,WAAA,CAAY,qBAAqB,YAAY,CAAA;AAC7C,MAAA,MAAA,CAAO,KAAQ,GAAA,YAAA;AAAA;AAEjB,IAAA,SAAS,cAAiB,GAAA;AACxB,MAAA,MAAM,WAAc,GAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,WAAe,IAAA,CAAA;AACjE,MAAA,WAAA,CAAY,oBAAoB,WAAW,CAAA;AAC3C,MAAA,KAAA,CAAM,KAAQ,GAAA,WAAA;AAAA;AAGhB,IAAkB,iBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AAC/D,IAAkB,iBAAA,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;AAG9D,IAAA,KAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,eAAe,CAAA;AACzD,IAAA,KAAA,CAAM,MAAM,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,cAAc,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaRoot.cjs

@@ -1,10 +1,10 @@
 'use strict';
 
 const vue = require('vue');
+const shared_createContext = require('../shared/createContext.cjs');
 const shared_useDirection = require('../shared/useDirection.cjs');
 const shared_useForwardExpose = require('../shared/useForwardExpose.cjs');
 const Primitive_Primitive = require('../Primitive/Primitive.cjs');
-const shared_createContext = require('../shared/createContext.cjs');
 
 const [injectScrollAreaRootContext, provideScrollAreaRootContext] = shared_createContext.createContext("ScrollAreaRoot");
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
@@ -55,7 +55,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       scrollArea,
       viewport,
       onViewportChange: (el) => {
-        viewport.value = el || undefined;
+        viewport.value = el || void 0;
       },
       content,
       onContentChange: (el) => {
@@ -66,10 +66,10 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       scrollbarY,
       scrollbarYEnabled,
       onScrollbarXChange: (scrollbar) => {
-        scrollbarX.value = scrollbar || undefined;
+        scrollbarX.value = scrollbar || void 0;
       },
       onScrollbarYChange: (scrollbar) => {
-        scrollbarY.value = scrollbar || undefined;
+        scrollbarY.value = scrollbar || void 0;
       },
       onScrollbarXEnabledChange: (rendered) => {
         scrollbarXEnabled.value = rendered;

package/dist/ScrollArea/ScrollAreaRoot.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaRoot.cjs","sources":["../../src/ScrollArea/ScrollAreaRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Direction, ScrollType } from './types'\nimport { createContext, useDirection, useForwardExpose } from '@/shared'\n\nexport interface ScrollAreaRootContext {\n  type: Ref<ScrollType>\n  dir: Ref<Direction>\n  scrollHideDelay: Ref<number>\n  scrollArea: Ref<HTMLElement | undefined>\n  viewport: Ref<HTMLElement | undefined>\n  onViewportChange: (viewport: HTMLElement | null) => void\n  content: Ref<HTMLElement | undefined>\n  onContentChange: (content: HTMLElement) => void\n  scrollbarX: Ref<HTMLElement | undefined>\n  onScrollbarXChange: (scrollbar: HTMLElement | null) => void\n  scrollbarXEnabled: Ref<boolean>\n  onScrollbarXEnabledChange: (rendered: boolean) => void\n  scrollbarY: Ref<HTMLElement | undefined>\n  onScrollbarYChange: (scrollbar: HTMLElement | null) => void\n  scrollbarYEnabled: Ref<boolean>\n  onScrollbarYEnabledChange: (rendered: boolean) => void\n  onCornerWidthChange: (width: number) => void\n  onCornerHeightChange: (height: number) => void\n}\n\nexport const [injectScrollAreaRootContext, provideScrollAreaRootContext]\n  = createContext<ScrollAreaRootContext>('ScrollAreaRoot')\n\nexport interface ScrollAreaRootProps extends PrimitiveProps {\n  /**\n   * Describes the nature of scrollbar visibility, similar to how the scrollbar preferences in MacOS control visibility of native scrollbars.\n   *\n   * `auto` - means that scrollbars are visible when content is overflowing on the corresponding orientation. <br>\n   * `always` - means that scrollbars are always visible regardless of whether the content is overflowing.<br>\n   * `scroll` - means that scrollbars are visible when the user is scrolling along its corresponding orientation.<br>\n   * `hover` - when the user is scrolling along its corresponding orientation and when the user is hovering over the scroll area.\n   */\n  type?: ScrollType\n  /** The reading direction of the combobox when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n  dir?: Direction\n  /** If type is set to either `scroll` or `hover`, this prop determines the length of time, in milliseconds, <br> before the scrollbars are hidden after the user stops interacting with scrollbars. */\n  scrollHideDelay?: number\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, toRefs } from 'vue'\nimport { Primitive } from '@/Primitive'\n\nconst props = withDefaults(defineProps<ScrollAreaRootProps>(), {\n  type: 'hover',\n  scrollHideDelay: 600,\n})\n\nconst cornerWidth = ref(0)\nconst cornerHeight = ref(0)\nconst viewport = ref<HTMLElement>()\nconst content = ref<HTMLElement>()\nconst scrollbarX = ref<HTMLElement>()\nconst scrollbarY = ref<HTMLElement>()\nconst scrollbarXEnabled = ref(false)\nconst scrollbarYEnabled = ref(false)\n\nconst { type, dir: propDir, scrollHideDelay } = toRefs(props)\nconst dir = useDirection(propDir)\n\nfunction scrollTop() {\n  viewport.value?.scrollTo({\n    top: 0,\n  })\n}\nfunction scrollTopLeft() {\n  viewport.value?.scrollTo({\n    top: 0,\n    left: 0,\n  })\n}\n\ndefineExpose({\n  /** Viewport element within ScrollArea */\n  viewport,\n  /** Scroll viewport to top */\n  scrollTop,\n  /** Scroll viewport to top-left */\n  scrollTopLeft,\n})\n\nconst { forwardRef, currentElement: scrollArea } = useForwardExpose()\n\nprovideScrollAreaRootContext({\n  type,\n  dir,\n  scrollHideDelay,\n  scrollArea,\n  viewport,\n  onViewportChange: (el) => {\n    viewport.value = el || undefined\n  },\n  content,\n  onContentChange: (el) => {\n    content.value = el\n  },\n  scrollbarX,\n  scrollbarXEnabled,\n  scrollbarY,\n  scrollbarYEnabled,\n  onScrollbarXChange: (scrollbar) => {\n    scrollbarX.value = scrollbar || undefined\n  },\n  onScrollbarYChange: (scrollbar) => {\n    scrollbarY.value = scrollbar || undefined\n  },\n  onScrollbarXEnabledChange: (rendered) => {\n    scrollbarXEnabled.value = rendered\n  },\n  onScrollbarYEnabledChange: (rendered) => {\n    scrollbarYEnabled.value = rendered\n  },\n  onCornerWidthChange: (width) => {\n    cornerWidth.value = width\n  },\n  onCornerHeightChange: (height) => {\n    cornerHeight.value = height\n  },\n})\n</script>\n\n<template>\n  <Primitive\n    :ref=\"forwardRef\"\n    :as-child=\"props.asChild\"\n    :as=\"as\"\n    :dir=\"dir\"\n    :style=\"{\n      position: 'relative',\n      // Pass corner sizes as CSS vars to reduce re-renders of context consumers\n      ['--reka-scroll-area-corner-width' as any]: `${cornerWidth}px`,\n      ['--reka-scroll-area-corner-height' as any]: `${cornerHeight}px`,\n    }\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["createContext","ref","toRefs","useDirection","useForwardExpose"],"mappings":";;;;;;;;AA2BO,MAAM,CAAC,2BAAA,EAA6B,4BAA4B,CAAA,GACnEA,mCAAqC,gBAAgB;;;;;;;;;;;AAuBzD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAM,MAAA,WAAA,GAAcC,QAAI,CAAC,CAAA;AACzB,IAAM,MAAA,YAAA,GAAeA,QAAI,CAAC,CAAA;AAC1B,IAAA,MAAM,WAAWA,OAAiB,EAAA;AAClC,IAAA,MAAM,UAAUA,OAAiB,EAAA;AACjC,IAAA,MAAM,aAAaA,OAAiB,EAAA;AACpC,IAAA,MAAM,aAAaA,OAAiB,EAAA;AACpC,IAAM,MAAA,iBAAA,GAAoBA,QAAI,KAAK,CAAA;AACnC,IAAM,MAAA,iBAAA,GAAoBA,QAAI,KAAK,CAAA;AAEnC,IAAA,MAAM,EAAE,IAAM,EAAA,GAAA,EAAK,SAAS,eAAgB,EAAA,GAAIC,WAAO,KAAK,CAAA;AAC5D,IAAM,MAAA,GAAA,GAAMC,iCAAa,OAAO,CAAA;AAEhC,IAAA,SAAS,SAAY,GAAA;AACnB,MAAA,QAAA,CAAS,OAAO,QAAS,CAAA;AAAA,QACvB,GAAK,EAAA;AAAA,OACN,CAAA;AAAA;AAEH,IAAA,SAAS,aAAgB,GAAA;AACvB,MAAA,QAAA,CAAS,OAAO,QAAS,CAAA;AAAA,QACvB,GAAK,EAAA,CAAA;AAAA,QACL,IAAM,EAAA;AAAA,OACP,CAAA;AAAA;AAGH,IAAa,QAAA,CAAA;AAAA;AAAA,MAEX,QAAA;AAAA;AAAA,MAEA,SAAA;AAAA;AAAA,MAEA;AAAA,KACD,CAAA;AAED,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,UAAA,KAAeC,wCAAiB,EAAA;AAEpE,IAA6B,4BAAA,CAAA;AAAA,MAC3B,IAAA;AAAA,MACA,GAAA;AAAA,MACA,eAAA;AAAA,MACA,UAAA;AAAA,MACA,QAAA;AAAA,MACA,gBAAA,EAAkB,CAAC,EAAO,KAAA;AACxB,QAAA,QAAA,CAAS,QAAQ,EAAM,IAAA,SAAA;AAAA,OACzB;AAAA,MACA,OAAA;AAAA,MACA,eAAA,EAAiB,CAAC,EAAO,KAAA;AACvB,QAAA,OAAA,CAAQ,KAAQ,GAAA,EAAA;AAAA,OAClB;AAAA,MACA,UAAA;AAAA,MACA,iBAAA;AAAA,MACA,UAAA;AAAA,MACA,iBAAA;AAAA,MACA,kBAAA,EAAoB,CAAC,SAAc,KAAA;AACjC,QAAA,UAAA,CAAW,QAAQ,SAAa,IAAA,SAAA;AAAA,OAClC;AAAA,MACA,kBAAA,EAAoB,CAAC,SAAc,KAAA;AACjC,QAAA,UAAA,CAAW,QAAQ,SAAa,IAAA,SAAA;AAAA,OAClC;AAAA,MACA,yBAAA,EAA2B,CAAC,QAAa,KAAA;AACvC,QAAA,iBAAA,CAAkB,KAAQ,GAAA,QAAA;AAAA,OAC5B;AAAA,MACA,yBAAA,EAA2B,CAAC,QAAa,KAAA;AACvC,QAAA,iBAAA,CAAkB,KAAQ,GAAA,QAAA;AAAA,OAC5B;AAAA,MACA,mBAAA,EAAqB,CAAC,KAAU,KAAA;AAC9B,QAAA,WAAA,CAAY,KAAQ,GAAA,KAAA;AAAA,OACtB;AAAA,MACA,oBAAA,EAAsB,CAAC,MAAW,KAAA;AAChC,QAAA,YAAA,CAAa,KAAQ,GAAA,MAAA;AAAA;AACvB,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaRoot.cjs","sources":["../../src/ScrollArea/ScrollAreaRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Ref } from 'vue'\nimport type { Direction, ScrollType } from './types'\nimport { createContext, useDirection, useForwardExpose } from '@/shared'\n\nexport interface ScrollAreaRootContext {\n  type: Ref<ScrollType>\n  dir: Ref<Direction>\n  scrollHideDelay: Ref<number>\n  scrollArea: Ref<HTMLElement | undefined>\n  viewport: Ref<HTMLElement | undefined>\n  onViewportChange: (viewport: HTMLElement | null) => void\n  content: Ref<HTMLElement | undefined>\n  onContentChange: (content: HTMLElement) => void\n  scrollbarX: Ref<HTMLElement | undefined>\n  onScrollbarXChange: (scrollbar: HTMLElement | null) => void\n  scrollbarXEnabled: Ref<boolean>\n  onScrollbarXEnabledChange: (rendered: boolean) => void\n  scrollbarY: Ref<HTMLElement | undefined>\n  onScrollbarYChange: (scrollbar: HTMLElement | null) => void\n  scrollbarYEnabled: Ref<boolean>\n  onScrollbarYEnabledChange: (rendered: boolean) => void\n  onCornerWidthChange: (width: number) => void\n  onCornerHeightChange: (height: number) => void\n}\n\nexport const [injectScrollAreaRootContext, provideScrollAreaRootContext]\n  = createContext<ScrollAreaRootContext>('ScrollAreaRoot')\n\nexport interface ScrollAreaRootProps extends PrimitiveProps {\n  /**\n   * Describes the nature of scrollbar visibility, similar to how the scrollbar preferences in MacOS control visibility of native scrollbars.\n   *\n   * `auto` - means that scrollbars are visible when content is overflowing on the corresponding orientation. <br>\n   * `always` - means that scrollbars are always visible regardless of whether the content is overflowing.<br>\n   * `scroll` - means that scrollbars are visible when the user is scrolling along its corresponding orientation.<br>\n   * `hover` - when the user is scrolling along its corresponding orientation and when the user is hovering over the scroll area.\n   */\n  type?: ScrollType\n  /** The reading direction of the combobox when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n  dir?: Direction\n  /** If type is set to either `scroll` or `hover`, this prop determines the length of time, in milliseconds, <br> before the scrollbars are hidden after the user stops interacting with scrollbars. */\n  scrollHideDelay?: number\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { ref, toRefs } from 'vue'\n\nconst props = withDefaults(defineProps<ScrollAreaRootProps>(), {\n  type: 'hover',\n  scrollHideDelay: 600,\n})\n\nconst cornerWidth = ref(0)\nconst cornerHeight = ref(0)\nconst viewport = ref<HTMLElement>()\nconst content = ref<HTMLElement>()\nconst scrollbarX = ref<HTMLElement>()\nconst scrollbarY = ref<HTMLElement>()\nconst scrollbarXEnabled = ref(false)\nconst scrollbarYEnabled = ref(false)\n\nconst { type, dir: propDir, scrollHideDelay } = toRefs(props)\nconst dir = useDirection(propDir)\n\nfunction scrollTop() {\n  viewport.value?.scrollTo({\n    top: 0,\n  })\n}\nfunction scrollTopLeft() {\n  viewport.value?.scrollTo({\n    top: 0,\n    left: 0,\n  })\n}\n\ndefineExpose({\n  /** Viewport element within ScrollArea */\n  viewport,\n  /** Scroll viewport to top */\n  scrollTop,\n  /** Scroll viewport to top-left */\n  scrollTopLeft,\n})\n\nconst { forwardRef, currentElement: scrollArea } = useForwardExpose()\n\nprovideScrollAreaRootContext({\n  type,\n  dir,\n  scrollHideDelay,\n  scrollArea,\n  viewport,\n  onViewportChange: (el) => {\n    viewport.value = el || undefined\n  },\n  content,\n  onContentChange: (el) => {\n    content.value = el\n  },\n  scrollbarX,\n  scrollbarXEnabled,\n  scrollbarY,\n  scrollbarYEnabled,\n  onScrollbarXChange: (scrollbar) => {\n    scrollbarX.value = scrollbar || undefined\n  },\n  onScrollbarYChange: (scrollbar) => {\n    scrollbarY.value = scrollbar || undefined\n  },\n  onScrollbarXEnabledChange: (rendered) => {\n    scrollbarXEnabled.value = rendered\n  },\n  onScrollbarYEnabledChange: (rendered) => {\n    scrollbarYEnabled.value = rendered\n  },\n  onCornerWidthChange: (width) => {\n    cornerWidth.value = width\n  },\n  onCornerHeightChange: (height) => {\n    cornerHeight.value = height\n  },\n})\n</script>\n\n<template>\n  <Primitive\n    :ref=\"forwardRef\"\n    :as-child=\"props.asChild\"\n    :as=\"as\"\n    :dir=\"dir\"\n    :style=\"{\n      position: 'relative',\n      // Pass corner sizes as CSS vars to reduce re-renders of context consumers\n      ['--reka-scroll-area-corner-width' as any]: `${cornerWidth}px`,\n      ['--reka-scroll-area-corner-height' as any]: `${cornerHeight}px`,\n    }\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["createContext","ref","toRefs","useDirection","useForwardExpose"],"mappings":";;;;;;;;AA2BO,MAAM,CAAC,2BAAA,EAA6B,4BAA4B,CAAA,GACnEA,mCAAqC,gBAAgB;;;;;;;;;;;AAuBzD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAM,MAAA,WAAA,GAAcC,QAAI,CAAC,CAAA;AACzB,IAAM,MAAA,YAAA,GAAeA,QAAI,CAAC,CAAA;AAC1B,IAAA,MAAM,WAAWA,OAAiB,EAAA;AAClC,IAAA,MAAM,UAAUA,OAAiB,EAAA;AACjC,IAAA,MAAM,aAAaA,OAAiB,EAAA;AACpC,IAAA,MAAM,aAAaA,OAAiB,EAAA;AACpC,IAAM,MAAA,iBAAA,GAAoBA,QAAI,KAAK,CAAA;AACnC,IAAM,MAAA,iBAAA,GAAoBA,QAAI,KAAK,CAAA;AAEnC,IAAA,MAAM,EAAE,IAAM,EAAA,GAAA,EAAK,SAAS,eAAgB,EAAA,GAAIC,WAAO,KAAK,CAAA;AAC5D,IAAM,MAAA,GAAA,GAAMC,iCAAa,OAAO,CAAA;AAEhC,IAAA,SAAS,SAAY,GAAA;AACnB,MAAA,QAAA,CAAS,OAAO,QAAS,CAAA;AAAA,QACvB,GAAK,EAAA;AAAA,OACN,CAAA;AAAA;AAEH,IAAA,SAAS,aAAgB,GAAA;AACvB,MAAA,QAAA,CAAS,OAAO,QAAS,CAAA;AAAA,QACvB,GAAK,EAAA,CAAA;AAAA,QACL,IAAM,EAAA;AAAA,OACP,CAAA;AAAA;AAGH,IAAa,QAAA,CAAA;AAAA;AAAA,MAEX,QAAA;AAAA;AAAA,MAEA,SAAA;AAAA;AAAA,MAEA;AAAA,KACD,CAAA;AAED,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,UAAA,KAAeC,wCAAiB,EAAA;AAEpE,IAA6B,4BAAA,CAAA;AAAA,MAC3B,IAAA;AAAA,MACA,GAAA;AAAA,MACA,eAAA;AAAA,MACA,UAAA;AAAA,MACA,QAAA;AAAA,MACA,gBAAA,EAAkB,CAAC,EAAO,KAAA;AACxB,QAAA,QAAA,CAAS,QAAQ,EAAM,IAAA,MAAA;AAAA,OACzB;AAAA,MACA,OAAA;AAAA,MACA,eAAA,EAAiB,CAAC,EAAO,KAAA;AACvB,QAAA,OAAA,CAAQ,KAAQ,GAAA,EAAA;AAAA,OAClB;AAAA,MACA,UAAA;AAAA,MACA,iBAAA;AAAA,MACA,UAAA;AAAA,MACA,iBAAA;AAAA,MACA,kBAAA,EAAoB,CAAC,SAAc,KAAA;AACjC,QAAA,UAAA,CAAW,QAAQ,SAAa,IAAA,MAAA;AAAA,OAClC;AAAA,MACA,kBAAA,EAAoB,CAAC,SAAc,KAAA;AACjC,QAAA,UAAA,CAAW,QAAQ,SAAa,IAAA,MAAA;AAAA,OAClC;AAAA,MACA,yBAAA,EAA2B,CAAC,QAAa,KAAA;AACvC,QAAA,iBAAA,CAAkB,KAAQ,GAAA,QAAA;AAAA,OAC5B;AAAA,MACA,yBAAA,EAA2B,CAAC,QAAa,KAAA;AACvC,QAAA,iBAAA,CAAkB,KAAQ,GAAA,QAAA;AAAA,OAC5B;AAAA,MACA,mBAAA,EAAqB,CAAC,KAAU,KAAA;AAC9B,QAAA,WAAA,CAAY,KAAQ,GAAA,KAAA;AAAA,OACtB;AAAA,MACA,oBAAA,EAAsB,CAAC,MAAW,KAAA;AAChC,QAAA,YAAA,CAAa,KAAQ,GAAA,MAAA;AAAA;AACvB,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaRoot.js

@@ -1,8 +1,8 @@
-import { defineComponent, ref, toRefs, openBlock, createBlock, unref, normalizeStyle, withCtx, renderSlot } from 'vue';
+import { defineComponent, ref, toRefs, createBlock, openBlock, unref, normalizeStyle, withCtx, renderSlot } from 'vue';
+import { c as createContext } from '../shared/createContext.js';
 import { u as useDirection } from '../shared/useDirection.js';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';
 import { P as Primitive } from '../Primitive/Primitive.js';
-import { c as createContext } from '../shared/createContext.js';
 
 const [injectScrollAreaRootContext, provideScrollAreaRootContext] = createContext("ScrollAreaRoot");
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -53,7 +53,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       scrollArea,
       viewport,
       onViewportChange: (el) => {
-        viewport.value = el || undefined;
+        viewport.value = el || void 0;
       },
       content,
       onContentChange: (el) => {
@@ -64,10 +64,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       scrollbarY,
       scrollbarYEnabled,
       onScrollbarXChange: (scrollbar) => {
-        scrollbarX.value = scrollbar || undefined;
+        scrollbarX.value = scrollbar || void 0;
       },
       onScrollbarYChange: (scrollbar) => {
-        scrollbarY.value = scrollbar || undefined;
+        scrollbarY.value = scrollbar || void 0;
       },
       onScrollbarXEnabledChange: (rendered) => {
         scrollbarXEnabled.value = rendered;

package/dist/ScrollArea/ScrollAreaRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaRoot.js","sources":["../../src/ScrollArea/ScrollAreaRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Direction, ScrollType } from './types'\nimport { createContext, useDirection, useForwardExpose } from '@/shared'\n\nexport interface ScrollAreaRootContext {\n  type: Ref<ScrollType>\n  dir: Ref<Direction>\n  scrollHideDelay: Ref<number>\n  scrollArea: Ref<HTMLElement | undefined>\n  viewport: Ref<HTMLElement | undefined>\n  onViewportChange: (viewport: HTMLElement | null) => void\n  content: Ref<HTMLElement | undefined>\n  onContentChange: (content: HTMLElement) => void\n  scrollbarX: Ref<HTMLElement | undefined>\n  onScrollbarXChange: (scrollbar: HTMLElement | null) => void\n  scrollbarXEnabled: Ref<boolean>\n  onScrollbarXEnabledChange: (rendered: boolean) => void\n  scrollbarY: Ref<HTMLElement | undefined>\n  onScrollbarYChange: (scrollbar: HTMLElement | null) => void\n  scrollbarYEnabled: Ref<boolean>\n  onScrollbarYEnabledChange: (rendered: boolean) => void\n  onCornerWidthChange: (width: number) => void\n  onCornerHeightChange: (height: number) => void\n}\n\nexport const [injectScrollAreaRootContext, provideScrollAreaRootContext]\n  = createContext<ScrollAreaRootContext>('ScrollAreaRoot')\n\nexport interface ScrollAreaRootProps extends PrimitiveProps {\n  /**\n   * Describes the nature of scrollbar visibility, similar to how the scrollbar preferences in MacOS control visibility of native scrollbars.\n   *\n   * `auto` - means that scrollbars are visible when content is overflowing on the corresponding orientation. <br>\n   * `always` - means that scrollbars are always visible regardless of whether the content is overflowing.<br>\n   * `scroll` - means that scrollbars are visible when the user is scrolling along its corresponding orientation.<br>\n   * `hover` - when the user is scrolling along its corresponding orientation and when the user is hovering over the scroll area.\n   */\n  type?: ScrollType\n  /** The reading direction of the combobox when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n  dir?: Direction\n  /** If type is set to either `scroll` or `hover`, this prop determines the length of time, in milliseconds, <br> before the scrollbars are hidden after the user stops interacting with scrollbars. */\n  scrollHideDelay?: number\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, toRefs } from 'vue'\nimport { Primitive } from '@/Primitive'\n\nconst props = withDefaults(defineProps<ScrollAreaRootProps>(), {\n  type: 'hover',\n  scrollHideDelay: 600,\n})\n\nconst cornerWidth = ref(0)\nconst cornerHeight = ref(0)\nconst viewport = ref<HTMLElement>()\nconst content = ref<HTMLElement>()\nconst scrollbarX = ref<HTMLElement>()\nconst scrollbarY = ref<HTMLElement>()\nconst scrollbarXEnabled = ref(false)\nconst scrollbarYEnabled = ref(false)\n\nconst { type, dir: propDir, scrollHideDelay } = toRefs(props)\nconst dir = useDirection(propDir)\n\nfunction scrollTop() {\n  viewport.value?.scrollTo({\n    top: 0,\n  })\n}\nfunction scrollTopLeft() {\n  viewport.value?.scrollTo({\n    top: 0,\n    left: 0,\n  })\n}\n\ndefineExpose({\n  /** Viewport element within ScrollArea */\n  viewport,\n  /** Scroll viewport to top */\n  scrollTop,\n  /** Scroll viewport to top-left */\n  scrollTopLeft,\n})\n\nconst { forwardRef, currentElement: scrollArea } = useForwardExpose()\n\nprovideScrollAreaRootContext({\n  type,\n  dir,\n  scrollHideDelay,\n  scrollArea,\n  viewport,\n  onViewportChange: (el) => {\n    viewport.value = el || undefined\n  },\n  content,\n  onContentChange: (el) => {\n    content.value = el\n  },\n  scrollbarX,\n  scrollbarXEnabled,\n  scrollbarY,\n  scrollbarYEnabled,\n  onScrollbarXChange: (scrollbar) => {\n    scrollbarX.value = scrollbar || undefined\n  },\n  onScrollbarYChange: (scrollbar) => {\n    scrollbarY.value = scrollbar || undefined\n  },\n  onScrollbarXEnabledChange: (rendered) => {\n    scrollbarXEnabled.value = rendered\n  },\n  onScrollbarYEnabledChange: (rendered) => {\n    scrollbarYEnabled.value = rendered\n  },\n  onCornerWidthChange: (width) => {\n    cornerWidth.value = width\n  },\n  onCornerHeightChange: (height) => {\n    cornerHeight.value = height\n  },\n})\n</script>\n\n<template>\n  <Primitive\n    :ref=\"forwardRef\"\n    :as-child=\"props.asChild\"\n    :as=\"as\"\n    :dir=\"dir\"\n    :style=\"{\n      position: 'relative',\n      // Pass corner sizes as CSS vars to reduce re-renders of context consumers\n      ['--reka-scroll-area-corner-width' as any]: `${cornerWidth}px`,\n      ['--reka-scroll-area-corner-height' as any]: `${cornerHeight}px`,\n    }\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;AA2BO,MAAM,CAAC,2BAAA,EAA6B,4BAA4B,CAAA,GACnE,cAAqC,gBAAgB;;;;;;;;;;;AAuBzD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAM,MAAA,WAAA,GAAc,IAAI,CAAC,CAAA;AACzB,IAAM,MAAA,YAAA,GAAe,IAAI,CAAC,CAAA;AAC1B,IAAA,MAAM,WAAW,GAAiB,EAAA;AAClC,IAAA,MAAM,UAAU,GAAiB,EAAA;AACjC,IAAA,MAAM,aAAa,GAAiB,EAAA;AACpC,IAAA,MAAM,aAAa,GAAiB,EAAA;AACpC,IAAM,MAAA,iBAAA,GAAoB,IAAI,KAAK,CAAA;AACnC,IAAM,MAAA,iBAAA,GAAoB,IAAI,KAAK,CAAA;AAEnC,IAAA,MAAM,EAAE,IAAM,EAAA,GAAA,EAAK,SAAS,eAAgB,EAAA,GAAI,OAAO,KAAK,CAAA;AAC5D,IAAM,MAAA,GAAA,GAAM,aAAa,OAAO,CAAA;AAEhC,IAAA,SAAS,SAAY,GAAA;AACnB,MAAA,QAAA,CAAS,OAAO,QAAS,CAAA;AAAA,QACvB,GAAK,EAAA;AAAA,OACN,CAAA;AAAA;AAEH,IAAA,SAAS,aAAgB,GAAA;AACvB,MAAA,QAAA,CAAS,OAAO,QAAS,CAAA;AAAA,QACvB,GAAK,EAAA,CAAA;AAAA,QACL,IAAM,EAAA;AAAA,OACP,CAAA;AAAA;AAGH,IAAa,QAAA,CAAA;AAAA;AAAA,MAEX,QAAA;AAAA;AAAA,MAEA,SAAA;AAAA;AAAA,MAEA;AAAA,KACD,CAAA;AAED,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,UAAA,KAAe,gBAAiB,EAAA;AAEpE,IAA6B,4BAAA,CAAA;AAAA,MAC3B,IAAA;AAAA,MACA,GAAA;AAAA,MACA,eAAA;AAAA,MACA,UAAA;AAAA,MACA,QAAA;AAAA,MACA,gBAAA,EAAkB,CAAC,EAAO,KAAA;AACxB,QAAA,QAAA,CAAS,QAAQ,EAAM,IAAA,SAAA;AAAA,OACzB;AAAA,MACA,OAAA;AAAA,MACA,eAAA,EAAiB,CAAC,EAAO,KAAA;AACvB,QAAA,OAAA,CAAQ,KAAQ,GAAA,EAAA;AAAA,OAClB;AAAA,MACA,UAAA;AAAA,MACA,iBAAA;AAAA,MACA,UAAA;AAAA,MACA,iBAAA;AAAA,MACA,kBAAA,EAAoB,CAAC,SAAc,KAAA;AACjC,QAAA,UAAA,CAAW,QAAQ,SAAa,IAAA,SAAA;AAAA,OAClC;AAAA,MACA,kBAAA,EAAoB,CAAC,SAAc,KAAA;AACjC,QAAA,UAAA,CAAW,QAAQ,SAAa,IAAA,SAAA;AAAA,OAClC;AAAA,MACA,yBAAA,EAA2B,CAAC,QAAa,KAAA;AACvC,QAAA,iBAAA,CAAkB,KAAQ,GAAA,QAAA;AAAA,OAC5B;AAAA,MACA,yBAAA,EAA2B,CAAC,QAAa,KAAA;AACvC,QAAA,iBAAA,CAAkB,KAAQ,GAAA,QAAA;AAAA,OAC5B;AAAA,MACA,mBAAA,EAAqB,CAAC,KAAU,KAAA;AAC9B,QAAA,WAAA,CAAY,KAAQ,GAAA,KAAA;AAAA,OACtB;AAAA,MACA,oBAAA,EAAsB,CAAC,MAAW,KAAA;AAChC,QAAA,YAAA,CAAa,KAAQ,GAAA,MAAA;AAAA;AACvB,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaRoot.js","sources":["../../src/ScrollArea/ScrollAreaRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Ref } from 'vue'\nimport type { Direction, ScrollType } from './types'\nimport { createContext, useDirection, useForwardExpose } from '@/shared'\n\nexport interface ScrollAreaRootContext {\n  type: Ref<ScrollType>\n  dir: Ref<Direction>\n  scrollHideDelay: Ref<number>\n  scrollArea: Ref<HTMLElement | undefined>\n  viewport: Ref<HTMLElement | undefined>\n  onViewportChange: (viewport: HTMLElement | null) => void\n  content: Ref<HTMLElement | undefined>\n  onContentChange: (content: HTMLElement) => void\n  scrollbarX: Ref<HTMLElement | undefined>\n  onScrollbarXChange: (scrollbar: HTMLElement | null) => void\n  scrollbarXEnabled: Ref<boolean>\n  onScrollbarXEnabledChange: (rendered: boolean) => void\n  scrollbarY: Ref<HTMLElement | undefined>\n  onScrollbarYChange: (scrollbar: HTMLElement | null) => void\n  scrollbarYEnabled: Ref<boolean>\n  onScrollbarYEnabledChange: (rendered: boolean) => void\n  onCornerWidthChange: (width: number) => void\n  onCornerHeightChange: (height: number) => void\n}\n\nexport const [injectScrollAreaRootContext, provideScrollAreaRootContext]\n  = createContext<ScrollAreaRootContext>('ScrollAreaRoot')\n\nexport interface ScrollAreaRootProps extends PrimitiveProps {\n  /**\n   * Describes the nature of scrollbar visibility, similar to how the scrollbar preferences in MacOS control visibility of native scrollbars.\n   *\n   * `auto` - means that scrollbars are visible when content is overflowing on the corresponding orientation. <br>\n   * `always` - means that scrollbars are always visible regardless of whether the content is overflowing.<br>\n   * `scroll` - means that scrollbars are visible when the user is scrolling along its corresponding orientation.<br>\n   * `hover` - when the user is scrolling along its corresponding orientation and when the user is hovering over the scroll area.\n   */\n  type?: ScrollType\n  /** The reading direction of the combobox when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n  dir?: Direction\n  /** If type is set to either `scroll` or `hover`, this prop determines the length of time, in milliseconds, <br> before the scrollbars are hidden after the user stops interacting with scrollbars. */\n  scrollHideDelay?: number\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { ref, toRefs } from 'vue'\n\nconst props = withDefaults(defineProps<ScrollAreaRootProps>(), {\n  type: 'hover',\n  scrollHideDelay: 600,\n})\n\nconst cornerWidth = ref(0)\nconst cornerHeight = ref(0)\nconst viewport = ref<HTMLElement>()\nconst content = ref<HTMLElement>()\nconst scrollbarX = ref<HTMLElement>()\nconst scrollbarY = ref<HTMLElement>()\nconst scrollbarXEnabled = ref(false)\nconst scrollbarYEnabled = ref(false)\n\nconst { type, dir: propDir, scrollHideDelay } = toRefs(props)\nconst dir = useDirection(propDir)\n\nfunction scrollTop() {\n  viewport.value?.scrollTo({\n    top: 0,\n  })\n}\nfunction scrollTopLeft() {\n  viewport.value?.scrollTo({\n    top: 0,\n    left: 0,\n  })\n}\n\ndefineExpose({\n  /** Viewport element within ScrollArea */\n  viewport,\n  /** Scroll viewport to top */\n  scrollTop,\n  /** Scroll viewport to top-left */\n  scrollTopLeft,\n})\n\nconst { forwardRef, currentElement: scrollArea } = useForwardExpose()\n\nprovideScrollAreaRootContext({\n  type,\n  dir,\n  scrollHideDelay,\n  scrollArea,\n  viewport,\n  onViewportChange: (el) => {\n    viewport.value = el || undefined\n  },\n  content,\n  onContentChange: (el) => {\n    content.value = el\n  },\n  scrollbarX,\n  scrollbarXEnabled,\n  scrollbarY,\n  scrollbarYEnabled,\n  onScrollbarXChange: (scrollbar) => {\n    scrollbarX.value = scrollbar || undefined\n  },\n  onScrollbarYChange: (scrollbar) => {\n    scrollbarY.value = scrollbar || undefined\n  },\n  onScrollbarXEnabledChange: (rendered) => {\n    scrollbarXEnabled.value = rendered\n  },\n  onScrollbarYEnabledChange: (rendered) => {\n    scrollbarYEnabled.value = rendered\n  },\n  onCornerWidthChange: (width) => {\n    cornerWidth.value = width\n  },\n  onCornerHeightChange: (height) => {\n    cornerHeight.value = height\n  },\n})\n</script>\n\n<template>\n  <Primitive\n    :ref=\"forwardRef\"\n    :as-child=\"props.asChild\"\n    :as=\"as\"\n    :dir=\"dir\"\n    :style=\"{\n      position: 'relative',\n      // Pass corner sizes as CSS vars to reduce re-renders of context consumers\n      ['--reka-scroll-area-corner-width' as any]: `${cornerWidth}px`,\n      ['--reka-scroll-area-corner-height' as any]: `${cornerHeight}px`,\n    }\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;AA2BO,MAAM,CAAC,2BAAA,EAA6B,4BAA4B,CAAA,GACnE,cAAqC,gBAAgB;;;;;;;;;;;AAuBzD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAM,MAAA,WAAA,GAAc,IAAI,CAAC,CAAA;AACzB,IAAM,MAAA,YAAA,GAAe,IAAI,CAAC,CAAA;AAC1B,IAAA,MAAM,WAAW,GAAiB,EAAA;AAClC,IAAA,MAAM,UAAU,GAAiB,EAAA;AACjC,IAAA,MAAM,aAAa,GAAiB,EAAA;AACpC,IAAA,MAAM,aAAa,GAAiB,EAAA;AACpC,IAAM,MAAA,iBAAA,GAAoB,IAAI,KAAK,CAAA;AACnC,IAAM,MAAA,iBAAA,GAAoB,IAAI,KAAK,CAAA;AAEnC,IAAA,MAAM,EAAE,IAAM,EAAA,GAAA,EAAK,SAAS,eAAgB,EAAA,GAAI,OAAO,KAAK,CAAA;AAC5D,IAAM,MAAA,GAAA,GAAM,aAAa,OAAO,CAAA;AAEhC,IAAA,SAAS,SAAY,GAAA;AACnB,MAAA,QAAA,CAAS,OAAO,QAAS,CAAA;AAAA,QACvB,GAAK,EAAA;AAAA,OACN,CAAA;AAAA;AAEH,IAAA,SAAS,aAAgB,GAAA;AACvB,MAAA,QAAA,CAAS,OAAO,QAAS,CAAA;AAAA,QACvB,GAAK,EAAA,CAAA;AAAA,QACL,IAAM,EAAA;AAAA,OACP,CAAA;AAAA;AAGH,IAAa,QAAA,CAAA;AAAA;AAAA,MAEX,QAAA;AAAA;AAAA,MAEA,SAAA;AAAA;AAAA,MAEA;AAAA,KACD,CAAA;AAED,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,UAAA,KAAe,gBAAiB,EAAA;AAEpE,IAA6B,4BAAA,CAAA;AAAA,MAC3B,IAAA;AAAA,MACA,GAAA;AAAA,MACA,eAAA;AAAA,MACA,UAAA;AAAA,MACA,QAAA;AAAA,MACA,gBAAA,EAAkB,CAAC,EAAO,KAAA;AACxB,QAAA,QAAA,CAAS,QAAQ,EAAM,IAAA,MAAA;AAAA,OACzB;AAAA,MACA,OAAA;AAAA,MACA,eAAA,EAAiB,CAAC,EAAO,KAAA;AACvB,QAAA,OAAA,CAAQ,KAAQ,GAAA,EAAA;AAAA,OAClB;AAAA,MACA,UAAA;AAAA,MACA,iBAAA;AAAA,MACA,UAAA;AAAA,MACA,iBAAA;AAAA,MACA,kBAAA,EAAoB,CAAC,SAAc,KAAA;AACjC,QAAA,UAAA,CAAW,QAAQ,SAAa,IAAA,MAAA;AAAA,OAClC;AAAA,MACA,kBAAA,EAAoB,CAAC,SAAc,KAAA;AACjC,QAAA,UAAA,CAAW,QAAQ,SAAa,IAAA,MAAA;AAAA,OAClC;AAAA,MACA,yBAAA,EAA2B,CAAC,QAAa,KAAA;AACvC,QAAA,iBAAA,CAAkB,KAAQ,GAAA,QAAA;AAAA,OAC5B;AAAA,MACA,yBAAA,EAA2B,CAAC,QAAa,KAAA;AACvC,QAAA,iBAAA,CAAkB,KAAQ,GAAA,QAAA;AAAA,OAC5B;AAAA,MACA,mBAAA,EAAqB,CAAC,KAAU,KAAA;AAC9B,QAAA,WAAA,CAAY,KAAQ,GAAA,KAAA;AAAA,OACtB;AAAA,MACA,oBAAA,EAAsB,CAAC,MAAW,KAAA;AAChC,QAAA,YAAA,CAAa,KAAQ,GAAA,MAAA;AAAA;AACvB,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaScrollbar.cjs

@@ -1,12 +1,12 @@
 'use strict';
 
 const vue = require('vue');
+const ScrollArea_ScrollAreaScrollbarAuto = require('./ScrollAreaScrollbarAuto.cjs');
 const ScrollArea_ScrollAreaScrollbarHover = require('./ScrollAreaScrollbarHover.cjs');
 const ScrollArea_ScrollAreaScrollbarScroll = require('./ScrollAreaScrollbarScroll.cjs');
-const ScrollArea_ScrollAreaScrollbarAuto = require('./ScrollAreaScrollbarAuto.cjs');
 const ScrollArea_ScrollAreaScrollbarVisible = require('./ScrollAreaScrollbarVisible.cjs');
-const shared_useForwardExpose = require('../shared/useForwardExpose.cjs');
 const shared_createContext = require('../shared/createContext.cjs');
+const shared_useForwardExpose = require('../shared/useForwardExpose.cjs');
 const ScrollArea_ScrollAreaRoot = require('./ScrollAreaRoot.cjs');
 
 const [injectScrollAreaScrollbarContext, provideScrollAreaScrollbarContext] = shared_createContext.createContext("ScrollAreaScrollbar");

package/dist/ScrollArea/ScrollAreaScrollbar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaScrollbar.cjs","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 ScrollAreaScrollbarHover from './ScrollAreaScrollbarHover.vue'\nimport ScrollAreaScrollbarScroll from './ScrollAreaScrollbarScroll.vue'\nimport ScrollAreaScrollbarAuto from './ScrollAreaScrollbarAuto.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":["createContext","useForwardExpose","injectScrollAreaRootContext","computed","watch","onUnmounted","toRefs"],"mappings":";;;;;;;;;;;AAuBO,MAAM,CAAC,gCAAA,EAAkC,iCAAiC,CAAA,GAC7EA,mCAAyC,qBAAqB;;;;;;;;;;;;;AAoBlE,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAM,MAAA,EAAE,UAAW,EAAA,GAAIC,wCAAiB,EAAA;AACxC,IAAA,MAAM,cAAcC,qDAA4B,EAAA;AAEhD,IAAA,MAAM,YAAe,GAAAC,YAAA,CAAS,MAAM,KAAA,CAAM,gBAAgB,YAAY,CAAA;AAEtE,IAAAC,SAAA;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,IAAAC,eAAA,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,GAAIC,WAAO,KAAK,CAAA;AAC7D,IAAkC,iCAAA,CAAA;AAAA,MAChC,WAAA;AAAA,MACA,UAAA;AAAA,MACA,YAAA;AAAA,MACA,EAAA;AAAA,MACA;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaScrollbar.cjs","sources":["../../src/ScrollArea/ScrollAreaScrollbar.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Ref } from 'vue'\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":["createContext","useForwardExpose","injectScrollAreaRootContext","computed","watch","onUnmounted","toRefs"],"mappings":";;;;;;;;;;;AAuBO,MAAM,CAAC,gCAAA,EAAkC,iCAAiC,CAAA,GAC7EA,mCAAyC,qBAAqB;;;;;;;;;;;;;AAoBlE,IAAA,MAAM,KAAQ,GAAA,OAAA;AAKd,IAAM,MAAA,EAAE,UAAW,EAAA,GAAIC,wCAAiB,EAAA;AACxC,IAAA,MAAM,cAAcC,qDAA4B,EAAA;AAEhD,IAAA,MAAM,YAAe,GAAAC,YAAA,CAAS,MAAM,KAAA,CAAM,gBAAgB,YAAY,CAAA;AAEtE,IAAAC,SAAA;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,IAAAC,eAAA,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,GAAIC,WAAO,KAAK,CAAA;AAC7D,IAAkC,iCAAA,CAAA;AAAA,MAChC,WAAA;AAAA,MACA,UAAA;AAAA,MACA,YAAA;AAAA,MACA,EAAA;AAAA,MACA;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaScrollbar.js

@@ -1,10 +1,10 @@
-import { defineComponent, computed, watch, onUnmounted, toRefs, unref, openBlock, createBlock, mergeProps, withCtx, renderSlot, createCommentVNode } from 'vue';
+import { defineComponent, computed, watch, onUnmounted, toRefs, createBlock, createCommentVNode, unref, openBlock, mergeProps, withCtx, renderSlot } from 'vue';
+import { _ as _sfc_main$3 } from './ScrollAreaScrollbarAuto.js';
 import { _ as _sfc_main$1 } from './ScrollAreaScrollbarHover.js';
 import { _ as _sfc_main$2 } from './ScrollAreaScrollbarScroll.js';
-import { _ as _sfc_main$3 } from './ScrollAreaScrollbarAuto.js';
 import { _ as _sfc_main$4 } from './ScrollAreaScrollbarVisible.js';
-import { u as useForwardExpose } from '../shared/useForwardExpose.js';
 import { c as createContext } from '../shared/createContext.js';
+import { u as useForwardExpose } from '../shared/useForwardExpose.js';
 import { i as injectScrollAreaRootContext } from './ScrollAreaRoot.js';
 
 const [injectScrollAreaScrollbarContext, provideScrollAreaScrollbarContext] = createContext("ScrollAreaScrollbar");

package/dist/ScrollArea/ScrollAreaScrollbar.js.map

@@ -1 +1 @@
-{"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 ScrollAreaScrollbarHover from './ScrollAreaScrollbarHover.vue'\nimport ScrollAreaScrollbarScroll from './ScrollAreaScrollbarScroll.vue'\nimport ScrollAreaScrollbarAuto from './ScrollAreaScrollbarAuto.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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaScrollbar.js","sources":["../../src/ScrollArea/ScrollAreaScrollbar.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Ref } from 'vue'\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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaScrollbarAuto.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaScrollbarAuto.cjs","sources":["../../src/ScrollArea/ScrollAreaScrollbarAuto.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ScrollAreaScrollbarAutoProps {\n  forceMount?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, ref } from 'vue'\nimport { useDebounceFn, useResizeObserver } from '@vueuse/core'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport { injectScrollAreaScrollbarContext } from './ScrollAreaScrollbar.vue'\nimport ScrollAreaScrollbarVisible from './ScrollAreaScrollbarVisible.vue'\nimport { Presence } from '@/Presence'\nimport { useForwardExpose } from '@/shared'\n\ndefineProps<ScrollAreaScrollbarAutoProps>()\n\nconst rootContext = injectScrollAreaRootContext()\nconst scrollbarContext = injectScrollAreaScrollbarContext()\n\nconst { forwardRef } = useForwardExpose()\n\nconst visible = ref(false)\n\nconst handleResize = useDebounceFn(() => {\n  if (rootContext.viewport.value) {\n    const isOverflowX\n      = rootContext.viewport.value.offsetWidth\n      < rootContext.viewport.value.scrollWidth\n    const isOverflowY\n      = rootContext.viewport.value.offsetHeight\n      < rootContext.viewport.value.scrollHeight\n\n    visible.value = scrollbarContext.isHorizontal.value\n      ? isOverflowX\n      : isOverflowY\n  }\n}, 10)\n\nonMounted(() => handleResize())\n\nuseResizeObserver(rootContext.viewport, handleResize)\nuseResizeObserver(rootContext.content, handleResize)\n</script>\n\n<template>\n  <Presence :present=\"forceMount || visible\">\n    <ScrollAreaScrollbarVisible\n      v-bind=\"$attrs\"\n      :ref=\"forwardRef\"\n      :data-state=\"visible ? 'visible' : 'hidden'\"\n    >\n      <slot />\n    </ScrollAreaScrollbarVisible>\n  </Presence>\n</template>\n"],"names":["injectScrollAreaRootContext","injectScrollAreaScrollbarContext","useForwardExpose","ref","useDebounceFn","onMounted","useResizeObserver"],"mappings":";;;;;;;;;;;;;;;;AAiBA,IAAA,MAAM,cAAcA,qDAA4B,EAAA;AAChD,IAAA,MAAM,mBAAmBC,+DAAiC,EAAA;AAE1D,IAAM,MAAA,EAAE,UAAW,EAAA,GAAIC,wCAAiB,EAAA;AAExC,IAAM,MAAA,OAAA,GAAUC,QAAI,KAAK,CAAA;AAEzB,IAAM,MAAA,YAAA,GAAeC,mBAAc,MAAM;AACvC,MAAI,IAAA,WAAA,CAAY,SAAS,KAAO,EAAA;AAC9B,QAAA,MAAM,cACF,WAAY,CAAA,QAAA,CAAS,MAAM,WAC3B,GAAA,WAAA,CAAY,SAAS,KAAM,CAAA,WAAA;AAC/B,QAAA,MAAM,cACF,WAAY,CAAA,QAAA,CAAS,MAAM,YAC3B,GAAA,WAAA,CAAY,SAAS,KAAM,CAAA,YAAA;AAE/B,QAAA,OAAA,CAAQ,KAAQ,GAAA,gBAAA,CAAiB,YAAa,CAAA,KAAA,GAC1C,WACA,GAAA,WAAA;AAAA;AACN,OACC,EAAE,CAAA;AAEL,IAAUC,aAAA,CAAA,MAAM,cAAc,CAAA;AAE9B,IAAkBC,sBAAA,CAAA,WAAA,CAAY,UAAU,YAAY,CAAA;AACpD,IAAkBA,sBAAA,CAAA,WAAA,CAAY,SAAS,YAAY,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaScrollbarAuto.cjs","sources":["../../src/ScrollArea/ScrollAreaScrollbarAuto.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ScrollAreaScrollbarAutoProps {\n  forceMount?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Presence } from '@/Presence'\nimport { useForwardExpose } from '@/shared'\nimport { useDebounceFn, useResizeObserver } from '@vueuse/core'\nimport { onMounted, ref } from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport { injectScrollAreaScrollbarContext } from './ScrollAreaScrollbar.vue'\nimport ScrollAreaScrollbarVisible from './ScrollAreaScrollbarVisible.vue'\n\ndefineProps<ScrollAreaScrollbarAutoProps>()\n\nconst rootContext = injectScrollAreaRootContext()\nconst scrollbarContext = injectScrollAreaScrollbarContext()\n\nconst { forwardRef } = useForwardExpose()\n\nconst visible = ref(false)\n\nconst handleResize = useDebounceFn(() => {\n  if (rootContext.viewport.value) {\n    const isOverflowX\n      = rootContext.viewport.value.offsetWidth\n        < rootContext.viewport.value.scrollWidth\n    const isOverflowY\n      = rootContext.viewport.value.offsetHeight\n        < rootContext.viewport.value.scrollHeight\n\n    visible.value = scrollbarContext.isHorizontal.value\n      ? isOverflowX\n      : isOverflowY\n  }\n}, 10)\n\nonMounted(() => handleResize())\n\nuseResizeObserver(rootContext.viewport, handleResize)\nuseResizeObserver(rootContext.content, handleResize)\n</script>\n\n<template>\n  <Presence :present=\"forceMount || visible\">\n    <ScrollAreaScrollbarVisible\n      v-bind=\"$attrs\"\n      :ref=\"forwardRef\"\n      :data-state=\"visible ? 'visible' : 'hidden'\"\n    >\n      <slot />\n    </ScrollAreaScrollbarVisible>\n  </Presence>\n</template>\n"],"names":["injectScrollAreaRootContext","injectScrollAreaScrollbarContext","useForwardExpose","ref","useDebounceFn","onMounted","useResizeObserver"],"mappings":";;;;;;;;;;;;;;;;AAiBA,IAAA,MAAM,cAAcA,qDAA4B,EAAA;AAChD,IAAA,MAAM,mBAAmBC,+DAAiC,EAAA;AAE1D,IAAM,MAAA,EAAE,UAAW,EAAA,GAAIC,wCAAiB,EAAA;AAExC,IAAM,MAAA,OAAA,GAAUC,QAAI,KAAK,CAAA;AAEzB,IAAM,MAAA,YAAA,GAAeC,mBAAc,MAAM;AACvC,MAAI,IAAA,WAAA,CAAY,SAAS,KAAO,EAAA;AAC9B,QAAA,MAAM,cACF,WAAY,CAAA,QAAA,CAAS,MAAM,WACzB,GAAA,WAAA,CAAY,SAAS,KAAM,CAAA,WAAA;AACjC,QAAA,MAAM,cACF,WAAY,CAAA,QAAA,CAAS,MAAM,YACzB,GAAA,WAAA,CAAY,SAAS,KAAM,CAAA,YAAA;AAEjC,QAAA,OAAA,CAAQ,KAAQ,GAAA,gBAAA,CAAiB,YAAa,CAAA,KAAA,GAC1C,WACA,GAAA,WAAA;AAAA;AACN,OACC,EAAE,CAAA;AAEL,IAAUC,aAAA,CAAA,MAAM,cAAc,CAAA;AAE9B,IAAkBC,sBAAA,CAAA,WAAA,CAAY,UAAU,YAAY,CAAA;AACpD,IAAkBA,sBAAA,CAAA,WAAA,CAAY,SAAS,YAAY,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaScrollbarAuto.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, onMounted, openBlock, createBlock, unref, withCtx, createVNode, mergeProps, renderSlot } from 'vue';
+import { defineComponent, ref, onMounted, createBlock, openBlock, unref, withCtx, createVNode, mergeProps, renderSlot } from 'vue';
 import { useDebounceFn, useResizeObserver } from '@vueuse/core';
 import { _ as _sfc_main$1 } from './ScrollAreaScrollbarVisible.js';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';

package/dist/ScrollArea/ScrollAreaScrollbarAuto.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaScrollbarAuto.js","sources":["../../src/ScrollArea/ScrollAreaScrollbarAuto.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ScrollAreaScrollbarAutoProps {\n  forceMount?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, ref } from 'vue'\nimport { useDebounceFn, useResizeObserver } from '@vueuse/core'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport { injectScrollAreaScrollbarContext } from './ScrollAreaScrollbar.vue'\nimport ScrollAreaScrollbarVisible from './ScrollAreaScrollbarVisible.vue'\nimport { Presence } from '@/Presence'\nimport { useForwardExpose } from '@/shared'\n\ndefineProps<ScrollAreaScrollbarAutoProps>()\n\nconst rootContext = injectScrollAreaRootContext()\nconst scrollbarContext = injectScrollAreaScrollbarContext()\n\nconst { forwardRef } = useForwardExpose()\n\nconst visible = ref(false)\n\nconst handleResize = useDebounceFn(() => {\n  if (rootContext.viewport.value) {\n    const isOverflowX\n      = rootContext.viewport.value.offsetWidth\n      < rootContext.viewport.value.scrollWidth\n    const isOverflowY\n      = rootContext.viewport.value.offsetHeight\n      < rootContext.viewport.value.scrollHeight\n\n    visible.value = scrollbarContext.isHorizontal.value\n      ? isOverflowX\n      : isOverflowY\n  }\n}, 10)\n\nonMounted(() => handleResize())\n\nuseResizeObserver(rootContext.viewport, handleResize)\nuseResizeObserver(rootContext.content, handleResize)\n</script>\n\n<template>\n  <Presence :present=\"forceMount || visible\">\n    <ScrollAreaScrollbarVisible\n      v-bind=\"$attrs\"\n      :ref=\"forwardRef\"\n      :data-state=\"visible ? 'visible' : 'hidden'\"\n    >\n      <slot />\n    </ScrollAreaScrollbarVisible>\n  </Presence>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAiBA,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAChD,IAAA,MAAM,mBAAmB,gCAAiC,EAAA;AAE1D,IAAM,MAAA,EAAE,UAAW,EAAA,GAAI,gBAAiB,EAAA;AAExC,IAAM,MAAA,OAAA,GAAU,IAAI,KAAK,CAAA;AAEzB,IAAM,MAAA,YAAA,GAAe,cAAc,MAAM;AACvC,MAAI,IAAA,WAAA,CAAY,SAAS,KAAO,EAAA;AAC9B,QAAA,MAAM,cACF,WAAY,CAAA,QAAA,CAAS,MAAM,WAC3B,GAAA,WAAA,CAAY,SAAS,KAAM,CAAA,WAAA;AAC/B,QAAA,MAAM,cACF,WAAY,CAAA,QAAA,CAAS,MAAM,YAC3B,GAAA,WAAA,CAAY,SAAS,KAAM,CAAA,YAAA;AAE/B,QAAA,OAAA,CAAQ,KAAQ,GAAA,gBAAA,CAAiB,YAAa,CAAA,KAAA,GAC1C,WACA,GAAA,WAAA;AAAA;AACN,OACC,EAAE,CAAA;AAEL,IAAU,SAAA,CAAA,MAAM,cAAc,CAAA;AAE9B,IAAkB,iBAAA,CAAA,WAAA,CAAY,UAAU,YAAY,CAAA;AACpD,IAAkB,iBAAA,CAAA,WAAA,CAAY,SAAS,YAAY,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaScrollbarAuto.js","sources":["../../src/ScrollArea/ScrollAreaScrollbarAuto.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ScrollAreaScrollbarAutoProps {\n  forceMount?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Presence } from '@/Presence'\nimport { useForwardExpose } from '@/shared'\nimport { useDebounceFn, useResizeObserver } from '@vueuse/core'\nimport { onMounted, ref } from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport { injectScrollAreaScrollbarContext } from './ScrollAreaScrollbar.vue'\nimport ScrollAreaScrollbarVisible from './ScrollAreaScrollbarVisible.vue'\n\ndefineProps<ScrollAreaScrollbarAutoProps>()\n\nconst rootContext = injectScrollAreaRootContext()\nconst scrollbarContext = injectScrollAreaScrollbarContext()\n\nconst { forwardRef } = useForwardExpose()\n\nconst visible = ref(false)\n\nconst handleResize = useDebounceFn(() => {\n  if (rootContext.viewport.value) {\n    const isOverflowX\n      = rootContext.viewport.value.offsetWidth\n        < rootContext.viewport.value.scrollWidth\n    const isOverflowY\n      = rootContext.viewport.value.offsetHeight\n        < rootContext.viewport.value.scrollHeight\n\n    visible.value = scrollbarContext.isHorizontal.value\n      ? isOverflowX\n      : isOverflowY\n  }\n}, 10)\n\nonMounted(() => handleResize())\n\nuseResizeObserver(rootContext.viewport, handleResize)\nuseResizeObserver(rootContext.content, handleResize)\n</script>\n\n<template>\n  <Presence :present=\"forceMount || visible\">\n    <ScrollAreaScrollbarVisible\n      v-bind=\"$attrs\"\n      :ref=\"forwardRef\"\n      :data-state=\"visible ? 'visible' : 'hidden'\"\n    >\n      <slot />\n    </ScrollAreaScrollbarVisible>\n  </Presence>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAiBA,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAChD,IAAA,MAAM,mBAAmB,gCAAiC,EAAA;AAE1D,IAAM,MAAA,EAAE,UAAW,EAAA,GAAI,gBAAiB,EAAA;AAExC,IAAM,MAAA,OAAA,GAAU,IAAI,KAAK,CAAA;AAEzB,IAAM,MAAA,YAAA,GAAe,cAAc,MAAM;AACvC,MAAI,IAAA,WAAA,CAAY,SAAS,KAAO,EAAA;AAC9B,QAAA,MAAM,cACF,WAAY,CAAA,QAAA,CAAS,MAAM,WACzB,GAAA,WAAA,CAAY,SAAS,KAAM,CAAA,WAAA;AACjC,QAAA,MAAM,cACF,WAAY,CAAA,QAAA,CAAS,MAAM,YACzB,GAAA,WAAA,CAAY,SAAS,KAAM,CAAA,YAAA;AAEjC,QAAA,OAAA,CAAQ,KAAQ,GAAA,gBAAA,CAAiB,YAAa,CAAA,KAAA,GAC1C,WACA,GAAA,WAAA;AAAA;AACN,OACC,EAAE,CAAA;AAEL,IAAU,SAAA,CAAA,MAAM,cAAc,CAAA;AAE9B,IAAkB,iBAAA,CAAA,WAAA,CAAY,UAAU,YAAY,CAAA;AACpD,IAAkB,iBAAA,CAAA,WAAA,CAAY,SAAS,YAAY,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaScrollbarHover.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaScrollbarHover.cjs","sources":["../../src/ScrollArea/ScrollAreaScrollbarHover.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ScrollAreaScrollbarAutoProps } from './ScrollAreaScrollbarAuto.vue'\n\nexport interface ScrollAreaScrollbarHoverProps extends ScrollAreaScrollbarAutoProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, onUnmounted, ref } from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport ScrollAreaScrollbarAuto from './ScrollAreaScrollbarAuto.vue'\nimport { Presence } from '@/Presence'\nimport { useForwardExpose } from '@/shared'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\ndefineProps<ScrollAreaScrollbarHoverProps>()\n\nconst rootContext = injectScrollAreaRootContext()\n\nconst { forwardRef } = useForwardExpose()\n\nlet timeout: ReturnType<typeof setTimeout> | undefined | number\nconst visible = ref(false)\n\nfunction handlePointerEnter() {\n  window.clearTimeout(timeout)\n  visible.value = true\n}\nfunction handlePointerLeave() {\n  timeout = window.setTimeout(() => {\n    visible.value = false\n  }, rootContext.scrollHideDelay.value)\n}\n\nonMounted(() => {\n  const scrollArea = rootContext.scrollArea.value\n\n  if (scrollArea) {\n    scrollArea.addEventListener('pointerenter', handlePointerEnter)\n    scrollArea.addEventListener('pointerleave', handlePointerLeave)\n  }\n})\n\nonUnmounted(() => {\n  const scrollArea = rootContext.scrollArea.value\n  if (scrollArea) {\n    window.clearTimeout(timeout)\n    scrollArea.removeEventListener('pointerenter', handlePointerEnter)\n    scrollArea.removeEventListener('pointerleave', handlePointerLeave)\n  }\n})\n</script>\n\n<template>\n  <Presence :present=\"forceMount || visible\">\n    <ScrollAreaScrollbarAuto\n      v-bind=\"$attrs\"\n      :ref=\"forwardRef\"\n      :data-state=\"visible ? 'visible' : 'hidden'\"\n    >\n      <slot />\n    </ScrollAreaScrollbarAuto>\n  </Presence>\n</template>\n"],"names":["injectScrollAreaRootContext","useForwardExpose","ref","onMounted","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;AAmBA,IAAA,MAAM,cAAcA,qDAA4B,EAAA;AAEhD,IAAM,MAAA,EAAE,UAAW,EAAA,GAAIC,wCAAiB,EAAA;AAExC,IAAI,IAAA,OAAA;AACJ,IAAM,MAAA,OAAA,GAAUC,QAAI,KAAK,CAAA;AAEzB,IAAA,SAAS,kBAAqB,GAAA;AAC5B,MAAA,MAAA,CAAO,aAAa,OAAO,CAAA;AAC3B,MAAA,OAAA,CAAQ,KAAQ,GAAA,IAAA;AAAA;AAElB,IAAA,SAAS,kBAAqB,GAAA;AAC5B,MAAU,OAAA,GAAA,MAAA,CAAO,WAAW,MAAM;AAChC,QAAA,OAAA,CAAQ,KAAQ,GAAA,KAAA;AAAA,OAClB,EAAG,WAAY,CAAA,eAAA,CAAgB,KAAK,CAAA;AAAA;AAGtC,IAAAC,aAAA,CAAU,MAAM;AACd,MAAM,MAAA,UAAA,GAAa,YAAY,UAAW,CAAA,KAAA;AAE1C,MAAA,IAAI,UAAY,EAAA;AACd,QAAW,UAAA,CAAA,gBAAA,CAAiB,gBAAgB,kBAAkB,CAAA;AAC9D,QAAW,UAAA,CAAA,gBAAA,CAAiB,gBAAgB,kBAAkB,CAAA;AAAA;AAChE,KACD,CAAA;AAED,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAM,MAAA,UAAA,GAAa,YAAY,UAAW,CAAA,KAAA;AAC1C,MAAA,IAAI,UAAY,EAAA;AACd,QAAA,MAAA,CAAO,aAAa,OAAO,CAAA;AAC3B,QAAW,UAAA,CAAA,mBAAA,CAAoB,gBAAgB,kBAAkB,CAAA;AACjE,QAAW,UAAA,CAAA,mBAAA,CAAoB,gBAAgB,kBAAkB,CAAA;AAAA;AACnE,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaScrollbarHover.cjs","sources":["../../src/ScrollArea/ScrollAreaScrollbarHover.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ScrollAreaScrollbarAutoProps } from './ScrollAreaScrollbarAuto.vue'\n\nexport interface ScrollAreaScrollbarHoverProps extends ScrollAreaScrollbarAutoProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { Presence } from '@/Presence'\nimport { useForwardExpose } from '@/shared'\nimport { onMounted, onUnmounted, ref } from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport ScrollAreaScrollbarAuto from './ScrollAreaScrollbarAuto.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\ndefineProps<ScrollAreaScrollbarHoverProps>()\n\nconst rootContext = injectScrollAreaRootContext()\n\nconst { forwardRef } = useForwardExpose()\n\nlet timeout: ReturnType<typeof setTimeout> | undefined | number\nconst visible = ref(false)\n\nfunction handlePointerEnter() {\n  window.clearTimeout(timeout)\n  visible.value = true\n}\nfunction handlePointerLeave() {\n  timeout = window.setTimeout(() => {\n    visible.value = false\n  }, rootContext.scrollHideDelay.value)\n}\n\nonMounted(() => {\n  const scrollArea = rootContext.scrollArea.value\n\n  if (scrollArea) {\n    scrollArea.addEventListener('pointerenter', handlePointerEnter)\n    scrollArea.addEventListener('pointerleave', handlePointerLeave)\n  }\n})\n\nonUnmounted(() => {\n  const scrollArea = rootContext.scrollArea.value\n  if (scrollArea) {\n    window.clearTimeout(timeout)\n    scrollArea.removeEventListener('pointerenter', handlePointerEnter)\n    scrollArea.removeEventListener('pointerleave', handlePointerLeave)\n  }\n})\n</script>\n\n<template>\n  <Presence :present=\"forceMount || visible\">\n    <ScrollAreaScrollbarAuto\n      v-bind=\"$attrs\"\n      :ref=\"forwardRef\"\n      :data-state=\"visible ? 'visible' : 'hidden'\"\n    >\n      <slot />\n    </ScrollAreaScrollbarAuto>\n  </Presence>\n</template>\n"],"names":["injectScrollAreaRootContext","useForwardExpose","ref","onMounted","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;AAmBA,IAAA,MAAM,cAAcA,qDAA4B,EAAA;AAEhD,IAAM,MAAA,EAAE,UAAW,EAAA,GAAIC,wCAAiB,EAAA;AAExC,IAAI,IAAA,OAAA;AACJ,IAAM,MAAA,OAAA,GAAUC,QAAI,KAAK,CAAA;AAEzB,IAAA,SAAS,kBAAqB,GAAA;AAC5B,MAAA,MAAA,CAAO,aAAa,OAAO,CAAA;AAC3B,MAAA,OAAA,CAAQ,KAAQ,GAAA,IAAA;AAAA;AAElB,IAAA,SAAS,kBAAqB,GAAA;AAC5B,MAAU,OAAA,GAAA,MAAA,CAAO,WAAW,MAAM;AAChC,QAAA,OAAA,CAAQ,KAAQ,GAAA,KAAA;AAAA,OAClB,EAAG,WAAY,CAAA,eAAA,CAAgB,KAAK,CAAA;AAAA;AAGtC,IAAAC,aAAA,CAAU,MAAM;AACd,MAAM,MAAA,UAAA,GAAa,YAAY,UAAW,CAAA,KAAA;AAE1C,MAAA,IAAI,UAAY,EAAA;AACd,QAAW,UAAA,CAAA,gBAAA,CAAiB,gBAAgB,kBAAkB,CAAA;AAC9D,QAAW,UAAA,CAAA,gBAAA,CAAiB,gBAAgB,kBAAkB,CAAA;AAAA;AAChE,KACD,CAAA;AAED,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAM,MAAA,UAAA,GAAa,YAAY,UAAW,CAAA,KAAA;AAC1C,MAAA,IAAI,UAAY,EAAA;AACd,QAAA,MAAA,CAAO,aAAa,OAAO,CAAA;AAC3B,QAAW,UAAA,CAAA,mBAAA,CAAoB,gBAAgB,kBAAkB,CAAA;AACjE,QAAW,UAAA,CAAA,mBAAA,CAAoB,gBAAgB,kBAAkB,CAAA;AAAA;AACnE,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaScrollbarHover.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, onMounted, onUnmounted, openBlock, createBlock, unref, withCtx, createVNode, mergeProps, renderSlot } from 'vue';
+import { defineComponent, ref, onMounted, onUnmounted, createBlock, openBlock, unref, withCtx, createVNode, mergeProps, renderSlot } from 'vue';
 import { _ as _sfc_main$1 } from './ScrollAreaScrollbarAuto.js';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';
 import { P as Presence } from '../Presence/Presence.js';

package/dist/ScrollArea/ScrollAreaScrollbarHover.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaScrollbarHover.js","sources":["../../src/ScrollArea/ScrollAreaScrollbarHover.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ScrollAreaScrollbarAutoProps } from './ScrollAreaScrollbarAuto.vue'\n\nexport interface ScrollAreaScrollbarHoverProps extends ScrollAreaScrollbarAutoProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, onUnmounted, ref } from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport ScrollAreaScrollbarAuto from './ScrollAreaScrollbarAuto.vue'\nimport { Presence } from '@/Presence'\nimport { useForwardExpose } from '@/shared'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\ndefineProps<ScrollAreaScrollbarHoverProps>()\n\nconst rootContext = injectScrollAreaRootContext()\n\nconst { forwardRef } = useForwardExpose()\n\nlet timeout: ReturnType<typeof setTimeout> | undefined | number\nconst visible = ref(false)\n\nfunction handlePointerEnter() {\n  window.clearTimeout(timeout)\n  visible.value = true\n}\nfunction handlePointerLeave() {\n  timeout = window.setTimeout(() => {\n    visible.value = false\n  }, rootContext.scrollHideDelay.value)\n}\n\nonMounted(() => {\n  const scrollArea = rootContext.scrollArea.value\n\n  if (scrollArea) {\n    scrollArea.addEventListener('pointerenter', handlePointerEnter)\n    scrollArea.addEventListener('pointerleave', handlePointerLeave)\n  }\n})\n\nonUnmounted(() => {\n  const scrollArea = rootContext.scrollArea.value\n  if (scrollArea) {\n    window.clearTimeout(timeout)\n    scrollArea.removeEventListener('pointerenter', handlePointerEnter)\n    scrollArea.removeEventListener('pointerleave', handlePointerLeave)\n  }\n})\n</script>\n\n<template>\n  <Presence :present=\"forceMount || visible\">\n    <ScrollAreaScrollbarAuto\n      v-bind=\"$attrs\"\n      :ref=\"forwardRef\"\n      :data-state=\"visible ? 'visible' : 'hidden'\"\n    >\n      <slot />\n    </ScrollAreaScrollbarAuto>\n  </Presence>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAmBA,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAEhD,IAAM,MAAA,EAAE,UAAW,EAAA,GAAI,gBAAiB,EAAA;AAExC,IAAI,IAAA,OAAA;AACJ,IAAM,MAAA,OAAA,GAAU,IAAI,KAAK,CAAA;AAEzB,IAAA,SAAS,kBAAqB,GAAA;AAC5B,MAAA,MAAA,CAAO,aAAa,OAAO,CAAA;AAC3B,MAAA,OAAA,CAAQ,KAAQ,GAAA,IAAA;AAAA;AAElB,IAAA,SAAS,kBAAqB,GAAA;AAC5B,MAAU,OAAA,GAAA,MAAA,CAAO,WAAW,MAAM;AAChC,QAAA,OAAA,CAAQ,KAAQ,GAAA,KAAA;AAAA,OAClB,EAAG,WAAY,CAAA,eAAA,CAAgB,KAAK,CAAA;AAAA;AAGtC,IAAA,SAAA,CAAU,MAAM;AACd,MAAM,MAAA,UAAA,GAAa,YAAY,UAAW,CAAA,KAAA;AAE1C,MAAA,IAAI,UAAY,EAAA;AACd,QAAW,UAAA,CAAA,gBAAA,CAAiB,gBAAgB,kBAAkB,CAAA;AAC9D,QAAW,UAAA,CAAA,gBAAA,CAAiB,gBAAgB,kBAAkB,CAAA;AAAA;AAChE,KACD,CAAA;AAED,IAAA,WAAA,CAAY,MAAM;AAChB,MAAM,MAAA,UAAA,GAAa,YAAY,UAAW,CAAA,KAAA;AAC1C,MAAA,IAAI,UAAY,EAAA;AACd,QAAA,MAAA,CAAO,aAAa,OAAO,CAAA;AAC3B,QAAW,UAAA,CAAA,mBAAA,CAAoB,gBAAgB,kBAAkB,CAAA;AACjE,QAAW,UAAA,CAAA,mBAAA,CAAoB,gBAAgB,kBAAkB,CAAA;AAAA;AACnE,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaScrollbarHover.js","sources":["../../src/ScrollArea/ScrollAreaScrollbarHover.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ScrollAreaScrollbarAutoProps } from './ScrollAreaScrollbarAuto.vue'\n\nexport interface ScrollAreaScrollbarHoverProps extends ScrollAreaScrollbarAutoProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { Presence } from '@/Presence'\nimport { useForwardExpose } from '@/shared'\nimport { onMounted, onUnmounted, ref } from 'vue'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport ScrollAreaScrollbarAuto from './ScrollAreaScrollbarAuto.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\ndefineProps<ScrollAreaScrollbarHoverProps>()\n\nconst rootContext = injectScrollAreaRootContext()\n\nconst { forwardRef } = useForwardExpose()\n\nlet timeout: ReturnType<typeof setTimeout> | undefined | number\nconst visible = ref(false)\n\nfunction handlePointerEnter() {\n  window.clearTimeout(timeout)\n  visible.value = true\n}\nfunction handlePointerLeave() {\n  timeout = window.setTimeout(() => {\n    visible.value = false\n  }, rootContext.scrollHideDelay.value)\n}\n\nonMounted(() => {\n  const scrollArea = rootContext.scrollArea.value\n\n  if (scrollArea) {\n    scrollArea.addEventListener('pointerenter', handlePointerEnter)\n    scrollArea.addEventListener('pointerleave', handlePointerLeave)\n  }\n})\n\nonUnmounted(() => {\n  const scrollArea = rootContext.scrollArea.value\n  if (scrollArea) {\n    window.clearTimeout(timeout)\n    scrollArea.removeEventListener('pointerenter', handlePointerEnter)\n    scrollArea.removeEventListener('pointerleave', handlePointerLeave)\n  }\n})\n</script>\n\n<template>\n  <Presence :present=\"forceMount || visible\">\n    <ScrollAreaScrollbarAuto\n      v-bind=\"$attrs\"\n      :ref=\"forwardRef\"\n      :data-state=\"visible ? 'visible' : 'hidden'\"\n    >\n      <slot />\n    </ScrollAreaScrollbarAuto>\n  </Presence>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAmBA,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAEhD,IAAM,MAAA,EAAE,UAAW,EAAA,GAAI,gBAAiB,EAAA;AAExC,IAAI,IAAA,OAAA;AACJ,IAAM,MAAA,OAAA,GAAU,IAAI,KAAK,CAAA;AAEzB,IAAA,SAAS,kBAAqB,GAAA;AAC5B,MAAA,MAAA,CAAO,aAAa,OAAO,CAAA;AAC3B,MAAA,OAAA,CAAQ,KAAQ,GAAA,IAAA;AAAA;AAElB,IAAA,SAAS,kBAAqB,GAAA;AAC5B,MAAU,OAAA,GAAA,MAAA,CAAO,WAAW,MAAM;AAChC,QAAA,OAAA,CAAQ,KAAQ,GAAA,KAAA;AAAA,OAClB,EAAG,WAAY,CAAA,eAAA,CAAgB,KAAK,CAAA;AAAA;AAGtC,IAAA,SAAA,CAAU,MAAM;AACd,MAAM,MAAA,UAAA,GAAa,YAAY,UAAW,CAAA,KAAA;AAE1C,MAAA,IAAI,UAAY,EAAA;AACd,QAAW,UAAA,CAAA,gBAAA,CAAiB,gBAAgB,kBAAkB,CAAA;AAC9D,QAAW,UAAA,CAAA,gBAAA,CAAiB,gBAAgB,kBAAkB,CAAA;AAAA;AAChE,KACD,CAAA;AAED,IAAA,WAAA,CAAY,MAAM;AAChB,MAAM,MAAA,UAAA,GAAa,YAAY,UAAW,CAAA,KAAA;AAC1C,MAAA,IAAI,UAAY,EAAA;AACd,QAAA,MAAA,CAAO,aAAa,OAAO,CAAA;AAC3B,QAAW,UAAA,CAAA,mBAAA,CAAoB,gBAAgB,kBAAkB,CAAA;AACjE,QAAW,UAAA,CAAA,mBAAA,CAAoB,gBAAgB,kBAAkB,CAAA;AAAA;AACnE,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ScrollArea/ScrollAreaScrollbarImpl.cjs

@@ -54,7 +54,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       document.body.style.webkitUserSelect = prevWebkitUserSelectRef.value;
       if (rootContext.viewport)
         rootContext.viewport.value.style.scrollBehavior = "";
-      rectRef.value = undefined;
+      rectRef.value = void 0;
     }
     function handleWheel(event) {
       const element = event.target;