@kiva/kv-components 6.13.2 → 6.14.0

package/dist/vue/KvIntroductionLoanCard.js

@@ -1,29 +1,65 @@
-import D from "numeral";
-import { loanCardComputedProperties as W, loanCardMethods as I } from "../utils/loanCard.js";
-import R from "./KvLoanBookmark.js";
-import V from "./KvLoanUse.js";
-import j from "./KvBorrowerImage.js";
-import T from "./KvLoanProgressGroup.js";
-import U from "./KvLoanCallouts.js";
-import q from "./KvLoanTag.js";
-import E from "./KvMaterialIcon.js";
-import H from "./KvLoadingPlaceholder.js";
-import O from "./KvFlag.js";
-import { resolveComponent as m, openBlock as t, createElementBlock as d, normalizeClass as L, normalizeStyle as G, createElementVNode as c, createBlock as a, resolveDynamicComponent as f, withCtx as h, createVNode as s, Suspense as J, createTextVNode as Q, toDisplayString as P, createCommentVNode as u, Fragment as X, renderList as Y } from "vue";
+import A from "graphql-tag";
+import E from "numeral";
+import { LOAN_CALLOUTS_FRAGMENT as I, LOAN_GEOCODE_FRAGMENT as G, LOAN_PROGRESS_FRAGMENT as U, loanCardComputedProperties as V, loanCardMethods as z } from "../utils/loanCard.js";
+import W, { KV_LOAN_BOOKMARK_FRAGMENT as M } from "./KvLoanBookmark.js";
+import j, { KV_LOAN_USE_FRAGMENT as q } from "./KvLoanUse.js";
+import H from "./KvBorrowerImage.js";
+import J from "./KvLoanProgressGroup.js";
+import Q from "./KvLoanCallouts.js";
+import X, { KV_LOAN_TAG_FRAGMENT as Y } from "./KvLoanTag.js";
+import Z from "./KvMaterialIcon.js";
+import $ from "./KvLoadingPlaceholder.js";
+import ee from "./KvFlag.js";
+import { resolveComponent as m, openBlock as t, createElementBlock as s, normalizeClass as x, normalizeStyle as te, createElementVNode as c, createBlock as a, resolveDynamicComponent as f, withCtx as h, createVNode as d, Suspense as oe, createTextVNode as ae, toDisplayString as N, createCommentVNode as u, Fragment as re, renderList as ne } from "vue";
 import "./KvIntroductionLoanCard.css";
-import Z from "../_virtual/_plugin-vue_export-helper.js";
-const $ = {
+import le from "../_virtual/_plugin-vue_export-helper.js";
+const Se = A`
+	fragment KvIntroductionLoanCard on LoanBasic {
+		id
+		image {
+			id
+			hash # for imageHash
+		}
+		lenders(limit: 0) {
+			totalCount # for lendersNumber
+		}
+		loanFundraisingInfo {
+			id
+			fundedAmount # for amountLent
+		}
+		name # for borrowerName
+		status # for isFunded
+		...KvLoanBookmark
+		...KvLoanTag
+		...KvLoanUse
+		...LoanCallouts
+		...LoanGeocode
+		...LoanProgress
+	}
+	${M}
+	${Y}
+	${q}
+	${I}
+	${G}
+	${U}
+`, De = A`
+	fragment KvIntroductionLoanCardUser on LoanBasic {
+		id
+		...KvLoanBookmark
+	}
+	${M}
+`, ie = {
   name: "KvIntroductionLoanCard",
   components: {
-    KvBorrowerImage: j,
-    KvLoadingPlaceholder: H,
-    KvLoanUse: V,
-    KvLoanProgressGroup: T,
-    KvMaterialIcon: E,
-    KvLoanTag: q,
-    KvLoanCallouts: U,
-    KvFlag: O,
-    KvLoanBookmark: R
+    KvBorrowerImage: H,
+    KvLoadingPlaceholder: $,
+    KvLoanUse: j,
+    KvLoanProgressGroup: J,
+    KvMaterialIcon: Z,
+    KvLoanTag: X,
+    KvLoanCallouts: Q,
+    KvFlag: ee,
+    KvLoanBookmark: W
   },
   props: {
     loanId: {
@@ -87,24 +123,25 @@ const $ = {
       countryName: w,
       countryCode: l,
       distributionModel: g,
-      formattedLocation: y,
+      formattedLocation: _,
       fundraisingPercent: k,
-      hasProgressData: v,
-      imageHash: _,
+      hasProgressData: y,
+      imageHash: v,
       isLoading: b,
-      loanAmount: p,
+      loanAmount: L,
       loanBorrowerCount: r,
-      loanCallouts: x,
-      loanStatus: M,
-      loanUse: B,
-      mdiMapMarker: N,
-      readMorePath: A,
+      loanCallouts: p,
+      loanStatus: P,
+      loanUse: K,
+      mdiMapMarker: R,
+      readMorePath: B,
       state: F,
-      tag: K,
-      unreservedAmount: S
-    } = W(n, !0), {
-      clickReadMore: z
-    } = I(n, o);
+      tag: O,
+      unreservedAmount: T,
+      sharesAvailable: S
+    } = V(n, !0), {
+      clickReadMore: D
+    } = z(n, o);
     return {
       allDataLoaded: i,
       borrowerName: e,
@@ -112,22 +149,23 @@ const $ = {
       countryName: w,
       countryCode: l,
       distributionModel: g,
-      formattedLocation: y,
+      formattedLocation: _,
       fundraisingPercent: k,
-      hasProgressData: v,
-      imageHash: _,
+      hasProgressData: y,
+      imageHash: v,
       isLoading: b,
-      loanAmount: p,
+      loanAmount: L,
       loanBorrowerCount: r,
-      loanCallouts: x,
-      loanStatus: M,
-      loanUse: B,
-      mdiMapMarker: N,
-      readMorePath: A,
+      loanCallouts: p,
+      loanStatus: P,
+      loanUse: K,
+      mdiMapMarker: R,
+      readMorePath: B,
       state: F,
-      tag: K,
-      unreservedAmount: S,
-      clickReadMore: z
+      tag: O,
+      unreservedAmount: T,
+      sharesAvailable: S,
+      clickReadMore: D
     };
   },
   computed: {
@@ -152,49 +190,49 @@ const $ = {
     amountLent() {
       var o, i;
       const n = ((i = (o = this.loan) == null ? void 0 : o.loanFundraisingInfo) == null ? void 0 : i.fundedAmount) ?? 0;
-      return D(parseFloat(n)).format("$0,0");
+      return E(n).format("$0,0");
     },
     isFunded() {
       var n;
-      return ((n = this.loan) == null ? void 0 : n.status) === "funded" || parseFloat(this.unreservedAmount) === 0;
+      return ((n = this.loan) == null ? void 0 : n.status) === "funded" || this.hasProgressData && !this.sharesAvailable;
     }
   }
-}, ee = { class: "tw-grow" }, te = { class: "loan-card-active-hover" }, oe = {
+}, se = { class: "tw-grow" }, de = { class: "loan-card-active-hover" }, me = {
   key: 1,
   style: { height: "11rem" },
   class: "tw-relative tw-overflow-hidden"
-}, ae = { key: 0 }, re = {
+}, ce = { key: 0 }, ue = {
   class: "tw-absolute tw-bottom-1 tw-left-1 tw-text-primary tw-bg-white tw-rounded tw-p-1 tw-mb-0 tw-mr-2 tw-text-h4 tw-inline-flex tw-items-center !tw-capitalize",
   style: { padding: "2px 6px" }
-}, ne = {
+}, we = {
   key: 3,
   class: "tw-flex tw-justify-center tw-gap-2"
-}, le = {
+}, he = {
   key: 0,
   class: "tw-w-full",
   style: { height: "5.5rem" }
-}, ie = { key: 1 }, de = { class: "tw-px-2" }, se = {
+}, fe = { key: 1 }, ge = { class: "tw-px-2" }, _e = {
   key: 0,
   class: "tw-w-full tw-pr-1"
-}, me = { class: "tw-flex tw-justify-between" }, ce = {
+}, ke = { class: "tw-flex tw-justify-between" }, ye = {
   key: 2,
   class: "tw-bg-eco-green-1 tw-text-action tw-text-center tw-py-1.5",
   style: { "font-weight": "bold", "font-size": "13px", "border-radius": "8px" }
 };
-function ue(n, o, i, e, C, w) {
-  const l = m("kv-loading-placeholder"), g = m("kv-borrower-image"), y = m("kv-flag"), k = m("kv-loan-bookmark"), v = m("kv-loan-callouts"), _ = m("kv-loan-use"), b = m("kv-loan-progress-group"), p = m("kv-loan-tag");
-  return t(), d("div", {
-    class: L(["tw-flex tw-flex-col tw-bg-white tw-rounded tw-w-full tw-pb-2", { "tw-pointer-events-none": e.isLoading }]),
+function ve(n, o, i, e, C, w) {
+  const l = m("kv-loading-placeholder"), g = m("kv-borrower-image"), _ = m("kv-flag"), k = m("kv-loan-bookmark"), y = m("kv-loan-callouts"), v = m("kv-loan-use"), b = m("kv-loan-progress-group"), L = m("kv-loan-tag");
+  return t(), s("div", {
+    class: x(["tw-flex tw-flex-col tw-bg-white tw-rounded tw-w-full tw-pb-2", { "tw-pointer-events-none": e.isLoading }]),
     "data-testid": "loan-card",
-    style: G([{ "box-shadow": "0px 4px 8px 0px rgba(0, 0, 0, 0.38)" }, { minWidth: "230px", maxWidth: w.cardWidth }])
+    style: te([{ "box-shadow": "0px 4px 8px 0px rgba(0, 0, 0, 0.38)" }, { minWidth: "230px", maxWidth: w.cardWidth }])
   }, [
-    c("div", ee, [
-      c("div", te, [
+    c("div", se, [
+      c("div", de, [
         e.isLoading ? (t(), a(l, {
           key: 0,
           class: "tw-w-full tw-rounded-t",
           style: { height: "11rem" }
-        })) : (t(), d("div", oe, [
+        })) : (t(), s("div", me, [
           (t(), a(f(e.tag), {
             to: e.readMorePath,
             href: e.readMorePath,
@@ -203,7 +241,7 @@ function ue(n, o, i, e, C, w) {
             onClick: o[0] || (o[0] = (r) => e.clickReadMore("Photo", r))
           }, {
             default: h(() => [
-              s(g, {
+              d(g, {
                 class: "tw-relative tw-w-full tw-bg-black tw-rounded-t borrower-image",
                 alt: `Photo of ${e.borrowerName}`,
                 "aspect-ratio": w.imageAspectRatio,
@@ -212,11 +250,11 @@ function ue(n, o, i, e, C, w) {
                 images: w.imageSizes,
                 "photo-path": i.photoPath
               }, null, 8, ["alt", "aspect-ratio", "default-image", "hash", "images", "photo-path"]),
-              e.countryName ? (t(), d("div", ae, [
-                c("p", re, [
-                  (t(), a(J, null, {
+              e.countryName ? (t(), s("div", ce, [
+                c("p", ue, [
+                  (t(), a(oe, null, {
                     default: h(() => [
-                      s(y, {
+                      d(_, {
                         class: "tw-ml-0.5 tw-mr-1",
                         country: e.countryCode,
                         name: e.countryName,
@@ -226,7 +264,7 @@ function ue(n, o, i, e, C, w) {
                     ]),
                     _: 1
                   })),
-                  Q(" " + P(e.formattedLocation), 1)
+                  ae(" " + N(e.formattedLocation), 1)
                 ])
               ])) : u("", !0)
             ]),
@@ -255,13 +293,13 @@ function ue(n, o, i, e, C, w) {
         }, {
           default: h(() => [
             c("h3", {
-              class: L(["loan-card-name", { "tw-text-center": e.borrowerName.length < 20 }]),
+              class: x(["loan-card-name", { "tw-text-center": e.borrowerName.length < 20 }]),
               style: { "font-size": "28px" }
-            }, P(e.borrowerName), 3)
+            }, N(e.borrowerName), 3)
           ]),
           _: 1
         }, 8, ["to", "href"])),
-        e.isLoading ? (t(), d("div", ne, [
+        e.isLoading ? (t(), s("div", we, [
           e.isLoading || typeof e.loanCallouts > "u" ? (t(), a(l, {
             key: 0,
             class: "tw-mt-0.5 tw-mb-1",
@@ -286,7 +324,7 @@ function ue(n, o, i, e, C, w) {
           onClick: o[3] || (o[3] = (r) => e.clickReadMore("Tag", r))
         }, {
           default: h(() => [
-            s(v, {
+            d(y, {
               callouts: e.loanCallouts,
               "add-bg-color": !1,
               class: "loan-callouts"
@@ -303,17 +341,17 @@ function ue(n, o, i, e, C, w) {
         }, {
           default: h(() => [
             c("div", {
-              class: L(["tw-pt-0.5 tw-px-2", { "tw-mb-1.5": !e.isLoading }])
+              class: x(["tw-pt-0.5 tw-px-2", { "tw-mb-1.5": !e.isLoading }])
             }, [
-              e.isLoading ? (t(), d("div", le, [
-                (t(!0), d(X, null, Y([...Array(3)], (r, x) => (t(), d("div", {
-                  key: x,
+              e.isLoading ? (t(), s("div", he, [
+                (t(!0), s(re, null, ne([...Array(3)], (r, p) => (t(), s("div", {
+                  key: p,
                   class: "tw-h-2 tw-mb-1"
                 }, [
-                  s(l)
+                  d(l)
                 ]))), 128))
-              ])) : (t(), d("div", ie, [
-                s(_, {
+              ])) : (t(), s("div", fe, [
+                d(v, {
                   use: e.loanUse,
                   "loan-amount": e.loanAmount,
                   status: e.loanStatus,
@@ -330,25 +368,25 @@ function ue(n, o, i, e, C, w) {
         }, 8, ["to", "href"]))
       ])
     ]),
-    c("div", de, [
-      e.hasProgressData ? u("", !0) : (t(), d("div", se, [
-        c("div", me, [
-          s(l, {
+    c("div", ge, [
+      e.hasProgressData ? u("", !0) : (t(), s("div", _e, [
+        c("div", ke, [
+          d(l, {
             class: "tw-mb-0.5",
             style: { width: "20%", height: "1.3rem" }
           }),
-          s(l, {
+          d(l, {
             class: "tw-mb-0.5",
             style: { width: "20%", height: "1.3rem" }
           })
         ]),
-        s(l, {
+        d(l, {
           class: "tw-rounded",
           style: { width: "100%", height: "0.5rem" }
         })
       ])),
       c("div", null, [
-        e.unreservedAmount > 0 ? (t(), a(f(e.tag), {
+        e.sharesAvailable ? (t(), a(f(e.tag), {
           key: 0,
           to: e.readMorePath,
           href: e.readMorePath,
@@ -357,10 +395,10 @@ function ue(n, o, i, e, C, w) {
           onClick: o[5] || (o[5] = (r) => e.clickReadMore("Progress", r))
         }, {
           default: h(() => [
-            s(b, {
+            d(b, {
               id: "loanProgress",
-              "money-left": `${e.unreservedAmount}`,
-              "amount-goal": `${e.loanAmount}`,
+              "money-left": e.unreservedAmount,
+              "amount-goal": e.loanAmount,
               "progress-percent": e.fundraisingPercent,
               class: "tw-text-secondary"
             }, null, 8, ["money-left", "amount-goal", "progress-percent"])
@@ -372,7 +410,7 @@ function ue(n, o, i, e, C, w) {
         key: 1,
         class: "tw-rounded tw-mx-auto tw-mt-2",
         style: { width: "9rem", height: "1rem" }
-      })) : w.isFunded ? (t(), d("div", ce, " 🎉 Fully funded! ")) : (t(), a(p, {
+      })) : w.isFunded ? (t(), s("div", ye, " 🎉 Fully funded! ")) : (t(), a(L, {
         key: 3,
         loan: i.loan,
         "use-expanded-styles": !0,
@@ -382,7 +420,9 @@ function ue(n, o, i, e, C, w) {
     ])
   ], 6);
 }
-const Me = /* @__PURE__ */ Z($, [["render", ue], ["__scopeId", "data-v-a9f870f5"]]);
+const Ee = /* @__PURE__ */ le(ie, [["render", ve], ["__scopeId", "data-v-4b1d705c"]]);
 export {
-  Me as default
+  Se as KV_INTRODUCTION_LOAN_CARD_FRAGMENT,
+  De as KV_INTRODUCTION_LOAN_CARD_USER_FRAGMENT,
+  Ee as default
 };

package/dist/vue/KvLendCta.css

@@ -1 +1 @@
-.amountDropdownWrapper[data-v-6049057c] select{border-radius:14px 0 0 14px}.lend-again[data-v-6049057c] span{padding-left:0;padding-right:0;padding-left:.5rem;padding-right:.5rem}.lendButtonWrapper[data-v-6049057c] span:first-child{border-radius:0 14px 14px 0}.filtered-dropdown[data-v-6049057c] select{cursor:pointer;border-radius:.875rem;border-width:2px;font-weight:500}.unselected-dropdown[data-v-6049057c] select{--tw-border-opacity: 1;border-color:rgb(158 158 158 / var(--tw-border-opacity, 1))}.selected-dropdown[data-v-6049057c] select{--tw-border-opacity: 1;border-color:rgb(34 56 41 / var(--tw-border-opacity, 1))}.preset-option[data-v-6049057c] 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-6049057c] span.tw-w-full:first-child{--tw-border-opacity: 1;border-color:rgba(var(--border-action),var(--tw-border-opacity, 1))}
+.amountDropdownWrapper[data-v-1ac5c3c8] select{border-radius:14px 0 0 14px}.lend-again[data-v-1ac5c3c8] span{padding-left:0;padding-right:0;padding-left:.5rem;padding-right:.5rem}.lendButtonWrapper[data-v-1ac5c3c8] span:first-child{border-radius:0 14px 14px 0}.filtered-dropdown[data-v-1ac5c3c8] select{cursor:pointer;border-radius:.875rem;border-width:2px;font-weight:500}.unselected-dropdown[data-v-1ac5c3c8] select{--tw-border-opacity: 1;border-color:rgb(158 158 158 / var(--tw-border-opacity, 1))}.selected-dropdown[data-v-1ac5c3c8] select{--tw-border-opacity: 1;border-color:rgb(34 56 41 / var(--tw-border-opacity, 1))}.preset-option[data-v-1ac5c3c8] 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-1ac5c3c8] span.tw-w-full:first-child{--tw-border-opacity: 1;border-color:rgba(var(--border-action),var(--tw-border-opacity, 1))}