impact-ui 4.0.1-alpha.8 → 4.0.1

package/dist/components/Table/AgGridHeader.js

@@ -10,10 +10,11 @@ import { DatePicker } from "../DatePicker/index.js";
 import { DateRangePicker } from "../DateRangePicker/index.js";
 import { Input } from "../Input/index.js";
 import { Select } from "../Select/index.js";
-import { syncFiltersWithModal, parseInlineSearchValue, buildFilterModelEntry } from "./filterUtils.js";
+import { isNumericValueColumn, handleNumericKeyDown, isPartialNumericInput, handleNumericPaste, syncFiltersWithModal, parseInlineSearchValue, buildFilterModelEntry } from "./filterUtils.js";
 import { Tooltip } from "../Tooltip/index.js";
+import { useTranslation } from "../../i18n/useTranslation.js";
 import Badge from "../../node_modules/@mui/material/Badge/Badge.js";
-const TableSortIcon = getAssetUrl("icons/tableSortIcon.svg");
+const TableSortIconUrl = getAssetUrl("icons/tableSortIcon.svg");
 const TableSortAscIcon = getAssetUrl("icons/Up.svg");
 const TableSortDescIcon = getAssetUrl("icons/Down.svg");
 function AgGridHeader({
@@ -27,7 +28,8 @@ function AgGridHeader({
   enableHeaderTextWrap = true,
   ...rest
 }) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N, _O, _P, _Q, _R, _S, _T, _U, _V, _W, _X, _Y, _Z, __, _$, _aa, _ba, _ca, _da, _ea, _fa, _ga, _ha, _ia, _ja, _ka, _la, _ma, _na, _oa, _pa, _qa;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N, _O, _P, _Q, _R, _S, _T, _U, _V, _W, _X, _Y, _Z, __, _$, _aa, _ba, _ca, _da, _ea, _fa, _ga, _ha, _ia, _ja, _ka, _la, _ma, _na, _oa, _pa, _qa, _ra;
+  const { t } = useTranslation();
   if (!rest.column || !rest.api) {
     return null;
   }
@@ -167,6 +169,20 @@ function AgGridHeader({
   const [currentDropdownOptions, setCurrentDropdownOptions] = useState([]);
   const [isSelectAll, setIsSelectAll] = useState(false);
   useEffect(() => {
+    var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2;
+    const columnId = ((_a2 = rest.column) == null ? void 0 : _a2.field) || ((_b2 = rest.column) == null ? void 0 : _b2.colId);
+    const currentFilterModel = ((_d2 = (_c2 = rest.api) == null ? void 0 : _c2.getFilterModel) == null ? void 0 : _d2.call(_c2)) || {};
+    const existingFilter = currentFilterModel[columnId] ?? currentFilterModel[(_e2 = rest.column) == null ? void 0 : _e2.colId];
+    if (existingFilter) {
+      onFilterChanged();
+      if ((_g2 = (_f2 = rest.column) == null ? void 0 : _f2.colDef) == null ? void 0 : _g2.isSearchable) {
+        if (((_i2 = (_h2 = rest.column) == null ? void 0 : _h2.colDef) == null ? void 0 : _i2.filter) === "agDateColumnFilter") {
+          setShowDatePicker(true);
+        } else {
+          setShowInputField(true);
+        }
+      }
+    }
     rest.api.addEventListener("filterChanged", onFilterChanged);
     return () => {
       rest.api.removeEventListener("filterChanged", onFilterChanged);
@@ -274,6 +290,11 @@ function AgGridHeader({
     }, debounceTime),
     []
   );
+  const applySearchText = (value) => {
+    setSearchText(value);
+    setHasActiveSearch(!!value);
+    debouncedHandleSearchChange(value);
+  };
   const handleSearch = (e) => {
     var _a2, _b2;
     e.stopPropagation();
@@ -292,6 +313,7 @@ function AgGridHeader({
     setStartDate(null);
     setEndDate(null);
     setHasActiveSearch(false);
+    prevSearchValueRef.current = void 0;
     (_a2 = rest.api) == null ? void 0 : _a2.destroyFilter(colId);
     const currentFilterModel = { ...((_b2 = rest.api) == null ? void 0 : _b2.getFilterModel()) || {} };
     delete currentFilterModel[colId];
@@ -309,6 +331,7 @@ function AgGridHeader({
     }
     updateEmptyStateOverlay();
   };
+  const isNumericSearchColumn = isNumericValueColumn((_l = rest.column) == null ? void 0 : _l.colDef);
   const MIN_SEARCH_WIDTH = 200;
   const expandColumnIfNeeded = () => {
     var _a2;
@@ -404,7 +427,7 @@ function AgGridHeader({
         colDef.suppressHeaderKeyboardEvent = originalSuppressHeaderKeyboardEventRef.current;
       }
     };
-  }, [isInputFocused, (_l = rest.column) == null ? void 0 : _l.colId]);
+  }, [isInputFocused, (_m = rest.column) == null ? void 0 : _m.colId]);
   useEffect(() => {
     if (containerRef.current) {
       setContainerHeight(containerRef.current.clientHeight);
@@ -414,15 +437,15 @@ function AgGridHeader({
     "div",
     {
       ref: containerRef,
-      className: `custom-ag-header-container ${((_n = (_m = rest.column) == null ? void 0 : _m.colDef) == null ? void 0 : _n.checkboxSelection) ? "checkbox-selection" : ""} ${((_p = (_o = rest.column) == null ? void 0 : _o.colDef) == null ? void 0 : _p.customHeaderIcons) || !((_r = (_q = rest.column) == null ? void 0 : _q.colDef) == null ? void 0 : _r.suppressMenu) || ((_t = (_s = rest.column) == null ? void 0 : _s.colDef) == null ? void 0 : _t.isSearchable) ? "with-icons" : ""}`,
+      className: `custom-ag-header-container ${((_o = (_n = rest.column) == null ? void 0 : _n.colDef) == null ? void 0 : _o.checkboxSelection) ? "checkbox-selection" : ""} ${((_q = (_p = rest.column) == null ? void 0 : _p.colDef) == null ? void 0 : _q.customHeaderIcons) || !((_s = (_r = rest.column) == null ? void 0 : _r.colDef) == null ? void 0 : _s.suppressMenu) || ((_u = (_t = rest.column) == null ? void 0 : _t.colDef) == null ? void 0 : _u.isSearchable) ? "with-icons" : ""}`,
       onClick: () => rest.onClick(),
       children: showDatePicker ? /* @__PURE__ */ jsxs("div", { className: `ia-search-input-field ia-search-input-narrow`, children: [
-        ((_v = (_u = rest.column) == null ? void 0 : _u.colDef) == null ? void 0 : _v.thirdOptionAsDateRangePicker) ? /* @__PURE__ */ jsx(
+        ((_w = (_v = rest.column) == null ? void 0 : _v.colDef) == null ? void 0 : _w.thirdOptionAsDateRangePicker) ? /* @__PURE__ */ jsx(
           DateRangePicker,
           {
             fullWidth: true,
             withPortal: true,
-            customIcon: ((_x = (_w = rest.column) == null ? void 0 : _w.colDef) == null ? void 0 : _x.advanceSearchEnabled) && /* @__PURE__ */ jsx(
+            customIcon: ((_y = (_x = rest.column) == null ? void 0 : _x.colDef) == null ? void 0 : _y.advanceSearchEnabled) && /* @__PURE__ */ jsx(
               default_1,
               {
                 className: "ia-search-input-field-custom-icon",
@@ -439,7 +462,7 @@ function AgGridHeader({
                 }
               }
             ),
-            displayFormat: ((_z = (_y = rest.column) == null ? void 0 : _y.colDef) == null ? void 0 : _z.displayFormat) || "MM-DD-YYYY",
+            displayFormat: ((_A = (_z = rest.column) == null ? void 0 : _z.colDef) == null ? void 0 : _A.displayFormat) || "MM-DD-YYYY",
             endDate,
             handleDatesChange: (start, end) => {
               setStartDate(start);
@@ -472,7 +495,7 @@ function AgGridHeader({
             fullWidth: true,
             showMonthYearSelect: true,
             withPortal: true,
-            customIcon: ((_B = (_A = rest.column) == null ? void 0 : _A.colDef) == null ? void 0 : _B.advanceSearchEnabled) && /* @__PURE__ */ jsx(
+            customIcon: ((_C = (_B = rest.column) == null ? void 0 : _B.colDef) == null ? void 0 : _C.advanceSearchEnabled) && /* @__PURE__ */ jsx(
               default_1,
               {
                 className: "ia-search-input-field-custom-icon",
@@ -488,10 +511,10 @@ function AgGridHeader({
                 }
               }
             ),
-            displayFormat: ((_D = (_C = rest.column) == null ? void 0 : _C.colDef) == null ? void 0 : _D.displayFormat) || "MM-DD-YYYY",
+            displayFormat: ((_E = (_D = rest.column) == null ? void 0 : _D.colDef) == null ? void 0 : _E.displayFormat) || "MM-DD-YYYY",
             maxDate: /* @__PURE__ */ new Date("2100-12-31"),
             minDate: /* @__PURE__ */ new Date("2000-01-01"),
-            placeholder: "Select Date",
+            placeholder: t("table.filter.selectDate"),
             selectedDate,
             setSelectedDate,
             onPrimaryButtonClick: () => {
@@ -524,9 +547,9 @@ function AgGridHeader({
         "div",
         {
           className: `ia-search-input-field ia-search-input-narrow
-             ${((_F = (_E = rest.column) == null ? void 0 : _E.colDef) == null ? void 0 : _F.thirdOptionAsDropdown) ? "with-dropdown" : ""}`,
+             ${((_G = (_F = rest.column) == null ? void 0 : _F.colDef) == null ? void 0 : _G.thirdOptionAsDropdown) ? "with-dropdown" : ""}`,
           children: [
-            ((_H = (_G = rest.column) == null ? void 0 : _G.colDef) == null ? void 0 : _H.thirdOptionAsDropdown) && !((_J = (_I = rest.column) == null ? void 0 : _I.colDef) == null ? void 0 : _J.toShowDuplicateColumnInAdvanceSearch) ? /* @__PURE__ */ jsxs(
+            ((_I = (_H = rest.column) == null ? void 0 : _H.colDef) == null ? void 0 : _I.thirdOptionAsDropdown) && !((_K = (_J = rest.column) == null ? void 0 : _J.colDef) == null ? void 0 : _K.toShowDuplicateColumnInAdvanceSearch) ? /* @__PURE__ */ jsxs(
               "div",
               {
                 id: "ia-select-option-dropdown-container",
@@ -542,13 +565,13 @@ function AgGridHeader({
                     {
                       currentOptions: currentDropdownOptions,
                       dropDownPortalClassName: "ag-select-dropdown-portal",
-                      initialOptions: (_L = (_K = rest == null ? void 0 : rest.column) == null ? void 0 : _K.colDef) == null ? void 0 : _L.thirdOptionDropdownOptions,
+                      initialOptions: (_M = (_L = rest == null ? void 0 : rest.column) == null ? void 0 : _L.colDef) == null ? void 0 : _M.thirdOptionDropdownOptions,
                       isClearable: true,
-                      isMulti: (_N = (_M = rest == null ? void 0 : rest.column) == null ? void 0 : _M.colDef) == null ? void 0 : _N.enableMultiSelect,
+                      isMulti: (_O = (_N = rest == null ? void 0 : rest.column) == null ? void 0 : _N.colDef) == null ? void 0 : _O.enableMultiSelect,
                       isOpen: isDropdownOpen,
                       isSelectAll,
-                      isWithSearch: (_P = (_O = rest == null ? void 0 : rest.column) == null ? void 0 : _O.colDef) == null ? void 0 : _P.enableSearch,
-                      placeholder: "Select option",
+                      isWithSearch: (_Q = (_P = rest == null ? void 0 : rest.column) == null ? void 0 : _P.colDef) == null ? void 0 : _Q.enableSearch,
+                      placeholder: t("table.filter.selectOption"),
                       selectedOptions: selectedDropdownOption,
                       setCurrentOptions: setCurrentDropdownOptions,
                       setIsOpen: setIsDropdownOpen,
@@ -566,7 +589,7 @@ function AgGridHeader({
                           }
                         }
                       },
-                      toggleSelectAll: (_R = (_Q = rest == null ? void 0 : rest.column) == null ? void 0 : _Q.colDef) == null ? void 0 : _R.enableMultiSelect,
+                      toggleSelectAll: (_S = (_R = rest == null ? void 0 : rest.column) == null ? void 0 : _R.colDef) == null ? void 0 : _S.enableMultiSelect,
                       onClearAll: () => {
                         setSelectedDropdownOption(isMultiSelect ? [] : null);
                         setHasActiveSearch(false);
@@ -581,10 +604,10 @@ function AgGridHeader({
                       },
                       withPortal: true,
                       minWidth: "100%",
-                      ...(_T = (_S = rest.column) == null ? void 0 : _S.colDef) == null ? void 0 : _T.selectProps
+                      ...(_U = (_T = rest.column) == null ? void 0 : _T.colDef) == null ? void 0 : _U.selectProps
                     }
                   ),
-                  ((_V = (_U = rest.column) == null ? void 0 : _U.colDef) == null ? void 0 : _V.advanceSearchEnabled) && /* @__PURE__ */ jsx(
+                  ((_W = (_V = rest.column) == null ? void 0 : _V.colDef) == null ? void 0 : _W.advanceSearchEnabled) && /* @__PURE__ */ jsx(
                     default_1,
                     {
                       className: "ia-search-input-field-custom-icon",
@@ -617,9 +640,16 @@ function AgGridHeader({
               Input,
               {
                 ref: inputRef,
-                iconClickOnDisabled: (_X = (_W = rest.column) == null ? void 0 : _W.colDef) == null ? void 0 : _X.toShowDuplicateColumnInAdvanceSearch,
-                isDisabled: (_Z = (_Y = rest.column) == null ? void 0 : _Y.colDef) == null ? void 0 : _Z.toShowDuplicateColumnInAdvanceSearch,
-                placeholder: "Search",
+                iconClickOnDisabled: (_Y = (_X = rest.column) == null ? void 0 : _X.colDef) == null ? void 0 : _Y.toShowDuplicateColumnInAdvanceSearch,
+                inputProps: isNumericSearchColumn ? {
+                  inputMode: "decimal",
+                  onKeyDown: handleNumericKeyDown,
+                  onPaste: (e) => {
+                    handleNumericPaste(e, applySearchText);
+                  }
+                } : void 0,
+                isDisabled: (__ = (_Z = rest.column) == null ? void 0 : _Z.colDef) == null ? void 0 : __.toShowDuplicateColumnInAdvanceSearch,
+                placeholder: t("common.search"),
                 rightIcon: /* @__PURE__ */ jsxs(Fragment, { children: [
                   searchText.toString().length > 0 && /* @__PURE__ */ jsx(
                     default_1$1,
@@ -632,7 +662,7 @@ function AgGridHeader({
                       }
                     }
                   ),
-                  ((_$ = (__ = rest.column) == null ? void 0 : __.colDef) == null ? void 0 : _$.advanceSearchEnabled) && /* @__PURE__ */ jsx(
+                  ((_aa = (_$ = rest.column) == null ? void 0 : _$.colDef) == null ? void 0 : _aa.advanceSearchEnabled) && /* @__PURE__ */ jsx(
                     default_1,
                     {
                       onClick: () => {
@@ -651,9 +681,11 @@ function AgGridHeader({
                 ] }),
                 value: searchText,
                 onChange: (e) => {
-                  setSearchText(e.target.value);
-                  setHasActiveSearch(!!e.target.value);
-                  debouncedHandleSearchChange(e.target.value);
+                  const nextValue = e.target.value;
+                  if (isNumericSearchColumn && !isPartialNumericInput(nextValue)) {
+                    return;
+                  }
+                  applySearchText(nextValue);
                 }
               }
             ),
@@ -677,9 +709,9 @@ function AgGridHeader({
           /* @__PURE__ */ jsxs(
             "div",
             {
-              className: `ag-header-cell-text ${((_ba = (_aa = rest.column) == null ? void 0 : _aa.colDef) == null ? void 0 : _ba.sortable) ? "sortable" : ""} ${enableHeaderTextWrap ? "header-wrap-enabled" : ""}`,
+              className: `ag-header-cell-text ${((_ca = (_ba = rest.column) == null ? void 0 : _ba.colDef) == null ? void 0 : _ca.sortable) ? "sortable" : ""} ${enableHeaderTextWrap ? "header-wrap-enabled" : ""}`,
               children: [
-                ((_da = (_ca = rest.column) == null ? void 0 : _ca.colDef) == null ? void 0 : _da.field) === "Selection" || ((_fa = (_ea = rest.column) == null ? void 0 : _ea.colDef) == null ? void 0 : _fa.checkboxSelection) ? children : /* @__PURE__ */ jsx(
+                ((_ea = (_da = rest.column) == null ? void 0 : _da.colDef) == null ? void 0 : _ea.field) === "Selection" || ((_ga = (_fa = rest.column) == null ? void 0 : _fa.colDef) == null ? void 0 : _ga.checkboxSelection) ? children : /* @__PURE__ */ jsx(
                   "div",
                   {
                     ref: headerTextRef,
@@ -702,13 +734,13 @@ function AgGridHeader({
                     )
                   }
                 ),
-                (_ha = (_ga = rest.column) == null ? void 0 : _ga.colDef) == null ? void 0 : _ha.headerIcons,
-                ((_ja = (_ia = rest.column) == null ? void 0 : _ia.colDef) == null ? void 0 : _ja.sortable) && /* @__PURE__ */ jsx(
+                (_ia = (_ha = rest.column) == null ? void 0 : _ha.colDef) == null ? void 0 : _ia.headerIcons,
+                ((_ka = (_ja = rest.column) == null ? void 0 : _ja.colDef) == null ? void 0 : _ka.sortable) && /* @__PURE__ */ jsx(
                   "img",
                   {
                     alt: "TableSortIcon",
                     className: "ia-table-sort-icon",
-                    src: currentSort === "asc" ? TableSortAscIcon : currentSort === "desc" ? TableSortDescIcon : TableSortIcon,
+                    src: currentSort === "asc" ? TableSortAscIcon : currentSort === "desc" ? TableSortDescIcon : TableSortIconUrl,
                     onClick: onHeaderClick
                   }
                 )
@@ -720,10 +752,10 @@ function AgGridHeader({
             {
               className: `ia-icon-div ${hasActiveSearch ? "has-active-search" : ""} ${menuVisible ? "menu-visible" : ""}`,
               children: [
-                (_ma = (_la = (_ka = rest.column) == null ? void 0 : _ka.colDef) == null ? void 0 : _la.customHeaderIcons) == null ? void 0 : _ma.map((icon) => {
+                (_na = (_ma = (_la = rest.column) == null ? void 0 : _la.colDef) == null ? void 0 : _ma.customHeaderIcons) == null ? void 0 : _na.map((icon) => {
                   return icon;
                 }),
-                ((_oa = (_na = rest.column) == null ? void 0 : _na.colDef) == null ? void 0 : _oa.isSearchable) && (hasActiveSearch || !showInputField) && /* @__PURE__ */ jsx(Badge, { invisible: !hasActiveSearch, variant: "dot", children: /* @__PURE__ */ jsx(
+                ((_pa = (_oa = rest.column) == null ? void 0 : _oa.colDef) == null ? void 0 : _pa.isSearchable) && (hasActiveSearch || !showInputField) && /* @__PURE__ */ jsx(Badge, { invisible: !hasActiveSearch, variant: "dot", children: /* @__PURE__ */ jsx(
                   default_1$2,
                   {
                     fontSize: "small",
@@ -744,7 +776,7 @@ function AgGridHeader({
                     } : handleSearch
                   }
                 ) }),
-                !((_qa = (_pa = rest.column) == null ? void 0 : _pa.colDef) == null ? void 0 : _qa.suppressMenu) && /* @__PURE__ */ jsx("div", { className: "custom-ag-header-icons", children: /* @__PURE__ */ jsx(
+                !((_ra = (_qa = rest.column) == null ? void 0 : _qa.colDef) == null ? void 0 : _ra.suppressMenu) && /* @__PURE__ */ jsx("div", { className: "custom-ag-header-icons", children: /* @__PURE__ */ jsx(
                   "button",
                   {
                     ref: menuRef,

package/dist/components/Table/CommentsPortal.d.ts

@@ -1,13 +1,11 @@
-import { default as React } from 'react';
-
-declare const CommentsPortal: ({ isOpen, onClose, comments, onAddComment, cellId, position, author, onMouseEnter, onMouseLeave, openedBy, onMenuClick, onMarkAsReadClick, onMarkAsResolvedClick, editCommentText, isLoading, error, onClearError, currentAuthor, editingComment, onUpdateComment, setEditingComment, loadParticipantsAvatar, resolvedComments, messageId, configuration, }: {
+declare const CommentsPortal: ({ isOpen, onClose, comments, onAddComment, cellId, position, author: authorProp, onMouseEnter, onMouseLeave, openedBy, onMenuClick, onMarkAsReadClick, onMarkAsResolvedClick, editCommentText, isLoading, error, onClearError, currentAuthor, editingComment, onUpdateComment, setEditingComment, loadParticipantsAvatar, resolvedComments, messageId, configuration, }: {
     isOpen: any;
     onClose: any;
     comments: any;
     onAddComment: any;
     cellId: any;
     position: any;
-    author?: string | undefined;
+    author: any;
     onMouseEnter: any;
     onMouseLeave: any;
     openedBy: any;
@@ -26,6 +24,6 @@ declare const CommentsPortal: ({ isOpen, onClose, comments, onAddComment, cellId
     resolvedComments?: never[] | undefined;
     messageId?: null | undefined;
     configuration: any;
-}) => React.ReactPortal | null;
+}) => import('react').ReactPortal | null;
 export default CommentsPortal;
 //# sourceMappingURL=CommentsPortal.d.ts.map

package/dist/components/Table/CommentsPortal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CommentsPortal.d.ts","sourceRoot":"","sources":["../../../src/components/Table/CommentsPortal.tsx"],"names":[],"mappings":"AACA,OAAO,KAA+C,MAAM,OAAO,CAAC;AAkBpE,QAAA,MAAM,cAAc,GAAI;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BvB,6BA4WA,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"CommentsPortal.d.ts","sourceRoot":"","sources":["../../../src/components/Table/CommentsPortal.tsx"],"names":[],"mappings":"AAiBA,QAAA,MAAM,cAAc,GAAI;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BvB,uCA8WA,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/Table/CommentsPortal.js

@@ -1,17 +1,14 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useRef, useEffect } from "react";
+import { MoreHorizontal as MoreHorizontal_default, SuccessFill as SuccessFill_default, SuccessGray as SuccessGray_default, Close as Close_default } from "../../node_modules/@impactsmartsuite/impact-icons/dist/index.js";
 import moment from "moment";
 import { createPortal } from "react-dom";
-import { getAssetUrl } from "../../utils/assetBase.js";
+import { getUserAvatarColor } from "../../utils/avatarColor.js";
+import { toInnerHTML } from "../../utils/html.js";
 import { Avatar } from "../Avatar/index.js";
 import { Button } from "../Button/index.js";
 import NoComments from "./NoComments.js";
-import { getUserAvatarColor } from "../../utils/avatarColor.js";
-import { toInnerHTML } from "../../utils/html.js";
-const CloseIcon = (props) => /* @__PURE__ */ jsx("img", { alt: "", src: getAssetUrl("icons/close.svg"), ...props });
-const MenuIcon = (props) => /* @__PURE__ */ jsx("img", { alt: "", src: getAssetUrl("icons/MoreHorizontal.svg"), ...props });
-const SuccessIcon = (props) => /* @__PURE__ */ jsx("img", { alt: "", src: getAssetUrl("icons/success-gray.svg"), ...props });
-const SuccessFillIcon = (props) => /* @__PURE__ */ jsx("img", { alt: "", src: getAssetUrl("icons/success-fill.svg"), ...props });
+import { useTranslation } from "../../i18n/useTranslation.js";
 const CommentsPortal = ({
   isOpen,
   onClose,
@@ -19,7 +16,7 @@ const CommentsPortal = ({
   onAddComment,
   cellId,
   position,
-  author = "Current User",
+  author: authorProp,
   onMouseEnter,
   onMouseLeave,
   openedBy,
@@ -41,6 +38,8 @@ const CommentsPortal = ({
   messageId = null,
   configuration
 }) => {
+  const { t } = useTranslation();
+  authorProp || t("table.currentUser");
   if (!isOpen) return null;
   const [openFullReplies, setOpenFullReplies] = useState(openedBy == "click");
   const [adjustedPosition, setAdjustedPosition] = useState(position);
@@ -177,14 +176,14 @@ const CommentsPortal = ({
             },
             children: [
               openFullReplies && /* @__PURE__ */ jsx("div", { className: `comments-portal-header ${(position == null ? void 0 : position.side) == "left" ? "left" : ""}`, children: /* @__PURE__ */ jsxs("div", { className: "comments-portal-header-inner", children: [
-                /* @__PURE__ */ jsx("h3", { children: "Comments" }),
+                /* @__PURE__ */ jsx("h3", { children: t("table.comments.title") }),
                 /* @__PURE__ */ jsxs("div", { className: "comments-portal-header-buttons", children: [
                   (comments == null ? void 0 : comments.length) >= 1 && !isResolved && !((configuration == null ? void 0 : configuration.disableMarkAsRead) && (configuration == null ? void 0 : configuration.disableDeleteThread)) && /* @__PURE__ */ jsx(
                     Button,
                     {
                       className: "",
                       disabled: false,
-                      icon: /* @__PURE__ */ jsx(MenuIcon, { fontSize: "small" }),
+                      icon: /* @__PURE__ */ jsx(MoreHorizontal_default, { fontSize: "small" }),
                       iconPlacement: "left",
                       size: "small",
                       style: {
@@ -198,7 +197,7 @@ const CommentsPortal = ({
                       }
                     }
                   ),
-                  !(configuration == null ? void 0 : configuration.disableMarkAsResolved) && (isResolved ? /* @__PURE__ */ jsx(SuccessFillIcon, { fontSize: "small" }) : /* @__PURE__ */ jsx(
+                  !(configuration == null ? void 0 : configuration.disableMarkAsResolved) && (isResolved ? /* @__PURE__ */ jsx(SuccessFill_default, { fontSize: "small" }) : /* @__PURE__ */ jsx(
                     "div",
                     {
                       style: { cursor: "pointer" },
@@ -206,7 +205,7 @@ const CommentsPortal = ({
                         e.stopPropagation();
                         if (onMarkAsResolvedClick) onMarkAsResolvedClick(cellId, comments);
                       },
-                      children: /* @__PURE__ */ jsx(SuccessIcon, { fontSize: "small" })
+                      children: /* @__PURE__ */ jsx(SuccessGray_default, { fontSize: "small" })
                     }
                   )),
                   /* @__PURE__ */ jsx(
@@ -214,7 +213,7 @@ const CommentsPortal = ({
                     {
                       className: "comment-close",
                       disabled: false,
-                      icon: /* @__PURE__ */ jsx(CloseIcon, { fontSize: "large" }),
+                      icon: /* @__PURE__ */ jsx(Close_default, { fontSize: "large" }),
                       iconPlacement: "left",
                       size: "small",
                       style: {
@@ -255,7 +254,7 @@ const CommentsPortal = ({
                       /* @__PURE__ */ jsx("div", { className: "comment-item-author-name", children: comment.author }),
                       /* @__PURE__ */ jsxs("div", { className: "comment-item-timestamp", children: [
                         formatTimestamp(comment.timestamp),
-                        comment.isEdited && /* @__PURE__ */ jsx("span", { children: "(edited)" })
+                        comment.isEdited && /* @__PURE__ */ jsx("span", { children: t("table.comments.edited") })
                       ] })
                     ] }),
                     openFullReplies && isCurrentAuthor && (!(configuration == null ? void 0 : configuration.disableEditComment) || !(configuration == null ? void 0 : configuration.disableDeleteComment)) && /* @__PURE__ */ jsx(
@@ -263,7 +262,7 @@ const CommentsPortal = ({
                       {
                         className: "",
                         disabled: false,
-                        icon: /* @__PURE__ */ jsx(MenuIcon, { fontSize: "small" }),
+                        icon: /* @__PURE__ */ jsx(MoreHorizontal_default, { fontSize: "small" }),
                         iconPlacement: "left",
                         size: "small",
                         style: { backgroundColor: "transparent" },

package/dist/components/Table/NewAdvanceSearchModal/NewAdvanceSearchModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NewAdvanceSearchModal.d.ts","sourceRoot":"","sources":["../../../../src/components/Table/NewAdvanceSearchModal/NewAdvanceSearchModal.tsx"],"names":[],"mappings":"AAgBA,QAAA,MAAM,qBAAqB,GAAI;;;;;;;;;;CAU9B,4CAoRA,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"NewAdvanceSearchModal.d.ts","sourceRoot":"","sources":["../../../../src/components/Table/NewAdvanceSearchModal/NewAdvanceSearchModal.tsx"],"names":[],"mappings":"AAiBA,QAAA,MAAM,qBAAqB,GAAI;;;;;;;;;;CAU9B,4CA0RA,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/dist/components/Table/NewAdvanceSearchModal/NewAdvanceSearchModal.js

@@ -1,11 +1,12 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import React__default, { useState, useMemo, useEffect } from "react";
-import { useForm, useFieldArray } from "react-hook-form";
+import { useForm, useFieldArray, useWatch } from "react-hook-form";
 import NewAdvanceSearchModalItem from "./NewAdvanceSearchModalItem.js";
 import { convertToOptions } from "../../../utils/helper.js";
 import { Button } from "../../Button/index.js";
 import { ButtonGroup } from "../../ButtonGroup/index.js";
 import { Modal } from "../../Modal/index.js";
+import { useTranslation } from "../../../i18n/useTranslation.js";
 import AddOutlined from "../../../node_modules/@mui/icons-material/esm/AddOutlined.js";
 const filterInitialValues = {
   column: { label: "", value: "", type: "text" },
@@ -23,6 +24,7 @@ const NewAdvanceSearchModal = ({
   currentColumnId,
   ...args
 }) => {
+  const { t } = useTranslation();
   const [activeSearchType, setActiveSearchType] = useState("advanceSearch");
   const onChangeSearchType = (e, val) => {
     e.preventDefault();
@@ -39,7 +41,6 @@ const NewAdvanceSearchModal = ({
   const {
     control,
     handleSubmit,
-    watch,
     formState: { isValid: isFormValid },
     setValue,
     getValues,
@@ -50,14 +51,15 @@ const NewAdvanceSearchModal = ({
     name: "filters",
     keyName: "fieldId"
   });
-  const formValues = watch();
-  const filteredColumnsInitialOptions = useMemo(() => {
-    const selectedValues = (formValues.filters || []).map((f) => {
+  const columnOptions = useMemo(() => convertToOptions(colDefs || []), [colDefs]);
+  const watchedFilters = useWatch({ control, name: "filters" });
+  const selectedColumnValues = useMemo(
+    () => (watchedFilters || []).map((f) => {
       var _a;
       return (_a = f == null ? void 0 : f.column) == null ? void 0 : _a.value;
-    }).filter(Boolean);
-    return convertToOptions(colDefs || []).filter((opt) => !selectedValues.includes(opt.value));
-  }, [colDefs, formValues.filters]);
+    }).filter(Boolean),
+    [watchedFilters]
+  );
   const [hasInitializedWithColumnId, setHasInitializedWithColumnId] = useState(false);
   const prevIsAdvanceSearchRef = React__default.useRef(false);
   useEffect(() => {
@@ -84,8 +86,8 @@ const NewAdvanceSearchModal = ({
         }
       );
       if (!hasValidFilters) {
-        const formValues2 = getValues();
-        const existingFilters = formValues2.filters || [];
+        const formValues = getValues();
+        const existingFilters = formValues.filters || [];
         const columnExists = existingFilters.some(
           (filter) => {
             var _a2;
@@ -130,8 +132,8 @@ const NewAdvanceSearchModal = ({
     toggleAdvanceSearch();
   };
   const handleSearchApplyClick = () => {
-    const formValues2 = formMethods.getValues().filters || [];
-    const validFilters = formValues2.filter((filter) => {
+    const formValues = formMethods.getValues().filters || [];
+    const validFilters = formValues.filter((filter) => {
       var _a, _b, _c, _d, _e, _f;
       const hasColumn = ((_a = filter == null ? void 0 : filter.column) == null ? void 0 : _a.value) && ((_b = filter == null ? void 0 : filter.column) == null ? void 0 : _b.value) !== null && ((_c = filter == null ? void 0 : filter.column) == null ? void 0 : _c.value) !== "";
       if (activeSearchType === "advanceSearch") {
@@ -158,17 +160,17 @@ const NewAdvanceSearchModal = ({
       className: "ia-table-search-modal",
       height: 400,
       open: isAdvanceSearch,
-      primaryButtonLabel: "Apply",
+      primaryButtonLabel: t("common.apply"),
       primaryButtonProps: {
         type: "submit"
         // disabled: !isFormValid,
       },
-      secondaryButtonLabel: args.onSearchSaveClick ? "Save search" : null,
+      secondaryButtonLabel: args.onSearchSaveClick ? t("table.search.saveSearch") : null,
       secondaryButtonProps: {
         disabled: !isFormValid
       },
       size: "small",
-      title: "Search",
+      title: t("common.search"),
       width: 850,
       onClose: onCloseModal,
       onPrimaryButtonClick: handleSearchApplyClick,
@@ -183,11 +185,11 @@ const NewAdvanceSearchModal = ({
             {
               options: [
                 {
-                  label: "Search",
+                  label: t("common.search"),
                   value: "search"
                 },
                 {
-                  label: "Advance Search",
+                  label: t("table.search.advanceSearch"),
                   value: "advanceSearch"
                 }
               ],
@@ -210,7 +212,7 @@ const NewAdvanceSearchModal = ({
                 e.preventDefault();
                 onClearAll();
               },
-              children: "Clear all"
+              children: t("common.clearAll")
             }
           )
         ] }),
@@ -223,21 +225,22 @@ const NewAdvanceSearchModal = ({
               handleSearchApplyClick();
             },
             children: [
-              /* @__PURE__ */ jsx("div", { className: "ia-table-search-content-title", children: "Match all of the following rules" }),
+              /* @__PURE__ */ jsx("div", { className: "ia-table-search-content-title", children: t("table.search.matchAll") }),
               /* @__PURE__ */ jsx(Fragment, { children: fields.map((field, index) => /* @__PURE__ */ jsx(
                 NewAdvanceSearchModalItem,
                 {
                   activeSearchType,
                   colDefs,
+                  columnOptions,
                   control,
                   currentColumnId,
                   field,
                   fields,
-                  filteredColumnsInitialOptions,
                   getValues,
                   index,
                   isLastVisible: fields.length === 1,
-                  remove
+                  remove,
+                  selectedColumnValues
                 },
                 field.fieldId || field.id
               )) }),
@@ -249,7 +252,7 @@ const NewAdvanceSearchModal = ({
                     variant: "secondary",
                     onClick: onClearAttributeValue,
                     type: "button",
-                    children: "Clear values"
+                    children: t("table.search.clearValues")
                   }
                 ),
                 /* @__PURE__ */ jsx(
@@ -266,7 +269,7 @@ const NewAdvanceSearchModal = ({
                       });
                     },
                     variant: "tertiary",
-                    children: "Add attribute"
+                    children: t("table.search.addAttribute")
                   }
                 )
               ] })

package/dist/components/Table/NewAdvanceSearchModal/NewAdvanceSearchModalItem.d.ts

@@ -1,11 +1,12 @@
-declare const NewAdvanceSearchModalItem: ({ colDefs, control, index, field, remove, filteredColumnsInitialOptions, activeSearchType, isLastVisible, currentColumnId, getValues, fields, ...args }: {
+declare const NewAdvanceSearchModalItem: ({ colDefs, control, index, field, remove, columnOptions, selectedColumnValues, activeSearchType, isLastVisible, currentColumnId, getValues, fields, ...args }: {
     [x: string]: any;
     colDefs: any;
     control: any;
     index: any;
     field: any;
     remove: any;
-    filteredColumnsInitialOptions: any;
+    columnOptions: any;
+    selectedColumnValues: any;
     activeSearchType: any;
     isLastVisible: any;
     currentColumnId: any;

package/dist/components/Table/NewAdvanceSearchModal/NewAdvanceSearchModalItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NewAdvanceSearchModalItem.d.ts","sourceRoot":"","sources":["../../../../src/components/Table/NewAdvanceSearchModal/NewAdvanceSearchModalItem.tsx"],"names":[],"mappings":"AAsBA,QAAA,MAAM,yBAAyB,GAAI;;;;;;;;;;;;;CAalC,4CA4ZA,CAAC;AAEF,eAAe,yBAAyB,CAAC"}
+{"version":3,"file":"NewAdvanceSearchModalItem.d.ts","sourceRoot":"","sources":["../../../../src/components/Table/NewAdvanceSearchModal/NewAdvanceSearchModalItem.tsx"],"names":[],"mappings":"AAsBA,QAAA,MAAM,yBAAyB,GAAI;;;;;;;;;;;;;;CAclC,4CA4bA,CAAC;AAEF,eAAe,yBAAyB,CAAC"}