import { r as i, h as t, H as a } from "./index.61732cef.js";
import { c as o } from "./index-orsBiyT_.fc4357c3.js";
import "react";
import "react-dom";
const r = () => ':host{display:block}:host *{box-sizing:border-box}.status-indicator{display:flex;align-items:center;gap:var(--s-space-4)}.status-indicator--intent-critical .status-indicator__dot:before{background-color:var(--s-icon-critical)}.status-indicator--intent-info .status-indicator__dot:before{background-color:var(--s-icon-info)}.status-indicator--intent-success .status-indicator__dot:before{background-color:var(--s-icon-success)}.status-indicator--intent-warning .status-indicator__dot:before{background-color:var(--s-icon-warning)}.status-indicator__dot{display:inline-flex;width:1.25rem;height:1.25rem;flex-shrink:0;justify-content:center;align-items:center}.status-indicator__dot:before{display:inline-flex;width:0.5rem;height:0.5rem;border-radius:50%;content:""}.status-indicator__label{overflow:hidden;min-width:0;font-size:var(--s-font-size-sm);white-space:nowrap;text-overflow:ellipsis}', n = class {
  constructor(s) {
    i(this, s);
  }
  render() {
    const s = o("status-indicator", `status-indicator--intent-${this.intent}`);
    return t(a, { key: "5727baff5bcb844acddb356a5ddc3e7d593cb12b" }, t("div", { key: "93eb2f1b95518b036b9742d5c3b05b2bac7ba6fc", class: s }, t("span", { key: "22d6994c994d74e6d22a6b0b9d45f7171712dc91", class: "status-indicator__dot" }), t("span", { key: "9b7fad24d5e1136bf1914334db91ccac3d17d302", class: "status-indicator__label" }, this.label)));
  }
};
n.style = r();
export {
  n as swirl_status_indicator
};
