@beamimpact/web-sdk 1.50.1 → 1.52.1

package/dist/components/product-details-page.js.map

@@ -1 +1 @@
-{"version":3,"file":"product-details-page.js","sources":["../../src/shared/fragments/custom-border.ts","../../src/shared/fragments/info.ts","../../src/components/product-details-page/strings.ts","../../src/components/product-details-page/index.ts"],"sourcesContent":["import { CSSResult, unsafeCSS } from \"lit\";\n\nexport const defineCustomBorder = (\n  namespace = \"\",\n  { borderRadius = \"0px\", borderStyle = \"unset\", borderColor = \"#000000\", borderWidth = \"1px\" } = {}\n): Record<string, string> => {\n  const prefix = namespace.startsWith(\"--beam-\") ? namespace : `--beam-${namespace}`;\n  return {\n    [`${prefix}-borderRadius`]: borderRadius,\n    [`${prefix}-borderStyle`]: borderStyle,\n    [`${prefix}-borderColor`]: borderColor,\n    [`${prefix}-borderWidth`]: borderWidth,\n  };\n};\n\nexport const useCustomBorder = (\n  namespace = \"\",\n  { borderRadius = \"0px\", borderStyle = \"unset\", borderColor = \"#000000\", borderWidth = \"1px\" } = {}\n): CSSResult => {\n  const prefix = namespace.startsWith(\"--beam-\") ? namespace : `--beam-${namespace}`;\n  return unsafeCSS(`\\\n        border-radius: var(${prefix}-borderRadius, ${borderRadius});\n        border-style: var(${prefix}-borderStyle, ${borderStyle});\n        border-color: var(${prefix}-borderColor, ${borderColor});\n        border-width: var(${prefix}-borderWidth, ${borderWidth});\n    `);\n};\n","import { html } from \"lit\";\n\nexport const _info = () => html` <svg\n  xmlns=\"http://www.w3.org/2000/svg\"\n  width=\"24\"\n  height=\"24\"\n  viewBox=\"0 0 24 24\"\n  fill=\"none\"\n  stroke=\"currentColor\"\n  stroke-width=\"2\"\n  stroke-linecap=\"round\"\n  stroke-linejoin=\"round\"\n  part=\"svg\"\n>\n  <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\n  <path d=\"M12 16v-4\"></path>\n  <path d=\"M12 8h.01\"></path>\n</svg>`;\n","export const strings = {\n  en: {\n    ctaTitle: () => `Choose your impact`,\n    ctaMessage: () => `At no extra cost, 1% of every order is donated to a nonprofit you choose. Powered by Beam`,\n    inlineSeparator: () => `:`,\n  },\n  fr: {\n    ctaTitle: () => `Choisissez l'impact de votre choix`,\n    ctaMessage: () =>\n      `Sans frais supplémentaires, 1% de chaque commande est reversé à l'organisation caritative de votre choix. Développé par Beam`,\n    inlineSeparator: () => `:`,\n  },\n  es: {\n    ctaTitle: () => `Elige el impacto que deseas`,\n    ctaMessage: () =>\n      `Sin coste adicional, el 1% de cada pedido se dona a la organización sin ánimo de lucro que tú elijas. Desarrollado por Beam`,\n    inlineSeparator: () => `:`,\n  },\n  de: {\n    ctaTitle: () => `Wählen Sie Ihren Einfluss`,\n    ctaMessage: () =>\n      `Ohne zusätzliche Kosten wird 1 % jeder Bestellung an eine von Ihnen gewählte gemeinnützige Organisation gespendet. Von Beam unterstützt`,\n    inlineSeparator: () => `:`,\n  },\n  it: {\n    ctaTitle: () => `Scegliete chi sostenere`,\n    ctaMessage: () =>\n      `L'1% di ogni vostro acquisto viene donato, senza alcun costo aggiuntivo, a un'organizzazione no-profit a libera scelta. Promosso da Beam`,\n    inlineSeparator: () => `:`,\n  },\n  pl: {\n    ctaTitle: () => `Masz wpływ, dokonaj wyboru`,\n    ctaMessage: () =>\n      `1% kwoty każdego zamówienia jest przekazywane na rzecz wybranej przez Ciebie organizacji non-profit – bez dodatkowych kosztów. Obsługiwane przez Beam`,\n    inlineSeparator: () => `:`,\n  },\n};\n","import { LitElement, css, html } from \"lit\";\nimport { property, state } from \"lit/decorators.js\";\nimport { unsafeHTML } from \"lit/directives/unsafe-html.js\";\nimport { AsyncController } from \"../../shared/controllers/async-controller\";\nimport { postProductDetailsPage } from \"../../api-sdk/v3/routes\";\nimport { DEFAULT_BASE_URL, SUPPORTED_LANGUAGES, WIDGET_NAMES } from \"../../api-sdk/constants\";\nimport { LANGUAGES, TUrl } from \"../../api-sdk/types\";\nimport { MissingConfig } from \"../../utils/beam-errors\";\nimport { enforceConfig } from \"../../shared/enforce-config\";\nimport { _cssVariableMap } from \"../../shared/fragments/css-variable-map\";\nimport { localizeUserString } from \"../../shared/localize\";\nimport { _errorMessage } from \"../../shared/fragments/error-message-template\";\nimport { cssResponsiveUtils } from \"../../shared/responsive\";\nimport { defineCustomElement } from \"../../shared/defineCustomElement\";\nimport { cssReset } from \"../../shared/css-reset\";\nimport { defineCustomText, useCustomText } from \"../../shared/fragments/custom-text\";\nimport { defineCustomBorder, useCustomBorder } from \"../../shared/fragments/custom-border\";\n// shoelace html tag imports\nimport \"@shoelace-style/shoelace/dist/components/tooltip/tooltip.js\";\nimport { _info } from \"../../shared/fragments/info\";\nimport { promoPillLabelConfigDefaults } from \"../../shared/components/promo-pill-label\";\nimport {\n  getPromoCodesFromCart,\n  setPromoCodeInCookie,\n  parseJsonStringArray,\n  formatStoreAndReturnPromoCodes,\n  setPromoCodesInLocalStorage,\n  isEmptyPromoData,\n} from \"../../utils/promoManager\";\nimport \"../../shared/components/promo-pill-label\";\nimport { BEAM_CART_COOKIE_NAME, TBeamCartLocalStorage } from \"../../shared/cart-contents\";\nimport { createScopedLocalStorage } from \"../../utils/local-storage\";\nimport { makeApiKeyHeader } from \"../../utils/makeApiKeyHeader\";\nimport { BeamPromoCodesStoredEvent, BeamWidgetStoredPromoCodesEvent } from \"../../utils/events\";\nimport { getBeamCartId } from \"../../utils/cart\";\nimport { strings } from \"./strings\";\n\ntype RequiredConfig = {\n  apiKey: string;\n  storeId: number;\n};\ntype IAPIV3PostProductDetailsPage = Awaited<ReturnType<typeof postProductDetailsPage>>;\n\nconst IMAGE_URL_REMOTE_CONFIG_KEY = \"--beam-ProductDetailsPage-imageUrl\";\n\nexport class BeamProductDetailsPage extends LitElement {\n  static tagName = \"beam-product-details-page\";\n\n  @property({ type: String, reflect: true }) public baseUrl: TUrl = DEFAULT_BASE_URL;\n\n  @property({ type: String, reflect: false }) apiKey?: RequiredConfig[\"apiKey\"];\n\n  @property({ type: Number }) storeId?: number;\n\n  @property({ type: String }) public lang: LANGUAGES = \"en\";\n\n  @property({ type: Boolean }) public draftConfig = false;\n\n  @property({ type: Boolean }) public debug = false;\n\n  @property({ type: String }) remoteProductIdentifier?: string;\n\n  @property({ type: String }) public promoCodes?: string;\n\n  @property({ type: String }) public domain?: string;\n\n  private localStorage = createScopedLocalStorage(this as LitElement & RequiredConfig);\n\n  @state() private pluginPromoCodes: string[] = [];\n\n  get configLang() {\n    return SUPPORTED_LANGUAGES[this.lang] || \"en\";\n  }\n\n  get parsedPromoCodes(): string[] {\n    return parseJsonStringArray(this.promoCodes);\n  }\n\n  private handlePromoCodesStored = (evt: BeamPromoCodesStoredEvent) => {\n    const promoCodesFromPlugin = (evt.detail.promoCodes?.unvalidatedPromoCodes ?? [])\n      .map((c) => c.attributes?.value ?? c.attributes?.url ?? \"\")\n      .sort();\n    this.pluginPromoCodes = promoCodesFromPlugin;\n  };\n\n  private getManualPromoCodes(): string[] {\n    // Priority 1: Widget passed discount codes\n    if (this.parsedPromoCodes && this.parsedPromoCodes.length > 0) {\n      return this.parsedPromoCodes;\n    }\n\n    // Priority 2: Cart fallback\n    const cart = this.localStorage.getItemJson<TBeamCartLocalStorage>(\"cart\");\n    return cart ? getPromoCodesFromCart(cart) : [];\n  }\n\n  private async handleValidatedPromoCodes(response: IAPIV3PostProductDetailsPage) {\n    if (response.promos?.validatedPromoCodes) {\n      await Promise.all([\n        setPromoCodesInLocalStorage({\n          apiKey: this.apiKey,\n          promoCodes: { validatedPromoCodes: response.promos.validatedPromoCodes, unvalidatedPromoCodes: [] },\n        }),\n        setPromoCodeInCookie({\n          validatedPromoCodes: response.promos.validatedPromoCodes,\n          domain: this.domain,\n        }),\n      ]);\n      this.dispatchEvent(\n        new BeamWidgetStoredPromoCodesEvent({\n          source: WIDGET_NAMES.product_details_page,\n        })\n      );\n    }\n  }\n\n  async firstUpdated() {\n    window.addEventListener(BeamPromoCodesStoredEvent.eventName, this.handlePromoCodesStored as EventListener);\n  }\n\n  disconnectedCallback() {\n    window.removeEventListener(BeamPromoCodesStoredEvent.eventName, this.handlePromoCodesStored as EventListener);\n    super.disconnectedCallback();\n  }\n\n  postProductDetailsPageData = async () => {\n    if (!enforceConfig<RequiredConfig>([\"apiKey\", \"storeId\"], this)) throw new MissingConfig();\n    const beamCartId = getBeamCartId(BEAM_CART_COOKIE_NAME, { apiKey: this.apiKey });\n\n    const manualPromoCodes = this.getManualPromoCodes();\n    const formattedPromos = formatStoreAndReturnPromoCodes(\n      manualPromoCodes.map((code) => ({ value: code })),\n      this.apiKey\n    );\n    const shouldSendPromos = formattedPromos && !isEmptyPromoData(formattedPromos);\n\n    if (shouldSendPromos) {\n      this.dispatchEvent(\n        new BeamWidgetStoredPromoCodesEvent({\n          source: WIDGET_NAMES.product_details_page,\n        })\n      );\n    }\n    const res = await postProductDetailsPage({\n      baseUrl: this.baseUrl,\n      headers: makeApiKeyHeader(this.apiKey),\n      queryParams: {\n        version: \"1.0.0\",\n        lang: this.configLang,\n        storeId: this.storeId,\n        widgetName: WIDGET_NAMES.product_details_page,\n        draftConfig: this.draftConfig,\n        remoteProductIdentifier: this.remoteProductIdentifier,\n      },\n      requestBody: {\n        ...(shouldSendPromos && { promos: formattedPromos }),\n        beamCartId: beamCartId ? beamCartId : undefined,\n      },\n    });\n    this.handleValidatedPromoCodes(res);\n    return res;\n  };\n\n  private productDetailsPageDataController = new AsyncController<typeof this.postProductDetailsPageData>(\n    this,\n    this.postProductDetailsPageData\n  );\n\n  async updated(changedProperties: Map<string, unknown>) {\n    const requireNewDataProps = [\"storeId\", \"baseUrl\", \"lang\", \"apiKey\", \"pluginPromoCodes\"];\n    void this.pluginPromoCodes;\n    for (const prop of requireNewDataProps) {\n      if (changedProperties.has(prop)) {\n        await this.productDetailsPageDataController.exec();\n        break;\n      }\n    }\n  }\n\n  render() {\n    const { data, loading } = this.productDetailsPageDataController;\n    const iconDisplay = this.cssVariables[\"--beam-ProductDetailsPage-image-placement\"];\n    const isNonZero = (value: string) => value !== \"0px\" && value !== \"0\";\n    const shouldDisplayPromoPill = this.cssVariables[\"--beam-ProductDetailsPage-shouldDisplayPromoPill\"] === \"true\";\n    const isPromoActive = !!data?.config?.web?.promo;\n    const hasValidImageHeight = isNonZero(this.cssVariables[\"--beam-ProductDetailsPage-imageHeight\"]);\n    const hasValidTitleFontSize = isNonZero(this.cssVariables[\"--beam-ProductDetailsPage-title-fontSize\"]);\n    const isPromoPillVisible =\n      shouldDisplayPromoPill && // Determines if the promo pill is enabled for the marketing version of the PDP\n      isPromoActive && // Is promo currently active\n      hasValidImageHeight && // Ensures the promo pill is not displayed for the subtext version of the PDP\n      hasValidTitleFontSize; // Ensures the promo pill is not displayed for the subtext version of the PDP\n    const shouldShowPunctuation = this.cssVariables[\"--beam-ProductDetailsPage-shouldDisplayColon\"] === \"true\"; // Determines if a colon should be displayed in promo display\n    if (loading) {\n      return html``;\n    }\n    if (data == null) {\n      if (this.debug) {\n        return _errorMessage({ error: new Error(\"No data\") });\n      }\n      return \"\";\n    }\n    return html`\n      <style>\n        :host {\n          ${this.cssVariables.toCSS()}\n        }\n      </style>\n      <div class=\"root ${iconDisplay === \"block-center\" ? \"block-display\" : \"inline-display\"}\">\n        ${iconDisplay === \"block-center\"\n          ? html`\n              ${this.renderWidgetIcon(iconDisplay)}\n              ${isPromoPillVisible\n                ? html`\n                    <div class=\"promo-container\">\n                      <beam-promo-info-pill .promo=${data?.config?.web?.promo}></beam-promo-info-pill>\n                    </div>\n                  `\n                : html``}\n              <div class=\"info-container\">${this.renderContent(isPromoPillVisible, shouldShowPunctuation, data)}</div>\n            `\n          : html`\n              ${isPromoPillVisible\n                ? html`\n                    <div class=\"promo-container\">\n                      <beam-promo-info-pill .promo=${data?.config?.web?.promo}></beam-promo-info-pill>\n                    </div>\n                  `\n                : html``}\n              <div class=\"content-inline\">\n                ${this.renderWidgetIcon(iconDisplay)}\n                <div class=\"info-container\">${this.renderContent(isPromoPillVisible, shouldShowPunctuation, data)}</div>\n              </div>\n            `}\n      </div>\n    `;\n  }\n\n  renderWidgetIcon(iconDisplay: string) {\n    const imageUrl = this.cssVariables[IMAGE_URL_REMOTE_CONFIG_KEY];\n\n    if (!imageUrl) return html``;\n\n    const isBlockDisplay = iconDisplay === \"block-center\";\n    const containerStyle = isBlockDisplay ? 'style=\"order:1\"' : \"\";\n\n    return html`\n      <span class=\"icon-container\" part=\"icon\" ${containerStyle}>\n        <img src=${imageUrl} alt=\"Widget Icon\" />\n      </span>\n    `;\n  }\n\n  renderContent(isPromoPillVisible: boolean, shouldDisplayColon: boolean, data: IAPIV3PostProductDetailsPage) {\n    const title = localizeUserString(this.configLang, data?.config?.web?.title) || strings[this.configLang].ctaTitle();\n    const description =\n      localizeUserString(this.configLang, data?.config?.web?.description) || strings[this.configLang].ctaMessage();\n    return isPromoPillVisible\n      ? html`\n          <div class=\"info-inline-promo\">\n            <span class=\"title\">${title + (shouldDisplayColon ? strings[this.configLang].inlineSeparator() : \"\")}</span>\n            <span class=\"description\"> ${description} ${this.renderDisclosureTooltip()} </span>\n          </div>\n        `\n      : html`\n          <div class=\"title-block\">\n            <h3 class=\"title\">${title}</h3>\n          </div>\n          <div class=\"description-block\">\n            <span class=\"description\"> ${description} ${this.renderDisclosureTooltip()} </span>\n          </div>\n        `;\n  }\n\n  renderCloseTooltipIcon() {\n    return html`<svg width=\"11\" height=\"11\" viewBox=\"0 0 11 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        d=\"M5.40836 5.40811L1.48828 1.48804M5.40836 5.40811L9.32843 9.32819M5.40836 5.40811L9.32843 1.48804M5.40836 5.40811L1.48828 9.32819\"\n        stroke=\"white\"\n        stroke-width=\"1.56803\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n      />\n    </svg> `;\n  }\n\n  /* PayPal Giving Fund Disclosure */\n  renderDisclosureTooltip() {\n    const onClickClose = () => {\n      // due to being strictly html, we need to assume any when overriding shoelace properties\n      const tooltip = this.renderRoot.querySelector(\".ppgf-disclosure-tooltip\") as any;\n      tooltip.open = false;\n    };\n    const ppgfDisclosure = this.productDetailsPageDataController.data?.ppgfDisclosure;\n    return ppgfDisclosure\n      ? html`<sl-tooltip class=\"ppgf-disclosure-tooltip\" part=\"tooltip\">\n          <div class=\"ppgf-disclosure-tooltip-content\" slot=\"content\" part=\"tooltip-content\">\n            <button\n              class=\"ppgf-disclosure-close\"\n              aria-label=\"Close tooltip\"\n              part=\"tooltip-close-button\"\n              @click=\"${onClickClose}\"\n            >\n              ${this.renderCloseTooltipIcon()}\n            </button>\n            <div class=\"ppgf-disclosure-tooltip-copy\" part=\"tooltip-disclosure-copy\">\n              ${unsafeHTML(ppgfDisclosure.copy)}\n            </div>\n          </div>\n          <span class=\"ppgf-disclosure-tooltip-trigger\" part=\"tooltip-disclosure-icon\">\n            <div class=\"ppgf-disclosure-tooltip-trigger-mask d-lg-none\"></div>\n            ${_info()}\n          </span>\n        </sl-tooltip>`\n      : html``;\n  }\n\n  renderDisclosureTooltipHyperlink() {\n    const ppgfHyperlink = this.productDetailsPageDataController.data?.ppgfDisclosureHyperlink;\n    return ppgfHyperlink\n      ? html`<a class=\"ppgf-disclosure-hyperlink\" href=\"${ppgfHyperlink.url}\" target=\"_blank\">${ppgfHyperlink.copy}</a>`\n      : html``;\n  }\n  /* End PayPal Giving Fund Disclosure */\n\n  public get cssVariables() {\n    const defaults = {\n      \"--beam-ProductDetailsPage-imageWidth\": \"24px\",\n      \"--beam-ProductDetailsPage-imageHeight\": \"24px\",\n      \"--beam-ProductDetailsPage-maxWidth\": \"346px\",\n      \"--beam-ProductDetailsPage-paddingTop\": \"8px\",\n      \"--beam-ProductDetailsPage-paddingRight\": \"12px\",\n      \"--beam-ProductDetailsPage-paddingBottom\": \"8px\",\n      \"--beam-ProductDetailsPage-paddingLeft\": \"15px\",\n      \"--beam-ProductDetailsPage-InfoContainer-marginLeft\": \"8px\",\n      \"--beam-ProductDetailsPage-InfoContainer-textAlign\": \"inherit\",\n      \"--beam-ProductDetailsPage-InfoContainer-lineHeight\": \"15px\",\n      \"--beam-ProductDetailsPage-InfoContainer-marginTop\": \"4px\",\n      \"--beam-ProductDetailsPage-backgroundColor\": \"unset\",\n      \"--beam-ProductDetailsPage-TooltipIcon-width\": \"10px\",\n      \"--beam-ProductDetailsPage-TooltipIcon-color\": \"inherit\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor\": \"#000000\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingTop\": \"10px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingRight\": \"8px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingBottom\": \"10px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingLeft\": \"8px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color\": \"#5CA3FF\",\n      ...defineCustomText(\"--beam-ProductDetailsPage-title\", {\n        fontSize: \"12px\",\n        fontWeight: \"bold\",\n      }),\n      \"--beam-ProductDetailsPage-title-textAlign\": \"left\",\n      ...defineCustomText(\"--beam-ProductDetailsPage-description\", {\n        marginTop: \"0px\",\n        fontSize: \"12px\",\n        lineHeight: \"15px\",\n      }),\n      \"--beam-ProductDetailsPage-description-textAlign\": \"left\",\n      ...defineCustomText(\"--beam-ProductDetailsPage-PPGFDisclosureTooltipContent\", {\n        fontSize: \"12px\",\n        lineHeight: \"16px\",\n        color: \"#FFFFFF\",\n      }),\n      ...defineCustomBorder(\"--beam-ProductDetailsPage\"),\n      \"--beam-ProductDetailsPage-close-display\": \"initial\",\n      \"--beam-ProductDetailsPage-close-padding\": \"0\",\n      \"--beam-ProductDetailsPage-image-placement\": \"inline-left\", // options: \"inline-left\" || \"block-center\"\n      \"--beam-ProductDetailsPage-blockImage-alignSelf\": \"center\",\n      \"--beam-ProductDetailsPage-promoPill-marginTop\": \"4px\",\n      \"--beam-ProductDetailsPage-promoPill-alignSelf\": \"left\",\n      \"--beam-ProductDetailsPage-shouldDisplayColon\": \"true\",\n      \"--beam-ProductDetailsPage-shouldDisplayPromoPill\": \"true\",\n      ...promoPillLabelConfigDefaults,\n    };\n    const remoteConfig = this.productDetailsPageDataController?.data?.config?.web?.theme || {};\n\n    const config = { ...defaults, ...remoteConfig };\n\n    const serializable = Object.create({\n      toCSS() {\n        return _cssVariableMap(this as Record<string, string>);\n      },\n    });\n\n    return Object.assign(serializable, config);\n  }\n\n  static styles = [\n    cssReset,\n    cssResponsiveUtils,\n    css`\n      :host {\n        font-family: var(--beam-fontFamily);\n        font-style: var(--beam-fontStyle);\n        font-size: var(--beam-fontSize);\n        background-color: var(--beam-backgroundColor);\n        color: var(--beam-textColor);\n        max-width: var(--beam-ProductDetailsPage-maxWidth);\n        word-break: normal;\n        display: block;\n      }\n      .root {\n        padding-top: var(--beam-ProductDetailsPage-paddingTop);\n        padding-right: var(--beam-ProductDetailsPage-paddingRight);\n        padding-bottom: var(--beam-ProductDetailsPage-paddingBottom);\n        padding-left: var(--beam-ProductDetailsPage-paddingLeft);\n        width: 100%;\n        background-color: var(--beam-ProductDetailsPage-backgroundColor);\n        display: flex;\n        flex-direction: column;\n        ${useCustomBorder(\"--beam-ProductDetailsPage\")}\n      }\n      /* When iconDisplay is inline-center */\n      .inline-display {\n        display: flex;\n      }\n      /* When iconDisplay is block-center */\n      .block-display {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        justify-content: center;\n      }\n      .promo-container {\n        order: 2;\n        display: flex;\n        margin-top: var(--beam-ProductDetailsPage-promoPill-marginTop);\n        align-self: var(--beam-ProductDetailsPage-promoPill-alignSelf);\n      }\n      .content-inline {\n        order: 3;\n        display: flex;\n        align-items: center;\n      }\n      /* Info block for both inline and block layout */\n      .info-container {\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        text-align: var(--beam-ProductDetailsPage-InfoContainer-textAlign);\n        line-height: var(--beam-ProductDetailsPage-InfoContainer-lineHeight);\n        margin-top: var(--beam-ProductDetailsPage-InfoContainer-marginTop);\n        margin-left: var(--beam-ProductDetailsPage-InfoContainer-marginLeft);\n      }\n      .block-display .info-container {\n        order: 3;\n      }\n      .root.inline-display .icon-container,\n      .root.inline-display .info-container {\n        display: inline-flex;\n      }\n      .root.inline-display {\n        flex-direction: column;\n      }\n      .icon-container {\n        width: var(--beam-ProductDetailsPage-imageWidth);\n        height: var(--beam-ProductDetailsPage-imageHeight);\n        align-self: var(--beam-ProductDetailsPage-blockImage-alignSelf);\n        flex-shrink: 0;\n      }\n      .icon-container > img {\n        width: 100%;\n        height: 100%;\n        object-fit: contain;\n      }\n      .title {\n        ${useCustomText(\"--beam-ProductDetailsPage-title\")}\n      }\n      .title-block {\n        text-align: var(--beam-ProductDetailsPage-title-textAlign);\n        line-height: var(--beam-ProductDetailsPage-title-lineHeight);\n      }\n      .info-inline-promo {\n        margin-top: var(--beam-ProductDetailsPage-description-marginTop, 0px);\n      }\n      .description {\n        ${useCustomText(\"--beam-ProductDetailsPage-description\")}\n      }\n      .description-block {\n        text-align: var(--beam-ProductDetailsPage-description-textAlign);\n        line-height: var(--beam-ProductDetailsPage-description-lineHeight);\n        ${useCustomText(\"--beam-ProductDetailsPage-description\")}\n      }\n      .ppgf-disclosure-tooltip {\n        --max-width: 268px;\n      }\n      .ppgf-disclosure-tooltip::part(body) {\n        background-color: var(--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor);\n        padding-top: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingTop);\n        padding-right: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingRight);\n        padding-bottom: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingBottom);\n        padding-left: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingLeft);\n      }\n      .ppgf-disclosure-tooltip::part(base__arrow) {\n        background-color: var(--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor);\n      }\n      .ppgf-disclosure-tooltip-content {\n        display: flex;\n        flex-direction: column;\n        ${useCustomText(\"--beam-ProductDetailsPage-PPGFDisclosureTooltipContent\")}\n      }\n      .ppgf-disclosure-tooltip-copy > a,\n      .ppgf-disclosure-close {\n        pointer-events: auto;\n        color: var(--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color);\n      }\n      .ppgf-disclosure-close {\n        display: var(--beam-ProductDetailsPage-close-display);\n        padding: var(--beam-ProductDetailsPage-close-padding);\n        height: 12px;\n        background: none;\n        border: none;\n        margin-left: auto;\n      }\n      .ppgf-disclosure-tooltip-copy > a:visited {\n        color: var(--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color);\n      }\n      .ppgf-disclosure-tooltip-trigger {\n        position: relative;\n        vertical-align: text-bottom;\n      }\n      .ppgf-disclosure-tooltip-trigger-mask {\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        width: calc(var(--beam-ProductDetailsPage-TooltipIcon-width) + 20px);\n        height: calc(var(--beam-ProductDetailsPage-TooltipIcon-width) + 20px);\n      }\n      .ppgf-disclosure-tooltip-trigger > svg {\n        width: var(--beam-ProductDetailsPage-TooltipIcon-width);\n        color: var(--beam-ProductDetailsPage-TooltipIcon-color);\n        height: auto;\n        vertical-align: middle;\n      }\n    `,\n  ];\n}\n\ndefineCustomElement(BeamProductDetailsPage);\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"beam-product-details-page\": BeamProductDetailsPage;\n  }\n}\n"],"names":["defineCustomBorder","namespace","borderRadius","borderStyle","borderColor","borderWidth","prefix","useCustomBorder","unsafeCSS","_info","html","strings","x","k","s","p","n","e","o","r","IMAGE_URL_REMOTE_CONFIG_KEY","BeamProductDetailsPage","LitElement","DEFAULT_BASE_URL","createScopedLocalStorage","evt","promoCodesFromPlugin","c","enforceConfig","beamCartId","getBeamCartId","BEAM_CART_COOKIE_NAME","manualPromoCodes","formattedPromos","formatStoreAndReturnPromoCodes","code","shouldSendPromos","isEmptyPromoData","BeamWidgetStoredPromoCodesEvent","WIDGET_NAMES","res","postProductDetailsPage","makeApiKeyHeader","AsyncController","SUPPORTED_LANGUAGES","parseJsonStringArray","cart","getPromoCodesFromCart","response","setPromoCodesInLocalStorage","setPromoCodeInCookie","BeamPromoCodesStoredEvent","changedProperties","requireNewDataProps","prop","data","loading","iconDisplay","isNonZero","value","shouldDisplayPromoPill","isPromoActive","hasValidImageHeight","hasValidTitleFontSize","isPromoPillVisible","shouldShowPunctuation","_errorMessage","imageUrl","shouldDisplayColon","title","localizeUserString","description","onClickClose","tooltip","ppgfDisclosure","unsafeHTML","ppgfHyperlink","defaults","defineCustomText","promoPillLabelConfigDefaults","remoteConfig","config","_cssVariableMap","cssReset","cssResponsiveUtils","css","useCustomText","__decorateClass","property","state","defineCustomElement"],"mappings":"69BAEO,MAAMA,EAAqB,CAChCC,EAAY,GACZ,CAAE,aAAAC,EAAe,MAAO,YAAAC,EAAc,QAAS,YAAAC,EAAc,UAAW,YAAAC,EAAc,KAAM,EAAI,CAAA,IACrE,CAC3B,MAAMC,EAASL,EAAU,WAAW,SAAS,EAAIA,EAAY,UAAUA,CAAS,GAChF,MAAO,CACL,CAAC,GAAGK,CAAM,eAAe,EAAGJ,EAC5B,CAAC,GAAGI,CAAM,cAAc,EAAGH,EAC3B,CAAC,GAAGG,CAAM,cAAc,EAAGF,EAC3B,CAAC,GAAGE,CAAM,cAAc,EAAGD,CAC7B,CACF,EAEaE,EAAkB,CAC7BN,EAAY,GACZ,CAAE,aAAAC,EAAe,MAAO,YAAAC,EAAc,QAAS,YAAAC,EAAc,UAAW,YAAAC,EAAc,KAAM,EAAI,CAClF,IAAA,CACd,MAAMC,EAASL,EAAU,WAAW,SAAS,EAAIA,EAAY,UAAUA,CAAS,GAChF,OAAOO,EAAU,8BACUF,CAAM,kBAAkBJ,CAAY;AAAA,4BACrCI,CAAM,iBAAiBH,CAAW;AAAA,4BAClCG,CAAM,iBAAiBF,CAAW;AAAA,4BAClCE,CAAM,iBAAiBD,CAAW;AAAA,KACzD,CACL,ECxBaI,EAAQ,IAAMC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,QCFdC,EAAU,CACrB,GAAI,CACF,SAAU,IAAM,qBAChB,WAAY,IAAM,4FAClB,gBAAiB,IAAM,GACzB,EACA,GAAI,CACF,SAAU,IAAM,qCAChB,WAAY,IACV,8IACF,gBAAiB,IAAM,GACzB,EACA,GAAI,CACF,SAAU,IAAM,8BAChB,WAAY,IACV,uIACF,gBAAiB,IAAM,GACzB,EACA,GAAI,CACF,SAAU,IAAM,+BAChB,WAAY,IACV,sJACF,gBAAiB,IAAM,GACzB,EACA,GAAI,CACF,SAAU,IAAM,0BAChB,WAAY,IACV,2IACF,gBAAiB,IAAM,GACzB,EACA,GAAI,CACF,SAAU,IAAM,kCAChB,WAAY,IACV,6KACF,gBAAiB,IAAM,GACzB,CACF,ECpCA,IAAAC,EAAA,OAAA,eAAAC,EAAA,OAAA,yBAAAC,EAAA,CAAAC,EAAAC,EAAAC,EAAA,IAAA,CAAA,QAAAC,EAAA,EAAA,EAAA,OAAA,EAAAL,EAAAG,EAAAC,CAAA,EAAAD,EAAA,EAAAD,EAAA,OAAA,EAAAI,EAAA,GAAA,EAAA,KAAAA,EAAAJ,EAAA,CAAA,KAAAG,GAAA,EAAAC,EAAAH,EAAAC,EAAAC,CAAA,EAAAC,EAAAD,CAAA,IAAAA,GAAA,OAAA,GAAAA,GAAAN,EAAAI,EAAAC,EAAAC,CAAA,EAAAA,CAAA,EA2CA,MAAME,GAA8B,qCAE7B,MAAMC,UAA+BC,CAAW,CAAhD,aAAA,CAAA,MAAA,GAAA,SAAA,EAGsC,KAAO,QAAgBC,EAMtC,KAAO,KAAkB,KAExB,KAAO,YAAc,GAErB,KAAO,MAAQ,GAQ5C,KAAQ,aAAeC,EAAyB,IAAmC,EAE1E,KAAQ,iBAA6B,CAAC,EAU/C,KAAQ,uBAA0BC,GAAmC,CACnE,MAAMC,GAAwBD,EAAI,OAAO,YAAY,uBAAyB,CAC3E,GAAA,IAAKE,GAAMA,EAAE,YAAY,OAASA,EAAE,YAAY,KAAO,EAAE,EACzD,OACH,KAAK,iBAAmBD,CAC1B,EA0CA,KAA6B,2BAAA,SAAY,CAClCE,EAA8B,CAAC,SAAU,SAAS,EAAG,IAAI,EAC9D,MAAMC,EAAaC,EAAcC,EAAuB,CAAE,OAAQ,KAAK,MAAO,CAAC,EAEzEC,EAAmB,KAAK,oBAAoB,EAC5CC,EAAkBC,EACtBF,EAAiB,IAAKG,IAAU,CAAE,MAAOA,CAAK,EAAE,EAChD,KAAK,MACP,EACMC,EAAmBH,GAAmB,CAACI,EAAiBJ,CAAe,EAEzEG,GACF,KAAK,cACH,IAAIE,EAAgC,CAClC,OAAQC,EAAa,oBACvB,CAAC,CACH,EAEF,MAAMC,EAAM,MAAMC,EAAuB,CACvC,QAAS,KAAK,QACd,QAASC,EAAiB,KAAK,MAAM,EACrC,YAAa,CACX,QAAS,QACT,KAAM,KAAK,WACX,QAAS,KAAK,QACd,WAAYH,EAAa,qBACzB,YAAa,KAAK,YAClB,wBAAyB,KAAK,uBAChC,EACA,YAAa,CACX,GAAIH,GAAoB,CAAE,OAAQH,CAAgB,EAClD,WAAYJ,GAA0B,MACxC,CACF,CAAC,EACD,OAAK,KAAA,0BAA0BW,CAAG,EAC3BA,CACT,EAEA,KAAQ,iCAAmC,IAAIG,EAC7C,KACA,KAAK,0BACP,CAhGA,CAAA,IAAI,YAAa,CACf,OAAOC,EAAoB,KAAK,IAAI,GAAK,IAC3C,CAEA,IAAI,kBAA6B,CAC/B,OAAOC,EAAqB,KAAK,UAAU,CAC7C,CASQ,qBAAgC,CAEtC,GAAI,KAAK,kBAAoB,KAAK,iBAAiB,OAAS,EAC1D,OAAO,KAAK,iBAId,MAAMC,EAAO,KAAK,aAAa,YAAmC,MAAM,EACxE,OAAOA,EAAOC,EAAsBD,CAAI,EAAI,CAC9C,CAAA,CAEA,MAAc,0BAA0BE,EAAwC,CAC1EA,EAAS,QAAQ,sBACnB,MAAM,QAAQ,IAAI,CAChBC,EAA4B,CAC1B,OAAQ,KAAK,OACb,WAAY,CAAE,oBAAqBD,EAAS,OAAO,oBAAqB,sBAAuB,CAAA,CAAG,CACpG,CAAC,EACDE,EAAqB,CACnB,oBAAqBF,EAAS,OAAO,oBACrC,OAAQ,KAAK,MACf,CAAC,CACH,CAAC,EACD,KAAK,cACH,IAAIV,EAAgC,CAClC,OAAQC,EAAa,oBACvB,CAAC,CACH,EAEJ,CAEA,MAAM,cAAe,CACnB,OAAO,iBAAiBY,EAA0B,UAAW,KAAK,sBAAuC,CAC3G,CAEA,sBAAuB,CACrB,OAAO,oBAAoBA,EAA0B,UAAW,KAAK,sBAAuC,EAC5G,MAAM,sBACR,CA6CA,MAAM,QAAQC,EAAyC,CACrD,MAAMC,EAAsB,CAAC,UAAW,UAAW,OAAQ,SAAU,kBAAkB,EAClF,KAAK,iBACV,UAAWC,KAAQD,EACjB,GAAID,EAAkB,IAAIE,CAAI,EAAG,CAC/B,MAAM,KAAK,iCAAiC,KAAK,EACjD,KACF,CAEJ,CAEA,QAAS,CACP,KAAM,CAAE,KAAAC,EAAM,QAAAC,CAAQ,EAAI,KAAK,iCACzBC,EAAc,KAAK,aAAa,2CAA2C,EAC3EC,EAAaC,GAAkBA,IAAU,OAASA,IAAU,IAC5DC,EAAyB,KAAK,aAAa,kDAAkD,IAAM,OACnGC,EAAgB,CAAC,CAACN,GAAM,QAAQ,KAAK,MACrCO,EAAsBJ,EAAU,KAAK,aAAa,uCAAuC,CAAC,EAC1FK,EAAwBL,EAAU,KAAK,aAAa,0CAA0C,CAAC,EAC/FM,EACJJ,GACAC,GACAC,GACAC,EACIE,EAAwB,KAAK,aAAa,8CAA8C,IAAM,OACpG,OAAIT,EACK9C,IAEL6C,GAAQ,KACN,KAAK,MACAW,EAAc,CAAE,MAAO,IAAI,MAAM,SAAS,CAAE,CAAC,EAE/C,GAEFxD;AAAAA;AAAAA;AAAAA,YAGC,KAAK,aAAa,OAAO;AAAA;AAAA;AAAA,yBAGZ+C,IAAgB,eAAiB,gBAAkB,gBAAgB;AAAA,UAClFA,IAAgB,eACd/C;AAAAA,gBACI,KAAK,iBAAiB+C,CAAW,CAAC;AAAA,gBAClCO,EACEtD;AAAAA;AAAAA,qDAEmC6C,GAAM,QAAQ,KAAK,KAAK;AAAA;AAAA,oBAG3D7C,GAAM;AAAA,4CACoB,KAAK,cAAcsD,EAAoBC,EAAuBV,CAAI,CAAC;AAAA,cAEnG7C;AAAAA,gBACIsD,EACEtD;AAAAA;AAAAA,qDAEmC6C,GAAM,QAAQ,KAAK,KAAK;AAAA;AAAA,oBAG3D7C,GAAM;AAAA;AAAA,kBAEN,KAAK,iBAAiB+C,CAAW,CAAC;AAAA,8CACN,KAAK,cAAcO,EAAoBC,EAAuBV,CAAI,CAAC;AAAA;AAAA,aAEpG;AAAA;AAAA,KAGX,CAEA,iBAAiBE,EAAqB,CACpC,MAAMU,EAAW,KAAK,aAAa/C,EAA2B,EAE9D,OAAK+C,EAKEzD;AAAAA,iDAHgB+C,IAAgB,eACC,kBAAoB,EAGD;AAAA,mBAC5CU,CAAQ;AAAA;AAAA,MAPDzD,GAUxB,CAEA,cAAcsD,EAA6BI,EAA6Bb,EAAoC,CAC1G,MAAMc,EAAQC,EAAmB,KAAK,WAAYf,GAAM,QAAQ,KAAK,KAAK,GAAK5C,EAAQ,KAAK,UAAU,EAAE,SAClG4D,EAAAA,EACJD,EAAmB,KAAK,WAAYf,GAAM,QAAQ,KAAK,WAAW,GAAK5C,EAAQ,KAAK,UAAU,EAAE,aAClG,OAAOqD,EACHtD;AAAAA;AAAAA,kCAE0B2D,GAASD,EAAqBzD,EAAQ,KAAK,UAAU,EAAE,kBAAoB,GAAG;AAAA,yCACvE4D,CAAW,IAAI,KAAK,wBAAA,CAAyB;AAAA;AAAA,UAG9E7D;AAAAA;AAAAA,gCAEwB2D,CAAK;AAAA;AAAA;AAAA,yCAGIE,CAAW,IAAI,KAAK,wBAAA,CAAyB;AAAA;AAAA,SAGpF,CAEA,wBAAyB,CACvB,OAAO7D;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,YAST,CAGA,yBAA0B,CACxB,MAAM8D,EAAe,IAAM,CAEzB,MAAMC,EAAU,KAAK,WAAW,cAAc,0BAA0B,EACxEA,EAAQ,KAAO,EACjB,EACMC,EAAiB,KAAK,iCAAiC,MAAM,eACnE,OAAOA,EACHhE;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,wBAMgB8D,CAAY;AAAA;AAAA,gBAEpB,KAAK,wBAAwB;AAAA;AAAA;AAAA,gBAG7BG,EAAWD,EAAe,IAAI,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,cAKjCjE,GAAO;AAAA;AAAA,uBAGbC,GACN,CAEA,kCAAmC,CACjC,MAAMkE,EAAgB,KAAK,iCAAiC,MAAM,wBAClE,OAAOA,EACHlE,+CAAkDkE,EAAc,GAAG,qBAAqBA,EAAc,IAAI,OAC1GlE,GACN,CAGA,IAAW,cAAe,CACxB,MAAMmE,EAAW,CACf,uCAAwC,OACxC,wCAAyC,OACzC,qCAAsC,QACtC,uCAAwC,MACxC,yCAA0C,OAC1C,0CAA2C,MAC3C,wCAAyC,OACzC,qDAAsD,MACtD,oDAAqD,UACrD,qDAAsD,OACtD,oDAAqD,MACrD,4CAA6C,QAC7C,8CAA+C,OAC/C,8CAA+C,UAC/C,2DAA4D,UAC5D,sDAAuD,OACvD,wDAAyD,MACzD,yDAA0D,OAC1D,uDAAwD,MACxD,0DAA2D,UAC3D,GAAGC,EAAiB,kCAAmC,CACrD,SAAU,OACV,WAAY,MACd,CAAC,EACD,4CAA6C,OAC7C,GAAGA,EAAiB,wCAAyC,CAC3D,UAAW,MACX,SAAU,OACV,WAAY,MACd,CAAC,EACD,kDAAmD,OACnD,GAAGA,EAAiB,yDAA0D,CAC5E,SAAU,OACV,WAAY,OACZ,MAAO,SACT,CAAC,EACD,GAAG9E,EAAmB,2BAA2B,EACjD,0CAA2C,UAC3C,0CAA2C,IAC3C,4CAA6C,cAC7C,iDAAkD,SAClD,gDAAiD,MACjD,gDAAiD,OACjD,+CAAgD,OAChD,mDAAoD,OACpD,GAAG+E,CACL,EACMC,EAAe,KAAK,kCAAkC,MAAM,QAAQ,KAAK,OAAS,GAElFC,EAAS,CAAE,GAAGJ,EAAU,GAAGG,CAAa,EAQ9C,OAAO,OAAO,OANO,OAAO,OAAO,CACjC,OAAQ,CACN,OAAOE,EAAgB,IAA8B,CACvD,CACF,CAAC,EAEkCD,CAAM,CAC3C,CAwJF,CA5ea5D,EACJ,QAAU,4BADNA,EAsVJ,OAAS,CACd8D,EACAC,EACAC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,UAoBM9E,EAAgB,2BAA2B,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAwD5C+E,EAAc,iCAAiC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAUhDA,EAAc,uCAAuC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,UAKtDA,EAAc,uCAAuC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAkBtDA,EAAc,wDAAwD,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAqC/E,EAxekDC,EAAA,CAAjDC,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,CAAA,EAH9BnE,EAGuC,UAENkE,UAAAA,CAAAA,EAAAA,EAAA,CAA3CC,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAM,CAAC,CAL/B,EAAAnE,EAKiC,sBAEhBkE,EAAA,CAA3BC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EAPfnE,EAOiB,UAAA,UAAA,CAAA,EAEOkE,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CATf,EAAAnE,EASwB,oBAECkE,EAAA,CAAnCC,EAAS,CAAE,KAAM,OAAQ,CAAC,CAXhB,EAAAnE,EAWyB,2BAEAkE,EAAA,CAAnCC,EAAS,CAAE,KAAM,OAAQ,CAAC,CAbhB,EAAAnE,EAayB,qBAERkE,EAAA,CAA3BC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EAffnE,EAeiB,UAAA,0BAAA,CAAA,EAEOkE,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EAjBfnE,EAiBwB,UAEAkE,aAAAA,CAAAA,EAAAA,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EAnBfnE,EAmBwB,UAAA,SAAA,CAAA,EAIlBkE,EAAA,CAAhBE,EAvBU,CAAA,EAAApE,EAuBM,UAudnBqE,mBAAAA,CAAAA,EAAAA,EAAoBrE,CAAsB"}
+{"version":3,"file":"product-details-page.js","sources":["../../src/shared/fragments/custom-border.ts","../../src/shared/fragments/info.ts","../../src/components/product-details-page/strings.ts","../../src/components/product-details-page/index.ts"],"sourcesContent":["import { CSSResult, unsafeCSS } from \"lit\";\n\nexport const defineCustomBorder = (\n  namespace = \"\",\n  { borderRadius = \"0px\", borderStyle = \"unset\", borderColor = \"#000000\", borderWidth = \"1px\" } = {}\n): Record<string, string> => {\n  const prefix = namespace.startsWith(\"--beam-\") ? namespace : `--beam-${namespace}`;\n  return {\n    [`${prefix}-borderRadius`]: borderRadius,\n    [`${prefix}-borderStyle`]: borderStyle,\n    [`${prefix}-borderColor`]: borderColor,\n    [`${prefix}-borderWidth`]: borderWidth,\n  };\n};\n\nexport const useCustomBorder = (\n  namespace = \"\",\n  { borderRadius = \"0px\", borderStyle = \"unset\", borderColor = \"#000000\", borderWidth = \"1px\" } = {}\n): CSSResult => {\n  const prefix = namespace.startsWith(\"--beam-\") ? namespace : `--beam-${namespace}`;\n  return unsafeCSS(`\\\n        border-radius: var(${prefix}-borderRadius, ${borderRadius});\n        border-style: var(${prefix}-borderStyle, ${borderStyle});\n        border-color: var(${prefix}-borderColor, ${borderColor});\n        border-width: var(${prefix}-borderWidth, ${borderWidth});\n    `);\n};\n","import { html } from \"lit\";\n\nexport const _info = () => html` <svg\n  xmlns=\"http://www.w3.org/2000/svg\"\n  width=\"24\"\n  height=\"24\"\n  viewBox=\"0 0 24 24\"\n  fill=\"none\"\n  stroke=\"currentColor\"\n  stroke-width=\"2\"\n  stroke-linecap=\"round\"\n  stroke-linejoin=\"round\"\n  part=\"svg\"\n>\n  <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\n  <path d=\"M12 16v-4\"></path>\n  <path d=\"M12 8h.01\"></path>\n</svg>`;\n","export const strings = {\n  en: {\n    ctaTitle: () => `Choose your impact`,\n    ctaMessage: () => `At no extra cost, 1% of every order is donated to a nonprofit you choose. Powered by Beam`,\n    inlineSeparator: () => `:`,\n  },\n  fr: {\n    ctaTitle: () => `Choisissez l'impact de votre choix`,\n    ctaMessage: () =>\n      `Sans frais supplémentaires, 1% de chaque commande est reversé à l'organisation caritative de votre choix. Développé par Beam`,\n    inlineSeparator: () => `:`,\n  },\n  es: {\n    ctaTitle: () => `Elige el impacto que deseas`,\n    ctaMessage: () =>\n      `Sin coste adicional, el 1% de cada pedido se dona a la organización sin ánimo de lucro que tú elijas. Desarrollado por Beam`,\n    inlineSeparator: () => `:`,\n  },\n  de: {\n    ctaTitle: () => `Wählen Sie Ihren Einfluss`,\n    ctaMessage: () =>\n      `Ohne zusätzliche Kosten wird 1 % jeder Bestellung an eine von Ihnen gewählte gemeinnützige Organisation gespendet. Von Beam unterstützt`,\n    inlineSeparator: () => `:`,\n  },\n  it: {\n    ctaTitle: () => `Scegliete chi sostenere`,\n    ctaMessage: () =>\n      `L'1% di ogni vostro acquisto viene donato, senza alcun costo aggiuntivo, a un'organizzazione no-profit a libera scelta. Promosso da Beam`,\n    inlineSeparator: () => `:`,\n  },\n  pl: {\n    ctaTitle: () => `Masz wpływ, dokonaj wyboru`,\n    ctaMessage: () =>\n      `1% kwoty każdego zamówienia jest przekazywane na rzecz wybranej przez Ciebie organizacji non-profit – bez dodatkowych kosztów. Obsługiwane przez Beam`,\n    inlineSeparator: () => `:`,\n  },\n};\n","import { LitElement, css, html } from \"lit\";\nimport { property, state } from \"lit/decorators.js\";\nimport { unsafeHTML } from \"lit/directives/unsafe-html.js\";\nimport { AsyncController } from \"../../shared/controllers/async-controller\";\nimport { postProductDetailsPage } from \"../../api-sdk/v3/routes\";\nimport { DEFAULT_BASE_URL, SUPPORTED_LANGUAGES, WIDGET_NAMES } from \"../../api-sdk/constants\";\nimport { LANGUAGES, TUrl } from \"../../api-sdk/types\";\nimport { MissingConfig } from \"../../utils/beam-errors\";\nimport { enforceConfig } from \"../../shared/enforce-config\";\nimport { _cssVariableMap } from \"../../shared/fragments/css-variable-map\";\nimport { localizeUserString } from \"../../shared/localize\";\nimport { _errorMessage } from \"../../shared/fragments/error-message-template\";\nimport { cssResponsiveUtils } from \"../../shared/responsive\";\nimport { defineCustomElement } from \"../../shared/defineCustomElement\";\nimport { cssReset } from \"../../shared/css-reset\";\nimport { defineCustomText, useCustomText } from \"../../shared/fragments/custom-text\";\nimport { defineCustomBorder, useCustomBorder } from \"../../shared/fragments/custom-border\";\n// shoelace html tag imports\nimport \"@shoelace-style/shoelace/dist/components/tooltip/tooltip.js\";\nimport \"@shoelace-style/shoelace/dist/components/button/button.js\";\nimport { _info } from \"../../shared/fragments/info\";\nimport { promoPillLabelConfigDefaults } from \"../../shared/components/promo-pill-label\";\nimport {\n  getPromoCodesFromCart,\n  setPromoCodeInCookie,\n  parseJsonStringArray,\n  formatStoreAndReturnPromoCodes,\n  setPromoCodesInLocalStorage,\n  isEmptyPromoData,\n} from \"../../utils/promoManager\";\nimport \"../../shared/components/promo-pill-label\";\nimport { BEAM_CART_COOKIE_NAME, TBeamCartLocalStorage } from \"../../shared/cart-contents\";\nimport { createScopedLocalStorage } from \"../../utils/local-storage\";\nimport { makeApiKeyHeader } from \"../../utils/makeApiKeyHeader\";\nimport { BeamPromoCodesStoredEvent, BeamWidgetStoredPromoCodesEvent } from \"../../utils/events\";\nimport { getBeamCartId } from \"../../utils/cart\";\nimport { strings } from \"./strings\";\n\ntype RequiredConfig = {\n  apiKey: string;\n  storeId: number;\n};\ntype IAPIV3PostProductDetailsPage = Awaited<ReturnType<typeof postProductDetailsPage>>;\n\nconst IMAGE_URL_REMOTE_CONFIG_KEY = \"--beam-ProductDetailsPage-imageUrl\";\n\nexport class BeamProductDetailsPage extends LitElement {\n  static tagName = \"beam-product-details-page\";\n\n  @property({ type: String, reflect: true }) public baseUrl: TUrl = DEFAULT_BASE_URL;\n\n  @property({ type: String, reflect: false }) apiKey?: RequiredConfig[\"apiKey\"];\n\n  @property({ type: Number }) storeId?: number;\n\n  @property({ type: String }) public lang: LANGUAGES = \"en\";\n\n  @property({ type: Boolean }) public draftConfig = false;\n\n  @property({ type: Boolean }) public debug = false;\n\n  @property({ type: String }) remoteProductIdentifier?: string;\n\n  @property({ type: String }) public promoCodes?: string;\n\n  @property({ type: String }) public domain?: string;\n\n  private localStorage = createScopedLocalStorage(this as LitElement & RequiredConfig);\n\n  @state() private pluginPromoCodes: string[] = [];\n\n  get configLang() {\n    return SUPPORTED_LANGUAGES[this.lang] || \"en\";\n  }\n\n  get parsedPromoCodes(): string[] {\n    return parseJsonStringArray(this.promoCodes);\n  }\n\n  private handlePromoCodesStored = (evt: BeamPromoCodesStoredEvent) => {\n    const promoCodesFromPlugin = (evt.detail.promoCodes?.unvalidatedPromoCodes ?? [])\n      .map((c) => c.attributes?.value ?? c.attributes?.url ?? \"\")\n      .sort();\n    this.pluginPromoCodes = promoCodesFromPlugin;\n  };\n\n  private getManualPromoCodes(): string[] {\n    // Priority 1: Widget passed discount codes\n    if (this.parsedPromoCodes && this.parsedPromoCodes.length > 0) {\n      return this.parsedPromoCodes;\n    }\n\n    // Priority 2: Cart fallback\n    const cart = this.localStorage.getItemJson<TBeamCartLocalStorage>(\"cart\");\n    return cart ? getPromoCodesFromCart(cart) : [];\n  }\n\n  private async handleValidatedPromoCodes(response: IAPIV3PostProductDetailsPage) {\n    if (response.promos?.validatedPromoCodes) {\n      await Promise.all([\n        setPromoCodesInLocalStorage({\n          apiKey: this.apiKey,\n          promoCodes: { validatedPromoCodes: response.promos.validatedPromoCodes, unvalidatedPromoCodes: [] },\n        }),\n        setPromoCodeInCookie({\n          validatedPromoCodes: response.promos.validatedPromoCodes,\n          domain: this.domain,\n        }),\n      ]);\n      this.dispatchEvent(\n        new BeamWidgetStoredPromoCodesEvent({\n          source: WIDGET_NAMES.product_details_page,\n        })\n      );\n    }\n  }\n\n  async firstUpdated() {\n    window.addEventListener(BeamPromoCodesStoredEvent.eventName, this.handlePromoCodesStored as EventListener);\n  }\n\n  disconnectedCallback() {\n    window.removeEventListener(BeamPromoCodesStoredEvent.eventName, this.handlePromoCodesStored as EventListener);\n    super.disconnectedCallback();\n  }\n\n  postProductDetailsPageData = async () => {\n    if (!enforceConfig<RequiredConfig>([\"apiKey\", \"storeId\"], this)) throw new MissingConfig();\n    const beamCartId = getBeamCartId(BEAM_CART_COOKIE_NAME, { apiKey: this.apiKey });\n\n    const manualPromoCodes = this.getManualPromoCodes();\n    const formattedPromos = formatStoreAndReturnPromoCodes(\n      manualPromoCodes.map((code) => ({ value: code })),\n      this.apiKey\n    );\n    const shouldSendPromos = formattedPromos && !isEmptyPromoData(formattedPromos);\n\n    if (shouldSendPromos) {\n      this.dispatchEvent(\n        new BeamWidgetStoredPromoCodesEvent({\n          source: WIDGET_NAMES.product_details_page,\n        })\n      );\n    }\n    const res = await postProductDetailsPage({\n      baseUrl: this.baseUrl,\n      headers: makeApiKeyHeader(this.apiKey),\n      queryParams: {\n        version: \"1.0.0\",\n        lang: this.configLang,\n        storeId: this.storeId,\n        widgetName: WIDGET_NAMES.product_details_page,\n        draftConfig: this.draftConfig,\n        remoteProductIdentifier: this.remoteProductIdentifier,\n      },\n      requestBody: {\n        ...(shouldSendPromos && { promos: formattedPromos }),\n        beamCartId: beamCartId ? beamCartId : undefined,\n      },\n    });\n    this.handleValidatedPromoCodes(res);\n    return res;\n  };\n\n  private productDetailsPageDataController = new AsyncController<typeof this.postProductDetailsPageData>(\n    this,\n    this.postProductDetailsPageData\n  );\n\n  async updated(changedProperties: Map<string, unknown>) {\n    const requireNewDataProps = [\"storeId\", \"baseUrl\", \"lang\", \"apiKey\", \"pluginPromoCodes\"];\n    void this.pluginPromoCodes;\n    for (const prop of requireNewDataProps) {\n      if (changedProperties.has(prop)) {\n        await this.productDetailsPageDataController.exec();\n        break;\n      }\n    }\n  }\n\n  render() {\n    const { data, loading } = this.productDetailsPageDataController;\n    const iconDisplay = this.cssVariables[\"--beam-ProductDetailsPage-image-placement\"];\n    const isNonZero = (value: string) => value !== \"0px\" && value !== \"0\";\n    const shouldDisplayPromoPill = this.cssVariables[\"--beam-ProductDetailsPage-shouldDisplayPromoPill\"] === \"true\";\n    const isPromoActive = !!data?.config?.web?.promo;\n    const hasValidImageHeight = isNonZero(this.cssVariables[\"--beam-ProductDetailsPage-imageHeight\"]);\n    const hasValidTitleFontSize = isNonZero(this.cssVariables[\"--beam-ProductDetailsPage-title-fontSize\"]);\n    const isPromoPillVisible =\n      shouldDisplayPromoPill && // Determines if the promo pill is enabled for the marketing version of the PDP\n      isPromoActive && // Is promo currently active\n      hasValidImageHeight && // Ensures the promo pill is not displayed for the subtext version of the PDP\n      hasValidTitleFontSize; // Ensures the promo pill is not displayed for the subtext version of the PDP\n    const shouldShowPunctuation = this.cssVariables[\"--beam-ProductDetailsPage-shouldDisplayColon\"] === \"true\"; // Determines if a colon should be displayed in promo display\n    if (loading) {\n      return html``;\n    }\n    if (data == null) {\n      if (this.debug) {\n        return _errorMessage({ error: new Error(\"No data\") });\n      }\n      return \"\";\n    }\n    return html`\n      <style>\n        :host {\n          ${this.cssVariables.toCSS()}\n        }\n      </style>\n      <div\n        class=\"root ${iconDisplay === \"block-center\" ? \"block-display\" : \"inline-display\"}\"\n        aria-label=\"product detail page Beam component\"\n      >\n        ${iconDisplay === \"block-center\"\n          ? html`\n              ${this.renderWidgetIcon(iconDisplay)}\n              ${isPromoPillVisible\n                ? html`\n                    <div class=\"promo-container\">\n                      <beam-promo-info-pill .promo=${data?.config?.web?.promo}></beam-promo-info-pill>\n                    </div>\n                  `\n                : html``}\n              <div class=\"info-container\">${this.renderContent(isPromoPillVisible, shouldShowPunctuation, data)}</div>\n            `\n          : html`\n              ${isPromoPillVisible\n                ? html`\n                    <div class=\"promo-container\">\n                      <beam-promo-info-pill .promo=${data?.config?.web?.promo}></beam-promo-info-pill>\n                    </div>\n                  `\n                : html``}\n              <div class=\"content-inline\">\n                ${this.renderWidgetIcon(iconDisplay)}\n                <div class=\"info-container\">${this.renderContent(isPromoPillVisible, shouldShowPunctuation, data)}</div>\n              </div>\n            `}\n      </div>\n    `;\n  }\n\n  renderWidgetIcon(iconDisplay: string) {\n    const imageUrl = this.cssVariables[IMAGE_URL_REMOTE_CONFIG_KEY];\n\n    if (!imageUrl) return html``;\n\n    const isBlockDisplay = iconDisplay === \"block-center\";\n    const containerStyle = isBlockDisplay ? 'style=\"order:1\"' : \"\";\n\n    return html`\n      <span class=\"icon-container\" part=\"icon\" ${containerStyle}>\n        <img src=${imageUrl} part=\"icon\" aria-hidden=\"true\" />\n      </span>\n    `;\n  }\n\n  renderContent(isPromoPillVisible: boolean, shouldDisplayColon: boolean, data: IAPIV3PostProductDetailsPage) {\n    const title = localizeUserString(this.configLang, data?.config?.web?.title) || strings[this.configLang].ctaTitle();\n    const description =\n      localizeUserString(this.configLang, data?.config?.web?.description) || strings[this.configLang].ctaMessage();\n    return isPromoPillVisible\n      ? html`\n          <div class=\"info-inline-promo\">\n            <span class=\"title\">${title + (shouldDisplayColon ? strings[this.configLang].inlineSeparator() : \"\")}</span>\n            <span class=\"description\"> ${description} ${this.renderDisclosureTooltip()} </span>\n          </div>\n        `\n      : html`\n          <div class=\"title-block\">\n            <h3 class=\"title\">${title}</h3>\n          </div>\n          <div class=\"description-block\">\n            <span class=\"description\"> ${description} ${this.renderDisclosureTooltip()} </span>\n          </div>\n        `;\n  }\n\n  renderCloseTooltipIcon() {\n    return html`<svg width=\"11\" height=\"11\" viewBox=\"0 0 11 11\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        d=\"M5.40836 5.40811L1.48828 1.48804M5.40836 5.40811L9.32843 9.32819M5.40836 5.40811L9.32843 1.48804M5.40836 5.40811L1.48828 9.32819\"\n        stroke=\"white\"\n        stroke-width=\"1.56803\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n      />\n    </svg> `;\n  }\n\n  /* PayPal Giving Fund Disclosure */\n  renderDisclosureTooltip() {\n    const onClickClose = () => {\n      // due to being strictly html, we need to assume any when overriding shoelace properties\n      const tooltip = this.renderRoot.querySelector(\".ppgf-disclosure-tooltip\") as any;\n      if (tooltip?.open) {\n        tooltip.open = false;\n      }\n    };\n    const ppgfDisclosure = this.productDetailsPageDataController.data?.ppgfDisclosure;\n    return ppgfDisclosure\n      ? html`<sl-tooltip class=\"ppgf-disclosure-tooltip\" part=\"tooltip\">\n          <div class=\"ppgf-disclosure-tooltip-content\" slot=\"content\" part=\"tooltip-content\">\n            <button\n              class=\"ppgf-disclosure-close\"\n              aria-label=\"Close tooltip\"\n              part=\"tooltip-close-button\"\n              @click=\"${onClickClose}\"\n            >\n              ${this.renderCloseTooltipIcon()}\n            </button>\n            <div class=\"ppgf-disclosure-tooltip-copy\" part=\"tooltip-disclosure-copy\">\n              ${unsafeHTML(ppgfDisclosure.copy)}\n            </div>\n          </div>\n          <span class=\"ppgf-disclosure-tooltip-trigger\" part=\"tooltip-disclosure-icon\">\n            <div class=\"ppgf-disclosure-tooltip-trigger-mask d-lg-none\"></div>\n            <sl-button\n              variant=\"text\"\n              size=\"small\"\n              class=\"ppgf-disclosure-tooltip-trigger\"\n              part=\"tooltip-disclosure-button\"\n              aria-label=\"More information\"\n              tabindex=\"0\"\n              circle\n            >\n              ${_info()}\n            </sl-button>\n          </span>\n        </sl-tooltip>`\n      : html``;\n  }\n  /* End PayPal Giving Fund Disclosure */\n\n  public get cssVariables() {\n    const defaults = {\n      \"--beam-ProductDetailsPage-imageWidth\": \"24px\",\n      \"--beam-ProductDetailsPage-imageHeight\": \"24px\",\n      \"--beam-ProductDetailsPage-maxWidth\": \"346px\",\n      \"--beam-ProductDetailsPage-paddingTop\": \"8px\",\n      \"--beam-ProductDetailsPage-paddingRight\": \"12px\",\n      \"--beam-ProductDetailsPage-paddingBottom\": \"8px\",\n      \"--beam-ProductDetailsPage-paddingLeft\": \"15px\",\n      \"--beam-ProductDetailsPage-InfoContainer-marginLeft\": \"8px\",\n      \"--beam-ProductDetailsPage-InfoContainer-textAlign\": \"inherit\",\n      \"--beam-ProductDetailsPage-InfoContainer-lineHeight\": \"15px\",\n      \"--beam-ProductDetailsPage-InfoContainer-marginTop\": \"4px\",\n      \"--beam-ProductDetailsPage-backgroundColor\": \"unset\",\n      \"--beam-ProductDetailsPage-TooltipIcon-width\": \"10px\",\n      \"--beam-ProductDetailsPage-TooltipIcon-color\": \"inherit\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor\": \"#000000\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingTop\": \"10px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingRight\": \"8px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingBottom\": \"10px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingLeft\": \"8px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color\": \"#5CA3FF\",\n      ...defineCustomText(\"--beam-ProductDetailsPage-title\", {\n        fontSize: \"12px\",\n        fontWeight: \"bold\",\n      }),\n      \"--beam-ProductDetailsPage-title-textAlign\": \"left\",\n      ...defineCustomText(\"--beam-ProductDetailsPage-description\", {\n        marginTop: \"0px\",\n        fontSize: \"12px\",\n        lineHeight: \"15px\",\n      }),\n      \"--beam-ProductDetailsPage-description-textAlign\": \"left\",\n      ...defineCustomText(\"--beam-ProductDetailsPage-PPGFDisclosureTooltipContent\", {\n        fontSize: \"12px\",\n        lineHeight: \"16px\",\n        color: \"#FFFFFF\",\n      }),\n      ...defineCustomBorder(\"--beam-ProductDetailsPage\"),\n      \"--beam-ProductDetailsPage-close-display\": \"initial\",\n      \"--beam-ProductDetailsPage-close-padding\": \"0\",\n      \"--beam-ProductDetailsPage-image-placement\": \"inline-left\", // options: \"inline-left\" || \"block-center\"\n      \"--beam-ProductDetailsPage-blockImage-alignSelf\": \"center\",\n      \"--beam-ProductDetailsPage-promoPill-marginTop\": \"4px\",\n      \"--beam-ProductDetailsPage-promoPill-alignSelf\": \"left\",\n      \"--beam-ProductDetailsPage-shouldDisplayColon\": \"true\",\n      \"--beam-ProductDetailsPage-shouldDisplayPromoPill\": \"true\",\n      ...promoPillLabelConfigDefaults,\n    };\n    const remoteConfig = this.productDetailsPageDataController?.data?.config?.web?.theme || {};\n\n    const config = { ...defaults, ...remoteConfig };\n\n    const serializable = Object.create({\n      toCSS() {\n        return _cssVariableMap(this as Record<string, string>);\n      },\n    });\n\n    return Object.assign(serializable, config);\n  }\n\n  static styles = [\n    cssReset,\n    cssResponsiveUtils,\n    css`\n      :host {\n        font-family: var(--beam-fontFamily);\n        font-style: var(--beam-fontStyle);\n        font-size: var(--beam-fontSize);\n        background-color: var(--beam-backgroundColor);\n        color: var(--beam-textColor);\n        max-width: var(--beam-ProductDetailsPage-maxWidth);\n        word-break: normal;\n        display: block;\n      }\n      .root {\n        padding-top: var(--beam-ProductDetailsPage-paddingTop);\n        padding-right: var(--beam-ProductDetailsPage-paddingRight);\n        padding-bottom: var(--beam-ProductDetailsPage-paddingBottom);\n        padding-left: var(--beam-ProductDetailsPage-paddingLeft);\n        width: 100%;\n        background-color: var(--beam-ProductDetailsPage-backgroundColor);\n        display: flex;\n        flex-direction: column;\n        ${useCustomBorder(\"--beam-ProductDetailsPage\")}\n      }\n      /* When iconDisplay is inline-center */\n      .inline-display {\n        display: flex;\n      }\n      /* When iconDisplay is block-center */\n      .block-display {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        justify-content: center;\n      }\n      .promo-container {\n        order: 2;\n        display: flex;\n        margin-top: var(--beam-ProductDetailsPage-promoPill-marginTop);\n        align-self: var(--beam-ProductDetailsPage-promoPill-alignSelf);\n      }\n      .content-inline {\n        order: 3;\n        display: flex;\n        align-items: center;\n      }\n      /* Info block for both inline and block layout */\n      .info-container {\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        text-align: var(--beam-ProductDetailsPage-InfoContainer-textAlign);\n        line-height: var(--beam-ProductDetailsPage-InfoContainer-lineHeight);\n        margin-top: var(--beam-ProductDetailsPage-InfoContainer-marginTop);\n        margin-left: var(--beam-ProductDetailsPage-InfoContainer-marginLeft);\n      }\n      .block-display .info-container {\n        order: 3;\n      }\n      .root.inline-display .icon-container,\n      .root.inline-display .info-container {\n        display: inline-flex;\n      }\n      .root.inline-display {\n        flex-direction: column;\n      }\n      .icon-container {\n        width: var(--beam-ProductDetailsPage-imageWidth);\n        height: var(--beam-ProductDetailsPage-imageHeight);\n        align-self: var(--beam-ProductDetailsPage-blockImage-alignSelf);\n        flex-shrink: 0;\n      }\n      .icon-container > img {\n        width: 100%;\n        height: 100%;\n        object-fit: contain;\n      }\n      .title {\n        ${useCustomText(\"--beam-ProductDetailsPage-title\")}\n      }\n      .title-block {\n        text-align: var(--beam-ProductDetailsPage-title-textAlign);\n        line-height: var(--beam-ProductDetailsPage-title-lineHeight);\n      }\n      .info-inline-promo {\n        margin-top: var(--beam-ProductDetailsPage-description-marginTop, 0px);\n      }\n      .description {\n        ${useCustomText(\"--beam-ProductDetailsPage-description\")}\n      }\n      .description-block {\n        text-align: var(--beam-ProductDetailsPage-description-textAlign);\n        line-height: var(--beam-ProductDetailsPage-description-lineHeight);\n        ${useCustomText(\"--beam-ProductDetailsPage-description\")}\n      }\n      .ppgf-disclosure-tooltip {\n        --max-width: 268px;\n      }\n      .ppgf-disclosure-tooltip::part(body) {\n        background-color: var(--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor);\n        padding-top: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingTop);\n        padding-right: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingRight);\n        padding-bottom: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingBottom);\n        padding-left: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingLeft);\n      }\n      .ppgf-disclosure-tooltip::part(base__arrow) {\n        background-color: var(--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor);\n      }\n      .ppgf-disclosure-tooltip-content {\n        display: flex;\n        flex-direction: column;\n        ${useCustomText(\"--beam-ProductDetailsPage-PPGFDisclosureTooltipContent\")}\n      }\n      .ppgf-disclosure-tooltip-copy > a,\n      .ppgf-disclosure-close {\n        pointer-events: auto;\n        color: var(--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color);\n      }\n      .ppgf-disclosure-close {\n        display: var(--beam-ProductDetailsPage-close-display);\n        padding: var(--beam-ProductDetailsPage-close-padding);\n        height: 12px;\n        background: none;\n        border: none;\n        margin-left: auto;\n      }\n      .ppgf-disclosure-tooltip-copy > a:visited {\n        color: var(--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color);\n      }\n      .ppgf-disclosure-tooltip-trigger {\n        position: relative;\n      }\n      .ppgf-disclosure-tooltip-trigger-mask {\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        width: calc(var(--beam-ProductDetailsPage-TooltipIcon-width) + 20px);\n        height: calc(var(--beam-ProductDetailsPage-TooltipIcon-width) + 20px);\n      }\n      .ppgf-disclosure-tooltip-trigger > svg {\n        width: var(--beam-ProductDetailsPage-TooltipIcon-width);\n        color: var(--beam-ProductDetailsPage-TooltipIcon-color);\n        height: auto;\n      }\n    `,\n  ];\n}\n\ndefineCustomElement(BeamProductDetailsPage);\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"beam-product-details-page\": BeamProductDetailsPage;\n  }\n}\n"],"names":["defineCustomBorder","namespace","borderRadius","borderStyle","borderColor","borderWidth","prefix","useCustomBorder","unsafeCSS","_info","html","strings","x","s","p","n","e","o","r","IMAGE_URL_REMOTE_CONFIG_KEY","BeamProductDetailsPage","LitElement","DEFAULT_BASE_URL","createScopedLocalStorage","evt","promoCodesFromPlugin","c","enforceConfig","beamCartId","getBeamCartId","BEAM_CART_COOKIE_NAME","manualPromoCodes","formattedPromos","formatStoreAndReturnPromoCodes","code","shouldSendPromos","isEmptyPromoData","BeamWidgetStoredPromoCodesEvent","WIDGET_NAMES","res","postProductDetailsPage","makeApiKeyHeader","AsyncController","SUPPORTED_LANGUAGES","parseJsonStringArray","cart","getPromoCodesFromCart","response","setPromoCodesInLocalStorage","setPromoCodeInCookie","BeamPromoCodesStoredEvent","changedProperties","requireNewDataProps","prop","data","loading","iconDisplay","isNonZero","value","shouldDisplayPromoPill","isPromoActive","hasValidImageHeight","hasValidTitleFontSize","isPromoPillVisible","shouldShowPunctuation","_errorMessage","imageUrl","shouldDisplayColon","title","localizeUserString","description","onClickClose","tooltip","ppgfDisclosure","unsafeHTML","defaults","defineCustomText","promoPillLabelConfigDefaults","remoteConfig","config","_cssVariableMap","cssReset","cssResponsiveUtils","css","useCustomText","__decorateClass","property","state","defineCustomElement"],"mappings":"69BAEO,MAAMA,EAAqB,CAChCC,EAAY,GACZ,CAAE,aAAAC,EAAe,MAAO,YAAAC,EAAc,QAAS,YAAAC,EAAc,UAAW,YAAAC,EAAc,KAAM,EAAI,CAAA,IACrE,CAC3B,MAAMC,EAASL,EAAU,WAAW,SAAS,EAAIA,EAAY,UAAUA,CAAS,GAChF,MAAO,CACL,CAAC,GAAGK,CAAM,eAAe,EAAGJ,EAC5B,CAAC,GAAGI,CAAM,cAAc,EAAGH,EAC3B,CAAC,GAAGG,CAAM,cAAc,EAAGF,EAC3B,CAAC,GAAGE,CAAM,cAAc,EAAGD,CAC7B,CACF,EAEaE,EAAkB,CAC7BN,EAAY,GACZ,CAAE,aAAAC,EAAe,MAAO,YAAAC,EAAc,QAAS,YAAAC,EAAc,UAAW,YAAAC,EAAc,KAAM,EAAI,CAClF,IAAA,CACd,MAAMC,EAASL,EAAU,WAAW,SAAS,EAAIA,EAAY,UAAUA,CAAS,GAChF,OAAOO,EAAU,8BACUF,CAAM,kBAAkBJ,CAAY;AAAA,4BACrCI,CAAM,iBAAiBH,CAAW;AAAA,4BAClCG,CAAM,iBAAiBF,CAAW;AAAA,4BAClCE,CAAM,iBAAiBD,CAAW;AAAA,KACzD,CACL,ECxBaI,EAAQ,IAAMC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,QCFdC,EAAU,CACrB,GAAI,CACF,SAAU,IAAM,qBAChB,WAAY,IAAM,4FAClB,gBAAiB,IAAM,GACzB,EACA,GAAI,CACF,SAAU,IAAM,qCAChB,WAAY,IACV,8IACF,gBAAiB,IAAM,GACzB,EACA,GAAI,CACF,SAAU,IAAM,8BAChB,WAAY,IACV,uIACF,gBAAiB,IAAM,GACzB,EACA,GAAI,CACF,SAAU,IAAM,+BAChB,WAAY,IACV,sJACF,gBAAiB,IAAM,GACzB,EACA,GAAI,CACF,SAAU,IAAM,0BAChB,WAAY,IACV,2IACF,gBAAiB,IAAM,GACzB,EACA,GAAI,CACF,SAAU,IAAM,kCAChB,WAAY,IACV,6KACF,gBAAiB,IAAM,GACzB,CACF,ECpCA,IAAAC,EAAA,OAAA,eAAAC,EAAA,CAAAC,EAAAC,EAAAC,EAAA,IAAA,CAAA,QAAAC,EAAA,OAAA,EAAAH,EAAA,OAAA,EAAAI,EAAA,GAAA,EAAA,KAAAA,EAAAJ,EAAA,CAAA,KAAAG,EAAAC,EAAAH,EAAAC,EAAAC,CAAA,GAAAA,GAAA,OAAAA,GAAAL,EAAAG,EAAAC,EAAAC,CAAA,EAAAA,CAAA,EA4CA,MAAME,EAA8B,qCAEvB,MAAAC,UAA+BC,CAAW,CAAhD,aAGsC,CAAA,MAAA,GAAA,SAAA,EAAA,KAAO,QAAgBC,EAMtC,KAAO,KAAkB,KAExB,KAAO,YAAc,GAErB,KAAO,MAAQ,GAQ5C,KAAQ,aAAeC,EAAyB,IAAmC,EAE1E,KAAQ,iBAA6B,GAU9C,KAAQ,uBAA0BC,GAAmC,CACnE,MAAMC,GAAwBD,EAAI,OAAO,YAAY,uBAAyB,IAC3E,IAAKE,GAAMA,EAAE,YAAY,OAASA,EAAE,YAAY,KAAO,EAAE,EACzD,KACH,EAAA,KAAK,iBAAmBD,CAC1B,EA0CA,KAAA,2BAA6B,SAAY,CAClCE,EAA8B,CAAC,SAAU,SAAS,EAAG,IAAI,EAC9D,MAAMC,EAAaC,EAAcC,EAAuB,CAAE,OAAQ,KAAK,MAAO,CAAC,EAEzEC,EAAmB,KAAK,oBAAA,EACxBC,EAAkBC,EACtBF,EAAiB,IAAKG,IAAU,CAAE,MAAOA,CAAK,EAAE,EAChD,KAAK,MACP,EACMC,EAAmBH,GAAmB,CAACI,EAAiBJ,CAAe,EAEzEG,GACF,KAAK,cACH,IAAIE,EAAgC,CAClC,OAAQC,EAAa,oBACvB,CAAC,CACH,EAEF,MAAMC,EAAM,MAAMC,EAAuB,CACvC,QAAS,KAAK,QACd,QAASC,EAAiB,KAAK,MAAM,EACrC,YAAa,CACX,QAAS,QACT,KAAM,KAAK,WACX,QAAS,KAAK,QACd,WAAYH,EAAa,qBACzB,YAAa,KAAK,YAClB,wBAAyB,KAAK,uBAChC,EACA,YAAa,CACX,GAAIH,GAAoB,CAAE,OAAQH,CAAgB,EAClD,WAAYJ,GAA0B,MACxC,CACF,CAAC,EACD,OAAK,KAAA,0BAA0BW,CAAG,EAC3BA,CACT,EAEA,KAAQ,iCAAmC,IAAIG,EAC7C,KACA,KAAK,0BACP,CAhGA,CAAA,IAAI,YAAa,CACf,OAAOC,EAAoB,KAAK,IAAI,GAAK,IAC3C,CAEA,IAAI,kBAA6B,CAC/B,OAAOC,EAAqB,KAAK,UAAU,CAC7C,CASQ,qBAAgC,CAEtC,GAAI,KAAK,kBAAoB,KAAK,iBAAiB,OAAS,EAC1D,OAAO,KAAK,iBAId,MAAMC,EAAO,KAAK,aAAa,YAAmC,MAAM,EACxE,OAAOA,EAAOC,EAAsBD,CAAI,EAAI,EAC9C,CAEA,MAAc,0BAA0BE,EAAwC,CAC1EA,EAAS,QAAQ,sBACnB,MAAM,QAAQ,IAAI,CAChBC,EAA4B,CAC1B,OAAQ,KAAK,OACb,WAAY,CAAE,oBAAqBD,EAAS,OAAO,oBAAqB,sBAAuB,EAAG,CACpG,CAAC,EACDE,EAAqB,CACnB,oBAAqBF,EAAS,OAAO,oBACrC,OAAQ,KAAK,MACf,CAAC,CACH,CAAC,EACD,KAAK,cACH,IAAIV,EAAgC,CAClC,OAAQC,EAAa,oBACvB,CAAC,CACH,EAEJ,CAEA,MAAM,cAAe,CACnB,OAAO,iBAAiBY,EAA0B,UAAW,KAAK,sBAAuC,CAC3G,CAEA,sBAAuB,CACrB,OAAO,oBAAoBA,EAA0B,UAAW,KAAK,sBAAuC,EAC5G,MAAM,qBACR,CAAA,CA6CA,MAAM,QAAQC,EAAyC,CACrD,MAAMC,EAAsB,CAAC,UAAW,UAAW,OAAQ,SAAU,kBAAkB,EAClF,KAAK,iBACV,UAAWC,KAAQD,EACjB,GAAID,EAAkB,IAAIE,CAAI,EAAG,CAC/B,MAAM,KAAK,iCAAiC,KAAK,EACjD,KACF,CAEJ,CAEA,QAAS,CACP,KAAM,CAAE,KAAAC,EAAM,QAAAC,CAAQ,EAAI,KAAK,iCACzBC,EAAc,KAAK,aAAa,2CAA2C,EAC3EC,EAAaC,GAAkBA,IAAU,OAASA,IAAU,IAC5DC,EAAyB,KAAK,aAAa,kDAAkD,IAAM,OACnGC,EAAgB,CAAC,CAACN,GAAM,QAAQ,KAAK,MACrCO,EAAsBJ,EAAU,KAAK,aAAa,uCAAuC,CAAC,EAC1FK,EAAwBL,EAAU,KAAK,aAAa,0CAA0C,CAAC,EAC/FM,EACJJ,GACAC,GACAC,GACAC,EACIE,EAAwB,KAAK,aAAa,8CAA8C,IAAM,OACpG,OAAIT,EACK7C,IAEL4C,GAAQ,KACN,KAAK,MACAW,EAAc,CAAE,MAAO,IAAI,MAAM,SAAS,CAAE,CAAC,EAE/C,GAEFvD;AAAAA;AAAAA;AAAAA,YAGC,KAAK,aAAa,MAAO,CAAA;AAAA;AAAA;AAAA;AAAA,sBAIf8C,IAAgB,eAAiB,gBAAkB,gBAAgB;AAAA;AAAA;AAAA,UAG/EA,IAAgB,eACd9C;AAAAA,gBACI,KAAK,iBAAiB8C,CAAW,CAAC;AAAA,gBAClCO,EACErD;AAAAA;AAAAA,qDAEmC4C,GAAM,QAAQ,KAAK,KAAK;AAAA;AAAA,oBAG3D5C,GAAM;AAAA,4CACoB,KAAK,cAAcqD,EAAoBC,EAAuBV,CAAI,CAAC;AAAA,cAEnG5C;AAAAA,gBACIqD,EACErD;AAAAA;AAAAA,qDAEmC4C,GAAM,QAAQ,KAAK,KAAK;AAAA;AAAA,oBAG3D5C,GAAM;AAAA;AAAA,kBAEN,KAAK,iBAAiB8C,CAAW,CAAC;AAAA,8CACN,KAAK,cAAcO,EAAoBC,EAAuBV,CAAI,CAAC;AAAA;AAAA,aAEpG;AAAA;AAAA,KAGX,CAEA,iBAAiBE,EAAqB,CACpC,MAAMU,EAAW,KAAK,aAAa/C,CAA2B,EAE9D,OAAK+C,EAKExD;AAAAA,iDAHgB8C,IAAgB,eACC,kBAAoB,EAGD;AAAA,mBAC5CU,CAAQ;AAAA;AAAA,MAPDxD,GAUxB,CAEA,cAAcqD,EAA6BI,EAA6Bb,EAAoC,CAC1G,MAAMc,EAAQC,EAAmB,KAAK,WAAYf,GAAM,QAAQ,KAAK,KAAK,GAAK3C,EAAQ,KAAK,UAAU,EAAE,WAClG2D,EACJD,EAAmB,KAAK,WAAYf,GAAM,QAAQ,KAAK,WAAW,GAAK3C,EAAQ,KAAK,UAAU,EAAE,WAAW,EAC7G,OAAOoD,EACHrD;AAAAA;AAAAA,kCAE0B0D,GAASD,EAAqBxD,EAAQ,KAAK,UAAU,EAAE,kBAAoB,GAAG;AAAA,yCACvE2D,CAAW,IAAI,KAAK,wBAAA,CAAyB;AAAA;AAAA,UAG9E5D;AAAAA;AAAAA,gCAEwB0D,CAAK;AAAA;AAAA;AAAA,yCAGIE,CAAW,IAAI,KAAK,wBAAA,CAAyB;AAAA;AAAA,SAGpF,CAEA,wBAAyB,CACvB,OAAO5D;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,YAST,CAGA,yBAA0B,CACxB,MAAM6D,EAAe,IAAM,CAEzB,MAAMC,EAAU,KAAK,WAAW,cAAc,0BAA0B,EACpEA,GAAS,OACXA,EAAQ,KAAO,GAEnB,EACMC,EAAiB,KAAK,iCAAiC,MAAM,eACnE,OAAOA,EACH/D;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,wBAMgB6D,CAAY;AAAA;AAAA,gBAEpB,KAAK,uBAAwB,CAAA;AAAA;AAAA;AAAA,gBAG7BG,EAAWD,EAAe,IAAI,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAc/BhE,EAAO,CAAA;AAAA;AAAA;AAAA,uBAIfC,GACN,CAGA,IAAW,cAAe,CACxB,MAAMiE,EAAW,CACf,uCAAwC,OACxC,wCAAyC,OACzC,qCAAsC,QACtC,uCAAwC,MACxC,yCAA0C,OAC1C,0CAA2C,MAC3C,wCAAyC,OACzC,qDAAsD,MACtD,oDAAqD,UACrD,qDAAsD,OACtD,oDAAqD,MACrD,4CAA6C,QAC7C,8CAA+C,OAC/C,8CAA+C,UAC/C,2DAA4D,UAC5D,sDAAuD,OACvD,wDAAyD,MACzD,yDAA0D,OAC1D,uDAAwD,MACxD,0DAA2D,UAC3D,GAAGC,EAAiB,kCAAmC,CACrD,SAAU,OACV,WAAY,MACd,CAAC,EACD,4CAA6C,OAC7C,GAAGA,EAAiB,wCAAyC,CAC3D,UAAW,MACX,SAAU,OACV,WAAY,MACd,CAAC,EACD,kDAAmD,OACnD,GAAGA,EAAiB,yDAA0D,CAC5E,SAAU,OACV,WAAY,OACZ,MAAO,SACT,CAAC,EACD,GAAG5E,EAAmB,2BAA2B,EACjD,0CAA2C,UAC3C,0CAA2C,IAC3C,4CAA6C,cAC7C,iDAAkD,SAClD,gDAAiD,MACjD,gDAAiD,OACjD,+CAAgD,OAChD,mDAAoD,OACpD,GAAG6E,CACL,EACMC,EAAe,KAAK,kCAAkC,MAAM,QAAQ,KAAK,OAAS,CAAA,EAElFC,EAAS,CAAE,GAAGJ,EAAU,GAAGG,CAAa,EAQ9C,OAAO,OAAO,OANO,OAAO,OAAO,CACjC,OAAQ,CACN,OAAOE,EAAgB,IAA8B,CACvD,CACF,CAAC,EAEkCD,CAAM,CAC3C,CAsJF,CAlfa3D,EACJ,QAAU,4BADNA,EA8VJ,OAAS,CACd6D,EACAC,EACAC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,UAoBM5E,EAAgB,2BAA2B,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAwD5C6E,EAAc,iCAAiC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAUhDA,EAAc,uCAAuC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,UAKtDA,EAAc,uCAAuC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAkBtDA,EAAc,wDAAwD,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAmC/E,EA9ekDC,EAAA,CAAjDC,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,CAAA,EAH9BlE,EAGuC,UAENiE,SAAAA,EAAAA,EAAA,CAA3CC,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAM,CAAC,CAL/B,EAAAlE,EAKiC,oBAEhBiE,EAAA,CAA3BC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EAPflE,EAOiB,UAAA,SAAA,EAEOiE,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CATf,EAAAlE,EASwB,kBAECiE,EAAA,CAAnCC,EAAS,CAAE,KAAM,OAAQ,CAAC,CAXhB,EAAAlE,EAWyB,yBAEAiE,EAAA,CAAnCC,EAAS,CAAE,KAAM,OAAQ,CAAC,CAbhB,EAAAlE,EAayB,mBAERiE,EAAA,CAA3BC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EAfflE,EAeiB,UAAA,yBAAA,EAEOiE,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EAjBflE,EAiBwB,UAEAiE,YAAAA,EAAAA,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EAnBflE,EAmBwB,UAAA,QAAA,EAIlBiE,EAAA,CAAhBE,GAvBU,EAAAnE,EAuBM,UA6dnBoE,kBAAAA,EAAAA,EAAoBpE,CAAsB"}

package/dist/components/redeem-transaction.d.ts

@@ -2,13 +2,13 @@ import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement, PropertyValues } from 'lit';
 import * as lodash from 'lodash';
-import '../chunks/progress-bar-0VS_AmEf.esm.js';
-import '../chunks/promo-pill-label-3bA1z-la.esm.js';
+import '../chunks/progress-bar-CveZ8E6Q.esm.js';
+import '../chunks/promo-pill-label-BXRqZHET.esm.js';
 import './beam-partner-logos.js';
-import { T as TNumericId, a as TId } from '../chunks/types-IbMT3Nwn.esm.js';
-import { T as TCart } from '../chunks/cart-contents-6_ztOjrx.esm.js';
-import { L as LANGUAGES } from '../chunks/types-aju0qrRe.esm.js';
-import '../chunks/openapi-spec-bxGNhNMa.esm.js';
+import { a as TId, T as TNumericId } from '../chunks/types-CPxMwnoR.esm.js';
+import { T as TCart } from '../chunks/cart-contents-CUgc4y1N.esm.js';
+import { L as LANGUAGES } from '../chunks/types-C7gqAyyH.esm.js';
+import '../chunks/openapi-spec-VAt3phhg.esm.js';
 
 interface TRequiredConfig {
     apiKey: string;

package/dist/components/redeem-transaction.esm.js

@@ -1,4 +1,4 @@
-import{y as i,m as k,f as S,g as c,t as v,h as $,u as C,k as P,q as D}from"../chunks/lit-iNN5L_Qk.esm.js";import{d as I}from"../chunks/lodash-P8OIs-at.esm.js";import{u as h,A as R,d as f,a as N,i as m,_ as x}from"../chunks/localize-7sMSg1W9.esm.js";import{D as L,f as z,W as y,j as M,S as U}from"../chunks/routes-o-phF_L1.esm.js";import{p as E}from"../chunks/progress-bar-PMU_xI3L.esm.js";import{p as W}from"../chunks/promo-pill-label-P1X4xeAx.esm.js";import{partnerLogosConfigDefaults as A}from"./beam-partner-logos.esm.js";import{c as F,d as j,e as B,a as _}from"../chunks/enforce-config-l-tNb_z7.esm.js";import{_ as O}from"../chunks/loading-template-t4fFsYtr.esm.js";import{M as K,B as V}from"../chunks/beam-errors-AMvTvR1C.esm.js";import{createScopedLocalStorage as H}from"../utils/local-storage.esm.js";import{c as q}from"../chunks/css-card-grid-nEc--M5M.esm.js";import{c as G}from"../chunks/events-T3hYV1LF.esm.js";import"../utils/logger.esm.js";import"../chunks/vendor-GKiOHg2N.esm.js";const J=({height:n="1em",width:e="1em"}={})=>i`
+import{m as k,y as i,f as S,g as c,t as v,h as $,q as C,k as P,u as D}from"../chunks/lit-WqMxC_PA.esm.js";import{d as I}from"../chunks/lodash-7H4x2457.esm.js";import{u as h,A as R,d as f,a as N,i as m,_ as x}from"../chunks/localize-Btu9xYcE.esm.js";import{D as L,e as z,W as B,j as M,S as U}from"../chunks/routes-pcL-CUiQ.esm.js";import{p as E}from"../chunks/progress-bar-DF7UuuHb.esm.js";import{p as W}from"../chunks/promo-pill-label-CbW_Vcru.esm.js";import{partnerLogosConfigDefaults as A}from"./beam-partner-logos.esm.js";import{c as F,d as _,e as y,a as j}from"../chunks/enforce-config-CZ3ToOgr.esm.js";import{_ as O}from"../chunks/loading-template-DG4lkIIc.esm.js";import{M as K,B as V}from"../chunks/beam-errors-Ci0d3926.esm.js";import{createScopedLocalStorage as H}from"../utils/local-storage.esm.js";import{c as q}from"../chunks/css-card-grid-CvoGpsJH.esm.js";import{c as G}from"../chunks/events-BohmT6Lp.esm.js";import"../utils/logger.esm.js";import"../chunks/vendor-KKSARHWL.esm.js";const J=({height:n="1em",width:e="1em"}={})=>i`
     <svg
       style="${k({height:n,width:e,position:"relative",bottom:"0"})}"
       xmlns="http://www.w3.org/2000/svg"
@@ -7,7 +7,7 @@ import{y as i,m as k,f as S,g as c,t as v,h as $,u as C,k as P,q as D}from"../ch
       <!-- Filled Circle -->
       <circle cx="12" cy="12" r="10" fill="currentColor" />
     </svg>
-  `,p={en:{beamAttribution:()=>"Powered by Beam",ctaTitle:()=>"Choose your impact",ctaPromoPrefixMessage:()=>"At no extra cost,",ctaPromoMessage:({donationPercentage:n="1"}={})=>`At no extra cost, select a nonprofit and ${n}% will be donated there for you.`,ctaMessage:({donationPercentage:n="1"}={})=>`At no extra cost, select a nonprofit and ${n}% will be donated there for you.`,submitButtonText:()=>"Confirm",submitButtonTextCompleted:()=>"Confirmed!",chooseButtonText:()=>"Choose a nonprofit"},fr:{beamAttribution:()=>"Optimis\xE9 par Beam",ctaTitle:()=>"Choisissez votre cause",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`Choisissez un organisme \xE0 but non lucratif et ${n} % lui sera vers\xE9 en votre nom, sans frais suppl\xE9mentaires.`,submitButtonText:()=>"Confirmer",submitButtonTextCompleted:()=>"Confirm\xE9!",chooseButtonText:()=>"Choisissez"},de:{beamAttribution:()=>"Unterst\xFCtzt von Beam",ctaTitle:()=>"W\xE4hle deinen Impact",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`W\xE4hle eine der gemeinn\xFCtzigen Organisationen und spende ${n}% deines Einkaufs ohne zus\xE4tzliche Kosten`,submitButtonText:()=>"Best\xE4tigen",submitButtonTextCompleted:()=>"Best\xE4tigt!",chooseButtonText:()=>"W\xE4hlen"},es:{ctaTitle:()=>"Elige tu contribuci\xF3n",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`Elige una organizaci\xF3n sin fines de lucro y donaremos ${n}% de tu compra sin coste adicional.`,beamAttribution:()=>"Ofrecido por Beam",submitButtonText:()=>"Confirmar",submitButtonTextCompleted:()=>"\xA1Confirmado!",chooseButtonText:()=>"Elige"},it:{ctaTitle:()=>"Scegli dove fare la differenza",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`Seleziona un'organizzazione no-profit a cui devolvere l\u2019${n}% del tuo acquisto, senza costi aggiuntivi`,beamAttribution:()=>"Gestito da Beam",submitButtonText:()=>"Confermare",submitButtonTextCompleted:()=>"Confermato!",chooseButtonText:()=>"Scegli"},pl:{beamAttribution:()=>"Wspierany przez Beam",ctaTitle:()=>"Wybierz inicjatyw\u0119, kt\xF3r\u0105 chcesz wesprze\u0107",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`Wybierz organizacj\u0119, kt\xF3rej przeka\u017Cesz ${n}% warto\u015Bci Twoich zakup\xF3w \u2013 bez \u017Cadnych dodatkowych koszt\xF3w!`,submitButtonText:()=>"Zatwierd\u017A",submitButtonTextCompleted:()=>"Zatwierdzono!",chooseButtonText:()=>"Wybierz"}};var Z=Object.defineProperty,Q=Object.getOwnPropertyDescriptor,d=(n,e,o,t)=>{for(var a=t>1?void 0:t?Q(e,o):e,b=n.length-1,l;b>=0;b--)(l=n[b])&&(a=(t?l(e,o,a):l(a))||a);return t&&a&&Z(e,o,a),a};class r extends ${constructor(){super(...arguments),this.baseUrl=L,this.lang="en",this.debug=!1,this.draftConfig=!1,this.isMobile=window.innerWidth<768,this.didUserExpandNonprofits=!1,this.shouldUsePromoUI=!1,this.getChainNonprofits=async()=>{if(!this.hasCorrectTransactionConfig)throw new K;const e=await z({baseUrl:this.baseUrl,headers:{authorization:`Api-Key ${this.apiKey}`},requestBody:{storeId:this.storeId,postalCode:this.postalCode,countryCode:this.countryCode,transactionId:String(this.transactionId),cart:this.cart??void 0,widgetName:y.redeem_transaction,options:{config:{draftConfig:this.draftConfig}},version:"2.0.0",lang:this.configLang}});return e.store?.id&&e.store.id!==this.storeId&&(this.storeId=e.store.id),this.localStorage.setItemJson("chainNonprofits",{createdAt:new Date,data:e}),e},this.updateNonprofitIdForRecord=async({selectedNonprofitId:e})=>this.transactionId?this.putTransaction({selectedNonprofitId:e}):null,this.putTransaction=async({selectedNonprofitId:e})=>(B(["apiKey","transactionId"],this),M({baseUrl:this.baseUrl,headers:{authorization:`Api-Key ${this.apiKey}`},pathParams:{transactionId:Number(this.transactionId)},requestBody:{nonprofitId:e}})),this.nonprofitListDataController=new R(this,this.getChainNonprofits),this.selectionDataController=new R(this,this.updateNonprofitIdForRecord),this.localStorage=H(this),this.makeHandleSelect=(e,o,t)=>async a=>{if(!this.allowChange)return;const b=this.selectedNonprofitId;if(a instanceof KeyboardEvent){let l=null;switch(a.key){case"ArrowUp":case"ArrowLeft":o===0?l=t[t.length-1]:l=t[o-1],a.preventDefault();break;case"ArrowRight":case"ArrowDown":o===t.length-1?l=t[0]:l=t[o+1],a.preventDefault();break;case"Enter":case" ":a.preventDefault();break;default:return}if(l){const u=this.renderRoot.querySelector(`[data-value="${l.nonprofit.id}"]`);u!==null&&(u.tabIndex=0,u.focus());return}}if(a.currentTarget instanceof HTMLElement){if(b===e)return;this.selectedNonprofitId=e}},this.handleSubmit=async()=>{const{selectedNonprofitId:e}=this;if(!this.allowSubmit||e==null)return;await this.selectionDataController.exec({selectedNonprofitId:e}),this.localStorage.setItem("nonprofit",e),this.localStorage.setItem("nonprofit_selected_at",new Date().toISOString());const o=this.nonprofitListDataController?.data?.nonprofits.find(t=>t.nonprofit.id===e);this.dispatchEvent(new G({selectedNonprofitId:e,nonprofitName:o?.nonprofit.name,source:y.redeem_transaction}))},this.evaluateBreakPoints=I(()=>{this.isMobile=window.innerWidth<768},50,{maxWait:50,leading:!0})}get configLang(){return U[this.lang]||"en"}get hasCorrectTransactionConfig(){return _(["apiKey","transactionId"],this)}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this.evaluateBreakPoints)}async firstUpdated(e){await this.restoreStateFromCache()}async updated(e){const o=["baseUrl","storeId","apiKey","countryCode","postalCode","lang"];for(const t of o)if(e.has(t)){await this.nonprofitListDataController.exec();break}}disconnectedCallback(){super.disconnectedCallback()}restoreStateFromCache(){B(["apiKey"],this),this.selectedNonprofitId=parseInt(this.localStorage.getItem("nonprofit")||"")||void 0;try{const{createdAt:e=0,data:o}=this.localStorage.getItemJson("chainNonprofits")||{},t=2*60*60*1e3;new Date(e).valueOf()+t>new Date().valueOf()&&(this.nonprofitListDataController.data=o,this.nonprofitListDataController.loading=!1)}catch{}}get allowChange(){return this.selectionDataController.data==null&&!this.selectionDataController.loading}get allowSubmit(){return!!(this.selectedNonprofitId&&this.allowChange)}get cssVariables(){const e={"--beam-fontFamily":"inherit","--beam-fontStyle":"inherit","--beam-fontSize":"inherit","--beam-textColor":"inherit","--beam-backgroundColor":"inherit",...f("--beam-RedeemTransaction-title",{fontSize:"1.25em",fontWeight:"bold"}),...f("--beam-RedeemTransaction-description",{marginTop:"0.5em",lineHeight:"normal"}),...A,...E,"--beam-RedeemTransaction-maxWidth":"1000px","--beam-RedeemTransaction-submitButton-fontSize":"14px","--beam-RedeemTransaction-submitButton-fontWeight":"inherit","--beam-RedeemTransaction-submitButton-fontFamily":"inherit","--beam-RedeemTransaction-submitButton-textTransform":"uppercase","--beam-RedeemTransaction-submitButton-color":"#fff","--beam-RedeemTransaction-submitButton-backgroundColor":"#000000","--beam-RedeemTransaction-submitButton-borderRadius":"0px","--beam-RedeemTransaction-submitButton-borderColor":"#000000","--beam-RedeemTransaction-submitButton-padding":"16px 0px","--beam-RedeemTransaction-submitButton-width":"100%","--beam-RedeemTransaction-submitButton-marginTop":"10px","--beam-RedeemTransaction-submitButton-marginBottom":"10px","--beam-RedeemTransaction-submitButtonContainer-display":"flex","--beam-RedeemTransaction-submitButtonContainer-backgroundColor":"#fff","--beam-RedeemTransaction-submitButton-hover-backgroundColor":"#000000","--beam-RedeemTransaction-submitButton-hover-borderColor":"#000000","--beam-RedeemTransaction-submitButton-hover-color":"#fff","--beam-RedeemTransaction-submitButton-disabled-borderColor":"#767676","--beam-RedeemTransaction-submitButton-disabled-backgroundColor":"#767676","--beam-RedeemTransaction-submitButton-disabled-color":"#fff","--beam-RedeemTransaction-radioButton-color":"transparent","--beam-RedeemTransaction-radioButton-borderColor":"#707070","--beam-RedeemTransaction-radioButton-backgroundColor":"#fff","--beam-RedeemTransaction-radioButton-hover-color":"#fff","--beam-RedeemTransaction-radioButton-hover-backgroundColor":"#000","--beam-RedeemTransaction-radioButton-hover-borderColor":"#000","--beam-RedeemTransaction-radioButton-selected-borderColor":"#000","--beam-RedeemTransaction-radioButton-selected-backgroundColor":"#000","--beam-RedeemTransaction-radioButton-selected-color":"#fff","--beam-RedeemTransaction-options-minWidth":"0px","--beam-RedeemTransaction-options-columnCount":"1","--beam-RedeemTransaction-options-borderWidth":"1px","--beam-RedeemTransaction-options-image-borderRadius":"8px","--beam-RedeemTransaction-options-image-height":"70px","--beam-RedeemTransaction-options-image-height-mobile":"75px","--beam-RedeemTransaction-options-borderColor":"#d9d9d9","--beam-RedeemTransaction-options-backgroundColor":"transparent","--beam-RedeemTransaction-options-marginTop":"15px","--beam-RedeemTransaction-options-hover-backgroundColor":"#f1f1f1","--beam-RedeemTransaction-options-hover-borderWidth":".5px","--beam-RedeemTransaction-options-hover-borderColor":"#000000","--beam-RedeemTransaction-options-selected-borderColor":"#000000","--beam-RedeemTransaction-options-selected-borderWidth":".5px","--beam-RedeemTransaction-options-selected-backgroundColor":"#eee",...f("--beam-RedeemTransaction-options-details",{fontSize:"0.85em",marginTop:"0px",lineHeight:"normal",letterSpacing:"-0.45px"}),...f("--beam-RedeemTransaction-options-details-cause",{fontSize:"1em",fontWeight:"bold"}),"--beam-RedeemTransaction-options-details-nonprofitName-fontWeight":"normal","--beam-RedeemTransaction-options-details-nonprofitName-fontStyle":"inherit","--beam-RedeemTransaction-options-details-fundingProgress-marginTop":"3px",...f("--beam-RedeemTransaction-options-details-fundingProgressLabel",{fontSize:"0.85em",textTransform:"capitalize"}),"--beam-RedeemTransaction-cardStyle":"'image'","--beam-RedeemTransaction-options-icon-padding":"0px","--beam-RedeemTransaction-options-icon-backgroundColor":"#F3F3F3","--beam-RedeemTransaction-options-collapseNonprofits-mobile":"false","--beam-RedeemTransaction-options-collapseNonprofits-desktop":"false","--beam-RedeemTransaction-image-width":"13%","--beam-RedeemTransaction-image-height":"50%","--beam-RedeemTransaction-image-width-mobile":"16%",...W},o=this.nonprofitListDataController?.data?.config?.web?.theme||{},t={...e,...o};return Object.assign(Object.create({toCSS(){return N(this)}}),t)}handleChooseClick(){this.didUserExpandNonprofits=!0}get shouldCollapse(){const e=this.cssVariables["--beam-RedeemTransaction-options-collapseNonprofits-mobile"],o=this.cssVariables["--beam-RedeemTransaction-options-collapseNonprofits-desktop"],t=e?.toLowerCase()==="true",a=o?.toLowerCase()==="true";return this.isMobile&&t||!this.isMobile&&a}renderSubmitButton(e){return i`
+  `,p={en:{beamAttribution:()=>"Powered by Beam",ctaTitle:()=>"Choose your impact",ctaPromoPrefixMessage:()=>"At no extra cost,",ctaPromoMessage:({donationPercentage:n="1"}={})=>`At no extra cost, select a nonprofit and ${n}% will be donated there for you.`,ctaMessage:({donationPercentage:n="1"}={})=>`At no extra cost, select a nonprofit and ${n}% will be donated there for you.`,submitButtonText:()=>"Confirm",submitButtonTextCompleted:()=>"Confirmed!",chooseButtonText:()=>"Choose a nonprofit"},fr:{beamAttribution:()=>"Optimis\xE9 par Beam",ctaTitle:()=>"Choisissez votre cause",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`Choisissez un organisme \xE0 but non lucratif et ${n} % lui sera vers\xE9 en votre nom, sans frais suppl\xE9mentaires.`,submitButtonText:()=>"Confirmer",submitButtonTextCompleted:()=>"Confirm\xE9!",chooseButtonText:()=>"Choisissez"},de:{beamAttribution:()=>"Unterst\xFCtzt von Beam",ctaTitle:()=>"W\xE4hle deinen Impact",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`W\xE4hle eine der gemeinn\xFCtzigen Organisationen und spende ${n}% deines Einkaufs ohne zus\xE4tzliche Kosten`,submitButtonText:()=>"Best\xE4tigen",submitButtonTextCompleted:()=>"Best\xE4tigt!",chooseButtonText:()=>"W\xE4hlen"},es:{ctaTitle:()=>"Elige tu contribuci\xF3n",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`Elige una organizaci\xF3n sin fines de lucro y donaremos ${n}% de tu compra sin coste adicional.`,beamAttribution:()=>"Ofrecido por Beam",submitButtonText:()=>"Confirmar",submitButtonTextCompleted:()=>"\xA1Confirmado!",chooseButtonText:()=>"Elige"},it:{ctaTitle:()=>"Scegli dove fare la differenza",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`Seleziona un'organizzazione no-profit a cui devolvere l\u2019${n}% del tuo acquisto, senza costi aggiuntivi`,beamAttribution:()=>"Gestito da Beam",submitButtonText:()=>"Confermare",submitButtonTextCompleted:()=>"Confermato!",chooseButtonText:()=>"Scegli"},pl:{beamAttribution:()=>"Wspierany przez Beam",ctaTitle:()=>"Wybierz inicjatyw\u0119, kt\xF3r\u0105 chcesz wesprze\u0107",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`Wybierz organizacj\u0119, kt\xF3rej przeka\u017Cesz ${n}% warto\u015Bci Twoich zakup\xF3w \u2013 bez \u017Cadnych dodatkowych koszt\xF3w!`,submitButtonText:()=>"Zatwierd\u017A",submitButtonTextCompleted:()=>"Zatwierdzono!",chooseButtonText:()=>"Wybierz"}};var Z=Object.defineProperty,d=(n,e,o,t)=>{for(var a=void 0,b=n.length-1,l;b>=0;b--)(l=n[b])&&(a=l(e,o,a)||a);return a&&Z(e,o,a),a};class r extends ${constructor(){super(...arguments),this.baseUrl=L,this.lang="en",this.debug=!1,this.draftConfig=!1,this.isMobile=window.innerWidth<768,this.didUserExpandNonprofits=!1,this.shouldUsePromoUI=!1,this.getChainNonprofits=async()=>{if(!this.hasCorrectTransactionConfig)throw new K;const e=await z({baseUrl:this.baseUrl,headers:{authorization:`Api-Key ${this.apiKey}`},requestBody:{storeId:this.storeId,postalCode:this.postalCode,countryCode:this.countryCode,transactionId:String(this.transactionId),cart:this.cart??void 0,widgetName:B.redeem_transaction,options:{config:{draftConfig:this.draftConfig}},version:"2.0.0",lang:this.configLang}});return e.store?.id&&e.store.id!==this.storeId&&(this.storeId=e.store.id),this.localStorage.setItemJson("chainNonprofits",{createdAt:new Date,data:e}),e},this.updateNonprofitIdForRecord=async({selectedNonprofitId:e})=>this.transactionId?this.putTransaction({selectedNonprofitId:e}):null,this.putTransaction=async({selectedNonprofitId:e})=>(y(["apiKey","transactionId"],this),M({baseUrl:this.baseUrl,headers:{authorization:`Api-Key ${this.apiKey}`},pathParams:{transactionId:Number(this.transactionId)},requestBody:{nonprofitId:e}})),this.nonprofitListDataController=new R(this,this.getChainNonprofits),this.selectionDataController=new R(this,this.updateNonprofitIdForRecord),this.localStorage=H(this),this.makeHandleSelect=(e,o,t)=>async a=>{if(!this.allowChange)return;const b=this.selectedNonprofitId;if(a instanceof KeyboardEvent){let l=null;switch(a.key){case"ArrowUp":case"ArrowLeft":o===0?l=t[t.length-1]:l=t[o-1],a.preventDefault();break;case"ArrowRight":case"ArrowDown":o===t.length-1?l=t[0]:l=t[o+1],a.preventDefault();break;case"Enter":case" ":a.preventDefault();break;default:return}if(l){const u=this.renderRoot.querySelector(`[data-value="${l.nonprofit.id}"]`);u!==null&&(u.tabIndex=0,u.focus());return}}if(a.currentTarget instanceof HTMLElement){if(b===e)return;this.selectedNonprofitId=e}},this.handleSubmit=async()=>{const{selectedNonprofitId:e}=this;if(!this.allowSubmit||e==null)return;await this.selectionDataController.exec({selectedNonprofitId:e}),this.localStorage.setItem("nonprofit",e),this.localStorage.setItem("nonprofit_selected_at",new Date().toISOString());const o=this.nonprofitListDataController?.data?.nonprofits.find(t=>t.nonprofit.id===e);this.dispatchEvent(new G({selectedNonprofitId:e,nonprofitName:o?.nonprofit.name,source:B.redeem_transaction}))},this.evaluateBreakPoints=I(()=>{this.isMobile=window.innerWidth<768},50,{maxWait:50,leading:!0})}get configLang(){return U[this.lang]||"en"}get hasCorrectTransactionConfig(){return j(["apiKey","transactionId"],this)}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this.evaluateBreakPoints)}async firstUpdated(e){await this.restoreStateFromCache()}async updated(e){const o=["baseUrl","storeId","apiKey","countryCode","postalCode","lang"];for(const t of o)if(e.has(t)){await this.nonprofitListDataController.exec();break}}disconnectedCallback(){super.disconnectedCallback()}restoreStateFromCache(){y(["apiKey"],this),this.selectedNonprofitId=parseInt(this.localStorage.getItem("nonprofit")||"")||void 0;try{const{createdAt:e=0,data:o}=this.localStorage.getItemJson("chainNonprofits")||{},t=2*60*60*1e3;new Date(e).valueOf()+t>new Date().valueOf()&&(this.nonprofitListDataController.data=o,this.nonprofitListDataController.loading=!1)}catch{}}get allowChange(){return this.selectionDataController.data==null&&!this.selectionDataController.loading}get allowSubmit(){return!!(this.selectedNonprofitId&&this.allowChange)}get cssVariables(){const e={"--beam-fontFamily":"inherit","--beam-fontStyle":"inherit","--beam-fontSize":"inherit","--beam-textColor":"inherit","--beam-backgroundColor":"inherit",...f("--beam-RedeemTransaction-title",{fontSize:"1.25em",fontWeight:"bold"}),...f("--beam-RedeemTransaction-description",{marginTop:"0.5em",lineHeight:"normal"}),...A,...E,"--beam-RedeemTransaction-maxWidth":"1000px","--beam-RedeemTransaction-submitButton-fontSize":"14px","--beam-RedeemTransaction-submitButton-fontWeight":"inherit","--beam-RedeemTransaction-submitButton-fontFamily":"inherit","--beam-RedeemTransaction-submitButton-textTransform":"uppercase","--beam-RedeemTransaction-submitButton-color":"#fff","--beam-RedeemTransaction-submitButton-backgroundColor":"#000000","--beam-RedeemTransaction-submitButton-borderRadius":"0px","--beam-RedeemTransaction-submitButton-borderColor":"#000000","--beam-RedeemTransaction-submitButton-padding":"16px 0px","--beam-RedeemTransaction-submitButton-width":"100%","--beam-RedeemTransaction-submitButton-marginTop":"10px","--beam-RedeemTransaction-submitButton-marginBottom":"10px","--beam-RedeemTransaction-submitButtonContainer-display":"flex","--beam-RedeemTransaction-submitButtonContainer-backgroundColor":"#fff","--beam-RedeemTransaction-submitButton-hover-backgroundColor":"#000000","--beam-RedeemTransaction-submitButton-hover-borderColor":"#000000","--beam-RedeemTransaction-submitButton-hover-color":"#fff","--beam-RedeemTransaction-submitButton-disabled-borderColor":"#767676","--beam-RedeemTransaction-submitButton-disabled-backgroundColor":"#767676","--beam-RedeemTransaction-submitButton-disabled-color":"#fff","--beam-RedeemTransaction-radioButton-color":"transparent","--beam-RedeemTransaction-radioButton-borderColor":"#707070","--beam-RedeemTransaction-radioButton-backgroundColor":"#fff","--beam-RedeemTransaction-radioButton-hover-color":"#fff","--beam-RedeemTransaction-radioButton-hover-backgroundColor":"#000","--beam-RedeemTransaction-radioButton-hover-borderColor":"#000","--beam-RedeemTransaction-radioButton-selected-borderColor":"#000","--beam-RedeemTransaction-radioButton-selected-backgroundColor":"#000","--beam-RedeemTransaction-radioButton-selected-color":"#fff","--beam-RedeemTransaction-options-minWidth":"0px","--beam-RedeemTransaction-options-columnCount":"1","--beam-RedeemTransaction-options-borderWidth":"1px","--beam-RedeemTransaction-options-image-borderRadius":"8px","--beam-RedeemTransaction-options-image-height":"70px","--beam-RedeemTransaction-options-image-height-mobile":"75px","--beam-RedeemTransaction-options-borderColor":"#d9d9d9","--beam-RedeemTransaction-options-backgroundColor":"transparent","--beam-RedeemTransaction-options-marginTop":"15px","--beam-RedeemTransaction-options-hover-backgroundColor":"#f1f1f1","--beam-RedeemTransaction-options-hover-borderWidth":".5px","--beam-RedeemTransaction-options-hover-borderColor":"#000000","--beam-RedeemTransaction-options-selected-borderColor":"#000000","--beam-RedeemTransaction-options-selected-borderWidth":".5px","--beam-RedeemTransaction-options-selected-backgroundColor":"#eee",...f("--beam-RedeemTransaction-options-details",{fontSize:"0.85em",marginTop:"0px",lineHeight:"normal",letterSpacing:"-0.45px"}),...f("--beam-RedeemTransaction-options-details-cause",{fontSize:"1em",fontWeight:"bold"}),"--beam-RedeemTransaction-options-details-nonprofitName-fontWeight":"normal","--beam-RedeemTransaction-options-details-nonprofitName-fontStyle":"inherit","--beam-RedeemTransaction-options-details-fundingProgress-marginTop":"3px",...f("--beam-RedeemTransaction-options-details-fundingProgressLabel",{fontSize:"0.85em",textTransform:"capitalize"}),"--beam-RedeemTransaction-cardStyle":"'image'","--beam-RedeemTransaction-options-icon-padding":"0px","--beam-RedeemTransaction-options-icon-backgroundColor":"#F3F3F3","--beam-RedeemTransaction-options-collapseNonprofits-mobile":"false","--beam-RedeemTransaction-options-collapseNonprofits-desktop":"false","--beam-RedeemTransaction-image-width":"13%","--beam-RedeemTransaction-image-height":"50%","--beam-RedeemTransaction-image-width-mobile":"16%",...W},o=this.nonprofitListDataController?.data?.config?.web?.theme||{},t={...e,...o};return Object.assign(Object.create({toCSS(){return N(this)}}),t)}handleChooseClick(){this.didUserExpandNonprofits=!0}get shouldCollapse(){const e=this.cssVariables["--beam-RedeemTransaction-options-collapseNonprofits-mobile"],o=this.cssVariables["--beam-RedeemTransaction-options-collapseNonprofits-desktop"],t=e?.toLowerCase()==="true",a=o?.toLowerCase()==="true";return this.isMobile&&t||!this.isMobile&&a}renderSubmitButton(e){return i`
       ${this.didUserExpandNonprofits||!this.shouldCollapse?i` <button
             type="button"
             ?aria-disabled=${!this.allowSubmit}
@@ -384,5 +384,5 @@ import{y as i,m as k,f as S,g as c,t as v,h as $,u as C,k as P,q as D}from"../ch
         justify-content: center;
         align-items: center;
       }
-    `,q({gap:"0px",itemMinWidth:"var(--beam-RedeemTransaction-options-minWidth, 0px)",columnCount:"var(--beam-RedeemTransaction-options-columnCount, 1)"})],d([c({type:String})],r.prototype,"baseUrl",2),d([c({type:String})],r.prototype,"apiKey",2),d([c({type:Number})],r.prototype,"transactionId",2),d([c({type:Number})],r.prototype,"storeId",2),d([c({type:String})],r.prototype,"countryCode",2),d([c({type:String})],r.prototype,"postalCode",2),d([c({type:Object})],r.prototype,"cart",2),d([c({type:Number,reflect:!0})],r.prototype,"selectedNonprofitId",2),d([c({type:String})],r.prototype,"lang",2),d([c({type:Boolean})],r.prototype,"debug",2),d([c({type:Boolean})],r.prototype,"draftConfig",2),d([v()],r.prototype,"isMobile",2),d([v()],r.prototype,"didUserExpandNonprofits",2),d([v()],r.prototype,"shouldUsePromoUI",2),j(r);export{r as BeamRedeemTransaction};
+    `,q({gap:"0px",itemMinWidth:"var(--beam-RedeemTransaction-options-minWidth, 0px)",columnCount:"var(--beam-RedeemTransaction-options-columnCount, 1)"})],d([c({type:String})],r.prototype,"baseUrl"),d([c({type:String})],r.prototype,"apiKey"),d([c({type:Number})],r.prototype,"transactionId"),d([c({type:Number})],r.prototype,"storeId"),d([c({type:String})],r.prototype,"countryCode"),d([c({type:String})],r.prototype,"postalCode"),d([c({type:Object})],r.prototype,"cart"),d([c({type:Number,reflect:!0})],r.prototype,"selectedNonprofitId"),d([c({type:String})],r.prototype,"lang"),d([c({type:Boolean})],r.prototype,"debug"),d([c({type:Boolean})],r.prototype,"draftConfig"),d([v()],r.prototype,"isMobile"),d([v()],r.prototype,"didUserExpandNonprofits"),d([v()],r.prototype,"shouldUsePromoUI"),_(r);export{r as BeamRedeemTransaction};
 //# sourceMappingURL=redeem-transaction.esm.js.map

package/dist/components/redeem-transaction.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"redeem-transaction.esm.js","sources":["../../src/shared/fragments/radioButton.ts","../../src/components/redeem-transaction/strings.ts","../../src/components/redeem-transaction/index.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { styleMap } from \"lit/directives/style-map.js\";\n\nexport const _radioButton = ({ height = \"1em\", width = \"1em\" } = {}) =>\n  html`\n    <svg\n      style=\"${styleMap({ height, width, position: \"relative\", bottom: \"0\" })}\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n    >\n      <!-- Filled Circle -->\n      <circle cx=\"12\" cy=\"12\" r=\"10\" fill=\"currentColor\" />\n    </svg>\n  `;\n","export const strings = {\n  en: {\n    beamAttribution: () => `Powered by Beam`,\n    ctaTitle: () => `Choose your impact`,\n    ctaPromoPrefixMessage: () => `At no extra cost,`,\n    ctaPromoMessage: ({ donationPercentage = \"1\" } = {}) =>\n      `At no extra cost, select a nonprofit and ${donationPercentage}% will be donated there for you.`,\n    ctaMessage: ({ donationPercentage = \"1\" } = {}) =>\n      `At no extra cost, select a nonprofit and ${donationPercentage}% will be donated there for you.`,\n    submitButtonText: () => `Confirm`,\n    submitButtonTextCompleted: () => `Confirmed!`,\n    chooseButtonText: () => `Choose a nonprofit`,\n  },\n  fr: {\n    beamAttribution: () => `Optimisé par Beam`,\n    ctaTitle: () => `Choisissez votre cause`,\n    ctaPromoPrefixMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaPromoMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaMessage: ({ donationPercentage = \"1\" } = {}) =>\n      `Choisissez un organisme à but non lucratif et ${donationPercentage} % lui sera versé en votre nom, sans frais supplémentaires.`, // TODO: Update translation copy SDK-2210\n    submitButtonText: () => `Confirmer`, // TODO: Update translation copy SDK-2210\n    submitButtonTextCompleted: () => `Confirmé!`,\n    chooseButtonText: () => `Choisissez`, // TODO: Update translation copy SDK-2210\n  },\n  de: {\n    beamAttribution: () => `Unterstützt von Beam`,\n    ctaTitle: () => `Wähle deinen Impact`,\n    ctaPromoPrefixMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaPromoMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaMessage: ({ donationPercentage = \"1\" } = {}) =>\n      `Wähle eine der gemeinnützigen Organisationen und spende ${donationPercentage}% deines Einkaufs ohne zusätzliche Kosten`, // TODO: Update translation copy SDK-2210\n    submitButtonText: () => \"Bestätigen\", // TODO: Update translation copy SDK-2210\n    submitButtonTextCompleted: () => `Bestätigt!`,\n    chooseButtonText: () => `Wählen`, // TODO: Update translation copy SDK-2210\n  },\n  es: {\n    ctaTitle: () => \"Elige tu contribución\",\n    ctaPromoPrefixMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaPromoMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaMessage: ({ donationPercentage = \"1\" } = {}) =>\n      `Elige una organización sin fines de lucro y donaremos ${donationPercentage}% de tu compra sin coste adicional.`, // TODO: Update translation copy SDK-2210\n    beamAttribution: () => \"Ofrecido por Beam\",\n    submitButtonText: () => \"Confirmar\", // TODO: Update translation copy SDK-2210\n    submitButtonTextCompleted: () => \"¡Confirmado!\",\n    chooseButtonText: () => `Elige`, // TODO: Update translation copy SDK-2210\n  },\n  it: {\n    ctaTitle: () => \"Scegli dove fare la differenza\",\n    ctaPromoPrefixMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaPromoMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaMessage: ({ donationPercentage = \"1\" } = {}) =>\n      `Seleziona un'organizzazione no-profit a cui devolvere l’${donationPercentage}% del tuo acquisto, senza costi aggiuntivi`, // TODO: Update translation copy SDK-2210\n    beamAttribution: () => \"Gestito da Beam\",\n    submitButtonText: () => \"Confermare\", // TODO: Update translation copy SDK-2210\n    submitButtonTextCompleted: () => \"Confermato!\",\n    chooseButtonText: () => `Scegli`, // TODO: Update translation copy SDK-2210\n  },\n  pl: {\n    beamAttribution: () => `Wspierany przez Beam`,\n    ctaTitle: () => `Wybierz inicjatywę, którą chcesz wesprzeć`,\n    ctaPromoPrefixMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaPromoMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaMessage: ({ donationPercentage = \"1\" } = {}) =>\n      `Wybierz organizację, której przekażesz ${donationPercentage}% wartości Twoich zakupów – bez żadnych dodatkowych kosztów!`, // TODO: Update translation copy SDK-2210\n    submitButtonText: () => `Zatwierdź`, // TODO: Update translation copy SDK-2210\n    submitButtonTextCompleted: () => `Zatwierdzono!`,\n    chooseButtonText: () => `Wybierz`, // TODO: Update translation copy SDK-2210\n  },\n};\n","import { css, html, LitElement, PropertyValues } from \"lit\";\nimport { repeat } from \"lit/directives/repeat.js\";\nimport { property } from \"lit/decorators/property.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { unsafeHTML } from \"lit/directives/unsafe-html.js\";\nimport { state } from \"lit/decorators/state.js\";\nimport debounce from \"lodash-es/debounce\";\nimport { AsyncController } from \"../../shared/controllers/async-controller\";\nimport { DEFAULT_BASE_URL, SUPPORTED_LANGUAGES, WIDGET_NAMES } from \"../../api-sdk/constants\";\nimport \"../../shared/components/progress-bar\";\nimport \"../../shared/components/promo-pill-label\";\nimport \"../beam-partner-logos\";\nimport { defineCustomElement } from \"../../shared/defineCustomElement\";\nimport { _loading } from \"../../shared/fragments/loading-template\";\nimport { _errorMessage } from \"../../shared/fragments/error-message-template\";\nimport { defineCustomText, useCustomText } from \"../../shared/fragments/custom-text\";\nimport { cssReset } from \"../../shared/css-reset\";\nimport { _cssVariableMap } from \"../../shared/fragments/css-variable-map\";\nimport { enforceConfig, areRequiredKeysDefined } from \"../../shared/enforce-config\";\nimport { BeamError, MissingConfig } from \"../../utils/beam-errors\";\nimport { TId, TNumericId } from \"../../shared/types\";\nimport { TCart } from \"../../shared/cart-contents\";\nimport { createScopedLocalStorage } from \"../../utils/local-storage\";\nimport { cssCardGrid } from \"../../shared/fragments/css-card-grid\";\nimport { postChainEligibleNonprofitsForCart, putTransaction } from \"../../api-sdk/v3/routes\";\nimport { LANGUAGES } from \"../../api-sdk/types\";\nimport { BeamNonprofitSelectEvent } from \"../../utils/events\";\nimport { localizeUserString } from \"../../shared/localize\";\nimport { progressBarConfigDefaults } from \"../../shared/components/progress-bar\";\nimport { partnerLogosConfigDefaults } from \"../beam-partner-logos\";\nimport { promoPillLabelConfigDefaults } from \"../../shared/components/promo-pill-label\";\nimport { _radioButton } from \"../../shared/fragments/radioButton\";\nimport { strings } from \"./strings\";\n\ninterface TRequiredConfig {\n  apiKey: string;\n  transactionId: TId;\n}\n\ntype TIAPIV3GetChainNonprofits = Awaited<ReturnType<typeof import(\"../../api-sdk/v3/routes\").getChainNonprofits>>;\ntype TIAPIV3EligibleNonprofits = Awaited<\n  ReturnType<typeof import(\"../../api-sdk/v3/routes\").getChainNonprofits>\n>[\"nonprofits\"];\ntype TIAPIV3Nonprofit = TIAPIV3EligibleNonprofits[number];\nexport class BeamRedeemTransaction extends LitElement {\n  static tagName = \"beam-redeem-transaction\";\n\n  @property({ type: String }) public baseUrl: string = DEFAULT_BASE_URL;\n\n  @property({ type: String }) public apiKey?: TRequiredConfig[\"apiKey\"];\n\n  @property({ type: Number }) public transactionId?: TRequiredConfig[\"transactionId\"];\n\n  @property({ type: Number }) public storeId?: TNumericId;\n\n  @property({ type: String }) public countryCode?: string;\n\n  @property({ type: String }) public postalCode?: string;\n\n  @property({ type: Object }) public cart?: TCart;\n\n  @property({ type: Number, reflect: true })\n  public selectedNonprofitId?: TNumericId;\n\n  @property({ type: String }) public lang: LANGUAGES = \"en\";\n\n  @property({ type: Boolean }) public debug = false;\n\n  @property({ type: Boolean }) public draftConfig = false;\n\n  @state() private isMobile = window.innerWidth < 768;\n\n  @state() private didUserExpandNonprofits = false;\n\n  @state() private shouldUsePromoUI = false;\n\n  get configLang() {\n    return SUPPORTED_LANGUAGES[this.lang] || \"en\";\n  }\n\n  private get hasCorrectTransactionConfig(): boolean {\n    const requiredKeys: (keyof TRequiredConfig)[] = [\"apiKey\", \"transactionId\"];\n    const isTransactionConfigCorrect = areRequiredKeysDefined(requiredKeys, this);\n    return isTransactionConfigCorrect;\n  }\n\n  private getChainNonprofits = async () => {\n    if (!this.hasCorrectTransactionConfig) {\n      throw new MissingConfig();\n    }\n\n    const res = await postChainEligibleNonprofitsForCart({\n      baseUrl: this.baseUrl,\n      headers: { authorization: `Api-Key ${this.apiKey}` },\n      requestBody: {\n        storeId: this.storeId,\n        postalCode: this.postalCode,\n        countryCode: this.countryCode,\n        transactionId: String(this.transactionId),\n        cart: this.cart ?? undefined,\n        widgetName: WIDGET_NAMES.redeem_transaction,\n        options: {\n          config: {\n            draftConfig: this.draftConfig,\n          },\n        },\n        version: \"2.0.0\",\n        lang: this.configLang,\n      },\n    });\n\n    // If store ID was not provided, get the store ID from response here\n    if (res.store?.id && res.store.id !== this.storeId) {\n      this.storeId = res.store.id;\n    }\n\n    this.localStorage.setItemJson(\"chainNonprofits\", {\n      createdAt: new Date(),\n      data: res,\n    });\n\n    return res;\n  };\n\n  private updateNonprofitIdForRecord = async ({ selectedNonprofitId }: { selectedNonprofitId: TNumericId }) => {\n    if (this.transactionId) {\n      return this.putTransaction({ selectedNonprofitId });\n    }\n    return null;\n  };\n  private putTransaction = async ({ selectedNonprofitId }: { selectedNonprofitId: TNumericId }) => {\n    if (!enforceConfig<TRequiredConfig>([\"apiKey\", \"transactionId\"], this)) {\n      throw new MissingConfig();\n    }\n    return putTransaction({\n      baseUrl: this.baseUrl,\n      headers: {\n        authorization: `Api-Key ${this.apiKey}`,\n      },\n      pathParams: {\n        transactionId: Number(this.transactionId), // TODO SDK-2388: fix api spec for PUT transaction/:id to use string\n      },\n      requestBody: {\n        nonprofitId: selectedNonprofitId,\n      },\n    });\n  };\n\n  private nonprofitListDataController = new AsyncController<typeof this.getChainNonprofits>(\n    this,\n    this.getChainNonprofits\n  );\n\n  private selectionDataController = new AsyncController<typeof this.updateNonprofitIdForRecord>(\n    this,\n    this.updateNonprofitIdForRecord\n  );\n\n  private localStorage = createScopedLocalStorage(this as LitElement & TRequiredConfig);\n\n  connectedCallback() {\n    super.connectedCallback();\n    window.addEventListener(\"resize\", this.evaluateBreakPoints);\n  }\n\n  async firstUpdated(_changedProperties: PropertyValues) {\n    await this.restoreStateFromCache();\n  }\n\n  async updated(previousPropertyValues: PropertyValues) {\n    // Reload nonprofit list on change of any of these props:\n    // Also fires on first load as props go from undefined => value\n    const requireNewDataProps = [\"baseUrl\", \"storeId\", \"apiKey\", \"countryCode\", \"postalCode\", \"lang\"];\n    for (const prop of requireNewDataProps) {\n      if (previousPropertyValues.has(prop)) {\n        await this.nonprofitListDataController.exec();\n        break;\n      }\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n  }\n\n  private restoreStateFromCache() {\n    if (!enforceConfig<TRequiredConfig>([\"apiKey\"], this)) throw new MissingConfig();\n\n    this.selectedNonprofitId = parseInt(this.localStorage.getItem(\"nonprofit\") || \"\") || undefined;\n    try {\n      // try to restore nonprofit list if we have data and it's not too old\n      // list will continue to refresh async and replace this data when ready\n      const { createdAt = 0, data } =\n        this.localStorage.getItemJson<{ createdAt: string; data: any }>(\"chainNonprofits\") || {};\n      const cacheTtl = 2 * 60 * 60 * 1000;\n      if (new Date(createdAt).valueOf() + cacheTtl > new Date().valueOf()) {\n        this.nonprofitListDataController.data = data;\n        this.nonprofitListDataController.loading = false;\n      }\n    } catch (err) {\n      // ignore cache retrieval error and continue to fetch data\n    }\n  }\n\n  /**\n   * Factory for selection event handler\n   *\n   * Nonprofit selector implements radio-button semantics:\n   * * If nothing is selected, tabbing into selector selects first card\n   * * Arrow keys changes focus between cards, but doesn't select\n   * * Enter/Space sets selection\n   * * If a nonprofit is selected, arrow keys change focus AND selection\n   * * Click sets selection\n   * @param {number} id\n   * @param {number} index\n   * @param {{id: number}[]} nonprofits\n   * @returns {(evt: Event) => void}\n   */\n  private makeHandleSelect =\n    (id: number, index: number, nonprofits: { nonprofit: { id: number } }[]): ((event: Event) => void) =>\n    async (event: Event) => {\n      if (!this.allowChange) return;\n      const currentId = this.selectedNonprofitId;\n      if (event instanceof KeyboardEvent) {\n        let nextFocus = null;\n        switch (event.key) {\n          case \"ArrowUp\":\n          case \"ArrowLeft\":\n            if (index === 0) {\n              nextFocus = nonprofits[nonprofits.length - 1];\n            } else {\n              nextFocus = nonprofits[index - 1];\n            }\n            event.preventDefault();\n            break;\n          case \"ArrowRight\":\n          case \"ArrowDown\":\n            if (index === nonprofits.length - 1) {\n              nextFocus = nonprofits[0];\n            } else {\n              nextFocus = nonprofits[index + 1];\n            }\n            event.preventDefault();\n            break;\n          case \"Enter\":\n          case \" \":\n            event.preventDefault();\n            break; // continue to toggle-selection block below\n          default:\n            return;\n        }\n        if (nextFocus) {\n          const focusTarget = this.renderRoot.querySelector(`[data-value=\"${nextFocus.nonprofit.id}\"]`) as HTMLElement;\n          if (focusTarget !== null) {\n            focusTarget.tabIndex = 0;\n            focusTarget.focus();\n          }\n          return;\n        }\n      }\n      // Handle selection with click or Enter/Space key\n      const targetEl = event.currentTarget;\n      if (targetEl instanceof HTMLElement) {\n        if (currentId === id) {\n          // this[\"selected-nonprofit-id\"] = undefined; // unset (not supported)\n          return; // no API call or localStorage change needed\n        } else {\n          this.selectedNonprofitId = id;\n        }\n      }\n    };\n\n  get allowChange() {\n    // Disallow change if already submitted\n    return this.selectionDataController.data == null && !this.selectionDataController.loading;\n  }\n\n  get allowSubmit() {\n    // Disabled if no nonprofit has been selected yet or if submission was already received\n    return Boolean(this.selectedNonprofitId && this.allowChange);\n  }\n\n  handleSubmit = async () => {\n    const { selectedNonprofitId } = this;\n    if (!this.allowSubmit || selectedNonprofitId == null) return;\n    await this.selectionDataController.exec({ selectedNonprofitId });\n\n    this.localStorage.setItem(\"nonprofit\", selectedNonprofitId);\n    this.localStorage.setItem(\"nonprofit_selected_at\", new Date().toISOString());\n\n    const selectedNonprofit = this.nonprofitListDataController?.data?.nonprofits.find(\n      (np) => np.nonprofit.id === selectedNonprofitId\n    );\n\n    this.dispatchEvent(\n      new BeamNonprofitSelectEvent({\n        selectedNonprofitId,\n        nonprofitName: selectedNonprofit?.nonprofit.name,\n        source: WIDGET_NAMES.redeem_transaction,\n      })\n    );\n  };\n\n  evaluateBreakPoints = debounce(\n    () => {\n      this.isMobile = window.innerWidth < 768;\n    },\n    50,\n    { maxWait: 50, leading: true }\n  );\n\n  public get cssVariables() {\n    const defaults = {\n      \"--beam-fontFamily\": \"inherit\",\n      \"--beam-fontStyle\": \"inherit\",\n      \"--beam-fontSize\": \"inherit\",\n      \"--beam-textColor\": \"inherit\",\n      \"--beam-backgroundColor\": \"inherit\",\n      ...defineCustomText(\"--beam-RedeemTransaction-title\", {\n        fontSize: \"1.25em\",\n        fontWeight: \"bold\",\n      }),\n      ...defineCustomText(\"--beam-RedeemTransaction-description\", {\n        marginTop: \"0.5em\",\n        lineHeight: \"normal\",\n      }),\n      ...partnerLogosConfigDefaults,\n      ...progressBarConfigDefaults,\n      \"--beam-RedeemTransaction-maxWidth\": \"1000px\",\n      \"--beam-RedeemTransaction-submitButton-fontSize\": \"14px\",\n      \"--beam-RedeemTransaction-submitButton-fontWeight\": \"inherit\",\n      \"--beam-RedeemTransaction-submitButton-fontFamily\": \"inherit\",\n      \"--beam-RedeemTransaction-submitButton-textTransform\": \"uppercase\",\n      \"--beam-RedeemTransaction-submitButton-color\": \"#fff\",\n      \"--beam-RedeemTransaction-submitButton-backgroundColor\": \"#000000\",\n      \"--beam-RedeemTransaction-submitButton-borderRadius\": \"0px\",\n      \"--beam-RedeemTransaction-submitButton-borderColor\": \"#000000\",\n      \"--beam-RedeemTransaction-submitButton-padding\": \"16px 0px\",\n      \"--beam-RedeemTransaction-submitButton-width\": \"100%\",\n      \"--beam-RedeemTransaction-submitButton-marginTop\": \"10px\",\n      \"--beam-RedeemTransaction-submitButton-marginBottom\": \"10px\",\n      \"--beam-RedeemTransaction-submitButtonContainer-display\": \"flex\",\n      \"--beam-RedeemTransaction-submitButtonContainer-backgroundColor\": \"#fff\",\n      \"--beam-RedeemTransaction-submitButton-hover-backgroundColor\": \"#000000\",\n      \"--beam-RedeemTransaction-submitButton-hover-borderColor\": \"#000000\",\n      \"--beam-RedeemTransaction-submitButton-hover-color\": \"#fff\",\n      \"--beam-RedeemTransaction-submitButton-disabled-borderColor\": \"#767676\",\n      \"--beam-RedeemTransaction-submitButton-disabled-backgroundColor\": \"#767676\",\n      \"--beam-RedeemTransaction-submitButton-disabled-color\": \"#fff\",\n      \"--beam-RedeemTransaction-radioButton-color\": \"transparent\",\n      \"--beam-RedeemTransaction-radioButton-borderColor\": \"#707070\",\n      \"--beam-RedeemTransaction-radioButton-backgroundColor\": \"#fff\",\n      \"--beam-RedeemTransaction-radioButton-hover-color\": \"#fff\",\n      \"--beam-RedeemTransaction-radioButton-hover-backgroundColor\": \"#000\",\n      \"--beam-RedeemTransaction-radioButton-hover-borderColor\": \"#000\",\n      \"--beam-RedeemTransaction-radioButton-selected-borderColor\": \"#000\",\n      \"--beam-RedeemTransaction-radioButton-selected-backgroundColor\": \"#000\",\n      \"--beam-RedeemTransaction-radioButton-selected-color\": \"#fff\",\n      \"--beam-RedeemTransaction-options-minWidth\": \"0px\",\n      \"--beam-RedeemTransaction-options-columnCount\": \"1\",\n      \"--beam-RedeemTransaction-options-borderWidth\": \"1px\",\n      \"--beam-RedeemTransaction-options-image-borderRadius\": \"8px\",\n      \"--beam-RedeemTransaction-options-image-height\": \"70px\",\n      \"--beam-RedeemTransaction-options-image-height-mobile\": \"75px\",\n      \"--beam-RedeemTransaction-options-borderColor\": \"#d9d9d9\",\n      \"--beam-RedeemTransaction-options-backgroundColor\": \"transparent\",\n      \"--beam-RedeemTransaction-options-marginTop\": \"15px\",\n      \"--beam-RedeemTransaction-options-hover-backgroundColor\": \"#f1f1f1\",\n      \"--beam-RedeemTransaction-options-hover-borderWidth\": \".5px\",\n      \"--beam-RedeemTransaction-options-hover-borderColor\": \"#000000\",\n      \"--beam-RedeemTransaction-options-selected-borderColor\": \"#000000\",\n      \"--beam-RedeemTransaction-options-selected-borderWidth\": \".5px\",\n      \"--beam-RedeemTransaction-options-selected-backgroundColor\": \"#eee\",\n      ...defineCustomText(\"--beam-RedeemTransaction-options-details\", {\n        fontSize: \"0.85em\",\n        marginTop: \"0px\",\n        lineHeight: \"normal\",\n        letterSpacing: \"-0.45px\",\n      }),\n      ...defineCustomText(\"--beam-RedeemTransaction-options-details-cause\", {\n        fontSize: \"1em\",\n        fontWeight: \"bold\",\n      }),\n      \"--beam-RedeemTransaction-options-details-nonprofitName-fontWeight\": \"normal\",\n      \"--beam-RedeemTransaction-options-details-nonprofitName-fontStyle\": \"inherit\",\n      \"--beam-RedeemTransaction-options-details-fundingProgress-marginTop\": \"3px\", // update after class name addition\n      ...defineCustomText(\"--beam-RedeemTransaction-options-details-fundingProgressLabel\", {\n        fontSize: \"0.85em\",\n        textTransform: \"capitalize\",\n      }),\n      \"--beam-RedeemTransaction-cardStyle\": \"'image'\", // icon, selected_icon, image\n      \"--beam-RedeemTransaction-options-icon-padding\": \"0px\",\n      \"--beam-RedeemTransaction-options-icon-backgroundColor\": \"#F3F3F3\",\n      \"--beam-RedeemTransaction-options-collapseNonprofits-mobile\": \"false\",\n      \"--beam-RedeemTransaction-options-collapseNonprofits-desktop\": \"false\",\n      \"--beam-RedeemTransaction-image-width\": \"13%\",\n      \"--beam-RedeemTransaction-image-height\": \"50%\",\n      \"--beam-RedeemTransaction-image-width-mobile\": \"16%\",\n      ...promoPillLabelConfigDefaults,\n    };\n\n    const remoteConfig = this.nonprofitListDataController?.data?.config?.web?.theme || {};\n\n    const config = { ...defaults, ...remoteConfig };\n\n    const serializable = Object.create({\n      toCSS() {\n        return _cssVariableMap(this as Record<string, string>);\n      },\n    });\n\n    return Object.assign(serializable, config);\n  }\n\n  static styles = [\n    cssReset,\n    css`\n      :host {\n        display: block;\n        max-width: var(--beam-RedeemTransaction-maxWidth);\n        font-family: var(--beam-fontFamily);\n        font-style: var(--beam-fontStyle);\n        font-size: var(--beam-fontSize);\n        background-color: var(--beam-backgroundColor);\n        color: var(--beam-textColor);\n        word-break: normal;\n      }\n\n      .headerContainer {\n        align-items: flex-start;\n        justify-content: space-between;\n        display: flex;\n        order: 2;\n      }\n\n      .submitButtonContainer {\n        margin-top: var(--beam-RedeemTransaction-submitButton-marginTop);\n        margin-bottom: var(--beam-RedeemTransaction-submitButton-marginBottom);\n        background-color: var(--beam-RedeemTransaction-submitButtonContainer-backgroundColor);\n        display: var(--beam-RedeemTransaction-submitButtonContainer-display);\n      }\n\n      .submitButton {\n        color: var(--beam-RedeemTransaction-submitButton-color);\n        background-color: var(--beam-RedeemTransaction-submitButton-backgroundColor);\n        border: 1px solid var(--beam-RedeemTransaction-submitButton-borderColor);\n        font-size: var(--beam-RedeemTransaction-submitButton-fontSize);\n        font-weight: var(--beam-RedeemTransaction-submitButton-fontWeight);\n        font-family: var(--beam-RedeemTransaction-submitButton-fontFamily);\n        text-transform: var(--beam-RedeemTransaction-submitButton-textTransform);\n        border-radius: var(--beam-RedeemTransaction-submitButton-borderRadius);\n        padding: var(--beam-RedeemTransaction-submitButton-padding);\n        width: var(--beam-RedeemTransaction-submitButton-width);\n        transition: background-color 0.2s, border-color 0.2s, color 0.2s;\n        cursor: pointer;\n      }\n\n      .submitButton:not(.isDisabled):focus-visible,\n      .submitButton:not(.isDisabled):hover {\n        background-color: var(--beam-RedeemTransaction-submitButton-hover-backgroundColor);\n        border-color: var(--beam-RedeemTransaction-submitButton-hover-borderColor);\n        color: var(--beam-RedeemTransaction-submitButton-hover-color);\n      }\n\n      .submitButton.isDisabled {\n        color: var(--beam-RedeemTransaction-submitButton-disabled-color);\n        background-color: var(--beam-RedeemTransaction-submitButton-disabled-backgroundColor);\n        border-color: var(--beam-RedeemTransaction-submitButton-disabled-borderColor);\n        cursor: not-allowed;\n      }\n\n      .options {\n        margin-top: var(--beam-RedeemTransaction-options-marginTop);\n        order: 3;\n        flex-grow: 1;\n      }\n\n      .options.isHidden {\n        display: none;\n      }\n\n      .option {\n        border: var(--beam-RedeemTransaction-options-borderWidth) solid\n          var(--beam-RedeemTransaction-options-borderColor);\n        border-bottom: none;\n        background-color: var(--beam-RedeemTransaction-options-backgroundColor);\n        cursor: pointer;\n        transition: border-color 0.2s, background-color 0.2s, outline 0.2s;\n      }\n\n      .option:first-child {\n        border-radius: 8px 8px 0 0; /* Top corners rounded */\n      }\n\n      .option:last-child {\n        border-bottom: var(--beam-RedeemTransaction-options-borderWidth) solid\n          var(--beam-RedeemTransaction-options-borderColor);\n        border-radius: 0 0 8px 8px; /* Bottom corners rounded */\n      }\n\n      .option:not(.isDisabled):not(:last-child):focus-visible,\n      .option:not(.isDisabled):not(:last-child):hover,\n      .option:not(.isSelected):not(:last-child):focus-visible,\n      .option:not(.isSelected):not(:last-child):hover {\n        background-color: var(--beam-RedeemTransaction-options-hover-backgroundColor);\n        outline: var(--beam-RedeemTransaction-options-hover-borderWidth) solid\n          var(--beam-RedeemTransaction-options-hover-borderColor);\n        border-bottom: var(--beam-RedeemTransaction-options-hover-borderWidth) solid\n          var(--beam-RedeemTransaction-options-hover-borderColor);\n      }\n\n      .option:not(.isDisabled):focus-visible,\n      .option:not(.isDisabled):hover,\n      .option:not(.isSelected):focus-visible,\n      .option:not(.isSelected):hover {\n        background-color: var(--beam-RedeemTransaction-options-hover-backgroundColor);\n        outline: var(--beam-RedeemTransaction-options-hover-borderWidth) solid\n          var(--beam-RedeemTransaction-options-hover-borderColor);\n      }\n\n      .option.isDisabled {\n        cursor: not-allowed;\n      }\n\n      .option.isSelected {\n        outline: var(--beam-RedeemTransaction-options-selected-borderWidth) solid\n          var(--beam-RedeemTransaction-options-selected-borderColor);\n        background-color: var(--beam-RedeemTransaction-options-selected-backgroundColor);\n        border-bottom: var(--beam-RedeemTransaction-options-selected-borderWidth) solid\n          var(--beam-RedeemTransaction-options-selected-borderColor);\n      }\n\n      .option.isSelected:focus-visible,\n      .option.isSelected:hover {\n        outline: var(--beam-RedeemTransaction-options-selected-borderWidth) solid\n          var(--beam-RedeemTransaction-options-selected-borderColor);\n        border-bottom: var(--beam-RedeemTransaction-options-selected-borderWidth) solid\n          var(--beam-RedeemTransaction-options-selected-borderColor);\n      }\n\n      .option .radioButton {\n        border-width: 1px;\n        border-style: solid;\n        transition: background-color 0.2s, color 0.2s, border-color 0.2s;\n        color: var(--beam-RedeemTransaction-radioButton-color);\n        background-color: var(--beam-RedeemTransaction-radioButton-backgroundColor);\n        border-color: var(--beam-RedeemTransaction-radioButton-borderColor);\n      }\n\n      .option.isSelected .radioButton,\n      .option.isSelected:focus-visible .radioButton,\n      .option.isSelected:hover .radioButton {\n        color: var(--beam-RedeemTransaction-radioButton-selected-color);\n        background-color: var(--beam-RedeemTransaction-radioButton-selected-backgroundColor);\n        border-color: var(--beam-RedeemTransaction-radioButton-selected-borderColor);\n      }\n\n      .option:not(.isSelected):focus-visible .radioButton,\n      .option:not(.isSelected):hover .radioButton {\n        color: var(--beam-RedeemTransaction-radioButton-hover-color);\n        background-color: var(--beam-RedeemTransaction-radioButton-hover-backgroundColor);\n        border-color: var(--beam-RedeemTransaction-radioButton-hover-borderColor);\n      }\n\n      .detailsDescription {\n        ${useCustomText(\"--beam-RedeemTransaction-options-details\")}\n      }\n\n      .detailsDescription .nonprofitName {\n        font-weight: var(--beam-RedeemTransaction-options-details-nonprofitName-fontWeight);\n        font-style: var(--beam-RedeemTransaction-options-details-nonprofitName-fontStyle);\n      }\n\n      .radioButtonContainer {\n        height: 100%;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex: 0 0 auto;\n      }\n\n      .radioButton {\n        padding: 5px;\n        border-radius: 100%;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n      }\n\n      .imageContainer {\n        flex: 1 0 var(--beam-RedeemTransaction-image-width);\n        display: flex;\n        flex-direction: column;\n      }\n\n      .progressBarContainer {\n        display: flex;\n        align-items: center;\n      }\n\n      .details-progressBarLabel {\n        ${useCustomText(\"--beam-RedeemTransaction-options-details-fundingProgressLabel\")}\n        white-space: nowrap;\n        text-align: right;\n        margin-left: 15px;\n      }\n\n      .details {\n        flex: 1 1 100%;\n        display: flex;\n        flex-direction: column;\n        gap: 5px;\n      }\n\n      .root {\n        display: flex;\n        flex-direction: column;\n      }\n\n      .submitButtonContainer {\n        order: 4;\n        position: sticky;\n        bottom: 0;\n        z-index: 999;\n      }\n\n      .icon-background {\n        width: 50px;\n        height: 50px;\n        border-radius: 50%;\n        overflow: hidden;\n        background: var(--beam-RedeemTransaction-options-icon-backgroundColor);\n        display: flex;\n        justify-content: center;\n        align-items: center;\n      }\n\n      .icon {\n        height: var(--beam-RedeemTransaction-image-height);\n      }\n\n      .icon-container {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n      }\n    `,\n    cssCardGrid({\n      gap: \"0px\",\n      itemMinWidth: \"var(--beam-RedeemTransaction-options-minWidth, 0px)\",\n      columnCount: \"var(--beam-RedeemTransaction-options-columnCount, 1)\",\n    }),\n  ];\n\n  private handleChooseClick() {\n    this.didUserExpandNonprofits = true;\n  }\n\n  get shouldCollapse() {\n    const enableMobileCollapse = this.cssVariables[\"--beam-RedeemTransaction-options-collapseNonprofits-mobile\"];\n    const enableDesktopCollapse = this.cssVariables[\"--beam-RedeemTransaction-options-collapseNonprofits-desktop\"];\n    const isMobileCollapseEnabled = enableMobileCollapse?.toLowerCase() === \"true\";\n    const isDesktopCollapseEnabled = enableDesktopCollapse?.toLowerCase() === \"true\";\n\n    return (this.isMobile && isMobileCollapseEnabled) || (!this.isMobile && isDesktopCollapseEnabled);\n  }\n\n  private renderSubmitButton(data: TIAPIV3GetChainNonprofits) {\n    return html`\n      ${this.didUserExpandNonprofits || !this.shouldCollapse\n        ? html` <button\n            type=\"button\"\n            ?aria-disabled=${!this.allowSubmit}\n            @click=\"${this.handleSubmit}\"\n            class=\"${classMap({\n              isDisabled: !this.allowSubmit,\n              submitButton: true,\n            })}\"\n            part=\"submitButton\"\n          >\n            ${this.selectionDataController.data !== null\n              ? localizeUserString(\n                  this.configLang,\n                  data?.config?.web?.confirmedButton || strings[this.configLang].submitButtonTextCompleted()\n                )\n              : localizeUserString(\n                  this.configLang,\n                  data?.config?.web?.confirmButton || strings[this.configLang].submitButtonText()\n                )}\n          </button>`\n        : html`\n            <button type=\"button\" @click=\"${this.handleChooseClick}\" class=\"submitButton\" part=\"submitButton\">\n              ${localizeUserString(\n                this.configLang,\n                data?.config?.web?.collapsedButton || strings[this.configLang].chooseButtonText()\n              )}\n            </button>\n          `}\n    `;\n  }\n\n  private renderRadioButton() {\n    return html`\n      <div class=\"radioButtonContainer\">\n        <span part=\"radioButton\" class=\"radioButton\">\n          <span style=\"line-height: 0;\"> ${_radioButton({ height: \"7px\", width: \"7px\" })} </span>\n        </span>\n      </div>\n    `;\n  }\n\n  private renderNonprofitImage(np: TIAPIV3Nonprofit, displayIcon: boolean) {\n    const cardStyle = this.cssVariables[\"--beam-RedeemTransaction-cardStyle\"];\n\n    const imageUrl = displayIcon\n      ? cardStyle === \"'icon'\"\n        ? np.nonprofit.causeIconUrl\n        : cardStyle === \"'selected_icon'\"\n        ? np.nonprofit.causeIconSelectedUrl\n        : np.imageUrl\n      : np.imageUrl;\n\n    return html`\n      ${displayIcon\n        ? html` <div class=\"icon-container\">\n            <div class=\"icon-background\">\n              <img src=\"${imageUrl}\" alt=\"\" role=\"presentation\" class=\"icon\" />\n            </div>\n          </div>`\n        : html` <div\n            class=\"image-container\"\n            style=\"${this.isMobile\n              ? \"flex: 1 0 var(--beam-RedeemTransaction-image-width-mobile)\"\n              : \"flex: 1 0 var(--beam-RedeemTransaction-image-width)\"}\"\n          >\n            <img\n              src=\"${imageUrl}\"\n              alt=\"\"\n              role=\"presentation\"\n              class=\"image\"\n              style=\"\n            width: 100%;\n            height: ${this.isMobile\n                ? \"var(--beam-RedeemTransaction-options-image-height-mobile)\"\n                : \"var(--beam-RedeemTransaction-options-image-height)\"};\n            object-fit: cover;\n            border-radius: var(--beam-RedeemTransaction-options-image-borderRadius);}\n            \"\n            />\n          </div>`}\n    `;\n  }\n\n  private renderOptionDetail(np: TIAPIV3Nonprofit) {\n    return html`\n      <div class=\"detailsCause\" style=\"${useCustomText(\"--beam-RedeemTransaction-options-details-cause\")}\">\n        ${localizeUserString(this.configLang, np.nonprofit.cause || \"\")}\n      </div>\n      <p class=\"detailsDescription\">${unsafeHTML(localizeUserString(this.configLang, np.impact.description || \"\"))}</p>\n    `;\n  }\n\n  private renderProgressBar(np: TIAPIV3Nonprofit) {\n    return html`\n      <div class=\"progressBarContainer\">\n        <beam-progress-bar value=\"${np.impact.goalProgressPercentage}\" style=\"flex: 1;\"></beam-progress-bar>\n        <span class=\"details-progressBarLabel\">\n          ${localizeUserString(this.configLang, np.impact.goalProgressText)}\n        </span>\n      </div>\n    `;\n  }\n\n  private renderNonprofitDetails(\n    np: TIAPIV3Nonprofit,\n    hasNonprofitWithInactivePromo: boolean,\n    data: TIAPIV3GetChainNonprofits\n  ) {\n    return html`\n      <div class=\"details\" part=\"details\">\n        ${this.renderOptionDetail(np)} ${this.renderPromoPill(np, hasNonprofitWithInactivePromo, data)}\n      </div>\n    `;\n  }\n\n  private renderPromoPill(\n    np: TIAPIV3Nonprofit,\n    hasNonprofitWithInactivePromo: boolean,\n    data: TIAPIV3GetChainNonprofits\n  ) {\n    return html`\n      ${np.promo?.isActive && this.shouldUsePromoUI && hasNonprofitWithInactivePromo\n        ? html`<beam-promo-info-pill .promo=${data?.config?.web?.promo} shortVersion></beam-promo-info-pill>`\n        : html``}\n    `;\n  }\n\n  protected render() {\n    const { selectedNonprofitId } = this;\n    const { data, loading } = this.nonprofitListDataController;\n\n    if (loading && !data) {\n      return _loading();\n    }\n    if (this.nonprofitListDataController.error) {\n      if (this.debug) {\n        return _errorMessage({ error: this.nonprofitListDataController.error });\n      }\n      return \"\";\n    }\n    if (this.selectionDataController.error) {\n      if (this.debug) {\n        return _errorMessage({ error: this.selectionDataController.error });\n      }\n      // do not show error screen for interactive errors by default\n    }\n    if (data == null) {\n      if (this.debug) {\n        return _errorMessage({ error: new BeamError(\"No data\") });\n      }\n      return \"\";\n    }\n    const nonprofits = data?.nonprofits || [];\n    const selectedNonprofit = nonprofits.find((np) => np.nonprofit.id === selectedNonprofitId) || null;\n    // changes images in widget to icons\n    const displayIcon =\n      this.cssVariables[\"--beam-RedeemTransaction-cardStyle\"] === \"'icon'\" ||\n      this.cssVariables[\"--beam-RedeemTransaction-cardStyle\"] === \"'selected_icon'\";\n    this.shouldUsePromoUI = data?.config?.web?.promo ? true : false; // new promo UI\n    const hasNonprofitWithInactivePromo = nonprofits.some((nonprofit) => !nonprofit.promo || !nonprofit.promo.isActive);\n\n    return html`\n      <style>\n        :host {\n          ${this.cssVariables.toCSS()}\n        }\n      </style>\n      <!-- Custom flex order fixes tab cycling so submit button is after content -->\n      <div style=\"display: flex; flex-direction: column;\" class=\"root\">\n        <div\n          style=\"order: 3;\"\n          tabindex=\"-1\"\n          class=\"options cardGrid ${classMap({ isHidden: !this.didUserExpandNonprofits && this.shouldCollapse })}\"\n          part=\"options\"\n          role=\"radiogroup\"\n          aria-labelledby=\"beam-RedeemTransaction-title\"\n          ?aria-disabled=${!this.allowChange}\n        >\n          ${repeat(\n            nonprofits,\n            (i) => i.nonprofit.id,\n            (np, index) => {\n              const isSelected = selectedNonprofitId === np.nonprofit.id;\n              const isFocusable = isSelected || (selectedNonprofit == null && index === 0);\n              return html`\n                <div\n                  class=\"option ${classMap({\n                    isSelected: isSelected,\n                    isDisabled: !this.allowChange,\n                  })}\"\n                  part=\"option\"\n                  role=\"radio\"\n                  tabindex=\"${isFocusable ? 0 : -1}\"\n                  data-value=${np.nonprofit.id}\n                  ?aria-checked=${isSelected}\n                  @click=${this.makeHandleSelect(np.nonprofit.id, index, nonprofits)}\n                  @keydown=${this.makeHandleSelect(np.nonprofit.id, index, nonprofits)}\n                  aria-label=\"${localizeUserString(this.configLang, np.nonprofit.cause || \"\")}\"\n                  style=\"display: flex; flex-direction: column; padding: 11px; justify-content:center;\"\n                >\n                  <div class=\"optionContainer\" style=\"display: flex; align-items: flex-start; gap: 8px;\">\n                    ${this.renderRadioButton()}\n                    <div\n                      class=\"nonprofitInfoContainer\"\n                      style=\"flex: 1; display: flex; flex-direction: column; gap: 5px;\"\n                    >\n                      <div class=\"imageDetailContainer\" style=\"display: flex; gap: 8px;\">\n                        ${this.renderNonprofitImage(np, displayIcon)}\n                        ${this.renderNonprofitDetails(np, hasNonprofitWithInactivePromo, data)}\n                      </div>\n                      ${this.renderProgressBar(np)}\n                    </div>\n                  </div>\n                </div>\n              `;\n            }\n          )}\n        </div>\n\n        <div class=\"submitButtonContainer\">${this.renderSubmitButton(data)}</div>\n\n        <div class=\"headerContainer\">\n          <div>\n            <div\n              class=\"header-promo-pill-container\"\n              style=\"display: flex; ${this.isMobile && \"flex-direction: column; align-items: flex-start;\"}\"\n            >\n              <h3\n                class=\"title\"\n                part=\"title\"\n                id=\"beam-RedeemTransaction-title\"\n                style=\"${useCustomText(\"--beam-RedeemTransaction-title\")}; margin-right: 8px;\"\n              >\n                ${localizeUserString(this.configLang, data?.config?.web?.title) || strings[this.configLang].ctaTitle()}\n              </h3>\n              ${this.shouldUsePromoUI\n                ? html`<beam-promo-info-pill\n                    .promo=${data?.config?.web?.promo}\n                    style=\"${this.isMobile && \"order: -1; margin-bottom:10px;\"}\"\n                  ></beam-promo-info-pill>`\n                : html``}\n            </div>\n            <p class=\"description\" part=\"description\" style=\"${useCustomText(\"--beam-RedeemTransaction-description\")}\">\n              ${this.shouldUsePromoUI\n                ? html`<span style=\"font-weight:bold\">\n                      ${localizeUserString(this.configLang, data?.config?.web?.promoDescriptionPrefix || \"\") ||\n                      strings[this.configLang].ctaPromoPrefixMessage()}\n                    </span>\n                    <span>\n                      ${localizeUserString(this.configLang, data?.config?.web?.promoDescription || \"\") ||\n                      strings[this.configLang].ctaPromoMessage()}\n                    </span>`\n                : html`<span\n                    >${localizeUserString(this.configLang, data?.config?.web?.description || \"\") ||\n                    strings[this.configLang].ctaMessage()}\n                  </span>`}\n            </p>\n          </div>\n        </div>\n\n        <beam-partner-logos\n          partnerName=\"${data.chain.name}\"\n          partnerLogoUrl=\"${data.chain.logoUrl}\"\n          style=\"order: 1\"\n        ></beam-partner-logos>\n      </div>\n    `;\n  }\n}\n\ndefineCustomElement(BeamRedeemTransaction);\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"beam-redeem-transaction\": BeamRedeemTransaction;\n  }\n}\n"],"names":["_radioButton","height","width","html","styleMap","strings","donationPercentage","BeamRedeemTransaction","LitElement","DEFAULT_BASE_URL","MissingConfig","res","postChainEligibleNonprofitsForCart","WIDGET_NAMES","selectedNonprofitId","enforceConfig","putTransaction","AsyncController","createScopedLocalStorage","id","index","nonprofits","event","currentId","nextFocus","focusTarget","selectedNonprofit","np","BeamNonprofitSelectEvent","debounce","SUPPORTED_LANGUAGES","areRequiredKeysDefined","_changedProperties","previousPropertyValues","requireNewDataProps","prop","createdAt","data","cacheTtl","defaults","defineCustomText","partnerLogosConfigDefaults","progressBarConfigDefaults","promoPillLabelConfigDefaults","remoteConfig","config","_cssVariableMap","enableMobileCollapse","enableDesktopCollapse","isMobileCollapseEnabled","isDesktopCollapseEnabled","classMap","localizeUserString","displayIcon","cardStyle","imageUrl","useCustomText","unsafeHTML","hasNonprofitWithInactivePromo","loading","_loading","_errorMessage","BeamError","nonprofit","repeat","i","isSelected","isFocusable","cssReset","css","cssCardGrid","__decorateClass","property","state","defineCustomElement"],"mappings":"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"}
+{"version":3,"file":"redeem-transaction.esm.js","sources":["../../src/shared/fragments/radioButton.ts","../../src/components/redeem-transaction/strings.ts","../../src/components/redeem-transaction/index.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { styleMap } from \"lit/directives/style-map.js\";\n\nexport const _radioButton = ({ height = \"1em\", width = \"1em\" } = {}) =>\n  html`\n    <svg\n      style=\"${styleMap({ height, width, position: \"relative\", bottom: \"0\" })}\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n    >\n      <!-- Filled Circle -->\n      <circle cx=\"12\" cy=\"12\" r=\"10\" fill=\"currentColor\" />\n    </svg>\n  `;\n","export const strings = {\n  en: {\n    beamAttribution: () => `Powered by Beam`,\n    ctaTitle: () => `Choose your impact`,\n    ctaPromoPrefixMessage: () => `At no extra cost,`,\n    ctaPromoMessage: ({ donationPercentage = \"1\" } = {}) =>\n      `At no extra cost, select a nonprofit and ${donationPercentage}% will be donated there for you.`,\n    ctaMessage: ({ donationPercentage = \"1\" } = {}) =>\n      `At no extra cost, select a nonprofit and ${donationPercentage}% will be donated there for you.`,\n    submitButtonText: () => `Confirm`,\n    submitButtonTextCompleted: () => `Confirmed!`,\n    chooseButtonText: () => `Choose a nonprofit`,\n  },\n  fr: {\n    beamAttribution: () => `Optimisé par Beam`,\n    ctaTitle: () => `Choisissez votre cause`,\n    ctaPromoPrefixMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaPromoMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaMessage: ({ donationPercentage = \"1\" } = {}) =>\n      `Choisissez un organisme à but non lucratif et ${donationPercentage} % lui sera versé en votre nom, sans frais supplémentaires.`, // TODO: Update translation copy SDK-2210\n    submitButtonText: () => `Confirmer`, // TODO: Update translation copy SDK-2210\n    submitButtonTextCompleted: () => `Confirmé!`,\n    chooseButtonText: () => `Choisissez`, // TODO: Update translation copy SDK-2210\n  },\n  de: {\n    beamAttribution: () => `Unterstützt von Beam`,\n    ctaTitle: () => `Wähle deinen Impact`,\n    ctaPromoPrefixMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaPromoMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaMessage: ({ donationPercentage = \"1\" } = {}) =>\n      `Wähle eine der gemeinnützigen Organisationen und spende ${donationPercentage}% deines Einkaufs ohne zusätzliche Kosten`, // TODO: Update translation copy SDK-2210\n    submitButtonText: () => \"Bestätigen\", // TODO: Update translation copy SDK-2210\n    submitButtonTextCompleted: () => `Bestätigt!`,\n    chooseButtonText: () => `Wählen`, // TODO: Update translation copy SDK-2210\n  },\n  es: {\n    ctaTitle: () => \"Elige tu contribución\",\n    ctaPromoPrefixMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaPromoMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaMessage: ({ donationPercentage = \"1\" } = {}) =>\n      `Elige una organización sin fines de lucro y donaremos ${donationPercentage}% de tu compra sin coste adicional.`, // TODO: Update translation copy SDK-2210\n    beamAttribution: () => \"Ofrecido por Beam\",\n    submitButtonText: () => \"Confirmar\", // TODO: Update translation copy SDK-2210\n    submitButtonTextCompleted: () => \"¡Confirmado!\",\n    chooseButtonText: () => `Elige`, // TODO: Update translation copy SDK-2210\n  },\n  it: {\n    ctaTitle: () => \"Scegli dove fare la differenza\",\n    ctaPromoPrefixMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaPromoMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaMessage: ({ donationPercentage = \"1\" } = {}) =>\n      `Seleziona un'organizzazione no-profit a cui devolvere l’${donationPercentage}% del tuo acquisto, senza costi aggiuntivi`, // TODO: Update translation copy SDK-2210\n    beamAttribution: () => \"Gestito da Beam\",\n    submitButtonText: () => \"Confermare\", // TODO: Update translation copy SDK-2210\n    submitButtonTextCompleted: () => \"Confermato!\",\n    chooseButtonText: () => `Scegli`, // TODO: Update translation copy SDK-2210\n  },\n  pl: {\n    beamAttribution: () => `Wspierany przez Beam`,\n    ctaTitle: () => `Wybierz inicjatywę, którą chcesz wesprzeć`,\n    ctaPromoPrefixMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaPromoMessage: () => ``, // TODO: Update translation copy SDK-2210\n    ctaMessage: ({ donationPercentage = \"1\" } = {}) =>\n      `Wybierz organizację, której przekażesz ${donationPercentage}% wartości Twoich zakupów – bez żadnych dodatkowych kosztów!`, // TODO: Update translation copy SDK-2210\n    submitButtonText: () => `Zatwierdź`, // TODO: Update translation copy SDK-2210\n    submitButtonTextCompleted: () => `Zatwierdzono!`,\n    chooseButtonText: () => `Wybierz`, // TODO: Update translation copy SDK-2210\n  },\n};\n","import { css, html, LitElement, PropertyValues } from \"lit\";\nimport { repeat } from \"lit/directives/repeat.js\";\nimport { property } from \"lit/decorators/property.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { unsafeHTML } from \"lit/directives/unsafe-html.js\";\nimport { state } from \"lit/decorators/state.js\";\nimport debounce from \"lodash-es/debounce\";\nimport { AsyncController } from \"../../shared/controllers/async-controller\";\nimport { DEFAULT_BASE_URL, SUPPORTED_LANGUAGES, WIDGET_NAMES } from \"../../api-sdk/constants\";\nimport \"../../shared/components/progress-bar\";\nimport \"../../shared/components/promo-pill-label\";\nimport \"../beam-partner-logos\";\nimport { defineCustomElement } from \"../../shared/defineCustomElement\";\nimport { _loading } from \"../../shared/fragments/loading-template\";\nimport { _errorMessage } from \"../../shared/fragments/error-message-template\";\nimport { defineCustomText, useCustomText } from \"../../shared/fragments/custom-text\";\nimport { cssReset } from \"../../shared/css-reset\";\nimport { _cssVariableMap } from \"../../shared/fragments/css-variable-map\";\nimport { enforceConfig, areRequiredKeysDefined } from \"../../shared/enforce-config\";\nimport { BeamError, MissingConfig } from \"../../utils/beam-errors\";\nimport { TId, TNumericId } from \"../../shared/types\";\nimport { TCart } from \"../../shared/cart-contents\";\nimport { createScopedLocalStorage } from \"../../utils/local-storage\";\nimport { cssCardGrid } from \"../../shared/fragments/css-card-grid\";\nimport { postChainEligibleNonprofitsForCart, putTransaction } from \"../../api-sdk/v3/routes\";\nimport { LANGUAGES } from \"../../api-sdk/types\";\nimport { BeamNonprofitSelectEvent } from \"../../utils/events\";\nimport { localizeUserString } from \"../../shared/localize\";\nimport { progressBarConfigDefaults } from \"../../shared/components/progress-bar\";\nimport { partnerLogosConfigDefaults } from \"../beam-partner-logos\";\nimport { promoPillLabelConfigDefaults } from \"../../shared/components/promo-pill-label\";\nimport { _radioButton } from \"../../shared/fragments/radioButton\";\nimport { strings } from \"./strings\";\n\ninterface TRequiredConfig {\n  apiKey: string;\n  transactionId: TId;\n}\n\ntype TIAPIV3GetChainNonprofits = Awaited<ReturnType<typeof import(\"../../api-sdk/v3/routes\").getChainNonprofits>>;\ntype TIAPIV3EligibleNonprofits = Awaited<\n  ReturnType<typeof import(\"../../api-sdk/v3/routes\").getChainNonprofits>\n>[\"nonprofits\"];\ntype TIAPIV3Nonprofit = TIAPIV3EligibleNonprofits[number];\nexport class BeamRedeemTransaction extends LitElement {\n  static tagName = \"beam-redeem-transaction\";\n\n  @property({ type: String }) public baseUrl: string = DEFAULT_BASE_URL;\n\n  @property({ type: String }) public apiKey?: TRequiredConfig[\"apiKey\"];\n\n  @property({ type: Number }) public transactionId?: TRequiredConfig[\"transactionId\"];\n\n  @property({ type: Number }) public storeId?: TNumericId;\n\n  @property({ type: String }) public countryCode?: string;\n\n  @property({ type: String }) public postalCode?: string;\n\n  @property({ type: Object }) public cart?: TCart;\n\n  @property({ type: Number, reflect: true })\n  public selectedNonprofitId?: TNumericId;\n\n  @property({ type: String }) public lang: LANGUAGES = \"en\";\n\n  @property({ type: Boolean }) public debug = false;\n\n  @property({ type: Boolean }) public draftConfig = false;\n\n  @state() private isMobile = window.innerWidth < 768;\n\n  @state() private didUserExpandNonprofits = false;\n\n  @state() private shouldUsePromoUI = false;\n\n  get configLang() {\n    return SUPPORTED_LANGUAGES[this.lang] || \"en\";\n  }\n\n  private get hasCorrectTransactionConfig(): boolean {\n    const requiredKeys: (keyof TRequiredConfig)[] = [\"apiKey\", \"transactionId\"];\n    const isTransactionConfigCorrect = areRequiredKeysDefined(requiredKeys, this);\n    return isTransactionConfigCorrect;\n  }\n\n  private getChainNonprofits = async () => {\n    if (!this.hasCorrectTransactionConfig) {\n      throw new MissingConfig();\n    }\n\n    const res = await postChainEligibleNonprofitsForCart({\n      baseUrl: this.baseUrl,\n      headers: { authorization: `Api-Key ${this.apiKey}` },\n      requestBody: {\n        storeId: this.storeId,\n        postalCode: this.postalCode,\n        countryCode: this.countryCode,\n        transactionId: String(this.transactionId),\n        cart: this.cart ?? undefined,\n        widgetName: WIDGET_NAMES.redeem_transaction,\n        options: {\n          config: {\n            draftConfig: this.draftConfig,\n          },\n        },\n        version: \"2.0.0\",\n        lang: this.configLang,\n      },\n    });\n\n    // If store ID was not provided, get the store ID from response here\n    if (res.store?.id && res.store.id !== this.storeId) {\n      this.storeId = res.store.id;\n    }\n\n    this.localStorage.setItemJson(\"chainNonprofits\", {\n      createdAt: new Date(),\n      data: res,\n    });\n\n    return res;\n  };\n\n  private updateNonprofitIdForRecord = async ({ selectedNonprofitId }: { selectedNonprofitId: TNumericId }) => {\n    if (this.transactionId) {\n      return this.putTransaction({ selectedNonprofitId });\n    }\n    return null;\n  };\n  private putTransaction = async ({ selectedNonprofitId }: { selectedNonprofitId: TNumericId }) => {\n    if (!enforceConfig<TRequiredConfig>([\"apiKey\", \"transactionId\"], this)) {\n      throw new MissingConfig();\n    }\n    return putTransaction({\n      baseUrl: this.baseUrl,\n      headers: {\n        authorization: `Api-Key ${this.apiKey}`,\n      },\n      pathParams: {\n        transactionId: Number(this.transactionId), // TODO SDK-2388: fix api spec for PUT transaction/:id to use string\n      },\n      requestBody: {\n        nonprofitId: selectedNonprofitId,\n      },\n    });\n  };\n\n  private nonprofitListDataController = new AsyncController<typeof this.getChainNonprofits>(\n    this,\n    this.getChainNonprofits\n  );\n\n  private selectionDataController = new AsyncController<typeof this.updateNonprofitIdForRecord>(\n    this,\n    this.updateNonprofitIdForRecord\n  );\n\n  private localStorage = createScopedLocalStorage(this as LitElement & TRequiredConfig);\n\n  connectedCallback() {\n    super.connectedCallback();\n    window.addEventListener(\"resize\", this.evaluateBreakPoints);\n  }\n\n  async firstUpdated(_changedProperties: PropertyValues) {\n    await this.restoreStateFromCache();\n  }\n\n  async updated(previousPropertyValues: PropertyValues) {\n    // Reload nonprofit list on change of any of these props:\n    // Also fires on first load as props go from undefined => value\n    const requireNewDataProps = [\"baseUrl\", \"storeId\", \"apiKey\", \"countryCode\", \"postalCode\", \"lang\"];\n    for (const prop of requireNewDataProps) {\n      if (previousPropertyValues.has(prop)) {\n        await this.nonprofitListDataController.exec();\n        break;\n      }\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n  }\n\n  private restoreStateFromCache() {\n    if (!enforceConfig<TRequiredConfig>([\"apiKey\"], this)) throw new MissingConfig();\n\n    this.selectedNonprofitId = parseInt(this.localStorage.getItem(\"nonprofit\") || \"\") || undefined;\n    try {\n      // try to restore nonprofit list if we have data and it's not too old\n      // list will continue to refresh async and replace this data when ready\n      const { createdAt = 0, data } =\n        this.localStorage.getItemJson<{ createdAt: string; data: any }>(\"chainNonprofits\") || {};\n      const cacheTtl = 2 * 60 * 60 * 1000;\n      if (new Date(createdAt).valueOf() + cacheTtl > new Date().valueOf()) {\n        this.nonprofitListDataController.data = data;\n        this.nonprofitListDataController.loading = false;\n      }\n    } catch (err) {\n      // ignore cache retrieval error and continue to fetch data\n    }\n  }\n\n  /**\n   * Factory for selection event handler\n   *\n   * Nonprofit selector implements radio-button semantics:\n   * * If nothing is selected, tabbing into selector selects first card\n   * * Arrow keys changes focus between cards, but doesn't select\n   * * Enter/Space sets selection\n   * * If a nonprofit is selected, arrow keys change focus AND selection\n   * * Click sets selection\n   * @param {number} id\n   * @param {number} index\n   * @param {{id: number}[]} nonprofits\n   * @returns {(evt: Event) => void}\n   */\n  private makeHandleSelect =\n    (id: number, index: number, nonprofits: { nonprofit: { id: number } }[]): ((event: Event) => void) =>\n    async (event: Event) => {\n      if (!this.allowChange) return;\n      const currentId = this.selectedNonprofitId;\n      if (event instanceof KeyboardEvent) {\n        let nextFocus = null;\n        switch (event.key) {\n          case \"ArrowUp\":\n          case \"ArrowLeft\":\n            if (index === 0) {\n              nextFocus = nonprofits[nonprofits.length - 1];\n            } else {\n              nextFocus = nonprofits[index - 1];\n            }\n            event.preventDefault();\n            break;\n          case \"ArrowRight\":\n          case \"ArrowDown\":\n            if (index === nonprofits.length - 1) {\n              nextFocus = nonprofits[0];\n            } else {\n              nextFocus = nonprofits[index + 1];\n            }\n            event.preventDefault();\n            break;\n          case \"Enter\":\n          case \" \":\n            event.preventDefault();\n            break; // continue to toggle-selection block below\n          default:\n            return;\n        }\n        if (nextFocus) {\n          const focusTarget = this.renderRoot.querySelector(`[data-value=\"${nextFocus.nonprofit.id}\"]`) as HTMLElement;\n          if (focusTarget !== null) {\n            focusTarget.tabIndex = 0;\n            focusTarget.focus();\n          }\n          return;\n        }\n      }\n      // Handle selection with click or Enter/Space key\n      const targetEl = event.currentTarget;\n      if (targetEl instanceof HTMLElement) {\n        if (currentId === id) {\n          // this[\"selected-nonprofit-id\"] = undefined; // unset (not supported)\n          return; // no API call or localStorage change needed\n        } else {\n          this.selectedNonprofitId = id;\n        }\n      }\n    };\n\n  get allowChange() {\n    // Disallow change if already submitted\n    return this.selectionDataController.data == null && !this.selectionDataController.loading;\n  }\n\n  get allowSubmit() {\n    // Disabled if no nonprofit has been selected yet or if submission was already received\n    return Boolean(this.selectedNonprofitId && this.allowChange);\n  }\n\n  handleSubmit = async () => {\n    const { selectedNonprofitId } = this;\n    if (!this.allowSubmit || selectedNonprofitId == null) return;\n    await this.selectionDataController.exec({ selectedNonprofitId });\n\n    this.localStorage.setItem(\"nonprofit\", selectedNonprofitId);\n    this.localStorage.setItem(\"nonprofit_selected_at\", new Date().toISOString());\n\n    const selectedNonprofit = this.nonprofitListDataController?.data?.nonprofits.find(\n      (np) => np.nonprofit.id === selectedNonprofitId\n    );\n\n    this.dispatchEvent(\n      new BeamNonprofitSelectEvent({\n        selectedNonprofitId,\n        nonprofitName: selectedNonprofit?.nonprofit.name,\n        source: WIDGET_NAMES.redeem_transaction,\n      })\n    );\n  };\n\n  evaluateBreakPoints = debounce(\n    () => {\n      this.isMobile = window.innerWidth < 768;\n    },\n    50,\n    { maxWait: 50, leading: true }\n  );\n\n  public get cssVariables() {\n    const defaults = {\n      \"--beam-fontFamily\": \"inherit\",\n      \"--beam-fontStyle\": \"inherit\",\n      \"--beam-fontSize\": \"inherit\",\n      \"--beam-textColor\": \"inherit\",\n      \"--beam-backgroundColor\": \"inherit\",\n      ...defineCustomText(\"--beam-RedeemTransaction-title\", {\n        fontSize: \"1.25em\",\n        fontWeight: \"bold\",\n      }),\n      ...defineCustomText(\"--beam-RedeemTransaction-description\", {\n        marginTop: \"0.5em\",\n        lineHeight: \"normal\",\n      }),\n      ...partnerLogosConfigDefaults,\n      ...progressBarConfigDefaults,\n      \"--beam-RedeemTransaction-maxWidth\": \"1000px\",\n      \"--beam-RedeemTransaction-submitButton-fontSize\": \"14px\",\n      \"--beam-RedeemTransaction-submitButton-fontWeight\": \"inherit\",\n      \"--beam-RedeemTransaction-submitButton-fontFamily\": \"inherit\",\n      \"--beam-RedeemTransaction-submitButton-textTransform\": \"uppercase\",\n      \"--beam-RedeemTransaction-submitButton-color\": \"#fff\",\n      \"--beam-RedeemTransaction-submitButton-backgroundColor\": \"#000000\",\n      \"--beam-RedeemTransaction-submitButton-borderRadius\": \"0px\",\n      \"--beam-RedeemTransaction-submitButton-borderColor\": \"#000000\",\n      \"--beam-RedeemTransaction-submitButton-padding\": \"16px 0px\",\n      \"--beam-RedeemTransaction-submitButton-width\": \"100%\",\n      \"--beam-RedeemTransaction-submitButton-marginTop\": \"10px\",\n      \"--beam-RedeemTransaction-submitButton-marginBottom\": \"10px\",\n      \"--beam-RedeemTransaction-submitButtonContainer-display\": \"flex\",\n      \"--beam-RedeemTransaction-submitButtonContainer-backgroundColor\": \"#fff\",\n      \"--beam-RedeemTransaction-submitButton-hover-backgroundColor\": \"#000000\",\n      \"--beam-RedeemTransaction-submitButton-hover-borderColor\": \"#000000\",\n      \"--beam-RedeemTransaction-submitButton-hover-color\": \"#fff\",\n      \"--beam-RedeemTransaction-submitButton-disabled-borderColor\": \"#767676\",\n      \"--beam-RedeemTransaction-submitButton-disabled-backgroundColor\": \"#767676\",\n      \"--beam-RedeemTransaction-submitButton-disabled-color\": \"#fff\",\n      \"--beam-RedeemTransaction-radioButton-color\": \"transparent\",\n      \"--beam-RedeemTransaction-radioButton-borderColor\": \"#707070\",\n      \"--beam-RedeemTransaction-radioButton-backgroundColor\": \"#fff\",\n      \"--beam-RedeemTransaction-radioButton-hover-color\": \"#fff\",\n      \"--beam-RedeemTransaction-radioButton-hover-backgroundColor\": \"#000\",\n      \"--beam-RedeemTransaction-radioButton-hover-borderColor\": \"#000\",\n      \"--beam-RedeemTransaction-radioButton-selected-borderColor\": \"#000\",\n      \"--beam-RedeemTransaction-radioButton-selected-backgroundColor\": \"#000\",\n      \"--beam-RedeemTransaction-radioButton-selected-color\": \"#fff\",\n      \"--beam-RedeemTransaction-options-minWidth\": \"0px\",\n      \"--beam-RedeemTransaction-options-columnCount\": \"1\",\n      \"--beam-RedeemTransaction-options-borderWidth\": \"1px\",\n      \"--beam-RedeemTransaction-options-image-borderRadius\": \"8px\",\n      \"--beam-RedeemTransaction-options-image-height\": \"70px\",\n      \"--beam-RedeemTransaction-options-image-height-mobile\": \"75px\",\n      \"--beam-RedeemTransaction-options-borderColor\": \"#d9d9d9\",\n      \"--beam-RedeemTransaction-options-backgroundColor\": \"transparent\",\n      \"--beam-RedeemTransaction-options-marginTop\": \"15px\",\n      \"--beam-RedeemTransaction-options-hover-backgroundColor\": \"#f1f1f1\",\n      \"--beam-RedeemTransaction-options-hover-borderWidth\": \".5px\",\n      \"--beam-RedeemTransaction-options-hover-borderColor\": \"#000000\",\n      \"--beam-RedeemTransaction-options-selected-borderColor\": \"#000000\",\n      \"--beam-RedeemTransaction-options-selected-borderWidth\": \".5px\",\n      \"--beam-RedeemTransaction-options-selected-backgroundColor\": \"#eee\",\n      ...defineCustomText(\"--beam-RedeemTransaction-options-details\", {\n        fontSize: \"0.85em\",\n        marginTop: \"0px\",\n        lineHeight: \"normal\",\n        letterSpacing: \"-0.45px\",\n      }),\n      ...defineCustomText(\"--beam-RedeemTransaction-options-details-cause\", {\n        fontSize: \"1em\",\n        fontWeight: \"bold\",\n      }),\n      \"--beam-RedeemTransaction-options-details-nonprofitName-fontWeight\": \"normal\",\n      \"--beam-RedeemTransaction-options-details-nonprofitName-fontStyle\": \"inherit\",\n      \"--beam-RedeemTransaction-options-details-fundingProgress-marginTop\": \"3px\", // update after class name addition\n      ...defineCustomText(\"--beam-RedeemTransaction-options-details-fundingProgressLabel\", {\n        fontSize: \"0.85em\",\n        textTransform: \"capitalize\",\n      }),\n      \"--beam-RedeemTransaction-cardStyle\": \"'image'\", // icon, selected_icon, image\n      \"--beam-RedeemTransaction-options-icon-padding\": \"0px\",\n      \"--beam-RedeemTransaction-options-icon-backgroundColor\": \"#F3F3F3\",\n      \"--beam-RedeemTransaction-options-collapseNonprofits-mobile\": \"false\",\n      \"--beam-RedeemTransaction-options-collapseNonprofits-desktop\": \"false\",\n      \"--beam-RedeemTransaction-image-width\": \"13%\",\n      \"--beam-RedeemTransaction-image-height\": \"50%\",\n      \"--beam-RedeemTransaction-image-width-mobile\": \"16%\",\n      ...promoPillLabelConfigDefaults,\n    };\n\n    const remoteConfig = this.nonprofitListDataController?.data?.config?.web?.theme || {};\n\n    const config = { ...defaults, ...remoteConfig };\n\n    const serializable = Object.create({\n      toCSS() {\n        return _cssVariableMap(this as Record<string, string>);\n      },\n    });\n\n    return Object.assign(serializable, config);\n  }\n\n  static styles = [\n    cssReset,\n    css`\n      :host {\n        display: block;\n        max-width: var(--beam-RedeemTransaction-maxWidth);\n        font-family: var(--beam-fontFamily);\n        font-style: var(--beam-fontStyle);\n        font-size: var(--beam-fontSize);\n        background-color: var(--beam-backgroundColor);\n        color: var(--beam-textColor);\n        word-break: normal;\n      }\n\n      .headerContainer {\n        align-items: flex-start;\n        justify-content: space-between;\n        display: flex;\n        order: 2;\n      }\n\n      .submitButtonContainer {\n        margin-top: var(--beam-RedeemTransaction-submitButton-marginTop);\n        margin-bottom: var(--beam-RedeemTransaction-submitButton-marginBottom);\n        background-color: var(--beam-RedeemTransaction-submitButtonContainer-backgroundColor);\n        display: var(--beam-RedeemTransaction-submitButtonContainer-display);\n      }\n\n      .submitButton {\n        color: var(--beam-RedeemTransaction-submitButton-color);\n        background-color: var(--beam-RedeemTransaction-submitButton-backgroundColor);\n        border: 1px solid var(--beam-RedeemTransaction-submitButton-borderColor);\n        font-size: var(--beam-RedeemTransaction-submitButton-fontSize);\n        font-weight: var(--beam-RedeemTransaction-submitButton-fontWeight);\n        font-family: var(--beam-RedeemTransaction-submitButton-fontFamily);\n        text-transform: var(--beam-RedeemTransaction-submitButton-textTransform);\n        border-radius: var(--beam-RedeemTransaction-submitButton-borderRadius);\n        padding: var(--beam-RedeemTransaction-submitButton-padding);\n        width: var(--beam-RedeemTransaction-submitButton-width);\n        transition: background-color 0.2s, border-color 0.2s, color 0.2s;\n        cursor: pointer;\n      }\n\n      .submitButton:not(.isDisabled):focus-visible,\n      .submitButton:not(.isDisabled):hover {\n        background-color: var(--beam-RedeemTransaction-submitButton-hover-backgroundColor);\n        border-color: var(--beam-RedeemTransaction-submitButton-hover-borderColor);\n        color: var(--beam-RedeemTransaction-submitButton-hover-color);\n      }\n\n      .submitButton.isDisabled {\n        color: var(--beam-RedeemTransaction-submitButton-disabled-color);\n        background-color: var(--beam-RedeemTransaction-submitButton-disabled-backgroundColor);\n        border-color: var(--beam-RedeemTransaction-submitButton-disabled-borderColor);\n        cursor: not-allowed;\n      }\n\n      .options {\n        margin-top: var(--beam-RedeemTransaction-options-marginTop);\n        order: 3;\n        flex-grow: 1;\n      }\n\n      .options.isHidden {\n        display: none;\n      }\n\n      .option {\n        border: var(--beam-RedeemTransaction-options-borderWidth) solid\n          var(--beam-RedeemTransaction-options-borderColor);\n        border-bottom: none;\n        background-color: var(--beam-RedeemTransaction-options-backgroundColor);\n        cursor: pointer;\n        transition: border-color 0.2s, background-color 0.2s, outline 0.2s;\n      }\n\n      .option:first-child {\n        border-radius: 8px 8px 0 0; /* Top corners rounded */\n      }\n\n      .option:last-child {\n        border-bottom: var(--beam-RedeemTransaction-options-borderWidth) solid\n          var(--beam-RedeemTransaction-options-borderColor);\n        border-radius: 0 0 8px 8px; /* Bottom corners rounded */\n      }\n\n      .option:not(.isDisabled):not(:last-child):focus-visible,\n      .option:not(.isDisabled):not(:last-child):hover,\n      .option:not(.isSelected):not(:last-child):focus-visible,\n      .option:not(.isSelected):not(:last-child):hover {\n        background-color: var(--beam-RedeemTransaction-options-hover-backgroundColor);\n        outline: var(--beam-RedeemTransaction-options-hover-borderWidth) solid\n          var(--beam-RedeemTransaction-options-hover-borderColor);\n        border-bottom: var(--beam-RedeemTransaction-options-hover-borderWidth) solid\n          var(--beam-RedeemTransaction-options-hover-borderColor);\n      }\n\n      .option:not(.isDisabled):focus-visible,\n      .option:not(.isDisabled):hover,\n      .option:not(.isSelected):focus-visible,\n      .option:not(.isSelected):hover {\n        background-color: var(--beam-RedeemTransaction-options-hover-backgroundColor);\n        outline: var(--beam-RedeemTransaction-options-hover-borderWidth) solid\n          var(--beam-RedeemTransaction-options-hover-borderColor);\n      }\n\n      .option.isDisabled {\n        cursor: not-allowed;\n      }\n\n      .option.isSelected {\n        outline: var(--beam-RedeemTransaction-options-selected-borderWidth) solid\n          var(--beam-RedeemTransaction-options-selected-borderColor);\n        background-color: var(--beam-RedeemTransaction-options-selected-backgroundColor);\n        border-bottom: var(--beam-RedeemTransaction-options-selected-borderWidth) solid\n          var(--beam-RedeemTransaction-options-selected-borderColor);\n      }\n\n      .option.isSelected:focus-visible,\n      .option.isSelected:hover {\n        outline: var(--beam-RedeemTransaction-options-selected-borderWidth) solid\n          var(--beam-RedeemTransaction-options-selected-borderColor);\n        border-bottom: var(--beam-RedeemTransaction-options-selected-borderWidth) solid\n          var(--beam-RedeemTransaction-options-selected-borderColor);\n      }\n\n      .option .radioButton {\n        border-width: 1px;\n        border-style: solid;\n        transition: background-color 0.2s, color 0.2s, border-color 0.2s;\n        color: var(--beam-RedeemTransaction-radioButton-color);\n        background-color: var(--beam-RedeemTransaction-radioButton-backgroundColor);\n        border-color: var(--beam-RedeemTransaction-radioButton-borderColor);\n      }\n\n      .option.isSelected .radioButton,\n      .option.isSelected:focus-visible .radioButton,\n      .option.isSelected:hover .radioButton {\n        color: var(--beam-RedeemTransaction-radioButton-selected-color);\n        background-color: var(--beam-RedeemTransaction-radioButton-selected-backgroundColor);\n        border-color: var(--beam-RedeemTransaction-radioButton-selected-borderColor);\n      }\n\n      .option:not(.isSelected):focus-visible .radioButton,\n      .option:not(.isSelected):hover .radioButton {\n        color: var(--beam-RedeemTransaction-radioButton-hover-color);\n        background-color: var(--beam-RedeemTransaction-radioButton-hover-backgroundColor);\n        border-color: var(--beam-RedeemTransaction-radioButton-hover-borderColor);\n      }\n\n      .detailsDescription {\n        ${useCustomText(\"--beam-RedeemTransaction-options-details\")}\n      }\n\n      .detailsDescription .nonprofitName {\n        font-weight: var(--beam-RedeemTransaction-options-details-nonprofitName-fontWeight);\n        font-style: var(--beam-RedeemTransaction-options-details-nonprofitName-fontStyle);\n      }\n\n      .radioButtonContainer {\n        height: 100%;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex: 0 0 auto;\n      }\n\n      .radioButton {\n        padding: 5px;\n        border-radius: 100%;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n      }\n\n      .imageContainer {\n        flex: 1 0 var(--beam-RedeemTransaction-image-width);\n        display: flex;\n        flex-direction: column;\n      }\n\n      .progressBarContainer {\n        display: flex;\n        align-items: center;\n      }\n\n      .details-progressBarLabel {\n        ${useCustomText(\"--beam-RedeemTransaction-options-details-fundingProgressLabel\")}\n        white-space: nowrap;\n        text-align: right;\n        margin-left: 15px;\n      }\n\n      .details {\n        flex: 1 1 100%;\n        display: flex;\n        flex-direction: column;\n        gap: 5px;\n      }\n\n      .root {\n        display: flex;\n        flex-direction: column;\n      }\n\n      .submitButtonContainer {\n        order: 4;\n        position: sticky;\n        bottom: 0;\n        z-index: 999;\n      }\n\n      .icon-background {\n        width: 50px;\n        height: 50px;\n        border-radius: 50%;\n        overflow: hidden;\n        background: var(--beam-RedeemTransaction-options-icon-backgroundColor);\n        display: flex;\n        justify-content: center;\n        align-items: center;\n      }\n\n      .icon {\n        height: var(--beam-RedeemTransaction-image-height);\n      }\n\n      .icon-container {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n      }\n    `,\n    cssCardGrid({\n      gap: \"0px\",\n      itemMinWidth: \"var(--beam-RedeemTransaction-options-minWidth, 0px)\",\n      columnCount: \"var(--beam-RedeemTransaction-options-columnCount, 1)\",\n    }),\n  ];\n\n  private handleChooseClick() {\n    this.didUserExpandNonprofits = true;\n  }\n\n  get shouldCollapse() {\n    const enableMobileCollapse = this.cssVariables[\"--beam-RedeemTransaction-options-collapseNonprofits-mobile\"];\n    const enableDesktopCollapse = this.cssVariables[\"--beam-RedeemTransaction-options-collapseNonprofits-desktop\"];\n    const isMobileCollapseEnabled = enableMobileCollapse?.toLowerCase() === \"true\";\n    const isDesktopCollapseEnabled = enableDesktopCollapse?.toLowerCase() === \"true\";\n\n    return (this.isMobile && isMobileCollapseEnabled) || (!this.isMobile && isDesktopCollapseEnabled);\n  }\n\n  private renderSubmitButton(data: TIAPIV3GetChainNonprofits) {\n    return html`\n      ${this.didUserExpandNonprofits || !this.shouldCollapse\n        ? html` <button\n            type=\"button\"\n            ?aria-disabled=${!this.allowSubmit}\n            @click=\"${this.handleSubmit}\"\n            class=\"${classMap({\n              isDisabled: !this.allowSubmit,\n              submitButton: true,\n            })}\"\n            part=\"submitButton\"\n          >\n            ${this.selectionDataController.data !== null\n              ? localizeUserString(\n                  this.configLang,\n                  data?.config?.web?.confirmedButton || strings[this.configLang].submitButtonTextCompleted()\n                )\n              : localizeUserString(\n                  this.configLang,\n                  data?.config?.web?.confirmButton || strings[this.configLang].submitButtonText()\n                )}\n          </button>`\n        : html`\n            <button type=\"button\" @click=\"${this.handleChooseClick}\" class=\"submitButton\" part=\"submitButton\">\n              ${localizeUserString(\n                this.configLang,\n                data?.config?.web?.collapsedButton || strings[this.configLang].chooseButtonText()\n              )}\n            </button>\n          `}\n    `;\n  }\n\n  private renderRadioButton() {\n    return html`\n      <div class=\"radioButtonContainer\">\n        <span part=\"radioButton\" class=\"radioButton\">\n          <span style=\"line-height: 0;\"> ${_radioButton({ height: \"7px\", width: \"7px\" })} </span>\n        </span>\n      </div>\n    `;\n  }\n\n  private renderNonprofitImage(np: TIAPIV3Nonprofit, displayIcon: boolean) {\n    const cardStyle = this.cssVariables[\"--beam-RedeemTransaction-cardStyle\"];\n\n    const imageUrl = displayIcon\n      ? cardStyle === \"'icon'\"\n        ? np.nonprofit.causeIconUrl\n        : cardStyle === \"'selected_icon'\"\n        ? np.nonprofit.causeIconSelectedUrl\n        : np.imageUrl\n      : np.imageUrl;\n\n    return html`\n      ${displayIcon\n        ? html` <div class=\"icon-container\">\n            <div class=\"icon-background\">\n              <img src=\"${imageUrl}\" alt=\"\" role=\"presentation\" class=\"icon\" />\n            </div>\n          </div>`\n        : html` <div\n            class=\"image-container\"\n            style=\"${this.isMobile\n              ? \"flex: 1 0 var(--beam-RedeemTransaction-image-width-mobile)\"\n              : \"flex: 1 0 var(--beam-RedeemTransaction-image-width)\"}\"\n          >\n            <img\n              src=\"${imageUrl}\"\n              alt=\"\"\n              role=\"presentation\"\n              class=\"image\"\n              style=\"\n            width: 100%;\n            height: ${this.isMobile\n                ? \"var(--beam-RedeemTransaction-options-image-height-mobile)\"\n                : \"var(--beam-RedeemTransaction-options-image-height)\"};\n            object-fit: cover;\n            border-radius: var(--beam-RedeemTransaction-options-image-borderRadius);}\n            \"\n            />\n          </div>`}\n    `;\n  }\n\n  private renderOptionDetail(np: TIAPIV3Nonprofit) {\n    return html`\n      <div class=\"detailsCause\" style=\"${useCustomText(\"--beam-RedeemTransaction-options-details-cause\")}\">\n        ${localizeUserString(this.configLang, np.nonprofit.cause || \"\")}\n      </div>\n      <p class=\"detailsDescription\">${unsafeHTML(localizeUserString(this.configLang, np.impact.description || \"\"))}</p>\n    `;\n  }\n\n  private renderProgressBar(np: TIAPIV3Nonprofit) {\n    return html`\n      <div class=\"progressBarContainer\">\n        <beam-progress-bar value=\"${np.impact.goalProgressPercentage}\" style=\"flex: 1;\"></beam-progress-bar>\n        <span class=\"details-progressBarLabel\">\n          ${localizeUserString(this.configLang, np.impact.goalProgressText)}\n        </span>\n      </div>\n    `;\n  }\n\n  private renderNonprofitDetails(\n    np: TIAPIV3Nonprofit,\n    hasNonprofitWithInactivePromo: boolean,\n    data: TIAPIV3GetChainNonprofits\n  ) {\n    return html`\n      <div class=\"details\" part=\"details\">\n        ${this.renderOptionDetail(np)} ${this.renderPromoPill(np, hasNonprofitWithInactivePromo, data)}\n      </div>\n    `;\n  }\n\n  private renderPromoPill(\n    np: TIAPIV3Nonprofit,\n    hasNonprofitWithInactivePromo: boolean,\n    data: TIAPIV3GetChainNonprofits\n  ) {\n    return html`\n      ${np.promo?.isActive && this.shouldUsePromoUI && hasNonprofitWithInactivePromo\n        ? html`<beam-promo-info-pill .promo=${data?.config?.web?.promo} shortVersion></beam-promo-info-pill>`\n        : html``}\n    `;\n  }\n\n  protected render() {\n    const { selectedNonprofitId } = this;\n    const { data, loading } = this.nonprofitListDataController;\n\n    if (loading && !data) {\n      return _loading();\n    }\n    if (this.nonprofitListDataController.error) {\n      if (this.debug) {\n        return _errorMessage({ error: this.nonprofitListDataController.error });\n      }\n      return \"\";\n    }\n    if (this.selectionDataController.error) {\n      if (this.debug) {\n        return _errorMessage({ error: this.selectionDataController.error });\n      }\n      // do not show error screen for interactive errors by default\n    }\n    if (data == null) {\n      if (this.debug) {\n        return _errorMessage({ error: new BeamError(\"No data\") });\n      }\n      return \"\";\n    }\n    const nonprofits = data?.nonprofits || [];\n    const selectedNonprofit = nonprofits.find((np) => np.nonprofit.id === selectedNonprofitId) || null;\n    // changes images in widget to icons\n    const displayIcon =\n      this.cssVariables[\"--beam-RedeemTransaction-cardStyle\"] === \"'icon'\" ||\n      this.cssVariables[\"--beam-RedeemTransaction-cardStyle\"] === \"'selected_icon'\";\n    this.shouldUsePromoUI = data?.config?.web?.promo ? true : false; // new promo UI\n    const hasNonprofitWithInactivePromo = nonprofits.some((nonprofit) => !nonprofit.promo || !nonprofit.promo.isActive);\n\n    return html`\n      <style>\n        :host {\n          ${this.cssVariables.toCSS()}\n        }\n      </style>\n      <!-- Custom flex order fixes tab cycling so submit button is after content -->\n      <div style=\"display: flex; flex-direction: column;\" class=\"root\">\n        <div\n          style=\"order: 3;\"\n          tabindex=\"-1\"\n          class=\"options cardGrid ${classMap({ isHidden: !this.didUserExpandNonprofits && this.shouldCollapse })}\"\n          part=\"options\"\n          role=\"radiogroup\"\n          aria-labelledby=\"beam-RedeemTransaction-title\"\n          ?aria-disabled=${!this.allowChange}\n        >\n          ${repeat(\n            nonprofits,\n            (i) => i.nonprofit.id,\n            (np, index) => {\n              const isSelected = selectedNonprofitId === np.nonprofit.id;\n              const isFocusable = isSelected || (selectedNonprofit == null && index === 0);\n              return html`\n                <div\n                  class=\"option ${classMap({\n                    isSelected: isSelected,\n                    isDisabled: !this.allowChange,\n                  })}\"\n                  part=\"option\"\n                  role=\"radio\"\n                  tabindex=\"${isFocusable ? 0 : -1}\"\n                  data-value=${np.nonprofit.id}\n                  ?aria-checked=${isSelected}\n                  @click=${this.makeHandleSelect(np.nonprofit.id, index, nonprofits)}\n                  @keydown=${this.makeHandleSelect(np.nonprofit.id, index, nonprofits)}\n                  aria-label=\"${localizeUserString(this.configLang, np.nonprofit.cause || \"\")}\"\n                  style=\"display: flex; flex-direction: column; padding: 11px; justify-content:center;\"\n                >\n                  <div class=\"optionContainer\" style=\"display: flex; align-items: flex-start; gap: 8px;\">\n                    ${this.renderRadioButton()}\n                    <div\n                      class=\"nonprofitInfoContainer\"\n                      style=\"flex: 1; display: flex; flex-direction: column; gap: 5px;\"\n                    >\n                      <div class=\"imageDetailContainer\" style=\"display: flex; gap: 8px;\">\n                        ${this.renderNonprofitImage(np, displayIcon)}\n                        ${this.renderNonprofitDetails(np, hasNonprofitWithInactivePromo, data)}\n                      </div>\n                      ${this.renderProgressBar(np)}\n                    </div>\n                  </div>\n                </div>\n              `;\n            }\n          )}\n        </div>\n\n        <div class=\"submitButtonContainer\">${this.renderSubmitButton(data)}</div>\n\n        <div class=\"headerContainer\">\n          <div>\n            <div\n              class=\"header-promo-pill-container\"\n              style=\"display: flex; ${this.isMobile && \"flex-direction: column; align-items: flex-start;\"}\"\n            >\n              <h3\n                class=\"title\"\n                part=\"title\"\n                id=\"beam-RedeemTransaction-title\"\n                style=\"${useCustomText(\"--beam-RedeemTransaction-title\")}; margin-right: 8px;\"\n              >\n                ${localizeUserString(this.configLang, data?.config?.web?.title) || strings[this.configLang].ctaTitle()}\n              </h3>\n              ${this.shouldUsePromoUI\n                ? html`<beam-promo-info-pill\n                    .promo=${data?.config?.web?.promo}\n                    style=\"${this.isMobile && \"order: -1; margin-bottom:10px;\"}\"\n                  ></beam-promo-info-pill>`\n                : html``}\n            </div>\n            <p class=\"description\" part=\"description\" style=\"${useCustomText(\"--beam-RedeemTransaction-description\")}\">\n              ${this.shouldUsePromoUI\n                ? html`<span style=\"font-weight:bold\">\n                      ${localizeUserString(this.configLang, data?.config?.web?.promoDescriptionPrefix || \"\") ||\n                      strings[this.configLang].ctaPromoPrefixMessage()}\n                    </span>\n                    <span>\n                      ${localizeUserString(this.configLang, data?.config?.web?.promoDescription || \"\") ||\n                      strings[this.configLang].ctaPromoMessage()}\n                    </span>`\n                : html`<span\n                    >${localizeUserString(this.configLang, data?.config?.web?.description || \"\") ||\n                    strings[this.configLang].ctaMessage()}\n                  </span>`}\n            </p>\n          </div>\n        </div>\n\n        <beam-partner-logos\n          partnerName=\"${data.chain.name}\"\n          partnerLogoUrl=\"${data.chain.logoUrl}\"\n          style=\"order: 1\"\n        ></beam-partner-logos>\n      </div>\n    `;\n  }\n}\n\ndefineCustomElement(BeamRedeemTransaction);\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"beam-redeem-transaction\": BeamRedeemTransaction;\n  }\n}\n"],"names":["_radioButton","height","width","html","styleMap","strings","donationPercentage","BeamRedeemTransaction","LitElement","DEFAULT_BASE_URL","MissingConfig","res","postChainEligibleNonprofitsForCart","WIDGET_NAMES","selectedNonprofitId","enforceConfig","putTransaction","AsyncController","createScopedLocalStorage","id","index","nonprofits","event","currentId","nextFocus","focusTarget","selectedNonprofit","np","BeamNonprofitSelectEvent","debounce","SUPPORTED_LANGUAGES","areRequiredKeysDefined","_changedProperties","previousPropertyValues","requireNewDataProps","prop","createdAt","data","cacheTtl","defaults","defineCustomText","partnerLogosConfigDefaults","progressBarConfigDefaults","promoPillLabelConfigDefaults","remoteConfig","config","_cssVariableMap","enableMobileCollapse","enableDesktopCollapse","isMobileCollapseEnabled","isDesktopCollapseEnabled","classMap","localizeUserString","displayIcon","cardStyle","imageUrl","useCustomText","unsafeHTML","hasNonprofitWithInactivePromo","loading","_loading","_errorMessage","BeamError","nonprofit","repeat","i","isSelected","isFocusable","cssReset","css","cssCardGrid","__decorateClass","property","state","defineCustomElement"],"mappings":"i+BAGa,MAAAA,EAAe,CAAC,CAAE,OAAAC,EAAS,MAAO,MAAAC,EAAQ,KAAM,EAAI,CAAA,IAC/DC;AAAAA;AAAAA,eAEaC,EAAS,CAAE,OAAAH,EAAQ,MAAAC,EAAO,SAAU,WAAY,OAAQ,GAAI,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,ICNhEG,EAAU,CACrB,GAAI,CACF,gBAAiB,IAAM,kBACvB,SAAU,IAAM,qBAChB,sBAAuB,IAAM,oBAC7B,gBAAiB,CAAC,CAAE,mBAAAC,EAAqB,GAAI,EAAI,CAAA,IAC/C,4CAA4CA,CAAkB,mCAChE,WAAY,CAAC,CAAE,mBAAAA,EAAqB,GAAI,EAAI,CAAA,IAC1C,4CAA4CA,CAAkB,mCAChE,iBAAkB,IAAM,UACxB,0BAA2B,IAAM,aACjC,iBAAkB,IAAM,oBAC1B,EACA,GAAI,CACF,gBAAiB,IAAM,uBACvB,SAAU,IAAM,yBAChB,sBAAuB,IAAM,GAC7B,gBAAiB,IAAM,GACvB,WAAY,CAAC,CAAE,mBAAAA,EAAqB,GAAI,EAAI,CAAA,IAC1C,oDAAiDA,CAAkB,oEACrE,iBAAkB,IAAM,YACxB,0BAA2B,IAAM,eACjC,iBAAkB,IAAM,YAC1B,EACA,GAAI,CACF,gBAAiB,IAAM,0BACvB,SAAU,IAAM,yBAChB,sBAAuB,IAAM,GAC7B,gBAAiB,IAAM,GACvB,WAAY,CAAC,CAAE,mBAAAA,EAAqB,GAAI,EAAI,CAAA,IAC1C,iEAA2DA,CAAkB,+CAC/E,iBAAkB,IAAM,gBACxB,0BAA2B,IAAM,gBACjC,iBAAkB,IAAM,WAC1B,EACA,GAAI,CACF,SAAU,IAAM,2BAChB,sBAAuB,IAAM,GAC7B,gBAAiB,IAAM,GACvB,WAAY,CAAC,CAAE,mBAAAA,EAAqB,GAAI,EAAI,CAAC,IAC3C,4DAAyDA,CAAkB,sCAC7E,gBAAiB,IAAM,oBACvB,iBAAkB,IAAM,YACxB,0BAA2B,IAAM,kBACjC,iBAAkB,IAAM,OAC1B,EACA,GAAI,CACF,SAAU,IAAM,iCAChB,sBAAuB,IAAM,GAC7B,gBAAiB,IAAM,GACvB,WAAY,CAAC,CAAE,mBAAAA,EAAqB,GAAI,EAAI,CAAC,IAC3C,gEAA2DA,CAAkB,6CAC/E,gBAAiB,IAAM,kBACvB,iBAAkB,IAAM,aACxB,0BAA2B,IAAM,cACjC,iBAAkB,IAAM,QAC1B,EACA,GAAI,CACF,gBAAiB,IAAM,uBACvB,SAAU,IAAM,8DAChB,sBAAuB,IAAM,GAC7B,gBAAiB,IAAM,GACvB,WAAY,CAAC,CAAE,mBAAAA,EAAqB,GAAI,EAAI,KAC1C,uDAA0CA,CAAkB,oFAC9D,iBAAkB,IAAM,iBACxB,0BAA2B,IAAM,gBACjC,iBAAkB,IAAM,SAC1B,CACF,qICxBO,MAAMC,UAA8BC,CAAW,CAA/C,aAAA,CAAA,MAAA,GAAA,SAAA,EAGuB,KAAO,QAAkBC,EAiBzB,KAAO,KAAkB,KAExB,KAAO,MAAQ,GAEf,KAAO,YAAc,GAEzC,KAAQ,SAAW,OAAO,WAAa,IAEvC,KAAQ,wBAA0B,GAElC,KAAQ,iBAAmB,GAYpC,KAAQ,mBAAqB,SAAY,CACvC,GAAI,CAAC,KAAK,4BACR,MAAM,IAAIC,EAGZ,MAAMC,EAAM,MAAMC,EAAmC,CACnD,QAAS,KAAK,QACd,QAAS,CAAE,cAAe,WAAW,KAAK,MAAM,EAAG,EACnD,YAAa,CACX,QAAS,KAAK,QACd,WAAY,KAAK,WACjB,YAAa,KAAK,YAClB,cAAe,OAAO,KAAK,aAAa,EACxC,KAAM,KAAK,MAAQ,OACnB,WAAYC,EAAa,mBACzB,QAAS,CACP,OAAQ,CACN,YAAa,KAAK,WACpB,CACF,EACA,QAAS,QACT,KAAM,KAAK,UACb,CACF,CAAC,EAGD,OAAIF,EAAI,OAAO,IAAMA,EAAI,MAAM,KAAO,KAAK,UACzC,KAAK,QAAUA,EAAI,MAAM,IAG3B,KAAK,aAAa,YAAY,kBAAmB,CAC/C,UAAW,IAAI,KACf,KAAMA,CACR,CAAC,EAEMA,CACT,EAEA,KAAQ,2BAA6B,MAAO,CAAE,oBAAAG,CAAoB,IAC5D,KAAK,cACA,KAAK,eAAe,CAAE,oBAAAA,CAAoB,CAAC,EAE7C,KAET,KAAQ,eAAiB,MAAO,CAAE,oBAAAA,CAAoB,KAC/CC,EAA+B,CAAC,SAAU,eAAe,EAAG,IAAI,EAG9DC,EAAe,CACpB,QAAS,KAAK,QACd,QAAS,CACP,cAAe,WAAW,KAAK,MAAM,EACvC,EACA,WAAY,CACV,cAAe,OAAO,KAAK,aAAa,CAC1C,EACA,YAAa,CACX,YAAaF,CACf,CACF,CAAC,GAGH,KAAQ,4BAA8B,IAAIG,EACxC,KACA,KAAK,kBACP,EAEA,KAAQ,wBAA0B,IAAIA,EACpC,KACA,KAAK,0BACP,EAEA,KAAQ,aAAeC,EAAyB,IAAoC,EA4DpF,KAAQ,iBACN,CAACC,EAAYC,EAAeC,IAC5B,MAAOC,GAAiB,CACtB,GAAI,CAAC,KAAK,YAAa,OACvB,MAAMC,EAAY,KAAK,oBACvB,GAAID,aAAiB,cAAe,CAClC,IAAIE,EAAY,KAChB,OAAQF,EAAM,KACZ,IAAK,UACL,IAAK,YACCF,IAAU,EACZI,EAAYH,EAAWA,EAAW,OAAS,CAAC,EAE5CG,EAAYH,EAAWD,EAAQ,CAAC,EAElCE,EAAM,eACN,EAAA,MACF,IAAK,aACL,IAAK,YACCF,IAAUC,EAAW,OAAS,EAChCG,EAAYH,EAAW,CAAC,EAExBG,EAAYH,EAAWD,EAAQ,CAAC,EAElCE,EAAM,eACN,EAAA,MACF,IAAK,QACL,IAAK,IACHA,EAAM,eACN,EAAA,MACF,QACE,MACJ,CACA,GAAIE,EAAW,CACb,MAAMC,EAAc,KAAK,WAAW,cAAc,gBAAgBD,EAAU,UAAU,EAAE,IAAI,EACxFC,IAAgB,OAClBA,EAAY,SAAW,EACvBA,EAAY,MAAM,GAEpB,MACF,CACF,CAGA,GADiBH,EAAM,yBACC,YAAa,CACnC,GAAIC,IAAcJ,EAEhB,OAEA,KAAK,oBAAsBA,CAE/B,CACF,EAYF,KAAA,aAAe,SAAY,CACzB,KAAM,CAAE,oBAAAL,CAAoB,EAAI,KAChC,GAAI,CAAC,KAAK,aAAeA,GAAuB,KAAM,OACtD,MAAM,KAAK,wBAAwB,KAAK,CAAE,oBAAAA,CAAoB,CAAC,EAE/D,KAAK,aAAa,QAAQ,YAAaA,CAAmB,EAC1D,KAAK,aAAa,QAAQ,wBAAyB,IAAI,OAAO,aAAa,EAE3E,MAAMY,EAAoB,KAAK,6BAA6B,MAAM,WAAW,KAC1EC,GAAOA,EAAG,UAAU,KAAOb,CAC9B,EAEA,KAAK,cACH,IAAIc,EAAyB,CAC3B,oBAAAd,EACA,cAAeY,GAAmB,UAAU,KAC5C,OAAQb,EAAa,kBACvB,CAAC,CACH,CACF,EAEA,KAAsBgB,oBAAAA,EACpB,IAAM,CACJ,KAAK,SAAW,OAAO,WAAa,GACtC,EACA,GACA,CAAE,QAAS,GAAI,QAAS,EAAK,CAC/B,CAAA,CAzOA,IAAI,YAAa,CACf,OAAOC,EAAoB,KAAK,IAAI,GAAK,IAC3C,CAEA,IAAY,6BAAuC,CAGjD,OADmCC,EADa,CAAC,SAAU,eAAe,EACF,IAAI,CAE9E,CA4EA,mBAAoB,CAClB,MAAM,kBAAkB,EACxB,OAAO,iBAAiB,SAAU,KAAK,mBAAmB,CAC5D,CAEA,MAAM,aAAaC,EAAoC,CACrD,MAAM,KAAK,sBACb,CAAA,CAEA,MAAM,QAAQC,EAAwC,CAGpD,MAAMC,EAAsB,CAAC,UAAW,UAAW,SAAU,cAAe,aAAc,MAAM,EAChG,UAAWC,KAAQD,EACjB,GAAID,EAAuB,IAAIE,CAAI,EAAG,CACpC,MAAM,KAAK,4BAA4B,KAAK,EAC5C,KACF,CAEJ,CAEA,sBAAuB,CACrB,MAAM,qBACR,CAAA,CAEQ,uBAAwB,CACzBpB,EAA+B,CAAC,QAAQ,EAAG,IAAI,EAEpD,KAAK,oBAAsB,SAAS,KAAK,aAAa,QAAQ,WAAW,GAAK,EAAE,GAAK,OACrF,GAAI,CAGF,KAAM,CAAE,UAAAqB,EAAY,EAAG,KAAAC,CAAK,EAC1B,KAAK,aAAa,YAA8C,iBAAiB,GAAK,CAAA,EAClFC,EAAW,EAAI,GAAK,GAAK,IAC3B,IAAI,KAAKF,CAAS,EAAE,UAAYE,EAAW,IAAI,OAAO,YACxD,KAAK,4BAA4B,KAAOD,EACxC,KAAK,4BAA4B,QAAU,GAE/C,MAAc,EAGhB,CAsEA,IAAI,aAAc,CAEhB,OAAO,KAAK,wBAAwB,MAAQ,MAAQ,CAAC,KAAK,wBAAwB,OACpF,CAEA,IAAI,aAAc,CAEhB,MAAO,CAAA,EAAQ,KAAK,qBAAuB,KAAK,YAClD,CA+BA,IAAW,cAAe,CACxB,MAAME,EAAW,CACf,oBAAqB,UACrB,mBAAoB,UACpB,kBAAmB,UACnB,mBAAoB,UACpB,yBAA0B,UAC1B,GAAGC,EAAiB,iCAAkC,CACpD,SAAU,SACV,WAAY,MACd,CAAC,EACD,GAAGA,EAAiB,uCAAwC,CAC1D,UAAW,QACX,WAAY,QACd,CAAC,EACD,GAAGC,EACH,GAAGC,EACH,oCAAqC,SACrC,iDAAkD,OAClD,mDAAoD,UACpD,mDAAoD,UACpD,sDAAuD,YACvD,8CAA+C,OAC/C,wDAAyD,UACzD,qDAAsD,MACtD,oDAAqD,UACrD,gDAAiD,WACjD,8CAA+C,OAC/C,kDAAmD,OACnD,qDAAsD,OACtD,yDAA0D,OAC1D,iEAAkE,OAClE,8DAA+D,UAC/D,0DAA2D,UAC3D,oDAAqD,OACrD,6DAA8D,UAC9D,iEAAkE,UAClE,uDAAwD,OACxD,6CAA8C,cAC9C,mDAAoD,UACpD,uDAAwD,OACxD,mDAAoD,OACpD,6DAA8D,OAC9D,yDAA0D,OAC1D,4DAA6D,OAC7D,gEAAiE,OACjE,sDAAuD,OACvD,4CAA6C,MAC7C,+CAAgD,IAChD,+CAAgD,MAChD,sDAAuD,MACvD,gDAAiD,OACjD,uDAAwD,OACxD,+CAAgD,UAChD,mDAAoD,cACpD,6CAA8C,OAC9C,yDAA0D,UAC1D,qDAAsD,OACtD,qDAAsD,UACtD,wDAAyD,UACzD,wDAAyD,OACzD,4DAA6D,OAC7D,GAAGF,EAAiB,2CAA4C,CAC9D,SAAU,SACV,UAAW,MACX,WAAY,SACZ,cAAe,SACjB,CAAC,EACD,GAAGA,EAAiB,iDAAkD,CACpE,SAAU,MACV,WAAY,MACd,CAAC,EACD,oEAAqE,SACrE,mEAAoE,UACpE,qEAAsE,MACtE,GAAGA,EAAiB,gEAAiE,CACnF,SAAU,SACV,cAAe,YACjB,CAAC,EACD,qCAAsC,UACtC,gDAAiD,MACjD,wDAAyD,UACzD,6DAA8D,QAC9D,8DAA+D,QAC/D,uCAAwC,MACxC,wCAAyC,MACzC,8CAA+C,MAC/C,GAAGG,CACL,EAEMC,EAAe,KAAK,6BAA6B,MAAM,QAAQ,KAAK,OAAS,GAE7EC,EAAS,CAAE,GAAGN,EAAU,GAAGK,CAAa,EAQ9C,OAAO,OAAO,OANO,OAAO,OAAO,CACjC,OAAQ,CACN,OAAOE,EAAgB,IAA8B,CACvD,CACF,CAAC,EAEkCD,CAAM,CAC3C,CAkPQ,mBAAoB,CAC1B,KAAK,wBAA0B,EACjC,CAEA,IAAI,gBAAiB,CACnB,MAAME,EAAuB,KAAK,aAAa,4DAA4D,EACrGC,EAAwB,KAAK,aAAa,6DAA6D,EACvGC,EAA0BF,GAAsB,YAAY,IAAM,OAClEG,EAA2BF,GAAuB,YAAA,IAAkB,OAE1E,OAAQ,KAAK,UAAYC,GAA6B,CAAC,KAAK,UAAYC,CAC1E,CAEQ,mBAAmBb,EAAiC,CAC1D,OAAOlC;AAAAA,QACH,KAAK,yBAA2B,CAAC,KAAK,eACpCA;AAAAA;AAAAA,6BAEmB,CAAC,KAAK,WAAW;AAAA,sBACxB,KAAK,YAAY;AAAA,qBAClBgD,EAAS,CAChB,WAAY,CAAC,KAAK,YAClB,aAAc,EAChB,CAAC,CAAC;AAAA;AAAA;AAAA,cAGA,KAAK,wBAAwB,OAAS,KACpCC,EACE,KAAK,WACLf,GAAM,QAAQ,KAAK,iBAAmBhC,EAAQ,KAAK,UAAU,EAAE,0BACjE,CAAA,EACA+C,EACE,KAAK,WACLf,GAAM,QAAQ,KAAK,eAAiBhC,EAAQ,KAAK,UAAU,EAAE,iBAAA,CAC/D,CAAC;AAAA,qBAEPF;AAAAA,4CACkC,KAAK,iBAAiB;AAAA,gBAClDiD,EACA,KAAK,WACLf,GAAM,QAAQ,KAAK,iBAAmBhC,EAAQ,KAAK,UAAU,EAAE,iBAAA,CACjE,CAAC;AAAA;AAAA,WAEJ;AAAA,KAET,CAEQ,mBAAoB,CAC1B,OAAOF;AAAAA;AAAAA;AAAAA,2CAGgCH,EAAa,CAAE,OAAQ,MAAO,MAAO,KAAM,CAAC,CAAC;AAAA;AAAA;AAAA,KAItF,CAEQ,qBAAqB2B,EAAsB0B,EAAsB,CACvE,MAAMC,EAAY,KAAK,aAAa,oCAAoC,EAElEC,EAAWF,EACbC,IAAc,SACZ3B,EAAG,UAAU,aACb2B,IAAc,kBACd3B,EAAG,UAAU,qBACbA,EAAG,SACLA,EAAG,SAEP,OAAOxB;AAAAA,QACHkD,EACElD;AAAAA;AAAAA,0BAEgBoD,CAAQ;AAAA;AAAA,kBAGxBpD;AAAAA;AAAAA,qBAEW,KAAK,SACV,6DACA,qDAAqD;AAAA;AAAA;AAAA,qBAGhDoD,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAMP,KAAK,SACT,4DACA,oDAAoD;AAAA;AAAA;AAAA;AAAA;AAAA,iBAKrD;AAAA,KAEf,CAEQ,mBAAmB5B,EAAsB,CAC/C,OAAOxB;AAAAA,yCAC8BqD,EAAc,gDAAgD,CAAC;AAAA,UAC9FJ,EAAmB,KAAK,WAAYzB,EAAG,UAAU,OAAS,EAAE,CAAC;AAAA;AAAA,sCAEjC8B,EAAWL,EAAmB,KAAK,WAAYzB,EAAG,OAAO,aAAe,EAAE,CAAC,CAAC;AAAA,KAEhH,CAEQ,kBAAkBA,EAAsB,CAC9C,OAAOxB;AAAAA;AAAAA,oCAEyBwB,EAAG,OAAO,sBAAsB;AAAA;AAAA,YAExDyB,EAAmB,KAAK,WAAYzB,EAAG,OAAO,gBAAgB,CAAC;AAAA;AAAA;AAAA,KAIzE,CAEQ,uBACNA,EACA+B,EACArB,EACA,CACA,OAAOlC;AAAAA;AAAAA,UAED,KAAK,mBAAmBwB,CAAE,CAAC,IAAI,KAAK,gBAAgBA,EAAI+B,EAA+BrB,CAAI,CAAC;AAAA;AAAA,KAGpG,CAEQ,gBACNV,EACA+B,EACArB,EACA,CACA,OAAOlC;AAAAA,QACHwB,EAAG,OAAO,UAAY,KAAK,kBAAoB+B,EAC7CvD,iCAAoCkC,GAAM,QAAQ,KAAK,KAAK,wCAC5DlC,GAAM;AAAA,KAEd,CAEU,QAAS,CACjB,KAAM,CAAE,oBAAAW,CAAoB,EAAI,KAC1B,CAAE,KAAAuB,EAAM,QAAAsB,CAAQ,EAAI,KAAK,4BAE/B,GAAIA,GAAW,CAACtB,EACd,OAAOuB,IAET,GAAI,KAAK,4BAA4B,MACnC,OAAI,KAAK,MACAC,EAAc,CAAE,MAAO,KAAK,4BAA4B,KAAM,CAAC,EAEjE,GAET,GAAI,KAAK,wBAAwB,OAC3B,KAAK,MACP,OAAOA,EAAc,CAAE,MAAO,KAAK,wBAAwB,KAAM,CAAC,EAItE,GAAIxB,GAAQ,KACV,OAAI,KAAK,MACAwB,EAAc,CAAE,MAAO,IAAIC,EAAU,SAAS,CAAE,CAAC,EAEnD,GAET,MAAMzC,EAAagB,GAAM,YAAc,CAAA,EACjCX,EAAoBL,EAAW,KAAMM,GAAOA,EAAG,UAAU,KAAOb,CAAmB,GAAK,KAExFuC,EACJ,KAAK,aAAa,oCAAoC,IAAM,UAC5D,KAAK,aAAa,oCAAoC,IAAM,kBAC9D,KAAK,iBAAmB,CAAAhB,CAAAA,GAAM,QAAQ,KAAK,MAC3C,MAAMqB,EAAgCrC,EAAW,KAAM0C,GAAc,CAACA,EAAU,OAAS,CAACA,EAAU,MAAM,QAAQ,EAElH,OAAO5D;AAAAA;AAAAA;AAAAA,YAGC,KAAK,aAAa,MAAO,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oCAQDgD,EAAS,CAAE,SAAU,CAAC,KAAK,yBAA2B,KAAK,cAAe,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA,2BAIrF,CAAC,KAAK,WAAW;AAAA;AAAA,YAEhCa,EACA3C,EACC4C,GAAMA,EAAE,UAAU,GACnB,CAACtC,EAAIP,IAAU,CACb,MAAM8C,EAAapD,IAAwBa,EAAG,UAAU,GAClDwC,EAAcD,GAAexC,GAAqB,MAAQN,IAAU,EAC1E,OAAOjB;AAAAA;AAAAA,kCAEagD,EAAS,CACvB,WAAYe,EACZ,WAAY,CAAC,KAAK,WACpB,CAAC,CAAC;AAAA;AAAA;AAAA,8BAGUC,EAAc,EAAI,EAAE;AAAA,+BACnBxC,EAAG,UAAU,EAAE;AAAA,kCACZuC,CAAU;AAAA,2BACjB,KAAK,iBAAiBvC,EAAG,UAAU,GAAIP,EAAOC,CAAU,CAAC;AAAA,6BACvD,KAAK,iBAAiBM,EAAG,UAAU,GAAIP,EAAOC,CAAU,CAAC;AAAA,gCACtD+B,EAAmB,KAAK,WAAYzB,EAAG,UAAU,OAAS,EAAE,CAAC;AAAA;AAAA;AAAA;AAAA,sBAIvE,KAAK,kBAAmB,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAMpB,KAAK,qBAAqBA,EAAI0B,CAAW,CAAC;AAAA,0BAC1C,KAAK,uBAAuB1B,EAAI+B,EAA+BrB,CAAI,CAAC;AAAA;AAAA,wBAEtE,KAAK,kBAAkBV,CAAE,CAAC;AAAA;AAAA;AAAA;AAAA,eAKtC,CACF,CAAC;AAAA;AAAA;AAAA,6CAGkC,KAAK,mBAAmBU,CAAI,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sCAMpC,KAAK,UAAY,kDAAkD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yBAMhFmB,EAAc,gCAAgC,CAAC;AAAA;AAAA,kBAEtDJ,EAAmB,KAAK,WAAYf,GAAM,QAAQ,KAAK,KAAK,GAAKhC,EAAQ,KAAK,UAAU,EAAE,SAAU,CAAA;AAAA;AAAA,gBAEtG,KAAK,iBACHF;AAAAA,6BACWkC,GAAM,QAAQ,KAAK,KAAK;AAAA,6BACxB,KAAK,UAAY,gCAAgC;AAAA,4CAE5DlC,GAAM;AAAA;AAAA,+DAEuCqD,EAAc,sCAAsC,CAAC;AAAA,gBACpG,KAAK,iBACHrD;AAAAA,wBACMiD,EAAmB,KAAK,WAAYf,GAAM,QAAQ,KAAK,wBAA0B,EAAE,GACrFhC,EAAQ,KAAK,UAAU,EAAE,sBAAuB,CAAA;AAAA;AAAA;AAAA,wBAG9C+C,EAAmB,KAAK,WAAYf,GAAM,QAAQ,KAAK,kBAAoB,EAAE,GAC/EhC,EAAQ,KAAK,UAAU,EAAE,gBAAiB,CAAA;AAAA,6BAE9CF;AAAAA,uBACKiD,EAAmB,KAAK,WAAYf,GAAM,QAAQ,KAAK,aAAe,EAAE,GAC3EhC,EAAQ,KAAK,UAAU,EAAE,WAAY,CAAA;AAAA,0BAC/B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yBAMDgC,EAAK,MAAM,IAAI;AAAA,4BACZA,EAAK,MAAM,OAAO;AAAA;AAAA;AAAA;AAAA,KAK5C,CACF,CA93Ba9B,EACJ,QAAU,0BADNA,EAkXJ,OAAS,CACd6D,EACAC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,UAqJMb,EAAc,0CAA0C,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAoCzDA,EAAc,+DAA+D,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MA8CpFc,EAAY,CACV,IAAK,MACL,aAAc,sDACd,YAAa,sDACf,CAAC,CACH,EA7lBmCC,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAHf,EAAAjE,EAGwB,UAEAgE,SAAAA,EAAAA,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EALfjE,EAKwB,UAAA,QAAA,EAEAgE,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAPf,EAAAjE,EAOwB,2BAEAgE,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EATfjE,EASwB,UAEAgE,SAAAA,EAAAA,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,GAXfjE,EAWwB,UAAA,aAAA,EAEAgE,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,GAbfjE,EAawB,UAAA,YAAA,EAEAgE,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAff,EAAAjE,EAewB,UAG5BgE,MAAAA,EAAAA,EAAA,CADNC,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,CAAA,EAjB9BjE,EAkBJ,UAAA,qBAAA,EAE4BgE,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CApBf,EAAAjE,EAoBwB,UAECgE,MAAAA,EAAAA,EAAA,CAAnCC,EAAS,CAAE,KAAM,OAAQ,CAAC,CAAA,EAtBhBjE,EAsByB,UAAA,OAAA,EAEAgE,EAAA,CAAnCC,EAAS,CAAE,KAAM,OAAQ,CAAC,CAxBhB,EAAAjE,EAwByB,yBAEnBgE,EAAA,CAAhBE,EAAM,CAAA,EA1BIlE,EA0BM,UAAA,UAAA,EAEAgE,EAAA,CAAhBE,GA5BU,EAAAlE,EA4BM,UAEAgE,yBAAAA,EAAAA,EAAA,CAAhBE,EAAM,CAAA,EA9BIlE,EA8BM,UAAA,kBAAA,EAk2BnBmE,EAAoBnE,CAAqB"}