import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
import { s as state } from './watchers3.js';
import { d as defineCustomElement$1 } from './sc-card2.js';

const scPaymentMethodChoiceCss = ":host{display:block}:slotted([slot=\"summary\"]){line-height:1;display:flex;align-items:center;gap:0.5em}";

const ScPaymentMethodChoice = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.__attachShadow();
  }
  isSelected() {
    if (this.methodId) {
      return (state === null || state === void 0 ? void 0 : state.id) === this.processorId && (state === null || state === void 0 ? void 0 : state.method) == this.methodId;
    }
    return !(state === null || state === void 0 ? void 0 : state.method) && (state === null || state === void 0 ? void 0 : state.id) === this.processorId;
  }
  getAllOptions() {
    const parentGroup = this.el.closest('sc-payment') || this.el.parentElement;
    if (!parentGroup) {
      return [];
    }
    return [...parentGroup.querySelectorAll(this.el.tagName)];
  }
  getSiblingItems() {
    return this.getAllOptions().filter(choice => choice !== this.el);
  }
  hasOthers() {
    var _a;
    return !!((_a = this.getSiblingItems()) === null || _a === void 0 ? void 0 : _a.length);
  }
  render() {
    const Tag = this.hasOthers() ? 'sc-toggle' : 'div';
    return (h(Tag, { "show-control": true, borderless: true, open: this.isSelected(), onScShow: () => {
        state.id = this.processorId;
        state.manual = !!this.isManual;
        state.method = this.methodId;
      } }, this.hasOthers() && h("slot", { name: "summary", slot: "summary" }), this.card && !this.hasOthers() ? (h("sc-card", null, h("slot", null))) : (h("slot", null))));
  }
  get el() { return this; }
  static get style() { return scPaymentMethodChoiceCss; }
}, [1, "sc-payment-method-choice", {
    "methodId": [513, "method-id"],
    "processorId": [1, "processor-id"],
    "isManual": [4, "is-manual"],
    "card": [4]
  }]);
function defineCustomElement() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["sc-payment-method-choice", "sc-card"];
  components.forEach(tagName => { switch (tagName) {
    case "sc-payment-method-choice":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, ScPaymentMethodChoice);
      }
      break;
    case "sc-card":
      if (!customElements.get(tagName)) {
        defineCustomElement$1();
      }
      break;
  } });
}
defineCustomElement();

export { ScPaymentMethodChoice as S, defineCustomElement as d };
