@kiva/kv-components 5.3.2 → 5.3.4
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.
- package/dist/vue/KvLendCta.css +1 -1
- package/dist/vue/KvLendCta.js +64 -61
- package/package.json +2 -2
package/dist/vue/KvLendCta.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.amountDropdownWrapper[data-v-
|
|
1
|
+
.amountDropdownWrapper[data-v-f7cccdf4] select{border-radius:14px 0 0 14px}.lend-again[data-v-f7cccdf4] span{padding-left:0;padding-right:0;padding-left:.5rem;padding-right:.5rem}.lendButtonWrapper[data-v-f7cccdf4] span:first-child{border-radius:0 14px 14px 0}.filtered-dropdown[data-v-f7cccdf4] select{cursor:pointer;border-radius:.875rem;border-width:2px;font-weight:500}.unselected-dropdown[data-v-f7cccdf4] select{--tw-border-opacity: 1;border-color:rgb(158 158 158 / var(--tw-border-opacity, 1))}.selected-dropdown[data-v-f7cccdf4] select{--tw-border-opacity: 1;border-color:rgb(34 56 41 / var(--tw-border-opacity, 1))}.preset-option[data-v-f7cccdf4] span.tw-w-full:first-child{border-width:2px;--tw-border-opacity: 1;border-color:rgb(158 158 158 / var(--tw-border-opacity, 1))}.selected-option[data-v-f7cccdf4] span.tw-w-full:first-child{--tw-border-opacity: 1;border-color:rgb(34 56 41 / var(--tw-border-opacity, 1))}
|
package/dist/vue/KvLendCta.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { mdiChevronRight as T } from "@mdi/js";
|
|
2
|
-
import { getLendCtaSelectedOption as
|
|
2
|
+
import { getLendCtaSelectedOption as p, getDropdownPriceArray as x } from "../utils/loanUtils.js";
|
|
3
3
|
import C from "./KvLendAmountButton.js";
|
|
4
4
|
import _ from "./KvSelect.js";
|
|
5
5
|
import D from "./KvButton.js";
|
|
6
6
|
import P from "./KvMaterialIcon.js";
|
|
7
|
-
import { resolveComponent as w, openBlock as i, createElementBlock as a, createBlock as l, normalizeClass as
|
|
7
|
+
import { resolveComponent as w, openBlock as i, createElementBlock as a, createBlock as l, normalizeClass as r, withCtx as d, createTextVNode as c, toDisplayString as m, createElementVNode as y, createVNode as S, withModifiers as A, Fragment as B, renderList as v, createCommentVNode as u } from "vue";
|
|
8
8
|
import "./KvLendCta.css";
|
|
9
9
|
import F from "../_virtual/_plugin-vue_export-helper.js";
|
|
10
10
|
const I = {
|
|
@@ -102,16 +102,16 @@ const I = {
|
|
|
102
102
|
}
|
|
103
103
|
},
|
|
104
104
|
data() {
|
|
105
|
-
var e,
|
|
105
|
+
var e, s, n;
|
|
106
106
|
return {
|
|
107
107
|
mdiChevronRight: T,
|
|
108
108
|
defaultAmountOptions: [25, 50, 75],
|
|
109
|
-
selectedOption:
|
|
109
|
+
selectedOption: p(
|
|
110
110
|
this.getCookie,
|
|
111
111
|
this.setCookie,
|
|
112
112
|
this.enableFiveDollarsNotes,
|
|
113
|
-
(
|
|
114
|
-
(
|
|
113
|
+
(s = (e = this.route) == null ? void 0 : e.query) == null ? void 0 : s.utm_campaign,
|
|
114
|
+
(n = this.loan) == null ? void 0 : n.unreservedAmount,
|
|
115
115
|
this.userBalance,
|
|
116
116
|
this.fiveDollarsSelected
|
|
117
117
|
),
|
|
@@ -139,12 +139,12 @@ const I = {
|
|
|
139
139
|
return ((e = this.loan) == null ? void 0 : e.unreservedAmount) ?? "";
|
|
140
140
|
},
|
|
141
141
|
lentPreviously() {
|
|
142
|
-
var e,
|
|
143
|
-
return ((
|
|
142
|
+
var e, s;
|
|
143
|
+
return ((s = (e = this.loan) == null ? void 0 : e.userProperties) == null ? void 0 : s.lentTo) ?? !1;
|
|
144
144
|
},
|
|
145
145
|
isInBasket() {
|
|
146
146
|
var e;
|
|
147
|
-
return ((e = this.basketItems) == null ? void 0 : e.some((
|
|
147
|
+
return ((e = this.basketItems) == null ? void 0 : e.some((s) => s.__typename === "LoanReservation" && s.id === this.loanId)) ?? !1;
|
|
148
148
|
},
|
|
149
149
|
prices() {
|
|
150
150
|
const e = parseFloat(this.unreservedAmount < 25 ? this.minNoteSize : 25);
|
|
@@ -219,7 +219,7 @@ const I = {
|
|
|
219
219
|
return this.isAmountLessThan25(this.unreservedAmount) || this.isAmountBetween25And500(this.unreservedAmount);
|
|
220
220
|
},
|
|
221
221
|
isLendAmountButton() {
|
|
222
|
-
return (this.lendButtonVisibility || this.state === "lent-to") && this.isAmountLessThan25(this.unreservedAmount) || this.showPresetAmounts && this.presetButtonsPrices.length === 1;
|
|
222
|
+
return (this.lendButtonVisibility || this.state === "lent-to") && this.isAmountLessThan25(this.unreservedAmount) || this.showPresetAmounts && this.presetButtonsPrices.length === 1 && !this.isAdding;
|
|
223
223
|
},
|
|
224
224
|
isFunded() {
|
|
225
225
|
return this.state === "funded" || this.state === "fully-reserved";
|
|
@@ -241,13 +241,13 @@ const I = {
|
|
|
241
241
|
}
|
|
242
242
|
},
|
|
243
243
|
watch: {
|
|
244
|
-
unreservedAmount(e,
|
|
245
|
-
var
|
|
246
|
-
e !==
|
|
244
|
+
unreservedAmount(e, s) {
|
|
245
|
+
var n, k;
|
|
246
|
+
e !== s && s === "" && (this.selectedOption = p(
|
|
247
247
|
this.getCookie,
|
|
248
248
|
this.setCookie,
|
|
249
249
|
this.enableFiveDollarsNotes,
|
|
250
|
-
(k = (
|
|
250
|
+
(k = (n = this.route) == null ? void 0 : n.query) == null ? void 0 : k.utm_campaign,
|
|
251
251
|
e,
|
|
252
252
|
this.userBalance,
|
|
253
253
|
this.fiveDollarsSelected,
|
|
@@ -322,19 +322,19 @@ const I = {
|
|
|
322
322
|
key: 1,
|
|
323
323
|
class: "amountDropdownWrapper"
|
|
324
324
|
}, R = ["value"];
|
|
325
|
-
function U(e,
|
|
326
|
-
const h = w("kv-ui-button"), L = w("kv-material-icon"),
|
|
325
|
+
function U(e, s, n, k, f, t) {
|
|
326
|
+
const h = w("kv-ui-button"), L = w("kv-material-icon"), g = w("kv-ui-select"), b = w("kv-lend-amount-button");
|
|
327
327
|
return i(), a("div", V, [
|
|
328
328
|
t.isInBasket ? (i(), l(h, {
|
|
329
329
|
key: 0,
|
|
330
330
|
variant: "secondary",
|
|
331
|
-
class:
|
|
331
|
+
class: r(["tw-inline-flex tw-flex-1", { "tw-w-full": n.showPresetAmounts }]),
|
|
332
332
|
"data-testid": "bp-lend-cta-checkout-button",
|
|
333
|
-
to:
|
|
334
|
-
href:
|
|
335
|
-
onClick:
|
|
333
|
+
to: n.externalLinks ? void 0 : "/basket",
|
|
334
|
+
href: n.externalLinks ? "/basket" : void 0,
|
|
335
|
+
onClick: s[0] || (s[0] = (o) => t.clickSecondaryButton(o))
|
|
336
336
|
}, {
|
|
337
|
-
default:
|
|
337
|
+
default: d(() => [
|
|
338
338
|
c(m(t.loanInBasketButtonText), 1)
|
|
339
339
|
]),
|
|
340
340
|
_: 1
|
|
@@ -342,21 +342,21 @@ function U(e, n, s, k, f, t) {
|
|
|
342
342
|
key: 1,
|
|
343
343
|
class: "tw-inline-flex tw-flex-1"
|
|
344
344
|
}, {
|
|
345
|
-
default:
|
|
345
|
+
default: d(() => [
|
|
346
346
|
c(m(t.ctaButtonText), 1)
|
|
347
347
|
]),
|
|
348
348
|
_: 1
|
|
349
|
-
})) : t.isFunded ? (i(), a("div", O, " This loan was just funded! 🎉 ")) :
|
|
349
|
+
})) : t.isFunded ? (i(), a("div", O, " This loan was just funded! 🎉 ")) : n.showViewLoan ? (i(), l(h, {
|
|
350
350
|
key: 3,
|
|
351
351
|
state: `${t.allSharesReserved ? "disabled" : ""}`,
|
|
352
|
-
to:
|
|
353
|
-
href:
|
|
352
|
+
to: n.externalLinks ? void 0 : t.readMorePath,
|
|
353
|
+
href: n.externalLinks ? t.readMorePath : void 0,
|
|
354
354
|
class: "tw-mb-0",
|
|
355
|
-
onClick:
|
|
355
|
+
onClick: s[1] || (s[1] = (o) => e.$emit("show-loan-details", o))
|
|
356
356
|
}, {
|
|
357
|
-
default:
|
|
357
|
+
default: d(() => [
|
|
358
358
|
y("span", N, [
|
|
359
|
-
|
|
359
|
+
s[5] || (s[5] = c(" View loan ")),
|
|
360
360
|
S(L, {
|
|
361
361
|
class: "tw-w-3 tw-h-3 tw-align-middle",
|
|
362
362
|
icon: f.mdiChevronRight
|
|
@@ -367,69 +367,72 @@ function U(e, n, s, k, f, t) {
|
|
|
367
367
|
}, 8, ["state", "to", "href"])) : t.useFormSubmit ? (i(), a("form", {
|
|
368
368
|
key: 4,
|
|
369
369
|
class: "tw-w-full tw-flex",
|
|
370
|
-
onSubmit:
|
|
370
|
+
onSubmit: s[4] || (s[4] = A((...o) => t.addToBasket && t.addToBasket(...o), ["prevent"]))
|
|
371
371
|
}, [
|
|
372
372
|
y("fieldset", {
|
|
373
|
-
class:
|
|
374
|
-
|
|
373
|
+
class: r(["tw-w-full tw-flex", {
|
|
374
|
+
"tw-flex-col md:tw-flex-row md:tw-justify-between": n.showPresetAmounts,
|
|
375
|
+
"tw-gap-1.5": n.showPresetAmounts && !t.isLendAmountButton
|
|
376
|
+
}]),
|
|
377
|
+
disabled: n.isAdding,
|
|
375
378
|
"data-testid": "bp-lend-cta-select-and-button"
|
|
376
379
|
}, [
|
|
377
|
-
|
|
380
|
+
n.showPresetAmounts && !n.isAdding ? (i(), a("div", {
|
|
378
381
|
key: 0,
|
|
379
|
-
class:
|
|
382
|
+
class: r(["tw-flex tw-gap-1 lg:tw-gap-2", { "tw-flex-wrap md:tw-flex-nowrap": n.enableHugeAmount }])
|
|
380
383
|
}, [
|
|
381
|
-
t.isLendAmountButton ? u("", !0) : (i(!0), a(
|
|
384
|
+
t.isLendAmountButton ? u("", !0) : (i(!0), a(B, { key: 0 }, v(t.presetButtonsPrices, (o) => (i(), l(h, {
|
|
382
385
|
key: o,
|
|
383
386
|
variant: "secondary",
|
|
384
|
-
class:
|
|
387
|
+
class: r(["tw-inline-flex tw-flex-1 preset-option tw-w-8", { "selected-option": f.selectedOption == o }]),
|
|
385
388
|
"data-testid": "bp-lend-cta-lend-button",
|
|
386
389
|
onClick: (j) => t.clickPresetButton(o)
|
|
387
390
|
}, {
|
|
388
|
-
default:
|
|
391
|
+
default: d(() => [
|
|
389
392
|
c(" $" + m(o), 1)
|
|
390
393
|
]),
|
|
391
394
|
_: 2
|
|
392
395
|
}, 1032, ["class", "onClick"]))), 128)),
|
|
393
|
-
t.showFilteredDropdown ? (i(), l(
|
|
396
|
+
t.showFilteredDropdown ? (i(), l(g, {
|
|
394
397
|
key: 1,
|
|
395
398
|
id: `LoanAmountDropdown_${t.loanId}`,
|
|
396
399
|
modelValue: f.selectedDropdownOption,
|
|
397
400
|
"onUpdate:modelValue": [
|
|
398
|
-
|
|
401
|
+
s[2] || (s[2] = (o) => f.selectedDropdownOption = o),
|
|
399
402
|
t.trackLendAmountSelection
|
|
400
403
|
],
|
|
401
|
-
class:
|
|
404
|
+
class: r(["tw-min-w-12 tw-rounded filtered-dropdown", {
|
|
402
405
|
"unselected-dropdown": !t.selectedDropdown,
|
|
403
406
|
"selected-dropdown": t.selectedDropdown,
|
|
404
|
-
"tw-w-full":
|
|
407
|
+
"tw-w-full": n.enableHugeAmount
|
|
405
408
|
}]),
|
|
406
409
|
"aria-label": "Lend amount",
|
|
407
|
-
onClick:
|
|
410
|
+
onClick: A(t.clickDropdown, ["stop"])
|
|
408
411
|
}, {
|
|
409
|
-
default:
|
|
410
|
-
(i(!0), a(
|
|
412
|
+
default: d(() => [
|
|
413
|
+
(i(!0), a(B, null, v(t.presetDropdownPrices, (o) => (i(), a("option", {
|
|
411
414
|
key: o,
|
|
412
415
|
value: o
|
|
413
416
|
}, m(o !== "Other" ? `$${o}` : o), 9, H))), 128))
|
|
414
417
|
]),
|
|
415
418
|
_: 1
|
|
416
419
|
}, 8, ["id", "modelValue", "class", "onUpdate:modelValue", "onClick"])) : u("", !0)
|
|
417
|
-
], 2)) :
|
|
418
|
-
t.hideShowLendDropdown && !t.isLessThan25 ? (i(), l(
|
|
420
|
+
], 2)) : n.showPresetAmounts ? u("", !0) : (i(), a("div", K, [
|
|
421
|
+
t.hideShowLendDropdown && !t.isLessThan25 ? (i(), l(g, {
|
|
419
422
|
key: 0,
|
|
420
423
|
id: `LoanAmountDropdown_${t.loanId}`,
|
|
421
424
|
modelValue: f.selectedOption,
|
|
422
425
|
"onUpdate:modelValue": [
|
|
423
|
-
|
|
426
|
+
s[3] || (s[3] = (o) => f.selectedOption = o),
|
|
424
427
|
t.trackLendAmountSelection
|
|
425
428
|
],
|
|
426
429
|
class: "tw-min-w-12",
|
|
427
430
|
style: { "border-radius": "14px 0 0 14px" },
|
|
428
431
|
"aria-label": "Lend amount",
|
|
429
|
-
onClick:
|
|
432
|
+
onClick: A(t.clickDropdown, ["stop"])
|
|
430
433
|
}, {
|
|
431
|
-
default:
|
|
432
|
-
(i(!0), a(
|
|
434
|
+
default: d(() => [
|
|
435
|
+
(i(!0), a(B, null, v(t.prices, (o) => (i(), a("option", {
|
|
433
436
|
key: o,
|
|
434
437
|
value: o
|
|
435
438
|
}, " $" + m(o), 9, R))), 128))
|
|
@@ -438,47 +441,47 @@ function U(e, n, s, k, f, t) {
|
|
|
438
441
|
}, 8, ["id", "modelValue", "onUpdate:modelValue", "onClick"])) : u("", !0)
|
|
439
442
|
])),
|
|
440
443
|
y("div", {
|
|
441
|
-
class:
|
|
442
|
-
lendButtonWrapper: t.hideShowLendDropdown && !
|
|
444
|
+
class: r({
|
|
445
|
+
lendButtonWrapper: t.hideShowLendDropdown && !n.showPresetAmounts,
|
|
443
446
|
"tw-hidden": t.hideLendButton
|
|
444
447
|
})
|
|
445
448
|
}, [
|
|
446
449
|
t.lendButtonVisibility && !t.isLessThan25 ? (i(), l(h, {
|
|
447
450
|
key: "lendButton",
|
|
448
|
-
class:
|
|
451
|
+
class: r(["tw-inline-flex tw-flex-1", { "tw-w-full": n.showPresetAmounts }]),
|
|
449
452
|
"data-testid": "bp-lend-cta-lend-button",
|
|
450
453
|
type: "submit"
|
|
451
454
|
}, {
|
|
452
|
-
default:
|
|
455
|
+
default: d(() => [
|
|
453
456
|
c(m(t.ctaButtonText), 1)
|
|
454
457
|
]),
|
|
455
458
|
_: 1
|
|
456
459
|
}, 8, ["class"])) : t.showLendAgain ? (i(), l(h, {
|
|
457
460
|
key: "lendAgainButton",
|
|
458
|
-
class:
|
|
461
|
+
class: r(["lend-again", { "tw-w-full": n.showPresetAmounts }]),
|
|
459
462
|
"data-testid": "bp-lend-cta-lend-again-button",
|
|
460
463
|
type: "submit"
|
|
461
464
|
}, {
|
|
462
|
-
default:
|
|
463
|
-
c(m(
|
|
465
|
+
default: d(() => [
|
|
466
|
+
c(m(n.primaryButtonText || "Lend") + " again ", 1)
|
|
464
467
|
]),
|
|
465
468
|
_: 1
|
|
466
469
|
}, 8, ["class"])) : u("", !0)
|
|
467
470
|
], 2),
|
|
468
|
-
t.isLendAmountButton && !
|
|
471
|
+
t.isLendAmountButton && !n.enableFiveDollarsNotes ? (i(), l(b, {
|
|
469
472
|
key: 2,
|
|
470
473
|
class: "tw-w-full",
|
|
471
474
|
"loan-id": t.loanId,
|
|
472
475
|
"show-now": !1,
|
|
473
476
|
"amount-left": t.unreservedAmount,
|
|
474
|
-
"is-adding":
|
|
477
|
+
"is-adding": n.isAdding,
|
|
475
478
|
onAddToBasket: t.addToBasket
|
|
476
479
|
}, null, 8, ["loan-id", "amount-left", "is-adding", "onAddToBasket"])) : u("", !0),
|
|
477
|
-
!
|
|
480
|
+
!n.isLoading && n.isAdding ? (i(), l(h, {
|
|
478
481
|
key: 3,
|
|
479
482
|
class: "tw-inline-flex tw-flex-1"
|
|
480
483
|
}, {
|
|
481
|
-
default:
|
|
484
|
+
default: d(() => s[6] || (s[6] = [
|
|
482
485
|
c(" Adding to basket ")
|
|
483
486
|
])),
|
|
484
487
|
_: 1
|
|
@@ -487,7 +490,7 @@ function U(e, n, s, k, f, t) {
|
|
|
487
490
|
], 32)) : u("", !0)
|
|
488
491
|
]);
|
|
489
492
|
}
|
|
490
|
-
const Z = /* @__PURE__ */ F(I, [["render", U], ["__scopeId", "data-v-
|
|
493
|
+
const Z = /* @__PURE__ */ F(I, [["render", U], ["__scopeId", "data-v-f7cccdf4"]]);
|
|
491
494
|
export {
|
|
492
495
|
Z as default
|
|
493
496
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kiva/kv-components",
|
|
3
|
-
"version": "5.3.
|
|
3
|
+
"version": "5.3.4",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -106,5 +106,5 @@
|
|
|
106
106
|
"embla-carousel-fade",
|
|
107
107
|
"popper.js"
|
|
108
108
|
],
|
|
109
|
-
"gitHead": "
|
|
109
|
+
"gitHead": "e57a2b1fb9267040902d0c9b886d14934871307e"
|
|
110
110
|
}
|