import { n as a, C as p } from "../chunks/lib-cortex-element.CVMmyPMC.js";
import { c as m } from "../chunks/component.styles.CRO4Odto.js";
import { c as h } from "../chunks/custom-element.L4WJXn1j.js";
import { i as f, x as v } from "../chunks/lit-element.jLBm65_O.js";
import { e as x } from "../chunks/class-map.BiVq-cVR.js";
var n = /* @__PURE__ */ ((e) => (e.Busy = "busy", e.Error = "error", e.Idle = "idle", e.Success = "success", e))(n || {}), d = /* @__PURE__ */ ((e) => (e.Large = "large", e.Medium = "medium", e.Small = "small", e))(d || {});
const y = f`:host{cursor:pointer;justify-content:center;align-items:center;display:inline-flex}:host([size=small]){--dot-size:var(--cx-font-size-small)}:host([size=medium]){--dot-size:var(--cx-font-size-medium)}:host([size=large]){--dot-size:var(--cx-font-size-large)}.dot-status{width:var(--dot-size,var(--cx-font-size-medium));height:var(--dot-size,var(--cx-font-size-medium));background-color:var(--dot-color,var(--cx-color-neutral-300));border-radius:50%;flex-shrink:0}:host([status=idle]){--dot-color:var(--cx-color-neutral-300)}:host([status=busy]){--dot-color:var(--cx-color-warning)}:host([status=success]){--dot-color:var(--cx-color-success)}:host([status=error]){--dot-color:var(--cx-color-danger)}.dot-status--pulse{--pulse-color:var(--dot-color,var(--cx-color-neutral-300));animation:1.5s infinite pulse}@keyframes pulse{0%{box-shadow:0 0 0 0 var(--pulse-color)}70%{box-shadow:0 0 0 .5rem #0000}to{box-shadow:0 0 #0000}}`;
var b = Object.defineProperty, z = Object.getOwnPropertyDescriptor, r = (e, o, i, l) => {
  for (var t = l > 1 ? void 0 : l ? z(o, i) : o, c = e.length - 1, u; c >= 0; c--)
    (u = e[c]) && (t = (l ? u(o, i, t) : u(t)) || t);
  return l && t && b(o, i, t), t;
};
let s = class extends p {
  constructor() {
    super(...arguments), this.status = n.Idle, this.size = d.Medium, this.pulse = !1, this.label = "";
  }
  handleClick() {
    this.emit("cx-dot-status-click", {
      detail: { status: this.status }
    });
  }
  render() {
    const e = this.label || this.status;
    return v`<span part="base" role="status" aria-label=${e} class=${x({
      "dot-status": !0,
      "dot-status--pulse": this.pulse
    })} @click=${this.handleClick}></span>`;
  }
};
s.styles = [m, y];
s.dependencies = {};
r([
  a({ reflect: !0, type: String })
], s.prototype, "status", 2);
r([
  a({ reflect: !0, type: String })
], s.prototype, "size", 2);
r([
  a({ reflect: !0, type: Boolean })
], s.prototype, "pulse", 2);
r([
  a({ reflect: !0 })
], s.prototype, "label", 2);
s = r([
  h("cx-dot-status")
], s);
export {
  s as default
};
