@livechat/design-system-react-components 1.0.0-refresh-ui.1 → 1.0.0-refresh-ui.2

package/dist/dsrc.es.js

@@ -1,12 +1,12 @@
 var Wa = Object.defineProperty, Va = Object.defineProperties;
 var Ya = Object.getOwnPropertyDescriptors;
-var ut = Object.getOwnPropertySymbols;
+var mt = Object.getOwnPropertySymbols;
 var jt = Object.prototype.hasOwnProperty, ea = Object.prototype.propertyIsEnumerable;
 var Pt = (t, a, r) => a in t ? Wa(t, a, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[a] = r, $ = (t, a) => {
   for (var r in a || (a = {}))
     jt.call(a, r) && Pt(t, r, a[r]);
-  if (ut)
-    for (var r of ut(a))
+  if (mt)
+    for (var r of mt(a))
       ea.call(a, r) && Pt(t, r, a[r]);
   return t;
 }, I = (t, a) => Va(t, Ya(a));
@@ -14,14 +14,14 @@ var B = (t, a) => {
   var r = {};
   for (var _ in t)
     jt.call(t, _) && a.indexOf(_) < 0 && (r[_] = t[_]);
-  if (t != null && ut)
-    for (var _ of ut(t))
+  if (t != null && mt)
+    for (var _ of mt(t))
       a.indexOf(_) < 0 && ea.call(t, _) && (r[_] = t[_]);
   return r;
 };
 var At = (t, a, r) => (Pt(t, typeof a != "symbol" ? a + "" : a, r), r);
 import * as e from "react";
-import { useReducer as qa, useRef as Ja, useEffect as We, useCallback as mt, useMemo as pt } from "react";
+import { useReducer as qa, useRef as Ja, useEffect as We, useCallback as pt, useMemo as gt } from "react";
 import f, { clsx as Fe } from "clsx";
 import { useFloating as $a, offset as wa, flip as Ca, autoUpdate as Na, arrow as Ka } from "@floating-ui/react-dom";
 import { Close as Se, Info as qt, Warning as xa, CheckCircle as Sa, Block as Da, Person as Za, ChevronUp as Dt, ChevronDown as Tt, VisibilityOn as Qa, VisibilityOff as Xa, Check as Jt, Search as ja, LockBlackFilled as er, Refresh as tr, Error as ar } from "@livechat/design-system-icons/react/tabler";
@@ -339,7 +339,7 @@ const Qo = {
   comma: ",",
   arrowUp: "ArrowUp",
   arrowDown: "ArrowDown"
-}, ir = "lc-Typography-module__caps___c3eNJ", ot = {
+}, ir = "lc-Typography-module__caps___c3eNJ", lt = {
   "heading-xl": "lc-Typography-module__heading-xl___nhr-6",
   "heading-lg": "lc-Typography-module__heading-lg___XYF7l",
   "heading-md": "lc-Typography-module__heading-md___wHOIs",
@@ -361,7 +361,7 @@ const Qo = {
   md: "h3",
   sm: "h4",
   xs: "h5"
-}, st = (l) => {
+}, it = (l) => {
   var c = l, {
     as: t,
     size: a = "md",
@@ -375,7 +375,7 @@ const Qo = {
   ]);
   return e.createElement(
     t || dr[a],
-    $({ className: f(ot[`heading-${a}`], _) }, o),
+    $({ className: f(lt[`heading-${a}`], _) }, o),
     r
   );
 }, P = (d) => {
@@ -404,10 +404,10 @@ const Qo = {
     $({
       className: f(
         {
-          [ot[`${s}`]]: !0,
-          [ot[`${s}--bold`]]: _,
-          [ot[`${s}--strike`]]: l,
-          [ot[`${s}--underline`]]: o
+          [lt[`${s}`]]: !0,
+          [lt[`${s}--bold`]]: _,
+          [lt[`${s}--strike`]]: l,
+          [lt[`${s}--underline`]]: o
         },
         u
       )
@@ -979,7 +979,7 @@ const Br = "lc-Avatar-module__avatar___1zTCE", Pr = "lc-Avatar-module__avatar__s
 function Rr(t, a) {
   return t > a ? `${a}+` : `${t}`;
 }
-const Mr = "lc-Badge-module__badge___GhLnu", Lr = "lc-Badge-module__badge__dot___z6RO6", gt = {
+const Mr = "lc-Badge-module__badge___GhLnu", Lr = "lc-Badge-module__badge__dot___z6RO6", ft = {
   badge: Mr,
   badge__dot: Lr,
   "badge--large": "lc-Badge-module__badge--large___B131q",
@@ -988,7 +988,7 @@ const Mr = "lc-Badge-module__badge___GhLnu", Lr = "lc-Badge-module__badge__dot__
   "badge--primary": "lc-Badge-module__badge--primary___8LRpp",
   "badge--secondary": "lc-Badge-module__badge--secondary___JjNIJ",
   "badge--tertiary": "lc-Badge-module__badge--tertiary___e83wV"
-}, ft = "badge", Or = (u) => {
+}, bt = "badge", Or = (u) => {
   var n = u, {
     className: t,
     count: a = 0,
@@ -1006,19 +1006,19 @@ const Mr = "lc-Badge-module__badge___GhLnu", Lr = "lc-Badge-module__badge__dot__
   ]);
   const d = f(
     t,
-    gt[ft],
-    gt[`${ft}--${_}`],
-    gt[`${ft}--${o}`]
+    ft[bt],
+    ft[`${bt}--${_}`],
+    ft[`${bt}--${o}`]
   ), p = {
     counter: Rr(a, r),
     alert: "!",
-    dot: /* @__PURE__ */ e.createElement("span", { className: gt[`${ft}__dot`] })
+    dot: /* @__PURE__ */ e.createElement("span", { className: ft[`${bt}__dot`] })
   }[l];
   return /* @__PURE__ */ e.createElement("span", $({ className: d }, c), p);
 };
 function Wt() {
 }
-const Hr = "lc-SegmentedControl-module__btn___tfsvL", bt = {
+const Hr = "lc-SegmentedControl-module__btn___tfsvL", vt = {
   "segmented-control": "lc-SegmentedControl-module__segmented-control___LHWSk",
   btn: Hr,
   "btn--active": "lc-SegmentedControl-module__btn--active___Za-th",
@@ -1034,14 +1034,14 @@ const Hr = "lc-SegmentedControl-module__btn___tfsvL", bt = {
   fullWidth: l = !1,
   onButtonClick: c = Wt
 }) => {
-  const u = f(bt[zr], r), [n, d] = e.useState(() => _), p = typeof o == "string";
+  const u = f(vt[zr], r), [n, d] = e.useState(() => _), p = typeof o == "string";
   e.useEffect(() => {
     p && d(o);
   }, [o]);
   const s = (v, h) => {
     p || d(v), c(v, h);
   }, m = a.map(({ id: v, label: h, loading: b, disabled: i, icon: k }) => {
-    const y = v === n, w = y ? bt["btn--active"] : "", N = y ? !1 : b;
+    const y = v === n, w = y ? vt["btn--active"] : "", N = y ? !1 : b;
     return /* @__PURE__ */ e.createElement(
       se,
       {
@@ -1052,7 +1052,7 @@ const Hr = "lc-SegmentedControl-module__btn___tfsvL", bt = {
         "aria-pressed": y,
         kind: "secondary",
         icon: k,
-        className: f(bt.btn, bt[`btn--${t}`], w),
+        className: f(vt.btn, vt[`btn--${t}`], w),
         onClick: (E) => {
           s(v, E);
         }
@@ -1075,7 +1075,7 @@ const Hr = "lc-SegmentedControl-module__btn___tfsvL", bt = {
   card__actions__line: Zr,
   card__actions__buttons: Qr,
   "card__actions__buttons-expander": "lc-Card-module__card__actions__buttons-expander___lz4h-"
-}, nt = "card", St = `${nt}__header`, Ft = `${St}__heading`, vt = `${nt}__actions`, Xr = `${St}__no-image`, ll = (d) => {
+}, st = "card", St = `${st}__header`, Ft = `${St}__heading`, ht = `${st}__actions`, Xr = `${St}__no-image`, ll = (d) => {
   var p = d, {
     alt: t,
     buttonsOptions: a = [],
@@ -1096,27 +1096,27 @@ const Hr = "lc-SegmentedControl-module__btn___tfsvL", bt = {
     "title"
   ]);
   const [s, m] = e.useState(!1), v = s ? Dt : Tt, h = s ? "Hide" : "Show more", b = (a == null ? void 0 : a.length) > 0, i = !!l, k = b || i, y = u, w = c, N = w ? "" : ee[Xr];
-  return /* @__PURE__ */ e.createElement("div", $({ className: f(ee[nt], _) }, n), y && /* @__PURE__ */ e.createElement("div", { className: f(ee[St], N) }, w && /* @__PURE__ */ e.createElement(
+  return /* @__PURE__ */ e.createElement("div", $({ className: f(ee[st], _) }, n), y && /* @__PURE__ */ e.createElement("div", { className: f(ee[St], N) }, w && /* @__PURE__ */ e.createElement(
     "img",
     {
       alt: t,
       className: ee[`${St}__image`],
       src: c
     }
-  ), /* @__PURE__ */ e.createElement("div", { className: ee[Ft] }, /* @__PURE__ */ e.createElement(st, { size: "sm", className: ee[`${Ft}__title`] }, u), /* @__PURE__ */ e.createElement(P, { size: "sm", className: ee[`${Ft}__description`] }, o))), /* @__PURE__ */ e.createElement(P, { as: "div", size: "md", className: ee[`${nt}__content`] }, r), s && /* @__PURE__ */ e.createElement(
+  ), /* @__PURE__ */ e.createElement("div", { className: ee[Ft] }, /* @__PURE__ */ e.createElement(it, { size: "sm", className: ee[`${Ft}__title`] }, u), /* @__PURE__ */ e.createElement(P, { size: "sm", className: ee[`${Ft}__description`] }, o))), /* @__PURE__ */ e.createElement(P, { as: "div", size: "md", className: ee[`${st}__content`] }, r), s && /* @__PURE__ */ e.createElement(
     P,
     {
       as: "div",
       size: "md",
-      className: ee[`${nt}__expanded-content`]
+      className: ee[`${st}__expanded-content`]
     },
     l
-  ), k && /* @__PURE__ */ e.createElement("div", { className: ee[vt] }, /* @__PURE__ */ e.createElement("div", { className: ee[`${vt}__line`] }), /* @__PURE__ */ e.createElement("div", { className: ee[`${vt}__buttons`] }, b && a.map(
+  ), k && /* @__PURE__ */ e.createElement("div", { className: ee[ht] }, /* @__PURE__ */ e.createElement("div", { className: ee[`${ht}__line`] }), /* @__PURE__ */ e.createElement("div", { className: ee[`${ht}__buttons`] }, b && a.map(
     ({ kind: E, onClick: g, children: x }) => /* @__PURE__ */ e.createElement(se, { size: "compact", kind: E, onClick: g }, x)
   ), i && /* @__PURE__ */ e.createElement(
     se,
     {
-      className: ee[`${vt}__buttons-expander`],
+      className: ee[`${ht}__buttons-expander`],
       kind: "plain",
       iconPosition: "right",
       icon: /* @__PURE__ */ e.createElement(T, { source: v }),
@@ -1306,14 +1306,14 @@ const Hr = "lc-SegmentedControl-module__btn___tfsvL", bt = {
   }) : _ < 0 ? I($({}, r), {
     [S[`${D}__day--start`]]: a
   }) : r;
-}, lt = (t, a) => {
+}, ct = (t, a) => {
   const r = a.find((_) => _.id === t);
   return r || void 0;
 }, sa = (t, a) => !!(!t || t && a), i_ = (t) => {
   const a = {};
   if (!t.initialSelectedItemKey)
     return a;
-  const r = lt(
+  const r = ct(
     t.initialSelectedItemKey,
     t.options
   );
@@ -1534,7 +1534,7 @@ const g_ = (t) => {
     const { from: b, selectedItem: i, to: k } = n;
     if (!(b && k))
       return;
-    const y = lt(i, t);
+    const y = ct(i, t);
     y && (l == null || l(I($({}, y), {
       value: {
         from: b,
@@ -1549,7 +1549,7 @@ const g_ = (t) => {
       l(null);
       return;
     }
-    if (!lt(b, t))
+    if (!ct(b, t))
       return;
     const k = t.reduce(
       (y, w) => I($({}, y), { [w.id]: w }),
@@ -1557,7 +1557,7 @@ const g_ = (t) => {
     );
     l(k[b]);
   }, [l, n.selectedItem, t]);
-  const p = mt(
+  const p = pt(
     (b) => {
       const i = o ? Ba(o, b) >= 0 : !0;
       !sa(n.from, n.to) && i && d({
@@ -1566,7 +1566,7 @@ const g_ = (t) => {
       });
     },
     [o, n.from, n.to]
-  ), s = mt(
+  ), s = pt(
     (b) => {
       const { from: i, to: k } = n;
       Fa(b, { to: o }) && (sa(i, k) ? d({
@@ -1581,7 +1581,7 @@ const g_ = (t) => {
       }));
     },
     [o, n.from, n.to]
-  ), m = mt(
+  ), m = pt(
     (b) => {
       if (b === null) {
         d({
@@ -1590,23 +1590,23 @@ const g_ = (t) => {
         });
         return;
       }
-      lt(b, t) && d({
+      ct(b, t) && d({
         type: M.NEW_SELECTED_ITEM,
         payload: { selectedItem: b }
       });
     },
     [t]
-  ), v = mt((b) => {
+  ), v = pt((b) => {
     d({
       type: M.CURRENT_MONTH_CHANGE,
       payload: { date: b }
     });
   }, []);
   return c((() => {
-    const { currentMonth: b, from: i, selectedItem: k, temporaryTo: y, to: w } = n, N = pt(
+    const { currentMonth: b, from: i, selectedItem: k, temporaryTo: y, to: w } = n, N = gt(
       () => s_(i, y),
       [i, y]
-    ), E = pt(() => lt(k, t), [t, k]), g = pt(() => [i, { from: i, to: y }], [i, y]), x = pt(() => o ? { after: o } : void 0, [o]);
+    ), E = gt(() => ct(k, t), [t, k]), g = gt(() => [i, { from: i, to: y }], [i, y]), x = gt(() => o ? { after: o } : void 0, [o]);
     return {
       select: {
         onItemSelect: m,
@@ -1711,7 +1711,7 @@ const da = {
     "helperText",
     "formFooter"
   ]);
-  return /* @__PURE__ */ e.createElement("form", $({ className: f(Qe[Xe], t) }, l), (r || _) && /* @__PURE__ */ e.createElement("div", { className: Qe[`${Xe}__header`] }, r && /* @__PURE__ */ e.createElement(st, { size: "sm", className: Qe[`${Xe}__label`] }, r), _ && /* @__PURE__ */ e.createElement(P, { as: "p", size: "sm", className: Qe[`${Xe}__helper`] }, _)), a, o && /* @__PURE__ */ e.createElement("div", { className: Qe[`${Xe}__footer`] }, o));
+  return /* @__PURE__ */ e.createElement("form", $({ className: f(Qe[Xe], t) }, l), (r || _) && /* @__PURE__ */ e.createElement("div", { className: Qe[`${Xe}__header`] }, r && /* @__PURE__ */ e.createElement(it, { size: "sm", className: Qe[`${Xe}__label`] }, r), _ && /* @__PURE__ */ e.createElement(P, { as: "p", size: "sm", className: Qe[`${Xe}__helper`] }, _)), a, o && /* @__PURE__ */ e.createElement("div", { className: Qe[`${Xe}__footer`] }, o));
 }, L = {
   "form-field": "lc-FormField-module__form-field___JqnX6",
   "form-field--inline": "lc-FormField-module__form-field--inline___4DgIq",
@@ -1816,12 +1816,12 @@ const da = {
       r
     ))
   ));
-}, ht = {
+}, yt = {
   "form-group": "lc-FormGroup-module__form-group___e2JHa",
   "form-group__header": "lc-FormGroup-module__form-group__header___DgGmR",
   "form-group__label": "lc-FormGroup-module__form-group__label___NC-JW",
   "form-group__helper": "lc-FormGroup-module__form-group__helper___SRuxe"
-}, yt = "form-group", dl = (l) => {
+}, kt = "form-group", dl = (l) => {
   var c = l, {
     className: t = "",
     children: a,
@@ -1833,7 +1833,7 @@ const da = {
     "labelText",
     "helperText"
   ]);
-  const u = f(ht[yt], t);
+  const u = f(yt[kt], t);
   return /* @__PURE__ */ e.createElement(
     "div",
     I($(I($({}, o), {
@@ -1841,7 +1841,7 @@ const da = {
     }), r && { "aria-label": r }), {
       className: u
     }),
-    /* @__PURE__ */ e.createElement("div", { className: ht[`${yt}__header`] }, /* @__PURE__ */ e.createElement(st, { as: "div", size: "sm", className: ht[`${yt}__label`] }, r), _ && /* @__PURE__ */ e.createElement(P, { as: "div", size: "sm", className: ht[`${yt}__helper`] }, _)),
+    /* @__PURE__ */ e.createElement("div", { className: yt[`${kt}__header`] }, /* @__PURE__ */ e.createElement(it, { as: "div", size: "sm", className: yt[`${kt}__label`] }, r), _ && /* @__PURE__ */ e.createElement(P, { as: "div", size: "sm", className: yt[`${kt}__helper`] }, _)),
     a
   );
 }, E_ = "lc-Input-module__input___qeMAQ", ye = {
@@ -1949,7 +1949,7 @@ const da = {
   modal__heading: N_,
   "modal__label-heading": "lc-Modal-module__modal__label-heading___WnYcF",
   modal__footer: x_
-}, kt = "modal-base", S_ = (u) => {
+}, Et = "modal-base", S_ = (u) => {
   var n = u, {
     children: t,
     className: a = "",
@@ -1966,9 +1966,9 @@ const da = {
     "fullSpaceContent"
   ]);
   const d = f(
-    H[kt],
+    H[Et],
     a,
-    l && H[`${kt}--full-space`]
+    l && H[`${Et}--full-space`]
   );
   e.useEffect(() => {
     if (!_)
@@ -1987,8 +1987,8 @@ const da = {
       "data-testid": "lc-modal-overlay",
       onMouseDown: p,
       className: f(
-        H[`${kt}__overlay`],
-        H[`${kt}__overlay--visible`]
+        H[`${Et}__overlay`],
+        H[`${Et}__overlay--visible`]
       )
     },
     /* @__PURE__ */ e.createElement(
@@ -2046,7 +2046,7 @@ const da = {
       onClose: c
     }, u),
     _ && /* @__PURE__ */ e.createElement("div", { className: H[`${Ae}__label-header`] }, /* @__PURE__ */ e.createElement(
-      st,
+      it,
       {
         size: "xs",
         as: "div",
@@ -2062,7 +2062,7 @@ const da = {
       }
     )),
     !_ && r && /* @__PURE__ */ e.createElement("div", { className: H[`${Ae}__header`] }, /* @__PURE__ */ e.createElement(
-      st,
+      it,
       {
         size: "sm",
         as: "div",
@@ -2588,7 +2588,7 @@ const da = {
   e.useEffect(() => {
     u && (p(""), m.current && (m.current.value = "", m.current.focus()));
   }, [o, u]);
-  const v = (i) => l === "single" && t && !a ? null : i != null && i.customElement ? /* @__PURE__ */ e.createElement("div", { className: we[`${Ce}__custom`] }, i.customElement.selectedItemBody) : /* @__PURE__ */ e.createElement("div", { className: we[`${Ce}__item`] }, i.name), h = (i) => {
+  const v = (i) => l === "single" && t && !a ? null : i != null && i.customElement ? /* @__PURE__ */ e.createElement("div", { className: we[`${Ce}__item`] }, i.customElement.selectedItemBody) : /* @__PURE__ */ e.createElement("div", { className: we[`${Ce}__item`] }, i.name), h = (i) => {
     p(i.target.value);
   }, b = () => /* @__PURE__ */ e.createElement(
     "input",
@@ -2681,7 +2681,7 @@ const da = {
   }, Re = (A) => {
     if (s === "single")
       return E(!1), i([A]);
-    const z = A.key, X = dt;
+    const z = A.key, X = ut;
     if (!X)
       return i([A]);
     const Ie = X.includes(
@@ -2695,7 +2695,7 @@ const da = {
     i(Ua);
   }, De = (A) => !A.disabled && !A.groupHeader && A.key !== ze, Te = () => {
     E(!1);
-    const A = it.filter(De);
+    const A = dt.filter(De);
     i(A);
   }, Ue = () => {
     E(!1), i(null);
@@ -2704,12 +2704,12 @@ const da = {
     if ((z == null ? void 0 : z.length) === 0)
       return i(null);
     i(z);
-  }, it = e.useMemo(() => g ? _.filter((A) => {
+  }, dt = e.useMemo(() => g ? _.filter((A) => {
     if (A.groupHeader)
       return !1;
     const z = g.toLowerCase();
     return A.name.toLowerCase().includes(z);
-  }) : _, [g, _]), dt = e.useMemo(() => o ? o.map((A) => A.key) : null, [o]);
+  }) : _, [g, _]), ut = e.useMemo(() => o ? o.map((A) => A.key) : null, [o]);
   return /* @__PURE__ */ e.createElement("div", { ref: Z, className: te, id: k.id }, /* @__PURE__ */ e.createElement("div", { className: va[`${ha}__container`] }, /* @__PURE__ */ e.createElement(
     I_,
     {
@@ -2745,8 +2745,8 @@ const da = {
   ), /* @__PURE__ */ e.createElement(
     T_,
     {
-      selectedItemsKeys: dt,
-      items: it,
+      selectedItemsKeys: ut,
+      items: dt,
       isOpen: N,
       isMultiSelect: s === "multi",
       emptyStateText: d,
@@ -2841,7 +2841,7 @@ const tt = {
       ))
     );
   }
-), Et = {
+), $t = {
   "progress-bar": "lc-ProgressBar-module__progress-bar___3pa3d",
   "progress-bar--small": "lc-ProgressBar-module__progress-bar--small___7nQKx",
   "progress-bar--medium": "lc-ProgressBar-module__progress-bar--medium___cM44p",
@@ -2851,7 +2851,7 @@ const tt = {
   "progress-bar--normal": "lc-ProgressBar-module__progress-bar--normal___ZwCb-",
   "progress-bar__indicator--success": "lc-ProgressBar-module__progress-bar__indicator--success___wRjR3",
   "progress-bar__indicator--normal": "lc-ProgressBar-module__progress-bar__indicator--normal___0Uhle"
-}, $t = "progress-bar", Y_ = e.forwardRef(
+}, wt = "progress-bar", Y_ = e.forwardRef(
   (c, l) => {
     var u = c, {
       status: t = "normal",
@@ -2865,10 +2865,10 @@ const tt = {
       "className"
     ]);
     const n = Oa(t, a), d = La(n, a), p = f(
-      Et[$t],
+      $t[wt],
       {
-        [Et[`${$t}--${r}`]]: r,
-        [Et[`${$t}--${t}`]]: t
+        [$t[`${wt}--${r}`]]: r,
+        [$t[`${wt}--${t}`]]: t
       },
       _
     );
@@ -2882,7 +2882,7 @@ const tt = {
       /* @__PURE__ */ e.createElement(
         "div",
         {
-          className: Et[`${$t}__indicator--${t}`],
+          className: $t[`${wt}__indicator--${t}`],
           style: { width: `${d}%` }
         }
       )
@@ -3307,7 +3307,7 @@ const tt = {
       dangerouslySetInnerHTML: { __html: ra(l) }
     }
   );
-}, ct = {
+}, nt = {
   "tag-input": "lc-TagInput-module__tag-input___CLVY-",
   "tag-input--error": "lc-TagInput-module__tag-input--error___RP0SB",
   "tag-input__input": "lc-TagInput-module__tag-input__input___dgEYB",
@@ -3338,14 +3338,14 @@ const tt = {
         value: t,
         inputRef: o,
         innerEditableRef: n,
-        className: ct[`${so}__content`],
+        className: nt[`${so}__content`],
         change: (p) => l(a, p),
         remove: d,
         validator: _
       }
     )
   );
-}, wt = "tag-input", uo = [
+}, Ct = "tag-input", uo = [
   R.enter,
   R.spacebar,
   R.tab,
@@ -3369,11 +3369,11 @@ const tt = {
     "placeholder",
     "size"
   ]);
-  const p = f(ct[wt], {
-    [ct[`${wt}--error`]]: o
+  const p = f(nt[Ct], {
+    [nt[`${Ct}--error`]]: o
   }), s = f(
-    ct[`${wt}__input`],
-    ct[`${wt}__input--${c}`]
+    nt[`${Ct}__input`],
+    nt[`${Ct}__input--${c}`]
   ), [m, v] = e.useState(""), h = e.useRef(null), b = (E) => {
     r([...a || [], E]), v("");
   }, i = (E) => {
@@ -3582,6 +3582,7 @@ const tt = {
   "tooltip-image-container": "lc-Tooltip-module__tooltip-image-container___ySmcd",
   "tooltip-image": "lc-Tooltip-module__tooltip-image___Aorwg",
   "tooltip-text": "lc-Tooltip-module__tooltip-text___FB8OV",
+  "tooltip-text--info": "lc-Tooltip-module__tooltip-text--info___3d2Ql",
   "tooltip-close": "lc-Tooltip-module__tooltip-close___3r3h9",
   "tooltip-close-button": "lc-Tooltip-module__tooltip-close-button___Zph2C",
   "tooltip-step": "lc-Tooltip-module__tooltip-step___-j0n8",
@@ -3673,9 +3674,9 @@ const tt = {
         transition-property: opacity;
         transition-duration: ${d}ms;
         transition-delay: ${p}ms;
-      `, it = Ve`
-        pointer-events: initial;
       `, dt = Ve`
+        pointer-events: initial;
+      `, ut = Ve`
         opacity: 1;
       `, A = Ve`
         opacity: 0;
@@ -3692,9 +3693,9 @@ const tt = {
           timeout: z,
           classNames: {
             enter: pe,
-            enterDone: it,
+            enterDone: dt,
             enterActive: ie,
-            exit: dt,
+            exit: ut,
             exitActive: A
           }
         },
@@ -3796,10 +3797,10 @@ const Do = (t) => new Promise((a) => setTimeout(a, t)), To = "tooltip", Io = (t)
       };
   };
   return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", $({ ref: te.reference }, pe()), a()), Te);
-}, Sl = ({ text: t }) => /* @__PURE__ */ e.createElement("div", null, t), Ct = "tooltip", Dl = ({ header: t, text: a, closeWithX: r, theme: _, handleCloseAction: o }) => /* @__PURE__ */ e.createElement("div", null, r && /* @__PURE__ */ e.createElement(
+}, Sl = ({ text: t }) => /* @__PURE__ */ e.createElement("div", null, t), _t = "tooltip", Dl = ({ header: t, text: a, closeWithX: r, theme: _, handleCloseAction: o }) => /* @__PURE__ */ e.createElement("div", null, r && /* @__PURE__ */ e.createElement(
   "div",
   {
-    className: C[`${Ct}-close`],
+    className: C[`${_t}-close`],
     onClick: o
   },
   /* @__PURE__ */ e.createElement(
@@ -3813,12 +3814,21 @@ const Do = (t) => new Promise((a) => setTimeout(a, t)), To = "tooltip", Io = (t)
   "div",
   {
     className: f(
-      C[`${Ct}-header`],
-      C[`${Ct}-header--info`]
+      C[`${_t}-header`],
+      C[`${_t}-header--info`]
     )
   },
   t
-), /* @__PURE__ */ e.createElement("div", { className: C[`${Ct}-text`] }, a)), xe = "tooltip", Tl = ({
+), /* @__PURE__ */ e.createElement(
+  "div",
+  {
+    className: f(
+      C[`${_t}-text`],
+      C[`${_t}-text--info`]
+    )
+  },
+  a
+)), xe = "tooltip", Tl = ({
   header: t,
   text: a,
   image: r,
@@ -4028,19 +4038,19 @@ const ya = 8, ka = "guide-tooltip", Ea = (t, a) => new Po(t, a), Il = (t) => {
     }),
     t.children
   )) : null;
-}, _t = "reports-tooltip", Bl = ({
+}, ot = "reports-tooltip", Bl = ({
   title: t,
   description: a,
   children: r
-}) => /* @__PURE__ */ e.createElement("div", { className: C[_t] }, /* @__PURE__ */ e.createElement("div", { className: C[`${_t}__heading`] }, /* @__PURE__ */ e.createElement(P, { as: "div", className: C[`${_t}__heading__title`] }, t), /* @__PURE__ */ e.createElement(
+}) => /* @__PURE__ */ e.createElement("div", { className: C[ot] }, /* @__PURE__ */ e.createElement("div", { className: C[`${ot}__heading`] }, /* @__PURE__ */ e.createElement(P, { as: "div", className: C[`${ot}__heading__title`] }, t), /* @__PURE__ */ e.createElement(
   P,
   {
     as: "div",
     size: "xs",
-    className: C[`${_t}__heading__description`]
+    className: C[`${ot}__heading__description`]
   },
   a
-)), /* @__PURE__ */ e.createElement("div", { className: C[`${_t}__content`] }, /* @__PURE__ */ e.createElement(P, { as: "div" }, r))), Ao = "lc-Textarea-module__textarea___g6U8F", Nt = {
+)), /* @__PURE__ */ e.createElement("div", { className: C[`${ot}__content`] }, /* @__PURE__ */ e.createElement(P, { as: "div" }, r))), Ao = "lc-Textarea-module__textarea___g6U8F", Nt = {
   textarea: Ao,
   "textarea--focused": "lc-Textarea-module__textarea--focused___1vtEx",
   "textarea--disabled": "lc-Textarea-module__textarea--disabled___xXaGv",
@@ -4283,7 +4293,7 @@ export {
   sl as Form,
   il as FormField,
   dl as FormGroup,
-  st as Heading,
+  it as Heading,
   T as Icon,
   Dl as Info,
   ul as Input,