import { Component, Prop, h } from "@stencil/core";
export class Avatar {
  render() {
    return (h("div", { class: "avatar-image", style: {
        backgroundImage: !this.src && this.initials
          ? null
          : `url('${this.src ? this.src : "/assets/images/default-icon.png"}')`,
        height: this.size ? this.size : "50px",
        lineHeight: this.size ? this.size : "50px",
        fontSize: this.size ? `calc(${this.size} / 2 )` : "25px",
        width: this.size ? this.size : "50px"
      } }, !this.src ? this.initials : null));
  }
  static get is() { return "floodteam-avatar"; }
  static get originalStyleUrls() { return {
    "$": ["avatar.css"]
  }; }
  static get styleUrls() { return {
    "$": ["avatar.css"]
  }; }
  static get properties() { return {
    "src": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "src",
      "reflect": false
    },
    "size": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "size",
      "reflect": false
    },
    "initials": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "initials",
      "reflect": false
    }
  }; }
}
