@getsoren/design-system 4.72.0 → 4.73.1

package/dist/main.js

@@ -3,7 +3,7 @@ import { Alert as is, AppBar as ml, Autocomplete as Yc, Avatar as _r, AvatarGrou
 import tA from "@emotion/styled";
 import { Global as rA, ThemeContext as oA, createElement as nu, css as oi, keyframes as Ro } from "@emotion/react";
 import * as I from "react";
-import Qr, { Children as au, cloneElement as vo, createContext as ni, forwardRef as Vt, isValidElement as Ut, memo as ai, useCallback as Qe, useContext as br, useEffect as Ct, useId as nA, useImperativeHandle as iu, useMemo as Ar, useRef as ze, useState as je } from "react";
+import Qr, { Children as au, cloneElement as vo, createContext as ni, forwardRef as Vt, isValidElement as Ut, memo as ai, useCallback as Qe, useContext as br, useEffect as Ct, useId as nA, useImperativeHandle as iu, useMemo as Ar, useRef as ze, useState as We } from "react";
 import * as Qn from "react/jsx-runtime";
 import { jsx as Q, jsxs as nt } from "react/jsx-runtime";
 import * as aA from "react-dom";
@@ -8403,7 +8403,7 @@ var Jo = /* @__PURE__ */ I.forwardRef(function(t, r) {
   const Ce = {};
   A || (Ae.onTouchStart = ve, Ae.onTouchEnd = dt), g || (Ae.onMouseOver = ga(Te, Ae.onMouseOver), Ae.onMouseLeave = ga(ke, Ae.onMouseLeave), X || (Ce.onMouseOver = Te, Ce.onMouseLeave = ke)), p || (Ae.onFocus = ga(_, Ae.onFocus), Ae.onBlur = ga(Fe, Ae.onBlur), X || (Ce.onFocus = _, Ce.onBlur = Fe)), process.env.NODE_ENV !== "production" && z.props.title && console.error(["MUI: You have provided a `title` prop to the child of <Tooltip />.", `Remove this title prop \`${z.props.title}\` or the Tooltip component.`].join(`
 `));
-  const We = {
+  const je = {
     ...n,
     isRtl: te,
     arrow: a,
@@ -8411,7 +8411,7 @@ var Jo = /* @__PURE__ */ I.forwardRef(function(t, r) {
     placement: M,
     PopperComponentProp: k,
     touch: oe.current
-  }, $e = typeof O.popper == "function" ? O.popper(We) : O.popper, Et = I.useMemo(() => {
+  }, $e = typeof O.popper == "function" ? O.popper(je) : O.popper, Et = I.useMemo(() => {
     let Se = [{
       name: "arrow",
       enabled: !!V,
@@ -8429,7 +8429,7 @@ var Jo = /* @__PURE__ */ I.forwardRef(function(t, r) {
     V,
     B.popperOptions,
     $e?.popperOptions
-  ]), Ft = bb(We), $t = typeof O.transition == "function" ? O.transition(We) : O.transition, Ge = {
+  ]), Ft = bb(je), $t = typeof O.transition == "function" ? O.transition(je) : O.transition, Ge = {
     slots: {
       popper: s.Popper,
       transition: s.Transition ?? D,
@@ -8452,22 +8452,22 @@ var Jo = /* @__PURE__ */ I.forwardRef(function(t, r) {
   }, [ct, me] = qe("popper", {
     elementType: vb,
     externalForwardedProps: Ge,
-    ownerState: We,
+    ownerState: je,
     className: he(Ft.popper, B?.className)
   }), [Ee, xe] = qe("transition", {
     elementType: wo,
     externalForwardedProps: Ge,
-    ownerState: We
+    ownerState: je
   }), [we, Ze] = qe("tooltip", {
     elementType: yb,
     className: Ft.tooltip,
     externalForwardedProps: Ge,
-    ownerState: We
+    ownerState: je
   }), [ot, Mt] = qe("arrow", {
     elementType: Cb,
     className: Ft.arrow,
     externalForwardedProps: Ge,
-    ownerState: We,
+    ownerState: je,
     ref: q
   });
   return /* @__PURE__ */ nt(I.Fragment, { children: [/* @__PURE__ */ I.cloneElement(z, Ae), /* @__PURE__ */ Q(ct, {
@@ -9381,7 +9381,7 @@ var Mb = ({ title: e, subtitle: t, onClose: r, icon: n = /* @__PURE__ */ d(Ms, {
     children: r
   })
 }), er = 6, Vb = 200, Fb = ({ anchor: e, blocking: t = !1, onWindowClick: r, dataTestId: n = "assistantSpotlight" }) => {
-  const [a, i] = je(() => e.getBoundingClientRect()), l = Qe(() => i(e.getBoundingClientRect()), [e]);
+  const [a, i] = We(() => e.getBoundingClientRect()), l = Qe(() => i(e.getBoundingClientRect()), [e]);
   return Ct(() => {
     l();
     const s = window.setInterval(l, Vb);
@@ -9640,7 +9640,7 @@ var Ub = (e, t) => {
   height: t,
   sx: r
 }), Wb = ({ src: e, isLoading: t, secondarySrc: r, secondaryAvatarProps: n, sx: a, secondaryTitle: i, width: l = 64, height: s = 64, alt: c = "Article" }) => {
-  const [u, p] = je(!1), [g, v] = je(!1), { borderRadius: A, padding: b } = Ub(l, s), m = {
+  const [u, p] = We(!1), [g, v] = We(!1), { borderRadius: A, padding: b } = Ub(l, s), m = {
     borderRadius: A,
     flexShrink: 0
   }, f = e && !u && !g || t, S = !e || g && !t, w = e?.endsWith(".png") || e?.endsWith(".svg") || e?.endsWith(".gif") || e?.endsWith(".webp"), C = () => {
@@ -10133,7 +10133,7 @@ var Ub = (e, t) => {
   ...e,
   children: /* @__PURE__ */ d("path", { d: "M9.29 15.88 13.17 12 9.29 8.12a.996.996 0 0 1 0-1.41c.39-.39 1.02-.39 1.41 0l4.59 4.59c.39.39.39 1.02 0 1.41L10.7 17.3c-.39.39-1.02.39-1.41 0-.38-.39-.39-1.03 0-1.42" })
 }), _b = ({ text: e, children: t }) => {
-  const [r, n] = je("");
+  const [r, n] = We("");
   return /* @__PURE__ */ d(Bt, {
     title: r,
     children: /* @__PURE__ */ d(G, {
@@ -14193,8 +14193,8 @@ var Bv = qs.Provider, nc, Pv = ne(Xp, {
   ]), Me && (w ? Ve.length === 0 ? fe = null : fe = Ve.reduce((me, Ee, xe) => (me.push(Ee), xe < Ve.length - 1 && me.push(", "), me), []) : fe = ge);
   let Ce = J;
   !l && ee && pe && (Ce = be.clientWidth);
-  let We;
-  typeof L < "u" ? We = L : We = g ? null : 0;
+  let je;
+  typeof L < "u" ? je = L : je = g ? null : 0;
   const $e = N.id || (C ? `mui-component-select-${C}` : void 0), Et = {
     ...t,
     variant: te,
@@ -14212,7 +14212,7 @@ var Bv = qs.Provider, nc, Pv = ne(Xp, {
     /* @__PURE__ */ Q(Pv, {
       as: "div",
       ref: de,
-      tabIndex: We,
+      tabIndex: je,
       role: "combobox",
       "aria-controls": ce ? ct : void 0,
       "aria-disabled": g ? "true" : void 0,
@@ -14691,8 +14691,8 @@ var Gt = Be("MuiInputBase", [
     if (!l) return;
     const Ae = ee.current;
     if (!Ae) return;
-    const Ce = Kn(Ae), We = jo(Ce), $e = We == null || We === Ce.body || We === Ce.documentElement;
-    Ae === We ? j && j.onFocus ? j.onFocus() : F(!0) : $e && Ae.focus();
+    const Ce = Kn(Ae), je = jo(Ce), $e = je == null || je === Ce.body || je === Ce.documentElement;
+    Ae === je ? j && j.onFocus ? j.onFocus() : F(!0) : $e && Ae.focus();
   }, [l]);
   const ke = (Ae) => {
     P && P(Ae), C.onFocus && C.onFocus(Ae), j && j.onFocus ? j.onFocus(Ae) : F(!0);
@@ -14700,9 +14700,9 @@ var Gt = Be("MuiInputBase", [
     B && B(Ae), C.onBlur && C.onBlur(Ae), j && j.onBlur ? j.onBlur(Ae) : F(!1);
   }, Fe = (Ae, ...Ce) => {
     if (!le) {
-      const We = Ae.target || ee.current;
-      if (We == null) throw new Error(process.env.NODE_ENV !== "production" ? "MUI: Expected valid input target. Did you use a custom `inputComponent` and forget to forward refs? See https://mui.com/r/input-component-ref-interface for more info." : qr(1));
-      Te({ value: We.value });
+      const je = Ae.target || ee.current;
+      if (je == null) throw new Error(process.env.NODE_ENV !== "production" ? "MUI: Expected valid input target. Did you use a custom `inputComponent` and forget to forward refs? See https://mui.com/r/input-component-ref-interface for more info." : qr(1));
+      Te({ value: je.value });
     }
     C.onChange && C.onChange(Ae, ...Ce), O && O(Ae, ...Ce);
   };
@@ -16462,12 +16462,12 @@ function Py(e) {
     default: !1,
     name: u,
     state: "open"
-  }), [Ae, Ce] = I.useState(!0), We = !h && _ != null && ve === Z(_), $e = Me && !H, Et = I.useMemo(() => h ? _ : _ != null ? [_] : [], [h, _]), Ft = I.useMemo(() => O !== uc || Et.length === 0 ? null : new Set(Et), [O, Et]), $t = I.useCallback((U) => Ft ? Ft.has(U) : Et.some((W) => W != null && O(U, W)), [
+  }), [Ae, Ce] = I.useState(!0), je = !h && _ != null && ve === Z(_), $e = Me && !H, Et = I.useMemo(() => h ? _ : _ != null ? [_] : [], [h, _]), Ft = I.useMemo(() => O !== uc || Et.length === 0 ? null : new Set(Et), [O, Et]), $t = I.useCallback((U) => Ft ? Ft.has(U) : Et.some((W) => W != null && O(U, W)), [
     O,
     Et,
     Ft
   ]), Ge = $e ? f($.filter((U) => !(S && $t(U))), {
-    inputValue: We && Ae ? "" : ve,
+    inputValue: je && Ae ? "" : ve,
     getOptionLabel: Z
   }) : [], ct = Iy({
     filteredOptions: Ge,
@@ -16753,7 +16753,7 @@ function Py(e) {
             const Oe = Ge[ce.current], Ke = C ? C(Oe) : !1;
             if (W.preventDefault(), Ke) return;
             Zr(W, Oe, "selectOption"), n && ee.current.setSelectionRange(ee.current.value.length, ee.current.value.length);
-          } else w && ve !== "" && We === !1 ? (h && W.preventDefault(), Zr(W, ve, "createOption", "freeSolo")) : $e && ke.current && (W.preventDefault(), Lr(W, "escape"));
+          } else w && ve !== "" && je === !1 ? (h && W.preventDefault(), Zr(W, ve, "createOption", "freeSolo")) : $e && ke.current && (W.preventDefault(), Lr(W, "escape"));
           break;
         }
         case "Escape":
@@ -17769,7 +17769,7 @@ var Ne = Be("MuiAutocomplete", [
   const n = De({
     props: t,
     name: "MuiAutocomplete"
-  }), { autoComplete: a = !1, autoHighlight: i = !1, autoSelect: l = !1, blurOnSelect: s = !1, ChipProps: c, className: u, clearIcon: p = Ac || (Ac = /* @__PURE__ */ Q(qy, { fontSize: "small" })), clearOnBlur: g = !n.freeSolo, clearOnEscape: v = !1, clearText: A = "Clear", closeText: b = "Close", componentsProps: m, defaultValue: f = n.multiple ? [] : null, disableClearable: S = !1, disableCloseOnSelect: w = !1, disabled: C = !1, disabledItemsFocusable: x = !1, disableListWrap: E = !1, disablePortal: y = !1, filterOptions: T, filterSelectedOptions: M = !1, forcePopupIcon: k = "auto", freeSolo: B = !1, fullWidth: O = !1, getLimitTagsText: h = (Je) => `+${Je}`, getOptionDisabled: P, getOptionKey: D, getOptionLabel: N, isOptionEqualToValue: L, groupBy: z, handleHomeEndKeys: Y = !n.freeSolo, id: te, includeInputInList: $ = !1, inputValue: H, limitTags: V = -1, ListboxComponent: q, ListboxProps: oe, loading: X = !1, loadingText: Z = "Loading…", multiple: pe = !1, noOptionsText: le = "No options", onChange: ee, onClose: J, onHighlightChange: re, onInputChange: ae, onOpen: F, open: j, openOnFocus: de = !1, openText: be = "Open", options: ce, PaperComponent: Te, PopperComponent: ke, popupIcon: Le = gc || (gc = /* @__PURE__ */ Q(ef, {})), readOnly: Fe = !1, renderGroup: _, renderInput: at, renderOption: ve, renderTags: dt, renderValue: fe, selectOnFocus: ge = !n.freeSolo, size: Ve = "medium", slots: Me = {}, slotProps: lt = {}, value: Ae, ...Ce } = n, { getRootProps: We, getInputProps: $e, getInputLabelProps: Et, getPopupIndicatorProps: Ft, getClearProps: $t, getItemProps: Ge, getListboxProps: ct, getOptionProps: me, value: Ee, dirty: xe, expanded: we, id: Ze, popupOpen: ot, focused: Mt, focusedItem: Se, anchorEl: it, setAnchorEl: Dr, inputValue: qi, groupedOptions: _t } = Py({
+  }), { autoComplete: a = !1, autoHighlight: i = !1, autoSelect: l = !1, blurOnSelect: s = !1, ChipProps: c, className: u, clearIcon: p = Ac || (Ac = /* @__PURE__ */ Q(qy, { fontSize: "small" })), clearOnBlur: g = !n.freeSolo, clearOnEscape: v = !1, clearText: A = "Clear", closeText: b = "Close", componentsProps: m, defaultValue: f = n.multiple ? [] : null, disableClearable: S = !1, disableCloseOnSelect: w = !1, disabled: C = !1, disabledItemsFocusable: x = !1, disableListWrap: E = !1, disablePortal: y = !1, filterOptions: T, filterSelectedOptions: M = !1, forcePopupIcon: k = "auto", freeSolo: B = !1, fullWidth: O = !1, getLimitTagsText: h = (Je) => `+${Je}`, getOptionDisabled: P, getOptionKey: D, getOptionLabel: N, isOptionEqualToValue: L, groupBy: z, handleHomeEndKeys: Y = !n.freeSolo, id: te, includeInputInList: $ = !1, inputValue: H, limitTags: V = -1, ListboxComponent: q, ListboxProps: oe, loading: X = !1, loadingText: Z = "Loading…", multiple: pe = !1, noOptionsText: le = "No options", onChange: ee, onClose: J, onHighlightChange: re, onInputChange: ae, onOpen: F, open: j, openOnFocus: de = !1, openText: be = "Open", options: ce, PaperComponent: Te, PopperComponent: ke, popupIcon: Le = gc || (gc = /* @__PURE__ */ Q(ef, {})), readOnly: Fe = !1, renderGroup: _, renderInput: at, renderOption: ve, renderTags: dt, renderValue: fe, selectOnFocus: ge = !n.freeSolo, size: Ve = "medium", slots: Me = {}, slotProps: lt = {}, value: Ae, ...Ce } = n, { getRootProps: je, getInputProps: $e, getInputLabelProps: Et, getPopupIndicatorProps: Ft, getClearProps: $t, getItemProps: Ge, getListboxProps: ct, getOptionProps: me, value: Ee, dirty: xe, expanded: we, id: Ze, popupOpen: ot, focused: Mt, focusedItem: Se, anchorEl: it, setAnchorEl: Dr, inputValue: qi, groupedOptions: _t } = Py({
     ...n,
     componentName: "Autocomplete"
   }), Lr = wy();
@@ -17824,7 +17824,7 @@ var Ne = Be("MuiAutocomplete", [
       ...yr,
       ...Ce
     },
-    getSlotProps: We,
+    getSlotProps: je,
     ownerState: wt
   }), [Hi, zi] = qe("listbox", {
     elementType: $y,
@@ -19123,15 +19123,27 @@ var ya = (e) => `${e.firstName} ${e.lastName}`, b3 = ({ ref: e, value: t, onChan
     })
   });
 }, Yl = Vt(x3), lo = Yl, hf = ({ open: e, onClose: t, onConfirm: r, onSearch: n, searchResults: a, isSearchLoading: i, isConfirmLoading: l, avatarSrcResolver: s, labels: c }) => {
-  const [u, p] = je([]), g = ze(null), v = () => {
-    u.length && (r(u), p([]), t());
+  const [u, p] = We([]), [g, v] = We(!1), A = ze(null), b = async () => {
+    if (!u.length || g) return;
+    const m = r(u);
+    if (m instanceof Promise) {
+      v(!0);
+      try {
+        await m;
+      } catch {
+        return;
+      } finally {
+        v(!1);
+      }
+    }
+    p([]), t();
   };
   return /* @__PURE__ */ R(nf, {
     fullWidth: !0,
     maxWidth: "sm",
     open: e,
     onClose: t,
-    onAnimationEnd: () => g.current?.focus(),
+    onAnimationEnd: () => A.current?.focus(),
     children: [
       /* @__PURE__ */ d(v3, { onClick: t }),
       /* @__PURE__ */ d(sf, {
@@ -19145,7 +19157,7 @@ var ya = (e) => `${e.firstName} ${e.lastName}`, b3 = ({ ref: e, value: t, onChan
           spacing: 2,
           marginTop: 1,
           children: /* @__PURE__ */ d(b3, {
-            ref: g,
+            ref: A,
             value: u,
             onChange: p,
             onInputChange: n,
@@ -19163,9 +19175,9 @@ var ya = (e) => `${e.firstName} ${e.lastName}`, b3 = ({ ref: e, value: t, onChan
       /* @__PURE__ */ d(af, { children: /* @__PURE__ */ d(lo, {
         fullWidth: !0,
         variant: "contained",
-        onClick: v,
+        onClick: b,
         disabled: !u.length,
-        loading: l,
+        loading: l || g,
         children: c?.confirm ?? "Chat"
       }) })
     ]
@@ -19266,7 +19278,7 @@ var ya = (e) => `${e.firstName} ${e.lastName}`, b3 = ({ ref: e, value: t, onChan
     })
   ]
 }), T3 = () => {
-  const [e, t] = je(null), r = !!e;
+  const [e, t] = We(null), r = !!e;
   return {
     anchorMenu: e,
     closeMenu: Qe(() => {
@@ -19278,7 +19290,7 @@ var ya = (e) => `${e.firstName} ${e.lastName}`, b3 = ({ ref: e, value: t, onChan
     }, [])
   };
 }, Hs = T3, k3 = ({ threadId: e, participants: t, onDeleteConversation: r, onAddParticipants: n, onSearchParticipants: a, searchResults: i, isSearchingParticipants: l, avatarSrcResolver: s, labels: c, formatParticipantName: u, headerAction: p, onAddParticipantDialogOpenChange: g }) => {
-  const { isMenuOpen: v, anchorMenu: A, closeMenu: b, openMenu: m } = Hs(), [f, S] = je(!1), w = $l(t, u), C = () => {
+  const { isMenuOpen: v, anchorMenu: A, closeMenu: b, openMenu: m } = Hs(), [f, S] = We(!1), w = $l(t, u), C = () => {
     b(), r(e);
   }, x = () => {
     b(), S(!0), g?.(!0);
@@ -19324,8 +19336,8 @@ var ya = (e) => `${e.firstName} ${e.lastName}`, b3 = ({ ref: e, value: t, onChan
             "aria-label": c?.addParticipant ?? "Add Participant",
             onClick: x,
             sx: {
-              "&:hover": { backgroundColor: "grey.200" },
-              backgroundColor: "grey.100",
+              "&:hover": { backgroundColor: ({ palette: E }) => E.mode === "dark" ? "grey.400" : "grey.200" },
+              backgroundColor: ({ palette: E }) => E.mode === "dark" ? "grey.500" : "grey.100",
               color: "text.primary"
             },
             children: /* @__PURE__ */ d(I3, { fontSize: "small" })
@@ -19706,7 +19718,7 @@ var sn = (e) => e.endsWith("Z") || /[+-]\d{2}:\d{2}$/.test(e) ? e : `${e}Z`, D3
     strokeLinejoin: "round"
   })
 }), Ca = 15, N3 = 40, vf = ({ onSend: e, labels: t, autoFocusKey: r, isSending: n, defaultMessage: a, maxLength: i = 1e4, startActions: l }) => {
-  const [s, c] = je(""), u = ze(null), p = () => {
+  const [s, c] = We(""), u = ze(null), p = () => {
     !s.trim() || n || (e(s.trim()), c(""));
   }, g = (v) => {
     v.key === "Enter" && !v.shiftKey && (v.preventDefault(), p());
@@ -20369,7 +20381,7 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
     year: "numeric"
   });
 }, oC = ({ threads: e, isLoading: t, selectedThreadId: r, onSelectThread: n, onNewConversation: a, avatarSrcResolver: i, labels: l, formatDate: s, formatParticipantName: c, onLoadMore: u, hasMore: p }) => {
-  const [g, v] = je(""), A = s ?? rC, b = ze(null), m = ze(null), f = p ?? !!u;
+  const [g, v] = We(""), A = s ?? rC, b = ze(null), m = ze(null), f = p ?? !!u;
   Ct(() => {
     const w = b.current, C = m.current;
     if (!(w && C && u && f) || t) return;
@@ -20583,7 +20595,7 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
   "audio/webm",
   "audio/mp4"
 ].find((e) => typeof MediaRecorder < "u" && MediaRecorder.isTypeSupported(e)), lC = (e) => `${String(Math.floor(e / 60)).padStart(2, "0")}:${String(e % 60).padStart(2, "0")}`, sC = ({ onRecorded: e, onError: t, labels: r, isProcessing: n = !1, disabled: a = !1, autoSubmitOnSilence: i = !1, maxDurationMs: l = 12e4, silenceTimeoutMs: s = 2500 }) => {
-  const [c, u] = je(!1), [p, g] = je(0), v = ze(null), A = ze(null), b = ze([]), m = ze(!1), f = ze(null), S = ze(null), w = () => {
+  const [c, u] = We(!1), [p, g] = We(0), v = ze(null), A = ze(null), b = ze([]), m = ze(!1), f = ze(null), S = ze(null), w = () => {
     S.current !== null && (cancelAnimationFrame(S.current), S.current = null), f.current?.close().catch(() => {
     }), f.current = null;
   }, C = () => {
@@ -20740,7 +20752,7 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
   }
   return r ? gC : t ? pC : i || a || void 0;
 }, mC = ({ children: e, open: t, onClose: r, src: n, ...a }) => {
-  const [i, l] = je(!1), s = () => {
+  const [i, l] = We(!1), s = () => {
     l(!0);
   }, c = (u, p) => (u && (r?.(u, p), l(!1)), (g) => {
     r?.(g, p), l(!1);
@@ -20848,7 +20860,7 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
     return !1;
   }
 }, bC = ({ src: e, srcThumb: t, fileName: r, children: n, sx: a, disableLightbox: i, disableThumb: l, open: s, onClose: c, onClickThumb: u, variant: p, iconOnly: g = !1, height: v = 152, width: A = 220 }) => {
-  const [b, m] = je(!1), [f, S] = je(!1), [w, C] = je(!0), x = xf() === Cf.Firefox, E = e?.toLowerCase(), y = !(E?.endsWith(".pdf") || E?.startsWith("blob:") || E?.endsWith(".eml")), T = E?.endsWith(".pdf"), M = l ? !0 : !w, k = rs(e) || rs(t), B = T && x, O = i ? 1 : 0.8, h = (y || T) && !k && M && !f && !i && e && !B, P = e?.split(".").pop()?.toLowerCase() || "", D = r || e?.split("/").pop()?.split("?")[0] || "", N = hC(g, f, k, P, e || "", t || ""), L = () => {
+  const [b, m] = We(!1), [f, S] = We(!1), [w, C] = We(!0), x = xf() === Cf.Firefox, E = e?.toLowerCase(), y = !(E?.endsWith(".pdf") || E?.startsWith("blob:") || E?.endsWith(".eml")), T = E?.endsWith(".pdf"), M = l ? !0 : !w, k = rs(e) || rs(t), B = T && x, O = i ? 1 : 0.8, h = (y || T) && !k && M && !f && !i && e && !B, P = e?.split(".").pop()?.toLowerCase() || "", D = r || e?.split("/").pop()?.split("?")[0] || "", N = hC(g, f, k, P, e || "", t || ""), L = () => {
     m((H) => !H);
   }, z = () => {
     m(!1), c?.();
@@ -21645,7 +21657,7 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
     ]
   }, T);
 }, IC = ({ Empty: e, action: t, items: r, fullWidth: n, sx: a, alwaysDisplaySecondaryAction: i, isLoading: l, disableLightbox: s, numberLoadingItems: c = 3, density: u = "standard", ...p }) => {
-  const [g, v] = je(""), A = xf() === Cf.Firefox, b = {
+  const [g, v] = We(""), A = xf() === Cf.Firefox, b = {
     ...cl.listItem,
     ...u === "comfortable" && {
       "&:last-of-type": { marginBottom: 0 },
@@ -21790,7 +21802,7 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
     getTextColor: t
   };
 }, QC = ({ colorShape: e, shapeBackgroundColor: t, color: r, height: n, width: a, withoutText: i, mode: l, sx: s, variant: c = "default", component: u = "img" }, p) => {
-  const [g, v] = je(""), { palette: A } = Rt(), { getTextColor: b, getImageModule: m, getSize: f, getShapeColor: S, getShapeBackgroundColor: w } = NC(), { height: C, width: x } = f({
+  const [g, v] = We(""), { palette: A } = Rt(), { getTextColor: b, getImageModule: m, getSize: f, getShapeColor: S, getShapeBackgroundColor: w } = NC(), { height: C, width: x } = f({
     height: n,
     variant: c,
     width: a,
@@ -22188,7 +22200,7 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
   ...e,
   children: [/* @__PURE__ */ d("path", { d: "M5.7 6.71c-.39.39-.39 1.02 0 1.41L9.58 12 5.7 15.88c-.39.39-.39 1.02 0 1.41s1.02.39 1.41 0l4.59-4.59c.39-.39.39-1.02 0-1.41L7.12 6.71c-.39-.39-1.03-.39-1.42 0" }), /* @__PURE__ */ d("path", { d: "M12.29 6.71c-.39.39-.39 1.02 0 1.41L16.17 12l-3.88 3.88c-.39.39-.39 1.02 0 1.41s1.02.39 1.41 0l4.59-4.59c.39-.39.39-1.02 0-1.41L13.7 6.7c-.38-.38-1.02-.38-1.41.01" })]
 }), HC = ({ onCommit: e, disabled: t }) => {
-  const [r, n] = je(0), [a, i] = je(!1), l = ze(0), s = Qe((p) => {
+  const [r, n] = We(0), [a, i] = We(!1), l = ze(0), s = Qe((p) => {
     t || (p.stopPropagation(), p.preventDefault(), l.current = p.clientX, i(!0), p.currentTarget.setPointerCapture(p.pointerId));
   }, [t]), c = Qe((p) => {
     a && n(p.clientX - l.current);
@@ -22504,15 +22516,15 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
     return null;
   }
 }, m5 = ({ groups: e, resources: t, tasks: r, isLoading: n, onTaskClick: a, onResourceClick: i, onGroupClick: l, onBarResize: s, renderGroup: c, renderResource: u, renderBar: p, renderTooltip: g, isTaskSelected: v, recenterKey: A, toolbarActions: b, toolbarLeadingActions: m, sidebarTitle: f, locale: S, labels: w, localStorageKeys: C, defaultViewMode: x = "day", sidebarWidth: E = 300, rowHeight: y = 36 }) => {
-  const T = C?.viewMode ?? a6.viewMode, [M, k] = je(() => i6(T) ?? x), [B, O] = je(() => /* @__PURE__ */ new Date()), [h, P] = je(!1), { palette: D, shape: N, typography: L } = Rt(), { t: z } = uo(), Y = ze(!1), te = ze(M), $ = ze(A), H = ze(null), V = ze(null), q = ze({
+  const T = C?.viewMode ?? a6.viewMode, [M, k] = We(() => i6(T) ?? x), [B, O] = We(() => /* @__PURE__ */ new Date()), [h, P] = We(!1), { palette: D, shape: N, typography: L } = Rt(), { t: z } = uo(), Y = ze(!1), te = ze(M), $ = ze(A), H = ze(null), V = ze(null), q = ze({
     delta: 0,
     lastEventAt: 0,
     used: !1
   }), oe = Ar(() => e ?? [], [e]), X = Ar(() => t ?? [], [t]), Z = Ar(() => r ?? [], [r]), pe = D.mode === "dark" ? D.grey[800] : D.divider, le = Qe((fe) => w?.[fe] ?? z(fe), [w, z]), ee = Ar(() => {
     const fe = /* @__PURE__ */ new Map();
     Z.forEach((Ce) => {
-      const We = fe.get(Ce.resourceId);
-      We ? We.push(Ce) : fe.set(Ce.resourceId, [Ce]);
+      const je = fe.get(Ce.resourceId);
+      je ? je.push(Ce) : fe.set(Ce.resourceId, [Ce]);
     });
     const ge = new Set(oe.map((Ce) => Ce.id)), Ve = /* @__PURE__ */ new Map(), Me = [];
     X.forEach((Ce) => {
@@ -22520,8 +22532,8 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
         Me.push(Ce);
         return;
       }
-      const We = Ve.get(Ce.groupId);
-      We ? We.push(Ce) : Ve.set(Ce.groupId, [Ce]);
+      const je = Ve.get(Ce.groupId);
+      je ? je.push(Ce) : Ve.set(Ce.groupId, [Ce]);
     });
     const lt = (Ce) => ({
       key: `resource:${Ce.id}`,
@@ -22530,13 +22542,13 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
       type: "resource"
     }), Ae = Me.map(lt);
     return oe.forEach((Ce) => {
-      const We = Ve.get(Ce.id) ?? [];
+      const je = Ve.get(Ce.id) ?? [];
       Ae.push({
-        childCount: Ce.childCount ?? We.length,
+        childCount: Ce.childCount ?? je.length,
         group: Ce,
         key: `group:${Ce.id}`,
         type: "group"
-      }), Ce.collapsed || Ae.push(...We.map(lt));
+      }), Ce.collapsed || Ae.push(...je.map(lt));
     }), Ae;
   }, [
     oe,
@@ -22663,11 +22675,11 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
       const Ae = Ma.indexOf(M) + lt;
       if (Ae < 0 || Ae >= Ma.length) return;
       Me.used = !0;
-      const Ce = Ve.clientX - fe.getBoundingClientRect().left, We = J.xToDate(Math.max(0, Ce + fe.scrollLeft - re));
+      const Ce = Ve.clientX - fe.getBoundingClientRect().left, je = J.xToDate(Math.max(0, Ce + fe.scrollLeft - re));
       V.current = {
-        date: We,
+        date: je,
         viewportX: Ce
-      }, O(We), k(Ma[Ae]);
+      }, O(je), k(Ma[Ae]);
     };
     return fe.addEventListener("wheel", ge, { passive: !1 }), () => fe.removeEventListener("wheel", ge);
   }, [
@@ -23002,7 +23014,7 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
     fillOpacity: "0.54"
   })
 }), Uo = 64, Vc = 1e3, p6 = ({ title: e, subtitle: t, isLastElement: r, active: n, onClick: a, variant: i, tag: l, collapseItems: s, collapseDefaultOpen: c, Action: u, Icon: p, Footer: g, Collapse: v }) => {
-  const [A, b] = je(!1), m = v || !!s?.length;
+  const [A, b] = We(!1), m = v || !!s?.length;
   return Ct(() => {
     c && b(!0);
   }, [c]), /* @__PURE__ */ R(se, {
@@ -23208,7 +23220,7 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
   },
   children: /* @__PURE__ */ d($c, { children: e })
 }), f6 = ({ items: e, isLoading: t, emptyMessage: r, containerStyle: n, variant: a, "data-test": i, "data-testid": l }) => {
-  const [s, c] = je("");
+  const [s, c] = We("");
   return t ? /* @__PURE__ */ d(fl, {
     sx: n,
     "data-test": i,
@@ -23650,7 +23662,7 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
     size: 20
   })
 }) : t?.endAdornment !== void 0 ? t?.endAdornment : r, w5 = ({ actionEndOption: e, actionStartOption: t, popupIcon: r, blurOnSelect: n, label: a, placeholder: i, name: l, slotProps: s, disableClearable: c, setSelectedValue: u, useQuery: p, noOptionsText: g, renderOption: v, getOptionLabel: A, keyOptionLabel: b, queryParams: m, openOnFocus: f, autoHighlight: S, queryParamsOnFocus: w, queryOptions: C, required: x, helperMessage: E, error: y, disabled: T, defaultValue: M, onFocus: k, onBlur: B, onChange: O, sx: h, renderInput: P, variant: D, InputProps: N, size: L, shrink: z, getOptionKey: Y, width: te, limitTags: $, groupBy: H, disableCloseOnSelect: V, renderGroup: q, value: oe, PopperComponent: X, ListboxProps: Z, multiple: pe, filterSelectedOptions: le, autoFocus: ee, onKeyDown: J, onNoResults: re, endAdornment: ae, inputSlotProps: F, inputRef: j, open: de, onOpen: be, onClose: ce, searchKey: Te = "q", disableInputLoader: ke = !1, fetchOnFocus: Le = !1, filterOptions: Fe = (at) => at, getOptionImageSrc: _ = (at) => at || void 0 }) => {
-  const [at, ve] = je(""), [dt, fe] = je(""), ge = sA(at, 300), Ve = de === void 0 ? void 0 : Le || at ? de : !1, Me = ge ? m : w ?? m, lt = de ?? !0, { data: Ae, isFetching: Ce, refetch: We } = p({
+  const [at, ve] = We(""), [dt, fe] = We(""), ge = sA(at, 300), Ve = de === void 0 ? void 0 : Le || at ? de : !1, Me = ge ? m : w ?? m, lt = de ?? !0, { data: Ae, isFetching: Ce, refetch: je } = p({
     [Te]: ge || void 0,
     ...Me
   }, { query: {
@@ -23705,7 +23717,7 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
   ]), Ft = Qe((xe, we, Ze) => {
     fe(we), Ze === "input" && ve(we);
   }, []), $t = Qe(async () => {
-    Le && !oe && await We({
+    Le && !oe && await je({
       [Te]: ge,
       ...m
     }), k?.();
@@ -23714,7 +23726,7 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
     k,
     Le,
     m,
-    We,
+    je,
     Te,
     oe
   ]), Ge = Qe(() => {
@@ -23974,7 +23986,7 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
     sx: [({ zIndex: l }) => ({ zIndex: l.modal }), ...Array.isArray(r) ? r : [r]]
   });
 }, k6 = ({ variant: e, onChange: t, disableCheckbox: r, placeholder: n, label: a, localeText: i, disableReset: l, disableSelectAll: s, value: c, onFocus: u, onBlur: p, open: g, getOptionLabel: v, onInputChange: A, inputValue: b, disableClearable: m, loading: f, resetInputValueOnSelectOption: S, renderOption: w, renderValue: C, width: x, sx: E, slotProps: y, tooltip: T, tooltipProps: M, size: k = "small", disableCloseOnSelect: B = !0, multiple: O = !0, options: h = [], ...P }, D) => {
-  const { t: N } = uo(), [L, z] = je(!1), [Y, te] = je(""), $ = b || Y, H = e === "chip", V = e === "filled", q = Array.isArray(c) ? !!c.length : c != null, oe = E6(c, O), X = a ?? n, Z = !!X, pe = L && !!$, le = (!!$ || q) && !m, ee = Z && q && !pe, J = Z && !ee, re = q && (O || ee) && !L, F = /* @__PURE__ */ d(Yc, {
+  const { t: N } = uo(), [L, z] = We(!1), [Y, te] = We(""), $ = b || Y, H = e === "chip", V = e === "filled", q = Array.isArray(c) ? !!c.length : c != null, oe = E6(c, O), X = a ?? n, Z = !!X, pe = L && !!$, le = (!!$ || q) && !m, ee = Z && q && !pe, J = Z && !ee, re = q && (O || ee) && !L, F = /* @__PURE__ */ d(Yc, {
     freeSolo: !1,
     multiple: O,
     disableClearable: m,
@@ -24332,7 +24344,7 @@ var eC = (e) => /* @__PURE__ */ R(ft, {
   children: e
 });
 function T5({ label: e, value: t, onChange: r, checked: n, onCheckedChange: a, options: i, variant: l, disabled: s, labelMenu: c, labelOnlyAfterSelection: u, applyOnSelect: p, hideMenuHeader: g, denseMenu: v, menuProps: A, separatorBetweenLabelAndOptionSelected: b = ":", multiple: m = !1, size: f = "medium" }) {
-  const S = n !== void 0, [w, C] = je(() => S ? n : m ? t || [] : t), x = S ? n : m ? t?.length > 0 : t != null, { anchorMenu: E, openMenu: y, isMenuOpen: T, closeMenu: M } = Hs(), { t: k } = uo(), B = Array.isArray(i), O = i !== void 0, h = ($) => {
+  const S = n !== void 0, [w, C] = We(() => S ? n : m ? t || [] : t), x = S ? n : m ? t?.length > 0 : t != null, { anchorMenu: E, openMenu: y, isMenuOpen: T, closeMenu: M } = Hs(), { t: k } = uo(), B = Array.isArray(i), O = i !== void 0, h = ($) => {
     S ? a?.($) : r?.($);
   }, P = () => {
     h(w), M();
@@ -24535,7 +24547,7 @@ var P6 = ({ fontSize: e, sx: t, color: r = "currentColor" }) => /* @__PURE__ */
   }).join(" • ");
   return e.length > Qc ? `${r} + ${e.length - Qc}` : r;
 }, L6 = Vt(({ accept: e, name: t, disabled: r, required: n, error: a, localeText: i, multiple: l, id: s, size: c, helperText: u, fullWidth: p, icon: g, onChange: v, label: A, pattern: b, title: m, value: f, variant: S = "vertical" }, w) => {
-  const [C, x] = je(null), { t: E } = uo(), { palette: y } = Rt(), T = S === "vertical", M = s || t, k = ze(null), B = ze(null), O = f === void 0 ? C : f, h = D6(O);
+  const [C, x] = We(null), { t: E } = uo(), { palette: y } = Rt(), T = S === "vertical", M = s || t, k = ze(null), B = ze(null), O = f === void 0 ? C : f, h = D6(O);
   iu(w, () => {
     const L = B.current;
     return L.reset = () => {
@@ -24771,7 +24783,7 @@ var P6 = ({ fontSize: e, sx: t, color: r = "currentColor" }) => /* @__PURE__ */
   const c = t?.toString() || r?.toString() || n?.toString() || " ", u = s.measureText(c).width, p = parseFloat(i.paddingLeft), g = parseFloat(i.paddingRight);
   return u + p + g + a;
 }, B5 = Vt(({ sx: e, maxWidth: t, minWidth: r, ...n }, a) => {
-  const i = ze(null), [l, s] = je(null), c = ze(void 0), { size: u } = n, p = u === "tiny", g = p ? 27 : 50, v = n?.slotProps?.input, A = !!v?.startAdornment || !!n?.InputProps?.startAdornment, b = !!v?.endAdornment || !!n?.InputProps?.endAdornment, m = (A ? g : 0) + (b ? g : 0), f = Qe(() => {
+  const i = ze(null), [l, s] = We(null), c = ze(void 0), { size: u } = n, p = u === "tiny", g = p ? 27 : 50, v = n?.slotProps?.input, A = !!v?.startAdornment || !!n?.InputProps?.startAdornment, b = !!v?.endAdornment || !!n?.InputProps?.endAdornment, m = (A ? g : 0) + (b ? g : 0), f = Qe(() => {
     const w = q6(i.current, n.value, n.defaultValue, n.placeholder, m);
     w !== null && s(Math.min(Math.max(w, r ?? 0), t ?? 1 / 0));
   }, [
@@ -24837,7 +24849,7 @@ var P6 = ({ fontSize: e, sx: t, color: r = "currentColor" }) => /* @__PURE__ */
     fill: r
   })
 }), K6 = ({ slotProps: e, ...t }) => {
-  const [r, n] = je(!1), a = () => {
+  const [r, n] = We(!1), a = () => {
     n((s) => !s);
   }, i = (s) => {
     s.preventDefault();
@@ -24932,7 +24944,7 @@ var P6 = ({ fontSize: e, sx: t, color: r = "currentColor" }) => /* @__PURE__ */
   color: "textSecondary",
   children: t
 })] }), D5 = ({ compactTitle: e, fullTitle: t, actions: r, compactActions: n, variant: a = "preview", onClose: i, onOpenFullPage: l, backLabel: s, onBack: c, labels: u, maxWidth: p = "lg" }) => {
-  const [g, v] = je(!1), { t: A } = uo(), { breakpoints: b } = Rt(), m = Co(b.down("sm")), f = Co(b.up("lg")), S = ze(null), w = iA() ? "⌘+↵" : "Ctrl+↵", C = typeof p == "number" ? {
+  const [g, v] = We(!1), { t: A } = uo(), { breakpoints: b } = Rt(), m = Co(b.down("sm")), f = Co(b.up("lg")), S = ze(null), w = iA() ? "⌘+↵" : "Ctrl+↵", C = typeof p == "number" ? {
     maxWidth: !1,
     sx: { maxWidth: p }
   } : { maxWidth: p }, x = Qe((E) => u?.[E] ?? A(E), [u, A]);
@@ -25535,7 +25547,7 @@ var P6 = ({ fontSize: e, sx: t, color: r = "currentColor" }) => /* @__PURE__ */
     })
   });
 }, r4 = ({ group: e }) => {
-  const { density: t, isMobile: r, isCollapsed: n } = br(po), { listItemPaddingY: a } = To[t], { groupLabel: i, items: l, collapsible: s = !1, defaultExpanded: c = !0 } = e, [u, p] = je(c), g = Zs[t], v = l.filter((f) => !Rf(f, r));
+  const { density: t, isMobile: r, isCollapsed: n } = br(po), { listItemPaddingY: a } = To[t], { groupLabel: i, items: l, collapsible: s = !1, defaultExpanded: c = !0 } = e, [u, p] = We(c), g = Zs[t], v = l.filter((f) => !Rf(f, r));
   if (!v.length) return null;
   const A = n || !s || u, b = () => s && p((f) => !f), m = (f) => {
     s && (f.key === "Enter" || f.key === " ") && (f.preventDefault(), b());
@@ -25633,7 +25645,7 @@ var P6 = ({ fontSize: e, sx: t, color: r = "currentColor" }) => /* @__PURE__ */
     children: /* @__PURE__ */ d(Xc, { items: e })
   });
 }, l4 = ({ AppBar: e, NavLink: t, Search: r, Logo: n, Footer: a, items: i, enableSearchFocusShortcut: l, disableResponsive: s, hideSearchDesktop: c, bottomLink: u, sideBarWidth: p = 260, storageKey: g = n4, density: v = "standard" }) => {
-  const { breakpoints: A } = Rt(), [b, m] = je(Bf.isDrawerOpen), [f, S] = je(() => a4(g)), w = Co(A.down("sm")), C = Co(A.between("sm", "md")), x = Qe(() => {
+  const { breakpoints: A } = Rt(), [b, m] = We(Bf.isDrawerOpen), [f, S] = We(() => a4(g)), w = Co(A.down("sm")), C = Co(A.between("sm", "md")), x = Qe(() => {
     m(!1);
   }, []), E = Qe(() => {
     m(!0);
@@ -25913,7 +25925,7 @@ var P6 = ({ fontSize: e, sx: t, color: r = "currentColor" }) => /* @__PURE__ */
   const { hasPermission: i } = b4(), l = i(r, n, a);
   return l ? e : !l && t ? t : null;
 }, j5 = v4, K5 = ({ children: e, permissions: t, disabledPermissions: r }) => {
-  const [n, a] = je(), i = Ar(() => ({
+  const [n, a] = We(), i = Ar(() => ({
     disabledPermissions: r,
     permissions: n,
     setPermissions: a
@@ -25940,7 +25952,7 @@ var P6 = ({ fontSize: e, sx: t, color: r = "currentColor" }) => /* @__PURE__ */
   horizontal: "center",
   vertical: "bottom"
 } }) => {
-  const [n, a] = je(y4), i = Qe((c) => {
+  const [n, a] = We(y4), i = Qe((c) => {
     a({
       component: c?.component,
       isOpen: !0,
@@ -25985,7 +25997,7 @@ var P6 = ({ fontSize: e, sx: t, color: r = "currentColor" }) => /* @__PURE__ */
     openSnackbar: n
   };
 }, z5 = C4, x4 = () => {
-  const [e, t] = je(0);
+  const [e, t] = We(0);
   return {
     handleChange: Qe((r, n) => {
       t(n);

package/dist/src/components/DataDisplay/Chat/components/ChatConversationDetailHeader.d.ts

@@ -4,7 +4,7 @@ interface ChatConversationDetailHeaderProps {
     threadId: string;
     participants?: ChatParticipant[] | null;
     onDeleteConversation: (threadId: string) => void;
-    onAddParticipants: (participants: ChatSearchUser[]) => void;
+    onAddParticipants: (participants: ChatSearchUser[]) => void | Promise<unknown>;
     onSearchParticipants?: (query: string) => void;
     searchResults?: ChatSearchUser[];
     isSearchingParticipants?: boolean;

package/dist/src/components/DataDisplay/Chat/types.d.ts

@@ -78,7 +78,7 @@ export interface ChatConversationDetailProps {
     onDeleteConversation: (threadId: string) => void;
     onNewConversation: () => void;
     onSendMessage: (threadId: string, body: string) => void;
-    onAddParticipants: (participants: ChatSearchUser[]) => void;
+    onAddParticipants: (participants: ChatSearchUser[]) => void | Promise<unknown>;
     onSearchParticipants?: (query: string) => void;
     searchResults?: ChatSearchUser[];
     isSearchingParticipants?: boolean;
@@ -156,7 +156,7 @@ export interface ChatVoiceRecorderProps {
 export interface ChatParticipantDialogProps {
     open: boolean;
     onClose: () => void;
-    onConfirm: (participants: ChatSearchUser[]) => void;
+    onConfirm: (participants: ChatSearchUser[]) => void | Promise<unknown>;
     onSearch: (query: string) => void;
     searchResults?: ChatSearchUser[];
     isSearchLoading?: boolean;

package/package.json

@@ -2,7 +2,7 @@
   "name": "@getsoren/design-system",
   "description": "Design System React library",
   "sideEffects": false,
-  "version": "4.72.0",
+  "version": "4.73.1",
   "license": "ISC",
   "type": "module",
   "types": "./dist/src/main.d.ts",