import { n as c, C as m } from "../chunks/lib-cortex-element.CVMmyPMC.js";
import { c as p } from "../chunks/component.styles.CRO4Odto.js";
import { c as u } from "../chunks/custom-element.L4WJXn1j.js";
import { L as v } from "../chunks/i18n.BABe9hN4.js";
import { i as d, x as g } from "../chunks/lit-element.jLBm65_O.js";
import { e as x } from "../chunks/class-map.BiVq-cVR.js";
import { C as h } from "../chunks/icon-button.C2s3pHG4.js";
import b from "./line-clamp.js";
const f = d`:host{display:inline-block}.tag{white-space:nowrap;-webkit-user-select:none;user-select:none;border:1px solid;align-items:center;line-height:1;display:flex}.tag__remove::part(base){color:inherit;padding:0}.tag--primary{background-color:var(--cx-color-primary-50);border-color:var(--cx-color-primary-300);color:var(--cx-color-primary-800)}.tag--primary:active>cx-icon-button{color:var(--cx-color-primary)}.tag--success{background-color:var(--cx-color-success-50);border-color:var(--cx-color-success-200);color:var(--cx-color-success-800)}.tag--success:active>cx-icon-button{color:var(--cx-color-success)}.tag--neutral{background-color:var(--cx-color-neutral-50);border-color:var(--cx-color-neutral-200);color:var(--cx-color-neutral-800)}.tag--neutral:active>cx-icon-button{color:var(--cx-color-neutral-600)}.tag--warning{background-color:var(--cx-color-warning-50);border-color:var(--cx-color-warning-200);color:var(--cx-color-warning-800)}.tag--warning:active>cx-icon-button{color:var(--cx-color-warning)}.tag--danger{background-color:var(--cx-color-danger-50);border-color:var(--cx-color-danger-200);color:var(--cx-color-danger-800)}.tag--danger:active>cx-icon-button{color:var(--cx-color-danger)}.tag--small{font-size:var(--cx-button-font-size-small);height:calc(var(--cx-input-height-small) * .8);line-height:calc(var(--cx-input-height-small) - var(--cx-input-border-width) * 2);border-radius:var(--cx-input-border-radius-small);padding:0 var(--cx-spacing-x-small)}.tag--medium{font-size:var(--cx-button-font-size-medium);height:calc(var(--cx-input-height-medium) * .8);line-height:calc(var(--cx-input-height-medium) - var(--cx-input-border-width) * 2);border-radius:var(--cx-input-border-radius-medium);padding:0 var(--cx-spacing-small)}.tag--large{font-size:var(--cx-button-font-size-large);height:calc(var(--cx-input-height-large) * .8);line-height:calc(var(--cx-input-height-large) - var(--cx-input-border-width) * 2);border-radius:var(--cx-input-border-radius-large);padding:0 var(--cx-spacing-medium)}.tag--small .tag__remove::part(icon){--font-size:var(--cx-font-size-small)}.tag--medium .tag__remove::part(icon){--font-size:var(--cx-font-size-medium)}.tag--large .tag__remove::part(icon){--font-size:var(--cx-font-size-large)}.tag--pill{border-radius:var(--cx-border-radius-pill)}.tag--removable{padding-inline-end:0}`;
var z = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, e = (s, t, i, o) => {
  for (var a = o > 1 ? void 0 : o ? _(t, i) : t, l = s.length - 1, n; l >= 0; l--)
    (n = s[l]) && (a = (o ? n(t, i, a) : n(a)) || a);
  return o && a && z(t, i, a), a;
};
let r = class extends m {
  constructor() {
    super(...arguments), this.localize = new v(this), this.variant = "neutral", this.size = "medium", this.pill = !1, this.removable = !1;
  }
  handleRemoveClick() {
    this.emit("cx-remove");
  }
  render() {
    return g`<span part="base" class=${x({
      tag: !0,
      "tag--danger": this.variant === "danger",
      "tag--large": this.size === "large",
      "tag--medium": this.size === "medium",
      "tag--neutral": this.variant === "neutral",
      // Modifiers
      "tag--pill": this.pill,
      "tag--primary": this.variant === "primary",
      "tag--removable": this.removable,
      // Sizes
      "tag--small": this.size === "small",
      "tag--success": this.variant === "success",
      "tag--text": this.variant === "text",
      "tag--warning": this.variant === "warning"
    })}><cx-line-clamp class="tag__content" lines="1"><slot part="content"></slot></cx-line-clamp>${this.removable ? g`<cx-icon-button part="remove-button" exportparts="base:remove-button__base" name="close" label=${this.localize.term("remove")} class="tag__remove" @click=${this.handleRemoveClick} tabindex="-1"></cx-icon-button>` : ""}</span>`;
  }
};
r.styles = [p, f];
r.dependencies = {
  "cx-icon-button": h,
  "cx-line-clamp": b
};
e([
  c({ reflect: !0 })
], r.prototype, "variant", 2);
e([
  c({ reflect: !0 })
], r.prototype, "size", 2);
e([
  c({ reflect: !0, type: Boolean })
], r.prototype, "pill", 2);
e([
  c({ type: Boolean })
], r.prototype, "removable", 2);
r = e([
  u("cx-tag")
], r);
export {
  r as default
};
