@quoreadmin/ui 1.10.2 → 1.10.4

package/dist/index131.js

@@ -1,6 +1,6 @@
-import { defineComponent as R, useSlots as A, ref as C, computed as u, onMounted as D, onUnmounted as U, resolveComponent as G, openBlock as h, createElementBlock as w, normalizeClass as l, createElementVNode as r, normalizeStyle as x, unref as B, renderSlot as n, createCommentVNode as T, createVNode as I } from "vue";
-import i from "./index57.js";
-const J = { class: "flex-grow m-0 font-bold sm-down:text-md md:text-lg leading-none text-left" }, K = "4.5rem", P = "4.8125rem", M = 80, Z = /* @__PURE__ */ R({
+import { defineComponent as A, useSlots as U, ref as g, computed as u, onMounted as G, onUnmounted as I, resolveComponent as J, openBlock as w, createElementBlock as p, normalizeClass as a, createElementVNode as r, normalizeStyle as C, unref as B, renderSlot as i, createCommentVNode as T, createVNode as P } from "vue";
+import s from "./index57.js";
+const Q = { class: "flex-grow m-0 font-bold sm-down:text-md md:text-lg leading-none text-left" }, X = 100, Z = "4.5rem", _ = "4.8125rem", O = 80, le = /* @__PURE__ */ A({
   __name: "page-layout",
   props: {
     headerBackgroundColor: { default: "green-20" },
@@ -22,80 +22,85 @@ const J = { class: "flex-grow m-0 font-bold sm-down:text-md md:text-lg leading-n
     footerBackgroundColor: { default: "white" },
     footerBarClass: { default: "" },
     footerVisible: { type: Boolean, default: void 0 },
-    containerBackgroundColor: { default: "gray-00" }
+    containerBackgroundColor: { default: "gray-00" },
+    adjustForKeyboard: { type: Boolean, default: !1 }
   },
   emits: ["update:sidebarCollapsed"],
-  setup(o, { expose: L, emit: q }) {
-    const t = o, j = q, N = A(), b = C(null), c = C(!0), s = C(!1), m = C(!1), $ = C(!1);
-    let p = 0, y = !1;
-    const v = u(() => !!N.sidebar), f = u(() => t.headerFixed !== void 0 ? t.headerFixed : v.value), a = u({
-      get: () => t.sidebarCollapsed,
-      set: (e) => j("update:sidebarCollapsed", e)
-    }), O = u(
-      () => v.value && t.sidebarCollapsible && i.md
-    ), S = u(
-      () => `${t.headerTop + M}px`
+  setup(o, { expose: R, emit: q }) {
+    const l = o, K = q, D = U(), b = g(null), c = g(!0), n = g(!1), m = g(!1), $ = g(!1), k = g(0);
+    let y = 0, x = !1, S = 0;
+    const v = u(() => !!D.sidebar), f = u(() => l.headerFixed !== void 0 ? l.headerFixed : v.value), d = u({
+      get: () => l.sidebarCollapsed,
+      set: (e) => K("update:sidebarCollapsed", e)
+    }), N = u(
+      () => v.value && l.sidebarCollapsible && s.md
+    ), E = u(
+      () => `${l.headerTop + O}px`
+    ), V = u(
+      () => `calc(100vh - ${l.headerTop + O}px)`
     ), z = u(
-      () => `calc(100vh - ${t.headerTop + M}px)`
-    ), H = u(
-      () => a.value ? t.sidebarCollapsedWidth : t.sidebarWidth
-    ), E = () => {
-      const e = b.value, d = !i.md && e;
+      () => d.value ? l.sidebarCollapsedWidth : l.sidebarWidth
+    ), F = () => {
+      const e = b.value, t = !s.md && e;
       return {
-        scrollY: d ? e.scrollTop : window.scrollY,
-        atTop: d ? e.scrollTop <= 0 : window.scrollY <= 0,
-        atBottom: d ? e.scrollTop + e.clientHeight >= e.scrollHeight : window.scrollY + window.innerHeight >= document.documentElement.scrollHeight
+        scrollY: t ? e.scrollTop : window.scrollY,
+        atTop: t ? e.scrollTop <= 0 : window.scrollY <= 0,
+        atBottom: t ? e.scrollTop + e.clientHeight >= e.scrollHeight : window.scrollY + window.innerHeight >= document.documentElement.scrollHeight
       };
-    }, k = () => {
-      y || (window.requestAnimationFrame(() => {
-        const { scrollY: e, atTop: d, atBottom: g } = E();
-        if (c.value = d, s.value = g, t.headerHideOnScroll && (f.value || !i.md)) {
-          if (e <= t.headerHideScrollThreshold) {
-            m.value = !1, p = e, y = !1;
+    }, H = () => {
+      x || (window.requestAnimationFrame(() => {
+        const { scrollY: e, atTop: t, atBottom: h } = F();
+        if (c.value = t, n.value = h, l.headerHideOnScroll && (f.value || !s.md)) {
+          if (e <= l.headerHideScrollThreshold) {
+            m.value = !1, y = e, x = !1;
             return;
           }
-          if (g) {
-            p = e, y = !1;
+          if (h) {
+            y = e, x = !1;
             return;
           }
-          const Y = Math.max(0, e), V = Y - p;
-          Math.abs(V) > 15 && (m.value = V > 0, p = Y);
+          const j = Math.max(0, e), M = j - y;
+          Math.abs(M) > 15 && (m.value = M > 0, y = j);
         } else
           m.value = !1;
-        y = !1;
-      }), y = !0);
-    }, F = () => {
-      a.value = !a.value;
+        x = !1;
+      }), x = !0);
+    }, Y = () => {
+      d.value = !d.value;
+    }, L = () => {
+      if (!l.adjustForKeyboard || s.md) return;
+      const e = window.visualViewport?.height ?? window.innerHeight, t = S - e;
+      t <= X ? (S = window.innerHeight, k.value = 0) : k.value = t;
     };
-    return D(() => {
-      window.addEventListener("scroll", k, { passive: !0 }), b.value && b.value.addEventListener("scroll", k, {
+    return G(() => {
+      S = window.innerHeight, window.addEventListener("scroll", H, { passive: !0 }), b.value && b.value.addEventListener("scroll", H, {
         passive: !0
       });
-      const { scrollY: e, atTop: d, atBottom: g } = E();
-      p = e, c.value = d, s.value = g;
-    }), U(() => {
-      window.removeEventListener("scroll", k), b.value?.removeEventListener("scroll", k);
-    }), L({ scrolledToTop: c, scrolledToBottom: s, headerHidden: m }), (e, d) => {
-      const g = G("q-icon");
-      return h(), w("div", {
-        class: l([
+      const { scrollY: e, atTop: t, atBottom: h } = F();
+      y = e, c.value = t, n.value = h, l.adjustForKeyboard && window.visualViewport?.addEventListener("resize", L);
+    }), I(() => {
+      window.removeEventListener("scroll", H), b.value?.removeEventListener("scroll", H), window.visualViewport?.removeEventListener("resize", L);
+    }), R({ scrolledToTop: c, scrolledToBottom: n, headerHidden: m, keyboardOffset: k }), (e, t) => {
+      const h = J("q-icon");
+      return w(), p("div", {
+        class: a([
           "page-layout",
           `bg-${o.containerBackgroundColor}`,
           "sm-down:absolute sm-down:inset-x-0 sm-down:top-0 sm-down:bottom-0"
         ])
       }, [
         r("div", {
-          class: l([
+          class: a([
             "page-layout__header",
             "flex items-center justify-center",
-            B(i).md ? `bg-${o.containerBackgroundColor}` : "",
+            B(s).md ? `bg-${o.containerBackgroundColor}` : "",
             f.value ? "fixed left-0 w-full sm-down:z-50 md:z-[45] md:pt-6 md:px-6" : "md:mb-4 relative sm-down:absolute sm-down:top-0 sm-down:inset-x-0 sm-down:z-50",
             { "page-layout__header--hidden": m.value }
           ]),
-          style: x(f.value ? { top: `${o.headerTop}px` } : void 0)
+          style: C(f.value ? { top: `${o.headerTop}px` } : void 0)
         }, [
           r("div", {
-            class: l([
+            class: a([
               "page-layout__header-bar",
               "flex items-center text-left md:rounded-lg",
               `md:h-[3.5rem] ${o.maxContentWidth} w-full p-4 md:pl-6`,
@@ -108,167 +113,168 @@ const J = { class: "flex-grow m-0 font-bold sm-down:text-md md:text-lg leading-n
               }
             ])
           }, [
-            r("h1", J, [
-              n(e.$slots, "header", {
+            r("h1", Q, [
+              i(e.$slots, "header", {
                 scrolledToTop: c.value,
-                scrolledToBottom: s.value
+                scrolledToBottom: n.value
               }, void 0, !0)
             ]),
-            n(e.$slots, "header-actions", {}, void 0, !0)
+            i(e.$slots, "header-actions", {}, void 0, !0)
           ], 2)
         ], 6),
         r("div", {
           ref_key: "contentRef",
           ref: b,
-          class: l([
+          class: a([
             "page-layout__content",
             "sm-down:absolute sm-down:left-0 sm-down:right-0",
             "sm-down:overflow-y-auto sm-down:scroll-smooth sm-down:overscroll-none",
             { "md:pt-[4.5rem]": f.value },
-            { "md:mb-[0.5rem]": f.value && t.footerVisible },
+            { "md:mb-[0.5rem]": f.value && l.footerVisible },
             o.contentClass
           ]),
-          style: x({
-            "--sm-top": m.value ? "0px" : K,
-            "--sm-bottom": t.footerVisible ? P : "0px"
+          style: C({
+            "--sm-top": m.value ? "0px" : Z,
+            "--sm-bottom": l.footerVisible ? _ : "0px",
+            "--keyboard-offset": `${k.value}px`
           })
         }, [
           r("div", {
-            class: l([
+            class: a([
               "page-layout__content-inner",
               { "md:flex md:gap-4": v.value }
             ])
           }, [
-            v.value && B(i).md ? (h(), w("div", {
+            v.value && B(s).md ? (w(), p("div", {
               key: 0,
-              class: l([
+              class: a([
                 "page-layout__sidebar",
                 "shrink-0 flex flex-col gap-4",
                 "md:transition-[width] md:duration-300",
-                H.value,
-                { "!overflow-hidden": a.value },
+                z.value,
+                { "!overflow-hidden": d.value },
                 o.sidebarClass
               ]),
-              onMouseenter: d[0] || (d[0] = (W) => $.value = !0),
-              onMouseleave: d[1] || (d[1] = (W) => $.value = !1)
+              onMouseenter: t[0] || (t[0] = (W) => $.value = !0),
+              onMouseleave: t[1] || (t[1] = (W) => $.value = !1)
             }, [
               r("div", {
-                class: l([
+                class: a([
                   "page-layout__sidebar-inner",
                   "fixed z-10 md:pb-6 md:pt-4 overflow-y-auto",
                   `bg-${o.containerBackgroundColor}`,
-                  H.value,
-                  { "!overflow-hidden": a.value }
+                  z.value,
+                  { "!overflow-hidden": d.value }
                 ]),
-                style: x({
-                  top: S.value,
-                  height: z.value
+                style: C({
+                  top: E.value,
+                  height: V.value
                 })
               }, [
-                n(e.$slots, "sidebar", {}, void 0, !0)
+                i(e.$slots, "sidebar", {}, void 0, !0)
               ], 6),
-              a.value ? (h(), w("div", {
+              d.value ? (w(), p("div", {
                 key: 0,
                 class: "fixed cursor-pointer w-12 rounded-lg bg-white z-10",
-                style: x({
-                  top: `calc(${S.value} + 1rem)`,
-                  height: `calc(${z.value} - 2.5rem)`
+                style: C({
+                  top: `calc(${E.value} + 1rem)`,
+                  height: `calc(${V.value} - 2.5rem)`
                 }),
-                onClick: F
+                onClick: Y
               }, null, 4)) : T("", !0),
-              O.value && ($.value || a.value) ? (h(), w("div", {
+              N.value && ($.value || d.value) ? (w(), p("div", {
                 key: 1,
-                class: l([
+                class: a([
                   "page-layout__sidebar-toggle",
                   "cursor-pointer fixed z-30",
                   "bg-white rounded",
                   "transition-all duration-300 ease-in-out",
-                  { "border border-gray-10": !a.value }
+                  { "border border-gray-10": !d.value }
                 ]),
-                style: x({
+                style: C({
                   top: "calc(50vh + 97px)",
                   // Expanded: sidebar width minus half the button (lg: 23rem - 0.875rem, md: 19rem - 0.875rem).
                   // Collapsed: inset from the left edge.
-                  marginLeft: a.value ? "0.875rem" : B(i).lg ? "22.125rem" : "18.125rem"
+                  marginLeft: d.value ? "0.875rem" : B(s).lg ? "22.125rem" : "18.125rem"
                 }),
-                onClick: F
+                onClick: Y
               }, [
-                n(e.$slots, "sidebar-toggle", { collapsed: a.value }, () => [
-                  I(g, {
+                i(e.$slots, "sidebar-toggle", { collapsed: d.value }, () => [
+                  P(h, {
                     icon: "double-chevron-right",
                     color: "inkwell-30",
                     type: "",
-                    class: l([
+                    class: a([
                       "page-layout__sidebar-toggle-icon",
                       "w-6 h-6 p-1 text-inkwell-30",
-                      { "rotate-180": a.value }
+                      { "rotate-180": d.value }
                     ])
                   }, null, 8, ["class"])
                 ], !0)
               ], 6)) : T("", !0)
             ], 34)) : T("", !0),
             r("div", {
-              class: l([
+              class: a([
                 "page-layout__main",
                 "block w-full grow leading-normal",
                 { "md:mb-4": v.value },
                 o.mainClass
               ])
             }, [
-              n(e.$slots, "default", {
-                sidebarCollapsed: a.value,
+              i(e.$slots, "default", {
+                sidebarCollapsed: d.value,
                 scrolledToTop: c.value,
-                scrolledToBottom: s.value
+                scrolledToBottom: n.value
               }, void 0, !0)
             ], 2)
           ], 2)
         ], 6),
-        n(e.$slots, "overlay", {}, void 0, !0),
-        t.footerVisible ? (h(), w("div", {
+        i(e.$slots, "overlay", {}, void 0, !0),
+        l.footerVisible ? (w(), p("div", {
           key: 0,
-          class: l([
+          class: a([
             "page-layout__footer",
             "fixed bottom-0 left-0 right-0 z-20 justify-center",
             `bg-${o.footerBackgroundColor}`,
-            B(i).md ? "overflow-visible h-0 w-full px-6 flex" : "py-6 px-4 bg-white border-t border-gray-20 flex gap-4 sm-down:absolute sm-down:!py-4"
+            B(s).md ? "overflow-visible h-0 w-full px-6 flex" : "py-6 px-4 bg-white border-t border-gray-20 flex gap-4 sm-down:absolute sm-down:!py-4"
           ])
         }, [
-          B(i).md ? (h(), w("div", {
+          B(s).md ? (w(), p("div", {
             key: 0,
-            class: l([
+            class: a([
               "flex gap-4 items-end h-0 overflow-visible margin-x-auto w-full",
               o.maxContentWidth
             ])
           }, [
             r("div", {
-              class: l([
+              class: a([
                 "shrink-0 w-0 transition-[width] duration-300",
-                v.value ? H.value : "hidden"
+                v.value ? z.value : "hidden"
               ])
             }, null, 2),
             r("div", {
-              class: l([
+              class: a([
                 "grow pb-6 rounded-t-lg",
                 `bg-${o.containerBackgroundColor}`
               ])
             }, [
               r("div", {
-                class: l([
+                class: a([
                   "page-layout__footer-bar",
                   "flex items-center justify-center gap-4",
                   "left-auto right-auto py-4",
                   "rounded-lg shadow-[0_-2px_5px_0_rgba(0,0,0,0.05)] shadow-gray-10",
                   `bg-${o.footerBackgroundColor}`,
-                  { "shadow-none": s.value },
+                  { "shadow-none": n.value },
                   o.footerBarClass
                 ])
               }, [
-                n(e.$slots, "footer", { scrolledToBottom: s.value }, void 0, !0)
+                i(e.$slots, "footer", { scrolledToBottom: n.value }, void 0, !0)
               ], 2)
             ], 2)
-          ], 2)) : n(e.$slots, "footer", {
+          ], 2)) : i(e.$slots, "footer", {
             key: 1,
-            scrolledToBottom: s.value
+            scrolledToBottom: n.value
           }, void 0, !0)
         ], 2)) : T("", !0)
       ], 2);
@@ -276,5 +282,5 @@ const J = { class: "flex-grow m-0 font-bold sm-down:text-md md:text-lg leading-n
   }
 });
 export {
-  Z as default
+  le as default
 };

package/dist/index138.js

@@ -1,7 +1,7 @@
-import { defineComponent as M, ref as h, computed as H, onMounted as A, onUnmounted as Q, watch as F, nextTick as O } from "vue";
-import { onClickOutside as W } from "./index173.js";
-import { useThrottleFn as k } from "./index184.js";
-const G = M({
+import { defineComponent as A, ref as h, computed as W, onMounted as Q, onUnmounted as F, watch as N, nextTick as O } from "vue";
+import { onClickOutside as k } from "./index173.js";
+import { useThrottleFn as I } from "./index184.js";
+const Z = A({
   name: "QPopover",
   props: {
     /** Aligns the popover accordingly with the trigger.
@@ -85,62 +85,63 @@ const G = M({
   },
   emits: ["update:modelValue"],
   setup(o, { emit: a }) {
-    const f = h(!1), d = h(""), u = h(null), g = h(null), V = h({
+    const f = h(!1), d = h(""), s = h(null), g = h(null), V = h({
       top: "0",
       left: "0",
       transform: "none"
-    }), p = H(() => f.value === !0 && o.reposition === !0 ? S(o.align) : o.align), y = H(() => f.value === !0 && o.reposition === !0 ? R(o.position) : o.position), S = (t) => {
-      if (!u.value) return t;
-      const e = o.teleport ? document.querySelector(".q-popover.teleported") : u.value.children[1];
+    }), p = W(() => f.value === !0 && o.reposition === !0 ? S(o.align) : o.align), y = W(() => f.value === !0 && o.reposition === !0 ? R(o.position) : o.position), S = (t) => {
+      if (!s.value) return t;
+      const e = o.teleport ? document.querySelector(".q-popover.teleported") : s.value.children[1];
       if (!e || w(e)) return t;
-      const n = u.value.children[0].getBoundingClientRect(), r = e.getBoundingClientRect();
+      const n = s.value.children[0].getBoundingClientRect(), u = e.getBoundingClientRect();
       if (t === "left" || t === "right" || t === "center") {
         const l = n.left;
-        return window.innerWidth - l < r.width ? "right" : "left";
+        return window.innerWidth - l < u.width ? "right" : "left";
       } else {
         const l = n.top;
-        return window.innerHeight - l < r.height ? "bottom" : "top";
+        return window.innerHeight - l < u.height ? "bottom" : "top";
       }
     }, R = (t) => {
-      if (!u.value) return t;
-      const e = o.teleport ? document.querySelector(".q-popover.teleported") : u.value.children[1];
+      if (!s.value) return t;
+      const e = o.teleport ? document.querySelector(".q-popover.teleported") : s.value.children[1];
       if (!e || w(e)) return t;
-      const n = u.value.children[0].getBoundingClientRect(), r = e.getBoundingClientRect();
+      const n = s.value.children[0].getBoundingClientRect(), u = e.getBoundingClientRect();
       if (t === "top" || t === "bottom") {
         const l = n.top;
-        return window.innerHeight - l < r.height ? "top" : "bottom";
+        return window.innerHeight - l < u.height ? "top" : "bottom";
       } else {
         const l = n.left;
-        return window.innerWidth - l < r.width ? "left" : "right";
+        return window.innerWidth - l < u.width ? "left" : "right";
       }
     }, w = (t) => {
       if (!t) return !1;
       const e = t.getBoundingClientRect();
       return e ? e.top >= 0 && e.left >= 0 && e.bottom <= (window.innerHeight || document.documentElement.clientHeight) && e.right <= (window.innerWidth || document.documentElement.clientWidth) : !1;
     }, q = () => {
-      if (!u.value) return !0;
-      const t = u.value.children[0];
+      if (!s.value) return !0;
+      const t = s.value.children[0];
       if (!t) return !0;
       const e = t.getBoundingClientRect();
       let n = t.parentElement;
       for (; n; ) {
-        const r = getComputedStyle(n), l = r.overflowY, i = r.overflowX;
-        if (l === "auto" || l === "scroll" || (i === "auto" || i === "scroll")) {
+        const r = getComputedStyle(n), c = r.overflowY, H = r.overflowX;
+        if (c === "auto" || c === "scroll" || (H === "auto" || H === "scroll")) {
           const v = n.getBoundingClientRect();
           if (!(e.bottom > v.top && e.top < v.bottom && e.right > v.left && e.left < v.right))
             return !1;
         }
         n = n.parentElement;
       }
-      return !0;
+      const u = window.innerHeight || document.documentElement.clientHeight, l = window.innerWidth || document.documentElement.clientWidth;
+      return e.bottom > 0 && e.top < u && e.right > 0 && e.left < l;
     }, B = () => {
       if (!o.teleport || !o.scrollIntoView || !o.modelValue) return;
       const t = document.querySelector(".q-popover.teleported");
       if (!t) return;
-      const e = t.getBoundingClientRect(), n = o.scrollIntoViewPadding, r = window.innerHeight, l = window.innerWidth;
-      let i = 0, c = 0;
-      e.bottom + n > r ? c = e.bottom + n - r : e.top - n < 0 && (c = e.top - n), e.right + n > l ? i = e.right + n - l : e.left - n < 0 && (i = e.left - n), (i !== 0 || c !== 0) && window.scrollBy({
-        top: c,
+      const e = t.getBoundingClientRect(), n = o.scrollIntoViewPadding, u = window.innerHeight, l = window.innerWidth;
+      let i = 0, r = 0;
+      e.bottom + n > u ? r = e.bottom + n - u : e.top - n < 0 && (r = e.top - n), e.right + n > l ? i = e.right + n - l : e.left - n < 0 && (i = e.left - n), (i !== 0 || r !== 0) && window.scrollBy({
+        top: r,
         left: i,
         behavior: "smooth"
       });
@@ -153,14 +154,14 @@ const G = M({
       }), g.value.observe(t));
     }, b = () => {
       g.value && (g.value.disconnect(), g.value = null);
-    }, I = () => {
-      (o.trigger === "click" || o.trigger === "both") && a("update:modelValue", !o.modelValue);
     }, P = () => {
-      o.trigger !== "click" && a("update:modelValue", !1);
+      (o.trigger === "click" || o.trigger === "both") && a("update:modelValue", !o.modelValue);
     }, T = () => {
-      o.trigger !== "click" && a("update:modelValue", !0);
+      o.trigger !== "click" && a("update:modelValue", !1);
     }, x = () => {
-      const t = u.value?.children[0];
+      o.trigger !== "click" && a("update:modelValue", !0);
+    }, L = () => {
+      const t = s.value?.children[0];
       if (t) {
         const e = t.clientWidth, n = t.clientHeight;
         switch (p.value) {
@@ -179,19 +180,19 @@ const G = M({
         }
       }
     }, m = () => {
-      if (!u.value || !o.teleport) return;
-      const t = u.value.children[0];
+      if (!s.value || !o.teleport) return;
+      const t = s.value.children[0];
       if (!t) return;
-      const e = t.getBoundingClientRect(), n = 10, r = y.value, l = p.value;
-      let i = 0, c = 0, s = "none";
-      r === "bottom" ? (i = e.bottom + n, l === "left" ? (c = e.left, s = "none") : l === "right" ? (c = e.right, s = "translateX(-100%)") : l === "center" && (c = e.left + e.width / 2, s = "translateX(-50%)")) : r === "top" ? (i = e.top - n, s = "translateY(-100%)", l === "left" ? c = e.left : l === "right" ? (c = e.right, s = "translate(-100%, -100%)") : l === "center" && (c = e.left + e.width / 2, s = "translate(-50%, -100%)")) : r === "left" ? (c = e.left - n, s = "translateX(-100%)", l === "top" ? i = e.top : l === "bottom" ? (i = e.bottom, s = "translate(-100%, -100%)") : l === "middle" && (i = e.top + e.height / 2, s = "translate(-100%, -50%)")) : r === "right" && (c = e.right + n, l === "top" ? (i = e.top, s = "none") : l === "bottom" ? (i = e.bottom, s = "translateY(-100%)") : l === "middle" && (i = e.top + e.height / 2, s = "translateY(-50%)")), V.value = {
+      const e = t.getBoundingClientRect(), n = 10, u = y.value, l = p.value;
+      let i = 0, r = 0, c = "none";
+      u === "bottom" ? (i = e.bottom + n, l === "left" ? (r = e.left, c = "none") : l === "right" ? (r = e.right, c = "translateX(-100%)") : l === "center" && (r = e.left + e.width / 2, c = "translateX(-50%)")) : u === "top" ? (i = e.top - n, c = "translateY(-100%)", l === "left" ? r = e.left : l === "right" ? (r = e.right, c = "translate(-100%, -100%)") : l === "center" && (r = e.left + e.width / 2, c = "translate(-50%, -100%)")) : u === "left" ? (r = e.left - n, c = "translateX(-100%)", l === "top" ? i = e.top : l === "bottom" ? (i = e.bottom, c = "translate(-100%, -100%)") : l === "middle" && (i = e.top + e.height / 2, c = "translate(-100%, -50%)")) : u === "right" && (r = e.right + n, l === "top" ? (i = e.top, c = "none") : l === "bottom" ? (i = e.bottom, c = "translateY(-100%)") : l === "middle" && (i = e.top + e.height / 2, c = "translateY(-50%)")), V.value = {
         top: `${i}px`,
-        left: `${c}px`,
-        transform: s
+        left: `${r}px`,
+        transform: c
       };
-    }, L = () => {
-      o.teleport && o.modelValue && m();
     }, X = () => {
+      o.teleport && o.modelValue && m();
+    }, Y = () => {
       if (o.teleport && o.modelValue) {
         if (o.closeOnScrollOutOfView && !q()) {
           a("update:modelValue", !1);
@@ -199,8 +200,8 @@ const G = M({
         }
         o.followScroll && m();
       }
-    }, C = k(L, 16, !0), E = k(X, 16, !0);
-    W(u, (t) => {
+    }, C = I(X, 16, !0), E = I(Y, 16, !0);
+    k(s, (t) => {
       if (o.teleport) {
         const e = document.querySelector(".q-popover.teleported");
         if (e && e.contains(t.target))
@@ -208,21 +209,21 @@ const G = M({
       }
       o.modelValue && a("update:modelValue", !1);
     });
-    function Y() {
+    function $() {
       f.value = !1, b();
     }
-    function $() {
+    function M() {
       f.value = !0, o.teleport ? O(() => {
         m(), o.scrollIntoView && setTimeout(() => {
           z(), B();
         }, 100);
-      }) : !w(u.value?.children[1]) && o.reposition === !0 && x();
+      }) : !w(s.value?.children[1]) && o.reposition === !0 && L();
     }
-    return A(() => {
+    return Q(() => {
       o.teleport && (window.addEventListener("resize", C), window.addEventListener("scroll", E, !0));
-    }), Q(() => {
+    }), F(() => {
       o.teleport && (window.removeEventListener("resize", C), window.removeEventListener("scroll", E, !0)), b();
-    }), F(
+    }), N(
       () => o.modelValue,
       (t) => {
         o.teleport && t && O(() => {
@@ -233,7 +234,7 @@ const G = M({
       // Refs
       entered: f,
       offsetStyle: d,
-      popover: u,
+      popover: s,
       teleportedStyle: V,
       // Computed
       alignment: p,
@@ -242,16 +243,16 @@ const G = M({
       getAlignment: S,
       getPositioning: R,
       isElementInView: w,
-      onAfterLeave: Y,
-      onClick: I,
-      onClickOutside: W,
-      onEnter: $,
-      onMouseLeave: P,
-      onMouseOver: T,
+      onAfterLeave: $,
+      onClick: P,
+      onClickOutside: k,
+      onEnter: M,
+      onMouseLeave: T,
+      onMouseOver: x,
       updateTeleportedPosition: m
     };
   }
 });
 export {
-  G as default
+  Z as default
 };

package/dist/index182.js

@@ -1,18 +1,18 @@
-import st from "./index240.js";
+import st from "./index213.js";
 import { reactive as V, watch as h, ref as g, defineComponent as Z, useSlots as H, h as K, Fragment as at, inject as ct, computed as A, toRaw as lt, unref as x } from "vue";
-import { unrefElement as ut, useIntersectionObserver as ft, useEventListener as m } from "./index241.js";
-import { tryOnUnmounted as pt, isObject as yt } from "./index242.js";
-import D, { getFrameData as dt } from "./index243.js";
-import { complex as $ } from "./index244.js";
-import { inertia as mt } from "./index245.js";
-import { animate as bt } from "./index246.js";
-import { velocityPerSecond as ht } from "./index247.js";
-import { number as vt, alpha as C, scale as j } from "./index248.js";
-import { filter as P } from "./index249.js";
-import { px as c, progressPercentage as F, degrees as O } from "./index250.js";
-import { color as b } from "./index251.js";
-import { cubicBezier as gt } from "./index252.js";
-import { bounceOut as Ot, bounceInOut as Tt, bounceIn as At, anticipate as xt, backOut as jt, backInOut as Vt, backIn as St, circOut as Ct, circInOut as Et, circIn as Nt, easeOut as Pt, easeInOut as _t, easeIn as wt, linear as Rt } from "./index253.js";
+import { unrefElement as ut, useIntersectionObserver as ft, useEventListener as m } from "./index214.js";
+import { tryOnUnmounted as pt, isObject as yt } from "./index215.js";
+import D, { getFrameData as dt } from "./index216.js";
+import { complex as $ } from "./index217.js";
+import { inertia as mt } from "./index218.js";
+import { animate as bt } from "./index219.js";
+import { velocityPerSecond as ht } from "./index220.js";
+import { number as vt, alpha as C, scale as j } from "./index221.js";
+import { filter as P } from "./index222.js";
+import { px as c, progressPercentage as F, degrees as O } from "./index223.js";
+import { color as b } from "./index224.js";
+import { cubicBezier as gt } from "./index225.js";
+import { bounceOut as Ot, bounceInOut as Tt, bounceIn as At, anticipate as xt, backOut as jt, backInOut as Vt, backIn as St, circOut as Ct, circInOut as Et, circIn as Nt, easeOut as Pt, easeInOut as _t, easeIn as wt, linear as Rt } from "./index226.js";
 const R = {};
 class Mt {
   subscriptions = /* @__PURE__ */ new Set();

package/dist/index183.js

@@ -1,7 +1,7 @@
-import g from "./index213.js";
+import g from "./index227.js";
 import { DomHandler as f, ObjectUtils as d } from "./index180.js";
-import v from "./index214.js";
-import S from "./index215.js";
+import v from "./index228.js";
+import S from "./index229.js";
 import { resolveDirective as A, openBlock as h, createElementBlock as p, mergeProps as b, Fragment as E, renderList as O, withDirectives as w, renderSlot as x, normalizeClass as K, createElementVNode as I, toDisplayString as D } from "vue";
 var V = {
   name: "BaseSelectButton",