@megha-ui/react 1.3.78 → 1.3.80

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.
@@ -98,6 +98,9 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
98
98
  setDropdownVisible("");
99
99
  setMenuPosition(null);
100
100
  setSearchOpsPosition(null);
101
+ if (!target.closest(".column-search-outside-wrapper")) {
102
+ setActiveSearchColumn(null);
103
+ }
101
104
  };
102
105
  document.addEventListener("click", closeMenu);
103
106
  return () => {
@@ -558,7 +561,7 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
558
561
  ? "var(--background)"
559
562
  : "var(--disabled-bg)",
560
563
  }, value: ((_48 = searchQueries[((_47 = headerColumns.find((column) => column.key === _groupBy)) === null || _47 === void 0 ? void 0 : _47.key) || ""]) === null || _48 === void 0 ? void 0 : _48.text) || "", disabled: !((_49 = headerColumns.find((column) => column.key === _groupBy)) === null || _49 === void 0 ? void 0 : _49.search), height: 32, extraInputStyle: { minWidth: 10 }, className: "w-full", backgroundColor: "#fff" }) }))) ||
561
- null })))] })) })] }), search && columnSearchOutside && (_jsxs("div", { style: { position: "relative" }, children: [_jsx("div", { style: {
564
+ null })))] })) })] }), search && columnSearchOutside && (_jsxs("div", { style: { position: "relative" }, className: "column-search-outside-wrapper", children: [_jsx("div", { style: {
562
565
  marginTop: "0.5rem",
563
566
  pointerEvents: search &&
564
567
  ((_50 = headerColumns.find((column) => column.key === _groupBy)) === null || _50 === void 0 ? void 0 : _50.search)
@@ -630,9 +633,13 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
630
633
  left: 0,
631
634
  background: "var(--card-bg)",
632
635
  width: "max-content",
636
+ maxWidth: "24rem",
633
637
  maxHeight: activeSearchMaxHeight !== null && activeSearchMaxHeight !== void 0 ? activeSearchMaxHeight : 300,
634
638
  overflow: "auto",
635
639
  padding: "0.5rem 0.75rem",
640
+ borderRadius: "0.5rem",
641
+ boxShadow: "0 0.5rem 1rem rgba(0,0,0,0.15)",
642
+ border: "1px solid var(--divider, #f5f5f5)",
636
643
  }, children: getColumnData(((_65 = headerColumns.find((column) => column.key === _groupBy)) === null || _65 === void 0 ? void 0 : _65.key) || "", gridData, (_67 = (_66 = headerColumns.find((column) => column.key === _groupBy)) === null || _66 === void 0 ? void 0 : _66.dataType) !== null && _67 !== void 0 ? _67 : "string", combinedColumns !== null && combinedColumns !== void 0 ? combinedColumns : []).length > 0 && (_jsxs(_Fragment, { children: [_jsxs("div", { style: {
637
644
  cursor: "pointer",
638
645
  display: "flex",
@@ -670,6 +677,17 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
670
677
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
671
678
  if (!column.hidden) {
672
679
  const columnData = getColumnData(column.key, gridData, (_a = column.dataType) !== null && _a !== void 0 ? _a : "string", combinedColumns !== null && combinedColumns !== void 0 ? combinedColumns : []);
680
+ const colSearchOptions = searchOptions.filter((item) => (column === null || column === void 0 ? void 0 : column.dataType) === "number" || (column === null || column === void 0 ? void 0 : column.dataType) === "currency"
681
+ ? numberTypeSearch.includes(item.value)
682
+ : (column === null || column === void 0 ? void 0 : column.dataType) === "date"
683
+ ? dateTypeSearch.includes(item.value)
684
+ : textTypeSearch.includes(item.value));
685
+ console.log(colSearchOptions.find((item) => {
686
+ var _a, _b;
687
+ return item.value === ((_b = searchQueries[(_a = column === null || column === void 0 ? void 0 : column.key) !== null && _a !== void 0 ? _a : ""]) === null || _b === void 0 ? void 0 : _b.type) ||
688
+ defaultSearchOperation ||
689
+ "contains";
690
+ }));
673
691
  return (_jsx("div", { className: `${sortable && column.sortable ? "sortable" : ""} ${column.showMenu ? "menu-true" : "menu-false"} column index-${column.key}`, style: Object.assign(Object.assign({}, cellStyle), { padding: "0.5rem", textAlign: "left", whiteSpace: "nowrap", textOverflow: "ellipsis", wordBreak: widthMode === "auto" ? "break-all" : "unset", backgroundColor: "var(--row-header-bg)", borderTop: headerTopBorder, borderBottom: headerBottomBorder, flex: widthMode === "auto" ? 1 : undefined, flexGrow: widthMode === "auto" ? 1 : 0, flexShrink: widthMode === "auto" ? 1 : 0, position: "sticky", top: 0, zIndex: 1 }), onMouseMove: (e) => handleMouseMove(e), onMouseUp: handleMouseUp, onMouseLeave: handleMouseUp, children: !actionsKey.split(",").includes(column.key) && (_jsxs(_Fragment, { children: [resizable && (_jsx("div", { style: {
674
692
  position: "absolute",
675
693
  width: "1px",
@@ -888,7 +906,7 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
888
906
  : "var(--disabled-bg)",
889
907
  }, value: ((_t = searchQueries[column.key]) === null || _t === void 0 ? void 0 : _t.text) ||
890
908
  "", disabled: !column.search, height: 32, extraInputStyle: { minWidth: 10 }, className: "w-full", backgroundColor: "var(--background)" }) }))) ||
891
- null })))] })) })] }), search && columnSearchOutside && (_jsxs("div", { style: { position: "relative" }, children: [_jsx("div", { style: {
909
+ null })))] })) })] }), search && columnSearchOutside && (_jsxs("div", { style: { position: "relative" }, className: "column-search-outside-wrapper", children: [_jsx("div", { style: {
892
910
  marginTop: "0.5rem",
893
911
  pointerEvents: search && column.search ? "auto" : "none",
894
912
  cursor: search && column.search
@@ -926,14 +944,7 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
926
944
  var _a;
927
945
  const value = ((_a = selected[0]) === null || _a === void 0 ? void 0 : _a.toString()) || "";
928
946
  handleSearchOptionSelect(column.key, value);
929
- }, selectedDisplay: (_x = (_w = searchOptions
930
- .filter((item) => (column === null || column === void 0 ? void 0 : column.dataType) === "number" ||
931
- (column === null || column === void 0 ? void 0 : column.dataType) === "currency"
932
- ? numberTypeSearch.includes(item.value)
933
- : (column === null || column === void 0 ? void 0 : column.dataType) === "date"
934
- ? dateTypeSearch.includes(item.value)
935
- : textTypeSearch.includes(item.value))
936
- .find((item) => {
947
+ }, selectedDisplay: (_x = (_w = colSearchOptions.find((item) => {
937
948
  var _a, _b;
938
949
  return item.value ===
939
950
  ((_b = searchQueries[(_a = column === null || column === void 0 ? void 0 : column.key) !== null && _a !== void 0 ? _a : ""]) === null || _b === void 0 ? void 0 : _b.type) ||
@@ -946,9 +957,13 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
946
957
  left: 0,
947
958
  background: "var(--card-bg)",
948
959
  width: "max-content",
960
+ maxWidth: "24rem",
949
961
  maxHeight: activeSearchMaxHeight !== null && activeSearchMaxHeight !== void 0 ? activeSearchMaxHeight : 300,
950
962
  overflow: "auto",
951
963
  padding: "0.5rem 0.75rem",
964
+ borderRadius: "0.5rem",
965
+ boxShadow: "0 0.5rem 1rem rgba(0,0,0,0.15)",
966
+ border: "1px solid var(--divider, #f5f5f5)",
952
967
  }, children: [_jsxs("div", { style: {
953
968
  cursor: "pointer",
954
969
  display: "flex",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megha-ui/react",
3
- "version": "1.3.78",
3
+ "version": "1.3.80",
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",