@kiva/kv-components 8.0.1 → 8.1.0

package/dist/vue/KvCompactLoanCard2.js

@@ -1,23 +1,21 @@
-import n from "graphql-tag";
-import h from "numeral";
-import { computed as M } from "vue";
-import { mdiMapMarker as b, mdiHome as F, mdiLink as E } from "@mdi/js";
-import { LOAN_CALLOUTS_FRAGMENT as O, LOAN_GEOCODE_FRAGMENT as R, LOAN_PROGRESS_FRAGMENT as S, loanCardComputedProperties as G, loanCardMethods as P } from "../utils/loanCard.js";
-import w from "./KvLoanUse.js";
-import D from "./KvBorrowerImage.js";
-import U from "./KvLoanCallouts.js";
-import $ from "./KvLendCta.js";
-import V from "./KvLoanBookmark.js";
+import r from "graphql-tag";
+import w from "numeral";
+import { computed as n } from "vue";
+import { mdiMapMarker as F, mdiHome as M, mdiLink as S, mdiClose as E } from "@mdi/js";
+import { LOAN_CALLOUTS_FRAGMENT as R, LOAN_GEOCODE_FRAGMENT as O, LOAN_PROGRESS_FRAGMENT as G, loanCardComputedProperties as P, loanCardMethods as V } from "../utils/loanCard.js";
+import D from "./KvLoanUse.js";
+import U from "./KvBorrowerImage.js";
+import $ from "./KvLoanCallouts.js";
+import W from "./KvLendCta.js";
 import I from "./KvLoanProgressGroup.js";
-import W from "./KvLoanTag.js";
-import x from "./KvMaterialIcon.js";
-import H from "./KvLoadingPlaceholder.js";
+import x from "./KvLoanTag.js";
+import H from "./KvMaterialIcon.js";
+import j from "./KvLoadingPlaceholder.js";
 import q from "./KvLoanTeamPick.js";
-import { KV_LEND_CTA_FRAGMENT as j, KV_LEND_CTA_USER_FRAGMENT as z } from "./KvLendCta2.js";
-import { KV_LOAN_TAG_FRAGMENT as J } from "./KvLoanTag2.js";
-import { KV_LOAN_USE_FRAGMENT as Q } from "./KvLoanUse2.js";
-import { KV_LOAN_BOOKMARK_FRAGMENT as X } from "./KvLoanBookmark2.js";
-const Ae = n`
+import { KV_LEND_CTA_FRAGMENT as z, KV_LEND_CTA_USER_FRAGMENT as J } from "./KvLendCta2.js";
+import { KV_LOAN_TAG_FRAGMENT as Q } from "./KvLoanTag2.js";
+import { KV_LOAN_USE_FRAGMENT as X } from "./KvLoanUse2.js";
+const Ce = r`
 	fragment KvCompactLoanCard on LoanBasic {
 		id
 		image {
@@ -39,31 +37,28 @@ const Ae = n`
 		...LoanGeocode
 		...LoanProgress
 	}
-	${j}
-	${J}
+	${z}
 	${Q}
-	${O}
+	${X}
 	${R}
-	${S}
-`, Ce = n`
+	${O}
+	${G}
+`, ge = r`
 	fragment KvCompactLoanCardUser on LoanBasic {
 		id
 		...KvLendCtaUser
-		...KvLoanBookmark
 	}
-	${z}
-	${X}
-`, _e = {
+	${J}
+`, he = {
   name: "KvCompactLoanCard",
   components: {
-    KvBorrowerImage: D,
-    KvLoadingPlaceholder: H,
-    KvLoanUse: w,
-    KvMaterialIcon: x,
-    KvLendCta: $,
-    KvLoanTag: W,
-    KvLoanCallouts: U,
-    KvLoanBookmark: V,
+    KvBorrowerImage: U,
+    KvLoadingPlaceholder: j,
+    KvLoanUse: D,
+    KvMaterialIcon: H,
+    KvLendCta: W,
+    KvLoanTag: x,
+    KvLoanCallouts: $,
     KvLoanTeamPick: q,
     KvLoanProgressGroup: I
   },
@@ -104,10 +99,6 @@ const Ae = n`
       type: Array,
       default: () => []
     },
-    isBookmarked: {
-      type: Boolean,
-      default: !1
-    },
     kvTrackFunction: {
       type: Function,
       required: !0
@@ -187,67 +178,97 @@ const Ae = n`
     showLoanUse: {
       type: Boolean,
       default: !0
+    },
+    showLightView: {
+      type: Boolean,
+      default: !1
+    },
+    truncateWordsNumber: {
+      type: Number,
+      default: 0
+    },
+    showCloseButton: {
+      type: Boolean,
+      default: !1
+    },
+    customAmountLent: {
+      type: String,
+      default: "25"
     }
   },
+  emits: [
+    "close-button",
+    "jump-filter-page",
+    "add-to-basket",
+    "remove-from-basket"
+  ],
   setup(e, { emit: t }) {
     const {
-      allDataLoaded: o,
-      borrowerName: r,
+      allDataLoaded: a,
+      borrowerName: l,
       city: i,
-      countryName: l,
-      distributionModel: s,
-      formattedLocation: u,
-      fundraisingPercent: d,
-      hasProgressData: m,
-      imageHash: f,
+      countryName: s,
+      distributionModel: u,
+      formattedLocation: d,
+      fundraisingPercent: m,
+      hasProgressData: f,
+      imageHash: c,
       isLoading: p,
-      loanAmount: c,
-      loanBorrowerCount: L,
-      loanCallouts: y,
-      loanStatus: A,
-      loanUse: C,
-      readMorePath: _,
-      state: g,
+      loanAmount: L,
+      loanBorrowerCount: y,
+      loanCallouts: C,
+      loanStatus: g,
+      loanUse: h,
+      readMorePath: A,
+      state: _,
       tag: N,
-      unreservedAmount: K,
+      unreservedAmount: b,
       sharesAvailable: B
-    } = G(e), {
+    } = P(e), {
       clickReadMore: T
-    } = P(e, t), k = () => {
-      e.kvTrackFunction("Lending", "click-Business Website", "Website", e.loanId);
-    }, v = M(() => {
+    } = V(e, t), v = n(() => {
       if (!e.website)
         return "";
-      const a = e.website.trim();
-      return a.startsWith("http://") || a.startsWith("https://") ? a : `https://${a}`;
+      const o = e.website.trim();
+      return o.startsWith("http://") || o.startsWith("https://") ? o : `https://${o}`;
+    }), k = n(() => {
+      const o = e.showLightView ? "auto" : "6.75rem", K = e.showLightView ? "none" : "6.75rem";
+      return { height: o, maxHeight: K };
     });
     return {
-      allDataLoaded: o,
-      borrowerName: r,
+      allDataLoaded: a,
+      borrowerName: l,
       city: i,
-      countryName: l,
-      distributionModel: s,
-      formattedLocation: u,
+      countryName: s,
+      distributionModel: u,
+      formattedLocation: d,
       formattedWebsite: v,
-      fundraisingPercent: d,
-      hasProgressData: m,
-      imageHash: f,
+      fundraisingPercent: m,
+      hasProgressData: f,
+      imageHash: c,
       isLoading: p,
-      loanAmount: c,
-      loanBorrowerCount: L,
-      loanCallouts: y,
-      loanStatus: A,
-      loanUse: C,
-      mdiMapMarker: b,
-      mdiHome: F,
-      mdiLink: E,
-      readMorePath: _,
-      state: g,
+      loanAmount: L,
+      loanBorrowerCount: y,
+      loanCallouts: C,
+      loanStatus: g,
+      loanUse: h,
+      mdiMapMarker: F,
+      mdiHome: M,
+      mdiLink: S,
+      mdiClose: E,
+      readMorePath: A,
+      state: _,
       tag: N,
-      unreservedAmount: K,
+      unreservedAmount: b,
       sharesAvailable: B,
+      customStyle: k,
       clickReadMore: T,
-      trackWebsiteClick: k
+      trackWebsiteClick: () => {
+        e.kvTrackFunction("Lending", "click-Business Website", "Website", e.loanId);
+      },
+      handleCloseButton: (o) => {
+        t("close-button", o);
+      }
     };
   },
   computed: {
@@ -256,14 +277,14 @@ const Ae = n`
       return ((t = (e = this.loan) == null ? void 0 : e.lenders) == null ? void 0 : t.totalCount) ?? 0;
     },
     amountLent() {
-      var t, o;
-      const e = ((o = (t = this.loan) == null ? void 0 : t.loanFundraisingInfo) == null ? void 0 : o.fundedAmount) ?? 0;
-      return h(e).format("$0,0");
+      var t, a;
+      const e = ((a = (t = this.loan) == null ? void 0 : t.loanFundraisingInfo) == null ? void 0 : a.fundedAmount) ?? 0;
+      return w(e).format("$0,0");
     }
   }
 };
 export {
-  Ae as KV_COMPACT_LOAN_CARD_FRAGMENT,
-  Ce as KV_COMPACT_LOAN_CARD_USER_FRAGMENT,
-  _e as default
+  Ce as KV_COMPACT_LOAN_CARD_FRAGMENT,
+  ge as KV_COMPACT_LOAN_CARD_USER_FRAGMENT,
+  he as default
 };

package/dist/vue/KvIntroductionLoanCard.vue.d.ts

@@ -274,6 +274,14 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             type: BooleanConstructor;
             default: boolean;
         };
+        showReadMore: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        truncateWordsNumber: {
+            type: NumberConstructor;
+            default: number;
+        };
     }>, {}, {}, {
         helpLanguage(): "helps" | "helped";
         isDirect(): boolean;
@@ -329,6 +337,14 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             type: BooleanConstructor;
             default: boolean;
         };
+        showReadMore: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        truncateWordsNumber: {
+            type: NumberConstructor;
+            default: number;
+        };
     }>> & Readonly<{}>, {
         name: string;
         use: string;
@@ -342,6 +358,8 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         boldName: boolean;
         country: string;
         useIndicativeHelpText: boolean;
+        showReadMore: boolean;
+        truncateWordsNumber: number;
     }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
     KvLoanProgressGroup: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
         moneyLeft: {

package/dist/vue/KvLendCta.css

@@ -1 +1 @@
-.amountDropdownWrapper[data-v-a90ed7f0] select{border-radius:14px 0 0 14px}.lend-again[data-v-a90ed7f0] span{padding-left:.5rem;padding-right:.5rem}.lendButtonWrapper[data-v-a90ed7f0] span:first-child{border-radius:0 14px 14px 0}.filtered-dropdown[data-v-a90ed7f0] select{cursor:pointer;border-radius:1rem;border-width:2px;font-weight:500}.unselected-dropdown[data-v-a90ed7f0] select{--tw-border-opacity: 1;border-color:rgb(158 158 158 / var(--tw-border-opacity, 1))}.preset-option[data-v-a90ed7f0] 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-dropdown[data-v-a90ed7f0] select,.selected-option[data-v-a90ed7f0] span.tw-w-full:first-child{--tw-border-opacity: 1;border-color:rgba(var(--border-action),var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgba(var(--bg-secondary),var(--tw-bg-opacity, 1))}.button-ellipsis[data-v-a90ed7f0] span>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (max-width: 410px){.mobile-dropdown-small[data-v-a90ed7f0]{flex:0 0 40%}}
+.amountDropdownWrapper[data-v-fd7506ce] select{border-radius:14px 0 0 14px!important}.lend-again[data-v-fd7506ce] span{padding-left:.5rem;padding-right:.5rem}.lendButtonWrapper[data-v-fd7506ce] span:first-child{border-radius:0 14px 14px 0}.filtered-dropdown[data-v-fd7506ce] select{cursor:pointer;border-radius:1rem;border-width:2px;font-weight:500}.unselected-dropdown[data-v-fd7506ce] select{--tw-border-opacity: 1;border-color:rgb(158 158 158 / var(--tw-border-opacity, 1))}.preset-option[data-v-fd7506ce] 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-dropdown[data-v-fd7506ce] select,.selected-option[data-v-fd7506ce] span.tw-w-full:first-child{--tw-border-opacity: 1;border-color:rgba(var(--border-action),var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgba(var(--bg-secondary),var(--tw-bg-opacity, 1))}.button-ellipsis[data-v-fd7506ce] span>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (max-width: 410px){.mobile-dropdown-small[data-v-fd7506ce]{flex:0 0 40%}}

package/dist/vue/KvLendCta.js

@@ -1,6 +1,6 @@
 import P from "./KvLendCta2.js";
 import { KV_LEND_CTA_FRAGMENT as oe, KV_LEND_CTA_USER_FRAGMENT as se } from "./KvLendCta2.js";
-import { resolveComponent as A, openBlock as l, createElementBlock as s, createBlock as a, withCtx as w, createTextVNode as f, toDisplayString as r, createElementVNode as c, createVNode as b, withModifiers as D, normalizeClass as u, Fragment as k, renderList as _, createCommentVNode as i } from "vue";
+import { resolveComponent as A, openBlock as l, createElementBlock as s, createBlock as r, withCtx as w, createTextVNode as f, toDisplayString as a, createElementVNode as c, createVNode as b, withModifiers as D, normalizeClass as u, Fragment as k, renderList as _, createCommentVNode as i } from "vue";
 import "./KvLendCta.css";
 import y from "../_virtual/_plugin-vue_export-helper.js";
 const N = {
@@ -13,7 +13,7 @@ const N = {
 }, T = { class: "tw-flex tw-items-center" }, V = ["disabled"], O = {
   key: 0,
   class: "md:tw-hidden tw-w-full"
-}, R = { class: "tw-flex tw-flex-col tw-gap-1 tw-w-full" }, C = { class: "tw-flex tw-gap-1 tw-w-full" }, I = ["value"], E = { class: "tw-flex tw-gap-1" }, S = ["value"], p = { class: "tw-flex tw-items-center tw-h-full tw-w-full" }, W = { class: "tw-min-w-0 tw-flex-1 tw-overflow-hidden tw-text-ellipsis tw-whitespace-nowrap" }, F = {
+}, R = { class: "tw-flex tw-flex-col tw-gap-1 tw-w-full" }, C = { class: "tw-flex tw-gap-1 tw-w-full" }, I = ["value"], E = { class: "tw-flex tw-gap-1" }, p = ["value"], S = { class: "tw-flex tw-items-center tw-h-full tw-w-full" }, W = { class: "tw-min-w-0 tw-flex-1 tw-overflow-hidden tw-text-ellipsis tw-whitespace-nowrap" }, F = {
   key: 1,
   class: "tw-w-full"
 }, U = { class: "tw-flex tw-flex-col tw-gap-1 tw-w-full" }, M = { class: "tw-flex tw-gap-1 tw-w-full" }, K = ["value"], H = { class: "tw-flex tw-gap-1" }, j = ["value"], G = { class: "tw-flex tw-items-center tw-h-full tw-w-full" }, z = { class: "tw-min-w-0 tw-flex-1 tw-overflow-hidden tw-text-ellipsis tw-whitespace-nowrap" }, q = ["value"], J = {
@@ -23,33 +23,33 @@ const N = {
 function X(B, o, n, Y, d, e) {
   const m = A("kv-ui-button"), v = A("kv-material-icon"), h = A("kv-ui-select"), L = A("kv-lend-amount-button");
   return l(), s("div", N, [
-    e.isInBasket ? (l(), a(m, {
+    e.isInBasket ? (l(), r(m, {
       key: 0,
       variant: "secondary",
-      class: "tw-inline-flex tw-flex-1 tw-w-full",
+      class: "tw-inline-flex tw-flex-1 tw-w-full tw-cursor-pointer",
       "data-testid": "bp-lend-cta-checkout-button",
       to: n.externalLinks ? void 0 : "/basket",
       href: n.externalLinks ? "/basket" : void 0,
       onClick: o[0] || (o[0] = (t) => e.clickSecondaryButton(t))
     }, {
       default: w(() => [
-        f(r(e.loanInBasketButtonText), 1)
+        f(a(e.loanInBasketButtonText), 1)
       ]),
       _: 1
-    }, 8, ["to", "href"])) : e.showNonActionableLoanButton ? (l(), a(m, {
+    }, 8, ["to", "href"])) : e.showNonActionableLoanButton ? (l(), r(m, {
       key: 1,
       class: "tw-inline-flex tw-flex-1"
     }, {
       default: w(() => [
-        f(r(e.ctaButtonText), 1)
+        f(a(e.ctaButtonText), 1)
       ]),
       _: 1
-    })) : e.isFunded ? (l(), s("div", g, " This loan was just funded! 🎉 ")) : n.showViewLoan ? (l(), a(m, {
+    })) : e.isFunded ? (l(), s("div", g, " This loan was just funded! 🎉 ")) : n.showViewLoan ? (l(), r(m, {
       key: 3,
       state: `${e.allSharesReserved ? "disabled" : ""}`,
       to: n.externalLinks ? void 0 : e.readMorePath,
       href: n.externalLinks ? e.readMorePath : void 0,
-      class: "tw-mb-0",
+      class: "tw-mb-0 tw-cursor-pointer",
       onClick: o[1] || (o[1] = (t) => B.$emit("show-loan-details", t))
     }, {
       default: w(() => [
@@ -79,7 +79,7 @@ function X(B, o, n, Y, d, e) {
         n.showPresetAmounts && !n.isAdding && !e.isLendAmountButton && e.presetButtonsPrices.length > 1 && !e.isNarrowDesktop ? (l(), s("div", O, [
           c("div", R, [
             c("div", C, [
-              (l(!0), s(k, null, _(e.presetButtonsPrices, (t) => (l(), a(m, {
+              (l(!0), s(k, null, _(e.presetButtonsPrices, (t) => (l(), r(m, {
                 key: t,
                 variant: "secondary",
                 class: u(["preset-option tw-flex-1 tw-min-w-0 tw-whitespace-nowrap", { "selected-option": d.selectedOption == t }]),
@@ -87,11 +87,11 @@ function X(B, o, n, Y, d, e) {
                 onClick: (x) => e.clickPresetButton(t)
               }, {
                 default: w(() => [
-                  f(" $ " + r(t), 1)
+                  f(" $ " + a(t), 1)
                 ]),
                 _: 2
               }, 1032, ["class", "onClick"]))), 128)),
-              e.showFilteredDropdown && d.viewportWidth >= d.MOBILE_DROPDOWN_BREAKPOINT ? (l(), a(h, {
+              e.showFilteredDropdown && d.viewportWidth >= d.MOBILE_DROPDOWN_BREAKPOINT ? (l(), r(h, {
                 key: 0,
                 id: `LoanAmountDropdownMobile_${e.loanId}`,
                 modelValue: d.selectedDropdownOption,
@@ -110,13 +110,13 @@ function X(B, o, n, Y, d, e) {
                   (l(!0), s(k, null, _(e.presetDropdownPrices, (t) => (l(), s("option", {
                     key: t,
                     value: t
-                  }, r(t !== d.OTHER_OPTION ? `$${t}` : t), 9, I))), 128))
+                  }, a(t !== d.OTHER_OPTION ? `$${t}` : t), 9, I))), 128))
                 ]),
                 _: 1
               }, 8, ["id", "modelValue", "class", "onUpdate:modelValue", "onClick"])) : i("", !0)
             ]),
             c("div", E, [
-              e.showFilteredDropdown && d.viewportWidth < d.MOBILE_DROPDOWN_BREAKPOINT ? (l(), a(h, {
+              e.showFilteredDropdown && d.viewportWidth < d.MOBILE_DROPDOWN_BREAKPOINT ? (l(), r(h, {
                 key: 0,
                 id: `LoanAmountDropdownMobile_Small_${e.loanId}`,
                 modelValue: d.selectedDropdownOption,
@@ -135,7 +135,7 @@ function X(B, o, n, Y, d, e) {
                   (l(!0), s(k, null, _(e.presetDropdownPrices, (t) => (l(), s("option", {
                     key: "small-" + t,
                     value: t
-                  }, r(t !== d.OTHER_OPTION ? `$${t}` : t), 9, S))), 128))
+                  }, a(t !== d.OTHER_OPTION ? `$${t}` : t), 9, p))), 128))
                 ]),
                 _: 1
               }, 8, ["id", "modelValue", "class", "onUpdate:modelValue", "onClick"])) : i("", !0),
@@ -145,8 +145,8 @@ function X(B, o, n, Y, d, e) {
                 type: "submit"
               }, {
                 default: w(() => [
-                  c("span", p, [
-                    c("span", W, r(e.ctaButtonText), 1)
+                  c("span", S, [
+                    c("span", W, a(e.ctaButtonText), 1)
                   ])
                 ]),
                 _: 1
@@ -157,7 +157,7 @@ function X(B, o, n, Y, d, e) {
         n.showPresetAmounts && !n.isAdding && !e.isLendAmountButton && e.presetButtonsPrices.length > 1 && e.isNarrowDesktop ? (l(), s("div", F, [
           c("div", U, [
             c("div", M, [
-              (l(!0), s(k, null, _(e.presetButtonsPrices, (t) => (l(), a(m, {
+              (l(!0), s(k, null, _(e.presetButtonsPrices, (t) => (l(), r(m, {
                 key: t,
                 variant: "secondary",
                 class: u(["preset-option tw-flex-1 tw-min-w-0 tw-whitespace-nowrap", { "selected-option": d.selectedOption == t }]),
@@ -165,11 +165,11 @@ function X(B, o, n, Y, d, e) {
                 onClick: (x) => e.clickPresetButton(t)
               }, {
                 default: w(() => [
-                  f(" $ " + r(t), 1)
+                  f(" $ " + a(t), 1)
                 ]),
                 _: 2
               }, 1032, ["class", "onClick"]))), 128)),
-              e.showFilteredDropdown && d.componentWidth >= d.NARROW_SIDEBAR_DROPDOWN_BREAKPOINT ? (l(), a(h, {
+              e.showFilteredDropdown && d.componentWidth >= d.NARROW_SIDEBAR_DROPDOWN_BREAKPOINT ? (l(), r(h, {
                 key: 0,
                 id: `LoanAmountDropdownNarrowDesktop_${e.loanId}`,
                 modelValue: d.selectedDropdownOption,
@@ -188,13 +188,13 @@ function X(B, o, n, Y, d, e) {
                   (l(!0), s(k, null, _(e.presetDropdownPrices, (t) => (l(), s("option", {
                     key: t,
                     value: t
-                  }, r(t !== d.OTHER_OPTION ? `${t}` : t), 9, K))), 128))
+                  }, a(t !== d.OTHER_OPTION ? `${t}` : t), 9, K))), 128))
                 ]),
                 _: 1
               }, 8, ["id", "modelValue", "class", "onUpdate:modelValue", "onClick"])) : i("", !0)
             ]),
             c("div", H, [
-              e.showFilteredDropdown && d.componentWidth < d.NARROW_SIDEBAR_DROPDOWN_BREAKPOINT ? (l(), a(h, {
+              e.showFilteredDropdown && d.componentWidth < d.NARROW_SIDEBAR_DROPDOWN_BREAKPOINT ? (l(), r(h, {
                 key: 0,
                 id: `LoanAmountDropdownNarrowDesktop_Small_${e.loanId}`,
                 modelValue: d.selectedDropdownOption,
@@ -213,7 +213,7 @@ function X(B, o, n, Y, d, e) {
                   (l(!0), s(k, null, _(e.presetDropdownPrices, (t) => (l(), s("option", {
                     key: "narrow-small-" + t,
                     value: t
-                  }, r(t !== d.OTHER_OPTION ? `${t}` : t), 9, j))), 128))
+                  }, a(t !== d.OTHER_OPTION ? `${t}` : t), 9, j))), 128))
                 ]),
                 _: 1
               }, 8, ["id", "modelValue", "class", "onUpdate:modelValue", "onClick"])) : i("", !0),
@@ -224,7 +224,7 @@ function X(B, o, n, Y, d, e) {
               }, {
                 default: w(() => [
                   c("span", G, [
-                    c("span", z, r(e.ctaButtonText), 1)
+                    c("span", z, a(e.ctaButtonText), 1)
                   ])
                 ]),
                 _: 1
@@ -239,7 +239,7 @@ function X(B, o, n, Y, d, e) {
             "tw-hidden md:tw-flex": !e.isLendAmountButton && e.presetButtonsPrices.length > 1
           })
         }, [
-          e.isLendAmountButton ? i("", !0) : (l(!0), s(k, { key: 0 }, _(e.presetButtonsPrices, (t) => (l(), a(m, {
+          e.isLendAmountButton ? i("", !0) : (l(!0), s(k, { key: 0 }, _(e.presetButtonsPrices, (t) => (l(), r(m, {
             key: t,
             variant: "secondary",
             class: u(["tw-inline-flex tw-flex-1 preset-option tw-w-8 tw-whitespace-nowrap", { "selected-option": d.selectedOption == t }]),
@@ -247,11 +247,11 @@ function X(B, o, n, Y, d, e) {
             onClick: (x) => e.clickPresetButton(t)
           }, {
             default: w(() => [
-              f(" $" + r(t), 1)
+              f(" $" + a(t), 1)
             ]),
             _: 2
           }, 1032, ["class", "onClick"]))), 128)),
-          e.showFilteredDropdown ? (l(), a(h, {
+          e.showFilteredDropdown ? (l(), r(h, {
             key: 1,
             id: `LoanAmountDropdown_${e.loanId}`,
             modelValue: d.selectedDropdownOption,
@@ -270,12 +270,12 @@ function X(B, o, n, Y, d, e) {
               (l(!0), s(k, null, _(e.presetDropdownPrices, (t) => (l(), s("option", {
                 key: t,
                 value: t
-              }, r(t !== d.OTHER_OPTION ? `$${t}` : t), 9, q))), 128))
+              }, a(t !== d.OTHER_OPTION ? `$${t}` : t), 9, q))), 128))
             ]),
             _: 1
           }, 8, ["id", "modelValue", "class", "onUpdate:modelValue", "onClick"])) : i("", !0)
         ], 2)) : n.showPresetAmounts ? i("", !0) : (l(), s("div", J, [
-          e.hideShowLendDropdown && !e.isLessThan25 ? (l(), a(h, {
+          e.hideShowLendDropdown && !e.isLessThan25 ? (l(), r(h, {
             key: 0,
             id: `LoanAmountDropdown_${e.loanId}`,
             modelValue: d.selectedOption,
@@ -292,7 +292,7 @@ function X(B, o, n, Y, d, e) {
               (l(!0), s(k, null, _(e.prices, (t) => (l(), s("option", {
                 key: t,
                 value: t
-              }, " $" + r(t), 9, Q))), 128))
+              }, " $" + a(t), 9, Q))), 128))
             ]),
             _: 1
           }, 8, ["id", "modelValue", "onUpdate:modelValue", "onClick"])) : i("", !0)
@@ -305,29 +305,29 @@ function X(B, o, n, Y, d, e) {
             "md:tw-block tw-hidden": !e.isLendAmountButton && e.presetButtonsPrices.length > 1 && n.showPresetAmounts && !e.isNarrowDesktop
           })
         }, [
-          e.lendButtonVisibility && !e.isLessThan25 ? (l(), a(m, {
+          e.lendButtonVisibility && !e.isLessThan25 ? (l(), r(m, {
             key: "lendButton",
             class: u(["tw-inline-flex tw-flex-1", { "button-ellipsis tw-w-full": n.showPresetAmounts }]),
             "data-testid": "bp-lend-cta-lend-button",
             type: "submit"
           }, {
             default: w(() => [
-              f(r(e.ctaButtonText), 1)
+              f(a(e.ctaButtonText), 1)
             ]),
             _: 1
-          }, 8, ["class"])) : e.showLendAgain ? (l(), a(m, {
+          }, 8, ["class"])) : e.showLendAgain ? (l(), r(m, {
             key: "lendAgainButton",
             class: u(["lend-again", { "tw-w-full": n.showPresetAmounts }]),
             "data-testid": "bp-lend-cta-lend-again-button",
             type: "submit"
           }, {
             default: w(() => [
-              f(r(n.primaryButtonText || "Lend") + " again ", 1)
+              f(a(n.primaryButtonText || "Lend") + " again ", 1)
             ]),
             _: 1
           }, 8, ["class"])) : i("", !0)
         ], 2),
-        e.isLendAmountButton && !n.enableFiveDollarsNotes ? (l(), a(L, {
+        e.isLendAmountButton && !n.enableFiveDollarsNotes ? (l(), r(L, {
           key: 4,
           class: "tw-w-full",
           "loan-id": e.loanId,
@@ -336,7 +336,7 @@ function X(B, o, n, Y, d, e) {
           "is-adding": n.isAdding,
           onAddToBasket: e.addToBasket
         }, null, 8, ["loan-id", "amount-left", "is-adding", "onAddToBasket"])) : i("", !0),
-        !n.isLoading && n.isAdding ? (l(), a(m, {
+        !n.isLoading && n.isAdding ? (l(), r(m, {
           key: 5,
           class: "tw-inline-flex tw-flex-1"
         }, {
@@ -349,7 +349,7 @@ function X(B, o, n, Y, d, e) {
     ], 32)) : i("", !0)
   ], 512);
 }
-const le = /* @__PURE__ */ y(P, [["render", X], ["__scopeId", "data-v-a90ed7f0"]]);
+const le = /* @__PURE__ */ y(P, [["render", X], ["__scopeId", "data-v-fd7506ce"]]);
 export {
   oe as KV_LEND_CTA_FRAGMENT,
   se as KV_LEND_CTA_USER_FRAGMENT,

package/dist/vue/KvLoanUse.vue.d.ts

@@ -48,6 +48,14 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         type: BooleanConstructor;
         default: boolean;
     };
+    showReadMore: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    truncateWordsNumber: {
+        type: NumberConstructor;
+        default: number;
+    };
 }>, {}, {}, {
     helpLanguage(): "helps" | "helped";
     isDirect(): boolean;
@@ -103,6 +111,14 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         type: BooleanConstructor;
         default: boolean;
     };
+    showReadMore: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    truncateWordsNumber: {
+        type: NumberConstructor;
+        default: number;
+    };
 }>> & Readonly<{}>, {
     name: string;
     use: string;
@@ -116,5 +132,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     boldName: boolean;
     country: string;
     useIndicativeHelpText: boolean;
+    showReadMore: boolean;
+    truncateWordsNumber: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 export default _default;