import { proxyCustomElement, HTMLElement, createEvent, h, Fragment } from '@stencil/core/internal/client';
import { s as sprintf, a as _n, _ as __ } from './default-i18n.js';
import './index2.js';
import { i as isRtl } from './page-align.js';
import { d as defineCustomElement$4 } from './sc-format-number2.js';
import { d as defineCustomElement$3 } from './sc-icon2.js';
import { d as defineCustomElement$2 } from './sc-line-item2.js';
import { d as defineCustomElement$1 } from './sc-quantity-select2.js';

const scProductLineItemCss = ":host{display:block;font-family:var(--sc-font-sans)}.item{box-sizing:border-box;margin:0px;min-width:0px;display:flex;gap:18px;justify-content:space-between;align-items:stretch;width:100%;border-bottom:none}.item--has-image{align-items:center}.item__scratch-price{opacity:0.75;font-size:90%;text-decoration:line-through}.item__text{box-sizing:border-box;margin:0px;min-width:0px;display:flex;gap:6px;flex-direction:column;align-items:flex-start;justify-content:flex-start;flex:1 1 0%}.item__title{box-sizing:border-box;min-width:0px;margin:0;color:var(--sc-line-item-title-color, var(--sc-input-label-color));font-weight:var(--sc-font-weight-semibold);font-size:var(--sc-font-size-medium);line-height:var(--sc-line-height-dense);cursor:pointer}.item__suffix{flex:1;box-sizing:border-box;margin:0px;min-width:0px;display:flex;flex-direction:column;-webkit-box-pack:start;justify-content:space-between;align-items:flex-end;min-width:100px;margin-left:auto}.item__price{text-align:right;max-width:100%}.item__description{font-size:var(--sc-font-size-small);line-height:var(--sc-line-height-dense);opacity:0.75}.item__image{width:var(--sc-product-line-item-image-size, 4em);height:var(--sc-product-line-item-image-size, 4em);object-fit:cover;border-radius:4px;border:solid 1px var(--sc-input-border-color, var(--sc-input-border));display:block;box-shadow:var(--sc-input-box-shadow)}.product__description{display:flex;gap:0.5em;align-items:center}.price{font-size:var(--sc-font-size-medium);font-weight:var(--sc-font-weight-semibold);color:var(--sc-input-label-color);line-height:var(--sc-line-height-dense)}.price__description{font-size:var(--sc-font-size-small);line-height:var(--sc-line-height-dense);color:var(--sc-input-label-color);opacity:0.75}.item__remove{cursor:pointer;color:var(--sc-color-gray-400);margin-bottom:var(--sc-spacing-small)}.actions__divider{opacity:0.25;margin:0 0.2em}.item--is-rtl.price{text-align:right}.item--is-rtl .item__price{text-align:left}.base{display:grid;gap:var(--sc-spacing-x-small)}.fee__description{opacity:0.75}";

const ScProductLineItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.__attachShadow();
    this.scUpdateQuantity = createEvent(this, "scUpdateQuantity", 3);
    this.scRemove = createEvent(this, "scRemove", 3);
    /** Is the setup fee not included in the free trial? */
    this.setupFeeTrialEnabled = true;
    /** Can we select the quantity */
    this.editable = true;
    /** The max allowed. */
    this.max = 100;
  }
  renderPriceAndInterval() {
    const setupFee = (this.fees || []).find(fee => fee.fee_type === 'setup');
    if (this.trialDurationDays) {
      return (h("div", { class: "item__price", part: "price" }, h("div", { class: "price", part: "price__amount" }, !!setupFee && !this.setupFeeTrialEnabled ? (h(Fragment, null, setupFee === null || setupFee === void 0 ? void 0 :
        setupFee.description, " ", h("sc-format-number", { part: "price__amount", type: "currency", currency: this.currency, value: setupFee.amount }))) : (sprintf(_n('%d day free', '%d days free', this.trialDurationDays, 'surecart'), this.trialDurationDays))), h("div", { class: "price__description", part: "price__description" }, 
      /** translators: 30 days free, Then $99 per month. */
      __('Then', 'surecart'), ' ', !!this.scratchAmount && this.scratchAmount > this.amount && (h(Fragment, null, h("sc-format-number", { class: "item__scratch-price", part: "price__scratch", type: "currency", currency: this.currency, value: this.scratchAmount }), ' ')), h("sc-format-number", { part: "price__amount", type: "currency", currency: this.currency, value: this.amount }), " ", !!this.interval && this.interval, !!setupFee && !this.setupFeeTrialEnabled && sprintf(_n('starting in %d day', 'starting in %d days', this.trialDurationDays, 'surecart'), this.trialDurationDays))));
    }
    return (h("div", { class: "item__price", part: "price" }, h("div", { class: "price", part: "price__amount" }, !!this.scratchAmount && this.scratchAmount !== this.amount && (h(Fragment, null, h("sc-format-number", { class: "item__scratch-price", type: "currency", currency: this.currency, value: this.scratchAmount }), ' ')), h("sc-format-number", { type: "currency", currency: this.currency, value: this.amount })), !!this.interval && (h("div", { class: "price__description", part: "price__description" }, this.interval))));
  }
  render() {
    return (h("div", { class: "base", part: "base" }, h("div", { part: "product-line-item", class: { 'item': true, 'item--has-image': !!this.imageUrl, 'item--is-rtl': isRtl() } }, !!this.imageUrl && h("img", { part: "image", src: `${window.scData.cdn_root}fit=scale-down,format=auto,width=130/${this.imageUrl}`, class: "item__image" }), h("div", { class: "item__text", part: "text" }, h("div", { class: "item__title", part: "title" }, h("slot", { name: "title" }, this.name)), this.editable && (h("sc-quantity-select", { max: this.max || Infinity, exportparts: "base:quantity__base, minus, minus-icon, plus, plus-icon, input", clickEl: this.el, quantity: this.quantity, onScChange: e => e.detail && this.scUpdateQuantity.emit(e.detail) })), !this.editable && this.quantity > 1 && (h("span", { class: "item__description", part: "static-quantity" }, __('Qty:', 'surecart'), " ", this.quantity))), h("div", { class: "item__suffix", part: "suffix" }, this.removable ? h("sc-icon", { exportparts: "base:remove-icon__base", class: "item__remove", name: "x", onClick: () => this.scRemove.emit() }) : h("div", null), this.renderPriceAndInterval())), (this.fees || []).map(fee => {
      if (this.trialDurationDays && !this.setupFeeTrialEnabled && fee.fee_type === 'setup')
        return null;
      return (h("sc-line-item", null, h("sc-format-number", { slot: "price-description", type: "currency", value: fee === null || fee === void 0 ? void 0 : fee.amount, currency: this.currency || 'usd' }), h("span", { slot: "price-description", class: "fee__description" }, fee === null || fee === void 0 ? void 0 : fee.description)));
    })));
  }
  get el() { return this; }
  static get style() { return scProductLineItemCss; }
}, [1, "sc-product-line-item", {
    "imageUrl": [1, "image-url"],
    "name": [1],
    "quantity": [2],
    "amount": [2],
    "fees": [16],
    "setupFeeTrialEnabled": [4, "setup-fee-trial-enabled"],
    "scratchAmount": [2, "scratch-amount"],
    "currency": [1],
    "interval": [1],
    "trialDurationDays": [2, "trial-duration-days"],
    "removable": [4],
    "editable": [4],
    "max": [2]
  }]);
function defineCustomElement() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["sc-product-line-item", "sc-format-number", "sc-icon", "sc-line-item", "sc-quantity-select"];
  components.forEach(tagName => { switch (tagName) {
    case "sc-product-line-item":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, ScProductLineItem);
      }
      break;
    case "sc-format-number":
      if (!customElements.get(tagName)) {
        defineCustomElement$4();
      }
      break;
    case "sc-icon":
      if (!customElements.get(tagName)) {
        defineCustomElement$3();
      }
      break;
    case "sc-line-item":
      if (!customElements.get(tagName)) {
        defineCustomElement$2();
      }
      break;
    case "sc-quantity-select":
      if (!customElements.get(tagName)) {
        defineCustomElement$1();
      }
      break;
  } });
}
defineCustomElement();

export { ScProductLineItem as S, defineCustomElement as d };
