@epam/statgpt-ui-components 0.5.0-rc.12 → 0.5.0-rc.13

package/index.mjs

@@ -1,63 +1,63 @@
-import { jsx as r, jsxs as o, Fragment as H } from "react/jsx-runtime";
-import * as oe from "react";
-import { useEffect as M, useState as j, useRef as B, useCallback as P, useMemo as W, createContext as U, useContext as V } from "react";
-import f from "classnames";
-import { IconX as de, IconCalendarEvent as ue, IconSquareCheckFilled as me, IconChevronDown as he, IconGripVertical as Q, IconChevronRight as K, IconDatabase as fe } from "@tabler/icons-react";
-import { extendTailwindMerge as pe } from "tailwind-merge";
-import ge from "react-flatpickr";
-import { CalendarResolution as O } from "@epam/statgpt-shared-toolkit";
-import { useFloating as X, useRole as xe, useDismiss as Z, useInteractions as J, FloatingPortal as be, FloatingOverlay as Ne, FloatingFocusManager as Ce, autoUpdate as ve, offset as ye, flip as we, shift as Ee, useClick as Se } from "@floating-ui/react";
-import { useSensors as Ie, useSensor as ke, PointerSensor as De, DndContext as Re, closestCenter as Le, DragOverlay as Fe } from "@dnd-kit/core";
-import { useSortable as Oe, SortableContext as _e, verticalListSortingStrategy as Ae, arrayMove as Pe } from "@dnd-kit/sortable";
-import { CSS as Te } from "@dnd-kit/utilities";
-const ee = () => /* @__PURE__ */ r("div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ r("div", { className: "loader" }) }), te = ({
+import { jsx as s, jsxs as c, Fragment as U } from "react/jsx-runtime";
+import * as ue from "react";
+import { useEffect as R, useState as Y, useRef as W, useCallback as T, useMemo as V, useId as me, createContext as Q, useContext as K } from "react";
+import p from "classnames";
+import { IconX as he, IconCalendarEvent as fe, IconSquareCheckFilled as pe, IconChevronDown as ge, IconGripVertical as X, IconChevronRight as Z, IconDatabase as xe } from "@tabler/icons-react";
+import { extendTailwindMerge as be } from "tailwind-merge";
+import Ne from "react-flatpickr";
+import { CalendarResolution as A } from "@epam/statgpt-shared-toolkit";
+import { useFloating as J, useRole as we, useDismiss as ee, useInteractions as te, FloatingPortal as ve, FloatingOverlay as ye, FloatingFocusManager as Ce, autoUpdate as Ee, offset as Se, flip as Ie, size as ke, shift as De, useClick as Le } from "@floating-ui/react";
+import { useSensors as Re, useSensor as Oe, PointerSensor as Fe, DndContext as _e, closestCenter as Ae, DragOverlay as Me } from "@dnd-kit/core";
+import { useSortable as Pe, SortableContext as Te, verticalListSortingStrategy as je, arrayMove as Ye } from "@dnd-kit/sortable";
+import { CSS as Ge } from "@dnd-kit/utilities";
+const ne = () => /* @__PURE__ */ s("div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ s("div", { className: "loader" }) }), re = ({
   title: e,
   btnClassNames: t,
   iconWidth: n,
-  iconHeight: s,
-  onClick: l
-}) => /* @__PURE__ */ r(
+  iconHeight: r,
+  onClick: a
+}) => /* @__PURE__ */ s(
   "button",
   {
     type: "button",
     "aria-label": "button",
     className: t,
     title: e,
-    onClick: l,
-    children: /* @__PURE__ */ r(de, { height: s || 20, width: n || 20 })
+    onClick: a,
+    children: /* @__PURE__ */ s(he, { height: r || 20, width: n || 20 })
   }
 );
-var F = /* @__PURE__ */ ((e) => (e.ERROR = "error", e.SUCCESS = "success", e.IN_PROGRESS = "in_progress", e))(F || {});
-const mt = ({
+var _ = /* @__PURE__ */ ((e) => (e.ERROR = "error", e.SUCCESS = "success", e.IN_PROGRESS = "in_progress", e))(_ || {});
+const xt = ({
   alertDetails: e,
   successIcon: t,
   errorIcon: n,
-  onClose: s,
-  closeButtonTitle: l
+  onClose: r,
+  closeButtonTitle: a
 }) => {
-  const a = () => e?.type === F.IN_PROGRESS ? "alert-in-progress" : e?.type === F.SUCCESS ? "alert-success" : "alert-error";
-  return M(() => {
-    e?.type !== F.IN_PROGRESS && setTimeout(() => {
-      s?.();
+  const l = () => e?.type === _.IN_PROGRESS ? "alert-in-progress" : e?.type === _.SUCCESS ? "alert-success" : "alert-error";
+  return R(() => {
+    e?.type !== _.IN_PROGRESS && setTimeout(() => {
+      r?.();
     }, 5e3);
-  }, [e?.type, s]), /* @__PURE__ */ r(
+  }, [e?.type, r]), /* @__PURE__ */ s(
     "div",
     {
-      className: f(
+      className: p(
         "alert alert-shadow fixed bottom-3 right-3 z-10",
-        a()
+        l()
       ),
-      children: /* @__PURE__ */ o("div", { className: "alert-content flex items-start", children: [
-        /* @__PURE__ */ r("div", { className: "alert-icon", children: e?.type === F.IN_PROGRESS ? /* @__PURE__ */ r(ee, {}) : e?.type === F.SUCCESS ? t : n }),
-        /* @__PURE__ */ o("div", { className: "flex max-w-[300px] flex-col gap-2", children: [
-          /* @__PURE__ */ r("h3", { className: "truncate", children: e?.title }),
-          e?.text && /* @__PURE__ */ r("div", { className: "alert-text truncate", title: e?.text, children: e?.text })
+      children: /* @__PURE__ */ c("div", { className: "alert-content flex items-start", children: [
+        /* @__PURE__ */ s("div", { className: "alert-icon", children: e?.type === _.IN_PROGRESS ? /* @__PURE__ */ s(ne, {}) : e?.type === _.SUCCESS ? t : n }),
+        /* @__PURE__ */ c("div", { className: "flex max-w-[300px] flex-col gap-2", children: [
+          /* @__PURE__ */ s("h3", { className: "truncate", children: e?.title }),
+          e?.text && /* @__PURE__ */ s("div", { className: "alert-text truncate", title: e?.text, children: e?.text })
         ] }),
-        /* @__PURE__ */ r(te, { title: l, onClick: s })
+        /* @__PURE__ */ s(re, { title: a, onClick: r })
       ] })
     }
   );
-}, Me = pe({
+}, ze = be({
   extend: {
     classGroups: {
       typography: [
@@ -74,416 +74,416 @@ const mt = ({
     }
   }
 });
-function R(...e) {
-  return Me(f(...e));
+function O(...e) {
+  return ze(p(...e));
 }
-const je = ({
+const He = ({
   buttonClassName: e,
   textClassName: t,
   isLoading: n = !1,
-  title: s,
-  disabled: l,
-  iconAfter: a,
+  title: r,
+  disabled: a,
+  iconAfter: l,
   iconBefore: d,
-  onClick: u,
+  onClick: m,
   isSmallButton: h
 }) => {
-  const m = R([
+  const u = O([
     h ? "font-semibold" : "",
-    a ? "mr-2" : "",
+    l ? "mr-2" : "",
     d ? "ml-2" : "",
     t
   ]);
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ c(
     "button",
     {
       type: "button",
-      className: f(
+      className: p(
         "base-button",
         e,
         h ? "small-button" : ""
       ),
-      disabled: l || n,
+      disabled: a || n,
       "aria-label": "button",
-      onClick: (p) => u?.(p),
-      title: s,
+      onClick: (f) => m?.(f),
+      title: r,
       children: [
         d,
-        n && /* @__PURE__ */ r(ee, {}),
-        s ? h ? /* @__PURE__ */ r("h4", { className: m, children: s }) : /* @__PURE__ */ r("h3", { className: m, children: s }) : null,
-        a
+        n && /* @__PURE__ */ s(ne, {}),
+        r ? h ? /* @__PURE__ */ s("h4", { className: u, children: r }) : /* @__PURE__ */ s("h3", { className: u, children: r }) : null,
+        l
       ]
     }
   );
 };
-function Ye(e = 719) {
-  const [t, n] = j(
+function $e(e = 719) {
+  const [t, n] = Y(
     () => typeof window < "u" ? window.innerWidth < e : !1
   );
-  return M(() => {
-    const s = window.matchMedia(`(max-width: ${e}px)`), l = (a) => {
-      n(a.matches);
+  return R(() => {
+    const r = window.matchMedia(`(max-width: ${e}px)`), a = (l) => {
+      n(l.matches);
     };
-    return n(s.matches), s.addEventListener("change", l), () => s.removeEventListener("change", l);
+    return n(r.matches), r.addEventListener("change", a), () => r.removeEventListener("change", a);
   }, [e]), t;
 }
-function ht(e, t) {
-  const n = B(null);
-  return P(
-    (...l) => {
+function bt(e, t) {
+  const n = W(null);
+  return T(
+    (...a) => {
       n.current && clearTimeout(n.current), n.current = setTimeout(() => {
-        e(...l);
+        e(...a);
       }, t);
     },
     [e, t]
   );
 }
-const ft = 24, pt = 24, q = 1e3, Ge = 24, gt = ({
+const Nt = 24, wt = 24, q = 1e3, Be = 24, vt = ({
   label: e,
   onChange: t,
   value: n,
-  options: s,
-  calendarResolution: l = O.DAY,
-  id: a,
+  options: r,
+  calendarResolution: a = A.DAY,
+  id: l,
   icon: d,
-  isEndDate: u
+  isEndDate: m
 }) => {
-  const h = B(null), m = Ye();
-  M(() => {
-    const b = h?.current;
-    b && b.querySelector("input")?.setAttribute("aria-label", e);
+  const h = W(null), u = $e();
+  R(() => {
+    const N = h?.current;
+    N && N.querySelector("input")?.setAttribute("aria-label", e);
   }, [e]);
-  const p = {
-    ...s,
+  const f = {
+    ...r,
     disableMobile: !0,
-    defaultDate: l === O.MONTH ? new Date(n.getFullYear(), n.getMonth()) : n
-  }, g = (b, N, x) => {
-    const c = `calendar__${l === O.MONTH ? "month" : "day"}`;
-    x.calendarContainer && x.calendarContainer.classList.add(c);
-  }, C = (b, N, x) => {
-    if (l === O.MONTH && b.length > 0) {
-      const c = s.minDate, i = s.maxDate, v = b[0].getFullYear(), k = x.calendarContainer, S = "flatpickr-disabled", y = k.querySelectorAll(
+    defaultDate: a === A.MONTH ? new Date(n.getFullYear(), n.getMonth()) : n
+  }, x = (N, v, b) => {
+    const o = `calendar__${a === A.MONTH ? "month" : "day"}`;
+    b.calendarContainer && b.calendarContainer.classList.add(o);
+  }, C = (N, v, b) => {
+    if (a === A.MONTH && N.length > 0) {
+      const o = r.minDate, i = r.maxDate, g = N[0].getFullYear(), w = b.calendarContainer, I = "flatpickr-disabled", y = w.querySelectorAll(
         ".flatpickr-monthSelect-month"
-      ), w = k.querySelectorAll(
+      ), E = w.querySelectorAll(
         ".flatpickr-next-month"
-      )[0], D = k.querySelectorAll(
+      )[0], D = w.querySelectorAll(
         ".flatpickr-prev-month"
       )[0];
-      v === i.getFullYear() && w.classList.add(S), v === c.getFullYear() && D.classList.add(S), (v === c.getFullYear() || v === i.getFullYear()) && y.forEach((I) => {
-        I.classList.remove(S);
-        const E = new Date(I.getAttribute("aria-label")), L = E.getFullYear() === c.getFullYear() && E.getMonth() === c.getMonth(), Y = E.getFullYear() === i.getFullYear() && E.getMonth() === i.getMonth();
-        L || Y || (E < c || E > i) && I.classList.add(S);
+      g === i.getFullYear() && E.classList.add(I), g === o.getFullYear() && D.classList.add(I), (g === o.getFullYear() || g === i.getFullYear()) && y.forEach((k) => {
+        k.classList.remove(I);
+        const S = new Date(k.getAttribute("aria-label")), F = S.getFullYear() === o.getFullYear() && S.getMonth() === o.getMonth(), G = S.getFullYear() === i.getFullYear() && S.getMonth() === i.getMonth();
+        F || G || (S < o || S > i) && k.classList.add(I);
       });
     }
     setTimeout(() => {
-      const c = x.calendarContainer, i = x._input?.getBoundingClientRect();
-      c && (c.style.top = `${i.top - c.offsetHeight - 8}px`, c.style.width = `${c.style.width}px`, u ? (c.style.right = `${window.innerWidth - i.right - (m ? Ge : 0)}px`, c.style.left = "auto") : c.style.left = `${i.left}px`);
+      const o = b.calendarContainer, i = b._input?.getBoundingClientRect();
+      o && (o.style.top = `${i.top - o.offsetHeight - 8}px`, o.style.width = `${o.style.width}px`, m ? (o.style.right = `${window.innerWidth - i.right - (u ? Be : 0)}px`, o.style.left = "auto") : o.style.left = `${i.left}px`);
     }, 0);
   };
-  return /* @__PURE__ */ o("div", { className: "calendar relative", ref: h, children: [
-    /* @__PURE__ */ r("div", { className: "calendar-title mb-1", children: e }),
-    /* @__PURE__ */ r(
+  return /* @__PURE__ */ c("div", { className: "calendar relative", ref: h, children: [
+    /* @__PURE__ */ s("div", { className: "calendar-title mb-1", children: e }),
+    /* @__PURE__ */ s(
       "label",
       {
-        htmlFor: a,
+        htmlFor: l,
         className: "absolute right-[11px] top-[29px] cursor-pointer",
-        children: d || /* @__PURE__ */ r(ue, {})
+        children: d || /* @__PURE__ */ s(fe, {})
       }
     ),
-    /* @__PURE__ */ r(
-      ge,
+    /* @__PURE__ */ s(
+      Ne,
       {
-        defaultValue: (l === O.MONTH ? new Date(n.getFullYear(), n.getMonth()) : n)?.toDateString(),
-        options: p,
-        onChange: (b) => {
-          t(b[0]);
+        defaultValue: (a === A.MONTH ? new Date(n.getFullYear(), n.getMonth()) : n)?.toDateString(),
+        options: f,
+        onChange: (N) => {
+          t(N[0]);
         },
         onOpen: [C],
-        onReady: [g],
-        id: a
+        onReady: [x],
+        id: l
       }
     )
   ] });
-}, ne = ({
+}, se = ({
   label: e,
   id: t,
   checked: n,
-  checkboxIcon: s,
-  onChange: l,
-  disabled: a = !1,
+  checkboxIcon: r,
+  onChange: a,
+  disabled: l = !1,
   className: d,
-  stopPropagation: u = !0
+  stopPropagation: m = !0
 }) => {
-  const h = P(
-    (g) => {
-      u && g.stopPropagation();
+  const h = T(
+    (x) => {
+      m && x.stopPropagation();
     },
-    [u]
-  ), m = P(
-    (g) => {
-      u && g.stopPropagation(), l?.(t, g.target.checked);
+    [m]
+  ), u = T(
+    (x) => {
+      m && x.stopPropagation(), a?.(t, x.target.checked);
     },
-    [l, t, u]
-  ), p = () => {
+    [a, t, m]
+  ), f = () => {
     if (n)
-      return s || /* @__PURE__ */ r(me, { className: "absolute size-4" });
+      return r || /* @__PURE__ */ s(pe, { className: "absolute size-4" });
   };
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ c(
     "label",
     {
       htmlFor: t,
       onClick: h,
-      className: R(
+      className: O(
         "flex min-w-0 items-center py-1 shrink-0",
-        a ? "cursor-not-allowed opacity-50" : "cursor-pointer",
+        l ? "cursor-not-allowed opacity-50" : "cursor-pointer",
         d
       ),
       children: [
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ s(
           "span",
           {
-            className: f(
+            className: p(
               "checkbox-button relative flex size-[14px] items-center justify-center"
             ),
             "aria-hidden": !0,
-            children: p()
+            children: f()
           }
         ),
-        e ? /* @__PURE__ */ r(
+        e ? /* @__PURE__ */ s(
           "p",
           {
-            className: f(
+            className: p(
               "checkbox-button-text text-neutrals-1000 min-w-0 ml-2 flex-1 truncate pr-2"
             ),
             title: e,
             children: e
           }
         ) : null,
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ s(
           "input",
           {
             id: t,
             type: "checkbox",
             checked: n,
-            disabled: a,
-            onChange: m,
+            disabled: l,
+            onChange: u,
             className: "hidden"
           }
         )
       ]
     }
   );
-}, xt = ({
+}, yt = ({
   title: e,
   icon: t,
   children: n,
-  value: s
+  value: r
 }) => {
-  const [l, a] = j(!1);
-  return /* @__PURE__ */ o(
+  const [a, l] = Y(!1);
+  return /* @__PURE__ */ c(
     "div",
     {
-      className: `collapsible-block flex flex-col border-t-2 border-neutrals-600 ${l ? "collapsible-block-open" : ""}`,
+      className: `collapsible-block flex flex-col border-t-2 border-neutrals-600 ${a ? "collapsible-block-open" : ""}`,
       children: [
-        /* @__PURE__ */ o(
+        /* @__PURE__ */ c(
           "div",
           {
             className: "collapsible-block-title flex cursor-pointer items-center py-4",
-            onClick: () => a(!l),
+            onClick: () => l(!a),
             children: [
-              /* @__PURE__ */ r("div", { className: `${l ? "rotate-180" : ""} transition-transform`, children: t || /* @__PURE__ */ r(he, { className: "mr-3 size-5" }) }),
-              /* @__PURE__ */ o("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 })
+              /* @__PURE__ */ s("div", { className: `${a ? "rotate-180" : ""} transition-transform`, children: t || /* @__PURE__ */ s(ge, { className: "mr-3 size-5" }) }),
+              /* @__PURE__ */ c("div", { className: "flex flex-1 items-center justify-between", children: [
+                /* @__PURE__ */ s("span", { children: e }),
+                r && /* @__PURE__ */ s("p", { className: "body-1 text-neutrals-800", children: r })
               ] })
             ]
           }
         ),
-        l && /* @__PURE__ */ r("div", { className: "collapsible-block-content pb-4", children: n })
+        a && /* @__PURE__ */ s("div", { className: "collapsible-block-content pb-4", children: n })
       ]
     }
   );
-}, bt = ({ text: e, highlightText: t }) => {
-  const n = W(() => {
-    const s = [];
+}, Ct = ({ text: e, highlightText: t }) => {
+  const n = V(() => {
+    const r = [];
     if (!t)
       return [{ id: 0, text: e, highlight: !1 }];
-    const l = t?.toLowerCase() || "", a = e?.toLowerCase()?.split(l) || "";
-    for (let d = 0, u = 0; d < a?.length; d++) {
-      const h = a?.[d], m = h.length;
-      h !== "" && s.push({
-        id: s.length,
+    const a = t?.toLowerCase() || "", l = e?.toLowerCase()?.split(a) || "";
+    for (let d = 0, m = 0; d < l?.length; d++) {
+      const h = l?.[d], u = h.length;
+      h !== "" && r.push({
+        id: r.length,
         highlight: !1,
         text: e?.substring(
-          u,
-          u + m
+          m,
+          m + u
         )
-      }), u += m, d !== a?.length - 1 && (s.push({
-        id: s.length,
+      }), m += u, d !== l?.length - 1 && (r.push({
+        id: r.length,
         highlight: !0,
         text: e?.substring(
-          u,
-          u + t.length
+          m,
+          m + t.length
         )
-      }), u += t.length);
+      }), m += t.length);
     }
-    return s;
+    return r;
   }, [t, e]);
-  return /* @__PURE__ */ r(H, { children: n.map((s) => /* @__PURE__ */ r(
+  return /* @__PURE__ */ s(U, { children: n.map((r) => /* @__PURE__ */ s(
     "span",
     {
-      className: f(s?.highlight && "bg-highlight"),
-      children: s?.text
+      className: p(r?.highlight && "bg-highlight"),
+      children: r?.text
     },
-    s?.id
+    r?.id
   )) });
-}, Nt = ({
+}, Et = ({
   icon: e,
   onClick: t,
   buttonClassName: n,
-  disabled: s,
-  title: l,
-  isBaseIconStyles: a = !0
-}) => /* @__PURE__ */ r(
+  disabled: r,
+  title: a,
+  isBaseIconStyles: l = !0
+}) => /* @__PURE__ */ s(
   "button",
   {
     type: "button",
-    className: f(
-      a && "base-icon-button",
+    className: p(
+      l && "base-icon-button",
       n
     ),
     onClick: (d) => t?.(d),
-    disabled: s,
-    title: l,
+    disabled: r,
+    title: a,
     "aria-label": "button",
     children: e
   }
-), ze = ({
+), We = ({
   value: e,
   inputId: t,
   placeholder: n = "",
-  cssClass: s = "",
-  type: l = "text",
-  disabled: a,
+  cssClass: r = "",
+  type: a = "text",
+  disabled: l,
   readonly: d,
-  onChange: u,
+  onChange: m,
   onKeyDown: h,
-  onFocus: m,
-  onBlur: p
+  onFocus: u,
+  onBlur: f
 }) => {
-  const g = f(
+  const x = p(
     "truncate outline-none shadow-none body-1",
-    s,
+    r,
     d ? "pointer-events-none" : ""
   );
-  return /* @__PURE__ */ r(
+  return /* @__PURE__ */ s(
     "input",
     {
-      type: l,
+      type: a,
       autoComplete: "off",
       id: t,
       placeholder: n,
       value: e || "",
       title: e ? String(e) : "",
-      disabled: a,
-      className: g,
+      disabled: l,
+      className: x,
       onKeyDown: h,
-      onFocus: m,
-      onBlur: p,
-      onChange: (C) => u?.(C.currentTarget.value)
+      onFocus: u,
+      onBlur: f,
+      onChange: (C) => m?.(C.currentTarget.value)
     }
   );
-}, Ct = ({
+}, St = ({
   iconBeforeInput: e,
   iconAfterInput: t,
   containerClasses: n,
-  cssClass: s,
-  ...l
-}) => /* @__PURE__ */ o("div", { className: f("input w-full flex flex-row", n), children: [
+  cssClass: r,
+  ...a
+}) => /* @__PURE__ */ c("div", { className: p("input w-full flex flex-row", n), children: [
   e,
-  /* @__PURE__ */ r(
-    ze,
+  /* @__PURE__ */ s(
+    We,
     {
-      cssClass: f(
+      cssClass: p(
         "border-0 bg-transparent p-0 h-full shadow-none flex-1 min-w-0 rounded-none",
-        s
+        r
       ),
-      ...l
+      ...a
     }
   ),
   t
-] }), vt = ({
+] }), It = ({
   url: e,
   title: t,
   linkClassName: n = "",
-  iconBefore: s,
-  iconAfter: l
+  iconBefore: r,
+  iconAfter: a
 }) => {
-  const a = f(
-    l ? "mr-2" : "",
-    s ? "ml-2" : ""
+  const l = p(
+    a ? "mr-2" : "",
+    r ? "ml-2" : ""
   );
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ c(
     "a",
     {
       href: e,
       target: "_blank",
       rel: "noopener noreferrer",
-      className: f("base-link", n),
+      className: p("base-link", n),
       title: t,
       children: [
-        s,
-        /* @__PURE__ */ r("span", { className: a, children: t }),
-        l
+        r,
+        /* @__PURE__ */ s("span", { className: l, children: t }),
+        a
       ]
     }
   );
-}, yt = ({ title: e, text: t, disabled: n, onClick: s }) => /* @__PURE__ */ r(
+}, kt = ({ title: e, text: t, disabled: n, onClick: r }) => /* @__PURE__ */ s(
   "button",
   {
     type: "button",
-    className: f(
+    className: p(
       "tag flex items-center justify-center",
       "disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:bg-neutrals-100"
     ),
     disabled: n,
-    onClick: () => s?.(t || e),
+    onClick: () => r?.(t || e),
     "aria-label": "button",
-    children: /* @__PURE__ */ r("h4", { children: e })
+    children: /* @__PURE__ */ s("h4", { children: e })
   }
-), wt = ({
+), Dt = ({
   label: e,
   id: t,
   checked: n,
-  radioIcon: s,
-  description: l,
-  onChange: a
+  radioIcon: r,
+  description: a,
+  onChange: l
 }) => {
-  const d = P(
-    (u) => {
-      u.stopPropagation(), a?.(t, u.target.checked);
+  const d = T(
+    (m) => {
+      m.stopPropagation(), l?.(t, m.target.checked);
     },
-    [a, t]
+    [l, t]
   );
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ c(
     "label",
     {
       className: "flex min-w-0 cursor-pointer flex-col py-[6px]",
       htmlFor: t,
       children: [
-        /* @__PURE__ */ o("p", { className: "radio-label flex min-w-0 items-center", children: [
-          /* @__PURE__ */ r(
+        /* @__PURE__ */ c("p", { className: "radio-label flex min-w-0 items-center", children: [
+          /* @__PURE__ */ s(
             "span",
             {
-              className: f(
+              className: p(
                 "flex justify-center items-center w-4 h-4 mr-2 relative",
                 "radio-button",
                 n ? "radio-button-active" : ""
               ),
-              children: n && s
+              children: n && r
             }
           ),
-          e && /* @__PURE__ */ r(
+          e && /* @__PURE__ */ s(
             "span",
             {
               className: "radio-title body-1 min-w-0 flex-1 truncate pr-2 text-neutrals-1000",
@@ -492,15 +492,15 @@ const ft = 24, pt = 24, q = 1e3, Ge = 24, gt = ({
             }
           )
         ] }),
-        l && /* @__PURE__ */ r(
+        a && /* @__PURE__ */ s(
           "span",
           {
             className: "radio-description body-2 ml-6 flex w-auto items-center text-neutrals-800",
-            title: l,
-            children: l
+            title: a,
+            children: a
           }
         ),
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ s(
           "input",
           {
             type: "radio",
@@ -514,175 +514,216 @@ const ft = 24, pt = 24, q = 1e3, Ge = 24, gt = ({
     }
   );
 };
-var A = /* @__PURE__ */ ((e) => (e.Closed = "Closed", e.Opened = "Opened", e))(A || {}), z = /* @__PURE__ */ ((e) => (e.LG = "Large", e.SM = "Small", e))(z || {});
-const $e = ({
+var P = /* @__PURE__ */ ((e) => (e.Closed = "Closed", e.Opened = "Opened", e))(P || {}), $ = /* @__PURE__ */ ((e) => (e.LG = "Large", e.SM = "Small", e))($ || {});
+const Ve = ({
   portalId: e,
-  state: t = A.Opened,
+  state: t = P.Opened,
   heading: n,
-  size: s,
-  onClose: l,
-  children: a,
+  size: r,
+  onClose: a,
+  children: l,
   overlayClassName: d,
-  containerClassName: u,
+  containerClassName: m,
   dividers: h = !0,
-  closeButtonTitle: m
+  closeButtonTitle: u
 }) => {
-  const { refs: p, context: g } = X({
-    open: t !== A.Closed && !!t,
-    onOpenChange: l
-  }), C = xe(g, { role: "dialog" }), b = Z(g, { outsidePress: !0 }), { getFloatingProps: N } = J([C, b]), x = P(
-    (c) => {
-      c?.preventDefault(), c?.stopPropagation(), l();
+  const { refs: f, context: x } = J({
+    open: t !== P.Closed && !!t,
+    onOpenChange: a
+  }), C = we(x, { role: "dialog" }), N = ee(x, { outsidePress: !0 }), { getFloatingProps: v } = te([C, N]), b = T(
+    (o) => {
+      o?.preventDefault(), o?.stopPropagation(), a();
     },
-    [l]
+    [a]
   );
-  return /* @__PURE__ */ r(be, { id: e, children: t !== A.Closed && /* @__PURE__ */ r(
-    Ne,
+  return /* @__PURE__ */ s(ve, { id: e, children: t !== P.Closed && /* @__PURE__ */ s(
+    ye,
     {
-      className: f(
+      className: p(
         "z-modal flex items-center justify-center bg-blackout p-4",
         d
       ),
-      children: /* @__PURE__ */ r(Ce, { context: g, children: /* @__PURE__ */ o(
+      children: /* @__PURE__ */ s(Ce, { context: x, children: /* @__PURE__ */ c(
         "div",
         {
-          className: f(
+          className: p(
             "relative max-h-full modal rounded bg-white flex flex-col shadow w-full",
-            s === z.LG && "max-w-[65%]",
-            s === z.SM && "max-w-[30%]",
+            r === $.LG && "max-w-[65%]",
+            r === $.SM && "max-w-[30%]",
             h && "divide-neutrals-400 divide-y",
-            u,
+            m,
             "sm:w-full sm:max-w-full sm:px-4 sm:py-6"
           ),
-          ref: p.setFloating,
-          ...N({
-            onClick(c) {
-              c.stopPropagation();
+          ref: f.setFloating,
+          ...v({
+            onClick(o) {
+              o.stopPropagation();
             }
           }),
           children: [
-            /* @__PURE__ */ o("div", { className: "modal-heading mb-2 flex flex-row items-center justify-between px-6 py-3 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(
-                te,
+            /* @__PURE__ */ c("div", { className: "modal-heading mb-2 flex flex-row items-center justify-between px-6 py-3 sm:p-0 sm:pb-2", children: [
+              n && (typeof n == "string" ? /* @__PURE__ */ s("h2", { className: "modal-heading-title sm:h3 mr-3 min-w-0 flex-1", children: n }) : n),
+              /* @__PURE__ */ s(
+                re,
                 {
-                  title: m,
-                  onClick: x,
+                  title: u,
+                  onClick: b,
                   btnClassNames: "sm:h-[24px] sm:w-[24px] sm:top-4"
                 }
               )
             ] }),
-            a.map((c) => c)
+            l.map((o) => o)
           ]
         }
       ) })
     }
   ) });
-}, Et = (e) => e.state === A.Closed ? null : /* @__PURE__ */ r($e, { ...e }), St = ({
+}, Lt = (e) => e.state === P.Closed ? null : /* @__PURE__ */ s(Ve, { ...e }), z = "statgpt-dropdown-open", L = 8, qe = {
+  name: "keepDropdownWithinViewport",
+  fn({ y: e, rects: t }) {
+    if (typeof window > "u")
+      return {};
+    const n = document.documentElement.clientHeight || window.innerHeight, r = Math.min(
+      t.floating.height,
+      Math.max(0, n - L * 2)
+    ), a = L, l = n - r - L;
+    return {
+      y: Math.min(Math.max(e, a), Math.max(a, l))
+    };
+  }
+}, Rt = ({
   triggerButton: e,
   options: t,
   content: n,
-  selectedOption: s,
-  disabled: l,
-  containerClassName: a,
+  selectedOption: r,
+  disabled: a,
+  containerClassName: l,
   openedClassName: d,
-  onOptionSelect: u
+  onOptionSelect: m
 }) => {
-  const [h, m] = j(!1), { refs: p, floatingStyles: g, context: C } = X({
-    open: h,
-    onOpenChange: l ? void 0 : m,
+  const h = me(), [u, f] = Y(!1), { refs: x, floatingStyles: C, context: N } = J({
+    open: u,
+    onOpenChange: a ? void 0 : f,
     placement: "bottom-end",
-    middleware: [ye(8), we(), Ee()],
-    whileElementsMounted: ve
-  }), b = Se(C), N = Z(C, { outsidePress: !0 }), { getReferenceProps: x, getFloatingProps: c } = J([
-    b,
-    N
+    strategy: "fixed",
+    middleware: [
+      Se(L),
+      Ie({ padding: L }),
+      ke({
+        padding: L,
+        apply({ availableHeight: g, elements: w }) {
+          w.floating.style.maxHeight = `${Math.max(
+            0,
+            g
+          )}px`;
+        }
+      }),
+      De({ padding: L }),
+      qe
+    ],
+    whileElementsMounted: Ee
+  }), v = Le(N), b = ee(N, { outsidePress: !0 }), { getReferenceProps: o, getFloatingProps: i } = te([
+    v,
+    b
   ]);
-  return /* @__PURE__ */ o(H, { children: [
-    /* @__PURE__ */ r(
+  return R(() => {
+    u && window.dispatchEvent(
+      new CustomEvent(z, { detail: h })
+    );
+  }, [h, u]), R(() => {
+    const g = (w) => {
+      w instanceof CustomEvent && w.detail !== h && f(!1);
+    };
+    return window.addEventListener(z, g), () => {
+      window.removeEventListener(z, g);
+    };
+  }, [h]), R(() => {
+    a && f(!1);
+  }, [a]), /* @__PURE__ */ c(U, { children: [
+    /* @__PURE__ */ s(
       "div",
       {
-        ref: p.setReference,
-        ...x({
-          onClick(i) {
-            i.stopPropagation();
+        ref: x.setReference,
+        ...o({
+          onClick(g) {
+            g.stopPropagation();
           }
         }),
-        className: f(a, h && d),
+        className: p(l, u && d),
         children: e
       }
     ),
-    h && /* @__PURE__ */ o(
+    u && /* @__PURE__ */ c(
       "div",
       {
-        ref: p.setFloating,
-        style: g,
+        ref: x.setFloating,
+        style: { ...C, overflowY: "auto" },
         className: "dropdown-menu-shadow dropdown-container z-10 flex flex-col rounded bg-white",
-        ...c(),
+        ...i(),
         children: [
           n && n,
-          t && t.map((i) => /* @__PURE__ */ r(
+          t && t.map((g) => /* @__PURE__ */ s(
             "div",
             {
-              onClick: (v) => {
-                v.stopPropagation(), u?.(i.key), m(!1);
+              onClick: (w) => {
+                w.stopPropagation(), m?.(g.key), f(!1);
               },
-              className: f(
+              className: p(
                 "text-neutrals-900 body-3 cursor-pointer dropdown-item min-w-[200px]",
-                s === i.key && "bg-hues-100"
+                r === g.key && "bg-hues-100"
               ),
-              children: /* @__PURE__ */ o(
+              children: /* @__PURE__ */ c(
                 "div",
                 {
                   className: "dropdown-item-text flex h-full items-center gap-x-2 p-2 hover:bg-hues-100",
-                  title: i.title,
+                  title: g.title,
                   children: [
-                    i.icon ? i.icon : null,
-                    /* @__PURE__ */ r("p", { children: i?.title })
+                    g.icon ? g.icon : null,
+                    /* @__PURE__ */ s("p", { children: g?.title })
                   ]
                 }
               )
             },
-            i.key
+            g.key
           ))
         ]
       }
     )
   ] });
-}, It = ({ limitMessages: e, query: t }) => /* @__PURE__ */ o("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__ */ o("div", { className: "flex gap-x-[4px]", children: [
-    /* @__PURE__ */ o("span", { className: "h5 text-primary", children: [
+}, Ot = ({ limitMessages: e, query: t }) => /* @__PURE__ */ c("div", { className: "flex flex-wrap items-center justify-between bg-hues-100 px-2 py-1", children: [
+  /* @__PURE__ */ s("div", { className: "flex gap-x-[4px]", children: /* @__PURE__ */ s("div", { className: "flex flex-col", children: /* @__PURE__ */ c("div", { className: "flex gap-x-[4px]", children: [
+    /* @__PURE__ */ c("span", { className: "h5 text-primary", children: [
       e?.excelFormatTitle,
       " "
     ] }),
-    /* @__PURE__ */ r("span", { className: "body-3 text-neutrals-800", children: e?.excelFormatText })
+    /* @__PURE__ */ s("span", { className: "body-3 text-neutrals-800", children: e?.excelFormatText })
   ] }) }) }),
-  /* @__PURE__ */ r("a", { href: t, target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ o("span", { className: "body-3 flex cursor-pointer items-center gap-x-[4px]", children: [
+  /* @__PURE__ */ s("a", { href: t, target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ c("span", { className: "body-3 flex cursor-pointer items-center gap-x-[4px]", children: [
     e?.dataExplorerIcon,
     e?.dataExplorer
   ] }) })
-] }), kt = ({
+] }), Ft = ({
   limitMessages: e,
   isDownload: t,
   showAdvancedViewButton: n,
-  onAdvancedViewClick: s,
-  query: l
-}) => /* @__PURE__ */ o(
+  onAdvancedViewClick: r,
+  query: a
+}) => /* @__PURE__ */ c(
   "div",
   {
-    className: f(
+    className: p(
       "bg-semantic-warning-light px-2 py-1 flex justify-between flex-wrap items-center",
       e?.containerClassName
     ),
     children: [
-      /* @__PURE__ */ o("div", { className: "flex items-center gap-x-2", children: [
-        /* @__PURE__ */ r("span", { children: e?.warningIcon }),
-        /* @__PURE__ */ o("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ o("div", { className: "flex gap-x-[4px]", children: [
-            /* @__PURE__ */ o(
+      /* @__PURE__ */ c("div", { className: "flex items-center gap-x-2", children: [
+        /* @__PURE__ */ s("span", { children: e?.warningIcon }),
+        /* @__PURE__ */ c("div", { className: "flex flex-col gap-1", children: [
+          /* @__PURE__ */ c("div", { className: "flex gap-x-[4px]", children: [
+            /* @__PURE__ */ c(
               "span",
               {
-                className: f(
+                className: p(
                   "text-primary h5",
                   e?.largeQueryClassName
                 ),
@@ -693,10 +734,10 @@ const $e = ({
                 ]
               }
             ),
-            /* @__PURE__ */ r(
+            /* @__PURE__ */ s(
               "span",
               {
-                className: f(
+                className: p(
                   "text-neutrals-800 body-3",
                   e?.limitMessageClassName
                 ),
@@ -704,10 +745,10 @@ const $e = ({
               }
             )
           ] }),
-          t && /* @__PURE__ */ r(
+          t && /* @__PURE__ */ s(
             "span",
             {
-              className: f(
+              className: p(
                 "text-neutrals-800 body-3",
                 e?.limitMessageClassName
               ),
@@ -716,10 +757,10 @@ const $e = ({
           )
         ] })
       ] }),
-      n && /* @__PURE__ */ o(
+      n && /* @__PURE__ */ c(
         "span",
         {
-          onClick: () => s?.(),
+          onClick: () => r?.(),
           className: "h4 flex cursor-pointer items-center gap-x-[4px] text-primary",
           children: [
             e?.editIcon,
@@ -727,118 +768,118 @@ const $e = ({
           ]
         }
       ),
-      t && /* @__PURE__ */ r("a", { href: l || "", target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ o("span", { className: "body-3 flex cursor-pointer items-center gap-x-[4px]", children: [
+      t && /* @__PURE__ */ s("a", { href: a || "", target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ c("span", { className: "body-3 flex cursor-pointer items-center gap-x-[4px]", children: [
         e?.dataExplorerIcon,
         e?.dataExplorer
       ] }) })
     ]
   }
-), re = U(null);
-function Dt({
+), ae = Q(null);
+function _t({
   value: e,
   children: t
 }) {
-  const n = W(() => e ?? {}, [e]);
-  return /* @__PURE__ */ r(re.Provider, { value: n, children: t });
+  const n = V(() => e ?? {}, [e]);
+  return /* @__PURE__ */ s(ae.Provider, { value: n, children: t });
 }
-function Be() {
-  return V(re);
+function Ue() {
+  return K(ae);
 }
-var _ = /* @__PURE__ */ ((e) => (e.Info = "info", e.Error = "error", e.Warning = "warning", e.Note = "note", e))(_ || {});
-const We = {
-  [_.Info]: "border-neutrals-800 bg-neutrals-300 text-neutrals-1000",
-  [_.Error]: "border-semantic-error bg-semantic-error-light text-neutrals-1000",
-  [_.Warning]: "border-semantic-warning bg-semantic-warning-light text-neutrals-1000",
-  [_.Note]: "border-hues-900 bg-neutrals-200 text-neutrals-1000"
-}, qe = "shrink-0", He = "min-w-0 body-2", Ue = "flex items-start gap-2 min-w-0 border-l-2 rounded py-2 px-4 items-center";
-function Rt({
+var M = /* @__PURE__ */ ((e) => (e.Info = "info", e.Error = "error", e.Warning = "warning", e.Note = "note", e))(M || {});
+const Qe = {
+  [M.Info]: "border-neutrals-800 bg-neutrals-300 text-neutrals-1000",
+  [M.Error]: "border-semantic-error bg-semantic-error-light text-neutrals-1000",
+  [M.Warning]: "border-semantic-warning bg-semantic-warning-light text-neutrals-1000",
+  [M.Note]: "border-hues-900 bg-neutrals-200 text-neutrals-1000"
+}, Ke = "shrink-0", Xe = "min-w-0 body-2", Ze = "flex items-start gap-2 min-w-0 border-l-2 rounded py-2 px-4 items-center";
+function At({
   type: e,
   icon: t,
   children: n,
-  className: s,
-  contentClassName: l
+  className: r,
+  contentClassName: a
 }) {
-  const a = Be(), d = t ?? a?.icons?.[e], u = a?.classes?.container ?? Ue, h = a?.classes?.types?.[e] ?? We[e], m = R(u, h, s), p = R(qe, a?.classes?.icon), g = R(
-    He,
-    a?.classes?.content,
-    l
+  const l = Ue(), d = t ?? l?.icons?.[e], m = l?.classes?.container ?? Ze, h = l?.classes?.types?.[e] ?? Qe[e], u = O(m, h, r), f = O(Ke, l?.classes?.icon), x = O(
+    Xe,
+    l?.classes?.content,
+    a
   );
-  return /* @__PURE__ */ o("div", { "data-type": e, className: m, children: [
-    d ? /* @__PURE__ */ r("span", { className: p, children: d }) : null,
-    n ? /* @__PURE__ */ r("div", { className: g, children: n }) : null
+  return /* @__PURE__ */ c("div", { "data-type": e, className: u, children: [
+    d ? /* @__PURE__ */ s("span", { className: f, children: d }) : null,
+    n ? /* @__PURE__ */ s("div", { className: x, children: n }) : null
   ] });
 }
-const Lt = ({
+const Mt = ({
   title: e,
   copiedTitle: t,
   tooltip: n,
-  icon: s,
-  copiedIcon: l,
-  className: a,
+  icon: r,
+  copiedIcon: a,
+  className: l,
   buttonTextClassName: d,
-  onClick: u
+  onClick: m
 }) => {
-  const [h, m] = j(!1), p = B(null), g = () => {
-    u(), m(!0), p.current && clearTimeout(p.current), p.current = setTimeout(() => {
-      m(!1);
+  const [h, u] = Y(!1), f = W(null), x = () => {
+    m(), u(!0), f.current && clearTimeout(f.current), f.current = setTimeout(() => {
+      u(!1);
     }, 1e3);
   };
-  return M(() => () => {
-    p.current && clearTimeout(p.current);
-  }, []), /* @__PURE__ */ o("div", { className: "relative w-fit", children: [
-    /* @__PURE__ */ r(
-      je,
+  return R(() => () => {
+    f.current && clearTimeout(f.current);
+  }, []), /* @__PURE__ */ c("div", { className: "relative w-fit", children: [
+    /* @__PURE__ */ s(
+      He,
       {
         title: h ? t : e,
         isSmallButton: !0,
         disabled: h,
-        buttonClassName: R([
+        buttonClassName: O([
           "text-button-tertiary small-icon-button !h-6 !p-0",
-          a
+          l
         ]),
-        textClassName: R(["ml-1", d]),
-        onClick: g,
-        iconBefore: h ? l : s
+        textClassName: O(["ml-1", d]),
+        onClick: x,
+        iconBefore: h ? a : r
       }
     ),
-    n && h && /* @__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 && h && /* @__PURE__ */ s("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 Ve({
+function Je({
   id: e,
   label: t,
   hasChildren: n,
-  showDragHandle: s,
-  showCheckbox: l,
-  isChecked: a,
+  showDragHandle: r,
+  showCheckbox: a,
+  isChecked: l,
   isExpanded: d
 }) {
-  return /* @__PURE__ */ o("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__ */ o("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(Q, { size: 16 }) }) }) : null,
-      /* @__PURE__ */ o("div", { className: "flex min-w-0 flex-1 items-center gap-2 p-1", children: [
-        l ? /* @__PURE__ */ r(ne, { id: e, checked: !!a, className: "p-0" }) : null,
-        /* @__PURE__ */ r("span", { className: "body-3 truncate", children: t })
+  return /* @__PURE__ */ c("div", { className: "relative cursor-grabbing rounded bg-neutrals-200 shadow", children: [
+    /* @__PURE__ */ s("div", { className: "absolute -left-[0.5px] top-0.5 h-5 w-0.5 rounded-full bg-gradients-light" }),
+    /* @__PURE__ */ c("div", { className: "flex items-stretch overflow-hidden rounded", children: [
+      r ? /* @__PURE__ */ s("div", { className: "flex w-6 items-center justify-center", children: /* @__PURE__ */ s("span", { "aria-hidden": !0, className: "rounded p-1", children: /* @__PURE__ */ s(X, { size: 16 }) }) }) : null,
+      /* @__PURE__ */ c("div", { className: "flex min-w-0 flex-1 items-center gap-2 p-1", children: [
+        a ? /* @__PURE__ */ s(se, { id: e, checked: !!l, className: "p-0" }) : null,
+        /* @__PURE__ */ s("span", { className: "body-3 truncate", children: t })
       ] }),
-      n ? /* @__PURE__ */ r("div", { className: "flex w-8 items-center justify-center", children: /* @__PURE__ */ r(
+      n ? /* @__PURE__ */ s("div", { className: "flex w-8 items-center justify-center", children: /* @__PURE__ */ s(
         "span",
         {
           "aria-hidden": !0,
-          className: f(
+          className: p(
             "transition-transform",
             d ? "rotate-90" : "rotate-0"
           ),
-          children: /* @__PURE__ */ r(K, { size: 16 })
+          children: /* @__PURE__ */ s(Z, { size: 16 })
         }
       ) }) : null
     ] })
   ] });
 }
-function se(e, t) {
+function le(e, t) {
   return `i:${[...e, t].join("/")}`;
 }
-function G(e) {
+function H(e) {
   if (!e.startsWith("i:")) return null;
   const n = e.slice(2).split("/").filter(Boolean);
   return n.length ? {
@@ -846,85 +887,85 @@ function G(e) {
     itemId: n[n.length - 1]
   } : null;
 }
-function Qe(e, t, n) {
-  const s = ae(e, t);
-  return s ? s.find((l) => l.id === n) ?? null : null;
+function et(e, t, n) {
+  const r = oe(e, t);
+  return r ? r.find((a) => a.id === n) ?? null : null;
 }
-function le(e, t) {
+function ie(e, t) {
   if (t.length === 0) return e;
-  const [n, ...s] = t, l = e.find((a) => a.id === n);
-  return l?.items ? le(l.items, s) : null;
+  const [n, ...r] = t, a = e.find((l) => l.id === n);
+  return a?.items ? ie(a.items, r) : null;
 }
-function ae(e, t) {
-  const n = le(e, t);
+function oe(e, t) {
+  const n = ie(e, t);
   return n ? n.filter(
-    (s) => s.type === "item"
+    (r) => r.type === "item"
   ) : null;
 }
-function ie(e, t, n) {
+function ce(e, t, n) {
   if (t.length === 0)
     return n(e);
-  const [s, ...l] = t;
-  return e.map((a) => a.id !== s || !a.items ? a : {
-    ...a,
-    items: ie(a.items, l, n)
+  const [r, ...a] = t;
+  return e.map((l) => l.id !== r || !l.items ? l : {
+    ...l,
+    items: ce(l.items, a, n)
   });
 }
-function Ke({
+function tt({
   parentPath: e,
   item: t,
   showDragHandle: n,
-  showCheckbox: s,
-  renderLabel: l,
-  onItemClick: a,
+  showCheckbox: r,
+  renderLabel: a,
+  onItemClick: l,
   onToggleExpanded: d,
-  onToggleChecked: u
+  onToggleChecked: m
 }) {
-  const h = !!t.items?.length, m = !!t.isExpanded, p = t.isDisabled ? !1 : t.draggable ?? !0, g = t.isDisabled ? !1 : t.checkable ?? !0, C = se(e, t.id), {
-    attributes: b,
-    listeners: N,
-    setNodeRef: x,
-    setActivatorNodeRef: c,
+  const h = !!t.items?.length, u = !!t.isExpanded, f = t.isDisabled ? !1 : t.draggable ?? !0, x = t.isDisabled ? !1 : t.checkable ?? !0, C = le(e, t.id), {
+    attributes: N,
+    listeners: v,
+    setNodeRef: b,
+    setActivatorNodeRef: o,
     transform: i,
-    transition: v,
-    isDragging: k
-  } = Oe({ id: C, disabled: !p }), S = {
-    transform: Te.Transform.toString(i),
-    transition: v,
-    opacity: k ? 0.6 : void 0
-  }, y = !!t.isDisabled, w = y || !g, D = [...e, t.id];
-  return /* @__PURE__ */ o(
+    transition: g,
+    isDragging: w
+  } = Pe({ id: C, disabled: !f }), I = {
+    transform: Ge.Transform.toString(i),
+    transition: g,
+    opacity: w ? 0.6 : void 0
+  }, y = !!t.isDisabled, E = y || !x, D = [...e, t.id];
+  return /* @__PURE__ */ c(
     "div",
     {
-      ref: x,
-      style: S,
-      className: f([
+      ref: b,
+      style: I,
+      className: p([
         "group flex items-stretch overflow-hidden rounded bg-white",
         "select-none",
         y ? "opacity-50" : ""
       ]),
       children: [
-        n ? /* @__PURE__ */ r(
+        n ? /* @__PURE__ */ s(
           "div",
           {
-            className: f([
+            className: p([
               "group/drag-handle flex w-6 items-center justify-center rounded",
               y ? "" : "hover:bg-neutrals-100 cursor-grab"
             ]),
-            children: /* @__PURE__ */ r(
+            children: /* @__PURE__ */ s(
               "span",
               {
-                ref: c,
+                ref: o,
                 "aria-hidden": !0,
-                className: f([
+                className: p([
                   "rounded p-1",
-                  p ? "cursor-grab" : "cursor-default",
+                  f ? "cursor-grab" : "cursor-default",
                   "transition-opacity"
                 ]),
-                ...p ? N : {},
-                ...p ? b : {},
-                children: /* @__PURE__ */ r(
-                  Q,
+                ...f ? v : {},
+                ...f ? N : {},
+                children: /* @__PURE__ */ s(
+                  X,
                   {
                     size: 16,
                     className: "text-neutrals-800 group-hover/drag-handle:text-primary"
@@ -934,72 +975,72 @@ function Ke({
             )
           }
         ) : null,
-        /* @__PURE__ */ o(
+        /* @__PURE__ */ c(
           "button",
           {
             type: "button",
             disabled: y,
-            "aria-disabled": w,
-            onClick: (I) => {
-              w || a?.({
+            "aria-disabled": E,
+            onClick: (k) => {
+              E || l?.({
                 itemId: t.id,
                 path: D,
-                nativeEvent: I
+                nativeEvent: k
               });
             },
-            className: f([
+            className: p([
               "flex min-w-0 flex-1 items-center gap-2 p-1 text-left rounded",
               y ? "" : "hover:bg-neutrals-100",
               y ? "" : "hover:text-blue-700",
               "focus:outline-none"
             ]),
             children: [
-              s ? /* @__PURE__ */ r(
-                ne,
+              r ? /* @__PURE__ */ s(
+                se,
                 {
                   id: `draggable-list-${D.join("-")}`,
                   checked: !!t.isChecked,
-                  disabled: !g,
+                  disabled: !x,
                   className: "p-0",
                   stopPropagation: !0,
-                  onChange: (I, E) => u?.({
+                  onChange: (k, S) => m?.({
                     itemId: t.id,
                     path: D,
-                    nextChecked: !!E
+                    nextChecked: !!S
                   })
                 }
               ) : null,
-              /* @__PURE__ */ r("span", { className: "body-3 truncate text-neutrals-800", children: l ? l(t) : t.label })
+              /* @__PURE__ */ s("span", { className: "body-3 truncate text-neutrals-800", children: a ? a(t) : t.label })
             ]
           }
         ),
-        h ? /* @__PURE__ */ r(
+        h ? /* @__PURE__ */ s(
           "button",
           {
             type: "button",
             disabled: y,
-            onClick: (I) => {
-              I.stopPropagation(), d?.({
+            onClick: (k) => {
+              k.stopPropagation(), d?.({
                 itemId: t.id,
                 path: D,
-                nextExpanded: !m
+                nextExpanded: !u
               });
             },
-            "aria-label": m ? "Collapse" : "Expand",
-            className: f([
+            "aria-label": u ? "Collapse" : "Expand",
+            className: p([
               "flex w-8 items-center justify-center rounded",
               y ? "" : "hover:bg-neutrals-100",
               "focus:outline-none"
             ]),
-            children: /* @__PURE__ */ r(
+            children: /* @__PURE__ */ s(
               "span",
               {
                 "aria-hidden": !0,
-                className: f(
+                className: p(
                   "transition-transform duration-150 ease-out",
-                  m ? "rotate-90" : "rotate-0"
+                  u ? "rotate-90" : "rotate-0"
                 ),
-                children: /* @__PURE__ */ r(K, { size: 16 })
+                children: /* @__PURE__ */ s(Z, { size: 16 })
               }
             )
           }
@@ -1008,188 +1049,188 @@ function Ke({
     }
   );
 }
-function Ft({
+function Pt({
   items: e,
   showDragHandle: t = !0,
   showCheckbox: n = !0,
-  onItemsChange: s,
-  onToggleExpanded: l,
-  onToggleChecked: a,
+  onItemsChange: r,
+  onToggleExpanded: a,
+  onToggleChecked: l,
   onItemClick: d,
-  renderLabel: u
+  renderLabel: m
 }) {
-  const h = Ie(
-    ke(De, { activationConstraint: { distance: 6 } })
-  ), [m, p] = oe.useState(null), g = (N) => {
-    const x = String(N.active.id), c = G(x);
-    if (!c) return;
-    const i = Qe(e, c.parentPath, c.itemId);
-    !i || i.type !== "item" || p({
-      id: x,
+  const h = Re(
+    Oe(Fe, { activationConstraint: { distance: 6 } })
+  ), [u, f] = ue.useState(null), x = (v) => {
+    const b = String(v.active.id), o = H(b);
+    if (!o) return;
+    const i = et(e, o.parentPath, o.itemId);
+    !i || i.type !== "item" || f({
+      id: b,
       label: i.label,
       hasChildren: !!i.items?.length,
       isChecked: i.isChecked,
       isExpanded: i.isExpanded
     });
-  }, C = (N) => {
-    p(null);
-    const x = N.over;
-    if (!x) return;
-    const c = G(String(N.active.id)), i = G(String(x.id));
-    if (!c || !i || c.parentPath.join("/") !== i.parentPath.join("/")) return;
-    const v = ae(e, c.parentPath);
-    if (!v) return;
-    const k = v.findIndex((w) => w.id === c.itemId), S = v.findIndex((w) => w.id === i.itemId);
-    if (k === -1 || S === -1 || k === S) return;
-    const y = ie(e, c.parentPath, (w) => {
-      const D = w.filter(
-        (L) => L.type === "item"
-      ), I = Pe(D, k, S);
-      let E = 0;
-      return w.map((L) => {
-        if (L.type !== "item") return L;
-        const Y = I[E];
-        return E += 1, Y;
+  }, C = (v) => {
+    f(null);
+    const b = v.over;
+    if (!b) return;
+    const o = H(String(v.active.id)), i = H(String(b.id));
+    if (!o || !i || o.parentPath.join("/") !== i.parentPath.join("/")) return;
+    const g = oe(e, o.parentPath);
+    if (!g) return;
+    const w = g.findIndex((E) => E.id === o.itemId), I = g.findIndex((E) => E.id === i.itemId);
+    if (w === -1 || I === -1 || w === I) return;
+    const y = ce(e, o.parentPath, (E) => {
+      const D = E.filter(
+        (F) => F.type === "item"
+      ), k = Ye(D, w, I);
+      let S = 0;
+      return E.map((F) => {
+        if (F.type !== "item") return F;
+        const G = k[S];
+        return S += 1, G;
       });
     });
-    s(y);
-  }, b = (N, x = []) => {
-    const c = N.filter((i) => i.type === "item").map((i) => se(x, i.id));
-    return /* @__PURE__ */ r(
-      _e,
+    r(y);
+  }, N = (v, b = []) => {
+    const o = v.filter((i) => i.type === "item").map((i) => le(b, i.id));
+    return /* @__PURE__ */ s(
+      Te,
       {
-        items: c,
-        strategy: Ae,
-        children: /* @__PURE__ */ r("ul", { className: "m-0 flex list-none flex-col gap-2 p-0", children: N.map((i) => i.type === "group" ? /* @__PURE__ */ o(
+        items: o,
+        strategy: je,
+        children: /* @__PURE__ */ s("ul", { className: "m-0 flex list-none flex-col gap-2 p-0", children: v.map((i) => i.type === "group" ? /* @__PURE__ */ c(
           "li",
           {
             className: "m-0 mt-2 flex flex-col gap-2 p-0 first:mt-0",
             children: [
-              /* @__PURE__ */ o("div", { className: "h5 flex items-center gap-2 py-1 text-neutrals-1000", children: [
-                /* @__PURE__ */ r(fe, { size: 12, className: "shrink-0" }),
+              /* @__PURE__ */ c("div", { className: "h5 flex items-center gap-2 py-1 text-neutrals-1000", children: [
+                /* @__PURE__ */ s(xe, { size: 12, className: "shrink-0" }),
                 i.label
               ] }),
-              /* @__PURE__ */ r("div", { className: "border-l border-neutrals-600 pl-2", children: b(i.items, [...x, i.id]) })
+              /* @__PURE__ */ s("div", { className: "border-l border-neutrals-600 pl-2", children: N(i.items, [...b, i.id]) })
             ]
           },
           i.id
-        ) : /* @__PURE__ */ o("li", { className: "m-0 flex flex-col gap-2 p-0", children: [
-          /* @__PURE__ */ r(
-            Ke,
+        ) : /* @__PURE__ */ c("li", { className: "m-0 flex flex-col gap-2 p-0", children: [
+          /* @__PURE__ */ s(
+            tt,
             {
-              parentPath: x,
+              parentPath: b,
               item: i,
               showDragHandle: t,
               showCheckbox: n,
-              renderLabel: u,
+              renderLabel: m,
               onItemClick: d,
-              onToggleExpanded: l,
-              onToggleChecked: a
+              onToggleExpanded: a,
+              onToggleChecked: l
             }
           ),
-          i.items?.length && i.isExpanded ? /* @__PURE__ */ r("div", { className: "pl-7", children: b(i.items, [...x, i.id]) }) : null
+          i.items?.length && i.isExpanded ? /* @__PURE__ */ s("div", { className: "pl-7", children: N(i.items, [...b, i.id]) }) : null
         ] }, i.id)) })
       }
     );
   };
-  return /* @__PURE__ */ o(
-    Re,
+  return /* @__PURE__ */ c(
+    _e,
     {
       sensors: h,
-      collisionDetection: Le,
-      onDragStart: g,
+      collisionDetection: Ae,
+      onDragStart: x,
       onDragEnd: C,
       children: [
-        /* @__PURE__ */ r("div", { className: "flex flex-col", children: b(e) }),
-        /* @__PURE__ */ r(Fe, { children: m ? /* @__PURE__ */ r(
-          Ve,
+        /* @__PURE__ */ s("div", { className: "flex flex-col", children: N(e) }),
+        /* @__PURE__ */ s(Me, { children: u ? /* @__PURE__ */ s(
+          Je,
           {
-            id: m.id,
-            label: m.label,
-            hasChildren: m.hasChildren,
+            id: u.id,
+            label: u.label,
+            hasChildren: u.hasChildren,
             showDragHandle: t,
             showCheckbox: n,
-            isChecked: m.isChecked,
-            isExpanded: m.isExpanded
+            isChecked: u.isChecked,
+            isExpanded: u.isExpanded
           }
         ) : null })
       ]
     }
   );
 }
-const Xe = (e, t) => e.label.toLowerCase().includes(t);
-function Ot(e, t, n = {}) {
-  const s = Je(t);
-  if (!s)
+const nt = (e, t) => e.label.toLowerCase().includes(t);
+function Tt(e, t, n = {}) {
+  const r = st(t);
+  if (!r)
     return e;
   const {
-    expandMatchedBranches: l = !0,
-    includeGroupDescendantsOnMatch: a = !0,
+    expandMatchedBranches: a = !0,
+    includeGroupDescendantsOnMatch: l = !0,
     includeItemDescendantsOnMatch: d = !1,
-    match: u = Xe
+    match: m = nt
   } = n;
-  return $(e, s, {
-    expandMatchedBranches: l,
-    includeGroupDescendantsOnMatch: a,
+  return B(e, r, {
+    expandMatchedBranches: a,
+    includeGroupDescendantsOnMatch: l,
     includeItemDescendantsOnMatch: d,
-    match: u
+    match: m
   }) ?? [];
 }
-function $(e, t, n) {
-  const s = [];
-  for (const l of e) {
-    const a = Ze(l, t, n);
-    a && s.push(a);
+function B(e, t, n) {
+  const r = [];
+  for (const a of e) {
+    const l = rt(a, t, n);
+    l && r.push(l);
   }
-  return s.length ? s : null;
+  return r.length ? r : null;
 }
-function Ze(e, t, n) {
-  const s = n.match(e, t);
+function rt(e, t, n) {
+  const r = n.match(e, t);
   if (e.type === "group") {
-    if (s && n.includeGroupDescendantsOnMatch)
-      return T(e, n.expandMatchedBranches);
-    const d = e.items?.length ? $(e.items, t, n) : null;
-    return !s && !d ? null : {
+    if (r && n.includeGroupDescendantsOnMatch)
+      return j(e, n.expandMatchedBranches);
+    const d = e.items?.length ? B(e.items, t, n) : null;
+    return !r && !d ? null : {
       ...e,
       items: d ?? []
     };
   }
-  const l = e.items?.length ? $(e.items, t, n) : null;
-  if (s && n.includeItemDescendantsOnMatch)
-    return T(e, n.expandMatchedBranches);
-  if (!s && !l)
+  const a = e.items?.length ? B(e.items, t, n) : null;
+  if (r && n.includeItemDescendantsOnMatch)
+    return j(e, n.expandMatchedBranches);
+  if (!r && !a)
     return null;
-  const a = {
+  const l = {
     ...e
   };
-  return l ? (a.items = l, n.expandMatchedBranches && (a.isExpanded = !0)) : delete a.items, a;
+  return a ? (l.items = a, n.expandMatchedBranches && (l.isExpanded = !0)) : delete l.items, l;
 }
-function T(e, t) {
+function j(e, t) {
   return e.type === "group" ? {
     ...e,
     items: e.items.map(
-      (n) => T(n, t)
+      (n) => j(n, t)
     )
   } : {
     ...e,
     isExpanded: t && e.items?.length ? !0 : e.isExpanded,
-    items: e.items?.map((n) => T(n, t))
+    items: e.items?.map((n) => j(n, t))
   };
 }
-function Je(e) {
+function st(e) {
   return e.trim().toLowerCase();
 }
-var et = /* @__PURE__ */ ((e) => (e.Enter = "Enter", e))(et || {});
-const ce = U(null);
-function _t({
+var at = /* @__PURE__ */ ((e) => (e.Enter = "Enter", e))(at || {});
+const de = Q(null);
+function jt({
   children: e,
   isAgentAvailable: t
 }) {
-  const n = W(() => ({ isAgentAvailable: t }), [t]);
-  return /* @__PURE__ */ r(ce.Provider, { value: n, children: e });
+  const n = V(() => ({ isAgentAvailable: t }), [t]);
+  return /* @__PURE__ */ s(de.Provider, { value: n, children: e });
 }
-function At() {
-  const e = V(ce);
+function Yt() {
+  const e = K(de);
   if (!e)
     throw new Error(
       "useAgentAvailability must be used within AgentAvailabilityProvider"
@@ -1197,40 +1238,40 @@ function At() {
   return e;
 }
 export {
-  _t as AgentAvailabilityProvider,
-  mt as Alert,
-  F as AlertType,
-  je as Button,
-  Ge as CALENDAR_MOBILE_PADDING,
-  gt as Calendar,
-  ne as Checkbox,
-  te as CloseButton,
-  xt as CollapsibleBlock,
-  Lt as CopyButton,
-  It as DownloadFormatMessage,
-  Ft as DraggableList,
-  St as Dropdown,
-  bt as HighlightText,
-  Nt as IconButton,
-  Rt as InlineAlert,
-  Dt as InlineAlertProvider,
-  _ as InlineAlertType,
-  ze as Input,
-  Ct as InputWithIcon,
-  et as KeyboardKey,
-  vt as Link,
-  ee as Loader,
-  z as PopUpSize,
-  A as PopUpState,
-  Et as Popup,
-  wt as Radio,
-  kt as RequestLimitMessage,
+  jt as AgentAvailabilityProvider,
+  xt as Alert,
+  _ as AlertType,
+  He as Button,
+  Be as CALENDAR_MOBILE_PADDING,
+  vt as Calendar,
+  se as Checkbox,
+  re as CloseButton,
+  yt as CollapsibleBlock,
+  Mt as CopyButton,
+  Ot as DownloadFormatMessage,
+  Pt as DraggableList,
+  Rt as Dropdown,
+  Ct as HighlightText,
+  Et as IconButton,
+  At as InlineAlert,
+  _t as InlineAlertProvider,
+  M as InlineAlertType,
+  We as Input,
+  St as InputWithIcon,
+  at as KeyboardKey,
+  It as Link,
+  ne as Loader,
+  $ as PopUpSize,
+  P as PopUpState,
+  Lt as Popup,
+  Dt as Radio,
+  Ft as RequestLimitMessage,
   q as SERIES_LIMIT,
-  ft as TREE_NODE_ARROW_SIZE,
-  pt as TREE_NODE_PADDING,
-  yt as Tag,
-  Ot as filterDraggableListNodes,
-  At as useAgentAvailability,
-  ht as useDebounce,
-  Ye as useIsMobile
+  Nt as TREE_NODE_ARROW_SIZE,
+  wt as TREE_NODE_PADDING,
+  kt as Tag,
+  Tt as filterDraggableListNodes,
+  Yt as useAgentAvailability,
+  bt as useDebounce,
+  $e as useIsMobile
 };