@megha-ui/react 1.3.8 → 1.3.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1527,7 +1527,7 @@ withCard = false, cardClassName, cardHeader, title, headerLeft, headerRight, sub
1527
1527
  border: gridBorder ? "1px solid #f0f0f0" : "none",
1528
1528
  overflow: calculateVisible && gridGroupBy ? "visible" : "auto",
1529
1529
  position: "relative",
1530
- }, children: [_jsx(NewGridHeader, { columns: gridColumns, headerRef: headerRef, resizable: resizable, sortable: sortable, search: search, combinedColumns: combinedColumns, defaultSearchOperation: defaultSearchOperation, showMenu: showMenu, sortQueries: sortQueries, onSort: handleSort, bulkSelect: bulkSelect, cellStyle: cellStyle, widthMode: widthMode, allRowsSelected: allRowsSelected, someRowsSelected: someRowsSelected, toggleSelectAll: () => toggleSelectAll(paginate ? paginatedData : sortedData, allRowsSelected), onSearch: handleSearch, searchQueries: searchQueries, headerBackground: headerBackground, headerTopBorder: headerTopBorder, headerBottomBorder: headerBottomBorder, groupBy: gridGroupBy, setGroupBy: (value) => {
1530
+ }, children: [_jsx(NewGridHeader, { columns: gridColumns, headerRef: headerRef, portalTarget: isFullScreen ? entrieGridRef.current : null, resizable: resizable, sortable: sortable, search: search, combinedColumns: combinedColumns, defaultSearchOperation: defaultSearchOperation, showMenu: showMenu, sortQueries: sortQueries, onSort: handleSort, bulkSelect: bulkSelect, cellStyle: cellStyle, widthMode: widthMode, allRowsSelected: allRowsSelected, someRowsSelected: someRowsSelected, toggleSelectAll: () => toggleSelectAll(paginate ? paginatedData : sortedData, allRowsSelected), onSearch: handleSearch, searchQueries: searchQueries, headerBackground: headerBackground, headerTopBorder: headerTopBorder, headerBottomBorder: headerBottomBorder, groupBy: gridGroupBy, setGroupBy: (value) => {
1531
1531
  let _gridGroupBy = gridGroupBy;
1532
1532
  _gridGroupBy = _gridGroupBy.split(",").includes(value)
1533
1533
  ? _gridGroupBy
@@ -32,6 +32,7 @@ interface GridFilterDropdownProps {
32
32
  columnType: string;
33
33
  locale?: string;
34
34
  formatOptions?: any;
35
+ portalTarget?: HTMLElement | null;
35
36
  }
36
37
  declare const GridFilterDropdown: React.FC<GridFilterDropdownProps>;
37
38
  export default GridFilterDropdown;
@@ -6,7 +6,7 @@ import TextFilterDropdown from "./textFilterDropdown";
6
6
  import TextInput from "../../text-input";
7
7
  import Checkbox from "../../checkbox";
8
8
  import { formatValue } from "../../../services/commonService";
9
- const GridFilterDropdown = ({ headerDropdownIndex, searchOptions, position, columnKey, searchElement, activeSearchType, textFilterLabel, columnData, checkboxWrapper, onFilter, setUniqueSearch, uniqueSearch, sortingOps, searchable, searchInput, columnIndex, columnType, locale, formatOptions, }) => {
9
+ const GridFilterDropdown = ({ headerDropdownIndex, searchOptions, position, columnKey, searchElement, activeSearchType, textFilterLabel, columnData, checkboxWrapper, onFilter, setUniqueSearch, uniqueSearch, sortingOps, searchable, searchInput, columnIndex, columnType, locale, formatOptions, portalTarget, }) => {
10
10
  var _a, _b, _c, _d;
11
11
  const [isOpen, setIsOpen] = useState(false);
12
12
  const [filterColumnData, setFilterColumnData] = useState([]);
@@ -97,6 +97,6 @@ const GridFilterDropdown = ({ headerDropdownIndex, searchOptions, position, colu
97
97
  : { top: 0, left: 0 }, columnKey: columnKey, searchElement: searchElement, activeSearchType: activeSearchType, searchable: searchable }))] }));
98
98
  // Render in a portal so the dropdown is not occluded
99
99
  // by sticky header cells or other stacking contexts.
100
- return ReactDOM.createPortal(dropdownContent, document.body);
100
+ return ReactDOM.createPortal(dropdownContent, portalTarget || document.body);
101
101
  };
102
102
  export default GridFilterDropdown;
@@ -61,6 +61,7 @@ interface GridHeaderProps {
61
61
  columns: string[];
62
62
  sortOn: string[];
63
63
  }[];
64
+ portalTarget?: HTMLElement | null;
64
65
  }
65
66
  export declare const getColumnData: (columnKey: string, gridData: DataRow[], type: string, combinedColumns: {
66
67
  name: string;
@@ -68,7 +68,7 @@ export const getColumnData = (columnKey, gridData, type, combinedColumns) => {
68
68
  return 0;
69
69
  });
70
70
  };
71
- const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resizable = false, defaultSearchOperation, sortQueries, onSort, bulkSelect, allRowsSelected, someRowsSelected, toggleSelectAll, cellStyle, widthMode, rowHeight, headerRef, showMenu, headerBackground, headerTopBorder, headerBottomBorder, groupBy, setGroupBy, updateGridColumns, setGridColumns, headerDropdownIndex, widthUnits, textFilterLabel = "Text Filter", gridData, checkboxWrapper, onFilter, setUniqueSearch, uniqueSearch, hugColumnWidths, menuVisible, setMenuVisible, dropdownVisible, setDropdownVisible, actionsKey = "actions", columnSearchOutside, locale, formatOptions, combinedColumns, }) => {
71
+ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resizable = false, defaultSearchOperation, sortQueries, onSort, bulkSelect, allRowsSelected, someRowsSelected, toggleSelectAll, cellStyle, widthMode, rowHeight, headerRef, showMenu, headerBackground, headerTopBorder, headerBottomBorder, groupBy, setGroupBy, updateGridColumns, setGridColumns, headerDropdownIndex, widthUnits, textFilterLabel = "Text Filter", gridData, checkboxWrapper, onFilter, setUniqueSearch, uniqueSearch, hugColumnWidths, menuVisible, setMenuVisible, dropdownVisible, setDropdownVisible, actionsKey = "actions", columnSearchOutside, locale, formatOptions, combinedColumns, portalTarget, }) => {
72
72
  const [menuPosition, setMenuPosition] = useState(null);
73
73
  const [searchOpsPosition, setSearchOpsPosition] = useState(null);
74
74
  const [headerColumns, setHeaderColumns] = useState([]);
@@ -299,7 +299,7 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
299
299
  : "var(--row-header-text)",
300
300
  } }), dropdownVisible ===
301
301
  ((_m = headerColumns.find((column) => column.key === _groupBy)) === null || _m === void 0 ? void 0 : _m.key) &&
302
- (((_o = headerColumns.find((column) => column.key === _groupBy)) === null || _o === void 0 ? void 0 : _o.uniqueDrop) ? (_jsx(GridFilterDropdown, { locale: locale, formatOptions: formatOptions, columnType: (_q = (_p = headerColumns.find((column) => column.key === _groupBy)) === null || _p === void 0 ? void 0 : _p.dataType) !== null && _q !== void 0 ? _q : "string", columnIndex: -1, searchable: ((_r = headerColumns.find((column) => column.key === _groupBy)) === null || _r === void 0 ? void 0 : _r.search) || false, headerDropdownIndex: headerDropdownIndex, searchInput: (search &&
302
+ (((_o = headerColumns.find((column) => column.key === _groupBy)) === null || _o === void 0 ? void 0 : _o.uniqueDrop) ? (_jsx(GridFilterDropdown, { portalTarget: portalTarget, locale: locale, formatOptions: formatOptions, columnType: (_q = (_p = headerColumns.find((column) => column.key === _groupBy)) === null || _p === void 0 ? void 0 : _p.dataType) !== null && _q !== void 0 ? _q : "string", columnIndex: -1, searchable: ((_r = headerColumns.find((column) => column.key === _groupBy)) === null || _r === void 0 ? void 0 : _r.search) || false, headerDropdownIndex: headerDropdownIndex, searchInput: (search &&
303
303
  ((_s = headerColumns.find((column) => column.key === _groupBy)) === null || _s === void 0 ? void 0 : _s.search) && (_jsx("div", { style: {
304
304
  marginTop: "0.5rem",
305
305
  padding: "0.5rem",
@@ -563,7 +563,7 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
563
563
  ? "#2377ba"
564
564
  : "var(--row-header-text)",
565
565
  } }), dropdownVisible === column.key &&
566
- (column.uniqueDrop ? (_jsx(GridFilterDropdown, { locale: locale, formatOptions: formatOptions, columnType: (_b = column.dataType) !== null && _b !== void 0 ? _b : "string", columnIndex: colIndex, searchable: (column === null || column === void 0 ? void 0 : column.search) || false, headerDropdownIndex: headerDropdownIndex, searchOptions: searchOptions.filter((item) => column.dataType === "number" ||
566
+ (column.uniqueDrop ? (_jsx(GridFilterDropdown, { portalTarget: portalTarget, locale: locale, formatOptions: formatOptions, columnType: (_b = column.dataType) !== null && _b !== void 0 ? _b : "string", columnIndex: colIndex, searchable: (column === null || column === void 0 ? void 0 : column.search) || false, headerDropdownIndex: headerDropdownIndex, searchOptions: searchOptions.filter((item) => column.dataType === "number" ||
567
567
  column.dataType === "currency"
568
568
  ? numberTypeSearch.includes(item.value)
569
569
  : column.dataType === "date"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megha-ui/react",
3
- "version": "1.3.8",
3
+ "version": "1.3.10",
4
4
  "description": "A collection of reusable UI components for React applications, built with TypeScript.",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",