vexip-ui
Version:
A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good
51 lines (50 loc) • 1.42 kB
JavaScript
import { defineComponent as c, computed as t, createVNode as d } from "vue";
import { useProps as f, useNameHelper as v } from "@vexip-ui/config";
import { isColor as k, boundRange as y } from "@vexip-ui/utils";
import { titleProps as b } from "./props.mjs";
const N = /* @__PURE__ */ c({
name: "Title",
props: b,
emits: [],
setup(n, {
slots: a
}) {
const e = f("title", n, {
type: "default",
level: 5,
top: !1,
marker: !1,
aligned: !1,
thin: !1,
markerType: null
}), r = v("title"), l = t(() => k(e.markerType)), o = t(() => e.markerType || e.type), u = t(() => ({
[r.b()]: !0,
[r.bs("vars")]: !0,
[r.bm("inherit")]: e.inherit,
[r.bm(e.type)]: e.type !== "default",
[r.bm("top")]: e.top,
[r.bm("marker")]: e.marker,
[r.bm("aligned")]: e.aligned,
[r.bm("thin")]: e.thin,
[r.bm(`marker-${o.value}`)]: !l.value && o.value !== "default"
})), p = t(() => y(Math.round(e.level), 1, 6) || 5), s = t(() => l.value ? {
[r.cv("marker-color")]: e.markerType
} : null);
return () => {
const i = `h${p.value}`;
return d(i, {
class: u.value,
style: s.value
}, {
default: () => {
var m;
return [(m = a.default) == null ? void 0 : m.call(a)];
}
});
};
}
});
export {
N as default
};
//# sourceMappingURL=title.mjs.map