impact-ui 4.0.1-alpha.21 → 4.0.1-alpha.22

package/dist/components/TableChat/components/TableChatLeftSection/ChatChannelItem.js

@@ -1,10 +1,10 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { useState, useEffect } from "react";
 import default_1 from "../../../../node_modules/@mui/icons-material/NotificationsOff.js";
 import { getAssetUrl } from "../../../../utils/assetBase.js";
 import { ChannelCheckbox } from "./ChannelCheckbox/ChannelCheckbox.js";
 import { UnreadBadge } from "./UnreadBadge/UnreadBadge.js";
 import { Avatar } from "../../../Avatar/index.js";
+import { useTranslation } from "../../../../i18n/useTranslation.js";
 const PinnedIcon = getAssetUrl("icons/pinedIcon.svg");
 const ChatChannelItem = ({
   id,
@@ -21,24 +21,26 @@ const ChatChannelItem = ({
   handleChatSelect = { handleChatSelect },
   selectedChat,
   onPinnedChatClick,
+  onPinnedChange,
   handleToast,
+  isPinned: isPinnedProp,
   ...rest
 }) => {
-  const [showPinned, setShowPinned] = useState(rest.isPinned);
-  const handlePinnedChatClick = async (chatId, isPinned) => {
+  const { t } = useTranslation();
+  const isPinned = Boolean(isPinnedProp ?? rest.isPinned);
+  const handlePinnedChatClick = async (chatId, newPinned) => {
     if (onPinnedChatClick) {
+      onPinnedChange == null ? void 0 : onPinnedChange(chatId, newPinned);
       try {
-        const response = await onPinnedChatClick(chatId, isPinned);
-        setShowPinned(response);
+        const response = await onPinnedChatClick(chatId, newPinned);
+        onPinnedChange == null ? void 0 : onPinnedChange(chatId, response);
       } catch (error) {
-        handleToast(true, "Error pinning chat", "error");
+        onPinnedChange == null ? void 0 : onPinnedChange(chatId, !newPinned);
+        handleToast(true, t("tableChat.channelItem.errorPinningChat"), "error");
         console.error("Error pinning chat:", error);
       }
     }
   };
-  useEffect(() => {
-    setShowPinned(rest.isPinned);
-  }, [rest.isPinned]);
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -75,32 +77,28 @@ const ChatChannelItem = ({
           /* @__PURE__ */ jsx("p", { className: "channel-subtitle", children: subtitle }),
           /* @__PURE__ */ jsxs("div", { className: "pinnedChat_container", children: [
             /* @__PURE__ */ jsx("span", { className: "channel-time", children: timestamp }),
-            !showChannelList && /* @__PURE__ */ jsx(Fragment, { children: showPinned ? /* @__PURE__ */ jsx(
+            !showChannelList && /* @__PURE__ */ jsx(
               "img",
               {
                 alt: "",
-                height: 16,
+                "aria-label": isPinned ? t("tableChat.channelItem.unpinChat") : t("tableChat.channelItem.pinChat"),
+                className: isPinned ? "pinnedChat pinnedChat--active" : "pinnedChat",
+                role: "button",
                 src: PinnedIcon,
-                width: 16,
+                tabIndex: 0,
                 onClick: (e) => {
                   e.stopPropagation();
-                  handlePinnedChatClick(id, false);
+                  handlePinnedChatClick(id, !isPinned);
+                },
+                onKeyDown: (e) => {
+                  if (e.key === "Enter" || e.key === " ") {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    handlePinnedChatClick(id, !isPinned);
+                  }
                 }
               }
-            ) : /* @__PURE__ */ jsx(
-              "img",
-              {
-                alt: "",
-                className: "pinnedChat",
-                height: 16,
-                src: PinnedIcon,
-                width: 16,
-                onClick: (e) => {
-                  e.stopPropagation();
-                  handlePinnedChatClick(id, true);
-                }
-              }
-            ) })
+            )
           ] })
         ] })
       ]

package/dist/components/TableChat/components/TableChatLeftSection/ChatChannelList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatChannelList.d.ts","sourceRoot":"","sources":["../../../../../src/components/TableChat/components/TableChatLeftSection/ChatChannelList.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,eAAe,GAAI;;;;;;;;;;CAU/B,4CA4BA,CAAC"}
+{"version":3,"file":"ChatChannelList.d.ts","sourceRoot":"","sources":["../../../../../src/components/TableChat/components/TableChatLeftSection/ChatChannelList.tsx"],"names":[],"mappings":"AAOA,eAAO,MAAM,eAAe,GAAI;;;;;;;;;;CAU/B,4CAmFA,CAAC"}

package/dist/components/TableChat/components/TableChatLeftSection/ChatChannelList.js

@@ -1,5 +1,11 @@
 import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useCallback } from "react";
 import { ChatChannelItem } from "./ChatChannelItem.js";
+import { useTranslation } from "../../../../i18n/useTranslation.js";
+const isItemPinned = (item) => {
+  var _a;
+  return Boolean((item == null ? void 0 : item.isPinned) ?? ((_a = item == null ? void 0 : item.otherProps) == null ? void 0 : _a.is_pinned));
+};
 const ChatChannelList = ({
   channels,
   selectedChannelOrChatId,
@@ -11,23 +17,59 @@ const ChatChannelList = ({
   onPinnedChatClick,
   handleToast
 }) => {
-  return /* @__PURE__ */ jsx("div", { className: "chat-channel-list", children: Array.isArray(channels) && channels.length > 0 ? channels.map((channel, index) => /* @__PURE__ */ jsx(
+  const { t } = useTranslation();
+  const [pinnedOverrides, setPinnedOverrides] = useState({});
+  useEffect(() => {
+    if (!Array.isArray(channels)) return;
+    setPinnedOverrides((prev) => {
+      let changed = false;
+      const next = { ...prev };
+      channels.forEach((ch) => {
+        if ((ch == null ? void 0 : ch.id) != null && prev[ch.id] !== void 0 && isItemPinned(ch) === Boolean(prev[ch.id])) {
+          delete next[ch.id];
+          changed = true;
+        }
+      });
+      return changed ? next : prev;
+    });
+  }, [channels]);
+  const getEffectivePinned = useCallback(
+    (item) => {
+      if ((item == null ? void 0 : item.id) != null && pinnedOverrides.hasOwnProperty(item.id)) {
+        return Boolean(pinnedOverrides[item.id]);
+      }
+      return isItemPinned(item);
+    },
+    [pinnedOverrides]
+  );
+  const handlePinnedChange = useCallback((chatId, newPinned) => {
+    setPinnedOverrides((prev) => ({ ...prev, [chatId]: newPinned }));
+  }, []);
+  const sortedChannels = Array.isArray(channels) ? [...channels].sort((a, b) => {
+    const aPinned = getEffectivePinned(a);
+    const bPinned = getEffectivePinned(b);
+    if (aPinned === bPinned) return 0;
+    return aPinned ? -1 : 1;
+  }) : [];
+  return /* @__PURE__ */ jsx("div", { className: "chat-channel-list", children: sortedChannels.length > 0 ? sortedChannels.map((channel, index) => /* @__PURE__ */ jsx(
     ChatChannelItem,
     {
       ...channel,
       handleChatSelect,
       handleToast,
+      isPinned: getEffectivePinned(channel),
       isSelected: channel.id === selectedChannelOrChatId,
       selectedChat,
       showChannelList,
       showCheckbox,
       onClick: (e) => onChannelSelect(channel == null ? void 0 : channel.id, channel),
+      onPinnedChange: handlePinnedChange,
       onPinnedChatClick
     },
     `${channel.id}-${index}`
   )) : /* @__PURE__ */ jsxs("div", { className: "no-channels-found-container", children: [
-    /* @__PURE__ */ jsx("p", { className: "no-channels-found", children: "No channels found" }),
-    /* @__PURE__ */ jsx("p", { className: "no-channels-found-description", children: "No channels found. Please create a new channel to get started." })
+    /* @__PURE__ */ jsx("p", { className: "no-channels-found", children: showChannelList ? t("tableChat.channelList.noChannelsFound") : t("tableChat.channelList.noChatsFound") }),
+    /* @__PURE__ */ jsx("p", { className: "no-channels-found-description", children: showChannelList ? t("tableChat.channelList.createChannelPrompt") : t("tableChat.channelList.createChatPrompt") })
   ] }) });
 };
 export {

package/dist/components/TableChat/components/TableChatLeftSection/ChatHeaderButton/ChatHeaderButton.d.ts

@@ -1,7 +1,7 @@
 export declare const ChatHeaderButton: ({ onClick, label, icon, variant, size, className, type, ...props }: {
     [x: string]: any;
     onClick: any;
-    label?: string | undefined;
+    label: any;
     icon?: import("react/jsx-runtime").JSX.Element | undefined;
     variant?: string | undefined;
     size?: string | undefined;

package/dist/components/TableChat/components/TableChatLeftSection/ChatHeaderButton/ChatHeaderButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatHeaderButton.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatLeftSection/ChatHeaderButton/ChatHeaderButton.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,gBAAgB,GAAI;;;;;;;;;CAShC,4CAaA,CAAC"}
+{"version":3,"file":"ChatHeaderButton.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatLeftSection/ChatHeaderButton/ChatHeaderButton.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,gBAAgB,GAAI;;;;;;;;;CAShC,4CAcA,CAAC"}

package/dist/components/TableChat/components/TableChatLeftSection/ChatHeaderButton/ChatHeaderButton.js

@@ -1,9 +1,10 @@
 import { jsx } from "react/jsx-runtime";
 import default_1 from "../../../../../node_modules/@mui/icons-material/Add.js";
 import { Button } from "../../../../Button/index.js";
+import { useTranslation } from "../../../../../i18n/useTranslation.js";
 const ChatHeaderButton = ({
   onClick,
-  label = "Chat",
+  label,
   icon = /* @__PURE__ */ jsx(default_1, { fontSize: "small" }),
   variant = "contained",
   size = "large",
@@ -11,6 +12,7 @@ const ChatHeaderButton = ({
   type = "button",
   ...props
 }) => {
+  const { t } = useTranslation();
   return /* @__PURE__ */ jsx(
     Button,
     {
@@ -20,7 +22,7 @@ const ChatHeaderButton = ({
       variant,
       onClick,
       ...props,
-      children: label
+      children: label ?? t("tableChat.chatButton.label")
     }
   );
 };

package/dist/components/TableChat/components/TableChatLeftSection/ChatHeaderNavigation.d.ts

@@ -1,4 +1,2 @@
-import { default as React } from 'react';
-
-export declare const ChatHeaderNavigation: React.NamedExoticComponent<object>;
+export declare const ChatHeaderNavigation: import('react').NamedExoticComponent<object>;
 //# sourceMappingURL=ChatHeaderNavigation.d.ts.map

package/dist/components/TableChat/components/TableChatLeftSection/ChatHeaderNavigation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatHeaderNavigation.d.ts","sourceRoot":"","sources":["../../../../../src/components/TableChat/components/TableChatLeftSection/ChatHeaderNavigation.tsx"],"names":[],"mappings":"AACA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAWzD,eAAO,MAAM,oBAAoB,oCAmLhC,CAAC"}
+{"version":3,"file":"ChatHeaderNavigation.d.ts","sourceRoot":"","sources":["../../../../../src/components/TableChat/components/TableChatLeftSection/ChatHeaderNavigation.tsx"],"names":[],"mappings":"AAaA,eAAO,MAAM,oBAAoB,8CAoLhC,CAAC"}

package/dist/components/TableChat/components/TableChatLeftSection/ChatHeaderNavigation.js

@@ -8,6 +8,7 @@ import AddChat from "./AddChatContainer/AddChatContainer.js";
 import { ChatHeaderButton } from "./ChatHeaderButton/ChatHeaderButton.js";
 import { Button } from "../../../Button/index.js";
 import { Input } from "../../../Input/index.js";
+import { useTranslation } from "../../../../i18n/useTranslation.js";
 const ChatHeaderNavigation = memo(
   ({
     title,
@@ -25,6 +26,7 @@ const ChatHeaderNavigation = memo(
     isCreateNewChatOpen,
     setIsCreateNewChatOpen
   }) => {
+    const { t } = useTranslation();
     const [showAddChat, setShowAddChat] = useState(isCreateNewChatOpen);
     useEffect(() => {
       setShowAddChat(Boolean(isCreateNewChatOpen));
@@ -33,7 +35,7 @@ const ChatHeaderNavigation = memo(
       Input,
       {
         leftIcon: /* @__PURE__ */ jsx(default_1$1, {}),
-        placeholder: "Please enter text",
+        placeholder: t("tableChat.nav.searchChatPlaceholder"),
         rightIcon: /* @__PURE__ */ jsx(default_1, {}),
         rightIconClick: () => {
           onSearchClick(!onSearchClick);
@@ -76,7 +78,7 @@ const ChatHeaderNavigation = memo(
       showAddChatBtn && /* @__PURE__ */ jsx(
         ChatHeaderButton,
         {
-          label: "Chat",
+          label: t("tableChat.chatButton.label"),
           onClick: () => {
             setShowAddChat((prev) => !prev);
           }
@@ -112,7 +114,7 @@ const ChatHeaderNavigation = memo(
         Input,
         {
           leftIcon: /* @__PURE__ */ jsx(default_1$1, {}),
-          placeholder: "Please enter text",
+          placeholder: t("tableChat.nav.searchChannelPlaceholder"),
           rightIcon: /* @__PURE__ */ jsx(default_1, {}),
           rightIconClick: () => {
             onSearchClick(!onSearchClick);

package/dist/components/TableChat/components/TableChatLeftSection/TableChatChannelHeader.d.ts

@@ -1,6 +1,6 @@
 
 declare const TableChatChannelHeader: ({ title, channels, selectedChannelOrChatId, onBack, onChannelSelect, onMenuClick, onSearchClick, onMoreClick, showChannelList, setShowPinnedMsg, onThreadClick, isSearchOpen, headerConfig, showAddChatBtn, showCheckbox, handleChatName, filterChannelsByTitle, loadingChannels, selectedChannelInfo, handleToast, onPinnedChatClick, onDeleteTopics, selectedChat, handleChatSelect, isCreateNewChatOpen, setIsCreateNewChatOpen, }: {
-    title?: string | undefined;
+    title: any;
     channels?: never[] | undefined;
     selectedChannelOrChatId: any;
     onBack: any;

package/dist/components/TableChat/components/TableChatLeftSection/TableChatChannelHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableChatChannelHeader.d.ts","sourceRoot":"","sources":["../../../../../src/components/TableChat/components/TableChatLeftSection/TableChatChannelHeader.tsx"],"names":[],"mappings":"AAKA,OAAO,sCAAsC,CAAC;AAE9C,QAAA,MAAM,sBAAsB,GAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2B/B,4CAiFA,CAAC;AAEF,eAAe,sBAAsB,CAAC"}
+{"version":3,"file":"TableChatChannelHeader.d.ts","sourceRoot":"","sources":["../../../../../src/components/TableChat/components/TableChatLeftSection/TableChatChannelHeader.tsx"],"names":[],"mappings":"AAKA,OAAO,sCAAsC,CAAC;AAE9C,QAAA,MAAM,sBAAsB,GAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2B/B,4CAoFA,CAAC;AAEF,eAAe,sBAAsB,CAAC"}

package/dist/components/TableChat/components/TableChatLeftSection/TableChatChannelHeader.js

@@ -4,8 +4,9 @@ import { ChatChannelList } from "./ChatChannelList.js";
 import { ChatHeaderNavigation } from "./ChatHeaderNavigation.js";
 import { SkeletonList } from "../SkeletonList.js";
 
+import { useTranslation } from "../../../../i18n/useTranslation.js";
 const TableChatChannelHeader = ({
-  title = "Create new Chat",
+  title,
   channels = [],
   selectedChannelOrChatId,
   onBack,
@@ -35,8 +36,10 @@ const TableChatChannelHeader = ({
   const handleChannelSelect = (channelId, channelItem) => {
     onChannelSelect == null ? void 0 : onChannelSelect(channelId, channelItem);
   };
+  const { t } = useTranslation();
+  const resolvedTitle = title ?? t("tableChat.channelHeader.createNewChat");
   const channelsToShow = channels;
-  return /* @__PURE__ */ jsx("div", { className: "table-left-panel-container", children: loadingChannels ? /* @__PURE__ */ jsx("div", { style: { height: "100%" }, children: /* @__PURE__ */ jsx(SkeletonList, { text: "Loading messages..." }) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+  return /* @__PURE__ */ jsx("div", { className: "table-left-panel-container", children: loadingChannels ? /* @__PURE__ */ jsx("div", { style: { height: "100%" }, children: /* @__PURE__ */ jsx(SkeletonList, { text: t("tableChat.loadingMessages") }) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(
       ChatHeaderNavigation,
       {
@@ -53,7 +56,7 @@ const TableChatChannelHeader = ({
         showAddChatBtn,
         showChannelList,
         showSearchChat: headerConfig == null ? void 0 : headerConfig.showSearch,
-        title,
+        title: resolvedTitle,
         onBack,
         onDeleteTopics,
         onMenuClick,

package/dist/components/TableChat/components/TableChatRightSection/AvatarGroup/AvatarGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/AvatarGroup/AvatarGroup.tsx"],"names":[],"mappings":"AAEA,OAAO,2BAA2B,CAAC;AA4CnC,eAAO,MAAM,UAAU,GAAI;;;;CAAmB,4CA2B7C,CAAC;AAWF,QAAA,MAAM,WAAW,GAAI;;;;CAA6C,4CA8BjE,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"AvatarGroup.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/AvatarGroup/AvatarGroup.tsx"],"names":[],"mappings":"AAGA,OAAO,2BAA2B,CAAC;AA4CnC,eAAO,MAAM,UAAU,GAAI;;;;CAAmB,4CA2B7C,CAAC;AAeF,QAAA,MAAM,WAAW,GAAI;;;;CAA6C,4CA8BjE,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/components/TableChat/components/TableChatRightSection/AvatarGroup/AvatarGroup.js

@@ -2,6 +2,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
 
+import { useTranslation } from "../../../../../i18n/useTranslation.js";
 const getInitials = (name = "") => {
   const [firstName, lastName] = name.split(" ");
   if (firstName && lastName) {
@@ -76,10 +77,18 @@ const ChatAvatar = ({ src, name, size }) => {
   );
 };
 const MoreAvatar = ({ count, size }) => {
-  return /* @__PURE__ */ jsx("div", { className: `avatar avatar--${size} avatar--more`, title: `${count} more`, children: /* @__PURE__ */ jsxs("span", { children: [
-    "+",
-    count
-  ] }) });
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `avatar avatar--${size} avatar--more`,
+      title: t("tableChat.avatar.more", { count }),
+      children: /* @__PURE__ */ jsxs("span", { children: [
+        "+",
+        count
+      ] })
+    }
+  );
 };
 const AvatarGroup = ({ avatars = [], maxAvatars = 3, size = "md" }) => {
   const effectiveMaxAvatars = Math.min(Math.max(1, maxAvatars), avatars.length);

package/dist/components/TableChat/components/TableChatRightSection/ChatDefaultMessageType/ChatDefaultMessageType.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatDefaultMessageType.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/ChatDefaultMessageType/ChatDefaultMessageType.tsx"],"names":[],"mappings":"AAKA,OAAO,sCAAsC,CAAC;AAW9C,QAAA,MAAM,sBAAsB,GAAI;;;;;;;;;;;;;;;CAe/B,4CAiLA,CAAC;AAEF,eAAe,sBAAsB,CAAC"}
+{"version":3,"file":"ChatDefaultMessageType.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/ChatDefaultMessageType/ChatDefaultMessageType.tsx"],"names":[],"mappings":"AAMA,OAAO,sCAAsC,CAAC;AAW9C,QAAA,MAAM,sBAAsB,GAAI;;;;;;;;;;;;;;;CAe/B,4CAkLA,CAAC;AAEF,eAAe,sBAAsB,CAAC"}

package/dist/components/TableChat/components/TableChatRightSection/ChatDefaultMessageType/ChatDefaultMessageType.js

@@ -5,6 +5,7 @@ import DOMPurify from "dompurify";
 import { getAssetUrl } from "../../../../../utils/assetBase.js";
 import { Button } from "../../../../Button/index.js";
 
+import { useTranslation } from "../../../../../i18n/useTranslation.js";
 const ThreeDotIcon = getAssetUrl("icons/treedotIcon.svg");
 const TreadChatIcon = getAssetUrl("icons/treadChatIcon.svg");
 const PinnedIcon = getAssetUrl("icons/pinedIcon.svg");
@@ -29,6 +30,7 @@ const ChatDefaultMessageType = ({
   isHighlighted = false,
   highlightColor = null
 }) => {
+  const { t } = useTranslation();
   const renderContent = (content2) => {
     if (typeof content2 === "string") {
       const hasHtmlTags = /<[^>]*>/g.test(content2);
@@ -93,19 +95,23 @@ const ChatDefaultMessageType = ({
   const priorityContent = {
     normal: /* @__PURE__ */ jsxs("span", { className: "priority-label", children: [
       /* @__PURE__ */ jsx("img", { alt: "checkBlueIcon", src: CheckBlueIcon }),
-      " Normal Priority"
+      " ",
+      t("tableChat.priority.normal")
     ] }),
     high: /* @__PURE__ */ jsxs("span", { className: "priority-label", children: [
       /* @__PURE__ */ jsx("img", { alt: "warningRedIcon", src: WarningRedIcon }),
-      " High Priority"
+      " ",
+      t("tableChat.priority.high")
     ] }),
     medium: /* @__PURE__ */ jsxs("span", { className: "priority-label", children: [
       /* @__PURE__ */ jsx("img", { alt: "thumbsUpYellowIcon", src: ThumbsUpYellowIcon }),
-      " Medium Priority"
+      " ",
+      t("tableChat.priority.medium")
     ] }),
     low: /* @__PURE__ */ jsxs("span", { className: "priority-label", children: [
       /* @__PURE__ */ jsx("img", { alt: "notAllowedGreenIcon", src: NotAllowedGreenIcon }),
-      " Low Priority"
+      " ",
+      t("tableChat.priority.low")
     ] })
   };
   const showPriority = priority && priority !== "default" && priorityContent[priority];
@@ -178,7 +184,10 @@ const ChatDefaultMessageType = ({
             ] }),
             /* @__PURE__ */ jsxs("span", { className: "message-timestamp", children: [
               timestamp,
-              edited && /* @__PURE__ */ jsx("span", { className: "edited-label", children: " (edited)" })
+              edited && /* @__PURE__ */ jsxs("span", { className: "edited-label", children: [
+                " ",
+                t("commentsPanel.edited")
+              ] })
             ] })
           ] })
         ] })

package/dist/components/TableChat/components/TableChatRightSection/ChatDeleteMessageType/ChatDeletedMessageType.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatDeletedMessageType.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/ChatDeleteMessageType/ChatDeletedMessageType.tsx"],"names":[],"mappings":"AAGA,OAAO,8BAA8B,CAAC;AAEtC,eAAO,MAAM,sBAAsB,GAAI;;;CAA6B,4CAYnE,CAAC"}
+{"version":3,"file":"ChatDeletedMessageType.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/ChatDeleteMessageType/ChatDeletedMessageType.tsx"],"names":[],"mappings":"AAGA,OAAO,8BAA8B,CAAC;AAEtC,eAAO,MAAM,sBAAsB,GAAI;;;CAA6B,4CAanE,CAAC"}

package/dist/components/TableChat/components/TableChatRightSection/ChatDeleteMessageType/ChatDeletedMessageType.js

@@ -2,7 +2,9 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import default_1 from "../../../../../node_modules/@mui/icons-material/Block.js";
 
+import { useTranslation } from "../../../../../i18n/useTranslation.js";
 const ChatDeletedMessageType = ({ timestamp, isUser = false }) => {
+  const { t } = useTranslation();
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -10,7 +12,7 @@ const ChatDeletedMessageType = ({ timestamp, isUser = false }) => {
       children: [
         /* @__PURE__ */ jsxs("div", { className: "deleted-message-content", children: [
           /* @__PURE__ */ jsx(default_1, { className: "delete-icon" }),
-          /* @__PURE__ */ jsx("span", { className: "deleted-text", children: "Message deleted by its author" })
+          /* @__PURE__ */ jsx("span", { className: "deleted-text", children: t("tableChat.message.deleted") })
         ] }),
         timestamp && /* @__PURE__ */ jsx("span", { className: "deleted-timestamp", children: timestamp })
       ]

package/dist/components/TableChat/components/TableChatRightSection/ChatEditedMessageType /ChatEditedMessageType.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatEditedMessageType.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/ChatEditedMessageType /ChatEditedMessageType.tsx"],"names":[],"mappings":"AASA,QAAA,MAAM,qBAAqB,GAAI;;;;;;;;;CAS9B,4CAuCA,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"ChatEditedMessageType.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/ChatEditedMessageType /ChatEditedMessageType.tsx"],"names":[],"mappings":"AAUA,QAAA,MAAM,qBAAqB,GAAI;;;;;;;;;CAS9B,4CAwCA,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/dist/components/TableChat/components/TableChatRightSection/ChatEditedMessageType /ChatEditedMessageType.js

@@ -1,6 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useState } from "react";
 import { getAssetUrl } from "../../../../../utils/assetBase.js";
+import { useTranslation } from "../../../../../i18n/useTranslation.js";
 const ThreeDotIcon = getAssetUrl("icons/treedotIcon.svg");
 const TreadChatIcon = getAssetUrl("icons/treadChatIcon.svg");
 const PinnedIcon = getAssetUrl("icons/pinedIcon.svg");
@@ -15,6 +16,7 @@ const ChatEditedMessageType = ({
   pinned,
   onPin
 }) => {
+  const { t } = useTranslation();
   const [showPinned, setShowPinned] = useState(pinned);
   const handlePin = async (isPinned) => {
     try {
@@ -49,7 +51,10 @@ const ChatEditedMessageType = ({
         ),
         /* @__PURE__ */ jsxs("span", { className: "message-action-info", children: [
           timestamp,
-          edited && /* @__PURE__ */ jsx("span", { className: "edited-label", children: " (edited)" })
+          edited && /* @__PURE__ */ jsxs("span", { className: "edited-label", children: [
+            " ",
+            t("commentsPanel.edited")
+          ] })
         ] })
       ] })
     ] })

package/dist/components/TableChat/components/TableChatRightSection/ChatHeader/ChatHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatHeader.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/ChatHeader/ChatHeader.tsx"],"names":[],"mappings":"AAKA,OAAO,0BAA0B,CAAC;AAoBlC,eAAO,MAAM,UAAU,GAAI;;;;;;;;;;;CAW1B,4CAsYA,CAAC"}
+{"version":3,"file":"ChatHeader.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/ChatHeader/ChatHeader.tsx"],"names":[],"mappings":"AAMA,OAAO,0BAA0B,CAAC;AAoBlC,eAAO,MAAM,UAAU,GAAI;;;;;;;;;;;CAW1B,4CAuYA,CAAC"}

package/dist/components/TableChat/components/TableChatRightSection/ChatHeader/ChatHeader.js

@@ -1,5 +1,5 @@
 !function(){"use strict";try{if("undefined"!=typeof document){var t=document.createElement("style");t.appendChild(document.createTextNode(':root{--ia-focus-color:#4259ee;--ia-focus-bg:#fff;--ia-focus-ring-width:2px;--ia-focus-ring-offset:2px}*,:after,:before{box-sizing:border-box}body,textarea{font-style:normal;font-weight:500}a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{border:0;font-size:100%;font:inherit;margin:0;padding:0;vertical-align:initial}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}body{font-family:Manrope,sans-serif}.impact-notification-separator{background-color:#d9dde7;display:inline-block;height:16px;width:1.5px}.impact-notification-horizontal-separator{background-color:#d9dde7;display:inline-block;height:1px;width:100%}ul.storybook-order-list{list-style-type:disc;padding-left:12px}ul.storybook-order-list li{font-size:12px;line-height:20px;padding-bottom:8px}ul.storybook-order-list li strong{font-weight:800}ul.storybook-order-child-list{list-style-type:circle;padding-left:20px}ul.storybook-order-child-list li{font-size:12px;line-height:20px;padding-bottom:8px}ul.storybook-order-child-list li strong{font-weight:800}.chat-header{align-items:center;background:#fff;border-bottom:1px solid #b3bdf8;border-radius:10px 10px 0 0;box-sizing:border-box;display:flex;height:64px;justify-content:space-between;min-width:0;overflow:hidden;padding:6px 20px 5px}.chat-header .chat-header-info-slot{flex:1 1 auto;max-width:calc(100% - 220px);min-width:0;overflow:hidden}.chat-header .chat-header-info-slot.is-collapsed{flex:0 0 0;max-width:0;overflow:hidden;visibility:hidden;width:0}.chat-header .chat-header-content{max-width:100%;width:100%}.chat-header .chat-header-content .chat-title{color:#1f2b4d;display:block;font-size:16px;font-style:normal;font-weight:800;line-height:24px;min-width:0}.chat-header .chat-header-content .chat-title .resolved-badge{align-items:center;color:#4259ee;display:flex;font-size:14px;font-style:normal;font-weight:500;line-height:20px}.chat-header .chat-header-content .chat-title .resolved-badge img{height:16px;margin-right:2px;width:16px}.chat-header .chat-header-content .chat-created-by,.chat-header .chat-header-content .chat-id{color:#c3c8d4;font-size:14px;font-style:normal;font-weight:500;line-height:21px}.chat-header .chat-header-content .chat-created-by{margin-left:5px}.chat-header .chat-header-content .chat-created-by:before{color:#c3c8d4;content:"|";margin-right:6px}.chat-header .chat-header-content .chat-info-outer{display:block;min-width:0;width:100%}.chat-header .chat-header-content .chat-info-outer>span{display:block!important;min-width:0;width:100%}.chat-header .chat-header-content .chat-info-container{color:#c3c8d4;display:block;font-size:14px;font-style:normal;font-weight:500;line-height:21px;max-width:100%;min-width:0;white-space:nowrap;width:100%}.chat-header .chat-header-content .chat-created-by-container{display:inline-block;max-width:100%}.chat-header .chat-header-content .chat-created-at{color:#c3c8d4;font-size:14px;font-style:normal;font-weight:500;line-height:21px}.chat-header .chat-header-content .chat-text-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-header .chat-participants{align-items:center;display:flex;gap:12px}.chat-header .chat-participants .participant-avatars{align-items:center;display:flex}.chat-header .chat-participants .participant-avatars .participant-avatar{border:2px solid #fff;box-shadow:0 1px 3px #0000001a}.chat-header .chat-participants .participant-avatars .more-participants{align-items:center;background:#eceefd;border:2px solid #fff;border-radius:50%;color:#4259ee;display:flex;font-size:11px;font-weight:600;height:24px;justify-content:center;margin-left:-8px;min-width:24px;padding:4px 6px}.chat-header .chat-participants .participants-button{background:none!important;border:none!important;border-radius:4px;color:#7a8294;cursor:pointer;padding:4px}.chat-pinned{cursor:pointer;padding:.25rem;transition:all .2s ease-in-out}.chat-header-right{align-items:center;display:flex;flex:0 0 auto;gap:.5rem;justify-content:flex-end;min-width:0}.chat-header-right.search-enabled{flex:1;min-width:0}.ia-styles.ia-menu.three-dot-menu-container .MuiPaper-root{margin-left:32px;margin-top:4px}.chat-search-container{align-items:center;display:flex;flex:0 0 auto;gap:.5rem;position:relative}.chat-search-container .search-icon{cursor:pointer;flex-shrink:0}.chat-search-container .chat-search-input-container{position:relative;width:100%}.chat-search-container .chat-search-input-container .chat-search-input{background:none;border:1px solid #f0f0f0;border-radius:8px;box-sizing:border-box;color:#60697d;font-family:inherit;font-size:14px;height:32px;line-height:1.4;outline:none;padding:.5rem 2rem .5rem 1.75rem;transition:all .2s ease-in-out;width:100%}.chat-search-container .chat-search-input-container .chat-search-input::placeholder{color:#60697d;font-size:12px;padding-left:.5rem}.chat-search-container .chat-search-input-container .chat-search-input:focus{border:1px solid #4259ee}.chat-search-container .chat-search-input-container .chat-input-search-icon{color:#b2c2e0;cursor:pointer;height:1.5rem;left:.25rem;position:absolute;top:.25rem;width:1.5rem}.chat-search-container .chat-search-input-container .chat-search-input-close-icon{color:#60697d;cursor:pointer;height:12px;position:absolute;right:.625rem;top:.625rem;width:12px}.search-enabled .chat-search-container{flex:1 1 auto;min-width:0}.chat-participants-container{align-items:center;display:flex;gap:.5rem;position:relative}.chat-header-right-button{align-items:center;background:#f5f6fa;border-radius:10px;cursor:pointer;display:flex;font-size:3em;height:32px;justify-content:center;padding:.5rem;width:32px}.chat-header-right-button:active{background-color:#e2f4ff;transform:scale(.98)}.ia-styles.ia-menu.participants-menu-container .MuiPaper-root{display:flex;flex-direction:column;margin-left:28px;overflow:hidden!important;width:260px}.ia-styles.ia-menu.participants-menu-container .menu-header{background:#fff;border-radius:16px 16px 0 0;flex-shrink:0;padding:4px 0 0;position:sticky;top:0;z-index:10}.ia-styles.ia-menu.participants-menu-container .MuiList-root{flex:1;overflow-x:hidden;padding-top:0}.ia-styles.ia-menu.participants-menu-container .MuiList-root::-webkit-scrollbar{width:6px}.ia-styles.ia-menu.participants-menu-container .MuiList-root::-webkit-scrollbar-track{background:#0000}.ia-styles.ia-menu.participants-menu-container .MuiList-root::-webkit-scrollbar-thumb{background:#c3c8d4;border-radius:3px}.ia-styles.ia-menu.participants-menu-container .MuiList-root::-webkit-scrollbar-thumb:hover{background:#b4bac7}.ia-styles.ia-menu.participants-menu-container .MuiMenu-paper{overflow:hidden!important}.ia-styles.ia-menu.participants-menu-container .MuiMenu-list{max-height:320px;overflow-x:hidden!important;overflow-y:auto!important}.ia-styles.ia-menu.participants-menu-container .MuiButtonBase-root{padding:6px 16px}.ia-styles.ia-menu.participants-menu-container .menu-header-radio-group-container .ia-radioGroup .MuiFormControlLabel-root .MuiButtonBase-root{padding-left:12px!important}.ia-styles.ia-menu.participants-menu-container .menu-header-radio-group-container .MuiButtonBase-root{padding:8px 8px 8px 14px}.ia-styles.ia-menu.participants-menu-container .ia-menu-action-button-container{background:#fff;border-top:none;bottom:0;box-sizing:border-box;display:flex;flex-shrink:0;gap:12px;justify-content:flex-end;margin-top:auto;padding:8px 8px 4px;position:sticky;width:100%;z-index:10}.participants-img{height:22px}.btn_border_participant{background:#f5f6fa!important;border:none!important;height:32px!important}.pinned_img{background:none;background-color:initial!important;border:none!important}')),document.head.appendChild(t)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}}();
-import { jsxs, jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useEffect, useCallback } from "react";
 import { getAssetUrl } from "../../../../../utils/assetBase.js";
 import { MenuHeaderInfo } from "../../../../Menu/MenuHeaderInfo.js";
@@ -7,6 +7,7 @@ import { MenuHeaderInfo } from "../../../../Menu/MenuHeaderInfo.js";
 import ChatHeaderAction from "./ChatHeaderAction.js";
 import ChatHeaderInfo from "./ChatHeaderInfo.js";
 import { chartConfig } from "../../chatConfig.js";
+import { useTranslation } from "../../../../../i18n/useTranslation.js";
 const ActiveNotificationIcon = getAssetUrl("icons/active-notificationIcon.svg");
 function debounce(func, wait) {
   let timeout;
@@ -32,6 +33,7 @@ const ChatHeader = ({
   ...restProps
 }) => {
   var _a;
+  const { t } = useTranslation();
   const [enableSearch, setEnableSearch] = useState(false);
   const [threeDotMenuOpen, setThreeDotMenuOpen] = useState(false);
   const [menuSearchQuery, setMenuSearchQuery] = useState("");
@@ -168,7 +170,7 @@ const ChatHeader = ({
   const threeDotMenuOptions = [
     {
       id: "notifications",
-      label: "Notifications",
+      label: t("tableChat.header.notifications"),
       icon: /* @__PURE__ */ jsx("img", { alt: "notification", src: ActiveNotificationIcon }),
       onClick: () => {
         handleThreeDotMenuOptionClick("notifications");
@@ -243,9 +245,9 @@ const ChatHeader = ({
       {
         ...headerProps,
         customHeaderProps: {
-          searchPlaceholder: "Search in here...",
-          selectAllLabel: "Select all",
-          clearButtonText: "Clear",
+          searchPlaceholder: t("tableChat.header.searchInHere"),
+          selectAllLabel: t("common.selectAll"),
+          clearButtonText: t("common.clear"),
           radioButtonProps: {},
           searchInputProps: {
             style: { fontSize: "14px" }

package/dist/components/TableChat/components/TableChatRightSection/ChatHeader/ChatHeaderAction.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatHeaderAction.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/ChatHeader/ChatHeaderAction.tsx"],"names":[],"mappings":"AAmBA,QAAA,MAAM,gBAAgB,GAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkCzB,4CAmUA,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"ChatHeaderAction.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/ChatHeader/ChatHeaderAction.tsx"],"names":[],"mappings":"AAoBA,QAAA,MAAM,gBAAgB,GAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkCzB,4CAyUA,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/TableChat/components/TableChatRightSection/ChatHeader/ChatHeaderAction.js

@@ -11,6 +11,7 @@ import { Menu } from "../../../../Menu/index.js";
 import { chartConfig } from "../../chatConfig.js";
 import AvatarGroup from "../AvatarGroup/AvatarGroup.js";
 import { ChatNotificationSettings } from "../ChatNotificationSettings/ChatNotificationSettings.js";
+import { useTranslation } from "../../../../../i18n/useTranslation.js";
 const PinnedIcon = getAssetUrl("icons/pinnedIcon.svg");
 const SearchIcon = getAssetUrl("icons/searchIcon.svg");
 const UserPlusIcon = getAssetUrl("icons/userPlusIcon1.svg");
@@ -49,6 +50,7 @@ const ChatHeaderAction = ({
   chatHeaderConfig,
   ...restProps
 }) => {
+  const { t } = useTranslation();
   const {
     showSearch = chartConfig.tableChatRightSectionConfig.tableChatHeaderConfig.showSearch,
     showPinned = chartConfig.tableChatRightSectionConfig.tableChatHeaderConfig.showPinned,
@@ -197,7 +199,9 @@ const ChatHeaderAction = ({
         /* @__PURE__ */ jsx(
           Button,
           {
-            "aria-label": `View all ${participants.length} participants`,
+            "aria-label": t("tableChat.header.viewAllParticipants", {
+              count: participants.length
+            }),
             className: "btn_border participants-button ",
             icon: /* @__PURE__ */ jsx("img", { className: "participants-img", src: UserPlusIcon }),
             iconPlacement: "left",
@@ -247,7 +251,7 @@ const ChatHeaderAction = ({
             primaryButtonProps: {
               loading: isParticipantAdding,
               disabled: isParticipantAdding,
-              label: selectedRadioOption === "new" ? "Add" : "Remove"
+              label: selectedRadioOption === "new" ? t("tableChat.header.add") : t("tableChat.header.remove")
             },
             searchQuery: menuSearchQuery,
             selected: "add",

package/dist/components/TableChat/components/TableChatRightSection/ChatHeader/ChatHeaderInfo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatHeaderInfo.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/ChatHeader/ChatHeaderInfo.tsx"],"names":[],"mappings":"AAIA,QAAA,MAAM,cAAc,GAAI;;;;;;CAA2D,4CAoClF,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"ChatHeaderInfo.d.ts","sourceRoot":"","sources":["../../../../../../src/components/TableChat/components/TableChatRightSection/ChatHeader/ChatHeaderInfo.tsx"],"names":[],"mappings":"AAKA,QAAA,MAAM,cAAc,GAAI;;;;;;CAA2D,4CAyClF,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/TableChat/components/TableChatRightSection/ChatHeader/ChatHeaderInfo.js

@@ -1,8 +1,10 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useTextOverflow } from "../../../../../utils/useTextOverflow.js";
 import { Tooltip } from "../../../../Tooltip/index.js";
+import { useTranslation } from "../../../../../i18n/useTranslation.js";
 const ChatHeaderInfo = ({ title, createdBy, createdAt, chatId, showChatId = false }) => {
-  const fullText = `${showChatId && chatId ? `ID : ${chatId} ` : ""}${createdBy ? `Created by : ${createdBy}` : ""}${createdAt ? ` at : ${createdAt}` : ""}`;
+  const { t } = useTranslation();
+  const fullText = `${chatId && showChatId ? t("tableChat.header.idSegment", { id: chatId.slice(0, 6) }) : ""}${createdBy ? t("tableChat.header.createdBySegment", { createdBy }) : ""}${createdAt ? t("tableChat.header.atSegment", { createdAt }) : ""}`;
   const { textRef: fullTextRef, isOverflowing: isFullTextOverflowing } = useTextOverflow([
     fullText,
     title

package/dist/components/TableChat/components/TableChatRightSection/ChatInput/ChatInput.d.ts

@@ -1,6 +1,6 @@
 
 export declare const ChatInput: ({ placeholder, value, onChange, onSend, onAttach, onImageUpload, onEmojiClick, showFormatting, showQuickAction, quickActionLabel, disabled, maxLength, className, messageConfig, isEditMode, editingMessage, onCancelEdit, chatId, }: {
-    placeholder?: string | undefined;
+    placeholder: any;
     value: any;
     onChange: any;
     onSend: any;
@@ -9,7 +9,7 @@ export declare const ChatInput: ({ placeholder, value, onChange, onSend, onAttac
     onEmojiClick: any;
     showFormatting?: boolean | undefined;
     showQuickAction?: boolean | undefined;
-    quickActionLabel?: string | undefined;
+    quickActionLabel: any;
     disabled?: boolean | undefined;
     maxLength?: number | undefined;
     className?: string | undefined;