@ethora/chat-component 26.8.2 → 26.9.0

package/README.md

@@ -360,6 +360,7 @@ Below is a grouped reference for all `config` options.
 | `headerChatMenu` | `() => void` | Same for the chat header's room menu (the "more" button carrying Report and Leave). When set, that dropdown is not rendered and the button calls your handler. |
 | `colors` | `{ primary; secondary; icons?; ownMessageBackground?; otherMessageBackground?; inputBackground? }` | Theme colours. `primary` drives icon colours and the sender name. `icons` themes every accent icon/icon-button (attach, mic, active send, new-chat, header, empty-state) — defaults to `primary`, so set a *distinct* value to decouple. `ownMessageBackground`/`otherMessageBackground`/`inputBackground` recolour the message bubbles and input bar. |
 | `backgroundChat` | `{ color?; image? }` | Background colour and/or image for the messages area. (`image` as a string URL; pass an object URL for a `File`.) |
+| `colorScheme` | `'light' \| 'dark' \| 'system'` | Light or dark UI. Default `'light'` (the chat as before). `'system'` follows the viewer's OS / browser setting and updates live. Scoped to the chat's own elements, so it never restyles the host page; a host with its own dark mode should pass its resolved choice. `colors.icons`, `colors.iconsBg`, the bubble/input colours and `backgroundChat` are used as given in both schemes. `colors.primary` is the one exception: in dark it is lightened slightly (about 20% toward white) so primary-coloured text and icons stay legible on the dark surface while buttons keep white text on them, and `--ethora-color-primary-text` carries a further-lifted variant for text-only uses such as links and sender names. Pass an already-dark-suitable `primary` if you need the exact brand value. |
 | `typography` | `TypographyConfig` | Font family + size for the chat UI: `fontFamily` (or just `googleFontsFamily`) is applied across all chat text incl. messages and sender names; `fontSize` (px) scales message text, sender names, timestamps, inputs, room names and badges. Plus loaders (`googleFontsUrl`/`fontFaces`) and weight tokens. |
 | `fallbackScreens` | `{ noUser?; noConnection?; noRoom?; error? }` | Replace the built-in screens (Ethora login form, "Connecting...", empty room state, crash screen) with your own text or React nodes. A plain string is rendered as centered text. `error` also accepts a function `({ error, componentStack, scope, reset }) => ReactNode`, see [Error handling](#error-handling-and-crash-containment). |
 | `hiddenRooms` | `{ titles?: string[]; jids?: string[] }` | Hide specific rooms from the room list and unread counters (e.g. `{ titles: ['Main chat'] }` to suppress the auto-created default room). |

package/dist/{ChatProfileModal-DJcii-VO.js → ChatProfileModal-DfXEnzJf.js}

@@ -1,8 +1,8 @@
 import { jsx as E, jsxs as j, Fragment as gt } from "react/jsx-runtime";
 import ke, { useRef as yt, useState as ee, useMemo as se } from "react";
-import { S as bt, f as qt, b as Tt, D as he, a as pe, e as Ft, g as zt, h as Fe, i as Qt, j as Ht, k as Yt, l as ze } from "./SideDrawer-mSCnYOgy.js";
-import { h as Wt, P as Gt, a as Kt, c as Xt, D as Jt, d as Vt, e as Qe, f as He } from "./handleCopyClick-tizCFAb8.js";
-import { m as Zt, b as Et, n as de, a2 as er, B as te, v as W, a as Ne, u as fe, a3 as $e, D as Ct, w as wt, a4 as Rt, a5 as Pt, a6 as xt, a7 as tr, a8 as Be, a9 as rr, aa as nr, a0 as or, F as _t, X as ar, ab as ir, ac as Ie, ad as sr, ae as ye, af as St, P as Mt, T as At, t as lr, ag as ur, ah as cr, ai as fr, aj as dr, ak as hr, o as Ye, al as pr, am as vr, an as mr, ao as gr, ap as yr, aq as We, ar as br, as as Tr, U as Er, at as Cr, au as wr, M as Rr, G as Pr, av as Ge } from "./main-DkokKp7d.js";
+import { S as bt, f as qt, b as Tt, D as he, a as pe, e as Ft, g as zt, h as Fe, i as Qt, j as Ht, k as Yt, l as ze } from "./SideDrawer-DLqEOqAi.js";
+import { h as Wt, P as Gt, a as Kt, c as Xt, D as Jt, d as Vt, e as Qe, f as He } from "./handleCopyClick-CWw4UAlT.js";
+import { o as Zt, b as Et, p as de, a4 as er, B as te, x as W, a as Ne, u as fe, a5 as $e, F as Ct, y as wt, a6 as Rt, a7 as Pt, a8 as xt, a9 as tr, aa as Be, ab as rr, ac as nr, a2 as or, J as _t, Z as ar, ad as ir, ae as Ie, af as sr, ag as ye, ah as St, P as Mt, W as At, w as lr, ai as ur, aj as cr, ak as fr, al as dr, am as hr, q as Ye, an as pr, ao as vr, ap as mr, aq as gr, ar as yr, as as We, at as br, au as Tr, X as Er, av as Cr, aw as wr, M as Rr, K as Pr, ax as Ge } from "./main-BHtKhpBZ.js";
 var le = {}, ve = { exports: {} }, me = { exports: {} }, k = {};
 var Ke;
 function xr() {
@@ -1736,6 +1736,9 @@ const Ur = /* @__PURE__ */ Zt(jr), qr = "chatId", Fr = (n, h, a) => {
   font-size: var(--ethora-font-size-xs, 12px);
   font-weight: var(--ethora-font-weight-medium, 500);
   text-transform: capitalize;
+  [data-ethora-color-scheme='dark'] & {
+    ${({ $banned: n }) => n ? "background-color: rgba(242, 118, 107, 0.15);" : ""}
+  }
 `, on = ({
   member: n,
   disableClick: h,

package/dist/{FilePreviewModal-CZtgkIHl.js → FilePreviewModal-Cs1tij9R.js}

@@ -1,6 +1,6 @@
-import { jsx as l, jsxs as N } from "react/jsx-runtime";
-import te, { useState as B, useRef as z, useEffect as O, useMemo as $, useCallback as k } from "react";
-import { n as le, b as pe, aL as we, ac as ve, v as X, B as V, aM as xe, aN as be, aw as ye, aO as Ee, aP as Le, aQ as ue, aR as ne, a as Ce, aH as Me, u as Q, a3 as Re, aS as re, aq as Pe, am as J, aT as ke, aU as Se, aV as Te, aW as Ae, aX as Ie, aY as Xe, aZ as Ye, a_ as ze, a$ as Oe, ax as De, b0 as Fe, b1 as He, av as Ne, b2 as Be, t as Ue } from "./main-DkokKp7d.js";
+import { jsx as l, jsxs as B } from "react/jsx-runtime";
+import te, { useState as H, useRef as z, useEffect as O, useMemo as $, useCallback as k } from "react";
+import { p as le, b as pe, aN as we, ae as ve, x as X, B as V, aO as xe, aP as be, ay as ye, aQ as Ee, aR as Le, aS as ue, aT as ne, a as Ce, aJ as Re, u as q, a5 as Me, aU as re, as as Pe, ao as J, aV as ke, aW as Se, aX as Te, aY as Ae, aZ as Ie, a_ as Xe, a$ as Ye, b0 as ze, b1 as Oe, az as De, b2 as Fe, b3 as Ne, ax as Be, b4 as He, w as Ue } from "./main-BHtKhpBZ.js";
 function oe(t, i) {
   let o;
   return (...E) => {
@@ -11,18 +11,18 @@ function _e({ debounce: t, scroll: i, polyfill: o, offsetSize: E } = { debounce:
   const L = o || (typeof window > "u" ? class {
   } : window.ResizeObserver);
   if (!L) throw new Error("This browser does not support ResizeObserver out of the box. See: https://github.com/react-spring/react-use-measure/#resize-observer-polyfills");
-  const [u, C] = B({ left: 0, top: 0, width: 0, height: 0, bottom: 0, right: 0, x: 0, y: 0 }), n = z({ element: null, scrollContainers: null, resizeObserver: null, lastBounds: u, orientationHandler: null }), M = t ? typeof t == "number" ? t : t.scroll : null, p = t ? typeof t == "number" ? t : t.resize : null, T = z(!1);
+  const [u, C] = H({ left: 0, top: 0, width: 0, height: 0, bottom: 0, right: 0, x: 0, y: 0 }), n = z({ element: null, scrollContainers: null, resizeObserver: null, lastBounds: u, orientationHandler: null }), R = t ? typeof t == "number" ? t : t.scroll : null, p = t ? typeof t == "number" ? t : t.resize : null, T = z(!1);
   O(() => (T.current = !0, () => {
     T.current = !1;
   }));
   const [b, x, m] = $(() => {
     const r = () => {
       if (!n.current.element) return;
-      const { left: g, top: w, width: v, height: H, bottom: S, right: R, x: f, y: h } = n.current.element.getBoundingClientRect(), A = { left: g, top: w, width: v, height: H, bottom: S, right: R, x: f, y: h };
+      const { left: g, top: w, width: v, height: N, bottom: S, right: M, x: f, y: h } = n.current.element.getBoundingClientRect(), A = { left: g, top: w, width: v, height: N, bottom: S, right: M, x: f, y: h };
       n.current.element instanceof HTMLElement && E && (A.height = n.current.element.offsetHeight, A.width = n.current.element.offsetWidth), Object.freeze(A), T.current && !We(n.current.lastBounds, A) && C(n.current.lastBounds = A);
     };
-    return [r, p ? oe(r, p) : r, M ? oe(r, M) : r];
-  }, [C, E, M, p]);
+    return [r, p ? oe(r, p) : r, R ? oe(r, R) : r];
+  }, [C, E, R, p]);
   function y() {
     n.current.scrollContainers && (n.current.scrollContainers.forEach((r) => r.removeEventListener("scroll", m, !0)), n.current.scrollContainers = null), n.current.resizeObserver && (n.current.resizeObserver.disconnect(), n.current.resizeObserver = null), n.current.orientationHandler && ("orientation" in screen && "removeEventListener" in screen.orientation ? screen.orientation.removeEventListener("change", n.current.orientationHandler) : "onorientationchange" in window && window.removeEventListener("orientationchange", n.current.orientationHandler));
   }
@@ -107,10 +107,10 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
   text-align: center;
 
   a {
-    color: var(--ethora-color-primary, #0052cd);
+    color: var(--ethora-color-primary-text, var(--ethora-color-primary, #0052cd));
   }
-`, qe = ({ pdfUrl: t }) => {
-  const i = le(), { config: o } = pe(), [E, L] = _e(), u = z(null), C = z(null), n = z(null), [M, p] = B("loading"), [T, b] = B(0), [x, m] = B(1), y = Math.max(320, Math.floor(L.width || 0));
+`, Qe = ({ pdfUrl: t }) => {
+  const i = le(), { config: o } = pe(), [E, L] = _e(), u = z(null), C = z(null), n = z(null), [R, p] = H("loading"), [T, b] = H(0), [x, m] = H(1), y = Math.max(320, Math.floor(L.width || 0));
   O(() => {
     let r = !1, g;
     return p("loading"), m(1), b(0), (async () => {
@@ -140,21 +140,21 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
     };
   }, [t, o?.pdfPreview?.workerSrc]), O(() => {
     const r = C.current, g = u.current;
-    if (M !== "ready" || !r || !g || y <= 0) return;
+    if (R !== "ready" || !r || !g || y <= 0) return;
     let w = !1;
     return (async () => {
       try {
         const v = await r.getPage(x);
         if (w) return;
-        const H = v.getViewport({ scale: 1 }), S = H.width ? y / H.width : 1, R = v.getViewport({ scale: S });
-        g.width = Math.max(1, Math.floor(R.width)), g.height = Math.max(1, Math.floor(R.height));
+        const N = v.getViewport({ scale: 1 }), S = N.width ? y / N.width : 1, M = v.getViewport({ scale: S });
+        g.width = Math.max(1, Math.floor(M.width)), g.height = Math.max(1, Math.floor(M.height));
         const f = g.getContext("2d");
         if (!f) {
           p("error");
           return;
         }
         n.current?.cancel();
-        const h = v.render({ canvasContext: f, viewport: R });
+        const h = v.render({ canvasContext: f, viewport: M });
         n.current = h, await h.promise, v.cleanup();
       } catch (v) {
         w || console.warn("[Ethora] PDF page render failed:", v);
@@ -162,7 +162,7 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
     })(), () => {
       w = !0, n.current?.cancel(), n.current = null;
     };
-  }, [M, x, y]);
+  }, [R, x, y]);
   const Y = k(
     () => m((r) => Math.max(1, r - 1)),
     []
@@ -170,12 +170,12 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
     () => m((r) => Math.min(T || 1, r + 1)),
     [T]
   );
-  return M === "error" ? /* @__PURE__ */ l(ie, { children: /* @__PURE__ */ N(Ge, { children: [
+  return R === "error" ? /* @__PURE__ */ l(ie, { children: /* @__PURE__ */ B(Ge, { children: [
     /* @__PURE__ */ l("span", { children: i("modal.filePreview.pdfUnavailable") }),
     /* @__PURE__ */ l("a", { href: t, target: "_blank", rel: "noopener noreferrer", children: i("modal.filePreview.openExternally") })
-  ] }) }) : /* @__PURE__ */ N(ie, { children: [
-    /* @__PURE__ */ l(Ze, { ref: E, children: M === "loading" ? /* @__PURE__ */ l(ve, { color: o?.colors?.primary }) : /* @__PURE__ */ l("canvas", { ref: u }) }),
-    T > 1 && /* @__PURE__ */ N(Ke, { children: [
+  ] }) }) : /* @__PURE__ */ B(ie, { children: [
+    /* @__PURE__ */ l(Ze, { ref: E, children: R === "loading" ? /* @__PURE__ */ l(ve, { color: o?.colors?.primary }) : /* @__PURE__ */ l("canvas", { ref: u }) }),
+    T > 1 && /* @__PURE__ */ B(Ke, { children: [
       /* @__PURE__ */ l(
         ae,
         {
@@ -185,7 +185,7 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
           "aria-label": i("modal.filePreview.previousPage")
         }
       ),
-      /* @__PURE__ */ N("span", { children: [
+      /* @__PURE__ */ B("span", { children: [
         x,
         " / ",
         T
@@ -201,7 +201,7 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
       )
     ] })
   ] });
-}, I = 1, ee = 6, Qe = 2.5, Je = 50, et = 300, se = 24, tt = 16e-4, G = (t, i, o) => Math.min(o, Math.max(i, t)), nt = X.div`
+}, I = 1, ee = 6, qe = 2.5, Je = 50, et = 300, se = 24, tt = 16e-4, G = (t, i, o) => Math.min(o, Math.max(i, t)), nt = X.div`
   position: relative;
   /* An explicit height, not flex growth alone: the parent lays its children
      out in a row and centres them, so the viewport would otherwise be sized
@@ -235,12 +235,12 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
   ${ye}
 `, fe = te.forwardRef(
   ({ src: t, alt: i, onSwipeLeft: o, onSwipeRight: E, onError: L, onScaleChange: u }, C) => {
-    const n = z(null), M = z(null), [p, T] = B(I), [b, x] = B({ x: 0, y: 0 }), [m, y] = B(!1), [Y, F] = B(!1), r = z({ scale: I, offset: { x: 0, y: 0 } });
+    const n = z(null), R = z(null), [p, T] = H(I), [b, x] = H({ x: 0, y: 0 }), [m, y] = H(!1), [Y, F] = H(!1), r = z({ scale: I, offset: { x: 0, y: 0 } });
     r.current = { scale: p, offset: b };
     const g = z(null), w = z(null), v = z(
       null
-    ), H = k((a) => {
-      const e = n.current, c = M.current;
+    ), N = k((a) => {
+      const e = n.current, c = R.current;
       if (!e) return { x: 0, y: 0 };
       const s = e.clientWidth, d = e.clientHeight, P = c?.naturalWidth || 0, D = c?.naturalHeight || 0;
       let j = s, Z = d;
@@ -254,14 +254,14 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
       };
     }, []), S = k(
       (a, e, c) => {
-        const s = G(a, I, ee), d = H(s);
+        const s = G(a, I, ee), d = N(s);
         y(c), T(s), x({
           x: G(e.x, -d.x, d.x),
           y: G(e.y, -d.y, d.y)
         });
       },
-      [H]
-    ), R = k(
+      [N]
+    ), M = k(
       (a, e, c, s) => {
         const d = r.current, P = G(a, I, ee), D = P / d.scale;
         S(
@@ -278,9 +278,9 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
       S(I, { x: 0, y: 0 }, !0);
     }, [S]), h = k(
       (a) => {
-        R(r.current.scale * a, 0, 0, !0);
+        M(r.current.scale * a, 0, 0, !0);
       },
-      [R]
+      [M]
     );
     te.useImperativeHandle(
       C,
@@ -300,10 +300,10 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
       const e = (c) => {
         c.preventDefault();
         const s = a.getBoundingClientRect(), d = c.clientX - s.left - s.width / 2, P = c.clientY - s.top - s.height / 2, D = Math.exp(-c.deltaY * tt);
-        R(r.current.scale * D, d, P, !1);
+        M(r.current.scale * D, d, P, !1);
       };
       return a.addEventListener("wheel", e, { passive: !1 }), () => a.removeEventListener("wheel", e);
-    }, [R]);
+    }, [M]);
     const A = k(
       (a, e) => {
         const c = n.current;
@@ -313,14 +313,14 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
           return;
         }
         const s = c.getBoundingClientRect();
-        R(
-          Qe,
+        M(
+          qe,
           a - s.left - s.width / 2,
           e - s.top - s.height / 2,
           !0
         );
       },
-      [f, R]
+      [f, M]
     ), _ = k((a) => {
       a.button === 0 && (r.current.scale <= I || (a.preventDefault(), g.current = { x: a.clientX, y: a.clientY }, F(!0)));
     }, []);
@@ -345,7 +345,7 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
         window.removeEventListener("mousemove", a), window.removeEventListener("mouseup", e);
       };
     }, [Y, S]);
-    const q = k((a) => {
+    const Q = k((a) => {
       if (a.touches.length === 2) {
         const [c, s] = [a.touches[0], a.touches[1]];
         w.current = {
@@ -385,7 +385,7 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
           ), D = n.current;
           if (!D || P <= 0) return;
           const j = D.getBoundingClientRect(), Z = (s.clientX + d.clientX) / 2 - j.left - j.width / 2, K = (s.clientY + d.clientY) / 2 - j.top - j.height / 2;
-          e.moved = !0, R(
+          e.moved = !0, M(
             e.pinchScale * P / e.pinchDistance,
             Z,
             K,
@@ -409,7 +409,7 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
           e.lastX = c.clientX, e.lastY = c.clientY;
         }
       },
-      [S, R]
+      [S, M]
     ), U = k(
       (a) => {
         const e = w.current;
@@ -448,14 +448,14 @@ const Ve = ["x", "y", "top", "bottom", "left", "right", "width", "height"], We =
         "data-testid": "image-lightbox-viewport",
         onMouseDown: _,
         onDoubleClick: me,
-        onTouchStart: q,
+        onTouchStart: Q,
         onTouchMove: W,
         onTouchEnd: U,
         onTouchCancel: U,
         children: /* @__PURE__ */ l(
           rt,
           {
-            ref: M,
+            ref: R,
             "data-testid": "image-lightbox-image",
             src: t,
             alt: i,
@@ -536,16 +536,16 @@ const ot = (t) => {
 `, gt = ({
   handleCloseModal: t
 }) => {
-  const i = Ce(), o = le(), E = Me(), { activeFile: L } = Q(
+  const i = Ce(), o = le(), E = Re(), { activeFile: L } = q(
     (f) => f.chatSettingStore
   ), u = $(
     () => L ?? { fileName: "", fileURL: "", mimetype: "" },
     [L]
-  ), C = Q(
+  ), C = q(
     (f) => f.chatSettingStore.user?.fileToken || ""
-  ), n = Q(
-    (f) => Re(f)?.messages
-  ), M = z(null), [p, T] = B(I), b = ue(u?.mimetype, u?.fileName), x = $(() => ot(n), [n]), m = $(
+  ), n = q(
+    (f) => Me(f)?.messages
+  ), R = z(null), [p, T] = H(I), b = ue(u?.mimetype, u?.fileName), x = $(() => ot(n), [n]), m = $(
     () => b === "image" ? it(x, u) : -1,
     [x, u, b]
   ), y = m >= 0 && x.length > 1, Y = y && m > 0, F = y && m < x.length - 1, r = k(
@@ -575,29 +575,29 @@ const ot = (t) => {
     return document.addEventListener("keydown", f), () => document.removeEventListener("keydown", f);
   }, [y, g, w]);
   const v = () => {
-    fetch(Ne(u.fileURL), {
+    fetch(Be(u.fileURL), {
       method: "GET",
       headers: {}
     }).then((f) => {
-      const _ = !!Be(u.fileName) ? u.fileName : `MEDIA-ETHORA.${b === "image" ? "png" : b === "video" ? "mp4" : "bin"}`;
-      f.arrayBuffer().then(function(q) {
+      const _ = !!He(u.fileName) ? u.fileName : `MEDIA-ETHORA.${b === "image" ? "png" : b === "video" ? "mp4" : "bin"}`;
+      f.arrayBuffer().then(function(Q) {
         if (typeof window > "u")
           return;
-        const W = window.URL.createObjectURL(new Blob([q])), U = document.createElement("a");
+        const W = window.URL.createObjectURL(new Blob([Q])), U = document.createElement("a");
         U.href = W, U.setAttribute("download", _), document.body.appendChild(U), U.click(), U.remove(), window.URL.revokeObjectURL(W);
       });
     }).catch((f) => {
       Ue.log(f);
     });
-  }, H = () => {
+  }, N = () => {
     i(re(void 0)), t?.();
-  }, S = u?.fileName || o("modal.filePreview.imageAlt"), R = $(() => {
+  }, S = u?.fileName || o("modal.filePreview.imageAlt"), M = $(() => {
     switch (b) {
       case "image":
         return /* @__PURE__ */ l(
           fe,
           {
-            ref: M,
+            ref: R,
             src: J(u.fileURL, C) || ce,
             alt: S,
             onScaleChange: T,
@@ -618,9 +618,9 @@ const ot = (t) => {
           }
         );
       case "pdf":
-        return /* @__PURE__ */ l(qe, { pdfUrl: J(u.fileURL, C) });
+        return /* @__PURE__ */ l(Qe, { pdfUrl: J(u.fileURL, C) });
       default:
-        return /* @__PURE__ */ N(
+        return /* @__PURE__ */ B(
           "div",
           {
             style: {
@@ -649,7 +649,7 @@ const ot = (t) => {
         );
     }
   }, [u, C, S, b, w, g, o]);
-  return /* @__PURE__ */ N(
+  return /* @__PURE__ */ B(
     Ae,
     {
       "aria-label": o("modal.filePreview.title"),
@@ -658,18 +658,18 @@ const ot = (t) => {
         /* @__PURE__ */ l(
           Ie,
           {
-            handleCloseModal: H,
+            handleCloseModal: N,
             headerTitle: o("modal.filePreview.title"),
-            rightMenu: /* @__PURE__ */ N(lt, { children: [
+            rightMenu: /* @__PURE__ */ B(lt, { children: [
               y && /* @__PURE__ */ l(dt, { "data-testid": "lightbox-position", "aria-live": "polite", children: o("modal.filePreview.position", {
                 current: m + 1,
                 total: x.length
               }) }),
-              b === "image" && /* @__PURE__ */ N(ut, { children: [
+              b === "image" && /* @__PURE__ */ B(ut, { children: [
                 /* @__PURE__ */ l(
                   V,
                   {
-                    onClick: () => M.current?.zoomOut(),
+                    onClick: () => R.current?.zoomOut(),
                     disabled: p <= I,
                     "aria-label": o("modal.filePreview.zoomOut"),
                     children: /* @__PURE__ */ l(Xe, {})
@@ -678,7 +678,7 @@ const ot = (t) => {
                 /* @__PURE__ */ l(
                   V,
                   {
-                    onClick: () => M.current?.zoomIn(),
+                    onClick: () => R.current?.zoomIn(),
                     disabled: p >= ee,
                     "aria-label": o("modal.filePreview.zoomIn"),
                     children: /* @__PURE__ */ l(Ye, {})
@@ -687,7 +687,7 @@ const ot = (t) => {
                 /* @__PURE__ */ l(
                   V,
                   {
-                    onClick: () => M.current?.reset(),
+                    onClick: () => R.current?.reset(),
                     disabled: p <= I,
                     "aria-label": o("modal.filePreview.resetZoom"),
                     children: /* @__PURE__ */ l(ze, {})
@@ -711,7 +711,7 @@ const ot = (t) => {
               padding: "16px",
               width: "90%"
             },
-            children: /* @__PURE__ */ N(at, { children: [
+            children: /* @__PURE__ */ B(at, { children: [
               y && /* @__PURE__ */ l(
                 st,
                 {
@@ -721,14 +721,14 @@ const ot = (t) => {
                   children: /* @__PURE__ */ l(Fe, {})
                 }
               ),
-              R,
+              M,
               y && /* @__PURE__ */ l(
                 ct,
                 {
                   onClick: w,
                   disabled: !F,
                   "aria-label": o("modal.filePreview.nextImage"),
-                  children: /* @__PURE__ */ l(He, {})
+                  children: /* @__PURE__ */ l(Ne, {})
                 }
               )
             ] })

package/dist/{ManageDataModal-aOWxvxSs.js → ManageDataModal-BBOui09n.js}

@@ -1,7 +1,7 @@
 import { jsxs as o, Fragment as T, jsx as a } from "react/jsx-runtime";
 import { useState as m, useCallback as M } from "react";
-import { aw as B, v as t, ax as I, ay as w, B as j, u as z, n as F, F as E, az as R, J as U, t as x, aA as A, aB as $, aC as O, aD as H } from "./main-DkokKp7d.js";
-import { S as J, D as f, a as u, b as D, e as v, f as b } from "./SideDrawer-mSCnYOgy.js";
+import { ay as B, x as t, az as I, aA as w, B as j, u as z, p as E, J as F, aB as R, L as U, w as x, aC as A, aD as $, aE as O, aF as H } from "./main-BHtKhpBZ.js";
+import { S as J, D as f, a as u, b as D, e as v, f as b } from "./SideDrawer-DLqEOqAi.js";
 t(I)`
   display: flex;
   box-sizing: border-box;
@@ -82,7 +82,7 @@ const y = t(j)`
 `, Q = ({
   handleCloseModal: r
 }) => {
-  const { config: l } = z((s) => s.chatSettingStore), e = F(), { showToast: d } = E(), [C, c] = m(!1), [i, g] = m(!1), S = async () => {
+  const { config: l } = z((s) => s.chatSettingStore), e = E(), { showToast: d } = F(), [C, c] = m(!1), [i, g] = m(!1), S = async () => {
     const p = (await H()).data;
     x.log(p);
     const L = new Blob([p], { type: "text/plain" }), h = URL.createObjectURL(L), n = document.createElement("a");

package/dist/{MarkdownBody-neDkIgJl.js → MarkdownBody-DttRXyAK.js}

@@ -1,6 +1,6 @@
 import { jsxs as fs, jsx as ie, Fragment as hs } from "react/jsx-runtime";
 import "react";
-import { m as ei } from "./main-DkokKp7d.js";
+import { o as ei } from "./main-BHtKhpBZ.js";
 function zr(e) {
   const t = [], n = String(e || "");
   let r = n.indexOf(","), u = 0, i = !1;
@@ -16715,7 +16715,7 @@ const h1 = [
               target: "_blank",
               rel: "noopener noreferrer",
               style: {
-                color: "var(--ethora-color-primary, #0a66c2)",
+                color: "var(--ethora-color-primary-text, var(--ethora-color-primary, #0a66c2))",
                 textDecoration: "none"
               },
               children: r
@@ -16855,7 +16855,7 @@ const h1 = [
                   (l.key === "Enter" || l.key === " ") && (l.preventDefault(), o());
                 } : void 0,
                 style: {
-                  color: "var(--ethora-color-primary, #0052cd)",
+                  color: "var(--ethora-color-primary-text, var(--ethora-color-primary, #0052cd))",
                   fontWeight: 600,
                   cursor: t ? "pointer" : "default"
                 },

package/dist/{SideDrawer-mSCnYOgy.js → SideDrawer-DLqEOqAi.js}

@@ -1,6 +1,6 @@
 import { jsxs as i, jsx as o } from "react/jsx-runtime";
 import { useId as f, useRef as v } from "react";
-import { n as u, w as g, aG as m, aH as w, B as b, aI as y, v as e, aJ as D, aK as k } from "./main-DkokKp7d.js";
+import { p as u, y as g, aI as m, aJ as w, B as b, aK as y, x as e, aL as D, aM as k } from "./main-BHtKhpBZ.js";
 const c = 767, R = `${c}px`, z = e.div`
   position: relative;
   pointer-events: auto;
@@ -97,7 +97,7 @@ const c = 767, R = `${c}px`, z = e.div`
   font: inherit;
   font-size: var(--ethora-font-size-xs, 13px);
   font-weight: var(--ethora-font-weight-medium, 500);
-  color: var(--ethora-color-primary, #0052cd);
+  color: var(--ethora-color-primary-text, var(--ethora-color-primary, #0052cd));
   align-self: center;
 
   &:hover {
@@ -109,11 +109,11 @@ const c = 767, R = `${c}px`, z = e.div`
     outline-offset: 2px;
     border-radius: var(--ethora-radius-sm, 8px);
   }
-`, G = e.div`
+`, J = e.div`
   height: 1px;
   margin: 0 var(--ethora-space-4, 16px);
   background-color: var(--ethora-color-border, #e6e8ec);
-`, J = e.div`
+`, V = e.div`
   display: flex;
   align-items: center;
   gap: var(--ethora-space-2, 8px);
@@ -135,7 +135,7 @@ const c = 767, R = `${c}px`, z = e.div`
   & > svg {
     flex: 0 0 auto;
   }
-`, V = e.input`
+`, X = e.input`
   flex: 1 1 auto;
   min-width: 0;
   border: none;
@@ -148,22 +148,22 @@ const c = 767, R = `${c}px`, z = e.div`
   &::placeholder {
     color: var(--ethora-color-text-muted, #8c8c8c);
   }
-`, X = e.div`
+`, q = e.div`
   display: flex;
   flex-direction: column;
   width: 100%;
-`, T = e.div`
+`, L = e.div`
   font-size: var(--ethora-font-size-sm, 14px);
   font-weight: var(--ethora-font-weight-medium, 500);
   color: var(--ethora-color-text, #141414);
   text-align: start;
-`, C = e.div`
+`, T = e.div`
   font-size: var(--ethora-font-size-xs, 12px);
   font-weight: var(--ethora-font-weight-regular, 400);
   color: var(--ethora-color-text-muted, #8c8c8c);
   text-align: start;
   line-height: 1.4;
-`, E = e.button`
+`, C = e.button`
   display: flex;
   align-items: center;
   gap: var(--ethora-space-3, 12px);
@@ -186,17 +186,17 @@ const c = 767, R = `${c}px`, z = e.div`
     outline: 2px solid var(--ethora-color-primary, #0052cd);
     outline-offset: -2px;
   }
-`, L = e.span`
+`, E = e.span`
   display: flex;
   flex-direction: column;
   gap: var(--ethora-space-1, 4px);
   flex: 1 1 auto;
   min-width: 0;
-`, j = e.span`
+`, M = e.span`
   flex: 0 0 auto;
   display: inline-flex;
   color: var(--ethora-color-text-muted, #8c8c8c);
-`, H = () => /* @__PURE__ */ o("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ o(
+`, j = () => /* @__PURE__ */ o("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ o(
   "path",
   {
     d: "M6 3.5L10.5 8L6 12.5",
@@ -205,16 +205,16 @@ const c = 767, R = `${c}px`, z = e.div`
     strokeLinecap: "round",
     strokeLinejoin: "round"
   }
-) }), q = ({
+) }), G = ({
   label: r,
   hint: a,
   onClick: t
-}) => /* @__PURE__ */ i(E, { type: "button", onClick: t, children: [
-  /* @__PURE__ */ i(L, { children: [
-    /* @__PURE__ */ o(T, { children: r }),
-    a && /* @__PURE__ */ o(C, { children: a })
+}) => /* @__PURE__ */ i(C, { type: "button", onClick: t, children: [
+  /* @__PURE__ */ i(E, { children: [
+    /* @__PURE__ */ o(L, { children: r }),
+    a && /* @__PURE__ */ o(T, { children: a })
   ] }),
-  /* @__PURE__ */ o(j, { "aria-hidden": "true", children: /* @__PURE__ */ o(H, {}) })
+  /* @__PURE__ */ o(M, { "aria-hidden": "true", children: /* @__PURE__ */ o(j, {}) })
 ] }), Q = ({
   title: r,
   onClose: a,
@@ -257,14 +257,14 @@ export {
   Q as S,
   K as a,
   O as b,
-  G as c,
-  q as d,
+  J as c,
+  G as d,
   W as e,
-  C as f,
-  T as g,
+  T as f,
+  L as g,
   _ as h,
-  J as i,
-  V as j,
-  X as k,
+  V as i,
+  X as j,
+  q as k,
   F as l
 };

package/dist/{UserProfileModal-a_O8hh1O.js → UserProfileModal-DEtLQxkJ.js}

@@ -1,8 +1,8 @@
 import { jsxs as u, Fragment as $, jsx as o } from "react/jsx-runtime";
 import { forwardRef as ge, useState as I, useCallback as y, useImperativeHandle as ve, useRef as ae, useMemo as M } from "react";
-import { a as be, n as J, p as ye, q as xe, t as we, P as re, I as H, v as D, w as Ce, x as Se, y as Ie, z as te, C as De, D as Ne, E as ke, F as Ue, u as Q, G as Fe, J as Pe, L as Ae, K as Re, N as Y, o as Z, O as ze, Q as je, R as Be, s as $e, B as X, S as Ee, T as Oe, U as Te, W as ee, X as R, Y as Le, Z as Me, V as He, A as Xe, _ as We, $ as Je, a0 as Ke, a1 as Ve } from "./main-DkokKp7d.js";
-import { D as E, a as W, b as Ge, e as qe, f as _e, S as Qe } from "./SideDrawer-mSCnYOgy.js";
-import { P as ne, a as Ye, D as Ze, b as eo, h as oo } from "./handleCopyClick-tizCFAb8.js";
+import { a as be, p as J, t as ye, v as xe, w as we, P as re, I as H, x as D, y as Ce, z as Se, C as Ie, D as te, E as De, F as Ne, G as ke, J as Ue, u as Q, K as Fe, L as Pe, N as Ae, O as Re, Q as Y, q as Z, R as ze, S as je, T as Be, s as $e, B as X, U as Ee, W as Oe, X as Te, Y as ee, Z as R, _ as Le, $ as Me, V as He, A as Xe, a0 as We, a1 as Je, a2 as Ke, a3 as Ve } from "./main-BHtKhpBZ.js";
+import { D as E, a as W, b as Ge, e as qe, f as _e, S as Qe } from "./SideDrawer-DLqEOqAi.js";
+import { P as ne, a as Ye, D as Ze, b as eo, h as oo } from "./handleCopyClick-CWw4UAlT.js";
 const ao = (c, i) => {
   const l = atob(c.split(",")[1]), g = new ArrayBuffer(l.length), e = new Uint8Array(g);
   for (let r = 0; r < l.length; r++)