import { LitElement, html } from "lit";
import { property } from "lit/decorators.js";
import { ObcElevatedCardPosition, ObcElevatedCardSize, ObcElevatedCardTag } from "../elevated-card/elevated-card.js";
import "../radio/radio.js";
import { customElement } from "../../decorator.js";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __decorateClass = (decorators, target, key, kind) => {
  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
  for (var i = decorators.length - 1, decorator; i >= 0; i--)
    if (decorator = decorators[i])
      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
  if (kind && result) __defProp(target, key, result);
  return result;
};
let ObcElevatedCardRadio = class extends LitElement {
  constructor() {
    super();
    this.position = ObcElevatedCardPosition.Regular;
    this.size = ObcElevatedCardSize.SingleLine;
    this.graphicBorder = false;
    this.border = false;
    this.name = "";
    this.value = "";
    this.label = "";
    this.checked = false;
    this.disabled = false;
    this.required = false;
    this.instanceId = `obc-elevated-card-radio-${ObcElevatedCardRadio.counter++}`;
  }
  createRenderRoot() {
    return this;
  }
  render() {
    return html`
      <obc-elevated-card
        class="obc-elevated-card-radio"
        .overrideTag=${ObcElevatedCardTag.Div}
        .position=${this.position}
        .size=${ObcElevatedCardSize.SingleLine}
        ?graphicBorder=${this.graphicBorder}
        ?border=${this.border}
        @click=${this._handleCardClick}
        hasLeadingIcon
      >
        <obc-radio
          .name=${this.name}
          inputId=${this.instanceId}
          .value=${this.value}
          ?checked=${this.checked}
          ?disabled=${this.disabled}
          ?required=${this.required}
          @change=${this._handleRadioChange}
          slot="leading-icon"
        ></obc-radio>
        <label
          class="obc-elevated-card-radio__label"
          for=${this.instanceId}
          slot="label"
          >${this.label}</label
        >
      </obc-elevated-card>
    `;
  }
  _handleCardClick() {
    this.renderRoot.querySelector("input")?.click();
  }
  _handleRadioChange(event) {
    const radio = event.target;
    this.checked = radio.checked;
    this.dispatchEvent(
      new CustomEvent("change", { detail: { value: radio.value } })
    );
  }
};
ObcElevatedCardRadio.counter = 0;
__decorateClass([
  property({ type: String })
], ObcElevatedCardRadio.prototype, "position", 2);
__decorateClass([
  property({ type: String })
], ObcElevatedCardRadio.prototype, "size", 2);
__decorateClass([
  property({ type: Boolean })
], ObcElevatedCardRadio.prototype, "graphicBorder", 2);
__decorateClass([
  property({ type: Boolean })
], ObcElevatedCardRadio.prototype, "border", 2);
__decorateClass([
  property({ type: String })
], ObcElevatedCardRadio.prototype, "name", 2);
__decorateClass([
  property({ type: String })
], ObcElevatedCardRadio.prototype, "value", 2);
__decorateClass([
  property({ type: String })
], ObcElevatedCardRadio.prototype, "label", 2);
__decorateClass([
  property({ type: Boolean })
], ObcElevatedCardRadio.prototype, "checked", 2);
__decorateClass([
  property({ type: Boolean })
], ObcElevatedCardRadio.prototype, "disabled", 2);
__decorateClass([
  property({ type: Boolean })
], ObcElevatedCardRadio.prototype, "required", 2);
ObcElevatedCardRadio = __decorateClass([
  customElement("obc-elevated-card-radio")
], ObcElevatedCardRadio);
export {
  ObcElevatedCardRadio
};
//# sourceMappingURL=elevated-card-radio.js.map
