@simoncomputing/mui-bueno-v2 0.25.12 → 0.25.14

package/CHANGELOG.md

@@ -11,6 +11,23 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Minor increment --> singlular/minor changes. Minimal breaking changes.
 - Patch increment --> singlular/minor changes. Zero breaking changes.
 
+## [0.25.14] - 2026-02-23
+
+### Added
+
+- `DiffTableView`
+    - used to display array of `DiffObj<T>`
+- Utility functions
+    - `baseCitationTableColumns` - builds column definition for Citation table
+    - `buildTableDiff` - calculates diff definitions for table
+
+## [0.25.13] - 2026-02-20
+
+### Fixed
+
+- `DiffTable`, `DiffCitationTable`
+    - Fixed deletions being labeled as additions
+
 ## [0.25.12] - 2026-02-19
 
 ### Added

package/dist/components/Form/Inputs/CitationField/CitationManager/CitationTable.d.ts

@@ -73,6 +73,11 @@ export type CitationTableProps = Omit<BaseCitationManagerApiProps, 'onCreateCita
 };
 declare const CitationTable: (props: CitationTableProps) => import("react/jsx-runtime").JSX.Element;
 export default CitationTable;
+/**
+ * Column definition for the Citation table.
+ *
+ * Used by `CitationManager`, `SelectableCitationManager`, `CitationField`, `DiffCitationTable`.
+ */
 export declare const baseCitationTableColumns: (palette: Palette, condenseTable?: boolean) => ({
     fieldName: string;
     key: string;

package/dist/components/Table/DiffTable/DiffTable.d.ts

@@ -1,51 +1,17 @@
-import { ReactNode } from 'react';
-import { TableProps } from '../Table';
-import { DiffTableConfig } from '../../../@types';
-export type ChangeType = 'added' | 'deleted' | 'modified';
-export type DiffObj<T> = T & {
-    changeType: ChangeType;
-    modifiedDiff?: Record<string, ReactNode>;
-};
-export type TableDiff<T> = {
-    changeType: ChangeType;
-    obj: T;
-};
-export type DiffTableProps<T> = {
-    beforeData: T[];
-    afterData: T[];
-    /**
-     * See Table.columns
-     */
-    columns: DiffTableConfig<T>;
-    /**
-     * Used to override the internal check for whether a row has been modified or not.
-     *
-     * It's highly recommended to implement this when `renderExpand` is implemented, especially
-     * if ignoreDiff is enabled on all columns.
-     */
-    isEqual?: (obj1: T, obj2: T) => boolean;
-} & Pick<TableProps<T>, 'renderExpand' | 'emptyTableMsg' | 'size'>;
+import { BaseDiffTableProps, DiffTableInput } from './utils';
+export type DiffTableProps<T> = BaseDiffTableProps<T> & Omit<DiffTableInput<T>, 'isMobileScreen'>;
 /**
- * Used to display changes (additions, modifications, removals) for a set of data.
+ * Convenience wrapper for DiffTableView. Computes changes (additions, modifications, removals) between 2 sets of
+ * data and displays the difference in a table. Data sets MUST be objects with an id property.
  *
- * Adds a new column (left) that denotes whether a row was added, changed or removed. Any unchanged
- * rows will be counted and displayed at the bottom, under the table.
+ * NOTE: If you already have computed the diff in your parent component and/or need access to the diff output, use `DiffTableView` instead.
+ *
+ * - A new column (left) that denotes whether a row was added, changed or removed.
+ * - Any unchanged rows will be counted and displayed at the bottom, under the table.
+ * - Updates cell render function to show diff notation for modified rows.
+ * - Updates renderExpand, if provided, to show diff notation for modified rows.
  *
- * Data sets MUST be objects with an id property.
  */
 export declare const DiffTable: <T extends {
     id: number;
 }>(props: DiffTableProps<T>) => import("react/jsx-runtime").JSX.Element;
-/**
- * Returns an array of only the Added/Modified/Deleted objects between dataA & dataB (with each
- * object marked as Added/Modified/Deleted), AND a count of the number of unchanged objects in both
- * dataA & dataB.
- *
- * IMPORTANT: Data arrays (dataA & dataB) must contain objects with a valid id.
- */
-export declare const buildDiffData: <T extends {
-    id: number;
-}>(columns: DiffTableConfig<T>, dataA: T[], dataB: T[], isMobileScreen?: boolean, isEqual?: (obj1: T, obj2: T) => boolean) => {
-    dataDiff: DiffObj<T>[];
-    unmodifiedCount: number;
-};

package/dist/components/Table/DiffTable/DiffTableView/DiffTableView.d.ts

@@ -0,0 +1,16 @@
+import { BaseDiffTableProps, DiffTableOutput } from '../utils';
+export type DiffTableViewProps<T> = BaseDiffTableProps<T> & DiffTableOutput<T>;
+/**
+ * Used to display an array of DiffObj<T> (additions, modifications, removals).
+ * NOTE: If possible, use the convenience wrapper `DiffTable` instead. Only use this
+ * component if you need to compute the diff yourself, or you need to access the data, unmodifiedCount, etc.
+ *
+ * Once the diff is computed, the following table will be displayed:
+ * - A new column (left) that denotes whether a row was added, changed or removed.
+ * - Any unchanged rows will be counted and displayed at the bottom, under the table.
+ * - Updates cell render function to show diff notation for modified rows.
+ * - Updates renderExpand, if provided, to show diff notation for modified rows.
+ */
+export declare const DiffTableView: <T extends {
+    id: number;
+}>({ columns, data, emptyTableMsg, renderExpand, size, unmodifiedCount, }: DiffTableViewProps<T>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Table/DiffTable/utils.d.ts

@@ -0,0 +1,64 @@
+import { DiffTableConfig } from '../../../@types';
+import { SvgIcon } from '@mui/material';
+import { ReactNode } from 'react';
+import { TableProps } from '../Table';
+export type ChangeType = 'added' | 'deleted' | 'modified';
+export type DiffObj<T> = T & {
+    changeType: ChangeType;
+    modifiedDiff?: Record<string, ReactNode>;
+};
+export type TableDiff<T> = {
+    changeType: ChangeType;
+    obj: T;
+};
+export declare const ChangeMap: {
+    [key: string]: {
+        icon: typeof SvgIcon;
+        label: string;
+        color: 'success' | 'error' | 'info';
+    };
+};
+/**
+ * Returns an array of only the Added/Modified/Deleted objects between dataA & dataB (with each
+ * object marked as Added/Modified/Deleted), AND a count of the number of unchanged objects in both
+ * dataA & dataB.
+ *
+ * IMPORTANT: Data arrays (dataA & dataB) must contain objects with a valid id.
+ */
+export declare const buildDiffData: <T extends {
+    id: number;
+}>(columns: DiffTableConfig<T>, dataA: T[], dataB: T[], isMobileScreen?: boolean, isEqual?: (obj1: T, obj2: T) => boolean) => {
+    dataDiff: DiffObj<T>[];
+    unmodifiedCount: number;
+};
+export type DiffTableInput<T> = {
+    beforeData: T[];
+    afterData: T[];
+    /**
+     * See Table.columns
+     */
+    columns: DiffTableConfig<T>;
+    /**
+     * Used to override the internal check for whether a row has been modified or not.
+     *
+     * It's highly recommended to implement this when `renderExpand` is implemented, especially
+     * if ignoreDiff is enabled on all columns.
+     */
+    isEqual?: (obj1: T, obj2: T) => boolean;
+    isMobileScreen?: boolean;
+} & Pick<TableProps<T>, 'renderExpand' | 'size'>;
+export type DiffTableOutput<T> = {
+    unmodifiedCount: number;
+    columns: DiffTableConfig<T>;
+    data: DiffObj<T>[];
+    renderExpand?: (item: DiffObj<T>) => React.ReactNode;
+};
+/**
+ * Converts regular table props into diff version (adds Change Type column, updates render and renderExpand to use diff notation)
+ *
+ * Used by `DiffTable`, `DiffCitationTable`.
+ */
+export declare const buildTableDiff: <T extends {
+    id: number;
+}>(props: DiffTableInput<T>) => DiffTableOutput<T>;
+export type BaseDiffTableProps<T> = Pick<TableProps<T>, 'emptyTableMsg' | 'size'>;