@fiscozen/checkbox 0.2.0 → 1.0.0

package/dist/checkbox.js

@@ -0,0 +1,2376 @@
+import { ref as E, reactive as ge, onUnmounted as ne, nextTick as we, onMounted as ee, computed as s, defineComponent as A, useSlots as te, toRef as ue, toRefs as ke, watch as F, onBeforeUnmount as Ce, createElementBlock as S, openBlock as v, renderSlot as $, createElementVNode as T, withDirectives as J, createCommentVNode as z, createBlock as O, unref as m, normalizeClass as g, vShow as ce, Teleport as ze, createTextVNode as M, toDisplayString as P, createVNode as W, mergeProps as oe, resolveDynamicComponent as $e, withCtx as R, resolveComponent as Be, resolveDirective as Se, withModifiers as Oe, mergeModels as Z, useModel as le, shallowRef as Ie, vModelCheckbox as Ee, Fragment as re, createSlots as Re, renderList as ve } from "vue";
+import { FzIcon as U } from "@fiscozen/icons";
+function me(e) {
+  const t = Date.now() - 16e11, a = Math.random().toString(36).slice(2, 7);
+  return `${e}-${t}-${a}`;
+}
+function be() {
+  return me("fz-checkbox");
+}
+function Fe() {
+  return me("fz-checkbox-group");
+}
+const G = new DOMRect(0, 0, window.innerWidth, window.innerHeight), q = (e, t, a, o, i) => {
+  let l = i ? "bottom" : "right", c = i ? "bottom-start" : "right-start";
+  G.width = window.innerWidth, G.height = window.innerHeight, G.x = 0, G.y = 0;
+  const p = e ? e.getBoundingClientRect() : G, w = t.getBoundingClientRect(), y = a.getBoundingClientRect(), d = (y.left - p.left - w.width) / p.width, r = (p.right - y.right - w.width) / p.width, u = (y.top - p.top - w.height) / p.height, f = (p.bottom - y.bottom - w.height) / p.height;
+  let n = [
+    {
+      key: "right",
+      space: r
+    },
+    {
+      key: "top",
+      space: u
+    },
+    {
+      key: "bottom",
+      space: f
+    },
+    {
+      key: "left",
+      space: d
+    }
+  ].sort((b, h) => h.space - b.space);
+  if (i && (n = n.filter((b) => b.key === "top" || b.key === "bottom")), l = n[0].key, !o) {
+    const b = (w.height - y.height) / 2;
+    switch (l) {
+      case "right":
+      case "left":
+        p.top > y.top - b && (o = "end"), p.bottom < y.top - b && (o = "start");
+        break;
+    }
+  }
+  return c = o ? `${l}-${o}` : l, c;
+}, Te = (e, t, a, o) => ({
+  x: t.x + e.width * a / 100,
+  y: t.y + e.height * o / 100
+}), ae = (e) => typeof e == "string" ? document.querySelector(e) : e, Ne = (e) => ({
+  left: parseFloat(e.marginLeft),
+  right: parseFloat(e.marginRight),
+  top: parseFloat(e.marginTop),
+  bottom: parseFloat(e.marginBottom)
+}), Ae = {
+  // 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 }
+  })
+}, Le = (e, t, a) => {
+  const o = Ae[e];
+  return o ? o(t, a) : { position: { x: 0, y: 0 }, transform: { x: 0, y: 0 } };
+}, Ve = {
+  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 }
+  })
+}, De = (e, t, a) => {
+  const o = Ve[e];
+  return o ? o(t, a) : { position: { x: 0, y: 0 }, transform: { x: 0, y: 0 } };
+}, Me = (e, t, a, o) => {
+  const i = { ...e }, l = { ...o };
+  if (e.x < a.left && (i.x = a.left, l.x = 0), e.x + t.width > a.right) {
+    const c = a.right - t.width;
+    c > 0 && (i.x = c), l.x = 0;
+  }
+  if (e.y < a.top && (i.y = a.top, l.y = 0), e.y + t.height > a.bottom) {
+    const c = a.bottom - t.height;
+    c > 0 && (i.y = c), l.y = 0;
+  }
+  return { position: i, transform: l };
+}, Pe = (e, t, a, o, i) => {
+  const l = i ? null : t;
+  switch (e) {
+    case "auto":
+      return q(l, a, o);
+    case "auto-vertical":
+      return q(l, a, o, void 0, !0);
+    case "auto-start":
+      return q(l, a, o, "start");
+    case "auto-vertical-start":
+      return q(l, a, o, "start", !0);
+    case "auto-end":
+      return q(l, a, o, "end");
+    case "auto-vertical-end":
+      return q(l, a, o, "end", !0);
+    default:
+      return "bottom-start";
+  }
+}, He = (e) => e.startsWith("auto"), qe = (e) => {
+  const t = E("auto"), a = E(), o = E(), i = E(), l = E(), c = ge({ position: { x: 0, y: 0 } }), p = {
+    root: null,
+    rootMargin: "0px",
+    threshold: 1,
+    ...e.element.value.intersectionOptions
+  }, w = E(new IntersectionObserver(() => {
+  }, p)), y = () => {
+    var b, h;
+    const u = ae(e.element.value.domRef.value);
+    if (!u)
+      return null;
+    const f = (b = e.container) != null && b.value ? ae(e.container.value.domRef.value) ?? document.body : document.body, n = (h = e.opener) != null && h.value ? ae(e.opener.value.domRef.value) : null;
+    return { element: u, container: f, opener: n };
+  }, d = (u) => {
+    var f;
+    return {
+      element: u.element.getBoundingClientRect(),
+      container: u.container.getBoundingClientRect(),
+      opener: ((f = u.opener) == null ? void 0 : f.getBoundingClientRect()) ?? null
+    };
+  }, r = (u = !1) => we(() => {
+    var I, V, N;
+    a.value = ((I = e.position) == null ? void 0 : I.value) ?? "auto";
+    const f = y();
+    if (!f) return;
+    Object.assign(f.element.style, {
+      position: "fixed",
+      top: "0px",
+      left: "0px"
+    });
+    const n = d(f);
+    o.value = n.element, i.value = n.opener ?? void 0, l.value = n.container, w.value.observe(f.element), w.value.observe(f.container), He(a.value) && f.opener && (a.value = Pe(
+      a.value,
+      f.container,
+      f.element,
+      f.opener,
+      ((V = e.useViewport) == null ? void 0 : V.value) ?? !1
+    ));
+    const b = Ne(window.getComputedStyle(f.element)), h = f.opener && n.opener ? Le(a.value, n.opener, b) : De(a.value, n.container, n.element), k = Te(
+      n.element,
+      h.position,
+      h.transform.x,
+      h.transform.y
+    ), B = Me(
+      k,
+      n.element,
+      n.container,
+      h.transform
+    );
+    c.position.x = B.position.x, c.position.y = B.position.y, Object.assign(f.element.style, {
+      top: `${c.position.y}px`,
+      left: `${c.position.x}px`,
+      position: "fixed",
+      display: "flex"
+    }), o.value = f.element.getBoundingClientRect(), (N = e.callback) != null && N.value && !u && e.callback.value(o, i, l, t, a);
+  });
+  return ne(() => {
+    w.value.disconnect();
+  }), {
+    float: c,
+    rect: o,
+    setPosition: r,
+    position: t,
+    actualPosition: a,
+    openerRect: i,
+    containerRect: l
+  };
+};
+function We(e) {
+  const t = window.matchMedia(e), a = E(t.matches);
+  function o(i) {
+    a.value = i.matches;
+  }
+  return ee(() => {
+    t.addEventListener("change", o);
+  }), ne(() => {
+    t.removeEventListener("change", o);
+  }), s(() => a.value);
+}
+const je = {
+  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"
+    }
+  }
+}, ie = {
+  global: je
+}, Ue = [
+  "blue",
+  "purple",
+  "orange",
+  "pink",
+  "yellow",
+  "grey",
+  "core"
+], Ge = {
+  safeColorNames: Ue
+}, Ke = [
+  "error",
+  "warning",
+  "success",
+  "info"
+], Xe = {
+  semanticColorNames: Ke
+}, Qe = Ge.safeColorNames, Ye = Xe.semanticColorNames, j = {};
+Qe.forEach((e) => {
+  const t = ie.global[e];
+  t && Object.keys(t).forEach((a) => {
+    var i;
+    const o = (i = t[a]) == null ? void 0 : i.value;
+    o && (j[e] || (j[e] = {}), j[e][a] = o);
+  });
+});
+const de = ie.global.semantic;
+de && Ye.forEach((e) => {
+  const t = de[e];
+  t && typeof t == "object" && Object.keys(t).forEach((a) => {
+    var i;
+    const o = (i = t[a]) == null ? void 0 : i.value;
+    if (o) {
+      const l = `semantic-${e}`;
+      j[l] || (j[l] = {}), j[l][a] = o;
+    }
+  });
+});
+const Je = Object.entries(ie.global.breakpoint).reduce(
+  (e, [t, a]) => (e[t] = a.value, e),
+  {}
+), Ze = /* @__PURE__ */ A({
+  __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: a }) {
+    const o = e, i = a, l = E(null), c = E(null), p = te(), w = We(`(max-width: ${Je.xs})`);
+    let y = !1, d = !1, r = null, u = null;
+    const f = {
+      position: o.position,
+      element: {
+        // @ts-ignore
+        domRef: l
+      },
+      container: {
+        // @ts-ignore
+        domRef: ue(o.container || document.body)
+      },
+      opener: {
+        domRef: ue(null)
+      },
+      useViewport: o.useViewport,
+      callback(...x) {
+        i("fzfloating:setPosition", ...x);
+      }
+    }, n = ke(f);
+    p.opener && (f.opener = {
+      // @ts-ignore
+      domRef: c
+    });
+    const b = qe(n), h = () => {
+      y || !d || (y = !0, requestAnimationFrame(() => {
+        d && o.isOpen && b.setPosition(), y = !1;
+      }));
+    };
+    ee(() => {
+      d = !0;
+    });
+    const k = () => {
+      h();
+    }, B = () => {
+      h();
+    }, I = () => {
+      window.addEventListener("scroll", k, !0), window.addEventListener("resize", B), l.value && !r && (r = new ResizeObserver(() => {
+        h();
+      }), r.observe(l.value)), c.value && !u && (u = new ResizeObserver(() => {
+        h();
+      }), u.observe(c.value));
+    }, V = () => {
+      window.removeEventListener("scroll", k, !0), window.removeEventListener("resize", B), r && (r.disconnect(), r = null), u && (u.disconnect(), u = null);
+    };
+    F(
+      () => o.position,
+      () => h()
+    ), F(
+      () => o.isOpen,
+      (x) => {
+        var Q;
+        if (!x || !l.value || !d) {
+          V();
+          return;
+        }
+        I();
+        const D = (Q = c.value) == null ? void 0 : Q.getBoundingClientRect();
+        l.value.style.position = "fixed", l.value.style.top = "0px", l.value.style.left = "0px", l.value.style.transform = "none", l.value.style.width = w.value ? (D == null ? void 0 : D.width) + "px" : "auto", b.setPosition();
+      }
+    ), F(
+      () => o.overrideOpener,
+      (x) => {
+        x && n.opener && n.opener.value && (n.opener.value = {
+          domRef: x
+        });
+      }
+    ), Ce(() => {
+      d = !1, V();
+    });
+    const N = (x) => x.startsWith("bottom") ? "mt-4" : x.startsWith("top") ? "mb-4" : x.startsWith("left") ? "mr-4" : x.startsWith("right") ? "ml-4" : "mt-4", X = s(() => {
+      var D;
+      const x = ((D = b.actualPosition) == null ? void 0 : D.value) ?? o.position;
+      return N(x);
+    }), H = s(() => o.overrideContentClass ? o.contentClass : ["bg-core-white fixed", X.value, o.contentClass]);
+    return t({
+      setPosition: b.setPosition
+    }), (x, D) => (v(), S("div", null, [
+      $(x.$slots, "opener-start"),
+      T("div", {
+        ref_key: "opener",
+        ref: c,
+        class: "inline-flex w-full sm:w-auto"
+      }, [
+        $(x.$slots, "opener", {
+          isOpen: e.isOpen,
+          floating: m(b)
+        })
+      ], 512),
+      $(x.$slots, "opener-end"),
+      e.teleport ? z("", !0) : J((v(), S("div", {
+        key: 0,
+        ref_key: "content",
+        ref: l,
+        class: g(["fz__floating__content w-full sm:w-auto", H.value])
+      }, [
+        $(x.$slots, "default", {
+          isOpen: e.isOpen,
+          floating: m(b)
+        })
+      ], 2)), [
+        [ce, x.$slots.default && (!x.$slots.opener || x.$slots.opener && e.isOpen)]
+      ]),
+      e.teleport ? (v(), O(ze, {
+        key: 1,
+        to: "body"
+      }, [
+        J(T("div", {
+          ref_key: "content",
+          ref: l,
+          class: g(["fz__floating__content", H.value])
+        }, [
+          $(x.$slots, "default", {
+            isOpen: e.isOpen,
+            floating: m(b)
+          })
+        ], 2), [
+          [ce, x.$slots.default && (!x.$slots.opener || x.$slots.opener && e.isOpen)]
+        ])
+      ])) : z("", !0)
+    ]));
+  }
+}), _ = {
+  xs: "backoffice",
+  sm: "backoffice",
+  md: "backoffice",
+  lg: "frontoffice"
+}, _e = ["disabled", "aria-disabled"], se = /* @__PURE__ */ A({
+  __name: "FzButton",
+  props: {
+    label: {},
+    tooltip: {},
+    variant: { default: "primary" },
+    size: {},
+    environment: {},
+    disabled: { type: Boolean, default: !1 },
+    iconName: {},
+    iconVariant: {},
+    iconPosition: { default: "before" },
+    containerClass: {},
+    overrideContainerClass: { type: Boolean }
+  },
+  setup(e) {
+    const t = e, a = te();
+    F(() => t.tooltip, (r) => {
+      r && console.warn(
+        '[FzButton] The "tooltip" prop is deprecated and will be removed in a future version. Please use the FzTooltip component to wrap your button instead.'
+      );
+    }, { immediate: !0 }), F(() => t.size, (r) => {
+      if (r !== void 0) {
+        const u = _[r];
+        t.environment && t.environment !== u ? console.warn(
+          `[FzButton] Both "size" and "environment" props are provided. "environment=${t.environment}" will be used and "size=${r}" will be ignored. Please remove the deprecated "size" prop.`
+        ) : console.warn(
+          `[FzButton] The "size" prop is deprecated and will be removed in a future version. Please use environment="${u}" instead of size="${r}".`
+        );
+      }
+    }, { immediate: !0 });
+    const o = s(() => !t.disabled), i = s(() => {
+      switch (t.variant) {
+        case "secondary":
+          return {
+            "bg-core-white": !0,
+            "text-grey-500": !0,
+            "!border-grey-200": !0,
+            "hover:bg-grey-100": o.value,
+            "hover:!border-grey-200": o.value,
+            "focus:bg-core-white": o.value,
+            "focus:!border-blue-600": o.value,
+            "disabled:bg-grey-50": !0,
+            "disabled:text-grey-200": !0,
+            "disabled:!border-grey-200": !0
+          };
+        case "invisible":
+          return {
+            "bg-transparent": !0,
+            "text-grey-500": !0,
+            "!border-transparent": !0,
+            "hover:bg-grey-100": o.value,
+            "hover:!border-grey-100": o.value,
+            "focus:bg-transparent": o.value,
+            "focus:!border-blue-600": o.value,
+            "disabled:bg-grey-50": !0,
+            "disabled:text-grey-200": !0,
+            "disabled:!border-grey-200": !0
+          };
+        case "danger":
+          return {
+            "bg-semantic-error-200": !0,
+            "text-core-white": !0,
+            "hover:bg-semantic-error-300": o.value,
+            "focus:bg-semantic-error-200": o.value,
+            "focus:!border-semantic-error-300": o.value,
+            "disabled:bg-semantic-error-100": !0
+          };
+        case "success":
+          return {
+            "bg-semantic-success-200": !0,
+            "text-core-white": !0,
+            "hover:bg-semantic-success-300": o.value,
+            "focus:bg-semantic-success-200": o.value,
+            "focus:!border-semantic-success-300": o.value,
+            "disabled:bg-semantic-success-100": !0
+          };
+        case "primary":
+        default:
+          return {
+            "bg-blue-500": !0,
+            "text-core-white": !0,
+            "hover:bg-blue-600": o.value,
+            "focus:bg-blue-500": o.value,
+            "focus:!border-blue-600": o.value,
+            "disabled:bg-blue-200": !0
+          };
+      }
+    }), l = s(() => t.environment ? t.environment : t.size ? _[t.size] : "frontoffice"), c = s(() => {
+      const r = !!(t.label || a.default), u = !!t.iconName, f = t.overrideContainerClass && u;
+      return r && u || f;
+    }), p = [
+      "relative",
+      "rounded",
+      "flex",
+      "flex-shrink",
+      "items-center",
+      "justify-center",
+      "font-normal",
+      "!text-[16px]",
+      "!leading-[20px]",
+      "border-1",
+      "border-transparent",
+      "gap-8"
+    ], w = ["flex", "items-center", "justify-items-center"], y = s(() => {
+      const r = l.value;
+      return {
+        // Height classes (explicit for PurgeCSS detection)
+        "h-32": r === "backoffice",
+        "h-44": r === "frontoffice",
+        // Padding classes (same for both environments)
+        "px-12": !0,
+        // Min-width classes (same for both environments)
+        "min-w-96": !0,
+        ...i.value
+      };
+    }), d = s(() => t.overrideContainerClass ? t.containerClass : ["truncate", "font-normal", "!text-[16px]", "!leading-[20px]", t.containerClass]);
+    return (r, u) => (v(), S("button", {
+      type: "button",
+      disabled: e.disabled,
+      "aria-disabled": e.disabled ? "true" : "false",
+      class: g([p, y.value])
+    }, [
+      m(a).before || c.value && e.iconPosition === "before" ? (v(), S("div", {
+        key: 0,
+        class: g(w)
+      }, [
+        $(r.$slots, "before", {}, () => [
+          e.iconName ? (v(), O(m(U), {
+            key: 0,
+            name: e.iconName,
+            size: "md",
+            variant: e.iconVariant
+          }, null, 8, ["name", "variant"])) : z("", !0)
+        ])
+      ])) : z("", !0),
+      e.label || m(a).default ? (v(), S("div", {
+        key: 1,
+        class: g(d.value)
+      }, [
+        $(r.$slots, "default", {}, () => [
+          M(P(e.label), 1)
+        ])
+      ], 2)) : z("", !0),
+      m(a).after || c.value && e.iconPosition === "after" ? (v(), S("div", {
+        key: 2,
+        class: g(w)
+      }, [
+        $(r.$slots, "after", {}, () => [
+          e.iconName ? (v(), O(m(U), {
+            key: 0,
+            name: e.iconName,
+            size: "md",
+            variant: e.iconVariant
+          }, null, 8, ["name", "variant"])) : z("", !0)
+        ])
+      ])) : z("", !0)
+    ], 10, _e));
+  }
+}), et = /* @__PURE__ */ A({
+  inheritAttrs: !1,
+  __name: "FzIconButton",
+  props: {
+    tooltip: {},
+    variant: { default: "primary" },
+    environment: {},
+    size: {},
+    disabled: { type: Boolean, default: !1 },
+    iconName: {},
+    iconVariant: { default: "far" },
+    iconSize: {},
+    hasNotification: { type: Boolean, default: !1 },
+    ariaLabel: {}
+  },
+  setup(e) {
+    const t = e;
+    F(() => t.tooltip, (l) => {
+      l && console.warn(
+        '[FzIconButton] The "tooltip" prop is deprecated and will be removed in a future version. Please use the FzTooltip component to wrap your button instead.'
+      );
+    }, { immediate: !0 }), F(() => t.size, (l) => {
+      if (l !== void 0) {
+        const c = _[l];
+        t.environment && t.environment !== c ? console.warn(
+          `[FzIconButton] Both "size" and "environment" props are provided. "environment=${t.environment}" will be used and "size=${l}" will be ignored. Please remove the deprecated "size" prop.`
+        ) : console.warn(
+          `[FzIconButton] The "size" prop is deprecated and will be removed in a future version. Please use environment="${c}" instead of size="${l}".`
+        );
+      }
+    }, { immediate: !0 }), F(() => t.iconSize, (l) => {
+      l !== void 0 && console.warn(
+        '[FzIconButton] The "iconSize" prop is deprecated and will be removed in a future version. Icon size has now a fixed dimension. Please remove the "iconSize" prop from your code.'
+      );
+    }, { immediate: !0 });
+    const a = s(() => t.environment ? t.environment : t.size ? _[t.size] : "frontoffice"), o = s(() => {
+      const l = t.ariaLabel || "";
+      return t.hasNotification ? `${l}, hai delle notifiche` : l;
+    }), i = s(() => {
+      const l = {
+        "rounded-full": !0,
+        "w-8": !0,
+        "h-8": !0,
+        absolute: !0,
+        "-top-[2px]": !0,
+        "-right-[2px]": !0
+      };
+      return t.disabled ? t.variant === "primary" ? {
+        ...l,
+        "bg-orange-200": !0
+      } : {
+        ...l,
+        "bg-grey-200": !0
+      } : t.variant === "primary" ? {
+        ...l,
+        "bg-orange-500": !0
+      } : {
+        ...l,
+        "bg-blue-500": !0
+      };
+    });
+    return (l, c) => (v(), S("span", {
+      class: g(["fz-icon-button-wrapper", "relative", { "fz-icon-button-wrapper--backoffice": a.value === "backoffice", "fz-icon-button-wrapper--frontoffice": a.value === "frontoffice" }])
+    }, [
+      W(se, oe(l.$attrs, {
+        disabled: t.disabled,
+        environment: a.value,
+        variant: t.variant,
+        "aria-label": o.value,
+        "icon-name": t.iconName,
+        "icon-variant": t.iconVariant,
+        "icon-position": "before",
+        overrideContainerClass: ""
+      }), null, 16, ["disabled", "environment", "variant", "aria-label", "icon-name", "icon-variant"]),
+      t.hasNotification ? (v(), S("div", {
+        key: 0,
+        class: g(i.value),
+        "aria-hidden": "true"
+      }, null, 2)) : z("", !0)
+    ], 2));
+  }
+}), K = (e, t) => {
+  const a = e.__vccOpts || e;
+  for (const [o, i] of t)
+    a[o] = i;
+  return a;
+}, ye = /* @__PURE__ */ K(et, [["__scopeId", "data-v-b4be112d"]]), tt = /* @__PURE__ */ A({
+  __name: "FzContainer",
+  props: {
+    main: { type: Boolean, default: !1 },
+    gap: { default: "base" },
+    tag: { default: "div" },
+    alignItems: { default: void 0 },
+    horizontal: { type: Boolean, default: !1 },
+    layout: {}
+  },
+  setup(e) {
+    const t = e, a = s(() => t.alignItems ?? (t.horizontal ? "center" : "stretch"));
+    if (!t.horizontal && "layout" in t) {
+      const i = t.layout;
+      i && i !== "default" && console.error(
+        `[FzContainer] The "layout" prop only works when horizontal is true. Current horizontal: ${t.horizontal}, layout: "${i}".`
+      );
+    }
+    const o = s(() => {
+      const i = t.main ? "main-content" : "section-content", c = [
+        t.horizontal ? "fz-container--horizontal" : "fz-container--vertical",
+        `gap-${i}-${t.gap}`,
+        `align-items-${a.value}`
+      ];
+      if (t.horizontal) {
+        const p = ("layout" in t ? t.layout : void 0) || "default";
+        c.push(`layout-${p}`);
+      }
+      return c;
+    });
+    return (i, l) => (v(), O($e(t.tag), {
+      class: g(["fz-container", o.value])
+    }, {
+      default: R(() => [
+        $(i.$slots, "default", {}, void 0, !0)
+      ]),
+      _: 3
+    }, 8, ["class"]));
+  }
+}), fe = /* @__PURE__ */ K(tt, [["__scopeId", "data-v-8c40daeb"]]), ot = ["aria-disabled"], at = ["href", "target", "rel"], he = /* @__PURE__ */ A({
+  __name: "FzLink",
+  props: {
+    type: { default: "default" },
+    linkStyle: { default: "default" },
+    size: { default: "md" },
+    disabled: { type: Boolean, default: !1 },
+    to: {},
+    external: { type: Boolean, default: !1 },
+    replace: { type: Boolean, default: !1 },
+    target: {}
+  },
+  setup(e) {
+    const t = e;
+    F(
+      () => t.size === "xs",
+      (n) => {
+        n && console.warn(
+          '[FzLink] The size prop value "xs" is deprecated and will be removed in a future version. Please use "sm" instead. The component will automatically map "xs" to "sm" for now.'
+        );
+      },
+      { immediate: !0 }
+    ), F(
+      () => t.size === "lg",
+      (n) => {
+        n && console.warn(
+          '[FzLink] The size prop value "lg" is deprecated and will be removed in a future version. Please use "md" instead. The component will automatically map "lg" to "md" for now.'
+        );
+      },
+      { immediate: !0 }
+    );
+    const a = s(() => t.size === "xs" ? "sm" : t.size === "lg" ? "md" : t.size), o = s(() => [
+      "border-1 border-transparent inline-block",
+      {
+        "text-sm leading-xs": a.value === "sm",
+        "text-base leading-base": a.value === "md",
+        underline: t.linkStyle === "underline"
+      }
+    ]), i = (n) => n.type === "default" && n.linkStyle === "underline", l = (n) => n.type === "default" && n.linkStyle !== "underline", c = (n) => n.type === "danger" && n.linkStyle === "underline", p = (n) => n.type === "danger" && n.linkStyle !== "underline", w = (n) => n.type === "default" && n.disabled, y = (n) => n.type === "danger" && n.disabled, d = s(() => {
+      const n = [...o.value, "focus:outline-none", "focus:border-solid", "focus:no-underline"];
+      switch (!0) {
+        case i(t):
+          n.push("text-blue-500", "hover:text-blue-600", "focus:text-blue-600", "focus:border-blue-600");
+          break;
+        case l(t):
+          n.push("text-blue-500", "hover:text-blue-600", "hover:underline", "focus:text-blue-600", "focus:border-blue-600");
+          break;
+        case c(t):
+          n.push("text-semantic-error-200", "hover:text-semantic-error-300", "focus:text-semantic-error-300", "focus:border-semantic-error-300");
+          break;
+        case p(t):
+          n.push("text-semantic-error-200", "hover:text-semantic-error-300", "hover:underline", "focus:text-semantic-error-300", "focus:border-semantic-error-300");
+          break;
+      }
+      return n;
+    }), r = s(() => {
+      const n = [...o.value, "cursor-not-allowed"];
+      switch (!0) {
+        case w(t):
+          n.push("text-blue-200");
+          break;
+        case y(t):
+          n.push("text-semantic-error-100");
+          break;
+      }
+      return n;
+    }), u = s(() => t.external ? t.to : ""), f = s(() => {
+      if (t.external && t.target === "_blank")
+        return "noopener noreferrer";
+    });
+    return (n, b) => {
+      const h = Be("router-link");
+      return e.disabled ? (v(), S("span", {
+        key: 0,
+        class: g(r.value),
+        "aria-disabled": e.disabled ? "true" : "false",
+        role: "link",
+        "aria-label": "Link disabled"
+      }, [
+        $(n.$slots, "default")
+      ], 10, ot)) : e.external ? (v(), S("a", {
+        key: 1,
+        href: u.value,
+        class: g(d.value),
+        target: e.target,
+        rel: f.value
+      }, [
+        $(n.$slots, "default")
+      ], 10, at)) : (v(), O(h, {
+        key: 2,
+        to: e.to,
+        replace: e.replace,
+        class: g(d.value),
+        target: e.target
+      }, {
+        default: R(() => [
+          $(n.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["to", "replace", "class", "target"]));
+    };
+  }
+}), nt = ["aria-label", "aria-describedby", "tabindex"], lt = ["aria-hidden"], rt = 100, it = "text-core-white max-w-[200px] p-8 text-sm leading-[16px] flex flex-row items-start justify-center", st = /* @__PURE__ */ A({
+  __name: "FzTooltip",
+  props: {
+    position: { default: "auto" },
+    status: { default: "neutral" },
+    text: {},
+    withIcon: { type: Boolean, default: !1 },
+    ariaLabel: {},
+    interactive: { type: [Boolean, String], default: "auto" },
+    _forceOpenForDesignReview: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    const t = e, a = te(), o = [se, ye, he];
+    function i(C) {
+      const L = C.type;
+      return o.includes(L);
+    }
+    function l(C) {
+      if (i(C))
+        return !0;
+      if (typeof C.type == "symbol") {
+        const L = C.children;
+        if (Array.isArray(L))
+          return L.some((Y) => typeof Y == "object" && Y !== null && "type" in Y ? l(Y) : !1);
+      }
+      return !1;
+    }
+    const c = s(() => {
+      if (!a.default) return !1;
+      const C = a.default();
+      return C.length === 0 ? !1 : C.some((L) => l(L));
+    }), p = {
+      neutral: { icon: "", bgClass: "!bg-core-black" },
+      informative: { icon: "circle-info", bgClass: "bg-semantic-info-200" },
+      alert: { icon: "triangle-exclamation", bgClass: "bg-semantic-warning-200" },
+      error: { icon: "circle-exclamation", bgClass: "bg-semantic-error-200" },
+      positive: { icon: "circle-check", bgClass: "bg-semantic-success-200" }
+    }, w = s(() => {
+      var C;
+      return ((C = p[t.status]) == null ? void 0 : C.icon) || "";
+    }), y = s(() => {
+      var L;
+      const C = (L = p[t.status]) == null ? void 0 : L.bgClass;
+      return C ? { [C]: !0 } : {};
+    }), d = `tooltip-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`, r = E(!1), u = E(!1), f = E(!1), n = E(null), b = s(() => t.withIcon && t.status !== "neutral"), h = s(() => r.value ? d : void 0), k = s(() => typeof t.interactive == "boolean" ? t.interactive ? void 0 : 0 : c.value ? void 0 : 0);
+    function B() {
+      (t.text || a.text) && (r.value = !0);
+    }
+    function I() {
+      t._forceOpenForDesignReview || (r.value = !1);
+    }
+    function V() {
+      n.value && (clearTimeout(n.value), n.value = null), B();
+    }
+    function N() {
+      n.value && (clearTimeout(n.value), n.value = null), n.value = setTimeout(() => {
+        !u.value && !f.value && I();
+      }, rt);
+    }
+    function X() {
+      u.value = !0, n.value && (clearTimeout(n.value), n.value = null);
+    }
+    function H() {
+      u.value = !1, n.value && (clearTimeout(n.value), n.value = null), f.value || I();
+    }
+    function x() {
+      f.value = !0, B();
+    }
+    function D() {
+      f.value = !1, n.value && (clearTimeout(n.value), n.value = null), u.value || I();
+    }
+    function Q(C) {
+      C.key === "Escape" && I();
+    }
+    return ee(() => {
+      t._forceOpenForDesignReview && B();
+    }), F(() => t._forceOpenForDesignReview, (C) => {
+      C ? B() : I();
+    }), ne(() => {
+      n.value && clearTimeout(n.value);
+    }), (C, L) => (v(), O(m(Ze), {
+      teleport: !0,
+      "is-open": r.value,
+      position: e.position,
+      class: "fz__tooltip flex h-max",
+      contentClass: ["rounded", y.value, "z-80"]
+    }, {
+      opener: R(() => [
+        T("span", {
+          "aria-label": t.ariaLabel,
+          "aria-describedby": h.value,
+          tabindex: k.value,
+          onMouseover: V,
+          onMouseleave: N,
+          onFocusin: x,
+          onFocusout: D,
+          onKeydown: Q
+        }, [
+          $(C.$slots, "default", {}, void 0, !0)
+        ], 40, nt)
+      ]),
+      default: R(() => [
+        T("div", {
+          id: d,
+          class: g(it),
+          role: "tooltip",
+          "aria-hidden": !r.value,
+          onMouseenter: X,
+          onMouseleave: H
+        }, [
+          b.value ? (v(), O(m(U), {
+            key: 0,
+            size: "md",
+            name: w.value,
+            class: g(["mr-4", "!w-[16px]", "!h-[16px]", "grow-0", "shrink-0", { "text-core-black": t.status === "alert" }]),
+            "aria-hidden": !0
+          }, null, 8, ["name", "class"])) : z("", !0),
+          T("span", {
+            class: g(["basis-0 grow shrink-0 break-normal fz__tooltip__text", { "text-core-black": t.status === "alert" }])
+          }, [
+            $(C.$slots, "text", {}, () => [
+              M(P(t.text), 1)
+            ], !0)
+          ], 2)
+        ], 40, lt)
+      ]),
+      _: 3
+    }, 8, ["is-open", "position", "contentClass"]));
+  }
+}), ut = /* @__PURE__ */ K(st, [["__scopeId", "data-v-94597a6c"]]), ct = { class: "flex flex-col flex-1" }, dt = {
+  key: 0,
+  class: "leading-[20px]"
+}, ft = /* @__PURE__ */ A({
+  __name: "FzAlert",
+  props: {
+    tone: {},
+    alertStyle: { default: "default" },
+    showButtonAction: { type: Boolean, default: !0 },
+    buttonActionLabel: {},
+    buttonActionTooltip: {},
+    isDismissible: { type: Boolean },
+    showLinkAction: { type: Boolean },
+    linkActionLabel: {},
+    linkActionLocation: {},
+    linkActionTarget: {},
+    linkActionExternal: { type: Boolean },
+    size: {},
+    environment: { default: "frontoffice" },
+    title: {},
+    defaultOpen: { type: Boolean, default: !0 },
+    variant: {}
+  },
+  emits: ["fzAlert:click", "fzAlert:dismiss"],
+  setup(e, { emit: t }) {
+    const a = e, o = t, i = E(a.defaultOpen), l = {
+      info: "bg-semantic-info-50 border-semantic-info",
+      error: "bg-semantic-error-50 border-semantic-error",
+      danger: "bg-semantic-error-50 border-semantic-error",
+      warning: "bg-semantic-warning-50 border-semantic-warning",
+      success: "bg-semantic-success-50 border-semantic-success"
+    }, c = {
+      sm: "backoffice",
+      md: "frontoffice",
+      lg: "frontoffice"
+    }, p = s(() => [
+      "flex select-none gap-12 rounded justify-between",
+      l[a.tone],
+      h.value === "backoffice" ? "p-6" : "",
+      ...k.value === "accordion" ? ["cursor-pointer"] : []
+    ]), w = s(
+      () => ({
+        info: "circle-info",
+        error: "circle-xmark",
+        danger: "triangle-exclamation",
+        warning: "triangle-exclamation",
+        success: "circle-check"
+      })[a.tone]
+    ), y = s(() => [
+      {
+        info: "text-semantic-info",
+        error: "text-semantic-error",
+        danger: "text-semantic-error",
+        warning: "text-semantic-warning",
+        success: "text-semantic-success"
+      }[a.tone]
+    ]), d = s(() => [
+      "font-normal",
+      "!leading-[20px]",
+      {
+        "mt-8": a.title,
+        "mb-16": a.showButtonAction || a.showLinkAction
+      }
+    ]), r = s(() => k.value === "background" ? !0 : i.value), u = s(() => i.value ? "angle-up" : "angle-down"), f = s(() => {
+      if (k.value === "accordion") return u.value;
+      if (a.isDismissible) return "xmark";
+    }), n = s(() => k.value !== "accordion" ? !0 : i.value);
+    function b(N) {
+      N.stopPropagation(), o("fzAlert:click");
+    }
+    const h = s(() => a.size ? c[a.size] : a.environment), k = s(() => a.variant ? a.variant : ["default", "simple"].includes(a.alertStyle) ? "background" : "accordion"), B = s(() => k.value === "accordion" || a.isDismissible), I = () => {
+      k.value === "accordion" && (i.value = !i.value), a.isDismissible && o("fzAlert:dismiss");
+    }, V = () => {
+      k.value === "accordion" && (i.value = !i.value);
+    };
+    return (N, X) => {
+      const H = Se("bold");
+      return v(), S("div", {
+        class: g(p.value),
+        onClick: V
+      }, [
+        W(m(fe), {
+          horizontal: "",
+          gap: "sm",
+          class: g(["flex-1", h.value === "backoffice" ? "p-6" : "p-12"]),
+          alignItems: "start"
+        }, {
+          default: R(() => [
+            W(m(U), {
+              name: w.value,
+              size: "md",
+              class: g(y.value)
+            }, null, 8, ["name", "class"]),
+            T("div", ct, [
+              e.title ? J((v(), S("p", dt, [
+                M(P(e.title), 1)
+              ])), [
+                [H]
+              ]) : z("", !0),
+              n.value ? (v(), S("p", {
+                key: 1,
+                class: g(d.value)
+              }, [
+                $(N.$slots, "default", {}, void 0, !0)
+              ], 2)) : z("", !0),
+              r.value ? $(N.$slots, "action", { key: 2 }, () => [
+                W(m(fe), {
+                  horizontal: "",
+                  gap: "sm"
+                }, {
+                  default: R(() => [
+                    e.showButtonAction ? (v(), O(m(se), {
+                      key: 0,
+                      onClick: b,
+                      tooltip: e.buttonActionTooltip,
+                      environment: h.value,
+                      variant: "secondary"
+                    }, {
+                      default: R(() => [
+                        M(P(e.buttonActionLabel), 1)
+                      ]),
+                      _: 1
+                    }, 8, ["tooltip", "environment"])) : z("", !0),
+                    e.showLinkAction ? (v(), O(m(he), {
+                      key: 1,
+                      to: e.linkActionLocation,
+                      onClick: b,
+                      size: "md",
+                      target: e.linkActionTarget,
+                      external: e.linkActionExternal
+                    }, {
+                      default: R(() => [
+                        M(P(e.linkActionLabel), 1)
+                      ]),
+                      _: 1
+                    }, 8, ["to", "target", "external"])) : z("", !0)
+                  ]),
+                  _: 1
+                })
+              ], !0) : z("", !0)
+            ])
+          ]),
+          _: 3
+        }, 8, ["class"]),
+        B.value ? (v(), O(m(ye), {
+          key: 0,
+          iconName: f.value,
+          environment: h.value,
+          variant: "invisible",
+          onClick: Oe(I, ["stop"])
+        }, null, 8, ["iconName", "environment"])) : z("", !0)
+      ], 2);
+    };
+  }
+}), pt = /* @__PURE__ */ K(ft, [["__scopeId", "data-v-f72b7e4a"]]), xe = /* @__PURE__ */ A({
+  __name: "ErrorAlert",
+  props: {
+    id: {}
+  },
+  setup(e) {
+    return (t, a) => (v(), O(m(pt), {
+      id: e.id,
+      tone: "error",
+      alertStyle: "simple",
+      role: "alert",
+      "aria-live": "assertive",
+      "aria-atomic": "true",
+      size: "md"
+    }, {
+      default: R(() => [
+        $(t.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["id"]));
+  }
+}), vt = { class: "flex justify-center flex-col w-fit gap-4" }, mt = ["data-emphasis", "data-error", "data-disabled"], bt = ["id", "disabled", "required", "value", "aria-checked", "aria-label", "aria-required", "aria-invalid", "aria-describedby", "aria-labelledby", "aria-owns"], yt = ["id", "for"], ht = "w-0 h-0 peer fz-hidden-input", xt = `
+  flex gap-6 items-start hover:cursor-pointer text-core-black
+  peer-focus:[&_div]:after:border-1
+  peer-focus:[&_div]:after:border-solid
+  peer-focus:[&_div]:after:rounded-[2px]
+  peer-focus:[&_div]:after:border-blue-200
+  peer-focus:[&_div]:after:content-['']
+  peer-focus:[&_div]:after:top-0
+  peer-focus:[&_div]:after:left-0
+  peer-focus:[&_div]:after:right-0
+  peer-focus:[&_div]:after:bottom-0
+  peer-focus:[&_div]:after:absolute
+`, gt = "relative", wt = /* @__PURE__ */ A({
+  __name: "FzCheckbox",
+  props: /* @__PURE__ */ Z({
+    label: {},
+    value: { type: [String, Number, Boolean] },
+    size: {},
+    indeterminate: { type: Boolean, default: !1 },
+    emphasis: { type: Boolean },
+    disabled: { type: Boolean },
+    error: { type: Boolean },
+    required: { type: Boolean },
+    standalone: { type: Boolean },
+    tooltip: {},
+    ariaOwns: {},
+    checkboxId: {}
+  }, {
+    modelValue: { type: [null, Boolean, Array], required: !0 },
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ Z(["change"], ["update:modelValue"]),
+  setup(e, { emit: t }) {
+    const a = e;
+    F(
+      () => a.size,
+      (k) => {
+        k !== void 0 && console.warn(
+          '[FzCheckbox] The "size" prop is deprecated and will be removed in a future version. Checkboxes now have a fixed size.'
+        );
+      },
+      { immediate: !0 }
+    );
+    const o = Object.freeze({
+      /** Icon for indeterminate state (partial selection) */
+      INDETERMINATE: "square-minus",
+      /** Icon for checked state */
+      CHECKED: "square-check",
+      /** Icon for unchecked state */
+      UNCHECKED: "square"
+    }), i = Object.freeze({
+      /** Solid variant (filled) - used for checked and indeterminate states */
+      SOLID: "fas",
+      /** Regular variant (outline) - used for unchecked state */
+      REGULAR: "far"
+    }), l = s(
+      () => a.value ?? a.label
+    ), c = a.checkboxId || be(), p = le(e, "modelValue"), w = t, y = Ie(null), d = s(() => p.value == null ? !1 : typeof p.value == "boolean" ? p.value : p.value.includes(l.value)), r = s(() => a.disabled ? "text-grey-300 [&_div]:text-grey-300" : a.error ? "text-semantic-error-200 [&_div]:text-semantic-error-200 peer-checked:[&_div]:text-semantic-error-200 peer-indeterminate:[&_div]:text-semantic-error-200" : a.emphasis ? "text-core-black [&_div]:text-blue-500 peer-checked:[&_div]:text-blue-500 peer-indeterminate:[&_div]:text-blue-500" : "text-core-black peer-checked:[&_div]:text-grey-500 peer-indeterminate:[&_div]:text-grey-500"), u = s(() => a.disabled ? "text-grey-300" : a.error ? "text-semantic-error-200" : a.emphasis ? "text-blue-500" : "text-grey-400"), f = s(() => [
+      "text-base",
+      r.value
+    ]), n = s(() => [u.value]), b = s(() => a.indeterminate ? o.INDETERMINATE : d.value ? o.CHECKED : o.UNCHECKED), h = s(() => a.indeterminate || d.value ? i.SOLID : i.REGULAR);
+    return ee(() => {
+      var k, B;
+      p.value != null && (typeof p.value == "boolean" ? p.value && ((k = y.value) == null || k.dispatchEvent(new Event("change"))) : p.value.includes(l.value) && ((B = y.value) == null || B.dispatchEvent(new Event("change"))));
+    }), (k, B) => (v(), S("div", vt, [
+      T("div", {
+        class: "flex items-start group",
+        "data-emphasis": e.emphasis || void 0,
+        "data-error": e.error || void 0,
+        "data-disabled": e.disabled || void 0
+      }, [
+        J(T("input", {
+          type: "checkbox",
+          id: m(c),
+          disabled: e.disabled,
+          class: g(ht),
+          required: e.required,
+          value: e.value,
+          onChange: B[0] || (B[0] = (I) => w("change", I)),
+          "onUpdate:modelValue": B[1] || (B[1] = (I) => p.value = I),
+          "aria-checked": e.indeterminate ? "mixed" : d.value,
+          "aria-label": e.standalone ? e.label : void 0,
+          "aria-required": e.required ? "true" : "false",
+          "aria-invalid": e.error ? "true" : "false",
+          "aria-describedby": e.error && k.$slots.error ? `${m(c)}-error` : void 0,
+          "aria-labelledby": e.standalone ? void 0 : `${m(c)}-label`,
+          "aria-owns": a.ariaOwns,
+          ref_key: "refCheckbox",
+          ref: y
+        }, null, 40, bt), [
+          [Ee, p.value]
+        ]),
+        T("label", {
+          id: `${m(c)}-label`,
+          for: m(c),
+          class: g([xt, f.value])
+        }, [
+          W(m(U), {
+            name: b.value,
+            size: "md",
+            class: g([gt, n.value]),
+            variant: h.value,
+            "aria-hidden": "true"
+          }, null, 8, ["name", "class", "variant"]),
+          e.standalone ? z("", !0) : (v(), S(re, { key: 0 }, [
+            M(P(e.label), 1)
+          ], 64))
+        ], 10, yt),
+        e.tooltip ? (v(), O(m(ut), oe({ key: 0 }, e.tooltip, { class: "ml-6" }), {
+          default: R(() => [
+            W(m(U), {
+              name: "info-circle",
+              size: "md",
+              class: "text-semantic-info",
+              role: "img",
+              "aria-label": "Informazioni aggiuntive"
+            })
+          ]),
+          _: 1
+        }, 16)) : z("", !0)
+      ], 8, mt),
+      e.error && k.$slots.error ? (v(), O(xe, {
+        key: 0,
+        id: `${m(c)}-error`
+      }, {
+        default: R(() => [
+          $(k.$slots, "error", {}, void 0, !0)
+        ]),
+        _: 3
+      }, 8, ["id"])) : z("", !0),
+      $(k.$slots, "children", {}, void 0, !0)
+    ]));
+  }
+}), pe = /* @__PURE__ */ K(wt, [["__scopeId", "data-v-2b198cc9"]]), kt = "flex flex-col justify-center gap-8 pl-24", Ct = /* @__PURE__ */ A({
+  __name: "FzCheckboxGroupOption",
+  props: /* @__PURE__ */ Z({
+    label: {},
+    value: { type: [String, Number, Boolean] },
+    indeterminate: { type: Boolean },
+    emphasis: { type: Boolean },
+    disabled: { type: Boolean },
+    error: { type: Boolean },
+    required: { type: Boolean },
+    standalone: { type: Boolean },
+    tooltip: {},
+    ariaOwns: {},
+    checkboxId: {},
+    children: {}
+  }, {
+    modelValue: {
+      required: !0,
+      default: []
+    },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e) {
+    const t = e, a = s(
+      () => t.value ?? t.label
+    ), o = le(e, "modelValue"), i = be(), l = s(
+      () => {
+        var d;
+        return (d = t.children) == null ? void 0 : d.map((r, u) => `${i}-child-${u}`).join(" ");
+      }
+    ), c = s(() => []), p = s(() => {
+      if (!t.children) return !1;
+      const d = t.children.filter(
+        (r) => o.value.includes(r.value ?? r.label)
+      ).length;
+      return d > 0 && d < t.children.length;
+    });
+    function w() {
+      if (!t.children) return;
+      t.children.filter(
+        (r) => o.value.includes(r.value ?? r.label)
+      ).length === t.children.length ? o.value.includes(a.value) || (o.value = o.value.concat(a.value)) : o.value.includes(a.value) && (o.value = o.value.filter((r) => r !== a.value));
+    }
+    function y() {
+      var d;
+      t.children && (o.value.includes(a.value) ? o.value = o.value.concat(
+        (d = t.children) == null ? void 0 : d.map((r) => r.value ?? r.label).filter((r) => !o.value.includes(r))
+      ) : o.value = o.value.filter(
+        (r) => {
+          var u;
+          return !((u = t.children) != null && u.map((f) => f.value ?? f.label).includes(r));
+        }
+      ));
+    }
+    return (d, r) => {
+      var u, f;
+      return v(), O(pe, {
+        modelValue: o.value,
+        "onUpdate:modelValue": r[1] || (r[1] = (n) => o.value = n),
+        value: t.value,
+        label: t.label,
+        disabled: e.disabled,
+        emphasis: e.emphasis,
+        error: e.error,
+        indeterminate: p.value,
+        "aria-owns": (u = e.children) != null && u.length ? l.value : void 0,
+        onChange: y
+      }, Re({ _: 2 }, [
+        (f = e.children) != null && f.length ? {
+          name: "children",
+          fn: R(() => [
+            T("div", {
+              class: g([kt, c.value])
+            }, [
+              (v(!0), S(re, null, ve(e.children, (n, b) => (v(), O(pe, oe({
+                key: n.value ? n.value.toString() : n.label,
+                modelValue: o.value,
+                "onUpdate:modelValue": r[0] || (r[0] = (h) => o.value = h),
+                disabled: e.disabled
+              }, { ref_for: !0 }, n, {
+                emphasis: e.emphasis,
+                error: e.error,
+                "checkbox-id": `${m(i)}-child-${b}`,
+                onChange: w
+              }), null, 16, ["modelValue", "disabled", "emphasis", "error", "checkbox-id"]))), 128))
+            ], 2)
+          ]),
+          key: "0"
+        } : void 0
+      ]), 1032, ["modelValue", "value", "label", "disabled", "emphasis", "error", "indeterminate", "aria-owns"]);
+    };
+  }
+}), zt = ["id"], $t = { key: 0 }, Bt = ["id"], St = ["id", "aria-labelledby", "aria-describedby", "aria-required", "aria-invalid"], Ot = "flex flex-col", It = "flex flex-col gap-10", Et = "flex items-start", Tt = /* @__PURE__ */ A({
+  __name: "FzCheckboxGroup",
+  props: /* @__PURE__ */ Z({
+    label: {},
+    size: {},
+    options: {},
+    emphasis: { type: Boolean },
+    disabled: { type: Boolean },
+    error: { type: Boolean },
+    required: { type: Boolean },
+    horizontal: { type: Boolean }
+  }, {
+    modelValue: {
+      required: !0,
+      default: []
+    },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e) {
+    const t = e, a = te();
+    F(
+      () => t.size,
+      (d) => {
+        d !== void 0 && console.warn(
+          '[FzCheckboxGroup] The "size" prop is deprecated and will be removed in a future version. Checkboxes now have a fixed size.'
+        );
+      },
+      { immediate: !0 }
+    );
+    const o = Fe(), i = s(() => [
+      "text-sm",
+      t.disabled ? "text-grey-400" : "text-grey-500"
+    ]), l = le(e, "modelValue"), c = s(() => [
+      "text-base",
+      "gap-6",
+      t.disabled ? "text-grey-400" : "text-core-black"
+    ]), p = s(() => ["text-base"]), w = s(() => [
+      "text-base",
+      t.horizontal ? "gap-16" : "gap-8",
+      t.horizontal ? "flex-row" : "flex-col"
+    ]), y = s(() => {
+      const d = [];
+      return a.help && d.push(`${o}-help`), t.error && a.error && d.push(`${o}-error`), d.length > 0 ? d.join(" ") : void 0;
+    });
+    return (d, r) => (v(), S("div", {
+      class: g([It, p.value])
+    }, [
+      T("label", {
+        id: m(o) + "-label",
+        class: g([Ot, c.value])
+      }, [
+        T("span", null, [
+          M(P(e.label), 1),
+          e.required ? (v(), S("span", $t, " *")) : z("", !0)
+        ]),
+        d.$slots.help ? (v(), S("p", {
+          key: 0,
+          id: m(o) + "-help",
+          class: g(i.value)
+        }, [
+          $(d.$slots, "help")
+        ], 10, Bt)) : z("", !0)
+      ], 10, zt),
+      T("div", {
+        class: g([Et, w.value]),
+        id: m(o),
+        role: "group",
+        "aria-labelledby": m(o) + "-label",
+        "aria-describedby": y.value,
+        "aria-required": e.required ? "true" : "false",
+        "aria-invalid": e.error ? "true" : "false"
+      }, [
+        (v(!0), S(re, null, ve(e.options, (u) => (v(), O(Ct, oe({
+          key: u.value ? u.value.toString() : u.label,
+          modelValue: l.value,
+          "onUpdate:modelValue": r[0] || (r[0] = (f) => l.value = f),
+          disabled: e.disabled
+        }, { ref_for: !0 }, u, {
+          emphasis: e.emphasis,
+          error: e.error
+        }), null, 16, ["modelValue", "disabled", "emphasis", "error"]))), 128))
+      ], 10, St),
+      e.error && d.$slots.error ? (v(), O(xe, {
+        key: 0,
+        id: m(o) + "-error"
+      }, {
+        default: R(() => [
+          $(d.$slots, "error")
+        ]),
+        _: 3
+      }, 8, ["id"])) : z("", !0)
+    ], 2));
+  }
+});
+export {
+  pe as FzCheckbox,
+  Tt as FzCheckboxGroup,
+  be as generateCheckboxId,
+  Fe as generateGroupId
+};