qbs-react-grid 1.1.41 → 1.1.43

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 (12) hide show
  1. package/es/qbsTable/CustomTableCell.js +3 -1
  2. package/es/qbsTable/commontypes.d.ts +1 -1
  3. package/es/qbsTable/utilities/menuDropDown.d.ts +1 -0
  4. package/es/qbsTable/utilities/menuDropDown.js +65 -7
  5. package/lib/qbsTable/CustomTableCell.js +3 -1
  6. package/lib/qbsTable/commontypes.d.ts +1 -1
  7. package/lib/qbsTable/utilities/menuDropDown.d.ts +1 -0
  8. package/lib/qbsTable/utilities/menuDropDown.js +65 -7
  9. package/package.json +1 -1
  10. package/src/qbsTable/CustomTableCell.tsx +2 -1
  11. package/src/qbsTable/commontypes.ts +1 -1
  12. package/src/qbsTable/utilities/menuDropDown.tsx +68 -8
package/es/qbsTable/CustomTableCell.js CHANGED
@@ -52,12 +52,14 @@ export var ActionCell = /*#__PURE__*/React.memo(function (_ref2) {
52
52
  handleMenuActions = _ref2.handleMenuActions,
53
53
  dataTheme = _ref2.dataTheme,
54
54
  actionProps = _ref2.actionProps,
55
- tableBodyRef = _ref2.tableBodyRef;
55
+ tableBodyRef = _ref2.tableBodyRef,
56
+ rowIndex = _ref2.rowIndex;
56
57
  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(MenuDropDown, {
57
58
  tableBodyRef: tableBodyRef,
58
59
  actionDropDown: actionProps,
59
60
  rowData: rowData,
60
61
  dataTheme: dataTheme,
62
+ rowIndex: rowIndex,
61
63
  handleMenuActions: handleMenuActions
62
64
  }));
63
65
  });
package/es/qbsTable/commontypes.d.ts CHANGED
@@ -41,7 +41,7 @@ export interface ActionProps {
41
41
  icon: React.ReactNode;
42
42
  toolTip?: string;
43
43
  hidden?: boolean;
44
- hide?: (data: any) => boolean;
44
+ hide?: (data: any, index?: number) => boolean;
45
45
  }
46
46
  export interface QbsTableProps {
47
47
  isLoading?: boolean;
package/es/qbsTable/utilities/menuDropDown.d.ts CHANGED
@@ -6,6 +6,7 @@ type Props = {
6
6
  rowData?: any;
7
7
  dataTheme?: string;
8
8
  tableBodyRef: React.RefObject<HTMLDivElement>;
9
+ rowIndex?: number;
9
10
  };
10
11
  declare const MenuDropDown: React.FC<Props>;
11
12
  export default MenuDropDown;
package/es/qbsTable/utilities/menuDropDown.js CHANGED
@@ -6,12 +6,15 @@ var MenuDropDown = function MenuDropDown(_ref) {
6
6
  var actionDropDown = _ref.actionDropDown,
7
7
  handleMenuActions = _ref.handleMenuActions,
8
8
  rowData = _ref.rowData,
9
- tableBodyRef = _ref.tableBodyRef;
9
+ tableBodyRef = _ref.tableBodyRef,
10
+ rowIndex = _ref.rowIndex;
10
11
  var _useState = useState(false),
11
12
  openMenu = _useState[0],
12
13
  setOpenMenu = _useState[1];
13
14
  var menuButtonRef = useRef(null);
14
15
  var menuRef = useRef(null);
16
+ var dropRef = useRef(null);
17
+ // const [dropdownPosition, setDropdownPosition] = useState('bottom-position');
15
18
  useEffect(function () {
16
19
  var handleClickOutside = function handleClickOutside(event) {
17
20
  if (menuRef.current && !menuRef.current.contains(event.target)) {
@@ -23,9 +26,11 @@ var MenuDropDown = function MenuDropDown(_ref) {
23
26
  document.removeEventListener('click', handleClickOutside);
24
27
  };
25
28
  }, []);
26
- var toggleMenu = function toggleMenu() {
27
- setOpenMenu(!openMenu);
28
- };
29
+
30
+ // const toggleMenu = () => {
31
+ // setOpenMenu(!openMenu);
32
+ // };
33
+
29
34
  var handleMenuItemClick = function handleMenuItemClick(slug) {
30
35
  var _slug$action;
31
36
  handleMenuActions === null || handleMenuActions === void 0 ? void 0 : handleMenuActions(slug, rowData);
@@ -36,10 +41,54 @@ var MenuDropDown = function MenuDropDown(_ref) {
36
41
  var _result$length;
37
42
  var result = actionDropDown === null || actionDropDown === void 0 ? void 0 : actionDropDown.filter(function (item) {
38
43
  var _item$hide;
39
- return !item.hidden && !(item !== null && item !== void 0 && (_item$hide = item.hide) !== null && _item$hide !== void 0 && _item$hide.call(item, rowData));
44
+ return !item.hidden && !(item !== null && item !== void 0 && (_item$hide = item.hide) !== null && _item$hide !== void 0 && _item$hide.call(item, rowData, rowIndex));
40
45
  });
41
46
  return (_result$length = result === null || result === void 0 ? void 0 : result.length) != null ? _result$length : 0;
42
47
  };
48
+ // const [menuPosition, setMenuPosition] = useState({
49
+ // top: 0,
50
+ // left: 0,
51
+ // bottom: 0,
52
+ // right: 0
53
+ // });
54
+ var toggleMenu = function toggleMenu() {
55
+ // if (!openMenu && menuButtonRef.current) {
56
+ // const rect = menuButtonRef.current.getBoundingClientRect();
57
+ // const topSpace = rect.top;
58
+ // const bottomSpace = window.innerHeight - rect.bottom;
59
+ // const leftSpace = rect.left;
60
+ // const rightSpace = window.innerWidth - rect.right;
61
+
62
+ // const dropdownHeight = 200;
63
+ // const dropdownWidth = 200;
64
+
65
+ // let newPosition = 'bottom-right';
66
+
67
+ // if (bottomSpace < dropdownHeight && topSpace > dropdownHeight) {
68
+ // newPosition = 'top-right';
69
+ // }
70
+
71
+ // if (rightSpace < dropdownWidth && leftSpace > dropdownWidth) {
72
+ // newPosition = newPosition.replace('right', 'left');
73
+ // }
74
+
75
+ // if (topSpace < dropdownHeight && bottomSpace < dropdownHeight) {
76
+ // newPosition = leftSpace > rightSpace ? 'bottom-left' : 'bottom-right';
77
+ // }
78
+
79
+ // setDropdownPosition(newPosition);
80
+ // setMenuPosition({
81
+ // top: rect.top + window.scrollY,
82
+ // left: rect.left + window.scrollX,
83
+ // bottom: window.innerHeight - rect.bottom,
84
+ // right: window.innerWidth - rect.right
85
+ // });
86
+ // }
87
+ setTimeout(function () {
88
+ setOpenMenu(!openMenu);
89
+ }, 200);
90
+ };
91
+ // const buttonWidth = menuButtonRef.current ? menuButtonRef.current.offsetWidth : 0;
43
92
  return /*#__PURE__*/React.createElement("div", {
44
93
  className: "qbs-table-menu-dropdown",
45
94
  ref: menuRef
@@ -48,10 +97,19 @@ var MenuDropDown = function MenuDropDown(_ref) {
48
97
  onClick: toggleMenu,
49
98
  ref: menuButtonRef
50
99
  }, /*#__PURE__*/React.createElement(ThreeDotIcon, null)), openMenu && /*#__PURE__*/React.createElement("div", {
51
- className: 'qbs-table-qbs-table-menu-dropdown-content'
100
+ className: 'qbs-table-qbs-table-menu-dropdown-content',
101
+ ref: dropRef
102
+ // style={{
103
+ // top: dropdownPosition.startsWith('bottom') ? `${menuPosition.top + 20}px` : 'auto',
104
+ // bottom: dropdownPosition.startsWith('top') ? `${menuPosition.bottom + 20}px` : 'auto',
105
+ // left: dropdownPosition.endsWith('right') ? `${menuPosition.left + 10}px` : 'auto',
106
+ // right: dropdownPosition.endsWith('left')
107
+ // ? `${window.innerWidth - menuPosition.left - buttonWidth + 10}px`
108
+ // : 'auto'
109
+ // }}
52
110
  }, actionDropDown === null || actionDropDown === void 0 ? void 0 : actionDropDown.map(function (item) {
53
111
  var _item$hide2;
54
- return /*#__PURE__*/React.createElement(React.Fragment, null, !(item !== null && item !== void 0 && item.hidden) && !(item !== null && item !== void 0 && (_item$hide2 = item.hide) !== null && _item$hide2 !== void 0 && _item$hide2.call(item, rowData)) && /*#__PURE__*/React.createElement("a", {
112
+ return /*#__PURE__*/React.createElement(React.Fragment, null, !(item !== null && item !== void 0 && item.hidden) && !(item !== null && item !== void 0 && (_item$hide2 = item.hide) !== null && _item$hide2 !== void 0 && _item$hide2.call(item, rowData, rowIndex)) && /*#__PURE__*/React.createElement("a", {
55
113
  key: item.title,
56
114
  className: "p-2 leading-7 hover:bg-background ",
57
115
  onClick: function onClick(e) {
package/lib/qbsTable/CustomTableCell.js CHANGED
@@ -60,12 +60,14 @@ var ActionCell = /*#__PURE__*/_react["default"].memo(function (_ref2) {
60
60
  handleMenuActions = _ref2.handleMenuActions,
61
61
  dataTheme = _ref2.dataTheme,
62
62
  actionProps = _ref2.actionProps,
63
- tableBodyRef = _ref2.tableBodyRef;
63
+ tableBodyRef = _ref2.tableBodyRef,
64
+ rowIndex = _ref2.rowIndex;
64
65
  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_menuDropDown["default"], {
65
66
  tableBodyRef: tableBodyRef,
66
67
  actionDropDown: actionProps,
67
68
  rowData: rowData,
68
69
  dataTheme: dataTheme,
70
+ rowIndex: rowIndex,
69
71
  handleMenuActions: handleMenuActions
70
72
  }));
71
73
  });
package/lib/qbsTable/commontypes.d.ts CHANGED
@@ -41,7 +41,7 @@ export interface ActionProps {
41
41
  icon: React.ReactNode;
42
42
  toolTip?: string;
43
43
  hidden?: boolean;
44
- hide?: (data: any) => boolean;
44
+ hide?: (data: any, index?: number) => boolean;
45
45
  }
46
46
  export interface QbsTableProps {
47
47
  isLoading?: boolean;
package/lib/qbsTable/utilities/menuDropDown.d.ts CHANGED
@@ -6,6 +6,7 @@ type Props = {
6
6
  rowData?: any;
7
7
  dataTheme?: string;
8
8
  tableBodyRef: React.RefObject<HTMLDivElement>;
9
+ rowIndex?: number;
9
10
  };
10
11
  declare const MenuDropDown: React.FC<Props>;
11
12
  export default MenuDropDown;
package/lib/qbsTable/utilities/menuDropDown.js CHANGED
@@ -12,12 +12,15 @@ var MenuDropDown = function MenuDropDown(_ref) {
12
12
  var actionDropDown = _ref.actionDropDown,
13
13
  handleMenuActions = _ref.handleMenuActions,
14
14
  rowData = _ref.rowData,
15
- tableBodyRef = _ref.tableBodyRef;
15
+ tableBodyRef = _ref.tableBodyRef,
16
+ rowIndex = _ref.rowIndex;
16
17
  var _useState = (0, _react.useState)(false),
17
18
  openMenu = _useState[0],
18
19
  setOpenMenu = _useState[1];
19
20
  var menuButtonRef = (0, _react.useRef)(null);
20
21
  var menuRef = (0, _react.useRef)(null);
22
+ var dropRef = (0, _react.useRef)(null);
23
+ // const [dropdownPosition, setDropdownPosition] = useState('bottom-position');
21
24
  (0, _react.useEffect)(function () {
22
25
  var handleClickOutside = function handleClickOutside(event) {
23
26
  if (menuRef.current && !menuRef.current.contains(event.target)) {
@@ -29,9 +32,11 @@ var MenuDropDown = function MenuDropDown(_ref) {
29
32
  document.removeEventListener('click', handleClickOutside);
30
33
  };
31
34
  }, []);
32
- var toggleMenu = function toggleMenu() {
33
- setOpenMenu(!openMenu);
34
- };
35
+
36
+ // const toggleMenu = () => {
37
+ // setOpenMenu(!openMenu);
38
+ // };
39
+
35
40
  var handleMenuItemClick = function handleMenuItemClick(slug) {
36
41
  var _slug$action;
37
42
  handleMenuActions === null || handleMenuActions === void 0 ? void 0 : handleMenuActions(slug, rowData);
@@ -42,10 +47,54 @@ var MenuDropDown = function MenuDropDown(_ref) {
42
47
  var _result$length;
43
48
  var result = actionDropDown === null || actionDropDown === void 0 ? void 0 : actionDropDown.filter(function (item) {
44
49
  var _item$hide;
45
- return !item.hidden && !(item !== null && item !== void 0 && (_item$hide = item.hide) !== null && _item$hide !== void 0 && _item$hide.call(item, rowData));
50
+ return !item.hidden && !(item !== null && item !== void 0 && (_item$hide = item.hide) !== null && _item$hide !== void 0 && _item$hide.call(item, rowData, rowIndex));
46
51
  });
47
52
  return (_result$length = result === null || result === void 0 ? void 0 : result.length) != null ? _result$length : 0;
48
53
  };
54
+ // const [menuPosition, setMenuPosition] = useState({
55
+ // top: 0,
56
+ // left: 0,
57
+ // bottom: 0,
58
+ // right: 0
59
+ // });
60
+ var toggleMenu = function toggleMenu() {
61
+ // if (!openMenu && menuButtonRef.current) {
62
+ // const rect = menuButtonRef.current.getBoundingClientRect();
63
+ // const topSpace = rect.top;
64
+ // const bottomSpace = window.innerHeight - rect.bottom;
65
+ // const leftSpace = rect.left;
66
+ // const rightSpace = window.innerWidth - rect.right;
67
+
68
+ // const dropdownHeight = 200;
69
+ // const dropdownWidth = 200;
70
+
71
+ // let newPosition = 'bottom-right';
72
+
73
+ // if (bottomSpace < dropdownHeight && topSpace > dropdownHeight) {
74
+ // newPosition = 'top-right';
75
+ // }
76
+
77
+ // if (rightSpace < dropdownWidth && leftSpace > dropdownWidth) {
78
+ // newPosition = newPosition.replace('right', 'left');
79
+ // }
80
+
81
+ // if (topSpace < dropdownHeight && bottomSpace < dropdownHeight) {
82
+ // newPosition = leftSpace > rightSpace ? 'bottom-left' : 'bottom-right';
83
+ // }
84
+
85
+ // setDropdownPosition(newPosition);
86
+ // setMenuPosition({
87
+ // top: rect.top + window.scrollY,
88
+ // left: rect.left + window.scrollX,
89
+ // bottom: window.innerHeight - rect.bottom,
90
+ // right: window.innerWidth - rect.right
91
+ // });
92
+ // }
93
+ setTimeout(function () {
94
+ setOpenMenu(!openMenu);
95
+ }, 200);
96
+ };
97
+ // const buttonWidth = menuButtonRef.current ? menuButtonRef.current.offsetWidth : 0;
49
98
  return /*#__PURE__*/_react["default"].createElement("div", {
50
99
  className: "qbs-table-menu-dropdown",
51
100
  ref: menuRef
@@ -54,10 +103,19 @@ var MenuDropDown = function MenuDropDown(_ref) {
54
103
  onClick: toggleMenu,
55
104
  ref: menuButtonRef
56
105
  }, /*#__PURE__*/_react["default"].createElement(_icons.ThreeDotIcon, null)), openMenu && /*#__PURE__*/_react["default"].createElement("div", {
57
- className: 'qbs-table-qbs-table-menu-dropdown-content'
106
+ className: 'qbs-table-qbs-table-menu-dropdown-content',
107
+ ref: dropRef
108
+ // style={{
109
+ // top: dropdownPosition.startsWith('bottom') ? `${menuPosition.top + 20}px` : 'auto',
110
+ // bottom: dropdownPosition.startsWith('top') ? `${menuPosition.bottom + 20}px` : 'auto',
111
+ // left: dropdownPosition.endsWith('right') ? `${menuPosition.left + 10}px` : 'auto',
112
+ // right: dropdownPosition.endsWith('left')
113
+ // ? `${window.innerWidth - menuPosition.left - buttonWidth + 10}px`
114
+ // : 'auto'
115
+ // }}
58
116
  }, actionDropDown === null || actionDropDown === void 0 ? void 0 : actionDropDown.map(function (item) {
59
117
  var _item$hide2;
60
- return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, !(item !== null && item !== void 0 && item.hidden) && !(item !== null && item !== void 0 && (_item$hide2 = item.hide) !== null && _item$hide2 !== void 0 && _item$hide2.call(item, rowData)) && /*#__PURE__*/_react["default"].createElement("a", {
118
+ return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, !(item !== null && item !== void 0 && item.hidden) && !(item !== null && item !== void 0 && (_item$hide2 = item.hide) !== null && _item$hide2 !== void 0 && _item$hide2.call(item, rowData, rowIndex)) && /*#__PURE__*/_react["default"].createElement("a", {
61
119
  key: item.title,
62
120
  className: "p-2 leading-7 hover:bg-background ",
63
121
  onClick: function onClick(e) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "qbs-react-grid",
3
- "version": "1.1.41",
3
+ "version": "1.1.43",
4
4
  "description": "A React table component",
5
5
  "main": "lib/index.js",
6
6
  "typings": "lib/index.d.ts",
package/src/qbsTable/CustomTableCell.tsx CHANGED
@@ -37,7 +37,7 @@ export const CheckCell: React.FC<any> = React.memo(
37
37
  )
38
38
  );
39
39
  export const ActionCell: React.FC<any> = React.memo(
40
- ({ rowData, handleMenuActions, dataTheme, actionProps, tableBodyRef }) => {
40
+ ({ rowData, handleMenuActions, dataTheme, actionProps, tableBodyRef, rowIndex }) => {
41
41
  return (
42
42
  <div>
43
43
  <MenuDropDown
@@ -45,6 +45,7 @@ export const ActionCell: React.FC<any> = React.memo(
45
45
  actionDropDown={actionProps}
46
46
  rowData={rowData}
47
47
  dataTheme={dataTheme}
48
+ rowIndex={rowIndex}
48
49
  handleMenuActions={handleMenuActions}
49
50
  />
50
51
  </div>
package/src/qbsTable/commontypes.ts CHANGED
@@ -45,7 +45,7 @@ export interface ActionProps {
45
45
  icon: React.ReactNode;
46
46
  toolTip?: string;
47
47
  hidden?: boolean;
48
- hide?: (data: any) => boolean;
48
+ hide?: (data: any,index?:number) => boolean;
49
49
  }
50
50
 
51
51
  export interface QbsTableProps {
package/src/qbsTable/utilities/menuDropDown.tsx CHANGED
@@ -11,18 +11,21 @@ type Props = {
11
11
  rowData?: any;
12
12
  dataTheme?: string;
13
13
  tableBodyRef: React.RefObject<HTMLDivElement>;
14
+ rowIndex?: number;
14
15
  };
15
16
 
16
17
  const MenuDropDown: React.FC<Props> = ({
17
18
  actionDropDown,
18
19
  handleMenuActions,
19
20
  rowData,
20
- tableBodyRef
21
+ tableBodyRef,
22
+ rowIndex
21
23
  }) => {
22
24
  const [openMenu, setOpenMenu] = useState(false);
23
25
  const menuButtonRef = useRef<HTMLButtonElement | null>(null);
24
26
  const menuRef = useRef<HTMLDivElement | null>(null);
25
-
27
+ const dropRef = useRef<HTMLDivElement | null>(null);
28
+ // const [dropdownPosition, setDropdownPosition] = useState('bottom-position');
26
29
  useEffect(() => {
27
30
  const handleClickOutside = (event: MouseEvent) => {
28
31
  if (menuRef.current && !menuRef.current.contains(event.target as Node)) {
@@ -37,9 +40,9 @@ const MenuDropDown: React.FC<Props> = ({
37
40
  };
38
41
  }, []);
39
42
 
40
- const toggleMenu = () => {
41
- setOpenMenu(!openMenu);
42
- };
43
+ // const toggleMenu = () => {
44
+ // setOpenMenu(!openMenu);
45
+ // };
43
46
 
44
47
  const handleMenuItemClick = (slug: ActionProps) => {
45
48
  handleMenuActions?.(slug, rowData);
@@ -47,9 +50,55 @@ const MenuDropDown: React.FC<Props> = ({
47
50
  setOpenMenu(false);
48
51
  };
49
52
  const handleShowHideMenu = () => {
50
- const result = actionDropDown?.filter((item: any) => !item.hidden && !item?.hide?.(rowData));
53
+ const result = actionDropDown?.filter(
54
+ (item: any) => !item.hidden && !item?.hide?.(rowData, rowIndex)
55
+ );
51
56
  return result?.length ?? 0;
52
57
  };
58
+ // const [menuPosition, setMenuPosition] = useState({
59
+ // top: 0,
60
+ // left: 0,
61
+ // bottom: 0,
62
+ // right: 0
63
+ // });
64
+ const toggleMenu = () => {
65
+ // if (!openMenu && menuButtonRef.current) {
66
+ // const rect = menuButtonRef.current.getBoundingClientRect();
67
+ // const topSpace = rect.top;
68
+ // const bottomSpace = window.innerHeight - rect.bottom;
69
+ // const leftSpace = rect.left;
70
+ // const rightSpace = window.innerWidth - rect.right;
71
+
72
+ // const dropdownHeight = 200;
73
+ // const dropdownWidth = 200;
74
+
75
+ // let newPosition = 'bottom-right';
76
+
77
+ // if (bottomSpace < dropdownHeight && topSpace > dropdownHeight) {
78
+ // newPosition = 'top-right';
79
+ // }
80
+
81
+ // if (rightSpace < dropdownWidth && leftSpace > dropdownWidth) {
82
+ // newPosition = newPosition.replace('right', 'left');
83
+ // }
84
+
85
+ // if (topSpace < dropdownHeight && bottomSpace < dropdownHeight) {
86
+ // newPosition = leftSpace > rightSpace ? 'bottom-left' : 'bottom-right';
87
+ // }
88
+
89
+ // setDropdownPosition(newPosition);
90
+ // setMenuPosition({
91
+ // top: rect.top + window.scrollY,
92
+ // left: rect.left + window.scrollX,
93
+ // bottom: window.innerHeight - rect.bottom,
94
+ // right: window.innerWidth - rect.right
95
+ // });
96
+ // }
97
+ setTimeout(() => {
98
+ setOpenMenu(!openMenu);
99
+ }, 200);
100
+ };
101
+ // const buttonWidth = menuButtonRef.current ? menuButtonRef.current.offsetWidth : 0;
53
102
  return (
54
103
  <div className="qbs-table-menu-dropdown" ref={menuRef}>
55
104
  {handleShowHideMenu() > 0 && (
@@ -58,10 +107,21 @@ const MenuDropDown: React.FC<Props> = ({
58
107
  </button>
59
108
  )}
60
109
  {openMenu && (
61
- <div className={'qbs-table-qbs-table-menu-dropdown-content'}>
110
+ <div
111
+ className={'qbs-table-qbs-table-menu-dropdown-content'}
112
+ ref={dropRef}
113
+ // style={{
114
+ // top: dropdownPosition.startsWith('bottom') ? `${menuPosition.top + 20}px` : 'auto',
115
+ // bottom: dropdownPosition.startsWith('top') ? `${menuPosition.bottom + 20}px` : 'auto',
116
+ // left: dropdownPosition.endsWith('right') ? `${menuPosition.left + 10}px` : 'auto',
117
+ // right: dropdownPosition.endsWith('left')
118
+ // ? `${window.innerWidth - menuPosition.left - buttonWidth + 10}px`
119
+ // : 'auto'
120
+ // }}
121
+ >
62
122
  {actionDropDown?.map(item => (
63
123
  <>
64
- {!item?.hidden && !item?.hide?.(rowData) && (
124
+ {!item?.hidden && !item?.hide?.(rowData, rowIndex) && (
65
125
  <a
66
126
  key={item.title}
67
127
  className={`p-2 leading-7 hover:bg-background `}