mine-h5-ui
Version:
一款轻量级、模块化基于 Vue3.x 的 H5 前端 UI 组件库 👍
43 lines (42 loc) • 1.46 kB
JavaScript
import { defineComponent as r, useModel as f, openBlock as k, createElementBlock as h, unref as l, createVNode as p, createElementVNode as C, renderSlot as b, mergeModels as t } from "vue";
import v from "../MeIcon/index.vue.js";
import { useHandler as x } from "./hooks.js";
const V = ["data-checked", "data-disabled"], z = { class: "value" }, N = /* @__PURE__ */ r({
name: "MeCheckbox",
__name: "index",
props: /* @__PURE__ */ t({
name: { default: "" },
shape: { default: "round" },
icon: { default: "" },
iconSelect: { default: "" },
iconSize: { default: "20px" },
checkedColor: { default: "" },
disabled: { type: Boolean, default: !1 }
}, {
modelValue: { type: Boolean, default: !1 },
modelModifiers: {}
}),
emits: /* @__PURE__ */ t(["click"], ["update:modelValue"]),
setup(e, { emit: c }) {
const n = c, i = e, o = f(e, "modelValue"), { iconName: s, handleClick: a } = x({ props: i, emit: n, isChecked: o });
return (m, d) => (k(), h("div", {
class: "me-checkbox",
"data-checked": o.value + "",
"data-disabled": e.disabled + "",
onClick: d[0] || (d[0] = //@ts-ignore
(...u) => l(a) && l(a)(...u))
}, [
p(v, {
name: l(s),
color: o.value ? e.checkedColor : "",
size: e.iconSize
}, null, 8, ["name", "color", "size"]),
C("div", z, [
b(m.$slots, "default")
])
], 8, V));
}
});
export {
N as default
};