@kiva/kv-components 6.53.1 → 6.55.0
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.
package/dist/index.js
CHANGED
|
@@ -5,18 +5,18 @@ import { default as d } from "./vue/KvButton.js";
|
|
|
5
5
|
import { default as p } from "./vue/KvCardFrame.js";
|
|
6
6
|
import { default as x } from "./vue/KvCarousel.js";
|
|
7
7
|
import { default as n } from "./vue/KvCartModal.js";
|
|
8
|
-
import { default as
|
|
8
|
+
import { default as i } from "./vue/KvCartPill.js";
|
|
9
9
|
import { default as C } from "./vue/KvCheckbox.js";
|
|
10
10
|
import { default as L } from "./vue/KvCheckoutReceipt.js";
|
|
11
11
|
import { default as T } from "./vue/KvChip.js";
|
|
12
12
|
import { KV_CLASSIC_LOAN_CARD_FRAGMENT as E, KV_CLASSIC_LOAN_CARD_USER_FRAGMET as R, default as M } from "./vue/KvClassicLoanCard.js";
|
|
13
|
-
import { default as
|
|
14
|
-
import { default as
|
|
13
|
+
import { default as I } from "./vue/KvCommentsAdd.js";
|
|
14
|
+
import { default as g } from "./vue/KvCommentsContainer.js";
|
|
15
15
|
import { default as G } from "./vue/KvCommentsHeartButton.js";
|
|
16
16
|
import { default as F } from "./vue/KvCommentsList.js";
|
|
17
17
|
import { default as D } from "./vue/KvCommentsListItem.js";
|
|
18
18
|
import { default as B } from "./vue/KvCommentsReplyButton.js";
|
|
19
|
-
import { default as
|
|
19
|
+
import { default as U } from "./vue/KvContentfulImg.js";
|
|
20
20
|
import { default as w } from "./vue/KvCountdownTimer.js";
|
|
21
21
|
import { default as H } from "./vue/KvDatePicker.js";
|
|
22
22
|
import { default as z } from "./vue/KvExpandable.js";
|
|
@@ -29,17 +29,17 @@ import { default as ae } from "./vue/KvInlineActivityCard.js";
|
|
|
29
29
|
import { default as le } from "./vue/KvInlineActivityFeed.js";
|
|
30
30
|
import { KV_INTRODUCTION_LOAN_CARD_FRAGMENT as de, KV_INTRODUCTION_LOAN_CARD_USER_FRAGMENT as me, default as pe } from "./vue/KvIntroductionLoanCard.js";
|
|
31
31
|
import { default as xe } from "./vue/KvLendAmountButton.js";
|
|
32
|
-
import { KV_LEND_CTA_FRAGMENT as ne, KV_LEND_CTA_USER_FRAGMENT as ve, default as
|
|
32
|
+
import { KV_LEND_CTA_FRAGMENT as ne, KV_LEND_CTA_USER_FRAGMENT as ve, default as ie } from "./vue/KvLendCta.js";
|
|
33
33
|
import { default as Ce } from "./vue/KvLightbox.js";
|
|
34
34
|
import { default as Le } from "./vue/KvLineGraph.js";
|
|
35
35
|
import { KV_LOAN_ACTIVITIES_FRAGMENT as Te, default as ce } from "./vue/KvLoanActivities.js";
|
|
36
36
|
import { KV_LOAN_BOOKMARK_FRAGMENT as Re, default as Me } from "./vue/KvLoanBookmark.js";
|
|
37
|
-
import { default as
|
|
38
|
-
import { default as
|
|
37
|
+
import { default as Ie } from "./vue/KvLoanCallouts.js";
|
|
38
|
+
import { default as ge } from "./vue/KvLoanProgressGroup.js";
|
|
39
39
|
import { KV_LOAN_TAG_FRAGMENT as Ge, default as he } from "./vue/KvLoanTag.js";
|
|
40
40
|
import { default as Ve } from "./vue/KvLoanTeamPick.js";
|
|
41
41
|
import { KV_LOAN_USE_FRAGMENT as ke, default as Be } from "./vue/KvLoanUse.js";
|
|
42
|
-
import { default as
|
|
42
|
+
import { default as Ue } from "./vue/KvLoadingPlaceholder.js";
|
|
43
43
|
import { default as we } from "./vue/KvLoadingSpinner.js";
|
|
44
44
|
import { default as He } from "./vue/KvMap.js";
|
|
45
45
|
import { default as ze } from "./vue/KvMaterialIcon.js";
|
|
@@ -54,19 +54,19 @@ import { default as mo } from "./vue/KvRadio.js";
|
|
|
54
54
|
import { default as uo } from "./vue/KvSelect.js";
|
|
55
55
|
import { default as Ko } from "./vue/KvSideSheet.js";
|
|
56
56
|
import { default as vo } from "./vue/KvSwitch.js";
|
|
57
|
-
import { default as
|
|
57
|
+
import { default as Ao } from "./vue/KvTab.js";
|
|
58
58
|
import { default as _o } from "./vue/KvTabPanel.js";
|
|
59
59
|
import { default as No } from "./vue/KvTabs.js";
|
|
60
60
|
import { default as co } from "./vue/KvTextInput.js";
|
|
61
61
|
import { default as Ro } from "./vue/KvTextLink.js";
|
|
62
62
|
import { default as Oo } from "./vue/KvThemeProvider.js";
|
|
63
|
-
import { default as
|
|
64
|
-
import { default as
|
|
63
|
+
import { default as So } from "./vue/KvToast.js";
|
|
64
|
+
import { default as Po } from "./vue/KvTooltip.js";
|
|
65
65
|
import { default as ho } from "./vue/KvTreeMapChart.js";
|
|
66
66
|
import { default as Vo } from "./vue/KvUserAvatar.js";
|
|
67
67
|
import { default as ko } from "./vue/KvUtilityMenu.js";
|
|
68
68
|
import { default as yo } from "./vue/KvVerticalCarousel.js";
|
|
69
|
-
import { default as
|
|
69
|
+
import { default as bo } from "./vue/KvVotingCard.js";
|
|
70
70
|
import { default as Wo } from "./vue/KvVotingCardV2.js";
|
|
71
71
|
import { KV_WIDE_LOAN_CARD_FRAGMENT as jo, KV_WIDE_LOAN_CARD_USER_FRAGMENT as zo, default as Qo } from "./vue/KvWideLoanCard.js";
|
|
72
72
|
import { default as Jo } from "./vue/KvAtbModal.js";
|
|
@@ -76,22 +76,22 @@ import { default as ot, Mash as tt } from "./utils/Alea.js";
|
|
|
76
76
|
import { useAttrs as at } from "./utils/attrs.js";
|
|
77
77
|
import { carouselUtil as lt } from "./utils/carousels.js";
|
|
78
78
|
import { collapse as dt, expand as mt } from "./utils/expander.js";
|
|
79
|
-
import {
|
|
80
|
-
import { LOAN_CALLOUTS_FRAGMENT as
|
|
81
|
-
import { BALANCE_CAMPAIGN as
|
|
82
|
-
import { animationCoordinator as Pt, generateMapMarkers as
|
|
83
|
-
import { lockPrintSingleEl as
|
|
84
|
-
import { lockScroll as
|
|
85
|
-
import { buildTailwindClassName as
|
|
86
|
-
import { throttle as
|
|
87
|
-
import { isTargetElement as
|
|
88
|
-
import { getTreemap as
|
|
89
|
-
import { KvBlueskyIcon as
|
|
79
|
+
import { getKivaImageUrl as ut, isLegacyPlaceholderAvatar as xt, randomizedUserAvatarClass as Kt } from "./utils/imageUtils.js";
|
|
80
|
+
import { LOAN_CALLOUTS_FRAGMENT as vt, LOAN_GEOCODE_FRAGMENT as it, LOAN_PROGRESS_FRAGMENT as At, loanCardComputedProperties as Ct, loanCardMethods as _t } from "./utils/loanCard.js";
|
|
81
|
+
import { BALANCE_CAMPAIGN as Nt, BASE_CAMPAIGN as Tt, ERL_COOKIE_NAME as ct, NO_BALANCE_CAMPAIGN as Et, TOP_UP_CAMPAIGN as Rt, getDropdownPriceArray as Mt, getLendCtaSelectedOption as Ot, isBetween25And50 as It, isLessThan25 as St } from "./utils/loanUtils.js";
|
|
82
|
+
import { animationCoordinator as Pt, generateMapMarkers as Gt, getCoordinatesBetween as ht, getCountryColor as Ft, getLoansIntervals as Vt } from "./utils/mapUtils.js";
|
|
83
|
+
import { lockPrintSingleEl as kt, unlockPrintSingleEl as Bt } from "./utils/printing.js";
|
|
84
|
+
import { lockScroll as Ut, lockScrollSmallOnly as bt, unlockScroll as wt, unlockScrollSmallOnly as Wt } from "./utils/scrollLock.js";
|
|
85
|
+
import { buildTailwindClassName as jt, headerNumberCase as zt, kebabCase as Qt, removeObjectProperty as qt } from "./utils/themeUtils.js";
|
|
86
|
+
import { throttle as Xt } from "./utils/throttle.js";
|
|
87
|
+
import { isTargetElement as Zt, offBodyTouchstart as $t, onBodyTouchstart as er } from "./utils/touchEvents.js";
|
|
88
|
+
import { getTreemap as tr } from "./utils/treemap.js";
|
|
89
|
+
import { KvBlueskyIcon as ar } from "./assets/icons/bluesky.js";
|
|
90
90
|
export {
|
|
91
91
|
ot as Alea,
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
92
|
+
Nt as BALANCE_CAMPAIGN,
|
|
93
|
+
Tt as BASE_CAMPAIGN,
|
|
94
|
+
ct as ERL_COOKIE_NAME,
|
|
95
95
|
E as KV_CLASSIC_LOAN_CARD_FRAGMENT,
|
|
96
96
|
R as KV_CLASSIC_LOAN_CARD_USER_FRAGMET,
|
|
97
97
|
de as KV_INTRODUCTION_LOAN_CARD_FRAGMENT,
|
|
@@ -107,24 +107,24 @@ export {
|
|
|
107
107
|
t as KvAccordionItem,
|
|
108
108
|
a as KvActivityRow,
|
|
109
109
|
Jo as KvAtbModal,
|
|
110
|
-
|
|
110
|
+
ar as KvBlueskyIcon,
|
|
111
111
|
l as KvBorrowerImage,
|
|
112
112
|
d as KvButton,
|
|
113
113
|
p as KvCardFrame,
|
|
114
114
|
x as KvCarousel,
|
|
115
115
|
n as KvCartModal,
|
|
116
|
-
|
|
116
|
+
i as KvCartPill,
|
|
117
117
|
C as KvCheckbox,
|
|
118
118
|
L as KvCheckoutReceipt,
|
|
119
119
|
T as KvChip,
|
|
120
120
|
M as KvClassicLoanCard,
|
|
121
|
-
|
|
122
|
-
|
|
121
|
+
I as KvCommentsAdd,
|
|
122
|
+
g as KvCommentsContainer,
|
|
123
123
|
G as KvCommentsHeartButton,
|
|
124
124
|
F as KvCommentsList,
|
|
125
125
|
D as KvCommentsListItem,
|
|
126
126
|
B as KvCommentsReplyButton,
|
|
127
|
-
|
|
127
|
+
U as KvContentfulImg,
|
|
128
128
|
w as KvCountdownTimer,
|
|
129
129
|
H as KvDatePicker,
|
|
130
130
|
z as KvExpandable,
|
|
@@ -137,15 +137,15 @@ export {
|
|
|
137
137
|
le as KvInlineActivityFeed,
|
|
138
138
|
pe as KvIntroductionLoanCard,
|
|
139
139
|
xe as KvLendAmountButton,
|
|
140
|
-
|
|
140
|
+
ie as KvLendCta,
|
|
141
141
|
Ce as KvLightbox,
|
|
142
142
|
Le as KvLineGraph,
|
|
143
|
-
|
|
143
|
+
Ue as KvLoadingPlaceholder,
|
|
144
144
|
we as KvLoadingSpinner,
|
|
145
145
|
ce as KvLoanActivities,
|
|
146
146
|
Me as KvLoanBookmark,
|
|
147
|
-
|
|
148
|
-
|
|
147
|
+
Ie as KvLoanCallouts,
|
|
148
|
+
ge as KvLoanProgressGroup,
|
|
149
149
|
he as KvLoanTag,
|
|
150
150
|
Ve as KvLoanTeamPick,
|
|
151
151
|
Be as KvLoanUse,
|
|
@@ -163,58 +163,59 @@ export {
|
|
|
163
163
|
uo as KvSelect,
|
|
164
164
|
Ko as KvSideSheet,
|
|
165
165
|
vo as KvSwitch,
|
|
166
|
-
|
|
166
|
+
Ao as KvTab,
|
|
167
167
|
_o as KvTabPanel,
|
|
168
168
|
No as KvTabs,
|
|
169
169
|
co as KvTextInput,
|
|
170
170
|
Ro as KvTextLink,
|
|
171
171
|
Oo as KvThemeProvider,
|
|
172
|
-
|
|
173
|
-
|
|
172
|
+
So as KvToast,
|
|
173
|
+
Po as KvTooltip,
|
|
174
174
|
ho as KvTreeMapChart,
|
|
175
175
|
Vo as KvUserAvatar,
|
|
176
176
|
ko as KvUtilityMenu,
|
|
177
177
|
yo as KvVerticalCarousel,
|
|
178
|
-
|
|
178
|
+
bo as KvVotingCard,
|
|
179
179
|
Wo as KvVotingCardV2,
|
|
180
180
|
Qo as KvWideLoanCard,
|
|
181
181
|
$o as KvWwwHeader,
|
|
182
|
-
|
|
183
|
-
|
|
182
|
+
vt as LOAN_CALLOUTS_FRAGMENT,
|
|
183
|
+
it as LOAN_GEOCODE_FRAGMENT,
|
|
184
184
|
At as LOAN_PROGRESS_FRAGMENT,
|
|
185
185
|
tt as Mash,
|
|
186
|
-
|
|
187
|
-
|
|
186
|
+
Et as NO_BALANCE_CAMPAIGN,
|
|
187
|
+
Rt as TOP_UP_CAMPAIGN,
|
|
188
188
|
Pt as animationCoordinator,
|
|
189
|
-
|
|
189
|
+
jt as buildTailwindClassName,
|
|
190
190
|
lt as carouselUtil,
|
|
191
191
|
dt as collapse,
|
|
192
192
|
mt as expand,
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
193
|
+
Gt as generateMapMarkers,
|
|
194
|
+
ht as getCoordinatesBetween,
|
|
195
|
+
Ft as getCountryColor,
|
|
196
|
+
Mt as getDropdownPriceArray,
|
|
197
|
+
ut as getKivaImageUrl,
|
|
198
|
+
Ot as getLendCtaSelectedOption,
|
|
199
|
+
Vt as getLoansIntervals,
|
|
200
|
+
tr as getTreemap,
|
|
201
|
+
zt as headerNumberCase,
|
|
202
|
+
It as isBetween25And50,
|
|
203
|
+
xt as isLegacyPlaceholderAvatar,
|
|
203
204
|
St as isLessThan25,
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
205
|
+
Zt as isTargetElement,
|
|
206
|
+
Qt as kebabCase,
|
|
207
|
+
Ct as loanCardComputedProperties,
|
|
208
|
+
_t as loanCardMethods,
|
|
209
|
+
kt as lockPrintSingleEl,
|
|
210
|
+
Ut as lockScroll,
|
|
210
211
|
bt as lockScrollSmallOnly,
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
212
|
+
$t as offBodyTouchstart,
|
|
213
|
+
er as onBodyTouchstart,
|
|
214
|
+
Kt as randomizedUserAvatarClass,
|
|
215
|
+
qt as removeObjectProperty,
|
|
216
|
+
Xt as throttle,
|
|
217
|
+
Bt as unlockPrintSingleEl,
|
|
218
|
+
wt as unlockScroll,
|
|
219
|
+
Wt as unlockScrollSmallOnly,
|
|
219
220
|
at as useAttrs
|
|
220
221
|
};
|
package/dist/utils/imageUtils.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import
|
|
2
|
-
function
|
|
1
|
+
import s from "./Alea.js";
|
|
2
|
+
function w(o) {
|
|
3
3
|
if (!o)
|
|
4
4
|
return !1;
|
|
5
5
|
let t = o.toString();
|
|
6
6
|
return t.includes(".") && ([t] = t.split(".")), ["726677", "315726", "4d844ac2c0b77a8a522741b908ea5c32"].includes(t);
|
|
7
7
|
}
|
|
8
|
-
function
|
|
9
|
-
const t = new
|
|
8
|
+
function $(o = "") {
|
|
9
|
+
const t = new s(o), e = [
|
|
10
10
|
{ color: "tw-text-action", bg: "tw-bg-brand-100" },
|
|
11
11
|
{ color: "tw-text-black", bg: "tw-bg-brand-100" },
|
|
12
12
|
{ color: "tw-text-white", bg: "tw-bg-action" },
|
|
@@ -17,7 +17,24 @@ function l(o = "") {
|
|
|
17
17
|
], r = e[Math.floor(t() * e.length)];
|
|
18
18
|
return `${r.color} ${r.bg}`;
|
|
19
19
|
}
|
|
20
|
+
function d({
|
|
21
|
+
base: o = "/img/",
|
|
22
|
+
width: t,
|
|
23
|
+
height: e,
|
|
24
|
+
square: r,
|
|
25
|
+
faceZoom: l,
|
|
26
|
+
hash: n,
|
|
27
|
+
format: b = "jpg"
|
|
28
|
+
}) {
|
|
29
|
+
if (!n || !t && !e && !r && !l)
|
|
30
|
+
return "";
|
|
31
|
+
let c = "", a = "";
|
|
32
|
+
t && e && t === e ? r = t : (c = t ? `w${Math.ceil(t)}` : "", a = e ? `h${Math.ceil(e)}` : "");
|
|
33
|
+
const i = r ? `s${Math.ceil(r)}` : "", g = l && (t || e || r) ? `fz${Math.ceil(l)}` : "";
|
|
34
|
+
return `${o}${c}${a}${i}${g}/${n}.${b}`;
|
|
35
|
+
}
|
|
20
36
|
export {
|
|
21
|
-
|
|
22
|
-
|
|
37
|
+
d as getKivaImageUrl,
|
|
38
|
+
w as isLegacyPlaceholderAvatar,
|
|
39
|
+
$ as randomizedUserAvatarClass
|
|
23
40
|
};
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
|
|
1
|
+
import { getKivaImageUrl as n } from "../utils/imageUtils.js";
|
|
2
|
+
import { openBlock as h, createElementBlock as l, normalizeStyle as o, createElementVNode as c, createCommentVNode as u } from "vue";
|
|
3
|
+
import m from "../_virtual/_plugin-vue_export-helper.js";
|
|
4
|
+
const g = {
|
|
4
5
|
name: "KvBorrowerImage",
|
|
5
6
|
props: {
|
|
6
7
|
/**
|
|
@@ -72,39 +73,23 @@ const $ = {
|
|
|
72
73
|
// Get the 'srcset' string for the source element
|
|
73
74
|
srcset() {
|
|
74
75
|
return this.hash ? this.images.map(({ width: t, faceZoom: e }) => {
|
|
75
|
-
const r = t * this.aspectRatio,
|
|
76
|
+
const r = t * this.aspectRatio, a = {
|
|
76
77
|
width: t,
|
|
77
78
|
height: r,
|
|
78
79
|
faceZoom: e
|
|
79
|
-
},
|
|
80
|
+
}, i = {
|
|
80
81
|
width: t * 2,
|
|
81
82
|
height: r * 2,
|
|
82
83
|
faceZoom: e
|
|
83
84
|
};
|
|
84
|
-
return `${this.getSrcsetDef(
|
|
85
|
+
return `${this.getSrcsetDef(a)}, ${this.getSrcsetDef(i)}`;
|
|
85
86
|
}).join(", ") : "";
|
|
86
87
|
}
|
|
87
88
|
},
|
|
88
89
|
methods: {
|
|
89
|
-
getKivaImageUrl({
|
|
90
|
-
base: t = "/",
|
|
91
|
-
width: e,
|
|
92
|
-
height: r,
|
|
93
|
-
square: s,
|
|
94
|
-
faceZoom: a,
|
|
95
|
-
hash: i,
|
|
96
|
-
format: u = "jpg"
|
|
97
|
-
} = {}) {
|
|
98
|
-
if (!i || !e && !r && !s && !a)
|
|
99
|
-
return "";
|
|
100
|
-
let l = "", n = "";
|
|
101
|
-
e === r ? s = e : (l = e ? `w${Math.ceil(e)}` : "", n = r ? `h${Math.ceil(r)}` : "");
|
|
102
|
-
const o = s ? `s${Math.ceil(s)}` : "", g = a ? `fz${Math.ceil(a)}` : "";
|
|
103
|
-
return `${t}${l}${n}${o}${g}/${i}.${u}`;
|
|
104
|
-
},
|
|
105
90
|
// Get the url for the loan image sized width by height
|
|
106
91
|
getImgUrl(t) {
|
|
107
|
-
return
|
|
92
|
+
return n({
|
|
108
93
|
...t,
|
|
109
94
|
base: this.photoPath,
|
|
110
95
|
hash: this.hash
|
|
@@ -115,26 +100,26 @@ const $ = {
|
|
|
115
100
|
return `${this.getImgUrl(t)} ${t.width}w`;
|
|
116
101
|
}
|
|
117
102
|
}
|
|
118
|
-
},
|
|
119
|
-
function
|
|
120
|
-
return
|
|
103
|
+
}, d = ["srcset", "sizes"], f = ["src", "alt"];
|
|
104
|
+
function p(t, e, r, a, i, s) {
|
|
105
|
+
return h(), l("picture", {
|
|
121
106
|
class: "tw-inline-block tw-relative tw-overflow-hidden tw-w-full tw-bg-black",
|
|
122
|
-
style:
|
|
107
|
+
style: o(`padding-bottom: ${r.aspectRatio * 100}%;`)
|
|
123
108
|
}, [
|
|
124
|
-
|
|
125
|
-
srcset:
|
|
126
|
-
sizes:
|
|
127
|
-
}, null, 8,
|
|
128
|
-
r.hash ? (
|
|
109
|
+
c("source", {
|
|
110
|
+
srcset: s.srcset,
|
|
111
|
+
sizes: s.sizes
|
|
112
|
+
}, null, 8, d),
|
|
113
|
+
r.hash ? (h(), l("img", {
|
|
129
114
|
key: 0,
|
|
130
115
|
class: "tw-absolute tw-w-full tw-h-full tw-object-contain",
|
|
131
|
-
src:
|
|
116
|
+
src: s.defaultUrl,
|
|
132
117
|
alt: r.alt,
|
|
133
118
|
loading: "lazy"
|
|
134
|
-
}, null, 8,
|
|
119
|
+
}, null, 8, f)) : u("", !0)
|
|
135
120
|
], 4);
|
|
136
121
|
}
|
|
137
|
-
const
|
|
122
|
+
const b = /* @__PURE__ */ m(g, [["render", p]]);
|
|
138
123
|
export {
|
|
139
|
-
|
|
124
|
+
b as default
|
|
140
125
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.header-link[data-v-
|
|
1
|
+
.header-link[data-v-290d8315]{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-290d8315]:hover{--tw-text-opacity: 1;color:rgba(var(--text-action),var(--tw-text-opacity, 1));text-decoration-line:none}[data-v-290d8315] .avatar div:first-child{display:flex}
|
|
@@ -1,20 +1,20 @@
|
|
|
1
|
-
import { defineAsyncComponent as k, ref as a, computed as
|
|
2
|
-
import { mdiAccountCircle as
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import { throttle as
|
|
1
|
+
import { defineAsyncComponent as k, ref as a, computed as C, onMounted as G, onUnmounted as J, resolveComponent as h, resolveDirective as Q, openBlock as r, createElementBlock as c, withDirectives as s, normalizeClass as p, createVNode as E, createBlock as f, withCtx as H, createTextVNode as M, createElementVNode as L, createCommentVNode as B, vShow as X, toDisplayString as Y } from "vue";
|
|
2
|
+
import { mdiAccountCircle as Z, mdiChevronDown as $, mdiMagnify as ee, mdiMenu as ne } from "@mdi/js";
|
|
3
|
+
import te from "numeral";
|
|
4
|
+
import oe from "../KvMaterialIcon.js";
|
|
5
|
+
import le from "../KvIconBag.js";
|
|
6
|
+
import ae from "./KvHeaderDropdownLink.js";
|
|
7
|
+
import re from "../KvUserAvatar.js";
|
|
8
|
+
import { throttle as ie } from "../../utils/throttle.js";
|
|
9
9
|
import { isLegacyPlaceholderAvatar as de } from "../../utils/imageUtils.js";
|
|
10
10
|
import "./KvHeaderLinkBar.css";
|
|
11
|
-
import
|
|
12
|
-
const
|
|
11
|
+
import ue from "../../_virtual/_plugin-vue_export-helper.js";
|
|
12
|
+
const me = k(() => import("./KvHeaderMobileMenu.js")), S = k(() => import("./KvHeaderMyKivaMenu.js")), se = k(() => import("./LendMenu/KvLendMenu.js")), ve = k(() => import("./KvHeaderTakeActionMenu.js")), ce = k(() => import("./KvHeaderAboutMenu.js")), P = 146, y = "avatar-menu", K = "menuButton", V = { top: "-3.75rem", width: "100%" }, we = {
|
|
13
13
|
components: {
|
|
14
|
-
KvMaterialIcon:
|
|
15
|
-
KvIconBag:
|
|
16
|
-
KvHeaderDropdownLink:
|
|
17
|
-
KvUserAvatar:
|
|
14
|
+
KvMaterialIcon: oe,
|
|
15
|
+
KvIconBag: le,
|
|
16
|
+
KvHeaderDropdownLink: ae,
|
|
17
|
+
KvUserAvatar: re
|
|
18
18
|
},
|
|
19
19
|
props: {
|
|
20
20
|
loggedIn: {
|
|
@@ -57,60 +57,60 @@ const se = k(() => import("./KvHeaderMobileMenu.js")), S = k(() => import("./KvH
|
|
|
57
57
|
emits: [
|
|
58
58
|
"item-hover"
|
|
59
59
|
],
|
|
60
|
-
setup(
|
|
61
|
-
const t = a(null),
|
|
62
|
-
|
|
63
|
-
}, R = (l, m,
|
|
64
|
-
navigator.maxTouchPoints || (o.value = l,
|
|
60
|
+
setup(d, { emit: e }) {
|
|
61
|
+
const t = a(null), n = a(null), O = a(null), U = a(null), g = a(null), w = a(null), A = a(null), T = a(null), i = a(null), o = a(null), I = a(!1), b = a(), u = (l, m, v = null) => {
|
|
62
|
+
e("item-hover", l, m, v);
|
|
63
|
+
}, R = (l, m, v = null) => {
|
|
64
|
+
navigator.maxTouchPoints || (o.value = l, u(
|
|
65
65
|
l,
|
|
66
66
|
m,
|
|
67
|
-
l ===
|
|
67
|
+
l === K && d.isMobile ? V : v
|
|
68
68
|
));
|
|
69
69
|
}, F = (l) => {
|
|
70
|
-
!
|
|
70
|
+
!I.value && o.value === l && (o.value = null, u());
|
|
71
71
|
}, z = () => {
|
|
72
|
-
var
|
|
73
|
-
const l = (_ = (
|
|
72
|
+
var D, _;
|
|
73
|
+
const l = (_ = (D = t.value) == null ? void 0 : D.userAvatar) == null ? void 0 : _.getBoundingClientRect();
|
|
74
74
|
if (!l) return null;
|
|
75
|
-
const
|
|
75
|
+
const v = l.left + l.width / 2 - P / 2;
|
|
76
76
|
return {
|
|
77
|
-
...
|
|
77
|
+
...v + P > window.innerWidth ? { right: 0 } : { left: d.isMobile ? 0 : `${v}px` },
|
|
78
78
|
marginTop: "-2px",
|
|
79
79
|
// Avoid closing avatar menu on header edge
|
|
80
|
-
borderRadius:
|
|
80
|
+
borderRadius: d.isMobile ? "auto" : "0px 0px 8px 8px"
|
|
81
81
|
};
|
|
82
82
|
}, x = () => {
|
|
83
|
-
o.value =
|
|
83
|
+
o.value = y, u(t.value, S, z());
|
|
84
84
|
}, W = (l, m) => {
|
|
85
|
-
b.value = null,
|
|
86
|
-
|
|
85
|
+
b.value = null, I.value = !0, b.value && clearTimeout(b.value), o.value === K && (o.value = null), !o.value || o.value !== l ? (o.value = l, l === y ? x() : l === K && d.isMobile ? u(l, m, V) : u(l, m)) : (o.value = null, u()), b.value = setTimeout(() => {
|
|
86
|
+
I.value = !1;
|
|
87
87
|
}, 500);
|
|
88
|
-
},
|
|
89
|
-
o.value ===
|
|
90
|
-
}, 100), j =
|
|
88
|
+
}, N = ie(() => {
|
|
89
|
+
o.value === y && x();
|
|
90
|
+
}, 100), j = C(() => d.isMobile ? void 0 : "/lend-by-category"), q = C(() => {
|
|
91
91
|
var l;
|
|
92
|
-
return ((l =
|
|
92
|
+
return ((l = d.lenderImageUrl) == null ? void 0 : l.split("/").pop()) ?? "";
|
|
93
93
|
});
|
|
94
94
|
return G(() => {
|
|
95
|
-
import("./KvHeaderMobileMenu.js"), import("./KvHeaderMyKivaMenu.js"), import("./LendMenu/KvLendMenu.js"), import("./KvHeaderTakeActionMenu.js"), import("./KvHeaderAboutMenu.js"), window.addEventListener("resize",
|
|
95
|
+
import("./KvHeaderMobileMenu.js"), import("./KvHeaderMyKivaMenu.js"), import("./LendMenu/KvLendMenu.js"), import("./KvHeaderTakeActionMenu.js"), import("./KvHeaderAboutMenu.js"), window.addEventListener("resize", N);
|
|
96
96
|
}), J(() => {
|
|
97
|
-
window.removeEventListener("resize",
|
|
97
|
+
window.removeEventListener("resize", N);
|
|
98
98
|
}), {
|
|
99
|
-
AVATAR_MENU_ID:
|
|
99
|
+
AVATAR_MENU_ID: y,
|
|
100
100
|
openMenuId: o,
|
|
101
|
-
numeral:
|
|
102
|
-
mdiAccountCircle:
|
|
103
|
-
mdiChevronDown:
|
|
104
|
-
mdiMagnify:
|
|
105
|
-
mdiMenu:
|
|
106
|
-
onHover:
|
|
101
|
+
numeral: te,
|
|
102
|
+
mdiAccountCircle: Z,
|
|
103
|
+
mdiChevronDown: $,
|
|
104
|
+
mdiMagnify: ee,
|
|
105
|
+
mdiMenu: ne,
|
|
106
|
+
onHover: u,
|
|
107
107
|
avatar: t,
|
|
108
|
-
lendButton:
|
|
109
|
-
aboutUsLink:
|
|
110
|
-
partnerWithUsLink:
|
|
108
|
+
lendButton: n,
|
|
109
|
+
aboutUsLink: O,
|
|
110
|
+
partnerWithUsLink: U,
|
|
111
111
|
borrowLink: g,
|
|
112
|
-
supportKivaLink:
|
|
113
|
-
basketLink:
|
|
112
|
+
supportKivaLink: w,
|
|
113
|
+
basketLink: A,
|
|
114
114
|
signInLink: T,
|
|
115
115
|
menuButton: i,
|
|
116
116
|
lendUrl: j,
|
|
@@ -119,148 +119,146 @@ const se = k(() => import("./KvHeaderMobileMenu.js")), S = k(() => import("./KvH
|
|
|
119
119
|
handleTouchStart: W,
|
|
120
120
|
handleMouseOut: F,
|
|
121
121
|
handleAvatarMenuPosition: x,
|
|
122
|
-
KvHeaderMobileMenu:
|
|
122
|
+
KvHeaderMobileMenu: me,
|
|
123
123
|
KvHeaderMyKivaMenu: S,
|
|
124
|
-
KvLendMenu:
|
|
125
|
-
KvHeaderTakeActionMenu:
|
|
126
|
-
KvHeaderAboutMenu:
|
|
124
|
+
KvLendMenu: se,
|
|
125
|
+
KvHeaderTakeActionMenu: ve,
|
|
126
|
+
KvHeaderAboutMenu: ce,
|
|
127
127
|
isLegacyPlaceholderAvatar: de
|
|
128
128
|
};
|
|
129
129
|
}
|
|
130
|
-
},
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
const g = h("kv-material-icon"), f = h("KvHeaderDropdownLink"), I = h("kv-icon-bag"), T = h("KvUserAvatar"), i = Q("kv-track-event");
|
|
136
|
-
return r(), s("div", Me, [
|
|
137
|
-
v((r(), s("button", {
|
|
130
|
+
}, fe = { class: "tw-h-full tw-flex tw-items-center tw-gap-0.5 md:tw-gap-2 lg:tw-gap-2.5" }, Me = ["href"], ke = { class: "tw-text-eco-green-4" }, ge = ["href"];
|
|
131
|
+
function be(d, e, t, n, O, U) {
|
|
132
|
+
const g = h("kv-material-icon"), w = h("KvHeaderDropdownLink"), A = h("kv-icon-bag"), T = h("KvUserAvatar"), i = Q("kv-track-event");
|
|
133
|
+
return r(), c("div", fe, [
|
|
134
|
+
s((r(), c("button", {
|
|
138
135
|
ref: "menuButton",
|
|
139
136
|
class: p(["header-link tw-inline-flex md:tw-hidden", {
|
|
140
|
-
"tw-text-tertiary": t.openMenuItem && t.openMenuItem !==
|
|
137
|
+
"tw-text-tertiary": t.openMenuItem && t.openMenuItem !== n.KvHeaderMobileMenu
|
|
141
138
|
}]),
|
|
142
|
-
onMouseover:
|
|
143
|
-
onMouseout:
|
|
144
|
-
onTouchstart:
|
|
139
|
+
onMouseover: e[0] || (e[0] = (o) => n.handleOnHover("menuButton", n.KvHeaderMobileMenu)),
|
|
140
|
+
onMouseout: e[1] || (e[1] = (o) => n.handleMouseOut("menuButton")),
|
|
141
|
+
onTouchstart: e[2] || (e[2] = (o) => n.handleTouchStart("menuButton", n.KvHeaderMobileMenu))
|
|
145
142
|
}, [
|
|
146
|
-
|
|
143
|
+
E(g, { icon: n.mdiMenu }, null, 8, ["icon"])
|
|
147
144
|
], 34)), [
|
|
148
|
-
[i, t.openMenuItem ===
|
|
145
|
+
[i, t.openMenuItem === n.KvHeaderMobileMenu ? ["TopNav", "click-Hamburger-menu"] : null]
|
|
149
146
|
]),
|
|
150
|
-
|
|
147
|
+
s((r(), f(w, {
|
|
151
148
|
class: "tw-py-1",
|
|
152
149
|
"ref-name": "lendButton",
|
|
153
|
-
href:
|
|
154
|
-
"menu-component":
|
|
150
|
+
href: n.lendUrl,
|
|
151
|
+
"menu-component": n.KvLendMenu,
|
|
155
152
|
"open-menu-item": t.openMenuItem,
|
|
156
|
-
"dropdown-icon":
|
|
153
|
+
"dropdown-icon": n.mdiChevronDown,
|
|
157
154
|
"base-class": "tw-inline-flex md:tw-border md:tw-rounded-md tw-px-1.5 tw-py-1",
|
|
158
|
-
onOnHover:
|
|
159
|
-
onMouseout:
|
|
160
|
-
onTouchstart:
|
|
155
|
+
onOnHover: n.handleOnHover,
|
|
156
|
+
onMouseout: e[3] || (e[3] = (o) => n.handleMouseOut("lendButton")),
|
|
157
|
+
onTouchstart: e[4] || (e[4] = (o) => n.handleTouchStart("lendButton", n.KvLendMenu))
|
|
161
158
|
}, {
|
|
162
|
-
default:
|
|
159
|
+
default: H(() => e[10] || (e[10] = [
|
|
163
160
|
M(" Lend ")
|
|
164
161
|
])),
|
|
165
162
|
_: 1
|
|
166
163
|
}, 8, ["href", "menu-component", "open-menu-item", "dropdown-icon", "onOnHover"])), [
|
|
167
164
|
[i, ["TopNav", "click-Lend"]]
|
|
168
165
|
]),
|
|
169
|
-
|
|
166
|
+
s((r(), f(w, {
|
|
170
167
|
"ref-name": "takeActionButton",
|
|
171
168
|
"base-class": "tw-hidden md:tw-inline-flex tw-py-1",
|
|
172
|
-
"menu-component":
|
|
169
|
+
"menu-component": n.KvHeaderTakeActionMenu,
|
|
173
170
|
"open-menu-item": t.openMenuItem,
|
|
174
|
-
"dropdown-icon":
|
|
171
|
+
"dropdown-icon": n.mdiChevronDown,
|
|
175
172
|
"send-link-position": "",
|
|
176
|
-
onOnHover:
|
|
177
|
-
onMouseout:
|
|
173
|
+
onOnHover: n.handleOnHover,
|
|
174
|
+
onMouseout: e[5] || (e[5] = (o) => n.handleMouseOut("takeActionButton"))
|
|
178
175
|
}, {
|
|
179
|
-
default:
|
|
176
|
+
default: H(() => e[11] || (e[11] = [
|
|
180
177
|
M(" Take action ")
|
|
181
178
|
])),
|
|
182
179
|
_: 1
|
|
183
180
|
}, 8, ["menu-component", "open-menu-item", "dropdown-icon", "onOnHover"])), [
|
|
184
181
|
[i, ["TopNav", "click-TakeAction"]]
|
|
185
182
|
]),
|
|
186
|
-
|
|
183
|
+
s((r(), f(w, {
|
|
187
184
|
"ref-name": "aboutUsLink",
|
|
188
185
|
"data-testid": "header-about",
|
|
189
186
|
"base-class": "tw-hidden md:tw-inline-flex tw-py-1",
|
|
190
|
-
"menu-component":
|
|
187
|
+
"menu-component": n.KvHeaderAboutMenu,
|
|
191
188
|
"open-menu-item": t.openMenuItem,
|
|
192
|
-
"dropdown-icon":
|
|
189
|
+
"dropdown-icon": n.mdiChevronDown,
|
|
193
190
|
"send-link-position": "",
|
|
194
|
-
onOnHover:
|
|
195
|
-
onMouseout:
|
|
191
|
+
onOnHover: n.handleOnHover,
|
|
192
|
+
onMouseout: e[6] || (e[6] = (o) => n.handleMouseOut("aboutUsLink"))
|
|
196
193
|
}, {
|
|
197
|
-
default:
|
|
194
|
+
default: H(() => e[12] || (e[12] = [
|
|
198
195
|
M(" About ")
|
|
199
196
|
])),
|
|
200
197
|
_: 1
|
|
201
198
|
}, 8, ["menu-component", "open-menu-item", "dropdown-icon", "onOnHover"])), [
|
|
202
199
|
[i, ["TopNav", "click-About"]]
|
|
203
200
|
]),
|
|
204
|
-
|
|
205
|
-
t.loggedIn ?
|
|
201
|
+
e[16] || (e[16] = L("div", { class: "tw-flex-1 tw-h-full" }, null, -1)),
|
|
202
|
+
t.loggedIn ? s((r(), c("a", {
|
|
206
203
|
key: 0,
|
|
207
204
|
ref: "dashboardLink",
|
|
208
205
|
href: t.myDashboardUrl,
|
|
209
206
|
class: p(["header-link tw-hidden md:tw-block", { "tw-text-tertiary": !!t.openMenuItem }])
|
|
210
|
-
},
|
|
207
|
+
}, e[13] || (e[13] = [
|
|
211
208
|
M(" My dashboard ")
|
|
212
|
-
]), 10,
|
|
209
|
+
]), 10, Me)), [
|
|
213
210
|
[i, ["TopNav", "click-Dashboard"]]
|
|
214
|
-
]) :
|
|
215
|
-
|
|
211
|
+
]) : B("", !0),
|
|
212
|
+
s((r(), c("a", {
|
|
216
213
|
ref: "basketLink",
|
|
217
214
|
href: "/basket",
|
|
218
|
-
class: p(["header-link tw-relative md:!tw-mr-0", { "tw-text-tertiary": !!t.openMenuItem }]),
|
|
215
|
+
class: p(["header-link tw-relative md:!tw-mr-0 tw-flex tw-items-center tw-gap-0.5", { "tw-text-tertiary": !!t.openMenuItem }]),
|
|
219
216
|
style: { "margin-right": "2px" },
|
|
220
217
|
"data-testid": "header-basket"
|
|
221
218
|
}, [
|
|
222
|
-
|
|
223
|
-
class: "tw-w-3 tw-h-3 tw-pointer-events-none",
|
|
219
|
+
E(A, {
|
|
220
|
+
class: "tw-w-3 tw-h-3 md:tw-w-3.5 md:tw-h-3.5 tw-pointer-events-none",
|
|
224
221
|
count: t.basketCount
|
|
225
|
-
}, null, 8, ["count"])
|
|
222
|
+
}, null, 8, ["count"]),
|
|
223
|
+
e[14] || (e[14] = L("span", { class: "tw-hidden md:tw-block" }, "Basket", -1))
|
|
226
224
|
], 2)), [
|
|
227
225
|
[X, t.basketCount > 0],
|
|
228
226
|
[i, ["TopNav", "click-Basket"]]
|
|
229
227
|
]),
|
|
230
|
-
|
|
231
|
-
class: "tw-cursor-pointer tw-flex tw-items-center tw-gap-1 tw-py-1.5",
|
|
232
|
-
onMouseover: n[7] || (n[7] = (...o) => e.handleAvatarMenuPosition && e.handleAvatarMenuPosition(...o)),
|
|
233
|
-
onMouseout: n[8] || (n[8] = (o) => e.handleMouseOut(e.AVATAR_MENU_ID)),
|
|
234
|
-
onTouchstart: n[9] || (n[9] = (o) => e.handleTouchStart(e.AVATAR_MENU_ID))
|
|
235
|
-
}, [
|
|
236
|
-
t.loggedIn ? (r(), s("span", ge, Y(e.numeral(t.balance).format("$0")), 1)) : y("", !0),
|
|
237
|
-
t.loggedIn ? (r(), s(Z, { key: 1 }, [
|
|
238
|
-
e.isLegacyPlaceholderAvatar(e.avatarFilename) || !e.avatarFilename ? (r(), w(g, {
|
|
239
|
-
key: 0,
|
|
240
|
-
icon: e.mdiAccountCircle,
|
|
241
|
-
class: "tw-w-3"
|
|
242
|
-
}, null, 8, ["icon"])) : (r(), w(T, {
|
|
243
|
-
key: 1,
|
|
244
|
-
ref: "avatar",
|
|
245
|
-
"lender-name": t.lenderName,
|
|
246
|
-
"lender-image-url": t.lenderImageUrl,
|
|
247
|
-
"is-small": ""
|
|
248
|
-
}, null, 8, ["lender-name", "lender-image-url"]))
|
|
249
|
-
], 64)) : y("", !0)
|
|
250
|
-
], 32),
|
|
251
|
-
t.loggedIn ? y("", !0) : v((r(), s("a", {
|
|
228
|
+
t.loggedIn ? (r(), c("div", {
|
|
252
229
|
key: 1,
|
|
230
|
+
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",
|
|
231
|
+
onMouseover: e[7] || (e[7] = (...o) => n.handleAvatarMenuPosition && n.handleAvatarMenuPosition(...o)),
|
|
232
|
+
onMouseout: e[8] || (e[8] = (o) => n.handleMouseOut(n.AVATAR_MENU_ID)),
|
|
233
|
+
onTouchstart: e[9] || (e[9] = (o) => n.handleTouchStart(n.AVATAR_MENU_ID))
|
|
234
|
+
}, [
|
|
235
|
+
n.isLegacyPlaceholderAvatar(n.avatarFilename) || !n.avatarFilename ? (r(), f(g, {
|
|
236
|
+
key: 0,
|
|
237
|
+
icon: n.mdiAccountCircle,
|
|
238
|
+
class: "tw-w-3"
|
|
239
|
+
}, null, 8, ["icon"])) : (r(), f(T, {
|
|
240
|
+
key: 1,
|
|
241
|
+
ref: "avatar",
|
|
242
|
+
class: "avatar",
|
|
243
|
+
"lender-name": t.lenderName,
|
|
244
|
+
"lender-image-url": t.lenderImageUrl,
|
|
245
|
+
"is-small": ""
|
|
246
|
+
}, null, 8, ["lender-name", "lender-image-url"])),
|
|
247
|
+
L("span", ke, Y(n.numeral(t.balance).format("$0")), 1)
|
|
248
|
+
], 32)) : B("", !0),
|
|
249
|
+
t.loggedIn ? B("", !0) : s((r(), c("a", {
|
|
250
|
+
key: 2,
|
|
253
251
|
ref: "signInLink",
|
|
254
252
|
href: t.loginUrl,
|
|
255
253
|
class: p(["header-link", { "tw-text-tertiary": !!t.openMenuItem }])
|
|
256
|
-
},
|
|
254
|
+
}, e[15] || (e[15] = [
|
|
257
255
|
M(" Sign in ")
|
|
258
|
-
]), 10,
|
|
256
|
+
]), 10, ge)), [
|
|
259
257
|
[i, ["TopNav", "click-Sign-in"]]
|
|
260
258
|
])
|
|
261
259
|
]);
|
|
262
260
|
}
|
|
263
|
-
const
|
|
261
|
+
const Ue = /* @__PURE__ */ ue(we, [["render", be], ["__scopeId", "data-v-290d8315"]]);
|
|
264
262
|
export {
|
|
265
|
-
|
|
263
|
+
Ue as default
|
|
266
264
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kiva/kv-components",
|
|
3
|
-
"version": "6.
|
|
3
|
+
"version": "6.55.0",
|
|
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": "
|
|
117
|
+
"gitHead": "db972d1dc2773ec8ec78c81a3ce09ebf74356c22"
|
|
118
118
|
}
|