"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Icon = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const useIconPack_js_1 = require("./useIconPack.js");
const Icon = ({ iconId, className = '', size = 'md', title, color, variant = 'solid', provider = 'default', onClick }) => {
    const { getIcon, loading, error } = (0, useIconPack_js_1.useIconPack)();
    const icon = getIcon(iconId, provider);
    if (loading) {
        return (0, jsx_runtime_1.jsx)("span", { className: `icon-loading ${className}`, children: "\u22EF" });
    }
    if (error || !icon) {
        return (0, jsx_runtime_1.jsx)("span", { className: `icon-error ${className}`, children: "\u26A0\uFE0F" });
    }
    const sizeClass = `icon-${size}`;
    const variantClass = `icon-${variant}`;
    const providerClass = `icon-${provider}`;
    const iconClass = `icon icon-${icon.pack} icon-${icon.name} ${sizeClass} ${variantClass} ${providerClass} ${className}`;
    const style = color ? { color } : undefined;
    const handleClick = onClick || undefined;
    // Support for SVG icons
    if (icon.svg) {
        return ((0, jsx_runtime_1.jsx)("span", { className: iconClass, title: title || icon.label, role: "img", "aria-label": icon.label, style: style, onClick: handleClick, dangerouslySetInnerHTML: { __html: icon.svg } }));
    }
    // Support for font icons
    if (icon.fontClass) {
        return ((0, jsx_runtime_1.jsx)("i", { className: `${icon.fontClass} ${iconClass}`, title: title || icon.label, role: "img", "aria-label": icon.label, style: style, onClick: handleClick }));
    }
    // Support for Unicode icons
    if (icon.unicode) {
        return ((0, jsx_runtime_1.jsx)("span", { className: iconClass, title: title || icon.label, role: "img", "aria-label": icon.label, style: style, onClick: handleClick, children: icon.unicode }));
    }
    // Fallback for legacy icons
    return ((0, jsx_runtime_1.jsx)("span", { className: iconClass, title: title || icon.label, role: "img", "aria-label": icon.label, style: style, onClick: handleClick }));
};
exports.Icon = Icon;
//# sourceMappingURL=Icon.js.map