trotl-table 1.0.64 → 1.0.65

package/dist/Table.cjs.js

@@ -9701,6 +9701,7 @@ function TableInner({
         yesDelete: "Yes, Delete",
         areYouSureYouWantToDelete: "Are you sure you want to delete",
         action: "Action",
+        noData: "No Data",
         DropHereToMoveIntoThisGroup: "Drop here to move into this group"
       };
       return translations[key] || key;
@@ -10236,12 +10237,15 @@ function TableInner({
     }
   }, [getAccessorKey, getAccessorValue]);
   const renderCell = React.useCallback((v, accessor, row, col) => {
+    const isNoData = v === undefined;
+
     // Checkbox column type (editable in-table)
     if (col && col.type === 'checkbox') {
       const checked = !!v;
       return /*#__PURE__*/React.createElement("input", {
         type: "checkbox",
         checked: checked,
+        title: isNoData ? translate("noData") : undefined,
         onClick: e => {
           e.stopPropagation();
           triggerCellCallback(row, col, checked);
@@ -10277,6 +10281,7 @@ function TableInner({
     if (col && col.type === 'switch') {
       const checked = !!v;
       return /*#__PURE__*/React.createElement("div", {
+        title: isNoData ? translate("noData") : undefined,
         onClick: e => {
           e.stopPropagation();
           triggerCellCallback(row, col, checked);
@@ -10312,11 +10317,13 @@ function TableInner({
 
     // Input column type (editable text)
     if (col && col.type === 'input') {
-      const text = v == null ? "" : String(v);
+      const text = isNoData ? "" : v == null ? "" : String(v);
       return /*#__PURE__*/React.createElement("input", {
         type: "text",
         className: "table-cell-input",
         value: text,
+        placeholder: isNoData ? "..." : undefined,
+        title: isNoData ? translate("noData") : text,
         onClick: e => {
           e.stopPropagation();
           triggerCellCallback(row, col, text);
@@ -10351,6 +10358,11 @@ function TableInner({
         }
       });
     }
+    if (isNoData) {
+      return /*#__PURE__*/React.createElement("span", {
+        title: translate("noData")
+      }, "...");
+    }
 
     // If column has dateFormat, format value as date/time
     if (col && col.dateFormat && v) {
@@ -10396,7 +10408,7 @@ function TableInner({
     }
     // existing highlight logic for other fields
     return highlight(String(v));
-  }, [highlight, isGrouped, triggerCellCallback]);
+  }, [highlight, isGrouped, triggerCellCallback, translate]);
   const showView = buttons.includes("view");
   const showEdit = buttons.includes("edit");
   // show delete only when view is also shown (per request)