@eturnity/eturnity_reusable_components 8.26.1 → 8.26.2
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/main.es12.js +2 -2
- package/dist/main.es13.js +3 -3
- package/dist/main.es14.js +2 -2
- package/dist/main.es15.js +212 -60
- package/dist/main.es16.js +21 -196
- package/dist/main.es17.js +1051 -19
- package/dist/main.es18.js +215 -1044
- package/dist/main.es19.js +69 -197
- package/dist/main.es20.js +2 -99
- package/dist/main.es21.js +541 -2
- package/dist/main.es22.js +188 -530
- package/dist/main.es23.js +60 -212
- package/dist/main.es24.js +2 -2
- package/dist/main.es5.js +3 -3
- package/dist/main.es6.js +4 -4
- package/dist/main.es9.js +1 -1
- package/package.json +1 -1
- package/src/components/errorMessage/index.vue +1 -1
- package/src/components/inputs/inputText/index.vue +1 -3
- package/src/components/tableDropdown/index.vue +7 -5
package/dist/main.es22.js
CHANGED
@@ -1,543 +1,201 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
const
|
10
|
-
|
11
|
-
|
12
|
-
width: Number
|
1
|
+
function makeMap(str, expectsLowerCase) {
|
2
|
+
const map = /* @__PURE__ */ Object.create(null);
|
3
|
+
const list = str.split(",");
|
4
|
+
for (let i = 0; i < list.length; i++) {
|
5
|
+
map[list[i]] = true;
|
6
|
+
}
|
7
|
+
return expectsLowerCase ? (val) => !!map[val.toLowerCase()] : (val) => !!map[val];
|
8
|
+
}
|
9
|
+
const EMPTY_OBJ = !!(process.env.NODE_ENV !== "production") ? Object.freeze({}) : {};
|
10
|
+
const EMPTY_ARR = !!(process.env.NODE_ENV !== "production") ? Object.freeze([]) : [];
|
11
|
+
const NOOP = () => {
|
13
12
|
};
|
14
|
-
const
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
a {
|
26
|
-
color: ${(props) => props.theme.colors.blue};
|
27
|
-
}
|
28
|
-
|
29
|
-
img + span {
|
30
|
-
margin-top: 10px;
|
31
|
-
display: block;
|
32
|
-
}
|
33
|
-
`;
|
34
|
-
const PageContainer = styled("div")`
|
35
|
-
display: ${(props) => props.type === "dot" ? "unset" : "inline-block"};
|
36
|
-
position: relative;
|
37
|
-
`;
|
38
|
-
const TextWrapper = styled("div")`
|
39
|
-
z-index: 9999999999;
|
40
|
-
position: absolute;
|
41
|
-
`;
|
42
|
-
const OverlayImage = styled("img")`
|
43
|
-
width: 100%;
|
44
|
-
height: auto;
|
45
|
-
`;
|
46
|
-
const Dot = styled("div")`
|
47
|
-
width: 5px;
|
48
|
-
height: 5px;
|
49
|
-
background-color: ${(props) => props.color};
|
50
|
-
border-radius: 50%;
|
51
|
-
`;
|
52
|
-
const IconWrapperAttrs = {
|
53
|
-
backgroundColor: String,
|
54
|
-
borderRadius: String,
|
55
|
-
padding: String,
|
56
|
-
hoveredIcon: Boolean,
|
57
|
-
isActive: Boolean,
|
58
|
-
isDisabled: Boolean
|
13
|
+
const NO = () => false;
|
14
|
+
const onRE = /^on[^a-z]/;
|
15
|
+
const isOn = (key) => onRE.test(key);
|
16
|
+
const isModelListener = (key) => key.startsWith("onUpdate:");
|
17
|
+
const extend = Object.assign;
|
18
|
+
const remove = (arr, el) => {
|
19
|
+
const i = arr.indexOf(el);
|
20
|
+
if (i > -1) {
|
21
|
+
arr.splice(i, 1);
|
22
|
+
}
|
59
23
|
};
|
60
|
-
const
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
height: ${(props) => props.hoveredIcon ? "32px" : ""};
|
71
|
-
cursor: pointer;
|
72
|
-
background-color: ${(props) => props.isActive ? props.theme.colors.transparentWhite2 : ""};
|
73
|
-
cursor: ${(props) => props.isDisabled ? "not-allowed" : "pointer"};
|
74
|
-
&:hover {
|
75
|
-
background-color: ${(props) => props.hoveredIcon ? props.theme.colors.transparentWhite2 : ""};
|
76
|
-
}
|
77
|
-
`;
|
78
|
-
const LabelWrapperAttrs = {
|
79
|
-
size: String,
|
80
|
-
color: String
|
24
|
+
const hasOwnProperty = Object.prototype.hasOwnProperty;
|
25
|
+
const hasOwn = (val, key) => hasOwnProperty.call(val, key);
|
26
|
+
const isArray = Array.isArray;
|
27
|
+
const isMap = (val) => toTypeString(val) === "[object Map]";
|
28
|
+
const isSet = (val) => toTypeString(val) === "[object Set]";
|
29
|
+
const isFunction = (val) => typeof val === "function";
|
30
|
+
const isString = (val) => typeof val === "string";
|
31
|
+
const isObject = (val) => val !== null && typeof val === "object";
|
32
|
+
const isPromise = (val) => {
|
33
|
+
return isObject(val) && isFunction(val.then) && isFunction(val.catch);
|
81
34
|
};
|
82
|
-
const
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
126
|
-
|
127
|
-
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
134
|
-
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
144
|
-
|
145
|
-
|
146
|
-
|
147
|
-
type: String,
|
148
|
-
default: null,
|
149
|
-
required: false
|
150
|
-
},
|
151
|
-
isDisabled: {
|
152
|
-
type: Boolean,
|
153
|
-
default: false,
|
154
|
-
required: false
|
155
|
-
},
|
156
|
-
dotColor: {
|
157
|
-
type: String,
|
158
|
-
required: false,
|
159
|
-
default: theme.semanticColors.blue[400]
|
160
|
-
},
|
161
|
-
type: {
|
162
|
-
type: String,
|
163
|
-
required: false,
|
164
|
-
default: "info"
|
165
|
-
// info, dot
|
166
|
-
},
|
167
|
-
appTheme: {
|
168
|
-
type: String,
|
169
|
-
default: "light",
|
170
|
-
// light or dark
|
171
|
-
required: false
|
172
|
-
},
|
173
|
-
labelAlign: {
|
174
|
-
type: String,
|
175
|
-
default: "right",
|
176
|
-
required: false
|
177
|
-
},
|
178
|
-
backgroundColor: {
|
179
|
-
type: String,
|
180
|
-
default: "",
|
181
|
-
required: false
|
182
|
-
},
|
183
|
-
contentBackgroundColor: {
|
184
|
-
type: String,
|
185
|
-
default: "",
|
186
|
-
required: false
|
187
|
-
},
|
188
|
-
borderRadius: {
|
189
|
-
type: String,
|
190
|
-
default: "",
|
191
|
-
required: false
|
192
|
-
},
|
193
|
-
padding: {
|
194
|
-
type: String,
|
195
|
-
default: "",
|
196
|
-
required: false
|
197
|
-
},
|
198
|
-
labelSize: {
|
199
|
-
type: String,
|
200
|
-
default: "12px",
|
201
|
-
required: false
|
202
|
-
},
|
203
|
-
noIcon: {
|
204
|
-
type: Boolean,
|
205
|
-
default: false,
|
206
|
-
required: false
|
207
|
-
},
|
208
|
-
hoveredIcon: {
|
209
|
-
type: Boolean,
|
210
|
-
default: false,
|
211
|
-
required: false
|
212
|
-
},
|
213
|
-
hideInfoText: {
|
214
|
-
type: Boolean,
|
215
|
-
default: false,
|
216
|
-
required: false
|
217
|
-
}
|
218
|
-
},
|
219
|
-
setup(props) {
|
220
|
-
const isVisible = ref(false);
|
221
|
-
const container = ref(null);
|
222
|
-
const icon = ref(null);
|
223
|
-
const infoBox = ref(null);
|
224
|
-
const textContent = ref(null);
|
225
|
-
const infoImage = ref(null);
|
226
|
-
const infoBoxWidth = ref(0);
|
227
|
-
const infoBoxHeight = ref(0);
|
228
|
-
const boxStyle = ref({});
|
229
|
-
const arrowStyle = ref({});
|
230
|
-
const wrapperStyle = ref({});
|
231
|
-
const isMobile = ref(window.innerWidth <= 768);
|
232
|
-
const textStyle = computed(() => ({
|
233
|
-
fontSize: props.image ? "12px" : "13px",
|
234
|
-
color: props.image ? theme.colors.grey1 : props.appTheme === "dark" ? theme.colors.black : theme.colors.white,
|
235
|
-
textAlign: props.image ? "right" : "left"
|
236
|
-
}));
|
237
|
-
const calculatePosition = (width) => {
|
238
|
-
if (!icon.value || !width)
|
239
|
-
return {};
|
240
|
-
const iconRect = icon.value.getBoundingClientRect();
|
241
|
-
const windowHeight = window.innerHeight;
|
242
|
-
const windowWidth = window.innerWidth;
|
243
|
-
const spaceBelow = windowHeight - iconRect.bottom - 10;
|
244
|
-
const spaceAbove = iconRect.top - 10;
|
245
|
-
const spaceRight = windowWidth - iconRect.right - 10;
|
246
|
-
const spaceLeft = iconRect.left - 10;
|
247
|
-
const positions = [{
|
248
|
-
position: "bottom",
|
249
|
-
space: spaceBelow
|
250
|
-
}, {
|
251
|
-
position: "top",
|
252
|
-
space: spaceAbove
|
253
|
-
}, {
|
254
|
-
position: "right",
|
255
|
-
space: spaceRight
|
256
|
-
}, {
|
257
|
-
position: "left",
|
258
|
-
space: spaceLeft
|
259
|
-
}].sort((a, b) => b.space - a.space);
|
260
|
-
const bestPosition = props.infoPosition ? props.infoPosition : positions[0].position;
|
261
|
-
let top, left, arrowPosition;
|
262
|
-
switch (bestPosition) {
|
263
|
-
case "bottom":
|
264
|
-
top = Math.round(iconRect.bottom + 10);
|
265
|
-
left = Math.round(Math.min(iconRect.left, windowWidth - width - 10));
|
266
|
-
arrowPosition = {
|
267
|
-
left: `${Math.round(Math.min(Math.max(iconRect.left - left + iconRect.width / 2 - 8, 2), width - 18))}px`,
|
268
|
-
top: "-7px",
|
269
|
-
bottom: "auto",
|
270
|
-
transform: "rotate(180deg)"
|
271
|
-
};
|
272
|
-
break;
|
273
|
-
case "top":
|
274
|
-
top = Math.round(iconRect.top - infoBoxHeight.value - 10);
|
275
|
-
left = Math.round(Math.min(iconRect.left, windowWidth - width - 10));
|
276
|
-
arrowPosition = {
|
277
|
-
left: `${Math.round(Math.min(Math.max(iconRect.left - left + iconRect.width / 2 - 8, 2), width - 18))}px`,
|
278
|
-
top: "auto",
|
279
|
-
bottom: "-7px",
|
280
|
-
transform: "none"
|
281
|
-
};
|
282
|
-
break;
|
283
|
-
case "right":
|
284
|
-
top = Math.round(Math.max(Math.min(iconRect.top - (infoBoxHeight.value - iconRect.height) / 2, windowHeight - infoBoxHeight.value - 10), 10));
|
285
|
-
left = Math.round(iconRect.right + 10);
|
286
|
-
arrowPosition = {
|
287
|
-
left: "-7px",
|
288
|
-
top: `${Math.round(Math.min(Math.max(iconRect.top - top + iconRect.height / 2 - 8, 2), infoBoxHeight.value - 18))}px`,
|
289
|
-
bottom: "auto",
|
290
|
-
transform: "rotate(90deg)"
|
291
|
-
};
|
292
|
-
break;
|
293
|
-
case "left":
|
294
|
-
top = Math.round(Math.max(Math.min(iconRect.top - (infoBoxHeight.value - iconRect.height) / 2, windowHeight - infoBoxHeight.value - 10), 10));
|
295
|
-
left = Math.round(iconRect.left - width - 10);
|
296
|
-
arrowPosition = {
|
297
|
-
left: "auto",
|
298
|
-
right: "-7px",
|
299
|
-
top: `${Math.round(Math.min(Math.max(iconRect.top - top + iconRect.height / 2 - 8, 2), infoBoxHeight.value - 18))}px`,
|
300
|
-
bottom: "auto",
|
301
|
-
transform: "rotate(-90deg)"
|
302
|
-
};
|
303
|
-
break;
|
304
|
-
}
|
305
|
-
arrowStyle.value = arrowPosition;
|
306
|
-
wrapperStyle.value = {
|
307
|
-
position: "fixed",
|
308
|
-
top: `${top}px`,
|
309
|
-
left: `${left}px`,
|
310
|
-
transform: "none",
|
311
|
-
width: `${width}px`
|
312
|
-
};
|
313
|
-
return {
|
314
|
-
width: "100%",
|
315
|
-
maxWidth: props.maxWidth,
|
316
|
-
overflowY: "auto",
|
317
|
-
backgroundColor: props.contentBackgroundColor ? props.contentBackgroundColor : props.image ? theme.colors.white : props.appTheme === "light" ? theme.colors.black : theme.colors.grey5
|
318
|
-
};
|
319
|
-
};
|
320
|
-
const showInfo = async () => {
|
321
|
-
isVisible.value = true;
|
322
|
-
await nextTick();
|
323
|
-
await nextTick();
|
324
|
-
await updatePosition();
|
325
|
-
};
|
326
|
-
const hideInfo = () => {
|
327
|
-
isVisible.value = false;
|
328
|
-
infoBoxWidth.value = 0;
|
329
|
-
};
|
330
|
-
const toggleInfo = () => {
|
331
|
-
isVisible.value ? hideInfo() : showInfo();
|
332
|
-
};
|
333
|
-
const handleScroll = () => {
|
334
|
-
if (isVisible.value) {
|
335
|
-
hideInfo();
|
336
|
-
}
|
337
|
-
updatePosition();
|
338
|
-
};
|
339
|
-
const isIconInView = () => {
|
340
|
-
if (!icon.value)
|
341
|
-
return false;
|
342
|
-
const rect = icon.value.getBoundingClientRect();
|
343
|
-
return rect.top >= 0 && rect.left >= 0 && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && rect.right <= (window.innerWidth || document.documentElement.clientWidth);
|
344
|
-
};
|
345
|
-
const updatePosition = async () => {
|
346
|
-
if (!infoBox.value || !textContent.value)
|
347
|
-
return;
|
348
|
-
if (infoBox.value.$el) {
|
349
|
-
infoBox.value.$el.style.visibility = "hidden";
|
350
|
-
infoBox.value.$el.style.display = "block";
|
351
|
-
}
|
352
|
-
await nextTick();
|
353
|
-
if (!isIconInView()) {
|
354
|
-
if (isVisible.value)
|
355
|
-
hideInfo();
|
356
|
-
return;
|
357
|
-
}
|
358
|
-
const clone = textContent.value.cloneNode(true);
|
359
|
-
clone.style.position = "absolute";
|
360
|
-
clone.style.visibility = "hidden";
|
361
|
-
clone.style.width = "auto";
|
362
|
-
clone.style.maxWidth = "none";
|
363
|
-
clone.style.whiteSpace = "nowrap";
|
364
|
-
document.body.appendChild(clone);
|
365
|
-
const contentWidth = clone.offsetWidth;
|
366
|
-
document.body.removeChild(clone);
|
367
|
-
const calculatedWidth = Math.min(Math.max(contentWidth, 230), parseInt(props.maxWidth, 10));
|
368
|
-
infoBoxWidth.value = calculatedWidth;
|
369
|
-
await nextTick();
|
370
|
-
infoBoxHeight.value = infoBox.value.$el.offsetHeight;
|
371
|
-
boxStyle.value = calculatePosition(calculatedWidth);
|
372
|
-
if (isVisible.value && infoBox.value.$el) {
|
373
|
-
infoBox.value.$el.style.visibility = "visible";
|
35
|
+
const objectToString = Object.prototype.toString;
|
36
|
+
const toTypeString = (value) => objectToString.call(value);
|
37
|
+
const toRawType = (value) => {
|
38
|
+
return toTypeString(value).slice(8, -1);
|
39
|
+
};
|
40
|
+
const isPlainObject = (val) => toTypeString(val) === "[object Object]";
|
41
|
+
const isReservedProp = /* @__PURE__ */ makeMap(
|
42
|
+
// the leading comma is intentional so empty string "" is also included
|
43
|
+
",key,ref,ref_for,ref_key,onVnodeBeforeMount,onVnodeMounted,onVnodeBeforeUpdate,onVnodeUpdated,onVnodeBeforeUnmount,onVnodeUnmounted"
|
44
|
+
);
|
45
|
+
const isBuiltInDirective = /* @__PURE__ */ makeMap(
|
46
|
+
"bind,cloak,else-if,else,for,html,if,model,on,once,pre,show,slot,text,memo"
|
47
|
+
);
|
48
|
+
const cacheStringFunction = (fn) => {
|
49
|
+
const cache = /* @__PURE__ */ Object.create(null);
|
50
|
+
return (str) => {
|
51
|
+
const hit = cache[str];
|
52
|
+
return hit || (cache[str] = fn(str));
|
53
|
+
};
|
54
|
+
};
|
55
|
+
const camelizeRE = /-(\w)/g;
|
56
|
+
const camelize = cacheStringFunction((str) => {
|
57
|
+
return str.replace(camelizeRE, (_, c) => c ? c.toUpperCase() : "");
|
58
|
+
});
|
59
|
+
const hyphenateRE = /\B([A-Z])/g;
|
60
|
+
const hyphenate = cacheStringFunction(
|
61
|
+
(str) => str.replace(hyphenateRE, "-$1").toLowerCase()
|
62
|
+
);
|
63
|
+
const capitalize = cacheStringFunction(
|
64
|
+
(str) => str.charAt(0).toUpperCase() + str.slice(1)
|
65
|
+
);
|
66
|
+
const toHandlerKey = cacheStringFunction(
|
67
|
+
(str) => str ? `on${capitalize(str)}` : ``
|
68
|
+
);
|
69
|
+
const hasChanged = (value, oldValue) => !Object.is(value, oldValue);
|
70
|
+
const invokeArrayFns = (fns, arg) => {
|
71
|
+
for (let i = 0; i < fns.length; i++) {
|
72
|
+
fns[i](arg);
|
73
|
+
}
|
74
|
+
};
|
75
|
+
const def = (obj, key, value) => {
|
76
|
+
Object.defineProperty(obj, key, {
|
77
|
+
configurable: true,
|
78
|
+
enumerable: false,
|
79
|
+
value
|
80
|
+
});
|
81
|
+
};
|
82
|
+
const looseToNumber = (val) => {
|
83
|
+
const n = parseFloat(val);
|
84
|
+
return isNaN(n) ? val : n;
|
85
|
+
};
|
86
|
+
let _globalThis;
|
87
|
+
const getGlobalThis = () => {
|
88
|
+
return _globalThis || (_globalThis = typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : {});
|
89
|
+
};
|
90
|
+
function normalizeStyle(value) {
|
91
|
+
if (isArray(value)) {
|
92
|
+
const res = {};
|
93
|
+
for (let i = 0; i < value.length; i++) {
|
94
|
+
const item = value[i];
|
95
|
+
const normalized = isString(item) ? parseStringStyle(item) : normalizeStyle(item);
|
96
|
+
if (normalized) {
|
97
|
+
for (const key in normalized) {
|
98
|
+
res[key] = normalized[key];
|
99
|
+
}
|
374
100
|
}
|
375
|
-
}
|
376
|
-
|
377
|
-
|
378
|
-
|
379
|
-
|
101
|
+
}
|
102
|
+
return res;
|
103
|
+
} else if (isString(value)) {
|
104
|
+
return value;
|
105
|
+
} else if (isObject(value)) {
|
106
|
+
return value;
|
107
|
+
}
|
108
|
+
}
|
109
|
+
const listDelimiterRE = /;(?![^(]*\))/g;
|
110
|
+
const propertyDelimiterRE = /:([^]+)/;
|
111
|
+
const styleCommentRE = /\/\*[^]*?\*\//g;
|
112
|
+
function parseStringStyle(cssText) {
|
113
|
+
const ret = {};
|
114
|
+
cssText.replace(styleCommentRE, "").split(listDelimiterRE).forEach((item) => {
|
115
|
+
if (item) {
|
116
|
+
const tmp = item.split(propertyDelimiterRE);
|
117
|
+
tmp.length > 1 && (ret[tmp[0].trim()] = tmp[1].trim());
|
118
|
+
}
|
119
|
+
});
|
120
|
+
return ret;
|
121
|
+
}
|
122
|
+
function normalizeClass(value) {
|
123
|
+
let res = "";
|
124
|
+
if (isString(value)) {
|
125
|
+
res = value;
|
126
|
+
} else if (isArray(value)) {
|
127
|
+
for (let i = 0; i < value.length; i++) {
|
128
|
+
const normalized = normalizeClass(value[i]);
|
129
|
+
if (normalized) {
|
130
|
+
res += normalized + " ";
|
380
131
|
}
|
381
|
-
}
|
382
|
-
|
383
|
-
|
384
|
-
|
385
|
-
|
386
|
-
hideInfo();
|
387
|
-
}
|
132
|
+
}
|
133
|
+
} else if (isObject(value)) {
|
134
|
+
for (const name in value) {
|
135
|
+
if (value[name]) {
|
136
|
+
res += name + " ";
|
388
137
|
}
|
138
|
+
}
|
139
|
+
}
|
140
|
+
return res.trim();
|
141
|
+
}
|
142
|
+
const toDisplayString = (val) => {
|
143
|
+
return isString(val) ? val : val == null ? "" : isArray(val) || isObject(val) && (val.toString === objectToString || !isFunction(val.toString)) ? JSON.stringify(val, replacer, 2) : String(val);
|
144
|
+
};
|
145
|
+
const replacer = (_key, val) => {
|
146
|
+
if (val && val.__v_isRef) {
|
147
|
+
return replacer(_key, val.value);
|
148
|
+
} else if (isMap(val)) {
|
149
|
+
return {
|
150
|
+
[`Map(${val.size})`]: [...val.entries()].reduce((entries, [key, val2]) => {
|
151
|
+
entries[`${key} =>`] = val2;
|
152
|
+
return entries;
|
153
|
+
}, {})
|
389
154
|
};
|
390
|
-
|
391
|
-
isMobile.value = window.innerWidth <= 768;
|
392
|
-
updatePosition();
|
393
|
-
};
|
394
|
-
onMounted(() => {
|
395
|
-
window.addEventListener("scroll", handleScroll, {
|
396
|
-
passive: true
|
397
|
-
});
|
398
|
-
window.addEventListener("resize", handleResize);
|
399
|
-
document.addEventListener("scroll", handleScroll, {
|
400
|
-
passive: true,
|
401
|
-
capture: true
|
402
|
-
});
|
403
|
-
document.addEventListener("click", handleClickOutside);
|
404
|
-
});
|
405
|
-
onUnmounted(() => {
|
406
|
-
window.removeEventListener("scroll", handleScroll);
|
407
|
-
window.removeEventListener("resize", handleResize);
|
408
|
-
document.removeEventListener("scroll", handleScroll, {
|
409
|
-
capture: true
|
410
|
-
});
|
411
|
-
document.removeEventListener("click", handleClickOutside);
|
412
|
-
});
|
413
|
-
watch(isVisible, (newValue) => {
|
414
|
-
if (newValue) {
|
415
|
-
updatePosition();
|
416
|
-
}
|
417
|
-
});
|
155
|
+
} else if (isSet(val)) {
|
418
156
|
return {
|
419
|
-
|
420
|
-
boxStyle,
|
421
|
-
arrowStyle,
|
422
|
-
showInfo,
|
423
|
-
hideInfo,
|
424
|
-
toggleInfo,
|
425
|
-
container,
|
426
|
-
icon,
|
427
|
-
infoBox,
|
428
|
-
textContent,
|
429
|
-
infoImage,
|
430
|
-
infoBoxWidth,
|
431
|
-
infoBoxHeight,
|
432
|
-
wrapperStyle,
|
433
|
-
textStyle,
|
434
|
-
onImageLoad,
|
435
|
-
isMobile
|
157
|
+
[`Set(${val.size})`]: [...val.values()]
|
436
158
|
};
|
437
|
-
}
|
438
|
-
|
439
|
-
computedIconColor() {
|
440
|
-
return this.buttonType === "error" ? theme.colors.red : theme.colors.mediumGray;
|
441
|
-
}
|
159
|
+
} else if (isObject(val) && !isArray(val) && !isPlainObject(val)) {
|
160
|
+
return String(val);
|
442
161
|
}
|
162
|
+
return val;
|
443
163
|
};
|
444
|
-
const _hoisted_1 = {
|
445
|
-
ref: "icon",
|
446
|
-
"data-test-id": "infoText_trigger"
|
447
|
-
};
|
448
|
-
const _hoisted_2 = ["innerHTML"];
|
449
|
-
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
450
|
-
const _component_LabelWrapper = resolveComponent("LabelWrapper");
|
451
|
-
const _component_Dot = resolveComponent("Dot");
|
452
|
-
const _component_IconComponent = resolveComponent("IconComponent");
|
453
|
-
const _component_IconWrapper = resolveComponent("IconWrapper");
|
454
|
-
const _component_OverlayImage = resolveComponent("OverlayImage");
|
455
|
-
const _component_TextOverlay = resolveComponent("TextOverlay");
|
456
|
-
const _component_TextWrapper = resolveComponent("TextWrapper");
|
457
|
-
const _component_PageContainer = resolveComponent("PageContainer");
|
458
|
-
return openBlock(), createBlock(_component_PageContainer, {
|
459
|
-
ref: "container",
|
460
|
-
"data-test-id": "infoText_container",
|
461
|
-
type: $props.type,
|
462
|
-
onClick: _cache[0] || (_cache[0] = ($event) => {
|
463
|
-
($setup.isMobile || $props.openTrigger === "onClick") && $setup.toggleInfo();
|
464
|
-
}),
|
465
|
-
onMouseenter: _cache[1] || (_cache[1] = ($event) => !$setup.isMobile && $props.openTrigger === "onHover" && $setup.showInfo()),
|
466
|
-
onMouseleave: _cache[2] || (_cache[2] = ($event) => !$setup.isMobile && $props.openTrigger === "onHover" && $setup.hideInfo())
|
467
|
-
}, {
|
468
|
-
default: withCtx(() => [createBaseVNode("div", _hoisted_1, [createVNode(_component_IconWrapper, {
|
469
|
-
"background-color": $props.backgroundColor,
|
470
|
-
"border-radius": $props.borderRadius,
|
471
|
-
"hovered-icon": $props.hoveredIcon,
|
472
|
-
"is-active": $props.isActive,
|
473
|
-
"is-disabled": $props.isDisabled,
|
474
|
-
padding: $props.padding
|
475
|
-
}, {
|
476
|
-
default: withCtx(() => [!_ctx.$slots.trigger ? (openBlock(), createElementBlock(Fragment, {
|
477
|
-
key: 0
|
478
|
-
}, [$props.labelText && $props.labelAlign === "left" ? (openBlock(), createBlock(_component_LabelWrapper, {
|
479
|
-
key: 0,
|
480
|
-
color: $props.iconColor || $options.computedIconColor,
|
481
|
-
size: $props.labelSize
|
482
|
-
}, {
|
483
|
-
default: withCtx(() => [createTextVNode(toDisplayString($props.labelText), 1)]),
|
484
|
-
_: 1
|
485
|
-
}, 8, ["color", "size"])) : createCommentVNode("", true), createTextVNode(), $props.type === "dot" ? (openBlock(), createBlock(_component_Dot, {
|
486
|
-
key: 1,
|
487
|
-
color: $props.dotColor,
|
488
|
-
"data-test-id": "infoText_dot"
|
489
|
-
}, null, 8, ["color"])) : !$props.noIcon ? (openBlock(), createBlock(_component_IconComponent, {
|
490
|
-
key: 2,
|
491
|
-
color: $props.iconColor || $options.computedIconColor,
|
492
|
-
cursor: $props.isDisabled ? "not-allowed" : "pointer",
|
493
|
-
disabled: $props.isDisabled,
|
494
|
-
"hovered-color": $props.iconColor || $options.computedIconColor,
|
495
|
-
name: $props.iconName,
|
496
|
-
size: $props.size
|
497
|
-
}, null, 8, ["color", "cursor", "disabled", "hovered-color", "name", "size"])) : createCommentVNode("", true), createTextVNode(), $props.labelText && $props.labelAlign === "right" ? (openBlock(), createBlock(_component_LabelWrapper, {
|
498
|
-
key: 3,
|
499
|
-
color: $props.iconColor || $options.computedIconColor,
|
500
|
-
size: $props.labelSize
|
501
|
-
}, {
|
502
|
-
default: withCtx(() => [createTextVNode(toDisplayString($props.labelText), 1)]),
|
503
|
-
_: 1
|
504
|
-
}, 8, ["color", "size"])) : createCommentVNode("", true)], 64)) : createCommentVNode("", true), createTextVNode(), renderSlot(_ctx.$slots, "trigger")]),
|
505
|
-
_: 3
|
506
|
-
}, 8, ["background-color", "border-radius", "hovered-icon", "is-active", "is-disabled", "padding"])], 512), createTextVNode(), $setup.isVisible && (!!$props.text || _ctx.$slots.default) ? (openBlock(), createBlock(Teleport, {
|
507
|
-
key: 0,
|
508
|
-
to: "body"
|
509
|
-
}, [createVNode(_component_TextWrapper, {
|
510
|
-
"data-test-id": "info_text_wrapper",
|
511
|
-
style: normalizeStyle($setup.wrapperStyle)
|
512
|
-
}, {
|
513
|
-
default: withCtx(() => [createVNode(_component_TextOverlay, {
|
514
|
-
ref: "infoBox",
|
515
|
-
"app-theme": $props.appTheme,
|
516
|
-
image: $props.image,
|
517
|
-
style: normalizeStyle($setup.boxStyle),
|
518
|
-
width: $setup.infoBoxWidth
|
519
|
-
}, {
|
520
|
-
default: withCtx(() => [$props.image ? (openBlock(), createBlock(_component_OverlayImage, {
|
521
|
-
key: 0,
|
522
|
-
ref: "infoImage",
|
523
|
-
alt: "Info Image",
|
524
|
-
src: $props.image,
|
525
|
-
onLoad: $setup.onImageLoad
|
526
|
-
}, null, 8, ["src", "onLoad"])) : createCommentVNode("", true), createTextVNode(), !$props.hideInfoText ? (openBlock(), createElementBlock("span", {
|
527
|
-
key: 1,
|
528
|
-
ref: "textContent",
|
529
|
-
style: normalizeStyle($setup.textStyle)
|
530
|
-
}, [renderSlot(_ctx.$slots, "default", {}, () => [createBaseVNode("span", {
|
531
|
-
innerHTML: $props.text
|
532
|
-
}, null, 8, _hoisted_2)])], 4)) : createCommentVNode("", true)]),
|
533
|
-
_: 3
|
534
|
-
}, 8, ["app-theme", "image", "style", "width"]), createTextVNode()]),
|
535
|
-
_: 3
|
536
|
-
}, 8, ["style"])])) : createCommentVNode("", true)]),
|
537
|
-
_: 3
|
538
|
-
}, 8, ["type"]);
|
539
|
-
}
|
540
|
-
const InfoText = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
|
541
164
|
export {
|
542
|
-
|
165
|
+
EMPTY_ARR,
|
166
|
+
EMPTY_OBJ,
|
167
|
+
NO,
|
168
|
+
NOOP,
|
169
|
+
camelize,
|
170
|
+
capitalize,
|
171
|
+
def,
|
172
|
+
extend,
|
173
|
+
getGlobalThis,
|
174
|
+
hasChanged,
|
175
|
+
hasOwn,
|
176
|
+
hyphenate,
|
177
|
+
invokeArrayFns,
|
178
|
+
isArray,
|
179
|
+
isBuiltInDirective,
|
180
|
+
isFunction,
|
181
|
+
isMap,
|
182
|
+
isModelListener,
|
183
|
+
isObject,
|
184
|
+
isOn,
|
185
|
+
isPlainObject,
|
186
|
+
isPromise,
|
187
|
+
isReservedProp,
|
188
|
+
isSet,
|
189
|
+
isString,
|
190
|
+
looseToNumber,
|
191
|
+
makeMap,
|
192
|
+
normalizeClass,
|
193
|
+
normalizeStyle,
|
194
|
+
objectToString,
|
195
|
+
parseStringStyle,
|
196
|
+
remove,
|
197
|
+
toDisplayString,
|
198
|
+
toHandlerKey,
|
199
|
+
toRawType,
|
200
|
+
toTypeString
|
543
201
|
};
|