import { Component, Element, Prop, h } from '@stencil/core';
import { setChildAttributes } from '@utils/DomUtils';
export class TagArea {
    onSlotchange() {
        setChildAttributes(this.el, 'aria-role', 'list-item');
    }
    render() {
        return (h("div", { class: "TagArea" },
            this.text && h("div", { class: "TagArea--text" }, this.text),
            h("slot", { onSlotchange: this.onSlotchange.bind(this) })));
    }
    static get is() { return "sr-tag-area"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() { return {
        "$": ["_TagArea-component.scss"]
    }; }
    static get styleUrls() { return {
        "$": ["_TagArea-component.css"]
    }; }
    static get properties() { return {
        "text": {
            "type": "string",
            "mutable": false,
            "complexType": {
                "original": "string",
                "resolved": "string",
                "references": {}
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": "Optional title text"
            },
            "attribute": "text",
            "reflect": false
        },
        "centered": {
            "type": "boolean",
            "mutable": false,
            "complexType": {
                "original": "boolean",
                "resolved": "boolean",
                "references": {}
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": "Whether content should be centered"
            },
            "attribute": "centered",
            "reflect": false
        }
    }; }
    static get elementRef() { return "el"; }
}
