vue3-scale-ruler/es/components/RulerLine.vue2.js

import { defineComponent as f, computed as d, openBlock as l, createElementBlock as o, normalizeClass as m, normalizeStyle as n, toDisplayString as r, createElementVNode as a, createBlock as h, resolveDynamicComponent as v, Fragment as y, createTextVNode as k } from "vue";
const C = { key: 0 }, H = /* @__PURE__ */ f({
  __name: "RulerLine",
  props: {
    start: { default: 0 },
    offset: { default: 0 },
    h: { type: Boolean, default: !0 },
    value: { default: 0 },
    isHover: { type: Boolean, default: !1 },
    thick: { default: 0 },
    lineCloseIcon: {}
  },
  emits: ["del"],
  setup(s, { emit: i }) {
    const t = s, u = i, p = () => {
      u("del");
    }, c = d(() => ({
      [t.h ? "left" : "top"]: `${t.start}px`,
      transform: `translate${t.h ? "X" : "Y"}(${t.offset}px)`
    }));
    return (e, B) => (l(), o("div", {
      class: m(["ruler-line", [e.h ? "ruler-line-h" : "ruler-line-v", { "ruler-line-hover": e.isHover }]]),
      style: n(c.value)
    }, [
      e.isHover ? (l(), o("span", C, r(Math.ceil(e.value)), 1)) : (l(), o("div", {
        key: 1,
        style: n({ [e.h ? "top" : "left"]: `${e.thick}px` })
      }, [
        a("i", { onClick: p }, [
          e.lineCloseIcon ? (l(), h(v(e.lineCloseIcon), { key: 0 })) : (l(), o(y, { key: 1 }, [
            k(" X ")
          ], 64))
        ]),
        a("span", null, r(Math.ceil(e.value)), 1)
      ], 4))
    ], 6));
  }
});
export {
  H as default
};