import { n as __exportAll } from "./chunk-B-1-B7_t.js";
import { computed, createBlock, createCommentVNode, createElementBlock, defineComponent, normalizeClass, normalizeStyle, openBlock, ref, resolveDynamicComponent, unref, watch } from "vue";
import { X } from "@lucide/vue";
//#region src/components/compositions/elements/display/IconDisplay.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1 = ["data-icon-name"];
var IconDisplay_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
	__name: "IconDisplay",
	props: {
		iconName: {},
		size: { default: 20 },
		classList: {}
	},
	setup(__props) {
		/**
		* Props-driven icon display.
		*
		* Dynamically resolves a lucide icon by its PascalCase name (kebab-case
		* is normalised). The library is lazy-imported so we only pay for it
		* when an icon actually renders.
		*/
		const props = __props;
		function toPascalCase(input) {
			return input.replace(/[-_\s]+(.)?/g, (_, ch) => ch ? ch.toUpperCase() : "").replace(/^(.)/, (m) => m.toUpperCase());
		}
		const resolvedIconName = computed(() => {
			if (!props.iconName) return "";
			return toPascalCase(props.iconName);
		});
		const rootClass = computed(() => {
			const cl = props.classList;
			if (!cl) return "";
			return Array.isArray(cl) ? cl.join(" ") : cl;
		});
		const sizeStyle = computed(() => ({
			width: `${props.size}px`,
			height: `${props.size}px`
		}));
		const ResolvedIcon = ref(null);
		async function loadIcon(name) {
			if (!name) {
				ResolvedIcon.value = null;
				return;
			}
			ResolvedIcon.value = (await import("@lucide/vue"))[name] ?? null;
		}
		watch(resolvedIconName, (next) => {
			loadIcon(next);
		}, { immediate: true });
		return (_ctx, _cache) => {
			return openBlock(), createElementBlock("span", {
				class: normalizeClass(["inline-flex items-center", rootClass.value]),
				"data-icon-name": resolvedIconName.value,
				"data-testid": "icon-display"
			}, [ResolvedIcon.value ? (openBlock(), createBlock(resolveDynamicComponent(ResolvedIcon.value), {
				key: 0,
				style: normalizeStyle(sizeStyle.value),
				"aria-label": resolvedIconName.value
			}, null, 8, ["style", "aria-label"])) : !resolvedIconName.value ? (openBlock(), createBlock(unref(X), {
				key: 1,
				style: normalizeStyle(sizeStyle.value),
				class: "text-muted-foreground",
				"aria-hidden": "true",
				"data-testid": "icon-display-fallback"
			}, null, 8, ["style"])) : createCommentVNode("", true)], 10, _hoisted_1);
		};
	}
});
//#endregion
//#region src/components/compositions/elements/display/IconDisplay.vue
var IconDisplay_exports = /* @__PURE__ */ __exportAll({ default: () => IconDisplay_default });
var IconDisplay_default = IconDisplay_vue_vue_type_script_setup_true_lang_default;
//#endregion
export { IconDisplay_exports as n, IconDisplay_default as t };

//# sourceMappingURL=IconDisplay-CODUQMY3.js.map