bootstrap-vue-next
Version:
Seamless integration of Vue 3, Bootstrap 5, and TypeScript for modern, type-safe UI development
86 lines (85 loc) • 3.17 kB
JavaScript
require("./chunk-CoQrYLCe.js");
const require_useDefaults = require("./useDefaults-DsLf4iRY.js");
const require_useId = require("./useId-DHrBgM7P.js");
const require_useColorVariantClasses = require("./useColorVariantClasses-CEfOwjPv.js");
const require_BCloseButton = require("./BCloseButton-CN__Jjcj.js");
let vue = require("vue");
//#region src/components/BFormTags/BFormTag.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1 = ["id"];
//#endregion
//#region src/components/BFormTags/BFormTag.vue
var BFormTag_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "BFormTag",
props: {
disabled: {
type: Boolean,
default: false
},
id: { default: void 0 },
noRemove: {
type: Boolean,
default: false
},
pill: {
type: Boolean,
default: false
},
removeLabel: { default: "Remove tag" },
tag: { default: "span" },
title: { default: void 0 },
variant: { default: "secondary" }
},
emits: ["remove"],
setup(__props, { emit: __emit }) {
const props = require_useDefaults.useDefaults(__props, "BFormTag");
const emit = __emit;
const slots = (0, vue.useSlots)();
const computedId = require_useId.useId(() => props.id);
const tagText = (0, vue.computed)(() => ((slots.default?.({})[0].children ?? "").toString() || props.title) ?? "");
const taglabelId = (0, vue.computed)(() => `${computedId.value}taglabel__`);
const colorClasses = require_useColorVariantClasses.useColorVariantClasses(props);
const computedClasses = (0, vue.computed)(() => [colorClasses.value, {
"rounded-pill": props.pill,
"disabled": props.disabled
}]);
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(props).tag), {
id: (0, vue.unref)(computedId),
title: tagText.value,
class: (0, vue.normalizeClass)(["badge b-form-tag d-inline-flex align-items-center mw-100", computedClasses.value]),
"aria-labelledby": taglabelId.value
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", {
id: taglabelId.value,
class: "b-form-tag-content flex-grow-1 text-truncate"
}, [(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(tagText.value), 1)])], 8, _hoisted_1), !(0, vue.unref)(props).disabled && !(0, vue.unref)(props).noRemove ? ((0, vue.openBlock)(), (0, vue.createBlock)(require_BCloseButton.BCloseButton_default, {
key: 0,
"aria-keyshortcuts": "Delete",
"aria-label": (0, vue.unref)(props).removeLabel,
class: "b-form-tag-remove",
"aria-describedby": taglabelId.value,
"aria-controls": (0, vue.unref)(props).id,
onClick: _cache[0] || (_cache[0] = ($event) => emit("remove", tagText.value))
}, null, 8, [
"aria-label",
"aria-describedby",
"aria-controls"
])) : (0, vue.createCommentVNode)("", true)]),
_: 3
}, 8, [
"id",
"title",
"class",
"aria-labelledby"
]);
};
}
});
//#endregion
Object.defineProperty(exports, "BFormTag_default", {
enumerable: true,
get: function() {
return BFormTag_default;
}
});
//# sourceMappingURL=BFormTag-C7B-bX72.js.map