import { Host, h } from '@stencil/core';
/**
 * @docsPage
 * @exSlot Notifications
 */
export class BsBadge {
  constructor() {
    this.color = undefined;
    this.count = undefined;
    this.countMax = 99;
    this.dot = undefined;
    this.label = 'item';
    this.position = undefined;
    this.showZero = undefined;
  }
  get countFmt() {
    if (this.count === 0)
      return "0";
    if (!this.count || this.dot)
      return null;
    return this.count > this.countMax ?
      this.countMax + "+" :
      this.count.toString();
  }
  get labelFmt() {
    const base = this.hostEl.textContent.trim();
    const ct = this.countFmt ? this.countFmt + ' ' : '';
    if (!ct && !this.dot)
      return base;
    const sfx = this.count !== 1 ? 's' : ''; //pluralize if dot only, 0, or more than 1
    return `${base}, ${ct}${this.label}${sfx}`;
  }
  render() {
    return (h(Host, { class: (this.dot || this.countFmt) && "bs-badge", "data-badge-color": this.color, "data-count": this.countFmt, "data-position": this.position, "data-show-zero": this.showZero, "aria-label": this.labelFmt }, h("slot", null)));
  }
  static get is() { return "bs-badge"; }
  static get originalStyleUrls() {
    return {
      "$": ["bs-badge.scss"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["bs-badge.css"]
    };
  }
  static get properties() {
    return {
      "color": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "'red' | 'blue' | 'white'",
          "resolved": "\"blue\" | \"red\" | \"white\"",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Pass value to set `data-badge-color`."
        },
        "attribute": "color",
        "reflect": false
      },
      "count": {
        "type": "number",
        "mutable": false,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Pass value to show \"count\" indicator.  Do not use if you are passing \"dot.\""
        },
        "attribute": "count",
        "reflect": false
      },
      "countMax": {
        "type": "number",
        "mutable": false,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Sets the count limit after which the displayed count will stop incrementing and a \"+\" will be appended. Defaults to 99."
        },
        "attribute": "count-max",
        "reflect": false,
        "defaultValue": "99"
      },
      "dot": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Pass \"true\" to show a simple dot indicator.  Do not use if you are passing a \"count.\""
        },
        "attribute": "dot",
        "reflect": false
      },
      "label": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Pass the singular name of the items that are being counted.  e.g.\nif we are counting unread notifications, pass \"unread notification\";\nor if we are counting new messages, pass \"new message\".\nThis is required to ensure accessibility!"
        },
        "attribute": "label",
        "reflect": false,
        "defaultValue": "'item'"
      },
      "position": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "'left' | 'right'",
          "resolved": "\"left\" | \"right\"",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Sets the position of the badge in relation to the slotted content. By default, badge is positioned to the right."
        },
        "attribute": "position",
        "reflect": false
      },
      "showZero": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Pass \"true\" to show the badge even when the \"count\" value is zero."
        },
        "attribute": "show-zero",
        "reflect": false
      }
    };
  }
  static get elementRef() { return "hostEl"; }
}
//# sourceMappingURL=bs-badge.js.map
