comic-plus
Version:
<p align="center"> <img width="200px" src="./logo.png"/> </p>
52 lines (51 loc) • 2.08 kB
JavaScript
import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, renderSlot, createCommentVNode, withDirectives, createElementVNode, normalizeStyle, createTextVNode, toDisplayString, vShow } from "vue";
import "../style/badge.css";
import "../../../utils/config.mjs";
import { isNumber } from "../../../utils/typescript.mjs";
import "@vueuse/core";
import { badgeProps } from "./main.props.mjs";
const _sfc_main = /* @__PURE__ */ defineComponent({
...{
name: "CuBadge"
},
__name: "main",
props: badgeProps,
setup(__props) {
const props = __props;
const currentValue = computed(() => {
return isNumber(props.value) ? props.value > props.max ? props.max + "+" : props.value : props.value;
});
const showBadge = computed(() => {
return isNumber(props.value) ? props.value <= 0 ? props.zeroShow : true : true;
});
const badgeStyle = computed(() => {
let offset = [].concat(props.offset);
return {
backgroundColor: props.color,
"--cu-badge-offsetx": offset[0] ? offset[0] + "px" : void 0,
"--cu-badge-offsety": offset[1] ? offset[1] + "px" : void 0,
maxWidth: props.ellipsis && !isNumber(props.value) ? "100%" : void 0
};
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock("span", {
class: normalizeClass(["cu-badge", _ctx.type ? "cu-badge--" + _ctx.type : void 0])
}, [
_ctx.$slots["default"] ? renderSlot(_ctx.$slots, "default", { key: 0 }) : createCommentVNode("", true),
withDirectives(createElementVNode("sup", {
class: normalizeClass(["cu-badge__inner", [{ position: _ctx.$slots["default"] }, { dot: _ctx.dot && !_ctx.$slots["corner"] }]]),
style: normalizeStyle(badgeStyle.value)
}, [
renderSlot(_ctx.$slots, "corner", {}, () => [
createTextVNode(toDisplayString(_ctx.dot ? null : currentValue.value), 1)
])
], 6), [
[vShow, showBadge.value]
])
], 2);
};
}
});
export {
_sfc_main as default
};