@quoreadmin/ui 1.9.2 → 1.10.0

package/dist/index134.js

@@ -1,257 +0,0 @@
-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 "./index169.js";
-import { useThrottleFn as k } from "./index180.js";
-const G = M({
-  name: "QPopover",
-  props: {
-    /** Aligns the popover accordingly with the trigger.
-     * i.e. bottom, center, left, middle, right, top.
-     * Right, left or middle align goes with bottom or top position
-     * Top, bottom or center align goes with right or left position */
-    align: {
-      type: String,
-      default: "left"
-    },
-    /** Specifies whether to have a caret pointer or not. */
-    hasCaret: {
-      type: Boolean,
-      default: !0
-    },
-    /**  Toggles the content from the parent component. i.e. false, true. */
-    modelValue: {
-      type: Boolean,
-      default: !1
-    },
-    /** Positions the popover to the specified side of the trigger.
-     * i.e. bottom, left, right, top.
-     * Bottom or top position goes with right, left or middle align
-     * Right or left position goes with top, bottom or center align */
-    position: {
-      type: String,
-      default: "bottom"
-    },
-    /** Should the popover be repositioned and realigned automatically if it is outside viewport.
-     *  Moving element position from left to right, and top to bottom
-     * and alignment from right to left or top to bottom.
-    */
-    reposition: {
-      type: Boolean,
-      default: !0
-    },
-    /** Specifies the size of the popover. sm, md, lg, or filter-sm, filter-md, filter-lg for filter-style popovers. */
-    size: {
-      type: String,
-      default: "md"
-    },
-    /** Set if the popover is teleported to the teleportTo element (escapes overflow clipping) */
-    teleport: {
-      type: Boolean,
-      default: !1
-    },
-    /** Target element for teleport */
-    teleportTo: {
-      type: String,
-      default: "body"
-    },
-    /** Whether the teleported popover should follow the trigger on scroll.
-     * When true (default), popover repositions as user scrolls.
-     * When false, popover stays fixed at its initial opened position. */
-    followScroll: {
-      type: Boolean,
-      default: !0
-    },
-    /** Trigger popover on click, hover or both */
-    trigger: {
-      type: String,
-      default: "click"
-    },
-    /** Whether to close the popover when the trigger scrolls out of its scrollable parent.
-     * Useful for popovers inside scrollable containers to prevent orphaned popovers. */
-    closeOnScrollOutOfView: {
-      type: Boolean,
-      default: !1
-    },
-    /** Whether to scroll the page to bring the popover into view when it opens or content changes.
-     * Uses smooth scrolling and adds padding to ensure the popover isn't at the edge of the viewport. */
-    scrollIntoView: {
-      type: Boolean,
-      default: !1
-    },
-    /** Padding (in pixels) from viewport edge when scrolling popover into view. */
-    scrollIntoViewPadding: {
-      type: Number,
-      default: 20
-    }
-  },
-  emits: ["update:modelValue"],
-  setup(o, { emit: a }) {
-    const f = h(!1), d = h(""), u = 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];
-      if (!e || w(e)) return t;
-      const n = u.value.children[0].getBoundingClientRect(), r = e.getBoundingClientRect();
-      if (t === "left" || t === "right" || t === "center") {
-        const l = n.left;
-        return window.innerWidth - l < r.width ? "right" : "left";
-      } else {
-        const l = n.top;
-        return window.innerHeight - l < r.height ? "bottom" : "top";
-      }
-    }, R = (t) => {
-      if (!u.value) return t;
-      const e = o.teleport ? document.querySelector(".q-popover.teleported") : u.value.children[1];
-      if (!e || w(e)) return t;
-      const n = u.value.children[0].getBoundingClientRect(), r = e.getBoundingClientRect();
-      if (t === "top" || t === "bottom") {
-        const l = n.top;
-        return window.innerHeight - l < r.height ? "top" : "bottom";
-      } else {
-        const l = n.left;
-        return window.innerWidth - l < r.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 (!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 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;
-    }, 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,
-        left: i,
-        behavior: "smooth"
-      });
-    }, z = () => {
-      if (!o.teleport || !o.scrollIntoView) return;
-      b();
-      const t = document.querySelector(".q-popover.teleported");
-      t && (g.value = new ResizeObserver(() => {
-        setTimeout(B, 50);
-      }), 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);
-    }, T = () => {
-      o.trigger !== "click" && a("update:modelValue", !0);
-    }, x = () => {
-      const t = u.value?.children[0];
-      if (t) {
-        const e = t.clientWidth, n = t.clientHeight;
-        switch (p.value) {
-          case "left":
-            d.value = `margin-left: ${e / 2 - 10}px;`;
-            break;
-          case "right":
-            d.value = `margin-right: ${e / 2 - 10}px;`;
-            break;
-          case "top":
-            d.value = `margin-top: ${n / 2 - 10}px;`;
-            break;
-          case "bottom":
-            d.value = `margin-bottom: ${n / 2 - 10}px;`;
-            break;
-        }
-      }
-    }, m = () => {
-      if (!u.value || !o.teleport) return;
-      const t = u.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 = {
-        top: `${i}px`,
-        left: `${c}px`,
-        transform: s
-      };
-    }, L = () => {
-      o.teleport && o.modelValue && m();
-    }, X = () => {
-      if (o.teleport && o.modelValue) {
-        if (o.closeOnScrollOutOfView && !q()) {
-          a("update:modelValue", !1);
-          return;
-        }
-        o.followScroll && m();
-      }
-    }, C = k(L, 16, !0), E = k(X, 16, !0);
-    W(u, (t) => {
-      if (o.teleport) {
-        const e = document.querySelector(".q-popover.teleported");
-        if (e && e.contains(t.target))
-          return;
-      }
-      o.modelValue && a("update:modelValue", !1);
-    });
-    function Y() {
-      f.value = !1, b();
-    }
-    function $() {
-      f.value = !0, o.teleport ? O(() => {
-        m(), o.scrollIntoView && setTimeout(() => {
-          z(), B();
-        }, 100);
-      }) : !w(u.value?.children[1]) && o.reposition === !0 && x();
-    }
-    return A(() => {
-      o.teleport && (window.addEventListener("resize", C), window.addEventListener("scroll", E, !0));
-    }), Q(() => {
-      o.teleport && (window.removeEventListener("resize", C), window.removeEventListener("scroll", E, !0)), b();
-    }), F(
-      () => o.modelValue,
-      (t) => {
-        o.teleport && t && O(() => {
-          m();
-        });
-      }
-    ), {
-      // Refs
-      entered: f,
-      offsetStyle: d,
-      popover: u,
-      teleportedStyle: V,
-      // Computed
-      alignment: p,
-      positioning: y,
-      // Methods
-      getAlignment: S,
-      getPositioning: R,
-      isElementInView: w,
-      onAfterLeave: Y,
-      onClick: I,
-      onClickOutside: W,
-      onEnter: $,
-      onMouseLeave: P,
-      onMouseOver: T,
-      updateTeleportedPosition: m
-    };
-  }
-});
-export {
-  G as default
-};