import { icon, type IconName } from './icons';

type IconSpanProps = {
    name: IconName;
    size?: number;
    color?: string;
    class?: string;
};

// Safe: the SVG strings in icons.ts are hard-coded FontAwesome Pro paths bundled at
// compile time. No user input flows through here — nothing to sanitize.
export const IconSpan = ({ name, size = 16, color = 'currentColor', class: className }: IconSpanProps) => {
    const html = icon(name, size, color);
    return <span class={className} dangerouslySetInnerHTML={{ __html: html }} />;
};