maz-ui 3.47.2-beta.0 → 3.47.2-beta.11

package/components/chunks/MazDialogPromise-B9_e3Ma9.mjs

@@ -0,0 +1,488 @@
+import { defineComponent as K, ref as L, onMounted as U, watch as q, openBlock as p, createBlock as D, Teleport as X, createVNode as G, Transition as J, withCtx as g, createElementBlock as j, normalizeClass as P, createElementVNode as V, withModifiers as Q, mergeProps as h, renderSlot as B, createCommentVNode as S, defineAsyncComponent as x, useAttrs as R, computed as $, createTextVNode as w, toDisplayString as T, unref as f, Fragment as W, renderList as Y } from "vue";
+import '../assets/MazDialogPromise.css';const F = "--backdrop-present", Z = /* @__PURE__ */ K({
+  inheritAttrs: !1,
+  __name: "MazBackdrop",
+  props: {
+    modelValue: { type: Boolean, default: !1 },
+    teleportSelector: { default: "body" },
+    beforeClose: { type: Function, default: void 0 },
+    persistent: { type: Boolean, default: !1 },
+    noCloseOnEscKey: { type: Boolean, default: !1 },
+    transitionName: { default: "backdrop-anim" },
+    backdropClass: { default: void 0 },
+    backdropContentClass: { default: void 0 }
+  },
+  emits: ["open", "close", "update:model-value", "before-close"],
+  setup(r, { expose: s, emit: o }) {
+    const l = r, u = o;
+    function v() {
+      document.documentElement.classList.add(F);
+    }
+    async function y() {
+      document.querySelector(".m-backdrop.--present") || document.documentElement.classList.remove(F);
+    }
+    const c = L(l.modelValue);
+    function C() {
+      t(!1);
+    }
+    async function t(e) {
+      var n;
+      e || (u("before-close"), await ((n = l.beforeClose) == null ? void 0 : n.call(l))), c.value = e;
+    }
+    function d() {
+      u("open");
+    }
+    function i() {
+      u("update:model-value", !1), u("close"), M();
+    }
+    function m() {
+      l.persistent || C();
+    }
+    function A(e) {
+      !l.noCloseOnEscKey && e.key === "Escape" && !l.persistent && C();
+    }
+    function N() {
+      v(), document.addEventListener("keyup", A, !1);
+    }
+    function M() {
+      document.removeEventListener("keyup", A), y();
+    }
+    return U(() => {
+      l.modelValue ? N() : M();
+    }), q(
+      () => l.modelValue,
+      (e) => {
+        c.value = e, e ? N() : M();
+      }
+    ), s({
+      onBackdropAnimationEnter: d,
+      onBackdropAnimationLeave: i,
+      onBackdropClicked: m,
+      close: C,
+      present: c,
+      toggleModal: t,
+      onKeyPress: A
+    }), (e, n) => (p(), D(X, { to: e.teleportSelector }, [
+      G(J, {
+        appear: "",
+        name: e.transitionName,
+        onAfterEnter: d,
+        onAfterLeave: i
+      }, {
+        default: g(() => [
+          c.value ? (p(), j(
+            "div",
+            {
+              key: 0,
+              class: P(["m-backdrop --present", [e.backdropClass]]),
+              tabindex: "-1",
+              role: "dialog"
+            },
+            [
+              V(
+                "button",
+                {
+                  class: P(["m-backdrop-overlay", { "--disabled": e.persistent }]),
+                  tabindex: "-1",
+                  onClick: Q(m, ["self"])
+                },
+                null,
+                2
+                /* CLASS */
+              ),
+              V(
+                "div",
+                h({
+                  class: ["m-backdrop-content", e.backdropContentClass]
+                }, e.$attrs, {
+                  role: "document",
+                  tabindex: "0"
+                }),
+                [
+                  B(e.$slots, "default", { close: C })
+                ],
+                16
+                /* FULL_PROPS */
+              )
+            ],
+            2
+            /* CLASS */
+          )) : S("v-if", !0)
+        ]),
+        _: 3
+        /* FORWARDED */
+      }, 8, ["name"])
+    ], 8, ["to"]));
+  }
+}), _ = {
+  key: 0,
+  id: "dialogTitle",
+  class: "maz-my-0 maz-text-xl maz-font-semibold"
+}, ee = {
+  id: "dialogDesc",
+  class: "m-dialog-content"
+}, te = {
+  key: 0,
+  class: "m-dialog-footer"
+}, oe = /* @__PURE__ */ K({
+  __name: "MazDialog",
+  props: {
+    modelValue: { type: Boolean },
+    title: { default: void 0 },
+    noClose: { type: Boolean, default: !1 },
+    width: { default: "500px" },
+    maxWidth: { default: "95vw" },
+    maxHeight: { default: "95vh" },
+    scrollable: { type: Boolean, default: !1 },
+    persistent: { type: Boolean, default: !1 },
+    teleportSelector: {},
+    beforeClose: {},
+    noCloseOnEscKey: { type: Boolean },
+    transitionName: {},
+    backdropClass: {},
+    backdropContentClass: {}
+  },
+  emits: ["open", "close", "update:model-value"],
+  setup(r, { expose: s }) {
+    const o = r, l = x(() => import("./MazBtn-DzwuLea3.mjs")), u = x(() => import("./x-mark-CnZwVvA7.mjs")), v = R(), y = L();
+    s({
+      close: () => {
+        var t, d;
+        return (d = (t = y.value) == null ? void 0 : t.close) == null ? void 0 : d.call(t);
+      }
+    });
+    const c = $(() => ({
+      ...v,
+      class: void 0,
+      style: void 0
+    })), C = $(() => ({
+      class: v.class,
+      style: v.style
+    }));
+    return (t, d) => (p(), D(Z, h({ ...c.value, ...o }, {
+      ref_key: "backdrop",
+      ref: y,
+      persistent: t.persistent,
+      "model-value": t.modelValue,
+      "transition-name": "modal-anim",
+      "aria-labelledby": "dialogTitle",
+      "aria-describedby": "dialogDesc",
+      onClose: d[0] || (d[0] = (i) => t.$emit("close", i)),
+      onOpen: d[1] || (d[1] = (i) => t.$emit("open", i)),
+      "onUpdate:modelValue": d[2] || (d[2] = (i) => t.$emit("update:model-value", i))
+    }), {
+      default: g(({ close: i }) => [
+        V(
+          "div",
+          h({
+            class: ["m-dialog", { "--scrollable": t.scrollable }],
+            role: "dialog",
+            "aria-modal": "true",
+            style: [{ width: t.width, maxWidth: t.maxWidth, maxHeight: t.maxHeight }]
+          }, C.value),
+          [
+            B(t.$slots, "header", { close: i }, () => [
+              V(
+                "div",
+                {
+                  class: P(["m-dialog-header", { "--has-title": t.$slots.title || t.title }])
+                },
+                [
+                  t.$slots.title || t.title ? (p(), j("h2", _, [
+                    B(t.$slots, "title", {}, () => [
+                      w(
+                        T(t.title),
+                        1
+                        /* TEXT */
+                      )
+                    ], !0)
+                  ])) : S("v-if", !0),
+                  !t.noClose && !t.persistent ? (p(), D(f(l), {
+                    key: 1,
+                    class: "m-dialog-closebtn",
+                    color: "transparent",
+                    size: "sm",
+                    icon: f(u),
+                    onClick: i
+                  }, null, 8, ["icon", "onClick"])) : S("v-if", !0)
+                ],
+                2
+                /* CLASS */
+              )
+            ], !0),
+            V("div", ee, [
+              B(t.$slots, "default", { close: i }, void 0, !0)
+            ]),
+            t.$slots.footer ? (p(), j("div", te, [
+              B(t.$slots, "footer", { close: i }, void 0, !0)
+            ])) : S("v-if", !0)
+          ],
+          16
+          /* FULL_PROPS */
+        )
+      ]),
+      _: 3
+      /* FORWARDED */
+    }, 16, ["persistent", "model-value"]));
+  }
+}), ae = (r, s) => {
+  const o = r.__vccOpts || r;
+  for (const [l, u] of s)
+    o[l] = u;
+  return o;
+}, ne = /* @__PURE__ */ ae(oe, [["__scopeId", "data-v-50775b17"]]), z = {
+  cancelText: "Cancel",
+  confirmText: "Confirm",
+  cancelButton: {
+    text: "Cancel",
+    color: "danger"
+  },
+  confirmButton: {
+    text: "Confirm",
+    color: "success"
+  }
+}, se = L(z), O = L([]);
+function le(r, s) {
+  return new Promise((o, l) => {
+    O.value = [
+      ...O.value,
+      {
+        id: r,
+        isActive: !0,
+        resolve: async (u) => {
+          o(u), await (s == null ? void 0 : s());
+        },
+        reject: async (u) => {
+          l(u), await (s == null ? void 0 : s());
+        }
+      }
+    ];
+  });
+}
+function I(r) {
+  return O.value = O.value.filter(({ id: s }) => s !== r), O.value;
+}
+function H(r, s, o) {
+  var l;
+  s && ((l = s[r]) == null || l.call(s, o), s.isActive = !1, setTimeout(() => {
+    I(s.id);
+  }, 500));
+}
+function re() {
+  return {
+    data: se,
+    dialogState: O,
+    showDialogAndWaitChoice: le,
+    removeDialogFromState: I,
+    rejectDialog: async (r, s = new Error("cancel"), o) => (await (o == null ? void 0 : o()), H("reject", r, s)),
+    resolveDialog: async (r, s = "accept", o) => (await (o == null ? void 0 : o()), H("resolve", r, s))
+  };
+}
+const ie = { class: "maz-flex maz-items-center maz-gap-2" }, ue = /* @__PURE__ */ K({
+  __name: "MazDialogPromise",
+  props: {
+    data: { default: void 0 },
+    message: { default: void 0 },
+    identifier: { default: void 0 },
+    buttons: { default: void 0 },
+    modelValue: { type: Boolean },
+    title: {},
+    noClose: { type: Boolean },
+    width: {},
+    maxWidth: {},
+    maxHeight: {},
+    scrollable: { type: Boolean },
+    persistent: { type: Boolean },
+    teleportSelector: {},
+    beforeClose: {},
+    noCloseOnEscKey: { type: Boolean },
+    transitionName: {},
+    backdropClass: {},
+    backdropContentClass: {},
+    cancelText: {},
+    cancelButton: { type: [Boolean, Object] },
+    confirmText: {},
+    confirmButton: { type: [Boolean, Object] }
+  },
+  emits: ["open", "close"],
+  setup(r, { expose: s }) {
+    const o = r, l = x(() => import("./MazBtn-DzwuLea3.mjs")), { dialogState: u, rejectDialog: v, resolveDialog: y, data: c } = re(), C = $(() => {
+      var e;
+      return o.buttons ?? ((e = o.data) == null ? void 0 : e.buttons) ?? c.value.buttons;
+    }), t = $(() => ({
+      ...z,
+      ...c.value,
+      ...o.data
+    })), d = $(() => {
+      var k, a, b, E;
+      if (!(((k = c.value) == null ? void 0 : k.cancelButton) ?? ((a = o.data) == null ? void 0 : a.cancelButton) ?? z.cancelButton))
+        return;
+      const n = {
+        ...z.cancelButton,
+        ...(b = c.value) == null ? void 0 : b.cancelButton,
+        ...(E = o.data) == null ? void 0 : E.cancelButton
+      };
+      return {
+        ...n,
+        text: o.cancelText || t.value.cancelText || n.text
+      };
+    }), i = $(() => {
+      var k, a, b, E;
+      if (!(((k = c.value) == null ? void 0 : k.confirmButton) ?? ((a = o.data) == null ? void 0 : a.confirmButton) ?? z.confirmButton))
+        return;
+      const n = {
+        ...z.confirmButton,
+        ...(b = c.value) == null ? void 0 : b.confirmButton,
+        ...(E = o.data) == null ? void 0 : E.confirmButton
+      };
+      return {
+        ...n,
+        text: o.confirmText || t.value.confirmText || n.text
+      };
+    }), m = $(
+      () => u.value.find(({ id: e }) => e === o.identifier)
+    ), A = L();
+    s({
+      close: () => {
+        var e, n;
+        return (n = (e = A.value) == null ? void 0 : e.close) == null ? void 0 : n.call(e);
+      }
+    });
+    function N(e) {
+      return "type" in e && (e.type === "resolve" || e.type === "reject");
+    }
+    function M(e, n) {
+      return N(n) ? n.type === "resolve" ? y(e, n.response) : v(e, n.response) : y(e, void 0, n.action);
+    }
+    return (e, n) => {
+      var k;
+      return p(), D(ne, h({
+        ref_key: "dialog",
+        ref: A
+      }, { ...e.$attrs, ...o }, {
+        "model-value": ((k = m.value) == null ? void 0 : k.isActive) ?? e.modelValue ?? !1,
+        onClose: n[2] || (n[2] = (a) => e.$emit("close", a)),
+        onOpen: n[3] || (n[3] = (a) => e.$emit("open", a)),
+        "onUpdate:modelValue": n[4] || (n[4] = (a) => f(v)(m.value))
+      }), {
+        title: g(() => [
+          B(e.$slots, "title", {}, () => {
+            var a;
+            return [
+              w(
+                T(e.title || ((a = t.value) == null ? void 0 : a.title)),
+                1
+                /* TEXT */
+              )
+            ];
+          })
+        ]),
+        default: g(() => [
+          B(e.$slots, "default", {
+            resolve: (a) => f(y)(m.value, a),
+            reject: (a) => f(v)(m.value, a)
+          }, () => {
+            var a;
+            return [
+              w(
+                T(e.message || ((a = t.value) == null ? void 0 : a.message)),
+                1
+                /* TEXT */
+              )
+            ];
+          })
+        ]),
+        footer: g(() => [
+          B(e.$slots, "footer-button", {
+            resolve: (a) => f(y)(m.value, a),
+            reject: (a) => f(v)(m.value, a)
+          }, () => [
+            V("div", ie, [
+              C.value ? (p(!0), j(
+                W,
+                { key: 0 },
+                Y(C.value, (a, b) => (p(), D(f(l), h({
+                  key: b,
+                  ref_for: !0
+                }, {
+                  ...a,
+                  type: "button"
+                }, {
+                  onClick: (E) => M(m.value, a)
+                }), {
+                  default: g(() => [
+                    w(
+                      T(a.text),
+                      1
+                      /* TEXT */
+                    )
+                  ]),
+                  _: 2
+                  /* DYNAMIC */
+                }, 1040, ["onClick"]))),
+                128
+                /* KEYED_FRAGMENT */
+              )) : (p(), j(
+                W,
+                { key: 1 },
+                [
+                  d.value ? (p(), D(
+                    f(l),
+                    h({ key: 0 }, d.value, {
+                      onClick: n[0] || (n[0] = (a) => f(v)(m.value))
+                    }),
+                    {
+                      default: g(() => [
+                        B(e.$slots, "cancel-text", {}, () => [
+                          w(
+                            T(d.value.text),
+                            1
+                            /* TEXT */
+                          )
+                        ])
+                      ]),
+                      _: 3
+                      /* FORWARDED */
+                    },
+                    16
+                    /* FULL_PROPS */
+                  )) : S("v-if", !0),
+                  i.value ? (p(), D(
+                    f(l),
+                    h({ key: 1 }, i.value, {
+                      onClick: n[1] || (n[1] = (a) => f(y)(m.value))
+                    }),
+                    {
+                      default: g(() => [
+                        B(e.$slots, "confirm-text", {}, () => [
+                          w(
+                            T(i.value.text),
+                            1
+                            /* TEXT */
+                          )
+                        ])
+                      ]),
+                      _: 3
+                      /* FORWARDED */
+                    },
+                    16
+                    /* FULL_PROPS */
+                  )) : S("v-if", !0)
+                ],
+                64
+                /* STABLE_FRAGMENT */
+              ))
+            ])
+          ])
+        ]),
+        _: 3
+        /* FORWARDED */
+      }, 16, ["model-value"]);
+    };
+  }
+});
+export {
+  ae as _,
+  ue as a,
+  re as u
+};