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

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

import { defineComponent as c, openBlock as n, createElementBlock as u, unref as o, normalizeStyle as m, normalizeClass as r, createBlock as y, createCommentVNode as b, renderSlot as s } from "vue";
import k from "../MeIcon/index.vue.js";
import { useHandler as $ } from "./hooks.js";
const B = ["type"], x = /* @__PURE__ */ c({
  name: "MeButton",
  __name: "index",
  props: {
    nativeType: { default: "button" },
    width: { default: "" },
    type: { default: "default" },
    plain: { type: Boolean, default: !1 },
    disabled: { type: Boolean, default: !1 },
    icon: { default: "" },
    color: { default: "" }
  },
  emits: ["click"],
  setup(e, { emit: a }) {
    const i = a, { onClick: t } = $(i);
    return (f, l) => (n(), u("button", {
      type: e.nativeType,
      class: r([
        "me-button",
        `me-button-${e.type}`,
        {
          "me-button-plain": e.plain,
          disabled: e.disabled
        }
      ]),
      style: m(`width:${e.width}; color:${e.type === "default" || e.plain ? e.color : "#fff"}; background:${e.plain ? "#fff" : e.color}; border-color:${e.color};`),
      onClick: l[0] || (l[0] = //@ts-ignore
      (...d) => o(t) && o(t)(...d))
    }, [
      e.icon ? (n(), y(k, {
        key: 0,
        name: e.icon,
        color: `${e.type === "default" || e.plain ? e.color : "#fff"}`,
        size: "16px"
      }, null, 8, ["name", "color"])) : b("", !0),
      s(f.$slots, "default")
    ], 14, B));
  }
});
export {
  x as default
};