bootstrap-vue-next/dist/BAspect-CwokVvvn.mjs

Seamless integration of Vue 3, Bootstrap 5, and TypeScript for modern, type-safe UI development

import { t as useDefaults } from "./useDefaults-BKgBaqOV.mjs";
import { computed, createBlock, createElementVNode, defineComponent, normalizeStyle, openBlock, renderSlot, resolveDynamicComponent, unref, withCtx } from "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__ */ defineComponent({
	__name: "BAspect",
	props: {
		tag: { default: "div" },
		aspect: { default: "1:1" }
	},
	setup(__props) {
		const props = useDefaults(__props, "BAspect");
		const computedPadding = 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 openBlock(), createBlock(resolveDynamicComponent(unref(props).tag), { class: "b-aspect d-flex" }, {
				default: withCtx(() => [createElementVNode("div", {
					style: normalizeStyle({
						paddingBottom: computedPadding.value,
						height: 0
					}),
					class: "b-aspect-sizer flex-grow-1"
				}, null, 4), createElementVNode("div", _hoisted_1, [renderSlot(_ctx.$slots, "default")])]),
				_: 3
			});
		};
	}
});
//#endregion
export { BAspect_default as t };

//# sourceMappingURL=BAspect-CwokVvvn.mjs.map