"copy-small",
  tenant: "os",
  omitLineHeight: !0
})};
  }
  .os.large .value {
    ${d({
  size: "copy-medium",
  tenant: "os",
  omitLineHeight: !0
})};
  }
  .os.extra-large .value {
    ${d({
  size: "copy-medium",
  tenant: "os",
  omitLineHeight: !0
})};
  }
`, Vw = s`
  .lx.indicator.default {
    color: var(--maui-color-brand-light);
    background-color: var(--maui-color-brand-primary);
  }

  .lx.indicator {
    outline: 2px solid var(--maui-color-brand-light);
  }

  .lx.indicator.small {
    outline-width: 1px;
  }

  .lx.locked {
    background-color: var(--maui-color-grey-04);
  }

  .lx.locked.medium maui-icon {
    top: 2px;
  }

  .lx.locked.large maui-icon {
    top: 3px;
  }

  .lx.locked.extra-large maui-icon {
    top: 5px;
  }

  .lx.medium .value {
    ${d({ size: "copy-small", tenant: "lx", omitLineHeight: !0 })};
  }
  .lx.large .value {
    ${d({ size: "copy-medium", tenant: "lx", omitLineHeight: !0 })};
  }
  .lx.extra-large .value {
    ${d({ size: "copy-medium", tenant: "lx", omitLineHeight: !0 })};
  }
`, jw = s`
  .sn.indicator.default {
    color: var(--maui-color-brand-light);
    background-color: var(--maui-color-brand-primary);
  }

  .sn.medium {
    --_padding: 5px;
  }

  .sn.locked.medium maui-icon {
    top: 2px;
  }

  .sn.locked.large maui-icon {
    top: 3px;
  }

  .sn.locked.extra-large maui-icon {
    top: 5px;
  }

  .sn.medium .value {
    ${d({ size: "copy-small", tenant: "sn", omitLineHeight: !0 })};
  }
  .sn.large .value {
    ${d({ size: "copy-medium", tenant: "sn", omitLineHeight: !0 })};
  }
  .sn.extra-large .value {
    ${d({ size: "copy-medium", tenant: "sn", omitLineHeight: !0 })};
  }
`, qw = s`
  .four_y.indicator.default {
    color: var(--maui-color-brand-light);
    background-color: var(--maui-color-message-info);
  }
  .four_y.medium {
    --_padding: 5px;
  }
  .four_y.large {
    --_padding: 6px;
  }

  .four_y.locked.medium maui-icon {
    top: 2px;
  }

  .four_y.locked.large maui-icon {
    top: 3px;
  }

  .four_y.locked.extra-large maui-icon {
    top: 5px;
  }

  .four_y.medium .value {
    ${d({
  size: "copy-small",
  tenant: "four_y",
  omitLineHeight: !0
})};
  }
  .four_y.large .value {
    ${d({
  size: "copy-medium",
  tenant: "four_y",
  omitLineHeight: !0
})};
  }
  .four_y.extra-large .value {
    ${d({
  size: "copy-large",
  tenant: "four_y",
  omitLineHeight: !0
})};
  }
`, Kw = s`
  .b2b.indicator.default {
    color: var(--maui-color-brand-light);
  }

  .b2b.locked.medium maui-icon {
    top: 2px;
  }

  .b2b.locked.large maui-icon {
    top: 3px;
  }

  .b2b.locked.extra-large maui-icon {
    top: 5px;
  }

  .b2b.medium .value {
    ${d({ size: "copy-small", tenant: "b2b", omitLineHeight: !0 })};
  }
  .b2b.large .value {
    ${d({ size: "copy-medium", tenant: "b2b", omitLineHeight: !0 })};
  }
  .b2b.extra-large .value {
    ${d({ size: "copy-large", tenant: "b2b", omitLineHeight: !0 })};
  }
`, Ww = s`
  .mmg.indicator.default {
    background-color: var(--maui-color-brand-mmg-bright-blue);
    color: var(--maui-color-brand-light);
  }
  .mmg.medium .value {
    ${d({ size: "copy-small", tenant: "mmg", omitLineHeight: !0 })};
  }
  .mmg.large .value {
    ${d({ size: "copy-medium", tenant: "mmg", omitLineHeight: !0 })};
  }
  .mmg.extra-large .value {
    ${d({ size: "copy-large", tenant: "mmg", omitLineHeight: !0 })};
  }

  .mmg.locked.medium maui-icon {
    top: 2px;
  }

  .mmg.locked.large maui-icon {
    top: 3px;
  }

  .mmg.locked.extra-large maui-icon {
    top: 5px;
  }

  .mmg.border {
    outline: none;
  }
`, Zw = [
  Yw,
  Tw,
  Xw,
  Vw,
  jw,
  qw,
  Kw,
  Ww
];
var Qw = Object.defineProperty, Jw = Object.getOwnPropertyDescriptor, Gi = (a, e, t, o) => {
  for (var i = o > 1 ? void 0 : o ? Jw(e, t) : e, r = a.length - 1, n; r >= 0; r--)
    (n = a[r]) && (i = (o ? n(e, t, i) : n(i)) || i);
  return o && i && Qw(e, t, i), i;
};
class Oo extends k {
  constructor() {
    super(), this.max = 99, this.type = "default", this.size = "medium", this.border = !1, this.componentName = "indicator";
  }
  updated(e) {
    super.update(e), this.emit("maui-indicator-change");
  }
  connectedCallback() {
    super.connectedCallback(), this.emit("maui-indicator-change");
  }
  render() {
    const e = this.type !== "default", t = () => {
      switch (this.type) {
        case "success":
          return "icon-checkmark";
        case "error":
          return "icon-error";
        case "locked":
          return "icon-lock";
        default:
          return "icon-info";
      }
    };
    return u`<div
      class=${y({
      [this.componentName]: !0,
      [this.theme]: !0,
      [this.type]: !0,
      [this.size]: !0,
      border: !!this.border,
      "has-icon": e,
      "no-content": this.type === "default" && !this.value
    })}
    >
      ${this.ariaLabel ? u`<span class="sr-only">${this.ariaLabel}</span>` : E}
      ${this.type !== "default" && !["small"].includes(this.size) ? u`<maui-icon
            .theme=${this.theme}
            use=${t()}
            size="small"
          ></maui-icon>` : E}
      ${this.type === "default" && this.value && !["small"].includes(this.size) ? u`<span class="value"
            ><span aria-hidden="true"
              >${this.value <= this.max ? this.value : `${this.max}+`}</span
            ></span
          >` : E}
    </div>`;
  }
}
Oo.styles = Zw;
Gi([
  l({ reflect: !0, type: Number })
], Oo.prototype, "max", 2);
Gi([
  l({ reflect: !0, type: Number })
], Oo.prototype, "value", 2);
Gi([
  l({ reflect: !0, type: String })
], Oo.prototype, "type", 2);
Gi([
  l({ reflect: !0, type: String })
], Oo.prototype, "size", 2);
Gi([
  l({ reflect: !0, type: Boolean })
], Oo.prototype, "border", 2);
w("maui-indicator", Oo);
Ә