mine-h5-ui/es/MeMspaint/index.vue.js

一款轻量级、模块化基于 Vue3.x 的 H5 前端 UI 组件库 👍

import { defineComponent as n, useModel as o, openBlock as r, createElementBlock as i, mergeProps as u, unref as f, mergeModels as s } from "vue";
import { useDraw as c } from "./hooks.js";
const k = /* @__PURE__ */ n({
  name: "MeMspaint",
  __name: "index",
  props: /* @__PURE__ */ s({
    width: { default: "200px" },
    height: { default: "200px" },
    background: { default: "#fff" },
    borderStyle: { type: [Boolean, String], default: !1 },
    strokeStyle: { default: "#f56c6c" },
    lineWidth: { default: 1 },
    visible: { type: Boolean, default: !0 }
  }, {
    modelValue: {},
    modelModifiers: {}
  }),
  emits: ["update:modelValue"],
  setup(e) {
    const t = e, a = o(e, "modelValue"), { canvasRef: l, getBorder: d } = c({ props: t, modelValue: a });
    return (m, h) => (r(), i("canvas", u({ width: parseInt(e.width), height: parseInt(e.height) }, {
      ref_key: "canvasRef",
      ref: l,
      class: "me-mspaint",
      style: {
        width: e.width,
        height: e.height,
        background: e.background,
        border: f(d)
      }
    }), null, 16));
  }
});
export {
  k as default
};