@v-c/trigger 0.0.1

package/dist/hooks/useAlign.js

@@ -0,0 +1,257 @@
+import { isDOM as Ce } from "../util/dist/Dom/findDOMNode.js";
+import Le from "../util/dist/Dom/isVisible.js";
+import { rafDebounce as Ie } from "../util/dist/raf.js";
+import { reactive as Te, shallowRef as Fe, computed as Se, ref as je, watch as Ne, nextTick as Xt, watchEffect as We, toRefs as $e } from "vue";
+import { collectScroller as Ee, getWin as He, getVisibleArea as Yt, toNum as Pt } from "../util.js";
+function Bt(o, c = 0) {
+  const f = `${c}`, a = f.match(/^(.*)\%$/);
+  return a ? o * (parseFloat(a[1]) / 100) : parseFloat(f);
+}
+function Mt(o, c) {
+  const [f, a] = c || [];
+  return [
+    Bt(o.width, f),
+    Bt(o.height, a)
+  ];
+}
+function Ot(o = "") {
+  return [o[0], o[1]];
+}
+function O(o, c) {
+  const f = c[0], a = c[1];
+  let y, R;
+  return f === "t" ? R = o.y : f === "b" ? R = o.y + o.height : R = o.y + o.height / 2, a === "l" ? y = o.x : a === "r" ? y = o.x + o.width : y = o.x + o.width / 2, { x: y, y: R };
+}
+function b(o, c) {
+  const f = {
+    t: "b",
+    b: "t",
+    l: "r",
+    r: "l"
+  };
+  return o.map((a, y) => y === c ? f[a] || "c" : a).join("");
+}
+function Ke(o, c, f, a, y, R, Vt, G) {
+  const D = Te({
+    ready: !1,
+    offsetX: 0,
+    offsetY: 0,
+    offsetR: 0,
+    offsetB: 0,
+    arrowX: 0,
+    arrowY: 0,
+    scaleX: 1,
+    scaleY: 1,
+    align: y.value[a.value] || {}
+  }), _ = Fe(0), J = Se(() => !c.value || G?.value ? [] : Ee(c.value)), u = je({}), Ct = () => {
+    u.value = {};
+  }, Lt = Ie(() => {
+    if (c.value && f.value && o.value && !G?.value) {
+      let h = function(t, p, g = it) {
+        const At = n.x + t, Rt = n.y + p, Ye = At + Y, Pe = Rt + X, Be = Math.max(At, g.left), Me = Math.max(Rt, g.top), Oe = Math.min(Ye, g.right), Ve = Math.min(Pe, g.bottom);
+        return Math.max(0, (Oe - Be) * (Ve - Me));
+      }, Q = function() {
+        F = n.y + r, E = F + X, S = n.x + l, H = S + Y;
+      };
+      const e = c.value, Z = e.ownerDocument, tt = He(e), { position: _t } = tt.getComputedStyle(e), kt = e.style.left, Ut = e.style.top, qt = e.style.right, zt = e.style.bottom, Gt = e.style.overflow, V = {
+        ...y.value[a.value],
+        ...R?.value
+      }, w = Z.createElement("div");
+      e.parentElement?.appendChild(w), w.style.left = `${e.offsetLeft}px`, w.style.top = `${e.offsetTop}px`, w.style.position = _t, w.style.height = `${e.offsetHeight}px`, w.style.width = `${e.offsetWidth}px`, e.style.left = "0", e.style.top = "0", e.style.right = "auto", e.style.bottom = "auto", e.style.overflow = "hidden";
+      let i;
+      if (Array.isArray(f.value))
+        i = {
+          x: f.value[0],
+          y: f.value[1],
+          width: 0,
+          height: 0
+        };
+      else {
+        const t = f.value.getBoundingClientRect();
+        t.x = t.x ?? t.left, t.y = t.y ?? t.top, i = {
+          x: t.x,
+          y: t.y,
+          width: t.width,
+          height: t.height
+        };
+      }
+      const n = e.getBoundingClientRect(), { height: Jt, width: Kt } = tt.getComputedStyle(e);
+      n.x = n.x ?? n.left, n.y = n.y ?? n.top;
+      const {
+        clientWidth: Qt,
+        clientHeight: Zt,
+        scrollWidth: te,
+        scrollHeight: ee,
+        scrollTop: et,
+        scrollLeft: ot
+      } = Z.documentElement, X = n.height, Y = n.width, C = i.height, L = i.width, oe = {
+        left: 0,
+        top: 0,
+        right: Qt,
+        bottom: Zt
+      }, se = {
+        left: -ot,
+        top: -et,
+        right: te - ot,
+        bottom: ee - et
+      };
+      let { htmlRegion: I } = V;
+      const st = "visible", nt = "visibleFirst";
+      I !== "scroll" && I !== nt && (I = st);
+      const T = I === nt, ne = Yt(se, J.value), s = Yt(oe, J.value), it = I === st ? s : ne, W = T ? s : it;
+      e.style.left = "auto", e.style.top = "auto", e.style.right = "0", e.style.bottom = "0";
+      const lt = e.getBoundingClientRect();
+      e.style.left = kt, e.style.top = Ut, e.style.right = qt, e.style.bottom = zt, e.style.overflow = Gt, e.parentElement?.removeChild(w);
+      const P = Pt(
+        Math.round(Y / parseFloat(Kt) * 1e3) / 1e3
+      ), B = Pt(
+        Math.round(X / parseFloat(Jt) * 1e3) / 1e3
+      );
+      if (P === 0 || B === 0 || Ce(f) && !Le(f))
+        return;
+      const { offset: ie, targetOffset: le } = V;
+      let [d, v] = Mt(n, ie);
+      const [re, fe] = Mt(
+        i,
+        le
+      );
+      i.x -= re, i.y -= fe;
+      const [ce, ae] = V.points || [], A = Ot(ae), m = Ot(ce), rt = O(i, A), ft = O(n, m), M = {
+        ...V
+      };
+      let l = rt.x - ft.x + d, r = rt.y - ft.y + v;
+      const x = h(
+        l,
+        r
+      ), $ = h(
+        l,
+        r,
+        s
+      ), ct = O(i, ["t", "l"]), at = O(n, ["t", "l"]), ut = O(i, ["b", "r"]), pt = O(n, ["b", "r"]), ue = V.overflow || {}, { adjustX: pe, adjustY: he, shiftX: ht, shiftY: gt } = ue, mt = (t) => typeof t == "boolean" ? t : t >= 0;
+      let F, E, S, H;
+      Q();
+      const yt = mt(he), dt = m[0] === A[0];
+      if (yt && m[0] === "t" && (E > W.bottom || u.value.bt)) {
+        let t = r;
+        dt ? t -= X - C : t = ct.y - pt.y - v;
+        const p = h(
+          l,
+          t
+        ), g = h(
+          l,
+          t,
+          s
+        );
+        // Of course use larger one
+        p > x || p === x && (!T || g >= $) ? (u.value.bt = !0, r = t, v = -v, M.points = [
+          b(m, 0),
+          b(A, 0)
+        ]) : u.value.bt = !1;
+      }
+      if (yt && m[0] === "b" && (F < W.top || u.value.tb)) {
+        let t = r;
+        dt ? t += X - C : t = ut.y - at.y - v;
+        const p = h(
+          l,
+          t
+        ), g = h(
+          l,
+          t,
+          s
+        );
+        // Of course use larger one
+        p > x || p === x && (!T || g >= $) ? (u.value.tb = !0, r = t, v = -v, M.points = [
+          b(m, 0),
+          b(A, 0)
+        ]) : u.value.tb = !1;
+      }
+      const vt = mt(pe), xt = m[1] === A[1];
+      if (vt && m[1] === "l" && (H > W.right || u.value.rl)) {
+        let t = l;
+        xt ? t -= Y - L : t = ct.x - pt.x - d;
+        const p = h(
+          t,
+          r
+        ), g = h(
+          t,
+          r,
+          s
+        );
+        // Of course use larger one
+        p > x || p === x && (!T || g >= $) ? (u.value.rl = !0, l = t, d = -d, M.points = [
+          b(m, 1),
+          b(A, 1)
+        ]) : u.value.rl = !1;
+      }
+      if (vt && m[1] === "r" && (S < W.left || u.value.lr)) {
+        let t = l;
+        xt ? t += Y - L : t = ut.x - at.x - d;
+        const p = h(
+          t,
+          r
+        ), g = h(
+          t,
+          r,
+          s
+        );
+        // Of course use larger one
+        p > x || p === x && (!T || g >= $) ? (u.value.lr = !0, l = t, d = -d, M.points = [
+          b(m, 1),
+          b(A, 1)
+        ]) : u.value.lr = !1;
+      }
+      Q();
+      const j = ht === !0 ? 0 : ht;
+      typeof j == "number" && (S < s.left && (l -= S - s.left - d, i.x + L < s.left + j && (l += i.x - s.left + L - j)), H > s.right && (l -= H - s.right - d, i.x > s.right - j && (l += i.x - s.right + j)));
+      const N = gt === !0 ? 0 : gt;
+      typeof N == "number" && (F < s.top && (r -= F - s.top - v, i.y + C < s.top + N && (r += i.y - s.top + C - N)), E > s.bottom && (r -= E - s.bottom - v, i.y > s.bottom - N && (r += i.y - s.bottom + N)));
+      const k = n.x + l, ge = k + Y, U = n.y + r, me = U + X, bt = i.x, ye = bt + L, wt = i.y, de = wt + C, ve = Math.max(k, bt), xe = Math.min(ge, ye), be = (ve + xe) / 2 - k, we = Math.max(U, wt), Ae = Math.min(me, de), Re = (we + Ae) / 2 - U;
+      Vt?.(c.value, M);
+      let q = lt.right - n.x - (l + n.width), z = lt.bottom - n.y - (r + n.height);
+      P === 1 && (l = Math.round(l), q = Math.round(q)), B === 1 && (r = Math.round(r), z = Math.round(z));
+      const Xe = {
+        ready: !0,
+        offsetX: l / P,
+        offsetY: r / B,
+        offsetR: q / P,
+        offsetB: z / B,
+        arrowX: be / P,
+        arrowY: Re / B,
+        scaleX: P,
+        scaleY: B,
+        align: M
+      };
+      Object.assign(D, Xe);
+    }
+  }), It = () => {
+    _.value += 1;
+    const h = _.value;
+    Promise.resolve().then(() => {
+      _.value === h && Lt();
+    });
+  }, K = () => {
+    D.ready = !1;
+  };
+  Ne(a, async () => {
+    await Xt(), K();
+  }), We(async () => {
+    await Xt(), o.value || (Ct(), K());
+  });
+  const { ready: Tt, offsetX: Ft, offsetR: St, offsetY: jt, offsetB: Nt, align: Wt, arrowY: $t, arrowX: Et, scaleY: Ht, scaleX: Dt } = $e(D);
+  return [
+    Tt,
+    Ft,
+    jt,
+    St,
+    Nt,
+    Et,
+    $t,
+    Dt,
+    Ht,
+    Wt,
+    It
+  ];
+}
+export {
+  Ke as default
+};

package/dist/hooks/useDelay.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("vue");function r(){const e=o.ref(null),u=()=>{e.value&&(clearTimeout(e.value),e.value=null)},n=(l,t)=>{u(),t===0?l():e.value=setTimeout(()=>{l()},t*1e3)};return o.onBeforeUnmount(()=>{u()}),n}exports.default=r;

package/dist/hooks/useDelay.d.ts

@@ -0,0 +1 @@
+export default function useDelay(): (callback: VoidFunction, delay: number) => void;

package/dist/hooks/useDelay.js

@@ -0,0 +1,16 @@
+import { ref as t, onBeforeUnmount as a } from "vue";
+function f() {
+  const e = t(null), l = () => {
+    e.value && (clearTimeout(e.value), e.value = null);
+  }, n = (o, u) => {
+    l(), u === 0 ? o() : e.value = setTimeout(() => {
+      o();
+    }, u * 1e3);
+  };
+  return a(() => {
+    l();
+  }), n;
+}
+export {
+  f as default
+};

package/dist/hooks/useOffsetStyle.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const m=require("vue");function d(u,a,s,o,i,r,v,c){const t="auto";return m.computed(()=>{const e=u.value?{}:{left:"-1000vw",top:"-1000vh",right:t,bottom:t};if(!u.value&&(a.value||!s.value)){const{points:l}=o.value??{},n=o.value?.dynamicInset||o.value?._experimental?.dynamicInset,f=n&&l?.[0]?.[1]==="r",p=n&&l?.[0]?.[0]==="b";f?(e.right=`${i.value}px`,e.left=t):(e.left=`${v.value}px`,e.right=t),p?(e.bottom=`${r.value}px`,e.top=t):(e.top=`${c.value}px`,e.bottom=t)}return e})}exports.default=d;

package/dist/hooks/useOffsetStyle.d.ts

@@ -0,0 +1,3 @@
+import { CSSProperties, Ref } from 'vue';
+import { AlignType } from '../interface.ts';
+export default function useOffsetStyle(isMobile: Ref<boolean>, ready: Ref<boolean>, open: Ref<boolean>, align: Ref<AlignType | undefined>, offsetR: Ref<number>, offsetB: Ref<number>, offsetX: Ref<number>, offsetY: Ref<number>): import('vue').ComputedRef<CSSProperties>;

package/dist/hooks/useOffsetStyle.js

@@ -0,0 +1,20 @@
+import { computed as m } from "vue";
+function d(l, u, s, o, f, v, i, p) {
+  const e = "auto";
+  return m(() => {
+    const t = l.value ? {} : {
+      left: "-1000vw",
+      top: "-1000vh",
+      right: e,
+      bottom: e
+    };
+    if (!l.value && (u.value || !s.value)) {
+      const { points: a } = o.value ?? {}, n = o.value?.dynamicInset || o.value?._experimental?.dynamicInset, r = n && a?.[0]?.[1] === "r", c = n && a?.[0]?.[0] === "b";
+      r ? (t.right = `${f.value}px`, t.left = e) : (t.left = `${i.value}px`, t.right = e), c ? (t.bottom = `${v.value}px`, t.top = e) : (t.top = `${p.value}px`, t.bottom = e);
+    }
+    return t;
+  });
+}
+export {
+  d as default
+};

package/dist/hooks/useWatch.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("vue"),s=require("../util.cjs");function L(n,t,l,o,v){a.watch([n,t,l],async(m,h,d)=>{if(await a.nextTick(),n.value&&t.value&&l.value){let e=function(){o(),v()};const f=t.value,i=l.value,E=s.collectScroller(f),S=s.collectScroller(i),r=s.getWin(i),u=new Set([r,...E,...S]);u.forEach(c=>{c.addEventListener("scroll",e,{passive:!0})}),r.addEventListener("resize",e,{passive:!0}),o(),d(()=>{u.forEach(c=>{c.removeEventListener("scroll",e),r.removeEventListener("resize",e)})})}})}exports.default=L;

package/dist/hooks/useWatch.d.ts

@@ -0,0 +1,2 @@
+import { Ref } from 'vue';
+export default function useWatch(open: Ref<boolean>, target: Ref<HTMLElement>, popup: Ref<HTMLElement>, onAlign: VoidFunction, onScroll: VoidFunction): void;

package/dist/hooks/useWatch.js

@@ -0,0 +1,26 @@
+import { watch as L, nextTick as d } from "vue";
+import { collectScroller as a, getWin as S } from "../util.js";
+function y(s, t, r, c, v) {
+  L([s, t, r], async (h, p, u) => {
+    if (await d(), s.value && t.value && r.value) {
+      let e = function() {
+        c(), v();
+      };
+      const f = t.value, l = r.value, m = a(f), E = a(l), n = S(l), i = /* @__PURE__ */ new Set([
+        n,
+        ...m,
+        ...E
+      ]);
+      i.forEach((o) => {
+        o.addEventListener("scroll", e, { passive: !0 });
+      }), n.addEventListener("resize", e, { passive: !0 }), c(), u(() => {
+        i.forEach((o) => {
+          o.removeEventListener("scroll", e), n.removeEventListener("resize", e);
+        });
+      });
+    }
+  });
+}
+export {
+  y as default
+};

package/dist/hooks/useWinClick.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const x=require("../util/dist/warning.cjs"),D=require("../util/dist/Dom/shadow.cjs"),r=require("vue"),N=require("../util.cjs");function S(a,v,l,f,w,m,g,p){const d=r.shallowRef(a.value);r.watchEffect(()=>{d.value=a.value});const u=r.shallowRef(!1);r.watch([v,l,f,w,m],([L,s,i,R,E],_,P)=>{if(L&&i&&(!R||E)){const c=()=>{u.value=!1},e=n=>{d.value&&!g(n.composedPath?.()?.[0]||n.target)&&!u.value&&p(!1)},t=N.getWin(i);t.addEventListener("pointerdown",c,!0),t.addEventListener("mousedown",e,!0),t.addEventListener("contextmenu",e,!0);const o=D.getShadowRoot(s);if(o&&(o.addEventListener("mousedown",e,!0),o.addEventListener("contextmenu",e,!0)),process.env.NODE_ENV!=="production"&&s){const n=s.getRootNode?.(),q=i.getRootNode?.();x.default(n===q,"trigger element and popup element should in same shadow root.")}P(()=>{t.removeEventListener("pointerdown",c,!0),t.removeEventListener("mousedown",e,!0),t.removeEventListener("contextmenu",e,!0),o&&(o.removeEventListener("mousedown",e,!0),o.removeEventListener("contextmenu",e,!0))})}});function h(){u.value=!0}return h}exports.default=S;

package/dist/hooks/useWinClick.d.ts

@@ -0,0 +1,6 @@
+import { Ref } from 'vue';
+/**
+ * Close if click on the window.
+ * Return the function that click on the Popup element.
+ */
+export default function useWinClick(open: Ref<boolean>, clickToHide: Ref<boolean>, targetEle: Ref<HTMLElement>, popupEle: Ref<HTMLElement>, mask: Ref<boolean>, maskClosable: Ref<boolean>, inPopupOrChild: (target: EventTarget) => boolean, triggerOpen: (open: boolean) => void): () => void;

package/dist/hooks/useWinClick.js

@@ -0,0 +1,50 @@
+import D from "../util/dist/warning.js";
+import { getShadowRoot as N } from "../util/dist/Dom/shadow.js";
+import { shallowRef as m, watchEffect as C, watch as S } from "vue";
+import { getWin as W } from "../util.js";
+function b(i, v, c, f, w, p, l, L) {
+  const a = m(i.value);
+  C(() => {
+    a.value = i.value;
+  });
+  const r = m(!1);
+  S(
+    [v, c, f, w, p],
+    ([E, s, u, R, h], _, x) => {
+      if (E && u && (!R || h)) {
+        const d = () => {
+          r.value = !1;
+        }, e = (n) => {
+          a.value && !l(n.composedPath?.()?.[0] || n.target) && !r.value && L(!1);
+        }, t = W(u);
+        t.addEventListener("pointerdown", d, !0), t.addEventListener("mousedown", e, !0), t.addEventListener("contextmenu", e, !0);
+        const o = N(s);
+        if (o && (o.addEventListener("mousedown", e, !0), o.addEventListener("contextmenu", e, !0)), process.env.NODE_ENV !== "production" && s) {
+          const n = s.getRootNode?.(), P = u.getRootNode?.();
+          D(
+            n === P,
+            "trigger element and popup element should in same shadow root."
+          );
+        }
+        x(() => {
+          t.removeEventListener("pointerdown", d, !0), t.removeEventListener("mousedown", e, !0), t.removeEventListener("contextmenu", e, !0), o && (o.removeEventListener(
+            "mousedown",
+            e,
+            !0
+          ), o.removeEventListener(
+            "contextmenu",
+            e,
+            !0
+          ));
+        });
+      }
+    }
+  );
+  function g() {
+    r.value = !0;
+  }
+  return g;
+}
+export {
+  b as default
+};

package/dist/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue"),fe=require("./portal/dist/Portal.cjs"),Qe=require("./resize-observer/dist/index.cjs");require("./util/dist/warning.cjs");const re=require("./util/dist/classnames.cjs"),k=require("./util/dist/Dom/findDOMNode.cjs"),ce=require("./util/dist/Dom/shadow.cjs"),Ze=require("./util/dist/props-util/index.cjs"),H=require("./context.cjs"),et=require("./hooks/useAction.cjs"),tt=require("./hooks/useAlign.cjs"),ut=require("./hooks/useDelay.cjs"),nt=require("./hooks/useWatch.cjs"),ot=require("./hooks/useWinClick.cjs"),lt=require("./Popup/index.cjs"),at=require("./util.cjs"),it=require("./UniqueProvider/index.cjs");function st(C){return typeof C=="function"||Object.prototype.toString.call(C)==="[object Object]"&&!t.isVNode(C)}const rt={prefixCls:"vc-trigger-popup",action:"hover",mouseLeaveDelay:.1,maskClosable:!0,builtinPlacements:{},popupVisible:void 0,defaultPopupVisible:void 0};function de(C=fe.default){return t.defineComponent((u,{expose:ve,slots:ge,attrs:$})=>{const me=t.computed(()=>u.autoDestroy??!1),O=t.computed(()=>u.popupVisible===void 0),X=t.computed(()=>!!u.mobile),E=t.ref({}),R=H.useTriggerContext(),he=t.computed(()=>({registerSubPopup(e,n){n?E.value[e]=n:delete E.value[e],R?.value.registerSubPopup(e,n)}})),p=H.useUniqueContext(),Y=t.useId(),f=t.shallowRef(null),U=t.shallowRef(null),W=e=>{if(!e)return null;if(k.isDOM(e))return e;const n=e;if(k.isDOM(n?.$el))return n.$el;const a=n?.nativeElement;if(k.isDOM(a?.value))return a.value;if(k.isDOM(a))return a;if(typeof n?.getElement=="function"){const d=n.getElement();if(k.isDOM(d))return d}return null},ye=e=>{const n=W(e);U.value=n,f.value!==n&&(f.value=n),R?.value?.registerSubPopup(Y,n??null)},l=t.shallowRef(null),V=t.shallowRef(null),Pe=e=>{const n=W(e);n&&l.value!==n?(l.value=n,V.value=n):n||(l.value=null,V.value=null)},_=t.computed(()=>Ze.filterEmpty(ge?.default?.()??[])?.[0]),h=t.computed(()=>_?.value?.props||{}),J=t.shallowRef({}),G=t.shallowRef({}),qe=t.computed(()=>({...J.value,...G.value})),Ce=e=>{const n=l.value;return n?.contains(e)||n&&ce.getShadowRoot(n)?.host===e||e===n||f.value?.contains(e)||f.value&&ce.getShadowRoot(f.value)?.host===e||e===f.value||Object.values(E.value).some(a=>a?.contains(e)||e===a)},K=t.computed(()=>u.arrow?{...u?.arrow!==!0?u?.arrow:{}}:null),A=t.shallowRef(u?.defaultPopupVisible??!1);u.popupVisible!==void 0&&(A.value=u.popupVisible);const o=t.computed(()=>u?.popupVisible??A.value),we=e=>{O.value&&(A.value=e)},Q=()=>o.value;t.watch(()=>u.popupVisible,async e=>{e!==void 0&&(await t.nextTick(),A.value=e)});const Z=(e=0)=>({popup:u.popup,target:l.value,delay:e,prefixCls:u.prefixCls,popupClassName:u.popupClassName,uniqueContainerClassName:u.uniqueContainerClassName,uniqueContainerStyle:u.uniqueContainerStyle,popupStyle:u.popupStyle,popupPlacement:u.popupPlacement,builtinPlacements:u.builtinPlacements,popupAlign:u.popupAlign,zIndex:u.zIndex,mask:u.mask,maskClosable:u.maskClosable,popupMotion:u.popupMotion,maskMotion:u.maskMotion,arrow:K.value,getPopupContainer:u.getPopupContainer,getPopupClassNameFromAlign:u.getPopupClassNameFromAlign,id:Y});t.watch([o,l],()=>{if(p&&u.unique&&l.value&&!O.value&&!R?.value)if(o.value){const e=u.mouseEnterDelay??0;p?.show(Z(e),Q)}else p?.hide(u.mouseLeaveDelay||0)});const v=t.shallowRef(o.value),w=t.shallowRef([]);w.value=[],t.watchEffect(()=>{v.value=o.value,o.value||(w.value=[])});const ee=e=>{we(e),(w.value[w.value.length-1]??o.value)!==e&&(w.value.push(e),u?.onOpenChange?.(e),u?.onPopupVisibleChange?.(e))},te=ut.default(),s=(e,n=0)=>{if(u.popupVisible!==void 0){te(()=>{ee(e)},n);return}if(p&&u.unique&&O.value&&!R?.value){e?p?.show(Z(n),Q):p.hide(n);return}te(()=>{ee(e)},n)},g=t.shallowRef(!1);console.log("inMotion"),t.watch(o,async()=>{await t.nextTick(),o.value&&(console.log("inMotion opened"),g.value=!0)});const b=t.shallowRef(),x=t.ref(null),F=e=>{x.value=[e.clientX,e.clientY]},[be,Me,ke,Re,Ae,xe,Se,De,Te,B,j]=tt.default(o,f,t.computed(()=>u?.alignPoint&&x.value!==null?x.value:l.value),t.computed(()=>u?.popupPlacement),t.computed(()=>u?.builtinPlacements),t.computed(()=>u?.popupAlign),u?.onPopupAlign,X),[M,y]=et.default(t.computed(()=>u.action),t.computed(()=>u.showAction),t.computed(()=>u.hideAction)),ue=t.computed(()=>M.value?.has("click")),S=t.computed(()=>y.value?.has("click")||y.value?.has("contextmenu")),P=()=>{g.value||j()},Ne=()=>{v.value&&u?.alignPoint&&S.value&&s(!1)};nt.default(o,l,f,P,Ne),t.watch([x,()=>u.popupPlacement],async()=>{await t.nextTick(),P()}),t.watch(()=>JSON.stringify(u.popupAlign),async()=>{await t.nextTick();const{builtinPlacements:e,popupPlacement:n}=u;o.value&&!e?.[n]&&P()});const Oe=t.computed(()=>{const e=at.getAlignPopupClassName(u.builtinPlacements,u.prefixCls,B.value,u.alignPoint);return re.default(e,u?.getPopupClassNameFromAlign?.(B.value))});ve({nativeElement:V,popupElement:U,forceAlign:P});const ne=t.shallowRef(0),oe=t.shallowRef(0),le=()=>{if(u.stretch&&l.value){const e=l.value.getBoundingClientRect();ne.value=e.width,oe.value=e.height}},Ee=()=>{le(),P()},Ve=e=>{g.value=!1,j(),u?.afterOpenChange?.(e),u?.afterPopupVisibleChange?.(e)},Fe=()=>new Promise(e=>{le(),b.value=e});t.watch([b],()=>{b.value&&(j(),b.value(),b.value=void 0)});function q(e,n,a,d,m,i){e[n]=(r,...c)=>{(!i||!i())&&(m?.(r),s(a,d)),h.value[n]?.(r,...c)}}const ae=t.computed(()=>M.value?.has("touch")),z=t.computed(()=>y.value?.has("touch")),I=t.shallowRef(!1);t.watchEffect(()=>{const e={};(ae.value||z.value)&&(e.onTouchStart=(...n)=>{I.value=!0,v.value&&z.value?s(!1):!v.value&&ae.value&&s(!0),h.value.onTouchStart?.(...n)}),(ue.value||S.value)&&(e.onClick=(n,...a)=>{v.value&&S.value?s(!1):!v.value&&ue.value&&(F(n),s(!0)),h.value?.onClick?.(n,...a),I.value=!1}),J.value=e});const Be=ot.default(o,t.computed(()=>S.value||z.value),l,f,t.computed(()=>u.mask),t.computed(()=>u.maskClosable),Ce,s),je=t.computed(()=>M.value?.has("hover")),ze=t.computed(()=>y.value?.has("hover"));let D,L;const T=()=>I.value;t.watchEffect(()=>{const{mouseEnterDelay:e,mouseLeaveDelay:n,alignPoint:a,focusDelay:d,blurDelay:m}=u,i={};if(je.value){const r=c=>{F(c)};q(i,"onMouseenter",!0,e,r,T),q(i,"onPointerenter",!0,e,r,T),D=c=>{(o.value||g.value)&&f?.value?.contains(c.target)&&s(!0,e)},a&&(i.onMouseMove=c=>{h.value.onMouseMove?.(c)})}else D=void 0;ze.value?(q(i,"onMouseleave",!1,n,void 0,T),q(i,"onPointerleave",!1,n,void 0,T),L=()=>{s(!1,n)}):L=void 0,M.value.has("focus")&&q(i,"onFocus",!0,d),y.value.has("focus")&&q(i,"onBlur",!1,m),M.value.has("contextmenu")&&(i.onContextmenu=(r,...c)=>{v.value&&y.value.has("contextmenu")?s(!1):(F(r),s(!0)),r.preventDefault(),h.value.onContextMenu?.(r,...c)}),G.value=i});const ie=t.shallowRef(!1);return t.watchEffect(()=>{ie.value||=u.forceRender||o.value||g.value}),()=>{const e={...h.value,...qe.value},n={};["onContextmenu","onClick","onMousedown","onTouchstart","onMouseenter","onMouseleave","onFocus","onBlur"].forEach(N=>{$[N]&&(n[N]=(...se)=>{e[N]?.(...se),$[N](...se)})});const d={x:xe.value,y:Se.value},m=t.createVNode(_.value,{...e,...n,ref:Pe}),{unique:i,prefixCls:r,popup:c,popupClassName:Ie,popupStyle:Le,zIndex:He,fresh:$e,onPopupClick:Xe,mask:Ye,popupMotion:Ue,maskMotion:We,forceRender:_e,getPopupContainer:Je,stretch:Ge,mobile:Ke}=u;return console.log(g.value),t.createVNode(t.Fragment,null,[t.createVNode(Qe.default,{disabled:!o.value,onResize:Ee},st(m)?m:{default:()=>[m]}),ie.value&&l.value&&(!p||!i)&&t.createVNode(H.TriggerContextProvider,he.value,{default:()=>[t.createVNode(lt.default,{portal:C,ref:ye,prefixCls:r,popup:c,className:re.default(Ie,!X.value&&Oe.value),style:Le,target:l.value,onMouseEnter:D,onMouseLeave:L,onPointerEnter:D,zIndex:He,open:o.value,keepDom:g.value,fresh:$e,onClick:Xe,onPointerDownCapture:Be,mask:Ye,motion:Ue,maskMotion:We,onVisibleChanged:Ve,onPrepare:Fe,forceRender:_e,autoDestroy:me.value,getPopupContainer:Je,align:B.value,arrow:K.value,arrowPos:d,ready:be.value,offsetX:Me.value,offsetY:ke.value,offsetR:Re.value,offsetB:Ae.value,onAlign:P,stretch:Ge,targetWidth:ne.value/De.value,targetHeight:oe.value/Te.value,mobile:Ke},null)]})])}},{props:t.mergeDefaults({action:{type:[String,Array],required:!1},showAction:{type:Array,required:!1},hideAction:{type:Array,required:!1},prefixCls:{type:String,required:!1},zIndex:{type:Number,required:!1},onPopupAlign:{type:Function,required:!1},stretch:{type:String,required:!1},popupVisible:{type:Boolean,required:!1},defaultPopupVisible:{type:Boolean,required:!1},onOpenChange:{type:Function,required:!1},afterOpenChange:{type:Function,required:!1},onPopupVisibleChange:{type:Function,required:!1},afterPopupVisibleChange:{type:Function,required:!1},getPopupContainer:{type:Function,required:!1},forceRender:{type:Boolean,required:!1},autoDestroy:{type:Boolean,required:!1},mask:{type:Boolean,required:!1},maskClosable:{type:Boolean,required:!1},popupMotion:{type:Object,required:!1},maskMotion:{type:Object,required:!1},mouseEnterDelay:{type:Number,required:!1},mouseLeaveDelay:{type:Number,required:!1},focusDelay:{type:Number,required:!1},blurDelay:{type:Number,required:!1},popup:{type:[String,Number,null,Array,Function],required:!0,skipCheck:!0},popupPlacement:{type:String,required:!1},builtinPlacements:{type:Object,required:!1},popupAlign:{type:Object,required:!1},popupClassName:{type:String,required:!1},uniqueContainerClassName:{type:String,required:!1},uniqueContainerStyle:{type:null,required:!1},popupStyle:{type:null,required:!1},getPopupClassNameFromAlign:{type:Function,required:!1},onPopupClick:{type:Function,required:!1},alignPoint:{type:Boolean,required:!1},fresh:{type:Boolean,required:!1},unique:{type:Boolean,required:!1},arrow:{type:[Boolean,Object],required:!1},mobile:{type:Object,required:!1}},rt)})}const pe=de(fe.default);exports.UniqueProvider=it.default;exports.Trigger=pe;exports.default=pe;exports.generateTrigger=de;

package/dist/index.d.ts

@@ -0,0 +1,78 @@
+import { VueNode } from '../../util/src/type';
+import { CSSMotionProps } from '../../util/src/utils/transition';
+import { CSSProperties } from 'vue';
+import { ActionType, AlignType, ArrowTypeOuter, BuildInPlacements } from './interface';
+import { MobileConfig } from './Popup';
+export type { ActionType, AlignType, ArrowTypeOuter as ArrowType, BuildInPlacements, };
+export interface TriggerRef {
+    nativeElement: HTMLElement;
+    popupElement: HTMLDivElement;
+    forceAlign: VoidFunction;
+}
+export interface TriggerProps {
+    action?: ActionType | ActionType[];
+    showAction?: ActionType[];
+    hideAction?: ActionType[];
+    prefixCls?: string;
+    zIndex?: number;
+    onPopupAlign?: (element: HTMLElement, align: AlignType) => void;
+    stretch?: string;
+    popupVisible?: boolean;
+    defaultPopupVisible?: boolean;
+    onOpenChange?: (visible: boolean) => void;
+    afterOpenChange?: (visible: boolean) => void;
+    /** @deprecated Use `onOpenChange` instead */
+    onPopupVisibleChange?: (visible: boolean) => void;
+    /** @deprecated Use `afterOpenChange` instead */
+    afterPopupVisibleChange?: (visible: boolean) => void;
+    getPopupContainer?: (node: HTMLElement) => HTMLElement;
+    forceRender?: boolean;
+    autoDestroy?: boolean;
+    mask?: boolean;
+    maskClosable?: boolean;
+    /** Set popup motion. You can ref `rc-motion` for more info. */
+    popupMotion?: CSSMotionProps;
+    /** Set mask motion. You can ref `rc-motion` for more info. */
+    maskMotion?: CSSMotionProps;
+    mouseEnterDelay?: number;
+    mouseLeaveDelay?: number;
+    focusDelay?: number;
+    blurDelay?: number;
+    popup: VueNode | (() => VueNode);
+    popupPlacement?: string;
+    builtinPlacements?: BuildInPlacements;
+    popupAlign?: AlignType;
+    popupClassName?: string;
+    /** Pass to `UniqueProvider` UniqueContainer */
+    uniqueContainerClassName?: string;
+    /** Pass to `UniqueProvider` UniqueContainer */
+    uniqueContainerStyle?: CSSProperties;
+    popupStyle?: CSSProperties;
+    getPopupClassNameFromAlign?: (align: AlignType) => string;
+    onPopupClick?: (e: MouseEvent) => void;
+    alignPoint?: boolean;
+    /**
+     * Trigger will memo content when close.
+     * This may affect the case if want to keep content update.
+     * Set `fresh` to `false` will always keep update.
+     */
+    fresh?: boolean;
+    /**
+     * Config with UniqueProvider to shared the floating popup.
+     */
+    unique?: boolean;
+    arrow?: boolean | ArrowTypeOuter;
+    /**
+     * @private Bump fixed position at bottom in mobile.
+     * Will replace the config of root props.
+     * This will directly trade as mobile view which will not check what real is.
+     * This is internal usage currently, do not use in your prod.
+     */
+    mobile?: MobileConfig;
+}
+export declare function generateTrigger(PortalComponent?: any): import('vue').DefineSetupFnComponent<TriggerProps, {}, {}, TriggerProps & {}, import('vue').PublicProps>;
+declare const Trigger: import('vue').DefineSetupFnComponent<TriggerProps, {}, {}, TriggerProps & {}, import('vue').PublicProps>;
+export { Trigger };
+export default Trigger;
+export { default as UniqueProvider } from './UniqueProvider';
+export type { UniqueProviderProps } from './UniqueProvider';