@kiva/kv-components 8.18.0 → 8.18.2

package/dist/vue/KvClassicLoanCard.vue.d.ts

@@ -1239,7 +1239,11 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         tagText(): string;
         tagColor(): "#AF741C" | "#CE2626" | "#2B7C5F" | "#CE4A00";
         matchRatio(): any;
-    }, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    }, {
+        orgDisplayName(org: {
+            displayName?: string | null;
+        }): string;
+    }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
         loan: {
             type: ObjectConstructor;
             required: true;

package/dist/vue/KvCompactLoanCard.vue.d.ts

@@ -1196,7 +1196,11 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         tagText(): string;
         tagColor(): "#AF741C" | "#CE2626" | "#2B7C5F" | "#CE4A00";
         matchRatio(): any;
-    }, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    }, {
+        orgDisplayName(org: {
+            displayName?: string | null;
+        }): string;
+    }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
         loan: {
             type: ObjectConstructor;
             required: true;

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

@@ -514,7 +514,11 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         tagText(): string;
         tagColor(): "#AF741C" | "#CE2626" | "#2B7C5F" | "#CE4A00";
         matchRatio(): any;
-    }, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    }, {
+        orgDisplayName(org: {
+            displayName?: string | null;
+        }): string;
+    }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
         loan: {
             type: ObjectConstructor;
             required: true;

package/dist/vue/KvLoanTag.js

@@ -1,10 +1,10 @@
 import u from "./KvLoanTag2.js";
-import { KV_LOAN_TAG_FRAGMENT as L } from "./KvLoanTag2.js";
-import { resolveComponent as c, openBlock as e, createElementBlock as a, normalizeClass as _, normalizeStyle as g, Fragment as o, createTextVNode as i, toDisplayString as r, createElementVNode as h, createVNode as p, withCtx as f, renderList as k, createBlock as w, createCommentVNode as d } from "vue";
-import x from "../_virtual/_plugin-vue_export-helper.js";
-const y = ["id"];
+import { KV_LOAN_TAG_FRAGMENT as O } from "./KvLoanTag2.js";
+import { resolveComponent as c, openBlock as e, createElementBlock as a, normalizeClass as _, normalizeStyle as g, Fragment as o, createTextVNode as i, toDisplayString as r, createElementVNode as h, createVNode as f, withCtx as k, renderList as w, createBlock as x, createCommentVNode as m } from "vue";
+import y from "../_virtual/_plugin-vue_export-helper.js";
+const p = ["id"];
 function v(M, N, l, A, C, t) {
-  const m = c("kv-tooltip"), s = c("kv-countdown-timer");
+  const d = c("kv-tooltip"), s = c("kv-countdown-timer");
   return t.variation ? (e(), a("div", {
     key: 0,
     class: _(["tw-text-small tw-font-medium tw-pt-0.5", { "tw-line-clamp-1": !t.isMultipleMatch }]),
@@ -15,30 +15,30 @@ function v(M, N, l, A, C, t) {
       h("span", {
         id: `matching-orgs-${l.loan.id}`,
         class: "tw-underline tw-decoration-dotted tw-cursor-pointer"
-      }, r(t.multiMatchingOrgs.length) + " organizations", 9, y),
-      p(m, {
+      }, r(t.multiMatchingOrgs.length) + " organizations", 9, p),
+      f(d, {
         controller: `matching-orgs-${l.loan.id}`,
         theme: "default"
       }, {
-        default: f(() => [
-          (e(!0), a(o, null, k(t.multiMatchingOrgs, (n) => (e(), a("p", {
+        default: k(() => [
+          (e(!0), a(o, null, w(t.multiMatchingOrgs, (n) => (e(), a("p", {
             key: n.managedAccountId,
             class: "tw-m-0"
-          }, r(n.ratio + 1) + "x matching by " + r(n.displayName || "a Kiva supporter"), 1))), 128))
+          }, r(n.ratio + 1) + "x matching by " + r(t.orgDisplayName(n)), 1))), 128))
         ]),
         _: 1
       }, 8, ["controller"])
     ], 64)) : (e(), a(o, { key: 1 }, [
       i(r(t.tagText) + " ", 1),
-      t.variation === "ending-soon" ? (e(), w(s, {
+      t.variation === "ending-soon" ? (e(), x(s, {
         key: 0,
         deadline: t.deadline
-      }, null, 8, ["deadline"])) : d("", !0)
+      }, null, 8, ["deadline"])) : m("", !0)
     ], 64))
-  ], 6)) : d("", !0);
+  ], 6)) : m("", !0);
 }
-const B = /* @__PURE__ */ x(u, [["render", v]]);
+const B = /* @__PURE__ */ y(u, [["render", v]]);
 export {
-  L as KV_LOAN_TAG_FRAGMENT,
+  O as KV_LOAN_TAG_FRAGMENT,
   B as default
 };

package/dist/vue/KvLoanTag.vue.d.ts

@@ -23,7 +23,11 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     tagText(): string;
     tagColor(): "#AF741C" | "#CE2626" | "#2B7C5F" | "#CE4A00";
     matchRatio(): any;
-}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+}, {
+    orgDisplayName(org: {
+        displayName?: string | null;
+    }): string;
+}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     loan: {
         type: ObjectConstructor;
         required: true;

package/dist/vue/KvLoanTag2.js

@@ -2,13 +2,13 @@ import { parseISO as s, differenceInDays as r } from "date-fns";
 import u from "graphql-tag";
 import l from "numeral";
 import d from "./KvCountdownTimer.js";
-import h from "./KvTooltip.js";
-const m = "N/A", a = {
+import m from "./KvTooltip.js";
+const h = "N/A", a = {
   almostFunded: "almost-funded",
   endingSoon: "ending-soon",
   matchedLoan: "matched-loan",
   lseLoan: "lse-loan"
-}, L = u`
+}, y = u`
 	fragment KvLoanTag on LoanBasic {
 		id
 		loanFundraisingInfo {
@@ -29,11 +29,11 @@ const m = "N/A", a = {
 			partnerName
 		}
 	}
-`, A = {
+`, L = {
   name: "KvLoanTag",
   components: {
     KvCountdownTimer: d,
-    KvTooltip: h
+    KvTooltip: m
   },
   props: {
     loan: {
@@ -56,7 +56,7 @@ const m = "N/A", a = {
     },
     isLseLoan() {
       var t, n;
-      return ((n = (t = this.loan) == null ? void 0 : t.partnerName) == null ? void 0 : n.toUpperCase().includes(m)) ?? !1;
+      return ((n = (t = this.loan) == null ? void 0 : t.partnerName) == null ? void 0 : n.toUpperCase().includes(h)) ?? !1;
     },
     amountLeft() {
       var e, o;
@@ -88,7 +88,7 @@ const m = "N/A", a = {
         case a.matchedLoan: {
           if (this.enableMultiMatching && this.multiMatchingOrgs.length === 1) {
             const n = this.multiMatchingOrgs[0];
-            return `${this.useExpandedStyles ? "🤝 " : ""}${n.ratio + 1}x matching by ${n.displayName || "a Kiva supporter"}`;
+            return `${this.useExpandedStyles ? "🤝 " : ""}${n.ratio + 1}x matching by ${this.orgDisplayName(n)}`;
           }
           return `${this.useExpandedStyles ? "🤝 " : ""}${this.matchRatio + 1}x matching by ${(t = this.loan) == null ? void 0 : t.matchingText}`;
         }
@@ -112,9 +112,14 @@ const m = "N/A", a = {
       var t;
       return (t = this.loan) == null ? void 0 : t.matchRatio;
     }
+  },
+  methods: {
+    orgDisplayName(t) {
+      return t.displayName && t.displayName !== "Anonymous" ? t.displayName : "a Kiva supporter";
+    }
   }
 };
 export {
-  L as KV_LOAN_TAG_FRAGMENT,
-  A as default
+  y as KV_LOAN_TAG_FRAGMENT,
+  L as default
 };

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

@@ -1153,7 +1153,11 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         tagText(): string;
         tagColor(): "#AF741C" | "#CE2626" | "#2B7C5F" | "#CE4A00";
         matchRatio(): any;
-    }, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    }, {
+        orgDisplayName(org: {
+            displayName?: string | null;
+        }): string;
+    }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
         loan: {
             type: ObjectConstructor;
             required: true;

package/dist/vue/KvWwwHeaderBasic/LinkBar.css

@@ -1 +1 @@
-.link-bar[data-v-a53394e2]{display:flex;align-items:center;gap:.5rem}.link-bar__logo[data-v-a53394e2]{position:absolute;top:50%;left:50%;--tw-translate-x: -50%;--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}@media (min-width: 45.875rem){.link-bar[data-v-a53394e2]{display:grid;-moz-column-gap:1rem;column-gap:1rem;grid-template-areas:"logo lend right" "search search search";grid-template-columns:1fr auto auto;grid-template-rows:4rem auto;row-gap:.5rem}.link-bar__logo[data-v-a53394e2]{position:static;--tw-translate-x: 0;--tw-translate-y: 0;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));grid-area:logo;justify-self:start}.link-bar__lend[data-v-a53394e2]{grid-area:lend}.link-bar__search[data-v-a53394e2]{grid-area:search;margin-bottom:.5rem}.link-bar__right[data-v-a53394e2]{grid-area:right}}@media (min-width: 64rem){.link-bar[data-v-a53394e2]{-moz-column-gap:1.25rem;column-gap:1.25rem;grid-template-areas:"logo lend search right";grid-template-columns:auto auto 1fr auto;grid-template-rows:4rem}.link-bar__search[data-v-a53394e2]{margin-bottom:0}}.header-link[data-v-a53394e2]{cursor:pointer;padding-top:1rem;padding-bottom:1rem;--tw-text-opacity: 1;color:rgba(var(--text-primary),var(--tw-text-opacity, 1));text-decoration-line:none}.header-link[data-v-a53394e2]:hover{--tw-text-opacity: 1;color:rgba(var(--text-action),var(--tw-text-opacity, 1));text-decoration-line:none}
+.link-bar[data-v-d90acda7]{display:flex;align-items:center;gap:.5rem}.link-bar__logo[data-v-d90acda7]{position:absolute;top:50%;left:50%;--tw-translate-x: -50%;--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}@media (min-width: 45.875rem){.link-bar[data-v-d90acda7]{display:grid;-moz-column-gap:1rem;column-gap:1rem;grid-template-areas:"logo lend right" "search search search";grid-template-columns:1fr auto auto;grid-template-rows:4rem auto;row-gap:.5rem}.link-bar__logo[data-v-d90acda7]{position:static;--tw-translate-x: 0;--tw-translate-y: 0;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));grid-area:logo;justify-self:start}.link-bar__lend[data-v-d90acda7]{grid-area:lend}.link-bar__search[data-v-d90acda7]{grid-area:search;margin-bottom:.5rem}.link-bar__right[data-v-d90acda7]{grid-area:right}}@media (min-width: 64rem){.link-bar[data-v-d90acda7]{-moz-column-gap:1.25rem;column-gap:1.25rem;grid-template-areas:"logo lend search right";grid-template-columns:auto auto 1fr auto;grid-template-rows:4rem}.link-bar__search[data-v-d90acda7]{margin-bottom:0}}.header-link[data-v-d90acda7]{cursor:pointer;padding-top:1rem;padding-bottom:1rem;--tw-text-opacity: 1;color:rgba(var(--text-primary),var(--tw-text-opacity, 1));text-decoration-line:none}.header-link[data-v-d90acda7]:hover{--tw-text-opacity: 1;color:rgba(var(--text-action),var(--tw-text-opacity, 1));text-decoration-line:none}

package/dist/vue/KvWwwHeaderBasic/LinkBar.js

@@ -1,8 +1,8 @@
-import C from "./LinkBar2.js";
-import { resolveComponent as d, openBlock as a, createElementBlock as i, createElementVNode as l, withModifiers as h, createVNode as r, withCtx as k, createTextVNode as s, Fragment as M, renderList as p, toDisplayString as m, createCommentVNode as w, withDirectives as x, vShow as L, createBlock as B } from "vue";
+import M from "./LinkBar2.js";
+import { resolveComponent as d, openBlock as a, createElementBlock as i, createElementVNode as r, withModifiers as g, createVNode as l, withCtx as w, createTextVNode as s, Fragment as y, renderList as p, toDisplayString as m, createCommentVNode as v, withDirectives as x, vShow as L, createBlock as B } from "vue";
 import "./LinkBar.css";
 import O from "../../_virtual/_plugin-vue_export-helper.js";
-const S = { class: "link-bar__right tw-flex tw-items-center tw-justify-end tw-ml-auto md:tw-ml-0 tw-gap-1 md:tw-gap-2 lg:tw-gap-2.5" }, T = ["href", "data-testid", "onClick"], D = ["href"], U = { class: "tw-hidden md:tw-flex tw-items-center" }, H = { class: "tw-bg-secondary tw-rounded-xs tw-py-0.5 tw-px-1 tw-mr-1 tw-leading-none" }, I = { class: "tw-relative tw-flex md:tw-hidden tw-items-center tw-text-eco-green-4" }, A = {
+const S = { class: "link-bar__right tw-flex tw-items-center tw-justify-end tw-ml-auto md:tw-ml-0 tw-gap-1 md:tw-gap-2 lg:tw-gap-2.5" }, T = ["href", "data-testid", "onClick"], D = ["href"], U = { class: "tw-hidden md:tw-flex tw-items-center" }, H = { class: "tw-bg-secondary tw-rounded-xs tw-py-0.5 tw-px-1 tw-mr-1 tw-leading-none" }, A = { class: "tw-relative tw-flex md:tw-hidden tw-items-center tw-text-eco-green-4" }, I = {
   key: 0,
   class: "tw-absolute tw-w-4 tw-h-4 tw-pt-0.5 tw-flex tw-items-center tw-justify-center tw-text-white tw-text-small tw-font-medium tw-pointer-events-none"
 }, K = { class: "tw-hidden md:tw-block" }, N = {
@@ -15,30 +15,30 @@ const S = { class: "link-bar__right tw-flex tw-items-center tw-justify-end tw-ml
   key: 2,
   class: "tw-w-3 tw-h-3 tw-rounded-full tw-overflow-hidden"
 };
-function V(v, n, o, e, j, X) {
-  const c = d("kv-material-icon"), b = d("kv-header-logo"), u = d("kv-header-dropdown-link"), f = d("search-bar"), _ = d("kv-button"), g = d("kv-loading-placeholder"), y = d("kv-user-avatar");
+function V(k, n, o, e, j, X) {
+  const c = d("kv-material-icon"), b = d("kv-header-logo"), u = d("kv-header-dropdown-link"), f = d("search-bar"), _ = d("kv-button"), h = d("kv-loading-placeholder"), C = d("kv-user-avatar");
   return a(), i("div", {
     class: "link-bar tw-min-h-[4rem] tw-font-medium tw-relative",
     onTouchstart: n[12] || (n[12] = (...t) => e.handleEmptySpaceClick && e.handleEmptySpaceClick(...t))
   }, [
-    l("button", {
+    r("button", {
       type: "button",
       "aria-label": "Open menu",
       class: "header-link link-bar__hamburger tw-inline-flex md:tw-hidden",
       onMouseover: n[0] || (n[0] = (t) => e.handleOnHover("menuButton", e.MobileMenu)),
-      onTouchstart: n[1] || (n[1] = h((t) => e.handleTouchStart("menuButton", e.MobileMenu), ["stop", "prevent"]))
+      onTouchstart: n[1] || (n[1] = g((t) => e.handleTouchStart("menuButton", e.MobileMenu), ["stop", "prevent"]))
     }, [
-      r(c, { icon: e.mdiMenu }, null, 8, ["icon"])
+      l(c, { icon: e.mdiMenu }, null, 8, ["icon"])
     ], 32),
-    l("a", {
+    r("a", {
       href: "/",
       "aria-label": "Kiva home",
       class: "link-bar__logo tw-px-1 tw-py-2 tw-cursor-pointer",
       onClick: n[2] || (n[2] = (...t) => e.onLogoClick && e.onLogoClick(...t))
     }, [
-      r(b)
+      l(b)
     ]),
-    r(u, {
+    l(u, {
       class: "link-bar__lend",
       "ref-name": "lendButton",
       href: e.lendUrl,
@@ -50,28 +50,28 @@ function V(v, n, o, e, j, X) {
       onMouseleave: n[3] || (n[3] = (t) => e.handleMouseOut("lendButton")),
       onUserTap: e.handleTouchStart
     }, {
-      default: k(() => n[13] || (n[13] = [
+      default: w(() => n[13] || (n[13] = [
         s(" Lend ")
       ])),
       _: 1
     }, 8, ["href", "menu-component", "open-menu-item", "dropdown-icon", "onOnHover", "onUserTap"]),
-    r(f, {
+    l(f, {
       class: "link-bar__search tw-min-w-0 tw-hidden md:tw-block",
       "search-suggestions": o.searchSuggestions,
       "app-origin": o.appOrigin,
       "is-mobile": o.isMobile,
-      onLoadSearchData: n[4] || (n[4] = (t) => v.$emit("load-search-data")),
-      onSearchSubmit: n[5] || (n[5] = (t) => v.$emit("search-submit", t))
+      onLoadSearchData: n[4] || (n[4] = (t) => k.$emit("load-search-data")),
+      onSearchSubmit: n[5] || (n[5] = (t) => k.$emit("search-submit", t))
     }, null, 8, ["search-suggestions", "app-origin", "is-mobile"]),
-    l("div", S, [
-      (a(!0), i(M, null, p(e.visiblePrimaryLinks, (t) => (a(), i("a", {
+    r("div", S, [
+      (a(!0), i(y, null, p(e.visiblePrimaryLinks, (t) => (a(), i("a", {
         key: t.id,
         href: t.href,
         class: "header-link tw-hidden md:tw-block",
         "data-testid": `header-link-${t.id}`,
         onClick: (F) => e.onPrimaryClick(t)
       }, m(t.label), 9, T))), 128)),
-      r(u, {
+      l(u, {
         "ref-name": "aboutLink",
         class: "tw-hidden md:tw-block",
         "menu-component": e.AboutMenu,
@@ -83,79 +83,79 @@ function V(v, n, o, e, j, X) {
         onMouseleave: n[6] || (n[6] = (t) => e.handleMouseOut("aboutLink")),
         onUserTap: e.handleTouchStart
       }, {
-        default: k(() => n[14] || (n[14] = [
+        default: w(() => n[14] || (n[14] = [
           s(" About ")
         ])),
         _: 1
       }, 8, ["menu-component", "open-menu-item", "dropdown-icon", "onOnHover", "onUserTap"]),
-      o.loggedIn ? w("", !0) : (a(), i("a", {
+      o.loggedIn ? v("", !0) : (a(), i("a", {
         key: 0,
         href: o.loginUrl,
         class: "header-link",
         "data-testid": "header-login",
         onClick: n[7] || (n[7] = (...t) => e.onLoginClick && e.onLoginClick(...t))
       }, "Log in", 8, D)),
-      o.loggedIn ? x((a(), i("a", {
-        key: 1,
+      x(r("a", {
         href: "/basket",
         class: "header-link tw-flex tw-items-center",
         "data-testid": "header-basket",
         onClick: n[8] || (n[8] = (...t) => e.onBasketClick && e.onBasketClick(...t))
       }, [
-        l("span", U, [
-          l("span", H, m(o.basketCount), 1),
+        r("span", U, [
+          r("span", H, m(o.basketCount), 1),
           n[15] || (n[15] = s(" Basket "))
         ]),
-        l("span", I, [
-          o.isBasketDataLoading ? w("", !0) : (a(), i("span", A, m(o.basketCount), 1)),
-          r(c, {
+        r("span", A, [
+          o.isBasketDataLoading ? v("", !0) : (a(), i("span", I, m(o.basketCount), 1)),
+          l(c, {
             icon: e.mdiBriefcase,
             class: "tw-w-4 tw-h-4 tw-pointer-events-none"
           }, null, 8, ["icon"]),
-          n[16] || (n[16] = l("span", { class: "tw-sr-only" }, "Basket", -1))
+          n[16] || (n[16] = r("span", { class: "tw-sr-only" }, "Basket", -1))
         ])
-      ], 512)), [
+      ], 512), [
         [L, o.basketCount > 0 || o.isBasketDataLoading]
-      ]) : w("", !0),
-      l("div", K, [
-        r(_, {
+      ]),
+      r("div", K, [
+        l(_, {
           variant: "secondary",
           href: "/donate/supportus",
           class: "tw-whitespace-nowrap",
           "data-testid": "header-support-kiva",
           onClick: e.onSupportKivaClick
         }, {
-          default: k(() => n[17] || (n[17] = [
+          default: w(() => n[17] || (n[17] = [
             s(" Support Kiva ")
           ])),
           _: 1
         }, 8, ["onClick"])
       ]),
       o.loggedIn ? (a(), i("div", {
-        key: 2,
+        key: 1,
         ref: "avatarMenu",
+        "data-testid": "header-avatar-menu",
         class: "tw-flex tw-items-center tw-gap-1 tw-cursor-pointer tw-py-1",
         onMouseenter: n[9] || (n[9] = (t) => e.handleOnHover("avatarMenu", e.MyKivaMenu, e.getAvatarMenuPosition(), e.getAvatarTriggerCenterX())),
         onMouseleave: n[10] || (n[10] = (t) => e.handleMouseOut("avatarMenu")),
-        onTouchstart: n[11] || (n[11] = h((t) => e.handleTouchStart("avatarMenu", e.MyKivaMenu, e.getAvatarMenuPosition(), e.getAvatarTriggerCenterX()), ["stop"]))
+        onTouchstart: n[11] || (n[11] = g((t) => e.handleTouchStart("avatarMenu", e.MyKivaMenu, e.getAvatarMenuPosition(), e.getAvatarTriggerCenterX()), ["stop"]))
       }, [
         o.isUserDataLoading ? (a(), i("div", N, [
-          r(g)
+          l(h)
         ])) : (a(), i("span", E, m(e.formattedBalance), 1)),
         o.isUserDataLoading ? (a(), i("div", P, [
-          r(g)
-        ])) : (a(), B(y, {
+          l(h)
+        ])) : (a(), B(C, {
           key: 3,
           class: "tw-w-3 tw-h-3",
           "lender-name": o.lenderName,
           "lender-image-url": o.lenderImageUrl,
           "is-small": ""
         }, null, 8, ["lender-name", "lender-image-url"]))
-      ], 544)) : w("", !0)
+      ], 544)) : v("", !0)
     ])
   ], 32);
 }
-const Q = /* @__PURE__ */ O(C, [["render", V], ["__scopeId", "data-v-a53394e2"]]);
+const Q = /* @__PURE__ */ O(M, [["render", V], ["__scopeId", "data-v-d90acda7"]]);
 export {
   Q as default
 };

package/dist/vue/KvWwwHeaderBasic/LinkBar.vue.d.ts

@@ -196,6 +196,9 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         };
     }>, {
         onClose: () => void;
+        onAboutToggle: ({ open }: {
+            open: boolean;
+        }) => void;
         onLinkClick: (action: string) => void;
     }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "closing-menu"[], "closing-menu", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
         loggedIn: {

package/dist/vue/KvWwwHeaderBasic/LinkBar2.js

@@ -1,24 +1,24 @@
-import { defineAsyncComponent as l, inject as U, ref as s, computed as a } from "vue";
-import { mdiMenu as w, mdiChevronDown as A, mdiBriefcase as P } from "@mdi/js";
-import O from "numeral";
-import D from "../KvMaterialIcon.js";
-import x from "../KvUserAvatar.js";
-import R from "../KvLoadingPlaceholder.js";
-import $ from "../KvButton.js";
-import E from "../KvWwwHeader/KvHeaderLogo.js";
-import H from "../KvWwwHeader/KvHeaderDropdownLink.js";
-import { PRIMARY_LINKS as _ } from "../../utils/headerNavLinks.js";
-import j from "./SearchBar.js";
-const d = l(() => import("../KvWwwHeader/LendMenu/KvLendMenu.js")), m = l(() => import("./AboutMenu.js")), F = l(() => import("./MyKivaMenu.js")), G = l(() => import("./MobileMenu.js")), ne = {
+import { defineAsyncComponent as r, inject as P, ref as d, computed as i } from "vue";
+import { mdiMenu as D, mdiChevronDown as x, mdiBriefcase as R } from "@mdi/js";
+import $ from "numeral";
+import E from "../KvMaterialIcon.js";
+import H from "../KvUserAvatar.js";
+import _ from "../KvLoadingPlaceholder.js";
+import j from "../KvButton.js";
+import F from "../KvWwwHeader/KvHeaderLogo.js";
+import G from "../KvWwwHeader/KvHeaderDropdownLink.js";
+import { PRIMARY_LINKS as W } from "../../utils/headerNavLinks.js";
+import X from "./SearchBar.js";
+const v = r(() => import("../KvWwwHeader/LendMenu/KvLendMenu.js")), p = r(() => import("./AboutMenu.js")), Y = r(() => import("./MyKivaMenu.js")), q = r(() => import("./MobileMenu.js")), ie = {
   name: "LinkBar",
   components: {
-    KvMaterialIcon: D,
-    KvUserAvatar: x,
-    KvLoadingPlaceholder: R,
-    KvButton: $,
-    KvHeaderLogo: E,
-    KvHeaderDropdownLink: H,
-    SearchBar: j
+    KvMaterialIcon: E,
+    KvUserAvatar: H,
+    KvLoadingPlaceholder: _,
+    KvButton: j,
+    KvHeaderLogo: F,
+    KvHeaderDropdownLink: G,
+    SearchBar: X
   },
   props: {
     loggedIn: { type: Boolean, default: !1 },
@@ -41,74 +41,89 @@ const d = l(() => import("../KvWwwHeader/LendMenu/KvLendMenu.js")), m = l(() =>
     openMenuItem: { type: [Object, Function], default: null }
   },
   emits: ["item-hover", "load-search-data", "search-submit"],
-  setup(t, { emit: r }) {
-    const i = U("$kvTrackEvent", () => {
-    }), o = s(null), u = s(null);
-    function p() {
+  setup(t, { emit: l }) {
+    const o = P("$kvTrackEvent", () => {
+    }), a = d(null), u = d(null);
+    function g() {
       const e = u.value, n = e == null ? void 0 : e.getBoundingClientRect();
       return n ? t.isMobile ? { right: "0" } : { right: `${window.innerWidth - n.right}px` } : null;
     }
-    function g() {
+    function b() {
       if (t.isMobile) return null;
       const e = u.value, n = e == null ? void 0 : e.getBoundingClientRect();
       return n ? n.left + n.width / 2 : null;
     }
-    const v = a(() => _.filter((e) => e.visibility === "visitor" ? !t.loggedIn : e.visibility === "loggedIn" ? t.loggedIn : !0)), y = a(() => t.isMobile ? void 0 : "/lend-by-category"), h = a(() => O(Math.floor(t.balance)).format("$0")), k = a(() => t.openMenuItem === d ? t.openMenuItem : null), M = a(() => t.openMenuItem === m ? t.openMenuItem : null);
-    function b(e, n, c = null, f = null) {
-      navigator.maxTouchPoints || (o.value = e, r("item-hover", e, n, c, f));
+    const h = i(() => W.filter((e) => e.visibility === "visitor" ? !t.loggedIn : e.visibility === "loggedIn" ? t.loggedIn : !0)), k = i(() => t.isMobile ? void 0 : "/lend-by-category"), y = i(() => $(Math.floor(t.balance)).format("$0")), M = i(() => t.openMenuItem === v ? t.openMenuItem : null), B = i(() => t.openMenuItem === p ? t.openMenuItem : null), L = {
+      menuButton: { action: "hover-Mobile-menu", label: "Mobile" },
+      lendButton: { action: "hover-Lend-menu", label: "Lend" },
+      aboutLink: { action: "hover-About-menu", label: "About" },
+      avatarMenu: { action: "hover-User-menu", label: "User" }
+    }, I = {
+      menuButton: { action: "close-Mobile-menu", label: "Mobile" }
+    };
+    function s(e) {
+      const n = L[e];
+      n && o("TopNav", n.action, n.label);
+    }
+    function m(e) {
+      const n = I[e];
+      n && o("TopNav", n.action, n.label);
+    }
+    function T(e, n, c = null, f = null) {
+      navigator.maxTouchPoints || (a.value !== e && s(e), a.value = e, l("item-hover", e, n, c, f));
     }
-    function B(e) {
-      navigator.maxTouchPoints || o.value === e && (o.value = null, r("item-hover"));
+    function C(e) {
+      navigator.maxTouchPoints || a.value === e && (m(e), a.value = null, l("item-hover"));
     }
-    function I(e, n, c = null, f = null) {
-      o.value === e ? (o.value = null, r("item-hover")) : (o.value = e, r("item-hover", e, n, c, f));
+    function S(e, n, c = null, f = null) {
+      a.value === e ? (m(e), a.value = null, l("item-hover")) : (s(e), a.value = e, l("item-hover", e, n, c, f));
     }
-    function L(e) {
-      e.target === e.currentTarget && r("item-hover");
+    function N(e) {
+      e.target === e.currentTarget && l("item-hover");
     }
-    function S(e) {
-      i(e.track[0], e.track[1]);
+    function K(e) {
+      o(e.track[0], e.track[1]);
     }
-    function T() {
-      i("TopNav", "click-Log-in");
+    function U() {
+      o("TopNav", "click-Log-in");
     }
-    function C() {
-      i("TopNav", "click-Basket");
+    function A() {
+      o("TopNav", "click-Basket");
     }
-    function K() {
-      i("TopNav", "click-Support-Kiva");
+    function O() {
+      o("TopNav", "click-Support-Kiva");
     }
-    function N() {
-      i("TopNav", "click-Logo");
+    function w() {
+      o("TopNav", "click-Logo");
     }
     return {
-      mdiMenu: w,
-      mdiChevronDown: A,
-      mdiBriefcase: P,
-      KvLendMenu: d,
-      AboutMenu: m,
-      MyKivaMenu: F,
-      MobileMenu: G,
+      mdiMenu: D,
+      mdiChevronDown: x,
+      mdiBriefcase: R,
+      KvLendMenu: v,
+      AboutMenu: p,
+      MyKivaMenu: Y,
+      MobileMenu: q,
       avatarMenu: u,
-      getAvatarMenuPosition: p,
-      getAvatarTriggerCenterX: g,
-      visiblePrimaryLinks: v,
-      lendUrl: y,
-      formattedBalance: h,
-      lendOpenItem: k,
-      aboutOpenItem: M,
-      handleOnHover: b,
-      handleMouseOut: B,
-      handleTouchStart: I,
-      handleEmptySpaceClick: L,
-      onPrimaryClick: S,
-      onLoginClick: T,
-      onBasketClick: C,
-      onSupportKivaClick: K,
-      onLogoClick: N
+      getAvatarMenuPosition: g,
+      getAvatarTriggerCenterX: b,
+      visiblePrimaryLinks: h,
+      lendUrl: k,
+      formattedBalance: y,
+      lendOpenItem: M,
+      aboutOpenItem: B,
+      handleOnHover: T,
+      handleMouseOut: C,
+      handleTouchStart: S,
+      handleEmptySpaceClick: N,
+      onPrimaryClick: K,
+      onLoginClick: U,
+      onBasketClick: A,
+      onSupportKivaClick: O,
+      onLogoClick: w
     };
   }
 };
 export {
-  ne as default
+  ie as default
 };

package/dist/vue/KvWwwHeaderBasic/MobileMenu.css

@@ -1 +1 @@
-.mobile-link[data-v-e3e9102f]{--tw-text-opacity: 1;color:rgba(var(--text-primary),var(--tw-text-opacity, 1));text-decoration-line:none}.mobile-link[data-v-e3e9102f]:hover{--tw-text-opacity: 1;color:rgba(var(--text-action),var(--tw-text-opacity, 1));text-decoration-line:underline}#header-basic-mobile-about-container[data-v-e3e9102f] button{padding-top:0;padding-bottom:0}#header-basic-mobile-about-container[data-v-e3e9102f] nav{padding-bottom:0}
+.mobile-link[data-v-bc7e1655]{--tw-text-opacity: 1;color:rgba(var(--text-primary),var(--tw-text-opacity, 1));text-decoration-line:none}.mobile-link[data-v-bc7e1655]:hover{--tw-text-opacity: 1;color:rgba(var(--text-action),var(--tw-text-opacity, 1));text-decoration-line:underline}#header-basic-mobile-about-container[data-v-bc7e1655] button{padding-top:0;padding-bottom:0}#header-basic-mobile-about-container[data-v-bc7e1655] nav{padding-bottom:0}

package/dist/vue/KvWwwHeaderBasic/MobileMenu.js

@@ -1,52 +1,53 @@
 import c from "./MobileMenu2.js";
-import { resolveComponent as i, openBlock as m, createElementBlock as d, createVNode as l, withCtx as r, createElementVNode as t } from "vue";
+import { resolveComponent as i, openBlock as m, createElementBlock as d, createVNode as l, withCtx as r, createElementVNode as e } from "vue";
 import "./MobileMenu.css";
-import p from "../../_virtual/_plugin-vue_export-helper.js";
+import b from "../../_virtual/_plugin-vue_export-helper.js";
 const w = {
   id: "header-basic-mobile-about-container",
   class: "tw-flex tw-flex-col tw-items-stretch tw-font-medium tw-p-2.5 md:tw-hidden"
-}, u = {
+}, p = {
   "aria-label": "Mobile menu",
   class: "tw-flex tw-flex-col tw-gap-2 tw-pt-1.5"
 };
-function b(k, o, f, e, _, v) {
+function u(k, o, f, t, _, v) {
   const a = i("about-menu"), s = i("kv-accordion-item");
   return m(), d("div", w, [
     l(s, {
       id: "kv-www-header-basic-about",
-      class: "tw-w-full tw-border-b-0"
+      class: "tw-w-full tw-border-b-0",
+      onToggle: t.onAboutToggle
     }, {
       header: r(() => o[3] || (o[3] = [
-        t("span", { class: "tw-text-button tw-pb-0.5" }, " About ", -1)
+        e("span", { class: "tw-text-button tw-pb-0.5" }, " About ", -1)
       ])),
       default: r(() => [
         l(a, {
           "is-mobile": "",
-          onClosingMenu: e.onClose
+          onClosingMenu: t.onClose
         }, null, 8, ["onClosingMenu"])
       ]),
       _: 1
-    }),
-    t("nav", u, [
-      t("a", {
+    }, 8, ["onToggle"]),
+    e("nav", p, [
+      e("a", {
         href: "/about/partner-with-us",
         class: "mobile-link",
-        onClick: o[0] || (o[0] = (n) => e.onLinkClick("click-Partner"))
+        onClick: o[0] || (o[0] = (n) => t.onLinkClick("click-Partner"))
       }, "Partner"),
-      t("a", {
+      e("a", {
         href: "/donate/supportus",
         class: "mobile-link",
-        onClick: o[1] || (o[1] = (n) => e.onLinkClick("click-Support-Kiva"))
+        onClick: o[1] || (o[1] = (n) => t.onLinkClick("click-Support-Kiva"))
       }, "Support Kiva"),
-      t("a", {
+      e("a", {
         href: "/borrow",
         class: "mobile-link",
-        onClick: o[2] || (o[2] = (n) => e.onLinkClick("click-Borrow"))
+        onClick: o[2] || (o[2] = (n) => t.onLinkClick("click-Borrow"))
       }, "Borrow")
     ])
   ]);
 }
-const B = /* @__PURE__ */ p(c, [["render", b], ["__scopeId", "data-v-e3e9102f"]]);
+const M = /* @__PURE__ */ b(c, [["render", u], ["__scopeId", "data-v-bc7e1655"]]);
 export {
-  B as default
+  M as default
 };

package/dist/vue/KvWwwHeaderBasic/MobileMenu.vue.d.ts

@@ -13,6 +13,9 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     };
 }>, {
     onClose: () => void;
+    onAboutToggle: ({ open }: {
+        open: boolean;
+    }) => void;
     onLinkClick: (action: string) => void;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "closing-menu"[], "closing-menu", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     loggedIn: {

package/dist/vue/KvWwwHeaderBasic/MobileMenu2.js

@@ -1,9 +1,9 @@
-import { inject as l } from "vue";
+import { inject as u } from "vue";
 import r from "../KvAccordionItem.js";
-import s from "./AboutMenu.js";
+import c from "./AboutMenu.js";
 const m = {
   name: "MobileMenu",
-  components: { KvAccordionItem: r, AboutMenu: s },
+  components: { KvAccordionItem: r, AboutMenu: c },
   props: {
     loggedIn: {
       type: Boolean,
@@ -19,16 +19,19 @@ const m = {
     }
   },
   emits: ["closing-menu"],
-  setup(c, { emit: o }) {
-    const n = l("$kvTrackEvent", () => {
+  setup(s, { emit: n }) {
+    const e = u("$kvTrackEvent", () => {
     });
-    function e() {
-      o("closing-menu");
+    function t() {
+      n("closing-menu");
     }
-    function t(i) {
-      n("TopNav", i), o("closing-menu");
+    function i({ open: o }) {
+      o && e("TopNav", "hover-About-menu", "About");
     }
-    return { onClose: e, onLinkClick: t };
+    function l(o) {
+      e("TopNav", o), n("closing-menu");
+    }
+    return { onClose: t, onAboutToggle: i, onLinkClick: l };
   }
 };
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kiva/kv-components",
-  "version": "8.18.0",
+  "version": "8.18.2",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -128,5 +128,5 @@
   "dependencies": {
     "fuse.js": "^7.1.0"
   },
-  "gitHead": "34c0c8109e5d079a5d08fedda139c2ecee8fdc8e"
+  "gitHead": "59adb1cf9788530cdbe75a331f453b2efef57c0a"
 }