@kiva/kv-components 6.57.3 → 6.57.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/vue/KvWwwHeader/KvHeaderLinkBar.css +1 -1
  2. package/dist/vue/KvWwwHeader/KvHeaderLinkBar.js +131 -120
  3. package/dist/vue/KvWwwHeader.css +1 -1
  4. package/dist/vue/KvWwwHeader.js +63 -60
  5. package/package.json +2 -2
package/dist/vue/KvWwwHeader/KvHeaderLinkBar.css CHANGED
@@ -1 +1 @@
1
- .header-link[data-v-b071331e]{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-b071331e]:hover{--tw-text-opacity: 1;color:rgba(var(--text-action),var(--tw-text-opacity, 1));text-decoration-line:none}[data-v-b071331e] .avatar div:first-child{display:flex}
1
+ .header-link[data-v-aaf8f53d]{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-aaf8f53d]:hover{--tw-text-opacity: 1;color:rgba(var(--text-action),var(--tw-text-opacity, 1));text-decoration-line:none}[data-v-aaf8f53d] .avatar div:first-child{display:flex}
package/dist/vue/KvWwwHeader/KvHeaderLinkBar.js CHANGED
@@ -1,20 +1,20 @@
1
- import { defineAsyncComponent as g, ref as r, computed as I, watch as q, onMounted as G, onUnmounted as J, resolveComponent as p, resolveDirective as Q, openBlock as i, createElementBlock as w, withDirectives as m, normalizeClass as y, createVNode as _, createBlock as f, withCtx as H, createTextVNode as M, createElementVNode as A, createCommentVNode as S, vShow as C, toDisplayString as X } from "vue";
2
- import { mdiAccountCircle as Y, mdiChevronDown as Z, mdiMagnify as $, mdiMenu as ee } from "@mdi/js";
3
- import ne from "numeral";
4
- import te from "../KvMaterialIcon.js";
5
- import oe from "../KvIconBag.js";
6
- import ae from "./KvHeaderDropdownLink.js";
7
- import le from "../KvUserAvatar.js";
8
- import { throttle as re } from "../../utils/throttle.js";
9
- import { isLegacyPlaceholderAvatar as ie } from "../../utils/imageUtils.js";
1
+ import { defineAsyncComponent as g, ref as r, computed as x, watch as D, onMounted as Q, onUnmounted as X, resolveComponent as p, resolveDirective as Y, openBlock as i, createElementBlock as w, withDirectives as s, normalizeClass as y, withModifiers as H, createVNode as E, createBlock as f, withCtx as U, createTextVNode as M, createElementVNode as T, createCommentVNode as _, vShow as P, toDisplayString as Z } from "vue";
2
+ import { mdiAccountCircle as $, mdiChevronDown as ee, mdiMagnify as ne, mdiMenu as te } from "@mdi/js";
3
+ import oe from "numeral";
4
+ import ae from "../KvMaterialIcon.js";
5
+ import le from "../KvIconBag.js";
6
+ import re from "./KvHeaderDropdownLink.js";
7
+ import ie from "../KvUserAvatar.js";
8
+ import { throttle as de } from "../../utils/throttle.js";
9
+ import { isLegacyPlaceholderAvatar as ue } from "../../utils/imageUtils.js";
10
10
  import "./KvHeaderLinkBar.css";
11
- import de from "../../_virtual/_plugin-vue_export-helper.js";
12
- const ue = g(() => import("./KvHeaderMobileMenu.js")), E = g(() => import("./KvHeaderMyKivaMenu.js")), me = g(() => import("./LendMenu/KvLendMenu.js")), se = g(() => import("./KvHeaderTakeActionMenu.js")), ve = g(() => import("./KvHeaderAboutMenu.js")), U = 120, k = "avatar-menu", B = "menuButton", P = { top: "-3.75rem", width: "100%" }, ce = {
11
+ import me from "../../_virtual/_plugin-vue_export-helper.js";
12
+ const se = g(() => import("./KvHeaderMobileMenu.js")), V = g(() => import("./KvHeaderMyKivaMenu.js")), ve = g(() => import("./LendMenu/KvLendMenu.js")), ce = g(() => import("./KvHeaderTakeActionMenu.js")), we = g(() => import("./KvHeaderAboutMenu.js")), B = 120, k = "avatar-menu", L = "menuButton", R = { top: "-3.75rem", width: "100%" }, fe = {
13
13
  components: {
14
- KvMaterialIcon: te,
15
- KvIconBag: oe,
16
- KvHeaderDropdownLink: ae,
17
- KvUserAvatar: le
14
+ KvMaterialIcon: ae,
15
+ KvIconBag: le,
16
+ KvHeaderDropdownLink: re,
17
+ KvUserAvatar: ie
18
18
  },
19
19
  props: {
20
20
  loggedIn: {
@@ -58,216 +58,227 @@ const ue = g(() => import("./KvHeaderMobileMenu.js")), E = g(() => import("./KvH
58
58
  "item-hover"
59
59
  ],
60
60
  setup(l, { emit: n }) {
61
- const o = r(null), e = r(null), L = r(null), K = r(null), b = r(null), c = r(null), T = r(null), x = r(null), d = r(null), t = r(null), s = (a, v, u = null) => {
62
- n("item-hover", a, v, u);
63
- }, V = (a, v, u = null) => {
64
- navigator.maxTouchPoints || (t.value = a, s(
65
- a,
61
+ const a = r(null), e = r(null), K = r(null), O = r(null), h = r(null), c = r(null), A = r(null), I = r(null), d = r(null), t = r(null), u = (o, v, m = null) => {
62
+ n("item-hover", o, v, m);
63
+ }, F = (o, v, m = null) => {
64
+ navigator.maxTouchPoints || (t.value = o, u(
65
+ o,
66
66
  v,
67
- a === B && l.isMobile ? P : u
67
+ o === L && l.isMobile ? R : m
68
68
  ));
69
- }, R = (a) => {
70
- !navigator.maxTouchPoints && t.value === a && (t.value = null, s());
71
- }, O = () => {
72
- var D;
73
- const a = (D = o.value) == null ? void 0 : D.getBoundingClientRect();
74
- if (!a) return null;
75
- const u = a.left + a.width / 2 - U / 2;
69
+ }, z = (o) => {
70
+ !navigator.maxTouchPoints && t.value === o && (t.value = null, u());
71
+ }, N = () => {
72
+ var C;
73
+ const o = (C = a.value) == null ? void 0 : C.getBoundingClientRect();
74
+ if (!o) return null;
75
+ const m = o.left + o.width / 2 - B / 2;
76
76
  return {
77
- ...u + U > window.innerWidth ? { right: 0 } : { left: l.isMobile ? 0 : `${u}px` },
77
+ ...m + B > window.innerWidth ? { right: 0 } : { left: l.isMobile ? 0 : `${m}px` },
78
78
  marginTop: "-2px",
79
79
  // Avoid closing avatar menu on header edge
80
80
  borderRadius: l.isMobile ? "auto" : "0px 0px 8px 8px",
81
- width: l.isMobile ? "100%" : `${U}px`
81
+ width: l.isMobile ? "100%" : `${B}px`
82
82
  };
83
- }, h = () => {
84
- t.value = k, s(o.value, E, O());
85
- }, F = (a, v, u) => {
86
- t.value === B && (t.value = null), !t.value || t.value !== a ? (t.value = a, a === k ? h() : a === B && l.isMobile ? s(a, v, P) : s(a, v, u)) : (t.value = null, s());
87
- }, N = re(() => {
88
- t.value === k && h();
89
- }, 100), z = I(() => l.isMobile ? void 0 : "/lend-by-category"), W = I(() => {
90
- var a;
91
- return ((a = l.lenderImageUrl) == null ? void 0 : a.split("/").pop()) ?? "";
92
- }), j = I(() => Math.floor(l.balance));
93
- return q(
83
+ }, b = () => {
84
+ t.value = k, u(a.value, V, N());
85
+ }, W = (o, v, m) => {
86
+ t.value === L && (t.value = null), !t.value || t.value !== o ? (t.value = o, o === k ? b() : o === L && l.isMobile ? u(o, v, R) : u(o, v, m)) : (t.value = null, u());
87
+ }, S = de(() => {
88
+ t.value === k && b();
89
+ }, 100), j = x(() => l.isMobile ? void 0 : "/lend-by-category"), q = x(() => {
90
+ var o;
91
+ return ((o = l.lenderImageUrl) == null ? void 0 : o.split("/").pop()) ?? "";
92
+ }), G = x(() => Math.floor(l.balance)), J = (o) => {
93
+ o.target === o.currentTarget && u();
94
+ };
95
+ return D(
94
96
  () => l.isMobile,
95
97
  () => {
96
- t.value === k && h();
98
+ t.value === k && b();
99
+ }
100
+ ), D(
101
+ () => l.openMenuItem,
102
+ (o) => {
103
+ o || (t.value = null);
97
104
  }
98
- ), G(() => {
99
- import("./KvHeaderMobileMenu.js"), import("./KvHeaderMyKivaMenu.js"), import("./LendMenu/KvLendMenu.js"), import("./KvHeaderTakeActionMenu.js"), import("./KvHeaderAboutMenu.js"), window.addEventListener("resize", N);
100
- }), J(() => {
101
- window.removeEventListener("resize", N);
105
+ ), Q(() => {
106
+ import("./KvHeaderMobileMenu.js"), import("./KvHeaderMyKivaMenu.js"), import("./LendMenu/KvLendMenu.js"), import("./KvHeaderTakeActionMenu.js"), import("./KvHeaderAboutMenu.js"), window.addEventListener("resize", S);
107
+ }), X(() => {
108
+ window.removeEventListener("resize", S);
102
109
  }), {
103
110
  AVATAR_MENU_ID: k,
104
111
  openMenuId: t,
105
- numeral: ne,
106
- mdiAccountCircle: Y,
107
- mdiChevronDown: Z,
108
- mdiMagnify: $,
109
- mdiMenu: ee,
110
- onHover: s,
111
- avatar: o,
112
+ numeral: oe,
113
+ mdiAccountCircle: $,
114
+ mdiChevronDown: ee,
115
+ mdiMagnify: ne,
116
+ mdiMenu: te,
117
+ onHover: u,
118
+ avatar: a,
112
119
  lendButton: e,
113
- aboutUsLink: L,
114
- partnerWithUsLink: K,
115
- borrowLink: b,
120
+ aboutUsLink: K,
121
+ partnerWithUsLink: O,
122
+ borrowLink: h,
116
123
  supportKivaLink: c,
117
- basketLink: T,
118
- signInLink: x,
124
+ basketLink: A,
125
+ signInLink: I,
119
126
  menuButton: d,
120
- lendUrl: z,
121
- avatarFilename: W,
122
- handleOnHover: V,
123
- handleTouchStart: F,
124
- handleMouseOut: R,
125
- handleAvatarMenuPosition: h,
126
- KvHeaderMobileMenu: ue,
127
- KvHeaderMyKivaMenu: E,
128
- KvLendMenu: me,
129
- KvHeaderTakeActionMenu: se,
130
- KvHeaderAboutMenu: ve,
131
- isLegacyPlaceholderAvatar: ie,
132
- getAvatarMenuPosition: O,
133
- roundedBalance: j
127
+ lendUrl: j,
128
+ avatarFilename: q,
129
+ handleOnHover: F,
130
+ handleTouchStart: W,
131
+ handleMouseOut: z,
132
+ handleAvatarMenuPosition: b,
133
+ KvHeaderMobileMenu: se,
134
+ KvHeaderMyKivaMenu: V,
135
+ KvLendMenu: ve,
136
+ KvHeaderTakeActionMenu: ce,
137
+ KvHeaderAboutMenu: we,
138
+ isLegacyPlaceholderAvatar: ue,
139
+ getAvatarMenuPosition: N,
140
+ handleEmptySpaceClick: J,
141
+ roundedBalance: G
134
142
  };
135
143
  }
136
- }, we = { class: "tw-h-full tw-flex tw-items-center tw-gap-0.5 md:tw-gap-2 lg:tw-gap-2.5" }, fe = ["href"], Me = { class: "tw-text-eco-green-4" }, ke = ["href"];
137
- function ge(l, n, o, e, L, K) {
138
- const b = p("kv-material-icon"), c = p("KvHeaderDropdownLink"), T = p("kv-icon-bag"), x = p("KvUserAvatar"), d = Q("kv-track-event");
139
- return i(), w("div", we, [
140
- m((i(), w("button", {
144
+ }, Me = ["href"], ke = { class: "tw-text-eco-green-4" }, ge = ["href"];
145
+ function he(l, n, a, e, K, O) {
146
+ const h = p("kv-material-icon"), c = p("KvHeaderDropdownLink"), A = p("kv-icon-bag"), I = p("KvUserAvatar"), d = Y("kv-track-event");
147
+ return i(), w("div", {
148
+ class: "tw-h-full tw-flex tw-items-center tw-gap-0.5 md:tw-gap-2 lg:tw-gap-2.5",
149
+ onTouchstart: n[10] || (n[10] = (...t) => e.handleEmptySpaceClick && e.handleEmptySpaceClick(...t))
150
+ }, [
151
+ s((i(), w("button", {
141
152
  ref: "menuButton",
142
153
  class: y(["header-link tw-inline-flex md:tw-hidden", {
143
- "tw-text-tertiary": o.openMenuItem && o.openMenuItem !== e.KvHeaderMobileMenu
154
+ "tw-text-tertiary": a.openMenuItem && a.openMenuItem !== e.KvHeaderMobileMenu
144
155
  }]),
145
156
  onMouseover: n[0] || (n[0] = (t) => e.handleOnHover("menuButton", e.KvHeaderMobileMenu)),
146
157
  onMouseout: n[1] || (n[1] = (t) => e.handleMouseOut("menuButton")),
147
- onTouchstart: n[2] || (n[2] = (t) => e.handleTouchStart("menuButton", e.KvHeaderMobileMenu))
158
+ onTouchstart: n[2] || (n[2] = H((t) => e.handleTouchStart("menuButton", e.KvHeaderMobileMenu), ["stop"]))
148
159
  }, [
149
- _(b, { icon: e.mdiMenu }, null, 8, ["icon"])
160
+ E(h, { icon: e.mdiMenu }, null, 8, ["icon"])
150
161
  ], 34)), [
151
- [d, o.openMenuItem === e.KvHeaderMobileMenu ? ["TopNav", "click-Hamburger-menu"] : null]
162
+ [d, a.openMenuItem === e.KvHeaderMobileMenu ? ["TopNav", "click-Hamburger-menu"] : null]
152
163
  ]),
153
- m((i(), f(c, {
164
+ s((i(), f(c, {
154
165
  class: "tw-py-1",
155
166
  "ref-name": "lendButton",
156
167
  href: e.lendUrl,
157
168
  "menu-component": e.KvLendMenu,
158
- "open-menu-item": o.openMenuItem,
169
+ "open-menu-item": a.openMenuItem,
159
170
  "dropdown-icon": e.mdiChevronDown,
160
171
  "base-class": "tw-inline-flex md:tw-border md:tw-rounded-md tw-px-1.5 tw-py-1",
161
172
  onOnHover: e.handleOnHover,
162
173
  onMouseout: n[3] || (n[3] = (t) => e.handleMouseOut("lendButton")),
163
- onTouchstart: n[4] || (n[4] = (t) => e.handleTouchStart("lendButton", e.KvLendMenu))
174
+ onTouchstart: n[4] || (n[4] = H((t) => e.handleTouchStart("lendButton", e.KvLendMenu), ["stop"]))
164
175
  }, {
165
- default: H(() => n[10] || (n[10] = [
176
+ default: U(() => n[11] || (n[11] = [
166
177
  M(" Lend ")
167
178
  ])),
168
179
  _: 1
169
180
  }, 8, ["href", "menu-component", "open-menu-item", "dropdown-icon", "onOnHover"])), [
170
181
  [d, ["TopNav", "click-Lend"]]
171
182
  ]),
172
- m((i(), f(c, {
183
+ s((i(), f(c, {
173
184
  "ref-name": "takeActionButton",
174
185
  "base-class": "tw-hidden md:tw-inline-flex tw-py-1",
175
186
  "menu-component": e.KvHeaderTakeActionMenu,
176
- "open-menu-item": o.openMenuItem,
187
+ "open-menu-item": a.openMenuItem,
177
188
  "dropdown-icon": e.mdiChevronDown,
178
189
  "send-link-position": "",
179
190
  onOnHover: e.handleOnHover,
180
191
  onMouseout: n[5] || (n[5] = (t) => e.handleMouseOut("takeActionButton")),
181
192
  onUserTap: e.handleTouchStart
182
193
  }, {
183
- default: H(() => n[11] || (n[11] = [
194
+ default: U(() => n[12] || (n[12] = [
184
195
  M(" Take action ")
185
196
  ])),
186
197
  _: 1
187
198
  }, 8, ["menu-component", "open-menu-item", "dropdown-icon", "onOnHover", "onUserTap"])), [
188
199
  [d, ["TopNav", "click-TakeAction"]]
189
200
  ]),
190
- m((i(), f(c, {
201
+ s((i(), f(c, {
191
202
  "ref-name": "aboutUsLink",
192
203
  "data-testid": "header-about",
193
204
  "base-class": "tw-hidden md:tw-inline-flex tw-py-1",
194
205
  "menu-component": e.KvHeaderAboutMenu,
195
- "open-menu-item": o.openMenuItem,
206
+ "open-menu-item": a.openMenuItem,
196
207
  "dropdown-icon": e.mdiChevronDown,
197
208
  "send-link-position": "",
198
209
  onOnHover: e.handleOnHover,
199
210
  onMouseout: n[6] || (n[6] = (t) => e.handleMouseOut("aboutUsLink")),
200
211
  onUserTap: e.handleTouchStart
201
212
  }, {
202
- default: H(() => n[12] || (n[12] = [
213
+ default: U(() => n[13] || (n[13] = [
203
214
  M(" About ")
204
215
  ])),
205
216
  _: 1
206
217
  }, 8, ["menu-component", "open-menu-item", "dropdown-icon", "onOnHover", "onUserTap"])), [
207
218
  [d, ["TopNav", "click-About"]]
208
219
  ]),
209
- n[16] || (n[16] = A("div", { class: "tw-flex-1 tw-h-full" }, null, -1)),
210
- o.loggedIn ? m((i(), w("a", {
220
+ n[17] || (n[17] = T("div", { class: "tw-flex-1 tw-h-full" }, null, -1)),
221
+ a.loggedIn ? s((i(), w("a", {
211
222
  key: 0,
212
223
  ref: "dashboardLink",
213
- href: o.myDashboardUrl,
214
- class: y(["header-link tw-hidden md:tw-block", { "tw-text-tertiary": !!o.openMenuItem }])
215
- }, n[13] || (n[13] = [
224
+ href: a.myDashboardUrl,
225
+ class: y(["header-link tw-hidden md:tw-block", { "tw-text-tertiary": !!a.openMenuItem }])
226
+ }, n[14] || (n[14] = [
216
227
  M(" My dashboard ")
217
- ]), 10, fe)), [
228
+ ]), 10, Me)), [
218
229
  [d, ["TopNav", "click-Dashboard"]]
219
- ]) : S("", !0),
220
- m((i(), w("a", {
230
+ ]) : _("", !0),
231
+ s((i(), w("a", {
221
232
  ref: "basketLink",
222
233
  href: "/basket",
223
- class: y(["header-link tw-relative md:!tw-mr-0 tw-flex tw-items-center tw-gap-0.5", { "tw-text-tertiary": !!o.openMenuItem }]),
234
+ class: y(["header-link tw-relative md:!tw-mr-0 tw-flex tw-items-center tw-gap-0.5", { "tw-text-tertiary": !!a.openMenuItem }]),
224
235
  style: { "margin-right": "2px" },
225
236
  "data-testid": "header-basket"
226
237
  }, [
227
- _(T, {
238
+ E(A, {
228
239
  class: "tw-w-3 tw-h-3 md:tw-w-3.5 md:tw-h-3.5 tw-pointer-events-none",
229
- count: o.basketCount
240
+ count: a.basketCount
230
241
  }, null, 8, ["count"]),
231
- n[14] || (n[14] = A("span", { class: "tw-hidden md:tw-block" }, "Basket", -1))
242
+ n[15] || (n[15] = T("span", { class: "tw-hidden md:tw-block" }, "Basket", -1))
232
243
  ], 2)), [
233
- [C, o.basketCount > 0],
244
+ [P, a.basketCount > 0],
234
245
  [d, ["TopNav", "click-Basket"]]
235
246
  ]),
236
- m(A("div", {
247
+ s(T("div", {
237
248
  ref: "avatar",
238
249
  class: "tw-cursor-pointer tw-flex tw-items-center tw-gap-1 tw-bg-eco-green-1 tw-rounded-md tw-py-0.5 md:tw-py-1 tw-px-1 md:tw-px-2",
239
250
  onMouseover: n[7] || (n[7] = (t) => e.handleOnHover(e.AVATAR_MENU_ID, e.KvHeaderMyKivaMenu, e.getAvatarMenuPosition())),
240
251
  onMouseout: n[8] || (n[8] = (t) => e.handleMouseOut(e.AVATAR_MENU_ID)),
241
- onTouchstart: n[9] || (n[9] = (t) => e.handleTouchStart(e.AVATAR_MENU_ID))
252
+ onTouchstart: n[9] || (n[9] = H((t) => e.handleTouchStart(e.AVATAR_MENU_ID), ["stop"]))
242
253
  }, [
243
- e.isLegacyPlaceholderAvatar(e.avatarFilename) || !e.avatarFilename ? (i(), f(b, {
254
+ e.isLegacyPlaceholderAvatar(e.avatarFilename) || !e.avatarFilename ? (i(), f(h, {
244
255
  key: 0,
245
256
  icon: e.mdiAccountCircle,
246
257
  class: "tw-w-3"
247
- }, null, 8, ["icon"])) : (i(), f(x, {
258
+ }, null, 8, ["icon"])) : (i(), f(I, {
248
259
  key: 1,
249
260
  class: "avatar",
250
- "lender-name": o.lenderName,
251
- "lender-image-url": o.lenderImageUrl,
261
+ "lender-name": a.lenderName,
262
+ "lender-image-url": a.lenderImageUrl,
252
263
  "is-small": ""
253
264
  }, null, 8, ["lender-name", "lender-image-url"])),
254
- A("span", Me, X(e.numeral(e.roundedBalance).format("$0")), 1)
265
+ T("span", ke, Z(e.numeral(e.roundedBalance).format("$0")), 1)
255
266
  ], 544), [
256
- [C, o.loggedIn]
267
+ [P, a.loggedIn]
257
268
  ]),
258
- o.loggedIn ? S("", !0) : m((i(), w("a", {
269
+ a.loggedIn ? _("", !0) : s((i(), w("a", {
259
270
  key: 1,
260
271
  ref: "signInLink",
261
- href: o.loginUrl,
262
- class: y(["header-link", { "tw-text-tertiary": !!o.openMenuItem }])
263
- }, n[15] || (n[15] = [
272
+ href: a.loginUrl,
273
+ class: y(["header-link", { "tw-text-tertiary": !!a.openMenuItem }])
274
+ }, n[16] || (n[16] = [
264
275
  M(" Sign in ")
265
- ]), 10, ke)), [
276
+ ]), 10, ge)), [
266
277
  [d, ["TopNav", "click-Sign-in"]]
267
278
  ])
268
- ]);
279
+ ], 32);
269
280
  }
270
- const Ke = /* @__PURE__ */ de(ce, [["render", ge], ["__scopeId", "data-v-b071331e"]]);
281
+ const Oe = /* @__PURE__ */ me(fe, [["render", he], ["__scopeId", "data-v-aaf8f53d"]]);
271
282
  export {
272
- Ke as default
283
+ Oe as default
273
284
  };
package/dist/vue/KvWwwHeader.css CHANGED
@@ -1 +1 @@
1
- .header-fade-enter-active[data-v-cdd5a3af]{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}.header-fade-leave-active[data-v-cdd5a3af]{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.1s}.header-fade-enter[data-v-cdd5a3af],.header-fade-leave-to[data-v-cdd5a3af]{opacity:0}.header-fade-leave[data-v-cdd5a3af],.header-fade-enter-to[data-v-cdd5a3af]{opacity:1}.bg-opacity-50[data-v-cdd5a3af]{background-color:rgba(var(--bg-action-highlight),.5)}
1
+ .header-fade-enter-active[data-v-9410d912]{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}.header-fade-leave-active[data-v-9410d912]{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.1s}.header-fade-enter[data-v-9410d912],.header-fade-leave-to[data-v-9410d912]{opacity:0}.header-fade-leave[data-v-9410d912],.header-fade-enter-to[data-v-9410d912]{opacity:1}.bg-opacity-50[data-v-9410d912]{background-color:rgba(var(--bg-action-highlight),.5)}
package/dist/vue/KvWwwHeader.js CHANGED
@@ -1,18 +1,18 @@
1
- import { ref as l, shallowRef as D, computed as N, onMounted as B, onBeforeUnmount as S, resolveComponent as g, resolveDirective as x, openBlock as w, createBlock as p, withCtx as b, createElementVNode as k, normalizeStyle as _, createVNode as v, Transition as E, withDirectives as h, vShow as I, createElementBlock as A, normalizeClass as K, resolveDynamicComponent as G } from "vue";
1
+ import { ref as a, shallowRef as N, computed as B, onMounted as S, onBeforeUnmount as x, resolveComponent as g, resolveDirective as A, openBlock as w, createBlock as E, withCtx as b, createElementVNode as k, normalizeStyle as h, createVNode as v, Transition as I, withDirectives as _, vShow as C, createElementBlock as K, normalizeClass as O, resolveDynamicComponent as G } from "vue";
2
2
  import z from "@kiva/kv-tokens";
3
3
  import P from "./KvWwwHeader/KvHeaderLinkBar.js";
4
4
  import R from "./KvWwwHeader/KvHeaderLogo.js";
5
- import O from "./KvThemeProvider.js";
6
- import V from "./KvPageContainer.js";
7
- import { throttle as W } from "../utils/throttle.js";
5
+ import V from "./KvThemeProvider.js";
6
+ import W from "./KvPageContainer.js";
7
+ import { throttle as Y } from "../utils/throttle.js";
8
8
  import "./KvWwwHeader.css";
9
- import Y from "../_virtual/_plugin-vue_export-helper.js";
10
- const j = "3.75rem", q = ["lendMenu", "aboutUsLink"], F = {
9
+ import j from "../_virtual/_plugin-vue_export-helper.js";
10
+ const q = "3.75rem", F = ["lendMenu", "aboutUsLink"], J = {
11
11
  components: {
12
12
  KvHeaderLinkBar: P,
13
13
  KvHeaderLogo: R,
14
- KvThemeProvider: O,
15
- KvPageContainer: V
14
+ KvThemeProvider: V,
15
+ KvPageContainer: W
16
16
  },
17
17
  props: {
18
18
  loggedIn: {
@@ -68,65 +68,68 @@ const j = "3.75rem", q = ["lendMenu", "aboutUsLink"], F = {
68
68
  "load-lend-menu-data"
69
69
  ],
70
70
  setup(L, { emit: o }) {
71
- const n = l(!0), e = l(null), a = l(!1), r = D(null), s = l(null), u = l({ left: 0, position: "relative" }), d = l(!1), c = l(null);
71
+ const n = a(!0), e = a(null), r = a(!1), i = N(null), u = a(null), d = a({ left: 0, position: "relative" }), m = a(!1), c = a(null);
72
72
  let f;
73
- const m = N(() => {
74
- var i, t;
75
- return ((t = (i = s.value) == null ? void 0 : i.$options) == null ? void 0 : t.name) === "KvHeaderMobileMenu";
76
- }), T = (i, t, M) => {
77
- t ? (c.value = i, clearTimeout(f), r.value !== t && (u.value = { left: 0, position: "relative" }), r.value = t, a.value = !0, M && (u.value = {
78
- ...M,
73
+ const l = B(() => {
74
+ var s, t;
75
+ return ((t = (s = u.value) == null ? void 0 : s.$options) == null ? void 0 : t.name) === "KvHeaderMobileMenu";
76
+ }), y = (s, t, p) => {
77
+ t ? (c.value = s, clearTimeout(f), i.value !== t && (d.value = { left: 0, position: "relative" }), i.value = t, r.value = !0, p && (d.value = {
78
+ ...p,
79
79
  position: "absolute"
80
- })) : a.value && (f = setTimeout(() => {
81
- a.value = !1, r.value = null;
80
+ })) : r.value && (f = setTimeout(() => {
81
+ r.value = !1, i.value = null;
82
82
  }, 100));
83
- }, C = (i) => {
83
+ }, T = (s) => {
84
84
  var t;
85
- (t = s.value) == null || t.onLoad(i);
85
+ (t = u.value) == null || t.onLoad(s);
86
86
  }, U = () => {
87
+ if (!l.value) return y();
88
+ }, D = () => {
87
89
  o("load-lend-menu-data");
88
- }, y = () => {
89
- d.value = (window == null ? void 0 : window.innerWidth) < z.breakpoints.md, d.value && q.includes(c.value) && (r.value = null, a.value = !1);
90
- }, H = W(y, 100);
91
- return B(() => {
92
- y(), window.addEventListener("resize", H);
93
- }), S(() => {
94
- window.removeEventListener("resize", H);
90
+ }, H = () => {
91
+ m.value = (window == null ? void 0 : window.innerWidth) < z.breakpoints.md, m.value && F.includes(c.value) && (i.value = null, r.value = !1);
92
+ }, M = Y(H, 100);
93
+ return S(() => {
94
+ H(), window.addEventListener("resize", M);
95
+ }), x(() => {
96
+ window.removeEventListener("resize", M);
95
97
  }), {
96
- HEADER_HEIGHT: j,
97
- emitLendMenuEvent: U,
98
- isMobile: d,
98
+ HEADER_HEIGHT: q,
99
+ emitLendMenuEvent: D,
100
+ isMobile: m,
99
101
  linksVisible: n,
100
- menuOpen: a,
101
- isMobileMenuActive: m,
102
- onHover: T,
103
- loadMenuData: C,
102
+ menuOpen: r,
103
+ isMobileMenuActive: l,
104
+ onHover: y,
105
+ loadMenuData: T,
106
+ handleOverlayClick: U,
104
107
  activeHeaderItem: e,
105
- menuComponent: r,
106
- menuComponentInstance: s,
107
- menuPosition: u
108
+ menuComponent: i,
109
+ menuComponentInstance: u,
110
+ menuPosition: d
108
111
  };
109
112
  }
110
- }, J = {
113
+ }, Q = {
111
114
  href: "/",
112
115
  class: "tw-px-1 tw-py-2 tw-cursor-pointer tw-absolute tw-top-1/2 tw-left-1/2 tw--translate-y-1/2 tw--translate-x-1/2 tw-transition-all tw-duration-300"
113
116
  };
114
- function Q(L, o, n, e, a, r) {
115
- const s = g("kv-header-link-bar"), u = g("kv-header-logo"), d = g("kv-page-container"), c = g("kv-theme-provider"), f = x("kv-track-event");
116
- return w(), p(c, {
117
+ function X(L, o, n, e, r, i) {
118
+ const u = g("kv-header-link-bar"), d = g("kv-header-logo"), m = g("kv-page-container"), c = g("kv-theme-provider"), f = A("kv-track-event");
119
+ return w(), E(c, {
117
120
  tag: "div",
118
121
  class: "tw-bg-primary"
119
122
  }, {
120
123
  default: b(() => [
121
124
  k("nav", {
122
125
  class: "tw-font-medium tw-relative",
123
- style: _({ height: e.HEADER_HEIGHT })
126
+ style: h({ height: e.HEADER_HEIGHT })
124
127
  }, [
125
- v(d, null, {
128
+ v(m, null, {
126
129
  default: b(() => [
127
- v(E, { name: "header-fade" }, {
130
+ v(I, { name: "header-fade" }, {
128
131
  default: b(() => [
129
- h(v(s, {
132
+ _(v(u, {
130
133
  "logged-in": n.loggedIn,
131
134
  "basket-count": n.basketCount,
132
135
  "login-url": n.loginUrl,
@@ -138,13 +141,13 @@ function Q(L, o, n, e, a, r) {
138
141
  balance: n.balance,
139
142
  onItemHover: e.onHover
140
143
  }, null, 8, ["logged-in", "basket-count", "login-url", "open-menu-item", "my-dashboard-url", "lender-name", "lender-image-url", "is-mobile", "balance", "onItemHover"]), [
141
- [I, e.linksVisible]
144
+ [C, e.linksVisible]
142
145
  ])
143
146
  ]),
144
147
  _: 1
145
148
  }),
146
- h((w(), A("a", J, [
147
- v(u)
149
+ _((w(), K("a", Q, [
150
+ v(d)
148
151
  ])), [
149
152
  [f, ["TopNav", "click-Logo"]]
150
153
  ])
@@ -152,23 +155,23 @@ function Q(L, o, n, e, a, r) {
152
155
  _: 1
153
156
  })
154
157
  ], 4),
155
- v(E, { name: "header-fade" }, {
158
+ v(I, { name: "header-fade" }, {
156
159
  default: b(() => [
157
- h(k("div", {
160
+ _(k("div", {
158
161
  class: "tw-absolute tw-z-modal tw-h-full tw-inset-x-0 tw-bg-eco-green-4 bg-opacity-50 tw-min-h-screen",
159
- style: _({ top: e.HEADER_HEIGHT }),
160
- onTouchstart: o[3] || (o[3] = (m) => e.onHover())
162
+ style: h({ top: e.HEADER_HEIGHT }),
163
+ onTouchstart: o[3] || (o[3] = (...l) => e.handleOverlayClick && e.handleOverlayClick(...l))
161
164
  }, [
162
165
  k("div", {
163
- class: K(["tw-bg-primary tw-overflow-y-auto", { "tw-min-h-dvh": e.isMobileMenuActive }]),
164
- style: _({
166
+ class: O(["tw-bg-primary tw-overflow-y-auto", { "tw-min-h-dvh": e.isMobileMenuActive }]),
167
+ style: h({
165
168
  ...e.menuPosition,
166
169
  maxHeight: e.isMobileMenuActive ? "auto" : `calc(100dvh - ${e.HEADER_HEIGHT})`
167
170
  }),
168
- onMouseover: o[1] || (o[1] = (m) => e.onHover(e.activeHeaderItem, e.menuComponent)),
169
- onMouseout: o[2] || (o[2] = (m) => e.onHover())
171
+ onMouseover: o[1] || (o[1] = (l) => e.onHover(e.activeHeaderItem, e.menuComponent)),
172
+ onMouseout: o[2] || (o[2] = (l) => e.onHover())
170
173
  }, [
171
- (w(), p(G(e.menuComponent), {
174
+ (w(), E(G(e.menuComponent), {
172
175
  ref: "menuComponentInstance",
173
176
  "logged-in": n.loggedIn,
174
177
  "login-url": n.loginUrl,
@@ -180,11 +183,11 @@ function Q(L, o, n, e, a, r) {
180
183
  "is-mobile": e.isMobile,
181
184
  "countries-not-lent-to-url": n.countriesNotLentToUrl,
182
185
  onLoadLendMenuData: e.emitLendMenuEvent,
183
- onClosingMenu: o[0] || (o[0] = (m) => e.onHover())
186
+ onClosingMenu: o[0] || (o[0] = (l) => e.onHover())
184
187
  }, null, 40, ["logged-in", "login-url", "user-id", "is-borrower", "is-trustee", "my-dashboard-url", "show-m-g-upsell-link", "is-mobile", "countries-not-lent-to-url", "onLoadLendMenuData"]))
185
188
  ], 38)
186
189
  ], 36), [
187
- [I, e.menuOpen]
190
+ [C, e.menuOpen]
188
191
  ])
189
192
  ]),
190
193
  _: 1
@@ -193,7 +196,7 @@ function Q(L, o, n, e, a, r) {
193
196
  _: 1
194
197
  });
195
198
  }
196
- const re = /* @__PURE__ */ Y(F, [["render", Q], ["__scopeId", "data-v-cdd5a3af"]]);
199
+ const ie = /* @__PURE__ */ j(J, [["render", X], ["__scopeId", "data-v-9410d912"]]);
197
200
  export {
198
- re as default
201
+ ie as default
199
202
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kiva/kv-components",
3
- "version": "6.57.3",
3
+ "version": "6.57.5",
4
4
  "type": "module",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -114,5 +114,5 @@
114
114
  "embla-carousel-fade",
115
115
  "popper.js"
116
116
  ],
117
- "gitHead": "773c99e26b05b13cba25a94d5d07639510107c8c"
117
+ "gitHead": "3aed7624974658c7018a66ce28ccf6d0a3fe42e4"
118
118
  }