@kiva/kv-components 5.3.2 → 5.3.3
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 +56 -56
- package/package.json +2 -2
package/dist/vue/KvLendCta.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.amountDropdownWrapper[data-v-
|
|
1
|
+
.amountDropdownWrapper[data-v-74dcdf98] select{border-radius:14px 0 0 14px}.lend-again[data-v-74dcdf98] span{padding-left:0;padding-right:0;padding-left:.5rem;padding-right:.5rem}.lendButtonWrapper[data-v-74dcdf98] span:first-child{border-radius:0 14px 14px 0}.filtered-dropdown[data-v-74dcdf98] select{cursor:pointer;border-radius:.875rem;border-width:2px;font-weight:500}.unselected-dropdown[data-v-74dcdf98] select{--tw-border-opacity: 1;border-color:rgb(158 158 158 / var(--tw-border-opacity, 1))}.selected-dropdown[data-v-74dcdf98] select{--tw-border-opacity: 1;border-color:rgb(34 56 41 / var(--tw-border-opacity, 1))}.preset-option[data-v-74dcdf98] 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-74dcdf98] 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
|
@@ -4,7 +4,7 @@ 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 p, 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,7 +102,7 @@ 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],
|
|
@@ -110,8 +110,8 @@ const I = {
|
|
|
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 = g(
|
|
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,
|
|
325
|
+
function U(e, s, n, k, f, t) {
|
|
326
326
|
const h = w("kv-ui-button"), L = w("kv-material-icon"), B = 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,25 +367,25 @@ 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
|
-
disabled:
|
|
373
|
+
class: r(["tw-w-full tw-flex", { "tw-flex-col tw-gap-1.5 md:tw-flex-row md:tw-justify-between": n.showPresetAmounts }]),
|
|
374
|
+
disabled: n.isAdding,
|
|
375
375
|
"data-testid": "bp-lend-cta-select-and-button"
|
|
376
376
|
}, [
|
|
377
|
-
|
|
377
|
+
n.showPresetAmounts && !n.isAdding ? (i(), a("div", {
|
|
378
378
|
key: 0,
|
|
379
|
-
class:
|
|
379
|
+
class: r(["tw-flex tw-gap-1 lg:tw-gap-2", { "tw-flex-wrap md:tw-flex-nowrap": n.enableHugeAmount }])
|
|
380
380
|
}, [
|
|
381
|
-
t.isLendAmountButton ? u("", !0) : (i(!0), a(
|
|
381
|
+
t.isLendAmountButton ? u("", !0) : (i(!0), a(p, { key: 0 }, v(t.presetButtonsPrices, (o) => (i(), l(h, {
|
|
382
382
|
key: o,
|
|
383
383
|
variant: "secondary",
|
|
384
|
-
class:
|
|
384
|
+
class: r(["tw-inline-flex tw-flex-1 preset-option tw-w-8", { "selected-option": f.selectedOption == o }]),
|
|
385
385
|
"data-testid": "bp-lend-cta-lend-button",
|
|
386
386
|
onClick: (j) => t.clickPresetButton(o)
|
|
387
387
|
}, {
|
|
388
|
-
default:
|
|
388
|
+
default: d(() => [
|
|
389
389
|
c(" $" + m(o), 1)
|
|
390
390
|
]),
|
|
391
391
|
_: 2
|
|
@@ -395,41 +395,41 @@ function U(e, n, s, k, f, t) {
|
|
|
395
395
|
id: `LoanAmountDropdown_${t.loanId}`,
|
|
396
396
|
modelValue: f.selectedDropdownOption,
|
|
397
397
|
"onUpdate:modelValue": [
|
|
398
|
-
|
|
398
|
+
s[2] || (s[2] = (o) => f.selectedDropdownOption = o),
|
|
399
399
|
t.trackLendAmountSelection
|
|
400
400
|
],
|
|
401
|
-
class:
|
|
401
|
+
class: r(["tw-min-w-12 tw-rounded filtered-dropdown", {
|
|
402
402
|
"unselected-dropdown": !t.selectedDropdown,
|
|
403
403
|
"selected-dropdown": t.selectedDropdown,
|
|
404
|
-
"tw-w-full":
|
|
404
|
+
"tw-w-full": n.enableHugeAmount
|
|
405
405
|
}]),
|
|
406
406
|
"aria-label": "Lend amount",
|
|
407
|
-
onClick:
|
|
407
|
+
onClick: A(t.clickDropdown, ["stop"])
|
|
408
408
|
}, {
|
|
409
|
-
default:
|
|
410
|
-
(i(!0), a(
|
|
409
|
+
default: d(() => [
|
|
410
|
+
(i(!0), a(p, null, v(t.presetDropdownPrices, (o) => (i(), a("option", {
|
|
411
411
|
key: o,
|
|
412
412
|
value: o
|
|
413
413
|
}, m(o !== "Other" ? `$${o}` : o), 9, H))), 128))
|
|
414
414
|
]),
|
|
415
415
|
_: 1
|
|
416
416
|
}, 8, ["id", "modelValue", "class", "onUpdate:modelValue", "onClick"])) : u("", !0)
|
|
417
|
-
], 2)) :
|
|
417
|
+
], 2)) : n.showPresetAmounts ? u("", !0) : (i(), a("div", K, [
|
|
418
418
|
t.hideShowLendDropdown && !t.isLessThan25 ? (i(), l(B, {
|
|
419
419
|
key: 0,
|
|
420
420
|
id: `LoanAmountDropdown_${t.loanId}`,
|
|
421
421
|
modelValue: f.selectedOption,
|
|
422
422
|
"onUpdate:modelValue": [
|
|
423
|
-
|
|
423
|
+
s[3] || (s[3] = (o) => f.selectedOption = o),
|
|
424
424
|
t.trackLendAmountSelection
|
|
425
425
|
],
|
|
426
426
|
class: "tw-min-w-12",
|
|
427
427
|
style: { "border-radius": "14px 0 0 14px" },
|
|
428
428
|
"aria-label": "Lend amount",
|
|
429
|
-
onClick:
|
|
429
|
+
onClick: A(t.clickDropdown, ["stop"])
|
|
430
430
|
}, {
|
|
431
|
-
default:
|
|
432
|
-
(i(!0), a(
|
|
431
|
+
default: d(() => [
|
|
432
|
+
(i(!0), a(p, null, v(t.prices, (o) => (i(), a("option", {
|
|
433
433
|
key: o,
|
|
434
434
|
value: o
|
|
435
435
|
}, " $" + m(o), 9, R))), 128))
|
|
@@ -438,47 +438,47 @@ function U(e, n, s, k, f, t) {
|
|
|
438
438
|
}, 8, ["id", "modelValue", "onUpdate:modelValue", "onClick"])) : u("", !0)
|
|
439
439
|
])),
|
|
440
440
|
y("div", {
|
|
441
|
-
class:
|
|
442
|
-
lendButtonWrapper: t.hideShowLendDropdown && !
|
|
441
|
+
class: r({
|
|
442
|
+
lendButtonWrapper: t.hideShowLendDropdown && !n.showPresetAmounts,
|
|
443
443
|
"tw-hidden": t.hideLendButton
|
|
444
444
|
})
|
|
445
445
|
}, [
|
|
446
446
|
t.lendButtonVisibility && !t.isLessThan25 ? (i(), l(h, {
|
|
447
447
|
key: "lendButton",
|
|
448
|
-
class:
|
|
448
|
+
class: r(["tw-inline-flex tw-flex-1", { "tw-w-full": n.showPresetAmounts }]),
|
|
449
449
|
"data-testid": "bp-lend-cta-lend-button",
|
|
450
450
|
type: "submit"
|
|
451
451
|
}, {
|
|
452
|
-
default:
|
|
452
|
+
default: d(() => [
|
|
453
453
|
c(m(t.ctaButtonText), 1)
|
|
454
454
|
]),
|
|
455
455
|
_: 1
|
|
456
456
|
}, 8, ["class"])) : t.showLendAgain ? (i(), l(h, {
|
|
457
457
|
key: "lendAgainButton",
|
|
458
|
-
class:
|
|
458
|
+
class: r(["lend-again", { "tw-w-full": n.showPresetAmounts }]),
|
|
459
459
|
"data-testid": "bp-lend-cta-lend-again-button",
|
|
460
460
|
type: "submit"
|
|
461
461
|
}, {
|
|
462
|
-
default:
|
|
463
|
-
c(m(
|
|
462
|
+
default: d(() => [
|
|
463
|
+
c(m(n.primaryButtonText || "Lend") + " again ", 1)
|
|
464
464
|
]),
|
|
465
465
|
_: 1
|
|
466
466
|
}, 8, ["class"])) : u("", !0)
|
|
467
467
|
], 2),
|
|
468
|
-
t.isLendAmountButton && !
|
|
468
|
+
t.isLendAmountButton && !n.enableFiveDollarsNotes ? (i(), l(b, {
|
|
469
469
|
key: 2,
|
|
470
470
|
class: "tw-w-full",
|
|
471
471
|
"loan-id": t.loanId,
|
|
472
472
|
"show-now": !1,
|
|
473
473
|
"amount-left": t.unreservedAmount,
|
|
474
|
-
"is-adding":
|
|
474
|
+
"is-adding": n.isAdding,
|
|
475
475
|
onAddToBasket: t.addToBasket
|
|
476
476
|
}, null, 8, ["loan-id", "amount-left", "is-adding", "onAddToBasket"])) : u("", !0),
|
|
477
|
-
!
|
|
477
|
+
!n.isLoading && n.isAdding ? (i(), l(h, {
|
|
478
478
|
key: 3,
|
|
479
479
|
class: "tw-inline-flex tw-flex-1"
|
|
480
480
|
}, {
|
|
481
|
-
default:
|
|
481
|
+
default: d(() => s[6] || (s[6] = [
|
|
482
482
|
c(" Adding to basket ")
|
|
483
483
|
])),
|
|
484
484
|
_: 1
|
|
@@ -487,7 +487,7 @@ function U(e, n, s, k, f, t) {
|
|
|
487
487
|
], 32)) : u("", !0)
|
|
488
488
|
]);
|
|
489
489
|
}
|
|
490
|
-
const Z = /* @__PURE__ */ F(I, [["render", U], ["__scopeId", "data-v-
|
|
490
|
+
const Z = /* @__PURE__ */ F(I, [["render", U], ["__scopeId", "data-v-74dcdf98"]]);
|
|
491
491
|
export {
|
|
492
492
|
Z as default
|
|
493
493
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kiva/kv-components",
|
|
3
|
-
"version": "5.3.
|
|
3
|
+
"version": "5.3.3",
|
|
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": "ac1cad8ab1ea6d9d1274b97cf61febb26261d371"
|
|
110
110
|
}
|