@situaction/traq-ui-ste 1.2.19 → 1.2.23

package/dist/Carousel.module-RC3aC2Nl.mjs

@@ -0,0 +1,22 @@
+import './styles/Carousel.css';const n = "_root_vqc19_6", t = "_viewport_vqc19_11", e = "_dragEnabled_vqc19_31", _ = "_dragging_vqc19_36", a = "_slide_vqc19_43", c = "_navButtonCtn_vqc19_50", o = "_navButton_vqc19_50", v = "_defaultBtn_vqc19_68", d = "_navPrev_vqc19_85", i = "_navNext_vqc19_90", s = "_fadeViewport_vqc19_95", f = "_fadeSlide_vqc19_102", g = "_fadeActive_vqc19_110", r = "_fadeOutgoing_vqc19_115", q = "_fadeIncoming_vqc19_119", u = "_fadeRunning_vqc19_123", l = "_fadeInteractive_vqc19_131", B = {
+  root: n,
+  viewport: t,
+  dragEnabled: e,
+  dragging: _,
+  slide: a,
+  navButtonCtn: c,
+  navButton: o,
+  defaultBtn: v,
+  navPrev: d,
+  navNext: i,
+  fadeViewport: s,
+  fadeSlide: f,
+  fadeActive: g,
+  fadeOutgoing: r,
+  fadeIncoming: q,
+  fadeRunning: u,
+  fadeInteractive: l
+};
+export {
+  B as s
+};

package/dist/components/carousel/Carousel.js

@@ -1,323 +1,319 @@
-import { jsxs as ie, jsx as p, Fragment as De } from "react/jsx-runtime";
-import $e, { forwardRef as We, useMemo as ue, useRef as l, useState as F, useEffect as q, useCallback as i, useImperativeHandle as Ee } from "react";
-import '../../styles/Carousel.css';const Fe = "_root_zgsjf_6", qe = "_viewport_zgsjf_11", He = "_dragEnabled_zgsjf_27", Oe = "_dragging_zgsjf_32", Xe = "_slide_zgsjf_39", Ve = "_navButtonCtn_zgsjf_46", Ke = "_navButton_zgsjf_46", Ue = "_defaultBtn_zgsjf_64", Ye = "_navPrev_zgsjf_81", Ge = "_navNext_zgsjf_86", f = {
-  root: Fe,
-  viewport: qe,
-  dragEnabled: He,
-  dragging: Oe,
-  slide: Xe,
-  navButtonCtn: Ve,
-  navButton: Ke,
-  defaultBtn: Ue,
-  navPrev: Ye,
-  navNext: Ge
-}, k = (...P) => P.filter(Boolean).join(" "), Ze = We(
+import { jsxs as fe, jsx as v, Fragment as qe } from "react/jsx-runtime";
+import He, { forwardRef as je, useMemo as de, useRef as a, useState as X, useCallback as u, useEffect as A, useImperativeHandle as Oe } from "react";
+import { s as f } from "../../Carousel.module-RC3aC2Nl.mjs";
+const P = (...D) => D.filter(Boolean).join(" "), Ve = je(
   ({
-    children: P,
-    className: le,
-    viewportClassName: fe,
-    slideClassName: de,
-    style: ve,
-    slideSize: me = "30%",
-    gap: pe = 12,
+    children: D,
+    className: me,
+    viewportClassName: pe,
+    slideClassName: ve,
+    style: we,
+    slideSize: he = "30%",
+    gap: ge = 12,
     align: h = "center",
-    showArrows: ge = !0,
-    dragEnabled: N = !0,
-    snapOnRelease: J = !0,
-    keyboardNavigation: he = !0,
-    btnGradientColor: we,
-    step: _e = 1,
-    initialIndex: Q = 0,
-    loop: R = !1,
-    ariaLabel: Z = "Carousel",
-    iconLeft: xe,
-    iconRight: Ie,
-    onIndexChange: H
-  }, Le) => {
-    const w = ue(() => $e.Children.toArray(P), [P]), s = w.length, c = R && s > 1, S = Math.max(1, Math.min(_e, Math.max(1, s))), v = c ? s : 0, _ = ue(() => {
-      if (!c)
-        return w.map((n, o) => ({
+    showArrows: xe = !0,
+    dragEnabled: C = !0,
+    snapOnRelease: ee = !0,
+    keyboardNavigation: Ie = !0,
+    btnGradientColor: Le,
+    step: Re = 1,
+    initialIndex: te = 0,
+    loop: N = !1,
+    ariaLabel: re = "Carousel",
+    iconLeft: ye,
+    iconRight: be,
+    onIndexChange: _
+  }, ke) => {
+    const g = de(() => He.Children.toArray(D), [D]), c = g.length, s = N && c > 1, $ = Math.max(1, Math.min(Re, Math.max(1, c))), m = s ? c : 0, x = de(() => {
+      if (!s)
+        return g.map((n, o) => ({
           key: `real-${o}`,
           node: n,
           realIndex: o,
           isClone: !1
         }));
-      const e = w.map((n, o) => ({
+      const e = g.map((n, o) => ({
         key: `clone-head-${o}`,
         node: n,
         realIndex: o,
         isClone: !0
-      })), t = w.map((n, o) => ({
+      })), t = g.map((n, o) => ({
         key: `real-${o}`,
         node: n,
         realIndex: o,
         isClone: !1
-      })), r = w.map((n, o) => ({
+      })), r = g.map((n, o) => ({
         key: `clone-tail-${o}`,
         node: n,
         realIndex: o,
         isClone: !0
       }));
       return [...e, ...t, ...r];
-    }, [c, w]), O = _.length, a = l(null), x = l([]), [be, Ce] = F(0), y = l(0), [Ne, ee] = F(!1), [Re, te] = F(!1), I = l(!1), re = l(0), X = l(0), V = l(!1), K = l(!1), [ye, ne] = F(!1), M = l(H);
-    q(() => {
-      M.current = H;
-    }, [H]);
-    const m = i((e) => {
+    }, [s, g]), U = x.length, i = a(null), I = a([]), [Se, Ce] = X(0), L = a(0), [Ne, ne] = X(!1), [Te, oe] = X(!1), R = a(!1), ce = a(0), V = a(0), K = a(!1), Y = a(!1), [Me, se] = X(!1), W = a(_), z = a(!1), y = a(null), G = u(() => {
+      z.current = !0, y.current != null && window.clearTimeout(y.current), y.current = window.setTimeout(() => {
+        z.current = !1, y.current = null;
+      }, 120);
+    }, []);
+    A(() => () => {
+      y.current != null && window.clearTimeout(y.current);
+    }, []), A(() => {
+      W.current = _;
+    }, [_]);
+    const p = u((e) => {
       var t;
-      y.current = e, Ce(e), (t = M.current) == null || t.call(M, e);
-    }, []), oe = i((e) => {
-      const t = a.current;
+      e !== L.current && (L.current = e, Ce(e), (t = W.current) == null || t.call(W, e));
+    }, []), ie = u((e) => {
+      const t = i.current;
       t && (t.style.scrollSnapType = e ? "x mandatory" : "none", t.style.scrollBehavior = e ? "smooth" : "auto");
-    }, []), z = i(
+    }, []), T = u(
       (e, t) => h === "center" ? t.offsetLeft - (e.clientWidth - t.offsetWidth) / 2 : t.offsetLeft,
       [h]
-    ), L = i(
+    ), b = u(
       (e, t = "smooth") => {
-        const r = a.current, n = x.current[e];
+        const r = i.current, n = I.current[e];
         if (!r || !n) return;
-        const o = z(r, n);
+        const o = T(r, n);
         r.scrollTo({ left: o, behavior: t });
       },
-      [z]
-    ), j = i(
-      (e) => s === 0 ? 0 : R ? (e % s + s) % s : Math.max(0, Math.min(s - 1, e)),
-      [R, s]
-    ), A = i(
-      (e) => c ? v + e : e,
-      [c, v]
-    ), b = i(
+      [T]
+    ), B = u(
+      (e) => c === 0 ? 0 : N ? (e % c + c) % c : Math.max(0, Math.min(c - 1, e)),
+      [N, c]
+    ), F = u(
+      (e) => s ? m + e : e,
+      [s, m]
+    ), k = u(
       (e, t = "smooth") => {
-        const r = j(e), n = A(r);
-        L(n, t), m(r);
+        const r = B(e), n = F(r);
+        t === "smooth" && G(), b(n, t), p(r);
       },
-      [j, A, L, m]
-    ), T = i(() => {
-      const e = a.current;
-      if (!e || O === 0) return 0;
+      [B, F, b, p, G]
+    ), E = u(() => {
+      const e = i.current;
+      if (!e || U === 0) return 0;
       const t = e.scrollLeft, r = h === "center" ? t + e.clientWidth / 2 : t;
       let n = 0, o = Number.POSITIVE_INFINITY;
-      for (let d = 0; d < O; d++) {
-        const u = x.current[d];
-        if (!u) continue;
-        const g = h === "center" ? u.offsetLeft + u.offsetWidth / 2 : u.offsetLeft, E = Math.abs(g - r);
-        E < o && (o = E, n = d);
+      for (let d = 0; d < U; d++) {
+        const l = I.current[d];
+        if (!l) continue;
+        const w = h === "center" ? l.offsetLeft + l.offsetWidth / 2 : l.offsetLeft, O = Math.abs(w - r);
+        O < o && (o = O, n = d);
       }
       return n;
-    }, [h, O]), D = i(
-      (e) => c ? e < v ? e + s : e >= v + s ? e - s : e : e,
-      [c, v, s]
-    ), se = l({
+    }, [h, U]), q = u(
+      (e) => s ? e < m ? e + c : e >= m + c ? e - c : e : e,
+      [s, m, c]
+    ), ue = a({
       middleStart: 0,
       groupWidth: 0
-    }), C = i(() => {
-      if (!c) return;
-      const e = a.current;
+    }), S = u(() => {
+      if (!s) return;
+      const e = i.current;
       if (!e) return;
-      const t = x.current[v], r = x.current[v + s];
+      const t = I.current[m], r = I.current[m + c];
       if (!t || !r) return;
-      const n = z(e, t), o = z(e, r);
-      se.current = {
+      const n = T(e, t), o = T(e, r);
+      ue.current = {
         middleStart: n,
         groupWidth: o - n
       };
-    }, [c, v, s, z]), U = l(!1), Y = i(
+    }, [s, m, c, T]), J = a(!1), Q = u(
       (e) => {
-        if (!c) return;
-        const t = a.current;
+        if (!s) return;
+        const t = i.current;
         if (!t) return;
-        const { middleStart: r, groupWidth: n } = se.current;
+        const { middleStart: r, groupWidth: n } = ue.current;
         if (n <= 0) return;
         const o = r, d = r + n;
-        let u = t.scrollLeft, g = 0;
-        u < o ? g = Math.ceil((o - u) / n) * n : u > d && (g = -Math.ceil((u - d) / n) * n), g !== 0 && (U.current = !0, t.scrollLeft = u + g, e === "drag" && (X.current += g), U.current = !1);
+        let l = t.scrollLeft, w = 0;
+        l < o ? w = Math.ceil((o - l) / n) * n : l > d && (w = -Math.ceil((l - d) / n) * n), w !== 0 && (J.current = !0, t.scrollLeft = l + w, e === "drag" && (V.current += w), J.current = !1);
       },
-      [c]
-    ), B = i(() => {
-      if (R) {
-        ee(s > 1), te(s > 1);
+      [s]
+    ), M = u(() => {
+      if (N) {
+        ne(c > 1), oe(c > 1);
         return;
       }
-      const e = a.current;
+      const e = i.current;
       if (!e) return;
       const t = e.scrollWidth - e.clientWidth, r = 1;
-      ee(t > r && e.scrollLeft > r), te(t > r && e.scrollLeft < t - r);
-    }, [R, s]), $ = i(() => {
-      s <= 1 || b(y.current + S);
-    }, [b, s, S]), W = i(() => {
-      s <= 1 || b(y.current - S);
-    }, [b, s, S]), ze = i(() => {
+      ne(t > r && e.scrollLeft > r), oe(t > r && e.scrollLeft < t - r);
+    }, [N, c]), H = u(() => {
+      c <= 1 || k(L.current + $);
+    }, [k, c, $]), j = u(() => {
+      c <= 1 || k(L.current - $);
+    }, [k, c, $]), Ae = u(() => {
       var n;
-      if (!J) return;
-      const e = T(), t = D(e);
-      L(t, "smooth");
-      const r = ((n = _[t]) == null ? void 0 : n.realIndex) ?? 0;
-      m(r);
+      if (!ee) return;
+      const e = E(), t = q(e);
+      b(t, "smooth");
+      const r = ((n = x[t]) == null ? void 0 : n.realIndex) ?? 0;
+      p(r);
     }, [
-      J,
-      T,
-      D,
-      L,
-      _,
-      m
+      ee,
+      E,
+      q,
+      b,
+      x,
+      p
     ]);
-    Ee(
-      Le,
+    Oe(
+      ke,
       () => ({
-        next: $,
-        prev: W,
-        goTo: b,
-        getIndex: () => y.current,
-        getLength: () => s
+        next: H,
+        prev: j,
+        goTo: k,
+        getIndex: () => L.current,
+        getLength: () => c
       }),
-      [b, $, W, s]
-    ), q(() => {
-      if (s === 0) return;
-      const e = j(Q), t = A(e), r = window.requestAnimationFrame(() => {
-        C(), L(t, "auto"), m(e), B();
+      [k, H, j, c]
+    ), A(() => {
+      if (c === 0) return;
+      const e = B(te), t = F(e), r = window.requestAnimationFrame(() => {
+        S(), b(t, "auto"), p(e), M();
       });
       return () => window.cancelAnimationFrame(r);
     }, [
-      s,
-      Q,
-      j,
-      A,
-      L,
-      m,
+      c,
+      te,
       B,
-      C
-    ]), q(() => {
-      if (!c) return;
-      const e = a.current;
+      F,
+      b,
+      p,
+      M,
+      S
+    ]), A(() => {
+      if (!s) return;
+      const e = i.current;
       if (!e) return;
       const t = typeof ResizeObserver < "u" ? new ResizeObserver(() => {
-        C();
+        S();
       }) : null;
-      t == null || t.observe(e), x.current.forEach((o) => o && (t == null ? void 0 : t.observe(o)));
-      const r = () => C();
+      t == null || t.observe(e), I.current.forEach((o) => o && (t == null ? void 0 : t.observe(o)));
+      const r = () => S();
       window.addEventListener("resize", r);
-      const n = window.requestAnimationFrame(() => C());
+      const n = window.requestAnimationFrame(() => S());
       return () => {
         window.removeEventListener("resize", r), window.cancelAnimationFrame(n), t == null || t.disconnect();
       };
-    }, [c, C]), q(() => {
-      const e = a.current;
+    }, [s, S]), A(() => {
+      const e = i.current;
       if (!e) return;
       const t = { current: 0 }, r = () => {
-        U.current || (c && !I.current && Y("scroll"), B(), !t.current && (t.current = window.requestAnimationFrame(() => {
-          var u;
+        J.current || (s && !R.current && Q("scroll"), M(), !t.current && (z.current && G(), t.current = window.requestAnimationFrame(() => {
+          var l;
           t.current = 0;
-          const n = T(), o = D(n), d = ((u = _[o]) == null ? void 0 : u.realIndex) ?? 0;
-          d !== y.current && m(d);
+          const n = E(), o = q(n), d = ((l = x[o]) == null ? void 0 : l.realIndex) ?? 0;
+          z.current || d !== L.current && p(d);
         })));
       };
       return e.addEventListener("scroll", r, { passive: !0 }), () => {
         e.removeEventListener("scroll", r), t.current && window.cancelAnimationFrame(t.current);
       };
     }, [
-      c,
-      Y,
-      B,
-      T,
-      D,
-      _,
-      m
+      s,
+      Q,
+      M,
+      E,
+      q,
+      x,
+      p
     ]);
-    const Be = (e) => e instanceof HTMLElement ? !!e.closest(
+    const Pe = (e) => e instanceof HTMLElement ? !!e.closest(
       'button, a, input, textarea, select, option, [role="button"], [data-carousel-no-drag="true"]'
-    ) : !1, G = l(null), ce = l(0), ke = (e) => {
+    ) : !1, Z = a(null), ae = a(0), De = (e) => {
       var t, r, n, o;
-      N && a.current && (Be(e.target) || e.pointerType === "mouse" && e.button !== 0 || (e.preventDefault(), oe(!1), I.current = !0, V.current = !1, re.current = e.clientX, X.current = a.current.scrollLeft, ne(!0), (r = (t = a.current).focus) == null || r.call(t), (o = (n = a.current).setPointerCapture) == null || o.call(n, e.pointerId)));
-    }, Pe = (e) => {
-      if (!N || !I.current || (e.preventDefault(), !a.current)) return;
-      const r = e.clientX - re.current;
-      Math.abs(r) > 4 && (V.current = !0);
-      const n = X.current - r;
-      ce.current = n, G.current == null && (G.current = window.requestAnimationFrame(() => {
-        G.current = null;
-        const o = a.current;
-        o && (o.scrollLeft = ce.current, c && Y("drag"));
+      C && i.current && (Pe(e.target) || e.pointerType === "mouse" && e.button !== 0 || (e.preventDefault(), ie(!1), R.current = !0, K.current = !1, ce.current = e.clientX, V.current = i.current.scrollLeft, se(!0), (r = (t = i.current).focus) == null || r.call(t), (o = (n = i.current).setPointerCapture) == null || o.call(n, e.pointerId)));
+    }, $e = (e) => {
+      if (!C || !R.current || (e.preventDefault(), !i.current)) return;
+      const r = e.clientX - ce.current;
+      Math.abs(r) > 4 && (K.current = !0);
+      const n = V.current - r;
+      ae.current = n, Z.current == null && (Z.current = window.requestAnimationFrame(() => {
+        Z.current = null;
+        const o = i.current;
+        o && (o.scrollLeft = ae.current, s && Q("drag"));
       }));
-    }, ae = (e) => {
+    }, le = (e) => {
       var r;
-      const t = a.current;
-      if (I.current = !1, ne(!1), t && e != null)
+      const t = i.current;
+      if (R.current = !1, se(!1), t && e != null)
         try {
           (r = t.releasePointerCapture) == null || r.call(t, e);
         } catch {
         }
-      V.current && (K.current = !0, window.setTimeout(() => {
-        K.current = !1;
-      }, 0)), oe(!0), ze(), B();
-    }, Se = (e) => {
-      N && I.current && ae(e.pointerId);
-    }, Me = (e) => {
-      N && I.current && ae(e.pointerId);
-    }, je = (e) => {
-      K.current && (e.preventDefault(), e.stopPropagation());
-    }, Ae = (e) => {
-      he && (e.key === "ArrowLeft" ? (e.preventDefault(), W()) : e.key === "ArrowRight" && (e.preventDefault(), $()));
-    }, Te = {
-      ...ve ?? {},
-      "--carousel-gap": `${pe}px`,
-      "--carousel-slide-size": me,
+      K.current && (Y.current = !0, window.setTimeout(() => {
+        Y.current = !1;
+      }, 0)), ie(!0), Ae(), M();
+    }, We = (e) => {
+      C && R.current && le(e.pointerId);
+    }, ze = (e) => {
+      C && R.current && le(e.pointerId);
+    }, Be = (e) => {
+      Y.current && (e.preventDefault(), e.stopPropagation());
+    }, Fe = (e) => {
+      Ie && (e.key === "ArrowLeft" ? (e.preventDefault(), j()) : e.key === "ArrowRight" && (e.preventDefault(), H()));
+    }, Ee = {
+      ...we ?? {},
+      "--carousel-gap": `${ge}px`,
+      "--carousel-slide-size": he,
       "--carousel-snap-align": h,
-      "--carousel-button-gradient": we
+      "--carousel-button-gradient": Le
     };
-    return /* @__PURE__ */ ie("div", { className: k(f.root, le), style: Te, "aria-label": Z, children: [
-      ge && s > 1 && /* @__PURE__ */ ie(De, { children: [
-        Ne && /* @__PURE__ */ p("div", { className: `fullHeight ${f.navButtonCtn} ${f.navPrev}`, children: /* @__PURE__ */ p(
+    return /* @__PURE__ */ fe("div", { className: P(f.root, me), style: Ee, "aria-label": re, children: [
+      xe && c > 1 && /* @__PURE__ */ fe(qe, { children: [
+        Ne && /* @__PURE__ */ v("div", { className: `fullHeight ${f.navButtonCtn} ${f.navPrev}`, children: /* @__PURE__ */ v(
           "button",
           {
             type: "button",
-            className: k(f.navButton),
-            onClick: W,
+            className: P(f.navButton),
+            onClick: j,
             "aria-label": "Précédent",
-            children: xe ?? /* @__PURE__ */ p("div", { className: f.defaultBtn, "aria-hidden": !0, children: "‹" })
+            children: ye ?? /* @__PURE__ */ v("div", { className: f.defaultBtn, "aria-hidden": !0, children: "‹" })
           }
         ) }),
-        Re && /* @__PURE__ */ p("div", { className: `fullHeight ${f.navButtonCtn} ${f.navNext}`, children: /* @__PURE__ */ p(
+        Te && /* @__PURE__ */ v("div", { className: `fullHeight ${f.navButtonCtn} ${f.navNext}`, children: /* @__PURE__ */ v(
           "button",
           {
             type: "button",
-            className: k(f.navButton),
-            onClick: $,
+            className: P(f.navButton),
+            onClick: H,
             "aria-label": "Suivant",
-            children: Ie ?? /* @__PURE__ */ p("div", { className: f.defaultBtn, "aria-hidden": !0, children: "›" })
+            children: be ?? /* @__PURE__ */ v("div", { className: f.defaultBtn, "aria-hidden": !0, children: "›" })
           }
         ) })
       ] }),
-      /* @__PURE__ */ p(
+      /* @__PURE__ */ v(
         "div",
         {
-          ref: a,
-          className: k(
+          ref: i,
+          className: P(
             f.viewport,
-            N && f.dragEnabled,
-            ye && f.dragging,
-            fe
+            C && f.dragEnabled,
+            Me && f.dragging,
+            pe
           ),
           tabIndex: 0,
           role: "region",
           "aria-roledescription": "carousel",
-          "aria-label": Z,
-          onKeyDown: Ae,
-          onPointerDown: ke,
-          onPointerMove: Pe,
-          onPointerUp: Se,
-          onPointerCancel: Me,
-          onClickCapture: je,
-          children: _.map((e, t) => /* @__PURE__ */ p(
+          "aria-label": re,
+          onKeyDown: Fe,
+          onPointerDown: De,
+          onPointerMove: $e,
+          onPointerUp: We,
+          onPointerCancel: ze,
+          onClickCapture: Be,
+          children: x.map((e, t) => /* @__PURE__ */ v(
             "div",
             {
               ref: (r) => {
-                x.current[t] = r;
+                I.current[t] = r;
               },
-              className: k(f.slide, de),
+              className: P(f.slide, ve),
               "data-carousel-slide": !0,
               "data-carousel-clone": e.isClone ? "true" : "false",
-              "aria-label": `Item ${e.realIndex + 1} sur ${s}`,
-              "aria-current": e.realIndex === be,
+              "aria-label": `Item ${e.realIndex + 1} sur ${c}`,
+              "aria-current": e.realIndex === Se,
               children: e.node
             },
             e.key
@@ -328,5 +324,5 @@ import '../../styles/Carousel.css';const Fe = "_root_zgsjf_6", qe = "_viewport_z
   }
 );
 export {
-  Ze as Carousel
+  Ve as Carousel
 };

package/dist/components/carousel/FadeCarousel.d.ts

@@ -0,0 +1,29 @@
+import { default as React, CSSProperties, ReactNode } from 'react';
+
+export interface CarouselRef {
+    next: () => void;
+    prev: () => void;
+    goTo: (index: number, behavior?: ScrollBehavior) => void;
+    getIndex: () => number;
+    getLength: () => number;
+}
+export interface FadeCarouselProps {
+    children: ReactNode;
+    className?: string;
+    viewportClassName?: string;
+    slideClassName?: string;
+    style?: CSSProperties;
+    showArrows?: boolean;
+    iconLeft?: ReactNode;
+    iconRight?: ReactNode;
+    dragEnabled?: boolean;
+    keyboardNavigation?: boolean;
+    step?: number;
+    initialIndex?: number;
+    loop?: boolean;
+    ariaLabel?: string;
+    onIndexChange?: (index: number) => void;
+    /** Durée du fondu (ms) */
+    fadeDurationMs?: number;
+}
+export declare const FadeCarousel: React.ForwardRefExoticComponent<FadeCarouselProps & React.RefAttributes<CarouselRef>>;

package/dist/components/carousel/FadeCarousel.js

@@ -0,0 +1,195 @@
+import { jsxs as y, Fragment as U, jsx as l } from "react/jsx-runtime";
+import ve, { forwardRef as we, useMemo as xe, useRef as o, useState as N, useEffect as S, useCallback as f, useImperativeHandle as be } from "react";
+import { s as n } from "../../Carousel.module-RC3aC2Nl.mjs";
+const d = (...R) => R.filter(Boolean).join(" "), Ie = we(
+  ({
+    children: R,
+    className: W,
+    viewportClassName: z,
+    slideClassName: G,
+    style: J,
+    showArrows: Q = !0,
+    iconLeft: Y,
+    iconRight: Z,
+    dragEnabled: h = !0,
+    keyboardNavigation: ee = !0,
+    step: te = 1,
+    initialIndex: re = 0,
+    loop: I = !1,
+    ariaLabel: H = "FadeCarousel",
+    onIndexChange: k,
+    fadeDurationMs: B = 220
+  }, ne) => {
+    const L = xe(() => ve.Children.toArray(R), [R]), t = L.length, P = Math.max(1, Math.min(te, Math.max(1, t))), p = o(null), [j, ue] = N(0), s = o(0), [ae, O] = N(!1), [ce, X] = N(!1), T = o(k);
+    S(() => {
+      T.current = k;
+    }, [k]);
+    const g = f((e) => {
+      var r;
+      e !== s.current && (s.current = e, ue(e), (r = T.current) == null || r.call(T, e));
+    }, []), v = f(
+      (e) => t === 0 ? 0 : I ? (e % t + t) % t : Math.max(0, Math.min(t - 1, e)),
+      [t, I]
+    ), [i, w] = N(null), c = o(null);
+    S(() => () => {
+      c.current != null && (window.clearTimeout(c.current), c.current = null);
+    }, []);
+    const _ = f(
+      (e) => {
+        if (t <= 1) return;
+        c.current != null && (window.clearTimeout(c.current), c.current = null);
+        const r = s.current, a = v(e);
+        a !== r && (w({ from: r, to: a, phase: "prep" }), g(a), window.requestAnimationFrame(() => {
+          w((u) => !u || u.from !== r || u.to !== a ? u : { ...u, phase: "run" });
+        }), c.current = window.setTimeout(() => {
+          w(null), c.current = null;
+        }, B));
+      },
+      [v, B, t, g]
+    ), m = f(
+      (e, r = "smooth") => {
+        const a = v(e);
+        if (r === "auto") {
+          c.current != null && (window.clearTimeout(c.current), c.current = null), w(null), g(a);
+          return;
+        }
+        _(a);
+      },
+      [v, g, _]
+    ), x = f(() => {
+      t <= 1 || m(s.current + P, "smooth");
+    }, [m, t, P]), b = f(() => {
+      t <= 1 || m(s.current - P, "smooth");
+    }, [m, t, P]);
+    be(
+      ne,
+      () => ({
+        next: x,
+        prev: b,
+        goTo: m,
+        getIndex: () => s.current,
+        getLength: () => t
+      }),
+      [m, x, b, t]
+    );
+    const D = f(() => {
+      if (I) {
+        O(t > 1), X(t > 1);
+        return;
+      }
+      const e = s.current;
+      O(t > 1 && e > 0), X(t > 1 && e < t - 1);
+    }, [t, I]);
+    S(() => {
+      D();
+    }, [j, D]), S(() => {
+      if (t === 0) return;
+      const e = v(re);
+      g(e), w(null), D();
+    }, [t]);
+    const oe = (e) => e instanceof HTMLElement ? !!e.closest(
+      'button, a, input, textarea, select, option, [role="button"], [data-carousel-no-drag="true"]'
+    ) : !1, [se, V] = N(!1), C = o(!1), q = o(0), M = o(0), A = o(!1), $ = o(!1), ie = 40, le = (e) => {
+      var r, a, u, K;
+      h && (oe(e.target) || e.pointerType === "mouse" && e.button !== 0 || (C.current = !0, A.current = !1, q.current = e.clientX, M.current = 0, V(!0), (a = (r = p.current) == null ? void 0 : r.focus) == null || a.call(r), (K = (u = p.current) == null ? void 0 : u.setPointerCapture) == null || K.call(u, e.pointerId)));
+    }, fe = (e) => {
+      if (!h || !C.current) return;
+      const r = e.clientX - q.current;
+      M.current = r, Math.abs(r) > 4 && (A.current = !0);
+    }, E = (e) => {
+      var a, u;
+      if (C.current = !1, V(!1), p.current && e != null)
+        try {
+          (u = (a = p.current).releasePointerCapture) == null || u.call(a, e);
+        } catch {
+        }
+      A.current && ($.current = !0, window.setTimeout(() => {
+        $.current = !1;
+      }, 0));
+      const r = M.current;
+      Math.abs(r) >= ie && (r > 0 ? b() : x());
+    }, de = (e) => {
+      h && C.current && E(e.pointerId);
+    }, me = (e) => {
+      h && C.current && E(e.pointerId);
+    }, he = (e) => {
+      $.current && (e.preventDefault(), e.stopPropagation());
+    }, pe = (e) => {
+      ee && (e.key === "ArrowLeft" ? (e.preventDefault(), b()) : e.key === "ArrowRight" && (e.preventDefault(), x()));
+    }, ge = {
+      ...J ?? {},
+      "--carousel-fade-duration": `${B}ms`
+    }, F = (e, r, a) => {
+      const u = L[e];
+      return u == null ? null : /* @__PURE__ */ l(
+        "div",
+        {
+          className: d(n.fadeSlide, G, r),
+          "aria-label": `Item ${e + 1} sur ${t}`,
+          "aria-current": a ? "true" : void 0,
+          children: u
+        }
+      );
+    };
+    return /* @__PURE__ */ y("div", { className: d(n.root, W), style: ge, "aria-label": H, children: [
+      Q && t > 1 && /* @__PURE__ */ y(U, { children: [
+        ae && /* @__PURE__ */ l("div", { className: `fullHeight ${n.navButtonCtn} ${n.navPrev}`, children: /* @__PURE__ */ l(
+          "button",
+          {
+            type: "button",
+            className: d(n.navButton),
+            onClick: b,
+            "aria-label": "Précédent",
+            children: Y ?? /* @__PURE__ */ l("div", { className: n.defaultBtn, "aria-hidden": !0, children: "‹" })
+          }
+        ) }),
+        ce && /* @__PURE__ */ l("div", { className: `fullHeight ${n.navButtonCtn} ${n.navNext}`, children: /* @__PURE__ */ l(
+          "button",
+          {
+            type: "button",
+            className: d(n.navButton),
+            onClick: x,
+            "aria-label": "Suivant",
+            children: Z ?? /* @__PURE__ */ l("div", { className: n.defaultBtn, "aria-hidden": !0, children: "›" })
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ y(
+        "div",
+        {
+          ref: p,
+          className: d(
+            n.fadeViewport,
+            h && n.dragEnabled,
+            se && n.dragging,
+            z
+          ),
+          tabIndex: 0,
+          role: "region",
+          "aria-roledescription": "carousel",
+          "aria-label": H,
+          onKeyDown: pe,
+          onPointerDown: le,
+          onPointerMove: fe,
+          onPointerUp: de,
+          onPointerCancel: me,
+          onClickCapture: he,
+          children: [
+            !i && F(j, n.fadeActive, !0),
+            i && /* @__PURE__ */ y(U, { children: [
+              F(i.from, d(n.fadeOutgoing, i.phase === "run" && n.fadeRunning)),
+              F(
+                i.to,
+                d(n.fadeIncoming, i.phase === "run" && n.fadeRunning, i.phase === "run" && n.fadeInteractive),
+                !0
+              )
+            ] })
+          ]
+        }
+      )
+    ] });
+  }
+);
+export {
+  Ie as FadeCarousel
+};

package/dist/components/list/list-controls/ListControls.js

@@ -1,4 +1,4 @@
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
 import { Button as p } from "../../button/Button.js";
 import "react";
 import "../../icon-button/IconButton.js";
@@ -6,6 +6,7 @@ import { Checkbox as _ } from "../../checkbox/Checkbox.js";
 import { Icon as a } from "../../icon/Icon.js";
 import "../../modal/Modal.js";
 import "../../carousel/Carousel.js";
+import "../../carousel/FadeCarousel.js";
 import "../../theme/ThemeContext.js";
 import '../../../styles/Size.css';import '../../../styles/ListControls.css';/* empty css                      */
 const u = "_list_1nihg_6", f = "_children_1nihg_29", g = "_selected_1nihg_43", k = "_reset_1nihg_47", i = {
@@ -13,11 +14,11 @@ const u = "_list_1nihg_6", f = "_children_1nihg_29", g = "_selected_1nihg_43", k
   children: f,
   selected: g,
   reset: k
-}, I = ({ listChildren: o, handleItemClick: d, selectedItems: h, onReset: n, labelButtonReset: r }) => /* @__PURE__ */ l("div", { className: i.list, children: [
-  /* @__PURE__ */ e("div", { children: o.map((t, m) => {
+}, K = ({ listChildren: l, handleItemClick: d, selectedItems: m, onReset: r, labelButtonReset: n }) => /* @__PURE__ */ o("div", { className: i.list, children: [
+  /* @__PURE__ */ e("div", { children: l.map((t, h) => {
     if (t.key == null) return null;
-    const s = t.key, c = h.includes(s);
-    return /* @__PURE__ */ l(
+    const s = t.key, c = m.includes(s);
+    return /* @__PURE__ */ o(
       "div",
       {
         className: `${c ? i.selected : ""} ${i.children}`,
@@ -32,19 +33,19 @@ const u = "_list_1nihg_6", f = "_children_1nihg_29", g = "_selected_1nihg_43", k
           /* @__PURE__ */ e("span", { children: t })
         ]
       },
-      m
+      h
     );
   }) }),
-  n && r && /* @__PURE__ */ e("div", { className: i.reset, children: /* @__PURE__ */ e(
+  r && n && /* @__PURE__ */ e("div", { className: i.reset, children: /* @__PURE__ */ e(
     p,
     {
       mode: "ghost",
-      label: r,
-      onClick: n,
+      label: n,
+      onClick: r,
       childrenLeft: /* @__PURE__ */ e(a, { icon: "FunnelX" })
     }
   ) })
 ] });
 export {
-  I as ListControls
+  K as ListControls
 };

package/dist/components/list/nested-list/NestedList.js

@@ -1,20 +1,21 @@
 import { jsxs as l, jsx as t } from "react/jsx-runtime";
-import { NestedListItem as c } from "./item/NestedListItem.js";
-import { Button as p } from "../../button/Button.js";
+import { NestedListItem as p } from "./item/NestedListItem.js";
+import { Button as c } from "../../button/Button.js";
 import "react";
 import "../../icon-button/IconButton.js";
 import { Icon as a } from "../../icon/Icon.js";
 import "../../modal/Modal.js";
 import "../../carousel/Carousel.js";
+import "../../carousel/FadeCarousel.js";
 import "../../theme/ThemeContext.js";
 import '../../../styles/Size.css';import '../../../styles/NestedList.css';/* empty css                      */
 const h = "_nestedlist_7rnd3_6", _ = "_reset_7rnd3_18", s = {
   nestedlist: h,
   reset: _
-}, y = ({ items: i, align: o = "right", onReset: e, children: m, labelButtonReset: r }) => /* @__PURE__ */ l("div", { className: s.nestedlist, children: [
-  i.map((n, d) => /* @__PURE__ */ t(c, { ...n, align: o ?? "right", children: m }, d)),
-  e && r && /* @__PURE__ */ t("div", { className: s.reset, children: /* @__PURE__ */ t(p, { mode: "ghost", label: r, onClick: e, childrenLeft: /* @__PURE__ */ t(a, { icon: "FunnelX" }) }) })
+}, C = ({ items: i, align: o = "right", onReset: r, children: m, labelButtonReset: e }) => /* @__PURE__ */ l("div", { className: s.nestedlist, children: [
+  i.map((n, d) => /* @__PURE__ */ t(p, { ...n, align: o ?? "right", children: m }, d)),
+  r && e && /* @__PURE__ */ t("div", { className: s.reset, children: /* @__PURE__ */ t(c, { mode: "ghost", label: e, onClick: r, childrenLeft: /* @__PURE__ */ t(a, { icon: "FunnelX" }) }) })
 ] });
 export {
-  y as NestedList
+  C as NestedList
 };

package/dist/components/list/nested-list/item/NestedListItem.js

@@ -6,6 +6,7 @@ import { TagCounter as B } from "../../../tag-counter/TagCounter.js";
 import { Icon as l } from "../../../icon/Icon.js";
 import { Modal as L } from "../../../modal/Modal.js";
 import "../../../carousel/Carousel.js";
+import "../../../carousel/FadeCarousel.js";
 import "../../../theme/ThemeContext.js";
 import '../../../../styles/Size.css';import '../../../../styles/NestedListItem.css';/* empty css                         */
 const S = "_nestedlist_2r2ga_6", $ = "_items_2r2ga_21", j = "_textSmall_2r2ga_28", v = "_modal_2r2ga_34", s = {
@@ -13,7 +14,7 @@ const S = "_nestedlist_2r2ga_6", $ = "_items_2r2ga_21", j = "_textSmall_2r2ga_28
   items: $,
   textSmall: j,
   modal: v
-}, q = ({
+}, A = ({
   icon: a,
   title: h,
   numberSelect: i,
@@ -69,5 +70,5 @@ const S = "_nestedlist_2r2ga_6", $ = "_items_2r2ga_21", j = "_textSmall_2r2ga_28
   ] });
 };
 export {
-  q as NestedListItem
+  A as NestedListItem
 };

package/dist/components/menu/Menu.js

@@ -5,6 +5,7 @@ import { IconButton as f } from "../icon-button/IconButton.js";
 import { Icon as N } from "../icon/Icon.js";
 import { Modal as W } from "../modal/Modal.js";
 import "../carousel/Carousel.js";
+import "../carousel/FadeCarousel.js";
 import "../theme/ThemeContext.js";
 import '../../styles/Size.css';import '../../styles/Menu.css';/* empty css                   */
 const y = "_fullHeight_11eub_15", O = "_fullWidth_11eub_18", j = "_open_11eub_21", D = "_close_11eub_25", q = "_menuButton_11eub_29", A = "_closeIcon_11eub_37", F = "_textEllipsis_11eub_47", G = "_pointer_11eub_52", J = "_fullImg_11eub_55", K = "_menuParams_11eub_61", Q = "_line_11eub_67", T = "_borderRadiusM_11eub_74", U = "_menuItem_11eub_78", X = "_longLogo_11eub_87", Y = "_flexVerticalBetweenStart_11eub_92", Z = "_flexHorizontalCenter_11eub_106", ee = "_flexVerticalBetweenCenter_11eub_121", e = {
@@ -25,7 +26,7 @@ const y = "_fullHeight_11eub_15", O = "_fullWidth_11eub_18", j = "_open_11eub_21
   flexVerticalBetweenStart: Y,
   flexHorizontalCenter: Z,
   flexVerticalBetweenCenter: ee
-}, ue = ({ menuItems: s = [], menuParams: a = [], shortLogo: m, logo: h, isOpen: p, defaultOpen: I = !1, selectedId: u }) => {
+}, de = ({ menuItems: s = [], menuParams: a = [], shortLogo: m, logo: p, isOpen: h, defaultOpen: I = !1, selectedId: u }) => {
   const [t, g] = c(I ?? !1), [b, x] = c(u ?? (s.length > 0 ? s[0].id : null)), w = M(null), [H, _] = c(!1), [L, C] = c(!1), [k, E] = c(null), [z, R] = c({}), V = M(null);
   B(() => {
     u != null && x(u);
@@ -50,7 +51,7 @@ const y = "_fullHeight_11eub_15", O = "_fullWidth_11eub_18", j = "_open_11eub_21
     }
   };
   return B(() => {
-    p && p(t);
+    h && h(t);
   }, [t]), /* @__PURE__ */ n("nav", { ref: w, children: /* @__PURE__ */ d("div", { className: `${e.flexVerticalBetweenStart} ${e.fullHeight} ${t ? e.open : e.close}`, children: [
     /* @__PURE__ */ d("div", { className: e.fullWidth, children: [
       /* @__PURE__ */ n(
@@ -59,7 +60,7 @@ const y = "_fullHeight_11eub_15", O = "_fullWidth_11eub_18", j = "_open_11eub_21
           className: `${e.flexHorizontalCenter} ${e.pointer} ${e.textEllipsis}`,
           onClick: () => S(),
           children: t ? /* @__PURE__ */ d("div", { className: e.fullImg, children: [
-            h && /* @__PURE__ */ n("img", { className: e.longLogo, src: h, alt: "Logo situaction" }),
+            p && /* @__PURE__ */ n("img", { className: e.longLogo, src: p, alt: "Logo situaction" }),
             /* @__PURE__ */ n(f, { mode: "ghost", size: "menu", children: /* @__PURE__ */ n(N, { icon: "CaretDoubleLeft", size: 16, weight: "duotone" }) })
           ] }) : /* @__PURE__ */ n(
             "div",
@@ -116,5 +117,5 @@ const y = "_fullHeight_11eub_15", O = "_fullWidth_11eub_18", j = "_open_11eub_21
   ] }) });
 };
 export {
-  ue as Menu
+  de as Menu
 };

package/dist/components/panel/side-panel-header/SidePanelHeader.js

@@ -5,13 +5,14 @@ import { IconButton as i } from "../../icon-button/IconButton.js";
 import { Icon as t } from "../../icon/Icon.js";
 import "../../modal/Modal.js";
 import "../../carousel/Carousel.js";
+import "../../carousel/FadeCarousel.js";
 import "../../theme/ThemeContext.js";
 import '../../../styles/Size.css';import '../../../styles/SidePanelHeader.css';/* empty css                      */
 const c = "_sidePanelHeader_72g7b_6", m = "_buttonArrow_72g7b_13", h = "_title_72g7b_20", r = {
   sidePanelHeader: c,
   buttonArrow: m,
   title: h
-}, z = ({
+}, x = ({
   title: s,
   icon: o,
   onClickBack: L,
@@ -73,5 +74,5 @@ const c = "_sidePanelHeader_72g7b_6", m = "_buttonArrow_72g7b_13", h = "_title_7
   )
 ] });
 export {
-  z as SidePanelHeader
+  x as SidePanelHeader
 };

package/dist/components/select/Select.js

@@ -6,6 +6,7 @@ import { IconButton as H } from "../icon-button/IconButton.js";
 import { Icon as _ } from "../icon/Icon.js";
 import { Modal as J } from "../modal/Modal.js";
 import "../carousel/Carousel.js";
+import "../carousel/FadeCarousel.js";
 import "../theme/ThemeContext.js";
 import '../../styles/Size.css';import '../../styles/Select.css';/* empty css                   */
 const Q = "_selectContainer_133eb_54", X = "_children_133eb_61", Y = "_active_133eb_78", Z = "_selectList_133eb_82", O = "_modal_133eb_91", I = "_itemLabel_133eb_98", ee = "_searchWrapper_133eb_103", te = "_noResults_133eb_109", f = {
@@ -17,7 +18,7 @@ const Q = "_selectContainer_133eb_54", X = "_children_133eb_61", Y = "_active_13
   itemLabel: I,
   searchWrapper: ee,
   noResults: te
-}, fe = ({
+}, he = ({
   selected: k,
   size: g = "m",
   listItem: h,
@@ -212,5 +213,5 @@ const Q = "_selectContainer_133eb_54", X = "_children_133eb_61", Y = "_active_13
   ] });
 };
 export {
-  fe as Select
+  he as Select
 };

package/dist/components/select-filter-input-tags/SelectFilterInputTags.js

@@ -5,21 +5,22 @@ import { Input as a } from "../input/Input.js";
 import "../icon-button/IconButton.js";
 import "../modal/Modal.js";
 import "../carousel/Carousel.js";
+import "../carousel/FadeCarousel.js";
 import "../theme/ThemeContext.js";
 import '../../styles/Size.css';import '../../styles/SelectFilterInputTags.css';/* empty css                   */
 const c = "_listTagSelect_2v3fb_6", p = {
   listTagSelect: c
-}, x = ({ children: s, inputValue: o, handleInputChange: r, handleKeyDown: i }) => /* @__PURE__ */ e("div", { className: p.listTagSelect, children: /* @__PURE__ */ l("div", { children: [
-  s,
+}, T = ({ children: o, inputValue: r, handleInputChange: s, handleKeyDown: i }) => /* @__PURE__ */ e("div", { className: p.listTagSelect, children: /* @__PURE__ */ l("div", { children: [
+  o,
   /* @__PURE__ */ e("div", { className: "flexAutoSize", children: /* @__PURE__ */ e(
     a,
     {
       type: "text",
-      value: o,
+      value: r,
       onKeyDown: (t) => {
         t.key === "Enter" && i && i(t);
       },
-      onChange: (t) => r(t.target.value),
+      onChange: (t) => s(t.target.value),
       autoFocus: !0,
       placeholder: "",
       status: "ghost",
@@ -28,5 +29,5 @@ const c = "_listTagSelect_2v3fb_6", p = {
   ) })
 ] }) });
 export {
-  x as SelectFilterInputTags
+  T as SelectFilterInputTags
 };

package/dist/components/select-multi-items/SelectMultiItems.js

@@ -6,13 +6,14 @@ import "../icon-button/IconButton.js";
 import { TagCounter as w } from "../tag-counter/TagCounter.js";
 import { Modal as y } from "../modal/Modal.js";
 import "../carousel/Carousel.js";
+import "../carousel/FadeCarousel.js";
 import "../theme/ThemeContext.js";
 import '../../styles/Size.css';import '../../styles/SelectMultiItems.css';/* empty css                   */
 const N = "_relative_w7e9a_6", R = "_tagCounter_w7e9a_10", b = "_modal_w7e9a_18", r = {
   relative: N,
   tagCounter: R,
   modal: b
-}, q = ({
+}, A = ({
   label: i,
   iconButton: l,
   selectedCount: t = 0,
@@ -41,5 +42,5 @@ const N = "_relative_w7e9a_6", R = "_tagCounter_w7e9a_10", b = "_modal_w7e9a_18"
   ] });
 };
 export {
-  q as SelectMultiItems
+  A as SelectMultiItems
 };

package/dist/components/switch/Switch.js

@@ -5,6 +5,7 @@ import { IconButton as k } from "../icon-button/IconButton.js";
 import { Icon as g } from "../icon/Icon.js";
 import "../modal/Modal.js";
 import "../carousel/Carousel.js";
+import "../carousel/FadeCarousel.js";
 import "../theme/ThemeContext.js";
 import '../../styles/Size.css';import '../../styles/Switch.css';/* empty css                   */
 const y = "_slider_1mxgk_21", I = "_s_1mxgk_6", N = "_m_1mxgk_58", S = "_l_1mxgk_75", j = "_xl_1mxgk_92", B = "_disabled_1mxgk_110", E = "_wrapper_1mxgk_121", R = "_button_1mxgk_136", T = "_active_1mxgk_145", t = {
@@ -18,21 +19,21 @@ const y = "_slider_1mxgk_21", I = "_s_1mxgk_6", N = "_m_1mxgk_58", S = "_l_1mxgk
   wrapper: E,
   button: R,
   active: T
-}, L = ({
+}, M = ({
   size: i = "m",
   variant: w = "classic",
   checked: l,
-  onChange: s,
+  onChange: r,
   children: _,
-  disabled: r = !1,
+  disabled: s = !1,
   defaultChecked: h = !1,
   icons: a = { left: "Table", right: "Rows" }
 }) => {
   const o = l !== void 0, [p, m] = $(h), u = o ? l : p, d = (e) => {
-    o || m(e), s == null || s(e);
+    o || m(e), r == null || r(e);
   }, v = (e) => {
     const f = e.target.checked;
-    r || (o || m(f), s == null || s(f));
+    s || (o || m(f), r == null || r(f));
   };
   b(() => {
     o && m(l);
@@ -52,14 +53,14 @@ const y = "_slider_1mxgk_21", I = "_s_1mxgk_6", N = "_m_1mxgk_58", S = "_l_1mxgk
     }
   };
   return w === "icon" ? /* @__PURE__ */ n("div", { className: `${t.switch} ${t[i]}`, children: [
-    /* @__PURE__ */ n("div", { className: `${t.wrapper} ${r ? t.disabled : ""}`, children: [
+    /* @__PURE__ */ n("div", { className: `${t.wrapper} ${s ? t.disabled : ""}`, children: [
       /* @__PURE__ */ c(
         k,
         {
           mode: u ? "ghost" : "tertiary",
           size: i,
           onClick: () => d(!1),
-          disabled: r,
+          disabled: s,
           children: /* @__PURE__ */ c(g, { icon: a.left, size: x() })
         }
       ),
@@ -69,20 +70,20 @@ const y = "_slider_1mxgk_21", I = "_s_1mxgk_6", N = "_m_1mxgk_58", S = "_l_1mxgk
           mode: u ? "tertiary" : "ghost",
           size: i,
           onClick: () => d(!0),
-          disabled: r,
+          disabled: s,
           children: /* @__PURE__ */ c(g, { icon: a.right, size: x() })
         }
       )
     ] }),
     _
-  ] }) : /* @__PURE__ */ n("div", { className: `${t.switch} ${t[i]} ${r ? t.disabled : ""}`, children: [
+  ] }) : /* @__PURE__ */ n("div", { className: `${t.switch} ${t[i]} ${s ? t.disabled : ""}`, children: [
     /* @__PURE__ */ c(
       "input",
       {
         type: "checkbox",
         checked: p,
         onChange: (e) => v(e),
-        disabled: r
+        disabled: s
       }
     ),
     /* @__PURE__ */ c("span", { className: t.slider }),
@@ -90,5 +91,5 @@ const y = "_slider_1mxgk_21", I = "_s_1mxgk_6", N = "_m_1mxgk_58", S = "_l_1mxgk
   ] });
 };
 export {
-  L as Switch
+  M as Switch
 };

package/dist/main.d.ts

@@ -32,4 +32,5 @@ export { Toast } from './components/toast/Toast';
 export { DragAndDrop } from './components/drag-and-drop/DragAndDrop';
 export { Loading } from './components/loading/Loading';
 export { Carousel } from './components/carousel/Carousel';
+export { FadeCarousel } from './components/carousel/FadeCarousel';
 export { ThemeProvider, useTheme } from './components/theme/ThemeContext';

package/dist/main.js

@@ -1,17 +1,17 @@
 import { Button as t } from "./components/button/Button.js";
 import { ButtonControlledScroll as p } from "./components/buttonControledScroll/ButtonControlledScroll.js";
 import { Input as f } from "./components/input/Input.js";
-import { Tabs as n } from "./components/tabs/Tabs.js";
-import { IconButton as i } from "./components/icon-button/IconButton.js";
+import { Tabs as a } from "./components/tabs/Tabs.js";
+import { IconButton as d } from "./components/icon-button/IconButton.js";
 import { Tag as c } from "./components/tag/Tag.js";
 import { Title as u } from "./components/title/Title.js";
-import { TagCounter as I } from "./components/tag-counter/TagCounter.js";
-import { Checkbox as C } from "./components/checkbox/Checkbox.js";
+import { TagCounter as C } from "./components/tag-counter/TagCounter.js";
+import { Checkbox as S } from "./components/checkbox/Checkbox.js";
 import { Tooltip as g } from "./components/tooltip/Tooltip.js";
 import { Select as h } from "./components/select/Select.js";
 import { Calendar as B } from "./components/calendar/Calendar.js";
-import { Accordion as P } from "./components/accordion/Accordion.js";
-import { AccordionItem as E } from "./components/accordion/item/AccordionItem.js";
+import { Accordion as M } from "./components/accordion/Accordion.js";
+import { AccordionItem as D } from "./components/accordion/item/AccordionItem.js";
 import { Card as N } from "./components/card/Card.js";
 import { Icon as v } from "./components/icon/Icon.js";
 import { Menu as H } from "./components/menu/Menu.js";
@@ -28,25 +28,27 @@ import { InputLabel as ro } from "./components/input-label/InputLabel.js";
 import { EditableField as to } from "./components/editable-field/EditableField.js";
 import { EditableSelect as po } from "./components/editable-select/EditableSelect.js";
 import { Toast as fo } from "./components/toast/Toast.js";
-import { DragAndDrop as no } from "./components/drag-and-drop/DragAndDrop.js";
+import { DragAndDrop as ao } from "./components/drag-and-drop/DragAndDrop.js";
 import { Loading as io } from "./components/loading/Loading.js";
 import { Carousel as so } from "./components/carousel/Carousel.js";
-import { ThemeProvider as To, useTheme as Io } from "./components/theme/ThemeContext.js";
+import { FadeCarousel as To } from "./components/carousel/FadeCarousel.js";
+import { ThemeProvider as Io, useTheme as So } from "./components/theme/ThemeContext.js";
 import './styles/Size.css';/* empty css               */
 export {
-  P as Accordion,
-  E as AccordionItem,
+  M as Accordion,
+  D as AccordionItem,
   t as Button,
   p as ButtonControlledScroll,
   B as Calendar,
   N as Card,
   so as Carousel,
-  C as Checkbox,
-  no as DragAndDrop,
+  S as Checkbox,
+  ao as DragAndDrop,
   to as EditableField,
   po as EditableSelect,
+  To as FadeCarousel,
   v as Icon,
-  i as IconButton,
+  d as IconButton,
   f as Input,
   ro as InputLabel,
   O as ListControls,
@@ -61,12 +63,12 @@ export {
   Z as SidePanel,
   $ as SidePanelHeader,
   X as Switch,
-  n as Tabs,
+  a as Tabs,
   c as Tag,
-  I as TagCounter,
-  To as ThemeProvider,
+  C as TagCounter,
+  Io as ThemeProvider,
   u as Title,
   fo as Toast,
   g as Tooltip,
-  Io as useTheme
+  So as useTheme
 };

package/dist/styles/Carousel.css

@@ -1 +1 @@
-._root_zgsjf_6{position:relative;width:100%}._viewport_zgsjf_11{display:flex;gap:var(--carousel-gap, 12px);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;padding:4px;scrollbar-width:none}._viewport_zgsjf_11::-webkit-scrollbar{display:none}._dragEnabled_zgsjf_27{cursor:grab;touch-action:pan-y}._dragging_zgsjf_32{cursor:grabbing;scroll-behavior:auto;scroll-snap-type:none;-webkit-user-select:none;user-select:none}._slide_zgsjf_39{flex:0 0 var(--carousel-slide-size, 280px);width:var(--carousel-slide-size, 280px);scroll-snap-align:var(--carousel-snap-align, start);min-width:0}._navButtonCtn_zgsjf_46{z-index:2;display:flex;justify-content:center;align-items:center;position:absolute;height:100%;width:54px}._navButton_zgsjf_46{z-index:2;background:none;border:none;cursor:pointer;-webkit-user-select:none;user-select:none}._defaultBtn_zgsjf_64{z-index:2;width:36px;height:36px;color:var(--button-tertiary-default-border);font-size:18px;border:1px solid var(--button-tertiary-default-border);border-radius:999px;display:flex;align-items:center;justify-content:center;background:var(--carousel-button-background, var(--background-primary));box-shadow:0 2px 8px #00000026;cursor:pointer;-webkit-user-select:none;user-select:none}._navPrev_zgsjf_81{background:linear-gradient(90deg,var(--carousel-button-gradient) 0%,rgba(255,255,255,0) 100%);left:0}._navNext_zgsjf_86{background:linear-gradient(90deg,rgba(255,255,255,0) 0%,var(--carousel-button-gradient) 100%);right:0}
+._root_vqc19_6{position:relative;width:100%}._viewport_vqc19_11{display:flex;gap:var(--carousel-gap, 12px);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;padding:4px;scrollbar-width:none}._viewerViewport_vqc19_23{overflow-x:hidden}._viewport_vqc19_11::-webkit-scrollbar{display:none}._dragEnabled_vqc19_31{cursor:grab;touch-action:pan-y}._dragging_vqc19_36{cursor:grabbing;scroll-behavior:auto;scroll-snap-type:none;-webkit-user-select:none;user-select:none}._slide_vqc19_43{flex:0 0 var(--carousel-slide-size, 280px);width:var(--carousel-slide-size, 280px);scroll-snap-align:var(--carousel-snap-align, start);min-width:0}._navButtonCtn_vqc19_50{z-index:2;display:flex;justify-content:center;align-items:center;position:absolute;height:100%;width:54px}._navButton_vqc19_50{z-index:2;background:none;border:none;cursor:pointer;-webkit-user-select:none;user-select:none}._defaultBtn_vqc19_68{z-index:2;width:36px;height:36px;color:var(--button-tertiary-default-border);font-size:18px;border:1px solid var(--button-tertiary-default-border);border-radius:999px;display:flex;align-items:center;justify-content:center;background:var(--carousel-button-background, var(--background-primary));box-shadow:0 2px 8px #00000026;cursor:pointer;-webkit-user-select:none;user-select:none}._navPrev_vqc19_85{background:linear-gradient(90deg,var(--carousel-button-gradient) 0%,rgba(255,255,255,0) 100%);left:0}._navNext_vqc19_90{background:linear-gradient(90deg,rgba(255,255,255,0) 0%,var(--carousel-button-gradient) 100%);right:0}._fadeViewport_vqc19_95{display:grid;overflow:hidden;outline:none;touch-action:pan-y}._fadeSlide_vqc19_102{grid-row:1;grid-column:1;opacity:0;transition:opacity var(--carousel-fade-duration) ease;pointer-events:none}._fadeActive_vqc19_110{opacity:1;pointer-events:auto}._fadeOutgoing_vqc19_115{opacity:1}._fadeIncoming_vqc19_119,._fadeRunning_vqc19_123._fadeOutgoing_vqc19_115{opacity:0}._fadeRunning_vqc19_123._fadeIncoming_vqc19_119{opacity:1}._fadeInteractive_vqc19_131{pointer-events:auto}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@situaction/traq-ui-ste",
-  "version": "1.2.19",
+  "version": "1.2.23",
   "description": "library react component Situaction",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",