import { __decorate, __metadata } from "tslib";
import { Host, h } from "@stencil/core";
import { BEM } from "../../utils/bem";
import { ListenToConfig, defaultConfig, } from "../../utils/config";
import { i18nBalClose } from "./bal-close.i18n";
export class Close {
    constructor() {
        this.language = defaultConfig.language;
        this.region = defaultConfig.region;
        /**
         * Define the size of badge. Small is recommended for tabs.
         */
        this.size = '';
        /**
         * If `true` it supports dark backgrounds.
         */
        this.inverted = false;
    }
    /**
     * @internal define config for the component
     */
    async configChanged(state) {
        this.language = state.language;
        this.region = state.region;
    }
    render() {
        const blockEl = BEM.block('close');
        const buttonEl = blockEl.element('button');
        const iconEl = buttonEl.element('icon');
        const label = i18nBalClose[this.language].close;
        return (h(Host, { key: '087ee2337aa7bf8828fbcf32b3a8aa1ae74de0c7', class: Object.assign({}, blockEl.class()) }, h("button", { key: 'ff78161fb93ebc2e8c5855e3ca734f32a78db700', type: "button", "aria-label": label, title: label, tabindex: "0", class: Object.assign(Object.assign(Object.assign({}, buttonEl.class()), buttonEl.modifier('inverted').class(this.inverted)), buttonEl.modifier(`size-${this.size}`).class(this.size !== '')), "data-testid": "bal-close" }, h("bal-icon", { key: '6f69b61b7ddbd9c0d2c2c532e3115e3429d9acf3', name: "close", size: this.size === 'small' ? 'x-small' : this.size === 'medium' ? 'medium' : 'small', inverted: this.inverted, class: Object.assign({}, iconEl.class()) }))));
    }
    static get is() { return "bal-close"; }
    static get originalStyleUrls() {
        return {
            "$": ["bal-close.sass"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["bal-close.css"]
        };
    }
    static get properties() {
        return {
            "size": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "BalProps.BalCloseSize",
                    "resolved": "\"\" | \"medium\" | \"small\"",
                    "references": {
                        "BalProps": {
                            "location": "global",
                            "id": "global::BalProps"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Define the size of badge. Small is recommended for tabs."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "size",
                "defaultValue": "''"
            },
            "inverted": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true` it supports dark backgrounds."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "inverted",
                "defaultValue": "false"
            }
        };
    }
    static get states() {
        return {
            "language": {},
            "region": {}
        };
    }
    static get methods() {
        return {
            "configChanged": {
                "complexType": {
                    "signature": "(state: BalConfigState) => Promise<void>",
                    "parameters": [{
                            "name": "state",
                            "type": "BalConfigState",
                            "docs": ""
                        }],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        },
                        "BalConfigState": {
                            "location": "import",
                            "path": "../../utils/config",
                            "id": "src/utils/config/index.ts::BalConfigState"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "",
                    "tags": [{
                            "name": "internal",
                            "text": "define config for the component"
                        }]
                }
            }
        };
    }
    static get elementRef() { return "el"; }
}
__decorate([
    ListenToConfig(),
    __metadata("design:type", Function),
    __metadata("design:paramtypes", [Object]),
    __metadata("design:returntype", Promise)
], Close.prototype, "configChanged", null);
