impact-ui 4.0.7 → 4.0.8

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

@@ -1 +1 @@
-{"version":3,"file":"tableFunctions.d.ts","sourceRoot":"","sources":["../../../src/components/Table/tableFunctions.tsx"],"names":[],"mappings":"AAoDA,eAAO,MAAM,oBAAoB,GAAI,WAAM,SAQ1C,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,WAAM,EAAE,aAAQ,SAK5C,CAAC;AAEF,eAAO,MAAM,wBAAwB,GAAI,WAAM,SAK9C,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,eAAU,EAAE,WAAM,EAAE,QAAG,SAM/C,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,WAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAsItC,CAAC;AA6BF,eAAO,MAAM,OAAO,mFAk6ClB,CAAC;AAEH,eAAO,MAAM,yBAAyB,GAAI,iBAAY,WAgBrD,CAAC"}
+{"version":3,"file":"tableFunctions.d.ts","sourceRoot":"","sources":["../../../src/components/Table/tableFunctions.tsx"],"names":[],"mappings":"AAoDA,eAAO,MAAM,oBAAoB,GAAI,WAAM,SAQ1C,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,WAAM,EAAE,aAAQ,SAK5C,CAAC;AAEF,eAAO,MAAM,wBAAwB,GAAI,WAAM,SAK9C,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,eAAU,EAAE,WAAM,EAAE,QAAG,SAM/C,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,WAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAsItC,CAAC;AA+DF,eAAO,MAAM,OAAO,mFAyxClB,CAAC;AAEH,eAAO,MAAM,yBAAyB,GAAI,iBAAY,WAgBrD,CAAC"}

package/dist/components/Table/tableFunctions.js

@@ -182,6 +182,34 @@ const getMainMenuItems = (params) => {
   });
   return columnMenuItems;
 };
+const filterColumnsByText = (columns, searchText) => {
+  if (!searchText) return columns;
+  return columns.map((column) => {
+    var _a;
+    const matches = (_a = column.headerName) == null ? void 0 : _a.toLowerCase().includes(searchText);
+    if (matches) {
+      return {
+        ...column,
+        isVisible: column.isVisible
+      };
+    }
+    const filteredChildren = column.children ? filterColumnsByText(column.children, searchText) : null;
+    if ((filteredChildren == null ? void 0 : filteredChildren.length) > 0) {
+      return {
+        ...column,
+        children: filteredChildren,
+        isVisible: column.isVisible
+      };
+    }
+    return null;
+  }).filter(Boolean);
+};
+const isColumnTreeVisible = (columns) => columns.some(
+  (column) => {
+    var _a;
+    return ((_a = column.children) == null ? void 0 : _a.length) > 0 ? isColumnTreeVisible(column.children) : column.isVisible;
+  }
+);
 const SortableColumnItem = ({ column, level, renderFn, dragIconClass, onToggle, ...props }) => {
   const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({
     id: column.colId
@@ -237,6 +265,7 @@ const Columns = forwardRef((props, ref) => {
   const [deleteView, setDeleteView] = useState(null);
   const [selectedView, setSelectedView] = useState(null);
   const isColumnPinnedRef = useRef(false);
+  const searchTextRef = useRef("");
   useEffect(() => {
     const views = props.savedViewsOptions ?? [];
     setSavedViewsOptions(views);
@@ -324,10 +353,11 @@ const Columns = forwardRef((props, ref) => {
       },
       { frozColumn: [], scrollColumn: [] }
     );
+    const activeSearchText = searchTextRef.current;
     setFrozenColumn(frozColumn);
-    setFilteredFrozenColumns(frozColumn);
+    setFilteredFrozenColumns(filterColumnsByText(frozColumn, activeSearchText));
     setScrollableColumn(scrollColumn);
-    setFilteredScrollableColumns(scrollColumn);
+    setFilteredScrollableColumns(filterColumnsByText(scrollColumn, activeSearchText));
   }, [getColumnDefs, ref, props.column]);
   const debouncedUpdateColumnState = useMemo(
     () => debounce(updateColumnState, 100),
@@ -376,131 +406,62 @@ const Columns = forwardRef((props, ref) => {
   }, [filteredFrozenColumns, filteredScrollableColumns]);
   const handleSearchChange = (e) => {
     const searchText2 = e.target.value.toLowerCase();
-    const filterColumns = (columns, searchText3) => {
-      return columns.map((column) => {
-        const matches = column.headerName.toLowerCase().includes(searchText3);
-        const filteredChildren = column.children ? filterColumns(column.children, searchText3) : null;
-        if (matches || (filteredChildren == null ? void 0 : filteredChildren.length) > 0) {
-          return {
-            ...column,
-            children: filteredChildren,
-            isVisible: column.isVisible
-          };
-        }
-        return null;
-      }).filter(Boolean);
-    };
-    const filteredFrozenColumns2 = filterColumns(frozenColumn, searchText2);
-    const filteredScrollableColumns2 = filterColumns(scrollableColumn, searchText2);
+    searchTextRef.current = searchText2;
     setSearchText(searchText2);
-    setFilteredFrozenColumns(filteredFrozenColumns2);
-    setFilteredScrollableColumns(filteredScrollableColumns2);
+    setFilteredFrozenColumns(filterColumnsByText(frozenColumn, searchText2));
+    setFilteredScrollableColumns(filterColumnsByText(scrollableColumn, searchText2));
   };
   useEffect(() => {
-    const isAnyScrollableColumnVisible = filteredScrollableColumns.some((column) => {
-      if (column.children) {
-        return column.children.some((child) => child.isVisible);
-      }
-      return column.isVisible;
-    });
-    const isAnyFrozenColumnVisible = filteredFrozenColumns.some((column) => {
-      if (column.children) {
-        return column.children.some((child) => child.isVisible);
-      }
-      return column.isVisible;
-    });
+    const isAnyScrollableColumnVisible = isColumnTreeVisible(filteredScrollableColumns);
+    const isAnyFrozenColumnVisible = isColumnTreeVisible(filteredFrozenColumns);
     setMainChecked(isAnyScrollableColumnVisible);
     setAllColumnvisisbility(isAnyFrozenColumnVisible || isAnyScrollableColumnVisible);
   }, [filteredFrozenColumns, filteredScrollableColumns]);
-  const toggleColumnVisibilityFrozen = (colId) => {
-    const updateChildrenVisibility = (columns, parentVisibility = null) => columns.map((column) => {
-      var _a2;
-      const updatedChildren = column.children ? updateChildrenVisibility(column.children, parentVisibility) : null;
-      (_a2 = ref == null ? void 0 : ref.current) == null ? void 0 : _a2.api.setColumnVisible(column.colId, parentVisibility);
-      return {
-        ...column,
-        isVisible: parentVisibility,
-        children: updatedChildren
-      };
-    });
-    const updateVisibility = (columns, parentVisibility = null) => columns.map((column) => {
-      var _a2, _b2;
+  const setSubtreeVisibility = (columns, visibility) => columns.map((column) => {
+    var _a2, _b2, _c2;
+    (_b2 = (_a2 = ref == null ? void 0 : ref.current) == null ? void 0 : _a2.api) == null ? void 0 : _b2.setColumnVisible(column.colId, visibility);
+    return {
+      ...column,
+      isVisible: visibility,
+      children: ((_c2 = column.children) == null ? void 0 : _c2.length) > 0 ? setSubtreeVisibility(column.children, visibility) : column.children
+    };
+  });
+  const applyVisibilityToggle = (columns, colId) => {
+    let changed = false;
+    const updated = columns.map((column) => {
+      var _a2, _b2, _c2, _d2, _e2, _f2;
+      if (changed) return column;
       if (column.colId === colId) {
-        const newVisibility = parentVisibility !== null ? parentVisibility : !column.isVisible;
-        const updatedChildren = column.children ? updateChildrenVisibility(column.children, newVisibility) : null;
-        (_a2 = ref == null ? void 0 : ref.current) == null ? void 0 : _a2.api.setColumnVisible(column.colId, newVisibility);
+        changed = true;
+        const newVisibility = !column.isVisible;
+        (_b2 = (_a2 = ref == null ? void 0 : ref.current) == null ? void 0 : _a2.api) == null ? void 0 : _b2.setColumnVisible(column.colId, newVisibility);
         return {
           ...column,
           isVisible: newVisibility,
-          children: updatedChildren
+          children: ((_c2 = column.children) == null ? void 0 : _c2.length) > 0 ? setSubtreeVisibility(column.children, newVisibility) : column.children
         };
       }
-      if (column.children) {
-        const updatedChildren = updateVisibility(column.children);
-        const isAnyChildVisible = updatedChildren.some((child) => child.isVisible);
-        (_b2 = ref == null ? void 0 : ref.current) == null ? void 0 : _b2.api.setColumnVisible(column.colId, isAnyChildVisible);
-        return {
-          ...column,
-          isVisible: isAnyChildVisible,
-          children: updatedChildren
-        };
+      if (((_d2 = column.children) == null ? void 0 : _d2.length) > 0) {
+        const result = applyVisibilityToggle(column.children, colId);
+        if (!result.changed) return column;
+        changed = true;
+        const isAnyChildVisible = isColumnTreeVisible(result.columns);
+        (_f2 = (_e2 = ref == null ? void 0 : ref.current) == null ? void 0 : _e2.api) == null ? void 0 : _f2.setColumnVisible(column.colId, isAnyChildVisible);
+        return { ...column, isVisible: isAnyChildVisible, children: result.columns };
       }
       return column;
     });
-    const updatedColumns = updateVisibility(filteredFrozenColumns);
-    setFilteredFrozenColumns(updatedColumns);
-    setFrozenColumn((prev) => {
-      const updatedMap = Object.fromEntries(updatedColumns.map((col) => [col.colId, col]));
-      const merged = prev.map((col) => updatedMap[col.colId] ? updatedMap[col.colId] : col);
-      const prevColIds = new Set(prev.map((col) => col.colId));
-      const newCols = updatedColumns.filter((col) => !prevColIds.has(col.colId));
-      return [...merged, ...newCols];
-    });
+    return { columns: updated, changed };
+  };
+  const toggleColumnVisibilityFrozen = (colId) => {
+    const { columns } = applyVisibilityToggle(frozenColumn, colId);
+    setFrozenColumn(columns);
+    setFilteredFrozenColumns(filterColumnsByText(columns, searchTextRef.current));
   };
   const toggleColumnVisibilityScroll = (colId) => {
-    const updateChildrenVisibility = (columns, parentVisibility = null) => columns.map((column) => {
-      var _a2;
-      const updatedChildren = column.children ? updateChildrenVisibility(column.children, parentVisibility) : null;
-      (_a2 = ref == null ? void 0 : ref.current) == null ? void 0 : _a2.api.setColumnVisible(column.colId, parentVisibility);
-      return {
-        ...column,
-        isVisible: parentVisibility,
-        children: updatedChildren
-      };
-    });
-    const updateVisibility = (columns, parentVisibility = null) => columns.map((column) => {
-      var _a2, _b2;
-      if (column.colId === colId) {
-        const newVisibility = parentVisibility !== null ? parentVisibility : !column.isVisible;
-        const updatedChildren = column.children ? updateChildrenVisibility(column.children, newVisibility) : null;
-        (_a2 = ref == null ? void 0 : ref.current) == null ? void 0 : _a2.api.setColumnVisible(column.colId, newVisibility);
-        return {
-          ...column,
-          isVisible: newVisibility,
-          children: updatedChildren
-        };
-      }
-      if (column.children) {
-        const updatedChildren = updateVisibility(column.children);
-        const isAnyChildVisible = updatedChildren.some((child) => child.isVisible);
-        (_b2 = ref == null ? void 0 : ref.current) == null ? void 0 : _b2.api.setColumnVisible(column.colId, isAnyChildVisible);
-        return {
-          ...column,
-          isVisible: isAnyChildVisible,
-          children: updatedChildren
-        };
-      }
-      return column;
-    });
-    const updatedColumns = updateVisibility(filteredScrollableColumns);
-    setFilteredScrollableColumns(updatedColumns);
-    setScrollableColumn((prev) => {
-      const updatedMap = Object.fromEntries(updatedColumns.map((col) => [col.colId, col]));
-      const merged = prev.map((col) => updatedMap[col.colId] ? updatedMap[col.colId] : col);
-      const prevColIds = new Set(prev.map((col) => col.colId));
-      const newCols = updatedColumns.filter((col) => !prevColIds.has(col.colId));
-      return [...merged, ...newCols];
-    });
+    const { columns } = applyVisibilityToggle(scrollableColumn, colId);
+    setScrollableColumn(columns);
+    setFilteredScrollableColumns(filterColumnsByText(columns, searchTextRef.current));
   };
   const toggleScrollableCollapse = (e) => {
     e.stopPropagation();
@@ -510,75 +471,45 @@ const Columns = forwardRef((props, ref) => {
     e.stopPropagation();
     setCollapsedcolumn(!collapsedColumn);
   };
+  const applyBulkVisibility = (columns, visibility, allowedIds) => columns.map((column) => {
+    var _a2, _b2, _c2, _d2, _e2;
+    const isAllowed = !allowedIds || allowedIds.has(column.colId);
+    if (((_a2 = column.children) == null ? void 0 : _a2.length) > 0) {
+      const children = applyBulkVisibility(
+        column.children,
+        visibility,
+        isAllowed ? null : allowedIds
+      );
+      const isAnyChildVisible = isColumnTreeVisible(children);
+      (_c2 = (_b2 = ref == null ? void 0 : ref.current) == null ? void 0 : _b2.api) == null ? void 0 : _c2.setColumnVisible(column.colId, isAnyChildVisible);
+      return { ...column, isVisible: isAnyChildVisible, children };
+    }
+    if (!isAllowed) return column;
+    (_e2 = (_d2 = ref == null ? void 0 : ref.current) == null ? void 0 : _d2.api) == null ? void 0 : _e2.setColumnVisible(column.colId, visibility);
+    return { ...column, isVisible: visibility };
+  });
   const onMainCheckboxChange = () => {
-    setMainChecked((prev) => !prev);
-    const updateVisibility = (columns, visibility) => {
-      return columns.map((column) => {
-        var _a2, _b2;
-        (_b2 = (_a2 = ref == null ? void 0 : ref.current) == null ? void 0 : _a2.api) == null ? void 0 : _b2.setColumnVisible(column.colId, visibility);
-        if (column.children) {
-          updateVisibility(column.children, visibility);
-        }
-        return {
-          ...column,
-          isVisible: visibility,
-          children: column.children ? updateVisibility(column.children, visibility) : null
-        };
-      });
-    };
-    const updatedColumns = updateVisibility(filteredScrollableColumns, !mainChecked);
-    setFilteredScrollableColumns(updatedColumns);
-    setScrollableColumn((prev) => {
-      const updatedMap = Object.fromEntries(updatedColumns.map((col) => [col.colId, col]));
-      const merged = prev.map((col) => updatedMap[col.colId] ? updatedMap[col.colId] : col);
-      const prevColIds = new Set(prev.map((col) => col.colId));
-      const newCols = updatedColumns.filter((col) => !prevColIds.has(col.colId));
-      return [...merged, ...newCols];
-    });
+    const listedIds = new Set(getAllColumnIds(filteredScrollableColumns));
+    const updatedColumns = applyBulkVisibility(scrollableColumn, !mainChecked, listedIds);
+    setScrollableColumn(updatedColumns);
+    setFilteredScrollableColumns(filterColumnsByText(updatedColumns, searchTextRef.current));
   };
   const onAllColumnCheckBoxChange = () => {
-    setAllColumnvisisbility((prev) => !prev);
-    setMainChecked(!allColumnVisibility);
-    const updateColumnVisibility = (columns, visibility) => {
-      return columns.map((column) => {
-        var _a2, _b2;
-        (_b2 = (_a2 = ref == null ? void 0 : ref.current) == null ? void 0 : _a2.api) == null ? void 0 : _b2.setColumnVisible(column.colId, visibility);
-        if (column.children) {
-          updateColumnVisibility(column.children, visibility);
-        }
-        return {
-          ...column,
-          isVisible: visibility,
-          children: column.children ? updateColumnVisibility(column.children, visibility) : null
-        };
-      });
-    };
-    const updatedFrozenColumns = updateColumnVisibility(
-      filteredFrozenColumns,
-      !allColumnVisibility
+    const visibility = !allColumnVisibility;
+    const listedFrozenIds = new Set(getAllColumnIds(filteredFrozenColumns));
+    const listedScrollableIds = new Set(getAllColumnIds(filteredScrollableColumns));
+    const updatedFrozenColumns = applyBulkVisibility(frozenColumn, visibility, listedFrozenIds);
+    const updatedScrollableColumns = applyBulkVisibility(
+      scrollableColumn,
+      visibility,
+      listedScrollableIds
     );
-    const updatedScrollableColumns = updateColumnVisibility(
-      filteredScrollableColumns,
-      !allColumnVisibility
+    setFrozenColumn(updatedFrozenColumns);
+    setScrollableColumn(updatedScrollableColumns);
+    setFilteredFrozenColumns(filterColumnsByText(updatedFrozenColumns, searchTextRef.current));
+    setFilteredScrollableColumns(
+      filterColumnsByText(updatedScrollableColumns, searchTextRef.current)
     );
-    setFilteredFrozenColumns(updatedFrozenColumns);
-    setFilteredScrollableColumns(updatedScrollableColumns);
-    setFrozenColumn((prev) => {
-      const updatedMap = Object.fromEntries(updatedFrozenColumns.map((col) => [col.colId, col]));
-      const merged = prev.map((col) => updatedMap[col.colId] ? updatedMap[col.colId] : col);
-      const prevColIds = new Set(prev.map((col) => col.colId));
-      const newCols = updatedFrozenColumns.filter((col) => !prevColIds.has(col.colId));
-      return [...merged, ...newCols];
-    });
-    setScrollableColumn((prev) => {
-      const updatedMap = Object.fromEntries(
-        updatedScrollableColumns.map((col) => [col.colId, col])
-      );
-      const merged = prev.map((col) => updatedMap[col.colId] ? updatedMap[col.colId] : col);
-      const prevColIds = new Set(prev.map((col) => col.colId));
-      const newCols = updatedScrollableColumns.filter((col) => !prevColIds.has(col.colId));
-      return [...merged, ...newCols];
-    });
   };
   const toggleScrollColumnCollapse = (colId) => {
     setCollapsedScrollColumns((prev) => ({
@@ -1299,17 +1230,27 @@ const Columns = forwardRef((props, ref) => {
       }
     ),
     /* @__PURE__ */ jsxs("div", { className: "table-setting-column-search-container", children: [
-      /* @__PURE__ */ jsx(IconButton, { style: { padding: "5px" }, onClick: toggleColumnCollapse, children: collapsedColumn ? /* @__PURE__ */ jsx(default_1$3, {}) : /* @__PURE__ */ jsx(default_1, {}) }),
-      /* @__PURE__ */ jsx(Checkbox, { checked: allColumnVisibility, onChange: onAllColumnCheckBoxChange }),
-      /* @__PURE__ */ jsx(
-        Input,
+      /* @__PURE__ */ jsx("span", { className: "table-setting-column-collapse-slot", children: /* @__PURE__ */ jsx(
+        IconButton,
         {
-          placeholder: t("common.search"),
-          rightIcon: /* @__PURE__ */ jsx(default_1$2, {}),
-          value: searchText,
-          onChange: handleSearchChange
+          "aria-label": collapsedColumn ? "Expand columns" : "Collapse columns",
+          className: "table-setting-column-collapse-btn",
+          onClick: toggleColumnCollapse,
+          children: collapsedColumn ? /* @__PURE__ */ jsx(default_1$3, {}) : /* @__PURE__ */ jsx(default_1, {})
         }
-      )
+      ) }),
+      /* @__PURE__ */ jsxs("div", { className: "table-setting-column-search-controls", children: [
+        /* @__PURE__ */ jsx(Checkbox, { checked: allColumnVisibility, onChange: onAllColumnCheckBoxChange }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            placeholder: t("common.search"),
+            rightIcon: /* @__PURE__ */ jsx(default_1$2, {}),
+            value: searchText,
+            onChange: handleSearchChange
+          }
+        )
+      ] })
     ] }),
     !collapsedColumn && /* @__PURE__ */ jsx(
       "div",