snowy-designer/dist/hooks/src/common/element.js

基于Epic-Designer-Pro版本的设计器,可视化开发页面表单

import { ref as f, watch as d } from "vue";
import { onKeyDown as c, onKeyUp as i } from "@vueuse/core";
import { useStore as A } from "../store/index.js";
function w() {
  const t = f(!1), e = f(!1), l = f(!1);
  return c(" ", () => {
    t.value = !0;
  }), i(" ", () => {
    t.value = !1;
  }), c("Shift", (r) => {
    r.preventDefault(), e.value = !0;
  }), i("Shift", () => {
    e.value = !1;
  }), c("Control", (r) => {
    r.preventDefault(), l.value = !0;
  }), i("Control", () => {
    l.value = !1;
  }), { pressCtrl: l, pressShift: e, pressSpace: t };
}
function h(t) {
  const { pressSpace: e } = A(), l = new Image(1, 1);
  l.src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNk+M9QDwADhgGAWjR9awAAAABJRU5ErkJggg==";
  let r = 0, a = 0;
  function n(u, o = !1) {
    var s;
    o && (r = u.x, a = u.y, (s = u.dataTransfer) == null || s.setDragImage(document.createElement("div"), 0, 0));
  }
  function m(u, o = !1) {
    if (u.preventDefault(), !u.x || !u.y || !o)
      return;
    const s = u.x - r, v = u.y - a;
    r = u.x, a = u.y, t.value && (t.value.scrollTop -= v, t.value.scrollLeft -= s);
  }
  function p() {
    e.value = !1;
  }
  return { handleElementDrag: m, handleElementDragEnd: p, handleElementDragStart: n };
}
function E(t) {
  const { canvasScale: e, disabledZoom: l } = A();
  function r(a) {
    if (!a.ctrlKey || l.value)
      return;
    a.preventDefault();
    let n = 0;
    n = a.deltaY < 0 ? e.value + 0.05 : e.value - 0.05, !(n > 150 || n < 0.5) && (e.value = n);
  }
  return d(
    () => e.value,
    (a) => {
      t.value && !l.value && (t.value.style.transform = `scale(${a})`);
    }
  ), { canvasScale: e, handleZoom: r };
}
function S(t, e = 16.66) {
  let l;
  function r() {
    a(), l = window.setInterval(t, e);
  }
  function a() {
    window.clearInterval(l);
  }
  return {
    startTimedQuery: r,
    stopTimedQuery: a
  };
}
export {
  h as useElementDrag,
  E as useElementZoom,
  w as useKeyPress,
  S as useTimedQuery
};