@kiva/kv-components 6.50.1 → 6.50.2

package/dist/vue/KvWwwHeader/KvHeaderDropdownLink.js

@@ -65,7 +65,7 @@ function x(e, o, n, r, i, s) {
   const a = c("KvMaterialIcon");
   return m(), f("a", {
     ref: n.refName,
-    class: l(["tw-no-underline hover:tw-no-underline tw-text-primary hover:tw-text-action tw-items-center tw-rounded tw-cursor-pointer", r.computedClass]),
+    class: l(["tw-py-1 tw-no-underline hover:tw-no-underline tw-text-primary hover:tw-text-action tw-items-center tw-cursor-pointer", r.computedClass]),
     href: n.href,
     onMouseover: o[0] || (o[0] = (...t) => r.handleMouseOver && r.handleMouseOver(...t))
   }, [

package/dist/vue/KvWwwHeader/KvHeaderLinkBar.css

@@ -1 +1 @@
-.header-link[data-v-e43175cd]{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-e43175cd]:hover{--tw-text-opacity: 1;color:rgba(var(--text-action),var(--tw-text-opacity, 1));text-decoration-line:none}
+.header-link[data-v-80235e01]{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-80235e01]: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,4 +1,4 @@
-import { defineAsyncComponent as k, ref as l, computed as P, onMounted as z, onUnmounted as W, resolveComponent as g, resolveDirective as j, openBlock as i, createElementBlock as c, withDirectives as d, normalizeClass as b, createVNode as U, createBlock as h, withCtx as T, createTextVNode as w, createElementVNode as D, createCommentVNode as M, toDisplayString as F } from "vue";
+import { defineAsyncComponent as k, ref as l, computed as P, onMounted as z, onUnmounted as W, resolveComponent as b, resolveDirective as j, openBlock as i, createElementBlock as c, withDirectives as d, normalizeClass as g, createVNode as U, createBlock as h, withCtx as T, createTextVNode as w, createElementVNode as N, createCommentVNode as M, toDisplayString as F } from "vue";
 import { mdiAccountCircle as q, mdiChevronDown as G, mdiMagnify as J, mdiMenu as Q } from "@mdi/js";
 import X from "numeral";
 import Y from "../KvMaterialIcon.js";
@@ -8,7 +8,7 @@ import ee from "../KvUserAvatar.js";
 import { throttle as ne } from "../../utils/throttle.js";
 import "./KvHeaderLinkBar.css";
 import te from "../../_virtual/_plugin-vue_export-helper.js";
-const oe = k(() => import("./KvHeaderMobileMenu.js")), O = k(() => import("./KvHeaderMyKivaMenu.js")), re = k(() => import("./LendMenu/KvLendMenu.js")), le = k(() => import("./KvHeaderTakeActionMenu.js")), ie = k(() => import("./KvHeaderAboutMenu.js")), C = 118, y = "avatar-menu", ae = {
+const oe = k(() => import("./KvHeaderMobileMenu.js")), D = k(() => import("./KvHeaderMyKivaMenu.js")), re = k(() => import("./LendMenu/KvLendMenu.js")), le = k(() => import("./KvHeaderTakeActionMenu.js")), ie = k(() => import("./KvHeaderAboutMenu.js")), C = 118, p = "avatar-menu", ae = {
   components: {
     KvMaterialIcon: Y,
     KvIconBag: Z,
@@ -57,35 +57,37 @@ const oe = k(() => import("./KvHeaderMobileMenu.js")), O = k(() => import("./KvH
     "item-hover"
   ],
   setup(u, { emit: e }) {
-    const t = l(null), n = l(null), x = l(null), K = l(null), p = l(null), f = l(null), A = l(null), H = l(null), a = l(null), o = l(null), m = (r, v, s = null) => {
-      e("item-hover", r, v, s);
-    }, _ = (r, v, s = null) => {
-      u.isMobile || m(r, v, s);
+    const t = l(null), n = l(null), x = l(null), K = l(null), y = l(null), f = l(null), A = l(null), H = l(null), a = l(null), o = l(null), m = (r, s, v = null) => {
+      e("item-hover", r, s, v);
+    }, _ = (r, s, v = null) => {
+      u.isMobile || m(r, s, v);
     }, S = (r) => {
       o.value === r && (o.value = null, m());
     }, E = () => {
-      var B, N;
-      const r = (N = (B = t.value) == null ? void 0 : B.userAvatar) == null ? void 0 : N.getBoundingClientRect();
+      var B, O;
+      const r = (O = (B = t.value) == null ? void 0 : B.userAvatar) == null ? void 0 : O.getBoundingClientRect();
       if (!r) return null;
-      const s = r.left + r.width / 2 - C / 2;
+      const v = r.left + r.width / 2 - C / 2;
       return {
-        ...s + C > window.outerWidth ? { right: 0 } : { left: u.isMobile ? 0 : `${s}px` },
+        ...v + C > window.outerWidth ? { right: 0 } : { left: u.isMobile ? 0 : `${v}px` },
+        marginTop: "-2px",
+        // Avoid closing avatar menu on header edge
         borderRadius: u.isMobile ? "auto" : "0px 0px 8px 8px",
         width: u.isMobile ? "100%" : "auto"
       };
     }, I = () => {
-      o.value = y, m(t.value, O, E());
-    }, V = (r, v) => {
-      !o.value || o.value !== r ? (o.value = r, r === y ? I() : m(r, v)) : (o.value = null, m());
+      o.value = p, m(t.value, D, E());
+    }, V = (r, s) => {
+      !o.value || o.value !== r ? (o.value = r, r === p ? I() : m(r, s)) : (o.value = null, m());
     }, L = ne(() => {
-      o.value === y && I();
+      o.value === p && I();
     }, 50), R = P(() => u.isMobile ? void 0 : "/lend-by-category");
     return z(() => {
       import("./KvHeaderMobileMenu.js"), import("./KvHeaderMyKivaMenu.js"), import("./LendMenu/KvLendMenu.js"), import("./KvHeaderTakeActionMenu.js"), import("./KvHeaderAboutMenu.js"), window.addEventListener("resize", L);
     }), W(() => {
       window.removeEventListener("resize", L);
     }), {
-      AVATAR_MENU_ID: y,
+      AVATAR_MENU_ID: p,
       openMenuId: o,
       numeral: X,
       mdiAccountCircle: q,
@@ -97,7 +99,7 @@ const oe = k(() => import("./KvHeaderMobileMenu.js")), O = k(() => import("./KvH
       lendButton: n,
       aboutUsLink: x,
       partnerWithUsLink: K,
-      borrowLink: p,
+      borrowLink: y,
       supportKivaLink: f,
       basketLink: A,
       signInLink: H,
@@ -108,7 +110,7 @@ const oe = k(() => import("./KvHeaderMobileMenu.js")), O = k(() => import("./KvH
       handleMouseOut: S,
       handleAvatarMenuPosition: I,
       KvHeaderMobileMenu: oe,
-      KvHeaderMyKivaMenu: O,
+      KvHeaderMyKivaMenu: D,
       KvLendMenu: re,
       KvHeaderTakeActionMenu: le,
       KvHeaderAboutMenu: ie
@@ -117,31 +119,30 @@ const oe = k(() => import("./KvHeaderMobileMenu.js")), O = k(() => import("./KvH
 }, de = { class: "tw-h-full tw-flex tw-items-center tw-gap-2.5" }, ue = ["href"], me = {
   key: 0,
   class: "tw-bg-eco-green-1 tw-py-0.5 tw-px-1 tw-text-eco-green-4"
-}, ve = ["href"];
-function se(u, e, t, n, x, K) {
-  const p = g("kv-material-icon"), f = g("KvHeaderDropdownLink"), A = g("kv-icon-bag"), H = g("KvUserAvatar"), a = j("kv-track-event");
+}, se = ["href"];
+function ve(u, e, t, n, x, K) {
+  const y = b("kv-material-icon"), f = b("KvHeaderDropdownLink"), A = b("kv-icon-bag"), H = b("KvUserAvatar"), a = j("kv-track-event");
   return i(), c("div", de, [
     d((i(), c("button", {
       ref: "menuButton",
-      class: b(["header-link tw-inline-flex lg:tw-hidden", {
+      class: g(["header-link tw-inline-flex lg:tw-hidden", {
         "tw-text-tertiary": t.openMenuItem && t.openMenuItem !== n.KvHeaderMobileMenu
       }]),
       onMouseover: e[0] || (e[0] = (o) => n.handleOnHover(n.menuButton, n.KvHeaderMobileMenu)),
       onMouseout: e[1] || (e[1] = (o) => n.handleMouseOut("menuButton")),
       onTouchstart: e[2] || (e[2] = (o) => n.handleTouchStart("menuButton", n.KvHeaderMobileMenu))
     }, [
-      U(p, { icon: n.mdiMenu }, null, 8, ["icon"])
+      U(y, { icon: n.mdiMenu }, null, 8, ["icon"])
     ], 34)), [
       [a, t.openMenuItem === n.KvHeaderMobileMenu ? ["TopNav", "click-Hamburger-menu"] : null]
     ]),
     d((i(), h(f, {
-      class: "tw-border tw-rounded-md tw-px-1.5 tw-py-1",
       "ref-name": "lendButton",
       href: n.lendUrl,
       "menu-component": n.KvLendMenu,
       "open-menu-item": t.openMenuItem,
       "dropdown-icon": n.mdiChevronDown,
-      "base-class": "tw-inline-flex",
+      "base-class": "tw-inline-flex tw-border 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))
@@ -160,8 +161,8 @@ function se(u, e, t, n, x, K) {
       "open-menu-item": t.openMenuItem,
       "dropdown-icon": n.mdiChevronDown,
       "send-link-position": "",
-      onOnHover: n.onHover,
-      onMouseout: e[5] || (e[5] = (o) => n.onHover())
+      onOnHover: n.handleOnHover,
+      onMouseout: e[5] || (e[5] = (o) => n.handleMouseOut("takeActionButton"))
     }, {
       default: T(() => e[11] || (e[11] = [
         w(" Take action ")
@@ -172,13 +173,14 @@ function se(u, e, t, n, x, K) {
     ]),
     d((i(), h(f, {
       "ref-name": "aboutUsLink",
+      "test-id": "header-about",
       "base-class": "tw-hidden lg:tw-inline-flex tw-py-2",
       "menu-component": n.KvHeaderAboutMenu,
       "open-menu-item": t.openMenuItem,
       "dropdown-icon": n.mdiChevronDown,
       "send-link-position": "",
-      onOnHover: n.onHover,
-      onMouseout: e[6] || (e[6] = (o) => n.onHover())
+      onOnHover: n.handleOnHover,
+      onMouseout: e[6] || (e[6] = (o) => n.handleMouseOut("aboutUsLink"))
     }, {
       default: T(() => e[12] || (e[12] = [
         w(" About ")
@@ -187,12 +189,12 @@ function se(u, e, t, n, x, K) {
     }, 8, ["menu-component", "open-menu-item", "dropdown-icon", "onOnHover"])), [
       [a, ["TopNav", "click-About"]]
     ]),
-    e[15] || (e[15] = D("div", { class: "tw-flex-1 tw-h-full" }, null, -1)),
+    e[15] || (e[15] = N("div", { class: "tw-flex-1 tw-h-full" }, null, -1)),
     t.loggedIn ? d((i(), c("a", {
       key: 0,
       ref: "dashboardLink",
       href: t.myDashboardUrl,
-      class: b(["header-link tw-hidden lg:tw-block", { "tw-text-tertiary": !!t.openMenuItem }])
+      class: g(["header-link tw-hidden lg:tw-block", { "tw-text-tertiary": !!t.openMenuItem }])
     }, e[13] || (e[13] = [
       w(" My dashboard ")
     ]), 10, ue)), [
@@ -202,7 +204,8 @@ function se(u, e, t, n, x, K) {
       key: 1,
       ref: "basketLink",
       href: "/basket",
-      class: b(["header-link tw-relative", { "tw-text-tertiary": !!t.openMenuItem }])
+      class: g(["header-link tw-relative", { "tw-text-tertiary": !!t.openMenuItem }]),
+      "test-id": "header-basket"
     }, [
       U(A, {
         class: "tw-w-3 tw-h-3 tw-pointer-events-none",
@@ -211,7 +214,7 @@ function se(u, e, t, n, x, K) {
     ], 2)), [
       [a, ["TopNav", "click-Basket"]]
     ]) : M("", !0),
-    D("div", {
+    N("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)),
@@ -230,15 +233,15 @@ function se(u, e, t, n, x, K) {
       key: 2,
       ref: "signInLink",
       href: t.loginUrl,
-      class: b(["header-link", { "tw-text-tertiary": !!t.openMenuItem }])
+      class: g(["header-link", { "tw-text-tertiary": !!t.openMenuItem }])
     }, e[14] || (e[14] = [
       w(" Sign in ")
-    ]), 10, ve)), [
+    ]), 10, se)), [
       [a, ["TopNav", "click-Sign-in"]]
     ])
   ]);
 }
-const He = /* @__PURE__ */ te(ae, [["render", se], ["__scopeId", "data-v-e43175cd"]]);
+const He = /* @__PURE__ */ te(ae, [["render", ve], ["__scopeId", "data-v-80235e01"]]);
 export {
   He as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kiva/kv-components",
-  "version": "6.50.1",
+  "version": "6.50.2",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -113,5 +113,5 @@
     "embla-carousel-fade",
     "popper.js"
   ],
-  "gitHead": "3340c201bdd77ab6488052728a1d131eecb0401e"
+  "gitHead": "5f2b1403458069ec1143a4e8fd917c9f7cff2ac1"
 }