@epam/statgpt-ui-components 0.2.0-rc.0 → 0.2.0-rc.2

package/index.mjs

@@ -1,435 +1,435 @@
-import { jsx as c, jsxs as u, Fragment as P } from "react/jsx-runtime";
-import { useEffect as O, useRef as L, useCallback as R, useState as _, useMemo as U } from "react";
-import m from "classnames";
-import { IconX as V, IconCalendarEvent as z, IconChevronDown as Q } from "@tabler/icons-react";
-import X from "react-flatpickr";
-import { CalendarResolution as F } from "@epam/statgpt-shared-toolkit";
-import { useFloating as Y, useRole as Z, useDismiss as j, useInteractions as G, FloatingPortal as B, FloatingOverlay as J, FloatingFocusManager as K, autoUpdate as D, offset as ee, flip as ne, shift as re, useClick as te } from "@floating-ui/react";
-const A = () => /* @__PURE__ */ c("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ c("div", { className: "loader" }) }), H = ({
-  title: e,
-  btnClassNames: r,
-  iconWidth: t,
-  iconHeight: n,
-  onClick: s
-}) => /* @__PURE__ */ c(
+import { jsx as t, jsxs as l, Fragment as Y } from "react/jsx-runtime";
+import { useEffect as k, useRef as j, useCallback as C, useState as P, useMemo as z } from "react";
+import h from "classnames";
+import { IconX as X, IconCalendarEvent as Z, IconChevronDown as B } from "@tabler/icons-react";
+import J from "react-flatpickr";
+import { CalendarResolution as S } from "@epam/statgpt-shared-toolkit";
+import { useFloating as I, useRole as K, useDismiss as G, useInteractions as H, FloatingPortal as V, FloatingOverlay as D, FloatingFocusManager as M, autoUpdate as nn, offset as en, flip as rn, shift as cn, useClick as tn } from "@floating-ui/react";
+const q = () => /* @__PURE__ */ t("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ t("div", { className: "loader" }) }), T = ({
+  title: n,
+  btnClassNames: e,
+  iconWidth: c,
+  iconHeight: r,
+  onClick: o
+}) => /* @__PURE__ */ t(
   "button",
   {
     type: "button",
     "aria-label": "button",
-    className: r,
-    title: e,
-    onClick: s,
-    children: /* @__PURE__ */ c(V, { height: n || 20, width: t || 20 })
+    className: e,
+    title: n,
+    onClick: o,
+    children: /* @__PURE__ */ t(X, { height: r || 20, width: c || 20 })
   }
 );
-var x = /* @__PURE__ */ ((e) => (e.ERROR = "error", e.SUCCESS = "success", e.IN_PROGRESS = "in_progress", e))(x || {});
-const fe = ({
-  alertDetails: e,
-  successIcon: r,
-  errorIcon: t,
-  onClose: n,
-  closeButtonTitle: s
+var E = /* @__PURE__ */ ((n) => (n.ERROR = "error", n.SUCCESS = "success", n.IN_PROGRESS = "in_progress", n))(E || {});
+const bn = ({
+  alertDetails: n,
+  successIcon: e,
+  errorIcon: c,
+  onClose: r,
+  closeButtonTitle: o
 }) => {
-  const o = () => (e == null ? void 0 : e.type) === x.IN_PROGRESS ? "alert-in-progress" : (e == null ? void 0 : e.type) === x.SUCCESS ? "alert-success" : "alert-error";
-  return O(() => {
-    (e == null ? void 0 : e.type) !== x.IN_PROGRESS && setTimeout(() => {
-      n == null || n();
+  const a = () => (n == null ? void 0 : n.type) === E.IN_PROGRESS ? "alert-in-progress" : (n == null ? void 0 : n.type) === E.SUCCESS ? "alert-success" : "alert-error";
+  return k(() => {
+    (n == null ? void 0 : n.type) !== E.IN_PROGRESS && setTimeout(() => {
+      r == null || r();
     }, 5e3);
-  }, [e == null ? void 0 : e.type, n]), /* @__PURE__ */ c(
+  }, [n == null ? void 0 : n.type, r]), /* @__PURE__ */ t(
     "div",
     {
-      className: m(
+      className: h(
         "alert alert-shadow fixed bottom-3 right-3 z-10",
-        o()
+        a()
       ),
-      children: /* @__PURE__ */ u("div", { className: "alert-content flex items-start", children: [
-        /* @__PURE__ */ c("div", { className: "alert-icon", children: (e == null ? void 0 : e.type) === x.IN_PROGRESS ? /* @__PURE__ */ c(A, {}) : (e == null ? void 0 : e.type) === x.SUCCESS ? r : t }),
-        /* @__PURE__ */ u("div", { className: "flex flex-col gap-2 max-w-[300px]", children: [
-          /* @__PURE__ */ c("h3", { className: "truncate", children: e == null ? void 0 : e.title }),
-          (e == null ? void 0 : e.text) && /* @__PURE__ */ c("div", { className: "alert-text truncate", title: e == null ? void 0 : e.text, children: e == null ? void 0 : e.text })
+      children: /* @__PURE__ */ l("div", { className: "alert-content flex items-start", children: [
+        /* @__PURE__ */ t("div", { className: "alert-icon", children: (n == null ? void 0 : n.type) === E.IN_PROGRESS ? /* @__PURE__ */ t(q, {}) : (n == null ? void 0 : n.type) === E.SUCCESS ? e : c }),
+        /* @__PURE__ */ l("div", { className: "flex flex-col gap-2 max-w-[300px]", children: [
+          /* @__PURE__ */ t("h3", { className: "truncate", children: n == null ? void 0 : n.title }),
+          (n == null ? void 0 : n.text) && /* @__PURE__ */ t("div", { className: "alert-text truncate", title: n == null ? void 0 : n.text, children: n == null ? void 0 : n.text })
         ] }),
-        /* @__PURE__ */ c(H, { title: s, onClick: n })
+        /* @__PURE__ */ t(T, { title: o, onClick: r })
       ] })
     }
   );
-}, pe = ({
-  buttonClassName: e,
-  isLoading: r = !1,
-  title: t,
-  disabled: n,
-  iconAfter: s,
-  iconBefore: o,
-  onClick: a,
-  isSmallButton: l
+}, xn = ({
+  buttonClassName: n,
+  isLoading: e = !1,
+  title: c,
+  disabled: r,
+  iconAfter: o,
+  iconBefore: a,
+  onClick: u,
+  isSmallButton: d
 }) => {
-  const i = m(
-    l ? "font-semibold" : "",
-    s ? "mr-2" : "",
-    o ? "ml-2" : ""
+  const s = h(
+    d ? "font-semibold" : "",
+    o ? "mr-2" : "",
+    a ? "ml-2" : ""
   );
-  return /* @__PURE__ */ u(
+  return /* @__PURE__ */ l(
     "button",
     {
       type: "button",
-      className: m(
+      className: h(
         "base-button",
-        e,
-        l ? "small-button" : ""
+        n,
+        d ? "small-button" : ""
       ),
-      disabled: n || r,
+      disabled: r || e,
       "aria-label": "button",
-      onClick: (f) => a == null ? void 0 : a(f),
-      title: t,
+      onClick: (m) => u == null ? void 0 : u(m),
+      title: c,
       children: [
-        o,
-        r && /* @__PURE__ */ c(A, {}),
-        t ? l ? /* @__PURE__ */ c("h4", { className: i, children: t }) : /* @__PURE__ */ c("h3", { className: i, children: t }) : null,
-        s
+        a,
+        e && /* @__PURE__ */ t(q, {}),
+        c ? d ? /* @__PURE__ */ t("h4", { className: s, children: c }) : /* @__PURE__ */ t("h3", { className: s, children: c }) : null,
+        o
       ]
     }
   );
-}, be = ({
-  label: e,
-  onChange: r,
-  value: t,
-  options: n,
-  calendarResolution: s = F.DAY,
-  id: o,
-  icon: a
+}, Nn = ({
+  label: n,
+  onChange: e,
+  value: c,
+  options: r,
+  calendarResolution: o = S.DAY,
+  id: a,
+  icon: u
 }) => {
   var N;
-  const l = L(null);
-  O(() => {
+  const d = j(null);
+  k(() => {
     var w;
-    const p = l == null ? void 0 : l.current;
-    p && ((w = p.querySelector("input")) == null || w.setAttribute("aria-label", e));
-  }, [e]);
-  const i = {
-    ...n,
-    defaultDate: s === F.MONTH ? new Date(t.getFullYear(), t.getMonth()) : t
-  }, f = (p, w, y) => {
-    const g = `calendar__${s === F.MONTH ? "month" : "day"}`;
-    y.calendarContainer && y.calendarContainer.classList.add(g);
-  }, b = (p, w, y) => {
-    if (s === F.MONTH && p.length > 0) {
-      const g = n.minDate, d = n.maxDate, h = p[0].getFullYear(), E = y.calendarContainer, S = "flatpickr-disabled", q = E.querySelectorAll(
+    const b = d == null ? void 0 : d.current;
+    b && ((w = b.querySelector("input")) == null || w.setAttribute("aria-label", n));
+  }, [n]);
+  const s = {
+    ...r,
+    defaultDate: o === S.MONTH ? new Date(c.getFullYear(), c.getMonth()) : c
+  }, m = (b, w, y) => {
+    const x = `calendar__${o === S.MONTH ? "month" : "day"}`;
+    y.calendarContainer && y.calendarContainer.classList.add(x);
+  }, i = (b, w, y) => {
+    if (o === S.MONTH && b.length > 0) {
+      const x = r.minDate, p = r.maxDate, f = b[0].getFullYear(), F = y.calendarContainer, _ = "flatpickr-disabled", $ = F.querySelectorAll(
         ".flatpickr-monthSelect-month"
-      ), $ = E.querySelectorAll(
+      ), A = F.querySelectorAll(
         ".flatpickr-next-month"
-      )[0], I = E.querySelectorAll(
+      )[0], W = F.querySelectorAll(
         ".flatpickr-prev-month"
       )[0];
-      h === d.getFullYear() && $.classList.add(S), h === g.getFullYear() && I.classList.add(S), (h === g.getFullYear() || h === d.getFullYear()) && q.forEach((k) => {
-        k.classList.remove(S);
-        const v = new Date(k.getAttribute("aria-label")), W = v.getFullYear() === g.getFullYear() && v.getMonth() === g.getMonth(), T = v.getFullYear() === d.getFullYear() && v.getMonth() === d.getMonth();
-        W || T || (v < g || v > d) && k.classList.add(S);
+      f === p.getFullYear() && A.classList.add(_), f === x.getFullYear() && W.classList.add(_), (f === x.getFullYear() || f === p.getFullYear()) && $.forEach((L) => {
+        L.classList.remove(_);
+        const v = new Date(L.getAttribute("aria-label")), Q = v.getFullYear() === x.getFullYear() && v.getMonth() === x.getMonth(), U = v.getFullYear() === p.getFullYear() && v.getMonth() === p.getMonth();
+        Q || U || (v < x || v > p) && L.classList.add(_);
       });
     }
   };
-  return /* @__PURE__ */ u("div", { className: "relative calendar", ref: l, children: [
-    /* @__PURE__ */ c("div", { className: "mb-1 calendar-title", children: e }),
-    /* @__PURE__ */ c(
+  return /* @__PURE__ */ l("div", { className: "relative calendar", ref: d, children: [
+    /* @__PURE__ */ t("div", { className: "mb-1 calendar-title", children: n }),
+    /* @__PURE__ */ t(
       "label",
       {
-        htmlFor: o,
+        htmlFor: a,
         className: "absolute cursor-pointer right-[11px] top-[29px]",
-        children: a || /* @__PURE__ */ c(z, {})
+        children: u || /* @__PURE__ */ t(Z, {})
       }
     ),
-    /* @__PURE__ */ c(
-      X,
+    /* @__PURE__ */ t(
+      J,
       {
-        defaultValue: (N = s === F.MONTH ? new Date(t.getFullYear(), t.getMonth()) : t) == null ? void 0 : N.toDateString(),
-        options: i,
-        onChange: (p) => {
-          r(p[0]);
+        defaultValue: (N = o === S.MONTH ? new Date(c.getFullYear(), c.getMonth()) : c) == null ? void 0 : N.toDateString(),
+        options: s,
+        onChange: (b) => {
+          e(b[0]);
         },
-        onOpen: [b],
-        onReady: [f],
-        id: o
+        onOpen: [i],
+        onReady: [m],
+        id: a
       }
     )
   ] });
-}, ge = ({
-  label: e,
-  id: r,
-  checked: t,
-  checkboxIcon: n,
-  onChange: s
+}, wn = ({
+  label: n,
+  id: e,
+  checked: c,
+  checkboxIcon: r,
+  onChange: o
 }) => {
-  const o = R(
-    (a) => {
-      a.stopPropagation(), s == null || s(r, a.target.checked);
+  const a = C(
+    (u) => {
+      u.stopPropagation(), o == null || o(e, u.target.checked);
     },
-    [s, r]
+    [o, e]
   );
-  return /* @__PURE__ */ u(
+  return /* @__PURE__ */ l(
     "label",
     {
       className: "flex items-center cursor-pointer min-w-0 py-1",
-      htmlFor: r,
+      htmlFor: e,
       children: [
-        /* @__PURE__ */ c(
+        /* @__PURE__ */ t(
           "span",
           {
-            className: m(
+            className: h(
               "flex justify-center items-center w-4 h-4 mr-2 relative",
               "checkbox-button"
             ),
-            children: t && n
+            children: c && r
           }
         ),
-        e && /* @__PURE__ */ c(
+        n && /* @__PURE__ */ t(
           "p",
           {
-            className: m(
+            className: h(
               "text-neutrals-1000 flex-1 min-w-0 truncate pr-2",
               "checkbox-button-text"
             ),
-            title: e,
-            children: e
+            title: n,
+            children: n
           }
         ),
-        /* @__PURE__ */ c(
+        /* @__PURE__ */ t(
           "input",
           {
             type: "checkbox",
-            onChange: o,
-            id: r,
-            checked: t,
+            onChange: a,
+            id: e,
+            checked: c,
             className: "hidden"
           }
         )
       ]
     }
   );
-}, Ne = ({
-  title: e,
-  icon: r,
-  children: t,
-  value: n
+}, yn = ({
+  title: n,
+  icon: e,
+  children: c,
+  value: r
 }) => {
-  const [s, o] = _(!1);
-  return /* @__PURE__ */ u(
+  const [o, a] = P(!1);
+  return /* @__PURE__ */ l(
     "div",
     {
-      className: `collapsible-block flex flex-col border-t-2 border-neutrals-600 ${s ? "collapsible-block-open" : ""}`,
+      className: `collapsible-block flex flex-col border-t-2 border-neutrals-600 ${o ? "collapsible-block-open" : ""}`,
       children: [
-        /* @__PURE__ */ u(
+        /* @__PURE__ */ l(
           "div",
           {
             className: "collapsible-block-title flex cursor-pointer items-center py-4",
-            onClick: () => o(!s),
+            onClick: () => a(!o),
             children: [
-              /* @__PURE__ */ c("div", { className: `${s ? "rotate-180" : ""} transition-transform`, children: r || /* @__PURE__ */ c(Q, { className: "w-5 h-5 mr-3" }) }),
-              /* @__PURE__ */ u("div", { className: "flex flex-1 items-center justify-between", children: [
-                /* @__PURE__ */ c("span", { children: e }),
-                n && /* @__PURE__ */ c("p", { className: "body-1 text-neutrals-800", children: n })
+              /* @__PURE__ */ t("div", { className: `${o ? "rotate-180" : ""} transition-transform`, children: e || /* @__PURE__ */ t(B, { className: "w-5 h-5 mr-3" }) }),
+              /* @__PURE__ */ l("div", { className: "flex flex-1 items-center justify-between", children: [
+                /* @__PURE__ */ t("span", { children: n }),
+                r && /* @__PURE__ */ t("p", { className: "body-1 text-neutrals-800", children: r })
               ] })
             ]
           }
         ),
-        s && /* @__PURE__ */ c("div", { className: "collapsible-block-content pb-4", children: t })
+        o && /* @__PURE__ */ t("div", { className: "collapsible-block-content pb-4", children: c })
       ]
     }
   );
-}, we = ({ text: e, highlightText: r }) => {
-  const t = U(() => {
-    var a;
-    const n = [];
-    if (!r)
-      return [{ id: 0, text: e, highlight: !1 }];
-    const s = (r == null ? void 0 : r.toLowerCase()) || "", o = ((a = e == null ? void 0 : e.toLowerCase()) == null ? void 0 : a.split(s)) || "";
-    for (let l = 0, i = 0; l < (o == null ? void 0 : o.length); l++) {
-      const f = o == null ? void 0 : o[l], b = f.length;
-      f !== "" && n.push({
-        id: n.length,
+}, vn = ({ text: n, highlightText: e }) => {
+  const c = z(() => {
+    var u;
+    const r = [];
+    if (!e)
+      return [{ id: 0, text: n, highlight: !1 }];
+    const o = (e == null ? void 0 : e.toLowerCase()) || "", a = ((u = n == null ? void 0 : n.toLowerCase()) == null ? void 0 : u.split(o)) || "";
+    for (let d = 0, s = 0; d < (a == null ? void 0 : a.length); d++) {
+      const m = a == null ? void 0 : a[d], i = m.length;
+      m !== "" && r.push({
+        id: r.length,
         highlight: !1,
-        text: e == null ? void 0 : e.substring(
-          i,
-          i + b
+        text: n == null ? void 0 : n.substring(
+          s,
+          s + i
         )
-      }), i += b, l !== (o == null ? void 0 : o.length) - 1 && (n.push({
-        id: n.length,
+      }), s += i, d !== (a == null ? void 0 : a.length) - 1 && (r.push({
+        id: r.length,
         highlight: !0,
-        text: e == null ? void 0 : e.substring(
-          i,
-          i + r.length
+        text: n == null ? void 0 : n.substring(
+          s,
+          s + e.length
         )
-      }), i += r.length);
+      }), s += e.length);
     }
-    return n;
-  }, [r, e]);
-  return /* @__PURE__ */ c(P, { children: t.map((n) => /* @__PURE__ */ c(
+    return r;
+  }, [e, n]);
+  return /* @__PURE__ */ t(Y, { children: c.map((r) => /* @__PURE__ */ t(
     "span",
     {
-      className: m((n == null ? void 0 : n.highlight) && "bg-highlight"),
-      children: n == null ? void 0 : n.text
+      className: h((r == null ? void 0 : r.highlight) && "bg-highlight"),
+      children: r == null ? void 0 : r.text
     },
-    n == null ? void 0 : n.id
+    r == null ? void 0 : r.id
   )) });
-}, ye = ({
-  icon: e,
-  onClick: r,
-  buttonClassName: t,
-  disabled: n,
-  title: s,
-  isBaseIconStyles: o = !0
-}) => /* @__PURE__ */ c(
+}, En = ({
+  icon: n,
+  onClick: e,
+  buttonClassName: c,
+  disabled: r,
+  title: o,
+  isBaseIconStyles: a = !0
+}) => /* @__PURE__ */ t(
   "button",
   {
     type: "button",
-    className: m(
-      o && "base-icon-button",
-      t
+    className: h(
+      a && "base-icon-button",
+      c
     ),
-    onClick: (a) => r == null ? void 0 : r(a),
-    disabled: n,
-    title: s,
+    onClick: (u) => e == null ? void 0 : e(u),
+    disabled: r,
+    title: o,
     "aria-label": "button",
-    children: e
+    children: n
   }
-), se = ({
-  value: e,
-  inputId: r,
-  placeholder: t = "",
-  cssClass: n = "",
-  type: s = "text",
-  disabled: o,
-  readonly: a,
-  onChange: l,
-  onKeyDown: i
+), on = ({
+  value: n,
+  inputId: e,
+  placeholder: c = "",
+  cssClass: r = "",
+  type: o = "text",
+  disabled: a,
+  readonly: u,
+  onChange: d,
+  onKeyDown: s
 }) => {
-  const f = m(
+  const m = h(
     "truncate outline-none shadow-none body-1",
-    n,
-    a ? "pointer-events-none" : ""
+    r,
+    u ? "pointer-events-none" : ""
   );
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ t(
     "input",
     {
-      type: s,
+      type: o,
       autoComplete: "off",
-      id: r,
-      placeholder: t,
-      value: e || "",
-      title: e ? String(e) : "",
-      disabled: o,
-      className: f,
-      onKeyDown: i,
-      onChange: (b) => l == null ? void 0 : l(b.currentTarget.value)
+      id: e,
+      placeholder: c,
+      value: n || "",
+      title: n ? String(n) : "",
+      disabled: a,
+      className: m,
+      onKeyDown: s,
+      onChange: (i) => d == null ? void 0 : d(i.currentTarget.value)
     }
   );
-}, ve = ({
-  iconBeforeInput: e,
-  iconAfterInput: r,
-  containerClasses: t,
-  cssClass: n,
-  ...s
-}) => /* @__PURE__ */ u("div", { className: m("input w-full flex flex-row", t), children: [
-  e,
-  /* @__PURE__ */ c(
-    se,
+}, Fn = ({
+  iconBeforeInput: n,
+  iconAfterInput: e,
+  containerClasses: c,
+  cssClass: r,
+  ...o
+}) => /* @__PURE__ */ l("div", { className: h("input w-full flex flex-row", c), children: [
+  n,
+  /* @__PURE__ */ t(
+    on,
     {
-      cssClass: m(
+      cssClass: h(
         "border-0 bg-transparent p-0 h-full shadow-none flex-1 min-w-0 rounded-none",
-        n
+        r
       ),
-      ...s
+      ...o
     }
   ),
-  r
-] }), xe = ({
-  url: e,
-  title: r,
-  linkClassName: t = "",
-  iconBefore: n,
-  iconAfter: s
+  e
+] }), Sn = ({
+  url: n,
+  title: e,
+  linkClassName: c = "",
+  iconBefore: r,
+  iconAfter: o
 }) => {
-  const o = m(
-    s ? "mr-2" : "",
-    n ? "ml-2" : ""
+  const a = h(
+    o ? "mr-2" : "",
+    r ? "ml-2" : ""
   );
-  return /* @__PURE__ */ u(
+  return /* @__PURE__ */ l(
     "a",
     {
-      href: e,
+      href: n,
       target: "_blank",
       rel: "noopener noreferrer",
-      className: m("base-link", t),
-      title: r,
+      className: h("base-link", c),
+      title: e,
       children: [
-        n,
-        /* @__PURE__ */ c("span", { className: o, children: r }),
-        s
+        r,
+        /* @__PURE__ */ t("span", { className: a, children: e }),
+        o
       ]
     }
   );
-}, Ee = ({ title: e, text: r, onClick: t }) => /* @__PURE__ */ c(
+}, Rn = ({ title: n, text: e, onClick: c }) => /* @__PURE__ */ t(
   "button",
   {
     type: "button",
     className: "tag flex items-center justify-center",
-    onClick: () => t == null ? void 0 : t(r || e),
+    onClick: () => c == null ? void 0 : c(e || n),
     "aria-label": "button",
-    children: /* @__PURE__ */ c("h4", { children: e })
+    children: /* @__PURE__ */ t("h4", { children: n })
   }
-), Fe = ({
-  label: e,
-  id: r,
-  checked: t,
-  radioIcon: n,
-  description: s,
-  onChange: o
+), _n = ({
+  label: n,
+  id: e,
+  checked: c,
+  radioIcon: r,
+  description: o,
+  onChange: a
 }) => {
-  const a = R(
-    (l) => {
-      l.stopPropagation(), o == null || o(r, l.target.checked);
+  const u = C(
+    (d) => {
+      d.stopPropagation(), a == null || a(e, d.target.checked);
     },
-    [o, r]
+    [a, e]
   );
-  return /* @__PURE__ */ u(
+  return /* @__PURE__ */ l(
     "label",
     {
       className: "flex flex-col cursor-pointer min-w-0 py-[6px]",
-      htmlFor: r,
+      htmlFor: e,
       children: [
-        /* @__PURE__ */ u("p", { className: "radio-label flex items-center min-w-0", children: [
-          /* @__PURE__ */ c(
+        /* @__PURE__ */ l("p", { className: "radio-label flex items-center min-w-0", children: [
+          /* @__PURE__ */ t(
             "span",
             {
-              className: m(
+              className: h(
                 "flex justify-center items-center w-4 h-4 mr-2 relative",
                 "radio-button",
-                t ? "radio-button-active" : ""
+                c ? "radio-button-active" : ""
               ),
-              children: t && n
+              children: c && r
             }
           ),
-          e && /* @__PURE__ */ c(
+          n && /* @__PURE__ */ t(
             "span",
             {
               className: "radio-title body-1 text-neutrals-1000 flex-1 min-w-0 truncate pr-2",
-              title: e,
-              children: e
+              title: n,
+              children: n
             }
           )
         ] }),
-        s && /* @__PURE__ */ c(
+        o && /* @__PURE__ */ t(
           "span",
           {
             className: "radio-description ml-6 text-neutrals-800 body-2 w-auto flex items-center",
-            title: s,
-            children: s
+            title: o,
+            children: o
           }
         ),
-        /* @__PURE__ */ c(
+        /* @__PURE__ */ t(
           "input",
           {
             type: "radio",
-            onChange: a,
-            id: r,
-            checked: t,
+            onChange: u,
+            id: e,
+            checked: c,
             className: "hidden"
           }
         )
@@ -437,188 +437,242 @@ const fe = ({
     }
   );
 };
-var C = /* @__PURE__ */ ((e) => (e.Closed = "Closed", e.Opened = "Opened", e))(C || {}), M = /* @__PURE__ */ ((e) => (e.LG = "Large", e.SM = "Small", e))(M || {});
-const ce = ({
-  portalId: e,
-  state: r = C.Opened,
-  heading: t,
-  size: n,
-  onClose: s,
-  children: o,
-  overlayClassName: a,
-  containerClassName: l,
-  dividers: i = !0,
-  closeButtonTitle: f
+var R = /* @__PURE__ */ ((n) => (n.Closed = "Closed", n.Opened = "Opened", n))(R || {}), O = /* @__PURE__ */ ((n) => (n.LG = "Large", n.SM = "Small", n))(O || {});
+const an = ({
+  portalId: n,
+  state: e = R.Opened,
+  heading: c,
+  size: r,
+  onClose: o,
+  children: a,
+  overlayClassName: u,
+  containerClassName: d,
+  dividers: s = !0,
+  closeButtonTitle: m
 }) => {
-  const { refs: b, context: N } = Y({
-    open: r !== C.Closed && !!r,
-    onOpenChange: s
-  }), p = Z(N, { role: "dialog" }), w = j(N, { outsidePress: !0 }), { getFloatingProps: y } = G([p, w]), g = R(
-    (d) => {
-      d == null || d.preventDefault(), d == null || d.stopPropagation(), s();
+  const { refs: i, context: N } = I({
+    open: e !== R.Closed && !!e,
+    onOpenChange: o
+  }), b = K(N, { role: "dialog" }), w = G(N, { outsidePress: !0 }), { getFloatingProps: y } = H([b, w]), x = C(
+    (p) => {
+      p == null || p.preventDefault(), p == null || p.stopPropagation(), o();
     },
-    [s]
+    [o]
   );
-  return /* @__PURE__ */ c(B, { id: e, children: r !== C.Closed && /* @__PURE__ */ c(
-    J,
+  return /* @__PURE__ */ t(V, { id: n, children: e !== R.Closed && /* @__PURE__ */ t(
+    D,
     {
-      className: m(
-        "z-[52] flex items-center justify-center bg-blackout p-4",
-        a
+      className: h(
+        "z-modal flex items-center justify-center bg-blackout p-4",
+        u
       ),
-      children: /* @__PURE__ */ c(K, { context: N, children: /* @__PURE__ */ u(
+      children: /* @__PURE__ */ t(M, { context: N, children: /* @__PURE__ */ l(
         "div",
         {
-          className: m(
+          className: h(
             "relative max-h-full modal rounded bg-white flex flex-col shadow w-full",
-            n === M.LG && "max-w-[65%]",
-            n === M.SM && "max-w-[30%]",
-            i && "divide-neutrals-400 divide-y",
-            l,
+            r === O.LG && "max-w-[65%]",
+            r === O.SM && "max-w-[30%]",
+            s && "divide-neutrals-400 divide-y",
+            d,
             "sm:w-full sm:max-w-full sm:px-4 sm:py-6"
           ),
-          ref: b.setFloating,
+          ref: i.setFloating,
           ...y({
-            onClick(d) {
-              d.stopPropagation();
+            onClick(p) {
+              p.stopPropagation();
             }
           }),
           children: [
-            /* @__PURE__ */ u("div", { className: "flex flex-row justify-between py-3 px-6 items-center mb-2 modal-heading sm:p-0 sm:pb-2", children: [
-              t && (typeof t == "string" ? /* @__PURE__ */ c("h2", { className: "flex-1 min-w-0 mr-3 modal-heading-title sm:h3", children: t }) : t),
-              /* @__PURE__ */ c(
-                H,
+            /* @__PURE__ */ l("div", { className: "flex flex-row justify-between py-3 px-6 items-center mb-2 modal-heading sm:p-0 sm:pb-2", children: [
+              c && (typeof c == "string" ? /* @__PURE__ */ t("h2", { className: "flex-1 min-w-0 mr-3 modal-heading-title sm:h3", children: c }) : c),
+              /* @__PURE__ */ t(
+                T,
                 {
-                  title: f,
-                  onClick: g,
+                  title: m,
+                  onClick: x,
                   btnClassNames: "sm:h-[24px] sm:w-[24px] sm:top-4"
                 }
               )
             ] }),
-            o.map((d) => d)
+            a.map((p) => p)
           ]
         }
       ) })
     }
   ) });
-}, Ce = (e) => e.state === C.Closed ? null : /* @__PURE__ */ c(ce, { ...e }), Se = ({
-  triggerButton: e,
-  options: r,
-  content: t,
-  selectedOption: n,
-  disabled: s,
-  containerClassName: o,
-  openedClassName: a,
-  onOptionSelect: l
+}, Cn = (n) => n.state === R.Closed ? null : /* @__PURE__ */ t(an, { ...n }), Ln = ({
+  triggerButton: n,
+  options: e,
+  content: c,
+  selectedOption: r,
+  disabled: o,
+  containerClassName: a,
+  openedClassName: u,
+  onOptionSelect: d
 }) => {
-  const [i, f] = _(!1), { refs: b, floatingStyles: N, context: p } = Y({
-    open: i,
-    onOpenChange: s ? void 0 : f,
+  const [s, m] = P(!1), { refs: i, floatingStyles: N, context: b } = I({
+    open: s,
+    onOpenChange: o ? void 0 : m,
     placement: "bottom-end",
-    middleware: [ee(8), ne(), re()],
-    whileElementsMounted: D
-  }), w = te(p), y = j(p, { outsidePress: !0 }), { getReferenceProps: g, getFloatingProps: d } = G([
+    middleware: [en(8), rn(), cn()],
+    whileElementsMounted: nn
+  }), w = tn(b), y = G(b, { outsidePress: !0 }), { getReferenceProps: x, getFloatingProps: p } = H([
     w,
     y
   ]);
-  return /* @__PURE__ */ u(P, { children: [
-    /* @__PURE__ */ c(
+  return /* @__PURE__ */ l(Y, { children: [
+    /* @__PURE__ */ t(
       "div",
       {
-        ref: b.setReference,
-        ...g({
-          onClick(h) {
-            h.stopPropagation();
+        ref: i.setReference,
+        ...x({
+          onClick(f) {
+            f.stopPropagation();
           }
         }),
-        className: m(o, i && a),
-        children: e
+        className: h(a, s && u),
+        children: n
       }
     ),
-    i && /* @__PURE__ */ u(
+    s && /* @__PURE__ */ l(
       "div",
       {
-        ref: b.setFloating,
+        ref: i.setFloating,
         style: N,
         className: "flex flex-col z-10 dropdown-menu-shadow bg-white dropdown-container rounded",
-        ...d(),
+        ...p(),
         children: [
-          t && t,
-          r && r.map((h) => /* @__PURE__ */ c(
+          c && c,
+          e && e.map((f) => /* @__PURE__ */ t(
             "div",
             {
-              onClick: (E) => {
-                E.stopPropagation(), l == null || l(h.key), f(!1);
+              onClick: (F) => {
+                F.stopPropagation(), d == null || d(f.key), m(!1);
               },
-              className: m(
+              className: h(
                 "text-neutrals-900 body-3 cursor-pointer dropdown-item min-w-[200px]",
-                n === h.key && "bg-hues-100"
+                r === f.key && "bg-hues-100"
               ),
-              children: /* @__PURE__ */ u(
+              children: /* @__PURE__ */ l(
                 "div",
                 {
                   className: "p-2 hover:bg-hues-100 h-full dropdown-item-text flex items-center gap-x-2",
-                  title: h.title,
+                  title: f.title,
                   children: [
-                    h.icon ? h.icon : null,
-                    /* @__PURE__ */ c("p", { children: h == null ? void 0 : h.title })
+                    f.icon ? f.icon : null,
+                    /* @__PURE__ */ t("p", { children: f == null ? void 0 : f.title })
                   ]
                 }
               )
             },
-            h.key
+            f.key
           ))
         ]
       }
     )
   ] });
-}, Re = 24, ke = 24;
-function Me(e = 719) {
-  const [r, t] = _(
-    () => typeof window < "u" ? window.innerWidth < e : !1
+}, On = ({ limitMessages: n, query: e }) => /* @__PURE__ */ l("div", { className: "bg-hues-100 px-2 py-1 flex justify-between flex-wrap items-center", children: [
+  /* @__PURE__ */ t("div", { className: "flex gap-x-[4px]", children: /* @__PURE__ */ t("div", { className: "flex flex-col", children: /* @__PURE__ */ l("div", { className: "flex gap-x-[4px]", children: [
+    /* @__PURE__ */ l("span", { className: "text-primary h5", children: [
+      n == null ? void 0 : n.excelFormatTitle,
+      " "
+    ] }),
+    /* @__PURE__ */ t("span", { className: "text-neutrals-800 body-3", children: n == null ? void 0 : n.excelFormatText })
+  ] }) }) }),
+  /* @__PURE__ */ t("a", { href: e, target: "_blank", children: /* @__PURE__ */ l("span", { className: "flex gap-x-[4px] body-3 cursor-pointer items-center", children: [
+    n == null ? void 0 : n.dataExplorerIcon,
+    n == null ? void 0 : n.dataExplorer
+  ] }) })
+] }), g = 1e3, kn = ({
+  limitMessages: n,
+  isDownload: e,
+  showAdvancedViewButton: c,
+  onAdvancedViewClick: r,
+  query: o
+}) => {
+  var a, u;
+  return /* @__PURE__ */ l("div", { className: "bg-accent-300 px-2 py-1 flex justify-between flex-wrap items-center", children: [
+    /* @__PURE__ */ l("div", { className: "flex gap-x-[4px]", children: [
+      /* @__PURE__ */ t("span", { children: n == null ? void 0 : n.warningIcon }),
+      /* @__PURE__ */ l("div", { className: "flex flex-col", children: [
+        /* @__PURE__ */ l("div", { className: "flex gap-x-[4px]", children: [
+          /* @__PURE__ */ l("span", { className: "text-primary h5", children: [
+            n == null ? void 0 : n.largeQuery,
+            ":",
+            " "
+          ] }),
+          /* @__PURE__ */ t("span", { className: "text-neutrals-800 body-3", children: e ? (a = n == null ? void 0 : n.downloadMessage) == null ? void 0 : a.call(n, g) : (u = n == null ? void 0 : n.showingLimit) == null ? void 0 : u.call(n, g) })
+        ] }),
+        e && /* @__PURE__ */ t("span", { className: "text-neutrals-800 body-3", children: n == null ? void 0 : n.fullLimitMessage })
+      ] })
+    ] }),
+    c && /* @__PURE__ */ l(
+      "span",
+      {
+        onClick: () => r == null ? void 0 : r(),
+        className: "flex gap-x-[4px] body-3 cursor-pointer items-center",
+        children: [
+          n == null ? void 0 : n.editIcon,
+          n == null ? void 0 : n.refineInAdvancedView
+        ]
+      }
+    ),
+    e && /* @__PURE__ */ t("a", { href: o || "", target: "_blank", children: /* @__PURE__ */ l("span", { className: "flex gap-x-[4px] body-3 cursor-pointer items-center", children: [
+      n == null ? void 0 : n.dataExplorerIcon,
+      n == null ? void 0 : n.dataExplorer
+    ] }) })
+  ] });
+}, Pn = 24, gn = 24;
+function Yn(n = 719) {
+  const [e, c] = P(
+    () => typeof window < "u" ? window.innerWidth < n : !1
   );
-  return O(() => {
-    const n = window.matchMedia(`(max-width: ${e}px)`), s = (o) => {
-      t(o.matches);
+  return k(() => {
+    const r = window.matchMedia(`(max-width: ${n}px)`), o = (a) => {
+      c(a.matches);
     };
-    return t(n.matches), n.addEventListener("change", s), () => n.removeEventListener("change", s);
-  }, [e]), r;
+    return c(r.matches), r.addEventListener("change", o), () => r.removeEventListener("change", o);
+  }, [n]), e;
 }
-function Oe(e, r) {
-  const t = L(null);
-  return R(
-    (...s) => {
-      t.current && clearTimeout(t.current), t.current = setTimeout(() => {
-        e(...s);
-      }, r);
+function jn(n, e) {
+  const c = j(null);
+  return C(
+    (...o) => {
+      c.current && clearTimeout(c.current), c.current = setTimeout(() => {
+        n(...o);
+      }, e);
     },
-    [e, r]
+    [n, e]
   );
 }
-var oe = /* @__PURE__ */ ((e) => (e.Enter = "Enter", e))(oe || {});
+var ln = /* @__PURE__ */ ((n) => (n.Enter = "Enter", n))(ln || {});
 export {
-  fe as Alert,
-  x as AlertType,
-  pe as Button,
-  be as Calendar,
-  ge as Checkbox,
-  H as CloseButton,
-  Ne as CollapsibleBlock,
-  Se as Dropdown,
-  we as HighlightText,
-  ye as IconButton,
-  se as Input,
-  ve as InputWithIcon,
-  oe as KeyboardKey,
-  xe as Link,
-  A as Loader,
-  M as PopUpSize,
-  C as PopUpState,
-  Ce as Popup,
-  Fe as Radio,
-  Re as TREE_NODE_ARROW_SIZE,
-  ke as TREE_NODE_PADDING,
-  Ee as Tag,
-  Oe as useDebounce,
-  Me as useIsMobile
+  bn as Alert,
+  E as AlertType,
+  xn as Button,
+  Nn as Calendar,
+  wn as Checkbox,
+  T as CloseButton,
+  yn as CollapsibleBlock,
+  On as DownloadFormatMessage,
+  Ln as Dropdown,
+  vn as HighlightText,
+  En as IconButton,
+  on as Input,
+  Fn as InputWithIcon,
+  ln as KeyboardKey,
+  Sn as Link,
+  q as Loader,
+  O as PopUpSize,
+  R as PopUpState,
+  Cn as Popup,
+  _n as Radio,
+  kn as RequestLimitMessage,
+  g as SERIES_LIMIT,
+  Pn as TREE_NODE_ARROW_SIZE,
+  gn as TREE_NODE_PADDING,
+  Rn as Tag,
+  jn as useDebounce,
+  Yn as useIsMobile
 };