@fiscozen/composables 1.0.3 → 1.0.4

package/dist/composables.js

@@ -1,1460 +1,2165 @@
-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";
-const le = (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 n = Math.pow(10, t);
-    return Math.trunc(e * n) / n;
-  }
-  const l = o.indexOf(".");
-  return l === -1 || o.length - l - 1 <= t ? e : Number(o.slice(0, l + t + 1));
-}, ne = (e, {
-  minimumFractionDigits: t = 0,
-  maximumFractionDigits: o = 2,
-  roundDecimals: l = !0,
-  useGrouping: n = !0
-} = {}) => e == null || isNaN(e) || !isFinite(e) ? "" : (l ? e : le(e, o)).toLocaleString("it-IT", {
-  minimumFractionDigits: t,
-  maximumFractionDigits: o,
-  useGrouping: n
-}), re = (e) => {
-  if (!e || typeof e != "string")
-    return NaN;
-  let t = e.trim();
-  return t.includes(",") && (t = t.replace(/\./g, ""), t = t.replace(",", ".")), parseFloat(t);
-}, ze = (e, t) => {
-  let o = t;
-  const l = t % e, n = t >= 0 ? e : -e;
-  return l !== 0 && (o = Math.abs(l) >= e / 2 ? t + n - l : t - l), o;
-}, 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) => {
-  let r = n ? "bottom" : "right", p = n ? "bottom-start" : "right-start";
-  z.width = window.innerWidth, z.height = window.innerHeight, z.x = 0, z.y = 0;
-  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;
-  let s = [
-    {
-      key: "right",
-      space: x
-    },
-    {
-      key: "top",
-      space: c
-    },
-    {
-      key: "bottom",
-      space: i
-    },
-    {
-      key: "left",
-      space: h
-    }
-  ].sort((u, f) => f.space - u.space);
-  if (n && (s = s.filter((u) => u.key === "top" || u.key === "bottom")), r = s[0].key, !l) {
-    const u = (v.height - d.height) / 2;
-    switch (r) {
-      case "right":
-      case "left":
-        y.top > d.top - u && (l = "end"), y.bottom < d.top - u && (l = "start");
-        break;
-    }
-  }
-  return p = l ? `${r}-${l}` : r, p;
-}, ae = (e, t, o, l) => ({
-  x: t.x + e.width * o / 100,
-  y: t.y + e.height * l / 100
-}), F = (e) => typeof e == "string" ? document.querySelector(e) : e, ie = (e) => ({
-  left: parseFloat(e.marginLeft),
-  right: parseFloat(e.marginRight),
-  top: parseFloat(e.marginTop),
-  bottom: parseFloat(e.marginBottom)
-}), se = {
-  // Bottom positions - content below opener
-  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 positions - content above opener
-  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 positions - content to left of opener
-  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 positions - content to right of opener
-  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 }
-  })
-}, pe = (e, t, o) => {
-  const l = se[e];
-  return l ? l(t, o) : { position: { x: 0, y: 0 }, transform: { x: 0, y: 0 } };
-}, ue = {
-  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 }
-  })
-}, ce = (e, t, o) => {
-  const l = ue[e];
-  return l ? l(t, o) : { position: { x: 0, y: 0 }, transform: { x: 0, y: 0 } };
-}, fe = (e, t, o, l) => {
-  const n = { ...e }, r = { ...l };
-  if (e.x < o.left && (n.x = o.left, r.x = 0), e.x + t.width > o.right) {
-    const p = o.right - t.width;
-    p > 0 && (n.x = p), r.x = 0;
-  }
-  if (e.y < o.top && (n.y = o.top, r.y = 0), e.y + t.height > o.bottom) {
-    const p = o.bottom - t.height;
-    p > 0 && (n.y = p), r.y = 0;
-  }
-  return { position: n, transform: r };
-}, ye = (e, t, o, l, n) => {
-  const r = n ? 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";
-  }
-}, de = (e) => e.startsWith("auto"), ve = (e) => {
-  const t = g("auto"), o = g(), l = g(), n = g(), r = g(), p = Y({ position: { x: 0, y: 0 } }), y = {
-    root: null,
-    rootMargin: "0px",
-    threshold: 1,
-    ...e.element.value.intersectionOptions
-  }, v = g(new IntersectionObserver(() => {
-  }, y)), d = () => {
-    var u, f;
-    const c = F(e.element.value.domRef.value);
-    if (!c)
-      return null;
-    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;
-    return { element: c, container: i, opener: s };
-  }, h = (c) => {
-    var i;
-    return {
-      element: c.element.getBoundingClientRect(),
-      container: c.container.getBoundingClientRect(),
-      opener: ((i = c.opener) == null ? void 0 : i.getBoundingClientRect()) ?? null
-    };
-  }, x = (c = !1) => J(() => {
-    var O, R, L;
-    o.value = ((O = e.position) == null ? void 0 : O.value) ?? "auto";
-    const i = d();
-    if (!i) return;
-    Object.assign(i.element.style, {
-      position: "fixed",
-      top: "0px",
-      left: "0px"
-    });
-    const s = h(i);
-    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(
-      o.value,
-      i.container,
-      i.element,
-      i.opener,
-      ((R = e.useViewport) == null ? void 0 : R.value) ?? !1
-    ));
-    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(
-      s.element,
-      f.position,
-      f.transform.x,
-      f.transform.y
-    ), S = fe(
-      k,
-      s.element,
-      s.container,
-      f.transform
-    );
-    p.position.x = S.position.x, p.position.y = S.position.y, Object.assign(i.element.style, {
-      top: `${p.position.y}px`,
-      left: `${p.position.x}px`,
-      position: "fixed",
-      display: "flex"
-    }), l.value = i.element.getBoundingClientRect(), (L = e.callback) != null && L.value && !c && e.callback.value(l, n, r, t, o);
-  });
-  return Q(() => {
-    v.value.disconnect();
-  }), {
-    float: p,
-    rect: l,
-    setPosition: x,
-    position: t,
-    actualPosition: o,
-    openerRect: n,
-    containerRect: r
-  };
+import { Teleport as e, computed as t, createBlock as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, defineComponent as o, nextTick as s, normalizeClass as c, onBeforeUnmount as l, onMounted as u, onUnmounted as d, openBlock as f, reactive as p, ref as m, renderSlot as h, toRef as g, toRefs as _, unref as v, useSlots as y, vShow as b, watch as x, withDirectives as S } from "vue";
+//#region src/utils/number/index.ts
+var C = (e, t) => {
+	if (!isFinite(e) || t < 0) return e;
+	if (t === 0) return Math.trunc(e);
+	let n = String(e);
+	if (n.includes("e") || n.includes("E")) {
+		let n = 10 ** t;
+		return Math.trunc(e * n) / n;
+	}
+	let r = n.indexOf(".");
+	return r === -1 || n.length - r - 1 <= t ? e : Number(n.slice(0, r + t + 1));
+}, w = (e, { minimumFractionDigits: t = 0, maximumFractionDigits: n = 2, roundDecimals: r = !0, useGrouping: i = !0 } = {}) => e == null || isNaN(e) || !isFinite(e) ? "" : (r ? e : C(e, n)).toLocaleString("it-IT", {
+	minimumFractionDigits: t,
+	maximumFractionDigits: n,
+	useGrouping: i
+}), T = (e) => {
+	if (!e || typeof e != "string") return NaN;
+	let t = e.trim();
+	return t.includes(",") && (t = t.replace(/\./g, ""), t = t.replace(",", ".")), parseFloat(t);
+}, E = (e, t) => {
+	let n = t, r = t % e, i = t >= 0 ? e : -e;
+	return r !== 0 && (n = Math.abs(r) >= e / 2 ? t + i - r : t - r), n;
+}, D = (e, t, n) => Math.max(e, Math.min(t, n)), O = new DOMRect(0, 0, window.innerWidth, window.innerHeight), k = (e, t, n, r, i) => {
+	let a = i ? "bottom" : "right", o = i ? "bottom-start" : "right-start";
+	O.width = window.innerWidth, O.height = window.innerHeight, O.x = 0, O.y = 0;
+	let s = e ? e.getBoundingClientRect() : O, c = t.getBoundingClientRect(), l = n.getBoundingClientRect(), u = (l.left - s.left - c.width) / s.width, d = (s.right - l.right - c.width) / s.width, f = (l.top - s.top - c.height) / s.height, p = (s.bottom - l.bottom - c.height) / s.height, m = [
+		{
+			key: "right",
+			space: d
+		},
+		{
+			key: "top",
+			space: f
+		},
+		{
+			key: "bottom",
+			space: p
+		},
+		{
+			key: "left",
+			space: u
+		}
+	].sort((e, t) => t.space - e.space);
+	if (i && (m = m.filter((e) => e.key === "top" || e.key === "bottom")), a = m[0].key, !r) {
+		let e = (c.height - l.height) / 2;
+		switch (a) {
+			case "right":
+			case "left":
+				s.top > l.top - e && (r = "end"), s.bottom < l.top - e && (r = "start");
+				break;
+			default: break;
+		}
+	}
+	return o = r ? `${a}-${r}` : a, o;
+}, A = (e, t, n, r) => ({
+	x: t.x + e.width * n / 100,
+	y: t.y + e.height * r / 100
+}), j = (e) => typeof e == "string" ? document.querySelector(e) : e, M = (e) => ({
+	left: parseFloat(e.marginLeft),
+	right: parseFloat(e.marginRight),
+	top: parseFloat(e.marginTop),
+	bottom: parseFloat(e.marginBottom)
+}), N = (e) => e !== null && (e.width > 0 || e.height > 0), P = {
+	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
+		}
+	})
+}, F = (e, t, n) => {
+	let r = P[e];
+	return r ? r(t, n) : {
+		position: {
+			x: 0,
+			y: 0
+		},
+		transform: {
+			x: 0,
+			y: 0
+		}
+	};
+}, I = {
+	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
+		}
+	})
+}, L = (e, t, n) => {
+	let r = I[e];
+	return r ? r(t, n) : {
+		position: {
+			x: 0,
+			y: 0
+		},
+		transform: {
+			x: 0,
+			y: 0
+		}
+	};
+}, R = (e, t, n, r) => {
+	let i = { ...e }, a = { ...r };
+	if (e.x < n.left && (i.x = n.left, a.x = 0), e.x + t.width > n.right) {
+		let e = n.right - t.width;
+		e > 0 && (i.x = e), a.x = 0;
+	}
+	if (e.y < n.top && (i.y = n.top, a.y = 0), e.y + t.height > n.bottom) {
+		let e = n.bottom - t.height;
+		e > 0 && (i.y = e), a.y = 0;
+	}
+	return {
+		position: i,
+		transform: a
+	};
+}, z = (e, t, n, r, i) => {
+	let a = i ? null : t;
+	switch (e) {
+		case "auto": return k(a, n, r);
+		case "auto-vertical": return k(a, n, r, void 0, !0);
+		case "auto-start": return k(a, n, r, "start");
+		case "auto-vertical-start": return k(a, n, r, "start", !0);
+		case "auto-end": return k(a, n, r, "end");
+		case "auto-vertical-end": return k(a, n, r, "end", !0);
+		default: return "bottom-start";
+	}
+}, B = (e) => e.startsWith("auto"), V = (e) => {
+	let t = m("auto"), n = m(), r = m(), i = m(), a = m(), o = p({ position: {
+		x: 0,
+		y: 0
+	} }), c = {
+		root: null,
+		rootMargin: "0px",
+		threshold: 1,
+		...e.element.value.intersectionOptions
+	}, l = m(new IntersectionObserver(() => {}, c)), u = () => {
+		let t = j(e.element.value.domRef.value);
+		return t ? {
+			element: t,
+			container: e.container?.value ? j(e.container.value.domRef.value) ?? document.body : document.body,
+			opener: e.opener?.value ? j(e.opener.value.domRef.value) : null
+		} : null;
+	}, f = (e) => ({
+		element: e.element.getBoundingClientRect(),
+		container: e.container.getBoundingClientRect(),
+		opener: e.opener?.getBoundingClientRect() ?? null
+	});
+	return d(() => {
+		l.value.disconnect();
+	}), {
+		float: o,
+		rect: r,
+		setPosition: (c = !1) => s(() => {
+			n.value = e.position?.value ?? "auto";
+			let s = u();
+			if (!s) return;
+			Object.assign(s.element.style, {
+				position: "fixed",
+				top: "0px",
+				left: "0px"
+			});
+			let d = f(s);
+			if (r.value = d.element, i.value = d.opener ?? void 0, a.value = d.container, s.opener && !N(d.opener)) {
+				s.element.style.display = "none";
+				return;
+			}
+			l.value.observe(s.element), l.value.observe(s.container), B(n.value) && s.opener && (n.value = z(n.value, s.container, s.element, s.opener, e.useViewport?.value ?? !1));
+			let p = M(window.getComputedStyle(s.element)), m = s.opener && d.opener ? F(n.value, d.opener, p) : L(n.value, d.container, d.element), h = R(A(d.element, m.position, m.transform.x, m.transform.y), d.element, d.container, m.transform);
+			o.position.x = h.position.x, o.position.y = h.position.y, Object.assign(s.element.style, {
+				top: `${o.position.y}px`,
+				left: `${o.position.x}px`,
+				position: "fixed",
+				display: "flex"
+			}), r.value = s.element.getBoundingClientRect(), e.callback?.value && !c && e.callback.value(r, i, a, t, n);
+		}),
+		position: t,
+		actualPosition: n,
+		openerRect: i,
+		containerRect: a
+	};
 };
-function N(e) {
-  const t = window.matchMedia(e), o = g(t.matches);
-  function l(n) {
-    o.value = n.matches;
-  }
-  return E(() => {
-    t.addEventListener("change", l);
-  }), Q(() => {
-    t.removeEventListener("change", l);
-  }), W(() => o.value);
+//#endregion
+//#region src/composables/useMediaQuery.ts
+function H(e) {
+	let n = window.matchMedia(e), r = m(n.matches);
+	function i(e) {
+		r.value = e.matches;
+	}
+	return u(() => {
+		n.addEventListener("change", i);
+	}), d(() => {
+		n.removeEventListener("change", i);
+	}), t(() => r.value);
 }
-function ke(e) {
-  return {
-    isGreater(t) {
-      return N(`(min-width: ${e[t]})`);
-    },
-    isSmaller(t) {
-      return N(`(max-width: ${e[t]})`);
-    },
-    isInBetween(t, o) {
-      return N(`(min-width: ${e[t]}) and (max-width: ${e[o]})`);
-    }
-  };
+//#endregion
+//#region src/composables/useBreakpoints.ts
+function U(e) {
+	return {
+		isGreater(t) {
+			return H(`(min-width: ${e[t]})`);
+		},
+		isSmaller(t) {
+			return H(`(max-width: ${e[t]})`);
+		},
+		isInBetween(t, n) {
+			return H(`(min-width: ${e[t]}) and (max-width: ${e[n]})`);
+		}
+	};
 }
-function Oe(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 = (n) => {
-    !e.value || n.target === e.value || n.composedPath().includes(e.value) || typeof t == "function" && t();
-  };
-  o && B(o, (n, r) => {
-    r && r.removeEventListener("click", l), n == null || n.addEventListener("click", l);
-  }), E(() => {
-    o || document.addEventListener("click", l);
-  }), $(() => {
-    var n;
-    if (o) {
-      (n = o.value) == null || n.removeEventListener("click", l);
-      return;
-    }
-    document.removeEventListener("click", l);
-  });
+//#endregion
+//#region src/composables/useClickOutside.ts
+function W(e, t, n) {
+	if (!e) throw Error("A target component has to be provided.");
+	if (!t) throw Error("A callback has to be provided.");
+	let r = (n) => {
+		!e.value || n.target === e.value || n.composedPath().includes(e.value) || typeof t == "function" && t();
+	};
+	n && x(n, (e, t) => {
+		t && t.removeEventListener("click", r), e?.addEventListener("click", r);
+	}), u(() => {
+		n || document.addEventListener("click", r);
+	}), l(() => {
+		if (n) {
+			n.value?.removeEventListener("click", r);
+			return;
+		}
+		document.removeEventListener("click", r);
+	});
 }
-function Le(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);
-  };
-  E(() => {
-    e.value.addEventListener("keydown", o);
-  }), $(() => {
-    e.value.removeEventListener("keydown", o);
-  });
+//#endregion
+//#region src/composables/useKeyDown.ts
+function G(e, t) {
+	if (!e) throw Error("A target component has to be provided.");
+	if (!t || typeof t != "function") throw Error("A callback has to be provided.");
+	let n = (e) => {
+		t(e);
+	};
+	u(() => {
+		e.value.addEventListener("keydown", n);
+	}), l(() => {
+		e.value.removeEventListener("keydown", n);
+	});
 }
-function Be(e, t) {
-  if (!e || typeof e != "function")
-    throw new Error("A callback has to be provided.");
-  const o = (l) => {
-    e(l);
-  };
-  E(() => {
-    if (!t) {
-      document.addEventListener("keyup", o);
-      return;
-    }
-    t.value.addEventListener("keyup", o);
-  }), $(() => {
-    if (!t) {
-      document.removeEventListener("keyup", o);
-      return;
-    }
-    t.value.removeEventListener("keyup", o);
-  });
+//#endregion
+//#region src/composables/useKeyUp.ts
+function K(e, t) {
+	if (!e || typeof e != "function") throw Error("A callback has to be provided.");
+	let n = (t) => {
+		e(t);
+	};
+	u(() => {
+		if (!t) {
+			document.addEventListener("keyup", n);
+			return;
+		}
+		t.value.addEventListener("keyup", n);
+	}), l(() => {
+		if (!t) {
+			document.removeEventListener("keyup", n);
+			return;
+		}
+		t.value.removeEventListener("keyup", n);
+	});
 }
-const Ne = (e) => ({
-  format: ne,
-  parse: re
-}), xe = {
-  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"
-    }
-  }
-}, H = {
-  global: xe
-}, he = [
-  "blue",
-  "purple",
-  "orange",
-  "pink",
-  "yellow",
-  "grey",
-  "core"
-], ge = {
-  safeColorNames: he
-}, me = [
-  "error",
-  "warning",
-  "success",
-  "info"
-], be = {
-  semanticColorNames: me
-}, we = ge.safeColorNames, Se = be.semanticColorNames, w = {};
-we.forEach((e) => {
-  const t = H.global[e];
-  t && Object.keys(t).forEach((o) => {
-    var n;
-    const l = (n = t[o]) == null ? void 0 : n.value;
-    l && (w[e] || (w[e] = {}), w[e][o] = l);
-  });
+//#endregion
+//#region src/composables/useCurrency.ts
+var q = (e) => ({
+	format: w,
+	parse: T
+}), J = {
+	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"
+			}
+		}
+	},
+	alias: {
+		avatar: {
+			initials: {
+				"background-color": {
+					value: "{core.black}",
+					type: "color"
+				},
+				color: {
+					value: "{core.white}",
+					type: "color"
+				},
+				spacing: {
+					value: "{spacing.32}",
+					type: "spacing"
+				},
+				"border-radius": {
+					value: "{rounded.full}",
+					type: "borderRadius"
+				},
+				"font-family": {
+					value: "{font-sans.inter}",
+					type: "fontFamilies"
+				},
+				"font-weight": {
+					value: "{font.normal}",
+					type: "fontWeights"
+				},
+				"font-size": {
+					value: "{text.sm}",
+					type: "fontSizes"
+				},
+				"line-height": {
+					value: "{leading.sm}",
+					type: "lineHeights"
+				}
+			},
+			image: {
+				"border-radius": {
+					value: "{rounded.full}",
+					type: "borderRadius"
+				},
+				sm: {
+					value: "{spacing.16}",
+					type: "spacing"
+				},
+				md: {
+					value: "{spacing.24}",
+					type: "spacing"
+				},
+				lg: {
+					value: "{spacing.32}",
+					type: "spacing"
+				},
+				xl: {
+					value: "{spacing.40}",
+					type: "spacing"
+				}
+			}
+		},
+		"nav-link": {
+			spacing: {
+				value: "{spacing.32}",
+				type: "spacing"
+			},
+			"border-radius": {
+				value: "{rounded.base}",
+				type: "borderRadius"
+			},
+			"font-family": {
+				value: "{font-sans.inter}",
+				type: "fontFamilies"
+			},
+			"font-weight": {
+				value: "{font.medium}",
+				type: "fontWeights"
+			},
+			"line-height": {
+				value: "{leading.sm}",
+				type: "lineHeights"
+			},
+			"font-size": {
+				value: "{text.sm}",
+				type: "fontSizes"
+			},
+			"background-color": {
+				default: {
+					value: "none",
+					type: "color"
+				},
+				hover: {
+					value: "{background.alice-blue}",
+					type: "color"
+				},
+				pressed: {
+					value: "{background.alice-blue}",
+					type: "color"
+				},
+				focus: {
+					value: "{background.alice-blue}",
+					type: "color"
+				},
+				disabled: {
+					value: "none",
+					type: "color"
+				}
+			},
+			color: {
+				default: {
+					value: "{grey.500}",
+					type: "color"
+				},
+				hover: {
+					value: "{blue.500}",
+					type: "color"
+				},
+				pressed: {
+					value: "{blue.500}",
+					type: "color"
+				},
+				focus: {
+					value: "{blue.500}",
+					type: "color"
+				},
+				disabled: {
+					value: "{grey.100}",
+					type: "color"
+				}
+			},
+			border: {
+				default: {
+					value: "none",
+					type: "color"
+				},
+				hover: {
+					value: "none",
+					type: "color"
+				},
+				pressed: {
+					value: "none",
+					type: "color"
+				},
+				focus: {
+					value: "{blue.500}",
+					type: "color"
+				},
+				disabled: {
+					value: "none",
+					type: "color"
+				}
+			},
+			"border-width": {
+				default: {
+					value: "none",
+					type: "borderWidth"
+				},
+				hover: {
+					value: "none",
+					type: "borderWidth"
+				},
+				pressed: {
+					value: "none",
+					type: "borderWidth"
+				},
+				focus: {
+					value: "{border.1}",
+					type: "borderWidth"
+				},
+				disabled: {
+					value: "none",
+					type: "borderWidth"
+				}
+			},
+			"box-shadow": {
+				default: {
+					value: "{shadow.none}",
+					type: "boxShadow"
+				},
+				hover: {
+					value: "{shadow.none}",
+					type: "boxShadow"
+				},
+				pressed: {
+					value: "{shadow.inner}",
+					type: "boxShadow"
+				},
+				focus: {
+					value: "none",
+					type: "boxShadow"
+				},
+				disabled: {
+					value: "none",
+					type: "boxShadow"
+				}
+			}
+		},
+		"icon-button": {
+			button: {
+				sm: {
+					value: "{spacing.28}",
+					type: "spacing"
+				},
+				md: {
+					value: "{spacing.32}",
+					type: "spacing"
+				},
+				lg: {
+					value: "{spacing.40}",
+					type: "spacing"
+				}
+			},
+			icon: {
+				sm: {
+					value: "{spacing.16}",
+					type: "spacing"
+				},
+				md: {
+					value: "{spacing.20}",
+					type: "spacing"
+				}
+			},
+			primary: {
+				"background-color": {
+					default: {
+						value: "{blue.500}",
+						type: "color"
+					},
+					hover: {
+						value: "{blue.600}",
+						type: "color"
+					},
+					pressed: {
+						value: "{blue.600}",
+						type: "color"
+					},
+					focus: {
+						value: "{blue.500}",
+						type: "color"
+					},
+					disabled: {
+						value: "{blue.200}",
+						type: "color"
+					}
+				},
+				color: {
+					default: {
+						value: "{core.white}",
+						type: "color"
+					},
+					hover: {
+						value: "{core.white}",
+						type: "color"
+					},
+					pressed: {
+						value: "{core.white}",
+						type: "color"
+					},
+					focus: {
+						value: "{core.white}",
+						type: "color"
+					},
+					disabled: {
+						value: "{core.white}",
+						type: "color"
+					}
+				},
+				border: {
+					default: {
+						value: "none",
+						type: "color"
+					},
+					hover: {
+						value: "none",
+						type: "color"
+					},
+					pressed: {
+						value: "none",
+						type: "color"
+					},
+					focus: {
+						value: "{blue.600}",
+						type: "color"
+					},
+					disabled: {
+						value: "none",
+						type: "color"
+					}
+				},
+				"border-width": {
+					default: {
+						value: "none",
+						type: "borderWidth"
+					},
+					hover: {
+						value: "none",
+						type: "borderWidth"
+					},
+					pressed: {
+						value: "none",
+						type: "borderWidth"
+					},
+					focus: {
+						value: "{border.1}",
+						type: "borderWidth"
+					},
+					disabled: {
+						value: "none",
+						type: "borderWidth"
+					}
+				}
+			},
+			secondary: {
+				"background-color": {
+					default: {
+						value: "none",
+						type: "color"
+					},
+					hover: {
+						value: "{grey.100}",
+						type: "color"
+					},
+					pressed: {
+						value: "{grey.100}",
+						type: "color"
+					},
+					focus: {
+						value: "none",
+						type: "color"
+					},
+					disabled: {
+						value: "none",
+						type: "color"
+					}
+				},
+				color: {
+					default: {
+						value: "{grey.500}",
+						type: "color"
+					},
+					hover: {
+						value: "{grey.500}",
+						type: "color"
+					},
+					pressed: {
+						value: "{grey.500}",
+						type: "color"
+					},
+					focus: {
+						value: "{grey.500}",
+						type: "color"
+					},
+					disabled: {
+						value: "{grey.100}",
+						type: "color"
+					}
+				},
+				border: {
+					default: {
+						value: "{grey.200}",
+						type: "color"
+					},
+					hover: {
+						value: "{grey.200}",
+						type: "color"
+					},
+					pressed: {
+						value: "{grey.200}",
+						type: "color"
+					},
+					focus: {
+						value: "{blue.600}",
+						type: "color"
+					},
+					disabled: {
+						value: "{grey.100}",
+						type: "color"
+					}
+				},
+				"border-width": {
+					value: "{border.1}",
+					type: "borderWidth"
+				}
+			},
+			notification: {
+				"background-color": {
+					default: {
+						value: "none",
+						type: "color"
+					},
+					hover: {
+						value: "{grey.100}",
+						type: "color"
+					},
+					pressed: {
+						value: "{grey.100}",
+						type: "color"
+					}
+				},
+				color: {
+					default: {
+						value: "{grey.500}",
+						type: "color"
+					},
+					hover: {
+						value: "{grey.500}",
+						type: "color"
+					},
+					pressed: {
+						value: "{grey.500}",
+						type: "color"
+					},
+					focus: {
+						value: "{grey.500}",
+						type: "color"
+					},
+					disabled: {
+						value: "{grey.100}",
+						type: "color"
+					}
+				},
+				border: {
+					default: {
+						value: "{grey.200}",
+						type: "color"
+					},
+					hover: {
+						value: "{grey.200}",
+						type: "color"
+					},
+					pressed: {
+						value: "{grey.200}",
+						type: "color"
+					},
+					focus: {
+						value: "{grey.200}",
+						type: "color"
+					},
+					disabled: {
+						value: "{grey.100}",
+						type: "color"
+					}
+				},
+				"border-width": {
+					value: "{border.1}",
+					type: "borderWidth"
+				}
+			},
+			"notification-badge": {
+				"background-color": {
+					default: {
+						value: "{blue.500}",
+						type: "color"
+					},
+					hover: {
+						value: "{blue.500}",
+						type: "color"
+					},
+					pressed: {
+						value: "{blue.500}",
+						type: "color"
+					},
+					focus: {
+						value: "{blue.500}",
+						type: "color"
+					},
+					disabled: {
+						value: "{grey.200}",
+						type: "color"
+					}
+				},
+				border: {
+					default: {
+						value: "{core.white}",
+						type: "color"
+					},
+					hover: {
+						value: "{core.white}",
+						type: "color"
+					},
+					pressed: {
+						value: "{core.white}",
+						type: "color"
+					},
+					focus: {
+						value: "{core.white}",
+						type: "color"
+					},
+					disabled: {
+						value: "{core.white}",
+						type: "color"
+					}
+				},
+				sm: {
+					value: "{spacing.6}",
+					type: "spacing"
+				},
+				md: {
+					value: "{spacing.8}",
+					type: "spacing"
+				},
+				lg: {
+					value: "{spacing.10}",
+					type: "spacing"
+				},
+				"border-width": {
+					value: "{border.1}",
+					type: "borderWidth"
+				}
+			},
+			invisible: {
+				"background-color": {
+					default: {
+						value: "none",
+						type: "color"
+					},
+					hover: {
+						value: "{grey.100}",
+						type: "color"
+					},
+					pressed: {
+						value: "{grey.100}",
+						type: "color"
+					},
+					focus: {
+						value: "none",
+						type: "color"
+					},
+					disabled: {
+						value: "none",
+						type: "color"
+					}
+				},
+				color: {
+					default: {
+						value: "{grey.500}",
+						type: "color"
+					},
+					hover: {
+						value: "{grey.500}",
+						type: "color"
+					},
+					pressed: {
+						value: "{grey.500}",
+						type: "color"
+					},
+					focus: {
+						value: "{grey.500}",
+						type: "color"
+					},
+					disabled: {
+						value: "{grey.100}",
+						type: "color"
+					}
+				},
+				border: {
+					default: {
+						value: "none",
+						type: "color"
+					},
+					hover: {
+						value: "none",
+						type: "color"
+					},
+					pressed: {
+						value: "none",
+						type: "color"
+					},
+					focus: {
+						value: "{blue.600}",
+						type: "color"
+					},
+					disabled: {
+						value: "{grey.100}",
+						type: "color"
+					}
+				},
+				"border-width": {
+					default: {
+						value: "none",
+						type: "borderWidth"
+					},
+					hover: {
+						value: "none",
+						type: "borderWidth"
+					},
+					pressed: {
+						value: "none",
+						type: "borderWidth"
+					},
+					focus: {
+						value: "{border.1}",
+						type: "borderWidth"
+					},
+					disabled: {
+						value: "{border.1}",
+						type: "borderWidth"
+					}
+				}
+			},
+			"border-radius": {
+				value: "{rounded.base}",
+				type: "borderRadius"
+			},
+			"box-shadow": {
+				default: {
+					value: "{shadow.none}",
+					type: "boxShadow"
+				},
+				hover: {
+					value: "{shadow.none}",
+					type: "boxShadow"
+				},
+				pressed: {
+					value: "{shadow.inner}",
+					type: "boxShadow"
+				},
+				focus: {
+					value: "none",
+					type: "boxShadow"
+				},
+				disabled: {
+					value: "none",
+					type: "boxShadow"
+				}
+			}
+		},
+		breadcrumbs: {
+			color: {
+				"previous-page": {
+					value: "{blue.500}",
+					type: "color"
+				},
+				divider: {
+					value: "{grey.300}",
+					type: "color"
+				},
+				"current-page": {
+					value: "{grey.500}",
+					type: "color"
+				}
+			},
+			"font-family": {
+				value: "{font-sans.inter}",
+				type: "fontFamilies"
+			},
+			"font-weight": {
+				value: "{font.normal}",
+				type: "fontWeights"
+			},
+			"line-height": {
+				value: "{leading.sm}",
+				type: "lineHeights"
+			},
+			"font-size": {
+				value: "{text.sm}",
+				type: "fontSizes"
+			}
+		},
+		"main-content": {
+			sm: {
+				value: "{spacing.32}",
+				type: "spacing"
+			},
+			base: {
+				value: "{spacing.48}",
+				type: "spacing"
+			},
+			lg: {
+				value: "{spacing.64}",
+				type: "spacing"
+			}
+		},
+		"section-content": {
+			none: {
+				value: "{spacing.0}",
+				type: "spacing"
+			},
+			xs: {
+				value: "{spacing.8}",
+				type: "spacing"
+			},
+			sm: {
+				value: "{spacing.16}",
+				type: "spacing"
+			},
+			base: {
+				value: "{spacing.24}",
+				type: "spacing"
+			},
+			lg: {
+				value: "{spacing.32}",
+				type: "spacing"
+			}
+		}
+	},
+	$themes: [],
+	$metadata: { tokenSetOrder: ["global", "alias"] }
+}, Y = {
+	$schema: "http://json-schema.org/draft-07/schema#",
+	description: "Lista dei colori da includere nella safelist di Tailwind. Per aggiungere un nuovo colore, aggiungi il suo nome qui e rigenera il build con 'pnpm run build'.",
+	safeColorNames: [
+		"blue",
+		"purple",
+		"orange",
+		"pink",
+		"yellow",
+		"grey",
+		"core"
+	]
+}, X = {
+	$schema: "http://json-schema.org/draft-07/schema#",
+	description: "Lista dei colori semantici da includere nella safelist di Tailwind. Per aggiungere un nuovo colore semantico, aggiungi il suo nome qui e rigenera il build con 'pnpm run build'.",
+	semanticColorNames: [
+		"error",
+		"warning",
+		"success",
+		"info"
+	]
+}, Z = Y.safeColorNames, ee = X.semanticColorNames, Q = {};
+Z.forEach((e) => {
+	let t = J.global[e];
+	t && Object.keys(t).forEach((n) => {
+		let r = t[n]?.value;
+		r && (Q[e] || (Q[e] = {}), Q[e][n] = r);
+	});
 });
-const K = H.global.semantic;
-K && Se.forEach((e) => {
-  const t = K[e];
-  t && typeof t == "object" && Object.keys(t).forEach((o) => {
-    var n;
-    const l = (n = t[o]) == null ? void 0 : n.value;
-    if (l) {
-      const r = `semantic-${e}`;
-      w[r] || (w[r] = {}), w[r][o] = l;
-    }
-  });
+var $ = J.global.semantic;
+$ && ee.forEach((e) => {
+	let t = $[e];
+	t && typeof t == "object" && Object.keys(t).forEach((n) => {
+		let r = t[n]?.value;
+		if (r) {
+			let t = `semantic-${e}`;
+			Q[t] || (Q[t] = {}), Q[t][n] = r;
+		}
+	});
 });
-const Re = Object.entries(H.global.breakpoint).reduce(
-  (e, [t, o]) => (e[t] = o.value, e),
-  {}
-), $e = /* @__PURE__ */ Z({
-  __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, n = o, r = g(null), p = g(null), y = _(), v = N(`(max-width: ${Re.xs})`);
-    let d = !1, h = !1, x = null, c = null;
-    const i = {
-      position: l.position,
-      element: {
-        // @ts-ignore
-        domRef: r
-      },
-      container: {
-        // @ts-ignore
-        domRef: j(l.container || document.body)
-      },
-      opener: {
-        domRef: j(null)
-      },
-      useViewport: l.useViewport,
-      callback(...a) {
-        n("fzfloating:setPosition", ...a);
-      }
-    }, s = ee(i);
-    y.opener && (i.opener = {
-      // @ts-ignore
-      domRef: p
-    });
-    const u = ve(s), f = () => {
-      d || !h || (d = !0, requestAnimationFrame(() => {
-        h && l.isOpen && u.setPosition(), d = !1;
-      }));
-    };
-    E(() => {
-      h = !0;
-    });
-    const k = () => {
-      f();
-    }, S = () => {
-      f();
-    }, O = () => {
-      window.addEventListener("scroll", k, !0), window.addEventListener("resize", S), r.value && !x && (x = new ResizeObserver(() => {
-        f();
-      }), x.observe(r.value)), p.value && !c && (c = new ResizeObserver(() => {
-        f();
-      }), c.observe(p.value));
-    }, R = () => {
-      window.removeEventListener("scroll", k, !0), window.removeEventListener("resize", S), x && (x.disconnect(), x = null), c && (c.disconnect(), c = null);
-    };
-    B(
-      () => l.position,
-      () => f()
-    ), B(
-      () => l.isOpen,
-      (a) => {
-        var I;
-        if (!a || !r.value || !h) {
-          R();
-          return;
-        }
-        O();
-        const m = (I = p.value) == null ? void 0 : I.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 = v.value ? (m == null ? void 0 : m.width) + "px" : "auto", u.setPosition();
-      }
-    ), B(
-      () => l.overrideOpener,
-      (a) => {
-        a && s.opener && s.opener.value && (s.opener.value = {
-          domRef: a
-        });
-      }
-    ), $(() => {
-      h = !1, R();
-    });
-    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(() => {
-      var m;
-      const a = ((m = u.actualPosition) == null ? void 0 : m.value) ?? l.position;
-      return L(a);
-    }), A = W(() => l.overrideContentClass ? l.contentClass : ["bg-core-white fixed", X.value, l.contentClass]);
-    return t({
-      setPosition: u.setPosition
-    }), (a, m) => (M(), V("div", null, [
-      C(a.$slots, "opener-start"),
-      D("div", {
-        ref_key: "opener",
-        ref: p,
-        class: "inline-flex w-full sm:w-auto"
-      }, [
-        C(a.$slots, "opener", {
-          isOpen: e.isOpen,
-          floating: P(u)
-        })
-      ], 512),
-      C(a.$slots, "opener-end"),
-      e.teleport ? U("", !0) : T((M(), V("div", {
-        key: 0,
-        ref_key: "content",
-        ref: r,
-        class: q(["fz__floating__content w-full sm:w-auto", A.value])
-      }, [
-        C(a.$slots, "default", {
-          isOpen: e.isOpen,
-          floating: P(u)
-        })
-      ], 2)), [
-        [G, a.$slots.default && (!a.$slots.opener || a.$slots.opener && e.isOpen)]
-      ]),
-      e.teleport ? (M(), te(oe, {
-        key: 1,
-        to: "body"
-      }, [
-        T(D("div", {
-          ref_key: "content",
-          ref: r,
-          class: q(["fz__floating__content", A.value])
-        }, [
-          C(a.$slots, "default", {
-            isOpen: e.isOpen,
-            floating: P(u)
-          })
-        ], 2), [
-          [G, a.$slots.default && (!a.$slots.opener || a.$slots.opener && e.isOpen)]
-        ])
-      ])) : U("", !0)
-    ]));
-  }
+//#endregion
+//#region ../style/src/constants.ts
+var te = Object.entries(J.global.breakpoint).reduce((e, [t, n]) => (e[t] = n.value, e), {}), ne = /* @__PURE__ */ o({
+	__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(o, { expose: s, emit: d }) {
+		let p = o, C = d, w = m(null), T = m(null), E = y(), D = H(`(max-width: ${te.xs})`), O = !1, k = !1, A = null, j = null, M = {
+			position: p.position,
+			element: { domRef: w },
+			container: { domRef: g(p.container || document.body) },
+			opener: { domRef: g(null) },
+			useViewport: p.useViewport,
+			callback(...e) {
+				C("fzfloating:setPosition", ...e);
+			}
+		}, N = _(M);
+		E.opener && (M.opener = { domRef: T });
+		let P = V(N), F = () => {
+			O || !k || (O = !0, requestAnimationFrame(() => {
+				k && p.isOpen && P.setPosition(), O = !1;
+			}));
+		};
+		u(() => {
+			k = !0;
+		});
+		let I = () => {
+			F();
+		}, L = () => {
+			F();
+		}, R = () => {
+			window.addEventListener("scroll", I, !0), window.addEventListener("resize", L), w.value && !A && (A = new ResizeObserver(() => {
+				F();
+			}), A.observe(w.value)), T.value && !j && (j = new ResizeObserver(() => {
+				F();
+			}), j.observe(T.value));
+		}, z = () => {
+			window.removeEventListener("scroll", I, !0), window.removeEventListener("resize", L), A &&= (A.disconnect(), null), j &&= (j.disconnect(), null);
+		};
+		x(() => p.position, () => F()), x(() => p.isOpen, (e) => {
+			if (!e || !w.value || !k) {
+				z();
+				return;
+			}
+			R();
+			let t = T.value?.getBoundingClientRect();
+			w.value.style.position = "fixed", w.value.style.top = "0px", w.value.style.left = "0px", w.value.style.transform = "none", w.value.style.width = D.value ? t?.width + "px" : "auto", P.setPosition();
+		}), x(() => p.overrideOpener, (e) => {
+			e && N.opener && N.opener.value && (N.opener.value = { domRef: e });
+		}), l(() => {
+			k = !1, z();
+		});
+		let B = (e) => e.startsWith("bottom") ? "mt-4" : e.startsWith("top") ? "mb-4" : e.startsWith("left") ? "mr-4" : e.startsWith("right") ? "ml-4" : "mt-4", U = t(() => B(P.actualPosition?.value ?? p.position)), W = t(() => p.overrideContentClass ? p.contentClass : [
+			"bg-core-white fixed",
+			U.value,
+			p.contentClass
+		]);
+		return s({ setPosition: P.setPosition }), (t, s) => (f(), i("div", null, [
+			h(t.$slots, "opener-start"),
+			a("div", {
+				ref_key: "opener",
+				ref: T,
+				class: "inline-flex w-full sm:w-auto"
+			}, [h(t.$slots, "opener", {
+				isOpen: o.isOpen,
+				floating: v(P)
+			})], 512),
+			h(t.$slots, "opener-end"),
+			o.teleport ? r("", !0) : S((f(), i("div", {
+				key: 0,
+				ref_key: "content",
+				ref: w,
+				class: c(["fz__floating__content w-full sm:w-auto", W.value])
+			}, [h(t.$slots, "default", {
+				isOpen: o.isOpen,
+				floating: v(P)
+			})], 2)), [[b, t.$slots.default && (!t.$slots.opener || t.$slots.opener && o.isOpen)]]),
+			o.teleport ? (f(), n(e, {
+				key: 1,
+				to: "body"
+			}, [S(a("div", {
+				ref_key: "content",
+				ref: w,
+				class: c(["fz__floating__content", W.value])
+			}, [h(t.$slots, "default", {
+				isOpen: o.isOpen,
+				floating: v(P)
+			})], 2), [[b, t.$slots.default && (!t.$slots.opener || t.$slots.opener && o.isOpen)]])])) : r("", !0)
+		]));
+	}
 });
-export {
-  $e as FzFloating,
-  ae as calcRealPos,
-  Ee as clamp,
-  ne as format,
-  b as getHighestAvailableSpacePos,
-  re as parse,
-  ze as roundTo,
-  le as truncateDecimals,
-  ke as useBreakpoints,
-  Oe as useClickOutside,
-  Ne as useCurrency,
-  ve as useFloating,
-  Le as useKeyDown,
-  Be as useKeyUp,
-  N as useMediaQuery
-};
+//#endregion
+export { ne as FzFloating, A as calcRealPos, D as clamp, w as format, k as getHighestAvailableSpacePos, T as parse, E as roundTo, C as truncateDecimals, U as useBreakpoints, W as useClickOutside, q as useCurrency, V as useFloating, G as useKeyDown, K as useKeyUp, H as useMediaQuery };