@shopware-ag/meteor-component-library
Version:
The meteor component library is a Vue component library developed by Shopware. It is based on the [Meteor Design System](https://shopware.design/).
50 lines (49 loc) • 2 kB
JavaScript
import '../mt-badge.css';
;
const vue = require("vue");
const mtIcon_vue_vue_type_style_index_0_lang = require("../mt-icon.vue_vue_type_style_index_0_lang-0a28c7b6.js");
const _pluginVue_exportHelper = require("../_plugin-vue_export-helper-9c783a34.js");
const _hoisted_1 = {
key: 0,
class: "mt-badge__indicator",
"aria-hidden": "true",
"data-testid": "mt-badge__indicator"
};
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
__name: "mt-badge",
props: {
variant: { default: "neutral" },
icon: { default: void 0 },
size: { default: "s" },
statusIndicator: { type: Boolean, default: false }
},
setup(__props) {
const props = __props;
const size = vue.computed(() => {
const normalizedSize = String(props.size ?? "s").toLowerCase();
return ["s", "m", "l"].includes(normalizedSize) ? normalizedSize : "s";
});
const iconSize = vue.computed(() => size.value === "l" ? "12" : "10");
const badgeClasses = vue.computed(() => [
`mt-badge--variant-${props.variant}`,
`mt-badge--size-${size.value}`
]);
return (_ctx, _cache) => {
return vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
class: ["mt-badge", badgeClasses.value]
}, _ctx.$attrs), [
_ctx.statusIndicator ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1)) : vue.createCommentVNode("", true),
_ctx.icon ? (vue.openBlock(), vue.createBlock(mtIcon_vue_vue_type_style_index_0_lang._sfc_main, {
key: 1,
name: _ctx.icon,
size: iconSize.value
}, null, 8, ["name", "size"])) : vue.createCommentVNode("", true),
vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
], 16);
};
}
});
const mtBadge_vue_vue_type_style_index_0_scoped_e87055a8_lang = "";
const MtBadge = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-e87055a8"]]);
module.exports = MtBadge;
//# sourceMappingURL=MtBadge.js.map