import { P as b, x as m, n as a } from "./plus-base-1920dd44.mjs";
import { e as u } from "./custom-element-eaccb8d2.mjs";
import { o as f } from "./style-map-628a6643.mjs";
import { s as g } from "./index-975d3293.mjs";
import "./directive-daf4e9b6.mjs";
const y = g({
  slots: {
    base: ["absolute font-sans inline-flex items-center justify-center text-center whitespace-nowrap z-auto border border-transparent empty:box-content"]
  },
  variants: {
    size: {
      sm: {
        base: "text-xs empty:min-w-1.5 min-w-5.5 empty:min-h-1.5 min-h-5.5 empty:px-0 px-1"
      },
      md: {
        base: "text-sm empty:min-w-2 min-w-6 empty:min-h-2 min-h-6 empty:px-0 px-1.5"
      },
      lg: {
        base: "text-base empty:min-w-2.5 min-w-7 empty:min-h-2.5 min-h-7 empty:px-0 px-1.5"
      }
    },
    kind: {
      dot: {
        base: "rounded-full"
      },
      text: {
        base: "rounded-full"
      }
    },
    status: {
      success: {
        base: "bg-color-success text-color-base"
      },
      warning: {
        base: "bg-color-warning text-color-base"
      },
      error: {
        base: "bg-color-error text-color-base"
      },
      info: {
        base: "bg-color-info text-color-base"
      },
      default: {
        base: "bg-color-default text-color-default"
      }
    },
    invert: {
      true: {
        base: ""
      }
    },
    placement: {
      "top-left": {
        base: "top-0 left-0 scale-100 transform -translate-x-1/2 -translate-y-1/2 "
      },
      "top-right": {
        base: "top-0 right-0 scale-100 transform translate-x-1/2 -translate-y-1/2"
      },
      "bottom-left": {
        // base: "top-auto -bottom-2 -left-2 empty:-bottom-1 empty:-left-1",
        base: "bottom-0 left-0 scale-100 transform -translate-x-1/2 translate-y-1/2"
      },
      "bottom-right": {
        // base: "top-auto -right-2 -bottom-2 empty:-bottom-1 empty:-right-1",
        base: "bottom-0 right-0 scale-100 transform translate-x-1/2 translate-y-1/2"
      }
    },
    isSingleChar: {
      true: {
        base: "px-0"
      }
    }
  },
  compoundVariants: [
    {
      status: ["success", "warning", "error", "info"],
      invert: !0,
      class: {
        base: ["text-color-default"]
      }
    },
    {
      status: "success",
      invert: !0,
      class: {
        base: ["bg-color-invert-success"]
      }
    },
    {
      status: "warning",
      invert: !0,
      class: {
        base: ["bg-color-invert-warning"]
      }
    },
    {
      status: "error",
      invert: !0,
      class: {
        base: ["bg-color-invert-error"]
      }
    },
    {
      status: "info",
      invert: !0,
      class: {
        base: ["bg-color-invert-info"]
      }
    },
    {
      status: "default",
      invert: !0,
      class: {
        base: ["bg-color-invert-default text-color-base"]
      }
    }
  ],
  defaultVariants: {
    size: "md",
    status: "default",
    kind: "text",
    placement: "top-right",
    invert: !1,
    isSingleChar: !1
  }
});
var d = Object.defineProperty, x = Object.getOwnPropertyDescriptor, s = (e, t, p, l) => {
  for (var o = l > 1 ? void 0 : l ? x(t, p) : t, n = e.length - 1, i; n >= 0; n--)
    (i = e[n]) && (o = (l ? i(t, p, o) : i(o)) || o);
  return l && o && d(t, p, o), o;
};
let r = class extends b {
  constructor() {
    super(...arguments), this.size = "md", this.kind = "text", this.invert = !1, this.placement = "top-right", this.status = "default";
  }
  render() {
    const { size: e, invert: t, kind: p, status: l, placement: o, content: n, offset: i } = this, { base: c } = y({ size: e, kind: p, status: l, invert: t, placement: o, isSingleChar: (n == null ? void 0 : n.length) === 1 });
    return m`
      <div class="relative box-border inline-block" role="status" aria-live="polite">
        <slot></slot>
        <div
          class=${c()}
          style=${f({
      ...i && { transform: `translate(${i[0]}, ${i[1]})` }
    })}
        >${n}</div>
      </div>
    `;
  }
};
s([
  a({ type: String })
], r.prototype, "size", 2);
s([
  a({ type: String })
], r.prototype, "kind", 2);
s([
  a({ type: Boolean, converter: (e) => e != "false" })
], r.prototype, "invert", 2);
s([
  a({ type: String })
], r.prototype, "placement", 2);
s([
  a({ type: String })
], r.prototype, "content", 2);
s([
  a({ type: String })
], r.prototype, "status", 2);
s([
  a({ type: String })
], r.prototype, "backgroundColor", 2);
s([
  a({
    type: Array,
    converter: (e) => {
      const t = e ? e.split(",") : [];
      return (t == null ? void 0 : t.length) > 1 ? [t[0], t[1]] : [e, e];
    }
  })
], r.prototype, "offset", 2);
s([
  a({ type: String })
], r.prototype, "color", 2);
r = s([
  u("plus-badge")
], r);
export {
  r as BadgeComponent
};
