@megha-ui/react 1.2.56 → 1.2.58

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.
Files changed (5) hide show
  1. package/dist/components/grid/utils/gridFilterDropdown.js +11 -7
  2. package/dist/components/grid/utils/gridHeader.js +2 -2
  3. package/dist/components/grid/utils/textFilterDropdown.d.ts +1 -0
  4. package/dist/components/grid/utils/textFilterDropdown.js +8 -14
  5. package/package.json +1 -1
package/dist/components/grid/utils/gridFilterDropdown.js CHANGED
@@ -29,7 +29,8 @@ const GridFilterDropdown = ({ headerDropdownIndex, searchOptions, position, colu
29
29
  if (typeof uniqueSearch[columnKey] === "undefined") {
30
30
  setUniqueSearch((prev) => (Object.assign(Object.assign({}, prev), { [columnKey]: columnData })));
31
31
  }
32
- setFilterColumnData(columnData.filter((item) => typeof item !== "undefined" && item !== "" &&
32
+ setFilterColumnData(columnData.filter((item) => typeof item !== "undefined" &&
33
+ item !== "" &&
33
34
  `${item}`.toLowerCase().includes(filterSearch.toLowerCase())));
34
35
  }, [columnData, filterSearch]);
35
36
  const handleSelect = (value, columnKey) => {
@@ -60,7 +61,7 @@ const GridFilterDropdown = ({ headerDropdownIndex, searchOptions, position, colu
60
61
  display: "flex",
61
62
  alignItems: "center",
62
63
  justifyContent: "space-between",
63
- }, onClick: () => setIsOpen((prev) => !prev), children: [(0, jsx_runtime_1.jsx)("span", { children: textFilterLabel }), (0, jsx_runtime_1.jsx)(fi_1.FiChevronRight, {})] }), (0, jsx_runtime_1.jsxs)("div", { style: {
64
+ }, onClick: () => setIsOpen((prev) => !prev), children: [(0, jsx_runtime_1.jsx)("span", { children: textFilterLabel }), (0, jsx_runtime_1.jsx)(fi_1.FiChevronRight, {})] }), columnData.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { style: {
64
65
  width: "100%",
65
66
  maxHeight: 300,
66
67
  overflow: "auto",
@@ -69,9 +70,10 @@ const GridFilterDropdown = ({ headerDropdownIndex, searchOptions, position, colu
69
70
  cursor: "pointer",
70
71
  display: "flex",
71
72
  alignItems: "center",
72
- }, onClick: () => handleSelect("all", columnKey), children: [(0, jsx_runtime_1.jsx)(checkbox_1.default, { selected: typeof (uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) === "undefined" || ((uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) &&
73
- ((_a = uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) === null || _a === void 0 ? void 0 : _a.sort().toString()) ===
74
- columnData.toString()), indeterminate: (uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) &&
73
+ }, onClick: () => handleSelect("all", columnKey), children: [(0, jsx_runtime_1.jsx)(checkbox_1.default, { selected: typeof (uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) === "undefined" ||
74
+ ((uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) &&
75
+ ((_a = uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) === null || _a === void 0 ? void 0 : _a.sort().toString()) ===
76
+ columnData.toString()), indeterminate: (uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) &&
75
77
  ((_b = uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) === null || _b === void 0 ? void 0 : _b.length) > 0 &&
76
78
  ((_c = uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) === null || _c === void 0 ? void 0 : _c.sort().toString()) !==
77
79
  columnData.toString(), onChange: () => { }, style: { pointerEvents: "none" }, noLabel: true, wrapperClass: checkboxWrapper }), (0, jsx_runtime_1.jsx)("span", { style: { marginLeft: "0.5rem" }, children: "All" })] }), filterColumnData.map((item) => {
@@ -80,8 +82,10 @@ const GridFilterDropdown = ({ headerDropdownIndex, searchOptions, position, colu
80
82
  cursor: "pointer",
81
83
  display: "flex",
82
84
  alignItems: "center",
83
- }, onClick: () => handleSelect(item, columnKey), children: [(0, jsx_runtime_1.jsx)(checkbox_1.default, { selected: (uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) ? (_a = uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) === null || _a === void 0 ? void 0 : _a.includes(item) : true, onChange: () => { }, style: { pointerEvents: "none" }, noLabel: true, wrapperClass: checkboxWrapper }), (0, jsx_runtime_1.jsx)("span", { style: { marginLeft: "0.5rem" }, children: item })] }, item));
84
- })] }))] }), isOpen && ((0, jsx_runtime_1.jsx)(textFilterDropdown_1.default, { columnIndex: columnIndex, headerDropdownIndex: headerDropdownIndex || 1001, searchOptions: searchOptions, position: position
85
+ }, onClick: () => handleSelect(item, columnKey), children: [(0, jsx_runtime_1.jsx)(checkbox_1.default, { selected: (uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey])
86
+ ? (_a = uniqueSearch === null || uniqueSearch === void 0 ? void 0 : uniqueSearch[columnKey]) === null || _a === void 0 ? void 0 : _a.includes(item)
87
+ : true, onChange: () => { }, style: { pointerEvents: "none" }, noLabel: true, wrapperClass: checkboxWrapper }), (0, jsx_runtime_1.jsx)("span", { style: { marginLeft: "0.5rem" }, children: item })] }, item));
88
+ })] }))] })), isOpen && ((0, jsx_runtime_1.jsx)(textFilterDropdown_1.default, { combined: true, columnIndex: columnIndex, headerDropdownIndex: headerDropdownIndex || 1001, searchOptions: searchOptions, position: position
85
89
  ? {
86
90
  top: position.top,
87
91
  left: ((_d = headerDropdown === null || headerDropdown === void 0 ? void 0 : headerDropdown.current) === null || _d === void 0 ? void 0 : _d.clientWidth)
package/dist/components/grid/utils/gridHeader.js CHANGED
@@ -411,7 +411,7 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
411
411
  : "hidden",
412
412
  }, height: 32, width: "100%", className: "w-full", backgroundColor: "#fff" })) }), onFilter: onFilter, setUniqueSearch: setUniqueSearch, uniqueSearch: uniqueSearch, textFilterLabel: textFilterLabel, activeSearchType: ((_20 = searchQueries[((_19 = headerColumns.find((column) => column.key === _groupBy)) === null || _19 === void 0 ? void 0 : _19.key) || ""]) === null || _20 === void 0 ? void 0 : _20.type) ||
413
413
  defaultSearchOperation ||
414
- "contains", checkboxWrapper: checkboxWrapper })) : ((0, jsx_runtime_1.jsx)(textFilterDropdown_1.default, { columnIndex: -1, headerDropdownIndex: headerDropdownIndex, sortingOps: (0, jsx_runtime_1.jsx)(gridHeaderDropdown_1.default, { options: menuOptions.filter((item) => item.label !== "Group by"), onClose: () => setDropdownVisible(null), column: headerColumns.find((column) => column.key === _groupBy) }), searchOptions: searchOptions.filter((item) => {
414
+ "contains", checkboxWrapper: checkboxWrapper })) : ((0, jsx_runtime_1.jsx)(textFilterDropdown_1.default, { columnIndex: -1, combined: false, headerDropdownIndex: headerDropdownIndex, sortingOps: (0, jsx_runtime_1.jsx)(gridHeaderDropdown_1.default, { options: menuOptions.filter((item) => item.label !== "Group by"), onClose: () => setDropdownVisible(null), column: headerColumns.find((column) => column.key === _groupBy) }), searchOptions: searchOptions.filter((item) => {
415
415
  var _a, _b;
416
416
  return ((_a = headerColumns.find((column) => column.key === _groupBy)) === null || _a === void 0 ? void 0 : _a.dataType) === "number"
417
417
  ? numberTypeSearch.includes(item.value)
@@ -679,7 +679,7 @@ const GridHeader = ({ columns, onSearch, searchQueries, sortable, search, resiza
679
679
  ? "var(--background)"
680
680
  : "var(--disabled-bg)",
681
681
  }, placeholder: "Search", value: ((_h = searchQueries[column.key]) === null || _h === void 0 ? void 0 : _h.text) ||
682
- "", disabled: !column.search, height: 32, extraInputStyle: { minWidth: 10 }, className: "w-full", backgroundColor: "#fff" }) })) })) : ((0, jsx_runtime_1.jsx)(textFilterDropdown_1.default, { columnIndex: colIndex, searchable: (column === null || column === void 0 ? void 0 : column.search) || false, sortingOps: (0, jsx_runtime_1.jsx)(gridHeaderDropdown_1.default, { options: menuOptions, onClose: () => setDropdownVisible(null), column: column }), headerDropdownIndex: headerDropdownIndex, searchOptions: searchOptions.filter((item) => column.dataType === "number"
682
+ "", disabled: !column.search, height: 32, extraInputStyle: { minWidth: 10 }, className: "w-full", backgroundColor: "#fff" }) })) })) : ((0, jsx_runtime_1.jsx)(textFilterDropdown_1.default, { combined: false, columnIndex: colIndex, searchable: (column === null || column === void 0 ? void 0 : column.search) || false, sortingOps: (0, jsx_runtime_1.jsx)(gridHeaderDropdown_1.default, { options: menuOptions, onClose: () => setDropdownVisible(null), column: column }), headerDropdownIndex: headerDropdownIndex, searchOptions: searchOptions.filter((item) => column.dataType === "number"
683
683
  ? numberTypeSearch.includes(item.value)
684
684
  : column.dataType === "date"
685
685
  ? dateTypeSearch.includes(item.value)
package/dist/components/grid/utils/textFilterDropdown.d.ts CHANGED
@@ -11,6 +11,7 @@ interface MenuPosition {
11
11
  interface GridFilterDropdownProps {
12
12
  searchOptions: DropdownOption[];
13
13
  position: MenuPosition;
14
+ combined: boolean;
14
15
  columnKey: string;
15
16
  activeSearchType: string;
16
17
  searchElement: any;
package/dist/components/grid/utils/textFilterDropdown.js CHANGED
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
6
6
  const jsx_runtime_1 = require("react/jsx-runtime");
7
7
  const react_1 = require("react");
8
8
  const dropdown_1 = __importDefault(require("../../dropdown"));
9
- const TextFilterDropdown = ({ headerDropdownIndex, searchOptions, position, columnKey, searchElement, activeSearchType, sortingOps, searchable, searchInput, }) => {
9
+ const TextFilterDropdown = ({ headerDropdownIndex, searchOptions, combined, position, columnKey, searchElement, activeSearchType, sortingOps, searchable, searchInput, columnIndex, }) => {
10
10
  (0, react_1.useEffect)(() => {
11
11
  var _a;
12
12
  if (searchElement) {
@@ -21,19 +21,13 @@ const TextFilterDropdown = ({ headerDropdownIndex, searchOptions, position, colu
21
21
  const clickedOption = searchOptions.find((item) => selected === item.value);
22
22
  clickedOption === null || clickedOption === void 0 ? void 0 : clickedOption.action(columnKey, selected);
23
23
  };
24
- return ((0, jsx_runtime_1.jsxs)("div", { style: {
25
- position: "absolute",
26
- top: 0,
27
- left: "100%",
28
- zIndex: headerDropdownIndex ? headerDropdownIndex : 1000,
29
- backgroundColor: "white",
30
- boxShadow: "0px 0.5rem 1rem 0px rgba(0,0,0,0.2)",
31
- listStyleType: "none",
32
- padding: "0.25rem 0",
33
- width: 230,
34
- borderRadius: "0.5rem",
35
- margin: 0,
36
- }, id: "grid-dropdown", onClick: (e) => e.stopPropagation(), children: [searchInput && searchInput, sortingOps && sortingOps, (0, jsx_runtime_1.jsx)("div", { style: {
24
+ return ((0, jsx_runtime_1.jsxs)("div", { style: Object.assign(Object.assign({ position: "absolute", top: combined ? 0 : "calc(100% + 5px)" }, (combined
25
+ ? {
26
+ left: "100%",
27
+ }
28
+ : columnIndex > 1
29
+ ? { right: 0 }
30
+ : { left: 0 })), { zIndex: headerDropdownIndex ? headerDropdownIndex : 1000, backgroundColor: "white", boxShadow: "0px 0.5rem 1rem 0px rgba(0,0,0,0.2)", listStyleType: "none", padding: "0.25rem 0", width: 230, borderRadius: "0.5rem", margin: 0 }), id: "grid-dropdown", onClick: (e) => e.stopPropagation(), children: [searchInput && searchInput, sortingOps && sortingOps, (0, jsx_runtime_1.jsx)("div", { style: {
37
31
  padding: "0.5rem 0.75rem",
38
32
  }, children: (0, jsx_runtime_1.jsx)(dropdown_1.default, { options: searchOptions, selectedValues: [activeSearchType], onChange: (selected) => handleDropdownChange(selected[0].toString(), columnKey), searchEnabled: false, maxDropdownHeight: 350 }) }), (0, jsx_runtime_1.jsx)("div", { style: {
39
33
  padding: "0.5rem 0.75rem",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megha-ui/react",
3
- "version": "1.2.56",
3
+ "version": "1.2.58",
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.mjs",