import { defineComponent as Z, ref as k, reactive as ee, computed as m, watch as oe, nextTick as u, onMounted as ne, onUnmounted as te, openBlock as g, createElementBlock as E, normalizeClass as b, createElementVNode as R, renderSlot as F, createBlock as re, Transition as se, withCtx as ie, withDirectives as le, normalizeStyle as _, Fragment as z, vShow as ae } from "vue";
import { C as l } from "./base-PQGakkrl.js";
import { C as y } from "./index-BnerInzC.js";
import { R as pe } from "./resize-kOWxHVSP.js";
const de = ["id"], fe = ["id"], De = /* @__PURE__ */ Z({
  name: "ClDropdownlayer",
  __name: "Base",
  props: {
    classParent: String,
    classText: String,
    classDropDown: String,
    isDisabled: {
      type: Boolean,
      default: !1
    },
    dropdownArrowPos: {
      type: String,
      default: "left"
      // left|right|center|top|bottom
    },
    dropDownPos: {
      type: String,
      default: "down"
      // down|up|left|right
    },
    isUseDropdownArrow: {
      type: Boolean,
      default: !1
    },
    isCloseDestroy: {
      type: Boolean,
      default: !0
    },
    transitionEnter: {
      type: String,
      default: "zoomInTop"
    },
    transitionLeave: {
      type: String,
      default: "zoomOutTop"
    },
    isInitDelayComplete: {
      type: Boolean,
      default: !1
    },
    appendContainer: {
      type: String,
      default: ""
      // "" | body | 指定容器 #
    },
    onOpenBeforeCallback: Function,
    triggers: {
      type: String,
      default: "click"
      // click | hover
    }
  },
  emits: ["onChangeOpen", "onChangePosition", "onOpenComplete"],
  setup(D, { expose: M, emit: H }) {
    const t = D, C = H, d = k(null), v = k(null), O = k(null), T = l.getRandom(5), e = ee({
      isOpen: !1,
      isShowOpen: !1,
      isInitFirstOpen: !1,
      dropDownPos: "down",
      arrowPos: "left",
      dropDownTop: "",
      dropDownLeft: "",
      arrowLeft: "",
      isOpacity0: !1,
      topParent: `dropdownLayer-${T}`,
      dropdownId: `dropdownLayer-dropdown-${T}`
    }), p = {
      isOpenAbnormal: !1,
      bodyMousedownEl: null,
      pScrollEls: [],
      resizeEvent: null,
      clickOpenTarget: null
    }, q = m(() => {
      const o = {
        "panel-dropdownLayer": !0,
        "dropdownLayer-arrow": t.isUseDropdownArrow,
        "dropdownLayer-disabled": t.isDisabled
      };
      return t.classParent && !l.isEmpty(t.classParent) && t.classParent.split(" ").forEach((n) => {
        l.isEmpty(n) || (o[n] = !0);
      }), o;
    }), W = m(() => {
      const o = {
        "container-border": !0,
        "dropdownLayer-text": !0,
        "dropdownLayer-text-open": e.isShowOpen
      };
      return !l.isEmpty(e.dropDownPos) && e.isShowOpen && (o[`dropdownLayer-text-${e.dropDownPos}`] = !0), t.classText && !l.isEmpty(t.classText) && t.classText.split(" ").forEach((n) => {
        l.isEmpty(n) || (o[n] = !0);
      }), o;
    }), N = m(() => {
      const o = {
        "dropdownLayer-dropdown": !0,
        "dropdownLayer-dropdown-open": e.isShowOpen,
        "dropdownLayer-dropdown-arrow": t.isUseDropdownArrow,
        "dropdownLayer-dropdown-opacity0": e.isOpacity0
      };
      return o[`dropdownLayer-dropdown-${e.dropDownPos}`] = !0, o[`dropdownLayer-dropdown-arrow-${e.arrowPos}`] = !0, t.classDropDown && !l.isEmpty(t.classDropDown) && t.classDropDown.split(" ").forEach((n) => {
        l.isEmpty(n) || (o[n] = !0);
      }), o;
    }), V = m(() => {
      const o = {}, { dropDownPos: n, dropdownArrowPos: s } = t, { dropDownTop: i, dropDownLeft: r } = e;
      return n === "down" || n === "up" ? (o.top = i, s === "center" && (o.left = r)) : (n === "left" || n === "right") && (o.left = r, s === "center" && (o.top = i)), o;
    }), j = m(() => {
      const o = {};
      return t.dropdownArrowPos === "center" && (o.left = e.arrowLeft), o;
    }), h = () => {
      e.isShowOpen && u(() => {
        if (d.value && v.value && O.value) {
          const o = t.isUseDropdownArrow && O.value ? O.value.querySelector(".arrow") : null, n = !l.isEmpty(t.appendContainer), s = n ? t.appendContainer : null;
          let i = null;
          if (!l.isUndefined(p.clickOpenTarget)) {
            const $ = y.getParent(
              p.clickOpenTarget,
              ".dropdownLayer-arrow-anchorPoint",
              v.value,
              !1
            );
            l.isUndefined($) || (i = $);
          }
          l.isUndefined(i) && (i = v.value);
          const r = y.calculationDropdownPosition(
            d.value,
            i,
            O.value,
            o,
            s
          );
          let a;
          switch (t.dropDownPos) {
            case "down":
              a = r.dropDownPosDown;
              break;
            case "up":
              a = r.dropDownPosUp;
              break;
            case "left":
              a = r.dropDownPosLeft;
              break;
            case "right":
              a = r.dropDownPosRight;
              break;
            default:
              a = r.dropDownPosDown;
              break;
          }
          e.dropDownPos = a;
          let f = "left";
          switch (t.dropdownArrowPos) {
            case "left":
              f = r.arrowPosLeft;
              break;
            case "right":
              f = r.arrowPosRight;
              break;
            case "top":
              f = r.arrowPosTop;
              break;
            case "bottom":
              f = r.arrowPosBottom;
              break;
            case "center":
              (a === "down" || a === "up") && (f = r.arrowPosCenterLR), (a === "left" || a === "right") && (f = r.arrowPosCenterTB);
              break;
            default:
              f = r.arrowPosLeft;
              break;
          }
          e.arrowPos = f;
          let w, c, P;
          a === "down" || a === "up" ? (a === "down" ? t.isUseDropdownArrow ? w = r.textHeight + r.arrowHeight - 1 : w = r.textHeight : t.isUseDropdownArrow ? w = (r.dropDownHeight + r.arrowHeight - 3) * -1 : w = r.dropDownHeight * -1, f === "center" && (c = r.arrowPosCenterLRInfo.dropDownLeft, P = r.arrowPosCenterLRInfo.arrowLeft), n && (w += r.controlOffset.top, c += r.controlOffset.left)) : (a === "left" || a === "right") && (a === "left" ? t.isUseDropdownArrow ? c = (r.dropDownWidth + r.arrowWidth - 1) * -1 : c = r.dropDownWidth * -1 : t.isUseDropdownArrow ? c = r.textWidth + r.arrowWidth - 1 : c = r.textWidth), e.dropDownTop = l.isEmpty(w) ? "" : `${w}px`, e.dropDownLeft = l.isEmpty(c) ? "" : `${c}px`, e.arrowLeft = l.isEmpty(P) ? "" : `${P}px`, C("onChangePosition", {
            use: {
              dropDownPos: a,
              arrowPos: f,
              dropDownTop: w,
              dropDownLeft: c,
              arrowLeft: P
            },
            original: r
          });
        }
      });
    }, I = (o) => {
      p.bodyMousedownEl = o;
    }, A = (o) => {
      e.isShowOpen && x(o);
    }, x = (o) => {
      if (d.value) {
        const n = y.getParent(o.target, `#${e.dropdownId}`, d.value);
        let s = l.isUndefined(n);
        if (s && p.bodyMousedownEl) {
          const i = y.getParent(
            p.bodyMousedownEl.target,
            `#${e.dropdownId}`,
            d.value
          );
          s = l.isUndefined(i), s && (e.isOpen = !1);
        }
      } else {
        if (!l.isEmpty(t.appendContainer)) {
          const n = `${t.appendContainer}>#${e.dropdownId}`, s = document.querySelectorAll(n);
          if (s && s.length > 0)
            for (let i = 0; i < s.length; i++)
              s[i].parentNode.removeChild(s[i]);
        }
        B(), e.isOpen = !1;
      }
    }, U = (o) => {
      if (e.isShowOpen) {
        h();
        const n = y.getPositionView(d.value, o.currentTarget), s = o.currentTarget.dataset, i = { right: 0, left: 0 };
        i.right = l.isUndefined(s.padRight) ? 0 : parseInt(s.padRight.replace("px", "")), i.left = l.isUndefined(s.padLeft) ? 0 : parseInt(s.padLeft.replace("px", ""));
        let r = !1;
        n.top + n.height / 2 <= 0 && (r = !0), n.right + n.width / 2 <= i.right && i.right >= 0 && (r = !0), n.left + n.width / 2 <= i.left && i.left >= 0 && (r = !0), e.isOpacity0 = r;
      } else
        L(!1);
    }, L = (o = !0) => {
      p.pScrollEls.length > 0 && p.pScrollEls.forEach((n) => {
        o ? n.addEventListener("scroll", U) : n.removeEventListener("scroll", U);
      });
    }, B = () => {
      const o = document.querySelector("body");
      o && o.removeEventListener("mousedown", I), document.body.removeEventListener("click", A), L(!1), e.isShowOpen = !1;
    }, G = () => {
      p.resizeEvent = new pe({
        callback: () => {
          e.isOpen && h();
        }
      });
      const { dropDownPos: o } = t;
      o === "down" || o === "up" ? (e.dropDownPos = "down", e.arrowPos = "left") : (o === "left" || o === "right") && (e.dropDownPos = "left", e.arrowPos = "top");
    };
    oe(
      () => e.isOpen,
      (o) => {
        if (e.isInitFirstOpen || (e.isInitFirstOpen = !0, l.isEmpty(t.appendContainer) || u(() => {
          let n = y.getParentCheckBody(
            d.value,
            t.appendContainer
          );
          l.isUndefined(n) && (n = document.querySelector("body")), n.appendChild(O.value), p.pScrollEls = y.getParentScrollList(
            d.value,
            t.appendContainer,
            !1
          ), L();
        })), C("onChangeOpen", o), o) {
          e.isOpacity0 = !1;
          const n = document.querySelector("body");
          n && n.addEventListener("mousedown", I), document.body.addEventListener("click", A), t.isInitDelayComplete || u(() => {
            e.isShowOpen = !0, h();
          });
        } else
          B();
      }
    ), ne(() => {
      u(() => {
        G();
      });
    }), te(() => {
      p.resizeEvent && p.resizeEvent.destroy(), l.isUndefined(d.value) && x(null);
    });
    const S = (o) => {
      if (!t.isDisabled) {
        p.clickOpenTarget = o.target;
        let n = !0;
        if (!e.isOpen && t.onOpenBeforeCallback && (n = t.onOpenBeforeCallback(), n = l.isBoolean(n) ? n : !0), n) {
          let s = !0, i = !0;
          e.isOpen ? t.isCloseDestroy ? (!e.isInitFirstOpen || !e.isShowOpen) && (e.isOpen = !1, s = !1) : e.isShowOpen || (e.isOpen = !1, s = !1) : t.isCloseDestroy ? (e.isInitFirstOpen || e.isShowOpen) && (i = !1) : e.isShowOpen && (i = !1), s && i ? e.isOpen = !e.isOpen : (p.isOpenAbnormal = !0, s ? i || (e.isInitFirstOpen = !1, e.isShowOpen = !1, u(() => {
            e.isOpen = !e.isOpen;
          })) : u(() => {
            e.isInitFirstOpen = !1, e.isShowOpen = !1, u(() => {
              e.isOpen = !e.isOpen;
            });
          }));
        }
      }
    }, J = (o) => {
      t.triggers === "click" && S(o);
    }, K = (o) => {
      t.triggers === "hover" && S(o);
    }, Q = (o) => {
      t.triggers === "hover" && S(o);
    }, X = () => {
      C("onOpenComplete");
    }, Y = () => {
      p.isOpenAbnormal ? p.isOpenAbnormal = !1 : t.isCloseDestroy && u(() => {
        d.value && d.value.querySelectorAll(`#${e.dropdownId}`).length > 0 && (e.isInitFirstOpen = !1, e.isOpen = !1);
      });
    };
    return M({
      setOpen: (o) => {
        e.isOpen = o;
      },
      calculationPosition: () => h(),
      initCompleteOpen: () => {
        e.isOpen && (e.isShowOpen = !0, h());
      },
      getIsShowOpen: () => e.isShowOpen
    }), (o, n) => (g(), E("div", {
      id: e.topParent,
      class: b(q.value),
      ref_key: "refElTopParent",
      ref: d
    }, [
      R("div", {
        class: b(W.value),
        onClick: n[0] || (n[0] = (s) => J(s)),
        onMouseover: n[1] || (n[1] = (s) => K(s)),
        onMouseleave: n[2] || (n[2] = (s) => Q(s)),
        ref_key: "refElText",
        ref: v
      }, [
        F(o.$slots, "labelText")
      ], 34),
      e.isInitFirstOpen ? (g(), re(se, {
        key: 0,
        name: "dropdown-transit",
        "enter-active-class": D.transitionEnter,
        "leave-active-class": D.transitionLeave,
        onEnter: X,
        onAfterLeave: Y
      }, {
        default: ie(() => [
          le(R("div", {
            id: e.dropdownId,
            class: b(N.value),
            style: _(V.value),
            ref_key: "refElDropdown",
            ref: O
          }, [
            D.isUseDropdownArrow ? (g(), E("div", {
              key: 0,
              class: "arrow",
              style: _(j.value)
            }, null, 4)) : (g(), E(z, { key: 1 }, [], 64)),
            F(o.$slots, "dropdown")
          ], 14, fe), [
            [ae, e.isShowOpen]
          ])
        ]),
        _: 3
      }, 8, ["enter-active-class", "leave-active-class"])) : (g(), E(z, { key: 1 }, [], 64))
    ], 10, de));
  }
});
export {
  De as _
};
//# sourceMappingURL=Base.vue_vue_type_script_setup_true_lang-Duh9tbur.js.map
