import { r as d, i as c, s as g, x as h, e as v } from "./query-assigned-elements-D930kELM.mjs";
import { n as s } from "./property-DJzm_oB9.mjs";
import { o as m } from "./class-map-DPUylGZM.mjs";
const b = ".cv-badge{background-color:var(--cv-theme-negative);border-radius:11px;box-sizing:border-box;color:var(--cv-theme-on-negative);display:inline-block;font-family:var(--mdc-typography-caption-font-family);font-size:var(--mdc-typography-caption-font-size);font-weight:var(--mdc-typography-caption-font-weight);line-height:var(--mdc-typography-caption-line-height);height:16px;min-width:16px;padding:0 4px;position:absolute;text-align:center}.cv-badge.small{height:2px;padding:2px;min-width:2px}.cv-badge.top-right{top:var(--cv-badge-position-y, -2px);right:var(--cv-badge-position-x, -2px)}.cv-badge.top-left{top:var(--cv-badge-position-y, -2px);left:var(--cv-badge-position-x, -2px)}.cv-badge.bottom-right{bottom:var(--cv-badge-position-y, -2px);right:var(--cv-badge-position-x, -2px)}.cv-badge.bottom-left{bottom:var(--cv-badge-position-y, -2px);left:var(--cv-badge-position-x, -2px)}.cv-badge.isolated{position:relative;top:0;right:0;bottom:0;left:0}.cv-badge-container{position:relative;display:inline-flex}.wrapped-content{flex-grow:1}.hidden{display:none}";
var f = Object.defineProperty, x = Object.getOwnPropertyDescriptor, n = (t, o, r, a) => {
  for (var e = a > 1 ? void 0 : a ? x(o, r) : o, p = t.length - 1, l; p >= 0; p--)
    (l = t[p]) && (e = (a ? l(o, r, e) : l(e)) || e);
  return a && e && f(o, r, e), e;
};
let i = class extends g {
  constructor() {
    super(...arguments), this.max = 100, this.size = "large", this.hideBadge = !1, this.verticalAlignment = "top", this.horizontalAlignment = "right";
  }
  firstUpdated() {
    var o;
    const t = this.renderRoot.querySelector("slot");
    if (t && !t.assignedNodes({
      flatten: !0
    }).filter(
      (e) => e.nodeType === Node.ELEMENT_NODE
    ).length) {
      const e = this.renderRoot.querySelector("#badge-content");
      (o = e == null ? void 0 : e.classList) == null || o.add("isolated");
    }
  }
  getContent() {
    let t = this.content;
    const o = Number(t);
    return this.showZero && t == 0 ? t = t.toString() : !isNaN(o) && this.max && (t = o > this.max ? `${this.max}+` : o), t || "";
  }
  render() {
    const t = {
      "cv-badge": !0,
      small: this.size === "small",
      hidden: !!this.hideBadge || !this.showZero && this.content == 0
    };
    return t[`${this.verticalAlignment}-${this.horizontalAlignment}`] = !0, h`
      <div class="cv-badge-container">
        <slot class="wrapped-content"></slot>
        <span id="badge-content" class="${m(t)}">
          ${this.size !== "small" ? this.getContent() : ""}
        </span>
      </div>
    `;
  }
};
i.styles = [
  c`
      ${d(b)}
    `
];
n([
  s()
], i.prototype, "content", 2);
n([
  s()
], i.prototype, "max", 2);
n([
  s()
], i.prototype, "size", 2);
n([
  s({ type: Boolean, reflect: !0 })
], i.prototype, "hideBadge", 2);
n([
  s()
], i.prototype, "verticalAlignment", 2);
n([
  s()
], i.prototype, "horizontalAlignment", 2);
n([
  s({ type: Boolean, reflect: !0 })
], i.prototype, "showZero", 2);
i = n([
  v("cv-badge")
], i);
const z = i;
export {
  i as CovalentBadge,
  z as default
};
