blixify-ui-web 1.2.58 → 1.2.60

package/lib/components/display/newTable/index.js

@@ -100,6 +100,7 @@ var tag_1 = require("../tag");
 var textButton_1 = require("../../action/textButton");
 var iconButton_1 = require("../../action/iconButton");
 var link_1 = require("../../structure/link");
+var button_1 = require("../../action/button");
 var modal_1 = require("../modal");
 // INFO: resolve dotted key paths (e.g. "group.subKey") against a row object.
 // Required because flatColumns uses "parent.child" keys for groupData sub-columns.
@@ -140,8 +141,24 @@ var resolveValueToString = function (key, source, row) {
     }
     return "";
 };
+var handleCheckModalEditEmpty = function (value) {
+    if (value === undefined || value === null)
+        return true;
+    if (typeof value === "string") {
+        var trimmed = value.trim();
+        return trimmed === "" || trimmed === "-";
+    }
+    if (Array.isArray(value))
+        return value.length === 0;
+    if (typeof value === "object") {
+        if (Array.isArray(value.data))
+            return value.data.length === 0;
+        return Object.values(value).every(function (each) { return each === undefined || each === null || each === ""; });
+    }
+    return false;
+};
 var NewTable = function (props) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
     var columns = (_b = (_a = props.columns) !== null && _a !== void 0 ? _a : props.header) !== null && _b !== void 0 ? _b : [];
     var defaultLimit = 10;
     var defaultPageSize = 5;
@@ -190,26 +207,30 @@ var NewTable = function (props) {
         flatColumns.length = 0;
         flatColumns.push.apply(flatColumns, __spreadArray(__spreadArray(__spreadArray([], leftCols, false), middleCols, false), rightCols, false));
     }
-    var _s = (0, react_2.useState)(props.fixedPagination ? true : false), isFixed = _s[0], setIsFixed = _s[1];
+    var _v = (0, react_2.useState)(props.fixedPagination ? true : false), isFixed = _v[0], setIsFixed = _v[1];
     //=====================================================================================
     // SECTION: Advanced Settings
     //=====================================================================================
-    var _t = (0, react_2.useState)(""), filterModal = _t[0], setFilterModal = _t[1];
-    var _u = (0, react_2.useState)(""), addColumnModal = _u[0], setAddColumnModal = _u[1];
+    var _w = (0, react_2.useState)(""), filterModal = _w[0], setFilterModal = _w[1];
+    var _x = (0, react_2.useState)(""), addColumnModal = _x[0], setAddColumnModal = _x[1];
     //=====================================================================================
     // SECTION: Editable & Addable cells
     //=====================================================================================
-    var _v = (0, react_2.useState)(""), editDataRowId = _v[0], setEditDataRowId = _v[1];
-    var _w = (0, react_2.useState)(""), editDataHeaderKey = _w[0], setEditDataHeaderKey = _w[1];
-    var _x = (0, react_2.useState)({}), editDataValue = _x[0], setEditDataValue = _x[1];
-    var _y = (0, react_2.useState)(false), editDataIsLoading = _y[0], setEditDataIsLoading = _y[1];
-    var _z = (0, react_2.useState)(false), addData = _z[0], setAddData = _z[1];
-    var _0 = (0, react_2.useState)({}), addDataValue = _0[0], setAddDataValue = _0[1];
-    var _1 = (0, react_2.useState)({}), referencesOptions = _1[0], setReferencesOptions = _1[1];
-    var _2 = (0, react_2.useState)({}), referencesDetails = _2[0], setReferencesDetails = _2[1];
-    var _3 = (0, react_2.useState)(false), referenceLoading = _3[0], setReferenceLoading = _3[1];
+    var _y = (0, react_2.useState)(""), editDataRowId = _y[0], setEditDataRowId = _y[1];
+    var _z = (0, react_2.useState)(""), editDataHeaderKey = _z[0], setEditDataHeaderKey = _z[1];
+    var _0 = (0, react_2.useState)(false), modalEditVisible = _0[0], setModalEditVisible = _0[1];
+    var _1 = (0, react_2.useState)({}), editDataValue = _1[0], setEditDataValue = _1[1];
+    var _2 = (0, react_2.useState)(false), editDataIsLoading = _2[0], setEditDataIsLoading = _2[1];
+    var _3 = (0, react_2.useState)(false), addData = _3[0], setAddData = _3[1];
+    var _4 = (0, react_2.useState)({}), addDataValue = _4[0], setAddDataValue = _4[1];
+    var _5 = (0, react_2.useState)({}), referencesOptions = _5[0], setReferencesOptions = _5[1];
+    // INFO: seeded options sit under the local map so a cell's own search
+    // results still win per key
+    var mergedReferencesOptions = __assign(__assign({}, ((_g = props.referencesOptions) !== null && _g !== void 0 ? _g : {})), referencesOptions);
+    var _6 = (0, react_2.useState)({}), referencesDetails = _6[0], setReferencesDetails = _6[1];
+    var _7 = (0, react_2.useState)(false), referenceLoading = _7[0], setReferenceLoading = _7[1];
     // INFO: measured pixel widths for pinned columns without an explicit width.
-    var _4 = (0, react_2.useState)({}), measuredPinWidths = _4[0], setMeasuredPinWidths = _4[1];
+    var _8 = (0, react_2.useState)({}), measuredPinWidths = _8[0], setMeasuredPinWidths = _8[1];
     var editDataValueRef = (0, react_2.useRef)({});
     var editDataRowIdRef = (0, react_2.useRef)("");
     var editDataInputRefs = (0, react_2.useRef)([]);
@@ -397,6 +418,99 @@ var NewTable = function (props) {
             setEditDataValue(data);
         }
     };
+    var handleOnChangeFile = function (e) {
+        var cloned = handleGenerateClonedData();
+        cloned[e.target.id] =
+            e.target.files.length > 0 ? e.target.files[0] : undefined;
+        handleUpdateChangeData(cloned);
+    };
+    var handleOnChangeFiles = function (id, value, action) {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
+        var cloned = handleGenerateClonedData();
+        var previousData = (_b = (_a = cloned[id]) === null || _a === void 0 ? void 0 : _a["data"]) !== null && _b !== void 0 ? _b : [];
+        var previousUpload = (_d = (_c = cloned[id]) === null || _c === void 0 ? void 0 : _c["upload"]) !== null && _d !== void 0 ? _d : [];
+        var previousRemove = (_f = (_e = cloned[id]) === null || _e === void 0 ? void 0 : _e["remove"]) !== null && _f !== void 0 ? _f : [];
+        if (action === "tagEdit") {
+            var applyTags = function (target, source) {
+                return target.map(function (item) {
+                    var match = source.find(function (each) { return each.token === item.token; });
+                    return match
+                        ? __assign(__assign({}, item), { tags: match.tags, description: match.description, hidden: match.hidden }) : item;
+                });
+            };
+            cloned[id] = __assign(__assign({}, cloned[id]), { data: applyTags(previousData, (_g = value.data) !== null && _g !== void 0 ? _g : []), upload: applyTags(previousUpload, (_h = value.upload) !== null && _h !== void 0 ? _h : []) });
+        }
+        else if (action === "upload") {
+            cloned[id] = __assign(__assign({}, cloned[id]), { upload: __spreadArray(__spreadArray([], value, true), previousUpload, true) });
+        }
+        else if (previousData.some(function (file) { return file.token === value.token; })) {
+            cloned[id] = __assign(__assign({}, cloned[id]), { data: previousData.filter(function (file) { return file.token !== value.token; }), remove: __spreadArray(__spreadArray([], previousRemove, true), [value], false) });
+        }
+        else {
+            cloned[id] = __assign(__assign({}, cloned[id]), { upload: previousUpload.filter(function (file) { return file.token !== value.token; }) });
+        }
+        handleUpdateChangeData(cloned);
+    };
+    var handleNormalizeEditValue = function (headerKey, data) {
+        var _a;
+        var selectedHeader = flatColumns.find(function (eachHeader) { return eachHeader.key === headerKey; });
+        if (!selectedHeader)
+            return data;
+        if (selectedHeader.type === "multipleImage" ||
+            selectedHeader.type === "multipleFile") {
+            var value = data[headerKey];
+            if (Array.isArray(value) || value === undefined || value === null) {
+                return __assign(__assign({}, data), (_a = {}, _a[headerKey] = { data: value !== null && value !== void 0 ? value : [], upload: [], remove: [] }, _a));
+            }
+        }
+        return data;
+    };
+    var handleModalEditOnClick = function (rowId, headerKey, data) {
+        var normalised = handleNormalizeEditValue(headerKey, data);
+        originalDataRef.current = data;
+        editDataRowIdRef.current = rowId;
+        editDataValueRef.current = normalised;
+        setEditDataRowId(rowId);
+        setEditDataValue(normalised);
+        setEditDataHeaderKey(headerKey);
+        setModalEditVisible(true);
+        handleCreateFormInputRefs("edit");
+    };
+    var handleModalEditClose = function () {
+        setModalEditVisible(false);
+        editDataRowIdRef.current = "";
+        editDataValueRef.current = {};
+        setEditDataRowId("");
+        setEditDataValue({});
+        setEditDataHeaderKey("");
+    };
+    var handleModalEditSave = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var columnId, value, isUntouchedFilesObj;
+        var _a, _b, _c, _d, _e, _f;
+        return __generator(this, function (_g) {
+            switch (_g.label) {
+                case 0:
+                    columnId = editDataHeaderKey;
+                    value = editDataValueRef.current[columnId];
+                    isUntouchedFilesObj = value &&
+                        typeof value === "object" &&
+                        !Array.isArray(value) &&
+                        Array.isArray(value.data) &&
+                        ((_b = (_a = value.upload) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) === 0 &&
+                        ((_d = (_c = value.remove) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0) === 0 &&
+                        JSON.stringify(value.data) ===
+                            JSON.stringify((_f = (_e = originalDataRef.current) === null || _e === void 0 ? void 0 : _e[columnId]) !== null && _f !== void 0 ? _f : []);
+                    if (!!isUntouchedFilesObj) return [3 /*break*/, 2];
+                    return [4 /*yield*/, handleEditDataOnBlur(columnId, editDataValueRef.current)];
+                case 1:
+                    _g.sent();
+                    _g.label = 2;
+                case 2:
+                    handleModalEditClose();
+                    return [2 /*return*/];
+            }
+        });
+    }); };
     var handleOnChangeText = function (e) {
         var cloned = handleGenerateClonedData();
         cloned[e.target.id] = e.target.value;
@@ -705,7 +819,7 @@ var NewTable = function (props) {
         }, false, cellInput, undefined, {
             dbModule: axios_1.default,
             devSettings: props.devSettings,
-            referencesOptions: referencesOptions,
+            referencesOptions: mergedReferencesOptions,
             referencesDetails: referencesDetails,
             referenceLoading: referenceLoading,
             setReferenceLoading: setReferenceLoading,
@@ -833,7 +947,7 @@ var NewTable = function (props) {
     };
     // INFO: true when maxSelectedCount is set and the current selection has reached the limit
     var isMaxReached = !!props.maxSelectedCount &&
-        ((_h = (_g = props.selectedIds) === null || _g === void 0 ? void 0 : _g.length) !== null && _h !== void 0 ? _h : 0) >= props.maxSelectedCount;
+        ((_j = (_h = props.selectedIds) === null || _h === void 0 ? void 0 : _h.length) !== null && _j !== void 0 ? _j : 0) >= props.maxSelectedCount;
     var renderFloatingActionBar = function () {
         var _a, _b, _c, _d, _e;
         if (!((_a = props.multiActionFloatingBtns) === null || _a === void 0 ? void 0 : _a.length))
@@ -1058,7 +1172,7 @@ var NewTable = function (props) {
         var isIdLike_1 = function (c) {
             return /^id$/i.test(c.key) || /^_id$/i.test(c.key);
         };
-        var titleCol_1 = (_j = flatColumns.find(function (c) { return !isIdLike_1(c); })) !== null && _j !== void 0 ? _j : flatColumns[0];
+        var titleCol_1 = (_k = flatColumns.find(function (c) { return !isIdLike_1(c); })) !== null && _k !== void 0 ? _k : flatColumns[0];
         var expandHeaderBg_1 = props.darkMode ? "bg-gray-700" : "bg-gray-100";
         var expandHeaderFontColor_1 = props.darkMode ? "text-white" : "";
         var headerBgColor_1 = props.darkMode ? "bg-gray-900" : "";
@@ -1130,14 +1244,14 @@ var NewTable = function (props) {
                 })))));
         };
         return (react_2.default.createElement("div", null,
-            react_2.default.createElement("div", { className: "w-full ".concat(((_k = props.mobileTooltip) === null || _k === void 0 ? void 0 : _k.tooltip) ? "overflow-visible" : "overflow-hidden", " border ").concat(borderRadius, " ").concat(borderColor, " ").concat(bgColor, " shadow-sm divide-y ").concat(dividerColor, " ").concat((_l = props.className) !== null && _l !== void 0 ? _l : "") },
+            react_2.default.createElement("div", { className: "w-full ".concat(((_l = props.mobileTooltip) === null || _l === void 0 ? void 0 : _l.tooltip) ? "overflow-visible" : "overflow-hidden", " border ").concat(borderRadius, " ").concat(borderColor, " ").concat(bgColor, " shadow-sm divide-y ").concat(dividerColor, " ").concat((_m = props.className) !== null && _m !== void 0 ? _m : "") },
                 react_2.default.createElement("div", { className: "p-3 flex justify-between" },
                     renderSelectAll(),
                     renderSelectedCount()),
                 props.loading &&
                     Array.from({ length: 3 }).map(function (_, i) { return (react_2.default.createElement("div", { key: "skeleton-".concat(i), className: "p-4" },
                         react_2.default.createElement("div", { className: "h-5 w-3/4 rounded-md animate-pulse ".concat(props.darkMode ? "bg-gray-700" : "bg-gray-200") }))); }),
-                !props.loading && props.data.length === 0 && (react_2.default.createElement("p", { className: "p-4 text-center text-sm ".concat(cellFontColor) }, (_m = props.emptyTitle) !== null && _m !== void 0 ? _m : "No items")),
+                !props.loading && props.data.length === 0 && (react_2.default.createElement("p", { className: "p-4 text-center text-sm ".concat(cellFontColor) }, (_o = props.emptyTitle) !== null && _o !== void 0 ? _o : "No items")),
                 !props.loading &&
                     props.data.map(function (row, index) {
                         var _a, _b, _c, _d, _e, _f, _g;
@@ -1192,18 +1306,54 @@ var NewTable = function (props) {
                 renderPagination())),
             renderFloatingActionBar()));
     }
-    return (react_2.default.createElement("div", { className: "w-full ".concat((_o = props.className) !== null && _o !== void 0 ? _o : "") },
+    return (react_2.default.createElement("div", { className: "w-full ".concat((_p = props.className) !== null && _p !== void 0 ? _p : "") },
         react_2.default.createElement(modal_1.Modal, { open: filterModal ? true : false, title: "Filter Options", renderContent: function () {
                 var _a, _b;
                 return (react_2.default.createElement("div", { className: "pb-44" },
                     react_2.default.createElement("div", { className: "pb-48" }, (_b = (_a = props.advSettings) === null || _a === void 0 ? void 0 : _a.renderFilterElements) === null || _b === void 0 ? void 0 : _b.call(_a, filterModal))));
             }, onClose: function () { return setFilterModal(""); } }),
+        react_2.default.createElement(modal_1.Modal, { open: modalEditVisible, title: (_r = (_q = flatColumns.find(function (eachCol) { return eachCol.key === editDataHeaderKey; })) === null || _q === void 0 ? void 0 : _q.title) !== null && _r !== void 0 ? _r : "Edit", onClose: handleModalEditClose, renderContent: function () {
+                var _a, _b, _c, _d;
+                var selectedCol = flatColumns.find(function (eachCol) { return eachCol.key === editDataHeaderKey; });
+                if (!selectedCol)
+                    return react_2.default.createElement("div", null);
+                var tempDS = handleConvertColumnToDataStructure([selectedCol])[0];
+                return (react_2.default.createElement("div", { className: "flex flex-col gap-4" },
+                    (0, updateModule_1.renderDataTemplateForm)(editDataValue, [tempDS], editDataInputRefs.current, {
+                        handleOnChangeAddress: handleOnChangeAddress,
+                        handleOnChangeText: handleOnChangeText,
+                        handleOnChangeSelect: handleOnChangeSelect,
+                        handleOnChangeDate: handleOnChangeDate,
+                        handleOnChangeFile: handleOnChangeFile,
+                        handleOnChangeFiles: handleOnChangeFiles,
+                    }, true, undefined, {
+                        id: editDataRowId,
+                        type: "list",
+                        showId: props.showId,
+                    }, {
+                        dbModule: axios_1.default,
+                        devSettings: props.devSettings,
+                        referencesOptions: mergedReferencesOptions,
+                        referencesDetails: referencesDetails,
+                        referenceLoading: referenceLoading,
+                        setReferenceLoading: setReferenceLoading,
+                        setReferencesOptions: setReferencesOptions,
+                        setReferencesDetails: setReferencesDetails,
+                    }, {
+                        imageEndpoint: (_b = (_a = props.devSettings) === null || _a === void 0 ? void 0 : _a.imageEndpoint) !== null && _b !== void 0 ? _b : "",
+                        imageBucketName: (_c = props.devSettings) === null || _c === void 0 ? void 0 : _c.bucketName,
+                        maxFileSize: (_d = props.devSettings) === null || _d === void 0 ? void 0 : _d.maxFileSize,
+                    }),
+                    react_2.default.createElement("div", { className: "flex justify-end gap-3", "data-testid": "table-modal-editor-actions" },
+                        react_2.default.createElement(button_1.Button, { text: "Cancel", type: "light", onClick: handleModalEditClose }),
+                        react_2.default.createElement(button_1.Button, { text: editDataIsLoading ? "Saving" : "Save", type: "normal", disable: editDataIsLoading, onClick: handleModalEditSave }))));
+            } }),
         react_2.default.createElement(modal_1.Modal, { open: addColumnModal ? true : false, title: "Add Columns", renderContent: function () {
                 var _a, _b;
                 return (react_2.default.createElement("div", null, (_b = (_a = props.advSettings) === null || _a === void 0 ? void 0 : _a.renderAddColumnElements) === null || _b === void 0 ? void 0 : _b.call(_a, addColumnModal, function (id) { return handleAddColumnModal(id); })));
             }, onClose: function () { return handleAddColumnModal(""); } }),
         react_2.default.createElement("div", { className: "w-full overflow-x-auto ".concat(borderRadius, " border ").concat(borderColor, " ").concat(bgColor, " shadow-sm") },
-            (props.selectAll || ((_q = (_p = props.selectedIds) === null || _p === void 0 ? void 0 : _p.length) !== null && _q !== void 0 ? _q : 0) > 0) &&
+            (props.selectAll || ((_t = (_s = props.selectedIds) === null || _s === void 0 ? void 0 : _s.length) !== null && _t !== void 0 ? _t : 0) > 0) &&
                 (!props.multiActionFloatingBtns ||
                     (props.multiActionFloatingBtns &&
                         props.multiActionFloatingBtns.length <= 0)) && (react_2.default.createElement("div", { className: "sticky left-0 flex flex-row items-center px-4 py-3 gap-x-2" },
@@ -1249,19 +1399,47 @@ var NewTable = function (props) {
                                     ? "opacity-50 cursor-not-allowed"
                                     : ""))),
                                 flatColumns.map(function (col, colIndex) {
-                                    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+                                    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
                                     var cellValue = spaceRow
                                         ? spaceRow[col.key]
                                         : resolveValue(row, col.key);
                                     // INFO: first col with type "string" is never made editable
                                     var resolvedColType = (_a = col.type) !== null && _a !== void 0 ? _a : "string";
-                                    var isEditable = ((_b = props.editable) === null || _b === void 0 ? void 0 : _b.active) &&
-                                        !(((_d = (_c = props.selectedIds) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0) > 0 ||
+                                    var isActionColumn = col.key === "update" && !col.type;
+                                    var isModalEdit = ((_b = props.editable) === null || _b === void 0 ? void 0 : _b.active) &&
+                                        !isActionColumn &&
+                                        utils_1.supportedModalEditList.includes(resolvedColType);
+                                    var isObjectEdit = ((_c = props.editable) === null || _c === void 0 ? void 0 : _c.active) &&
+                                        !isActionColumn &&
+                                        resolvedColType === "object" &&
+                                        !!props.onObjectEdit;
+                                    var isEditable = ((_d = props.editable) === null || _d === void 0 ? void 0 : _d.active) &&
+                                        !isActionColumn &&
+                                        !(((_f = (_e = props.selectedIds) === null || _e === void 0 ? void 0 : _e.length) !== null && _f !== void 0 ? _f : 0) > 0 ||
                                             props.selectAll) &&
-                                        utils_1.supportedTableAddList.includes(resolvedColType);
+                                        utils_1.supportedInlineEditList.includes(resolvedColType);
                                     var rowData = editDataRowId === row.id ? editDataValue : row;
+                                    if (isObjectEdit) {
+                                        return (react_2.default.createElement("td", { key: col.key, className: "".concat(cellPadding, " text-sm ").concat(cellFontColor, " whitespace-nowrap") },
+                                            react_2.default.createElement("div", { className: "cursor-pointer group/modaledit flex items-center gap-x-2 min-h-6", "data-testid": "table-object-edit-".concat(col.key), onClick: function (e) {
+                                                    var _a;
+                                                    e.stopPropagation();
+                                                    (_a = props.onObjectEdit) === null || _a === void 0 ? void 0 : _a.call(props, row.id, col.key, row);
+                                                } },
+                                                handleCheckModalEditEmpty(cellValue) ? (react_2.default.createElement("span", { className: "text-gray-400 italic" }, "Add")) : ((0, readModule_1.renderEachRowDataBasedOnDataType)(col.key, cellValue, props.bareSettings, true, props.disableEllipsisOnLongWord)),
+                                                react_2.default.createElement(outline_1.PencilIcon, { className: "w-3.5 h-3.5 text-gray-400 opacity-0 group-hover/modaledit:opacity-100 flex-shrink-0" }))));
+                                    }
+                                    if (isModalEdit) {
+                                        return (react_2.default.createElement("td", { key: col.key, className: "".concat(cellPadding, " text-sm ").concat(cellFontColor, " whitespace-nowrap") },
+                                            react_2.default.createElement("div", { className: "cursor-pointer group/modaledit flex items-center gap-x-2 min-h-6", "data-testid": "table-modal-edit-".concat(col.key), onClick: function (e) {
+                                                    e.stopPropagation();
+                                                    handleModalEditOnClick(row.id, col.key, row);
+                                                } },
+                                                handleCheckModalEditEmpty(cellValue) ? (react_2.default.createElement("span", { className: "text-gray-400 italic" }, "Add")) : ((0, readModule_1.renderEachRowDataBasedOnDataType)(col.key, cellValue, props.bareSettings, true, props.disableEllipsisOnLongWord)),
+                                                react_2.default.createElement(outline_1.PencilIcon, { className: "w-3.5 h-3.5 text-gray-400 opacity-0 group-hover/modaledit:opacity-100 flex-shrink-0" }))));
+                                    }
                                     if (isEditable) {
-                                        var bareOverride = (_f = (_e = props.bareSettings) === null || _e === void 0 ? void 0 : _e.bareListDescription) === null || _f === void 0 ? void 0 : _f.call(_e, col.key, cellValue);
+                                        var bareOverride = (_h = (_g = props.bareSettings) === null || _g === void 0 ? void 0 : _g.bareListDescription) === null || _h === void 0 ? void 0 : _h.call(_g, col.key, cellValue);
                                         if (!bareOverride)
                                             return renderEditDataInputs(colIndex, col, rowData, row.id, rowBgClass, isRowHoverable);
                                     }
@@ -1270,14 +1448,14 @@ var NewTable = function (props) {
                                     react_2.default.createElement("td", { key: col.key, "data-pin-key": leftPinned.includes(col.key) ||
                                             rightPinned.includes(col.key)
                                             ? col.key
-                                            : undefined, className: "".concat(cellPadding, " text-sm ").concat(colIndex === 0 && props.onClickRow ? titleFontColor : cellFontColor, " ").concat(col.width ? "".concat(col.width, " flex-shrink-0") : getPinProps(col.key, false) ? "" : "whitespace-nowrap", " ").concat((_h = (_g = getPinProps(col.key, false, rowBgClass, isRowHoverable)) === null || _g === void 0 ? void 0 : _g.className) !== null && _h !== void 0 ? _h : ""), style: (_j = getPinProps(col.key, false, rowBgClass, isRowHoverable)) === null || _j === void 0 ? void 0 : _j.style }, props.newTabUrl && props.onClickRow ? (react_2.default.createElement(link_1.Link, { href: props.newTabUrl +
+                                            : undefined, className: "".concat(cellPadding, " text-sm ").concat(colIndex === 0 && props.onClickRow ? titleFontColor : cellFontColor, " ").concat(col.width ? "".concat(col.width, " flex-shrink-0") : getPinProps(col.key, false) ? "" : "whitespace-nowrap", " ").concat((_k = (_j = getPinProps(col.key, false, rowBgClass, isRowHoverable)) === null || _j === void 0 ? void 0 : _j.className) !== null && _k !== void 0 ? _k : ""), style: (_l = getPinProps(col.key, false, rowBgClass, isRowHoverable)) === null || _l === void 0 ? void 0 : _l.style }, props.newTabUrl && props.onClickRow ? (react_2.default.createElement(link_1.Link, { href: props.newTabUrl +
                                             row.id +
-                                            ((_k = props.addNewTabUrl) !== null && _k !== void 0 ? _k : ""), className: "w-full block", linkType: props.linkType, custom: props.custom }, (0, readModule_1.renderEachRowDataBasedOnDataType)(col.key, cellValue, props.bareSettings, true, props.disableEllipsisOnLongWord))) : ((0, readModule_1.renderEachRowDataBasedOnDataType)(col.key, cellValue, props.bareSettings, true, props.disableEllipsisOnLongWord))));
+                                            ((_m = props.addNewTabUrl) !== null && _m !== void 0 ? _m : ""), className: "w-full block", linkType: props.linkType, custom: props.custom }, (0, readModule_1.renderEachRowDataBasedOnDataType)(col.key, cellValue, props.bareSettings, true, props.disableEllipsisOnLongWord))) : ((0, readModule_1.renderEachRowDataBasedOnDataType)(col.key, cellValue, props.bareSettings, true, props.disableEllipsisOnLongWord))));
                                 }),
                                 renderActionColumnCell(row.id)));
                         }),
                     !props.loading && addData && renderAddDataRow())),
-            !props.loading && props.data.length === 0 && (react_2.default.createElement("div", { className: "p-4 text-sm ".concat(cellFontColor, " text-center sticky left-0") }, (_r = props.emptyTitle) !== null && _r !== void 0 ? _r : "No items")),
+            !props.loading && props.data.length === 0 && (react_2.default.createElement("div", { className: "p-4 text-sm ".concat(cellFontColor, " text-center sticky left-0") }, (_u = props.emptyTitle) !== null && _u !== void 0 ? _u : "No items")),
             renderAddableSection()),
         !props.hidePagination && props.paginationType && (react_2.default.createElement("div", { className: "mt-2 flex items-center justify-between ".concat(props.fixedPagination
                 ? "pagination-container w-full ".concat(borderColor, " ").concat(isFixed ? "fixed bottom-0 left-0 z-10" : "sticky top-0 left-0")