@internetarchive/donation-form 0.5.12-a1 → 0.5.12-a4

package/dist/src/payment-flow-handlers/handlers/paypal-flow-handler.d.ts

@@ -13,6 +13,7 @@ export interface PayPalFlowHandlerEvents {
     payPalPaymentStarted: (dataSource: PayPalButtonDataSourceInterface, options: object) => void;
     payPalPaymentCancelled: (dataSource: PayPalButtonDataSourceInterface, data: object) => void;
     payPalPaymentError: (dataSource: PayPalButtonDataSourceInterface, error: string) => void;
+    payPalPaymentConfirmed: (dataSource: PayPalButtonDataSourceInterface, data: object) => void;
 }
 /**
  * This class manages the user-flow for PayPal.
@@ -36,6 +37,10 @@ export declare class PayPalFlowHandler implements PayPalFlowHandlerInterface, Pa
     });
     on<E extends keyof PayPalFlowHandlerEvents>(event: E, callback: PayPalFlowHandlerEvents[E]): Unsubscribe;
     payPalPaymentStarted(dataSource: PayPalButtonDataSourceInterface, options: object): Promise<void>;
+    /**
+     * Once we have the dataSource & payload, we ask patron to confirm donation.
+     * Once confirmed, we move forward to: `payPalPaymentConfirmed`
+     */
     payPalPaymentAuthorized(dataSource: PayPalButtonDataSourceInterface, payload: paypal.TokenizePayload): Promise<void>;
     payPalPaymentConfirmed(dataSource: PayPalButtonDataSourceInterface, payload: paypal.TokenizePayload): Promise<void>;
     payPalPaymentCancelled(dataSource: PayPalButtonDataSourceInterface, data: object): Promise<void>;

package/dist/src/payment-flow-handlers/handlers/paypal-flow-handler.js

@@ -48,20 +48,19 @@ export class PayPalFlowHandler {
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     options) {
         return __awaiter(this, void 0, void 0, function* () {
-            console.log('payPalPaymentStarted *******', { dataSource, options });
             this.emitter.emit('payPalPaymentStarted', dataSource, options);
         });
     }
+    /**
+     * Once we have the dataSource & payload, we ask patron to confirm donation.
+     * Once confirmed, we move forward to: `payPalPaymentConfirmed`
+     */
     payPalPaymentAuthorized(dataSource, payload) {
         return __awaiter(this, void 0, void 0, function* () {
-            // we got dataSource & payload
-            // we need to send it to `payPalPaymentConfirmed`
-            // after patron confirms the payment
-            console.log('payPalPaymentAuthorized *******', { dataSource, payload });
-            const { donationType, amount } = dataSource.donationInfo;
+            const { donationType, total } = dataSource.donationInfo;
             this.donationFlowModalManager.showConfirmationStepModal({
                 donationType,
-                amount,
+                amount: total,
                 currencyType: 'USD',
                 confirmDonationCB: () => {
                     this.payPalPaymentConfirmed(dataSource, payload);
@@ -71,8 +70,6 @@ export class PayPalFlowHandler {
                     this.payPalPaymentCancelled(dataSource, {});
                 }
             });
-            // cancel payment on modal X
-            // cancel payment on cancel
         });
     }
     payPalPaymentConfirmed(dataSource, payload) {

package/dist/src/payment-flow-handlers/handlers/paypal-flow-handler.js.map

@@ -1 +1 @@
-{"version":3,"file":"paypal-flow-handler.js","sourceRoot":"","sources":["../../../../src/payment-flow-handlers/handlers/paypal-flow-handler.ts"],"names":[],"mappings":"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","sourcesContent":["import { createNanoEvents, Emitter, Unsubscribe } from 'nanoevents';\n\nimport {\n  PayPalButtonDataSourceInterface,\n  PayPalButtonDataSourceDelegate,\n} from '../../braintree-manager/payment-providers/paypal/paypal-button-datasource';\nimport {\n  DonationResponse,\n  DonationType,\n  DonationPaymentInfo,\n  SuccessResponse,\n  CustomerInfo,\n  BillingInfo,\n  PaymentProvider,\n  ErrorResponse,\n} from '@internetarchive/donation-form-data-models';\nimport { BraintreeManagerInterface } from '../../braintree-manager/braintree-interfaces';\n\nimport { UpsellModalCTAMode } from '../../modals/upsell-modal-content';\nimport {\n  DonationFlowModalManagerInterface,\n  DonationFlowModalManager,\n} from '../donation-flow-modal-manager';\n\nexport interface PayPalFlowHandlerInterface {\n  updateDonationInfo(donationInfo: DonationPaymentInfo): void;\n  updateUpsellDonationInfo(donationInfo: DonationPaymentInfo): void;\n  renderPayPalButton(donationInfo: DonationPaymentInfo): Promise<void>;\n  on<E extends keyof PayPalFlowHandlerEvents>(\n    event: E,\n    callback: PayPalFlowHandlerEvents[E],\n  ): Unsubscribe;\n}\n\n/**\n * This is a class to combine the data from the one-time purchase to the upsell\n *\n * @class UpsellDataSourceContainer\n */\nclass UpsellDataSourceContainer {\n  upsellButtonDataSource: PayPalButtonDataSourceInterface;\n  oneTimePayload: paypal.TokenizePayload;\n  oneTimeSuccessResponse: SuccessResponse;\n\n  constructor(options: {\n    upsellButtonDataSource: PayPalButtonDataSourceInterface;\n    oneTimePayload: paypal.TokenizePayload;\n    oneTimeSuccessResponse: SuccessResponse;\n  }) {\n    this.upsellButtonDataSource = options.upsellButtonDataSource;\n    this.oneTimePayload = options.oneTimePayload;\n    this.oneTimeSuccessResponse = options.oneTimeSuccessResponse;\n  }\n}\n\nexport interface PayPalFlowHandlerEvents {\n  payPalPaymentStarted: (dataSource: PayPalButtonDataSourceInterface, options: object) => void;\n  payPalPaymentCancelled: (dataSource: PayPalButtonDataSourceInterface, data: object) => void;\n  payPalPaymentError: (dataSource: PayPalButtonDataSourceInterface, error: string) => void;\n}\n\n/**\n * This class manages the user-flow for PayPal.\n *\n * @export\n * @class PayPalFlowHandler\n * @implements {PayPalFlowHandlerInterface}\n * @implements {PayPalButtonDataSourceDelegate}\n */\nexport class PayPalFlowHandler\n  implements PayPalFlowHandlerInterface, PayPalButtonDataSourceDelegate {\n  private upsellButtonDataSourceContainer?: UpsellDataSourceContainer;\n\n  private buttonDataSource?: PayPalButtonDataSourceInterface;\n\n  private donationFlowModalManager: DonationFlowModalManagerInterface;\n\n  private braintreeManager: BraintreeManagerInterface;\n\n  private emitter: Emitter<PayPalFlowHandlerEvents> = createNanoEvents<PayPalFlowHandlerEvents>();\n\n  updateDonationInfo(donationInfo: DonationPaymentInfo): void {\n    if (this.buttonDataSource) {\n      this.buttonDataSource.donationInfo = donationInfo;\n    }\n  }\n\n  updateUpsellDonationInfo(donationInfo: DonationPaymentInfo): void {\n    if (this.upsellButtonDataSourceContainer) {\n      this.upsellButtonDataSourceContainer.upsellButtonDataSource.donationInfo = donationInfo;\n    }\n  }\n\n  constructor(options: {\n    braintreeManager: BraintreeManagerInterface;\n    donationFlowModalManager: DonationFlowModalManagerInterface;\n  }) {\n    this.braintreeManager = options.braintreeManager;\n    this.donationFlowModalManager = options.donationFlowModalManager;\n  }\n\n  on<E extends keyof PayPalFlowHandlerEvents>(\n    event: E,\n    callback: PayPalFlowHandlerEvents[E],\n  ): Unsubscribe {\n    return this.emitter.on(event, callback);\n  }\n\n  async payPalPaymentStarted(\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    dataSource: PayPalButtonDataSourceInterface,\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    options: object,\n  ): Promise<void> {\n    console.log('payPalPaymentStarted *******', { dataSource, options });\n    this.emitter.emit('payPalPaymentStarted', dataSource, options);\n  }\n\n  async payPalPaymentAuthorized(dataSource: PayPalButtonDataSourceInterface,\n    payload: paypal.TokenizePayload\n    ): Promise<void> {\n\n      // we got dataSource & payload\n      // we need to send it to `payPalPaymentConfirmed`\n      // after patron confirms the payment\n    console.log('payPalPaymentAuthorized *******', { dataSource, payload });\n\n    const { donationType, amount } = dataSource.donationInfo;\n    this.donationFlowModalManager.showConfirmationStepModal({\n      donationType,\n      amount,\n      currencyType: 'USD', // defaults to USD for now\n      confirmDonationCB: () => {\n        this.payPalPaymentConfirmed(dataSource, payload);\n      },\n      cancelDonationCB: () => {\n        this.donationFlowModalManager.closeModal();\n        this.payPalPaymentCancelled(dataSource, {});\n      }\n    });\n\n    // cancel payment on modal X\n    // cancel payment on cancel\n    \n  }\n\n  async payPalPaymentConfirmed(\n    dataSource: PayPalButtonDataSourceInterface,\n    payload: paypal.TokenizePayload,\n  ): Promise<void> {\n    this.donationFlowModalManager.showProcessingModal();\n\n    const donationType = dataSource.donationInfo.donationType;\n\n    const details = payload?.details;\n\n    const customerInfo = new CustomerInfo({\n      email: details?.email,\n      firstName: details?.firstName,\n      lastName: details?.lastName,\n    });\n\n    const shippingAddress = details.shippingAddress;\n\n    const billingInfo = new BillingInfo({\n      streetAddress: shippingAddress?.line1,\n      extendedAddress: shippingAddress?.line2,\n      locality: shippingAddress?.city,\n      region: shippingAddress?.state,\n      postalCode: shippingAddress?.postalCode,\n      countryCodeAlpha2: shippingAddress?.countryCode,\n    });\n\n    const oneTimeTransaction = this.upsellButtonDataSourceContainer\n      ? this.upsellButtonDataSourceContainer.oneTimeSuccessResponse.transaction_id\n      : undefined;\n\n    const response: DonationResponse = await this.braintreeManager.submitDonation({\n      nonce: payload.nonce,\n      paymentProvider: PaymentProvider.PayPal,\n      donationInfo: dataSource.donationInfo,\n      customerInfo: customerInfo,\n      billingInfo: billingInfo,\n      upsellOnetimeTransactionId: oneTimeTransaction,\n    });\n\n    if (!response.success) {\n      const error = response.value as ErrorResponse;\n      this.donationFlowModalManager.showErrorModal({\n        message: error.message,\n      });\n      return;\n    }\n\n    const successResponse = response.value as SuccessResponse;\n\n    switch (donationType) {\n      case DonationType.OneTime:\n        this.showUpsellModal(payload, successResponse);\n        break;\n      case DonationType.Monthly:\n        // show thank you, redirect\n        this.donationFlowModalManager.showThankYouModal({ successResponse });\n        break;\n      case DonationType.Upsell:\n        if (this.upsellButtonDataSourceContainer) {\n          this.donationFlowModalManager.showThankYouModal({\n            successResponse: this.upsellButtonDataSourceContainer.oneTimeSuccessResponse,\n            upsellSuccessResponse: successResponse,\n          });\n        } else {\n          // we're in the upsell flow, but no upsell data source container.. this should not happen\n          this.donationFlowModalManager.showErrorModal({\n            message: 'Error setting up monthly donation',\n          });\n        }\n        break;\n    }\n  }\n\n  async payPalPaymentCancelled(\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    dataSource: PayPalButtonDataSourceInterface,\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    data: object,\n  ): Promise<void> {\n    this.emitter.emit('payPalPaymentCancelled', dataSource, data);\n  }\n\n  async payPalPaymentError(\n    dataSource: PayPalButtonDataSourceInterface,\n    error: string,\n  ): Promise<void> {\n    this.emitter.emit('payPalPaymentError', dataSource, error);\n    console.error(\n      'PaymentSector:payPalPaymentError error:',\n      dataSource,\n      dataSource.donationInfo,\n      error,\n    );\n  }\n\n  async renderPayPalButton(donationInfo: DonationPaymentInfo): Promise<void> {\n    const handler = await this.braintreeManager?.paymentProviders.paypalHandler.get();\n\n    this.buttonDataSource = await handler?.renderPayPalButton({\n      selector: '#paypal-button',\n      style: {\n        color: 'blue' as paypal.ButtonColorOption, // I'm not sure why I can't access the enum directly here.. I get a UMD error\n        label: 'paypal' as paypal.ButtonLabelOption,\n        shape: 'rect' as paypal.ButtonShapeOption,\n        size: 'medium' as paypal.ButtonSizeOption,\n        tagline: false,\n      },\n      donationInfo: donationInfo,\n    });\n\n    if (this.buttonDataSource) {\n      this.buttonDataSource.delegate = this;\n    }\n  }\n\n  private async showUpsellModal(\n    oneTimePayload: paypal.TokenizePayload,\n    oneTimeSuccessResponse: SuccessResponse,\n  ): Promise<void> {\n    this.donationFlowModalManager.showUpsellModal({\n      oneTimeAmount: oneTimeSuccessResponse.amount,\n      amountChanged: this.upsellAmountChanged.bind(this),\n      noSelected: () => {\n        this.donationFlowModalManager.showThankYouModal({\n          successResponse: oneTimeSuccessResponse,\n        });\n      },\n      ctaMode: UpsellModalCTAMode.PayPalUpsellSlot,\n      userClosedModalCallback: () => {\n        this.donationFlowModalManager.showThankYouModal({\n          successResponse: oneTimeSuccessResponse,\n        });\n      },\n    });\n\n    const amount = DonationFlowModalManager.getDefaultUpsellAmount(oneTimeSuccessResponse.amount);\n\n    const upsellDonationInfo = new DonationPaymentInfo({\n      amount: amount,\n      donationType: DonationType.Upsell,\n      coverFees: false,\n    });\n\n    if (!this.upsellButtonDataSourceContainer) {\n      this.renderUpsellPayPalButton({\n        donationInfo: upsellDonationInfo,\n        oneTimePayload,\n        oneTimeSuccessResponse,\n      });\n    }\n  }\n\n  private upsellAmountChanged(amount: number): void {\n    if (this.upsellButtonDataSourceContainer) {\n      this.upsellButtonDataSourceContainer.upsellButtonDataSource.donationInfo.amount = amount;\n    }\n  }\n\n  private async renderUpsellPayPalButton(options: {\n    donationInfo: DonationPaymentInfo;\n    oneTimePayload: paypal.TokenizePayload;\n    oneTimeSuccessResponse: SuccessResponse;\n  }): Promise<void> {\n    const handler = await this.braintreeManager?.paymentProviders.paypalHandler.get();\n\n    const upsellButtonDataSource = await handler?.renderPayPalButton({\n      selector: '#paypal-upsell-button',\n      style: {\n        color: 'blue' as paypal.ButtonColorOption,\n        label: 'paypal' as paypal.ButtonLabelOption,\n        shape: 'rect' as paypal.ButtonShapeOption,\n        size: 'responsive' as paypal.ButtonSizeOption,\n        tagline: false,\n      },\n      donationInfo: options.donationInfo,\n    });\n\n    if (upsellButtonDataSource) {\n      upsellButtonDataSource.delegate = this;\n      this.upsellButtonDataSourceContainer = new UpsellDataSourceContainer({\n        upsellButtonDataSource: upsellButtonDataSource,\n        oneTimePayload: options.oneTimePayload,\n        oneTimeSuccessResponse: options.oneTimeSuccessResponse,\n      });\n    } else {\n      console.error('error rendering paypal upsell button');\n    }\n  }\n}\n"]}
+{"version":3,"file":"paypal-flow-handler.js","sourceRoot":"","sources":["../../../../src/payment-flow-handlers/handlers/paypal-flow-handler.ts"],"names":[],"mappings":"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","sourcesContent":["import { createNanoEvents, Emitter, Unsubscribe } from 'nanoevents';\n\nimport {\n  PayPalButtonDataSourceInterface,\n  PayPalButtonDataSourceDelegate,\n} from '../../braintree-manager/payment-providers/paypal/paypal-button-datasource';\nimport {\n  DonationResponse,\n  DonationType,\n  DonationPaymentInfo,\n  SuccessResponse,\n  CustomerInfo,\n  BillingInfo,\n  PaymentProvider,\n  ErrorResponse,\n} from '@internetarchive/donation-form-data-models';\nimport { BraintreeManagerInterface } from '../../braintree-manager/braintree-interfaces';\n\nimport { UpsellModalCTAMode } from '../../modals/upsell-modal-content';\nimport {\n  DonationFlowModalManagerInterface,\n  DonationFlowModalManager,\n} from '../donation-flow-modal-manager';\n\nexport interface PayPalFlowHandlerInterface {\n  updateDonationInfo(donationInfo: DonationPaymentInfo): void;\n  updateUpsellDonationInfo(donationInfo: DonationPaymentInfo): void;\n  renderPayPalButton(donationInfo: DonationPaymentInfo): Promise<void>;\n  on<E extends keyof PayPalFlowHandlerEvents>(\n    event: E,\n    callback: PayPalFlowHandlerEvents[E],\n  ): Unsubscribe;\n}\n\n/**\n * This is a class to combine the data from the one-time purchase to the upsell\n *\n * @class UpsellDataSourceContainer\n */\nclass UpsellDataSourceContainer {\n  upsellButtonDataSource: PayPalButtonDataSourceInterface;\n  oneTimePayload: paypal.TokenizePayload;\n  oneTimeSuccessResponse: SuccessResponse;\n\n  constructor(options: {\n    upsellButtonDataSource: PayPalButtonDataSourceInterface;\n    oneTimePayload: paypal.TokenizePayload;\n    oneTimeSuccessResponse: SuccessResponse;\n  }) {\n    this.upsellButtonDataSource = options.upsellButtonDataSource;\n    this.oneTimePayload = options.oneTimePayload;\n    this.oneTimeSuccessResponse = options.oneTimeSuccessResponse;\n  }\n}\n\nexport interface PayPalFlowHandlerEvents {\n  payPalPaymentStarted: (dataSource: PayPalButtonDataSourceInterface, options: object) => void;\n  payPalPaymentCancelled: (dataSource: PayPalButtonDataSourceInterface, data: object) => void;\n  payPalPaymentError: (dataSource: PayPalButtonDataSourceInterface, error: string) => void;\n  payPalPaymentConfirmed: (dataSource: PayPalButtonDataSourceInterface, data: object) => void;\n}\n\n/**\n * This class manages the user-flow for PayPal.\n *\n * @export\n * @class PayPalFlowHandler\n * @implements {PayPalFlowHandlerInterface}\n * @implements {PayPalButtonDataSourceDelegate}\n */\nexport class PayPalFlowHandler\n  implements PayPalFlowHandlerInterface, PayPalButtonDataSourceDelegate {\n  private upsellButtonDataSourceContainer?: UpsellDataSourceContainer;\n\n  private buttonDataSource?: PayPalButtonDataSourceInterface;\n\n  private donationFlowModalManager: DonationFlowModalManagerInterface;\n\n  private braintreeManager: BraintreeManagerInterface;\n\n  private emitter: Emitter<PayPalFlowHandlerEvents> = createNanoEvents<PayPalFlowHandlerEvents>();\n\n  updateDonationInfo(donationInfo: DonationPaymentInfo): void {\n    if (this.buttonDataSource) {\n      this.buttonDataSource.donationInfo = donationInfo;\n    }\n  }\n\n  updateUpsellDonationInfo(donationInfo: DonationPaymentInfo): void {\n    if (this.upsellButtonDataSourceContainer) {\n      this.upsellButtonDataSourceContainer.upsellButtonDataSource.donationInfo = donationInfo;\n    }\n  }\n\n  constructor(options: {\n    braintreeManager: BraintreeManagerInterface;\n    donationFlowModalManager: DonationFlowModalManagerInterface;\n  }) {\n    this.braintreeManager = options.braintreeManager;\n    this.donationFlowModalManager = options.donationFlowModalManager;\n  }\n\n  on<E extends keyof PayPalFlowHandlerEvents>(\n    event: E,\n    callback: PayPalFlowHandlerEvents[E],\n  ): Unsubscribe {\n    return this.emitter.on(event, callback);\n  }\n\n  async payPalPaymentStarted(\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    dataSource: PayPalButtonDataSourceInterface,\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    options: object,\n  ): Promise<void> {\n    this.emitter.emit('payPalPaymentStarted', dataSource, options);\n  }\n\n  /**\n   * Once we have the dataSource & payload, we ask patron to confirm donation.\n   * Once confirmed, we move forward to: `payPalPaymentConfirmed`\n   */\n  async payPalPaymentAuthorized(dataSource: PayPalButtonDataSourceInterface,\n    payload: paypal.TokenizePayload\n    ): Promise<void> {\n\n    const { donationType, total } = dataSource.donationInfo;\n    this.donationFlowModalManager.showConfirmationStepModal({\n      donationType,\n      amount: total,\n      currencyType: 'USD', // defaults to USD for now\n      confirmDonationCB: () => {\n        this.payPalPaymentConfirmed(dataSource, payload);\n      },\n      cancelDonationCB: () => {\n        this.donationFlowModalManager.closeModal();\n        this.payPalPaymentCancelled(dataSource, {});\n      }\n    });\n  }\n\n  async payPalPaymentConfirmed(\n    dataSource: PayPalButtonDataSourceInterface,\n    payload: paypal.TokenizePayload,\n  ): Promise<void> {\n    this.donationFlowModalManager.showProcessingModal();\n\n    const donationType = dataSource.donationInfo.donationType;\n\n    const details = payload?.details;\n\n    const customerInfo = new CustomerInfo({\n      email: details?.email,\n      firstName: details?.firstName,\n      lastName: details?.lastName,\n    });\n\n    const shippingAddress = details.shippingAddress;\n\n    const billingInfo = new BillingInfo({\n      streetAddress: shippingAddress?.line1,\n      extendedAddress: shippingAddress?.line2,\n      locality: shippingAddress?.city,\n      region: shippingAddress?.state,\n      postalCode: shippingAddress?.postalCode,\n      countryCodeAlpha2: shippingAddress?.countryCode,\n    });\n\n    const oneTimeTransaction = this.upsellButtonDataSourceContainer\n      ? this.upsellButtonDataSourceContainer.oneTimeSuccessResponse.transaction_id\n      : undefined;\n\n    const response: DonationResponse = await this.braintreeManager.submitDonation({\n      nonce: payload.nonce,\n      paymentProvider: PaymentProvider.PayPal,\n      donationInfo: dataSource.donationInfo,\n      customerInfo: customerInfo,\n      billingInfo: billingInfo,\n      upsellOnetimeTransactionId: oneTimeTransaction,\n    });\n\n    if (!response.success) {\n      const error = response.value as ErrorResponse;\n      this.donationFlowModalManager.showErrorModal({\n        message: error.message,\n      });\n      return;\n    }\n\n    const successResponse = response.value as SuccessResponse;\n\n    switch (donationType) {\n      case DonationType.OneTime:\n        this.showUpsellModal(payload, successResponse);\n        break;\n      case DonationType.Monthly:\n        // show thank you, redirect\n        this.donationFlowModalManager.showThankYouModal({ successResponse });\n        break;\n      case DonationType.Upsell:\n        if (this.upsellButtonDataSourceContainer) {\n          this.donationFlowModalManager.showThankYouModal({\n            successResponse: this.upsellButtonDataSourceContainer.oneTimeSuccessResponse,\n            upsellSuccessResponse: successResponse,\n          });\n        } else {\n          // we're in the upsell flow, but no upsell data source container.. this should not happen\n          this.donationFlowModalManager.showErrorModal({\n            message: 'Error setting up monthly donation',\n          });\n        }\n        break;\n    }\n  }\n\n  async payPalPaymentCancelled(\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    dataSource: PayPalButtonDataSourceInterface,\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    data: object,\n  ): Promise<void> {\n    this.emitter.emit('payPalPaymentCancelled', dataSource, data);\n  }\n\n  async payPalPaymentError(\n    dataSource: PayPalButtonDataSourceInterface,\n    error: string,\n  ): Promise<void> {\n    this.emitter.emit('payPalPaymentError', dataSource, error);\n    console.error(\n      'PaymentSector:payPalPaymentError error:',\n      dataSource,\n      dataSource.donationInfo,\n      error,\n    );\n  }\n\n  async renderPayPalButton(donationInfo: DonationPaymentInfo): Promise<void> {\n    const handler = await this.braintreeManager?.paymentProviders.paypalHandler.get();\n\n    this.buttonDataSource = await handler?.renderPayPalButton({\n      selector: '#paypal-button',\n      style: {\n        color: 'blue' as paypal.ButtonColorOption, // I'm not sure why I can't access the enum directly here.. I get a UMD error\n        label: 'paypal' as paypal.ButtonLabelOption,\n        shape: 'rect' as paypal.ButtonShapeOption,\n        size: 'medium' as paypal.ButtonSizeOption,\n        tagline: false,\n      },\n      donationInfo: donationInfo,\n    });\n\n    if (this.buttonDataSource) {\n      this.buttonDataSource.delegate = this;\n    }\n  }\n\n  private async showUpsellModal(\n    oneTimePayload: paypal.TokenizePayload,\n    oneTimeSuccessResponse: SuccessResponse,\n  ): Promise<void> {\n    this.donationFlowModalManager.showUpsellModal({\n      oneTimeAmount: oneTimeSuccessResponse.amount,\n      amountChanged: this.upsellAmountChanged.bind(this),\n      noSelected: () => {\n        this.donationFlowModalManager.showThankYouModal({\n          successResponse: oneTimeSuccessResponse,\n        });\n      },\n      ctaMode: UpsellModalCTAMode.PayPalUpsellSlot,\n      userClosedModalCallback: () => {\n        this.donationFlowModalManager.showThankYouModal({\n          successResponse: oneTimeSuccessResponse,\n        });\n      },\n    });\n\n    const amount = DonationFlowModalManager.getDefaultUpsellAmount(oneTimeSuccessResponse.amount);\n\n    const upsellDonationInfo = new DonationPaymentInfo({\n      amount: amount,\n      donationType: DonationType.Upsell,\n      coverFees: false,\n    });\n\n    if (!this.upsellButtonDataSourceContainer) {\n      this.renderUpsellPayPalButton({\n        donationInfo: upsellDonationInfo,\n        oneTimePayload,\n        oneTimeSuccessResponse,\n      });\n    }\n  }\n\n  private upsellAmountChanged(amount: number): void {\n    if (this.upsellButtonDataSourceContainer) {\n      this.upsellButtonDataSourceContainer.upsellButtonDataSource.donationInfo.amount = amount;\n    }\n  }\n\n  private async renderUpsellPayPalButton(options: {\n    donationInfo: DonationPaymentInfo;\n    oneTimePayload: paypal.TokenizePayload;\n    oneTimeSuccessResponse: SuccessResponse;\n  }): Promise<void> {\n    const handler = await this.braintreeManager?.paymentProviders.paypalHandler.get();\n\n    const upsellButtonDataSource = await handler?.renderPayPalButton({\n      selector: '#paypal-upsell-button',\n      style: {\n        color: 'blue' as paypal.ButtonColorOption,\n        label: 'paypal' as paypal.ButtonLabelOption,\n        shape: 'rect' as paypal.ButtonShapeOption,\n        size: 'responsive' as paypal.ButtonSizeOption,\n        tagline: false,\n      },\n      donationInfo: options.donationInfo,\n    });\n\n    if (upsellButtonDataSource) {\n      upsellButtonDataSource.delegate = this;\n      this.upsellButtonDataSourceContainer = new UpsellDataSourceContainer({\n        upsellButtonDataSource: upsellButtonDataSource,\n        oneTimePayload: options.oneTimePayload,\n        oneTimeSuccessResponse: options.oneTimeSuccessResponse,\n      });\n    } else {\n      console.error('error rendering paypal upsell button');\n    }\n  }\n}\n"]}

package/dist/test/tests/flow-handlers/donation-flow-modal-manager.test.js

@@ -98,6 +98,29 @@ describe('Donation Flow Modal Manager', () => {
         const response = (_e = mockBraintreeManager.donationSuccessfulOptions) === null || _e === void 0 ? void 0 : _e.successResponse;
         expect(response).to.deep.equal(mockSuccessResponse);
     }));
+    it('can show the confirmation modal', () => __awaiter(void 0, void 0, void 0, function* () {
+        var _f, _g;
+        const mockModalManager = (yield fixture(html `
+      <mock-modal-manager></mock-modal-manager>
+    `));
+        const mockBraintreeManager = new MockBraintreeManager();
+        const manager = new DonationFlowModalManager({
+            braintreeManager: mockBraintreeManager,
+            modalManager: mockModalManager,
+        });
+        manager.showConfirmationStepModal({
+            donationType: DonationType.Upsell,
+            amount: 8,
+            currencyType: 'USD',
+            cancelDonationCB: () => console.log('donation cancelled'),
+            confirmDonationCB: () => console.log('donation confirmed'),
+        });
+        const modalOptions = mockModalManager.showModalOptions;
+        expect(modalOptions === null || modalOptions === void 0 ? void 0 : modalOptions.config.headerColor).to.equal('#55A183');
+        expect(modalOptions === null || modalOptions === void 0 ? void 0 : modalOptions.config.closeOnBackdropClick).to.be.false;
+        expect(modalOptions === null || modalOptions === void 0 ? void 0 : modalOptions.config.showCloseButton).to.be.true;
+        expect((_g = (_f = modalOptions === null || modalOptions === void 0 ? void 0 : modalOptions.config) === null || _f === void 0 ? void 0 : _f.title) === null || _g === void 0 ? void 0 : _g.values).to.contain('Confirm monthly donation');
+    }));
     it('can start the donation submission flow', () => __awaiter(void 0, void 0, void 0, function* () {
         const mockModalManager = (yield fixture(html `
       <mock-modal-manager></mock-modal-manager>

package/dist/test/tests/flow-handlers/donation-flow-modal-manager.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"donation-flow-modal-manager.test.js","sourceRoot":"","sources":["../../../../test/tests/flow-handlers/donation-flow-modal-manager.test.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/camelcase */\nimport { html, fixture, expect } from '@open-wc/testing';\nimport { DonationFlowModalManager } from '../../../src/payment-flow-handlers/donation-flow-modal-manager';\nimport { MockModalManager } from '../../mocks/mock-modal-manager';\nimport '../../mocks/mock-modal-manager';\nimport { MockBraintreeManager } from '../../mocks/mock-braintree-manager';\nimport { mockSuccessResponse } from '../../mocks/models/mock-success-response';\nimport {\n  PaymentProvider,\n  DonationPaymentInfo,\n  DonationType,\n} from '@internetarchive/donation-form-data-models';\nimport { mockBillingInfo } from '../../mocks/models/mock-billing-info';\nimport { mockCustomerInfo } from '../../mocks/models/mock-customer-info';\n\ndescribe('Donation Flow Modal Manager', () => {\n  it('can close the modal', async () => {\n    const mockModalManager = (await fixture(html`\n      <mock-modal-manager></mock-modal-manager>\n    `)) as MockModalManager;\n    const mockBraintreeManager = new MockBraintreeManager();\n    const manager = new DonationFlowModalManager({\n      braintreeManager: mockBraintreeManager,\n      modalManager: mockModalManager,\n    });\n    manager.closeModal();\n    expect(mockModalManager.closeCalled).to.be.true;\n  });\n\n  it('can calculate the proper default upsell amount', async () => {\n    let amount = DonationFlowModalManager.getDefaultUpsellAmount(1);\n    expect(amount).to.equal(5);\n    amount = DonationFlowModalManager.getDefaultUpsellAmount(10);\n    expect(amount).to.equal(5);\n    amount = DonationFlowModalManager.getDefaultUpsellAmount(10.01);\n    expect(amount).to.equal(10);\n    amount = DonationFlowModalManager.getDefaultUpsellAmount(25);\n    expect(amount).to.equal(10);\n    amount = DonationFlowModalManager.getDefaultUpsellAmount(25.01);\n    expect(amount).to.equal(25);\n    amount = DonationFlowModalManager.getDefaultUpsellAmount(100);\n    expect(amount).to.equal(25);\n    amount = DonationFlowModalManager.getDefaultUpsellAmount(100.01);\n    expect(amount).to.equal(50);\n  });\n\n  it('can show the processing modal', async () => {\n    const mockModalManager = (await fixture(html`\n      <mock-modal-manager></mock-modal-manager>\n    `)) as MockModalManager;\n    const mockBraintreeManager = new MockBraintreeManager();\n    const manager = new DonationFlowModalManager({\n      braintreeManager: mockBraintreeManager,\n      modalManager: mockModalManager,\n    });\n    manager.showProcessingModal();\n    const modalOptions = mockModalManager.showModalOptions;\n    expect(modalOptions?.config.headerColor).to.equal('#497fbf');\n    expect(modalOptions?.config.showProcessingIndicator).to.be.true;\n    expect(modalOptions?.config.processingImageMode).to.equal('processing');\n    expect(modalOptions?.config.closeOnBackdropClick).to.be.false;\n    expect(modalOptions?.config.showCloseButton).to.be.false;\n    expect(modalOptions?.config.title?.strings[0]).to.contain('Processing...');\n  });\n\n  it('can show the error modal', async () => {\n    const mockModalManager = (await fixture(html`\n      <mock-modal-manager></mock-modal-manager>\n    `)) as MockModalManager;\n    const mockBraintreeManager = new MockBraintreeManager();\n    const manager = new DonationFlowModalManager({\n      braintreeManager: mockBraintreeManager,\n      modalManager: mockModalManager,\n    });\n    manager.showErrorModal({ message: 'foo-error' });\n    const modalOptions = mockModalManager.showModalOptions;\n    expect(modalOptions?.config.headerColor).to.equal('#691916');\n    expect(modalOptions?.config.showProcessingIndicator).to.be.false;\n    expect(modalOptions?.config.closeOnBackdropClick).to.be.true;\n    expect(modalOptions?.config.showCloseButton).to.be.true;\n    expect(modalOptions?.config.headline?.strings[0]).to.contain(\n      \"There's been a problem completing your donation.\",\n    );\n    expect(modalOptions?.config.message?.values[0]).to.equal('foo-error');\n  });\n\n  it('shows the thank you modal and calls `donationSuccessful` to take user to thank you page', async () => {\n    const mockModalManager = (await fixture(html`\n      <mock-modal-manager></mock-modal-manager>\n    `)) as MockModalManager;\n    const mockBraintreeManager = new MockBraintreeManager();\n    const manager = new DonationFlowModalManager({\n      braintreeManager: mockBraintreeManager,\n      modalManager: mockModalManager,\n    });\n    manager.showThankYouModal({\n      successResponse: mockSuccessResponse,\n    });\n    const modalOptions = mockModalManager.showModalOptions;\n    expect(modalOptions?.config.headerColor).to.equal('#55A183');\n    expect(modalOptions?.config.processingImageMode).to.equal('complete');\n    expect(modalOptions?.config.showProcessingIndicator).to.be.true;\n    expect(modalOptions?.config.closeOnBackdropClick).to.be.true;\n    expect(modalOptions?.config.showCloseButton).to.be.true;\n    expect(modalOptions?.config.title?.strings[0]).to.contain('Thank You!');\n    const response = mockBraintreeManager.donationSuccessfulOptions?.successResponse;\n    expect(response).to.deep.equal(mockSuccessResponse);\n  });\n\n  it('can start the donation submission flow', async () => {\n    const mockModalManager = (await fixture(html`\n      <mock-modal-manager></mock-modal-manager>\n    `)) as MockModalManager;\n    const mockBraintreeManager = new MockBraintreeManager();\n    const manager = new DonationFlowModalManager({\n      braintreeManager: mockBraintreeManager,\n      modalManager: mockModalManager,\n    });\n    const result = await manager.startDonationSubmissionFlow({\n      nonce: 'foo',\n      paymentProvider: PaymentProvider.CreditCard,\n      donationInfo: new DonationPaymentInfo({\n        donationType: DonationType.OneTime,\n        amount: 5,\n        coverFees: false,\n      }),\n      billingInfo: mockBillingInfo,\n      customerInfo: mockCustomerInfo,\n    });\n\n    expect(result).to.deep.equal({\n      success: true,\n      value: {\n        amount: 5,\n        billing: {\n          countryCodeAlpha2: 'US',\n          extendedAddress: 'Apt 123',\n          locality: 'San Francisco',\n          postalCode: '12345',\n          region: 'CA',\n          streetAddress: '123 Fake St',\n        },\n        customer: {\n          email: 'foo@bar.com',\n          firstName: 'Fooey',\n          lastName: 'McBarrison',\n        },\n        customer_id: 'bar',\n        donationType: 'one-time',\n        paymentMethodNonce: 'foo',\n        paymentProvider: 'Credit Card',\n        transaction_id: 'foo',\n      },\n    });\n  });\n});\n"]}
+{"version":3,"file":"donation-flow-modal-manager.test.js","sourceRoot":"","sources":["../../../../test/tests/flow-handlers/donation-flow-modal-manager.test.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/camelcase */\nimport { html, fixture, expect } from '@open-wc/testing';\nimport { DonationFlowModalManager } from '../../../src/payment-flow-handlers/donation-flow-modal-manager';\nimport { MockModalManager } from '../../mocks/mock-modal-manager';\nimport '../../mocks/mock-modal-manager';\nimport { MockBraintreeManager } from '../../mocks/mock-braintree-manager';\nimport { mockSuccessResponse } from '../../mocks/models/mock-success-response';\nimport {\n  PaymentProvider,\n  DonationPaymentInfo,\n  DonationType,\n} from '@internetarchive/donation-form-data-models';\nimport { mockBillingInfo } from '../../mocks/models/mock-billing-info';\nimport { mockCustomerInfo } from '../../mocks/models/mock-customer-info';\nimport { ModalConfig } from '@internetarchive/modal-manager';\n\ndescribe('Donation Flow Modal Manager', () => {\n  it('can close the modal', async () => {\n    const mockModalManager = (await fixture(html`\n      <mock-modal-manager></mock-modal-manager>\n    `)) as MockModalManager;\n    const mockBraintreeManager = new MockBraintreeManager();\n    const manager = new DonationFlowModalManager({\n      braintreeManager: mockBraintreeManager,\n      modalManager: mockModalManager,\n    });\n    manager.closeModal();\n    expect(mockModalManager.closeCalled).to.be.true;\n  });\n\n  it('can calculate the proper default upsell amount', async () => {\n    let amount = DonationFlowModalManager.getDefaultUpsellAmount(1);\n    expect(amount).to.equal(5);\n    amount = DonationFlowModalManager.getDefaultUpsellAmount(10);\n    expect(amount).to.equal(5);\n    amount = DonationFlowModalManager.getDefaultUpsellAmount(10.01);\n    expect(amount).to.equal(10);\n    amount = DonationFlowModalManager.getDefaultUpsellAmount(25);\n    expect(amount).to.equal(10);\n    amount = DonationFlowModalManager.getDefaultUpsellAmount(25.01);\n    expect(amount).to.equal(25);\n    amount = DonationFlowModalManager.getDefaultUpsellAmount(100);\n    expect(amount).to.equal(25);\n    amount = DonationFlowModalManager.getDefaultUpsellAmount(100.01);\n    expect(amount).to.equal(50);\n  });\n\n  it('can show the processing modal', async () => {\n    const mockModalManager = (await fixture(html`\n      <mock-modal-manager></mock-modal-manager>\n    `)) as MockModalManager;\n    const mockBraintreeManager = new MockBraintreeManager();\n    const manager = new DonationFlowModalManager({\n      braintreeManager: mockBraintreeManager,\n      modalManager: mockModalManager,\n    });\n    manager.showProcessingModal();\n    const modalOptions = mockModalManager.showModalOptions;\n    expect(modalOptions?.config.headerColor).to.equal('#497fbf');\n    expect(modalOptions?.config.showProcessingIndicator).to.be.true;\n    expect(modalOptions?.config.processingImageMode).to.equal('processing');\n    expect(modalOptions?.config.closeOnBackdropClick).to.be.false;\n    expect(modalOptions?.config.showCloseButton).to.be.false;\n    expect(modalOptions?.config.title?.strings[0]).to.contain('Processing...');\n  });\n\n  it('can show the error modal', async () => {\n    const mockModalManager = (await fixture(html`\n      <mock-modal-manager></mock-modal-manager>\n    `)) as MockModalManager;\n    const mockBraintreeManager = new MockBraintreeManager();\n    const manager = new DonationFlowModalManager({\n      braintreeManager: mockBraintreeManager,\n      modalManager: mockModalManager,\n    });\n    manager.showErrorModal({ message: 'foo-error' });\n    const modalOptions = mockModalManager.showModalOptions;\n    expect(modalOptions?.config.headerColor).to.equal('#691916');\n    expect(modalOptions?.config.showProcessingIndicator).to.be.false;\n    expect(modalOptions?.config.closeOnBackdropClick).to.be.true;\n    expect(modalOptions?.config.showCloseButton).to.be.true;\n    expect(modalOptions?.config.headline?.strings[0]).to.contain(\n      \"There's been a problem completing your donation.\",\n    );\n    expect(modalOptions?.config.message?.values[0]).to.equal('foo-error');\n  });\n\n  it('shows the thank you modal and calls `donationSuccessful` to take user to thank you page', async () => {\n    const mockModalManager = (await fixture(html`\n      <mock-modal-manager></mock-modal-manager>\n    `)) as MockModalManager;\n    const mockBraintreeManager = new MockBraintreeManager();\n    const manager = new DonationFlowModalManager({\n      braintreeManager: mockBraintreeManager,\n      modalManager: mockModalManager,\n    });\n    manager.showThankYouModal({\n      successResponse: mockSuccessResponse,\n    });\n    const modalOptions = mockModalManager.showModalOptions;\n    expect(modalOptions?.config.headerColor).to.equal('#55A183');\n    expect(modalOptions?.config.processingImageMode).to.equal('complete');\n    expect(modalOptions?.config.showProcessingIndicator).to.be.true;\n    expect(modalOptions?.config.closeOnBackdropClick).to.be.true;\n    expect(modalOptions?.config.showCloseButton).to.be.true;\n    expect(modalOptions?.config.title?.strings[0]).to.contain('Thank You!');\n    const response = mockBraintreeManager.donationSuccessfulOptions?.successResponse;\n    expect(response).to.deep.equal(mockSuccessResponse);\n  });\n\n  it('can show the confirmation modal', async () => {\n    const mockModalManager = (await fixture(html`\n      <mock-modal-manager></mock-modal-manager>\n    `)) as MockModalManager;\n    const mockBraintreeManager = new MockBraintreeManager();\n    const manager = new DonationFlowModalManager({\n      braintreeManager: mockBraintreeManager,\n      modalManager: mockModalManager,\n    });\n    manager.showConfirmationStepModal({\n      donationType: DonationType.Upsell,\n      amount: 8,\n      currencyType: 'USD',\n      cancelDonationCB: () => console.log('donation cancelled'),\n      confirmDonationCB: () => console.log('donation confirmed'),\n    });\n\n    const modalOptions = mockModalManager.showModalOptions;\n    expect(modalOptions?.config.headerColor).to.equal('#55A183');\n    expect(modalOptions?.config.closeOnBackdropClick).to.be.false;\n    expect(modalOptions?.config.showCloseButton).to.be.true;\n    expect(modalOptions?.config?.title?.values).to.contain('Confirm monthly donation');\n  });\n\n  it('can start the donation submission flow', async () => {\n    const mockModalManager = (await fixture(html`\n      <mock-modal-manager></mock-modal-manager>\n    `)) as MockModalManager;\n    const mockBraintreeManager = new MockBraintreeManager();\n    const manager = new DonationFlowModalManager({\n      braintreeManager: mockBraintreeManager,\n      modalManager: mockModalManager,\n    });\n    const result = await manager.startDonationSubmissionFlow({\n      nonce: 'foo',\n      paymentProvider: PaymentProvider.CreditCard,\n      donationInfo: new DonationPaymentInfo({\n        donationType: DonationType.OneTime,\n        amount: 5,\n        coverFees: false,\n      }),\n      billingInfo: mockBillingInfo,\n      customerInfo: mockCustomerInfo,\n    });\n\n    expect(result).to.deep.equal({\n      success: true,\n      value: {\n        amount: 5,\n        billing: {\n          countryCodeAlpha2: 'US',\n          extendedAddress: 'Apt 123',\n          locality: 'San Francisco',\n          postalCode: '12345',\n          region: 'CA',\n          streetAddress: '123 Fake St',\n        },\n        customer: {\n          email: 'foo@bar.com',\n          firstName: 'Fooey',\n          lastName: 'McBarrison',\n        },\n        customer_id: 'bar',\n        donationType: 'one-time',\n        paymentMethodNonce: 'foo',\n        paymentProvider: 'Credit Card',\n        transaction_id: 'foo',\n      },\n    });\n  });\n});\n"]}

package/dist/test/tests/payment-providers/paypal-button-datasource.test.js

@@ -42,6 +42,7 @@ describe('PayPalButtonDataSource', () => {
                 enableShippingAddress: true,
                 amount: 3.5,
                 currency: 'USD',
+                intent: 'capture',
             });
         }));
         it('sends the proper one-time donation request with fees covered', () => __awaiter(void 0, void 0, void 0, function* () {
@@ -65,6 +66,7 @@ describe('PayPalButtonDataSource', () => {
                 enableShippingAddress: true,
                 amount: expectedTotal,
                 currency: 'USD',
+                intent: 'capture',
             });
         }));
         it('sends the proper monthly donation request', () => __awaiter(void 0, void 0, void 0, function* () {
@@ -85,6 +87,7 @@ describe('PayPalButtonDataSource', () => {
                 flow: 'vault',
                 enableShippingAddress: true,
                 billingAgreementDescription: 'Subscribe to donate $1.50 monthly',
+                intent: 'capture',
             });
         }));
     });

package/dist/test/tests/payment-providers/paypal-button-datasource.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"paypal-button-datasource.test.js","sourceRoot":"","sources":["../../../../test/tests/payment-providers/paypal-button-datasource.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { expect } from '@open-wc/testing';\nimport { MockPayPalClient } from '../../mocks/payment-clients/mock-paypal-client';\nimport { DonationPaymentInfo, DonationType } from '@internetarchive/donation-form-data-models';\nimport { PayPalButtonDataSource } from '../../../src/braintree-manager/payment-providers/paypal/paypal-button-datasource';\nimport { MockPayPalButtonDataSourceDelegate } from '../../mocks/payment-providers/individual-providers/mock-paypal-button-datasource-delegate';\n\ndescribe('PayPalButtonDataSource', () => {\n  describe('Payment start', () => {\n    it('notifies the delegate and creates the payment when the `payment()` callback is triggered from a button press', async () => {\n      const delegate = new MockPayPalButtonDataSourceDelegate();\n      const paypalInstance = new MockPayPalClient();\n      const donation = new DonationPaymentInfo({\n        donationType: DonationType.Monthly,\n        amount: 3.5,\n        coverFees: false,\n      });\n      const datasource = new PayPalButtonDataSource({\n        donationInfo: donation,\n        paypalInstance: paypalInstance,\n      });\n\n      datasource.delegate = delegate;\n\n      const result = await datasource.payment();\n\n      expect(delegate.paymentStartedResults.called).to.be.true;\n      expect(result).to.equal('createPaymentCalled');\n    });\n\n    it('sends the proper one-time donation request', async () => {\n      const delegate = new MockPayPalButtonDataSourceDelegate();\n      const paypalInstance = new MockPayPalClient();\n      const donation = new DonationPaymentInfo({\n        donationType: DonationType.OneTime,\n        amount: 3.5,\n        coverFees: false,\n      });\n      const datasource = new PayPalButtonDataSource({\n        donationInfo: donation,\n        paypalInstance: paypalInstance,\n      });\n      datasource.delegate = delegate;\n      await datasource.payment();\n      expect(delegate.paymentStartedResults.options).to.deep.equal({\n        flow: 'checkout',\n        enableShippingAddress: true,\n        amount: 3.5,\n        currency: 'USD',\n      });\n    });\n\n    it('sends the proper one-time donation request with fees covered', async () => {\n      const baseAmount = 3.5;\n      const expectedTotal = DonationPaymentInfo.calculateTotal(baseAmount, true);\n      const delegate = new MockPayPalButtonDataSourceDelegate();\n      const paypalInstance = new MockPayPalClient();\n      const donation = new DonationPaymentInfo({\n        donationType: DonationType.OneTime,\n        amount: baseAmount,\n        coverFees: true,\n      });\n      const datasource = new PayPalButtonDataSource({\n        donationInfo: donation,\n        paypalInstance: paypalInstance,\n      });\n      datasource.delegate = delegate;\n      await datasource.payment();\n      expect(delegate.paymentStartedResults.options).to.deep.equal({\n        flow: 'checkout',\n        enableShippingAddress: true,\n        amount: expectedTotal,\n        currency: 'USD',\n      });\n    });\n\n    it('sends the proper monthly donation request', async () => {\n      const delegate = new MockPayPalButtonDataSourceDelegate();\n      const paypalInstance = new MockPayPalClient();\n      const donation = new DonationPaymentInfo({\n        donationType: DonationType.Monthly,\n        amount: 1.5,\n        coverFees: false,\n      });\n      const datasource = new PayPalButtonDataSource({\n        donationInfo: donation,\n        paypalInstance: paypalInstance,\n      });\n      datasource.delegate = delegate;\n      await datasource.payment();\n      expect(delegate.paymentStartedResults.options).to.deep.equal({\n        flow: 'vault',\n        enableShippingAddress: true,\n        billingAgreementDescription: 'Subscribe to donate $1.50 monthly',\n      });\n    });\n  });\n\n  describe('Payment authorized', () => {\n    it('it tokenizes the payment and notifies the delegate when the payment is authorized', async () => {\n      const delegate = new MockPayPalButtonDataSourceDelegate();\n      const paypalInstance = new MockPayPalClient();\n      const donation = new DonationPaymentInfo({\n        donationType: DonationType.OneTime,\n        amount: 3.5,\n        coverFees: false,\n      });\n      const datasource = new PayPalButtonDataSource({\n        donationInfo: donation,\n        paypalInstance: paypalInstance,\n      });\n\n      const authData: paypal.AuthorizationData = {\n        payerId: 'foo',\n        paymentId: '1234',\n      };\n\n      datasource.delegate = delegate;\n\n      const result = await datasource.onAuthorize(authData);\n\n      expect(delegate.paymentAuthorizedResults.called).to.be.true;\n      expect(delegate.paymentAuthorizedResults.payload?.nonce).to.equal('foo-nonce');\n\n      expect(result.nonce).to.equal('foo-nonce');\n      expect(result.type).to.equal('foo-type');\n    });\n  });\n\n  describe('Payment cancelled', () => {\n    it('it notifies the delegate when the payment is cancelled', async () => {\n      const delegate = new MockPayPalButtonDataSourceDelegate();\n      const paypalInstance = new MockPayPalClient();\n      const donation = new DonationPaymentInfo({\n        donationType: DonationType.OneTime,\n        amount: 3.5,\n        coverFees: false,\n      });\n      const datasource = new PayPalButtonDataSource({\n        donationInfo: donation,\n        paypalInstance: paypalInstance,\n      });\n\n      const cancelData = {\n        foo: 'bar',\n      };\n\n      datasource.delegate = delegate;\n\n      datasource.onCancel(cancelData);\n\n      expect(delegate.paymentCancelledResults.called).to.be.true;\n      expect(delegate.paymentCancelledResults.data).to.deep.equal(cancelData);\n    });\n  });\n\n  describe('Payment error', () => {\n    it('it notifies the delegate when there has been a payment error', async () => {\n      const delegate = new MockPayPalButtonDataSourceDelegate();\n      const paypalInstance = new MockPayPalClient();\n      const donation = new DonationPaymentInfo({\n        donationType: DonationType.OneTime,\n        amount: 3.5,\n        coverFees: false,\n      });\n      const datasource = new PayPalButtonDataSource({\n        donationInfo: donation,\n        paypalInstance: paypalInstance,\n      });\n\n      const error = 'foo-error';\n\n      datasource.delegate = delegate;\n\n      datasource.onError(error);\n\n      expect(delegate.paymentErrorResults.called).to.be.true;\n      expect(delegate.paymentErrorResults.error).to.equal(error);\n    });\n  });\n});\n"]}
+{"version":3,"file":"paypal-button-datasource.test.js","sourceRoot":"","sources":["../../../../test/tests/payment-providers/paypal-button-datasource.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { expect } from '@open-wc/testing';\nimport { MockPayPalClient } from '../../mocks/payment-clients/mock-paypal-client';\nimport { DonationPaymentInfo, DonationType } from '@internetarchive/donation-form-data-models';\nimport { PayPalButtonDataSource } from '../../../src/braintree-manager/payment-providers/paypal/paypal-button-datasource';\nimport { MockPayPalButtonDataSourceDelegate } from '../../mocks/payment-providers/individual-providers/mock-paypal-button-datasource-delegate';\n\ndescribe('PayPalButtonDataSource', () => {\n  describe('Payment start', () => {\n    it('notifies the delegate and creates the payment when the `payment()` callback is triggered from a button press', async () => {\n      const delegate = new MockPayPalButtonDataSourceDelegate();\n      const paypalInstance = new MockPayPalClient();\n      const donation = new DonationPaymentInfo({\n        donationType: DonationType.Monthly,\n        amount: 3.5,\n        coverFees: false,\n      });\n      const datasource = new PayPalButtonDataSource({\n        donationInfo: donation,\n        paypalInstance: paypalInstance,\n      });\n\n      datasource.delegate = delegate;\n\n      const result = await datasource.payment();\n\n      expect(delegate.paymentStartedResults.called).to.be.true;\n      expect(result).to.equal('createPaymentCalled');\n    });\n\n    it('sends the proper one-time donation request', async () => {\n      const delegate = new MockPayPalButtonDataSourceDelegate();\n      const paypalInstance = new MockPayPalClient();\n      const donation = new DonationPaymentInfo({\n        donationType: DonationType.OneTime,\n        amount: 3.5,\n        coverFees: false,\n      });\n      const datasource = new PayPalButtonDataSource({\n        donationInfo: donation,\n        paypalInstance: paypalInstance,\n      });\n      datasource.delegate = delegate;\n      await datasource.payment();\n      expect(delegate.paymentStartedResults.options).to.deep.equal({\n        flow: 'checkout',\n        enableShippingAddress: true,\n        amount: 3.5,\n        currency: 'USD',\n        intent: 'capture',\n      });\n    });\n\n    it('sends the proper one-time donation request with fees covered', async () => {\n      const baseAmount = 3.5;\n      const expectedTotal = DonationPaymentInfo.calculateTotal(baseAmount, true);\n      const delegate = new MockPayPalButtonDataSourceDelegate();\n      const paypalInstance = new MockPayPalClient();\n      const donation = new DonationPaymentInfo({\n        donationType: DonationType.OneTime,\n        amount: baseAmount,\n        coverFees: true,\n      });\n      const datasource = new PayPalButtonDataSource({\n        donationInfo: donation,\n        paypalInstance: paypalInstance,\n      });\n      datasource.delegate = delegate;\n      await datasource.payment();\n      expect(delegate.paymentStartedResults.options).to.deep.equal({\n        flow: 'checkout',\n        enableShippingAddress: true,\n        amount: expectedTotal,\n        currency: 'USD',\n        intent: 'capture',\n      });\n    });\n\n    it('sends the proper monthly donation request', async () => {\n      const delegate = new MockPayPalButtonDataSourceDelegate();\n      const paypalInstance = new MockPayPalClient();\n      const donation = new DonationPaymentInfo({\n        donationType: DonationType.Monthly,\n        amount: 1.5,\n        coverFees: false,\n      });\n      const datasource = new PayPalButtonDataSource({\n        donationInfo: donation,\n        paypalInstance: paypalInstance,\n      });\n      datasource.delegate = delegate;\n      await datasource.payment();\n      expect(delegate.paymentStartedResults.options).to.deep.equal({\n        flow: 'vault',\n        enableShippingAddress: true,\n        billingAgreementDescription: 'Subscribe to donate $1.50 monthly',\n        intent: 'capture',\n      });\n    });\n  });\n\n  describe('Payment authorized', () => {\n    it('it tokenizes the payment and notifies the delegate when the payment is authorized', async () => {\n      const delegate = new MockPayPalButtonDataSourceDelegate();\n      const paypalInstance = new MockPayPalClient();\n      const donation = new DonationPaymentInfo({\n        donationType: DonationType.OneTime,\n        amount: 3.5,\n        coverFees: false,\n      });\n      const datasource = new PayPalButtonDataSource({\n        donationInfo: donation,\n        paypalInstance: paypalInstance,\n      });\n\n      const authData: paypal.AuthorizationData = {\n        payerId: 'foo',\n        paymentId: '1234',\n      };\n\n      datasource.delegate = delegate;\n\n      const result = await datasource.onAuthorize(authData);\n\n      expect(delegate.paymentAuthorizedResults.called).to.be.true;\n      expect(delegate.paymentAuthorizedResults.payload?.nonce).to.equal('foo-nonce');\n\n      expect(result.nonce).to.equal('foo-nonce');\n      expect(result.type).to.equal('foo-type');\n    });\n  });\n\n  describe('Payment cancelled', () => {\n    it('it notifies the delegate when the payment is cancelled', async () => {\n      const delegate = new MockPayPalButtonDataSourceDelegate();\n      const paypalInstance = new MockPayPalClient();\n      const donation = new DonationPaymentInfo({\n        donationType: DonationType.OneTime,\n        amount: 3.5,\n        coverFees: false,\n      });\n      const datasource = new PayPalButtonDataSource({\n        donationInfo: donation,\n        paypalInstance: paypalInstance,\n      });\n\n      const cancelData = {\n        foo: 'bar',\n      };\n\n      datasource.delegate = delegate;\n\n      datasource.onCancel(cancelData);\n\n      expect(delegate.paymentCancelledResults.called).to.be.true;\n      expect(delegate.paymentCancelledResults.data).to.deep.equal(cancelData);\n    });\n  });\n\n  describe('Payment error', () => {\n    it('it notifies the delegate when there has been a payment error', async () => {\n      const delegate = new MockPayPalButtonDataSourceDelegate();\n      const paypalInstance = new MockPayPalClient();\n      const donation = new DonationPaymentInfo({\n        donationType: DonationType.OneTime,\n        amount: 3.5,\n        coverFees: false,\n      });\n      const datasource = new PayPalButtonDataSource({\n        donationInfo: donation,\n        paypalInstance: paypalInstance,\n      });\n\n      const error = 'foo-error';\n\n      datasource.delegate = delegate;\n\n      datasource.onError(error);\n\n      expect(delegate.paymentErrorResults.called).to.be.true;\n      expect(delegate.paymentErrorResults.error).to.equal(error);\n    });\n  });\n});\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@internetarchive/donation-form",
-  "version": "0.5.12-a1",
+  "version": "0.5.12-a4",
   "description": "The Internet Archive Donation Form",
   "license": "AGPL-3.0-only",
   "main": "dist/index.js",

package/src/donation-form-controller.ts

@@ -396,6 +396,7 @@ export class DonationFormController extends LitElement {
           @donationInfoChanged=${this.donationInfoChanged}
           @paymentProviderSelected=${this.paymentProviderSelected}
           @paymentFlowStarted=${this.paymentFlowStarted}
+          @paymentFlowConfirmed=${this.paymentFlowConfirmed}
           @paymentFlowCancelled=${this.paymentFlowCancelled}
           @paymentFlowError=${this.paymentFlowError}
         >
@@ -479,6 +480,12 @@ export class DonationFormController extends LitElement {
     this.logEvent(eventName, previousProviderInfo);
   }
 
+  private paymentFlowConfirmed(e: CustomEvent): void {
+    const selectedProvider = e.detail.paymentProvider as PaymentProvider;
+    const providerNoSpaces = this.removeSpaces(selectedProvider);
+    this.logEvent('PaymentFlowConfirmed', providerNoSpaces);
+  }
+
   private paymentFlowStarted(e: CustomEvent): void {
     const selectedProvider = e.detail.paymentProvider as PaymentProvider;
     const providerNoSpaces = this.removeSpaces(selectedProvider);

package/src/donation-form.ts

@@ -372,6 +372,16 @@ export class DonationForm extends LitElement {
     this.dispatchEvent(event);
   }
 
+  private emitPaymentFlowConfirmedEvent(): void {
+    if (!this.selectedPaymentProvider) {
+      return;
+    }
+    const event = new CustomEvent('paymentFlowConfirmed', {
+      detail: { paymentProvider: this.selectedPaymentProvider },
+    });
+    this.dispatchEvent(event);
+  }
+
   private emitPaymentFlowCancelledEvent(): void {
     if (!this.selectedPaymentProvider) {
       return;
@@ -462,6 +472,10 @@ export class DonationForm extends LitElement {
       this.selectedPaymentProvider = PaymentProvider.PayPal;
       this.emitPaymentFlowStartedEvent();
     });
+    this.paymentFlowHandlers?.paypalHandler?.on('payPalPaymentConfirmed', () => {
+      this.selectedPaymentProvider = PaymentProvider.PayPal;
+      this.emitPaymentFlowConfirmedEvent();
+    });
     this.paymentFlowHandlers?.paypalHandler?.on('payPalPaymentCancelled', () => {
       this.selectedPaymentProvider = PaymentProvider.PayPal;
       this.emitPaymentFlowCancelledEvent();

package/src/modals/confirm-donation-modal-content.ts

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-empty-function */
-import { LitElement, html, TemplateResult, css, CSSResultGroup } from 'lit';
+import { LitElement, html, TemplateResult, css, CSSResultGroup, nothing } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 import { DonationType } from '@internetarchive/donation-form-data-models';
 import currency from 'currency.js';
@@ -28,8 +28,14 @@ export class ConfirmDonationContent extends LitElement {
 
   get confirmationText(): TemplateResult {
     const amount = currency(this.amount, { symbol: this.currencySymbol }).format();
+    return html`
+    <p>You are about to make a <b>${this.donationType}</b> donation of <b>${amount} ${this.currencyType}</b> to the Internet Archive.</p>
+    `;
+  }
 
-    return html`<p>You are about to make a <b>${this.donationType}</b> donation of <b>${amount} ${this.currencyType}</b> to the Internet Archive.</p>`;
+  get confirmUpsellText(): TemplateResult {
+    const amount = currency(this.amount, { symbol: this.currencySymbol }).format();
+    return html`<p>You are about to begin making <b>monthly</b> donations of <b>${amount} ${this.currencyType}</b> to the Internet Archive. (Your first recurring contribution will be next month.)</p>`;
   }
 
   confirm(): void {
@@ -40,13 +46,17 @@ export class ConfirmDonationContent extends LitElement {
     this?.cancelDonation();
   }
 
+  get confirmCTA(): string {
+    return this.donationType === DonationType.Upsell ? 'Start monthly donation' : 'Complete donation';
+  }
+
   /** @inheritdoc */
   render(): TemplateResult {
     return html`
-      <p>${this.confirmationText}</p>
+      ${this.donationType === DonationType.Upsell ? this.confirmUpsellText : this.confirmationText}
 
       <div class="cta-group">
-        <button id="confirm" @click=${(): void => this.confirm()}>Complete donation</button>
+        <button id="confirm" @click=${(): void => this.confirm()}>${this.confirmCTA}</button>
         <button id="cancel" @click=${(): void => this.cancel()}>Cancel</button>
       </div>
     `;

package/src/payment-flow-handlers/donation-flow-modal-manager.ts

@@ -228,20 +228,19 @@ export class DonationFlowModalManager implements DonationFlowModalManagerInterfa
     cancelDonationCB: Function;
   }): Promise<void> {
     const confirmDonation = (): void => {
-      console.log('confirmDonation ~~~~~~~');
       options?.confirmDonationCB();
     };
     const cancelDonation = (): void => {
-      console.log('cancelDonation ~~~~~~~');
       options?.cancelDonationCB();
     };
+    const modalTitle = options.donationType === DonationType.Upsell
+      ? 'Confirm monthly donation'
+      : 'Complete donation';
+
     const modalConfig = new ModalConfig({
       closeOnBackdropClick: false,
-      // call close callback
       headerColor: ModalHeaderColor.Green,
-      title: html`
-        Confirm donation
-      `,
+      title: html`${modalTitle}`,
       message: html`
         <confirm-donation-modal
           .amount="${options.amount}"
@@ -254,6 +253,7 @@ export class DonationFlowModalManager implements DonationFlowModalManagerInterfa
     });
     return this.modalManager.showModal({
       config: modalConfig,
+      userClosedModalCallback: cancelDonation
     });
   }
 

package/src/payment-flow-handlers/handlers/paypal-flow-handler.ts

@@ -57,6 +57,7 @@ export interface PayPalFlowHandlerEvents {
   payPalPaymentStarted: (dataSource: PayPalButtonDataSourceInterface, options: object) => void;
   payPalPaymentCancelled: (dataSource: PayPalButtonDataSourceInterface, data: object) => void;
   payPalPaymentError: (dataSource: PayPalButtonDataSourceInterface, error: string) => void;
+  payPalPaymentConfirmed: (dataSource: PayPalButtonDataSourceInterface, data: object) => void;
 }
 
 /**
@@ -112,23 +113,21 @@ export class PayPalFlowHandler
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     options: object,
   ): Promise<void> {
-    console.log('payPalPaymentStarted *******', { dataSource, options });
     this.emitter.emit('payPalPaymentStarted', dataSource, options);
   }
 
+  /**
+   * Once we have the dataSource & payload, we ask patron to confirm donation.
+   * Once confirmed, we move forward to: `payPalPaymentConfirmed`
+   */
   async payPalPaymentAuthorized(dataSource: PayPalButtonDataSourceInterface,
     payload: paypal.TokenizePayload
     ): Promise<void> {
 
-      // we got dataSource & payload
-      // we need to send it to `payPalPaymentConfirmed`
-      // after patron confirms the payment
-    console.log('payPalPaymentAuthorized *******', { dataSource, payload });
-
-    const { donationType, amount } = dataSource.donationInfo;
+    const { donationType, total } = dataSource.donationInfo;
     this.donationFlowModalManager.showConfirmationStepModal({
       donationType,
-      amount,
+      amount: total,
       currencyType: 'USD', // defaults to USD for now
       confirmDonationCB: () => {
         this.payPalPaymentConfirmed(dataSource, payload);
@@ -138,10 +137,6 @@ export class PayPalFlowHandler
         this.payPalPaymentCancelled(dataSource, {});
       }
     });
-
-    // cancel payment on modal X
-    // cancel payment on cancel
-    
   }
 
   async payPalPaymentConfirmed(

package/dist/src/modals/payment-confirmation-content.d.ts

@@ -1,23 +0,0 @@
-import { LitElement, TemplateResult } from 'lit';
-import { DonationType } from '@internetarchive/donation-form-data-models';
-/**
- * This is the content that we show in the upsell modal.
- *
- * It has an amount input, "Yes" and "No Thanks" options and a switch to optionally
- * show the PayPal upsell button.
- *
- * @export
- * @class PaymentConfirmationContent
- * @extends {LitElement}
- */
-export declare class PaymentConfirmationContent extends LitElement {
-    amount: number;
-    currencyType: string;
-    donationType: DonationType;
-    get confirmationText(): string;
-    get currencySymbol(): string;
-    donationConfirmed(e: Event): void;
-    donationCancelled(e: Event): void;
-    /** @inheritdoc */
-    render(): TemplateResult;
-}

package/dist/src/modals/payment-confirmation-content.js

@@ -1,74 +0,0 @@
-import { __decorate } from "tslib";
-import { LitElement, html } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
-import { DonationType } from '@internetarchive/donation-form-data-models';
-/**
- * This is the content that we show in the upsell modal.
- *
- * It has an amount input, "Yes" and "No Thanks" options and a switch to optionally
- * show the PayPal upsell button.
- *
- * @export
- * @class PaymentConfirmationContent
- * @extends {LitElement}
- */
-let PaymentConfirmationContent = class PaymentConfirmationContent extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.amount = 5;
-        this.currencyType = '$';
-        this.donationType = DonationType.OneTime;
-    }
-    get confirmationText() {
-        return `You are about to make a ${this.donationType} donation of ${this.currencySymbol}${this.amount}${this.currencyType} to the Internet Archive`;
-    }
-    get currencySymbol() {
-        switch (this.currencyType) {
-            case 'USD':
-                return '$';
-            case 'EUR':
-                return '€';
-            case 'GBP':
-                return '£';
-            case 'JPY':
-                return '¥';
-            case 'CAD':
-                return '$';
-            case 'AUD':
-                return '$';
-            case 'NZD':
-                return '$';
-            default:
-                return '$';
-        }
-    }
-    donationConfirmed(e) {
-        console.log('donationConfirmed --- ', e);
-    }
-    donationCancelled(e) {
-        console.log('donationCancelled --- ', e);
-    }
-    /** @inheritdoc */
-    render() {
-        return html `
-      <h3>Confirm:</h3>
-      <p>${this.confirmationText}</p>
-      <button @click=${(e) => this.donationConfirmed(e)}>COMPLETE DONATION</button>
-      <button @click=${(e) => this.donationCancelled(e)}>Cancel</button>
-    `;
-    }
-};
-__decorate([
-    property({ type: Number })
-], PaymentConfirmationContent.prototype, "amount", void 0);
-__decorate([
-    property({ type: String })
-], PaymentConfirmationContent.prototype, "currencyType", void 0);
-__decorate([
-    property({ type: String })
-], PaymentConfirmationContent.prototype, "donationType", void 0);
-PaymentConfirmationContent = __decorate([
-    customElement('payment-confirmation-modal')
-], PaymentConfirmationContent);
-export { PaymentConfirmationContent };
-//# sourceMappingURL=payment-confirmation-content.js.map

package/dist/src/modals/payment-confirmation-content.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"payment-confirmation-content.js","sourceRoot":"","sources":["../../../src/modals/payment-confirmation-content.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,4CAA4C,CAAC;AAE1E;;;;;;;;;GASG;AAEH,IAAa,0BAA0B,GAAvC,MAAa,0BAA2B,SAAQ,UAAU;IAA1D;;QAC8B,WAAM,GAAG,CAAC,CAAC;QAEX,iBAAY,GAAG,GAAG,CAAC;QAEnB,iBAAY,GAAiB,YAAY,CAAC,OAAO,CAAC;IA4ChF,CAAC;IA1CC,IAAI,gBAAgB;QAClB,OAAO,2BAA2B,IAAI,CAAC,YAAY,gBAAgB,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,YAAY,0BAA0B,CAAC;IACrJ,CAAC;IAED,IAAI,cAAc;QAChB,QAAO,IAAI,CAAC,YAAY,EAAE;YACxB,KAAK,KAAK;gBACR,OAAO,GAAG,CAAC;YACb,KAAK,KAAK;gBACR,OAAO,GAAG,CAAC;YACb,KAAK,KAAK;gBACR,OAAO,GAAG,CAAC;YACb,KAAK,KAAK;gBACR,OAAO,GAAG,CAAC;YACb,KAAK,KAAK;gBACR,OAAO,GAAG,CAAC;YACb,KAAK,KAAK;gBACR,OAAO,GAAG,CAAC;YACb,KAAK,KAAK;gBACR,OAAO,GAAG,CAAC;YACb;gBACE,OAAO,GAAG,CAAC;SACd;IACH,CAAC;IAED,iBAAiB,CAAC,CAAQ;QACxB,OAAO,CAAC,GAAG,CAAC,wBAAwB,EAAE,CAAC,CAAC,CAAC;IAC3C,CAAC;IAED,iBAAiB,CAAC,CAAQ;QACxB,OAAO,CAAC,GAAG,CAAC,wBAAwB,EAAE,CAAC,CAAC,CAAC;IAC3C,CAAC;IAED,kBAAkB;IAClB,MAAM;QACJ,OAAO,IAAI,CAAA;;WAEJ,IAAI,CAAC,gBAAgB;uBACT,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC;uBACvC,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC;KACzD,CAAC;IACJ,CAAC;CACF,CAAA;AAhD6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0DAAY;AAEX;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gEAAoB;AAEnB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gEAAmD;AALnE,0BAA0B;IADtC,aAAa,CAAC,4BAA4B,CAAC;GAC/B,0BAA0B,CAiDtC;SAjDY,0BAA0B","sourcesContent":["import { LitElement, html, TemplateResult } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { DonationType } from '@internetarchive/donation-form-data-models';\n\n/**\n * This is the content that we show in the upsell modal.\n *\n * It has an amount input, \"Yes\" and \"No Thanks\" options and a switch to optionally\n * show the PayPal upsell button.\n *\n * @export\n * @class PaymentConfirmationContent\n * @extends {LitElement}\n */\n@customElement('payment-confirmation-modal')\nexport class PaymentConfirmationContent extends LitElement {\n  @property({ type: Number }) amount = 5;\n\n  @property({ type: String }) currencyType = '$';\n\n  @property({ type: String }) donationType: DonationType = DonationType.OneTime;\n\n  get confirmationText(): string {\n    return `You are about to make a ${this.donationType} donation of ${this.currencySymbol}${this.amount}${this.currencyType} to the Internet Archive`;\n  }\n\n  get currencySymbol(): string {\n    switch(this.currencyType) {\n      case 'USD':\n        return '$';\n      case 'EUR':\n        return '€';\n      case 'GBP':\n        return '£';\n      case 'JPY':\n        return '¥';\n      case 'CAD':\n        return '$';\n      case 'AUD':\n        return '$';\n      case 'NZD':\n        return '$';\n      default:\n        return '$';\n    }\n  }\n\n  donationConfirmed(e: Event): void {\n    console.log('donationConfirmed --- ', e);\n  }\n\n  donationCancelled(e: Event): void {\n    console.log('donationCancelled --- ', e);\n  }\n\n  /** @inheritdoc */\n  render(): TemplateResult {\n    return html`\n      <h3>Confirm:</h3>\n      <p>${this.confirmationText}</p>\n      <button @click=${(e: Event) => this.donationConfirmed(e)}>COMPLETE DONATION</button>\n      <button @click=${(e: Event) => this.donationCancelled(e)}>Cancel</button>\n    `;\n  }\n}"]}