@reportportal/ui-kit 0.0.1-alpha.172 → 0.0.1-alpha.173

package/dist/{datePicker-cde99de3.js → datePicker-76a82d23.js}

@@ -3,7 +3,7 @@ import { useMemo as E, forwardRef as G, useRef as V } from "react";
 import v from "react-datepicker/dist/es/index.js";
 import { c as L } from "./bind-06a7ff84.js";
 import { F as W } from "./fieldText-1749da7a.js";
-import { D as x } from "./dropdown-7d024c49.js";
+import { D as x } from "./dropdown-e853293f.js";
 import { S as I } from "./calendarArrow-44c7e60e.js";
 import { registerLocale as q } from "react-datepicker";
 const De = (t, n) => {

package/dist/datePicker.js

@@ -1,5 +1,5 @@
-import { D as t } from "./datePicker-cde99de3.js";
-import { r as A } from "./datePicker-cde99de3.js";
+import { D as t } from "./datePicker-76a82d23.js";
+import { r as E } from "./datePicker-76a82d23.js";
 import "react/jsx-runtime";
 import "react";
 import "react-datepicker/dist/es/index.js";
@@ -11,7 +11,7 @@ import "./baseIconButton-251479f7.js";
 import "./spinLoader-c4a53718.js";
 import "./maxValueDisplay-9be01a75.js";
 import "./fieldLabel.js";
-import "./dropdown-7d024c49.js";
+import "./dropdown-e853293f.js";
 import "react-dom";
 import "@floating-ui/react-dom";
 import "downshift";
@@ -22,11 +22,14 @@ import "./adaptiveTagList.js";
 import "./button-97d9e587.js";
 import "./close-4d480ef7.js";
 import "./isEmpty-ccacb5ff.js";
+import "react-dnd";
+import "react-dnd-html5-backend";
+import "./useEllipsisTitle-462fa254.js";
 import "./checkbox-493fdc63.js";
 import "./calendarArrow-44c7e60e.js";
 import "react-datepicker";
 export {
   t as DatePicker,
   t as default,
-  A as registerDatePickerLocale
+  E as registerDatePickerLocale
 };

package/dist/{dropdown-7d024c49.js → dropdown-e853293f.js}

@@ -1,19 +1,22 @@
-import { jsxs as k, jsx as u, Fragment as Ye } from "react/jsx-runtime";
-import { forwardRef as gr, useState as ne, useRef as K, useMemo as C, useCallback as N, useLayoutEffect as Ve, useEffect as Y } from "react";
-import { createPortal as Er } from "react-dom";
-import { c as $e } from "./bind-06a7ff84.js";
-import { useFloating as yr, offset as Cr, flip as Ar, size as Or, autoUpdate as vr } from "@floating-ui/react-dom";
-import { useSelect as pe } from "downshift";
-import { Scrollbars as Dr } from "rc-scrollbars";
+import { jsxs as k, jsx as u, Fragment as Pe } from "react/jsx-runtime";
+import { forwardRef as Er, useState as me, useRef as x, useMemo as w, useCallback as N, useLayoutEffect as Ye, useEffect as W } from "react";
+import { createPortal as yr } from "react-dom";
+import { c as He } from "./bind-06a7ff84.js";
+import { useFloating as Cr, offset as Ar, flip as Or, size as vr, autoUpdate as Dr } from "@floating-ui/react-dom";
+import { useSelect as we } from "downshift";
+import { Scrollbars as br } from "rc-scrollbars";
 import { K as p } from "./keyCodes-f63c0e11.js";
-import { B as br } from "./baseIconButton-251479f7.js";
-import { S as Nr } from "./clear-53660571.js";
-import { S as Ir } from "./dropdown-0260bb66.js";
-import { FieldLabel as Kr } from "./fieldLabel.js";
-import { AdaptiveTagList as Lr } from "./adaptiveTagList.js";
-import { C as zr } from "./checkbox-493fdc63.js";
-import { i as se } from "./isEmpty-ccacb5ff.js";
-const Tr = (n) => {
+import { B as Nr } from "./baseIconButton-251479f7.js";
+import { S as Ir } from "./clear-53660571.js";
+import { S as Kr } from "./dropdown-0260bb66.js";
+import { FieldLabel as Lr } from "./fieldLabel.js";
+import { AdaptiveTagList as zr } from "./adaptiveTagList.js";
+import "react-dnd";
+import "react-dnd-html5-backend";
+import { u as Tr } from "./useEllipsisTitle-462fa254.js";
+import { C as xr } from "./checkbox-493fdc63.js";
+import { i as te } from "./isEmpty-ccacb5ff.js";
+const kr = (n) => {
   const r = {}, c = {};
   return Object.entries(n).forEach(([a, h]) => {
     if (/^data[A-Z]/.test(a) || /^aria[A-Z]/.test(a)) {
@@ -22,55 +25,55 @@ const Tr = (n) => {
     } else
       c[a] = h;
   }), { transformed: r, remaining: c };
-}, xr = "_disabled_14s7v_12", kr = "_hidden_14s7v_16", Rr = "_hover_14s7v_22", Pr = "_selected_14s7v_38", Yr = {
+}, Rr = "_disabled_14s7v_12", Pr = "_hidden_14s7v_16", Yr = "_hover_14s7v_22", Vr = "_selected_14s7v_38", Sr = {
   "dropdown-option": "_dropdown-option_14s7v_1",
-  disabled: xr,
-  hidden: kr,
-  hover: Rr,
+  disabled: Rr,
+  hidden: Pr,
+  hover: Yr,
   "depth-1": "_depth-1_14s7v_32",
-  selected: Pr,
+  selected: Vr,
   "multi-select": "_multi-select_14s7v_38",
   "single-option": "_single-option_14s7v_43",
   "sub-option": "_sub-option_14s7v_50"
-}, Se = $e.bind(Yr), He = gr(
+}, Ve = He.bind(Sr), Se = Er(
   (n, r) => {
     const {
-      option: { value: c, disabled: a, hidden: h, label: m, title: A, groupRef: O },
+      option: { value: c, disabled: a, hidden: h, label: m, title: C, groupRef: A },
       selected: F,
-      onChange: S,
+      onChange: V,
       render: U,
       highlightHovered: B,
-      onMouseEnter: ae,
-      multiSelect: w,
+      onMouseEnter: ne,
+      multiSelect: O,
       isPartiallyChecked: j = !1,
       depth: q = 0,
-      hasChildren: oe = !1
-    } = n, ie = (Z) => {
-      (Z.target instanceof HTMLDivElement || Z.target instanceof HTMLInputElement) && (S == null || S(c));
+      hasChildren: se = !1
+    } = n, ae = (Z) => {
+      (Z.target instanceof HTMLDivElement || Z.target instanceof HTMLInputElement) && (V == null || V(c));
     };
     return /* @__PURE__ */ k(
       "div",
       {
-        className: Se("dropdown-option", {
+        className: Ve("dropdown-option", {
           selected: F,
           disabled: a,
           hidden: h,
           hover: B,
-          "multi-select": w,
-          "has-children": oe,
+          "multi-select": O,
+          "has-children": se,
           [`depth-${q}`]: q > 0
         }),
-        title: A,
-        onClick: ie,
+        title: C,
+        onClick: ae,
         ref: r,
-        onMouseEnter: ae,
+        onMouseEnter: ne,
         children: [
-          w && /* @__PURE__ */ u(zr, { value: !!F, partiallyChecked: j }),
+          O && /* @__PURE__ */ u(xr, { value: !!F, partiallyChecked: j }),
           /* @__PURE__ */ u(
             "div",
             {
-              className: Se("single-option", {
-                "sub-option": !!O
+              className: Ve("single-option", {
+                "sub-option": !!A
               }),
               children: U ? U(n) : m
             }
@@ -79,50 +82,50 @@ const Tr = (n) => {
       }
     );
   }
-), Vr = [
+), Hr = [
   p.ENTER_KEY_CODE,
   p.SPACE_KEY_CODE,
   p.ARROW_DOWN_KEY_CODE
-], Sr = [p.ESCAPE_KEY_CODE, p.TAB_KEY_CODE];
-var V = /* @__PURE__ */ ((n) => (n.ON_KEY_DOWN = "onKeyDown", n.ON_CLICK = "onClick", n))(V || {});
-const Hr = 240, $r = "data-dropdown-portal-menu", Wr = 10, Mr = (n, r) => {
+], $r = [p.ESCAPE_KEY_CODE, p.TAB_KEY_CODE];
+var Y = /* @__PURE__ */ ((n) => (n.ON_KEY_DOWN = "onKeyDown", n.ON_CLICK = "onClick", n))(Y || {});
+const Mr = 240, Wr = "data-dropdown-portal-menu", Fr = 10, Ur = (n, r) => {
   const c = Array.isArray(r) ? r : [r];
   return n.findIndex(({ value: a }) => c.includes(a));
-}, Fr = (n, r) => (n % r + r) % r, me = (n, r = 0, c = 1) => {
+}, Br = (n, r) => (n % r + r) % r, ge = (n, r = 0, c = 1) => {
   var h;
   if (n.length === 0)
     return 0;
   if (!((h = n[r]) != null && h.disabled))
     return r;
   const a = n.length;
-  return me(
+  return ge(
     n,
-    Fr(r + c, a),
+    Br(r + c, a),
     c
   );
-}, Ur = (n, r) => me(n, r), Br = (n, r) => me(n, r, -1), We = (n, r = 0, c) => !n || n.length === 0 ? [] : n.reduce((a, h) => {
+}, jr = (n, r) => ge(n, r), qr = (n, r) => ge(n, r, -1), $e = (n, r = 0, c) => !n || n.length === 0 ? [] : n.reduce((a, h) => {
   var m;
-  return h && (a.push({ option: h, depth: r, parent: c }), (m = h.children) != null && m.length && a.push(...We(h.children, r + 1, h))), a;
+  return h && (a.push({ option: h, depth: r, parent: c }), (m = h.children) != null && m.length && a.push(...$e(h.children, r + 1, h))), a;
 }, []), Me = (n) => !n || n.length === 0 ? [] : n.reduce((r, c) => {
   var a;
   return c && ((a = c.children) != null && a.length ? r.push(...Me(c.children)) : r.push(c)), r;
-}, []), Fe = (n) => {
+}, []), We = (n) => {
   var r;
-  return n ? (r = n.children) != null && r.length ? n.children.reduce((c, a) => (a && c.push(...Fe(a)), c), []) : [n.value] : [];
-}, jr = "_container_18w0z_1", qr = "_icon_18w0z_7", Zr = "_arrow_18w0z_15", Gr = "_dropdown_18w0z_33", Xr = "_disabled_18w0z_53", Jr = "_value_18w0z_60", Qr = "_error_18w0z_63", et = "_touched_18w0z_63", rt = "_opened_18w0z_67", tt = "_placeholder_18w0z_101", nt = "_ghost_18w0z_184", st = "_divider_18w0z_202", at = {
-  container: jr,
-  icon: qr,
-  arrow: Zr,
+  return n ? (r = n.children) != null && r.length ? n.children.reduce((c, a) => (a && c.push(...We(a)), c), []) : [n.value] : [];
+}, Zr = "_container_18w0z_1", Gr = "_icon_18w0z_7", Xr = "_arrow_18w0z_15", Jr = "_dropdown_18w0z_33", Qr = "_disabled_18w0z_53", et = "_value_18w0z_60", rt = "_error_18w0z_63", tt = "_touched_18w0z_63", nt = "_opened_18w0z_67", st = "_placeholder_18w0z_101", at = "_ghost_18w0z_184", ot = "_divider_18w0z_202", it = {
+  container: Zr,
+  icon: Gr,
+  arrow: Xr,
   "clear-button": "_clear-button_18w0z_23",
-  dropdown: Gr,
+  dropdown: Jr,
   "multi-select-with-tags": "_multi-select-with-tags_18w0z_47",
   "transparent-background": "_transparent-background_18w0z_50",
-  disabled: Xr,
-  value: Jr,
-  error: Qr,
-  touched: et,
-  opened: rt,
-  placeholder: tt,
+  disabled: Qr,
+  value: et,
+  error: rt,
+  touched: tt,
+  opened: nt,
+  placeholder: st,
   "mobile-disabled": "_mobile-disabled_18w0z_105",
   "value-wrapper": "_value-wrapper_18w0z_110",
   "tags-wrapper": "_tags-wrapper_18w0z_116",
@@ -132,95 +135,95 @@ const Hr = 240, $r = "data-dropdown-portal-menu", Wr = 10, Mr = (n, r) => {
   "limited-width": "_limited-width_18w0z_163",
   "options-container": "_options-container_18w0z_167",
   "empty-list-message": "_empty-list-message_18w0z_172",
-  ghost: nt,
-  divider: st
-}, _ = $e.bind(at), At = ({
+  ghost: at,
+  divider: ot
+}, _ = He.bind(it), Nt = ({
   multiSelect: n = !1,
   value: r = n ? [] : "",
   options: c = [],
   disabled: a = !1,
   error: h,
   onChange: m,
-  onFocus: A,
-  onBlur: O,
+  onFocus: C,
+  onBlur: A,
   mobileDisabled: F,
-  title: S,
+  title: V,
   touched: U = !1,
   icon: B,
-  variant: ae,
-  placeholder: w = "",
+  variant: ne,
+  placeholder: O = "",
   label: j = "",
   renderOption: q,
-  transparentBackground: oe = !1,
-  className: ie,
+  transparentBackground: se = !1,
+  className: ae,
   toggleButtonClassName: Z,
-  selectListClassName: Ue,
-  isListWidthLimited: Be = !1,
-  optionAll: le = { value: "all", label: "All" },
-  isOptionAllVisible: we = !1,
-  onSelectAll: je = () => {
+  selectListClassName: Fe,
+  isListWidthLimited: Ue = !1,
+  optionAll: oe = { value: "all", label: "All" },
+  isOptionAllVisible: Ee = !1,
+  onSelectAll: Be = () => {
   },
-  formatDisplayedValue: ge,
-  notScrollable: H = !1,
+  formatDisplayedValue: ie,
+  notScrollable: S = !1,
   footer: G,
-  includeGroupValue: Ee = !1,
-  clearable: qe = !1,
-  onClear: ye = () => {
+  includeGroupValue: ye = !1,
+  clearable: je = !1,
+  onClear: Ce = () => {
   },
-  clearButtonAriaLabel: Ze = "Clear selection",
+  clearButtonAriaLabel: qe = "Clear selection",
   menuPortalRoot: g,
   isMultiSelectWithTags: v = !1,
-  noMatchesMessage: Ge = "No matches found",
-  ...Xe
+  noMatchesMessage: Ze = "No matches found",
+  ...Ge
 }) => {
-  const { transformed: Je, remaining: Qe } = Tr(Xe), [l, X] = ne(!1), [I, Ce] = ne(""), Ae = K(null), Oe = K(null), $ = K(null), ce = K(0), de = K(null), ue = K(null), fe = K(""), [er, ve] = ne(!1), [rr, J] = ne(null), L = K(null), W = C(() => We(c), [c]), z = C(() => {
+  const { transformed: Xe, remaining: Je } = kr(Ge), [l, X] = me(!1), [I, Ae] = me(""), Oe = x(null), ve = x(null), H = x(null), le = x(0), ce = x(null), de = x(""), [Qe, J] = me(null), K = x(null), $ = w(() => $e(c), [c]), L = w(() => {
     if (!v || !I.trim())
-      return W;
+      return $;
     const e = I.toLowerCase();
-    return W.filter(
+    return $.filter(
       ({ option: t }) => t.label.toLowerCase().includes(e)
     );
-  }, [W, I, v]), E = C(
-    () => z.map(({ option: e }) => e),
-    [z]
-  ), De = C(
-    () => W.map(({ option: e }) => e),
-    [W]
-  ), Q = C(() => z.filter(({ option: e }) => {
+  }, [$, I, v]), E = w(
+    () => L.map(({ option: e }) => e),
+    [L]
+  ), De = w(
+    () => $.map(({ option: e }) => e),
+    [$]
+  ), Q = w(() => L.filter(({ option: e }) => {
     var t;
     return (t = e.children) == null ? void 0 : t.length;
-  }).map(({ option: e }) => e), [z]), be = C(() => Me(c), [c]), D = C(
+  }).map(({ option: e }) => e), [L]), be = w(() => Me(c), [c]), D = w(
     () => be.map(({ value: e }) => e),
     [be]
-  ), ee = C(() => {
+  ), ee = w(() => {
     const e = /* @__PURE__ */ new Map();
     return Q.forEach((t) => {
-      e.set(t.value, Fe(t));
+      e.set(t.value, We(t));
     }), e;
   }, [Q]), M = N(
     (e) => (Q.forEach((t) => {
       const s = ee.get(t.value) ?? [], i = s.length > 0 && s.every((d) => e.has(d));
-      Ee && i ? e.add(t.value) : e.delete(t.value);
+      ye && i ? e.add(t.value) : e.delete(t.value);
     }), e),
-    [Q, Ee, ee]
-  ), T = C(() => !n || !Array.isArray(r) ? /* @__PURE__ */ new Set() : M(new Set(r)), [n, r, M]), Ne = n ? Array.isArray(r) && r.length > 0 : r || r === !1 || r === 0, tr = qe && Ne && !a, nr = N((e) => {
-    ce.current = e.scrollTop;
+    [Q, ye, ee]
+  ), z = w(() => !n || !Array.isArray(r) ? /* @__PURE__ */ new Set() : M(new Set(r)), [n, r, M]), ue = n ? Array.isArray(r) && r.length > 0 : r || r === !1 || r === 0, er = je && ue && !a, rr = N((e) => {
+    le.current = e.scrollTop;
   }, []);
-  Ve(() => {
-    l && !H && $.current && !(n && L.current !== null) && $.current.scrollTop(ce.current);
-  }, [l, H, r, n]);
-  const { refs: R, floatingStyles: Ie } = yr({
+  Ye(() => {
+    l && !S && H.current && !(n && K.current !== null) && H.current.scrollTop(le.current);
+  }, [l, S, r, n]);
+  const { refs: R, floatingStyles: Ne } = Cr({
     placement: "bottom-start",
     middleware: [
-      Cr(5),
-      Ar({
+      Ar(5),
+      Or({
         fallbackPlacements: ["bottom-start", "top-start", "bottom", "top"],
         ...g && {
           boundary: document.documentElement,
           rootBoundary: "viewport"
         }
       }),
-      g ? Or({
+      g ? vr({
         apply({ rects: e, elements: t }) {
           const s = e.reference.width;
           Object.assign(t.floating.style, {
@@ -231,35 +234,35 @@ const Hr = 240, $r = "data-dropdown-portal-menu", Wr = 10, Mr = (n, r) => {
         }
       }) : null
     ].filter(Boolean),
-    whileElementsMounted: l ? (e, t, s) => vr(e, t, s, {
+    whileElementsMounted: l ? (e, t, s) => Dr(e, t, s, {
       animationFrame: !0
     }) : void 0
-  }), sr = () => {
-    if (!we)
+  }), tr = () => {
+    if (!Ee)
       return;
     const e = Array.isArray(r) ? r : [], t = new Set(e), s = D.some((d) => !t.has(d));
     D.forEach((d) => {
       s ? t.add(d) : t.delete(d);
     });
     const i = M(t);
-    m(Array.from(i)), je();
+    m(Array.from(i)), Be();
   }, re = N(() => {
-    l || (X(!0), A == null || A());
-  }, [l, A]), y = N(() => {
-    X(!1), Ce(""), fe.current = "", O == null || O();
-  }, [O]), he = N(() => {
+    l || (X(!0), C == null || C());
+  }, [l, C]), y = N(() => {
+    X(!1), Ae(""), de.current = "", A == null || A();
+  }, [A]), fe = N(() => {
     if (a)
       return;
-    m(n ? [] : ""), ye(), y(), requestAnimationFrame(() => {
+    m(n ? [] : ""), Ce(), y(), requestAnimationFrame(() => {
       const t = R.reference.current;
       t && t instanceof HTMLElement && t.focus();
     });
-  }, [a, n, m, ye, y, R]), ar = N(
+  }, [a, n, m, Ce, y, R]), nr = N(
     (e) => {
-      e.preventDefault(), e.stopPropagation(), he();
+      e.preventDefault(), e.stopPropagation(), fe();
     },
-    [he]
-  ), Ke = N(
+    [fe]
+  ), Ie = N(
     (e) => {
       var d, o;
       if (!l)
@@ -267,22 +270,22 @@ const Hr = 240, $r = "data-dropdown-portal-menu", Wr = 10, Mr = (n, r) => {
       const t = e == null ? void 0 : e.target;
       if (!t)
         return;
-      const s = (d = Ae.current) == null ? void 0 : d.contains(t), i = (o = Oe.current) == null ? void 0 : o.contains(t);
+      const s = (d = Oe.current) == null ? void 0 : d.contains(t), i = (o = ve.current) == null ? void 0 : o.contains(t);
       !s && !i && y();
     },
     [l, y]
   );
-  Y(() => {
+  W(() => {
     if (!l)
       return;
     const e = (t) => {
-      Ke(t);
+      Ie(t);
     };
     return document.addEventListener("pointerdown", e), () => {
       document.removeEventListener("pointerdown", e);
     };
-  }, [l, Ke]);
-  const Le = (e) => {
+  }, [l, Ie]);
+  const Ke = (e) => {
     var t;
     if (!e.disabled) {
       if (n) {
@@ -300,59 +303,59 @@ const Hr = 240, $r = "data-dropdown-portal-menu", Wr = 10, Mr = (n, r) => {
         m(e.value);
       X((s) => n || !s);
     }
-  }, or = () => E.find(({ value: e }) => e === r), ze = Mr(E, r), {
-    getToggleButtonProps: ir,
-    getLabelProps: lr,
-    getMenuProps: Te,
-    getItemProps: cr,
-    setHighlightedIndex: x,
-    highlightedIndex: _e
-  } = pe({
+  }, sr = () => E.find(({ value: e }) => e === r), Le = Ur(E, r), {
+    getToggleButtonProps: ar,
+    getLabelProps: or,
+    getMenuProps: ze,
+    getItemProps: ir,
+    setHighlightedIndex: T,
+    highlightedIndex: he
+  } = we({
     items: E,
-    itemToString: (e) => (e != null && e.label ? String(e.label) : w) || "",
-    selectedItem: or(),
+    itemToString: (e) => (e != null && e.label ? String(e.label) : O) || "",
+    selectedItem: sr(),
     isOpen: l,
     circularNavigation: !0,
-    defaultHighlightedIndex: ze,
+    defaultHighlightedIndex: Le,
     onHighlightedIndexChange: (e) => {
       switch (e.type) {
-        case pe.stateChangeTypes.MenuKeyDownArrowUp:
-          return J(V.ON_KEY_DOWN), x(Br(E, e.highlightedIndex)), e;
-        case pe.stateChangeTypes.MenuKeyDownArrowDown:
-          return J(V.ON_KEY_DOWN), x(Ur(E, e.highlightedIndex)), e;
+        case we.stateChangeTypes.MenuKeyDownArrowUp:
+          return J(Y.ON_KEY_DOWN), T(qr(E, e.highlightedIndex)), e;
+        case we.stateChangeTypes.MenuKeyDownArrowDown:
+          return J(Y.ON_KEY_DOWN), T(jr(E, e.highlightedIndex)), e;
         default:
           return e;
       }
     }
-  }), xe = N(
+  }), Te = N(
     (e) => {
-      Oe.current = e, R.setFloating(e);
+      ve.current = e, R.setFloating(e);
     },
     [R]
-  ), dr = N(
+  ), lr = N(
     (e = {}) => {
-      const t = Te(e), s = t.ref;
+      const t = ze(e), s = t.ref;
       return {
         ...t,
         ref: (i) => {
-          xe(i), typeof s == "function" ? s(i) : s && (s.current = i);
+          Te(i), typeof s == "function" ? s(i) : s && (s.current = i);
         }
       };
     },
-    [Te, xe]
+    [ze, Te]
   );
-  Y(() => {
-    n && l && L.current !== null && L.current >= 0 && L.current < E.length && (x(L.current), L.current = null, requestAnimationFrame(() => {
-      $.current && !H && $.current.scrollTop(ce.current);
+  W(() => {
+    n && l && K.current !== null && K.current >= 0 && K.current < E.length && (T(K.current), K.current = null, requestAnimationFrame(() => {
+      H.current && !S && H.current.scrollTop(le.current);
     }));
-  }, [n, l, r, E.length, x, H]), Y(() => {
+  }, [n, l, r, E.length, T, S]), W(() => {
     l && v && requestAnimationFrame(() => {
       var e;
-      (e = ue.current) == null || e.focus();
+      (e = ce.current) == null || e.focus();
     });
-  }, [l, v]), Y(() => {
-    v && l && I !== fe.current && (fe.current = I, I && x(0));
-  }, [I, v, l]), Ve(() => {
+  }, [l, v]), W(() => {
+    v && l && I !== de.current && (de.current = I, I && T(0));
+  }, [I, v, l]), Ye(() => {
     if (!l || !g)
       return;
     let e = window.scrollY, t = !0;
@@ -372,7 +375,7 @@ const Hr = 240, $r = "data-dropdown-portal-menu", Wr = 10, Mr = (n, r) => {
     return () => {
       clearTimeout(o), window.removeEventListener("scroll", d, { capture: !0 });
     };
-  }, [l, g]), Y(() => {
+  }, [l, g]), W(() => {
     if (!l || !g)
       return;
     const e = () => {
@@ -382,74 +385,66 @@ const Hr = 240, $r = "data-dropdown-portal-menu", Wr = 10, Mr = (n, r) => {
       window.removeEventListener("resize", e);
     };
   }, [l, g, y]);
-  const ke = () => {
-    a || (X((e) => !e), l ? O == null || O() : A == null || A(), J(V.ON_CLICK));
-  }, te = C(() => {
-    if (n && Array.isArray(r) && D.length > 0 && D.every((t) => T.has(t)))
-      return le.label;
+  const xe = () => {
+    a || (X((e) => !e), l ? A == null || A() : C == null || C(), J(Y.ON_CLICK));
+  }, _e = w(() => {
+    if (n && Array.isArray(r) && D.length > 0 && D.every((t) => z.has(t)))
+      return oe.label;
     const e = E.reduce((t, s) => ((Array.isArray(r) && r.includes(s.value) || s.value === r) && t.push(s.label), t), []);
-    return e.length > 0 ? e.join(", ") : !r && r !== !1 && r !== 0 || Array.isArray(r) && !r.length ? w : typeof r == "string" && r.length > 0 && !w ? r : w || void 0;
+    return e.length > 0 ? e.join(", ") : !r && r !== !1 && r !== 0 || Array.isArray(r) && !r.length ? O : typeof r == "string" && r.length > 0 && !O ? r : O || void 0;
   }, [
     n,
     r,
     D,
-    T,
-    le.label,
+    z,
+    oe.label,
     E,
-    w
-  ]);
-  Y(() => {
-    if (de.current) {
-      const { offsetWidth: e, scrollWidth: t } = de.current;
-      ve(t > e);
-    } else
-      ve(!1);
-  }, [te]);
-  const ur = (e) => {
+    O
+  ]), pe = w(() => ie ? ie(_e) : _e, [ie, _e]), cr = ue && pe ? pe : void 0, { ref: dr, title: ur } = Tr(cr), fr = (e) => {
     const { keyCode: t } = e;
-    Vr.includes(t) && e.target === e.currentTarget && (e.preventDefault(), e.stopPropagation(), !l && (x(ze), re(), J(V.ON_KEY_DOWN)));
-  }, fr = (e) => {
+    Hr.includes(t) && e.target === e.currentTarget && (e.preventDefault(), e.stopPropagation(), !l && (T(Le), re(), J(Y.ON_KEY_DOWN)));
+  }, hr = (e) => {
     const { keyCode: t } = e;
     if (t === p.ENTER_KEY_CODE || t === p.SPACE_KEY_CODE) {
-      const s = E[_e];
+      const s = E[he];
       if (!s)
         return;
-      n && (L.current = _e), Le(s), n || y();
+      n && (K.current = he), Ke(s), n || y();
       return;
     }
-    Sr.includes(t) && (e.stopPropagation(), y());
-  }, Re = () => /* @__PURE__ */ k("div", { className: _("options-container"), children: [
-    n && we && !se(z) && /* @__PURE__ */ k(Ye, { children: [
+    $r.includes(t) && (e.stopPropagation(), y());
+  }, ke = () => /* @__PURE__ */ k("div", { className: _("options-container"), children: [
+    n && Ee && !te(L) && /* @__PURE__ */ k(Pe, { children: [
       /* @__PURE__ */ u(
-        He,
+        Se,
         {
-          option: le,
-          selected: Array.isArray(r) && D.length > 0 && D.every((e) => T.has(e)),
-          onChange: sr,
+          option: oe,
+          selected: Array.isArray(r) && D.length > 0 && D.every((e) => z.has(e)),
+          onChange: tr,
           multiSelect: n,
-          isPartiallyChecked: D.some((e) => T.has(e)) && !D.every((e) => T.has(e))
+          isPartiallyChecked: D.some((e) => z.has(e)) && !D.every((e) => z.has(e))
         }
       ),
       /* @__PURE__ */ u("div", { className: _("divider") }),
       " "
     ] }),
-    se(z) ? /* @__PURE__ */ u("div", { className: _("empty-list-message"), children: Ge }) : z.map(({ option: e, depth: t }, s) => {
+    te(L) ? /* @__PURE__ */ u("div", { className: _("empty-list-message"), children: Ze }) : L.map(({ option: e, depth: t }, s) => {
       var f, b;
-      const i = ee.get(e.value) ?? [e.value], d = n && i.every((P) => T.has(P)), o = n && ((f = e.children) == null ? void 0 : f.length) && i.some((P) => T.has(P)) && !d;
+      const i = ee.get(e.value) ?? [e.value], d = n && i.every((P) => z.has(P)), o = n && ((f = e.children) == null ? void 0 : f.length) && i.some((P) => z.has(P)) && !d;
       return /* @__PURE__ */ u(
-        He,
+        Se,
         {
-          ...cr({
+          ...ir({
             item: e,
             index: s
           }),
           multiSelect: n,
           selected: n ? d : e.value === r,
           option: { title: e.label, ...e },
-          highlightHovered: _e === s && rr !== V.ON_CLICK,
+          highlightHovered: he === s && Qe !== Y.ON_CLICK,
           render: q,
-          onChange: e.disabled ? null : () => Le(e),
-          onMouseEnter: () => x(s),
+          onChange: e.disabled ? null : () => Ke(e),
+          onMouseEnter: () => T(s),
           depth: t,
           hasChildren: !!((b = e.children) != null && b.length),
           isPartiallyChecked: o
@@ -457,24 +452,24 @@ const Hr = 240, $r = "data-dropdown-portal-menu", Wr = 10, Mr = (n, r) => {
         e.value
       );
     }),
-    G && /* @__PURE__ */ k(Ye, { children: [
+    G && /* @__PURE__ */ k(Pe, { children: [
       /* @__PURE__ */ u("div", { className: _("divider") }),
       typeof G == "function" ? G(y) : G
     ] })
-  ] }), hr = () => {
+  ] }), _r = () => {
     const e = De.reduce((o, f) => (Array.isArray(r) && r.includes(f.value) && o.push(f.label), o), []), t = (o) => {
       const f = De.find(
-        ({ label: wr }) => wr === o
+        ({ label: gr }) => gr === o
       );
       if (!f)
         return;
       const b = Array.isArray(r) ? r : [], P = new Set(b);
       P.delete(f.value);
-      const mr = M(P);
-      m(Array.from(mr));
+      const wr = M(P);
+      m(Array.from(wr));
     }, s = (o) => {
       const f = o.target;
-      Ce(f.value), l || (re(), requestAnimationFrame(() => {
+      Ae(f.value), l || (re(), requestAnimationFrame(() => {
         f.focus();
       }));
     }, i = (o) => {
@@ -486,7 +481,7 @@ const Hr = 240, $r = "data-dropdown-portal-menu", Wr = 10, Mr = (n, r) => {
     }, d = /* @__PURE__ */ u(
       "input",
       {
-        ref: ue,
+        ref: ce,
         type: "text",
         className: _("search-input"),
         value: I,
@@ -495,40 +490,35 @@ const Hr = 240, $r = "data-dropdown-portal-menu", Wr = 10, Mr = (n, r) => {
         onClick: (o) => {
           o.stopPropagation(), re();
         },
-        placeholder: se(e) ? w : "",
+        placeholder: te(e) ? O : "",
         autoComplete: "off"
       }
     );
-    return se(e) ? /* @__PURE__ */ u("div", { className: _("tags-wrapper", "with-search"), children: d }) : /* @__PURE__ */ k("div", { className: _("tags-wrapper", "with-search"), children: [
+    return te(e) ? /* @__PURE__ */ u("div", { className: _("tags-wrapper", "with-search"), children: d }) : /* @__PURE__ */ k("div", { className: _("tags-wrapper", "with-search"), children: [
       /* @__PURE__ */ u(
-        Lr,
+        zr,
         {
           tags: e,
           onRemoveTag: t,
           isShowAllView: !0,
-          defaultVisibleLines: Wr
+          defaultVisibleLines: Fr
         }
       ),
       d
     ] });
-  }, _r = () => {
-    if (v && n && Array.isArray(r))
-      return hr();
-    const e = ge ? ge(te) : te, t = Ne && !!e && er;
-    return /* @__PURE__ */ u(
-      "span",
-      {
-        ref: de,
-        className: _("value", {
-          placeholder: te === w
-        }),
-        title: t ? e : void 0,
-        children: e
-      }
-    );
-  }, pr = ir({
-    className: _("dropdown", ae, Z, {
-      "transparent-background": oe,
+  }, pr = () => v && n && Array.isArray(r) ? _r() : /* @__PURE__ */ u(
+    "span",
+    {
+      ref: dr,
+      className: _("value", {
+        placeholder: !ue
+      }),
+      title: ur,
+      children: pe
+    }
+  ), mr = ar({
+    className: _("dropdown", ne, Z, {
+      "transparent-background": se,
       opened: l,
       disabled: a,
       error: h,
@@ -536,24 +526,24 @@ const Hr = 240, $r = "data-dropdown-portal-menu", Wr = 10, Mr = (n, r) => {
       "mobile-disabled": F,
       "multi-select-with-tags": v
     }),
-    onClick: ke,
-    onKeyDown: ur,
+    onClick: xe,
+    onKeyDown: fr,
     ref: R.setReference
-  }), { type: ot, ...Pe } = pr;
+  }), { type: lt, ...Re } = mr;
   return /* @__PURE__ */ k(
     "div",
     {
-      ref: Ae,
-      className: _("container", ie),
-      title: S,
-      ...Qe,
+      ref: Oe,
+      className: _("container", ae),
+      title: V,
       ...Je,
+      ...Xe,
       children: [
         j && /* @__PURE__ */ u(
-          Kr,
+          Lr,
           {
-            ...lr(),
-            onClick: () => !a && ke(),
+            ...or(),
+            onClick: () => !a && xe(),
             style: { cursor: a ? "default" : "pointer" },
             children: j
           }
@@ -561,38 +551,38 @@ const Hr = 240, $r = "data-dropdown-portal-menu", Wr = 10, Mr = (n, r) => {
         /* @__PURE__ */ k(
           "div",
           {
-            ...Pe,
+            ...Re,
             role: "button",
             "aria-disabled": a,
-            tabIndex: a ? -1 : Pe.tabIndex ?? 0,
+            tabIndex: a ? -1 : Re.tabIndex ?? 0,
             children: [
               B && /* @__PURE__ */ u("span", { className: _("icon"), children: B }),
-              /* @__PURE__ */ u("div", { className: _("value-wrapper"), children: _r() }),
-              tr && /* @__PURE__ */ u(
-                br,
+              /* @__PURE__ */ u("div", { className: _("value-wrapper"), children: pr() }),
+              er && /* @__PURE__ */ u(
+                Nr,
                 {
                   className: _("clear-button"),
-                  onClick: ar,
+                  onClick: nr,
                   onKeyDown: (e) => {
                     const { keyCode: t } = e;
-                    (t === p.ENTER_KEY_CODE || t === p.SPACE_KEY_CODE) && (e.preventDefault(), e.stopPropagation(), he());
+                    (t === p.ENTER_KEY_CODE || t === p.SPACE_KEY_CODE) && (e.preventDefault(), e.stopPropagation(), fe());
                   },
-                  "aria-label": Ze,
-                  children: /* @__PURE__ */ u(Nr, {})
+                  "aria-label": qe,
+                  children: /* @__PURE__ */ u(Ir, {})
                 }
               ),
-              /* @__PURE__ */ u("span", { className: _("arrow"), "aria-hidden": "true", children: /* @__PURE__ */ u(Ir, {}) })
+              /* @__PURE__ */ u("span", { className: _("arrow"), "aria-hidden": "true", children: /* @__PURE__ */ u(Kr, {}) })
             ]
           }
         ),
         l && (() => {
           var i;
           const e = (i = R.reference.current) == null ? void 0 : i.getBoundingClientRect().width, t = g && e ? {
-            ...Ie,
+            ...Ne,
             width: `${e}px`,
             minWidth: `${e}px`,
             maxWidth: `${e}px`
-          } : Ie, s = /* @__PURE__ */ u(
+          } : Ne, s = /* @__PURE__ */ u(
             "div",
             {
               style: t,
@@ -600,43 +590,43 @@ const Hr = 240, $r = "data-dropdown-portal-menu", Wr = 10, Mr = (n, r) => {
                 "select-list",
                 {
                   opened: l,
-                  "limited-width": Be
+                  "limited-width": Ue
                 },
-                Ue
+                Fe
               ),
-              ...g && { [$r]: "" },
-              ...dr({
-                onKeyDown: fr,
+              ...g && { [Wr]: "" },
+              ...lr({
+                onKeyDown: hr,
                 ...v && {
                   tabIndex: -1,
                   onFocus: (d) => {
                     var o;
-                    d.preventDefault(), (o = ue.current) == null || o.focus();
+                    d.preventDefault(), (o = ce.current) == null || o.focus();
                   }
                 }
               }),
-              children: H ? Re() : /* @__PURE__ */ u(
-                Dr,
+              children: S ? ke() : /* @__PURE__ */ u(
+                br,
                 {
                   autoHeight: !0,
-                  autoHeightMax: Hr,
+                  autoHeightMax: Mr,
                   hideTracksWhenNotNeeded: !0,
                   ref: (d) => {
-                    $.current = d;
+                    H.current = d;
                   },
-                  onScrollFrame: nr,
-                  children: Re()
+                  onScrollFrame: rr,
+                  children: ke()
                 }
               )
             }
           );
-          return g ? Er(s, g) : s;
+          return g ? yr(s, g) : s;
         })()
       ]
     }
   );
 };
 export {
-  At as D,
-  $r as a
+  Nt as D,
+  Wr as a
 };

package/dist/dropdown.js

@@ -1,5 +1,5 @@
-import { D as r } from "./dropdown-7d024c49.js";
-import { a as n } from "./dropdown-7d024c49.js";
+import { D as r } from "./dropdown-e853293f.js";
+import { a as E } from "./dropdown-e853293f.js";
 import "react/jsx-runtime";
 import "react";
 import "react-dom";
@@ -16,9 +16,12 @@ import "./adaptiveTagList.js";
 import "./button-97d9e587.js";
 import "./close-4d480ef7.js";
 import "./isEmpty-ccacb5ff.js";
+import "react-dnd";
+import "react-dnd-html5-backend";
+import "./useEllipsisTitle-462fa254.js";
 import "./checkbox-493fdc63.js";
 export {
-  n as DROPDOWN_PORTAL_MENU_ATTR,
+  E as DROPDOWN_PORTAL_MENU_ATTR,
   r as Dropdown,
   r as default
 };

package/dist/index.js

@@ -9,9 +9,9 @@ import { BulkPanel as J } from "./bulkPanel.js";
 import { B as _ } from "./button-97d9e587.js";
 import { C as W } from "./checkbox-493fdc63.js";
 import { Chip as j } from "./chip.js";
-import { D as K } from "./datePicker-cde99de3.js";
+import { D as K } from "./datePicker-76a82d23.js";
 import "react-datepicker";
-import { D as Y } from "./dropdown-7d024c49.js";
+import { D as Y } from "./dropdown-e853293f.js";
 import { FieldLabel as $ } from "./fieldLabel.js";
 import { F as ro } from "./fieldNumber-d1b5a7a1.js";
 import { F as to } from "./fieldText-1749da7a.js";

package/dist/modal.js

@@ -1,4 +1,4 @@
-import { jsx as o, jsxs as r, Fragment as F } from "react/jsx-runtime";
+import { jsx as o, jsxs as c, Fragment as F } from "react/jsx-runtime";
 import { useState as v, useRef as G, useEffect as x, useMemo as K } from "react";
 import { Scrollbars as U } from "rc-scrollbars";
 import { AnimatePresence as Y, motion as X } from "framer-motion";
@@ -7,7 +7,7 @@ import { u as q } from "./useOnClickOutside-8f7d68a1.js";
 import "react-dnd";
 import "react-dnd-html5-backend";
 import { u as J } from "./useWindowResize-a7e1ac92.js";
-import { a as Q } from "./dropdown-7d024c49.js";
+import { a as Q } from "./dropdown-e853293f.js";
 import { K as V } from "./keyCodes-f63c0e11.js";
 import { B as A } from "./button-97d9e587.js";
 import { Tooltip as Z } from "./tooltip.js";
@@ -21,6 +21,7 @@ import "./dropdown-0260bb66.js";
 import "./fieldLabel.js";
 import "./adaptiveTagList.js";
 import "./isEmpty-ccacb5ff.js";
+import "./useEllipsisTitle-462fa254.js";
 import "./checkbox-493fdc63.js";
 import "@floating-ui/react";
 import "./floatingUi-41f8c7b5.js";
@@ -43,9 +44,9 @@ const eo = {
     const m = /* @__PURE__ */ o(A, { adjustWidthOn: l === "small" ? "parent" : "min-width", ...d });
     return u ? /* @__PURE__ */ o(Z, { content: u, placement: "top", width: 270, children: m }) : m;
   };
-  return /* @__PURE__ */ r("div", { className: h("modal-footer", { "with-extra-node": e, [`size-${l}`]: l }), children: [
+  return /* @__PURE__ */ c("div", { className: h("modal-footer", { "with-extra-node": e, [`size-${l}`]: l }), children: [
     e && e,
-    /* @__PURE__ */ r("div", { className: h("buttons-block"), children: [
+    /* @__PURE__ */ c("div", { className: h("buttons-block"), children: [
       p && /* @__PURE__ */ o("div", { className: h("button-container"), children: /* @__PURE__ */ o(
         A,
         {
@@ -64,22 +65,22 @@ const eo = {
   "modal-header-content": "_modal-header-content_w4aaf_14",
   "modal-title": "_modal-title_w4aaf_20",
   "close-modal-icon": "_close-modal-icon_w4aaf_29"
-}, f = w.bind(so), io = ({ title: e, onClose: n, withDescription: a = !1 }) => /* @__PURE__ */ r("div", { className: f("modal-header", { "width-description": a }), children: [
+}, f = w.bind(so), io = ({ title: e, onClose: n, withDescription: a = !1 }) => /* @__PURE__ */ c("div", { className: f("modal-header", { "width-description": a }), children: [
   /* @__PURE__ */ o("div", { className: f("modal-header-content"), children: e && /* @__PURE__ */ o("div", { className: f("modal-title"), children: e }) }),
   /* @__PURE__ */ o(oo, { className: f("close-modal-icon"), onClick: n, children: /* @__PURE__ */ o(to, {}) })
-] }), co = "_modal_35896_1", ro = "_description_35896_43", mo = {
-  modal: co,
+] }), ro = "_modal_35896_1", co = "_description_35896_43", mo = {
+  modal: ro,
   "overlay-default": "_overlay-default_35896_12",
   "overlay-light-cyan": "_overlay-light-cyan_35896_16",
   "scrolling-content": "_scrolling-content_35896_20",
   "modal-window": "_modal-window_35896_26",
-  description: ro,
+  description: co,
   "scrollable-wrapper": "_scrollable-wrapper_35896_54",
   "scrollable-content": "_scrollable-content_35896_58",
   "size-default": "_size-default_35896_62",
   "size-small": "_size-small_35896_74",
   "size-large": "_size-large_35896_86"
-}, c = w.bind(mo), _o = 0.9, po = 32 + 24, uo = 32 + 8, ho = 36 + 16, fo = 32 * 2, Fo = ({
+}, r = w.bind(mo), _o = 0.9, po = 32 + 24, uo = 32 + 8, ho = 36 + 16, fo = 32 * 2, Go = ({
   title: e,
   children: n,
   footerNode: a,
@@ -121,10 +122,10 @@ const eo = {
     }),
     []
   );
-  return q(i, C ? _ : void 0, B), /* @__PURE__ */ o(Y, { onExitComplete: g, children: I && /* @__PURE__ */ o("div", { className: c("modal", { [`overlay-${m}`]: m }), style: { zIndex: D }, children: /* @__PURE__ */ r(
+  return q(i, C ? _ : void 0, B), /* @__PURE__ */ o(Y, { onExitComplete: g, children: I && /* @__PURE__ */ o("div", { className: r("modal", { [`overlay-${m}`]: m }), style: { zIndex: D }, children: /* @__PURE__ */ c(
     X.div,
     {
-      className: c("modal-window", { [`size-${d}`]: d }, u),
+      className: r("modal-window", { [`size-${d}`]: d }, u),
       ref: i,
       tabIndex: 0,
       initial: { opacity: 0, marginTop: -b },
@@ -134,19 +135,19 @@ const eo = {
       onAnimationStart: W,
       children: [
         /* @__PURE__ */ o(io, { title: e, onClose: _, withDescription: !!s }),
-        k ? /* @__PURE__ */ o("div", { className: c("scrollable-wrapper"), children: /* @__PURE__ */ o(
+        k ? /* @__PURE__ */ o("div", { className: r("scrollable-wrapper"), children: /* @__PURE__ */ o(
           U,
           {
             autoHeight: !0,
             autoHeightMax: P(),
             hideTracksWhenNotNeeded: !0,
-            children: /* @__PURE__ */ r("div", { className: c("scrollable-content"), children: [
-              s && /* @__PURE__ */ o("span", { className: c("description"), children: s }),
+            children: /* @__PURE__ */ c("div", { className: r("scrollable-content"), children: [
+              s && /* @__PURE__ */ o("span", { className: r("description"), children: s }),
               /* @__PURE__ */ o(T, { children: n })
             ] })
           }
-        ) }) : /* @__PURE__ */ r(F, { children: [
-          s && /* @__PURE__ */ o("span", { className: c("description"), children: s }),
+        ) }) : /* @__PURE__ */ c(F, { children: [
+          s && /* @__PURE__ */ o("span", { className: r("description"), children: s }),
           /* @__PURE__ */ o(T, { children: n })
         ] }),
         !y && (N ? N(_) : /* @__PURE__ */ o(
@@ -165,7 +166,7 @@ const eo = {
   ) }) });
 };
 export {
-  Fo as Modal,
+  Go as Modal,
   T as ModalContent,
   lo as ModalFooter,
   io as ModalHeader

package/dist/sidePanel.js

@@ -5,7 +5,7 @@ import { K as A } from "./keyCodes-f63c0e11.js";
 import { u as B } from "./useOnClickOutside-8f7d68a1.js";
 import "react-dnd";
 import "react-dnd-html5-backend";
-import { a as L } from "./dropdown-7d024c49.js";
+import { a as L } from "./dropdown-e853293f.js";
 import { S as T } from "./close-4d480ef7.js";
 import { B as j } from "./baseIconButton-251479f7.js";
 import "react-dom";
@@ -18,6 +18,7 @@ import "./fieldLabel.js";
 import "./adaptiveTagList.js";
 import "./button-97d9e587.js";
 import "./isEmpty-ccacb5ff.js";
+import "./useEllipsisTitle-462fa254.js";
 import "./checkbox-493fdc63.js";
 const M = "_active_5ebdz_11", F = "_compact_5ebdz_62", H = "_header_5ebdz_58", O = "_title_5ebdz_88", U = "_description_5ebdz_99", W = "_content_5ebdz_108", Y = "_footer_5ebdz_115", q = "_divider_5ebdz_121", w = {
   "side-panel-overlay": "_side-panel-overlay_5ebdz_1",
@@ -37,16 +38,16 @@ const M = "_active_5ebdz_11", F = "_compact_5ebdz_62", H = "_header_5ebdz_58", O
   content: W,
   footer: Y,
   divider: q
-}, e = $.bind(w), ve = ({
+}, e = $.bind(w), fe = ({
   className: u,
-  title: r,
+  title: d,
   descriptionComponent: o,
   headerComponent: c,
   contentComponent: n,
   footerComponent: l,
   top: _ = 0,
   side: z = "right",
-  isOpen: d = !0,
+  isOpen: r = !0,
   onClose: t,
   closeButtonAriaLabel: y = "Close panel",
   showOverlay: m = !1,
@@ -64,10 +65,10 @@ const M = "_active_5ebdz_11", F = "_compact_5ebdz_62", H = "_header_5ebdz_58", O
   );
   B(
     f,
-    s && m && d ? t : void 0,
+    s && m && r ? t : void 0,
     E
   ), P(() => {
-    if (!d || !t)
+    if (!r || !t)
       return;
     const b = (x) => {
       const { keyCode: R } = x;
@@ -76,22 +77,22 @@ const M = "_active_5ebdz_11", F = "_compact_5ebdz_62", H = "_header_5ebdz_58", O
     return document.addEventListener("keydown", b, !1), () => {
       document.removeEventListener("keydown", b, !1);
     };
-  }, [d, t, s]);
+  }, [r, t, s]);
   const k = !!(c || o), h = /* @__PURE__ */ a(
     "aside",
     {
       ref: f,
-      className: e("side-panel", `side-${z}`, { active: d }, u),
+      className: e("side-panel", `side-${z}`, { active: r }, u),
       role: "dialog",
       "aria-modal": "true",
-      "aria-hidden": !d,
-      "aria-labelledby": r ? v : void 0,
+      "aria-hidden": !r,
+      "aria-labelledby": d ? v : void 0,
       style: { top: _, height: `calc(100vh - ${_}px)` },
       tabIndex: -1,
       children: [
         /* @__PURE__ */ a("div", { className: e("header-section", { compact: !k }), children: [
-          (c || r) && /* @__PURE__ */ a("div", { className: e("header"), children: [
-            r ? /* @__PURE__ */ i("span", { id: v, className: e("title"), children: r }) : c,
+          (c || d) && /* @__PURE__ */ a("div", { className: e("header"), children: [
+            d ? /* @__PURE__ */ i("span", { id: v, className: e("title"), children: d }) : c,
             t && /* @__PURE__ */ i(
               j,
               {
@@ -118,7 +119,7 @@ const M = "_active_5ebdz_11", F = "_compact_5ebdz_62", H = "_header_5ebdz_58", O
     {
       className: e(
         "side-panel-overlay",
-        { active: d },
+        { active: r },
         p && `overlay-${p}`,
         N
       ),
@@ -127,5 +128,5 @@ const M = "_active_5ebdz_11", F = "_compact_5ebdz_62", H = "_header_5ebdz_58", O
   ) : h;
 };
 export {
-  ve as SidePanel
+  fe as SidePanel
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reportportal/ui-kit",
-  "version": "0.0.1-alpha.172",
+  "version": "0.0.1-alpha.173",
   "description": "The UI-kit library for ReportPortal Design System.",
   "type": "module",
   "scripts": {