@teselagen/ui 0.8.6-beta.22 → 0.8.6-beta.24

package/index.es.js

@@ -15849,6 +15849,7 @@ var itemSizeEstimator = /* @__PURE__ */ __name(function itemSizeEstimator2() {
   return 41.36;
 }, "itemSizeEstimator");
 var ReactTableDefaults = defaultProps;
+var VIRTUALIZE_CUTOFF_LENGTH = 200;
 var ReactTable = function(_Methods) {
   _inherits$8(ReactTable2, _Methods);
   function ReactTable2(props) {
@@ -16434,7 +16435,7 @@ var ReactTable = function(_Methods) {
                   minWidth: rowMinWidth + "px"
                 })
               }, tBodyProps.rest),
-              pageRows.length < 200 ? pageRows.map(function(d2, i2) {
+              _this2.props.noVirtual || pageRows.length < VIRTUALIZE_CUTOFF_LENGTH ? pageRows.map(function(d2, i2) {
                 return makePageRow(d2, i2);
               }) : React__default.createElement(ReactList, {
                 type: "variable",
@@ -16538,7 +16539,7 @@ const getIdOrCodeOrIndex = /* @__PURE__ */ __name((record, rowIndex) => {
 const getSelectedRowsFromEntities = /* @__PURE__ */ __name((entities, idMap) => {
   if (!idMap) return [];
   return entities.reduce((acc, entity, i2) => {
-    return idMap[getIdOrCodeOrIndex(entity, i2)] ? acc.concat(i2) : acc;
+    return idMap[getIdOrCodeOrIndex(entity, i2)] ? acc.concat([i2]) : acc;
   }, []);
 }, "getSelectedRowsFromEntities");
 const removeCleanRows = /* @__PURE__ */ __name((entities, cellValidation) => {
@@ -16662,9 +16663,9 @@ const stripNumberAtEnd = /* @__PURE__ */ __name((str) => {
   var _a;
   return (_a = str == null ? void 0 : str.replace) == null ? void 0 : _a.call(str, getNumberStrAtEnd(str), "");
 }, "stripNumberAtEnd");
-const getAllRows = /* @__PURE__ */ __name((e) => {
-  const el = e.target.querySelector(".data-table-container") ? e.target.querySelector(".data-table-container") : e.target.closest(".data-table-container");
-  const allRowEls = el.querySelectorAll(".rt-tr");
+const getAllRows = /* @__PURE__ */ __name((tableRef) => {
+  var _a, _b;
+  const allRowEls = (_b = (_a = tableRef.current) == null ? void 0 : _a.tableRef) == null ? void 0 : _b.querySelectorAll(".rt-tr");
   if (!allRowEls || !allRowEls.length) {
     return;
   }
@@ -16931,14 +16932,14 @@ const handleCopyRows = /* @__PURE__ */ __name((rowElsToCopy, { specificColumn, o
     handleCopyHelper(textToCopy, jsonToCopy, onFinishMsg || "Row Copied");
   }
 }, "handleCopyRows");
-const handleCopyColumn = /* @__PURE__ */ __name((e, cellWrapper, selectedRecords) => {
+const handleCopyColumn = /* @__PURE__ */ __name((tableRef, cellWrapper, selectedRecords) => {
   const specificColumn = cellWrapper.getAttribute("data-test");
-  let rowElsToCopy = getAllRows(e);
+  let rowElsToCopy = getAllRows(tableRef);
   if (!rowElsToCopy) return;
   if (selectedRecords) {
-    const ids2 = selectedRecords.map((e2) => {
+    const ids2 = selectedRecords.map((e) => {
       var _a;
-      return (_a = getIdOrCodeOrIndex(e2)) == null ? void 0 : _a.toString();
+      return (_a = getIdOrCodeOrIndex(e)) == null ? void 0 : _a.toString();
     });
     rowElsToCopy = Array.from(rowElsToCopy).filter((rowEl) => {
       var _a;
@@ -16971,9 +16972,9 @@ const isBottomRightCornerOfRectangle = /* @__PURE__ */ __name(({
   const isBottomRight = i2 === lastRowIndex && cellIndex === lastCellIndex;
   return isBottomRight;
 }, "isBottomRightCornerOfRectangle");
-const handleCopyTable = /* @__PURE__ */ __name((e, opts) => {
+const handleCopyTable = /* @__PURE__ */ __name((tableRef, opts) => {
   try {
-    const allRowEls = getAllRows(e);
+    const allRowEls = getAllRows(tableRef);
     if (!allRowEls) return;
     handleCopyRows(allRowEls, __spreadProps(__spreadValues({}, opts), {
       onFinishMsg: "Table Copied"
@@ -17010,13 +17011,15 @@ const useTableEntities = /* @__PURE__ */ __name((tableFormName) => {
     },
     [dispatch, tableFormName]
   );
-  const { allOrderedEntities, selectedEntities } = useSelector((state) => {
-    var _a, _b, _c, _d, _e, _f;
-    return {
-      allOrderedEntities: (_c = (_b = (_a = state.form) == null ? void 0 : _a[tableFormName]) == null ? void 0 : _b.values) == null ? void 0 : _c.allOrderedEntities,
-      selectedEntities: (_f = (_e = (_d = state.form) == null ? void 0 : _d[tableFormName]) == null ? void 0 : _e.values) == null ? void 0 : _f.reduxFormSelectedEntityIdMap
-    };
-  });
+  const { allOrderedEntities, selectedEntities } = useSelector(
+    (state) => {
+      var _a, _b, _c, _d, _e, _f;
+      return {
+        allOrderedEntities: (_c = (_b = (_a = state.form) == null ? void 0 : _a[tableFormName]) == null ? void 0 : _b.values) == null ? void 0 : _c.allOrderedEntities,
+        selectedEntities: (_f = (_e = (_d = state.form) == null ? void 0 : _d[tableFormName]) == null ? void 0 : _e.values) == null ? void 0 : _f.reduxFormSelectedEntityIdMap
+      };
+    }
+  );
   return { selectTableEntities, allOrderedEntities, selectedEntities };
 }, "useTableEntities");
 const useDeepEqualMemo = /* @__PURE__ */ __name((value) => {
@@ -20178,7 +20181,7 @@ function getQueryParams({
         order_by.push({ updatedAt: "desc" });
       }
       order_by.push(
-        isCodeModel ? { code: "desc" } : { [window.__sortId || "id"]: "desc" }
+        isCodeModel ? { code: "asc" } : { [window.__sortId || "id"]: "asc" }
       );
       return __spreadProps(__spreadValues({}, toRet), {
         variables: {
@@ -37214,7 +37217,7 @@ const multiViewColumn = __spreadProps(__spreadValues({}, viewColumn), {
     ));
   }, "render")
 });
-function convertSchema(schema) {
+const convertSchema = /* @__PURE__ */ __name((schema) => {
   let schemaToUse = schema;
   if (!schemaToUse.fields && Array.isArray(schema)) {
     schemaToUse = {
@@ -37223,35 +37226,26 @@ function convertSchema(schema) {
   }
   schemaToUse = __spreadValues({}, schemaToUse);
   schemaToUse.fields = schemaToUse.fields.map((field, i2) => {
-    let fieldToUse = field;
     if (typeof field === "string") {
-      fieldToUse = {
+      return {
         displayName: startCase(camelCase(field)),
         path: field,
         type: "string"
       };
-    } else if (!field.type) {
-      fieldToUse = __spreadProps(__spreadValues({}, field), {
-        type: "string"
-      });
-    }
-    if (!fieldToUse.displayName) {
-      fieldToUse = __spreadProps(__spreadValues({}, fieldToUse), {
-        displayName: startCase(camelCase(fieldToUse.path))
-      });
-    }
-    if (!fieldToUse.path) {
-      fieldToUse = __spreadProps(__spreadValues({}, fieldToUse), {
-        filterDisabled: true,
-        sortDisabled: true,
-        path: "fake-path" + i2
-      });
+    } else {
+      const fieldToUse = __spreadValues({}, field);
+      fieldToUse.type = fieldToUse.type || "string";
+      fieldToUse.displayName = fieldToUse.displayName || startCase(camelCase(fieldToUse.path || ""));
+      if (!fieldToUse.path) {
+        fieldToUse.filterDisabled = true;
+        fieldToUse.sortDisabled = true;
+        fieldToUse.path = "fake-path" + i2;
+      }
+      return fieldToUse;
     }
-    return fieldToUse;
   });
   return schemaToUse;
-}
-__name(convertSchema, "convertSchema");
+}, "convertSchema");
 function mergeSchemas(_originalSchema, _overrideSchema) {
   const originalSchema = convertSchema(_originalSchema);
   const overrideSchema = convertSchema(_overrideSchema);
@@ -56302,6 +56296,7 @@ const DataTable = /* @__PURE__ */ __name((_I) => {
   );
   const tableRef = useRef();
   const alreadySelected = useRef(false);
+  const [noVirtual, setNoVirtual] = useState(false);
   const [onlyShowRowsWErrors, setOnlyShowRowsWErrors] = useState(false);
   const [entitiesUndoRedoStack, setEntitiesUndoRedoStack] = useState({
     currentVersion: 0
@@ -57143,76 +57138,94 @@ const DataTable = /* @__PURE__ */ __name((_I) => {
     updateEntitiesHelper,
     updateValidation
   ]);
-  const handleCopySelectedCells = useCallback(
-    (e) => {
-      if (isEmpty$1(selectedCells)) return;
-      const pathToIndex = getFieldPathToIndex(schema);
-      const entityIdToEntity = getEntityIdToEntity(entities);
-      const selectionGrid = [];
-      let firstRowIndex;
-      let firstCellIndex;
-      Object.keys(selectedCells).forEach((key) => {
-        const [rowId, path2] = key.split(":");
-        const eInfo = entityIdToEntity[rowId];
-        if (eInfo) {
-          if (firstRowIndex === void 0 || eInfo.i < firstRowIndex) {
-            firstRowIndex = eInfo.i;
-          }
-          if (!selectionGrid[eInfo.i]) {
-            selectionGrid[eInfo.i] = [];
-          }
-          const cellIndex = pathToIndex[path2];
-          if (firstCellIndex === void 0 || cellIndex < firstCellIndex) {
-            firstCellIndex = cellIndex;
-          }
-          selectionGrid[eInfo.i][cellIndex] = true;
-        }
-      });
-      if (firstRowIndex === void 0) return;
-      const allRows = getAllRows(e);
-      let fullCellText = "";
-      const fullJson = [];
-      times(selectionGrid.length, (i2) => {
-        const row = selectionGrid[i2];
-        if (fullCellText) {
-          fullCellText += "\n";
-        }
-        if (!row) {
-          return;
-        } else {
-          const jsonRow = [];
-          let [rowCopyText, json] = getRowCopyText(allRows[i2 + 1]);
-          rowCopyText = rowCopyText.split("	");
-          times(row.length, (i22) => {
-            const cell = row[i22];
-            if (cell) {
-              fullCellText += rowCopyText[i22];
-              jsonRow.push(json[i22]);
-            }
-            if (i22 !== row.length - 1 && i22 >= firstCellIndex)
-              fullCellText += "	";
-          });
-          fullJson.push(jsonRow);
+  const waitUntilAllRowsAreRendered = useCallback(() => {
+    return new Promise((resolve) => {
+      const interval = setInterval(() => {
+        var _a2, _b;
+        const allRowEls = (_b = (_a2 = tableRef.current) == null ? void 0 : _a2.tableRef) == null ? void 0 : _b.querySelectorAll(".rt-tr-group");
+        if ((allRowEls == null ? void 0 : allRowEls.length) === entities.length) {
+          clearInterval(interval);
+          resolve();
+        }
+      }, 50);
+    });
+  }, []);
+  const handleCopySelectedCells = useCallback(() => __async(void 0, null, function* () {
+    if (isEmpty$1(selectedCells)) return;
+    if (entities.length > VIRTUALIZE_CUTOFF_LENGTH) {
+      setNoVirtual(true);
+      yield waitUntilAllRowsAreRendered();
+    }
+    const pathToIndex = getFieldPathToIndex(schema);
+    const entityIdToEntity = getEntityIdToEntity(entities);
+    const selectionGrid = [];
+    let firstRowIndex;
+    let firstCellIndex;
+    Object.keys(selectedCells).forEach((key) => {
+      const [rowId, path2] = key.split(":");
+      const eInfo = entityIdToEntity[rowId];
+      if (eInfo) {
+        if (firstRowIndex === void 0 || eInfo.i < firstRowIndex) {
+          firstRowIndex = eInfo.i;
+        }
+        if (!selectionGrid[eInfo.i]) {
+          selectionGrid[eInfo.i] = [];
+        }
+        const cellIndex = pathToIndex[path2];
+        if (firstCellIndex === void 0 || cellIndex < firstCellIndex) {
+          firstCellIndex = cellIndex;
         }
-      });
-      if (!fullCellText) return window.toastr.warning("No text to copy");
-      handleCopyHelper(fullCellText, fullJson, "Selected cells copied");
-    },
-    [entities, selectedCells, schema]
-  );
+        selectionGrid[eInfo.i][cellIndex] = true;
+      }
+    });
+    if (firstRowIndex === void 0) return;
+    const allRows = getAllRows(tableRef);
+    let fullCellText = "";
+    const fullJson = [];
+    times(selectionGrid.length, (i2) => {
+      const row = selectionGrid[i2];
+      if (fullCellText) {
+        fullCellText += "\n";
+      }
+      if (!row) {
+        return;
+      } else {
+        const jsonRow = [];
+        let [rowCopyText, json] = getRowCopyText(allRows[i2 + 1]);
+        rowCopyText = rowCopyText.split("	");
+        times(row.length, (i22) => {
+          const cell = row[i22];
+          if (cell) {
+            fullCellText += rowCopyText[i22];
+            jsonRow.push(json[i22]);
+          }
+          if (i22 !== row.length - 1 && i22 >= firstCellIndex) fullCellText += "	";
+        });
+        fullJson.push(jsonRow);
+      }
+    });
+    if (!fullCellText) return window.toastr.warning("No text to copy");
+    handleCopyHelper(fullCellText, fullJson, "Selected cells copied");
+    setNoVirtual(false);
+  }), [entities, selectedCells, schema, waitUntilAllRowsAreRendered]);
   const handleCopySelectedRows = useCallback(
-    (selectedRecords, e) => {
-      const idToIndex = entities.reduce((acc, e2, i2) => {
-        acc[e2.id || e2.code] = i2;
+    (selectedRecords) => __async(void 0, null, function* () {
+      if (entities.length > VIRTUALIZE_CUTOFF_LENGTH) {
+        setNoVirtual(true);
+        yield waitUntilAllRowsAreRendered();
+      }
+      const idToIndex = entities.reduce((acc, e, i2) => {
+        acc[e.id || e.code] = i2;
         return acc;
       }, {});
       const rowNumbersToCopy = selectedRecords.map((rec) => idToIndex[rec.id || rec.code] + 1).sort();
       if (!rowNumbersToCopy.length) return;
       rowNumbersToCopy.unshift(0);
       try {
-        const allRowEls = getAllRows(e);
+        const allRowEls = getAllRows(tableRef);
         if (!allRowEls) return;
         const rowEls = rowNumbersToCopy.map((i2) => allRowEls[i2]);
+        if (window.Cypress) window.Cypress.__copiedRowsLength = rowEls.length;
         handleCopyRows(rowEls, {
           onFinishMsg: "Selected rows copied"
         });
@@ -57220,8 +57233,9 @@ const DataTable = /* @__PURE__ */ __name((_I) => {
         console.error(`error:`, error);
         window.toastr.error("Error copying rows.");
       }
-    },
-    [entities]
+      setNoVirtual(false);
+    }),
+    [entities, waitUntilAllRowsAreRendered]
   );
   const handleCopyHotkey = useCallback(
     (e) => {
@@ -57988,7 +58002,7 @@ const DataTable = /* @__PURE__ */ __name((_I) => {
               {
                 key: "copyColumn",
                 onClick: /* @__PURE__ */ __name(() => {
-                  handleCopyColumn(e, cellWrapper);
+                  handleCopyColumn(tableRef, cellWrapper);
                 }, "onClick"),
                 text: "Column"
               }
@@ -58001,7 +58015,7 @@ const DataTable = /* @__PURE__ */ __name((_I) => {
                 {
                   key: "copyColumnSelected",
                   onClick: /* @__PURE__ */ __name(() => {
-                    handleCopyColumn(e, cellWrapper, selectedRecords);
+                    handleCopyColumn(tableRef, cellWrapper, selectedRecords);
                   }, "onClick"),
                   text: "Column (Selected)"
                 }
@@ -58044,7 +58058,7 @@ const DataTable = /* @__PURE__ */ __name((_I) => {
             {
               key: "copyFullTableRows",
               onClick: /* @__PURE__ */ __name(() => {
-                handleCopyTable(e);
+                handleCopyTable(tableRef);
               }, "onClick"),
               text: "Table"
             }
@@ -58581,6 +58595,7 @@ const DataTable = /* @__PURE__ */ __name((_I) => {
       __spreadValues({
         data: filteredEnts,
         ref: tableRef,
+        noVirtual,
         className: classNames({
           isCellEditable,
           "tg-table-loading": isLoading,
@@ -58648,7 +58663,8 @@ const DataTable = /* @__PURE__ */ __name((_I) => {
       resizePersist,
       resized,
       rowsToShow,
-      style
+      style,
+      noVirtual
     ]
   );
   return /* @__PURE__ */ React__default.createElement("div", { tabIndex: "1", onKeyDown: handleKeyDown, onKeyUp: handleKeyUp }, /* @__PURE__ */ React__default.createElement(
@@ -58931,8 +58947,8 @@ const DataTable = /* @__PURE__ */ __name((_I) => {
       ), /* @__PURE__ */ React__default.createElement(
         Button,
         {
-          onClick: /* @__PURE__ */ __name((e) => {
-            handleCopyTable(e, { isDownload: true });
+          onClick: /* @__PURE__ */ __name(() => {
+            handleCopyTable(tableRef, { isDownload: true });
           }, "onClick"),
           "data-tip": "Download Table as CSV",
           minimal: true,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teselagen/ui",
-  "version": "0.8.6-beta.22",
+  "version": "0.8.6-beta.24",
   "main": "./src/index.js",
   "type": "module",
   "exports": {
@@ -17,7 +17,7 @@
     "@dnd-kit/core": "^6.1.0",
     "@dnd-kit/modifiers": "^7.0.0",
     "@dnd-kit/sortable": "^8.0.0",
-    "@teselagen/react-table": "6.10.16",
+    "@teselagen/react-table": "6.10.18",
     "classnames": "^2.3.2",
     "color": "^3.2.1",
     "copy-to-clipboard": "^3.3.1",