import { e as h } from "./custom-element-eaccb8d2.mjs";
import { P as g, n as p } from "./plus-base-10eea8a6.mjs";
import { i as d } from "./query-59d2d374.mjs";
import { n as c } from "./static-5cfd1f40.mjs";
import { l as v, c as z } from "./label.style-1b60b221.mjs";
import { s as y } from "./index-975d3293.mjs";
const S = y({
  slots: {
    host: ["font-sans antialiased flex flex-col  items-start justify-start w-full relative gap-0.5"],
    inputWrapper: ["flex flex-row items-center justify-start gap-2 "]
  },
  variants: {
    size: {
      sm: "",
      md: "",
      lg: ""
    },
    orientation: {
      horizontal: {
        inputWrapper: ["flex-row"]
      },
      vertical: {
        inputWrapper: ["flex-col"]
      }
    }
  },
  compoundVariants: [
    {
      size: "sm",
      orientation: "horizontal",
      class: {
        inputWrapper: ["gap-4"]
      }
    },
    {
      size: "sm",
      orientation: "vertical",
      class: {
        inputWrapper: ["gap-2"]
      }
    },
    {
      size: "md",
      orientation: "horizontal",
      class: {
        inputWrapper: ["gap-5"]
      }
    },
    {
      size: "md",
      orientation: "vertical",
      class: {
        inputWrapper: ["gap-2.5"]
      }
    },
    {
      size: "lg",
      orientation: "horizontal",
      class: {
        inputWrapper: ["gap-6"]
      }
    },
    {
      size: "lg",
      orientation: "vertical",
      class: {
        inputWrapper: ["gap-3"]
      }
    }
  ],
  defaultVariants: {
    size: "md",
    orientation: "horizontal"
  }
});
var W = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, i = (r, a, e, o) => {
  for (var t = o > 1 ? void 0 : o ? $(a, e) : a, l = r.length - 1, n; l >= 0; l--)
    (n = r[l]) && (t = (o ? n(a, e, t) : n(t)) || t);
  return o && t && W(a, e, t), t;
};
let s = class extends g {
  constructor() {
    super(...arguments), this.orientation = "horizontal", this.size = "md", this.error = !1;
  }
  handleSlotChange() {
    var a;
    const r = [...(a = this.defaultSlot) == null ? void 0 : a.assignedElements({ flatten: !0 })].filter((e) => e.tagName.toLowerCase() === "plus-radio");
    r == null || r.forEach((e) => {
      e == null || e.addEventListener("plus-change", (o) => {
        r.forEach((t) => {
          t !== o.target ? (t.checked = !1, this.emit("plus-change", t)) : t.checked = !0;
        });
      });
    });
  }
  render() {
    const { orientation: r, label: a, caption: e, size: o, error: t, required: l } = this, { host: n, inputWrapper: u } = S({ orientation: r }), f = () => a ? c`<label class=${v({ size: o, required: l })} for="input">${a}</label>` : null, m = () => e ? c`<div class=${z({ error: t, size: o })}>${e}</div>` : null;
    return c`
      <div class=${n()}>
        ${f()}
        <div class=${u()}>
          <slot class="radio-group" @slotchange=${this.handleSlotChange}> </slot>
        </div>
        ${m()}
      </div>
    `;
  }
};
i([
  p({ type: String })
], s.prototype, "orientation", 2);
i([
  d("slot")
], s.prototype, "defaultSlot", 2);
i([
  p({ type: String })
], s.prototype, "size", 2);
i([
  p({ type: String })
], s.prototype, "label", 2);
i([
  p({ type: String })
], s.prototype, "caption", 2);
i([
  p({ type: Boolean, converter: (r) => r != "false" })
], s.prototype, "error", 2);
s = i([
  h("plus-radio-group")
], s);
export {
  s as RadioGroupComponent
};
