@orchidui/dashboard 1.8.1-96 → 1.8.1-98

package/dist/ui/scroll-area/index.js

@@ -1,775 +0,0 @@
-import { defineComponent as C, ref as b, toRefs as M, createBlock as g, openBlock as S, unref as r, normalizeStyle as W, withCtx as m, renderSlot as w, computed as R, watch as I, createCommentVNode as U, mergeProps as _, onMounted as B, onUnmounted as X, createVNode as x, watchEffect as G, createElementBlock as ne, Fragment as ae, createElementVNode as se, createTextVNode as ce } from "vue";
-import { c as Q } from "../../utils-SFgRDk1R.js";
-import { q as H, v as Z, w as ie } from "../../index-BwPb_idr.js";
-import { c as ue } from "../../clamp-BL1Rb24G.js";
-import { u as P } from "../../useForwardExpose-DZT6mL_U.js";
-import { P as z } from "../../Primitive-B3twiLO1.js";
-import { c as F } from "../../createContext-CZEfaSVa.js";
-import { u as de } from "../../useDirection-C3C_TLKm.js";
-import { P as j, u as fe } from "../../Presence-CxfTrw6l.js";
-import { r as ee } from "../../index-OpE2oGce.js";
-import { u as ve } from "../../useNonce-C1ZOgOp5.js";
-const [$, pe] = F("ScrollAreaRoot"), he = /* @__PURE__ */ C({
-  __name: "ScrollAreaRoot",
-  props: {
-    type: { default: "hover" },
-    dir: {},
-    scrollHideDelay: { default: 600 },
-    asChild: { type: Boolean },
-    as: {}
-  },
-  setup(s, { expose: e }) {
-    const l = s, t = b(0), n = b(0), a = b(), c = b(), o = b(), u = b(), f = b(!1), p = b(!1), { type: y, dir: h, scrollHideDelay: E } = M(l), T = de(h);
-    function A() {
-      var d;
-      (d = a.value) == null || d.scrollTo({
-        top: 0
-      });
-    }
-    function L() {
-      var d;
-      (d = a.value) == null || d.scrollTo({
-        top: 0,
-        left: 0
-      });
-    }
-    e({
-      /** Viewport element within ScrollArea */
-      viewport: a,
-      /** Scroll viewport to top */
-      scrollTop: A,
-      /** Scroll viewport to top-left */
-      scrollTopLeft: L
-    });
-    const { forwardRef: i, currentElement: v } = P();
-    return pe({
-      type: y,
-      dir: T,
-      scrollHideDelay: E,
-      scrollArea: v,
-      viewport: a,
-      onViewportChange: (d) => {
-        a.value = d || void 0;
-      },
-      content: c,
-      onContentChange: (d) => {
-        c.value = d;
-      },
-      scrollbarX: o,
-      scrollbarXEnabled: f,
-      scrollbarY: u,
-      scrollbarYEnabled: p,
-      onScrollbarXChange: (d) => {
-        o.value = d || void 0;
-      },
-      onScrollbarYChange: (d) => {
-        u.value = d || void 0;
-      },
-      onScrollbarXEnabledChange: (d) => {
-        f.value = d;
-      },
-      onScrollbarYEnabledChange: (d) => {
-        p.value = d;
-      },
-      onCornerWidthChange: (d) => {
-        t.value = d;
-      },
-      onCornerHeightChange: (d) => {
-        n.value = d;
-      }
-    }), (d, k) => (S(), g(r(z), {
-      ref: r(i),
-      "as-child": l.asChild,
-      as: d.as,
-      dir: r(T),
-      style: W({
-        position: "relative",
-        // Pass corner sizes as CSS vars to reduce re-renders of context consumers
-        "--reka-scroll-area-corner-width": `${t.value}px`,
-        "--reka-scroll-area-corner-height": `${n.value}px`
-      })
-    }, {
-      default: m(() => [
-        w(d.$slots, "default")
-      ]),
-      _: 3
-    }, 8, ["as-child", "as", "dir", "style"]));
-  }
-}), me = /* @__PURE__ */ C({
-  __name: "ScrollAreaCornerImpl",
-  setup(s) {
-    const e = $(), l = b(0), t = b(0), n = R(() => !!l.value && !!t.value);
-    function a() {
-      var u;
-      const o = ((u = e.scrollbarX.value) == null ? void 0 : u.offsetHeight) || 0;
-      e.onCornerHeightChange(o), t.value = o;
-    }
-    function c() {
-      var u;
-      const o = ((u = e.scrollbarY.value) == null ? void 0 : u.offsetWidth) || 0;
-      e.onCornerWidthChange(o), l.value = o;
-    }
-    return H(e.scrollbarX.value, a), H(e.scrollbarY.value, c), I(() => e.scrollbarX.value, a), I(() => e.scrollbarY.value, c), (o, u) => {
-      var f;
-      return n.value ? (S(), g(r(z), _({
-        key: 0,
-        style: {
-          width: `${l.value}px`,
-          height: `${t.value}px`,
-          position: "absolute",
-          right: r(e).dir.value === "ltr" ? 0 : void 0,
-          left: r(e).dir.value === "rtl" ? 0 : void 0,
-          bottom: 0
-        }
-      }, (f = o.$parent) == null ? void 0 : f.$props), {
-        default: m(() => [
-          w(o.$slots, "default")
-        ]),
-        _: 3
-      }, 16, ["style"])) : U("", !0);
-    };
-  }
-}), be = /* @__PURE__ */ C({
-  __name: "ScrollAreaCorner",
-  props: {
-    asChild: { type: Boolean },
-    as: {}
-  },
-  setup(s) {
-    const e = s, { forwardRef: l } = P(), t = $(), n = R(
-      () => !!t.scrollbarX.value && !!t.scrollbarY.value
-    ), a = R(
-      () => t.type.value !== "scroll" && n.value
-    );
-    return (c, o) => a.value ? (S(), g(me, _({ key: 0 }, e, { ref: r(l) }), {
-      default: m(() => [
-        w(c.$slots, "default")
-      ]),
-      _: 3
-    }, 16)) : U("", !0);
-  }
-});
-function te(s, e) {
-  return (l) => {
-    if (s[0] === s[1] || e[0] === e[1])
-      return e[0];
-    const t = (e[1] - e[0]) / (s[1] - s[0]);
-    return e[0] + t * (l - s[0]);
-  };
-}
-function Y(s) {
-  const e = oe(s.viewport, s.content), l = s.scrollbar.paddingStart + s.scrollbar.paddingEnd, t = (s.scrollbar.size - l) * e;
-  return Math.max(t, 18);
-}
-function oe(s, e) {
-  const l = s / e;
-  return Number.isNaN(l) ? 0 : l;
-}
-function Se(s, e = () => {
-}) {
-  let l = { left: s.scrollLeft, top: s.scrollTop }, t = 0;
-  return function n() {
-    const a = { left: s.scrollLeft, top: s.scrollTop }, c = l.left !== a.left, o = l.top !== a.top;
-    (c || o) && e(), l = a, t = window.requestAnimationFrame(n);
-  }(), () => window.cancelAnimationFrame(t);
-}
-function J(s, e, l = "ltr") {
-  const t = Y(e), n = e.scrollbar.paddingStart + e.scrollbar.paddingEnd, a = e.scrollbar.size - n, c = e.content - e.viewport, o = a - t, u = l === "ltr" ? [0, c] : [c * -1, 0], f = ue(
-    s,
-    u[0],
-    u[1]
-  );
-  return te([0, c], [0, o])(f);
-}
-function O(s) {
-  return s ? Number.parseInt(s, 10) : 0;
-}
-function ge(s, e, l, t = "ltr") {
-  const n = Y(l), a = n / 2, c = e || a, o = n - c, u = l.scrollbar.paddingStart + c, f = l.scrollbar.size - l.scrollbar.paddingEnd - o, p = l.content - l.viewport, y = t === "ltr" ? [0, p] : [p * -1, 0];
-  return te(
-    [u, f],
-    y
-  )(s);
-}
-function K(s, e) {
-  return s > 0 && s < e;
-}
-const re = /* @__PURE__ */ C({
-  __name: "ScrollAreaScrollbarImpl",
-  props: {
-    isHorizontal: { type: Boolean }
-  },
-  emits: ["onDragScroll", "onWheelScroll", "onThumbPointerDown"],
-  setup(s, { emit: e }) {
-    const l = s, t = e, n = $(), a = V(), c = N(), { forwardRef: o, currentElement: u } = P(), f = b(""), p = b();
-    function y(i) {
-      var v, d;
-      if (p.value) {
-        const k = i.clientX - ((v = p.value) == null ? void 0 : v.left), D = i.clientY - ((d = p.value) == null ? void 0 : d.top);
-        t("onDragScroll", { x: k, y: D });
-      }
-    }
-    function h(i) {
-      i.button === 0 && (i.target.setPointerCapture(i.pointerId), p.value = u.value.getBoundingClientRect(), f.value = document.body.style.webkitUserSelect, document.body.style.webkitUserSelect = "none", n.viewport && (n.viewport.value.style.scrollBehavior = "auto"), y(i));
-    }
-    function E(i) {
-      y(i);
-    }
-    function T(i) {
-      const v = i.target;
-      v.hasPointerCapture(i.pointerId) && v.releasePointerCapture(i.pointerId), document.body.style.webkitUserSelect = f.value, n.viewport && (n.viewport.value.style.scrollBehavior = ""), p.value = void 0;
-    }
-    function A(i) {
-      var D;
-      const v = i.target, d = (D = u.value) == null ? void 0 : D.contains(v), k = a.sizes.value.content - a.sizes.value.viewport;
-      d && a.handleWheelScroll(i, k);
-    }
-    B(() => {
-      document.addEventListener("wheel", A, { passive: !1 });
-    }), X(() => {
-      document.removeEventListener("wheel", A);
-    });
-    function L() {
-      var i, v, d, k, D;
-      u.value && (l.isHorizontal ? a.handleSizeChange({
-        content: ((i = n.viewport.value) == null ? void 0 : i.scrollWidth) ?? 0,
-        viewport: ((v = n.viewport.value) == null ? void 0 : v.offsetWidth) ?? 0,
-        scrollbar: {
-          size: u.value.clientWidth ?? 0,
-          paddingStart: O(getComputedStyle(u.value).paddingLeft),
-          paddingEnd: O(getComputedStyle(u.value).paddingRight)
-        }
-      }) : a.handleSizeChange({
-        content: ((d = n.viewport.value) == null ? void 0 : d.scrollHeight) ?? 0,
-        viewport: ((k = n.viewport.value) == null ? void 0 : k.offsetHeight) ?? 0,
-        scrollbar: {
-          size: ((D = u.value) == null ? void 0 : D.clientHeight) ?? 0,
-          paddingStart: O(getComputedStyle(u.value).paddingLeft),
-          paddingEnd: O(getComputedStyle(u.value).paddingRight)
-        }
-      }));
-    }
-    return H(u, L), H(n.content, L), (i, v) => (S(), g(r(z), {
-      ref: r(o),
-      style: { position: "absolute" },
-      "data-scrollbarimpl": "",
-      as: r(c).as.value,
-      "as-child": r(c).asChild.value,
-      onPointerdown: h,
-      onPointermove: E,
-      onPointerup: T
-    }, {
-      default: m(() => [
-        w(i.$slots, "default")
-      ]),
-      _: 3
-    }, 8, ["as", "as-child"]));
-  }
-}), we = /* @__PURE__ */ C({
-  __name: "ScrollAreaScrollbarX",
-  setup(s) {
-    const e = $(), l = V(), { forwardRef: t, currentElement: n } = P();
-    B(() => {
-      n.value && e.onScrollbarXChange(n.value);
-    });
-    const a = R(() => l.sizes.value);
-    return (c, o) => (S(), g(re, {
-      ref: r(t),
-      "is-horizontal": !0,
-      "data-orientation": "horizontal",
-      style: W({
-        bottom: 0,
-        left: r(e).dir.value === "rtl" ? "var(--reka-scroll-area-corner-width)" : 0,
-        right: r(e).dir.value === "ltr" ? "var(--reka-scroll-area-corner-width)" : 0,
-        "--reka-scroll-area-thumb-width": a.value ? `${r(Y)(a.value)}px` : void 0
-      }),
-      onOnDragScroll: o[0] || (o[0] = (u) => r(l).onDragScroll(u.x))
-    }, {
-      default: m(() => [
-        w(c.$slots, "default")
-      ]),
-      _: 3
-    }, 8, ["style"]));
-  }
-}), Ce = /* @__PURE__ */ C({
-  __name: "ScrollAreaScrollbarY",
-  setup(s) {
-    const e = $(), l = V(), { forwardRef: t, currentElement: n } = P();
-    B(() => {
-      n.value && e.onScrollbarYChange(n.value);
-    });
-    const a = R(() => l.sizes.value);
-    return (c, o) => (S(), g(re, {
-      ref: r(t),
-      "is-horizontal": !1,
-      "data-orientation": "vertical",
-      style: W({
-        top: 0,
-        right: r(e).dir.value === "ltr" ? 0 : void 0,
-        left: r(e).dir.value === "rtl" ? 0 : void 0,
-        bottom: "var(--reka-scroll-area-corner-height)",
-        "--reka-scroll-area-thumb-height": a.value ? `${r(Y)(a.value)}px` : void 0
-      }),
-      onOnDragScroll: o[0] || (o[0] = (u) => r(l).onDragScroll(u.y))
-    }, {
-      default: m(() => [
-        w(c.$slots, "default")
-      ]),
-      _: 3
-    }, 8, ["style"]));
-  }
-}), [V, _e] = F("ScrollAreaScrollbarVisible"), q = /* @__PURE__ */ C({
-  __name: "ScrollAreaScrollbarVisible",
-  setup(s) {
-    const e = $(), l = N(), { forwardRef: t } = P(), n = b({
-      content: 0,
-      viewport: 0,
-      scrollbar: { size: 0, paddingStart: 0, paddingEnd: 0 }
-    }), a = R(() => {
-      const i = oe(n.value.viewport, n.value.content);
-      return i > 0 && i < 1;
-    }), c = b(), o = b(0);
-    function u(i, v) {
-      if (E.value) {
-        const d = e.viewport.value.scrollLeft + i.deltaY;
-        e.viewport.value.scrollLeft = d, K(d, v) && i.preventDefault();
-      } else {
-        const d = e.viewport.value.scrollTop + i.deltaY;
-        e.viewport.value.scrollTop = d, K(d, v) && i.preventDefault();
-      }
-    }
-    function f(i, v) {
-      E.value ? o.value = v.x : o.value = v.y;
-    }
-    function p(i) {
-      o.value = 0;
-    }
-    function y(i) {
-      n.value = i;
-    }
-    function h(i, v) {
-      return ge(
-        i,
-        o.value,
-        n.value,
-        v
-      );
-    }
-    const E = R(
-      () => l.isHorizontal.value
-    );
-    function T(i) {
-      E.value ? e.viewport.value.scrollLeft = h(
-        i,
-        e.dir.value
-      ) : e.viewport.value.scrollTop = h(i);
-    }
-    function A() {
-      if (E.value) {
-        if (e.viewport.value && c.value) {
-          const i = e.viewport.value.scrollLeft, v = J(
-            i,
-            n.value,
-            e.dir.value
-          );
-          c.value.style.transform = `translate3d(${v}px, 0, 0)`;
-        }
-      } else if (e.viewport.value && c.value) {
-        const i = e.viewport.value.scrollTop, v = J(i, n.value);
-        c.value.style.transform = `translate3d(0, ${v}px, 0)`;
-      }
-    }
-    function L(i) {
-      c.value = i;
-    }
-    return _e({
-      sizes: n,
-      hasThumb: a,
-      handleWheelScroll: u,
-      handleThumbDown: f,
-      handleThumbUp: p,
-      handleSizeChange: y,
-      onThumbPositionChange: A,
-      onThumbChange: L,
-      onDragScroll: T
-    }), (i, v) => E.value ? (S(), g(we, _({ key: 0 }, i.$attrs, { ref: r(t) }), {
-      default: m(() => [
-        w(i.$slots, "default")
-      ]),
-      _: 3
-    }, 16)) : (S(), g(Ce, _({ key: 1 }, i.$attrs, { ref: r(t) }), {
-      default: m(() => [
-        w(i.$slots, "default")
-      ]),
-      _: 3
-    }, 16));
-  }
-}), le = /* @__PURE__ */ C({
-  __name: "ScrollAreaScrollbarAuto",
-  props: {
-    forceMount: { type: Boolean }
-  },
-  setup(s) {
-    const e = $(), l = N(), { forwardRef: t } = P(), n = b(!1), a = Z(() => {
-      if (e.viewport.value) {
-        const c = e.viewport.value.offsetWidth < e.viewport.value.scrollWidth, o = e.viewport.value.offsetHeight < e.viewport.value.scrollHeight;
-        n.value = l.isHorizontal.value ? c : o;
-      }
-    }, 10);
-    return B(() => a()), H(e.viewport, a), H(e.content, a), (c, o) => (S(), g(r(j), {
-      present: c.forceMount || n.value
-    }, {
-      default: m(() => [
-        x(q, _(c.$attrs, {
-          ref: r(t),
-          "data-state": n.value ? "visible" : "hidden"
-        }), {
-          default: m(() => [
-            w(c.$slots, "default")
-          ]),
-          _: 3
-        }, 16, ["data-state"])
-      ]),
-      _: 3
-    }, 8, ["present"]));
-  }
-}), ye = /* @__PURE__ */ C({
-  inheritAttrs: !1,
-  __name: "ScrollAreaScrollbarHover",
-  props: {
-    forceMount: { type: Boolean }
-  },
-  setup(s) {
-    const e = $(), { forwardRef: l } = P();
-    let t;
-    const n = b(!1);
-    function a() {
-      window.clearTimeout(t), n.value = !0;
-    }
-    function c() {
-      t = window.setTimeout(() => {
-        n.value = !1;
-      }, e.scrollHideDelay.value);
-    }
-    return B(() => {
-      const o = e.scrollArea.value;
-      o && (o.addEventListener("pointerenter", a), o.addEventListener("pointerleave", c));
-    }), X(() => {
-      const o = e.scrollArea.value;
-      o && (window.clearTimeout(t), o.removeEventListener("pointerenter", a), o.removeEventListener("pointerleave", c));
-    }), (o, u) => (S(), g(r(j), {
-      present: o.forceMount || n.value
-    }, {
-      default: m(() => [
-        x(le, _(o.$attrs, {
-          ref: r(l),
-          "data-state": n.value ? "visible" : "hidden"
-        }), {
-          default: m(() => [
-            w(o.$slots, "default")
-          ]),
-          _: 3
-        }, 16, ["data-state"])
-      ]),
-      _: 3
-    }, 8, ["present"]));
-  }
-}), Ee = /* @__PURE__ */ C({
-  __name: "ScrollAreaScrollbarScroll",
-  props: {
-    forceMount: { type: Boolean }
-  },
-  setup(s) {
-    const e = $(), l = N(), { forwardRef: t } = P(), { state: n, dispatch: a } = fe("hidden", {
-      hidden: {
-        SCROLL: "scrolling"
-      },
-      scrolling: {
-        SCROLL_END: "idle",
-        POINTER_ENTER: "interacting"
-      },
-      interacting: {
-        SCROLL: "interacting",
-        POINTER_LEAVE: "idle"
-      },
-      idle: {
-        HIDE: "hidden",
-        SCROLL: "scrolling",
-        POINTER_ENTER: "interacting"
-      }
-    });
-    G((o) => {
-      if (n.value === "idle") {
-        const u = window.setTimeout(
-          () => a("HIDE"),
-          e.scrollHideDelay.value
-        );
-        o(() => {
-          window.clearTimeout(u);
-        });
-      }
-    });
-    const c = Z(() => a("SCROLL_END"), 100);
-    return G((o) => {
-      const u = e.viewport.value, f = l.isHorizontal.value ? "scrollLeft" : "scrollTop";
-      if (u) {
-        let p = u[f];
-        const y = () => {
-          const h = u[f];
-          p !== h && (a("SCROLL"), c()), p = h;
-        };
-        u.addEventListener("scroll", y), o(() => {
-          u.removeEventListener("scroll", y);
-        });
-      }
-    }), (o, u) => (S(), g(r(j), {
-      present: o.forceMount || r(n) !== "hidden"
-    }, {
-      default: m(() => [
-        x(q, _(o.$attrs, { ref: r(t) }), {
-          default: m(() => [
-            w(o.$slots, "default")
-          ]),
-          _: 3
-        }, 16)
-      ]),
-      _: 3
-    }, 8, ["present"]));
-  }
-}), [N, Pe] = F("ScrollAreaScrollbar"), $e = /* @__PURE__ */ C({
-  inheritAttrs: !1,
-  __name: "ScrollAreaScrollbar",
-  props: {
-    orientation: { default: "vertical" },
-    forceMount: { type: Boolean },
-    asChild: { type: Boolean },
-    as: { default: "div" }
-  },
-  setup(s) {
-    const e = s, { forwardRef: l } = P(), t = $(), n = R(() => e.orientation === "horizontal");
-    I(
-      n,
-      () => {
-        n.value ? t.onScrollbarXEnabledChange(!0) : t.onScrollbarYEnabledChange(!0);
-      },
-      { immediate: !0 }
-    ), X(() => {
-      t.onScrollbarXEnabledChange(!1), t.onScrollbarYEnabledChange(!1);
-    });
-    const { orientation: a, forceMount: c, asChild: o, as: u } = M(e);
-    return Pe({
-      orientation: a,
-      forceMount: c,
-      isHorizontal: n,
-      as: u,
-      asChild: o
-    }), (f, p) => r(t).type.value === "hover" ? (S(), g(ye, _({ key: 0 }, f.$attrs, {
-      ref: r(l),
-      "force-mount": r(c)
-    }), {
-      default: m(() => [
-        w(f.$slots, "default")
-      ]),
-      _: 3
-    }, 16, ["force-mount"])) : r(t).type.value === "scroll" ? (S(), g(Ee, _({ key: 1 }, f.$attrs, {
-      ref: r(l),
-      "force-mount": r(c)
-    }), {
-      default: m(() => [
-        w(f.$slots, "default")
-      ]),
-      _: 3
-    }, 16, ["force-mount"])) : r(t).type.value === "auto" ? (S(), g(le, _({ key: 2 }, f.$attrs, {
-      ref: r(l),
-      "force-mount": r(c)
-    }), {
-      default: m(() => [
-        w(f.$slots, "default")
-      ]),
-      _: 3
-    }, 16, ["force-mount"])) : r(t).type.value === "always" ? (S(), g(q, _({ key: 3 }, f.$attrs, {
-      ref: r(l),
-      "data-state": "visible"
-    }), {
-      default: m(() => [
-        w(f.$slots, "default")
-      ]),
-      _: 3
-    }, 16)) : U("", !0);
-  }
-}), Re = /* @__PURE__ */ C({
-  __name: "ScrollAreaThumb",
-  props: {
-    asChild: { type: Boolean },
-    as: {}
-  },
-  setup(s) {
-    const e = s, l = $(), t = V();
-    function n(h) {
-      const T = h.target.getBoundingClientRect(), A = h.clientX - T.left, L = h.clientY - T.top;
-      t.handleThumbDown(h, { x: A, y: L });
-    }
-    function a(h) {
-      t.handleThumbUp(h);
-    }
-    const { forwardRef: c, currentElement: o } = P(), u = b(), f = R(() => l.viewport.value);
-    function p() {
-      if (!u.value) {
-        const h = Se(
-          f.value,
-          t.onThumbPositionChange
-        );
-        u.value = h, t.onThumbPositionChange();
-      }
-    }
-    const y = R(() => t.sizes.value);
-    return ie(y, () => {
-      t.onThumbChange(o.value), f.value && (t.onThumbPositionChange(), f.value.addEventListener("scroll", p));
-    }), X(() => {
-      var h;
-      f.value.removeEventListener("scroll", p), (h = l.viewport.value) == null || h.removeEventListener("scroll", p);
-    }), (h, E) => (S(), g(r(z), {
-      ref: r(c),
-      "data-state": r(t).hasThumb ? "visible" : "hidden",
-      style: {
-        width: "var(--reka-scroll-area-thumb-width)",
-        height: "var(--reka-scroll-area-thumb-height)"
-      },
-      "as-child": e.asChild,
-      as: h.as,
-      onPointerdown: n,
-      onPointerup: a
-    }, {
-      default: m(() => [
-        w(h.$slots, "default")
-      ]),
-      _: 3
-    }, 8, ["data-state", "as-child", "as"]));
-  }
-}), Te = /* @__PURE__ */ C({
-  inheritAttrs: !1,
-  __name: "ScrollAreaViewport",
-  props: {
-    nonce: {},
-    asChild: { type: Boolean },
-    as: {}
-  },
-  setup(s, { expose: e }) {
-    const l = s, { nonce: t } = M(l), n = ve(t), a = $(), c = b();
-    B(() => {
-      a.onViewportChange(c.value), a.onContentChange(u.value);
-    }), e({
-      viewportElement: c
-    });
-    const { forwardRef: o, currentElement: u } = P();
-    return (f, p) => (S(), ne(ae, null, [
-      se("div", _({
-        ref_key: "viewportElement",
-        ref: c,
-        "data-reka-scroll-area-viewport": "",
-        style: {
-          /**
-           * We don't support `visible` because the intention is to have at least one scrollbar
-           * if this component is used and `visible` will behave like `auto` in that case
-           * https://developer.mozilla.org/en-US/docs/Web/CSS/overflowed#description
-           *
-           * We don't handle `auto` because the intention is for the native implementation
-           * to be hidden if using this component. We just want to ensure the node is scrollable
-           * so could have used either `scroll` or `auto` here. We picked `scroll` to prevent
-           * the browser from having to work out whether to render native scrollbars or not,
-           * we tell it to with the intention of hiding them in CSS.
-           */
-          overflowX: r(a).scrollbarXEnabled.value ? "scroll" : "hidden",
-          overflowY: r(a).scrollbarYEnabled.value ? "scroll" : "hidden"
-        }
-      }, f.$attrs, { tabindex: 0 }), [
-        x(r(z), {
-          ref: r(o),
-          style: W({
-            /**
-             * When horizontal scrollbar is visible: this element should be at least
-             * as wide as its children for size calculations to work correctly.
-             *
-             * When horizontal scrollbar is NOT visible: this element's width should
-             * be constrained by the parent container to enable `text-overflow: ellipsis`
-             */
-            minWidth: r(a).scrollbarXEnabled.value ? "fit-content" : void 0
-          }),
-          "as-child": l.asChild,
-          as: f.as
-        }, {
-          default: m(() => [
-            w(f.$slots, "default")
-          ]),
-          _: 3
-        }, 8, ["style", "as-child", "as"])
-      ], 16),
-      x(r(z), {
-        as: "style",
-        nonce: r(n)
-      }, {
-        default: m(() => p[0] || (p[0] = [
-          ce(" /* Hide scrollbars cross-browser and enable momentum scroll for touch devices */ [data-reka-scroll-area-viewport] { scrollbar-width:none; -ms-overflow-style:none; -webkit-overflow-scrolling:touch; } [data-reka-scroll-area-viewport]::-webkit-scrollbar { display:none; } ")
-        ])),
-        _: 1
-      }, 8, ["nonce"])
-    ], 64));
-  }
-}), xe = /* @__PURE__ */ C({
-  __name: "ScrollBar",
-  props: {
-    orientation: { default: "vertical" },
-    forceMount: { type: Boolean },
-    asChild: { type: Boolean },
-    as: {},
-    class: {}
-  },
-  setup(s) {
-    const e = s, l = ee(e, "class");
-    return (t, n) => (S(), g(r($e), _(r(l), {
-      class: r(Q)(
-        "flex touch-none select-none transition-colors",
-        t.orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-px",
-        t.orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-px",
-        e.class
-      )
-    }), {
-      default: m(() => [
-        x(r(Re), { class: "relative flex-1 rounded-full bg-border" })
-      ]),
-      _: 1
-    }, 16, ["class"]));
-  }
-}), Ve = /* @__PURE__ */ C({
-  __name: "ScrollArea",
-  props: {
-    type: {},
-    dir: {},
-    scrollHideDelay: {},
-    asChild: { type: Boolean },
-    as: { type: [String, Object, Function] },
-    class: {}
-  },
-  setup(s) {
-    const e = s, l = ee(e, "class");
-    return (t, n) => (S(), g(r(he), _(r(l), {
-      class: r(Q)("relative overflow-hidden", e.class)
-    }), {
-      default: m(() => [
-        x(r(Te), { class: "h-full w-full rounded-[inherit]" }, {
-          default: m(() => [
-            w(t.$slots, "default")
-          ]),
-          _: 3
-        }),
-        x(xe),
-        x(r(be))
-      ]),
-      _: 3
-    }, 16, ["class"]));
-  }
-});
-export {
-  Ve as ScrollArea,
-  xe as ScrollBar
-};