form-imagining 0.0.90-52-beta42 → 0.0.90-52-beta44

package/dist/App-Ct1o7jCs.js

@@ -0,0 +1,32 @@
+import { defineComponent as c, onMounted as p, resolveComponent as i, createBlock as e, openBlock as o, unref as n, withCtx as t, createVNode as f, KeepAlive as u, resolveDynamicComponent as _ } from "vue";
+import { l as m, R as s } from "./index-Bgo1HpCv.js";
+const x = /* @__PURE__ */ c({
+  __name: "App",
+  setup(d) {
+    return p(() => {
+    }), (v, h) => {
+      const r = i("a-config-provider");
+      return o(), e(r, {
+        locale: n(m),
+        theme: { token: { fontSize: 13, borderRadius: 5, colorPrimary: "#1890ff" } }
+      }, {
+        default: t(() => [
+          f(n(s), null, {
+            default: t(({ Component: l, route: a }) => [
+              (o(), e(u, null, [
+                (o(), e(_(l), {
+                  key: a.fullPath
+                }))
+              ], 1024))
+            ]),
+            _: 1
+          })
+        ]),
+        _: 1
+      }, 8, ["locale"]);
+    };
+  }
+});
+export {
+  x as default
+};

package/dist/Area-DiY4lpVe.js

@@ -0,0 +1,4 @@
+import { v as f } from "./index-Bgo1HpCv.js";
+export {
+  f as default
+};

package/dist/Bar-DhVb8ncv.js

@@ -0,0 +1,4 @@
+import { w as f } from "./index-Bgo1HpCv.js";
+export {
+  f as default
+};

package/dist/CDrag-Bd__XCcH.js

@@ -0,0 +1,216 @@
+import { defineComponent as Z, ref as W, computed as k, onMounted as _, watch as ee, onBeforeUnmount as te, createElementBlock as x, createCommentVNode as M, openBlock as R, normalizeStyle as le, normalizeClass as ae, renderSlot as ne, withModifiers as z } from "vue";
+import { _ as re } from "./index-Bgo1HpCv.js";
+const ie = /* @__PURE__ */ Z({
+  __name: "CDrag",
+  props: {
+    element: {},
+    rulerRef: {},
+    selected: { type: Boolean }
+  },
+  emits: ["update:element", "select"],
+  setup($, { emit: q }) {
+    var P, B, S, T;
+    const t = $, X = q, d = W(!1), y = W(!1), v = W(!!t.selected), u = W(null), Y = W({ x: 0, y: 0 }), f = W({
+      element: null,
+      startX: 0,
+      startY: 0,
+      startWidth: 0,
+      startHeight: 0,
+      direction: null
+    });
+    t.rulerRef && ((B = (P = t.rulerRef).getCanvasWidth) != null && B.call(P), (T = (S = t.rulerRef).getCanvasHeight) != null && T.call(S));
+    const n = W(null), A = k(() => {
+      var a;
+      return n.value && y.value ? n.value.width : ((a = t.element) == null ? void 0 : a.width) || 0;
+    }), G = k(() => {
+      var a;
+      return n.value && y.value ? n.value.height : ((a = t.element) == null ? void 0 : a.height) || 0;
+    }), J = k(() => {
+      var a;
+      return d.value && u.value ? u.value.x : n.value && y.value ? n.value.x : ((a = t.element) == null ? void 0 : a.x) || 0;
+    }), K = k(() => {
+      var a;
+      return d.value && u.value ? u.value.y : n.value && y.value ? n.value.y : ((a = t.element) == null ? void 0 : a.y) || 0;
+    });
+    k(() => {
+      var a;
+      return n.value && y.value ? n.value.color : (a = t.element) == null ? void 0 : a.color;
+    });
+    function O(a, e) {
+      a.preventDefault(), a.stopPropagation(), X("select", e), d.value = !0, u.value = e, Y.value = {
+        x: a.clientX - e.x,
+        y: a.clientY - e.y
+      }, t.rulerRef && t.rulerRef.startDrag(e.id, e.x, e.y, e.width, e.height), document.addEventListener("mousemove", L), document.addEventListener("mouseup", D);
+    }
+    function L(a) {
+      var o, s, h, m;
+      if (!d.value || !u.value) return;
+      let e = a.clientX - Y.value.x, l = a.clientY - Y.value.y, p = 800, c = 600;
+      t.rulerRef && (p = ((s = (o = t.rulerRef).getCanvasWidth) == null ? void 0 : s.call(o)) || 800, c = ((m = (h = t.rulerRef).getCanvasHeight) == null ? void 0 : m.call(h)) || 600);
+      const r = u.value.width, i = u.value.height;
+      if (e = Math.max(0, e), l = Math.max(0, l), e = Math.min(e, p - r), l = Math.min(l, c - i), e = Math.max(0, e), l = Math.max(0, l), t.rulerRef) {
+        const w = t.rulerRef.updateDragPosition(e, l);
+        w.snapX !== null && (e = w.snapX), w.snapY !== null && (l = w.snapY);
+      }
+      e = Math.max(0, e), l = Math.max(0, l), u.value.x = Number(e.toFixed(2)), u.value.y = Number(l.toFixed(2));
+    }
+    function D() {
+      t.rulerRef && t.rulerRef.endDrag(), u.value && t.element && (t.element.x = Number(u.value.x.toFixed(2)), t.element.y = Number(u.value.y.toFixed(2))), u.value && X("update:element", u.value), d.value = !1, document.removeEventListener("mousemove", L), document.removeEventListener("mouseup", D), u.value = null;
+    }
+    function b(a, e, l) {
+      a.preventDefault(), a.stopPropagation(), X("select", e), y.value = !0, n.value = { ...e }, f.value = {
+        element: e,
+        startX: a.clientX,
+        startY: a.clientY,
+        startWidth: e.width,
+        startHeight: e.height,
+        direction: l
+      }, t.rulerRef && t.rulerRef.startResize(e.id, e.x, e.y, e.width, e.height), document.addEventListener("mousemove", N), document.addEventListener("mouseup", F);
+    }
+    function N(a) {
+      var I, U, j, V;
+      const e = f.value;
+      if (!y.value || !e.element || !e.direction || !n.value) return;
+      const l = e.element, p = a.clientX - e.startX, c = a.clientY - e.startY;
+      let r = e.startWidth, i = e.startHeight, o = l.x, s = l.y;
+      const h = 20, m = 20;
+      switch (e.direction) {
+        case "bottom-right":
+          r = Math.max(h, e.startWidth + p), i = Math.max(m, e.startHeight + c);
+          break;
+        case "bottom-left":
+          r = Math.max(h, e.startWidth - p), i = Math.max(m, e.startHeight + c), o = l.x + (e.startWidth - r);
+          break;
+        case "top-right":
+          r = Math.max(h, e.startWidth + p), i = Math.max(m, e.startHeight - c), s = l.y + (e.startHeight - i);
+          break;
+        case "top-left":
+          r = Math.max(h, e.startWidth - p), i = Math.max(m, e.startHeight - c), o = l.x + (e.startWidth - r), s = l.y + (e.startHeight - i);
+          break;
+        case "bottom":
+          i = Math.max(m, e.startHeight + c);
+          break;
+        case "right":
+          r = Math.max(h, e.startWidth + p);
+          break;
+        case "top":
+          i = Math.max(m, e.startHeight - c), s = l.y + (e.startHeight - i);
+          break;
+        case "left":
+          r = Math.max(h, e.startWidth - p), o = l.x + (e.startWidth - r);
+          break;
+      }
+      if (t.rulerRef) {
+        const g = t.rulerRef.updateResizePosition(o, s, r, i);
+        if (g) {
+          if (g.snapX !== null && (e.direction === "left" || e.direction === "top-left" || e.direction === "bottom-left")) {
+            const H = g.snapX, E = o - H;
+            o = H, r = r + E;
+          }
+          if (g.snapY !== null && (e.direction === "top" || e.direction === "top-left" || e.direction === "top-right")) {
+            const H = g.snapY, E = s - H;
+            s = H, i = i + E;
+          }
+        }
+      }
+      let w = 800, C = 600;
+      if (t.rulerRef && (w = ((U = (I = t.rulerRef).getCanvasWidth) == null ? void 0 : U.call(I)) || 800, C = ((V = (j = t.rulerRef).getCanvasHeight) == null ? void 0 : V.call(j)) || 600), r < h)
+        if (e.direction === "left" || e.direction === "top-left" || e.direction === "bottom-left") {
+          const g = l.x + e.startWidth;
+          r = h, o = g - h;
+        } else
+          r = h;
+      if (r = Math.min(r, w), i < m)
+        if (e.direction === "top" || e.direction === "top-left" || e.direction === "top-right") {
+          const g = l.y + e.startHeight;
+          i = m, s = g - m;
+        } else
+          i = m;
+      i = Math.min(i, C), o = Math.max(0, o), s = Math.max(0, s), o = Math.min(o, w - r), s = Math.min(s, C - i), n.value.x = Number(o.toFixed(2)), n.value.y = Number(s.toFixed(2)), n.value.width = Math.round(r), n.value.height = Math.round(i);
+    }
+    function F() {
+      f.value.element && n.value && (f.value.element.x = Number(n.value.x.toFixed(2)), f.value.element.y = Number(n.value.y.toFixed(2)), f.value.element.width = Math.round(n.value.width), f.value.element.height = Math.round(n.value.height)), f.value.element && X("update:element", f.value.element), y.value = !1, n.value = null, f.value = {
+        element: null,
+        startX: 0,
+        startY: 0,
+        startWidth: 0,
+        startHeight: 0,
+        direction: null
+      }, t.rulerRef && t.rulerRef.endResize(), document.removeEventListener("mousemove", N), document.removeEventListener("mouseup", F);
+    }
+    _(() => {
+      t.rulerRef && t.element && t.rulerRef.addDraggableElement(t.element);
+    }), ee(
+      () => t.selected,
+      (a) => {
+        v.value = !!a;
+      },
+      { immediate: !0 }
+    ), te(() => {
+    });
+    function Q() {
+      var a, e;
+      return t.rulerRef && ((e = (a = t.rulerRef).getCanvasWidth) == null ? void 0 : e.call(a)) || 800;
+    }
+    return (a, e) => t.element ? (R(), x("div", {
+      key: 0,
+      class: ae(["draggable-element", { selected: v.value }]),
+      style: le({
+        width: A.value + "px",
+        maxWidth: Q() + "px",
+        height: G.value + "px",
+        left: J.value + "px",
+        top: K.value + "px",
+        position: "absolute",
+        display: "flex",
+        justifyContent: "flex-start"
+      }),
+      onMousedown: e[8] || (e[8] = (l) => O(l, t.element))
+    }, [
+      ne(a.$slots, "default", {}, void 0, !0),
+      v.value && !d.value ? (R(), x("div", {
+        key: 0,
+        class: "resize-handle resize-handle-bottom-right",
+        onMousedown: e[0] || (e[0] = z((l) => b(l, t.element, "bottom-right"), ["stop"]))
+      }, null, 32)) : M("", !0),
+      v.value && !d.value ? (R(), x("div", {
+        key: 1,
+        class: "resize-handle resize-handle-bottom-left",
+        onMousedown: e[1] || (e[1] = z((l) => b(l, t.element, "bottom-left"), ["stop"]))
+      }, null, 32)) : M("", !0),
+      v.value && !d.value ? (R(), x("div", {
+        key: 2,
+        class: "resize-handle resize-handle-top-right",
+        onMousedown: e[2] || (e[2] = z((l) => b(l, t.element, "top-right"), ["stop"]))
+      }, null, 32)) : M("", !0),
+      v.value && !d.value ? (R(), x("div", {
+        key: 3,
+        class: "resize-handle resize-handle-top-left",
+        onMousedown: e[3] || (e[3] = z((l) => b(l, t.element, "top-left"), ["stop"]))
+      }, null, 32)) : M("", !0),
+      v.value && !d.value ? (R(), x("div", {
+        key: 4,
+        class: "resize-handle resize-handle-bottom",
+        onMousedown: e[4] || (e[4] = z((l) => b(l, t.element, "bottom"), ["stop"]))
+      }, null, 32)) : M("", !0),
+      v.value && !d.value ? (R(), x("div", {
+        key: 5,
+        class: "resize-handle resize-handle-right",
+        onMousedown: e[5] || (e[5] = z((l) => b(l, t.element, "right"), ["stop"]))
+      }, null, 32)) : M("", !0),
+      v.value && !d.value ? (R(), x("div", {
+        key: 6,
+        class: "resize-handle resize-handle-top",
+        onMousedown: e[6] || (e[6] = z((l) => b(l, t.element, "top"), ["stop"]))
+      }, null, 32)) : M("", !0),
+      v.value && !d.value ? (R(), x("div", {
+        key: 7,
+        class: "resize-handle resize-handle-left",
+        onMousedown: e[7] || (e[7] = z((l) => b(l, t.element, "left"), ["stop"]))
+      }, null, 32)) : M("", !0)
+    ], 38)) : M("", !0);
+  }
+}), se = /* @__PURE__ */ re(ie, [["__scopeId", "data-v-25a8f0a8"]]);
+export {
+  se as default
+};

package/dist/CRuler-Dk7dMRjy.js

@@ -0,0 +1,343 @@
+import { defineComponent as gt, ref as y, computed as k, onMounted as vt, watch as A, createElementBlock as R, openBlock as z, createElementVNode as S, normalizeStyle as b, renderSlot as mt, Fragment as G, renderList as J, normalizeClass as pt, nextTick as Pt } from "vue";
+import { _ as Ct } from "./index-Bgo1HpCv.js";
+const Mt = ["width"], yt = ["width", "height"], xt = ["width", "height"], wt = { class: "alignment-lines-container" }, bt = 25.4, kt = 96, Rt = /* @__PURE__ */ gt({
+  __name: "CRuler",
+  props: {
+    width: { default: 500 },
+    height: { default: 300 },
+    scale: { default: 1 },
+    scrollXmm: { default: 0 },
+    scrollYmm: { default: 0 },
+    thick: { default: 30 },
+    longTickColor: { default: "#555" },
+    shortTickColor: { default: "#ccc" },
+    rulerWidth: { default: void 0 },
+    rulerHeight: { default: void 0 },
+    alignmentLineColor: { default: "#1890ff" },
+    alignmentThreshold: { default: 5 },
+    margin: { default: [10, 10, 10, 10] }
+  },
+  emits: ["update:pageCount"],
+  setup(u, { expose: K, emit: O }) {
+    const $ = y([]), h = y([]), r = y(null), B = kt / bt, i = u, v = k(() => B * i.scale), m = k(() => i.rulerWidth || Math.round(i.width * v.value)), T = k(() => i.rulerHeight || Math.round(i.height * v.value)), x = y(1), L = k(() => Math.round(T.value - (i.margin[0] + i.margin[2]))), p = k(() => x.value === 1 ? Math.round(T.value) : Math.round(T.value + L.value * (x.value - 1))), Q = O, Y = y(null), W = y(null), Z = y(null);
+    function _() {
+      let t = 0;
+      for (const n of h.value) {
+        const e = n.y + n.height;
+        e > t && (t = e);
+      }
+      if (r.value) {
+        const n = r.value.y + r.value.height;
+        n > t && (t = n);
+      }
+      return t;
+    }
+    function w() {
+      const t = _(), n = T.value - (i.margin[0] + i.margin[2]);
+      if (n <= 0)
+        return;
+      const e = Math.max(1, Math.ceil(t / n));
+      e !== x.value && (x.value = e, Q("update:pageCount", e));
+    }
+    vt(() => {
+      w();
+    });
+    function V(t, n) {
+      const e = t, o = e + n;
+      return {
+        startMm: Math.floor(e) - 1,
+        // 起始位置提前1mm，确保0刻度完全显示
+        endMm: Math.ceil(o)
+      };
+    }
+    function tt(t, n, e, o, a, s, c, P) {
+      const l = window.devicePixelRatio || 1, g = B * e;
+      t.clearRect(0, 0, n * l, a * l), t.save(), t.scale(l, l), t.font = '11px -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif', t.lineWidth = 1;
+      const { startMm: E, endMm: I } = V(o, s), X = n;
+      for (let d = E; d <= I; d++) {
+        const f = (d - o) * g;
+        if (f < -10 || f > X + 10) continue;
+        const C = d % 10 === 0, M = C ? a * 0.5 : a * 0.2;
+        t.strokeStyle = C ? c : P, t.beginPath(), t.moveTo(f, a), t.lineTo(f, a - M), t.stroke(), C && (t.fillStyle = c, d === 0 ? (t.textAlign = "left", t.fillText((d / 10).toString(), f + 2, a - M - 3)) : (t.textAlign = "center", t.fillText((d / 10).toString(), f, a - M - 3)));
+      }
+      t.restore();
+    }
+    function et(t, n, e, o, a, s, c, P) {
+      const l = window.devicePixelRatio || 1, g = B * e;
+      t.clearRect(0, 0, a * l, n * l), t.save(), t.scale(l, l), t.font = '11px -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif', t.textAlign = "right", t.textBaseline = "middle", t.lineWidth = 1;
+      const { startMm: E, endMm: I } = V(o, s), X = n;
+      for (let d = E; d <= I; d++) {
+        const f = (d - o) * g;
+        if (f < -10 || f > X + 10) continue;
+        const C = d % 10 === 0, M = C ? a * 0.5 : a * 0.2;
+        t.strokeStyle = C ? c : P, t.beginPath(), t.moveTo(a, f), t.lineTo(a - M, f), t.stroke(), C && (t.fillStyle = c, d === 0 ? (t.textBaseline = "top", t.fillText((d / 10).toString(), a - M - 4, f + 2)) : (t.textBaseline = "middle", t.fillText((d / 10).toString(), a - M - 4, f)));
+      }
+      t.restore();
+    }
+    function D() {
+      const t = Y.value;
+      if (!t) return;
+      const n = t.getContext("2d");
+      if (!n) return;
+      const e = window.devicePixelRatio || 1, o = m.value, a = i.thick;
+      t.width = o * e, t.height = a * e, tt(
+        n,
+        o,
+        i.scale,
+        i.scrollXmm,
+        a,
+        i.width,
+        i.longTickColor,
+        i.shortTickColor
+      );
+    }
+    function F() {
+      const t = W.value;
+      if (!t) return;
+      const n = t.getContext("2d");
+      if (!n) return;
+      const e = window.devicePixelRatio || 1, o = p.value, a = i.thick;
+      t.width = a * e, t.height = o * e, et(
+        n,
+        o,
+        i.scale,
+        i.scrollYmm,
+        a,
+        i.height * x.value,
+        i.longTickColor,
+        i.shortTickColor
+      );
+    }
+    async function nt() {
+      await Pt(), D(), F();
+    }
+    A(
+      () => [i.scale, i.width, i.height, m.value, p.value],
+      () => {
+        nt();
+      },
+      { immediate: !0 }
+    ), A(
+      () => [i.scrollXmm],
+      () => D()
+    ), A(
+      () => [i.scrollYmm],
+      () => F()
+    );
+    function H(t) {
+      return {
+        left: t.x,
+        top: t.y,
+        right: t.x + t.width,
+        bottom: t.y + t.height
+        // centerX: element.x + element.width / 2,
+        // centerY: element.y + element.height / 2
+      };
+    }
+    function it(t, n, e) {
+      const o = H(t);
+      n.forEach((a) => {
+        if (a.id === t.id) return;
+        const s = H(a), c = [
+          { draggedPos: o.left, otherPos: s.left },
+          { draggedPos: o.left, otherPos: s.right },
+          { draggedPos: o.right, otherPos: s.left },
+          { draggedPos: o.right, otherPos: s.right }
+        ], P = [
+          { draggedPos: o.top, otherPos: s.top },
+          { draggedPos: o.top, otherPos: s.bottom },
+          { draggedPos: o.bottom, otherPos: s.top },
+          { draggedPos: o.bottom, otherPos: s.bottom }
+        ];
+        c.forEach((l) => {
+          Math.abs(l.draggedPos - l.otherPos) <= i.alignmentThreshold && (e.snapX || (e.snapX = t.x + (l.otherPos - l.draggedPos)), e.lines.push({
+            position: l.otherPos,
+            type: "vertical",
+            color: i.alignmentLineColor,
+            thickness: 1
+          }));
+        }), P.forEach((l) => {
+          Math.abs(l.draggedPos - l.otherPos) <= i.alignmentThreshold && (e.snapY || (e.snapY = t.y + (l.otherPos - l.draggedPos)), e.lines.push({
+            position: l.otherPos,
+            type: "horizontal",
+            color: i.alignmentLineColor,
+            thickness: 1
+          }));
+        });
+      });
+    }
+    function ot(t, n) {
+      const e = H(t);
+      [
+        e.left,
+        // 左边缘
+        e.right
+        // 右边缘  
+      ].forEach((a) => {
+        const s = a / v.value + i.scrollXmm, c = Math.round(s);
+        if (Math.abs(s - c) * v.value <= i.alignmentThreshold) {
+          const g = (c - i.scrollXmm) * v.value;
+          n.snapX || (n.snapX = t.x + (g - a)), n.lines.push({
+            position: g,
+            type: "vertical",
+            color: i.alignmentLineColor,
+            thickness: 1
+          });
+        }
+      });
+    }
+    function at(t, n) {
+      const e = H(t);
+      [
+        e.top,
+        // 上边缘
+        e.bottom
+        // 下边缘
+      ].forEach((a) => {
+        const s = a / v.value + i.scrollYmm, c = Math.round(s);
+        if (Math.abs(s - c) * v.value <= i.alignmentThreshold) {
+          const g = (c - i.scrollYmm) * v.value;
+          n.snapY || (n.snapY = t.y + (g - a)), n.lines.push({
+            position: g,
+            type: "horizontal",
+            color: i.alignmentLineColor,
+            thickness: 1
+          });
+        }
+      });
+    }
+    function N(t, n) {
+      const e = {
+        snapX: null,
+        snapY: null,
+        lines: []
+      };
+      return it(t, n, e), ot(t, e), at(t, e), e;
+    }
+    function U(t, n, e, o, a) {
+      r.value = {
+        id: t,
+        x: n,
+        y: e,
+        width: o,
+        height: a
+      };
+      const s = h.value.findIndex((c) => c.id === t);
+      s >= 0 && h.value.splice(s, 1);
+    }
+    function q() {
+      if (!r.value) return;
+      const t = h.value.findIndex((n) => n.id === r.value.id);
+      t >= 0 ? h.value[t] = r.value : h.value.push(r.value), w(), $.value = [], r.value = null;
+    }
+    function lt(t, n, e, o, a) {
+      U(t, n, e, o, a);
+    }
+    function st(t, n) {
+      if (!r.value) return;
+      r.value.x = t, r.value.y = n;
+      const e = N(r.value, h.value);
+      return j(e), w(), e;
+    }
+    function j(t) {
+      const n = m.value - i.margin[1] - i.margin[3], e = p.value;
+      $.value = t.lines.filter((o) => o.type === "vertical" ? o.position >= 0 && o.position <= n : o.position >= 0 && o.position <= e);
+    }
+    function rt() {
+      q();
+    }
+    function ut(t) {
+      const n = h.value.findIndex((e) => e.id === t.id);
+      n >= 0 ? h.value[n] = t : h.value.push(t), w();
+    }
+    function ct(t) {
+      const n = h.value.findIndex((e) => e.id === t);
+      n >= 0 && (h.value.splice(n, 1), w());
+    }
+    function dt(t, n, e, o, a) {
+      U(t, n, e, o, a);
+    }
+    function ht(t, n, e, o) {
+      if (!r.value) return;
+      r.value.x = t, r.value.y = n, r.value.width = e, r.value.height = o;
+      const a = N(r.value, h.value);
+      return j(a), w(), a;
+    }
+    function ft() {
+      q();
+    }
+    return K({
+      startDrag: lt,
+      updateDragPosition: st,
+      endDrag: rt,
+      addDraggableElement: ut,
+      removeDraggableElement: ct,
+      startResize: dt,
+      updateResizePosition: ht,
+      endResize: ft,
+      getCanvasWidth: () => m.value - i.margin[1] - i.margin[3],
+      getCanvasHeight: () => p.value
+    }), (t, n) => (z(), R("div", {
+      class: "ruler-container",
+      width: `${m.value + 30}`
+    }, [
+      S("div", {
+        class: "corner",
+        style: b({ width: u.thick + "px", height: u.thick + "px" })
+      }, null, 4),
+      S("canvas", {
+        ref_key: "horizontalCanvas",
+        ref: Y,
+        class: "ruler horizontal",
+        width: m.value,
+        height: u.thick,
+        style: b({ width: m.value + "px", height: u.thick + "px" })
+      }, null, 12, yt),
+      S("canvas", {
+        ref_key: "verticalCanvas",
+        ref: W,
+        class: "ruler vertical",
+        width: u.thick,
+        height: p.value,
+        style: b({ width: u.thick + "px", height: p.value + "px" })
+      }, null, 12, xt),
+      S("div", {
+        class: "ruler-content",
+        ref_key: "rulerContentRef",
+        ref: Z,
+        style: b({
+          width: `${m.value - u.margin[1] - u.margin[3]}px`,
+          minHeight: `${p.value - u.margin[0] - u.margin[2]}px`,
+          height: `${p.value - u.margin[0] - u.margin[2]}px`,
+          margin: `${u.margin[0]}px ${u.margin[1]}px ${u.margin[2]}px ${u.margin[3]}px`,
+          overflow: "visible",
+          position: "relative"
+        })
+      }, [
+        S("div", wt, [
+          (z(!0), R(G, null, J($.value, (e, o) => (z(), R("div", {
+            key: o,
+            class: pt(["alignment-line", { horizontal: e.type === "horizontal", vertical: e.type === "vertical" }]),
+            style: b({
+              [e.type === "horizontal" ? "top" : "left"]: `${e.position}px`,
+              backgroundColor: e.color || u.alignmentLineColor,
+              width: e.type === "horizontal" ? "100%" : `${e.thickness || 1}px`,
+              height: e.type === "horizontal" ? `${e.thickness || 1}px` : "100%"
+            })
+          }, null, 6))), 128))
+        ]),
+        (z(!0), R(G, null, J(x.value - 1, (e) => (z(), R("div", {
+          key: `page-break-${e}`,
+          class: "page-break",
+          style: b({
+            top: `${e * L.value}px`
+          })
+        }, null, 4))), 128)),
+        mt(t.$slots, "default", {}, void 0, !0)
+      ], 4)
+    ], 8, Mt));
+  }
+}), Tt = /* @__PURE__ */ Ct(Rt, [["__scopeId", "data-v-4d95338a"]]);
+export {
+  Tt as default
+};