sapit-ui-plus/lib/js/SModal.js

var Q = Object.defineProperty, U = Object.defineProperties;
var Z = Object.getOwnPropertyDescriptors;
var G = Object.getOwnPropertySymbols;
var x = Object.prototype.hasOwnProperty, j = Object.prototype.propertyIsEnumerable;
var z = (e, l, t) => l in e ? Q(e, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[l] = t, H = (e, l) => {
  for (var t in l || (l = {}))
    x.call(l, t) && z(e, t, l[t]);
  if (G)
    for (var t of G(l))
      j.call(l, t) && z(e, t, l[t]);
  return e;
}, P = (e, l) => U(e, Z(l));
import { unref as ee, isRef as te, toRefs as le, customRef as ne, getCurrentScope as oe, onScopeDispose as ae, ref as r, computed as _, watch as D, defineComponent as re, watchEffect as ue, resolveComponent as se, openBlock as L, createBlock as I, mergeProps as ie, createSlots as de, withCtx as W, createElementVNode as X, toDisplayString as ce, createVNode as fe, normalizeStyle as ve, resolveDynamicComponent as pe, renderSlot as J, createElementBlock as ye, createCommentVNode as me } from "vue";
import he from "./ModalHeader.js";
import { l as ge, aJ as Se } from "./index2.js";
function be(e) {
  return oe() ? (ae(e), !0) : !1;
}
function i(e) {
  return typeof e == "function" ? e() : ee(e);
}
const q = typeof window != "undefined" && typeof document != "undefined";
typeof WorkerGlobalScope != "undefined" && globalThis instanceof WorkerGlobalScope;
const we = Object.prototype.toString, Ce = (e) => we.call(e) === "[object Object]", ke = () => {
};
function Me(e, l = {}) {
  if (!te(e))
    return le(e);
  const t = Array.isArray(e.value) ? Array.from({ length: e.value.length }) : {};
  for (const o in e.value)
    t[o] = ne(() => ({
      get() {
        return e.value[o];
      },
      set(u) {
        var d;
        if ((d = i(l.replaceRef)) != null ? d : !0)
          if (Array.isArray(e.value)) {
            const c = [...e.value];
            c[o] = u, e.value = c;
          } else {
            const c = P(H({}, e.value), { [o]: u });
            Object.setPrototypeOf(c, Object.getPrototypeOf(e.value)), e.value = c;
          }
        else
          e.value[o] = u;
      }
    }));
  return t;
}
const K = q ? window : void 0;
function Be(e) {
  var l;
  const t = i(e);
  return (l = t == null ? void 0 : t.$el) != null ? l : t;
}
function V(...e) {
  let l, t, o, u;
  if (typeof e[0] == "string" || Array.isArray(e[0]) ? ([t, o, u] = e, l = K) : [l, t, o, u] = e, !l)
    return ke;
  Array.isArray(t) || (t = [t]), Array.isArray(o) || (o = [o]);
  const d = [], p = () => {
    d.forEach((s) => s()), d.length = 0;
  }, c = (s, v, f, g) => (s.addEventListener(v, f, g), () => s.removeEventListener(v, f, g)), h = D(
    () => [Be(l), i(u)],
    ([s, v]) => {
      if (p(), !s)
        return;
      const f = Ce(v) ? H({}, v) : v;
      d.push(
        ...t.flatMap((g) => o.map((O) => c(s, g, O, f)))
      );
    },
    { immediate: !0, flush: "post" }
  ), b = () => {
    h(), p();
  };
  return be(b), b;
}
function Oe(e, l = {}) {
  var t, o;
  const {
    pointerTypes: u,
    preventDefault: d,
    stopPropagation: p,
    exact: c,
    onMove: h,
    onEnd: b,
    onStart: s,
    initialValue: v,
    axis: f = "both",
    draggingElement: g = K,
    containerElement: O,
    handle: C = e,
    buttons: Y = [0]
  } = l, S = r(
    (t = i(v)) != null ? t : { x: 0, y: 0 }
  ), y = r(), R = (n) => u ? u.includes(n.pointerType) : !0, A = (n) => {
    i(d) && n.preventDefault(), i(p) && n.stopPropagation();
  }, F = (n) => {
    var k;
    if (!i(Y).includes(n.button) || i(l.disabled) || !R(n) || i(c) && n.target !== i(e))
      return;
    const m = i(O), M = (k = m == null ? void 0 : m.getBoundingClientRect) == null ? void 0 : k.call(m), a = i(e).getBoundingClientRect(), w = {
      x: n.clientX - (m ? a.left - M.left + m.scrollLeft : a.left),
      y: n.clientY - (m ? a.top - M.top + m.scrollTop : a.top)
    };
    (s == null ? void 0 : s(w, n)) !== !1 && (y.value = w, A(n));
  }, E = (n) => {
    if (i(l.disabled) || !R(n) || !y.value)
      return;
    const k = i(O), m = i(e).getBoundingClientRect();
    let { x: M, y: a } = S.value;
    (f === "x" || f === "both") && (M = n.clientX - y.value.x, k && (M = Math.min(Math.max(0, M), k.scrollWidth - m.width))), (f === "y" || f === "both") && (a = n.clientY - y.value.y, k && (a = Math.min(Math.max(0, a), k.scrollHeight - m.height))), S.value = {
      x: M,
      y: a
    }, h == null || h(S.value, n), A(n);
  }, T = (n) => {
    i(l.disabled) || !R(n) || y.value && (y.value = void 0, b == null || b(S.value, n), A(n));
  };
  if (q) {
    const n = { capture: (o = l.capture) != null ? o : !0 };
    V(C, "pointerdown", F, n), V(g, "pointermove", E, n), V(g, "pointerup", T, n);
  }
  return P(H({}, Me(S)), {
    position: S,
    isDragging: _(() => !!y.value),
    style: _(
      () => `left:${S.value.x}px;top:${S.value.y}px;`
    )
  });
}
const Re = re({
  name: "SModal",
  props: {
    centered: {
      type: Boolean,
      default: !0
    },
    maskClosable: {
      type: Boolean,
      default: !0
    },
    mask: {
      type: Boolean,
      default: !0
    },
    topStyle: {
      type: String,
      default: ""
    },
    closable: {
      type: Boolean,
      default: !0
    },
    destroyOnClose: {
      type: Boolean,
      default: !1
    },
    keyboardOpen: {
      type: Boolean,
      default: !0
    },
    title: {
      type: String,
      default: ""
    },
    value: {
      type: Boolean,
      default: !1
    },
    haveFooter: {
      type: Boolean,
      default: !0
    },
    width: {
      type: [String, Number],
      default: "60vw"
    },
    boxHeight: {
      type: [String, Number],
      default: 60
    },
    bodyStyle: {
      type: Object,
      default() {
        return {
          overflowX: "hidden",
          overflowY: "auto"
        };
      }
    },
    showFullScreen: {
      type: Boolean,
      default: !0
    }
  },
  setup(e, { attrs: l, emit: t }) {
    const o = r("modalTitleRef"), u = r(), { x: d, y: p, isDragging: c } = Oe(u), h = r(0), b = r(0), s = r(!1), v = r(0), f = r(0), g = r(0), O = r(0), C = r({ left: 0, right: 0, top: 0, bottom: 0 }), Y = _(() => ({
      transform: `translate(${v.value}px, ${f.value}px)`
    }));
    D([d, p], () => {
      var a, w;
      if (!s.value) {
        h.value = d.value, b.value = p.value;
        const B = document.body.getBoundingClientRect(), $ = (w = (a = u.value) == null ? void 0 : a.getBoundingClientRect()) != null ? w : { width: 0, height: 0 };
        C.value.right = B.width - $.width, C.value.bottom = B.height - $.height, g.value = v.value, O.value = f.value;
      }
      s.value = !0;
    }), D(c, () => {
      c || (s.value = !1);
    }), ue(() => {
      s.value && (v.value = g.value + Math.min(Math.max(C.value.left, d.value), C.value.right) - h.value, f.value = O.value + Math.min(Math.max(C.value.top, p.value), C.value.bottom) - b.value);
    });
    const S = r(null), y = r(null), R = r(!1), A = r(), F = (a = 0, w = 0, B = 0) => {
      let $ = document.body.offsetHeight, N = 0;
      a + w + B + 85 >= $ ? N = $ - w - B - 82 : N = a, A.value = Object.assign(
        {
          height: `${N}px`
        },
        e.bodyStyle
      );
    }, E = r(e.width), T = r(), n = () => {
      E.value = "100vw", o.value = "", T.value = "s-full-modal", v.value = 0, f.value = 0;
    }, k = () => {
      E.value = e.width, o.value = "modalTitleRef", T.value = "";
    }, m = () => {
      t("update:value", !1), t("handCancel");
    }, M = () => {
      T.value = "", o.value = "modalTitleRef", E.value = e.width, t("afterClose");
    };
    return D(
      () => e.value,
      (a) => {
        a ? R.value = !0 : R.value = !1;
      },
      { deep: !0 }
    ), D(
      () => S.value,
      (a) => {
        if (a) {
          const w = a, B = (y == null ? void 0 : y.value) || null, $ = u.value;
          d.value = h.value, p.value = b.value, F(
            w.clientHeight,
            $.clientHeight,
            (B == null ? void 0 : B.clientHeight) || 0
          );
        }
      },
      { deep: !0 }
    ), {
      modalTitleRefS: o,
      isOpen: R,
      modalTitleRef: u,
      computeBodyStyle: A,
      modalWidth: E,
      fullModal: T,
      transformStyle: Y,
      handleFullScreen: n,
      handleReduction: k,
      closeModal: m,
      handleAfterClose: M,
      bodySlot: S,
      footerSlot: y,
      transformX: v,
      transformY: f,
      dragRect: C,
      startedDrag: s,
      isDragging: c,
      computeWindowStyle: F,
      startX: h,
      startY: b,
      preTransformX: g,
      preTransformY: O,
      x: d,
      y: p,
      attrs: l,
      listeners: t
    };
  },
  components: {
    ModalHeader: he
  }
}), $e = { class: "modalHeader" }, Ae = { ref: "bodySlot" }, Ee = {
  key: 0,
  ref: "footerSlot"
};
function Te(e, l, t, o, u, d) {
  const p = se("ModalHeader"), c = Se;
  return L(), I(c, ie({
    open: e.isOpen,
    "body-style": e.computeBodyStyle,
    width: e.modalWidth,
    centered: e.centered,
    onCancel: e.closeModal,
    afterClose: e.handleAfterClose,
    destroyOnClose: e.destroyOnClose,
    keyboard: e.keyboardOpen,
    style: e.topStyle,
    maskClosable: e.maskClosable,
    mask: e.mask,
    "wrap-class-name": "s-modal " + e.fullModal
  }, e.attrs), de({
    title: W(() => [
      X("div", $e, [
        X("div", {
          ref: e.modalTitleRefS,
          class: "draggableTitle"
        }, ce(e.title), 513),
        fe(p, {
          width: e.modalWidth,
          showFullScreen: e.showFullScreen,
          onFullScreen: e.handleFullScreen,
          onReduction: e.handleReduction
        }, null, 8, ["width", "showFullScreen", "onFullScreen", "onReduction"])
      ])
    ]),
    modalRender: W(({ originVNode: h }) => [
      X("div", {
        style: ve(e.transformStyle)
      }, [
        (L(), I(pe(h)))
      ], 4)
    ]),
    default: W(() => [
      X("div", Ae, [
        J(e.$slots, "default", {}, void 0, !0)
      ], 512)
    ]),
    _: 2
  }, [
    e.haveFooter ? {
      name: "footer",
      fn: W(() => [
        e.$slots.footer ? (L(), ye("div", Ee, [
          J(e.$slots, "footer", {}, void 0, !0)
        ], 512)) : me("", !0)
      ]),
      key: "0"
    } : void 0
  ]), 1040, ["open", "body-style", "width", "centered", "onCancel", "afterClose", "destroyOnClose", "keyboard", "style", "maskClosable", "mask", "wrap-class-name"]);
}
const Xe = /* @__PURE__ */ ge(Re, [["render", Te], ["__scopeId", "data-v-fa6e7164"]]);
export {
  Xe as default
};