'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-ce58ddc5.js');

const dvnBadgeCss = "dvn-badge{display:block;position:relative}dvn-badge.neutral{--badge-color:var(--color-neutral)}dvn-badge.primary{--badge-color:var(--color-primary)}dvn-badge.secondary{--badge-color:var(--color-secondary)}dvn-badge.warning{--badge-color:var(--color-warning)}dvn-badge.danger{--badge-color:var(--color-danger)}dvn-badge.small{--badge-size:8px}dvn-badge.medium{--badge-size:12px}dvn-badge.large{--badge-size:16px}dvn-badge:after{color:var(--color-background-primary);content:attr(badge-content);background:var(--badge-color);border-radius:50%;font-size:var(--font-size-small);height:var(--badge-size);position:absolute;text-align:center;width:var(--badge-size);line-height:var(--badge-size);top:0;right:0;-webkit-transform:scale(1) translate(50%, -50%);transform:scale(1) translate(50%, -50%);-webkit-transform-origin:100% 0%;transform-origin:100% 0%}";

let DvnBadge = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.content = '';
    this.tint = 'neutral';
    this.scale = 'medium';
  }
  render() {
    return (index.h(index.Host, { class: {
        [this.scale]: true,
        [this.tint]: true,
      }, style: {
        paddingRight: this.horizontalSpacing || undefined,
      }, "badge-content": this.content }, index.h("slot", null)));
  }
};
DvnBadge.style = dvnBadgeCss;

exports.dvn_badge = DvnBadge;
