Merge pull request #131 from yildirims/master

This closes #123
mbrn · Dec 24, 2018 · c9ec79c · c9ec79c
2 parents afad0a0 + 818e035
commit c9ec79c
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 4 deletions.
diff --git a/docz/examples/02-example-column-types.mdx b/docz/examples/02-example-column-types.mdx
@@ -52,11 +52,14 @@ import MaterialTable from '../../src/material-table'
     columns={[
       {title: 'Name', field: 'name'},
       {title: 'Surname', field: 'surname'},
-      {title: 'Expenses', field: 'expenses', type: 'currency', currencySetting:{locale:'tr-TR',currencyCode:'TRY',minimumFractionDigits:2,maximumFractionDigits:3}},    
+      {title: 'Expenses', field: 'expenses', type: 'currency', currencySetting: { locale: 'tr-TR', currencyCode: 'TRY', minimumFractionDigits: 2, maximumFractionDigits: 3 }, emptyValue: 'N/A'},
+      {title: 'EmptyValue', field: 'emptyVal', emptyValue : () => 'Empty Value Function' }     
     ]}
     data={[
-      {name: 'Mehmet', surname: 'Baran', expenses:3500.555 },
-      {name: 'Selahattin', surname: 'Yıldırım', expenses:2702.5575 },
+      {name: 'Mehmet', surname: 'Baran', expenses: 3500.555, emptyVal: 'Empty' },
+      {name: 'Selahattin', surname: 'Yıldırım', expenses: 2702.5575, emptyVal: '' },
+      {name: 'Jake', surname: 'Leventhal', expenses: null, emptyVal: null },
+      {name: 'Selahattin', surname: 'Yıldırım', expenses: null, emptyVal: null }
     ]}
     title="Currency"
     options={{

diff --git a/docz/props.mdx b/docz/props.mdx
@@ -54,6 +54,7 @@ import MaterialTable from '../src/material-table'
 |                 |                 |           | 'locale' represents language tag, currencyCode represents ISO 4217 currency codes,                            |
 |                 |                 |           | minimumFractionDigits represents the min number of fraction digits to use Possible values are from 0 to 20    |
 |                 |                 |           | maximumFractionDigits represents the max number of fraction digits to use. Possible values are from 0 to 20   |
+|emptyValue       |string or func   |           | When data is empty or undefined, string value or function result can be set as default value                  |
 
 ### components
 

diff --git a/index.d.ts b/index.d.ts
@@ -37,6 +37,7 @@ export interface Column {
   type?: 'boolean' | 'numeric' | 'date' | 'datetime' | 'time' | 'currency';
   searchable?: boolean;
   currencySetting?:{ locale?: string,currencyCode?: string,minimumFractionDigits?:number,maximumFractionDigits?:number};
+  emptyValue?:  any | ((data: any) => any);
 }
 
 export interface Components {

diff --git a/src/m-table-cell.js b/src/m-table-cell.js
@@ -6,6 +6,9 @@ import PropTypes from 'prop-types';
 
 export default class MTableCell extends React.Component {
   getRenderValue() {
+    if (this.props.columnDef.emptyValue !== undefined && (this.props.value === undefined || this.props.value === null)) {
+      return this.getEmptyValue(this.props.columnDef.emptyValue);
+    }
     if (this.props.columnDef.render) {
       return this.props.columnDef.render(this.props.rowData);
     } else if (this.props.columnDef.type === 'boolean') {
@@ -40,6 +43,14 @@ export default class MTableCell extends React.Component {
     return this.props.value;
   }
 
+  getEmptyValue(emptyValue) {
+    if (typeof emptyValue === 'function') {
+      return this.props.columnDef.emptyValue(this.props.rowData);
+    } else {
+      return emptyValue;
+    }
+  }
+
   getCurrencyValue(currencySetting, value) {
     if (currencySetting !== undefined) {
       return new Intl.NumberFormat((currencySetting.locale !== undefined) ? currencySetting.locale : 'en-US',

diff --git a/src/material-table.js b/src/material-table.js
@@ -442,7 +442,8 @@ MaterialTable.propTypes = {
       currencyCode: PropTypes.string,
       minimumFractionDigits: PropTypes.number,
       maximumFractionDigits: PropTypes.number
-    })
+    }),
+    emptyValue:PropTypes.oneOfType([PropTypes.string,PropTypes.func])
   })).isRequired,
   components: PropTypes.shape({
     Actions: PropTypes.oneOfType([PropTypes.element, PropTypes.func]),