<script context="module">"use strict";
import { twMerge } from "tailwind-merge";
const iconModules = import.meta.glob("../assets/icons/*.svelte", { eager: true });
const iconMap = {};
for (const path in iconModules) {
  const iconName = path.split("/").pop()?.replace(".svelte", "") || "";
  iconMap[iconName] = iconModules[path].default;
}
</script>

<script>"use strict";
import { onMount } from "svelte";
export let iconName = void 0;
export let size = "md";
export let color = "stone";
export let className = "";
export let externalIcon = null;
const sizeClasses = {
  "2xs": "w-3 h-3",
  xs: "w-4 h-4",
  sm: "w-5 h-5",
  md: "w-6 h-6",
  lg: "w-8 h-8",
  xl: "w-9 h-9",
  "2xl": "w-10 h-10"
};
const colorClasses = {
  stone: "text-stone-600",
  amber: "text-amber-600",
  sky: "text-sky-600",
  blue: "text-blue-600",
  emerald: "text-emerald-600",
  rose: "text-rose-600",
  base: "text-base-50"
};
function getColorClass(colorValue) {
  if (colorValue in colorClasses) {
    return colorClasses[colorValue];
  }
  return colorValue;
}
let IconComponent = null;
let mounted = false;
onMount(() => {
  mounted = true;
  loadIcon();
});
async function loadIcon() {
  if (!iconName) {
    IconComponent = null;
    return;
  }
  if (iconMap[iconName]) {
    IconComponent = iconMap[iconName];
    return;
  }
  if (mounted) {
    try {
      const module = await import(`../assets/icons/${iconName}.svelte`);
      IconComponent = module.default;
    } catch (error) {
      console.error(`Failed to load icon: ${iconName}`, error);
      IconComponent = null;
    }
  }
}
$: if (externalIcon) {
  IconComponent = externalIcon;
} else if (iconName) {
  if (mounted) {
    loadIcon();
  } else {
    IconComponent = iconMap[iconName] || null;
  }
}
</script>

{#if IconComponent}
	<svelte:component
		this={IconComponent}
		className={twMerge(sizeClasses[size], getColorClass(color), className)}
	/>
{/if}
