@kiva/kv-components 6.62.5 → 6.64.0

package/dist/vue/KvCompactLoanCard.css

@@ -1 +1 @@
-.loan-card-use[data-v-9340d33c]:hover,.loan-card-use[data-v-9340d33c]: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-9340d33c]{text-decoration-line:underline}.loan-card-progress[data-v-9340d33c]:hover,.loan-card-progress[data-v-9340d33c]:focus{text-decoration-line:none}.loan-card-use-text[data-v-9340d33c] 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-9340d33c] form,.loan-card-cta[data-v-9340d33c] fieldset,.loan-card-cta[data-v-9340d33c] .tw-w-full,.loan-card-cta[data-v-9340d33c] button{height:40px!important;max-height:40px!important;display:flex!important;align-items:center!important;justify-content:center!important}.loan-card-cta[data-v-9340d33c] .tw-inline-flex{height:40px!important;max-height:40px!important;min-height:40px!important}
+.loan-card-use[data-v-92c9b884]:hover,.loan-card-use[data-v-92c9b884]: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-92c9b884]{text-decoration-line:underline}.loan-card-progress[data-v-92c9b884]:hover,.loan-card-progress[data-v-92c9b884]:focus{text-decoration-line:none}.loan-card-use-text[data-v-92c9b884] 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-92c9b884] form,.loan-card-cta[data-v-92c9b884] fieldset,.loan-card-cta[data-v-92c9b884] .tw-w-full,.loan-card-cta[data-v-92c9b884] button{height:40px!important;max-height:40px!important;display:flex!important;align-items:center!important;justify-content:center!important}.loan-card-cta[data-v-92c9b884] .tw-inline-flex{height:40px!important;max-height:40px!important;min-height:40px!important}

package/dist/vue/KvCompactLoanCard.js

@@ -1,4 +1,4 @@
-import p from "graphql-tag";
+import B from "graphql-tag";
 import E from "numeral";
 import { mdiMapMarker as O, mdiHome as D } from "@mdi/js";
 import { LOAN_CALLOUTS_FRAGMENT as S, LOAN_GEOCODE_FRAGMENT as G, LOAN_PROGRESS_FRAGMENT as V, loanCardComputedProperties as U, loanCardMethods as I } from "../utils/loanCard.js";
@@ -12,10 +12,10 @@ import $, { KV_LOAN_TAG_FRAGMENT as ee } from "./KvLoanTag.js";
 import te from "./KvMaterialIcon.js";
 import oe from "./KvLoadingPlaceholder.js";
 import ae from "./KvLoanTeamPick.js";
-import { resolveComponent as i, openBlock as n, createElementBlock as d, createElementVNode as r, createVNode as m, createBlock as u, resolveDynamicComponent as C, withCtx as A, createCommentVNode as k, Fragment as y, renderList as ne, normalizeClass as x } from "vue";
+import { resolveComponent as d, openBlock as n, createElementBlock as m, createElementVNode as r, createBlock as s, resolveDynamicComponent as u, withCtx as f, createVNode as c, createCommentVNode as L, Fragment as b, renderList as ne, normalizeClass as x } from "vue";
 import "./KvCompactLoanCard.css";
 import le from "../_virtual/_plugin-vue_export-helper.js";
-const Oe = p`
+const Oe = B`
 	fragment KvCompactLoanCard on LoanBasic {
 		id
 		image {
@@ -43,7 +43,7 @@ const Oe = p`
 	${S}
 	${G}
 	${V}
-`, De = p`
+`, De = B`
 	fragment KvCompactLoanCardUser on LoanBasic {
 		id
 		...KvLendCtaUser
@@ -175,51 +175,51 @@ const Oe = p`
     const {
       allDataLoaded: t,
       borrowerName: e,
-      city: L,
-      countryName: b,
-      distributionModel: c,
-      formattedLocation: f,
-      fundraisingPercent: s,
-      hasProgressData: w,
-      imageHash: g,
-      isLoading: h,
-      loanAmount: v,
+      city: C,
+      countryName: A,
+      distributionModel: w,
+      formattedLocation: g,
+      fundraisingPercent: i,
+      hasProgressData: h,
+      imageHash: v,
+      isLoading: k,
+      loanAmount: _,
       loanBorrowerCount: a,
-      loanCallouts: _,
-      loanStatus: B,
+      loanCallouts: y,
+      loanStatus: M,
       loanUse: N,
       readMorePath: T,
-      state: K,
-      tag: M,
-      unreservedAmount: P,
-      sharesAvailable: F
+      state: P,
+      tag: p,
+      unreservedAmount: K,
+      sharesAvailable: R
     } = U(l), {
-      clickReadMore: R
+      clickReadMore: F
     } = I(l, o);
     return {
       allDataLoaded: t,
       borrowerName: e,
-      city: L,
-      countryName: b,
-      distributionModel: c,
-      formattedLocation: f,
-      fundraisingPercent: s,
-      hasProgressData: w,
-      imageHash: g,
-      isLoading: h,
-      loanAmount: v,
+      city: C,
+      countryName: A,
+      distributionModel: w,
+      formattedLocation: g,
+      fundraisingPercent: i,
+      hasProgressData: h,
+      imageHash: v,
+      isLoading: k,
+      loanAmount: _,
       loanBorrowerCount: a,
-      loanCallouts: _,
-      loanStatus: B,
+      loanCallouts: y,
+      loanStatus: M,
       loanUse: N,
       mdiMapMarker: O,
       mdiHome: D,
       readMorePath: T,
-      state: K,
-      tag: M,
-      unreservedAmount: P,
-      sharesAvailable: F,
-      clickReadMore: R
+      state: P,
+      tag: p,
+      unreservedAmount: K,
+      sharesAvailable: R,
+      clickReadMore: F
     };
   },
   computed: {
@@ -233,7 +233,7 @@ const Oe = p`
       return E(l).format("$0,0");
     }
   }
-}, se = { class: "tw-flex tw-flex-col tw-items-start tw-gap-3 tw-w-full" }, ie = { class: "tw-flex tw-items-start tw-gap-3 tw-w-full" }, de = { 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-80" }, me = { class: "tw-flex tw-flex-col tw-items-start tw-w-full" }, ue = { class: "tw-flex tw-items-start tw-gap-2 tw-w-full" }, ce = { class: "tw-flex-shrink-0 tw-overflow-hidden" }, fe = {
+}, se = { class: "tw-flex tw-flex-col tw-items-start tw-gap-3 tw-w-full" }, ie = { class: "tw-flex tw-items-start tw-gap-3 tw-w-full" }, de = { 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-80" }, me = { class: "tw-flex tw-flex-col tw-items-start tw-w-full" }, ce = { class: "tw-flex tw-items-start tw-gap-2 tw-w-full loan-card-active-hover" }, ue = { class: "tw-flex-shrink-0 tw-overflow-hidden" }, fe = {
   class: "tw-flex tw-flex-col tw-items-start tw-gap-1 tw-flex-1",
   style: { height: "7.25rem" }
 }, we = {
@@ -244,87 +244,109 @@ const Oe = p`
   key: 1,
   class: "loan-card-use-text tw-w-full tw-overflow-hidden"
 }, he = { class: "tw-flex-1" }, ve = { class: "tw-flex-1 tw-min-w-0" };
-function _e(l, o, t, e, L, b) {
-  const c = i("kv-borrower-image"), f = i("kv-loan-tag"), s = i("kv-loading-placeholder"), w = i("kv-loan-use"), g = i("kv-loan-callouts"), h = i("kv-loan-progress-group"), v = i("kv-lend-cta");
-  return n(), d("div", se, [
+function ke(l, o, t, e, C, A) {
+  const w = d("kv-borrower-image"), g = d("kv-loan-tag"), i = d("kv-loading-placeholder"), h = d("kv-loan-use"), v = d("kv-loan-callouts"), k = d("kv-loan-progress-group"), _ = d("kv-lend-cta");
+  return n(), m("div", se, [
     r("div", ie, [
       r("div", de, [
         r("div", me, [
-          r("div", ue, [
-            r("div", ce, [
-              m(c, {
-                class: "tw-bg-gray-300 tw-rounded-md tw-object-cover",
-                style: { width: "100px", height: "100px" },
-                alt: `Photo of ${e.borrowerName}`,
-                "aspect-ratio": 1,
-                "default-image": { width: 200, faceZoom: 50 },
-                hash: e.imageHash,
-                images: [{ width: 200, faceZoom: 50 }],
-                "photo-path": t.photoPath
-              }, null, 8, ["alt", "hash", "photo-path"])
+          r("div", ce, [
+            r("div", ue, [
+              (n(), s(u(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(() => [
+                  c(w, {
+                    class: "tw-bg-gray-300 tw-rounded-md tw-object-cover",
+                    style: { width: "100px", height: "100px" },
+                    alt: `Photo of ${e.borrowerName}`,
+                    "aspect-ratio": 1,
+                    "default-image": { width: 200, faceZoom: 50 },
+                    hash: e.imageHash,
+                    images: [{ width: 200, faceZoom: 50 }],
+                    "photo-path": t.photoPath
+                  }, null, 8, ["alt", "hash", "photo-path"])
+                ]),
+                _: 1
+              }, 8, ["to", "href"]))
             ]),
             r("div", fe, [
-              (n(), u(C(e.tag), {
+              (n(), s(u(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[0] || (o[0] = (a) => e.clickReadMore("Tag", a))
+                onClick: o[1] || (o[1] = (a) => e.clickReadMore("Tag", a))
               }, {
-                default: A(() => [
-                  t.showTags && !e.isLoading ? (n(), u(f, {
+                default: f(() => [
+                  t.showTags && !e.isLoading ? (n(), s(g, {
                     key: 0,
                     loan: t.loan
-                  }, null, 8, ["loan"])) : k("", !0)
+                  }, null, 8, ["loan"])) : L("", !0)
                 ]),
                 _: 1
               }, 8, ["to", "href"])),
-              e.isLoading ? (n(), d("div", we, [
-                (n(!0), d(y, null, ne([...Array(4)], (a, _) => (n(), d("div", {
-                  key: _,
-                  class: "tw-h-2 tw-mb-1"
-                }, [
-                  m(s)
-                ]))), 128))
-              ])) : (n(), d("div", ge, [
-                m(w, {
-                  use: e.loanUse,
-                  "loan-amount": e.loanAmount,
-                  status: e.loanStatus,
-                  "borrower-count": e.loanBorrowerCount,
-                  name: e.borrowerName,
-                  "distribution-model": e.distributionModel,
-                  class: "tw-text-small tw-leading-tight"
-                }, null, 8, ["use", "loan-amount", "status", "borrower-count", "name", "distribution-model"])
-              ]))
+              (n(), s(u(e.tag), {
+                to: e.readMorePath,
+                href: e.readMorePath,
+                class: "loan-card-use tw-no-underline tw-text-primary",
+                "aria-label": "Loan use",
+                onClick: o[2] || (o[2] = (a) => e.clickReadMore("Use", a))
+              }, {
+                default: f(() => [
+                  e.isLoading ? (n(), m("div", we, [
+                    (n(!0), m(b, null, ne([...Array(4)], (a, y) => (n(), m("div", {
+                      key: y,
+                      class: "tw-h-2 tw-mb-1"
+                    }, [
+                      c(i)
+                    ]))), 128))
+                  ])) : (n(), m("div", ge, [
+                    c(h, {
+                      use: e.loanUse,
+                      "loan-amount": e.loanAmount,
+                      status: e.loanStatus,
+                      "borrower-count": e.loanBorrowerCount,
+                      name: e.borrowerName,
+                      "distribution-model": e.distributionModel,
+                      class: "tw-text-small tw-leading-tight"
+                    }, null, 8, ["use", "loan-amount", "status", "borrower-count", "name", "distribution-model"])
+                  ]))
+                ]),
+                _: 1
+              }, 8, ["to", "href"]))
             ])
           ]),
-          e.isLoading || typeof e.loanCallouts > "u" ? (n(), u(s, {
+          e.isLoading || typeof e.loanCallouts > "u" ? (n(), s(i, {
             key: 0,
             class: "tw-mt-1.5 tw-mb-1 tw-rounded-full",
             style: { width: "60%", height: "1.5rem" }
-          })) : (n(), u(g, {
+          })) : (n(), s(v, {
             key: 1,
             callouts: e.loanCallouts,
             class: "tw-mt-1.5",
-            onClick: o[1] || (o[1] = (a) => l.$emit("jump-filter-page", a))
+            onClick: o[3] || (o[3] = (a) => l.$emit("jump-filter-page", a))
           }, null, 8, ["callouts"]))
         ]),
         r("div", {
           class: x(["tw-flex tw-items-end tw-w-full tw-mt-1", { "tw-gap-2": e.sharesAvailable }])
         }, [
-          e.hasProgressData ? (n(), d(y, { key: 1 }, [
+          e.hasProgressData ? (n(), m(b, { key: 1 }, [
             r("div", ve, [
-              e.sharesAvailable ? (n(), u(C(e.tag), {
+              e.sharesAvailable ? (n(), s(u(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[2] || (o[2] = (a) => e.clickReadMore("Progress", a))
+                onClick: o[4] || (o[4] = (a) => e.clickReadMore("Progress", a))
               }, {
-                default: A(() => [
-                  m(h, {
+                default: f(() => [
+                  c(k, {
                     id: "loanProgress",
                     "money-left": e.unreservedAmount,
                     "progress-percent": e.fundraisingPercent,
@@ -332,13 +354,13 @@ function _e(l, o, t, e, L, b) {
                   }, null, 8, ["money-left", "progress-percent"])
                 ]),
                 _: 1
-              }, 8, ["to", "href"])) : k("", !0)
+              }, 8, ["to", "href"])) : L("", !0)
             ]),
             r("div", {
               class: x(["tw-flex-shrink-0 loan-card-cta", { "tw-w-full": !e.sharesAvailable }]),
               style: { height: "40px" }
             }, [
-              m(v, {
+              c(_, {
                 loan: t.loan,
                 "unreserved-amount": e.unreservedAmount,
                 "basket-items": t.basketItems,
@@ -358,23 +380,23 @@ function _e(l, o, t, e, L, b) {
                 "primary-button-text": t.primaryButtonText,
                 "secondary-button-text": t.secondaryButtonText,
                 "secondary-button-handler": t.secondaryButtonHandler,
-                onAddToBasket: o[3] || (o[3] = (a) => l.$emit("add-to-basket", a)),
-                onShowLoanDetails: o[4] || (o[4] = (a) => e.clickReadMore("ViewLoan", a)),
-                onRemoveFromBasket: o[5] || (o[5] = (a) => l.$emit("remove-from-basket", a))
+                onAddToBasket: o[5] || (o[5] = (a) => l.$emit("add-to-basket", a)),
+                onShowLoanDetails: o[6] || (o[6] = (a) => e.clickReadMore("ViewLoan", a)),
+                onRemoveFromBasket: o[7] || (o[7] = (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(), d(y, { key: 0 }, [
+          ], 64)) : (n(), m(b, { key: 0 }, [
             r("div", he, [
-              m(s, {
+              c(i, {
                 class: "tw-mb-0.5",
                 style: { width: "11rem", height: "1rem" }
               }),
-              m(s, {
+              c(i, {
                 class: "tw-rounded",
                 style: { width: "11rem", height: "0.5rem" }
               })
             ]),
-            e.allDataLoaded ? k("", !0) : (n(), u(s, {
+            e.allDataLoaded ? L("", !0) : (n(), s(i, {
               key: 0,
               class: "tw-rounded tw-flex-shrink-0",
               style: { width: "8rem", height: "2.5rem" }
@@ -385,7 +407,7 @@ function _e(l, o, t, e, L, b) {
     ])
   ]);
 }
-const Se = /* @__PURE__ */ le(re, [["render", _e], ["__scopeId", "data-v-9340d33c"]]);
+const Se = /* @__PURE__ */ le(re, [["render", ke], ["__scopeId", "data-v-92c9b884"]]);
 export {
   Oe as KV_COMPACT_LOAN_CARD_FRAGMENT,
   De as KV_COMPACT_LOAN_CARD_USER_FRAGMENT,

package/dist/vue/KvLendCta.css

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

package/dist/vue/KvLendCta.js

@@ -462,7 +462,7 @@ function ue(n, s, l, D, d, e) {
               (o(!0), r(k, null, p(e.presetButtonsPrices, (t) => (o(), a(m, {
                 key: t,
                 variant: "secondary",
-                class: w(["preset-option tw-flex-1 tw-min-w-0", { "selected-option": d.selectedOption == t }]),
+                class: w(["preset-option tw-flex-1 tw-min-w-0 tw-whitespace-nowrap", { "selected-option": d.selectedOption == t }]),
                 "data-testid": "bp-lend-cta-lend-button-mobile",
                 onClick: (b) => e.clickPresetButton(t)
               }, {
@@ -540,7 +540,7 @@ function ue(n, s, l, D, d, e) {
               (o(!0), r(k, null, p(e.presetButtonsPrices, (t) => (o(), a(m, {
                 key: t,
                 variant: "secondary",
-                class: w(["preset-option tw-flex-1 tw-min-w-0", { "selected-option": d.selectedOption == t }]),
+                class: w(["preset-option tw-flex-1 tw-min-w-0 tw-whitespace-nowrap", { "selected-option": d.selectedOption == t }]),
                 "data-testid": "bp-lend-cta-lend-button-narrow-desktop",
                 onClick: (b) => e.clickPresetButton(t)
               }, {
@@ -622,7 +622,7 @@ function ue(n, s, l, D, d, e) {
           e.isLendAmountButton ? c("", !0) : (o(!0), r(k, { key: 0 }, p(e.presetButtonsPrices, (t) => (o(), a(m, {
             key: t,
             variant: "secondary",
-            class: w(["tw-inline-flex tw-flex-1 preset-option tw-w-8", { "selected-option": d.selectedOption == t }]),
+            class: w(["tw-inline-flex tw-flex-1 preset-option tw-w-8 tw-whitespace-nowrap", { "selected-option": d.selectedOption == t }]),
             "data-testid": "bp-lend-cta-lend-button",
             onClick: (b) => e.clickPresetButton(t)
           }, {
@@ -729,7 +729,7 @@ function ue(n, s, l, D, d, e) {
     ], 32)) : c("", !0)
   ], 512);
 }
-const be = /* @__PURE__ */ W(K, [["render", ue], ["__scopeId", "data-v-60354743"]]);
+const be = /* @__PURE__ */ W(K, [["render", ue], ["__scopeId", "data-v-80882253"]]);
 export {
   De as KV_LEND_CTA_FRAGMENT,
   ye as KV_LEND_CTA_USER_FRAGMENT,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kiva/kv-components",
-  "version": "6.62.5",
+  "version": "6.64.0",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -114,5 +114,5 @@
     "embla-carousel-fade",
     "popper.js"
   ],
-  "gitHead": "d08a667dc9daf95910021aeac2b3f90666edd13e"
+  "gitHead": "00c839f41376d29da8b7675e9b6bfa32f040e056"
 }