@datarecce/ui 0.1.0 → 0.1.1

package/dist/components.mjs

@@ -25,7 +25,7 @@ import './styles-LEL5RGUW.css';
 import { VscKebabVertical, VscHistory, VscDiffAdded, VscDiffRemoved, VscDiffModified, VscFeedback, VscKey, VscClose, VscPinned, VscPin, VscCircleLarge } from 'react-icons/vsc';
 import { PiWarning, PiCaretDown, PiInfo, PiX, PiRepeat, PiCopy, PiDotsThreeVertical, PiCheck, PiTrashFill, PiCheckCircle, PiInfoFill, PiPencilSimple, PiTrashSimple, PiBookmarkSimple, PiNotePencil, PiCircle, PiChatText, PiPlusCircle } from 'react-icons/pi';
 import { useCopyToClipboard } from 'usehooks-ts';
-import { DataGrid, renderTextEditor } from 'react-data-grid';
+import { DataGrid, textEditor } from 'react-data-grid';
 import 'react-data-grid/lib/styles.css';
 import { formatDistanceToNow, format, parseISO, formatDistance } from 'date-fns';
 import saveAs from 'file-saver';
@@ -1783,49 +1783,6 @@ function ProfileDiffForm({
   ] });
 }
 
-// recce-source/js/src/utils/transforms.ts
-function dataFrameToRowObjects(dataFrame) {
-  return dataFrame.data.map((row, index) => ({
-    ...dataFrame.columns.reduce(
-      (obj, column, colIndex) => {
-        obj[column.key] = row[colIndex];
-        return obj;
-      },
-      {}
-    ),
-    __status: void 0,
-    _index: index + 1
-  }));
-}
-function keyToNumber(key) {
-  const parsed = Number(key);
-  if (!isNaN(parsed) && isFinite(parsed)) {
-    return parsed;
-  }
-  return hashStringToNumber(key);
-}
-function hashStringToNumber(str) {
-  let hash = 0;
-  for (let i = 0; i < str.length; i++) {
-    const char = str.charCodeAt(i);
-    hash = (hash << 5) - hash + char;
-    hash = hash & hash;
-  }
-  return Math.abs(hash);
-}
-function includesIgnoreCase(list, searchString) {
-  const lowerSearch = searchString.toLowerCase();
-  return list.some((item) => item.toLowerCase() === lowerSearch);
-}
-function getCaseInsensitive(obj, key) {
-  const lowerKey = key.toLowerCase();
-  if (lowerKey in obj) {
-    return obj[lowerKey];
-  }
-  const foundKey = Object.keys(obj).find((k) => k.toLowerCase() === lowerKey);
-  return foundKey ? obj[foundKey] : void 0;
-}
-
 // recce-source/js/src/lib/dataGrid/shared/columnBuilders.ts
 function shouldIncludeColumn(columnStatus, changedOnly, hasModifiedRows) {
   if (!changedOnly || !hasModifiedRows) {
@@ -1833,22 +1790,16 @@ function shouldIncludeColumn(columnStatus, changedOnly, hasModifiedRows) {
   }
   return columnStatus === "added" || columnStatus === "removed" || columnStatus === "modified";
 }
-function isPrimaryKeyColumn(columnName, primaryKeys, caseInsensitive = false) {
-  return caseInsensitive ? includesIgnoreCase(primaryKeys, columnName) : primaryKeys.includes(columnName);
+function isPrimaryKeyColumn(columnName, primaryKeys) {
+  return primaryKeys.includes(columnName);
 }
-function isPinnedColumn(columnName, pinnedColumns, caseInsensitive = false) {
-  return caseInsensitive ? includesIgnoreCase(pinnedColumns, columnName) : pinnedColumns.includes(columnName);
+function isPinnedColumn(columnName, pinnedColumns) {
+  return pinnedColumns.includes(columnName);
 }
-function isExcludedColumn(columnName, excludeColumns, caseInsensitive = false) {
-  return caseInsensitive ? includesIgnoreCase(excludeColumns, columnName) : excludeColumns.includes(columnName);
+function isExcludedColumn(columnName, excludeColumns) {
+  return excludeColumns.includes(columnName);
 }
-function findColumn(columnMap, name, caseInsensitive) {
-  if (caseInsensitive) {
-    const entry = Object.entries(columnMap).find(
-      ([k]) => k.toLowerCase() === name.toLowerCase()
-    );
-    return entry?.[1];
-  }
+function findColumn(columnMap, name) {
   return columnMap[name];
 }
 function getDisplayColumns(config) {
@@ -1860,13 +1811,12 @@ function getDisplayColumns(config) {
     changedOnly = false,
     rowStats,
     excludeColumns = [],
-    caseInsensitive = false,
     strictMode = false
   } = config;
   const hasModifiedRows = (rowStats?.modified ?? 0) > 0;
   const columns = [];
   primaryKeys.forEach((name) => {
-    const col = findColumn(columnMap, name, caseInsensitive);
+    const col = findColumn(columnMap, name);
     if (!col) {
       if (strictMode) {
         throw new Error(`Primary key column "${name}" not found in columnMap`);
@@ -1884,9 +1834,9 @@ function getDisplayColumns(config) {
     });
   });
   pinnedColumns.forEach((name) => {
-    if (isPrimaryKeyColumn(name, primaryKeys, caseInsensitive)) return;
-    if (isExcludedColumn(name, excludeColumns, caseInsensitive)) return;
-    const col = findColumn(columnMap, name, caseInsensitive);
+    if (isPrimaryKeyColumn(name, primaryKeys)) return;
+    if (isExcludedColumn(name, excludeColumns)) return;
+    const col = findColumn(columnMap, name);
     if (!col) {
       if (strictMode) {
         throw new Error(`Pinned column "${name}" not found in columnMap`);
@@ -1902,9 +1852,9 @@ function getDisplayColumns(config) {
     });
   });
   Object.entries(columnMap).forEach(([name, col]) => {
-    if (isPrimaryKeyColumn(name, primaryKeys, caseInsensitive)) return;
-    if (isPinnedColumn(name, pinnedColumns, caseInsensitive)) return;
-    if (isExcludedColumn(name, excludeColumns, caseInsensitive)) return;
+    if (isPrimaryKeyColumn(name, primaryKeys)) return;
+    if (isPinnedColumn(name, pinnedColumns)) return;
+    if (isExcludedColumn(name, excludeColumns)) return;
     if (!shouldIncludeColumn(col.status, changedOnly, hasModifiedRows)) {
       return;
     }
@@ -2019,14 +1969,13 @@ function DataFrameColumnGroupHeader({
   onPrimaryKeyChange,
   pinnedColumns = [],
   onPinnedColumnsChange,
-  onColumnsRenderModeChanged,
-  caseInsensitive = false
+  onColumnsRenderModeChanged
 }) {
   if (name === "index") {
     return /* @__PURE__ */ jsx(Fragment, {});
   }
-  const isPK = caseInsensitive ? includesIgnoreCase(primaryKeys, name) : primaryKeys.includes(name);
-  const isPinned = caseInsensitive ? includesIgnoreCase(pinnedColumns, name) : pinnedColumns.includes(name);
+  const isPK = primaryKeys.includes(name);
+  const isPinned = pinnedColumns.includes(name);
   const canBePk = columnStatus !== "added" && columnStatus !== "removed";
   let selectOptions = [];
   if (onColumnsRenderModeChanged) {
@@ -2037,7 +1986,7 @@ function DataFrameColumnGroupHeader({
   }
   const handleRemovePk = () => {
     if (!onPrimaryKeyChange) return;
-    const newPrimaryKeys = caseInsensitive ? primaryKeys.filter((item) => item.toLowerCase() !== name.toLowerCase()) : primaryKeys.filter((item) => item !== name);
+    const newPrimaryKeys = primaryKeys.filter((item) => item !== name);
     onPrimaryKeyChange(newPrimaryKeys);
   };
   const handleAddPk = () => {
@@ -2050,9 +1999,7 @@ function DataFrameColumnGroupHeader({
   };
   const handleUnpin = () => {
     if (!onPinnedColumnsChange) return;
-    const newPinnedColumns = caseInsensitive ? pinnedColumns.filter(
-      (item) => item.toLowerCase() !== name.toLowerCase()
-    ) : pinnedColumns.filter((item) => item !== name);
+    const newPinnedColumns = pinnedColumns.filter((item) => item !== name);
     onPinnedColumnsChange(newPinnedColumns);
   };
   const handlePin = () => {
@@ -2230,6 +2177,45 @@ function mergeKeysWithStatus(_base, _curr) {
   return result;
 }
 
+// recce-source/js/src/utils/transforms.ts
+function dataFrameToRowObjects(dataFrame) {
+  return dataFrame.data.map((row, index) => ({
+    ...dataFrame.columns.reduce(
+      (obj, column, colIndex) => {
+        obj[column.key] = row[colIndex];
+        return obj;
+      },
+      {}
+    ),
+    __status: void 0,
+    _index: index + 1
+  }));
+}
+function keyToNumber(key) {
+  const parsed = Number(key);
+  if (!isNaN(parsed) && isFinite(parsed)) {
+    return parsed;
+  }
+  return hashStringToNumber(key);
+}
+function hashStringToNumber(str) {
+  let hash = 0;
+  for (let i = 0; i < str.length; i++) {
+    const char = str.charCodeAt(i);
+    hash = (hash << 5) - hash + char;
+    hash = hash & hash;
+  }
+  return Math.abs(hash);
+}
+function getCaseInsensitive(obj, key) {
+  const lowerKey = key.toLowerCase();
+  if (lowerKey in obj) {
+    return obj[lowerKey];
+  }
+  const foundKey = Object.keys(obj).find((k) => k.toLowerCase() === lowerKey);
+  return foundKey ? obj[foundKey] : void 0;
+}
+
 // recce-source/js/src/lib/dataGrid/shared/gridUtils.ts
 function buildColumnMap(df) {
   const result = {};
@@ -2245,21 +2231,18 @@ function buildColumnMap(df) {
 function buildJoinedColumnMap(df) {
   const result = {};
   df.columns.forEach((col, index) => {
-    if (col.name.toLowerCase() === "in_a" || col.name.toLowerCase() === "in_b") {
-      result[col.name.toUpperCase()] = {
-        key: col.key,
-        index,
-        colType: col.type
-      };
-      result[col.name.toLowerCase()] = {
-        key: col.key,
-        index,
-        colType: col.type
-      };
-    } else {
-      result[col.name] = { key: col.key, index, colType: col.type };
-    }
+    result[col.key] = {
+      key: col.key,
+      index,
+      colType: col.type
+    };
   });
+  if (!result.in_a) {
+    throw new Error("Joined DataFrame missing required 'in_a' column");
+  }
+  if (!result.in_b) {
+    throw new Error("Joined DataFrame missing required 'in_b' column");
+  }
   return result;
 }
 function buildMergedColumnMap(base, current) {
@@ -2281,10 +2264,10 @@ function buildMergedColumnMap(base, current) {
   });
   return result;
 }
-function validatePrimaryKeys(columns, primaryKeys, caseInsensitive = false) {
+function validatePrimaryKeys(columns, primaryKeys) {
   const keys = [];
   for (const key of primaryKeys) {
-    const found = caseInsensitive ? columns.find((col) => includesIgnoreCase([col.key], key)) : columns.find((col) => col.key === key);
+    const found = columns.find((col) => col.key === key);
     if (!found) {
       throw new Error(`Column ${key} not found`);
     }
@@ -2292,17 +2275,17 @@ function validatePrimaryKeys(columns, primaryKeys, caseInsensitive = false) {
   }
   return keys;
 }
-function getPrimaryKeyValue(columns, primaryKeys, row, caseInsensitive = false) {
+function getPrimaryKeyValue(columns, primaryKeys, row) {
   if (primaryKeys.length === 0) {
     return String(row._index);
   }
   const result = [];
   for (const key of primaryKeys) {
-    const col = caseInsensitive ? columns.find((c) => includesIgnoreCase([c.key], key)) : columns.find((c) => c.key === key);
+    const col = columns.find((c) => c.key === key);
     if (!col) {
       throw new Error(`Primary Column ${key} not found`);
     }
-    const value = caseInsensitive ? getCaseInsensitive(row, key) ?? "" : row[key];
+    const value = row[key];
     result.push(`${col.name}=${value}`);
   }
   return result.join("|");
@@ -2564,7 +2547,7 @@ function toDiffColumn(config) {
       {
         key: `base__${name}`,
         name: baseTitle,
-        renderEditCell: renderTextEditor,
+        renderEditCell: textEditor,
         headerCellClass,
         cellClass: cellClassBase,
         renderCell: defaultRenderCell,
@@ -2575,7 +2558,7 @@ function toDiffColumn(config) {
       {
         key: `current__${name}`,
         name: currentTitle,
-        renderEditCell: renderTextEditor,
+        renderEditCell: textEditor,
         headerCellClass,
         cellClass: cellClassCurrent,
         renderCell: defaultRenderCell,
@@ -2669,8 +2652,8 @@ function buildDiffColumnDefinitions(config) {
 function isMergeColumnMapEntry(entry) {
   return "baseColumnKey" in entry && "currentColumnKey" in entry;
 }
-function isPrimaryKey(columnName, primaryKeys, caseInsensitive) {
-  return caseInsensitive ? includesIgnoreCase(primaryKeys, columnName) : primaryKeys.includes(columnName);
+function isPrimaryKey(columnName, primaryKeys) {
+  return primaryKeys.includes(columnName);
 }
 function getComparisonKeys(entry) {
   if (isMergeColumnMapEntry(entry)) {
@@ -2684,10 +2667,10 @@ function getComparisonKeys(entry) {
     currentKey: entry.key
   };
 }
-function populateRowValues(targetRow, sourceRow, columns, prefix3, primaryKeys, caseInsensitive) {
+function populateRowValues(targetRow, sourceRow, columns, prefix3, primaryKeys) {
   columns.forEach((col) => {
     const colKey = col.key;
-    const isPK = isPrimaryKey(colKey, primaryKeys, caseInsensitive);
+    const isPK = isPrimaryKey(colKey, primaryKeys);
     if (isPK) {
       targetRow[String(colKey).toLowerCase()] = sourceRow[colKey];
     } else {
@@ -2695,11 +2678,11 @@ function populateRowValues(targetRow, sourceRow, columns, prefix3, primaryKeys,
     }
   });
 }
-function detectModifications(baseRow, currentRow, columnMap, primaryKeys, caseInsensitive) {
+function detectModifications(baseRow, currentRow, columnMap, primaryKeys) {
   let isModified = false;
   for (const [name, column] of Object.entries(columnMap)) {
     if (name === "index") continue;
-    if (isPrimaryKey(name, primaryKeys, caseInsensitive)) continue;
+    if (isPrimaryKey(name, primaryKeys)) continue;
     const { baseKey, currentKey } = getComparisonKeys(column);
     if (baseKey === "unknown" || currentKey === "unknown") continue;
     const baseValue = baseRow[baseKey];
@@ -2719,7 +2702,6 @@ function buildDiffRows(config) {
     currentColumns,
     columnMap,
     primaryKeys,
-    caseInsensitive = false,
     changedOnly = false
   } = config;
   const mergedMap = mergeKeysWithStatus(
@@ -2739,14 +2721,7 @@ function buildDiffRows(config) {
       __status: void 0
     };
     if (baseRow) {
-      populateRowValues(
-        row,
-        baseRow,
-        baseColumns,
-        "base__",
-        primaryKeys,
-        caseInsensitive
-      );
+      populateRowValues(row, baseRow, baseColumns, "base__", primaryKeys);
     }
     if (currentRow) {
       populateRowValues(
@@ -2754,8 +2729,7 @@ function buildDiffRows(config) {
         currentRow,
         currentColumns,
         "current__",
-        primaryKeys,
-        caseInsensitive
+        primaryKeys
       );
     }
     if (!baseRow) {
@@ -2769,8 +2743,7 @@ function buildDiffRows(config) {
         baseRow,
         currentRow,
         columnMap,
-        primaryKeys,
-        caseInsensitive
+        primaryKeys
       );
       if (isModified) {
         row.__status = "modified";
@@ -3041,25 +3014,28 @@ function validateToDataDiffGridInputs(base, current, options) {
   }
 }
 function validateToValueDiffGridInputs(df, primaryKeys) {
-  validateDataFrame(df, "dataframe");
+  if (!df) {
+    throw new DataGridValidationError("DataFrame is required for value diff");
+  }
+  validateDataFrame(df);
+  if (!primaryKeys || primaryKeys.length === 0) {
+    throw new DataGridValidationError(
+      "Primary keys are required for value diff"
+    );
+  }
   validatePrimaryKeyConfig(primaryKeys, df.columns, {
     required: true,
-    caseInsensitive: true,
-    // valuediff uses case-insensitive matching
     context: "toValueDiffGrid"
   });
-  const columnKeysLower = df.columns.map((c) => c.key.toLowerCase());
-  const hasInA = columnKeysLower.includes("in_a");
-  const hasInB = columnKeysLower.includes("in_b");
-  if (!hasInA || !hasInB) {
+  const columnKeys = df.columns.map((c) => c.key);
+  if (!columnKeys.includes("in_a")) {
     throw new DataGridValidationError(
-      "Joined DataFrame must have IN_A and IN_B columns",
-      "toValueDiffGrid",
-      {
-        hasInA,
-        hasInB,
-        availableColumns: df.columns.map((c) => c.key)
-      }
+      "Value diff DataFrame must include lowercase 'in_a' column"
+    );
+  }
+  if (!columnKeys.includes("in_b")) {
+    throw new DataGridValidationError(
+      "Value diff DataFrame must include lowercase 'in_b' column"
     );
   }
 }
@@ -3089,26 +3065,17 @@ function toDataDiffGrid(_base, _current, options) {
       currentMap[String(row._index)] = row;
     });
   } else {
-    const basePKKeys = validatePrimaryKeys(base.columns, primaryKeys, false);
+    const basePKKeys = validatePrimaryKeys(base.columns, primaryKeys);
     baseData.forEach((row) => {
-      const key = getPrimaryKeyValue(base.columns, basePKKeys, row, false);
+      const key = getPrimaryKeyValue(base.columns, basePKKeys, row);
       if (key in baseMap) {
         invalidPKeyBase = true;
       }
       baseMap[key] = row;
     });
-    const currentPKKeys = validatePrimaryKeys(
-      current.columns,
-      primaryKeys,
-      false
-    );
+    const currentPKKeys = validatePrimaryKeys(current.columns, primaryKeys);
     currentData.forEach((row) => {
-      const key = getPrimaryKeyValue(
-        current.columns,
-        currentPKKeys,
-        row,
-        false
-      );
+      const key = getPrimaryKeyValue(current.columns, currentPKKeys, row);
       if (key in currentMap) {
         invalidPKeyCurrent = true;
       }
@@ -3122,8 +3089,6 @@ function toDataDiffGrid(_base, _current, options) {
     currentColumns: current.columns,
     columnMap,
     primaryKeys,
-    caseInsensitive: false,
-    // querydiff uses exact matching
     changedOnly
   });
   const columnConfigs = getDisplayColumns({
@@ -3134,7 +3099,6 @@ function toDataDiffGrid(_base, _current, options) {
     changedOnly,
     rowStats,
     excludeColumns: ["index"],
-    caseInsensitive: false,
     strictMode: false
     // querydiff is lenient with missing columns
   });
@@ -3150,8 +3114,7 @@ function toDataDiffGrid(_base, _current, options) {
       pinnedColumns,
       onPrimaryKeyChange: options?.onPrimaryKeyChange,
       onPinnedColumnsChange: options?.onPinnedColumnsChange,
-      onColumnsRenderModeChanged: options?.onColumnsRenderModeChanged,
-      caseInsensitive: false
+      onColumnsRenderModeChanged: options?.onColumnsRenderModeChanged
     }
   });
   return {
@@ -3805,15 +3768,15 @@ function toValueDiffGrid(df, primaryKeys, options) {
   const columnMap = buildJoinedColumnMap(df);
   const baseMap = {};
   const currentMap = {};
-  const primaryKeyKeys = validatePrimaryKeys(df.columns, primaryKeys, true);
-  const inBaseIndex = columnMap.IN_A.key;
-  const inCurrentIndex = columnMap.IN_B.key;
+  const primaryKeyKeys = validatePrimaryKeys(df.columns, primaryKeys);
+  const inBaseKey = columnMap.in_a.key;
+  const inCurrentKey = columnMap.in_b.key;
   transformedData.forEach((row) => {
-    const key = getPrimaryKeyValue(df.columns, primaryKeyKeys, row, true);
-    if (getCaseInsensitive(row, inBaseIndex)) {
+    const key = getPrimaryKeyValue(df.columns, primaryKeyKeys, row);
+    if (row[inBaseKey]) {
       baseMap[key.toLowerCase()] = row;
     }
-    if (getCaseInsensitive(row, inCurrentIndex)) {
+    if (row[inCurrentKey]) {
       currentMap[key.toLowerCase()] = row;
     }
   });
@@ -3822,11 +3785,8 @@ function toValueDiffGrid(df, primaryKeys, options) {
     currentMap,
     baseColumns: df.columns,
     currentColumns: df.columns,
-    // Same columns for joined data
     columnMap,
     primaryKeys,
-    caseInsensitive: true,
-    // valuediff uses case-insensitive
     changedOnly
   });
   const columnConfigs = getDisplayColumns({
@@ -3836,24 +3796,21 @@ function toValueDiffGrid(df, primaryKeys, options) {
     columnsRenderMode,
     changedOnly,
     rowStats,
-    excludeColumns: ["IN_A", "IN_B", "in_a", "in_b"],
-    caseInsensitive: true,
+    excludeColumns: ["in_a", "in_b"],
+    // Only lowercase needed
     strictMode: true
-    // valuediff requires columns to exist
   });
   const { columns } = buildDiffColumnDefinitions({
     columns: columnConfigs,
     displayMode,
     allowIndexFallback: false,
-    // valuediff requires PKs
     baseTitle: options?.baseTitle,
     currentTitle: options?.currentTitle,
     headerProps: {
-      primaryKeys: primaryKeys.map((k) => k.toLowerCase()),
+      primaryKeys,
       pinnedColumns,
       onPinnedColumnsChange: options?.onPinnedColumnsChange,
-      onColumnsRenderModeChanged: options?.onColumnsRenderModeChanged,
-      caseInsensitive: true
+      onColumnsRenderModeChanged: options?.onColumnsRenderModeChanged
     }
   });
   return {
@@ -9942,7 +9899,7 @@ var PrivateLoadableRunView = ({
   const isQuery = run?.type === "query" || run?.type === "query_diff" || run?.type === "query_base";
   const { ref, onCopyToClipboard, onMouseEnter, onMouseLeave } = useCopyToClipboardButton();
   const disableCopyToClipboard = !runId || !run?.result || !!error || tabValue !== "result";
-  return /* @__PURE__ */ jsxs(Flex, { direction: "column", children: [
+  return /* @__PURE__ */ jsxs(Flex, { direction: "column", height: "100%", children: [
     showSingleEnvironmentSetupNotification && /* @__PURE__ */ jsx(SingleEnvironmentSetupNotification, { runType: run?.type }),
     /* @__PURE__ */ jsx(
       Tabs.Root,