bootstrap-vue-next
Version:
Seamless integration of Vue 3, Bootstrap 5, and TypeScript for modern, type-safe UI development
50 lines (49 loc) • 1.72 kB
JavaScript
require("./chunk-CoQrYLCe.js");
const require_useDefaults = require("./useDefaults-DsLf4iRY.js");
let vue = require("vue");
//#region src/components/BAspect/BAspect.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1 = {
class: "b-aspect-content flex-grow-1 w-100 mw-100",
style: { "margin-left": "-100%" }
};
//#endregion
//#region src/components/BAspect/BAspect.vue
var BAspect_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "BAspect",
props: {
tag: { default: "div" },
aspect: { default: "1:1" }
},
setup(__props) {
const props = require_useDefaults.useDefaults(__props, "BAspect");
const computedPadding = (0, vue.computed)(() => {
const aspect = String(props.aspect);
let ratio;
if (/^\d+(\.\d*)?[/:x]\d+(\.\d*)?$/.test(aspect)) {
const [width = 1, height = 1] = aspect.split(/[/:x]/).map((v) => Number.parseFloat(v) || 1);
ratio = width / height;
} else ratio = Number.parseFloat(aspect) || 1;
return `${100 / Math.abs(ratio)}%`;
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(props).tag), { class: "b-aspect d-flex" }, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
style: (0, vue.normalizeStyle)({
paddingBottom: computedPadding.value,
height: 0
}),
class: "b-aspect-sizer flex-grow-1"
}, null, 4), (0, vue.createElementVNode)("div", _hoisted_1, [(0, vue.renderSlot)(_ctx.$slots, "default")])]),
_: 3
});
};
}
});
//#endregion
Object.defineProperty(exports, "BAspect_default", {
enumerable: true,
get: function() {
return BAspect_default;
}
});
//# sourceMappingURL=BAspect-BULTO240.js.map