@etsoo/materialui 1.0.70 → 1.0.72

package/lib/pages/ViewPage.d.ts

@@ -29,7 +29,11 @@ export interface ViewPageField<T extends object> extends GridProps {
      */
     renderProps?: GridColumnRenderProps;
 }
-declare type ViewPageFieldType<T extends object> = (string & keyof T) | [string & keyof T, GridDataType, GridColumnRenderProps?, RowType?] | ViewPageField<T>;
+declare type ViewPageFieldTypeNarrow<T extends object> = (string & keyof T) | [string & keyof T, GridDataType, GridColumnRenderProps?, RowType?] | ViewPageField<T>;
+/**
+ * View page field type
+ */
+export declare type ViewPageFieldType<T extends object> = ViewPageFieldTypeNarrow<T> & ((data: T) => React.ReactNode);
 /**
  * View page props
  */

package/lib/pages/ViewPage.js

@@ -92,6 +92,10 @@ export function ViewPage(props) {
                 }
             } }, fields.map((field, index) => {
             // Get data
+            if (typeof field === 'function') {
+                // Most flexible way, do whatever you want
+                return field(data);
+            }
             const [itemData, itemLabel, gridProps] = getItemField(field, data);
             // Some callback function may return '' instead of undefined
             if (itemData == null || itemData === '')

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@etsoo/materialui",
-    "version": "1.0.70",
+    "version": "1.0.72",
     "description": "TypeScript Material-UI Implementation",
     "main": "lib/index.js",
     "types": "lib/index.d.ts",

package/src/pages/ViewPage.tsx

@@ -48,11 +48,17 @@ export interface ViewPageField<T extends object> extends GridProps {
     renderProps?: GridColumnRenderProps;
 }
 
-type ViewPageFieldType<T extends object> =
+type ViewPageFieldTypeNarrow<T extends object> =
     | (string & keyof T)
     | [string & keyof T, GridDataType, GridColumnRenderProps?, RowType?]
     | ViewPageField<T>;
 
+/**
+ * View page field type
+ */
+export type ViewPageFieldType<T extends object> = ViewPageFieldTypeNarrow<T> &
+    ((data: T) => React.ReactNode);
+
 /**
  * View page props
  */
@@ -115,7 +121,7 @@ function getResp(singleRow: RowType) {
 }
 
 function getItemField<T extends object>(
-    field: ViewPageFieldType<T>,
+    field: ViewPageFieldTypeNarrow<T>,
     data: T
 ): [React.ReactNode, React.ReactNode, GridProps] {
     // Item data and label
@@ -229,6 +235,11 @@ export function ViewPage<T extends DataTypes.StringRecord>(
                     >
                         {fields.map((field, index) => {
                             // Get data
+                            if (typeof field === 'function') {
+                                // Most flexible way, do whatever you want
+                                return field(data);
+                            }
+
                             const [itemData, itemLabel, gridProps] =
                                 getItemField(field, data);