@rebilly/instruments 4.5.0 → 4.6.0

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 (134) hide show
  1. package/.babelrc +24 -26
  2. package/CHANGELOG.md +7 -0
  3. package/dist/index.js +8 -8
  4. package/dist/index.min.js +8 -8
  5. package/package.json +14 -3
  6. package/project.json +9 -0
  7. package/rollup.config.mjs +21 -26
  8. package/src/data/options-schema/index.js +94 -78
  9. package/src/data/options-schema/schemas/options-schema.js +419 -411
  10. package/src/events/base-event.js +34 -34
  11. package/src/events/events.spec.js +6 -6
  12. package/src/events/index.js +5 -5
  13. package/src/functions/destroy.js +19 -19
  14. package/src/functions/destroy.spec.js +41 -41
  15. package/src/functions/mount/fetch-data.js +200 -193
  16. package/src/functions/mount/fetch-data.spec.js +287 -285
  17. package/src/functions/mount/get-lead-source-data.js +31 -31
  18. package/src/functions/mount/get-lead-source-data.spec.js +19 -19
  19. package/src/functions/mount/index.js +73 -65
  20. package/src/functions/mount/mount.spec.js +77 -66
  21. package/src/functions/mount/setup-element.js +23 -23
  22. package/src/functions/mount/setup-framepay-theme.js +86 -68
  23. package/src/functions/mount/setup-framepay.js +9 -5
  24. package/src/functions/mount/setup-i18n.js +15 -15
  25. package/src/functions/mount/setup-options.js +74 -74
  26. package/src/functions/mount/setup-options.spec.js +323 -287
  27. package/src/functions/mount/setup-storefront.js +15 -20
  28. package/src/functions/mount/setup-styles-vars.js +19 -22
  29. package/src/functions/mount/setup-user-flow.js +51 -47
  30. package/src/functions/on.js +5 -5
  31. package/src/functions/on.spec.js +60 -51
  32. package/src/functions/purchase.js +151 -146
  33. package/src/functions/purchase.spec.js +59 -56
  34. package/src/functions/setup.js +53 -53
  35. package/src/functions/setup.spec.js +88 -75
  36. package/src/functions/show.js +13 -14
  37. package/src/functions/show.spec.js +53 -53
  38. package/src/functions/update.js +30 -28
  39. package/src/functions/update.spec.js +94 -93
  40. package/src/i18n/en.json +32 -32
  41. package/src/i18n/es.json +29 -29
  42. package/src/i18n/i18n.spec.js +18 -18
  43. package/src/i18n/index.js +48 -48
  44. package/src/instance.js +36 -36
  45. package/src/instance.spec.js +29 -27
  46. package/src/loader/index.js +95 -70
  47. package/src/loader/loader.spec.js +63 -63
  48. package/src/state/iframes.js +21 -21
  49. package/src/state/index.js +56 -54
  50. package/src/storefront/account-and-website.js +10 -8
  51. package/src/storefront/account-and-website.spec.js +55 -55
  52. package/src/storefront/deposit-requests.js +6 -6
  53. package/src/storefront/fetch-plans-from-addons-bumpOffer.js +21 -19
  54. package/src/storefront/fetch-products-from-plans.js +52 -51
  55. package/src/storefront/fetch-products-from-plans.spec.js +90 -87
  56. package/src/storefront/index.js +56 -49
  57. package/src/storefront/invoices.js +15 -15
  58. package/src/storefront/invoices.spec.js +69 -65
  59. package/src/storefront/models/account-model.js +29 -32
  60. package/src/storefront/models/base-model.js +6 -9
  61. package/src/storefront/models/deposit-request-model.js +22 -13
  62. package/src/storefront/models/invoice-model.js +16 -16
  63. package/src/storefront/models/payment-metadata.js +4 -4
  64. package/src/storefront/models/plan-model.js +73 -64
  65. package/src/storefront/models/ready-to-pay-model.js +59 -59
  66. package/src/storefront/models/summary-model.js +43 -46
  67. package/src/storefront/models/transaction-model.js +11 -14
  68. package/src/storefront/payment-instruments.js +38 -35
  69. package/src/storefront/payment-instruments.spec.js +81 -62
  70. package/src/storefront/purchase.js +50 -44
  71. package/src/storefront/purchase.spec.js +40 -40
  72. package/src/storefront/ready-to-pay.js +75 -77
  73. package/src/storefront/ready-to-pay.spec.js +59 -54
  74. package/src/storefront/storefront.spec.js +9 -9
  75. package/src/storefront/summary.js +93 -67
  76. package/src/storefront/summary.spec.js +108 -106
  77. package/src/storefront/transactions.js +6 -6
  78. package/src/style/base/default-theme.js +928 -923
  79. package/src/style/base/theme.js +21 -21
  80. package/src/style/base/theme.spec.js +13 -13
  81. package/src/style/index.js +3 -3
  82. package/src/style/utils/border.js +40 -27
  83. package/src/style/utils/color-values.js +18 -18
  84. package/src/style/utils/minifyCss.js +6 -6
  85. package/src/utils/add-dom-element.js +14 -14
  86. package/src/utils/format-currency.js +6 -5
  87. package/src/utils/has-valid-css-selector.js +2 -2
  88. package/src/utils/index.js +6 -6
  89. package/src/utils/is-dom-element.js +1 -1
  90. package/src/utils/process-property-as-dom-element.js +22 -22
  91. package/src/utils/quantity.js +26 -28
  92. package/src/utils/sleep.js +3 -1
  93. package/src/views/amount-selector.js +37 -36
  94. package/src/views/common/iframe/base-iframe.js +53 -52
  95. package/src/views/common/iframe/events/change-iframe-src-handler.js +5 -5
  96. package/src/views/common/iframe/events/dispatch-event-handler.js +4 -4
  97. package/src/views/common/iframe/events/resize-component-handler.js +8 -8
  98. package/src/views/common/iframe/events/show-error-handler.js +2 -2
  99. package/src/views/common/iframe/events/stop-loader-handler.js +8 -8
  100. package/src/views/common/iframe/events/update-addons-handler.js +20 -13
  101. package/src/views/common/iframe/events/update-coupons-handler.js +9 -9
  102. package/src/views/common/iframe/events/update-items-handler.js +26 -22
  103. package/src/views/common/iframe/modal-iframe.js +67 -56
  104. package/src/views/common/iframe/view-iframe.js +11 -11
  105. package/src/views/common/render-utilities.js +2 -2
  106. package/src/views/confirmation.js +33 -30
  107. package/src/views/errors.js +89 -79
  108. package/src/views/form.js +41 -37
  109. package/src/views/method-selector/express-methods.js +46 -46
  110. package/src/views/method-selector/generate-digital-wallet.js +46 -45
  111. package/src/views/method-selector/generate-digital-wallet.spec.js +104 -102
  112. package/src/views/method-selector/generate-framepay-config.js +53 -51
  113. package/src/views/method-selector/generate-framepay-config.spec.js +197 -173
  114. package/src/views/method-selector/get-method-data.js +5 -6
  115. package/src/views/method-selector/get-payment-methods.js +18 -16
  116. package/src/views/method-selector/get-payment-methods.spec.js +29 -27
  117. package/src/views/method-selector/index.js +154 -139
  118. package/src/views/method-selector/method-selector.spec.js +13 -13
  119. package/src/views/method-selector/mount-bump-offer.js +65 -49
  120. package/src/views/method-selector/mount-express-methods.js +89 -85
  121. package/src/views/modal.js +74 -67
  122. package/src/views/result.js +14 -14
  123. package/src/views/summary.js +25 -26
  124. package/tests/async-utilities.js +13 -13
  125. package/tests/mocks/framepay-mock.js +9 -8
  126. package/tests/mocks/rebilly-api-mock.js +5 -3
  127. package/tests/mocks/rebilly-instruments-mock.js +121 -117
  128. package/tests/mocks/storefront-api-mock.js +55 -48
  129. package/tests/mocks/storefront-mock.js +10 -14
  130. package/tests/msw/server.js +6 -6
  131. package/tests/setup-test.js +14 -16
  132. package/vitest.config.js +14 -14
  133. package/.eslintrc.js +0 -34
  134. package/.prettierrc.js +0 -11
@@ -13,215 +13,222 @@ import DepositRequestModel from '../../storefront/models/deposit-request-model';
13
13
  import { getLeadSourceData } from './get-lead-source-data';
14
14
 
15
15
  export class DataInstance {
16
- constructor({
17
- ...fields
18
- } = {}) {
19
- Object.entries({
20
- ...state.data || {},
21
- ...fields
22
- }).forEach(([key, value]) => {
23
- this[key] = value;
24
- });
25
-
26
- this.money = state.options?.money || null;
27
- this.couponIds = [];
28
- this.addons = [];
29
- this.acceptBumpOffer = false;
30
- }
31
-
32
- get amountAndCurrency() {
33
- let currency;
34
- let amount;
35
- let amountDue;
36
-
37
- if (this.previewPurchase) {
38
- currency = this.previewPurchase.currency;
39
- amount = this.previewPurchase.total;
40
- } else if (this.invoice) {
41
- currency = this.invoice.currency;
42
- amount = this.invoice.amount;
43
- amountDue = this.invoice.amountDue;
44
- } else if (this.transaction) {
45
- currency = this.transaction.currency;
46
- amount = this.transaction.amount;
47
- } else if (this.money) {
48
- currency = this.money.currency;
49
- amount = this.money.amount;
16
+ constructor({ ...fields } = {}) {
17
+ Object.entries({
18
+ ...(state.data || {}),
19
+ ...fields,
20
+ }).forEach(([key, value]) => {
21
+ this[key] = value;
22
+ });
23
+
24
+ this.money = state.options?.money || null;
25
+ this.couponIds = [];
26
+ this.addons = [];
27
+ this.acceptBumpOffer = false;
50
28
  }
51
- const amountAndCurrency = {
52
- amount,
53
- currency
54
- };
55
- if (amountDue) {
56
- amountAndCurrency.amountDue = amountDue;
57
- }
58
- return amountAndCurrency;
59
- }
60
-
61
- get isPayment() {
62
- return (this.invoice || this.transaction || this.money);
63
- }
64
-
65
- get isPurchase() {
66
- return this.previewPurchase;
67
- }
68
-
69
- get hasAmountDue() {
70
- return !!(
71
- this.amountAndCurrency.amountDue &&
72
- this.amountAndCurrency.amountDue !== this.amountAndCurrency.amount
73
- );
74
- }
75
-
76
- get summaryItems() {
77
- const {
78
- discountsAmount = null,
79
- shippingAmount = null,
80
- subtotalAmount = null,
81
- taxAmount = null,
82
- } = (this.previewPurchase || this.invoice || {});
83
-
84
- return {
85
- discountsAmount,
86
- shippingAmount,
87
- subtotalAmount,
88
- taxAmount
89
- }
90
- }
91
-
92
- get summaryLineItems() {
93
- let lineItems = [];
94
- if (this.invoice) {
95
- ({
96
- items: lineItems = [],
97
- } = this.invoice)
98
- } else {
99
- ({
100
- lineItems = [],
101
- } = this.previewPurchase || {});
29
+
30
+ get amountAndCurrency() {
31
+ let currency;
32
+ let amount;
33
+ let amountDue;
34
+
35
+ if (this.previewPurchase) {
36
+ currency = this.previewPurchase.currency;
37
+ amount = this.previewPurchase.total;
38
+ } else if (this.invoice) {
39
+ currency = this.invoice.currency;
40
+ amount = this.invoice.amount;
41
+ amountDue = this.invoice.amountDue;
42
+ } else if (this.transaction) {
43
+ currency = this.transaction.currency;
44
+ amount = this.transaction.amount;
45
+ } else if (this.money) {
46
+ currency = this.money.currency;
47
+ amount = this.money.amount;
48
+ }
49
+ const amountAndCurrency = {
50
+ amount,
51
+ currency,
52
+ };
53
+ if (amountDue) {
54
+ amountAndCurrency.amountDue = amountDue;
55
+ }
56
+ return amountAndCurrency;
102
57
  }
103
58
 
104
- return lineItems;
105
- }
106
-
107
- get isShippingRequired() {
108
- return (this.products || []).some(product => product.requiresShipping);
109
- }
110
-
111
- toPostmatesModel() {
112
- return JSON.parse(JSON.stringify({
113
- ...this,
114
- amountAndCurrency: this.amountAndCurrency,
115
- isPayment: this.isPayment,
116
- isPurchase: this.isPurchase,
117
- hasAmountDue: this.hasAmountDue,
118
- summaryItems: this.summaryItems,
119
- summaryLineItems: this.summaryLineItems,
120
- isShippingRequired: this.isShippingRequired,
121
- leadSource: getLeadSourceData(),
122
- }))
123
- }
124
- }
59
+ get isPayment() {
60
+ return this.invoice || this.transaction || this.money;
61
+ }
125
62
 
126
- export async function fetchData({
127
- riskMetadata = null,
128
-
129
- // Dependency injectable functions
130
- fetchInvoiceAndProducts = FetchInvoiceAndProducts,
131
- fetchTransaction = FetchTransaction,
132
- fetchAccountAndWebsite = FetchAccountAndWebsite,
133
- fetchInstruments = FetchInstruments,
134
- fetchDepositRequest = FetchDepositRequest,
135
- } = {}) {
136
- try {
137
- state.data = new DataInstance();
138
-
139
- if (state.options?.deposit) {
140
- if (state.options.deposit.depositRequestId) {
141
- state.data.deposit = await fetchDepositRequest({data: {
142
- id: state.options.deposit.depositRequestId,
143
- }});
144
- } else {
145
- state.data.deposit = new DepositRequestModel(state.options.deposit);
146
- }
63
+ get isPurchase() {
64
+ return this.previewPurchase;
147
65
  }
148
66
 
149
- let readyToPayPromise = Promise.resolve(null);
150
-
151
- let availableInstrumentsPromise = null;
152
- if (state.options?.jwt) {
153
- fetchAccountAndWebsite({ state }).then(({ account, website }) => {
154
- state.data.account = account;
155
- state.data.website = website;
156
- });
157
- readyToPayPromise = fetchReadyToPay({ riskMetadata });
158
- availableInstrumentsPromise = fetchInstruments({ state });
159
- } else {
160
- readyToPayPromise = fetchReadyToPay({ riskMetadata });
67
+ get hasAmountDue() {
68
+ return !!(
69
+ this.amountAndCurrency.amountDue &&
70
+ this.amountAndCurrency.amountDue !== this.amountAndCurrency.amount
71
+ );
161
72
  }
162
73
 
163
- if (state.options?.transactionId) {
164
- state.data.transaction = await fetchTransaction({
165
- data: {
166
- id: state.options.transactionId
167
- }});
74
+ get summaryItems() {
75
+ const {
76
+ discountsAmount = null,
77
+ shippingAmount = null,
78
+ subtotalAmount = null,
79
+ taxAmount = null,
80
+ } = this.previewPurchase || this.invoice || {};
81
+
82
+ return {
83
+ discountsAmount,
84
+ shippingAmount,
85
+ subtotalAmount,
86
+ taxAmount,
87
+ };
168
88
  }
169
89
 
170
- let productsPromise;
171
- const invoiceId = state.options?.invoiceId || state.data?.transaction?.invoiceId;
172
- if (invoiceId) {
173
- const { invoice, products } = await fetchInvoiceAndProducts({
174
- data: {
175
- id: invoiceId
90
+ get summaryLineItems() {
91
+ let lineItems = [];
92
+ if (this.invoice) {
93
+ ({ items: lineItems = [] } = this.invoice);
94
+ } else {
95
+ ({ lineItems = [] } = this.previewPurchase || {});
176
96
  }
177
- });
178
- productsPromise = Promise.resolve(products);
179
- state.data.invoice = invoice;
180
- }
181
97
 
182
- if (!riskMetadata) {
183
- ({ riskMetadata } = await collectData());
184
- state.data.riskMetadata = riskMetadata;
98
+ return lineItems;
185
99
  }
186
100
 
187
- const previewPurchasePromise = state.options.items ?
188
- fetchSummary() : null;
101
+ get isShippingRequired() {
102
+ return (this.products || []).some(
103
+ (product) => product.requiresShipping,
104
+ );
105
+ }
189
106
 
190
- if (!state.options?.jwt) {
191
- // There is no invoice, only pla ns through the static options,
192
- // so we should fetch the products from the provided plan names.
193
- productsPromise = fetchProductsFromPlans({ state });
107
+ toPostmatesModel() {
108
+ return JSON.parse(
109
+ JSON.stringify({
110
+ ...this,
111
+ amountAndCurrency: this.amountAndCurrency,
112
+ isPayment: this.isPayment,
113
+ isPurchase: this.isPurchase,
114
+ hasAmountDue: this.hasAmountDue,
115
+ summaryItems: this.summaryItems,
116
+ summaryLineItems: this.summaryLineItems,
117
+ isShippingRequired: this.isShippingRequired,
118
+ leadSource: getLeadSourceData(),
119
+ }),
120
+ );
194
121
  }
122
+ }
123
+
124
+ export async function fetchData({
125
+ riskMetadata = null,
126
+
127
+ // Dependency injectable functions
128
+ fetchInvoiceAndProducts = FetchInvoiceAndProducts,
129
+ fetchTransaction = FetchTransaction,
130
+ fetchAccountAndWebsite = FetchAccountAndWebsite,
131
+ fetchInstruments = FetchInstruments,
132
+ fetchDepositRequest = FetchDepositRequest,
133
+ } = {}) {
134
+ try {
135
+ state.data = new DataInstance();
136
+
137
+ if (state.options?.deposit) {
138
+ if (state.options.deposit.depositRequestId) {
139
+ state.data.deposit = await fetchDepositRequest({
140
+ data: {
141
+ id: state.options.deposit.depositRequestId,
142
+ },
143
+ });
144
+ } else {
145
+ state.data.deposit = new DepositRequestModel(
146
+ state.options.deposit,
147
+ );
148
+ }
149
+ }
150
+
151
+ let readyToPayPromise = Promise.resolve(null);
152
+
153
+ let availableInstrumentsPromise = null;
154
+ if (state.options?.jwt) {
155
+ fetchAccountAndWebsite({ state }).then(({ account, website }) => {
156
+ state.data.account = account;
157
+ state.data.website = website;
158
+ });
159
+ readyToPayPromise = fetchReadyToPay({ riskMetadata });
160
+ availableInstrumentsPromise = fetchInstruments({ state });
161
+ } else {
162
+ readyToPayPromise = fetchReadyToPay({ riskMetadata });
163
+ }
164
+
165
+ if (state.options?.transactionId) {
166
+ state.data.transaction = await fetchTransaction({
167
+ data: {
168
+ id: state.options.transactionId,
169
+ },
170
+ });
171
+ }
172
+
173
+ let productsPromise;
174
+ const invoiceId =
175
+ state.options?.invoiceId || state.data?.transaction?.invoiceId;
176
+ if (invoiceId) {
177
+ const { invoice, products } = await fetchInvoiceAndProducts({
178
+ data: {
179
+ id: invoiceId,
180
+ },
181
+ });
182
+ productsPromise = Promise.resolve(products);
183
+ state.data.invoice = invoice;
184
+ }
195
185
 
196
- let plansPromise = new Promise((resolve) => resolve([]));
197
- if (state.options?.addons || state.options?.bumpOffer) {
198
- plansPromise = fetchPlansFromAddonsBumpOffer({ state });
186
+ if (!riskMetadata) {
187
+ ({ riskMetadata } = await collectData());
188
+ state.data.riskMetadata = riskMetadata;
189
+ }
190
+
191
+ const previewPurchasePromise = state.options.items
192
+ ? fetchSummary()
193
+ : null;
194
+
195
+ if (!state.options?.jwt) {
196
+ // There is no invoice, only pla ns through the static options,
197
+ // so we should fetch the products from the provided plan names.
198
+ productsPromise = fetchProductsFromPlans({ state });
199
+ }
200
+
201
+ let plansPromise = new Promise((resolve) => {
202
+ resolve([]);
203
+ });
204
+ if (state.options?.addons || state.options?.bumpOffer) {
205
+ plansPromise = fetchPlansFromAddonsBumpOffer({ state });
206
+ }
207
+
208
+ const [
209
+ readyToPay,
210
+ previewPurchase,
211
+ products,
212
+ plans,
213
+ availableInstruments,
214
+ ] = await Promise.all([
215
+ readyToPayPromise,
216
+ previewPurchasePromise,
217
+ productsPromise,
218
+ plansPromise,
219
+ availableInstrumentsPromise,
220
+ ]);
221
+
222
+ return new DataInstance({
223
+ readyToPay,
224
+ previewPurchase,
225
+ products,
226
+ plans,
227
+ availableInstruments,
228
+ });
229
+ } catch (error) {
230
+ // console.log(error);
199
231
  }
200
232
 
201
- const [
202
- readyToPay,
203
- previewPurchase,
204
- products,
205
- plans,
206
- availableInstruments
207
- ] = await Promise.all([
208
- readyToPayPromise,
209
- previewPurchasePromise,
210
- productsPromise,
211
- plansPromise,
212
- availableInstrumentsPromise
213
- ]);
214
-
215
- return new DataInstance({
216
- readyToPay,
217
- previewPurchase,
218
- products,
219
- plans,
220
- availableInstruments
221
- });
222
- } catch (error) {
223
- // console.log(error);
224
- }
225
-
226
- return new DataInstance({});
227
- }
233
+ return new DataInstance({});
234
+ }