@fiscozen/composables 1.0.1 → 1.0.3
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/CHANGELOG.md +14 -0
- package/dist/composables.js +113 -106
- package/dist/composables.umd.cjs +1 -1
- package/package.json +4 -4
- package/src/__tests__/number.spec.ts +137 -0
- package/src/utils/number/index.ts +26 -2
package/CHANGELOG.md
ADDED
package/dist/composables.js
CHANGED
|
@@ -1,16 +1,23 @@
|
|
|
1
|
-
import { ref as g, reactive as Y, onUnmounted as Q, nextTick as J, onMounted as
|
|
1
|
+
import { ref as g, reactive as Y, onUnmounted as Q, nextTick as J, onMounted as E, computed as W, watch as B, onBeforeUnmount as $, defineComponent as Z, useSlots as _, toRef as j, toRefs as ee, createElementBlock as V, openBlock as M, renderSlot as C, createElementVNode as D, withDirectives as T, createCommentVNode as U, createBlock as te, unref as P, normalizeClass as q, vShow as G, Teleport as oe } from "vue";
|
|
2
2
|
const le = (e, t) => {
|
|
3
|
-
|
|
4
|
-
return Math.trunc(e
|
|
3
|
+
if (!isFinite(e) || t < 0) return e;
|
|
4
|
+
if (t === 0) return Math.trunc(e);
|
|
5
|
+
const o = String(e);
|
|
6
|
+
if (o.includes("e") || o.includes("E")) {
|
|
7
|
+
const n = Math.pow(10, t);
|
|
8
|
+
return Math.trunc(e * n) / n;
|
|
9
|
+
}
|
|
10
|
+
const l = o.indexOf(".");
|
|
11
|
+
return l === -1 || o.length - l - 1 <= t ? e : Number(o.slice(0, l + t + 1));
|
|
5
12
|
}, ne = (e, {
|
|
6
13
|
minimumFractionDigits: t = 0,
|
|
7
14
|
maximumFractionDigits: o = 2,
|
|
8
15
|
roundDecimals: l = !0,
|
|
9
|
-
useGrouping:
|
|
16
|
+
useGrouping: n = !0
|
|
10
17
|
} = {}) => e == null || isNaN(e) || !isFinite(e) ? "" : (l ? e : le(e, o)).toLocaleString("it-IT", {
|
|
11
18
|
minimumFractionDigits: t,
|
|
12
19
|
maximumFractionDigits: o,
|
|
13
|
-
useGrouping:
|
|
20
|
+
useGrouping: n
|
|
14
21
|
}), re = (e) => {
|
|
15
22
|
if (!e || typeof e != "string")
|
|
16
23
|
return NaN;
|
|
@@ -18,12 +25,12 @@ const le = (e, t) => {
|
|
|
18
25
|
return t.includes(",") && (t = t.replace(/\./g, ""), t = t.replace(",", ".")), parseFloat(t);
|
|
19
26
|
}, ze = (e, t) => {
|
|
20
27
|
let o = t;
|
|
21
|
-
const l = t % e,
|
|
22
|
-
return l !== 0 && (o = Math.abs(l) >= e / 2 ? t +
|
|
23
|
-
},
|
|
24
|
-
let
|
|
28
|
+
const l = t % e, n = t >= 0 ? e : -e;
|
|
29
|
+
return l !== 0 && (o = Math.abs(l) >= e / 2 ? t + n - l : t - l), o;
|
|
30
|
+
}, Ee = (e, t, o) => Math.max(e, Math.min(t, o)), z = new DOMRect(0, 0, window.innerWidth, window.innerHeight), b = (e, t, o, l, n) => {
|
|
31
|
+
let r = n ? "bottom" : "right", p = n ? "bottom-start" : "right-start";
|
|
25
32
|
z.width = window.innerWidth, z.height = window.innerHeight, z.x = 0, z.y = 0;
|
|
26
|
-
const y = e ? e.getBoundingClientRect() : z,
|
|
33
|
+
const y = e ? e.getBoundingClientRect() : z, v = t.getBoundingClientRect(), d = o.getBoundingClientRect(), h = (d.left - y.left - v.width) / y.width, x = (y.right - d.right - v.width) / y.width, c = (d.top - y.top - v.height) / y.height, i = (y.bottom - d.bottom - v.height) / y.height;
|
|
27
34
|
let s = [
|
|
28
35
|
{
|
|
29
36
|
key: "right",
|
|
@@ -42,20 +49,20 @@ const le = (e, t) => {
|
|
|
42
49
|
space: h
|
|
43
50
|
}
|
|
44
51
|
].sort((u, f) => f.space - u.space);
|
|
45
|
-
if (
|
|
46
|
-
const u = (
|
|
47
|
-
switch (
|
|
52
|
+
if (n && (s = s.filter((u) => u.key === "top" || u.key === "bottom")), r = s[0].key, !l) {
|
|
53
|
+
const u = (v.height - d.height) / 2;
|
|
54
|
+
switch (r) {
|
|
48
55
|
case "right":
|
|
49
56
|
case "left":
|
|
50
|
-
y.top >
|
|
57
|
+
y.top > d.top - u && (l = "end"), y.bottom < d.top - u && (l = "start");
|
|
51
58
|
break;
|
|
52
59
|
}
|
|
53
60
|
}
|
|
54
|
-
return p = l ? `${
|
|
61
|
+
return p = l ? `${r}-${l}` : r, p;
|
|
55
62
|
}, ae = (e, t, o, l) => ({
|
|
56
63
|
x: t.x + e.width * o / 100,
|
|
57
64
|
y: t.y + e.height * l / 100
|
|
58
|
-
}),
|
|
65
|
+
}), F = (e) => typeof e == "string" ? document.querySelector(e) : e, ie = (e) => ({
|
|
59
66
|
left: parseFloat(e.marginLeft),
|
|
60
67
|
right: parseFloat(e.marginRight),
|
|
61
68
|
top: parseFloat(e.marginTop),
|
|
@@ -241,47 +248,47 @@ const le = (e, t) => {
|
|
|
241
248
|
const l = ue[e];
|
|
242
249
|
return l ? l(t, o) : { position: { x: 0, y: 0 }, transform: { x: 0, y: 0 } };
|
|
243
250
|
}, fe = (e, t, o, l) => {
|
|
244
|
-
const
|
|
245
|
-
if (e.x < o.left && (
|
|
251
|
+
const n = { ...e }, r = { ...l };
|
|
252
|
+
if (e.x < o.left && (n.x = o.left, r.x = 0), e.x + t.width > o.right) {
|
|
246
253
|
const p = o.right - t.width;
|
|
247
|
-
p > 0 && (
|
|
254
|
+
p > 0 && (n.x = p), r.x = 0;
|
|
248
255
|
}
|
|
249
|
-
if (e.y < o.top && (
|
|
256
|
+
if (e.y < o.top && (n.y = o.top, r.y = 0), e.y + t.height > o.bottom) {
|
|
250
257
|
const p = o.bottom - t.height;
|
|
251
|
-
p > 0 && (
|
|
258
|
+
p > 0 && (n.y = p), r.y = 0;
|
|
252
259
|
}
|
|
253
|
-
return { position:
|
|
254
|
-
}, ye = (e, t, o, l,
|
|
255
|
-
const
|
|
260
|
+
return { position: n, transform: r };
|
|
261
|
+
}, ye = (e, t, o, l, n) => {
|
|
262
|
+
const r = n ? null : t;
|
|
256
263
|
switch (e) {
|
|
257
264
|
case "auto":
|
|
258
|
-
return b(
|
|
265
|
+
return b(r, o, l);
|
|
259
266
|
case "auto-vertical":
|
|
260
|
-
return b(
|
|
267
|
+
return b(r, o, l, void 0, !0);
|
|
261
268
|
case "auto-start":
|
|
262
|
-
return b(
|
|
269
|
+
return b(r, o, l, "start");
|
|
263
270
|
case "auto-vertical-start":
|
|
264
|
-
return b(
|
|
271
|
+
return b(r, o, l, "start", !0);
|
|
265
272
|
case "auto-end":
|
|
266
|
-
return b(
|
|
273
|
+
return b(r, o, l, "end");
|
|
267
274
|
case "auto-vertical-end":
|
|
268
|
-
return b(
|
|
275
|
+
return b(r, o, l, "end", !0);
|
|
269
276
|
default:
|
|
270
277
|
return "bottom-start";
|
|
271
278
|
}
|
|
272
|
-
},
|
|
273
|
-
const t = g("auto"), o = g(), l = g(),
|
|
279
|
+
}, de = (e) => e.startsWith("auto"), ve = (e) => {
|
|
280
|
+
const t = g("auto"), o = g(), l = g(), n = g(), r = g(), p = Y({ position: { x: 0, y: 0 } }), y = {
|
|
274
281
|
root: null,
|
|
275
282
|
rootMargin: "0px",
|
|
276
283
|
threshold: 1,
|
|
277
284
|
...e.element.value.intersectionOptions
|
|
278
|
-
},
|
|
279
|
-
}, y)),
|
|
285
|
+
}, v = g(new IntersectionObserver(() => {
|
|
286
|
+
}, y)), d = () => {
|
|
280
287
|
var u, f;
|
|
281
|
-
const c =
|
|
288
|
+
const c = F(e.element.value.domRef.value);
|
|
282
289
|
if (!c)
|
|
283
290
|
return null;
|
|
284
|
-
const i = (u = e.container) != null && u.value ?
|
|
291
|
+
const i = (u = e.container) != null && u.value ? F(e.container.value.domRef.value) ?? document.body : document.body, s = (f = e.opener) != null && f.value ? F(e.opener.value.domRef.value) : null;
|
|
285
292
|
return { element: c, container: i, opener: s };
|
|
286
293
|
}, h = (c) => {
|
|
287
294
|
var i;
|
|
@@ -293,7 +300,7 @@ const le = (e, t) => {
|
|
|
293
300
|
}, x = (c = !1) => J(() => {
|
|
294
301
|
var O, R, L;
|
|
295
302
|
o.value = ((O = e.position) == null ? void 0 : O.value) ?? "auto";
|
|
296
|
-
const i =
|
|
303
|
+
const i = d();
|
|
297
304
|
if (!i) return;
|
|
298
305
|
Object.assign(i.element.style, {
|
|
299
306
|
position: "fixed",
|
|
@@ -301,20 +308,20 @@ const le = (e, t) => {
|
|
|
301
308
|
left: "0px"
|
|
302
309
|
});
|
|
303
310
|
const s = h(i);
|
|
304
|
-
l.value = s.element,
|
|
311
|
+
l.value = s.element, n.value = s.opener ?? void 0, r.value = s.container, v.value.observe(i.element), v.value.observe(i.container), de(o.value) && i.opener && (o.value = ye(
|
|
305
312
|
o.value,
|
|
306
313
|
i.container,
|
|
307
314
|
i.element,
|
|
308
315
|
i.opener,
|
|
309
316
|
((R = e.useViewport) == null ? void 0 : R.value) ?? !1
|
|
310
317
|
));
|
|
311
|
-
const u = ie(window.getComputedStyle(i.element)), f = i.opener && s.opener ? pe(o.value, s.opener, u) : ce(o.value, s.container, s.element),
|
|
318
|
+
const u = ie(window.getComputedStyle(i.element)), f = i.opener && s.opener ? pe(o.value, s.opener, u) : ce(o.value, s.container, s.element), k = ae(
|
|
312
319
|
s.element,
|
|
313
320
|
f.position,
|
|
314
321
|
f.transform.x,
|
|
315
322
|
f.transform.y
|
|
316
323
|
), S = fe(
|
|
317
|
-
|
|
324
|
+
k,
|
|
318
325
|
s.element,
|
|
319
326
|
s.container,
|
|
320
327
|
f.transform
|
|
@@ -324,41 +331,41 @@ const le = (e, t) => {
|
|
|
324
331
|
left: `${p.position.x}px`,
|
|
325
332
|
position: "fixed",
|
|
326
333
|
display: "flex"
|
|
327
|
-
}), l.value = i.element.getBoundingClientRect(), (L = e.callback) != null && L.value && !c && e.callback.value(l,
|
|
334
|
+
}), l.value = i.element.getBoundingClientRect(), (L = e.callback) != null && L.value && !c && e.callback.value(l, n, r, t, o);
|
|
328
335
|
});
|
|
329
336
|
return Q(() => {
|
|
330
|
-
|
|
337
|
+
v.value.disconnect();
|
|
331
338
|
}), {
|
|
332
339
|
float: p,
|
|
333
340
|
rect: l,
|
|
334
341
|
setPosition: x,
|
|
335
342
|
position: t,
|
|
336
343
|
actualPosition: o,
|
|
337
|
-
openerRect:
|
|
338
|
-
containerRect:
|
|
344
|
+
openerRect: n,
|
|
345
|
+
containerRect: r
|
|
339
346
|
};
|
|
340
347
|
};
|
|
341
|
-
function
|
|
348
|
+
function N(e) {
|
|
342
349
|
const t = window.matchMedia(e), o = g(t.matches);
|
|
343
|
-
function l(
|
|
344
|
-
o.value =
|
|
350
|
+
function l(n) {
|
|
351
|
+
o.value = n.matches;
|
|
345
352
|
}
|
|
346
|
-
return
|
|
353
|
+
return E(() => {
|
|
347
354
|
t.addEventListener("change", l);
|
|
348
355
|
}), Q(() => {
|
|
349
356
|
t.removeEventListener("change", l);
|
|
350
|
-
}),
|
|
357
|
+
}), W(() => o.value);
|
|
351
358
|
}
|
|
352
|
-
function
|
|
359
|
+
function ke(e) {
|
|
353
360
|
return {
|
|
354
361
|
isGreater(t) {
|
|
355
|
-
return
|
|
362
|
+
return N(`(min-width: ${e[t]})`);
|
|
356
363
|
},
|
|
357
364
|
isSmaller(t) {
|
|
358
|
-
return
|
|
365
|
+
return N(`(max-width: ${e[t]})`);
|
|
359
366
|
},
|
|
360
367
|
isInBetween(t, o) {
|
|
361
|
-
return
|
|
368
|
+
return N(`(min-width: ${e[t]}) and (max-width: ${e[o]})`);
|
|
362
369
|
}
|
|
363
370
|
};
|
|
364
371
|
}
|
|
@@ -367,17 +374,17 @@ function Oe(e, t, o) {
|
|
|
367
374
|
throw new Error("A target component has to be provided.");
|
|
368
375
|
if (!t)
|
|
369
376
|
throw new Error("A callback has to be provided.");
|
|
370
|
-
const l = (
|
|
371
|
-
!e.value ||
|
|
377
|
+
const l = (n) => {
|
|
378
|
+
!e.value || n.target === e.value || n.composedPath().includes(e.value) || typeof t == "function" && t();
|
|
372
379
|
};
|
|
373
|
-
o && B(o, (
|
|
374
|
-
|
|
375
|
-
}),
|
|
380
|
+
o && B(o, (n, r) => {
|
|
381
|
+
r && r.removeEventListener("click", l), n == null || n.addEventListener("click", l);
|
|
382
|
+
}), E(() => {
|
|
376
383
|
o || document.addEventListener("click", l);
|
|
377
|
-
}),
|
|
378
|
-
var
|
|
384
|
+
}), $(() => {
|
|
385
|
+
var n;
|
|
379
386
|
if (o) {
|
|
380
|
-
(
|
|
387
|
+
(n = o.value) == null || n.removeEventListener("click", l);
|
|
381
388
|
return;
|
|
382
389
|
}
|
|
383
390
|
document.removeEventListener("click", l);
|
|
@@ -391,9 +398,9 @@ function Le(e, t) {
|
|
|
391
398
|
const o = (l) => {
|
|
392
399
|
t(l);
|
|
393
400
|
};
|
|
394
|
-
|
|
401
|
+
E(() => {
|
|
395
402
|
e.value.addEventListener("keydown", o);
|
|
396
|
-
}),
|
|
403
|
+
}), $(() => {
|
|
397
404
|
e.value.removeEventListener("keydown", o);
|
|
398
405
|
});
|
|
399
406
|
}
|
|
@@ -403,13 +410,13 @@ function Be(e, t) {
|
|
|
403
410
|
const o = (l) => {
|
|
404
411
|
e(l);
|
|
405
412
|
};
|
|
406
|
-
|
|
413
|
+
E(() => {
|
|
407
414
|
if (!t) {
|
|
408
415
|
document.addEventListener("keyup", o);
|
|
409
416
|
return;
|
|
410
417
|
}
|
|
411
418
|
t.value.addEventListener("keyup", o);
|
|
412
|
-
}),
|
|
419
|
+
}), $(() => {
|
|
413
420
|
if (!t) {
|
|
414
421
|
document.removeEventListener("keyup", o);
|
|
415
422
|
return;
|
|
@@ -417,7 +424,7 @@ function Be(e, t) {
|
|
|
417
424
|
t.value.removeEventListener("keyup", o);
|
|
418
425
|
});
|
|
419
426
|
}
|
|
420
|
-
const
|
|
427
|
+
const Ne = (e) => ({
|
|
421
428
|
format: ne,
|
|
422
429
|
parse: re
|
|
423
430
|
}), xe = {
|
|
@@ -1276,8 +1283,8 @@ const $e = (e) => ({
|
|
|
1276
1283
|
we.forEach((e) => {
|
|
1277
1284
|
const t = H.global[e];
|
|
1278
1285
|
t && Object.keys(t).forEach((o) => {
|
|
1279
|
-
var
|
|
1280
|
-
const l = (
|
|
1286
|
+
var n;
|
|
1287
|
+
const l = (n = t[o]) == null ? void 0 : n.value;
|
|
1281
1288
|
l && (w[e] || (w[e] = {}), w[e][o] = l);
|
|
1282
1289
|
});
|
|
1283
1290
|
});
|
|
@@ -1285,18 +1292,18 @@ const K = H.global.semantic;
|
|
|
1285
1292
|
K && Se.forEach((e) => {
|
|
1286
1293
|
const t = K[e];
|
|
1287
1294
|
t && typeof t == "object" && Object.keys(t).forEach((o) => {
|
|
1288
|
-
var
|
|
1289
|
-
const l = (
|
|
1295
|
+
var n;
|
|
1296
|
+
const l = (n = t[o]) == null ? void 0 : n.value;
|
|
1290
1297
|
if (l) {
|
|
1291
|
-
const
|
|
1292
|
-
w[
|
|
1298
|
+
const r = `semantic-${e}`;
|
|
1299
|
+
w[r] || (w[r] = {}), w[r][o] = l;
|
|
1293
1300
|
}
|
|
1294
1301
|
});
|
|
1295
1302
|
});
|
|
1296
1303
|
const Re = Object.entries(H.global.breakpoint).reduce(
|
|
1297
1304
|
(e, [t, o]) => (e[t] = o.value, e),
|
|
1298
1305
|
{}
|
|
1299
|
-
),
|
|
1306
|
+
), $e = /* @__PURE__ */ Z({
|
|
1300
1307
|
__name: "FzFloating",
|
|
1301
1308
|
props: {
|
|
1302
1309
|
isOpen: { type: Boolean, default: !1 },
|
|
@@ -1311,50 +1318,50 @@ const Re = Object.entries(H.global.breakpoint).reduce(
|
|
|
1311
1318
|
},
|
|
1312
1319
|
emits: ["fzfloating:setPosition"],
|
|
1313
1320
|
setup(e, { expose: t, emit: o }) {
|
|
1314
|
-
const l = e,
|
|
1315
|
-
let
|
|
1321
|
+
const l = e, n = o, r = g(null), p = g(null), y = _(), v = N(`(max-width: ${Re.xs})`);
|
|
1322
|
+
let d = !1, h = !1, x = null, c = null;
|
|
1316
1323
|
const i = {
|
|
1317
1324
|
position: l.position,
|
|
1318
1325
|
element: {
|
|
1319
1326
|
// @ts-ignore
|
|
1320
|
-
domRef:
|
|
1327
|
+
domRef: r
|
|
1321
1328
|
},
|
|
1322
1329
|
container: {
|
|
1323
1330
|
// @ts-ignore
|
|
1324
|
-
domRef:
|
|
1331
|
+
domRef: j(l.container || document.body)
|
|
1325
1332
|
},
|
|
1326
1333
|
opener: {
|
|
1327
|
-
domRef:
|
|
1334
|
+
domRef: j(null)
|
|
1328
1335
|
},
|
|
1329
1336
|
useViewport: l.useViewport,
|
|
1330
1337
|
callback(...a) {
|
|
1331
|
-
|
|
1338
|
+
n("fzfloating:setPosition", ...a);
|
|
1332
1339
|
}
|
|
1333
1340
|
}, s = ee(i);
|
|
1334
1341
|
y.opener && (i.opener = {
|
|
1335
1342
|
// @ts-ignore
|
|
1336
1343
|
domRef: p
|
|
1337
1344
|
});
|
|
1338
|
-
const u =
|
|
1339
|
-
|
|
1340
|
-
h && l.isOpen && u.setPosition(),
|
|
1345
|
+
const u = ve(s), f = () => {
|
|
1346
|
+
d || !h || (d = !0, requestAnimationFrame(() => {
|
|
1347
|
+
h && l.isOpen && u.setPosition(), d = !1;
|
|
1341
1348
|
}));
|
|
1342
1349
|
};
|
|
1343
|
-
|
|
1350
|
+
E(() => {
|
|
1344
1351
|
h = !0;
|
|
1345
1352
|
});
|
|
1346
|
-
const
|
|
1353
|
+
const k = () => {
|
|
1347
1354
|
f();
|
|
1348
1355
|
}, S = () => {
|
|
1349
1356
|
f();
|
|
1350
1357
|
}, O = () => {
|
|
1351
|
-
window.addEventListener("scroll",
|
|
1358
|
+
window.addEventListener("scroll", k, !0), window.addEventListener("resize", S), r.value && !x && (x = new ResizeObserver(() => {
|
|
1352
1359
|
f();
|
|
1353
|
-
}), x.observe(
|
|
1360
|
+
}), x.observe(r.value)), p.value && !c && (c = new ResizeObserver(() => {
|
|
1354
1361
|
f();
|
|
1355
1362
|
}), c.observe(p.value));
|
|
1356
1363
|
}, R = () => {
|
|
1357
|
-
window.removeEventListener("scroll",
|
|
1364
|
+
window.removeEventListener("scroll", k, !0), window.removeEventListener("resize", S), x && (x.disconnect(), x = null), c && (c.disconnect(), c = null);
|
|
1358
1365
|
};
|
|
1359
1366
|
B(
|
|
1360
1367
|
() => l.position,
|
|
@@ -1362,14 +1369,14 @@ const Re = Object.entries(H.global.breakpoint).reduce(
|
|
|
1362
1369
|
), B(
|
|
1363
1370
|
() => l.isOpen,
|
|
1364
1371
|
(a) => {
|
|
1365
|
-
var
|
|
1366
|
-
if (!a || !
|
|
1372
|
+
var I;
|
|
1373
|
+
if (!a || !r.value || !h) {
|
|
1367
1374
|
R();
|
|
1368
1375
|
return;
|
|
1369
1376
|
}
|
|
1370
1377
|
O();
|
|
1371
|
-
const m = (
|
|
1372
|
-
|
|
1378
|
+
const m = (I = p.value) == null ? void 0 : I.getBoundingClientRect();
|
|
1379
|
+
r.value.style.position = "fixed", r.value.style.top = "0px", r.value.style.left = "0px", r.value.style.transform = "none", r.value.style.width = v.value ? (m == null ? void 0 : m.width) + "px" : "auto", u.setPosition();
|
|
1373
1380
|
}
|
|
1374
1381
|
), B(
|
|
1375
1382
|
() => l.overrideOpener,
|
|
@@ -1378,19 +1385,19 @@ const Re = Object.entries(H.global.breakpoint).reduce(
|
|
|
1378
1385
|
domRef: a
|
|
1379
1386
|
});
|
|
1380
1387
|
}
|
|
1381
|
-
),
|
|
1388
|
+
), $(() => {
|
|
1382
1389
|
h = !1, R();
|
|
1383
1390
|
});
|
|
1384
|
-
const L = (a) => a.startsWith("bottom") ? "mt-4" : a.startsWith("top") ? "mb-4" : a.startsWith("left") ? "mr-4" : a.startsWith("right") ? "ml-4" : "mt-4", X =
|
|
1391
|
+
const L = (a) => a.startsWith("bottom") ? "mt-4" : a.startsWith("top") ? "mb-4" : a.startsWith("left") ? "mr-4" : a.startsWith("right") ? "ml-4" : "mt-4", X = W(() => {
|
|
1385
1392
|
var m;
|
|
1386
1393
|
const a = ((m = u.actualPosition) == null ? void 0 : m.value) ?? l.position;
|
|
1387
1394
|
return L(a);
|
|
1388
|
-
}), A =
|
|
1395
|
+
}), A = W(() => l.overrideContentClass ? l.contentClass : ["bg-core-white fixed", X.value, l.contentClass]);
|
|
1389
1396
|
return t({
|
|
1390
1397
|
setPosition: u.setPosition
|
|
1391
|
-
}), (a, m) => (M(),
|
|
1398
|
+
}), (a, m) => (M(), V("div", null, [
|
|
1392
1399
|
C(a.$slots, "opener-start"),
|
|
1393
|
-
|
|
1400
|
+
D("div", {
|
|
1394
1401
|
ref_key: "opener",
|
|
1395
1402
|
ref: p,
|
|
1396
1403
|
class: "inline-flex w-full sm:w-auto"
|
|
@@ -1401,10 +1408,10 @@ const Re = Object.entries(H.global.breakpoint).reduce(
|
|
|
1401
1408
|
})
|
|
1402
1409
|
], 512),
|
|
1403
1410
|
C(a.$slots, "opener-end"),
|
|
1404
|
-
e.teleport ? U("", !0) : T((M(),
|
|
1411
|
+
e.teleport ? U("", !0) : T((M(), V("div", {
|
|
1405
1412
|
key: 0,
|
|
1406
1413
|
ref_key: "content",
|
|
1407
|
-
ref:
|
|
1414
|
+
ref: r,
|
|
1408
1415
|
class: q(["fz__floating__content w-full sm:w-auto", A.value])
|
|
1409
1416
|
}, [
|
|
1410
1417
|
C(a.$slots, "default", {
|
|
@@ -1418,9 +1425,9 @@ const Re = Object.entries(H.global.breakpoint).reduce(
|
|
|
1418
1425
|
key: 1,
|
|
1419
1426
|
to: "body"
|
|
1420
1427
|
}, [
|
|
1421
|
-
T(
|
|
1428
|
+
T(D("div", {
|
|
1422
1429
|
ref_key: "content",
|
|
1423
|
-
ref:
|
|
1430
|
+
ref: r,
|
|
1424
1431
|
class: q(["fz__floating__content", A.value])
|
|
1425
1432
|
}, [
|
|
1426
1433
|
C(a.$slots, "default", {
|
|
@@ -1435,19 +1442,19 @@ const Re = Object.entries(H.global.breakpoint).reduce(
|
|
|
1435
1442
|
}
|
|
1436
1443
|
});
|
|
1437
1444
|
export {
|
|
1438
|
-
|
|
1445
|
+
$e as FzFloating,
|
|
1439
1446
|
ae as calcRealPos,
|
|
1440
|
-
|
|
1447
|
+
Ee as clamp,
|
|
1441
1448
|
ne as format,
|
|
1442
1449
|
b as getHighestAvailableSpacePos,
|
|
1443
1450
|
re as parse,
|
|
1444
1451
|
ze as roundTo,
|
|
1445
1452
|
le as truncateDecimals,
|
|
1446
|
-
|
|
1453
|
+
ke as useBreakpoints,
|
|
1447
1454
|
Oe as useClickOutside,
|
|
1448
|
-
|
|
1449
|
-
|
|
1455
|
+
Ne as useCurrency,
|
|
1456
|
+
ve as useFloating,
|
|
1450
1457
|
Le as useKeyDown,
|
|
1451
1458
|
Be as useKeyUp,
|
|
1452
|
-
|
|
1459
|
+
N as useMediaQuery
|
|
1453
1460
|
};
|
package/dist/composables.umd.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(p,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(p=typeof globalThis<"u"?globalThis:p||self,n(p.FzComposables={},p.Vue))})(this,function(p,n){"use strict";const L=(e,t)=>{const o=Math.pow(10,t);return Math.trunc(e*o)/o},P=(e,{minimumFractionDigits:t=0,maximumFractionDigits:o=2,roundDecimals:l=!0,useGrouping:a=!0}={})=>e==null||isNaN(e)||!isFinite(e)?"":(l?e:L(e,o)).toLocaleString("it-IT",{minimumFractionDigits:t,maximumFractionDigits:o,useGrouping:a}),$=e=>{if(!e||typeof e!="string")return NaN;let t=e.trim();return t.includes(",")&&(t=t.replace(/\./g,""),t=t.replace(",",".")),parseFloat(t)},U=(e,t)=>{let o=t;const l=t%e,a=t>=0?e:-e;return l!==0&&(o=Math.abs(l)>=e/2?t+a-l:t-l),o},T=(e,t,o)=>Math.max(e,Math.min(t,o)),C=new DOMRect(0,0,window.innerWidth,window.innerHeight),b=(e,t,o,l,a)=>{let r=a?"bottom":"right",u=a?"bottom-start":"right-start";C.width=window.innerWidth,C.height=window.innerHeight,C.x=0,C.y=0;const v=e?e.getBoundingClientRect():C,x=t.getBoundingClientRect(),h=o.getBoundingClientRect(),g=(h.left-v.left-x.width)/v.width,m=(v.right-h.right-x.width)/v.width,y=(h.top-v.top-x.height)/v.height,s=(v.bottom-h.bottom-x.height)/v.height;let c=[{key:"right",space:m},{key:"top",space:y},{key:"bottom",space:s},{key:"left",space:g}].sort((f,d)=>d.space-f.space);if(a&&(c=c.filter(f=>f.key==="top"||f.key==="bottom")),r=c[0].key,!l){const f=(x.height-h.height)/2;switch(r){case"right":case"left":v.top>h.top-f&&(l="end"),v.bottom<h.top-f&&(l="start");break}}return u=l?`${r}-${l}`:r,u},F=(e,t,o,l)=>({x:t.x+e.width*o/100,y:t.y+e.height*l/100}),M=e=>typeof e=="string"?document.querySelector(e):e,V=e=>({left:parseFloat(e.marginLeft),right:parseFloat(e.marginRight),top:parseFloat(e.marginTop),bottom:parseFloat(e.marginBottom)}),j={bottom:(e,t)=>({position:{x:e.left-t.left+e.width/2,y:e.bottom},transform:{x:-50,y:0}}),"bottom-start":(e,t)=>({position:{x:e.left-t.left,y:e.bottom},transform:{x:0,y:0}}),"bottom-end":(e,t)=>({position:{x:e.right+t.right,y:e.bottom},transform:{x:-100,y:0}}),top:(e,t)=>({position:{x:e.left-t.left+e.width/2,y:e.top-t.bottom},transform:{x:-50,y:-100}}),"top-start":(e,t)=>({position:{x:e.left-t.left,y:e.top-t.bottom},transform:{x:0,y:-100}}),"top-end":(e,t)=>({position:{x:e.right+t.right,y:e.top-t.bottom},transform:{x:-100,y:-100}}),left:(e,t)=>({position:{x:e.left-t.right,y:e.top-t.top+e.height/2},transform:{x:-100,y:-50}}),"left-start":(e,t)=>({position:{x:e.left-t.right,y:e.top-t.top},transform:{x:-100,y:0}}),"left-end":(e,t)=>({position:{x:e.left-t.right,y:e.bottom+t.bottom},transform:{x:-100,y:-100}}),right:(e,t)=>({position:{x:e.right+t.left,y:e.top-t.top+e.height/2},transform:{x:0,y:-50}}),"right-start":(e,t)=>({position:{x:e.right+t.left,y:e.top-t.top},transform:{x:0,y:0}}),"right-end":(e,t)=>({position:{x:e.right+t.left,y:e.bottom+t.bottom},transform:{x:0,y:-100}})},I=(e,t,o)=>{const l=j[e];return l?l(t,o):{position:{x:0,y:0},transform:{x:0,y:0}}},K={bottom:(e,t)=>({position:{x:e.left+e.width/2,y:e.bottom-t.height},transform:{x:-50,y:0}}),"bottom-start":(e,t)=>({position:{x:e.left,y:e.bottom-t.height},transform:{x:0,y:0}}),"bottom-end":(e,t)=>({position:{x:e.right-t.width,y:e.bottom-t.height},transform:{x:0,y:0}}),top:e=>({position:{x:e.left+e.width/2,y:e.top},transform:{x:-50,y:0}}),"top-start":e=>({position:{x:e.left,y:e.top},transform:{x:0,y:0}}),"top-end":(e,t)=>({position:{x:e.right-t.width,y:e.top},transform:{x:0,y:0}}),left:(e,t)=>({position:{x:e.left,y:e.top+(e.height-t.height)/2},transform:{x:0,y:0}}),"left-start":e=>({position:{x:e.left,y:e.top},transform:{x:0,y:0}}),"left-end":(e,t)=>({position:{x:e.left,y:e.bottom-t.height},transform:{x:0,y:0}}),right:(e,t)=>({position:{x:e.right-t.width,y:e.top+(e.height-t.height)/2},transform:{x:0,y:0}}),"right-start":(e,t)=>({position:{x:e.right-t.width,y:e.top},transform:{x:0,y:0}}),"right-end":(e,t)=>({position:{x:e.right-t.width,y:e.bottom-t.height},transform:{x:0,y:0}})},q=(e,t,o)=>{const l=K[e];return l?l(t,o):{position:{x:0,y:0},transform:{x:0,y:0}}},Q=(e,t,o,l)=>{const a={...e},r={...l};if(e.x<o.left&&(a.x=o.left,r.x=0),e.x+t.width>o.right){const u=o.right-t.width;u>0&&(a.x=u),r.x=0}if(e.y<o.top&&(a.y=o.top,r.y=0),e.y+t.height>o.bottom){const u=o.bottom-t.height;u>0&&(a.y=u),r.y=0}return{position:a,transform:r}},G=(e,t,o,l,a)=>{const r=a?null:t;switch(e){case"auto":return b(r,o,l);case"auto-vertical":return b(r,o,l,void 0,!0);case"auto-start":return b(r,o,l,"start");case"auto-vertical-start":return b(r,o,l,"start",!0);case"auto-end":return b(r,o,l,"end");case"auto-vertical-end":return b(r,o,l,"end",!0);default:return"bottom-start"}},X=e=>e.startsWith("auto"),W=e=>{const t=n.ref("auto"),o=n.ref(),l=n.ref(),a=n.ref(),r=n.ref(),u=n.reactive({position:{x:0,y:0}}),v={root:null,rootMargin:"0px",threshold:1,...e.element.value.intersectionOptions},x=n.ref(new IntersectionObserver(()=>{},v)),h=()=>{var f,d;const y=M(e.element.value.domRef.value);if(!y)return null;const s=(f=e.container)!=null&&f.value?M(e.container.value.domRef.value)??document.body:document.body,c=(d=e.opener)!=null&&d.value?M(e.opener.value.domRef.value):null;return{element:y,container:s,opener:c}},g=y=>{var s;return{element:y.element.getBoundingClientRect(),container:y.container.getBoundingClientRect(),opener:((s=y.opener)==null?void 0:s.getBoundingClientRect())??null}},m=(y=!1)=>n.nextTick(()=>{var O,z,B;o.value=((O=e.position)==null?void 0:O.value)??"auto";const s=h();if(!s)return;Object.assign(s.element.style,{position:"fixed",top:"0px",left:"0px"});const c=g(s);l.value=c.element,a.value=c.opener??void 0,r.value=c.container,x.value.observe(s.element),x.value.observe(s.container),X(o.value)&&s.opener&&(o.value=G(o.value,s.container,s.element,s.opener,((z=e.useViewport)==null?void 0:z.value)??!1));const f=V(window.getComputedStyle(s.element)),d=s.opener&&c.opener?I(o.value,c.opener,f):q(o.value,c.container,c.element),E=F(c.element,d.position,d.transform.x,d.transform.y),k=Q(E,c.element,c.container,d.transform);u.position.x=k.position.x,u.position.y=k.position.y,Object.assign(s.element.style,{top:`${u.position.y}px`,left:`${u.position.x}px`,position:"fixed",display:"flex"}),l.value=s.element.getBoundingClientRect(),(B=e.callback)!=null&&B.value&&!y&&e.callback.value(l,a,r,t,o)});return n.onUnmounted(()=>{x.value.disconnect()}),{float:u,rect:l,setPosition:m,position:t,actualPosition:o,openerRect:a,containerRect:r}};function R(e){const t=window.matchMedia(e),o=n.ref(t.matches);function l(a){o.value=a.matches}return n.onMounted(()=>{t.addEventListener("change",l)}),n.onUnmounted(()=>{t.removeEventListener("change",l)}),n.computed(()=>o.value)}function Y(e){return{isGreater(t){return R(`(min-width: ${e[t]})`)},isSmaller(t){return R(`(max-width: ${e[t]})`)},isInBetween(t,o){return R(`(min-width: ${e[t]}) and (max-width: ${e[o]})`)}}}function J(e,t,o){if(!e)throw new Error("A target component has to be provided.");if(!t)throw new Error("A callback has to be provided.");const l=a=>{!e.value||a.target===e.value||a.composedPath().includes(e.value)||typeof t=="function"&&t()};o&&n.watch(o,(a,r)=>{r&&r.removeEventListener("click",l),a==null||a.addEventListener("click",l)}),n.onMounted(()=>{o||document.addEventListener("click",l)}),n.onBeforeUnmount(()=>{var a;if(o){(a=o.value)==null||a.removeEventListener("click",l);return}document.removeEventListener("click",l)})}function Z(e,t){if(!e)throw new Error("A target component has to be provided.");if(!t||typeof t!="function")throw new Error("A callback has to be provided.");const o=l=>{t(l)};n.onMounted(()=>{e.value.addEventListener("keydown",o)}),n.onBeforeUnmount(()=>{e.value.removeEventListener("keydown",o)})}function _(e,t){if(!e||typeof e!="function")throw new Error("A callback has to be provided.");const o=l=>{e(l)};n.onMounted(()=>{if(!t){document.addEventListener("keyup",o);return}t.value.addEventListener("keyup",o)}),n.onBeforeUnmount(()=>{if(!t){document.removeEventListener("keyup",o);return}t.value.removeEventListener("keyup",o)})}const ee=e=>({format:P,parse:$}),N={global:{blue:{50:{value:"#eff1ff",type:"color"},100:{value:"#dee2ff",type:"color"},200:{value:"#bdc5ff",type:"color"},300:{value:"#9ca8ff",type:"color"},400:{value:"#7b8bff",type:"color"},500:{value:"#5a6eff",type:"color"},600:{value:"#4858cc",type:"color"},700:{value:"#364299",type:"color"},800:{value:"#242c66",type:"color"},900:{value:"#1b214c",type:"color"}},purple:{50:{value:"#f8f4ff",type:"color"},100:{value:"#f0e9ff",type:"color"},200:{value:"#e1d3ff",type:"color"},300:{value:"#d2bdff",type:"color"},400:{value:"#c3a7ff",type:"color"},500:{value:"#b491ff",type:"color"},600:{value:"#9074cc",type:"color"},700:{value:"#6c5799",type:"color"},800:{value:"#483a66",type:"color"},900:{value:"#241d33",type:"color"}},orange:{50:{value:"#fff2ef",type:"color"},100:{value:"#ffe4de",type:"color"},200:{value:"#ffc9bd",type:"color"},300:{value:"#ffae9c",type:"color"},400:{value:"#ff937b",type:"color"},500:{value:"#ff785a",type:"color"},600:{value:"#cc6048",type:"color"},700:{value:"#994836",type:"color"},800:{value:"#663024",type:"color"},900:{value:"#331812",type:"color"}},pink:{50:{value:"#fff5f5",type:"color"},100:{value:"#ffe0e0",type:"color"},200:{value:"#ffcbcb",type:"color"},300:{value:"#ffc0c0",type:"color"},400:{value:"#ffabab",type:"color"},500:{value:"#ff9696",type:"color"},600:{value:"#cc7878",type:"color"},700:{value:"#995a5a",type:"color"},800:{value:"#663c3c",type:"color"},900:{value:"#331e1e",type:"color"}},yellow:{50:{value:"#fffbf4",type:"color"},100:{value:"#fff3de",type:"color"},200:{value:"#ffebc8",type:"color"},300:{value:"#ffe7bd",type:"color"},400:{value:"#ffdfa7",type:"color"},500:{value:"#ffd791",type:"color"},600:{value:"#ccac74",type:"color"},700:{value:"#998157",type:"color"},800:{value:"#806c49",type:"color"},900:{value:"#4c402b",type:"color"}},semantic:{error:{50:{value:"#fef3f3",type:"color"},100:{value:"#f8baba",type:"color"},200:{value:"#f04242",type:"color"},300:{value:"#aa2f2f",type:"color"}},warning:{50:{value:"#fff8f3",type:"color"},100:{value:"#ffdabd",type:"color"},200:{value:"#ffae4f",type:"color"},300:{value:"#b47b38",type:"color"}},success:{50:{value:"#f2f8f6",type:"color"},100:{value:"#b5d8ce",type:"color"},200:{value:"#0fa88c",type:"color"},300:{value:"#0b7763",type:"color"}},info:{50:{value:"#f3f7ff",type:"color"},100:{value:"#b4c8e1",type:"color"},200:{value:"#4e9fff",type:"color"},300:{value:"#3770b4",type:"color"}}},background:{"white-smoke":{value:"#f7f6f3",type:"color"},seashell:{value:"#f8ece7",type:"color"},"pale-purple":{value:"#f2e6ff",type:"color"},"alice-blue":{value:"#ecf2fc",type:"color"}},grey:{100:{value:"#e9edf0",type:"color"},200:{value:"#d1dde6",type:"color"},300:{value:"#9da9b2",type:"color"},400:{value:"#6e777e",type:"color"},500:{value:"#596167",type:"color"}},core:{white:{value:"#ffffff",type:"color"},black:{value:"#2c282f",type:"color"}},"font-sans":{"sharp-grotesk":{value:'"Sharp Grotesk", sans-serif',type:"fontFamilies"},inter:{value:'"Inter", sans-serif',type:"fontFamilies"}},font:{light:{value:"300",type:"fontWeights"},normal:{value:"400",type:"fontWeights"},medium:{value:"500",type:"fontWeights"}},spacing:{0:{value:"0px",type:"spacing"},1:{value:"1px",type:"spacing"},2:{value:"2px",type:"spacing"},4:{value:"4px",type:"spacing"},6:{value:"6px",type:"spacing"},8:{value:"8px",type:"spacing"},10:{value:"10px",type:"spacing"},12:{value:"12px",type:"spacing"},14:{value:"14px",type:"spacing"},16:{value:"16px",type:"spacing"},20:{value:"20px",type:"spacing"},24:{value:"24px",type:"spacing"},28:{value:"28px",type:"spacing"},32:{value:"32px",type:"spacing"},36:{value:"36px",type:"spacing"},40:{value:"40px",type:"spacing"},44:{value:"44px",type:"spacing"},48:{value:"48px",type:"spacing"},56:{value:"56px",type:"spacing"},64:{value:"64px",type:"spacing"},80:{value:"80px",type:"spacing"},96:{value:"96px",type:"spacing"},112:{value:"112px",type:"spacing"},128:{value:"128px",type:"spacing"},144:{value:"144px",type:"spacing"},160:{value:"160px",type:"spacing"},176:{value:"176px",type:"spacing"},192:{value:"192px",type:"spacing"},208:{value:"208px",type:"spacing"},224:{value:"224px",type:"spacing"},240:{value:"240px",type:"spacing"},256:{value:"256px",type:"spacing"},288:{value:"288px",type:"spacing"},320:{value:"320px",type:"spacing"},384:{value:"384px",type:"spacing"}},border:{0:{value:"0px",type:"borderWidth"},1:{value:"1px",type:"borderWidth"},2:{value:"2px",type:"borderWidth"},4:{value:"4px",type:"borderWidth"},8:{value:"8px",type:"borderWidth"}},rounded:{none:{value:"0px",type:"borderRadius"},sm:{value:"2px",type:"borderRadius"},base:{value:"4px",type:"borderRadius"},md:{value:"6px",type:"borderRadius"},lg:{value:"8px",type:"borderRadius"},xl:{value:"12px",type:"borderRadius"},"2xl":{value:"16px",type:"borderRadius"},"3xl":{value:"24px",type:"borderRadius"},full:{value:"9999px",type:"borderRadius"}},breakpoint:{xs:{value:"376px",type:"sizing"},sm:{value:"640px",type:"sizing"},md:{value:"768px",type:"sizing"},lg:{value:"1024px",type:"sizing"},xl:{value:"1280px",type:"sizing"},"2xl":{value:"1440px",type:"sizing"},"3xl":{value:"1536px",type:"sizing"}},shadow:{none:{value:{color:"#000000",type:"dropShadow",x:"0",y:"0",blur:"0",spread:"0"},type:"boxShadow"},sm:{value:{color:"#0000000d",type:"dropShadow",x:"0",y:"1",blur:"2",spread:"0"},type:"boxShadow"},base:{value:[{color:"#0000000f",type:"dropShadow",x:"0",y:"1",blur:"2",spread:"0"},{color:"#0000001a",type:"dropShadow",x:"0",y:"1",blur:"3",spread:"0"}],type:"boxShadow"},md:{value:[{color:"#0000000f",type:"dropShadow",x:"0",y:"2",blur:"4",spread:"-1"},{color:"#0000001a",type:"dropShadow",x:"0",y:"4",blur:"6",spread:"-1"}],type:"boxShadow"},lg:{value:[{color:"#0000000d",type:"dropShadow",x:"0",y:"4",blur:"6",spread:"-2"},{color:"#0000001a",type:"dropShadow",x:"0",y:"10",blur:"15",spread:"-3"}],type:"boxShadow"},xl:{value:[{color:"#0000000a",type:"dropShadow",x:"0",y:"10",blur:"10",spread:"-5"},{color:"#0000001a",type:"dropShadow",x:"0",y:"20",blur:"25",spread:"-5"}],type:"boxShadow"},"2xl":{value:{color:"#00000040",type:"dropShadow",x:"0",y:"25",blur:"50",spread:"-12"},type:"boxShadow"},inner:{value:{color:"#0000000f",type:"innerShadow",x:"0",y:"2",blur:"4",spread:"0"},type:"boxShadow"}},underline:{value:"underline",type:"textDecoration"},text:{xs:{value:"12px",type:"fontSizes"},sm:{value:"14px",type:"fontSizes"},base:{value:"16px",type:"fontSizes"},lg:{value:"18px",type:"fontSizes"},xl:{value:"20px",type:"fontSizes"},"2xl":{value:"24px",type:"fontSizes"},"3xl":{value:"30px",type:"fontSizes"},"4xl":{value:"36px",type:"fontSizes"},"5xl":{value:"48px",type:"fontSizes"},"6xl":{value:"60px",type:"fontSizes"},"7xl":{value:"72px",type:"fontSizes"},"8xl":{value:"96px",type:"fontSizes"},"9xl":{value:"128px",type:"fontSizes"}},leading:{xs:{value:"16px",type:"lineHeights"},sm:{value:"18px",type:"lineHeights"},base:{value:"20px",type:"lineHeights"},lg:{value:"24px",type:"lineHeights"},xl:{value:"28px",type:"lineHeights"},"2xl":{value:"32px",type:"lineHeights"},"3xl":{value:"36px",type:"lineHeights"},"4xl":{value:"40px",type:"lineHeights"},"5xl":{value:"48px",type:"lineHeights"},"6xl":{value:"60px",type:"lineHeights"},"7xl":{value:"72px",type:"lineHeights"},"8xl":{value:"96px",type:"lineHeights"},"9xl":{value:"128px",type:"lineHeights"}}}},te={safeColorNames:["blue","purple","orange","pink","yellow","grey","core"]},oe={semanticColorNames:["error","warning","success","info"]},le=te.safeColorNames,ne=oe.semanticColorNames,S={};le.forEach(e=>{const t=N.global[e];t&&Object.keys(t).forEach(o=>{var a;const l=(a=t[o])==null?void 0:a.value;l&&(S[e]||(S[e]={}),S[e][o]=l)})});const H=N.global.semantic;H&&ne.forEach(e=>{const t=H[e];t&&typeof t=="object"&&Object.keys(t).forEach(o=>{var a;const l=(a=t[o])==null?void 0:a.value;if(l){const r=`semantic-${e}`;S[r]||(S[r]={}),S[r][o]=l}})});const re=Object.entries(N.global.breakpoint).reduce((e,[t,o])=>(e[t]=o.value,e),{}),ae=n.defineComponent({__name:"FzFloating",props:{isOpen:{type:Boolean,default:!1},position:{default:"auto"},container:{},contentClass:{},openerClass:{},overrideContentClass:{type:Boolean},overrideOpener:{},teleport:{type:Boolean,default:!1},useViewport:{type:Boolean}},emits:["fzfloating:setPosition"],setup(e,{expose:t,emit:o}){const l=e,a=o,r=n.ref(null),u=n.ref(null),v=n.useSlots(),x=R(`(max-width: ${re.xs})`);let h=!1,g=!1,m=null,y=null;const s={position:l.position,element:{domRef:r},container:{domRef:n.toRef(l.container||document.body)},opener:{domRef:n.toRef(null)},useViewport:l.useViewport,callback(...i){a("fzfloating:setPosition",...i)}},c=n.toRefs(s);v.opener&&(s.opener={domRef:u});const f=W(c),d=()=>{h||!g||(h=!0,requestAnimationFrame(()=>{g&&l.isOpen&&f.setPosition(),h=!1}))};n.onMounted(()=>{g=!0});const E=()=>{d()},k=()=>{d()},O=()=>{window.addEventListener("scroll",E,!0),window.addEventListener("resize",k),r.value&&!m&&(m=new ResizeObserver(()=>{d()}),m.observe(r.value)),u.value&&!y&&(y=new ResizeObserver(()=>{d()}),y.observe(u.value))},z=()=>{window.removeEventListener("scroll",E,!0),window.removeEventListener("resize",k),m&&(m.disconnect(),m=null),y&&(y.disconnect(),y=null)};n.watch(()=>l.position,()=>d()),n.watch(()=>l.isOpen,i=>{var D;if(!i||!r.value||!g){z();return}O();const w=(D=u.value)==null?void 0:D.getBoundingClientRect();r.value.style.position="fixed",r.value.style.top="0px",r.value.style.left="0px",r.value.style.transform="none",r.value.style.width=x.value?(w==null?void 0:w.width)+"px":"auto",f.setPosition()}),n.watch(()=>l.overrideOpener,i=>{i&&c.opener&&c.opener.value&&(c.opener.value={domRef:i})}),n.onBeforeUnmount(()=>{g=!1,z()});const B=i=>i.startsWith("bottom")?"mt-4":i.startsWith("top")?"mb-4":i.startsWith("left")?"mr-4":i.startsWith("right")?"ml-4":"mt-4",ie=n.computed(()=>{var w;const i=((w=f.actualPosition)==null?void 0:w.value)??l.position;return B(i)}),A=n.computed(()=>l.overrideContentClass?l.contentClass:["bg-core-white fixed",ie.value,l.contentClass]);return t({setPosition:f.setPosition}),(i,w)=>(n.openBlock(),n.createElementBlock("div",null,[n.renderSlot(i.$slots,"opener-start"),n.createElementVNode("div",{ref_key:"opener",ref:u,class:"inline-flex w-full sm:w-auto"},[n.renderSlot(i.$slots,"opener",{isOpen:e.isOpen,floating:n.unref(f)})],512),n.renderSlot(i.$slots,"opener-end"),e.teleport?n.createCommentVNode("",!0):n.withDirectives((n.openBlock(),n.createElementBlock("div",{key:0,ref_key:"content",ref:r,class:n.normalizeClass(["fz__floating__content w-full sm:w-auto",A.value])},[n.renderSlot(i.$slots,"default",{isOpen:e.isOpen,floating:n.unref(f)})],2)),[[n.vShow,i.$slots.default&&(!i.$slots.opener||i.$slots.opener&&e.isOpen)]]),e.teleport?(n.openBlock(),n.createBlock(n.Teleport,{key:1,to:"body"},[n.withDirectives(n.createElementVNode("div",{ref_key:"content",ref:r,class:n.normalizeClass(["fz__floating__content",A.value])},[n.renderSlot(i.$slots,"default",{isOpen:e.isOpen,floating:n.unref(f)})],2),[[n.vShow,i.$slots.default&&(!i.$slots.opener||i.$slots.opener&&e.isOpen)]])])):n.createCommentVNode("",!0)]))}});p.FzFloating=ae,p.calcRealPos=F,p.clamp=T,p.format=P,p.getHighestAvailableSpacePos=b,p.parse=$,p.roundTo=U,p.truncateDecimals=L,p.useBreakpoints=Y,p.useClickOutside=J,p.useCurrency=ee,p.useFloating=W,p.useKeyDown=Z,p.useKeyUp=_,p.useMediaQuery=R,Object.defineProperty(p,Symbol.toStringTag,{value:"Module"})});
|
|
1
|
+
(function(p,l){typeof exports=="object"&&typeof module<"u"?l(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],l):(p=typeof globalThis<"u"?globalThis:p||self,l(p.FzComposables={},p.Vue))})(this,function(p,l){"use strict";const L=(e,t)=>{if(!isFinite(e)||t<0)return e;if(t===0)return Math.trunc(e);const o=String(e);if(o.includes("e")||o.includes("E")){const r=Math.pow(10,t);return Math.trunc(e*r)/r}const n=o.indexOf(".");return n===-1||o.length-n-1<=t?e:Number(o.slice(0,n+t+1))},P=(e,{minimumFractionDigits:t=0,maximumFractionDigits:o=2,roundDecimals:n=!0,useGrouping:r=!0}={})=>e==null||isNaN(e)||!isFinite(e)?"":(n?e:L(e,o)).toLocaleString("it-IT",{minimumFractionDigits:t,maximumFractionDigits:o,useGrouping:r}),$=e=>{if(!e||typeof e!="string")return NaN;let t=e.trim();return t.includes(",")&&(t=t.replace(/\./g,""),t=t.replace(",",".")),parseFloat(t)},T=(e,t)=>{let o=t;const n=t%e,r=t>=0?e:-e;return n!==0&&(o=Math.abs(n)>=e/2?t+r-n:t-n),o},V=(e,t,o)=>Math.max(e,Math.min(t,o)),C=new DOMRect(0,0,window.innerWidth,window.innerHeight),b=(e,t,o,n,r)=>{let i=r?"bottom":"right",u=r?"bottom-start":"right-start";C.width=window.innerWidth,C.height=window.innerHeight,C.x=0,C.y=0;const v=e?e.getBoundingClientRect():C,x=t.getBoundingClientRect(),h=o.getBoundingClientRect(),m=(h.left-v.left-x.width)/v.width,g=(v.right-h.right-x.width)/v.width,y=(h.top-v.top-x.height)/v.height,s=(v.bottom-h.bottom-x.height)/v.height;let c=[{key:"right",space:g},{key:"top",space:y},{key:"bottom",space:s},{key:"left",space:m}].sort((f,d)=>d.space-f.space);if(r&&(c=c.filter(f=>f.key==="top"||f.key==="bottom")),i=c[0].key,!n){const f=(x.height-h.height)/2;switch(i){case"right":case"left":v.top>h.top-f&&(n="end"),v.bottom<h.top-f&&(n="start");break}}return u=n?`${i}-${n}`:i,u},F=(e,t,o,n)=>({x:t.x+e.width*o/100,y:t.y+e.height*n/100}),M=e=>typeof e=="string"?document.querySelector(e):e,j=e=>({left:parseFloat(e.marginLeft),right:parseFloat(e.marginRight),top:parseFloat(e.marginTop),bottom:parseFloat(e.marginBottom)}),D={bottom:(e,t)=>({position:{x:e.left-t.left+e.width/2,y:e.bottom},transform:{x:-50,y:0}}),"bottom-start":(e,t)=>({position:{x:e.left-t.left,y:e.bottom},transform:{x:0,y:0}}),"bottom-end":(e,t)=>({position:{x:e.right+t.right,y:e.bottom},transform:{x:-100,y:0}}),top:(e,t)=>({position:{x:e.left-t.left+e.width/2,y:e.top-t.bottom},transform:{x:-50,y:-100}}),"top-start":(e,t)=>({position:{x:e.left-t.left,y:e.top-t.bottom},transform:{x:0,y:-100}}),"top-end":(e,t)=>({position:{x:e.right+t.right,y:e.top-t.bottom},transform:{x:-100,y:-100}}),left:(e,t)=>({position:{x:e.left-t.right,y:e.top-t.top+e.height/2},transform:{x:-100,y:-50}}),"left-start":(e,t)=>({position:{x:e.left-t.right,y:e.top-t.top},transform:{x:-100,y:0}}),"left-end":(e,t)=>({position:{x:e.left-t.right,y:e.bottom+t.bottom},transform:{x:-100,y:-100}}),right:(e,t)=>({position:{x:e.right+t.left,y:e.top-t.top+e.height/2},transform:{x:0,y:-50}}),"right-start":(e,t)=>({position:{x:e.right+t.left,y:e.top-t.top},transform:{x:0,y:0}}),"right-end":(e,t)=>({position:{x:e.right+t.left,y:e.bottom+t.bottom},transform:{x:0,y:-100}})},I=(e,t,o)=>{const n=D[e];return n?n(t,o):{position:{x:0,y:0},transform:{x:0,y:0}}},K={bottom:(e,t)=>({position:{x:e.left+e.width/2,y:e.bottom-t.height},transform:{x:-50,y:0}}),"bottom-start":(e,t)=>({position:{x:e.left,y:e.bottom-t.height},transform:{x:0,y:0}}),"bottom-end":(e,t)=>({position:{x:e.right-t.width,y:e.bottom-t.height},transform:{x:0,y:0}}),top:e=>({position:{x:e.left+e.width/2,y:e.top},transform:{x:-50,y:0}}),"top-start":e=>({position:{x:e.left,y:e.top},transform:{x:0,y:0}}),"top-end":(e,t)=>({position:{x:e.right-t.width,y:e.top},transform:{x:0,y:0}}),left:(e,t)=>({position:{x:e.left,y:e.top+(e.height-t.height)/2},transform:{x:0,y:0}}),"left-start":e=>({position:{x:e.left,y:e.top},transform:{x:0,y:0}}),"left-end":(e,t)=>({position:{x:e.left,y:e.bottom-t.height},transform:{x:0,y:0}}),right:(e,t)=>({position:{x:e.right-t.width,y:e.top+(e.height-t.height)/2},transform:{x:0,y:0}}),"right-start":(e,t)=>({position:{x:e.right-t.width,y:e.top},transform:{x:0,y:0}}),"right-end":(e,t)=>({position:{x:e.right-t.width,y:e.bottom-t.height},transform:{x:0,y:0}})},q=(e,t,o)=>{const n=K[e];return n?n(t,o):{position:{x:0,y:0},transform:{x:0,y:0}}},Q=(e,t,o,n)=>{const r={...e},i={...n};if(e.x<o.left&&(r.x=o.left,i.x=0),e.x+t.width>o.right){const u=o.right-t.width;u>0&&(r.x=u),i.x=0}if(e.y<o.top&&(r.y=o.top,i.y=0),e.y+t.height>o.bottom){const u=o.bottom-t.height;u>0&&(r.y=u),i.y=0}return{position:r,transform:i}},G=(e,t,o,n,r)=>{const i=r?null:t;switch(e){case"auto":return b(i,o,n);case"auto-vertical":return b(i,o,n,void 0,!0);case"auto-start":return b(i,o,n,"start");case"auto-vertical-start":return b(i,o,n,"start",!0);case"auto-end":return b(i,o,n,"end");case"auto-vertical-end":return b(i,o,n,"end",!0);default:return"bottom-start"}},X=e=>e.startsWith("auto"),W=e=>{const t=l.ref("auto"),o=l.ref(),n=l.ref(),r=l.ref(),i=l.ref(),u=l.reactive({position:{x:0,y:0}}),v={root:null,rootMargin:"0px",threshold:1,...e.element.value.intersectionOptions},x=l.ref(new IntersectionObserver(()=>{},v)),h=()=>{var f,d;const y=M(e.element.value.domRef.value);if(!y)return null;const s=(f=e.container)!=null&&f.value?M(e.container.value.domRef.value)??document.body:document.body,c=(d=e.opener)!=null&&d.value?M(e.opener.value.domRef.value):null;return{element:y,container:s,opener:c}},m=y=>{var s;return{element:y.element.getBoundingClientRect(),container:y.container.getBoundingClientRect(),opener:((s=y.opener)==null?void 0:s.getBoundingClientRect())??null}},g=(y=!1)=>l.nextTick(()=>{var O,z,B;o.value=((O=e.position)==null?void 0:O.value)??"auto";const s=h();if(!s)return;Object.assign(s.element.style,{position:"fixed",top:"0px",left:"0px"});const c=m(s);n.value=c.element,r.value=c.opener??void 0,i.value=c.container,x.value.observe(s.element),x.value.observe(s.container),X(o.value)&&s.opener&&(o.value=G(o.value,s.container,s.element,s.opener,((z=e.useViewport)==null?void 0:z.value)??!1));const f=j(window.getComputedStyle(s.element)),d=s.opener&&c.opener?I(o.value,c.opener,f):q(o.value,c.container,c.element),E=F(c.element,d.position,d.transform.x,d.transform.y),k=Q(E,c.element,c.container,d.transform);u.position.x=k.position.x,u.position.y=k.position.y,Object.assign(s.element.style,{top:`${u.position.y}px`,left:`${u.position.x}px`,position:"fixed",display:"flex"}),n.value=s.element.getBoundingClientRect(),(B=e.callback)!=null&&B.value&&!y&&e.callback.value(n,r,i,t,o)});return l.onUnmounted(()=>{x.value.disconnect()}),{float:u,rect:n,setPosition:g,position:t,actualPosition:o,openerRect:r,containerRect:i}};function R(e){const t=window.matchMedia(e),o=l.ref(t.matches);function n(r){o.value=r.matches}return l.onMounted(()=>{t.addEventListener("change",n)}),l.onUnmounted(()=>{t.removeEventListener("change",n)}),l.computed(()=>o.value)}function Y(e){return{isGreater(t){return R(`(min-width: ${e[t]})`)},isSmaller(t){return R(`(max-width: ${e[t]})`)},isInBetween(t,o){return R(`(min-width: ${e[t]}) and (max-width: ${e[o]})`)}}}function J(e,t,o){if(!e)throw new Error("A target component has to be provided.");if(!t)throw new Error("A callback has to be provided.");const n=r=>{!e.value||r.target===e.value||r.composedPath().includes(e.value)||typeof t=="function"&&t()};o&&l.watch(o,(r,i)=>{i&&i.removeEventListener("click",n),r==null||r.addEventListener("click",n)}),l.onMounted(()=>{o||document.addEventListener("click",n)}),l.onBeforeUnmount(()=>{var r;if(o){(r=o.value)==null||r.removeEventListener("click",n);return}document.removeEventListener("click",n)})}function Z(e,t){if(!e)throw new Error("A target component has to be provided.");if(!t||typeof t!="function")throw new Error("A callback has to be provided.");const o=n=>{t(n)};l.onMounted(()=>{e.value.addEventListener("keydown",o)}),l.onBeforeUnmount(()=>{e.value.removeEventListener("keydown",o)})}function _(e,t){if(!e||typeof e!="function")throw new Error("A callback has to be provided.");const o=n=>{e(n)};l.onMounted(()=>{if(!t){document.addEventListener("keyup",o);return}t.value.addEventListener("keyup",o)}),l.onBeforeUnmount(()=>{if(!t){document.removeEventListener("keyup",o);return}t.value.removeEventListener("keyup",o)})}const ee=e=>({format:P,parse:$}),N={global:{blue:{50:{value:"#eff1ff",type:"color"},100:{value:"#dee2ff",type:"color"},200:{value:"#bdc5ff",type:"color"},300:{value:"#9ca8ff",type:"color"},400:{value:"#7b8bff",type:"color"},500:{value:"#5a6eff",type:"color"},600:{value:"#4858cc",type:"color"},700:{value:"#364299",type:"color"},800:{value:"#242c66",type:"color"},900:{value:"#1b214c",type:"color"}},purple:{50:{value:"#f8f4ff",type:"color"},100:{value:"#f0e9ff",type:"color"},200:{value:"#e1d3ff",type:"color"},300:{value:"#d2bdff",type:"color"},400:{value:"#c3a7ff",type:"color"},500:{value:"#b491ff",type:"color"},600:{value:"#9074cc",type:"color"},700:{value:"#6c5799",type:"color"},800:{value:"#483a66",type:"color"},900:{value:"#241d33",type:"color"}},orange:{50:{value:"#fff2ef",type:"color"},100:{value:"#ffe4de",type:"color"},200:{value:"#ffc9bd",type:"color"},300:{value:"#ffae9c",type:"color"},400:{value:"#ff937b",type:"color"},500:{value:"#ff785a",type:"color"},600:{value:"#cc6048",type:"color"},700:{value:"#994836",type:"color"},800:{value:"#663024",type:"color"},900:{value:"#331812",type:"color"}},pink:{50:{value:"#fff5f5",type:"color"},100:{value:"#ffe0e0",type:"color"},200:{value:"#ffcbcb",type:"color"},300:{value:"#ffc0c0",type:"color"},400:{value:"#ffabab",type:"color"},500:{value:"#ff9696",type:"color"},600:{value:"#cc7878",type:"color"},700:{value:"#995a5a",type:"color"},800:{value:"#663c3c",type:"color"},900:{value:"#331e1e",type:"color"}},yellow:{50:{value:"#fffbf4",type:"color"},100:{value:"#fff3de",type:"color"},200:{value:"#ffebc8",type:"color"},300:{value:"#ffe7bd",type:"color"},400:{value:"#ffdfa7",type:"color"},500:{value:"#ffd791",type:"color"},600:{value:"#ccac74",type:"color"},700:{value:"#998157",type:"color"},800:{value:"#806c49",type:"color"},900:{value:"#4c402b",type:"color"}},semantic:{error:{50:{value:"#fef3f3",type:"color"},100:{value:"#f8baba",type:"color"},200:{value:"#f04242",type:"color"},300:{value:"#aa2f2f",type:"color"}},warning:{50:{value:"#fff8f3",type:"color"},100:{value:"#ffdabd",type:"color"},200:{value:"#ffae4f",type:"color"},300:{value:"#b47b38",type:"color"}},success:{50:{value:"#f2f8f6",type:"color"},100:{value:"#b5d8ce",type:"color"},200:{value:"#0fa88c",type:"color"},300:{value:"#0b7763",type:"color"}},info:{50:{value:"#f3f7ff",type:"color"},100:{value:"#b4c8e1",type:"color"},200:{value:"#4e9fff",type:"color"},300:{value:"#3770b4",type:"color"}}},background:{"white-smoke":{value:"#f7f6f3",type:"color"},seashell:{value:"#f8ece7",type:"color"},"pale-purple":{value:"#f2e6ff",type:"color"},"alice-blue":{value:"#ecf2fc",type:"color"}},grey:{100:{value:"#e9edf0",type:"color"},200:{value:"#d1dde6",type:"color"},300:{value:"#9da9b2",type:"color"},400:{value:"#6e777e",type:"color"},500:{value:"#596167",type:"color"}},core:{white:{value:"#ffffff",type:"color"},black:{value:"#2c282f",type:"color"}},"font-sans":{"sharp-grotesk":{value:'"Sharp Grotesk", sans-serif',type:"fontFamilies"},inter:{value:'"Inter", sans-serif',type:"fontFamilies"}},font:{light:{value:"300",type:"fontWeights"},normal:{value:"400",type:"fontWeights"},medium:{value:"500",type:"fontWeights"}},spacing:{0:{value:"0px",type:"spacing"},1:{value:"1px",type:"spacing"},2:{value:"2px",type:"spacing"},4:{value:"4px",type:"spacing"},6:{value:"6px",type:"spacing"},8:{value:"8px",type:"spacing"},10:{value:"10px",type:"spacing"},12:{value:"12px",type:"spacing"},14:{value:"14px",type:"spacing"},16:{value:"16px",type:"spacing"},20:{value:"20px",type:"spacing"},24:{value:"24px",type:"spacing"},28:{value:"28px",type:"spacing"},32:{value:"32px",type:"spacing"},36:{value:"36px",type:"spacing"},40:{value:"40px",type:"spacing"},44:{value:"44px",type:"spacing"},48:{value:"48px",type:"spacing"},56:{value:"56px",type:"spacing"},64:{value:"64px",type:"spacing"},80:{value:"80px",type:"spacing"},96:{value:"96px",type:"spacing"},112:{value:"112px",type:"spacing"},128:{value:"128px",type:"spacing"},144:{value:"144px",type:"spacing"},160:{value:"160px",type:"spacing"},176:{value:"176px",type:"spacing"},192:{value:"192px",type:"spacing"},208:{value:"208px",type:"spacing"},224:{value:"224px",type:"spacing"},240:{value:"240px",type:"spacing"},256:{value:"256px",type:"spacing"},288:{value:"288px",type:"spacing"},320:{value:"320px",type:"spacing"},384:{value:"384px",type:"spacing"}},border:{0:{value:"0px",type:"borderWidth"},1:{value:"1px",type:"borderWidth"},2:{value:"2px",type:"borderWidth"},4:{value:"4px",type:"borderWidth"},8:{value:"8px",type:"borderWidth"}},rounded:{none:{value:"0px",type:"borderRadius"},sm:{value:"2px",type:"borderRadius"},base:{value:"4px",type:"borderRadius"},md:{value:"6px",type:"borderRadius"},lg:{value:"8px",type:"borderRadius"},xl:{value:"12px",type:"borderRadius"},"2xl":{value:"16px",type:"borderRadius"},"3xl":{value:"24px",type:"borderRadius"},full:{value:"9999px",type:"borderRadius"}},breakpoint:{xs:{value:"376px",type:"sizing"},sm:{value:"640px",type:"sizing"},md:{value:"768px",type:"sizing"},lg:{value:"1024px",type:"sizing"},xl:{value:"1280px",type:"sizing"},"2xl":{value:"1440px",type:"sizing"},"3xl":{value:"1536px",type:"sizing"}},shadow:{none:{value:{color:"#000000",type:"dropShadow",x:"0",y:"0",blur:"0",spread:"0"},type:"boxShadow"},sm:{value:{color:"#0000000d",type:"dropShadow",x:"0",y:"1",blur:"2",spread:"0"},type:"boxShadow"},base:{value:[{color:"#0000000f",type:"dropShadow",x:"0",y:"1",blur:"2",spread:"0"},{color:"#0000001a",type:"dropShadow",x:"0",y:"1",blur:"3",spread:"0"}],type:"boxShadow"},md:{value:[{color:"#0000000f",type:"dropShadow",x:"0",y:"2",blur:"4",spread:"-1"},{color:"#0000001a",type:"dropShadow",x:"0",y:"4",blur:"6",spread:"-1"}],type:"boxShadow"},lg:{value:[{color:"#0000000d",type:"dropShadow",x:"0",y:"4",blur:"6",spread:"-2"},{color:"#0000001a",type:"dropShadow",x:"0",y:"10",blur:"15",spread:"-3"}],type:"boxShadow"},xl:{value:[{color:"#0000000a",type:"dropShadow",x:"0",y:"10",blur:"10",spread:"-5"},{color:"#0000001a",type:"dropShadow",x:"0",y:"20",blur:"25",spread:"-5"}],type:"boxShadow"},"2xl":{value:{color:"#00000040",type:"dropShadow",x:"0",y:"25",blur:"50",spread:"-12"},type:"boxShadow"},inner:{value:{color:"#0000000f",type:"innerShadow",x:"0",y:"2",blur:"4",spread:"0"},type:"boxShadow"}},underline:{value:"underline",type:"textDecoration"},text:{xs:{value:"12px",type:"fontSizes"},sm:{value:"14px",type:"fontSizes"},base:{value:"16px",type:"fontSizes"},lg:{value:"18px",type:"fontSizes"},xl:{value:"20px",type:"fontSizes"},"2xl":{value:"24px",type:"fontSizes"},"3xl":{value:"30px",type:"fontSizes"},"4xl":{value:"36px",type:"fontSizes"},"5xl":{value:"48px",type:"fontSizes"},"6xl":{value:"60px",type:"fontSizes"},"7xl":{value:"72px",type:"fontSizes"},"8xl":{value:"96px",type:"fontSizes"},"9xl":{value:"128px",type:"fontSizes"}},leading:{xs:{value:"16px",type:"lineHeights"},sm:{value:"18px",type:"lineHeights"},base:{value:"20px",type:"lineHeights"},lg:{value:"24px",type:"lineHeights"},xl:{value:"28px",type:"lineHeights"},"2xl":{value:"32px",type:"lineHeights"},"3xl":{value:"36px",type:"lineHeights"},"4xl":{value:"40px",type:"lineHeights"},"5xl":{value:"48px",type:"lineHeights"},"6xl":{value:"60px",type:"lineHeights"},"7xl":{value:"72px",type:"lineHeights"},"8xl":{value:"96px",type:"lineHeights"},"9xl":{value:"128px",type:"lineHeights"}}}},te={safeColorNames:["blue","purple","orange","pink","yellow","grey","core"]},oe={semanticColorNames:["error","warning","success","info"]},ne=te.safeColorNames,le=oe.semanticColorNames,S={};ne.forEach(e=>{const t=N.global[e];t&&Object.keys(t).forEach(o=>{var r;const n=(r=t[o])==null?void 0:r.value;n&&(S[e]||(S[e]={}),S[e][o]=n)})});const H=N.global.semantic;H&&le.forEach(e=>{const t=H[e];t&&typeof t=="object"&&Object.keys(t).forEach(o=>{var r;const n=(r=t[o])==null?void 0:r.value;if(n){const i=`semantic-${e}`;S[i]||(S[i]={}),S[i][o]=n}})});const re=Object.entries(N.global.breakpoint).reduce((e,[t,o])=>(e[t]=o.value,e),{}),ie=l.defineComponent({__name:"FzFloating",props:{isOpen:{type:Boolean,default:!1},position:{default:"auto"},container:{},contentClass:{},openerClass:{},overrideContentClass:{type:Boolean},overrideOpener:{},teleport:{type:Boolean,default:!1},useViewport:{type:Boolean}},emits:["fzfloating:setPosition"],setup(e,{expose:t,emit:o}){const n=e,r=o,i=l.ref(null),u=l.ref(null),v=l.useSlots(),x=R(`(max-width: ${re.xs})`);let h=!1,m=!1,g=null,y=null;const s={position:n.position,element:{domRef:i},container:{domRef:l.toRef(n.container||document.body)},opener:{domRef:l.toRef(null)},useViewport:n.useViewport,callback(...a){r("fzfloating:setPosition",...a)}},c=l.toRefs(s);v.opener&&(s.opener={domRef:u});const f=W(c),d=()=>{h||!m||(h=!0,requestAnimationFrame(()=>{m&&n.isOpen&&f.setPosition(),h=!1}))};l.onMounted(()=>{m=!0});const E=()=>{d()},k=()=>{d()},O=()=>{window.addEventListener("scroll",E,!0),window.addEventListener("resize",k),i.value&&!g&&(g=new ResizeObserver(()=>{d()}),g.observe(i.value)),u.value&&!y&&(y=new ResizeObserver(()=>{d()}),y.observe(u.value))},z=()=>{window.removeEventListener("scroll",E,!0),window.removeEventListener("resize",k),g&&(g.disconnect(),g=null),y&&(y.disconnect(),y=null)};l.watch(()=>n.position,()=>d()),l.watch(()=>n.isOpen,a=>{var U;if(!a||!i.value||!m){z();return}O();const w=(U=u.value)==null?void 0:U.getBoundingClientRect();i.value.style.position="fixed",i.value.style.top="0px",i.value.style.left="0px",i.value.style.transform="none",i.value.style.width=x.value?(w==null?void 0:w.width)+"px":"auto",f.setPosition()}),l.watch(()=>n.overrideOpener,a=>{a&&c.opener&&c.opener.value&&(c.opener.value={domRef:a})}),l.onBeforeUnmount(()=>{m=!1,z()});const B=a=>a.startsWith("bottom")?"mt-4":a.startsWith("top")?"mb-4":a.startsWith("left")?"mr-4":a.startsWith("right")?"ml-4":"mt-4",ae=l.computed(()=>{var w;const a=((w=f.actualPosition)==null?void 0:w.value)??n.position;return B(a)}),A=l.computed(()=>n.overrideContentClass?n.contentClass:["bg-core-white fixed",ae.value,n.contentClass]);return t({setPosition:f.setPosition}),(a,w)=>(l.openBlock(),l.createElementBlock("div",null,[l.renderSlot(a.$slots,"opener-start"),l.createElementVNode("div",{ref_key:"opener",ref:u,class:"inline-flex w-full sm:w-auto"},[l.renderSlot(a.$slots,"opener",{isOpen:e.isOpen,floating:l.unref(f)})],512),l.renderSlot(a.$slots,"opener-end"),e.teleport?l.createCommentVNode("",!0):l.withDirectives((l.openBlock(),l.createElementBlock("div",{key:0,ref_key:"content",ref:i,class:l.normalizeClass(["fz__floating__content w-full sm:w-auto",A.value])},[l.renderSlot(a.$slots,"default",{isOpen:e.isOpen,floating:l.unref(f)})],2)),[[l.vShow,a.$slots.default&&(!a.$slots.opener||a.$slots.opener&&e.isOpen)]]),e.teleport?(l.openBlock(),l.createBlock(l.Teleport,{key:1,to:"body"},[l.withDirectives(l.createElementVNode("div",{ref_key:"content",ref:i,class:l.normalizeClass(["fz__floating__content",A.value])},[l.renderSlot(a.$slots,"default",{isOpen:e.isOpen,floating:l.unref(f)})],2),[[l.vShow,a.$slots.default&&(!a.$slots.opener||a.$slots.opener&&e.isOpen)]])])):l.createCommentVNode("",!0)]))}});p.FzFloating=ie,p.calcRealPos=F,p.clamp=V,p.format=P,p.getHighestAvailableSpacePos=b,p.parse=$,p.roundTo=T,p.truncateDecimals=L,p.useBreakpoints=Y,p.useClickOutside=J,p.useCurrency=ee,p.useFloating=W,p.useKeyDown=Z,p.useKeyUp=_,p.useMediaQuery=R,Object.defineProperty(p,Symbol.toStringTag,{value:"Module"})});
|
package/package.json
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fiscozen/composables",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.3",
|
|
4
4
|
"description": "Design System utility composables",
|
|
5
5
|
"main": "src/index.ts",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"keywords": [],
|
|
8
8
|
"author": "Riccardo Agnoletto",
|
|
9
9
|
"dependencies": {
|
|
10
|
-
"@fiscozen/style": "0.
|
|
10
|
+
"@fiscozen/style": "0.3.0"
|
|
11
11
|
},
|
|
12
12
|
"peerDependencies": {
|
|
13
13
|
"tailwindcss": "^3.4.1",
|
|
@@ -28,9 +28,9 @@
|
|
|
28
28
|
"vite": "^5.0.10",
|
|
29
29
|
"vitest": "^1.2.0",
|
|
30
30
|
"vue-tsc": "^1.8.25",
|
|
31
|
-
"@fiscozen/eslint-config": "^0.1.0",
|
|
32
31
|
"@fiscozen/tsconfig": "^0.1.0",
|
|
33
|
-
"@fiscozen/prettier-config": "^0.1.0"
|
|
32
|
+
"@fiscozen/prettier-config": "^0.1.0",
|
|
33
|
+
"@fiscozen/eslint-config": "^0.1.0"
|
|
34
34
|
},
|
|
35
35
|
"license": "ISC",
|
|
36
36
|
"scripts": {
|
|
@@ -0,0 +1,137 @@
|
|
|
1
|
+
import { describe, it, expect } from 'vitest'
|
|
2
|
+
import { truncateDecimals, format, parse, roundTo, clamp } from '../utils/number'
|
|
3
|
+
|
|
4
|
+
describe('number utilities', () => {
|
|
5
|
+
describe('truncateDecimals', () => {
|
|
6
|
+
it('truncates to the specified number of decimals', () => {
|
|
7
|
+
expect(truncateDecimals(1.2345, 2)).toBe(1.23)
|
|
8
|
+
expect(truncateDecimals(1.2345, 3)).toBe(1.234)
|
|
9
|
+
expect(truncateDecimals(1.2345, 0)).toBe(1)
|
|
10
|
+
})
|
|
11
|
+
|
|
12
|
+
it('preserves values that already have the correct number of decimals', () => {
|
|
13
|
+
expect(truncateDecimals(1.23, 2)).toBe(1.23)
|
|
14
|
+
expect(truncateDecimals(1.2, 2)).toBe(1.2)
|
|
15
|
+
expect(truncateDecimals(1, 2)).toBe(1)
|
|
16
|
+
})
|
|
17
|
+
|
|
18
|
+
it('truncates without rounding up', () => {
|
|
19
|
+
expect(truncateDecimals(1.999, 2)).toBe(1.99)
|
|
20
|
+
expect(truncateDecimals(1.996, 2)).toBe(1.99)
|
|
21
|
+
expect(truncateDecimals(1.005, 2)).toBe(1)
|
|
22
|
+
})
|
|
23
|
+
|
|
24
|
+
it('handles negative numbers', () => {
|
|
25
|
+
expect(truncateDecimals(-1.2345, 2)).toBe(-1.23)
|
|
26
|
+
expect(truncateDecimals(-1.999, 2)).toBe(-1.99)
|
|
27
|
+
expect(truncateDecimals(-40.3, 2)).toBe(-40.3)
|
|
28
|
+
})
|
|
29
|
+
|
|
30
|
+
it('handles zero', () => {
|
|
31
|
+
expect(truncateDecimals(0, 2)).toBe(0)
|
|
32
|
+
expect(truncateDecimals(0.0, 2)).toBe(0)
|
|
33
|
+
})
|
|
34
|
+
|
|
35
|
+
it('handles integers', () => {
|
|
36
|
+
expect(truncateDecimals(42, 2)).toBe(42)
|
|
37
|
+
expect(truncateDecimals(1000, 3)).toBe(1000)
|
|
38
|
+
})
|
|
39
|
+
|
|
40
|
+
describe('floating-point precision edge cases', () => {
|
|
41
|
+
it('correctly handles 40.3 (regression: was truncated to 40.29)', () => {
|
|
42
|
+
expect(truncateDecimals(40.3, 2)).toBe(40.3)
|
|
43
|
+
})
|
|
44
|
+
|
|
45
|
+
it('correctly handles 299.96 (regression: was truncated to 299.95)', () => {
|
|
46
|
+
expect(truncateDecimals(299.96, 2)).toBe(299.96)
|
|
47
|
+
})
|
|
48
|
+
|
|
49
|
+
it('correctly handles 40.2 (no drift)', () => {
|
|
50
|
+
expect(truncateDecimals(40.2, 2)).toBe(40.2)
|
|
51
|
+
})
|
|
52
|
+
|
|
53
|
+
it('correctly handles 40.4 (no drift)', () => {
|
|
54
|
+
expect(truncateDecimals(40.4, 2)).toBe(40.4)
|
|
55
|
+
})
|
|
56
|
+
|
|
57
|
+
it('correctly handles 0.1 + 0.2 (classic floating-point case)', () => {
|
|
58
|
+
expect(truncateDecimals(0.1 + 0.2, 2)).toBe(0.3)
|
|
59
|
+
})
|
|
60
|
+
|
|
61
|
+
it('correctly handles 1234567.89 (regression: was truncated to 1234567.88)', () => {
|
|
62
|
+
expect(truncateDecimals(1234567.89, 2)).toBe(1234567.89)
|
|
63
|
+
})
|
|
64
|
+
|
|
65
|
+
it.each([
|
|
66
|
+
[10.1, 10.1],
|
|
67
|
+
[10.2, 10.2],
|
|
68
|
+
[10.3, 10.3],
|
|
69
|
+
[10.6, 10.6],
|
|
70
|
+
[10.7, 10.7],
|
|
71
|
+
[20.3, 20.3],
|
|
72
|
+
[30.3, 30.3],
|
|
73
|
+
[50.6, 50.6],
|
|
74
|
+
[99.99, 99.99],
|
|
75
|
+
[100.01, 100.01],
|
|
76
|
+
[999.99, 999.99],
|
|
77
|
+
[1000.01, 1000.01],
|
|
78
|
+
[0.01, 0.01],
|
|
79
|
+
[0.10, 0.10],
|
|
80
|
+
[0.99, 0.99],
|
|
81
|
+
])('preserves %f as %f with 2 decimals', (input, expected) => {
|
|
82
|
+
expect(truncateDecimals(input, 2)).toBe(expected)
|
|
83
|
+
})
|
|
84
|
+
})
|
|
85
|
+
|
|
86
|
+
describe('large values (regression: toPrecision(12) dropped digits)', () => {
|
|
87
|
+
it.each([
|
|
88
|
+
[10000000000.01, 2, 10000000000.01],
|
|
89
|
+
[99999999999.99, 2, 99999999999.99],
|
|
90
|
+
[10000000000.99, 2, 10000000000.99],
|
|
91
|
+
[100000000000.01, 2, 100000000000.01],
|
|
92
|
+
])('preserves %f with %i decimals → %f', (input, decimals, expected) => {
|
|
93
|
+
expect(truncateDecimals(input, decimals)).toBe(expected)
|
|
94
|
+
})
|
|
95
|
+
|
|
96
|
+
it.each([
|
|
97
|
+
[100000000.0001, 4, 100000000.0001],
|
|
98
|
+
[999999999.9999, 4, 999999999.9999],
|
|
99
|
+
])('preserves %f with %i decimals → %f', (input, decimals, expected) => {
|
|
100
|
+
expect(truncateDecimals(input, decimals)).toBe(expected)
|
|
101
|
+
})
|
|
102
|
+
|
|
103
|
+
it.each([
|
|
104
|
+
[1000000.000001, 6, 1000000.000001],
|
|
105
|
+
[9999999.999999, 6, 9999999.999999],
|
|
106
|
+
])('preserves %f with %i decimals → %f', (input, decimals, expected) => {
|
|
107
|
+
expect(truncateDecimals(input, decimals)).toBe(expected)
|
|
108
|
+
})
|
|
109
|
+
})
|
|
110
|
+
})
|
|
111
|
+
|
|
112
|
+
describe('parse', () => {
|
|
113
|
+
it('parses Italian format (comma as decimal separator)', () => {
|
|
114
|
+
expect(parse('40,30')).toBe(40.3)
|
|
115
|
+
expect(parse('299,96')).toBe(299.96)
|
|
116
|
+
expect(parse('1.234,56')).toBe(1234.56)
|
|
117
|
+
})
|
|
118
|
+
|
|
119
|
+
it('parses plain numbers', () => {
|
|
120
|
+
expect(parse('42')).toBe(42)
|
|
121
|
+
expect(parse('1234.56')).toBe(1234.56)
|
|
122
|
+
})
|
|
123
|
+
|
|
124
|
+
it('returns NaN for invalid input', () => {
|
|
125
|
+
expect(parse('')).toBeNaN()
|
|
126
|
+
expect(parse('abc')).toBeNaN()
|
|
127
|
+
})
|
|
128
|
+
})
|
|
129
|
+
|
|
130
|
+
describe('clamp', () => {
|
|
131
|
+
it('clamps value within range', () => {
|
|
132
|
+
expect(clamp(0, 5, 10)).toBe(5)
|
|
133
|
+
expect(clamp(0, -1, 10)).toBe(0)
|
|
134
|
+
expect(clamp(0, 11, 10)).toBe(10)
|
|
135
|
+
})
|
|
136
|
+
})
|
|
137
|
+
})
|
|
@@ -1,13 +1,37 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Truncates a number to the specified maximum decimal places (without rounding)
|
|
3
3
|
*
|
|
4
|
+
* Uses `String(value)` — the shortest decimal that uniquely identifies the
|
|
5
|
+
* IEEE 754 double — then slices the string to `maxDecimals` places.
|
|
6
|
+
* This sidesteps both IEEE 754 drift (e.g. `40.3 * 100 → 4029.999…`) and the
|
|
7
|
+
* significant-digit ceiling that `toPrecision(n)` imposes on large products
|
|
8
|
+
* (e.g. `10 000 000 000.01 * 100` has 13 significant digits, which
|
|
9
|
+
* `toPrecision(12)` silently rounds away).
|
|
10
|
+
*
|
|
11
|
+
* For values where `String()` emits scientific notation (|value| >= 1e21 or
|
|
12
|
+
* < 1e-7), plain `Math.trunc(value * factor)` is used — drift is irrelevant
|
|
13
|
+
* at those magnitudes.
|
|
14
|
+
*
|
|
4
15
|
* @param value - Number to truncate
|
|
5
16
|
* @param maxDecimals - Maximum number of decimal places
|
|
6
17
|
* @returns Truncated number
|
|
7
18
|
*/
|
|
8
19
|
export const truncateDecimals = (value: number, maxDecimals: number): number => {
|
|
9
|
-
|
|
10
|
-
return Math.trunc(value
|
|
20
|
+
if (!isFinite(value) || maxDecimals < 0) return value;
|
|
21
|
+
if (maxDecimals === 0) return Math.trunc(value);
|
|
22
|
+
|
|
23
|
+
const str = String(value);
|
|
24
|
+
|
|
25
|
+
if (str.includes('e') || str.includes('E')) {
|
|
26
|
+
const factor = Math.pow(10, maxDecimals);
|
|
27
|
+
return Math.trunc(value * factor) / factor;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
const dotIndex = str.indexOf('.');
|
|
31
|
+
if (dotIndex === -1) return value;
|
|
32
|
+
if (str.length - dotIndex - 1 <= maxDecimals) return value;
|
|
33
|
+
|
|
34
|
+
return Number(str.slice(0, dotIndex + maxDecimals + 1));
|
|
11
35
|
};
|
|
12
36
|
|
|
13
37
|
/**
|