vuux
Version:
Vue3 Nuxt3 Nuxt4 组件库
70 lines (69 loc) • 2.18 kB
JavaScript
import { defineComponent as b, useSlots as v, createElementBlock as o, openBlock as s, normalizeStyle as y, normalizeClass as _, unref as e, withDirectives as C, createElementVNode as l, isRef as B, vModelCheckbox as g, renderSlot as V, createCommentVNode as w, Fragment as N, createTextVNode as S, toDisplayString as D } from "vue";
import { useCheckBox as z } from "./hook/useCheckBox.mjs";
const E = ["disabled", "value"], L = { class: "checkbox-wrapper" }, M = {
fill: "none",
viewBox: "0 0 24 24",
class: "is-icon"
}, j = {
key: 0,
x1: "4",
y1: "12",
x2: "20",
y2: "12",
stroke: "#ffffff",
"stroke-width": "4",
"stroke-linecap": "round"
}, F = {
key: 1,
class: "icon-path",
"stroke-linejoin": "round",
"stroke-linecap": "round",
"stroke-width": "3",
stroke: "currentColor",
d: "M4 12L10 18L20 6"
}, I = { class: "is-text" }, U = /* @__PURE__ */ b({
name: "CheckBox",
__name: "index",
props: {
modelValue: { type: Boolean },
label: {},
value: { default: "" },
disabled: { type: Boolean },
indeterminate: { type: Boolean },
theme: { default: "var(--app-theme)" }
},
emits: ["update:modelValue", "change"],
setup(d, { emit: c }) {
const n = d, m = c, u = v(), { isIndeterminate: p, isDisabled: h, themeColor: k, model: a, classNames: f, onChange: r } = z(n, m);
return (x, t) => (s(), o("label", {
class: _(e(f)),
style: y("--checkbox-theme:" + e(k))
}, [
C(l("input", {
"onUpdate:modelValue": t[0] || (t[0] = (i) => B(a) ? a.value = i : null),
type: "checkbox",
disabled: e(h),
value: n.value,
onChange: t[1] || (t[1] = //@ts-ignore
(...i) => e(r) && e(r)(...i))
}, null, 40, E), [
[g, e(a)]
]),
l("div", L, [
t[2] || (t[2] = l("div", { class: "checkbox-inner" }, null, -1)),
(s(), o("svg", M, [
e(p) ? (s(), o("line", j)) : (s(), o("path", F))
]))
]),
l("p", I, [
V(x.$slots, "default"),
e(u).default ? w("", !0) : (s(), o(N, { key: 0 }, [
S(D(n.label), 1)
], 64))
])
], 6));
}
});
export {
U as default
};