import { r as registerInstance, B as Build, h } from './index-31949dc5.js';

const avatarCss = "fireenjin-avatar{position:relative}fireenjin-avatar .avatar-image{display:block;border-radius:4px;border:1px solid var(--ion-color-light-shade);background-color:var(--ion-color-light);background-size:cover;background-position:center;font-weight:bolder;text-align:center;color:var(--ion-color-medium);text-decoration:none;margin:auto !important}";

const Avatar = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.color = undefined;
    this.src = undefined;
    this.size = undefined;
    this.initials = undefined;
    this.fallback = undefined;
  }
  getCssVarColor(color) {
    if (!(Build === null || Build === void 0 ? void 0 : Build.isBrowser))
      return color;
    return getComputedStyle(document.documentElement)
      .getPropertyValue(`--ion-color-${color}`)
      .replace(" ", "");
  }
  render() {
    var _a, _b, _c;
    return (h("div", { class: "avatar-image", style: {
        background: this.color,
        backgroundImage: !((_a = this.src) === null || _a === void 0 ? void 0 : _a.length) && this.initials
          ? `url('https://avatars.dicebear.com/api/initials/${this.initials}.svg${this.color &&
            (this.color.includes("#") ||
              this.color.includes("rgb(") ||
              this.color.includes("rgba(") ||
              this.color.includes("hsl(") ||
              this.color.includes("hsla("))
            ? `?b=${this.color.replace("#", "%23")}`
            : this.color
              ? `?b=${this.getCssVarColor(this.color).replace("#", "%23")}`
              : ""}')`
          : `url('${((_b = this.src) === null || _b === void 0 ? void 0 : _b.length)
            ? this.src
            : ((_c = this.fallback) === null || _c === void 0 ? void 0 : _c.length)
              ? this.fallback
              : "/assets/images/default-icon.png"}')`,
        height: this.size ? this.size : "50px",
        width: this.size ? this.size : "50px",
      } }));
  }
};
Avatar.style = avatarCss;

export { Avatar as fireenjin_avatar };
