import { h } from "@stencil/core";
export class EclText {
    constructor() {
        this.styleClass = '';
        this.highlighted = false;
        this.enhance = false;
        this.enhanceType = 'enhance';
        this.colorMode = '';
        this.colorModeTypography = '';
    }
    getClass() {
        let styleClasses = [this.styleClass];
        let effectiveSize = this.size; // make a copy so we don't mutate the prop
        if (this.colorMode) {
            styleClasses.push(`ecl-color-mode--${this.colorMode}`);
        }
        if (this.colorModeTypography) {
            styleClasses.push(`ecl-u-type-color-${this.colorModeTypography}`);
            this.color = undefined;
        }
        if (this.type) {
            if (this.type === 'paragraph') {
                styleClasses.push(`ecl-u-type-paragraph-${effectiveSize}`);
            }
            else if (this.type === 'heading' && this.level) {
                styleClasses.push(`ecl-u-type-${this.type}-${this.level}`);
            }
            else if (this.type === 'microcopy') {
                styleClasses.push(`ecl-u-type-microcopy-${effectiveSize}`);
            }
            else {
                styleClasses.push(`ecl-u-type-${this.type}`);
            }
            effectiveSize = undefined;
        }
        if (effectiveSize) {
            styleClasses.push(`ecl-u-type-${effectiveSize}`);
        }
        if (this.weight) {
            styleClasses.push(`ecl-u-type-weight-${this.weight}`);
        }
        if (this.alignment) {
            styleClasses.push(`ecl-u-type-align-${this.alignment}`);
        }
        if (this.fontStyle) {
            styleClasses.push(`ecl-u-type-${this.fontStyle}`);
        }
        if (this.color) {
            styleClasses.push(`ecl-u-type-color-${this.color}`);
        }
        if (this.highlighted) {
            styleClasses.push(`ecl-u-type-highlight`);
        }
        if (this.enhance) {
            if (this.enhanceType === 'enhance') {
                styleClasses.push(`ecl-u-type-enhance`);
            }
            else {
                styleClasses.push(`ecl-u-type-enhance-${this.enhanceType}`);
            }
        }
        return styleClasses.join(' ');
    }
    componentWillLoad() {
        var _a;
        this.theme = (_a = document.documentElement.getAttribute('data-ecl-theme')) !== null && _a !== void 0 ? _a : (this.theme || 'ec');
        this.size = this.size || 'm';
    }
    render() {
        const Tag = this.tag || 'div';
        return (h(Tag, { key: 'e46f687263a2bd9c7ebc272201dbe26174ac696d', class: this.getClass(), id: this.itemId ? this.itemId : null }, h("slot", { key: 'dfb1e3d4f01527cf22aa6a301d442641ed10d76a' })));
    }
    static get is() { return "ecl-text"; }
    static get encapsulation() { return "scoped"; }
    static get originalStyleUrls() {
        return {
            "ec": ["./build/styles/ecl-text-ec.css"],
            "eu": ["./build/styles/ecl-text-eu.css"]
        };
    }
    static get styleUrls() {
        return {
            "ec": ["build/styles/ecl-text-ec.css"],
            "eu": ["build/styles/ecl-text-eu.css"]
        };
    }
    static get properties() {
        return {
            "styleClass": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "style-class",
                "defaultValue": "''"
            },
            "tag": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'div' | 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span' | undefined",
                    "resolved": "\"div\" | \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"p\" | \"span\"",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "tag"
            },
            "fontStyle": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'italic' | 'lowercase' | 'uppercase' | 'capitalize' | 'overline' | 'underline' | 'strike' | undefined",
                    "resolved": "\"capitalize\" | \"italic\" | \"lowercase\" | \"overline\" | \"strike\" | \"underline\" | \"uppercase\"",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "font-style"
            },
            "theme": {
                "type": "string",
                "mutable": true,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "theme"
            },
            "alignment": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'left' | 'right' | 'center' | undefined",
                    "resolved": "\"center\" | \"left\" | \"right\"",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "alignment"
            },
            "color": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'primary' | 'secondary' | 'white' |' success' | 'error' | undefined",
                    "resolved": "\" success\" | \"error\" | \"primary\" | \"secondary\" | \"white\"",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "color"
            },
            "level": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "1 | 2 | 3 | 4 | 5 | 6 | undefined",
                    "resolved": "1 | 2 | 3 | 4 | 5 | 6",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "level"
            },
            "weight": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'thin' | 'extra-light' | 'light' | 'regular' | 'medium' | 'semi-bold' | 'bold' | 'extra-bold' | 'black' | undefined",
                    "resolved": "\"black\" | \"bold\" | \"extra-bold\" | \"extra-light\" | \"light\" | \"medium\" | \"regular\" | \"semi-bold\" | \"thin\"",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "weight"
            },
            "type": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'display' | 'heading' | 'paragraph' | 'microcopy' | undefined",
                    "resolved": "\"display\" | \"heading\" | \"microcopy\" | \"paragraph\"",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "type"
            },
            "size": {
                "type": "string",
                "mutable": true,
                "complexType": {
                    "original": "'10xl' | '9xl' | '8xl' |'7xl' | '6xl' | '5xl' | '4xl' | '3xl' | '2xl' | 'xl' | 'l' | 'm' | 's' | 'xs' | undefined",
                    "resolved": "\"10xl\" | \"2xl\" | \"3xl\" | \"4xl\" | \"5xl\" | \"6xl\" | \"7xl\" | \"8xl\" | \"9xl\" | \"l\" | \"m\" | \"s\" | \"xl\" | \"xs\"",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "size"
            },
            "highlighted": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "highlighted",
                "defaultValue": "false"
            },
            "enhance": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "enhance",
                "defaultValue": "false"
            },
            "enhanceType": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'enhance' | 'strong' | 'light'",
                    "resolved": "\"enhance\" | \"light\" | \"strong\"",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "enhance-type",
                "defaultValue": "'enhance'"
            },
            "colorMode": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "color-mode",
                "defaultValue": "''"
            },
            "colorModeTypography": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "color-mode-typography",
                "defaultValue": "''"
            },
            "itemId": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "item-id"
            }
        };
    }
    static get elementRef() { return "el"; }
}
