bootstrap-vue-next
Version:
Seamless integration of Vue 3, Bootstrap 5, and TypeScript for modern, type-safe UI development
194 lines (193 loc) • 6.88 kB
JavaScript
require("./chunk-CoQrYLCe.js");
const require_dist = require("./dist-B_c893QG.js");
const require_useDefaults = require("./useDefaults-DK6Y9lar.js");
const require_BSpinner = require("./BSpinner-Kska3Bsd.js");
const require_BLink = require("./BLink-DW7s8W_N.js");
require("./src/types/index.umd.js");
let vue = require("vue");
//#endregion
//#region src/components/BButton/BButton.vue
var BButton_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "BButton",
props: /* @__PURE__ */ (0, vue.mergeModels)({
loading: {
type: Boolean,
default: false
},
loadingFill: {
type: Boolean,
default: false
},
loadingText: { default: "Loading..." },
pill: {
type: Boolean,
default: false
},
size: { default: "md" },
squared: {
type: Boolean,
default: false
},
tag: { default: "button" },
type: { default: "button" },
variant: { default: "secondary" },
active: {
type: Boolean,
default: false
},
activeClass: { default: void 0 },
disabled: {
type: Boolean,
default: void 0
},
exactActiveClass: { default: void 0 },
href: { default: void 0 },
icon: {
type: Boolean,
default: false
},
noRel: { type: Boolean },
opacity: { default: void 0 },
opacityHover: { default: void 0 },
prefetch: { type: Boolean },
prefetchOn: {},
noPrefetch: { type: Boolean },
prefetchedClass: {},
rel: { default: void 0 },
replace: {
type: Boolean,
default: void 0
},
routerComponentName: { default: void 0 },
routerTag: { default: void 0 },
stretched: {
type: Boolean,
default: false
},
target: { default: void 0 },
to: { default: void 0 },
underlineOffset: { default: void 0 },
underlineOffsetHover: { default: void 0 },
underlineOpacity: { default: void 0 },
underlineOpacityHover: { default: void 0 },
underlineVariant: { default: null }
}, {
"pressed": {
type: Boolean,
default: void 0
},
"pressedModifiers": {}
}),
emits: /* @__PURE__ */ (0, vue.mergeModels)(["click"], ["update:pressed"]),
setup(__props, { emit: __emit }) {
const props = require_useDefaults.useDefaults(__props, "BButton");
const emit = __emit;
const element = (0, vue.useTemplateRef)("_element");
const pressedValue = (0, vue.useModel)(__props, "pressed");
const { computedLink, computedLinkProps } = require_BLink.useBLinkHelper(props, [
"activeClass",
"exactActiveClass",
"replace",
"routerComponentName",
"routerTag",
"noPrefetch",
"prefetch",
"prefetchOn",
"prefetchedClass"
]);
const isToggle = (0, vue.computed)(() => typeof pressedValue.value === "boolean");
const isButton = (0, vue.computed)(() => props.tag === "button" && props.href === void 0 && props.to === void 0);
const isBLink = (0, vue.computed)(() => props.to !== void 0);
const nonStandardTag = (0, vue.computed)(() => props.href !== void 0 ? false : !isButton.value);
const linkProps = (0, vue.computed)(() => isBLink.value ? computedLinkProps.value : []);
const computedAriaDisabled = (0, vue.computed)(() => {
if (props.href === "#" && props.disabled) return true;
return nonStandardTag.value ? props.disabled : null;
});
const variantIsLinkType = (0, vue.computed)(() => props.variant?.startsWith("link") || false);
const variantIsLinkTypeSubset = (0, vue.computed)(() => props.variant?.startsWith("link-") || false);
const linkValueClasses = require_BLink.useLinkClasses((0, vue.computed)(() => ({ ...variantIsLinkType.value ? {
icon: props.icon,
opacity: props.opacity,
opacityHover: props.opacityHover,
underlineOffset: props.underlineOffset,
underlineOffsetHover: props.underlineOffsetHover,
underlineOpacity: props.underlineOpacity,
underlineOpacityHover: props.underlineOpacityHover,
underlineVariant: props.underlineVariant,
variant: variantIsLinkTypeSubset.value === true ? props.variant?.slice(5) : null
} : void 0 })));
const computedClasses = (0, vue.computed)(() => [
variantIsLinkType.value === true && computedLink.value === false ? linkValueClasses.value : void 0,
[`btn-${props.size}`],
{
[`btn-${props.variant}`]: props.variant !== null && variantIsLinkTypeSubset.value === false,
"active": props.active || pressedValue.value,
"rounded-pill": props.pill,
"rounded-0": props.squared,
"disabled": props.disabled
}
]);
const computedTag = (0, vue.computed)(() => isBLink.value ? require_BLink.BLink_default : props.href ? "a" : props.tag);
const clicked = (e) => {
if (props.disabled) {
e.preventDefault();
e.stopPropagation();
return;
}
emit("click", e);
if (isToggle.value) pressedValue.value = !pressedValue.value;
};
require_dist.onKeyStroke([" ", "enter"], (e) => {
if (props.href === "#") {
e.preventDefault();
element.value?.click();
}
}, { target: element });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(computedTag.value), (0, vue.mergeProps)({
ref: "_element",
class: "btn"
}, linkProps.value, {
class: computedClasses.value,
"aria-disabled": computedAriaDisabled.value,
"aria-pressed": isToggle.value ? pressedValue.value : null,
autocomplete: isToggle.value ? "off" : null,
disabled: isButton.value ? (0, vue.unref)(props).disabled : null,
href: (0, vue.unref)(props).href,
rel: (0, vue.unref)(computedLink) ? (0, vue.unref)(props).rel : null,
role: nonStandardTag.value || (0, vue.unref)(computedLink) ? "button" : null,
target: (0, vue.unref)(computedLink) ? (0, vue.unref)(props).target : null,
type: isButton.value ? (0, vue.unref)(props).type : null,
to: !isButton.value ? (0, vue.unref)(props).to : null,
onClick: clicked
}), {
default: (0, vue.withCtx)(() => [(0, vue.unref)(props).loading ? (0, vue.renderSlot)(_ctx.$slots, "loading", { key: 0 }, () => [!(0, vue.unref)(props).loadingFill ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(props).loadingText), 1)], 64)) : (0, vue.createCommentVNode)("", true), (0, vue.renderSlot)(_ctx.$slots, "loading-spinner", {}, () => [(0, vue.createVNode)(require_BSpinner.BSpinner_default, {
small: (0, vue.unref)(props).size !== "lg",
label: (0, vue.unref)(props).loadingFill ? (0, vue.unref)(props).loadingText : void 0
}, null, 8, ["small", "label"])])]) : (0, vue.renderSlot)(_ctx.$slots, "default", { key: 1 })]),
_: 3
}, 16, [
"class",
"aria-disabled",
"aria-pressed",
"autocomplete",
"disabled",
"href",
"rel",
"role",
"target",
"type",
"to"
]);
};
}
});
//#endregion
Object.defineProperty(exports, "BButton_default", {
enumerable: true,
get: function() {
return BButton_default;
}
});
//# sourceMappingURL=BButton-BID3NrxE.js.map