@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/).
51 lines (50 loc) • 1.96 kB
JavaScript
import '../mt-badge.css';
import { defineComponent, computed, openBlock, createElementBlock, mergeProps, createCommentVNode, createBlock, renderSlot } from "vue";
import { _ as _sfc_main$1 } from "../mt-icon.vue_vue_type_style_index_0_lang-2cc5f73e.mjs";
import { _ as _export_sfc } from "../_plugin-vue_export-helper-cc2b3d55.mjs";
const _hoisted_1 = {
key: 0,
class: "mt-badge__indicator",
"aria-hidden": "true",
"data-testid": "mt-badge__indicator"
};
const _sfc_main = /* @__PURE__ */ 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 = computed(() => {
const normalizedSize = String(props.size ?? "s").toLowerCase();
return ["s", "m", "l"].includes(normalizedSize) ? normalizedSize : "s";
});
const iconSize = computed(() => size.value === "l" ? "12" : "10");
const badgeClasses = computed(() => [
`mt-badge--variant-${props.variant}`,
`mt-badge--size-${size.value}`
]);
return (_ctx, _cache) => {
return openBlock(), createElementBlock("span", mergeProps({
class: ["mt-badge", badgeClasses.value]
}, _ctx.$attrs), [
_ctx.statusIndicator ? (openBlock(), createElementBlock("span", _hoisted_1)) : createCommentVNode("", true),
_ctx.icon ? (openBlock(), createBlock(_sfc_main$1, {
key: 1,
name: _ctx.icon,
size: iconSize.value
}, null, 8, ["name", "size"])) : createCommentVNode("", true),
renderSlot(_ctx.$slots, "default", {}, void 0, true)
], 16);
};
}
});
const mtBadge_vue_vue_type_style_index_0_scoped_e87055a8_lang = "";
const MtBadge = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-e87055a8"]]);
export {
MtBadge as default
};
//# sourceMappingURL=MtBadge.js.map