import { h } from "@stencil/core";
/**
 * 内置常用图标 SVG path 映射表（24x24 viewBox，stroke/fill 由 currentColor 继承）
 * 设计参照 Ant Design / Element Plus 常用后台图标。
 */
const ICON_PATHS = {
    edit: 'M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04a1 1 0 0 0 0-1.41l-2.34-2.34a1 1 0 0 0-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z',
    delete: 'M6 7h12v13a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1V7zm3-3h6l1 2H8l1-2zM4 6h16v2H4V6z',
    plus: 'M11 5h2v6h6v2h-6v6h-2v-6H5v-2h6V5z',
    search: 'M10 4a6 6 0 1 0 3.9 10.5l4.3 4.3 1.4-1.4-4.3-4.3A6 6 0 0 0 10 4zm0 2a4 4 0 1 1 0 8 4 4 0 0 1 0-8z',
    refresh: 'M12 5V2L8 6l4 4V7a5 5 0 1 1-5 5H5a7 7 0 1 0 7-7z',
    check: 'M9 16.2l-3.5-3.5L4 14.2 9 19.2 20 8.2l-1.5-1.5z',
    close: 'M6 6l12 12M18 6L6 18',
    'arrow-up': 'M12 5l7 7h-4v7h-6v-7H5z',
    'arrow-down': 'M12 19l-7-7h4V5h6v7h4z',
    'arrow-left': 'M5 12l7-7v4h7v6h-7v4z',
    'arrow-right': 'M19 12l-7 7v-4H5V9h7V5z',
    eye: 'M12 5c-7 0-10 7-10 7s3 7 10 7 10-7 10-7-3-7-10-7zm0 11a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-6a2 2 0 1 0 0 4 2 2 0 0 0 0-4z',
    setting: 'M12 8a4 4 0 1 0 0 8 4 4 0 0 0 0-8zm9 4a8.9 8.9 0 0 0-.2-2l2-1.5-2-3.5-2.4 1a8 8 0 0 0-3.4-2L14.5 1h-5l-.3 2.5a8 8 0 0 0-3.4 2l-2.4-1-2 3.5L3.4 10a8.9 8.9 0 0 0 0 4l-2 1.5 2 3.5 2.4-1a8 8 0 0 0 3.4 2l.3 2.5h5l.3-2.5a8 8 0 0 0 3.4-2l2.4 1 2-3.5-2-1.5c.1-.6.2-1.3.2-2z',
    user: 'M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10zm0 2c-5 0-9 2.5-9 6v2h18v-2c0-3.5-4-6-9-6z',
    bell: 'M12 22a2 2 0 0 0 2-2h-4a2 2 0 0 0 2 2zm6-6V11a6 6 0 0 0-5-5.9V4a1 1 0 0 0-2 0v1.1A6 6 0 0 0 6 11v5l-2 2v1h16v-1l-2-2z',
    menu: 'M3 6h18v2H3V6zm0 5h18v2H3v-2zm0 5h18v2H3v-2z',
    home: 'M12 3l9 8h-3v9h-4v-6H10v6H6v-9H3z',
    upload: 'M9 16h6v-6h4l-7-7-7 7h4v6zm-4 2h14v2H5v-2z',
    download: 'M9 4h6v8h4l-7 7-7-7h4V4zm-4 14h14v2H5v-2z',
    info: 'M11 7h2v2h-2V7zm0 4h2v6h-2v-6zm1-9a10 10 0 1 0 0 20 10 10 0 0 0 0-20z',
    warning: 'M12 2L1 21h22L12 2zm1 14h-2v2h2v-2zm0-6h-2v4h2v-4z',
};
/**
 * Icon 图标组件
 * 内置常用后台图标，替换项目内散落的 emoji 图标。
 * 通过 name 查表渲染对应 SVG，未知 name 渲染占位。
 */
export class Icon {
    /** 图标名（查 ICON_PATHS 映射表） */
    name = '';
    /** 尺寸（number 视为 px，string 直接作为 width/height） */
    size = '1em';
    /** 颜色（默认继承 currentColor） */
    color = 'inherit';
    /** 是否旋转动画 */
    spin = false;
    normalizeSize() {
        if (typeof this.size === 'number') {
            return `${this.size}px`;
        }
        return this.size;
    }
    render() {
        const dimension = this.normalizeSize();
        const path = ICON_PATHS[this.name];
        const svgStyle = {
            width: dimension,
            height: dimension,
            color: this.color,
        };
        if (path) {
            // close / arrow 等使用 stroke 描边；info/warning/eye 等使用 fill 填充
            const strokeBased = this.name === 'close' || this.name.startsWith('arrow-');
            return (h("svg", { class: { 'hb-icon': true, 'hb-icon--spin': this.spin }, viewBox: "0 0 24 24", style: svgStyle, fill: strokeBased ? 'none' : 'currentColor', stroke: strokeBased ? 'currentColor' : 'none', "stroke-width": strokeBased ? 2 : 0, "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("path", { d: path })));
        }
        // 未知 name：渲染占位方块 + title 文本
        return (h("span", { class: { 'hb-icon': true, 'hb-icon--spin': this.spin, 'hb-icon--placeholder': true }, style: svgStyle, role: "img", "aria-label": this.name }, this.name || ''));
    }
    static get is() { return "hb-icon"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["icon.css"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["icon.css"]
        };
    }
    static get properties() {
        return {
            "name": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "\u56FE\u6807\u540D\uFF08\u67E5 ICON_PATHS \u6620\u5C04\u8868\uFF09"
                },
                "getter": false,
                "setter": false,
                "attribute": "name",
                "reflect": false,
                "defaultValue": "''"
            },
            "size": {
                "type": "any",
                "mutable": false,
                "complexType": {
                    "original": "number | string",
                    "resolved": "number | string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "\u5C3A\u5BF8\uFF08number \u89C6\u4E3A px\uFF0Cstring \u76F4\u63A5\u4F5C\u4E3A width/height\uFF09"
                },
                "getter": false,
                "setter": false,
                "attribute": "size",
                "reflect": false,
                "defaultValue": "'1em'"
            },
            "color": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "\u989C\u8272\uFF08\u9ED8\u8BA4\u7EE7\u627F currentColor\uFF09"
                },
                "getter": false,
                "setter": false,
                "attribute": "color",
                "reflect": false,
                "defaultValue": "'inherit'"
            },
            "spin": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "\u662F\u5426\u65CB\u8F6C\u52A8\u753B"
                },
                "getter": false,
                "setter": false,
                "attribute": "spin",
                "reflect": false,
                "defaultValue": "false"
            }
        };
    }
}
//# sourceMappingURL=Icon.js.map
