@kiva/kv-components 6.53.0 → 6.53.1

package/dist/vue/KvWwwHeader/KvHeaderLinkBar.css

@@ -1 +1 @@
-.header-link[data-v-6728d6d1]{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-6728d6d1]:hover{--tw-text-opacity: 1;color:rgba(var(--text-action),var(--tw-text-opacity, 1));text-decoration-line:none}
+.header-link[data-v-69cf3729]{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-69cf3729]:hover{--tw-text-opacity: 1;color:rgba(var(--text-action),var(--tw-text-opacity, 1));text-decoration-line:none}

package/dist/vue/KvWwwHeader/KvHeaderLinkBar.js

@@ -1,17 +1,18 @@
-import { defineAsyncComponent as k, ref as r, computed as j, onMounted as q, onUnmounted as G, resolveComponent as h, resolveDirective as J, openBlock as i, createElementBlock as m, withDirectives as s, normalizeClass as p, createVNode as D, createBlock as w, withCtx as L, createTextVNode as M, createElementVNode as C, createCommentVNode as y, vShow as Q, toDisplayString as X, Fragment as Y } from "vue";
-import { mdiAccountCircle as Z, mdiChevronDown as $, mdiMagnify as ee, mdiMenu as ne } from "@mdi/js";
-import te from "numeral";
-import oe from "../KvMaterialIcon.js";
-import le from "../KvIconBag.js";
+import { defineAsyncComponent as k, ref as a, computed as D, onMounted as G, onUnmounted as J, resolveComponent as h, resolveDirective as Q, openBlock as r, createElementBlock as s, withDirectives as v, normalizeClass as p, createVNode as C, createBlock as w, withCtx as L, createTextVNode as M, createElementVNode as E, createCommentVNode as y, vShow as X, toDisplayString as Y, Fragment as Z } from "vue";
+import { mdiAccountCircle as $, mdiChevronDown as ee, mdiMagnify as ne, mdiMenu as te } from "@mdi/js";
+import oe from "numeral";
+import le from "../KvMaterialIcon.js";
+import ae from "../KvIconBag.js";
 import re from "./KvHeaderDropdownLink.js";
 import ie from "../KvUserAvatar.js";
-import { throttle as ae } from "../../utils/throttle.js";
+import { throttle as ue } from "../../utils/throttle.js";
+import { isLegacyPlaceholderAvatar as de } from "../../utils/imageUtils.js";
 import "./KvHeaderLinkBar.css";
-import ue from "../../_virtual/_plugin-vue_export-helper.js";
-const de = k(() => import("./KvHeaderMobileMenu.js")), E = k(() => import("./KvHeaderMyKivaMenu.js")), me = k(() => import("./LendMenu/KvLendMenu.js")), se = k(() => import("./KvHeaderTakeActionMenu.js")), ve = k(() => import("./KvHeaderAboutMenu.js")), S = 146, A = "avatar-menu", B = "menuButton", V = { top: "-3.75rem", width: "100%" }, ce = {
+import me from "../../_virtual/_plugin-vue_export-helper.js";
+const se = k(() => import("./KvHeaderMobileMenu.js")), S = k(() => import("./KvHeaderMyKivaMenu.js")), ve = k(() => import("./LendMenu/KvLendMenu.js")), ce = k(() => import("./KvHeaderTakeActionMenu.js")), fe = k(() => import("./KvHeaderAboutMenu.js")), P = 146, A = "avatar-menu", B = "menuButton", V = { top: "-3.75rem", width: "100%" }, we = {
   components: {
-    KvMaterialIcon: oe,
-    KvIconBag: le,
+    KvMaterialIcon: le,
+    KvIconBag: ae,
     KvHeaderDropdownLink: re,
     KvUserAvatar: ie
   },
@@ -56,205 +57,210 @@ const de = k(() => import("./KvHeaderMobileMenu.js")), E = k(() => import("./KvH
   emits: [
     "item-hover"
   ],
-  setup(v, { emit: e }) {
-    const t = r(null), n = r(null), K = r(null), O = r(null), g = r(null), f = r(null), I = r(null), T = r(null), a = r(null), o = r(null), H = r(!1), b = r(), u = (l, d, c = null) => {
-      e("item-hover", l, d, c);
-    }, P = (l, d, c = null) => {
-      navigator.maxTouchPoints || (o.value = l, u(
+  setup(u, { emit: n }) {
+    const t = a(null), e = a(null), K = a(null), O = a(null), g = a(null), f = a(null), I = a(null), T = a(null), i = a(null), o = a(null), H = a(!1), b = a(), d = (l, m, c = null) => {
+      n("item-hover", l, m, c);
+    }, R = (l, m, c = null) => {
+      navigator.maxTouchPoints || (o.value = l, d(
         l,
-        d,
-        l === B && v.isMobile ? V : c
+        m,
+        l === B && u.isMobile ? V : c
       ));
-    }, R = (l) => {
-      !H.value && o.value === l && (o.value = null, u());
+    }, F = (l) => {
+      !H.value && o.value === l && (o.value = null, d());
     }, z = () => {
       var N, _;
       const l = (_ = (N = t.value) == null ? void 0 : N.userAvatar) == null ? void 0 : _.getBoundingClientRect();
       if (!l) return null;
-      const c = l.left + l.width / 2 - S / 2;
+      const c = l.left + l.width / 2 - P / 2;
       return {
-        ...c + S > window.innerWidth ? { right: 0 } : { left: v.isMobile ? 0 : `${c}px` },
+        ...c + P > window.innerWidth ? { right: 0 } : { left: u.isMobile ? 0 : `${c}px` },
         marginTop: "-2px",
         // Avoid closing avatar menu on header edge
-        borderRadius: v.isMobile ? "auto" : "0px 0px 8px 8px"
+        borderRadius: u.isMobile ? "auto" : "0px 0px 8px 8px"
       };
     }, x = () => {
-      o.value = A, u(t.value, E, z());
-    }, W = (l, d) => {
-      b.value = null, H.value = !0, b.value && clearTimeout(b.value), o.value === B && (o.value = null), !o.value || o.value !== l ? (o.value = l, l === A ? x() : l === B && v.isMobile ? u(l, d, V) : u(l, d)) : (o.value = null, u()), b.value = setTimeout(() => {
+      o.value = A, d(t.value, S, z());
+    }, W = (l, m) => {
+      b.value = null, H.value = !0, b.value && clearTimeout(b.value), o.value === B && (o.value = null), !o.value || o.value !== l ? (o.value = l, l === A ? x() : l === B && u.isMobile ? d(l, m, V) : d(l, m)) : (o.value = null, d()), b.value = setTimeout(() => {
         H.value = !1;
       }, 500);
-    }, U = ae(() => {
+    }, U = ue(() => {
       o.value === A && x();
-    }, 100), F = j(() => v.isMobile ? void 0 : "/lend-by-category");
-    return q(() => {
+    }, 100), j = D(() => u.isMobile ? void 0 : "/lend-by-category"), q = D(() => {
+      var l;
+      return ((l = u.lenderImageUrl) == null ? void 0 : l.split("/").pop()) ?? "";
+    });
+    return G(() => {
       import("./KvHeaderMobileMenu.js"), import("./KvHeaderMyKivaMenu.js"), import("./LendMenu/KvLendMenu.js"), import("./KvHeaderTakeActionMenu.js"), import("./KvHeaderAboutMenu.js"), window.addEventListener("resize", U);
-    }), G(() => {
+    }), J(() => {
       window.removeEventListener("resize", U);
     }), {
       AVATAR_MENU_ID: A,
       openMenuId: o,
-      numeral: te,
-      mdiAccountCircle: Z,
-      mdiChevronDown: $,
-      mdiMagnify: ee,
-      mdiMenu: ne,
-      onHover: u,
+      numeral: oe,
+      mdiAccountCircle: $,
+      mdiChevronDown: ee,
+      mdiMagnify: ne,
+      mdiMenu: te,
+      onHover: d,
       avatar: t,
-      lendButton: n,
+      lendButton: e,
       aboutUsLink: K,
       partnerWithUsLink: O,
       borrowLink: g,
       supportKivaLink: f,
       basketLink: I,
       signInLink: T,
-      menuButton: a,
-      lendUrl: F,
-      handleOnHover: P,
+      menuButton: i,
+      lendUrl: j,
+      avatarFilename: q,
+      handleOnHover: R,
       handleTouchStart: W,
-      handleMouseOut: R,
+      handleMouseOut: F,
       handleAvatarMenuPosition: x,
-      KvHeaderMobileMenu: de,
-      KvHeaderMyKivaMenu: E,
-      KvLendMenu: me,
-      KvHeaderTakeActionMenu: se,
-      KvHeaderAboutMenu: ve
+      KvHeaderMobileMenu: se,
+      KvHeaderMyKivaMenu: S,
+      KvLendMenu: ve,
+      KvHeaderTakeActionMenu: ce,
+      KvHeaderAboutMenu: fe,
+      isLegacyPlaceholderAvatar: de
     };
   }
-}, fe = { class: "tw-h-full tw-flex tw-items-center tw-gap-0.5 md:tw-gap-1.5 lg:tw-gap-2.5" }, we = ["href"], Me = {
+}, Me = { class: "tw-h-full tw-flex tw-items-center tw-gap-0.5 md:tw-gap-1.5 lg:tw-gap-2.5" }, ke = ["href"], ge = {
   key: 0,
   class: "tw-bg-eco-green-1 tw-py-0.5 tw-px-1 tw-text-eco-green-4"
-}, ke = ["href"];
-function ge(v, e, t, n, K, O) {
-  const g = h("kv-material-icon"), f = h("KvHeaderDropdownLink"), I = h("kv-icon-bag"), T = h("KvUserAvatar"), a = J("kv-track-event");
-  return i(), m("div", fe, [
-    s((i(), m("button", {
+}, be = ["href"];
+function he(u, n, t, e, K, O) {
+  const g = h("kv-material-icon"), f = h("KvHeaderDropdownLink"), I = h("kv-icon-bag"), T = h("KvUserAvatar"), i = Q("kv-track-event");
+  return r(), s("div", Me, [
+    v((r(), s("button", {
       ref: "menuButton",
       class: p(["header-link tw-inline-flex md:tw-hidden", {
-        "tw-text-tertiary": t.openMenuItem && t.openMenuItem !== n.KvHeaderMobileMenu
+        "tw-text-tertiary": t.openMenuItem && t.openMenuItem !== e.KvHeaderMobileMenu
       }]),
-      onMouseover: e[0] || (e[0] = (o) => n.handleOnHover("menuButton", n.KvHeaderMobileMenu)),
-      onMouseout: e[1] || (e[1] = (o) => n.handleMouseOut("menuButton")),
-      onTouchstart: e[2] || (e[2] = (o) => n.handleTouchStart("menuButton", n.KvHeaderMobileMenu))
+      onMouseover: n[0] || (n[0] = (o) => e.handleOnHover("menuButton", e.KvHeaderMobileMenu)),
+      onMouseout: n[1] || (n[1] = (o) => e.handleMouseOut("menuButton")),
+      onTouchstart: n[2] || (n[2] = (o) => e.handleTouchStart("menuButton", e.KvHeaderMobileMenu))
     }, [
-      D(g, { icon: n.mdiMenu }, null, 8, ["icon"])
+      C(g, { icon: e.mdiMenu }, null, 8, ["icon"])
     ], 34)), [
-      [a, t.openMenuItem === n.KvHeaderMobileMenu ? ["TopNav", "click-Hamburger-menu"] : null]
+      [i, t.openMenuItem === e.KvHeaderMobileMenu ? ["TopNav", "click-Hamburger-menu"] : null]
     ]),
-    s((i(), w(f, {
+    v((r(), w(f, {
       class: "tw-py-1",
       "ref-name": "lendButton",
-      href: n.lendUrl,
-      "menu-component": n.KvLendMenu,
+      href: e.lendUrl,
+      "menu-component": e.KvLendMenu,
       "open-menu-item": t.openMenuItem,
-      "dropdown-icon": n.mdiChevronDown,
+      "dropdown-icon": e.mdiChevronDown,
       "base-class": "tw-inline-flex md:tw-border md:tw-rounded-md tw-px-1.5 tw-py-1",
-      onOnHover: n.handleOnHover,
-      onMouseout: e[3] || (e[3] = (o) => n.handleMouseOut("lendButton")),
-      onTouchstart: e[4] || (e[4] = (o) => n.handleTouchStart("lendButton", n.KvLendMenu))
+      onOnHover: e.handleOnHover,
+      onMouseout: n[3] || (n[3] = (o) => e.handleMouseOut("lendButton")),
+      onTouchstart: n[4] || (n[4] = (o) => e.handleTouchStart("lendButton", e.KvLendMenu))
     }, {
-      default: L(() => e[10] || (e[10] = [
+      default: L(() => n[10] || (n[10] = [
         M(" Lend ")
       ])),
       _: 1
     }, 8, ["href", "menu-component", "open-menu-item", "dropdown-icon", "onOnHover"])), [
-      [a, ["TopNav", "click-Lend"]]
+      [i, ["TopNav", "click-Lend"]]
     ]),
-    s((i(), w(f, {
+    v((r(), w(f, {
       "ref-name": "takeActionButton",
       "base-class": "tw-hidden md:tw-inline-flex tw-py-1",
-      "menu-component": n.KvHeaderTakeActionMenu,
+      "menu-component": e.KvHeaderTakeActionMenu,
       "open-menu-item": t.openMenuItem,
-      "dropdown-icon": n.mdiChevronDown,
+      "dropdown-icon": e.mdiChevronDown,
       "send-link-position": "",
-      onOnHover: n.handleOnHover,
-      onMouseout: e[5] || (e[5] = (o) => n.handleMouseOut("takeActionButton"))
+      onOnHover: e.handleOnHover,
+      onMouseout: n[5] || (n[5] = (o) => e.handleMouseOut("takeActionButton"))
     }, {
-      default: L(() => e[11] || (e[11] = [
+      default: L(() => n[11] || (n[11] = [
         M(" Take action ")
       ])),
       _: 1
     }, 8, ["menu-component", "open-menu-item", "dropdown-icon", "onOnHover"])), [
-      [a, ["TopNav", "click-TakeAction"]]
+      [i, ["TopNav", "click-TakeAction"]]
     ]),
-    s((i(), w(f, {
+    v((r(), w(f, {
       "ref-name": "aboutUsLink",
       "data-testid": "header-about",
       "base-class": "tw-hidden md:tw-inline-flex tw-py-1",
-      "menu-component": n.KvHeaderAboutMenu,
+      "menu-component": e.KvHeaderAboutMenu,
       "open-menu-item": t.openMenuItem,
-      "dropdown-icon": n.mdiChevronDown,
+      "dropdown-icon": e.mdiChevronDown,
       "send-link-position": "",
-      onOnHover: n.handleOnHover,
-      onMouseout: e[6] || (e[6] = (o) => n.handleMouseOut("aboutUsLink"))
+      onOnHover: e.handleOnHover,
+      onMouseout: n[6] || (n[6] = (o) => e.handleMouseOut("aboutUsLink"))
     }, {
-      default: L(() => e[12] || (e[12] = [
+      default: L(() => n[12] || (n[12] = [
         M(" About ")
       ])),
       _: 1
     }, 8, ["menu-component", "open-menu-item", "dropdown-icon", "onOnHover"])), [
-      [a, ["TopNav", "click-About"]]
+      [i, ["TopNav", "click-About"]]
     ]),
-    e[15] || (e[15] = C("div", { class: "tw-flex-1 tw-h-full" }, null, -1)),
-    t.loggedIn ? s((i(), m("a", {
+    n[15] || (n[15] = E("div", { class: "tw-flex-1 tw-h-full" }, null, -1)),
+    t.loggedIn ? v((r(), s("a", {
       key: 0,
       ref: "dashboardLink",
       href: t.myDashboardUrl,
       class: p(["header-link tw-hidden md:tw-block", { "tw-text-tertiary": !!t.openMenuItem }])
-    }, e[13] || (e[13] = [
+    }, n[13] || (n[13] = [
       M(" My dashboard ")
-    ]), 10, we)), [
-      [a, ["TopNav", "click-Dashboard"]]
+    ]), 10, ke)), [
+      [i, ["TopNav", "click-Dashboard"]]
     ]) : y("", !0),
-    s((i(), m("a", {
+    v((r(), s("a", {
       ref: "basketLink",
       href: "/basket",
       class: p(["header-link tw-relative md:!tw-mr-0", { "tw-text-tertiary": !!t.openMenuItem }]),
       style: { "margin-right": "2px" },
       "data-testid": "header-basket"
     }, [
-      D(I, {
+      C(I, {
         class: "tw-w-3 tw-h-3 tw-pointer-events-none",
         count: t.basketCount
       }, null, 8, ["count"])
     ], 2)), [
-      [Q, t.basketCount > 0],
-      [a, ["TopNav", "click-Basket"]]
+      [X, t.basketCount > 0],
+      [i, ["TopNav", "click-Basket"]]
     ]),
-    C("div", {
+    E("div", {
       class: "tw-cursor-pointer tw-flex tw-items-center tw-gap-1 tw-py-1.5",
-      onMouseover: e[7] || (e[7] = (...o) => n.handleAvatarMenuPosition && n.handleAvatarMenuPosition(...o)),
-      onMouseout: e[8] || (e[8] = (o) => n.handleMouseOut(n.AVATAR_MENU_ID)),
-      onTouchstart: e[9] || (e[9] = (o) => n.handleTouchStart(n.AVATAR_MENU_ID))
+      onMouseover: n[7] || (n[7] = (...o) => e.handleAvatarMenuPosition && e.handleAvatarMenuPosition(...o)),
+      onMouseout: n[8] || (n[8] = (o) => e.handleMouseOut(e.AVATAR_MENU_ID)),
+      onTouchstart: n[9] || (n[9] = (o) => e.handleTouchStart(e.AVATAR_MENU_ID))
     }, [
-      t.loggedIn ? (i(), m("span", Me, X(n.numeral(t.balance).format("$0")), 1)) : y("", !0),
-      t.loggedIn ? (i(), m(Y, { key: 1 }, [
-        t.lenderImageUrl ? (i(), w(T, {
+      t.loggedIn ? (r(), s("span", ge, Y(e.numeral(t.balance).format("$0")), 1)) : y("", !0),
+      t.loggedIn ? (r(), s(Z, { key: 1 }, [
+        e.isLegacyPlaceholderAvatar(e.avatarFilename) || !e.avatarFilename ? (r(), w(g, {
           key: 0,
+          icon: e.mdiAccountCircle,
+          class: "tw-w-3"
+        }, null, 8, ["icon"])) : (r(), w(T, {
+          key: 1,
           ref: "avatar",
           "lender-name": t.lenderName,
           "lender-image-url": t.lenderImageUrl,
           "is-small": ""
-        }, null, 8, ["lender-name", "lender-image-url"])) : (i(), w(g, {
-          key: 1,
-          icon: n.mdiAccountCircle,
-          class: "tw-w-3"
-        }, null, 8, ["icon"]))
+        }, null, 8, ["lender-name", "lender-image-url"]))
       ], 64)) : y("", !0)
     ], 32),
-    t.loggedIn ? y("", !0) : s((i(), m("a", {
+    t.loggedIn ? y("", !0) : v((r(), s("a", {
       key: 1,
       ref: "signInLink",
       href: t.loginUrl,
       class: p(["header-link", { "tw-text-tertiary": !!t.openMenuItem }])
-    }, e[14] || (e[14] = [
+    }, n[14] || (n[14] = [
       M(" Sign in ")
-    ]), 10, ke)), [
-      [a, ["TopNav", "click-Sign-in"]]
+    ]), 10, be)), [
+      [i, ["TopNav", "click-Sign-in"]]
     ])
   ]);
 }
-const Ke = /* @__PURE__ */ ue(ce, [["render", ge], ["__scopeId", "data-v-6728d6d1"]]);
+const Ne = /* @__PURE__ */ me(we, [["render", he], ["__scopeId", "data-v-69cf3729"]]);
 export {
-  Ke as default
+  Ne as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kiva/kv-components",
-  "version": "6.53.0",
+  "version": "6.53.1",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -114,5 +114,5 @@
     "embla-carousel-fade",
     "popper.js"
   ],
-  "gitHead": "2b9e0fbf9f13fbb0a104e9176adaf18765af5c43"
+  "gitHead": "8172db9b0ff00fa18f38523c726e40c016e0a3e2"
 }