reka-ui 2.1.1 → 2.2.0

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.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/ScrollAreaCornerImpl.cjs

@@ -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.js

@@ -1,4 +1,4 @@
-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';
@@ -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/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 { 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,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 { 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,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

@@ -5,8 +5,8 @@ const ScrollArea_ScrollAreaScrollbarHover = require('./ScrollAreaScrollbarHover.
 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.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$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/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/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/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;

package/dist/ScrollArea/ScrollAreaScrollbarImpl.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaScrollbarImpl.cjs","sources":["../../src/ScrollArea/ScrollAreaScrollbarImpl.vue"],"sourcesContent":["<script lang=\"ts\">\ntype ScrollbarAreaScrollbarImplEmits = {\n  onDragScroll: [payload: { x: number, y: number }]\n  onWheelScroll: [payload: { x: number, y: number }]\n  onThumbPointerDown: [payload: { x: number, y: number }]\n}\n\nexport interface ScrollAreaScrollbarImplProps {\n  isHorizontal: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, onUnmounted, ref } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport { injectScrollAreaScrollbarVisibleContext } from './ScrollAreaScrollbarVisible.vue'\nimport { injectScrollAreaScrollbarContext } from './ScrollAreaScrollbar.vue'\nimport { toInt } from './utils'\nimport { Primitive } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nconst props = defineProps<ScrollAreaScrollbarImplProps>()\nconst emit = defineEmits<ScrollbarAreaScrollbarImplEmits>()\nconst rootContext = injectScrollAreaRootContext()\nconst scrollbarVisibleContext = injectScrollAreaScrollbarVisibleContext()\nconst scrollbarContext = injectScrollAreaScrollbarContext()\n\nconst { forwardRef, currentElement: scrollbar } = useForwardExpose()\nconst prevWebkitUserSelectRef = ref('')\nconst rectRef = ref<DOMRect>()\n\nfunction handleDragScroll(event: MouseEvent) {\n  if (rectRef.value) {\n    const x = event.clientX - rectRef.value?.left\n    const y = event.clientY - rectRef.value?.top\n    emit('onDragScroll', { x, y })\n  }\n}\n\nfunction handlePointerDown(event: PointerEvent) {\n  const mainPointer = 0\n  if (event.button === mainPointer) {\n    const element = event.target as HTMLElement\n    element.setPointerCapture(event.pointerId)\n    rectRef.value = scrollbar.value!.getBoundingClientRect()\n\n    // pointer capture doesn't prevent text selection in Safari\n    // so we remove text selection manually when scrolling\n    prevWebkitUserSelectRef.value = document.body.style.webkitUserSelect\n    document.body.style.webkitUserSelect = 'none'\n    if (rootContext.viewport)\n      rootContext.viewport.value!.style.scrollBehavior = 'auto'\n\n    handleDragScroll(event)\n  }\n}\n\nfunction handlePointerMove(event: PointerEvent) {\n  handleDragScroll(event)\n}\n\nfunction handlePointerUp(event: PointerEvent) {\n  const element = event.target as HTMLElement\n  if (element.hasPointerCapture(event.pointerId))\n    element.releasePointerCapture(event.pointerId)\n\n  document.body.style.webkitUserSelect = prevWebkitUserSelectRef.value\n  if (rootContext.viewport)\n    rootContext.viewport.value!.style.scrollBehavior = ''\n\n  rectRef.value = undefined\n}\n\nfunction handleWheel(event: WheelEvent) {\n  const element = event.target as HTMLElement\n  const isScrollbarWheel = scrollbar.value?.contains(element)\n  const maxScrollPos\n    = scrollbarVisibleContext.sizes.value.content\n    - scrollbarVisibleContext.sizes.value.viewport\n  if (isScrollbarWheel)\n    scrollbarVisibleContext.handleWheelScroll(event, maxScrollPos)\n}\n\nonMounted(() => {\n  document.addEventListener('wheel', handleWheel, { passive: false })\n})\nonUnmounted(() => {\n  document.removeEventListener('wheel', handleWheel)\n})\n\nfunction handleSizeChange() {\n  if (!scrollbar.value)\n    return\n  if (props.isHorizontal) {\n    scrollbarVisibleContext.handleSizeChange({\n      content: rootContext.viewport.value?.scrollWidth ?? 0,\n      viewport: rootContext.viewport.value?.offsetWidth ?? 0,\n      scrollbar: {\n        size: scrollbar.value.clientWidth ?? 0,\n        paddingStart: toInt(getComputedStyle(scrollbar.value).paddingLeft),\n        paddingEnd: toInt(getComputedStyle(scrollbar.value).paddingRight),\n      },\n    })\n  }\n  else {\n    scrollbarVisibleContext.handleSizeChange({\n      content: rootContext.viewport.value?.scrollHeight ?? 0,\n      viewport: rootContext.viewport.value?.offsetHeight ?? 0,\n      scrollbar: {\n        size: scrollbar.value?.clientHeight ?? 0,\n        paddingStart: toInt(getComputedStyle(scrollbar.value!).paddingLeft),\n        paddingEnd: toInt(getComputedStyle(scrollbar.value!).paddingRight),\n      },\n    })\n  }\n}\n\nuseResizeObserver(scrollbar, handleSizeChange)\nuseResizeObserver(rootContext.content, handleSizeChange)\n</script>\n\n<template>\n  <Primitive\n    :ref=\"forwardRef\"\n    style=\"position: absolute\"\n    data-scrollbarimpl\n    :as=\"scrollbarContext.as.value\"\n    :as-child=\"scrollbarContext.asChild.value\"\n    @pointerdown=\"handlePointerDown\"\n    @pointermove=\"handlePointerMove\"\n    @pointerup=\"handlePointerUp\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["injectScrollAreaRootContext","injectScrollAreaScrollbarVisibleContext","injectScrollAreaScrollbarContext","useForwardExpose","ref","onMounted","onUnmounted","toInt","useResizeObserver"],"mappings":";;;;;;;;;;;;;;;;;;AAsBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,IAAO,GAAA,MAAA;AACb,IAAA,MAAM,cAAcA,qDAA4B,EAAA;AAChD,IAAA,MAAM,0BAA0BC,6EAAwC,EAAA;AACxE,IAAA,MAAM,mBAAmBC,+DAAiC,EAAA;AAE1D,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,SAAA,KAAcC,wCAAiB,EAAA;AACnE,IAAM,MAAA,uBAAA,GAA0BC,QAAI,EAAE,CAAA;AACtC,IAAA,MAAM,UAAUA,OAAa,EAAA;AAE7B,IAAA,SAAS,iBAAiB,KAAmB,EAAA;AAC3C,MAAA,IAAI,QAAQ,KAAO,EAAA;AACjB,QAAA,MAAM,CAAI,GAAA,KAAA,CAAM,OAAU,GAAA,OAAA,CAAQ,KAAO,EAAA,IAAA;AACzC,QAAA,MAAM,CAAI,GAAA,KAAA,CAAM,OAAU,GAAA,OAAA,CAAQ,KAAO,EAAA,GAAA;AACzC,QAAA,IAAA,CAAK,cAAgB,EAAA,EAAE,CAAG,EAAA,CAAA,EAAG,CAAA;AAAA;AAC/B;AAGF,IAAA,SAAS,kBAAkB,KAAqB,EAAA;AAC9C,MAAA,MAAM,WAAc,GAAA,CAAA;AACpB,MAAI,IAAA,KAAA,CAAM,WAAW,WAAa,EAAA;AAChC,QAAA,MAAM,UAAU,KAAM,CAAA,MAAA;AACtB,QAAQ,OAAA,CAAA,iBAAA,CAAkB,MAAM,SAAS,CAAA;AACzC,QAAQ,OAAA,CAAA,KAAA,GAAQ,SAAU,CAAA,KAAA,CAAO,qBAAsB,EAAA;AAIvD,QAAwB,uBAAA,CAAA,KAAA,GAAQ,QAAS,CAAA,IAAA,CAAK,KAAM,CAAA,gBAAA;AACpD,QAAS,QAAA,CAAA,IAAA,CAAK,MAAM,gBAAmB,GAAA,MAAA;AACvC,QAAA,IAAI,WAAY,CAAA,QAAA;AACd,UAAY,WAAA,CAAA,QAAA,CAAS,KAAO,CAAA,KAAA,CAAM,cAAiB,GAAA,MAAA;AAErD,QAAA,gBAAA,CAAiB,KAAK,CAAA;AAAA;AACxB;AAGF,IAAA,SAAS,kBAAkB,KAAqB,EAAA;AAC9C,MAAA,gBAAA,CAAiB,KAAK,CAAA;AAAA;AAGxB,IAAA,SAAS,gBAAgB,KAAqB,EAAA;AAC5C,MAAA,MAAM,UAAU,KAAM,CAAA,MAAA;AACtB,MAAI,IAAA,OAAA,CAAQ,iBAAkB,CAAA,KAAA,CAAM,SAAS,CAAA;AAC3C,QAAQ,OAAA,CAAA,qBAAA,CAAsB,MAAM,SAAS,CAAA;AAE/C,MAAS,QAAA,CAAA,IAAA,CAAK,KAAM,CAAA,gBAAA,GAAmB,uBAAwB,CAAA,KAAA;AAC/D,MAAA,IAAI,WAAY,CAAA,QAAA;AACd,QAAY,WAAA,CAAA,QAAA,CAAS,KAAO,CAAA,KAAA,CAAM,cAAiB,GAAA,EAAA;AAErD,MAAA,OAAA,CAAQ,KAAQ,GAAA,SAAA;AAAA;AAGlB,IAAA,SAAS,YAAY,KAAmB,EAAA;AACtC,MAAA,MAAM,UAAU,KAAM,CAAA,MAAA;AACtB,MAAA,MAAM,gBAAmB,GAAA,SAAA,CAAU,KAAO,EAAA,QAAA,CAAS,OAAO,CAAA;AAC1D,MAAA,MAAM,eACF,uBAAwB,CAAA,KAAA,CAAM,MAAM,OACpC,GAAA,uBAAA,CAAwB,MAAM,KAAM,CAAA,QAAA;AACxC,MAAI,IAAA,gBAAA;AACF,QAAwB,uBAAA,CAAA,iBAAA,CAAkB,OAAO,YAAY,CAAA;AAAA;AAGjE,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,QAAA,CAAS,iBAAiB,OAAS,EAAA,WAAA,EAAa,EAAE,OAAA,EAAS,OAAO,CAAA;AAAA,KACnE,CAAA;AACD,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAS,QAAA,CAAA,mBAAA,CAAoB,SAAS,WAAW,CAAA;AAAA,KAClD,CAAA;AAED,IAAA,SAAS,gBAAmB,GAAA;AAC1B,MAAA,IAAI,CAAC,SAAU,CAAA,KAAA;AACb,QAAA;AACF,MAAA,IAAI,MAAM,YAAc,EAAA;AACtB,QAAA,uBAAA,CAAwB,gBAAiB,CAAA;AAAA,UACvC,OAAS,EAAA,WAAA,CAAY,QAAS,CAAA,KAAA,EAAO,WAAe,IAAA,CAAA;AAAA,UACpD,QAAU,EAAA,WAAA,CAAY,QAAS,CAAA,KAAA,EAAO,WAAe,IAAA,CAAA;AAAA,UACrD,SAAW,EAAA;AAAA,YACT,IAAA,EAAM,SAAU,CAAA,KAAA,CAAM,WAAe,IAAA,CAAA;AAAA,YACrC,cAAcC,sBAAM,CAAA,gBAAA,CAAiB,SAAU,CAAA,KAAK,EAAE,WAAW,CAAA;AAAA,YACjE,YAAYA,sBAAM,CAAA,gBAAA,CAAiB,SAAU,CAAA,KAAK,EAAE,YAAY;AAAA;AAClE,SACD,CAAA;AAAA,OAEE,MAAA;AACH,QAAA,uBAAA,CAAwB,gBAAiB,CAAA;AAAA,UACvC,OAAS,EAAA,WAAA,CAAY,QAAS,CAAA,KAAA,EAAO,YAAgB,IAAA,CAAA;AAAA,UACrD,QAAU,EAAA,WAAA,CAAY,QAAS,CAAA,KAAA,EAAO,YAAgB,IAAA,CAAA;AAAA,UACtD,SAAW,EAAA;AAAA,YACT,IAAA,EAAM,SAAU,CAAA,KAAA,EAAO,YAAgB,IAAA,CAAA;AAAA,YACvC,cAAcA,sBAAM,CAAA,gBAAA,CAAiB,SAAU,CAAA,KAAM,EAAE,WAAW,CAAA;AAAA,YAClE,YAAYA,sBAAM,CAAA,gBAAA,CAAiB,SAAU,CAAA,KAAM,EAAE,YAAY;AAAA;AACnE,SACD,CAAA;AAAA;AACH;AAGF,IAAAC,sBAAA,CAAkB,WAAW,gBAAgB,CAAA;AAC7C,IAAkBA,sBAAA,CAAA,WAAA,CAAY,SAAS,gBAAgB,CAAA;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaScrollbarImpl.cjs","sources":["../../src/ScrollArea/ScrollAreaScrollbarImpl.vue"],"sourcesContent":["<script lang=\"ts\">\ntype ScrollbarAreaScrollbarImplEmits = {\n  onDragScroll: [payload: { x: number, y: number }]\n  onWheelScroll: [payload: { x: number, y: number }]\n  onThumbPointerDown: [payload: { x: number, y: number }]\n}\n\nexport interface ScrollAreaScrollbarImplProps {\n  isHorizontal: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, onUnmounted, ref } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport { injectScrollAreaScrollbarVisibleContext } from './ScrollAreaScrollbarVisible.vue'\nimport { injectScrollAreaScrollbarContext } from './ScrollAreaScrollbar.vue'\nimport { toInt } from './utils'\nimport { Primitive } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nconst props = defineProps<ScrollAreaScrollbarImplProps>()\nconst emit = defineEmits<ScrollbarAreaScrollbarImplEmits>()\nconst rootContext = injectScrollAreaRootContext()\nconst scrollbarVisibleContext = injectScrollAreaScrollbarVisibleContext()\nconst scrollbarContext = injectScrollAreaScrollbarContext()\n\nconst { forwardRef, currentElement: scrollbar } = useForwardExpose()\nconst prevWebkitUserSelectRef = ref('')\nconst rectRef = ref<DOMRect>()\n\nfunction handleDragScroll(event: MouseEvent) {\n  if (rectRef.value) {\n    const x = event.clientX - rectRef.value?.left\n    const y = event.clientY - rectRef.value?.top\n    emit('onDragScroll', { x, y })\n  }\n}\n\nfunction handlePointerDown(event: PointerEvent) {\n  const mainPointer = 0\n  if (event.button === mainPointer) {\n    const element = event.target as HTMLElement\n    element.setPointerCapture(event.pointerId)\n    rectRef.value = scrollbar.value!.getBoundingClientRect()\n\n    // pointer capture doesn't prevent text selection in Safari\n    // so we remove text selection manually when scrolling\n    prevWebkitUserSelectRef.value = document.body.style.webkitUserSelect\n    document.body.style.webkitUserSelect = 'none'\n    if (rootContext.viewport)\n      rootContext.viewport.value!.style.scrollBehavior = 'auto'\n\n    handleDragScroll(event)\n  }\n}\n\nfunction handlePointerMove(event: PointerEvent) {\n  handleDragScroll(event)\n}\n\nfunction handlePointerUp(event: PointerEvent) {\n  const element = event.target as HTMLElement\n  if (element.hasPointerCapture(event.pointerId))\n    element.releasePointerCapture(event.pointerId)\n\n  document.body.style.webkitUserSelect = prevWebkitUserSelectRef.value\n  if (rootContext.viewport)\n    rootContext.viewport.value!.style.scrollBehavior = ''\n\n  rectRef.value = undefined\n}\n\nfunction handleWheel(event: WheelEvent) {\n  const element = event.target as HTMLElement\n  const isScrollbarWheel = scrollbar.value?.contains(element)\n  const maxScrollPos\n    = scrollbarVisibleContext.sizes.value.content\n    - scrollbarVisibleContext.sizes.value.viewport\n  if (isScrollbarWheel)\n    scrollbarVisibleContext.handleWheelScroll(event, maxScrollPos)\n}\n\nonMounted(() => {\n  document.addEventListener('wheel', handleWheel, { passive: false })\n})\nonUnmounted(() => {\n  document.removeEventListener('wheel', handleWheel)\n})\n\nfunction handleSizeChange() {\n  if (!scrollbar.value)\n    return\n  if (props.isHorizontal) {\n    scrollbarVisibleContext.handleSizeChange({\n      content: rootContext.viewport.value?.scrollWidth ?? 0,\n      viewport: rootContext.viewport.value?.offsetWidth ?? 0,\n      scrollbar: {\n        size: scrollbar.value.clientWidth ?? 0,\n        paddingStart: toInt(getComputedStyle(scrollbar.value).paddingLeft),\n        paddingEnd: toInt(getComputedStyle(scrollbar.value).paddingRight),\n      },\n    })\n  }\n  else {\n    scrollbarVisibleContext.handleSizeChange({\n      content: rootContext.viewport.value?.scrollHeight ?? 0,\n      viewport: rootContext.viewport.value?.offsetHeight ?? 0,\n      scrollbar: {\n        size: scrollbar.value?.clientHeight ?? 0,\n        paddingStart: toInt(getComputedStyle(scrollbar.value!).paddingLeft),\n        paddingEnd: toInt(getComputedStyle(scrollbar.value!).paddingRight),\n      },\n    })\n  }\n}\n\nuseResizeObserver(scrollbar, handleSizeChange)\nuseResizeObserver(rootContext.content, handleSizeChange)\n</script>\n\n<template>\n  <Primitive\n    :ref=\"forwardRef\"\n    style=\"position: absolute\"\n    data-scrollbarimpl\n    :as=\"scrollbarContext.as.value\"\n    :as-child=\"scrollbarContext.asChild.value\"\n    @pointerdown=\"handlePointerDown\"\n    @pointermove=\"handlePointerMove\"\n    @pointerup=\"handlePointerUp\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["injectScrollAreaRootContext","injectScrollAreaScrollbarVisibleContext","injectScrollAreaScrollbarContext","useForwardExpose","ref","onMounted","onUnmounted","toInt","useResizeObserver"],"mappings":"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"}

package/dist/ScrollArea/ScrollAreaScrollbarImpl.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, onMounted, onUnmounted, openBlock, createBlock, unref, withCtx, renderSlot } from 'vue';
+import { defineComponent, ref, onMounted, onUnmounted, createBlock, openBlock, unref, withCtx, renderSlot } from 'vue';
 import { useResizeObserver } from '@vueuse/core';
 import { t as toInt } from './utils.js';
 import { i as injectScrollAreaScrollbarVisibleContext } from './ScrollAreaScrollbarVisible.js';
@@ -52,7 +52,7 @@ const _sfc_main = /* @__PURE__ */ 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;

package/dist/ScrollArea/ScrollAreaScrollbarImpl.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollAreaScrollbarImpl.js","sources":["../../src/ScrollArea/ScrollAreaScrollbarImpl.vue"],"sourcesContent":["<script lang=\"ts\">\ntype ScrollbarAreaScrollbarImplEmits = {\n  onDragScroll: [payload: { x: number, y: number }]\n  onWheelScroll: [payload: { x: number, y: number }]\n  onThumbPointerDown: [payload: { x: number, y: number }]\n}\n\nexport interface ScrollAreaScrollbarImplProps {\n  isHorizontal: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, onUnmounted, ref } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport { injectScrollAreaScrollbarVisibleContext } from './ScrollAreaScrollbarVisible.vue'\nimport { injectScrollAreaScrollbarContext } from './ScrollAreaScrollbar.vue'\nimport { toInt } from './utils'\nimport { Primitive } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nconst props = defineProps<ScrollAreaScrollbarImplProps>()\nconst emit = defineEmits<ScrollbarAreaScrollbarImplEmits>()\nconst rootContext = injectScrollAreaRootContext()\nconst scrollbarVisibleContext = injectScrollAreaScrollbarVisibleContext()\nconst scrollbarContext = injectScrollAreaScrollbarContext()\n\nconst { forwardRef, currentElement: scrollbar } = useForwardExpose()\nconst prevWebkitUserSelectRef = ref('')\nconst rectRef = ref<DOMRect>()\n\nfunction handleDragScroll(event: MouseEvent) {\n  if (rectRef.value) {\n    const x = event.clientX - rectRef.value?.left\n    const y = event.clientY - rectRef.value?.top\n    emit('onDragScroll', { x, y })\n  }\n}\n\nfunction handlePointerDown(event: PointerEvent) {\n  const mainPointer = 0\n  if (event.button === mainPointer) {\n    const element = event.target as HTMLElement\n    element.setPointerCapture(event.pointerId)\n    rectRef.value = scrollbar.value!.getBoundingClientRect()\n\n    // pointer capture doesn't prevent text selection in Safari\n    // so we remove text selection manually when scrolling\n    prevWebkitUserSelectRef.value = document.body.style.webkitUserSelect\n    document.body.style.webkitUserSelect = 'none'\n    if (rootContext.viewport)\n      rootContext.viewport.value!.style.scrollBehavior = 'auto'\n\n    handleDragScroll(event)\n  }\n}\n\nfunction handlePointerMove(event: PointerEvent) {\n  handleDragScroll(event)\n}\n\nfunction handlePointerUp(event: PointerEvent) {\n  const element = event.target as HTMLElement\n  if (element.hasPointerCapture(event.pointerId))\n    element.releasePointerCapture(event.pointerId)\n\n  document.body.style.webkitUserSelect = prevWebkitUserSelectRef.value\n  if (rootContext.viewport)\n    rootContext.viewport.value!.style.scrollBehavior = ''\n\n  rectRef.value = undefined\n}\n\nfunction handleWheel(event: WheelEvent) {\n  const element = event.target as HTMLElement\n  const isScrollbarWheel = scrollbar.value?.contains(element)\n  const maxScrollPos\n    = scrollbarVisibleContext.sizes.value.content\n    - scrollbarVisibleContext.sizes.value.viewport\n  if (isScrollbarWheel)\n    scrollbarVisibleContext.handleWheelScroll(event, maxScrollPos)\n}\n\nonMounted(() => {\n  document.addEventListener('wheel', handleWheel, { passive: false })\n})\nonUnmounted(() => {\n  document.removeEventListener('wheel', handleWheel)\n})\n\nfunction handleSizeChange() {\n  if (!scrollbar.value)\n    return\n  if (props.isHorizontal) {\n    scrollbarVisibleContext.handleSizeChange({\n      content: rootContext.viewport.value?.scrollWidth ?? 0,\n      viewport: rootContext.viewport.value?.offsetWidth ?? 0,\n      scrollbar: {\n        size: scrollbar.value.clientWidth ?? 0,\n        paddingStart: toInt(getComputedStyle(scrollbar.value).paddingLeft),\n        paddingEnd: toInt(getComputedStyle(scrollbar.value).paddingRight),\n      },\n    })\n  }\n  else {\n    scrollbarVisibleContext.handleSizeChange({\n      content: rootContext.viewport.value?.scrollHeight ?? 0,\n      viewport: rootContext.viewport.value?.offsetHeight ?? 0,\n      scrollbar: {\n        size: scrollbar.value?.clientHeight ?? 0,\n        paddingStart: toInt(getComputedStyle(scrollbar.value!).paddingLeft),\n        paddingEnd: toInt(getComputedStyle(scrollbar.value!).paddingRight),\n      },\n    })\n  }\n}\n\nuseResizeObserver(scrollbar, handleSizeChange)\nuseResizeObserver(rootContext.content, handleSizeChange)\n</script>\n\n<template>\n  <Primitive\n    :ref=\"forwardRef\"\n    style=\"position: absolute\"\n    data-scrollbarimpl\n    :as=\"scrollbarContext.as.value\"\n    :as-child=\"scrollbarContext.asChild.value\"\n    @pointerdown=\"handlePointerDown\"\n    @pointermove=\"handlePointerMove\"\n    @pointerup=\"handlePointerUp\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAsBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,IAAO,GAAA,MAAA;AACb,IAAA,MAAM,cAAc,2BAA4B,EAAA;AAChD,IAAA,MAAM,0BAA0B,uCAAwC,EAAA;AACxE,IAAA,MAAM,mBAAmB,gCAAiC,EAAA;AAE1D,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,SAAA,KAAc,gBAAiB,EAAA;AACnE,IAAM,MAAA,uBAAA,GAA0B,IAAI,EAAE,CAAA;AACtC,IAAA,MAAM,UAAU,GAAa,EAAA;AAE7B,IAAA,SAAS,iBAAiB,KAAmB,EAAA;AAC3C,MAAA,IAAI,QAAQ,KAAO,EAAA;AACjB,QAAA,MAAM,CAAI,GAAA,KAAA,CAAM,OAAU,GAAA,OAAA,CAAQ,KAAO,EAAA,IAAA;AACzC,QAAA,MAAM,CAAI,GAAA,KAAA,CAAM,OAAU,GAAA,OAAA,CAAQ,KAAO,EAAA,GAAA;AACzC,QAAA,IAAA,CAAK,cAAgB,EAAA,EAAE,CAAG,EAAA,CAAA,EAAG,CAAA;AAAA;AAC/B;AAGF,IAAA,SAAS,kBAAkB,KAAqB,EAAA;AAC9C,MAAA,MAAM,WAAc,GAAA,CAAA;AACpB,MAAI,IAAA,KAAA,CAAM,WAAW,WAAa,EAAA;AAChC,QAAA,MAAM,UAAU,KAAM,CAAA,MAAA;AACtB,QAAQ,OAAA,CAAA,iBAAA,CAAkB,MAAM,SAAS,CAAA;AACzC,QAAQ,OAAA,CAAA,KAAA,GAAQ,SAAU,CAAA,KAAA,CAAO,qBAAsB,EAAA;AAIvD,QAAwB,uBAAA,CAAA,KAAA,GAAQ,QAAS,CAAA,IAAA,CAAK,KAAM,CAAA,gBAAA;AACpD,QAAS,QAAA,CAAA,IAAA,CAAK,MAAM,gBAAmB,GAAA,MAAA;AACvC,QAAA,IAAI,WAAY,CAAA,QAAA;AACd,UAAY,WAAA,CAAA,QAAA,CAAS,KAAO,CAAA,KAAA,CAAM,cAAiB,GAAA,MAAA;AAErD,QAAA,gBAAA,CAAiB,KAAK,CAAA;AAAA;AACxB;AAGF,IAAA,SAAS,kBAAkB,KAAqB,EAAA;AAC9C,MAAA,gBAAA,CAAiB,KAAK,CAAA;AAAA;AAGxB,IAAA,SAAS,gBAAgB,KAAqB,EAAA;AAC5C,MAAA,MAAM,UAAU,KAAM,CAAA,MAAA;AACtB,MAAI,IAAA,OAAA,CAAQ,iBAAkB,CAAA,KAAA,CAAM,SAAS,CAAA;AAC3C,QAAQ,OAAA,CAAA,qBAAA,CAAsB,MAAM,SAAS,CAAA;AAE/C,MAAS,QAAA,CAAA,IAAA,CAAK,KAAM,CAAA,gBAAA,GAAmB,uBAAwB,CAAA,KAAA;AAC/D,MAAA,IAAI,WAAY,CAAA,QAAA;AACd,QAAY,WAAA,CAAA,QAAA,CAAS,KAAO,CAAA,KAAA,CAAM,cAAiB,GAAA,EAAA;AAErD,MAAA,OAAA,CAAQ,KAAQ,GAAA,SAAA;AAAA;AAGlB,IAAA,SAAS,YAAY,KAAmB,EAAA;AACtC,MAAA,MAAM,UAAU,KAAM,CAAA,MAAA;AACtB,MAAA,MAAM,gBAAmB,GAAA,SAAA,CAAU,KAAO,EAAA,QAAA,CAAS,OAAO,CAAA;AAC1D,MAAA,MAAM,eACF,uBAAwB,CAAA,KAAA,CAAM,MAAM,OACpC,GAAA,uBAAA,CAAwB,MAAM,KAAM,CAAA,QAAA;AACxC,MAAI,IAAA,gBAAA;AACF,QAAwB,uBAAA,CAAA,iBAAA,CAAkB,OAAO,YAAY,CAAA;AAAA;AAGjE,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,QAAA,CAAS,iBAAiB,OAAS,EAAA,WAAA,EAAa,EAAE,OAAA,EAAS,OAAO,CAAA;AAAA,KACnE,CAAA;AACD,IAAA,WAAA,CAAY,MAAM;AAChB,MAAS,QAAA,CAAA,mBAAA,CAAoB,SAAS,WAAW,CAAA;AAAA,KAClD,CAAA;AAED,IAAA,SAAS,gBAAmB,GAAA;AAC1B,MAAA,IAAI,CAAC,SAAU,CAAA,KAAA;AACb,QAAA;AACF,MAAA,IAAI,MAAM,YAAc,EAAA;AACtB,QAAA,uBAAA,CAAwB,gBAAiB,CAAA;AAAA,UACvC,OAAS,EAAA,WAAA,CAAY,QAAS,CAAA,KAAA,EAAO,WAAe,IAAA,CAAA;AAAA,UACpD,QAAU,EAAA,WAAA,CAAY,QAAS,CAAA,KAAA,EAAO,WAAe,IAAA,CAAA;AAAA,UACrD,SAAW,EAAA;AAAA,YACT,IAAA,EAAM,SAAU,CAAA,KAAA,CAAM,WAAe,IAAA,CAAA;AAAA,YACrC,cAAc,KAAM,CAAA,gBAAA,CAAiB,SAAU,CAAA,KAAK,EAAE,WAAW,CAAA;AAAA,YACjE,YAAY,KAAM,CAAA,gBAAA,CAAiB,SAAU,CAAA,KAAK,EAAE,YAAY;AAAA;AAClE,SACD,CAAA;AAAA,OAEE,MAAA;AACH,QAAA,uBAAA,CAAwB,gBAAiB,CAAA;AAAA,UACvC,OAAS,EAAA,WAAA,CAAY,QAAS,CAAA,KAAA,EAAO,YAAgB,IAAA,CAAA;AAAA,UACrD,QAAU,EAAA,WAAA,CAAY,QAAS,CAAA,KAAA,EAAO,YAAgB,IAAA,CAAA;AAAA,UACtD,SAAW,EAAA;AAAA,YACT,IAAA,EAAM,SAAU,CAAA,KAAA,EAAO,YAAgB,IAAA,CAAA;AAAA,YACvC,cAAc,KAAM,CAAA,gBAAA,CAAiB,SAAU,CAAA,KAAM,EAAE,WAAW,CAAA;AAAA,YAClE,YAAY,KAAM,CAAA,gBAAA,CAAiB,SAAU,CAAA,KAAM,EAAE,YAAY;AAAA;AACnE,SACD,CAAA;AAAA;AACH;AAGF,IAAA,iBAAA,CAAkB,WAAW,gBAAgB,CAAA;AAC7C,IAAkB,iBAAA,CAAA,WAAA,CAAY,SAAS,gBAAgB,CAAA;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ScrollAreaScrollbarImpl.js","sources":["../../src/ScrollArea/ScrollAreaScrollbarImpl.vue"],"sourcesContent":["<script lang=\"ts\">\ntype ScrollbarAreaScrollbarImplEmits = {\n  onDragScroll: [payload: { x: number, y: number }]\n  onWheelScroll: [payload: { x: number, y: number }]\n  onThumbPointerDown: [payload: { x: number, y: number }]\n}\n\nexport interface ScrollAreaScrollbarImplProps {\n  isHorizontal: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, onUnmounted, ref } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { injectScrollAreaRootContext } from './ScrollAreaRoot.vue'\nimport { injectScrollAreaScrollbarVisibleContext } from './ScrollAreaScrollbarVisible.vue'\nimport { injectScrollAreaScrollbarContext } from './ScrollAreaScrollbar.vue'\nimport { toInt } from './utils'\nimport { Primitive } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nconst props = defineProps<ScrollAreaScrollbarImplProps>()\nconst emit = defineEmits<ScrollbarAreaScrollbarImplEmits>()\nconst rootContext = injectScrollAreaRootContext()\nconst scrollbarVisibleContext = injectScrollAreaScrollbarVisibleContext()\nconst scrollbarContext = injectScrollAreaScrollbarContext()\n\nconst { forwardRef, currentElement: scrollbar } = useForwardExpose()\nconst prevWebkitUserSelectRef = ref('')\nconst rectRef = ref<DOMRect>()\n\nfunction handleDragScroll(event: MouseEvent) {\n  if (rectRef.value) {\n    const x = event.clientX - rectRef.value?.left\n    const y = event.clientY - rectRef.value?.top\n    emit('onDragScroll', { x, y })\n  }\n}\n\nfunction handlePointerDown(event: PointerEvent) {\n  const mainPointer = 0\n  if (event.button === mainPointer) {\n    const element = event.target as HTMLElement\n    element.setPointerCapture(event.pointerId)\n    rectRef.value = scrollbar.value!.getBoundingClientRect()\n\n    // pointer capture doesn't prevent text selection in Safari\n    // so we remove text selection manually when scrolling\n    prevWebkitUserSelectRef.value = document.body.style.webkitUserSelect\n    document.body.style.webkitUserSelect = 'none'\n    if (rootContext.viewport)\n      rootContext.viewport.value!.style.scrollBehavior = 'auto'\n\n    handleDragScroll(event)\n  }\n}\n\nfunction handlePointerMove(event: PointerEvent) {\n  handleDragScroll(event)\n}\n\nfunction handlePointerUp(event: PointerEvent) {\n  const element = event.target as HTMLElement\n  if (element.hasPointerCapture(event.pointerId))\n    element.releasePointerCapture(event.pointerId)\n\n  document.body.style.webkitUserSelect = prevWebkitUserSelectRef.value\n  if (rootContext.viewport)\n    rootContext.viewport.value!.style.scrollBehavior = ''\n\n  rectRef.value = undefined\n}\n\nfunction handleWheel(event: WheelEvent) {\n  const element = event.target as HTMLElement\n  const isScrollbarWheel = scrollbar.value?.contains(element)\n  const maxScrollPos\n    = scrollbarVisibleContext.sizes.value.content\n    - scrollbarVisibleContext.sizes.value.viewport\n  if (isScrollbarWheel)\n    scrollbarVisibleContext.handleWheelScroll(event, maxScrollPos)\n}\n\nonMounted(() => {\n  document.addEventListener('wheel', handleWheel, { passive: false })\n})\nonUnmounted(() => {\n  document.removeEventListener('wheel', handleWheel)\n})\n\nfunction handleSizeChange() {\n  if (!scrollbar.value)\n    return\n  if (props.isHorizontal) {\n    scrollbarVisibleContext.handleSizeChange({\n      content: rootContext.viewport.value?.scrollWidth ?? 0,\n      viewport: rootContext.viewport.value?.offsetWidth ?? 0,\n      scrollbar: {\n        size: scrollbar.value.clientWidth ?? 0,\n        paddingStart: toInt(getComputedStyle(scrollbar.value).paddingLeft),\n        paddingEnd: toInt(getComputedStyle(scrollbar.value).paddingRight),\n      },\n    })\n  }\n  else {\n    scrollbarVisibleContext.handleSizeChange({\n      content: rootContext.viewport.value?.scrollHeight ?? 0,\n      viewport: rootContext.viewport.value?.offsetHeight ?? 0,\n      scrollbar: {\n        size: scrollbar.value?.clientHeight ?? 0,\n        paddingStart: toInt(getComputedStyle(scrollbar.value!).paddingLeft),\n        paddingEnd: toInt(getComputedStyle(scrollbar.value!).paddingRight),\n      },\n    })\n  }\n}\n\nuseResizeObserver(scrollbar, handleSizeChange)\nuseResizeObserver(rootContext.content, handleSizeChange)\n</script>\n\n<template>\n  <Primitive\n    :ref=\"forwardRef\"\n    style=\"position: absolute\"\n    data-scrollbarimpl\n    :as=\"scrollbarContext.as.value\"\n    :as-child=\"scrollbarContext.asChild.value\"\n    @pointerdown=\"handlePointerDown\"\n    @pointermove=\"handlePointerMove\"\n    @pointerup=\"handlePointerUp\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":"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"}

package/dist/ScrollArea/ScrollAreaScrollbarScroll.js

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

package/dist/ScrollArea/ScrollAreaScrollbarVisible.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, computed, openBlock, createBlock, mergeProps, unref, withCtx, renderSlot } from 'vue';
+import { defineComponent, ref, computed, createBlock, openBlock, mergeProps, unref, withCtx, renderSlot } from 'vue';
 import { _ as _sfc_main$1 } from './ScrollAreaScrollbarX.js';
 import { _ as _sfc_main$2 } from './ScrollAreaScrollbarY.js';
 import { g as getThumbRatio, i as isScrollingWithinScrollbarBounds, a as getThumbOffsetFromScroll, b as getScrollPositionFromPointer } from './utils.js';

package/dist/ScrollArea/ScrollAreaScrollbarX.cjs

@@ -27,7 +27,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
           bottom: 0,
           left: vue.unref(rootContext).dir.value === "rtl" ? "var(--reka-scroll-area-corner-width)" : 0,
           right: vue.unref(rootContext).dir.value === "ltr" ? "var(--reka-scroll-area-corner-width)" : 0,
-          ["--reka-scroll-area-thumb-width"]: sizes.value ? `${vue.unref(ScrollArea_utils.getThumbSize)(sizes.value)}px` : undefined
+          ["--reka-scroll-area-thumb-width"]: sizes.value ? `${vue.unref(ScrollArea_utils.getThumbSize)(sizes.value)}px` : void 0
         }),
         onOnDragScroll: _cache[0] || (_cache[0] = ($event) => vue.unref(scrollbarVisibleContext).onDragScroll($event.x))
       }, {

package/dist/ScrollArea/ScrollAreaScrollbarX.js

@@ -1,4 +1,4 @@
-import { defineComponent, onMounted, computed, openBlock, createBlock, unref, normalizeStyle, withCtx, renderSlot } from 'vue';
+import { defineComponent, onMounted, computed, createBlock, openBlock, unref, normalizeStyle, withCtx, renderSlot } from 'vue';
 import { _ as _sfc_main$1 } from './ScrollAreaScrollbarImpl.js';
 import { c as getThumbSize } from './utils.js';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';
@@ -25,7 +25,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           bottom: 0,
           left: unref(rootContext).dir.value === "rtl" ? "var(--reka-scroll-area-corner-width)" : 0,
           right: unref(rootContext).dir.value === "ltr" ? "var(--reka-scroll-area-corner-width)" : 0,
-          ["--reka-scroll-area-thumb-width"]: sizes.value ? `${unref(getThumbSize)(sizes.value)}px` : undefined
+          ["--reka-scroll-area-thumb-width"]: sizes.value ? `${unref(getThumbSize)(sizes.value)}px` : void 0
         }),
         onOnDragScroll: _cache[0] || (_cache[0] = ($event) => unref(scrollbarVisibleContext).onDragScroll($event.x))
       }, {

package/dist/ScrollArea/ScrollAreaScrollbarY.cjs

@@ -25,10 +25,10 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         "data-orientation": "vertical",
         style: vue.normalizeStyle({
           top: 0,
-          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: "var(--reka-scroll-area-corner-height)",
-          ["--reka-scroll-area-thumb-height"]: sizes.value ? `${vue.unref(ScrollArea_utils.getThumbSize)(sizes.value)}px` : undefined
+          ["--reka-scroll-area-thumb-height"]: sizes.value ? `${vue.unref(ScrollArea_utils.getThumbSize)(sizes.value)}px` : void 0
         }),
         onOnDragScroll: _cache[0] || (_cache[0] = ($event) => vue.unref(scrollbarVisibleContext).onDragScroll($event.y))
       }, {

package/dist/ScrollArea/ScrollAreaScrollbarY.js

@@ -1,4 +1,4 @@
-import { defineComponent, onMounted, computed, openBlock, createBlock, unref, normalizeStyle, withCtx, renderSlot } from 'vue';
+import { defineComponent, onMounted, computed, createBlock, openBlock, unref, normalizeStyle, withCtx, renderSlot } from 'vue';
 import { _ as _sfc_main$1 } from './ScrollAreaScrollbarImpl.js';
 import { c as getThumbSize } from './utils.js';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';
@@ -23,10 +23,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         "data-orientation": "vertical",
         style: normalizeStyle({
           top: 0,
-          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: "var(--reka-scroll-area-corner-height)",
-          ["--reka-scroll-area-thumb-height"]: sizes.value ? `${unref(getThumbSize)(sizes.value)}px` : undefined
+          ["--reka-scroll-area-thumb-height"]: sizes.value ? `${unref(getThumbSize)(sizes.value)}px` : void 0
         }),
         onOnDragScroll: _cache[0] || (_cache[0] = ($event) => unref(scrollbarVisibleContext).onDragScroll($event.y))
       }, {

package/dist/ScrollArea/ScrollAreaThumb.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, computed, onUnmounted, openBlock, createBlock, unref, withCtx, renderSlot } from 'vue';
+import { defineComponent, ref, computed, onUnmounted, createBlock, openBlock, unref, withCtx, renderSlot } from 'vue';
 import { watchOnce } from '@vueuse/core';
 import { d as addUnlinkedScrollListener } from './utils.js';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';

package/dist/ScrollArea/ScrollAreaViewport.cjs

@@ -62,7 +62,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                * When horizontal scrollbar is NOT visible: this element's width should
                * be constrained by the parent container to enable `text-overflow: ellipsis`
                */
-              minWidth: vue.unref(rootContext).scrollbarXEnabled.value ? "fit-content" : undefined
+              minWidth: vue.unref(rootContext).scrollbarXEnabled.value ? "fit-content" : void 0
             }),
             "as-child": props.asChild,
             as: _ctx.as

package/dist/ScrollArea/ScrollAreaViewport.js

@@ -1,4 +1,4 @@
-import { defineComponent, toRefs, ref, onMounted, openBlock, createElementBlock, Fragment, createElementVNode, mergeProps, unref, createVNode, normalizeStyle, withCtx, renderSlot, createTextVNode } from 'vue';
+import { defineComponent, toRefs, ref, onMounted, createElementBlock, openBlock, Fragment, createElementVNode, createVNode, mergeProps, unref, normalizeStyle, withCtx, renderSlot, createTextVNode } from 'vue';
 import { u as useNonce } from '../shared/useNonce.js';
 import { i as injectScrollAreaRootContext } from './ScrollAreaRoot.js';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';
@@ -60,7 +60,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                * When horizontal scrollbar is NOT visible: this element's width should
                * be constrained by the parent container to enable `text-overflow: ellipsis`
                */
-              minWidth: unref(rootContext).scrollbarXEnabled.value ? "fit-content" : undefined
+              minWidth: unref(rootContext).scrollbarXEnabled.value ? "fit-content" : void 0
             }),
             "as-child": props.asChild,
             as: _ctx.as

package/dist/Select/BubbleSelect.cjs

@@ -26,10 +26,10 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         "value"
       );
       const setValue = descriptor.set;
-      if (cur !== prev && setValue) {
+      if (cur !== prev && setValue && selectElement.value) {
         const event = new Event("change", { bubbles: true });
         setValue.call(selectElement.value, cur);
-        selectElement.value?.dispatchEvent(event);
+        selectElement.value.dispatchEvent(event);
       }
     });
     return (_ctx, _cache) => {

package/dist/Select/BubbleSelect.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BubbleSelect.cjs","sources":["../../src/Select/BubbleSelect.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, watch } from 'vue'\nimport { VisuallyHidden } from '@/VisuallyHidden'\n\ninterface BubbleSelectProps {\n  autocomplete?: string\n  autofocus?: boolean\n  disabled?: boolean\n  form?: string\n  multiple?: boolean\n  name?: string\n  required?: boolean\n  size?: number\n  value?: any\n}\n\nconst props = defineProps<BubbleSelectProps>()\nconst selectElement = ref<HTMLElement>()\n\n// This would bubble \"change\" event to form, with the target as Select element.\nwatch(() => props.value, (cur, prev) => {\n  const selectProto = window.HTMLSelectElement.prototype\n  const descriptor = Object.getOwnPropertyDescriptor(\n    selectProto,\n    'value',\n  ) as PropertyDescriptor\n  const setValue = descriptor.set\n  if (cur !== prev && setValue) {\n    const event = new Event('change', { bubbles: true })\n    setValue.call(selectElement.value, cur)\n    selectElement.value?.dispatchEvent(event)\n  }\n})\n\n/**\n * We purposefully use a `select` here to support form autofill as much\n * as possible.\n *\n * We purposefully do not add the `value` attribute here to allow the value\n * to be set programmatically and bubble to any parent form `onChange` event.\n *\n * We use `VisuallyHidden` rather than `display: \"none\"` because Safari autofill\n * won't work otherwise.\n */\n</script>\n\n<template>\n  <VisuallyHidden as-child>\n    <select\n      ref=\"selectElement\"\n      v-bind=\"props\"\n    >\n      <slot />\n    </select>\n  </VisuallyHidden>\n</template>\n"],"names":["ref","watch"],"mappings":";;;;;;;;;;;;;;;;;;;AAgBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,gBAAgBA,OAAiB,EAAA;AAGvC,IAAAC,SAAA,CAAM,MAAM,KAAA,CAAM,KAAO,EAAA,CAAC,KAAK,IAAS,KAAA;AACtC,MAAM,MAAA,WAAA,GAAc,OAAO,iBAAkB,CAAA,SAAA;AAC7C,MAAA,MAAM,aAAa,MAAO,CAAA,wBAAA;AAAA,QACxB,WAAA;AAAA,QACA;AAAA,OACF;AACA,MAAA,MAAM,WAAW,UAAW,CAAA,GAAA;AAC5B,MAAI,IAAA,GAAA,KAAQ,QAAQ,QAAU,EAAA;AAC5B,QAAA,MAAM,QAAQ,IAAI,KAAA,CAAM,UAAU,EAAE,OAAA,EAAS,MAAM,CAAA;AACnD,QAAS,QAAA,CAAA,IAAA,CAAK,aAAc,CAAA,KAAA,EAAO,GAAG,CAAA;AACtC,QAAc,aAAA,CAAA,KAAA,EAAO,cAAc,KAAK,CAAA;AAAA;AAC1C,KACD,CAAA;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"BubbleSelect.cjs","sources":["../../src/Select/BubbleSelect.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, watch } from 'vue'\nimport { VisuallyHidden } from '@/VisuallyHidden'\n\ninterface BubbleSelectProps {\n  autocomplete?: string\n  autofocus?: boolean\n  disabled?: boolean\n  form?: string\n  multiple?: boolean\n  name?: string\n  required?: boolean\n  size?: number\n  value?: any\n}\n\nconst props = defineProps<BubbleSelectProps>()\nconst selectElement = ref<HTMLElement>()\n\n// This would bubble \"change\" event to form, with the target as Select element.\nwatch(() => props.value, (cur, prev) => {\n  const selectProto = window.HTMLSelectElement.prototype\n  const descriptor = Object.getOwnPropertyDescriptor(\n    selectProto,\n    'value',\n  ) as PropertyDescriptor\n  const setValue = descriptor.set\n  if (cur !== prev && setValue && selectElement.value) {\n    const event = new Event('change', { bubbles: true })\n    setValue.call(selectElement.value, cur)\n    selectElement.value.dispatchEvent(event)\n  }\n})\n\n/**\n * We purposefully use a `select` here to support form autofill as much\n * as possible.\n *\n * We purposefully do not add the `value` attribute here to allow the value\n * to be set programmatically and bubble to any parent form `onChange` event.\n *\n * We use `VisuallyHidden` rather than `display: \"none\"` because Safari autofill\n * won't work otherwise.\n */\n</script>\n\n<template>\n  <VisuallyHidden as-child>\n    <select\n      ref=\"selectElement\"\n      v-bind=\"props\"\n    >\n      <slot />\n    </select>\n  </VisuallyHidden>\n</template>\n"],"names":["ref","watch"],"mappings":";;;;;;;;;;;;;;;;;;;AAgBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,gBAAgBA,OAAiB,EAAA;AAGvC,IAAAC,SAAA,CAAM,MAAM,KAAA,CAAM,KAAO,EAAA,CAAC,KAAK,IAAS,KAAA;AACtC,MAAM,MAAA,WAAA,GAAc,OAAO,iBAAkB,CAAA,SAAA;AAC7C,MAAA,MAAM,aAAa,MAAO,CAAA,wBAAA;AAAA,QACxB,WAAA;AAAA,QACA;AAAA,OACF;AACA,MAAA,MAAM,WAAW,UAAW,CAAA,GAAA;AAC5B,MAAA,IAAI,GAAQ,KAAA,IAAA,IAAQ,QAAY,IAAA,aAAA,CAAc,KAAO,EAAA;AACnD,QAAA,MAAM,QAAQ,IAAI,KAAA,CAAM,UAAU,EAAE,OAAA,EAAS,MAAM,CAAA;AACnD,QAAS,QAAA,CAAA,IAAA,CAAK,aAAc,CAAA,KAAA,EAAO,GAAG,CAAA;AACtC,QAAc,aAAA,CAAA,KAAA,CAAM,cAAc,KAAK,CAAA;AAAA;AACzC,KACD,CAAA;;;;;;;;;;;;;;;;;;;"}

package/dist/Select/BubbleSelect.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, watch, openBlock, createBlock, unref, withCtx, createElementVNode, mergeProps, renderSlot } from 'vue';
+import { defineComponent, ref, watch, createBlock, openBlock, unref, withCtx, createElementVNode, mergeProps, renderSlot } from 'vue';
 import { _ as _sfc_main$1 } from '../VisuallyHidden/VisuallyHidden.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -24,10 +24,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         "value"
       );
       const setValue = descriptor.set;
-      if (cur !== prev && setValue) {
+      if (cur !== prev && setValue && selectElement.value) {
         const event = new Event("change", { bubbles: true });
         setValue.call(selectElement.value, cur);
-        selectElement.value?.dispatchEvent(event);
+        selectElement.value.dispatchEvent(event);
       }
     });
     return (_ctx, _cache) => {

package/dist/Select/BubbleSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"BubbleSelect.js","sources":["../../src/Select/BubbleSelect.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, watch } from 'vue'\nimport { VisuallyHidden } from '@/VisuallyHidden'\n\ninterface BubbleSelectProps {\n  autocomplete?: string\n  autofocus?: boolean\n  disabled?: boolean\n  form?: string\n  multiple?: boolean\n  name?: string\n  required?: boolean\n  size?: number\n  value?: any\n}\n\nconst props = defineProps<BubbleSelectProps>()\nconst selectElement = ref<HTMLElement>()\n\n// This would bubble \"change\" event to form, with the target as Select element.\nwatch(() => props.value, (cur, prev) => {\n  const selectProto = window.HTMLSelectElement.prototype\n  const descriptor = Object.getOwnPropertyDescriptor(\n    selectProto,\n    'value',\n  ) as PropertyDescriptor\n  const setValue = descriptor.set\n  if (cur !== prev && setValue) {\n    const event = new Event('change', { bubbles: true })\n    setValue.call(selectElement.value, cur)\n    selectElement.value?.dispatchEvent(event)\n  }\n})\n\n/**\n * We purposefully use a `select` here to support form autofill as much\n * as possible.\n *\n * We purposefully do not add the `value` attribute here to allow the value\n * to be set programmatically and bubble to any parent form `onChange` event.\n *\n * We use `VisuallyHidden` rather than `display: \"none\"` because Safari autofill\n * won't work otherwise.\n */\n</script>\n\n<template>\n  <VisuallyHidden as-child>\n    <select\n      ref=\"selectElement\"\n      v-bind=\"props\"\n    >\n      <slot />\n    </select>\n  </VisuallyHidden>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAgBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,gBAAgB,GAAiB,EAAA;AAGvC,IAAA,KAAA,CAAM,MAAM,KAAA,CAAM,KAAO,EAAA,CAAC,KAAK,IAAS,KAAA;AACtC,MAAM,MAAA,WAAA,GAAc,OAAO,iBAAkB,CAAA,SAAA;AAC7C,MAAA,MAAM,aAAa,MAAO,CAAA,wBAAA;AAAA,QACxB,WAAA;AAAA,QACA;AAAA,OACF;AACA,MAAA,MAAM,WAAW,UAAW,CAAA,GAAA;AAC5B,MAAI,IAAA,GAAA,KAAQ,QAAQ,QAAU,EAAA;AAC5B,QAAA,MAAM,QAAQ,IAAI,KAAA,CAAM,UAAU,EAAE,OAAA,EAAS,MAAM,CAAA;AACnD,QAAS,QAAA,CAAA,IAAA,CAAK,aAAc,CAAA,KAAA,EAAO,GAAG,CAAA;AACtC,QAAc,aAAA,CAAA,KAAA,EAAO,cAAc,KAAK,CAAA;AAAA;AAC1C,KACD,CAAA;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"BubbleSelect.js","sources":["../../src/Select/BubbleSelect.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, watch } from 'vue'\nimport { VisuallyHidden } from '@/VisuallyHidden'\n\ninterface BubbleSelectProps {\n  autocomplete?: string\n  autofocus?: boolean\n  disabled?: boolean\n  form?: string\n  multiple?: boolean\n  name?: string\n  required?: boolean\n  size?: number\n  value?: any\n}\n\nconst props = defineProps<BubbleSelectProps>()\nconst selectElement = ref<HTMLElement>()\n\n// This would bubble \"change\" event to form, with the target as Select element.\nwatch(() => props.value, (cur, prev) => {\n  const selectProto = window.HTMLSelectElement.prototype\n  const descriptor = Object.getOwnPropertyDescriptor(\n    selectProto,\n    'value',\n  ) as PropertyDescriptor\n  const setValue = descriptor.set\n  if (cur !== prev && setValue && selectElement.value) {\n    const event = new Event('change', { bubbles: true })\n    setValue.call(selectElement.value, cur)\n    selectElement.value.dispatchEvent(event)\n  }\n})\n\n/**\n * We purposefully use a `select` here to support form autofill as much\n * as possible.\n *\n * We purposefully do not add the `value` attribute here to allow the value\n * to be set programmatically and bubble to any parent form `onChange` event.\n *\n * We use `VisuallyHidden` rather than `display: \"none\"` because Safari autofill\n * won't work otherwise.\n */\n</script>\n\n<template>\n  <VisuallyHidden as-child>\n    <select\n      ref=\"selectElement\"\n      v-bind=\"props\"\n    >\n      <slot />\n    </select>\n  </VisuallyHidden>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAgBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,gBAAgB,GAAiB,EAAA;AAGvC,IAAA,KAAA,CAAM,MAAM,KAAA,CAAM,KAAO,EAAA,CAAC,KAAK,IAAS,KAAA;AACtC,MAAM,MAAA,WAAA,GAAc,OAAO,iBAAkB,CAAA,SAAA;AAC7C,MAAA,MAAM,aAAa,MAAO,CAAA,wBAAA;AAAA,QACxB,WAAA;AAAA,QACA;AAAA,OACF;AACA,MAAA,MAAM,WAAW,UAAW,CAAA,GAAA;AAC5B,MAAA,IAAI,GAAQ,KAAA,IAAA,IAAQ,QAAY,IAAA,aAAA,CAAc,KAAO,EAAA;AACnD,QAAA,MAAM,QAAQ,IAAI,KAAA,CAAM,UAAU,EAAE,OAAA,EAAS,MAAM,CAAA;AACnD,QAAS,QAAA,CAAA,IAAA,CAAK,aAAc,CAAA,KAAA,EAAO,GAAG,CAAA;AACtC,QAAc,aAAA,CAAA,KAAA,CAAM,cAAc,KAAK,CAAA;AAAA;AACzC,KACD,CAAA;;;;;;;;;;;;;;;;;;;"}

package/dist/Select/SelectArrow.js

@@ -1,4 +1,4 @@
-import { defineComponent, unref, openBlock, createBlock, normalizeProps, mergeProps, withCtx, renderSlot, createCommentVNode } from 'vue';
+import { defineComponent, createBlock, createCommentVNode, unref, openBlock, normalizeProps, mergeProps, withCtx, renderSlot } from 'vue';
 import { _ as _sfc_main$1 } from '../Popper/PopperArrow.js';
 import { i as injectSelectRootContext } from './SelectRoot.js';
 import { i as injectSelectContentContext, S as SelectContentDefaultContextValue } from './SelectContentImpl.js';

package/dist/Select/SelectContent.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, onMounted, computed, openBlock, createBlock, unref, withCtx, createVNode, normalizeProps, guardReactiveProps, renderSlot, createElementBlock, Teleport, createCommentVNode } from 'vue';
+import { defineComponent, ref, onMounted, computed, createBlock, createElementBlock, createCommentVNode, openBlock, unref, withCtx, createVNode, normalizeProps, guardReactiveProps, renderSlot, Teleport } from 'vue';
 import { _ as _sfc_main$1 } from './SelectContentImpl.js';
 import { _ as _sfc_main$2 } from './SelectProvider.js';
 import { u as useForwardPropsEmits } from '../shared/useForwardPropsEmits.js';

package/dist/Select/SelectContentImpl.cjs

@@ -13,8 +13,8 @@ const shared_useFocusGuards = require('../shared/useFocusGuards.cjs');
 const shared_useHideOthers = require('../shared/useHideOthers.cjs');
 const shared_useTypeahead = require('../shared/useTypeahead.cjs');
 const shared_useForwardProps = require('../shared/useForwardProps.cjs');
-const FocusScope_FocusScope = require('../FocusScope/FocusScope.cjs');
 const shared_createContext = require('../shared/createContext.cjs');
+const FocusScope_FocusScope = require('../FocusScope/FocusScope.cjs');
 const Select_SelectRoot = require('./SelectRoot.cjs');
 
 const SelectContentDefaultContextValue = {
@@ -215,7 +215,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                     id: vue.unref(rootContext).contentId,
                     ref: (vnode) => {
                       content.value = vue.unref(core.unrefElement)(vnode);
-                      return undefined;
+                      return void 0;
                     },
                     role: "listbox",
                     "data-state": vue.unref(rootContext).open.value ? "open" : "closed",