@udixio/ui-react 2.4.3 → 2.5.0

package/dist/index.js

@@ -1,15 +1,14 @@
-import { jsx as f, jsxs as A, Fragment as te } from "react/jsx-runtime";
-import { clsx as ve } from "clsx";
-import { extendTailwindMerge as Ie } from "tailwind-merge";
-import K, { useState as S, useEffect as R, useRef as D, useLayoutEffect as we, isValidElement as ee, cloneElement as oe, useMemo as ke, Children as Se, Fragment as $e } from "react";
-import { motion as H, AnimatePresence as Q, useScroll as Me, useMotionValueEvent as fe, motionValue as Ce, useTransform as me } from "motion/react";
-import { throttle as Re } from "throttle-debounce";
-import { animate as Be } from "motion";
-import { createPortal as xe } from "react-dom";
-import { loader as De, defineConfig as We, FontPlugin as Pe, Variants as Ae } from "@udixio/theme";
-import { TailwindPlugin as be } from "@udixio/tailwind";
-import Ve from "react-textarea-autosize";
-const Le = Ie({
+import { jsx as f, jsxs as Y, Fragment as ye } from "react/jsx-runtime";
+import { clsx as He } from "clsx";
+import { extendTailwindMerge as je } from "tailwind-merge";
+import te, { useState as D, useEffect as $, useRef as P, useLayoutEffect as Ve, isValidElement as pe, cloneElement as be, useMemo as qe, Children as Ke, Fragment as _e } from "react";
+import { motion as j, AnimatePresence as ue, useScroll as Ge, useMotionValueEvent as Re, animate as Je } from "motion/react";
+import { animate as Ze } from "motion";
+import { createPortal as Fe } from "react-dom";
+import { loader as Qe, defineConfig as ze, FontPlugin as Te, Variants as et } from "@udixio/theme";
+import { TailwindPlugin as Xe } from "@udixio/tailwind";
+import tt from "react-textarea-autosize";
+const Oe = je({
   override: {
     classGroups: {
       "text-color": [
@@ -35,11 +34,11 @@ const Le = Ie({
       font: ["font"]
     }
   }
-}), h = (...e) => Le(ve(e)), He = (...e) => Le(ve(e));
-function Fe(e) {
+}), p = (...e) => Oe(He(e)), nt = (...e) => Oe(He(e));
+function rt(e) {
   return e.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, "").replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
 }
-const Oe = (e) => {
+const ot = (e) => {
   const t = {};
   e.classNameList.forEach((l) => {
     var r;
@@ -47,23 +46,23 @@ const Oe = (e) => {
       if (typeof l == "string")
         (t[r = e.default] ?? (t[r] = [])).push(l);
       else {
-        const c = l(e.states);
-        Object.entries(c).map((i) => {
-          const [s, u] = i;
-          (t[s] ?? (t[s] = [])).push(u);
+        const i = l(e.states);
+        Object.entries(i).map((c) => {
+          const [s, d] = c;
+          (t[s] ?? (t[s] = [])).push(d);
         });
       }
   });
   const n = t;
   return Object.entries(t).map((l) => {
-    let [r, c] = l;
-    c = c.reverse(), r == e.default && c.unshift("relative"), c.unshift(Fe(r)), n[r] = He(...c);
+    let [r, i] = l;
+    i = i.reverse(), r == e.default && i.unshift("relative"), i.unshift(rt(r)), n[r] = nt(...i);
   }), n;
-}, j = (e, t) => (n) => Oe({
+}, G = (e, t) => (n) => ot({
   classNameList: [n.className, t],
   default: e,
   states: n
-}), Ue = j(
+}), lt = G(
   "button",
   ({
     variant: e,
@@ -71,59 +70,59 @@ const Oe = (e) => {
     disabled: n,
     iconPosition: l,
     icon: r,
-    isActive: c,
-    loading: i,
+    isActive: i,
+    loading: c,
     shape: s,
-    onToggle: u,
-    size: a,
-    allowShapeTransformation: p
+    onToggle: d,
+    size: o,
+    allowShapeTransformation: h
   }) => ({
-    button: h(
+    button: p(
       " relative cursor-pointer group outline-none inline-block flex  justify-center   items-center  ",
-      a === "xSmall" && "text-label-large px-3 py-1.5 gap-1",
-      a === "small" && "text-label-large px-4 py-2.5 gap-2",
-      a === "medium" && "text-title-medium px-6 py-4 gap-2",
-      a === "large" && "text-headline-small px-12 py-8 gap-3",
-      a === "xLarge" && "text-headline-large px-16 py-12 gap-4",
+      o === "xSmall" && "text-label-large px-3 py-1.5 gap-1",
+      o === "small" && "text-label-large px-4 py-2.5 gap-2",
+      o === "medium" && "text-title-medium px-6 py-4 gap-2",
+      o === "large" && "text-headline-small px-12 py-8 gap-3",
+      o === "xLarge" && "text-headline-large px-16 py-12 gap-4",
       s === "rounded" && {
-        "rounded-[30px]": a === "xSmall" || a == "small",
-        "rounded-[40px]": a === "medium",
-        "rounded-[70px]": a === "large" || a == "xLarge"
+        "rounded-[30px]": o === "xSmall" || o == "small",
+        "rounded-[40px]": o === "medium",
+        "rounded-[70px]": o === "large" || o == "xLarge"
       },
-      (s === "squared" || p && c) && {
-        "rounded-[12px]": a === "xSmall" || a == "small",
-        "rounded-[16px]": a === "medium",
-        "rounded-[28px]": a === "large" || a == "xLarge"
+      (s === "squared" || h && i) && {
+        "rounded-[12px]": o === "xSmall" || o == "small",
+        "rounded-[16px]": o === "medium",
+        "rounded-[28px]": o === "large" || o == "xLarge"
       },
-      p && !n && {
-        "active:rounded-[12px]": a === "xSmall" || a == "small",
-        "active:rounded-[16px]": a === "medium",
-        "active:rounded-[28px]": a === "large" || a == "xLarge"
+      h && !n && {
+        "active:rounded-[12px]": o === "xSmall" || o == "small",
+        "active:rounded-[16px]": o === "medium",
+        "active:rounded-[28px]": o === "large" || o == "xLarge"
       },
       e === "elevated" && {
         "shadow-1 hover:shadow-2": !n,
-        "bg-surface-container-low text-primary": !n && !c,
-        "bg-primary text-on-primary": !n && c,
+        "bg-surface-container-low text-primary": !n && !i,
+        "bg-primary text-on-primary": !n && i,
         "text-on-surface/[38%]": n
       },
       e === "filled" && {
         "hover:shadow-1": !n,
-        "bg-surface-container text-on-surface-variant": !n && !c && u,
-        "bg-primary text-on-primary": !n && (c && u || !u),
+        "bg-surface-container text-on-surface-variant": !n && !i && d,
+        "bg-primary text-on-primary": !n && (i && d || !d),
         "text-on-surface/[38%]": n
       },
       e === "tonal" && {
         "hover:shadow-1": !n,
-        "bg-secondary-container text-on-secondary-container": !n && !c,
-        "bg-secondary text-on-secondary": !n && c,
+        "bg-secondary-container text-on-secondary-container": !n && !i,
+        "bg-secondary text-on-secondary": !n && i,
         "text-on-surface/[0.38]": n
       },
       e === "outlined" && [
         " border",
         {
           "border-on-surface/[0.12] text-on-surface/[0.38]": n,
-          "text-primary border-outline focus:border-primary": !n && !c,
-          "text-inverse-on-surface bg-inverse-surface border-inverse-surface": !n && c
+          "text-primary border-outline focus:border-primary": !n && !i,
+          "text-inverse-on-surface bg-inverse-surface border-inverse-surface": !n && i
         }
       ],
       e === "text" && [
@@ -133,11 +132,11 @@ const Oe = (e) => {
           "text-on-surface/[0.38]": n
         },
         t && [
-          a === "xSmall" && "-mx-3 ",
-          a === "small" && "-mx-4 ",
-          a === "medium" && "-mx-6 ",
-          a === "large" && "-mx-12",
-          a === "xLarge" && "-mx-16 "
+          o === "xSmall" && "-mx-3 ",
+          o === "small" && "-mx-4 ",
+          o === "medium" && "-mx-6 ",
+          o === "large" && "-mx-12",
+          o === "xLarge" && "-mx-16 "
           // size === 'small' && ' -my-2.5',
           // size === 'medium' && ' -my-4',
           // size === 'large' && '-my-8',
@@ -146,10 +145,10 @@ const Oe = (e) => {
       ],
       n && "cursor-default"
     ),
-    touchTarget: h(
+    touchTarget: p(
       "absolute -translate-x-1/2 -translate-y-1/2 left-1/2 top-1/2 h-12 w-full"
     ),
-    stateLayer: h(
+    stateLayer: p(
       "min-h-full min-w-full absolute top-0 left-0 overflow-hidden",
       e === "elevated" && {
         "bg-on-surface/[0.12]": n,
@@ -157,23 +156,23 @@ const Oe = (e) => {
       },
       e === "filled" && {
         "bg-on-surface/[0.12]": n,
-        "group-state-on-primary": !n && !u,
-        "group-state-on-surface-variant": !n && u
+        "group-state-on-primary": !n && !d,
+        "group-state-on-surface-variant": !n && d
       },
       s === "rounded" && {
-        "rounded-[30px]": a === "xSmall" || a == "small",
-        "rounded-[40px]": a === "medium",
-        "rounded-[70px]": a === "large" || a == "xLarge"
+        "rounded-[30px]": o === "xSmall" || o == "small",
+        "rounded-[40px]": o === "medium",
+        "rounded-[70px]": o === "large" || o == "xLarge"
       },
-      (s === "squared" || p && c) && {
-        "rounded-[12px]": a === "xSmall" || a == "small",
-        "rounded-[16px]": a === "medium",
-        "rounded-[28px]": a === "large" || a == "xLarge"
+      (s === "squared" || h && i) && {
+        "rounded-[12px]": o === "xSmall" || o == "small",
+        "rounded-[16px]": o === "medium",
+        "rounded-[28px]": o === "large" || o == "xLarge"
       },
-      p && !n && {
-        "group-active:rounded-[12px]": a === "xSmall" || a == "small",
-        "group-active:rounded-[16px]": a === "medium",
-        "group-active:rounded-[28px]": a === "large" || a == "xLarge"
+      h && !n && {
+        "group-active:rounded-[12px]": o === "xSmall" || o == "small",
+        "group-active:rounded-[16px]": o === "medium",
+        "group-active:rounded-[28px]": o === "large" || o == "xLarge"
       },
       e === "tonal" && {
         "bg-on-surface/[0.12]": n,
@@ -186,49 +185,50 @@ const Oe = (e) => {
         "group-state-primary": !n
       }
     ),
-    label: h({ invisible: i }),
-    icon: h(
-      { invisible: i },
-      a === "xSmall" && "size-5",
-      a === "small" && "size-5",
-      a === "medium" && "size-6",
-      a === "large" && "size-8",
-      a === "xLarge" && "size-10"
+    label: p({ invisible: c }),
+    icon: p(
+      { invisible: c },
+      o === "xSmall" && "size-5",
+      o === "small" && "size-5",
+      o === "medium" && "size-6",
+      o === "large" && "size-8",
+      o === "xLarge" && "size-10"
     )
   })
-), Xe = j(
+), at = G(
   "card",
   ({ variant: e, isInteractive: t }) => ({
-    card: h(
+    card: p(
       "group/card rounded-xl overflow-hidden z-10",
       e === "outlined" && "bg-surface border border-outline-variant",
       e === "elevated" && "bg-surface-container-low shadow-1",
       e === "filled" && "bg-surface-container-highest"
     ),
-    stateLayer: h([
+    stateLayer: p([
       "w-full top-0 left-0 h-full absolute -z-10",
       {
         " group-hover/card:hover-state-on-surface group-focus-visible/card:focus-state-on-surface": t
       }
     ])
   })
-), Ye = j(
+), st = G(
   "carouselItem",
-  () => ({
-    carouselItem: h("rounded-[28px] overflow-hidden flex-none")
+  ({ width: e }) => ({
+    carouselItem: p("rounded-[28px] overflow-hidden flex-none", {
+      hidden: e === void 0,
+      "flex-1": e == null
+    })
   })
-), je = j(
+), ct = G(
   "carousel",
   () => ({
-    carousel: h(["w-full h-[400px]"]),
-    track: h(
-      "grid grid-flow-col h-full transition-transform  ease-out w-fit"
-    )
+    carousel: p(["w-full h-[400px]"]),
+    track: p("flex h-full w-full")
   })
-), qe = j(
+), it = G(
   "divider",
   ({ orientation: e }) => ({
-    divider: h(
+    divider: p(
       "border-outline-variant ",
       {
         "h-fit w-full border-t": e === "horizontal"
@@ -238,10 +238,10 @@ const Oe = (e) => {
       }
     )
   })
-), _e = j(
+), ut = G(
   "fab",
   ({ size: e, variant: t, isExtended: n }) => ({
-    fab: h(
+    fab: p(
       "flex shadow-3 hover:shadow-4 group overflow-hidden outline-none items-center cursor-pointer",
       {
         "rounded-[12px]": e == "small" && !n,
@@ -262,20 +262,20 @@ const Oe = (e) => {
       t === "secondary" && "text-on-secondary-container",
       t === "tertiary" && "text-on-tertiary-container"
     ),
-    stateLayer: h(
+    stateLayer: p(
       "absolute w-full h-full overflow-hidden left-1/2 top-1/2 transform -translate-y-1/2 -translate-x-1/2",
       t === "surface" && "group-hover:hover-state-primary group-focus:focus-state-primary",
       t === "primary" && "group-hover:hover-state-on-primary-container group-focus-visible:focus-state-on-primary-container",
       t === "secondary" && "group-hover:hover-state-on-secondary-container group-focus-visible:focus-state-on-secondary-container",
       t === "tertiary" && "group-hover:hover-state-on-tertiary-container group-focus-visible:focus-state-on-tertiary-container"
     ),
-    icon: h({
+    icon: p({
       "size-6": e == "small" || e == "medium" || n,
       "size-9": e == "large" && !n
     }),
-    label: h("text-title-medium text-nowrap")
+    label: p("text-title-medium text-nowrap")
   })
-), Ke = j(
+), dt = G(
   "iconButton",
   ({
     variant: e,
@@ -283,30 +283,30 @@ const Oe = (e) => {
     onToggle: n,
     isActive: l,
     size: r,
-    width: c,
-    shape: i,
+    width: i,
+    shape: c,
     allowShapeTransformation: s
   }) => ({
-    iconButton: h(
+    iconButton: p(
       "rounded-full relative flex transition-all duration-300",
       "group cursor-pointer",
       {
         "cursor-default": t
       },
-      (i === "rounded" || i === "squared" && n && !t && l && s) && {
+      c === "rounded" && {
         "rounded-[30px]": r === "xSmall" || r == "small",
         "rounded-[40px]": r === "medium",
         "rounded-[70px]": r === "large" || r == "xLarge"
       },
-      (i === "squared" || i === "rounded" && n && !t && l && s) && {
+      (c === "squared" || s && l) && {
         "rounded-[12px]": r === "xSmall" || r == "small",
         "rounded-[16px]": r === "medium",
         "rounded-[28px]": r === "large" || r == "xLarge"
       },
       s && !t && {
-        "group-active:rounded-[12px]": r === "xSmall" || r == "small",
-        "group-active:rounded-[16px]": r === "medium",
-        "group-active:rounded-[28px]": r === "large" || r == "xLarge"
+        "active:rounded-[12px]": r === "xSmall" || r == "small",
+        "active:rounded-[16px]": r === "medium",
+        "active:rounded-[28px]": r === "large" || r == "xLarge"
       },
       e === "filled" && [
         !t && {
@@ -333,17 +333,17 @@ const Oe = (e) => {
         }
       ]
     ),
-    touchTarget: h(
+    touchTarget: p(
       "absolute -translate-x-1/2 -translate-y-1/2 left-1/2 top-1/2 h-12 w-full"
     ),
-    stateLayer: h(
+    stateLayer: p(
       "absolute top-0 left-0 h-full w-full overflow-hidden",
-      (i === "rounded" || i === "squared" && n && !t && l && s) && {
+      (c === "rounded" || c === "squared" && n && !t && l && s) && {
         "rounded-[30px]": r === "xSmall" || r == "small",
         "rounded-[40px]": r === "medium",
         "rounded-[70px]": r === "large" || r == "xLarge"
       },
-      (i === "squared" || i === "rounded" && n && !t && l && s) && {
+      (c === "squared" || c === "rounded" && n && !t && l && s) && {
         "rounded-[12px]": r === "xSmall" || r == "small",
         "rounded-[16px]": r === "medium",
         "rounded-[28px]": r === "large" || r == "xLarge"
@@ -372,21 +372,21 @@ const Oe = (e) => {
         }
       ]
     ),
-    icon: h(
+    icon: p(
       "  transition-all duration-300",
       { "size-5 p-1.5": r === "xSmall" },
       { "size-6 p-2": r === "small" },
       { "size-6 p-4": r === "medium" },
       { "size-8 p-8": r === "large" },
       { "size-10 p-12": r === "xLarge" },
-      c == "narrow" && [
+      i == "narrow" && [
         { "px-1": r === "xSmall" },
         { "px-1": r === "small" },
         { "px-3": r === "medium" },
         { "px-4": r === "large" },
         { "px-8": r === "xLarge" }
       ],
-      c == "wide" && [
+      i == "wide" && [
         { "px-2.5": r === "xSmall" },
         { "px-3.5": r === "small" },
         { "px-6": r === "medium" },
@@ -414,17 +414,17 @@ const Oe = (e) => {
       !!t && "text-on-surface/[0.38]"
     )
   })
-), Ge = j(
+), ft = G(
   "progressIndicator",
   ({ variant: e, isVisible: t }) => ({
-    progressIndicator: h(
+    progressIndicator: p(
       (e === "linear-determinate" || e == "linear-indeterminate") && "flex w-full h-1"
     ),
-    track: h("h-full rounded-full bg-primary rounded-l-full", {
+    track: p("h-full rounded-full bg-primary rounded-l-full", {
       "max-h-0": !t,
       "max-h-full": t
     }),
-    activeIndicator: h(
+    activeIndicator: p(
       {
         "max-h-0": !t,
         "max-h-full": t
@@ -438,7 +438,7 @@ const Oe = (e) => {
         }
       ]
     ),
-    stop: h(
+    stop: p(
       "absolute top-1/2 -translate-y-1/2 right-0 bg-primary rounded-full size-1",
       {
         "max-h-0": !t,
@@ -446,10 +446,10 @@ const Oe = (e) => {
       }
     )
   })
-), Je = j(
+), mt = G(
   "slideSheet",
   ({ variant: e, position: t }) => ({
-    slideSheet: h(
+    slideSheet: p(
       "bg-surface flex justify-between  max-w-xs z-10",
       {
         "flex-row-reverse": t == "right",
@@ -463,53 +463,53 @@ const Oe = (e) => {
         }
       ]
     ),
-    container: h("w-full overflow-hidden", {}),
-    content: h("w-fit "),
-    header: h("p-4 flex items-center gap-2"),
-    title: h("text-on-surface-variant text-title-large"),
-    closeButton: h("ml-auto"),
-    divider: h({ hidden: e == "modal" }),
-    overlay: h(
+    container: p("w-full overflow-hidden", {}),
+    content: p("w-fit "),
+    header: p("p-4 flex items-center gap-2"),
+    title: p("text-on-surface-variant text-title-large"),
+    closeButton: p("ml-auto"),
+    divider: p({ hidden: e == "modal" }),
+    overlay: p(
       "bg-[black]/[0.32] fixed top-0 left-0 w-screen h-screen"
     )
   })
-), Ze = j(
+), ht = G(
   "slider",
   ({ isChanging: e }) => ({
-    slider: h([
+    slider: p([
       "relative w-full h-11 flex items-center rounded gap-x-1.5 cursor-pointer min-w-32"
     ]),
-    activeTrack: h([
+    activeTrack: p([
       "h-4 relative transition-all duration-100 bg-primary overflow-hidden rounded-l-full "
     ]),
-    inactiveTrack: h([
+    inactiveTrack: p([
       "h-4 relative transition-all duration-100 bg-primary-container rounded-r-full overflow-hidden"
     ]),
-    handle: h([
-      "transform transition-all duration-100 bg-primary h-full rounded-full ",
+    handle: p([
+      "transform relative transition-all duration-100 bg-primary h-full rounded-full ",
       { "w-0.5": e, "w-1": !e }
     ]),
-    valueIndicator: h([
+    valueIndicator: p([
       "absolute select-none bg-inverse-surface text-inverse-on-surface py-3 px-4 text-label-large rounded-full bottom-[calc(100%+4px)] transform left-1/2 -translate-x-1/2"
     ]),
-    dot: h([
+    dot: p([
       "h-1 w-1 absolute transform -translate-y-1/2 -translate-x-1/2 top-1/2 rounded-full"
     ])
   })
-), Qe = j(
+), pt = G(
   "snackbar",
   () => ({
-    snackbar: h(" rounded bg-inverse-surface "),
-    container: h(
+    snackbar: p(" rounded bg-inverse-surface "),
+    container: p(
       "pl-4 pr-2 max-w-full py-1 flex items-center flex-wrap"
     ),
-    supportingText: h("text-body-medium text-inverse-on-surface "),
-    icon: h(" ml-auto mr-0 text-inverse-on-surface block dark")
+    supportingText: p("text-body-medium text-inverse-on-surface "),
+    icon: p(" ml-auto mr-0 text-inverse-on-surface block dark")
   })
-), ze = j(
+), yt = G(
   "switch",
   ({ isSelected: e, disabled: t, inactiveIcon: n }) => ({
-    switch: h(
+    switch: p(
       "group w-[52px] h-[32px] outline-none rounded-full  border-2 flex items-center",
       { "bg-on-surface/[0.12] border-transparent": t },
       !t && [
@@ -520,12 +520,12 @@ const Oe = (e) => {
       // { 'justify-start': !isSelected },
       // { 'justify-end': isSelected },
     ),
-    handleContainer: h(
+    handleContainer: p(
       "flex items-center justify-center absolute",
       { "left-[14px]": !e },
       { "right-[14px]": e }
     ),
-    handle: h(
+    handle: p(
       "transition-all duration-100  z-10 rounded-full  flex items-center justify-center",
       { "w-[16px] h-[16px]": !e && !n },
       { "w-[24px] h-[24px]": !(!e && !n) },
@@ -536,11 +536,11 @@ const Oe = (e) => {
       ],
       { "bg-surface": t }
     ),
-    handleStateLayer: h(
+    handleStateLayer: p(
       "w-[40px] h-[40px] -z-10 rounded-full absolute",
       { "group-state-primary": !t }
     ),
-    icon: h(
+    icon: p(
       "w-[16px] h-[16px]",
       !t && [
         { "text-on-primary-container": e },
@@ -549,16 +549,16 @@ const Oe = (e) => {
       { "text-on-surface/[0.38]": t }
     )
   })
-), Te = j(
+), xt = G(
   "tab",
   ({ isSelected: e, icon: t, label: n, variant: l }) => ({
-    tab: h(
+    tab: p(
       "flex-1 group outline-none flex px-4 justify-center items-center cursor-pointer",
       { "z-10": e },
       !!(t && n) && l === "primary" && "h-16",
       !(t && n && l === "primary") && "h-12"
     ),
-    stateLayer: h(
+    stateLayer: p(
       "absolute w-full h-full overflow-hidden left-1/2 top-1/2 transform -translate-y-1/2 -translate-x-1/2",
       l === "primary" && {
         "group-hover:hover-state-on-surface group-focus-visible:focus-state-on-surface": !e,
@@ -566,7 +566,7 @@ const Oe = (e) => {
       },
       l === "secondary" && "group-hover:hover-state-on-surface group-focus-visible:focus-state-on-surface"
     ),
-    content: h(
+    content: p(
       "flex  gap-0.5 h-full justify-center",
       {
         relative: l == "primary"
@@ -580,7 +580,7 @@ const Oe = (e) => {
         "flex-row items-center gap-2": !!(n && t)
       }
     ),
-    icon: h(
+    icon: p(
       "h-6 w-6 p-0.5 !box-border",
       l === "primary" && {
         "text-on-surface-variant": !e,
@@ -591,7 +591,7 @@ const Oe = (e) => {
         "text-on-surface": e
       }
     ),
-    label: h(
+    label: p(
       "text-title-small  text-nowrap",
       l === "primary" && {
         "text-on-surface-variant": !e,
@@ -602,22 +602,22 @@ const Oe = (e) => {
         "text-on-surface": e
       }
     ),
-    underline: h(
+    underline: p(
       "bg-primary  absolute w-full left-0 bottom-0",
       l === "primary" && "h-[3px] rounded-t",
       l === "secondary" && "h-0.5"
     )
   })
-), et = j(
+), vt = G(
   "tabs",
   ({ scrollable: e }) => ({
-    tabs: h(
+    tabs: p(
       "border-b border-surface-container-highest bg-surface",
       "flex relative ",
       { "overflow-x-auto": e }
     )
   })
-), tt = j(
+), wt = G(
   "textField",
   ({
     disabled: e,
@@ -625,21 +625,21 @@ const Oe = (e) => {
     trailingIcon: n,
     variant: l,
     errorText: r,
-    isFocused: c,
-    value: i,
+    isFocused: i,
+    value: c,
     suffix: s,
-    textLine: u
+    textLine: d
   }) => ({
-    textField: h({
+    textField: p({
       "opacity-[.38]": e
     }),
-    content: h(
+    content: p(
       "group  transition-border duration-200 relative  flex  items-center ",
-      { "h-14": u == "singleLine" },
+      { "h-14": d == "singleLine" },
       {
-        "border-on-surface-variant": !(r != null && r.length) && !c && l == "filled",
-        "border-outline": !(r != null && r.length) && !c && l == "outlined",
-        "border-primary": !(r != null && r.length) && c,
+        "border-on-surface-variant": !(r != null && r.length) && !i && l == "filled",
+        "border-outline": !(r != null && r.length) && !i && l == "outlined",
+        "border-primary": !(r != null && r.length) && i,
         "border-error": !!(r != null && r.length)
       },
       { "bg-on-surface/[0.04]": e },
@@ -650,28 +650,28 @@ const Oe = (e) => {
       l == "outlined" && [
         "border rounded box-border",
         {
-          "border-[3px]": c
+          "border-[3px]": i
         }
       ]
     ),
-    stateLayer: h(
+    stateLayer: p(
       "absolute -z-10 w-full h-full top-0 left-0",
       {
         hidden: l == "outlined"
       },
       {
         "group-state-on-surface": !e,
-        "focus-state-on-surface": c
+        "focus-state-on-surface": i
       }
     ),
-    label: h(
+    label: p(
       "inline-flex outline-none  whitespace-nowrap",
       { "text-on-surface-variant": !e && !(r != null && r.length) },
       { "text-on-surface": e },
       { "text-error": !!(r != null && r.length) },
-      { "text-primary": !(r != null && r.length) && c }
+      { "text-primary": !(r != null && r.length) && i }
     ),
-    input: h(
+    input: p(
       "w-full resize-none px-4 text-body-large bg-[inherit] outline-none autofill:transition-colors autofill:duration-[5000000ms]",
       {
         " text-on-surface placeholder:text-on-surface-variant": !e,
@@ -683,39 +683,39 @@ const Oe = (e) => {
       l == "filled" && " pb-2 pt-6",
       l == "outlined" && "py-4 relative z-10"
     ),
-    activeIndicator: h(
+    activeIndicator: p(
       "absolute w-0 inset-x-0 border-rounded mx-auto bottom-0",
       l == "filled" && [
         "h-[2px] transition-all duration-300",
         { "bg-primary": !(r != null && r.length) },
         { "bg-error": !!(r != null && r.length) },
-        { "!w-full": c }
+        { "!w-full": i }
       ]
     ),
-    supportingText: h(
+    supportingText: p(
       " text-body-small px-4 pt-1",
       { "text-on-surface-variant": !e && !(r != null && r.length) },
       { "text-on-surface": e },
-      { "!w-full": c },
+      { "!w-full": i },
       { "text-error": !!(r != null && r.length) }
     ),
-    leadingIcon: h([
+    leadingIcon: p([
       "h-12 ml-3 flex items-center justify-center",
-      { "cursor-text": !K.isValidElement(t) }
+      { "cursor-text": !te.isValidElement(t) }
     ]),
-    trailingIcon: h("h-12 w-12 flex items-center justify-center", {
-      "cursor-text": !K.isValidElement(n)
+    trailingIcon: p("h-12 w-12 flex items-center justify-center", {
+      "cursor-text": !te.isValidElement(n)
     }),
-    suffix: h(
+    suffix: p(
       "text-on-surface-variant pl-0 pr-4",
       l == "filled" && " pb-2 pt-6",
       l == "outlined" && "py-4 relative z-10"
     )
   })
-), nt = j(
+), gt = G(
   "toolTip",
   ({ position: e, variant: t }) => ({
-    toolTip: h(
+    toolTip: p(
       " pointer-events-auto w-max z-10  absolute  m-1 w-max-content max-w-[312px]",
       {
         "bottom-full left-1/2 -translate-x-1/2": e == "top",
@@ -728,51 +728,51 @@ const Oe = (e) => {
         "top-full left-full": e == "bottom-right"
       }
     ),
-    container: h(
+    container: p(
       "pb-2",
       t == "rich" && "bg-surface-container rounded-2xl text-on-surface-container px-4 pt-3 shadow-2",
       t == "plain" && "bg-inverse-surface rounded text-inverse-on-surface px-2 py-1"
     ),
-    actions: h(
+    actions: p(
       "flex gap-10 px-1 mt-2",
       t == "plain" && "hidden"
     ),
-    subHead: h(
+    subHead: p(
       "text-title-small mb-1",
       t == "plain" && "hidden"
     ),
-    supportingText: h("")
+    supportingText: p("")
   })
-), Z = ({ icon: e, colors: t = [], className: n }) => {
+), ie = ({ icon: e, colors: t = [], className: n }) => {
   if (typeof e == "string") {
-    let a = e;
-    return t[0] && (a = a.replace(
+    let o = e;
+    return t[0] && (o = o.replace(
       /<svg([^>]*)>/,
       `<svg$1 fill="${t[0]}" color="${t[0]}">`
-    ), a = a.replace(
+    ), o = o.replace(
       /<path([^>]*?)>/g,
       '<path$1 fill="currentColor">'
     )), /* @__PURE__ */ f(
       "div",
       {
-        className: h(
+        className: p(
           "size-5 box-content inline-flex fill-current",
           n
         ),
         style: { color: t[0] || "inherit" },
-        dangerouslySetInnerHTML: { __html: a }
+        dangerouslySetInnerHTML: { __html: o }
       }
     );
   }
   if (e && typeof e == "object" && "src" in e) {
-    const a = e;
+    const o = e;
     return /* @__PURE__ */ f(
       "img",
       {
-        src: a.src,
-        width: a.width,
-        height: a.height,
-        className: h("size-5 box-content", n),
+        src: o.src,
+        width: o.width,
+        height: o.height,
+        className: p("size-5 box-content", n),
         style: {
           filter: t[0] ? "brightness(0) saturate(100%) invert(1)" : void 0
         },
@@ -784,15 +784,15 @@ const Oe = (e) => {
   const l = e;
   if (!(l != null && l.prefix))
     throw new Error(`Invalid icon type: ${typeof e}`);
-  const { icon: r } = l, [c, i, , , s] = r || [], u = (a) => {
-    switch (a.length) {
+  const { icon: r } = l, [i, c, , , s] = r || [], d = (o) => {
+    switch (o.length) {
       case 2:
         return {
-          "--fa-primary-color": a[0] || "inherit",
-          "--fa-secondary-color": a[1] || "inherit"
+          "--fa-primary-color": o[0] || "inherit",
+          "--fa-secondary-color": o[1] || "inherit"
         };
       case 1:
-        return { color: a[0] };
+        return { color: o[0] };
       default:
         return {};
     }
@@ -800,74 +800,74 @@ const Oe = (e) => {
   return /* @__PURE__ */ f(
     "svg",
     {
-      className: h("size-5 box-content", n),
-      style: { ...u(t) },
+      className: p("size-5 box-content", n),
+      style: { ...d(t) },
       xmlns: "http://www.w3.org/2000/svg",
-      viewBox: `0 0 ${c} ${i}`,
+      viewBox: `0 0 ${i} ${c}`,
       role: "img",
       "aria-hidden": "true",
-      children: typeof s == "string" ? /* @__PURE__ */ f("path", { className: "fill-current", d: s }) : s.map((a, p) => /* @__PURE__ */ f("path", { d: a }, p))
+      children: typeof s == "string" ? /* @__PURE__ */ f("path", { className: "fill-current", d: s }) : s.map((o, h) => /* @__PURE__ */ f("path", { d: o }, h))
     }
   );
-}, rt = ({
+}, bt = ({
   variant: e = "linear-determinate",
   value: t = 0,
   transitionDuration: n = 1e3,
   className: l,
   ...r
 }) => {
-  const [c, i] = S(t), [s] = S(1.5);
-  R(() => {
-    t > 100 && (t = 100), t < 0 && (t = 0), i(t);
+  const [i, c] = D(t), [s] = D(1.5);
+  $(() => {
+    t > 100 && (t = 100), t < 0 && (t = 0), c(t);
   }, [t]);
-  const [u, a] = S(!0), p = () => u ? s : s * 0.5;
-  R(() => {
-    if ((e === "circular-indeterminate" || e === "linear-indeterminate") && c !== 100) {
-      const y = setInterval(() => {
-        i(u ? 10 : 90), a(!u);
-      }, p() * 1e3);
-      return () => clearInterval(y);
+  const [d, o] = D(!0), h = () => d ? s : s * 0.5;
+  $(() => {
+    if ((e === "circular-indeterminate" || e === "linear-indeterminate") && i !== 100) {
+      const m = setInterval(() => {
+        c(d ? 10 : 90), o(!d);
+      }, h() * 1e3);
+      return () => clearInterval(m);
     }
-  }, [e, u, c]);
-  const [m, o] = S(!1);
-  R(() => {
-    if (c >= 100) {
-      const y = setTimeout(() => {
-        o(!1);
+  }, [e, d, i]);
+  const [y, a] = D(!1);
+  $(() => {
+    if (i >= 100) {
+      const m = setTimeout(() => {
+        a(!1);
       }, n);
       return () => {
-        clearTimeout(y);
+        clearTimeout(m);
       };
     } else
-      o(!0);
-  }, [c, n]);
-  const d = Ge({
+      a(!0);
+  }, [i, n]);
+  const u = ft({
     className: l,
     variant: e,
     value: t,
     transitionDuration: n,
-    isVisible: m
+    isVisible: y
   });
-  return /* @__PURE__ */ A(te, { children: [
-    (e === "linear-determinate" || e == "linear-indeterminate") && /* @__PURE__ */ A("div", { className: d.progressIndicator, ...r, children: [
+  return /* @__PURE__ */ Y(ye, { children: [
+    (e === "linear-determinate" || e == "linear-indeterminate") && /* @__PURE__ */ Y("div", { className: u.progressIndicator, ...r, children: [
       /* @__PURE__ */ f(
         "div",
         {
           style: {
-            width: `${c}%`,
-            transition: `width ${n}ms ease-in-out ${c == 100 ? ", max-height 200ms 0.5s ease-in-out" : ""}`
+            width: `${i}%`,
+            transition: `width ${n}ms ease-in-out ${i == 100 ? ", max-height 200ms 0.5s ease-in-out" : ""}`
           },
-          className: d.track
+          className: u.track
         }
       ),
       /* @__PURE__ */ f(
         "div",
         {
           style: {
-            marginLeft: c != 100 ? "6px" : "0px",
-            transition: `width ${n}ms ease-in-out ${c == 100 ? `, max-height 200ms 0.5s ease-in-out, margin-left ${n}ms ${n / 1.5}ms` : ""}`
+            marginLeft: i != 100 ? "6px" : "0px",
+            transition: `width ${n}ms ease-in-out ${i == 100 ? `, max-height 200ms 0.5s ease-in-out, margin-left ${n}ms ${n / 1.5}ms` : ""}`
           },
-          className: d.activeIndicator
+          className: u.activeIndicator
         }
       ),
       /* @__PURE__ */ f(
@@ -877,12 +877,12 @@ const Oe = (e) => {
             width: "4 px",
             transition: `width ${n}ms ease-in-out, max-height 200ms 0.5s ease-in-out`
           },
-          className: d.stop
+          className: u.stop
         }
       )
     ] }),
     (e === "circular-determinate" || e == "circular-indeterminate") && /* @__PURE__ */ f(
-      H.svg,
+      j.svg,
       {
         width: "48",
         height: "48",
@@ -891,46 +891,46 @@ const Oe = (e) => {
         animate: { rotate: 270 },
         transition: {
           repeat: 1 / 0,
-          duration: p(),
+          duration: h(),
           ease: "linear"
         },
-        className: d.progressIndicator,
+        className: u.progressIndicator,
         ...r,
         children: /* @__PURE__ */ f(
-          H.circle,
+          j.circle,
           {
             cx: "50%",
             cy: "50%",
-            r: m ? "calc(50% - 2px)" : "50%",
+            r: y ? "calc(50% - 2px)" : "50%",
             style: {
               strokeLinecap: "round"
             },
             initial: "hidden",
             animate: "visible",
-            className: d.activeIndicator,
+            className: u.activeIndicator,
             variants: {
               hidden: {
-                pathLength: u ? 10 / 100 : 90 / 100
+                pathLength: d ? 10 / 100 : 90 / 100
               },
               visible: {
-                pathLength: u ? 90 / 100 : 10 / 100
+                pathLength: d ? 90 / 100 : 10 / 100
               }
             },
             transition: {
               pathLength: {
                 type: "tween",
                 ease: "linear",
-                duration: p(),
+                duration: h(),
                 bounce: 0
               }
             }
           }
         )
       },
-      u + ""
+      d + ""
     )
   ] });
-}, re = ({
+}, ve = ({
   colorName: e = "on-surface",
   triggerRef: t
 }) => {
@@ -951,29 +951,29 @@ const Oe = (e) => {
         borderRadius: { duration: 0.3, delay: 0.3 }
       }
     }
-  }, [l, r] = S(!0), [c, i] = S(!1), [s, u] = S({ x: 0, y: 0 });
-  R(() => {
-    c && (r(!0), r(!1));
-  }, [c]), R(() => {
-    const o = t == null ? void 0 : t.current;
-    if (o)
-      return o.addEventListener("mousedown", a), o.addEventListener("mouseup", m), o.addEventListener("mouseleave", p), () => {
-        o.removeEventListener("mousedown", a), o.removeEventListener("mouseup", m), o.removeEventListener("mouseleave", p);
+  }, [l, r] = D(!0), [i, c] = D(!1), [s, d] = D({ x: 0, y: 0 });
+  $(() => {
+    i && (r(!0), r(!1));
+  }, [i]), $(() => {
+    const a = t == null ? void 0 : t.current;
+    if (a)
+      return a.addEventListener("mousedown", o), a.addEventListener("mouseup", y), a.addEventListener("mouseleave", h), () => {
+        a.removeEventListener("mousedown", o), a.removeEventListener("mouseup", y), a.removeEventListener("mouseleave", h);
       };
   }, [t]);
-  const a = (o) => {
-    const d = t == null ? void 0 : t.current, y = d.getBoundingClientRect();
-    i(!0), u({
-      x: (o.clientX - y.left) / d.clientWidth * 100,
-      y: (o.clientY - y.top) / d.clientHeight * 100
+  const o = (a) => {
+    const u = t == null ? void 0 : t.current, m = u.getBoundingClientRect();
+    c(!0), d({
+      x: (a.clientX - m.left) / u.clientWidth * 100,
+      y: (a.clientY - m.top) / u.clientHeight * 100
     });
-  }, p = (o) => {
-    i(!1);
-  }, m = (o) => {
-    i(!1);
+  }, h = (a) => {
+    c(!1);
+  }, y = (a) => {
+    c(!1);
   };
-  return /* @__PURE__ */ f(Q, { mode: "wait", children: (c || !c && !l) && /* @__PURE__ */ f(
-    H.div,
+  return /* @__PURE__ */ f(ue, { mode: "wait", children: (i || !i && !l) && /* @__PURE__ */ f(
+    j.div,
     {
       style: {
         position: "absolute",
@@ -992,10 +992,10 @@ const Oe = (e) => {
       className: "transform -translate-x-1/2 -translate-y-1/2"
     }
   ) });
-}, ot = j(
+}, Lt = G(
   "customScroll",
   ({ orientation: e, draggable: t, isDragging: n }) => ({
-    customScroll: h(
+    customScroll: p(
       "flex h-full w-full",
       t && [
         "[&::-webkit-scrollbar-track]:rounded-full",
@@ -1015,160 +1015,228 @@ const Oe = (e) => {
         "cursor-grabbing": t && n
       }
     ),
-    track: h("overflow-hidden flex-none sticky", {
+    track: p("overflow-hidden flex-none sticky", {
       "left-0 h-full": e === "horizontal",
       "top-0 w-full": e === "vertical"
     })
   })
-), lt = ({
+);
+function Nt(e, t) {
+  let n = 0, l = null, r = null;
+  const i = (c, s) => {
+    n = Date.now(), t(c, s);
+  };
+  return (c, s) => {
+    const d = Date.now(), o = e - (d - n);
+    o <= 0 ? (l && (clearTimeout(l), l = null), i(c, s)) : (r = { v: c, o: s }, l || (l = setTimeout(() => {
+      l = null;
+      const h = r;
+      r = null, h && i(h.v, h.o);
+    }, o)));
+  };
+}
+const Et = ({
   children: e,
   orientation: t = "vertical",
   scrollSize: n,
   onScroll: l,
   className: r,
-  draggable: c = !1,
-  throttleDuration: i = 75
+  draggable: i = !1,
+  throttleDuration: c = 75,
+  scroll: s,
+  setScroll: d
 }) => {
-  var P, F;
-  const s = D(null), u = D(null), [a, p] = S({
+  var ae, de;
+  const o = P(null), h = P(null), [y, a] = D({
     width: null,
     height: null
   });
-  R(() => {
-    if (!s.current) return;
-    const $ = new ResizeObserver((O) => {
-      for (const U of O)
-        U.target === s.current && p({
-          width: U.contentRect.width,
-          height: U.contentRect.height
+  $(() => {
+    if (!o.current) return;
+    const I = new ResizeObserver((v) => {
+      for (const B of v)
+        B.target === o.current && a({
+          width: B.contentRect.width,
+          height: B.contentRect.height
           // On observe aussi la hauteur maintenant
         });
     });
-    return $.observe(s.current), () => {
-      $.disconnect();
+    return I.observe(o.current), () => {
+      I.disconnect();
     };
-  }, [s]);
-  const m = D(null), o = D(null), d = () => {
-    const $ = u.current;
-    return $ ? {
-      width: n ?? $.scrollWidth,
-      height: n ?? $.scrollHeight
+  }, [o]);
+  const u = P(null), m = P(null), b = () => {
+    const I = h.current;
+    return I ? {
+      width: n ?? I.scrollWidth,
+      height: n ?? I.scrollHeight
     } : null;
-  }, y = () => {
-    const $ = s.current;
-    return $ ? {
-      width: $.clientWidth,
-      height: $.clientHeight
+  }, w = () => {
+    const I = o.current;
+    return I ? {
+      width: I.clientWidth,
+      height: I.clientHeight
       // Correction ici pour retourner la bonne hauteur
     } : null;
-  }, { scrollYProgress: v, scrollXProgress: w } = Me({
-    container: s
-  }), E = D(null);
-  E.current || (E.current = Re(
-    i,
-    ($, O) => {
-      !o.current || !m.current || !s.current || l && (t === "horizontal" && O === "x" && l({
-        scrollProgress: $,
-        scroll: $ * (m.current.width - s.current.clientWidth),
-        scrollTotal: m.current.width - s.current.clientWidth,
-        scrollVisible: o.current.width
-      }), t === "vertical" && O === "y" && l({
-        scrollProgress: $,
-        scroll: $ * (m.current.height - s.current.clientHeight),
-        scrollTotal: m.current.height - s.current.clientHeight,
-        scrollVisible: o.current.height
-      }));
+  }, { scrollYProgress: M, scrollXProgress: g } = Ge({
+    container: o
+  }), R = P(null);
+  R.current || (R.current = Nt(
+    c,
+    (I, v) => {
+      !m.current || !u.current || !o.current || (v === (t === "horizontal" ? "x" : "y") && (d == null || d(I)), l && (t === "horizontal" && v === "x" && l({
+        scrollProgress: I,
+        scroll: I * (u.current.width - o.current.clientWidth),
+        scrollTotal: u.current.width - o.current.clientWidth,
+        scrollVisible: m.current.width
+      }), t === "vertical" && v === "y" && l({
+        scrollProgress: I,
+        scroll: I * (u.current.height - o.current.clientHeight),
+        scrollTotal: u.current.height - o.current.clientHeight,
+        scrollVisible: m.current.height
+      })));
     }
   ));
-  const L = ($, O) => {
-    E.current && E.current($, O);
+  const N = (I, v) => {
+    R.current && R.current(I, v);
   };
-  R(() => {
-    a.width && L(w.get(), "x"), a.height && L(v.get(), "y");
-  }, [a]), fe(w, "change", ($) => {
-    L($, "x");
-  }), fe(v, "change", ($) => {
-    L($, "y");
+  $(() => {
+    y.width && N(g.get(), "x"), y.height && N(M.get(), "y");
+  }, [y]), $(() => {
+    const I = o.current, v = h.current;
+    if (!I || !v || typeof s != "number") return;
+    const B = (H, V, le) => Math.min(le, Math.max(V, H));
+    if (t === "horizontal") {
+      const H = Math.max(0, (n ?? v.scrollWidth) - I.clientWidth);
+      I.scrollLeft = B(s * H, 0, H);
+    } else {
+      const H = Math.max(0, (n ?? v.scrollHeight) - I.clientHeight);
+      I.scrollTop = B(s * H, 0, H);
+    }
+  }, [s, t, n]), Re(g, "change", (I) => {
+    N(I, "x");
+  }), Re(M, "change", (I) => {
+    N(I, "y");
   });
-  const [B, N] = S(!1);
-  we(() => {
-    B || !o.current || !m.current || !l || (l({
+  const [A, L] = D(!1);
+  Ve(() => {
+    A || !m.current || !u.current || !l || (l({
       scrollProgress: 0,
       scroll: 0,
-      scrollTotal: t == "vertical" ? m.current.height : m.current.width,
-      scrollVisible: t == "vertical" ? o.current.height : o.current.width
-    }), N(!0));
-  }, [o, m, l]), m.current = d(), o.current = y();
-  const [I, M] = S(!1), V = ot({
-    isDragging: I,
+      scrollTotal: t == "vertical" ? u.current.height : u.current.width,
+      scrollVisible: t == "vertical" ? m.current.height : m.current.width
+    }), L(!0));
+  }, [m, u, l]), u.current = b(), m.current = w();
+  const [O, F] = D(!1), C = Lt({
+    isDragging: O,
     children: e,
     className: r,
     onScroll: l,
     orientation: t,
     scrollSize: n,
-    draggable: c,
-    throttleDuration: i
-  }), [W, k] = S(0), [g, C] = S(0), X = ($) => {
-    if (!c) return;
-    const O = s.current;
-    if (!O || W == null) return;
-    const J = ($.pageX - O.offsetLeft - W) * 1.5;
-    O.scrollLeft = g - J;
-  }, q = ($) => {
-    const O = s.current;
-    O && (M(!0), k($.pageX - O.offsetLeft), C(O.scrollLeft));
-  }, G = ($) => {
-    I && ($.preventDefault(), X($));
-  }, Y = () => {
-    M(!1);
-  }, z = () => {
-    M(!1);
-  }, b = ($) => {
-    $.preventDefault();
-  }, x = D(null);
-  return R(() => () => {
-    x.current && clearTimeout(x.current);
-  }, []), /* @__PURE__ */ A(
+    draggable: i,
+    throttleDuration: c
+  }), [x, k] = D(0), [U, J] = D(0), re = (I) => {
+    if (!i) return;
+    const v = o.current;
+    if (!v || x == null) return;
+    const H = (I.pageX - v.offsetLeft - x) * 1.5;
+    v.scrollLeft = U - H;
+  }, _ = (I) => {
+    const v = o.current;
+    v && (F(!0), k(I.pageX - v.offsetLeft), J(v.scrollLeft));
+  }, oe = (I) => {
+    O && (I.preventDefault(), re(I));
+  }, S = () => {
+    F(!1);
+  }, E = () => {
+    F(!1);
+  }, X = (I) => {
+    I.preventDefault();
+  }, q = P(null);
+  return $(() => () => {
+    q.current && clearTimeout(q.current);
+  }, []), $(() => {
+    const I = o.current;
+    if (!I) return;
+    const v = (B) => {
+      var se, ne, T, ce;
+      const H = B.detail, V = o.current;
+      if (!V || !H) return;
+      const le = H.orientation ?? t;
+      if (typeof H.progress == "number")
+        if (le === "horizontal") {
+          const ee = Math.max(
+            0,
+            (((se = u.current) == null ? void 0 : se.width) ?? 0) - V.clientWidth
+          );
+          V.scrollLeft = Math.min(ee, Math.max(0, H.progress * ee));
+        } else {
+          const ee = Math.max(
+            0,
+            (((ne = u.current) == null ? void 0 : ne.height) ?? 0) - V.clientHeight
+          );
+          V.scrollTop = Math.min(ee, Math.max(0, H.progress * ee));
+        }
+      else if (typeof H.scroll == "number")
+        if (le === "horizontal") {
+          const ee = Math.max(
+            0,
+            (((T = u.current) == null ? void 0 : T.width) ?? 0) - V.clientWidth
+          );
+          V.scrollLeft = Math.min(ee, Math.max(0, H.scroll));
+        } else {
+          const ee = Math.max(
+            0,
+            (((ce = u.current) == null ? void 0 : ce.height) ?? 0) - V.clientHeight
+          );
+          V.scrollTop = Math.min(ee, Math.max(0, H.scroll));
+        }
+    };
+    return I.addEventListener("udx:customScroll:set", v), () => {
+      I.removeEventListener("udx:customScroll:set", v);
+    };
+  }, [t]), /* @__PURE__ */ Y(
     "div",
     {
-      className: V.customScroll,
-      ref: s,
-      onMouseDown: q,
-      onMouseMove: G,
-      onMouseUp: Y,
-      onMouseLeave: z,
-      onDragStart: b,
-      onScroll: ($) => {
-        I || (k(null), M(!0), x.current && clearTimeout(x.current), x.current = setTimeout(() => {
-          M(!1);
+      className: C.customScroll,
+      ref: o,
+      onMouseDown: _,
+      onMouseMove: oe,
+      onMouseUp: S,
+      onMouseLeave: E,
+      onDragStart: X,
+      onScroll: (I) => {
+        O || (k(null), F(!0), q.current && clearTimeout(q.current), q.current = setTimeout(() => {
+          F(!1);
         }, 1e3));
       },
       children: [
         /* @__PURE__ */ f(
           "div",
           {
-            ref: u,
-            style: t === "vertical" ? { height: ((P = o == null ? void 0 : o.current) == null ? void 0 : P.height) ?? "100%" } : { width: ((F = o == null ? void 0 : o.current) == null ? void 0 : F.width) ?? "100%" },
-            className: V.track,
+            ref: h,
+            style: t === "vertical" ? { height: ((ae = m == null ? void 0 : m.current) == null ? void 0 : ae.height) ?? "100%" } : { width: ((de = m == null ? void 0 : m.current) == null ? void 0 : de.width) ?? "100%" },
+            className: C.track,
             children: e
           }
         ),
-        o.current && m.current && /* @__PURE__ */ A(te, { children: [
-          t === "vertical" && m.current.height > o.current.height && /* @__PURE__ */ f(
-            H.div,
+        m.current && u.current && /* @__PURE__ */ Y(ye, { children: [
+          t === "vertical" && u.current.height > m.current.height && /* @__PURE__ */ f(
+            j.div,
             {
               className: "flex-none",
               style: {
-                height: m.current.height - o.current.height
+                height: u.current.height - m.current.height
               }
             }
           ),
-          t === "horizontal" && m.current.width > o.current.width && /* @__PURE__ */ f(
-            H.div,
+          t === "horizontal" && u.current.width > m.current.width && /* @__PURE__ */ f(
+            j.div,
             {
               className: "flex-none",
               style: {
-                width: m.current.width - o.current.width
+                width: u.current.width - m.current.width
               }
             }
           )
@@ -1176,48 +1244,48 @@ const Oe = (e) => {
       ]
     }
   );
-}, at = ({
+}, It = ({
   onScroll: e,
   el: t,
   touch: n = !0
 }) => {
-  const l = D(null), r = D(0), c = D(0);
-  R(() => {
+  const l = P(null), r = P(0), i = P(0);
+  $(() => {
     if (!t) return;
-    r.current = t.scrollTop, c.current = t.scrollLeft;
-    const i = (o) => {
-      e == null || e(o);
-    }, s = (o) => {
-      o.preventDefault(), i({
+    r.current = t.scrollTop, i.current = t.scrollLeft;
+    const c = (a) => {
+      e == null || e(a);
+    }, s = (a) => {
+      a.preventDefault(), c({
         type: "intent",
         source: "wheel",
-        deltaX: o.deltaX,
-        deltaY: o.deltaY,
-        originalEvent: o
+        deltaX: a.deltaX,
+        deltaY: a.deltaY,
+        originalEvent: a
       });
-    }, u = (o) => {
+    }, d = (a) => {
       if (!n) return;
-      const d = o.touches[0];
-      d && (l.current = { x: d.clientX, y: d.clientY });
-    }, a = (o) => {
+      const u = a.touches[0];
+      u && (l.current = { x: u.clientX, y: u.clientY });
+    }, o = (a) => {
       if (!n) return;
-      const d = o.touches[0];
-      if (!d || !l.current) return;
-      o.preventDefault();
-      const y = l.current.x - d.clientX, v = l.current.y - d.clientY;
-      l.current = { x: d.clientX, y: d.clientY }, i({
+      const u = a.touches[0];
+      if (!u || !l.current) return;
+      a.preventDefault();
+      const m = l.current.x - u.clientX, b = l.current.y - u.clientY;
+      l.current = { x: u.clientX, y: u.clientY }, c({
         type: "intent",
         source: "touch",
-        deltaX: y,
-        deltaY: v,
-        originalEvent: o
+        deltaX: m,
+        deltaY: b,
+        originalEvent: a
       });
-    }, p = () => {
+    }, h = () => {
       n && (l.current = null);
-    }, m = (o) => {
-      const y = t.clientHeight * 0.9;
-      let v = 0, w = 0;
-      switch (o.key) {
+    }, y = (a) => {
+      const m = t.clientHeight * 0.9;
+      let b = 0, w = 0;
+      switch (a.key) {
         case "ArrowDown":
           w = 40;
           break;
@@ -1225,16 +1293,16 @@ const Oe = (e) => {
           w = -40;
           break;
         case "ArrowRight":
-          v = 40;
+          b = 40;
           break;
         case "ArrowLeft":
-          v = -40;
+          b = -40;
           break;
         case "PageDown":
-          w = y;
+          w = m;
           break;
         case "PageUp":
-          w = -y;
+          w = -m;
           break;
         case "Home":
           w = Number.NEGATIVE_INFINITY;
@@ -1243,86 +1311,86 @@ const Oe = (e) => {
           w = Number.POSITIVE_INFINITY;
           break;
         case " ":
-          w = o.shiftKey ? -y : y;
+          w = a.shiftKey ? -m : m;
           break;
         default:
           return;
       }
-      o.preventDefault(), i({
+      a.preventDefault(), c({
         type: "intent",
         source: "keyboard",
-        deltaX: v,
+        deltaX: b,
         deltaY: w,
-        originalEvent: o
+        originalEvent: a
       });
     };
-    return t.addEventListener("wheel", s, { passive: !1 }), t.addEventListener("touchstart", u, { passive: !0 }), t.addEventListener("touchmove", a, { passive: !1 }), t.addEventListener("touchend", p, { passive: !0 }), t.addEventListener("keydown", m), () => {
-      t.removeEventListener("wheel", s), t.removeEventListener("touchstart", u), t.removeEventListener("touchmove", a), t.removeEventListener("touchend", p), t.removeEventListener("keydown", m);
+    return t.addEventListener("wheel", s, { passive: !1 }), t.addEventListener("touchstart", d, { passive: !0 }), t.addEventListener("touchmove", o, { passive: !1 }), t.addEventListener("touchend", h, { passive: !0 }), t.addEventListener("keydown", y), () => {
+      t.removeEventListener("wheel", s), t.removeEventListener("touchstart", d), t.removeEventListener("touchmove", o), t.removeEventListener("touchend", h), t.removeEventListener("keydown", y);
     };
   }, [e]);
-}, Ot = ({
+}, rn = ({
   transition: e,
   orientation: t = "vertical",
   throttleDuration: n = 25
 }) => {
-  const [l, r] = S(0), [c, i] = S(), s = D(!1), u = D(), a = D(0);
-  R(() => {
-    i(document);
-    const o = document.documentElement.scrollTop;
-    r(o), a.current = o;
-  }, []), R(() => {
-    const o = () => {
+  const [l, r] = D(0), [i, c] = D(), s = P(!1), d = P(), o = P(0);
+  $(() => {
+    c(document);
+    const a = document.documentElement.scrollTop;
+    r(a), o.current = a;
+  }, []), $(() => {
+    const a = () => {
       s.current || r(document.documentElement.scrollTop);
     };
-    return c == null || c.addEventListener("scroll", o), () => {
-      u.current && clearTimeout(u.current), c == null || c.removeEventListener("scroll", o);
+    return i == null || i.addEventListener("scroll", a), () => {
+      d.current && clearTimeout(d.current), i == null || i.removeEventListener("scroll", a);
     };
-  }, [c]);
-  const p = D(), m = D(null);
-  return R(() => {
-    const o = l;
-    if (m.current && (m.current.stop(), m.current = null), !s.current) {
-      p.current = o;
+  }, [i]);
+  const h = P(), y = P(null);
+  return $(() => {
+    const a = l;
+    if (y.current && (y.current.stop(), y.current = null), !s.current) {
+      h.current = a;
       return;
     }
-    return m.current = Be(p.current ?? o, o, {
+    return y.current = Ze(h.current ?? a, a, {
       duration: ((e == null ? void 0 : e.duration) ?? 500) / 1e3,
       ease: (e == null ? void 0 : e.ease) ?? "easeOut",
-      onUpdate: (d) => {
-        u.current && clearTimeout(u.current), p.current = d;
-        const y = document.documentElement, v = Math.round(d * 1e3) / 1e3, w = a.current;
-        Math.abs(v - w) < 0.1 || (a.current = v, s.current && y.scrollTo({ top: v }));
+      onUpdate: (u) => {
+        d.current && clearTimeout(d.current), h.current = u;
+        const m = document.documentElement, b = Math.round(u * 1e3) / 1e3, w = o.current;
+        Math.abs(b - w) < 0.1 || (o.current = b, s.current && m.scrollTo({ top: b }));
       },
       onComplete: () => {
-        u.current = setTimeout(() => {
+        d.current = setTimeout(() => {
           s.current = !1;
-        }, 300), m.current = null;
+        }, 300), y.current = null;
       }
     }), () => {
-      m.current && (m.current.stop(), m.current = null);
+      y.current && (y.current.stop(), y.current = null);
     };
-  }, [l]), c ? /* @__PURE__ */ f(
-    at,
+  }, [l]), i ? /* @__PURE__ */ f(
+    It,
     {
       touch: !1,
-      el: c,
-      onScroll: (o) => {
-        if ("deltaY" in o && o.deltaY !== 0 && c && l !== null) {
-          let d = l + o.deltaY;
-          const y = c.querySelector("html");
-          y && (d = Math.min(d, y.scrollHeight - y.clientHeight)), d = Math.max(d, 0), r(d), s.current = !0;
+      el: i,
+      onScroll: (a) => {
+        if ("deltaY" in a && a.deltaY !== 0 && i && l !== null) {
+          let u = l + a.deltaY;
+          const m = i.querySelector("html");
+          m && (u = Math.min(u, m.scrollHeight - m.clientHeight)), u = Math.max(u, 0), r(u), s.current = !0;
         }
       }
     }
   ) : null;
-}, st = ({
+}, kt = ({
   targetRef: e,
   children: t
 }) => {
-  const [n, l] = S(null), r = D(null), c = () => {
-    const i = e.current;
-    if (!i) return;
-    const s = i.getBoundingClientRect();
+  const [n, l] = D(null), r = P(null), i = () => {
+    const c = e.current;
+    if (!c) return;
+    const s = c.getBoundingClientRect();
     l({
       position: "fixed",
       top: s.top,
@@ -1335,69 +1403,69 @@ const Oe = (e) => {
       // personnalise si besoin
     });
   };
-  return R(() => {
-    const i = e.current;
-    if (i)
-      return c(), window.addEventListener("scroll", c, !0), window.addEventListener("resize", c), r.current = new ResizeObserver(c), r.current.observe(i), () => {
+  return $(() => {
+    const c = e.current;
+    if (c)
+      return i(), window.addEventListener("scroll", i, !0), window.addEventListener("resize", i), r.current = new ResizeObserver(i), r.current.observe(c), () => {
         var s;
-        window.removeEventListener("scroll", c, !0), window.removeEventListener("resize", c), (s = r.current) == null || s.disconnect();
+        window.removeEventListener("scroll", i, !0), window.removeEventListener("resize", i), (s = r.current) == null || s.disconnect();
       };
-  }, [e]), n ? xe(/* @__PURE__ */ f("div", { style: n, children: t }), document.body) : null;
+  }, [e]), n ? Fe(/* @__PURE__ */ f("div", { style: n, children: t }), document.body) : null;
 };
-function ct(e) {
+function Mt(e) {
   return /^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/.test(e);
 }
-const Ut = ({
+const on = ({
   config: e,
   throttleDelay: t = 100,
   // Délai par défaut de 300ms
   onLoad: n,
   loadTheme: l = !1
 }) => {
-  const [r, c] = S(null);
-  R(() => {
+  const [r, i] = D(null);
+  $(() => {
     (async () => {
-      const o = await De(e, l);
-      c(o);
+      const a = await Qe(e, l);
+      i(a);
     })();
   }, []);
-  const [i, s] = S(null), u = D(null), a = D(0), p = D(null);
-  R(() => {
+  const [c, s] = D(null), d = P(null), o = P(0), h = P(null);
+  $(() => {
     if (!r) return;
-    const o = {
+    const a = {
       ...e,
       // Assurer la compatibilité avec l'API qui attend sourceColorHex
       sourceColor: e.sourceColor
-    }, d = Date.now(), y = d - a.current, v = async (w) => {
-      await m(w);
+    }, u = Date.now(), m = u - o.current, b = async (w) => {
+      await y(w);
     };
-    if (a.current === 0 || y >= t)
-      u.current && (clearTimeout(u.current), u.current = null), p.current = null, a.current = d, v(o);
-    else if (p.current = o, !u.current) {
-      const w = Math.max(0, t - y);
-      u.current = setTimeout(async () => {
-        u.current = null;
-        const E = p.current;
-        p.current = null, E && (a.current = Date.now(), await v(E));
+    if (o.current === 0 || m >= t)
+      d.current && (clearTimeout(d.current), d.current = null), h.current = null, o.current = u, b(a);
+    else if (h.current = a, !d.current) {
+      const w = Math.max(0, t - m);
+      d.current = setTimeout(async () => {
+        d.current = null;
+        const M = h.current;
+        h.current = null, M && (o.current = Date.now(), await b(M));
       }, w);
     }
     return () => {
     };
   }, [e, t, r]);
-  const m = async (o) => {
-    if (typeof o.sourceColor == "string" && !ct(o.sourceColor))
+  const y = async (a) => {
+    if (typeof a.sourceColor == "string" && !Mt(a.sourceColor))
       throw new Error("Invalid hex color");
     if (!r)
       return;
-    r.context.update(o), await r.load();
-    const d = r == null ? void 0 : r.plugins.getPlugin(be).getInstance().outputCss;
-    s(d), n == null || n(r);
+    r.context.update(a), await r.load();
+    const u = r == null ? void 0 : r.plugins.getPlugin(Xe).getInstance().outputCss;
+    s(u), n == null || n(r);
   };
-  return R(() => () => {
-    u.current && (clearTimeout(u.current), u.current = null);
-  }, []), i ? /* @__PURE__ */ f("style", { dangerouslySetInnerHTML: { __html: i } }) : null;
+  return $(() => () => {
+    d.current && (clearTimeout(d.current), d.current = null);
+  }, []), c ? /* @__PURE__ */ f("style", { dangerouslySetInnerHTML: { __html: c } }) : null;
 };
-function it() {
+function St() {
   if (typeof window > "u") return !1;
   try {
     if (window.CSS && typeof window.CSS.supports == "function")
@@ -1407,42 +1475,42 @@ function it() {
   }
   return !1;
 }
-function ut() {
+function $t() {
   return typeof window > "u" || !("matchMedia" in window) ? !1 : window.matchMedia("(prefers-reduced-motion: reduce)").matches;
 }
-function ce(e) {
+function Me(e) {
   if (!(e instanceof HTMLElement)) return !1;
   const t = e.classList;
   return Array.from(t).some(
     (n) => n.startsWith("anim-") && n.includes("scroll")
   );
 }
-function he(e) {
+function We(e) {
   if (!(e instanceof HTMLElement)) return !1;
   const t = e.classList;
   return Array.from(t).some((n) => n.startsWith("anim-"));
 }
-function le(e, t) {
-  if (!ce(e)) return;
+function Ee(e, t) {
+  if (!Me(e)) return;
   if (e.hasAttribute(`data-${t}-scroll`)) {
-    const i = (e.getAttribute(`data-${t}-scroll`) || "").trim().toLowerCase(), s = i === "x" || i === "inline" ? "inline" : i === "y" || i === "block" ? "block" : "auto";
+    const c = (e.getAttribute(`data-${t}-scroll`) || "").trim().toLowerCase(), s = c === "x" || c === "inline" ? "inline" : c === "y" || c === "block" ? "block" : "auto";
     e.classList.contains(`${t}-timeline`) || e.classList.contains(`${t}-timeline-inline`) || e.classList.contains(`${t}-timeline-block`) || e.classList.contains(`${t}-timeline-x`) || e.classList.contains(`${t}-timeline-y`) || (s === "inline" ? e.classList.add(`${t}-timeline-inline`) : s === "block" ? e.classList.add(`${t}-timeline-block`) : e.classList.add(`${t}-scroll`));
   }
   const n = e.getAttribute(`data-${t}-start`);
   n && e.style.setProperty(`--${t}-range-start`, n);
   const l = e.getAttribute(`data-${t}-end`);
   l && e.style.setProperty(`--${t}-range-end`, l);
-  const r = e.hasAttribute(`data-${t}-paused`) || e.classList.contains(`${t}-paused`), c = e.hasAttribute(`data-${t}-run`) || e.classList.contains(`${t}-run`);
-  !r && !c && e.setAttribute(`data-${t}-run`, "");
+  const r = e.hasAttribute(`data-${t}-paused`) || e.classList.contains(`${t}-paused`), i = e.hasAttribute(`data-${t}-run`) || e.classList.contains(`${t}-run`);
+  !r && !i && e.setAttribute(`data-${t}-run`, "");
 }
-function ae(e = document, t) {
+function Ie(e = document, t) {
   return Array.from(
     e.querySelectorAll(
       `[class*="${t}-"][class*="-scroll"]`
     )
-  ).filter((l) => ce(l));
+  ).filter((l) => Me(l));
 }
-function dt(e = document, t) {
+function Ct(e = document, t) {
   const n = Array.from(
     e.querySelectorAll(`[class*="${t}-"]`)
   ), l = /* @__PURE__ */ new Set([
@@ -1461,63 +1529,63 @@ function dt(e = document, t) {
   ]);
   return n.filter((r) => {
     if (!(r instanceof HTMLElement)) return !1;
-    const c = r.classList;
-    return c.contains(`${t}-in`) || c.contains(`${t}-out`) || Array.from(c).some(
-      (u) => u.startsWith(`${t}-`) && !u.includes("scroll") && !l.has(u)
-    ) ? !0 : !ce(r);
+    const i = r.classList;
+    return i.contains(`${t}-in`) || i.contains(`${t}-out`) || Array.from(i).some(
+      (d) => d.startsWith(`${t}-`) && !d.includes("scroll") && !l.has(d)
+    ) ? !0 : !Me(r);
   });
 }
-function pe(e, t, n) {
+function Be(e, t, n) {
   e.setAttribute(`data-${t}-run`, ""), e.setAttribute(`data-${t}-${n}-run`, "");
 }
-function ft(e, t) {
+function Dt(e, t) {
   const n = e.style.animationName;
   e.style.animationName = "none", e.removeAttribute(`data-${t}-run`), e.removeAttribute(`data-${t}-in-run`), e.removeAttribute(`data-${t}-out-run`), e.offsetWidth, e.style.animationName = n;
 }
-const mt = [0, 0.2];
-function Ne(e = {}) {
+const Rt = [0, 0.2];
+function Ue(e = {}) {
   const { prefix: t = "anim", once: n = !0 } = e;
-  if (ut())
+  if ($t())
     return () => {
     };
-  const l = it(), r = /* @__PURE__ */ new WeakSet(), c = new IntersectionObserver(
-    (p) => {
-      for (const m of p) {
-        const o = m.target;
-        if (!he(o)) continue;
-        const d = o.classList.contains(`${t}-out`);
-        !d && m.isIntersecting ? (pe(o, t, "in"), n && c.unobserve(o)) : d && !m.isIntersecting ? (pe(o, t, "out"), n && c.unobserve(o)) : n || ft(o, t);
+  const l = St(), r = /* @__PURE__ */ new WeakSet(), i = new IntersectionObserver(
+    (h) => {
+      for (const y of h) {
+        const a = y.target;
+        if (!We(a)) continue;
+        const u = a.classList.contains(`${t}-out`);
+        !u && y.isIntersecting ? (Be(a, t, "in"), n && i.unobserve(a)) : u && !y.isIntersecting ? (Be(a, t, "out"), n && i.unobserve(a)) : n || Dt(a, t);
       }
     },
-    { threshold: mt }
-  ), i = (p) => {
-    const m = dt(p || document, t);
-    for (const o of m)
-      r.has(o) || (r.add(o), c.observe(o));
+    { threshold: Rt }
+  ), c = (h) => {
+    const y = Ct(h || document, t);
+    for (const a of y)
+      r.has(a) || (r.add(a), i.observe(a));
   };
-  i();
-  let s, u = null, a = null;
+  c();
+  let s, d = null, o = null;
   if (l)
     (() => {
-      a == null && (a = requestAnimationFrame(() => {
-        a = null;
-        const m = ae(void 0, t);
-        for (const o of m) le(o, t);
+      o == null && (o = requestAnimationFrame(() => {
+        o = null;
+        const y = Ie(void 0, t);
+        for (const a of y) Ee(a, t);
       }));
-    })(), u = new MutationObserver((m) => {
-      for (const o of m)
-        if (o.type === "attributes") {
-          const d = o.target;
-          d instanceof HTMLElement && (le(d, t), he(d) && (r.has(d) || (r.add(d), c.observe(d))));
-        } else if (o.type === "childList" && o.addedNodes && o.addedNodes.length) {
-          for (const d of Array.from(o.addedNodes))
-            if (d instanceof HTMLElement) {
-              const y = ae(d, t);
-              for (const v of y) le(v, t);
-              i(d);
+    })(), d = new MutationObserver((y) => {
+      for (const a of y)
+        if (a.type === "attributes") {
+          const u = a.target;
+          u instanceof HTMLElement && (Ee(u, t), We(u) && (r.has(u) || (r.add(u), i.observe(u))));
+        } else if (a.type === "childList" && a.addedNodes && a.addedNodes.length) {
+          for (const u of Array.from(a.addedNodes))
+            if (u instanceof HTMLElement) {
+              const m = Ie(u, t);
+              for (const b of m) Ee(b, t);
+              c(u);
             }
         }
-    }), u.observe(document.documentElement, {
+    }), d.observe(document.documentElement, {
       subtree: !0,
       childList: !0,
       attributes: !0,
@@ -1530,114 +1598,114 @@ function Ne(e = {}) {
         `data-${t}-run`
       ]
     }), s = () => {
-      a != null && cancelAnimationFrame(a), u && u.disconnect();
+      o != null && cancelAnimationFrame(o), d && d.disconnect();
     };
   else {
-    let p;
-    ae(void 0, t).length > 0 && import("./scrollDriven-AP2yWhzi.js").then((o) => {
-      p = o.initScrollViewFallback({ once: n });
+    let h;
+    Ie(void 0, t).length > 0 && import("./scrollDriven-AP2yWhzi.js").then((a) => {
+      h = a.initScrollViewFallback({ once: n });
     }), s = () => {
-      typeof p == "function" && p();
+      typeof h == "function" && h();
     };
   }
   return () => {
-    s && s(), c.disconnect();
+    s && s(), i.disconnect();
   };
 }
-const Xt = Ne, Yt = Ne, ht = ({
+const ln = Ue, an = Ue, Wt = ({
   variant: e = "filled",
   disabled: t = !1,
   icon: n,
   href: l,
   label: r,
-  disableTextMargins: c,
-  className: i,
+  disableTextMargins: i,
+  className: c,
   iconPosition: s = "left",
-  loading: u = !1,
-  shape: a = "rounded",
-  onClick: p,
-  onToggle: m,
-  activated: o,
-  ref: d,
-  size: y = "medium",
-  allowShapeTransformation: v = !0,
+  loading: d = !1,
+  shape: o = "rounded",
+  onClick: h,
+  onToggle: y,
+  activated: a,
+  ref: u,
+  size: m = "medium",
+  allowShapeTransformation: b = !0,
   transition: w,
-  children: E,
-  ...L
+  children: M,
+  ...g
 }) => {
-  if (E && (r = E), !r)
+  if (M && (r = M), !r)
     throw new Error(
       "Button component requires either a label prop or children content"
     );
-  const B = l ? "a" : "button", N = D(null), I = d || N, [M, V] = K.useState(o);
-  R(() => {
-    V(o);
-  }, [o]), w = { duration: 0.3, ...w };
-  let W;
-  m ? m && (W = (C) => {
-    t && C.preventDefault();
-    const X = !M;
-    V(X), m(X);
-  }) : W = (C) => {
-    t && C.preventDefault(), p && p(C);
+  const R = l ? "a" : "button", N = P(null), A = u || N, [L, O] = te.useState(a);
+  $(() => {
+    O(a);
+  }, [a]), w = { duration: 0.3, ...w };
+  let F;
+  y ? y && (F = (k) => {
+    t && k.preventDefault();
+    const U = !L;
+    O(U), y(U);
+  }) : F = (k) => {
+    t && k.preventDefault(), h && h(k);
   };
-  const k = Ue({
-    allowShapeTransformation: v,
-    size: y,
-    disableTextMargins: c,
-    shape: a,
+  const C = lt({
+    allowShapeTransformation: b,
+    size: m,
+    disableTextMargins: i,
+    shape: o,
     href: l,
     disabled: t,
     icon: n,
     iconPosition: s,
-    loading: u,
+    loading: d,
     variant: e,
     transition: w,
-    className: i,
-    isActive: M ?? !1,
-    onToggle: m,
-    activated: M,
+    className: c,
+    isActive: L ?? !1,
+    onToggle: y,
+    activated: L,
     label: r,
     children: r
-  }), g = n ? /* @__PURE__ */ f(Z, { icon: n, className: k.icon }) : /* @__PURE__ */ f(te, {});
-  return /* @__PURE__ */ A(
-    B,
+  }), x = n ? /* @__PURE__ */ f(ie, { icon: n, className: C.icon }) : /* @__PURE__ */ f(ye, {});
+  return /* @__PURE__ */ Y(
+    R,
     {
-      ref: I,
+      ref: A,
       href: l,
-      className: k.button,
-      ...L,
-      onClick: W,
+      className: C.button,
+      ...g,
+      onClick: F,
       disabled: t,
-      "aria-pressed": m ? M : void 0,
+      "aria-pressed": y ? L : void 0,
       style: { transition: w.duration + "s" },
       children: [
-        /* @__PURE__ */ f("div", { className: k.touchTarget }),
+        /* @__PURE__ */ f("div", { className: C.touchTarget }),
         /* @__PURE__ */ f(
           "div",
           {
-            className: k.stateLayer,
+            className: C.stateLayer,
             style: { transition: w.duration + "s" },
             children: !t && /* @__PURE__ */ f(
-              re,
+              ve,
               {
-                colorName: e === "filled" && m && "on-surface-variant" || e === "filled" && !m && "on-primary" || e === "elevated" && "primary" || e === "tonal" && "on-secondary-container" || e === "outlined" && "primary" || e === "text" && "primary" || "",
-                triggerRef: I
+                colorName: e === "filled" && y && "on-surface-variant" || e === "filled" && !y && "on-primary" || e === "elevated" && "primary" || e === "tonal" && "on-secondary-container" || e === "outlined" && "primary" || e === "text" && "primary" || "",
+                triggerRef: A
               }
             )
           }
         ),
-        s === "left" && g,
-        u && /* @__PURE__ */ f(
+        s === "left" && x,
+        d && /* @__PURE__ */ f(
           "div",
           {
             className: "!absolute left-1/2 -translate-x-1/2 top-1/2 -translate-y-1/2",
             children: /* @__PURE__ */ f(
-              rt,
+              bt,
               {
                 className: () => ({
                   progressIndicator: "h-6 w-6",
-                  activeIndicator: h(
+                  activeIndicator: p(
                     {
                       "!stroke-primary": e === "elevated" && !t,
                       "!stroke-on-surface/[38%]": e === "elevated" && t
@@ -1665,297 +1733,510 @@ const Xt = Ne, Yt = Ne, ht = ({
             )
           }
         ),
-        /* @__PURE__ */ f("span", { className: k.label, children: r }),
-        s === "right" && g
+        /* @__PURE__ */ f("span", { className: C.label, children: r }),
+        s === "right" && x
       ]
     }
   );
-}, jt = ({
+}, sn = ({
   variant: e = "outlined",
   className: t,
   children: n,
   isInteractive: l = !1,
   ref: r,
-  ...c
+  ...i
 }) => {
-  const i = Xe({ className: t, isInteractive: l, variant: e, children: n }), s = D(null), u = r || s;
-  return /* @__PURE__ */ A("div", { ...c, ref: u, className: i.card, children: [
-    /* @__PURE__ */ f("div", { className: i.stateLayer, children: l && /* @__PURE__ */ f(re, { colorName: "on-surface", triggerRef: u }) }),
+  const c = at({ className: t, isInteractive: l, variant: e, children: n }), s = P(null), d = r || s;
+  return /* @__PURE__ */ Y("div", { ...i, ref: d, className: c.card, children: [
+    /* @__PURE__ */ f("div", { className: c.stateLayer, children: l && /* @__PURE__ */ f(ve, { colorName: "on-surface", triggerRef: d }) }),
     n
   ] });
-}, pt = (e, t, n = [0, 1]) => {
-  const [l, r] = t, [c, i] = n, u = (Math.max(l, Math.min(e, r)) - l) / (r - l);
-  return c + u * (i - c);
-}, yt = ({
+}, fe = (e, t, n = [0, 1]) => {
+  const [l, r] = t, [i, c] = n, d = (Math.max(l, Math.min(e, r)) - l) / (r - l);
+  return i + d * (c - i);
+}, Bt = ({
   className: e,
   children: t,
-  width: n = 1,
+  width: n,
   index: l = 0,
-  ref: r,
+  outputRange: r,
+  ref: i,
   ...c
 }) => {
-  const i = D(null), s = r || i, u = Ye({
+  const s = P(null), d = i || s, o = st({
     className: e,
     index: l,
     width: n,
-    children: t
+    children: t,
+    outputRange: r
   });
   return /* @__PURE__ */ f(
-    H.div,
+    "div",
     {
-      ref: s,
-      animate: { width: n + "px" },
+      ref: d,
+      style: {
+        width: n + "px",
+        maxWidth: r[1] + "px",
+        minWidth: r[0] + "px",
+        willChange: "width"
+      },
       transition: {
         duration: 0.5,
         ease: "linear"
       },
-      className: u.carouselItem,
+      className: o.carouselItem,
       ...c,
       children: t
     }
   );
-}, qt = ({
+}, cn = ({
   variant: e = "hero",
   className: t,
   children: n,
   ref: l,
   marginPourcent: r = 0,
-  inputRange: c = [0.21, 0.65],
-  outputRange: i = [42, 300],
+  inputRange: i = [0.21, 0.65],
+  outputRange: c = [42, 300],
   gap: s = 8,
-  onChange: u,
-  scrollSensitivity: a = 1.25,
-  ...p
+  onChange: d,
+  onMetricsChange: o,
+  index: h,
+  scrollSensitivity: y = 1.25,
+  ...a
 }) => {
-  var Y, z;
-  const m = D(null), o = l || m, d = je({
+  const u = P(null), m = l || u, [b, w] = D(0), M = ct({
+    index: h,
     className: t,
     children: n,
     variant: e,
-    inputRange: c,
-    outputRange: i,
+    inputRange: i,
+    outputRange: c,
     marginPourcent: r,
-    onChange: u,
+    onChange: d,
     gap: s,
-    scrollSensitivity: a
-  }), y = K.Children.toArray(n).filter(
-    (b) => K.isValidElement(b) && b.type === yt
-  ), v = D(null), [w, E] = S([]), [L, B] = S(null), N = () => {
-    var O;
-    if (!v.current || !o.current || !L) return [];
-    const { scrollVisible: b, scrollProgress: x } = L;
-    function P(U, J) {
-      return U.map(
-        (T) => (T - J) / Math.abs(U[1] - U[0])
-      );
+    scrollSensitivity: y
+  }), g = te.Children.toArray(n).filter(
+    (v) => te.isValidElement(v) && v.type === Bt
+  ), R = P(null), [N, A] = D(
+    {}
+  ), [L, O] = D(null), F = P(0), C = P(null), x = () => {
+    var we, me, xe;
+    if (!R.current || !m.current || (L == null ? void 0 : L.scrollProgress) === void 0)
+      return [];
+    const v = (L == null ? void 0 : L.scrollVisible) ?? ((we = m.current) == null ? void 0 : we.clientWidth) ?? 0;
+    function B(W, K) {
+      return W.map((Z, z) => ({
+        itemScrollXCenter: Z,
+        relativeIndex: (Z - K) / Math.abs(W[1] - W[0]),
+        index: z,
+        width: 0
+      }));
     }
-    let F = y.map((U, J) => {
-      if (!I[J].current || !v.current) return 0;
-      let ne = J / (y.length - 1);
-      return ne > 1 && (ne = 1), ne < 0 && (ne = 0), ne;
+    const H = g.map((W, K) => {
+      if (!k[K].current || !R.current) return 0;
+      const z = K / (g.length - 1);
+      return fe(z, [0, 1], [0, 1]);
+    }), V = B(
+      H,
+      (L == null ? void 0 : L.scrollProgress) ?? 0
+    ).sort((W, K) => W.index - K.index);
+    let se = ((((me = m.current) == null ? void 0 : me.clientWidth) ?? v) + s) / (c[1] + s);
+    const ne = V.sort((W, K) => Math.abs(W.relativeIndex) - Math.abs(K.relativeIndex)).map((W, K) => {
+      var z;
+      if (!W) return;
+      K === 0 && J(W.index);
+      const Z = (z = k[W.index]) == null ? void 0 : z.current;
+      if (!(!m.current || !Z) && !(se <= 0))
+        return W.width = c[1], --se, W;
+    }).filter(Boolean).sort((W, K) => W.index - K.index);
+    let T = (((xe = m.current) == null ? void 0 : xe.clientWidth) ?? v) - s;
+    const ce = ne.filter((W, K, Z) => {
+      let z = !1;
+      return W.width == c[1] && (K === 0 || K === Z.length - 1) && (z = !0), z ? !0 : (T -= W.width + s, !1);
+    });
+    ce.forEach((W) => {
+      if (!W) return;
+      const K = fe(
+        1 - Math.abs(L.scrollProgress - W.itemScrollXCenter),
+        [0, 1],
+        [0, 1]
+      );
+      W.width = K;
     });
-    F = P(F, x);
-    let $ = ((((O = o.current) == null ? void 0 : O.clientWidth) ?? b) - (i[0] + s)) / (i[1] + s);
-    return F.map((U, J) => ({ value: Math.abs(U), originalIndex: J })).sort((U, J) => U.value - J.value).forEach((U, J) => {
-      J === 0 && V(U.originalIndex);
-      let T = pt($, [0, 1], [0, i[1]]);
-      T < i[0] && (T = i[0]), $--, F[U.originalIndex] = T;
-    }), F;
-  }, I = D([]).current, [M, V] = S(0);
-  R(() => {
-    u && u(M);
-  }, [M]), I.length !== y.length && y.forEach((b, x) => {
-    I[x] || (I[x] = K.createRef());
+    let ee = 0;
+    return ce.forEach((W, K) => {
+      if (W)
+        if (K == 0) {
+          const Z = fe(
+            W == null ? void 0 : W.relativeIndex,
+            [-2, W.index == 0 ? 0 : -1],
+            [0, 1]
+          );
+          W.index >= 1 && (V.sort((z, Le) => z.index - Le.index), V[W.index - 1].width = c[0], ne.unshift(V[W.index - 1]), T -= c[0] + s, ee = fe(
+            1 - Z,
+            [0, 1],
+            [0, -(c[0] + s)]
+          )), T -= ee, W.width = fe(
+            Z,
+            [0, 1],
+            [c[0], c[1]]
+          ), T -= W.width;
+        } else {
+          let Z = W.index, z = Z == V.length - 1;
+          const Le = Z == V.length - 2;
+          for (; T > 0; ) {
+            const he = V.filter(
+              (ge) => ge.index === Z
+            )[0];
+            if (!he) {
+              if (z)
+                throw new Error("dynamicItem not found");
+              z = !0;
+              break;
+            }
+            if (ne.includes(he) || ne.push(he), he.width = fe(
+              T,
+              [c[0], c[1] + (s + c[0]) * 2],
+              [c[0], c[1]]
+            ), T -= he.width + s, (Le || z) && he.index == V.length - 1) {
+              let ge = 1;
+              for (; T > 0; ) {
+                const Ne = ne[ge], De = fe(
+                  Ne.width + T,
+                  [c[0], c[1]],
+                  [c[0], c[1]]
+                ) - Ne.width;
+                Ne.width += De, T -= De, ge--;
+              }
+              break;
+            } else
+              Z++;
+          }
+        }
+    }), w(ee), Object.fromEntries(
+      ne.map((W) => [W.index, W.width])
+    );
+  }, k = P([]).current, [U, J] = D(0);
+  $(() => {
+    d && d(U);
+  }, [U]), $(() => {
+    typeof h == "number" && g.length > 0 && h !== U && oe(h);
+  }, [h, g.length]), $(() => {
+    _(U);
+  }, [U]), k.length !== g.length && g.forEach((v, B) => {
+    k[B] || (k[B] = te.createRef());
   });
-  const W = y.map((b, x) => K.cloneElement(
-    b,
-    {
-      width: w[x],
-      ref: I[x],
-      key: x,
-      index: x
+  const [re, _] = D(0), oe = (v, B = {}) => {
+    if (!g.length) return 0;
+    const H = k[v];
+    if (!H || !H.current || !R.current) return 0;
+    const V = fe(
+      v / Math.max(1, g.length - 1),
+      [0, 1],
+      [0, 1]
+    );
+    return _(v), R.current.dispatchEvent(
+      new CustomEvent("udx:customScroll:set", {
+        bubbles: !0,
+        detail: {
+          progress: V,
+          orientation: "horizontal",
+          animate: B.animate !== !1
+        }
+      })
+    ), V;
+  }, S = g.map((v, B) => {
+    var se;
+    const H = (se = v.props) == null ? void 0 : se.onClick, V = (ne) => {
+      H == null || H(ne);
+    }, le = () => _(B);
+    return te.cloneElement(
+      v,
+      {
+        width: N[B],
+        outputRange: c,
+        ref: k[B],
+        key: B,
+        index: B,
+        role: "option",
+        "aria-selected": U === B,
+        tabIndex: U === B ? 0 : -1,
+        onClick: V,
+        onFocus: le
+      }
+    );
+  }), E = (v) => {
+    var B;
+    if (v.scrollTotal > 0) {
+      (B = C.current) == null || B.stop();
+      const H = F.current ?? 0, V = v.scrollProgress ?? 0;
+      C.current = Je(H, V, {
+        // Spring tuning to add a bit of inertia and smoothness
+        type: "spring",
+        stiffness: 260,
+        damping: 32,
+        mass: 0.6,
+        restDelta: 5e-4,
+        onUpdate: (le) => {
+          F.current = le, O({ ...v, scrollProgress: le });
+        }
+      });
     }
-  )), k = Ce((L == null ? void 0 : L.scrollProgress) ?? 0), g = me(
-    k,
-    [0, 1],
-    [
-      0,
-      1 - (((Y = o.current) == null ? void 0 : Y.clientWidth) ?? 0) / (((z = v == null ? void 0 : v.current) == null ? void 0 : z.clientWidth) ?? 0)
-    ]
-  ), C = me(
-    g,
-    (b) => `${-b * 100}%`
-  ), X = (b) => {
-    b.scrollTotal > 0 && B(b);
   };
-  R(() => {
-    const b = N();
-    E(b);
+  $(() => {
+    const v = x();
+    A(v);
   }, [L]);
-  const [q, G] = S(0);
-  return we(() => {
-    let b = i[1];
-    L && b > L.scrollVisible && (b = L.scrollVisible);
-    const x = (b + s) * W.length / a;
-    G(x);
-  }, [o, I, L]), /* @__PURE__ */ f("div", { className: d.carousel, ref: o, ...p, children: /* @__PURE__ */ f(
-    lt,
+  const X = P(o);
+  $(() => {
+    X.current = o;
+  }, [o]);
+  const q = P(null);
+  $(() => {
+    var K;
+    const v = X.current;
+    if (!v || !(m != null && m.current)) return;
+    const B = g.length;
+    if (B <= 0) return;
+    const H = ((K = m.current) == null ? void 0 : K.clientWidth) ?? 0, V = c[1], le = F.current ?? (L == null ? void 0 : L.scrollProgress) ?? 0, se = (H + s) / (V + s), ne = Math.max(1, Math.floor(se)), T = Math.max(1, Math.round(ne * (2 / 3))), ce = Math.min(
+      Math.max(0, U),
+      Math.max(0, B - 1)
+    ), ee = ce > 0, we = ce < B - 1, me = {
+      total: B,
+      selectedIndex: ce,
+      visibleApprox: se,
+      visibleFull: ne,
+      stepHalf: T,
+      canPrev: ee,
+      canNext: we,
+      scrollProgress: le,
+      viewportWidth: H,
+      itemMaxWidth: V,
+      gap: s
+    }, xe = q.current;
+    let W = !xe;
+    if (!W) {
+      for (const Z in me)
+        if (me[Z] !== xe[Z]) {
+          W = !0;
+          break;
+        }
+    }
+    W && (q.current = me, v(me));
+  }, [m, g.length, U, L, s, c]), $(() => () => {
+    var v;
+    (v = C.current) == null || v.stop();
+  }, []);
+  const [ae, de] = D(0);
+  Ve(() => {
+    let v = c[1];
+    L && v > L.scrollVisible && (v = L.scrollVisible);
+    const B = (v + s) * S.length / y;
+    de(B);
+  }, [m, k, L]);
+  const I = (v) => {
+    if (!g.length) return;
+    const B = re ?? U;
+    switch (v.key) {
+      case "ArrowLeft":
+        v.preventDefault(), oe(Math.max(0, B - 1));
+        break;
+      case "ArrowRight":
+        v.preventDefault(), oe(Math.min(g.length - 1, B + 1));
+        break;
+      case "Home":
+        v.preventDefault(), oe(0);
+        break;
+      case "End":
+        v.preventDefault(), oe(g.length - 1);
+        break;
+      case "Enter":
+      case " ":
+        v.preventDefault(), oe(B);
+        break;
+    }
+  };
+  return $(() => {
+    const v = m.current;
+    if (!v) return;
+    const B = (H) => {
+      const V = H.detail;
+      V && typeof V.index == "number" && oe(V.index);
+    };
+    return v.addEventListener("udx:carousel:centerIndex", B), () => {
+      v.removeEventListener(
+        "udx:carousel:centerIndex",
+        B
+      );
+    };
+  }, [m, g.length]), /* @__PURE__ */ f(
+    "div",
     {
-      draggable: !0,
-      orientation: "horizontal",
-      onScroll: X,
-      scrollSize: q,
+      className: M.carousel,
+      ref: m,
+      role: "listbox",
+      "aria-orientation": "horizontal",
+      onKeyDown: I,
+      ...a,
       children: /* @__PURE__ */ f(
-        H.div,
+        Et,
         {
-          className: d.track,
-          ref: v,
-          style: {
-            transitionDuration: "0.5s",
-            transitionTimingFunction: "ease-out",
-            gap: `${s}px`,
-            x: C
-          },
-          children: W
+          draggable: !0,
+          orientation: "horizontal",
+          onScroll: E,
+          scrollSize: ae,
+          children: /* @__PURE__ */ f(
+            "div",
+            {
+              className: M.track,
+              ref: R,
+              style: {
+                gap: `${s}px`,
+                translate: b,
+                willChange: "translate"
+              },
+              children: S
+            }
+          )
         }
       )
     }
-  ) });
-}, gt = ({
+  );
+}, Pt = ({
   orientation: e = "horizontal",
   className: t,
   ...n
 }) => {
-  const l = qe({ orientation: e, className: t });
+  const l = it({ orientation: e, className: t });
   return /* @__PURE__ */ f("hr", { className: l.divider, ...n });
-}, _ = [];
+}, Q = [];
 for (let e = 0; e < 256; ++e)
-  _.push((e + 256).toString(16).slice(1));
-function vt(e, t = 0) {
-  return (_[e[t + 0]] + _[e[t + 1]] + _[e[t + 2]] + _[e[t + 3]] + "-" + _[e[t + 4]] + _[e[t + 5]] + "-" + _[e[t + 6]] + _[e[t + 7]] + "-" + _[e[t + 8]] + _[e[t + 9]] + "-" + _[e[t + 10]] + _[e[t + 11]] + _[e[t + 12]] + _[e[t + 13]] + _[e[t + 14]] + _[e[t + 15]]).toLowerCase();
+  Q.push((e + 256).toString(16).slice(1));
+function At(e, t = 0) {
+  return (Q[e[t + 0]] + Q[e[t + 1]] + Q[e[t + 2]] + Q[e[t + 3]] + "-" + Q[e[t + 4]] + Q[e[t + 5]] + "-" + Q[e[t + 6]] + Q[e[t + 7]] + "-" + Q[e[t + 8]] + Q[e[t + 9]] + "-" + Q[e[t + 10]] + Q[e[t + 11]] + Q[e[t + 12]] + Q[e[t + 13]] + Q[e[t + 14]] + Q[e[t + 15]]).toLowerCase();
 }
-let se;
-const wt = new Uint8Array(16);
-function xt() {
-  if (!se) {
+let ke;
+const Ht = new Uint8Array(16);
+function Vt() {
+  if (!ke) {
     if (typeof crypto > "u" || !crypto.getRandomValues)
       throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");
-    se = crypto.getRandomValues.bind(crypto);
+    ke = crypto.getRandomValues.bind(crypto);
   }
-  return se(wt);
+  return ke(Ht);
 }
-const bt = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), ye = { randomUUID: bt };
-function ie(e, t, n) {
+const Ft = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), Pe = { randomUUID: Ft };
+function Se(e, t, n) {
   var r;
-  if (ye.randomUUID && !e)
-    return ye.randomUUID();
+  if (Pe.randomUUID && !e)
+    return Pe.randomUUID();
   e = e || {};
-  const l = e.random ?? ((r = e.rng) == null ? void 0 : r.call(e)) ?? xt();
+  const l = e.random ?? ((r = e.rng) == null ? void 0 : r.call(e)) ?? Vt();
   if (l.length < 16)
     throw new Error("Random bytes length must be >= 16");
-  return l[6] = l[6] & 15 | 64, l[8] = l[8] & 63 | 128, vt(l);
+  return l[6] = l[6] & 15 | 64, l[8] = l[8] & 63 | 128, At(l);
 }
-const Ee = ({
+const Ye = ({
   variant: e = "plain",
   buttons: t,
   className: n,
   children: l,
   title: r,
-  text: c,
-  position: i,
+  text: i,
+  position: c,
   targetRef: s,
-  ref: u,
-  trigger: a = ["hover", "focus"],
-  ...p
+  ref: d,
+  trigger: o = ["hover", "focus"],
+  ...h
 }) => {
   if (!l && !s)
     throw new Error("ToolTip must have a child or a targetRef");
-  Array.isArray(a) || (a = [a]), t && !Array.isArray(t) && (t = [t]);
-  const m = D(null), o = s || m, [d, y] = S(null), [v] = S(ie()), [w, E] = S(!1), L = D(null);
-  R(() => {
-    const g = (C) => {
-      y(C.detail);
+  Array.isArray(o) || (o = [o]), t && !Array.isArray(t) && (t = [t]);
+  const y = P(null), a = s || y, [u, m] = D(null), [b] = D(Se()), [w, M] = D(!1), g = P(null);
+  $(() => {
+    const x = (k) => {
+      m(k.detail);
     };
-    return document.addEventListener("tooltip-update", g), () => {
+    return document.addEventListener("tooltip-update", x), () => {
       document.removeEventListener(
         "tooltip-update",
-        g
+        x
       );
     };
-  }, []), R(() => {
-    L.current && clearTimeout(L.current), d ? E(d === v) : L.current = setTimeout(() => {
-      E(!1);
+  }, []), $(() => {
+    g.current && clearTimeout(g.current), u ? M(u === b) : g.current = setTimeout(() => {
+      M(!1);
     }, 1200);
-  }, [d, v]);
-  const B = () => {
-    if (a.includes("hover")) {
-      const g = new CustomEvent("tooltip-update", { detail: v });
-      document.dispatchEvent(g);
+  }, [u, b]);
+  const R = () => {
+    if (o.includes("hover")) {
+      const x = new CustomEvent("tooltip-update", { detail: b });
+      document.dispatchEvent(x);
     }
   }, N = () => {
-    if (a.includes("hover")) {
-      const g = new CustomEvent("tooltip-update", { detail: null });
-      document.dispatchEvent(g);
+    if (o.includes("hover")) {
+      const x = new CustomEvent("tooltip-update", { detail: null });
+      document.dispatchEvent(x);
     }
-  }, I = () => {
-    if (a.includes("click")) {
-      const g = new CustomEvent("tooltip-update", {
-        detail: w ? null : v
+  }, A = () => {
+    if (o.includes("click")) {
+      const x = new CustomEvent("tooltip-update", {
+        detail: w ? null : b
       });
-      document.dispatchEvent(g);
+      document.dispatchEvent(x);
     }
-  }, M = () => {
-    if (a.includes("focus")) {
-      const g = new CustomEvent("tooltip-update", { detail: v });
-      document.dispatchEvent(g);
+  }, L = () => {
+    if (o.includes("focus")) {
+      const x = new CustomEvent("tooltip-update", { detail: b });
+      document.dispatchEvent(x);
     }
-  }, V = () => {
-    if (a.includes("focus")) {
-      const g = new CustomEvent("tooltip-update", { detail: null });
-      document.dispatchEvent(g);
+  }, O = () => {
+    if (o.includes("focus")) {
+      const x = new CustomEvent("tooltip-update", { detail: null });
+      document.dispatchEvent(x);
     }
   };
-  R(() => {
-    if (o != null && o.current) {
-      const g = o.current;
-      return g.addEventListener("mouseenter", B), g.addEventListener("mouseleave", N), g.addEventListener("click", I), g.addEventListener("focus", M), g.addEventListener("blur", V), () => {
-        g.removeEventListener("mouseenter", B), g.removeEventListener("mouseleave", N), g.removeEventListener("click", I), g.removeEventListener("focus", M), g.removeEventListener("blur", V);
+  $(() => {
+    if (a != null && a.current) {
+      const x = a.current;
+      return x.addEventListener("mouseenter", R), x.addEventListener("mouseleave", N), x.addEventListener("click", A), x.addEventListener("focus", L), x.addEventListener("blur", O), () => {
+        x.removeEventListener("mouseenter", R), x.removeEventListener("mouseleave", N), x.removeEventListener("click", A), x.removeEventListener("focus", L), x.removeEventListener("blur", O);
       };
     }
-  }, [o, a, v, w]);
-  const W = !s && ee(l) ? oe(l, { ref: m }) : l;
-  if (!i && typeof window < "u" && o != null && o.current && !i) {
-    const g = o.current.getBoundingClientRect(), C = window.innerWidth, X = window.innerHeight, q = g.left / C, G = g.top / X;
-    e === "plain" ? q < 1 / 3 ? i = "right" : q > 2 / 3 ? i = "left" : i = G > 0.5 ? "top" : "bottom" : q < 1 / 2 && G < 1 / 2 ? i = "bottom-right" : q > 1 / 2 && G < 1 / 2 ? i = "bottom-left" : q > 1 / 2 && G > 1 / 2 ? i = "top-left" : q < 1 / 2 && G > 1 / 2 && (i = "top-right");
+  }, [a, o, b, w]);
+  const F = !s && pe(l) ? be(l, { ref: y }) : l;
+  if (!c && typeof window < "u" && a != null && a.current && !c) {
+    const x = a.current.getBoundingClientRect(), k = window.innerWidth, U = window.innerHeight, J = x.left / k, re = x.top / U;
+    e === "plain" ? J < 1 / 3 ? c = "right" : J > 2 / 3 ? c = "left" : c = re > 0.5 ? "top" : "bottom" : J < 1 / 2 && re < 1 / 2 ? c = "bottom-right" : J > 1 / 2 && re < 1 / 2 ? c = "bottom-left" : J > 1 / 2 && re > 1 / 2 ? c = "top-left" : J < 1 / 2 && re > 1 / 2 && (c = "top-right");
   }
-  const k = nt({
+  const C = gt({
     variant: e,
     buttons: t,
     className: n,
     title: r,
-    text: c,
-    position: i,
-    trigger: a,
+    text: i,
+    position: c,
+    trigger: o,
     targetRef: s,
     children: l
   });
-  return /* @__PURE__ */ A(te, { children: [
-    W,
-    /* @__PURE__ */ f(Q, { children: w && /* @__PURE__ */ f(st, { targetRef: o, children: /* @__PURE__ */ f(
-      H.div,
+  return /* @__PURE__ */ Y(ye, { children: [
+    F,
+    /* @__PURE__ */ f(ue, { children: w && /* @__PURE__ */ f(kt, { targetRef: a, children: /* @__PURE__ */ f(
+      j.div,
       {
-        initial: { opacity: d ? 1 : 0 },
+        initial: { opacity: u ? 1 : 0 },
         animate: { opacity: 1 },
-        transition: { duration: d ? 0 : 0.3 },
-        exit: { opacity: d ? 1 : 0 },
-        className: k.toolTip,
-        ...p,
-        onMouseEnter: B,
+        transition: { duration: u ? 0 : 0.3 },
+        exit: { opacity: u ? 1 : 0 },
+        className: C.toolTip,
+        ...h,
+        onMouseEnter: R,
         onMouseLeave: N,
-        children: /* @__PURE__ */ A(
-          H.div,
+        children: /* @__PURE__ */ Y(
+          j.div,
           {
-            className: k.container,
+            className: C.container,
             layoutId: "tool-tip",
             transition: {
               type: "spring",
@@ -1963,16 +2244,16 @@ const Ee = ({
               damping: 20
             },
             children: [
-              r && /* @__PURE__ */ f("div", { className: k.subHead, children: r }),
-              /* @__PURE__ */ f("div", { className: k.supportingText, children: c }),
-              t && /* @__PURE__ */ f("div", { className: k.actions, children: Array.isArray(t) && t.map((g, C) => /* @__PURE__ */ f(
-                ht,
+              r && /* @__PURE__ */ f("div", { className: C.subHead, children: r }),
+              /* @__PURE__ */ f("div", { className: C.supportingText, children: i }),
+              t && /* @__PURE__ */ f("div", { className: C.actions, children: Array.isArray(t) && t.map((x, k) => /* @__PURE__ */ f(
+                Wt,
                 {
                   size: "small",
                   variant: "text",
-                  ...g
+                  ...x
                 },
-                C
+                k
               )) })
             ]
           }
@@ -1980,46 +2261,46 @@ const Ee = ({
       }
     ) }) })
   ] });
-}, ge = ({
+}, Ae = ({
   className: e,
   label: t,
   variant: n = "primary",
   size: l = "medium",
   href: r,
-  type: c,
-  icon: i,
+  type: i,
+  icon: c,
   isExtended: s = !1,
-  ref: u,
-  transition: a,
-  children: p,
-  ...m
+  ref: d,
+  transition: o,
+  children: h,
+  ...y
 }) => {
-  if (p && (t = p), !t)
+  if (h && (t = h), !t)
     throw new Error(
       "FAB component requires either a label prop or children content"
     );
-  const o = r ? "a" : "button", d = _e({
+  const a = r ? "a" : "button", u = ut({
     href: r,
-    icon: i,
+    icon: c,
     isExtended: s,
     label: t,
     size: l,
     variant: n,
     className: e,
-    transition: a,
+    transition: o,
     children: t
   });
-  a = { duration: 0.3, ...a };
-  const y = D(null), v = u || y, w = {
+  o = { duration: 0.3, ...o };
+  const m = P(null), b = d || m, w = {
     visible: {
       width: "auto",
       marginLeft: 12,
       opacity: 1,
       transition: {
-        ...a,
+        ...o,
         opacity: {
-          duration: a.duration / 2,
-          delay: a.duration - a.duration / 2
+          duration: o.duration / 2,
+          delay: o.duration - o.duration / 2
         }
       }
     },
@@ -2028,178 +2309,178 @@ const Ee = ({
       marginLeft: 0,
       opacity: 0,
       transition: {
-        ...a,
+        ...o,
         marginLeft: {
-          duration: a.duration / 2,
-          delay: a.duration - a.duration / 2
+          duration: o.duration / 2,
+          delay: o.duration - o.duration / 2
         }
       }
     }
   };
-  return /* @__PURE__ */ A(
-    o,
+  return /* @__PURE__ */ Y(
+    a,
     {
-      ...m,
-      ref: v,
+      ...y,
+      ref: b,
       href: r,
       "aria-label": s ? void 0 : t,
-      className: d.fab,
+      className: u.fab,
       children: [
         /* @__PURE__ */ f(
-          Ee,
+          Ye,
           {
             trigger: s ? null : void 0,
             text: t,
-            targetRef: v
+            targetRef: b
           }
         ),
-        /* @__PURE__ */ f("span", { className: d.stateLayer, children: /* @__PURE__ */ f(
-          re,
+        /* @__PURE__ */ f("span", { className: u.stateLayer, children: /* @__PURE__ */ f(
+          ve,
           {
-            colorName: h({
+            colorName: p({
               primary: n == "surface",
               "on-primary-container": n == "primary",
               "on-secondary-container": n == "secondary",
               "on-tertiary-container": n == "tertiary"
             }),
-            triggerRef: v
+            triggerRef: b
           }
         ) }),
-        /* @__PURE__ */ f(Z, { icon: i, className: d.icon }),
-        /* @__PURE__ */ f(Q, { children: s && /* @__PURE__ */ f(
-          H.span,
+        /* @__PURE__ */ f(ie, { icon: c, className: u.icon }),
+        /* @__PURE__ */ f(ue, { children: s && /* @__PURE__ */ f(
+          j.span,
           {
             variants: w,
             initial: "hidden",
             animate: "visible",
             exit: "hidden",
-            className: d.label,
+            className: u.label,
             children: t
           }
         ) })
       ]
     }
   );
-}, ue = ({
+}, $e = ({
   variant: e = "standard",
   href: t,
   disabled: n = !1,
   type: l = "button",
   title: r,
-  label: c,
-  onToggle: i,
+  label: i,
+  onToggle: c,
   activated: s = !1,
-  onClick: u,
-  icon: a,
-  size: p = "medium",
-  iconSelected: m,
-  className: o,
-  ref: d,
-  width: y = "default",
-  shape: v = "rounded",
+  onClick: d,
+  icon: o,
+  size: h = "medium",
+  iconSelected: y,
+  className: a,
+  ref: u,
+  width: m = "default",
+  shape: b = "rounded",
   allowShapeTransformation: w = !0,
-  transition: E,
-  children: L,
-  ...B
+  transition: M,
+  children: g,
+  ...R
 }) => {
-  if (L && (c = L), !c)
+  if (g && (i = g), !i)
     throw new Error(
       "IconButton component requires either a label prop or children content to provide an accessible aria-label"
     );
-  r || (r = c);
-  const [N, I] = K.useState(s);
-  let M;
-  i ? i && (M = (C) => {
-    n && C.preventDefault(), I(!N), i(!!N);
-  }, a = N && m || a) : M = (C) => {
-    n && C.preventDefault(), u && u(C);
-  }, R(() => {
-    I(s);
+  r || (r = i);
+  const [N, A] = te.useState(s);
+  let L;
+  c ? c && (L = (k) => {
+    n && k.preventDefault(), A(!N), c(!!N);
+  }, o = N && y || o) : L = (k) => {
+    n && k.preventDefault(), d && d(k);
+  }, $(() => {
+    A(s);
   }, [s]);
-  const V = t ? "a" : "button", W = Ke({
-    transition: E,
-    shape: v,
+  const O = t ? "a" : "button", F = dt({
+    transition: M,
+    shape: b,
     allowShapeTransformation: w,
-    width: y,
+    width: m,
     href: t,
     activated: N,
-    label: c,
-    iconSelected: m,
+    label: i,
+    iconSelected: y,
     isActive: N,
-    onToggle: i,
+    onToggle: c,
     disabled: n,
-    icon: a,
+    icon: o,
     variant: e,
-    className: o,
-    size: p,
-    children: c,
-    ...B
-  }), k = D(null), g = d || k;
-  return E = { duration: 0.3, ...E }, /* @__PURE__ */ A(
-    V,
+    className: a,
+    size: h,
+    children: i,
+    ...R
+  }), C = P(null), x = u || C;
+  return M = { duration: 0.3, ...M }, /* @__PURE__ */ Y(
+    O,
     {
       disabled: n,
       href: t,
-      style: { transition: E.duration + "s" },
-      className: W.iconButton,
-      "aria-label": c,
-      ...B,
+      style: { transition: M.duration + "s" },
+      className: F.iconButton,
+      "aria-label": i,
+      ...R,
       title: void 0,
-      onClick: M,
-      ref: g,
+      onClick: L,
+      ref: x,
       children: [
         /* @__PURE__ */ f(
-          Ee,
+          Ye,
           {
-            targetRef: g,
+            targetRef: x,
             trigger: n ? null : void 0,
             text: r
           }
         ),
-        /* @__PURE__ */ f("div", { className: W.touchTarget }),
+        /* @__PURE__ */ f("div", { className: F.touchTarget }),
         /* @__PURE__ */ f(
           "div",
           {
-            className: W.stateLayer,
-            style: { transition: E.duration + "s" },
+            className: F.stateLayer,
+            style: { transition: M.duration + "s" },
             children: !n && /* @__PURE__ */ f(
-              re,
+              ve,
               {
-                colorName: h(
+                colorName: p(
                   e === "standard" && {
                     "on-surface-variant": !N,
                     primary: N
                   },
                   e === "filled" && {
-                    primary: !N && !!i,
-                    "inverse-on-surface": N || !i
+                    primary: !N && !!c,
+                    "inverse-on-surface": N || !c
                   },
                   e === "tonal" && {
-                    "on-surface-variant": !N && !!i,
-                    "on-secondary-container": N || !i
+                    "on-surface-variant": !N && !!c,
+                    "on-secondary-container": N || !c
                   },
                   e === "outlined" && {
                     "on-surface-variant": !N,
                     "on-primary": N
                   }
                 ),
-                triggerRef: g
+                triggerRef: x
               }
             )
           }
         ),
-        a && /* @__PURE__ */ f(Z, { icon: a, className: W.icon })
+        o && /* @__PURE__ */ f(ie, { icon: o, className: F.icon })
       ]
     }
   );
-}, _t = ({
+}, un = ({
   className: e,
   valueFormatter: t,
   step: n = 10,
   name: l,
   value: r = 0,
-  min: c = 0,
-  max: i = 100,
+  min: i = 0,
+  max: c = 100,
   marks: s = [
     {
       value: 0,
@@ -2210,99 +2491,99 @@ const Ee = ({
       label: "100"
     }
   ],
-  ref: u,
-  onChange: a,
-  ...p
+  ref: d,
+  onChange: o,
+  ...h
 }) => {
-  const m = (b) => {
-    const x = d(), P = o();
-    return b === 1 / 0 ? 100 : b === -1 / 0 ? 0 : (b - x) / (P - x) * 100;
-  }, o = (b = !1) => b ? i : i == 1 / 0 ? s[(s == null ? void 0 : s.length) - 1].value : i, d = (b = !1) => b ? c : c == -1 / 0 ? s[0].value : c, y = (b) => {
-    const x = d(!1);
-    return (o(!1) - x) * b / 100 + x;
-  }, [v, w] = S(!1), E = D(null), L = u || E, [B, N] = S(r), [I, M] = S(m(r)), [V, W] = S(!1), k = (b) => {
-    W(!0), w(!0), X(b);
-  }, g = () => {
-    W(!1), w(!1);
+  const y = (S) => {
+    const E = u(), X = a();
+    return S === 1 / 0 ? 100 : S === -1 / 0 ? 0 : (S - E) / (X - E) * 100;
+  }, a = (S = !1) => S ? c : c == 1 / 0 ? s[(s == null ? void 0 : s.length) - 1].value : c, u = (S = !1) => S ? i : i == -1 / 0 ? s[0].value : i, m = (S) => {
+    const E = u(!1);
+    return (a(!1) - E) * S / 100 + E;
+  }, [b, w] = D(!1), M = P(null), g = d || M, [R, N] = D(r), [A, L] = D(y(r)), [O, F] = D(!1), C = (S) => {
+    F(!0), w(!0), U(S);
+  }, x = () => {
+    F(!1), w(!1);
   };
-  R(() => (V ? (window.addEventListener("mouseup", g), window.addEventListener("mousemove", X), window.addEventListener("touchend", g), window.addEventListener("touchmove", X)) : (window.removeEventListener("mouseup", g), window.removeEventListener("mousemove", X), window.removeEventListener("touchend", g), window.removeEventListener("touchmove", X)), () => {
-    window.removeEventListener("mouseup", g), window.removeEventListener("mousemove", X), window.removeEventListener("touchend", g), window.removeEventListener("touchmove", X);
-  }), [V]);
-  const C = Ze({
+  $(() => (O ? (window.addEventListener("mouseup", x), window.addEventListener("mousemove", U), window.addEventListener("touchend", x), window.addEventListener("touchmove", U)) : (window.removeEventListener("mouseup", x), window.removeEventListener("mousemove", U), window.removeEventListener("touchend", x), window.removeEventListener("touchmove", U)), () => {
+    window.removeEventListener("mouseup", x), window.removeEventListener("mousemove", U), window.removeEventListener("touchend", x), window.removeEventListener("touchmove", U);
+  }), [O]);
+  const k = ht({
     className: e,
-    isChanging: v,
+    isChanging: b,
     marks: s,
-    max: i,
-    min: c,
+    max: c,
+    min: i,
     name: l,
     step: n,
-    value: B,
+    value: R,
     valueFormatter: t,
-    onChange: a
-  }), X = (b) => {
-    const x = L == null ? void 0 : L.current;
-    if (x) {
-      const P = x.getBoundingClientRect().left, $ = ((b.type === "touchmove" || b.type === "touchstart" ? b.touches[0].clientX : b.clientX) - P) / x.offsetWidth * 100;
-      q({ pourcent: $ });
+    onChange: o
+  }), U = (S) => {
+    const E = g == null ? void 0 : g.current;
+    if (E) {
+      const X = E.getBoundingClientRect().left, ae = ((S.type === "touchmove" || S.type === "touchstart" ? S.touches[0].clientX : S.clientX) - X) / E.offsetWidth * 100;
+      J({ percent: ae });
     }
-  }, q = ({
-    pourcent: b,
-    value: x
+  }, J = ({
+    percent: S,
+    value: E
   }) => {
-    if (b) {
-      if (b >= 100) {
-        N(o(!0)), M(100);
+    if (S) {
+      if (S >= 100) {
+        N(a(!0)), L(100);
         return;
       }
-      if (b <= 0) {
-        N(d(!0)), M(0);
+      if (S <= 0) {
+        N(u(!0)), L(0);
         return;
       }
-      x = y(b), x == d() && (x = d(!0)), x == o() && (x = o(!0));
-    } else if (x != null) {
-      if (x >= o()) {
-        N(o(!0)), M(100);
+      E = m(S), E == u() && (E = u(!0)), E == a() && (E = a(!0));
+    } else if (E != null) {
+      if (E >= a()) {
+        N(a(!0)), L(100);
         return;
       }
-      if (x <= d()) {
-        N(d(!0)), M(0);
+      if (E <= u()) {
+        N(u(!0)), L(0);
         return;
       }
-      b = m(x);
+      S = y(E);
     } else
       return;
-    n != null ? x = Math.round((x - d()) / n) * n + d() : s && (x = s.reduce((P, F, $) => {
-      let O = F.value === 1 / 0 ? o() : F.value === -1 / 0 ? d() : F.value, U = P.value === 1 / 0 ? o() : P.value === -1 / 0 ? d() : P.value;
-      return O = Math.abs(O - x), U = Math.abs(U - x), O < U ? F : P;
-    }).value), x >= o() && (x = o(!0)), x <= d() && (x = d(!0)), b = m(x), N(x), M(b), a && a(x);
-  }, [G, Y] = S(0);
-  return R(() => {
-    const b = () => {
-      L.current && Y(L.current.offsetWidth);
+    n != null ? E = Math.round((E - u()) / n) * n + u() : s && (E = s.reduce((X, q, ae) => {
+      let de = q.value === 1 / 0 ? a() : q.value === -1 / 0 ? u() : q.value, I = X.value === 1 / 0 ? a() : X.value === -1 / 0 ? u() : X.value;
+      return de = Math.abs(de - E), I = Math.abs(I - E), de < I ? q : X;
+    }).value), E >= a() && (E = a(!0)), E <= u() && (E = u(!0)), S = y(E), N(E), L(S), o && o(E);
+  }, [re, _] = D(0);
+  return $(() => {
+    const S = () => {
+      g.current && _(g.current.offsetWidth);
     };
-    return b(), window.addEventListener("resize", b), () => {
-      window.removeEventListener("resize", b);
+    return S(), window.addEventListener("resize", S), () => {
+      window.removeEventListener("resize", S);
     };
-  }, []), /* @__PURE__ */ A(
+  }, []), /* @__PURE__ */ Y(
     "div",
     {
       tabIndex: 0,
-      onKeyDown: (b) => {
-        switch (b.key) {
+      onKeyDown: (S) => {
+        switch (S.key) {
           case "ArrowRight":
             if (n)
-              q({ value: B + n });
+              J({ value: R + n });
             else if (s) {
-              const x = s.find((P) => P.value > B);
-              x && q({ value: x.value });
+              const E = s.find((X) => X.value > R);
+              E && J({ value: E.value });
             }
             break;
           case "ArrowLeft":
             if (n)
-              q({ value: B - n });
+              J({ value: R - n });
             else if (s) {
-              const x = s.slice(0).reverse().find((P, F, $) => B === 1 / 0 ? F === 1 : P.value < B);
-              x && q({ value: x.value });
+              const E = s.slice(0).reverse().find((X, q, ae) => R === 1 / 0 ? q === 1 : X.value < R);
+              E && J({ value: E.value });
             }
             break;
           default:
@@ -2310,30 +2591,24 @@ const Ee = ({
         }
       },
       role: "slider",
-      "aria-valuemin": d(!0),
-      "aria-valuemax": o(!0),
-      "aria-valuenow": B,
-      "aria-valuetext": B.toString(),
-      className: C.slider,
-      onMouseDown: k,
-      onClick: X,
-      ref: L,
-      onTouchStart: k,
-      onDragStart: (b) => b.preventDefault(),
-      ...p,
+      "aria-valuemin": u(!0),
+      "aria-valuemax": a(!0),
+      "aria-valuenow": R,
+      "aria-valuetext": R.toString(),
+      className: k.slider,
+      onMouseDown: C,
+      onClick: U,
+      ref: g,
+      onTouchStart: C,
+      onDragStart: (S) => S.preventDefault(),
+      ...h,
       children: [
-        /* @__PURE__ */ f("input", { type: "hidden", name: l, value: B }),
-        /* @__PURE__ */ f(
-          "div",
-          {
-            className: C.activeTrack,
-            style: { flex: I / 100 }
-          }
-        ),
-        /* @__PURE__ */ f("div", { className: C.handle, children: /* @__PURE__ */ f(Q, { children: v && /* @__PURE__ */ f(
-          H.div,
+        /* @__PURE__ */ f("input", { type: "hidden", name: l, value: R }),
+        /* @__PURE__ */ f("div", { className: k.activeTrack, style: { flex: A / 100 } }),
+        /* @__PURE__ */ f("div", { className: k.handle, children: /* @__PURE__ */ f(ue, { children: b && /* @__PURE__ */ f(
+          j.div,
           {
-            className: C.valueIndicator,
+            className: k.valueIndicator,
             initial: "hidden",
             animate: "visible",
             exit: "hidden",
@@ -2347,35 +2622,35 @@ const Ee = ({
               hidden: { opacity: 1, scale: 0 }
             },
             transition: { duration: 0.1 },
-            children: t ? t(B) : B
+            children: t ? t(R) : R
           }
         ) }) }),
         /* @__PURE__ */ f(
           "div",
           {
-            className: C.inactiveTrack,
-            style: { flex: 1 - I / 100 }
+            className: k.inactiveTrack,
+            style: { flex: 1 - A / 100 }
           }
         ),
         /* @__PURE__ */ f(
           "div",
           {
             className: "w-[calc(100%-12px)] h-full absolute -translate-x-1/2 transform left-1/2",
-            children: s && s.map((b, x) => {
-              let P = null;
-              const F = (v ? 9 : 10) / G * 100, $ = m(b.value);
-              return $ <= I - F ? P = !0 : $ >= I + F && (P = !1), /* @__PURE__ */ f(
+            children: s && s.map((S, E) => {
+              let X = null;
+              const q = (b ? 9 : 10) / re * 100, ae = y(S.value);
+              return ae <= A - q ? X = !0 : ae >= A + q && (X = !1), /* @__PURE__ */ f(
                 "div",
                 {
-                  className: h(C.dot, {
-                    "bg-primary-container": P != null && P,
-                    "bg-primary": P != null && !P
+                  className: p(k.dot, {
+                    "bg-primary-container": X != null && X,
+                    "bg-primary": X != null && !X
                   }),
                   style: {
-                    left: `${m(b.value)}%`
+                    left: `${y(S.value)}%`
                   }
                 },
-                x
+                E
               );
             })
           }
@@ -2389,156 +2664,156 @@ const Ee = ({
  * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
  * Copyright 2025 Fonticons, Inc.
  */
-var Lt = {
+var Xt = {
   prefix: "fas",
   iconName: "circle-exclamation",
   icon: [512, 512, ["exclamation-circle"], "f06a", "M256 512a256 256 0 1 1 0-512 256 256 0 1 1 0 512zm0-192a32 32 0 1 0 0 64 32 32 0 1 0 0-64zm0-192c-18.2 0-32.7 15.5-31.4 33.7l7.4 104c.9 12.6 11.4 22.3 23.9 22.3 12.6 0 23-9.7 23.9-22.3l7.4-104c1.3-18.2-13.1-33.7-31.4-33.7z"]
-}, de = {
+}, Ce = {
   prefix: "fas",
   iconName: "xmark",
   icon: [384, 512, [128473, 10005, 10006, 10060, 215, "close", "multiply", "remove", "times"], "f00d", "M55.1 73.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L147.2 256 9.9 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192.5 301.3 329.9 438.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.8 256 375.1 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192.5 210.7 55.1 73.4z"]
-}, Nt = {
+}, Ot = {
   prefix: "fas",
   iconName: "bars",
   icon: [448, 512, ["navicon"], "f0c9", "M0 96C0 78.3 14.3 64 32 64l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 128C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 288c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32L32 448c-17.7 0-32-14.3-32-32s14.3-32 32-32l384 0c17.7 0 32 14.3 32 32z"]
 };
-const Kt = ({
+const dn = ({
   variant: e = "standard",
   className: t,
   children: n,
   title: l,
   position: r = "right",
-  extended: c,
-  divider: i,
+  extended: i,
+  divider: c,
   onExtendedChange: s,
-  closeIcon: u = de,
-  transition: a,
-  ...p
+  closeIcon: d = Ce,
+  transition: o,
+  ...h
 }) => {
-  a = { duration: 0.3, ...a };
-  const [m, o] = S(c ?? !0), d = Je({
-    transition: a,
+  o = { duration: 0.3, ...o };
+  const [y, a] = D(i ?? !0), u = mt({
+    transition: o,
     title: l,
     position: r,
-    closeIcon: u,
+    closeIcon: d,
     className: t,
     children: n,
     onExtendedChange: s,
-    divider: i,
-    isExtended: m,
-    extended: m,
+    divider: c,
+    isExtended: y,
+    extended: y,
     variant: e
   });
-  R(() => {
-    s == null || s(m ?? !1);
-  }, [m]), R(() => {
-    c != null && o(c);
-  }, [c]);
-  const y = {
+  $(() => {
+    s == null || s(y ?? !1);
+  }, [y]), $(() => {
+    i != null && a(i);
+  }, [i]);
+  const m = {
     close: {
       width: 0
     },
     open: {
       width: "auto"
     }
-  }, v = () => /* @__PURE__ */ A(te, { children: [
-    /* @__PURE__ */ f(Q, { children: e == "modal" && m && /* @__PURE__ */ f(
-      H.div,
+  }, b = () => /* @__PURE__ */ Y(ye, { children: [
+    /* @__PURE__ */ f(ue, { children: e == "modal" && y && /* @__PURE__ */ f(
+      j.div,
       {
         initial: { opacity: 0 },
         animate: { opacity: 1 },
         exit: { opacity: 0 },
-        transition: a,
-        onClick: () => o(!1),
-        className: d.overlay
+        transition: o,
+        onClick: () => a(!1),
+        className: u.overlay
       }
     ) }),
-    /* @__PURE__ */ f(Q, { children: m && /* @__PURE__ */ A(
+    /* @__PURE__ */ f(ue, { children: y && /* @__PURE__ */ Y(
       "div",
       {
-        ...p,
-        className: d.slideSheet,
-        style: { transition: a.duration + "s" },
+        ...h,
+        className: u.slideSheet,
+        style: { transition: o.duration + "s" },
         children: [
-          /* @__PURE__ */ A(
-            H.div,
+          /* @__PURE__ */ Y(
+            j.div,
             {
-              variants: y,
-              initial: c === !1 ? "open" : "close",
+              variants: m,
+              initial: i === !1 ? "open" : "close",
               animate: "open",
               exit: "close",
-              className: d.container,
+              className: u.container,
               children: [
-                /* @__PURE__ */ A("div", { className: d.header, children: [
-                  l && /* @__PURE__ */ f("p", { className: d.title, children: l }),
+                /* @__PURE__ */ Y("div", { className: u.header, children: [
+                  l && /* @__PURE__ */ f("p", { className: u.title, children: l }),
                   /* @__PURE__ */ f(
-                    ue,
+                    $e,
                     {
                       size: "small",
                       label: "close",
-                      icon: u,
-                      onClick: () => o(!1),
-                      className: d.closeButton
+                      icon: d,
+                      onClick: () => a(!1),
+                      className: u.closeButton
                     }
                   )
                 ] }),
                 /* @__PURE__ */ f(
                   "div",
                   {
-                    className: d.content,
-                    style: { transition: a.duration + "s" },
+                    className: u.content,
+                    style: { transition: o.duration + "s" },
                     children: n
                   }
                 )
               ]
             }
           ),
-          (i == null && e == "standard" ? !0 : i) && /* @__PURE__ */ f(gt, { className: d.divider, orientation: "vertical" })
+          (c == null && e == "standard" ? !0 : c) && /* @__PURE__ */ f(Pt, { className: u.divider, orientation: "vertical" })
         ]
       }
     ) })
   ] });
-  return e == "modal" ? xe(v(), document.body) : v();
-}, Gt = ({
+  return e == "modal" ? Fe(b(), document.body) : b();
+}, fn = ({
   message: e,
   className: t,
   duration: n,
-  closeIcon: l = de,
+  closeIcon: l = Ce,
   onClose: r,
-  ...c
+  ...i
 }) => {
-  const [i, s] = S(!0), u = Qe({
+  const [c, s] = D(!0), d = pt({
     className: t,
     closeIcon: l,
     duration: n,
-    isVisible: i,
+    isVisible: c,
     onClose: r,
     message: e
   });
-  R(() => {
+  $(() => {
     n && setTimeout(() => {
-      a();
+      o();
     }, n);
   }, [n]);
-  const a = () => {
+  const o = () => {
     s(!1), r == null || r();
   };
-  return /* @__PURE__ */ f(Q, { children: i && /* @__PURE__ */ f(
-    H.div,
+  return /* @__PURE__ */ f(ue, { children: c && /* @__PURE__ */ f(
+    j.div,
     {
       initial: { height: 0 },
       animate: { height: "auto" },
       exit: { height: 0 },
       transition: { duration: 0.1 },
-      className: u.snackbar,
-      ...c,
-      children: /* @__PURE__ */ A("div", { className: u.container, children: [
-        /* @__PURE__ */ f("p", { className: u.supportingText, children: e }),
+      className: d.snackbar,
+      ...i,
+      children: /* @__PURE__ */ Y("div", { className: d.container, children: [
+        /* @__PURE__ */ f("p", { className: d.supportingText, children: e }),
         /* @__PURE__ */ f(
-          ue,
+          $e,
           {
-            onClick: () => a(),
-            className: u.icon,
+            onClick: () => o(),
+            className: d.icon,
             icon: l,
             label: "close the snackbar"
           }
@@ -2546,144 +2821,144 @@ const Kt = ({
       ] })
     }
   ) });
-}, Jt = ({
+}, mn = ({
   selected: e = !1,
   className: t,
   activeIcon: n,
   disabled: l = !1,
   inactiveIcon: r,
-  onChange: c,
-  onClick: i,
+  onChange: i,
+  onClick: c,
   onKeyDown: s,
-  ref: u,
-  ...a
+  ref: d,
+  ...o
 }) => {
-  const [p, m] = S(e), o = (L) => {
-    l || (y(), i && i(L));
-  }, d = (L) => {
-    l || ((L.key === " " || L.key === "Enter") && (L.preventDefault(), y()), s && s(L));
-  }, y = () => {
-    m(!p), c == null || c(!p);
-  }, v = ze({
+  const [h, y] = D(e), a = (g) => {
+    l || (m(), c && c(g));
+  }, u = (g) => {
+    l || ((g.key === " " || g.key === "Enter") && (g.preventDefault(), m()), s && s(g));
+  }, m = () => {
+    y(!h), i == null || i(!h);
+  }, b = yt({
     className: t,
-    isSelected: p,
+    isSelected: h,
     activeIcon: n,
     inactiveIcon: r,
     disabled: l,
-    selected: p,
-    onChange: c
-  }), w = D(null), E = u || w;
-  return /* @__PURE__ */ A(
-    H.div,
+    selected: h,
+    onChange: i
+  }), w = P(null), M = d || w;
+  return /* @__PURE__ */ Y(
+    j.div,
     {
       role: "switch",
-      "aria-checked": p,
+      "aria-checked": h,
       tabIndex: l ? -1 : 0,
-      onKeyDown: d,
-      onClick: o,
-      ref: E,
-      className: v.switch,
-      ...a,
+      onKeyDown: u,
+      onClick: a,
+      ref: M,
+      className: b.switch,
+      ...o,
       children: [
-        /* @__PURE__ */ f("input", { type: "hidden", value: p ? "1" : "0" }),
-        /* @__PURE__ */ A(
-          H.div,
+        /* @__PURE__ */ f("input", { type: "hidden", value: h ? "1" : "0" }),
+        /* @__PURE__ */ Y(
+          j.div,
           {
             layout: !0,
-            style: { translate: p ? "50%" : "-50%" },
+            style: { translate: h ? "50%" : "-50%" },
             transition: {
               type: "spring",
               stiffness: 700,
               damping: 30
             },
-            className: v.handleContainer,
+            className: b.handleContainer,
             children: [
-              /* @__PURE__ */ f("div", { className: v.handle, children: (p ? n : r) && /* @__PURE__ */ f(
-                Z,
+              /* @__PURE__ */ f("div", { className: b.handle, children: (h ? n : r) && /* @__PURE__ */ f(
+                ie,
                 {
-                  className: v.icon,
-                  icon: p ? n : r
+                  className: b.icon,
+                  icon: h ? n : r
                 }
               ) }),
-              /* @__PURE__ */ f("div", { className: v.handleStateLayer })
+              /* @__PURE__ */ f("div", { className: b.handleStateLayer })
             ]
           }
         )
       ]
     }
   );
-}, Et = ({
+}, Ut = ({
   className: e,
   onClick: t,
   label: n,
   variant: l = "primary",
   href: r,
-  icon: c,
-  selectedTab: i,
+  icon: i,
+  selectedTab: c,
   setSelectedTab: s,
-  tabsId: u,
-  index: a,
-  onTabSelected: p,
-  scrollable: m = !1,
-  selected: o = !1,
-  ref: d,
-  ...y
+  tabsId: d,
+  index: o,
+  onTabSelected: h,
+  scrollable: y = !1,
+  selected: a = !1,
+  ref: u,
+  ...m
 }) => {
-  const v = D(null), w = d || v, [E, L] = S(o);
-  R(() => {
-    o && i == null ? L(!0) : L(i == a && a != null);
-  }, [i]), R(() => {
-    i == a && p && p({
+  const b = P(null), w = u || b, [M, g] = D(a);
+  $(() => {
+    a && c == null ? g(!0) : g(c == o && o != null);
+  }, [c]), $(() => {
+    c == o && h && h({
       ref: w,
-      index: a || 0,
+      index: o || 0,
       label: n,
-      icon: c
+      icon: i
     });
-  }, [i]);
-  const B = r ? "a" : "button", N = (M) => {
-    s && s(a ?? null), t && t(M);
-  }, I = Te({
+  }, [c]);
+  const R = r ? "a" : "button", N = (L) => {
+    s && s(o ?? null), t && t(L);
+  }, A = xt({
     className: e,
-    onTabSelected: p,
-    scrollable: m,
-    selectedTab: i,
-    index: a,
-    tabsId: u,
-    selected: E,
+    onTabSelected: h,
+    scrollable: y,
+    selectedTab: c,
+    index: o,
+    tabsId: d,
+    selected: M,
     variant: l,
-    icon: c,
+    icon: i,
     label: n,
-    isSelected: E,
+    isSelected: M,
     setSelectedTab: s,
     href: r
   });
-  return /* @__PURE__ */ A(
-    B,
+  return /* @__PURE__ */ Y(
+    R,
     {
-      ...y,
+      ...m,
       role: "tab",
-      "aria-selected": E,
+      "aria-selected": M,
       ref: w,
       href: r,
-      className: I.tab,
+      className: A.tab,
       onClick: N,
-      ...y,
+      ...m,
       children: [
-        /* @__PURE__ */ f("span", { className: I.stateLayer, children: /* @__PURE__ */ f(
-          re,
+        /* @__PURE__ */ f("span", { className: A.stateLayer, children: /* @__PURE__ */ f(
+          ve,
           {
-            colorName: l === "primary" && E ? "primary" : "on-surface",
+            colorName: l === "primary" && M ? "primary" : "on-surface",
             triggerRef: w
           }
         ) }),
-        /* @__PURE__ */ A("span", { className: I.content, children: [
-          c && /* @__PURE__ */ f(Z, { icon: c, className: I.icon }),
-          /* @__PURE__ */ f("span", { className: I.label, children: n }),
-          E && /* @__PURE__ */ f(
-            H.span,
+        /* @__PURE__ */ Y("span", { className: A.content, children: [
+          i && /* @__PURE__ */ f(ie, { icon: i, className: A.icon }),
+          /* @__PURE__ */ f("span", { className: A.label, children: n }),
+          M && /* @__PURE__ */ f(
+            j.span,
             {
-              layoutId: `underline-${u}`,
-              className: I.underline,
+              layoutId: `underline-${d}`,
+              className: A.underline,
               transition: { duration: 0.3 }
             }
           )
@@ -2691,230 +2966,230 @@ const Kt = ({
       ]
     }
   );
-}, Zt = ({
+}, hn = ({
   variant: e = "primary",
   onTabSelected: t,
   children: n,
   className: l,
   selectedTab: r,
-  setSelectedTab: c,
-  scrollable: i = !1
+  setSelectedTab: i,
+  scrollable: c = !1
 }) => {
-  const [s, u] = S(
+  const [s, d] = D(
     null
   );
-  let a;
-  r == 0 || r != null ? a = r : a = s;
-  const p = c || u, m = K.Children.toArray(n).filter(
-    (w) => K.isValidElement(w) && w.type === Et
-  ), o = K.useRef(null), d = (w) => {
-    if (t == null || t(w), i) {
-      const E = o.current, L = w.ref.current;
-      if (E && L) {
-        const B = L.offsetLeft + L.offsetWidth / 2 - E.offsetWidth / 2;
-        E.scrollTo({ left: B, behavior: "smooth" });
+  let o;
+  r == 0 || r != null ? o = r : o = s;
+  const h = i || d, y = te.Children.toArray(n).filter(
+    (w) => te.isValidElement(w) && w.type === Ut
+  ), a = te.useRef(null), u = (w) => {
+    if (t == null || t(w), c) {
+      const M = a.current, g = w.ref.current;
+      if (M && g) {
+        const R = g.offsetLeft + g.offsetWidth / 2 - M.offsetWidth / 2;
+        M.scrollTo({ left: R, behavior: "smooth" });
       }
     }
-  }, y = ke(() => ie(), []), v = et({
+  }, m = qe(() => Se(), []), b = vt({
     children: n,
     onTabSelected: t,
-    scrollable: i,
-    selectedTab: a,
-    setSelectedTab: p,
+    scrollable: c,
+    selectedTab: o,
+    setSelectedTab: h,
     className: l,
     variant: e
   });
-  return /* @__PURE__ */ f("div", { ref: o, role: "tablist", className: v.tabs, children: m.map((w, E) => K.cloneElement(w, {
-    key: E,
-    index: E,
+  return /* @__PURE__ */ f("div", { ref: a, role: "tablist", className: b.tabs, children: y.map((w, M) => te.cloneElement(w, {
+    key: M,
+    index: M,
     variant: e,
-    selectedTab: a,
-    setSelectedTab: p,
-    tabsId: y,
-    onTabSelected: d,
-    scrollable: i
+    selectedTab: o,
+    setSelectedTab: h,
+    tabsId: m,
+    onTabSelected: u,
+    scrollable: c
   })) });
-}, Qt = ({
+}, pn = ({
   variant: e = "filled",
   disabled: t = !1,
   errorText: n,
   placeholder: l,
   suffix: r,
-  name: c,
-  label: i,
+  name: i,
+  label: c,
   className: s,
-  supportingText: u,
-  trailingIcon: a,
-  leadingIcon: p,
-  type: m = "text",
-  textLine: o = "singleLine",
-  autoComplete: d = "on",
-  onChange: y,
-  value: v,
+  supportingText: d,
+  trailingIcon: o,
+  leadingIcon: h,
+  type: y = "text",
+  textLine: a = "singleLine",
+  autoComplete: u = "on",
+  onChange: m,
+  value: b,
   showSupportingText: w = !1,
-  ...E
+  ...M
 }) => {
-  const [L, B] = S(v ?? ""), [N, I] = S(!1), [M, V] = S(!1), [W, k] = S(
+  const [g, R] = D(b ?? ""), [N, A] = D(!1), [L, O] = D(!1), [F, C] = D(
     w
   );
-  R(() => {
-    B(v ?? "");
-  }, [v]), R(() => {
-    n != null && n.length ? V(!0) : V(!1);
-  }, [n]), R(() => {
-    w ? k(w) : u != null && u.length ? k(!0) : k(!1);
-  }, [W, u]), R(() => {
-    N && V(!1);
+  $(() => {
+    R(b ?? "");
+  }, [b]), $(() => {
+    n != null && n.length ? O(!0) : O(!1);
+  }, [n]), $(() => {
+    w ? C(w) : d != null && d.length ? C(!0) : C(!1);
+  }, [F, d]), $(() => {
+    N && O(!1);
   }, [N]);
-  const g = K.useRef(null), C = () => {
-    g.current && !N && g.current.focus();
-  }, X = () => {
-    I(!0);
-  }, q = (P) => {
-    const F = P.target.value;
-    B(F), V(!1), typeof y == "function" && y(F);
-  }, G = () => {
-    I(!1);
-  }, Y = tt({
-    showSupportingText: W,
+  const x = te.useRef(null), k = () => {
+    x.current && !N && x.current.focus();
+  }, U = () => {
+    A(!0);
+  }, J = (X) => {
+    const q = X.target.value;
+    R(q), O(!1), typeof m == "function" && m(q);
+  }, re = () => {
+    A(!1);
+  }, _ = wt({
+    showSupportingText: F,
     isFocused: N,
-    showErrorIcon: M,
+    showErrorIcon: L,
     disabled: t,
-    name: c,
-    label: i,
-    autoComplete: d,
+    name: i,
+    label: c,
+    autoComplete: u,
     className: s,
-    onChange: y,
+    onChange: m,
     placeholder: l,
-    supportingText: u,
-    type: m,
-    leadingIcon: p,
-    trailingIcon: a,
+    supportingText: d,
+    type: y,
+    leadingIcon: h,
+    trailingIcon: o,
     variant: e,
     errorText: n,
-    value: L,
+    value: g,
     suffix: r,
-    textLine: o
-  }), [z] = S(ie());
-  let b, x;
-  switch (o) {
+    textLine: a
+  }), [oe] = D(Se());
+  let S, E;
+  switch (a) {
     case "multiLine":
-      x = Ve, b = {};
+      E = tt, S = {};
       break;
     case "textAreas":
-      x = "textarea", b = {};
+      E = "textarea", S = {};
       break;
     case "singleLine":
     default:
-      x = "input", b = { type: m };
+      E = "input", S = { type: y };
       break;
   }
-  return /* @__PURE__ */ A("div", { className: Y.textField, ...E, children: [
-    /* @__PURE__ */ A("fieldset", { onClick: C, className: Y.content, children: [
-      /* @__PURE__ */ f("div", { className: Y.stateLayer }),
-      p && /* @__PURE__ */ f("div", { className: Y.leadingIcon, children: K.isValidElement(p) ? p : /* @__PURE__ */ f(Z, { className: "w-5 h-5", icon: p }) }),
-      !(!N && !L.length || e == "filled") && /* @__PURE__ */ f(
-        H.legend,
+  return /* @__PURE__ */ Y("div", { className: _.textField, ...M, children: [
+    /* @__PURE__ */ Y("fieldset", { onClick: k, className: _.content, children: [
+      /* @__PURE__ */ f("div", { className: _.stateLayer }),
+      h && /* @__PURE__ */ f("div", { className: _.leadingIcon, children: te.isValidElement(h) ? h : /* @__PURE__ */ f(ie, { className: "w-5 h-5", icon: h }) }),
+      !(!N && !g.length || e == "filled") && /* @__PURE__ */ f(
+        j.legend,
         {
           variants: {
             hidden: { width: 0, padding: 0 },
             visible: { width: "auto", padding: "0 8px" }
           },
           initial: "hidden",
-          animate: !N && !L.length ? "hidden" : "visible",
+          animate: !N && !g.length ? "hidden" : "visible",
           className: "max-w-full ml-2 px-2 text-body-small h-0",
           transition: { duration: 0.2 },
           children: /* @__PURE__ */ f("span", { className: "transform inline-flex -translate-y-1/2", children: /* @__PURE__ */ f(
-            H.span,
+            j.span,
             {
-              className: Y.label,
+              className: _.label,
               transition: { duration: 0.3 },
-              layoutId: z,
-              children: i
+              layoutId: oe,
+              children: c
             }
           ) })
         }
       ),
-      /* @__PURE__ */ A("div", { className: "flex-1 relative", children: [
-        (!N && !L.length || e == "filled") && /* @__PURE__ */ f(
-          H.label,
+      /* @__PURE__ */ Y("div", { className: "flex-1 relative", children: [
+        (!N && !g.length || e == "filled") && /* @__PURE__ */ f(
+          j.label,
           {
-            htmlFor: c,
-            className: h(
+            htmlFor: i,
+            className: p(
               "absolute left-4  transition-all duration-300",
               {
-                "text-body-small top-2": e == "filled" && !(!N && !L.length),
-                "text-body-large top-1/2 transform -translate-y-1/2": !(e == "filled" && !(!N && !L.length))
+                "text-body-small top-2": e == "filled" && !(!N && !g.length),
+                "text-body-large top-1/2 transform -translate-y-1/2": !(e == "filled" && !(!N && !g.length))
               }
             ),
             transition: { duration: 0.3 },
             children: /* @__PURE__ */ f(
-              H.span,
+              j.span,
               {
-                className: Y.label,
+                className: _.label,
                 transition: { duration: 0.3 },
-                layoutId: e == "outlined" ? z : void 0,
-                children: i
+                layoutId: e == "outlined" ? oe : void 0,
+                children: c
               }
             )
           }
         ),
         /* @__PURE__ */ f(
-          x,
+          E,
           {
-            ref: g,
-            value: L,
-            onChange: q,
-            className: Y.input,
-            id: c,
-            name: c,
+            ref: x,
+            value: g,
+            onChange: J,
+            className: _.input,
+            id: i,
+            name: i,
             placeholder: N ? l ?? void 0 : "",
-            onFocus: X,
-            onBlur: G,
+            onFocus: U,
+            onBlur: re,
             disabled: t,
-            autoComplete: d,
+            autoComplete: u,
             "aria-invalid": !!(n != null && n.length),
-            "aria-label": i,
-            ...b
+            "aria-label": c,
+            ...S
           }
         )
       ] }),
-      /* @__PURE__ */ f("div", { className: Y.activeIndicator }),
-      !M && /* @__PURE__ */ A(te, { children: [
-        a && /* @__PURE__ */ f(
+      /* @__PURE__ */ f("div", { className: _.activeIndicator }),
+      !L && /* @__PURE__ */ Y(ye, { children: [
+        o && /* @__PURE__ */ f(
           "div",
           {
-            onClick: (P) => {
-              P.stopPropagation();
+            onClick: (X) => {
+              X.stopPropagation();
             },
-            className: Y.trailingIcon,
-            children: K.isValidElement(a) ? a : /* @__PURE__ */ f(Z, { className: "h-5", icon: a })
+            className: _.trailingIcon,
+            children: te.isValidElement(o) ? o : /* @__PURE__ */ f(ie, { className: "h-5", icon: o })
           }
         ),
-        !a && r && /* @__PURE__ */ f("span", { className: Y.suffix, children: r })
+        !o && r && /* @__PURE__ */ f("span", { className: _.suffix, children: r })
       ] }),
-      M && /* @__PURE__ */ f(
+      L && /* @__PURE__ */ f(
         "div",
         {
-          className: h(Y.trailingIcon, {
-            " absolute right-0": !a
+          className: p(_.trailingIcon, {
+            " absolute right-0": !o
           }),
           children: /* @__PURE__ */ f(
-            Z,
+            ie,
             {
               className: "h-5 text-error",
-              icon: Lt
+              icon: Xt
             }
           )
         }
       )
     ] }),
-    W && /* @__PURE__ */ f("p", { className: Y.supportingText, children: n != null && n.length ? n : u != null && u.length ? u : " " })
+    F && /* @__PURE__ */ f("p", { className: _.supportingText, children: n != null && n.length ? n : d != null && d.length ? d : " " })
   ] });
-}, It = j(
+}, Yt = G(
   "navigationRailItem",
   ({ isSelected: e, icon: t, label: n, variant: l }) => ({
-    navigationRailItem: h(
+    navigationRailItem: p(
       " group flex flex-col  pt-1 pb-1.5 cursor-pointer",
       {
         "text-on-surface-variant": !e,
@@ -2923,7 +3198,7 @@ const Kt = ({
         "gap-0  h-[66px]": l == "horizontal"
       }
     ),
-    container: h(
+    container: p(
       " w-fit flex justify-center  relative rounded-full items-center mx-5",
       {
         "bg-secondary-container overflow-hidden": e,
@@ -2939,129 +3214,129 @@ const Kt = ({
         }
       ]
     ),
-    stateLayer: h(
+    stateLayer: p(
       "  absolute w-full rounded-full h-full left-0 top-0  ",
       {
         "group-state-on-surface": !e,
         "group-state-on-secondary-container": e
       }
     ),
-    icon: h("size-6 flex"),
-    label: h("w-fit mx-auto text-nowrap", {
+    icon: p("size-6 flex"),
+    label: p("w-fit mx-auto text-nowrap", {
       "text-label-large ": l == "horizontal",
       "text-label-medium": l == "vertical"
     })
   })
-), kt = ({ label: e }) => /* @__PURE__ */ f("div", { className: " h-9 flex items-center mx-9 mt-3", children: /* @__PURE__ */ f("p", { className: "text-label-large text-on-surface-variant", children: e }) }), St = ({
+), jt = ({ label: e }) => /* @__PURE__ */ f("div", { className: " h-9 flex items-center mx-9 mt-3", children: /* @__PURE__ */ f("p", { className: "text-label-large text-on-surface-variant", children: e }) }), qt = ({
   className: e,
   onClick: t,
   label: n,
   variant: l = "vertical",
   href: r,
-  icon: c,
-  selectedItem: i,
+  icon: i,
+  selectedItem: c,
   setSelectedItem: s,
-  index: u,
-  onItemSelected: a,
-  selected: p = !1,
-  ref: m,
-  transition: o,
-  isExtended: d,
-  iconSelected: y,
-  style: v,
+  index: d,
+  onItemSelected: o,
+  selected: h = !1,
+  ref: y,
+  transition: a,
+  isExtended: u,
+  iconSelected: m,
+  style: b,
   extendedOnly: w,
-  children: E,
-  ...L
+  children: M,
+  ...g
 }) => {
-  E && (n = E);
-  const B = D(null), N = m || B, [I, M] = S(p);
-  R(() => {
-    p && i == null ? M(!0) : M(i == u && u != null);
-  }, [i]), R(() => {
-    i == u && a && a({
+  M && (n = M);
+  const R = P(null), N = y || R, [A, L] = D(h);
+  $(() => {
+    h && c == null ? L(!0) : L(c == d && d != null);
+  }, [c]), $(() => {
+    c == d && o && o({
       ref: N,
-      index: u || 0,
+      index: d || 0,
       label: n,
-      icon: c
+      icon: i
     });
-  }, [i]);
-  const V = r ? "a" : "button", W = (g) => {
-    s && s(u ?? null), t && t(g);
-  }, k = It({
-    isExtended: d,
+  }, [c]);
+  const O = r ? "a" : "button", F = (x) => {
+    s && s(d ?? null), t && t(x);
+  }, C = Yt({
+    isExtended: u,
     extendedOnly: w,
     className: e,
-    onItemSelected: a,
-    selectedItem: i,
-    index: u,
-    transition: o,
-    selected: I,
+    onItemSelected: o,
+    selectedItem: c,
+    index: d,
+    transition: a,
+    selected: A,
     variant: l,
-    icon: c,
+    icon: i,
     label: n,
-    isSelected: I,
+    isSelected: A,
     setSelectedItem: s,
     href: r,
     children: n,
-    iconSelected: y
+    iconSelected: m
   });
-  return o = { duration: 0.3, ...o }, w && !d ? null : (
+  return a = { duration: 0.3, ...a }, w && !u ? null : (
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-expect-error
-    /* @__PURE__ */ A(
-      V,
+    /* @__PURE__ */ Y(
+      O,
       {
-        ...L,
+        ...g,
         role: "tab",
-        "aria-selected": I,
+        "aria-selected": A,
         ref: N,
         href: r,
-        className: k.navigationRailItem,
-        onClick: W,
-        style: { transition: o.duration + "s", ...v },
+        className: C.navigationRailItem,
+        onClick: F,
+        style: { transition: a.duration + "s", ...b },
         children: [
-          /* @__PURE__ */ A(
-            H.div,
+          /* @__PURE__ */ Y(
+            j.div,
             {
               style: {
-                transition: l == "horizontal" ? o.duration + `s, gap ${o.duration / 2}s ${o.duration - o.duration / 2}s` : o.duration + `s, gap ${o.duration / 3}s ${o.duration - o.duration / 3}s`
+                transition: l == "horizontal" ? a.duration + `s, gap ${a.duration / 2}s ${a.duration - a.duration / 2}s` : a.duration + `s, gap ${a.duration / 3}s ${a.duration - a.duration / 3}s`
               },
-              transition: o,
-              className: k.container,
+              transition: a,
+              className: C.container,
               children: [
-                /* @__PURE__ */ f(H.div, { layout: !0, className: k.stateLayer }),
-                c && /* @__PURE__ */ f(
-                  Z,
+                /* @__PURE__ */ f(j.div, { layout: !0, className: C.stateLayer }),
+                i && /* @__PURE__ */ f(
+                  ie,
                   {
-                    icon: I ? y : c,
-                    className: k.icon
+                    icon: A ? m : i,
+                    className: C.icon
                   }
                 ),
-                /* @__PURE__ */ f(Q, { children: l == "horizontal" && (() => {
-                  const g = {
+                /* @__PURE__ */ f(ue, { children: l == "horizontal" && (() => {
+                  const x = {
                     width: 0,
                     opacity: 0,
                     transition: {
-                      ...o
+                      ...a
                     }
-                  }, C = {
+                  }, k = {
                     width: "auto",
                     opacity: 1,
                     transition: {
-                      ...o,
+                      ...a,
                       opacity: {
-                        duration: o.duration / 2,
-                        delay: o.duration - o.duration / 2
+                        duration: a.duration / 2,
+                        delay: a.duration - a.duration / 2
                       }
                     }
                   };
                   return /* @__PURE__ */ f(
-                    H.span,
+                    j.span,
                     {
-                      initial: g,
-                      animate: C,
-                      exit: g,
-                      className: k.label,
+                      initial: x,
+                      animate: k,
+                      exit: x,
+                      className: C.label,
                       children: n
                     }
                   );
@@ -3069,35 +3344,35 @@ const Kt = ({
               ]
             }
           ),
-          /* @__PURE__ */ f(Q, { children: l == "vertical" && (() => {
-            const g = {
+          /* @__PURE__ */ f(ue, { children: l == "vertical" && (() => {
+            const x = {
               height: 0,
               opacity: 0,
               transition: {
-                ...o,
+                ...a,
                 opacity: {
                   duration: 0
                 }
               }
-            }, C = {
+            }, k = {
               height: "auto",
               opacity: 1,
               transition: {
-                ...o,
+                ...a,
                 opacity: {
-                  duration: o.duration / 3,
-                  delay: o.duration - o.duration / 3
+                  duration: a.duration / 3,
+                  delay: a.duration - a.duration / 3
                 }
               }
             };
             return /* @__PURE__ */ f(
-              H.span,
+              j.span,
               {
-                initial: C,
-                animate: C,
-                exit: g,
-                className: k.label,
-                transition: o,
+                initial: k,
+                animate: k,
+                exit: x,
+                className: C.label,
+                transition: a,
                 children: n
               }
             );
@@ -3106,180 +3381,180 @@ const Kt = ({
       }
     )
   );
-}, $t = j(
+}, Kt = G(
   "navigationRail",
   ({ isExtended: e, alignment: t }) => ({
-    navigationRail: h("flex flex-col  left-0 h-full top-0 pt-11", {
+    navigationRail: p("flex flex-col  left-0 h-full top-0 pt-11", {
       "w-fit max-w-24": !e,
       "w-fit min-w-[220px] max-w-[360px]": e,
       "justify-between": t == "middle",
       "justify-start": t == "top"
     }),
-    header: h("flex flex-col gap-1 items-start"),
+    header: p("flex flex-col gap-1 items-start"),
     menuIcon: "mx-5",
-    segments: h(" flex flex-col  overflow-auto min-w-full mt-10", {
+    segments: p(" flex flex-col  overflow-auto min-w-full mt-10", {
       "w-full": !e,
       "w-fit  items-start": e
     })
   })
-), zt = ({
+), yn = ({
   variant: e = "standard",
   onItemSelected: t,
   children: n,
   className: l,
   selectedItem: r,
-  extended: c,
-  alignment: i = "top",
+  extended: i,
+  alignment: c = "top",
   menu: s = {
     closed: {
-      icon: Nt,
+      icon: Ot,
       label: "Open menu"
     },
     opened: {
-      icon: de,
+      icon: Ce,
       label: "Close menu"
     }
   },
-  style: u,
-  onExtendedChange: a,
-  transition: p,
-  setSelectedItem: m
+  style: d,
+  onExtendedChange: o,
+  transition: h,
+  setSelectedItem: y
 }) => {
-  const [o, d] = S(null), [y, v] = S(c);
+  const [a, u] = D(null), [m, b] = D(i);
   let w;
-  r == 0 || r != null ? w = r : w = o;
-  const E = m || d, L = D(null), B = (k) => {
-    t == null || t(k);
+  r == 0 || r != null ? w = r : w = a;
+  const M = y || u, g = P(null), R = (C) => {
+    t == null || t(C);
   };
-  function N(k) {
-    const g = [];
-    return Se.forEach(k, (C) => {
-      ee(C) && C.type === $e ? g.push(...N(C.props.children)) : g.push(C);
-    }), g;
+  function N(C) {
+    const x = [];
+    return Ke.forEach(C, (k) => {
+      pe(k) && k.type === _e ? x.push(...N(k.props.children)) : x.push(k);
+    }), x;
   }
-  const I = N(n), M = I.filter(
-    (k) => ee(k) && k.type === ge
-  ), V = $t({
+  const A = N(n), L = A.filter(
+    (C) => pe(C) && C.type === Ae
+  ), O = Kt({
     children: n,
     onItemSelected: t,
     selectedItem: w,
-    setSelectedItem: E,
+    setSelectedItem: M,
     className: l,
     variant: e,
-    extended: y,
-    isExtended: y,
-    alignment: i,
+    extended: m,
+    isExtended: m,
+    alignment: c,
     menu: s,
-    transition: p,
-    onExtendedChange: a
+    transition: h,
+    onExtendedChange: o
   });
-  p = { duration: 0.3, ...p };
-  const W = D(!1);
-  return W.current = !1, R(() => {
-    a == null || a(y ?? !1);
-  }, [y]), /* @__PURE__ */ A(
+  h = { duration: 0.3, ...h };
+  const F = P(!1);
+  return F.current = !1, $(() => {
+    o == null || o(m ?? !1);
+  }, [m]), /* @__PURE__ */ Y(
     "div",
     {
-      style: { transition: p.duration + "s", ...u },
-      ref: L,
-      className: V.navigationRail,
+      style: { transition: h.duration + "s", ...d },
+      ref: g,
+      className: O.navigationRail,
       children: [
-        /* @__PURE__ */ A("div", { className: V.header, children: [
+        /* @__PURE__ */ Y("div", { className: O.header, children: [
           /* @__PURE__ */ f(
-            ue,
+            $e,
             {
-              onClick: () => v(!y),
-              label: y ? s == null ? void 0 : s.opened.label : s == null ? void 0 : s.closed.label,
-              className: V.menuIcon,
-              icon: y ? s.opened.icon : s == null ? void 0 : s.closed.icon
+              onClick: () => b(!m),
+              label: m ? s == null ? void 0 : s.opened.label : s == null ? void 0 : s.closed.label,
+              className: O.menuIcon,
+              icon: m ? s.opened.icon : s == null ? void 0 : s.closed.icon
             }
           ),
-          M.length > 0 && oe(M[0], {
-            transition: p,
-            isExtended: y,
-            className: "!shadow-none mx-5 " + M[0].props.className
+          L.length > 0 && be(L[0], {
+            transition: h,
+            isExtended: m,
+            className: "!shadow-none mx-5 " + L[0].props.className
           })
         ] }),
-        /* @__PURE__ */ f("div", { className: V.segments, children: (() => {
-          let k = 0;
-          return I.map((g) => ee(g) && g.type === St ? oe(
-            g,
+        /* @__PURE__ */ f("div", { className: O.segments, children: (() => {
+          let C = 0;
+          return A.map((x) => pe(x) && x.type === qt ? be(
+            x,
             {
-              key: k,
-              index: k++,
+              key: C,
+              index: C++,
               // Utilise et incrémente le compteur dédié
-              variant: y ? "horizontal" : "vertical",
+              variant: m ? "horizontal" : "vertical",
               selectedItem: w,
-              setSelectedItem: E,
-              onItemSelected: B,
-              transition: p,
-              extendedOnly: W.current,
-              isExtended: y
+              setSelectedItem: M,
+              onItemSelected: R,
+              transition: h,
+              extendedOnly: F.current,
+              isExtended: m
             }
-          ) : ee(g) && g.type === ge ? null : ee(g) && g.type === kt ? (W.current = !0, y ? oe(g, {}) : null) : g);
+          ) : pe(x) && x.type === Ae ? null : pe(x) && x.type === jt ? (F.current = !0, m ? be(x, {}) : null) : x);
         })() }),
         /* @__PURE__ */ f("div", { className: "flex-1 max-h-[160px]" })
       ]
     }
   );
 };
-function Tt(e) {
-  return We({
-    variant: Ae.Udixio,
+function xn(e) {
+  return ze({
+    variant: et.Udixio,
     ...e,
-    plugins: [new Pe(e), new be(e)]
+    plugins: [new Te(e), new Xe(e)]
   });
 }
 export {
-  Xt as AnimateOnScrollInit,
-  ht as Button,
-  jt as Card,
-  qt as Carousel,
-  yt as CarouselItem,
-  lt as CustomScroll,
-  gt as Divider,
-  ge as Fab,
-  Z as Icon,
-  ue as IconButton,
-  zt as NavigationRail,
-  St as NavigationRailItem,
-  kt as NavigationRailSection,
-  rt as ProgressIndicator,
-  re as RippleEffect,
-  Kt as SideSheet,
-  _t as Slider,
-  Ot as SmoothScroll,
-  Gt as Snackbar,
-  Jt as Switch,
-  st as SyncedFixedWrapper,
-  Et as Tab,
-  Zt as Tabs,
-  Qt as TextField,
-  Ut as ThemeProvider,
-  Ee as ToolTip,
-  Yt as animateOnScroll,
-  Ue as buttonStyle,
-  Xe as cardStyle,
-  Ye as carouselItemStyle,
-  je as carouselStyle,
-  h as classNames,
-  He as classnames,
-  ot as customScrollStyle,
-  j as defaultClassNames,
-  Tt as defineConfig,
-  qe as dividerStyle,
-  _e as fabStyle,
-  Oe as getClassNames,
-  Ke as iconButtonStyle,
-  Ne as initAnimateOnScroll,
-  pt as normalize,
-  Ge as progressIndicatorStyle,
-  Je as sideSheetStyle,
-  Ze as sliderStyle,
-  Qe as snackbarStyle,
-  ze as switchStyle,
-  Te as tabStyle,
-  et as tabsStyle,
-  tt as textFieldStyle,
-  nt as toolStyle
+  ln as AnimateOnScrollInit,
+  Wt as Button,
+  sn as Card,
+  cn as Carousel,
+  Bt as CarouselItem,
+  Et as CustomScroll,
+  Pt as Divider,
+  Ae as Fab,
+  ie as Icon,
+  $e as IconButton,
+  yn as NavigationRail,
+  qt as NavigationRailItem,
+  jt as NavigationRailSection,
+  bt as ProgressIndicator,
+  ve as RippleEffect,
+  dn as SideSheet,
+  un as Slider,
+  rn as SmoothScroll,
+  fn as Snackbar,
+  mn as Switch,
+  kt as SyncedFixedWrapper,
+  Ut as Tab,
+  hn as Tabs,
+  pn as TextField,
+  on as ThemeProvider,
+  Ye as ToolTip,
+  an as animateOnScroll,
+  lt as buttonStyle,
+  at as cardStyle,
+  st as carouselItemStyle,
+  ct as carouselStyle,
+  p as classNames,
+  nt as classnames,
+  Lt as customScrollStyle,
+  G as defaultClassNames,
+  xn as defineConfig,
+  it as dividerStyle,
+  ut as fabStyle,
+  ot as getClassNames,
+  dt as iconButtonStyle,
+  Ue as initAnimateOnScroll,
+  fe as normalize,
+  ft as progressIndicatorStyle,
+  mt as sideSheetStyle,
+  ht as sliderStyle,
+  pt as snackbarStyle,
+  yt as switchStyle,
+  xt as tabStyle,
+  vt as tabsStyle,
+  wt as textFieldStyle,
+  gt as toolStyle
 };