@kiva/kv-components 8.0.1 → 8.1.0

package/dist/vue/KvLoanUse2.js

@@ -1,6 +1,7 @@
-import s from "graphql-tag";
-import i from "numeral";
-const t = "direct", l = s`
+import r from "graphql-tag";
+import o from "numeral";
+import { truncateStringByWords as a } from "../utils/loanUtils.js";
+const n = "direct", d = r`
 	fragment KvLoanUse on LoanBasic {
 		id
 		anonymizationLevel
@@ -12,7 +13,7 @@ const t = "direct", l = s`
 		distributionModel
 		whySpecial
 	}
-`, u = {
+`, m = {
   name: "KvLoanUse",
   props: {
     anonymizationLevel: {
@@ -41,7 +42,7 @@ const t = "direct", l = s`
     },
     distributionModel: {
       type: String,
-      default: t
+      default: n
     },
     whySpecial: {
       type: String,
@@ -62,6 +63,14 @@ const t = "direct", l = s`
     useIndicativeHelpText: {
       type: Boolean,
       default: !1
+    },
+    showReadMore: {
+      type: Boolean,
+      default: !1
+    },
+    truncateWordsNumber: {
+      type: Number,
+      default: 0
     }
   },
   computed: {
@@ -69,7 +78,7 @@ const t = "direct", l = s`
       return this.status === "fundraising" || this.status === "inactive" || this.status === "reviewed" ? "helps" : "helped";
     },
     isDirect() {
-      return this.distributionModel === t;
+      return this.distributionModel === n;
     },
     whySpecialSentence() {
       return this.whySpecial ? ` This loan is special because ${this.whySpecial.charAt(0).toLowerCase() + this.whySpecial.slice(1)}` : "";
@@ -81,15 +90,17 @@ const t = "direct", l = s`
       if (this.anonymizationLevel === "full" || this.use.length === 0)
         return "For the borrower's privacy, this loan has been made anonymous.";
       if (this.hideLoanAmount) {
-        const e = this.useIndicativeHelpText ? this.helpLanguage : "Help";
-        return `${e.charAt(0).toUpperCase() + e.slice(1)} ${this.nameSpan} ${this.use.charAt(0).toLowerCase() + this.use.slice(1)} ${this.whySpecialSentence}`;
+        const t = this.useIndicativeHelpText ? this.helpLanguage : "Help";
+        let s = `${t.charAt(0).toUpperCase() + t.slice(1)} ${this.nameSpan} ${this.use.charAt(0).toLowerCase() + this.use.slice(1)} ${this.whySpecialSentence}`;
+        return this.showReadMore && (s = `${a(s, this.truncateWordsNumber)} <span class=" tw-text-action tw-underline">read more</span>`), s;
       }
-      const a = this.borrowerCount > 1;
-      return `${i(this.loanAmount).format("$0,0")} ${this.isDirect ? "to" : this.helpLanguage} ${a ? "a member of " : ""}${this.nameSpan} ${this.isDirect ? `${this.helpLanguage} ` : ""}${this.use.charAt(0).toLowerCase() + this.use.slice(1)}${this.whySpecialSentence}`;
+      const i = this.borrowerCount > 1;
+      let e = `${o(this.loanAmount).format("$0,0")} ${this.isDirect ? "to" : this.helpLanguage} ${i ? "a member of " : ""}${this.nameSpan} ${this.isDirect ? `${this.helpLanguage} ` : ""}${this.use.charAt(0).toLowerCase() + this.use.slice(1)}${this.whySpecialSentence}`;
+      return this.showReadMore && (e = `${a(e, this.truncateWordsNumber)} <span class=" tw-text-action tw-underline">read more</span>`), e;
     }
   }
 };
 export {
-  l as KV_LOAN_USE_FRAGMENT,
-  u as default
+  d as KV_LOAN_USE_FRAGMENT,
+  m as default
 };

package/dist/vue/KvWideLoanCard.vue.d.ts

@@ -335,6 +335,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;
@@ -390,6 +398,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;
@@ -403,6 +419,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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kiva/kv-components",
-  "version": "8.0.1",
+  "version": "8.1.0",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -125,5 +125,5 @@
     "embla-carousel-fade",
     "popper.js"
   ],
-  "gitHead": "af1fc57775a90ad1b0a11069fc84bcc4ab1e2031"
+  "gitHead": "75f4f4a2021b1484059f86d7d76eaa6322f25d5c"
 }