@epam/statgpt-ui-components 0.5.0 → 0.6.0-rc.1

package/index.mjs

@@ -1,4 +1,4 @@
-import { jsx as r, jsxs as m, Fragment as q } from "react/jsx-runtime";
+import { jsx as r, jsxs as u, Fragment as q } from "react/jsx-runtime";
 import * as ue from "react";
 import { useEffect as O, useState as j, useRef as W, useCallback as P, useMemo as U, useId as me, createContext as Q, useContext as K } from "react";
 import g from "classnames";
@@ -35,33 +35,33 @@ const ze = 3e4, bt = ({
   errorIcon: s,
   onClose: l,
   closeButtonTitle: a,
-  children: c
+  children: i
 }) => {
-  const i = e?.type, h = i === _.IN_PROGRESS || i === _.INFO, d = () => h ? "alert-in-progress" : i === _.SUCCESS ? "alert-success" : "alert-error", p = h ? t : i === _.SUCCESS ? n : i === _.ERROR ? s : null, f = e?.text;
+  const m = e?.type, h = m === _.IN_PROGRESS || m === _.INFO, c = () => h ? "alert-in-progress" : m === _.SUCCESS ? "alert-success" : "alert-error", f = h ? t : m === _.SUCCESS ? n : m === _.ERROR ? s : null, p = e?.text;
   return O(() => {
     if (!e || h)
       return;
-    const v = setTimeout(() => {
+    const N = setTimeout(() => {
       l?.();
     }, ze);
-    return () => clearTimeout(v);
+    return () => clearTimeout(N);
   }, [e, h, l]), /* @__PURE__ */ r(
     "div",
     {
       className: g(
         "alert alert-shadow fixed bottom-3 right-3 z-10 w-[min(380px,calc(100vw-24px))] max-w-[calc(100vw-24px)]",
-        d()
+        c()
       ),
-      children: /* @__PURE__ */ m("div", { className: "alert-content flex items-start", children: [
-        p && /* @__PURE__ */ r("div", { className: "alert-icon", children: p }),
-        /* @__PURE__ */ m("div", { className: "flex min-w-0 flex-1 flex-col gap-2", children: [
+      children: /* @__PURE__ */ u("div", { className: "alert-content flex items-start", children: [
+        f && /* @__PURE__ */ r("div", { className: "alert-icon", children: f }),
+        /* @__PURE__ */ u("div", { className: "flex min-w-0 flex-1 flex-col gap-2", children: [
           /* @__PURE__ */ r("h3", { className: "alert-title truncate", children: e?.title }),
-          c ?? (f && /* @__PURE__ */ r(
+          i ?? (p && /* @__PURE__ */ r(
             "div",
             {
               className: "alert-text whitespace-pre-line break-words",
-              title: f,
-              children: f
+              title: p,
+              children: p
             }
           ))
         ] }),
@@ -96,17 +96,17 @@ const Ge = ({
   title: s,
   disabled: l,
   iconAfter: a,
-  iconBefore: c,
-  onClick: i,
+  iconBefore: i,
+  onClick: m,
   isSmallButton: h
 }) => {
-  const d = F([
+  const c = F([
     h ? "font-semibold" : "",
     a ? "mr-2" : "",
-    c ? "ml-2" : "",
+    i ? "ml-2" : "",
     t
   ]);
-  return /* @__PURE__ */ m(
+  return /* @__PURE__ */ u(
     "button",
     {
       type: "button",
@@ -117,12 +117,12 @@ const Ge = ({
       ),
       disabled: l || n,
       "aria-label": "button",
-      onClick: (p) => i?.(p),
+      onClick: (f) => m?.(f),
       title: s,
       children: [
-        c,
+        i,
         n && /* @__PURE__ */ r(He, {}),
-        s ? h ? /* @__PURE__ */ r("h4", { className: d, children: s }) : /* @__PURE__ */ r("h3", { className: d, children: s }) : null,
+        s ? h ? /* @__PURE__ */ r("h4", { className: c, children: s }) : /* @__PURE__ */ r("h3", { className: c, children: s }) : null,
         a
       ]
     }
@@ -157,61 +157,61 @@ const wt = 24, vt = 24, V = 1e3, We = 24, Ct = ({
   options: s,
   calendarResolution: l = A.DAY,
   id: a,
-  icon: c,
-  isEndDate: i
+  icon: i,
+  isEndDate: m
 }) => {
-  const h = W(null), d = Be();
+  const h = W(null), c = Be();
   O(() => {
-    const N = h?.current;
-    N && N.querySelector("input")?.setAttribute("aria-label", e);
+    const w = h?.current;
+    w && w.querySelector("input")?.setAttribute("aria-label", e);
   }, [e]);
-  const p = {
+  const f = {
     ...s,
     disableMobile: !0,
     defaultDate: l === A.MONTH ? new Date(n.getFullYear(), n.getMonth()) : n
-  }, f = (N, C, b) => {
-    const u = `calendar__${l === A.MONTH ? "month" : "day"}`;
-    b.calendarContainer && b.calendarContainer.classList.add(u);
-  }, v = (N, C, b) => {
-    if (l === A.MONTH && N.length > 0) {
-      const u = s.minDate, o = s.maxDate, x = N[0].getFullYear(), w = b.calendarContainer, S = "flatpickr-disabled", y = w.querySelectorAll(
+  }, p = (w, C, b) => {
+    const d = `calendar__${l === A.MONTH ? "month" : "day"}`;
+    b.calendarContainer && b.calendarContainer.classList.add(d);
+  }, N = (w, C, b) => {
+    if (l === A.MONTH && w.length > 0) {
+      const d = s.minDate, o = s.maxDate, x = w[0].getFullYear(), v = b.calendarContainer, S = "flatpickr-disabled", y = v.querySelectorAll(
         ".flatpickr-monthSelect-month"
-      ), E = w.querySelectorAll(
+      ), E = v.querySelectorAll(
         ".flatpickr-next-month"
-      )[0], D = w.querySelectorAll(
+      )[0], D = v.querySelectorAll(
         ".flatpickr-prev-month"
       )[0];
-      x === o.getFullYear() && E.classList.add(S), x === u.getFullYear() && D.classList.add(S), (x === u.getFullYear() || x === o.getFullYear()) && y.forEach((k) => {
+      x === o.getFullYear() && E.classList.add(S), x === d.getFullYear() && D.classList.add(S), (x === d.getFullYear() || x === o.getFullYear()) && y.forEach((k) => {
         k.classList.remove(S);
-        const I = new Date(k.getAttribute("aria-label")), R = I.getFullYear() === u.getFullYear() && I.getMonth() === u.getMonth(), z = I.getFullYear() === o.getFullYear() && I.getMonth() === o.getMonth();
-        R || z || (I < u || I > o) && k.classList.add(S);
+        const I = new Date(k.getAttribute("aria-label")), R = I.getFullYear() === d.getFullYear() && I.getMonth() === d.getMonth(), z = I.getFullYear() === o.getFullYear() && I.getMonth() === o.getMonth();
+        R || z || (I < d || I > o) && k.classList.add(S);
       });
     }
     setTimeout(() => {
-      const u = b.calendarContainer, o = b._input?.getBoundingClientRect();
-      u && (u.style.top = `${o.top - u.offsetHeight - 8}px`, u.style.width = `${u.style.width}px`, i ? (u.style.right = `${window.innerWidth - o.right - (d ? We : 0)}px`, u.style.left = "auto") : u.style.left = `${o.left}px`);
+      const d = b.calendarContainer, o = b._input?.getBoundingClientRect();
+      d && (d.style.top = `${o.top - d.offsetHeight - 8}px`, d.style.width = `${d.style.width}px`, m ? (d.style.right = `${window.innerWidth - o.right - (c ? We : 0)}px`, d.style.left = "auto") : d.style.left = `${o.left}px`);
     }, 0);
   };
-  return /* @__PURE__ */ m("div", { className: "calendar relative", ref: h, children: [
+  return /* @__PURE__ */ u("div", { className: "calendar relative", ref: h, children: [
     /* @__PURE__ */ r("div", { className: "calendar-title mb-1", children: e }),
     /* @__PURE__ */ r(
       "label",
       {
         htmlFor: a,
         className: "absolute right-[11px] top-[29px] cursor-pointer",
-        children: c || /* @__PURE__ */ r(fe, {})
+        children: i || /* @__PURE__ */ r(fe, {})
       }
     ),
     /* @__PURE__ */ r(
       Ne,
       {
         defaultValue: (l === A.MONTH ? new Date(n.getFullYear(), n.getMonth()) : n)?.toDateString(),
-        options: p,
-        onChange: (N) => {
-          t(N[0]);
+        options: f,
+        onChange: (w) => {
+          t(w[0]);
         },
-        onOpen: [v],
-        onReady: [f],
+        onOpen: [N],
+        onReady: [p],
         id: a
       }
     )
@@ -223,39 +223,42 @@ const wt = 24, vt = 24, V = 1e3, We = 24, Ct = ({
   checkboxIcon: s,
   onChange: l,
   disabled: a = !1,
-  className: c,
-  stopPropagation: i = !0
+  disabledScope: i = "full",
+  className: m,
+  stopPropagation: h = !0
 }) => {
-  const h = P(
-    (f) => {
-      i && f.stopPropagation();
+  const c = P(
+    (N) => {
+      h && N.stopPropagation();
     },
-    [i]
-  ), d = P(
-    (f) => {
-      i && f.stopPropagation(), l?.(t, f.target.checked);
+    [h]
+  ), f = P(
+    (N) => {
+      h && N.stopPropagation(), l?.(t, N.target.checked);
     },
-    [l, t, i]
+    [l, t, h]
   ), p = () => {
     if (n)
       return s || /* @__PURE__ */ r(pe, { className: "absolute size-4" });
   };
-  return /* @__PURE__ */ m(
+  return /* @__PURE__ */ u(
     "label",
     {
       htmlFor: t,
-      onClick: h,
+      onClick: c,
       className: F(
         "flex min-w-0 items-center py-1 shrink-0",
-        a ? "cursor-not-allowed opacity-50" : "cursor-pointer",
-        c
+        a ? "cursor-not-allowed" : "cursor-pointer",
+        a && i === "full" && "opacity-50",
+        m
       ),
       children: [
         /* @__PURE__ */ r(
           "span",
           {
             className: g(
-              "checkbox-button relative flex size-[14px] items-center justify-center"
+              "checkbox-button relative flex size-[14px] items-center justify-center",
+              a && i === "icon" && "opacity-50"
             ),
             "aria-hidden": !0,
             children: p()
@@ -278,7 +281,7 @@ const wt = 24, vt = 24, V = 1e3, We = 24, Ct = ({
             type: "checkbox",
             checked: n,
             disabled: a,
-            onChange: d,
+            onChange: f,
             className: "hidden"
           }
         )
@@ -292,19 +295,19 @@ const wt = 24, vt = 24, V = 1e3, We = 24, Ct = ({
   value: s
 }) => {
   const [l, a] = j(!1);
-  return /* @__PURE__ */ m(
+  return /* @__PURE__ */ u(
     "div",
     {
       className: `collapsible-block flex flex-col border-t-2 border-neutrals-600 ${l ? "collapsible-block-open" : ""}`,
       children: [
-        /* @__PURE__ */ m(
+        /* @__PURE__ */ u(
           "div",
           {
             className: "collapsible-block-title flex cursor-pointer items-center py-4",
             onClick: () => a(!l),
             children: [
               /* @__PURE__ */ r("div", { className: `${l ? "rotate-180" : ""} transition-transform`, children: t || /* @__PURE__ */ r(ge, { className: "mr-3 size-5" }) }),
-              /* @__PURE__ */ m("div", { className: "flex flex-1 items-center justify-between", children: [
+              /* @__PURE__ */ u("div", { className: "flex flex-1 items-center justify-between", children: [
                 /* @__PURE__ */ r("span", { children: e }),
                 s && /* @__PURE__ */ r("p", { className: "body-1 text-neutrals-800", children: s })
               ] })
@@ -321,23 +324,23 @@ const wt = 24, vt = 24, V = 1e3, We = 24, Ct = ({
     if (!t)
       return [{ id: 0, text: e, highlight: !1 }];
     const l = t?.toLowerCase() || "", a = e?.toLowerCase()?.split(l) || "";
-    for (let c = 0, i = 0; c < a?.length; c++) {
-      const h = a?.[c], d = h.length;
+    for (let i = 0, m = 0; i < a?.length; i++) {
+      const h = a?.[i], c = h.length;
       h !== "" && s.push({
         id: s.length,
         highlight: !1,
         text: e?.substring(
-          i,
-          i + d
+          m,
+          m + c
         )
-      }), i += d, c !== a?.length - 1 && (s.push({
+      }), m += c, i !== a?.length - 1 && (s.push({
         id: s.length,
         highlight: !0,
         text: e?.substring(
-          i,
-          i + t.length
+          m,
+          m + t.length
         )
-      }), i += t.length);
+      }), m += t.length);
     }
     return s;
   }, [t, e]);
@@ -364,7 +367,7 @@ const wt = 24, vt = 24, V = 1e3, We = 24, Ct = ({
       a && "base-icon-button",
       n
     ),
-    onClick: (c) => t?.(c),
+    onClick: (i) => t?.(i),
     disabled: s,
     title: l,
     "aria-label": "button",
@@ -377,16 +380,16 @@ const wt = 24, vt = 24, V = 1e3, We = 24, Ct = ({
   cssClass: s = "",
   type: l = "text",
   disabled: a,
-  readonly: c,
-  onChange: i,
+  readonly: i,
+  onChange: m,
   onKeyDown: h,
-  onFocus: d,
-  onBlur: p
+  onFocus: c,
+  onBlur: f
 }) => {
-  const f = g(
+  const p = g(
     "truncate outline-none shadow-none body-1",
     s,
-    c ? "pointer-events-none" : ""
+    i ? "pointer-events-none" : ""
   );
   return /* @__PURE__ */ r(
     "input",
@@ -398,11 +401,11 @@ const wt = 24, vt = 24, V = 1e3, We = 24, Ct = ({
       value: e || "",
       title: e ? String(e) : "",
       disabled: a,
-      className: f,
+      className: p,
       onKeyDown: h,
-      onFocus: d,
-      onBlur: p,
-      onChange: (v) => i?.(v.currentTarget.value)
+      onFocus: c,
+      onBlur: f,
+      onChange: (N) => m?.(N.currentTarget.value)
     }
   );
 }, St = ({
@@ -411,7 +414,7 @@ const wt = 24, vt = 24, V = 1e3, We = 24, Ct = ({
   containerClasses: n,
   cssClass: s,
   ...l
-}) => /* @__PURE__ */ m("div", { className: g("input w-full flex flex-row", n), children: [
+}) => /* @__PURE__ */ u("div", { className: g("input w-full flex flex-row", n), children: [
   e,
   /* @__PURE__ */ r(
     Ue,
@@ -435,7 +438,7 @@ const wt = 24, vt = 24, V = 1e3, We = 24, Ct = ({
     l ? "mr-2" : "",
     s ? "ml-2" : ""
   );
-  return /* @__PURE__ */ m(
+  return /* @__PURE__ */ u(
     "a",
     {
       href: e,
@@ -471,19 +474,19 @@ const wt = 24, vt = 24, V = 1e3, We = 24, Ct = ({
   description: l,
   onChange: a
 }) => {
-  const c = P(
-    (i) => {
-      i.stopPropagation(), a?.(t, i.target.checked);
+  const i = P(
+    (m) => {
+      m.stopPropagation(), a?.(t, m.target.checked);
     },
     [a, t]
   );
-  return /* @__PURE__ */ m(
+  return /* @__PURE__ */ u(
     "label",
     {
       className: "flex min-w-0 cursor-pointer flex-col py-[6px]",
       htmlFor: t,
       children: [
-        /* @__PURE__ */ m("p", { className: "radio-label flex min-w-0 items-center", children: [
+        /* @__PURE__ */ u("p", { className: "radio-label flex min-w-0 items-center", children: [
           /* @__PURE__ */ r(
             "span",
             {
@@ -516,7 +519,7 @@ const wt = 24, vt = 24, V = 1e3, We = 24, Ct = ({
           "input",
           {
             type: "radio",
-            onChange: c,
+            onChange: i,
             id: t,
             checked: n,
             className: "hidden"
@@ -534,17 +537,17 @@ const Ve = ({
   size: s,
   onClose: l,
   children: a,
-  overlayClassName: c,
-  containerClassName: i,
+  overlayClassName: i,
+  containerClassName: m,
   dividers: h = !0,
-  closeButtonTitle: d
+  closeButtonTitle: c
 }) => {
-  const { refs: p, context: f } = J({
+  const { refs: f, context: p } = J({
     open: t !== T.Closed && !!t,
     onOpenChange: l
-  }), v = we(f, { role: "dialog" }), N = ee(f, { outsidePress: !0 }), { getFloatingProps: C } = te([v, N]), b = P(
-    (u) => {
-      u?.preventDefault(), u?.stopPropagation(), l();
+  }), N = we(p, { role: "dialog" }), w = ee(p, { outsidePress: !0 }), { getFloatingProps: C } = te([N, w]), b = P(
+    (d) => {
+      d?.preventDefault(), d?.stopPropagation(), l();
     },
     [l]
   );
@@ -553,9 +556,9 @@ const Ve = ({
     {
       className: g(
         "z-modal flex items-center justify-center bg-blackout p-4",
-        c
+        i
       ),
-      children: /* @__PURE__ */ r(Ce, { context: f, children: /* @__PURE__ */ m(
+      children: /* @__PURE__ */ r(Ce, { context: p, children: /* @__PURE__ */ u(
         "div",
         {
           className: g(
@@ -563,28 +566,28 @@ const Ve = ({
             s === G.LG && "max-w-[65%]",
             s === G.SM && "max-w-[30%]",
             h && "divide-neutrals-400 divide-y",
-            i,
+            m,
             "sm:w-full sm:max-w-full sm:px-4 sm:py-6"
           ),
-          ref: p.setFloating,
+          ref: f.setFloating,
           ...C({
-            onClick(u) {
-              u.stopPropagation();
+            onClick(d) {
+              d.stopPropagation();
             }
           }),
           children: [
-            /* @__PURE__ */ m("div", { className: "modal-heading flex flex-row items-center justify-between px-6 py-5 sm:p-0 sm:pb-2", children: [
+            /* @__PURE__ */ u("div", { className: "modal-heading flex flex-row items-center justify-between px-6 py-5 sm:p-0 sm:pb-2", children: [
               n && (typeof n == "string" ? /* @__PURE__ */ r("h2", { className: "modal-heading-title sm:h3 mr-3 min-w-0 flex-1", children: n }) : n),
               /* @__PURE__ */ r(
                 re,
                 {
-                  title: d,
+                  title: c,
                   onClick: b,
                   btnClassNames: "sm:h-[24px] sm:w-[24px] sm:top-4"
                 }
               )
             ] }),
-            a.map((u) => u)
+            a.map((d) => d)
           ]
         }
       ) })
@@ -610,12 +613,12 @@ const Ve = ({
   selectedOption: s,
   disabled: l,
   containerClassName: a,
-  openedClassName: c,
-  onOptionSelect: i
+  openedClassName: i,
+  onOptionSelect: m
 }) => {
-  const h = me(), [d, p] = j(!1), { refs: f, floatingStyles: v, context: N } = J({
-    open: d,
-    onOpenChange: l ? void 0 : p,
+  const h = me(), [c, f] = j(!1), { refs: p, floatingStyles: N, context: w } = J({
+    open: c,
+    onOpenChange: l ? void 0 : f,
     placement: "bottom-end",
     strategy: "fixed",
     middleware: [
@@ -623,8 +626,8 @@ const Ve = ({
       Ie({ padding: L }),
       Se({
         padding: L,
-        apply({ availableHeight: x, elements: w }) {
-          w.floating.style.maxHeight = `${Math.max(
+        apply({ availableHeight: x, elements: v }) {
+          v.floating.style.maxHeight = `${Math.max(
             0,
             x
           )}px`;
@@ -634,42 +637,42 @@ const Ve = ({
       qe
     ],
     whileElementsMounted: ye
-  }), C = De(N), b = ee(N, { outsidePress: !0 }), { getReferenceProps: u, getFloatingProps: o } = te([
+  }), C = De(w), b = ee(w, { outsidePress: !0 }), { getReferenceProps: d, getFloatingProps: o } = te([
     C,
     b
   ]);
   return O(() => {
-    d && window.dispatchEvent(
+    c && window.dispatchEvent(
       new CustomEvent(H, { detail: h })
     );
-  }, [h, d]), O(() => {
-    const x = (w) => {
-      w instanceof CustomEvent && w.detail !== h && p(!1);
+  }, [h, c]), O(() => {
+    const x = (v) => {
+      v instanceof CustomEvent && v.detail !== h && f(!1);
     };
     return window.addEventListener(H, x), () => {
       window.removeEventListener(H, x);
     };
   }, [h]), O(() => {
-    l && p(!1);
-  }, [l]), /* @__PURE__ */ m(q, { children: [
+    l && f(!1);
+  }, [l]), /* @__PURE__ */ u(q, { children: [
     /* @__PURE__ */ r(
       "div",
       {
-        ref: f.setReference,
-        ...u({
+        ref: p.setReference,
+        ...d({
           onClick(x) {
             x.stopPropagation();
           }
         }),
-        className: g(a, d && c),
+        className: g(a, c && i),
         children: e
       }
     ),
-    d && /* @__PURE__ */ r(ne, { children: /* @__PURE__ */ m(
+    c && /* @__PURE__ */ r(ne, { children: /* @__PURE__ */ u(
       "div",
       {
-        ref: f.setFloating,
-        style: { ...v, overflowY: "auto" },
+        ref: p.setFloating,
+        style: { ...N, overflowY: "auto" },
         className: "dropdown-menu-shadow dropdown-container z-dropdown flex flex-col rounded bg-white",
         ...o(),
         children: [
@@ -677,14 +680,14 @@ const Ve = ({
           t && t.map((x) => /* @__PURE__ */ r(
             "div",
             {
-              onClick: (w) => {
-                w.stopPropagation(), i?.(x.key), p(!1);
+              onClick: (v) => {
+                v.stopPropagation(), m?.(x.key), f(!1);
               },
               className: g(
                 "text-neutrals-900 body-3 cursor-pointer dropdown-item min-w-[200px]",
                 s === x.key && "bg-hues-100"
               ),
-              children: /* @__PURE__ */ m(
+              children: /* @__PURE__ */ u(
                 "div",
                 {
                   className: "dropdown-item-text flex h-full items-center gap-x-2 p-2 hover:bg-hues-100",
@@ -702,15 +705,15 @@ const Ve = ({
       }
     ) })
   ] });
-}, Rt = ({ limitMessages: e, query: t }) => /* @__PURE__ */ m("div", { className: "flex flex-wrap items-center justify-between bg-hues-100 px-2 py-1", children: [
-  /* @__PURE__ */ r("div", { className: "flex gap-x-[4px]", children: /* @__PURE__ */ r("div", { className: "flex flex-col", children: /* @__PURE__ */ m("div", { className: "flex gap-x-[4px]", children: [
-    /* @__PURE__ */ m("span", { className: "h5 text-primary", children: [
+}, Rt = ({ limitMessages: e, query: t }) => /* @__PURE__ */ u("div", { className: "flex flex-wrap items-center justify-between bg-hues-100 px-2 py-1", children: [
+  /* @__PURE__ */ r("div", { className: "flex gap-x-[4px]", children: /* @__PURE__ */ r("div", { className: "flex flex-col", children: /* @__PURE__ */ u("div", { className: "flex gap-x-[4px]", children: [
+    /* @__PURE__ */ u("span", { className: "h5 text-primary", children: [
       e?.excelFormatTitle,
       " "
     ] }),
     /* @__PURE__ */ r("span", { className: "body-3 text-neutrals-800", children: e?.excelFormatText })
   ] }) }) }),
-  /* @__PURE__ */ r("a", { href: t, target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ m("span", { className: "body-3 flex cursor-pointer items-center gap-x-[4px]", children: [
+  /* @__PURE__ */ r("a", { href: t, target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ u("span", { className: "body-3 flex cursor-pointer items-center gap-x-[4px]", children: [
     e?.dataExplorerIcon,
     e?.dataExplorer
   ] }) })
@@ -720,7 +723,7 @@ const Ve = ({
   showAdvancedViewButton: n,
   onAdvancedViewClick: s,
   query: l
-}) => /* @__PURE__ */ m(
+}) => /* @__PURE__ */ u(
   "div",
   {
     className: g(
@@ -728,11 +731,11 @@ const Ve = ({
       e?.containerClassName
     ),
     children: [
-      /* @__PURE__ */ m("div", { className: "flex items-center gap-x-2", children: [
+      /* @__PURE__ */ u("div", { className: "flex items-center gap-x-2", children: [
         /* @__PURE__ */ r("span", { children: e?.warningIcon }),
-        /* @__PURE__ */ m("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ m("div", { className: "flex gap-x-[4px]", children: [
-            /* @__PURE__ */ m(
+        /* @__PURE__ */ u("div", { className: "flex flex-col gap-1", children: [
+          /* @__PURE__ */ u("div", { className: "flex gap-x-[4px]", children: [
+            /* @__PURE__ */ u(
               "span",
               {
                 className: g(
@@ -769,7 +772,7 @@ const Ve = ({
           )
         ] })
       ] }),
-      n && /* @__PURE__ */ m(
+      n && /* @__PURE__ */ u(
         "span",
         {
           onClick: () => s?.(),
@@ -780,7 +783,7 @@ const Ve = ({
           ]
         }
       ),
-      t && /* @__PURE__ */ r("a", { href: l || "", target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ m("span", { className: "body-3 flex cursor-pointer items-center gap-x-[4px]", children: [
+      t && /* @__PURE__ */ r("a", { href: l || "", target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ u("span", { className: "body-3 flex cursor-pointer items-center gap-x-[4px]", children: [
         e?.dataExplorerIcon,
         e?.dataExplorer
       ] }) })
@@ -811,14 +814,14 @@ function Mt({
   className: s,
   contentClassName: l
 }) {
-  const a = Qe(), c = t ?? a?.icons?.[e], i = a?.classes?.container ?? Je, h = a?.classes?.types?.[e] ?? Ke[e], d = F(i, h, s), p = F(Xe, a?.classes?.icon), f = F(
+  const a = Qe(), i = t ?? a?.icons?.[e], m = a?.classes?.container ?? Je, h = a?.classes?.types?.[e] ?? Ke[e], c = F(m, h, s), f = F(Xe, a?.classes?.icon), p = F(
     Ze,
     a?.classes?.content,
     l
   );
-  return /* @__PURE__ */ m("div", { "data-type": e, className: d, children: [
-    c ? /* @__PURE__ */ r("span", { className: p, children: c }) : null,
-    n ? /* @__PURE__ */ r("div", { className: f, children: n }) : null
+  return /* @__PURE__ */ u("div", { "data-type": e, className: c, children: [
+    i ? /* @__PURE__ */ r("span", { className: f, children: i }) : null,
+    n ? /* @__PURE__ */ r("div", { className: p, children: n }) : null
   ] });
 }
 const Tt = ({
@@ -828,34 +831,34 @@ const Tt = ({
   hoverTooltip: s,
   icon: l,
   copiedIcon: a,
-  className: c,
-  buttonTextClassName: i,
+  className: i,
+  buttonTextClassName: m,
   onClick: h
 }) => {
-  const [d, p] = j(!1), f = W(null), v = () => {
-    h(), p(!0), f.current && clearTimeout(f.current), f.current = setTimeout(() => {
-      p(!1);
+  const [c, f] = j(!1), p = W(null), N = () => {
+    h(), f(!0), p.current && clearTimeout(p.current), p.current = setTimeout(() => {
+      f(!1);
     }, 1e3);
   };
   return O(() => () => {
-    f.current && clearTimeout(f.current);
-  }, []), /* @__PURE__ */ m("div", { className: "relative w-fit", title: s, children: [
+    p.current && clearTimeout(p.current);
+  }, []), /* @__PURE__ */ u("div", { className: "relative w-fit", title: s, children: [
     /* @__PURE__ */ r(
       Ge,
       {
-        title: d ? t : e,
+        title: c ? t : e,
         isSmallButton: !0,
-        disabled: d,
+        disabled: c,
         buttonClassName: F([
           "text-button-tertiary small-icon-button !h-6 !p-0",
-          c
+          i
         ]),
-        textClassName: F(["ml-1", i]),
-        onClick: v,
-        iconBefore: d ? a : l
+        textClassName: F(["ml-1", m]),
+        onClick: N,
+        iconBefore: c ? a : l
       }
     ),
-    n && d && /* @__PURE__ */ r("div", { className: "h4 absolute left-1/2 top-full z-50 mt-1 -translate-x-1/2 whitespace-nowrap rounded border border-neutrals-400 bg-white px-3 py-4 text-neutrals-900 shadow", children: n })
+    n && c && /* @__PURE__ */ r("div", { className: "h4 absolute left-1/2 top-full z-50 mt-1 -translate-x-1/2 whitespace-nowrap rounded border border-neutrals-400 bg-white px-3 py-4 text-neutrals-900 shadow", children: n })
   ] });
 };
 function et({
@@ -865,13 +868,13 @@ function et({
   showDragHandle: s,
   showCheckbox: l,
   isChecked: a,
-  isExpanded: c
+  isExpanded: i
 }) {
-  return /* @__PURE__ */ m("div", { className: "relative cursor-grabbing rounded bg-neutrals-200 shadow", children: [
+  return /* @__PURE__ */ u("div", { className: "relative cursor-grabbing rounded bg-neutrals-200 shadow", children: [
     /* @__PURE__ */ r("div", { className: "absolute -left-[0.5px] top-0.5 h-5 w-0.5 rounded-full bg-gradients-light" }),
-    /* @__PURE__ */ m("div", { className: "flex items-stretch overflow-hidden rounded", children: [
+    /* @__PURE__ */ u("div", { className: "flex items-stretch overflow-hidden rounded", children: [
       s ? /* @__PURE__ */ r("div", { className: "flex w-6 items-center justify-center", children: /* @__PURE__ */ r("span", { "aria-hidden": !0, className: "rounded p-1", children: /* @__PURE__ */ r(X, { size: 16 }) }) }) : null,
-      /* @__PURE__ */ m("div", { className: "flex min-w-0 flex-1 items-center gap-2 p-1", children: [
+      /* @__PURE__ */ u("div", { className: "flex min-w-0 flex-1 items-center gap-2 p-1", children: [
         l ? /* @__PURE__ */ r(se, { id: e, checked: !!a, className: "p-0" }) : null,
         /* @__PURE__ */ r("span", { className: "body-3 truncate", children: t })
       ] }),
@@ -881,7 +884,7 @@ function et({
           "aria-hidden": !0,
           className: g(
             "transition-transform",
-            c ? "rotate-90" : "rotate-0"
+            i ? "rotate-90" : "rotate-0"
           ),
           children: /* @__PURE__ */ r(Z, { size: 16 })
         }
@@ -931,23 +934,23 @@ function nt({
   showCheckbox: s,
   renderLabel: l,
   onItemClick: a,
-  onToggleExpanded: c,
-  onToggleChecked: i
+  onToggleExpanded: i,
+  onToggleChecked: m
 }) {
-  const h = !!t.items?.length, d = !!t.isExpanded, p = t.isDisabled ? !1 : t.draggable ?? !0, f = t.isDisabled ? !1 : t.checkable ?? !0, v = ae(e, t.id), {
-    attributes: N,
+  const h = !!t.items?.length, c = !!t.isExpanded, f = t.isDisabled ? !1 : t.draggable ?? !0, p = t.isDisabled ? !1 : t.checkable ?? !0, N = ae(e, t.id), {
+    attributes: w,
     listeners: C,
     setNodeRef: b,
-    setActivatorNodeRef: u,
+    setActivatorNodeRef: d,
     transform: o,
     transition: x,
-    isDragging: w
-  } = Me({ id: v, disabled: !p }), S = {
+    isDragging: v
+  } = Me({ id: N, disabled: !f }), S = {
     transform: je.Transform.toString(o),
     transition: x,
-    opacity: w ? 0.6 : void 0
-  }, y = !!t.isDisabled, E = y || !f, D = [...e, t.id];
-  return /* @__PURE__ */ m(
+    opacity: v ? 0.6 : void 0
+  }, y = !!t.isDisabled, E = y || !p, D = [...e, t.id];
+  return /* @__PURE__ */ u(
     "div",
     {
       ref: b,
@@ -968,15 +971,15 @@ function nt({
             children: /* @__PURE__ */ r(
               "span",
               {
-                ref: u,
+                ref: d,
                 "aria-hidden": !0,
                 className: g([
                   "rounded p-1",
-                  p ? "cursor-grab" : "cursor-default",
+                  f ? "cursor-grab" : "cursor-default",
                   "transition-opacity"
                 ]),
-                ...p ? C : {},
-                ...p ? N : {},
+                ...f ? C : {},
+                ...f ? w : {},
                 children: /* @__PURE__ */ r(
                   X,
                   {
@@ -988,7 +991,7 @@ function nt({
             )
           }
         ) : null,
-        /* @__PURE__ */ m(
+        /* @__PURE__ */ u(
           "button",
           {
             type: "button",
@@ -1013,10 +1016,10 @@ function nt({
                 {
                   id: `draggable-list-${D.join("-")}`,
                   checked: !!t.isChecked,
-                  disabled: !f,
+                  disabled: !p,
                   className: "p-0",
                   stopPropagation: !0,
-                  onChange: (k, I) => i?.({
+                  onChange: (k, I) => m?.({
                     itemId: t.id,
                     path: D,
                     nextChecked: !!I
@@ -1033,13 +1036,13 @@ function nt({
             type: "button",
             disabled: y,
             onClick: (k) => {
-              k.stopPropagation(), c?.({
+              k.stopPropagation(), i?.({
                 itemId: t.id,
                 path: D,
-                nextExpanded: !d
+                nextExpanded: !c
               });
             },
-            "aria-label": d ? "Collapse" : "Expand",
+            "aria-label": c ? "Collapse" : "Expand",
             className: g([
               "flex w-8 items-center justify-center rounded",
               y ? "" : "hover:bg-neutrals-100",
@@ -1051,7 +1054,7 @@ function nt({
                 "aria-hidden": !0,
                 className: g(
                   "transition-transform duration-150 ease-out",
-                  d ? "rotate-90" : "rotate-0"
+                  c ? "rotate-90" : "rotate-0"
                 ),
                 children: /* @__PURE__ */ r(Z, { size: 16 })
               }
@@ -1069,36 +1072,36 @@ function Pt({
   onItemsChange: s,
   onToggleExpanded: l,
   onToggleChecked: a,
-  onItemClick: c,
-  renderLabel: i
+  onItemClick: i,
+  renderLabel: m
 }) {
   const h = Le(
     Oe(Fe, { activationConstraint: { distance: 6 } })
-  ), [d, p] = ue.useState(null), f = (C) => {
-    const b = String(C.active.id), u = $(b);
-    if (!u) return;
-    const o = tt(e, u.parentPath, u.itemId);
-    !o || o.type !== "item" || p({
+  ), [c, f] = ue.useState(null), p = (C) => {
+    const b = String(C.active.id), d = $(b);
+    if (!d) return;
+    const o = tt(e, d.parentPath, d.itemId);
+    !o || o.type !== "item" || f({
       id: b,
       label: o.label,
       hasChildren: !!o.items?.length,
       isChecked: o.isChecked,
       isExpanded: o.isExpanded
     });
-  }, v = (C) => {
-    p(null);
+  }, N = (C) => {
+    f(null);
     const b = C.over;
     if (!b) return;
-    const u = $(String(C.active.id)), o = $(String(b.id));
-    if (!u || !o || u.parentPath.join("/") !== o.parentPath.join("/")) return;
-    const x = oe(e, u.parentPath);
+    const d = $(String(C.active.id)), o = $(String(b.id));
+    if (!d || !o || d.parentPath.join("/") !== o.parentPath.join("/")) return;
+    const x = oe(e, d.parentPath);
     if (!x) return;
-    const w = x.findIndex((E) => E.id === u.itemId), S = x.findIndex((E) => E.id === o.itemId);
-    if (w === -1 || S === -1 || w === S) return;
-    const y = ce(e, u.parentPath, (E) => {
+    const v = x.findIndex((E) => E.id === d.itemId), S = x.findIndex((E) => E.id === o.itemId);
+    if (v === -1 || S === -1 || v === S) return;
+    const y = ce(e, d.parentPath, (E) => {
       const D = E.filter(
         (R) => R.type === "item"
-      ), k = Ye(D, w, S);
+      ), k = Ye(D, v, S);
       let I = 0;
       return E.map((R) => {
         if (R.type !== "item") return R;
@@ -1107,27 +1110,27 @@ function Pt({
       });
     });
     s(y);
-  }, N = (C, b = []) => {
-    const u = C.filter((o) => o.type === "item").map((o) => ae(b, o.id));
+  }, w = (C, b = []) => {
+    const d = C.filter((o) => o.type === "item").map((o) => ae(b, o.id));
     return /* @__PURE__ */ r(
       Te,
       {
-        items: u,
+        items: d,
         strategy: Pe,
-        children: /* @__PURE__ */ r("ul", { className: "m-0 flex list-none flex-col gap-2 p-0", children: C.map((o) => o.type === "group" ? /* @__PURE__ */ m(
+        children: /* @__PURE__ */ r("ul", { className: "m-0 flex list-none flex-col gap-2 p-0", children: C.map((o) => o.type === "group" ? /* @__PURE__ */ u(
           "li",
           {
             className: "m-0 mt-2 flex flex-col gap-2 p-0 first:mt-0",
             children: [
-              /* @__PURE__ */ m("div", { className: "h5 flex items-center gap-2 py-1 text-neutrals-1000", children: [
+              /* @__PURE__ */ u("div", { className: "h5 flex items-center gap-2 py-1 text-neutrals-1000", children: [
                 /* @__PURE__ */ r(xe, { size: 12, className: "shrink-0" }),
                 o.label
               ] }),
-              /* @__PURE__ */ r("div", { className: "border-l border-neutrals-600 pl-2", children: N(o.items, [...b, o.id]) })
+              /* @__PURE__ */ r("div", { className: "border-l border-neutrals-600 pl-2", children: w(o.items, [...b, o.id]) })
             ]
           },
           o.id
-        ) : /* @__PURE__ */ m("li", { className: "m-0 flex flex-col gap-2 p-0", children: [
+        ) : /* @__PURE__ */ u("li", { className: "m-0 flex flex-col gap-2 p-0", children: [
           /* @__PURE__ */ r(
             nt,
             {
@@ -1135,36 +1138,36 @@ function Pt({
               item: o,
               showDragHandle: t,
               showCheckbox: n,
-              renderLabel: i,
-              onItemClick: c,
+              renderLabel: m,
+              onItemClick: i,
               onToggleExpanded: l,
               onToggleChecked: a
             }
           ),
-          o.items?.length && o.isExpanded ? /* @__PURE__ */ r("div", { className: "pl-7", children: N(o.items, [...b, o.id]) }) : null
+          o.items?.length && o.isExpanded ? /* @__PURE__ */ r("div", { className: "pl-7", children: w(o.items, [...b, o.id]) }) : null
         ] }, o.id)) })
       }
     );
   };
-  return /* @__PURE__ */ m(
+  return /* @__PURE__ */ u(
     Re,
     {
       sensors: h,
       collisionDetection: _e,
-      onDragStart: f,
-      onDragEnd: v,
+      onDragStart: p,
+      onDragEnd: N,
       children: [
-        /* @__PURE__ */ r("div", { className: "flex flex-col", children: N(e) }),
-        /* @__PURE__ */ r(Ae, { children: d ? /* @__PURE__ */ r(
+        /* @__PURE__ */ r("div", { className: "flex flex-col", children: w(e) }),
+        /* @__PURE__ */ r(Ae, { children: c ? /* @__PURE__ */ r(
           et,
           {
-            id: d.id,
-            label: d.label,
-            hasChildren: d.hasChildren,
+            id: c.id,
+            label: c.label,
+            hasChildren: c.hasChildren,
             showDragHandle: t,
             showCheckbox: n,
-            isChecked: d.isChecked,
-            isExpanded: d.isExpanded
+            isChecked: c.isChecked,
+            isExpanded: c.isExpanded
           }
         ) : null })
       ]
@@ -1179,14 +1182,14 @@ function Yt(e, t, n = {}) {
   const {
     expandMatchedBranches: l = !0,
     includeGroupDescendantsOnMatch: a = !0,
-    includeItemDescendantsOnMatch: c = !1,
-    match: i = rt
+    includeItemDescendantsOnMatch: i = !1,
+    match: m = rt
   } = n;
   return B(e, s, {
     expandMatchedBranches: l,
     includeGroupDescendantsOnMatch: a,
-    includeItemDescendantsOnMatch: c,
-    match: i
+    includeItemDescendantsOnMatch: i,
+    match: m
   }) ?? [];
 }
 function B(e, t, n) {
@@ -1202,10 +1205,10 @@ function st(e, t, n) {
   if (e.type === "group") {
     if (s && n.includeGroupDescendantsOnMatch)
       return Y(e, n.expandMatchedBranches);
-    const c = e.items?.length ? B(e.items, t, n) : null;
-    return !s && !c ? null : {
+    const i = e.items?.length ? B(e.items, t, n) : null;
+    return !s && !i ? null : {
       ...e,
-      items: c ?? []
+      items: i ?? []
     };
   }
   const l = e.items?.length ? B(e.items, t, n) : null;