@internetarchive/donation-form 0.5.20 → 0.5.21-a2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (135) hide show
  1. package/dist/demo/braintree-endpoint-manager.js +0 -1
  2. package/dist/demo/braintree-endpoint-manager.js.map +1 -1
  3. package/dist/demo/demo-analytics-handler.js.map +1 -1
  4. package/dist/demo/submit-form-with.js.map +1 -1
  5. package/dist/src/braintree-manager/braintree-manager.js +33 -35
  6. package/dist/src/braintree-manager/braintree-manager.js.map +1 -1
  7. package/dist/src/braintree-manager/payment-clients.js.map +1 -1
  8. package/dist/src/braintree-manager/payment-providers/apple-pay/apple-pay-interface.js +1 -0
  9. package/dist/src/braintree-manager/payment-providers/apple-pay/apple-pay-session-datasource-delegate.js +1 -0
  10. package/dist/src/braintree-manager/payment-providers/apple-pay/apple-pay-session-datasource-interface.js +1 -0
  11. package/dist/src/braintree-manager/payment-providers/apple-pay/apple-pay-session-datasource.js.map +1 -1
  12. package/dist/src/braintree-manager/payment-providers/apple-pay/apple-pay.js +15 -14
  13. package/dist/src/braintree-manager/payment-providers/apple-pay/apple-pay.js.map +1 -1
  14. package/dist/src/braintree-manager/payment-providers/credit-card/credit-card-interface.js +1 -0
  15. package/dist/src/braintree-manager/payment-providers/credit-card/credit-card.js +3 -3
  16. package/dist/src/braintree-manager/payment-providers/credit-card/credit-card.js.map +1 -1
  17. package/dist/src/braintree-manager/payment-providers/credit-card/hosted-field-container.js +6 -6
  18. package/dist/src/braintree-manager/payment-providers/credit-card/hosted-field-container.js.map +1 -1
  19. package/dist/src/braintree-manager/payment-providers/google-pay-interface.js +1 -0
  20. package/dist/src/braintree-manager/payment-providers/google-pay.js +15 -15
  21. package/dist/src/braintree-manager/payment-providers/google-pay.js.map +1 -1
  22. package/dist/src/braintree-manager/payment-providers/paypal/paypal-button-datasource.js.map +1 -1
  23. package/dist/src/braintree-manager/payment-providers/paypal/paypal-interface.js +1 -0
  24. package/dist/src/braintree-manager/payment-providers/paypal/paypal.js +1 -3
  25. package/dist/src/braintree-manager/payment-providers/paypal/paypal.js.map +1 -1
  26. package/dist/src/braintree-manager/payment-providers/venmo-interface.js +1 -0
  27. package/dist/src/braintree-manager/payment-providers/venmo.js +9 -8
  28. package/dist/src/braintree-manager/payment-providers/venmo.js.map +1 -1
  29. package/dist/src/braintree-manager/payment-providers-interface.d.ts +1 -1
  30. package/dist/src/braintree-manager/payment-providers-interface.js +1 -0
  31. package/dist/src/braintree-manager/payment-providers.js +3 -3
  32. package/dist/src/braintree-manager/payment-providers.js.map +1 -1
  33. package/dist/src/donation-form-controller.js +6 -5
  34. package/dist/src/donation-form-controller.js.map +1 -1
  35. package/dist/src/donation-form.js +10 -10
  36. package/dist/src/donation-form.js.map +1 -1
  37. package/dist/src/form-elements/badged-input.js +1 -5
  38. package/dist/src/form-elements/badged-input.js.map +1 -1
  39. package/dist/src/form-elements/contact-form/autocomplete-field-options.d.ts +1 -1
  40. package/dist/src/form-elements/contact-form/autocomplete-field-options.js +1 -0
  41. package/dist/src/form-elements/contact-form/contact-form.js +12 -10
  42. package/dist/src/form-elements/contact-form/contact-form.js.map +1 -1
  43. package/dist/src/form-elements/header/donation-form-header.js +1 -3
  44. package/dist/src/form-elements/header/donation-form-header.js.map +1 -1
  45. package/dist/src/form-elements/header/donation-summary.js.map +1 -1
  46. package/dist/src/form-elements/payment-selector.js +4 -4
  47. package/dist/src/form-elements/payment-selector.js.map +1 -1
  48. package/dist/src/form-elements/total-amount.js.map +1 -1
  49. package/dist/src/modals/confirm-donation-modal-content.js +13 -3
  50. package/dist/src/modals/confirm-donation-modal-content.js.map +1 -1
  51. package/dist/src/modals/error-modal-content.js.map +1 -1
  52. package/dist/src/modals/upsell-modal-content.js +5 -15
  53. package/dist/src/modals/upsell-modal-content.js.map +1 -1
  54. package/dist/src/payment-flow-handlers/donation-flow-modal-manager.js +8 -19
  55. package/dist/src/payment-flow-handlers/donation-flow-modal-manager.js.map +1 -1
  56. package/dist/src/payment-flow-handlers/handlers/applepay-flow-handler.js.map +1 -1
  57. package/dist/src/payment-flow-handlers/handlers/creditcard-flow-handler.js.map +1 -1
  58. package/dist/src/payment-flow-handlers/handlers/googlepay-flow-handler.js.map +1 -1
  59. package/dist/src/payment-flow-handlers/handlers/paypal-flow-handler.js +6 -6
  60. package/dist/src/payment-flow-handlers/handlers/paypal-flow-handler.js.map +1 -1
  61. package/dist/src/payment-flow-handlers/handlers/venmo-flow-handler.js +2 -1
  62. package/dist/src/payment-flow-handlers/handlers/venmo-flow-handler.js.map +1 -1
  63. package/dist/src/payment-flow-handlers/handlers/venmo-restoration-state-handler.js.map +1 -1
  64. package/dist/src/payment-flow-handlers/payment-flow-handlers.js +11 -11
  65. package/dist/src/payment-flow-handlers/payment-flow-handlers.js.map +1 -1
  66. package/dist/test/mocks/flow-handlers/individual-handlers/mock-creditcard-flow-handler.js.map +1 -1
  67. package/dist/test/mocks/flow-handlers/individual-handlers/mock-googlepay-flow-handler.js.map +1 -1
  68. package/dist/test/mocks/flow-handlers/mock-payment-flow-handlers.js.map +1 -1
  69. package/dist/test/mocks/mock-braintree-manager.js.map +1 -1
  70. package/dist/test/mocks/mock-modal-manager.js.map +1 -1
  71. package/dist/test/mocks/mock-payment-clients.js +68 -58
  72. package/dist/test/mocks/mock-payment-clients.js.map +1 -1
  73. package/dist/test/mocks/models/mock-custom-fields.js +0 -1
  74. package/dist/test/mocks/models/mock-custom-fields.js.map +1 -1
  75. package/dist/test/mocks/models/mock-success-response.js +0 -1
  76. package/dist/test/mocks/models/mock-success-response.js.map +1 -1
  77. package/dist/test/mocks/payment-clients/mock-applepay-client.js.map +1 -1
  78. package/dist/test/mocks/payment-clients/mock-applepay-paymentauthorizedevent.js.map +1 -1
  79. package/dist/test/mocks/payment-clients/mock-applepay-sessionmanager.js +3 -3
  80. package/dist/test/mocks/payment-clients/mock-applepay-sessionmanager.js.map +1 -1
  81. package/dist/test/mocks/payment-clients/mock-googlepay-library.js +4 -4
  82. package/dist/test/mocks/payment-clients/mock-googlepay-library.js.map +1 -1
  83. package/dist/test/mocks/payment-clients/mock-grecaptcha.js +8 -9
  84. package/dist/test/mocks/payment-clients/mock-grecaptcha.js.map +1 -1
  85. package/dist/test/mocks/payment-clients/mock-hostedfields-client.js +6 -6
  86. package/dist/test/mocks/payment-clients/mock-hostedfields-client.js.map +1 -1
  87. package/dist/test/mocks/payment-clients/mock-venmo-client.js +5 -5
  88. package/dist/test/mocks/payment-clients/mock-venmo-client.js.map +1 -1
  89. package/dist/test/mocks/payment-providers/individual-providers/mock-creditcard-handler.js +13 -13
  90. package/dist/test/mocks/payment-providers/individual-providers/mock-creditcard-handler.js.map +1 -1
  91. package/dist/test/mocks/payment-providers/individual-providers/mock-paypal-button-datasource.js.map +1 -1
  92. package/dist/test/mocks/payment-providers/mock-payment-providers.js +2 -1
  93. package/dist/test/mocks/payment-providers/mock-payment-providers.js.map +1 -1
  94. package/dist/test/tests/braintree-manager.test.js +0 -1
  95. package/dist/test/tests/braintree-manager.test.js.map +1 -1
  96. package/dist/test/tests/donation-form-controller.test.js +1 -3
  97. package/dist/test/tests/donation-form-controller.test.js.map +1 -1
  98. package/dist/test/tests/donation-form.test.js +4 -12
  99. package/dist/test/tests/donation-form.test.js.map +1 -1
  100. package/dist/test/tests/flow-handlers/donation-flow-modal-manager.test.js +7 -8
  101. package/dist/test/tests/flow-handlers/donation-flow-modal-manager.test.js.map +1 -1
  102. package/dist/test/tests/form-elements/donation-summary.test.js +2 -6
  103. package/dist/test/tests/form-elements/donation-summary.test.js.map +1 -1
  104. package/dist/test/tests/form-elements/payment-selector.test.js +5 -15
  105. package/dist/test/tests/form-elements/payment-selector.test.js.map +1 -1
  106. package/dist/test/tests/modals/error-modal-content.test.js.map +1 -1
  107. package/dist/test/tests/modals/upsell-modal-content.test.js.map +1 -1
  108. package/dist/test/tests/payment-clients.test.js.map +1 -1
  109. package/dist/test/tests/payment-providers/applepay.test.js +1 -1
  110. package/dist/test/tests/payment-providers/applepay.test.js.map +1 -1
  111. package/dist/test/tests/payment-providers/paypal-button-datasource.test.js.map +1 -1
  112. package/dist/test/tests/payment-providers/venmo.test.js +1 -1
  113. package/dist/test/tests/payment-providers/venmo.test.js.map +1 -1
  114. package/dist/test/tests/recaptcha-manager.test.js +4 -12
  115. package/dist/test/tests/recaptcha-manager.test.js.map +1 -1
  116. package/package.json +31 -25
  117. package/src/braintree-manager/braintree-manager.ts +0 -2
  118. package/src/braintree-manager/payment-clients.ts +1 -2
  119. package/src/braintree-manager/payment-providers/paypal/paypal-button-datasource.ts +1 -1
  120. package/src/braintree-manager/payment-providers/paypal/paypal.ts +3 -3
  121. package/src/donation-form-controller.ts +10 -9
  122. package/src/donation-form.ts +13 -16
  123. package/src/form-elements/badged-input.ts +1 -5
  124. package/src/form-elements/contact-form/contact-form.ts +25 -23
  125. package/src/form-elements/header/donation-form-header.ts +1 -3
  126. package/src/form-elements/payment-selector.ts +4 -4
  127. package/src/modals/confirm-donation-modal-content.ts +16 -6
  128. package/src/modals/upsell-modal-content.ts +5 -15
  129. package/src/payment-flow-handlers/donation-flow-modal-manager.ts +12 -22
  130. package/src/payment-flow-handlers/handlers/applepay-flow-handler.ts +2 -1
  131. package/src/payment-flow-handlers/handlers/creditcard-flow-handler.ts +2 -1
  132. package/src/payment-flow-handlers/handlers/googlepay-flow-handler.ts +4 -6
  133. package/src/payment-flow-handlers/handlers/paypal-flow-handler.ts +7 -6
  134. package/src/payment-flow-handlers/handlers/venmo-flow-handler.ts +2 -1
  135. package/src/payment-flow-handlers/payment-flow-handlers.ts +1 -0
@@ -1 +1 @@
1
- {"version":3,"file":"confirm-donation-modal-content.js","sourceRoot":"","sources":["../../../src/modals/confirm-donation-modal-content.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/no-empty-function */\nimport { LitElement, html, TemplateResult, css, CSSResultGroup } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { DonationType } from '@internetarchive/donation-form-data-models';\nimport currency from 'currency.js';\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 ConfirmDonationContent\n * @extends {LitElement}\n */\n@customElement('confirm-donation-modal')\nexport class ConfirmDonationContent 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 @property({ type: Function }) confirmDonation: Function = (): void => {};\n\n @property({ type: Function }) cancelDonation: Function= (): void => {};\n\n get confirmationText(): TemplateResult {\n const amount = currency(this.amount, { symbol: this.currencySymbol }).format();\n return html`\n <p>You are about to make a <b>${this.donationType}</b> donation of <b>${amount} ${this.currencyType}</b> to the Internet Archive.</p>\n `;\n }\n\n get confirmUpsellText(): TemplateResult {\n const amount = currency(this.amount, { symbol: this.currencySymbol }).format();\n 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>`;\n }\n\n confirm(): void {\n this?.confirmDonation();\n }\n\n cancel(): void {\n this?.cancelDonation();\n }\n\n get confirmCTA(): string {\n return this.donationType === DonationType.Upsell ? 'Start monthly donation' : 'Complete donation';\n }\n\n /** @inheritdoc */\n render(): TemplateResult {\n return html`\n ${this.donationType === DonationType.Upsell ? this.confirmUpsellText : this.confirmationText}\n\n <div class=\"cta-group\">\n <button id=\"confirm\" @click=${(): void => this.confirm()}>${this.confirmCTA}</button>\n <button id=\"cancel\" @click=${(): void => this.cancel()}>Cancel</button>\n </div>\n `;\n }\n\n static get styles(): CSSResultGroup {\n const ctaButtonColor = css`var(--upsellCTAButtonColor, #194880)`;\n const ctaButtonDisabledColor = css`var(--upsellCTAButtonDisabledColor, rgba(109,148,201,0.5))`;\n\n return css`\n :host {\n display: block;\n }\n\n button {\n outline: none;\n cursor: pointer;\n }\n\n button#confirm {\n font-size: 2rem;\n display: block;\n width: 100%;\n margin-top: 0.5rem;\n padding: 1rem 2rem;\n background-color: ${ctaButtonColor};\n color: #fff;\n border-radius: 5px;\n border: 0;\n font-weight: bold;\n line-height: normal;\n }\n\n button#cancel {\n margin-top: 1rem;\n border: 0;\n text-decoration: underline;\n background-color: transparent;\n }\n\n button:disabled {\n background-color: ${ctaButtonDisabledColor};\n cursor: not-allowed;\n }\n }`;\n }\n\n /**\n * https://developer.paypal.com/docs/reports/reference/paypal-supported-currencies/\n */\n get currencySymbol(): string {\n switch(this.currencyType) {\n case 'AUD':\n return 'AU$';\n case 'BRL':\n return 'R$';\n case 'CAD':\n return 'CA$';\n case 'CHF':\n return 'Fr';\n case 'CNY':\n return '¥';\n case 'CZK':\n return 'Kč';\n case 'DKK':\n return 'Kr';\n case 'EUR':\n return '€';\n case 'GBP':\n return '£';\n case 'HKD':\n return 'HK$';\n case 'HUF':\n return 'Ft';\n case 'ILS':\n return '₪';\n case 'JPY':\n return '¥';\n case 'MXN':\n return 'MX$';\n case 'MYR':\n return 'RM';\n case 'NOK':\n return 'kr';\n case 'PLN':\n return 'zł';\n case 'RUB':\n return '₽';\n case 'SEK':\n return 'kr';\n case 'SGD':\n return 'S$';\n case 'THB':\n return '฿';\n case 'TYD':\n return 'NT$';\n default:\n return '$'; // $ as default USD, NZD\n }\n }\n}\n"]}
1
+ {"version":3,"file":"confirm-donation-modal-content.js","sourceRoot":"","sources":["../../../src/modals/confirm-donation-modal-content.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/no-empty-function */\n/* eslint-disable @typescript-eslint/ban-types */\nimport { LitElement, html, TemplateResult, css, CSSResultGroup } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { DonationType } from '@internetarchive/donation-form-data-models';\nimport currency from 'currency.js';\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 ConfirmDonationContent\n * @extends {LitElement}\n */\n@customElement('confirm-donation-modal')\nexport class ConfirmDonationContent 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 @property({ type: Function }) confirmDonation: Function = (): void => {};\n\n @property({ type: Function }) cancelDonation: Function = (): void => {};\n\n get confirmationText(): TemplateResult {\n const amount = currency(this.amount, { symbol: this.currencySymbol }).format();\n return html`\n <p>\n You are about to make a <b>${this.donationType}</b> donation of\n <b>${amount} ${this.currencyType}</b> to the Internet Archive.\n </p>\n `;\n }\n\n get confirmUpsellText(): TemplateResult {\n const amount = currency(this.amount, { symbol: this.currencySymbol }).format();\n return html`<p>\n You are about to begin making <b>monthly</b> donations of\n <b>${amount} ${this.currencyType}</b> to the Internet Archive. (Your first recurring\n contribution will be next month.)\n </p>`;\n }\n\n confirm(): void {\n this?.confirmDonation();\n }\n\n cancel(): void {\n this?.cancelDonation();\n }\n\n get confirmCTA(): string {\n return this.donationType === DonationType.Upsell\n ? 'Start monthly donation'\n : 'Complete donation';\n }\n\n /** @inheritdoc */\n render(): TemplateResult {\n return html`\n ${this.donationType === DonationType.Upsell ? this.confirmUpsellText : this.confirmationText}\n\n <div class=\"cta-group\">\n <button id=\"confirm\" @click=${(): void => this.confirm()}>${this.confirmCTA}</button>\n <button id=\"cancel\" @click=${(): void => this.cancel()}>Cancel</button>\n </div>\n `;\n }\n\n static get styles(): CSSResultGroup {\n const ctaButtonColor = css`var(--upsellCTAButtonColor, #194880)`;\n const ctaButtonDisabledColor = css`var(--upsellCTAButtonDisabledColor, rgba(109,148,201,0.5))`;\n\n return css`\n :host {\n display: block;\n }\n\n button {\n outline: none;\n cursor: pointer;\n }\n\n button#confirm {\n font-size: 2rem;\n display: block;\n width: 100%;\n margin-top: 0.5rem;\n padding: 1rem 2rem;\n background-color: ${ctaButtonColor};\n color: #fff;\n border-radius: 5px;\n border: 0;\n font-weight: bold;\n line-height: normal;\n }\n\n button#cancel {\n margin-top: 1rem;\n border: 0;\n text-decoration: underline;\n background-color: transparent;\n }\n\n button:disabled {\n background-color: ${ctaButtonDisabledColor};\n cursor: not-allowed;\n }\n }`;\n }\n\n /**\n * https://developer.paypal.com/docs/reports/reference/paypal-supported-currencies/\n */\n get currencySymbol(): string {\n switch (this.currencyType) {\n case 'AUD':\n return 'AU$';\n case 'BRL':\n return 'R$';\n case 'CAD':\n return 'CA$';\n case 'CHF':\n return 'Fr';\n case 'CNY':\n return '¥';\n case 'CZK':\n return 'Kč';\n case 'DKK':\n return 'Kr';\n case 'EUR':\n return '€';\n case 'GBP':\n return '£';\n case 'HKD':\n return 'HK$';\n case 'HUF':\n return 'Ft';\n case 'ILS':\n return '₪';\n case 'JPY':\n return '¥';\n case 'MXN':\n return 'MX$';\n case 'MYR':\n return 'RM';\n case 'NOK':\n return 'kr';\n case 'PLN':\n return 'zł';\n case 'RUB':\n return '₽';\n case 'SEK':\n return 'kr';\n case 'SGD':\n return 'S$';\n case 'THB':\n return '฿';\n case 'TYD':\n return 'NT$';\n default:\n return '$'; // $ as default USD, NZD\n }\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"error-modal-content.js","sourceRoot":"","sources":["../../../src/modals/error-modal-content.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAA6B,MAAM,KAAK,CAAC;AACvE,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD;;;;;;GAMG;AAEH,IAAa,iBAAiB,GAA9B,MAAa,iBAAkB,SAAQ,UAAU;IAC/C,kBAAkB;IAClB,MAAM;QACJ,OAAO,IAAI,CAAA;;;;;;;;;;KAUV,CAAC;IACJ,CAAC;IAED,kBAAkB;IAClB,MAAM,KAAK,MAAM;QACf,MAAM,sBAAsB,GAAG,GAAG,CAAA,+CAA+C,CAAC;QAClF,MAAM,sBAAsB,GAAG,GAAG,CAAA,+CAA+C,CAAC;QAClF,MAAM,qBAAqB,GAAG,GAAG,CAAA,gDAAgD,CAAC;QAElF,OAAO,GAAG,CAAA;;sBAEQ,sBAAsB;;;;;;;iBAO3B,sBAAsB;qBAClB,qBAAqB;;KAErC,CAAC;IACJ,CAAC;CACF,CAAA;AApCY,iBAAiB;IAD7B,aAAa,CAAC,mCAAmC,CAAC;GACtC,iBAAiB,CAoC7B;SApCY,iBAAiB","sourcesContent":["import { LitElement, html, css, CSSResult, TemplateResult } from 'lit';\nimport { customElement } from 'lit/decorators.js';\n\n/**\n * This is shown at the bottom of the error modal.\n *\n * @export\n * @class ErrorModalContent\n * @extends {LitElement}\n */\n@customElement('donation-form-error-modal-content')\nexport class ErrorModalContent extends LitElement {\n /** @inheritdoc */\n render(): TemplateResult {\n return html`\n <div class=\"container\">\n <a\n href=\"https://help.archive.org/help/why-is-there-a-problem-processing-my-donation/\"\n rel=\"noopener\"\n target=\"_blank\"\n >\n Questions?\n </a>\n </div>\n `;\n }\n\n /** @inheritdoc */\n static get styles(): CSSResult {\n const questionsLinkTopMargin = css`var(--errorModalQuestionsLinkTopMargin, 1rem)`;\n const questionsLinkFontColor = css`var(--errorModalQuestionsLinkFontColor, #333)`;\n const questionsLinkFontSize = css`var(--errorModalQuestionsLinkFontSize, 1.4rem)`;\n\n return css`\n .container {\n margin-top: ${questionsLinkTopMargin};\n text-align: center;\n }\n\n a,\n a:link,\n a:visited {\n color: ${questionsLinkFontColor};\n font-size: ${questionsLinkFontSize};\n }\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"error-modal-content.js","sourceRoot":"","sources":["../../../src/modals/error-modal-content.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAA6B,MAAM,KAAK,CAAC;AACvE,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD;;;;;;GAMG;AAEI,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,UAAU;IAC/C,kBAAkB;IAClB,MAAM;QACJ,OAAO,IAAI,CAAA;;;;;;;;;;KAUV,CAAC;IACJ,CAAC;IAED,kBAAkB;IAClB,MAAM,KAAK,MAAM;QACf,MAAM,sBAAsB,GAAG,GAAG,CAAA,+CAA+C,CAAC;QAClF,MAAM,sBAAsB,GAAG,GAAG,CAAA,+CAA+C,CAAC;QAClF,MAAM,qBAAqB,GAAG,GAAG,CAAA,gDAAgD,CAAC;QAElF,OAAO,GAAG,CAAA;;sBAEQ,sBAAsB;;;;;;;iBAO3B,sBAAsB;qBAClB,qBAAqB;;KAErC,CAAC;IACJ,CAAC;CACF,CAAA;AApCY,iBAAiB;IAD7B,aAAa,CAAC,mCAAmC,CAAC;GACtC,iBAAiB,CAoC7B;SApCY,iBAAiB","sourcesContent":["import { LitElement, html, css, CSSResult, TemplateResult } from 'lit';\nimport { customElement } from 'lit/decorators.js';\n\n/**\n * This is shown at the bottom of the error modal.\n *\n * @export\n * @class ErrorModalContent\n * @extends {LitElement}\n */\n@customElement('donation-form-error-modal-content')\nexport class ErrorModalContent extends LitElement {\n /** @inheritdoc */\n render(): TemplateResult {\n return html`\n <div class=\"container\">\n <a\n href=\"https://help.archive.org/help/why-is-there-a-problem-processing-my-donation/\"\n rel=\"noopener\"\n target=\"_blank\"\n >\n Questions?\n </a>\n </div>\n `;\n }\n\n /** @inheritdoc */\n static get styles(): CSSResult {\n const questionsLinkTopMargin = css`var(--errorModalQuestionsLinkTopMargin, 1rem)`;\n const questionsLinkFontColor = css`var(--errorModalQuestionsLinkFontColor, #333)`;\n const questionsLinkFontSize = css`var(--errorModalQuestionsLinkFontSize, 1.4rem)`;\n\n return css`\n .container {\n margin-top: ${questionsLinkTopMargin};\n text-align: center;\n }\n\n a,\n a:link,\n a:visited {\n color: ${questionsLinkFontColor};\n font-size: ${questionsLinkFontSize};\n }\n `;\n }\n}\n"]}
@@ -28,14 +28,10 @@ let UpsellModalContent = class UpsellModalContent extends LitElement {
28
28
  render() {
29
29
  return html `
30
30
  <h3>Thank you for donating!</h3>
31
- <button @click=${this.noThanksSelected} class="cta-button" id="no-button">
32
- Continue
33
- </button>
31
+ <button @click=${this.noThanksSelected} class="cta-button" id="no-button">Continue</button>
34
32
  <p class="or_separator"><span>or</span></p>
35
33
  <h3>Consider donating monthly</h3>
36
- <p class="appeal">
37
- Monthly support helps us reliably plan for the future.
38
- </p>
34
+ <p class="appeal">Monthly support helps us reliably plan for the future.</p>
39
35
  <div class="monthly-amount">
40
36
  <h1>Enter your monthly amount</h1>
41
37
  <div class="amount-input">
@@ -73,9 +69,7 @@ let UpsellModalContent = class UpsellModalContent extends LitElement {
73
69
  return html `
74
70
  <div class="paypal-upsell-slot-container">
75
71
  <div class="paypal-upsell-slot-blocker ${this.error ? '' : 'hidden'}"></div>
76
- <button class="cta-button" id="paypal-cover-button">
77
- YES, I'll donate monthly
78
- </button>
72
+ <button class="cta-button" id="paypal-cover-button">YES, I'll donate monthly</button>
79
73
  <slot class="paypal-upsell-slot"></slot>
80
74
  </div>
81
75
  `;
@@ -92,9 +86,7 @@ let UpsellModalContent = class UpsellModalContent extends LitElement {
92
86
  handleCustomAmountInput(value) {
93
87
  const amount = parseFloat(value);
94
88
  if (isNaN(amount)) {
95
- this.error = html `
96
- Please enter a valid amount.
97
- `;
89
+ this.error = html ` Please enter a valid amount. `;
98
90
  }
99
91
  else {
100
92
  this.processAmount(amount);
@@ -110,9 +102,7 @@ let UpsellModalContent = class UpsellModalContent extends LitElement {
110
102
  }
111
103
  if (amount < 1) {
112
104
  if (this.amountInput && this.amountInput.value.length > 0) {
113
- this.error = html `
114
- The minimum donation amount is $1.
115
- `;
105
+ this.error = html ` The minimum donation amount is $1. `;
116
106
  }
117
107
  return;
118
108
  }
@@ -1 +1 @@
1
- {"version":3,"file":"upsell-modal-content.js","sourceRoot":"","sources":["../../../src/modals/upsell-modal-content.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css, CSSResult, TemplateResult } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { CurrencyValidator } from '@internetarchive/donation-form-currency-validator';\n\nexport enum UpsellModalCTAMode {\n YesButton = 'YesButton',\n PayPalUpsellSlot = 'PayPalUpsellSlot',\n}\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 UpsellModalContent\n * @extends {LitElement}\n */\n@customElement('upsell-modal-content')\nexport class UpsellModalContent extends LitElement {\n @property({ type: String }) yesButtonMode: UpsellModalCTAMode = UpsellModalCTAMode.YesButton;\n\n @property({ type: Number }) amount = 5;\n\n @property({ type: Object }) error?: TemplateResult;\n\n @query('#amount-input') amountInput!: HTMLInputElement;\n\n private currencyValidator: CurrencyValidator = new CurrencyValidator();\n\n /** @inheritdoc */\n render(): TemplateResult {\n return html`\n <h3>Thank you for donating!</h3>\n <button @click=${this.noThanksSelected} class=\"cta-button\" id=\"no-button\">\n Continue\n </button>\n <p class=\"or_separator\"><span>or</span></p>\n <h3>Consider donating monthly</h3>\n <p class=\"appeal\">\n Monthly support helps us reliably plan for the future.\n </p>\n <div class=\"monthly-amount\">\n <h1>Enter your monthly amount</h1>\n <div class=\"amount-input\">\n <span class=\"dollar-symbol\">$</span>\n <input\n id=\"amount-input\"\n type=\"text\"\n tabindex=\"0\"\n value=${this.amount}\n @input=${this.amountChanged}\n @keydown=${this.currencyValidator.keydown}\n />\n </div>\n <div class=\"error ${this.error ? '' : 'hidden'}\">${this.error}</div>\n </div>\n\n ${this.yesButton}\n `;\n }\n\n private get yesButton(): TemplateResult {\n switch (this.yesButtonMode) {\n case UpsellModalCTAMode.YesButton:\n return html`\n <button\n class=\"cta-button\"\n tabindex=\"0\"\n id=\"yes-button\"\n @click=${this.yesSelected}\n .disabled=${this.error !== undefined}\n >\n YES, I'll donate monthly\n </button>\n `;\n case UpsellModalCTAMode.PayPalUpsellSlot:\n return html`\n <div class=\"paypal-upsell-slot-container\">\n <div class=\"paypal-upsell-slot-blocker ${this.error ? '' : 'hidden'}\"></div>\n <button class=\"cta-button\" id=\"paypal-cover-button\">\n YES, I'll donate monthly\n </button>\n <slot class=\"paypal-upsell-slot\"></slot>\n </div>\n `;\n }\n }\n\n private amountChanged(e: Event): void {\n const target = e.target as HTMLInputElement;\n const amount = target.value;\n if (amount.length === 0) {\n return;\n }\n this.handleCustomAmountInput(amount);\n }\n\n private handleCustomAmountInput(value: string): void {\n const amount = parseFloat(value);\n if (isNaN(amount)) {\n this.error = html`\n Please enter a valid amount.\n `;\n } else {\n this.processAmount(amount);\n }\n }\n\n private processAmount(amount: number): void {\n if (amount >= 10000) {\n this.error = html`\n To make a donation of $10,000 or more, please contact our philanthropy department at\n <a href=\"mailto:donations@archive.org\">donations@archive.org</a>\n `;\n return;\n }\n\n if (amount < 1) {\n if (this.amountInput && this.amountInput.value.length > 0) {\n this.error = html`\n The minimum donation amount is $1.\n `;\n }\n return;\n }\n\n this.error = undefined;\n\n this.amount = amount;\n\n const event = new CustomEvent('amountChanged', { detail: { amount: this.amount } });\n this.dispatchEvent(event);\n }\n\n private yesSelected(): void {\n const event = new CustomEvent('yesSelected', { detail: { amount: this.amount } });\n this.dispatchEvent(event);\n }\n\n private noThanksSelected(): void {\n this.dispatchEvent(new Event('noThanksSelected'));\n }\n\n /** @inheritdoc */\n static get styles(): CSSResult {\n const ctaButtonColor = css`var(--upsellCTAButtonColor, #194880)`;\n const ctaButtonDisabledColor = css`var(--upsellCTAButtonDisabledColor, rgba(109,148,201,0.5))`;\n const amountInputOffset = css`var(--upsellAmountInputOffset, -1rem)`;\n\n return css`\n .monthly-amount {\n background-color: #fff;\n padding: 0.5rem 0.625rem;\n border-radius: 5px;\n text-align: center;\n margin-bottom: 0.5rem;\n margin-top: 0;\n }\n\n .monthly-amount h1 {\n font-size: 1.8rem;\n font-weight: bold;\n text-align: center;\n line-height: 1.2em;\n margin: 0;\n padding: 0.5rem 0 0 0;\n }\n\n .hidden {\n display: none;\n }\n\n h3 {\n text-align: center;\n font-size: 1.8rem;\n margin: 0 1rem 0.5rem 1rem;\n }\n\n .appeal {\n text-align: center;\n font-size: 1.6rem;\n margin: 0.5rem 1rem;\n }\n\n .amount-input {\n transform: translate(${amountInputOffset}, 0); /* translate slightly to center the input */\n }\n\n .amount-input .dollar-symbol {\n font-size: 1.8rem;\n font-weight: bold;\n }\n\n .amount-input input {\n width: 100px;\n text-align: center;\n border: none;\n border-bottom: 1px solid gray;\n font-weight: bold;\n font-size: 3.4rem;\n }\n\n .cta-button {\n font-size: 2rem;\n display: block;\n width: 100%;\n margin-top: 0.5rem;\n padding: 1rem 2rem;\n background-color: ${ctaButtonColor};\n color: #fff;\n border-radius: 5px;\n border: 0;\n font-weight: bold;\n line-height: normal;\n outline: none;\n cursor: pointer;\n }\n\n .cta-button:disabled {\n background-color: ${ctaButtonDisabledColor};\n cursor: not-allowed;\n }\n\n .paypal-upsell-slot {\n text-align: center;\n }\n\n .paypal-upsell-slot-blocker {\n position: absolute;\n width: 100%;\n height: 4.5rem;\n bottom: 0;\n z-index: 250;\n cursor: not-allowed;\n background-color: rgba(255, 255, 255, 0.5);\n }\n\n .paypal-upsell-slot-blocker.hidden {\n display: none;\n }\n\n #paypal-cover-button {\n position: absolute;\n width: 100%;\n bottom: 0;\n }\n\n .paypal-upsell-slot-container {\n position: relative;\n }\n\n .paypal-upsell-slot-container .paypal-cta {\n font-size: 2.4rem;\n font-weight: bold;\n margin: 0 1rem 1rem 1rem;\n text-align: center;\n }\n\n .error {\n font-size: 1.4rem;\n margin: 0.5rem 0;\n color: red;\n }\n\n .or_separator {\n position: relative;\n margin: 0 2rem;\n font-size: 2.6rem;\n font-weight: bold;\n text-transform: uppercase;\n text-align: center;\n }\n\n .or_separator:before {\n position: absolute;\n top: calc(50% - 1px);\n right: 0;\n left: 0;\n height: 2px;\n content: '';\n background: #333;\n }\n\n .or_separator span {\n display: inline-block;\n position: relative;\n padding: 0 1rem;\n background: #f5f5f7;\n }\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"upsell-modal-content.js","sourceRoot":"","sources":["../../../src/modals/upsell-modal-content.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css, CSSResult, TemplateResult } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { CurrencyValidator } from '@internetarchive/donation-form-currency-validator';\n\nexport enum UpsellModalCTAMode {\n YesButton = 'YesButton',\n PayPalUpsellSlot = 'PayPalUpsellSlot',\n}\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 UpsellModalContent\n * @extends {LitElement}\n */\n@customElement('upsell-modal-content')\nexport class UpsellModalContent extends LitElement {\n @property({ type: String }) yesButtonMode: UpsellModalCTAMode = UpsellModalCTAMode.YesButton;\n\n @property({ type: Number }) amount = 5;\n\n @property({ type: Object }) error?: TemplateResult;\n\n @query('#amount-input') amountInput!: HTMLInputElement;\n\n private currencyValidator: CurrencyValidator = new CurrencyValidator();\n\n /** @inheritdoc */\n render(): TemplateResult {\n return html`\n <h3>Thank you for donating!</h3>\n <button @click=${this.noThanksSelected} class=\"cta-button\" id=\"no-button\">Continue</button>\n <p class=\"or_separator\"><span>or</span></p>\n <h3>Consider donating monthly</h3>\n <p class=\"appeal\">Monthly support helps us reliably plan for the future.</p>\n <div class=\"monthly-amount\">\n <h1>Enter your monthly amount</h1>\n <div class=\"amount-input\">\n <span class=\"dollar-symbol\">$</span>\n <input\n id=\"amount-input\"\n type=\"text\"\n tabindex=\"0\"\n value=${this.amount}\n @input=${this.amountChanged}\n @keydown=${this.currencyValidator.keydown}\n />\n </div>\n <div class=\"error ${this.error ? '' : 'hidden'}\">${this.error}</div>\n </div>\n\n ${this.yesButton}\n `;\n }\n\n private get yesButton(): TemplateResult {\n switch (this.yesButtonMode) {\n case UpsellModalCTAMode.YesButton:\n return html`\n <button\n class=\"cta-button\"\n tabindex=\"0\"\n id=\"yes-button\"\n @click=${this.yesSelected}\n .disabled=${this.error !== undefined}\n >\n YES, I'll donate monthly\n </button>\n `;\n case UpsellModalCTAMode.PayPalUpsellSlot:\n return html`\n <div class=\"paypal-upsell-slot-container\">\n <div class=\"paypal-upsell-slot-blocker ${this.error ? '' : 'hidden'}\"></div>\n <button class=\"cta-button\" id=\"paypal-cover-button\">YES, I'll donate monthly</button>\n <slot class=\"paypal-upsell-slot\"></slot>\n </div>\n `;\n }\n }\n\n private amountChanged(e: Event): void {\n const target = e.target as HTMLInputElement;\n const amount = target.value;\n if (amount.length === 0) {\n return;\n }\n this.handleCustomAmountInput(amount);\n }\n\n private handleCustomAmountInput(value: string): void {\n const amount = parseFloat(value);\n if (isNaN(amount)) {\n this.error = html` Please enter a valid amount. `;\n } else {\n this.processAmount(amount);\n }\n }\n\n private processAmount(amount: number): void {\n if (amount >= 10000) {\n this.error = html`\n To make a donation of $10,000 or more, please contact our philanthropy department at\n <a href=\"mailto:donations@archive.org\">donations@archive.org</a>\n `;\n return;\n }\n\n if (amount < 1) {\n if (this.amountInput && this.amountInput.value.length > 0) {\n this.error = html` The minimum donation amount is $1. `;\n }\n return;\n }\n\n this.error = undefined;\n\n this.amount = amount;\n\n const event = new CustomEvent('amountChanged', { detail: { amount: this.amount } });\n this.dispatchEvent(event);\n }\n\n private yesSelected(): void {\n const event = new CustomEvent('yesSelected', { detail: { amount: this.amount } });\n this.dispatchEvent(event);\n }\n\n private noThanksSelected(): void {\n this.dispatchEvent(new Event('noThanksSelected'));\n }\n\n /** @inheritdoc */\n static get styles(): CSSResult {\n const ctaButtonColor = css`var(--upsellCTAButtonColor, #194880)`;\n const ctaButtonDisabledColor = css`var(--upsellCTAButtonDisabledColor, rgba(109,148,201,0.5))`;\n const amountInputOffset = css`var(--upsellAmountInputOffset, -1rem)`;\n\n return css`\n .monthly-amount {\n background-color: #fff;\n padding: 0.5rem 0.625rem;\n border-radius: 5px;\n text-align: center;\n margin-bottom: 0.5rem;\n margin-top: 0;\n }\n\n .monthly-amount h1 {\n font-size: 1.8rem;\n font-weight: bold;\n text-align: center;\n line-height: 1.2em;\n margin: 0;\n padding: 0.5rem 0 0 0;\n }\n\n .hidden {\n display: none;\n }\n\n h3 {\n text-align: center;\n font-size: 1.8rem;\n margin: 0 1rem 0.5rem 1rem;\n }\n\n .appeal {\n text-align: center;\n font-size: 1.6rem;\n margin: 0.5rem 1rem;\n }\n\n .amount-input {\n transform: translate(${amountInputOffset}, 0); /* translate slightly to center the input */\n }\n\n .amount-input .dollar-symbol {\n font-size: 1.8rem;\n font-weight: bold;\n }\n\n .amount-input input {\n width: 100px;\n text-align: center;\n border: none;\n border-bottom: 1px solid gray;\n font-weight: bold;\n font-size: 3.4rem;\n }\n\n .cta-button {\n font-size: 2rem;\n display: block;\n width: 100%;\n margin-top: 0.5rem;\n padding: 1rem 2rem;\n background-color: ${ctaButtonColor};\n color: #fff;\n border-radius: 5px;\n border: 0;\n font-weight: bold;\n line-height: normal;\n outline: none;\n cursor: pointer;\n }\n\n .cta-button:disabled {\n background-color: ${ctaButtonDisabledColor};\n cursor: not-allowed;\n }\n\n .paypal-upsell-slot {\n text-align: center;\n }\n\n .paypal-upsell-slot-blocker {\n position: absolute;\n width: 100%;\n height: 4.5rem;\n bottom: 0;\n z-index: 250;\n cursor: not-allowed;\n background-color: rgba(255, 255, 255, 0.5);\n }\n\n .paypal-upsell-slot-blocker.hidden {\n display: none;\n }\n\n #paypal-cover-button {\n position: absolute;\n width: 100%;\n bottom: 0;\n }\n\n .paypal-upsell-slot-container {\n position: relative;\n }\n\n .paypal-upsell-slot-container .paypal-cta {\n font-size: 2.4rem;\n font-weight: bold;\n margin: 0 1rem 1rem 1rem;\n text-align: center;\n }\n\n .error {\n font-size: 1.4rem;\n margin: 0.5rem 0;\n color: red;\n }\n\n .or_separator {\n position: relative;\n margin: 0 2rem;\n font-size: 2.6rem;\n font-weight: bold;\n text-transform: uppercase;\n text-align: center;\n }\n\n .or_separator:before {\n position: absolute;\n top: calc(50% - 1px);\n right: 0;\n left: 0;\n height: 2px;\n content: '';\n background: #333;\n }\n\n .or_separator span {\n display: inline-block;\n position: relative;\n padding: 0 1rem;\n background: #f5f5f7;\n }\n `;\n }\n}\n"]}
@@ -1,4 +1,5 @@
1
1
  import { __awaiter } from "tslib";
2
+ /* eslint-disable @typescript-eslint/ban-types */
2
3
  import { html } from 'lit';
3
4
  import { ModalConfig } from '@internetarchive/modal-manager';
4
5
  import { UpsellModalCTAMode } from '../modals/upsell-modal-content';
@@ -29,9 +30,7 @@ export class DonationFlowModalManager {
29
30
  closeOnBackdropClick: false,
30
31
  showCloseButton: false,
31
32
  processingImageMode: 'processing',
32
- title: html `
33
- Processing...
34
- `,
33
+ title: html ` Processing... `,
35
34
  });
36
35
  this.modalManager.showModal({ config: modalConfig });
37
36
  }
@@ -41,9 +40,7 @@ export class DonationFlowModalManager {
41
40
  showProcessingIndicator: true,
42
41
  processingImageMode: 'complete',
43
42
  headerColor: ModalHeaderColor.Green,
44
- title: html `
45
- Thank You!
46
- `,
43
+ title: html ` Thank You! `,
47
44
  });
48
45
  this.modalManager.showModal({
49
46
  config: modalConfig,
@@ -63,15 +60,9 @@ export class DonationFlowModalManager {
63
60
  showErrorModal(options) {
64
61
  const modalConfig = new ModalConfig({
65
62
  headerColor: ModalHeaderColor.Red,
66
- title: html `
67
- Processing error
68
- `,
69
- headline: html `
70
- There's been a problem completing your donation.
71
- `,
72
- message: html `
73
- ${options === null || options === void 0 ? void 0 : options.message}
74
- `,
63
+ title: html ` Processing error `,
64
+ headline: html ` There's been a problem completing your donation. `,
65
+ message: html ` ${options === null || options === void 0 ? void 0 : options.message} `,
75
66
  });
76
67
  this.modalManager.showModal({
77
68
  config: modalConfig,
@@ -107,7 +98,7 @@ export class DonationFlowModalManager {
107
98
  });
108
99
  return this.modalManager.showModal({
109
100
  config: modalConfig,
110
- userClosedModalCallback: cancelDonation
101
+ userClosedModalCallback: cancelDonation,
111
102
  });
112
103
  }
113
104
  /** @inheritdoc */
@@ -115,9 +106,7 @@ export class DonationFlowModalManager {
115
106
  var _a;
116
107
  const modalConfig = new ModalConfig({
117
108
  headerColor: ModalHeaderColor.Green,
118
- title: html `
119
- Donation received
120
- `,
109
+ title: html ` Donation received `,
121
110
  processingImageMode: 'complete',
122
111
  showProcessingIndicator: true,
123
112
  });
@@ -1 +1 @@
1
- {"version":3,"file":"donation-flow-modal-manager.js","sourceRoot":"","sources":["../../../src/payment-flow-handlers/donation-flow-modal-manager.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { ModalConfig, ModalManagerInterface } from '@internetarchive/modal-manager';\nimport { UpsellModalCTAMode } from '../modals/upsell-modal-content';\nimport '../modals/confirm-donation-modal-content';\nimport { BraintreeManagerInterface } from '../braintree-manager/braintree-interfaces';\nimport {\n SuccessResponse,\n ErrorResponse,\n DonationPaymentInfo,\n DonationType,\n PaymentProvider,\n BillingInfo,\n CustomerInfo,\n DonationResponse,\n} from '@internetarchive/donation-form-data-models';\nimport '../modals/error-modal-content';\nimport { DonationControllerEventLoggerInterface } from '../@types/analytics-handler';\n\nenum ModalHeaderColor {\n Blue = '#497fbf',\n Green = '#55A183',\n Red = '#691916',\n}\n\n/**\n * The DonationFlowModalManager is responsible for most of the high-level modal flows.\n *\n * Each of the payment providers has slightly different interactions, ie the PayPal button,\n * ApplePay popup, Venmo launching the app, etc. The modal flow is the same for all of them\n * so this class gets called by the individual payment flow handlers to take the user\n * through the modal flow.\n *\n * @export\n * @interface DonationFlowModalManagerInterface\n */\nexport interface DonationFlowModalManagerInterface {\n showConfirmationStepModal(options: {\n amount: number;\n donationType: DonationType;\n currencyType: string;\n confirmDonationCB: Function;\n cancelDonationCB: Function;\n }): Promise<void>;\n /**\n * Close the modal\n *\n * @memberof DonationFlowModalManagerInterface\n */\n closeModal(): void;\n\n /**\n * Show the processing modal\n *\n * @memberof DonationFlowModalManagerInterface\n */\n showProcessingModal(): void;\n\n /**\n * Show the Thank You modal\n *\n * @memberof DonationFlowModalManagerInterface\n */\n showThankYouModal(options: {\n successResponse: SuccessResponse;\n upsellSuccessResponse?: SuccessResponse;\n }): void;\n\n /**\n * Show the Error modal\n *\n * @param {{\n * userClosedModalCallback?: () => void;\n * }} [options]\n * @memberof DonationFlowModalManagerInterface\n */\n showErrorModal(options: { message: string; userClosedModalCallback?: () => void }): void;\n\n /**\n * Show the upsell modal\n *\n * @param {{\n * ctaMode?: UpsellModalCTAMode;\n * yesSelected?: (amount: number) => void;\n * noSelected?: () => void;\n * amountChanged?: (amount: number) => void;\n * userClosedModalCallback?: () => void;\n * }} [options]\n * @returns {Promise<void>}\n * @memberof DonationFlowModalManagerInterface\n */\n showUpsellModal(options: {\n oneTimeAmount: number;\n ctaMode?: UpsellModalCTAMode;\n yesSelected?: (amount: number) => void;\n noSelected?: () => void;\n amountChanged?: (amount: number) => void;\n userClosedModalCallback?: () => void;\n }): Promise<void>;\n\n /**\n * Start the donation submission flow. This kicks off the \"main\" modal flow once the\n * user authorizes the donation through their payment provider, which provides\n * us the with the nonce used to complete the donation.\n *\n * @param {{\n * nonce: string;\n * paymentProvider: PaymentProvider;\n * donationInfo: DonationPaymentInfo;\n * billingInfo: BillingInfo;\n * customerInfo: CustomerInfo;\n * upsellOnetimeTransactionId?: string;\n * customerId?: string;\n * recaptchaToken?: string;\n * bin?: string; // first 6 digits of CC\n * binName?: string; // credit card bank name\n * }} options\n * @returns {(Promise<DonationResponse | undefined>)}\n * @memberof DonationFlowModalManagerInterface\n */\n startDonationSubmissionFlow(options: {\n nonce: string;\n paymentProvider: PaymentProvider;\n donationInfo: DonationPaymentInfo;\n billingInfo: BillingInfo;\n customerInfo: CustomerInfo;\n upsellOnetimeTransactionId?: string;\n customerId?: string;\n recaptchaToken?: string;\n bin?: string; // first 6 digits of CC\n binName?: string; // credit card bank name\n }): Promise<DonationResponse | undefined>;\n\n /**\n * Handle a successful donation response. This encapsulates the logic for the type of\n * donation that was made.\n * ie. If it was a one-time donation, show the upsell, if it was monthly do not.\n *\n * @param {DonationPaymentInfo} donationInfo\n * @param {SuccessResponse} response\n * @memberof DonationFlowModalManagerInterface\n */\n handleSuccessfulDonationResponse(\n donationInfo: DonationPaymentInfo,\n response: SuccessResponse,\n ): void;\n}\n\nexport class DonationFlowModalManager implements DonationFlowModalManagerInterface {\n private braintreeManager: BraintreeManagerInterface;\n\n private modalManager: ModalManagerInterface;\n\n private analytics: DonationControllerEventLoggerInterface;\n\n constructor(options: {\n braintreeManager: BraintreeManagerInterface;\n modalManager: ModalManagerInterface;\n analytics: DonationControllerEventLoggerInterface;\n }) {\n this.modalManager = options.modalManager;\n this.braintreeManager = options.braintreeManager;\n this.analytics = options.analytics;\n }\n\n /** @inheritdoc */\n closeModal(): void {\n this.modalManager.closeModal();\n }\n\n /** @inheritdoc */\n showProcessingModal(): void {\n const modalConfig = new ModalConfig({\n headerColor: ModalHeaderColor.Blue,\n showProcessingIndicator: true,\n closeOnBackdropClick: false,\n showCloseButton: false,\n processingImageMode: 'processing',\n title: html`\n Processing...\n `,\n });\n this.modalManager.showModal({ config: modalConfig });\n }\n\n /** @inheritdoc */\n showThankYouModal(options: {\n successResponse: SuccessResponse;\n upsellSuccessResponse?: SuccessResponse;\n }): void {\n const modalConfig = new ModalConfig({\n showProcessingIndicator: true,\n processingImageMode: 'complete',\n headerColor: ModalHeaderColor.Green,\n title: html`\n Thank You!\n `,\n });\n this.modalManager.showModal({\n config: modalConfig,\n });\n\n // post analytic\n const selectedPayment = options.successResponse.paymentProvider.replace(/\\s+/g, '');\n let action = `Donated-${selectedPayment}`;\n if (options.upsellSuccessResponse) {\n action += `-upsell`;\n }\n const label = options.successResponse.donationType;\n this.analytics.logDonationFlowEvent(action, label);\n\n // post donation\n this.braintreeManager.donationSuccessful(options);\n }\n\n /** @inheritdoc */\n showErrorModal(options: { message: string; userClosedModalCallback?: () => void }): void {\n const modalConfig = new ModalConfig({\n headerColor: ModalHeaderColor.Red,\n title: html`\n Processing error\n `,\n headline: html`\n There's been a problem completing your donation.\n `,\n message: html`\n ${options?.message}\n `,\n });\n\n this.modalManager.showModal({\n config: modalConfig,\n userClosedModalCallback: options?.userClosedModalCallback,\n customModalContent: html`\n <donation-form-error-modal-content></donation-form-error-modal-content>\n `,\n });\n }\n\n showConfirmationStepModal(options: {\n amount: number;\n donationType: DonationType;\n currencyType: string;\n confirmDonationCB: Function;\n cancelDonationCB: Function;\n }): Promise<void> {\n const confirmDonation = (): void => {\n options?.confirmDonationCB();\n };\n const cancelDonation = (): void => {\n options?.cancelDonationCB();\n };\n const modalTitle = options.donationType === DonationType.Upsell\n ? 'Confirm monthly donation'\n : 'Complete donation';\n\n const modalConfig = new ModalConfig({\n closeOnBackdropClick: false,\n headerColor: ModalHeaderColor.Green,\n title: html`${modalTitle}`,\n message: html`\n <confirm-donation-modal\n .amount=\"${options.amount}\"\n .currencyType=\"${options.currencyType}\"\n .donationType=\"${options.donationType}\"\n .confirmDonation=${confirmDonation}\n .cancelDonation=${cancelDonation}\n ></confirm-donation-modal>\n `,\n });\n return this.modalManager.showModal({\n config: modalConfig,\n userClosedModalCallback: cancelDonation\n });\n }\n\n /** @inheritdoc */\n showUpsellModal(options: {\n oneTimeAmount: number;\n yesSelected?: (amount: number) => void;\n noSelected?: () => void;\n amountChanged?: (amount: number) => void;\n userClosedModalCallback?: () => void;\n ctaMode?: UpsellModalCTAMode;\n }): Promise<void> {\n const modalConfig = new ModalConfig({\n headerColor: ModalHeaderColor.Green,\n title: html`\n Donation received\n `,\n processingImageMode: 'complete',\n showProcessingIndicator: true,\n });\n\n const upsellAmount = DonationFlowModalManager.getDefaultUpsellAmount(options.oneTimeAmount);\n if (options.amountChanged) {\n options.amountChanged(upsellAmount);\n }\n\n const modalContent = html`\n <upsell-modal-content\n .amount=${upsellAmount}\n .yesButtonMode=${options?.ctaMode ?? UpsellModalCTAMode.YesButton}\n @yesSelected=${(e: CustomEvent): void =>\n options?.yesSelected ? options.yesSelected(e.detail.amount) : undefined}\n @noThanksSelected=${options?.noSelected}\n @amountChanged=${(e: CustomEvent): void =>\n options?.amountChanged ? options.amountChanged(e.detail.amount) : undefined}\n >\n <slot name=\"paypal-upsell-button\"></slot>\n </upsell-modal-content>\n `;\n return this.modalManager.showModal({\n config: modalConfig,\n customModalContent: modalContent,\n userClosedModalCallback: options?.userClosedModalCallback,\n });\n }\n\n /** @inheritdoc */\n async startDonationSubmissionFlow(options: {\n nonce: string;\n paymentProvider: PaymentProvider;\n donationInfo: DonationPaymentInfo;\n billingInfo: BillingInfo;\n customerInfo: CustomerInfo;\n upsellOnetimeTransactionId?: string;\n customerId?: string;\n recaptchaToken?: string;\n bin?: string; // first 6 digits of CC\n binName?: string; // credit card bank name\n }): Promise<DonationResponse | undefined> {\n this.showProcessingModal();\n\n try {\n const response = await this.braintreeManager.submitDonation(options);\n\n if (response.success) {\n this.handleSuccessfulDonationResponse(\n options.donationInfo,\n response.value as SuccessResponse,\n );\n return response;\n } else {\n const error = response.value as ErrorResponse;\n this.showErrorModal({\n message: error.message,\n });\n return response;\n }\n } catch (error) {\n this.showErrorModal({\n message: `${error}`,\n });\n console.error('error getting a response', error);\n return undefined;\n }\n }\n\n private async upsellModalYesSelected(\n oneTimeDonationResponse: SuccessResponse,\n amount: number,\n ): Promise<DonationResponse | undefined> {\n this.showProcessingModal();\n\n try {\n const response = await this.braintreeManager.submitUpsellDonation({\n oneTimeDonationResponse: oneTimeDonationResponse,\n amount: amount,\n });\n\n if (response.success) {\n this.completeUpsell({\n successResponse: oneTimeDonationResponse,\n upsellSuccessResponse: response.value as SuccessResponse,\n });\n } else {\n const error = response.value as ErrorResponse;\n this.showErrorModal({\n message: error.message,\n });\n }\n\n return response;\n } catch (error) {\n this.showErrorModal({\n message: `${error}`,\n });\n console.error('error getting a response', error);\n return undefined;\n }\n }\n\n private completeUpsell(options: {\n successResponse: SuccessResponse;\n upsellSuccessResponse?: SuccessResponse;\n }): void {\n this.showThankYouModal(options);\n\n // post analytic\n const selectedPayment = options.successResponse.paymentProvider.replace(/\\s+/g, '');\n const action = `Donated-${selectedPayment}-upsell`;\n const label = options.successResponse.donationType;\n this.analytics.logDonationFlowEvent(action, label);\n\n this.braintreeManager.donationSuccessful(options);\n }\n\n static getDefaultUpsellAmount(oneTimeAmount: number): number {\n let amount = 5;\n\n if (oneTimeAmount <= 10) amount = 5;\n else if (oneTimeAmount > 10 && oneTimeAmount <= 25) amount = 10;\n else if (oneTimeAmount > 25 && oneTimeAmount <= 100) amount = 25;\n else if (oneTimeAmount > 100) amount = 50;\n\n return amount;\n }\n\n /** @inheritdoc */\n handleSuccessfulDonationResponse(\n donationInfo: DonationPaymentInfo,\n response: SuccessResponse,\n ): void {\n switch (donationInfo.donationType) {\n case DonationType.OneTime:\n this.showUpsellModal({\n oneTimeAmount: response.amount,\n yesSelected: (amount: number) => {\n this.upsellModalYesSelected(response, amount);\n },\n noSelected: () => {\n this.showThankYouModal({ successResponse: response });\n },\n userClosedModalCallback: () => {\n this.showThankYouModal({ successResponse: response });\n },\n });\n break;\n case DonationType.Monthly:\n this.showThankYouModal({ successResponse: response });\n break;\n // This case will never be reached, it is only here for completeness.\n // The upsell case gets handled in `modalYesSelected()` below\n case DonationType.Upsell:\n break;\n default:\n break;\n }\n }\n}\n"]}
1
+ {"version":3,"file":"donation-flow-modal-manager.js","sourceRoot":"","sources":["../../../src/payment-flow-handlers/donation-flow-modal-manager.ts"],"names":[],"mappings":";AAAA,iDAAiD;AACjD,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,WAAW,EAAyB,MAAM,gCAAgC,CAAC;AACpF,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,OAAO,0CAA0C,CAAC;AAElD,OAAO,EAIL,YAAY,GAKb,MAAM,4CAA4C,CAAC;AACpD,OAAO,+BAA+B,CAAC;AAGvC,IAAK,gBAIJ;AAJD,WAAK,gBAAgB;IACnB,oCAAgB,CAAA;IAChB,qCAAiB,CAAA;IACjB,mCAAe,CAAA;AACjB,CAAC,EAJI,gBAAgB,KAAhB,gBAAgB,QAIpB;AA6HD,MAAM,OAAO,wBAAwB;IAOnC,YAAY,OAIX;QACC,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC;QACzC,IAAI,CAAC,gBAAgB,GAAG,OAAO,CAAC,gBAAgB,CAAC;QACjD,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS,CAAC;IACrC,CAAC;IAED,kBAAkB;IAClB,UAAU;QACR,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,CAAC;IACjC,CAAC;IAED,kBAAkB;IAClB,mBAAmB;QACjB,MAAM,WAAW,GAAG,IAAI,WAAW,CAAC;YAClC,WAAW,EAAE,gBAAgB,CAAC,IAAI;YAClC,uBAAuB,EAAE,IAAI;YAC7B,oBAAoB,EAAE,KAAK;YAC3B,eAAe,EAAE,KAAK;YACtB,mBAAmB,EAAE,YAAY;YACjC,KAAK,EAAE,IAAI,CAAA,iBAAiB;SAC7B,CAAC,CAAC;QACH,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,EAAE,MAAM,EAAE,WAAW,EAAE,CAAC,CAAC;IACvD,CAAC;IAED,kBAAkB;IAClB,iBAAiB,CAAC,OAGjB;QACC,MAAM,WAAW,GAAG,IAAI,WAAW,CAAC;YAClC,uBAAuB,EAAE,IAAI;YAC7B,mBAAmB,EAAE,UAAU;YAC/B,WAAW,EAAE,gBAAgB,CAAC,KAAK;YACnC,KAAK,EAAE,IAAI,CAAA,cAAc;SAC1B,CAAC,CAAC;QACH,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;YAC1B,MAAM,EAAE,WAAW;SACpB,CAAC,CAAC;QAEH,gBAAgB;QAChB,MAAM,eAAe,GAAG,OAAO,CAAC,eAAe,CAAC,eAAe,CAAC,OAAO,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;QACpF,IAAI,MAAM,GAAG,WAAW,eAAe,EAAE,CAAC;QAC1C,IAAI,OAAO,CAAC,qBAAqB,EAAE;YACjC,MAAM,IAAI,SAAS,CAAC;SACrB;QACD,MAAM,KAAK,GAAG,OAAO,CAAC,eAAe,CAAC,YAAY,CAAC;QACnD,IAAI,CAAC,SAAS,CAAC,oBAAoB,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;QAEnD,gBAAgB;QAChB,IAAI,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAC;IACpD,CAAC;IAED,kBAAkB;IAClB,cAAc,CAAC,OAAkE;QAC/E,MAAM,WAAW,GAAG,IAAI,WAAW,CAAC;YAClC,WAAW,EAAE,gBAAgB,CAAC,GAAG;YACjC,KAAK,EAAE,IAAI,CAAA,oBAAoB;YAC/B,QAAQ,EAAE,IAAI,CAAA,oDAAoD;YAClE,OAAO,EAAE,IAAI,CAAA,IAAI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,GAAG;SACrC,CAAC,CAAC;QAEH,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;YAC1B,MAAM,EAAE,WAAW;YACnB,uBAAuB,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,uBAAuB;YACzD,kBAAkB,EAAE,IAAI,CAAA;;OAEvB;SACF,CAAC,CAAC;IACL,CAAC;IAED,yBAAyB,CAAC,OAMzB;QACC,MAAM,eAAe,GAAG,GAAS,EAAE;YACjC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,iBAAiB,EAAE,CAAC;QAC/B,CAAC,CAAC;QACF,MAAM,cAAc,GAAG,GAAS,EAAE;YAChC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,gBAAgB,EAAE,CAAC;QAC9B,CAAC,CAAC;QACF,MAAM,UAAU,GACd,OAAO,CAAC,YAAY,KAAK,YAAY,CAAC,MAAM;YAC1C,CAAC,CAAC,0BAA0B;YAC5B,CAAC,CAAC,mBAAmB,CAAC;QAE1B,MAAM,WAAW,GAAG,IAAI,WAAW,CAAC;YAClC,oBAAoB,EAAE,KAAK;YAC3B,WAAW,EAAE,gBAAgB,CAAC,KAAK;YACnC,KAAK,EAAE,IAAI,CAAA,GAAG,UAAU,EAAE;YAC1B,OAAO,EAAE,IAAI,CAAA;;qBAEE,OAAO,CAAC,MAAM;2BACR,OAAO,CAAC,YAAY;2BACpB,OAAO,CAAC,YAAY;6BAClB,eAAe;4BAChB,cAAc;;OAEnC;SACF,CAAC,CAAC;QACH,OAAO,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;YACjC,MAAM,EAAE,WAAW;YACnB,uBAAuB,EAAE,cAAc;SACxC,CAAC,CAAC;IACL,CAAC;IAED,kBAAkB;IAClB,eAAe,CAAC,OAOf;;QACC,MAAM,WAAW,GAAG,IAAI,WAAW,CAAC;YAClC,WAAW,EAAE,gBAAgB,CAAC,KAAK;YACnC,KAAK,EAAE,IAAI,CAAA,qBAAqB;YAChC,mBAAmB,EAAE,UAAU;YAC/B,uBAAuB,EAAE,IAAI;SAC9B,CAAC,CAAC;QAEH,MAAM,YAAY,GAAG,wBAAwB,CAAC,sBAAsB,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;QAC5F,IAAI,OAAO,CAAC,aAAa,EAAE;YACzB,OAAO,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;SACrC;QAED,MAAM,YAAY,GAAG,IAAI,CAAA;;kBAEX,YAAY;yBACL,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,mCAAI,kBAAkB,CAAC,SAAS;uBAClD,CAAC,CAAc,EAAQ,EAAE,CACtC,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,EAAC,CAAC,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS;4BACrD,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,UAAU;yBACtB,CAAC,CAAc,EAAQ,EAAE,CACxC,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,aAAa,EAAC,CAAC,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS;;;;KAIhF,CAAC;QACF,OAAO,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;YACjC,MAAM,EAAE,WAAW;YACnB,kBAAkB,EAAE,YAAY;YAChC,uBAAuB,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,uBAAuB;SAC1D,CAAC,CAAC;IACL,CAAC;IAED,kBAAkB;IACZ,2BAA2B,CAAC,OAWjC;;YACC,IAAI,CAAC,mBAAmB,EAAE,CAAC;YAE3B,IAAI;gBACF,MAAM,QAAQ,GAAG,MAAM,IAAI,CAAC,gBAAgB,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;gBAErE,IAAI,QAAQ,CAAC,OAAO,EAAE;oBACpB,IAAI,CAAC,gCAAgC,CACnC,OAAO,CAAC,YAAY,EACpB,QAAQ,CAAC,KAAwB,CAClC,CAAC;oBACF,OAAO,QAAQ,CAAC;iBACjB;qBAAM;oBACL,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAsB,CAAC;oBAC9C,IAAI,CAAC,cAAc,CAAC;wBAClB,OAAO,EAAE,KAAK,CAAC,OAAO;qBACvB,CAAC,CAAC;oBACH,OAAO,QAAQ,CAAC;iBACjB;aACF;YAAC,OAAO,KAAK,EAAE;gBACd,IAAI,CAAC,cAAc,CAAC;oBAClB,OAAO,EAAE,GAAG,KAAK,EAAE;iBACpB,CAAC,CAAC;gBACH,OAAO,CAAC,KAAK,CAAC,0BAA0B,EAAE,KAAK,CAAC,CAAC;gBACjD,OAAO,SAAS,CAAC;aAClB;QACH,CAAC;KAAA;IAEa,sBAAsB,CAClC,uBAAwC,EACxC,MAAc;;YAEd,IAAI,CAAC,mBAAmB,EAAE,CAAC;YAE3B,IAAI;gBACF,MAAM,QAAQ,GAAG,MAAM,IAAI,CAAC,gBAAgB,CAAC,oBAAoB,CAAC;oBAChE,uBAAuB,EAAE,uBAAuB;oBAChD,MAAM,EAAE,MAAM;iBACf,CAAC,CAAC;gBAEH,IAAI,QAAQ,CAAC,OAAO,EAAE;oBACpB,IAAI,CAAC,cAAc,CAAC;wBAClB,eAAe,EAAE,uBAAuB;wBACxC,qBAAqB,EAAE,QAAQ,CAAC,KAAwB;qBACzD,CAAC,CAAC;iBACJ;qBAAM;oBACL,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAsB,CAAC;oBAC9C,IAAI,CAAC,cAAc,CAAC;wBAClB,OAAO,EAAE,KAAK,CAAC,OAAO;qBACvB,CAAC,CAAC;iBACJ;gBAED,OAAO,QAAQ,CAAC;aACjB;YAAC,OAAO,KAAK,EAAE;gBACd,IAAI,CAAC,cAAc,CAAC;oBAClB,OAAO,EAAE,GAAG,KAAK,EAAE;iBACpB,CAAC,CAAC;gBACH,OAAO,CAAC,KAAK,CAAC,0BAA0B,EAAE,KAAK,CAAC,CAAC;gBACjD,OAAO,SAAS,CAAC;aAClB;QACH,CAAC;KAAA;IAEO,cAAc,CAAC,OAGtB;QACC,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC;QAEhC,gBAAgB;QAChB,MAAM,eAAe,GAAG,OAAO,CAAC,eAAe,CAAC,eAAe,CAAC,OAAO,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;QACpF,MAAM,MAAM,GAAG,WAAW,eAAe,SAAS,CAAC;QACnD,MAAM,KAAK,GAAG,OAAO,CAAC,eAAe,CAAC,YAAY,CAAC;QACnD,IAAI,CAAC,SAAS,CAAC,oBAAoB,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;QAEnD,IAAI,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAC;IACpD,CAAC;IAED,MAAM,CAAC,sBAAsB,CAAC,aAAqB;QACjD,IAAI,MAAM,GAAG,CAAC,CAAC;QAEf,IAAI,aAAa,IAAI,EAAE;YAAE,MAAM,GAAG,CAAC,CAAC;aAC/B,IAAI,aAAa,GAAG,EAAE,IAAI,aAAa,IAAI,EAAE;YAAE,MAAM,GAAG,EAAE,CAAC;aAC3D,IAAI,aAAa,GAAG,EAAE,IAAI,aAAa,IAAI,GAAG;YAAE,MAAM,GAAG,EAAE,CAAC;aAC5D,IAAI,aAAa,GAAG,GAAG;YAAE,MAAM,GAAG,EAAE,CAAC;QAE1C,OAAO,MAAM,CAAC;IAChB,CAAC;IAED,kBAAkB;IAClB,gCAAgC,CAC9B,YAAiC,EACjC,QAAyB;QAEzB,QAAQ,YAAY,CAAC,YAAY,EAAE;YACjC,KAAK,YAAY,CAAC,OAAO;gBACvB,IAAI,CAAC,eAAe,CAAC;oBACnB,aAAa,EAAE,QAAQ,CAAC,MAAM;oBAC9B,WAAW,EAAE,CAAC,MAAc,EAAE,EAAE;wBAC9B,IAAI,CAAC,sBAAsB,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;oBAChD,CAAC;oBACD,UAAU,EAAE,GAAG,EAAE;wBACf,IAAI,CAAC,iBAAiB,CAAC,EAAE,eAAe,EAAE,QAAQ,EAAE,CAAC,CAAC;oBACxD,CAAC;oBACD,uBAAuB,EAAE,GAAG,EAAE;wBAC5B,IAAI,CAAC,iBAAiB,CAAC,EAAE,eAAe,EAAE,QAAQ,EAAE,CAAC,CAAC;oBACxD,CAAC;iBACF,CAAC,CAAC;gBACH,MAAM;YACR,KAAK,YAAY,CAAC,OAAO;gBACvB,IAAI,CAAC,iBAAiB,CAAC,EAAE,eAAe,EAAE,QAAQ,EAAE,CAAC,CAAC;gBACtD,MAAM;YACR,qEAAqE;YACrE,6DAA6D;YAC7D,KAAK,YAAY,CAAC,MAAM;gBACtB,MAAM;YACR;gBACE,MAAM;SACT;IACH,CAAC;CACF","sourcesContent":["/* eslint-disable @typescript-eslint/ban-types */\nimport { html } from 'lit';\nimport { ModalConfig, ModalManagerInterface } from '@internetarchive/modal-manager';\nimport { UpsellModalCTAMode } from '../modals/upsell-modal-content';\nimport '../modals/confirm-donation-modal-content';\nimport { BraintreeManagerInterface } from '../braintree-manager/braintree-interfaces';\nimport {\n SuccessResponse,\n ErrorResponse,\n DonationPaymentInfo,\n DonationType,\n PaymentProvider,\n BillingInfo,\n CustomerInfo,\n DonationResponse,\n} from '@internetarchive/donation-form-data-models';\nimport '../modals/error-modal-content';\nimport { DonationControllerEventLoggerInterface } from '../@types/analytics-handler';\n\nenum ModalHeaderColor {\n Blue = '#497fbf',\n Green = '#55A183',\n Red = '#691916',\n}\n\n/**\n * The DonationFlowModalManager is responsible for most of the high-level modal flows.\n *\n * Each of the payment providers has slightly different interactions, ie the PayPal button,\n * ApplePay popup, Venmo launching the app, etc. The modal flow is the same for all of them\n * so this class gets called by the individual payment flow handlers to take the user\n * through the modal flow.\n *\n * @export\n * @interface DonationFlowModalManagerInterface\n */\nexport interface DonationFlowModalManagerInterface {\n showConfirmationStepModal(options: {\n amount: number;\n donationType: DonationType;\n currencyType: string;\n confirmDonationCB: Function;\n cancelDonationCB: Function;\n }): Promise<void>;\n /**\n * Close the modal\n *\n * @memberof DonationFlowModalManagerInterface\n */\n closeModal(): void;\n\n /**\n * Show the processing modal\n *\n * @memberof DonationFlowModalManagerInterface\n */\n showProcessingModal(): void;\n\n /**\n * Show the Thank You modal\n *\n * @memberof DonationFlowModalManagerInterface\n */\n showThankYouModal(options: {\n successResponse: SuccessResponse;\n upsellSuccessResponse?: SuccessResponse;\n }): void;\n\n /**\n * Show the Error modal\n *\n * @param {{\n * userClosedModalCallback?: () => void;\n * }} [options]\n * @memberof DonationFlowModalManagerInterface\n */\n showErrorModal(options: { message: string; userClosedModalCallback?: () => void }): void;\n\n /**\n * Show the upsell modal\n *\n * @param {{\n * ctaMode?: UpsellModalCTAMode;\n * yesSelected?: (amount: number) => void;\n * noSelected?: () => void;\n * amountChanged?: (amount: number) => void;\n * userClosedModalCallback?: () => void;\n * }} [options]\n * @returns {Promise<void>}\n * @memberof DonationFlowModalManagerInterface\n */\n showUpsellModal(options: {\n oneTimeAmount: number;\n ctaMode?: UpsellModalCTAMode;\n yesSelected?: (amount: number) => void;\n noSelected?: () => void;\n amountChanged?: (amount: number) => void;\n userClosedModalCallback?: () => void;\n }): Promise<void>;\n\n /**\n * Start the donation submission flow. This kicks off the \"main\" modal flow once the\n * user authorizes the donation through their payment provider, which provides\n * us the with the nonce used to complete the donation.\n *\n * @param {{\n * nonce: string;\n * paymentProvider: PaymentProvider;\n * donationInfo: DonationPaymentInfo;\n * billingInfo: BillingInfo;\n * customerInfo: CustomerInfo;\n * upsellOnetimeTransactionId?: string;\n * customerId?: string;\n * recaptchaToken?: string;\n * bin?: string; // first 6 digits of CC\n * binName?: string; // credit card bank name\n * }} options\n * @returns {(Promise<DonationResponse | undefined>)}\n * @memberof DonationFlowModalManagerInterface\n */\n startDonationSubmissionFlow(options: {\n nonce: string;\n paymentProvider: PaymentProvider;\n donationInfo: DonationPaymentInfo;\n billingInfo: BillingInfo;\n customerInfo: CustomerInfo;\n upsellOnetimeTransactionId?: string;\n customerId?: string;\n recaptchaToken?: string;\n bin?: string; // first 6 digits of CC\n binName?: string; // credit card bank name\n }): Promise<DonationResponse | undefined>;\n\n /**\n * Handle a successful donation response. This encapsulates the logic for the type of\n * donation that was made.\n * ie. If it was a one-time donation, show the upsell, if it was monthly do not.\n *\n * @param {DonationPaymentInfo} donationInfo\n * @param {SuccessResponse} response\n * @memberof DonationFlowModalManagerInterface\n */\n handleSuccessfulDonationResponse(\n donationInfo: DonationPaymentInfo,\n response: SuccessResponse,\n ): void;\n}\n\nexport class DonationFlowModalManager implements DonationFlowModalManagerInterface {\n private braintreeManager: BraintreeManagerInterface;\n\n private modalManager: ModalManagerInterface;\n\n private analytics: DonationControllerEventLoggerInterface;\n\n constructor(options: {\n braintreeManager: BraintreeManagerInterface;\n modalManager: ModalManagerInterface;\n analytics: DonationControllerEventLoggerInterface;\n }) {\n this.modalManager = options.modalManager;\n this.braintreeManager = options.braintreeManager;\n this.analytics = options.analytics;\n }\n\n /** @inheritdoc */\n closeModal(): void {\n this.modalManager.closeModal();\n }\n\n /** @inheritdoc */\n showProcessingModal(): void {\n const modalConfig = new ModalConfig({\n headerColor: ModalHeaderColor.Blue,\n showProcessingIndicator: true,\n closeOnBackdropClick: false,\n showCloseButton: false,\n processingImageMode: 'processing',\n title: html` Processing... `,\n });\n this.modalManager.showModal({ config: modalConfig });\n }\n\n /** @inheritdoc */\n showThankYouModal(options: {\n successResponse: SuccessResponse;\n upsellSuccessResponse?: SuccessResponse;\n }): void {\n const modalConfig = new ModalConfig({\n showProcessingIndicator: true,\n processingImageMode: 'complete',\n headerColor: ModalHeaderColor.Green,\n title: html` Thank You! `,\n });\n this.modalManager.showModal({\n config: modalConfig,\n });\n\n // post analytic\n const selectedPayment = options.successResponse.paymentProvider.replace(/\\s+/g, '');\n let action = `Donated-${selectedPayment}`;\n if (options.upsellSuccessResponse) {\n action += `-upsell`;\n }\n const label = options.successResponse.donationType;\n this.analytics.logDonationFlowEvent(action, label);\n\n // post donation\n this.braintreeManager.donationSuccessful(options);\n }\n\n /** @inheritdoc */\n showErrorModal(options: { message: string; userClosedModalCallback?: () => void }): void {\n const modalConfig = new ModalConfig({\n headerColor: ModalHeaderColor.Red,\n title: html` Processing error `,\n headline: html` There's been a problem completing your donation. `,\n message: html` ${options?.message} `,\n });\n\n this.modalManager.showModal({\n config: modalConfig,\n userClosedModalCallback: options?.userClosedModalCallback,\n customModalContent: html`\n <donation-form-error-modal-content></donation-form-error-modal-content>\n `,\n });\n }\n\n showConfirmationStepModal(options: {\n amount: number;\n donationType: DonationType;\n currencyType: string;\n confirmDonationCB: Function;\n cancelDonationCB: Function;\n }): Promise<void> {\n const confirmDonation = (): void => {\n options?.confirmDonationCB();\n };\n const cancelDonation = (): void => {\n options?.cancelDonationCB();\n };\n const modalTitle =\n options.donationType === DonationType.Upsell\n ? 'Confirm monthly donation'\n : 'Complete donation';\n\n const modalConfig = new ModalConfig({\n closeOnBackdropClick: false,\n headerColor: ModalHeaderColor.Green,\n title: html`${modalTitle}`,\n message: html`\n <confirm-donation-modal\n .amount=\"${options.amount}\"\n .currencyType=\"${options.currencyType}\"\n .donationType=\"${options.donationType}\"\n .confirmDonation=${confirmDonation}\n .cancelDonation=${cancelDonation}\n ></confirm-donation-modal>\n `,\n });\n return this.modalManager.showModal({\n config: modalConfig,\n userClosedModalCallback: cancelDonation,\n });\n }\n\n /** @inheritdoc */\n showUpsellModal(options: {\n oneTimeAmount: number;\n yesSelected?: (amount: number) => void;\n noSelected?: () => void;\n amountChanged?: (amount: number) => void;\n userClosedModalCallback?: () => void;\n ctaMode?: UpsellModalCTAMode;\n }): Promise<void> {\n const modalConfig = new ModalConfig({\n headerColor: ModalHeaderColor.Green,\n title: html` Donation received `,\n processingImageMode: 'complete',\n showProcessingIndicator: true,\n });\n\n const upsellAmount = DonationFlowModalManager.getDefaultUpsellAmount(options.oneTimeAmount);\n if (options.amountChanged) {\n options.amountChanged(upsellAmount);\n }\n\n const modalContent = html`\n <upsell-modal-content\n .amount=${upsellAmount}\n .yesButtonMode=${options?.ctaMode ?? UpsellModalCTAMode.YesButton}\n @yesSelected=${(e: CustomEvent): void =>\n options?.yesSelected ? options.yesSelected(e.detail.amount) : undefined}\n @noThanksSelected=${options?.noSelected}\n @amountChanged=${(e: CustomEvent): void =>\n options?.amountChanged ? options.amountChanged(e.detail.amount) : undefined}\n >\n <slot name=\"paypal-upsell-button\"></slot>\n </upsell-modal-content>\n `;\n return this.modalManager.showModal({\n config: modalConfig,\n customModalContent: modalContent,\n userClosedModalCallback: options?.userClosedModalCallback,\n });\n }\n\n /** @inheritdoc */\n async startDonationSubmissionFlow(options: {\n nonce: string;\n paymentProvider: PaymentProvider;\n donationInfo: DonationPaymentInfo;\n billingInfo: BillingInfo;\n customerInfo: CustomerInfo;\n upsellOnetimeTransactionId?: string;\n customerId?: string;\n recaptchaToken?: string;\n bin?: string; // first 6 digits of CC\n binName?: string; // credit card bank name\n }): Promise<DonationResponse | undefined> {\n this.showProcessingModal();\n\n try {\n const response = await this.braintreeManager.submitDonation(options);\n\n if (response.success) {\n this.handleSuccessfulDonationResponse(\n options.donationInfo,\n response.value as SuccessResponse,\n );\n return response;\n } else {\n const error = response.value as ErrorResponse;\n this.showErrorModal({\n message: error.message,\n });\n return response;\n }\n } catch (error) {\n this.showErrorModal({\n message: `${error}`,\n });\n console.error('error getting a response', error);\n return undefined;\n }\n }\n\n private async upsellModalYesSelected(\n oneTimeDonationResponse: SuccessResponse,\n amount: number,\n ): Promise<DonationResponse | undefined> {\n this.showProcessingModal();\n\n try {\n const response = await this.braintreeManager.submitUpsellDonation({\n oneTimeDonationResponse: oneTimeDonationResponse,\n amount: amount,\n });\n\n if (response.success) {\n this.completeUpsell({\n successResponse: oneTimeDonationResponse,\n upsellSuccessResponse: response.value as SuccessResponse,\n });\n } else {\n const error = response.value as ErrorResponse;\n this.showErrorModal({\n message: error.message,\n });\n }\n\n return response;\n } catch (error) {\n this.showErrorModal({\n message: `${error}`,\n });\n console.error('error getting a response', error);\n return undefined;\n }\n }\n\n private completeUpsell(options: {\n successResponse: SuccessResponse;\n upsellSuccessResponse?: SuccessResponse;\n }): void {\n this.showThankYouModal(options);\n\n // post analytic\n const selectedPayment = options.successResponse.paymentProvider.replace(/\\s+/g, '');\n const action = `Donated-${selectedPayment}-upsell`;\n const label = options.successResponse.donationType;\n this.analytics.logDonationFlowEvent(action, label);\n\n this.braintreeManager.donationSuccessful(options);\n }\n\n static getDefaultUpsellAmount(oneTimeAmount: number): number {\n let amount = 5;\n\n if (oneTimeAmount <= 10) amount = 5;\n else if (oneTimeAmount > 10 && oneTimeAmount <= 25) amount = 10;\n else if (oneTimeAmount > 25 && oneTimeAmount <= 100) amount = 25;\n else if (oneTimeAmount > 100) amount = 50;\n\n return amount;\n }\n\n /** @inheritdoc */\n handleSuccessfulDonationResponse(\n donationInfo: DonationPaymentInfo,\n response: SuccessResponse,\n ): void {\n switch (donationInfo.donationType) {\n case DonationType.OneTime:\n this.showUpsellModal({\n oneTimeAmount: response.amount,\n yesSelected: (amount: number) => {\n this.upsellModalYesSelected(response, amount);\n },\n noSelected: () => {\n this.showThankYouModal({ successResponse: response });\n },\n userClosedModalCallback: () => {\n this.showThankYouModal({ successResponse: response });\n },\n });\n break;\n case DonationType.Monthly:\n this.showThankYouModal({ successResponse: response });\n break;\n // This case will never be reached, it is only here for completeness.\n // The upsell case gets handled in `modalYesSelected()` below\n case DonationType.Upsell:\n break;\n default:\n break;\n }\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"applepay-flow-handler.js","sourceRoot":"","sources":["../../../../src/payment-flow-handlers/handlers/applepay-flow-handler.ts"],"names":[],"mappings":"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","sourcesContent":["import { BraintreeManagerInterface } from '../../braintree-manager/braintree-interfaces';\nimport {\n DonationResponse,\n DonationPaymentInfo,\n SuccessResponse,\n DonationType,\n ErrorResponse,\n} from '@internetarchive/donation-form-data-models';\nimport { DonationFlowModalManagerInterface } from '../donation-flow-modal-manager';\nimport { ApplePaySessionDataSourceDelegate } from '../../braintree-manager/payment-providers/apple-pay/apple-pay-session-datasource-delegate';\nimport { ApplePaySessionDataSourceInterface } from '../../braintree-manager/payment-providers/apple-pay/apple-pay-session-datasource-interface';\n\nexport interface ApplePayFlowHandlerInterface {\n paymentInitiated(donationInfo: DonationPaymentInfo, e: Event): Promise<void>;\n}\n\nexport class ApplePayFlowHandler\n implements ApplePayFlowHandlerInterface, ApplePaySessionDataSourceDelegate {\n private donationFlowModalManager: DonationFlowModalManagerInterface;\n\n private braintreeManager: BraintreeManagerInterface;\n\n constructor(options: {\n braintreeManager: BraintreeManagerInterface;\n donationFlowModalManager: DonationFlowModalManagerInterface;\n }) {\n this.braintreeManager = options.braintreeManager;\n this.donationFlowModalManager = options.donationFlowModalManager;\n }\n\n private applePayDataSource?: ApplePaySessionDataSourceInterface;\n\n async paymentInitiated(donationInfo: DonationPaymentInfo, e: Event): Promise<void> {\n this.donationFlowModalManager.showProcessingModal();\n const handler = await this.braintreeManager?.paymentProviders.applePayHandler.get();\n this.applePayDataSource = await handler?.createPaymentRequest(e, donationInfo);\n\n if (this.applePayDataSource) {\n this.applePayDataSource.delegate = this;\n }\n }\n\n private async modalYesSelected(\n oneTimeDonationResponse: SuccessResponse,\n amount: number,\n ): Promise<void> {\n this.donationFlowModalManager.showProcessingModal();\n\n const response = await this.braintreeManager.submitUpsellDonation({\n oneTimeDonationResponse: oneTimeDonationResponse,\n amount: amount,\n });\n\n if (response.success) {\n this.donationFlowModalManager.showThankYouModal({\n successResponse: oneTimeDonationResponse,\n upsellSuccessResponse: response.value as SuccessResponse,\n });\n } else {\n const error = response.value as ErrorResponse;\n this.donationFlowModalManager.showErrorModal({\n message: error.message,\n });\n }\n }\n\n // MARK - ApplePaySessionDataSourceDelegate\n paymentComplete(response: DonationResponse): void {\n if (response.success) {\n const successResponse = response.value as SuccessResponse;\n if (this.applePayDataSource?.donationInfo.donationType == DonationType.OneTime) {\n this.donationFlowModalManager.showUpsellModal({\n oneTimeAmount: successResponse.amount,\n yesSelected: this.modalYesSelected.bind(this, successResponse),\n noSelected: this.donationFlowModalManager.showThankYouModal.bind(\n this.donationFlowModalManager,\n {\n successResponse,\n },\n ),\n userClosedModalCallback: this.donationFlowModalManager.showThankYouModal.bind(\n this.donationFlowModalManager,\n {\n successResponse,\n },\n ),\n });\n } else {\n this.donationFlowModalManager.showThankYouModal({ successResponse });\n }\n } else {\n const errorResponse = response.value as ErrorResponse;\n this.donationFlowModalManager.showErrorModal({\n message: errorResponse.message,\n });\n }\n }\n\n paymentFailed(): void {\n this.donationFlowModalManager.showErrorModal({\n message: 'Payment failed',\n });\n }\n\n paymentCancelled(): void {\n this.donationFlowModalManager.closeModal();\n }\n}\n"]}
1
+ {"version":3,"file":"applepay-flow-handler.js","sourceRoot":"","sources":["../../../../src/payment-flow-handlers/handlers/applepay-flow-handler.ts"],"names":[],"mappings":"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","sourcesContent":["import { BraintreeManagerInterface } from '../../braintree-manager/braintree-interfaces';\nimport {\n DonationResponse,\n DonationPaymentInfo,\n SuccessResponse,\n DonationType,\n ErrorResponse,\n} from '@internetarchive/donation-form-data-models';\nimport { DonationFlowModalManagerInterface } from '../donation-flow-modal-manager';\nimport { ApplePaySessionDataSourceDelegate } from '../../braintree-manager/payment-providers/apple-pay/apple-pay-session-datasource-delegate';\nimport { ApplePaySessionDataSourceInterface } from '../../braintree-manager/payment-providers/apple-pay/apple-pay-session-datasource-interface';\n\nexport interface ApplePayFlowHandlerInterface {\n paymentInitiated(donationInfo: DonationPaymentInfo, e: Event): Promise<void>;\n}\n\nexport class ApplePayFlowHandler\n implements ApplePayFlowHandlerInterface, ApplePaySessionDataSourceDelegate\n{\n private donationFlowModalManager: DonationFlowModalManagerInterface;\n\n private braintreeManager: BraintreeManagerInterface;\n\n constructor(options: {\n braintreeManager: BraintreeManagerInterface;\n donationFlowModalManager: DonationFlowModalManagerInterface;\n }) {\n this.braintreeManager = options.braintreeManager;\n this.donationFlowModalManager = options.donationFlowModalManager;\n }\n\n private applePayDataSource?: ApplePaySessionDataSourceInterface;\n\n async paymentInitiated(donationInfo: DonationPaymentInfo, e: Event): Promise<void> {\n this.donationFlowModalManager.showProcessingModal();\n const handler = await this.braintreeManager?.paymentProviders.applePayHandler.get();\n this.applePayDataSource = await handler?.createPaymentRequest(e, donationInfo);\n\n if (this.applePayDataSource) {\n this.applePayDataSource.delegate = this;\n }\n }\n\n private async modalYesSelected(\n oneTimeDonationResponse: SuccessResponse,\n amount: number,\n ): Promise<void> {\n this.donationFlowModalManager.showProcessingModal();\n\n const response = await this.braintreeManager.submitUpsellDonation({\n oneTimeDonationResponse: oneTimeDonationResponse,\n amount: amount,\n });\n\n if (response.success) {\n this.donationFlowModalManager.showThankYouModal({\n successResponse: oneTimeDonationResponse,\n upsellSuccessResponse: response.value as SuccessResponse,\n });\n } else {\n const error = response.value as ErrorResponse;\n this.donationFlowModalManager.showErrorModal({\n message: error.message,\n });\n }\n }\n\n // MARK - ApplePaySessionDataSourceDelegate\n paymentComplete(response: DonationResponse): void {\n if (response.success) {\n const successResponse = response.value as SuccessResponse;\n if (this.applePayDataSource?.donationInfo.donationType == DonationType.OneTime) {\n this.donationFlowModalManager.showUpsellModal({\n oneTimeAmount: successResponse.amount,\n yesSelected: this.modalYesSelected.bind(this, successResponse),\n noSelected: this.donationFlowModalManager.showThankYouModal.bind(\n this.donationFlowModalManager,\n {\n successResponse,\n },\n ),\n userClosedModalCallback: this.donationFlowModalManager.showThankYouModal.bind(\n this.donationFlowModalManager,\n {\n successResponse,\n },\n ),\n });\n } else {\n this.donationFlowModalManager.showThankYouModal({ successResponse });\n }\n } else {\n const errorResponse = response.value as ErrorResponse;\n this.donationFlowModalManager.showErrorModal({\n message: errorResponse.message,\n });\n }\n }\n\n paymentFailed(): void {\n this.donationFlowModalManager.showErrorModal({\n message: 'Payment failed',\n });\n }\n\n paymentCancelled(): void {\n this.donationFlowModalManager.closeModal();\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"creditcard-flow-handler.js","sourceRoot":"","sources":["../../../../src/payment-flow-handlers/handlers/creditcard-flow-handler.ts"],"names":[],"mappings":"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","sourcesContent":["import { createNanoEvents, Emitter, Unsubscribe } from 'nanoevents';\n\nimport { BraintreeManagerInterface } from '../../braintree-manager/braintree-interfaces';\nimport { RecaptchaManagerInterface } from '../../recaptcha-manager/recaptcha-manager';\n\nimport {\n DonorContactInfo,\n DonationPaymentInfo,\n PaymentProvider,\n} from '@internetarchive/donation-form-data-models';\nimport { DonationFlowModalManagerInterface } from '../donation-flow-modal-manager';\nimport { HostedFieldName } from '../../braintree-manager/payment-providers/credit-card/hosted-field-container';\nimport { BadgedInput } from '../../form-elements/badged-input';\n\nexport interface CreditCardFlowHandlerInterface {\n /**\n * Set up the hosted fields with event bindings\n *\n * @returns {Promise<void>}\n * @memberof CreditCardFlowHandlerInterface\n */\n startup(): Promise<void>;\n\n /**\n * Tokenize the hosted fields.\n *\n * This also performs validation so we can call this before initiating the payment to\n * display any error messaging.\n *\n * @returns {(Promise<braintree.HostedFieldsTokenizePayload | undefined>)}\n * @memberof CreditCardFlowHandlerInterface\n */\n tokenizeFields(): Promise<braintree.HostedFieldsTokenizePayload | undefined>;\n\n /**\n * Initiate the payment flow.\n *\n * You must get the response from `tokenizeFields()` first before this to validate the hosted fields.\n *\n * @param {braintree.HostedFieldsTokenizePayload} hostedFieldsResponse\n * @param {DonationPaymentInfo} donationInfo\n * @param {DonorContactInfo} donorContactInfo\n * @returns {Promise<void>}\n * @memberof CreditCardFlowHandlerInterface\n */\n paymentInitiated(\n hostedFieldsResponse: braintree.HostedFieldsTokenizePayload,\n donationInfo: DonationPaymentInfo,\n donorContactInfo: DonorContactInfo,\n ): Promise<void>;\n\n /**\n * Bind to receive credit card flow handler events\n *\n * @template E\n * @param {E} event\n * @param {CreditCardFlowHandlerEvents[E]} callback\n * @returns {Unsubscribe}\n * @memberof CreditCardFlowHandlerInterface\n */\n on<E extends keyof CreditCardFlowHandlerEvents>(\n event: E,\n callback: CreditCardFlowHandlerEvents[E],\n ): Unsubscribe;\n}\n\nexport interface CreditCardFlowHandlerEvents {\n validityChanged: (isValid: boolean) => void;\n}\n\nexport class CreditCardFlowHandler implements CreditCardFlowHandlerInterface {\n private donationFlowModalManager: DonationFlowModalManagerInterface;\n\n private braintreeManager: BraintreeManagerInterface;\n\n private recaptchaManager: RecaptchaManagerInterface;\n\n private emitter: Emitter<CreditCardFlowHandlerEvents>;\n\n constructor(options: {\n braintreeManager: BraintreeManagerInterface;\n donationFlowModalManager: DonationFlowModalManagerInterface;\n recaptchaManager: RecaptchaManagerInterface;\n }) {\n this.braintreeManager = options.braintreeManager;\n this.donationFlowModalManager = options.donationFlowModalManager;\n this.recaptchaManager = options.recaptchaManager;\n this.emitter = createNanoEvents<CreditCardFlowHandlerEvents>();\n }\n\n /** @inheritdoc */\n on<E extends keyof CreditCardFlowHandlerEvents>(\n event: E,\n callback: CreditCardFlowHandlerEvents[E],\n ): Unsubscribe {\n return this.emitter.on(event, callback);\n }\n\n private started = false;\n\n /** @inheritdoc */\n async startup(): Promise<void> {\n if (this.started) {\n return;\n }\n this.started = true;\n\n const handler = await this.braintreeManager?.paymentProviders.creditCardHandler.get();\n const instance = await handler?.instance.get();\n\n // NOTE: The `focus` and `blur` callback logic must work in conjunction with\n // the `HostedFieldContainer` class. We use the `HostedFieldContainer` for\n // managing the hosted field error state in other parts of the form, but\n // since we can only get event callbacks from the hosted fields like this,\n // this has to operate independently and modify the CSS styles by itself\n instance?.on('focus', (event: braintree.HostedFieldsStateObject): void => {\n const { emittedBy, fields } = event;\n const fieldInFocus = fields[emittedBy];\n const { container } = fieldInFocus;\n (container.parentElement as BadgedInput).error = false;\n handler.hideErrorMessage();\n });\n\n instance?.on('blur', (event: braintree.HostedFieldsStateObject): void => {\n const { emittedBy, fields } = event;\n const fieldInFocus = fields[emittedBy];\n const { container, isEmpty, isValid } = fieldInFocus;\n if (isEmpty || !isValid) {\n (container.parentElement as BadgedInput).error = true;\n }\n });\n\n instance?.on('validityChange', (event: braintree.HostedFieldsStateObject): void => {\n const { fields } = event;\n const isValid = fields.cvv.isValid && fields.expirationDate.isValid && fields.number.isValid;\n this.emitter.emit('validityChanged', isValid);\n });\n }\n\n /** @inheritdoc */\n async tokenizeFields(): Promise<braintree.HostedFieldsTokenizePayload | undefined> {\n let hostedFieldsResponse: braintree.HostedFieldsTokenizePayload | undefined;\n\n const handler = await this.braintreeManager.paymentProviders.creditCardHandler.get();\n\n try {\n hostedFieldsResponse = await handler?.tokenizeHostedFields();\n } catch (error) {\n this.handleHostedFieldTokenizationError(error);\n return;\n }\n\n return hostedFieldsResponse;\n }\n\n /** @inheritdoc */\n async paymentInitiated(\n hostedFieldsResponse: braintree.HostedFieldsTokenizePayload,\n donationInfo: DonationPaymentInfo,\n donorContactInfo: DonorContactInfo,\n ): Promise<void> {\n let recaptchaToken: string | undefined;\n\n try {\n recaptchaToken = await this.recaptchaManager.execute();\n } catch (error) {\n this.donationFlowModalManager.showErrorModal({\n message: `Recaptcha failure`,\n });\n return;\n }\n\n this.donationFlowModalManager.startDonationSubmissionFlow({\n nonce: hostedFieldsResponse.nonce,\n paymentProvider: PaymentProvider.CreditCard,\n recaptchaToken: recaptchaToken,\n bin: hostedFieldsResponse.details.bin,\n donationInfo: donationInfo,\n customerInfo: donorContactInfo.customer,\n billingInfo: donorContactInfo.billing,\n });\n }\n\n private async handleHostedFieldTokenizationError(error: braintree.BraintreeError): Promise<void> {\n const handler = await this.braintreeManager.paymentProviders.creditCardHandler.get();\n\n handler.showErrorMessage();\n\n switch (error.code) {\n case 'HOSTED_FIELDS_FIELDS_EMPTY':\n // occurs when none of the fields are filled in\n handler.markFieldErrors([\n HostedFieldName.Number,\n HostedFieldName.CVV,\n HostedFieldName.ExpirationDate,\n ]);\n break;\n case 'HOSTED_FIELDS_FIELDS_INVALID':\n // occurs when certain fields do not pass client side validation\n Object.keys(error.details.invalidFields).forEach(key => {\n handler.markFieldErrors([key as HostedFieldName]);\n });\n break;\n case 'HOSTED_FIELDS_TOKENIZATION_FAIL_ON_DUPLICATE':\n // occurs when:\n // * the client token used for client authorization was generated\n // with a customer ID and the fail on duplicate payment method\n // option is set to true\n // * the card being tokenized has previously been vaulted (with any customer)\n break;\n case 'HOSTED_FIELDS_TOKENIZATION_CVV_VERIFICATION_FAILED':\n // occurs when:\n // * the client token used for client authorization was generated\n // with a customer ID and the verify card option is set to true\n // and you have credit card verification turned on in the Braintree\n // control panel\n // * the cvv does not pass verfication\n handler.markFieldErrors([HostedFieldName.CVV]);\n break;\n case 'HOSTED_FIELDS_FAILED_TOKENIZATION':\n // occurs for any other tokenization error on the server\n break;\n case 'HOSTED_FIELDS_TOKENIZATION_NETWORK_ERROR':\n // occurs when the Braintree gateway cannot be contacted\n break;\n default:\n // something else happened\n break;\n }\n }\n}\n"]}
1
+ {"version":3,"file":"creditcard-flow-handler.js","sourceRoot":"","sources":["../../../../src/payment-flow-handlers/handlers/creditcard-flow-handler.ts"],"names":[],"mappings":"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","sourcesContent":["import { createNanoEvents, Emitter, Unsubscribe } from 'nanoevents';\n\nimport { BraintreeManagerInterface } from '../../braintree-manager/braintree-interfaces';\nimport { RecaptchaManagerInterface } from '../../recaptcha-manager/recaptcha-manager';\n\nimport {\n DonorContactInfo,\n DonationPaymentInfo,\n PaymentProvider,\n} from '@internetarchive/donation-form-data-models';\nimport { DonationFlowModalManagerInterface } from '../donation-flow-modal-manager';\nimport { HostedFieldName } from '../../braintree-manager/payment-providers/credit-card/hosted-field-container';\nimport { BadgedInput } from '../../form-elements/badged-input';\nimport { BraintreeError } from '../../@types/braintree-web';\n\nexport interface CreditCardFlowHandlerInterface {\n /**\n * Set up the hosted fields with event bindings\n *\n * @returns {Promise<void>}\n * @memberof CreditCardFlowHandlerInterface\n */\n startup(): Promise<void>;\n\n /**\n * Tokenize the hosted fields.\n *\n * This also performs validation so we can call this before initiating the payment to\n * display any error messaging.\n *\n * @returns {(Promise<braintree.HostedFieldsTokenizePayload | undefined>)}\n * @memberof CreditCardFlowHandlerInterface\n */\n tokenizeFields(): Promise<braintree.HostedFieldsTokenizePayload | undefined>;\n\n /**\n * Initiate the payment flow.\n *\n * You must get the response from `tokenizeFields()` first before this to validate the hosted fields.\n *\n * @param {braintree.HostedFieldsTokenizePayload} hostedFieldsResponse\n * @param {DonationPaymentInfo} donationInfo\n * @param {DonorContactInfo} donorContactInfo\n * @returns {Promise<void>}\n * @memberof CreditCardFlowHandlerInterface\n */\n paymentInitiated(\n hostedFieldsResponse: braintree.HostedFieldsTokenizePayload,\n donationInfo: DonationPaymentInfo,\n donorContactInfo: DonorContactInfo,\n ): Promise<void>;\n\n /**\n * Bind to receive credit card flow handler events\n *\n * @template E\n * @param {E} event\n * @param {CreditCardFlowHandlerEvents[E]} callback\n * @returns {Unsubscribe}\n * @memberof CreditCardFlowHandlerInterface\n */\n on<E extends keyof CreditCardFlowHandlerEvents>(\n event: E,\n callback: CreditCardFlowHandlerEvents[E],\n ): Unsubscribe;\n}\n\nexport interface CreditCardFlowHandlerEvents {\n validityChanged: (isValid: boolean) => void;\n}\n\nexport class CreditCardFlowHandler implements CreditCardFlowHandlerInterface {\n private donationFlowModalManager: DonationFlowModalManagerInterface;\n\n private braintreeManager: BraintreeManagerInterface;\n\n private recaptchaManager: RecaptchaManagerInterface;\n\n private emitter: Emitter<CreditCardFlowHandlerEvents>;\n\n constructor(options: {\n braintreeManager: BraintreeManagerInterface;\n donationFlowModalManager: DonationFlowModalManagerInterface;\n recaptchaManager: RecaptchaManagerInterface;\n }) {\n this.braintreeManager = options.braintreeManager;\n this.donationFlowModalManager = options.donationFlowModalManager;\n this.recaptchaManager = options.recaptchaManager;\n this.emitter = createNanoEvents<CreditCardFlowHandlerEvents>();\n }\n\n /** @inheritdoc */\n on<E extends keyof CreditCardFlowHandlerEvents>(\n event: E,\n callback: CreditCardFlowHandlerEvents[E],\n ): Unsubscribe {\n return this.emitter.on(event, callback);\n }\n\n private started = false;\n\n /** @inheritdoc */\n async startup(): Promise<void> {\n if (this.started) {\n return;\n }\n this.started = true;\n\n const handler = await this.braintreeManager?.paymentProviders.creditCardHandler.get();\n const instance = await handler?.instance.get();\n\n // NOTE: The `focus` and `blur` callback logic must work in conjunction with\n // the `HostedFieldContainer` class. We use the `HostedFieldContainer` for\n // managing the hosted field error state in other parts of the form, but\n // since we can only get event callbacks from the hosted fields like this,\n // this has to operate independently and modify the CSS styles by itself\n instance?.on('focus', (event: braintree.HostedFieldsStateObject): void => {\n const { emittedBy, fields } = event;\n const fieldInFocus = fields[emittedBy];\n const { container } = fieldInFocus;\n (container.parentElement as BadgedInput).error = false;\n handler.hideErrorMessage();\n });\n\n instance?.on('blur', (event: braintree.HostedFieldsStateObject): void => {\n const { emittedBy, fields } = event;\n const fieldInFocus = fields[emittedBy];\n const { container, isEmpty, isValid } = fieldInFocus;\n if (isEmpty || !isValid) {\n (container.parentElement as BadgedInput).error = true;\n }\n });\n\n instance?.on('validityChange', (event: braintree.HostedFieldsStateObject): void => {\n const { fields } = event;\n const isValid = fields.cvv.isValid && fields.expirationDate.isValid && fields.number.isValid;\n this.emitter.emit('validityChanged', isValid);\n });\n }\n\n /** @inheritdoc */\n async tokenizeFields(): Promise<braintree.HostedFieldsTokenizePayload | undefined> {\n let hostedFieldsResponse: braintree.HostedFieldsTokenizePayload | undefined;\n\n const handler = await this.braintreeManager.paymentProviders.creditCardHandler.get();\n\n try {\n hostedFieldsResponse = await handler?.tokenizeHostedFields();\n } catch (error) {\n this.handleHostedFieldTokenizationError(error as BraintreeError);\n return;\n }\n\n return hostedFieldsResponse;\n }\n\n /** @inheritdoc */\n async paymentInitiated(\n hostedFieldsResponse: braintree.HostedFieldsTokenizePayload,\n donationInfo: DonationPaymentInfo,\n donorContactInfo: DonorContactInfo,\n ): Promise<void> {\n let recaptchaToken: string | undefined;\n\n try {\n recaptchaToken = await this.recaptchaManager.execute();\n } catch (error) {\n this.donationFlowModalManager.showErrorModal({\n message: `Recaptcha failure`,\n });\n return;\n }\n\n this.donationFlowModalManager.startDonationSubmissionFlow({\n nonce: hostedFieldsResponse.nonce,\n paymentProvider: PaymentProvider.CreditCard,\n recaptchaToken: recaptchaToken,\n bin: hostedFieldsResponse.details.bin,\n donationInfo: donationInfo,\n customerInfo: donorContactInfo.customer,\n billingInfo: donorContactInfo.billing,\n });\n }\n\n private async handleHostedFieldTokenizationError(error: braintree.BraintreeError): Promise<void> {\n const handler = await this.braintreeManager.paymentProviders.creditCardHandler.get();\n\n handler.showErrorMessage();\n\n switch (error.code) {\n case 'HOSTED_FIELDS_FIELDS_EMPTY':\n // occurs when none of the fields are filled in\n handler.markFieldErrors([\n HostedFieldName.Number,\n HostedFieldName.CVV,\n HostedFieldName.ExpirationDate,\n ]);\n break;\n case 'HOSTED_FIELDS_FIELDS_INVALID':\n // occurs when certain fields do not pass client side validation\n Object.keys(error.details.invalidFields).forEach(key => {\n handler.markFieldErrors([key as HostedFieldName]);\n });\n break;\n case 'HOSTED_FIELDS_TOKENIZATION_FAIL_ON_DUPLICATE':\n // occurs when:\n // * the client token used for client authorization was generated\n // with a customer ID and the fail on duplicate payment method\n // option is set to true\n // * the card being tokenized has previously been vaulted (with any customer)\n break;\n case 'HOSTED_FIELDS_TOKENIZATION_CVV_VERIFICATION_FAILED':\n // occurs when:\n // * the client token used for client authorization was generated\n // with a customer ID and the verify card option is set to true\n // and you have credit card verification turned on in the Braintree\n // control panel\n // * the cvv does not pass verfication\n handler.markFieldErrors([HostedFieldName.CVV]);\n break;\n case 'HOSTED_FIELDS_FAILED_TOKENIZATION':\n // occurs for any other tokenization error on the server\n break;\n case 'HOSTED_FIELDS_TOKENIZATION_NETWORK_ERROR':\n // occurs when the Braintree gateway cannot be contacted\n break;\n default:\n // something else happened\n break;\n }\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"googlepay-flow-handler.js","sourceRoot":"","sources":["../../../../src/payment-flow-handlers/handlers/googlepay-flow-handler.ts"],"names":[],"mappings":"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","sourcesContent":["import { BraintreeManagerInterface } from '../../braintree-manager/braintree-interfaces';\nimport {\n DonationPaymentInfo,\n PaymentProvider,\n CustomerInfo,\n BillingInfo,\n} from '@internetarchive/donation-form-data-models';\nimport { DonationFlowModalManagerInterface } from '../donation-flow-modal-manager';\nimport { Emitter, createNanoEvents, Unsubscribe } from 'nanoevents';\n\nexport interface GooglePayFlowHandlerInterface {\n paymentInitiated(donationInfo: DonationPaymentInfo): Promise<void>;\n on<E extends keyof GooglePayFlowHandlerEvents>(\n event: E,\n callback: GooglePayFlowHandlerEvents[E],\n ): Unsubscribe;\n}\n\nexport interface GooglePayFlowHandlerEvents {\n paymentCancelled: () => void;\n}\n\nexport class GooglePayFlowHandler implements GooglePayFlowHandlerInterface {\n private donationFlowModalManager: DonationFlowModalManagerInterface;\n\n private braintreeManager: BraintreeManagerInterface;\n\n private emitter: Emitter<GooglePayFlowHandlerEvents> = createNanoEvents<\n GooglePayFlowHandlerEvents\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 GooglePayFlowHandlerEvents>(\n event: E,\n callback: GooglePayFlowHandlerEvents[E],\n ): Unsubscribe {\n return this.emitter.on(event, callback);\n }\n\n // GooglePayFlowHandlerInterface conformance\n async paymentInitiated(donationInfo: DonationPaymentInfo): Promise<void> {\n const handler = await this.braintreeManager?.paymentProviders.googlePayHandler.get();\n const instance = await handler.instance.get();\n\n const paymentDataRequest = await instance.createPaymentDataRequest({\n emailRequired: true,\n transactionInfo: {\n currencyCode: 'USD',\n totalPriceStatus: 'FINAL',\n totalPrice: `${donationInfo.total}`,\n },\n });\n\n const cardPaymentMethod = paymentDataRequest.allowedPaymentMethods[0];\n cardPaymentMethod.parameters.billingAddressRequired = true;\n cardPaymentMethod.parameters.billingAddressParameters = {\n format: 'FULL',\n phoneNumberRequired: false,\n };\n\n try {\n const paymentData = await handler.paymentsClient.loadPaymentData(paymentDataRequest);\n const result: braintree.GooglePaymentTokenizePayload = await instance.parseResponse(\n paymentData,\n );\n\n const billingInfo = paymentData.paymentMethodData.info?.billingAddress;\n const name = billingInfo?.name;\n let firstName: string | undefined = name;\n let lastName: string | undefined = '';\n const lastSpace = name?.lastIndexOf(' ');\n if (lastSpace && lastSpace !== -1) {\n firstName = name?.substr(0, lastSpace);\n lastName = name?.substr(lastSpace);\n }\n\n const customer = new CustomerInfo({\n email: paymentData.email,\n firstName,\n lastName,\n });\n\n const billing = new BillingInfo({\n streetAddress: billingInfo?.address1,\n extendedAddress: billingInfo?.address2,\n locality: billingInfo?.locality,\n region: billingInfo?.administrativeArea,\n postalCode: billingInfo?.postalCode,\n countryCodeAlpha2: billingInfo?.countryCode,\n });\n\n this.donationFlowModalManager.startDonationSubmissionFlow({\n nonce: result.nonce,\n paymentProvider: PaymentProvider.GooglePay,\n bin: result.details.bin,\n binName: result.binData.issuingBank,\n donationInfo: donationInfo,\n customerInfo: customer,\n billingInfo: billing,\n });\n } catch {\n this.emitter.emit('paymentCancelled');\n this.donationFlowModalManager.closeModal();\n }\n }\n}\n"]}
1
+ {"version":3,"file":"googlepay-flow-handler.js","sourceRoot":"","sources":["../../../../src/payment-flow-handlers/handlers/googlepay-flow-handler.ts"],"names":[],"mappings":"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","sourcesContent":["import { BraintreeManagerInterface } from '../../braintree-manager/braintree-interfaces';\nimport {\n DonationPaymentInfo,\n PaymentProvider,\n CustomerInfo,\n BillingInfo,\n} from '@internetarchive/donation-form-data-models';\nimport { DonationFlowModalManagerInterface } from '../donation-flow-modal-manager';\nimport { Emitter, createNanoEvents, Unsubscribe } from 'nanoevents';\n\nexport interface GooglePayFlowHandlerInterface {\n paymentInitiated(donationInfo: DonationPaymentInfo): Promise<void>;\n on<E extends keyof GooglePayFlowHandlerEvents>(\n event: E,\n callback: GooglePayFlowHandlerEvents[E],\n ): Unsubscribe;\n}\n\nexport interface GooglePayFlowHandlerEvents {\n paymentCancelled: () => void;\n}\n\nexport class GooglePayFlowHandler implements GooglePayFlowHandlerInterface {\n private donationFlowModalManager: DonationFlowModalManagerInterface;\n\n private braintreeManager: BraintreeManagerInterface;\n\n private emitter: Emitter<GooglePayFlowHandlerEvents> =\n createNanoEvents<GooglePayFlowHandlerEvents>();\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 GooglePayFlowHandlerEvents>(\n event: E,\n callback: GooglePayFlowHandlerEvents[E],\n ): Unsubscribe {\n return this.emitter.on(event, callback);\n }\n\n // GooglePayFlowHandlerInterface conformance\n async paymentInitiated(donationInfo: DonationPaymentInfo): Promise<void> {\n const handler = await this.braintreeManager?.paymentProviders.googlePayHandler.get();\n const instance = await handler.instance.get();\n\n const paymentDataRequest = await instance.createPaymentDataRequest({\n emailRequired: true,\n transactionInfo: {\n currencyCode: 'USD',\n totalPriceStatus: 'FINAL',\n totalPrice: `${donationInfo.total}`,\n },\n });\n\n const cardPaymentMethod = paymentDataRequest.allowedPaymentMethods[0];\n cardPaymentMethod.parameters.billingAddressRequired = true;\n cardPaymentMethod.parameters.billingAddressParameters = {\n format: 'FULL',\n phoneNumberRequired: false,\n };\n\n try {\n const paymentData = await handler.paymentsClient.loadPaymentData(paymentDataRequest);\n const result: braintree.GooglePaymentTokenizePayload =\n await instance.parseResponse(paymentData);\n\n const billingInfo = paymentData.paymentMethodData.info?.billingAddress;\n const name = billingInfo?.name;\n let firstName: string | undefined = name;\n let lastName: string | undefined = '';\n const lastSpace = name?.lastIndexOf(' ');\n if (lastSpace && lastSpace !== -1) {\n firstName = name?.substr(0, lastSpace);\n lastName = name?.substr(lastSpace);\n }\n\n const customer = new CustomerInfo({\n email: paymentData.email,\n firstName,\n lastName,\n });\n\n const billing = new BillingInfo({\n streetAddress: billingInfo?.address1,\n extendedAddress: billingInfo?.address2,\n locality: billingInfo?.locality,\n region: billingInfo?.administrativeArea,\n postalCode: billingInfo?.postalCode,\n countryCodeAlpha2: billingInfo?.countryCode,\n });\n\n this.donationFlowModalManager.startDonationSubmissionFlow({\n nonce: result.nonce,\n paymentProvider: PaymentProvider.GooglePay,\n bin: result.details.bin,\n binName: result.binData.issuingBank,\n donationInfo: donationInfo,\n customerInfo: customer,\n billingInfo: billing,\n });\n } catch {\n this.emitter.emit('paymentCancelled');\n this.donationFlowModalManager.closeModal();\n }\n }\n}\n"]}
@@ -24,11 +24,6 @@ class UpsellDataSourceContainer {
24
24
  * @implements {PayPalButtonDataSourceDelegate}
25
25
  */
26
26
  export class PayPalFlowHandler {
27
- constructor(options) {
28
- this.emitter = createNanoEvents();
29
- this.braintreeManager = options.braintreeManager;
30
- this.donationFlowModalManager = options.donationFlowModalManager;
31
- }
32
27
  updateDonationInfo(donationInfo) {
33
28
  if (this.buttonDataSource) {
34
29
  this.buttonDataSource.donationInfo = donationInfo;
@@ -39,6 +34,11 @@ export class PayPalFlowHandler {
39
34
  this.upsellButtonDataSourceContainer.upsellButtonDataSource.donationInfo = donationInfo;
40
35
  }
41
36
  }
37
+ constructor(options) {
38
+ this.emitter = createNanoEvents();
39
+ this.braintreeManager = options.braintreeManager;
40
+ this.donationFlowModalManager = options.donationFlowModalManager;
41
+ }
42
42
  on(event, callback) {
43
43
  return this.emitter.on(event, callback);
44
44
  }
@@ -68,7 +68,7 @@ export class PayPalFlowHandler {
68
68
  cancelDonationCB: () => {
69
69
  this.donationFlowModalManager.closeModal();
70
70
  this.payPalPaymentCancelled(dataSource, {});
71
- }
71
+ },
72
72
  });
73
73
  });
74
74
  }
@@ -1 +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 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.emitter.emit('payPalPaymentConfirmed', dataSource, {});\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"]}
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 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{\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(\n dataSource: PayPalButtonDataSourceInterface,\n payload: paypal.TokenizePayload,\n ): Promise<void> {\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.emitter.emit('payPalPaymentConfirmed', dataSource, {});\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"]}
@@ -6,7 +6,8 @@ export class VenmoFlowHandler {
6
6
  var _a;
7
7
  this.braintreeManager = options.braintreeManager;
8
8
  this.donationFlowModalManager = options.donationFlowModalManager;
9
- this.restorationStateHandler = (_a = options.restorationStateHandler) !== null && _a !== void 0 ? _a : new VenmoRestorationStateHandler();
9
+ this.restorationStateHandler =
10
+ (_a = options.restorationStateHandler) !== null && _a !== void 0 ? _a : new VenmoRestorationStateHandler();
10
11
  }
11
12
  /**
12
13
  * Check if we have any results from Venmo on startup.