import { n as r, C as p } from "../chunks/lib-cortex-element.CVMmyPMC.js";
import { c as b } from "../chunks/component.styles.CRO4Odto.js";
import { c as f } from "../chunks/custom-element.L4WJXn1j.js";
import { H as v } from "../chunks/slot.j5oheLJC.js";
import { w as h } from "../chunks/watch.BCJD77bD.js";
import { i as g, b as m, x } from "../chunks/lit-element.jLBm65_O.js";
import { r as u } from "../chunks/state.CSDxrqLd.js";
import { e as n } from "../chunks/class-map.BiVq-cVR.js";
import k from "./icon.js";
const _ = g`:host{display:block}:host(:focus-visible){outline:0}.radio{align-items:top;font-family:var(--cx-input-font-family);font-size:var(--cx-input-font-size-medium);font-weight:var(--cx-input-font-weight);color:var(--cx-input-label-color);vertical-align:middle;cursor:pointer;display:inline-flex}.radio--small{--toggle-size:var(--cx-toggle-size-small);font-size:var(--cx-input-font-size-small)}.radio--medium{--toggle-size:var(--cx-toggle-size-medium);font-size:var(--cx-input-font-size-small)}.radio--large{--toggle-size:var(--cx-toggle-size-large);font-size:var(--cx-input-font-size-small)}.radio__checked-icon{display:inline-flex}.radio__control{width:var(--toggle-size);height:var(--toggle-size);border:solid var(--cx-input-border-width) var(--cx-input-border-color);background-color:var(--cx-input-background-color);color:#0000;transition:var(--cx-transition-fast) border-color, var(--cx-transition-fast) background-color, var(--cx-transition-fast) color, var(--cx-transition-fast) box-shadow;border-radius:50%;flex:none;justify-content:center;align-items:center;display:inline-flex;position:relative}.radio__input{opacity:0;pointer-events:none;margin:0;padding:0;position:absolute}.radio:not(.radio--checked):not(.radio--disabled) .radio__control:hover{border-color:var(--cx-input-border-color-hover);background-color:var(--cx-input-background-color-hover)}.radio--checked .radio__control{color:var(--checked-color,var(--cx-color-primary));border-color:var(--checked-border-color,var(--cx-color-primary));background-color:var(--checked-background-color,var(--cx-color-neutral-0))}.radio.radio--checked:not(.radio--disabled) .radio__control:hover{border-color:var(--checked-hover-border-color,var(--cx-color-primary));background-color:var(--checked-hover-background-color,var(--cx-color-neutral-0))}:host(:focus-visible) .radio__control{outline:var(--cx-focus-ring);outline-offset:var(--cx-focus-ring-offset)}.radio__control.radio__control--hidden{display:none}.radio--disabled{opacity:.5;cursor:default}.radio:not(.radio--checked) svg circle{opacity:0}.radio__label{color:var(--cx-input-label-color);line-height:var(--toggle-size);-webkit-user-select:none;user-select:none;text-transform:var(--cx-radio-label-text-transform,none);flex:1;margin-inline-start:.5em;display:inline-block}.radio__label--hidden{display:none}svg{width:100%;height:100%;display:block}`, y = (i) => m`<svg part="checked-icon svg" class="radio__icon" viewBox="0 0 16 16"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g fill="currentColor"><circle cx="8" cy="8" r="${i}"></circle></g></g></svg>`;
var z = Object.defineProperty, C = Object.getOwnPropertyDescriptor, o = (i, a, l, s) => {
  for (var t = s > 1 ? void 0 : s ? C(a, l) : a, c = i.length - 1, d; c >= 0; c--)
    (d = i[c]) && (t = (s ? d(a, l, t) : d(t)) || t);
  return s && t && z(a, l, t), t;
};
let e = class extends p {
  constructor() {
    super(), this.hasSlotController = new v(this, "[default]"), this.checked = !1, this.hasFocus = !1, this.size = "medium", this.disabled = !1, this.hideIndicator = !1, this.checkedIconRadius = 4.5, this.handleBlur = this.handleBlur.bind(this), this.handleClick = this.handleClick.bind(this), this.handleFocus = this.handleFocus.bind(this), this.addEventListener("blur", this.handleBlur), this.addEventListener("click", this.handleClick), this.addEventListener("focus", this.handleFocus);
  }
  connectedCallback() {
    super.connectedCallback(), this.setInitialAttributes();
  }
  handleBlur() {
    this.hasFocus = !1, this.emit("cx-blur");
  }
  handleClick() {
    this.disabled || (this.checked = !0);
  }
  handleFocus() {
    this.hasFocus = !0, this.emit("cx-focus");
  }
  setInitialAttributes() {
    this.setAttribute("role", "radio"), this.setAttribute("tabindex", "-1"), this.setAttribute("aria-disabled", this.disabled ? "true" : "false");
  }
  handleCheckedChange() {
    this.setAttribute("aria-checked", this.checked ? "true" : "false"), this.setAttribute("tabindex", this.checked ? "0" : "-1");
  }
  handleDisabledChange() {
    this.setAttribute("aria-disabled", this.disabled ? "true" : "false");
  }
  render() {
    return x`<span part="base" class=${n({
      radio: !0,
      "radio--checked": this.checked,
      "radio--disabled": this.disabled,
      "radio--focused": this.hasFocus,
      "radio--large": this.size === "large",
      "radio--medium": this.size === "medium",
      "radio--small": this.size === "small"
    })}><span part=${`control${this.checked ? " control--checked" : ""}`} class=${n({
      radio__control: !0,
      "radio__control--hidden": this.hideIndicator
    })}>${this.checked ? y(this.checkedIconRadius) : ""}</span><slot part="label" class=${n({
      radio__label: !0,
      "radio__label--hidden": !this.hasSlotController.test("[default]")
    })}></slot></span>`;
  }
};
e.styles = [b, _];
e.dependencies = { "cx-icon": k };
o([
  u()
], e.prototype, "checked", 2);
o([
  u()
], e.prototype, "hasFocus", 2);
o([
  r()
], e.prototype, "value", 2);
o([
  r({ reflect: !0 })
], e.prototype, "size", 2);
o([
  r({ reflect: !0, type: Boolean })
], e.prototype, "disabled", 2);
o([
  r({ attribute: "hide-indicator", reflect: !0, type: Boolean })
], e.prototype, "hideIndicator", 2);
o([
  r({ attribute: "checked-icon-radius", reflect: !0, type: Number })
], e.prototype, "checkedIconRadius", 2);
o([
  h("checked")
], e.prototype, "handleCheckedChange", 1);
o([
  h("disabled", { waitUntilFirstUpdate: !0 })
], e.prototype, "handleDisabledChange", 1);
e = o([
  f("cx-radio")
], e);
export {
  e as default
};
