@beamimpact/web-sdk 1.43.2 → 1.45.2

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

@@ -1 +1 @@
-{"version":3,"file":"redeem-transaction.js","sources":["../../src/components/redeem-transaction/strings.ts","../../src/components/redeem-transaction/index.ts"],"sourcesContent":["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      `select a nonprofit and ${donationPercentage}% of your purchase will be donated.`,\n    ctaMessage: ({ donationPercentage = \"1%\" } = {}) =>\n      `Select a nonprofit and ${donationPercentage} of your purchase will be donated, at no extra cost.`,\n    submitButtonText: () => `Confirm`,\n    submitButtonTextCompleted: () => `Confirmed!`,\n    chooseButtonText: () => `Choose`,\n  },\n  fr: {\n    beamAttribution: () => `Optimisé par Beam`,\n    ctaTitle: () => `Choisissez votre cause`,\n    ctaPromoPrefixMessage: () => ``,\n    ctaPromoMessage: () => ``,\n    ctaMessage: ({ donationPercentage = \"1%\" } = {}) =>\n      `Choisissez un organisme à but non lucratif et ${donationPercentage}% lui sera versé en votre nom, sans frais supplémentaires.`,\n    submitButtonText: () => `Confirmer`,\n    submitButtonTextCompleted: () => `Confirmé!`,\n    chooseButtonText: () => `Choisissez`,\n  },\n  de: {\n    beamAttribution: () => `Unterstützt von Beam`,\n    ctaTitle: () => `Wähle deinen Impact`,\n    ctaPromoPrefixMessage: () => ``,\n    ctaPromoMessage: () => ``,\n    ctaMessage: ({ donationPercentage = \"1%\" } = {}) =>\n      `Wähle eine der gemeinnützigen Organisationen und spende ${donationPercentage} deines Einkaufs ohne zusätzliche Kosten`,\n    submitButtonText: () => \"Bestätigen\",\n    submitButtonTextCompleted: () => `Bestätigt!`,\n    chooseButtonText: () => `Wählen`,\n  },\n  es: {\n    ctaTitle: () => \"Elige tu contribución\",\n    ctaPromoPrefixMessage: () => ``,\n    ctaPromoMessage: () => ``,\n    ctaMessage: ({ donationPercentage = \"1%\" } = {}) =>\n      `Elige una organización sin fines de lucro y donaremos ${donationPercentage} de tu compra sin coste adicional.`,\n    beamAttribution: () => \"Ofrecido por Beam\",\n    submitButtonText: () => \"Confirmar\",\n    submitButtonTextCompleted: () => \"¡Confirmado!\",\n    chooseButtonText: () => `Elige`,\n  },\n  it: {\n    ctaTitle: () => \"Scegli dove fare la differenza\",\n    ctaPromoPrefixMessage: () => ``,\n    ctaPromoMessage: () => ``,\n    ctaMessage: ({ donationPercentage = \"1%\" } = {}) =>\n      `Seleziona un'organizzazione no-profit a cui devolvere l’${donationPercentage} del tuo acquisto, senza costi aggiuntivi`,\n    beamAttribution: () => \"Gestito da Beam\",\n    submitButtonText: () => \"Confermare\",\n    submitButtonTextCompleted: () => \"Confermato!\",\n    chooseButtonText: () => `Scegli`,\n  },\n  pl: {\n    beamAttribution: () => `Wspierany przez Beam`,\n    ctaTitle: () => `Wybierz inicjatywę, którą chcesz wesprzeć`,\n    ctaPromoPrefixMessage: () => ``,\n    ctaPromoMessage: () => ``,\n    ctaMessage: ({ donationPercentage = \"1%\" } = {}) =>\n      `Wybierz organizację, której przekażesz ${donationPercentage} wartości Twoich zakupów – bez żadnych dodatkowych kosztów!`,\n    submitButtonText: () => `Zatwierdź`,\n    submitButtonTextCompleted: () => `Zatwierdzono!`,\n    chooseButtonText: () => `Wybierz`,\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 { styleMap } from \"lit/directives/style-map.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 {\n  enforceConfig,\n  areRequiredKeysDefined,\n  checkForInvalidAttributeCombinations,\n} 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 { _checkbox } from \"../../shared/fragments/checkbox\";\nimport { postChainEligibleNonprofitsForCart, putTransaction, updateSubscription } 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 { strings } from \"./strings\";\n\ninterface TransactionRequiredConfig {\n  apiKey: string;\n  transactionId: TId;\n}\n\ninterface SubscriptionRequiredConfig {\n  apiKey: string;\n  subscriptionId: string;\n}\n\ntype TRequiredConfig = TransactionRequiredConfig | SubscriptionRequiredConfig;\n\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?: TransactionRequiredConfig[\"transactionId\"];\n\n  @property({ type: String }) public subscriptionId?: SubscriptionRequiredConfig[\"subscriptionId\"];\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  @state() private isMobile = window.innerWidth < 768;\n\n  @state() private didUserExpandNonprofits = false;\n\n  @state() private shouldUseNewPromoUI = false;\n\n  get configLang() {\n    return SUPPORTED_LANGUAGES[this.lang] || \"en\";\n  }\n\n  private get hasCorrectTransactionConfig(): boolean {\n    const requiredKeys: (keyof TransactionRequiredConfig)[] = [\"apiKey\", \"transactionId\"];\n    const isTransactionConfigCorrect = areRequiredKeysDefined(requiredKeys, this);\n    return isTransactionConfigCorrect;\n  }\n\n  private get hasCorrectSubscriptionConfig(): boolean {\n    const requiredKeys: (keyof SubscriptionRequiredConfig)[] = [\"apiKey\", \"subscriptionId\"];\n    const isSubscriptionConfigCorrect = areRequiredKeysDefined(requiredKeys, this);\n    return isSubscriptionConfigCorrect;\n  }\n\n  private getChainNonprofits = async () => {\n    checkForInvalidAttributeCombinations([\"transactionId\", \"subscriptionId\"], this);\n    if (!this.hasCorrectTransactionConfig && !this.hasCorrectSubscriptionConfig) {\n      throw new MissingConfig();\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        cart: this.cart ?? undefined,\n        widgetName: WIDGET_NAMES.redeem_transaction,\n        version: \"1.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    } else if (this.subscriptionId) {\n      return this.putSubscription({ selectedNonprofitId });\n    }\n    return null;\n  };\n  private putTransaction = async ({ selectedNonprofitId }: { selectedNonprofitId: TNumericId }) => {\n    if (!enforceConfig<TransactionRequiredConfig>([\"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: fix api spec for PUT transaction/:id to use string\n      },\n      requestBody: {\n        nonprofitId: selectedNonprofitId,\n      },\n    });\n  };\n\n  // updates subscriptions nonprofitId\n  private putSubscription = async ({ selectedNonprofitId }: { selectedNonprofitId: TNumericId }) => {\n    if (!enforceConfig<SubscriptionRequiredConfig>([\"apiKey\", \"subscriptionId\"], this)) {\n      throw new MissingConfig();\n    }\n\n    return updateSubscription({\n      baseUrl: this.baseUrl,\n      headers: { authorization: `Api-Key ${this.apiKey}` },\n      requestBody: {\n        remoteSubscriptionId: this.subscriptionId,\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    if (this.shouldUseStoredSelection) {\n      this.selectedNonprofitId = parseInt(this.localStorage.getItem(\"nonprofit\") || \"\") || undefined;\n    }\n\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\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    if (this.shouldUseStoredSelection) {\n      this.localStorage.setItem(\"nonprofit\", selectedNonprofitId);\n      this.localStorage.setItem(\"nonprofit_selected_at\", new Date().toISOString());\n    }\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  private get shouldUseStoredSelection() {\n    // Should only use localStorage data when managing transactions, not subscriptions\n    return !this.subscriptionId;\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      ...partnerLogosConfigDefaults,\n      ...progressBarConfigDefaults,\n      \"--beam-RedeemTransaction-maxWidth\": \"1000px\",\n      \"--beam-RedeemTransaction-submitButton-color\": \"#fff\",\n      \"--beam-RedeemTransaction-submitButton-hover-color\": \"#fff\",\n      \"--beam-RedeemTransaction-submitButton-disabled-color\": \"#fff\",\n      \"--beam-RedeemTransaction-submitButton-backgroundColor\": \"#333\",\n      \"--beam-RedeemTransaction-submitButton-hover-backgroundColor\": \"#222\",\n      \"--beam-RedeemTransaction-submitButton-disabled-backgroundColor\": \"#767676\",\n      \"--beam-RedeemTransaction-submitButton-borderColor\": \"#333\",\n      \"--beam-RedeemTransaction-submitButton-hover-borderColor\": \"#222\",\n      \"--beam-RedeemTransaction-submitButton-disabled-borderColor\": \"#767676\",\n      \"--beam-RedeemTransaction-submitButton-fontSize\": \"14px\",\n      \"--beam-RedeemTransaction-submitButton-fontWeight\": \"inherit\",\n      \"--beam-RedeemTransaction-submitButton-fontFamily\": \"inherit\",\n      \"--beam-RedeemTransaction-submitButton-textTransform\": \"none\",\n      \"--beam-RedeemTransaction-submitButton-borderRadius\": \"0px\",\n      \"--beam-RedeemTransaction-submitButton-padding\": \"15px 30px\",\n      \"--beam-RedeemTransaction-submitButton-position\": \"right\" /* bottom only applies to mobile */,\n      \"--beam-RedeemTransaction-submitButton-positionRight-width\": \"auto\",\n      \"--beam-RedeemTransaction-submitButton-positionBottom-width\": \"100%\",\n      \"--beam-RedeemTransaction-submitButton-positionBottom-marginTop\": \"10px\",\n      \"--beam-RedeemTransaction-checkmark-color\": \"transparent\",\n      \"--beam-RedeemTransaction-checkmark-selected-color\": \"#fff\",\n      \"--beam-RedeemTransaction-checkmark-hover-color\": \"#fff\",\n      \"--beam-RedeemTransaction-checkmark-backgroundColor\": \"transparent\",\n      \"--beam-RedeemTransaction-checkmark-selected-backgroundColor\": \"#333\",\n      \"--beam-RedeemTransaction-checkmark-hover-backgroundColor\": \"#d9d9d9\",\n      \"--beam-RedeemTransaction-checkmark-borderColor\": \"transparent\",\n      \"--beam-RedeemTransaction-checkmark-selected-borderColor\": \"#333\",\n      \"--beam-RedeemTransaction-checkmark-hover-borderColor\": \"#d9d9d9\",\n      \"--beam-RedeemTransaction-options-minWidth\": \"250px\",\n      \"--beam-RedeemTransaction-options-columnCount\": \"2\",\n      \"--beam-RedeemTransaction-options-borderRadius\": \"0px\",\n      \"--beam-RedeemTransaction-options-borderWidth\": \"1px\",\n      \"--beam-RedeemTransaction-options-selected-borderWidth\": \"2px\",\n      \"--beam-RedeemTransaction-options-focus-borderWidth\": \"1px\",\n      \"--beam-RedeemTransaction-options-image-borderRadius\": \"0px\",\n      \"--beam-RedeemTransaction-options-borderColor\": \"#d9d9d9\",\n      \"--beam-RedeemTransaction-options-selected-borderColor\": \"currentColor\",\n      \"--beam-RedeemTransaction-options-hover-borderColor\": \"#ccc\",\n      \"--beam-RedeemTransaction-options-backgroundColor\": \"transparent\",\n      \"--beam-RedeemTransaction-options-selected-backgroundColor\": \"transparent\",\n      \"--beam-RedeemTransaction-options-hover-backgroundColor\": \"#f1f1f1\",\n      \"--beam-RedeemTransaction-options-marginTop\": \"15px\",\n      ...defineCustomText(\"--beam-RedeemTransaction-title\", {\n        fontSize: \"1.25em\",\n        fontWeight: \"bold\",\n      }),\n      ...defineCustomText(\"--beam-RedeemTransaction-description\", {\n        marginTop: \"0.5em\",\n      }),\n      ...defineCustomText(\"--beam-RedeemTransaction-details-cause\", {\n        fontSize: \"1em\",\n        fontWeight: \"bold\",\n      }),\n      ...defineCustomText(\"--beam-RedeemTransaction-details-impactDescription\", {\n        fontSize: \"0.85em\",\n        marginTop: \"10px\",\n      }),\n      \"--beam-RedeemTransaction-details-nonprofitName-fontWeight\": \"bold\",\n      \"--beam-RedeemTransaction-details-nonprofitName-fontStyle\": \"inherit\",\n      \"--beam-RedeemTransaction-details-fundingProgress-marginTop\": \"10px\",\n      ...defineCustomText(\"--beam-RedeemTransaction-details-fundingProgressLabel\", {\n        fontSize: \"0.85em\",\n      }),\n      \"--beam-RedeemTransaction-cardStyle\": \"'image'\",\n      \"--beam-RedeemTransaction-options-icon-padding\": \"0px\",\n      \"--beam-RedeemTransaction-options-collapseNonprofits-mobile\": \"false\",\n      \"--beam-RedeemTransaction-options-collapseNonprofits-desktop\": \"false\",\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, 1000px);\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      }\n\n      .submitButton {\n        color: var(--beam-RedeemTransaction-submitButton-color, #fff);\n        background-color: var(--beam-RedeemTransaction-submitButton-backgroundColor, #333);\n        border: 1px solid var(--beam-RedeemTransaction-submitButton-borderColor, #333);\n        font-size: var(--beam-RedeemTransaction-submitButton-fontSize, 14px);\n        font-weight: var(--beam-RedeemTransaction-submitButton-fontWeight, inherit);\n        font-family: var(--beam-RedeemTransaction-submitButton-fontFamily, inherit);\n        text-transform: var(--beam-RedeemTransaction-submitButton-textTransform, none);\n        border-radius: var(--beam-RedeemTransaction-submitButton-borderRadius, 0);\n        padding: var(--beam-RedeemTransaction-submitButton-padding, 15px 30px);\n        transition: background-color 0.2s, border-color 0.2s, color 0.2s;\n        cursor: pointer;\n      }\n\n      .submitButton.positionRight {\n        width: var(--beam-RedeemTransaction-submitButton-positionRight-width, auto);\n        margin-left: 30px;\n      }\n\n      .submitButton.positionBottom {\n        width: var(--beam-RedeemTransaction-submitButton-positionBottom-width, 100%);\n        margin-top: var(--beam-RedeemTransaction-submitButton-positionBottom-marginTop, 10px);\n      }\n\n      .submitButton:not(.isDisabled):focus-visible,\n      .submitButton:not(.isDisabled):hover {\n        background-color: var(--beam-RedeemTransaction-submitButton-hover-backgroundColor, #222);\n        border-color: var(--beam-RedeemTransaction-submitButton-hover-borderColor, #222);\n        color: var(--beam-RedeemTransaction-submitButton-hover-color, #fff);\n      }\n\n      .submitButton.isDisabled {\n        color: var(--beam-RedeemTransaction-submitButton-disabled-color, #fff);\n        background-color: var(--beam-RedeemTransaction-submitButton-disabled-backgroundColor, #767676);\n        border-color: var(--beam-RedeemTransaction-submitButton-disabled-borderColor, #767676);\n        cursor: not-allowed;\n      }\n\n      .options {\n        margin-top: var(--beam-RedeemTransaction-options-marginTop, 15px);\n      }\n\n      .options.isHidden {\n        display: none;\n      }\n\n      .option {\n        /* outline is used to prevent layer shift if changing border width */\n        outline: var(--beam-RedeemTransaction-options-borderWidth, 1px) solid\n          var(--beam-RedeemTransaction-options-borderColor, #d9d9d9);\n        border-radius: var(--beam-RedeemTransaction-options-borderRadius);\n        background-color: var(--beam-RedeemTransaction-options-backgroundColor, transparent);\n        cursor: pointer;\n        transition: border-color 0.2s, background-color 0.2s, outline 0.2s;\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, #f1f1f1);\n        outline: var(--beam-RedeemTransaction-options-hover-borderWidth, 1px) solid\n          var(--beam-RedeemTransaction-options-hover-borderColor, #ccc);\n      }\n\n      .option.isDisabled {\n        cursor: not-allowed;\n      }\n\n      .option.isSelected {\n        outline: var(--beam-RedeemTransaction-options-selected-borderWidth, 1px) solid\n          var(--beam-RedeemTransaction-options-selected-borderColor, #333);\n        background-color: var(--beam-RedeemTransaction-options-selected-backgroundColor, transparent);\n      }\n\n      .option.isSelected:focus-visible,\n      .option.isSelected:hover {\n        outline: var(--beam-RedeemTransaction-options-selected-borderWidth, 1px) solid\n          var(--beam-RedeemTransaction-options-selected-borderColor, #333);\n      }\n\n      .option .checkbox {\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-checkmark-color, transparent);\n        background-color: var(--beam-RedeemTransaction-checkmark-backgroundColor, transparent);\n        border-color: var(--beam-RedeemTransaction-checkmark-borderColor, transparent);\n      }\n\n      .option.isSelected .checkbox,\n      .option.isSelected:focus-visible .checkbox,\n      .option.isSelected:hover .checkbox {\n        color: var(--beam-RedeemTransaction-checkmark-selected-color, #fff);\n        background-color: var(--beam-RedeemTransaction-checkmark-selected-backgroundColor, #333);\n        border-color: var(--beam-RedeemTransaction-checkmark-selected-borderColor, #333);\n      }\n\n      .option:not(.isSelected):focus-visible .checkbox,\n      .option:not(.isSelected):hover .checkbox {\n        color: var(--beam-RedeemTransaction-checkmark-hover-color, #fff);\n        background-color: var(--beam-RedeemTransaction-checkmark-hover-backgroundColor, #d9d9d9);\n        border-color: var(--beam-RedeemTransaction-checkmark-hover-borderColor, #d9d9d9);\n      }\n\n      .details-impactDescription {\n        ${useCustomText(\"--beam-RedeemTransaction-details-impactDescription\")}\n      }\n\n      .details-impactDescription .nonprofitName {\n        font-weight: var(--beam-RedeemTransaction-details-nonprofitName-fontWeight, bold);\n        font-style: var(--beam-RedeemTransaction-details-nonprofitName-fontStyle, inherit);\n      }\n    `,\n    cssCardGrid({\n      gap: \"20px\",\n      itemMinWidth: \"var(--beam-RedeemTransaction-options-minWidth, 250px)\",\n      columnCount: \"var(--beam-RedeemTransaction-options-columnCount, 2)\",\n    }),\n  ];\n\n  private handleChooseClick() {\n    this.didUserExpandNonprofits = true;\n  }\n\n  get shouldCollapse() {\n    const enableMobileCollapse =\n      this.cssVariables[\"--beam-RedeemTransaction-options-collapseNonprofits-mobile\"] === \"true\";\n    const enableDesktopCollapse =\n      this.cssVariables[\"--beam-RedeemTransaction-options-collapseNonprofits-desktop\"] === \"true\";\n    return (this.isMobile && enableMobileCollapse) || (!this.isMobile && enableDesktopCollapse);\n  }\n\n  private renderSubmitButton(submitButtonPositionClass: string) {\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              [submitButtonPositionClass]: true,\n              submitButton: true,\n            })}\"\n            part=\"submitButton\"\n          >\n            ${this.selectionDataController.data !== null\n              ? strings[this.configLang].submitButtonTextCompleted()\n              : strings[this.configLang].submitButtonText()}\n          </button>`\n        : html` <button\n            type=\"button\"\n            @click=\"${this.handleChooseClick}\"\n            class=\"submitButton ${submitButtonPositionClass}\"\n            part=\"submitButton\"\n          >\n            ${strings[this.configLang].chooseButtonText()}\n          </button>`}\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 = this.cssVariables[\"--beam-RedeemTransaction-cardStyle\"] === \"'icon'\";\n    const submitButtonPosition = this.cssVariables[\"--beam-RedeemTransaction-submitButton-position\"];\n    // Ignore `--beam-RedeemTransaction-submitButton-position` setting and always use `bottom` when using new promo UI\n    const submitButtonPositionClass =\n      this.isMobile && this.shouldUseNewPromoUI\n        ? \"positionBottom\"\n        : this.isMobile && submitButtonPosition === \"bottom\"\n        ? \"positionBottom\"\n        : \"positionRight\";\n    this.shouldUseNewPromoUI = data?.config?.web?.promo && !this.subscriptionId ? true : false; // new promo UI is not available to subscription management widget\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=\"${styleMap({\n                    display: \"flex\",\n                    gap: \"15px\",\n                    padding: \"10px\",\n                  })}\"\n                >\n                  ${displayIcon\n                    ? html` <div style=\"height: 100%; flex: 1; flex-direction: column;\">\n                        <img\n                          src=\"${np.nonprofit.causeIconUrl}\"\n                          alt=\"\"\n                          role=\"presentation\"\n                          style=\"\n                            flex: 1;\n                            height: auto;\n                            width: 100%;\n                            display: block;\n                            padding: var(--beam-RedeemTransaction-options-icon-padding);\n                            border-radius: var(--beam-RedeemTransaction-options-image-borderRadius, 0);\n                          \"\n                        />\n                      </div>`\n                    : html` <div style=\"height: 100%; flex: 1 0 33%; display: flex; flex-direction: column;\">\n                        <img\n                          src=\"${np.imageUrl}\"\n                          alt=\"\"\n                          role=\"presentation\"\n                          style=\"\n                            flex: 1;\n                            height: auto;\n                            width: 100%;\n                            object-fit: cover;\n                            border-radius: var(--beam-RedeemTransaction-options-image-borderRadius, 0);\n                         \"\n                        />\n                      </div>`}\n                  <div\n                    class=\"details\"\n                    part=\"details\"\n                    style=\"\n                        flex: 1 1 67%;\n                        height: 100%;\n                        display: flex;\n                        flex-direction: column;\n                        flex-wrap: nowrap;\n                        justify-content: space-between;\n                        align-content: stretch;\n                        align-items: stretch;\n                        position: relative;\n                     \"\n                  >\n                    <div\n                      class=\"details-cause\"\n                      style=\"flex: 0 1; ${useCustomText(\"--beam-RedeemTransaction-details-cause\")}\"\n                    >\n                      <span\n                        part=\"checkbox\"\n                        class=\"checkbox\"\n                        style=\"\n                            margin-left: 5px;\n                            float: right;\n                            padding: 4px;\n                            border-radius: 100%;\n                            display: inline-flex;\n                            align-items: center;\n                            justify-content: center;\n                          \"\n                      >\n                        <span style=\"line-height: 0;\"> ${_checkbox({ height: \"10px\", width: \"10px\" })} </span>\n                      </span>\n                      ${localizeUserString(this.configLang, np.nonprofit.cause || \"\")}\n                    </div>\n                    <p class=\"details-impactDescription\" style=\"flex: 1 1;\">\n                      ${unsafeHTML(localizeUserString(this.configLang, np.impact.description || \"\"))}\n                    </p>\n                    <div class=\"details-promo-pill-container\" style=\"margin-top: 5px\">\n                      ${np.promo?.isActive && this.shouldUseNewPromoUI && hasNonprofitWithInactivePromo\n                        ? html`<beam-promo-info-pill\n                            .promo=${data?.config?.web?.promo}\n                            shortVersion\n                          ></beam-promo-info-pill>`\n                        : html``}\n                    </div>\n                    <div\n                      style=\"display: flex; margin-top: var(--beam-RedeemTransaction-details-fundingProgress-marginTop); align-items: center;\"\n                    >\n                      <beam-progress-bar\n                        value=\"${np.impact.goalProgressPercentage}\"\n                        style=\"flex: 1 0;\"\n                      ></beam-progress-bar>\n                      <span\n                        class=\"details-fundingProgressLabel\"\n                        style=\"${useCustomText(\n                          \"--beam-RedeemTransaction-details-fundingProgressLabel\"\n                        )} white-space: nowrap; text-align: right; flex: 0 1; margin-left: 15px;\"\n                      >\n                        ${localizeUserString(this.configLang, np.impact.goalProgressText)}\n                      </span>\n                    </div>\n                  </div>\n                </div>\n              `;\n            }\n          )}\n        </div>\n\n        <div\n          style=\"order: 2; flex-direction: ${this.isMobile && submitButtonPosition === \"bottom\"\n            ? \"column\"\n            : \"row\"}; ${this.isMobile && submitButtonPosition === \"right\" && data?.config?.web?.promo\n            ? \"align-items: center;\"\n            : \"\"}\"\n          class=\"headerContainer\"\n        >\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.shouldUseNewPromoUI\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.shouldUseNewPromoUI\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          ${(!this.isMobile && this.shouldUseNewPromoUI) || !this.shouldUseNewPromoUI\n            ? this.renderSubmitButton(submitButtonPositionClass)\n            : null}\n        </div>\n\n        ${this.isMobile && this.shouldUseNewPromoUI\n          ? html` <div style=\"order: 4;\">${this.renderSubmitButton(submitButtonPositionClass)}</div> `\n          : null}\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":["strings","donationPercentage","$","D","a","g","b","e","t","r","l","BeamRedeemTransaction","LitElement","DEFAULT_BASE_URL","checkForInvalidAttributeCombinations","MissingConfig","res","postChainEligibleNonprofitsForCart","WIDGET_NAMES","selectedNonprofitId","enforceConfig","putTransaction","updateSubscription","AsyncController","createScopedLocalStorage","id","index","nonprofits","event","currentId","nextFocus","focusTarget","selectedNonprofit","np","BeamNonprofitSelectEvent","debounce","SUPPORTED_LANGUAGES","areRequiredKeysDefined","_changedProperties","previousPropertyValues","requireNewDataProps","prop","createdAt","data","cacheTtl","defaults","partnerLogosConfigDefaults","progressBarConfigDefaults","defineCustomText","promoPillLabelConfigDefaults","remoteConfig","config","_cssVariableMap","enableMobileCollapse","enableDesktopCollapse","submitButtonPositionClass","html","classMap","loading","_loading","_errorMessage","BeamError","displayIcon","submitButtonPosition","hasNonprofitWithInactivePromo","nonprofit","repeat","i","isSelected","isFocusable","localizeUserString","styleMap","useCustomText","_checkbox","unsafeHTML","cssReset","css","cssCardGrid","__decorateClass","property","state","defineCustomElement"],"mappings":"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"}
+{"version":3,"file":"redeem-transaction.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 Free Donation`,\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 {\n  enforceConfig,\n  areRequiredKeysDefined,\n  checkForInvalidAttributeCombinations,\n} 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, updateSubscription } 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 TransactionRequiredConfig {\n  apiKey: string;\n  transactionId: TId;\n}\n\ninterface SubscriptionRequiredConfig {\n  apiKey: string;\n  subscriptionId: string;\n}\n\ntype TRequiredConfig = TransactionRequiredConfig | SubscriptionRequiredConfig;\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?: TransactionRequiredConfig[\"transactionId\"];\n\n  @property({ type: String }) public subscriptionId?: SubscriptionRequiredConfig[\"subscriptionId\"];\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 TransactionRequiredConfig)[] = [\"apiKey\", \"transactionId\"];\n    const isTransactionConfigCorrect = areRequiredKeysDefined(requiredKeys, this);\n    return isTransactionConfigCorrect;\n  }\n\n  private get hasCorrectSubscriptionConfig(): boolean {\n    const requiredKeys: (keyof SubscriptionRequiredConfig)[] = [\"apiKey\", \"subscriptionId\"];\n    const isSubscriptionConfigCorrect = areRequiredKeysDefined(requiredKeys, this);\n    return isSubscriptionConfigCorrect;\n  }\n\n  private getChainNonprofits = async () => {\n    checkForInvalidAttributeCombinations([\"transactionId\", \"subscriptionId\"], this);\n    if (!this.hasCorrectTransactionConfig && !this.hasCorrectSubscriptionConfig) {\n      throw new MissingConfig();\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        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    } else if (this.subscriptionId) {\n      return this.putSubscription({ selectedNonprofitId });\n    }\n    return null;\n  };\n  private putTransaction = async ({ selectedNonprofitId }: { selectedNonprofitId: TNumericId }) => {\n    if (!enforceConfig<TransactionRequiredConfig>([\"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: fix api spec for PUT transaction/:id to use string\n      },\n      requestBody: {\n        nonprofitId: selectedNonprofitId,\n      },\n    });\n  };\n\n  // updates subscriptions nonprofitId\n  private putSubscription = async ({ selectedNonprofitId }: { selectedNonprofitId: TNumericId }) => {\n    if (!enforceConfig<SubscriptionRequiredConfig>([\"apiKey\", \"subscriptionId\"], this)) {\n      throw new MissingConfig();\n    }\n\n    return updateSubscription({\n      baseUrl: this.baseUrl,\n      headers: { authorization: `Api-Key ${this.apiKey}` },\n      requestBody: {\n        remoteSubscriptionId: this.subscriptionId,\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    if (this.shouldUseStoredSelection) {\n      this.selectedNonprofitId = parseInt(this.localStorage.getItem(\"nonprofit\") || \"\") || undefined;\n    }\n\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    if (this.shouldUseStoredSelection) {\n      this.localStorage.setItem(\"nonprofit\", selectedNonprofitId);\n      this.localStorage.setItem(\"nonprofit_selected_at\", new Date().toISOString());\n    }\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  private get shouldUseStoredSelection() {\n    // Should only use localStorage data when managing transactions, not subscriptions\n    return !this.subscriptionId;\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-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      }\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","k","N","a","h","p","e","o","t","i","c","BeamRedeemTransaction","LitElement","DEFAULT_BASE_URL","checkForInvalidAttributeCombinations","MissingConfig","res","postChainEligibleNonprofitsForCart","WIDGET_NAMES","selectedNonprofitId","enforceConfig","putTransaction","updateSubscription","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","isSelected","isFocusable","cssReset","css","cssCardGrid","__decorateClass","property","state","defineCustomElement"],"mappings":"m+BAGa,MAAAA,EAAe,CAAC,CAAE,OAAAC,EAAS,MAAO,MAAAC,EAAQ,KAAM,EAAI,CAC/DC,IAAAA;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,IAAK,EAAI,CAAA,IAC3C,4CAA4CA,CAAkB,mCAChE,iBAAkB,IAAM,wBACxB,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,IAAK,EAAI,CAAA,IAC3C,oDAAiDA,CAAkB,mEACrE,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,IAAK,EAAI,CAAA,IAC3C,iEAA2DA,CAAkB,8CAC/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,IAAK,EAAI,CAAC,IAC5C,4DAAyDA,CAAkB,qCAC7E,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,IAAK,EAAI,CAAC,IAC5C,gEAA2DA,CAAkB,4CAC/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,IAAK,EAAI,KAC3C,uDAA0CA,CAAkB,mFAC9D,iBAAkB,IAAM,iBACxB,0BAA2B,IAAM,gBACjC,iBAAkB,IAAM,SAC1B,CACF,ECpEA,IAAAC,EAAA,OAAA,eAAAC,EAAA,OAAA,yBAAAC,EAAA,CAAAC,EAAAC,EAAAC,EAAAC,IAAA,CAAA,QAAAC,EAAAD,EAAA,EAAA,OAAAA,EAAAL,EAAAG,EAAAC,CAAA,EAAAD,EAAAI,EAAAL,EAAA,OAAA,EAAAM,EAAAD,GAAA,EAAAA,KAAAC,EAAAN,EAAAK,CAAA,KAAAD,GAAAD,EAAAG,EAAAL,EAAAC,EAAAE,CAAA,EAAAE,EAAAF,CAAA,IAAAA,GAAA,OAAAD,GAAAC,GAAAP,EAAAI,EAAAC,EAAAE,CAAA,EAAAA,CAAA,EAsDa,MAAAG,UAA8BC,CAAW,CAA/C,aAGuB,CAAA,MAAA,GAAA,SAAA,EAAA,KAAO,QAAkBC,EAmBzB,KAAO,KAAkB,KAExB,KAAO,MAAQ,GAEf,KAAO,YAAc,GAEzC,KAAQ,SAAW,OAAO,WAAa,IAEvC,KAAQ,wBAA0B,GAElC,KAAQ,iBAAmB,GAkBpC,KAAQ,mBAAqB,SAAY,CAEvC,GADAC,EAAqC,CAAC,gBAAiB,gBAAgB,EAAG,IAAI,EAC1E,CAAC,KAAK,6BAA+B,CAAC,KAAK,6BAC7C,MAAM,IAAIC,EAEZ,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,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,EACzC,KAAK,eACP,KAAK,gBAAgB,CAAE,oBAAAA,CAAoB,CAAC,EAE9C,KAET,KAAQ,eAAiB,MAAO,CAAE,oBAAAA,CAAoB,KAC/CC,EAAyC,CAAC,SAAU,eAAe,EAAG,IAAI,EAGxEC,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,GAIH,KAAQ,gBAAkB,MAAO,CAAE,oBAAAA,CAAoB,KAChDC,EAA0C,CAAC,SAAU,gBAAgB,EAAG,IAAI,EAI1EE,EAAmB,CACxB,QAAS,KAAK,QACd,QAAS,CAAE,cAAe,WAAW,KAAK,MAAM,EAAG,EACnD,YAAa,CACX,qBAAsB,KAAK,eAC3B,YAAaH,CACf,CACF,CAAC,GAGH,KAAQ,4BAA8B,IAAII,EACxC,KACA,KAAK,kBACP,EAEA,KAAQ,wBAA0B,IAAIA,EACpC,KACA,KAAK,0BACP,EAEA,KAAQ,aAAeC,EAAyB,IAAoC,EA+DpF,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,IACZ,CAAA,IAAK,UACL,IAAK,YACCF,IAAU,EACZI,EAAYH,EAAWA,EAAW,OAAS,CAAC,EAE5CG,EAAYH,EAAWD,EAAQ,CAAC,EAElCE,EAAM,iBACN,MACF,IAAK,aACL,IAAK,YACCF,IAAUC,EAAW,OAAS,EAChCG,EAAYH,EAAW,CAAC,EAExBG,EAAYH,EAAWD,EAAQ,CAAC,EAElCE,EAAM,eAAe,EACrB,MACF,IAAK,QACL,IAAK,IACHA,EAAM,eAAe,EACrB,MACF,QACE,MACJ,CACA,GAAIE,EAAW,CACb,MAAMC,EAAc,KAAK,WAAW,cAAc,gBAAgBD,EAAU,UAAU,EAAE,IAAI,EACxFC,IAAgB,OAClBA,EAAY,SAAW,EACvBA,EAAY,SAEd,MACF,CACF,CAGA,GADiBH,EAAM,yBACC,YAAa,CACnC,GAAIC,IAAcJ,EAEhB,OAEA,KAAK,oBAAsBA,CAE/B,CACF,EAYF,KAAe,aAAA,SAAY,CACzB,KAAM,CAAE,oBAAAN,CAAoB,EAAI,KAChC,GAAI,CAAC,KAAK,aAAeA,GAAuB,KAAM,OACtD,MAAM,KAAK,wBAAwB,KAAK,CAAE,oBAAAA,CAAoB,CAAC,EAE3D,KAAK,2BACP,KAAK,aAAa,QAAQ,YAAaA,CAAmB,EAC1D,KAAK,aAAa,QAAQ,wBAAyB,IAAI,KAAO,EAAA,YAAA,CAAa,GAG7E,MAAMa,EAAoB,KAAK,6BAA6B,MAAM,WAAW,KAC1EC,GAAOA,EAAG,UAAU,KAAOd,CAC9B,EAEA,KAAK,cACH,IAAIe,EAAyB,CAC3B,oBAAAf,EACA,cAAea,GAAmB,UAAU,KAC5C,OAAQd,EAAa,kBACvB,CAAC,CACH,CACF,EAOA,KAAA,oBAAsBiB,EACpB,IAAM,CACJ,KAAK,SAAW,OAAO,WAAa,GACtC,EACA,GACA,CAAE,QAAS,GAAI,QAAS,EAAK,CAC/B,CAAA,CA1QA,IAAI,YAAa,CACf,OAAOC,EAAoB,KAAK,IAAI,GAAK,IAC3C,CAEA,IAAY,6BAAuC,CAGjD,OADmCC,EADuB,CAAC,SAAU,eAAe,EACZ,IAAI,CAE9E,CAEA,IAAY,8BAAwC,CAGlD,OADoCA,EADuB,CAAC,SAAU,gBAAgB,EACb,IAAI,CAE/E,CA6FA,mBAAoB,CAClB,MAAM,oBACN,OAAO,iBAAiB,SAAU,KAAK,mBAAmB,CAC5D,CAEA,MAAM,aAAaC,EAAoC,CACrD,MAAM,KAAK,uBACb,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,sBACR,CAEQ,uBAAwB,CACzBrB,EAA+B,CAAC,QAAQ,EAAG,IAAI,EAEhD,KAAK,2BACP,KAAK,oBAAsB,SAAS,KAAK,aAAa,QAAQ,WAAW,GAAK,EAAE,GAAK,QAGvF,GAAI,CAGF,KAAM,CAAE,UAAAsB,EAAY,EAAG,KAAAC,CAAK,EAC1B,KAAK,aAAa,YAA8C,iBAAiB,GAAK,CAClFC,EAAAA,EAAW,EAAI,GAAK,GAAK,IAC3B,IAAI,KAAKF,CAAS,EAAE,QAAA,EAAYE,EAAW,IAAI,KAAO,EAAA,QAAA,IACxD,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,CAAQ,EAAA,KAAK,qBAAuB,KAAK,YAClD,CAyBA,IAAY,0BAA2B,CAErC,MAAO,CAAC,KAAK,cACf,CAUA,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,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,CAE7EC,EAAAA,EAAS,CAAE,GAAGN,EAAU,GAAGK,CAAa,EAQ9C,OAAO,OAAO,OANO,OAAO,OAAO,CACjC,OAAQ,CACN,OAAOE,EAAgB,IAA8B,CACvD,CACF,CAAC,EAEkCD,CAAM,CAC3C,CAiPQ,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,gBAAkB,OAE1E,OAAQ,KAAK,UAAYC,GAA6B,CAAC,KAAK,UAAYC,CAC1E,CAEQ,mBAAmBb,EAAiC,CAC1D,OAAO9C;AAAAA,QACH,KAAK,yBAA2B,CAAC,KAAK,eACpCA;AAAAA;AAAAA,6BAEmB,CAAC,KAAK,WAAW;AAAA,sBACxB,KAAK,YAAY;AAAA,qBAClB4D,EAAS,CAChB,WAAY,CAAC,KAAK,YAClB,aAAc,EAChB,CAAC,CAAC;AAAA;AAAA;AAAA,cAGA,KAAK,wBAAwB,OAAS,KACpCC,EACE,KAAK,WACLf,GAAM,QAAQ,KAAK,iBAAmB5C,EAAQ,KAAK,UAAU,EAAE,0BAA0B,CAC3F,EACA2D,EACE,KAAK,WACLf,GAAM,QAAQ,KAAK,eAAiB5C,EAAQ,KAAK,UAAU,EAAE,iBAC/D,CAAA,CAAC;AAAA,qBAEPF;AAAAA,4CACkC,KAAK,iBAAiB;AAAA,gBAClD6D,EACA,KAAK,WACLf,GAAM,QAAQ,KAAK,iBAAmB5C,EAAQ,KAAK,UAAU,EAAE,iBACjE,CAAA,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,qBAAqBuC,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,OAAOpC;AAAAA,QACH8D,EACE9D;AAAAA;AAAAA,0BAEgBgE,CAAQ;AAAA;AAAA,kBAGxBhE;AAAAA;AAAAA,qBAEW,KAAK,SACV,6DACA,qDAAqD;AAAA;AAAA;AAAA,qBAGhDgE,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,OAAOpC;AAAAA,yCAC8BiE,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,OAAOpC;AAAAA;AAAAA,oCAEyBoC,EAAG,OAAO,sBAAsB;AAAA;AAAA,YAExDyB,EAAmB,KAAK,WAAYzB,EAAG,OAAO,gBAAgB,CAAC;AAAA;AAAA;AAAA,KAIzE,CAEQ,uBACNA,EACA+B,EACArB,EACA,CACA,OAAO9C;AAAAA;AAAAA,UAED,KAAK,mBAAmBoC,CAAE,CAAC,IAAI,KAAK,gBAAgBA,EAAI+B,EAA+BrB,CAAI,CAAC;AAAA;AAAA,KAGpG,CAEQ,gBACNV,EACA+B,EACArB,EACA,CACA,OAAO9C;AAAAA,QACHoC,EAAG,OAAO,UAAY,KAAK,kBAAoB+B,EAC7CnE,iCAAoC8C,GAAM,QAAQ,KAAK,KAAK,wCAC5D9C,GAAM;AAAA,KAEd,CAEU,QAAS,CACjB,KAAM,CAAE,oBAAAsB,CAAoB,EAAI,KAC1B,CAAE,KAAAwB,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,KAAOd,CAAmB,GAAK,KAExFwC,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,OAAOxE;AAAAA;AAAAA;AAAAA,YAGC,KAAK,aAAa,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oCAQD4D,EAAS,CAAE,SAAU,CAAC,KAAK,yBAA2B,KAAK,cAAe,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA,2BAIrF,CAAC,KAAK,WAAW;AAAA;AAAA,YAEhCa,EACA3C,EACClB,GAAMA,EAAE,UAAU,GACnB,CAACwB,EAAIP,IAAU,CACb,MAAM6C,EAAapD,IAAwBc,EAAG,UAAU,GAClDuC,EAAcD,GAAevC,GAAqB,MAAQN,IAAU,EAC1E,OAAO7B;AAAAA;AAAAA,kCAEa4D,EAAS,CACvB,WAAYc,EACZ,WAAY,CAAC,KAAK,WACpB,CAAC,CAAC;AAAA;AAAA;AAAA,8BAGUC,EAAc,EAAI,EAAE;AAAA,+BACnBvC,EAAG,UAAU,EAAE;AAAA,kCACZsC,CAAU;AAAA,2BACjB,KAAK,iBAAiBtC,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,mBAAmB;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,GAAK5C,EAAQ,KAAK,UAAU,EAAE,UAAU;AAAA;AAAA,gBAEtG,KAAK,iBACHF;AAAAA,6BACW8C,GAAM,QAAQ,KAAK,KAAK;AAAA,6BACxB,KAAK,UAAY,gCAAgC;AAAA,4CAE5D9C,GAAM;AAAA;AAAA,+DAEuCiE,EAAc,sCAAsC,CAAC;AAAA,gBACpG,KAAK,iBACHjE;AAAAA,wBACM6D,EAAmB,KAAK,WAAYf,GAAM,QAAQ,KAAK,wBAA0B,EAAE,GACrF5C,EAAQ,KAAK,UAAU,EAAE,uBAAuB;AAAA;AAAA;AAAA,wBAG9C2D,EAAmB,KAAK,WAAYf,GAAM,QAAQ,KAAK,kBAAoB,EAAE,GAC/E5C,EAAQ,KAAK,UAAU,EAAE,iBAAiB;AAAA,6BAE9CF;AAAAA,uBACK6D,EAAmB,KAAK,WAAYf,GAAM,QAAQ,KAAK,aAAe,EAAE,GAC3E5C,EAAQ,KAAK,UAAU,EAAE,YAAY;AAAA,0BAC/B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yBAMD4C,EAAK,MAAM,IAAI;AAAA,4BACZA,EAAK,MAAM,OAAO;AAAA;AAAA;AAAA;AAAA,KAK5C,CACF,CA/5BahC,EACJ,QAAU,0BADNA,EAoZJ,OAAS,CACd8D,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,UAoJMZ,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,MA8CpFa,EAAY,CACV,IAAK,MACL,aAAc,sDACd,YAAa,sDACf,CAAC,CACH,EA9nBmCC,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EAHflE,EAGwB,UAEAiE,UAAAA,CAAAA,EAAAA,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EALflE,EAKwB,UAEAiE,SAAAA,CAAAA,EAAAA,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EAPflE,EAOwB,UAAA,gBAAA,CAAA,EAEAiE,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,GATflE,EASwB,UAAA,iBAAA,CAAA,EAEAiE,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,GAXflE,EAWwB,UAAA,UAAA,CAAA,EAEAiE,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,GAbflE,EAawB,UAAA,cAAA,CAAA,EAEAiE,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAff,EAAAlE,EAewB,UAEAiE,aAAAA,CAAAA,EAAAA,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAjBf,EAAAlE,EAiBwB,UAG5BiE,OAAAA,CAAAA,EAAAA,EAAA,CADNC,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,CAnB9B,EAAAlE,EAoBJ,mCAE4BiE,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAtBf,EAAAlE,EAsBwB,oBAECiE,EAAA,CAAnCC,EAAS,CAAE,KAAM,OAAQ,CAAC,CAAA,EAxBhBlE,EAwByB,UAEAiE,QAAAA,CAAAA,EAAAA,EAAA,CAAnCC,EAAS,CAAE,KAAM,OAAQ,CAAC,CAAA,EA1BhBlE,EA0ByB,UAEnBiE,cAAAA,CAAAA,EAAAA,EAAA,CAAhBE,KA5BUnE,EA4BM,UAAA,WAAA,CAAA,EAEAiE,EAAA,CAAhBE,EA9BU,CAAA,EAAAnE,EA8BM,UAEAiE,0BAAAA,CAAAA,EAAAA,EAAA,CAAhBE,GAAM,EAhCInE,EAgCM,UAAA,mBAAA,CAAA,EAi4BnBoE,EAAoBpE,CAAqB"}

package/dist/components/select-nonprofit.d.ts

@@ -1,12 +1,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 { T as TNumericId } from '../chunks/types-zbTZ8-KP.esm.js';
 import { L as LANGUAGES } from '../chunks/types-aju0qrRe.esm.js';
-import { T as TCart } from '../chunks/cart-contents-WB1BF6hG.esm.js';
-import '../chunks/openapi-spec-GGEBbqAJ.esm.js';
+import { T as TCart } from '../chunks/cart-contents-HAPzwbeL.esm.js';
+import '../chunks/openapi-spec-RlP2IT1i.esm.js';
 
 declare class BeamNotificationBlip extends LitElement {
     static get styles(): lit.CSSResult;
@@ -33,6 +34,8 @@ declare class BeamSelectNonprofit extends LitElement {
     selectedNonprofitId: TNumericId | null;
     lang: LANGUAGES;
     debug: boolean;
+    draftConfig: boolean;
+    private isMobile;
     private enableNonprofitDeselection;
     private selectionId?;
     private didTryToCreateNewSelectionFromCache;
@@ -48,8 +51,6 @@ declare class BeamSelectNonprofit extends LitElement {
     firstUpdated(_changedProperties: PropertyValues): Promise<void>;
     updated(previousPropertyValues: PropertyValues): Promise<void>;
     disconnectedCallback(): void;
-    private getExternalCartId;
-    private getBeamCartId;
     private restoreStateFromCache;
     private createNewSelectionForCachedNonprofit;
     /**
@@ -67,9 +68,10 @@ declare class BeamSelectNonprofit extends LitElement {
      * @returns {(evt: Event) => void}
      */
     private makeHandleSelect;
+    evaluateBreakPoints: lodash.DebouncedFuncLeading<() => void>;
     get cssVariables(): any;
     static styles: lit.CSSResult[];
-    protected render(): lit_html.TemplateResult<1> | "";
+    protected render(): "" | lit_html.TemplateResult<1>;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/components/select-nonprofit.esm.js

@@ -1,12 +1,8 @@
-import{h as v,f as x,y as c,g as f,u as E,k as T,m as M}from"../chunks/lit-3QHn3fwl.esm.js";import{u as b,A as w,d as h,a as B,_ as I,i as p}from"../chunks/localize-IRs8JglT.esm.js";import{D as F,f as _,W as N,j as W,S as U}from"../chunks/routes-t6bR6BdS.esm.js";import{p as O}from"../chunks/progress-bar-HVG_n8_6.esm.js";import{p as R}from"../chunks/promo-pill-label-3Xtr5ALT.esm.js";import{c as j,d as K,e as y}from"../chunks/enforce-config-HksNiOMu.esm.js";import{_ as H}from"../chunks/loading-template-mLjOGXMj.esm.js";import{c as $,g as q,d as k}from"../chunks/events-_4nImo3u.esm.js";import{logger as G}from"../utils/logger.esm.js";import"../utils/network-listeners.esm.js";import{createScopedLocalStorage as J}from"../utils/local-storage.esm.js";import{getCookieValue as P}from"../utils/cookies.esm.js";import{i as V}from"../chunks/lodash-P8OIs-at.esm.js";import{c as Q}from"../chunks/responsive-KbDsZM6S.esm.js";import{B as X}from"../chunks/cart-contents-h60geKWa.esm.js";import"../chunks/beam-errors-P-Lu07Ce.esm.js";import"../chunks/vendor--f7lkyBk.esm.js";class Y extends v{static get styles(){return x`
+import{h as x,f as w,y as c,g as f,t as T,q as E,m as M,k as B}from"../chunks/lit-iNN5L_Qk.esm.js";import{d as F,i as W}from"../chunks/lodash-P8OIs-at.esm.js";import{u as h,A as I,d as b,a as _,_ as k,i as p}from"../chunks/localize-o-cYvHQf.esm.js";import{D as U,f as K,W as N,i as O,S as R}from"../chunks/routes-jmFlXAbv.esm.js";import{p as j}from"../chunks/progress-bar-PMU_xI3L.esm.js";import{p as H}from"../chunks/promo-pill-label-58PJRvSl.esm.js";import{c as q,d as G,e as y}from"../chunks/enforce-config-ZAI7WYAd.esm.js";import{_ as V}from"../chunks/loading-template-t4fFsYtr.esm.js";import{c as $,g as J,d as P}from"../chunks/events-_4nImo3u.esm.js";import{logger as Q}from"../utils/logger.esm.js";import"../utils/network-listeners.esm.js";import{createScopedLocalStorage as X}from"../utils/local-storage.esm.js";import{c as Y}from"../chunks/responsive-2lC2Wrtg.esm.js";import{B as Z}from"../chunks/cart-contents-h60geKWa.esm.js";import{getExternalCartId as ee,getBeamCartId as te}from"../utils/cart.esm.js";import"../chunks/beam-errors-P-Lu07Ce.esm.js";import"../chunks/vendor-GKiOHg2N.esm.js";import"../utils/cookies.esm.js";class oe extends x{static get styles(){return w`
       :host {
-        position: relative;
       }
 
       .notification-blip {
-        position: absolute;
-        top: -12px;
-        right: -4px;
         background-color: var(--beam-notificationBlip-color-background, #000);
         border-radius: 50%;
         width: 12px;
@@ -16,11 +12,18 @@ import{h as v,f as x,y as c,g as f,u as E,k as T,m as M}from"../chunks/lit-3QHn3
         align-items: center;
         font-size: 12px;
       }
-    `}render(){return c`<div class="notification-blip-container" aria-label="Notification Blip">
-      <span class="notification-blip" role="button" tabindex="0" aria-hidden="true"></span>
-    </div>`}}customElements.get("beam-notification-blip")||customElements.define("beam-notification-blip",Y);const Z={"--beam-notificationBlip-color-background":"#000"},d={en:{beamAttribution:()=>"Powered by Beam",ctaTitle:()=>"Choose your impact",ctaPromoPrefixMessage:()=>"At no extra cost,",ctaPromoMessage:({donationPercentage:n="1"}={})=>`select a nonprofit and ${n}% of your purchase will be donated.`,ctaMessage:({donationPercentage:n="1"}={})=>`Select a nonprofit and ${n}% of your purchase will be donated, at no extra cost.`,inlineSeparator:()=>": "},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.`,inlineSeparator:()=>" : "},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`,inlineSeparator:()=>": "},es:{beamAttribution:()=>"Ofrecido por Beam",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.`,inlineSeparator:()=>": "},it:{beamAttribution:()=>"Gestito da Beam",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`,inlineSeparator:()=>": "},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!`,inlineSeparator:()=>": "}};var ee=Object.defineProperty,te=Object.getOwnPropertyDescriptor,m=(n,t,e,i)=>{for(var o=i>1?void 0:i?te(t,e):t,a=n.length-1,r;a>=0;a--)(r=n[a])&&(o=(i?r(t,e,o):r(o))||o);return i&&o&&ee(t,e,o),o};class l extends v{constructor(){super(...arguments),this.baseUrl=F,this.selectedNonprofitId=null,this.lang="en",this.debug=!1,this.enableNonprofitDeselection=!1,this.didTryToCreateNewSelectionFromCache=!1,this.getChainNonprofits=async()=>{y(["apiKey"],this);const t=this.cart?.content?{schema:this.cart?.schema,content:this.cart?.content}:void 0,e=await _({baseUrl:this.baseUrl,apiRoot:"/api/v3",headers:{authorization:`Api-Key ${this.apiKey}`},requestBody:{storeId:this.storeId,widgetName:N.select_nonprofit,postalCode:this.postalCode,countryCode:this.countryCode,version:"1.0.0",lang:this.configLang,cart:t}});return this.enableNonprofitDeselection=!!e.config.enableNonprofitDeselection,this.selectedNonprofitId!==null&&this.selectedNonprofitId&&!e.nonprofits.map(i=>i.nonprofit.id).includes(this.selectedNonprofitId)&&(this.selectedNonprofitId=null,await this.postSelectNonprofit({selectedNonprofitId:null}),this.localStorage.setItem("nonprofit",null)),e.store?.id&&e.store.id!==this.storeId&&(this.storeId=e.store.id),await this.createNewSelectionForCachedNonprofit(),this.localStorage.setItemJson("chainNonprofits",{createdAt:new Date,data:e}),e},this.postSelectNonprofit=async({selectedNonprofitId:t})=>{y(["apiKey","storeId"],this);const e=this.getExternalCartId(),i=this.getBeamCartId(),o=await W({baseUrl:this.baseUrl,headers:{authorization:`Api-Key ${this.apiKey}`},requestBody:{nonprofitId:t,selectionId:this.selectionId,storeId:this.storeId,cartId:e,beamCartId:i,postalCode:this.postalCode,countryCode:this.countryCode}});this.selectionId=o?.selectionId,this.localStorage.setItem("transaction",this.selectionId),this.localStorage.setItem("nonprofit",t),this.localStorage.setItem("nonprofit_selected_at",new Date().toISOString()),await this.updateComplete;const a=this.getNonprofitById(t);t!==null&&this.dispatchEvent(new $({selectedNonprofitId:t,selectionId:this.selectionId,nonprofitName:a?.nonprofit?.name??null,source:N.select_nonprofit})),t&&t!==null&&new q({newNonprofitId:null,selectionId:this.selectionId})},this.nonprofitListDataController=new w(this,this.getChainNonprofits),this.selectionDataController=new w(this,this.postSelectNonprofit),this.localStorage=J(this),this.handleCartChange=t=>{this.cart=t.detail},this.makeHandleSelect=(t,e,i)=>async o=>{const a=this.selectedNonprofitId;if(o instanceof KeyboardEvent){let r=null;switch(o.key){case"ArrowUp":case"ArrowLeft":e===0?r=i[i.length-1]:r=i[e-1],o.preventDefault();break;case"ArrowRight":case"ArrowDown":e===i.length-1?r=i[0]:r=i[e+1],o.preventDefault();break;case"Enter":case" ":o.preventDefault();break;default:return}if(r){a!=null&&(this.selectedNonprofitId=r.nonprofit.id);const g=this.renderRoot.querySelector(`[data-value="${r.nonprofit.id}"]`);g!==null&&(g.tabIndex=0,g.focus());return}}if(o.currentTarget instanceof HTMLElement)if(a===t)if(this.enableNonprofitDeselection)this.selectedNonprofitId=null,await this.postSelectNonprofit({selectedNonprofitId:null}),this.localStorage.setItem("nonprofit",null);else return;else this.selectedNonprofitId=t;await this.selectionDataController.exec({selectedNonprofitId:this.selectedNonprofitId})}}get configLang(){return U[this.lang]||"en"}getNonprofitById(t){return t?this.nonprofitListDataController?.data?.nonprofits.find(e=>e.nonprofit.id===t):null}connectedCallback(){super.connectedCallback(),window.addEventListener(k.eventName,this.handleCartChange)}async firstUpdated(t){await this.restoreStateFromCache()}async updated(t){const e=["baseUrl","storeId","apiKey","countryCode","postalCode","cart","lang"];for(const i of e)if(t.has(i)){await this.nonprofitListDataController.exec();break}}disconnectedCallback(){window.removeEventListener(k.eventName,this.handleCartChange),super.disconnectedCallback()}getExternalCartId(){return this.localStorage.getItemJson("cart")?.cartId??P("cart")}getBeamCartId(){return P(X)}async restoreStateFromCache(){try{const t=new Date().valueOf();this.cart=this.localStorage.getItemJson("cart")??void 0;const e=30*24*60*60*1e3,i=this.localStorage.getItem("nonprofit_selected_at")??0,o=t>new Date(i).valueOf()+e;o?o&&this.selectedNonprofitId!==null&&(await this.postSelectNonprofit({selectedNonprofitId:null}),this.localStorage.setItem("nonprofit",null)):(this.selectedNonprofitId=parseInt(this.localStorage.getItem("nonprofit")||"")||null,this.selectionId=this.localStorage.getItem("transaction")??void 0);const{createdAt:a=0,data:r}=this.localStorage.getItemJson("chainNonprofits")||{},g=2*60*60*1e3;t>new Date(a).valueOf()+g||(this.nonprofitListDataController.data=r,this.nonprofitListDataController.loading=!1)}catch(t){G.error(t)}}async createNewSelectionForCachedNonprofit(){if(y(["apiKey"],this),!(!this.storeId||this.didTryToCreateNewSelectionFromCache))try{if(this.didTryToCreateNewSelectionFromCache=!0,this.selectedNonprofitId){this.selectionId||await this.selectionDataController.exec({selectedNonprofitId:this.selectedNonprofitId});const t=this.getNonprofitById(this.selectedNonprofitId);this.dispatchEvent(new $({selectedNonprofitId:this.selectedNonprofitId,selectionId:this.selectionId,nonprofitName:t?.nonprofit?.name,source:N.select_nonprofit}))}}catch{}}get cssVariables(){const t={"--beam-fontFamily":"inherit","--beam-fontStyle":"inherit","--beam-fontSize":"inherit","--beam-textColor":"inherit","--beam-backgroundColor":"inherit",...O,"--beam-SelectNonprofit-title-textAlign":"inherit","--beam-SelectNonprofit-description-textAlign":"inherit","--beam-SelectNonprofit-maxWidth":"800px","--beam-SelectNonprofit-options-marginTop":"0px","--beam-SelectNonprofit-options-iconHeight":"24px","--beam-SelectNonprofit-options-padding":"10px","--beam-SelectNonprofit-options-borderRadius":"0px","--beam-SelectNonprofit-options-borderColor":"currentColor","--beam-SelectNonprofit-options--selected-borderColor":"currentColor","--beam-SelectNonprofit-options-backgroundColor":"transparent","--beam-SelectNonprofit-options-gap":"8px","--beam-SelectNonprofit-options--selected-backgroundColor":"currentColor","--beam-SelectNonprofit-details-marginTop":"10px","--beam-SelectNonprofit-details-borderRadius":"0px","--beam-SelectNonprofit-details-borderColor":"currentColor","--beam-SelectNonprofit-details-backgroundColor":"inherit","--beam-SelectNonprofit-details-padding":"10px",...h("--beam-SelectNonprofit-title",{fontSize:"1.25em",fontWeight:"bold"}),"--beam-SelectNonprofit-header-inline-lineHeight":"inherit",...h("--beam-SelectNonprofit-title-inline",{fontWeight:"bold"}),"--beam-SelectNonprofit-title-inline-textTransform":"none","--beam-SelectNonprofit-title-block-margin-right":"8px",...h("--beam-SelectNonprofit-description",{marginTop:"0.5em"}),...h("--beam-SelectNonprofit-description-inline"),...h("--beam-SelectNonprofit-details-cause",{fontSize:"0.85em",fontWeight:"bold"}),...h("--beam-SelectNonprofit-details-beamAttribution",{fontSize:"0.85em"}),...h("--beam-SelectNonprofit-details-impactDescription",{fontSize:"1em",marginTop:"10px"}),"--beam-SelectNonprofit-details-nonprofitName-fontWeight":"bold","--beam-SelectNonprofit-details-nonprofitName-fontStyle":"inherit","--beam-SelectNonprofit-details-fundingProgress-marginTop":"10px",...h("--beam-SelectNonprofit-details-fundingProgressLabel",{fontSize:"0.85em"}),...Z,...R,"--beam-SelectNonprofit-promo-block-header-justifyContent":"initial"},e=this.nonprofitListDataController?.data?.config?.web?.theme||{},i={...t,...e};return Object.assign(Object.create({toCSS(){return B(this)}}),i)}render(){const{selectedNonprofitId:t}=this,{data:e,loading:i}=this.nonprofitListDataController;if(i&&!e)return H();if(this.nonprofitListDataController.error)return this.debug?I({error:this.nonprofitListDataController.error}):"";if(this.selectionDataController.error&&this.debug)return I({error:this.selectionDataController.error});const o=e?.nonprofits||[],a=o.find(s=>s.nonprofit.id===t)||null,r=!!e?.config?.web?.promo,g=o.some(s=>!s.promo||!s.promo.isActive),C=c`<h3 class="title-block d-none d-lg-block" part="title" id="beam-SelectNonprofit-title">
-      ${p(this.configLang,e?.config?.web?.title||"")||d[this.configLang].ctaTitle()}
-    </h3>`,D=()=>r?c`<div class="block-header-promo-pill-container">
+    `}render(){return c`<div
+      class="notification-blip-container"
+      part="notification-blip-container"
+      aria-label="Notification Blip"
+    >
+      <span class="notification-blip" part="notification-blip" role="button" tabindex="0" aria-hidden="true"></span>
+    </div>`}}customElements.get("beam-notification-blip")||customElements.define("beam-notification-blip",oe);const ie={"--beam-notificationBlip-color-background":"#000"},m={en:{beamAttribution:()=>"Powered by Beam",ctaTitle:()=>"Choose your impact",ctaPromoPrefixMessage:()=>"At no extra cost,",ctaPromoMessage:({donationPercentage:n="1"}={})=>`select a nonprofit and ${n}% of your purchase will be donated.`,ctaMessage:({donationPercentage:n="1"}={})=>`At no extra cost, select a nonprofit and ${n}% of your purchase will be donated.`,inlineSeparator:()=>": "},fr:{beamAttribution:()=>"Optimis\xE9 par Beam",ctaTitle:()=>"Choisissez votre cause",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`Sans frais suppl\xE9mentaires, choisissez un organisme \xE0 but non lucratif et ${n} % lui sera vers\xE9 en votre nom.`,inlineSeparator:()=>" : "},de:{beamAttribution:()=>"Unterst\xFCtzt von Beam",ctaTitle:()=>"W\xE4hle deinen Impact",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`Ohne zus\xE4tzliche Kosten, w\xE4hle eine der gemeinn\xFCtzigen Organisationen und spende ${n}% deines Einkaufs`,inlineSeparator:()=>": "},es:{beamAttribution:()=>"Ofrecido por Beam",ctaTitle:()=>"Elige tu contribuci\xF3n",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`Sin coste adicional, elige una organizaci\xF3n sin fines de lucro y donaremos ${n}% de tu compra.`,inlineSeparator:()=>": "},it:{beamAttribution:()=>"Gestito da Beam",ctaTitle:()=>"Scegli dove fare la differenza",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`Senza costi aggiuntivi, seleziona un'organizzazione no-profit a cui devolvere l\u2019${n}% del tuo acquisto`,inlineSeparator:()=>": "},pl:{beamAttribution:()=>"Wspierany przez Beam",ctaTitle:()=>"Wybierz inicjatyw\u0119, kt\xF3r\u0105 chcesz wesprze\u0107",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:n="1"}={})=>`Bez \u017Cadnych dodatkowych koszt\xF3w wybierz organizacj\u0119, kt\xF3rej przeka\u017Cesz ${n}% warto\u015Bci Twoich zakup\xF3w!`,inlineSeparator:()=>": "}};var ne=Object.defineProperty,ae=Object.getOwnPropertyDescriptor,d=(n,t,e,i)=>{for(var o=i>1?void 0:i?ae(t,e):t,a=n.length-1,r;a>=0;a--)(r=n[a])&&(o=(i?r(t,e,o):r(o))||o);return i&&o&&ne(t,e,o),o};class l extends x{constructor(){super(...arguments),this.baseUrl=U,this.selectedNonprofitId=null,this.lang="en",this.debug=!1,this.draftConfig=!1,this.isMobile=window.innerWidth<768,this.enableNonprofitDeselection=!1,this.didTryToCreateNewSelectionFromCache=!1,this.getChainNonprofits=async()=>{y(["apiKey"],this);const t=this.cart?.content?{schema:this.cart?.schema,content:this.cart?.content}:void 0,e=await K({baseUrl:this.baseUrl,apiRoot:"/api/v3",headers:{authorization:`Api-Key ${this.apiKey}`},requestBody:{storeId:this.storeId,widgetName:N.select_nonprofit,postalCode:this.postalCode,countryCode:this.countryCode,version:"1.0.0",lang:this.configLang,options:{config:{draftConfig:this.draftConfig}},cart:t}});return this.enableNonprofitDeselection=!!e.config.enableNonprofitDeselection,this.selectedNonprofitId!==null&&this.selectedNonprofitId&&!e.nonprofits.map(i=>i.nonprofit.id).includes(this.selectedNonprofitId)&&(this.selectedNonprofitId=null,await this.postSelectNonprofit({selectedNonprofitId:null}),this.localStorage.setItem("nonprofit",null)),e.store?.id&&e.store.id!==this.storeId&&(this.storeId=e.store.id),await this.createNewSelectionForCachedNonprofit(),this.localStorage.setItemJson("chainNonprofits",{createdAt:new Date,data:e}),e},this.postSelectNonprofit=async({selectedNonprofitId:t})=>{y(["apiKey","storeId"],this);const e=ee("cart",{apiKey:this.apiKey}),i=te(Z,{apiKey:this.apiKey}),o=await O({baseUrl:this.baseUrl,headers:{authorization:`Api-Key ${this.apiKey}`},requestBody:{nonprofitId:t,selectionId:this.selectionId,storeId:this.storeId,cartId:e||void 0,beamCartId:i||void 0,postalCode:this.postalCode,countryCode:this.countryCode}});this.selectionId=o?.selectionId,this.localStorage.setItem("transaction",this.selectionId),this.localStorage.setItem("nonprofit",t),this.localStorage.setItem("nonprofit_selected_at",new Date().toISOString()),await this.updateComplete;const a=this.getNonprofitById(t);t!==null&&this.dispatchEvent(new $({selectedNonprofitId:t,selectionId:this.selectionId,nonprofitName:a?.nonprofit?.name??null,source:N.select_nonprofit})),t&&t!==null&&new J({newNonprofitId:null,selectionId:this.selectionId})},this.nonprofitListDataController=new I(this,this.getChainNonprofits),this.selectionDataController=new I(this,this.postSelectNonprofit),this.localStorage=X(this),this.handleCartChange=t=>{this.cart=t.detail},this.makeHandleSelect=(t,e,i)=>async o=>{const a=this.selectedNonprofitId;if(o instanceof KeyboardEvent){let r=null;switch(o.key){case"ArrowUp":case"ArrowLeft":e===0?r=i[i.length-1]:r=i[e-1],o.preventDefault();break;case"ArrowRight":case"ArrowDown":e===i.length-1?r=i[0]:r=i[e+1],o.preventDefault();break;case"Enter":case" ":o.preventDefault();break;default:return}if(r){a!=null&&(this.selectedNonprofitId=r.nonprofit.id);const g=this.renderRoot.querySelector(`[data-value="${r.nonprofit.id}"]`);g!==null&&(g.tabIndex=0,g.focus());return}}if(o.currentTarget instanceof HTMLElement)if(a===t)if(this.enableNonprofitDeselection)this.selectedNonprofitId=null,await this.postSelectNonprofit({selectedNonprofitId:null}),this.localStorage.setItem("nonprofit",null);else return;else this.selectedNonprofitId=t;await this.selectionDataController.exec({selectedNonprofitId:this.selectedNonprofitId})},this.evaluateBreakPoints=F(()=>{this.isMobile=window.innerWidth<768},50,{maxWait:50,leading:!0})}get configLang(){return R[this.lang]||"en"}getNonprofitById(t){return t?this.nonprofitListDataController?.data?.nonprofits.find(e=>e.nonprofit.id===t):null}connectedCallback(){super.connectedCallback(),window.addEventListener(P.eventName,this.handleCartChange),window.addEventListener("resize",this.evaluateBreakPoints)}async firstUpdated(t){await this.restoreStateFromCache()}async updated(t){const e=["baseUrl","storeId","apiKey","countryCode","postalCode","cart","lang"];for(const i of e)if(t.has(i)){await this.nonprofitListDataController.exec();break}}disconnectedCallback(){window.removeEventListener(P.eventName,this.handleCartChange),super.disconnectedCallback()}async restoreStateFromCache(){try{const t=new Date().valueOf();this.cart=this.localStorage.getItemJson("cart")??void 0;const e=30*24*60*60*1e3,i=this.localStorage.getItem("nonprofit_selected_at")??0,o=t>new Date(i).valueOf()+e;o?o&&this.selectedNonprofitId!==null&&(await this.postSelectNonprofit({selectedNonprofitId:null}),this.localStorage.setItem("nonprofit",null)):(this.selectedNonprofitId=parseInt(this.localStorage.getItem("nonprofit")||"")||null,this.selectionId=this.localStorage.getItem("transaction")??void 0);const{createdAt:a=0,data:r}=this.localStorage.getItemJson("chainNonprofits")||{},g=2*60*60*1e3;t>new Date(a).valueOf()+g||(this.nonprofitListDataController.data=r,this.nonprofitListDataController.loading=!1)}catch(t){Q.error(t)}}async createNewSelectionForCachedNonprofit(){if(y(["apiKey"],this),!(!this.storeId||this.didTryToCreateNewSelectionFromCache))try{if(this.didTryToCreateNewSelectionFromCache=!0,this.selectedNonprofitId){this.selectionId||await this.selectionDataController.exec({selectedNonprofitId:this.selectedNonprofitId});const t=this.getNonprofitById(this.selectedNonprofitId);this.dispatchEvent(new $({selectedNonprofitId:this.selectedNonprofitId,selectionId:this.selectionId,nonprofitName:t?.nonprofit?.name,source:N.select_nonprofit}))}}catch{}}get cssVariables(){const t={"--beam-fontFamily":"inherit","--beam-fontStyle":"inherit","--beam-fontSize":"inherit","--beam-textColor":"inherit","--beam-backgroundColor":"inherit",...j,"--beam-SelectNonprofit-title-textAlign":"inherit","--beam-SelectNonprofit-description-textAlign":"inherit","--beam-SelectNonprofit-maxWidth":"800px","--beam-SelectNonprofit-options-marginTop":"0px","--beam-SelectNonprofit-options-iconHeight":"24px","--beam-SelectNonprofit-options-padding":"10px","--beam-SelectNonprofit-options-borderRadius":"0px","--beam-SelectNonprofit-options-borderColor":"currentColor","--beam-SelectNonprofit-options--selected-borderColor":"currentColor","--beam-SelectNonprofit-options-backgroundColor":"transparent","--beam-SelectNonprofit-options-gap":"8px","--beam-SelectNonprofit-options--selected-backgroundColor":"currentColor","--beam-SelectNonprofit-details-marginTop":"10px","--beam-SelectNonprofit-details-borderRadius":"0px","--beam-SelectNonprofit-details-borderColor":"currentColor","--beam-SelectNonprofit-details-backgroundColor":"inherit","--beam-SelectNonprofit-details-padding":"10px",...b("--beam-SelectNonprofit-title",{fontSize:"1.25em",fontWeight:"bold"}),"--beam-SelectNonprofit-header-inline-lineHeight":"inherit",...b("--beam-SelectNonprofit-title-inline",{fontWeight:"bold"}),"--beam-SelectNonprofit-title-inline-textTransform":"none","--beam-SelectNonprofit-title-block-margin-right":"8px",...b("--beam-SelectNonprofit-description",{marginTop:"0.5em"}),...b("--beam-SelectNonprofit-description-inline"),...b("--beam-SelectNonprofit-details-cause",{fontSize:"0.85em",fontWeight:"bold"}),...b("--beam-SelectNonprofit-details-beamAttribution",{fontSize:"0.85em"}),...b("--beam-SelectNonprofit-details-impactDescription",{fontSize:"1em",marginTop:"10px"}),"--beam-SelectNonprofit-details-nonprofitName-fontWeight":"bold","--beam-SelectNonprofit-details-nonprofitName-fontStyle":"inherit","--beam-SelectNonprofit-details-fundingProgress-marginTop":"10px",...b("--beam-SelectNonprofit-details-fundingProgressLabel",{fontSize:"0.85em"}),...ie,...H,"--beam-SelectNonprofit-promo-block-header-justifyContent":"initial","--beam-SelectNonprofit-notification-blip-top":"4px","--beam-SelectNonprofit-notification-blip-left":"50%"},e=this.nonprofitListDataController?.data?.config?.web?.theme||{},i={...t,...e};return Object.assign(Object.create({toCSS(){return _(this)}}),i)}render(){const{selectedNonprofitId:t}=this,{data:e,loading:i}=this.nonprofitListDataController;if(i&&!e)return V();if(this.nonprofitListDataController.error)return this.debug?k({error:this.nonprofitListDataController.error}):"";if(this.selectionDataController.error&&this.debug)return k({error:this.selectionDataController.error});const o=e?.nonprofits||[],a=o.find(s=>s.nonprofit.id===t)||null,r=!!e?.config?.web?.promo,g=o.some(s=>!s.promo||!s.promo.isActive),v=this.cssVariables["--beam-SelectNonprofit-title-textAlign"]==="center",C=c`<h3 class="title-block d-none d-lg-block" part="title" id="beam-SelectNonprofit-title">
+      ${p(this.configLang,e?.config?.web?.title||"")||m[this.configLang].ctaTitle()}
+    </h3>`,L=()=>r?c`<div
+            class="${this.isMobile?v?"block-header-promo-pill-center-block-container-responsive":"block-header-promo-pill-container-responsive":v?"block-header-promo-pill-center-block-container-responsive":"block-header-promo-pill-container"}"
+            style="${this.isMobile?"display: flex":""}"
+          >
             ${C}
             <beam-promo-info-pill .promo=${e?.config?.web?.promo}></beam-promo-info-pill>
           </div>`:C;return c`
@@ -30,30 +33,30 @@ import{h as v,f as x,y as c,g as f,u as E,k as T,m as M}from"../chunks/lit-3QHn3
         }
       </style>
       <div part="heading">
-        ${D()}
+        ${L()}
         <p class="description" part="description">
           <span class="d-none d-lg-inline">
           ${r?c`<span style="font-weight:bold">
-                    ${p(this.configLang,e?.config?.web?.promoDescriptionPrefix||"")||d[this.configLang].ctaPromoPrefixMessage()}
+                    ${p(this.configLang,e?.config?.web?.promoDescriptionPrefix||"")||m[this.configLang].ctaPromoPrefixMessage()}
                   </span>
                   <span>
-                    ${p(this.configLang,e?.config?.web?.promoDescription||"")||d[this.configLang].ctaPromoMessage()}
+                    ${p(this.configLang,e?.config?.web?.promoDescription||"")||m[this.configLang].ctaPromoMessage()}
                   </span>`:c`<span>
-                  ${p(this.configLang,e?.config?.web?.description||"")||d[this.configLang].ctaMessage()}
+                  ${p(this.configLang,e?.config?.web?.description||"")||m[this.configLang].ctaMessage()}
                 </span>`}
           </span>
           <div class="d-lg-none header-inline">
             <span class="title-inline" part="title">
-              ${(p(this.configLang,e?.config?.web?.title||"")||d[this.configLang].ctaTitle())+d[this.configLang].inlineSeparator()}
+              ${(p(this.configLang,e?.config?.web?.title||"")||m[this.configLang].ctaTitle())+m[this.configLang].inlineSeparator()}
             </span>
             <span class="description-inline" part="description">
             ${r?c`<span style="font-weight:bold">
-                      ${p(this.configLang,e?.config?.web?.promoDescriptionPrefix||"")||d[this.configLang].ctaPromoPrefixMessage()}
+                      ${p(this.configLang,e?.config?.web?.promoDescriptionPrefix||"")||m[this.configLang].ctaPromoPrefixMessage()}
                     </span>
                     <span>
-                      ${p(this.configLang,e?.config?.web?.promoDescription||"")||d[this.configLang].ctaPromoMessage()}
+                      ${p(this.configLang,e?.config?.web?.promoDescription||"")||m[this.configLang].ctaPromoMessage()}
                     </span>`:c`<span
-                    >${p(this.configLang,e?.config?.web?.description||"")||d[this.configLang].ctaMessage()}
+                    >${p(this.configLang,e?.config?.web?.description||"")||m[this.configLang].ctaMessage()}
                   </span>`}
           </div>
         </p>
@@ -65,7 +68,7 @@ import{h as v,f as x,y as c,g as f,u as E,k as T,m as M}from"../chunks/lit-3QHn3
         aria-labelledby="beam-SelectNonprofit-title"
         style="display: flex; gap: var(--beam-SelectNonprofit-options-gap); margin: 10px 0 0 0;"
       >
-        ${E(o,s=>s.nonprofit.id,({nonprofit:s,promo:L},S)=>{const u=t===s.id,z=u||a==null&&S===0,A=L?.isActive&&e?.config.web.promo&&g;return c`
+        ${E(o,s=>s.nonprofit.id,({nonprofit:s,promo:D},S)=>{const u=t===s.id,z=u||a==null&&S===0,A=D?.isActive&&e?.config.web.promo&&g;return c`
               <div
                 class="option"
                 part="option"
@@ -76,7 +79,7 @@ import{h as v,f as x,y as c,g as f,u as E,k as T,m as M}from"../chunks/lit-3QHn3
                 @click=${this.makeHandleSelect(s.id,S,o)}
                 @keydown=${this.makeHandleSelect(s.id,S,o)}
                 aria-label="${p(this.configLang,s.cause||"")}"
-                style="${T({cursor:"pointer",flex:"1",textAlign:"center",lineHeight:"1",marginTop:"var(--beam-SelectNonprofit-options-marginTop, 0px)",padding:"var(--beam-SelectNonprofit-options-padding, 10px)",borderWidth:"var(--beam-SelectNonprofit-options-borderWidth, 1px)",borderStyle:"solid",borderRadius:"var(--beam-SelectNonprofit-options-borderRadius, 0)",borderColor:u?s.causeColor||"var(--beam-SelectNonprofit-options--selected-borderColor, currentColor)":"var(--beam-SelectNonprofit-options-borderColor, currentColor)",backgroundColor:u?s.causeColor||"var(--beam-SelectNonprofit-options--selected-backgroundColor, currentColor)":"var(--beam-SelectNonprofit-options-backgroundColor, transparent)"})}"
+                style="${M({cursor:"pointer",flex:"1",textAlign:"center",lineHeight:"1",marginTop:"var(--beam-SelectNonprofit-options-marginTop, 0px)",padding:"var(--beam-SelectNonprofit-options-padding, 10px)",borderWidth:"var(--beam-SelectNonprofit-options-borderWidth, 1px)",borderStyle:"solid",position:"relative",borderRadius:"var(--beam-SelectNonprofit-options-borderRadius, 0)",borderColor:u?s.causeColor||"var(--beam-SelectNonprofit-options--selected-borderColor, currentColor)":"var(--beam-SelectNonprofit-options-borderColor, currentColor)",backgroundColor:u?s.causeColor||"var(--beam-SelectNonprofit-options--selected-backgroundColor, currentColor)":"var(--beam-SelectNonprofit-options-backgroundColor, transparent)"})}"
               >
                 <img
                   src="${u?s.causeIconSelectedUrl:s.causeIconUrl}"
@@ -110,7 +113,7 @@ import{h as v,f as x,y as c,g as f,u as E,k as T,m as M}from"../chunks/lit-3QHn3
                 >
                   <span
                     class="details-cause"
-                    style="flex: 0 1; white-space: nowrap; ${b("--beam-SelectNonprofit-details-cause")}"
+                    style="flex: 0 1; white-space: nowrap; ${h("--beam-SelectNonprofit-details-cause")}"
                   >
                     ${a?.promo?.isActive&&g?e?.config.web.promo?.["promo-cause-alt-text"]||a.nonprofit.cause:p(this.configLang,a.nonprofit.cause||"")}
                   </span>
@@ -118,14 +121,14 @@ import{h as v,f as x,y as c,g as f,u as E,k as T,m as M}from"../chunks/lit-3QHn3
                     <span
                       class="details-beamAttribution"
                       aria-hidden="true"
-                      style="flex: 0 1; white-space: nowrap; ${b("--beam-SelectNonprofit-details-beamAttribution")}"
+                      style="flex: 0 1; white-space: nowrap; ${h("--beam-SelectNonprofit-details-beamAttribution")}"
                     >
-                      ${d[this.configLang].beamAttribution()}
+                      ${m[this.configLang].beamAttribution()}
                     </span>
                   </div>
                 </div>
                 <p class="details-impactDescription">
-                  ${M(p(this.configLang,a.impact.description||""))}
+                  ${B(p(this.configLang,a.impact.description||""))}
                 </p>
                 <div
                   style="display: flex; margin-top: var(--beam-SelectNonprofit-details-fundingProgress-marginTop); align-items: center;"
@@ -136,14 +139,14 @@ import{h as v,f as x,y as c,g as f,u as E,k as T,m as M}from"../chunks/lit-3QHn3
                   ></beam-progress-bar>
                   <span
                     class="details-fundingProgressLabel"
-                    style="${b("--beam-SelectNonprofit-details-fundingProgressLabel")} white-space: nowrap; text-align: right; flex: 0 1; margin-left: 15px;"
+                    style="${h("--beam-SelectNonprofit-details-fundingProgressLabel")} white-space: nowrap; text-align: right; flex: 0 1; margin-left: 15px;"
                   >
                     ${p(this.configLang,a.impact.goalProgressText)}
                   </span>
                 </div>
               </div>
             `:""}
-    `}}l.tagName="beam-select-nonprofit",l.styles=[j,Q,x`
+    `}}l.tagName="beam-select-nonprofit",l.styles=[q,Y,w`
       :host {
         display: block;
         max-width: var(--beam-SelectNonprofit-maxWidth, 800px);
@@ -156,7 +159,7 @@ import{h as v,f as x,y as c,g as f,u as E,k as T,m as M}from"../chunks/lit-3QHn3
       }
 
       .details-impactDescription {
-        ${b("--beam-SelectNonprofit-details-impactDescription")}
+        ${h("--beam-SelectNonprofit-details-impactDescription")}
       }
 
       .details-impactDescription .nonprofitName {
@@ -168,7 +171,7 @@ import{h as v,f as x,y as c,g as f,u as E,k as T,m as M}from"../chunks/lit-3QHn3
 
       .title-block {
         margin-right: var(--beam-SelectNonprofit-title-block-margin-right);
-        ${b("--beam-SelectNonprofit-title")}
+        ${h("--beam-SelectNonprofit-title")}
         text-align: var(--beam-SelectNonprofit-title-textAlign);
       }
 
@@ -193,7 +196,7 @@ import{h as v,f as x,y as c,g as f,u as E,k as T,m as M}from"../chunks/lit-3QHn3
       }
 
       .description {
-        ${b("--beam-SelectNonprofit-description")}
+        ${h("--beam-SelectNonprofit-description")}
         text-align: var(--beam-SelectNonprofit-description-textAlign);
       }
 
@@ -202,5 +205,27 @@ import{h as v,f as x,y as c,g as f,u as E,k as T,m as M}from"../chunks/lit-3QHn3
         align-items: center;
         justify-content: var(--beam-SelectNonprofit-promo-block-header-justifyContent);
       }
-    `],m([f({type:String})],l.prototype,"baseUrl",2),m([f({type:String})],l.prototype,"apiKey",2),m([f({type:Number,reflect:!0})],l.prototype,"storeId",2),m([f({type:String})],l.prototype,"countryCode",2),m([f({type:String})],l.prototype,"postalCode",2),m([f({attribute:!1,hasChanged:(n,t)=>!V(n,t)})],l.prototype,"cart",2),m([f({type:Number,reflect:!0})],l.prototype,"selectedNonprofitId",2),m([f({type:String})],l.prototype,"lang",2),m([f({type:Boolean})],l.prototype,"debug",2),K(l);export{l as BeamSelectNonprofit};
+
+      .block-header-promo-pill-container-responsive {
+        flex-direction: column;
+        align-items: flex-start;
+      }
+      .block-header-promo-pill-center-block-container-responsive {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+      }
+      .block-header-promo-pill-container-responsive beam-promo-info-pill {
+        order: -1;
+      }
+      .block-header-promo-pill-center-block-container-responsive beam-promo-info-pill {
+        order: -1;
+      }
+      beam-notification-blip::part(notification-blip-container) {
+        position: absolute;
+        top: var(--beam-SelectNonprofit-notification-blip-top);
+        left: var(--beam-SelectNonprofit-notification-blip-left);
+      }
+    `],d([f({type:String})],l.prototype,"baseUrl",2),d([f({type:String})],l.prototype,"apiKey",2),d([f({type:Number,reflect:!0})],l.prototype,"storeId",2),d([f({type:String})],l.prototype,"countryCode",2),d([f({type:String})],l.prototype,"postalCode",2),d([f({attribute:!1,hasChanged:(n,t)=>!W(n,t)})],l.prototype,"cart",2),d([f({type:Number,reflect:!0})],l.prototype,"selectedNonprofitId",2),d([f({type:String})],l.prototype,"lang",2),d([f({type:Boolean})],l.prototype,"debug",2),d([f({type:Boolean})],l.prototype,"draftConfig",2),d([T()],l.prototype,"isMobile",2),G(l);export{l as BeamSelectNonprofit};
 //# sourceMappingURL=select-nonprofit.esm.js.map