import e from "../assets/images/24_checkbox-light-enabled-unchecked.js";
import t from "../assets/images/24_checkbox-light-enabled-checked.js";
import { computed as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, defineComponent as o, normalizeClass as s, openBlock as c, toDisplayString as l } from "vue";
var u = ["innerHTML"], d = { class: "dropdown-list-item__title-container" }, f = { class: "dropdown-list-item__title text-s" }, p = {
	key: 0,
	class: "dropdown-list-item__description text-description"
}, m = {
	key: 1,
	class: "dropdown-list-item__icon flex-self-start"
}, h = /* @__PURE__ */ o({
	__name: "DropdownListItem",
	props: {
		option: {},
		isSelected: {
			type: Boolean,
			default: !1
		},
		size: { default: "small" },
		isHovered: {
			type: Boolean,
			default: !1
		},
		useCheckbox: {
			type: Boolean,
			default: !1
		}
	},
	setup(o) {
		let h = o, g = n(() => {
			let e = [];
			return h.size === "small" && e.push("dropdown-list-item__small"), h.isSelected && e.push("dropdown-list-item__selected"), h.isHovered && e.push("hovered-item"), e.join(" ");
		}), _ = n(() => {
			let e = ["dropdown-list-item__checkbox", "flex-self-start"];
			return h.isSelected && e.push("checked"), e.join(" ");
		}), v = n(() => h.isSelected ? t : e);
		return (e, t) => (c(), i("div", { class: s([g.value, "dropdown-list-item"]) }, [
			h.useCheckbox ? (c(), i("div", {
				key: 0,
				class: s(_.value),
				innerHTML: v.value
			}, null, 10, u)) : r("", !0),
			a("div", d, [a("div", f, l(o.option.label), 1), o.option.description ? (c(), i("div", p, l(o.option.description), 1)) : r("", !0)]),
			!h.useCheckbox && h.isSelected ? (c(), i("div", m)) : r("", !0)
		], 2));
	}
});
export { h as default };

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