@gopowerteam/modal-render 0.0.4 → 0.0.6

package/dist/index.js

@@ -1,404 +0,0 @@
-import { unref as J, isRef as Q, toRefs as Z, customRef as j, getCurrentScope as ee, onScopeDispose as te, ref as $, computed as x, watch as oe, defineComponent as X, inject as R, shallowRef as A, onMounted as Y, onUnmounted as ne, openBlock as g, createElementBlock as b, createElementVNode as w, normalizeStyle as z, withModifiers as re, normalizeClass as ie, toDisplayString as se, createCommentVNode as P, createBlock as N, resolveDynamicComponent as le, normalizeProps as ae, guardReactiveProps as ue, triggerRef as S, provide as de, Fragment as I, renderSlot as ce, Teleport as fe, createVNode as pe, TransitionGroup as me, withCtx as ve, renderList as ye, mergeProps as he, defineAsyncComponent as ge, getCurrentInstance as K } from "vue";
-const B = Symbol("__MODAL__");
-function _e(o) {
-  return ee() ? (te(o), !0) : !1;
-}
-function h(o) {
-  return typeof o == "function" ? o() : J(o);
-}
-const q = typeof window < "u" && typeof document < "u", we = Object.prototype.toString, be = (o) => we.call(o) === "[object Object]", xe = () => {
-};
-function Ce(o, i = {}) {
-  if (!Q(o))
-    return Z(o);
-  const e = Array.isArray(o.value) ? Array.from({ length: o.value.length }) : {};
-  for (const n in o.value)
-    e[n] = j(() => ({
-      get() {
-        return o.value[n];
-      },
-      set(r) {
-        var u;
-        if ((u = h(i.replaceRef)) != null ? u : !0)
-          if (Array.isArray(o.value)) {
-            const p = [...o.value];
-            p[n] = r, o.value = p;
-          } else {
-            const p = { ...o.value, [n]: r };
-            Object.setPrototypeOf(p, Object.getPrototypeOf(o.value)), o.value = p;
-          }
-        else
-          o.value[n] = r;
-      }
-    }));
-  return e;
-}
-function Ee(o) {
-  var i;
-  const e = h(o);
-  return (i = e == null ? void 0 : e.$el) != null ? i : e;
-}
-const G = q ? window : void 0;
-function W(...o) {
-  let i, e, n, r;
-  if (typeof o[0] == "string" || Array.isArray(o[0]) ? ([e, n, r] = o, i = G) : [i, e, n, r] = o, !i)
-    return xe;
-  Array.isArray(e) || (e = [e]), Array.isArray(n) || (n = [n]);
-  const u = [], v = () => {
-    u.forEach((a) => a()), u.length = 0;
-  }, p = (a, s, d, c) => (a.addEventListener(s, d, c), () => a.removeEventListener(s, d, c)), m = oe(
-    () => [Ee(i), h(r)],
-    ([a, s]) => {
-      if (v(), !a)
-        return;
-      const d = be(s) ? { ...s } : s;
-      u.push(
-        ...e.flatMap((c) => n.map((C) => p(a, c, C, d)))
-      );
-    },
-    { immediate: !0, flush: "post" }
-  ), l = () => {
-    m(), v();
-  };
-  return _e(l), l;
-}
-function Me(o, i = {}) {
-  var e, n;
-  const {
-    pointerTypes: r,
-    preventDefault: u,
-    stopPropagation: v,
-    exact: p,
-    onMove: m,
-    onEnd: l,
-    onStart: a,
-    initialValue: s,
-    axis: d = "both",
-    draggingElement: c = G,
-    containerElement: C,
-    handle: L = o
-  } = i, y = $(
-    (e = h(s)) != null ? e : { x: 0, y: 0 }
-  ), _ = $(), E = (t) => r ? r.includes(t.pointerType) : !0, M = (t) => {
-    h(u) && t.preventDefault(), h(v) && t.stopPropagation();
-  }, D = (t) => {
-    var f;
-    if (!E(t) || h(p) && t.target !== h(o))
-      return;
-    const V = ((f = h(C)) != null ? f : h(o)).getBoundingClientRect(), F = {
-      x: t.clientX - V.left,
-      y: t.clientY - V.top
-    };
-    (a == null ? void 0 : a(F, t)) !== !1 && (_.value = F, M(t));
-  }, O = (t) => {
-    if (!E(t) || !_.value)
-      return;
-    let { x: f, y: k } = y.value;
-    (d === "x" || d === "both") && (f = t.clientX - _.value.x), (d === "y" || d === "both") && (k = t.clientY - _.value.y), y.value = {
-      x: f,
-      y: k
-    }, m == null || m(y.value, t), M(t);
-  }, H = (t) => {
-    E(t) && _.value && (_.value = void 0, l == null || l(y.value, t), M(t));
-  };
-  if (q) {
-    const t = { capture: (n = i.capture) != null ? n : !0 };
-    W(L, "pointerdown", D, t), W(c, "pointermove", O, t), W(c, "pointerup", H, t);
-  }
-  return {
-    ...Ce(y),
-    position: y,
-    isDragging: x(() => !!_.value),
-    style: x(
-      () => `left:${y.value.x}px;top:${y.value.y}px;`
-    )
-  };
-}
-const Se = { class: "modal-container fixed inset-0" }, ke = { class: "title font-bold" }, ze = { class: "action" }, Ae = {
-  key: 1,
-  class: "modal-footer space-x-2"
-}, Pe = ["form"], $e = {
-  name: "ModalContainer",
-  inheritAttrs: !0
-}, Be = /* @__PURE__ */ X({
-  ...$e,
-  props: {
-    id: {},
-    form: {},
-    component: {},
-    componentProps: {},
-    width: {},
-    maxWidth: {},
-    maxHeight: {},
-    sizes: {},
-    size: { default: "middle" },
-    title: {},
-    header: { type: Boolean, default: !0 },
-    footer: { type: Boolean, default: !1 },
-    closeable: { type: Boolean, default: !0 },
-    esc: { type: Boolean, default: !1 },
-    maskClosable: { type: Boolean, default: !1 },
-    draggable: { type: Boolean, default: !1 },
-    mode: { default: "dialog" }
-  },
-  emits: ["submit"],
-  setup(o, { emit: i }) {
-    const e = o, n = i, r = R(B);
-    let u = 0, v = 0;
-    const p = A(), m = A(), l = A(), { x: a, y: s } = Me(l, {
-      initialValue: { x: 0, y: 0 }
-    });
-    function d() {
-      r == null || r.close(e.id);
-    }
-    function c(t) {
-      if (typeof t == "number")
-        return `${t}px`;
-      if (typeof t == "string")
-        return t;
-    }
-    const C = x(() => {
-      const t = {};
-      return e.mode === "dialog" && (t.justifyContent = "center"), e.mode === "drawer" && (t.justifyContent = "flex-end"), t;
-    }), L = x(() => {
-      const t = {};
-      return e.size && (t.width = c(e.sizes[e.size])), e.width && (t.width = c(e.width)), e.maxWidth && (t.maxWidth = c(e.maxWidth)), e.size === "fullscreen" && (t.maxWidth = "unset", t.position = "fixed", t.top = 0, t.left = 0, t.bottom = 0, t.right = 0), e.draggable && e.size !== "fullscreen" && e.mode === "dialog" && (t.transform = `translate3d(${a.value - u}px, ${s.value - v}px, 0px)`), t;
-    }), y = x(() => {
-      const t = {};
-      return e.draggable && e.size !== "fullscreen" && e.mode === "dialog" && (t.cursor = "move"), t;
-    }), _ = x(() => {
-      var f;
-      const t = {};
-      return e.maxHeight && (t.maxHeight = `calc(${(f = c(e.maxHeight)) == null ? void 0 : f.replace("%", "vh")} - 50px)`), e.mode === "drawer" && (t.maxHeight = `calc(100vh - ${(e.header ? 50 : 0) + (e.footer ? 50 : 0)}px)`), e.size === "fullscreen" && (t.maxHeight = `calc(100vh - ${(e.header ? 50 : 0) + (e.footer ? 50 : 0)}px)`), t;
-    });
-    function E() {
-      const t = m.value;
-      if (e.form && t) {
-        const f = t.querySelector(`form[name="${e.form}"]`);
-        f && f.dispatchEvent(new Event("submit"));
-      }
-      n("submit");
-    }
-    function M() {
-      r == null || r.close(e.id);
-    }
-    function D() {
-      window && window.addEventListener("resize", () => {
-        S(p), S(m), u = m.value.offsetLeft, v = m.value.offsetTop;
-      });
-    }
-    function O() {
-      if (e.closeable && e.esc) {
-        const t = ({ key: f }) => {
-          f === "Escape" && (r == null || r.close(e.id), window.removeEventListener("keydown", t));
-        };
-        window.addEventListener("keydown", t);
-      }
-    }
-    function H() {
-      u = m.value.offsetLeft, v = m.value.offsetTop;
-    }
-    return Y(() => {
-      O(), D();
-    }), ne(() => {
-    }), (t, f) => (g(), b("div", Se, [
-      w("div", {
-        ref_key: "wrapperRef",
-        ref: p,
-        class: "modal-wrapper",
-        style: z(C.value),
-        onClick: f[0] || (f[0] = re((k) => t.maskClosable && d(), ["self"]))
-      }, [
-        w("div", {
-          ref_key: "contentRef",
-          ref: m,
-          class: ie(["modal-content", { [`${t.mode}-mode`]: !0 }]),
-          style: z(L.value)
-        }, [
-          t.header ? (g(), b("div", {
-            key: 0,
-            ref_key: "headerRef",
-            ref: l,
-            class: "modal-header",
-            style: z(y.value),
-            onMousedown: H
-          }, [
-            w("div", ke, se(t.title), 1),
-            w("div", ze, [
-              t.closeable ? (g(), b("div", {
-                key: 0,
-                class: "i-icon-park-outline:close block cursor-pointer",
-                onClick: d
-              })) : P("", !0)
-            ])
-          ], 36)) : P("", !0),
-          w("div", {
-            class: "modal-body",
-            style: z(_.value)
-          }, [
-            (g(), N(le(t.component), ae(ue(t.componentProps)), null, 16))
-          ], 4),
-          t.footer ? (g(), b("div", Ae, [
-            w("button", {
-              class: "submit-button",
-              form: t.form,
-              type: "submit",
-              onClick: E
-            }, " 确定 ", 8, Pe),
-            w("button", {
-              class: "cancel-button",
-              type: "button",
-              onClick: M
-            }, " 取消 ")
-          ])) : P("", !0)
-        ], 6)
-      ], 4)
-    ]));
-  }
-});
-const U = (o, i) => {
-  const e = o.__vccOpts || o;
-  for (const [n, r] of i)
-    e[n] = r;
-  return e;
-}, Le = /* @__PURE__ */ U(Be, [["__scopeId", "data-v-581eba51"]]), De = {
-  key: 0,
-  class: "modal-teleport"
-}, Oe = {
-  name: "ModalProvider",
-  inheritAttrs: !0
-}, He = /* @__PURE__ */ X({
-  ...Oe,
-  props: {
-    appendToBody: { type: Boolean, default: !1 },
-    sizes: { default: () => ({
-      small: 520,
-      middle: 860,
-      large: 1190
-    }) },
-    maxWidth: { default: "80%" },
-    maxHeight: { default: "80%" }
-  },
-  setup(o, { expose: i }) {
-    const e = A([]), n = $(!1);
-    async function r(l, a, s) {
-      const d = ge(
-        () => Promise.resolve(l)
-      );
-      return new Promise((c) => {
-        e.value.push({
-          id: Math.random().toString(32).slice(2),
-          component: d,
-          props: a,
-          options: s,
-          resolve: c,
-          onSubmit: $(() => {
-          })
-        }), S(e);
-      });
-    }
-    function u(l, a) {
-      const s = e.value.findIndex((c) => c.id === l);
-      if (s < 0)
-        return;
-      const d = e.value[s];
-      d == null || d.resolve(a), e.value.splice(s, 1), S(e);
-    }
-    function v() {
-      e.value.forEach((l) => {
-        l.resolve();
-      }), e.value = [], S(e);
-    }
-    function p(l) {
-      return e.value.find((a) => a.id === l);
-    }
-    function m(l, a) {
-      const s = e.value.find((d) => d.id === l);
-      s && (s.onSubmit.value = a);
-    }
-    return de(B, {
-      open: r,
-      close: u,
-      closeAll: v,
-      getElement: p,
-      addSubmitListener: m
-    }), i({
-      elements: e
-    }), Y(() => {
-      n.value = !0;
-    }), (l, a) => (g(), b(I, null, [
-      ce(l.$slots, "default", {}, void 0, !0),
-      n.value ? (g(), b("div", De, [
-        (g(), N(fe, {
-          disabled: !l.appendToBody,
-          to: "body"
-        }, [
-          pe(me, { name: "modal-fade" }, {
-            default: ve(() => [
-              (g(!0), b(I, null, ye(e.value, (s) => (g(), N(Le, he({
-                id: s.id,
-                key: s.id,
-                component: s.component,
-                "component-props": s.props,
-                "max-height": l.maxHeight,
-                "max-width": l.maxWidth,
-                sizes: l.sizes
-              }, s.options, {
-                onSubmit: s.onSubmit.value
-              }), null, 16, ["id", "component", "component-props", "max-height", "max-width", "sizes", "onSubmit"]))), 128))
-            ]),
-            _: 1
-          })
-        ], 8, ["disabled"]))
-      ])) : P("", !0)
-    ], 64));
-  }
-});
-const Ne = /* @__PURE__ */ U(He, [["__scopeId", "data-v-1ef03c20"]]);
-function T(o, i) {
-  var n, r;
-  let e = o == null ? void 0 : o.parent;
-  for (; e && ((n = e == null ? void 0 : e.type) == null ? void 0 : n.name) !== i; )
-    e = e.parent;
-  return ((r = e == null ? void 0 : e.type) == null ? void 0 : r.name) === i ? e : null;
-}
-function Te() {
-  const o = R(B), i = K();
-  return {
-    open(e, n, r) {
-      if (!o)
-        throw new Error("Not Found Modal Provider Component");
-      return o.open(e, n || {}, r || {});
-    },
-    close(e) {
-      var u;
-      if (!o)
-        throw new Error("Not Found Modal Provider Component");
-      const n = T(i, "ModalContainer"), r = (u = n == null ? void 0 : n.props) == null ? void 0 : u.id;
-      if (!r)
-        throw new Error("Not Found Current Modal Container");
-      o.close(r, e);
-    },
-    closeAll() {
-      if (!o)
-        throw new Error("Not Found Modal Provider Component");
-      o.closeAll();
-    },
-    onSubmit(e) {
-      const n = T(i, "ModalContainer");
-      if (!(n == null ? void 0 : n.props.id))
-        throw new Error("Not Found Current Modal Container");
-    }
-  };
-}
-function Re(o) {
-  var u;
-  const i = R(B), e = K(), n = T(e, "ModalContainer"), r = (u = n == null ? void 0 : n.props) == null ? void 0 : u.id;
-  i && r && i.addSubmitListener(r, o);
-}
-export {
-  Le as ModalContainer,
-  Ne as ModalProvider,
-  Re as onSubmit,
-  Te as useModal
-};