@opensig/opendesign
Version:
<p align="center"><img src="../docs/public/opendesign-logo-light.png"/></p> <h1 align="center">opendesign</h1> <p align="center">一个 Vue 3 组件库</p> <p align="center"><b>皮肤可定制,使用 TypeScript</b></p>
66 lines (65 loc) • 1.88 kB
JavaScript
import { defineComponent, computed, createElementBlock, openBlock, normalizeClass, renderSlot, createElementVNode, normalizeStyle, toDisplayString } from "vue";
import { badgeProps } from "./types.mjs";
import { isNumber } from "../_utils/is.mjs";
const _hoisted_1 = { class: "o-badge-label" };
const _sfc_main = /* @__PURE__ */ defineComponent({
__name: "OBadge",
props: badgeProps,
setup(__props) {
const props = __props;
const content = computed(() => {
if (props.dot) {
return "";
}
if (isNumber(props.value) && isNumber(props.max)) {
return props.value < props.max ? `${props.value}` : `${props.max}+`;
}
return props.value;
});
const style = computed(() => {
const [x, y] = props.offset;
const right = isNumber(x) ? `-${x}px` : `-${x}`;
const top = isNumber(y) ? `${y}px` : `${y}`;
return {
right,
top
};
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock(
"div",
{
class: normalizeClass(["o-badge", [`o-badge-${props.color}`, { "o-badge-dot": props.dot, "o-badge-only": !_ctx.$slots.default }]])
},
[
renderSlot(_ctx.$slots, "default"),
createElementVNode(
"sup",
{
class: "o-badge-content",
style: normalizeStyle(style.value)
},
[
renderSlot(_ctx.$slots, "content", {}, () => [
createElementVNode(
"div",
_hoisted_1,
toDisplayString(content.value),
1
/* TEXT */
)
])
],
4
/* STYLE */
)
],
2
/* CLASS */
);
};
}
});
export {
_sfc_main as default
};