@linzjs/step-ag-grid 29.8.0 → 29.9.0

package/package.json

@@ -2,7 +2,7 @@
   "name": "@linzjs/step-ag-grid",
   "repository": "github:linz/step-ag-grid.git",
   "license": "MIT",
-  "version": "29.8.0",
+  "version": "29.9.0",
   "keywords": [
     "aggrid",
     "ag-grid",

package/src/components/GridCell.tsx

@@ -33,10 +33,15 @@ export const GridCellRenderer = (props: ICellRendererParams) => {
   const colDef = props.colDef as ColDef;
 
   const rendererParams = colDef.cellRendererParams as GenericCellRendererParams<any> | undefined;
+  const errorFn = rendererParams?.error;
+  let errorText = props.data !== undefined && errorFn ? errorFn(props) : undefined;
   const warningFn = rendererParams?.warning;
   let warningText = props.data !== undefined && warningFn ? warningFn(props) : undefined;
   const infoFn = rendererParams?.info;
   let infoText = props.data !== undefined && infoFn ? infoFn(props) : undefined;
+  if (Array.isArray(errorText)) {
+    errorText = errorText.join('\n');
+  }
   if (Array.isArray(warningText)) {
     warningText = warningText.join('\n');
   }
@@ -48,6 +53,9 @@ export const GridCellRenderer = (props: ICellRendererParams) => {
     <GridLoadableCell />
   ) : (
     <>
+      {!!errorText && (
+        <GridIcon icon={'ic_error_outline'} title={typeof errorText === 'string' ? errorText : 'Error'} />
+      )}
       {!!warningText && (
         <GridIcon icon={'ic_warning_outline'} title={typeof warningText === 'string' ? warningText : 'Warning'} />
       )}
@@ -79,6 +87,7 @@ export interface ColDefT<TData extends GridBaseRow, ValueType = any> extends Col
     originalCellRenderer?: any;
     editAction?: (selectedRows: TData[]) => void;
     shortcutKeys?: Record<string, () => void>;
+    error?: (props: ICellRendererParams<TData, ValueType>) => ReactElement | string | false | null | undefined;
     warning?: (props: ICellRendererParams<TData, ValueType>) => ReactElement | string | false | null | undefined;
     info?: (props: ICellRendererParams<TData, ValueType>) => ReactElement | string | false | null | undefined;
   };

package/src/components/gridRender/GridRenderGenericCell.tsx

@@ -13,6 +13,7 @@ export interface GenericCellRendererParams<TData extends GridBaseRow> {
   rightHoverElement?: ReactElement | undefined;
   editAction?: (selectedRows: TData[]) => void;
   shortcutKeys?: Record<string, ((params: SuppressKeyboardEventParams) => boolean | void) | undefined>;
+  error?: (props: ICellRendererParams<TData>) => string | string[] | boolean | null | undefined;
   warning?: (props: ICellRendererParams<TData>) => string | string[] | boolean | null | undefined;
   info?: (props: ICellRendererParams<TData>) => string | string[] | boolean | null | undefined;
 }

package/src/stories/grid/GridReadOnly.stories.tsx

@@ -83,6 +83,7 @@ const GridReadOnlyTemplate: StoryFn<typeof Grid<ITestRow>> = (props: GridProps<I
         field: 'position',
         headerName: 'Position',
         cellRendererParams: {
+          error: ({ value }) => value === 'Manager' && 'Managers need management',
           warning: ({ value }) => value === 'Tester' && 'Testers are testing',
           info: ({ value }) => value === 'Developer' && 'Developers are awesome',
         },

package/src/styles/GridIcon.scss

@@ -24,6 +24,16 @@
   fill: lui.$warning;
 }
 
+.AgGridGenericCellRenderer-ic_error_Icon {
+  margin-right: 4px;
+  fill: lui.$error;
+}
+
+.AgGridGenericCellRenderer-ic_error_outlineIcon {
+  margin-right: 4px;
+  fill: lui.$error;
+}
+
 .GridIcon-disabled {
   fill: lui.$silver !important;
 }