vue-virtual-flow 0.0.3 → 0.0.5

package/dist/vue-virtual-flow.js

@@ -1,51 +1,51 @@
-import { watch as Z, defineComponent as ge, ref as D, computed as s, nextTick as I, onMounted as pe, onUpdated as Se, onBeforeUnmount as ye, openBlock as x, createElementBlock as T, normalizeStyle as R, createElementVNode as $e, renderSlot as te, createTextVNode as he, createCommentVNode as ve, Fragment as me, renderList as Me, unref as v, normalizeClass as Ie, toDisplayString as ze } from "vue";
-function Ve(n) {
-  return typeof n == "string" || typeof n == "number" || typeof n == "symbol";
+import { watch as ee, defineComponent as xe, ref as N, computed as i, nextTick as O, onMounted as Se, onUpdated as Ce, onBeforeUnmount as Ie, openBlock as w, createElementBlock as x, normalizeStyle as C, createElementVNode as De, renderSlot as ne, createTextVNode as Me, createCommentVNode as me, Fragment as we, renderList as ze, unref as r, normalizeClass as He, toDisplayString as Ee } from "vue";
+function Ae(a) {
+  return typeof a == "string" || typeof a == "number" || typeof a == "symbol";
 }
-function be(n, W) {
-  const k = n[W];
-  return Ve(k) ? k : void 0;
+function Ke(a, j) {
+  const H = a[j];
+  return Ae(H) ? H : void 0;
 }
-function Be(n) {
-  return be(n, "id") ?? be(n, "key");
+function We(a) {
+  return Ke(a, "id") ?? Ke(a, "key");
 }
-function xe(n) {
-  function W(e, w) {
-    const g = n.itemKey();
-    if (typeof g == "function")
-      return g(e, w);
+function $e(a) {
+  function j(e, g) {
+    const f = a.itemKey();
+    if (typeof f == "function")
+      return f(e, g);
     if (e !== null && typeof e == "object") {
-      if (g !== void 0) {
-        const r = be(e, g);
-        if (r !== void 0) return r;
+      if (f !== void 0) {
+        const s = Ke(e, f);
+        if (s !== void 0) return s;
       }
-      const b = Be(e);
-      if (b !== void 0) return b;
+      const T = We(e);
+      if (T !== void 0) return T;
     }
-    return w;
+    return g;
   }
-  function k() {
+  function H() {
   }
-  return Z(
-    () => [n.itemKey(), n.items()],
-    k,
+  return ee(
+    () => [a.itemKey(), a.items()],
+    H,
     { immediate: !0 }
-  ), { getItemKey: W };
+  ), { getItemKey: j };
 }
-function Te(n) {
-  return n === "fill" ? "100%" : typeof n == "number" ? `${n}px` : n;
+function Ve(a) {
+  return a === "fill" ? "100%" : typeof a == "number" ? `${a}px` : a;
 }
-function we(n) {
-  return (W, k) => {
-    typeof k == "string" && (k === "fill" || k.trim().endsWith("%"));
+function Re(a) {
+  return (j, H) => {
+    typeof H == "string" && (H === "fill" || H.trim().endsWith("%"));
   };
 }
-const Ee = ["aria-label"], Le = {
+const Fe = ["aria-label"], Ye = {
   key: 0,
   class: "vue-chat-virtual-scroll__loading-older",
   role: "status",
   "aria-live": "polite"
-}, Ke = ["aria-posinset", "aria-setsize"], Oe = /* @__PURE__ */ ge({
+}, Ne = ["aria-posinset", "aria-setsize"], _e = /* @__PURE__ */ xe({
   name: "ChatVirtualScroll",
   __name: "ChatVirtualScroll",
   props: {
@@ -63,301 +63,301 @@ const Ee = ["aria-label"], Le = {
     loadOlderThreshold: { default: 120 }
   },
   emits: ["scroll", "loadOlder", "bottomChange"],
-  setup(n, { expose: W, emit: k }) {
-    const e = n, w = k, g = D(), b = D(0), r = D(0), H = D(0), N = D(!0), C = /* @__PURE__ */ new Map(), L = /* @__PURE__ */ new Map();
-    let A, h, V = -1, M = !1;
-    const S = we(), { getItemKey: P } = xe({
+  setup(a, { expose: j, emit: H }) {
+    const e = a, g = H, f = N(), T = N(0), s = N(0), V = N(0), _ = N(!0), F = /* @__PURE__ */ new Map(), G = /* @__PURE__ */ new Map();
+    let q, y, k = -1, I = !1;
+    const z = Re(), { getItemKey: A } = $e({
       componentName: "ChatVirtualScroll",
       items: () => e.items,
       itemKey: () => e.itemKey
-    }), Y = s(
+    }), W = i(
       () => Math.max(1, e.estimatedItemSize)
-    ), _ = s(() => Math.max(0, Math.floor(e.overscan))), ae = s(() => r.value > 0 ? r.value : typeof e.height == "number" ? Math.max(0, e.height) : Y.value), K = s(() => {
-      H.value;
-      const o = new Array(e.items.length + 1), c = new Array(e.items.length);
-      o[0] = 0;
-      for (let u = 0; u < e.items.length; u += 1) {
-        const E = P(e.items[u], u), $ = C.get(E) ?? Y.value;
-        c[u] = $, o[u + 1] = o[u] + $;
+    ), Z = i(() => Math.max(0, Math.floor(e.overscan))), te = i(() => s.value > 0 ? s.value : typeof e.height == "number" ? Math.max(0, e.height) : W.value), Y = i(() => {
+      V.value;
+      const l = new Array(e.items.length + 1), u = new Array(e.items.length);
+      l[0] = 0;
+      for (let c = 0; c < e.items.length; c += 1) {
+        const E = A(e.items[c], c), P = F.get(E) ?? W.value;
+        u[c] = P, l[c + 1] = l[c] + P;
       }
       return {
-        offsets: o,
-        sizes: c,
-        total: o[e.items.length] ?? 0
+        offsets: l,
+        sizes: u,
+        total: l[e.items.length] ?? 0
       };
-    }), z = s(() => {
-      const o = /* @__PURE__ */ new Map();
-      return e.items.forEach((c, u) => {
-        o.set(P(c, u), u);
-      }), o;
+    }), L = i(() => {
+      const l = /* @__PURE__ */ new Map();
+      return e.items.forEach((u, c) => {
+        l.set(A(u, c), c);
+      }), l;
     });
-    function Q(o) {
+    function J(l) {
       if (e.items.length === 0) return 0;
-      const c = K.value.offsets;
-      let u = 0, E = e.items.length;
-      for (; u < E; ) {
-        const $ = Math.floor((u + E) / 2);
-        c[$ + 1] <= o ? u = $ + 1 : E = $;
+      const u = Y.value.offsets;
+      let c = 0, E = e.items.length;
+      for (; c < E; ) {
+        const P = Math.floor((c + E) / 2);
+        u[P + 1] <= l ? c = P + 1 : E = P;
       }
-      return Math.min(u, e.items.length - 1);
+      return Math.min(c, e.items.length - 1);
     }
-    const B = s(
+    const K = i(
       () => Math.max(
         0,
-        Q(b.value) - _.value
+        J(T.value) - Z.value
       )
-    ), q = s(() => {
+    ), Q = i(() => {
       if (e.items.length === 0) return 0;
-      const o = Q(b.value + ae.value) + 1;
+      const l = J(T.value + te.value) + 1;
       return Math.min(
         e.items.length,
-        o + _.value
+        l + Z.value
       );
-    }), U = s(
-      () => e.items.slice(B.value, q.value).map((o, c) => {
-        const u = B.value + c;
+    }), le = i(
+      () => e.items.slice(K.value, Q.value).map((l, u) => {
+        const c = K.value + u;
         return {
-          item: o,
-          index: u,
-          key: P(o, u),
-          top: K.value.offsets[u]
+          item: l,
+          index: c,
+          key: A(l, c),
+          top: Y.value.offsets[c]
         };
       })
-    ), ie = s(() => ({
-      height: Te(e.height)
+    ), ue = i(() => ({
+      height: Ve(e.height)
     }));
-    function F() {
-      const o = g.value;
-      if (!o) return;
-      const u = Math.max(
+    function U() {
+      const l = f.value;
+      if (!l) return;
+      const c = Math.max(
         0,
-        K.value.total - o.scrollTop - o.clientHeight
+        Y.value.total - l.scrollTop - l.clientHeight
       ) <= Math.max(0, e.bottomThreshold);
-      u !== N.value && (N.value = u, M && w("bottomChange", u));
+      c !== _.value && (_.value = c, I && g("bottomChange", c));
     }
-    function f() {
-      var o;
-      r.value = ((o = g.value) == null ? void 0 : o.clientHeight) ?? 0, S(g.value, e.height), I(() => {
-        F(), O();
+    function m() {
+      var l;
+      s.value = ((l = f.value) == null ? void 0 : l.clientHeight) ?? 0, z(f.value, e.height), O(() => {
+        U(), D();
       });
     }
-    function m(o) {
-      b.value = o.currentTarget.scrollTop, F(), w("scroll", {
-        scrollTop: b.value,
-        startIndex: B.value,
-        endIndex: q.value
-      }), O();
-    }
-    function O() {
-      const o = g.value;
-      !M || !o || !e.hasOlder || e.loadingOlder || V === e.items.length || o.scrollTop <= Math.max(0, e.loadOlderThreshold) && (V = e.items.length, w("loadOlder"));
-    }
-    function oe(o) {
-      const c = o.borderBoxSize;
-      if (c) {
-        const u = Array.isArray(c) ? c[0] : c;
-        if (u != null && u.blockSize) return u.blockSize;
+    function p(l) {
+      T.value = l.currentTarget.scrollTop, U(), g("scroll", {
+        scrollTop: T.value,
+        startIndex: K.value,
+        endIndex: Q.value
+      }), D();
+    }
+    function D() {
+      const l = f.value;
+      !I || !l || !e.hasOlder || e.loadingOlder || k === e.items.length || l.scrollTop <= Math.max(0, e.loadOlderThreshold) && (k = e.items.length, g("loadOlder"));
+    }
+    function se(l) {
+      const u = l.borderBoxSize;
+      if (u) {
+        const c = Array.isArray(u) ? u[0] : u;
+        if (c != null && c.blockSize) return c.blockSize;
       }
-      return o.contentRect.height;
-    }
-    function le(o) {
-      const c = K.value, u = N.value && e.stickToBottom;
-      let E = 0, $ = !1;
-      for (const j of o) {
-        const se = j.target, a = L.get(se), t = oe(j);
-        if (a === void 0 || t <= 0) continue;
-        const l = C.get(a) ?? Y.value;
-        if (Math.abs(l - t) < 0.5) continue;
-        const i = z.value.get(a);
-        i !== void 0 && c.offsets[i + 1] <= b.value && (E += t - l), C.set(a, t), $ = !0;
+      return l.contentRect.height;
+    }
+    function ae(l) {
+      const u = Y.value, c = _.value && e.stickToBottom;
+      let E = 0, P = !1;
+      for (const S of l) {
+        const R = S.target, n = G.get(R), t = se(S);
+        if (n === void 0 || t <= 0) continue;
+        const o = F.get(n) ?? W.value;
+        if (Math.abs(o - t) < 0.5) continue;
+        const v = L.value.get(n);
+        v !== void 0 && u.offsets[v + 1] <= T.value && (E += t - o), F.set(n, t), P = !0;
       }
-      $ && (H.value += 1, I(() => {
-        const j = g.value;
-        j && (u ? p("auto") : E !== 0 && (j.scrollTop += E, b.value = j.scrollTop, F()));
+      P && (V.value += 1, O(() => {
+        const S = f.value;
+        S && (c ? h("auto") : E !== 0 && (S.scrollTop += E, T.value = S.scrollTop, U()));
       }));
     }
-    function ue(o, c) {
-      o instanceof HTMLElement && (L.set(o, c), h == null || h.observe(o));
+    function fe(l, u) {
+      l instanceof HTMLElement && (G.set(l, u), y == null || y.observe(l));
     }
-    function X() {
-      for (const [o] of L)
-        o.isConnected || (h == null || h.unobserve(o), L.delete(o));
+    function oe() {
+      for (const [l] of G)
+        l.isConnected || (y == null || y.unobserve(l), G.delete(l));
     }
-    function ce(o, c = {}) {
-      const u = g.value;
-      if (!u) return;
-      const E = Math.max(0, K.value.total - u.clientHeight), $ = Math.min(
-        Math.max(0, Number.isFinite(o) ? o : 0),
+    function ie(l, u = {}) {
+      const c = f.value;
+      if (!c) return;
+      const E = Math.max(0, Y.value.total - c.clientHeight), P = Math.min(
+        Math.max(0, Number.isFinite(l) ? l : 0),
         E
-      ), j = c.behavior ?? "auto";
-      j === "auto" && (b.value = $), u.scrollTo({ ...c, top: $, behavior: j }), I(F);
+      ), S = u.behavior ?? "auto";
+      S === "auto" && (T.value = P), c.scrollTo({ ...u, top: P, behavior: S }), O(U);
     }
-    function G(o, c = {}) {
-      const u = g.value;
-      if (!u || e.items.length === 0) return;
+    function re(l, u = {}) {
+      const c = f.value;
+      if (!c || e.items.length === 0) return;
       const E = Math.min(
         e.items.length - 1,
-        Math.max(0, Math.floor(o))
-      ), { align: $ = "start", ...j } = c, se = K.value.sizes[E];
-      let a = K.value.offsets[E];
-      $ === "center" ? a -= (u.clientHeight - se) / 2 : $ === "end" && (a -= u.clientHeight - se);
+        Math.max(0, Math.floor(l))
+      ), { align: P = "start", ...S } = u, R = Y.value.sizes[E];
+      let n = Y.value.offsets[E];
+      P === "center" ? n -= (c.clientHeight - R) / 2 : P === "end" && (n -= c.clientHeight - R);
       const t = Math.max(
         0,
-        Math.min(a, K.value.total - u.clientHeight)
-      ), l = j.behavior ?? "auto";
-      l === "auto" && (b.value = t), u.scrollTo({
-        ...j,
+        Math.min(n, Y.value.total - c.clientHeight)
+      ), o = S.behavior ?? "auto";
+      o === "auto" && (T.value = t), c.scrollTo({
+        ...S,
         top: t,
-        behavior: l
-      }), I(F);
+        behavior: o
+      }), O(U);
     }
-    function ne(o = "auto") {
-      const c = g.value;
-      c && (o === "auto" && (b.value = 0), c.scrollTo({ top: 0, behavior: o }), I(F));
+    function de(l = "auto") {
+      const u = f.value;
+      u && (l === "auto" && (T.value = 0), u.scrollTo({ top: 0, behavior: l }), O(U));
     }
-    function p(o = "auto") {
-      const c = g.value;
-      if (!c) return;
-      const u = Math.max(0, K.value.total - c.clientHeight);
-      o === "auto" ? (c.scrollTop = u, b.value = u) : c.scrollTo({ top: u, behavior: o }), I(F);
-    }
-    let y = e.items.map((o, c) => P(o, c));
-    return Z(
-      () => e.items.map((o, c) => P(o, c)),
-      async (o) => {
-        const c = y;
-        y = o;
-        const u = g.value, E = (u == null ? void 0 : u.scrollTop) ?? 0, $ = N.value && e.stickToBottom, j = c[0], se = j === void 0 ? 0 : o.indexOf(j), a = se > 0 ? o.slice(0, se).reduce(
-          (l, i) => l + (C.get(i) ?? Y.value),
+    function h(l = "auto") {
+      const u = f.value;
+      if (!u) return;
+      const c = Math.max(0, Y.value.total - u.clientHeight);
+      l === "auto" ? (u.scrollTop = c, T.value = c) : u.scrollTo({ top: c, behavior: l }), O(U);
+    }
+    let $ = e.items.map((l, u) => A(l, u));
+    return ee(
+      () => e.items.map((l, u) => A(l, u)),
+      async (l) => {
+        const u = $;
+        $ = l;
+        const c = f.value, E = (c == null ? void 0 : c.scrollTop) ?? 0, P = _.value && e.stickToBottom, S = u[0], R = S === void 0 ? 0 : l.indexOf(S), n = R > 0 ? l.slice(0, R).reduce(
+          (o, v) => o + (F.get(v) ?? W.value),
           0
-        ) : 0, t = new Set(o);
-        for (const l of C.keys())
-          t.has(l) || C.delete(l);
-        H.value += 1, await I(), u && (a > 0 ? (u.scrollTop = E + a, b.value = u.scrollTop) : o.length > c.length && $ && p("auto"), F(), O());
+        ) : 0, t = new Set(l);
+        for (const o of F.keys())
+          t.has(o) || F.delete(o);
+        V.value += 1, await O(), c && (n > 0 ? (c.scrollTop = E + n, T.value = c.scrollTop) : l.length > u.length && P && h("auto"), U(), D());
       }
-    ), Z(
+    ), ee(
       () => [e.hasOlder, e.loadingOlder],
-      async ([o]) => {
-        o || (V = -1), await I(), O();
+      async ([l]) => {
+        l || (k = -1), await O(), D();
       }
-    ), pe(() => {
-      if (f(), typeof ResizeObserver < "u") {
-        A = new ResizeObserver(f), h = new ResizeObserver(le), g.value && A.observe(g.value);
-        for (const [o] of L)
-          h.observe(o);
+    ), Se(() => {
+      if (m(), typeof ResizeObserver < "u") {
+        q = new ResizeObserver(m), y = new ResizeObserver(ae), f.value && q.observe(f.value);
+        for (const [l] of G)
+          y.observe(l);
       }
-      I(() => {
-        e.initialScroll === "bottom" && p("auto"), M = !0, F(), O();
+      O(() => {
+        e.initialScroll === "bottom" && h("auto"), I = !0, U(), D();
       });
-    }), Se(X), ye(() => {
-      A && (A.disconnect(), A = void 0), h && (h.disconnect(), h = void 0), L.clear();
-    }), W({
-      isAtBottom: N,
-      scrollTo: ce,
-      scrollToIndex: G,
-      scrollToTop: ne,
-      scrollToBottom: p
-    }), (o, c) => (x(), T("div", {
+    }), Ce(oe), Ie(() => {
+      q && (q.disconnect(), q = void 0), y && (y.disconnect(), y = void 0), G.clear();
+    }), j({
+      isAtBottom: _,
+      scrollTo: ie,
+      scrollToIndex: re,
+      scrollToTop: de,
+      scrollToBottom: h
+    }), (l, u) => (w(), x("div", {
       ref_key: "viewport",
-      ref: g,
+      ref: f,
       class: "vue-chat-virtual-scroll",
-      style: R(ie.value),
+      style: C(ue.value),
       role: "log",
-      "aria-label": n.ariaLabel,
+      "aria-label": a.ariaLabel,
       "aria-live": "polite",
       tabindex: "0",
-      onScrollPassive: m
+      onScrollPassive: p
     }, [
-      n.loadingOlder ? (x(), T("div", Le, [
-        $e("div", null, [
-          te(o.$slots, "loadingOlder", {}, () => [
-            c[0] || (c[0] = he("Loading older messages…", -1))
+      a.loadingOlder ? (w(), x("div", Ye, [
+        De("div", null, [
+          ne(l.$slots, "loadingOlder", {}, () => [
+            u[0] || (u[0] = Me("Loading older messages…", -1))
           ])
         ])
-      ])) : ve("", !0),
-      n.items.length ? (x(), T("div", {
+      ])) : me("", !0),
+      a.items.length ? (w(), x("div", {
         key: 1,
         class: "vue-chat-virtual-scroll__spacer",
-        style: R({ height: `${K.value.total}px` })
+        style: C({ height: `${Y.value.total}px` })
       }, [
-        (x(!0), T(me, null, Me(U.value, ({ item: u, index: E, key: $, top: j }) => (x(), T("div", {
-          key: $,
+        (w(!0), x(we, null, ze(le.value, ({ item: c, index: E, key: P, top: S }) => (w(), x("div", {
+          key: P,
           ref_for: !0,
-          ref: (se) => ue(se, $),
+          ref: (R) => fe(R, P),
           class: "vue-chat-virtual-scroll__item",
-          style: R({ transform: `translateY(${j}px)` }),
+          style: C({ transform: `translateY(${S}px)` }),
           role: "article",
           "aria-posinset": E + 1,
-          "aria-setsize": n.items.length
+          "aria-setsize": a.items.length
         }, [
-          te(o.$slots, "default", {
-            item: u,
+          ne(l.$slots, "default", {
+            item: c,
             index: E
           })
-        ], 12, Ke))), 128))
-      ], 4)) : te(o.$slots, "empty", {}, void 0, void 0, 2)
-    ], 44, Ee));
+        ], 12, Ne))), 128))
+      ], 4)) : ne(l.$slots, "empty", {}, void 0, void 0, 2)
+    ], 44, Fe));
   }
 });
-function ke(n) {
-  const W = D(), k = D(0), e = D(!1), w = D(!1), g = s(() => Math.max(1, n.threshold())), b = s(
-    () => n.refreshing() || w.value ? g.value : k.value
-  ), r = s(
-    () => Math.min(1, k.value / g.value)
-  ), H = s(() => n.refreshing() || w.value ? "Refreshing…" : r.value >= 1 ? "Release to refresh" : "Pull to refresh");
-  function N() {
-    W.value = void 0, e.value = !1, k.value = 0;
+function Oe(a) {
+  const j = N(), H = N(0), e = N(!1), g = N(!1), f = i(() => Math.max(1, a.threshold())), T = i(
+    () => a.refreshing() || g.value ? f.value : H.value
+  ), s = i(
+    () => Math.min(1, H.value / f.value)
+  ), V = i(() => a.refreshing() || g.value ? "Refreshing…" : s.value >= 1 ? "Release to refresh" : "Pull to refresh");
+  function _() {
+    j.value = void 0, e.value = !1, H.value = 0;
   }
-  function C(h) {
-    var S;
-    const V = h.currentTarget, M = ((S = n.scrollTop) == null ? void 0 : S.call(n)) ?? V.scrollTop;
-    !n.enabled() || n.refreshing() || M > 0 || h.touches.length !== 1 || (W.value = h.touches[0].clientY, e.value = !0);
+  function F(y) {
+    var z;
+    const k = y.currentTarget, I = ((z = a.scrollTop) == null ? void 0 : z.call(a)) ?? k.scrollTop;
+    !a.enabled() || a.refreshing() || I > 0 || y.touches.length !== 1 || (j.value = y.touches[0].clientY, e.value = !0);
   }
-  function L(h) {
-    var P;
-    if (W.value === void 0 || !e.value) return;
-    const V = h.currentTarget;
-    if ((((P = n.scrollTop) == null ? void 0 : P.call(n)) ?? V.scrollTop) > 0 || h.touches.length !== 1) {
-      N();
+  function G(y) {
+    var A;
+    if (j.value === void 0 || !e.value) return;
+    const k = y.currentTarget;
+    if ((((A = a.scrollTop) == null ? void 0 : A.call(a)) ?? k.scrollTop) > 0 || y.touches.length !== 1) {
+      _();
       return;
     }
-    const S = h.touches[0].clientY - W.value;
-    if (S <= 0) {
-      k.value = 0;
+    const z = y.touches[0].clientY - j.value;
+    if (z <= 0) {
+      H.value = 0;
       return;
     }
-    h.preventDefault(), k.value = Math.min(S * 0.5, g.value * 2);
+    y.preventDefault(), H.value = Math.min(z * 0.5, f.value * 2);
   }
-  function A() {
-    if (W.value === void 0) return;
-    const h = k.value >= g.value && n.enabled() && !n.refreshing();
-    if (W.value = void 0, e.value = !1, !h) {
-      k.value = 0;
+  function q() {
+    if (j.value === void 0) return;
+    const y = H.value >= f.value && a.enabled() && !a.refreshing();
+    if (j.value = void 0, e.value = !1, !y) {
+      H.value = 0;
       return;
     }
-    k.value = g.value, w.value = !0, n.onRefresh(), I(() => {
-      n.refreshing() || (w.value = !1, k.value = 0);
+    H.value = f.value, g.value = !0, a.onRefresh(), O(() => {
+      a.refreshing() || (g.value = !1, H.value = 0);
     });
   }
-  return Z(
-    () => n.refreshing(),
-    (h, V) => {
-      h ? (w.value = !1, k.value = g.value) : V && (w.value = !1, k.value = 0);
+  return ee(
+    () => a.refreshing(),
+    (y, k) => {
+      y ? (g.value = !1, H.value = f.value) : k && (g.value = !1, H.value = 0);
     }
   ), {
     pulling: e,
-    pullDistance: k,
-    pullOffset: b,
-    pullProgress: r,
-    refreshMessage: H,
-    refreshThreshold: g,
-    handleTouchStart: C,
-    handleTouchMove: L,
-    handleTouchEnd: A,
-    handleTouchCancel: N
+    pullDistance: H,
+    pullOffset: T,
+    pullProgress: s,
+    refreshMessage: V,
+    refreshThreshold: f,
+    handleTouchStart: F,
+    handleTouchMove: G,
+    handleTouchEnd: q,
+    handleTouchCancel: _
   };
 }
-const Re = ["aria-label"], Ce = ["aria-posinset", "aria-setsize"], He = /* @__PURE__ */ ge({
+const Ge = ["aria-label"], Ue = ["aria-posinset", "aria-setsize"], Pe = /* @__PURE__ */ xe({
   name: "DynamicVirtualScroll",
   __name: "DynamicVirtualScroll",
   props: {
@@ -376,294 +376,294 @@ const Re = ["aria-label"], Ce = ["aria-posinset", "aria-setsize"], He = /* @__PU
     pullRefreshThreshold: { default: 64 }
   },
   emits: ["scroll", "loadMore", "refresh"],
-  setup(n, { expose: W, emit: k }) {
-    const e = n, w = k, {
-      pulling: g,
-      pullDistance: b,
-      pullOffset: r,
-      pullProgress: H,
-      refreshMessage: N,
-      refreshThreshold: C,
-      handleTouchStart: L,
-      handleTouchMove: A,
-      handleTouchEnd: h,
-      handleTouchCancel: V
-    } = ke({
+  setup(a, { expose: j, emit: H }) {
+    const e = a, g = H, {
+      pulling: f,
+      pullDistance: T,
+      pullOffset: s,
+      pullProgress: V,
+      refreshMessage: _,
+      refreshThreshold: F,
+      handleTouchStart: G,
+      handleTouchMove: q,
+      handleTouchEnd: y,
+      handleTouchCancel: k
+    } = Oe({
       enabled: () => e.pullToRefresh,
       refreshing: () => e.refreshing,
       threshold: () => e.pullRefreshThreshold,
-      onRefresh: () => w("refresh")
-    }), M = D(), S = D(0), P = D(0), Y = D(0), _ = /* @__PURE__ */ new Map(), ae = /* @__PURE__ */ new Map();
-    let K, z, Q = -1;
-    const B = we(), { getItemKey: q } = xe({
+      onRefresh: () => g("refresh")
+    }), I = N(), z = N(0), A = N(0), W = N(0), Z = /* @__PURE__ */ new Map(), te = /* @__PURE__ */ new Map();
+    let Y, L, J = -1;
+    const K = Re(), { getItemKey: Q } = $e({
       componentName: "DynamicVirtualScroll",
       items: () => e.items,
       itemKey: () => e.itemKey
-    }), U = s(
+    }), le = i(
       () => Math.max(1, e.estimatedItemSize)
-    ), ie = s(
-      () => Math.max(1, e.loadingItemSize ?? U.value)
-    ), F = s(() => Math.max(0, Math.floor(e.overscan))), f = s(() => P.value > 0 ? P.value : typeof e.height == "number" ? Math.max(0, e.height) : U.value), m = s(() => {
-      Y.value;
-      const a = new Array(e.items.length + 1), t = new Array(e.items.length);
-      a[0] = 0;
-      for (let l = 0; l < e.items.length; l += 1) {
-        const i = q(e.items[l], l), d = _.get(i) ?? U.value;
-        t[l] = d, a[l + 1] = a[l] + d;
+    ), ue = i(
+      () => Math.max(1, e.loadingItemSize ?? le.value)
+    ), U = i(() => Math.max(0, Math.floor(e.overscan))), m = i(() => A.value > 0 ? A.value : typeof e.height == "number" ? Math.max(0, e.height) : le.value), p = i(() => {
+      W.value;
+      const n = new Array(e.items.length + 1), t = new Array(e.items.length);
+      n[0] = 0;
+      for (let o = 0; o < e.items.length; o += 1) {
+        const v = Q(e.items[o], o), B = Z.get(v) ?? le.value;
+        t[o] = B, n[o + 1] = n[o] + B;
       }
       return {
-        offsets: a,
+        offsets: n,
         sizes: t,
-        total: a[e.items.length] ?? 0
+        total: n[e.items.length] ?? 0
       };
-    }), O = s(
-      () => m.value.total + (e.loading ? ie.value : 0)
-    ), oe = s(() => {
-      const a = /* @__PURE__ */ new Map();
-      return e.items.forEach((t, l) => {
-        a.set(q(t, l), l);
-      }), a;
+    }), D = i(
+      () => p.value.total + (e.loading ? ue.value : 0)
+    ), se = i(() => {
+      const n = /* @__PURE__ */ new Map();
+      return e.items.forEach((t, o) => {
+        n.set(Q(t, o), o);
+      }), n;
     });
-    function le(a) {
+    function ae(n) {
       if (e.items.length === 0) return 0;
-      const t = m.value.offsets;
-      let l = 0, i = e.items.length;
-      for (; l < i; ) {
-        const d = Math.floor((l + i) / 2);
-        t[d + 1] <= a ? l = d + 1 : i = d;
+      const t = p.value.offsets;
+      let o = 0, v = e.items.length;
+      for (; o < v; ) {
+        const B = Math.floor((o + v) / 2);
+        t[B + 1] <= n ? o = B + 1 : v = B;
       }
-      return Math.min(l, e.items.length - 1);
+      return Math.min(o, e.items.length - 1);
     }
-    const ue = s(
+    const fe = i(
       () => Math.max(
         0,
-        le(S.value) - F.value
+        ae(z.value) - U.value
       )
-    ), X = s(() => {
+    ), oe = i(() => {
       if (e.items.length === 0) return 0;
-      const a = le(S.value + f.value) + 1;
+      const n = ae(z.value + m.value) + 1;
       return Math.min(
         e.items.length,
-        a + F.value
+        n + U.value
       );
-    }), ce = s(
-      () => e.items.slice(ue.value, X.value).map((a, t) => {
-        const l = ue.value + t;
+    }), ie = i(
+      () => e.items.slice(fe.value, oe.value).map((n, t) => {
+        const o = fe.value + t;
         return {
-          item: a,
-          index: l,
-          key: q(a, l),
-          top: m.value.offsets[l]
+          item: n,
+          index: o,
+          key: Q(n, o),
+          top: p.value.offsets[o]
         };
       })
-    ), G = s(() => ({
-      height: Te(e.height)
+    ), re = i(() => ({
+      height: Ve(e.height)
     }));
-    function ne() {
-      var a;
-      P.value = ((a = M.value) == null ? void 0 : a.clientHeight) ?? 0, B(M.value, e.height), I(y);
-    }
-    function p(a) {
-      S.value = a.currentTarget.scrollTop, w("scroll", {
-        scrollTop: S.value,
-        startIndex: ue.value,
-        endIndex: X.value
-      }), y();
-    }
-    function y() {
-      const a = M.value;
-      if (!a || !e.hasMore || e.loading || Q === e.items.length)
+    function de() {
+      var n;
+      A.value = ((n = I.value) == null ? void 0 : n.clientHeight) ?? 0, K(I.value, e.height), O($);
+    }
+    function h(n) {
+      z.value = n.currentTarget.scrollTop, g("scroll", {
+        scrollTop: z.value,
+        startIndex: fe.value,
+        endIndex: oe.value
+      }), $();
+    }
+    function $() {
+      const n = I.value;
+      if (!n || !e.hasMore || e.loading || J === e.items.length)
         return;
       const t = Math.max(0, e.loadMoreThreshold);
-      O.value - a.scrollTop - a.clientHeight <= t && (Q = e.items.length, w("loadMore"));
+      D.value - n.scrollTop - n.clientHeight <= t && (J = e.items.length, g("loadMore"));
     }
-    function o(a) {
-      const t = a.borderBoxSize;
+    function l(n) {
+      const t = n.borderBoxSize;
       if (t) {
-        const l = Array.isArray(t) ? t[0] : t;
-        if (l != null && l.blockSize) return l.blockSize;
+        const o = Array.isArray(t) ? t[0] : t;
+        if (o != null && o.blockSize) return o.blockSize;
       }
-      return a.contentRect.height;
-    }
-    function c(a) {
-      const t = m.value;
-      let l = 0, i = !1;
-      for (const d of a) {
-        const ee = d.target, J = ae.get(ee), re = o(d);
-        if (J === void 0 || re <= 0) continue;
-        const de = _.get(J) ?? U.value;
-        if (Math.abs(de - re) < 0.5) continue;
-        const fe = oe.value.get(J);
-        fe !== void 0 && t.offsets[fe + 1] <= S.value && (l += re - de), _.set(J, re), i = !0;
+      return n.contentRect.height;
+    }
+    function u(n) {
+      const t = p.value;
+      let o = 0, v = !1;
+      for (const B of n) {
+        const he = B.target, ve = te.get(he), ge = l(B);
+        if (ve === void 0 || ge <= 0) continue;
+        const Te = Z.get(ve) ?? le.value;
+        if (Math.abs(Te - ge) < 0.5) continue;
+        const be = se.value.get(ve);
+        be !== void 0 && t.offsets[be + 1] <= z.value && (o += ge - Te), Z.set(ve, ge), v = !0;
       }
-      i && (Y.value += 1, I(y), l !== 0 && I(() => {
-        const d = M.value;
-        d && (d.scrollTop += l, S.value = d.scrollTop);
+      v && (W.value += 1, O($), o !== 0 && O(() => {
+        const B = I.value;
+        B && (B.scrollTop += o, z.value = B.scrollTop);
       }));
     }
-    function u(a, t) {
-      a instanceof HTMLElement && (ae.set(a, t), z == null || z.observe(a));
+    function c(n, t) {
+      n instanceof HTMLElement && (te.set(n, t), L == null || L.observe(n));
     }
     function E() {
-      for (const [a] of ae)
-        a.isConnected || (z == null || z.unobserve(a), ae.delete(a));
+      for (const [n] of te)
+        n.isConnected || (L == null || L.unobserve(n), te.delete(n));
     }
-    function $(a, t = {}) {
-      const l = M.value;
-      if (!l) return;
-      const i = Math.max(0, O.value - l.clientHeight), d = Math.min(
-        Math.max(0, Number.isFinite(a) ? a : 0),
-        i
-      ), ee = t.behavior ?? "auto";
-      ee === "auto" && (S.value = d), l.scrollTo({ ...t, top: d, behavior: ee });
-    }
-    function j(a, t = {}) {
-      const l = M.value;
-      if (!l || e.items.length === 0) return;
-      const i = Math.min(
+    function P(n, t = {}) {
+      const o = I.value;
+      if (!o) return;
+      const v = Math.max(0, D.value - o.clientHeight), B = Math.min(
+        Math.max(0, Number.isFinite(n) ? n : 0),
+        v
+      ), he = t.behavior ?? "auto";
+      he === "auto" && (z.value = B), o.scrollTo({ ...t, top: B, behavior: he });
+    }
+    function S(n, t = {}) {
+      const o = I.value;
+      if (!o || e.items.length === 0) return;
+      const v = Math.min(
         e.items.length - 1,
-        Math.max(0, Math.floor(a))
-      ), { align: d = "start", ...ee } = t;
-      let J = m.value.offsets[i];
-      const re = m.value.sizes[i];
-      d === "center" ? J -= (l.clientHeight - re) / 2 : d === "end" && (J -= l.clientHeight - re);
-      const de = Math.max(
+        Math.max(0, Math.floor(n))
+      ), { align: B = "start", ...he } = t;
+      let ve = p.value.offsets[v];
+      const ge = p.value.sizes[v];
+      B === "center" ? ve -= (o.clientHeight - ge) / 2 : B === "end" && (ve -= o.clientHeight - ge);
+      const Te = Math.max(
         0,
-        Math.min(J, O.value - l.clientHeight)
-      ), fe = ee.behavior ?? "auto";
-      fe === "auto" && (S.value = de), l.scrollTo({
-        ...ee,
-        top: de,
-        behavior: fe
+        Math.min(ve, D.value - o.clientHeight)
+      ), be = he.behavior ?? "auto";
+      be === "auto" && (z.value = Te), o.scrollTo({
+        ...he,
+        top: Te,
+        behavior: be
       });
     }
-    function se(a = "auto") {
+    function R(n = "auto") {
       var t;
-      (t = M.value) == null || t.scrollTo({ top: 0, behavior: a });
+      (t = I.value) == null || t.scrollTo({ top: 0, behavior: n });
     }
-    return Z(
+    return ee(
       () => e.itemKey,
       () => {
-        _.clear(), Y.value += 1;
+        Z.clear(), W.value += 1;
       }
-    ), Z(
+    ), ee(
       () => e.items.length,
       async () => {
-        const a = new Set(
-          e.items.map((i, d) => q(i, d))
+        const n = new Set(
+          e.items.map((v, B) => Q(v, B))
         );
-        for (const i of _.keys())
-          a.has(i) || _.delete(i);
-        Y.value += 1, await I();
-        const t = M.value;
+        for (const v of Z.keys())
+          n.has(v) || Z.delete(v);
+        W.value += 1, await O();
+        const t = I.value;
         if (!t) return;
-        const l = Math.max(0, O.value - t.clientHeight);
-        t.scrollTop > l && (t.scrollTop = l, S.value = l), y();
+        const o = Math.max(0, D.value - t.clientHeight);
+        t.scrollTop > o && (t.scrollTop = o, z.value = o), $();
       }
-    ), Z(
+    ), ee(
       () => [e.hasMore, e.loading],
-      async ([a]) => {
-        a || (Q = -1), await I(), y();
+      async ([n]) => {
+        n || (J = -1), await O(), $();
       }
-    ), pe(() => {
-      if (ne(), typeof ResizeObserver < "u") {
-        K = new ResizeObserver(ne), z = new ResizeObserver(c), M.value && K.observe(M.value);
-        for (const [a] of ae)
-          z.observe(a);
+    ), Se(() => {
+      if (de(), typeof ResizeObserver < "u") {
+        Y = new ResizeObserver(de), L = new ResizeObserver(u), I.value && Y.observe(I.value);
+        for (const [n] of te)
+          L.observe(n);
       }
-      I(y);
-    }), Se(E), ye(() => {
-      K && (K.disconnect(), K = void 0), z && (z.disconnect(), z = void 0), ae.clear();
-    }), W({
-      scrollTo: $,
-      scrollToIndex: j,
-      scrollToTop: se
-    }), (a, t) => (x(), T("div", {
+      O($);
+    }), Ce(E), Ie(() => {
+      Y && (Y.disconnect(), Y = void 0), L && (L.disconnect(), L = void 0), te.clear();
+    }), j({
+      scrollTo: P,
+      scrollToIndex: S,
+      scrollToTop: R
+    }), (n, t) => (w(), x("div", {
       ref_key: "viewport",
-      ref: M,
-      class: Ie(["vue-dynamic-virtual-scroll", { "vue-dynamic-virtual-scroll--pulling": v(g) }]),
-      style: R(G.value),
+      ref: I,
+      class: He(["vue-dynamic-virtual-scroll", { "vue-dynamic-virtual-scroll--pulling": r(f) }]),
+      style: C(re.value),
       role: "list",
-      "aria-label": n.ariaLabel,
+      "aria-label": a.ariaLabel,
       tabindex: "0",
-      onScrollPassive: p,
+      onScrollPassive: h,
       onTouchstartPassive: t[0] || (t[0] = //@ts-ignore
-      (...l) => v(L) && v(L)(...l)),
+      (...o) => r(G) && r(G)(...o)),
       onTouchmove: t[1] || (t[1] = //@ts-ignore
-      (...l) => v(A) && v(A)(...l)),
+      (...o) => r(q) && r(q)(...o)),
       onTouchend: t[2] || (t[2] = //@ts-ignore
-      (...l) => v(h) && v(h)(...l)),
+      (...o) => r(y) && r(y)(...o)),
       onTouchcancel: t[3] || (t[3] = //@ts-ignore
-      (...l) => v(V) && v(V)(...l))
+      (...o) => r(k) && r(k)(...o))
     }, [
-      n.pullToRefresh || n.refreshing ? (x(), T("div", {
+      a.pullToRefresh || a.refreshing ? (w(), x("div", {
         key: 0,
         class: "vue-dynamic-virtual-scroll__refresh",
-        style: R({
-          height: `${v(C)}px`,
-          transform: `translateY(${v(r) - v(C)}px)`
+        style: C({
+          height: `${r(F)}px`,
+          transform: `translateY(${r(s) - r(F)}px)`
         }),
         role: "status",
         "aria-live": "polite"
       }, [
-        te(a.$slots, "refresh", {
-          pullDistance: v(b),
-          progress: v(H),
-          refreshing: n.refreshing
+        ne(n.$slots, "refresh", {
+          pullDistance: r(T),
+          progress: r(V),
+          refreshing: a.refreshing
         }, () => [
-          he(ze(v(N)), 1)
+          Me(Ee(r(_)), 1)
         ])
-      ], 4)) : ve("", !0),
-      n.items.length || n.loading ? (x(), T("div", {
+      ], 4)) : me("", !0),
+      a.items.length || a.loading ? (w(), x("div", {
         key: 1,
         class: "vue-dynamic-virtual-scroll__spacer",
-        style: R({
-          height: `${O.value}px`,
-          transform: `translateY(${v(r)}px)`
+        style: C({
+          height: `${D.value}px`,
+          transform: `translateY(${r(s)}px)`
         })
       }, [
-        (x(!0), T(me, null, Me(ce.value, ({ item: l, index: i, key: d, top: ee }) => (x(), T("div", {
-          key: d,
+        (w(!0), x(we, null, ze(ie.value, ({ item: o, index: v, key: B, top: he }) => (w(), x("div", {
+          key: B,
           ref_for: !0,
-          ref: (J) => u(J, d),
+          ref: (ve) => c(ve, B),
           class: "vue-dynamic-virtual-scroll__item",
-          style: R({ transform: `translateY(${ee}px)` }),
+          style: C({ transform: `translateY(${he}px)` }),
           role: "listitem",
-          "aria-posinset": i + 1,
-          "aria-setsize": n.items.length
+          "aria-posinset": v + 1,
+          "aria-setsize": a.items.length
         }, [
-          te(a.$slots, "default", {
-            item: l,
-            index: i
+          ne(n.$slots, "default", {
+            item: o,
+            index: v
           })
-        ], 12, Ce))), 128)),
-        n.loading ? (x(), T("div", {
+        ], 12, Ue))), 128)),
+        a.loading ? (w(), x("div", {
           key: 0,
           class: "vue-dynamic-virtual-scroll__loading",
-          style: R({
-            height: `${ie.value}px`,
-            transform: `translateY(${m.value.total}px)`
+          style: C({
+            height: `${ue.value}px`,
+            transform: `translateY(${p.value.total}px)`
           }),
           role: "status",
           "aria-live": "polite"
         }, [
-          te(a.$slots, "loading", {}, () => [
-            t[4] || (t[4] = he("Loading more…", -1))
+          ne(n.$slots, "loading", {}, () => [
+            t[4] || (t[4] = Me("Loading more…", -1))
           ])
-        ], 4)) : ve("", !0)
-      ], 4)) : (x(), T("div", {
+        ], 4)) : me("", !0)
+      ], 4)) : (w(), x("div", {
         key: 2,
         class: "vue-dynamic-virtual-scroll__empty",
-        style: R({ transform: `translateY(${v(r)}px)` })
+        style: C({ transform: `translateY(${r(s)}px)` })
       }, [
-        te(a.$slots, "empty")
+        ne(n.$slots, "empty")
       ], 4))
-    ], 46, Re));
+    ], 46, Ge));
   }
-}), De = ["aria-label"], Pe = ["aria-current", "aria-posinset", "aria-setsize"], Ae = {
+}), je = ["aria-label"], Ze = ["aria-current", "aria-posinset", "aria-setsize"], qe = {
   key: 1,
   class: "vue-short-media-feed__empty"
-}, Ne = /* @__PURE__ */ ge({
+}, Je = /* @__PURE__ */ xe({
   name: "ShortMediaFeed",
   __name: "ShortMediaFeed",
   props: {
@@ -678,162 +678,195 @@ const Re = ["aria-label"], Ce = ["aria-posinset", "aria-setsize"], He = /* @__PU
     loadMoreThreshold: { default: 2 }
   },
   emits: ["update:activeIndex", "change", "reachStart", "reachEnd", "loadMore"],
-  setup(n, { expose: W, emit: k }) {
-    const e = n, w = k, g = D(), b = D(0), r = D(K(e.activeIndex));
-    let H, N = -1;
-    const C = we(), { getItemKey: L } = xe({
+  setup(a, { expose: j, emit: H }) {
+    const e = a, g = H, f = N(), T = N(0), s = N(Y(e.activeIndex));
+    let V, _ = -1;
+    const F = Re(), { getItemKey: G } = $e({
       componentName: "ShortMediaFeed",
       items: () => e.items,
       itemKey: () => e.itemKey
-    }), A = s(
+    }), q = i(
       () => Math.max(0, Math.floor(e.buffer))
-    ), h = s(
+    ), y = i(
       () => Math.max(
         0,
         Math.floor(
           Number.isFinite(e.loadMoreThreshold) ? e.loadMoreThreshold : 0
         )
       )
-    ), V = s(() => b.value > 0 ? b.value : typeof e.height == "number" ? Math.max(1, e.height) : 0), M = s(
-      () => Math.max(0, r.value - A.value)
-    ), S = s(
+    ), k = i(() => T.value > 0 ? T.value : typeof e.height == "number" ? Math.max(1, e.height) : 0), I = i(
+      () => Math.max(0, s.value - q.value)
+    ), z = i(
       () => Math.min(
         e.items.length,
-        r.value + A.value + 1
+        s.value + q.value + 1
       )
-    ), P = s(
-      () => e.items.slice(M.value, S.value).map((f, m) => ({
-        item: f,
-        index: M.value + m
+    ), A = i(
+      () => e.items.slice(I.value, z.value).map((m, p) => ({
+        item: m,
+        index: I.value + p
       }))
-    ), Y = s(() => M.value * V.value), _ = s(
-      () => (e.items.length - S.value) * V.value
-    ), ae = s(() => ({
-      height: Te(e.height)
+    ), W = i(() => I.value * k.value), Z = i(
+      () => (e.items.length - z.value) * k.value
+    ), te = i(() => ({
+      height: Ve(e.height)
     }));
-    function K(f) {
+    function Y(m) {
       return e.items.length === 0 ? 0 : Math.min(
         e.items.length - 1,
-        Math.max(0, Math.floor(Number.isFinite(f) ? f : 0))
+        Math.max(0, Math.floor(Number.isFinite(m) ? m : 0))
       );
     }
-    function z() {
-      if (!e.hasMore || e.loading || N === e.items.length)
+    function L() {
+      if (!e.hasMore || e.loading || _ === e.items.length)
         return;
-      (e.items.length === 0 ? 0 : e.items.length - 1 - r.value) <= h.value && (N = e.items.length, w("loadMore"));
+      (e.items.length === 0 ? 0 : e.items.length - 1 - s.value) <= y.value && (_ = e.items.length, g("loadMore"));
     }
-    function Q(f) {
-      const m = K(f);
-      m === r.value || e.items.length === 0 || (r.value = m, w("update:activeIndex", m), w("change", {
-        index: m,
-        item: e.items[m]
-      }), m === 0 && w("reachStart"), m === e.items.length - 1 && w("reachEnd"), z());
+    function J(m) {
+      const p = Y(m);
+      p === s.value || e.items.length === 0 || (s.value = p, g("update:activeIndex", p), g("change", {
+        index: p,
+        item: e.items[p]
+      }), p === 0 && g("reachStart"), p === e.items.length - 1 && g("reachEnd"), L());
     }
-    function B(f, m = {}) {
-      const O = g.value;
-      O && (typeof O.scrollTo == "function" ? O.scrollTo({ ...m, top: f }) : O.scrollTop = f);
+    function K(m, p = {}) {
+      const D = f.value;
+      D && (typeof D.scrollTo == "function" ? D.scrollTo({ ...p, top: m }) : D.scrollTop = m);
     }
-    function q(f, m = {}) {
+    function Q(m, p = {}) {
       if (e.items.length === 0) return;
-      const O = K(f);
-      Q(O), B(O * V.value, m);
-    }
-    function U(f) {
-      if (V.value <= 0) return;
-      const m = f.currentTarget.scrollTop;
-      Q(Math.round(m / V.value));
-    }
-    function ie(f) {
-      let m;
-      f.key === "ArrowDown" || f.key === "PageDown" ? m = r.value + 1 : f.key === "ArrowUp" || f.key === "PageUp" ? m = r.value - 1 : f.key === "Home" ? m = 0 : f.key === "End" && (m = e.items.length - 1), m !== void 0 && (f.preventDefault(), q(m, { behavior: "smooth" }));
-    }
-    function F() {
-      var m;
-      const f = ((m = g.value) == null ? void 0 : m.clientHeight) ?? 0;
-      C(g.value, e.height), !(f <= 0 || f === b.value) && (b.value = f, I(() => {
-        B(r.value * f);
+      const D = Y(m);
+      J(D), K(D * k.value, p);
+    }
+    function le(m) {
+      if (k.value <= 0) return;
+      const p = m.currentTarget.scrollTop;
+      J(Math.round(p / k.value));
+    }
+    function ue(m) {
+      let p;
+      m.key === "ArrowDown" || m.key === "PageDown" ? p = s.value + 1 : m.key === "ArrowUp" || m.key === "PageUp" ? p = s.value - 1 : m.key === "Home" ? p = 0 : m.key === "End" && (p = e.items.length - 1), p !== void 0 && (m.preventDefault(), Q(p, { behavior: "smooth" }));
+    }
+    function U() {
+      var p;
+      const m = ((p = f.value) == null ? void 0 : p.clientHeight) ?? 0;
+      F(f.value, e.height), !(m <= 0 || m === T.value) && (T.value = m, O(() => {
+        K(s.value * m);
       }));
     }
-    return Z(
+    return ee(
       () => e.activeIndex,
-      async (f) => {
-        const m = K(f);
-        m !== r.value && (r.value = m, await I(), B(m * V.value), z());
+      async (m) => {
+        const p = Y(m);
+        p !== s.value && (s.value = p, await O(), K(p * k.value), L());
       }
-    ), Z(
+    ), ee(
       () => [
         e.hasMore,
         e.loading,
         e.loadMoreThreshold
       ],
-      async ([f]) => {
-        f || (N = -1), await I(), z();
+      async ([m]) => {
+        m || (_ = -1), await O(), L();
       }
-    ), Z(
+    ), ee(
       () => e.items.length,
       async () => {
-        const f = K(r.value);
-        e.items.length === 0 ? r.value !== 0 && (r.value = 0, w("update:activeIndex", 0)) : Q(f), await I(), B(f * V.value), z();
+        const m = Y(s.value);
+        e.items.length === 0 ? s.value !== 0 && (s.value = 0, g("update:activeIndex", 0)) : J(m), await O(), K(m * k.value), L();
       }
-    ), pe(async () => {
-      F(), typeof ResizeObserver < "u" && g.value && (H = new ResizeObserver(F), H.observe(g.value)), await I(), B(r.value * V.value), z();
-    }), ye(() => {
-      H && (H.disconnect(), H = void 0);
-    }), W({
-      scrollToIndex: q
-    }), (f, m) => (x(), T("div", {
+    ), Se(async () => {
+      U(), typeof ResizeObserver < "u" && f.value && (V = new ResizeObserver(U), V.observe(f.value)), await O(), K(s.value * k.value), L();
+    }), Ie(() => {
+      V && (V.disconnect(), V = void 0);
+    }), j({
+      scrollToIndex: Q
+    }), (m, p) => (w(), x("div", {
       ref_key: "viewport",
-      ref: g,
+      ref: f,
       class: "vue-short-media-feed",
-      style: R(ae.value),
+      style: C(te.value),
       role: "list",
       "aria-orientation": "vertical",
-      "aria-label": n.ariaLabel,
+      "aria-label": a.ariaLabel,
       tabindex: "0",
-      onScrollPassive: U,
-      onKeydown: ie
+      onScrollPassive: le,
+      onKeydown: ue
     }, [
-      n.items.length ? (x(), T(me, { key: 0 }, [
-        Y.value > 0 ? (x(), T("div", {
+      a.items.length ? (w(), x(we, { key: 0 }, [
+        W.value > 0 ? (w(), x("div", {
           key: 0,
           class: "vue-short-media-feed__spacer",
-          style: R({ height: `${Y.value}px` }),
+          style: C({ height: `${W.value}px` }),
           "aria-hidden": "true"
-        }, null, 4)) : ve("", !0),
-        (x(!0), T(me, null, Me(P.value, ({ item: O, index: oe }) => (x(), T("div", {
-          key: v(L)(O, oe),
+        }, null, 4)) : me("", !0),
+        (w(!0), x(we, null, ze(A.value, ({ item: D, index: se }) => (w(), x("div", {
+          key: r(G)(D, se),
           class: "vue-short-media-feed__item",
-          style: R({ height: `${V.value}px` }),
+          style: C({ height: `${k.value}px` }),
           role: "listitem",
-          "aria-current": oe === r.value ? "true" : void 0,
-          "aria-posinset": oe + 1,
-          "aria-setsize": n.items.length
+          "aria-current": se === s.value ? "true" : void 0,
+          "aria-posinset": se + 1,
+          "aria-setsize": a.items.length
         }, [
-          te(f.$slots, "default", {
-            item: O,
-            index: oe,
-            active: oe === r.value
+          ne(m.$slots, "default", {
+            item: D,
+            index: se,
+            active: se === s.value
           })
-        ], 12, Pe))), 128)),
-        _.value > 0 ? (x(), T("div", {
+        ], 12, Ze))), 128)),
+        Z.value > 0 ? (w(), x("div", {
           key: 1,
           class: "vue-short-media-feed__spacer",
-          style: R({ height: `${_.value}px` }),
+          style: C({ height: `${Z.value}px` }),
           "aria-hidden": "true"
-        }, null, 4)) : ve("", !0)
-      ], 64)) : (x(), T("div", Ae, [
-        te(f.$slots, "empty")
+        }, null, 4)) : me("", !0)
+      ], 64)) : (w(), x("div", qe, [
+        ne(m.$slots, "empty")
       ]))
-    ], 44, De));
+    ], 44, je));
+  }
+}), Qe = ["aria-label"], Xe = /* @__PURE__ */ xe({
+  __name: "SkeletonLoader",
+  props: {
+    width: { default: "100%" },
+    height: { default: 16 },
+    variant: { default: "rounded" },
+    animated: { type: Boolean, default: !0 },
+    ariaLabel: { default: "Loading…" }
+  },
+  setup(a) {
+    const j = a;
+    function H(g) {
+      return typeof g == "number" ? `${Math.max(0, g)}px` : g;
+    }
+    const e = i(() => ({
+      width: H(j.width),
+      height: H(j.height)
+    }));
+    return (g, f) => (w(), x("div", {
+      class: He(["vue-skeleton-loader", [
+        `vue-skeleton-loader--${a.variant}`,
+        { "vue-skeleton-loader--animated": a.animated }
+      ]]),
+      style: C(e.value),
+      role: "status",
+      "aria-label": a.ariaLabel
+    }, null, 14, Qe));
   }
-}), Ye = ["aria-label"], Fe = {
+}), et = (a, j) => {
+  const H = a.__vccOpts || a;
+  for (const [e, g] of j)
+    H[e] = g;
+  return H;
+}, tt = /* @__PURE__ */ et(Xe, [["__scopeId", "data-v-fc92f61f"]]), lt = ["aria-label"], at = {
   key: 0,
   class: "vue-virtual-carousel__track",
   role: "list"
-}, We = ["aria-label", "aria-current"], _e = {
+}, ot = ["aria-label", "aria-current"], nt = {
   key: 1,
   class: "vue-virtual-carousel__empty"
-}, Ue = /* @__PURE__ */ ge({
+}, it = /* @__PURE__ */ xe({
   name: "VirtualCarousel",
   __name: "VirtualCarousel",
   props: {
@@ -856,307 +889,307 @@ const Re = ["aria-label"], Ce = ["aria-posinset", "aria-setsize"], He = /* @__PU
     responsive: { default: void 0 }
   },
   emits: ["update:activeIndex", "change", "reachStart", "reachEnd", "loadMore"],
-  setup(n, { expose: W, emit: k }) {
-    const e = n, w = k, g = D(), b = D(0), r = D(0);
-    let H, N = -1, C, L, A = !1;
-    const h = D(!1), { getItemKey: V } = xe({
+  setup(a, { expose: j, emit: H }) {
+    const e = a, g = H, f = N(), T = N(0), s = N(0);
+    let V, _ = -1, F, G, q = !1;
+    const y = N(!1), { getItemKey: k } = $e({
       componentName: "VirtualCarousel",
       items: () => e.items,
       itemKey: () => e.itemKey
-    }), M = s(() => Math.max(0, b.value)), S = s(() => {
+    }), I = i(() => Math.max(0, T.value)), z = i(() => {
       if (!e.responsive || e.responsive.length === 0)
         return {
           slidesPerView: e.slidesPerView,
           slidesToScroll: e.slidesToScroll,
           gap: e.gap
         };
-      const t = M.value, l = [...e.responsive].sort(
-        (i, d) => d.breakpoint - i.breakpoint
+      const t = I.value, o = [...e.responsive].sort(
+        (v, B) => B.breakpoint - v.breakpoint
       );
-      for (const i of l)
-        if (t >= i.breakpoint)
+      for (const v of o)
+        if (t >= v.breakpoint)
           return {
-            slidesPerView: i.slidesPerView ?? e.slidesPerView,
-            slidesToScroll: i.slidesToScroll ?? e.slidesToScroll,
-            gap: i.gap ?? e.gap
+            slidesPerView: v.slidesPerView ?? e.slidesPerView,
+            slidesToScroll: v.slidesToScroll ?? e.slidesToScroll,
+            gap: v.gap ?? e.gap
           };
       return {
         slidesPerView: e.slidesPerView,
         slidesToScroll: e.slidesToScroll,
         gap: e.gap
       };
-    }), P = s(
+    }), A = i(
       () => Math.max(
         1,
         Math.floor(
-          Number.isFinite(S.value.slidesPerView) ? S.value.slidesPerView : 1
+          Number.isFinite(z.value.slidesPerView) ? z.value.slidesPerView : 1
         )
       )
-    ), Y = s(
+    ), W = i(
       () => Math.max(
         1,
         Math.floor(
-          Number.isFinite(S.value.slidesToScroll) ? S.value.slidesToScroll : 1
+          Number.isFinite(z.value.slidesToScroll) ? z.value.slidesToScroll : 1
         )
       )
-    ), _ = s(
-      () => Math.max(0, Number.isFinite(S.value.gap) ? S.value.gap : 0)
-    ), ae = s(
+    ), Z = i(
+      () => Math.max(0, Number.isFinite(z.value.gap) ? z.value.gap : 0)
+    ), te = i(
       () => Math.max(
         0,
         Math.floor(Number.isFinite(e.buffer) ? e.buffer : 0)
       )
-    ), K = s(
+    ), Y = i(
       () => Math.max(
         0,
         Math.floor(
           Number.isFinite(e.loadMoreThreshold) ? e.loadMoreThreshold : 0
         )
       )
-    ), z = s(() => Number.isFinite(e.autoplayDelay) ? Math.max(1, e.autoplayDelay) : 3e3), Q = s(() => {
-      if (M.value <= 0) return 0;
-      const t = (P.value - 1) * _.value;
+    ), L = i(() => Number.isFinite(e.autoplayDelay) ? Math.max(1, e.autoplayDelay) : 3e3), J = i(() => {
+      if (I.value <= 0) return 0;
+      const t = (A.value - 1) * Z.value;
       return Math.max(
         1,
-        (M.value - t) / P.value
+        (I.value - t) / A.value
       );
-    }), B = s(() => Q.value + _.value), q = s(
+    }), K = i(() => J.value + Z.value), Q = i(
       () => Math.max(
         0,
-        e.items.length - P.value
+        e.items.length - A.value
       )
-    ), U = s(
-      () => Math.max(0, r.value - ae.value)
-    ), ie = s(
+    ), le = i(
+      () => Math.max(0, s.value - te.value)
+    ), ue = i(
       () => Math.min(
         e.items.length,
-        r.value + P.value + ae.value
+        s.value + A.value + te.value
       )
-    ), F = s(
-      () => e.items.slice(U.value, ie.value).map((t, l) => ({
+    ), U = i(
+      () => e.items.slice(le.value, ue.value).map((t, o) => ({
         item: t,
-        index: U.value + l
+        index: le.value + o
       }))
-    ), f = s(() => e.items.length === 0 ? 0 : e.items.length * Q.value + (e.items.length - 1) * _.value), m = s(
-      () => U.value * B.value
-    ), O = s(
+    ), m = i(() => e.items.length === 0 ? 0 : e.items.length * J.value + (e.items.length - 1) * Z.value), p = i(
+      () => le.value * K.value
+    ), D = i(
       () => Math.max(
         0,
-        f.value - ie.value * B.value
+        m.value - ue.value * K.value
       )
-    ), oe = s(() => ({
-      height: Te(e.height)
+    ), se = i(() => ({
+      height: Ve(e.height)
     }));
-    function le(t) {
+    function ae(t) {
       return Math.min(
-        q.value,
+        Q.value,
         Math.max(0, Math.floor(Number.isFinite(t) ? t : 0))
       );
     }
-    r.value = le(e.activeIndex);
-    function ue(t) {
-      return t >= r.value && t < Math.min(
+    s.value = ae(e.activeIndex);
+    function fe(t) {
+      return t >= s.value && t < Math.min(
         e.items.length,
-        r.value + P.value
+        s.value + A.value
       );
     }
-    function X() {
-      if (!e.hasMore || e.loading || N === e.items.length)
+    function oe() {
+      if (!e.hasMore || e.loading || _ === e.items.length)
         return;
       const t = e.items.length === 0 ? -1 : Math.min(
         e.items.length - 1,
-        r.value + P.value - 1
+        s.value + A.value - 1
       );
-      e.items.length - 1 - t <= K.value && (N = e.items.length, w("loadMore"));
-    }
-    function ce(t) {
-      const l = le(t);
-      l === r.value || e.items.length === 0 || (r.value = l, w("update:activeIndex", l), w("change", {
-        index: l,
-        item: e.items[l]
-      }), l === 0 && w("reachStart"), l === q.value && w("reachEnd"), X(), e.autoplay && !h.value && o());
-    }
-    function G(t, l = {}) {
-      const i = g.value;
-      i && (typeof i.scrollTo == "function" ? i.scrollTo({ ...l, left: t }) : i.scrollLeft = t);
-    }
-    function ne(t, l = {}) {
-      if (e.items.length === 0 || B.value <= 0) return;
-      const i = le(t);
-      L = l.behavior === "smooth" ? i : void 0, ce(i), G(i * B.value, {
-        ...l,
-        behavior: l.behavior
+      e.items.length - 1 - t <= Y.value && (_ = e.items.length, g("loadMore"));
+    }
+    function ie(t) {
+      const o = ae(t);
+      o === s.value || e.items.length === 0 || (s.value = o, g("update:activeIndex", o), g("change", {
+        index: o,
+        item: e.items[o]
+      }), o === 0 && g("reachStart"), o === Q.value && g("reachEnd"), oe(), e.autoplay && !y.value && l());
+    }
+    function re(t, o = {}) {
+      const v = f.value;
+      v && (typeof v.scrollTo == "function" ? v.scrollTo({ ...o, left: t }) : v.scrollLeft = t);
+    }
+    function de(t, o = {}) {
+      if (e.items.length === 0 || K.value <= 0) return;
+      const v = ae(t);
+      G = o.behavior === "smooth" ? v : void 0, ie(v), re(v * K.value, {
+        ...o,
+        behavior: o.behavior
       });
     }
-    function p(t = "smooth") {
-      ne(
-        r.value + Y.value,
+    function h(t = "smooth") {
+      de(
+        s.value + W.value,
         { behavior: t }
       );
     }
-    function y(t = "smooth") {
-      ne(
-        r.value - Y.value,
+    function $(t = "smooth") {
+      de(
+        s.value - W.value,
         { behavior: t }
       );
     }
-    function o() {
-      c(), !(!e.autoplay || e.items.length === 0) && (C = setTimeout(() => {
-        r.value >= q.value ? e.autoplayLoop ? ne(0, { behavior: "smooth" }) : c() : p("smooth");
-      }, z.value));
-    }
-    function c() {
-      C !== void 0 && (clearTimeout(C), C = void 0);
+    function l() {
+      u(), !(!e.autoplay || e.items.length === 0) && (F = setTimeout(() => {
+        s.value >= Q.value ? e.autoplayLoop ? de(0, { behavior: "smooth" }) : u() : h("smooth");
+      }, L.value));
     }
     function u() {
-      h.value = !0, e.pauseOnHover && c();
+      F !== void 0 && (clearTimeout(F), F = void 0);
     }
-    function E() {
-      h.value = !1, e.autoplay && o();
+    function c() {
+      y.value = !0, e.pauseOnHover && u();
     }
-    function $() {
-      L = void 0;
-    }
-    function j(t) {
-      if (B.value <= 0 || A) return;
-      const l = t.currentTarget.scrollLeft;
-      if (L !== void 0) {
-        const i = L * B.value;
-        if (Math.abs(l - i) > 1) return;
-        L = void 0;
+    function E() {
+      y.value = !1, e.autoplay && l();
+    }
+    function P() {
+      G = void 0;
+    }
+    function S(t) {
+      if (K.value <= 0 || q) return;
+      const o = t.currentTarget.scrollLeft;
+      if (G !== void 0) {
+        const v = G * K.value;
+        if (Math.abs(o - v) > 1) return;
+        G = void 0;
       }
-      ce(Math.round(l / B.value));
+      ie(Math.round(o / K.value));
     }
-    function se(t) {
-      t.key === "ArrowRight" || t.key === "PageDown" ? (t.preventDefault(), p()) : t.key === "ArrowLeft" || t.key === "PageUp" ? (t.preventDefault(), y()) : t.key === "Home" ? (t.preventDefault(), ne(0, { behavior: "smooth" })) : t.key === "End" && (t.preventDefault(), ne(q.value, { behavior: "auto" }));
+    function R(t) {
+      t.key === "ArrowRight" || t.key === "PageDown" ? (t.preventDefault(), h()) : t.key === "ArrowLeft" || t.key === "PageUp" ? (t.preventDefault(), $()) : t.key === "Home" ? (t.preventDefault(), de(0, { behavior: "smooth" })) : t.key === "End" && (t.preventDefault(), de(Q.value, { behavior: "auto" }));
     }
-    function a() {
-      var l;
-      const t = ((l = g.value) == null ? void 0 : l.clientWidth) ?? 0;
-      t <= 0 || t === b.value || (A = !0, b.value = t, I(() => {
-        const i = le(r.value);
-        G(i * B.value), A = !1;
+    function n() {
+      var o;
+      const t = ((o = f.value) == null ? void 0 : o.clientWidth) ?? 0;
+      t <= 0 || t === T.value || (q = !0, T.value = t, O(() => {
+        const v = ae(s.value);
+        re(v * K.value), q = !1;
       }));
     }
-    return Z(
+    return ee(
       () => e.activeIndex,
       async (t) => {
-        const l = le(t);
-        l !== r.value && ($(), r.value = l, await I(), G(l * B.value), X());
+        const o = ae(t);
+        o !== s.value && (P(), s.value = o, await O(), re(o * K.value), oe());
       }
-    ), Z(
+    ), ee(
       () => [
         e.items.length,
-        S.value.slidesPerView,
-        S.value.gap,
-        S.value.slidesToScroll
+        z.value.slidesPerView,
+        z.value.gap,
+        z.value.slidesToScroll
       ],
       async () => {
-        const t = le(r.value);
-        e.items.length === 0 ? r.value !== 0 && (r.value = 0, w("update:activeIndex", 0)) : ce(t), await I(), G(t * B.value), X(), e.autoplay && e.items.length > 0 && !h.value && o();
+        const t = ae(s.value);
+        e.items.length === 0 ? s.value !== 0 && (s.value = 0, g("update:activeIndex", 0)) : ie(t), await O(), re(t * K.value), oe(), e.autoplay && e.items.length > 0 && !y.value && l();
       }
-    ), Z(
+    ), ee(
       () => e.responsive,
       () => {
-        I(() => {
-          const t = le(r.value);
-          G(t * B.value);
+        O(() => {
+          const t = ae(s.value);
+          re(t * K.value);
         });
       },
       { deep: !0 }
-    ), Z(
+    ), ee(
       () => [
         e.hasMore,
         e.loading,
         e.loadMoreThreshold
       ],
       async ([t]) => {
-        t || (N = -1), await I(), X();
+        t || (_ = -1), await O(), oe();
       }
-    ), Z(
+    ), ee(
       () => e.autoplay,
       (t) => {
-        t && !h.value ? o() : c();
+        t && !y.value ? l() : u();
       }
-    ), Z(
+    ), ee(
       () => e.autoplayDelay,
       () => {
-        e.autoplay && !h.value && o();
+        e.autoplay && !y.value && l();
       }
-    ), Z(
+    ), ee(
       () => e.autoplayLoop,
       (t) => {
-        !e.autoplay || h.value || (!t && r.value >= q.value ? c() : o());
+        !e.autoplay || y.value || (!t && s.value >= Q.value ? u() : l());
       }
-    ), Z(
+    ), ee(
       () => e.pauseOnHover,
       (t) => {
-        t && h.value ? c() : !t && e.autoplay && o();
+        t && y.value ? u() : !t && e.autoplay && l();
       }
-    ), pe(async () => {
-      a(), typeof ResizeObserver < "u" && g.value && (H = new ResizeObserver(a), H.observe(g.value)), await I(), G(r.value * B.value), X(), e.autoplay && o();
-    }), ye(() => {
-      H && (H.disconnect(), H = void 0), c();
-    }), W({
-      next: p,
-      previous: y,
-      scrollToIndex: ne,
-      startAutoplay: o,
-      stopAutoplay: c
-    }), (t, l) => (x(), T("div", {
+    ), Se(async () => {
+      n(), typeof ResizeObserver < "u" && f.value && (V = new ResizeObserver(n), V.observe(f.value)), await O(), re(s.value * K.value), oe(), e.autoplay && l();
+    }), Ie(() => {
+      V && (V.disconnect(), V = void 0), u();
+    }), j({
+      next: h,
+      previous: $,
+      scrollToIndex: de,
+      startAutoplay: l,
+      stopAutoplay: u
+    }), (t, o) => (w(), x("div", {
       ref_key: "viewport",
-      ref: g,
+      ref: f,
       class: "vue-virtual-carousel",
-      style: R(oe.value),
+      style: C(se.value),
       role: "region",
       "aria-roledescription": "carousel",
-      "aria-label": n.ariaLabel,
+      "aria-label": a.ariaLabel,
       tabindex: "0",
-      onScrollPassive: j,
-      onPointerdown: $,
-      onWheelPassive: $,
-      onKeydown: se,
-      onMouseenter: u,
+      onScrollPassive: S,
+      onPointerdown: P,
+      onWheelPassive: P,
+      onKeydown: R,
+      onMouseenter: c,
       onMouseleave: E
     }, [
-      n.items.length ? (x(), T("div", Fe, [
-        m.value > 0 ? (x(), T("div", {
+      a.items.length ? (w(), x("div", at, [
+        p.value > 0 ? (w(), x("div", {
           key: 0,
           class: "vue-virtual-carousel__spacer",
-          style: R({ flexBasis: `${m.value}px` }),
+          style: C({ flexBasis: `${p.value}px` }),
           "aria-hidden": "true"
-        }, null, 4)) : ve("", !0),
-        (x(!0), T(me, null, Me(F.value, ({ item: i, index: d }) => (x(), T("div", {
-          key: v(V)(i, d),
+        }, null, 4)) : me("", !0),
+        (w(!0), x(we, null, ze(U.value, ({ item: v, index: B }) => (w(), x("div", {
+          key: r(k)(v, B),
           class: "vue-virtual-carousel__item",
-          style: R({
-            flexBasis: `${Q.value}px`,
-            marginRight: d < n.items.length - 1 ? `${_.value}px` : "0px"
+          style: C({
+            flexBasis: `${J.value}px`,
+            marginRight: B < a.items.length - 1 ? `${Z.value}px` : "0px"
           }),
           role: "listitem",
           "aria-roledescription": "slide",
-          "aria-label": `${d + 1} of ${n.items.length}`,
-          "aria-current": d === r.value ? "true" : void 0
+          "aria-label": `${B + 1} of ${a.items.length}`,
+          "aria-current": B === s.value ? "true" : void 0
         }, [
-          te(t.$slots, "default", {
-            item: i,
-            index: d,
-            active: d === r.value,
-            visible: ue(d)
+          ne(t.$slots, "default", {
+            item: v,
+            index: B,
+            active: B === s.value,
+            visible: fe(B)
           })
-        ], 12, We))), 128)),
-        O.value > 0 ? (x(), T("div", {
+        ], 12, ot))), 128)),
+        D.value > 0 ? (w(), x("div", {
           key: 1,
           class: "vue-virtual-carousel__spacer",
-          style: R({ flexBasis: `${O.value}px` }),
+          style: C({ flexBasis: `${D.value}px` }),
           "aria-hidden": "true"
-        }, null, 4)) : ve("", !0)
-      ])) : (x(), T("div", _e, [
-        te(t.$slots, "empty")
+        }, null, 4)) : me("", !0)
+      ])) : (w(), x("div", nt, [
+        ne(t.$slots, "empty")
       ]))
-    ], 44, Ye));
+    ], 44, lt));
   }
-}), je = ["aria-label"], Ze = ["aria-posinset", "aria-setsize"], qe = /* @__PURE__ */ ge({
+}), st = ["aria-label"], rt = ["aria-posinset", "aria-setsize"], ut = /* @__PURE__ */ xe({
   name: "VirtualScroll",
   __name: "VirtualScroll",
   props: {
@@ -1175,210 +1208,210 @@ const Re = ["aria-label"], Ce = ["aria-posinset", "aria-setsize"], He = /* @__PU
     pullRefreshThreshold: { default: 64 }
   },
   emits: ["scroll", "loadMore", "refresh"],
-  setup(n, { expose: W, emit: k }) {
-    const e = n, w = k, {
-      pulling: g,
-      pullDistance: b,
-      pullOffset: r,
-      pullProgress: H,
-      refreshMessage: N,
-      refreshThreshold: C,
-      handleTouchStart: L,
-      handleTouchMove: A,
-      handleTouchEnd: h,
-      handleTouchCancel: V
-    } = ke({
+  setup(a, { expose: j, emit: H }) {
+    const e = a, g = H, {
+      pulling: f,
+      pullDistance: T,
+      pullOffset: s,
+      pullProgress: V,
+      refreshMessage: _,
+      refreshThreshold: F,
+      handleTouchStart: G,
+      handleTouchMove: q,
+      handleTouchEnd: y,
+      handleTouchCancel: k
+    } = Oe({
       enabled: () => e.pullToRefresh,
       refreshing: () => e.refreshing,
       threshold: () => e.pullRefreshThreshold,
-      onRefresh: () => w("refresh")
-    }), M = D(), S = D(0), P = D(0);
-    let Y, _ = -1;
-    const ae = we(), { getItemKey: K } = xe({
+      onRefresh: () => g("refresh")
+    }), I = N(), z = N(0), A = N(0);
+    let W, Z = -1;
+    const te = Re(), { getItemKey: Y } = $e({
       componentName: "VirtualScroll",
       items: () => e.items,
       itemKey: () => e.itemKey
-    }), z = s(() => Math.max(1, e.itemSize)), Q = s(() => Math.max(0, Math.floor(e.overscan))), B = s(
-      () => e.items.length * z.value
-    ), q = s(
-      () => Math.max(1, e.loadingItemSize ?? z.value)
-    ), U = s(
-      () => B.value + (e.loading ? q.value : 0)
-    ), ie = s(() => P.value > 0 ? P.value : typeof e.height == "number" ? e.height : 0), F = s(
+    }), L = i(() => Math.max(1, e.itemSize)), J = i(() => Math.max(0, Math.floor(e.overscan))), K = i(
+      () => e.items.length * L.value
+    ), Q = i(
+      () => Math.max(1, e.loadingItemSize ?? L.value)
+    ), le = i(
+      () => K.value + (e.loading ? Q.value : 0)
+    ), ue = i(() => A.value > 0 ? A.value : typeof e.height == "number" ? e.height : 0), U = i(
       () => Math.max(
         0,
-        Math.floor(S.value / z.value) - Q.value
+        Math.floor(z.value / L.value) - J.value
       )
-    ), f = s(() => {
-      const p = Math.ceil(
-        (S.value + ie.value) / z.value
+    ), m = i(() => {
+      const h = Math.ceil(
+        (z.value + ue.value) / L.value
       );
       return Math.min(
         e.items.length,
-        p + Q.value
+        h + J.value
       );
-    }), m = s(
-      () => e.items.slice(F.value, f.value).map((p, y) => ({
-        item: p,
-        index: F.value + y
+    }), p = i(
+      () => e.items.slice(U.value, m.value).map((h, $) => ({
+        item: h,
+        index: U.value + $
       }))
-    ), O = s(() => ({
-      height: Te(e.height)
-    })), oe = s(() => ({
-      transform: `translateY(${F.value * z.value}px)`
+    ), D = i(() => ({
+      height: Ve(e.height)
+    })), se = i(() => ({
+      transform: `translateY(${U.value * L.value}px)`
     }));
-    function le() {
-      var p;
-      P.value = ((p = M.value) == null ? void 0 : p.clientHeight) ?? 0, ae(M.value, e.height), I(X);
-    }
-    function ue(p) {
-      S.value = p.currentTarget.scrollTop, w("scroll", {
-        scrollTop: S.value,
-        startIndex: F.value,
-        endIndex: f.value
-      }), X();
-    }
-    function X() {
-      const p = M.value;
-      if (!p || !e.hasMore || e.loading || _ === e.items.length)
+    function ae() {
+      var h;
+      A.value = ((h = I.value) == null ? void 0 : h.clientHeight) ?? 0, te(I.value, e.height), O(oe);
+    }
+    function fe(h) {
+      z.value = h.currentTarget.scrollTop, g("scroll", {
+        scrollTop: z.value,
+        startIndex: U.value,
+        endIndex: m.value
+      }), oe();
+    }
+    function oe() {
+      const h = I.value;
+      if (!h || !e.hasMore || e.loading || Z === e.items.length)
         return;
-      const y = Math.max(0, e.loadMoreThreshold);
-      U.value - p.scrollTop - p.clientHeight <= y && (_ = e.items.length, w("loadMore"));
+      const $ = Math.max(0, e.loadMoreThreshold);
+      le.value - h.scrollTop - h.clientHeight <= $ && (Z = e.items.length, g("loadMore"));
     }
-    function ce(p, y = {}) {
-      const o = M.value;
-      if (!o) return;
-      const c = Math.max(0, U.value - o.clientHeight), u = Math.min(
-        Math.max(0, Number.isFinite(p) ? p : 0),
-        c
-      ), E = y.behavior ?? "auto";
-      E === "auto" && (S.value = u), o.scrollTo({ ...y, top: u, behavior: E });
-    }
-    function G(p, y = {}) {
-      const o = M.value;
-      if (!o || e.items.length === 0) return;
-      const c = Math.min(
+    function ie(h, $ = {}) {
+      const l = I.value;
+      if (!l) return;
+      const u = Math.max(0, le.value - l.clientHeight), c = Math.min(
+        Math.max(0, Number.isFinite(h) ? h : 0),
+        u
+      ), E = $.behavior ?? "auto";
+      E === "auto" && (z.value = c), l.scrollTo({ ...$, top: c, behavior: E });
+    }
+    function re(h, $ = {}) {
+      const l = I.value;
+      if (!l || e.items.length === 0) return;
+      const u = Math.min(
         e.items.length - 1,
-        Math.max(0, Math.floor(p))
-      ), { align: u = "start", ...E } = y;
-      let $ = c * z.value;
-      u === "center" ? $ -= (o.clientHeight - z.value) / 2 : u === "end" && ($ -= o.clientHeight - z.value), o.scrollTo({
+        Math.max(0, Math.floor(h))
+      ), { align: c = "start", ...E } = $;
+      let P = u * L.value;
+      c === "center" ? P -= (l.clientHeight - L.value) / 2 : c === "end" && (P -= l.clientHeight - L.value), l.scrollTo({
         ...E,
-        top: Math.max(0, Math.min($, U.value - o.clientHeight))
+        top: Math.max(0, Math.min(P, le.value - l.clientHeight))
       });
     }
-    function ne(p = "auto") {
-      var y;
-      (y = M.value) == null || y.scrollTo({ top: 0, behavior: p });
+    function de(h = "auto") {
+      var $;
+      ($ = I.value) == null || $.scrollTo({ top: 0, behavior: h });
     }
-    return Z(
+    return ee(
       () => [e.items.length, e.itemSize],
       async () => {
-        await I();
-        const p = M.value;
-        if (!p) return;
-        const y = Math.max(0, U.value - p.clientHeight);
-        p.scrollTop > y && (p.scrollTop = y, S.value = y), X();
+        await O();
+        const h = I.value;
+        if (!h) return;
+        const $ = Math.max(0, le.value - h.clientHeight);
+        h.scrollTop > $ && (h.scrollTop = $, z.value = $), oe();
       }
-    ), Z(
+    ), ee(
       () => [e.hasMore, e.loading],
-      async ([p]) => {
-        p || (_ = -1), await I(), X();
+      async ([h]) => {
+        h || (Z = -1), await O(), oe();
       }
-    ), pe(() => {
-      le(), typeof ResizeObserver < "u" && M.value && (Y = new ResizeObserver(le), Y.observe(M.value)), I(X);
-    }), ye(() => {
-      Y && (Y.disconnect(), Y = void 0);
-    }), W({
-      scrollTo: ce,
-      scrollToIndex: G,
-      scrollToTop: ne
-    }), (p, y) => (x(), T("div", {
+    ), Se(() => {
+      ae(), typeof ResizeObserver < "u" && I.value && (W = new ResizeObserver(ae), W.observe(I.value)), O(oe);
+    }), Ie(() => {
+      W && (W.disconnect(), W = void 0);
+    }), j({
+      scrollTo: ie,
+      scrollToIndex: re,
+      scrollToTop: de
+    }), (h, $) => (w(), x("div", {
       ref_key: "viewport",
-      ref: M,
-      class: Ie(["vue-virtual-scroll", { "vue-virtual-scroll--pulling": v(g) }]),
-      style: R(O.value),
+      ref: I,
+      class: He(["vue-virtual-scroll", { "vue-virtual-scroll--pulling": r(f) }]),
+      style: C(D.value),
       role: "list",
-      "aria-label": n.ariaLabel,
+      "aria-label": a.ariaLabel,
       tabindex: "0",
-      onScrollPassive: ue,
-      onTouchstartPassive: y[0] || (y[0] = //@ts-ignore
-      (...o) => v(L) && v(L)(...o)),
-      onTouchmove: y[1] || (y[1] = //@ts-ignore
-      (...o) => v(A) && v(A)(...o)),
-      onTouchend: y[2] || (y[2] = //@ts-ignore
-      (...o) => v(h) && v(h)(...o)),
-      onTouchcancel: y[3] || (y[3] = //@ts-ignore
-      (...o) => v(V) && v(V)(...o))
+      onScrollPassive: fe,
+      onTouchstartPassive: $[0] || ($[0] = //@ts-ignore
+      (...l) => r(G) && r(G)(...l)),
+      onTouchmove: $[1] || ($[1] = //@ts-ignore
+      (...l) => r(q) && r(q)(...l)),
+      onTouchend: $[2] || ($[2] = //@ts-ignore
+      (...l) => r(y) && r(y)(...l)),
+      onTouchcancel: $[3] || ($[3] = //@ts-ignore
+      (...l) => r(k) && r(k)(...l))
     }, [
-      n.pullToRefresh || n.refreshing ? (x(), T("div", {
+      a.pullToRefresh || a.refreshing ? (w(), x("div", {
         key: 0,
         class: "vue-virtual-scroll__refresh",
-        style: R({
-          height: `${v(C)}px`,
-          transform: `translateY(${v(r) - v(C)}px)`
+        style: C({
+          height: `${r(F)}px`,
+          transform: `translateY(${r(s) - r(F)}px)`
         }),
         role: "status",
         "aria-live": "polite"
       }, [
-        te(p.$slots, "refresh", {
-          pullDistance: v(b),
-          progress: v(H),
-          refreshing: n.refreshing
+        ne(h.$slots, "refresh", {
+          pullDistance: r(T),
+          progress: r(V),
+          refreshing: a.refreshing
         }, () => [
-          he(ze(v(N)), 1)
+          Me(Ee(r(_)), 1)
         ])
-      ], 4)) : ve("", !0),
-      n.items.length || n.loading ? (x(), T("div", {
+      ], 4)) : me("", !0),
+      a.items.length || a.loading ? (w(), x("div", {
         key: 1,
         class: "vue-virtual-scroll__spacer",
-        style: R({
-          height: `${U.value}px`,
-          transform: `translateY(${v(r)}px)`
+        style: C({
+          height: `${le.value}px`,
+          transform: `translateY(${r(s)}px)`
         })
       }, [
-        $e("div", {
+        De("div", {
           class: "vue-virtual-scroll__content",
-          style: R(oe.value)
+          style: C(se.value)
         }, [
-          (x(!0), T(me, null, Me(m.value, ({ item: o, index: c }) => (x(), T("div", {
-            key: v(K)(o, c),
+          (w(!0), x(we, null, ze(p.value, ({ item: l, index: u }) => (w(), x("div", {
+            key: r(Y)(l, u),
             class: "vue-virtual-scroll__item",
-            style: R({ height: `${z.value}px` }),
+            style: C({ height: `${L.value}px` }),
             role: "listitem",
-            "aria-posinset": c + 1,
-            "aria-setsize": n.items.length
+            "aria-posinset": u + 1,
+            "aria-setsize": a.items.length
           }, [
-            te(p.$slots, "default", {
-              item: o,
-              index: c
+            ne(h.$slots, "default", {
+              item: l,
+              index: u
             })
-          ], 12, Ze))), 128))
+          ], 12, rt))), 128))
         ], 4),
-        n.loading ? (x(), T("div", {
+        a.loading ? (w(), x("div", {
           key: 0,
           class: "vue-virtual-scroll__loading",
-          style: R({
-            height: `${q.value}px`,
-            transform: `translateY(${B.value}px)`
+          style: C({
+            height: `${Q.value}px`,
+            transform: `translateY(${K.value}px)`
           }),
           role: "status",
           "aria-live": "polite"
         }, [
-          te(p.$slots, "loading", {}, () => [
-            y[4] || (y[4] = he("Loading more…", -1))
+          ne(h.$slots, "loading", {}, () => [
+            $[4] || ($[4] = Me("Loading more…", -1))
           ])
-        ], 4)) : ve("", !0)
-      ], 4)) : (x(), T("div", {
+        ], 4)) : me("", !0)
+      ], 4)) : (w(), x("div", {
         key: 2,
         class: "vue-virtual-scroll__empty",
-        style: R({ transform: `translateY(${v(r)}px)` })
+        style: C({ transform: `translateY(${r(s)}px)` })
       }, [
-        te(p.$slots, "empty")
+        ne(h.$slots, "empty")
       ], 4))
-    ], 46, je));
+    ], 46, st));
   }
-}), Ge = ["aria-label"], Je = ["aria-posinset", "aria-setsize"], Qe = /* @__PURE__ */ ge({
+}), ct = ["aria-label"], dt = ["aria-posinset", "aria-setsize"], vt = /* @__PURE__ */ xe({
   name: "WindowDynamicVirtualScroll",
   __name: "WindowDynamicVirtualScroll",
   props: {
@@ -1396,310 +1429,604 @@ const Re = ["aria-label"], Ce = ["aria-posinset", "aria-setsize"], He = /* @__PU
     pullRefreshThreshold: { default: 64 }
   },
   emits: ["scroll", "loadMore", "refresh"],
-  setup(n, { expose: W, emit: k }) {
-    const e = n, w = k, g = D(), b = D(0), r = D(0), H = D(0), N = D(0), C = /* @__PURE__ */ new Map(), L = /* @__PURE__ */ new Map();
-    let A, h, V = -1;
-    const { getItemKey: M } = xe({
+  setup(a, { expose: j, emit: H }) {
+    const e = a, g = H, f = N(), T = N(0), s = N(0), V = N(0), _ = N(0), F = /* @__PURE__ */ new Map(), G = /* @__PURE__ */ new Map(), q = /* @__PURE__ */ new Map();
+    let y, k, I, z, A = !1, W = !1, Z = -1;
+    const { getItemKey: te } = $e({
       componentName: "WindowDynamicVirtualScroll",
       items: () => e.items,
       itemKey: () => e.itemKey
-    }), {
-      pulling: S,
-      pullDistance: P,
-      pullOffset: Y,
-      pullProgress: _,
-      refreshMessage: ae,
-      refreshThreshold: K,
-      handleTouchStart: z,
-      handleTouchMove: Q,
-      handleTouchEnd: B,
-      handleTouchCancel: q
-    } = ke({
+    });
+    function Y(d) {
+      return typeof window.requestAnimationFrame == "function" ? {
+        id: window.requestAnimationFrame(d),
+        type: "animation"
+      } : {
+        id: window.setTimeout(d, 0),
+        type: "timeout"
+      };
+    }
+    function L(d) {
+      d && (d.type === "animation" ? window.cancelAnimationFrame(d.id) : window.clearTimeout(d.id));
+    }
+    const {
+      pulling: J,
+      pullDistance: K,
+      pullOffset: Q,
+      pullProgress: le,
+      refreshMessage: ue,
+      refreshThreshold: U,
+      handleTouchStart: m,
+      handleTouchMove: p,
+      handleTouchEnd: D,
+      handleTouchCancel: se
+    } = Oe({
       enabled: () => e.pullToRefresh,
       refreshing: () => e.refreshing,
       threshold: () => e.pullRefreshThreshold,
-      onRefresh: () => w("refresh"),
+      onRefresh: () => g("refresh"),
       scrollTop: () => typeof window > "u" ? 0 : Math.max(0, window.scrollY)
-    }), U = s(
+    }), ae = i(
       () => Math.max(1, e.estimatedItemSize)
-    ), ie = s(
-      () => Math.max(1, e.loadingItemSize ?? U.value)
-    ), F = s(() => Math.max(0, Math.floor(e.overscan))), f = s(() => {
-      N.value;
-      const a = new Array(e.items.length + 1), t = new Array(e.items.length);
-      a[0] = 0;
-      for (let l = 0; l < e.items.length; l += 1) {
-        const i = M(e.items[l], l), d = C.get(i) ?? U.value;
-        t[l] = d, a[l + 1] = a[l] + d;
+    ), fe = i(
+      () => Math.max(1, e.loadingItemSize ?? ae.value)
+    ), oe = i(() => Math.max(0, Math.floor(e.overscan))), ie = i(() => {
+      _.value;
+      const d = new Array(e.items.length + 1), b = new Array(e.items.length);
+      d[0] = 0;
+      for (let M = 0; M < e.items.length; M += 1) {
+        const ce = te(e.items[M], M), X = F.get(ce) ?? ae.value;
+        b[M] = X, d[M + 1] = d[M] + X;
       }
       return {
-        offsets: a,
-        sizes: t,
-        total: a[e.items.length] ?? 0
+        offsets: d,
+        sizes: b,
+        total: d[e.items.length] ?? 0
       };
-    }), m = s(
-      () => f.value.total + (e.loading ? ie.value : 0)
-    ), O = s(() => {
-      const a = /* @__PURE__ */ new Map();
-      return e.items.forEach((t, l) => {
-        a.set(M(t, l), l);
-      }), a;
-    }), oe = s(
-      () => Math.max(0, b.value - H.value)
+    }), re = i(
+      () => ie.value.total + (e.loading ? fe.value : 0)
+    ), de = i(() => {
+      const d = /* @__PURE__ */ new Map();
+      return e.items.forEach((b, M) => {
+        d.set(te(b, M), M);
+      }), d;
+    }), h = i(
+      () => Math.max(0, T.value - V.value)
     );
-    function le(a) {
+    function $(d) {
       if (e.items.length === 0) return 0;
-      const t = f.value.offsets;
-      let l = 0, i = e.items.length;
-      for (; l < i; ) {
-        const d = Math.floor((l + i) / 2);
-        t[d + 1] <= a ? l = d + 1 : i = d;
+      const b = ie.value.offsets;
+      let M = 0, ce = e.items.length;
+      for (; M < ce; ) {
+        const X = Math.floor((M + ce) / 2);
+        b[X + 1] <= d ? M = X + 1 : ce = X;
       }
-      return Math.min(l, e.items.length - 1);
+      return Math.min(M, e.items.length - 1);
     }
-    const ue = s(
+    const l = i(
       () => Math.max(
         0,
-        le(oe.value) - F.value
+        $(h.value) - oe.value
       )
-    ), X = s(() => {
+    ), u = i(() => {
       if (e.items.length === 0) return 0;
-      const a = b.value + r.value - H.value, t = Math.max(
-        U.value,
-        a
-      ), l = le(t) + 1;
+      const d = T.value + s.value - V.value, b = Math.max(
+        ae.value,
+        d
+      ), M = $(b) + 1;
       return Math.min(
         e.items.length,
-        l + F.value
+        M + oe.value
       );
-    }), ce = s(
-      () => e.items.slice(ue.value, X.value).map((a, t) => {
-        const l = ue.value + t;
+    }), c = i(
+      () => e.items.slice(l.value, u.value).map((d, b) => {
+        const M = l.value + b;
         return {
-          item: a,
-          index: l,
-          key: M(a, l),
-          top: f.value.offsets[l]
+          item: d,
+          index: M,
+          key: te(d, M),
+          top: ie.value.offsets[M]
         };
       })
     );
-    function G() {
-      typeof window > "u" || (b.value = Math.max(0, window.scrollY), r.value = window.innerHeight, g.value && (H.value = g.value.getBoundingClientRect().top + b.value));
-    }
-    function ne() {
-      w("scroll", {
-        scrollTop: oe.value,
-        startIndex: ue.value,
-        endIndex: X.value
+    function E() {
+      typeof window > "u" || (T.value = Math.max(0, window.scrollY), s.value = window.innerHeight, f.value && (V.value = f.value.getBoundingClientRect().top + T.value));
+    }
+    function P() {
+      g("scroll", {
+        scrollTop: h.value,
+        startIndex: l.value,
+        endIndex: u.value
       });
     }
-    function p() {
-      G(), ne(), y();
+    function S(d = !1) {
+      W && (A || (A = d), !I && (I = Y(() => {
+        I = void 0, E(), A && (A = !1, P()), t();
+      })));
     }
-    function y() {
-      if (typeof window > "u" || !e.hasMore || e.loading || V === e.items.length)
-        return;
-      const a = Math.max(0, e.loadMoreThreshold), t = H.value + m.value, l = b.value + r.value;
-      t - l <= a && (V = e.items.length, w("loadMore"));
+    function R() {
+      S(!0);
     }
-    function o(a) {
-      const t = a.borderBoxSize;
-      if (t) {
-        const l = Array.isArray(t) ? t[0] : t;
-        if (l != null && l.blockSize) return l.blockSize;
+    function n() {
+      S();
+    }
+    function t() {
+      if (typeof window > "u" || !e.hasMore || e.loading || Z === e.items.length)
+        return;
+      const d = Math.max(0, e.loadMoreThreshold), b = V.value + re.value, M = T.value + s.value;
+      b - M <= d && (Z = e.items.length, g("loadMore"));
+    }
+    function o(d) {
+      const b = d.borderBoxSize;
+      if (b) {
+        const M = Array.isArray(b) ? b[0] : b;
+        if (M != null && M.blockSize) return M.blockSize;
       }
-      return a.contentRect.height;
-    }
-    function c(a) {
-      const t = f.value;
-      let l = 0, i = !1;
-      for (const d of a) {
-        const ee = d.target, J = L.get(ee), re = o(d);
-        if (J === void 0 || re <= 0) continue;
-        const de = C.get(J) ?? U.value;
-        if (Math.abs(de - re) < 0.5) continue;
-        const fe = O.value.get(J);
-        fe !== void 0 && t.offsets[fe + 1] <= oe.value && (l += re - de), C.set(J, re), i = !0;
+      return d.contentRect.height;
+    }
+    function v(d) {
+      const b = ie.value;
+      let M = 0, ce = !1;
+      for (const X of d) {
+        const pe = X.target, ye = G.get(pe), ke = o(X);
+        if (ye === void 0 || ke <= 0) continue;
+        const Le = F.get(ye) ?? ae.value;
+        if (Math.abs(Le - ke) < 0.5) continue;
+        const Be = de.value.get(ye);
+        Be !== void 0 && b.offsets[Be + 1] <= h.value && (M += ke - Le), F.set(ye, ke), ce = !0;
       }
-      i && (N.value += 1, I(() => {
-        if (l !== 0 && typeof window < "u") {
-          const d = Math.max(
-            0,
-            b.value + l
-          );
-          b.value = d, window.scrollTo({ top: d, behavior: "auto" });
+      ce && (_.value += 1, O(() => {
+        if (W) {
+          if (M !== 0 && typeof window < "u") {
+            const X = Math.max(
+              0,
+              T.value + M
+            );
+            T.value = X, window.scrollTo({ top: X, behavior: "auto" });
+          }
+          E(), t();
         }
-        G(), y();
       }));
     }
-    function u(a, t) {
-      a instanceof HTMLElement && (L.set(a, t), h == null || h.observe(a));
+    function B(d) {
+      if (W) {
+        for (const b of d)
+          q.set(b.target, b);
+        z || (z = Y(() => {
+          z = void 0;
+          const b = Array.from(q.values());
+          q.clear(), v(b);
+        }));
+      }
     }
-    function E() {
-      for (const [a] of L)
-        a.isConnected || (h == null || h.unobserve(a), L.delete(a));
+    function he(d, b) {
+      d instanceof HTMLElement && (G.set(d, b), k == null || k.observe(d));
+    }
+    function ve() {
+      for (const [d] of G)
+        d.isConnected || (k == null || k.unobserve(d), G.delete(d));
     }
-    function $(a, t = {}) {
+    function ge(d, b = {}) {
       if (typeof window > "u") return;
-      G();
-      const l = Math.max(0, m.value - r.value), i = Math.min(
-        Math.max(0, Number.isFinite(a) ? a : 0),
-        l
-      ), d = Math.max(0, H.value + i), ee = t.behavior ?? "auto";
-      ee === "auto" && (b.value = d), window.scrollTo({ ...t, top: d, behavior: ee });
-    }
-    function j(a, t = {}) {
+      E();
+      const M = Math.max(0, re.value - s.value), ce = Math.min(
+        Math.max(0, Number.isFinite(d) ? d : 0),
+        M
+      ), X = Math.max(0, V.value + ce), pe = b.behavior ?? "auto";
+      pe === "auto" && (T.value = X), window.scrollTo({ ...b, top: X, behavior: pe });
+    }
+    function Te(d, b = {}) {
       if (typeof window > "u" || e.items.length === 0) return;
-      G();
-      const l = Math.min(
+      E();
+      const M = Math.min(
         e.items.length - 1,
-        Math.max(0, Math.floor(a))
-      ), { align: i = "start", ...d } = t, ee = f.value.sizes[l];
-      let J = H.value + f.value.offsets[l];
-      i === "center" ? J -= (r.value - ee) / 2 : i === "end" && (J -= r.value - ee);
-      const re = Math.max(
-        H.value,
-        H.value + m.value - r.value
-      ), de = Math.max(0, Math.min(J, re)), fe = d.behavior ?? "auto";
-      fe === "auto" && (b.value = de), window.scrollTo({
-        ...d,
-        top: de,
-        behavior: fe
+        Math.max(0, Math.floor(d))
+      ), { align: ce = "start", ...X } = b, pe = ie.value.sizes[M];
+      let ye = V.value + ie.value.offsets[M];
+      ce === "center" ? ye -= (s.value - pe) / 2 : ce === "end" && (ye -= s.value - pe);
+      const ke = Math.max(
+        V.value,
+        V.value + re.value - s.value
+      ), Le = Math.max(0, Math.min(ye, ke)), Be = X.behavior ?? "auto";
+      Be === "auto" && (T.value = Le), window.scrollTo({
+        ...X,
+        top: Le,
+        behavior: Be
       });
     }
-    function se(a = "auto") {
-      typeof window > "u" || (G(), window.scrollTo({ top: Math.max(0, H.value), behavior: a }));
+    function be(d = "auto") {
+      typeof window > "u" || (E(), window.scrollTo({ top: Math.max(0, V.value), behavior: d }));
     }
-    return Z(
+    return ee(
       () => e.itemKey,
       () => {
-        C.clear(), N.value += 1;
+        F.clear(), _.value += 1, Z = -1;
       }
-    ), Z(
-      () => e.items.length,
-      async () => {
-        const a = new Set(
-          e.items.map((t, l) => M(t, l))
-        );
-        for (const t of C.keys())
-          a.has(t) || C.delete(t);
-        N.value += 1, await I(), G(), y();
+    ), ee(
+      () => e.items.map((d, b) => te(d, b)),
+      async (d, b) => {
+        const M = d.length !== b.length || d.some((X, pe) => X !== b[pe]), ce = new Set(d);
+        for (const X of F.keys())
+          ce.has(X) || F.delete(X);
+        M && (Z = -1), _.value += 1, await O(), W && (E(), t());
       }
-    ), Z(
+    ), ee(
       () => [e.hasMore, e.loading],
-      async ([a]) => {
-        a || (V = -1), await I(), G(), y();
+      async ([d]) => {
+        d || (Z = -1), await O(), W && (E(), t());
       }
-    ), pe(() => {
-      if (G(), window.addEventListener("scroll", p, { passive: !0 }), window.addEventListener("resize", p, { passive: !0 }), typeof ResizeObserver < "u") {
-        A = new ResizeObserver(() => {
-          G(), y();
-        }), h = new ResizeObserver(c), g.value && A.observe(g.value);
-        for (const [a] of L)
-          h.observe(a);
+    ), Se(() => {
+      if (W = !0, E(), window.addEventListener("scroll", R, { passive: !0 }), window.addEventListener("resize", n, { passive: !0 }), typeof ResizeObserver < "u") {
+        y = new ResizeObserver(() => {
+          S();
+        }), k = new ResizeObserver(B), f.value && y.observe(f.value);
+        for (const [d] of G)
+          k.observe(d);
       }
-      I(y);
-    }), Se(E), ye(() => {
-      window.removeEventListener("scroll", p), window.removeEventListener("resize", p), A && (A.disconnect(), A = void 0), h && (h.disconnect(), h = void 0), L.clear();
-    }), W({
-      scrollTo: $,
-      scrollToIndex: j,
-      scrollToTop: se
-    }), (a, t) => (x(), T("div", {
+      O(() => {
+        W && t();
+      });
+    }), Ce(ve), Ie(() => {
+      W = !1, window.removeEventListener("scroll", R), window.removeEventListener("resize", n), L(I), L(z), I = void 0, z = void 0, A = !1, q.clear(), y && (y.disconnect(), y = void 0), k && (k.disconnect(), k = void 0), G.clear();
+    }), j({
+      scrollTo: ge,
+      scrollToIndex: Te,
+      scrollToTop: be
+    }), (d, b) => (w(), x("div", {
       ref_key: "root",
-      ref: g,
-      class: Ie(["vue-window-dynamic-virtual-scroll", { "vue-window-dynamic-virtual-scroll--pulling": v(S) }]),
+      ref: f,
+      class: He(["vue-window-dynamic-virtual-scroll", { "vue-window-dynamic-virtual-scroll--pulling": r(J) }]),
       role: "list",
-      "aria-label": n.ariaLabel,
-      onTouchstartPassive: t[0] || (t[0] = //@ts-ignore
-      (...l) => v(z) && v(z)(...l)),
-      onTouchmove: t[1] || (t[1] = //@ts-ignore
-      (...l) => v(Q) && v(Q)(...l)),
-      onTouchend: t[2] || (t[2] = //@ts-ignore
-      (...l) => v(B) && v(B)(...l)),
-      onTouchcancel: t[3] || (t[3] = //@ts-ignore
-      (...l) => v(q) && v(q)(...l))
+      "aria-label": a.ariaLabel,
+      onTouchstartPassive: b[0] || (b[0] = //@ts-ignore
+      (...M) => r(m) && r(m)(...M)),
+      onTouchmove: b[1] || (b[1] = //@ts-ignore
+      (...M) => r(p) && r(p)(...M)),
+      onTouchend: b[2] || (b[2] = //@ts-ignore
+      (...M) => r(D) && r(D)(...M)),
+      onTouchcancel: b[3] || (b[3] = //@ts-ignore
+      (...M) => r(se) && r(se)(...M))
     }, [
-      n.pullToRefresh || n.refreshing ? (x(), T("div", {
+      a.pullToRefresh || a.refreshing ? (w(), x("div", {
         key: 0,
         class: "vue-window-dynamic-virtual-scroll__refresh",
-        style: R({
-          height: `${v(K)}px`,
-          transform: `translateY(${v(Y) - v(K)}px)`
+        style: C({
+          height: `${r(U)}px`,
+          transform: `translateY(${r(Q) - r(U)}px)`
         }),
         role: "status",
         "aria-live": "polite"
       }, [
-        te(a.$slots, "refresh", {
-          pullDistance: v(P),
-          progress: v(_),
-          refreshing: n.refreshing
+        ne(d.$slots, "refresh", {
+          pullDistance: r(K),
+          progress: r(le),
+          refreshing: a.refreshing
         }, () => [
-          he(ze(v(ae)), 1)
+          Me(Ee(r(ue)), 1)
         ])
-      ], 4)) : ve("", !0),
-      n.items.length || n.loading ? (x(), T("div", {
+      ], 4)) : me("", !0),
+      a.items.length || a.loading ? (w(), x("div", {
         key: 1,
         class: "vue-window-dynamic-virtual-scroll__spacer",
-        style: R({
-          height: `${m.value}px`,
-          transform: `translateY(${v(Y)}px)`
+        style: C({
+          height: `${re.value}px`,
+          transform: `translateY(${r(Q)}px)`
         })
       }, [
-        (x(!0), T(me, null, Me(ce.value, ({ item: l, index: i, key: d, top: ee }) => (x(), T("div", {
-          key: d,
+        (w(!0), x(we, null, ze(c.value, ({ item: M, index: ce, key: X, top: pe }) => (w(), x("div", {
+          key: X,
           ref_for: !0,
-          ref: (J) => u(J, d),
+          ref: (ye) => he(ye, X),
           class: "vue-window-dynamic-virtual-scroll__item",
-          style: R({ transform: `translateY(${ee}px)` }),
+          style: C({ transform: `translateY(${pe}px)` }),
           role: "listitem",
-          "aria-posinset": i + 1,
-          "aria-setsize": n.items.length
+          "aria-posinset": ce + 1,
+          "aria-setsize": a.items.length
         }, [
-          te(a.$slots, "default", {
-            item: l,
-            index: i
+          ne(d.$slots, "default", {
+            item: M,
+            index: ce
           })
-        ], 12, Je))), 128)),
-        n.loading ? (x(), T("div", {
+        ], 12, dt))), 128)),
+        a.loading ? (w(), x("div", {
           key: 0,
           class: "vue-window-dynamic-virtual-scroll__loading",
-          style: R({
-            height: `${ie.value}px`,
-            transform: `translateY(${f.value.total}px)`
+          style: C({
+            height: `${fe.value}px`,
+            transform: `translateY(${ie.value.total}px)`
           }),
           role: "status",
           "aria-live": "polite"
         }, [
-          te(a.$slots, "loading", {}, () => [
-            t[4] || (t[4] = he("Loading more…", -1))
+          ne(d.$slots, "loading", {}, () => [
+            b[4] || (b[4] = Me("Loading more…", -1))
           ])
-        ], 4)) : ve("", !0)
-      ], 4)) : (x(), T("div", {
+        ], 4)) : me("", !0)
+      ], 4)) : (w(), x("div", {
         key: 2,
         class: "vue-window-dynamic-virtual-scroll__empty",
-        style: R({ transform: `translateY(${v(Y)}px)` })
+        style: C({ transform: `translateY(${r(Q)}px)` })
+      }, [
+        ne(d.$slots, "empty")
+      ], 4))
+    ], 42, ct));
+  }
+}), ft = ["aria-label"], ht = ["aria-posinset", "aria-setsize"], mt = /* @__PURE__ */ xe({
+  name: "WindowGirdVirtualScroll",
+  __name: "WindowGirdVirtualScroll",
+  props: {
+    items: {},
+    itemSize: {},
+    columns: { default: 2 },
+    gap: { default: 0 },
+    overscan: { default: 1 },
+    itemKey: { default: void 0 },
+    ariaLabel: { default: "Window virtual grid" },
+    hasMore: { type: Boolean, default: !1 },
+    loading: { type: Boolean, default: !1 },
+    loadingItemSize: { default: void 0 },
+    loadMoreThreshold: { default: 200 },
+    pullToRefresh: { type: Boolean, default: !1 },
+    refreshing: { type: Boolean, default: !1 },
+    pullRefreshThreshold: { default: 64 }
+  },
+  emits: ["scroll", "loadMore", "refresh"],
+  setup(a, { expose: j, emit: H }) {
+    const e = a, g = H, f = N(), T = N(0), s = N(0), V = N(0);
+    let _, F = -1;
+    const { getItemKey: G } = $e({
+      componentName: "WindowGirdVirtualScroll",
+      items: () => e.items,
+      itemKey: () => e.itemKey
+    }), {
+      pulling: q,
+      pullDistance: y,
+      pullOffset: k,
+      pullProgress: I,
+      refreshMessage: z,
+      refreshThreshold: A,
+      handleTouchStart: W,
+      handleTouchMove: Z,
+      handleTouchEnd: te,
+      handleTouchCancel: Y
+    } = Oe({
+      enabled: () => e.pullToRefresh,
+      refreshing: () => e.refreshing,
+      threshold: () => e.pullRefreshThreshold,
+      onRefresh: () => g("refresh"),
+      scrollTop: () => typeof window > "u" ? 0 : Math.max(0, window.scrollY)
+    }), L = i(() => Math.max(1, e.itemSize)), J = i(
+      () => Math.max(1, Math.floor(e.columns))
+    ), K = i(() => Math.max(0, e.gap)), Q = i(() => Math.max(0, Math.floor(e.overscan))), le = i(
+      () => Math.max(1, e.loadingItemSize ?? L.value)
+    ), ue = i(
+      () => L.value + K.value
+    ), U = i(
+      () => Math.ceil(e.items.length / J.value)
+    ), m = i(() => U.value === 0 ? 0 : U.value * L.value + (U.value - 1) * K.value), p = i(
+      () => m.value + (e.items.length ? K.value : 0)
+    ), D = i(
+      () => m.value + (e.loading ? le.value + (e.items.length ? K.value : 0) : 0)
+    ), se = i(
+      () => Math.max(0, T.value - V.value)
+    ), ae = i(
+      () => Math.max(
+        0,
+        Math.floor(se.value / ue.value) - Q.value
+      )
+    ), fe = i(() => {
+      if (U.value === 0) return 0;
+      const S = Math.max(
+        L.value,
+        T.value + s.value - V.value
+      ), R = Math.ceil(
+        (S + K.value) / ue.value
+      );
+      return Math.min(
+        U.value,
+        R + Q.value
+      );
+    }), oe = i(
+      () => Math.min(e.items.length, ae.value * J.value)
+    ), ie = i(
+      () => Math.min(e.items.length, fe.value * J.value)
+    ), re = i(
+      () => e.items.slice(oe.value, ie.value).map((S, R) => {
+        const n = oe.value + R;
+        return {
+          item: S,
+          index: n,
+          key: G(S, n),
+          rowIndex: Math.floor(n / J.value),
+          columnIndex: n % J.value
+        };
+      })
+    ), de = i(() => ({
+      gridTemplateColumns: `repeat(${J.value}, minmax(0, 1fr))`,
+      columnGap: `${K.value}px`,
+      rowGap: `${K.value}px`,
+      transform: `translateY(${ae.value * ue.value}px)`
+    }));
+    function h() {
+      typeof window > "u" || (T.value = Math.max(0, window.scrollY), s.value = window.innerHeight, f.value && (V.value = f.value.getBoundingClientRect().top + T.value));
+    }
+    function $() {
+      g("scroll", {
+        scrollTop: se.value,
+        startIndex: oe.value,
+        endIndex: ie.value
+      });
+    }
+    function l() {
+      h(), $(), u();
+    }
+    function u() {
+      if (typeof window > "u" || !e.hasMore || e.loading || F === e.items.length)
+        return;
+      const S = Math.max(0, e.loadMoreThreshold), R = V.value + D.value, n = T.value + s.value;
+      R - n <= S && (F = e.items.length, g("loadMore"));
+    }
+    function c(S, R = {}) {
+      if (typeof window > "u") return;
+      h();
+      const n = Math.max(0, D.value - s.value), t = Math.min(
+        Math.max(0, Number.isFinite(S) ? S : 0),
+        n
+      ), o = Math.max(0, V.value + t), v = R.behavior ?? "auto";
+      v === "auto" && (T.value = o), window.scrollTo({ ...R, top: o, behavior: v });
+    }
+    function E(S, R = {}) {
+      if (typeof window > "u" || e.items.length === 0) return;
+      h();
+      const n = Math.min(
+        e.items.length - 1,
+        Math.max(0, Math.floor(S))
+      ), t = Math.floor(n / J.value), { align: o = "start", ...v } = R;
+      let B = V.value + t * ue.value;
+      o === "center" ? B -= (s.value - L.value) / 2 : o === "end" && (B -= s.value - L.value);
+      const he = Math.max(
+        V.value,
+        V.value + D.value - s.value
+      ), ve = Math.max(0, Math.min(B, he)), ge = v.behavior ?? "auto";
+      ge === "auto" && (T.value = ve), window.scrollTo({
+        ...v,
+        top: ve,
+        behavior: ge
+      });
+    }
+    function P(S = "auto") {
+      typeof window > "u" || (h(), window.scrollTo({ top: Math.max(0, V.value), behavior: S }));
+    }
+    return ee(
+      () => [
+        e.items.length,
+        e.itemSize,
+        e.columns,
+        e.gap
+      ],
+      async () => {
+        await O(), h(), u();
+      }
+    ), ee(
+      () => [e.hasMore, e.loading],
+      async ([S]) => {
+        S || (F = -1), await O(), h(), u();
+      }
+    ), Se(() => {
+      h(), window.addEventListener("scroll", l, { passive: !0 }), window.addEventListener("resize", l, { passive: !0 }), typeof ResizeObserver < "u" && (_ = new ResizeObserver(() => {
+        h(), u();
+      }), f.value && _.observe(f.value)), O(u);
+    }), Ie(() => {
+      window.removeEventListener("scroll", l), window.removeEventListener("resize", l), _ && (_.disconnect(), _ = void 0);
+    }), j({
+      scrollTo: c,
+      scrollToIndex: E,
+      scrollToTop: P
+    }), (S, R) => (w(), x("div", {
+      ref_key: "root",
+      ref: f,
+      class: He(["vue-window-gird-virtual-scroll", { "vue-window-gird-virtual-scroll--pulling": r(q) }]),
+      role: "list",
+      "aria-label": a.ariaLabel,
+      onTouchstartPassive: R[0] || (R[0] = //@ts-ignore
+      (...n) => r(W) && r(W)(...n)),
+      onTouchmove: R[1] || (R[1] = //@ts-ignore
+      (...n) => r(Z) && r(Z)(...n)),
+      onTouchend: R[2] || (R[2] = //@ts-ignore
+      (...n) => r(te) && r(te)(...n)),
+      onTouchcancel: R[3] || (R[3] = //@ts-ignore
+      (...n) => r(Y) && r(Y)(...n))
+    }, [
+      a.pullToRefresh || a.refreshing ? (w(), x("div", {
+        key: 0,
+        class: "vue-window-gird-virtual-scroll__refresh",
+        style: C({
+          height: `${r(A)}px`,
+          transform: `translateY(${r(k) - r(A)}px)`
+        }),
+        role: "status",
+        "aria-live": "polite"
+      }, [
+        ne(S.$slots, "refresh", {
+          pullDistance: r(y),
+          progress: r(I),
+          refreshing: a.refreshing
+        }, () => [
+          Me(Ee(r(z)), 1)
+        ])
+      ], 4)) : me("", !0),
+      a.items.length || a.loading ? (w(), x("div", {
+        key: 1,
+        class: "vue-window-gird-virtual-scroll__spacer",
+        style: C({
+          height: `${D.value}px`,
+          transform: `translateY(${r(k)}px)`
+        })
+      }, [
+        De("div", {
+          class: "vue-window-gird-virtual-scroll__content",
+          style: C(de.value)
+        }, [
+          (w(!0), x(we, null, ze(re.value, ({ item: n, index: t, key: o, rowIndex: v, columnIndex: B }) => (w(), x("div", {
+            key: o,
+            class: "vue-window-gird-virtual-scroll__item",
+            style: C({ height: `${L.value}px` }),
+            role: "listitem",
+            "aria-posinset": t + 1,
+            "aria-setsize": a.items.length
+          }, [
+            ne(S.$slots, "default", {
+              item: n,
+              index: t,
+              rowIndex: v,
+              columnIndex: B
+            })
+          ], 12, ht))), 128))
+        ], 4),
+        a.loading ? (w(), x("div", {
+          key: 0,
+          class: "vue-window-gird-virtual-scroll__loading",
+          style: C({
+            height: `${le.value}px`,
+            transform: `translateY(${p.value}px)`
+          }),
+          role: "status",
+          "aria-live": "polite"
+        }, [
+          ne(S.$slots, "loading", {}, () => [
+            R[4] || (R[4] = Me("Loading more…", -1))
+          ])
+        ], 4)) : me("", !0)
+      ], 4)) : (w(), x("div", {
+        key: 2,
+        class: "vue-window-gird-virtual-scroll__empty",
+        style: C({ transform: `translateY(${r(k)}px)` })
       }, [
-        te(a.$slots, "empty")
+        ne(S.$slots, "empty")
       ], 4))
-    ], 42, Ge));
+    ], 42, ft));
   }
-}), Xe = He, tt = {
-  install(n) {
-    n.component("ChatVirtualScroll", Oe), n.component("DynamicVirtualScroll", He), n.component("ShortMediaFeed", Ne), n.component("VirtualCarousel", Ue), n.component("VirtualList", Xe), n.component("VirtualScroll", qe), n.component(
+}), gt = Pe, yt = {
+  install(a) {
+    a.component("ChatVirtualScroll", _e), a.component("DynamicVirtualScroll", Pe), a.component("ShortMediaFeed", Je), a.component("SkeletonLoader", tt), a.component("VirtualCarousel", it), a.component("VirtualList", gt), a.component("VirtualScroll", ut), a.component(
       "WindowDynamicVirtualScroll",
-      Qe
+      vt
+    ), a.component(
+      "WindowGirdVirtualScroll",
+      mt
     );
   }
 };
 export {
-  Oe as ChatVirtualScroll,
-  He as DynamicVirtualScroll,
-  Ne as ShortMediaFeed,
-  Ue as VirtualCarousel,
-  Xe as VirtualList,
-  qe as VirtualScroll,
-  tt as VueVirtualScroll,
-  Qe as WindowDynamicVirtualScroll,
-  tt as default
+  _e as ChatVirtualScroll,
+  Pe as DynamicVirtualScroll,
+  Je as ShortMediaFeed,
+  tt as SkeletonLoader,
+  it as VirtualCarousel,
+  gt as VirtualList,
+  ut as VirtualScroll,
+  yt as VueVirtualScroll,
+  vt as WindowDynamicVirtualScroll,
+  mt as WindowGirdVirtualScroll,
+  yt as default
 };