import { r as registerInstance, c as createEvent, h } from './index-f1d2a96f.js';
import { _ as __ } from './default-i18n-91ef32a0.js';
import './index-0a61debd.js';
import { o as openWormhole } from './consumer-7a54eb9f.js';
import { h as hasSubscription } from './index-df9110d6.js';
import { g as getProcessorData } from './processor-6e16ca02.js';
import './_commonjsHelpers-9943807e.js';

const scPaymentCss = "sc-payment{display:flex !important;flex-direction:column;gap:var(--sc-input-label-margin);position:relative;font-family:var(--sc-font-sans)}.sc-payment-toggle-summary{line-height:1;display:flex;align-items:center;gap:0.5em}.sc-payment-label{display:flex;justify-content:space-between}.sc-payment-instructions{color:var(--sc-color-gray-600)}.sc-payment__stripe-card-element{display:flex !important;flex-direction:column;gap:var(--sc-input-label-margin);position:relative}";

const ScPayment = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.scSetProcessor = createEvent(this, "scSetProcessor", 7);
    /** The current payment method for the payment */
    this.processor = 'stripe';
    /** List of available processors. */
    this.processors = [];
    /** Is this created in "test" mode */
    this.mode = 'live';
    /** The currency code. */
    this.currencyCode = 'usd';
    /** Default */
    this.defaultProcessor = 'stripe';
  }
  handleOrderChange(_, prev) {
    if (!prev) {
      this.handleDefaultChange();
    }
  }
  handleDefaultChange() {
    if (this.defaultProcessor) {
      this.scSetProcessor.emit(this.defaultProcessor);
    }
  }
  componentWillLoad() {
    this.setProcessors();
  }
  /** Set the processors for this order. */
  setProcessors() {
    this.stripe = (this.processors || []).find(processor => processor.processor_type === 'stripe' && (processor === null || processor === void 0 ? void 0 : processor.live_mode) === (this.mode === 'live'));
    this.paypal = (this.processors || []).find(processor => processor.processor_type === 'paypal' && (processor === null || processor === void 0 ? void 0 : processor.live_mode) === (this.mode === 'live'));
  }
  /**
   * Render the payment element.
   */
  renderStripePaymentElement() {
    if (this.stripePaymentElement) {
      return h("sc-order-stripe-payment-element", { order: this.order, mode: this.mode, processors: this.processors, "currency-code": this.currencyCode });
    }
    const data = getProcessorData(this.processors, 'stripe', this.mode);
    return (h("div", { class: "sc-payment__stripe-card-element" }, h("sc-stripe-element", { order: this.order, mode: this.mode, publishableKey: data === null || data === void 0 ? void 0 : data.publishable_key, accountId: data === null || data === void 0 ? void 0 : data.account_id, secureText: this.secureNotice }), h("sc-secure-notice", null, this.secureNotice)));
  }
  renderTestModeBadge() {
    if (this.hideTestModeBadge)
      return null;
    return (this.mode === 'test' && (h("sc-tag", { type: "warning", size: "small" }, __('Test Mode', 'surecart'))));
  }
  /**
   * Render Stripe and Paypal radio buttons.
   */
  renderStripeAndPayPal() {
    return (h("sc-form-control", { label: this.label }, h("div", { class: "sc-payment-label", slot: "label" }, h("div", null, this.label), this.renderTestModeBadge()), h("sc-toggles", { collapsible: false, theme: "container" }, h("sc-toggle", { class: "sc-stripe-toggle", "show-control": true, shady: true, borderless: true, open: this.processor === 'stripe', onScShow: () => this.scSetProcessor.emit('stripe') }, h("span", { slot: "summary", class: "sc-payment-toggle-summary" }, h("sc-icon", { name: "credit-card", style: { fontSize: '24px' } }), h("span", null, __('Credit Card', 'surecart'))), this.renderStripePaymentElement()), h("sc-toggle", { class: "sc-paypal-toggle", "show-control": true, shady: true, borderless: true, open: this.processor === 'paypal', onScShow: () => this.scSetProcessor.emit('paypal') }, h("span", { slot: "summary", class: "sc-payment-toggle-summary" }, h("sc-icon", { name: "paypal", style: { width: '80px', fontSize: '24px' } })), h("div", { class: "sc-payment-instructions" }, __('You will be prompted by PayPal to complete your purchase securely.', 'surecart'))))));
  }
  /**
   * Render PayPal options.
   */
  renderPayPal() {
    return (h("sc-form-control", { label: this.label }, h("div", { class: "sc-payment-label", slot: "label" }, h("div", null, this.label), this.renderTestModeBadge()), h("sc-toggles", { collapsible: false, theme: "container" }, h("sc-toggle", { "data-test-id": "paypal-credit-card-toggle", "show-control": true, shady: true, borderless: true, open: this.processor === 'paypal-card', onScShow: () => this.scSetProcessor.emit('paypal-card') }, h("span", { slot: "summary", class: "sc-payment-toggle-summary" }, h("sc-icon", { name: "credit-card", style: { fontSize: '24px' } }), h("span", null, __('Credit Card', 'surecart'))), h("div", { class: "sc-payment-instructions" }, __('You will be prompted to complete your purchase securely.', 'surecart'))), h("sc-toggle", { "data-test-id": "paypal-toggle", "show-control": true, shady: true, borderless: true, open: this.processor === 'paypal', onScShow: () => this.scSetProcessor.emit('paypal') }, h("span", { slot: "summary", class: "sc-payment-toggle-summary" }, h("sc-icon", { name: "paypal", style: { width: '80px', fontSize: '24px' } })), h("div", { class: "sc-payment-instructions" }, __('You will be prompted by PayPal to complete your purchase securely.', 'surecart'))))));
  }
  renderLoading() {
    return (h("div", null, h("sc-skeleton", { style: { width: '10%', marginBottom: '1em' } }), h("sc-skeleton", { style: { width: '100%', marginBottom: '1em' } }), h("sc-skeleton", { style: { width: '35%' } })));
  }
  getProcessor() {
    switch (this.processor) {
      case 'paypal':
      case 'paypal-card':
        return 'paypal';
      default:
        return 'stripe';
    }
  }
  renderNoProcessors() {
    return (h("sc-form-control", { label: this.label }, h("sc-alert", { type: "info", open: true }, __('Please contact us for payment', 'surecart'))));
  }
  render() {
    var _a, _b, _c, _d, _e;
    // no payment is required if we dont have a subscription and the total amount is 0.
    if (!hasSubscription(this.order)) {
      if (((_c = (_b = (_a = this.order) === null || _a === void 0 ? void 0 : _a.line_items) === null || _b === void 0 ? void 0 : _b.pagination) === null || _c === void 0 ? void 0 : _c.count) >= 1 && ((_d = this.order) === null || _d === void 0 ? void 0 : _d.total_amount) === 0) {
        return null;
      }
    }
    // we don't have any processors.
    if (!((_e = this.processors) === null || _e === void 0 ? void 0 : _e.length)) {
      console.warn('No processors are configured for this merchant.');
      return this.renderNoProcessors();
    }
    // both stripe and paypal are enabled.
    if (this.stripe && this.paypal) {
      return this.renderStripeAndPayPal();
    }
    // we have stripe.
    if (this.stripe) {
      return (h("sc-form-control", { label: this.label }, h("div", { class: "sc-payment-label", slot: "label" }, h("div", null, this.label), this.renderTestModeBadge()), this.stripePaymentElement ? h("sc-card", null, this.renderStripePaymentElement()) : this.renderStripePaymentElement()));
    }
    // we have paypal.
    if (this.paypal) {
      return this.renderPayPal();
    }
    console.warn(`No processors are configured for the current cart items and mode. (${this.mode})`);
    // render no processors message.
    return this.renderNoProcessors();
  }
  static get watchers() { return {
    "order": ["handleOrderChange"],
    "defaultProcessor": ["handleDefaultChange"],
    "processors": ["setProcessors"],
    "mode": ["setProcessors"]
  }; }
};
openWormhole(ScPayment, ['processor', 'processors', 'order', 'mode', 'paymentMethod', 'loading', 'busy', 'currencyCode', 'stripePaymentElement'], false);
ScPayment.style = scPaymentCss;

export { ScPayment as sc_payment };
