@kiva/kv-components 7.4.1 → 7.5.0

package/dist/vue/KvCompactLoanCard.css

@@ -1 +1 @@
-.loan-card-use[data-v-8ea6bf26]:hover,.loan-card-use[data-v-8ea6bf26]:focus{--tw-text-opacity: 1;color:rgba(var(--text-primary),var(--tw-text-opacity, 1))}.loan-card-active-hover:hover .loan-card-use[data-v-8ea6bf26]{text-decoration-line:underline}.loan-card-progress[data-v-8ea6bf26]:hover,.loan-card-progress[data-v-8ea6bf26]:focus{text-decoration-line:none}.loan-card-use-text[data-v-8ea6bf26] p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;line-clamp:4;overflow:hidden;text-overflow:ellipsis}.loan-card-cta[data-v-8ea6bf26] form,.loan-card-cta[data-v-8ea6bf26] fieldset,.loan-card-cta[data-v-8ea6bf26] .tw-w-full,.loan-card-cta[data-v-8ea6bf26] button{height:40px!important;max-height:40px!important;display:flex!important;align-items:center!important;justify-content:center!important}.loan-card-cta[data-v-8ea6bf26] .tw-inline-flex{height:40px!important;max-height:40px!important;min-height:40px!important}
+.loan-card-use[data-v-4274faf3]:hover,.loan-card-use[data-v-4274faf3]:focus{--tw-text-opacity: 1;color:rgba(var(--text-primary),var(--tw-text-opacity, 1))}.loan-card-active-hover:hover .loan-card-use[data-v-4274faf3]{text-decoration-line:underline}.loan-card-progress[data-v-4274faf3]:hover,.loan-card-progress[data-v-4274faf3]:focus{text-decoration-line:none}.loan-card-use-text[data-v-4274faf3] p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;line-clamp:4;overflow:hidden;text-overflow:ellipsis}.loan-card-cta[data-v-4274faf3] form,.loan-card-cta[data-v-4274faf3] fieldset,.loan-card-cta[data-v-4274faf3] .tw-w-full,.loan-card-cta[data-v-4274faf3] button{height:40px!important;max-height:40px!important;display:flex!important;align-items:center!important;justify-content:center!important}.loan-card-cta[data-v-4274faf3] .tw-inline-flex{height:40px!important;max-height:40px!important;min-height:40px!important}

package/dist/vue/KvCompactLoanCard.js

@@ -1,21 +1,21 @@
-import N from "graphql-tag";
-import D from "numeral";
-import { mdiMapMarker as O, mdiHome as p, mdiLink as G } from "@mdi/js";
-import { LOAN_CALLOUTS_FRAGMENT as V, LOAN_GEOCODE_FRAGMENT as U, LOAN_PROGRESS_FRAGMENT as I, loanCardComputedProperties as W, loanCardMethods as H } from "../utils/loanCard.js";
-import j, { KV_LOAN_USE_FRAGMENT as q } from "./KvLoanUse.js";
-import Z from "./KvBorrowerImage.js";
-import z from "./KvLoanCallouts.js";
-import J, { KV_LEND_CTA_FRAGMENT as Q, KV_LEND_CTA_USER_FRAGMENT as X } from "./KvLendCta.js";
-import Y, { KV_LOAN_BOOKMARK_FRAGMENT as $ } from "./KvLoanBookmark.js";
-import ee from "./KvLoanProgressGroup.js";
-import te, { KV_LOAN_TAG_FRAGMENT as oe } from "./KvLoanTag.js";
-import ae from "./KvMaterialIcon.js";
-import ne from "./KvLoadingPlaceholder.js";
-import le from "./KvLoanTeamPick.js";
-import { resolveComponent as s, openBlock as n, createElementBlock as i, createElementVNode as r, createBlock as d, resolveDynamicComponent as w, withCtx as f, createVNode as m, toDisplayString as B, withModifiers as re, createCommentVNode as u, Fragment as C, renderList as ie, normalizeClass as M } from "vue";
+import P from "graphql-tag";
+import V from "numeral";
+import { computed as U, resolveComponent as d, openBlock as n, createElementBlock as i, createElementVNode as r, createBlock as s, resolveDynamicComponent as f, withCtx as w, createVNode as m, toDisplayString as M, withModifiers as p, createCommentVNode as u, Fragment as x, renderList as W, normalizeClass as N } from "vue";
+import { mdiMapMarker as I, mdiHome as H, mdiLink as j } from "@mdi/js";
+import { LOAN_CALLOUTS_FRAGMENT as q, LOAN_GEOCODE_FRAGMENT as Z, LOAN_PROGRESS_FRAGMENT as z, loanCardComputedProperties as J, loanCardMethods as Q } from "../utils/loanCard.js";
+import X, { KV_LOAN_USE_FRAGMENT as Y } from "./KvLoanUse.js";
+import $ from "./KvBorrowerImage.js";
+import ee from "./KvLoanCallouts.js";
+import te, { KV_LEND_CTA_FRAGMENT as oe, KV_LEND_CTA_USER_FRAGMENT as ae } from "./KvLendCta.js";
+import ne, { KV_LOAN_BOOKMARK_FRAGMENT as le } from "./KvLoanBookmark.js";
+import re from "./KvLoanProgressGroup.js";
+import ie, { KV_LOAN_TAG_FRAGMENT as se } from "./KvLoanTag.js";
+import de from "./KvMaterialIcon.js";
+import me from "./KvLoadingPlaceholder.js";
+import ce from "./KvLoanTeamPick.js";
 import "./KvCompactLoanCard.css";
-import se from "../_virtual/_plugin-vue_export-helper.js";
-const Ie = N`
+import ue from "../_virtual/_plugin-vue_export-helper.js";
+const je = P`
 	fragment KvCompactLoanCard on LoanBasic {
 		id
 		image {
@@ -37,33 +37,33 @@ const Ie = N`
 		...LoanGeocode
 		...LoanProgress
 	}
-	${Q}
 	${oe}
+	${se}
+	${Y}
 	${q}
-	${V}
-	${U}
-	${I}
-`, We = N`
+	${Z}
+	${z}
+`, qe = P`
 	fragment KvCompactLoanCardUser on LoanBasic {
 		id
 		...KvLendCtaUser
 		...KvLoanBookmark
 	}
-	${X}
-	${$}
-`, de = {
+	${ae}
+	${le}
+`, fe = {
   name: "KvCompactLoanCard",
   components: {
-    KvBorrowerImage: Z,
-    KvLoadingPlaceholder: ne,
-    KvLoanUse: j,
-    KvMaterialIcon: ae,
-    KvLendCta: J,
-    KvLoanTag: te,
-    KvLoanCallouts: z,
-    KvLoanBookmark: Y,
-    KvLoanTeamPick: le,
-    KvLoanProgressGroup: ee
+    KvBorrowerImage: $,
+    KvLoadingPlaceholder: me,
+    KvLoanUse: X,
+    KvMaterialIcon: de,
+    KvLendCta: te,
+    KvLoanTag: ie,
+    KvLoanCallouts: ee,
+    KvLoanBookmark: ne,
+    KvLoanTeamPick: ce,
+    KvLoanProgressGroup: re
   },
   props: {
     loanId: {
@@ -187,55 +187,61 @@ const Ie = N`
     const {
       allDataLoaded: t,
       borrowerName: e,
-      city: x,
-      countryName: A,
+      city: A,
+      countryName: B,
       distributionModel: k,
-      formattedLocation: h,
-      fundraisingPercent: g,
+      formattedLocation: g,
+      fundraisingPercent: v,
       hasProgressData: c,
-      imageHash: v,
-      isLoading: _,
-      loanAmount: y,
-      loanBorrowerCount: b,
+      imageHash: _,
+      isLoading: y,
+      loanAmount: b,
+      loanBorrowerCount: L,
       loanCallouts: a,
-      loanStatus: L,
+      loanStatus: C,
       loanUse: T,
-      readMorePath: P,
-      state: K,
-      tag: R,
-      unreservedAmount: F,
-      sharesAvailable: E
-    } = W(l), {
-      clickReadMore: S
-    } = H(l, o);
+      readMorePath: K,
+      state: R,
+      tag: F,
+      unreservedAmount: E,
+      sharesAvailable: S
+    } = J(l), {
+      clickReadMore: D
+    } = Q(l, o), O = () => {
+      l.kvTrackFunction("Lending", "click-Business Website", "Website", l.loanId);
+    }, G = U(() => {
+      if (!l.website)
+        return "";
+      const h = l.website.trim();
+      return h.startsWith("http://") || h.startsWith("https://") ? h : `https://${h}`;
+    });
     return {
       allDataLoaded: t,
       borrowerName: e,
-      city: x,
-      countryName: A,
+      city: A,
+      countryName: B,
       distributionModel: k,
-      formattedLocation: h,
-      fundraisingPercent: g,
+      formattedLocation: g,
+      formattedWebsite: G,
+      fundraisingPercent: v,
       hasProgressData: c,
-      imageHash: v,
-      isLoading: _,
-      loanAmount: y,
-      loanBorrowerCount: b,
+      imageHash: _,
+      isLoading: y,
+      loanAmount: b,
+      loanBorrowerCount: L,
       loanCallouts: a,
-      loanStatus: L,
+      loanStatus: C,
       loanUse: T,
-      mdiMapMarker: O,
-      mdiHome: p,
-      mdiLink: G,
-      readMorePath: P,
-      state: K,
-      tag: R,
-      unreservedAmount: F,
-      sharesAvailable: E,
-      clickReadMore: S,
-      trackWebsiteClick: () => {
-        l.kvTrackFunction("Lending", "click-Business Website", "Website", l.loanId);
-      }
+      mdiMapMarker: I,
+      mdiHome: H,
+      mdiLink: j,
+      readMorePath: K,
+      state: R,
+      tag: F,
+      unreservedAmount: E,
+      sharesAvailable: S,
+      clickReadMore: D,
+      trackWebsiteClick: O
     };
   },
   computed: {
@@ -246,36 +252,36 @@ const Ie = N`
     amountLent() {
       var o, t;
       const l = ((t = (o = this.loan) == null ? void 0 : o.loanFundraisingInfo) == null ? void 0 : t.fundedAmount) ?? 0;
-      return D(l).format("$0,0");
+      return V(l).format("$0,0");
     }
   }
-}, me = { class: "tw-flex tw-flex-col tw-items-start tw-justify-between tw-p-1 tw-bg-white tw-rounded-md tw-shadow-lg tw-w-full" }, ce = { class: "tw-flex tw-flex-col tw-items-start tw-w-full" }, ue = {
+}, we = { class: "tw-flex tw-flex-col tw-items-start tw-justify-between tw-p-1 tw-bg-white tw-rounded-md tw-shadow-lg tw-w-full" }, he = { class: "tw-flex tw-flex-col tw-items-start tw-w-full" }, ke = {
   class: "tw-flex tw-items-start tw-gap-2 tw-w-full loan-card-active-hover",
   style: { height: "6.75rem", "max-height": "6.75rem" }
-}, we = { class: "tw-flex-shrink-0 tw-overflow-hidden" }, fe = { class: "tw-flex tw-flex-col tw-items-start tw-gap-1 tw-flex-1 tw-min-w-0" }, ke = {
+}, ge = { class: "tw-flex-shrink-0 tw-overflow-hidden" }, ve = { class: "tw-flex tw-flex-col tw-items-start tw-gap-1 tw-flex-1 tw-min-w-0" }, _e = {
   key: 0,
   class: "tw-mb-0.5 tw-w-full"
-}, he = { class: "tw-text-primary !tw-font-medium tw-text-base tw-leading-normal tw-truncate" }, ge = ["href"], ve = { class: "tw-truncate" }, _e = {
+}, ye = { class: "tw-text-primary !tw-font-medium tw-text-base tw-leading-normal tw-truncate" }, be = ["href"], Le = { class: "tw-truncate" }, Ce = {
   key: 0,
   class: "loan-card-use-text tw-w-full tw-overflow-hidden"
-}, ye = {
+}, xe = {
   key: 1,
   class: "loan-card-use-text tw-w-full tw-overflow-hidden"
-}, be = { class: "tw-flex-1 tw-min-w-0 tw-mr-1" }, Le = { class: "tw-flex-1 tw-min-w-0" };
-function Ce(l, o, t, e, x, A) {
-  const k = s("kv-borrower-image"), h = s("kv-material-icon"), g = s("kv-loan-tag"), c = s("kv-loading-placeholder"), v = s("kv-loan-use"), _ = s("kv-loan-callouts"), y = s("kv-loan-progress-group"), b = s("kv-lend-cta");
-  return n(), i("div", me, [
-    r("div", ce, [
-      r("div", ue, [
-        r("div", we, [
-          (n(), d(w(e.tag), {
+}, Ae = { class: "tw-flex-1 tw-min-w-0 tw-mr-1" }, Be = { class: "tw-flex-1 tw-min-w-0" };
+function Me(l, o, t, e, A, B) {
+  const k = d("kv-borrower-image"), g = d("kv-material-icon"), v = d("kv-loan-tag"), c = d("kv-loading-placeholder"), _ = d("kv-loan-use"), y = d("kv-loan-callouts"), b = d("kv-loan-progress-group"), L = d("kv-lend-cta");
+  return n(), i("div", we, [
+    r("div", he, [
+      r("div", ke, [
+        r("div", ge, [
+          (n(), s(f(e.tag), {
             to: e.readMorePath,
             href: e.readMorePath,
             class: "tw-flex",
             "aria-label": "Borrower image",
             onClick: o[0] || (o[0] = (a) => e.clickReadMore("Photo", a))
           }, {
-            default: f(() => [
+            default: w(() => [
               m(k, {
                 class: "tw-bg-gray-300 tw-rounded-md tw-object-cover",
                 style: { width: "100px", height: "100px" },
@@ -290,56 +296,67 @@ function Ce(l, o, t, e, x, A) {
             _: 1
           }, 8, ["to", "href"]))
         ]),
-        r("div", fe, [
-          t.businessName ? (n(), i("div", ke, [
-            r("h3", he, B(t.businessName), 1),
+        r("div", ve, [
+          t.businessName ? (n(), i("div", _e, [
+            (n(), s(f(e.tag), {
+              to: e.readMorePath,
+              href: e.readMorePath,
+              class: "tw-no-underline hover:tw-underline focus:tw-no-underline",
+              "aria-label": "Business name",
+              onClick: o[1] || (o[1] = (a) => e.clickReadMore("Business", a))
+            }, {
+              default: w(() => [
+                r("h3", ye, M(t.businessName), 1)
+              ]),
+              _: 1
+            }, 8, ["to", "href"])),
             t.website ? (n(), i("a", {
               key: 0,
-              href: t.website,
+              href: e.formattedWebsite,
               target: "_blank",
               class: "tw-flex tw-items-center tw-gap-0.5 tw-text-secondary tw-text-small tw-font-light tw-leading-normal tw-no-underline hover:tw-underline",
-              onClick: o[1] || (o[1] = re((...a) => e.trackWebsiteClick && e.trackWebsiteClick(...a), ["stop"]))
+              onClick: o[2] || (o[2] = p((...a) => e.trackWebsiteClick && e.trackWebsiteClick(...a), ["stop"]))
             }, [
-              m(h, {
+              m(g, {
                 icon: e.mdiLink,
                 class: "tw-w-2 tw-h-2"
               }, null, 8, ["icon"]),
-              r("span", ve, B(t.website), 1)
-            ], 8, ge)) : u("", !0)
+              r("span", Le, M(t.website), 1)
+            ], 8, be)) : u("", !0)
           ])) : u("", !0),
-          (n(), d(w(e.tag), {
+          (n(), s(f(e.tag), {
             to: e.readMorePath,
             href: e.readMorePath,
             class: "tw-flex tw-no-underline hover:tw-no-underline focus:tw-no-underline -tw-mt-1",
             "aria-label": "Loan tag",
-            onClick: o[2] || (o[2] = (a) => e.clickReadMore("Tag", a))
+            onClick: o[3] || (o[3] = (a) => e.clickReadMore("Tag", a))
           }, {
-            default: f(() => [
-              t.showTags && !e.isLoading ? (n(), d(g, {
+            default: w(() => [
+              t.showTags && !e.isLoading ? (n(), s(v, {
                 key: 0,
                 loan: t.loan
               }, null, 8, ["loan"])) : u("", !0)
             ]),
             _: 1
           }, 8, ["to", "href"])),
-          t.showLoanUse ? (n(), d(w(e.tag), {
+          t.showLoanUse ? (n(), s(f(e.tag), {
             key: 1,
             to: e.readMorePath,
             href: e.readMorePath,
             class: "loan-card-use tw-no-underline tw-text-primary tw-block tw-w-full",
             "aria-label": "Loan use",
-            onClick: o[3] || (o[3] = (a) => e.clickReadMore("Use", a))
+            onClick: o[4] || (o[4] = (a) => e.clickReadMore("Use", a))
           }, {
-            default: f(() => [
-              e.isLoading ? (n(), i("div", _e, [
-                (n(!0), i(C, null, ie([...Array(4)], (a, L) => (n(), i("div", {
-                  key: L,
+            default: w(() => [
+              e.isLoading ? (n(), i("div", Ce, [
+                (n(!0), i(x, null, W([...Array(4)], (a, C) => (n(), i("div", {
+                  key: C,
                   class: "tw-h-2 tw-mb-1"
                 }, [
                   m(c)
                 ]))), 128))
-              ])) : (n(), i("div", ye, [
-                m(v, {
+              ])) : (n(), i("div", xe, [
+                m(_, {
                   use: e.loanUse,
                   "loan-amount": e.loanAmount,
                   status: e.loanStatus,
@@ -356,32 +373,32 @@ function Ce(l, o, t, e, x, A) {
           }, 8, ["to", "href"])) : u("", !0)
         ])
       ]),
-      e.isLoading || typeof e.loanCallouts > "u" ? (n(), d(c, {
+      e.isLoading || typeof e.loanCallouts > "u" ? (n(), s(c, {
         key: 0,
         class: "tw-mt-1.5 tw-mb-1 tw-rounded-full",
         style: { width: "60%", height: "1.5rem" }
-      })) : (n(), d(_, {
+      })) : (n(), s(y, {
         key: 1,
         callouts: e.loanCallouts,
         class: "tw-mt-1.5",
-        onClick: o[4] || (o[4] = (a) => l.$emit("jump-filter-page", a))
+        onClick: o[5] || (o[5] = (a) => l.$emit("jump-filter-page", a))
       }, null, 8, ["callouts"]))
     ]),
     r("div", {
-      class: M(["tw-flex tw-items-end tw-w-full tw-mt-1", { "tw-gap-1": e.sharesAvailable }])
+      class: N(["tw-flex tw-items-end tw-w-full tw-mt-1", { "tw-gap-1": e.sharesAvailable }])
     }, [
-      e.hasProgressData ? (n(), i(C, { key: 1 }, [
-        r("div", Le, [
-          e.sharesAvailable ? (n(), d(w(e.tag), {
+      e.hasProgressData ? (n(), i(x, { key: 1 }, [
+        r("div", Be, [
+          e.sharesAvailable ? (n(), s(f(e.tag), {
             key: 0,
             to: e.readMorePath,
             href: e.readMorePath,
             class: "loan-card-progress tw-no-underline tw-block",
             "aria-label": "Loan progress",
-            onClick: o[5] || (o[5] = (a) => e.clickReadMore("Progress", a))
+            onClick: o[6] || (o[6] = (a) => e.clickReadMore("Progress", a))
           }, {
-            default: f(() => [
-              m(y, {
+            default: w(() => [
+              m(b, {
                 id: "loanProgress",
                 "money-left": e.unreservedAmount,
                 "progress-percent": e.fundraisingPercent,
@@ -392,10 +409,10 @@ function Ce(l, o, t, e, x, A) {
           }, 8, ["to", "href"])) : u("", !0)
         ]),
         r("div", {
-          class: M(["tw-flex-shrink-0 loan-card-cta", { "tw-w-full": !e.sharesAvailable }]),
+          class: N(["tw-flex-shrink-0 loan-card-cta", { "tw-w-full": !e.sharesAvailable }]),
           style: { height: "40px" }
         }, [
-          m(b, {
+          m(L, {
             loan: t.loan,
             "unreserved-amount": e.unreservedAmount,
             "basket-items": t.basketItems,
@@ -415,13 +432,13 @@ function Ce(l, o, t, e, x, A) {
             "primary-button-text": t.primaryButtonText,
             "secondary-button-text": t.secondaryButtonText,
             "secondary-button-handler": t.secondaryButtonHandler,
-            onAddToBasket: o[6] || (o[6] = (a) => l.$emit("add-to-basket", a)),
-            onShowLoanDetails: o[7] || (o[7] = (a) => e.clickReadMore("ViewLoan", a)),
-            onRemoveFromBasket: o[8] || (o[8] = (a) => l.$emit("remove-from-basket", a))
+            onAddToBasket: o[7] || (o[7] = (a) => l.$emit("add-to-basket", a)),
+            onShowLoanDetails: o[8] || (o[8] = (a) => e.clickReadMore("ViewLoan", a)),
+            onRemoveFromBasket: o[9] || (o[9] = (a) => l.$emit("remove-from-basket", a))
           }, null, 8, ["loan", "unreserved-amount", "basket-items", "is-loading", "is-adding", "enable-five-dollars-notes", "five-dollars-selected", "kv-track-function", "show-view-loan", "custom-loan-details", "external-links", "route", "user-balance", "get-cookie", "set-cookie", "is-visitor", "primary-button-text", "secondary-button-text", "secondary-button-handler"])
         ], 2)
-      ], 64)) : (n(), i(C, { key: 0 }, [
-        r("div", be, [
+      ], 64)) : (n(), i(x, { key: 0 }, [
+        r("div", Ae, [
           m(c, {
             class: "tw-mb-0.5",
             style: { width: "100%", maxWidth: "11rem", height: "1rem" }
@@ -431,7 +448,7 @@ function Ce(l, o, t, e, x, A) {
             style: { width: "100%", maxWidth: "11rem", height: "0.5rem" }
           })
         ]),
-        e.allDataLoaded ? u("", !0) : (n(), d(c, {
+        e.allDataLoaded ? u("", !0) : (n(), s(c, {
           key: 0,
           class: "tw-rounded tw-flex-shrink-0",
           style: { width: "8rem", height: "2.5rem" }
@@ -440,9 +457,9 @@ function Ce(l, o, t, e, x, A) {
     ], 2)
   ]);
 }
-const He = /* @__PURE__ */ se(de, [["render", Ce], ["__scopeId", "data-v-8ea6bf26"]]);
+const Ze = /* @__PURE__ */ ue(fe, [["render", Me], ["__scopeId", "data-v-4274faf3"]]);
 export {
-  Ie as KV_COMPACT_LOAN_CARD_FRAGMENT,
-  We as KV_COMPACT_LOAN_CARD_USER_FRAGMENT,
-  He as default
+  je as KV_COMPACT_LOAN_CARD_FRAGMENT,
+  qe as KV_COMPACT_LOAN_CARD_USER_FRAGMENT,
+  Ze as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kiva/kv-components",
-  "version": "7.4.1",
+  "version": "7.5.0",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -115,5 +115,5 @@
     "embla-carousel-fade",
     "popper.js"
   ],
-  "gitHead": "6ad3de2c0ffbd8d1ac2272ee5f6bc4d2274ab6f5"
+  "gitHead": "2a5cf7ee94ea90892079d9b644d103559b5bbe21"
 }