vue-data-ui 3.17.13 → 3.18.0

package/dist/BaseDraggableDialog-Di8Hlru3.js

@@ -1,249 +0,0 @@
-import { ref as s, reactive as A, computed as q, onMounted as F, onUnmounted as G, openBlock as x, createBlock as J, Teleport as Q, createElementBlock as O, withModifiers as d, normalizeStyle as k, createElementVNode as o, unref as Z, renderSlot as h, createVNode as _, normalizeClass as ee, createCommentVNode as te, nextTick as ne } from "vue";
-import oe from "./BaseIcon-DX0hTWa-.js";
-import { j as ie, X as ae } from "./lib-DMzrGQHK.js";
-import { _ as re } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const de = ["xmlns"], le = { class: "draggable-dialog-actions" }, se = {
-  __name: "BaseDraggableDialog",
-  props: {
-    backgroundColor: { type: String },
-    color: { type: String },
-    headerBg: { type: String },
-    headerColor: { type: String },
-    fullscreenParent: { type: HTMLElement },
-    isFullscreen: { type: Boolean, default: !1 },
-    withPadding: { type: Boolean, default: !1 },
-    forcedWidth: { type: Number, default: 400 },
-    forcedHeight: { type: Number, default: 400 },
-    isCursorPointer: { type: Boolean, default: !1 },
-    forceAspectRatio: { type: Boolean, default: !1 },
-    withFullWidth: { type: Boolean, default: !1 },
-    noLayerUpdate: { type: Boolean, default: !1 }
-  },
-  emits: ["close", "size"],
-  setup(r, { expose: P, emit: I }) {
-    const u = r, g = I, L = s(!1), M = s(!1), B = s(0), v = s(null), D = s(null), p = s(null), C = `vue-ui-draggable-dialog-${ie()}`, W = `${C}-title`, H = `${C}-body`;
-    function z() {
-      u.noLayerUpdate || (B.value += 1);
-    }
-    const e = A({
-      left: window.innerWidth / 2 - 200,
-      top: window.innerHeight / 2 - 120,
-      width: u.forcedWidth,
-      height: u.forcedHeight,
-      dragging: !1,
-      resizing: !1,
-      dragOffsetX: 0,
-      dragOffsetY: 0,
-      pointerStartX: 0,
-      pointerStartY: 0,
-      resizeStartW: 0,
-      resizeStartH: 0
-    });
-    function N() {
-      p.value = document.activeElement instanceof HTMLElement ? document.activeElement : null, L.value = !0, ne(() => {
-        M.value || (e.left = Math.max(0, window.innerWidth / 2 - e.width / 2), e.top = Math.max(0, window.innerHeight / 2 - e.height / 2), M.value = !0);
-        const t = D.value || v.value;
-        t && typeof t.focus == "function" && t.focus();
-      });
-    }
-    function S() {
-      L.value = !1, g("close"), p.value && typeof p.value.focus == "function" && p.value.focus();
-    }
-    P({ open: N, close: S });
-    const R = q(() => ({
-      position: "fixed",
-      left: `${e.left}px`,
-      top: `${e.top}px`,
-      width: `${e.width}px`,
-      height: `${e.height}px`,
-      padding: 0,
-      border: "none",
-      background: u.backgroundColor,
-      boxShadow: "0 4px 24px rgba(0,0,0,0.15)",
-      zIndex: 9999,
-      overflow: "visible",
-      borderRadius: "2px",
-      "--dlg-color": u.color
-    }));
-    function l(t) {
-      return t.touches && t.touches.length ? { x: t.touches[0].clientX, y: t.touches[0].clientY } : { x: t.clientX, y: t.clientY };
-    }
-    function T(t) {
-      t.preventDefault?.(), z(), e.dragging = !0;
-      const n = l(t);
-      e.dragOffsetX = n.x - e.left, e.dragOffsetY = n.y - e.top, document.addEventListener("mousemove", y), document.addEventListener("mouseup", c), document.addEventListener("touchmove", y, { passive: !1 }), document.addEventListener("touchend", c);
-    }
-    function y(t) {
-      if (!e.dragging) return;
-      t.preventDefault?.();
-      const n = l(t);
-      let i = n.x - e.dragOffsetX, a = n.y - e.dragOffsetY;
-      i = Math.max(0, Math.min(i, window.innerWidth - e.width)), a = Math.max(0, Math.min(a, window.innerHeight - e.height)), e.left = i, e.top = a;
-    }
-    function c() {
-      e.dragging = !1, document.removeEventListener("mousemove", y), document.removeEventListener("mouseup", c), document.removeEventListener("touchmove", y), document.removeEventListener("touchend", c);
-    }
-    function X(t) {
-      t.preventDefault?.(), z(), e.resizing = !0;
-      const n = l(t);
-      e.pointerStartX = n.x, e.pointerStartY = n.y, e.resizeStartW = e.width, e.resizeStartH = e.height, document.addEventListener("mousemove", b), document.addEventListener("mouseup", f), document.addEventListener("touchmove", b, { passive: !1 }), document.addEventListener("touchend", f);
-    }
-    function b(t) {
-      if (!e.resizing) return;
-      t.preventDefault?.();
-      const n = l(t);
-      let i = n.x - e.pointerStartX, a = n.y - e.pointerStartY;
-      e.width = Math.max(240, e.resizeStartW + i), e.height = Math.max(400, e.resizeStartH + a), g("size", { width: e.width, height: e.height });
-    }
-    function f() {
-      e.resizing = !1, document.removeEventListener("mousemove", b), document.removeEventListener("mouseup", f), document.removeEventListener("touchmove", b), document.removeEventListener("touchend", f), g("size", { width: e.width, height: e.height });
-    }
-    F(() => {
-      g("size", { width: e.width, height: e.height });
-    });
-    function $(t) {
-      t.preventDefault?.(), z(), e.resizing = !0;
-      const n = l(t);
-      e.pointerStartX = n.x, e.pointerStartY = n.y, e.resizeStartW = e.width, e.resizeStartH = e.height, e.resizeStartLeft = e.left, e.resizeStartTop = e.top, document.addEventListener("mousemove", w), document.addEventListener("mouseup", m), document.addEventListener("touchmove", w, { passive: !1 }), document.addEventListener("touchend", m);
-    }
-    function w(t) {
-      if (!e.resizing) return;
-      t.preventDefault?.();
-      const n = l(t);
-      let i = n.x - e.pointerStartX, a = Math.min(
-        Math.max(0, e.resizeStartLeft + i),
-        e.resizeStartLeft + e.resizeStartW - 240
-      ), E = e.resizeStartW - (a - e.resizeStartLeft), j = n.y - e.pointerStartY, V = Math.max(400, e.resizeStartH + j);
-      e.left = a, e.width = E, e.height = V;
-    }
-    function m() {
-      e.resizing = !1, document.removeEventListener("mousemove", w), document.removeEventListener("mouseup", m), document.removeEventListener("touchmove", w), document.removeEventListener("touchend", m);
-    }
-    F(() => {
-      document.addEventListener("keydown", Y);
-    });
-    function Y(t) {
-      t.key && t.key === "Escape" && S();
-    }
-    G(() => {
-      c(), f(), m(), document.removeEventListener("keydown", Y);
-    });
-    function K(t) {
-      t.key === "Tab" && U(t);
-    }
-    function U(t) {
-      if (!v.value) return;
-      const i = v.value.querySelectorAll('a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, [tabindex]:not([tabindex="-1"]), [contenteditable="true"]');
-      if (!i.length) return;
-      const a = i[0], E = i[i.length - 1];
-      t.shiftKey ? document.activeElement === a && (t.preventDefault(), E.focus()) : document.activeElement === E && (t.preventDefault(), a.focus());
-    }
-    return (t, n) => (x(), J(Q, {
-      to: r.isFullscreen ? r.fullscreenParent : "body",
-      key: B.value
-    }, [
-      L.value ? (x(), O("div", {
-        key: 0,
-        ref_key: "draggableDialog",
-        ref: v,
-        class: "vue-ui-draggable-dialog",
-        style: k(R.value),
-        role: "dialog",
-        "aria-modal": !0,
-        "aria-labelledby": W,
-        "aria-describedby": H,
-        tabindex: "-1",
-        onClick: n[0] || (n[0] = d(() => {
-        }, ["stop"])),
-        onKeydown: K
-      }, [
-        o("div", {
-          class: "vue-ui-draggable-dialog-header",
-          style: k({
-            backgroundColor: r.headerBg,
-            color: r.headerColor
-          })
-        }, [
-          o("span", {
-            class: "drag-handle",
-            "aria-hidden": "true",
-            onMousedown: d(T, ["stop", "prevent"]),
-            onTouchstart: d(T, ["stop", "prevent"])
-          }, [
-            (x(), O("svg", {
-              xmlns: Z(ae),
-              width: "20",
-              height: "20",
-              viewBox: "0 0 24 24",
-              fill: "none",
-              stroke: "currentColor",
-              "stroke-width": "1",
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round"
-            }, [...n[1] || (n[1] = [
-              o("path", { d: "M5 9m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, null, -1),
-              o("path", { d: "M5 15m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, null, -1),
-              o("path", { d: "M12 9m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, null, -1),
-              o("path", { d: "M12 15m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, null, -1),
-              o("path", { d: "M19 9m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, null, -1),
-              o("path", { d: "M19 15m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" }, null, -1)
-            ])], 8, de))
-          ], 32),
-          o("span", {
-            class: "vue-ui-draggable-dialog-title",
-            id: W
-          }, [
-            h(t.$slots, "title", {}, void 0, !0)
-          ]),
-          o("div", le, [
-            h(t.$slots, "actions", {}, void 0, !0),
-            o("button", {
-              ref_key: "closeButtonElement",
-              ref: D,
-              class: "close",
-              type: "button",
-              "aria-label": "Close dialog",
-              onClick: S,
-              style: k({
-                cursor: r.isCursorPointer ? "pointer" : "default"
-              })
-            }, [
-              _(oe, {
-                name: "close",
-                stroke: r.headerColor
-              }, null, 8, ["stroke"])
-            ], 4)
-          ])
-        ], 4),
-        o("div", {
-          id: H,
-          role: "document",
-          class: ee({
-            "vue-ui-draggable-dialog-body": !r.withPadding,
-            "vue-ui-draggable-dialog-body-pad": r.withPadding,
-            "vue-ui-draggable-dialog-body-full-width": r.withFullWidth
-          })
-        }, [
-          h(t.$slots, "before", {}, void 0, !0),
-          h(t.$slots, "content", {}, void 0, !0),
-          h(t.$slots, "after", {}, void 0, !0)
-        ], 2),
-        o("div", {
-          class: "resize-handle",
-          "aria-hidden": "true",
-          onMousedown: d(X, ["stop", "prevent"]),
-          onTouchstart: d(X, ["stop", "prevent"])
-        }, null, 32),
-        o("div", {
-          class: "resize-handle resize-handle-left",
-          "aria-hidden": "true",
-          onMousedown: d($, ["stop", "prevent"]),
-          onTouchstart: d($, ["stop", "prevent"])
-        }, null, 32)
-      ], 36)) : te("", !0)
-    ], 8, ["to"]));
-  }
-}, he = /* @__PURE__ */ re(se, [["__scopeId", "data-v-41359ac7"]]);
-export {
-  he as default
-};