import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, normalizeClass as o, normalizeStyle as s, openBlock as c, renderList as l } from "vue";
var u = [".title"], d = /* @__PURE__ */ a({
	__name: "StackedRowCompact",
	props: {
		value: {},
		height: {}
	},
	setup(a) {
		let d = a, f = t(() => ({
			height: d.height ?? "100%",
			minHeight: "24px"
		})), p = t(() => {
			let e = d.value || [], t = e.reduce((e, t) => e + t.value, 0);
			return e.map((e) => {
				let n = e.value / t * 100, r = e.label;
				return {
					color: e.color.toString(),
					description: e.description,
					fraction: n,
					label: r
				};
			});
		});
		return (t, a) => (c(), r("div", {
			class: o([t.$style.component]),
			style: s(f.value)
		}, [i("div", { class: o(t.$style.container) }, [p.value.length ? n("", !0) : (c(), r("div", {
			key: 0,
			class: o(t.$style.notReady)
		}, "Not ready", 2)), (c(!0), r(e, null, l(p.value, (e, t) => (c(), r("div", {
			key: t,
			".title": e.description ?? e.label,
			style: s({
				width: `${e.fraction}%`,
				backgroundColor: e.color
			})
		}, null, 44, u))), 128))], 2)], 6));
	}
});
export { d as default };

//# sourceMappingURL=StackedRowCompact.vue2.js.map